@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@500;600;700;800&family=DM+Sans:wght@400;500;600;700&display=swap');
:root{color-scheme:dark;--bg:#10110f;--panel:#171916;--panel2:#1d201b;--line:#30352d;--text:#e8e9df;--muted:#92988b;--acid:#c5d36b;--rust:#a95f42;--display:'Barlow Condensed',Impact,sans-serif;--body:'DM Sans',-apple-system,BlinkMacSystemFont,sans-serif}
*{box-sizing:border-box}html{min-height:100%;background:var(--bg)}body{margin:0;color:var(--text);font-family:var(--body);background:radial-gradient(ellipse at 72% 0%,#292d1c 0,transparent 35%),var(--bg);min-height:100vh}a{color:inherit;text-decoration:none}button{font:inherit}.app-frame{min-height:100vh;display:grid;grid-template-columns:238px minmax(0,1fr)}.rail{position:fixed;inset:0 auto 0 0;width:238px;padding:28px 18px 20px;background:#121410;border-right:1px solid var(--line);display:flex;flex-direction:column;z-index:5}.brand{display:flex;align-items:center;gap:12px;padding:2px 9px 42px;font:800 23px var(--display);letter-spacing:.08em}.brand small{display:block;color:var(--muted);font:600 9px var(--body);letter-spacing:.22em;margin-top:2px}.brand-mark{width:38px;height:38px;display:grid;place-items:center;border:1px solid var(--acid);color:var(--acid);font:800 25px var(--display);transform:rotate(-5deg)}.nav-list{display:grid;gap:7px}.nav-list a,.mobile-nav a{display:flex;align-items:center;gap:13px;padding:13px 14px;border:1px solid transparent;border-radius:5px;color:#aeb3a7;font-size:13px;font-weight:600;letter-spacing:.02em}.nav-list a span{width:20px;text-align:center;font-size:18px;color:#7e8675}.nav-list a[aria-current=page]{background:#25291d;border-color:#414a2c;color:var(--text)}.nav-list a[aria-current=page] span{color:var(--acid)}.rail-bottom{margin-top:auto;padding:14px 9px 0;border-top:1px solid var(--line);font:700 9px var(--body);letter-spacing:.13em;color:var(--acid)}.rail-bottom small{display:block;color:var(--muted);font-size:8px;line-height:1.6;margin:9px 0 0 15px}.status-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--acid);margin-right:8px;box-shadow:0 0 12px #c5d36b66}.main{grid-column:2;min-width:0;min-height:100vh;padding:0 44px;display:flex;flex-direction:column}.topbar{height:76px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.crumb{display:flex;gap:11px;align-items:center;color:var(--muted);font-size:10px;font-weight:700;letter-spacing:.17em}.crumb b{color:#555d4e}.crumb span:last-child{color:var(--acid)}.account-chip{display:flex;align-items:center;gap:10px;padding:7px 11px;border:1px solid var(--line);background:#171a15;border-radius:4px}.avatar{width:30px;height:30px;display:grid;place-items:center;background:#2b3022;color:var(--acid);font:700 16px var(--display)}.account-chip b,.account-chip small{display:block}.account-chip b{font-size:11px}.account-chip small{font-size:9px;color:var(--muted);margin-top:3px}.account-chip i{font-style:normal;color:var(--muted);margin-left:7px}.view{width:min(1120px,100%);margin:0 auto;padding:42px 0 54px;flex:1;outline:none}.eyebrow{font-size:10px;font-weight:700;letter-spacing:.2em;color:var(--acid);text-transform:uppercase}.hero{position:relative;overflow:hidden;min-height:290px;padding:37px 40px;border:1px solid #454b35;background:linear-gradient(110deg,#272d20 0%,#1a1d17 54%,#171a15 100%);display:flex;align-items:flex-end}.hero:after{content:"R";position:absolute;right:8%;top:-90px;font:800 420px/.95 var(--display);color:#d0dc7a0a;transform:rotate(-12deg);pointer-events:none}.hero-copy{position:relative;z-index:1;max-width:590px}.hero h1{font:800 clamp(58px,9vw,100px)/.82 var(--display);letter-spacing:-.025em;margin:18px 0 15px}.hero p{max-width:480px;color:#b3b8aa;font-size:13px;line-height:1.7;margin:0}.hero-action{display:inline-flex;margin-top:18px;align-items:center;justify-content:center;padding:11px 16px;background:var(--acid);color:#171a12;font-size:10px;font-weight:800;letter-spacing:.12em}.hero-tag{position:absolute;right:28px;bottom:26px;color:#7f8871;font:700 9px var(--body);letter-spacing:.2em}.section-head{display:flex;justify-content:space-between;align-items:end;margin:38px 0 15px}.section-head h2{font:700 28px var(--display);letter-spacing:.04em;margin:5px 0 0}.section-head p{font-size:11px;color:var(--muted);margin:0}.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.tile{min-height:150px;padding:20px;background:linear-gradient(145deg,#1c2019,#171a15);border:1px solid var(--line);position:relative;display:flex;flex-direction:column;justify-content:space-between}.tile .symbol{font:700 28px var(--display);color:#aebd5d}.tile h3{font:700 22px var(--display);letter-spacing:.04em;margin:14px 0 5px}.tile p{font-size:11px;color:var(--muted);line-height:1.55;margin:0;max-width:260px}.tile .state{align-self:flex-start;margin-top:16px;padding:5px 7px;border:1px solid #444a3b;color:#b5bc9b;font-size:8px;font-weight:700;letter-spacing:.12em}.tile.locked{opacity:.78}.tile.locked .state{color:#c18b72;border-color:#624332}.notice{margin-top:18px;padding:17px 19px;border-left:2px solid var(--rust);background:#211a16;color:#bcb0a5;font-size:11px;line-height:1.7}.notice strong{color:#e0c3ae}.page-title{font:800 clamp(44px,7vw,70px)/.9 var(--display);margin:13px 0}.page-lead{max-width:620px;color:#aab0a2;font-size:13px;line-height:1.7}.empty-panel{margin-top:26px;padding:28px;border:1px dashed #454b3b;background:#171a15}.empty-panel h2{font:700 26px var(--display);margin:0 0 8px}.empty-panel p{font-size:12px;line-height:1.7;color:var(--muted);max-width:620px;margin:0}.empty-panel .state{display:inline-block;margin-top:17px;padding:6px 8px;background:#282b20;color:var(--acid);font-size:9px;font-weight:700;letter-spacing:.13em}.footer{height:48px;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;color:#687061;font-size:8px;font-weight:700;letter-spacing:.14em}.mobile-nav{display:none}
@media(max-width:900px){.app-frame{grid-template-columns:190px minmax(0,1fr)}.rail{width:190px}.main{padding:0 26px}.grid{grid-template-columns:repeat(2,minmax(0,1fr))}.hero{min-height:260px;padding:28px}.hero-tag{display:none}}
@media(max-width:640px){.app-frame{display:block}.rail{display:none}.main{padding:0 18px 76px}.topbar{height:62px}.account-chip{padding:5px 7px}.account-chip small{display:none}.account-chip i{display:none}.view{padding:28px 0 35px}.hero{min-height:270px;padding:24px 20px}.hero h1{font-size:68px}.hero p{font-size:12px}.grid{grid-template-columns:1fr;gap:9px}.tile{min-height:125px;padding:17px}.section-head{margin-top:30px}.section-head h2{font-size:25px}.footer{font-size:7px;gap:10px}.footer span:last-child{text-align:right}.mobile-nav{position:fixed;z-index:10;inset:auto 0 0;display:grid;grid-template-columns:repeat(5,1fr);padding:7px 5px calc(7px + env(safe-area-inset-bottom));background:#121410f5;border-top:1px solid var(--line);backdrop-filter:blur(12px)}.mobile-nav a{justify-content:center;flex-direction:column;gap:3px;padding:6px 2px;font-size:9px;color:#9da494}.mobile-nav a span{font-size:17px}.mobile-nav a[aria-current=page]{color:var(--acid)}}
@media(prefers-reduced-motion:no-preference){.tile{transition:border-color .18s ease,transform .18s ease}.tile:hover{border-color:#68734a;transform:translateY(-2px)}}

.profile-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:25px}.profile-card{padding:22px;border:1px solid var(--line);background:var(--panel)}.profile-card strong,.profile-card small{display:block}.profile-card strong{font:700 30px var(--display);margin:13px 0 5px}.profile-card small{color:var(--muted);font-size:11px}.account-chip{cursor:pointer;color:inherit;font:inherit}.account-chip:hover{border-color:#68734a}.account-dialog{width:min(460px,calc(100vw - 28px));max-height:min(88vh,760px);overflow:auto;padding:24px;background:#171a15;color:var(--text);border:1px solid #515a40;box-shadow:0 24px 90px #000b}.account-dialog::backdrop{background:#050604c9;backdrop-filter:blur(5px)}.dialog-head{display:flex;align-items:start;justify-content:space-between}.dialog-head h2{font:700 34px var(--display);margin:6px 0 0}.close-button{border:1px solid var(--line);background:transparent;color:var(--text);font-size:24px;width:34px;height:34px;cursor:pointer}.account-dialog p{font-size:12px;line-height:1.6;color:#aab0a2}.account-dialog p[data-kind=error]{color:#e49a7d}.account-dialog p[data-kind=success]{color:var(--acid)}.account-dialog label{display:block;margin:14px 0 6px;color:#aab0a2;font-size:9px;font-weight:700;letter-spacing:.15em}.account-dialog input{width:100%;padding:12px;background:#10120f;border:1px solid var(--line);color:var(--text);border-radius:2px;font:13px var(--body)}.primary-button,.secondary-button{width:100%;padding:13px 12px;margin-top:12px;border:1px solid var(--acid);background:var(--acid);color:#171a11;font-size:10px;font-weight:800;letter-spacing:.12em;cursor:pointer}.secondary-button{background:#24291e;color:var(--acid);border-color:#465037}.primary-button:disabled,.secondary-button:disabled{opacity:.42;cursor:not-allowed}.text-button{display:block;width:100%;padding:12px;margin-top:9px;border:0;background:transparent;color:#aebd5d;font-size:10px;font-weight:700;letter-spacing:.1em;cursor:pointer}.form-divider{display:flex;align-items:center;gap:12px;margin:17px 0;color:#78806f;font-size:9px;letter-spacing:.14em}.form-divider:before,.form-divider:after{content:"";height:1px;flex:1;background:var(--line)}.link-actions{margin-top:22px;padding-top:18px;border-top:1px solid var(--line)}.link-actions small{display:block;margin-top:10px;color:var(--muted);font-size:10px;line-height:1.5}.rail-bottom small[data-state=ready]{color:var(--acid)}.rail-bottom small[data-state=error]{color:#e49a7d}.account-dialog [hidden]{display:none!important}
@media(max-width:640px){.profile-grid{grid-template-columns:1fr}.account-dialog{padding:20px}.account-chip{max-width:190px}.account-chip b{max-width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}}

/* Playable Eliteborn Formation Lab */
.lab-head{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:22px}.lab-head .page-title{margin-bottom:8px}.lab-head .page-lead{margin:0;max-width:720px}.lab-head .primary-button{white-space:nowrap}
.lab-status{display:flex;flex-wrap:wrap;gap:8px;margin:18px 0;padding:12px;background:#171a15;border:1px solid var(--line)}.lab-status span{padding:6px 9px;background:#25291e;color:#c8d18b;font-size:9px;font-weight:700;letter-spacing:.1em}
.battlefield{padding:17px;background:linear-gradient(145deg,#1a1e17,#11130f);border:1px solid #3c4331}.side-label{display:flex;justify-content:space-between;color:#d8dec0;font:700 13px var(--display);letter-spacing:.08em}.side-label span{color:var(--acid)}.board-row{display:flex;align-items:stretch;gap:9px;min-height:100px;padding:12px 0;flex-wrap:wrap}.board-unit{min-width:110px;max-width:160px;flex:1 1 110px;display:flex;flex-direction:column;gap:6px;padding:11px;background:#22271e;border:1px solid #49523a;color:var(--text);text-align:left;cursor:pointer}.board-unit strong{font:700 16px var(--display)}.board-unit span,.board-unit small{font-size:8px;letter-spacing:.12em;color:#a9b27c}.board-unit b{font:800 23px var(--display);color:var(--acid)}.board-unit.spent{opacity:.52}.board-unit.chosen,.board-unit.attacker{border:2px solid var(--acid);background:#303722}.board-unit.formed{background:#30291d;border-color:#9b8050}.board-empty{align-self:center;padding:18px;color:#777f6d;font-size:11px;border:1px dashed #3d4434;width:100%;text-align:center}.battle-divider{text-align:center;padding:9px;border-top:1px solid #343b2c;border-bottom:1px solid #343b2c;color:#7f8a6d;font:700 9px var(--body);letter-spacing:.2em}
.lab-controls{display:flex;justify-content:space-between;align-items:end;gap:14px;margin:24px 0 12px}.lab-controls p{margin:6px 0 0;color:var(--muted);font-size:11px}.control-row{display:flex;gap:8px;flex-wrap:wrap}.lab-controls button,.lab-head button{min-height:40px}.hand-row{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:9px;align-items:stretch}.hand-card{padding:0;border:1px solid transparent;background:transparent;text-align:left;cursor:pointer;min-width:0}.hand-card.active{border:2px solid var(--acid);background:#252a1d}.tcg-card{min-height:260px;padding:8px;background:linear-gradient(155deg,#343a2d,#181b16 65%);border:1px solid #6b7255;display:flex;flex-direction:column;position:relative;overflow:hidden}.tcg-card.formation{border-color:#a68b57;background:linear-gradient(155deg,#393322,#191a14 65%)}.tcg-meta{display:flex;justify-content:space-between;font-size:8px;font-weight:800;color:var(--acid)}.tcg-art{height:74px;margin:7px 0;background:radial-gradient(ellipse at 50% 30%,#69764a,#252d20 58%,#12140f);display:grid;place-items:center;position:relative}.tcg-art span{position:absolute;top:5px;left:5px;font-size:7px;letter-spacing:.12em;color:#d8dfaa}.tcg-art b{font:800 55px var(--display);color:#d5dfa0;opacity:.8}.tcg-card h3{font:700 17px/.95 var(--display);margin:3px 0 5px}.tcg-type{font-size:7px;letter-spacing:.15em;color:#b7c27c}.tcg-card p{font-size:8px;line-height:1.35;color:#c3c9b9;margin:7px 0;flex:1}.tcg-stats{display:flex;align-items:baseline;justify-content:space-between;border-top:1px solid #525a43;padding-top:5px;font:800 17px var(--display);color:#e6e9d7}.tcg-stats small{font:600 7px var(--body);color:#9da78a}.tcg-stats i{font:600 7px var(--body);font-style:normal;color:#8e967d}.tcg-card.small{min-height:190px;padding:6px}.tcg-card.small .tcg-art{height:42px;margin:5px 0}.tcg-card.small .tcg-art b{font-size:35px}.tcg-card.small h3{font-size:14px}.tcg-card.small p{font-size:7px;line-height:1.25}.tcg-card.small .tcg-stats{font-size:14px}
.lab-lower{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:18px}.lab-rules,.lab-log{padding:17px;background:#171a15;border:1px solid var(--line)}.lab-rules ul{padding-left:18px;color:#b5bca7;font-size:10px;line-height:1.8}.lab-warning{padding:10px;background:#281e17;border-left:2px solid #b37b55;color:#c9a98d;font-size:9px;line-height:1.6}.lab-log p{font-size:9px;line-height:1.5;color:#aeb6a0;border-bottom:1px solid #292f25;padding:6px 0;margin:0}.lab-log small{color:var(--acid);margin-right:7px}.lab-message{position:sticky;bottom:10px;margin-top:15px;padding:12px;background:#2a3020;border:1px solid #59653b;color:#d9e2ae;font-size:11px;z-index:3}
@media(max-width:760px){.lab-head{align-items:start;flex-direction:column}.lab-status{gap:5px}.lab-status span{font-size:8px}.hand-row{grid-template-columns:repeat(2,minmax(0,1fr))}.tcg-card.small{min-height:205px}.lab-controls{align-items:start;flex-direction:column}.control-row{width:100%}.control-row button{flex:1}.lab-lower{grid-template-columns:1fr}.board-unit{min-width:calc(50% - 6px);max-width:none}.lab-head .primary-button{width:100%}}
