:root{--gold:#d4c4a0;--jade:#9ad0a4}*{box-sizing:border-box;margin:0;padding:0}html,body{height:100%;color:var(--gold);background:#050605;font-family:Songti SC,Noto Serif SC,Source Han Serif SC,serif;overflow:hidden}#app{background:#000;width:min(100vw,430px);height:100dvh;margin:0 auto;position:relative;overflow:hidden}.screen{position:absolute;inset:0;display:none!important}.screen.on{display:block!important}#gate.on,#lobby.on,#combat.on,#tune.on{display:flex!important}#gate{padding:32px 28px calc(40px + env(safe-area-inset-bottom));background:radial-gradient(at 50% 80%,#1a2418 0%,#050605 70%);flex-direction:column;justify-content:flex-end;display:none}#gate.on{display:flex}#gate h1{letter-spacing:.28em;margin-bottom:8px;font-size:42px;font-weight:400}#gate .sub{letter-spacing:.42em;opacity:.7;margin-bottom:28px;font-size:13px}#gate p{opacity:.82;margin-bottom:22px;font-size:13px;line-height:1.7}.btn{border:1px solid var(--gold);color:var(--gold);letter-spacing:.24em;cursor:pointer;background:0 0;width:100%;padding:12px 18px;font-family:inherit;font-size:13px}.btn:active{background:#d4c4a01f}#combat.on{flex-direction:column;display:flex}.stage-well{background:#08110c;flex:auto;min-height:0;position:relative}#stage{width:100%;height:100%;display:block;position:absolute;inset:0}.hud-top{top:env(safe-area-inset-top,10px);z-index:5;pointer-events:none;align-items:center;gap:10px;display:flex;position:absolute;left:14px;right:14px}.ename{letter-spacing:.2em;opacity:.85;min-width:4.5em;font-size:11px}.bar{background:#ffffff26;border-radius:2px;flex:1;height:4px;overflow:hidden}.bar>i{background:var(--jade);transform-origin:0;width:100%;height:100%;transition:transform .35s;display:block}.crest{border:1px solid #9ad0a499;border-radius:50%;place-items:center;width:36px;height:36px;font-size:16px;display:grid}.vlabel{writing-mode:vertical-rl;letter-spacing:.55em;opacity:.55;z-index:5;pointer-events:none;font-size:11px;position:absolute;top:22%;left:10px}.break-tag{letter-spacing:.18em;opacity:.8;z-index:5;writing-mode:vertical-rl;pointer-events:none;font-size:11px;position:absolute;top:18%;right:14px}.hud-bot{z-index:6;padding:10px 14px calc(12px + env(safe-area-inset-bottom));background:linear-gradient(#080e0a8c,#070908 28%);border-top:1px solid #d4c4a02e;flex:none;position:relative}.skills{grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:8px;display:grid}.sk{height:52px;color:var(--gold);letter-spacing:.16em;cursor:pointer;background:#101612eb;border:1px solid #d4c4a061;border-radius:999px;flex-direction:column;justify-content:center;align-items:center;gap:1px;font-family:inherit;font-size:12px;display:flex;position:relative;overflow:hidden}.sk em{letter-spacing:.28em;opacity:.55;font-size:9px;font-style:normal}.sk.ult{border-color:#9ad0a4b3;box-shadow:0 0 12px #9ad0a42e}.sk:disabled{opacity:.35}.sk .cd{background:var(--jade);transform-origin:0;border-radius:1px;height:2px;position:absolute;bottom:6px;left:10%;right:10%;transform:scaleX(0)}.row2{letter-spacing:.16em;justify-content:space-between;align-items:center;font-size:11px;display:flex}.auto{opacity:.8;cursor:pointer}.toast{letter-spacing:.28em;opacity:0;pointer-events:none;z-index:10;text-shadow:0 2px 16px #000;font-size:15px;position:absolute;top:42%;left:50%;transform:translate(-50%,-50%)}.toast.show{animation:1.1s pop}@keyframes pop{0%{opacity:0;transform:translate(-50%,-40%)}20%{opacity:1}to{opacity:0;transform:translate(-50%,-70%)}}.text-btn{color:var(--gold);letter-spacing:.16em;opacity:.75;cursor:pointer;background:0 0;border:0;font-family:inherit;font-size:11px}.btn.solid{border-color:var(--gold);background:#d4c4a029}.btn.ghost{opacity:.7;border-color:#0000;margin-top:2px}.skin-screen{overflow:hidden}.skin-screen.on{display:block}#lobby.on{flex-direction:column;display:flex}.lobby-hero{flex:auto;min-height:0;position:relative}.skin-photo{object-fit:cover;object-position:50% 78%;width:100%;height:100%;animation:18s ease-in-out infinite alternate skinKen;position:absolute;inset:0}#login .skin-photo{object-position:52% 82%}#lobby .skin-photo{object-position:50% 72%}@keyframes skinKen{0%{transform:scale(1.04)}to{transform:scale(1.1)translateY(-1.4%)}}.skin-veil{pointer-events:none;position:absolute;inset:0}.login-veil{background:linear-gradient(#08060559 0%,#08060514 38%,#0806058c 62%,#080605f0 100%)}.lobby-veil{background:linear-gradient(#0806058c 0%,#0000 22% 62%,#080605c7 100%)}.login-top{top:calc(18px + env(safe-area-inset-top));z-index:2;position:absolute;left:22px;right:22px}.brand{letter-spacing:.42em;text-indent:.42em;font-size:40px}.brand-sub{letter-spacing:.28em;opacity:.78;margin-top:6px;font-size:12px}.login-card{left:16px;right:16px;bottom:calc(18px + env(safe-area-inset-bottom));z-index:2;flex-direction:column;gap:10px;display:flex;position:absolute}.login-whisper{letter-spacing:.08em;opacity:.88;margin-bottom:4px;font-size:13px;line-height:1.7}.login-card label{letter-spacing:.22em;opacity:.8;flex-direction:column;gap:6px;font-size:11px;display:flex}.login-card input{color:var(--gold);letter-spacing:.12em;background:#0a08078c;border:1px solid #d4c4a059;outline:none;padding:11px 12px;font-family:inherit;font-size:14px}.login-card input:focus{border-color:#d4c4a0cc}.login-note{letter-spacing:.12em;opacity:.45;font-size:10px;line-height:1.6}.lobby-top{top:calc(12px + env(safe-area-inset-top));z-index:2;justify-content:space-between;align-items:flex-start;gap:12px;display:flex;position:absolute;left:16px;right:16px}.who{letter-spacing:.22em;font-size:16px}.meta{letter-spacing:.16em;opacity:.7;margin-top:4px;font-size:11px}.meters{letter-spacing:.16em;opacity:.85;flex-direction:column;align-items:flex-end;gap:4px;font-size:11px;display:flex}.meters b{color:#f3e6d4;font-weight:400}.lobby-caption{z-index:2;align-items:flex-end;gap:10px;display:flex;position:absolute;bottom:14px;left:16px;right:16px}.vtag{writing-mode:vertical-rl;letter-spacing:.42em;opacity:.7;flex:none;font-size:12px}.lobby-line{letter-spacing:.08em;text-shadow:0 2px 16px #000;font-size:13px;line-height:1.75}.lobby-panel{z-index:3;padding:10px 14px calc(12px + env(safe-area-inset-bottom));background:linear-gradient(#080605b3,#0a0807 24%);border-top:1px solid #d4c4a02e;flex-direction:column;flex:none;gap:10px;display:flex}.lobby-dock{gap:6px;display:flex}.dock{min-width:0;height:32px;color:var(--gold);letter-spacing:.08em;cursor:pointer;background:#0a08078c;border:1px solid #d4c4a047;flex:1;font-family:inherit;font-size:11px}.dock.on{border-color:var(--gold);background:#d4c4a029}.lobby-acts{grid-template-columns:1.2fr 1fr;gap:8px;display:grid}.lobby-acts .btn{width:auto}.hud-self{top:calc(env(safe-area-inset-top,10px) + 28px);z-index:5;pointer-events:none;letter-spacing:.16em;opacity:.8;align-items:center;gap:8px;font-size:10px;display:flex;position:absolute;left:14px;right:60px}.bar.self{background:#ffffff1a}.bar.self>i{background:#d4c4a0}#tune.on{padding:16px 16px calc(18px + env(safe-area-inset-bottom));background:#0a0807;flex-direction:column;gap:12px;display:flex}.tune-top{justify-content:space-between;align-items:flex-start;display:flex}.tune-lock,.tune-unspent{letter-spacing:.08em;font-size:13px;line-height:1.6}.tune-lock span{opacity:.5;margin-top:4px;font-size:11px;display:block}.tune-list{flex-direction:column;gap:8px;display:flex}.tune-row{height:48px;color:var(--gold);letter-spacing:.14em;cursor:pointer;background:#100c0acc;border:1px solid #d4c4a047;grid-template-columns:1fr auto 36px;align-items:center;gap:10px;padding:0 14px;font-family:inherit;font-size:14px;display:grid}.tune-row em{opacity:.7;font-style:normal}.tune-row:disabled{opacity:.35}