:root {
  --bg: #0f1115;
  --panel: #181b22;
  --panel-2: #1e222b;
  --border: #2a2f3a;
  --text: #e6e8ee;
  --muted: #9aa3b2;
  --accent: #6ee7b7;
  --accent-dim: #2dd4bf;
  --rec: #f5d76e;
  --radius: 10px;
  --font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font-family: var(--font);
  line-height: 1.5;
  padding: 0 1.25rem 4rem;
  max-width: 1100px;
  margin-inline: auto;
}

a { color: var(--accent-dim); text-decoration: none; }
a:hover { text-decoration: underline; }
code { background: var(--panel-2); padding: 0.1em 0.4em; border-radius: 5px; font-size: 0.9em; }

.site-header { padding: 1.5rem 0 0.85rem; border-bottom: 1px solid var(--border); margin-bottom: 0.9rem; }
.site-header h1 { font-size: 1.4rem; margin: 0 0 0.2rem; font-weight: 650; letter-spacing: -0.01em; }
.accent { color: var(--accent); }
.sub { color: var(--muted); margin: 0; font-size: 0.88rem; }

/* Sort bar */
.sortbar { display: flex; align-items: center; gap: 0.4rem; margin-bottom: 1.1rem; font-size: 0.82rem; }
.sortbar-label { color: var(--muted); margin-right: 0.2rem; }
.sortbar a {
  color: var(--muted); padding: 0.2rem 0.6rem; border: 1px solid var(--border);
  border-radius: 999px; background: var(--panel);
}
.sortbar a:hover { color: var(--text); text-decoration: none; border-color: var(--accent-dim); }
.sortbar a.active { color: #04221d; background: var(--accent-dim); border-color: var(--accent-dim); font-weight: 600; }

/* Sections */
.section-title { font-size: 0.9rem; font-weight: 600; margin: 1.1rem 0 0.5rem; color: var(--muted); text-transform: uppercase; letter-spacing: 0.04em; }
.section-title.recommended { color: var(--rec); }
.empty { color: var(--muted); }

/* Domain list — dense rows */
.domain-list { list-style: none; margin: 0; padding: 0; border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; }
.row { background: var(--panel); border-top: 1px solid var(--border); }
.row:first-child { border-top: none; }
.row.is-recommended { border-left: 3px solid var(--rec); }
.row summary {
  display: flex; align-items: center; gap: 0.6rem;
  padding: 0.3rem 0.7rem; cursor: pointer; list-style: none;
}
.row summary::-webkit-details-marker { display: none; }
.row summary:hover { background: var(--panel-2); }
.row .domain { flex: 1 1 auto; font-weight: 600; font-size: 0.92rem; word-break: break-all; }
.row .expiry { flex: none; color: var(--muted); font-size: 0.8rem; font-variant-numeric: tabular-nums; }
.row .badge { flex: none; }
.row[open] summary { background: var(--panel-2); }
.reason { padding: 0.1rem 0.7rem 0.6rem 2.9rem; }
.reason p { margin: 0.3rem 0; font-size: 0.85rem; color: #c7cdd9; }
.lang { display: inline-block; min-width: 1.8rem; margin-right: 0.45rem; font-size: 0.64rem; font-weight: 700; color: var(--muted); border: 1px solid var(--border); border-radius: 4px; padding: 0 0.25rem; text-align: center; vertical-align: middle; }

/* Score chip — compact square */
.score {
  flex: none; width: 1.55rem; height: 1.55rem; border-radius: 6px;
  display: grid; place-items: center; font-weight: 700; font-size: 0.8rem;
  background: var(--panel-2); color: var(--text); border: 1px solid var(--border);
}
.score-8, .score-9, .score-10 { background: #14532d; color: #bbf7d0; border-color: #16653a; }
.score-6, .score-7 { background: #3f3a14; color: #fde68a; border-color: #5c5320; }
.score-1, .score-2, .score-3, .score-4, .score-5 { background: #3a1414; color: #fca5a5; border-color: #5c2020; }

/* Category badge */
.badge { font-size: 0.66rem; text-transform: uppercase; letter-spacing: 0.04em; padding: 0.1rem 0.45rem; border-radius: 999px; border: 1px solid var(--border); color: var(--muted); }
.badge-brandable { color: #c4b5fd; border-color: #5b4ba8; }
.badge-keyword { color: #93c5fd; border-color: #2f5fa8; }
.badge-dictionary { color: #6ee7b7; border-color: #2f8a6b; }
.badge-numeric { color: #fbbf24; border-color: #8a6a1f; }
.badge-garbage { color: #9aa3b2; }

.site-footer { margin-top: 3rem; padding-top: 1rem; border-top: 1px solid var(--border); color: var(--muted); font-size: 0.85rem; }

/* Admin */
body.centered { display: grid; place-items: center; min-height: 100vh; }
.login-card, .panel {
  background: var(--panel); border: 1px solid var(--border);
  border-radius: var(--radius); padding: 1.5rem; margin-bottom: 1.5rem;
}
.login-card { width: min(360px, 90vw); display: flex; flex-direction: column; gap: 0.9rem; }
.panel h2 { margin-top: 0; font-size: 1.1rem; }
.admin label { display: flex; flex-direction: column; gap: 0.35rem; margin-bottom: 0.9rem; font-size: 0.88rem; color: var(--muted); }
.admin input[type=text], .admin input[type=password], .admin input[type=number],
.login-card input {
  background: var(--panel-2); border: 1px solid var(--border); color: var(--text);
  padding: 0.55rem 0.7rem; border-radius: 7px; font-size: 0.95rem;
}
fieldset { border: 1px solid var(--border); border-radius: 7px; margin: 0 0 1rem; padding: 0.8rem 1rem; }
legend { color: var(--muted); font-size: 0.85rem; padding: 0 0.4rem; }
.radio { flex-direction: row !important; align-items: center; gap: 0.4rem !important; display: inline-flex !important; margin-right: 1.2rem; }
button {
  background: var(--accent-dim); color: #04221d; border: none; font-weight: 650;
  padding: 0.55rem 1.1rem; border-radius: 7px; cursor: pointer; font-size: 0.95rem;
}
button:hover { background: var(--accent); }
button.link { background: none; color: var(--accent-dim); padding: 0; font-weight: 500; }
.inline { display: inline; }
.flash { background: #14323a; border: 1px solid #1f5c66; color: #a5f3eb; padding: 0.7rem 1rem; border-radius: 7px; margin-bottom: 1.5rem; }
.error { color: #fca5a5; font-size: 0.9rem; }
.hint, .muted { color: var(--muted); font-size: 0.85rem; }
.set { color: var(--accent); font-size: 0.75rem; }
.back { font-size: 0.85rem; }

.runlog { width: 100%; border-collapse: collapse; font-size: 0.85rem; }
.runlog th, .runlog td { text-align: left; padding: 0.5rem 0.6rem; border-bottom: 1px solid var(--border); vertical-align: top; }
.runlog th { color: var(--muted); font-weight: 600; }
.errcell { color: #fca5a5; max-width: 360px; word-break: break-word; }

.rules { margin: 0; padding-left: 1.2rem; font-size: 0.88rem; line-height: 1.7; }
.rules code, .filter-group code { background: var(--panel-2); border: 1px solid var(--border); border-radius: 5px; padding: 0.05rem 0.4rem; font-size: 0.82rem; }

.filtered { margin-top: 1rem; }
.filter-group { margin-bottom: 0.4rem; }
.filter-group summary { cursor: pointer; padding: 0.35rem 0; }
.filter-group .count { color: var(--muted); }
.filtered-list { columns: 3 200px; column-gap: 1.5rem; margin: 0.5rem 0 0.8rem; padding-left: 1.1rem; font-size: 0.82rem; }
.filtered-list li { break-inside: avoid; }
