:root{--bg:#f3f6fa;--card:#fff;--text:#17263a;--muted:#536279;--line:#dce3ed;--warn-bg:#fff3df;--warn:#8a4200;--accent:#1d5fbf;--accent-text:#fff;--chip:#eef2f7;--danger:#a3261b;--ok:#1d6b3c}
@media (prefers-color-scheme:dark){:root{--bg:#0f1622;--card:#172131;--text:#e6edf6;--muted:#a3b1c4;--line:#2a3850;--warn-bg:#3a2a12;--warn:#ffcf8a;--accent:#7fb0ff;--accent-text:#0f1622;--chip:#223049;--danger:#ff9d92;--ok:#8be0ab}}
*{box-sizing:border-box}
body{font:16px/1.55 system-ui,-apple-system,"Segoe UI",sans-serif;background:var(--bg);color:var(--text);margin:0;padding:16px}
main{max-width:680px;margin:0 auto;display:grid;gap:16px}
header h1{margin:0;line-height:1.2;font-size:1.6rem}
.eyebrow{margin:0 0 4px;font-size:.75rem;letter-spacing:.08em;color:var(--muted)}
section,.status{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:16px}
.status{background:var(--warn-bg);border-color:transparent}
.status strong{color:var(--warn)}
.status p{margin:.4em 0 0}
h2{font-size:1.15rem;margin:0 0 8px}
h3{font-size:1rem;margin:0}
p{margin:.5em 0}
.muted{color:var(--muted);font-size:.9rem}
ul.cards{list-style:none;padding:0;margin:8px 0;display:grid;gap:10px}
.card{border:1px solid var(--line);border-radius:12px;padding:12px;display:grid;gap:6px}
.row{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.spread{justify-content:space-between}
.chip{display:inline-block;background:var(--chip);border-radius:999px;padding:2px 10px;font-size:.8rem;color:var(--muted)}
.chip.warn{color:var(--warn)}
form{display:grid;gap:10px;margin-top:8px}
label{display:grid;gap:4px;font-size:.9rem}
input,select{font:inherit;padding:10px;border-radius:10px;border:1px solid var(--line);background:var(--bg);color:var(--text);width:100%;min-height:44px}
button{font:inherit;min-height:44px;padding:8px 14px;border-radius:10px;border:1px solid var(--accent);background:var(--accent);color:var(--accent-text);cursor:pointer}
button.secondary{background:transparent;color:var(--accent)}
button.danger{background:transparent;color:var(--danger);border-color:var(--danger)}
button:disabled{opacity:.5;cursor:wait}
.message{margin:0;font-size:.9rem}
.message.error{color:var(--danger)}
.message.ok{color:var(--ok)}
.empty{color:var(--muted);font-style:italic}
a{color:var(--accent)}
@media (min-width:560px){form.inline{grid-template-columns:1fr 1fr}form.inline .full{grid-column:1/-1}}
textarea{font:inherit;padding:10px;border-radius:10px;border:1px solid var(--line);background:var(--bg);color:var(--text);width:100%}
input[type=checkbox]{width:auto;min-height:auto}
label.row{display:flex;gap:6px;align-items:center}
.intervals{display:grid;gap:8px}
.interval select{flex:1 1 120px}.interval input{flex:1 1 90px;width:auto}
.card .status{padding:12px}
.pairing{display:grid;gap:4px}
.code{font:600 1.25rem/1.4 ui-monospace,monospace;letter-spacing:.08em;overflow-wrap:anywhere;user-select:all}