:root{--bg: #0b0e14;--panel: #161b26;--line: #283142;--text: #e6ebf2;--muted: #8b94a6;--accent: #6ee7b7;--accent-2: #3b82f6;--danger: #e5484d;--gold: #f2c14e}*{box-sizing:border-box}html,body{margin:0;height:100%;background:var(--bg);color:var(--text);font-family:ui-monospace,Cascadia Code,Menlo,Consolas,monospace;-webkit-font-smoothing:antialiased;overflow:hidden}#demo-bg{position:fixed;top:0;right:0;bottom:0;left:0;z-index:0}#demo-bg canvas,#game-canvas canvas{display:block;width:100%;height:100%}.screen{position:relative;z-index:1;min-height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.1rem;padding:2rem;pointer-events:none}.screen>*{pointer-events:auto}#logo{font-size:clamp(2.2rem,9vw,5rem);letter-spacing:.14em;margin:0;font-weight:700;text-shadow:0 2px 24px rgba(0,0,0,.6)}#presence-row{color:var(--muted);font-size:.95rem}.card{background:color-mix(in srgb,var(--panel) 90%,transparent);border:1px solid var(--line);border-radius:14px;padding:1.25rem 1.4rem;min-width:19rem;max-width:22rem;text-align:center;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);box-shadow:0 10px 40px #00000073}.row{display:flex;gap:.6rem;align-items:center;justify-content:center}.col{display:flex;flex-direction:column;gap:.7rem}.row.spread{justify-content:space-between}button{font:inherit;color:var(--text);background:var(--accent-2);border:none;border-radius:9px;padding:.6rem 1rem;cursor:pointer;transition:filter .12s ease,transform .06s ease}button:hover{filter:brightness(1.12)}button:active{transform:translateY(1px)}button.big{font-size:1.1rem;padding:.8rem 1.2rem;width:100%}button.secondary{background:#28303f}button.warning,button.danger{background:var(--danger)}input,select{font:inherit;color:var(--text);background:#0e131c;border:1px solid var(--line);border-radius:9px;padding:.55rem .7rem;width:100%}#auth-form input{margin-bottom:.6rem}.muted{color:var(--muted)}.auth-msg{margin-top:.7rem;color:var(--gold);font-size:.9rem}#conn-status{font-size:.85rem}#chat{position:fixed;left:.7rem;bottom:.7rem;z-index:3;width:min(22rem,38vw);background:color-mix(in srgb,var(--panel) 86%,transparent);border:1px solid var(--line);border-radius:12px;padding:.5rem;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.chat-list{max-height:9.5rem;overflow-y:auto;font-size:.88rem;line-height:1.35;margin-bottom:.4rem}.chat-line{word-break:break-word}.chat-line.admin b{color:var(--gold)}.chat-line b{color:var(--accent)}.chat-row{display:flex;gap:.4rem}.chat-row input{flex:1}#btn-options{position:fixed;top:.7rem;left:.7rem;z-index:4;background:#28303f;width:2.4rem;height:2.4rem;border-radius:9px;font-size:1.2rem;line-height:1}#options-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:20;display:flex;align-items:center;justify-content:center;background:#04060a99}.opt-box{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:1.2rem 1.4rem;width:22rem;max-width:92vw}.opt-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:.6rem}.opt-head h2{margin:0;font-size:1.15rem}#options-close{background:transparent;font-size:1.4rem;padding:0 .4rem}.opt-row{display:flex;align-items:center;gap:.7rem;padding:.45rem 0}.opt-row>span:first-child{min-width:7rem;text-align:left}.opt-row input[type=range]{flex:1}.opt-row input[type=checkbox]{width:auto}.opt-row select{width:auto;flex:1}.opt-sub{color:var(--muted);font-size:.82rem;padding-left:7.7rem}.card-title{margin:0 0 .6rem;font-size:1.05rem}#maps-card{max-width:24rem}.map-row{display:flex;align-items:center;gap:.5rem;padding:.3rem 0}.map-row span{flex:1;text-align:left}.map-row button{padding:.35rem .7rem}.map-row .map-territory{flex:0 0 auto;display:flex;gap:.2rem}.map-territory .mt-chip{min-width:1.1rem;text-align:center;font-size:.72rem;color:var(--text);border-left:3px solid var(--fc);padding:.02rem .25rem;border-radius:3px;background:color-mix(in srgb,var(--fc) 16%,transparent)}#admin-open{margin-top:.6rem}#admin-open select{flex:1}#game-canvas{position:fixed;top:0;right:0;bottom:0;left:0}#game-hud{position:fixed;top:.7rem;right:.7rem;z-index:5;display:flex;align-items:center;gap:.8rem;background:color-mix(in srgb,var(--panel) 80%,transparent);border:1px solid var(--line);border-radius:10px;padding:.45rem .7rem;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}#game-hud .muted{font-size:.82rem}#territory-hud{position:fixed;top:.7rem;left:50%;transform:translate(-50%);z-index:5;display:flex;align-items:center;gap:.45rem;background:color-mix(in srgb,var(--panel) 80%,transparent);border:1px solid var(--line);border-radius:10px;padding:.4rem .6rem;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}#territory-hud .ts-title{font-size:.7rem;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}#territory-hud .ts-chip{font-size:.78rem;color:var(--text);border-left:3px solid var(--fc);padding:.05rem .4rem;border-radius:3px;background:color-mix(in srgb,var(--fc) 16%,transparent)}#territory-hud .ts-chip.mine{font-weight:700;box-shadow:0 0 0 1px var(--fc) inset}#resource-bar{position:fixed;left:.8rem;bottom:.8rem;z-index:5;display:flex;flex-direction:column;gap:.3rem;background:color-mix(in srgb,var(--panel) 80%,transparent);border:1px solid var(--line);border-radius:10px;padding:.5rem .6rem;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.res{display:flex;align-items:center;gap:.5rem;font-size:.72rem;color:var(--muted)}.res>span{width:2.2rem;text-align:right}.res-track{width:9rem;height:.55rem;background:#0e131c;border-radius:4px;overflow:hidden}.res-fill{height:100%;width:100%;transition:width .15s linear}.res-fill.hp{background:var(--danger)}.res-fill.mana{background:var(--accent-2)}.res-fill.build{background:var(--gold)}#ability-bar{position:fixed;left:50%;bottom:.8rem;transform:translate(-50%);z-index:5;display:flex;gap:.5rem}.ability-btn{position:relative;width:4.6rem;height:3.4rem;padding:.3rem;background:color-mix(in srgb,var(--panel) 88%,transparent);border:2px solid var(--line);border-radius:10px;overflow:hidden;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.1rem;cursor:pointer}.ability-btn.selected{border-color:var(--ab);box-shadow:0 0 12px -2px var(--ab)}.ability-btn .ab-key{font-size:.7rem;color:var(--muted)}.ability-btn .ab-name{font-size:.62rem;color:var(--text);text-align:center;line-height:1.05}.ability-btn .ab-cd{position:absolute;left:0;bottom:0;width:100%;height:0%;background:#06090ea8;pointer-events:none}#cast-msg{position:fixed;left:50%;bottom:4.6rem;transform:translate(-50%);z-index:6;background:#06090ecc;color:var(--gold);border:1px solid var(--line);border-radius:8px;padding:.3rem .7rem;font-size:.82rem}#version-corner{position:fixed;right:.6rem;bottom:.5rem;z-index:4;color:var(--muted);font-size:.8rem}#transition-veil{position:fixed;top:0;right:0;bottom:0;left:0;z-index:50;background:var(--bg);opacity:0;pointer-events:none;transition:opacity .6s ease}#transition-veil.show{opacity:1;pointer-events:all}body.clean-menu #screen-start>*:not(#logo),body.clean-menu #chat,body.clean-menu #btn-options{display:none}#editor-canvas{position:fixed;top:0;right:0;bottom:0;left:0}#ed-topbar{position:fixed;top:.6rem;left:.6rem;right:.6rem;z-index:6;display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;background:color-mix(in srgb,var(--panel) 85%,transparent);border:1px solid var(--line);border-radius:10px;padding:.45rem .6rem;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}#ed-topbar input,#ed-topbar select{padding:.3rem .4rem}#ed-topbar #ed-name{flex:1;min-width:8rem}#ed-status-tag{margin-left:auto}#ed-palette{position:fixed;top:4rem;left:.6rem;bottom:.6rem;width:11rem;z-index:6;overflow-y:auto;display:flex;flex-direction:column;gap:.55rem;background:color-mix(in srgb,var(--panel) 80%,transparent);border:1px solid var(--line);border-radius:10px;padding:.5rem;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.ed-group-title{font-size:.66rem;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);margin-bottom:.25rem}.ed-grid{display:grid;grid-template-columns:1fr 1fr;gap:.25rem}.ed-tool{display:flex;align-items:center;gap:.3rem;font-size:.66rem;padding:.25rem .3rem;background:color-mix(in srgb,var(--panel) 90%,transparent);border:1px solid var(--line);border-radius:6px;cursor:pointer;color:var(--text);text-align:left;overflow:hidden}.ed-tool:before{content:"";width:.7rem;height:.7rem;border-radius:2px;background:var(--sw, transparent);flex:0 0 auto}.ed-tool.no-sw:before{display:none}.ed-tool.active{border-color:var(--accent);box-shadow:0 0 8px -2px var(--accent)}#ed-status{position:fixed;right:.6rem;bottom:1.6rem;z-index:6;font-size:.82rem;padding:.3rem .6rem;border-radius:8px;background:#06090ecc}#ed-status.ok{color:var(--accent-2, #46a758)}#ed-status.warn{color:var(--gold, #f2c14e)}#ed-coords{position:fixed;right:.6rem;bottom:.5rem;z-index:6;font-size:.72rem}#screen-defs{position:fixed;top:0;right:0;bottom:0;left:0;z-index:6;overflow-y:auto;padding:1rem;background:var(--bg, #0b0e14)}#defs-top{display:flex;align-items:center;gap:.7rem;position:sticky;top:0;padding:.4rem 0;background:var(--bg, #0b0e14)}#defs-top h2{margin:0}#defs-top #defs-status{margin-left:auto}#defs-tabs{display:flex;gap:.4rem;flex-wrap:wrap;margin:.6rem 0}.defs-tab{padding:.3rem .7rem;background:color-mix(in srgb,var(--panel) 90%,transparent);border:1px solid var(--line);border-radius:6px;cursor:pointer;color:var(--text)}.defs-tab.active{border-color:var(--accent);color:var(--accent)}#defs-tables{display:grid;grid-template-columns:repeat(auto-fill,minmax(15rem,1fr));gap:.7rem}.defs-card{background:color-mix(in srgb,var(--panel) 85%,transparent);border:1px solid var(--line);border-radius:8px;padding:.6rem}.defs-card-title{font-weight:700;margin-bottom:.4rem}.defs-field{display:flex;align-items:center;justify-content:space-between;gap:.5rem;font-size:.76rem;margin:.2rem 0}.defs-field>span{color:var(--muted)}.defs-field input[type=number],.defs-field input[type=text]{width:6rem;padding:.2rem .3rem}.defs-sub{width:100%;padding-left:.6rem;border-left:2px solid var(--line)}.defs-ro{color:var(--muted);font-size:.7rem}#tools-card{display:flex;gap:.5rem}#deploy-banner{position:fixed;top:0;left:0;right:0;z-index:50;text-align:center;padding:.6rem 1rem;background:var(--gold, #f2c14e);color:#1a1205;font-weight:600;box-shadow:0 2px 12px -2px #0009}[hidden]{display:none!important}
