:root {
  --bg:#15161a; --panel:#1d1f25; --panel2:#24262e; --line:#33363f;
  --fg:#e6e7ea; --dim:#9ba0ab; --accent:#c9a227; --ok:#5fb37a;
  --warn:#d99a3c; --err:#d2635f; --blue:#8fa8d8;
}
* { box-sizing:border-box; }
[hidden] { display:none !important; }
html { color-scheme: dark; }
body { margin:0; background:var(--bg); color:var(--fg);
       font:15px/1.5 "Segoe UI", system-ui, sans-serif; }
a { color:var(--accent); }
header.top { display:flex; align-items:center; gap:14px; flex-wrap:wrap;
             padding:12px 20px; background:var(--panel); border-bottom:1px solid var(--line); }
header.top h1 { font-size:16px; margin:0; font-weight:600; }
header.top h1 a { color:inherit; text-decoration:none; }
header.top h1 span { color:var(--accent); }
header.top nav { margin-left:auto; display:flex; gap:14px; align-items:center; font-size:14px; }
input, select { background:var(--bg); color:var(--fg); border:1px solid var(--line);
                border-radius:6px; padding:8px 10px; font:inherit; min-width:0; width:100%; }
input:focus, select:focus { outline:1px solid var(--accent); border-color:var(--accent); }
button { background:var(--accent); color:#1a1710; border:none; border-radius:6px;
         padding:8px 15px; font:inherit; font-weight:600; cursor:pointer; }
button:hover { filter:brightness(1.1); }
button:disabled { opacity:.6; cursor:default; }
button.sub { background:var(--panel2); color:var(--fg); border:1px solid var(--line); }
button.danger { background:transparent; color:var(--err); border:1px solid #5a2a2c; }
label.f { display:block; font-size:13px; color:var(--dim); margin:0 0 4px; }
.err { color:var(--err); font-size:14px; }
.okmsg { color:var(--ok); font-size:14px; }
.warnmsg { color:var(--warn); font-size:14px; }
.empty { color:var(--dim); padding:34px; text-align:center; }
.langtoggle { position:fixed; right:16px; bottom:16px; z-index:50; background:var(--panel);
              color:var(--dim); border:1px solid var(--line); border-radius:8px; padding:7px 12px;
              font-weight:600; font-size:13px; box-shadow:0 4px 16px #0006; }
.langtoggle .on { color:var(--accent); }
.pill { display:inline-flex; align-items:center; gap:6px; font-size:12px; font-weight:600;
        text-transform:uppercase; letter-spacing:.5px; padding:2px 9px; border-radius:20px;
        border:1px solid var(--line); background:var(--panel2); color:var(--dim); white-space:nowrap; }
.pill.live { color:var(--ok); border-color:#2f5a3c; background:#1c2a21; }
.pill.live::before { content:""; width:7px; height:7px; border-radius:50%; background:var(--ok);
                     animation:pulse 1.6s ease-in-out infinite; }
.pill.done { color:var(--ok); border-color:#2f5a3c; }
.pill.partial { color:var(--warn); border-color:#5a4520; background:#2a2418; }
.pill.ended { color:var(--dim); }
@keyframes pulse { 50% { opacity:.35; } }
@media (prefers-reduced-motion: reduce) { .pill.live::before { animation:none; } }