:root { --fg:#1b1b1f; --muted:#5b5b66; --accent:#3a5bd9; --warn:#fff4cc; --warnb:#d9a400; --ok:#e6f6ea; --err:#b3261e; }
* { box-sizing: border-box; }
body { margin:0; font: 17px/1.5 system-ui, -apple-system, "Segoe UI", sans-serif; color:var(--fg); background:#fafafc; }
header, footer { padding: .8em 1.2em; }
header { display:flex; justify-content:space-between; border-bottom:1px solid #e5e5ee; background:#fff; }
header a { color:var(--fg); text-decoration:none; } .brand { font-weight:600; }
footer { color:var(--muted); font-size:.85em; }
main { max-width: 40em; margin: 0 auto; padding: 1.2em; }
h1 { font-size:1.6em; margin:.4em 0; } h2 { font-size:1.15em; margin-top:1.6em; }
.lead { font-size:1.1em; } .small { font-size:.88em; color:var(--muted); }
.count { color:var(--muted); }
form.signin { display:flex; flex-wrap:wrap; gap:.5em; align-items:center; margin:1.2em 0; }
form.signin label { width:100%; font-weight:600; }
form.signin label.opt { font-weight:normal; }
input, select { font:inherit; padding:.45em .6em; border:1px solid #c8c8d4; border-radius:6px; }
input#handle, input[name=contactValue] { flex:1; min-width:14em; }
button { font:inherit; padding:.5em 1em; border:0; border-radius:6px; background:var(--accent); color:#fff; cursor:pointer; }
button:disabled { background:#a9a9b8; cursor:not-allowed; }
button.link { background:none; color:var(--accent); padding:0; }
fieldset { border:0; padding:0; margin:1em 0; }
label.opt { display:flex; gap:.6em; align-items:flex-start; margin:.7em 0; }
label.opt input { margin-top:.35em; }
.warn, .note { background:var(--warn); border-left:4px solid var(--warnb); padding:.6em .8em; }
.ok { background:var(--ok); padding:.6em .8em; }
.error { color:var(--err); font-weight:600; }
.mono { font-family: ui-monospace, Menlo, Consolas, monospace; word-break:break-all; font-size:.9em; }
#key-box { background:#fff; border:1px solid #e5e5ee; border-radius:8px; padding:.4em 1em 1em; }
ol.keys .label { display:inline-block; min-width:9em; font-weight:600; }
table.admin { border-collapse:collapse; width:100%; font-size:.9em; }
table.admin td, table.admin th { border-bottom:1px solid #e5e5ee; padding:.4em; text-align:left; vertical-align:top; }
tr.alert { background:var(--warn); }
button.danger { background:var(--err); }