:root{
  --bg:#f4f5f7;
  --card:#ffffff;
  --text:#1a1d23;
  --muted:#6b7280;
  --accent:#2563eb;
  --accent-dark:#1d4ed8;
  --border:#e5e7eb;
  --ok:#16a34a;
  --danger:#dc2626;
  --danger-dark:#b91c1c;
}
@media (prefers-color-scheme: dark){
  :root{
    --bg:#111318;
    --card:#1b1e26;
    --text:#f2f3f5;
    --muted:#9aa1ac;
    --accent:#3b82f6;
    --accent-dark:#2563eb;
    --border:#2a2e38;
    --ok:#22c55e;
    --danger:#ef4444;
    --danger-dark:#dc2626;
  }
}
*{box-sizing:border-box;}
body{
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  min-height:100vh;
}
.wrap{
  width:100%;
  max-width:900px;
  margin:0 auto;
  padding:16px;
  display:flex;
  flex-direction:column;
  gap:14px;
}
h1{ font-size:1.25rem; margin:4px 0 0 0; text-align:center; }
.card{
  background:var(--card);
  border:1px solid var(--border);
  border-radius:12px;
  padding:16px;
}
button{
  border:none;
  border-radius:10px;
  padding:10px 14px;
  font-size:0.9rem;
  font-weight:600;
  cursor:pointer;
  color:#fff;
  background:var(--accent);
  transition:background .15s;
}
button:active{background:var(--accent-dark);}
button.secondary{ background:transparent; color:var(--text); border:1px solid var(--border); }
button.danger{background:var(--danger);}
button.danger:active{background:var(--danger-dark);}
button:disabled{opacity:.5; cursor:not-allowed;}
input, select{
  font-size:0.95rem;
  padding:10px 12px;
  border-radius:10px;
  border:1px solid var(--border);
  background:var(--card);
  color:var(--text);
}
table{ width:100%; border-collapse:collapse; font-size:0.85rem; }
th,td{ padding:10px 12px; text-align:left; border-bottom:1px solid var(--border); white-space:nowrap; }
th{
  position:sticky; top:0; background:var(--card); color:var(--muted);
  font-weight:600; font-size:0.75rem; text-transform:uppercase; letter-spacing:.03em;
}
td.code{ font-family:ui-monospace,SFMono-Regular,Menlo,monospace; word-break:break-all; white-space:normal; }
.muted{ color:var(--muted); }
.table-wrap{ background:var(--card); border:1px solid var(--border); border-radius:12px; overflow:auto; max-height:55vh; }
.empty{ text-align:center; color:var(--muted); padding:24px; font-size:0.9rem; }
