:root{--ink:#222522;--muted:#777974;--paper:#f7f6f2;--card:#fff;--border:#e9e9e2;--tile:#e8e8e3;--tile-hover:#dadbd5;--yellow:#f2d96c;--green:#a1c46b;--blue:#a7bde8;--purple:#b49ad2}
*{box-sizing:border-box}html{font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;color:var(--ink);background:var(--paper)}body{margin:0;min-width:300px}button,input{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible,summary:focus-visible{outline:3px solid #4b78bd;outline-offset:3px}button:disabled{cursor:not-allowed;opacity:.35}.site-header{background:#fff;border-bottom:1px solid var(--border)}.header-inner{max-width:1000px;margin:auto;display:flex;align-items:center;justify-content:space-between;padding:17px 28px}.brand{display:flex;align-items:center;gap:10px;font-size:23px;font-weight:780;letter-spacing:-1.4px}.brand-dot{color:#4e8a5d}.brand-logo{display:grid;grid-template-columns:repeat(2,8px);grid-template-rows:repeat(2,8px);gap:3px;transform:rotate(-8deg)}.brand-logo i{display:block;border-radius:2px;background:var(--green)}.brand-logo i:nth-child(2){background:var(--purple)}.brand-logo i:nth-child(3){background:var(--yellow)}.brand-logo i:nth-child(4){background:var(--blue)}.header-help{width:31px;height:31px;border-radius:50%;background:#fff;border:1.5px solid #b0b2ac;font-size:17px;font-weight:700}.game-shell{max-width:790px;padding:36px 20px 18px;margin:0 auto}.game-intro{text-align:center;margin-bottom:30px}.eyebrow{font-size:11px;font-weight:800;letter-spacing:2.4px;color:#6b7b64}.game-intro h1{font-family:Georgia,"Times New Roman",serif;font-size:clamp(31px,5vw,45px);letter-spacing:-1.2px;font-weight:700;margin:11px 0 8px}.game-intro p{color:#62675e;margin:0;font-size:15px}.game{background:var(--card);border:1px solid var(--border);border-radius:16px;padding:23px 24px 22px;box-shadow:0 8px 40px #383d2810}.game-toolbar{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:0 1px 20px}.date-nav{display:flex;gap:11px;align-items:center;color:#5d645c;font-size:13px;font-weight:650}.date-nav button{display:grid;place-items:center;border:1px solid #d8dbd5;border-radius:8px;background:white;width:29px;height:30px;font-size:23px;line-height:1}.translation-toggle{display:flex;align-items:center;gap:8px;cursor:pointer;color:#646a62;font-size:13px;font-weight:650;white-space:nowrap}.translation-toggle input{position:absolute;opacity:0;width:1px;height:1px}.toggle-track{width:36px;height:21px;border-radius:14px;background:#c9ccc6;position:relative;transition:background .2s}.toggle-track:before{content:"";width:15px;height:15px;border-radius:50%;background:white;position:absolute;top:3px;left:3px;box-shadow:0 1px 3px #0002;transition:transform .2s}.translation-toggle input:checked+.toggle-track{background:#446f50}.translation-toggle input:checked+.toggle-track:before{transform:translateX(15px)}.translation-toggle input:focus-visible+.toggle-track{outline:3px solid #4b78bd;outline-offset:3px}.solved-groups{display:grid;gap:8px;margin-bottom:9px}.solved-group{border-radius:7px;text-align:center;min-height:74px;padding:12px 8px;display:flex;flex-direction:column;justify-content:center;gap:6px;animation:fadein .22s ease}.solved-group strong{font-size:15px;letter-spacing:.4px}.solved-group span{font-size:13px}.yellow{background:var(--yellow)}.green{background:var(--green)}.blue{background:var(--blue)}.purple{background:var(--purple)}.tile-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.tile{position:relative;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;min-height:81px;padding:9px 8px;background:var(--tile);border:0;border-radius:6px;transition:background .12s,transform .12s;overflow-wrap:anywhere}.tile:hover{background:var(--tile-hover)}.tile.selected{background:#656e64;color:#fff}.tile.selected:hover{background:#596358}.tile-word{font-size:clamp(12px,1.9vw,17px);font-weight:750;letter-spacing:.15px;line-height:1.22}.tile-translation{display:block;font-size:clamp(10px,1.35vw,12px);font-weight:500;line-height:1.25;margin-top:6px;opacity:.84;text-transform:none}.translation-button{position:absolute;right:3px;top:3px;width:21px;height:19px;border:0;border-radius:5px;background:#ffffff85;color:#5f695e;font-size:9px;font-weight:800;letter-spacing:.1px;opacity:.85}.tile.selected .translation-button{background:#ffffff33;color:white}.translation-button:hover{opacity:1;background:white}.actions{display:flex;justify-content:center;align-items:center;gap:10px;margin:20px 0 14px;flex-wrap:wrap}.control{border:1.3px solid #a1a6a0;border-radius:99px;min-height:40px;padding:0 17px;background:white;color:var(--ink);font-size:13px;font-weight:650}.control:hover:not(:disabled){background:#f1f2ee}.control.primary{background:#222522;color:#fff;border-color:#222522;padding:0 22px}.control.primary:hover:not(:disabled){background:#3d433c}.control.ghost{background:#f5f6f2}.mistake-row{display:flex;justify-content:center;align-items:center;gap:7px;color:#70766e;font-size:13px}.mistake-dot{height:11px;width:11px;background:#50594f;border-radius:50%;display:inline-block}.mistake-dot.used{background:#d5d8d1}.game-status{text-align:center;min-height:23px;font-size:14px;font-weight:750;color:#566a4c;margin:12px 0 4px}.game-status.error{color:#a0523b}.small-note{margin:20px auto 0;max-width:510px;text-align:center;color:#91958d;font-size:12px;line-height:1.5}.small-note strong{font-size:10px;letter-spacing:.1em;color:#6c7569}.loading-message{text-align:center;color:var(--muted);padding:90px 10px}.end-screen{margin-top:22px;display:flex;align-items:center;flex-direction:column;text-align:center;border-top:1px solid var(--border);padding-top:21px;gap:11px}.end-screen h2{margin:0;font-family:Georgia,"Times New Roman",serif;font-size:28px}.end-screen p{margin:0;color:#666c65;font-size:14px}.score-grid{display:grid;gap:4px;padding:6px}.score-row{display:flex;justify-content:center;gap:4px}.score-square{width:23px;height:23px;border-radius:3px}.score-actions{display:flex;gap:10px;margin-top:2px}.footer{text-align:center;color:#9c9e97;font-size:12px;padding:25px 0}.footer span{color:#cc7c91}.help-dialog{border:1px solid #ddd;border-radius:13px;padding:0;box-shadow:0 20px 90px #0003;max-width:min(500px,calc(100vw - 28px));width:100%;max-height:85vh}.help-dialog::backdrop{background:#20241f9c}.dialog-inner{padding:31px;position:relative;overflow-y:auto;max-height:85vh}.dialog-inner h2{font-family:Georgia,"Times New Roman",serif;font-size:26px;margin:10px 0 14px}.dialog-inner p{font-size:14px;line-height:1.55;color:#525a51}.close-btn{position:absolute;right:15px;top:12px;border:0;background:transparent;font-size:31px;color:#737971}.help-color-row{display:flex;align-items:center;gap:10px;font-size:14px;margin:8px 0}.help-chip{width:27px;height:27px;border-radius:5px}details{border-top:1px solid #eee;margin-top:20px;padding-top:15px}summary{cursor:pointer;font-size:13px;font-weight:700}.toast{position:fixed;bottom:24px;left:50%;transform:translate(-50%,25px);opacity:0;pointer-events:none;background:#252b25;color:white;padding:11px 18px;border-radius:9px;font-size:13px;box-shadow:0 8px 30px #0004;transition:all .2s;max-width:90vw;text-align:center}.toast.visible{opacity:1;transform:translate(-50%,0)}@keyframes fadein{from{opacity:0;transform:translateY(3px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:570px){.header-inner{padding:14px 16px}.brand{font-size:21px}.game-shell{padding:24px 9px 12px}.game-intro{margin:0 5px 22px}.game-intro h1{font-size:33px}.game-intro p{font-size:13px}.game{padding:15px 11px 17px;border-radius:12px}.game-toolbar{margin-bottom:15px;gap:8px}.date-nav{gap:6px;font-size:12px}.date-nav button{width:27px}.translation-toggle{font-size:12px;gap:5px}.tile-grid{gap:5px}.tile{min-height:71px;padding:8px 3px}.tile-word{font-size:clamp(10px,2.7vw,14px)}.tile-translation{font-size:10px;margin-top:4px}.translation-button{top:2px;right:2px;width:17px;height:16px;font-size:8px;opacity:.75}.solved-group{min-height:66px;padding:10px 5px}.solved-group strong{font-size:13px}.solved-group span{font-size:11px}.actions{gap:7px}.control{padding:0 12px}.small-note{font-size:11px}.score-square{width:21px;height:21px}}
/* The tile selection covers its surface; EN is a separate non-spoiler control. */
.tile{padding:0;min-width:0}
.tile-word-button{color:inherit;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;min-height:81px;width:100%;padding:12px 6px;border:0;background:transparent;cursor:pointer;overflow-wrap:anywhere}
.tile-word-button:focus-visible{outline:3px solid #4b78bd;outline-offset:-3px;border-radius:6px}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:570px){.tile-word-button{min-height:71px;padding:12px 2px}}

.translation-button{display:flex;align-items:center;justify-content:center;white-space:nowrap;overflow-wrap:normal;word-break:normal;padding:0;z-index:2}

/* v0.2: full-page spoiler-safe results and opt-in answer board */
.result-page,.answer-page{display:flex;flex-direction:column;align-items:center;text-align:center;gap:12px;padding:24px 8px 22px;min-height:320px}
.result-eyebrow{font-size:11px;font-weight:800;letter-spacing:1.6px;color:#727b70}
.result-emblem{display:grid;place-items:center;background:var(--tile);color:#556750;border-radius:50%;width:53px;height:53px;font-size:26px;font-weight:750;margin-top:4px}
.result-page h2,.answer-page h2{font-family:Georgia,"Times New Roman",serif;font-size:clamp(25px,5vw,33px);margin:2px 0 0}
.result-page p{color:#666c65;font-size:14px;line-height:1.55;margin:0}
.result-page .score-grid{margin:8px 0 5px;gap:5px}
.result-page .score-square{width:26px;height:26px}
.result-page .spoiler-note{max-width:410px;margin:7px auto 0;color:#777c75}
.result-page .score-actions,.answer-page .score-actions{justify-content:center;flex-wrap:wrap;margin-top:12px}
.answer-page .solved-groups{width:100%;margin:18px 0 2px}
.score-loading{font-size:13px;color:#807e77}
@media(max-width:570px){.result-page,.answer-page{padding:20px 2px 18px}.result-page .score-square{width:23px;height:23px}}

/* v0.3: final-group submission and a brief win-only celebration. */
.result-emblem.won{background:#edf5df;color:#436b36;box-shadow:0 0 0 7px #a1c46b20;animation:victory-pop .7s cubic-bezier(.18,1.5,.35,1) both}
.result-page:has(.result-emblem.won) h2{animation:victory-appear .55s .08s both}
.result-page:has(.result-emblem.won) .score-row{animation:victory-appear .5s both}
.result-page:has(.result-emblem.won) .score-row:nth-child(1){animation-delay:.16s}
.result-page:has(.result-emblem.won) .score-row:nth-child(2){animation-delay:.26s}
.result-page:has(.result-emblem.won) .score-row:nth-child(3){animation-delay:.36s}
.result-page:has(.result-emblem.won) .score-row:nth-child(4){animation-delay:.46s}
.confetti-layer{position:fixed;inset:0;z-index:999;pointer-events:none;overflow:hidden;contain:layout paint}
.confetti-piece{position:absolute;top:-20px;width:9px;height:16px;border-radius:2px;opacity:0;animation:confetti-fall var(--duration) var(--delay) ease-in forwards;will-change:transform,opacity}
.confetti-piece:nth-child(3n){width:7px;height:9px;border-radius:50%}
.confetti-piece:nth-child(5n){width:13px;height:7px}
@keyframes confetti-fall{0%{transform:translate3d(0,-12px,0) rotate(0);opacity:0}8%{opacity:1}85%{opacity:1}100%{transform:translate3d(var(--drift),110vh,0) rotate(var(--spin));opacity:0}}
@keyframes victory-pop{0%{transform:scale(.45) rotate(-20deg);opacity:0}65%{transform:scale(1.2) rotate(8deg);opacity:1}100%{transform:scale(1) rotate(0);opacity:1}}
@keyframes victory-appear{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){.confetti-layer{display:none}.result-emblem.won,.result-page:has(.result-emblem.won) h2,.result-page:has(.result-emblem.won) .score-row{animation:none}}

/* Let the fourth category land before transitioning to results. */
.win-reveal{padding:12px 0 8px;text-align:center}
.win-reveal h2{font-family:Georgia,"Times New Roman",serif;font-size:clamp(22px,4.7vw,30px);margin:12px 0 20px}
.win-reveal .solved-groups{margin:0 0 16px}
.win-reveal .solved-group:last-child{animation:final-category .75s cubic-bezier(.2,1.2,.3,1) both;box-shadow:0 0 0 3px #446f5030}
.win-reveal .score-actions{justify-content:center}
@keyframes final-category{from{opacity:.45;transform:scale(.92)}to{opacity:1;transform:scale(1)}}
@media(prefers-reduced-motion:reduce){.win-reveal .solved-group:last-child{animation:none}}

.solved-group{animation:none}
/* v0.4 — category arrival: picked tiles fly into their answer row before its label appears. */
.flying-tile{position:fixed!important;z-index:1000;pointer-events:none!important;margin:0!important;box-shadow:0 9px 22px #202a2530;transition:none!important;will-change:transform,opacity;overflow:hidden}
.solved-group.group-arriving{opacity:0!important;animation:none!important}
.solved-group.group-revealed{animation:category-reveal .3s cubic-bezier(.17,.86,.27,1.12) both}
.solved-group.group-revealed.reveal-purple{animation:category-reveal-purple .46s cubic-bezier(.17,.86,.27,1.12) both}
.solved-group.group-revealed strong{animation:answer-title-in .28s .05s both}
.solved-group.group-revealed span{animation:answer-title-in .28s .11s both}
@keyframes category-reveal{from{opacity:.3;transform:scale(.965)}to{opacity:1;transform:scale(1)}}
@keyframes category-reveal-purple{0%{opacity:.25;transform:scale(.935);filter:brightness(1.14)}65%{opacity:1;transform:scale(1.023);filter:brightness(1.06)}100%{opacity:1;transform:scale(1);filter:brightness(1)}}
@keyframes answer-title-in{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){
  .solved-group.group-revealed,.solved-group.group-revealed.reveal-purple,
  .solved-group.group-revealed strong,.solved-group.group-revealed span{animation:none!important}
}

/* v0.5 — an intentional staging area, and four distinct category arrivals. */
.solved-group{position:relative;isolation:isolate}
.solved-group.group-arriving{opacity:1!important;animation:none!important;overflow:hidden;border:1px solid #00000012}
.solved-group.group-arriving > strong,.solved-group.group-arriving > span{opacity:0!important}
.arrival-slots{position:absolute;inset:11px 10px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;pointer-events:none;align-items:stretch}
.arrival-slots i{display:block;min-width:0;border:1.5px solid #ffffff75;background:#ffffff47;border-radius:7px;opacity:.58;animation:arrival-breathe 1.15s ease-in-out infinite alternate}
.arrival-slots i:nth-child(2){animation-delay:.13s}
.arrival-slots i:nth-child(3){animation-delay:.26s}
.arrival-slots i:nth-child(4){animation-delay:.39s}
@keyframes arrival-breathe{from{opacity:.22;transform:scale(.97)}to{opacity:.58;transform:scale(1)}}
.flying-tile{z-index:1000;display:flex!important;align-items:center;justify-content:center;border-radius:9px;box-shadow:0 10px 25px #202a252b;transform-origin:center;contain:paint;backface-visibility:hidden;overflow-wrap:anywhere}
.flying-tile .tile-word{padding:4px;text-align:center;line-height:1.1}
.solved-group.group-revealed{animation:category-warm-reveal .54s cubic-bezier(.16,.86,.26,1) both}
.solved-group.group-revealed.reveal-green{animation:category-bouncy-reveal .65s cubic-bezier(.14,.76,.22,1) both}
.solved-group.group-revealed.reveal-blue{animation:category-ribbon-reveal .7s cubic-bezier(.16,.9,.24,1) both}
.solved-group.group-revealed.reveal-purple{animation:category-purple-reveal .88s cubic-bezier(.2,.85,.25,1) both}
.solved-group.group-revealed strong{animation:answer-title-in .45s .07s ease-out both}
.solved-group.group-revealed span{animation:answer-title-in .46s .16s ease-out both}
@keyframes category-warm-reveal{0%{opacity:.65;filter:brightness(1.08);transform:scale(.99)}100%{opacity:1;filter:brightness(1);transform:scale(1)}}
@keyframes category-bouncy-reveal{0%{opacity:.55;transform:translateY(7px) scale(.986)}58%{opacity:1;transform:translateY(-4px) scale(1.012)}100%{transform:translateY(0) scale(1);opacity:1}}
@keyframes category-ribbon-reveal{0%{opacity:.5;transform:perspective(700px) rotateY(6deg) scale(.97)}67%{opacity:1;transform:perspective(700px) rotateY(-2deg) scale(1.008)}100%{opacity:1;transform:none}}
@keyframes category-purple-reveal{0%{opacity:.52;transform:scale(.96);filter:brightness(1.22)}60%{opacity:1;transform:scale(1.025);filter:brightness(1.1)}100%{opacity:1;transform:scale(1);filter:brightness(1)}}
.arrival-sparkles{position:fixed;inset:0;z-index:1100;pointer-events:none;overflow:hidden}
.arrival-sparkles i{position:absolute;width:6px;height:6px;border-radius:50%;opacity:0;animation:arrival-spark .65s var(--delay) ease-out forwards;box-shadow:0 0 7px #aa80de}
@keyframes arrival-spark{0%{transform:translate(0,0) scale(.5);opacity:.85}65%{opacity:.85}100%{transform:translate(var(--dx),var(--dy)) scale(.1);opacity:0}}
@media(prefers-reduced-motion:reduce){.arrival-slots,.arrival-sparkles{display:none!important}.solved-group.group-revealed,.solved-group.group-revealed.reveal-green,.solved-group.group-revealed.reveal-blue,.solved-group.group-revealed.reveal-purple,.solved-group.group-revealed strong,.solved-group.group-revealed span{animation:none!important}}

/* Opt-in translations on category cards: preserve the Norwegian words, then
   add English in context. The longer card height is intentional and readable. */
.solved-group .group-title-en{font-size:11px;font-weight:700;line-height:1.35;letter-spacing:.12px;opacity:.82;overflow-wrap:anywhere}
.solved-group .group-words-en{font-size:11px;font-weight:450;line-height:1.35;opacity:.82;overflow-wrap:anywhere}
.solved-group .group-words{line-height:1.3}
@media(max-width:570px){.solved-group .group-title-en,.solved-group .group-words-en{font-size:10px;line-height:1.35}}

/* v0.9.1 — full Norwegian idioms on solved/revealed blue group only. */
.solved-group .group-idioms{display:block;font-size:12px;font-weight:500;line-height:1.55;overflow-wrap:anywhere;max-width:620px;margin:2px auto 0;}
.solved-group .group-idioms-heading{font-weight:750;}
@media(max-width:570px){.solved-group .group-idioms{font-size:11px;line-height:1.45}}