:root{color-scheme:dark;--bg:#101218;--sidebar:#12151b;--panel:#191d25;--panel-light:#1e232c;--line:#2a2e38;--text:#f0f1f4;--muted:#8b929f;--green:#b5f578;--blue:#7dcfff;--red:#f0948a;--radius:12px;font-family:Inter,"Segoe UI",Arial,sans-serif;font-size:14px}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text)}button,input,select{font:inherit}button,a,input,select{-webkit-tap-highlight-color:transparent}button,a{touch-action:manipulation}button{cursor:pointer}button,a{color:inherit}button{border:0;background:none}button:disabled{cursor:not-allowed;opacity:.42}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--green);outline-offset:4px}a{text-decoration:none}h1,h2,h3,p{margin:0}svg{width:20px;height:20px;display:block;stroke-width:1.65}span[data-icon]{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0}input,select{width:100%;border:1px solid #373d49;border-radius:7px;background:#11151c;color:var(--text);padding:13px 14px;min-width:0}label{display:block;color:#b8bec9;font-size:14px;font-weight:500;margin:20px 0 9px}[hidden]{display:none!important}.app-shell{min-height:100vh;display:flex}.sidebar{width:222px;position:fixed;inset:0 auto 0 0;background:var(--sidebar);border-right:1px solid #242832;padding:32px 18px 20px;display:flex;flex-direction:column;z-index:20}.brand{display:flex;align-items:center;gap:11px;font-size:30px;font-weight:850;letter-spacing:-1.2px;margin:0 12px 46px}.brand-mark{display:grid;place-items:center;width:37px;height:37px;background:var(--green);color:#182317;border-radius:9px;font-size:30px;line-height:1}.brand-name{font-size:22px;line-height:1;letter-spacing:-.6px}.brand-mark{flex-shrink:0}.sidebar-label{font-size:10px;font-weight:650;letter-spacing:1.4px;color:#707989;margin:0 12px 15px}.navigation{display:grid;gap:7px}.nav-item{display:flex;align-items:center;gap:12px;width:100%;padding:13px 14px;border-radius:7px;color:#9ba3b1;text-align:left;font-weight:550;transition:background .15s}.nav-item:hover{background:#20262d;color:var(--text)}.nav-item.active{color:var(--green);background:#283626;box-shadow:inset 3px 0 var(--green)}.nav-item.active svg{stroke-width:2}.nav-arrow{margin-left:auto;font-size:19px}.small-tag{font-size:10px;letter-spacing:.7px;background:#252a34;border:1px solid #353a45;border-radius:4px;padding:4px 6px;color:#abb3c1}.nav-item .small-tag{margin-left:auto}.sidebar-rule{height:1px;background:#252a32;margin:26px 12px}.sidebar-bottom{margin-top:auto;padding-top:55px}.campfire{margin:0 12px 26px}.campfire>span{color:#b5f578;display:block;font-size:30px;margin-bottom:12px}.campfire strong{font-size:12px;font-weight:600}.campfire p{color:#717d8d;font-size:12px;line-height:1.8;margin-top:9px}.help-link{display:flex;gap:12px;align-items:center;width:100%;padding:14px 12px;color:#979fae;font-size:12px}.help-link kbd{margin-left:auto}.version{border-top:1px solid var(--line);padding:17px 12px 0;display:flex;justify-content:space-between;color:#647083;font-size:8px;letter-spacing:.8px}.version span{font-size:9px;color:#6d8762}.workspace{margin-left:222px;width:calc(100% - 222px)}.topbar{height:76px;border-bottom:1px solid #252933;display:flex;align-items:center;justify-content:space-between;padding:0 40px;gap:16px}.breadcrumb{color:#6e7888;font-size:12px;display:flex;gap:17px;align-items:center}.breadcrumb strong{font-weight:500;color:#b5bcc8}.breadcrumb>span{color:#434b5b}.topbar-right{display:flex;align-items:center;gap:22px;font-size:12px}.connection{display:flex;align-items:center;gap:7px;color:#8a929f}.connection i{height:6px;width:6px;border-radius:50%;background:#8591a0}.connection.online i{background:var(--green);box-shadow:0 0 9px #b5f53055}.connection.offline{color:var(--red)}.top-divider{width:1px;height:22px;background:var(--line)}.gold-balance{display:flex;align-items:center;gap:7px;color:#ebce83}.gold-balance svg{width:16px;height:16px}.gold-balance b{font-weight:600}.user-button{display:flex;align-items:center;gap:9px;font-size:12px}.tiny-avatar{height:29px;width:29px;display:grid;place-items:center;background:#2e3e33;border:1px solid #526447;border-radius:6px;color:var(--green);font-weight:750}.chevron{margin-left:4px;color:#8893a4}.page{padding:36px 40px 20px;max-width:1760px;margin:0 auto}.page-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:29px}.eyebrow{font-size:10px;letter-spacing:1.8px;color:#9aa993;font-weight:600;margin-bottom:12px;display:flex;gap:7px;align-items:center}.eyebrow>span{width:5px;height:5px;background:var(--green)}h1{font-size:clamp(26px,2.6vw,39px);font-weight:720;letter-spacing:-1.3px;line-height:1.15}h1>span{color:var(--green)}.page-heading p{font-size:13px;color:var(--muted);margin-top:12px;line-height:1.6}.heading-actions{display:flex;gap:9px;padding-top:14px}.button{background:#242a32;border:1px solid #3b424b;border-radius:7px;display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:40px;padding:10px 15px;font-size:12px;font-weight:650;transition:background .15s,transform .15s;white-space:nowrap}.button:hover{background:#303841}.button:active{transform:translateY(1px)}.button svg{width:16px;height:16px}.button.primary{background:var(--green);border-color:var(--green);color:#1c2c15}.button.primary:hover{background:#c4ff92}.button.subtle{background:transparent;border-color:#313744;color:#b0b8c6}.button.full-width{width:100%;justify-content:space-between}.arena-layout{display:grid;grid-template-columns:minmax(0,1fr) 258px;gap:23px}.arena-column{min-width:0}.arena-card{border:1px solid #343b44;border-radius:12px;overflow:hidden;background:var(--panel)}.arena-toolbar{height:67px;padding:0 20px;display:flex;justify-content:space-between;align-items:center}.arena-location{display:flex;align-items:center;gap:11px}.location-icon{color:#a5bd9d;background:#273329;border:1px solid #3b483b;border-radius:6px;width:34px;height:34px}.arena-location strong{font-size:13px;font-weight:600;display:block}.arena-location div>span{font-size:9px;letter-spacing:1.3px;color:#828e9f;margin-top:6px;display:block}.arena-toolbar-right{display:flex;align-items:center;gap:14px}.arena-status{font-size:9px;letter-spacing:1.2px;padding:6px 8px;background:#252d30;border:1px solid #364345;color:#9aa8aa;border-radius:4px}.arena-status.fighting{color:var(--green);border-color:#526547;background:#2a3825}.icon-button{display:inline-flex;justify-content:center;align-items:center;width:30px;height:30px;border-radius:5px;color:#8e99a8;flex-shrink:0}.icon-button:hover{color:var(--text);background:#303642}.icon-button svg{width:17px;height:17px}.game-stage{position:relative;width:100%;aspect-ratio:2.4;overflow:hidden;background:#14212c;isolation:isolate}.game-stage canvas{display:block;width:100%;height:100%;image-rendering:pixelated;image-rendering:crisp-edges}.game-stage:fullscreen{display:flex;align-items:center;justify-content:center;width:100vw;height:100vh;background:#101218;aspect-ratio:auto}.game-stage:fullscreen canvas{max-height:100vh;object-fit:contain}.stage-caption{position:absolute;inset:0;display:grid;place-items:center;padding:20px;pointer-events:none;background:#0c151b55;color:var(--text);font-size:clamp(20px,3vw,38px);text-align:center;text-shadow:0 2px 12px #081018,0 1px 2px #081018}.stage-caption .stage-start{pointer-events:auto;min-height:56px;padding:14px 26px;font-size:clamp(18px,2vw,26px);font-weight:750;letter-spacing:-.4px;box-shadow:0 6px 24px #08101866}.pixel-diamond{color:var(--green);font-size:9px}.arena-footer{min-height:43px;padding:8px 16px;display:flex;justify-content:space-between;align-items:center;gap:10px;border-top:1px solid #343b44}.arena-hint{display:flex;gap:8px;align-items:center;color:#a3acb8;font-size:10px;line-height:1.5}.arena-hint svg{width:13px;height:13px;color:#8f9d86}.arena-footer-actions{display:flex;gap:8px;align-items:center}.server-tick{font:9px Consolas,monospace;color:#788677;border-left:1px solid #394334;padding-left:9px;white-space:nowrap}.section-label{font-size:10px;letter-spacing:1.4px;color:#909cab;font-weight:600;display:flex;justify-content:space-between;align-items:center}.section-label>span{font:9px Consolas,monospace;color:#525e70}.mode-section{margin-top:25px}.mode-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:13px}.mode-card{position:relative;background:var(--panel);border:1px solid #303540;border-radius:9px;padding:17px 15px 12px;text-align:left;display:grid;grid-template-columns:1fr auto;transition:border-color .15s,background .15s;min-width:0}.mode-card:hover{border-color:#687465;background:#232b29}.mode-card.selected{border-color:#607e49;background:#232e24}.mode-icon{width:33px;height:32px;color:#b2bbc6;grid-column:1}.mode-card.selected .mode-icon{color:var(--green)}.mode-icon svg{width:25px;height:25px}.mode-copy{display:block;grid-column:1/-1;margin-top:12px}.mode-copy strong{display:block;font-size:12px;font-weight:650;letter-spacing:-.1px}.mode-copy small{display:block;font-size:10px;color:#929cac;margin-top:7px;line-height:1.5}.mode-arrow{grid-row:1;grid-column:2;font-size:20px;color:#839182}.mode-card.selected .mode-arrow{color:var(--green)}.mode-meta{display:flex;justify-content:space-between;margin-top:21px;font-size:8px;letter-spacing:1.1px;color:#7c8993;grid-column:1/-1}.mode-meta i{font:10px Consolas,monospace}.mode-card.selected .mode-meta{color:#a2c18c}.controls-strip{display:flex;align-items:center;gap:17px;flex-wrap:wrap;margin-top:25px;padding:19px 0 0;border-top:1px solid #282e39}.controls-heading{color:#687383}.controls-strip>div{display:flex;align-items:center;gap:4px;font-size:9px;color:#8893a3}.controls-strip>div>span{margin-left:3px}.controls-strip svg{width:18px;height:18px}kbd{font:9px Consolas,"Courier New",monospace;display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:21px;padding:0 5px;border:1px solid #3a424f;border-bottom-width:2px;border-radius:4px;color:#c0c7d2;background:#212631;white-space:nowrap}.panel{background:var(--panel);border:1px solid #303640;border-radius:11px}.panel-heading{display:flex;align-items:center;justify-content:space-between;gap:8px}.panel-heading h2{font-size:13px;font-weight:600;letter-spacing:-.2px}.hero-panel{padding:15px 18px 17px}.hero-portrait{height:123px;position:relative;display:flex;justify-content:center;margin:0 -5px 9px;background:radial-gradient(ellipse at 50% 70%,#37483155,transparent 65%)}.portrait-grid{position:absolute;inset:15px 15px 0;background-image:linear-gradient(#7285650e 1px,transparent 1px),linear-gradient(90deg,#7285650e 1px,transparent 1px);background-size:16px 16px;mask-image:radial-gradient(ellipse,#000,transparent 75%)}.hero-portrait canvas{height:123px;width:134px;position:relative;image-rendering:pixelated}.hero-class{font:8px Consolas,monospace;letter-spacing:1.5px;color:#8ea082}.hero-portrait .hero-class{position:absolute;bottom:0;background:#263024;border:1px solid #3d4b35;border-radius:3px;padding:4px 7px}.hero-name-row{display:flex;justify-content:space-between;gap:8px;align-items:center;margin-top:16px}.hero-name-row h3{font-size:17px;font-weight:650;overflow:hidden;text-overflow:ellipsis}.level-badge{display:inline-block;font:9px Consolas,monospace;color:var(--green);border:1px solid #495d3c;border-radius:4px;background:#2b3626;padding:5px 6px;white-space:nowrap}.xp-label{display:flex;justify-content:space-between;gap:5px;font-size:9px;color:#7b8799;margin-top:16px}.xp-label b{font:9px Consolas,monospace;color:#a0a8b6}.xp-track{height:4px;background:#30353f;border-radius:3px;margin-top:9px;overflow:hidden}.xp-track i{display:block;width:0;height:100%;background:var(--green);transition:width .3s}.hero-stats{display:grid;grid-template-columns:repeat(3,1fr);margin-top:20px}.hero-stats>div{display:grid;justify-items:center;gap:6px;border-right:1px solid #303742}.hero-stats>div:last-child{border:0}.hero-stats svg{width:14px;height:14px;color:#adbba2}.hero-stats b{font:14px Consolas,monospace;color:#d5dbe2}.hero-stats small{font-size:9px;color:#7c8799}.hero-manage{margin-top:20px;min-height:35px;font-size:10px;color:#c4cdba;border-color:#3c4639;background:#242d23}.hero-manage>span{margin-left:auto}.lobby-panel{margin-top:18px;padding:19px 18px 13px}.count-badge{font:10px Consolas,monospace;background:#2c3631;color:#a4c39d;padding:3px 6px;border-radius:4px}.panel-subtitle{font-size:10px;color:#748196;margin-top:7px}.player-list{margin-top:15px}.player-row{display:flex;gap:9px;align-items:center;margin-top:14px;min-width:0}.player-avatar{display:grid;place-items:center;height:30px;width:30px;flex-shrink:0;border:1px solid #495849;border-radius:6px;color:var(--player-color);background:color-mix(in srgb,var(--player-color) 10%,#192028);font-weight:650}.player-info{min-width:0;flex:1}.player-info strong{display:block;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:500}.player-info small{font-size:9px;display:block;color:#768596;margin-top:4px}.player-row .challenge-button{font-size:10px;color:var(--green);padding:7px 0 7px 5px}.you-tag{font-size:8px;color:#788674}.lobby-invite{width:100%;justify-content:center;font-size:10px!important;margin-top:19px;padding-top:13px!important;border-top:1px solid #303742!important}.text-button{font-size:11px;color:#aab79e;display:inline-flex;align-items:center;gap:6px;padding:5px 2px}.text-button:hover{color:var(--green)}.text-button svg{width:13px;height:13px}.empty-lobby{font-size:11px;color:#929cab;line-height:1.7;padding:8px 0}.challenge-box{margin-top:15px;padding:12px;background:#263824;border:1px solid #587946;border-radius:6px;font-size:11px;line-height:1.6}.challenge-box>div{display:flex;gap:8px;margin-top:9px}.challenge-box .button{min-height:30px;padding:6px 9px;font-size:10px}.page-footer{display:flex;justify-content:space-between;gap:15px;border-top:1px solid #252b36;margin-top:34px;padding-top:18px;color:#637083;font-size:9px;line-height:1.6}.footer-diamond{color:#8fa477;padding-right:7px}.match-hud{position:absolute;top:19px;left:25px;right:25px;display:flex;justify-content:space-between;gap:15px;pointer-events:none;text-shadow:1px 2px #09131c}.fighter-hud{width:34%;font-size:11px;color:#eff5e8}.fighter-hud.opponent{text-align:right}.fighter-hud>span{font-weight:650}.health-track{height:8px;border:2px solid #0d1720;margin-top:8px;background:#303444;box-shadow:0 1px 0 #64737655}.health-track i{display:block;height:100%;background:var(--green);transition:width .1s}.opponent .health-track i{background:#f09c83;float:right}.fighter-hud small{display:block;margin-top:4px;color:#a6bbb1;font:9px Consolas,monospace}.match-clock{text-align:center;display:flex;flex-direction:column}.match-clock strong{font:23px Consolas,monospace;letter-spacing:2px}.match-clock>span{font-size:7px;letter-spacing:1.2px;margin-top:4px;color:#acbcb6}.match-result{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#0e181cd9;backdrop-filter:blur(3px);padding:20px;text-align:center}.match-result>span{color:var(--green);letter-spacing:3px;font:9px Consolas,monospace}.match-result strong{font-size:36px;letter-spacing:-1px;margin-top:12px}.match-result p{font-size:12px;color:#a4b4af;margin:10px 0 19px;line-height:1.6}.touch-controls{display:none;justify-content:space-between;gap:10px;margin-top:14px}.touch-controls>div{display:flex;gap:6px}.touch-controls button{border:1px solid #465146;background:#252e27;border-radius:7px;padding:15px 11px;color:#d4e3cf;touch-action:none;font-size:11px;user-select:none}.touch-controls button.pressed{background:var(--green);color:#172713}.adventure-hero{border:1px solid #3b4943;border-radius:14px;overflow:hidden;background:var(--panel)}.adventure-art{height:320px;overflow:hidden}.adventure-art canvas{width:100%;height:100%;object-fit:cover;image-rendering:pixelated}.adventure-info{padding:30px}.chapter-tag{font-size:10px;letter-spacing:1.5px;color:var(--green)}.adventure-info h2{font-size:28px;letter-spacing:-1px;margin-top:13px}.adventure-info p{font-size:14px;color:#98a5b2;margin-top:12px;line-height:1.8}.expedition-details{display:flex;flex-wrap:wrap;gap:25px;margin:24px 0;color:#b3bcbf;font-size:12px}.expedition-details>span{display:flex;gap:7px;align-items:center}.expedition-details svg{height:16px;width:16px;color:#a5c691}.adventure-info>small{display:block;margin-top:14px;color:#728294;font-size:11px}.tips-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:24px}.tip-card{padding:24px}.tip-card>span{font:10px Consolas,monospace;letter-spacing:1px;color:#9abd87}.tip-card h3{margin-top:16px;font-size:16px;line-height:1.5}.tip-card p{margin-top:11px;font-size:13px;color:#8f9cac;line-height:1.7}.hero-detail-grid{display:grid;grid-template-columns:310px 1fr;gap:24px}.character-sheet{text-align:center;padding:20px 28px 25px;background:radial-gradient(ellipse at 50% 23%,#33453166,transparent 60%),var(--panel)}.character-sheet canvas{display:block;margin:auto;image-rendering:pixelated;max-width:100%}.character-sheet .hero-class{font-size:10px}.character-sheet h2{margin:13px 0}.character-sheet .level-badge{font-size:11px}.record{display:grid;grid-template-columns:1fr 1fr;margin:25px 0;border-block:1px solid #343c44;padding:20px 0}.record div{display:grid;gap:7px}.record div+div{border-left:1px solid #343c44}.record b{font:24px Consolas,monospace;color:#c9debc}.record span{font-size:11px;color:#93a1af}.character-sheet p{font-size:11px;line-height:1.8;color:#7b8b9c}.upgrade-column{display:grid;gap:18px;align-content:start}.upgrade-card{padding:27px;display:flex;gap:20px;align-items:center;flex-wrap:wrap}.upgrade-icon{color:var(--green);background:#293c26;border:1px solid #465f3d;border-radius:8px;padding:17px}.upgrade-icon svg{width:27px;height:27px}.upgrade-icon.blue{background:#233242;border-color:#415267;color:var(--blue)}.upgrade-card>div{flex:1;min-width:200px}.upgrade-card h2{font-size:19px;margin-top:9px;letter-spacing:-.4px}.upgrade-card h2 span{color:var(--green);font-size:14px}.upgrade-card p{font-size:12px;color:#8d9bab;margin-top:9px}.upgrade-card .button{font-size:11px}.skill-description{display:flex;gap:20px;padding:24px}.skill-key{background:#3a314c;color:#c3a8ed;border:1px solid #706083;width:47px;height:47px;display:grid;place-items:center;font:22px Consolas,monospace;border-radius:7px;flex-shrink:0}.skill-description h3{font-size:15px}.skill-description p{font-size:12px;color:#96a2b3;line-height:1.7;margin-top:8px}.muted-note{font-size:11px;line-height:1.8;color:#8190a3}.stream-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:23px}.stream-setup,.obs-instructions{padding:28px}.stream-setup>h3{margin:21px 0 25px;font-size:23px;letter-spacing:-.7px}.copy-field{display:flex;gap:7px;margin-top:10px}.copy-field input{font:12px Consolas,monospace;background:#11171c}.copy-field .icon-button{width:43px;height:43px;background:#29332a;border:1px solid #414f3a;color:var(--green)}.checkbox-row{display:flex;align-items:center;gap:10px;font-size:12px}.checkbox-row input{width:16px;height:16px;accent-color:var(--green)}.obs-spec{background:#11171c;border:1px solid #303942;border-radius:7px;padding:15px;display:flex;justify-content:space-between;gap:12px;margin:22px 0}.obs-spec span{color:#8b9bae;font-size:11px}.obs-spec strong{display:block;margin-top:7px;font-size:12px;font-weight:500;color:#c2cdcf}.stream-setup>.muted-note{margin-top:17px}.obs-instructions{background:radial-gradient(ellipse at 100% 0,#35433055,transparent 65%),var(--panel)}.big-icon{color:var(--green);padding:15px;background:#2d3b29;border:1px solid #425738;border-radius:12px}.big-icon svg{width:27px;height:27px}.obs-instructions h2{font-size:26px;letter-spacing:-.6px;line-height:1.35;margin:22px 0}.obs-instructions ol{padding-left:22px;margin:0}.obs-instructions li{padding-left:8px;margin-top:24px;color:var(--green)}.obs-instructions li b{display:block;color:#dae3de;font-size:14px;font-weight:600}.obs-instructions li span{display:block;color:#8d9dae;font-size:12px;line-height:1.8;margin-top:6px}.section-heading{display:flex;justify-content:space-between;align-items:center;margin:30px 0 17px}.section-heading h2{font-size:17px}.rooms-list{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.room-list-card{padding:19px;display:flex;align-items:center;gap:12px}.room-list-card>div{flex:1;min-width:0}.room-list-card strong{display:block;font-size:14px}.room-list-card small{display:block;margin-top:8px;font:10px Consolas,monospace;color:#91a184}.room-list-card .button{font-size:10px;min-height:32px;padding:8px}.room-list-card>span{color:#9db58d}dialog{color:var(--text);border:1px solid #46533f;background:#1a2026;border-radius:15px;padding:30px;max-width:min(480px,calc(100vw - 28px));width:100%;box-shadow:0 25px 100px #0008}dialog::backdrop{background:#090e17c9;backdrop-filter:blur(4px)}.dialog-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:10px}.dialog-heading h2{font-size:24px;letter-spacing:-.7px;line-height:1.35}.dialog-heading .eyebrow{font-size:8px;line-height:1.6}.dialog-heading .icon-button{font-size:25px}.dialog-note{font-size:11px;color:#8f9aaa;line-height:1.7;margin:15px 0 0}.form-error{font-size:12px;color:#ffb2a1;min-height:19px;margin:12px 0}#creator-avatar{display:block;image-rendering:pixelated;margin:auto}#help-dialog p{font-size:13px;color:#a3adbb;line-height:1.8;margin:15px 0}#help-dialog p b{color:#d5dfcf}#help-dialog>.button{margin-top:20px}.help-controls{padding:10px 0 15px;margin:15px 0;border-block:1px solid #39434b}.help-controls p{display:flex;align-items:center;gap:6px}.help-controls p>span{margin-left:auto}.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);padding:15px 23px;border:1px solid #65794f;background:#253321;color:#e2efd7;border-radius:9px;z-index:1000;font-size:13px;box-shadow:0 10px 40px #0006;max-width:calc(100vw - 30px);line-height:1.5}.toast.error{background:#3b2626;color:#ffd5ce;border-color:#966155}body.overlay{background:transparent!important;overflow:hidden}body.overlay #app,body.overlay dialog{display:none!important}#overlay-root{width:100vw;height:100vh}#overlay-canvas{display:block;width:100%;height:100%;object-fit:contain;image-rendering:pixelated}#overlay-message{position:absolute;left:50%;top:10%;transform:translateX(-50%);font-size:14px;background:#111b25b0;color:#d6e0d4;border-radius:5px;padding:8px 14px}#overlay-message:empty{display:none}
@media(min-width:1600px){:root{font-size:16px}.sidebar{width:242px;padding-top:36px}.workspace{margin-left:242px;width:calc(100% - 242px)}.page{padding:43px 48px 22px}.arena-layout{grid-template-columns:minmax(0,1fr) 300px;gap:27px}.hero-portrait{height:150px}.hero-portrait canvas{height:150px;width:164px}.hero-panel{padding:20px 22px}.lobby-panel{padding:22px}.mode-card{padding:21px}.mode-copy strong{font-size:14px}.mode-copy small{font-size:12px}.hero-name-row h3{font-size:20px}.panel-heading h2{font-size:15px}.arena-location strong{font-size:15px}.button{font-size:13px}.hero-stats{margin-top:25px}.hero-stats b{font-size:16px}.hero-stats small,.xp-label,.player-info small{font-size:11px}.xp-label b{font-size:10px}.hero-manage{margin-top:23px;font-size:12px}.player-info strong{font-size:13px}.page-heading p{font-size:14px}.stage-caption{font-size:12px}.mode-meta{font-size:10px}.controls-strip>div{font-size:11px}.controls-strip{gap:20px}.arena-footer{min-height:46px}.arena-hint{font-size:11px}.page-footer{font-size:11px}}
@media(max-width:1200px){.sidebar{width:190px;padding-inline:12px}.workspace{margin-left:190px;width:calc(100% - 190px)}.brand{font-size:27px;margin-left:10px}.topbar{padding-inline:25px}.page{padding:28px 25px 20px}.arena-layout{grid-template-columns:minmax(0,1fr) 228px;gap:16px}.heading-actions .button{font-size:11px;padding-inline:10px}.page-heading{align-items:flex-start}.hero-panel{padding:14px}.controls-strip{gap:11px}.mode-grid{gap:8px}.mode-card{padding:13px 11px}.mode-copy strong{font-size:11px}.mode-copy small{font-size:9px}.mode-meta{font-size:7px}.arena-toolbar{padding:0 14px}.arena-status{font-size:8px}.game-stage{aspect-ratio:2.05}.game-stage canvas{object-fit:cover}.arena-hint{font-size:9px}.server-tick{display:none}.rooms-list{grid-template-columns:1fr 1fr}}
@media(max-width:1000px){.sidebar{width:76px;padding-inline:11px}.brand{margin:0 8px 35px;font-size:0}.brand-mark{font-size:28px;flex-shrink:0}.brand>span:last-child{display:none}.sidebar-label,.nav-item .small-tag,.nav-arrow,.campfire,.version,.help-link kbd{display:none}.nav-item{font-size:0;padding:16px;justify-content:center}.nav-item svg{width:22px;height:22px}.sidebar-rule{margin:22px 8px}.sidebar-bottom{padding:0}.help-link{font-size:0;justify-content:center}.help-link svg{width:22px;height:22px}.workspace{margin-left:76px;width:calc(100% - 76px)}.arena-layout{grid-template-columns:minmax(0,1fr) 225px}.topbar-right{gap:14px}.page-heading p{font-size:12px}.eyebrow{font-size:9px}.hero-detail-grid{grid-template-columns:270px 1fr}.stream-grid{grid-template-columns:1fr 1fr}.stream-setup,.obs-instructions{padding:23px}.obs-instructions h2{font-size:22px}.arena-location div>span{letter-spacing:.7px}.arena-status{display:none}.mode-copy small{font-size:9px}.page-footer>span:last-child{display:none}}
@media(max-width:800px){.arena-layout{grid-template-columns:1fr}.right-column{display:grid;grid-template-columns:1fr 1fr;gap:18px}.lobby-panel{margin-top:0}.hero-panel{display:grid;grid-template-columns:95px 1fr;column-gap:14px}.hero-panel .panel-heading{grid-column:1/-1}.hero-portrait{grid-column:1;grid-row:2/6;height:115px;margin-top:10px}.hero-portrait canvas{width:125px;height:115px}.hero-name-row{grid-column:2;margin-top:15px}.hero-name-row h3{font-size:14px}.hero-name-row .level-badge{font-size:8px}.xp-label{display:none}.xp-track{grid-column:2}.hero-stats{grid-column:2;margin-top:10px}.hero-manage{grid-column:1/-1;margin-top:15px}.heading-actions{padding-top:0}.heading-actions .subtle{display:none}.game-stage{aspect-ratio:2.4}.mode-copy strong{font-size:13px}.mode-copy small{font-size:11px}.mode-meta{font-size:9px}.controls-strip>div{font-size:10px}.mode-card{padding:15px}.hero-detail-grid{grid-template-columns:1fr}.character-sheet{display:grid;grid-template-columns:160px 1fr;align-items:center;justify-items:center;column-gap:20px}.character-sheet canvas{grid-row:1/6;height:170px;width:170px}.character-sheet .hero-class{align-self:end}.character-sheet .record{grid-column:2;width:100%;margin:15px 0 0}.character-sheet p{grid-column:1/-1;margin-top:15px}.stream-grid{grid-template-columns:1fr}.obs-instructions h2 br{display:none}.obs-instructions ol{display:grid;grid-template-columns:repeat(3,1fr);gap:25px}.obs-instructions li{margin:0}.tips-grid{gap:10px}.tip-card{padding:18px}.tip-card h3{font-size:14px}.tip-card p{font-size:12px}.topbar{height:62px}.page{padding-top:27px}.connection{font-size:10px}.breadcrumb{font-size:11px}}
@media(pointer:coarse){.touch-controls{display:flex}.controls-strip{display:none}}
@media(max-width:600px){.sidebar{width:100%;height:62px;inset:auto 0 0;flex-direction:row;align-items:center;justify-content:center;padding:0 10px;border-right:0;border-top:1px solid #343c49;background:#151a22f7;backdrop-filter:blur(10px)}.sidebar .brand,.sidebar-rule,.sidebar-bottom{display:none}.navigation{display:flex;gap:7px}.nav-item{padding:11px 18px}.nav-item.active{box-shadow:inset 0 -2px var(--green)}.workspace{margin:0;width:100%;padding-bottom:62px}.topbar{padding-inline:18px;height:58px}.topbar .breadcrumb{display:none}.topbar:before{content:'Mortal\A Viewers';white-space:pre;font-weight:800;font-size:17px;line-height:1;letter-spacing:-.5px;color:#dfe9d9}.topbar-right{gap:12px}.top-divider,.user-button #top-name,.user-button .chevron{display:none}.page{padding:25px 15px 18px}.page-heading{gap:10px;margin-bottom:22px}.page-heading p{font-size:12px;max-width:270px}.page-heading h1{font-size:28px;line-height:1.2}.page-heading .eyebrow{font-size:7px;letter-spacing:1px;margin-bottom:10px}.heading-actions{align-self:center}.heading-actions .button{font-size:0;min-width:38px;padding:9px}.heading-actions .button svg{width:19px;height:19px}.arena-toolbar{height:60px;padding:0 12px}.game-stage{aspect-ratio:1.85}.game-stage canvas{object-fit:cover}.arena-footer{padding-inline:10px}.arena-hint{font-size:9px;max-width:250px}.mode-section{margin-top:23px}.mode-grid{gap:7px}.mode-card{padding:13px 10px}.mode-copy strong{font-size:11px;line-height:1.4;min-height:31px}.mode-copy small{display:none}.mode-meta{font-size:7px;letter-spacing:.4px;margin-top:13px;line-height:1.7}.mode-meta i{display:none}.mode-icon svg{width:22px;height:22px}.mode-arrow{font-size:17px}.mode-copy{margin-top:8px}.right-column{grid-template-columns:1fr}.hero-panel{grid-template-columns:110px 1fr;padding:16px}.hero-name-row h3{font-size:17px}.hero-stats small{font-size:10px}.hero-manage{font-size:12px}.panel-heading h2{font-size:14px}.lobby-panel{padding:20px}.player-info strong{font-size:13px}.player-info small{font-size:11px}.player-row .challenge-button{font-size:12px}.lobby-invite{font-size:12px!important}.page-footer{font-size:10px;margin-top:25px}.controls-strip{gap:10px;margin-top:20px}.touch-controls{gap:4px}.touch-controls>div{gap:4px}.touch-controls button{padding:15px 8px;font-size:9px}.match-hud{top:14px;left:14px;right:14px;gap:9px}.fighter-hud{font-size:10px;width:36%}.match-clock strong{font-size:21px}.stage-caption{font-size:clamp(20px,5vw,28px)}.match-result strong{font-size:28px}.match-result>span{font-size:8px}.match-result p{font-size:10px;margin-block:8px 12px}.adventure-art{height:220px}.adventure-info{padding:22px}.adventure-info h2{font-size:24px}.adventure-info p{font-size:13px}.expedition-details{gap:12px;font-size:10px}.tips-grid{grid-template-columns:1fr}.tip-card h3{font-size:16px}.tip-card p{font-size:13px}.hero-detail-grid{gap:18px}.character-sheet{padding:18px 15px;grid-template-columns:120px 1fr;gap:12px}.character-sheet canvas{height:150px;width:150px;margin-left:-15px}.character-sheet h2{font-size:18px}.character-sheet .hero-class{font-size:9px}.record b{font-size:21px}.record span{font-size:10px}.upgrade-card{padding:21px;gap:15px}.upgrade-card h2{font-size:17px}.upgrade-card>div{min-width:150px}.upgrade-card .button{margin-left:auto}.upgrade-icon{padding:13px}.upgrade-card p{line-height:1.6}.skill-description{padding:20px;gap:15px}.hero-detail-grid+.muted-note{font-size:10px}.stream-setup,.obs-instructions{padding:23px}.obs-instructions ol{display:block}.obs-instructions li{margin-top:20px}.rooms-list{grid-template-columns:1fr}.page-heading>.button{font-size:10px;min-height:36px;padding-inline:10px}.page-heading>.button svg{display:none}.toast{bottom:80px;width:max-content;text-align:center;font-size:12px}dialog{padding:25px}.dialog-heading h2{font-size:22px}.dialog-heading .eyebrow{font-size:7px;letter-spacing:1px}.help-controls p{font-size:12px!important}.help-controls p>span{font-size:11px}}
/* A dark root color scheme can paint an opaque default backdrop in browser sources. */
html.overlay{background:transparent!important;color-scheme:normal}
/* Keep the whole battlefield visible at every breakpoint; cropping hides players near walls. */
@media(max-width:1200px){.game-stage{aspect-ratio:2.4}.game-stage canvas{object-fit:contain}}
@media(max-width:380px){.hero-panel{grid-template-columns:80px minmax(0,1fr);column-gap:10px}.hero-portrait{margin-left:-10px}.hero-name-row{flex-wrap:wrap;gap:6px}.hero-name-row h3{font-size:15px}.touch-controls{flex-wrap:wrap;justify-content:center}.controls-strip{max-width:100%}.character-sheet{grid-template-columns:90px minmax(0,1fr)}.character-sheet canvas{height:125px;width:125px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important;scroll-behavior:auto!important}}

/* Character selection keeps the pixel portraits central, with customization alongside. */
#profile-dialog{max-width:min(760px,calc(100vw - 28px));max-height:calc(100dvh - 28px);overflow-y:auto;padding:28px}
#profile-dialog .dialog-heading{margin-bottom:20px}
.character-options{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.character-option{position:relative;min-width:0;padding:0 0 12px;border:1px solid #3c454e;border-radius:9px;background:#151b22;text-align:center;overflow:hidden;transition:border-color .15s,background .15s}
.character-option:hover{background:#202831;border-color:#809278}
.character-option.selected{border-color:var(--green);background:#243127;box-shadow:inset 0 0 0 1px var(--green)}
.character-option-portrait{height:126px;display:flex;align-items:center;justify-content:center;position:relative;background:radial-gradient(ellipse at 50% 72%,color-mix(in srgb,var(--character-color) 15%,transparent),transparent 70%)}
.character-option canvas{display:block;width:144px;height:132px;max-width:100%;object-fit:contain;image-rendering:pixelated}
.character-option strong{display:block;font-size:14px;letter-spacing:.2px;margin:0 8px 5px}

.character-selected-mark{position:absolute;right:8px;top:8px;display:none;align-items:center;justify-content:center;width:20px;height:20px;background:var(--green);color:#1c2c15;font-size:13px;font-weight:800;border-radius:50%}
.character-option.selected .character-selected-mark{display:flex}
.character-customization{display:grid;grid-template-columns:240px minmax(0,1fr);gap:24px;margin-top:22px;align-items:center}
.character-preview{--character-color:#b5f578;position:relative;text-align:center;border:1px solid #39454b;border-radius:10px;padding:13px 14px 16px;background:radial-gradient(ellipse at 50% 50%,color-mix(in srgb,var(--character-color) 11%,transparent),transparent 70%),#131c23}
.character-preview-label{font-size:8px;letter-spacing:1.6px;color:#879b9f}
.character-preview #creator-avatar{width:204px;height:170px;max-width:100%;object-fit:contain;margin:0 auto}
.character-preview>strong{display:block;font-size:18px;letter-spacing:.3px;margin-top:1px}

.character-preview>p{font-size:11px;line-height:1.6;color:#93a3af;margin-top:10px}
.character-details{min-width:0}
.character-details>label{margin-top:0}
.outfit-color-control{margin-top:20px}
.outfit-color-heading{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:9px}
.outfit-color-heading label{font-size:13px;margin:0}
.outfit-color-heading output{font:12px Consolas,monospace;color:#d7e7cd;min-width:42px;text-align:right}
#outfit-hue{display:block;appearance:none;-webkit-appearance:none;width:100%;height:26px;padding:0;border:0;border-radius:5px;background:transparent;cursor:pointer;touch-action:pan-y}
#outfit-hue::-webkit-slider-runnable-track{height:9px;border-radius:5px;background:var(--hue-track,linear-gradient(90deg,#71adb0,#9a8ac8,#cd8e7d,#cac477,#75b395));border:1px solid #ffffff25}
#outfit-hue::-moz-range-track{height:9px;border-radius:5px;background:var(--hue-track,linear-gradient(90deg,#71adb0,#9a8ac8,#cd8e7d,#cac477,#75b395));border:1px solid #ffffff25}
#outfit-hue::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;height:20px;width:20px;border-radius:50%;border:3px solid #e5eddd;background:#27342d;box-shadow:0 1px 5px #0007;margin-top:-6px}
#outfit-hue::-moz-range-thumb{height:14px;width:14px;border-radius:50%;border:3px solid #e5eddd;background:#27342d;box-shadow:0 1px 5px #0007}
.outfit-reset{display:block;margin:0 0 6px auto;min-height:28px;padding:3px 0;font-size:10px}
#outfit-color-help{font-size:10px;line-height:1.6;color:#99a6b2;margin:0}

.character-choice-note{display:flex;gap:9px;color:#8f9eaa;font-size:11px;line-height:1.7;margin-top:23px}
.character-choice-note svg{width:17px;height:17px;color:#a6bd91;margin-top:2px}
#profile-dialog .dialog-note{text-align:center;margin-top:18px;font-size:10px;line-height:1.6}
#hero-archetype{letter-spacing:.6px;text-align:center;line-height:1.4}
#sheet-archetype{letter-spacing:1px;text-align:center;line-height:1.5}
@media(max-width:560px){
  #profile-dialog{padding:20px;max-width:calc(100vw - 24px)}
  #profile-dialog .dialog-heading{margin-bottom:17px}
  #profile-dialog .dialog-heading h2{font-size:23px}
  .character-options{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .character-option{padding-bottom:9px}
  .character-option-portrait{height:98px}
  .character-option canvas{width:115px;height:106px}
  .character-option strong{font-size:13px;margin-bottom:3px}
  .character-customization{grid-template-columns:1fr;gap:20px;margin-top:18px}
  .character-preview{display:grid;grid-template-columns:112px minmax(0,1fr);column-gap:11px;text-align:left;align-items:center;padding:12px}
  .character-preview-label{grid-column:2;align-self:end;font-size:7px;letter-spacing:.9px}
  .character-preview #creator-avatar{grid-column:1;grid-row:1/5;width:120px;height:120px;max-width:none;margin-left:-5px}
  .character-preview>strong{grid-column:2;font-size:17px;align-self:end;margin-top:6px}

  .character-preview>p{grid-column:2;font-size:10px;line-height:1.5;margin-top:7px;align-self:start}
  
  .character-choice-note{margin-top:17px}
  #profile-dialog .dialog-note{margin-top:15px}
}

/* Accounts and equal-stat loadouts. */
.compact{min-height:36px;padding:8px 14px}.logout-button{font-size:11px}.account-banner{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:18px 22px;margin-bottom:24px;border:1px solid #49633d;border-radius:10px;background:linear-gradient(100deg,#243126,#1a2427)}.account-banner strong{font-size:16px}.account-banner p{font-size:12px;color:#a1b29f;margin-top:6px}.account-banner .button{white-space:nowrap}.mode-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.hero-weapon-name{font-size:12px;color:#b8c8aa;margin:8px 0 0}.hero-stats{margin-top:20px}.hero-stats small{line-height:1.5}.hero-name-row h3{overflow-wrap:anywhere}
.guest-login{margin-top:10px}
#auth-dialog{max-height:calc(100dvh - 28px);overflow-y:auto}.auth-tabs{display:grid;grid-template-columns:1fr 1fr;padding:4px;background:#111920;border:1px solid #344147;border-radius:9px;margin:23px 0 19px;gap:4px}.auth-tabs button{border:0;background:transparent;padding:12px 8px;border-radius:6px;font-size:13px;color:#95a5ad}.auth-tabs button[aria-pressed=true]{background:#30432a;color:#d2f6af}.auth-intro{font-size:13px;line-height:1.7;color:#a4b3bc}.input-help{font-size:11px;color:#8a9eaa;margin:8px 0;line-height:1.5}.legacy-notice{padding:12px 14px;margin-top:16px;border:1px solid #766443;border-radius:7px;background:#47392155;font-size:12px;line-height:1.6;color:#e2cda2}
.loadout-layout{display:grid;grid-template-columns:280px minmax(0,1fr);gap:25px;align-items:start}.loadout-layout .character-sheet{position:sticky;top:24px;padding:20px 14px}.loadout-layout .character-sheet canvas{width:100%;height:auto;max-width:320px;image-rendering:pixelated;margin:0 auto}.loadout-layout .character-sheet h2{font-size:23px;margin-top:14px;overflow-wrap:anywhere}.loadout-layout .character-sheet p{font-size:12px;line-height:1.7;color:#94a6b1}.loadout-layout .character-sheet #account-name{font-size:11px;margin-top:9px;color:#adc295}.equal-stats{display:flex;gap:20px;justify-content:center;border-block:1px solid #38444b;padding:16px 4px;margin:20px 0;color:#a6b5bf;font-size:11px}.equal-stats b{display:block;font:22px Consolas,monospace;color:#d9e7d1;margin-bottom:4px}.armory{min-width:0}.armory-heading{margin:0 0 16px}.weapon-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-bottom:20px}.weapon-option{min-width:0;border:1px solid #3b484f;border-radius:9px;background:#171e25;padding:4px 7px 14px;text-align:center;transition:background .15s,border-color .15s}.weapon-option:hover{background:#24302c;border-color:#849f73}.weapon-option.selected{background:#263528;border-color:var(--green);box-shadow:inset 0 0 0 1px var(--green)}.weapon-option canvas{display:block;width:100%;height:80px;object-fit:contain;image-rendering:pixelated}.weapon-option strong{display:block;font-size:12px;line-height:1.4;margin-bottom:5px}.weapon-option small{color:#95a899;font-size:10px}.weapon-detail{padding:25px}.weapon-detail-heading{display:flex;justify-content:space-between;align-items:center;gap:15px}.weapon-detail-heading h2{font-size:24px;letter-spacing:-.5px}.weapon-detail-heading .eyebrow{font-size:8px;margin-bottom:7px}.weapon-combo-badge{font:13px Consolas,monospace;color:#c8eda6;border:1px solid #526b43;background:#2b3b26;border-radius:5px;padding:7px 10px;white-space:nowrap}.weapon-detail>p{font-size:13px;line-height:1.7;color:#a4b3be;margin-top:14px}.weapon-stat-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:22px 0}.weapon-stat-grid div{border:1px solid #35454b;background:#151e24;border-radius:6px;padding:13px 10px}.weapon-stat-grid b{display:block;font:20px Consolas,monospace;color:#d8e8cc}.weapon-stat-grid span{display:block;font-size:10px;line-height:1.5;color:#94a8b3;margin-top:6px}.attack-table-wrap{overflow-x:auto}.attack-table{width:100%;border-collapse:collapse;font-size:12px;font-variant-numeric:tabular-nums}.attack-table caption{text-align:left;font-weight:600;margin-bottom:12px;color:#cad6ca}.attack-table th,.attack-table td{padding:10px 8px;border-bottom:1px solid #33414a;text-align:right;white-space:nowrap}.attack-table th:first-child{text-align:left}.attack-table thead{font-size:10px;color:#8faaa7}.attack-table tbody th{font-weight:500;color:#d2dfcb}.attack-table tbody td{color:#aebecc}.weapon-detail .weapon-detail-note{font-size:11px;color:#8297a4;margin-top:14px}.loadout-save-row{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:24px}.loadout-save-row>span{font-size:11px;color:#a5b594}.weapon-detail .form-error{margin-bottom:0;min-height:0}.weapon-detail .form-error:empty{display:none}
.weapon-skin-section{margin-top:22px}.weapon-skin-heading{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:10px}.weapon-skin-heading h3{font-size:14px}.weapon-skin-heading p{font-size:10px;color:#94a8b3}.weapon-skins{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}.weapon-skin{min-width:0;border:1px solid #3b484f;border-radius:8px;background:#151e24;color:#d8e6d8;padding:8px 5px 10px;text-align:center;cursor:pointer}.weapon-skin:hover{border-color:#8aaa74;background:#213027}.weapon-skin.selected{border-color:var(--green);background:#263528;box-shadow:inset 0 0 0 1px var(--green)}.weapon-skin:disabled{cursor:not-allowed;opacity:.65}.weapon-skin canvas{display:block;width:100%;height:75px;object-fit:contain;image-rendering:pixelated;background:radial-gradient(ellipse,rgba(129,161,165,.18),transparent 72%)}.weapon-skin strong{display:block;font-size:11px}.weapon-skin small{display:block;color:#98a99e;font-size:9px;line-height:1.35;margin-top:4px}
.weapon-slots{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-bottom:9px}.weapon-slot{min-width:0;border:1px solid #43534b;border-radius:9px;padding:13px 15px;background:#17231f;color:#dce9d6;text-align:left;cursor:pointer}.weapon-slot[aria-pressed=true]{border-color:var(--green);background:#293c2c;box-shadow:inset 0 0 0 1px var(--green)}.weapon-slot small{display:block;font-size:9px;letter-spacing:1px;color:#a9c49b;margin-bottom:6px}.weapon-slot strong{font-size:14px}.weapon-slot:disabled{opacity:.65;cursor:not-allowed}.weapon-slot-help{font-size:11px;color:#a6b9aa;margin-bottom:15px}
@media(max-width:600px){.weapon-skin-heading{display:block}.weapon-skin-heading p{margin-top:4px}.weapon-skins{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:1200px){.loadout-layout{grid-template-columns:235px minmax(0,1fr);gap:18px}.weapon-options{grid-template-columns:repeat(2,minmax(0,1fr))}.weapon-detail{padding:20px}}
@media(max-width:800px){.loadout-layout{grid-template-columns:1fr}.loadout-layout .character-sheet{position:static;display:grid;grid-template-columns:160px minmax(0,1fr);gap:4px 18px;justify-items:center}.loadout-layout .character-sheet canvas{grid-column:1;grid-row:1/5;width:160px;height:150px;object-fit:contain}.loadout-layout .character-sheet>.hero-class,.loadout-layout .character-sheet>h2,.loadout-layout .character-sheet>#account-name{grid-column:2}.loadout-layout .character-sheet .equal-stats{grid-column:2;width:100%;margin:8px 0}.loadout-layout .character-sheet>p:last-child{grid-column:1/-1;margin:12px 0 0}.weapon-options{grid-template-columns:repeat(2,minmax(0,1fr))}.hero-weapon-name{grid-column:2}.account-banner{padding:17px;align-items:flex-start}.account-banner .button{font-size:11px;white-space:normal;max-width:190px}}
@media(max-width:600px){.topbar-right{gap:9px}.logout-button{font-size:10px}.topbar .compact{font-size:11px;padding:7px 10px;min-height:32px}.account-banner{flex-direction:column;gap:13px}.account-banner .button{max-width:none}.mode-copy strong{min-height:0}.weapon-options{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.weapon-option{padding-inline:4px}.weapon-option strong{font-size:11px}.weapon-option small{font-size:9px}.weapon-option canvas{height:68px}.weapon-detail{padding:17px}.weapon-detail-heading h2{font-size:21px}.weapon-stat-grid{gap:6px}.weapon-stat-grid div{padding:11px 8px}.weapon-stat-grid b{font-size:18px}.weapon-stat-grid span{font-size:9px}.attack-table{font-size:11px}.attack-table th,.attack-table td{padding:9px 5px}.attack-table thead{font-size:9px}.loadout-save-row{flex-direction:column;align-items:stretch;gap:12px}.loadout-save-row .button{width:100%}.loadout-layout .character-sheet{grid-template-columns:135px minmax(0,1fr);column-gap:10px}.loadout-layout .character-sheet canvas{width:145px;margin-left:-8px}.loadout-layout .character-sheet h2{font-size:19px}.equal-stats{gap:16px}.equal-stats b{font-size:20px}}

.arena-display-options{display:flex;align-items:center;justify-content:flex-end;gap:14px;margin-top:12px}.arena-display-options label{margin:0;font-size:11px;line-height:1.45;color:#b8c3cd}.arena-display-options label span{display:block;color:var(--muted);font-size:10px}.arena-display-options select{width:160px;padding:8px 10px;font-size:11px}@media(max-width:480px){.arena-display-options{justify-content:space-between;gap:10px}.arena-display-options select{width:150px}}
.challenge-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:6px}.challenge-actions .challenge-button{white-space:nowrap}#streamer-claim-form{margin-bottom:22px;padding:24px}#streamer-claim-form p{margin-top:8px;color:var(--muted);line-height:1.6}#streamer-claim-form label{margin-top:17px}#streamer-claim-form .button{margin-top:14px}#streamer-claim-form code{color:var(--green)}

.break-track{height:4px;background:#372e25;margin-top:5px;overflow:hidden;border-radius:2px}.break-track i{display:block;height:100%;width:0;background:#e7aa58;transition:width .1s linear}.fighter-hud .break-label{color:#cba66e;font-size:9px}.fighter-hud .break-label.ready{color:#ff927b;font-weight:700}
.bot-setup{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:0 0 12px;padding:13px 16px;border:1px solid #42534b;border-radius:9px;background:#1b282b}
.bot-setup label{display:block;margin:0;color:#e3efdc;font-size:12px;font-weight:700}
.bot-setup small{display:block;margin-top:4px;color:#9bb0ac;font-size:10px;line-height:1.4}
.bot-setup select{flex:0 0 200px;min-width:0;min-height:36px;padding:7px 10px;border:1px solid #647e61;border-radius:6px;background:#24352d;color:#e6f2dd;font:12px Inter,Segoe UI,sans-serif}
.bot-setup select:disabled{opacity:.55}
.arena-setup{border-color:#4d5670;background:#1d2532}
.arena-setup select{border-color:#606d81;background:#273240}
.arena-random-controls{display:flex;gap:8px;align-items:center}
.arena-random-controls select{flex:0 0 75px}
.arena-random-controls button{min-height:36px;white-space:nowrap}
.arena-setup-label{display:block;color:#e3efdc;font-size:12px;font-weight:700}
.arena-full-levels{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:7px}
.arena-full-levels label{display:inline-flex;align-items:center;gap:5px;padding:8px 9px;border:1px solid #606d81;border-radius:6px;background:#273240;color:#e6f2dd;white-space:nowrap;font-size:11px;font-weight:500}
.arena-full-levels label:has(input:disabled){opacity:.45}
.arena-full-levels input{accent-color:#b9e98a;margin:0}
.arena-random-options[hidden]{display:none}
@media(max-width:540px){.bot-setup{align-items:stretch;flex-direction:column;gap:10px}.bot-setup select{flex:auto;width:100%}.arena-full-levels{justify-content:flex-start}}

@media(max-width:600px){.touch-controls{flex-wrap:wrap;justify-content:center}}

.arena-preview-actions{display:flex;align-items:center;gap:12px;margin:13px 0 18px;flex-wrap:wrap}
.arena-preview-actions .button{font-size:11px;min-height:34px}
.arena-preview-actions small{color:#8d9b9f;font-size:10px;line-height:1.5}
.arena-preview-buttons{display:flex;gap:7px;flex-wrap:wrap;width:100%}
.arena-preview-buttons .button{flex:1;min-width:95px;padding-inline:8px}
.arena-preview-buttons .button[aria-pressed="true"]{border-color:#91bd67;background:#2b3b29;color:#d6f0bd}
.obs-preview-background{display:flex;align-items:center;gap:6px;flex-wrap:wrap;width:100%;font-size:10px;color:#aab4bd}
.obs-preview-background span{margin-right:auto}
.obs-preview-background button{border:1px solid #47515e;border-radius:5px;padding:5px 9px;font-size:10px}
.obs-preview-background button[aria-pressed="true"]{border-color:#91bd67;color:#b5f578;background:#263529}
.game-stage.preview-obs-black{background:#000}
.game-stage.preview-obs-white{background:#fff}
#show-match-result{font-size:10px;white-space:nowrap;color:#b5f578}
#hide-match-result{margin-top:12px;color:#d1e9c5}
.arena-preview-loading{position:absolute;inset:0;z-index:3;display:grid;place-items:center;background:#101c26e8;color:#dfead5;font:600 15px Consolas,monospace;text-align:center;padding:20px}
@media(max-width:600px){.match-result{padding:7px 12px}.match-result strong{font-size:24px;margin-top:5px}.match-result p{margin:4px 0 6px;line-height:1.3}.match-result .button{min-height:27px;padding:5px 9px;font-size:10px}#hide-match-result{margin-top:3px;font-size:9px;padding:2px}.arena-preview-actions{align-items:flex-start;flex-direction:column;gap:6px}}
#sound-volume{width:88px;height:18px;padding:0;border:0;border-radius:0;background:transparent;accent-color:var(--green);cursor:pointer}
.sound-volume-control{display:flex;align-items:center;gap:7px;flex-shrink:0}
#sound-volume-value{min-width:31px;font:10px Consolas,monospace;text-align:right;color:#a3acb8}
.arena-footer-actions{flex-shrink:0}
@media(max-width:600px){.arena-footer{flex-wrap:wrap}.arena-footer-actions{margin-left:auto}}

.brand-mark img{display:block;width:100%;height:100%}

.topbar{position:sticky;top:0;z-index:30;background:var(--bg)}
@media(max-width:900px){
  .topbar{height:auto;min-height:62px;padding-block:10px}
  .topbar-right{min-width:0;flex-wrap:wrap;justify-content:flex-end;gap:9px}
  .topbar::before{flex-shrink:0}
}
@media(max-width:600px){
  .topbar{min-height:58px}
  .topbar-right{gap:7px}
}
@media(max-width:400px){
  .topbar{padding-inline:12px;gap:8px}
  .topbar-right{gap:6px}
}