*{box-sizing:border-box}
:root{
  --bg:#0b0e14;
  --panel:#111827;
  --text:#e5e7eb;
  --muted:#9ca3af;
  --accent:#22c55e;
  --accent-2:#eab308;
  --border:#1f2937;
}
html,body{margin:0;height:100%;font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,'Helvetica Neue',Arial}
body{background:var(--bg);color:var(--text);display:flex;flex-direction:column;gap:16px}
header,footer{padding:16px 20px}
header h1{margin:0 0 6px 0;font-size:22px}
.toolbar{display:flex;align-items:center;gap:10px;margin-top:8px}
.toolbar input[type="date"]{background:#0f172a;border:1px solid var(--border);color:var(--text);padding:8px 10px;border-radius:10px}
.toolbar button{background:#0f172a;border:1px solid var(--border);color:var(--text);padding:8px 12px;border-radius:10px;cursor:pointer}
.toolbar button:hover{filter:brightness(1.1)}
#status{margin-left:auto;font-size:14px;color:var(--muted)}
main{padding:0 20px 20px 20px}
.card{background:var(--panel);border:1px solid var(--border);border-radius:16px;padding:12px;box-shadow:0 10px 30px rgba(0,0,0,.25)}
table{width:100%;border-collapse:separate;border-spacing:0}
th,td{border-bottom:1px solid var(--border);border-right:1px solid var(--border);padding:10px 12px;vertical-align:middle}
th:first-child,td:first-child{border-left:1px solid var(--border)}
tr:first-child th{border-top:1px solid var(--border)}
thead th{position:sticky;top:0;background:#0f172a;z-index:2}
th{font-weight:600;text-align:center}
td{min-width:100px}
.row-label{white-space:nowrap;font-weight:600;color:var(--muted);background:#0f172a;position:sticky;left:0;z-index:1}
.cell{background:transparent;outline:none}
.cell[contenteditable="true"]:focus{background:#111827;box-shadow:inset 0 0 0 2px #334155;border-radius:6px}
.state-saving{color:var(--accent-2)}
.state-saved{color:var(--accent)}
.state-error{color:#ef4444}