@font-face{font-family:Atkinson Hyperlegible Next;src:url(/games/sunroom-sudoku/play/fonts/atkinson-hyperlegible-next.woff2)format("woff2");font-weight:200 800;font-display:swap}@font-face{font-family:Zilla Slab;src:url(/games/sunroom-sudoku/play/fonts/zilla-slab-700.woff2)format("woff2");font-weight:700;font-display:swap}:root{--font-ui:"Atkinson Hyperlegible Next", system-ui, sans-serif;--font-title:"Zilla Slab", Rockwell, Georgia, serif;--safe-top:env(safe-area-inset-top,0px);--safe-bottom:env(safe-area-inset-bottom,0px);--key-h:clamp(56px, 9.4vh, 82px);--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial}}*{box-sizing:border-box}html,body{overscroll-behavior:none;height:100%;margin:0;overflow:hidden}body{background:radial-gradient(120% 90% at 50% 0%, var(--bg) 40%, var(--bg-2));background-color:var(--bg);color:var(--ink);font:19px/1.4 var(--font-ui);-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none}#app{max-width:600px;height:100%;margin:0 auto}button{font:inherit;color:inherit;cursor:pointer}:focus-visible{outline:3px solid var(--focus);outline-offset:2px}h2,h3{margin:0;font-weight:700}.btn{border:2px solid var(--btn-edge);background:var(--btn);width:100%;min-height:64px;color:var(--btn-ink);text-align:center;border-radius:16px;gap:2px;padding:10px 20px;font-size:21px;font-weight:700;display:grid}.btn__title{font-size:22px;font-weight:700}.btn__sub{font-size:16px;font-weight:500}.btn--primary{background:var(--primary);color:var(--primary-ink);border-color:#0000}.btn--quiet{text-underline-offset:4px;background:0 0;border-color:#0000;min-height:56px;font-size:19px;text-decoration:underline}.btn--small{min-height:56px;padding:8px 14px;font-size:19px}.btn:active,.tool:active,.key:active,.icon-btn:active{transform:scale(.97)}.icon-btn{border:2px solid var(--btn-edge);background:var(--btn);width:56px;height:56px;color:var(--btn-ink);border-radius:14px;place-items:center;padding:0;display:grid}.icon-btn svg{width:28px;height:28px}.home{height:100%;padding:calc(var(--safe-top) + 20px) 20px calc(var(--safe-bottom) + 16px);flex-direction:column;justify-content:space-between;gap:16px;display:flex;position:relative}.home__settings{top:calc(var(--safe-top) + 14px);position:absolute;right:16px}.home__brand{text-align:center;justify-items:center;gap:4px;margin-top:5vh;display:grid}.home__sun{width:104px;height:104px;fill:var(--sun);animation:1.2s cubic-bezier(.2,.7,.3,1) both sunrise}.home__sun svg{width:100%;height:100%;animation:60s linear infinite spin}.logo{font:700 clamp(48px, 17vw, 72px)/1 var(--font-title);margin:0}.logo span{font:700 20px/1 var(--font-ui);letter-spacing:.34em;text-transform:uppercase;color:var(--muted);margin-top:6px;display:block}.home__tag{color:var(--muted);margin:10px 0 0;font-size:clamp(17px,5vw,20px)}.home__menu{gap:12px;width:100%;max-width:440px;margin:0 auto;display:grid}.home__new,.sheet__group{gap:6px;display:grid}.home__row{grid-template-columns:1fr 1fr;display:grid}@media (height<=700px){.home__brand{margin-top:0}.home__sun{width:64px;height:64px}.home__menu{gap:8px}.home .btn{min-height:60px;padding:6px 16px}}@keyframes sunrise{0%{opacity:0;transform:translateY(24px)scale(.85)}}@keyframes spin{to{transform:rotate(360deg)}}.play{height:100%;padding-top:var(--safe-top);flex-direction:column;display:flex;position:relative}.bar{grid-template-columns:56px 1fr 56px;align-items:center;gap:10px;padding:8px 10px 4px;display:grid}.bar h2{text-align:center;font-size:24px}.bar__title{text-align:center;line-height:1.2;display:grid}.bar__name{font-size:20px;font-weight:700}.bar__sub{color:var(--muted);font-size:16px}.bar__time{font-variant-numeric:tabular-nums;justify-self:end;min-width:56px;font-size:18px;font-weight:700}.board-wrap{flex:1;place-items:center;min-height:0;display:grid;position:relative;container-type:size}.board{aspect-ratio:1;background:var(--line-strong);touch-action:manipulation;border-radius:10px;grid-template-rows:repeat(3,1fr);grid-template-columns:repeat(3,1fr);gap:max(3px,.8cqw);width:min(100cqw - 16px,100cqh - 8px);padding:max(3px,.8cqw);display:grid;box-shadow:0 8px 26px #00000047;container-type:inline-size}.board--in{animation:.35s cubic-bezier(.2,.7,.3,1) rise}.box{background:var(--line);grid-template-rows:repeat(3,1fr);grid-template-columns:repeat(3,1fr);gap:1px;display:grid;overflow:hidden}.box:first-child{border-top-left-radius:7px}.box:nth-child(3){border-top-right-radius:7px}.box:nth-child(7){border-bottom-left-radius:7px}.box:nth-child(9){border-bottom-right-radius:7px}.cell{background:var(--board);min-width:0;min-height:0;color:var(--entry);font-family:var(--font-ui);cursor:pointer;border:0;border-radius:0;place-items:center;padding:0;line-height:1;display:grid;position:relative}.cell:focus-visible{outline:3px solid var(--focus);outline-offset:-3px;z-index:2}.digit{font-variant-numeric:tabular-nums;font-size:7.3cqw;font-weight:600}.play--xl .digit,.size-demo--xl .digit{font-size:8.7cqw}.cell--given{color:var(--given)}.cell--given .digit{font-weight:800}.cell--area,.cell--hintarea{background:var(--area)}.cell--same{background:var(--same)}.cell--mark{background:var(--mark)}.cell--sel{background:var(--sel);box-shadow:inset 0 0 0 max(3px, .7cqw) var(--sel-ring);z-index:1}.cell--hint{background:var(--sel);box-shadow:inset 0 0 0 max(3px, .8cqw) var(--hint);z-index:1;animation:1.1s ease-in-out 3 pulse}.cell--clash{background:var(--clash-bg);color:var(--clash)}.cell--clash:after{content:"";background:var(--clash);border-radius:2px;height:max(2px,.5cqw);position:absolute;bottom:9%;left:24%;right:24%}.cell--given.cell--clash{color:var(--given)}.cell--flash{animation:.8s ease-out both shine}.notes{width:100%;height:100%;color:var(--note);font-variant-numeric:tabular-nums;padding:6%;font-weight:700;display:grid}.notes span{border-radius:4px;place-items:center;display:grid}.notes .on{background:var(--sel);color:var(--given)}.notes--big{grid-template-rows:1fr 1fr;grid-template-columns:1fr 1fr;padding:3%;font-size:5cqw}.notes--small{grid-template-rows:repeat(3,1fr);grid-template-columns:repeat(3,1fr);padding:1%;font-size:3.5cqw}.play--xl .notes--big{font-size:5.4cqw}.play--xl .notes--small{font-size:3.7cqw}@keyframes pulse{50%{box-shadow:inset 0 0 0 max(5px, 1.3cqw) var(--hint)}}@keyframes shine{30%{background:var(--done-glow);transform:scale(1.06)}}.toast{z-index:5;background:var(--sheet);color:var(--sheet-ink);text-align:center;pointer-events:none;border-radius:14px;margin:0;padding:12px 16px;font-size:18px;font-weight:700;animation:.2s rise;position:absolute;bottom:10px;left:16px;right:16px;box-shadow:0 8px 24px #00000059}.toast[hidden]{display:none}.controls{padding:8px 8px calc(var(--safe-bottom) + 10px);gap:8px;display:grid;position:relative}.pad{grid-template-columns:repeat(5,1fr);gap:6px;display:grid}.key{min-width:0;height:var(--key-h);border:2px solid var(--key-edge);background:var(--key);color:var(--key-ink);border-radius:14px;align-content:center;place-items:center;gap:1px;padding:2px;display:grid;box-shadow:0 2px #0000002e}.key b{font-size:calc(var(--key-h) * .5);font-variant-numeric:tabular-nums;font-weight:700;line-height:1}.key small{color:var(--key-sub);white-space:nowrap;align-items:center;gap:2px;font-size:16px;font-weight:700;line-height:1.1;display:flex}.key small svg{width:16px;height:16px}.key--done{background:var(--key-done);color:var(--key-done-ink);box-shadow:none}.key--done small{color:var(--key-done-ink)}.key--armed{background:var(--primary);border-color:var(--primary-ink);color:var(--primary-ink)}.key--armed small{color:var(--primary-ink)}.key--erase svg{width:28px;height:28px}.pad--notes .key:not(.key--erase){border-style:dashed;border-color:var(--key-ink)}.pad--notes .key:not(.key--done):not(.key--erase) b{font-size:calc(var(--key-h) * .4)}.tools{grid-template-columns:repeat(4,1fr);gap:6px;display:grid}.tool{min-width:0;height:var(--key-h);border:2px solid var(--btn-edge);background:var(--btn);color:var(--btn-ink);border-radius:14px;align-content:center;place-items:center;gap:2px;padding:4px 2px;font-size:16px;font-weight:700;line-height:1.1;display:grid}.tool svg{width:26px;height:26px}.tool--on{background:var(--primary);color:var(--primary-ink);border-color:#0000}.hintcard{left:8px;right:8px;bottom:calc(var(--safe-bottom) + 10px);z-index:6;background:var(--sheet);color:var(--sheet-ink);border-radius:18px;grid-template-rows:auto 1fr auto;gap:8px;padding:14px 16px 12px;animation:.2s cubic-bezier(.2,.7,.3,1) rise;display:grid;position:absolute;box-shadow:0 -6px 30px #00000059}.hintcard--top{top:calc(var(--safe-top) + 8px);bottom:auto;box-shadow:0 6px 30px #00000059}.hintcard[hidden]{display:none}.hintcard p{margin:0}.hintcard__title{font:700 25px/1.15 var(--font-title)}.hintcard__text{font-size:18px;line-height:1.35}.hintcard__note{color:var(--sheet-muted);font-size:16px;line-height:1.3}.hintcard__btns{grid-template-columns:1fr 1.5fr;gap:8px;display:grid}.hintcard .btn:not(.btn--primary),.sheet__card .btn:not(.btn--primary){background:var(--sheet-btn);color:var(--sheet-ink);border-color:#0000}[data-theme=lilac] .hintcard .btn--primary,[data-theme=lilac] .sheet__card .btn--primary{background:var(--primary)}@media (height<=660px){.hintcard__title{font-size:20px}.hintcard__text{font-size:17px;line-height:1.3}}.sheet{z-index:1000;background:#0000008c;place-items:center;padding:16px;animation:.2s fade;display:grid;position:fixed;inset:0}.sheet__card{width:100%;max-width:460px;max-height:calc(100% - var(--safe-top) - var(--safe-bottom));background:var(--sheet);color:var(--sheet-ink);border-radius:22px;gap:12px;padding:22px 18px 14px;animation:.25s cubic-bezier(.2,.7,.3,1) rise;display:grid;overflow:auto;box-shadow:0 20px 60px #0006}.sheet__card h2{font:700 31px/1.1 var(--font-title);text-align:center}.sheet__card p{color:var(--sheet-muted);text-align:center;margin:0}.sheet__card .sheet__big{color:var(--sheet-ink);font-variant-numeric:tabular-nums;font-size:24px;font-weight:700}.sheet__card .btn--quiet{background:0 0!important}.sheet__card .choice{background:var(--sheet-btn)}.sheet__card .choice__opt{color:var(--sheet-ink)}.sheet__card .choice__opt--on{color:var(--primary-ink)}.howto ol{gap:10px;margin:0;padding-left:24px;font-size:19px;display:grid}.howto{gap:14px;display:grid}.howto .howto__note{color:var(--sheet-ink);font-weight:700}.won{gap:12px;display:grid}.won__sun{width:84px;height:84px;fill:var(--sun);justify-self:center;animation:.9s cubic-bezier(.2,.7,.3,1) both sunrise}.won__sun svg{width:100%;height:100%}.won__badges{flex-wrap:wrap;justify-content:center;gap:8px;display:flex}.won__badges span{color:#2a1428;background:#ffc94d;border-radius:99px;padding:4px 12px;font-size:17px;font-weight:700}@keyframes fade{0%{opacity:0}}@keyframes rise{0%{opacity:0;transform:translateY(24px)}}.page{height:100%;padding:calc(var(--safe-top) + 4px) 16px calc(var(--safe-bottom) + 24px);flex-direction:column;gap:12px;display:flex;overflow-y:auto}.page>*{flex-shrink:0}.page .bar{padding:8px 0}.page h3{letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-top:12px;font-size:17px}.statset{gap:8px;display:grid}.statset dl{grid-template-columns:1fr 1fr;gap:8px;margin:0;display:grid}.statset dl div{border:2px solid var(--btn-edge);background:var(--btn);color:var(--btn-ink);border-radius:14px;padding:12px 14px;display:grid}.statset dt{font-size:16px}.statset dd{font-variant-numeric:tabular-nums;margin:0;font-size:28px;font-weight:800}.toggle{border:2px solid var(--btn-edge);background:var(--btn);min-height:64px;color:var(--btn-ink);cursor:pointer;border-radius:14px;grid-template-columns:1fr auto;align-items:center;gap:12px;padding:10px 14px;font-weight:700;display:grid}.toggle small{font-size:16px;font-weight:500;display:block}.toggle input{opacity:0;pointer-events:none;position:absolute}.toggle i{background:0 0;border:2px solid;border-radius:99px;width:60px;height:36px;transition:background .2s;position:relative}.toggle i:after{content:"";background:currentColor;border-radius:50%;width:26px;height:26px;transition:transform .2s;position:absolute;top:3px;left:3px}.toggle input:checked+i{border-color:var(--primary);background:var(--primary)}.toggle input:checked+i:after{background:var(--primary-ink);transform:translate(24px)}.toggle input:focus-visible+i{outline:3px solid var(--focus);outline-offset:2px}.choice{border:2px solid var(--btn-edge);background:var(--btn);border-radius:16px;grid-auto-columns:1fr;grid-auto-flow:column;gap:4px;padding:4px;display:grid}.choice__opt{min-width:0;min-height:56px;color:var(--btn-ink);background:0 0;border:0;border-radius:12px;padding:0 2px;font-size:18px;font-weight:700}.choice__opt--on{background:var(--primary);color:var(--primary-ink)}.size-demo{background:var(--line-strong);border-radius:8px;grid-template-columns:repeat(3,64px);justify-content:center;align-self:center;gap:2px;width:max-content;padding:2px;display:grid;container-type:inline-size}.size-demo .cell{cursor:default;width:64px;height:64px}.size-demo .digit{font-size:42.24px}.size-demo--xl .digit{font-size:51.2px}.size-demo .notes--big{font-size:28.8px}.size-demo--xl .notes--big{font-size:31.36px}.note{color:var(--muted);margin:0;font-size:18px}.looks{gap:8px;display:grid}.look{border:3px solid var(--btn-edge);background:var(--btn);min-height:72px;color:var(--btn-ink);text-align:left;border-radius:14px;grid-template-rows:auto auto;grid-template-columns:auto 1fr;align-items:center;column-gap:14px;padding:10px 14px;display:grid}.look--on{border-color:var(--primary);box-shadow:inset 0 0 0 2px var(--primary)}.look__sw{grid-row:span 2;display:flex}.look__sw i{border:1px solid #7f7f7f80;width:22px;height:44px}.look__sw i:first-child{border-radius:8px 0 0 8px}.look__sw i:last-child{border-radius:0 8px 8px 0}.look__name{font-weight:700}.look__blurb{font-size:16px}.credits{text-align:center;color:var(--muted);margin:8px 0 0;font-size:16px}.credits a{color:inherit}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:10ms!important;animation-duration:10ms!important;animation-iteration-count:1!important}}:root,[data-theme=plum]{--bg:#4a2545;--bg-2:#3a1c37;--ink:#fff7ec;--muted:#ecd9e8;--sun:#ffc94a;--board:#fffaf0;--line-strong:#2e1530;--line:#93808f;--given:#1c1320;--entry:#1a3878;--note:#4a3a48;--sel:#ffc94d;--sel-ring:#2e1530;--area:#f4e7f0;--same:#ffe08f;--clash:#9a0e16;--clash-bg:#fde2df;--mark:#dde7f8;--hint:#1a3878;--done-glow:#ffc94d;--key:#fffaf0;--key-edge:transparent;--key-ink:#1c1320;--key-sub:#5e4a5a;--key-done:#2b1229;--key-done-ink:#f6e3f2;--btn:#643a5f;--btn-ink:#fff7ec;--btn-edge:#9a7394;--primary:#ffc94d;--primary-ink:#2a1428;--sheet:#fffaf0;--sheet-ink:#2a1428;--sheet-muted:#64505f;--sheet-btn:#f1e6ee;--focus:#ffc94d}[data-theme=lilac]{--bg:#ece8f1;--bg-2:#e1dbe9;--ink:#241c2b;--muted:#574b62;--sun:#e9a920;--board:#fff;--line-strong:#241c2b;--line:#8f8797;--given:#111;--entry:#1a3878;--note:#463d4f;--sel:#ffcf5a;--sel-ring:#241c2b;--area:#f1ecf6;--same:#ffe39a;--clash:#9a0e16;--clash-bg:#fde0dc;--mark:#dfe8f7;--hint:#1a3878;--done-glow:#ffcf5a;--key:#fff;--key-edge:#857a90;--key-ink:#1a1420;--key-sub:#574b62;--key-done:#d9d0e3;--key-done-ink:#2e2438;--btn:#faf8fc;--btn-ink:#241c2b;--btn-edge:#857a90;--primary:#4a2545;--primary-ink:#fff;--sheet:#fff;--sheet-ink:#241c2b;--sheet-muted:#574b62;--sheet-btn:#efeaf4;--focus:#1a3878}[data-theme=night]{--bg:#0b0b0c;--bg-2:#000;--ink:#fff;--muted:#cfcfcf;--sun:#ffd84d;--board:#141416;--line-strong:#e6e6e6;--line:#6a6a72;--given:#fff;--entry:#ffd84d;--note:#d6d6d6;--sel:#183a73;--sel-ring:#fff;--area:#26262c;--same:#4a3d0c;--clash:#ff8a80;--clash-bg:#3d1214;--mark:#1d3a5c;--hint:#38d1ff;--done-glow:#4a3d0c;--key:#1d1d21;--key-edge:#6a6a72;--key-ink:#fff;--key-sub:#cfcfcf;--key-done:#2f2f35;--key-done-ink:#fff;--btn:#26282c;--btn-ink:#fff;--btn-edge:#6a6a72;--primary:#ffd84d;--primary-ink:#111;--sheet:#1d1f22;--sheet-ink:#fff;--sheet-muted:#c9c9c9;--sheet-btn:#33363b;--focus:#38d1ff}
