@font-face{font-family:Atkinson Hyperlegible Next;src:url(/games/sunroom-freecell/play/fonts/atkinson-hyperlegible-next.woff2)format("woff2");font-weight:200 800;font-display:swap}@font-face{font-family:Alegreya;src:url(/games/sunroom-freecell/play/fonts/alegreya.woff2)format("woff2");font-weight:400 900;font-display:swap}:root{--font-ui:"Atkinson Hyperlegible Next", system-ui, sans-serif;--font-title:"Alegreya", Georgia, serif;--safe-top:env(safe-area-inset-top,0px);--safe-bottom:env(safe-area-inset-bottom,0px);--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(--table) 40%, var(--table-2));background-color:var(--table);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:860px;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:12px 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:52px;padding:8px 16px;font-size:18px}.btn:active,.tool:active,.icon-btn:active{transform:scale(.97)}.icon-btn{background:var(--btn);width:56px;height:56px;color:var(--btn-ink);border:0;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) + 24px) 20px calc(var(--safe-bottom) + 20px);flex-direction:column;justify-content:space-between;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:6px;margin-top:6vh;display:grid}.home__sun{width:112px;height:112px;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:800 clamp(48px, 17vw, 72px)/1 var(--font-title);letter-spacing:-.01em;margin:0}.logo span{font:700 19px/1 var(--font-ui);letter-spacing:.4em;text-transform:uppercase;color:var(--sun);margin-bottom:4px;padding-left:.4em;display:block}.home__tag{color:var(--muted);margin:10px 0 0;font-size:clamp(16px,5vw,20px)}.home__menu{gap:12px;width:100%;max-width:440px;margin:0 auto;display:grid}.home__row{grid-template-columns:1fr 1fr;display:grid}@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}.bar{grid-template-columns:56px 1fr auto;align-items:center;gap:10px;padding:8px 10px 4px;display:grid}.bar h2{text-align:center;font-size:24px}.bar>span:last-child:empty{width:56px}.bar__title{line-height:1.15;display:grid}.bar__deal{font-size:18px;font-weight:700}.bar__sub,.bar__count{color:var(--muted);font-size:16px}.bar__count{font-variant-numeric:tabular-nums;color:var(--ink);justify-items:end;font-weight:600;line-height:1.2;display:grid}.caption{text-align:center;height:48px;color:var(--hint);place-items:center;margin:0;padding:0 14px;font-size:17px;font-weight:700;line-height:22px;display:grid;overflow:hidden}.table-wrap{flex:1;min-height:0;position:relative}.table{touch-action:none;position:absolute;inset:0}.tools{padding:8px 10px calc(var(--safe-bottom) + 10px);grid-template-columns:repeat(4,1fr);gap:8px;display:grid}.tool{border:2px solid var(--btn-edge);background:var(--btn);min-height:66px;color:var(--btn-ink);border-radius:16px;justify-items:center;gap:2px;padding:8px 4px;font-size:16px;font-weight:700;display:grid}.tool svg{width:28px;height:28px}.stuck{background:var(--sheet);color:var(--sheet-ink);text-align:center;border-radius:16px;gap:8px;margin:0 10px;padding:12px 14px;display:grid;box-shadow:0 6px 24px #0000004d}.stuck[hidden]{display:none}.stuck p{margin:0;font-weight:700}.stuck__btns{grid-template-columns:1fr 1fr;gap:8px;display:grid}.stuck .btn:not(.btn--primary){background:var(--sheet-btn);color:var(--sheet-ink)}.slot{width:var(--cw);height:var(--ch);border:2px solid var(--slot);border-radius:calc(var(--cw) * .09);background:var(--slot-fill);place-items:center;padding:0;display:grid;position:absolute;top:0;left:0}.slot--tab{border-style:dashed}.table__label{text-align:center;height:22px;color:var(--muted);white-space:nowrap;pointer-events:none;font-size:16px;font-weight:700;line-height:20px;position:absolute;top:0;left:0}.slot--cell{background:var(--cell-fill);border-radius:calc(var(--cw) * .16)}.slot__label{font-size:max(12px, calc(var(--cw) * .24));color:var(--slot-ink);font-weight:700}.slot__suit{width:46%;fill:var(--slot-ink)}.slot--target{border-color:var(--target);box-shadow:0 0 0 2px var(--target);border-style:solid}.card{width:var(--cw);height:var(--ch);font-size:var(--cw);border-radius:calc(var(--cw) * .09);will-change:transform;touch-action:none;transition:transform .2s cubic-bezier(.2,.7,.3,1);position:absolute;top:0;left:0}.card--still{transition:none}.card--fly{transition:transform 1s cubic-bezier(.3,0,.4,1.25)}.card__face{border-radius:inherit;box-shadow:var(--card-shadow), inset 0 0 0 1px var(--card-edge);background:var(--card);position:absolute;inset:0}.card--s,.card--c{color:var(--black)}.card--h,.card--d{color:var(--red)}.four-colour .card--d{color:var(--blue)}.four-colour .card--c{color:var(--green)}.card svg{fill:currentColor}.card__rank{font:800 .48em/1 var(--font-ui);letter-spacing:-.07em;position:absolute;top:.02em;left:.05em}.card__suit{width:.33em;height:.33em;position:absolute;top:.06em;right:.05em}.card__pip{width:.58em;height:.58em;position:absolute;bottom:.13em;left:50%;transform:translate(-50%)}.card__court{height:1.05em;font:800 .56em/1 var(--font-title);border:.06em solid;border-radius:.14em;place-items:center;padding-top:.08em;display:grid;position:absolute;bottom:.2em;left:.22em;right:.22em}.play--xl .card__rank{letter-spacing:-.1em;font-size:.58em}.card__rank--10{letter-spacing:-.1em}.play--xl .card__rank--10{letter-spacing:-.12em;font-size:.5em}.play--xl .card__suit{width:.34em;height:.34em;top:.1em;right:.03em}.card--lift .card__face{box-shadow:0 10px 22px #00000059, inset 0 0 0 1px var(--card-edge)}.card--target .card__face{box-shadow:0 0 0 3px var(--target), var(--card-shadow)}.card--nope>*{animation:.4s nope}.hinted .card__face,.slot.hinted{box-shadow:0 0 0 .05em var(--hint), 0 0 .22em .04em var(--hint);animation:.9s ease-in-out 3 glow}.slot.hinted{border-color:var(--hint)}@keyframes nope{20%,60%{transform:translate(-6%)}40%,80%{transform:translate(6%)}}@keyframes glow{50%{box-shadow:0 0 0 .08em var(--hint), 0 0 .4em .1em var(--hint)}}.sheet{z-index:1000;background:#00000080;place-items:center;padding:20px;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:24px 20px 16px;animation:.25s cubic-bezier(.2,.7,.3,1) rise;display:grid;overflow:auto;box-shadow:0 20px 60px #0006}.sheet__card h2{font:800 32px/1.15 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:26px;font-weight:700}.sheet__card .btn:not(.btn--primary){background:var(--sheet-btn);color:var(--sheet-ink);border-color:#0000}.sheet__card .btn--quiet{background:0 0!important}.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__badges{flex-wrap:wrap;justify-content:center;gap:8px;display:flex}.won__badges span{background:var(--primary);color:var(--primary-ink);border-radius:99px;padding:4px 12px;font-size:16px;font-weight:700}@keyframes fade{0%{opacity:0}}@keyframes rise{0%{opacity:0;transform:translateY(30px)}}.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{background:var(--btn);border-radius:14px;padding:12px 14px;display:grid}.statset dt{color:var(--muted);font-size:16px}.statset dd{font-variant-numeric:tabular-nums;margin:0;font-size:28px;font-weight:800}.statset dd small{color:var(--muted);font-size:17px;font-weight:600}.toggle{background:var(--btn);border-radius:14px;grid-template-columns:1fr auto;align-items:center;gap:12px;min-height:64px;padding:10px 14px;font-weight:700;display:grid}.toggle small{color:var(--muted);font-size:16px;font-weight:500;display:block}.toggle input{opacity:0;pointer-events:none;position:absolute}.toggle i{background:#7f7f7f73;border-radius:99px;width:60px;height:36px;transition:background .2s;position:relative}.toggle i:after{content:"";background:#fff;border-radius:50%;width:28px;height:28px;transition:transform .2s;position:absolute;top:4px;left:4px;box-shadow:0 1px 3px #0000004d}.toggle input:checked+i{background:var(--primary)}.toggle input:checked+i:after{transform:translate(24px)}.toggle input:focus-visible+i{outline:3px solid var(--hint)}.choice{background:var(--btn);border-radius:16px;grid-auto-columns:1fr;grid-auto-flow:column;gap:6px;padding:6px;display:grid}.choice__opt{background:0 0;border:0;border-radius:12px;min-height:54px;font-size:19px;font-weight:700}.choice__opt--on{background:var(--primary);color:var(--primary-ink)}.note{color:var(--muted);margin:0;font-size:17px}.looks{gap:8px;display:grid}.look{background:var(--btn);text-align:left;border:3px solid #0000;border-radius:14px;grid-template-rows:auto auto;grid-template-columns:auto 1fr;align-items:center;column-gap:14px;min-height:72px;padding:10px 14px;display:grid}.look--on{border-color:var(--primary)}.look__sw{grid-row:span 2;display:flex}.look__sw i{border:1px solid #7f7f7f66;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{color:var(--muted);font-size:16px}.credits{text-align:center;color:var(--muted);margin:8px 0 0;font-size:15px}.credits a{color:inherit}@media (prefers-reduced-motion:reduce){.card,.card--fly{transition-duration:10ms!important}.home__sun svg{animation:none}}.tool--hint:has(.tool__tag){gap:0;padding-top:6px;padding-bottom:4px}.tool--hint:has(.tool__tag) svg{margin-bottom:2px}.tool__tag{white-space:nowrap;font-size:13px;font-weight:600;line-height:15px}.ad-ask{gap:12px;display:grid}:root,[data-theme=delft]{--table:#1d4673;--table-2:#173a60;--ink:#fbf8f1;--muted:#d3e0ef;--card:#fdf9f0;--card-edge:#0003;--card-shadow:0 1px 2px #0006;--red:#c11f2a;--black:#161a22;--blue:#1452b8;--green:#12763a;--slot:#7f9cc0;--slot-ink:#c4d4e8;--slot-fill:#0000001f;--cell-fill:#ffffff12;--sun:#ffc845;--hint:#ffd25e;--target:#ffd25e;--btn:#275688;--btn-ink:#fbf8f1;--btn-edge:#4a76a6;--primary:#ffc845;--primary-ink:#172234;--sheet:#fdf9f0;--sheet-ink:#172234;--sheet-muted:#4a5466;--sheet-btn:#e6e9ef;--focus:#ffd25e}[data-theme=porcelain]{--table:#e3eaf1;--table-2:#d6dfe9;--ink:#142235;--muted:#3e4d61;--card:#fff;--card-edge:#14223557;--card-shadow:0 1px 2px #14223547;--red:#b81c26;--black:#111418;--blue:#1146a6;--green:#0f6c34;--slot:#6b7d93;--slot-ink:#45556b;--slot-fill:#1422350d;--cell-fill:#ffffff8c;--sun:#a86f00;--hint:#9c4700;--target:#b35200;--btn:#fff;--btn-ink:#142235;--btn-edge:#b3c0cf;--primary:#173a63;--primary-ink:#fff;--sheet:#fff;--sheet-ink:#142235;--sheet-muted:#46556a;--sheet-btn:#e8edf3;--focus:#9c4700}[data-theme=midnight]{--table:#0c0d10;--table-2:#07080a;--ink:#fff;--muted:#cfd2d8;--card:#fff;--card-edge:transparent;--card-shadow:0 0 0 1px #000;--red:#cf0f1e;--black:#000;--blue:#0b4bd0;--green:#00752e;--slot:#8a8f99;--slot-ink:#c9ccd2;--slot-fill:#ffffff0a;--cell-fill:#ffffff12;--sun:#ffc845;--hint:#5fd4ff;--target:#5fd4ff;--btn:#23252b;--btn-ink:#fff;--btn-edge:#5b5f68;--primary:#ffc845;--primary-ink:#0c0d10;--sheet:#1b1d22;--sheet-ink:#fff;--sheet-muted:#cfd2d8;--sheet-btn:#32353c;--focus:#5fd4ff}
