:root{
  --bg: #ffffff;
  --text: #111827;
  --muted: #6b7280;

  --card: #ffffff;
  --card-border: #e5e7eb;

  --header: #ffffff;
  --header-border: #e5e7eb;

  --btn-bg: #ffffff;
  --btn-border: #d1d5db;
  --btn-hover: #f3f4f6;

  --input-bg: #ffffff;
  --input-border: #d1d5db;

  --pill-bg: #f3f4f6;
  --pill-border: #d1d5db;
}

*{box-sizing:border-box}
body{
  font-family: system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  margin:0;
  background: var(--bg);
  color: var(--text);
}

header{
  padding:14px 18px;
  border-bottom:1px solid var(--header-border);
  background: var(--header);
  display:flex;
  gap:12px;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
}

h1{margin:0;font-size:18px}

main{padding:18px;max-width:1400px;margin:0 auto}

.muted{color: var(--muted)}

a.btn, button.btn{
  display:inline-block;
  padding:10px 12px;
  border-radius:12px;
  text-decoration:none;
  color: var(--text);
  border:1px solid var(--btn-border);
  background: var(--btn-bg);
  cursor:pointer;
}
a.btn:hover, button.btn:hover{background: var(--btn-hover)}

select, input{
  background: var(--input-bg);
  color: var(--text);
  border: 1px solid var(--input-border);
  border-radius:12px;
  padding:10px 12px;
  outline:none;
}

.card{
  background: var(--card);
  border: 1px solid var(--card-border);
  border-radius:14px;
  padding:16px;
}

.tabs{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:14px}
.tab{
  padding:10px 12px;
  border-radius:12px;
  border:1px solid var(--btn-border);
  cursor:pointer;
  background:#fff;
}
.tab.active{background: var(--btn-hover)}

table{width:100%;border-collapse:separate;border-spacing:0 8px}
th{font-size:12px;text-align:left;color:var(--muted);padding:0 10px}
td{
  background:#fff;
  border:1px solid var(--card-border);
  padding:10px;
  border-left:none;border-right:none;
  vertical-align:top;
}
tr td:first-child{border-left:1px solid var(--card-border);border-radius:12px 0 0 12px}
tr td:last-child{border-right:1px solid var(--card-border);border-radius:0 12px 12px 0}

.pill{
  display:inline-block;
  padding:3px 10px;
  border-radius:999px;
  border:1px solid var(--pill-border);
  background: var(--pill-bg);
  font-size:12px;
}
