:root{--bg:#0b1020;--card:#121a2b;--text:#f2f5ff;--muted:#8a97b8;--line:#202c49;--safe-top:env(safe-area-inset-top,0px);--safe-bottom:env(safe-area-inset-bottom,0px)}
*{box-sizing:border-box}html,body{min-height:100%}body{margin:0;min-height:var(--app-height,100vh);background:linear-gradient(180deg,#090d1c,#0f172d);color:var(--text);font-family:Inter,system-ui,sans-serif}
.container,main{min-height:var(--app-height,100vh);padding-top:calc(72px + var(--safe-top))}
.container{max-width:1000px;margin:0 auto;padding:calc(72px + var(--safe-top)) 16px 16px;display:grid;gap:16px}.card{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:18px}
.hero .total{font-size:40px;font-weight:800;margin-top:8px}.hero .rub{margin-top:6px;color:#c7d2f3}
.user{display:flex;justify-content:space-between;align-items:center;padding:12px;border-radius:12px;border:1px solid transparent;cursor:pointer;transition:background-color .2s,border-color .2s,transform .2s}.user:hover{border-color:var(--line);background:#0f1527;transform:translateX(1px)}
.user-right{display:flex;align-items:center;gap:10px}.chevron{color:var(--muted);font-size:18px;line-height:1}
.small{color:var(--muted);font-size:14px}dialog{background:var(--card);color:var(--text);border:1px solid var(--line);border-radius:14px;max-width:640px;width:95%}
.modal-header{display:flex;justify-content:space-between;align-items:center}.asset{display:flex;justify-content:space-between;padding:10px 0;border-bottom:1px solid var(--line)}.asset-left{display:flex;gap:10px;align-items:center}.icon{width:26px;height:26px;border-radius:50%;background:#1e2a46;display:grid;place-items:center;font-size:11px}
.modal-close{color:#ff5f5f;background:transparent;border:none;font-size:24px;cursor:pointer}.modal-close:hover{color:#ff8080}
body::before{content:"";position:fixed;top:0;left:0;right:0;height:calc(72px + var(--safe-top));background:linear-gradient(180deg,#0f172a 0%,rgba(15,23,42,0) 100%);pointer-events:none;z-index:1}
@media (max-width:768px){.balance-card,.total-card,.summary-card,.hero.card{min-height:140px}.hero .total{font-size:30px}}
@media (min-width:769px){.container,main{padding-top:32px}.container{padding:32px 16px 16px}body::before{display:none}}
