@font-face{font-family:Luckiest Guy;src:url(shared/assets/fonts/LuckiestGuy.3877b522.woff2) format("woff2");font-display:swap}@font-face{font-family:Gochi Hand;src:url(shared/assets/fonts/GochiHand.8851738d.woff2) format("woff2");font-display:swap}:root{--paper: #f3ead7;--cream: #fbf5e6;--ink: #2b2420;--red: #e0533d;--mustard: #f2b33d;--teal: #2e9c8e;--navy: #253c5a;--sky: #8cc7d9;--pink: #f2a39c;--kraft: #c99a67;--green: #6ea551;--lilac: #b6a1d8;--shadow: 0 2px 0 rgba(52,34,18,.1), 4px 9px 18px rgba(52,34,18,.28);--display: "Luckiest Guy", "Arial Black", Impact, sans-serif;--hand: "Gochi Hand", "Comic Sans MS", "Chalkboard SE", cursive;--gut: max(16px, env(safe-area-inset-left), env(safe-area-inset-right));--grain: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .32 0 0 0 0 .22 0 0 0 0 .12 0 0 0 .55 0'/%3E%3C/filter%3E%3Crect width='220' height='220' filter='url(%23n)' opacity='.55'/%3E%3C/svg%3E");--fibres: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='600' height='600'%3E%3Cfilter id='f'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.012 .09' numOctaves='2' seed='7'/%3E%3CfeColorMatrix values='0 0 0 0 .45 0 0 0 0 .33 0 0 0 0 .2 0 0 0 .35 -.08'/%3E%3C/filter%3E%3Crect width='600' height='600' filter='url(%23f)'/%3E%3C/svg%3E")}*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{margin:0;min-height:100vh;min-height:100dvh;color:var(--ink);font:400 clamp(17px,1.05vw + 12px,21px)/1.45 var(--hand);background:var(--kraft) var(--fibres);background-color:#c99a67;background-image:var(--grain),var(--fibres),radial-gradient(ellipse at 50% 0%,#d8ae7c,#c3915d 55%,#a87647);background-attachment:scroll;overflow-x:hidden;padding-top:env(safe-area-inset-top)}a{color:inherit}:focus-visible{outline:4px solid var(--navy);outline-offset:3px;border-radius:4px}.mast{position:relative;max-width:1180px;margin:clamp(18px,4vw,48px) auto 0;padding:clamp(22px,4vw,44px) var(--gut) clamp(26px,4vw,44px);width:calc(100% - 2 * var(--gut));text-align:center;background:var(--cream) var(--grain);box-shadow:var(--shadow);transform:rotate(-.6deg);clip-path:polygon(0 1.2%,7% 0,18% 1.6%,31% .3%,45% 1.4%,58% 0,72% 1.1%,86% .2%,100% 1.5%,99.6% 30%,100% 62%,99.5% 98.2%,88% 100%,74% 98.6%,60% 100%,47% 98.4%,33% 99.8%,19% 98.3%,6% 99.9%,0 98.5%,.4% 60%,0 28%)}.mast:before,.mast:after{content:"";position:absolute;top:-6px;width:130px;height:34px;background:#f2e2b0c7;box-shadow:0 1px 3px #0000001f;background-image:var(--grain)}.mast:before{left:4%;transform:rotate(-7deg)}.mast:after{right:4%;transform:rotate(6deg)}.tape-note{margin:0 0 .4em;font-size:.82em;letter-spacing:.02em;color:#6b5b4b}.ransom{margin:0;line-height:1;font:400 clamp(64px,12vw,150px)/1 var(--display);letter-spacing:.02em;display:flex;justify-content:center;gap:clamp(4px,1vw,12px)}.ransom span{display:inline-block;padding:.08em .16em 0;box-shadow:2px 4px #34221238,4px 10px 16px #3422122e;background-image:var(--grain)}.ransom span:nth-child(1){background-color:var(--red);color:var(--cream);transform:rotate(-6deg) translateY(4px)}.ransom span:nth-child(2){background-color:var(--mustard);color:var(--ink);transform:rotate(4deg);font-size:.86em}.ransom span:nth-child(3){background-color:var(--navy);color:var(--cream);transform:rotate(-3deg) translateY(-6px)}.ransom span:nth-child(4){background-color:var(--teal);color:var(--cream);transform:rotate(7deg) translateY(6px);font-size:.92em}.lede{margin:.8em auto 0;max-width:34em;font-size:clamp(19px,1.3vw + 12px,27px)}main{max-width:1480px;margin:0 auto;padding:clamp(18px,3vw,40px) var(--gut) 24px}.shelf-title{display:table;margin:0 auto clamp(16px,2.5vw,30px);padding:.18em .6em .06em;transform:rotate(1.2deg);font:400 clamp(26px,2.4vw + 10px,42px)/1.1 var(--display);color:var(--cream);letter-spacing:.03em;background:var(--ink) var(--grain);box-shadow:var(--shadow)}.shelf-title small{font:inherit;font-size:.6em;color:var(--mustard)}.cards{list-style:none;margin:0;padding:0;display:grid;gap:clamp(26px,3.2vw,52px);grid-template-columns:repeat(auto-fit,minmax(min(100%,330px),480px));justify-content:center;align-items:start}.card{position:relative;transform:rotate(var(--rot, -1deg));transition:transform .18s ease}.card:nth-child(2n){--rot: 1.1deg}.card:nth-child(3n){--rot: -.4deg}.card article{position:relative;background:var(--cream) var(--grain);box-shadow:var(--shadow);padding:14px 14px 18px;clip-path:polygon(0 .8%,9% 0,23% .9%,38% .1%,52% .8%,67% 0,81% .7%,100% .2%,99.4% 25%,100% 51%,99.5% 77%,100% 99.3%,84% 100%,69% 99.2%,54% 100%,39% 99.3%,24% 100%,9% 99.1%,0 100%,.6% 74%,0 49%,.5% 24%)}@media(hover:hover){.card:hover{transform:rotate(0) translateY(-4px) scale(1.012)}}.card:focus-within{transform:rotate(0)}.photo{position:relative;aspect-ratio:16 / 9;overflow:hidden;background:var(--sky) var(--grain);box-shadow:inset 0 0 0 6px var(--cream),inset 0 0 0 7px #2b24202e}.c1 .photo{background-color:var(--mustard)}.c2 .photo{background-color:var(--pink)}.c3 .photo{background-color:var(--lilac)}.photo img{position:absolute;inset:6px;width:calc(100% - 12px);height:calc(100% - 12px);object-fit:contain}.photo.cover img{object-fit:cover}.photo:after{content:"";position:absolute;top:-4px;left:-18px;width:110px;height:30px;transform:rotate(-24deg);background:#f2e2b0cc var(--grain);box-shadow:0 1px 3px #00000026}.stamp{position:absolute;right:6%;bottom:10%;padding:.1em .45em 0;transform:rotate(-12deg) scale(.6);opacity:0;font:400 clamp(28px,3vw,40px)/1.1 var(--display);letter-spacing:.06em;text-transform:uppercase;color:var(--red);border:5px solid var(--red);border-radius:8px;background:#fbf5e6e6;box-shadow:2px 3px 8px #2b242040;transition:transform .35s cubic-bezier(.3,1.6,.5,1),opacity .2s}.card.all-done .stamp{opacity:1;transform:rotate(-12deg) scale(1)}.body{padding:12px 6px 0}.meta{display:flex;flex-wrap:wrap;gap:6px 8px;margin:0 0 8px;font-size:.78em}.meta span{padding:.05em .55em;background:var(--kraft) var(--grain);color:var(--ink);box-shadow:1px 2px #3422122e}.meta span:nth-child(2){background-color:var(--sky);transform:rotate(-1.5deg)}.meta span:nth-child(3){background-color:var(--mustard);transform:rotate(1.2deg)}.meta span.draft{background-color:var(--red);color:#fbf5e6;text-transform:uppercase;letter-spacing:.06em;transform:rotate(-2deg)}.card h3{margin:0;font:400 clamp(28px,1.6vw + 18px,40px)/1.05 var(--display);letter-spacing:.02em;color:var(--navy)}.card h3 a{text-decoration:none}.card h3 a:after{content:"";position:absolute;inset:0;z-index:1}.sub{margin:.15em 0 .5em;color:#5b4c3f}.steps{list-style:none;margin:0;padding:0;display:grid;gap:7px;counter-reset:s}.step{position:relative;display:grid;grid-template-columns:auto 1fr;column-gap:10px;align-items:baseline;padding:6px 44px 6px 8px;background:#fffaf0 var(--grain);box-shadow:1px 2px #3422121f;border-left:5px solid var(--kraft);line-height:1.15}.step:nth-child(2n){transform:rotate(.35deg)}.step:nth-child(3n){transform:rotate(-.4deg)}.step .n{grid-row:span 2;align-self:center;font:400 1.05em/1 var(--display);color:var(--cream);background:var(--navy);min-width:1.7em;text-align:center;padding:.28em .2em .12em;transform:rotate(-4deg)}.step[data-nostamp] .n{background:var(--kraft)}.step[data-nostamp] .n:before{content:"\25b6";font-size:.7em}.step[data-nostamp] .n{font-size:0}.step[data-nostamp] .n:before{font-size:16px}.step .t{font-weight:400;font-size:1.02em}.step .tag{grid-column:2;font-size:.8em;color:#7a6a5a}.step:after{content:"";position:absolute;right:8px;top:50%;width:28px;height:28px;margin-top:-14px;border:2px dashed rgba(43,36,32,.3);border-radius:50%}.step[data-nostamp]:after{display:none}.step.done{border-left-color:var(--red)}.step.done:after{content:"\2713";border:3px solid var(--red);color:var(--red);font:400 20px/22px var(--display);text-align:center;transform:rotate(-12deg);background:#e0533d14}.go{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:14px 0 0}.btn{display:inline-block;padding:.3em .9em .12em;font:400 clamp(22px,1vw + 16px,28px)/1.1 var(--display);letter-spacing:.03em;color:var(--cream);background:var(--red) var(--grain);box-shadow:3px 5px #2b242059;transform:rotate(-2deg);min-height:44px;display:inline-flex;align-items:center}.card:hover .btn,.card:focus-within .btn{transform:rotate(0) translateY(-1px)}.progress{font-size:.92em;color:#6b5b4b;text-align:right}.offline{position:relative;z-index:2;margin:12px 0 0}.offline[hidden]{display:none}.save{--p: 0%;position:relative;display:inline-flex;align-items:center;gap:10px;min-height:44px;max-width:100%;padding:5px 8px 5px 7px;font:400 .95em/1.1 var(--hand);color:var(--ink);cursor:pointer;text-align:left;background-color:#fffaf0;background-image:linear-gradient(90deg,rgba(110,165,81,.3) var(--p),transparent var(--p)),var(--grain);border:2px dashed rgba(43,36,32,.32);border-radius:3px;box-shadow:1px 2px #3422121a;transform:rotate(-.6deg);-webkit-tap-highlight-color:transparent;transition:background-color .2s,border-color .2s}.save:hover{border-color:#2b24208c}.save .box{flex:none;position:relative;width:26px;height:26px;border:2px solid rgba(43,36,32,.45);border-radius:3px;background:#fff;font:400 21px/25px var(--display);text-align:center;color:var(--red);transform:rotate(-4deg)}.save .lbl{flex:1 1 auto}.save .size{flex:none;padding:.12em .5em .02em;font-size:.82em;background:var(--kraft) var(--grain);box-shadow:1px 2px #3422122e;transform:rotate(1.5deg);white-space:nowrap}.offline[data-state=saving] .save{border-style:solid;border-color:#6ea551b3}.offline[data-state=saving] .box{border:3px dashed var(--green);border-radius:50%;background:transparent;animation:save-spin 1.4s linear infinite}.offline[data-state=done] .save{border-style:solid;border-color:#e0533d8c;background-image:var(--grain)}.offline[data-state=done] .box{border:3px solid var(--red);background:#e0533d14;transform:rotate(-10deg)}.offline[data-state=done] .box:before{content:"\2713";font:900 20px/23px system-ui,-apple-system,Segoe UI Symbol,sans-serif}.offline[data-state=error] .box{border-color:var(--red)}.offline[data-state=error] .box:before{content:"!"}.off-note{margin:.45em 0 0;font-size:.78em;line-height:1.25;color:#7a6a5a}.off-note:empty{display:none}@keyframes save-spin{to{transform:rotate(360deg)}}.install-row{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:6px 14px;margin:1em 0 0}.install-row[hidden]{display:none}.install{display:inline-flex;align-items:center;gap:.35em;min-height:44px;padding:.32em .9em .14em;border:0;cursor:pointer;font:400 clamp(20px,.8vw + 15px,25px)/1.1 var(--display);letter-spacing:.03em;color:var(--cream);background:var(--navy) var(--grain);box-shadow:3px 5px #2b242059;transform:rotate(-1.5deg)}.install:hover{transform:rotate(0) translateY(-1px)}.install-sub{font-size:.85em;color:#6b5b4b}.hint{position:relative;max-width:640px;width:calc(100% - 2 * var(--gut));margin:clamp(18px,3vw,30px) auto 0;padding:14px 52px 12px 18px;background:#f6dc8e var(--grain);box-shadow:var(--shadow);transform:rotate(.7deg);font-size:.95em}.hint[hidden]{display:none}.hint:before{content:"";position:absolute;top:-12px;left:50%;width:110px;height:26px;margin-left:-55px;transform:rotate(-3deg);background:#f2e2b0cc var(--grain);box-shadow:0 1px 3px #0000001f}.hint p{margin:0}.hint p.more{margin-top:.45em;font-size:.9em}.hint b{font-weight:400;color:var(--navy)}.hint .share{display:inline-block;vertical-align:-3px;color:#2d6fd6}.hint .x{position:absolute;top:2px;right:2px;width:44px;height:44px;border:0;background:none;cursor:pointer;font:400 28px/1 var(--hand);color:#7a6a5a}.foot{max-width:820px;margin:clamp(26px,4vw,56px) auto clamp(24px,4vw,48px);padding:16px 20px;width:calc(100% - 2 * var(--gut));font-size:.88em;background:#fbf5e6e0 var(--grain);box-shadow:var(--shadow);transform:rotate(.5deg)}.foot p{margin:.2em 0}.foot .build{font-size:.8em;color:#8d7c69}@media(max-width:480px){.card article{padding:10px 10px 14px}.step{padding-right:40px}.mast:before,.mast:after{width:80px;height:24px}}@media(min-width:1900px){body{font-size:22px}.cards{grid-template-columns:repeat(auto-fit,minmax(420px,540px))}}@media(prefers-reduced-motion:reduce){.card,.stamp,.btn,.save{transition:none}.offline[data-state=saving] .box{animation:none}}