:root{--bg:#0b0f14;--panel:rgba(14,20,28,.82);--line:#2a3948;--fg:#e6edf3;--muted:#93a3b1;--up:#3ecf8e;--down:#ff7b72;--acc:#6d93ff;--warn:#f0b24a;--fs:1;--sans:'Noto Sans JP',system-ui,-apple-system,'Hiragino Sans','Yu Gothic',sans-serif;--mono:'IBM Plex Mono',ui-monospace,Menlo,Consolas,monospace;color-scheme:dark}
*{box-sizing:border-box}
html,body{height:100%;margin:0}
body{background:var(--bg);color:var(--fg);font:calc(14px*var(--fs))/1.5 var(--sans);overflow:hidden}
body.big{--fs:1.35}
#gl{position:fixed;inset:0;width:100%;height:100%;display:block;touch-action:none;cursor:grab}
#gl.drag{cursor:grabbing}
.hud{position:fixed;z-index:2}
.hide{display:none!important}
#top{left:0;right:0;top:0;padding:calc(10px + env(safe-area-inset-top,0px)) 16px 8px;display:flex;flex-wrap:wrap;gap:8px 14px;align-items:center;background:linear-gradient(#0b0f14e6,#0b0f1400);pointer-events:none}
#top>*{pointer-events:auto}
.brand{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.brand b{font-size:calc(17px*var(--fs))}
.chip{border:1px solid var(--acc);color:var(--acc);border-radius:99px;padding:1px 10px;font-size:calc(12px*var(--fs));background:#0b0f14aa}
.btns{display:flex;gap:6px;flex-wrap:wrap}
button,.btn{font:inherit;color:var(--fg);background:var(--panel);border:1px solid var(--line);border-radius:6px;padding:5px 10px;cursor:pointer;text-decoration:none;min-height:34px;display:inline-flex;align-items:center}
button:hover,.btn:hover{border-color:var(--acc)}
button[aria-pressed=true],button.cur{border-color:var(--acc);color:var(--acc);font-weight:700}
body.big button,body.big .btn{min-height:46px}
button.pri{background:var(--acc);color:#0b0f14;font-weight:700}
#bottom{left:0;right:0;bottom:0;padding:10px 16px calc(10px + env(safe-area-inset-bottom,0px));display:flex;flex-wrap:wrap;gap:8px 16px;align-items:center;background:linear-gradient(#0b0f1400,#0b0f14f2 30%)}
.fund{background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:4px 12px;min-width:110px}
.fund small{display:block;color:var(--muted);font-size:calc(11px*var(--fs))}
.fund b{font-family:var(--mono);font-weight:500;font-size:calc(18px*var(--fs))}
.tick{display:flex;gap:6px 16px;flex-wrap:wrap;font-family:var(--mono);font-size:calc(13px*var(--fs))}
.chips{display:flex;gap:8px;flex-wrap:wrap;width:100%}
.ag{background:var(--panel);border:1px solid var(--line);border-left-width:4px;border-radius:6px;padding:3px 10px;font-size:calc(12px*var(--fs))}
.ag b{font-family:var(--mono);font-weight:500}
.up{color:var(--up)}.down{color:var(--down)}
.msg{left:16px;right:16px;top:90px;background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:10px 14px}
.msg a{color:var(--acc)}
.login{left:50%;top:50%;transform:translate(-50%,-50%);width:min(380px,calc(100vw - 32px));background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:16px;display:flex;flex-direction:column;gap:10px}
.login h2{margin:0;font-size:calc(16px*var(--fs))}
.login label{display:flex;flex-direction:column;gap:4px;color:var(--muted)}
.login input{font:inherit;padding:8px;border-radius:6px;border:1px solid var(--line);background:#0b0f14;color:var(--fg)}
.err{color:var(--down)}
.mut{color:var(--muted)}
@media (max-width:700px){#views{flex-wrap:nowrap;overflow-x:auto;max-width:100%;padding-bottom:2px}#views button{white-space:nowrap}}