@charset "UTF-8";
*{box-sizing:border-box} :root{font-family:"Segoe UI",Arial,sans-serif;font-synthesis:none;--bg:#f5f1e9;--surface:#faf7f1;--ink:#293b4a;--muted:#6b737b;--line:#d2d8dc;--tile:#324657;--tile-ink:#fff8eb;--selected:#b34f36;--selected-ink:#fff8eb;--accent:#b34f36;--soft-accent:#e7d9c5;--trail:#f5cca0;--tile-radius:10px;--selected-radius:23px;--tile-shadow:none;--sans:"Segoe UI",Arial,sans-serif;--serif:Georgia,"Times New Roman",serif}
html{background:var(--bg);color:var(--ink);scroll-behavior:smooth} body{margin:0} button,input,select{font:inherit} button,a,summary,select{-webkit-tap-highlight-color:transparent} button{color:inherit;cursor:pointer} button:disabled{cursor:default} a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible,select:focus-visible,summary:focus-visible{outline:2px solid var(--accent);outline-offset:5px}svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex:none}.svg-library{position:absolute;width:0;height:0;overflow:hidden}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.app-shell{max-width:1380px;margin:auto;padding:0 62px}.site-header{height:130px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.wordmark{font-family:var(--serif);font-size:43px;letter-spacing:-2.4px;display:flex;align-items:center;gap:9px;line-height:1}.wordmark-period{display:none}.brand-mark{color:var(--accent);width:32px;height:36px;display:inline-flex;transform:rotate(12deg);margin-top:8px}.brand-mark svg{width:100%;height:100%;stroke-width:2.4}.main-nav{display:flex;gap:26px;align-items:center}.nav-button{border:0;background:none;display:flex;align-items:center;gap:9px;padding:10px 0;font-size:12px}.nav-icon{width:32px;height:34px;display:grid;place-items:center;position:relative;transition:transform .18s,color .18s}.nav-button:hover .nav-icon{color:var(--accent);transform:translateY(-2px)}.flame-wrap{color:var(--accent)}.streak-count{position:absolute;right:-2px;bottom:0;border-radius:50%;background:var(--accent);color:var(--bg);width:15px;height:15px;font-size:9px;font-weight:700;display:grid;place-items:center;border:2px solid var(--bg)}
.play-layout{display:grid;grid-template-columns:minmax(185px,1fr) minmax(330px,440px) minmax(185px,1fr);column-gap:48px;row-gap:0;padding-top:48px}.intro-panel{padding-top:9px}.day-kicker{font-size:9px;letter-spacing:1.4px;display:flex;align-items:center;gap:7px;white-space:nowrap}.day-dot{height:5px;width:5px;display:inline-block;border-radius:50%;background:var(--accent)}.issue-number{display:none}h1{font-size:clamp(23px,2.2vw,33px);font-weight:450;font-family:var(--serif);line-height:1.3;letter-spacing:-.9px;margin:26px 0 18px}h1 em{font-weight:400;color:var(--accent)}.intro-copy{font-size:12px;line-height:1.9;color:var(--muted);margin:0 0 28px}.day-countdown{font-size:10px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:12px 0;display:flex;justify-content:space-between;gap:12px}.countdown-value{color:var(--muted);display:flex;align-items:center;gap:6px}.countdown-value svg{width:13px;height:13px}.desktop-goals{margin-top:37px}.section-heading{display:flex;align-items:baseline;justify-content:space-between;gap:9px}.section-heading h2{font-size:14px;font-weight:550;letter-spacing:-.2px;margin:0}.section-heading>span{font-size:10px;color:var(--muted)}.goals-subtitle{font-size:10px;color:var(--muted);margin:9px 0 23px}.goal-list{list-style:none;padding:0;margin:0}.goal{display:flex;align-items:center;gap:9px;font-size:10px;padding:11px 0;border-bottom:1px solid var(--line)}.goal-symbol{width:17px;height:17px;display:grid;place-items:center;color:var(--accent);flex:none}.goal-symbol svg{width:15px;height:15px;stroke-width:1.8}.goal-number{font-variant-numeric:tabular-nums;margin-left:auto;color:var(--muted);font-size:9px}.goal-partial{font-size:20px;line-height:1}.text-button{display:flex;align-items:center;justify-content:space-between;width:100%;padding:17px 0;border:0;background:none;font-size:11px}.text-button svg{width:17px;height:17px;color:var(--accent)}.margin-note{display:flex;gap:12px;font-family:var(--serif);font-size:14px;font-style:italic;line-height:1.7;color:var(--muted);margin-top:48px}.note-line{display:block;width:24px;margin-top:10px;border-top:1px solid var(--accent)}
.game-topline{display:flex;align-items:center;justify-content:space-between;font-size:9px;letter-spacing:1.3px;margin-bottom:20px;height:16px}.board-index{color:var(--accent);font-size:11px;letter-spacing:.3px}.game-top-decoration{font-size:19px}.board-language{color:var(--muted)}.board-wrap{position:relative;isolation:isolate}.letter-board{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;touch-action:none;user-select:none;-webkit-user-select:none}.letter-tile{border:0;background:var(--tile);color:var(--tile-ink);aspect-ratio:1.05;border-radius:var(--tile-radius);font-family:var(--sans);font-size:clamp(22px,2.1vw,30px);font-weight:550;line-height:1;display:grid;place-items:center;position:relative;box-shadow:var(--tile-shadow);transition:background .16s,border-radius .16s,transform .16s,color .16s;z-index:1;touch-action:none;padding:0}.letter-tile::after{content:attr(data-letter);position:relative;z-index:4}.letter-tile.selected{background:var(--selected);color:var(--selected-ink);border-radius:var(--selected-radius);transform:scale(.93)}.letter-tile.active{box-shadow:0 0 0 1px var(--selected),0 0 0 5px color-mix(in srgb,var(--selected) 14%,transparent)}.word-trail{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:2;overflow:visible}.word-trail path{fill:none;stroke:var(--trail);stroke-width:4;stroke-linecap:round;stroke-linejoin:round;opacity:.65}.word-trail #trail-shadow{stroke:var(--selected);stroke-width:10;opacity:.25}.current-word{position:relative;min-height:76px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);gap:12px}.word-instruction{font-family:var(--serif);font-style:italic;font-size:14px;color:var(--muted)}.word-preview{font-size:19px;font-weight:600;letter-spacing:4px;color:var(--accent)}.preview-dot{letter-spacing:0}.reset-demo{border:0;background:transparent;color:var(--muted);font-size:22px;padding:8px;line-height:1}.score-strip{display:grid;grid-template-columns:1.15fr 1fr 1fr;gap:10px;padding:26px 0 22px}.score-item{display:flex;flex-direction:column;gap:8px;position:relative}.score-item:not(:first-child){padding-left:17px;border-left:1px solid var(--line)}.score-label{font-size:10px;color:var(--muted);white-space:nowrap}.score-item strong{font-size:28px;line-height:1.1;font-weight:450;letter-spacing:-1px;font-variant-numeric:tabular-nums}.score-caption{font-size:8px;color:var(--muted);letter-spacing:.1px;white-space:nowrap}.tiny-star{color:var(--accent);font-size:12px}.number-space{font-size:10px}.community{border-top:1px solid var(--line);padding-top:17px}.community-copy{display:flex;align-items:center;justify-content:space-between;font-size:9px;color:var(--muted)}.community-copy strong{font-weight:500;color:var(--ink);font-size:14px}.community-copy strong>span{font-size:9px;margin-left:2px}.community-track{height:3px;background:var(--line);margin-top:10px;overflow:hidden;border-radius:2px}.community-track>span{display:block;height:100%;width:38%;background:var(--accent)}.mobile-progress{display:none}
.words-panel{padding-top:9px}.words-heading{padding-bottom:22px;border-bottom:1px solid var(--line)}.words-heading h2{font-family:var(--serif);font-size:24px;font-weight:400;line-height:1.2;letter-spacing:-.7px}.heading-dot{color:var(--accent)}.word-total{border:1px solid var(--line);padding:4px 8px;border-radius:20px}.words-filter{display:flex;justify-content:space-between;font-size:9px;color:var(--muted);padding:17px 0 10px;gap:6px}.words-star-note>span{color:var(--accent)}.found-words{list-style:none;padding:0;margin:0;counter-reset:words}.found-words li{counter-increment:words;display:flex;align-items:center;min-height:38px;border-bottom:1px solid var(--line);font-size:13px;letter-spacing:.1px}.found-words li::before{content:counter(words,decimal-leading-zero);font-size:8px;color:var(--muted);width:25px;font-variant-numeric:tabular-nums}.found-word{flex:1}.own-indicator{color:var(--accent);font-size:15px;width:17px;text-align:center}.word-points{font-size:9px;color:var(--muted);margin-left:14px;width:27px;text-align:right}.found-words li:first-child .found-word{font-weight:600}.words-footnote{font-family:var(--serif);font-size:14px;font-style:italic;color:var(--muted);margin-top:24px}.lower-panel{grid-column:2;margin-top:34px}.info-row{border:0;border-top:1px solid var(--line);background:none;width:100%;font-size:12px}.info-row:last-child{border-bottom:1px solid var(--line)}.info-row summary{list-style:none;display:flex;align-items:center;justify-content:space-between;cursor:pointer;padding:18px 0}.info-row summary::-webkit-details-marker{display:none}.info-row summary>span:first-child,.feedback-row>span{display:flex;align-items:center;gap:14px}.row-number{font-size:8px;color:var(--accent);font-variant-numeric:tabular-nums}.expand-sign{font-size:18px;font-weight:300;color:var(--muted)}details[open] .expand-sign{transform:rotate(45deg)}.detail-content{font-size:12px;line-height:1.8;color:var(--muted);padding:0 0 18px 26px}.detail-content p{margin:0 0 10px}.detail-content h3{font-size:18px;color:var(--ink);font-family:var(--serif);font-weight:400;margin:8px 0}.news-date{font-size:8px;letter-spacing:1px;color:var(--accent)}.news-indicator{height:5px;width:5px;background:var(--accent);border-radius:50%;margin-left:-5px}.feedback-row{padding:18px 0;display:flex;align-items:center;justify-content:space-between;text-align:left}.feedback-row>svg{width:16px;height:16px;color:var(--muted)}.site-footer{display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--line);margin-top:50px;padding:25px 0 35px;font-size:10px;color:var(--muted)}.site-footer>span:first-child{font-family:var(--serif);font-size:19px;letter-spacing:-.5px;color:var(--ink)}.footer-asterisk{color:var(--accent);margin-left:3px}.demo-disclaimer{font-size:8px;letter-spacing:1px}.design-caption{margin:0 auto 25px;max-width:1256px;display:flex;align-items:center;gap:18px;font-size:10px;color:var(--muted);padding:0 24px}.design-caption>span:first-child{font-weight:650;font-size:9px;letter-spacing:1px;color:var(--accent)}.design-caption p{margin:0}.caption-hint{margin-left:auto;font-size:9px}
dialog{background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:20px;padding:28px;width:min(470px,calc(100% - 32px));max-height:85dvh;box-shadow:0 24px 90px #0003}dialog::backdrop{background:#15201f55;backdrop-filter:blur(8px)}.dialog-header{display:flex;align-items:center;justify-content:space-between}.dialog-eyebrow{font-size:9px;letter-spacing:1.5px;color:var(--muted)}.dialog-close{border:0;background:none;padding:5px;display:flex}.dialog-close svg{width:20px;height:20px}dialog h2{font-size:30px;font-family:var(--serif);font-weight:400;letter-spacing:-1px;margin:20px 0}dialog p{font-size:13px;line-height:1.8;color:var(--muted)}.dialog-demo-note{border-top:1px solid var(--line);padding-top:16px;font-size:10px!important;margin-top:23px}.dialog-rank{display:flex;justify-content:space-between;padding:16px 4px;border-bottom:1px solid var(--line);font-size:13px}.dialog-rank.me{color:var(--accent);font-weight:600}.dialog-rank span:first-child{width:24px;color:var(--muted)}.dialog-rank span:nth-child(2){flex:1;margin-left:15px}.dialog-streak{padding:17px;background:var(--tile);border-radius:12px;display:flex;align-items:center;gap:15px}.dialog-streak svg{color:var(--accent);width:32px;height:32px}.dialog-streak strong{display:block;font-size:19px;font-weight:550}.dialog-streak span{font-size:11px;color:var(--muted)}
/* 02 — STILL: ett mjukt, sammanhållet instrument med sval ton. */
html[data-design="still"]{--bg:#eaf0f3;--surface:#f7fafb;--ink:#263d54;--muted:#657b8b;--line:#cbd8e0;--tile:#f6f9fb;--tile-ink:#38516a;--selected:#466d92;--selected-ink:#fff;--accent:#466d92;--soft-accent:#d9e6ef;--trail:#cedfed;--tile-radius:22px;--selected-radius:22px;--tile-shadow:0 3px 0 #c5d1db}
[data-design="still"] .app-shell{max-width:1260px;padding:0 48px}[data-design="still"] .site-header{height:111px;border:0}[data-design="still"] .wordmark{font-family:var(--sans);font-size:36px;font-weight:650;letter-spacing:-2px}[data-design="still"] .brand-mark{order:-1;width:25px;margin:0 1px 0 0}[data-design="still"] .main-nav{gap:12px}[data-design="still"] .nav-button{border-radius:40px;padding:7px 14px;background:var(--surface);border:1px solid color-mix(in srgb,var(--line) 75%,transparent)}[data-design="still"] .nav-button:hover{background:var(--tile)}[data-design="still"] .streak-count{border-color:var(--surface)}[data-design="still"] .play-layout{grid-template-columns:minmax(165px,1fr) minmax(330px,430px) minmax(170px,1fr);column-gap:30px;padding:14px 0 0}[data-design="still"] .game-panel{background:color-mix(in srgb,var(--surface) 50%,var(--bg));border:1px solid var(--line);border-radius:32px;padding:24px;grid-row:1 / span 2;box-shadow:0 16px 60px #314c6410}[data-design="still"] .letter-board{gap:11px}[data-design="still"] .letter-tile{aspect-ratio:1;font-weight:500}[data-design="still"] .letter-tile.selected{box-shadow:0 3px 0 color-mix(in srgb,var(--selected) 70%,#0e2637);transform:scale(.94)}[data-design="still"] .letter-tile.active{box-shadow:0 3px 0 color-mix(in srgb,var(--selected) 70%,#0e2637),0 0 0 4px color-mix(in srgb,var(--accent) 18%,transparent)}[data-design="still"] .intro-panel{padding-top:30px}[data-design="still"] h1{font-family:var(--sans);font-weight:350;font-size:30px;letter-spacing:-1.3px;margin:22px 0 17px;line-height:1.25}[data-design="still"] h1 em{font-style:normal;font-weight:600}[data-design="still"] .day-kicker{font-size:8px;letter-spacing:1px}[data-design="still"] .day-countdown{border:0;background:var(--soft-accent);padding:13px 12px;border-radius:12px;flex-direction:column;gap:5px}[data-design="still"] .day-countdown>span:first-child{font-weight:600}[data-design="still"] .countdown-value{justify-content:space-between}[data-design="still"] .desktop-goals{margin-top:30px}[data-design="still"] .goal{border:0;padding:9px 0;font-size:9px;gap:5px}[data-design="still"] .goal-symbol{width:14px}[data-design="still"] .goal-number{font-size:8px}[data-design="still"] .goals-subtitle{font-size:9px}[data-design="still"] .margin-note{display:none}[data-design="still"] .current-word{min-height:72px;flex-direction:column;justify-content:center;gap:7px}[data-design="still"] .word-instruction{font-family:var(--sans);font-style:normal;font-size:10px}[data-design="still"] .word-preview{font-size:17px;letter-spacing:5px}[data-design="still"] .reset-demo{position:absolute;right:0;top:22px}[data-design="still"] .score-strip{padding:22px 0 20px;gap:5px}[data-design="still"] .score-item:not(:first-child){padding-left:10px}[data-design="still"] .score-item strong{font-size:26px;font-weight:500}[data-design="still"] .score-caption{display:none}[data-design="still"] .score-label{font-size:9px}[data-design="still"] .words-panel{align-self:start;background:var(--surface);padding:21px 18px;border-radius:22px;margin-top:0}[data-design="still"] .words-heading{padding-bottom:16px}[data-design="still"] .words-heading h2{font-family:var(--sans);font-size:17px;font-weight:550;letter-spacing:-.5px}[data-design="still"] .word-total{font-size:9px;background:var(--soft-accent);border:0}[data-design="still"] .words-filter{font-size:8px;flex-direction:column;gap:5px}[data-design="still"] .found-words li{font-size:12px;min-height:36px}[data-design="still"] .found-words li::before{display:none}[data-design="still"] .words-footnote{font-family:var(--sans);font-size:10px;font-style:normal}[data-design="still"] .lower-panel{grid-column:1;grid-row:2;align-self:end;margin-top:28px}[data-design="still"] .info-row{font-size:10px}[data-design="still"] .info-row summary>span:first-child,[data-design="still"] .feedback-row>span{gap:8px}[data-design="still"] .info-row summary,[data-design="still"] .feedback-row{padding:15px 0}[data-design="still"] .row-number{display:none}[data-design="still"] .site-footer{margin-top:40px}[data-design="still"] .site-footer>span:first-child{font-family:var(--sans);font-size:17px;font-weight:600}
/* 03 — STUDIO: asymmetri, stram typografi och ett litet färgutrop. */
html[data-design="studio"]{--bg:#f5f4ed;--surface:#fbfaf4;--ink:#30352e;--muted:#72756a;--line:#d5d6c8;--tile:#e8e8dc;--tile-ink:#343b30;--selected:#e5ad35;--selected-ink:#352c19;--accent:#a76922;--trail:#fff8d5;--soft-accent:#eee4bf;--tile-radius:4px 18px 4px 4px;--selected-radius:18px 4px 18px 4px}
[data-design="studio"] .app-shell{max-width:1370px;padding:0 56px}[data-design="studio"] .site-header{height:114px;border-bottom:2px solid var(--ink)}[data-design="studio"] .wordmark{font-family:var(--sans);font-weight:750;font-size:43px;letter-spacing:-3px}[data-design="studio"] .brand-mark{display:none}[data-design="studio"] .wordmark-period{display:inline;color:var(--selected);font-size:65px;line-height:.5;margin-left:-6px;margin-top:-5px}[data-design="studio"] .main-nav{gap:24px}[data-design="studio"] .nav-button{flex-direction:column;gap:3px;font-size:9px;padding:7px}[data-design="studio"] .play-layout{grid-template-columns:minmax(180px,1fr) minmax(320px,430px) minmax(190px,1fr);column-gap:44px;padding-top:38px}[data-design="studio"] .intro-panel{display:flex;flex-direction:column;padding-top:2px}[data-design="studio"] .day-kicker{font-size:8px;letter-spacing:1.2px}[data-design="studio"] .day-dot{border-radius:0;width:8px;height:8px;background:var(--selected)}[data-design="studio"] .issue-number{display:inline;color:var(--muted)}[data-design="studio"] h1{font-family:var(--sans);font-size:33px;font-weight:650;letter-spacing:-1.6px;line-height:1.17;margin:34px 0 20px}[data-design="studio"] h1 em{font-family:var(--serif);font-weight:400;font-size:35px;color:var(--ink);display:inline-block;margin-top:10px}[data-design="studio"] .intro-copy{border-left:3px solid var(--selected);padding-left:13px;font-size:11px}[data-design="studio"] .day-countdown{border:0;padding:12px 0;flex-direction:column;gap:7px}[data-design="studio"] .countdown-value{justify-content:space-between}[data-design="studio"] .desktop-goals{margin-top:24px}[data-design="studio"] .section-heading h2{font-size:11px;text-transform:uppercase;letter-spacing:1px;font-weight:650}[data-design="studio"] .goal{font-size:9px}[data-design="studio"] .goal-symbol{background:var(--soft-accent);border-radius:50%;width:16px;height:16px}[data-design="studio"] .goal-partial{background:none}[data-design="studio"] .margin-note{display:none}[data-design="studio"] .game-topline{border-bottom:1px solid var(--line);padding-bottom:13px;height:28px;margin-bottom:17px}[data-design="studio"] .board-index{font-weight:700;font-size:10px;color:var(--ink)}[data-design="studio"] .game-top-decoration{color:var(--selected);font-size:24px}[data-design="studio"] .letter-board{gap:10px}[data-design="studio"] .letter-tile{font-weight:650;font-size:29px;aspect-ratio:1.08;background:transparent;outline:1px solid var(--line);outline-offset:-1px}[data-design="studio"] .letter-tile:nth-child(3n+1){border-radius:18px 4px 4px 4px}[data-design="studio"] .letter-tile.selected{background:var(--selected);outline:0;border-radius:var(--selected-radius);transform:scale(.93);box-shadow:2px 3px 0 color-mix(in srgb,var(--ink) 22%,transparent)}[data-design="studio"] .letter-tile.active{box-shadow:2px 3px 0 color-mix(in srgb,var(--ink) 22%,transparent),0 0 0 4px color-mix(in srgb,var(--selected) 20%,transparent)}[data-design="studio"] .current-word{border:0;min-height:71px}[data-design="studio"] .word-instruction{font-family:var(--sans);font-style:normal;font-size:10px}[data-design="studio"] .word-preview{font-size:23px;letter-spacing:2px;color:var(--ink)}[data-design="studio"] .preview-dot{color:var(--accent)}[data-design="studio"] .score-strip{border-top:2px solid var(--ink);border-bottom:1px solid var(--line);padding:22px 0}[data-design="studio"] .score-item strong{font-weight:650;font-size:31px;letter-spacing:-1.8px}[data-design="studio"] .score-caption{display:none}[data-design="studio"] .score-label{font-size:9px}[data-design="studio"] .community{border:0;padding-top:17px}[data-design="studio"] .community-track{height:5px;border-radius:0}[data-design="studio"] .community-track>span{background:var(--selected)}[data-design="studio"] .words-panel{padding-top:2px;border-left:1px solid var(--line);padding-left:26px}[data-design="studio"] .words-heading{border:0;padding-bottom:19px;align-items:center}[data-design="studio"] .words-heading h2{font-family:var(--serif);text-transform:none;font-size:24px;letter-spacing:-.5px;font-weight:400;max-width:120px}[data-design="studio"] .word-total{width:39px;height:39px;border-radius:50%;background:var(--selected);color:var(--selected-ink);display:grid;place-items:center;font-size:11px;border:0;padding:0}[data-design="studio"] .words-filter{border-top:1px solid var(--line);font-size:8px}[data-design="studio"] .found-words{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}[data-design="studio"] .found-words li{border:1px solid var(--line);border-radius:4px;padding:9px 10px;min-height:34px;font-size:11px;gap:4px;flex-grow:1}[data-design="studio"] .found-words li:first-child{background:var(--selected);border-color:var(--selected);color:var(--selected-ink)}[data-design="studio"] .found-words li::before,[data-design="studio"] .word-points{display:none}[data-design="studio"] .own-indicator{font-size:12px;width:12px}[data-design="studio"] .words-footnote{margin-top:35px}[data-design="studio"] .lower-panel{margin-top:30px}[data-design="studio"] .info-row{border-color:var(--ink)}[data-design="studio"] .site-footer{border-top:2px solid var(--ink)}[data-design="studio"] .site-footer>span:first-child{font-family:var(--sans);font-weight:700}
/* Ljust och mörkt är egna balanserade paletter, inte en automatisk inversion. */
html[data-theme="dark"][data-design="folio"]{--bg:#1d2934;--surface:#253442;--ink:#eeebdc;--muted:#aab7c2;--line:#3b4b5a;--tile:#324657;--tile-ink:#e7eadb;--selected:#cc7757;--selected-ink:#192735;--accent:#e39d78;--soft-accent:#4a4334;--trail:#362d24}
html[data-theme="dark"][data-design="still"]{--bg:#17232f;--surface:#20303f;--ink:#e0eaf2;--muted:#a4b7c7;--line:#364b5d;--tile:#2c4053;--tile-ink:#e2edf6;--selected:#a6c4df;--selected-ink:#1b344b;--accent:#aecce7;--soft-accent:#30485d;--trail:#304f6b;--tile-shadow:0 3px 0 #101e2a}
html[data-theme="dark"][data-design="studio"]{--bg:#24251f;--surface:#2e3027;--ink:#eae9da;--muted:#b0b19e;--line:#484b3d;--tile:#35382c;--tile-ink:#eeefdb;--selected:#e5b64d;--selected-ink:#342d1b;--accent:#e5b64d;--soft-accent:#49442c;--trail:#665025}
@media(min-width:1500px){.app-shell{padding:0 64px}.play-layout{column-gap:60px;padding-top:60px}.site-header{height:145px}}
@media(max-width:1120px) and (min-width:761px){.app-shell,[data-design="studio"] .app-shell,[data-design="still"] .app-shell{padding:0 30px}.play-layout,[data-design="studio"] .play-layout,[data-design="still"] .play-layout{column-gap:25px;grid-template-columns:minmax(150px,1fr) minmax(300px,380px) minmax(150px,1fr)}h1,[data-design="studio"] h1,[data-design="still"] h1{font-size:25px}[data-design="studio"] h1 em{font-size:27px}.day-kicker{font-size:8px;letter-spacing:.5px}.goal{font-size:9px;gap:5px}.score-caption{display:none}.words-heading h2{font-size:20px}.main-nav{gap:15px}.nav-label{font-size:10px}[data-design="still"] .nav-button{padding:6px 8px}[data-design="still"] .game-panel{padding:18px}[data-design="studio"] .words-panel{padding-left:18px}.words-filter{font-size:8px}.words-star-note{display:none}[data-design="studio"] .words-heading h2{font-size:20px}[data-design="studio"] .word-total{width:32px;height:32px;flex:none}}
@media(max-width:760px){
 .lab-bar{padding:7px 18px;gap:8px;min-height:45px}.lab-name{font-size:8px;gap:6px;letter-spacing:1px}.lab-edition{display:none}.lab-controls{gap:9px}.lab-controls select{font-size:10px;min-width:111px;padding:6px 23px 6px 8px}.theme-toggle{min-width:20px}.theme-toggle span{display:none}.lab-dot{width:5px;height:5px}
 .app-shell,[data-design="still"] .app-shell,[data-design="studio"] .app-shell{padding:0 23px;max-width:500px}.site-header,[data-design="still"] .site-header,[data-design="studio"] .site-header{height:92px}.wordmark{font-size:36px}.brand-mark{width:25px;height:30px}.main-nav,[data-design="still"] .main-nav,[data-design="studio"] .main-nav{gap:12px}.nav-button,[data-design="still"] .nav-button,[data-design="studio"] .nav-button{padding:5px 0;gap:0;flex-direction:column;background:transparent;border:0}.nav-label{display:none}.nav-icon{width:31px;height:33px}.nav-icon svg{width:22px;height:22px}.streak-count{font-size:8px;width:14px;height:14px;right:-1px;bottom:0}.play-layout,[data-design="still"] .play-layout,[data-design="studio"] .play-layout{display:flex;flex-direction:column;gap:0;padding-top:20px}.intro-panel,[data-design="still"] .intro-panel,[data-design="studio"] .intro-panel{display:flex;flex-direction:row;justify-content:space-between;align-items:center;padding:0 0 20px;gap:8px}.day-kicker,[data-design="still"] .day-kicker,[data-design="studio"] .day-kicker{font-size:8px;letter-spacing:1px}.intro-panel h1,.intro-copy,.desktop-goals,.margin-note,[data-design="studio"] .issue-number{display:none}.day-countdown,[data-design="still"] .day-countdown,[data-design="studio"] .day-countdown{display:block;border:0;background:none;padding:0;font-size:9px;white-space:nowrap}.day-countdown>span:first-child{display:none}.countdown-value{color:var(--muted)}.countdown-value svg{display:none}.game-topline{display:none}.letter-board{gap:8px}.letter-tile{font-size:27px;aspect-ratio:1.07}.letter-tile.selected{border-radius:20px}.current-word{min-height:64px}.word-instruction{font-size:13px}.word-preview{font-size:18px;letter-spacing:3px}.reset-demo{font-size:22px;padding-right:0}.score-strip{padding:21px 0;gap:7px}.score-item strong{font-size:28px}.score-caption{display:none}.score-item:not(:first-child){padding-left:16px}.score-label{font-size:10px}.community{padding-top:15px}.community-copy{font-size:10px}.community-copy strong{font-size:14px}.mobile-progress{display:flex;align-items:center;justify-content:space-between;width:100%;margin-top:20px;padding:13px 0;border:0;border-bottom:1px solid var(--line);background:none;font-size:10px}.mobile-progress>span{display:flex;align-items:center;gap:6px}.mobile-progress>span:first-child{color:var(--accent)}.mobile-progress svg{width:16px;height:16px}.mobile-progress>span:last-child{color:var(--muted)}.mobile-progress>span:last-child svg{width:14px;height:14px}.words-panel{padding-top:28px}.words-heading{padding-bottom:17px}.words-heading h2{font-size:24px}.words-filter{padding:15px 0 12px;font-size:9px}.found-words{display:flex;flex-wrap:wrap;gap:8px}.found-words li{border:1px solid var(--line);border-radius:5px;min-height:33px;padding:7px 10px;gap:5px;font-size:12px;flex:none}.found-words li::before,.word-points{display:none}.own-indicator{width:13px;font-size:12px}.words-footnote{display:none}.lower-panel,[data-design="still"] .lower-panel,[data-design="studio"] .lower-panel{margin-top:31px}.site-footer,[data-design="still"] .site-footer{margin-top:28px;padding:22px 0 28px}.design-caption{max-width:500px;padding:0 23px 12px;gap:9px;align-items:flex-start;flex-wrap:wrap}.design-caption p{font-size:9px;flex:1}.caption-hint{display:none}
 [data-design="still"] .site-header{height:90px}[data-design="still"] .wordmark{font-size:32px}[data-design="still"] .brand-mark{width:22px}[data-design="still"] .game-panel{padding:19px 16px 4px;border-radius:26px;grid-row:auto}[data-design="still"] .letter-board{gap:9px}[data-design="still"] .letter-tile{font-size:25px;border-radius:17px;aspect-ratio:1.05}[data-design="still"] .letter-tile.selected{border-radius:17px}[data-design="still"] .current-word{min-height:68px}[data-design="still"] .score-strip{padding:19px 0}[data-design="still"] .score-item strong{font-size:25px}[data-design="still"] .score-label{font-size:9px}[data-design="still"] .mobile-progress{margin-top:15px;border-bottom:0;font-size:9px}[data-design="still"] .words-panel{margin-top:24px;padding:19px 17px 23px;border-radius:20px}[data-design="still"] .words-heading h2{font-size:18px}[data-design="still"] .words-filter{flex-direction:row;font-size:9px}[data-design="still"] .found-words li{font-size:11px;border:0;background:var(--soft-accent);padding:7px 10px;min-height:31px;border-radius:18px}[data-design="still"] .word-total{font-size:10px}
 [data-design="studio"] .site-header{height:93px}[data-design="studio"] .wordmark{font-size:38px}[data-design="studio"] .nav-label{display:none}[data-design="studio"] .letter-board{gap:8px}[data-design="studio"] .letter-tile{font-size:28px;aspect-ratio:1.09}[data-design="studio"] .score-strip{padding:20px 0}[data-design="studio"] .score-item strong{font-size:29px}[data-design="studio"] .words-panel{border:0;padding:28px 0 0}[data-design="studio"] .words-heading h2{font-size:25px;max-width:none}[data-design="studio"] .word-total{width:32px;height:32px}[data-design="studio"] .words-filter{font-size:9px}[data-design="studio"] .found-words{margin-top:8px}[data-design="studio"] .found-words li{flex:none;font-size:12px}
}
@media(max-width:359px){.app-shell,[data-design="still"] .app-shell,[data-design="studio"] .app-shell{padding:0 16px}.lab-bar{padding:7px 12px}.lab-name{font-size:7px}.main-nav{gap:8px}.letter-board{gap:6px}.score-label{font-size:9px}.word-instruction{font-size:12px}.word-preview{font-size:16px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}

/* Folio, andra skissen: funktion framför dekorativ introduktion. */
.wordmark{font-family:var(--sans);font-weight:600;font-size:31px;letter-spacing:5px;text-transform:uppercase;gap:8px}.brand-mark{margin-top:0;transform:rotate(12deg);width:30px;height:34px}.site-header{height:112px}.score-strip{margin-top:18px}.intro-panel{padding-top:9px}.desktop-goals{margin-top:28px}.day-countdown{margin-top:20px}.words-heading{padding-bottom:22px}.found-words li{min-height:40px}
html[data-design="folio"]{--tile-radius:6px;--selected-radius:6px}
[data-design="folio"] .letter-tile{aspect-ratio:1;border-radius:6px}
[data-design="folio"] .letter-tile.selected{border-radius:6px;transform:scale(.95)}
[data-design="folio"] .wordmark{font-family:var(--sans);font-size:31px;letter-spacing:5px;font-weight:600}
[data-design="folio"] .game-topline{margin-bottom:20px}
@media(max-width:760px){.wordmark,[data-design="folio"] .wordmark{font-size:26px;letter-spacing:3.5px;gap:6px}.brand-mark{width:26px;height:29px}.site-header,[data-design="folio"] .site-header{height:84px}.day-countdown{margin-top:0}.intro-panel{padding-top:0}.score-strip{margin-top:16px}[data-design="folio"] .letter-tile{aspect-ratio:1;border-radius:6px}[data-design="folio"] .letter-tile.selected{border-radius:6px}}
@media(max-width:359px){.wordmark,[data-design="folio"] .wordmark{font-size:23px;letter-spacing:2.5px}.brand-mark{width:22px}.main-nav{gap:6px}}


/* Markerade rutor får luft runt sig; translationsfjädern sköts separat från formen. */
[data-design="folio"] .letter-tile.selected{transform:scale(.86);border-radius:19px}
[data-design="folio"] .letter-tile{transition:background .16s,color .16s,border-radius .18s ease,transform .18s cubic-bezier(.2,.7,.25,1)}

/* Bortvald färg återgår direkt, medan den kompakta formen hålls under motstudsen. */
[data-design="folio"] .letter-tile.returning{transform:scale(.86);border-radius:19px}

/* Shared, compact wordmark spacing. */
.wordmark,[data-design="folio"] .wordmark{gap:1px}.brand-mark{margin-left:-2px}.dialog-body{display:flow-root}dialog{scrollbar-gutter:stable}

.account-visibility{padding-block:1rem;border-block:1px solid var(--line);margin-block:1rem}.account-visibility label{display:flex;align-items:center;gap:.65rem}.account-visibility input{width:1.1rem;height:1.1rem;accent-color:var(--accent)}.account-visibility p{font-size:.9rem;line-height:1.5}

/* Play page: one fixed direction, no prototype toolbar or decorative board numbering. */
html[data-design="folio"] .site-header{height:108px}
html[data-design="folio"] .play-layout{padding-top:28px}
.play-period{display:flex;align-items:center;gap:8px;font-size:12px;line-height:1.5;color:var(--muted);margin:0 0 25px;white-space:nowrap}
.play-period time{color:var(--ink)}
.extra-goals{margin-top:18px;padding-top:14px;border-top:1px solid var(--line)}
.extra-goals h3{font-family:var(--sans);font-size:12px;font-weight:600;letter-spacing:.2px;margin:0 0 4px;color:var(--muted)}
.extra-goals .goal-list{margin-top:0}.extra-goals .goal-symbol{color:var(--muted)}.extra-goals .goal.complete .goal-symbol{color:var(--accent)}
.own-find-key{display:inline-flex;align-items:center;gap:6px}.own-find-sample{display:inline-block;width:17px;height:12px;border:1px solid var(--accent);border-radius:5px}
.site-footer{justify-content:center}.site-footer>span:first-child{font-family:var(--sans);font-size:13px;letter-spacing:2px}
.detail-content h3{font-family:var(--sans);font-size:14px;font-weight:600;margin:1.2rem 0 .5rem}
@media(max-width:760px){html[data-design="folio"] .site-header{height:76px}html[data-design="folio"] .play-layout{padding-top:15px}.intro-panel{padding-bottom:14px}.play-period{margin:0;flex:1;justify-content:space-between;font-size:12px}.play-period>span[aria-hidden]{display:none}}

/* Explicit motion preference complements the system media query. */
html[data-reduced-motion=true] *,html[data-reduced-motion=true] *::before,html[data-reduced-motion=true] *::after{scroll-behavior:auto!important;transition-duration:0s!important;animation-duration:.01ms!important;animation-iteration-count:1!important}

/* Reduced motion keeps tile size fixed; only corners soften on selection. */
html[data-reduced-motion=true][data-design=folio] .letter-tile{transform:scale(1)!important;transition:border-radius .22s ease!important;transition-duration:.22s!important}

html[data-reduced-motion=true][data-design=folio] .letter-tile.selected{transition:border-radius .45s cubic-bezier(.42,0,.58,1)!important;transition-duration:.45s!important}
