:root{color:#f4ead7;background:#090c16;font-family:Inter,ui-sans-serif,system-ui,sans-serif}*{box-sizing:border-box}body{min-width:320px;min-height:100vh;margin:0}.shell{background:radial-gradient(circle at 50% 25%,#27314f 0,#0000 42%),linear-gradient(155deg,#090c16,#111827);place-items:center;min-height:100vh;padding:24px;display:grid}.stage{aspect-ratio:5/3;border:1px solid #7f704f;border-radius:18px;width:min(100%,1280px);position:relative;overflow:hidden;box-shadow:0 30px 90px #000a}#town-canvas,#ui-canvas{width:100%;height:100%;display:block;position:absolute;inset:0}#town-canvas{visibility:hidden;background:#071126}.stage[data-scene=town] #town-canvas,.stage[data-scene=summon] #town-canvas{visibility:visible}.stage[data-scene=summon] #ui-canvas{opacity:0}#ui-canvas{z-index:1;background:0 0}#ui-canvas[data-town-spine=running]{touch-action:none}.login-card{z-index:4;color:#3b2619;background:linear-gradient(#fff9e8ee,#ead8b8f2),#f5e7ca;border:2px solid #d2b16d;border-radius:18px;gap:10px;width:min(88%,430px);padding:30px 34px 26px;display:grid;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 24px 70px #000c,inset 0 0 0 4px #6c432a55}.login-card[hidden]{display:none}.game-panel{z-index:5;color:#3b2619;text-align:center;background:linear-gradient(#fff9e8f7,#ddc49cf7);border:2px solid #d2b16d;border-radius:18px;width:min(90%,620px);padding:28px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 24px 80px #000d,inset 0 0 0 4px #6c432a55}.game-panel[hidden]{display:none}.profile-dialog{z-index:8;color:#4b3020;background:linear-gradient(#fff9e8fa,#dfc69efa);border:3px solid #d2b16d;border-radius:18px;gap:12px;width:min(88%,520px);padding:30px 36px;display:grid;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 26px 90px #000e,inset 0 0 0 4px #6c432a55}.profile-dialog[hidden]{display:none}.profile-dialog--wide{width:min(92%,760px)}.profile-dialog h1,.profile-dialog p{text-align:center;margin:0}.profile-dialog label{font-weight:800}.profile-dialog input{height:50px;font:inherit;border:2px solid #8b6649;border-radius:9px;padding:0 14px}.profile-dialog>button:not(.profile-dialog__close){height:52px;font:inherit;cursor:pointer;background:linear-gradient(#9bea22,#65b500);border:2px solid #4d711f;border-radius:10px;font-weight:850}.profile-dialog>button:disabled,.frame-option:disabled{opacity:.55;cursor:wait}.profile-dialog .profile-dialog__close{color:#4b3020;cursor:pointer;background:0 0;border:0;font-size:2rem;position:absolute;top:8px;right:14px}.profile-dialog__balance{font-weight:750}.profile-dialog__status{color:#854323;min-height:1.4em}.profile-dialog__status[data-state=error]{color:#a11919;font-weight:800}.frame-options{grid-template-columns:repeat(6,1fr);gap:12px;margin-top:6px;display:grid}.frame-option{color:#4b3020;min-width:0;font:inherit;cursor:pointer;background:#fff8e8;border:2px solid #a17945;border-radius:12px;place-items:center;gap:5px;padding:10px 5px;font-size:.78rem;font-weight:800;display:grid;position:relative}.frame-option img{object-fit:contain;width:82px;height:82px}.frame-option__none{border:2px dashed #aa8b64;border-radius:50%;place-items:center;width:82px;height:82px;font-size:2rem;display:grid}.frame-option[data-selected=true]{background:#efffcf;border-color:#5f951b;box-shadow:0 0 0 3px #8ecf4966}.profile-tabs{border-bottom:2px solid #aa8150;grid-template-columns:repeat(3,1fr);gap:10px;padding-bottom:10px;display:grid}.profile-tabs button{color:#653817;min-height:46px;font:inherit;cursor:pointer;background:linear-gradient(#fff7df,#d8b984);border:2px solid #8a6138;border-radius:9px;font-weight:850}.profile-tabs button[aria-selected=true]{background:linear-gradient(#9bea22,#65b500);border-color:#4d711f;box-shadow:inset 0 2px #d7ff73}.avatar-options{grid-template-columns:repeat(7,1fr);gap:10px;max-height:360px;padding:8px;display:grid;overflow:auto}.avatar-option{cursor:pointer;background:#fff8e8;border:2px solid #a17945;border-radius:11px;place-items:center;min-width:0;padding:5px;display:grid;position:relative}.avatar-option img{object-fit:contain;width:76px;height:76px}.avatar-option[data-selected=true]{background:#efffcf;border-color:#5f951b;box-shadow:0 0 0 3px #8ecf4966}.avatar-options__empty{color:#805b38;text-align:center;grid-column:1/-1;padding:80px 10px}.game-panel h1{margin:4px 0;font-size:2rem}.game-panel__close{cursor:pointer;background:0 0;border:0;font-size:2rem;position:absolute;top:10px;right:14px}.summon-heroes{grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:10px;max-height:270px;margin:18px 0;display:grid;overflow:auto}.tavern-hero{background:#fff8e8;border:1px solid #a57a42;border-radius:10px;padding:12px 8px}.tavern-hero strong,.tavern-hero span{display:block}.game-panel>button:not(.game-panel__close),.tavern-destinations button{cursor:pointer;background:linear-gradient(#9bea22,#65b500);border:2px solid #4d711f;border-radius:10px;min-width:190px;padding:12px 22px;font-weight:850}.game-panel>button:disabled{opacity:.55;cursor:wait}.tavern-destinations{grid-template-columns:repeat(3,1fr);gap:12px;margin:24px 0;display:grid}#summon-panel{color:#fff3d5;background:#160d26e8;width:min(92%,760px);padding:14px 22px;top:auto;bottom:18px;transform:translate(-50%)}#summon-panel h1,#summon-panel>p,#summon-panel .summon-heroes{margin:4px 0}#summon-panel .summon-heroes{display:none}.login-card__eyebrow{color:#9c251e;letter-spacing:.12em;text-align:center;text-transform:uppercase;margin:0;font-size:.82rem;font-weight:800}.login-card h1{color:#4b2819;text-align:center;margin:0 0 8px;font-size:clamp(1.55rem,4vw,2rem)}.login-card label{font-size:.88rem;font-weight:750}.login-card input{color:#27180f;width:100%;height:48px;font:inherit;background:#fffdf5;border:2px solid #8b6649;border-radius:9px;outline:none;padding:0 14px;box-shadow:inset 0 2px 5px #55301e22}.login-card input:focus{border-color:#5b922b;box-shadow:0 0 0 3px #8ecf493d}.login-card .login-card__remember{cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;gap:8px;width:fit-content;display:flex}.login-card .login-card__remember input{accent-color:#65b500;width:18px;height:18px;box-shadow:none;margin:0}.login-card button{color:#20330d;height:50px;font:inherit;cursor:pointer;background:linear-gradient(#9bea22,#65b500);border:2px solid #4d711f;border-radius:10px;margin-top:8px;font-size:1rem;font-weight:850;box-shadow:inset 0 2px #d7ff73,0 3px #31570f}.login-card button:disabled{opacity:.58;cursor:wait;filter:grayscale(.4)}.login-card button.login-card__secondary{color:#4b3020;background:linear-gradient(#fff8e8,#dac4a2);border-color:#826447;height:42px;margin-top:2px;font-size:.9rem;box-shadow:inset 0 1px #fff,0 2px #866442}.registration-fields{gap:8px;display:grid}.registration-fields[hidden]{display:none}.login-card__status{color:#654531;text-align:center;min-height:1.25em;margin:4px 0 0;font-size:.82rem}.login-card__status[data-state=error]{color:#a11919;font-weight:750}.status-panel{z-index:3;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#080b14dd;border:1px solid #ae996b88;border-radius:14px;width:min(90%,620px);padding:30px;transition:all .25s;position:absolute;inset:50% auto auto 50%;transform:translate(-50%,-50%)}.stage[data-ready=true] .status-panel{display:none}.stage[data-running=true] .status-panel{opacity:.72;width:min(74%,440px);padding:12px 16px;inset:auto auto 14px 14px;transform:none}.stage[data-running=true] .status-panel:hover{opacity:.96}.stage[data-running=true] .eyebrow,.stage[data-running=true] h1,.stage[data-running=true] #runtime-log{display:none}.stage[data-running=true] #runtime-status{margin:0;font-size:.9rem}.eyebrow{color:#d9bd7b;letter-spacing:.14em;text-transform:uppercase}h1{margin:.25rem 0 1rem}#runtime-status[data-state=ok]{color:#7ee2a8}#runtime-status[data-state=error]{color:#ff8d8d}#runtime-log{overflow-wrap:anywhere;color:#b7c1d8;white-space:pre-wrap;min-height:3.5rem;margin:1rem 0 0}@media (width<=640px){.shell{padding:0}.stage{border:0;border-radius:0;width:100vw}.login-card{padding:20px 22px 18px}.login-card input,.login-card button{height:44px}.frame-options{grid-template-columns:repeat(3,1fr);max-height:300px;overflow:auto}.avatar-options{grid-template-columns:repeat(4,1fr);max-height:300px}}
