:root{--primary:#2c6a3c;--on-primary:#fff;--primary-container:#b1f1b9;--on-primary-container:#00210b;--secondary-container:#d3e8d2;--on-secondary-container:#0f1f12;--tertiary-container:#bcebee;--error:#ba1a1a;--error-container:#ffdad6;--on-error-container:#410002;--surface:#f6fbf3;--surface-container-lowest:#fff;--surface-container-low:#f0f5ed;--surface-container:#eaefe7;--surface-container-high:#e4eae2;--surface-container-highest:#dfe4dc;--outline:#717970;--outline-variant:#c1c9be;--ink:#181d18;--muted:#414941;--vrij:#2e8540;--unk:#c1c9be}*,:before,:after{box-sizing:border-box}body{min-height:100dvh;color:var(--ink);font-optical-sizing:auto;-webkit-font-smoothing:antialiased;background:radial-gradient(1200px 600px at 20% -10%,#cfe9d1 0%,#0000 60%),radial-gradient(900px 500px at 110% 110%,#d6e7e8 0%,#0000 60%),#e7ede4;margin:0;font-family:Roboto Flex,Roboto,system-ui,sans-serif}button{font:inherit;color:inherit;cursor:pointer}button:disabled{cursor:default;opacity:.35}#app{display:contents}.phone{background:var(--surface);flex-direction:column;width:100%;max-width:560px;height:100dvh;margin:0 auto;display:flex;position:relative;overflow:hidden}@media (width>=640px){body{padding:24px 16px}.phone{border-radius:28px;height:calc(100dvh - 48px);box-shadow:0 24px 48px #00210b2e,0 6px 14px #0000001a}}.appbar{z-index:2;padding:max(16px, env(safe-area-inset-top)) 12px 12px 16px;background:var(--surface-container);flex:none}.appbar-row{justify-content:space-between;align-items:center;gap:12px;display:flex}.brand{align-items:center;gap:10px;min-width:0;display:flex}.brand-text{min-width:0}.logo{background:var(--primary-container);width:40px;height:40px;color:var(--on-primary-container);border-radius:12px;flex:none;place-items:center;display:grid}.title,.subtitle{white-space:nowrap;text-overflow:ellipsis;margin:0;overflow:hidden}.title{font-size:1.6rem;font-weight:500;line-height:1.2}.subtitle{color:var(--muted);letter-spacing:.01em;font-size:.82rem}.icon-btn{width:40px;height:40px;color:var(--muted);background:0 0;border:0;border-radius:50%;flex:none;place-items:center;padding:0;transition:background .15s;display:inline-grid}.icon-btn:hover:not(:disabled){background:#181d1814}.icon-btn:focus-visible{outline:3px solid var(--primary);outline-offset:1px}.timer{background:var(--secondary-container);height:36px;color:var(--on-secondary-container);font-variant-numeric:tabular-nums;border-radius:18px;flex:none;align-items:center;gap:6px;padding:0 14px 0 10px;font-size:.95rem;font-weight:600;display:inline-flex}.timer.done{background:var(--primary);color:var(--on-primary)}.chips{scrollbar-width:none;gap:8px;margin-top:14px;display:flex;overflow-x:auto}.chips::-webkit-scrollbar{display:none}.chip{background:var(--surface-container-highest);border:0;border-radius:12px;flex:none;align-items:center;gap:6px;height:36px;padding:0 14px 0 10px;font-size:.85rem;font-weight:500;transition:background .15s,border-radius .2s;display:inline-flex}.chip.sel{background:var(--primary);color:var(--on-primary);border-radius:18px}.chip:focus-visible{outline:3px solid var(--primary);outline-offset:2px}.content{overscroll-behavior:contain;flex:1;min-height:0;padding:4px 12px 24px;overflow-y:auto}.summary{justify-content:space-between;align-items:center;gap:12px;padding:18px 6px 12px;display:flex}.big{font-size:1.3rem;font-weight:500}.sub{color:var(--muted);letter-spacing:.01em;font-size:.85rem}.list{gap:10px;display:grid}.site{background:var(--surface-container-low);cursor:pointer;border-radius:24px;grid-template-columns:1fr auto;align-items:center;gap:10px 12px;padding:16px;transition:background .15s;display:grid}.site:hover{background:var(--surface-container)}.site:active{background:var(--surface-container-high)}.site:focus-visible{outline:3px solid var(--primary);outline-offset:2px}.site-head{min-width:0}.site-name{white-space:nowrap;text-overflow:ellipsis;margin:0;font-size:1.05rem;font-weight:500;overflow:hidden}.game-title{align-items:center;gap:10px;min-width:0;margin:0;display:flex}.game-icon{background:var(--secondary-container);width:36px;height:36px;color:var(--on-secondary-container);border-radius:12px;flex:none;place-items:center;display:grid}.meta{color:var(--muted);grid-column:1/-1;font-size:.84rem}.streak{color:#9a4a00;vertical-align:-2px;align-items:center;gap:2px;font-weight:600;display:inline-flex}.pill{letter-spacing:.02em;white-space:nowrap;border-radius:8px;justify-content:center;align-items:center;gap:4px;min-width:76px;padding:7px 14px;font-size:.8rem;font-weight:600;display:inline-flex}.pill:first-letter{text-transform:uppercase}.pill.v{background:var(--primary-container);color:#0b4d21}.pill.q{background:var(--surface-container-highest);color:var(--muted)}.pill.play{background:var(--primary);color:var(--on-primary)}.strip{grid-column:1/-1;grid-template-columns:repeat(7,1fr);gap:4px;display:grid}.cell{color:#181d18b8;border:0;border-radius:10px;place-items:center;height:30px;padding:0;font-size:.66rem;font-weight:600;display:grid}.cell.s0{background:#c3ecc8}.cell.sq{background:var(--surface-container-highest)}.cell.first{box-shadow:inset 0 0 0 2px var(--primary);color:var(--ink)}.cell:hover{filter:brightness(.96)}.cell:focus-visible{outline:3px solid var(--primary);outline-offset:1px}.cal-head{justify-content:space-between;align-items:center;padding:16px 0 10px;display:flex}.cal-head .icon-btn{background:var(--surface-container-high);color:var(--ink)}.cal-head h3{text-transform:capitalize;margin:0;font-size:1.2rem;font-weight:500}.cal{background:var(--surface-container-low);border-radius:28px;grid-template-columns:repeat(7,1fr);gap:6px;padding:14px;display:grid}.cal .wd{color:var(--muted);text-align:center;font-size:.72rem;font-weight:600}.cal button{aspect-ratio:1;background:var(--surface-container-highest);color:var(--ink);border:0;border-radius:50%;place-content:center;padding:0;font-weight:600;display:grid}.cal button.solved{background:var(--vrij);color:#fff}.cal button.started{background:var(--primary-container);color:var(--on-primary-container)}.cal button:hover:not(:disabled){filter:brightness(.95)}.cal button:focus-visible{outline:3px solid var(--primary);outline-offset:1px}.cal button.is-today{box-shadow:0 0 0 2px var(--surface-container-low), 0 0 0 4px var(--primary)}.cal button:disabled{color:var(--muted);background:0 0}.legend{color:var(--muted);flex-wrap:wrap;align-items:center;gap:4px 8px;padding:12px 6px;font-size:.8rem;display:flex}.legend i{border-radius:50%;width:12px;height:12px;display:inline-block}.lg-v{background:var(--vrij)}.lg-s{background:var(--primary-container)}.lg-q{background:var(--surface-container-highest)}.legend-count{margin-left:auto;font-weight:600}.stat-card{background:var(--surface-container-low);border-radius:24px;margin-top:10px;padding:16px}.stat-card .game-title{margin-bottom:12px;font-size:1.05rem;font-weight:500}.facts{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;display:grid}.fact{background:var(--surface-container-lowest);border-radius:16px;gap:2px;padding:12px 14px;display:grid}.fact span{letter-spacing:.02em;color:var(--muted);font-size:.72rem;font-weight:600}.fact strong{font-variant-numeric:tabular-nums;font-size:.95rem;font-weight:600;line-height:1.3}.text-btn{width:100%;height:44px;color:var(--primary);background:0 0;border:0;border-radius:22px;justify-content:center;align-items:center;gap:8px;margin-top:14px;font-weight:600;display:flex}.text-btn:hover{background:#2c6a3c14}.text-btn:focus-visible{outline:3px solid var(--primary);outline-offset:2px}.text-btn.danger{color:var(--error)}.text-btn.danger:hover{background:#ba1a1a14}.tabbar{z-index:2;padding:12px 8px calc(14px + env(safe-area-inset-bottom));background:var(--surface-container);flex:none;grid-template-columns:repeat(3,1fr);display:grid}.tab{color:var(--muted);background:0 0;border:0;flex-direction:column;align-items:center;gap:4px;padding:0;font-size:.74rem;font-weight:500;display:flex}.tab svg{box-sizing:content-box;border-radius:16px;width:24px;height:24px;padding:4px 20px;transition:background .2s}.tab:hover svg{background:#181d1814}.tab:focus-visible{outline:none}.tab:focus-visible svg{outline:3px solid var(--primary)}.tab.active{color:var(--ink);font-weight:700}.tab.active svg{background:var(--secondary-container);color:var(--on-secondary-container)}.content.play{padding-top:16px}.board-wrap{justify-items:center;gap:14px;display:grid}.board{--n:6;grid-template-columns:repeat(var(--n), 1fr);grid-template-rows:repeat(var(--n), 1fr);aspect-ratio:1;border:2px solid var(--ink);background:var(--surface-container-lowest);touch-action:none;-webkit-user-select:none;user-select:none;border-radius:16px;width:min(100%,440px);transition:box-shadow .3s;display:grid;position:relative;overflow:hidden}.board.solved{box-shadow:0 0 0 4px var(--primary-container), 0 0 0 6px var(--primary)}.actions{justify-content:center;gap:8px;margin-top:16px;display:flex}.tonal-btn{background:var(--secondary-container);height:40px;color:var(--on-secondary-container);border:0;border-radius:20px;align-items:center;gap:6px;padding:0 18px 0 14px;font-size:.88rem;font-weight:600;display:inline-flex}.tonal-btn:hover:not(:disabled){filter:brightness(.96)}.tonal-btn:focus-visible{outline:3px solid var(--primary);outline-offset:2px}.solved-banner{background:var(--primary-container);color:#0b4d21;border-radius:20px;justify-content:center;align-items:center;gap:8px;width:fit-content;margin:16px auto 0;padding:10px 18px;font-weight:600;display:flex}.rules{background:var(--surface-container-low);border-radius:20px;margin-top:18px;padding:14px 16px}.rules h3{margin:0 0 6px;font-size:.95rem;font-weight:600}.rules ul{color:var(--muted);margin:0;padding-left:18px;font-size:.85rem;line-height:1.5}.qcell{color:var(--ink);cursor:pointer;place-items:center;display:grid;box-shadow:inset .5px .5px #181d1838}.qcell.e-top{border-top:2.5px solid var(--ink)}.qcell.e-left{border-left:2.5px solid var(--ink)}.qcell .mark{opacity:.55}.qcell.bad{background-image:repeating-linear-gradient(135deg,#ba1a1a47 0 4px,#0000 4px 9px)}.qcell.bad svg{color:var(--error)}.zcell{transition:background .12s;box-shadow:inset .5px .5px #181d1829}.zcell.on{background:var(--primary-container)}.zip-layer{pointer-events:none;width:100%;height:100%;position:absolute;inset:0}.zip-path{fill:none;stroke:var(--primary);stroke-width:.36px;stroke-linecap:round;stroke-linejoin:round;opacity:.85}.zip-dot{fill:var(--primary);opacity:.85}.zip-wall{stroke:var(--ink);stroke-width:.09px;stroke-linecap:round}.zip-num circle{fill:var(--ink)}.zip-num.hit circle{fill:var(--primary);stroke:var(--on-primary);stroke-width:.05px}.zip-num text{fill:#fff;text-anchor:middle;dominant-baseline:central;font-size:.32px;font-weight:700}.pcell{box-shadow:inset .5px .5px #181d1829}.patch{z-index:1;background:var(--surface-container-highest);border:2px solid #181d188c;border-radius:10px;margin:3px}.patch.orphan{border-style:dashed;border-color:var(--error);background:var(--error-container)}.patch.preview{z-index:2;border:2px dashed var(--primary);background:#2c6a3c24}.clue{z-index:3;pointer-events:none;align-content:center;place-items:center;gap:2px;display:grid}.clue b{font-size:1.05rem;font-weight:700;line-height:1}.shape{border:2px solid var(--ink);border-radius:3px;display:block}.shape.square{width:12px;height:12px}.shape.wide{width:18px;height:10px}.shape.tall{width:10px;height:18px}.shape.any{border-style:dotted;border-radius:50%;width:14px;height:14px}.scell{color:var(--primary);background:0 0;border:0;place-items:center;padding:0;font-size:clamp(1.2rem,6vw,1.7rem);font-weight:500;display:grid;box-shadow:inset .5px .5px #181d1838}.scell.given{color:var(--ink);font-weight:700}.scell.b-right{border-right:2.5px solid var(--ink)}.scell.b-bottom{border-bottom:2.5px solid var(--ink)}.scell.rel{background:var(--surface-container-low)}.scell.same{background:var(--secondary-container)}.scell.sel{background:var(--primary-container)}.scell.bad{color:var(--error);background-image:repeating-linear-gradient(135deg,#ba1a1a24 0 4px,#0000 4px 9px)}.scell:focus-visible{box-shadow:inset 0 0 0 3px var(--primary);outline:none}.notes{width:100%;height:100%;color:var(--muted);grid-template-columns:repeat(3,1fr);padding:3px;font-size:.62rem;font-weight:600;display:grid}.notes i{place-items:center;font-style:normal;display:grid}.pad{grid-template-columns:repeat(6,1fr);gap:6px;width:min(100%,440px);display:grid}.key{background:var(--surface-container-high);border:0;border-radius:16px;height:52px;padding:0;font-size:1.3rem;font-weight:600;transition:background .15s,border-radius .2s}.key:hover:not(:disabled){background:var(--surface-container-highest)}.key:active:not(:disabled){border-radius:24px}.key:focus-visible{outline:3px solid var(--primary);outline-offset:2px}.pad.notes .key:not(.tool){color:var(--muted);font-size:1rem}.key.tool{background:var(--secondary-container);height:44px;color:var(--on-secondary-container);grid-column:span 3;justify-content:center;align-items:center;gap:8px;font-size:.88rem;display:inline-flex}.key.tool.on{background:var(--primary);color:var(--on-primary)}.sheet-backdrop{z-index:10;opacity:0;pointer-events:none;background:#00000052;transition:opacity .2s;position:absolute;inset:0}.sheet-backdrop.open{opacity:1;pointer-events:auto}.sheet{z-index:11;max-height:92%;padding:0 16px calc(16px + env(safe-area-inset-bottom));background:var(--surface-container-low);visibility:hidden;border-radius:28px 28px 0 0;flex-direction:column;transition:transform .28s cubic-bezier(.2,.8,.2,1);display:flex;position:absolute;bottom:0;left:0;right:0;transform:translateY(105%);box-shadow:0 -2px 12px #0000001f}.sheet.open{visibility:visible;transform:translateY(0)}.sheet-handle{background:var(--outline);opacity:.6;border-radius:2px;flex:none;align-self:center;width:32px;height:4px;margin:22px 0 14px}.sheet-title{text-align:center;margin:0;font-size:1.4rem;font-weight:500}.sheet-meta{color:var(--muted);text-align:center;margin:6px 0 16px;font-size:.88rem}.win-badge{background:var(--primary-container);width:64px;height:64px;color:var(--on-primary-container);border-radius:20px;align-self:center;place-items:center;margin-bottom:12px;display:grid}.sheet-link{background:var(--primary);height:48px;color:var(--on-primary);letter-spacing:.01em;border:0;border-radius:24px;flex:none;justify-content:center;align-items:center;gap:8px;margin-top:16px;padding:0 24px;font-weight:500;display:flex}.sheet-link:hover{box-shadow:0 1px 3px #00000040}.sheet-link:focus-visible{outline:3px solid var(--primary);outline-offset:3px}.sheet .text-btn{margin-top:6px}@media (prefers-reduced-motion:reduce){.sheet,.sheet-backdrop{transition:none}}.cal.levels button{font-size:.85rem}.cell.s0{background:var(--vrij);color:#fff}.cell.locked{opacity:.4}.content.play>.sheet-link{width:min(100%,440px);margin:14px auto 0}.install-banner{background:var(--primary-container);color:var(--on-primary-container);border-radius:20px;flex:none;align-items:center;gap:12px;margin:0 12px 10px;padding:10px 8px 10px 12px;animation:.3s ease-out install-in;display:flex;box-shadow:0 2px 8px #00210b24}.install-banner img{border-radius:10px;flex:none}.install-text{flex:1;gap:1px;min-width:0;font-size:.8rem;line-height:1.35;display:grid}.install-text strong{font-size:.92rem;font-weight:600}.install-text .inline-icon{vertical-align:-3px}.install-action{background:var(--primary);height:36px;color:var(--on-primary);border:0;border-radius:18px;flex:none;padding:0 16px;font-size:.85rem;font-weight:600}.install-close{width:32px;height:32px;color:inherit;background:0 0;border:0;border-radius:50%;flex:none;place-items:center;padding:0;display:grid}.install-close:hover{background:#00000014}.install-action:focus-visible,.install-close:focus-visible{outline:3px solid var(--primary);outline-offset:2px}@keyframes install-in{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}@media (prefers-reduced-motion:reduce){.install-banner{animation:none}}