:root{
  --navy:#0b1b2b; --navy2:#10283f; --gold:#c9a24b; --gold2:#e3c878;
  --green:#1f8a5e; --red:#c1453a; --bg:#0e1722; --card:#142536;
  --text:#eef2f6; --sub:#9fb0c1; --line:#22384f;
}
*{box-sizing:border-box;}
body{margin:0;font-family:Arial,Helvetica,sans-serif;background:var(--bg);color:var(--text);}
header{background:linear-gradient(135deg,var(--navy) 0%,var(--navy2) 100%);padding:22px 20px;border-bottom:3px solid var(--gold);}
header h1{margin:0;font-size:20px;letter-spacing:.5px;}
header p{margin:4px 0 0;color:var(--gold2);font-size:12.5px;}
nav{display:flex;background:var(--card);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:5;overflow-x:auto;}
nav button{flex:1;padding:13px 6px;background:none;border:none;color:var(--sub);font-size:12px;font-weight:bold;cursor:pointer;border-bottom:3px solid transparent;white-space:nowrap;}
nav button.active{color:var(--gold2);border-bottom:3px solid var(--gold);}
main, .auth-wrap{padding:16px;max-width:560px;margin:0 auto;padding-bottom:60px;}
.auth-wrap{padding-top:40px;}
.card{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:14px;margin-bottom:14px;}
.card h2{margin:0 0 10px;font-size:15px;color:var(--gold2);}
.card h3{margin:0 0 8px;font-size:13px;color:var(--sub);text-transform:uppercase;letter-spacing:.5px;}
.row{display:flex;justify-content:space-between;align-items:center;padding:9px 0;border-bottom:1px solid var(--line);font-size:13.5px;gap:8px;}
.row:last-child{border-bottom:none;}
.pill{font-size:11px;padding:2px 8px;border-radius:10px;font-weight:bold;white-space:nowrap;}
.pill.due{background:#3a2a1a;color:#f0b94d;}
.pill.soon{background:#3a1a1a;color:#ff8b7c;}
.pill.paid{background:#16332a;color:#5fd9a3;}
.pill.locked{background:#3a1a1a;color:#ff8b7c;}
.pill.active{background:#16332a;color:#5fd9a3;}
.pill.admin{background:#2a1a3a;color:#c79bf0;}
.bill-name{font-weight:bold;}
.bill-sub{color:var(--sub);font-size:11.5px;}
input,select{background:#0b1622;border:1px solid var(--line);color:var(--text);padding:8px;border-radius:6px;font-size:13px;width:100%;margin-bottom:4px;}
label{font-size:11.5px;color:var(--sub);display:block;margin-bottom:4px;margin-top:8px;}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
button.primary{background:linear-gradient(135deg,var(--gold) 0%,var(--gold2) 100%);color:#1a1206;border:none;padding:11px;border-radius:7px;font-weight:bold;font-size:13.5px;cursor:pointer;width:100%;margin-top:12px;}
button.danger{background:#3a1a1a;color:#ff8b7c;border:1px solid #4a2c1f;padding:7px 10px;border-radius:6px;font-size:12px;cursor:pointer;}
button.ghost{background:none;border:1px solid var(--line);color:var(--sub);padding:8px;border-radius:7px;font-size:12px;cursor:pointer;}
.total{display:flex;justify-content:space-between;font-weight:bold;padding-top:10px;font-size:14px;}
.stat{display:flex;justify-content:space-between;align-items:center;}
.stat .num{font-size:22px;font-weight:bold;color:var(--gold2);}
.stat .lbl{font-size:11px;color:var(--sub);}
.banner{background:#1a2c14;border:1px solid #2c4a1f;color:#a3d97c;padding:10px;border-radius:8px;font-size:12.5px;margin-bottom:12px;}
.alertbox{background:#2c1a14;border:1px solid #4a2c1f;color:#ffb38c;padding:10px;border-radius:8px;font-size:12.5px;margin-bottom:12px;}
.disclaimer{background:#332108;border:1px solid #5a4317;color:#ffd98a;padding:11px;border-radius:8px;font-size:12px;margin-bottom:14px;line-height:1.5;}
.edu{border-left:3px solid var(--gold);background:#101f30;}
.edu h3{color:var(--gold2);font-size:13.5px;margin:0 0 6px;}
.goal{background:#0b1622;border:1px solid var(--line);border-radius:8px;padding:10px;margin-bottom:10px;}
.goal .bar{height:7px;background:#22384f;border-radius:4px;overflow:hidden;margin:6px 0;}
.goal .fill{height:100%;background:linear-gradient(90deg,var(--gold),var(--gold2));}
table{width:100%;font-size:12px;border-collapse:collapse;}
table th,table td{padding:6px 4px;text-align:right;border-bottom:1px solid var(--line);}
table th:first-child,table td:first-child{text-align:left;}
.muted{color:var(--sub);font-size:11.5px;line-height:1.5;}
.tag{display:inline-block;background:#0b1622;border:1px solid var(--line);color:var(--gold2);font-size:10.5px;padding:2px 7px;border-radius:5px;margin-right:5px;margin-bottom:5px;}
.footer-note{font-size:10.5px;color:var(--sub);text-align:center;margin-top:18px;line-height:1.6;}
.delbtn{background:none;border:none;color:#c1453a;font-size:16px;cursor:pointer;padding:0 4px;}
.addrow{display:flex;gap:6px;margin-top:8px;}
a{color:var(--gold2);}