@font-face{font-family:Patrick Hand;font-style:normal;font-weight:400;font-display:swap;src:url(../media/57dd297ff72c8fa7-s.2oc8yur3f280s.woff2)format("woff2");unicode-range:U+102-103,U+110-111,U+128-129,U+168-169,U+1A0-1A1,U+1AF-1B0,U+300-301,U+303-304,U+308-309,U+323,U+329,U+1EA0-1EF9,U+20AB}@font-face{font-family:Patrick Hand;font-style:normal;font-weight:400;font-display:swap;src:url(../media/85c577ec7d0c8010-s.p.3g419ihx2dxc-.woff2)format("woff2");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Patrick Hand;font-style:normal;font-weight:400;font-display:swap;src:url(../media/f8cabcee3b0c666c-s.p.3moulrn_0vbty.woff2)format("woff2");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Patrick Hand Fallback;src:local(Arial);ascent-override:127.97%;descent-override:38.32%;line-gap-override:0.0%;size-adjust:81.43%}.patrick_hand_94a794f7-module__WmAWBW__className{font-family:Patrick Hand,Patrick Hand Fallback;font-style:normal;font-weight:400}.patrick_hand_94a794f7-module__WmAWBW__variable{--font-hand:"Patrick Hand", "Patrick Hand Fallback"}
:root{--cell:24px;--margin-x:calc(var(--cell) * 4);--paper:#f8f5ec;--grid:#cfdced;--ink:#2b3fb0;--ink-soft:#8c98d6;--ink-faint:#c5cdee;--red:#e0556d;--panel:#fffdf7;--shadow:#2b3fb040;--tape:#ffecaabf;--ok:#1f8a4c;--bad:#c0392b;--pencil:#5b5f6b;--desk:#e6e1d6;--sheet-max:1248px;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--paper:#141826;--grid:#252d47;--ink:#9fb5ff;--ink-soft:#5c6aa6;--ink-faint:#313b63;--red:#ff7b8f;--panel:#1b2035;--shadow:#0000008c;--tape:#ffecaa59;--ok:#4fd08a;--bad:#ff7b6b;--pencil:#aab0c0;--desk:#0c0f19;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}}:root[data-theme=dark]{--paper:#141826;--grid:#252d47;--ink:#9fb5ff;--ink-soft:#5c6aa6;--ink-faint:#313b63;--red:#ff7b8f;--panel:#1b2035;--shadow:#0000008c;--tape:#ffecaa59;--ok:#4fd08a;--bad:#ff7b6b;--pencil:#aab0c0;--desk:#0c0f19;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}@media (max-width:720px){:root{--margin-x:calc(var(--cell) * 1.5)}}*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}html,body{margin:0;padding:0}body{min-height:100vh;color:var(--ink);background:var(--desk);font-family:var(--font-hand), "Patrick Hand", "Comic Sans MS", "Chalkboard SE", cursive, sans-serif;font-size:20px;line-height:calc(var(--cell) * 1.25);overflow-x:hidden}.sheet{max-width:var(--sheet-max);background-color:var(--paper);background-image:linear-gradient(90deg, transparent calc(var(--margin-x) - 1px), var(--red) calc(var(--margin-x) - 1px), var(--red) calc(var(--margin-x) + 1px), transparent calc(var(--margin-x) + 1px)), linear-gradient(var(--grid) 1px, transparent 1px), linear-gradient(90deg, var(--grid) 1px, transparent 1px);background-size:100% 100%, var(--cell) var(--cell), var(--cell) var(--cell);flex-direction:column;min-height:100vh;margin:0 auto;display:flex;position:relative;box-shadow:0 0 0 1px #2b3fb01f,0 12px 40px #0000001a}.sheet>main{flex:1 0 auto}a{color:inherit}img{max-width:100%;display:block}h1,h2,h3{margin:0;font-weight:400;line-height:1.05}h1{font-size:64px}h2{font-size:40px}h3{font-size:28px}p{margin:0 0 var(--cell)}button{font:inherit;color:inherit}::selection{background:var(--ink);color:var(--paper)}.page{padding-left:calc(var(--margin-x) + var(--cell));padding-right:calc(var(--cell) * 2)}@media (max-width:720px){.page{padding-right:var(--cell)}}.margin-note{left:calc(-1 * (var(--margin-x) + var(--cell)));top:calc(var(--cell) * 2 + 10px);width:calc(var(--margin-x) - 10px);text-align:right;color:var(--red);pointer-events:none;font-size:17px;line-height:1.1;position:absolute;transform:rotate(-4deg)}.section[style*="padding-top: 0"]>.margin-note{top:10px}@media (max-width:720px){.margin-note{display:none}}.section{padding:calc(var(--cell) * 2) 0;position:relative}.section-head{margin-bottom:var(--cell);flex-wrap:wrap;align-items:baseline;gap:16px;display:flex}.section-head .count{color:var(--ink-soft);font-size:22px}.box{background:var(--panel);border:2.5px solid var(--ink);color:var(--ink);box-shadow:3px 4px 0 var(--shadow);border-radius:6px}.box.dashed{box-shadow:none;border-style:dashed}.btn{cursor:pointer;-webkit-user-select:none;user-select:none;background:var(--panel);border:2.5px solid var(--ink);min-height:48px;color:var(--ink);box-shadow:3px 4px 0 var(--shadow);border-radius:8px;justify-content:center;align-items:center;gap:10px;padding:10px 22px;font-size:22px;line-height:1;text-decoration:none;transition:transform .12s,box-shadow .12s;display:inline-flex}.btn:hover{box-shadow:4px 6px 0 var(--shadow);transform:translate(-1px,-2px)}.btn:active{box-shadow:1px 1px 0 var(--shadow);transform:translate(1px,2px)}.btn.primary{background:var(--ink);color:var(--paper)}.btn.big{min-height:60px;padding:14px 30px;font-size:28px}.btn.small{min-height:38px;box-shadow:2px 3px 0 var(--shadow);padding:6px 14px;font-size:18px}.btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.btn svg{width:1.1em;height:1.1em}.link{-webkit-text-decoration:underline wavy;text-decoration:underline wavy;-webkit-text-decoration-color:var(--ink-soft);text-decoration-color:var(--ink-soft);text-underline-offset:4px}.link:hover{-webkit-text-decoration-color:var(--ink);text-decoration-color:var(--ink)}.site-header{padding-top:var(--cell);padding-bottom:calc(var(--cell) * .75);min-height:calc(var(--cell) * 3);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px;display:flex;position:relative}.brand{align-items:center;gap:12px;font-size:32px;line-height:1;text-decoration:none;display:inline-flex}.brand svg{width:44px;height:44px}.brand .beta{color:var(--red);border:1.5px solid var(--red);border-radius:4px;padding:1px 6px;font-size:14px;transform:rotate(-6deg)}.nav{align-items:center;gap:22px;font-size:21px;display:flex}.nav a{text-decoration:none}.nav a:hover{text-underline-offset:5px;-webkit-text-decoration:underline wavy;text-decoration:underline wavy}@media (max-width:720px){.brand{font-size:26px}.nav{gap:14px;font-size:19px}.nav .hide-mobile{display:none}}.intro{color:var(--pencil);margin:0 0 var(--cell);font-size:20px}.tiles{grid-template-columns:repeat(auto-fill, minmax(calc(var(--cell) * 10), 1fr));gap:calc(var(--cell) * 1.25) var(--cell);padding-bottom:calc(var(--cell) * 2);display:grid}@media (max-width:520px){.tiles{gap:var(--cell) 14px;grid-template-columns:repeat(2,1fr)}}.tile{color:var(--ink);background:var(--panel);border:2.5px solid var(--ink);box-shadow:3px 4px 0 var(--shadow);border-radius:10px;flex-direction:column;text-decoration:none;transition:transform .14s,box-shadow .14s;display:flex;overflow:hidden}.tile:hover,.tile:focus-visible{box-shadow:6px 8px 0 var(--shadow);outline:none;transform:translate(-2px,-3px)}.tile:active{box-shadow:1px 1px 0 var(--shadow);transform:translate(1px,2px)}.tile-cover{aspect-ratio:4/3;background:var(--paper);border-bottom:2.5px solid var(--ink);display:block;position:relative;overflow:hidden}.tile-cover>img{object-fit:cover;object-position:top left;width:100%;height:100%;transition:transform .3s}.tile:hover .tile-cover>img{transform:scale(1.03)}.tile-sketch{background:var(--panel);border:1.5px solid var(--ink-faint);width:26%;box-shadow:2px 3px 0 var(--shadow);padding:3px 3px 4px;position:absolute;top:8px;right:8px;transform:rotate(5deg)}.tile-sketch img{aspect-ratio:3/4;object-fit:cover;object-position:top;width:100%}.tile-play{background:var(--panel);border:2.5px solid var(--ink);width:46px;height:46px;color:var(--ink);box-shadow:2px 3px 0 var(--shadow);border-radius:50%;place-items:center;transition:transform .14s,background .14s,color .14s;display:grid;position:absolute;bottom:10px;left:10px}.tile-play svg{width:24px;height:24px;margin-left:2px}.tile:hover .tile-play{background:var(--ink);color:var(--paper);transform:scale(1.1)}.tile-caption{flex-direction:column;padding:8px 12px 10px;line-height:1.15;display:flex}.tile-title{letter-spacing:1px;font-size:28px}.tile-by{color:var(--pencil);font-size:17px}.tile-new{box-shadow:none;color:var(--ink-soft);border-style:dashed}.tile-new .tile-cover{border-bottom-style:dashed;place-items:center;display:grid}.tile-new .plus{font-size:96px;line-height:1}.tile-new:hover{color:var(--ink);box-shadow:4px 6px 0 var(--shadow)}.tile-new .tile-title{font-size:26px}@media (max-width:520px){.tile-title{font-size:22px}.tile-by{font-size:15px}.tile-play{width:38px;height:38px}.tile-play svg{width:20px;height:20px}}.lead{max-width:30em;font-size:26px;line-height:1.3}.lead b{background:linear-gradient(transparent 55%, var(--tape) 55%);font-weight:400}.example{max-width:900px;margin:calc(var(--cell) * 1.5) 0 calc(var(--cell) * 2.5);grid-template-columns:5fr 1fr 6fr;align-items:center;gap:12px;display:grid;position:relative}.example .polaroid.a{transform:rotate(-3deg)}.example .polaroid.a img{aspect-ratio:4/5;object-fit:cover;object-position:top}.example .polaroid.b{transform:rotate(2deg)}.example .arrow{color:var(--red);transform:rotate(-6deg)}.example .arrow svg{width:100%;height:auto}.actions{margin-top:calc(var(--cell) * 1.5);flex-wrap:wrap;align-items:center;gap:16px;display:flex}.fine{color:var(--ink-soft);font-size:18px}@media (max-width:520px){.lead{font-size:22px}.example{grid-template-columns:1fr;max-width:320px}.example .arrow{width:80px;margin:-10px auto;transform:rotate(60deg)}}.polaroid{background:var(--panel);border:1.5px solid var(--ink-faint);box-shadow:3px 5px 0 var(--shadow);padding:8px 8px 12px;position:relative}.polaroid:before,.polaroid:after{content:"";background:var(--tape);width:64px;height:22px;position:absolute;top:-10px;transform:rotate(-3deg);box-shadow:0 1px 2px #00000014}.polaroid:before{left:12px}.polaroid:after{right:12px;transform:rotate(4deg)}.polaroid img{width:100%;height:auto}.polaroid figcaption{color:var(--pencil);text-align:center;padding-top:6px;font-size:17px}.polaroid.screen{padding:8px}.polaroid.screen .screen-inner{aspect-ratio:4/3;border:1.5px solid var(--ink-faint);background:var(--paper);overflow:hidden}.polaroid.screen iframe{transform-origin:0 0;pointer-events:none;border:0;width:200%;height:200%;transform:scale(.5)}.steps{gap:var(--cell);margin-top:calc(var(--cell) * 1.5);grid-template-columns:repeat(3,1fr);display:grid}.step{padding:18px 18px 20px;position:relative}.step .num{background:var(--paper);border:2.5px solid var(--red);width:44px;height:44px;color:var(--red);border-radius:50%;place-items:center;font-size:26px;display:grid;position:absolute;top:-18px;left:-12px;transform:rotate(-8deg)}.step svg{width:100%;height:110px;margin-bottom:8px;display:block}.step h3{margin-bottom:6px}.step p{color:var(--pencil);margin:0;font-size:19px;line-height:1.3}@media (max-width:900px){.steps{gap:calc(var(--cell) * 1.5);grid-template-columns:1fr}}.note{max-width:40em;padding:20px 24px}.note p{margin-bottom:10px}.note p:last-child{margin:0}.site-footer{padding-top:calc(var(--cell) * 2);padding-bottom:calc(var(--cell) * 1.5);border-top:1.5px dashed var(--ink-faint);color:var(--ink-soft);flex-wrap:wrap;justify-content:space-between;gap:8px 20px;margin-top:auto;font-size:18px;display:flex}.site-footer a{text-decoration:none}.site-footer a:hover{text-decoration:underline}.game-head{margin:var(--cell) 0;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:20px;display:flex}.game-head h1{letter-spacing:3px;font-size:64px}.game-head .by{color:var(--pencil);font-size:22px}.game-head .by b{color:var(--ink);font-weight:400}.crumbs{color:var(--ink-soft);font-size:19px}.crumbs a{text-decoration:none}.crumbs a:hover{text-decoration:underline}.game-frame{padding:6px;position:relative}.game-frame iframe{background:var(--paper);border:0;width:100%;height:min(78vh,820px);min-height:480px;display:block}.game-frame.fullscreen{z-index:100;box-shadow:none;border:0;border-radius:0;padding:0;position:fixed;inset:0}.game-frame.fullscreen iframe{height:100%;min-height:0}.game-toolbar{margin:12px 0 var(--cell);color:var(--ink-soft);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;font-size:18px;display:flex}.game-toolbar .tools{flex-wrap:wrap;gap:10px;display:flex}.fs-close{z-index:101;position:fixed;top:12px;right:12px}.game-body{gap:calc(var(--cell) * 2);margin-top:var(--cell);grid-template-columns:minmax(0,5fr) minmax(0,6fr);align-items:start;display:grid}.game-body .polaroid{transform:rotate(-1.2deg)}.pages{margin-top:calc(var(--cell) * 1.5);grid-template-columns:repeat(3,1fr);gap:18px 14px;display:grid}.pages .page-thumb{color:var(--pencil);text-align:center;padding:5px 5px 6px;font-size:15px;line-height:1.2;text-decoration:none;transition:transform .14s}.pages .page-thumb:nth-child(odd){transform:rotate(1.5deg)}.pages .page-thumb:nth-child(2n){transform:rotate(-1deg)}.pages .page-thumb:hover{transform:rotate(0)translateY(-3px)}.pages .page-thumb:before,.pages .page-thumb:after{width:34px;height:12px;top:-6px}.pages .page-thumb img{aspect-ratio:3/4;object-fit:cover;object-position:top}.pages .page-thumb span{padding-top:4px;display:block}.game-body .polaroid a{display:block}.game-body h2{margin-bottom:12px}.game-body ul{margin:0 0 var(--cell);padding-left:24px}.game-body li{margin-bottom:6px}.tags{flex-wrap:wrap;gap:8px;display:flex}.tag{color:var(--pencil);border:1.5px solid var(--ink-faint);border-radius:999px;padding:1px 12px;font-size:17px}@media (max-width:900px){.game-body{grid-template-columns:1fr}.game-head h1{font-size:48px}}.form{gap:var(--cell);max-width:calc(var(--cell) * 30);display:grid}.field{gap:6px;display:grid}.field label{font-size:22px}.field .hint{color:var(--pencil);font-size:17px;line-height:1.3}.input,.textarea,.select{font:inherit;color:var(--ink);background:var(--panel);border:2px solid var(--ink);border-radius:6px;width:100%;padding:8px 12px;font-size:21px;box-shadow:inset 2px 2px #2b3fb014}.textarea{resize:vertical;min-height:140px;line-height:1.3}.input:focus,.textarea:focus,.select:focus,.dropzone:focus-within{outline:3px solid var(--red);outline-offset:2px}.row{gap:var(--cell);grid-template-columns:1fr 1fr;display:grid}@media (max-width:520px){.row{grid-template-columns:1fr}}.photo-example{justify-self:center;width:min(100%,320px);margin:0;transform:rotate(2deg)}.photo-example img{display:block}@media (min-width:1000px){.form.with-example{max-width:calc(var(--cell) * 52);column-gap:calc(var(--cell) * 2);grid-template-columns:minmax(0,3fr) minmax(0,2fr)}.form.with-example>*{grid-column:1}.form.with-example>.photo-example{width:100%;margin-top:calc(var(--cell) * 1.5);grid-area:1/2/span 6;align-self:start}}.dropzone{text-align:center;cursor:pointer;border:2.5px dashed var(--ink);background:var(--panel);border-radius:8px;place-items:center;gap:8px;min-height:220px;padding:20px;display:grid;position:relative}.dropzone.over{background:var(--tape)}.dropzone input{opacity:0;cursor:pointer;position:absolute;inset:0}.dropzone svg{width:72px;height:72px}.dropzone .small{color:var(--pencil);font-size:17px}.dropzone img.preview{border:1.5px solid var(--ink-faint);width:auto;max-height:360px}.check{align-items:flex-start;gap:12px;font-size:19px;line-height:1.3;display:flex}.check input{width:22px;height:22px;accent-color:var(--ink);flex:none;margin-top:4px}.error{color:var(--bad);border:2px dashed var(--bad);border-radius:6px;padding:8px 12px}.progress-list{margin:var(--cell) 0;gap:10px;padding:0;font-size:23px;list-style:none;display:grid}.progress-list li{color:var(--ink-soft);align-items:center;gap:14px;display:flex}.progress-list li.done,.progress-list li.active{color:var(--ink)}.progress-list .mark{border:2.5px solid;border-radius:6px;flex:none;place-items:center;width:30px;height:30px;font-size:20px;display:grid}.progress-list li.active .mark{border-style:dashed;animation:3s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.elapsed{color:var(--pencil);font-size:18px}.status-layout{gap:calc(var(--cell) * 2);grid-template-columns:minmax(0,1fr) minmax(0,320px);align-items:start;display:grid}@media (max-width:900px){.status-layout{grid-template-columns:1fr}.status-layout .polaroid{max-width:320px}}.sr-only{clip:rect(0 0 0 0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}
