:root{color-scheme:dark;--bg:#080c14;--ink:#f1f4fa;--muted:#8a9aaf;--gold:#f8c976;--cyan:#60e4ed;--line:#ffffff16;font-family:Inter,Arial,sans-serif}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);min-height:100svh}button,a,input{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;color:inherit;border:0}button:disabled{cursor:default;opacity:.45}button:focus-visible,a:focus-visible,summary:focus-visible,input:focus-visible{outline:3px solid var(--cyan);outline-offset:5px}[hidden]{display:none!important}.ambient{position:fixed;inset:0;pointer-events:none;background:radial-gradient(ellipse at 80% 25%,#17415155,transparent 48%),radial-gradient(ellipse at 15% 70%,#70471922,transparent 45%);z-index:-1}main{max-width:1060px;margin:auto;padding:0 36px}nav{display:flex;align-items:center;justify-content:space-between;height:96px;border-bottom:1px solid var(--line);gap:20px}nav>div{display:flex;gap:20px;align-items:center}a{color:inherit;text-decoration:none}.brand{font-size:13px;font-weight:900;letter-spacing:1.2px}.brand span{color:var(--gold)}.back,.icon-button{font-size:12px;color:var(--muted)}.icon-button{background:transparent;border:1px solid var(--line);border-radius:30px;padding:10px 13px;min-height:40px}.screen{position:relative}.eyebrow{font-size:11px;letter-spacing:2.3px;font-weight:800;color:var(--gold)}#home{display:grid;grid-template-columns:1fr 1fr;padding-top:54px;gap:0 28px}.hero-copy{z-index:2}h1{font-size:clamp(68px,9vw,110px);letter-spacing:-6px;line-height:.9;margin:26px 0;font-weight:950}h1 span{display:block;color:var(--gold);font-size:1.45em;letter-spacing:-9px}.intro{font-size:26px;font-weight:700;line-height:1.25;margin:28px 0 14px}.sub{color:var(--muted);font-size:14px;line-height:1.7}.hero-orb{position:relative;min-height:405px;display:grid;place-items:center;perspective:800px;isolation:isolate}.hero-orb:before{content:'';position:absolute;width:300px;height:300px;border-radius:50%;background:#279dbe22;filter:blur(45px)}.orb-core{width:230px;height:230px;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;background:radial-gradient(circle at 35% 24%,#528394,#173448 30%,#0a1321 65%,#000);border:1px solid #6ef0ff66;box-shadow:inset -14px -14px 35px #000,inset 4px 3px 25px #7eeeff55,0 0 80px #28b1c522;transform:rotate(-12deg);animation:float 5s ease-in-out infinite}.orb-core span{font-size:96px;font-weight:900;letter-spacing:-7px;color:var(--gold);text-shadow:2px 4px 0 #846238,0 4px 20px #eac07144}.orb-core small{font-size:10px;letter-spacing:5px;color:var(--muted)}.orb-ring{position:absolute;width:330px;height:330px;border:3px solid #f8c976bb;border-radius:50%;box-shadow:0 0 18px #f8c97644,inset 0 0 8px #f8c97644;transform:rotateX(68deg) rotateZ(-24deg);animation:orbit 12s ease-in-out infinite}.r2{width:350px;height:350px;border-color:#60e4ed88;transform:rotateY(68deg) rotateZ(24deg);animation:orbit-two 16s ease-in-out infinite}.orb-label{position:absolute;background:#101b28d9;padding:9px 13px;border:1px solid #ffffff22;border-radius:4px;letter-spacing:2px;font-size:9px;font-weight:800;box-shadow:0 10px 35px #0006}.label-one{top:36px;left:25px}.label-two{right:0;top:190px;color:var(--cyan)}.label-three{bottom:40px;left:20px}.entry{grid-column:1/-1;width:100%;max-width:600px;margin:26px auto 0}.primary{width:100%;display:flex;align-items:center;justify-content:space-between;gap:18px;min-height:64px;padding:18px 24px;border-radius:12px;background:linear-gradient(125deg,#ffe1a6,#e8ae52);color:#201609;font-size:14px;font-weight:900;letter-spacing:1px;box-shadow:0 8px 28px #b57c2928;transition:transform .15s,filter .15s}.primary:hover{filter:brightness(1.08);transform:translateY(-2px)}.primary span{font-size:26px}.secondary{background:#13202d;border:1px solid #ffffff20;border-radius:12px;padding:17px 20px;font-size:14px;font-weight:700;min-height:52px}.entry>.secondary{margin:12px 0;width:100%;display:flex;align-items:center;justify-content:space-between;gap:12px}.secondary span{font-size:11px;font-weight:400;color:var(--muted)}.home-records{display:flex;padding:24px 0;border-bottom:1px solid var(--line);gap:40px}.home-records>div{flex:1}.home-records span{display:block;color:var(--muted);font-size:12px;margin-bottom:9px}.home-records strong{font-size:26px}.history{font-size:12px;color:var(--muted);padding:20px 0}.history summary{cursor:pointer}.history ol{padding-left:20px;line-height:2}.fine{font-size:11px;color:var(--muted);line-height:1.6}.challenge-banner{border:1px solid #60e4ed44;padding:18px;background:#60e4ed0c;border-radius:12px;margin-bottom:16px;line-height:1.6;font-size:14px}footer{border-top:1px solid var(--line);margin:28px 0 0;padding:24px 0;font-size:10px;line-height:1.8;color:#718297}.play-screen{max-width:650px;margin:auto;padding-top:28px}.match-top{display:flex;justify-content:space-between;align-items:center;color:var(--gold);font-size:11px;font-weight:800;letter-spacing:1px}.text-button{background:transparent;color:var(--muted);font-size:12px;padding:13px 8px;min-height:44px}.scoreboard{display:grid;grid-template-columns:1fr 110px 1fr;align-items:center;margin:10px 0 26px}.scoreboard>div>span{display:block;font-size:9px;letter-spacing:1.2px;color:var(--muted)}.scoreboard>div>strong{font-size:38px;letter-spacing:-1px;display:block;margin-top:8px}.rival-score{text-align:right}.scoreboard .clock{position:relative;height:110px;display:flex;flex-direction:column;justify-content:center;align-items:center}.clock svg{position:absolute;width:100%;height:100%;transform:rotate(-90deg)}.clock circle{fill:none;stroke:#ffffff10;stroke-width:3}.clock #clock-ring{stroke:var(--gold);stroke-dasharray:283;stroke-dashoffset:0;stroke-linecap:round;transition:stroke-dashoffset .1s linear}.scoreboard .clock strong{font-size:34px;margin:0}.scoreboard .clock span{font-size:8px;margin-top:3px}.round-progress{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.round-progress span{padding:10px 0;border-top:2px solid #ffffff15;color:#5c6c80;font-size:10px}.round-progress .active{border-color:var(--gold);color:var(--gold)}.round-progress .done{border-color:var(--cyan);color:var(--cyan)}.race{padding:15px 0 0}.race>div{display:flex;gap:12px;align-items:center;margin:8px 0;font-size:10px}.race span{min-width:40px}.race i{flex:1;height:4px;border-radius:10px;background:#ffffff10;overflow:hidden}.race b{display:block;height:100%;width:0;background:var(--gold);transition:width .2s}.race>div:nth-child(2) b{background:var(--cyan)}.race small{min-width:30px;text-align:right;color:var(--muted)}.race p{font-size:9px;color:var(--muted);margin:8px 0}.instructions{text-align:center;margin:26px 0 16px;min-height:100px}.instructions .eyebrow{font-size:9px;color:var(--muted);margin:0 0 10px}.instructions h2{font-size:24px;line-height:1.2;margin:0}.instructions #feedback{height:18px;margin:8px 0 0;font-size:12px;color:var(--cyan)}.arena{height:280px;display:grid;place-items:center;touch-action:manipulation}.signal{width:220px;height:220px;border-radius:50%;border:1px solid #e2bd7155;background:radial-gradient(circle at 35% 25%,#44556b,#172332 55%,#09111a);box-shadow:inset 0 0 35px #0008,0 16px 40px #0008;display:flex;align-items:center;justify-content:center;flex-direction:column;font-size:22px;font-weight:900;color:#a0aec0;user-select:none}.signal.ready{background:radial-gradient(circle at 35% 25%,#e5ffff,#68ede9 25%,#13758c 80%);color:#05222c;border-color:var(--cyan);box-shadow:0 0 60px #60e4ed55,inset 0 -16px 30px #05334055}.signal.penalty{border-color:#fa7880;color:#fa7880}.signal small{font-size:10px;font-weight:500;margin-top:9px}.arena.grid{grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);gap:10px;width:280px;margin:auto}.tile{height:100%;width:100%;background:linear-gradient(135deg,#1d2c40,#101925);border:1px solid #ffffff15;border-radius:13px;box-shadow:inset 0 1px 0 #ffffff15,0 5px 12px #0004;font-size:31px;user-select:none}.tile.lit{background:linear-gradient(135deg,#ffe2ac,#d89e48);color:#241b0d;box-shadow:0 0 28px #f8c97644;border-color:var(--gold)}.tile.wrong{border-color:#fa7880}.tile:disabled{opacity:1}#stage-time{text-align:center;margin-top:17px}.countdown{font-size:110px;font-weight:900;color:var(--gold);text-shadow:0 0 55px #f8c97644}.result-screen{max-width:600px;margin:45px auto 0;text-align:center}.result-screen h2{font-size:30px;margin:14px 0}.result-number strong{display:block;font-size:110px;letter-spacing:-7px;line-height:1.2;color:var(--gold);text-shadow:0 10px 40px #f8c97622}.result-number span{font-size:10px;letter-spacing:2px;color:var(--muted)}.comparison{font-size:16px;line-height:1.5;min-height:24px}.breakdown{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:24px 0}.breakdown div{border:1px solid var(--line);border-radius:12px;padding:18px 8px;background:#111925}.breakdown span{font-size:11px;color:var(--muted);display:block}.breakdown strong{display:block;margin:9px 0;font-size:27px}.record-message{font-size:12px;color:var(--cyan);min-height:18px}.result-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:12px 0}#linkbox{display:block;text-align:left;font-size:12px;color:var(--muted);line-height:1.6;margin:12px 0}#link{display:block;width:100%;margin-top:7px;padding:14px;background:#111925;border:1px solid #ffffff30;border-radius:8px;color:var(--ink);font-size:12px}#notice{font-size:12px;line-height:1.5;color:var(--cyan)}.pulse{animation:pulse .35s ease-out}.confetti{position:fixed;pointer-events:none;top:-20px;width:7px;height:12px;background:var(--gold);z-index:5;animation:fall 1.8s ease-in forwards}@keyframes float{50%{transform:translateY(-12px) rotate(-8deg)}}@keyframes orbit{50%{transform:rotateX(60deg) rotateZ(16deg)}}@keyframes orbit-two{50%{transform:rotateY(58deg) rotateZ(-14deg)}}@keyframes pulse{50%{transform:scale(1.06)}}@keyframes fall{to{transform:translateY(100vh) rotate(500deg);opacity:0}}@media(max-width:650px){main{padding:0 22px}nav{height:72px}.brand{font-size:10px;letter-spacing:.7px}nav>div{gap:10px}.back{font-size:0}.back:before{content:'←';font-size:20px}#home{padding-top:34px;grid-template-columns:1fr 140px;gap:0}.hero-copy h1{font-size:60px;letter-spacing:-4px;margin:22px 0}.hero-copy h1 span{font-size:1.4em;letter-spacing:-6px}.hero-copy .intro{font-size:20px;margin-top:20px;width:240px}.sub{font-size:12px;width:260px}.hero-orb{min-height:260px;align-self:start;margin-top:20px;transform:translateX(-15px)}.orb-core{width:135px;height:135px}.orb-core span{font-size:60px;letter-spacing:-4px}.orb-core small{font-size:6px;letter-spacing:3px}.orb-ring{width:180px;height:180px;border-width:2px}.r2{width:195px;height:195px}.hero-orb:before{width:160px;height:160px}.orb-label{font-size:6px;letter-spacing:1px;padding:6px}.label-one{top:26px;left:0}.label-two{top:170px;right:-3px}.label-three{bottom:12px;left:12px}.entry{margin-top:20px}.primary{font-size:11px;padding:16px 18px}.entry>.secondary{font-size:12px}.entry>.secondary span{font-size:9px;max-width:120px;text-align:right}.home-records{padding:20px 0}.play-screen{padding-top:15px}.scoreboard{grid-template-columns:1fr 88px 1fr;margin-bottom:18px}.scoreboard .clock{height:88px}.scoreboard>div>strong{font-size:30px}.scoreboard>div>span{font-size:8px}.instructions{margin-top:22px;min-height:88px}.instructions h2{font-size:21px}.arena{height:260px}.arena.grid{height:260px;width:260px;gap:9px}.result-screen{margin-top:30px}.result-screen h2{font-size:25px}.result-number strong{font-size:96px}.result-actions .secondary{font-size:11px;padding:15px 10px}.breakdown{gap:8px}.breakdown div{padding:15px 5px}footer{margin-top:22px}.race{padding-top:8px}}@media(max-width:360px){main{padding:0 16px}#home{grid-template-columns:1fr 115px}.hero-orb{transform:translateX(-28px) scale(.85)}.hero-copy h1{font-size:53px}.arena.grid{height:240px;width:240px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}
@media(max-height:740px) and (max-width:650px){body:has(.play-screen:not([hidden])) nav{height:56px}.play-screen .scoreboard{margin:4px 0 12px}.play-screen .clock{height:76px}.play-screen .instructions{margin:14px 0 8px;min-height:76px}.play-screen .arena{height:220px}.play-screen .arena.grid{width:220px}.play-screen .signal{width:185px;height:185px}.play-screen #stage-time{margin-top:10px}}
.trainer-setup{margin:8px 0 18px;padding:15px;border:1px solid #f8c97633;border-radius:12px;font-size:12px;color:var(--gold)}.trainer-setup summary{cursor:pointer;min-height:24px}.trainer-setup p{color:var(--muted);line-height:1.6}.trainer-setup button{width:100%}.breakdown small{display:block;font-size:10px;color:var(--muted);line-height:1.6}.breakdown small+small{color:var(--cyan);margin-top:6px}.match-insight{padding:18px;border-radius:12px;background:#60e4ed0a;border:1px solid #60e4ed25;text-align:left;font-size:13px;line-height:1.6}.match-insight:empty{display:none}.trainer-share{width:100%;margin-bottom:8px;color:var(--gold);border-color:#f8c97644}

/* Duel quality: mobile targets, non-color cues, readable training. */
button{touch-action:manipulation;-webkit-tap-highlight-color:transparent;min-height:44px}.arena button{min-width:44px;min-height:44px}body{padding-bottom:env(safe-area-inset-bottom)}.home-records{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.tile.lit{outline:3px solid #ffe2ac;outline-offset:-5px}.tile.wrong{outline:3px dashed #fa7880;outline-offset:-5px}#learn .sub{width:auto;max-width:100%;font-size:15px;color:var(--ink)}#learn-feedback{min-height:44px;color:var(--cyan);line-height:1.5}#metric-progress{font-size:13px;line-height:1.6}#learn{max-width:650px;margin:24px auto}.fine,footer{color:#a7b8cb}@media(max-width:360px){.arena.grid{width:min(240px,100%)}.signal{max-width:100%}}

.no-effects *,.no-effects *:before,.no-effects *:after{animation:none!important;transition:none!important}.signal.ready{border-radius:28px}.tile.lit{font-weight:900;text-decoration:underline;text-underline-offset:5px}nav>div{flex-wrap:wrap;justify-content:flex-end}#learn .arena{margin-block:18px}@media(max-width:420px){nav{height:auto;min-height:86px;padding:12px 0}nav>div{gap:6px}.icon-button{font-size:10px;padding:8px}.brand{max-width:110px}}

.training-picker{margin:16px 0;padding:16px;border:1px solid #60e4ed33;border-radius:12px;line-height:1.6}.training-picker summary{cursor:pointer;min-height:44px}.training-picker .secondary{width:100%;margin:8px 0}.training-picker select{display:block;width:100%;min-height:44px;padding:10px;background:#142534;color:#f1f4fa;border:1px solid #8a9aaf;border-radius:8px}.series-score{padding:20px;background:#f8c97610;border:1px solid #f8c97644;border-radius:12px;line-height:1.6;color:var(--gold)}#series-reset{width:100%;margin-bottom:12px}

.coach-panel{margin:20px 0;padding:20px;border:1px solid #384a64;border-radius:18px;background:#111c2e;color:#eaf2ff}.coach-panel h3{margin-top:0}.coach-panel p,.coach-panel li{line-height:1.55}.coach-panel input,.ranking-panel select{display:block;width:100%;box-sizing:border-box;background:#09111e;color:#eaf2ff;border:1px solid #617187;border-radius:10px;min-height:48px;padding:12px;font:inherit;margin:10px 0}.ranking-scroll{overflow-x:auto}.ranking-panel table{width:100%;border-collapse:collapse;font-size:14px}.ranking-panel caption{text-align:left;padding:12px 0;color:#dce9ff}.ranking-panel th,.ranking-panel td{text-align:left;padding:12px 8px;border-bottom:1px solid #344257;overflow-wrap:anywhere}.ranking-own{background:#153640;color:#88eef0}.race-gap{color:#f8c976;font-size:13px!important}.coach-panel[hidden],#ranking-submit[hidden]{display:none}

/* A challenge has one primary path; optional modes remain accessible. */
.challenge-entry #challenge-options{margin-top:16px}body:not(.challenge-entry) #challenge-options{display:contents}#challenge-options>.secondary{margin:12px 0;width:100%;display:flex;justify-content:space-between;gap:12px}#send-reply{margin-bottom:12px}.challenge-entry #home{grid-template-columns:1fr}
#challenge-options summary{cursor:pointer;color:var(--muted,#a9bdcd);padding:12px 0}
.reply-inbox{margin-top:26px;border-top:1px solid #29404b;padding-top:20px}.reply-inbox h2{font-size:1.2rem}.reply-inbox ol{list-style:none;padding:0}.reply-inbox li{padding:18px 0;border-bottom:1px solid #29404b}.reply-inbox li strong{color:#f8c976}.reply-inbox li p{color:#a9bdcd}.reply-inbox a{display:block;text-decoration:none;text-align:center}.reply-inbox button{margin-top:10px}
.challenge-entry .hero-orb{display:none}.challenge-entry .hero-copy{padding-bottom:12px}.challenge-entry .intro{font-size:clamp(24px,5vw,36px)}

.social-panel{margin:18px 0;padding:18px;background:#101b28;border:1px solid #ffffff20;border-radius:14px}.social-panel summary{cursor:pointer;font-weight:700}.social-panel h2{font-size:21px}.social-panel label{display:block;font-size:13px;margin:14px 0 6px;color:#a9bdcd}.social-panel input:not([type=range]){display:block;width:100%;padding:14px;margin-top:8px;color:#f1f4fa;background:#080c14;border:1px solid #ffffff30;border-radius:8px;font:inherit}.social-panel .secondary{display:block;width:100%;margin-top:14px}.social-panel ol{padding-left:24px}.social-panel li{padding:10px 0}.social-panel li p{font-size:12px;color:#a9bdcd}.arena-leader{color:#f8c976;font-weight:700}#moments svg{width:100%;height:auto;display:block}#moment-time{width:100%;accent-color:#60e4ed}#moment-score{font-size:13px;color:#60e4ed}.challenge-entry #arena-create{display:none}#rivalries-list{list-style:none;padding:0}#rivalries-list details{padding:12px;border:1px solid #ffffff20;border-radius:10px}

/* Babylon arena: HTML keeps all hit targets and non-color cues. */
.duel-visual-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding:12px 0;border-bottom:1px solid var(--line);font-size:11px;color:#adbed0}.duel-visual-toolbar select{background:#122030;color:#f1f4fa;border:1px solid #42566c;border-radius:9px;min-height:44px;font:inherit;padding:8px 10px}.duel-visual-toolbar span{flex:1;min-width:120px}.duel-scene{position:absolute;inset:0;display:block;width:100%;height:100%;pointer-events:none;border-radius:22px;z-index:0}.duel-play-view{position:relative;isolation:isolate;border-radius:24px;overflow:hidden}.duel-play-view #arena{position:relative;z-index:1}.duel-3d-ready .duel-play-view{background:#07101b;box-shadow:0 0 0 1px #60e4ed2b,0 16px 45px #0006}.duel-3d-ready #arena .tile,.duel-3d-ready #arena .signal{background:transparent;box-shadow:none;color:#f3f8ff}.duel-3d-ready #arena .tile.lit,.duel-3d-ready #arena .tile.wrong,.duel-3d-ready #arena .signal.ready,.duel-3d-ready #arena .signal.penalty{color:#0c1724}.duel-3d-ready .hero-orb .orb-ring{visibility:hidden}.duel-3d-ready .hero-orb .orb-core{background:transparent;border:0;box-shadow:none;z-index:1;animation:none;transform:none}.duel-3d-ready .hero-orb .orb-label{z-index:2}.duel-3d-ready .result-number{position:relative;isolation:isolate;overflow:hidden;border-radius:24px;padding:24px 10px;min-height:210px}.duel-3d-ready .result-number>strong,.duel-3d-ready .result-number>span{position:relative;z-index:1;text-shadow:0 3px 18px #02060d,0 0 5px #02060d}.duel-3d-ready .result-number .duel-scene{opacity:.5}.duel-hit{animation:duel-hit .24s ease-out}@keyframes duel-hit{50%{box-shadow:0 0 0 2px #60e4ed88,0 0 24px #60e4ed22}}@media(max-width:650px){.duel-visual-toolbar{font-size:10px;gap:7px}.duel-scene{border-radius:16px}}

body:not(.duel-3d-ready) .duel-scene{opacity:0}


/* Keep mobile inputs readable without Safari focus zoom. */
@media(max-width:650px){input:not([type=range]),select{font-size:16px!important}nav{flex-wrap:wrap;gap:10px}.global-progress{overflow-wrap:anywhere}body:has(#play:not([hidden])) .global-progress,body:has(#play:not([hidden])) .duel-visual-toolbar,body:has(#play:not([hidden])) nav>a:not(.brand){display:none}body:has(#play:not([hidden])) nav{min-height:48px;height:auto;padding:6px 0}#arena button{-webkit-user-select:none;user-select:none;touch-action:manipulation}#recovery-status:empty{display:none}}

/* Put the main action in the first viewport instead of below a poster. */
#home{padding-top:24px}#home h1{display:flex;align-items:baseline;gap:18px;font-size:clamp(52px,7vw,90px);letter-spacing:-4px;margin:18px 0}#home h1 span{font-size:1em;letter-spacing:-4px}#home .hero-orb{min-height:230px}#home .intro{font-size:22px;margin:18px 0 10px}#home .entry{margin-top:12px}.entry>a[href="duel-games.html"]{margin:14px 0!important}
@media(max-width:650px){#home{padding-top:16px;grid-template-columns:minmax(0,1fr) 100px}#home h1{font-size:42px;letter-spacing:-2px;gap:10px}#home h1 span{letter-spacing:-2px}#home .intro{font-size:18px;width:auto;margin-top:12px}#home .sub{width:auto;font-size:12px}#home .hero-orb{min-height:160px;transform:translateX(-8px) scale(.72);margin-top:0}#home .entry{margin-top:8px}.challenge-entry #home{grid-template-columns:1fr}}
@media(max-width:420px){#home{grid-template-columns:minmax(0,1fr)}#home .hero-orb{display:none}}

#progress-window{display:block;width:100%;min-height:44px;padding:10px;background:#142534;color:#f1f4fa;border:1px solid #8a9aaf;border-radius:8px;font:inherit}
#connection-status{min-height:20px}