@font-face{font-family:Expedition;src:local('Aptos'),local('Segoe UI');font-display:swap}
:root{--ink:#091e35;--cream:#fff8e9;--paper:#fffdf6;--gold:#ffd052;--line:#84bcdf22}
*{box-sizing:border-box}html{color-scheme:dark;background:var(--ink)}
body{margin:0;min-height:100svh;font-family:Expedition,'Segoe UI',sans-serif;color:#f4f8ff;background:radial-gradient(ellipse at 51% 38%,#164e70 0,transparent 62%),radial-gradient(ellipse at 90% 5%,#18345a 0,transparent 48%),var(--ink)}
button,select{font:inherit}button,a,select{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{cursor:default;opacity:.46}
button:focus-visible,a:focus-visible,select:focus-visible,.arena:focus-visible{outline:3px solid #ffe29c;outline-offset:4px}
svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
.svg-library{position:absolute;width:0;height:0;overflow:hidden}[hidden]{display:none!important}
.site-header{height:100px;max-width:1480px;margin:auto;padding:0 42px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:12px;color:#fffdf2;text-decoration:none;font-size:23px;font-weight:950;font-style:italic;line-height:.87;letter-spacing:-1px}
.brand-wars{color:var(--gold);display:block;font-size:29px;letter-spacing:-.7px}
.brand-icon{width:47px;height:52px;display:grid;place-items:center;background:#1e3a48;border:1px solid #80b6ba35;color:#60d8e6;border-radius:15px 15px 20px 20px;transform:rotate(-7deg);box-shadow:inset 0 -4px 0 #081b292c}
.brand-icon svg{width:27px;height:27px;transform:rotate(7deg)}
.brand small{font-size:8px;letter-spacing:1.8px;font-style:normal;line-height:1.8;max-width:110px;color:#7e9caa;margin-left:16px;font-weight:750;border-left:1px solid #7697a430;padding-left:20px}
.top-status{font-size:9px;letter-spacing:1.7px;color:#bed2d5;display:flex;align-items:center;gap:9px;font-weight:800}
.top-status i,.arena-foot i{display:inline-block;width:6px;height:6px;background:#b6d97f;border-radius:50%}
.top-status span{margin-left:29px;color:#6d8c9a;font-size:8px;letter-spacing:1.6px}
.layout{max-width:1440px;margin:34px auto 28px;padding:0 42px;display:grid;grid-template-columns:minmax(205px,1fr) minmax(365px,500px) minmax(195px,.86fr);gap:52px;align-items:center}
.eyebrow{font-size:9px;line-height:1.5;font-weight:850;letter-spacing:1.8px;color:#9dbdc6}
.section-dash{display:inline-block;width:19px;height:2px;background:#d1b67c;vertical-align:middle;margin-right:9px;transform:translateY(-1px)}
.briefing h1{font-size:clamp(38px,3.6vw,56px);font-weight:850;letter-spacing:-2.7px;line-height:1.035;margin:25px 0 20px}
.briefing em{color:var(--gold);font-style:normal}.lead{font-size:14px;color:#9ab5c3;line-height:1.8;margin:0;max-width:290px}
.chapter{display:flex;align-items:center;gap:16px;border-block:1px solid var(--line);margin:29px 0;padding:20px 0}
.chapter-number{font-size:38px;line-height:1;color:#5f8593;font-weight:850;letter-spacing:-2px}
.chapter p{font-size:8px;line-height:1.9;color:#8ba9b6;letter-spacing:1.8px;margin:0}.chapter strong{font-size:11px;color:#dce9e6;letter-spacing:1.4px}.chapter svg{color:#d9b773;margin-left:auto;width:26px;height:26px}
.instructions{list-style:none;padding:0;display:grid;gap:22px;margin:0}.instructions li{display:flex;gap:14px}.instructions li>b{font-size:9px;font-weight:900;color:#dabf84;padding-top:3px;letter-spacing:.7px}
.instructions strong{font-size:12px;color:#edf2e9;font-weight:750}.instructions p{font-size:11px;color:#8ca8b8;line-height:1.7;margin:6px 0 0;max-width:245px}
.local-note{font-size:7px;font-weight:800;letter-spacing:1.1px;color:#91abb7;margin:29px 0 0;display:flex;align-items:center;gap:8px}.local-note svg{width:15px;height:15px;color:#abc38f}
.game-column{min-width:0}
.arena{position:relative;width:100%;aspect-ratio:500/790;max-height:calc(100svh - 157px);min-height:560px;isolation:isolate;background:#5bced8;border:1px solid #a0cbd780;border-radius:28px;overflow:hidden;box-shadow:0 26px 70px #00000040,0 0 0 6px #0a192650,0 0 0 7px #c7e1df0b;touch-action:none;user-select:none;outline:none}
canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.hud{position:absolute;inset:0 0 auto;padding:19px 21px 22px;background:linear-gradient(#122f42ed 0,#193d548a 65%,transparent);pointer-events:none;color:#fffdf2;z-index:4}
.hud-top{display:flex;align-items:center;justify-content:space-between}.wallet span{display:block;font-size:8px;letter-spacing:1.6px;font-weight:800;color:#b2d2d8}
.wallet strong{font-size:24px;font-weight:850;color:#ffe3a0;display:block;margin-top:4px;letter-spacing:-.5px;font-variant-numeric:tabular-nums;text-shadow:0 2px 0 #112c3a44}
.hud-controls{display:flex;gap:7px;pointer-events:auto}
.icon-button{width:39px;height:39px;display:grid;place-items:center;border:1px solid #d0eeed45;background:#193e537a;color:#e4f6f8;border-radius:12px;box-shadow:inset 0 -2px 0 #0d293044;transition:background .15s}
.icon-button:hover{background:#224f67e0}.icon-button svg{width:18px;height:18px}.icon-button[aria-pressed=false]{opacity:.55}
.level-line{display:flex;justify-content:space-between;gap:8px;margin-top:15px;font-size:8px;letter-spacing:1.1px;font-weight:850;color:#d7e9e9}
.level-line>span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}#progress-label{color:#f3d893;font-variant-numeric:tabular-nums}
.level-line{align-items:center}.level-line>span:first-child{flex:1;min-width:0}
.difficulty-badge{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;padding:3px 6px;border:1px solid #76cdea6b;border-radius:5px;background:#123e5e;color:#d8f5ff;font-size:7px;font-weight:850;line-height:1.2;letter-spacing:.55px;text-transform:uppercase;white-space:nowrap}
.difficulty-badge[data-difficulty=easy]{background:#23492f;border-color:#98ce8070;color:#dcf5ba}.difficulty-badge[data-difficulty=hard]{background:#65421d;border-color:#e8b65680;color:#ffe2a1}.difficulty-badge[data-difficulty=extreme]{background:#7b3422;border-color:#ffb18380;color:#ffddba}.difficulty-badge[data-difficulty=impossible]{background:#772b40;border-color:#ffa3b480;color:#ffe1e9}
#result-difficulty{margin:0 auto 3px;padding:5px 9px;font-size:8px;letter-spacing:.85px}
.progress-track{height:4px;border-radius:9px;background:#091f3159;margin-top:8px;overflow:hidden;border-bottom:1px solid #fff1}
.progress-track i{display:block;background:#f6d68d;width:0;height:100%;border-radius:9px;transition:width .18s}
.group-badge{position:absolute;left:17px;top:123px;z-index:3;min-width:79px;background:#123c52ec;padding:8px 10px;border:1px solid #69bfd038;border-radius:12px;display:grid;grid-template-columns:16px auto;gap:0 7px;align-items:center;box-shadow:0 4px 15px #00436526;pointer-events:none}
.group-badge svg{width:16px;height:16px;grid-row:span 2;color:#72e2e8}.group-badge strong{font-size:19px;line-height:1.05;font-variant-numeric:tabular-nums}.group-badge span{font-size:6px;letter-spacing:.8px;color:#a8d3d9;margin-top:3px}
.boss-hud{position:absolute;z-index:3;top:123px;left:109px;right:17px;max-width:280px;margin-left:auto;padding:9px 11px 8px;border:1px solid #ebb97570;border-radius:12px;background:#142e41f2;box-shadow:0 4px 15px #00324930;pointer-events:none;color:#fff6df}
.boss-heading{display:flex;align-items:center;gap:6px}.boss-heading svg{width:13px;height:13px;color:#e0b975}.boss-heading strong{font-size:9px;font-weight:850;line-height:1.2;flex:1}.boss-heading>span{font-size:8px;font-weight:800;color:#e8c792;font-variant-numeric:tabular-nums}
.boss-health-track{height:5px;border-radius:4px;background:#050f1f7a;overflow:hidden;margin-top:7px}.boss-health-track i{display:block;height:100%;background:#ed9d6b;border-radius:4px;transition:width .12s linear}
.boss-action{display:block;margin-top:5px;color:#b6cbd1;font-size:7px;letter-spacing:.35px;font-weight:750}
.boss-hud[data-phase=windup]{border-color:#ffce64;background:#433820f2}.boss-hud[data-phase=windup] .boss-action{color:#ffdb8a}
.boss-hud[data-phase=slam],.boss-hud[data-phase=impact]{border-color:#ff8a79;background:#583337f2}.boss-hud[data-phase=slam] .boss-action,.boss-hud[data-phase=impact] .boss-action{color:#ffc2b1}
.boss-hud[data-phase=recover] .boss-action,.boss-hud[data-phase=done] .boss-action{color:#bce2bf}
.screen{position:absolute;z-index:5;width:calc(100% - 44px);left:22px;top:50%;transform:translateY(-43%);max-height:calc(100% - 121px);overflow:hidden;overflow-y:auto;border-radius:22px;border:1px solid #fffdf5;background:var(--cream);color:#193442;box-shadow:0 20px 65px #102c4652;touch-action:pan-y;scrollbar-width:thin;scrollbar-color:#94acae transparent}
.intro-art{height:157px;position:relative;background:#93dee7;overflow:hidden;border-bottom:3px solid #efd495}
.intro-art img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 51%}.intro-art::after{content:'';position:absolute;inset:55% 0 0;background:linear-gradient(transparent,#0e496b55);pointer-events:none}
.art-tag{position:absolute;z-index:1;left:16px;bottom:12px;display:flex;gap:6px;align-items:center;font-size:7px;font-weight:900;letter-spacing:1px;background:#173c50f2;color:#ffe4a2;border:1px solid #e4d49b50;padding:7px 9px;border-radius:6px}
.art-tag svg{width:12px;height:12px}.art-corner{position:absolute;right:13px;top:13px;font-size:7px;letter-spacing:1.6px;font-weight:850;color:#12415d;background:#fff6;padding:5px 7px;border:1px solid #fff7;border-radius:5px}
.intro-body{padding:21px 23px 16px}.intro-body .eyebrow{color:#3b8e97;font-size:8px;letter-spacing:1.55px;margin:0 0 9px}
.intro-body h2{font-size:29px;line-height:1.09;letter-spacing:-1.1px;margin:0;font-weight:850}.intro-body h2 em{font-style:normal;color:#187e91}.intro-copy{font-size:11px;color:#758790;line-height:1.6;margin:10px 0 16px}
.settings{display:grid;grid-template-columns:1fr 1fr;gap:11px;margin-bottom:12px}.settings label{font-size:7px;font-weight:850;color:#647e88;letter-spacing:.8px}
select{display:block;width:100%;min-height:43px;margin-top:6px;padding:10px 28px 10px 11px;border:1px solid #c9d6d3;border-radius:9px;background:#fffdf5;color:#294755;font-size:12px;font-weight:800;color-scheme:light;box-shadow:0 2px 0 #16374b04;cursor:pointer}
.difficulty-note{font-size:10px;line-height:1.45;color:#607d89;margin:0 0 13px;min-height:29px;padding-left:9px;border-left:2px solid #c8dcd3}
.primary{width:100%;min-height:53px;display:flex;justify-content:center;align-items:center;gap:13px;padding:13px 16px;border:1px solid #a7cc72;border-bottom:4px solid #769b40;border-radius:12px;background:linear-gradient(#d1eb9b,#b7dc78);color:#284319;font-size:11px;font-weight:950;letter-spacing:.8px;box-shadow:inset 0 1px 0 #f5ffd6,0 5px 0 #6b933012,0 9px 18px #466b2117;transition:filter .15s,transform .15s}
.primary:hover{filter:brightness(1.04);transform:translateY(-1px)}.primary:active{transform:translateY(2px);box-shadow:inset 0 1px 0 #f5ffd6}.primary svg{width:17px;height:17px}
.gesture{display:flex;align-items:center;justify-content:center;gap:6px;font-size:9px;color:#81949b;margin:12px 0 0}.gesture svg{width:15px;height:15px;color:#739fac}
.overlay{padding:29px 25px 18px;text-align:center;transform:translateY(-43%)}
.modal-mark{margin:0 auto 18px;width:66px;height:66px;border:1px solid #e3cf91;border-radius:20px;background:#f2e7bd;color:#977522;display:grid;place-items:center;box-shadow:inset 0 2px 0 #fffcdf,0 5px 0 #a8812710}
.modal-mark svg{width:32px;height:32px;stroke-width:1.5}.overlay .eyebrow{color:#438e96;font-size:8px;letter-spacing:1.5px;margin:0}.overlay h2{font-size:29px;letter-spacing:-1.1px;line-height:1.12;margin:11px 0 14px;font-weight:850}
.overlay p:not(.eyebrow){font-size:11px;color:#778a93;line-height:1.7}.overlay .primary{margin-top:20px}
.text-button{background:none;border:0;color:#748c96;padding:13px 10px;font-size:10px;font-weight:700;line-height:1.5}.text-button:hover{color:#294b5a;text-decoration:underline;text-underline-offset:3px}
.secondary{width:100%;min-height:45px;border:1px solid #c8d8d3;background:#edf0e7;color:#486570;font-size:10px;font-weight:850;letter-spacing:.45px;border-radius:10px;padding:13px 12px;margin-top:9px;box-shadow:inset 0 1px 0 #ffffffe0}.secondary:hover{background:#e4eade}
.danger-button{border:1px solid #eab6aa;border-radius:9px;padding:12px 16px;background:#f6d8ce;color:#983f32;font-size:11px;font-weight:750}#abandon-confirm{padding-top:4px;border-top:1px solid #dbe4db}
.result-value{display:block;font-size:48px;font-weight:950;letter-spacing:-2.2px;color:#178b86;margin:5px 0 20px;font-variant-numeric:tabular-nums;line-height:1.15}.result-label{display:block;font-size:7px;letter-spacing:1.45px;font-weight:850;color:#84978f;margin-top:23px}
.result-metrics{display:grid;grid-template-columns:1fr 1fr 1fr;border-block:1px solid #d8e1d4;padding:13px 0;background:#ebeedd66}.result-metrics>div+div{border-left:1px solid #d8e1d4}.result-metrics span{font-size:6px;letter-spacing:.6px;display:block;color:#7e9294;font-weight:800}.result-metrics b{font-size:18px;display:block;margin-top:5px;font-variant-numeric:tabular-nums}
.result[data-outcome=lost] .result-value{color:#bf7357}.result[data-outcome=lost] .modal-mark{color:#b37849;background:#f1e0c4;border-color:#dcc096}.result[data-outcome=lost] .result-label{color:#9e8d81}
.bottom-hud{position:absolute;bottom:11px;left:16px;right:16px;z-index:3;pointer-events:none;display:grid;grid-template-columns:1fr auto;padding:9px 13px 8px;border:1px solid #b1d6d939;border-radius:13px;background:#14394cf2;color:#fffdf2;box-shadow:0 7px 25px #11324626}
.bottom-hud span{font-size:6px;font-weight:850;letter-spacing:1.2px;color:#a0c1c9;display:block}.bottom-hud strong{font-size:20px;font-weight:850;color:#ffe09a;display:block;margin-top:2px;line-height:1.15;font-variant-numeric:tabular-nums}
.multiplier{display:flex;align-items:center;font-size:15px;font-weight:850;color:#d4edac;background:#719e4c26;border:1px solid #afcf7526;border-radius:9px;padding:0 11px;font-variant-numeric:tabular-nums}
.bottom-hud p{grid-column:span 2;margin:5px 0 0;padding-top:5px;border-top:1px solid #bddee119;text-align:center;font-size:8px;color:#bcd5d8;line-height:1.3}
.arena-foot{display:flex;align-items:center;justify-content:space-between;gap:9px;margin-top:13px;font-size:7px;color:#72939e}.arena-foot>span{letter-spacing:1.1px;font-weight:850;white-space:nowrap;color:#a9c2c3}.arena-foot i{width:5px;height:5px;margin-right:4px}.arena-foot p{margin:0;line-height:1.5;text-align:right}
.field-notes>.eyebrow{margin-bottom:23px;color:#85a3b0;font-size:8px}.islands{position:relative;display:grid;gap:5px}
.island{display:flex;align-items:center;gap:12px;padding:13px 9px;border:1px solid transparent;background:none;border-radius:11px;color:#7693a2;text-align:left;transition:background .15s}
.island>b{display:grid;place-items:center;width:33px;height:35px;font-size:10px;background:#193242;border:1px solid #6e96a42c;border-radius:9px;flex-shrink:0;font-variant-numeric:tabular-nums}
.island>span{font-size:12px;font-weight:800}.island small{display:block;font-size:6px;letter-spacing:.75px;margin-top:6px;font-weight:650}.island svg{width:11px;height:11px;margin-left:auto}
.island.active{background:#b0ccbf0b;border-color:#accbc521;color:#e9eee1}.island.active>b{background:#4a4532;border-color:#bca56870;color:#f4d58e}.island:not(:disabled):hover{background:#92bdcb10}.island:disabled{opacity:.67}.island.active:disabled{opacity:1}
.gate-guide{border-top:1px solid var(--line);margin-top:24px;padding-top:24px}.gate-guide>.eyebrow{font-size:7px;color:#88a7b2;letter-spacing:1.4px}
.gate-example{display:flex;gap:9px;margin-top:16px;max-width:176px}.gate-example b{font-size:26px;line-height:1;font-weight:950;flex:1;text-align:center;border:1px solid #55b9cb64;border-top:3px solid #9bddde;border-bottom:4px solid #237e97;transform:perspective(250px) rotateY(-9deg);background:#214b5b;padding:17px 5px;color:#c3f6ed;border-radius:7px;box-shadow:inset 0 0 0 5px #87e6e009,0 6px 0 #071d2729}.gate-example b:last-child{transform:perspective(250px) rotateY(9deg)}
.gate-guide h3{font-size:23px;line-height:1.2;font-weight:800;letter-spacing:-.7px;color:#e8eee2;margin:21px 0 10px}.gate-guide p{font-size:11px;color:#87a7b6;line-height:1.75;margin:0;max-width:245px}
.guardian-note{display:flex;gap:10px;padding:16px 0;margin-top:17px;border-block:1px solid var(--line)}.guardian-note>svg{width:20px;height:20px;color:#d7ad6b;transform:translateY(1px)}.guardian-note strong{font-size:10px;color:#d1d4bd;font-weight:750}.guardian-note p{font-size:10px;color:#7b9aa9;line-height:1.6;margin:5px 0 0}
.keys{margin-top:21px;font-size:9px;display:flex;gap:6px;align-items:center;flex-wrap:wrap;color:#91abb7}.keys p{width:100%;font-size:7px;letter-spacing:1.3px;margin:0 0 6px;color:#658797;font-weight:750}
kbd{border:1px solid #426878;border-bottom-width:2px;border-radius:5px;padding:4px 6px;font-family:inherit;font-size:10px;min-width:24px;text-align:center;background:#122a3959;color:#d7e3dc}.keys span{margin-right:9px}
.record{margin-top:26px;display:grid;grid-template-columns:1fr auto;gap:5px 7px;align-items:center}.record>span{font-size:7px;letter-spacing:1.1px;color:#799eac;font-weight:750}.record strong{font-size:26px;font-weight:850;letter-spacing:-.7px;color:#e2c885;grid-row:span 2;font-variant-numeric:tabular-nums}.record p{font-size:9px;color:#608592;margin:0}
.site-footer{max-width:1356px;margin:auto;padding:18px 0;border-top:1px solid #aecbd512;display:flex;justify-content:space-between;gap:20px;font-size:7px;letter-spacing:1.2px;color:#62828f}.site-footer>span:first-child{color:#8ca3ab;font-weight:850}.site-footer p{margin:0;letter-spacing:.3px;color:#597d8b}
.callout{position:absolute;z-index:4;left:50%;top:34%;transform:translate(-50%,-8px);max-width:calc(100% - 36px);padding:10px 15px;border:1px solid #ffe2a135;border-radius:11px;background:#14374cef;color:#fff0bf;font-size:12px;font-weight:850;line-height:1.35;text-align:center;opacity:0;transition:opacity .15s,transform .2s;pointer-events:none;box-shadow:0 4px 20px #15344733}
.callout.show{opacity:1;transform:translate(-50%,0)}.callout.negative{background:#9e4543f2;border-color:#ffb28f70;color:#fff0dc}
.error{font-size:10px;line-height:1.5;background:#f8ddd2;border:1px solid #e8c6b6;color:#944b37;border-radius:8px;padding:9px}
@media(min-height:980px){.layout{margin-top:49px}.arena{max-height:850px}}
@media(max-width:1220px){
 .layout{gap:30px;padding:0 30px;grid-template-columns:minmax(185px,1fr) minmax(345px,455px) minmax(180px,.86fr)}.site-header{padding:0 32px}.briefing h1{font-size:43px}.intro-art{height:142px}.intro-body{padding:19px 21px 15px}.intro-body h2{font-size:28px}.chapter{margin:24px 0}.instructions{gap:19px}.local-note{font-size:6px}.gate-guide h3{font-size:21px}.site-footer{margin:0 32px}
}
@media(max-width:1000px){
 .field-notes{display:none}.layout{max-width:840px;grid-template-columns:minmax(220px,1fr) minmax(350px,430px);gap:36px;padding:0 28px;margin-top:28px}.site-header{height:82px;padding:0 28px}.arena{max-height:calc(100svh - 140px)}.briefing h1{font-size:45px}.top-status span{display:none}
}
@media(max-width:720px){
 .site-header{height:62px;padding:0 18px;border-bottom:1px solid #aac8d010}.brand{font-size:15px;gap:8px}.brand-wars{font-size:19px}.brand-icon{width:33px;height:37px;border-radius:10px 10px 13px 13px}.brand-icon svg{width:20px;height:20px}.brand small{display:none}
 .top-status{font-size:6px;letter-spacing:1px;gap:6px}.top-status i{width:5px;height:5px}.briefing,.site-footer{display:none}.layout{display:block;padding:0;margin:9px auto 0;width:min(100%,470px)}.game-column{padding:0 9px}
 .arena{border-radius:21px;min-height:0;height:calc(100svh - 104px);max-height:850px;aspect-ratio:auto;box-shadow:0 0 0 3px #0719256b,0 12px 35px #0002}
 .hud{padding:15px 17px 20px}.wallet span{font-size:7px;letter-spacing:1.3px}.wallet strong{font-size:21px}.icon-button{width:36px;height:36px;border-radius:11px}.icon-button svg{width:17px;height:17px}.level-line{font-size:7px;margin-top:12px;letter-spacing:.8px}.progress-track{margin-top:7px;height:3px}
 .group-badge{left:13px;top:111px;min-width:76px;padding:8px 9px}.group-badge strong{font-size:18px}.boss-hud{top:111px;left:100px;right:13px;padding:8px 9px 7px;border-radius:11px}.boss-heading strong{font-size:8px}.boss-heading>span{font-size:7px}.boss-heading svg{width:11px;height:11px}.boss-action{font-size:6px}.boss-health-track{margin-top:6px;height:4px}
 .screen{left:15px;width:calc(100% - 30px);max-height:calc(100% - 112px);transform:translateY(-43%);border-radius:18px}
 .intro-art{height:clamp(103px,17svh,151px)}.art-tag{left:13px;bottom:10px;font-size:6px;letter-spacing:.9px;padding:6px 8px}.art-tag svg{width:11px;height:11px}.art-corner{font-size:6px;right:11px;top:10px}
 .intro-body{padding:19px 19px 14px}.intro-body .eyebrow{font-size:7px;margin-bottom:8px;letter-spacing:1.35px}.intro-body h2{font-size:28px;line-height:1.08;letter-spacing:-1px}.intro-copy{font-size:10px;margin:9px 0 14px}.settings{gap:9px;margin-bottom:11px}.settings label{font-size:6px;letter-spacing:.7px}select{min-height:42px;padding:10px 22px 10px 10px;font-size:11px}
 .difficulty-note{font-size:9px;min-height:27px;margin-bottom:12px}.primary{min-height:50px;padding:12px;font-size:10px;letter-spacing:.7px}.primary svg{width:16px;height:16px}.gesture{font-size:8px;margin-top:10px;gap:5px}.gesture svg{width:14px;height:14px}
 .overlay{padding:25px 21px 15px}.overlay h2{font-size:28px}.overlay .eyebrow{font-size:7px}.modal-mark{width:61px;height:61px;border-radius:18px;margin-bottom:15px}.overlay p:not(.eyebrow){font-size:10px}.overlay .primary{margin-top:17px}.result-value{font-size:45px;margin-bottom:18px}.result-label{font-size:6px;margin-top:20px}.result-metrics span{font-size:6px;letter-spacing:.15px}.result-metrics b{font-size:17px}
 .bottom-hud{left:12px;right:12px;bottom:10px;padding:8px 11px 7px}.bottom-hud strong{font-size:19px}.bottom-hud span{font-size:6px;letter-spacing:.7px}.bottom-hud p{font-size:7px;margin-top:4px;padding-top:4px}.multiplier{font-size:14px;padding:0 10px}.arena-foot{font-size:6px;margin:9px 3px 0;gap:7px}.arena-foot>span{letter-spacing:.75px}.arena-foot p{font-size:6px}.callout{font-size:11px;padding:9px 13px;top:33%}
}
@media(max-width:380px){.intro-body h2{font-size:25px}.intro-body{padding-inline:17px}.brand-icon{width:30px}.top-status{font-size:5px;letter-spacing:.8px}.boss-hud{left:98px}.boss-heading strong{font-size:7px}.boss-heading{gap:4px}}
@media(max-height:780px) and (min-width:721px){
 .site-header{height:72px}.layout{margin-top:21px;align-items:center}.arena{min-height:525px;max-height:calc(100svh - 125px)}.briefing h1{font-size:40px;margin-top:17px}.chapter{margin:19px 0;padding:16px 0}.instructions{gap:15px}.local-note{margin-top:23px}.field-notes>.eyebrow{margin-bottom:15px}.island{padding-block:10px}.gate-guide{margin-top:18px;padding-top:18px}.gate-guide h3{font-size:20px;margin-top:15px}.gate-example b{padding:12px 5px}.guardian-note{margin-top:13px;padding-block:13px}.keys{margin-top:15px}.record{margin-top:19px}
 .intro-art{height:105px}.intro-body{padding:17px 21px 13px}.intro-body h2{font-size:26px}.intro-copy{margin:8px 0 12px}.settings{margin-bottom:10px}select{min-height:40px;padding-block:9px}.difficulty-note{font-size:9px;min-height:26px;margin-bottom:10px}.primary{min-height:47px;padding:11px}.gesture{margin-top:9px}
 .overlay{padding:21px 22px 13px}.modal-mark{width:54px;height:54px;margin-bottom:12px;border-radius:17px}.modal-mark svg{width:28px;height:28px}.overlay h2{font-size:26px;margin-block:9px 11px}.overlay .primary{margin-top:15px}.result-label{margin-top:18px}.result-value{font-size:41px;margin-bottom:15px}.result-metrics{padding-block:11px}
}
@media(max-height:740px) and (max-width:720px){
 .site-header{height:55px}.layout{margin-top:7px}.arena{height:calc(100svh - 94px)}.hud{padding-top:13px}.wallet strong{font-size:20px}.screen{max-height:calc(100% - 104px);transform:translateY(-42%)}.group-badge,.boss-hud{top:106px}
 .intro-art{height:88px}.intro-body{padding:15px 18px 12px}.intro-body .eyebrow{font-size:6px;margin-bottom:7px}.intro-body h2{font-size:24px;line-height:1.05}.intro-copy{display:none}.settings{margin-top:14px;margin-bottom:9px}select{min-height:38px;padding-block:8px}.difficulty-note{font-size:8px;min-height:24px;line-height:1.5;margin-bottom:10px}.primary{min-height:45px;padding:10px}.gesture{font-size:7px;margin-top:9px}.art-tag{padding:5px 7px;font-size:5px}
 .overlay{padding:19px 19px 12px}.modal-mark{width:48px;height:48px;margin-bottom:12px;border-radius:15px}.modal-mark svg{width:26px;height:26px}.overlay h2{font-size:25px;margin:9px 0 11px}.overlay .primary{margin-top:14px}.overlay p:not(.eyebrow){font-size:9px}.result-label{margin-top:17px}.result-value{font-size:39px;margin-bottom:13px}.result-metrics{padding-block:10px}.result-metrics b{font-size:16px}.secondary{min-height:39px;padding:11px;font-size:9px}.text-button{padding:10px;font-size:9px}
}
@media(max-height:720px) and (min-width:721px){.intro-copy{display:none}.settings{margin-top:12px}.intro-art{height:92px}}
@media(max-height:680px) and (min-width:721px){.intro-art{height:78px}.intro-body{padding:14px 20px 12px}.intro-body .eyebrow{display:none}.intro-body h2{font-size:23px;line-height:1.05}.settings{margin-bottom:8px}select{min-height:36px;padding-block:7px}.difficulty-note{font-size:8px;min-height:24px;margin-bottom:9px}.intro .primary{min-height:43px;padding:10px}.gesture{display:none}}
@media(max-height:580px) and (max-width:720px){.site-header{height:48px}.arena{height:calc(100svh - 83px)}.intro-art{height:65px}.screen{max-height:calc(100% - 85px)}.intro-body{padding:11px 16px}.intro-body h2{font-size:22px}.intro-body .eyebrow{display:none}.settings{margin-top:12px}.difficulty-note{min-height:0;font-size:7px;margin-bottom:8px}.gesture{display:none}.primary{min-height:41px}.wallet strong{font-size:18px}.level-line{margin-top:9px}}
.intro-copy,.overlay p:not(.eyebrow),.gesture{color:#607581}.settings label,.difficulty-note{color:#556f7b}.result-label,.result-metrics span{color:#637c80}
@media(max-width:720px){.top-status{font-size:7px;letter-spacing:.65px}.settings label{font-size:8px;letter-spacing:.35px}.primary{font-size:12px;letter-spacing:.45px}.wallet span,.level-line{font-size:8px}.boss-heading strong{font-size:9px}.boss-heading>span,.boss-action{font-size:8px}.boss-action{letter-spacing:0}.bottom-hud span{font-size:7px}.bottom-hud p{font-size:9px}.arena-foot,.arena-foot p{font-size:8px}.arena-foot>span{font-size:7px;letter-spacing:.45px}.gesture{font-size:9px}.intro-body .eyebrow{font-size:8px}}
/* Short, event-driven accents. Counters never interpolate or invent game values. */
@keyframes troop-gain-a{0%{transform:scale(.96);border-color:#c5ed90}35%{transform:scale(1.12)}100%{transform:scale(1)}}
@keyframes troop-gain-b{0%{transform:scale(.96);border-color:#c5ed90}35%{transform:scale(1.12)}100%{transform:scale(1)}}
@keyframes troop-loss-a{0%{transform:scale(1.07);border-color:#ffa07b;background-color:#623c3f}100%{transform:scale(1)}}
@keyframes troop-loss-b{0%{transform:scale(1.07);border-color:#ffa07b;background-color:#623c3f}100%{transform:scale(1)}}
.group-badge,.bottom-hud,.boss-hud{transform-origin:center}
[data-feedback=gain-a]{animation:troop-gain-a .34s cubic-bezier(.2,.7,.25,1)}
[data-feedback=gain-b]{animation:troop-gain-b .34s cubic-bezier(.2,.7,.25,1)}
[data-feedback=loss-a]{animation:troop-loss-a .22s ease-out}
[data-feedback=loss-b]{animation:troop-loss-b .22s ease-out}
@keyframes field-panel-enter{from{opacity:0;translate:0 10px}to{opacity:1;translate:0 0}}
.screen:not([hidden]){animation:field-panel-enter .3s cubic-bezier(.16,1,.3,1)}
.arena[data-state=paused] [data-feedback]{animation-play-state:paused}
/* Jewel-blue arena and warm expedition accents; saturated without hiding gameplay. */
.brand-icon{color:#43e4ff;background:#123f66;border-color:#64d6f666;box-shadow:inset 0 1px 0 #b4f5ff35,inset 0 -4px 0 #06294480}
.top-status i,.arena-foot i{background:#a8ec4b;box-shadow:0 0 8px #9ce23845}
.arena{background:#00a7c9;border-color:#78dcf4;box-shadow:0 26px 70px #00000045,0 0 0 5px #073255,0 0 0 6px #65c6e72e}
.hud{background:linear-gradient(#082d51f5 0,#154e7494 65%,transparent)}
.wallet strong,.bottom-hud strong{color:#ffe07a;text-shadow:0 2px 0 #06224888}
.progress-track i{background:linear-gradient(90deg,#ffae25,#ffe37c)}
.group-badge{background:#073d68f5;border-color:#3cd5fb70;box-shadow:inset 0 1px 0 #72eaff24,0 5px 15px #032f5240}
.group-badge svg{color:#5be3ff}.group-badge span{color:#c0eaf8}
.icon-button{background:#0b3d658c;border-color:#84dcff66;box-shadow:inset 0 1px 0 #b4ecff26,inset 0 -2px 0 #07274066}
.icon-button:hover{background:#15537ddb}.bottom-hud{background:#092f51f5;border-color:#72d0e060}
.primary{background:linear-gradient(#c9f36b,#8fda37);border-color:#a9df52;border-bottom-color:#559823;box-shadow:inset 0 1px 0 #efffb3,0 5px 0 #345f221c,0 9px 18px #466b2129;color:#1d3d12}
.screen{border-color:#fff7db;box-shadow:0 20px 65px #0525436b,inset 0 1px 0 #fff}
.intro-art{border-bottom-color:#ffd34f}.intro-body h2 em{color:#057997}
.island.active{background:#184e6a57;border-color:#5ea9ce50}.island.active>b{background:#5d491f;border-color:#ffce5c85;color:#ffe093}
.gate-example b{background:#09648a;border-color:#51d5ef;border-top-color:#a0f5ff;border-bottom-color:#064063;color:#ecffff}
.boss-health-track i{background:linear-gradient(90deg,#ff4e58,#ffb649)}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}


/* The platform owns entry, receipt and balances. Preserve the arena artwork. */
.connection-note{position:fixed;left:50%;bottom:max(18px,env(safe-area-inset-bottom));transform:translateX(-50%);z-index:2147483598;padding:14px 18px;max-width:90vw;width:max-content;background:#092f51;color:#fff;border:1px solid #ffd052;border-radius:12px;text-align:center;font:600 14px/1.5 system-ui;pointer-events:none}
.connection-guard{position:fixed;inset:0;max-width:440px;width:calc(100% - 32px);padding:28px;background:#092f51;color:#fff;border:1px solid #ffd052;border-radius:18px;z-index:2147483599;font:16px/1.5 system-ui;text-align:center}
.connection-guard::backdrop{background:#041425aa;backdrop-filter:blur(3px)}
.connection-guard h2{font-size:23px}.connection-guard .primary{width:100%}
.arena-foot a{color:#c8efff;text-decoration:none;font-size:12px;min-height:44px;display:inline-flex;align-items:center}
.icon-button{width:44px;height:44px;min-width:44px;min-height:44px}
@media(max-width:800px){.layout{display:block;width:100%;margin:0;padding:0}.game-column{padding:0}.hud{padding-top:max(16px,env(safe-area-inset-top))}.arena{width:100%;min-height:0;height:100dvh;max-height:100dvh;border:0;border-radius:0;box-shadow:none}.bottom-hud{bottom:max(14px,env(safe-area-inset-bottom))}.group-badge,.boss-hud{top:calc(111px + env(safe-area-inset-top))}.site-header,.arena-foot,.briefing,.field-notes,.site-footer{display:none}}