:root{font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#191919;background:#fff;font-synthesis:none;--ink:#191919;--paper:#fff;--muted:#6c6c6c;--line:#e8e8e8;--soft:#f5f5f5;--stroke:5}
*{box-sizing:border-box}body{margin:0;min-width:320px}body.dark{--ink:#ededed;--paper:#161616;--muted:#aaa;--line:#393939;--soft:#222;color:var(--ink);background:var(--paper)}body.thick{--stroke:7}button{font:inherit;color:inherit;cursor:pointer;touch-action:manipulation}button:disabled{cursor:default;opacity:.35}button:focus-visible{outline:2px solid var(--ink);outline-offset:5px}button svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}button{background:var(--paper);border:1px solid var(--line);border-radius:10px;padding:10px 16px;min-height:44px}button:hover:not(:disabled){background:var(--soft)}[hidden]{display:none!important}.shell{max-width:620px;margin:0 auto;padding:24px 28px 18px}header{display:flex;align-items:center;justify-content:space-between;gap:18px}header nav{display:flex;gap:6px;align-items:center}.brand{display:flex;gap:9px;align-items:center;border:0;padding:0;letter-spacing:-1.1px;font-size:25px;font-weight:500}.brand svg{height:25px;width:25px}.icon-button{display:grid;place-items:center;padding:10px;border:0}.quiet-button{display:flex;align-items:center;gap:7px;border:0;font-size:14px;padding:9px}.quiet-button.active{background:var(--ink);color:var(--paper)}main{margin-top:32px}.level-header{display:flex;justify-content:space-between;align-items:end}.eyebrow{border:0;background:none;min-height:24px;padding:0;text-transform:uppercase;font-size:12px;letter-spacing:1.6px;color:var(--muted)}h1{font-size:29px;font-weight:450;letter-spacing:-.9px;margin:6px 0 0;line-height:1.25}.move-count{display:flex;flex-direction:column;align-items:center;gap:2px;padding-bottom:3px;font-size:12px;color:var(--muted);min-width:44px}.move-count strong{font-size:25px;font-weight:400;font-variant-numeric:tabular-nums;color:var(--ink)}.board-wrap{position:relative;aspect-ratio:6/7;width:100%;max-height:56svh;margin:10px auto 0;max-width:calc(56svh * 6 / 7)}#board{display:block;width:100%;height:100%;overflow:visible}.line{fill:none;stroke:var(--ink);stroke-width:var(--stroke);stroke-linecap:round;stroke-linejoin:round}.moving-line{fill:none;stroke:var(--paper);stroke-width:2;stroke-dasharray:3 9;stroke-linecap:round;pointer-events:none}.anchor{fill:var(--ink)}.tip{fill:var(--ink)}.blocked .line{stroke-dasharray:7 9}.hinted .line{stroke-width:calc(var(--stroke) + 1.5)}#hinges{position:absolute;inset:0;pointer-events:none}.hinge{pointer-events:auto;position:absolute;width:44px;height:44px;min-height:44px;margin:-22px 0 0 -22px;padding:0;border:0;border-radius:50%;display:grid;place-items:center;background:transparent}.hinge:disabled{opacity:1}.hinge:hover:not(:disabled){background:transparent}.hinge span{width:11px;height:11px;background:var(--paper);border:2px solid var(--ink);border-radius:50%;display:grid;place-items:center}.hinge i{width:4px;height:4px;border-radius:50%;background:var(--ink)}.hinge.selected span,.hinge.hint span{box-shadow:0 0 0 5px var(--paper),0 0 0 6px var(--ink)}.hinge:hover:not(:disabled) span{box-shadow:0 0 0 5px var(--soft)}.board-meta{display:flex;justify-content:space-between;gap:10px;font-size:12px;color:var(--muted);margin:8px 0 10px}.progress-track{height:2px;background:var(--line)}#progress{height:100%;background:var(--ink);transition:width .4s}#clear-mark{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none}#clear-mark svg{width:50px;height:50px;fill:none;stroke:var(--ink);stroke-width:1.2}.message{font-size:14px;line-height:1.5;min-height:42px;text-align:center;margin:17px 0 7px;color:var(--muted)}.selection-label{text-align:center;font-size:12px;color:var(--muted);min-height:18px;margin-bottom:8px}.fold-buttons{display:flex;justify-content:center;gap:12px}.fold-buttons button{display:flex;align-items:center;justify-content:center;gap:10px;width:165px;font-size:14px}.fold-buttons button.suggested{background:var(--ink);color:var(--paper);border-color:var(--ink)}#cycle-hinge{display:block;margin:6px auto 0;font-size:12px;min-height:34px;padding:4px 10px;border:0}.tools{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-top:20px}.tools button{font-size:12px;display:flex;flex-direction:column;gap:6px;align-items:center;justify-content:center;padding:9px 4px;border:0}.tools button svg{width:20px;height:20px}footer{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:20px;color:var(--muted);font-size:12px}footer button{font-size:12px;border:0;padding:5px 0;background:none}dialog{color:var(--ink);background:var(--paper);border:1px solid var(--line);border-radius:22px;max-width:480px;width:calc(100% - 28px);max-height:85svh;padding:24px;overflow:auto}dialog::backdrop{background:#0005;backdrop-filter:blur(3px)}.dialog-head{display:flex;justify-content:space-between;align-items:center;gap:15px;position:sticky;top:-24px;background:var(--paper);padding:8px 0;z-index:2}.dialog-head h2{font-size:23px;font-weight:450;letter-spacing:-.5px;margin:0}h3{font-size:17px;font-weight:500;margin:0}.muted{font-size:14px;color:var(--muted);line-height:1.6}.chapter-card{padding:23px 0;border-bottom:1px solid var(--line)}.chapter-heading{display:flex;gap:16px;align-items:center}.chapter-heading>span{font-size:24px;color:var(--muted);font-weight:300}.chapter-heading p{font-size:13px;color:var(--muted);margin:4px 0 0}.level-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin-top:18px}.level-grid button{padding:8px;font-size:14px;aspect-ratio:1.2;min-height:44px}.level-grid .done{background:var(--soft)}.level-grid .current{border-color:var(--ink)}.level-grid svg{width:17px;height:17px}.mastery{margin-top:12px;display:flex;align-items:center;gap:8px;font-size:12px;width:100%;justify-content:center;padding:8px;border:0}.mastery svg{width:16px;height:16px}.result{text-align:center;padding:12px 0}.result-icon svg{height:62px;width:62px;fill:none;stroke:var(--ink);stroke-width:1.2}.result h3{font-size:26px;font-weight:400;letter-spacing:-.8px;margin:15px 0 8px}.result p{font-size:14px;color:var(--muted)}.result-stats{display:flex;justify-content:center;gap:34px;margin:30px 0}.result-stats div{display:flex;flex-direction:column;gap:7px}.result-stats strong{font-size:26px;font-weight:400}.result-stats span{font-size:12px;color:var(--muted)}.primary{background:var(--ink);color:var(--paper);border-color:var(--ink)}.primary:hover:not(:disabled){background:var(--ink);opacity:.85}.wide{width:100%;margin-top:10px}.text-button{border:0;font-size:14px;margin-top:12px}.setting{display:flex;justify-content:space-between;align-items:center;padding:14px 0;border-bottom:1px solid var(--line);font-size:16px}.setting button{min-width:66px;font-size:14px}.setting button[aria-pressed=true]{background:var(--ink);color:var(--paper)}.help{padding-left:22px}.help li{padding:10px 0;font-size:16px;line-height:1.6}.help strong{font-weight:500}@media(max-width:600px){.shell{padding:18px 20px 12px}main{margin-top:24px}.brand{font-size:23px}.board-wrap{max-height:53svh;max-width:calc(53svh * 6 / 7)}.tools{margin-top:14px}footer{margin-top:10px}h1{font-size:27px}.message{margin-top:13px}.quiet-button{padding:8px 5px}.icon-button{padding:8px}header nav{gap:1px}}@media(max-height:740px){main{margin-top:16px}.board-wrap{max-height:45svh;max-width:calc(45svh * 6 / 7)}.message{margin:10px 0 5px;min-height:38px}.tools{margin-top:9px}footer{margin-top:3px}}@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

.joint{fill:var(--paper);stroke:var(--ink);stroke-width:2.5}

.hearts{display:flex;align-items:center;gap:6px;min-height:35px;padding-bottom:5px}.hearts svg{width:23px;height:25px;stroke:var(--ink);stroke-width:1.5;stroke-linejoin:round}.hearts .full svg{fill:var(--ink)}.hearts .empty svg{fill:none;stroke:var(--line)}.practice{font-size:12px;color:var(--muted);letter-spacing:.3px}.result-stats strong{font-size:23px}

.clear-ring{fill:none;stroke:var(--ink);stroke-width:1.5}.joint{fill:var(--paper);stroke:var(--ink);stroke-width:2}