/* =========================================================================
 * ロトライフ — デザインA「宝くじ券」テーマ
 *   既存の画面構造（JSX）はそのままに、<body class="theme-ticket"> で見た目だけ差し替える。
 *   明るい紙 × 朱と墨。ミシン目・半券・切り欠き・スタンプで「くじを引く」手触り。
 * ========================================================================= */
@import url('https://fonts.googleapis.com/css2?family=Shippori+Mincho+B1:wght@700;800&display=swap');

.theme-ticket {
  --paper: #F4EFE3;
  --card: #FFFCF4;
  --ink: #1A1712;
  --ink-2: #3E382E;
  --muted: #8A8172;
  --line: #E2D9C6;
  --line-2: #EEE6D5;
  --accent: #C8321E;
  --accent-soft: #F7DDD3;
  --gold: #B07D1E;
  --pos: #23744B;
  --neg: #B4321E;
  --night: #1A1712;
  --serif: 'Shippori Mincho B1', 'Hiragino Mincho ProN', serif;
  --tk-shadow: 0 1px 0 rgba(60,40,10,.05), 0 10px 22px -14px rgba(60,40,10,.45);
}
.theme-ticket body, body.theme-ticket { background: #E8E1D1; }
.theme-ticket .shell {
  background-color: var(--paper);
  background-image: radial-gradient(rgba(120,90,40,.05) 1px, transparent 1px);
  background-size: 6px 6px;
}

/* ---------- 書体: 見出しは明朝 ---------- */
.theme-ticket .screen-h h2,
.theme-ticket .section-h h3,
.theme-ticket .goal-name,
.theme-ticket .alloc-name,
.theme-ticket .sk-ttl b,
.theme-ticket .sheet-head h3,
.theme-ticket .rt-title,
.theme-ticket .uname { font-family: var(--serif); font-weight: 800; letter-spacing: .02em; }
.theme-ticket .screen-h h2 { font-size: 27px; }
.theme-ticket .section-h h3 { font-size: 17.5px; }
.theme-ticket .section-h h3::before { content: '◆'; color: var(--accent); font-size: 12.5px; margin-right: 6px; vertical-align: 2px; }
.theme-ticket .eyebrow { letter-spacing: .22em; }
.theme-ticket .wordmark { font-family: var(--serif); font-weight: 800; letter-spacing: -.01em; }
.theme-ticket .wordmark .dot { color: var(--accent); }

/* ---------- 券面カード（共通） ---------- */
.theme-ticket .m,
.theme-ticket .flow,
.theme-ticket .goal,
.theme-ticket .feed,
.theme-ticket .alloc-card,
.theme-ticket .cf,
.theme-ticket .last-card,
.theme-ticket .lv-list,
.theme-ticket .spm-row,
.theme-ticket .dex-card:not(.lock),
.theme-ticket .badge-card:not(.lock),
.theme-ticket .sk-card:not(.lock) {
  background: var(--card);
  border-radius: 12px;
  box-shadow: var(--tk-shadow);
}
.theme-ticket .row { border-bottom: 1.5px dashed var(--line); }

/* 切り欠き（左右の半円）: 券らしさ */
.theme-ticket .flow, .theme-ticket .cf, .theme-ticket .alloc-card, .theme-ticket .last-card, .theme-ticket .goal { position: relative; }
.theme-ticket .flow::before, .theme-ticket .flow::after,
.theme-ticket .cf::before, .theme-ticket .cf::after,
.theme-ticket .last-card::before, .theme-ticket .last-card::after {
  content: ''; position: absolute; top: 50%; width: 14px; height: 14px; margin-top: -7px; border-radius: 50%; background: var(--paper); pointer-events: none;
}
.theme-ticket .flow::before, .theme-ticket .cf::before, .theme-ticket .last-card::before { left: -7px; }
.theme-ticket .flow::after, .theme-ticket .cf::after, .theme-ticket .last-card::after { right: -7px; }

/* ---------- ヘッダー ---------- */
.theme-ticket .topbar .tag { border-radius: 3px; background: transparent; box-shadow: inset 0 0 0 1.5px var(--ink); color: var(--ink); font-weight: 900; }
.theme-ticket .topbar .tag.dark { background: var(--ink); color: var(--card); }
.theme-ticket .topbar .tag.acc { box-shadow: inset 0 0 0 1.5px var(--accent); color: var(--accent); background: transparent; transform: rotate(-4deg); }
.theme-ticket .mode-chip { border-radius: 4px; }
.theme-ticket .age-big { font-size: 84px; }
.theme-ticket .price-chip { border-radius: 4px; box-shadow: inset 0 0 0 1px currentColor; }

/* ---------- 月収・生活費 ---------- */
.theme-ticket .metrics { gap: 10px; }

/* ---------- 貯金残高 = 半券つきの券 ---------- */
.theme-ticket .m.savings {
  background: var(--card); color: var(--ink); box-shadow: var(--tk-shadow);
  padding-right: 96px; overflow: hidden;
}
.theme-ticket .m.savings::before { /* ミシン目 */
  content: ''; position: absolute; top: 10px; bottom: 10px; right: 84px; border-left: 2px dashed var(--line);
}
.theme-ticket .m.savings::after { /* 切り欠き（上下） */
  content: ''; position: absolute; right: 77px; top: -8px; width: 16px; height: 16px; border-radius: 50%; background: var(--paper);
  box-shadow: 0 calc(100% + 0px) 0 0 var(--paper);
}
.theme-ticket .m.savings .m-label { color: var(--muted); }
.theme-ticket .m.savings .m-label > span:nth-child(2) { /* 半券に縦書きスタンプ（直下の2つ目のみ） */
  position: absolute; right: 16px; top: 50%; transform: translateY(-50%) rotate(-6deg);
  writing-mode: vertical-rl; font-family: var(--serif); font-weight: 800; font-size: 15px; letter-spacing: .12em;
  color: var(--accent); border: 2px solid var(--accent); border-radius: 6px; padding: 8px 4px; line-height: 1.1; background: var(--card);
}
.theme-ticket .m.savings .m-val { font-size: 34px; }
.theme-ticket .m.savings .m-sub { color: var(--muted); }

/* ---------- QOL ---------- */
.theme-ticket .m.qol { box-shadow: var(--tk-shadow); }
.theme-ticket .qol-band { border-radius: 3px; }

/* ---------- 宝くじ累計収支 = 墨色の券 ---------- */
.theme-ticket .m.pnl { background: var(--ink); color: var(--card); box-shadow: 0 14px 28px -14px rgba(20,14,6,.7); }
.theme-ticket .m.pnl .m-label, .theme-ticket .m.pnl .pnl-k { color: #A99F8C; }
.theme-ticket .m.pnl .pnl-rate { border-left: 2px dashed #3E372C; }
.theme-ticket .m.pnl .pnl-net.neg, .theme-ticket .m.pnl .pnl-rv.neg { color: #FF8A73; }
.theme-ticket .m.pnl .pnl-net.pos, .theme-ticket .m.pnl .pnl-rv.pos { color: #6FD3A0; }
.theme-ticket .m.pnl .pnl-bar { background: linear-gradient(to right, #3A2621 0 50%, #1F3328 50% 100%) !important; }
.theme-ticket .m.pnl .pnl-bar b { background: var(--card); }
.theme-ticket .m.pnl .pnl-scale { color: #8A8172; }
.theme-ticket .m.pnl .pnl-scale span:nth-child(2) { color: var(--card); }
.theme-ticket .m.pnl .pnl-best { background: #2A241C; box-shadow: inset 0 0 0 1px #3E372C; }
.theme-ticket .m.pnl .pnl-best-k { background: var(--gold); border-radius: 3px; }
.theme-ticket .m.pnl .pnl-win { background: #2A241C; }
.theme-ticket .m.pnl .pnl-win-in.idle .pnl-win-txt { color: #8A8172; }
.theme-ticket .m.pnl .pnl-win-txt { color: #F2E9D8; }
.theme-ticket .m.pnl .pnl-win-amt { color: #FF8A73; }
.theme-ticket .m.pnl .pnl-sub > div { background: #2A241C; }
.theme-ticket .m.pnl .pnl-sk { color: #A99F8C; }
.theme-ticket .m.pnl .pnl-sk .seg, .theme-ticket .m.pnl .tag { background: #3E372C; color: #D8CFBD; }
.theme-ticket .m.pnl .pnl-sk .seg button.on { background: var(--card); color: var(--ink); }
.theme-ticket .m.pnl .m-sub { color: #8A8172; }

/* ---------- お金の流れ = 今月の券 ---------- */
.theme-ticket .cf-bar { border-radius: 2px; }
.theme-ticket .cf-res { border-radius: 8px; background: transparent; box-shadow: inset 0 0 0 2px var(--accent); }
.theme-ticket .cf-buy { border-top: 2px dashed var(--line); }
.theme-ticket .cf-item .chip { background: transparent; color: var(--ink); box-shadow: inset 0 0 0 1.5px var(--ink); border-radius: 3px; }
.theme-ticket .cf-item.jf .chip, .theme-ticket .cf-item.jf-sub .chip { background: var(--gold); color: #fff; box-shadow: none; }

/* ---------- 当選履歴・図鑑 ---------- */
.theme-ticket .feed-item { border-bottom: 1.5px dashed var(--line); }
.theme-ticket .feed-item .chip { border-radius: 3px; }
.theme-ticket .dex-card .dc { font-family: var(--serif); font-weight: 800; }

/* ---------- 操作エリア ---------- */
.theme-ticket .dock { background: var(--card); border-top: 1px solid var(--line); }
.theme-ticket .play { border-radius: 50%; background: var(--accent); box-shadow: 0 6px 14px -6px rgba(200,50,30,.7); }
.theme-ticket .play.paused { background: var(--ink); box-shadow: none; }
.theme-ticket .tabs button.on { color: var(--accent); }
.theme-ticket .tabs button.on::before { width: 100%; height: 3px; border-radius: 0; top: -1px; }
.theme-ticket .ad-anchor { background: var(--card); }

/* ---------- ボタン ---------- */
.theme-ticket .btn { border-radius: 999px; letter-spacing: .06em; }
.theme-ticket .btn.light { box-shadow: inset 0 0 0 1.5px var(--line); background: var(--card); }
.theme-ticket .btn.ghost { box-shadow: inset 0 0 0 1.5px var(--ink); }
.theme-ticket .seg { border-radius: 999px; }
.theme-ticket .seg button { border-radius: 999px; }

/* ---------- 配分 ---------- */
.theme-ticket .alloc-card { padding: 14px 16px; }
.theme-ticket .alloc-out div, .theme-ticket .bet-c { background: var(--paper); border-radius: 6px; }
.theme-ticket .jf-card { box-shadow: var(--tk-shadow), inset 0 0 0 1.5px var(--gold); }
.theme-ticket .locked { border-radius: 10px; border-style: dashed; border-width: 1.5px; }
.theme-ticket .member-gate { border-radius: 10px; }

/* ---------- スキル帖 ---------- */
.theme-ticket .sk-sum { background: var(--ink); border-radius: 12px; }
.theme-ticket .sk-card { border-radius: 12px; }
.theme-ticket .sk-card::before { width: 0; }
.theme-ticket .sk-head { position: relative; padding-right: 14px; }
.theme-ticket .sk-ic { border-radius: 50%; background: transparent !important; color: var(--tone, var(--ink)); box-shadow: inset 0 0 0 2px currentColor; }
.theme-ticket .sk-card.red .sk-ic { color: var(--accent); } .theme-ticket .sk-card.green .sk-ic { color: var(--pos); } .theme-ticket .sk-card.gold .sk-ic { color: var(--gold); }
.theme-ticket .sk-ic.none { color: var(--muted) !important; }
.theme-ticket .sk-st { border-radius: 3px; }
.theme-ticket .sk-body { border-top: 2px dashed var(--line); }
.theme-ticket .sk-ctl { border-radius: 8px; }
.theme-ticket .lv-n { border-radius: 4px; }

/* ---------- 人生結果: 墨地に券 ---------- */
.theme-ticket .result .flow,
.theme-ticket .result .goal { background: var(--card); color: var(--ink); box-shadow: 0 14px 30px -16px rgba(0,0,0,.8); }
.theme-ticket .result .flow::before, .theme-ticket .result .flow::after { background: var(--night); }
.theme-ticket .result .row { border-color: var(--line); }
.theme-ticket .result .row .k { color: var(--muted); }
.theme-ticket .result .goal-note { color: var(--muted) !important; }
.theme-ticket .result .progress { background: var(--line-2); }
.theme-ticket .result .progress > i { background: var(--ink); }
.theme-ticket .result .pos { color: var(--pos); } .theme-ticket .result .neg { color: var(--neg); }
.theme-ticket .result .check.ng { background: var(--line-2); color: var(--muted); }
.theme-ticket .result .check.ok { background: var(--pos); color: #fff; }
.theme-ticket .result .death-age { font-size: 112px; }
.theme-ticket .result .member-gate.dark { background: var(--accent-soft); color: #7A2414; }
.theme-ticket .result .res-badge { background: var(--card); color: var(--ink); box-shadow: none; }

/* ---------- タイトル ---------- */
.theme-ticket .ticket-strip span { box-shadow: inset 0 0 0 2px var(--ink); background: var(--card); }
.theme-ticket .ticket-strip span.hit { background: var(--accent); box-shadow: none; transform: rotate(-8deg); }
.theme-ticket .acct-chip { border-radius: 4px; box-shadow: inset 0 0 0 1.5px var(--ink); }

/* ---------- ガチャ ---------- */
.theme-ticket .gacha-cell { border-radius: 4px; }
.theme-ticket .gacha-now { border-radius: 10px; box-shadow: var(--tk-shadow); }

/* ---------- シート・オーバーレイ ---------- */
.theme-ticket .sheet { background: var(--paper); }
.theme-ticket .uticket, .theme-ticket .bw-card, .theme-ticket .rt-card { background: var(--card); }
.theme-ticket .toast { border-radius: 10px; }

/* ---------- デザイン切替リンク（PC表示のみ） ---------- */
.design-switch { position: fixed; left: 16px; top: 16px; z-index: 999; display: none; padding: 8px 12px; border-radius: 999px; background: #1A1712; color: #FFFCF4; font: 700 12px 'Zen Kaku Gothic New', sans-serif; text-decoration: none; box-shadow: 0 6px 16px -6px rgba(0,0,0,.4); }
@media (min-width: 900px) { .design-switch { display: inline-block; } }

/* 貯金残高: 左上の見出しを明示（半券スタンプとは別に表示） */
.theme-ticket .m.savings .m-label > span:first-child { position: static; display: inline-flex; align-items: center; gap: 6px; font-family: var(--serif); font-weight: 800; font-size: 16px; letter-spacing: .12em; color: var(--ink); writing-mode: horizontal-tb; transform: none; border: 0; padding: 0; background: none; }
.theme-ticket .m.savings .m-label > span:first-child::before { content: ''; width: 6px; height: 6px; background: var(--accent); transform: rotate(45deg); }
.theme-ticket .m.savings .m-label > span:first-child * { position: static !important; writing-mode: horizontal-tb !important; transform: none !important; border: 0 !important; padding: 0 !important; background: none !important; color: inherit !important; font: inherit !important; }
/* 記録タブの「全人生 累計当選額」カードには半券スタンプを付けない */
.theme-ticket [data-screen-label="SCR-08 記録"] .m.savings { padding-right: 13px; }
.theme-ticket [data-screen-label="SCR-08 記録"] .m.savings::before, .theme-ticket [data-screen-label="SCR-08 記録"] .m.savings::after { display: none; }
.theme-ticket [data-screen-label="SCR-08 記録"] .m.savings .m-label > span:nth-child(2) { position: static; writing-mode: horizontal-tb; transform: none; border: 0; padding: 0; background: none; font: 700 11px var(--sans); color: var(--muted); letter-spacing: 0; }

/* 物価チップ: 文言の途中で改行しない */
.theme-ticket .price-chip { max-width: 240px; }
.theme-ticket .price-chip > span { white-space: nowrap; }

/* =========================== 新トップページ（宝くじ券） =========================== */
.theme-ticket .tt { display: flex; flex-direction: column; height: 100%; padding: calc(18px + var(--safe-t)) 18px calc(18px + var(--safe-b)); overflow-y: auto; }
.theme-ticket .tt::-webkit-scrollbar { width: 0; }
.tt-top { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.tt-brand { font-size: 13.5px; font-weight: 700; letter-spacing: .14em; color: var(--muted); }
.tt-hero { flex: 1; display: flex; flex-direction: column; justify-content: center; gap: 16px; padding: 18px 0 10px; }

.tt-ticket { position: relative; display: grid; grid-template-columns: 1fr 92px; background: var(--card); border-radius: 16px;
  box-shadow: 0 2px 0 rgba(60,40,10,.06), 0 24px 40px -22px rgba(60,40,10,.55); transform: rotate(-1.5deg); animation: ttIn .7s cubic-bezier(.2,1.2,.3,1) both; }
.tt-ticket::before { content: ''; position: absolute; inset: 8px; border: 1.5px solid var(--line); border-radius: 10px; pointer-events: none; }
@keyframes ttIn { from { transform: translateY(30px) rotate(-6deg); opacity: 0; } }
.tt-main { padding: 22px 18px 20px 22px; min-width: 0; position: relative; }
.tt-row { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; }
.tt-kai { font-family: var(--serif); font-weight: 800; font-size: 17px; }
.tt-kai b { color: var(--accent); font-size: 20px; margin: 0 2px; }
.tt-serial { font-size: 14px; color: var(--muted); letter-spacing: .08em; }
.tt-word { font-family: var(--serif); font-weight: 800; font-size: 58px; line-height: .98; letter-spacing: -.02em; margin-top: 10px; }
.tt-word .tt-dot { color: var(--accent); }
.tt-balls { display: flex; gap: 6px; margin-top: 14px; }
.tt-balls span { width: 38px; height: 38px; border-radius: 50%; display: grid; place-items: center; font-family: var(--mono); font-weight: 700; font-size: 18.5px;
  background: var(--paper); box-shadow: inset 0 0 0 2px var(--ink); animation: ttBall .5s cubic-bezier(.3,1.6,.4,1) both; }
.tt-balls span.hit { background: var(--accent); color: #fff; box-shadow: 0 6px 12px -4px rgba(200,50,30,.6); transform: rotate(-10deg); }
@keyframes ttBall { from { transform: translateY(-16px) scale(.4); opacity: 0; } }
.tt-copy { margin-top: 14px; font-size: 17px; font-weight: 700; line-height: 1.75; color: var(--ink-2); }

.tt-stub { position: relative; border-left: 2px dashed var(--line); display: flex; flex-direction: column; align-items: center; justify-content: space-between; padding: 20px 8px 18px; text-align: center; }
.tt-stub::before, .tt-stub::after { content: ''; position: absolute; left: -10px; width: 18px; height: 18px; border-radius: 50%; background: var(--paper); }
.tt-stub::before { top: -9px; } .tt-stub::after { bottom: -9px; }
.tt-stub-k { writing-mode: vertical-rl; font-family: var(--serif); font-weight: 800; font-size: 16px; letter-spacing: .3em; color: var(--muted); }
.tt-stub-q { font-size: 13.5px; font-weight: 700; line-height: 1.5; color: var(--ink-2); }
.tt-stamp { width: 52px; height: 52px; border-radius: 50%; display: grid; place-items: center; font-family: var(--serif); font-weight: 800; font-size: 24px;
  color: var(--accent); box-shadow: inset 0 0 0 2.5px var(--accent), inset 0 0 0 5px var(--card), inset 0 0 0 6.5px var(--accent);
  transform: rotate(-14deg); animation: ttStamp .45s cubic-bezier(.3,1.7,.4,1) .9s both; }
@keyframes ttStamp { from { transform: rotate(-14deg) scale(2.2); opacity: 0; } }

.tt-stats { display: grid; grid-template-columns: .8fr 1.1fr 1.1fr; gap: 8px; animation: fadeUp .6s ease .5s both; }
.tt-stats > div { background: var(--ink); color: var(--card); border-radius: 12px; padding: 10px 12px; min-width: 0; }
.tt-stats span { display: block; font-size: 13px; font-weight: 700; color: #A99F8C; }
.tt-stats b { display: block; font-size: 19px; font-weight: 700; margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tt-stats b small { font-family: var(--sans); font-size: 14px; margin-left: 1px; color: #D8CFBD; }
.tt-how { display: grid; gap: 6px; animation: fadeUp .6s ease .5s both; }
.tt-how > div { display: flex; align-items: center; gap: 10px; font-size: 16px; font-weight: 700; }
.tt-how i { flex: none; width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center; font-style: normal; font-size: 15px; background: var(--ink); color: var(--card); }

.tt-cta { display: grid; gap: 8px; }
.theme-ticket .tt-go { min-height: 64px; flex-direction: column; gap: 2px; box-shadow: 0 10px 22px -10px rgba(200,50,30,.75); }
.tt-go span { font-family: var(--serif); font-weight: 800; font-size: 20px; letter-spacing: .12em; }
.tt-go small { font-size: 13.5px; font-weight: 700; opacity: .85; letter-spacing: .04em; }
.tt-dev { display: flex; justify-content: center; gap: 4px; flex-wrap: wrap; }
.tt-dev .link { min-height: 32px; font-size: 13.5px; }
.theme-ticket .tt .disclaimer { font-size: 13px; text-align: center; }

.tt-word { color: var(--ink); }
.tt-stub-q { white-space: nowrap; }
.tt { overflow-x: hidden; }

/* =========================== 初回トップ（宝くじ券） =========================== */
.ft { display: flex; flex-direction: column; height: 100%; }
.ft-scroll { flex: 1; overflow-y: auto; overflow-x: hidden; padding: calc(16px + var(--safe-t)) 18px 12px; }
.ft-scroll::-webkit-scrollbar { width: 0; }
.ft-hero { padding: 22px 0 6px; }
.ft-kicker { display: inline-block; font-size: 14px; font-weight: 900; letter-spacing: .14em; color: var(--accent); border: 1.5px solid var(--accent); border-radius: 3px; padding: 3px 8px; transform: rotate(-2deg); }
.ft-h1 { font-family: var(--serif); font-weight: 800; font-size: 34px; line-height: 1.3; margin: 14px 0 0; letter-spacing: .01em; }
.ft-h1 .ft-hl { font-style: normal; color: var(--accent); background: linear-gradient(transparent 62%, var(--accent-soft) 62%); padding: 0 2px; }
.ft-lead { font-size: 17px; line-height: 1.85; color: var(--ink-2); margin: 12px 0 0; text-wrap: pretty; }
.ft-ticket { position: relative; display: grid; grid-template-columns: 1fr 80px; margin-top: 20px; background: var(--card); border-radius: 14px; box-shadow: 0 18px 34px -20px rgba(60,40,10,.55); transform: rotate(1.2deg); animation: ttIn .7s cubic-bezier(.2,1.2,.3,1) .1s both; }
.ft-ticket::before { content: ''; position: absolute; inset: 7px; border: 1.5px solid var(--line); border-radius: 9px; pointer-events: none; }
.ft-ticket-main { padding: 18px 16px 16px 20px; min-width: 0; }
.ft-ticket-k { font-family: var(--serif); font-weight: 800; font-size: 16px; }
.ft-ticket-k b { color: var(--accent); font-size: 18px; margin: 0 2px; }
.ft-ticket-w { font-family: var(--serif); font-weight: 800; font-size: 30px; margin-top: 4px; }
.ft-ticket-w .ft-dot { font-style: normal; color: var(--accent); }
.ft-ticket .tt-balls span { width: 32px; height: 32px; font-size: 17px; }
.ft-ticket-stub { position: relative; border-left: 2px dashed var(--line); display: flex; flex-direction: column; align-items: center; justify-content: space-around; padding: 10px 4px; }
.ft-ticket-stub::before, .ft-ticket-stub::after { content: ''; position: absolute; left: -10px; width: 18px; height: 18px; border-radius: 50%; background: var(--paper); }
.ft-ticket-stub::before { top: -9px; } .ft-ticket-stub::after { bottom: -9px; }
.ft-ticket-stub .ft-free { font-style: normal; writing-mode: vertical-rl; font-family: var(--serif); font-weight: 800; font-size: 17.5px; letter-spacing: .3em; color: var(--accent); }

.ft-sec { margin-top: 30px; }
.ft-sec-h { display: flex; align-items: baseline; gap: 10px; font-family: var(--serif); font-weight: 800; font-size: 19px; margin-bottom: 12px; }
.ft-sec-h .ft-no { font-style: normal; font-family: var(--mono); font-weight: 700; font-size: 15px; color: var(--accent); border-bottom: 2px solid var(--accent); }
.ft-steps { display: grid; gap: 10px; }
.ft-step { background: var(--card); border-radius: 12px; padding: 14px; box-shadow: var(--tk-shadow); }
.ft-step b { display: block; font-size: 17.5px; font-weight: 900; margin-top: 10px; }
.ft-step p { margin: 4px 0 0; font-size: 15px; line-height: 1.7; color: var(--ink-2); }
.ft-step-ill { display: flex; align-items: center; gap: 6px; padding: 12px; border-radius: 8px; background: var(--paper); min-height: 60px; }
.ft-pref { flex: 1; text-align: center; padding: 8px 0; border-radius: 4px; background: var(--card); box-shadow: inset 0 0 0 1px var(--line); font-size: 15px; font-weight: 700; color: var(--muted); }
.ft-pref.on { background: var(--accent); color: #fff; box-shadow: none; transform: scale(1.08); }
.ft-flow span { flex: 1; text-align: center; padding: 8px 0; border-radius: 4px; background: var(--card); font-size: 14px; font-weight: 900; box-shadow: inset 0 0 0 1px var(--line); }
.ft-flow span.on { background: var(--ink); color: var(--card); box-shadow: none; }
.ft-flow i { font-style: normal; font-weight: 900; color: var(--muted); }
.ft-age { font-family: var(--mono); font-weight: 700; font-size: 28px; }
.ft-age small { font-family: var(--sans); font-size: 15px; margin-left: 1px; }
.ft-age.next { color: var(--accent); }
.ft-arrow { flex: 1; text-align: center; font-weight: 900; color: var(--muted); letter-spacing: .3em; }
.ft-lots { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; }
.ft-lot { aspect-ratio: 1 / 1.1; border-radius: 8px; border: 1.5px dashed var(--line); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; color: var(--muted); }
.ft-lot .num { font-size: 18px; font-weight: 700; }
.ft-lot small { font-size: 12.5px; font-weight: 700; text-align: center; line-height: 1.2; }
.ft-lot.open { border: 0; background: var(--ink); color: var(--card); }
.ft-lot.open .num { color: #FF8A73; }
.ft-note { font-size: 14.5px; color: var(--muted); margin: 8px 0 0; line-height: 1.6; }
.ft-feats { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.ft-feats > div { background: var(--card); border-radius: 12px; padding: 12px; box-shadow: var(--tk-shadow); }
.ft-feats i { width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; font-style: normal; font-weight: 900; font-size: 17px; color: var(--accent); box-shadow: inset 0 0 0 2px var(--accent); }
.ft-feats b { display: block; font-size: 16px; font-weight: 900; margin-top: 8px; }
.ft-feats span { display: block; font-size: 14px; color: var(--muted); margin-top: 2px; line-height: 1.5; }
.ft-last { margin-top: 24px; padding-bottom: 8px; }
.ft-last .link { display: block; margin: 6px auto 0; font-size: 14px; }
.ft-cta { padding: 10px 18px calc(12px + var(--safe-b)); background: linear-gradient(to top, var(--paper) 70%, rgba(244,239,227,0)); display: grid; gap: 2px; }
.ft-login { justify-self: center; min-height: 36px; font-size: 15px; }

.ft-h1 { color: var(--ink); }
.ft-sec-h { color: var(--ink); }

/* 縦書きスタンプ: 「当選金は／すべて／ここへ」の3行（縦書きでは3列） */
.theme-ticket .m.savings .m-label > span.sv-stamp { line-height: 1.25; letter-spacing: .08em; padding: 8px 5px; text-align: start; }
.theme-ticket .m.savings .sv-stamp em { display: block; font-style: normal; white-space: nowrap; }
.theme-ticket .m.savings .sv-stamp em + em { margin-right: 2px; }

/* ---- 券の切り欠き: 背景色の円を重ねるのをやめ、マスクで実際に穴を抜く ----
   影は外側ラッパーの drop-shadow で付けるので、切り欠きの形に沿った影になる */
.tt-ticket-wrap, .ft-ticket-wrap { filter: drop-shadow(0 18px 22px rgba(60,40,10,.28)) drop-shadow(0 2px 2px rgba(60,40,10,.08)); }
.tt-ticket-wrap { transform: rotate(-1.5deg); animation: ttIn .7s cubic-bezier(.2,1.2,.3,1) both; }
.ft-ticket-wrap { margin-top: 20px; transform: rotate(1.2deg); animation: ttIn .7s cubic-bezier(.2,1.2,.3,1) .1s both; }
.tt-ticket, .ft-ticket { transform: none !important; animation: none !important; box-shadow: none !important; margin-top: 0 !important; }
.tt-ticket {
  --stub: 92px;
  -webkit-mask: radial-gradient(circle 11px at calc(100% - var(--stub)) 0, transparent 10.5px, #000 11px) top / 100% 51% no-repeat,
                radial-gradient(circle 11px at calc(100% - var(--stub)) 100%, transparent 10.5px, #000 11px) bottom / 100% 51% no-repeat;
          mask: radial-gradient(circle 11px at calc(100% - var(--stub)) 0, transparent 10.5px, #000 11px) top / 100% 51% no-repeat,
                radial-gradient(circle 11px at calc(100% - var(--stub)) 100%, transparent 10.5px, #000 11px) bottom / 100% 51% no-repeat;
}
.ft-ticket {
  --stub: 80px;
  -webkit-mask: radial-gradient(circle 10px at calc(100% - var(--stub)) 0, transparent 9.5px, #000 10px) top / 100% 51% no-repeat,
                radial-gradient(circle 10px at calc(100% - var(--stub)) 100%, transparent 9.5px, #000 10px) bottom / 100% 51% no-repeat;
          mask: radial-gradient(circle 10px at calc(100% - var(--stub)) 0, transparent 9.5px, #000 10px) top / 100% 51% no-repeat,
                radial-gradient(circle 10px at calc(100% - var(--stub)) 100%, transparent 9.5px, #000 10px) bottom / 100% 51% no-repeat;
}
.tt-stub::before, .tt-stub::after, .ft-ticket-stub::before, .ft-ticket-stub::after { display: none !important; }
/* 内側の枠線は切り欠きの手前で止める */
.tt-ticket::before { inset: 8px calc(var(--stub) + 8px) 8px 8px; }
.ft-ticket::before { inset: 7px calc(var(--stub) + 7px) 7px 7px; }
.tt-stub, .ft-ticket-stub { border-left-width: 2px; }

/* 速度ボタンは「現在のデザイン」と同じ見た目（グレーの台座＋選択中は白いカード）に統一 */

/* =========================== LP（初めての人向けトップ） =========================== */
.lp { position: relative; }
.lp .ft-scroll { padding: 0 18px 16px; }
.lp-bar { position: absolute; top: 0; left: 0; right: 0; z-index: 6; display: flex; justify-content: space-between; align-items: center; padding: calc(12px + var(--safe-t)) 16px 10px; transition: background .2s, box-shadow .2s; }
.lp-bar.on { background: rgba(244,239,227,.94); backdrop-filter: blur(8px); box-shadow: 0 1px 0 var(--line); }
.lp-logo { font-family: var(--serif); font-weight: 800; font-size: 18.5px; opacity: 0; transition: opacity .2s; }
.lp-bar.on .lp-logo { opacity: 1; }
.lp-logo em { font-style: normal; color: var(--accent); }
.lp-hero { padding: calc(64px + var(--safe-t)) 0 8px; }
.lp-kicker { display: flex; gap: 6px; }
.lp .ft-h1 { font-size: 36px; margin-top: 16px; }
.lp-cta { margin-top: 22px; }
.lp-cta .tt-go, .lp-end .tt-go { width: 100%; }
.lp-sec { margin-top: 40px; }
.lp .ft-sec-h { font-size: 20px; line-height: 1.4; align-items: flex-start; }
.lp .ft-sec-h .ft-no { margin-top: 6px; flex: none; }
.lp-sn { display: inline-grid; place-items: center; width: 22px; height: 22px; margin-right: 8px; border-radius: 50%; background: var(--accent); color: #fff; font-style: normal; font-family: var(--mono); font-size: 15px; vertical-align: 2px; }
.lp-jp { flex-direction: column; align-items: flex-start !important; gap: 0 !important; background: var(--ink) !important; color: var(--card); }
.lp-jp span { font-size: 14px; font-weight: 700; color: #FFD978; }
.lp-jp b { font-size: 24px; font-weight: 700; letter-spacing: -.03em; color: #FFD978; }

/* 結果の一例 */
.lp-sample { position: relative; background: var(--card); border-radius: 14px; box-shadow: var(--tk-shadow); padding: 16px; }
.lp-sample::before { content: ''; position: absolute; inset: 7px; border: 1.5px solid var(--line); border-radius: 9px; pointer-events: none; }
.lp-sample-h { display: flex; justify-content: space-between; align-items: center; }
.lp-sample-h span { font-family: var(--serif); font-weight: 800; font-size: 17px; }
.lp-sample-h small { font-size: 13px; font-weight: 900; color: #fff; background: var(--ink); padding: 2px 7px; border-radius: 3px; }
.lp-sample-who { font-size: 15px; color: var(--muted); margin-top: 8px; font-weight: 700; }
.lp-sample-who b { color: var(--ink); font-size: 17.5px; }
.lp-sample-k { font-size: 14px; font-weight: 700; color: var(--muted); margin-top: 10px; }
.lp-sample-total { font-size: 38px; font-weight: 700; letter-spacing: -.05em; color: var(--accent); line-height: 1.1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lp-sample-total span { font-family: var(--sans); font-size: 17.5px; margin-left: 2px; letter-spacing: 0; }
.lp-sample-grid { display: grid; grid-template-columns: 1.2fr 1fr; gap: 0; margin-top: 10px; border-top: 2px dashed var(--line); }
.lp-sample-grid > div { padding: 10px 0 0; min-width: 0; }
.lp-sample-grid > div + div { padding-left: 12px; border-left: 2px dashed var(--line); margin-left: 12px; }
.lp-sample-grid span { display: block; font-size: 13.5px; font-weight: 700; color: var(--muted); }
.lp-sample-grid b { display: block; font-size: 18px; font-weight: 700; margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lp-sample-grid > div:first-child b { color: var(--gold); }
.lp-sample-grid small { display: block; font-size: 13.5px; color: var(--ink-2); margin-top: 1px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lp-sample-load { padding: 40px 0; text-align: center; font-size: 16px; color: var(--muted); font-weight: 700; }
.lp-reroll { position: relative; display: block; width: 100%; margin-top: 12px; min-height: 44px; border: 0; border-radius: 999px; background: var(--paper); box-shadow: inset 0 0 0 1.5px var(--line); font: 700 13px var(--sans); color: var(--ink); cursor: pointer; }
.lp-reroll:disabled { opacity: .5; }

/* ラインナップ */
.lp-lots { display: grid; border-radius: 12px; overflow: hidden; background: var(--card); box-shadow: var(--tk-shadow); }
.lp-lot { display: grid; grid-template-columns: 40px 1fr auto; align-items: center; gap: 10px; padding: 10px 14px; border-bottom: 1.5px dashed var(--line); }
.lp-lot:last-child { border-bottom: 0; }
.lp-lot-s { width: 36px; height: 28px; border-radius: 4px; display: grid; place-items: center; font-size: 15px; font-weight: 700; box-shadow: inset 0 0 0 1.5px var(--line); color: var(--muted); }
.lp-lot-n { font-size: 16px; font-weight: 900; display: flex; align-items: center; gap: 6px; min-width: 0; }
.lp-lot-n i { font-style: normal; font-size: 12.5px; font-weight: 900; color: var(--accent); box-shadow: inset 0 0 0 1px var(--accent); padding: 1px 5px; border-radius: 3px; }
.lp-lot-o { font-size: 13.5px; color: var(--muted); font-family: var(--mono); white-space: nowrap; }
.lp-lot.open .lp-lot-s { background: var(--accent); color: #fff; box-shadow: none; }
.lp-lot.open .lp-lot-o { color: var(--accent); font-family: var(--sans); font-weight: 900; }

/* FAQ */
.lp-faq { display: grid; gap: 6px; }
.lp-faq-i { background: var(--card); border-radius: 12px; box-shadow: var(--tk-shadow); overflow: hidden; }
.lp-faq-i button { width: 100%; border: 0; background: none; display: grid; grid-template-columns: auto 1fr auto; gap: 10px; align-items: center; padding: 12px 14px; min-height: 52px; text-align: left; font: 700 13.5px var(--sans); color: var(--ink); cursor: pointer; }
.lp-q { width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center; font-family: var(--serif); font-weight: 800; font-size: 16px; color: var(--accent); box-shadow: inset 0 0 0 1.5px var(--accent); }
.lp-faq-i button i { font-style: normal; font-size: 20px; font-weight: 300; color: var(--muted); }
.lp-faq-i p { margin: 0; padding: 0 14px 14px 48px; font-size: 15.5px; line-height: 1.75; color: var(--ink-2); }

/* 最後のCTA */
.lp-end { margin: 44px -18px 0; padding: 34px 22px 28px; background: var(--ink); color: var(--card); text-align: center; position: relative; }
.lp-end::before { content: ''; position: absolute; left: 0; right: 0; top: -1px; height: 14px; background: radial-gradient(circle 7px at 10px 0, var(--paper) 6.5px, transparent 7px) 0 0 / 20px 14px repeat-x; }
.lp-end-k { font-size: 17px; font-weight: 700; color: #CFC6B4; }
.lp-end-h { font-family: var(--serif); font-weight: 800; font-size: 34px; margin: 4px 0 20px; }
.lp-end-login { display: block; margin: 10px auto 0; color: #A99F8C !important; font-size: 15px; }
.lp-foot { margin: 0 -18px; padding: 16px 18px 10px; background: var(--ink); }
.lp-foot .foot-links a, .lp-foot .link-btn { color: #A99F8C; }
.lp-foot .disclaimer { color: #8A8172; font-size: 13px; text-align: center; border-top: 1px solid #3E372C; padding-top: 10px; }
.lp-foot .link { display: block; margin: 6px auto 0; color: #8A8172; font-size: 14px; }

/* 固定CTA: 必要なときだけせり上がる */
.lp-fixed { position: absolute; left: 0; right: 0; bottom: 0; z-index: 6; transform: translateY(110%); transition: transform .28s cubic-bezier(.2,.9,.3,1); padding-top: 18px; }
.lp-fixed.show { transform: none; }

/* LP最上部のタグ（文字の内側にspanが入っても崩れないようクラスで指定） */
.lp-kicker { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.lp-tag { display: inline-flex; align-items: center; height: 26px; padding: 0 10px; border-radius: 99px; font-style: normal; font-size: 14.5px; font-weight: 900; letter-spacing: .06em; line-height: 1; white-space: nowrap; color: var(--accent); background: var(--card); box-shadow: inset 0 0 0 1.5px var(--accent); }
.lp-tag.solid { background: var(--ink); color: var(--card); box-shadow: none; }
.lp-tag * { all: unset; }

/* 誘導ボタンの文字（クラス指定で上下2段を固定） */
.tt-go .tt-go-l { display: block; font-family: var(--serif); font-weight: 800; font-size: 20px; letter-spacing: .12em; line-height: 1.2; }
.tt-go .tt-go-s { display: block; font-family: var(--sans); font-size: 13.5px; font-weight: 700; letter-spacing: .04em; opacity: .85; line-height: 1.3; }
.tt-go .tt-go-l *, .tt-go .tt-go-s * { all: unset; }

/* 遊び方②の方程式（クラス指定。中に別の要素が入っても崩れない） */
.lp-eq { display: grid !important; grid-template-columns: 1fr auto 1fr auto 1fr; align-items: center; gap: 4px !important; padding: 10px !important; }
.lp-eq-t { min-width: 0; text-align: center; padding: 7px 2px 6px; border-radius: 6px; background: var(--card); box-shadow: inset 0 0 0 1.5px var(--line); }
.lp-eq-t.on { background: var(--ink); box-shadow: none; }
.lp-eq-k { display: block; font-style: normal; font-size: 13px; font-weight: 900; color: var(--muted); line-height: 1.2; white-space: nowrap; }
.lp-eq-v { display: block; font-size: 17.5px; font-weight: 700; color: var(--ink); line-height: 1.25; margin-top: 2px; white-space: nowrap; }
.lp-eq-t.on .lp-eq-k { color: #FFB4A6; }
.lp-eq-t.on .lp-eq-v { color: var(--card); }
.lp-eq-op { font-style: normal; font-family: var(--mono); font-weight: 700; font-size: 17.5px; color: var(--muted); text-align: center; }
.lp-eq .lp-eq-k *, .lp-eq .lp-eq-v *, .lp-eq .lp-eq-op * { all: unset; }

/* 遊び方③: 1等の図（クラス指定） */
.lp-jp { display: flex !important; flex-direction: column; align-items: flex-start !important; justify-content: center; gap: 2px !important; padding: 12px 14px !important; background: var(--ink) !important; border-radius: 8px; }
.lp-jp-tag { font-style: normal; font-size: 13.5px; font-weight: 900; color: var(--ink); background: #FFD978; padding: 2px 8px; border-radius: 3px; line-height: 1.3; }
.lp-jp-amt { font-size: 26px; font-weight: 700; letter-spacing: -.03em; color: #FFD978; line-height: 1.15; white-space: nowrap; }
.lp-jp-yen { font-style: normal; font-family: var(--sans); font-size: 16px; margin-left: 2px; letter-spacing: 0; }
.lp-jp-sub { font-style: normal; font-size: 14px; font-weight: 700; color: #A99F8C; }
.lp-jp em *, .lp-jp .lp-jp-amt > *:not(.lp-jp-yen) { all: unset; }

/* 結果の一例: フワッと切り替え */
.lp-sample-body { position: relative; transition: opacity .26s ease, transform .26s ease, filter .26s ease; }
.lp-sample-body.out { opacity: 0; transform: translateY(6px); filter: blur(2px); }
.lp-reroll { display: flex; align-items: center; justify-content: center; gap: 8px; }
.lp-reroll-ic { width: 18px; height: 18px; flex: none; transition: transform .45s cubic-bezier(.3,1.4,.5,1); }
.lp-reroll:not(:disabled):active .lp-reroll-ic, .lp-reroll:disabled .lp-reroll-ic { transform: rotate(90deg); }
.lp-reroll-t { font-style: normal; }

/* ---- ホームレス移行のお知らせ: 背景を墨色に戻し、文字を高コントラストに ----
   （.theme-ticket .rt-card の明るい背景が .hl にも効いて、明るい文字が読めなくなっていた） */
.theme-ticket .rt-card.hl { background: #1A1712; color: #FFFCF4; box-shadow: 0 30px 70px -20px rgba(0,0,0,.7), inset 0 0 0 1.5px #3E372C; }
.theme-ticket .rt-card.hl .eyebrow { color: #FF8A73; }
.theme-ticket .rt-card.hl .rt-age { color: #FFFCF4; }
.theme-ticket .rt-card.hl .rt-title { color: #FFFCF4; font-size: 19px; }
.theme-ticket .rt-card.hl .rt-sub { color: #E6DDCB; font-size: 15.5px; line-height: 1.7; }
.theme-ticket .rt-card.hl .rt-grid > div { background: #2A241C; box-shadow: inset 0 0 0 1px #4A4236; }
.theme-ticket .rt-card.hl .rt-grid .k { color: #CFC6B4; font-size: 13.5px; }
.theme-ticket .rt-card.hl .rt-grid .v { color: #FFFCF4; }
.theme-ticket .rt-card.hl .rt-grid > div:last-child .v { color: #FF8A73; }
.theme-ticket .rt-card.hl .rt-note { color: #D8CFBD; font-size: 14px; line-height: 1.7; }
.theme-ticket .rt-card.hl .rt-timer { background: #3E372C; }
.theme-ticket .rt-card.hl .rt-timer i { background: #FF8A73; }

/* 配分: 未解放の宝くじ（次の1つだけ条件を表示、それ以降は伏せる） */
.locked.next { border-color: var(--accent) !important; border-style: solid !important; background: var(--card); }
.locked .next-tag { margin-left: 6px; background: var(--accent); color: #fff; }
.locked.secret { opacity: .7; }
.locked.secret b { letter-spacing: .2em; color: var(--muted); }

/* 再就職の選択 */
.rw-wrap { cursor: default; z-index: 60; }
.rw-plus { margin-top: 8px; padding: 9px 10px; border-radius: 10px; background: var(--accent-soft); display: flex; justify-content: space-between; align-items: baseline; gap: 8px; }
.rw-plus span { font-size: 13.5px; font-weight: 700; color: #7A2414; white-space: nowrap; }
.rw-plus b { font-size: 16px; font-weight: 700; color: var(--accent); text-align: right; }
.rw-card .rt-note b { color: var(--neg); }
.rw-btns { display: grid; grid-template-columns: 1fr 1.3fr; gap: 8px; margin-top: 14px; }
.rw-btns .btn { min-height: 52px; font-size: 17.5px; }

/* パート引退のお知らせ */
.rt-card.rwe .eyebrow { color: var(--gold); }
.rwe-period { display: flex; align-items: center; gap: 10px; margin: 12px 4px 0; }
.rwe-period span { font-size: 20px; font-weight: 700; }
.rwe-period span small { font-family: var(--sans); font-size: 14px; margin-left: 1px; }
.rwe-period i { flex: 1; height: 6px; border-radius: 3px; background: linear-gradient(90deg, var(--gold), var(--accent)); position: relative; }
.rwe-period i::before, .rwe-period i::after { content: ''; position: absolute; top: 50%; width: 10px; height: 10px; margin-top: -5px; border-radius: 50%; background: var(--card); box-shadow: inset 0 0 0 2.5px var(--gold); }
.rwe-period i::before { left: -4px; } .rwe-period i::after { right: -4px; box-shadow: inset 0 0 0 2.5px var(--accent); }
.rt-card.rwe .rt-grid > div:last-child .v { color: var(--accent); }
.rwe-gross { font-size: 14px; color: var(--ink-2); margin-top: 8px; }
.rwe-gross b { font-size: 15px; }

/* =========================== 一発入魂 =========================== */
/* スキルカード内: 積立と使用ボタン */
.ip-fund { margin-top: 10px; padding: 12px; border-radius: 10px; background: var(--ink); color: var(--card); display: grid; gap: 10px; }
.ip-fund > div span { display: block; font-size: 13.5px; font-weight: 700; color: #A99F8C; }
.ip-fund > div b { display: inline-block; font-size: 24px; font-weight: 700; color: #FFD978; margin-top: 2px; }
.ip-fund > div b small { font-family: var(--sans); font-size: 15px; margin-left: 1px; }
.ip-fund > div em { font-style: normal; font-size: 14px; color: #CFC6B4; margin-left: 8px; }
.ip-use { min-height: 56px; flex-direction: column; gap: 2px; background: var(--accent); color: #fff; box-shadow: 0 8px 18px -8px rgba(200,50,30,.8); }
.ip-use b { font-family: var(--serif); font-weight: 800; font-size: 17.5px; letter-spacing: .1em; }
.ip-use small { font-size: 13.5px; font-weight: 700; opacity: .88; }
.ip-use:disabled { background: #3E372C; color: #8A8172; box-shadow: none; opacity: 1; }
.ip-use.reserved { background: #FFD978; color: var(--ink); box-shadow: 0 0 0 3px rgba(255,217,120,.25); animation: ipPulse 1.6s ease-in-out infinite; }
@keyframes ipPulse { 50% { box-shadow: 0 0 0 7px rgba(255,217,120,.12); } }

/* 抽選演出 */
.ipd { position: absolute; inset: 0; z-index: 70; display: grid; place-items: center; color: #FFFCF4; cursor: pointer; overflow: hidden; }
.ipd-bg { position: absolute; inset: 0; background: radial-gradient(120% 70% at 50% 30%, #3A1410 0%, #120D0A 70%); animation: bwFade .3s ease; }
.ipd.big .ipd-bg { background: radial-gradient(120% 70% at 50% 35%, #7A2A12 0%, #1A0D08 72%); }
.ipd.big .ipd-bg::after { content: ''; position: absolute; inset: -50%; background: conic-gradient(from 0deg, transparent 0 8deg, rgba(255,217,120,.12) 8deg 14deg, transparent 14deg 30deg); animation: ipSpin 12s linear infinite; }
@keyframes ipSpin { to { transform: rotate(360deg); } }
.ipd-in { position: relative; width: min(360px, 88%); text-align: center; }
.ipd-stamp { width: 88px; height: 88px; margin: 0 auto; border-radius: 50%; display: grid; place-items: center; font-family: var(--serif); font-weight: 800; font-size: 46px; color: #FF8A73; box-shadow: inset 0 0 0 3px #FF8A73, inset 0 0 0 7px transparent, inset 0 0 0 9px #FF8A73; transform: rotate(-10deg); }
.ipd-stamp.pop { animation: ttStamp .55s cubic-bezier(.3,1.7,.4,1) both; }
.ipd-ttl { font-family: var(--serif); font-weight: 800; font-size: 30px; letter-spacing: .3em; margin-top: 12px; text-indent: .3em; }
.ipd-sub { font-size: 15.5px; color: #E6DDCB; margin-top: 6px; }
.ipd-sub b { font-size: 17.5px; color: #FFD978; }
.ipd-slot { margin-top: 22px; padding: 14px 10px 16px; border-radius: 14px; background: rgba(255,252,244,.06); box-shadow: inset 0 0 0 1.5px rgba(255,217,120,.35); animation: fadeUp .4s ease both; }
.ipd-slot-k { font-size: 14px; font-weight: 900; letter-spacing: .14em; color: #FFD978; }
.ipd-num { display: flex; justify-content: center; align-items: baseline; gap: 3px; margin-top: 8px; }
.ipd-d { width: 26px; height: 40px; display: grid; place-items: center; border-radius: 6px; background: #FFFCF4; color: #6E665A; font-family: var(--mono); font-weight: 700; font-size: 24px; filter: blur(.6px); }
.ipd-d.stop { color: #1A1712; filter: none; animation: ipStop .28s cubic-bezier(.3,1.6,.4,1); }
@keyframes ipStop { from { transform: translateY(-8px) scale(1.15); } }
.ipd-u { font-style: normal; font-size: 15px; font-weight: 900; color: #E6DDCB; margin: 0 3px; }
.ipd-wait { margin-top: 26px; font-family: var(--serif); font-weight: 800; font-size: 22px; letter-spacing: .1em; animation: fadeUp .4s ease both; }
.ipd-dots i { font-style: normal; display: inline-block; animation: ipDot 1s infinite; }
.ipd-dots i:nth-child(2) { animation-delay: .2s; } .ipd-dots i:nth-child(3) { animation-delay: .4s; }
@keyframes ipDot { 50% { opacity: .2; transform: translateY(-4px); } }
.ipd-res { margin-top: 20px; }
.ipd-tier { display: inline-block; padding: 8px 22px; border-radius: 10px; font-family: var(--serif); font-weight: 800; font-size: 34px; letter-spacing: .1em; background: #FFFCF4; color: var(--accent); box-shadow: 0 0 0 3px #FF8A73; transform: rotate(-4deg); animation: ttStamp .55s cubic-bezier(.3,1.7,.4,1) both; }
.ipd.big .ipd-tier { background: linear-gradient(180deg, #FFE08A, #D9A92C); color: #3A2600; box-shadow: 0 0 40px rgba(255,217,120,.6); font-size: 40px; }
.ipd-tier.miss { background: transparent; color: #A99F8C; box-shadow: inset 0 0 0 2px #6E665A; }
.ipd-k { font-size: 14px; font-weight: 700; color: #CFC6B4; margin-top: 18px; }
.ipd-total { font-size: 44px; font-weight: 700; letter-spacing: -.04em; color: #FFD978; line-height: 1.1; white-space: nowrap; }
.ipd-total small { font-family: var(--sans); font-size: 17.5px; margin-left: 2px; }
.ipd-net { font-size: 15px; font-weight: 700; margin-top: 4px; }
.ipd-net.pos { color: #6FD3A0; } .ipd-net.neg { color: #FF8A73; }
.ipd-list { margin: 14px auto 0; max-width: 300px; display: grid; gap: 4px; }
.ipd-list > div { display: flex; justify-content: space-between; font-size: 15.5px; padding: 6px 10px; border-radius: 8px; background: rgba(255,252,244,.07); animation: fadeUp .35s ease both; }
.ipd-list > div span:first-child { font-weight: 900; }
.ipd-close { margin-top: 18px; width: 100%; min-height: 54px; background: #FFFCF4; color: var(--ink); font-family: var(--serif); font-weight: 800; font-size: 17.5px; letter-spacing: .08em; }
.ipd-skip { margin-top: 26px; font-size: 14px; color: #8A8172; }
.ipd-in * { font-style: normal; }

/* 宝くじ累計収支カード内: 一発入魂の積立 */
.pnl-ip { width: 100%; margin-top: 8px; border: 0; display: grid; grid-template-columns: auto 1fr auto; gap: 10px; align-items: center; padding: 10px 12px; border-radius: 10px; background: #2A241C; box-shadow: inset 0 0 0 1px #3E372C; color: var(--card); text-align: left; cursor: pointer; }
.pnl-ip-ic { width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; font-family: var(--serif); font-weight: 800; font-size: 18.5px; color: #FF8A73; box-shadow: inset 0 0 0 2px #FF8A73; transform: rotate(-8deg); }
.pnl-ip-mid { min-width: 0; }
.pnl-ip-k { display: block; font-size: 13.5px; font-weight: 700; color: #A99F8C; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pnl-ip-st { display: block; font-size: 14.5px; font-weight: 900; margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: #E6DDCB; }
.pnl-ip.on .pnl-ip-st { color: #FF8A73; }
.pnl-ip.res .pnl-ip-st, .pnl-ip.wait .pnl-ip-st { color: #FFD978; }
.pnl-ip.off .pnl-ip-st { color: #8A8172; font-weight: 700; }
.pnl-ip.res { box-shadow: inset 0 0 0 1.5px #FFD978; animation: ipPulse 1.6s ease-in-out infinite; }
.pnl-ip-r { text-align: right; }
.pnl-ip-r b { display: block; font-size: 18.5px; font-weight: 700; color: #FFD978; white-space: nowrap; }
.pnl-ip-r b small { font-family: var(--sans); font-size: 13.5px; margin-left: 1px; }
.pnl-ip-r em { display: block; font-style: normal; font-size: 13px; color: #A99F8C; }
.pnl-ip * { font-style: normal; }

/* 一発入魂: 結果ボタンと金額の1桁ずつ確定 */
.ipd-go { display: flex; flex-direction: column; gap: 2px; width: 100%; margin-top: 22px; min-height: 64px; background: var(--accent); color: #fff; box-shadow: 0 0 0 4px rgba(255,138,115,.25), 0 12px 26px -10px rgba(200,50,30,.9); animation: ipGo 1.4s ease-in-out infinite; }
.ipd-go b { font-family: var(--serif); font-weight: 800; font-size: 20px; letter-spacing: .2em; text-indent: .2em; }
.ipd-go small { font-family: var(--sans); font-size: 13.5px; font-weight: 700; opacity: .85; letter-spacing: .06em; }
@keyframes ipGo { 50% { box-shadow: 0 0 0 9px rgba(255,138,115,.1), 0 12px 26px -10px rgba(200,50,30,.9); } }
.ipd-reel { display: flex; justify-content: center; align-items: flex-end; gap: 3px; margin-top: 8px; }
.ipd-rd { width: 30px; height: 48px; display: grid; place-items: center; border-radius: 7px; background: rgba(255,252,244,.08); box-shadow: inset 0 0 0 1.5px rgba(255,217,120,.25); font-family: var(--mono); font-weight: 700; font-size: 30px; color: rgba(255,217,120,.45); filter: blur(.7px); }
.ipd-rd.next { box-shadow: inset 0 0 0 2px #FFD978, 0 0 18px rgba(255,217,120,.35); }
.ipd-rd.lock { background: #FFFCF4; color: #1A1712; filter: none; box-shadow: none; animation: ipLock .32s cubic-bezier(.3,1.7,.4,1); }
@keyframes ipLock { from { transform: translateY(-14px) scale(1.25); } }
.ipd-reel.done .ipd-rd.lock { background: transparent; color: #FFD978; font-size: 34px; width: auto; min-width: 20px; transition: all .3s ease; }
.ipd.big .ipd-reel.done .ipd-rd.lock { text-shadow: 0 0 18px rgba(255,217,120,.7); }
.ipd-comma { font-style: normal; font-family: var(--mono); font-weight: 700; font-size: 26px; color: #FFD978; margin: 0 -1px 4px; }
.ipd-yen { font-style: normal; font-size: 17.5px; font-weight: 700; color: #FFD978; margin: 0 0 8px 4px; }
.ipd-res .ipd-tier { margin-bottom: 4px; }
@media (max-width: 400px) { .ipd-rd { width: 25px; height: 42px; font-size: 25px; } .ipd-comma { font-size: 22px; } }

/* 一発入魂エリア: 情報＋使用ボタン */
.pnl-ip { display: block !important; padding: 0 !important; cursor: default !important; overflow: hidden; }
.pnl-ip-info { width: 100%; border: 0; background: none; color: inherit; display: grid; grid-template-columns: auto 1fr auto; gap: 10px; align-items: center; padding: 10px 12px; text-align: left; cursor: pointer; font: inherit; }
.pnl-ip-use { width: calc(100% - 16px); margin: 0 8px 8px; min-height: 48px; border: 0; border-radius: 999px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1px; background: var(--accent); color: #fff; box-shadow: 0 8px 16px -8px rgba(200,50,30,.8); cursor: pointer; font: inherit; }
.pnl-ip-use b { font-family: var(--serif); font-weight: 800; font-size: 17.5px; letter-spacing: .14em; }
.pnl-ip-use small { font-size: 13px; font-weight: 700; opacity: .88; }
.pnl-ip-use:disabled { background: #3E372C; color: #8A8172; box-shadow: none; cursor: default; }
.pnl-ip-use.res { background: transparent; color: #FFD978; box-shadow: inset 0 0 0 1.5px #FFD978; }

/* 結果の金額: 常に10桁で回す */
.ipd-reel { gap: 2px; }
.ipd-rd { width: 26px; height: 44px; font-size: 26px; border-radius: 6px; }
.ipd-comma { font-size: 22px; margin: 0 0 4px; }
.ipd-rd.zero { background: rgba(255,252,244,.12); color: rgba(255,252,244,.35); animation: none; }
.ipd-rd.gone, .ipd-comma.gone { display: none; }
.ipd-reel.done .ipd-rd.lock { font-size: 34px; }
@media (max-width: 400px) { .ipd-rd { width: 22px; height: 38px; font-size: 22px; } .ipd-comma { font-size: 18px; } .ipd-yen { font-size: 16px; } }
.ipd-rd.lock.zero { animation: ipZero .18s ease-out; }
@keyframes ipZero { from { transform: scale(.7); opacity: .3; } }

/* 年金のお知らせ: 内訳 */
.rt-pen { margin-top: 8px; padding: 8px 10px; border-radius: 10px; background: var(--paper); text-align: left; }
.rt-pen > div { display: flex; justify-content: space-between; gap: 8px; font-size: 14px; padding: 3px 0; }
.rt-pen > div span { color: var(--ink-2); }
.rt-pen > div b { font-size: 15.5px; }
.rt-pen small { display: block; font-size: 13px; color: var(--muted); margin-top: 3px; line-height: 1.5; }

/* 出身地ガチャ: 昇給区分 */
.raise-chip { display: inline-block; margin-top: 8px; padding: 3px 10px; border-radius: 99px; font-size: 14px; font-weight: 900; letter-spacing: .04em; background: var(--line-2); color: var(--ink-2); }
.raise-chip.metro { background: var(--accent); color: #fff; }
.raise-chip.major { background: #F7DDD3; color: var(--accent); }
.raise-chip.designated { background: #F3E6C8; color: #7A5612; }

/* ホーム: 宝くじの行はタップで当選金額一覧 */
.cf-item.tap { cursor: pointer; position: relative; }
.cf-item.tap::after { content: '›'; position: absolute; right: -2px; top: 50%; transform: translateY(-50%); color: var(--muted); font-size: 17px; opacity: .6; }
.cf-item.tap .cf-c { margin-right: 10px; }
.cf-item.tap:active { background: var(--line-2); }
/* 当選金額シート */
.prize-sheet { background: var(--paper); }
.prize-note { font-size: 14.5px; color: var(--ink-2); margin-top: 4px; }
.prize-tbl { margin-top: 10px; background: var(--card); border-radius: 12px; box-shadow: var(--tk-shadow); overflow: hidden; }
.prize-row { display: grid; grid-template-columns: 1fr auto auto; gap: 10px; align-items: baseline; padding: 10px 14px; border-bottom: 1.5px dashed var(--line); font-size: 15.5px; }
.prize-row:last-child { border-bottom: 0; }
.prize-row.h { background: var(--ink); color: var(--card); font-size: 13.5px; font-weight: 900; letter-spacing: .06em; border-bottom: 0; padding: 7px 14px; }
.prize-row.h span:nth-child(2), .prize-row.h span:nth-child(3) { text-align: right; }
.prize-row span { font-weight: 700; min-width: 0; }
.prize-row b { font-size: 17px; font-weight: 700; text-align: right; white-space: nowrap; }
.prize-row em { font-style: normal; font-size: 13.5px; color: var(--muted); text-align: right; white-space: nowrap; min-width: 74px; }
.prize-row.top b { color: var(--accent); font-size: 17.5px; }
@media (max-width: 400px) { .prize-row { grid-template-columns: 1fr auto; } .prize-row em { grid-column: 2; min-width: 0; } .prize-row.h span:nth-child(3) { display: none; } }

/* バージョン表示 */
.ver-tag { text-align: center; font-family: var(--mono); font-size: 13px; letter-spacing: .04em; color: var(--muted); margin-top: 6px; }
.ver-tag.dark { color: #6E665A; }

.prize-odds-label { display: none; }
@media (max-width: 400px) { .prize-odds-label { display: inline; } }
.cf-item.tap:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }


/* =========== 見やすさ調整（高齢者向け）: 文字サイズ一段拡大後のはみ出し対策 =========== */
.theme-ticket { font-size: 16.5px; line-height: 1.6; }
.theme-ticket .note, .theme-ticket .m-sub, .theme-ticket .goal-note { line-height: 1.6; }
/* 下部タブ・速度ボタンは幅が限られるので収まる大きさに固定 */
.theme-ticket .tabs button span { font-size: 13px; }
.theme-ticket .speed button .speed-v { font-size: 16.5px; }
.theme-ticket .speed .speed-max { font-size: 11px; }
/* 一発入魂の10桁リールは横幅に収める */
.theme-ticket .ipd-rd { width: 26px; height: 44px; font-size: 26px; }
.theme-ticket .ipd-comma { font-size: 22px; }
@media (max-width: 400px) { .theme-ticket .ipd-rd { width: 22px; height: 38px; font-size: 22px; } .theme-ticket .ipd-comma { font-size: 18px; } }
/* 長いラベルは折り返し可に */
.theme-ticket .m-label, .theme-ticket .pnl-sk, .theme-ticket .cf-k { white-space: normal; }
.theme-ticket .pnl-ip-k, .theme-ticket .pnl-ip-st { white-space: normal; overflow: visible; text-overflow: clip; }
.theme-ticket .sk-eff { white-space: normal; overflow: visible; text-overflow: clip; line-height: 1.45; }

/* =========== 文字サイズ 2段目の拡大に伴う調整 =========== */
.theme-ticket { font-size: 16.5px; }
/* 幅が限られる部品は収まるサイズに固定（最後に置いて優先） */
.theme-ticket .tabs button span { font-size: 12.5px; }
.theme-ticket .speed button .speed-v { font-size: 16px; }
.theme-ticket .speed .speed-max { font-size: 10px; letter-spacing: -.02em; }
.theme-ticket .ipd-rd { width: 26px; height: 44px; font-size: 26px; }
.theme-ticket .ipd-comma { font-size: 22px; }
@media (max-width: 400px) { .theme-ticket .ipd-rd { width: 22px; height: 38px; font-size: 22px; } .theme-ticket .ipd-comma { font-size: 18px; } }
.theme-ticket .chip, .theme-ticket .win-chip { font-size: 12px; }

/* =========== 当選履歴（高額当選／そのほか） =========== */
.win-box { background: var(--card); border-radius: 12px; box-shadow: var(--tk-shadow); overflow: hidden; }
.win-box + .win-box { margin-top: 10px; }
.win-h { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; padding: 10px 14px 8px; border-bottom: 2px dashed var(--line); }
.win-h-k { font-family: var(--serif); font-weight: 800; font-size: 17px; }
.win-h-s { font-size: 13px; color: var(--muted); font-weight: 700; }
.win-box.hi { background: var(--ink); color: var(--card); }
.win-box.hi .win-h { border-color: #3E372C; }
.win-box.hi .win-h-k { color: #FFD978; }
.win-box.hi .win-h-s { color: #A99F8C; }
.win-row { display: grid; grid-template-columns: auto 1fr auto; gap: 12px; align-items: center; padding: 12px 14px; border-bottom: 1px solid var(--line-2); }
.win-row:last-child { border-bottom: 0; }
.win-box.hi .win-row { border-color: #2A241C; }
.win-chip { width: 40px; height: 32px; border-radius: 6px; display: grid; place-items: center; font-family: var(--mono); font-weight: 700; background: var(--paper); box-shadow: inset 0 0 0 1.5px var(--line); color: var(--ink-2); }
.win-row.hi .win-chip { background: #FFD978; color: var(--ink); box-shadow: none; }
.win-mid { min-width: 0; }
.win-mid b { display: block; font-size: 16px; font-weight: 900; line-height: 1.35; }
.win-mid small { display: block; font-size: 13.5px; color: var(--muted); margin-top: 2px; }
.win-box.hi .win-mid small { color: #A99F8C; }
.win-amt { font-size: 18px; font-weight: 700; color: var(--accent); white-space: nowrap; text-align: right; }
.win-amt small { font-family: var(--sans); font-size: 13px; margin-left: 1px; }
.win-row.hi .win-amt { color: #FFD978; font-size: 20px; }
.win-empty { padding: 16px 14px; font-size: 14.5px; color: var(--muted); text-align: center; }
.win-box.hi .win-empty { color: #A99F8C; }

/* =========== 再生中の演出（時間が進んでいることを伝える） =========== */
/* 画面最上部の流れるライン */
.run-stripe { position: absolute; top: 0; left: 0; right: 0; height: 3px; z-index: 8; pointer-events: none; opacity: 0; transition: opacity .3s; background: repeating-linear-gradient(90deg, var(--accent) 0 18px, #FF8A73 18px 36px); background-size: 72px 3px; }
.shell.is-running .run-stripe { opacity: 1; animation: runStripe .9s linear infinite; }
@keyframes runStripe { to { background-position: 72px 0; } }
.shell.is-paused .run-stripe { opacity: .5; background: var(--line); }
/* 点滅するライブ表示 */
.live-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--accent); margin-right: 5px; vertical-align: 1px; animation: liveDot 1.2s ease-in-out infinite; box-shadow: 0 0 0 0 rgba(200,50,30,.5); }
@keyframes liveDot { 0% { box-shadow: 0 0 0 0 rgba(200,50,30,.55); } 70% { box-shadow: 0 0 0 7px rgba(200,50,30,0); } 100% { box-shadow: 0 0 0 0 rgba(200,50,30,0); } }
.live-badge { display: inline-flex; align-items: center; height: 24px; padding: 0 10px; border-radius: 99px; font-size: 12.5px; font-weight: 900; letter-spacing: .02em; text-transform: none; background: var(--line-2); color: var(--muted); }
.live-badge.on { background: var(--accent-soft); color: var(--accent); }
.ss-state.on .live-dot { width: 7px; height: 7px; }
/* 日付が変わるたびに軽く弾む */
.tick-date.on { display: inline-block; animation: tickDate .25s ease-out; }
@keyframes tickDate { from { transform: translateY(-3px); opacity: .55; } }
/* 年齢の1年の進み具合 */
.year-clock { position: relative; height: 22px; margin-top: 6px; border-radius: 99px; background: var(--line-2); overflow: hidden; }
.year-clock i { position: absolute; left: 0; top: 0; bottom: 0; background: linear-gradient(90deg, #E9C7BE, var(--accent)); border-radius: 99px; transition: width .15s linear; }
.year-clock.on i::after { content: ''; position: absolute; right: 0; top: 0; bottom: 0; width: 24px; background: linear-gradient(90deg, transparent, rgba(255,255,255,.7)); animation: clockShine 1s ease-in-out infinite; }
@keyframes clockShine { 50% { opacity: .2; } }
.year-clock span { position: relative; display: block; text-align: center; font-size: 12.5px; font-weight: 900; line-height: 22px; color: var(--ink); mix-blend-mode: multiply; }
.year-clock:not(.on) i { background: #CFC6B4; }
/* 一時停止中は年齢・日付を少し落ち着かせ、再生ボタンを目立たせる */
.shell.is-paused .age-big, .shell.is-paused .tick-date { opacity: .7; }
.shell.is-paused .play.paused { animation: playHint 1.6s ease-in-out infinite; }
@keyframes playHint { 50% { box-shadow: 0 0 0 8px rgba(26,23,18,.12); } }
.shell.is-running .play:not(.paused) { box-shadow: 0 0 0 4px rgba(200,50,30,.18), 0 6px 14px -6px rgba(200,50,30,.7); }
/* 再生中は速度ボタンの選択中に流れる下線 */
.shell.is-running .speed button.on { background-image: linear-gradient(90deg, transparent 0 40%, rgba(200,50,30,.35) 50%, transparent 60% 100%); background-size: 200% 3px; background-repeat: no-repeat; background-position: 100% 100%; animation: speedFlow calc(var(--day-sec, .03s) * 30) linear infinite; }
@keyframes speedFlow { to { background-position: -100% 100%; } }

/* 再生バッジは年齢の上の独立した行に（狭い列で崩れないように） */
.live-row { padding: 2px 16px 0; }
.live-badge { white-space: nowrap; flex: none; height: 28px; padding: 0 12px; font-size: 13.5px; }
.year-clock span { white-space: nowrap; }

/* 年齢は折り返さない。右列（日付・1年バー・物価）は縮んで折り返す */
.theme-ticket .age-big { white-space: nowrap; }
.theme-ticket .hero > div:first-child { flex: none; }
.theme-ticket .hero .date-line { flex: 1; min-width: 0; }
.theme-ticket .hero .price-chip { max-width: 100%; white-space: normal; }
.theme-ticket .hero .price-chip > span { white-space: normal; }
@media (max-width: 400px) { .theme-ticket .age-big { font-size: 72px; } .theme-ticket .age-big small { font-size: 18px; } }

/* =========== スキル: 使用中の色を統一・会員タグの位置統一・常時効果を別枠 =========== */
/* 「使用中」「効果中」はスキルの色に関係なく同じ色 */
.theme-ticket .sk-st.on, .theme-ticket .sk-card.red .sk-st.on, .theme-ticket .sk-card.green .sk-st.on, .theme-ticket .sk-card.gold .sk-st.on { background: var(--pos); color: #fff; box-shadow: none; }
.theme-ticket .sk-card.on::before { background: var(--pos); }
/* 会員タグは名前の前・同じ大きさで固定 */
.sk-name-row { display: flex; align-items: center; gap: 6px; min-width: 0; }
.sk-name-row b { min-width: 0; }
.sk-memtag { flex: none; display: inline-grid; place-items: center; width: 40px; height: 22px; border-radius: 4px; font-size: 12px; font-weight: 900; color: var(--accent); background: var(--card); box-shadow: inset 0 0 0 1.5px var(--accent); font-family: var(--sans); letter-spacing: .04em; }
/* グループ見出し */
.sk-group + .sk-group { margin-top: 18px; }
.sk-group-h { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; margin: 0 2px 8px; }
.sk-group-h b { font-family: var(--serif); font-weight: 800; font-size: 17px; }
.sk-group-h span { font-size: 13px; color: var(--muted); font-weight: 700; }
.sk-group .sk-card + .sk-card { margin-top: 8px; }

/* 固定ヘッダーにも流れるライン */
.sticky-status { overflow: hidden; }
.ss-stripe { position: absolute; left: 0; right: 0; bottom: 0; height: 3px; pointer-events: none; opacity: 0; background: repeating-linear-gradient(90deg, var(--accent) 0 18px, #FF8A73 18px 36px); background-size: 72px 3px; }
.shell.is-running .ss-stripe { opacity: 1; animation: runStripe .9s linear infinite; }
.shell.is-paused .ss-stripe { opacity: .5; background: var(--line); }

/* 季節バー（1年の進み具合） */
.year-clock { display: none; }
.season-bar { margin-top: 8px; }
.sb-track { position: relative; height: 26px; border-radius: 99px; overflow: visible; background: var(--line-2); }
.sb-seg { position: absolute; top: 0; bottom: 0; display: grid; place-items: center; font-size: 13px; font-weight: 900; color: rgba(26,23,18,.55); transition: filter .3s, opacity .3s; }
.sb-seg.winter, .sb-seg.winter2 { background: #DCE6EE; }
.sb-seg.spring { background: #F6D9E0; }
.sb-seg.summer { background: #F7E3A6; }
.sb-seg.autumn { background: #EFC6A2; }
.sb-seg.winter { border-radius: 99px 0 0 99px; }
.sb-seg.winter2 { border-radius: 0 99px 99px 0; }
.sb-seg.cur { color: var(--ink); box-shadow: inset 0 0 0 2px rgba(26,23,18,.25); }
.sb-seg:not(.cur) { opacity: .65; }
.sb-pin { position: absolute; top: -5px; bottom: -5px; width: 0; transform: translateX(-50%); transition: left .15s linear; font-style: normal; }
.sb-pin::before { content: ''; position: absolute; left: -1.5px; top: 0; bottom: 0; width: 3px; border-radius: 2px; background: var(--ink); }
.sb-pin em { position: absolute; left: 50%; top: -18px; transform: translateX(-50%); font-style: normal; font-size: 15px; line-height: 1; }
.season-bar.on .sb-pin em { animation: sbBob 1.2s ease-in-out infinite; }
@keyframes sbBob { 50% { transform: translateX(-50%) translateY(-2px); } }
.season-bar:not(.on) .sb-pin::before { background: #8A8172; }
.season-bar { padding-top: 14px; }

/* 月収の補足（時給・勤務先・年金）は省略せず折り返す */
.theme-ticket .metrics .m .m-sub { white-space: normal; overflow: visible; text-overflow: clip; line-height: 1.45; }

/* 季節バー v2: 左から伸びるバー・右端は「年末」 */
.season-bar { padding-top: 0; margin-top: 8px; }
.sb-head { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 4px; }
.sb-now { font-size: 13.5px; color: var(--ink-2); }
.sb-now b { font-size: 15px; font-weight: 900; }
.sb-end { font-size: 12.5px; font-weight: 900; color: var(--muted); letter-spacing: .06em; }
.sb-track { position: relative; height: 22px; border-radius: 99px; overflow: hidden; background: var(--line-2); box-shadow: inset 0 0 0 1px var(--line); }
.sb-pin, .sb-seg { display: none !important; }
.sb-fill { position: absolute; top: 0; bottom: 0; transition: width .2s linear; }
.sb-fill.winter, .sb-fill.winter2 { background: linear-gradient(90deg, #C9D9E6, #A9C3D8); }
.sb-fill.spring { background: linear-gradient(90deg, #F6CFDA, #EBA3B7); }
.sb-fill.summer { background: linear-gradient(90deg, #F7DE8E, #EDC24E); }
.sb-fill.autumn { background: linear-gradient(90deg, #EFBD92, #D9824A); }
.season-bar.on .sb-fill.cur::after { content: ''; position: absolute; right: 0; top: 0; bottom: 0; width: 18px; background: linear-gradient(90deg, transparent, rgba(255,255,255,.75)); animation: clockShine 1s ease-in-out infinite; }
.sb-tick { position: absolute; top: 4px; bottom: 4px; width: 1.5px; margin-left: -.75px; background: rgba(26,23,18,.18); }
.sb-lab { position: absolute; top: 0; bottom: 0; display: grid; place-items: center; font-size: 12.5px; font-weight: 900; color: rgba(26,23,18,.35); pointer-events: none; }
.sb-lab.done { color: rgba(26,23,18,.55); }
.sb-lab.cur { color: var(--ink); }
.season-bar:not(.on) .sb-fill { filter: saturate(.35); }

/* 季節バー: 区切り線を濃く・12月の冬ラベル */
.sb-tick { top: 0; bottom: 0; width: 2px; margin-left: -1px; background: rgba(26,23,18,.35); z-index: 1; }
.sb-lab { z-index: 2; }

/* 未取得のスキルは開けない */
.sk-head.locked { cursor: default; }
.sk-head.locked:active { background: none; }

@media (prefers-reduced-motion: reduce) {
  .shell *, .shell *::before, .shell *::after { animation: none !important; transition: none !important; }
}
/* 固定ヘッダー: 職業タグ・会員/ゲストボタン */
.sticky-status { flex-wrap: nowrap; gap: 6px; }
.sticky-status .ss-state { margin-left: auto; white-space: nowrap; }
.ss-job { flex: none; font-size: 12.5px; font-weight: 900; padding: 2px 7px; border-radius: 4px; box-shadow: inset 0 0 0 1.5px var(--ink); color: var(--ink); white-space: nowrap; }
.ss-job.ret { box-shadow: inset 0 0 0 1.5px var(--accent); color: var(--accent); }
.ss-job.hl { background: var(--ink); color: var(--card); box-shadow: none; }
.ss-mode { flex: none; min-height: 32px; padding: 0 9px; font-size: 12.5px; }
@media (max-width: 420px) { .sticky-status .ss-date { font-size: 13px; } .sticky-status .ss-state { font-size: 12px; } .ss-job { padding: 2px 5px; } }

/* 固定ヘッダーを枠内に収める（アプリの枠幅に合わせて縮む） */
.sticky-status { gap: 5px; padding-left: 12px; padding-right: 10px; min-width: 0; }
.sticky-status > * { flex-shrink: 0; }
.sticky-status .ss-date { flex-shrink: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sticky-status .ss-sep { margin: 0 1px; }
.sticky-status .ss-state { font-size: 12.5px; }
.ss-job { padding: 2px 6px; }
.ss-mode { padding: 0 8px; }

/* =========== 固定ヘッダー 2行レイアウト =========== */
.theme-ticket .sticky-status { display: grid !important; grid-template-rows: auto auto; gap: 6px; padding: calc(10px + var(--safe-t)) 14px 12px; align-items: stretch; }
.ss-r1, .ss-r2 { display: flex; align-items: center; gap: 10px; min-width: 0; }
.ss-r1 .ss-age { flex: none; font-size: 15px; font-weight: 700; }
.ss-r1 .ss-age b { font-size: 24px; margin-right: 1px; }
.ss-r1 .ss-date { flex: 1; min-width: 0; font-size: 16px; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ss-r1 .ss-state { flex: none; margin-left: 0; font-size: 13.5px; font-weight: 900; white-space: nowrap; }
.ss-r2 .ss-job { flex: none; font-size: 13.5px; padding: 3px 9px; }
.ss-r2 .ss-pref { flex: 1; min-width: 0; font-size: 13.5px; font-weight: 700; color: var(--ink-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ss-r2 .ss-mode { flex: none; min-height: 34px; padding: 0 12px; font-size: 13.5px; }
.sticky-status .ss-sep { display: none; }

/* 相続による強制ONの表示（貯金からの再投資） */
.sk-forced { display: flex; align-items: center; gap: 8px; margin: 0 0 10px; padding: 8px 10px; border-radius: 10px; background: var(--accent-soft); color: var(--ink); font-size: 14px; line-height: 1.5; }
.sk-forced i { flex: none; width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center; font-style: normal; font-weight: 900; font-size: 13px; background: var(--gold, #B07D1E); color: #fff; }
.sk-forced b { color: var(--accent); }

/* =========== 0歳転生: こども時代 =========== */
.tag.kid, .ss-job.kid { background: #FBE7A6; color: #6B4A00; box-shadow: inset 0 0 0 1.5px #D9A21B; }
.kid-home { margin: 6px 16px 4px; display: grid; gap: 10px; }
.kid-fam { background: var(--card); border-radius: 14px; padding: 14px 16px; box-shadow: var(--tk-shadow); position: relative; }
.kid-fam-k { font-size: 12.5px; font-weight: 900; letter-spacing: .16em; color: var(--accent); }
.kid-fam-n { font-family: var(--serif); font-weight: 800; font-size: 24px; margin-top: 2px; }
.kid-fam-d { font-size: 14.5px; color: var(--ink-2); margin-top: 2px; }
.kid-fam-q { display: flex; align-items: center; gap: 8px; margin-top: 8px; font-size: 14px; color: var(--ink-2); }
.kid-fam-q b { font-size: 22px; color: var(--ink); }
.kid-bank { background: #FFF6DA; border-radius: 14px; padding: 14px 16px; box-shadow: inset 0 0 0 2px #E8C766, var(--tk-shadow); transition: transform .2s; }
.kid-bank.flash { transform: scale(1.015); box-shadow: inset 0 0 0 2.5px #D9A21B, 0 0 0 4px rgba(217,162,27,.2); }
.kid-bank-h { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; }
.kid-bank-h span { font-weight: 900; font-size: 16px; }
.kid-bank-h em { font-style: normal; font-size: 13px; color: #8A6A10; font-weight: 700; }
.kid-bank-v { margin-top: 4px; }
.kid-bank-v .yen-v, .kid-bank-v .num { font-size: 34px; font-weight: 700; }
.kid-rows { margin-top: 10px; display: grid; gap: 6px; }
.kid-rows > div { display: flex; justify-content: space-between; align-items: center; gap: 8px; font-size: 15px; padding: 6px 0; border-top: 1px dashed #E8C766; }
.kid-rows small { display: block; font-size: 12.5px; color: var(--muted); font-weight: 500; }
.kid-rows b { font-size: 16px; }
.kid-secret b { font-family: var(--serif); color: var(--accent); letter-spacing: .1em; }
.kid-log { margin-top: 8px; background: rgba(255,255,255,.6); border-radius: 10px; padding: 6px 10px; display: grid; gap: 2px; }
.kid-log > div { display: grid; grid-template-columns: auto 1fr auto; gap: 8px; font-size: 13.5px; align-items: center; }
.kid-log > div span:first-child { color: var(--muted); }
.kid-log b { color: #8A6A10; }
.kid-until { background: var(--card); border-radius: 14px; padding: 12px 16px; box-shadow: var(--tk-shadow); display: grid; grid-template-columns: 1fr auto; gap: 4px 8px; align-items: baseline; }
.kid-until > span { font-size: 14.5px; font-weight: 700; color: var(--ink-2); }
.kid-until > b { font-size: 18px; }
.kid-until .note { grid-column: 1 / -1; }
/* こども時代は大人の指標を薄く */
.kid-mode .metrics { opacity: .45; filter: grayscale(.6); pointer-events: none; }
.kid-mode .section { opacity: .45; filter: grayscale(.6); }
/* 20歳の受け取り */
.kid-end { text-align: left; }
.kid-end-rows { margin-top: 12px; display: grid; gap: 4px; }
.kid-end-rows > div { display: flex; justify-content: space-between; gap: 8px; font-size: 15px; padding: 6px 0; border-top: 1px dashed var(--line); }
.kid-end-rows .sub { font-weight: 900; }
.kid-end-rows .secret { color: var(--accent); font-weight: 900; }
.kid-end-total { margin-top: 10px; display: flex; justify-content: space-between; align-items: baseline; padding: 10px 12px; border-radius: 12px; background: var(--accent-soft); }
.kid-end-total span { font-weight: 900; }
.kid-end-total b { font-size: 28px; color: var(--accent); }
.kid-end-total small { font-size: 15px; margin-left: 2px; }
/* ガチャ: 家庭 */
.gacha-fam { margin-top: 12px; padding: 12px 14px; border-radius: 12px; background: #FFF6DA; box-shadow: inset 0 0 0 2px #E8C766; }
.gacha-fam-k { font-size: 12.5px; font-weight: 900; letter-spacing: .14em; color: #8A6A10; }
.gacha-fam-n { font-family: var(--serif); font-weight: 800; font-size: 22px; margin-top: 2px; }
.gacha-fam-d { font-size: 14px; color: var(--ink-2); margin-top: 4px; line-height: 1.6; }
/* スキル: 0歳転生の枠 */
.zb-box { margin-top: 12px; padding-top: 10px; border-top: 1px dashed var(--line); }
.sk-memtag-inl { font-style: normal; margin-left: 6px !important; }

.kid-end-rows > div span { min-width: 0; }
.kid-end-rows > div b, .kid-end-total b { white-space: nowrap; flex: none; }
.kid-end-total { gap: 8px; }
.kid-end-total span { min-width: 0; }

/* 公開前のスキル: 条件未達成 */
.sk-st.cond { background: transparent; color: var(--muted); box-shadow: inset 0 0 0 1.5px var(--line); border-style: dashed; }

/* 配分タブの吹き出し（No.4解放〜MINI解放まで） */
.alloc-tip { position: absolute; bottom: calc(100% + 8px); left: 50%; transform: translateX(-30%); z-index: 20; white-space: nowrap;
  background: var(--accent); color: #fff; font-size: 14px; font-weight: 900; line-height: 1.3; padding: 8px 12px; border-radius: 12px;
  box-shadow: 0 8px 18px -8px rgba(120,30,10,.6); pointer-events: none; animation: allocTipIn .4s cubic-bezier(.2,1.4,.4,1) both, allocTipBob 1.8s ease-in-out .4s infinite; }
.alloc-tip::after { content: ''; position: absolute; top: 100%; left: 30%; transform: translateX(-50%); border: 7px solid transparent; border-top-color: var(--accent); }
@keyframes allocTipIn { from { opacity: 0; transform: translate(-30%, 6px) scale(.9); } to { opacity: 1; transform: translate(-30%, 0) scale(1); } }
@keyframes allocTipBob { 0%, 100% { margin-bottom: 0; } 50% { margin-bottom: 4px; } }

/* 本人のシェアページ確認オーバーレイ */
.spv { position: absolute; inset: 0; z-index: 80; background: rgba(26,23,18,.72); display: flex; flex-direction: column; padding: calc(10px + var(--safe-t, 0px)) 10px calc(10px + var(--safe-b, 0px)); animation: fadeUp .25s ease both; }
.spv-bar { display: flex; align-items: center; gap: 10px; background: var(--card); border-radius: 14px 14px 0 0; padding: 10px 10px 10px 14px; }
.spv-t { flex: 1; min-width: 0; display: grid; gap: 2px; }
.spv-t b { font-size: 15px; }
.spv-t span { font-size: 13px; color: var(--muted); }
.spv-t em { font-style: normal; font-weight: 900; }
.spv-t em.pub { color: var(--pos); } .spv-t em.priv { color: var(--neg); }
.spv-close { flex: none; display: flex; align-items: center; gap: 4px; min-height: 44px; padding: 0 14px; border: 0; border-radius: 99px; background: var(--ink); color: #fff; font: 900 18px var(--sans); cursor: pointer; }
.spv-close span { font-size: 14px; }
.spv-frame { flex: 1; width: 100%; border: 0; background: var(--paper); border-radius: 0 0 14px 14px; }
.spv-close-b { margin-top: 8px; min-height: 48px; }

/* =========== 1等演出: 背景光線をレインボーに（プレミア感） =========== */
.jp-reveal.first .jp-burst {
  background: conic-gradient(from 0deg, #FF3B3B, #FF9F1C, #FFE14D, #4CE06A, #2EC5FF, #4C6BFF, #B34CFF, #FF4FB8, #FF3B3B);
  -webkit-mask: repeating-conic-gradient(from 0deg, #000 0deg 5deg, transparent 5deg 14deg), radial-gradient(circle, #000 0%, rgba(0,0,0,.6) 32%, transparent 62%);
  -webkit-mask-composite: source-in;
  mask: repeating-conic-gradient(from 0deg, #000 0deg 5deg, transparent 5deg 14deg), radial-gradient(circle, #000 0%, rgba(0,0,0,.6) 32%, transparent 62%);
  mask-composite: intersect;
  opacity: .62;
  animation: spin 16s linear infinite, raysIn .8s ease both, jpRainbowHue 3.2s linear infinite;
}
.jp-reveal.first .jp-burst.b2 {
  background: conic-gradient(from 90deg, #FF4FB8, #B34CFF, #4C6BFF, #2EC5FF, #4CE06A, #FFE14D, #FF9F1C, #FF3B3B, #FF4FB8) !important;
  -webkit-mask: repeating-conic-gradient(from 7deg, #000 0deg 3deg, transparent 3deg 16deg), radial-gradient(circle, #000 0%, transparent 58%);
  -webkit-mask-composite: source-in;
  mask: repeating-conic-gradient(from 7deg, #000 0deg 3deg, transparent 3deg 16deg), radial-gradient(circle, #000 0%, transparent 58%);
  mask-composite: intersect;
  opacity: .5;
  animation: spin 9s linear infinite reverse, raysIn .8s ease both, jpRainbowHue 2.4s linear infinite reverse !important;
}
/* 中心のやわらかな虹色の光 */
.jp-reveal.first.rank::before, .jp-reveal.first.done::before {
  content: ''; position: absolute; left: 50%; top: 62%; width: 520px; height: 520px; margin: -260px 0 0 -260px; border-radius: 50%; pointer-events: none;
  background: conic-gradient(from 0deg, rgba(255,59,59,.35), rgba(255,225,77,.35), rgba(76,224,106,.35), rgba(46,197,255,.35), rgba(179,76,255,.35), rgba(255,59,59,.35));
  filter: blur(46px); opacity: .7; animation: spin 10s linear infinite, raysIn 1s ease both;
}
@keyframes jpRainbowHue { from { filter: hue-rotate(0deg) saturate(1.2); } to { filter: hue-rotate(360deg) saturate(1.2); } }
@media (prefers-reduced-motion: reduce) {
  .jp-reveal.first .jp-burst, .jp-reveal.first .jp-burst.b2 { animation: raysIn .8s ease both !important; }
}

/* =========== イベント表示エリア（貯金残高の上） =========== */
.ev-area { padding-bottom: 10px; }
.ev-area .m-label .ev-count { font-size: 12.5px; color: var(--muted); font-weight: 700; }
.ev-empty { font-size: 14px; color: var(--muted); padding: 8px 0 2px; }
.ev-list { display: grid; gap: 6px; margin-top: 4px; }
.ev-item { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 10px; padding: 9px 12px; border-radius: 10px; background: var(--paper); box-shadow: inset 0 0 0 1px var(--line); transition: opacity .3s, background .3s; }
.ev-item.live { background: var(--ink); color: var(--paper); box-shadow: 0 8px 18px -10px rgba(0,0,0,.55); animation: evIn .4s cubic-bezier(.2,.9,.3,1.3); }
.ev-item.live.warn { background: #6B2116; }
.ev-item.live.badge { background: #2A2416; }
.ev-item.old { opacity: .62; }
.ev-ic { width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center; font-size: 12.5px; font-weight: 900; background: var(--line); color: var(--ink-2); flex: none; }
.ev-item.live .ev-ic { background: rgba(255,255,255,.14); color: #fff; }
.ev-item.win .ev-ic { background: var(--accent); color: #fff; }
.ev-item.warn .ev-ic { background: var(--neg); color: #fff; }
.ev-item.badge .ev-ic { background: transparent; }
.ev-tx { min-width: 0; display: grid; gap: 1px; }
.ev-t { font-size: 15px; font-weight: 700; line-height: 1.4; text-wrap: pretty; }
.ev-d { font-size: 12.5px; color: var(--muted); }
.ev-item.live .ev-d { color: rgba(255,255,255,.6); }
.ev-amt { font-size: 16.5px; color: var(--accent); white-space: nowrap; }
.ev-item.live .ev-amt { color: #FF8A73; }
@keyframes evIn { from { opacity: 0; transform: translateY(-8px) scale(.97); } to { opacity: 1; transform: none; } }
.kid-ev { margin: 6px 16px 0; }
.kid-ev .ev-area { background: var(--card); border-radius: 14px; padding: 12px 14px; box-shadow: var(--tk-shadow); }

.kid-end-rows .wf { font-size: 13.5px; color: var(--ink-2); border-top: 0; padding: 2px 0 2px 10px; }
.kid-end-rows .wf.secret { color: var(--accent); font-weight: 900; }

/* =========== 大学受験イベント =========== */
.exam-card { text-align: left; }
.exam-opts { display: grid; gap: 8px; margin-top: 12px; }
.exam-opt { display: flex; align-items: center; gap: 10px; text-align: left; border: 0; border-radius: 14px; padding: 12px 14px; background: var(--paper); box-shadow: inset 0 0 0 1.5px var(--line); cursor: pointer; font-family: var(--sans); color: var(--ink); min-height: 64px; }
.exam-opt:active { transform: scale(.99); }
.exam-opt.a { box-shadow: inset 0 0 0 2px var(--ink); }
.exam-opt.hard { box-shadow: inset 0 0 0 2px var(--accent); background: #FFF6F2; }
.exam-opt-t { flex: 1; min-width: 0; display: grid; gap: 2px; }
.exam-opt-t b { font-size: 17px; font-family: var(--serif); }
.exam-opt-t small { font-size: 13px; color: var(--ink-2); line-height: 1.5; }
.exam-rate { flex: none; display: grid; justify-items: end; }
.exam-rate em { font-style: normal; font-size: 12px; color: var(--muted); font-weight: 700; }
.exam-rate b { font-size: 26px; line-height: 1; }
.exam-rate small { font-size: 14px; }
.exam-opt.hard .exam-rate b { color: var(--accent); }
.exam-rate.none { color: var(--muted); font-size: 20px; }
.exam-wait { text-align: center; padding: 20px 0 10px; }
.exam-stamp { width: 84px; height: 84px; margin: 0 auto 12px; border-radius: 50%; display: grid; place-items: center; font: 800 24px var(--serif); color: var(--accent); box-shadow: inset 0 0 0 3px var(--accent); animation: examPulse .7s ease-in-out infinite alternate; }
@keyframes examPulse { from { transform: scale(.94) rotate(-6deg); } to { transform: scale(1.04) rotate(6deg); } }
.exam-result { display: inline-block; font: 800 30px var(--serif); padding: 4px 18px; border-radius: 10px; margin-bottom: 8px; transform: rotate(-4deg); animation: stamp .45s cubic-bezier(.3,1.6,.4,1) both; }
.exam-result.pass { color: #fff; background: var(--accent); }
.exam-result.fail { color: var(--ink-2); box-shadow: inset 0 0 0 3px var(--ink-2); }
/* モチベーション */
.mot-row { margin: 8px 16px 0; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 8px 12px; border-radius: 12px; background: var(--card); box-shadow: var(--tk-shadow); font-size: 14px; }
.mot-row.leave { background: #F7DDD3; }
.mot-k { font-weight: 900; color: var(--ink-2); }
.mot-bars { display: inline-flex; gap: 3px; }
.mot-bars i { width: 14px; height: 10px; border-radius: 3px; background: var(--line); }
.mot-bars i.on.b0 { background: #B4321E; } .mot-bars i.on.b1 { background: #D9782B; } .mot-bars i.on.b2 { background: #B07D1E; } .mot-bars i.on.b3 { background: #4E9A5E; } .mot-bars i.on.b4 { background: #23744B; }
.mot-v { font-size: 14.5px; }
.mot-v.b0, .mot-v.b1 { color: var(--neg); }
.mot-leave { font-style: normal; font-weight: 900; color: var(--neg); margin-left: auto; }

/* モチベーションを「生活水準 QOL」カードの中に */
.m.qol .qol-mot { grid-column: 1 / -1; border-top: 1px dashed var(--line); padding-top: 8px; margin-top: -4px; }
.mot-row.inline { margin: 0; padding: 0; background: transparent; box-shadow: none; border-radius: 0; }
.mot-row.inline.leave { background: transparent; }
/* イベント表示エリア: 高さを3件分で固定（件数・文字量で上下しない） */
.ev-list.ev-fixed { height: 186px; grid-template-rows: repeat(3, 58px); align-content: start; overflow: hidden; }
.ev-list.ev-fixed .ev-item { height: 58px; box-sizing: border-box; overflow: hidden; }
.ev-list.ev-fixed .ev-t { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-size: 14px; line-height: 1.35; }
.ev-list.ev-fixed .ev-empty { grid-row: 1 / -1; align-self: center; text-align: center; padding: 0; }

/* イベント表示エリア: 1件 = 本文2行＋日付 が必ず収まる高さ（3件分で固定） */
.ev-list.ev-fixed { height: calc(3 * 80px + 2 * 6px); grid-template-rows: repeat(3, 80px); }
.ev-list.ev-fixed .ev-item { height: 80px; padding: 8px 12px; align-items: center; }
.ev-list.ev-fixed .ev-tx { align-content: center; gap: 2px; }
.ev-list.ev-fixed .ev-t { font-size: 14px; line-height: 1.4; -webkit-line-clamp: 2; }
.ev-list.ev-fixed .ev-d { font-size: 12.5px; line-height: 1.3; white-space: nowrap; }

/* 当選金額シート内の購入割合バー */
.prize-alloc { margin: 4px 0 12px; padding: 12px 14px; border-radius: 12px; background: var(--card); box-shadow: inset 0 0 0 1.5px var(--line); }
.prize-alloc-h { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; font-size: 14.5px; font-weight: 900; }
.prize-alloc-h b { font-size: 22px; }
.prize-alloc-h small { font-size: 13px; margin-left: 2px; }
.prize-alloc-out { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 2px 0 6px; }
.prize-alloc-out > div { display: grid; gap: 1px; }
.prize-alloc-out span { font-size: 12.5px; color: var(--muted); font-weight: 700; }
.prize-alloc-out b { font-size: 17px; }