/* Тема читальни codeofdigitaleternity.online — «мессенджер» (27.09.2026): фиолетово-синий фон чата,
   пузыри сообщений с «хвостиком», лавандовый и синий акценты. Только переопределение оформления поверх
   общего ядра — ни один блок не убирается. */
:root{--void:#120f24;--void-light:#1b1734;--accent:#b69cff;--accent2:#5aa8ff;--text:#f1eeff;--muted:#aaa3c9;
  --glass:rgba(182,156,255,.05);--glass-border:rgba(182,156,255,.18)}
body{background:radial-gradient(800px 420px at 85% 0%,rgba(90,168,255,.16),transparent 65%),
  radial-gradient(700px 400px at 0% 100%,rgba(182,156,255,.14),transparent 65%),var(--void);color:var(--text)}
h1,h2,h3,.rr-magnet h2,.rr-hero h1{font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;font-weight:800;letter-spacing:-.5px}
.rr-magnet,.card{border-radius:22px 22px 22px 6px;border:1px solid var(--glass-border)}
.rr-mlabel{color:var(--accent);letter-spacing:.16em}
/* игра «Кто помнит?» */
.rr-gamecard{margin-top:22px}
.on-hud{display:flex;flex-wrap:wrap;gap:16px;margin:6px 0 10px;font-size:14px;color:var(--muted)}
.on-hud span:nth-child(2){color:var(--accent)}
.on-chat{display:flex;flex-direction:column;gap:10px;padding:16px;border-radius:20px;background:#0d0b1b;border:1px solid var(--glass-border)}
.on-memo{display:flex;flex-direction:column;gap:2px;align-self:center;max-width:92%;padding:8px 14px;border-radius:12px;
  background:rgba(255,255,255,.05);border:1px dashed rgba(182,156,255,.35);text-align:center;font-size:13px;color:var(--muted)}
.on-memo-h{text-transform:uppercase;letter-spacing:.12em;font-size:11px;color:var(--accent)}
.on-memo-t{color:var(--text)}
.on-bubble{display:flex;flex-direction:column;gap:4px;max-width:88%;padding:10px 14px;line-height:1.45;font-size:15px}
.on-in{align-self:flex-start;background:#2a2450;border-radius:18px 18px 18px 4px}
.on-who{font-size:12px;color:var(--accent);font-weight:700}
.on-pick{margin:4px 0 0;font-weight:700;font-size:14px}
.on-time{height:4px;border-radius:2px;background:rgba(182,156,255,.14)}
.on-time-fill{height:100%;width:100%;border-radius:2px;background:linear-gradient(90deg,var(--accent2),var(--accent))}
.on-replies{display:flex;flex-direction:column;gap:8px;align-items:flex-end}
.on-out{position:relative;flex-direction:row;align-items:flex-start;gap:10px;min-width:0;text-align:left;cursor:pointer;
  border:1px solid rgba(90,168,255,.4);background:rgba(90,168,255,.14);color:var(--text);font:inherit;font-size:15px;border-radius:18px 18px 4px 18px;flex-wrap:wrap}
.on-out:hover:not(:disabled),.on-out:focus-visible{background:rgba(90,168,255,.26);outline:2px solid var(--accent2);outline-offset:1px}
.on-out:disabled{cursor:default}
.on-key{display:grid;place-items:center;flex:0 0 auto;width:22px;height:22px;border-radius:50%;background:rgba(255,255,255,.14);font-size:12px;font-weight:700}
.on-text{flex:1 1 0;min-width:0}
.on-tag{flex:1 0 100%;font-size:12px;font-weight:700}
.on-v0{border-color:#5fe0a6;background:rgba(95,224,166,.14)}
.on-v0 .on-tag{color:#8ff0c3}
.on-v1{opacity:.75}
.on-v1 .on-tag{color:var(--muted)}
.on-v2{border-color:#ff8f8f;background:rgba(255,120,120,.10)}
.on-v2 .on-tag{color:#ffb0b0}
.on-chosen{box-shadow:0 0 0 2px var(--text) inset}
.on-next{align-self:flex-end}
.on-over{display:flex;flex-direction:column;align-items:center;gap:10px;text-align:center}
.on-over .on-bubble{align-self:center;text-align:left}
.on-over p{margin:0;max-width:560px;line-height:1.55}
.on-big{font-size:20px;font-weight:800;color:var(--accent)}
.on-best{color:var(--accent2);font-weight:700}
.on-links{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;align-items:center}
.on-cta{color:#120f24;background:var(--accent);padding:10px 18px;border-radius:18px 18px 4px 18px;font-weight:800;text-decoration:none}
.on-cta:hover,.on-cta:focus-visible{background:#cbb8ff}
.on-calc{color:var(--accent2);text-decoration:underline}
@media (max-width:640px){.on-chat{padding:12px}.on-bubble{max-width:100%}.on-out{font-size:14px}}
