:root{--bg: #0b0f14;--surface: #141a21;--surface-2: #1c242d;--line: #2a3440;--fg: #eef3f7;--muted: #9aa7b4;--dim: #6b7785;--accent: #c6f432;--accent-fg: #0b0f14;--accent-soft: rgba(198, 244, 50, .12);--fifa: #5aa9ff;--pool: #36d39a;--darts: #ff8a5c;--win: #36d39a;--loss: #ff6b6b;--draw: #f5c451;--warn: #f5c451;--danger: #ff5c5c;--radius: 14px;--tabbar-h: 64px;color-scheme:dark}*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{margin:0;background:var(--bg);color:var(--fg);font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;font-size:16px;line-height:1.4;-webkit-tap-highlight-color:transparent}button,input{font:inherit;color:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.45}:focus-visible{outline:2px solid var(--accent);outline-offset:2px}code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.9em}h1,h2,h3{margin:0;line-height:1.15}.muted{color:var(--muted)}.small{font-size:13px}.center{text-align:center}.tbd{color:var(--dim);font-style:italic}.app{min-height:100dvh}.topbar{position:sticky;top:0;z-index:10;display:flex;align-items:center;gap:10px;padding:calc(10px + env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) 10px max(16px,env(safe-area-inset-left));background:#0b0f14f0;border-bottom:1px solid var(--line);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.brand{font-weight:800;letter-spacing:.02em;text-transform:uppercase;font-size:15px;color:var(--accent)}.brand-big{font-size:18px;text-align:center;margin-bottom:8px}.live{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;padding:2px 8px;border-radius:99px}.live-live{color:var(--win);background:#36d39a1f}.live-live:before{content:"●";margin-right:4px}.live-offline{color:var(--loss);background:#ff6b6b1f}.live-connecting{color:var(--muted)}.me{margin-left:auto;text-align:right;display:flex;flex-direction:column;align-items:flex-end}.me-name{font-weight:700}.link-btn{background:none;border:0;padding:4px 0;color:var(--muted);text-decoration:underline;font-size:13px;min-height:28px}.content{max-width:720px;margin:0 auto;padding:16px max(16px,env(safe-area-inset-right)) calc(var(--tabbar-h) + 32px + env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left))}.page-title{font-size:26px;font-weight:800;margin:4px 0 6px}.legend{margin:0 0 14px}.page-foot{text-align:center;margin-top:32px}section+section{margin-top:24px}.banner{padding:8px 16px;font-size:13px;text-align:center}.banner-err{background:#ff6b6b26;color:var(--loss)}.tabbar{position:fixed;left:0;right:0;bottom:0;z-index:10;display:grid;grid-template-columns:repeat(4,1fr);padding-bottom:env(safe-area-inset-bottom);background:#0f141af7;border-top:1px solid var(--line)}.tab{height:var(--tabbar-h);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;background:none;border:0;color:var(--muted)}.tab-icon{font-size:20px;line-height:1;filter:grayscale(1);opacity:.7}.tab-label{font-size:12px;font-weight:600}.tab.active{color:var(--accent)}.tab.active .tab-icon{filter:none;opacity:1}.stack{display:grid;gap:10px}.stack.compact{gap:8px;margin-top:12px}.card{display:block;width:100%;text-align:left;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:12px 14px}.match.is-up{border-color:#3a4757;background:var(--surface-2)}.match.is-done{background:var(--surface);opacity:.88}.match.is-mine{box-shadow:inset 4px 0 0 var(--accent)}.match.my.is-up{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent-soft) inset}.match:active{transform:scale(.99)}.match-head{display:flex;align-items:center;justify-content:space-between;gap:8px}.stage{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}.match-foot{display:flex;align-items:center;gap:10px;margin-top:10px;flex-wrap:wrap}.score{font-variant-numeric:tabular-nums;font-weight:700}.hint{font-size:12px;color:var(--dim);margin-left:auto}.badge{display:inline-flex;align-items:center;gap:4px;font-size:13px;font-weight:700;padding:3px 10px;border-radius:99px;border:1px solid currentColor;white-space:nowrap}.badge-fifa{color:var(--fifa);background:#5aa9ff1a}.badge-pool{color:var(--pool);background:#36d39a1a}.badge-darts{color:var(--darts);background:#ff8a5c1a}.sides{display:grid;gap:4px;margin-top:10px}.side{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:18px;font-weight:600}.side.me .side-name{color:var(--accent)}.side.won .side-name{font-weight:800}.side.lost .side-name{color:var(--dim)}.side.tbd{font-size:15px;font-weight:500}.mark{font-size:11px;font-weight:800;letter-spacing:.08em;padding:2px 6px;border-radius:6px}.mark-win{color:var(--accent-fg);background:var(--win)}.mark-draw{color:var(--accent-fg);background:var(--draw)}.vs{display:flex;align-items:baseline;gap:8px;margin-top:8px}.vs-word{color:var(--muted);font-size:15px}.vs-name{font-size:24px;font-weight:800}.vs-name.tbd{font-size:18px;font-weight:600}.pill{font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;padding:3px 9px;border-radius:99px}.pill-up{color:var(--fg);background:#2c3946}.pill-done{color:var(--muted);background:#222b35}.pill-win{color:var(--accent-fg);background:var(--win)}.pill-loss{color:#fff;background:#b8424a}.pill-draw{color:var(--accent-fg);background:var(--draw)}.journey{margin:0 0 14px;font-weight:700;font-size:15px;padding:10px 12px;border-radius:10px;background:var(--surface);border:1px solid var(--line)}.tone-win{color:var(--win);border-color:#36d39a66}.tone-out{color:var(--muted)}.tone-warn{color:var(--warn);border-color:#f5c45166}.champion{text-align:center;padding:20px 16px;margin-bottom:20px;border-radius:var(--radius);background:linear-gradient(160deg,#c6f43238,#c6f4320a);border:1px solid var(--accent)}.champion-trophy{font-size:44px;line-height:1}.champion-label{margin-top:6px;font-size:13px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--accent)}.champion-name{font-size:34px;font-weight:900;margin-top:2px}.final-score{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:10px;padding:14px;margin-bottom:10px;border-radius:var(--radius);background:var(--surface-2);border:1px solid var(--line)}.fs-name{font-weight:800;font-size:17px}.fs-name:last-child{text-align:right}.fs-name.me{color:var(--accent)}.fs-num{font-size:28px;font-weight:900;font-variant-numeric:tabular-nums}.group{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:14px}.group+.group{margin-top:16px}.section-head{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:8px}.section-head h2{font-size:20px;font-weight:800}.round-title{font-size:14px;font-weight:800;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin:0 0 10px}.table{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}.table th{font-size:12px;color:var(--dim);font-weight:700;padding:4px 2px;text-align:center}.table td{padding:9px 2px;text-align:center;border-top:1px solid var(--line);font-size:15px}.table .left{text-align:left}.table .pos{width:30px;color:var(--muted);font-weight:700}.table .pts{font-weight:900;font-size:17px}.tname{font-weight:700;margin-right:6px}.row-me .tname{color:var(--accent)}.row-qualified td.pos{box-shadow:inset 3px 0 0 var(--win)}.row-eliminated td{color:var(--dim)}.row-eliminated .tname{color:var(--dim);text-decoration:line-through}.tag{display:inline-block;font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;padding:1px 6px;border-radius:5px;vertical-align:2px}.tag-q{color:var(--accent-fg);background:var(--win)}.tag-out{color:var(--fg);background:#4a2a2e}.tag-warn{color:var(--accent-fg);background:var(--warn)}.tiebreak{margin-top:12px;padding:12px;border-radius:12px;border:1px solid rgba(245,196,81,.5);background:#f5c45112}.tiebreak-title{margin:0 0 4px;font-weight:800;color:var(--warn)}.place{font-size:12px;font-weight:900;background:var(--accent);color:var(--accent-fg);border-radius:6px;padding:1px 6px;margin-right:4px}.round-arrow{text-align:center;color:var(--dim);font-size:22px;margin:10px 0}.bracket .round+.round-arrow+.round{margin-top:0}@media (min-width: 900px){.content{max-width:1100px}.bracket{display:grid;grid-template-columns:1fr auto 1fr auto 1fr;align-items:center;gap:8px}.round-arrow:before{content:"→"}.round-arrow{font-size:0}.round-arrow:before{font-size:22px}}.picker{max-width:520px;margin:0 auto;padding:calc(32px + env(safe-area-inset-top)) 16px 32px}.picker h1{text-align:center;font-size:30px;font-weight:900;margin-bottom:20px}.picker-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.picker-btn{min-height:60px;border-radius:var(--radius);border:1px solid var(--line);background:var(--surface-2);font-size:19px;font-weight:700}.picker-btn:active{background:var(--accent);color:var(--accent-fg)}.center-box{max-width:420px;margin:48px auto;text-align:center;display:grid;gap:14px}.big-emoji{font-size:48px}.btn{min-height:52px;padding:0 18px;border-radius:12px;border:1px solid var(--line);background:var(--surface-2);font-weight:700;font-size:16px}.btn-primary{background:var(--accent);color:var(--accent-fg);border-color:var(--accent)}.btn-danger{background:var(--danger);color:#fff;border-color:var(--danger)}.btn-ghost{background:none;border-color:transparent;color:var(--muted)}.btn-block{width:100%;margin-top:10px}.btn-row{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}.choices{display:grid;gap:10px;grid-template-columns:1fr 1fr;margin:14px 0 6px}.choices.three{grid-template-columns:1fr}.choice{min-height:56px;border-radius:12px;border:2px solid var(--line);background:var(--surface-2);font-size:17px;font-weight:700;padding:6px 10px}.choice.selected{border-color:var(--accent);background:var(--accent-soft);color:var(--accent)}.choice-draw.selected{border-color:var(--draw);background:#f5c4511f;color:var(--draw)}.field{display:grid;gap:6px;margin-top:12px}.field span{font-size:13px;color:var(--muted);font-weight:600}.field input{min-height:48px;padding:0 12px;border-radius:10px;border:1px solid var(--line);background:var(--bg);font-size:17px}.error{color:var(--loss);font-weight:600}.sheet-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:30;background:#0009;display:flex;align-items:flex-end;justify-content:center}.sheet{width:100%;max-width:560px;max-height:92dvh;overflow-y:auto;background:var(--surface);border:1px solid var(--line);border-bottom:0;border-radius:20px 20px 0 0;padding:16px max(16px,env(safe-area-inset-right)) calc(20px + env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left))}@media (min-width: 600px){.sheet-backdrop{align-items:center}.sheet{border-radius:20px;border-bottom:1px solid var(--line)}}.sheet-head{display:flex;align-items:center;justify-content:space-between;gap:10px}.sheet-head h2{font-size:20px;font-weight:800}.sheet-meta{display:flex;align-items:center;gap:10px;margin-top:8px}.icon-btn{width:44px;height:44px;border-radius:99px;border:0;background:var(--surface-2);font-size:18px}.confirm-title{font-size:18px;font-weight:800;margin:16px 0 8px}.warn-box{padding:12px;border-radius:12px;border:1px solid rgba(245,196,81,.5);background:#f5c45114;font-size:15px}.warn-box ul{margin:8px 0 0;padding-left:20px}.empty{margin:16px 0;color:var(--muted)}.info{display:grid;grid-template-columns:auto 1fr;gap:6px 14px;margin:14px 0;font-size:14px}.info dt{color:var(--muted)}.info dd{margin:0}.danger-zone{margin-top:12px;padding-top:14px;border-top:1px solid var(--line)}.danger-zone h3{font-size:16px;color:var(--danger)}.toast{position:fixed;z-index:40;left:50%;transform:translate(-50%);bottom:calc(var(--tabbar-h) + 14px + env(safe-area-inset-bottom));max-width:calc(100% - 32px);padding:12px 16px;border-radius:12px;font-weight:700;font-size:15px;box-shadow:0 8px 24px #00000080;background:var(--win);color:var(--accent-fg)}.toast-warn{background:var(--warn)}.toast-err{background:var(--loss);color:#fff}.help-btn{width:36px;height:36px;flex:none;border-radius:99px;border:1px solid var(--line);background:var(--surface-2);font-weight:800;font-size:17px;color:var(--muted)}.me{margin-left:0}.topbar .live{margin-right:auto}.rules{margin:14px 0 4px;padding-left:20px;display:grid;gap:10px;font-size:15px}.rules b{color:var(--fg)}.guide-link{display:flex;align-items:center;justify-content:center;text-decoration:none;color:var(--fg)}a.btn{display:flex;align-items:center;justify-content:center;text-decoration:none}a.btn-primary{color:var(--accent-fg)}.guide{max-width:680px;margin:0 auto;padding:calc(16px + env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) calc(32px + env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left))}.guide .back{display:inline-block;margin-bottom:14px}.guide-sec{margin-top:20px;padding:16px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius)}.guide-sec h2{font-size:20px;font-weight:800}.guide-sec h3{font-size:16px;font-weight:800;color:var(--accent);margin:20px 0 6px}.guide-sec ol,.guide-sec ul:not(.rules){margin:0;padding-left:22px;display:grid;gap:6px;font-size:15px;color:var(--muted)}.guide-sec li b,.guide-sec li i{color:var(--fg)}.guide-sec .warn-box{margin:10px 0 0}.guide>.btn{margin-top:24px}.guide-top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}.guide-top .back{margin-bottom:0}.lang-switch{display:flex;gap:6px}.lang-btn{min-height:40px;padding:0 10px;border-radius:10px;border:1px solid var(--line);background:var(--surface-2);font-size:14px;font-weight:800;color:var(--muted)}.lang-btn span{font-size:20px;vertical-align:-3px}.lang-btn.active{border-color:var(--accent);color:var(--accent);background:var(--accent-soft)}
