@font-face{font-family:Shantell Sans Variable;font-style:normal;font-display:swap;font-weight:300 800;src:url(/assets/shantell-sans-cyrillic-ext-infm-normal-JjySQ2Ki.woff2)format("woff2-variations");unicode-range:U+460-52F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}@font-face{font-family:Shantell Sans Variable;font-style:normal;font-display:swap;font-weight:300 800;src:url(/assets/shantell-sans-cyrillic-infm-normal-fzjGo4xp.woff2)format("woff2-variations");unicode-range:U+301,U+400-45F,U+490-491,U+4B0-4B1,U+2116}@font-face{font-family:Shantell Sans Variable;font-style:normal;font-display:swap;font-weight:300 800;src:url(/assets/shantell-sans-vietnamese-infm-normal-CBWIQmjK.woff2)format("woff2-variations");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:Shantell Sans Variable;font-style:normal;font-display:swap;font-weight:300 800;src:url(/assets/shantell-sans-latin-ext-infm-normal-Dg6Ri7xI.woff2)format("woff2-variations");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:Shantell Sans Variable;font-style:normal;font-display:swap;font-weight:300 800;src:url(/assets/shantell-sans-latin-infm-normal-Cul8tZXT.woff2)format("woff2-variations");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}:root{--ultramarine:#2337a6;--ultramarine-deep:#18267a;--paper:#fffef9;--ink:#141a45;--crayon:#ffd23f;--film:#16130f;--on-blue:#e8ebff;--on-blue-dim:#b9c1f3;--alarm:#ff5a5f;--gutter:clamp(16px, 4vw, 48px);--stage-w:min(1100px, 100vw, calc((100svh - 270px) * 4 / 3 + 2 * var(--gutter)));--stage-left:max(var(--gutter), calc((100vw - var(--stage-w)) / 2 + var(--gutter)));--face:"Shantell Sans Variable", "Comic Neue", "Segoe Print", system-ui, sans-serif;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*,:before,:after{box-sizing:border-box}html{background:var(--ultramarine)}body{background:var(--ultramarine);min-height:100dvh;color:var(--on-blue);font:400 1rem/1.55 var(--face);font-variation-settings:"INFM" 20;-webkit-font-smoothing:antialiased;margin:0}button,input{font:inherit;color:inherit}:focus-visible{outline:3px solid var(--crayon);outline-offset:3px}[hidden]{display:none!important}.visually-hidden{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.masthead,.stage{width:min(100%, var(--stage-w));min-width:min(100%,360px);padding-inline:var(--gutter);margin-inline:auto}.masthead{padding-block:clamp(16px,3vw,32px) 14px}.wordmark{font-variation-settings:"INFM" 100;letter-spacing:-.01em;color:var(--paper);margin:0;font-size:clamp(2.25rem,5vw,3.5rem);font-weight:800;line-height:1}.tagline{max-width:46ch;color:var(--on-blue-dim);margin:10px 0 0;font-size:1.05rem}.paper{aspect-ratio:4/3;background:var(--paper);touch-action:none;border-radius:3px;width:100%;transition:box-shadow .2s;position:relative;overflow:hidden;box-shadow:0 1.6rem 3rem -1.8rem #060a30bf,0 0 0 1px #060a302e}.paper.my-turn{box-shadow:0 0 0 4px var(--crayon), 0 1.6rem 3rem -1.8rem #060a30bf;cursor:crosshair}.board{width:100%;height:100%;display:block;position:absolute;inset:0}.clock{z-index:3;background:var(--ink);color:var(--on-blue);pointer-events:none;border-radius:999px;align-items:center;gap:10px;padding:6px 8px 6px 14px;font-size:.8rem;display:flex;position:absolute;top:12px;right:12px}.clock strong{background:var(--crayon);min-width:3.2ch;color:var(--ink);font-variant-numeric:tabular-nums;text-align:center;border-radius:999px;padding:2px 10px;font-size:1.15rem;font-weight:800}.clock.hurry strong{background:var(--alarm);color:#fff;animation:1s steps(2,end) infinite beat}@keyframes beat{50%{transform:scale(1.08)}}.pencil{z-index:2;pointer-events:none;white-space:nowrap;will-change:transform;align-items:flex-start;gap:2px;display:flex;position:absolute;top:0;left:0}.pencil span{background:var(--ink);color:var(--paper);border-left:4px solid;border-radius:8px;margin-top:2px;padding:3px 9px;font-size:.8rem;font-weight:600}.controls{flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:18px 32px;padding-block:20px 8px;display:flex}.tools{border:0;flex-wrap:wrap;align-items:center;gap:14px;min-width:0;margin:0;padding:0;transition:opacity .2s;display:flex}.tools:disabled{opacity:.4}.swatches,.sizes{gap:8px;display:flex}.swatch,.size{cursor:pointer;background:var(--swatch,transparent);border:2px solid #0000;border-radius:50%;width:34px;height:34px;padding:0;box-shadow:inset 0 0 0 2px #ffffff40}.swatch[aria-checked=true],.size[aria-checked=true]{border-color:var(--paper);box-shadow:0 0 0 2px var(--ink) inset}.size{background:#ffffff14;place-items:center;display:grid}.size:after{content:"";width:var(--dot);height:var(--dot);background:var(--paper);border-radius:50%}.tools:disabled button{cursor:default}.picker{cursor:pointer;background:conic-gradient(#e63946,#ffd23f,#2a9d8f,#3a86ff,#8338ec,#ff70a6,#e63946);border-radius:50%;width:34px;height:34px;position:relative;overflow:hidden}.picker input{opacity:0;cursor:pointer;position:absolute;inset:0}.turn{text-align:right;justify-items:end;gap:8px;max-width:30rem;margin-left:auto;display:grid}.turn-button{cursor:pointer;background:var(--crayon);color:var(--ink);font-variation-settings:"INFM" 60;border:0;border-radius:999px;padding:14px 26px;font-size:1.15rem;font-weight:750;transition:transform .12s,box-shadow .12s;box-shadow:0 4px #c9a21c}.turn-button:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 5px #c9a21c}.turn-button:active:not(:disabled){transform:translateY(3px);box-shadow:0 1px #c9a21c}.turn-button:disabled{cursor:default;color:var(--on-blue);background:0 0;box-shadow:inset 0 0 0 2px #e8ebff59}.status{min-height:1.55em;color:var(--on-blue-dim);max-width:46ch;margin:0}@media (width<=640px){.turn{text-align:left;justify-items:stretch;width:100%;max-width:none;margin-left:0}.turn-button{width:100%}.clock{top:8px;right:8px}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}.filmstrip{background:radial-gradient(circle at 50% 50%, var(--ultramarine) 0 4px, transparent 4.5px) 0 7px / 22px 14px repeat-x, radial-gradient(circle at 50% 50%, var(--ultramarine) 0 4px, transparent 4.5px) 0 calc(100% - 7px) / 22px 14px repeat-x, var(--film);margin-top:clamp(28px,5vw,48px);padding-block:22px 26px}.filmstrip-title{padding-inline:var(--stage-left) var(--gutter);color:var(--paper);margin:6px 0 12px;font-size:1.1rem;font-weight:700}.reel{padding:4px var(--gutter) 10px var(--stage-left);scroll-snap-type:x proximity;scrollbar-color:#4b4438 transparent;gap:14px;margin:0;list-style:none;display:flex;overflow-x:auto}.reel>li{scroll-snap-align:start;flex:none}.frame{cursor:pointer;text-align:left;background:#2a251e;border:0;border-radius:2px;gap:6px;width:200px;padding:6px 6px 8px;display:grid;position:relative}.frame img{aspect-ratio:4/3;background:var(--paper);width:100%;height:auto;display:block}.frame-date{color:#e9e1d2;font-size:.85rem;font-weight:600}.frame:hover img{outline:3px solid var(--crayon);outline-offset:-3px}.best-of{background:var(--crayon);color:var(--ink);border-radius:999px;padding:2px 9px;font-size:.75rem;font-weight:750;position:absolute;top:12px;left:12px}.reel-end{color:#b5ab99;align-self:center;max-width:30ch;font-size:.9rem}.replay{background:var(--film);color:#e9e1d2;border:0;border-radius:6px;width:min(960px,100vw - 24px,133.333svh - 200px);padding:0}.replay::backdrop{background:#060a30b8}.replay-head,.replay-foot{align-items:center;gap:14px;padding:12px 16px;display:flex}.replay-title{color:var(--paper);flex:1;margin:0;font-size:1.1rem}.replay-close{cursor:pointer;background:0 0;border:0;padding:4px 8px;font-size:1.2rem}.replay-paper{aspect-ratio:4/3;background:var(--paper)}.replay-paper canvas{width:100%;height:100%;display:block}.replay-foot progress{height:8px;accent-color:var(--crayon);flex:1}.replay-note{color:#b5ab99;font-size:.85rem}.replay-again{background:var(--crayon);color:var(--ink);cursor:pointer;border:0;border-radius:999px;padding:6px 16px;font-weight:700}
