:root{
  /* THRIVE Connect 2026 palette: deep purple, charcoal, violet, magenta + their tints */
  --brand:#3e2e5f; --brand-ink:#fff; --violet:#70539e; --magenta:#d35098; --plum:#a2519b;
  --grad:linear-gradient(135deg,#70539e 0%,#a2519b 55%,#d35098 100%);
  --bg:#f7f5fa; --card:#fff; --ink:#343434; --muted:#6b6672; --line:#e6e1ee;
  --ok:#70539e; --bad:#d35098;
  --s1:#3e2e5f; --s2:#d35098; --s3:#70539e; --s4:#343434; --s5:#a2519b; --s6:#9b88c4; --s7:#e88cbd; --s8:#6f6f6f; --s9:#5b4689; --s10:#c3b6dd;
  --radius:14px; --font:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font);-webkit-font-smoothing:antialiased}
a{color:var(--brand)}
button,input,select,textarea{font:inherit;color:inherit}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:10px;padding:12px 18px;background:var(--brand);color:var(--brand-ink);font-weight:600;cursor:pointer;text-decoration:none;transition:transform .08s,filter .15s}
.btn:hover{filter:brightness(1.07)} .btn:active{transform:scale(.98)} .btn:disabled{opacity:.5;cursor:default}
.btn.ghost{background:transparent;color:var(--ink);border:1px solid var(--line)}
.btn.sm{padding:7px 12px;font-size:14px;border-radius:8px}
.btn.danger{background:var(--bad)}
input[type=text],input[type=password],input[type=number],textarea,select{width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:10px;background:#fff;outline:none}
input:focus,textarea:focus,select:focus{border-color:var(--brand);box-shadow:0 0 0 3px color-mix(in srgb,var(--brand) 20%,transparent)}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:20px}
.muted{color:var(--muted)} .center{text-align:center}
.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.spacer{flex:1}
.toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);background:#111;color:#fff;padding:10px 16px;border-radius:10px;font-size:14px;z-index:99;opacity:0;transition:opacity .2s;pointer-events:none;max-width:90vw}
.toast.show{opacity:1}
.pill{display:inline-block;padding:3px 10px;border-radius:99px;background:color-mix(in srgb,var(--brand) 12%,#fff);color:var(--brand);font-size:12px;font-weight:600;letter-spacing:.02em}

/* ---------- results ---------- */
.cols{display:flex;align-items:flex-end;justify-content:center;gap:clamp(8px,2vw,28px);height:100%;padding-top:30px}
.col{flex:1;max-width:180px;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%;min-width:0}
.col .val{font-weight:700;font-size:clamp(14px,2.2vw,30px);margin-bottom:6px}
.col .bar{width:100%;border-radius:8px 8px 0 0;min-height:4px;transition:height .6s cubic-bezier(.2,.8,.2,1)}
.col .lab{margin-top:10px;font-size:clamp(12px,1.5vw,22px);text-align:center;line-height:1.2;word-break:break-word;min-height:2.4em}
.col.correct .lab{color:var(--ok);font-weight:700}
.col.wrong .bar{opacity:.3}
.hbars{display:flex;flex-direction:column;gap:10px}
.hbar{position:relative;border:1px solid var(--line);border-radius:10px;overflow:hidden;background:#fff}
.hbar .fill{position:absolute;inset:0 auto 0 0;opacity:.18;transition:width .6s}
.hbar .t{position:relative;display:flex;justify-content:space-between;padding:10px 12px;gap:10px}
.hbar.correct{border-color:var(--ok)}
.cloud{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;align-content:center;gap:.15em .45em;height:100%;padding:10px;line-height:1.05}
.cloud span{font-weight:700;animation:pop .4s ease-out}
@keyframes pop{from{transform:scale(.4);opacity:0}to{transform:scale(1);opacity:1}}
.texts{columns:3 260px;column-gap:16px}
.texts div{break-inside:avoid;background:#fff;border:1px solid var(--line);border-left:4px solid var(--brand);border-radius:10px;padding:12px 14px;margin-bottom:14px;animation:pop .35s}
.qa-list{display:flex;flex-direction:column;gap:10px}
.qa-item{display:flex;gap:12px;align-items:flex-start;background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px 14px}
.qa-item.answered{opacity:.5}
.qa-votes{min-width:54px;text-align:center;font-weight:700;border:1px solid var(--line);border-radius:10px;padding:6px 4px;background:#fff;cursor:pointer}
.qa-votes.on{background:var(--brand);color:#fff;border-color:var(--brand)}
.leader{display:flex;flex-direction:column;gap:8px}
.leader div{display:flex;justify-content:space-between;background:#fff;border:1px solid var(--line);border-radius:10px;padding:10px 14px;font-weight:600}
.leader div:nth-child(1){border-color:#eab308;background:#fefce8}
.avg{font-size:clamp(28px,5vw,72px);font-weight:800;color:var(--brand)}

/* logo + brand accents */
.logo{display:block;height:auto;max-width:100%}
.brandbar{height:5px;background:var(--grad)}
.btn{background:var(--brand)}
.btn.accent{background:var(--grad)}
.leader div:nth-child(1){border-color:var(--magenta);background:#fbeef5}
.col.correct .lab,.hbar.correct{color:var(--violet)}
