@font-face{font-family:Caveat;src:url('fonts/caveat.ttf') format('truetype');font-weight:400 700;font-display:swap}
@font-face{font-family:Nunito;src:url('fonts/nunito.ttf') format('truetype');font-weight:400 600;font-display:swap}
@font-face{font-family:Nunito;src:url('fonts/nunito-bold.ttf') format('truetype');font-weight:700 900;font-display:swap}
:root{--bg:#f7f5ef;--paper:#fffef9;--ink:#393d42;--muted:#83847d;--blue:#566f99;--blue-dark:#3b557b;--line:#c8cdd1;--green:#779578;--hand:Caveat,'Comic Sans MS',cursive;--sans:Nunito,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}
*{box-sizing:border-box}body{margin:0;background-color:var(--bg);background-image:radial-gradient(#b7b3a726 .75px,transparent .75px);background-size:9px 9px;color:var(--ink);font-family:var(--sans);font-size:15px;-webkit-font-smoothing:antialiased}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}button:disabled{cursor:default;opacity:.32}button,a{touch-action:manipulation}button:focus-visible,a:focus-visible{outline:3px solid #c48e40;outline-offset:4px}svg{width:21px;height:21px;display:block;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round}button{border:0;background:none}a{color:inherit;text-decoration:none}.site-header{height:97px;max-width:1240px;margin:auto;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #ddded4;padding:0 7px}.brand{display:flex;align-items:center;gap:10px;font-family:var(--hand);font-size:43px;line-height:1;font-weight:600;letter-spacing:-1.5px;transform:rotate(-2deg)}.brand-mark{font:43px Georgia,serif;color:var(--blue);transform:rotate(-7deg);margin-right:2px}.brand-dot{color:#c5985d;margin-left:-9px}.site-header nav{display:flex;gap:9px;margin-left:-47px}.nav-button{font-size:14px;padding:9px 18px;border-radius:7px;transition:background .15s}.nav-button:hover{background:#eae9e0}.nav-button.active{background:#e9ede8;color:#4e675b;font-weight:700}.nav-button span{font-size:12px;color:#7e837f;margin-left:5px}.header-actions{display:flex;gap:12px}.icon-button{width:38px;height:38px;display:inline-flex;justify-content:center;align-items:center;border-radius:50%;color:#6d746f}.icon-button:hover:not(:disabled){background:#e9eadf;color:var(--blue-dark)}.header-actions .icon-button{border:1px solid #dcdfd7}.intro{text-align:center;margin:30px auto 43px}.intro h1{font-family:var(--hand);font-size:38px;font-weight:600;line-height:1.2;margin:0 0 6px}.intro p{font-size:13px;color:var(--muted);margin:0;letter-spacing:.12px}.workspace{max-width:1180px;margin:0 auto;display:grid;grid-template-columns:228px minmax(0,570px) 225px;gap:44px;align-items:start}.notebook-nav{padding-top:7px}.section-label{font-size:10px;letter-spacing:1.5px;font-weight:800;color:#7c827a;display:flex;align-items:center;justify-content:space-between;margin:0 0 19px}.section-label>span{letter-spacing:0;font-size:11px;font-weight:400;color:#93968b}.chapters{display:flex;flex-direction:column;gap:9px}.chapter{display:flex;align-items:center;width:100%;padding:12px 12px;text-align:left;border:1px solid transparent;border-radius:7px;gap:11px;transition:.18s}.chapter.selected{background:#e9ede4;border-color:#dbe1d2;box-shadow:0 2px 0 #dfe3d6}.chapter:hover{background:#eff0e8}.chapter-index{height:28px;min-width:28px;border:1px solid #d3d8ce;border-radius:5px;display:grid;place-items:center;font-family:var(--hand);font-size:23px;color:#6c8067}.chapter.selected .chapter-index{background:#7e9274;color:#fffef7;border-color:#7e9274}.chapter strong{font-size:13px;display:block;font-weight:700;line-height:1.3}.chapter small{display:block;font-size:11px;color:#8a8f81;margin-top:4px}.level-picker{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin:23px 9px 0}.level-button{position:relative;aspect-ratio:1;border:1px solid #dadbd2;border-radius:7px;background:#fdfcf7;color:#8d9388;font-family:var(--hand);font-size:25px}.level-button.active{background:#fffdf7;color:var(--blue-dark);border-color:#7788a0;box-shadow:0 0 0 2px #9ba9bc25;transform:rotate(-3deg)}.level-button.done{color:#758a6d}.level-button.done:after{content:'✓';position:absolute;right:2px;top:-2px;font:11px var(--sans)}.level-button:hover{border-color:var(--blue)}.sidebar-note{text-align:center;margin:29px 0 27px;color:#929887;transform:rotate(-5deg)}.handwritten{font:25px/1.05 var(--hand)}.note-swoosh{display:block;font:37px var(--hand);text-align:right;margin:-8px 37px 0 0;transform:rotate(40deg)}.collection-summary{border-top:1px dashed #d2d4c8;padding:23px 11px 0}.collection-top{display:flex;gap:12px;align-items:center}.collection-top strong{display:block;font-size:14px;font-weight:700;color:#68745f}.collection-top span:not(.mini-picture){font-size:11px;color:#8b9183;display:block;margin-top:3px}.mini-picture{display:block;width:40px;height:40px}.pixel-art{display:grid;grid-template-columns:repeat(var(--art-size),1fr);width:100%;height:100%;transform:rotate(-4deg);gap:1px}.pixel-art i{background:transparent}.pixel-art i.on{background:var(--art-color)}.pixel-art.faded{opacity:.2}.collection-meter{display:flex;gap:4px;margin:17px 0 12px}.collection-meter i{height:5px;flex:1;background:#e3e4d9;border-radius:2px}.collection-meter i.done{background:#8c9b7c}.text-button{font-size:12px;padding:6px 0;color:#818979;line-height:1.4}.text-button:hover{color:var(--blue-dark)}.text-button>span{margin-left:8px}.game-column{min-width:0}.paper{position:relative;background-color:var(--paper);border:1px solid #e8e7dd;border-radius:3px 5px 5px 3px;box-shadow:0 12px 25px -19px #62593680,2px 4px 0 -1px #fefcf5,3px 5px 0 -1px #dedfd4,5px 8px 0 -2px #fbfaf2,6px 9px 0 -2px #e0dfd2;padding:26px 35px 16px 44px;min-height:574px}.paper:before{content:'';position:absolute;top:0;bottom:0;left:25px;border-left:1px solid #e8b8b636;pointer-events:none}.tape{position:absolute;top:-14px;left:50%;transform:translateX(-50%) rotate(-4deg);height:27px;width:124px;background:repeating-linear-gradient(90deg,#d5b57818 0px,#d5b57818 1px,transparent 1px,transparent 3px),#dcc8946b;border-left:2px dotted #fffaf048;border-right:2px dotted #fffaf048;z-index:1}.punches{position:absolute;left:9px;top:48px;bottom:46px;display:flex;flex-direction:column;justify-content:space-between}.punches i{width:8px;height:8px;border-radius:50%;background:#e2e0d5;box-shadow:inset 0 1px 2px #948e7859,0 1px 1px #fff}.paper-heading{display:flex;align-items:center;justify-content:space-between}.paper-eyebrow{font-size:9px;letter-spacing:1.9px;color:#94978a;font-weight:700}.paper-heading h2{font-family:var(--hand);font-size:31px;font-weight:600;margin:3px 0 0;line-height:1.12}.size-label{color:#8a9084;border:1px solid #e5e6dc;border-radius:5px;padding:5px 9px;white-space:nowrap;font-size:12px}.board-wrapper{display:flex;justify-content:center;margin:12px -4px 0;min-height:327px;align-items:center}.puzzle{--cell:51px;--n:5;--clue:61px;display:grid;grid-template-columns:var(--clue) calc(var(--cell)*var(--n));grid-template-rows:var(--clue) calc(var(--cell)*var(--n));color:#565c62;user-select:none;-webkit-user-select:none}.clue-corner{color:#c1c5bd;font:27px/.7 var(--hand);align-self:end;text-align:right;padding:0 15px 16px 0}.column-clues{display:grid;grid-template-columns:repeat(var(--n),1fr);align-items:end;padding-bottom:9px}.row-clues{display:grid;grid-template-rows:repeat(var(--n),1fr);padding-right:12px}.column-clue{display:flex;flex-direction:column;align-items:center;justify-content:end;gap:0;line-height:21px}.row-clue{display:flex;justify-content:flex-end;align-items:center;gap:7px;line-height:1}.column-clue,.row-clue{font-family:var(--hand);font-size:27px;font-weight:600;transition:color .15s}.column-clue.complete,.row-clue.complete{color:#9fac96}.column-clue.highlight,.row-clue.highlight{color:var(--blue)}.grid{display:grid;grid-template-columns:repeat(var(--n),1fr);grid-template-rows:repeat(var(--n),1fr);border:1.7px solid #929daa;box-shadow:1px 2px 0 #9a9e9926;touch-action:none;position:relative}.cell{border-radius:0;position:relative;background:#fdfdfa;border:0;border-right:1px solid #b4bcc5b0;border-bottom:1px solid #b4bcc5b0;padding:0;min-width:0;min-height:0;touch-action:none;cursor:crosshair}.cell.last-column{border-right:0}.cell.last-row{border-bottom:0}/* Pencil fill uses individual uneven strokes instead of a solid rectangle. */
.cell.major-column{border-right:2.5px solid #7e8c9d}
.cell.major-row{border-bottom:2.5px solid #7e8c9d}
.cell .cell-ink{position:absolute;inset:1px;width:calc(100% - 2px);height:calc(100% - 2px);fill:none;stroke:currentColor;color:var(--blue);stroke-linecap:round;stroke-linejoin:round;pointer-events:none;opacity:0;transform:scale(.93) rotate(var(--ink-tilt,0deg));transition:opacity .12s,transform .15s}
.cell.filled .cell-ink{opacity:1;transform:scale(1) rotate(var(--ink-tilt,0deg))}
.cell.crossed:after{content:'×';position:absolute;inset:0;display:grid;place-items:center;font:32px/1 var(--hand);color:#a3aaa9;pointer-events:none}.cell:hover{background:#e9edf1}.cell:focus-visible{outline:2px solid #b78d49;outline-offset:-4px;z-index:1}.cell.hinted{animation:hintpulse 1s 2}.grid.solved .cell{border-color:transparent;background:transparent}.grid.solved{border-color:transparent;box-shadow:none}.grid.solved .cell .cell-ink{color:var(--picture-color)}.grid.solved .cell.crossed:after{opacity:0}.board-caption{font:22px/1.2 var(--hand);color:#969b8b;text-align:center;margin:15px 0 20px;min-height:27px}.tool-row{display:flex;justify-content:center;align-items:center;gap:14px}.drawing-tools{display:flex;padding:4px;border:1px solid #e2e5dd;background:#f1f3ee;border-radius:8px;gap:3px}.tool{height:36px;display:flex;gap:7px;align-items:center;border-radius:5px;padding:0 11px;font-size:12px;color:#879083}.tool span[data-icon]{display:flex}.tool.selected{background:#fffef9;box-shadow:0 1px 4px #404a4020;color:var(--blue-dark)}.tool:hover{color:var(--blue-dark)}.tool svg{width:17px;height:17px}.tool-eraser{padding:0 10px}.undo{width:32px;height:32px}.paper-bottom{display:flex;align-items:center;justify-content:space-between;margin-top:19px;border-top:1px dashed #e0e2d8;padding:10px 0 0}.hint-button{font-size:12px;color:#9d8b5c;display:flex;align-items:center;gap:7px;padding:5px 0}.hint-button:hover{color:#766230}.hint-button svg{width:17px;height:17px}.restart{width:28px;height:28px;color:#a5aa9d}.restart svg{width:16px;height:16px}.under-paper{display:flex;align-items:center;gap:6px;color:#aaaD9f;font-size:10px;margin:19px 2px 0}.tiny-square{width:5px;height:5px;border-radius:1px;border:1px solid #aab4a0;transform:rotate(-8deg)}.page-number{margin-left:auto;font-family:var(--hand);font-size:17px}.right-sidebar{padding-top:29px}.howto-note{position:relative;transform:rotate(2deg);background:#f1ecd5;padding:20px 23px 16px;box-shadow:2px 4px 5px #7669450a;border-radius:1px 3px 22px 1px}.note-pin{position:absolute;width:57px;height:19px;background:#e3e3ca80;left:calc(50% - 28px);top:-9px;transform:rotate(-9deg);border:1px solid #e6e4c855}.howto-note h2{font:32px var(--hand);margin:0 0 10px;color:#797453;transform:rotate(-2deg)}.howto-note p{font-size:12px;line-height:1.65;color:#8f8a70;margin:8px 0 12px}.example{display:flex;align-items:center;gap:12px;margin:12px 0 20px}.example>strong{font:25px var(--hand);color:#7b7964;white-space:nowrap;width:24px}.example-cells{display:flex}.example-cells i{display:grid;place-items:center;width:22px;height:23px;border:1px solid #bdbba499;border-right:0;font:24px/1 var(--hand);font-style:normal;color:#aba891}.example-cells i:last-child{border-right:1px solid #bdbba499}.example-cells i.painted{background:repeating-linear-gradient(135deg,#ffffff0f 0,#ffffff0f 1px,transparent 1px,transparent 3px),#8c947a;box-shadow:inset 2px 2px #f1ecd5,inset -2px -2px #f1ecd5}.note-footer{font:22px/1.1 var(--hand);color:#8f8b6a;border-top:1px dashed #d6d0b7;padding-top:12px;transform:rotate(-2deg)}.note-footer span{display:block;text-align:right;font-size:33px;line-height:.9;margin-right:7px}.zen-note{text-align:center;margin:32px 0 18px;color:#939d89}.zen-icon{font-size:32px;font-weight:400;color:#a4ae95;display:inline-block;transform:rotate(15deg)}.zen-note p{font:23px/1.2 var(--hand);margin:10px 0 0;transform:rotate(-3deg)}.controls-help{font-size:10px;text-align:center;width:100%;color:#979e8e}.site-footer{max-width:1180px;margin:37px auto 24px;display:flex;justify-content:center;align-items:center;gap:12px;color:#a5aa9d;font-size:10px}.footer-rule{height:1px;width:23px;background:#cdd0c3}.toast{position:fixed;left:50%;bottom:25px;transform:translate(-50%,15px);padding:12px 21px;border-radius:9px;background:#4f624f;color:#fffef8;box-shadow:0 5px 18px #2e3a322b;opacity:0;pointer-events:none;transition:.2s;z-index:20;font-size:14px;text-align:center;max-width:min(90vw,510px);width:max-content}.toast.visible{opacity:1;transform:translate(-50%,0)}.modal{border:1px solid #e0e1d3;border-radius:12px;background:#fffef7;color:var(--ink);padding:38px;max-width:530px;width:calc(100% - 32px);box-shadow:0 22px 80px #3d47352b;max-height:90dvh;overflow:auto}.modal::backdrop{background:#484b3c55;backdrop-filter:blur(5px)}.modal h2{font:38px/1.1 var(--hand);margin:10px 0 18px}.modal p{font-size:14px;line-height:1.65;color:#7a8173}.modal-kicker{font-size:9px;letter-spacing:1.7px;color:#999e8b;font-weight:700}.modal-close{position:absolute;top:10px;right:10px}.primary-button{display:flex;align-items:center;justify-content:center;gap:20px;background:#728769;color:#fffef5;border-radius:7px;min-height:44px;padding:12px 20px;font-weight:700;font-size:13px;margin-top:23px;width:100%;transition:background .2s}.primary-button:hover{background:#5c7554}.help-shortcuts{display:grid;grid-template-columns:1fr 1fr;gap:13px;margin:24px 0;font-size:12px;color:#7b846f}.help-shortcuts>span{display:flex;align-items:center;gap:9px}kbd{font:11px var(--sans);padding:4px 7px;border:1px solid #dce0d2;border-bottom-width:2px;border-radius:4px;color:#6e7b62;white-space:nowrap}.help-small{font-size:12px!important}.collection-modal{max-width:660px}.gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:24px}.gallery-item{border:1px solid #e5e7d9;border-radius:8px;padding:17px 8px 11px;background:#f8f9f1;display:flex;align-items:center;flex-direction:column;min-width:0}.gallery-item:hover{border-color:#859579}.gallery-art{height:66px;width:66px;display:grid;place-items:center;margin:3px 0 13px}.gallery-question{font:49px var(--hand);color:#c2c7b8}.gallery-title{font-size:11px;color:#7e8774}.gallery-label{font-size:9px;margin-top:4px;color:#a0a796}.win-modal{text-align:center;max-width:420px}.win-art{width:145px;height:145px;margin:32px auto 23px;padding:12px}.win-art .pixel-art{gap:3px;animation:reveal .7s ease both}.win-modal h2{margin-bottom:8px}.win-modal p{margin:0 auto 18px}.win-stamp{display:inline-block;color:#8c9f79;border:1px solid #a6b293;border-radius:3px;transform:rotate(-5deg);padding:5px 13px;font:21px var(--hand)}.win-modal>.text-button{margin-top:12px}.reset-modal{max-width:400px;text-align:center}.reset-modal>.text-button{margin-top:12px}.confetti{position:fixed;width:7px;height:10px;pointer-events:none;z-index:30;top:-20px;animation:confetti-fall 2.5s ease-in forwards}
@keyframes hintpulse{50%{background:#e2d9ae}}@keyframes reveal{from{opacity:0;transform:scale(.6) rotate(-13deg)}to{opacity:1;transform:scale(1) rotate(-4deg)}}@keyframes confetti-fall{to{transform:translateY(105vh) rotate(440deg);opacity:0}}
@media(min-width:1450px){.site-header{height:110px}.intro{margin-top:41px;margin-bottom:48px}.workspace{gap:53px;max-width:1230px;grid-template-columns:238px minmax(0,590px) 236px}.paper{padding-top:31px;padding-bottom:20px}.board-wrapper{min-height:352px}.site-footer{margin-top:46px}}
@media(max-width:1199px){.site-header{margin:0 30px}.workspace{gap:25px;padding:0 30px;grid-template-columns:190px minmax(0,1fr) 195px}.paper{padding:24px 22px 14px 32px}.howto-note{padding:20px 17px 16px}.example{gap:7px}.example-cells i{width:20px}.paper-heading h2{font-size:28px}.section-label{font-size:9px}.section-label>span{font-size:10px}.chapter{padding:11px 7px;gap:8px}.chapter strong{font-size:12px}}
@media(max-width:1020px){.workspace{max-width:850px;grid-template-columns:190px minmax(0,1fr);gap:33px}.right-sidebar{display:none}.intro{margin-bottom:36px}.site-header{max-width:820px;margin:0 auto;padding:0 20px}.paper{padding-left:44px;padding-right:35px}}
@media(max-width:680px){.site-header{height:76px;margin:0 19px;padding:0}.brand{font-size:34px;gap:6px}.brand-mark{font-size:34px}.site-header nav{margin:0}.nav-button{padding:9px 8px;font-size:12px}.nav-button.active{display:none}.nav-button span{font-size:10px;display:block;margin:0}.header-actions{gap:3px}.header-actions .icon-button{width:31px;height:31px;border:0}.header-actions svg{width:20px;height:20px}.intro{margin:22px 13px 24px}.intro h1{font-size:31px}.intro p{font-size:10px}.workspace{display:flex;flex-direction:column;gap:0;padding:0 19px;max-width:500px}.notebook-nav{width:100%;padding:0;margin-bottom:29px;display:flex;flex-wrap:wrap;align-items:center;gap:12px;justify-content:space-between}.section-label,.sidebar-note,.collection-summary{display:none}.chapters{flex-direction:row;gap:5px;width:100%;justify-content:space-between}.chapter{padding:9px 8px;gap:5px;width:auto;flex:1;justify-content:center}.chapter-index{width:24px;min-width:24px;height:24px;font-size:20px}.chapter strong{font-size:10px;line-height:1.3;max-width:78px}.chapter small{display:none}.level-picker{width:100%;margin:0;gap:10px;display:flex;justify-content:center}.level-button{width:38px;height:33px;font-size:22px}.game-column{width:100%}.paper{padding:24px 20px 12px 30px;min-height:0}.paper-heading h2{font-size:28px}.paper-eyebrow{font-size:8px}.puzzle{--cell:47px;--clue:49px}.column-clue,.row-clue{font-size:25px}.board-wrapper{min-height:294px;margin-top:7px}.board-caption{font-size:21px;margin:12px 0 17px}.paper:before{left:18px}.punches{left:5px}.punches i{width:6px;height:6px}.tool-row{gap:7px}.tool{padding:0 9px;font-size:11px}.paper-bottom{margin-top:15px}.under-paper{font-size:9px;margin-top:15px}.site-footer{font-size:9px;gap:8px;margin-top:26px}.gallery{grid-template-columns:repeat(3,1fr);gap:10px}.modal{padding:32px 24px}.gallery-art{width:58px;height:58px}.modal h2{font-size:34px}.gallery-title{font-size:10px}}
@media(max-width:370px){.workspace{padding:0 12px}.site-header{margin:0 12px}.header-actions{gap:0}.brand{font-size:30px}.brand-mark{font-size:29px}.intro h1{font-size:28px}.paper{padding-right:13px;padding-left:25px}.puzzle{--cell:42px;--clue:43px}.chapter{padding:8px 5px}.chapter-index{display:none}.chapter strong{max-width:none}.tool{padding:0 7px}.board-wrapper{min-height:272px}.help-shortcuts{grid-template-columns:1fr}.gallery{grid-template-columns:repeat(2,1fr)}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}.confetti{display:none}}

/* Additional chapters remain compact on a small screen. */
.collection-meter{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:4px}
@media(max-width:680px){.chapters{overflow-x:auto;justify-content:flex-start;scroll-snap-type:x proximity;scrollbar-width:thin;padding-bottom:5px}.chapter{flex:0 0 123px;scroll-snap-align:center}.chapter strong{max-width:84px}}

/* A solved silhouette turns into a pencil illustration in the same position. */
.win-art{width:min(228px,63vw);height:auto;aspect-ratio:1;padding:13px;margin:23px auto 17px}
.reveal-stage{position:relative;width:100%;height:100%;transform:rotate(-4deg)}
.reveal-pixels,.illustration-frame{position:absolute;inset:0;display:block}
.win-art .pixel-art{transform:none;animation:none;gap:2px}
.illustration-crop{position:absolute;display:block;overflow:hidden}
.reward-illustration{position:absolute;display:block;max-width:none;object-fit:fill;user-select:none;-webkit-user-drag:none}
.reveal-pixels{opacity:1;filter:blur(0);transition:opacity 1.1s ease,filter 1.1s ease;pointer-events:none}
.reveal-drawing{opacity:0;filter:blur(2px);transition:opacity 1.15s ease .08s,filter 1.1s ease .08s;pointer-events:none}
.reveal-stage[data-view="illustration"] .reveal-pixels{opacity:0;filter:blur(2px)}
.reveal-stage[data-view="illustration"] .reveal-drawing{opacity:1;filter:blur(0)}
.art-switch{display:flex;width:max-content;max-width:100%;gap:3px;padding:3px;margin:0 auto;border:1px solid #e2e5d9;border-radius:7px;background:#f0f2e9}
.art-switch button{border-radius:4px;padding:6px 15px;font-size:12px;color:#8d9680;min-height:32px}
.art-switch button[aria-pressed="true"]{background:#fffef8;color:#6b805e;box-shadow:0 1px 3px #40504018}
.art-switch button:hover:not(:disabled){color:#4f6645}
.art-status{font:19px/1.2 var(--hand);color:#8c9d79;min-height:23px;margin:9px 0 0}
.win-modal .art-status+h2{margin-top:8px}
.collection-modal>.art-switch{margin:17px 0 0}
.gallery-art{position:relative}
.gallery-drawn{transform:rotate(-4deg)}
@media(prefers-reduced-motion:reduce){.reveal-pixels,.reveal-drawing{transition:none;filter:none!important}}
