:root{color-scheme:dark;--bg:#10191c;--panel:#172226;--line:#304044;--muted:#9eafb0;--ink:#edf1e9;--accent:#c8dfb0;--p1:#7fc8c2;--p2:#e7b27c;font:15px/1.45 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink)}button,input,a{font:inherit}button,a{touch-action:manipulation}button{border:1px solid var(--line);border-radius:5px;background:#223034;color:var(--ink);padding:9px 14px;cursor:pointer;transition:background .15s,border-color .15s}button:hover:not(:disabled){background:#304246;border-color:#708a8b}button:disabled{opacity:.4;cursor:default}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--accent);outline-offset:3px}a{color:var(--ink)}[hidden]{display:none!important}.masthead{height:86px;padding:0 4vw;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:24px}.brand{text-decoration:none;font-weight:650;letter-spacing:.17em;font-size:14px;display:flex;gap:15px;align-items:center}.brand small{display:block;font-size:9px;color:var(--muted);letter-spacing:.3em;margin-top:3px}.five-dots{width:34px;height:34px;display:grid;grid-template-columns:repeat(3,8px);gap:3px;align-content:center}.five-dots i{width:8px;height:8px;border-radius:50%;background:#6bb68a}.five-dots i:nth-child(2){background:#ee8569}.five-dots i:nth-child(3){background:#d3ac6b}.five-dots i:nth-child(4){background:#bdc8d7}.five-dots i:nth-child(5){background:#71bde2}.connection{margin-left:auto;font-size:12px;color:var(--muted)}.quiet{background:transparent;color:var(--muted)}.primary{display:inline-flex;gap:28px;align-items:center;justify-content:center;background:var(--accent);border-color:var(--accent);color:#17231d;font-weight:650;padding:12px 20px;text-decoration:none;border-radius:5px}.primary:hover:not(:disabled){background:#d9ecc7;border-color:#d9ecc7}.quiet-link{display:inline-block;color:var(--muted);font-size:13px;text-underline-offset:5px;margin:18px}.eyebrow{font-size:10px;letter-spacing:.2em;font-weight:650;color:var(--accent)}#landing{max-width:1280px;min-height:calc(100vh - 86px);padding:9vh 6vw 30px;margin:auto;position:relative;display:grid;grid-template-columns:1.2fr 1fr;gap:30px;align-content:center}.intro h1{font:500 clamp(42px,5vw,72px)/1.08 Georgia,serif;letter-spacing:-.03em;margin:25px 0}.intro>p{max-width:460px;color:var(--muted);font-size:17px;line-height:1.7;margin-bottom:30px}.intro>.primary{min-width:220px;justify-content:space-between}#resume{display:block;margin-left:0}.cycle-art{position:relative;min-height:410px;align-self:center}.orbit{position:absolute;width:300px;height:300px;border:1px solid var(--line);border-radius:50%;left:50%;top:50%;transform:translate(-50%,-50%)}.cycle-center{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);text-align:center;font-size:11px;letter-spacing:.25em;color:var(--muted)}.cycle-center strong{font-size:20px;display:block;color:var(--ink);letter-spacing:.08em;margin-top:8px}.orb{position:absolute;width:95px;height:95px;border:1px solid currentColor;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:650;letter-spacing:.15em;background:var(--bg);z-index:1}.wood{color:#6bb68a}.fire{color:#ee8569}.earth{color:#d3ac6b}.metal{color:#bdc8d7}.water{color:#71bde2}.orb.wood{left:calc(50% - 47px);top:5px}.orb.fire{left:calc(50% + 100px);top:110px}.orb.earth{left:calc(50% + 45px);top:285px}.orb.metal{left:calc(50% - 140px);top:285px}.orb.water{left:calc(50% - 195px);top:110px}.landing-footer{grid-column:1/-1;display:flex;gap:30px;padding-top:50px;color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.1em}.landing-footer span:before{content:'◈';margin-right:10px;color:var(--accent)}#invite{margin-top:25px;max-width:500px}#invite label{font-size:12px;color:var(--muted)}.invite-row{display:flex;gap:8px;margin:10px 0 16px}.invite-row input{flex:1;min-width:0;background:var(--panel);color:var(--ink);padding:10px;border:1px solid var(--line);border-radius:4px}#invite small{display:block;color:var(--muted);font-size:11px;margin-top:15px}#arena{max-width:1600px;margin:auto;padding:28px 3vw 50px}.phase-heading{display:flex;gap:20px;align-items:center;justify-content:space-between;min-height:98px;margin-bottom:25px}.phase-heading h1{font:500 29px Georgia,serif;margin:7px 0}.phase-heading p{font-size:13px;color:var(--muted);margin:0}.phase-controls{display:flex;align-items:center;gap:15px}.clock{font:500 32px/1 ui-monospace,SFMono-Regular,Consolas,monospace;font-variant-numeric:tabular-nums;min-width:60px;text-align:center}.clock.urgent{color:#ee8569}#paused{max-width:150px;font-size:11px;color:#e7b27c}.teams-strip{display:grid;grid-template-columns:1fr 1fr;gap:25px;margin-bottom:26px}.team{display:flex;gap:8px;align-items:center}.team-title{min-width:90px;color:var(--muted);font-size:12px}.team-title strong{display:block;color:var(--p1);font-size:13px}.team.player-2 .team-title strong{color:var(--p2)}.mini-card{height:52px;flex:1;min-width:35px;padding:5px;border:1px solid var(--line);background:#172226;text-align:center;border-radius:4px;font-size:10px;color:var(--muted);cursor:pointer}.mini-card strong{display:block;color:var(--element,#7b8988);font-size:12px}.mini-card.empty{border-style:dashed;opacity:.5;display:grid;place-items:center}.mini-card.selected{outline:1px solid var(--accent);background:#2c3a34}.selection-panel{padding:25px;background:var(--panel);border:1px solid var(--line);border-radius:8px}.section-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:18px}.section-heading h2,.hand-heading h2{font-weight:500;font-size:15px;margin:0}.section-heading>span,.hand-heading>span{color:var(--muted);font-size:11px}.card-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px}.character-card,.modifier-card{position:relative;padding:16px;text-align:left;border:1px solid #536061;background:#e7e6d9;color:#1c2b2c;border-radius:6px;min-height:184px;display:flex;flex-direction:column}.character-card:hover:not(:disabled),.modifier-card:hover:not(:disabled){background:#f3f0e5;border-color:var(--element,#c8dfb0);transform:translateY(-2px)}.character-card.chosen,.modifier-card.chosen{outline:3px solid var(--element,var(--accent));outline-offset:2px}.character-card.unavailable{opacity:.25}.card-mark{font:500 29px Georgia,serif;color:var(--element);line-height:1;margin:2px 0 14px}.card-kind{font-size:9px;text-transform:uppercase;letter-spacing:.14em;opacity:.65}.card-name{font-size:16px;font-weight:650;display:block;margin:3px 0 12px}.card-stats{margin-top:auto;display:grid;grid-template-columns:repeat(3,1fr);gap:6px;border-top:1px solid #bcc3b4;padding-top:10px;font-size:10px}.card-stats b{display:block;font-size:13px}.card-stats span{opacity:.6}.modifier-card{min-height:170px}.modifier-card .card-name{font-size:14px}.card-description{font-size:11px;line-height:1.6;color:#435253;margin:0}.count-badge{position:absolute;right:12px;top:12px;border-radius:50%;background:#233a31;color:#e8f1df;width:22px;height:22px;display:grid;place-items:center;font-size:11px}.selected-hand{display:flex;gap:10px;min-height:40px;margin-top:25px}.hand-chip{border:1px solid var(--line);font-size:11px;color:var(--ink);background:#253336;padding:8px 12px;border-radius:4px}.battle-layout{display:grid;grid-template-columns:minmax(0,1fr) 285px;gap:20px}.board-wrap{border:1px solid var(--line);border-radius:6px;overflow:hidden;background:#142024;position:relative}.board-top,.board-bottom{padding:12px 16px;display:flex;align-items:center;justify-content:space-between;gap:10px;background:#18262a;font-size:10px;color:var(--muted)}.board-top>span{letter-spacing:.15em}.overlay-controls{display:flex;gap:15px}.overlay-controls label{display:flex;align-items:center;gap:4px;cursor:pointer}input[type=checkbox]{accent-color:var(--accent)}#board{display:block;width:100%;height:clamp(400px,56vh,680px);touch-action:none;user-select:none;cursor:grab}#board.command-mode{cursor:crosshair}#board.dragging{cursor:grabbing}.board-bottom button{padding:3px 10px;margin-left:4px;font-size:11px}.hex{fill:#1d3033;stroke:#365053;stroke-width:.055}.hex.fog{fill:#111d21;stroke:#24383c}.hex.vision{fill:#253e3d;stroke:#3b5956}.hex.hovered{stroke:#d7e8b9;stroke-width:.17}.unit{cursor:pointer;transition:transform .18s linear}.unit .body{stroke-width:.16}.unit .team-ring{fill:none;stroke-width:.09}.unit.selected .team-ring{stroke-width:.22;stroke:#edf7dc!important}.unit.ghost{opacity:.36}.unit.ghost .body{stroke-dasharray:.16 .12}.unit text{fill:#132126;text-anchor:middle;font-weight:800;pointer-events:none;font-size:.67px}.unit .hp{fill:#eef4e8;font-size:.48px;font-weight:600;paint-order:stroke;stroke:#102024;stroke-width:.15px}.unit .buff{fill:#dce8b8;font-size:.45px}.route{fill:none;stroke:#d1e7b7;stroke-width:.12;stroke-dasharray:.3 .2;pointer-events:none}.overlay{fill-opacity:.04;stroke-width:.11;pointer-events:none}.inspector{background:var(--panel);border:1px solid var(--line);border-radius:6px;padding:18px;max-height:calc(clamp(400px,56vh,680px) + 85px);overflow:auto}.unit-details h3{margin:0 0 4px;font:500 22px Georgia,serif;color:var(--element)}.unit-details p{font-size:11px;color:var(--muted)}.stat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:18px 0}.stat-grid span{font-size:9px;color:var(--muted)}.stat-grid b{font-size:15px;display:block;color:var(--ink)}.commands{display:grid;grid-template-columns:1fr 1fr;gap:6px}.commands button{font-size:11px;padding:9px;text-align:left;display:flex;justify-content:space-between}.commands button.active{background:#3a4b3d;border-color:var(--accent)}.commands kbd{font:10px system-ui;opacity:.5}.hint{font-size:10px;color:var(--muted);line-height:1.6;min-height:30px}.log-heading{margin-top:22px;border-top:1px solid var(--line);padding-top:15px}.event-log{padding:0;margin:0;list-style:none;font-size:10px;color:var(--muted);max-height:155px;overflow:auto}.event-log li{padding:6px 0;border-bottom:1px solid #27383b}.event-log b{color:#d8e3d9;font-weight:500}.hand-heading{margin:24px 0 12px;display:flex;justify-content:space-between;gap:20px}.combat-hand{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}.combat-hand .modifier-card{min-height:125px;padding:14px}.combat-hand .card-mark{display:none}.combat-hand .card-name{margin-right:20px;font-size:12px}.combat-hand .modifier-card.used{background:#203034;color:var(--muted);border-style:dashed;opacity:.5}.combat-hand .modifier-card.used .card-description{color:var(--muted)}.result{border:1px solid var(--line);padding:30px;margin-top:25px;background:#22312a;border-radius:7px}.result h2{font:500 32px Georgia,serif;margin:10px 0}.result p{color:var(--muted);font-size:13px}.result a{margin-left:20px}#replay-banner{position:relative;padding:8px 15px;background:#d3dfb9;color:#183127;font-size:10px;letter-spacing:.1em;display:flex;justify-content:space-between;align-items:center}#replay-banner button{font-size:10px;padding:4px 10px;background:transparent;color:#183127;border-color:#758c6f}#toast{position:fixed;bottom:25px;left:50%;transform:translateX(-50%);max-width:75vw;background:#e4e6d8;color:#192d27;border:1px solid #c1d7b6;padding:12px 22px;border-radius:6px;box-shadow:0 10px 35px #0006;font-size:13px;z-index:10}@media(max-width:1100px){.card-grid{gap:9px}.character-card,.modifier-card{padding:12px}.battle-layout{grid-template-columns:minmax(0,1fr) 255px}.team-title{min-width:65px}.mini-card strong{font-size:10px}.phase-heading p{max-width:550px}.phase-controls{gap:10px}#arena{padding:22px}.card-name{font-size:14px}.cycle-art{transform:scale(.85)}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}

.mode-buttons{display:flex;gap:12px;flex-wrap:wrap;align-items:center}
.modifier-tooltip{position:fixed;z-index:11;pointer-events:none;max-width:260px;padding:10px 13px;border:1px solid var(--accent);border-radius:5px;background:#172226;color:var(--ink);font-size:12px;line-height:1.6;white-space:pre-line;box-shadow:0 5px 18px #0006}

/* Chromium's automatic SVG group focus outline expands in board coordinates.
   Keep selection and keyboard focus inside the character's fixed-size ring. */
.unit:focus,.unit:focus-visible{outline:none!important}
.unit:focus-visible .team-ring{stroke:#edf7dc;stroke-width:.22}
.order-line{fill:none;stroke:#b4c9a3;stroke-width:.085;stroke-opacity:.65}
.order-route .order-label circle{fill:#142024;stroke:#b4c9a3;stroke-width:.055}
.order-label text{fill:#d5e4c7;font:600 .55px system-ui;text-anchor:middle}
.selected-order .order-line{stroke:#e0edca;stroke-width:.15;stroke-opacity:1}
.selected-order .order-label circle{stroke:#e0edca;stroke-width:.1}
.queued-order .order-line{stroke-dasharray:.3 .15}
.uncertain-order .order-line{stroke-opacity:.4;stroke-dasharray:.14 .2}
.draft-layout{display:grid;grid-template-columns:minmax(0,1fr);gap:22px}
.draft-layout.with-guide{grid-template-columns:minmax(0,1fr) 340px}
.element-guide{border-left:1px solid var(--line);padding-left:16px;align-self:start}
.cycle-reference h3{font-size:11px;font-weight:600;margin:0;text-align:center;color:#9dcf91}
.cycle-reference.negative h3{color:#e89a7e;margin-top:10px}
.cycle-reference svg{width:100%;display:block;overflow:visible}
.cycle-reference line{stroke:#9dcf91;stroke-width:1}
.cycle-reference path{fill:#9dcf91}
.cycle-reference.negative line{stroke:#e89a7e}
.cycle-reference.negative path{fill:#e89a7e}
.cycle-reference circle{fill:var(--panel);stroke-width:1}
.cycle-reference text{text-anchor:middle;font:10px system-ui}
.cycle-reference .cycle-verb{font-size:7px;fill:var(--muted);paint-order:stroke;stroke:var(--panel);stroke-width:3}
.element-guide>p{font-size:10px;text-align:center;color:var(--muted);margin:6px 0}
@media(max-width:1100px){.draft-layout.with-guide{grid-template-columns:minmax(0,1fr) 280px}.draft-layout.with-guide .card-grid{grid-template-columns:repeat(5,minmax(0,1fr))}}

.cycle-center small{display:block;font-size:10px;letter-spacing:.24em;margin-top:8px;color:var(--ink)}

.timing-choice{display:flex;align-items:center;gap:12px;margin-bottom:18px;font-size:13px;color:var(--muted)}
.timing-choice select{font:inherit;color:var(--ink);background:var(--panel);border:1px solid var(--line);border-radius:5px;padding:8px 12px}

.account-link{font-size:12px;color:var(--muted);text-decoration:none;white-space:nowrap}
.account-layout{max-width:1120px;padding:70px 35px;margin:auto;display:grid;grid-template-columns:1fr 440px;gap:80px;align-items:start}
.account-intro h1{font:500 48px/1.15 Georgia,serif;margin:22px 0}.account-intro p{font-size:15px;line-height:1.8;color:var(--muted);max-width:400px}
.account-card{background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:28px}.account-card h2{font:500 25px Georgia,serif;margin:14px 0 22px;overflow-wrap:anywhere}.account-card h3{font-size:14px;margin-top:25px}.account-card label{display:block;font-size:12px;color:var(--muted);margin:16px 0}.account-card input:not([type=checkbox]){display:block;width:100%;background:var(--bg);border:1px solid var(--line);border-radius:4px;color:var(--ink);font:inherit;font-size:15px;padding:11px 12px;margin:6px 0}.account-card small{display:block;font-size:11px;line-height:1.6}.account-card .show-password{display:flex;align-items:center;gap:7px}.account-message{font-size:13px;line-height:1.6;margin:0;color:var(--accent)}.account-message:empty{display:none}.account-message.error{color:#ee9e85}.account-tabs{display:flex;gap:8px;margin-bottom:20px}.account-tabs .active{border-color:var(--accent);color:var(--accent)}.signin-providers{border-top:1px solid var(--line);padding-top:16px;margin-top:22px}.signin-providers>p{color:var(--muted);font-size:12px}.sso{display:block;min-height:40px;width:100%;margin-top:10px;font-size:14px}.sso.google{border:0;padding:0;background:transparent;overflow:hidden}.sso.google img{height:40px;width:auto;max-width:100%;display:block;margin:auto}.account-actions{display:flex;flex-wrap:wrap;gap:10px;margin:20px 0}.account-actions button{font-size:12px}#profile-email,#profile-status,#linked-methods{font-size:13px;color:var(--muted);line-height:1.7;overflow-wrap:anywhere}
@media(max-width:900px){.account-layout{grid-template-columns:1fr;max-width:540px;gap:25px;padding-top:35px}.account-intro h1{font-size:38px}}

.tutorial-link{font-size:13px}.tutorial-layout{max-width:1600px;margin:auto;padding:25px 3vw 45px}.tutorial-heading{display:flex;align-items:center;gap:25px;margin-bottom:24px}.tutorial-heading h1{font:500 32px Georgia,serif;margin:7px 0}.tutorial-heading label{margin-left:auto;font-size:11px;color:var(--muted)}.tutorial-heading select{display:block;max-width:270px;margin-top:6px;background:var(--panel);color:var(--ink);border:1px solid var(--line);border-radius:4px;padding:9px;font:13px system-ui}#tutorial-progress{color:var(--muted);font:14px ui-monospace,monospace}#tutorial-error{color:#ee9e85}.tutorial-workspace{display:block}.tutorial-guide{display:grid;grid-template-columns:minmax(0,1fr) 275px;gap:30px;padding:20px 24px;margin-bottom:26px;background:var(--panel);border:1px solid var(--line);border-radius:6px}.tutorial-actions{align-self:center}.tutorial-actions>button{margin:5px 5px 5px 0}.tutorial-guide h2{font:500 26px/1.2 Georgia,serif;margin:8px 0}.tutorial-guide h2:focus{outline:none}#lesson-copy{font-size:13px;line-height:1.7;color:var(--muted)}.tutorial-task{font-size:13px;line-height:1.65;padding-left:13px;border-left:2px solid var(--accent);margin:12px 0}#lesson-feedback{font-size:12px;line-height:1.6;color:var(--accent)}#practice-countdown{display:block;font:22px ui-monospace,monospace;margin:10px 0;text-align:left}#practice-countdown:empty{display:none}.tutorial-navigation{display:flex;gap:10px;margin:15px 0 10px}.tutorial-stage{min-width:0}.tutorial-welcome{padding:40px;border:1px solid var(--line);border-radius:8px;background:var(--panel);font-size:15px;line-height:1.8}.tutorial-welcome h2{font:500 38px Georgia,serif;margin:0 0 22px}.tutorial-welcome p{color:var(--muted)}.tutorial-principles{display:flex;gap:20px;flex-wrap:wrap;margin-top:35px;font-size:13px;color:var(--accent)}.tutorial-recommended{outline:2px solid var(--accent);outline-offset:2px}#practice-picks{flex-wrap:wrap}#practice-reveal,#draft-instruction{font-size:13px;line-height:1.6;color:var(--accent)}.hex.lesson-destination{fill:#758c4c;stroke:#e1f2a8;stroke-width:.2}.unit.lesson-target .team-ring{stroke:#e9cc8d;stroke-width:.18}.tutorial-reference{margin-top:30px;padding:20px;border:1px solid var(--line);border-radius:6px;background:var(--panel)}.tutorial-reference summary{cursor:pointer;color:var(--accent);font-size:14px}.tutorial-reference .element-guide{display:grid;grid-template-columns:1fr 1fr;gap:30px;max-width:700px;margin:25px auto;border:0;padding:0}.tutorial-reference .element-guide>p{grid-column:1/-1}.tutorial-modifiers{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:20px}.tutorial-modifiers h3{font-size:13px;font-weight:600}.tutorial-modifiers p,.tutorial-rules p{font-size:12px;color:var(--muted);line-height:1.7}.tutorial-rules{margin-top:25px}.tutorial-rules h3{font-size:16px}
@media(max-width:1050px){.tutorial-guide{grid-template-columns:minmax(0,1fr) 220px;gap:18px}.tutorial-guide h2{font-size:24px}.tutorial-modifiers{grid-template-columns:repeat(2,minmax(0,1fr))}}

.player-stats{border-top:1px solid var(--line);padding-top:18px;margin-top:24px}.player-stats .section-heading{margin-bottom:10px}.player-stats .section-heading h3{margin:0}.player-stats .quiet-link{font-size:11px;white-space:nowrap}#stats-message,.scoreboard-note{font-size:12px;line-height:1.7;color:var(--muted)}.stats-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:18px 0}.stats-summary>div{padding:10px;background:var(--bg);border:1px solid var(--line);border-radius:4px}.stats-summary dt{font-size:10px;color:var(--muted)}.stats-summary dd{font-size:18px;font-variant-numeric:tabular-nums;margin:4px 0 0}.stats-summary>div:first-child dd{color:var(--accent)}.stats-table{border-collapse:collapse;width:100%;text-align:left;font-size:12px;font-variant-numeric:tabular-nums}.stats-table caption{text-align:left;color:var(--muted);font-size:11px;margin:15px 0 10px}.stats-table th{font-size:10px;font-weight:500;color:var(--muted)}.stats-table th,.stats-table td{padding:10px 8px;border-bottom:1px solid var(--line)}.stats-table th:last-child,.stats-table td:last-child{text-align:right}.stats-table small{display:block;font-size:10px;color:var(--muted);margin-top:4px}.stats-table [data-outcome=win] a{color:var(--accent)}.stats-table [data-outcome=loss] a{color:#ee9e85}.scoreboard-layout{max-width:1250px;margin:auto;padding:35px 4vw 60px}.scoreboard-note{max-width:780px;margin-bottom:24px}#score-message{min-height:22px;font-size:13px;color:var(--accent)}.scoreboard-table-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:6px;background:var(--panel)}.scoreboard-table{min-width:750px}.scoreboard-table th,.scoreboard-table td{padding:15px 12px}.scoreboard-table tbody tr.current-player{background:#2b3e35}.scoreboard-table td:nth-child(3){color:var(--accent);font-weight:650}.score-pagination{display:flex;justify-content:flex-end;align-items:center;gap:18px;margin:20px 0}.score-pagination span{color:var(--muted);font-size:12px}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}