@import "https://fonts.googleapis.com/css2?family=Pixelify+Sans:wght@500;600&display=swap";
.nb-desk{--ink:#2c2016;--ink2:#4a3b2e;--paper:#fffaf1;--accent:#a85c36;--pix:"Pixelify Sans", ui-monospace, monospace;background:radial-gradient(70% 40% at 50% 0,#7d5236 0 38%,#6f462c 38% 62%,#0000 62%),repeating-linear-gradient(#5c3a24 0 46px,#52331f 46px 48px);padding:34px 24px 90px;overflow-x:clip}body:has(.nb-desk){background:#5c3a24}.js-sheet{color:#3a2d22;background-color:var(--paper);max-width:1000px;box-shadow:0 0 0 3px var(--ink), 10px 12px 0 3px #00000059;background-image:radial-gradient(#2c201609 1px,#0000 1px);background-size:5px 5px;margin:0 auto;padding:56px 170px 110px 112px;font:400 18px/1.75 Karla,system-ui,sans-serif;position:relative}.js-sheet:before{content:"";background:#e2aaa0;width:2px;position:absolute;top:0;bottom:0;left:76px}.js-sheet h1,.js-sheet h2{color:var(--ink);letter-spacing:-.01em;font-family:Fredoka,system-ui,sans-serif;font-weight:700}.js-sheet h1{margin:6px 0 16px;font-size:clamp(38px,5vw,56px);line-height:1.04}.js-sheet p{max-width:64ch;margin:0 0 1.15em}.nb-dek{color:var(--ink);font-size:21px;line-height:1.55}.nb-scrawl{color:var(--accent);font:600 27px/1 Caveat,cursive;display:inline-block;transform:rotate(-2deg)}.nb-ink{color:#bda98c}.nb-ink.done{color:inherit}.nb-w{white-space:nowrap}.nb-l{color:#bda98c;transition:color 80ms step-end}.nb-l.on{color:var(--ink)}.js-list{gap:26px;margin:34px 0 44px;padding:0;list-style:none;display:grid}.js-item a{color:inherit;grid-template-columns:200px 1fr;align-items:start;gap:24px;text-decoration:none;display:grid}.js-thumb{box-shadow:0 0 0 3px var(--ink), 4px 5px 0 3px #2c201624;background:#fff;padding:7px 7px 20px;transition:transform .12s steps(2,end);display:block;position:relative;transform:rotate(-1.4deg)}.js-item:nth-child(2n) .js-thumb{transform:rotate(1.2deg)}.js-thumb:before{content:"";background:#d6be96d9;width:64px;height:18px;margin-left:-32px;position:absolute;top:-10px;left:50%;transform:rotate(-3deg)}.js-thumb img{aspect-ratio:1;object-fit:cover;width:100%;display:block}.js-item a:hover .js-thumb{transform:rotate(0)translateY(-3px)}.js-tag{color:var(--accent);font:600 21px/1.1 Caveat,cursive;display:block}.js-item h2{margin:2px 0 8px;font-size:30px;line-height:1.12}.js-item a:hover h2{text-underline-offset:5px;text-decoration:underline;text-decoration-thickness:3px}.js-item p{margin:0 0 8px;font-size:18px}.js-meta{font:500 12.5px/1.4 var(--pix);color:var(--ink2);text-transform:lowercase;letter-spacing:.02em;display:block}.js-item+.js-item{border-top:2px dashed #2c201629;padding-top:26px}.js-yourturn{max-width:520px;box-shadow:0 0 0 3px var(--ink), 4px 5px 0 3px #2c201629;background:#f3dc8f;justify-items:start;gap:6px;padding:20px 22px 22px;display:grid;transform:rotate(-.8deg)}.js-yourturn b{color:var(--ink);font:700 24px/1.2 Fredoka,system-ui,sans-serif}.js-yourturn span{margin-bottom:8px;font-size:17px}.js-back{color:var(--accent);margin-bottom:18px;font:600 22px/1 Caveat,cursive;text-decoration:none;display:inline-block}.js-back:hover{text-decoration:underline}.js-article h2{margin:1.6em 0 .45em;font-size:28px;line-height:1.2}.js-lead{color:var(--ink);font-size:20px}.nb-photo{box-shadow:0 0 0 3px var(--ink), 5px 6px 0 3px #2c201629;background:#fff;max-width:720px;margin:26px 0 30px;padding:9px 9px 26px;display:block;position:relative;transform:rotate(-1.2deg)}.nb-photo img{width:100%;height:auto;display:block}.nb-photo:before,.nb-photo:after{content:"";background:#d6be96d9;width:80px;height:22px;position:absolute;top:-12px}.nb-photo:before{left:16px;transform:rotate(-6deg)}.nb-photo:after{right:16px;transform:rotate(5deg)}.nb-photo figcaption{color:var(--ink2);font:600 18px/1 Caveat,cursive;position:absolute;bottom:3px;left:12px}.js-gallery{grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:22px;margin:26px 0 30px;display:grid}.js-gallery .nb-photo{margin:0}.js-gallery .nb-photo:nth-child(2n){transform:rotate(1.2deg)}.nb-notes{color:var(--ink);border-block:2px dashed #2c201629;flex-wrap:wrap;gap:4px 28px;margin:0 0 28px;padding:14px 0;font:600 23px/30px Caveat,cursive;list-style:none;display:flex}.nb-notes span{color:var(--accent);margin-right:8px}.nb-sticky{box-shadow:0 0 0 3px var(--ink), 4px 5px 0 3px #2c201629;background:#f3dc8f;max-width:440px;margin:30px 0 34px;padding:18px 20px 16px;transform:rotate(1.4deg)}.nb-sticky p{color:var(--ink);margin:0 0 8px;font:600 26px/1.15 Caveat,cursive}.nb-sticky cite{font:500 13px/1 var(--pix);color:var(--ink2);font-style:normal}.nb-btn{color:#fff8ee;background:var(--accent);box-shadow:0 0 0 3px var(--ink), 0 5px 0 3px var(--ink);padding:14px 20px;font:700 16px/1 Karla,system-ui,sans-serif;text-decoration:none;transition:transform .1s steps(2,end),box-shadow .1s steps(2,end);display:inline-block}.nb-btn:hover{box-shadow:0 0 0 3px var(--ink), 0 3px 0 3px var(--ink);transform:translateY(2px)}.js-more{border-top:2px dashed #2c201629;grid-template-columns:1fr 1fr;gap:18px;margin-top:48px;padding-top:24px;display:grid}.js-more a{color:inherit;text-decoration:none}.js-more a span{color:var(--accent);font:600 20px/1 Caveat,cursive;display:block}.js-more a b{color:var(--ink);font:700 20px/1.2 Fredoka,system-ui,sans-serif}.js-more a:hover b{text-underline-offset:4px;text-decoration:underline}.js-more .next{text-align:right;grid-column:2}.js-ledge{pointer-events:none;width:100px;height:8px;box-shadow:0 0 0 2px var(--ink);background:linear-gradient(#d6a576 0 2px,#b07b52 2px 6px,#7a4b2f 6px 8px);position:absolute;right:12px}.js-ledge:before,.js-ledge:after{content:"";width:6px;height:12px;box-shadow:0 0 0 2px var(--ink);clip-path:polygon(0 0,100% 0,100% 100%);background:#7a4b2f;position:absolute;top:10px}.js-ledge:before{left:14px}.js-ledge:after{right:14px}.js-cat{z-index:3;image-rendering:pixelated;cursor:pointer;max-width:none;position:absolute;top:0;left:0}.js-bubble{z-index:4;pointer-events:none;white-space:nowrap;font:500 14px/1.1 var(--pix);color:var(--ink);background:var(--paper);box-shadow:0 -3px 0 0 var(--ink), 0 3px 0 0 var(--ink), -3px 0 0 0 var(--ink), 3px 0 0 0 var(--ink);opacity:0;padding:6px 9px 5px;transition:opacity .12s steps(2,end);position:absolute;top:0;left:0}.js-bubble.on{opacity:1}.js-pencil{z-index:3;pointer-events:none;opacity:0;width:0;height:0;transition:opacity .2s steps(2,end);position:absolute;top:0;left:0}.js-pencil.on{opacity:1}.js-pencil:before{content:"";transform-origin:0;background:linear-gradient(90deg,#2c2016 0 4px,#e8c9a0 4px 10px,#d69d38 10px 34px,#b8b0a0 34px 37px,#e39b9b 37px);width:44px;height:7px;position:absolute;top:0;left:0;transform:rotate(-38deg);box-shadow:0 0 0 1px #2c2016}.js-ribbon{clip-path:polygon(0 0,100% 0,100% 100%,50% 84%,0 100%);pointer-events:none;background:#b5463e;width:14px;height:80px;position:absolute;bottom:-58px;right:120px;box-shadow:2px 0 #8e3029}@media (max-width:879px){.nb-desk{padding:20px 10px 72px}.js-sheet{padding:30px 18px 60px 34px;font-size:17px}.js-sheet:before{left:22px}.js-sheet h1{padding-right:58px}.js-ledge{width:72px;right:20px}.js-item a{grid-template-columns:96px 1fr;gap:14px}.js-thumb{padding:5px 5px 14px}.js-thumb:before{width:44px;height:14px;margin-left:-22px}.js-item h2{font-size:22px}.js-item p{font-size:16px}.nb-dek{font-size:19px}.js-article h2{font-size:24px}.js-more{grid-template-columns:1fr}.js-more .next{text-align:left;grid-column:1}.js-ribbon{right:40px}}@media (prefers-reduced-motion:reduce){.js-thumb,.nb-btn,.js-bubble,.js-pencil{transition:none}}