:root{color-scheme:dark;--bg:#080d18;--panel:#101827;--line:#35445f;--text:#edf4ff;--muted:#b8c5d9;--gold:#f1d38e;--blue:#8fc6ee;--danger:#f19a91}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:15px/1.65 system-ui,"Yu Gothic",sans-serif}button,select{font:inherit}button{cursor:pointer;min-height:44px;padding:10px 16px;border:1px solid var(--line);border-radius:8px;background:#17243a;color:var(--text)}button:disabled{cursor:default;opacity:.5}a{color:inherit;text-decoration:none}a:hover{text-decoration:underline}:is(button,a,select):focus-visible{outline:3px solid var(--gold);outline-offset:3px}button:hover:not(:disabled){filter:brightness(1.15)}[hidden]{display:none!important}header,footer{max-width:1320px;margin:auto;padding:22px 40px;display:flex;align-items:center;justify-content:space-between;gap:16px}.brand{display:flex;align-items:center;gap:12px}.brand>span{color:var(--gold);font-size:30px}.quiet{background:transparent;border-color:transparent;color:var(--muted)}main{max-width:1280px;margin:auto;padding:28px 24px 48px}.intro{display:flex;align-items:center;justify-content:space-between;padding-bottom:32px}.eyebrow{color:var(--gold);font-size:12px;letter-spacing:.15em;margin:0 0 12px}h1{font:500 64px/1.2 serif;letter-spacing:.13em;margin:0}h1 span{font:14px system-ui;letter-spacing:.2em;margin-left:20px;color:var(--muted)}.tagline{font-size:20px;margin:18px 0 0}.intro-note{border-left:1px solid var(--line);padding-left:30px;color:var(--muted)}.setup{display:grid;grid-template-columns:1fr 1fr 1fr 1.25fr;gap:16px;padding:22px;border:1px solid var(--line);border-radius:12px;background:var(--panel);margin-bottom:24px}label{display:flex;flex-direction:column;gap:6px;font-size:13px;color:var(--muted);min-width:0}select{width:100%;min-height:44px;padding:8px;border:1px solid var(--line);border-radius:7px;background:var(--bg);color:var(--text)}.setup-rule{display:flex;flex-direction:column;justify-content:center;font-size:13px;padding-left:16px;border-left:1px solid var(--line);color:var(--muted)}.setup-rule strong{color:var(--gold);font-weight:500;font-size:15px}.setup-rule small{font-size:12px}.start-actions{display:flex;gap:12px;grid-column:1/3}.primary{background:var(--gold);border-color:var(--gold);color:#101827;font-weight:650}.primary span{margin-left:15px}.secondary{background:transparent}.set-note{grid-column:3/5;margin:8px 0;align-self:center;font-size:13px;color:var(--muted)}.play-layout{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(280px,1fr);gap:24px;align-items:start}.arena,.player,.decision,.hint-card{background:var(--panel);border:1px solid var(--line);border-radius:12px}.arena{overflow:hidden;background:radial-gradient(ellipse at 50% 50%,#1b303b,#101827 74%)}.panel-heading{display:flex;justify-content:space-between;padding:16px 22px;border-bottom:1px solid var(--line);font-size:13px;color:var(--muted)}.turn-heading{padding:20px 22px 0}.turn-heading .eyebrow{margin-bottom:4px}.turn-heading h2{font:500 26px/1.4 serif;margin:0 0 8px}.turn-heading>p:last-child{color:var(--muted);font-size:14px;margin:0;min-height:46px}.board{position:relative;aspect-ratio:700/620;max-width:700px;margin:0 auto;width:100%;isolation:isolate}.board svg{position:absolute;inset:0;width:100%;height:100%}.path{stroke:#435a68;stroke-width:2}.path.lost{opacity:.1;stroke-dasharray:3 8}.move-path{stroke:var(--gold);stroke-width:5;stroke-dasharray:9 5;fill:none}.move-path.cpu{stroke:var(--blue)}.cell{position:absolute;transform:translate(-50%,-50%);width:52px;height:52px;min-height:44px;padding:0;border-radius:50%;border:1px solid #577181;background:#142633;color:var(--muted);font-size:12px;line-height:1.1;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:3px;z-index:2}.cell:disabled{opacity:1}.cell .piece{font-size:19px}.cell.p1{background:#3d3930;color:var(--gold);border-color:var(--gold)}.cell.p2{background:#233e50;color:var(--blue);border-color:var(--blue)}.cell.available{border:2px dashed #b6dbe5;box-shadow:0 0 0 4px #8fc6ee0b;color:var(--text)}.cell.selected{border:3px solid var(--gold);box-shadow:0 0 0 4px #f1d38e20}.cell.destination{background:#655431;color:#fff0bc;border:2px solid var(--gold)}.cell.cut{background:#523739;color:#ffdad3;border:3px double var(--danger)}.cell.gone{background:transparent;border-color:transparent;color:#78909d;opacity:.52}.cell.recent{box-shadow:0 0 0 3px #b8c5d933}.cell.cpu-target{border:3px double var(--blue);box-shadow:0 0 0 5px #8fc6ee20;animation:signal 1s ease-in-out infinite alternate}.cell:focus-visible{z-index:5}.cell .dash-label{font-size:12px;color:var(--gold)}.legend{margin:0 12px 14px;text-align:center;color:var(--muted);font-size:12px;display:flex;justify-content:center;flex-wrap:wrap;gap:10px}.controls{padding:18px 22px;border-top:1px solid var(--line)}.steps{display:flex;gap:12px;color:var(--muted);font-size:13px}.steps .active{color:var(--gold);text-decoration:underline;text-underline-offset:6px}.impact{min-height:48px;font-size:14px;color:var(--muted);margin:14px 0}.confirm-row{display:flex;gap:12px}.confirm-row .primary{flex:1}.receipt{margin:0;padding:16px 22px;background:#080d1866;border-top:1px solid var(--line);font-size:13px;color:var(--muted)}.dashboard{display:flex;flex-direction:column;gap:16px;min-width:0}.scoreboard{display:grid;grid-template-columns:1fr 1fr;gap:12px}.player{padding:18px;display:flex;flex-direction:column;gap:6px}.player.active{border-color:currentColor}.p1{color:var(--gold)}.p2{color:var(--blue)}.player>span{font-size:13px}.player strong{font-size:38px;line-height:1.3;font-weight:500}.player small{font-size:12px;color:var(--muted)}.score-note{color:var(--muted);font-size:12px;margin:-6px 0 0}.decision{padding:22px}.decision h2{font:500 25px/1.5 serif;margin:6px 0 12px}.decision>p:not(.eyebrow){color:var(--muted);font-size:14px;margin:0}.hint-card{padding:20px;background:transparent}.hint-card>span{color:var(--gold);font:20px serif}.hint-card p{margin:12px 0 0;font-size:14px;color:var(--muted)}#result-actions{display:grid;gap:10px;margin-top:18px}.result-home-button{text-align:center;font-size:12px;color:var(--muted);text-decoration:underline;min-height:44px;padding:10px}.history{border-top:1px solid var(--line);padding-top:12px}.history summary{color:var(--muted);font-size:14px;cursor:pointer;min-height:44px;padding-top:8px}.history ol{padding:0;margin:0;list-style:none;max-height:280px;overflow:auto;font-size:13px}.history li{padding:8px 0;border-bottom:1px solid #35445f55}.history li:first-child{color:var(--gold)}.compact-score{display:none}.rules-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:32px;padding:36px 0 0;margin-top:32px;border-top:1px solid var(--line)}.rules-strip b{font-size:12px;letter-spacing:.08em;color:var(--gold);font-weight:400}.rules-strip h3{font:500 21px/1.5 serif;margin:12px 0}.rules-strip p{color:var(--muted);font-size:14px;margin:0}footer{border-top:1px solid var(--line);font-size:12px;color:var(--muted)}dialog{border:1px solid var(--line);border-radius:14px;background:var(--panel);color:var(--text);max-width:590px;width:calc(100% - 32px);max-height:85vh;padding:30px;line-height:1.9}dialog::backdrop{background:#030712d9}dialog h2{font:26px/1.5 serif}dialog ol{padding-left:22px}dialog li{margin:12px 0}dialog p,dialog li{font-size:14px}.close{float:right;background:transparent;font-size:22px;padding:0;width:44px}.practice-banner{border:1px solid var(--gold);border-radius:12px;padding:20px;margin-bottom:24px;background:#222b35}.practice-banner p{margin:8px 0 12px}.practice-banner b{color:var(--gold)}@keyframes signal{to{box-shadow:0 0 0 5px #8fc6ee44}}
@media(max-width:1050px){.intro-note{display:none}.setup{grid-template-columns:1fr 1fr}.set-note{grid-column:1/3}.play-layout{grid-template-columns:minmax(0,1.5fr) minmax(260px,1fr);gap:16px}.cell{width:44px;height:44px}.cell .piece{font-size:17px}}
@media(max-width:800px){.play-layout{grid-template-columns:1fr}.board{max-width:620px}.compact-score{display:flex;justify-content:space-between;gap:8px;padding:10px 22px 0;color:var(--muted);font-size:12px}.dashboard .scoreboard,.score-note{display:none}.dashboard{gap:12px}.hint-card{display:none}.rules-strip{gap:20px}.turn-heading h2{font-size:23px}}
@media(max-width:540px){body{font-size:14px}header,footer{padding:14px 16px}main{padding:22px 12px 30px}.intro{padding:0 4px 24px}h1{font-size:48px}h1 span{font-size:12px;margin-left:14px}.tagline{font-size:17px}.eyebrow{font-size:10px}.setup{padding:16px;gap:12px}.setup-rule{padding-left:10px}.setup-rule strong{font-size:13px}.setup-rule small{font-size:10px}.start-actions{gap:8px}.start-actions button{padding:10px 12px;font-size:13px}.set-note{font-size:12px;margin:0}.panel-heading{padding:12px 16px;font-size:12px}.turn-heading{padding:16px 16px 0}.turn-heading h2{font-size:22px}.turn-heading>p:last-child{font-size:13px;min-height:44px}.compact-score{padding:8px 16px 4px;font-size:11px}.cell{width:44px;height:44px;font-size:10px;gap:2px}.cell .piece{font-size:16px}.cell .dash-label{font-size:10px}.legend{font-size:10px;gap:8px}.controls{padding:14px 16px}.steps{font-size:12px;gap:10px}.impact{font-size:13px;min-height:44px}.confirm-row{gap:8px}.confirm-row button{font-size:13px;padding:10px}.receipt{padding:14px 16px;font-size:12px}.decision{padding:18px}.decision h2{font-size:23px}.rules-strip{grid-template-columns:1fr;gap:22px}.rules-strip h3{margin:5px 0}.rules-strip b{font-size:11px}footer{font-size:10px;flex-wrap:wrap}dialog{padding:22px}.history ol{font-size:12px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;scroll-behavior:auto!important}}