:root{--bg:#fbf6ef;--surface:#fff;--text:#2b2620;--muted:#7a6f63;--line:#eadfd1;--shadow:0 2px 6px rgba(60,40,20,.08),0 12px 32px rgba(60,40,20,.10);
--believe:#7a6ad8;--rather:#e8714f;--honest:#23988a;--unhinged:#d23f87;color-scheme:light;font-family:system-ui,-apple-system,"Segoe UI",sans-serif;line-height:1.5}
@media (prefers-color-scheme:dark){:root{--bg:#1a1816;--surface:#25221f;--text:#f2ebe2;--muted:#ab9f92;--line:#3a352f;--shadow:0 2px 6px rgba(0,0,0,.3),0 12px 32px rgba(0,0,0,.35);
--believe:#a99cf5;--rather:#ff9a78;--honest:#4fc9b9;--unhinged:#f27ab3;color-scheme:dark}}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--text);background-image:radial-gradient(var(--line) 1px,transparent 1.2px);background-size:22px 22px}
.top{max-width:60rem;margin:auto;padding:1rem;display:flex;justify-content:space-between;align-items:center}
.brand{color:var(--muted);text-decoration:none}
.lang{display:flex;background:var(--surface);border-radius:2rem;padding:3px;box-shadow:var(--shadow)}
.lang button{font:inherit;font-weight:600;border:0;background:none;color:var(--muted);padding:.3rem .8rem;border-radius:2rem;cursor:pointer}
.lang button[aria-pressed=true]{background:var(--text);color:var(--bg)}
main{max-width:60rem;margin:auto;padding:0 1rem 3rem;text-align:center}
h1{font-family:Georgia,serif;font-size:clamp(2rem,6vw,3.2rem);margin:.5rem 0 .3rem;letter-spacing:-.01em}
.sub{color:var(--muted);max-width:34rem;margin:0 auto 1.6rem}
.decks{display:grid;grid-template-columns:repeat(4,1fr);gap:.8rem}
@media (max-width:44rem){.decks{grid-template-columns:repeat(2,1fr)}}
.deck{--c:var(--believe);font:inherit;color:var(--text);text-align:left;background:var(--surface);border:2px solid transparent;border-radius:1rem;padding:.8rem .9rem .7rem;cursor:pointer;box-shadow:var(--shadow);position:relative;overflow:hidden;transition:transform .12s,border-color .12s}
.deck::before{content:"";position:absolute;inset:0 0 auto 0;height:5px;background:var(--c)}
.deck:hover:not(:disabled){transform:translateY(-2px);border-color:var(--c)}
.deck:disabled{cursor:default;opacity:.7}
.deck .ic{font-size:1.3rem;color:var(--c)}
.deck b{display:block;font-size:1.02rem;margin-top:.1rem}
.deck small{display:block;color:var(--muted);font-size:.8rem;min-height:2.4em}
.deck .count{display:block;margin-top:.4rem;font-size:.8rem;font-weight:600;color:var(--c)}
.deck .bar{display:block;height:4px;border-radius:2px;background:var(--line);margin-top:.3rem;overflow:hidden}
.deck .bar i{display:block;height:100%;background:var(--c)}
.deck.shuffle{opacity:1}
.table{margin:1.6rem auto 0;min-height:18rem;display:flex;flex-direction:column;align-items:center;gap:1rem}
.card{--c:var(--believe);width:min(100%,25rem);aspect-ratio:5/6;background:color-mix(in srgb,var(--c) 5%,var(--surface));border-radius:1.4rem;box-shadow:var(--shadow);padding:1.4rem;display:flex;flex-direction:column;position:relative;border:10px solid color-mix(in srgb,var(--c) 18%,var(--surface))}
.card.empty{border:3px dashed var(--line);box-shadow:none;background:transparent;justify-content:center;color:var(--muted);aspect-ratio:auto;min-height:14rem}
.card .head{display:flex;justify-content:space-between;align-items:center;font-size:.78rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--c)}
.card .q{flex:1;display:flex;align-items:center;justify-content:center;font-family:Georgia,serif;font-size:clamp(1.25rem,4.4vw,1.6rem);line-height:1.3;padding:.5rem .2rem;text-wrap:balance}
.card .foot{font-size:2rem;color:var(--c);opacity:.85;display:flex;justify-content:space-between}
.card.new{animation:flip .45s ease-out}
@keyframes flip{from{transform:rotateY(80deg) scale(.95);opacity:.2}to{transform:none;opacity:1}}
@media (prefers-reduced-motion:reduce){.card.new{animation:none}}
.verdict{display:flex;gap:.8rem;justify-content:center}
.verdict[hidden]{display:none}
.verdict button{font:inherit;font-weight:700;font-size:1.05rem;border:0;border-radius:2rem;padding:.75rem 1.6rem;min-width:8.5rem;color:#fff;cursor:pointer;box-shadow:var(--shadow);transition:transform .1s}
.verdict button:hover:not(:disabled){transform:translateY(-2px)}
.verdict button:disabled{opacity:.6}
.verdict .ok{background:#2e9e5b}.verdict .bad{background:#d64545}
.status{color:var(--muted);font-size:.85rem;min-height:1.3em}
@media (max-width:44rem){.card{aspect-ratio:auto;min-height:17rem;padding:1.1rem}.card .foot{font-size:1.5rem}.table{margin-top:1.1rem}.sub{font-size:.92rem}}
@media (max-width:44rem){.deck small{display:none}.deck{padding:.65rem .8rem .55rem}}