/* Farger og grunnoppsett */
:root{--bg1:#6a5cff;--bg2:#ff6fb1;--kort:#fff;--tekst:#2b2250;--ok:#2ecc71;--feil:#ff5a5f}
*{box-sizing:border-box}
body{margin:0;min-height:100vh;font-family:system-ui,"Segoe UI",Roboto,sans-serif;color:var(--tekst);
 background:linear-gradient(135deg,var(--bg1),var(--bg2));background-attachment:fixed;display:flex;justify-content:center}
.skjerm{display:none;width:100%;max-width:860px;padding:clamp(16px,4vw,48px)}
.skjerm.aktiv{display:block;animation:inn .4s ease}
@keyframes inn{from{opacity:0;transform:translateY(20px)}to{opacity:1}}
.logo{color:#fff;text-align:center;font-size:clamp(2.2rem,7vw,4rem);margin:.3em 0 0;text-shadow:0 4px 0 rgba(0,0,0,.15)}
.logo span{color:#ffe14d}
.under{color:#fff;text-align:center;font-size:1.15rem;opacity:.95}
/* Kategorikort */
.kategorier{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:16px;margin-top:28px}
.kat{border:0;border-radius:20px;padding:22px 14px;font:inherit;font-weight:700;font-size:1.15rem;cursor:pointer;
 background:var(--kort);color:var(--tekst);box-shadow:0 8px 0 rgba(0,0,0,.12);transition:transform .15s}
.kat:hover{transform:translateY(-4px) rotate(-1deg)}
.kat .ik{display:block;font-size:2.4rem;margin-bottom:6px}
.kat small{display:block;font-weight:500;opacity:.65;margin-top:4px;font-size:.85rem}
/* Spill */
.topp{display:flex;flex-wrap:wrap;gap:10px;justify-content:space-between;color:#fff;font-weight:600;font-size:1.05rem}
.framdrift{height:10px;background:rgba(255,255,255,.3);border-radius:9px;margin:12px 0 20px;overflow:hidden}
#bar{height:100%;background:#ffe14d;width:0;transition:width .4s}
.kort{background:var(--kort);border-radius:24px;padding:clamp(18px,4vw,36px);box-shadow:0 12px 30px rgba(0,0,0,.18)}
.kort h2{margin-top:0;font-size:clamp(1.25rem,3.5vw,1.8rem)}
.svar{display:grid;gap:12px}
@media(min-width:700px){.svar{grid-template-columns:1fr 1fr}}
.alt{border:3px solid #e6e1ff;background:#f6f4ff;border-radius:16px;padding:16px;font:inherit;font-size:1.05rem;
 text-align:left;cursor:pointer;color:var(--tekst);transition:transform .1s,background .2s}
.alt:hover:not(:disabled){transform:scale(1.03);border-color:var(--bg1)}
.alt.riktig{background:var(--ok);border-color:var(--ok);color:#fff;animation:hopp .4s}
.alt.galt{background:var(--feil);border-color:var(--feil);color:#fff;animation:rist .4s}
@keyframes hopp{50%{transform:scale(1.07)}}
@keyframes rist{25%{transform:translateX(-6px)}75%{transform:translateX(6px)}}
.forklaring{margin-top:18px;padding:16px;border-radius:16px;background:#fff8d6;border-left:6px solid #ffc400;animation:inn .3s}
.skjult{display:none}
.knapp{margin-top:18px;border:0;border-radius:999px;padding:14px 28px;font:inherit;font-weight:700;font-size:1.1rem;
 background:var(--bg1);color:#fff;cursor:pointer;box-shadow:0 5px 0 #4a3fd1}
.knapp:active{transform:translateY(3px);box-shadow:0 2px 0 #4a3fd1}
.knapp.sek{background:#ff6fb1;box-shadow:0 5px 0 #d14b8d}
.midt{text-align:center}.stor{font-size:5rem;animation:hopp 1s infinite}
.knapper{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.konfetti{position:fixed;top:-10px;width:10px;height:14px;animation:fall 2.5s linear forwards;pointer-events:none}
@keyframes fall{to{transform:translateY(105vh) rotate(720deg)}}
.tittel{font-size:1.4rem;font-weight:800;color:#6a5cff;animation:hopp 1.2s infinite}
.spiller{display:block;text-align:center;color:#fff;font-weight:700;margin-top:10px}.spiller input{font:inherit;border:0;border-radius:999px;padding:8px 16px;width:12em;margin-left:6px}
.faner{display:flex;gap:8px;overflow-x:auto;padding-bottom:10px;margin-bottom:10px}
.fane{flex:none;border:0;border-radius:999px;padding:8px 14px;font:inherit;font-weight:700;background:rgba(255,255,255,.35);color:#fff;cursor:pointer}
.fane.valgt{background:#fff;color:var(--tekst)}
.liste{list-style:none;padding:0;margin:0}
.liste li{display:flex;gap:12px;align-items:center;padding:12px;border-radius:14px;margin-bottom:6px;background:#f6f4ff;animation:inn .3s}
.liste .pl{width:2em;text-align:center;font-weight:800}.liste .nv{flex:1;font-weight:600;overflow:hidden;text-overflow:ellipsis}
.liste li.meg{background:#ffe14d;transform:scale(1.02);box-shadow:0 4px 0 rgba(0,0,0,.1)}
.kat.laast{opacity:.6;filter:grayscale(.7);cursor:not-allowed}.kat.laast:hover{transform:none}.fane.per{border:2px solid #fff}
.auth{background:rgba(255,255,255,.95);border-radius:20px;padding:14px 18px;margin:16px auto 0;max-width:460px;text-align:center;font-weight:600}
.auth input{display:block;width:100%;font:inherit;border:2px solid #e6e1ff;border-radius:12px;padding:10px 14px;margin:8px 0}
.auth .knapp{margin-top:8px}.feil{color:var(--feil);margin:6px 0 0}.lenke{border:0;background:none;color:var(--bg1);font:inherit;text-decoration:underline;cursor:pointer}