:root{
  --bg:#0B0D10; --panel:#14171C; --text:#EDEFF2; --text-soft:#9AA1AC;
  --line:rgba(255,255,255,0.10); --accent:#4F8CFF; --ok:#34D399; --warn:#F2A93B;
  --radius:8px;
}
*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }
body{
  font-family:system-ui,-apple-system,'Segoe UI',sans-serif;
  background:var(--bg); color:var(--text); line-height:1.5; min-height:100vh;
}
.container{ max-width:720px; margin:0 auto; padding:24px 20px; }
input,select,button{ font:inherit; }
input,select{
  background:var(--panel); color:var(--text); border:1px solid var(--line);
  border-radius:var(--radius); padding:10px 12px; width:100%;
}
button{
  background:var(--accent); color:#fff; border:none; border-radius:var(--radius);
  padding:10px 16px; cursor:pointer;
}
button.secondary{ background:transparent; border:1px solid var(--line); color:var(--text); }
.field{ margin-bottom:14px; }
.field label{ display:block; font-size:0.85rem; color:var(--text-soft); margin-bottom:6px; }
.row{ display:flex; gap:10px; }
.badge{ padding:2px 8px; border-radius:999px; font-size:0.8rem; }
.badge.paid{ background:rgba(52,211,153,0.15); color:var(--ok); }
.badge.unpaid{ background:rgba(242,169,59,0.15); color:var(--warn); }
.error{ color:#F26B6B; font-size:0.9rem; margin-top:8px; }
.success{ color:var(--ok); font-size:0.9rem; margin-top:8px; }
:focus-visible{ outline:2px solid var(--accent); outline-offset:2px; }