
:root{
  --bg:#0c0f1d; --panel:#151a2e; --panel2:#1d2440; --edge:#2a3354;
  --chalk:#eef1f8; --dim:#8b93b0; --amber:#ffcf4a; --clay:#ff8a4c;
  --good:#5fe3a1; --bad:#ff6b6b; --blue:#6cc6ff;
  --mono:'IBM Plex Mono',ui-monospace,Menlo,monospace;
  --sans:'Noto Sans TC',-apple-system,'PingFang TC','Microsoft JhengHei',sans-serif;
  --num:'Barlow Condensed','Oswald','Arial Narrow',sans-serif;
  --pri:#5b4bff; --pri-txt:#fff; --sub:#0e1226; --btn:#1d2440; --hd:#aab2d0; --story:#a99bff; --on-amber:#141a33;
  --pitch1:#1a2147; --pitch2:#18204a; --pline:#ffffff38; --glow:#ffffff14;
}
*{-webkit-tap-highlight-color:transparent;padding:0;margin:0;box-sizing:border-box}
html,body{overscroll-behavior-y:none;height:100%} /* v0.63.4 關掉 iOS 拉到頂/底的回彈,免得露出下面的空白 */
body{font-family:var(--sans);font-size:15px;line-height:1.6;color:var(--chalk);background:var(--bg);background-image:radial-gradient(ellipse 120% 60% at 50% -10%,#3b2a8a55 0%,transparent 60%)}
#app{flex-direction:column;display:flex;min-height:100vh;min-height:100dvh;margin:0 auto;max-width:560px}
/* ===== 上方看板:名字、球隊、四格數字 ===== */
#board{box-shadow:0 6px 18px #0009;padding:calc(10px + env(safe-area-inset-top,0px)) 14px 8px;border-bottom:2px solid var(--edge);background:linear-gradient(#1b2040,#121630);z-index:22;top:0;position:sticky} /* iOS PWA 狀態列是透明的,讓出瀏海高度;z-index 要比 #act(20)高,加點畫面很長時才不會蓋過看板 */
#bd-top{gap:8px;justify-content:space-between;align-items:baseline;display:flex}
#bd-name{text-overflow:ellipsis;overflow:hidden;white-space:nowrap;letter-spacing:0.05em;font-weight:900;font-size:17px}
#bd-name small{text-overflow:ellipsis;overflow:hidden;margin-top:1px;letter-spacing:0.03em;font-weight:500;font-size:11.5px;color:var(--dim);display:block} /* 國籍・位置・類型換到第二行,不被按鈕擠掉 */
#bd-team{white-space:nowrap;letter-spacing:0.06em;font-size:12.5px;font-weight:700;color:var(--amber)}
#bd-grid{margin-top:8px;gap:6px;grid-template-columns:repeat(4,1fr);display:grid}
.bd-cell{text-align:center;padding:4px 6px 3px;border:1px solid var(--edge);border-radius:6px;background:#0e1226}
.bd-cell b{text-shadow:0 0 8px #ffcf4a55;color:var(--amber);font-family:var(--mono);font-size:17px;font-weight:700;line-height:1.2;display:block}
.bd-cell span{letter-spacing:0.15em;color:var(--dim);font-size:10px}
/* ===== 中間的事件卡片 ===== */
#log{gap:10px;display:flex;padding:14px 14px 20px;flex:1;flex-direction:column}
.card{overflow-wrap:anywhere;animation:pop 250ms ease;padding:12px 14px;border:1px solid var(--edge);border-radius:10px;background:var(--panel)}
@keyframes pop{0%{transform:translateY(8px);opacity:0}100%{opacity:1;transform:none}}
.card h4{gap:8px;align-items:center;display:flex;margin-bottom:6px;color:var(--dim);letter-spacing:0.2em;font-size:12px;font-weight:700}
.card h4::before{flex:none;transform:rotate(45deg);border-radius:2px;background:var(--clay);height:8px;width:8px;content:''}
.card.gold h4::before{background:var(--amber)} .card.bad h4::before{background:var(--bad)}
.card.good h4::before{background:var(--good)} .card.info h4::before{background:var(--blue)}
.card p{font-size:14px} .card p+p{margin-top:4px}
.up{font-weight:700;color:var(--good)}.dn{font-weight:700;color:var(--bad)}.hl{font-weight:700;color:var(--amber)}
.statline{margin-top:6px;padding:6px 8px;border:1px dashed var(--edge);border-radius:6px;background:#0e1226;color:var(--chalk);font-family:var(--mono);font-size:12.5px;line-height:1.7}
table.fin{margin-top:6px;font-family:var(--mono);font-size:12px;border-collapse:collapse;width:100%}
table.fin th,table.fin td{text-align:right;padding:4px 4px;border-bottom:1px solid var(--edge)}
table.fin th{letter-spacing:0.05em;font-weight:500;color:var(--dim)}
table.fin td:first-child,table.fin th:first-child{text-align:left}
.yr-head{user-select:none;cursor:pointer;padding:8px 0 0;letter-spacing:0.3em;font-size:11px;color:var(--dim);text-align:center}
.yr-head:hover{color:var(--amber)}
/* ---------- 一次一個畫面 ---------- */
.scr{gap:10px;flex-direction:column;display:none}
.scr.cur,#log.review .scr{display:flex}
#log:not(.review) .scr .yr-head{display:none}
#log.review .scr:not(.cur){opacity:0.82}
#log.review .scr.cur{padding-top:8px;border-top:1px dashed #3a4470}
.scr-head{flex-wrap:wrap;padding:2px 2px 0;color:#8b93b0;letter-spacing:0.12em;font-size:11px;gap:8px;align-items:center;display:flex}
.scr-head b{letter-spacing:0.2em;color:var(--amber)}
.scr-head .dots{margin-left:auto;gap:4px;display:inline-flex}
.scr-head .dots i{background:#2a3354;border-radius:2px;height:4px;width:16px}
.scr-head .dots i.d{background:#6b5bff}.scr-head .dots i.c{background:var(--amber)}
#log.review .scr-head{display:none}
/* 有決定要做的畫面:上方的資訊卡縮成通知條 */
.scr.dec>.card:not(.moment):not(.talk){box-shadow:none;border-radius:10px;font-size:13px;padding:8px 12px}
.scr.dec>.card:not(.moment):not(.talk) h4{font-size:11px;margin-bottom:3px}
.scr.dec>.card:not(.moment):not(.talk) p{font-size:13px}
#act .nextbtn{text-align:center;letter-spacing:0.08em;font-size:16px;padding:14px;grid-column:1/-1;width:100%}
/* ===== 下方的選項面板 ===== */
#act{backdrop-filter:blur(6px);padding:12px 14px calc(12px + env(safe-area-inset-bottom));border-top:2px solid var(--edge);background:linear-gradient(#121630ee,#0c0f1d);z-index:20;bottom:0;position:sticky}
#act .title{margin-bottom:8px;color:var(--dim);letter-spacing:0.2em;font-size:12px;font-weight:700}
.btn{transition:150ms;text-align:left;cursor:pointer;margin-top:8px;padding:11px 14px;font-family:var(--sans);font-size:15px;font-weight:700;color:var(--chalk);border:1px solid var(--edge);border-radius:10px;background:var(--panel2);width:100%;display:block}
.btn:active{transform:scale(0.98)} .btn:hover{border-color:var(--amber)}
.btn small{margin-top:2px;color:var(--dim);font-weight:400;font-size:12px;display:block}
.btn.main{text-align:center;border-color:#7a6cff;background:linear-gradient(#5b4bff,#3d33c4)}
.btn.warn{border-color:#7a3a4a}
.pool{margin-bottom:10px;color:var(--amber);font-family:var(--mono);font-size:15px}
.abrow{user-select:none;cursor:pointer;margin-top:6px;padding:7px 10px;border:1px solid var(--edge);border-radius:8px;background:var(--panel);gap:8px;align-items:center;display:flex}
.abrow:active{background:var(--panel2)}
.abrow .nm{flex:none;font-size:13.5px;font-weight:700;width:74px}
.abrow .nm em.sty{color:#b7adff}
.rt-break{margin:10px 0;padding:10px 12px;border:1px solid var(--edge);border-radius:8px;background:var(--panel)}
.rt-break summary{cursor:pointer;font-size:13px;font-weight:700;color:var(--chalk)}
.rt-parts{display:flex;flex-wrap:wrap;gap:12px 24px;margin-top:10px;font-size:12px}
.rt-parts span{display:flex;flex-direction:column;gap:3px;color:var(--dim)}
.rt-parts b{font:700 15px var(--mono);color:var(--good)}
.rt-break>small{display:block;margin-top:8px;color:var(--dim);font-size:12px}
.abrow .bar{overflow:hidden;border-radius:4px;background:#0e1226;height:8px;flex:1}
.abrow .bar i{transition:200ms;border-radius:4px;background:linear-gradient(90deg,#7a6cff,var(--amber));height:100%;display:block}
.abrow .val{flex:none;text-align:right;width:58px;font-family:var(--mono);font-size:14px}
.abrow .val b{color:var(--good)}
.abrow.capped{opacity:0.45}
.abrow{cursor:default}
.abrow .bar{position:relative}
.abrow .bar em{background:#ffffff66;margin-left:-1px;width:2px;top:-2px;bottom:-2px;position:absolute}
.abrow .val{line-height:1.15;width:84px} .abrow .val small{opacity:0.5}
.abrow .cst{letter-spacing:0.03em;color:var(--dim);font-size:10.5px;display:block}
.abrow .pm{flex:none;gap:4px;align-items:center;display:flex}
.abrow .pm em{color:var(--good);text-align:center;width:26px;font-style:normal;font:700 12px var(--mono)}
.abrow .pm button{cursor:pointer;font:700 17px var(--sans);line-height:1;color:var(--chalk);background:var(--panel2);border-radius:8px;border:1px solid var(--edge);height:32px;width:32px}
.abrow .pm .pl{border-color:#7a6cff;background:linear-gradient(#5b4bff,#3d33c4)}
.abrow .pm button:disabled{cursor:default;opacity:0.25}
.pool small{margin-top:2px;letter-spacing:0.02em;color:var(--dim);font:400 11px var(--sans);display:block}
/* 記分板能力面板 */
#bd-abt{cursor:pointer;padding:3px 0;letter-spacing:0.2em;font:700 11px var(--sans);color:var(--dim);border:1px solid var(--edge);border-radius:6px;background:#0e1226;margin-top:7px;width:100%;display:block}
#bd-abt:active{background:#161b36}
#bd-ab{margin-top:6px;gap:4px 10px;grid-template-columns:repeat(3,1fr);display:none}
#bd-ab.open{display:grid}
.abc{color:var(--dim);font-size:11px;line-height:1.35}
.abc .an{color:var(--chalk)} .abc.key .an{color:var(--amber)} /* v0.72 能力名稱的 .an 跟「歡迎加入」卡片撞名(原本被套上白字,淺色主題看不見) */
.abc .av{color:var(--chalk);font-family:var(--mono);float:right} .abc .av small{opacity:0.45}
.abc.up .av{color:var(--good);animation:flash 800ms ease}
.abc .ab1{margin-top:1px;border-radius:2px;background:#0e1226;height:4px;position:relative}
.abc .ab1 i{transition:width 600ms;border-radius:2px;background:linear-gradient(90deg,#7a6cff,var(--amber));left:0;top:0;bottom:0;position:absolute}
.abc .ab1 em{background:#ffffff55;margin-left:-1px;width:2px;top:-2px;bottom:-2px;position:absolute}
.abc .ab2{margin-top:2px;border-radius:1px;background:#ffffff0d;height:2px}
.abc .ab2 i{transition:width 600ms;border-radius:1px;background:#6cc6ff;height:100%;display:block}
.abc.cap .ab2 i{background:#ff8a4c}
/* 訓練卡預覽 */
.tcard .tnow{color:var(--chalk);font:700 11px var(--mono)}
.tcard .tnow b{font-size:11px;color:var(--good)}
.tcard .tprog{overflow:hidden;margin:1px 6px 0;border-radius:2px;background:#ffffff14;height:3px;display:block}
.tcard .tprog i{background:#6cc6ff;height:100%;display:block}
.trow{margin:2px 0;gap:8px;align-items:center;display:flex}
.trow .tbar{overflow:hidden;border-radius:3px;background:#ffffff14;height:5px;flex:0 0 70px}
.trow .tbar i{background:#6cc6ff;height:100%;display:block}
#act .row2{gap:8px;display:flex}#act .row2 .btn{text-align:center;flex:1}
/* 生涯大事記(寬螢幕右欄) */
#side{display:none}
#side h3{justify-content:space-between;display:flex;margin:4px 2px 8px;color:var(--dim);letter-spacing:0.2em;font-size:12px;font-weight:700}
#side h3 em{color:var(--amber);font-style:normal;font-family:var(--mono)}
#side-empty{padding:10px 4px;font-size:12.5px;color:var(--dim)}
.sd{animation:pop 250ms ease;cursor:pointer;font-family:var(--sans);color:var(--chalk);margin-bottom:6px;padding:6px 9px;border:1px solid var(--edge);border-left:3px solid var(--blue);border-radius:8px;background:var(--panel);text-align:left;width:100%;display:block}
.sd:hover{border-color:var(--amber)}
.sd.gold{border-left-color:var(--amber)} .sd.red{border-left-color:var(--bad)} .sd.won{border-left-color:var(--good)} .sd.lost{border-left-color:#7a3a4a}
.sd small{letter-spacing:0.05em;color:var(--dim);font:700 10.5px var(--mono);display:block}
.sd b{font-size:13px;line-height:1.35;display:block}
.sd span{margin-top:1px;color:var(--dim);font-size:12px;line-height:1.4;display:block}
.card.ping{outline:2px solid var(--amber);outline-offset:2px}
.tblwrap{overflow-x:auto}
table.ltab tr.me td{background:#ffcf4a14;font-weight:700;color:var(--amber)}
table.ltab tr.gap td{padding:0;color:var(--dim);text-align:center}
table.awd td:first-child{width:6.5em;white-space:nowrap;color:var(--dim)}
table.awd td{text-align:left!important}
.card .call{color:#9fd8ff;font-size:12.5px;font-style:italic;margin-top:6px}
.card .press{padding-left:8px;border-left:3px solid var(--amber);color:var(--chalk);font-size:13px;margin-top:6px}
.card.story{box-shadow:0 0 0 1px #7a6cff33 inset;border-color:#7a6cff}
.card.story h4{color:#b7adff}
.sd.story{border-left-color:#7a6cff}
#btn-rev,#btn-side{white-space:nowrap;margin-right:6px;cursor:pointer;padding:4px 7px;font:700 11px var(--sans);color:#8b93b0;border:1px solid #2a3354;border-radius:8px;background:none}
#side-x{font-size:12px;cursor:pointer;padding:0 8px;color:var(--dim);border:1px solid var(--edge);border-radius:6px;background:none}
@media (max-width:1099px){
  #side.open{padding:calc(14px + env(safe-area-inset-top)) 14px 24px;overflow-y:auto;background:var(--bg);z-index:60;inset:0;position:fixed;display:block}
}
@media (max-width:480px){ .abrow .nm{width:64px} .abrow .val{width:78px} .abrow{padding:6px 8px;gap:6px} }
@media (min-width:1100px){
  #app{padding:0 16px;column-gap:18px;grid-template-columns:340px minmax(0,1fr) 300px;grid-template-rows:auto auto auto 1fr;display:grid;max-width:1400px}
  #board{padding:14px 16px 12px;border:1px solid var(--edge);border-top:none;border-radius:0 0 12px 12px;overflow-y:auto;max-height:100vh;max-height:100dvh;align-self:start;grid-column:1;grid-row:1/5}
  #bd-ab{gap:6px 14px;grid-template-columns:repeat(2,1fr)}
  .abc{font-size:12px}
  #log{padding:16px 4px 20px;grid-column:2;grid-row:1}
  #act-toggle{grid-column:2;grid-row:2}
  #act{column-gap:10px;display:grid;border:1px solid var(--edge);border-radius:12px;align-self:start;align-content:start;grid-column:2;grid-row:3;grid-template-columns:1fr 1fr}
  #act>*:not(.btn){grid-column:1/-1}
  #act>.btn:last-child:nth-child(even){grid-column:1/-1}
  #act>.btn:first-child:last-child{grid-column:1/-1}
  #btn-side,#side-x{display:none}
  #side{padding:16px 2px 24px;overflow-y:auto;max-height:100vh;max-height:100dvh;top:0;position:sticky;align-self:start;grid-column:3;grid-row:1/5;display:block}
}
/* ===== 開始畫面 ===== */
#start{overscroll-behavior-y:none;overflow-y:auto;background:var(--bg);background-image:radial-gradient(ellipse 120% 50% at 50% -5%,#3b2a8aaa,transparent 60%);z-index:50;inset:0;position:fixed}
#start .wrap{padding:40px 22px 60px;margin:0 auto;max-width:560px}
#start h1{margin-top:18px;letter-spacing:0.08em;font-size:34px;font-weight:900;line-height:1.25}
#start h1 em{color:var(--amber);font-style:normal}
#start .sub{letter-spacing:0.08em;font-size:13.5px;margin:10px 0 26px;color:var(--dim)}
.field{margin-top:18px}
.field label{margin-bottom:8px;color:var(--dim);letter-spacing:0.25em;font-size:12px;font-weight:700;display:block}
.field input{outline:none;padding:11px 14px;font-family:var(--sans);font-size:16px;color:var(--chalk);border:1px solid var(--edge);border-radius:10px;background:var(--panel);width:100%}
.field input:focus{border-color:var(--amber)}
.seg{gap:8px;grid-template-columns:repeat(4,1fr);display:grid}
.seg.two{grid-template-columns:repeat(2,1fr)}
.seg button{cursor:pointer;padding:11px 4px;font-family:var(--sans);font-size:14.5px;font-weight:700;color:var(--dim);border:1px solid var(--edge);border-radius:10px;background:var(--panel)}
.seg button.on{border-color:var(--amber);color:var(--amber);background:var(--panel2)}
.seedline{margin-top:22px;color:var(--dim);font-family:var(--mono);font-size:12px}
.seedline b{color:var(--amber)}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
.bar{position:relative}
.bar em{border-radius:1px;background:#ffcf4a66;width:2px;top:-2px;bottom:-2px;position:absolute}
#btn-restart{flex:none;cursor:pointer;margin-left:8px;padding:4px 8px;font-size:14px;line-height:1;color:#8b93b0;border:1px solid #2a3354;border-radius:8px;background:none}
#btn-restart:active{background:#1a2040}
#act-toggle{cursor:pointer;padding:3px 14px;font-size:11px;color:#8b93b0;border:1px solid #2a3354;border-bottom:none;border-radius:10px 10px 0 0;background:#0f1428;margin:0 auto -4px;display:block}
#act.collapsed{display:none!important}

/* v0.64.2 收合後「展開選項」固定在畫面底部、讓開 iPhone 底部的橫條,按鈕也加大,不會按到系統的上滑手勢 */
#act-toggle.up{position:sticky;bottom:calc(10px + env(safe-area-inset-bottom,0px));z-index:21;margin:0 auto calc(10px + env(safe-area-inset-bottom,0px));padding:10px 22px;font-size:13px;border:1px solid var(--edge);border-radius:999px;box-shadow:0 4px 14px #0009}
.ball{width:64px;height:64px;border-radius:50%;background:var(--chalk);position:relative;box-shadow:inset -6px -8px 0 #00000014}
.ball::before{content:'';position:absolute;left:21px;top:20px;width:22px;height:22px;background:#141a33;
  clip-path:polygon(50% 0,100% 38%,82% 100%,18% 100%,0 38%)}
/* ---------- M7:轉播比分條、量表、時間軸 ---------- */
#bd-top{align-items:center}
#bd-num{flex:none;width:32px;height:32px;border-radius:8px;display:flex;align-items:center;justify-content:center;
  font:900 15px var(--mono);color:#fff;text-shadow:0 1px 2px #0008;box-shadow:inset 0 -3px 0 #0003,0 0 0 1px #ffffff22;margin-right:9px;transition:background .6s}
#bd-name{flex:1;min-width:0}
#bd-bug{display:flex;margin-top:8px;border-radius:6px;overflow:hidden;border:1px solid var(--edge);font-size:12.5px;font-weight:700;line-height:1.9}
#bd-lg{background:var(--amber);color:#141a33;padding:0 8px;white-space:nowrap}
#bd-team{flex:1;background:#0e1226;padding:0 10px;color:var(--chalk);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;letter-spacing:.03em}
#bd-clock{background:#5b4bff;color:#fff;padding:0 10px;font-family:var(--mono);min-width:44px;text-align:center}
#bd-meters{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:8px}
.mt{position:relative;font-size:10px;color:var(--dim);letter-spacing:.08em}
.mt i{display:block;height:5px;background:#0e1226;border-radius:3px;overflow:hidden;margin-top:2px;border:1px solid #ffffff10}
.mt i b{display:block;height:100%;width:50%;background:linear-gradient(90deg,#7a6cff,#6cc6ff);border-radius:3px;transition:width .7s ease}
#mt-fans i b{background:linear-gradient(90deg,#ff8a4c,#ffcf4a)} #mt-form i b{background:linear-gradient(90deg,#6cc6ff,#5fe3a1)} #mt-fatigue i b{background:linear-gradient(90deg,#ffcf4a,#ff5a5a)}
.mt em{position:absolute;right:0;top:0;font-style:normal;font-family:var(--mono);color:var(--chalk)}
.mt.lo em{color:var(--bad)} .mt.hi em{color:var(--amber)}
.mfloat{position:absolute;right:22px;top:-2px;font:700 11px var(--mono);animation:mfloat 1.2s ease forwards;pointer-events:none}
@keyframes mfloat{from{opacity:1;transform:none}to{opacity:0;transform:translateY(-14px)}}
#bd-time{position:relative;display:flex;justify-content:space-between;font-size:10px;color:var(--dim);letter-spacing:.14em;margin-top:8px;padding-bottom:10px}
#bd-time span.on{color:var(--chalk);font-weight:700}
#bd-track{position:absolute;left:0;right:0;bottom:1px;height:3px;background:#262d4a;border-radius:2px}
#bd-fill{position:absolute;left:0;top:0;bottom:0;width:4%;background:var(--amber);border-radius:2px;transition:width .9s ease}
#bd-ball{position:absolute;top:50%;left:4%;width:11px;height:11px;margin:-5.5px 0 0 -5.5px;border-radius:50%;
  background:radial-gradient(circle at 35% 35%,#fff,#cfd5e6);box-shadow:0 0 6px #fff8;transition:left .9s ease}
#bd-time[data-ph="1"] #bd-fill{width:50%} #bd-time[data-ph="1"] #bd-ball{left:50%}
#bd-time[data-ph="2"] #bd-fill{width:100%} #bd-time[data-ph="2"] #bd-ball{left:calc(100% - 6px)}
.bd-cell b.flash{animation:flash .8s ease}
@keyframes flash{0%{color:#fff;transform:scale(1.25)}100%{transform:none}}
/* 球場線背景 */
body{background-image:radial-gradient(ellipse 120% 60% at 50% -10%,#3b2a8a55 0%,transparent 60%),
  url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 620'><g fill='none' stroke='%23ffffff' stroke-opacity='.05' stroke-width='2'><rect x='12' y='12' width='376' height='596' rx='4'/><line x1='12' y1='310' x2='388' y2='310'/><circle cx='200' cy='310' r='58'/><circle cx='200' cy='310' r='3' fill='%23ffffff' fill-opacity='.05'/><rect x='108' y='12' width='184' height='92'/><rect x='156' y='12' width='88' height='34'/><rect x='108' y='516' width='184' height='92'/><rect x='156' y='574' width='88' height='34'/><path d='M160 104 A48 48 0 0 0 240 104'/><path d='M160 516 A48 48 0 0 1 240 516'/></g></svg>");
  background-size:auto,min(560px,100vw) auto;background-position:center,center top;background-repeat:no-repeat;background-attachment:scroll,fixed}
/* 卡片圖示:壞事＝黃牌、嚴重＝紅牌、關鍵時刻＝足球、對話＝泡泡 */
.card.bad h4::before{width:7px;height:10px;border-radius:1.5px;background:#ffd23f;transform:rotate(10deg)}
.card.red h4::before{background:#ff4d4d}
.card.moment h4::before{width:10px;height:10px;border-radius:50%;transform:none;background:radial-gradient(circle at 35% 35%,#fff,#aab3cc)}
.card.talk h4::before{width:11px;height:9px;border-radius:6px 6px 6px 1px;transform:none;background:var(--blue)}
.card.talk.good h4::before{background:var(--good)} .card.talk.bad h4::before{background:#ffd23f;border-radius:1.5px;width:7px;height:10px;transform:rotate(10deg)}
.card.moment.won{border-color:#ffcf4a66} .card.moment.lost{border-color:#ff6b6b44}
.card.flip{animation:flip .45s ease}
@keyframes flip{from{opacity:0;transform:perspective(600px) rotateX(-70deg)}to{opacity:1;transform:none}}
/* 關鍵時刻 */
.mhead{display:flex;gap:8px;align-items:center;font-size:12.5px;color:var(--dim)}
.mmin{font-family:var(--mono);background:var(--amber);color:#141a33;border-radius:4px;padding:0 6px;font-weight:700}
.msc{font-family:var(--mono);color:var(--chalk);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
svg.scene{display:block;width:100%;height:auto;margin-top:8px;border-radius:8px;border:1px solid var(--edge);
  background:repeating-linear-gradient(180deg,#1a2147 0 24px,#18204a 24px 48px)}
.scene .pl{fill:none;stroke:#ffffff38;stroke-width:1.2} .scene .pdot{fill:#ffffff66}
.scene .goal{fill:#ffffff12;stroke:#ffffffcc;stroke-width:1.3;transform-origin:150px -3px;transform-box:view-box}
.scene.hit .goal{animation:net .6s ease .75s}
@keyframes net{30%{transform:scaleX(1.08) translateY(-2px)}60%{transform:scaleX(.97)}100%{transform:none}}
.scene .me{fill:var(--amber);stroke:#fff;stroke-width:1.4}
.scene .mepl{animation:mepulse 1.6s ease-in-out infinite;transform-origin:center;transform-box:fill-box}
@keyframes mepulse{50%{opacity:.75}}
.scene .metx{font:800 7px var(--mono);fill:#141a33;text-anchor:middle}
.scene .mate{fill:#7a6cff;stroke:#c9c2ff;stroke-width:1} .scene .opp{fill:#ff6b6b;stroke:#ffc2c2;stroke-width:1} .scene .ogk{fill:#6cc6ff;stroke:#d6f0ff;stroke-width:1}
.scene .ballp{fill:#fff;stroke:#141a33;stroke-width:.9;transition:transform .8s cubic-bezier(.25,.8,.3,1)}
.mtell{font-size:12.5px;color:var(--blue);margin-top:6px}
.mres{margin-top:6px;font-size:14px} .mres:empty{display:none}
.mres .fx{font-size:12.5px;color:var(--dim)} .readok{margin-left:6px;font-size:12px;color:var(--blue)}
.var{font:700 12px var(--mono);color:#141a33;background:var(--blue);display:inline-block;padding:0 8px;border-radius:4px;animation:varout 1s ease both}
.var i{font-style:normal;animation:blink .4s steps(2) infinite}
@keyframes varout{0%,80%{opacity:1}100%{opacity:0;height:0;padding:0;margin:0}}
@keyframes blink{50%{opacity:0}}
.vres{animation:fadein .4s ease 1s both}
@keyframes fadein{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
/* 談判對話泡泡 */
.chat p{max-width:88%;padding:6px 10px;border-radius:12px;margin-top:6px;font-size:13.5px;animation:pop .25s ease}
.chat .ag{background:#1d2440;border-bottom-left-radius:3px}
.chat .me{background:#3d33c4;margin-left:auto;border-bottom-right-radius:3px}
.chat .cl{background:#262d4a;border-bottom-left-radius:3px}
.chat .cl.up{border:1px solid #5fe3a155} .chat .cl.dn{border:1px solid #ff6b6b55}
/* 訓練卡 */
.tgrid{display:grid;grid-template-columns:repeat(5,1fr);gap:6px} .tgrid.n6{grid-template-columns:repeat(6,1fr)}
.tcard{background:var(--panel);border:1px solid var(--edge);border-radius:9px;padding:7px 4px 6px;text-align:center;cursor:pointer;
  user-select:none;display:flex;flex-direction:column;gap:2px;animation:deal .35s ease both;transition:transform .15s,border-color .15s,background .15s}
@keyframes deal{from{opacity:0;transform:translateY(16px) rotate(-4deg)}to{opacity:1;transform:none}}
.tgrid.dealt .tcard{animation:none} /* v0.72 只有第一次發牌有動畫,點選課程時不再重播(原本每點一下整排閃一次) */
.tcard b{font-size:12px;line-height:1.25} .tcard .tab{font-size:11px;color:var(--dim)}
.tcard .tpow{font-size:9.5px;color:var(--amber);letter-spacing:-1px} .tcard .tpow i{font-style:normal;color:#ffffff22}
.tcard small{font-size:9.5px;color:var(--dim);line-height:1.3}
.tcard .tsp{font-size:10.5px;color:#9fd8ff} .tcard .tsp b{font-size:10.5px;color:#9fd8ff}
.abrow .spc{font:700 10px var(--mono);color:#9fd8ff;margin-left:4px}
.tcard.key{border-color:#ffcf4a77} .tcard.key .tab{color:var(--amber)}
.tcard.six{box-shadow:0 0 10px #ffcf4a44}
.tcard.sel{background:#2a2470;border-color:#7a6cff;transform:translateY(-4px);box-shadow:0 6px 14px #0008}
@media (max-width:420px){.tgrid,.tgrid.n6{grid-template-columns:repeat(3,1fr)}}
/* ---------- v0.77 關鍵時刻動畫 ---------- */
.mstage{position:relative;overflow:hidden;border-radius:8px;margin-top:8px} .mstage svg.scene{margin-top:0}
.scene .mp-shd{fill:#0006} .scene .mp-trail{fill:#fff;pointer-events:none} .scene .mp-ring{fill:none;stroke:#6cc6ff;stroke-width:2}
.scene .mp-glow{fill:none;stroke:#ffe58a;stroke-width:2.4;stroke-linecap:round;filter:drop-shadow(0 0 3px #ffcf4a)} .scene .mp-streak{stroke:#ffffffaa;stroke-width:3;stroke-linecap:round}
.scene path.goal{fill:#ffffff12}
.mp-flash{position:absolute;inset:0;background:#fff;opacity:0;pointer-events:none}
.mp-shake{animation:mpShk .35s linear} @keyframes mpShk{20%{transform:translate(-4px,2px)}40%{transform:translate(4px,-2px)}60%{transform:translate(-3px,-1px)}80%{transform:translate(2px,1px)}}
.mp-gray{filter:grayscale(1) brightness(.85);transition:filter .3s}
.mp-big{position:absolute;left:0;right:0;top:30%;text-align:center;font:900 clamp(26px,9vw,44px)/1 var(--sans);letter-spacing:.06em;pointer-events:none;color:var(--amber);text-shadow:0 4px 18px #000c,0 0 28px #ffcf4a88;z-index:5;white-space:nowrap}
.mp-big span{display:inline-block;animation:mpLt .5s cubic-bezier(.2,1.6,.4,1) both}
.mp-big.cool{color:#6cc6ff;text-shadow:0 4px 18px #000c,0 0 28px #6cc6ff88} .mp-big.bad{color:#ff6b6b;text-shadow:0 4px 18px #000c,0 0 28px #ff6b6b88} .mp-big.gold{color:#ffe58a;text-shadow:0 0 12px #ffcf4a,0 0 36px #ffb300}
.mp-big.out{animation:mpFo .4s ease forwards} @keyframes mpLt{from{opacity:0;transform:translateY(-30px) scale(1.8)}} @keyframes mpFo{to{opacity:0;transform:translateY(-14px)}}
.mp-cele{position:absolute;right:8px;bottom:36px;width:58px;z-index:6;pointer-events:none;animation:mpCin .45s cubic-bezier(.2,1.5,.4,1) both,mpJmp .5s ease-in-out .45s 3 alternate}
.mp-cele svg{width:100%;height:auto;image-rendering:pixelated;filter:drop-shadow(0 3px 0 #0008)} @keyframes mpCin{from{opacity:0;transform:translateY(40px) scale(.6)}} @keyframes mpJmp{to{transform:translateY(-10px)}}
.mp-pt{position:absolute;width:6px;height:6px;border-radius:50%;pointer-events:none;z-index:6;animation:mpPt .9s ease-out forwards} @keyframes mpPt{to{transform:translate(var(--dx),var(--dy)) scale(.2);opacity:0}}
.mp-cap{position:absolute;left:6px;right:6px;bottom:6px;display:flex;font-size:12px;z-index:7;transform:translateX(-110%);transition:transform .35s cubic-bezier(.2,.9,.3,1);pointer-events:none} .mp-cap.on{transform:none} .mp-cap.top{bottom:auto;top:6px}
.mp-cap b{background:var(--amber);color:#141a33;padding:3px 7px;font-family:var(--mono);border-radius:6px 0 0 6px;white-space:nowrap} .mp-cap span{background:#0c0f1dee;color:#eef1f8;border:1px solid var(--edge);border-left:0;padding:3px 8px;border-radius:0 6px 6px 0;flex:1;min-height:24px;line-height:1.5}
.prc-f2{margin-top:12px;padding-top:10px;border-top:1px dashed var(--edge);animation:ncIn .3s ease both}
.ver-row{display:flex;align-items:center;gap:8px;margin-top:14px;flex-wrap:wrap} .ver-row b{font-family:var(--mono)} .ver-row .btn{margin:0 0 0 auto;padding:6px 12px;font-size:13px;width:auto}
.mp-cap b:empty{display:none} .mp-cap b:empty+span{border-left:1px solid var(--edge);border-radius:6px}
.mp-spot{position:absolute;top:-30%;width:40%;height:160%;background:linear-gradient(90deg,transparent,#fff3,transparent);z-index:4;pointer-events:none;animation:mpSp 1.6s ease-in-out forwards}
@keyframes mpSp{0%{opacity:0;left:-40%;transform:rotate(14deg)}30%{opacity:1}100%{opacity:0;left:110%;transform:rotate(14deg)}}
.mp-cf{position:absolute;top:-10px;width:6px;height:10px;z-index:8;pointer-events:none;animation:mpCf linear forwards} @keyframes mpCf{to{transform:translate(var(--dx),360px) rotate(720deg)}}
/* ---------- v0.78 生涯精華影片 ---------- */
#reel{position:fixed;inset:0;z-index:95;background:#070a16;color:#eef1f8;--dim:#8b93b0;--edge:#2a3354;--chalk:#eef1f8;--amber:#ffcf4a;display:flex;align-items:center;justify-content:center;padding:12px;animation:rlIn .35s ease}
@keyframes rlIn{from{opacity:0}}
#reel .rl-box{width:100%;max-width:460px;display:flex;flex-direction:column;gap:8px}
#reel .rl-top{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--dim)} #reel .rl-top b{color:var(--chalk)} #reel .rl-n{margin-left:auto;font-family:var(--mono)}
#reel .rl-x{background:none;border:1px solid var(--edge);color:var(--chalk);border-radius:8px;padding:2px 9px;cursor:pointer}
#reel .rl-stage{min-height:300px;display:flex;flex-direction:column;justify-content:center}
#reel .rl-head{font-size:13px;color:var(--chalk);margin-bottom:6px;animation:rlUp .4s ease both} #reel .rl-head b{color:var(--amber);font-family:var(--num);font-size:18px} #reel .rl-head small{color:var(--dim)}
#reel .rl-card{margin:0;padding:6px;background:#121730;border:1px solid #2a3354;border-radius:12px;box-shadow:0 10px 40px #000a;animation:rlUp .4s ease both} #reel .rl-card .mstage{margin-top:0}
#reel svg.scene{max-height:none;width:100%;background:repeating-linear-gradient(180deg,#1a2147 0 24px,#18204a 24px 48px);border:none}
#reel .rl-x{color:#eef1f8} #reel .rl-bar .btn{background:#151a2e;color:#ffcf4a;border:1px solid #ffcf4a}
@keyframes rlUp{from{opacity:0;transform:translateY(10px)}}
#reel .rl-dots{display:flex;gap:5px;justify-content:center} #reel .rl-dots i{width:22px;height:4px;border-radius:2px;background:var(--edge)} #reel .rl-dots i.on{background:var(--amber)} #reel .rl-dots i.done{background:#ffcf4a77}
#reel .rl-bar{display:flex;justify-content:center} #reel .rl-bar .btn{min-width:140px;text-align:center}
#reel .rl-title{text-align:center;display:flex;flex-direction:column;gap:6px;animation:rlUp .6s ease both}
#reel .rl-title small{color:var(--dim);letter-spacing:.2em;font-family:var(--mono)} #reel .rl-title b{font-size:34px;color:var(--chalk)} #reel .rl-title span{color:var(--amber);letter-spacing:.5em;font-weight:900}
#reel .rl-out{text-align:center;animation:rlUp .6s ease both} #reel .rl-px{width:110px;margin:0 auto 8px;animation:mpJmp .5s ease-in-out .3s 4 alternate}
#reel .rl-px svg{width:100%;height:auto;image-rendering:pixelated} #reel .rl-out b{font-size:24px} #reel .rl-out p{color:var(--dim);font-size:13.5px;margin-top:6px} #reel .rl-q{font-style:italic;color:var(--chalk)!important}
/* ---------- v0.78 社群貼文 ---------- */
.card.post,html.th .card.post{padding:0;overflow:hidden;background:#0f1220!important;border-color:#2a3354!important;color:#eef1f8} .card.post h4{display:none} /* 社群貼文一律深色,不跟淺色主題 */
.card.rev,html.th .card.rev,.card.call,html.th .card.call{background:none!important;border:none!important;box-shadow:none!important;padding:0}
.sp-h{display:flex;align-items:center;gap:9px;padding:10px 12px} .sp-av{width:32px;height:32px;border-radius:50%;padding:2px;background:conic-gradient(#ffcf4a,#e0483e,#7a6cff,#ffcf4a);flex:none}
.sp-av i{display:grid;place-items:center;width:100%;height:100%;border-radius:50%;background:#0f1220;font:900 12px var(--sans);color:#ffcf4a;font-style:normal}
.sp-nm b{font-size:14px;color:#eef1f8} .sp-nm b::after{content:' ✔';color:#6cc6ff;font-size:12px} .sp-nm small{display:block;color:#8b93b0;font-size:11.5px} .sp-mo{margin-left:auto;color:#8b93b0;font-size:20px}
.sp-img{position:relative;aspect-ratio:1/1;max-height:420px;margin:0 auto;background:radial-gradient(circle at 50% 42%,#ffcf4a55,#0000 55%),linear-gradient(160deg,#2a1d05,#0b0f22 70%);overflow:hidden;user-select:none}
.sp-rays{position:absolute;inset:-30%;background:repeating-conic-gradient(#ffcf4a14 0 8deg,#0000 8deg 16deg);animation:spSpin 30s linear infinite} @keyframes spSpin{to{transform:rotate(360deg)}}
.sp-hd{position:absolute;left:0;right:0;top:5%;text-align:center} .sp-hd b{display:block;font:900 clamp(28px,9vw,48px)/1.05 var(--sans);letter-spacing:.08em;color:#ffcf4a;text-shadow:0 0 18px #ffb30099,0 4px 10px #000a;padding:0 8px}
.sp-hd small{display:block;margin-top:5px;font:900 12px var(--mono);letter-spacing:.35em;color:#fff}
.sp-who{position:absolute;left:50%;top:54%;width:38%;transform:translate(-50%,-50%);filter:drop-shadow(0 8px 0 #0008)} .sp-who svg{width:100%;height:auto;image-rendering:pixelated}
.sp-bg{position:absolute;left:0;right:0;bottom:7%;text-align:center} .sp-bg b{display:block;font:900 26px/1.1 var(--sans);color:#fff;text-shadow:0 3px 14px #000} .sp-bg small{display:block;color:#ffcf4a;font:700 13px var(--sans);margin-top:3px;letter-spacing:.1em}
.sp-heart{position:absolute;left:50%;top:50%;font-size:90px;transform:translate(-50%,-50%) scale(0);opacity:0;pointer-events:none} .sp-heart.on{animation:spHp .8s ease}
@keyframes spHp{30%{transform:translate(-50%,-50%) scale(1.15);opacity:1}70%{transform:translate(-50%,-50%) scale(1);opacity:1}100%{transform:translate(-50%,-60%) scale(1);opacity:0}}
.sp-act{display:flex;gap:16px;padding:9px 12px 2px;font-size:22px} .sp-act span{cursor:pointer} .sp-sv{margin-left:auto}
.sp-lks{padding:0 12px;font-size:13.5px;font-weight:700;color:#eef1f8} .sp-cp{padding:4px 12px;font-size:13.5px;line-height:1.55;color:#eef1f8} .sp-cp b{margin-right:4px}
.sp-sh{padding:0 12px 12px} .sp-save{width:100%;padding:9px;border-radius:10px;border:1px solid #2a3354;background:#151a2e;color:#ffcf4a;font:700 14px var(--sans);cursor:pointer} .sp-save:disabled{opacity:.6}
.sp-cm{padding:2px 12px 8px;font-size:13px;line-height:1.6;color:#eef1f8} .sp-cm b{margin-right:4px} .sp-cm b.v::after{content:' ✔';color:#6cc6ff;font-size:11px}
/* ---------- v0.78 賽季回顧 ---------- */
.card.rev{padding:0;overflow:hidden;border:none;background:none} .card.rev h4{display:none}
.sr{border-radius:14px;background:linear-gradient(160deg,#1b2350,#0b0f22);padding:14px;color:#eef1f8}
.sr-yr{font:700 11.5px var(--mono);letter-spacing:.3em;color:#8b93b0} .sr h3{font-size:20px;margin:2px 0 10px}
.sr-n{display:grid;grid-template-columns:repeat(4,1fr);gap:6px} .sr-n div{background:#ffffff0d;border:1px solid #ffffff1a;border-radius:10px;text-align:center;padding:8px 2px;animation:srPop .4s ease both}
.sr-n b{display:block;font:700 24px/1 var(--num);color:#ffcf4a} .sr-n small{font-size:11px;color:#8b93b0} @keyframes srPop{from{opacity:0;transform:scale(.7)}}
.sr-rt{margin-top:12px;font-size:12.5px;color:#8b93b0} .sr-rt>b{color:#ffcf4a} .sr-rt i{display:block;height:9px;border-radius:5px;background:#ffffff14;margin-top:4px;overflow:hidden} .sr-rt i b{display:block;height:100%;background:linear-gradient(90deg,#6cc6ff,#ffcf4a);transition:width 1.4s cubic-bezier(.2,.9,.3,1)}
.sr-h{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-top:12px;perspective:600px}
.sr-h div{min-height:70px;border-radius:10px;background:linear-gradient(160deg,#3a2c08,#1a1405);border:1px solid #ffcf4a66;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:11.5px;text-align:center;padding:4px;transform:rotateY(90deg);transition:transform .5s ease}
.sr-h div.on{transform:none} .sr-h span{font-size:22px} html.calm .sr-h div{transform:none}
.sr-b{margin-top:10px;font-size:12.5px;color:#8b93b0} .sr-b b{color:#eef1f8}
/* ---------- v0.78 轉會記者會 ---------- */
.prc{position:relative;border-radius:12px;overflow:hidden;aspect-ratio:4/3;max-height:340px;margin:4px auto 8px;background:#0b1024}
.prc-wall{position:absolute;inset:0 0 34% 0;background-color:var(--c1);background-image:radial-gradient(circle at 25% 33%,var(--c2) 0 7%,#0000 7.5%),radial-gradient(circle at 75% 33%,#ffffff22 0 7%,#0000 7.5%),radial-gradient(circle at 50% 83%,#ffffff22 0 7%,#0000 7.5%),radial-gradient(circle at 0 83%,var(--c2) 0 7%,#0000 7.5%),radial-gradient(circle at 100% 83%,var(--c2) 0 7%,#0000 7.5%);background-size:64px 52px}
.prc-wall::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,#0000 55%,#0006)}
.prc-who{position:absolute;left:50%;bottom:15%;width:32%;transform:translateX(-50%);animation:prcSit .7s cubic-bezier(.2,1.2,.4,1) .2s both} .prc-who svg{width:100%;height:auto;image-rendering:pixelated} @keyframes prcSit{from{transform:translate(-50%,20px);opacity:0}}
.prc-tbl{position:absolute;left:4%;right:4%;bottom:12%;height:22%;background:linear-gradient(180deg,var(--c1),color-mix(in srgb,var(--c1) 60%,#000));border-radius:6px 6px 2px 2px;box-shadow:0 10px 24px #000a;border-top:4px solid #ffffff2a}
.prc-pl{position:absolute;left:50%;bottom:21%;transform:translateX(-50%);background:#f3f3f3;color:#141a33;font:900 12px var(--sans);padding:3px 12px;border-radius:3px;letter-spacing:.15em;z-index:3;white-space:nowrap}
.prc-mic{position:absolute;bottom:33%;width:4px;height:16%;background:#222;border-radius:2px;z-index:2;transform-origin:bottom}
.prc-mic i{position:absolute;left:50%;top:-10px;width:16px;height:18px;margin-left:-8px;border-radius:7px;background:var(--m)} .prc-mic b{position:absolute;left:50%;top:6px;width:20px;height:9px;margin-left:-10px;background:var(--m);border-radius:2px;font:900 6px/9px var(--sans);color:#fff;text-align:center}
.prc-fl{position:absolute;width:42%;aspect-ratio:1;border-radius:50%;background:radial-gradient(#fff,#fff0 60%);opacity:0;pointer-events:none;z-index:7;animation:prcFl 2.6s linear infinite} @keyframes prcFl{0%,100%{opacity:0}2%{opacity:.95}7%{opacity:0}}
.prc-lb{position:absolute;left:8px;top:8px;z-index:8;background:#e0483e;color:#fff;font:900 11px var(--mono);padding:2px 7px;border-radius:3px;letter-spacing:.1em} .prc-lb::before{content:'● '}
.prc-crowd{position:absolute;left:0;right:0;bottom:0;height:30%;z-index:6;pointer-events:none}
.prc-rp{position:absolute;bottom:-14%;width:16%;aspect-ratio:1/1.05} .prc-rp .hd{position:absolute;left:24%;top:0;width:52%;aspect-ratio:1;border-radius:50%;background:var(--h)} .prc-rp .bd{position:absolute;left:0;right:0;top:40%;bottom:0;border-radius:40% 40% 0 0;background:var(--b)}
.prc-rp .arm{position:absolute;left:70%;width:10%;height:62%;background:var(--b);border-radius:6px;top:-30%;transform-origin:bottom;animation:prcHand 1.6s ease-in-out infinite} .prc-rp .arm::after{content:'';position:absolute;left:-30%;top:-14%;width:160%;aspect-ratio:1;border-radius:50%;background:#e8c4a0} @keyframes prcHand{50%{transform:rotate(8deg)}}
.prc-rp .cam{position:absolute;left:12%;top:8%;width:70%;height:34%;background:#1b1b1b;border-radius:3px;box-shadow:0 0 0 2px #333} .prc-rp .cam::before{content:'';position:absolute;left:30%;top:14%;width:40%;aspect-ratio:1;border-radius:50%;background:radial-gradient(#5a8cff,#0a0f2a 60%);border:2px solid #444}
.prc-rp .nt{position:absolute;right:-6%;top:40%;width:34%;height:30%;background:#f4f1e8;border-radius:2px;transform:rotate(-12deg)}
.prc-ans{display:grid;gap:6px;margin-top:8px} .prc-ans .btn{text-align:left}
/* ---------- v0.78 國家隊徵召電話 ---------- */
.card.call{background:none;border:none;padding:0} .card.call h4{display:none}
/* v0.79 國家隊來電改版:電話裡決定接受或拒絕;買了手機會換外觀(預設／梨子 Pear／星河 Nova／雙生 Duet),樣式與 t/phone-look.html 同步 */
.nc2{display:flex;justify-content:center;padding:6px 0} .nc2 b{color:inherit}
.nc2 .ph{position:relative;color:#fff;overflow:hidden}
.nc2 .ph .tm{text-align:center;font:600 12px ui-monospace,monospace;color:#ffffffaa}
.nc2 .ph .fl{width:72px;height:72px;border-radius:50%;margin:0 auto;overflow:hidden;border:3px solid #fff;background:#fff;display:grid;place-items:center;animation:ncRing 1.1s ease-in-out infinite}
.nc2 .ph .fl svg{width:100%;height:100%}
.nc2 .ph .cl{text-align:center;margin-top:12px}
.nc2 .ph .cl small{color:#ffffffaa;font-size:12px;letter-spacing:.1em}
.nc2 .ph .cl b{display:block;font-size:21px;margin-top:2px}
.nc2 .ph .cl span{display:block;font-size:13px;color:#ffffffcc}
.nc2 .ph .bt{display:flex;justify-content:space-around;align-items:flex-start}
.nc2 .ph .bt .w{display:flex;flex-direction:column;align-items:center;gap:7px;font-size:12px;color:#ffffffcc}
.nc2 .ph .bt button{width:68px;height:68px;border-radius:50%;border:none;display:grid;place-items:center;padding:0;cursor:pointer}
.nc2 .ph .bt button svg{width:34px;height:34px;fill:#fff}
.nc2 .ph .bt .no{background:#e0483e}
.nc2 .ph .bt .no svg{transform:rotate(135deg)}
.nc2 .ph .bt .ok{background:#3fb950;animation:ncShk 1s ease-in-out infinite}
.nc2 .ph .tk{display:none;flex-direction:column;gap:8px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#ffffff30 transparent}
.nc2 .ph.on .tk{display:flex}
.nc2 .ph.on .ring{display:none}
.nc2 .tk .t{font-size:12px;color:#ffffffaa;text-align:center}
.nc2 .tk .t.ok{color:#5fe07a}
.nc2 .tk .t.bad{color:#ff8a80}
.nc2 .tk .bb{background:#ffffff14;border-radius:12px;padding:8px 10px;font-size:13px;line-height:1.5;animation:ncIn .3s ease both}
.nc2 .tk .bb b{color:#ffcf4a}
.nc2 .tk .bb.me{background:#3fb95033;align-self:flex-end}
.nc2 .tk .ans{display:grid;gap:6px;animation:ncIn .3s ease both}
.nc2 .tk .ans button{text-align:left;padding:8px 10px;border-radius:10px;border:1px solid #ffffff33;background:#ffffff10;color:#fff;font:13px inherit;cursor:pointer}
.nc2 .tk .ans button.dn{border-color:#ff8a8066;color:#ffd1cc}
.nc2 .tk .ans button small{display:block;color:#ffffff99;font-size:11px}
@keyframes ncRing{0%,100%{box-shadow:0 0 0 0 #ffffff55}50%{box-shadow:0 0 0 12px #ffffff00}}
@keyframes ncShk{0%,100%{transform:rotate(0)}10%,30%{transform:rotate(-12deg)}20%,40%{transform:rotate(12deg)}50%{transform:rotate(0)}}
@keyframes ncIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.nc2 .m-def{width:270px;min-height:440px;border-radius:30px;border:7px solid #05070f;background:linear-gradient(180deg,#1a2c5a,#0a1022);box-shadow:0 18px 40px #0008}
.nc2 .m-def .tm{margin-top:12px}
.nc2 .m-def .fl{margin-top:30px}
.nc2 .m-def .bt{position:absolute;bottom:26px;left:0;right:0}
.nc2 .m-def .tk{position:absolute;inset:0;padding:48px 12px 12px;background:linear-gradient(180deg,#0f1a3a,#060a18)}
.nc2 .m-pear{width:270px;min-height:470px;border-radius:46px;border:5px solid #0b0b0d;box-shadow:0 0 0 2px #9aa0a8,0 18px 40px #0008;background:#111}
.nc2 .m-pear::before{content:"";position:absolute;inset:0;background:radial-gradient(120% 70% at 50% 18%,#d6455f 0%,#7a2340 35%,#1d1426 75%);filter:saturate(1.1);opacity:.95}
.nc2 .m-pear::after{content:"";position:absolute;top:10px;left:50%;transform:translateX(-50%);width:92px;height:26px;border-radius:20px;background:#000;z-index:3}
.nc2 .m-pear>*{position:relative;z-index:2}
.nc2 .m-pear .tm{margin-top:46px;font:500 13px -apple-system,sans-serif;color:#ffffffcc;letter-spacing:.02em}
.nc2 .m-pear .fl{margin-top:22px;width:84px;height:84px;border:none;box-shadow:0 6px 20px #0006}
.nc2 .m-pear .cl b{font-weight:300;font-size:26px;letter-spacing:.02em}
.nc2 .m-pear .cl small{text-transform:none;letter-spacing:.02em}
.nc2 .m-pear .bt{position:absolute;bottom:34px;left:0;right:0;padding:0 10px}
.nc2 .m-pear .bt button{width:70px;height:70px}
.nc2 .m-pear .tk{position:absolute;inset:0;padding:52px 14px 14px;background:linear-gradient(180deg,#2a1830ee,#0d0a12f5);backdrop-filter:blur(8px)}
.nc2 .m-pear .tk .bb{border-radius:18px;background:#ffffff1c}
.nc2 .m-pear .brand{position:absolute;bottom:8px;left:0;right:0;text-align:center;font-size:10px;color:#ffffff55;letter-spacing:.2em}
.nc2 .m-nova{width:276px;min-height:470px;border-radius:22px;border:4px solid #15171c;box-shadow:0 0 0 1px #3a3f4a,0 18px 40px #0008;background:#05060c}
.nc2 .m-nova::before{content:"";position:absolute;inset:0;background:radial-gradient(90% 50% at 15% 10%,#3d7bff55,transparent 70%),radial-gradient(80% 50% at 90% 40%,#18c6b455,transparent 70%),radial-gradient(90% 60% at 40% 100%,#8a3dff44,transparent 70%),#070912}
.nc2 .m-nova::after{content:"";position:absolute;top:12px;left:50%;transform:translateX(-50%);width:12px;height:12px;border-radius:50%;background:#000;box-shadow:0 0 0 2px #1b1e27;z-index:3}
.nc2 .m-nova>*{position:relative;z-index:2}
.nc2 .m-nova .tm{margin-top:40px;text-align:left;padding-left:22px;font:600 26px "Segoe UI",Roboto,sans-serif;color:#fff}
.nc2 .m-nova .tm small{display:block;font-size:12px;font-weight:400;color:#ffffff99}
.nc2 .m-nova .fl{margin-top:26px;border-radius:24px;width:78px;height:78px;border:2px solid #ffffff55}
.nc2 .m-nova .cl b{font-family:"Segoe UI",Roboto,sans-serif;font-weight:600}
.nc2 .m-nova .tk{position:absolute;inset:0;padding:44px 12px 12px;background:linear-gradient(180deg,#0a0e1ef2,#05060cf8)}
.nc2 .m-nova .tk .bb{border-radius:6px 16px 16px 16px}
.nc2 .m-nova .tk .bb.me{border-radius:16px 6px 16px 16px}
.nc2 .m-nova .brand{position:absolute;bottom:8px;left:0;right:0;text-align:center;font-size:10px;color:#ffffff44;letter-spacing:.25em}
@keyframes ncPulse{0%{box-shadow:0 0 0 0 #3fb95088}100%{box-shadow:0 0 0 16px #3fb95000}}
.nc2 .m-duet{position:relative;width:100%;max-width:452px;aspect-ratio:452/330;border-radius:38px;color:#fff;
  background:linear-gradient(135deg,#f4f4f2,#a9a9a6 22%,#e8e8e4 48%,#8f8f8c 76%,#dcdcd8);box-shadow:0 0 0 1px #6f6f6c,0 22px 36px #0008,inset 0 0 0 1px #ffffffaa}
.nc2 .m-duet::before,.nc2 .m-duet::after{content:"";position:absolute;left:50%;width:14px;height:4px;margin-left:-7px;background:#5d5d5a;border-radius:1px;z-index:3}
.nc2 .m-duet::before{top:0}
.nc2 .m-duet::after{bottom:0}
.nc2 .m-duet .gl{position:absolute;inset:6px;border-radius:32px;background:#000;padding:6px;display:flex}
.nc2 .m-duet .dsc{position:relative;flex:1;border-radius:27px;overflow:hidden;display:flex;
  background:radial-gradient(70% 90% at 22% 30%,#3a5f9a,transparent 70%),radial-gradient(60% 80% at 85% 85%,#7a3b55,transparent 70%),linear-gradient(135deg,#1a2440,#0b1022)}
.nc2 .m-duet .dsc::after{content:"";position:absolute;top:0;bottom:0;left:50%;width:2px;margin-left:-1px;background:linear-gradient(90deg,transparent,#ffffff14,transparent);pointer-events:none}
.nc2 .m-duet .isl{position:absolute;top:8px;left:75%;transform:translateX(-50%);width:62px;height:18px;border-radius:12px;background:#000;z-index:4}
.nc2 .m-duet .A,.nc2 .m-duet .B{position:relative;width:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:14px}
.nc2 .m-duet .A .tm{position:absolute;top:12px;left:18px;font:600 12px -apple-system,sans-serif;color:#fff}
.nc2 .m-duet .A .fl{width:70px;height:70px;border:none;box-shadow:0 6px 18px #0007}
.nc2 .m-duet .A .cl b{font-weight:400;font-size:22px}
.nc2 .m-duet .B .ring{display:flex;flex-direction:column;gap:20px;align-items:stretch;width:100%}
.nc2 .m-duet .B .ring .hint{text-align:center;color:#ffffffaa;font-size:12px}
.nc2 .m-duet .B .bt button{width:62px;height:62px}
.nc2 .m-duet .B .bt button svg{width:30px;height:30px}
.nc2 .m-duet .B .tk{display:none;width:100%;height:100%;padding:28px 6px 6px}
.nc2 .m-duet .incall{display:none;width:100%;flex-direction:column;align-items:center;gap:8px}
.nc2 .m-duet .incall .who{display:flex;align-items:center;gap:8px;align-self:flex-start;margin-left:4px}
.nc2 .m-duet .incall .who .av{width:30px;height:30px;border-radius:50%;overflow:hidden;background:#fff;display:block}
.nc2 .m-duet .incall .who .av svg{width:100%;height:100%}
.nc2 .m-duet .incall .who b{font-size:14px;font-weight:600;display:block}
.nc2 .m-duet .incall .who small{font:12px ui-monospace,monospace;color:#ffffffaa}
.nc2 .m-duet .incall .wv{display:flex;align-items:center;gap:3px;height:58px}
.nc2 .m-duet .incall .wv i{width:3px;border-radius:2px;background:#ffffffcc;animation:ncWv 1s ease-in-out infinite}
.nc2 .m-duet .incall .big{width:74px;height:74px;border-radius:50%;overflow:hidden;margin:0 10px;box-shadow:0 0 0 3px #ffffff33}
.nc2 .m-duet .incall .big svg{width:100%;height:100%}
.nc2 .m-duet .incall .row{display:flex;align-items:center}
.nc2 .m-duet .incall .ct{display:flex;gap:12px}
.nc2 .m-duet .incall .ct span{width:38px;height:38px;border-radius:50%;background:#ffffff26;display:grid;place-items:center;font-size:15px}
.nc2 .m-duet .incall .ct .end{background:#e0483e}
.nc2 .m-duet .incall .ct .end svg{width:20px;height:20px;fill:#fff;transform:rotate(135deg)}
@keyframes ncWv{0%,100%{transform:scaleY(.35)}50%{transform:scaleY(1)}}
.nc2 .m-duet.on .A>.tm,.nc2 .m-duet.on .A>.fl,.nc2 .m-duet.on .A>.cl{display:none}
.nc2 .m-duet.on .incall{display:flex}
.nc2 .m-duet.on .B .ring{display:none}
.nc2 .m-duet.on .B .tk{display:flex}
.nc2 .m-duet.st{width:318px;height:440px}
.nc2 .m-duet.st .dsc{flex-direction:column}
.nc2 .m-duet.st .A,.nc2 .m-duet.st .B{width:auto;height:50%}
.nc2 .m-duet.st .dsc::after{top:50%;bottom:auto;left:0;right:0;width:auto;height:2px;margin:-1px 0 0;background:linear-gradient(180deg,transparent,#ffffff14,transparent)}
.nc2 .m-duet.st::before,.nc2 .m-duet.st::after{left:auto;top:50%;width:4px;height:14px;margin:-7px 0 0}
.nc2 .m-duet.st::before{left:0}
.nc2 .m-duet.st::after{right:0;bottom:auto}
.nc2 .m-duet.st .isl{left:50%}
.nc2 .m-duet.st .A{padding-top:30px}
.nc2 .m-duet.st .A .fl{width:58px;height:58px}
.nc2 .m-duet.st .A .cl{margin-top:6px}
.nc2 .m-duet.st .A .cl b{font-size:19px}
.nc2 .m-duet.st .B{background:#00000055}
.nc2 .m-duet.st .B .tk{padding:8px 6px}
.nc2 .m-duet.st .call .wv{height:40px}
.nc2 .m-duet.st .call .big{width:56px;height:56px}
.nc2 .m-nova .sw{position:absolute;bottom:30px;left:16px;right:16px;height:74px;border-radius:40px;background:#ffffff10;border:1px solid #ffffff22;display:flex;align-items:center;justify-content:space-between;padding:0 8px;touch-action:none}
.nc2 .m-nova .sw .ed{width:48px;height:48px;border-radius:50%;border:none;display:grid;place-items:center;cursor:pointer;padding:0;background:transparent;opacity:.85}
.nc2 .m-nova .sw .ed svg{width:24px;height:24px}
.nc2 .m-nova .sw .no svg{fill:#ff6b60;transform:rotate(135deg)}
.nc2 .m-nova .sw .ok svg{fill:#5fe07a}
.nc2 .m-nova .sw .knob{touch-action:none;user-select:none;-webkit-user-select:none;position:absolute;left:50%;top:50%;width:62px;height:62px;margin:-31px 0 0 -31px;border-radius:50%;background:#fff;display:grid;place-items:center;cursor:grab;box-shadow:0 4px 14px #0008;transition:transform .25s,background .2s;z-index:2}
.nc2 .m-nova .sw .knob svg{pointer-events:none;width:28px;height:28px;fill:#1b1e27;transition:fill .2s}
.nc2 .m-nova .sw .knob.drag{transition:none;cursor:grabbing}
.nc2 .m-nova .sw .knob.to-ok{background:#3fb950}
.nc2 .m-nova .sw .knob.to-ok svg{fill:#fff}
.nc2 .m-nova .sw .knob.to-no{background:#e0483e}
.nc2 .m-nova .sw .knob.to-no svg{fill:#fff;transform:rotate(135deg)}
.nc2 .m-nova .sw .knob::before,.nc2 .m-nova .sw .knob::after{content:"";position:absolute;inset:-8px;border-radius:50%;border:2px solid #ffffff33;animation:ncPulse2 1.6s ease-out infinite}
.nc2 .m-nova .sw .knob::after{animation-delay:.8s}
.nc2 .m-nova .swh{position:absolute;bottom:110px;left:0;right:0;text-align:center;font-size:11px;color:#ffffff88;letter-spacing:.05em}
@keyframes ncPulse2{0%{transform:scale(.9);opacity:1}100%{transform:scale(1.5);opacity:0}}
.nc2 .m-duet.st{width:318px;max-width:100%;height:440px;aspect-ratio:auto}
.ntc{width:min(270px,100%);margin:0 auto;border-radius:30px;border:7px solid #05070f;background:linear-gradient(180deg,#1a2c5a,#0a1022);min-height:440px;position:relative;overflow:hidden;box-shadow:0 18px 40px #000c;color:#fff}
.ntc-tm{text-align:center;font:600 12px var(--mono);color:#ffffffaa;margin-top:12px} .ntc-fl{width:70px;height:70px;border-radius:50%;margin:30px auto 0;overflow:hidden;border:3px solid #fff;display:grid;place-items:center;background:#fff;animation:ntcRing 1.1s ease-in-out infinite}
.ntc-fl svg{width:100%;height:100%} @keyframes ntcRing{0%,100%{box-shadow:0 0 0 0 #ffffff66}50%{box-shadow:0 0 0 16px #ffffff00}}
.ntc-cl{text-align:center;margin-top:14px} .ntc-cl small{color:#ffffffaa;font-size:12px;letter-spacing:.1em} .ntc-cl b{display:block;font-size:21px;margin-top:4px} .ntc-cl span{display:block;font-size:13px;color:#ffffffcc;margin-top:2px}
.ntc-bt{position:absolute;bottom:30px;left:0;right:0;display:flex;justify-content:space-around} .ntc-bt button{width:56px;height:56px;border-radius:50%;border:none;font-size:22px;cursor:pointer;color:#fff} .ntc-bt .no{background:#e0483e} .ntc-bt .ok{background:#3fb950;animation:ntcShk 1s ease-in-out infinite}
@keyframes ntcShk{0%,60%,100%{transform:none}70%{transform:rotate(-14deg)}80%{transform:rotate(14deg)}90%{transform:rotate(-8deg)}}
.ntc-tk{position:absolute;inset:0;padding:54px 12px 12px;display:none;flex-direction:column;gap:8px;background:linear-gradient(180deg,#0f1a3a,#060a18);overflow-y:auto} .ntc.on .ntc-tk{display:flex}
.ntc-tk .t{font-size:12px;color:#ffffffaa;text-align:center} .ntc-tk .t.ok{color:#3fb950} .ntc-tk .t.bad{color:#ff8a80}
.ntc-tk .bb{background:#ffffff14;border-radius:12px;padding:8px 10px;font-size:13px;line-height:1.5;animation:ntcIn .3s ease both} .ntc-tk .bb b{color:#ffcf4a} .ntc-tk .bb.me{background:#3fb95033;align-self:flex-end}
@keyframes ntcIn{from{opacity:0;transform:translateY(8px)}}
.ntc-ans{display:grid;gap:6px} .ntc-ans button{text-align:left;padding:7px 9px;border-radius:9px;border:1px solid #ffffff33;background:#ffffff10;color:#fff;font:13px var(--sans);cursor:pointer}
/* ---------- v0.78 更衣室群組(側欄) ---------- */
#side[data-tab="sum"] #side-chat,#side[data-tab="ppl"] #side-chat,#side[data-tab="chat"] #side-dash,#side[data-tab="chat"] #side-ppl,#side[data-tab="chat"] #side-list,#side[data-tab="chat"]>h3{display:none}
#side-chat{margin:4px 0 14px}
.gc{border-radius:14px;overflow:hidden;border:1px solid var(--edge);background:#0f1426;color:#eef1f8}
.gc-h{display:flex;align-items:center;gap:9px;padding:9px 11px;background:#161d36;border-bottom:1px solid var(--edge)} .gc-av{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;font:900 13px var(--sans);color:#fff;flex:none}
.gc-h b{font-size:14px} .gc-h small{display:block;color:#8b93b0;font-size:11px}
.gc-ms{padding:9px;display:flex;flex-direction:column;gap:7px;max-height:420px;overflow-y:auto}
.gm{display:flex;gap:6px;align-items:flex-end} .gm .a{width:26px;height:26px;border-radius:50%;flex:none;display:grid;place-items:center;font:800 11px var(--sans);color:#fff}
.gm .bub{max-width:78%;background:#1e2745;border-radius:13px 13px 13px 4px;padding:6px 9px;font-size:13px;line-height:1.45} .gm .bub small{display:block;color:#8fb0e8;font-size:10.5px;font-weight:700}
.gm.me{flex-direction:row-reverse} .gm.me .bub{background:#5b4bff;border-radius:13px 13px 4px 13px}
.gm .stk{font-size:34px;line-height:1} .gm .meme{display:block;background:#000;border-radius:9px;padding:6px;text-align:center;font:900 12px var(--sans);color:#fff;width:140px} .gm .meme i{display:block;font-style:normal;font-size:30px;margin:3px 0}
.gc-rp{display:flex;gap:5px;padding:7px;border-top:1px solid var(--edge);background:#161d36;overflow-x:auto} .gc-rp button{flex:none;padding:6px 10px;border-radius:999px;border:1px solid var(--edge);background:var(--panel);color:var(--chalk);font:12.5px var(--sans);cursor:pointer;white-space:nowrap}
/* ---------- v0.78 球場巡禮 ---------- */
#stdp{position:fixed;inset:0;z-index:90;display:none;align-items:center;justify-content:center;background:#0009;padding:16px} #stdp.open{display:flex}
#stdp .box{width:min(560px,100%);max-height:calc(100vh - 32px);overflow-y:auto;background:var(--panel);color:var(--chalk);border:1px solid var(--edge);border-radius:14px;padding:16px;box-shadow:0 20px 50px #000c}
#stdp h3{font-size:15px;margin-bottom:6px;display:flex;justify-content:space-between;align-items:center} #stdp h3 button{background:none;border:1px solid var(--edge);color:var(--dim);border-radius:6px;padding:0 8px;cursor:pointer}
.stp-cf{display:flex;gap:5px;overflow-x:auto;margin:8px 0} .stp-cf button{flex:none;padding:6px 10px;border-radius:999px;border:1px solid var(--edge);background:var(--panel2);color:var(--chalk);font:700 12.5px var(--sans);cursor:pointer} .stp-cf button.on{border-color:var(--amber);color:var(--amber)} .stp-cf small{color:var(--dim);font-weight:500;margin-left:3px}
.stp-lg{display:flex;flex-direction:column;gap:6px} .stp-lg details{border:1px solid var(--edge);border-radius:12px;background:var(--panel2);overflow:hidden}
.stp-lg summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:8px;padding:9px 12px;font-weight:700;font-size:14px} .stp-lg summary::-webkit-details-marker{display:none} .stp-lg summary small{margin-left:auto;color:var(--dim);font-weight:500;font-size:12px}
.stp-lg summary i{display:block;width:56px;height:5px;border-radius:3px;background:var(--edge);overflow:hidden} .stp-lg summary i b{display:block;height:100%;background:var(--amber)}
.stp-tg{display:grid;grid-template-columns:repeat(2,1fr);gap:6px;padding:0 8px 8px}
.stp-c{display:block;text-align:left;border-radius:10px;overflow:hidden;border:1px solid var(--edge);background:var(--panel);color:var(--chalk);padding:0;cursor:pointer;font:inherit} .stp-c .im{display:block;height:64px;background:linear-gradient(180deg,#24315f,#141b38)} .stp-c svg{width:100%;height:100%;display:block}
.stp-c b{display:block;font-size:13px;padding:6px 8px 0} .stp-c small{display:block;color:var(--dim);font-size:11px;padding:0 8px 6px} .stp-c.lock{opacity:.45;filter:grayscale(1)} .stp-c.lock b::before{content:'🔒 '}
.stp-mem{margin:0 8px 8px;border:1px solid var(--edge);border-radius:12px;background:var(--panel2);padding:10px 12px;font-size:13.5px;line-height:1.7;display:none} .stp-mem.on{display:block} .stp-mem .fx{color:var(--dim);font-size:12.5px}
/* 大字特效與彩帶 */
.bigfx{position:fixed;left:50%;top:38%;z-index:80;font:900 60px/1 var(--sans);letter-spacing:.06em;color:var(--amber);white-space:nowrap;
  text-shadow:0 4px 24px #000c,0 0 34px #ffcf4a88;animation:big 1.3s ease forwards;pointer-events:none;transform:translate(-50%,-50%)}
.bigfx.cool{color:var(--blue);text-shadow:0 4px 24px #000c,0 0 34px #6cc6ff88}
@keyframes big{0%{opacity:0;transform:translate(-50%,-50%) scale(.4)}18%{opacity:1;transform:translate(-50%,-50%) scale(1.12)}32%{transform:translate(-50%,-50%) scale(1)}78%{opacity:1}100%{opacity:0;transform:translate(-50%,-62%)}}
.conf{position:fixed;top:-14px;width:7px;height:12px;z-index:79;pointer-events:none;border-radius:2px;animation:fall linear forwards}
@keyframes fall{to{transform:translateY(106vh) rotate(760deg)}}
.ball{animation:bob 3.2s ease-in-out infinite}
@keyframes bob{50%{transform:translateY(-7px) rotate(25deg)}}
.hlrow{font-size:13.5px;padding:5px 0;border-bottom:1px dashed var(--edge)} .hlrow:last-child{border-bottom:none}
.hlrow b{font-family:var(--mono);color:var(--amber);font-weight:700}
/* 生涯結算(v0.22):章節、數據磚、歷史榜 */
.card.chap .ch-meta{font-family:var(--mono);font-size:12px;color:var(--dim);margin-bottom:6px}
.card.chap .ch-story{font-size:14px;line-height:1.7}
.card.chap .ch-stat{font-family:var(--mono);font-size:12.5px;color:var(--blue);margin-top:6px}
.card.chap .ch-hon{font-size:13px;color:var(--amber);margin-top:6px;line-height:1.6}
.card .fx{font-size:12.5px;color:var(--dim)}
.tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.tile{background:var(--panel2);border:1px solid var(--edge);border-radius:10px;padding:8px 10px;min-width:0}
.tile small{display:block;font-size:11.5px;color:var(--dim);letter-spacing:.05em}
.tile b{font-family:var(--mono);font-size:20px;color:var(--amber);word-break:break-all}
.tile em{font-style:normal;font-size:11.5px;color:var(--dim);margin-left:3px}
.tiles-sub{margin-top:8px} .tiles-sub .tile b{font-size:14px;color:var(--chalk)}
@media(max-width:520px){ .tiles{grid-template-columns:repeat(2,1fr)} }
.hbs{display:grid;grid-template-columns:1fr 1fr;gap:10px} @media(max-width:620px){ .hbs{grid-template-columns:1fr} }
.hb-t{display:flex;justify-content:space-between;gap:8px;font-size:13px;font-weight:700;margin:4px 0}
.hb-t span{font-weight:400;color:var(--dim)}
table.hbt tr.me td{color:var(--amber);font-weight:700;background:color-mix(in srgb,var(--amber) 12%,transparent)}
table.hbt tr.gap td{text-align:center;color:var(--dim);padding:0}
.hcab{margin-bottom:8px}
.pctbar{height:8px;border-radius:4px;background:var(--panel2);border:1px solid var(--edge);margin:8px 0;overflow:hidden}
.pctbar i{display:block;height:100%;background:linear-gradient(90deg,var(--blue),var(--amber))}
.card details summary{cursor:pointer;color:var(--blue);font-size:13px}
table.fin tr.inj td{color:var(--bad)}
@media (prefers-reduced-motion:reduce){.var{display:none}}
/* ================= v0.11 視覺 ================= */
:root{--line:#ffffff14;--disp:'Oswald','Noto Sans TC',sans-serif}
/* 首頁 */
#start{background:radial-gradient(ellipse 90% 60% at 30% -10%,#3b2a8acc,transparent 60%),radial-gradient(ellipse 60% 50% at 100% 100%,#1b4a8a55,transparent 60%),var(--bg)}
.s-sky{position:fixed;inset:0;pointer-events:none;overflow:hidden}
.s-sky .lt{position:absolute;top:-20%;width:40vw;height:90vh;background:linear-gradient(180deg,#ffffff1a,transparent 70%);filter:blur(18px);transform-origin:top center}
.s-sky .l1{left:-6vw;transform:rotate(-24deg);animation:sweep 9s ease-in-out infinite alternate}
.s-sky .l2{right:-6vw;transform:rotate(24deg);animation:sweep2 11s ease-in-out infinite alternate}
@keyframes sweep{to{transform:rotate(-14deg)}} @keyframes sweep2{to{transform:rotate(14deg)}}
#start .wrap{position:relative;max-width:1080px;padding:36px 20px 56px;display:grid;gap:22px}
.hero .kicker{display:flex;align-items:center;gap:8px;font:600 11px var(--disp);letter-spacing:.32em;color:#b7adff}
.hero .kicker .dot{width:7px;height:7px;border-radius:50%;background:var(--good);box-shadow:0 0 10px var(--good);animation:blink 1.6s steps(2) infinite}
#start h1{margin-top:10px;line-height:1.05;letter-spacing:0}
#start h1 .en{display:block;font:700 clamp(52px,11vw,92px)/.95 var(--disp);letter-spacing:.04em;
  background:linear-gradient(180deg,#fff 30%,#b7c0e0);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:0 10px 40px #5b4bff55}
#start h1 em{display:block;margin-top:8px;font-size:clamp(22px,4.6vw,30px);font-weight:900;letter-spacing:.18em;color:var(--amber)}
#start .sub{margin:14px 0 6px;font-size:14px;line-height:1.8;letter-spacing:.04em;color:#aab2d0;max-width:30em}
.hero-pitch{display:block;width:100%;max-width:480px;height:auto;margin-top:10px}
.hero-pitch .run{animation:dash 2.4s linear infinite} @keyframes dash{to{stroke-dashoffset:-22}}
.hero-pitch .hb{animation:bob 2.4s ease-in-out infinite;transform-box:fill-box;transform-origin:center} @keyframes bob{50%{transform:translateY(-4px)}}
.feat{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:6px;max-width:480px}
.feat li{background:#ffffff08;border:1px solid var(--line);border-radius:10px;padding:8px 4px;text-align:center;font-size:11.5px;color:var(--dim)}
.feat b{display:block;font:700 22px/1.1 var(--disp);color:var(--chalk)}
#start .panel{background:linear-gradient(180deg,#1a2142e6,#11162ce6);border:1px solid var(--line);border-radius:18px;padding:22px 20px 18px;
  box-shadow:0 20px 50px #000a,inset 0 1px 0 #ffffff12;backdrop-filter:blur(8px);align-self:start}
.ptitle{font:700 12px var(--sans);letter-spacing:.3em;color:#b7adff;display:flex;align-items:center;gap:10px}
.ptitle::after{content:'';flex:1;height:1px;background:linear-gradient(90deg,#7a6cff66,transparent)}
#start .field{margin-top:16px}
.field input{background:#0d1124;border-color:var(--line);border-radius:12px}
.seg button{background:#0d1124;border-color:var(--line);border-radius:12px;transition:.15s}
.seg button:hover{border-color:#7a6cff88;color:var(--chalk)}
.seg button.on{background:linear-gradient(180deg,#2a2470,#1d1a52);color:var(--amber);border-color:var(--amber);box-shadow:0 0 0 1px #ffcf4a33,0 6px 16px #0007}
#nat-desc{color:var(--dim);font-size:12px;margin-top:8px;line-height:1.6}
.natl{font-size:11px;color:var(--dim);letter-spacing:.12em;margin:10px 0 6px} #seg-nat .natl:first-child{margin-top:0}
#seg-nat .seg button{padding:9px 2px;font-size:13.5px}
#btn-start{margin-top:22px;padding:15px;font-size:16px;letter-spacing:.06em}
#start .seedline{margin-top:16px;line-height:1.8}
@media (min-width:900px){ #start .wrap{grid-template-columns:1.1fr 1fr;align-items:center;min-height:100vh;min-height:100dvh;gap:48px} #start .panel{align-self:center} }
/* 卡片 */
.card{background:linear-gradient(180deg,#181f3b,#12172e);border:1px solid var(--line);border-radius:14px;padding:13px 16px;
  box-shadow:0 6px 20px #0006,inset 0 1px 0 #ffffff0a}
.card h4{color:#aab2d0;letter-spacing:.2em}
.card.gold{background:linear-gradient(180deg,#272241,#161a31);border-color:#ffcf4a3a;box-shadow:0 6px 24px #0006,inset 0 1px 0 #ffcf4a1f}
.card.gold h4{color:var(--amber)}
.card.good{border-color:#5fe3a12e} .card.bad{border-color:#ff6b6b26}
.card.red{background:linear-gradient(180deg,#2a1624,#151a2e);border-color:#ff4d4d55}
.card.moment{background:linear-gradient(180deg,#1b2246,#121730)}
.card.story{background:linear-gradient(180deg,#221d4a,#141832)}
.statline{background:#0b0f22;border-color:var(--line);border-radius:8px}
table.fin tr:nth-child(even) td{background:#ffffff05}
table.fin th{font-family:var(--sans);font-size:11px}
/* 年度分隔 */
.yr-head{color:#aab2d0;font-weight:700;padding:14px 0 4px;background:linear-gradient(90deg,transparent 4%,#3a4470 22%,transparent 26%,transparent 74%,#3a4470 78%,transparent 96%) center 60%/100% 1px no-repeat}
/* 記分板 */
#board{position:sticky;background:linear-gradient(180deg,#1d2449,#121630);border-bottom:1px solid var(--line);box-shadow:0 10px 30px #000a}
#board::before{content:'';position:absolute;left:0;right:0;top:0;height:3px;background:linear-gradient(90deg,var(--club,#5b4bff),var(--club2,#ffcf4a))}
.bd-cell{background:linear-gradient(180deg,#10152c,#0b0f22);border-color:var(--line);border-radius:9px}
.bd-cell b{font-family:var(--disp);font-size:20px;font-weight:600;letter-spacing:.02em}
#bd-name{font-size:18px}
#bd-bug{border-color:var(--line);border-radius:8px}
#bd-abt{background:#0b0f22;border-color:var(--line);border-radius:8px}
/* 按鈕與操作區 */
.btn{border-radius:12px;background:linear-gradient(180deg,#1f2747,#181f3b);border-color:var(--line);
  transition:transform .15s,border-color .15s,box-shadow .15s}
.btn:hover{transform:translateY(-1px);box-shadow:0 6px 16px #0007;border-color:#ffcf4a88}
.btn.main{background:linear-gradient(135deg,#6a5cff,#3d33c4);border-color:#8a7dff;box-shadow:0 6px 22px #5b4bff55}
.btn.main:hover{box-shadow:0 8px 28px #5b4bff88}
.btn.warn{border-color:#ff8a4c44} .btn.warn:hover{border-color:#ff8a4c}
#act{background:linear-gradient(180deg,#151b36f2,#0c0f1df7);border-top:1px solid var(--line);box-shadow:0 -12px 30px #0009}
#act .title{color:#b7adff}
.abrow{background:#0f1428;border-color:var(--line);border-radius:10px}
.tcard{background:linear-gradient(180deg,#1b2242,#131830);border-color:var(--line);border-radius:12px}
@media (max-width:600px){ .hero-pitch{display:none} #start .wrap{padding-top:calc(26px + env(safe-area-inset-top,0px));gap:16px} .feat{margin-top:12px} }
svg.scene{max-width:520px;margin-left:auto;margin-right:auto}
.btn.main small{color:#ddd8ff}
/* 大事記時間軸 */
#side h3{position:sticky;top:0;z-index:2;background:linear-gradient(180deg,var(--bg) 70%,transparent);padding:4px 2px 10px;margin:0}
#side-list{position:relative;padding-left:14px}
#side-list::before{content:'';position:absolute;left:4px;top:4px;bottom:4px;width:2px;background:linear-gradient(180deg,#7a6cff66,#2a335400)}
.sd{position:relative;background:linear-gradient(180deg,#181f3b,#12172e);border-color:var(--line);border-left-width:1px;border-radius:10px}
.sd::before{content:'';position:absolute;left:-14px;top:12px;width:8px;height:8px;border-radius:50%;background:var(--blue);box-shadow:0 0 0 3px var(--bg)}
.sd.gold::before{background:var(--amber)} .sd.red::before{background:var(--bad)} .sd.won::before{background:var(--good)} .sd.lost::before{background:#7a3a4a} .sd.story::before{background:#a99bff}
/* ================= v0.15 配色主題 =================
   classic = 原本的深藍紫(上面的樣式);soft 柔和夜賽、warm 暖灰夜間、day 日間淺色
   三個新主題共用 html.th 底下的平面化規則:降對比、去光暈、縮字距 */
html[data-theme="soft"]{--bg:#0d1322;--panel:#151d31;--panel2:#1c2640;--edge:#2a3553;--line:#2a3553;--chalk:#e8ecf4;--dim:#8f99b2;
  --amber:#f2c14e;--clay:#e8955a;--good:#5cd3a5;--bad:#ff6b5b;--blue:#7fa8ff;--pri:#f2c14e;--pri-txt:#1a1405;--pri-soft:#3a3218;
  --sub:#0f1628;--btn:#1a2339;--hd:#a7b1c8;--story:#a99bff;--pitch1:#14304a;--pitch2:#163654;--pline:#ffffff42;--on-amber:#1a1405;
  --gold-bg:#1d2032;--red-bg:#271a26;--act:#111a2df5;--shadow:0 8px 24px #0006;--glow:#f2c14e12} /* v0.23 夜賽轉播:照明燈金為唯一強調色 */
html[data-theme="warm"]{--bg:#1a1816;--panel:#221f1c;--panel2:#2a2622;--edge:#383229;--line:#383229;--chalk:#e4ded3;--dim:#9a9286;
  --amber:#e0a94e;--clay:#d98a55;--good:#8fbf7f;--bad:#d97b6c;--blue:#9db8c9;--pri:#c98a3a;--pri-txt:#1a1816;--pri-soft:#4a3a24;
  --sub:#151311;--btn:#28241f;--hd:#a69d90;--story:#b39ad0;--pitch1:#24211d;--pitch2:#211e1a;--pline:#ffffff22;--on-amber:#1a1816;
  --gold-bg:#28231a;--red-bg:#2a1d1a;--act:#1d1b18f7;--shadow:none}
html[data-theme="day"]{--bg:#eef0f4;--panel:#ffffff;--panel2:#f3f5f9;--edge:#d9dde6;--line:#d9dde6;--chalk:#1f2430;--dim:#687083;
  --amber:#b7791f;--clay:#c0602a;--good:#2f8a5b;--bad:#c2453d;--blue:#2d6fa3;--pri:#2f4ba8;--pri-txt:#ffffff;--pri-soft:#dfe5f7;
  --sub:#f1f3f7;--btn:#f7f8fb;--hd:#5b6377;--story:#6a55c2;--pitch1:#dfe5ee;--pitch2:#d8dfea;--pline:#00000030;--on-amber:#ffffff;
  --gold-bg:#fff8ea;--red-bg:#fdeeee;--act:#ffffffef;--shadow:0 1px 3px #0000001a}
html.th body{background-color:var(--bg);background-image:none}
/* v0.23.1 新增五套轉播風主題 */
html[data-theme="claret"]{--bg:#170d13;--panel:#22141c;--panel2:#2c1a25;--edge:#45293a;--line:#45293a;--chalk:#f1e8ec;--dim:#a8919c;
  --amber:#e8c27a;--clay:#e0916a;--good:#6fcf9f;--bad:#ff7a6b;--blue:#8fb0e8;--pri:#e8c27a;--pri-txt:#2a1508;--pri-soft:#3d2a1a;
  --sub:#120a0f;--btn:#26161f;--hd:#c2aab5;--story:#c29ad6;--pitch1:#2a1520;--pitch2:#2f1824;--pline:#ffffff38;--on-amber:#2a1508;
  --gold-bg:#2a1a1c;--red-bg:#301519;--act:#1a0f15f5;--shadow:0 8px 24px #0007;--glow:#e8c27a10}
html[data-theme="ucl"]{--bg:#070b1d;--panel:#0f1530;--panel2:#16204a;--edge:#25306a;--line:#25306a;--chalk:#eef2ff;--dim:#8d98c4;
  --amber:#c9d6ff;--clay:#ff9e6b;--good:#59d6b0;--bad:#ff6f7d;--blue:#6fc3ff;--pri:#3d6bff;--pri-txt:#ffffff;--pri-soft:#1d2d6e;
  --sub:#0a0f26;--btn:#131b3d;--hd:#a9b4de;--story:#b59cff;--pitch1:#0d1a44;--pitch2:#10204f;--pline:#ffffff3a;--on-amber:#0a0f26;
  --gold-bg:#141d42;--red-bg:#26132e;--act:#0b1128f5;--shadow:0 8px 24px #0008;--glow:#6f8cff16}
html[data-theme="blackgold"]{--bg:#0c0c0d;--panel:#161617;--panel2:#1f1f21;--edge:#2f2d2a;--line:#2f2d2a;--chalk:#eeeae2;--dim:#9a958c;
  --amber:#d4af37;--clay:#d98d4f;--good:#79c79a;--bad:#e5675c;--blue:#a9b8c9;--pri:#d4af37;--pri-txt:#141005;--pri-soft:#3a3115;
  --sub:#0a0a0a;--btn:#1b1b1c;--hd:#b5afa4;--story:#b9a3d6;--pitch1:#1a1a1b;--pitch2:#1e1e20;--pline:#ffffff30;--on-amber:#141005;
  --gold-bg:#1e1b12;--red-bg:#241514;--act:#111112f5;--shadow:0 8px 24px #0008;--glow:#d4af3712}
html[data-theme="orange"]{--bg:#121214;--panel:#1c1c20;--panel2:#25252b;--edge:#36363e;--line:#36363e;--chalk:#f2f0ee;--dim:#9b98a0;
  --amber:#ff8c1a;--clay:#ff6a3d;--good:#5fd19a;--bad:#ff5a5a;--blue:#7fb2ff;--pri:#ff8c1a;--pri-txt:#1a0d00;--pri-soft:#3f2810;
  --sub:#0d0d0f;--btn:#202025;--hd:#b8b5bd;--story:#b39cff;--pitch1:#1d1f26;--pitch2:#212330;--pline:#ffffff33;--on-amber:#1a0d00;
  --gold-bg:#26201a;--red-bg:#2a1717;--act:#151518f5;--shadow:0 8px 24px #0007;--glow:#ff8c1a12}
html[data-theme="sky"]{--bg:#e9f0f8;--panel:#ffffff;--panel2:#f2f6fb;--edge:#cfdbea;--line:#cfdbea;--chalk:#14213d;--dim:#5d6b85;
  --amber:#c2410c;--clay:#c2410c;--good:#1f8a5c;--bad:#c8323a;--blue:#1d5fbf;--pri:#14213d;--pri-txt:#ffffff;--pri-soft:#dbe5f3;
  --sub:#eef3f9;--btn:#f7f9fc;--hd:#4a5a78;--story:#6a4fc2;--pitch1:#d5e3f2;--pitch2:#cddcef;--pline:#ffffffcc;--on-amber:#ffffff;
  --gold-bg:#fff4ec;--red-bg:#fdecee;--act:#ffffffef;--shadow:0 2px 6px #14213d1a;--glow:transparent}
html[data-theme="sky"] .scene .me{stroke:#14213d}
/* v0.72 新配色:戰術板、紅黑條紋(深色);體育報、天藍之城(淺色) */
html[data-theme="tactics"]{--bg:#1d2b24;--panel:#24352c;--panel2:#2b3f35;--edge:#3e5a4b;--line:#3e5a4b;--chalk:#f2f2ea;--dim:#a9b8ad;
  --amber:#f5e6a8;--clay:#f0a888;--good:#9fe0b5;--bad:#e8665a;--blue:#a8d4f0;--pri:#f2f2ea;--pri-txt:#1d2b24;--pri-soft:#34493e;
  --sub:#18241e;--btn:#2a3b32;--hd:#c6d1c8;--story:#e0c4f0;--pitch1:#22362b;--pitch2:#263c30;--pline:#ffffff40;--on-amber:#1d2b24;
  --gold-bg:#2f3a2c;--red-bg:#3a2a28;--act:#1f2e27f5;--shadow:0 8px 24px #0006;--glow:#f2f2ea0d}
html[data-theme="rossoneri"]{--bg:#0b0b0c;--panel:#151314;--panel2:#1d1a1b;--edge:#3a1a1d;--line:#3a1a1d;--chalk:#f2ecec;--dim:#a08f90;
  --amber:#ff4d47;--clay:#f08a5a;--good:#6fcf9f;--bad:#e5534b;--blue:#8fb0e8;--pri:#e0302b;--pri-txt:#ffffff;--pri-soft:#3a1517;
  --sub:#080808;--btn:#1a1617;--hd:#bfaeae;--story:#d39ad6;--pitch1:#1a1213;--pitch2:#201517;--pline:#ffffff30;--on-amber:#ffffff;
  --gold-bg:#2a1a1a;--red-bg:#321416;--act:#110d0ef5;--shadow:0 8px 24px #0008;--glow:#e0302b14}
html[data-theme="paper"]{--bg:#efe8d8;--panel:#f8f3e6;--panel2:#f2ebda;--edge:#d6cbb1;--line:#d6cbb1;--chalk:#1c1a17;--dim:#6b6455;
  --amber:#a11d1d;--clay:#a8501e;--good:#2f6f45;--bad:#a11d1d;--blue:#2a4f7a;--pri:#1c1a17;--pri-txt:#f8f3e6;--pri-soft:#e4dac2;
  --sub:#ece4d2;--btn:#faf6ec;--hd:#4d473c;--story:#5a3d7a;--pitch1:#e2d9c3;--pitch2:#ddd3bb;--pline:#00000030;--on-amber:#ffffff;
  --gold-bg:#f5ead0;--red-bg:#f5dfd8;--act:#f8f3e6f0;--shadow:0 1px 2px #00000022;--glow:transparent;--on-bad:#ffffff}
html[data-theme="skyblue"]{--bg:#eaf4fb;--panel:#ffffff;--panel2:#f2f8fd;--edge:#cfe2f0;--line:#cfe2f0;--chalk:#13233b;--dim:#5f7590;
  --amber:#b7791f;--clay:#c0602a;--good:#2f8a5b;--bad:#c2453d;--blue:#2b6cb0;--pri:#2f86c4;--pri-txt:#ffffff;--pri-soft:#dbeefa;
  --sub:#eef6fc;--btn:#f6fafe;--hd:#4f6782;--story:#6a55c2;--pitch1:#d8e8f3;--pitch2:#d1e3f0;--pline:#00000026;--on-amber:#ffffff;
  --gold-bg:#fff8ea;--red-bg:#fdeeee;--act:#ffffffef;--shadow:0 1px 3px #0000001a;--glow:transparent}
html[data-theme="paper"] .scene .me{stroke:#1c1a17} html[data-theme="skyblue"] .scene .me{stroke:#13233b}
html.th:not([data-theme="day"]) body{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 620'><g fill='none' stroke='%23ffffff' stroke-opacity='.035' stroke-width='2'><rect x='12' y='12' width='376' height='596' rx='4'/><line x1='12' y1='310' x2='388' y2='310'/><circle cx='200' cy='310' r='58'/><rect x='108' y='12' width='184' height='92'/><rect x='108' y='516' width='184' height='92'/></g></svg>");
  background-size:min(560px,100vw) auto;background-position:center top;background-repeat:no-repeat;background-attachment:fixed}
/* 記分板 */
html.th #board{background:var(--panel);box-shadow:var(--shadow);border-color:var(--edge)}
html.th #board::before{background:linear-gradient(90deg,var(--club,var(--pri)),var(--club2,var(--amber)))}
html.th .bd-cell{background:var(--sub);border-color:var(--edge)}
html.th .bd-cell b{text-shadow:none}
html.th #bd-bug{border-color:var(--edge)} html.th #bd-team{background:var(--sub)}
html.th #bd-lg{color:var(--on-amber)} html.th #bd-clock{background:var(--pri);color:var(--pri-txt)}
html.th .mt i{background:var(--sub);border-color:var(--edge)}
html.th .mt i b{background:var(--pri)} html.th #mt-fans i b{background:var(--amber)} html.th #mt-form i b{background:var(--good)} html.th #mt-fatigue i b{background:var(--bad)}
html.th #bd-track{background:var(--edge)} html.th #bd-ball{box-shadow:none;background:var(--chalk)}
html.th #bd-abt{background:var(--sub);border-color:var(--edge)}
html.th .abc .ab1{background:var(--sub)} html.th .abc .ab1 i{background:linear-gradient(90deg,var(--pri),var(--amber))}
html.th .abc .ab1 em{background:var(--dim)} html.th .abc .ab2{background:var(--edge)} html.th .abc .ab2 i{background:var(--blue)}
html.th #btn-rev,html.th #btn-side,html.th #btn-restart,html.th #btn-prefs{border-color:var(--edge);color:var(--dim)}
/* 卡片 */
html.th .card{background:var(--panel);border-color:var(--edge);box-shadow:var(--shadow);border-radius:12px}
html.th .card h4{color:var(--hd);letter-spacing:.06em}
html.th .card p,html.th .mres{font-size:15px;line-height:1.75}
html.th .card.gold{background:var(--gold-bg);border-color:color-mix(in srgb,var(--amber) 35%,transparent);box-shadow:var(--shadow)}
html.th .card.red{background:var(--red-bg);border-color:color-mix(in srgb,var(--bad) 45%,transparent)}
html.th .card.good{border-color:color-mix(in srgb,var(--good) 30%,transparent)} html.th .card.bad{border-color:color-mix(in srgb,var(--bad) 28%,transparent)}
html.th .card.moment,html.th .card.story{background:var(--panel)}
html.th .card.story{border-color:color-mix(in srgb,var(--story) 60%,transparent);box-shadow:var(--shadow)} html.th .card.story h4{color:var(--story)}
html.th .card.moment.won{border-color:color-mix(in srgb,var(--amber) 50%,transparent)}
html.th .card .call{color:var(--blue)}
html.th .mmin,html.th .var{color:var(--on-amber)} html.th .var{background:var(--blue);color:var(--bg)}
html.th .statline,html.th .tag{background:var(--sub);border-color:var(--edge)}
html.th table.fin tr:nth-child(even) td{background:color-mix(in srgb,var(--chalk) 3%,transparent)}
html.th table.ltab tr.me td{background:color-mix(in srgb,var(--amber) 12%,transparent)}
html.th .yr-head{color:var(--dim);background:linear-gradient(90deg,transparent 4%,var(--edge) 22%,transparent 26%,transparent 74%,var(--edge) 78%,transparent 96%) center 60%/100% 1px no-repeat}
html.th .scr-head{color:var(--dim);letter-spacing:.06em} html.th .scr-head .dots i{background:var(--edge)} html.th .scr-head .dots i.d{background:var(--pri)}
html.th #log.review .scr.cur{border-top-color:var(--edge)}
/* 球場 */
html.th svg.scene{background:repeating-linear-gradient(180deg,var(--pitch1) 0 24px,var(--pitch2) 24px 48px);border-color:var(--edge)}
html.th .scene .pl{stroke:var(--pline)} html.th .scene .pdot{fill:var(--pline)}
html.th .scene .goal{stroke:var(--chalk);fill:color-mix(in srgb,var(--chalk) 8%,transparent)}
html.th .scene .mate{fill:var(--story);stroke:none} html.th .scene .opp{fill:var(--bad);stroke:none} html.th .scene .ogk{fill:var(--blue);stroke:none}
html[data-theme="day"] .scene .me{stroke:#1f2430}
/* 按鈕與操作區 */
html.th .btn{background:var(--btn);border-color:var(--edge);color:var(--chalk);box-shadow:none}
html.th .btn:hover{box-shadow:none;border-color:var(--amber)}
html.th .btn.main{background:var(--pri);border-color:var(--pri);color:var(--pri-txt);box-shadow:none}
html.th .btn.main:hover{box-shadow:none;filter:brightness(1.08)}
html.th .btn.main small{color:var(--pri-txt);opacity:.8}
html.th .btn.warn{border-color:color-mix(in srgb,var(--clay) 45%,transparent)} html.th .btn.warn:hover{border-color:var(--clay)}
html.th #act{background:var(--act);border-color:var(--edge);box-shadow:var(--shadow)}
html.th #act .title{color:var(--dim);letter-spacing:.06em}
html.th #act-toggle{background:var(--sub);border-color:var(--edge);color:var(--dim)}
html.th .abrow{background:var(--panel);border-color:var(--edge)} html.th .abrow .bar{background:var(--sub)}
html.th .abrow .bar i{background:linear-gradient(90deg,var(--pri),var(--amber))}
html.th .abrow .pm button{background:var(--btn);border-color:var(--edge);color:var(--chalk)}
html.th .abrow .pm .pl{background:var(--pri);border-color:var(--pri);color:var(--pri-txt)}
html.th .tcard{background:var(--panel);border-color:var(--edge)} html.th .tcard.sel{background:var(--pri-soft);border-color:var(--pri);box-shadow:none}
html.th .tcard.six{box-shadow:none} html.th .tcard .tpow i{color:var(--edge)}
html.th .tcard .tsp,html.th .tcard .tsp b,html.th .abrow .spc{color:var(--blue)}
html.th .tcard .tprog,html.th .trow .tbar{background:var(--edge)} html.th .tcard .tprog i,html.th .trow .tbar i{background:var(--blue)}
html.th .chat .ag,html.th .chat .cl{background:var(--panel2)} html.th .chat .me{background:var(--pri);color:var(--pri-txt)}
html.th .bigfx{text-shadow:0 4px 18px #0008}
/* 大事記 */
html.th #side h3{background:linear-gradient(180deg,var(--bg) 70%,transparent)}
html.th #side-list::before{background:var(--edge)}
html.th .sd{background:var(--panel);border-color:var(--edge)} html.th .sd::before{box-shadow:0 0 0 3px var(--bg)}
html.th .sd.story::before{background:var(--story)}
/* 首頁 */
html.th #start{background:var(--bg)} html.th .s-sky{display:none}
html.th .hero .kicker,html.th .ptitle{color:var(--dim)} html.th .hero .kicker .dot{box-shadow:none;animation:none}
html.th #start h1 .en{background:none;color:var(--chalk);-webkit-text-fill-color:var(--chalk);text-shadow:none}
html.th #start .sub{color:var(--dim)}
html.th .hero-pitch g{stroke:var(--chalk)} html.th .hero-pitch rect[fill^="url"]{display:none}
html.th .feat li{background:var(--panel);border-color:var(--edge)}
html.th #start .panel{background:var(--panel);border-color:var(--edge);box-shadow:var(--shadow);backdrop-filter:none}
html.th .ptitle::after{background:var(--edge)}
html.th .field input,html.th .seg button{background:var(--sub);border-color:var(--edge);color:var(--dim)}
html.th .field input{color:var(--chalk)}
html.th .seg button.on{background:var(--panel2);box-shadow:none;color:var(--amber);border-color:var(--amber)}
html.th .seg button:hover{border-color:var(--pri)}
/* 種子輸入框(全主題) */
#seed-show{width:120px;background:var(--panel2);color:var(--amber);border:1px solid var(--edge);border-radius:6px;padding:2px 6px;font-family:inherit;font-size:12px;text-align:center}
/* ---------- 設定面板 ---------- */
#btn-prefs{background:none;border:1px solid #2a3354;color:#8b93b0;border-radius:8px;font-size:13px;line-height:1;padding:4px 7px;margin-left:6px;cursor:pointer;flex:none}
#prefs{position:fixed;inset:0;z-index:90;display:none;align-items:center;justify-content:center;background:#0008;padding:16px}
#prefs.open{display:flex}
#prefs .box{width:min(420px,100%);max-height:calc(100vh - 32px);overflow-y:auto;background:var(--panel);color:var(--chalk);border:1px solid var(--edge);border-radius:14px;padding:16px;box-shadow:0 20px 50px #0008}
#prefs h3{font-size:14px;margin-bottom:10px;display:flex;justify-content:space-between;align-items:center}
#prefs h3 button{background:none;border:1px solid var(--edge);color:var(--dim);border-radius:6px;padding:0 8px;cursor:pointer}
#prefs .thm{display:grid;grid-template-columns:1fr 1fr;gap:8px}
#prefs .thm button{border-radius:10px;border:2px solid transparent;padding:10px;text-align:left;cursor:pointer;font:700 13px var(--sans)}
#prefs .thm button small{display:block;font-weight:400;font-size:11px;opacity:.75;margin-top:2px}
#prefs .thm button.on{border-color:var(--amber)}
#prefs label{display:flex;gap:8px;align-items:center;margin-top:14px;font-size:13.5px;cursor:pointer}
#prefs .hint{font-size:11.5px;color:var(--dim);margin-top:4px}
#start .prefs-link{color:var(--blue);cursor:pointer}
/* v0.50 成就解鎖提示 */
.achtoast{position:fixed;left:50%;top:calc(10px + env(safe-area-inset-top,0px));transform:translateX(-50%);z-index:85;display:flex;flex-direction:column;align-items:center;gap:1px;
  padding:8px 18px;border-radius:999px;background:var(--panel);border:1px solid var(--amber);box-shadow:0 8px 24px #0009;pointer-events:none;animation:achIn 3.4s ease forwards;max-width:calc(100% - 32px)}
.achtoast small{font-size:10.5px;letter-spacing:.15em;color:var(--amber)} .achtoast b{font-size:14px;color:var(--chalk);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
@keyframes achIn{0%{opacity:0;transform:translate(-50%,-14px)}10%,85%{opacity:1;transform:translate(-50%,0)}100%{opacity:0;transform:translate(-50%,-8px)}}
/* v0.49 防誤觸 */
#act::before{content:'';position:absolute;left:0;top:-2px;height:2px;width:0;background:var(--amber)}
#act{position:sticky} #act.tall{position:relative;bottom:auto} #act.locked::before{animation:actLk .35s linear forwards} #act.locked .btn{opacity:.6}
@keyframes actLk{from{width:0}to{width:100%}}
.btn.arm{position:relative} .btn .armtx{position:absolute;inset:-1px;display:grid;place-items:center;background:var(--bad);color:#fff;border-radius:inherit;font-weight:800;font-size:15px;letter-spacing:.05em}
#btn-restart.arm{border-color:var(--bad);color:var(--bad);font-size:11px}
/* v0.48 加點預覽、成本倍率、招牌技;v0.51.1 名稱與標籤分兩行,數值不折行 */
.abrow .nm{width:104px;display:flex;flex-direction:column;gap:2px;line-height:1.2} .abrow .nmn{font-size:14px}
.abrow .nmt{display:flex;flex-wrap:wrap;gap:2px 5px;font-weight:400} .abrow .nmt:empty{display:none} .abrow .nmt>*{margin-left:0}
.abrow .val{width:96px} .abrow .cst{white-space:nowrap}
@media (max-width:480px){ .abrow .nm{width:64px} .abrow .val{width:80px} .abrow .nmn{font-size:13px} }
.alprev{margin-bottom:6px;line-height:1.6} .alprev small{display:block;color:var(--dim)}
.akm{margin-left:4px;font-size:10.5px;font-weight:700} .akm.up{color:var(--blue)} .akm.dn{color:var(--bad)}
.sigt{margin-left:4px;font-size:10.5px;color:var(--dim);border:1px dashed var(--edge);border-radius:4px;padding:0 4px} .sigt.on{color:var(--amber);border:1px solid var(--amber)}
/* v0.63 首頁右上角的語言／貨幣快速切換(跟設定裡的選單同步) */
.qsw{display:flex;justify-content:flex-end;flex-wrap:wrap;gap:8px;margin:0 0 12px}
.qs{display:inline-flex;align-items:center;border:1px solid var(--edge);border-radius:999px;background:var(--panel);overflow:hidden}
.qs i{font-style:normal;font-size:13px;padding:0 2px 0 11px;opacity:.8}
.qs button{font:700 13px/1 var(--num);letter-spacing:.04em;padding:8px 13px;border:0;background:none;color:var(--dim);cursor:pointer}
.qs button:hover{color:var(--chalk)} .qs button.on{background:var(--amber);color:var(--on-amber,#14110a)}
#prefs .cur-row{display:flex;align-items:center;gap:10px;margin-top:14px;flex-wrap:wrap} #prefs .cur-row select{font:inherit;padding:5px 8px;border-radius:8px;border:1px solid var(--edge);background:var(--panel2);color:var(--chalk)}
/* v0.63 英文版:英文字比較長,縮字距、允許換行 */
html[lang="en"] #start h1 em{letter-spacing:.06em;font-size:clamp(18px,3.4vw,24px)}
html[lang="en"] .seg.pos{flex-wrap:wrap} html[lang="en"] .seg.pos button{min-width:0;flex:1 1 22%} html[lang="en"] .seg.pos button small{font-size:9px}
html[lang="en"] .seg button{min-width:0} html[lang="en"] .seg:not(.pos) button{font-size:12px;letter-spacing:0}
html[lang="en"] #start .wrap,html[lang="en"] #app{overflow-x:clip} /* 用 clip 不用 hidden:hidden 會讓看板的 sticky 失效 */
html[lang="en"] .trow{display:block}
/* 英文名字長:手機上位置排 2×2、國家改 3 欄 */
@media (max-width:480px){ html[lang="en"] #start .seg.pos{grid-template-columns:repeat(2,1fr)} html[lang="en"] #seg-nat .seg{grid-template-columns:repeat(3,1fr)} html[lang="en"] #seg-nat .seg button{font-size:12.5px} }
/* v0.62 贊助連結(Ko-fi):首頁左下角、生涯結算畫面;只是外部連結,不影響遊戲 */
.kofi-a{display:inline-flex;align-items:center;gap:6px;font:600 13px var(--sans);color:var(--chalk);text-decoration:none;padding:7px 13px;border-radius:999px;border:1px solid color-mix(in srgb,var(--amber) 55%,var(--edge));background:color-mix(in srgb,var(--amber) 12%,var(--panel))}
.kofi-a:hover{background:color-mix(in srgb,var(--amber) 22%,var(--panel))} .kofi-a:focus-visible{outline:2px solid var(--amber);outline-offset:2px}
.legal{font-size:11px;line-height:1.55;color:var(--dim);text-align:center;max-width:560px;margin:14px auto 0;opacity:.85} /* v0.78.6 非官方聲明 */
#kofi-home{position:fixed;left:calc(10px + env(safe-area-inset-left,0px));bottom:calc(10px + env(safe-area-inset-bottom,0px));z-index:50;font-size:12px;padding:6px 11px;opacity:.9}
.hp-wrap{display:grid;max-width:500px} .hp-wrap>*{grid-area:1/1} .hp-wrap .hero-pitch{max-width:100%}
.kofi-row{display:none;justify-content:flex-end;margin-top:10px} .kofi-pitch{font-size:12px;padding:6px 12px}
@media (min-width:601px){ #kofi-home{display:none} .kofi-row{display:flex} }
#act .kofi-end{grid-column:1/-1;justify-content:center;margin-top:10px;width:100%}
/* v0.61 金球獎頒獎典禮 */
.bdo{margin:2px -2px 0} .bdo .bdo-hd{text-align:center;padding:4px 0 6px} .bdo .bdo-hd small{display:block;font:600 10.5px var(--sans);letter-spacing:.3em;color:var(--amber)}
.bdo .bdo-hd b{display:block;font:700 22px/1.2 var(--num);letter-spacing:.05em;color:var(--chalk)} .bdo .bdo-hd span{font-size:11px;color:var(--dim)}
.bdo .bdo-rk{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:5px}
.bdo .bdo-rk li{display:grid;grid-template-columns:22px minmax(0,1fr) 50px;gap:8px;align-items:center;padding:6px 8px;margin:0;border-radius:10px;background:color-mix(in srgb,var(--chalk) 5%,transparent);animation:bdoIn .5s ease both}
@keyframes bdoIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.bdo .bdo-rk li{animation:none}}
.bdo .p{font:700 16px var(--num);color:var(--dim);text-align:center} .bdo .w{min-width:0}
.bdo .nm{font-weight:700;font-size:13.5px;display:flex;gap:6px;align-items:baseline;flex-wrap:wrap;color:var(--chalk)} .bdo .nm i{font-style:normal;font-size:10.5px;font-weight:500;color:var(--dim)} .bdo .nm i.rvt{color:var(--bad)}
.bdo .bar{height:5px;border-radius:3px;background:color-mix(in srgb,var(--chalk) 8%,transparent);margin-top:4px;overflow:hidden} .bdo .bar span{display:block;height:100%;background:var(--dim);border-radius:3px}
.bdo .v{font:600 15px var(--num);text-align:right;font-variant-numeric:tabular-nums;color:var(--chalk)} .bdo .v small{display:block;font:400 9.5px var(--sans);color:var(--dim)}
.bdo .chips{display:flex;flex-wrap:wrap;gap:4px;margin-top:4px} .bdo .chips em{font-style:normal;font-size:10.5px;padding:0 6px;border-radius:5px;background:color-mix(in srgb,var(--chalk) 7%,transparent);color:var(--dim)}
.bdo li.me{box-shadow:inset 0 0 0 1px var(--blue)} .bdo li.me .bar span{background:var(--blue)} .bdo li.me .p{color:var(--blue)}
.bdo li.rv{box-shadow:inset 0 0 0 1px var(--bad)} .bdo li.rv .bar span{background:var(--bad)} .bdo li.rv .p{color:var(--bad)}
.bdo li.win{background:color-mix(in srgb,var(--amber) 16%,transparent)} .bdo li.win .p{color:var(--amber)} .bdo li.win:not(.me):not(.rv) .bar span{background:var(--amber)}
.bdo-duel .duel{display:grid;grid-template-columns:1fr auto 1fr;gap:8px;align-items:center;text-align:center} .bdo-duel .duel b{font:700 28px/1 var(--num)}
.bdo-duel .duel .me b{color:var(--blue)} .bdo-duel .duel .rv b{color:var(--bad)} .bdo-duel .duel small{display:block;font-size:11px;color:var(--dim)} .bdo-duel .vs{font:600 12px var(--num);color:var(--dim)}
.bdo-duel .yrs{display:flex;gap:3px;justify-content:center;flex-wrap:wrap;margin-top:8px} .bdo-duel .yrs span{font:600 10px var(--num);padding:1px 5px;border-radius:4px}
.bdo-duel .yrs span.m{background:color-mix(in srgb,var(--blue) 25%,transparent);color:var(--chalk)} .bdo-duel .yrs span.r{background:color-mix(in srgb,var(--bad) 25%,transparent);color:var(--chalk)}
.bdo-duel .rel{margin-top:8px;font-size:12.5px;color:var(--dim)} .bdo-duel .rel b{color:var(--chalk)}
/* v0.60.4 捲軸:深色軌道＋金色圓角滑塊(跟著主題色);Firefox 用 scrollbar-color */
::-webkit-scrollbar{width:10px;height:10px} ::-webkit-scrollbar-track{background:var(--bg)} ::-webkit-scrollbar-corner{background:var(--bg)}
::-webkit-scrollbar-thumb{background:linear-gradient(180deg,var(--amber),color-mix(in srgb,var(--amber) 55%,var(--bg)));border-radius:8px;border:2px solid var(--bg)}
::-webkit-scrollbar-thumb:hover{background:var(--amber)}
#board::-webkit-scrollbar,#bd-ab::-webkit-scrollbar{width:6px} #board::-webkit-scrollbar-thumb,#bd-ab::-webkit-scrollbar-thumb{border-width:1px}
@supports not selector(::-webkit-scrollbar){ html,#board,#bd-ab{scrollbar-color:var(--amber) var(--bg);scrollbar-width:thin} }
/* v0.60 加點介面:訓練場(點數格、球員卡、雷達圖、三個訓練站) */
#act .alhd{display:flex;justify-content:space-between;align-items:baseline;gap:8px} #act .alhd small{color:var(--dim);font-size:12px;white-space:nowrap} #act .alhd small b{color:var(--amber);font-size:14px}
#act .alpts{display:flex;gap:3px;flex-wrap:wrap;margin:4px 0 8px} #act .alpts i{width:14px;height:14px;border-radius:4px;background:var(--amber);box-shadow:inset 0 0 0 1px #0004;transition:opacity .2s}
#act .alpts.many i{width:9px;height:9px;border-radius:3px} #act .alpts i.used{background:var(--panel2);opacity:.6}
#act .altop{display:grid;grid-template-columns:124px 172px minmax(0,1fr);gap:12px;align-items:center}
#act .alinfo{min-width:0;display:flex;flex-direction:column;gap:4px} #act .alinfo .alalt,#act .alinfo .alspn{margin:0}
#act #al-top{container-type:inline-size}
@container (max-width:540px){ #act .altop{grid-template-columns:124px minmax(0,1fr)} #act .alinfo{grid-column:1/-1} }
#act .alpc{position:relative;margin:0;border-radius:14px;padding:8px 6px 6px;background:linear-gradient(160deg,color-mix(in srgb,var(--amber) 22%,var(--panel)),var(--panel) 70%);border:1px solid color-mix(in srgb,var(--amber) 35%,transparent);text-align:center;overflow:hidden;line-height:1.3}
#act .alpc .ov{position:absolute;left:8px;top:6px;font:700 30px/1 var(--num);color:var(--amber);text-align:left} #act .alpc .ov small{display:block;font:500 10px var(--sans);color:var(--dim);letter-spacing:.1em}
#act .alpc .upn{position:absolute;right:8px;top:8px;font:700 14px var(--num);color:var(--good);opacity:0;transition:opacity .3s} #act .alpc .upn.on{opacity:1}
#act .alpc .px{width:84px;margin-top:10px;filter:drop-shadow(0 6px 8px #0007)} #act .alpc .pn{font-size:12px;font-weight:700;color:var(--chalk)} #act .alpc .pp{font-size:10.5px;color:var(--dim)}
#act .alpc.flash{animation:alfl .6s ease} @keyframes alfl{40%{box-shadow:0 0 0 4px color-mix(in srgb,var(--amber) 55%,transparent)}}
#act .alrd{min-width:0} #act .alrd svg{display:block;width:100%;max-width:200px;max-height:156px;height:auto;margin:0 auto} #act .alrd text{font:15px var(--sans);fill:var(--dim)} #act .alrd text.k{fill:var(--amber);font-weight:700}
#act .alleg{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;font-size:10.5px;color:var(--dim)} #act .alleg i{display:inline-block;width:10px;height:3px;margin-right:4px;vertical-align:middle;border-radius:2px}
#act .alalt{font-size:11.5px;color:var(--dim);margin-top:4px} #act .alspn{font-size:11.5px;color:var(--blue);margin-top:2px}
#act .alst{display:flex;flex-direction:column;gap:8px;margin-top:8px}
#act .alst .st{border:1px solid var(--edge);border-radius:12px;background:var(--panel);overflow:hidden}
#act .alst .sth{display:flex;align-items:center;gap:8px;padding:7px 10px;background:var(--panel2)} #act .alst .sth b{font-size:13.5px;white-space:nowrap}
#act .alst .sth small{margin-left:auto;font-size:11.5px;color:var(--dim);text-align:right} #act .alst .sth small.good{color:var(--blue)} #act .alst .sth small.slow{color:var(--clay)}
#act .alst .abrow{display:grid;grid-template-columns:76px minmax(0,1fr) 54px auto;gap:8px;align-items:center;padding:7px 10px;margin:0;border:0;border-top:1px solid var(--edge);border-radius:0;background:none;opacity:1}
#act .alst .abrow .nm{width:auto;display:flex;flex-direction:column;gap:1px;font-weight:700;font-size:13px;line-height:1.25;color:var(--chalk)}
#act .alst .abrow .nm em{font-style:normal;font-size:10.5px;font-weight:500;color:var(--amber)} #act .alst .abrow .nm em.sp{color:var(--blue)} #act .alst .abrow .nm em.cap{color:var(--clay)}
#act .alst .abrow .nm .sigt{margin:0;align-self:flex-start;font-weight:500}
#act .alst .abrow .bar{position:relative;height:12px;flex:none;overflow:visible;border-radius:6px;background:var(--panel2);box-shadow:inset 0 0 0 1px var(--edge)}
#act .alst .bar .f{position:absolute;left:0;top:0;bottom:0;border-radius:6px;background:linear-gradient(90deg,color-mix(in srgb,var(--blue) 55%,#000),var(--blue))}
#act .alst .bar .ad{position:absolute;top:0;bottom:0;border-radius:0 6px 6px 0;background:var(--amber);transition:width .25s}
#act .alst .bar .pt{position:absolute;top:-3px;bottom:-3px;width:3px;margin-left:-1px;border-radius:2px;background:var(--chalk);opacity:.75}
#act .alst .prog{height:3px;margin-top:4px;border-radius:2px;background:var(--panel2);overflow:hidden} #act .alst .prog i{display:block;height:100%;background:var(--amber);transition:width .2s}
#act .alst .abrow .val{width:auto;text-align:right;font:600 14px/1.15 var(--mono)} #act .alst .abrow .val b{color:var(--amber);font-weight:700} #act .alst .abrow .val small{opacity:.55;font-size:11px}
#act .alst .abrow .cst{display:block;font:400 10px var(--sans);color:var(--dim);white-space:nowrap}
#act .alst .abrow .pm{gap:5px} #act .alst .abrow .pm button{width:34px;height:34px;border-radius:10px;display:inline-flex;align-items:center;justify-content:center;padding:0;font:700 22px/1 system-ui,-apple-system,'Segoe UI',Arial,sans-serif;touch-action:manipulation;user-select:none;-webkit-user-select:none}
#act .alst .abrow .pm em{width:22px;color:var(--amber)}
#act .alst .abrow.capped .bar,#act .alst .abrow.capped .nm{opacity:.55}
#act #al-btm.albtm{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:4px} #act #al-btm.albtm .btn{text-align:center;white-space:nowrap;font-size:13.5px;padding-left:4px;padding-right:4px} #act #al-btm.albtm .btn.main{grid-column:1/-1}
@media (max-width:400px){ #act .altop{grid-template-columns:112px minmax(0,1fr)} #act .alpc .px{width:78px} #act .alrd svg{max-height:140px} #act .alst .abrow{grid-template-columns:62px minmax(0,1fr) 50px auto;gap:5px;padding:6px 7px} #act .alst .abrow .pm button{width:30px;height:32px} #act .alst .abrow .pm em{width:18px} }
.sigk{color:var(--amber);margin-left:2px;font-size:10px}
/* v0.43 排行榜、每日挑戰 */
.lb-gap{text-align:center;color:var(--dim);letter-spacing:.3em;line-height:1}
.lb-you{display:inline-block;margin-left:6px;padding:0 6px;border-radius:999px;font-size:11px;font-weight:700;background:var(--amber);color:#1a1405}
.lr-bt{display:flex;gap:6px;align-items:center}
.lr-ub{background:none;border:1px solid var(--amber);color:var(--amber);border-radius:6px;padding:1px 8px;font-size:11.5px;cursor:pointer} .lr-ub:disabled{border-color:var(--edge);color:var(--dim);cursor:default}
.lr-up{grid-column:1/-1;cursor:default;border-top:1px dashed var(--edge);margin-top:6px;padding-top:4px}
#lb-tabs{display:flex;gap:6px;margin:6px 0 8px}
.lb-tab{flex:1;padding:8px 4px;border-radius:10px;border:1px solid var(--edge);background:var(--panel2);color:var(--dim);font:600 13.5px var(--sans);cursor:pointer}
.lb-tab.on{color:var(--amber);border-color:var(--amber)}
#lb-filt{display:flex;gap:6px;margin-bottom:4px}
#lb-filt select{flex:1;min-width:0;background:var(--panel2);color:var(--chalk);border:1px solid var(--edge);border-radius:8px;padding:6px;font:14px var(--sans)}
#lb-filt .hint{margin:0}
.lb-list{display:flex;flex-direction:column;gap:6px;margin-top:6px}
.lb-r{display:grid;grid-template-columns:2.2em auto minmax(0,1fr) auto;gap:2px 10px;align-items:center;padding:9px 10px;border:1px solid var(--edge);border-radius:10px;background:var(--panel2)}
.lb-r.me{border-color:var(--amber);box-shadow:0 0 0 1px color-mix(in srgb,var(--amber) 35%,transparent)}
.lb-k{font:700 15px var(--mono,monospace);color:var(--dim);text-align:center} .lb-r.top .lb-k{color:var(--amber)}
.lb-r .flag{width:22px;height:15px;border-radius:2px}
.lb-n{min-width:0} .lb-n b{font-size:14.5px;overflow-wrap:anywhere} .lb-m{font-size:12px;color:var(--dim);overflow-wrap:anywhere}
.lb-k .dci{width:26px;height:20px;vertical-align:middle}
/* v0.74 每日挑戰前三名:像素皇冠、次數徽章、昨天的頒獎台 */
.dci{display:inline-block;width:1.3em;height:1em;vertical-align:-.12em;flex:none;image-rendering:pixelated;filter:drop-shadow(0 0 .6px #000a) drop-shadow(0 0 .6px #000a)}
.dcb{display:inline-flex;align-items:center;gap:6px;margin-left:6px;padding:0 6px;border-radius:999px;line-height:18px;vertical-align:1px;white-space:nowrap;background:var(--sub);border:1px solid var(--edge);font:700 11px var(--num,var(--mono,monospace))}
.dcb i{display:inline-flex;align-items:center;gap:1px;font-style:normal} .dcb i{color:var(--chalk)}
.dcb.glow{border-color:#f2c14e;box-shadow:0 0 8px #f2c14e55}
.lb-pod{margin:8px 0 4px} .lb-pod>p{font-size:12px;color:var(--dim);margin:0 0 6px}
.lb-pod .pods{display:grid;grid-template-columns:1fr 1.15fr 1fr;gap:6px;align-items:end}
.lb-pod .pd{text-align:center;padding:8px 4px 10px;border-radius:12px;border:1px solid var(--edge);background:var(--panel);min-width:0}
.lb-pod .pd .dci{width:34px;height:26px} .lb-pod .pd b{display:block;font-size:13.5px;margin-top:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .lb-pod .pd small{display:block;font-size:11px;color:var(--dim)}
.lb-pod .pd.p1{padding-top:14px;border-color:#f2c14e;background:color-mix(in srgb,#f2c14e 8%,var(--panel))} .lb-pod .pd.p2{border-color:#aab4c288} .lb-pod .pd.p3{border-color:#d08a5288}
.lb-pod .pd .flag{width:18px;height:12px;border-radius:2px;vertical-align:-1px;margin-right:3px}
.lb-p{text-align:right} .lb-p b{display:block;font:700 14px var(--mono,monospace);color:var(--chalk);white-space:nowrap} .lb-p small{font-size:10.5px;color:var(--dim)}
.lb-more{margin-top:10px}
/* v0.51 排行榜:評價色條、展開詳細、自己的名次、每人最佳切換 */
.lb-r{border-left-width:4px;cursor:pointer} .lb-r:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
.lb-r.t-傳奇{border-left-color:var(--amber)} .lb-r.t-巨星{border-left-color:color-mix(in srgb,var(--amber) 55%,var(--edge))} .lb-r.t-主力{border-left-color:var(--blue)}
.lb-r.t-浮沉{border-left-color:var(--dim)} .lb-r.t-過客{border-left-color:var(--edge)}
.lb-m{white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .lb-r.open .lb-m{white-space:normal}
.lb-d{display:none;grid-column:1/-1;margin-top:6px;padding-top:6px;border-top:1px dashed var(--edge)} .lb-r.open .lb-d{display:block}
.lb-hon{display:flex;flex-wrap:wrap;gap:4px 8px;font-size:12.5px} .lb-hon span{white-space:nowrap}
.lb-st{font-size:12px;color:var(--dim);margin-top:4px} .lb-p small.old,.lb-st.old{color:var(--dim);opacity:.75}
.lb-me{display:flex;align-items:center;gap:6px;width:100%;margin-top:6px;padding:9px 12px;border:1px solid var(--amber);border-radius:10px;background:color-mix(in srgb,var(--amber) 10%,var(--panel2));color:var(--chalk);font:14px var(--sans);text-align:left;cursor:pointer}
.lb-me b{color:var(--amber);font-size:16px} .lb-me span{margin-left:auto;font-size:12px;color:var(--amber);white-space:nowrap}
.lb-me.none{border-style:dashed;border-color:var(--edge);background:none;color:var(--dim);cursor:default;font-size:13px}
.lb-r.flash{animation:lbFlash 1.4s ease}
@keyframes lbFlash{0%,40%{box-shadow:0 0 0 3px var(--amber)}100%{box-shadow:0 0 0 1px color-mix(in srgb,var(--amber) 35%,transparent)}}
.lb-seg{display:flex;border:1px solid var(--edge);border-radius:8px;overflow:hidden;flex:none}
.lb-seg button{background:none;border:0;color:var(--dim);padding:6px 9px;font:13px var(--sans);cursor:pointer;white-space:nowrap}
.lb-seg button.on{background:var(--amber);color:var(--on-amber,#1a1405);font-weight:700}
#lb-filt{flex-wrap:wrap}
/* v0.54 紀錄榜 */
.rc-cats{display:flex;flex-direction:column;gap:6px;width:100%} .rc-g small{display:block;font-size:11px;color:var(--dim);letter-spacing:.08em;margin-bottom:3px}
.rc-chips{display:flex;flex-wrap:wrap;gap:5px}
.rc-chip{border:1px solid var(--edge);background:var(--panel2);color:var(--chalk);border-radius:999px;padding:4px 10px;font:12.5px var(--sans);cursor:pointer}
.rc-chip.on{background:var(--blue);border-color:var(--blue);color:#fff;font-weight:700} .rc-chip:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
.rc-desc{width:100%;margin-top:2px}
.rc-r{display:grid;grid-template-columns:auto auto 1fr auto;align-items:center;gap:8px;padding:7px 10px;border:1px solid var(--edge);border-left-width:4px;border-radius:9px;background:var(--panel2)}
.rc-r.me{border-color:var(--amber)} .rc-r.t-傳奇{border-left-color:var(--amber)} .rc-r.t-巨星{border-left-color:color-mix(in srgb,var(--amber) 55%,var(--edge))} .rc-r.t-主力{border-left-color:var(--blue)}
.rc-r .flag{width:20px;height:13px} .rc-n{min-width:0} .rc-n b{font-size:14px}
.rc-v{font-weight:700;font-variant-numeric:tabular-nums;white-space:nowrap;text-align:right}
.rc-me{cursor:default} .rc-r.top .lb-k{color:var(--amber)}
/* v0.55 國家名人堂 */
.nm-mine{display:flex;flex-wrap:wrap;gap:4px 12px;font-size:12px;color:var(--dim);margin-top:8px} .nm-mine b{color:var(--chalk);font-variant-numeric:tabular-nums}
.nm-mine .nm-dot{position:static;display:inline-block;margin-right:4px;vertical-align:1px}
.nm-g{margin-top:12px} .nm-cf{font-size:12px;color:var(--dim);letter-spacing:.08em;margin-bottom:6px}
.nm-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(128px,1fr));gap:7px}
.nm-c{position:relative;border:1px solid var(--edge);border-left-width:4px;background:var(--panel2);border-radius:10px;padding:7px 9px;text-align:left;color:var(--chalk);font:13px var(--sans);display:flex;flex-direction:column;gap:2px;cursor:pointer;min-width:0}
.nm-c:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
.nm-c.t-傳奇{border-left-color:var(--amber)} .nm-c.t-巨星{border-left-color:color-mix(in srgb,var(--amber) 55%,var(--edge))} .nm-c.t-主力{border-left-color:var(--blue)} .nm-c.t-浮沉{border-left-color:var(--dim)}
.nm-t{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--dim);white-space:nowrap;min-width:0;padding-right:14px} .nm-t svg{width:22px;height:15px;flex:none}
.nm-w{font-size:14.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nm-s{display:flex;justify-content:space-between;gap:6px;font-size:11.5px;color:var(--dim);min-width:0} .nm-s span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.nm-s b{color:var(--chalk);font-variant-numeric:tabular-nums;white-space:nowrap}
.nm-dot{position:absolute;top:7px;right:7px;width:8px;height:8px;border-radius:50%;background:var(--blue)}
.nm-cr{position:absolute;top:4px;right:6px;font-size:13px}
.nm-c.crown{border-color:var(--amber);background:color-mix(in srgb,var(--amber) 12%,var(--panel2))}
.nm-c.open{border:1px dashed var(--amber);background:none} .nm-c.open .nm-w{color:var(--amber);font-size:13.5px}
.nm-c.sel{box-shadow:0 0 0 2px var(--blue)}
.nm-d{margin-top:12px;border:1px solid var(--edge);border-radius:12px;padding:12px;background:var(--panel2);display:flex;flex-direction:column;gap:8px;font-size:13px}
.nm-d h4{display:flex;align-items:center;gap:8px;font-size:16px;margin:0} .nm-d h4 svg{width:24px;height:16px} .nm-d h4 small{margin-left:auto;font-size:11.5px;color:var(--dim);font-weight:400}
.nm-pod{display:flex;flex-direction:column;gap:6px}
.nm-p{display:grid;grid-template-columns:28px 1fr auto;gap:8px;align-items:center;padding:8px 10px;border-radius:9px;background:var(--panel);border:1px solid var(--edge)} .nm-p.g1{border-color:var(--amber)}
.nm-m{font-size:18px;text-align:center} .nm-pn{min-width:0} .nm-pn b{font-size:14px} .nm-pn small{display:block;font-size:11.5px;color:var(--dim)} .nm-pn .nm-h{color:var(--chalk);font-size:12px}
.nm-pc{font-size:15px;font-variant-numeric:tabular-nums}
.nm-you{display:flex;justify-content:space-between;gap:8px;border-top:1px dashed var(--edge);padding-top:8px;font-size:12.5px} .nm-you b{color:var(--blue)} .nm-you.cr b{color:var(--amber)}
.nm-e{line-height:1.7} .nm-d .btn{width:100%}
.card.lbup .lb-sum{font-size:14px;display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.card.lbup .lb-sum .flag{width:22px;height:15px;border-radius:2px}
.lb-lab{display:block;font-size:12.5px;color:var(--dim);margin-top:10px}
.lb-row{display:flex;gap:8px;margin-top:4px}
.lb-row input{flex:1;min-width:0;background:var(--panel2);color:var(--chalk);border:1px solid var(--edge);border-radius:10px;padding:10px 12px;font:15px var(--sans)}
.lb-row .btn{width:auto;flex:none;padding:10px 18px}
.lb-msg{margin-top:8px} .lb-rk{display:block;margin-top:2px;font-size:15px} .lb-rk b{font-size:18px} .lb-msg.ok{color:var(--amber)} .lb-msg.err{color:var(--bad)}
.dl-id{font-size:18px;font-weight:700;margin:10px 0;display:flex;align-items:center;gap:8px} .dl-id .flag{width:28px;height:19px;border-radius:2px}
#daily-body p{font-size:14px;line-height:1.7;margin:6px 0} #daily-body .btn{margin-top:8px}
/* v0.42 結算改版 */
.card.fwm{padding:0;overflow:hidden}
.fw-hd{display:flex;align-items:center;gap:10px;padding:12px 16px;background:var(--panel2);border-bottom:1px solid var(--edge)}
.fw-clk{font:700 24px var(--mono,monospace);color:var(--amber);min-width:3.3em;font-variant-numeric:tabular-nums}
.fw-sb{flex:1;min-width:0;font-weight:700;font-size:14px} .fw-sb small{display:block;font-weight:400;font-size:11.5px;color:var(--dim)}
.fw-sc{font:700 22px var(--mono,monospace);font-variant-numeric:tabular-nums}
.fw-st{display:flex;justify-content:space-between;align-items:flex-end;height:30px;padding:0 12px 6px;background:linear-gradient(transparent,var(--panel2))}
.fw-st i{width:5px;height:5px;border-radius:50%;background:var(--dim);opacity:.35;transform:translateY(0);transition:opacity .6s}
.fw-st i:nth-child(4n+1){background:var(--amber)} .fw-st i:nth-child(3n+2){background:var(--blue)}
.fw-st[data-l="1"] i{opacity:.5;animation:fwb 1.6s ease-in-out infinite;animation-delay:calc(var(--i)*-97ms)}
.fw-st[data-l="2"] i,.fw-st[data-l="3"] i{opacity:.8;animation:fwb .9s ease-in-out infinite;animation-delay:calc(var(--i)*-61ms)}
.fw-st[data-l="4"] i{opacity:1;animation:fww 1.8s ease-in-out infinite;animation-delay:calc(var(--i)*45ms)}
@keyframes fwb{50%{transform:translateY(-4px)}} @keyframes fww{0%,60%,100%{transform:translateY(0)}20%{transform:translateY(-16px)}}
.fw-feed{padding:10px 16px 14px;display:flex;flex-direction:column;gap:7px}
.fw-ev{display:grid;grid-template-columns:3.4em 1fr;gap:8px;font-size:14px;animation:fwin .35s ease both} .fw-ev>b{font:700 13px var(--mono,monospace);color:var(--dim)}
.fw-ev.big span{color:var(--chalk);font-weight:700}
.fw-blk{background:var(--panel);border:1px solid var(--edge);border-radius:10px;padding:10px 12px;font-size:14.5px;line-height:1.75;animation:fwin .5s ease both}
.fw-board{display:flex;justify-content:center;gap:18px;font:700 26px var(--mono,monospace);padding:6px 14px;border-radius:8px;background:#000;border:2px solid #333;width:fit-content;margin:2px auto 8px}
.fw-board .up{color:#ff5a5a} .fw-board .dn{color:#ffcf4a}
@keyframes fwin{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.card.bridge{background:none;border:none;box-shadow:none;margin-left:24px;padding:6px 4px;text-align:center;font-size:15px;line-height:1.8;color:var(--dim);font-style:italic;animation:fwin .9s ease both}
.card.chap{animation:fwin .6s ease both} .card.chap>*{animation:fwin .5s ease both}
.card.chap>:nth-child(2){animation-delay:.25s} .card.chap>:nth-child(3){animation-delay:.5s} .card.chap>:nth-child(4){animation-delay:.75s} .card.chap>:nth-child(n+5){animation-delay:1s}
.card.vo.wait{display:none}
.vo-r{display:grid;grid-template-columns:40px 1fr;gap:12px;align-items:start}
.vo-av{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;font-weight:900;font-size:17px;color:#0c0f1d;background:hsl(var(--h) 55% 70%)}
.vo-who{font-size:12.5px;color:var(--dim)} .vo-who b{color:var(--chalk);font-size:14px;margin-right:6px}
.vo-say{font-size:15.5px;line-height:1.85;margin-top:2px;min-height:1.8em}
.vo-say:not(.fin)::after{content:'▍';color:var(--amber);animation:vob 1s steps(1) infinite} @keyframes vob{50%{opacity:0}}
.card.evrv{text-align:center;padding:18px 16px}
.rv-l{font-size:12px;letter-spacing:.2em;color:var(--dim)} .rv-n{font:700 56px/1.1 var(--mono,monospace);font-variant-numeric:tabular-nums}
.rv-lad{display:flex;flex-direction:column;gap:6px;margin:14px auto 4px;max-width:320px}
.rv-r{display:grid;grid-template-columns:3.6em 1fr 4.2em;align-items:center;gap:10px;padding:6px 12px;border-radius:10px;border:1px solid var(--edge);color:var(--dim);transition:.3s;text-align:left}
.rv-r b{font-size:16px} .rv-r i{height:6px;border-radius:3px;background:var(--panel2);overflow:hidden} .rv-r em{display:block;height:100%;width:0;background:var(--amber)}
.rv-r span{font:500 12px var(--mono,monospace);text-align:right}
.rv-r.lit{color:var(--chalk);border-color:color-mix(in srgb,var(--amber) 40%,transparent)}
.rv-r.me{color:var(--amber);border-color:var(--amber);background:color-mix(in srgb,var(--amber) 14%,transparent);box-shadow:0 0 18px color-mix(in srgb,var(--amber) 25%,transparent)}
.rv-stamp{display:inline-block;margin-top:12px;font-size:40px;font-weight:900;line-height:1;color:var(--amber);border:4px double var(--amber);padding:8px 20px;border-radius:12px;transform:rotate(-6deg);animation:rvs .5s cubic-bezier(.2,1.6,.4,1) both}
@keyframes rvs{from{opacity:0;transform:rotate(-6deg) scale(2.4)}to{opacity:1;transform:rotate(-6deg) scale(1)}}
.rv-gap{margin:14px auto 0;max-width:300px;font-size:14px;animation:fwin .6s .3s ease both}
.lg-shirt{width:110px;display:block;margin:4px auto 8px}
.card.legend{text-align:center}
.card.epi{background:#06070d;border-color:#ffffff12;padding:20px 18px 24px} .card.epi h4{text-align:center;letter-spacing:.5em}
.epi-b p{font-size:15.5px;line-height:2;color:var(--chalk,#d7dbea);margin:0 0 12px;animation:fwin 1.1s ease both}
.epi-end{text-align:center;font-size:13px;letter-spacing:.6em;color:var(--dim,#8b93b0);margin-top:20px;animation:fwin 1.2s ease both}
html.calm .fw-st i,html.calm .card.chap,html.calm .card.chap>*,html.calm .card.bridge,html.calm .epi-b p,html.calm .epi-end,html.calm .rv-stamp,html.calm .rv-gap,html.calm .fw-ev,html.calm .fw-blk{animation:none}
/* v0.41 球迷留言 */
.card.fan{padding-bottom:8px}
.fan-sub{font-size:12px;color:var(--dim);margin:-2px 0 8px}
.fc{display:grid;grid-template-columns:30px 1fr;gap:9px;padding:8px 0;border-top:1px solid var(--edge)}
.fc .fa{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;font:700 13px var(--sans);color:#0c0f1d;background:hsl(var(--h) 60% 68%)}
.fc .fu{font-size:12.5px;font-weight:700;color:var(--chalk)} .fc .fu small{font-weight:400;color:var(--dim);margin-left:6px}
.fc .ft{font-size:14px;line-height:1.6;margin-top:1px;word-break:break-word}
.fc .fl{font-size:11.5px;color:var(--dim);margin-top:2px} .fc .fl b{color:var(--amber);font-weight:500}
.fc.neg .fl b{color:var(--dim)}
.fc .fr{grid-column:2;display:grid;grid-template-columns:24px 1fr;gap:8px;margin-top:6px;padding-left:2px}
.fc .fr .fa{width:24px;height:24px;font-size:11px}
.fc .fa.off{background:var(--amber);color:var(--on-amber,#1a1405)}
.fc .fu small.ofb{color:var(--amber);border:1px solid currentColor;border-radius:4px;padding:0 4px;font-size:10.5px}
.fc .fu small.hotb{color:var(--clay,#ff8a4c);font-weight:700}

/* v0.40.2 首頁:過往人生、成就收藏改成開始鈕下方的大按鈕 */
.home-links{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px} #start-pwa[hidden]+#start-bk{grid-column:1/-1}
.home-links button{padding:13px 8px;font:700 15px var(--sans);color:var(--amber);background:linear-gradient(180deg,#1f2747,#181f3b);border:1px solid #ffcf4a55;border-radius:12px;cursor:pointer;transition:.15s}
.home-links #start-pwa{grid-column:1/-1}
/* v0.55 加到主畫面的教學:手機從下方滑出 */
#pwap{position:fixed;inset:0;z-index:95;display:none;align-items:flex-end;justify-content:center;background:#0009}
#pwap.open{display:flex}
#pwap .box{width:min(520px,100%);max-height:85vh;overflow-y:auto;background:var(--panel);color:var(--chalk);border:1px solid var(--edge);border-bottom:0;border-radius:16px 16px 0 0;
  padding:16px max(16px,env(safe-area-inset-left,0px)) calc(14px + env(safe-area-inset-bottom,0px)) max(16px,env(safe-area-inset-right,0px));animation:pwaUp .25s ease}
@keyframes pwaUp{from{transform:translateY(30px);opacity:0}to{transform:none;opacity:1}}
@media (prefers-reduced-motion:reduce){#pwap .box{animation:none}}
#pwap h3{font-size:16px;margin-bottom:6px;display:flex;justify-content:space-between;align-items:center;gap:8px}
#pwap h3 button{background:none;border:1px solid var(--edge);color:var(--dim);border-radius:6px;padding:0 8px;cursor:pointer;font-size:14px}
.pwa-why{font-size:12.5px;color:var(--dim);line-height:1.6;margin-bottom:10px}
.pwa-who{display:inline-block;font-size:11.5px;color:var(--amber);border:1px solid var(--amber);border-radius:999px;padding:1px 9px;margin-bottom:8px}
.pwa-steps{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px;counter-reset:st}
.pwa-steps li{counter-increment:st;display:grid;grid-template-columns:26px 1fr;gap:10px;align-items:center;background:var(--panel2);border:1px solid var(--edge);border-radius:10px;padding:9px 11px;font-size:14px;line-height:1.55}
.pwa-steps li::before{content:counter(st);width:24px;height:24px;border-radius:50%;background:var(--amber);color:#1a1405;font:700 13px var(--sans);display:flex;align-items:center;justify-content:center}
.pwa-steps b{color:var(--amber)}
.pwa-ic{display:inline-flex;vertical-align:-4px;width:20px;height:20px;border:1px solid var(--edge);border-radius:5px;align-items:center;justify-content:center;background:var(--panel);color:var(--chalk);font-size:13px;line-height:1;margin:0 2px}
.pwa-ic svg{width:14px;height:14px}
.pwa-go{display:block;width:100%;margin:4px 0 10px;padding:12px;border:0;border-radius:12px;background:var(--amber);color:#1a1405;font:700 15px var(--sans);cursor:pointer}
.pwa-copy{margin-top:8px;font-size:12.5px;color:var(--dim);display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.pwa-copy button{background:none;border:1px solid var(--edge);color:var(--chalk);border-radius:8px;padding:4px 10px;font:13px var(--sans);cursor:pointer}
.pwa-hand{margin-top:10px;font-size:12px;color:var(--dim);text-align:center}
.pwa-act{display:flex;gap:8px;margin-top:12px} .pwa-act button{flex:1;background:none;border:1px solid var(--edge);color:var(--dim);border-radius:10px;padding:9px;font:13px var(--sans);cursor:pointer}
.home-links button:hover{border-color:var(--amber);box-shadow:0 0 0 1px #ffcf4a33}
html.th .home-links button{background:var(--btn);border-color:var(--amber);box-shadow:none}
/* ---------- 動畫調整(全主題) ---------- */
@keyframes flip{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.card.flip{animation:flip .35s ease}
.scene .mepl{animation:none}
.scr.cur{animation:scrin .28s ease}
@keyframes scrin{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
#log.review .scr{animation:none}
/* ================= v0.23 夜賽轉播 =================
   全主題共用:元件都只用 token,四套主題各自換色 */
html.th body{font-size:15.5px}
html.th.glow body{background-image:radial-gradient(ellipse 60% 35% at 12% -6%,color-mix(in srgb,var(--amber) 8%,transparent),transparent 60%),radial-gradient(ellipse 60% 35% at 88% -6%,color-mix(in srgb,var(--blue) 11%,transparent),transparent 60%)}
html.th.glow #start{background:radial-gradient(ellipse 60% 45% at 10% -10%,color-mix(in srgb,var(--amber) 12%,transparent),transparent 60%),radial-gradient(ellipse 60% 45% at 90% -10%,color-mix(in srgb,var(--blue) 15%,transparent),transparent 60%),var(--bg)}
#start h1 .en{font-family:var(--num);font-weight:800;letter-spacing:.02em}
.feat b{font-family:var(--num)}
/* 字級 */
.card p{font-size:15px} .btn small{font-size:12.5px} #act .title{font-size:13px}
.scr-head{font-size:12px}
.card h4{font-size:12.5px}
/* ---------- A. 記分條 ---------- */
#bd-num{width:44px;height:44px;border-radius:8px 0 0 8px;font:800 24px var(--num);clip-path:polygon(0 0,100% 0,82% 100%,0 100%);padding-right:6px;margin-right:6px;box-shadow:none}
#bd-name{font-size:18px}
#bd-num.kit{background:none!important;clip-path:none;padding:0;width:44px;height:44px;box-shadow:none;text-shadow:none} #bd-num.kit svg{width:100%;height:100%;filter:drop-shadow(0 2px 3px #0007)} /* v0.56 迷你球衣 */
#bd-bug{height:30px;line-height:30px;border-radius:6px;font-size:13px}
#bd-lg,html.th #bd-lg{background:var(--club,var(--pri));color:var(--club-tx,#fff);font-weight:700;padding:0 10px;text-shadow:0 1px 2px #0006}
#bd-clock,html.th #bd-clock{background:var(--amber);color:var(--on-amber);font:700 16px/30px var(--num);min-width:52px}
#bd-team,html.th #bd-team{background:var(--sub)}
.bd-cell b,html.th .bd-cell b{font:700 24px/1.15 var(--num);letter-spacing:.01em;text-shadow:none}
.bd-cell span{font-size:10.5px;letter-spacing:.12em}
.bd-cell.ovrc b{width:42px;height:42px;margin:0 auto 2px;border-radius:50%;display:grid;place-items:center;font-size:20px;
  background:radial-gradient(closest-side,var(--sub) 78%,transparent 80% 100%),conic-gradient(var(--amber) calc(var(--p,.5)*360deg),var(--edge) 0)}
#bd-grid .bd-cell{display:flex;flex-direction:column;align-items:center} #bd-grid .bd-cell:not(.ovrc) b{flex:1;display:flex;align-items:center;justify-content:center} /* v0.75.1 數字置中、標籤貼底,四格的字對齊(綜合的圓圈比較高) */
.mt{font-size:11.5px;letter-spacing:.04em}
.mt em{font:700 15px var(--num);top:-3px}
.mt i,html.th .mt i{height:9px;border:none;border-radius:2px;background:var(--sub);margin-top:4px;
  -webkit-mask:repeating-linear-gradient(90deg,#000 0 calc(10% - 2px),transparent calc(10% - 2px) 10%);mask:repeating-linear-gradient(90deg,#000 0 calc(10% - 2px),transparent calc(10% - 2px) 10%)}
.mt i b{border-radius:0}
html.th .mt i b{background:var(--blue)} html.th #mt-fans i b{background:var(--amber)} html.th #mt-form i b{background:var(--good)} html.th #mt-fatigue i b{background:var(--bad)}
.mfloat{font:700 15px var(--num);right:30px;top:-8px}
#bd-tick{margin-top:8px;border-top:1px solid var(--edge);padding-top:6px;overflow:hidden;white-space:nowrap;font-size:12px;color:var(--dim)}
#bd-tick span{display:inline-block;padding-left:100%;animation:tick 26s linear infinite}
#bd-tick em{font-style:normal;color:var(--amber);margin:0 6px}
@keyframes tick{to{transform:translateX(-100%)}}
/* 能力雷達 */
#bd-ab .radar{grid-column:1/-1;width:100%;max-width:220px;margin:2px auto 4px;display:block}
.radar .rg{fill:none;stroke:var(--edge);stroke-width:1}
.radar .rp{fill:none;stroke:var(--chalk);stroke-opacity:.4;stroke-dasharray:3 3}
.radar .rv{fill:color-mix(in srgb,var(--amber) 22%,transparent);stroke:var(--amber);stroke-width:2;stroke-linejoin:round}
.radar text{font:500 10px var(--sans);text-anchor:middle;dominant-baseline:middle;fill:var(--dim)}
.radar text.rk{fill:var(--amber);font-weight:700}
.abc{font-size:12px} .abc .av{font:600 14px var(--num)}
.abc .ab1{height:5px}
/* ---------- B. 關鍵時刻 ---------- */
svg.scene,html.th svg.scene{border:none;border-radius:10px;
  background:radial-gradient(ellipse 45% 35% at 15% 0%,var(--glow),transparent 70%),radial-gradient(ellipse 45% 35% at 85% 0%,var(--glow),transparent 70%),repeating-linear-gradient(90deg,var(--pitch1) 0 30px,var(--pitch2) 30px 60px)}
html.th .scene .mate{fill:var(--blue)} html.th .scene .opp{fill:var(--bad)} html.th .scene .ogk{fill:color-mix(in srgb,var(--bad) 55%,var(--chalk))}
.mhead{gap:0;align-items:stretch;border-radius:6px;overflow:hidden;width:max-content;max-width:100%;box-shadow:0 4px 14px #0005}
.mmin,html.th .mmin{border-radius:0;font:800 18px/28px var(--num);padding:0 10px;background:var(--amber);color:var(--on-amber)}
.msc{display:flex;align-items:stretch;font:600 13px/28px var(--sans);min-width:0}
.msc .tm{background:var(--sub);padding:0 10px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--chalk)}
.msc .sc{background:var(--chalk);color:var(--bg);font:700 17px/28px var(--num);padding:0 10px;min-width:58px;text-align:center;font-variant-numeric:tabular-nums}
.msc .sc.flip{animation:scflip .45s ease}
@keyframes scflip{50%{transform:rotateX(90deg)}}
.card.moment p{margin-top:10px!important}
/* 戰術卡 */
.btn.tac{display:grid;grid-template-columns:50px 1fr;gap:12px;align-items:center;position:relative;text-align:left;padding:11px 14px 11px 11px;
  background:var(--btn);border-color:var(--edge);color:var(--chalk);box-shadow:none;--r:var(--amber)}
html.th .btn.tac{background:var(--btn);color:var(--chalk);border-color:var(--edge)}
.btn.tac.r-bold{--r:var(--bad)} .btn.tac.r-safe{--r:var(--good)} .btn.tac.r-norm{--r:var(--amber)}
.btn.tac:hover,html.th .btn.tac:hover{transform:translateY(-2px);border-color:var(--r);box-shadow:0 8px 22px #0005;filter:none}
.btn.tac.main,html.th .btn.tac.main{background:var(--btn);color:var(--chalk);border-color:color-mix(in srgb,var(--r) 55%,var(--edge));box-shadow:none}
.btn.tac .ring{width:50px;height:50px;border-radius:50%;display:grid;place-items:center;
  background:radial-gradient(closest-side,var(--btn) 80%,transparent 82% 100%),conic-gradient(var(--r) calc(var(--p)*360deg),var(--edge) 0)}
.btn.tac .ring b{font:700 18px var(--num);color:var(--chalk)} .btn.tac .ring i{font-style:normal;font-size:11px;color:var(--dim)}
.btn.tac .tx{min-width:0;font-size:15px;padding-right:34px}
.btn.tac small,html.th .btn.tac small,html.th .btn.tac.main small{color:var(--dim);opacity:1}
.btn.tac .risk{position:absolute;top:9px;right:12px;font:700 11.5px var(--sans);letter-spacing:.1em;color:var(--r)}
/* 結果橫幅與照明閃光 */
.bigfx,html.th .bigfx{top:40%;font:800 clamp(44px,10vw,88px)/1 var(--num);letter-spacing:.06em;color:var(--on-amber);text-shadow:none;animation:none;transform:translate(-50%,-50%)}
.bigfx span{display:block;background:var(--amber);padding:6px 46px;transform:skewX(-10deg) scaleX(0);transform-origin:left;animation:bsweep 1.6s cubic-bezier(.2,.8,.2,1) forwards;box-shadow:0 10px 40px #0008}
.bigfx.cool span{background:var(--blue);color:var(--bg)}
.bigfx.bad span{background:var(--bad);color:var(--on-bad,#2a0905)}
@keyframes bsweep{0%{transform:skewX(-10deg) scaleX(0)}22%{transform:skewX(-10deg) scaleX(1)}80%{opacity:1;transform:skewX(-10deg) scaleX(1)}100%{opacity:0;transform:skewX(-10deg) scaleX(1) translateX(30px)}}
.floodfx{position:fixed;inset:0;z-index:78;pointer-events:none;background:radial-gradient(ellipse at 50% 30%,var(--amber),transparent 70%);opacity:0;animation:flood .7s ease-out}
@keyframes flood{0%{opacity:.28}100%{opacity:0}}
/* ---------- D. 季末 ---------- */
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:2px 0 8px}
.kpi{background:var(--sub);border:1px solid var(--edge);border-radius:10px;padding:6px 10px}
.kpi small{display:block;font-size:11.5px;color:var(--dim)}
.kpi b{font:700 26px/1.1 var(--num);font-variant-numeric:tabular-nums;color:var(--chalk)}
@media(max-width:420px){.kpis{grid-template-columns:repeat(2,1fr)}}
table.ltab tr{animation:rowIn .4s both}
@keyframes rowIn{from{opacity:0;transform:translateX(-12px)}}
table.ltab td{font-family:var(--num);font-size:15px} table.ltab td:nth-child(2){font-family:var(--sans);font-size:13.5px}
table.ltab tr.me td:first-child{box-shadow:inset 3px 0 0 var(--amber)}
table.ltab td:nth-child(2),table.ltab th:nth-child(2){text-align:left;padding-left:10px}
html.th .abrow .bar i,html.th .abc .ab1 i{background:linear-gradient(90deg,var(--blue),var(--amber))}
.medals{display:flex;flex-wrap:wrap;gap:8px;margin:2px 0 8px}
.medal-b{display:inline-flex;align-items:center;gap:8px;padding:5px 14px 5px 6px;border-radius:999px;font-weight:700;font-size:14px;
  background:linear-gradient(90deg,color-mix(in srgb,var(--amber) 28%,transparent),color-mix(in srgb,var(--amber) 6%,transparent));border:1px solid color-mix(in srgb,var(--amber) 50%,transparent);animation:medal .6s cubic-bezier(.3,1.6,.5,1) both}
.medal-b i{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-size:12px;color:#3d2c05;background:radial-gradient(circle at 35% 30%,#fff4c4,#f2c14e 55%,#a87a1c)}
@keyframes medal{from{transform:scale(.4);opacity:0}}
/* ---------- E. 章節時間軸 ---------- */
.card.chap{margin-left:24px;position:relative;overflow:visible}
.card.chap::before{content:'';position:absolute;left:-19px;top:18px;width:14px;height:14px;border-radius:50%;background:var(--c,var(--dim));box-shadow:0 0 0 3px var(--bg),0 0 14px var(--c,transparent);z-index:1}
.card.chap::after{content:'';position:absolute;left:-13px;top:34px;bottom:-14px;width:2px;background:var(--edge)}
.card.chap h4::before{display:none}
.card.chap .ch-meta{font:600 13px var(--num);letter-spacing:.04em}
.tile b{font-family:var(--num);font-size:24px}
/* 大事記節點 */
.sd.gold::before{box-shadow:0 0 0 3px var(--bg),0 0 10px var(--amber)}
/* ---------- F. 轉場 ---------- */
#log{position:relative;overflow-x:clip}
.wipe{position:absolute;top:0;bottom:0;left:-40%;width:34%;z-index:5;pointer-events:none;transform:skewX(-14deg);
  background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--club,var(--amber)) 30%,transparent),transparent);animation:wipe .5s ease-out forwards}
@keyframes wipe{to{left:120%}}
html.calm .wipe,html.calm .floodfx{display:none}
@media (prefers-reduced-motion:reduce){#bd-tick span{animation:none;padding-left:0}.wipe,.floodfx{display:none}}
.ach-d{color:var(--dim);font-size:12px}
/* ---------- v0.24 成就 ---------- */
#achp{position:fixed;inset:0;z-index:90;display:none;align-items:center;justify-content:center;background:#0009;padding:16px}
#achp.open{display:flex}
#achp .box{width:min(560px,100%);max-height:calc(100vh - 32px);overflow-y:auto;background:var(--panel);color:var(--chalk);border:1px solid var(--edge);border-radius:14px;padding:16px;box-shadow:0 20px 50px #0008}
#achp h3{font-size:15px;margin-bottom:6px;display:flex;justify-content:space-between;align-items:center}
#achp h3 button{background:none;border:1px solid var(--edge);color:var(--dim);border-radius:6px;padding:0 8px;cursor:pointer}
#achp h5{font-size:12px;letter-spacing:.2em;color:var(--dim);margin:14px 0 6px}
#achp .hint{font-size:12.5px;color:var(--dim)}
.ach-row{display:grid;grid-template-columns:minmax(0,9em) 1fr auto;gap:10px;align-items:center;padding:7px 10px;border:1px solid var(--edge);border-radius:10px;margin-top:6px;background:var(--panel2)}
.ach-row .ach-n{font-weight:700;font-size:14px}
.ach-row .ach-t{font-size:11.5px;color:var(--dim);display:flex;align-items:center;gap:3px;white-space:nowrap}
.ach-row .ach-t i{width:8px;height:8px;border-radius:50%;background:var(--edge);margin-right:1px}
.ach-row .ach-t i.on{background:var(--amber)}
.ach-row.locked{opacity:.45} .ach-row.locked .ach-n{color:var(--dim)}
.ach-row.r-e:not(.locked){border-color:color-mix(in srgb,var(--story) 55%,var(--edge))}
.ach-row.r-l:not(.locked){border-color:color-mix(in srgb,var(--amber) 70%,var(--edge));box-shadow:0 0 12px color-mix(in srgb,var(--amber) 20%,transparent)}
@media(max-width:480px){.ach-row{grid-template-columns:1fr auto}.ach-row .ach-d{grid-column:1/-1;grid-row:2}}
/* ---------- v0.67.1 更新公告:首頁標題下方一條,點開看最近幾版的重點;看過的版本 NEW 標籤變暗 ---------- */
.news-bar{display:flex;align-items:center;gap:10px;width:100%;max-width:500px;margin:4px 0 6px;padding:8px 12px;border:1px solid color-mix(in srgb,var(--amber) 45%,var(--edge));border-radius:10px;background:color-mix(in srgb,var(--amber) 8%,var(--panel));color:var(--chalk);font:500 13px var(--sans);text-align:left;cursor:pointer}
.news-bar:hover{background:color-mix(in srgb,var(--amber) 15%,var(--panel))} .news-bar:focus-visible{outline:2px solid var(--amber);outline-offset:2px}
.news-bar .nb-tag{flex:none;font:700 10.5px var(--num);letter-spacing:.12em;padding:2px 7px;border-radius:999px;background:var(--amber);color:var(--on-amber)}
.news-bar .nb-t{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.news-bar .nb-go{flex:none;font-size:12px;color:var(--amber)}
.news-bar.seen{border-color:var(--edge);background:var(--panel)} .news-bar.seen .nb-tag{background:var(--edge);color:var(--dim)} .news-bar.seen .nb-go{color:var(--dim)}
#newsp .nw{padding:12px 0;border-top:1px solid var(--edge)} #newsp .nw:first-of-type{border-top:none}
#newsp .nw h4{font-size:14.5px;display:flex;gap:8px;align-items:baseline;flex-wrap:wrap} #newsp .nw h4 small{font:500 11.5px var(--mono);color:var(--dim)}
#newsp .nw h4 .nb-tag{font:700 10px var(--num);letter-spacing:.12em;padding:1px 6px;border-radius:999px;background:var(--amber);color:var(--on-amber)}
#newsp .nwg{border-top:1px solid var(--edge);padding:10px 0} #newsp .nwg summary{cursor:pointer;font:700 13.5px var(--sans);color:var(--chalk);list-style:none;display:block} #newsp .nwg summary::-webkit-details-marker{display:none}
#newsp .nwg summary::before{content:'▸ ';color:var(--amber)} #newsp .nwg[open] summary::before{content:'▾ '} #newsp .nwg summary span{display:block;margin:2px 0 0 1.1em;font:400 12px var(--sans);color:var(--dim);overflow:hidden;text-overflow:ellipsis;white-space:nowrap} #newsp .nwg[open] summary span{display:none} #newsp .nwg .nw{padding-left:14px}
#newsp .nw ul{margin:6px 0 0;padding-left:1.2em;font-size:13.5px;line-height:1.7;color:var(--hd)} #newsp .nw li+li{margin-top:2px}
/* ---------- v0.37 過往人生 ---------- */
#lifep,#bkp,#lbp,#dailyp,#scard,#bio,#newsp{position:fixed;inset:0;z-index:90;display:none;align-items:center;justify-content:center;background:#0009;padding:16px}
#lifep.open,#bkp.open,#lbp.open,#dailyp.open,#scard.open,#bio.open,#newsp.open{display:flex}
#lifep .box,#bkp .box,#lbp .box,#dailyp .box,#scard .box,#bio .box,#newsp .box{width:min(560px,100%);max-height:calc(100vh - 32px);overflow-y:auto;background:var(--panel);color:var(--chalk);border:1px solid var(--edge);border-radius:14px;padding:16px;box-shadow:0 20px 50px #0008}
#lifep h3,#bkp h3,#lbp h3,#dailyp h3,#scard h3,#bio h3,#newsp h3{font-size:15px;margin-bottom:6px;display:flex;justify-content:space-between;align-items:center}
#lifep h3 button,#bkp h3 button,#lbp h3 button,#dailyp h3 button,#scard h3 button,#bio h3 button,#newsp h3 button{background:none;border:1px solid var(--edge);color:var(--dim);border-radius:6px;padding:0 8px;cursor:pointer}
#lifep .hint,#bkp .hint,#lbp .hint,#dailyp .hint,#scard .hint{font-size:12.5px;color:var(--dim)}
#bkp .bk-sec{margin:12px 0;padding:12px;border:1px solid var(--edge);border-radius:10px} #bkp .bk-code{font:700 30px/1.2 ui-monospace,Menlo,Consolas,monospace;letter-spacing:.12em;color:var(--amber);text-align:center;margin:12px 0 4px;user-select:all} #bkp #bk-code{text-transform:uppercase;letter-spacing:.1em}
/* v0.58 分享卡與完整傳記 */
#scard .box{width:min(460px,100%)}
.sc-opts{display:flex;flex-direction:column;gap:6px;margin:6px 0 10px}
.sc-seg{display:flex;gap:6px} .sc-seg button{flex:1;font:600 13px var(--sans);color:var(--chalk);background:var(--panel2);border:1px solid var(--edge);border-radius:8px;padding:7px 4px;cursor:pointer}
.sc-seg button[aria-pressed="true"]{border-color:var(--amber);color:var(--amber)}
.sc-seg button:focus-visible,#sc-x:focus-visible,#bio-x:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
.sc-img{display:flex;justify-content:center;background:#0006;border-radius:10px;padding:8px;min-height:200px}
.sc-img img{max-width:100%;max-height:min(62vh,640px);border-radius:8px;transition:opacity .2s}
.sc-act{display:flex;gap:8px;margin-top:10px} .sc-act .btn{flex:1}
#bio .box{width:min(640px,100%);max-height:calc(100vh - 32px)}
/* v0.64.2 iOS PWA:彈出視窗讓開瀏海／狀態列和底部橫條,高度用 dvh 扣掉安全區域;標題列(關閉鈕)捲動時固定在面板頂端 */
#prefs,#achp,#lifep,#bkp,#lbp,#dailyp,#scard,#bio,#newsp,#stdp{padding:calc(12px + env(safe-area-inset-top,0px)) max(12px,env(safe-area-inset-right,0px)) calc(12px + env(safe-area-inset-bottom,0px)) max(12px,env(safe-area-inset-left,0px))}
#prefs .box,#achp .box,#lifep .box,#bkp .box,#lbp .box,#dailyp .box,#scard .box,#bio .box,#newsp .box,#stdp .box{max-height:calc(100vh - 24px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px));max-height:calc(100dvh - 24px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px))}
#prefs .box>h3,#achp .box>h3,#lifep .box>h3,#bkp .box>h3,#lbp .box>h3,#dailyp .box>h3,#scard .box>h3,#bio .box>h3,#newsp .box>h3,#stdp .box>h3{position:sticky;top:-16px;z-index:3;background:var(--panel);margin:-16px -16px 6px;padding:14px 16px 8px;border-radius:14px 14px 0 0}
#bio-body{display:flex;flex-direction:column;gap:8px}
#bio-body h3{font-size:12.5px;letter-spacing:.14em;color:var(--dim);margin:12px 0 2px}
.bio-hd{display:flex;justify-content:space-between;align-items:center;gap:10px}
.bio-hd b{display:block;font-size:24px;font-weight:900;color:var(--chalk)} .bio-hd span{font-size:12.5px;color:var(--dim)} .bio-hd .flag{width:20px;height:13px;vertical-align:-2px;margin-right:6px;border-radius:2px}
.bio-hd em{font-style:normal;font-weight:900;color:#1a1300;background:linear-gradient(#ffe08a,var(--amber));padding:4px 14px;border-radius:9px;flex:none}
.bio-rar{font-size:13px;color:var(--amber);margin:0}
.bio-ch{border:1px solid var(--edge);border-left:4px solid var(--cc,var(--edge));border-radius:10px;padding:9px 12px;background:var(--panel2)}
.bio-ch h4{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;font-size:15px;margin:0;color:var(--chalk)} .bio-ch h4 em{font-style:normal;font-size:11px;color:var(--dim);border:1px solid var(--edge);border-radius:5px;padding:0 5px} .bio-ch h4 small{margin-left:auto;font-size:12px;color:var(--dim);font-weight:400}
.bio-st{font-size:12.5px;color:var(--dim);margin:4px 0 0}
.bio-hon,.bio-hl,.bio-hist{margin:6px 0 0;padding-left:18px;font-size:12.5px;line-height:1.7;color:var(--chalk)} .bio-hon li::marker{color:var(--amber)} .bio-hl b{color:var(--amber);margin-right:6px}
.bio-sub{font-size:12px;color:var(--dim);margin:4px 0 0}
.bio-all{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:4px 12px;font-size:12.5px;color:var(--chalk)}
.bio-all li{padding:5px 0;border-bottom:1px dashed var(--edge)} .bio-all b{color:var(--amber)} .bio-all small{display:block;color:var(--dim);font-size:11px}
.bio-pp{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:4px;font-size:13px} .bio-pp em{font-style:normal;color:var(--dim);display:inline-block;width:4.5em} .bio-pp small{color:var(--dim);margin-left:8px}
.bio-tw{overflow-x:auto} .bio-t{border-collapse:collapse;font-size:12px;width:100%;white-space:nowrap;font-variant-numeric:tabular-nums} .bio-t th,.bio-t td{padding:4px 6px;border-bottom:1px solid var(--edge);text-align:left} .bio-t th{color:var(--dim);font-weight:600} .bio-t tr.inj td{color:var(--bad)}
#bio-img img{max-width:100%}
.life-row{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:3px 10px;align-items:center;padding:10px 12px;border:1px solid var(--edge);border-radius:10px;margin-top:8px;background:var(--panel2);cursor:pointer;transition:border-color .2s}
.life-row:hover{border-color:var(--amber)}
.life-row .flag{width:24px;height:16px;border-radius:2px}
.life-row .lr-n{min-width:0;overflow-wrap:anywhere} .life-row .lr-n b{font-size:15px}
.lr-t{display:inline-block;margin-left:6px;padding:0 8px;border-radius:999px;font-size:11.5px;font-weight:700;border:1px solid var(--edge);color:var(--dim)}
.lr-t.t-傳奇{color:var(--on-amber);background:var(--amber);border-color:var(--amber)} .lr-t.t-巨星{color:var(--amber);border-color:var(--amber)} .lr-t.t-主力{color:var(--chalk)}
.life-row .lr-m{grid-column:2/-1;font-size:12.5px;color:var(--dim)} .life-row .lr-h{color:var(--chalk)}
.life-row .lr-f{display:flex;justify-content:space-between;align-items:center}
.life-row .lr-sd{display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px} .life-row .lr-sd code{color:var(--amber);font-family:var(--mono)} .life-row .lr-sd small{flex-basis:100%;color:var(--dim)}
.life-row .lr-sd button{background:none;border:1px solid var(--edge);color:var(--chalk);border-radius:6px;padding:1px 8px;font:inherit;font-size:12px;cursor:pointer}
#seed-show.flash{outline:2px solid var(--amber);outline-offset:2px}
.lr-s{background:none;border:none;font-size:20px;line-height:1;color:var(--dim);cursor:pointer;padding:0 2px} .lr-s.on{color:var(--amber)}
.lr-d{background:none;border:1px solid var(--edge);color:var(--dim);border-radius:6px;padding:1px 8px;font-size:11.5px;cursor:pointer} .lr-d.k{color:var(--bad);border-color:var(--bad)}
/* ---------- v0.37 生涯曲線 ---------- */
.cv-hud{display:flex;align-items:baseline;gap:4px 10px;flex-wrap:wrap;font-size:13.5px;color:var(--dim);min-height:30px}
.cv-hud .cv-age{font:800 28px/1 var(--num);color:var(--chalk)} .cv-hud .cv-club{color:var(--chalk);font-weight:700}
.cv-hud .cv-val{margin-left:auto;font:700 16px var(--num);color:var(--amber)}
.cv-ev{min-height:20px;font-size:13px;color:var(--amber);margin:2px 0 4px}
.cv-plot svg{width:100%;height:auto;display:block;overflow:visible}
.cv-plot .gl{stroke:var(--edge);stroke-width:1;stroke-dasharray:3 4} .cv-plot .gt{fill:var(--dim);font-size:10.5px;font-family:var(--num)}
.cv-plot .ar{fill:var(--amber);opacity:.13} .cv-plot .ln{fill:none;stroke:var(--amber);stroke-width:2.6;stroke-linejoin:round;stroke-linecap:round}
.cv-plot .dot{fill:var(--amber);stroke:var(--bg);stroke-width:2;filter:drop-shadow(0 0 6px var(--amber))}
.cv-plot .mk{opacity:0;transition:opacity .35s} .cv-plot .mk.on{opacity:1} .cv-plot .mk text{font-size:13px;fill:var(--chalk);opacity:.75} .cv-plot .mk.bad text{fill:var(--bad);font-weight:700;opacity:1}
.cv-plot .bd text{fill:#fff;font-size:10px;font-weight:700} .cv-plot .bd rect{opacity:.85}
.cv-tabs{display:flex;gap:6px;margin-top:8px;flex-wrap:wrap}
.cv-tabs button{background:var(--sub);border:1px solid var(--edge);color:var(--dim);border-radius:999px;padding:3px 12px;font-size:12.5px;cursor:pointer}
.cv-tabs button.on{border-color:var(--amber);color:var(--amber)} .cv-tabs .cv-skip{margin-left:auto}
.achs{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:8px}
.ach{position:relative;display:block;padding:8px 12px;border-radius:10px;background:var(--sub);border:1px solid var(--edge);animation:medal .5s cubic-bezier(.3,1.6,.5,1) both}
.ach b{display:block;font-size:14.5px} .ach small{display:block;font-size:11.5px;color:var(--dim);line-height:1.45;margin-top:2px}
.ach em{position:absolute;top:6px;right:8px;font:700 11px var(--num);letter-spacing:.1em;color:var(--on-amber);background:var(--amber);padding:0 6px;border-radius:4px;font-style:normal}
.ach.r-e{border-color:color-mix(in srgb,var(--story) 60%,var(--edge))}
.ach.r-l{border-color:var(--amber);box-shadow:0 0 14px color-mix(in srgb,var(--amber) 25%,transparent)}
/* ---------- v0.25.3 首頁 ---------- */
html.th.glow .s-sky{display:block}
html.th.glow .s-sky .lt{background:linear-gradient(180deg,color-mix(in srgb,var(--amber) 14%,transparent),transparent 70%)}
.hero .kicker,html.th .hero .kicker{display:flex;align-items:center;gap:10px;font:700 12px var(--num);letter-spacing:.3em;color:var(--dim)}
.hero .live{display:inline-flex;align-items:center;gap:6px;background:var(--bad);color:#fff;padding:2px 8px 2px 7px;border-radius:4px;letter-spacing:.15em}
.hero .live i{width:7px;height:7px;border-radius:50%;background:#fff;animation:blink 1.4s steps(2) infinite}
#start h1 .en{font:800 clamp(64px,12vw,112px)/.9 var(--num);letter-spacing:.01em}
#start h1 em{font-size:clamp(20px,3.6vw,26px);letter-spacing:.24em;margin-top:6px}
.lower3{display:inline-flex;margin-top:14px;border-radius:6px;overflow:hidden;box-shadow:0 6px 18px #0005;font-size:14px}
.lower3 b{background:var(--amber);color:var(--on-amber);padding:4px 12px;font:800 16px/1.6 var(--num);letter-spacing:.06em}
.lower3 span{background:var(--panel2);color:var(--chalk);padding:4px 14px;line-height:1.75;font-weight:700}
#start .sub{margin-top:12px}
.hero-pitch{max-width:500px;margin-top:6px;filter:drop-shadow(0 18px 30px #0007)}
html.th .hero-pitch g.hp-b,html.th .hero-pitch g.hp-opp,html.th .hero-pitch g.hp-mate,.hero-pitch g.hp-b{stroke:none}
.hero-pitch .hp-a{fill:var(--pitch1)} .hero-pitch .hp-b path{fill:var(--pitch2)}
.hero-pitch .hp-l,html.th .hero-pitch g.hp-l{fill:none;stroke:var(--pline);stroke-width:1.4}
.hero-pitch .hp-goal{fill:color-mix(in srgb,var(--chalk) 12%,transparent);stroke:var(--chalk);stroke-width:1.4}
.hero-pitch .hp-run{stroke:var(--amber);stroke-width:2.2;stroke-dasharray:5 6;animation:dash 2.4s linear infinite}
.hero-pitch .hp-pass{stroke:var(--chalk);stroke-opacity:.45;stroke-width:1.2;stroke-dasharray:3 4}
.hero-pitch .hp-opp circle,html.th .hero-pitch .hp-opp circle{fill:var(--bad);stroke:none} .hero-pitch .hp-opp .gk{fill:color-mix(in srgb,var(--bad) 50%,var(--chalk))}
.hero-pitch .hp-mate circle{fill:var(--blue)}
.hero-pitch .hp-me{fill:var(--amber);stroke:var(--bg);stroke-width:1.5}
.hero-pitch .hp-ball{fill:#fff;stroke:#111;stroke-width:.8}
.hbug{display:flex;max-width:500px;margin-top:10px;border-radius:8px;overflow:hidden;border:1px solid var(--edge);background:var(--sub)}
.hbug div{flex:1;text-align:center;padding:6px 4px;border-left:1px solid var(--edge)} .hbug div:first-child{border-left:none;background:var(--amber)}
.hbug div:first-child b,.hbug div:first-child span{color:var(--on-amber)}
.hbug b{display:block;font:700 22px/1.1 var(--num);color:var(--chalk)} .hbug span{font-size:11px;color:var(--dim);letter-spacing:.08em}
.htick{max-width:500px;margin-top:8px;overflow:hidden;white-space:nowrap;font-size:12.5px;color:var(--dim);border-top:1px solid var(--edge);padding-top:6px}
.htick span{display:inline-block;padding-left:100%;animation:tick 30s linear infinite} .htick em{font-style:normal;color:var(--amber);margin:0 6px}
.feat{display:none}
/* 面板 */
#start .panel{border-top:3px solid var(--amber)}
.field label{display:flex;align-items:center;gap:8px}
.field label i{font:800 13px var(--num);font-style:normal;color:var(--on-amber);background:var(--amber);border-radius:4px;padding:0 6px;letter-spacing:.05em}
.field label .lg{margin-left:auto;font-size:11px;letter-spacing:.05em;font-weight:400;color:var(--dim)}
.seg.pos button{display:flex;flex-direction:column;align-items:center;gap:2px;padding:10px 4px 9px}
.seg button small{font-size:10.5px;font-weight:500;color:var(--dim);letter-spacing:.02em;white-space:nowrap}
#seg-nat .seg button{display:flex;flex-direction:column;align-items:center;gap:5px;padding:8px 2px 7px}
.tdots{display:inline-flex;gap:3px}
.tdots i{width:5px;height:5px;border-radius:50%;background:var(--edge)}
.tdots i.on{background:var(--amber)}
.seg button.on .tdots i.on{box-shadow:0 0 6px var(--amber)}
#nat-desc{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
#nat-desc span{flex:1 1 auto;min-width:0;background:var(--sub);border:1px solid var(--edge);border-radius:8px;padding:5px 10px}
#nat-desc small{display:block;font-size:10.5px;color:var(--dim);letter-spacing:.06em}
#nat-desc b{font-size:13px;color:var(--chalk)} #nat-desc .tdots{margin-left:6px;vertical-align:1px}
.btn.shine{position:relative;overflow:hidden}
.btn.shine::after{content:'';position:absolute;top:0;bottom:0;left:-40%;width:30%;transform:skewX(-20deg);background:linear-gradient(90deg,transparent,#ffffff59,transparent);animation:shine 3.2s ease-in-out infinite}
@keyframes shine{0%,55%{left:-40%}100%{left:130%}}
@media (max-width:600px){ .hero-pitch{display:block;max-width:100%} .htick{display:none} #start h1 .en{font-size:64px} .seg.pos button small{white-space:normal;font-size:9.5px;line-height:1.3} .seg.pos small.sp{display:flex;flex-direction:column;align-items:center;gap:1px} .seg.pos small.sp .sep{display:none} .seg.pos small.sp .pd{white-space:nowrap;letter-spacing:0;font-size:min(9.5px,2.55vw)} @media (max-width:350px){ .seg.pos small.sp .pd{font-size:7.2px} } html:not([lang="en"]) .seg.pos{grid-template-columns:repeat(4,minmax(0,1fr))} html:not([lang="en"]) .seg.pos button{padding-left:2px;padding-right:2px} .field label .lg{display:none} }
html.calm .htick span,html.calm .btn.shine::after{animation:none} html.calm .htick span{padding-left:0}
.flag{display:inline-block;width:20px;height:13.33px;border-radius:2px;box-shadow:0 0 0 1px #0000004d;vertical-align:-2px;flex:none;margin-right:5px}
.flag.big{width:36px;height:24px;margin:0 8px 0 0;border-radius:3px}
.nn{display:inline-flex;align-items:center;gap:0}
.nat-tabs{display:grid;grid-template-columns:repeat(5,1fr);gap:5px;margin:0 0 10px}
.nat-tabs button{display:flex;align-items:baseline;justify-content:center;gap:3px;min-width:0;padding:7px 2px;border-radius:999px;border:1px solid var(--edge);background:var(--panel);color:var(--dim);font:600 12.5px var(--sans);white-space:nowrap;cursor:pointer}
.nat-tabs button small{font:500 10.5px var(--num);opacity:.75}
@media (max-width:380px){ .nat-tabs{gap:4px} .nat-tabs button{font-size:min(12.5px,3.5vw);padding:7px 1px;gap:2px} .nat-tabs button small{font-size:9.5px} html[lang="en"] .nat-tabs button small{display:none} } .nat-tabs button:hover{color:var(--chalk)}
.nat-tabs button.sel{background:var(--amber);border-color:var(--amber);color:var(--on-amber)} .nat-tabs button.sel small{opacity:.85}
.nat-tabs button:focus-visible{outline:2px solid var(--amber);outline-offset:2px}
#seg-nat .seg{align-content:start}
/* v0.67.4 國籍按鈕只有 50–80px 寬(手機、電腦都是),國旗加國名會跳行或超出:改成國旗在上、國名在下,國名不換行,字級跟著螢幕寬度縮;英文的兩個字國名可以換行 */
#seg-nat .nn{flex-direction:column;gap:4px;white-space:nowrap;font-size:min(13px,3.3vw);letter-spacing:0} #seg-nat .nn .flag{margin:0} html[lang="en"] #seg-nat .nn{white-space:normal;text-align:center;line-height:1.15}
#nat-desc .nd-flag{display:flex;align-items:center;flex:0 0 auto}
#bd-name small .flag{width:16px;height:10.67px;vertical-align:-1px;margin-right:4px}
/* ---------- v0.25.7 右欄:生涯面板＋里程碑 ---------- */
#side .side-top{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:8px}
/* v0.57 人際面板 */
.side-tabs{display:flex;gap:4px;flex:1}
.side-tabs button{position:relative;flex:1;max-width:120px;font:700 13px var(--sans);color:var(--dim);background:none;border:0;border-bottom:2px solid transparent;padding:6px 0 7px;cursor:pointer}
.side-tabs button[aria-selected="true"]{color:var(--chalk);border-color:var(--amber)}
.side-tabs button:focus-visible,.pc:focus-visible,.pc .exb:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
.pdot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--bad);margin-left:5px;vertical-align:2px}
#btn-side{position:relative} #btn-side .pdot{position:absolute;top:-4px;right:-4px;margin:0} .pdot[hidden]{display:none}
#side[data-tab="sum"] #side-ppl,#side[data-tab="ppl"] #side-dash,#side[data-tab="ppl"] #side-list,#side[data-tab="ppl"]>h3{display:none}
#side-ppl{display:flex;flex-direction:column;gap:14px;margin:4px 0 14px}
.pg h5{margin:0 0 6px;font-size:11.5px;letter-spacing:.1em;color:var(--dim);font-weight:700}
.pg h5 em{font-style:normal;font-weight:400;margin-left:6px}
.pl{display:flex;flex-direction:column;gap:7px}
.pc{display:block;width:100%;text-align:left;color:inherit;font:inherit;background:var(--panel);border:1px solid var(--edge);border-left:3px solid var(--rc,var(--edge));border-radius:10px;padding:8px 10px;cursor:pointer}
.pc.new{box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--bad) 45%,transparent)}
.pc .ph{display:flex;align-items:center;gap:8px;min-width:0}
.pc .ic{width:30px;height:30px;flex:none;border-radius:50%;display:grid;place-items:center;font-size:15px;background:var(--panel2)}
.pc .pn{flex:1;min-width:0} .pc .pn b{font-size:14px;color:var(--chalk)} .pc .pn small{display:block;font-size:11.5px;color:var(--dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pc .newb{font-size:10.5px;color:var(--bad);margin-left:6px;font-weight:700}
.pchip{flex:none;font-size:11px;padding:1px 8px;border-radius:999px;border:1px solid currentColor;white-space:nowrap}
.r-good{color:var(--blue)} .r-mid{color:var(--dim)} .r-bad{color:var(--bad)} .r-gold{color:var(--amber)}
.pc .now{margin:6px 0 0;font-size:12.5px;line-height:1.6;color:var(--chalk)} .pc .now em{font-style:normal;color:var(--dim);font-size:11.5px;margin-right:6px}
.pc .hist{margin-top:8px;padding-top:8px;border-top:1px dashed var(--edge);font-size:12px;color:var(--dim);display:flex;flex-direction:column;gap:3px}
.pc .hist b{color:var(--chalk);font-weight:500;margin-right:6px}
.pc:not(.open) .hist{display:none}
.pc .exb{color:var(--blue);cursor:pointer} .pc .exl{display:block}
.pmem{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
.pmm{background:var(--panel);border:1px solid var(--edge);border-radius:10px;padding:8px 6px;text-align:center;font-size:11.5px;color:var(--dim);min-width:0;overflow-wrap:anywhere}
.pmm .ic{width:30px;height:30px;margin:0 auto 4px;border-radius:50%;display:grid;place-items:center;font-size:15px;background:var(--panel2)}
.pmm b{display:block;color:var(--chalk);font-size:12.5px}
.pmm.lock{border-style:dashed;opacity:.7} .pmm.lock .ic{filter:grayscale(1)}
.pempty{font-size:12.5px;color:var(--dim);line-height:1.7;padding:4px}
#bd-num{cursor:pointer}
#side-dash{display:grid;gap:8px;margin:4px 0 14px}
#side-dash .dsd{display:flex;align-items:center;gap:8px} #side-dash .dsd code{color:var(--amber);font-family:var(--mono);font-size:14px}
#side-dash .dsd button{background:none;border:1px solid var(--edge);color:var(--chalk);border-radius:6px;padding:1px 8px;font:inherit;font-size:12px;cursor:pointer}
.dsec{background:var(--panel);border:1px solid var(--edge);border-radius:12px;padding:9px 12px}
.dsec h5{font-size:11.5px;letter-spacing:.1em;color:var(--dim);font-weight:700;margin:0 0 6px}
.dsec p{font-size:12.5px;line-height:1.6;color:var(--chalk);margin:0} .dsec p b{color:var(--amber)} .dsec p .up{color:var(--good)}
.dsec .flag{width:16px;height:10.67px;vertical-align:-1px;margin-right:5px}
.dk{display:grid;grid-template-columns:repeat(4,1fr);gap:4px;margin-bottom:4px}
.dk span{background:var(--sub);border-radius:8px;padding:3px 0;text-align:center}
.dk b{display:block;font:700 18px/1.15 var(--num);color:var(--chalk)} .dk small{font-size:10.5px;color:var(--dim)}
.dg{position:relative;display:flex;justify-content:space-between;gap:8px;font-size:12.5px;padding:3px 0 7px}
.dg b{font:700 13px var(--num);color:var(--amber)}
.dg i{position:absolute;left:0;bottom:2px;height:3px;border-radius:2px;background:linear-gradient(90deg,var(--blue),var(--amber))}
.dg{background:linear-gradient(var(--edge),var(--edge)) left bottom 2px/100% 3px no-repeat}
.drv{font-size:12.5px;color:var(--dim);padding:0 4px} .drv b{color:var(--chalk)}
#side h3{margin-top:2px}
.sg{margin-bottom:6px}
.sg-h{display:flex;align-items:center;gap:8px;width:100%;background:none;border:none;color:var(--chalk);cursor:pointer;padding:4px 2px;font:700 13px var(--num);letter-spacing:.04em;text-align:left}
.sg-h::before{content:'▾';color:var(--amber);font-size:11px} .sg.shut .sg-h::before{content:'▸'}
.sg-h small{font:500 11.5px var(--sans);color:var(--dim)}
.sg-h em{margin-left:auto;font-style:normal;font-size:11px;color:var(--dim);background:var(--sub);border-radius:999px;padding:0 7px}
.sg.shut .sg-b{display:none}
.sd{display:grid;grid-template-columns:22px 1fr;column-gap:6px;align-items:start;padding:6px 9px}
.sd .ic{grid-row:1/3;font-style:normal;font-size:13px;line-height:1.5;text-align:center;color:var(--amber)} .sd .ic .flag{width:16px;height:10.67px;margin:3px 0 0}
.sd b{grid-column:2} .sd span{grid-column:2}
.sd.red .ic{color:var(--bad)}
#side-list{padding-left:0} #side-list::before,html.th #side-list::before{display:none} .sd::before{display:none}
/* ---------- v0.25.9 首頁足球化:轉播視角球場、足球 Logo、比賽時鐘字幕條 ---------- */
#start h1 .en{display:flex;align-items:center}
.hball{width:.74em;height:.74em;margin:0 .02em;flex:none;animation:hspin 9s linear infinite;filter:drop-shadow(0 4px 10px #0006)}
.hball circle{fill:#f4f6fa} .hball path{fill:#151a26} .hball .sm{fill:none;stroke:#151a26;stroke-width:.7}
@keyframes hspin{to{transform:rotate(360deg)}}
.hero .kicker .ko{margin-left:auto;font-size:11px;letter-spacing:.18em;color:var(--amber);border:1px solid color-mix(in srgb,var(--amber) 45%,transparent);border-radius:4px;padding:1px 7px}
.lower3{align-items:stretch;max-width:500px;width:100%}
.lower3 span{display:flex;align-items:center;background:var(--panel2)}
.lower3 .trk{flex:1;position:relative;background:var(--panel2);min-width:60px}
.lower3 .trk::before{content:'';position:absolute;left:4px;right:4px;top:50%;height:2px;margin-top:-1px;background:repeating-linear-gradient(90deg,var(--dim) 0 6px,transparent 6px 11px);opacity:.6}
.lower3 .trk i{position:absolute;top:50%;left:4px;width:9px;height:9px;margin-top:-4.5px;border-radius:50%;background:#f4f6fa;box-shadow:0 0 0 2px var(--panel2),0 0 10px var(--amber);animation:htrk 6s ease-in-out infinite}
@keyframes htrk{0%{left:4px}85%,100%{left:calc(100% - 13px)}}
.lower3 b.end{background:var(--sub);color:var(--amber);border-left:1px solid var(--edge)}
#start .sub{max-width:500px;text-wrap:balance}
.hero-pitch{max-width:500px;border-radius:14px;box-shadow:0 20px 40px #0008,0 0 0 1px var(--edge)}
.hero-pitch .hp-sky{fill:#070b14} .hero-pitch .hp-stand{fill:#121a2e} .hero-pitch .hp-crowd{fill:#ffffff24} .hero-pitch .hp-tier{stroke:#00000080;stroke-width:1.2}
.hero-pitch .hp-flash circle{fill:#fff;opacity:0;animation:hflash 3.2s infinite} .hero-pitch .hp-flash circle:nth-child(2n){animation-delay:1.1s} .hero-pitch .hp-flash circle:nth-child(3n){animation-delay:2.3s}
@keyframes hflash{0%,92%,100%{opacity:0}95%{opacity:.9}}
.hero-pitch .g0{fill:#1f5a35} .hero-pitch .g1{fill:#246640}
.hero-pitch .hp-ad{fill:#0b1020;stroke:var(--amber);stroke-width:.6}
.hero-pitch .hp-adt{font:700 4.2px var(--num);letter-spacing:.25em;fill:var(--amber)}
.hero-pitch .hp-l,html.th .hero-pitch g.hp-l{fill:none;stroke:#ffffffc8;stroke-width:1.1} .hero-pitch .hp-l .dotw{fill:#fff;stroke:none}
.hero-pitch .hp-net,html.th .hero-pitch g.hp-net{fill:none;stroke:#ffffff70;stroke-width:.45}
.hero-pitch .hp-post{fill:none;stroke:#fff;stroke-width:1.8;stroke-linejoin:round}
.hero-pitch .pole{stroke:#fff;stroke-width:.8} .hero-pitch .fl{fill:var(--amber)}
.hero-pitch .hp-ball circle{fill:#fff;stroke:#111;stroke-width:.6} .hero-pitch .hp-ball path{fill:#111}
.hero-pitch .hp-run{stroke:var(--amber);stroke-width:1.8;stroke-dasharray:5 5;animation:dash 2.4s linear infinite}
.hero-pitch .hp-pass{stroke:#fff;stroke-opacity:.55;stroke-width:1.1;stroke-dasharray:3 4}
.hero-pitch .hp-goal-t text{font:800 30px var(--num);letter-spacing:.12em;fill:var(--amber);paint-order:stroke;stroke:#070b14;stroke-width:5;font-style:italic}
html.th .hero-pitch g{stroke:none}
html.calm .hball,html.calm .lower3 .trk i,html.calm .hero-pitch .hp-flash circle{animation:none}
/* ---------- v0.26.0 首頁動畫:小人球員、射門破網、轉播字卡 ---------- */
.hero-pitch .fig .fs,.hero-pitch .fs{fill:#0008}
.hero-pitch .fig .fr{fill:none;stroke:var(--amber);stroke-width:.06;opacity:.9}
.hero-pitch .hp-ball circle{fill:#fff;stroke:#111;stroke-width:.14} .hero-pitch .hp-ball path{fill:#111}
.hero-pitch .hp-tele{fill:none;stroke:var(--amber);stroke-width:1.4;stroke-dasharray:4 4;stroke-linecap:round;animation:dash 1.4s linear infinite;filter:drop-shadow(0 0 3px var(--amber))}
#hp-gl .gbar{fill:var(--amber)} #hp-gl .gbar2{fill:var(--bad)} #hp-gl .gbar3{fill:#0b1020e6}
#hp-gl .gt{font:800 italic 25px var(--num);letter-spacing:.14em;fill:#0b1020}
#hp-gl .gm{font:800 14px var(--num);fill:#fff}
#hp-gl .gs{font:700 7.5px var(--num);letter-spacing:.14em;fill:var(--amber)}
.hero-pitch .yt path{fill:var(--amber)} .hero-pitch .yt text{font:800 7px var(--num);letter-spacing:.1em;fill:var(--amber);paint-order:stroke;stroke:#0b1020;stroke-width:2}
.hero-pitch.scored .hp-flash circle{animation-duration:.7s}
/* ---------- v0.26.1 存檔 ---------- */
.rsm{border:1px solid color-mix(in srgb,var(--amber) 50%,var(--edge));background:linear-gradient(135deg,color-mix(in srgb,var(--amber) 10%,var(--panel)),var(--panel));border-radius:12px;padding:12px 14px;margin-bottom:16px}
.rsm-t{display:flex;justify-content:space-between;align-items:center;font:700 11.5px var(--num);letter-spacing:.2em;color:var(--amber)} .rsm-t small{color:var(--dim);letter-spacing:.05em}
.rsm-t .flag{width:16px;height:10.67px;vertical-align:-1px;margin-right:6px}
.rsm>b{display:block;font-size:18px;margin-top:4px} .rsm p{font-size:13px;color:var(--dim);margin:2px 0 10px}
.rsm-b{display:flex;gap:8px} .rsm-b .btn{flex:1;margin:0} .rsm-h{display:block;font-size:11.5px;color:var(--dim);margin-top:6px}
/* ---------- v0.26.2 文字轉播 ---------- */
.card.live{background:linear-gradient(180deg,color-mix(in srgb,var(--panel2) 70%,#000),var(--panel));border-color:var(--edge)}
.lv-h{display:flex;align-items:center;gap:10px;margin:2px 0 8px}
.lv-b{display:inline-flex;align-items:center;gap:5px;background:var(--bad);color:#fff;font:700 10.5px var(--num);letter-spacing:.15em;padding:1px 7px;border-radius:4px}
.lv-b i{width:6px;height:6px;border-radius:50%;background:#fff;animation:blink 1.4s steps(2) infinite}
.lv-sc{display:flex;align-items:center;gap:8px;flex:1;min-width:0;font-size:13px} .lv-sc b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lv-sc em{font:800 17px var(--num);font-style:normal;color:var(--amber);background:var(--sub);border-radius:6px;padding:0 8px;white-space:nowrap}
.lv-l p{display:grid;grid-template-columns:44px 1fr;gap:6px;font-size:13px;line-height:1.55;padding:4px 0;border-top:1px dashed color-mix(in srgb,var(--edge) 70%,transparent);opacity:0;animation:lvIn .35s ease forwards}
.lv-l p:first-child{border-top:none} .lv-l p>span{font:700 13px var(--num);color:var(--dim);text-align:right}
.lv-l p.g{background:color-mix(in srgb,var(--amber) 9%,transparent);border-radius:6px;padding-left:4px;padding-right:4px} .lv-l p.g.opp{background:color-mix(in srgb,var(--bad) 9%,transparent)}
.lv-l p.g>span{color:var(--amber)} .lv-l p.g.opp>span{color:var(--bad)} .lv-l p.k>span{color:var(--amber)} .lv-l p.k{color:var(--amber)}
@keyframes lvIn{from{opacity:0;transform:translateX(-6px)}to{opacity:1;transform:none}}
html.calm .lv-l p{opacity:1;animation:none}
.ft-sc{display:flex;align-items:center;justify-content:center;gap:12px;margin:4px 0 12px;font-size:14px;text-align:center} .ft-sc b{flex:1}
.ft-sc em{font:800 30px var(--num);font-style:normal;color:var(--chalk);background:var(--sub);border-radius:8px;padding:0 14px;white-space:nowrap}
.fts .st{display:grid;grid-template-columns:42px 1fr 42px;align-items:center;gap:8px;font-size:12px;margin:5px 0;position:relative;padding-top:13px}
.fts .st em{position:absolute;top:0;left:0;right:0;text-align:center;font-style:normal;color:var(--dim);font-size:11.5px}
.fts .st b{font:700 14px var(--num);text-align:center} .fts .st span{height:6px;border-radius:3px;background:color-mix(in srgb,var(--bad) 55%,var(--edge));overflow:hidden}
.fts .st i{display:block;height:100%;background:var(--amber)}
.ft-me{display:flex;align-items:center;gap:10px;margin-top:12px;padding-top:10px;border-top:1px solid var(--edge);font-size:13.5px}
.ft-me b{margin-left:auto;font:800 24px var(--num);background:var(--sub);border-radius:8px;padding:0 10px} .ft-me b.up{color:var(--good)} .ft-me b.dn{color:var(--bad)}
.ft-me em{font-style:normal;font-size:11.5px;background:var(--amber);color:var(--on-amber);border-radius:4px;padding:1px 7px;font-weight:700}
.dtr{display:flex;flex-wrap:wrap;gap:5px;padding:0 4px} .dtr span{font-size:12px;font-weight:700;padding:2px 8px;border-radius:999px;border:1px solid color-mix(in srgb,var(--amber) 55%,transparent);color:var(--amber);background:color-mix(in srgb,var(--amber) 10%,transparent);cursor:help}
.dtr span.neg{color:var(--bad);border-color:color-mix(in srgb,var(--bad) 55%,transparent);background:color-mix(in srgb,var(--bad) 10%,transparent)} .dtr span.off{color:var(--dim);border-color:var(--edge);background:none;text-decoration:line-through;cursor:default}
.hlrow small.hlq{display:block;margin-top:2px;font-size:12px;font-weight:400;color:var(--dim)}
/* ---------- v0.26.13 首頁戰術分析畫面 ---------- */
.hero-pitch.tac .tc-bg{fill:#081019}
.hero-pitch.tac .tc-st0{fill:#0f2a20} .hero-pitch.tac .tc-st1{fill:#123024}
.hero-pitch.tac .tc-ln{fill:none;stroke:#ffffff5c;stroke-width:.9;stroke-linejoin:round} .hero-pitch.tac .tc-spot{fill:#ffffff80}
.hero-pitch.tac .tc-post{fill:none;stroke:#fff;stroke-width:1.6;stroke-linejoin:round}
.hero-pitch.tac .tc-net path{fill:none;stroke:#ffffff40;stroke-width:.4} .hero-pitch.tac .tc-net.hit path{stroke:var(--amber);stroke-opacity:.9}
.hero-pitch.tac .tc-space{fill:url(#tcsp);stroke:var(--amber);stroke-width:.6;stroke-dasharray:2 2;stroke-opacity:.7}
.hero-pitch.tac .tc-back{fill:none;stroke:#ff6b6b;stroke-width:1;stroke-dasharray:3 2.5;stroke-opacity:.75}
.hero-pitch.tac .tc-lbl.sp{fill:var(--amber)} .hero-pitch.tac .tc-lbl{font:700 6px var(--num);letter-spacing:.08em;fill:#fff;paint-order:stroke;stroke:#081019;stroke-width:2.2}
.hero-pitch.tac .tc-tele{fill:none;stroke:var(--amber);stroke-width:1.2;stroke-dasharray:3 3;stroke-linecap:round;animation:dash 1.2s linear infinite}
.hero-pitch.tac .tc-trail{fill:none;stroke:var(--amber);stroke-width:2.4;stroke-linecap:round;stroke-opacity:.28}
.hero-pitch.tac .tc-btrail{fill:none;stroke:#fff;stroke-width:1.6;stroke-linecap:round;stroke-opacity:.35}
.hero-pitch.tac .tc-pass path:first-child{fill:none;stroke:#fff;stroke-width:1.3;stroke-linecap:round;filter:drop-shadow(0 0 2px #fff8)} .hero-pitch.tac .tc-pass .hd{fill:#fff}
.hero-pitch.tac .tc-pass.shot path:first-child{stroke:var(--amber);stroke-width:1.6;filter:drop-shadow(0 0 3px var(--amber))} .hero-pitch.tac .tc-pass.shot .hd{fill:var(--amber)} .hero-pitch.tac .tc-pass.shot .tc-lbl{fill:var(--amber)}
.hero-pitch.tac .tc-p .dk{stroke-width:1.1} .hero-pitch.tac .tc-p text{font:800 5.6px var(--num);pointer-events:none}
.hero-pitch.tac .tc-p.op .dk{fill:#d9504f;stroke:#ffb3b0} .hero-pitch.tac .tc-p.op text{fill:#fff} .hero-pitch.tac .tc-p.op .dir{fill:#ff8a87}
.hero-pitch.tac .tc-p.gk .dk{fill:#8a8fb8;stroke:#d7daf2} .hero-pitch.tac .tc-p.gk text{fill:#fff} .hero-pitch.tac .tc-p.gk .dir{fill:#c4c8ea}
.hero-pitch.tac .tc-p.tm .dk{fill:#0b1222;stroke:var(--amber)} .hero-pitch.tac .tc-p.tm text{fill:var(--amber)} .hero-pitch.tac .tc-p.tm .dir{fill:var(--amber)}
.hero-pitch.tac .tc-p.me .dk{fill:var(--amber);stroke:#fff} .hero-pitch.tac .tc-p.me text{fill:#0b1222} .hero-pitch.tac .tc-p.me .dir{fill:#fff}
.hero-pitch.tac .tc-p .dir{opacity:.55;transition:opacity .2s} .hero-pitch.tac .tc-p.run .dir{opacity:1}
.hero-pitch.tac .tc-p .halo{fill:none;stroke:var(--amber);stroke-width:1;transform-box:fill-box;transform-origin:center;animation:tcHalo 1.6s ease-out infinite}
@keyframes tcHalo{0%{transform:scale(.6);opacity:.9}100%{transform:scale(1.5);opacity:0}}
.hero-pitch.tac .tc-you path{fill:var(--amber)} .hero-pitch.tac .tc-you text{font:800 6.4px var(--num);letter-spacing:.1em;fill:#0b1222}
.hero-pitch.tac .tc-spd{transition:opacity .25s} .hero-pitch.tac .tc-spd rect{fill:#081019d9;stroke:var(--amber);stroke-width:.5} .hero-pitch.tac .tc-spd text{font:700 5.4px var(--num);fill:var(--amber)}
.hero-pitch.tac .tc-ball{fill:#fff;stroke:#0b1222;stroke-width:.5;filter:drop-shadow(0 0 2px #fffa)} .hero-pitch.tac .tc-bsh{fill:#000}
.hero-pitch.tac .tc-pill{fill:#081019cc;stroke:#ffffff26;stroke-width:.6}
.hero-pitch.tac .tc-rec{fill:var(--bad);animation:tcRec 1.2s steps(2) infinite} @keyframes tcRec{50%{opacity:.25}}
.hero-pitch.tac .tc-ht{font:800 6.4px var(--num);letter-spacing:.16em;fill:#fff}
.hero-pitch.tac .tc-step{font:800 7px var(--num);letter-spacing:.08em;fill:var(--amber);paint-order:stroke;stroke:#081019;stroke-width:2.4}
.hero-pitch.tac .tc-sc{font:800 6.8px var(--num);letter-spacing:.1em;fill:#fff}
.hero-pitch.tac .tc-clk{font:700 6px var(--num);letter-spacing:.1em;fill:#ffffffa0;paint-order:stroke;stroke:#081019;stroke-width:2}
.hero-pitch.tac #tc-seg rect{fill:#ffffff2a} .hero-pitch.tac #tc-seg rect.done{fill:color-mix(in srgb,var(--amber) 55%,transparent)} .hero-pitch.tac #tc-seg rect.on{fill:var(--amber)}
.hero-pitch.tac .tc-space.bad{fill:none;stroke:#ff6b6b;stroke-opacity:.8} .hero-pitch.tac .tc-lbl.sp.bad{fill:#ff8a87}
.hero-pitch.tac .tc-back.mine{stroke:var(--amber)} .hero-pitch.tac .tc-tele.bad{stroke:#ff6b6b}
.hero-pitch.tac .tc-burst{fill:none;stroke:var(--amber);stroke-width:1.6}
html.calm .hero-pitch.tac .tc-p .halo,html.calm .hero-pitch.tac .tc-rec,html.calm .hero-pitch.tac .tc-tele{animation:none}
.recap{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 8px;margin:2px 0 10px;padding:7px 12px;border-radius:9px;border:1px solid var(--edge);border-left:3px solid var(--dim);background:color-mix(in srgb,var(--panel) 80%,transparent);font-size:12.5px}
.recap span{font:700 10.5px var(--num);letter-spacing:.12em;color:var(--dim)} .recap b{color:var(--chalk)} .recap em{font-style:normal;color:var(--dim);flex-basis:100%}
.recap.ok{border-left-color:var(--amber)} .recap.ok b{color:var(--amber)} .recap.ng{border-left-color:var(--bad)} .recap.ng b{color:var(--bad)}
/* v0.26.14 首頁排版:寬螢幕左右欄頂端對齊,左欄跟著捲動(sticky),戰術畫面放大到整欄寬 */
@media (min-width:900px){ #start .wrap{max-width:1180px;grid-template-columns:minmax(0,1.12fr) minmax(0,1fr);align-items:start;gap:44px}
  #start .hero{position:sticky;top:24px;align-self:start;padding-top:12px} #start .panel{align-self:start}
  #start .hero .hero-pitch{max-width:none;width:100%} #start .hero>*{max-width:none} }
/* ---------- v0.26.18 手機版:關掉雙擊縮放、精簡記分板、精簡選項、縮小場景圖 ---------- */
html{touch-action:manipulation} button,a,input,select,label{touch-action:manipulation}
#bd-mini{display:none} #bd-keyab{display:none}
@keyframes kaUp{0%{color:var(--chalk);text-shadow:0 0 10px var(--amber)}100%{text-shadow:none}}
@media (max-width:700px){
  #seed-show{font-size:16px}
  #board{padding-top:calc(8px + env(safe-area-inset-top,0px));padding-bottom:8px}
  #bd-mini{display:flex;align-items:baseline;gap:6px;margin-top:6px;padding:5px 9px;border:1px solid var(--edge);border-radius:7px;background:color-mix(in srgb,var(--panel) 70%,transparent);font-size:12.5px;color:var(--dim);cursor:pointer;white-space:nowrap;overflow:hidden}
  #bd-mini b{font:800 17px var(--num);color:var(--amber);line-height:1} #bd-mini .mo{font-size:10.5px;letter-spacing:.1em}
  #bd-mini .ma{color:var(--chalk);font-weight:700} #bd-mini .mw{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis}
  #bd-mini i{font-style:normal;color:var(--amber)}
  #board:not(.full) #bd-bug,#board:not(.full) #bd-grid,#board:not(.full) #bd-abt,#board:not(.full) #bd-ab:not(.open),#board:not(.full) #bd-ab .radar,#board:not(.full) #bd-tick,#board:not(.full) #bd-time{display:none!important}
  #board:not(.full) #bd-meters{margin-top:6px;gap:8px} #board:not(.full) .mt{font-size:10.5px} #board:not(.full) .mt em{font-size:12.5px;top:-1px} #board:not(.full) .mt i{height:5px;margin-top:2px}
  #board.full{max-height:78vh;max-height:78dvh;overflow-y:auto}
  #bd-keyab{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 10px;margin-top:7px;padding:4px 6px;border:1px dashed transparent;border-radius:7px;cursor:pointer;font-size:11.5px;color:var(--dim)}
  #bd-keyab:focus-visible{outline:2px solid var(--blue);outline-offset:1px}
  #bd-keyab .ka b{margin-left:3px;font:700 14px var(--num);color:var(--amber)} #bd-keyab .ka i{font-style:normal;color:var(--amber);font-size:10px;margin-left:1px}
  #bd-keyab .ka.up b{animation:kaUp 1.6s ease} #bd-keyab em{margin-left:auto;font-style:normal;font-size:10.5px}
  #board:not(.full) #bd-ab.open{max-height:34vh;overflow-y:auto;margin-top:4px}
  #act .btn{margin-top:10px} #act{box-shadow:0 -8px 18px #0007}
  #act{padding-top:8px;padding-bottom:calc(8px + env(safe-area-inset-bottom))} #act .title{margin-bottom:6px;font-size:12px}
  .btn.tac{grid-template-columns:38px 1fr;gap:9px;padding:7px 10px 7px 8px;margin-bottom:6px}
  .btn.tac .ring{width:38px;height:38px} .btn.tac .ring b{font-size:14px} .btn.tac .ring i{font-size:9px}
  .btn.tac .tx{font-size:14px;line-height:1.3;padding-right:30px} .btn.tac .risk{top:7px;right:10px;font-size:10.5px}
  .btn.tac small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:11.5px;margin-top:1px}
  svg.scene{max-height:150px;width:auto;max-width:100%;margin-left:auto;margin-right:auto}
}
/* ---------- v0.27 關鍵時刻擴充 ---------- */
.btn.tac.r-sig{--r:#ffd36b;border-color:color-mix(in srgb,#ffd36b 70%,var(--edge))!important;background:linear-gradient(135deg,color-mix(in srgb,#ffd36b 16%,var(--btn)),var(--btn))!important;box-shadow:0 0 0 1px #ffd36b33,0 0 18px #ffd36b22}
.btn.tac.r-sig .tx::before{content:'★ ';color:#ffd36b}
.btn.lock,html.th .btn.lock{opacity:.5;cursor:not-allowed;border-style:dashed;background:none!important;box-shadow:none!important;color:var(--dim)}
.mres .tierl{margin-top:4px;font-size:13px;color:var(--chalk)} .mres .tier{font-weight:800;margin-right:6px;padding:1px 7px;border-radius:4px;font-size:12px}
.mres .tier.perfect{background:#ffd36b;color:#1a1300} .mres .tier.near{background:color-mix(in srgb,var(--amber) 22%,transparent);color:var(--amber)} .mres .tier.blunder{background:var(--bad);color:#fff}
.card.moment2{border-left:3px solid var(--amber)} .card.moment2.rv{border-left-color:var(--bad)} .card.moment2 h4{color:var(--amber)} .card.moment2.rv h4{color:var(--bad)}
/* v0.31 開局細分位置 */
.seg.dpseg{margin-top:8px;grid-template-columns:repeat(3,1fr)} .seg.dpseg:empty{display:none}
.seg.dpseg button{padding:7px 2px;font-size:13px}
.dpdesc{margin:6px 2px 0;font-size:12px;line-height:1.5;color:var(--dim)} .dpdesc:empty{display:none} .dpdesc b{color:var(--amber);font-weight:600} .dpdesc .nw{white-space:nowrap}
.card.chap .ch-more{margin-top:8px;padding-top:8px;border-top:1px dashed var(--edge)}
.card.chap .ch-tag{display:inline-block;margin-left:8px;padding:1px 7px;border-radius:999px;font:600 11px var(--sans);color:var(--on-amber);background:var(--amber);vertical-align:1px}
.card.wc .wc-ed{margin-top:10px;padding:9px 11px;border:1px solid var(--edge);border-radius:10px;background:var(--sub)}
.card.wc .wc-ed.win{border-color:var(--amber);box-shadow:0 0 0 1px var(--amber) inset}
.card.wc .wc-ed.miss{opacity:.78;background:transparent}
.card.wc .wc-h{display:flex;align-items:baseline;gap:8px;margin-bottom:4px}
.card.wc .wc-h b{font:700 18px var(--num);color:var(--amber)}.card.wc .wc-h span{font-weight:700;font-size:14px}.card.wc .wc-h em{margin-left:auto;font-style:normal;font-size:12px;color:var(--dim)}
.card.wc .wc-end{margin-top:10px;font-size:14px;line-height:1.7;color:var(--hd)}
.adv{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0 2px}
.adv span{display:flex;flex-direction:column;gap:1px;padding:5px 9px;border:1px solid var(--edge);border-radius:8px;background:var(--sub);min-width:0}
.adv small{font-size:11px;color:var(--dim)}.adv b{font-family:var(--num);font-size:17px;color:var(--chalk);font-weight:600;line-height:1.15}
.adv em{font-style:normal;font-size:11px;color:var(--hd)}.adv em.top{color:var(--amber);font-weight:700}
/* ---------- v0.36 世界盃冠軍演出 ---------- */
#wcfx{position:fixed;inset:0;z-index:95;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;text-align:center;padding:16px;
  background:radial-gradient(ellipse at 50% 40%,#3d2c07f0,#0b0905f7 70%);animation:wcIn .5s ease both;cursor:pointer;overflow:hidden}
#wcfx.out{animation:wcOut .45s ease forwards}
#wcfx .wc-ray{position:absolute;left:50%;top:36%;width:160vmax;height:160vmax;margin:-80vmax 0 0 -80vmax;pointer-events:none;
  background:repeating-conic-gradient(#ffcf4a24 0 6deg,transparent 6deg 18deg);animation:wcSpin 30s linear infinite;
  -webkit-mask:radial-gradient(closest-side,#000 15%,transparent 60%);mask:radial-gradient(closest-side,#000 15%,transparent 60%)}
#wcfx .wc-cup{position:relative;width:min(30vw,128px);height:auto;filter:drop-shadow(0 0 26px #ffcf4a99);animation:wcRise 1.4s cubic-bezier(.2,.9,.25,1) .2s both}
#wcfx .wc-cup .gl{animation:wcGlint 2.8s ease-in-out 1.8s infinite}
#wcfx h2{position:relative;margin:12px 0 0;font:900 clamp(42px,12vw,86px)/1 var(--num);letter-spacing:.12em;color:#ffd96a;text-shadow:0 4px 30px #000,0 0 40px #ffcf4a88;animation:wcDrop .7s cubic-bezier(.3,1.5,.5,1) 1.2s both}
#wcfx .wc-en{position:relative;font:700 12.5px var(--mono);letter-spacing:.5em;color:#f5e6b0;animation:wcFade .6s 1.6s both}
#wcfx .wc-nt{position:relative;display:flex;gap:8px;align-items:center;margin-top:10px;font:700 18px var(--sans);color:#fff;animation:wcFade .6s 1.9s both}
#wcfx .wc-nt .flag{width:34px;height:23px;border-radius:3px}
#wcfx .wc-sc{position:relative;font:600 15px var(--num);color:#f5e6b0;animation:wcFade .6s 2.2s both}
#wcfx .wc-me{position:relative;font-size:14px;color:#fff;opacity:.85;animation:wcFade .6s 2.5s both}
#wcfx .wc-tap{position:absolute;bottom:24px;left:0;right:0;font-size:12.5px;color:#f5e6b0aa;letter-spacing:.2em;animation:wcFade .6s 3.2s both,wcBlink 1.6s 3.8s infinite}
#wcfx .tape{position:absolute;top:-20px;width:8px;height:15px;border-radius:2px;pointer-events:none;animation:wcTape linear both}
@keyframes wcIn{from{opacity:0}} @keyframes wcOut{to{opacity:0;transform:scale(1.04)}}
@keyframes wcSpin{to{transform:rotate(360deg)}}
@keyframes wcRise{from{opacity:0;transform:translateY(90px) scale(.7)}}
@keyframes wcGlint{0%,70%,100%{opacity:0}80%{opacity:.9}}
@keyframes wcDrop{from{opacity:0;transform:scale(2.2)}}
@keyframes wcFade{from{opacity:0;transform:translateY(8px)}}
@keyframes wcBlink{50%{opacity:.35}}
@keyframes wcTape{0%{opacity:1}100%{opacity:1;transform:translate(var(--dx),112vh) rotate(var(--r))}}
/* ---------- v0.36 轉會官宣圖 ---------- */
.card.ann{border-color:color-mix(in srgb,var(--amber) 40%,var(--edge))}
div.an{position:relative;margin:4px 0 8px;border-radius:12px;overflow:hidden;color:#fff;
  background:linear-gradient(150deg,var(--cc),color-mix(in srgb,var(--cc) 40%,#000));animation:anIn .6s cubic-bezier(.2,.9,.3,1) both}
div.an::after{content:'';position:absolute;top:0;bottom:0;left:-40%;width:30%;transform:skewX(-18deg);pointer-events:none;background:linear-gradient(90deg,transparent,#ffffff55,transparent);animation:anShine 1s ease .9s both}
.an-hd{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 14px;font:700 13px var(--sans);background:#0003}
.an-off{font:900 14px var(--num);letter-spacing:.18em;padding:2px 10px;border:2px solid #fff;border-radius:4px;animation:anStamp .45s cubic-bezier(.3,1.6,.5,1) .55s both}
.an-bd{display:flex;align-items:center;gap:14px;padding:10px 14px}
.an-shirt{width:104px;flex:none;filter:drop-shadow(0 6px 12px #0006);animation:anShirt .8s cubic-bezier(.2,.9,.3,1) .2s both}
.an-tx{display:flex;flex-direction:column;gap:3px;min-width:0}
.an-tx small{font-size:12px;letter-spacing:.2em;opacity:.8}
.an-tx b{font:800 24px/1.15 var(--sans);overflow-wrap:anywhere}
.an-tx span{font-size:13px;opacity:.9}
.an-ft{display:flex;gap:6px 16px;flex-wrap:wrap;padding:8px 14px 12px;font-size:13px;border-top:1px solid #ffffff33}
.an-ft b{font-family:var(--num);font-size:16px}
.an-rp{padding:10px 12px;border:1px solid var(--edge);border-radius:10px;background:var(--sub);font-size:13.5px;animation:anIn .5s ease 1.1s both}
.an-rp b{color:var(--chalk)} .an-rp small{color:var(--dim);margin-left:6px} .an-rp p{margin:4px 0 0}
@keyframes anIn{from{opacity:0;transform:translateY(14px)}}
@keyframes anShirt{from{opacity:0;transform:translateY(24px) rotate(-8deg) scale(.8)}}
@keyframes anStamp{from{opacity:0;transform:scale(2.4) rotate(-12deg)}}
@keyframes anShine{to{left:130%}}
html.calm *,html.calm *::before,html.calm *::after{animation:none!important;transition:none!important}
html.calm .var{display:none}
