:root{--bg:#F4F6F8;--card:#fff;--bd:#DDE2E8;--tx:#101418;--mu:#5F6873;--ac:#C9A24B;--at:#9A7420;--pf:#1E9E6A;--ls:#D63B40}
:root[data-theme=dark]{--bg:#0B0F14;--card:#121821;--bd:#232C38;--tx:#E8EAED;--mu:#8A93A0;--at:#C9A24B;--pf:#2EBD85;--ls:#E5484D}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;min-height:100%}
body{background:var(--bg);color:var(--tx);font:400 15px/1.45 Inter,system-ui,sans-serif;font-variant-numeric:tabular-nums;padding-top:env(safe-area-inset-top)}
h1,h2{font-family:'Source Serif 4',Georgia,serif;font-weight:600;margin:0 0 6px}
h1{font-size:24px}h2{font-size:19px}
.top{position:sticky;top:0;z-index:5;display:flex;align-items:center;gap:6px;padding:10px 12px;background:var(--bg);border-bottom:1px solid var(--bd)}
.seg{display:flex;margin:0 auto;padding:3px;background:var(--card);border:1px solid var(--bd);border-radius:999px}
.seg button{border:0;background:none;color:var(--mu);padding:6px 16px;border-radius:999px;font:500 13px Inter}
.seg .on{background:var(--ac);color:#101418}
.ib{border:0;background:none;color:var(--tx);padding:6px;border-radius:10px;display:flex}
main{max-width:760px;margin:auto;padding:14px 14px 100px}
.card{background:var(--card);border:1px solid var(--bd);border-radius:16px;padding:16px;margin-bottom:12px}
.row{display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px solid var(--bd)}
.row:last-child{border:0}
.mu{color:var(--mu)}
.pill{display:inline-block;font:600 11px Inter;padding:3px 9px;border-radius:999px;background:var(--bd);color:var(--mu)}
nav.bar{position:fixed;left:0;right:0;bottom:0;z-index:5;display:flex;background:var(--card);border-top:1px solid var(--bd);padding:6px 4px calc(6px + env(safe-area-inset-bottom))}
nav.bar button{flex:1;border:0;background:none;color:var(--mu);display:flex;flex-direction:column;align-items:center;gap:2px;font:500 11px Inter}
nav.bar .on{color:var(--at)}
.scrim{position:fixed;inset:0;z-index:19;background:#0009}
.drawer{position:fixed;top:0;bottom:0;left:0;z-index:20;width:min(86vw,340px);overflow-y:auto;background:var(--card);border-right:1px solid var(--bd);padding:calc(10px + env(safe-area-inset-top)) 10px 24px}
.dh{display:flex;align-items:center;gap:12px;padding:8px 6px 16px}
.dh img{width:42px;height:42px;border-radius:11px}
.dh b{font:600 19px 'Source Serif 4',Georgia,serif;color:var(--at)}
.gi{display:flex;align-items:center;gap:14px;width:100%;border:0;border-left:3px solid transparent;border-radius:14px;background:none;color:var(--tx);padding:13px 12px;font:500 16px Inter;text-align:left}
.gi.on{background:var(--bg);border-left-color:var(--ac);color:var(--at)}
.gi span{flex:1}
.chev{width:8px;height:8px;border-right:2px solid var(--mu);border-bottom:2px solid var(--mu);transform:rotate(45deg);margin:0 4px 3px 0}
.chev.up{transform:rotate(-135deg);margin:3px 4px 0 0}
.subs{margin:2px 0 8px 28px;padding-left:10px;border-left:1px solid var(--bd)}
.si{display:block;width:100%;border:0;border-radius:10px;background:none;color:var(--mu);padding:11px 10px;font:500 15px Inter;text-align:left}
.si.on{background:var(--bg);color:var(--at)}
label{font-size:13px;color:var(--mu)}
input,select{width:100%;margin:4px 0 14px;padding:11px 12px;border-radius:12px;border:1px solid var(--bd);background:var(--bg);color:var(--tx);font:inherit}
.btn{width:100%;border:0;border-radius:12px;padding:12px 16px;background:var(--ac);color:#101418;font:600 15px Inter}
.btn.g{background:none;border:1px solid var(--bd);color:var(--tx);margin-top:8px}
.login{max-width:380px;margin:10vh auto;padding:0 16px;text-align:center}
.login img{width:84px;height:84px;border-radius:22px;margin-bottom:14px}
.login form{text-align:left;margin-top:18px}
.msg{min-height:20px;font-size:13px;color:var(--ls);margin:8px 0}