:root{color-scheme:light;--desk:oklch(95% .02 85);--desk-deep:oklch(90.5% .03 82);--print:oklch(98.6% .008 90);--print-ink:oklch(27% .045 255);--print-soft:oklch(48% .03 255);--ink:oklch(27% .045 255);--ink-soft:oklch(44% .035 255);--blue:oklch(64% .14 245);--tape:oklch(89% .09 95/.72);--stamp:oklch(54% .18 28);--line:oklch(27% .045 255/.14);--shadow:0 1px 1px oklch(27% .045 255/.08), 0 14px 30px -12px oklch(27% .045 255/.32);--dots:oklch(27% .045 255/.07);--font-display:"Young Serif", Georgia, serif;--font-body:"Hanken Grotesk", ui-sans-serif, sans-serif;--font-hand:"Gochi Hand", "Bradley Hand", cursive;--font-mono:"IBM Plex Mono", ui-monospace, Menlo, monospace;--gutter:clamp(16px, 4vw, 48px);--ease-out:cubic-bezier(.22, 1, .36, 1)}:root[data-theme=dark]{color-scheme:dark;--desk:oklch(18.5% .022 32);--desk-deep:oklch(15% .02 32);--print:oklch(93% .018 85);--ink:oklch(93% .02 80);--ink-soft:oklch(76% .03 60);--blue:oklch(76% .11 245);--tape:oklch(80% .08 90/.55);--stamp:oklch(66% .18 30);--line:oklch(93% .02 80/.14);--shadow:0 1px 1px oklch(0% 0 0/.3), 0 18px 40px -14px oklch(0% 0 0/.7);--dots:oklch(66% .18 30/.07)}@media (prefers-color-scheme:dark){:root:not([data-theme=light]){color-scheme:dark;--desk:oklch(18.5% .022 32);--desk-deep:oklch(15% .02 32);--print:oklch(93% .018 85);--ink:oklch(93% .02 80);--ink-soft:oklch(76% .03 60);--blue:oklch(76% .11 245);--tape:oklch(80% .08 90/.55);--stamp:oklch(66% .18 30);--line:oklch(93% .02 80/.14);--shadow:0 1px 1px oklch(0% 0 0/.3), 0 18px 40px -14px oklch(0% 0 0/.7);--dots:oklch(66% .18 30/.07)}}*,:before,:after{box-sizing:border-box}html{scroll-behavior:smooth}body{min-width:320px;color:var(--ink);background-color:var(--desk);background-image:radial-gradient(var(--dots) 1px, transparent 1.4px);font-family:var(--font-body);-webkit-font-smoothing:antialiased;background-size:22px 22px;margin:0;font-size:1.0625rem;line-height:1.6;transition:background-color .3s,color .3s}img,svg{max-width:100%;display:block}a{color:inherit}h1,h2{font-family:var(--font-display);letter-spacing:-.01em;text-wrap:balance;margin:0;font-weight:400}.defs{position:absolute}.scribble{color:var(--blue);font-family:var(--font-hand);margin:0;font-size:1.35rem;line-height:1.2}.bar{max-width:1180px;padding:20px var(--gutter);justify-content:space-between;align-items:center;gap:16px;margin:0 auto;display:flex}.wordmark{font-family:var(--font-display);align-items:center;gap:8px;font-size:1.5rem;text-decoration:none;display:inline-flex}.wordmark img{width:36px;height:36px}.bar nav{align-items:center;gap:clamp(12px,3vw,28px);font-size:.98rem;font-weight:500;display:flex}.bar nav a{text-underline-offset:5px;text-decoration:none}.bar nav a:hover{text-decoration:underline wavy var(--blue)}.theme-toggle{border:1.5px solid var(--line);width:38px;height:38px;color:var(--ink);cursor:pointer;background:0 0;border-radius:50%;place-items:center;padding:0;transition:border-color .16s,transform .16s;display:grid}.theme-toggle:hover{border-color:var(--ink);transform:rotate(-12deg)}.theme-toggle svg{width:18px;height:18px}main{max-width:1180px;padding:0 var(--gutter);margin:0 auto}.hero{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);align-items:center;gap:clamp(24px,5vw,64px);padding:clamp(32px,6vw,72px) 0 clamp(64px,9vw,120px);display:grid}.hero h1{margin-top:14px;font-size:clamp(2.6rem,6.4vw,5.2rem);line-height:1.02}.nowrap{white-space:nowrap}.underlined{color:var(--blue);display:inline-block;position:relative}.squiggle{width:100%;height:.28em;position:absolute;bottom:-.1em;left:0;overflow:visible}.squiggle path{fill:none;stroke:var(--blue);stroke-width:3.5px;stroke-linecap:round;stroke-dasharray:240;stroke-dashoffset:240px;animation:draw .7s .9s var(--ease-out) forwards}.lede{max-width:34rem;color:var(--ink-soft);margin:26px 0 30px;font-size:clamp(1.06rem,1.5vw,1.2rem)}.actions{flex-wrap:wrap;align-items:center;gap:14px 24px;display:flex}.shutter{min-height:52px;color:var(--print);background:var(--print-ink);box-shadow:0 3px 0 oklch(18% .04 255), var(--shadow);transition:transform .12s var(--ease-out), box-shadow .12s var(--ease-out);border-radius:999px;align-items:center;gap:12px;padding:0 24px 0 16px;font-weight:700;text-decoration:none;display:inline-flex}:root[data-theme=dark] .shutter{color:var(--print-ink);background:var(--print);box-shadow:0 3px 0 oklch(70% .03 80), var(--shadow)}.shutter:hover{transform:translateY(-1px)}.shutter:active{box-shadow:0 0 0 transparent, var(--shadow);transform:translateY(3px)}.shutter:focus-visible,.text-link:focus-visible,.theme-toggle:focus-visible,.command button:focus-visible{outline:3px solid var(--blue);outline-offset:3px}.shutter-dot{background:var(--stamp);background-clip:padding-box;border:3px solid;border-radius:50%;width:22px;height:22px}.text-link{text-decoration:underline;text-decoration-color:var(--blue);text-underline-offset:5px;font-weight:700;text-decoration-thickness:2px}.meta{color:var(--ink-soft);margin:22px 0 0;font-size:.92rem}.camera{justify-self:center;width:min(100%,420px);padding-bottom:210px;position:relative}.camera-frame{position:relative}.camera-body{z-index:2;filter:drop-shadow(0 22px 26px oklch(27% .045 255/.22));width:100%;height:auto;position:relative}.slot{z-index:1;width:62%;height:290px;position:absolute;top:73%;left:50%;overflow:hidden;transform:translate(-50%)}.ticket{--tooth:8px;color:var(--print-ink);background:var(--print);font-family:var(--font-mono);box-shadow:var(--shadow);mask:conic-gradient(from -45deg at bottom, #0000, #000 1deg 89deg, #0000 90deg) 50% / calc(var(--tooth) * 2) 100%;padding:26px 18px 30px;font-size:.78rem;line-height:1.5;animation:1.6s steps(14,end) .35s forwards print;transform:translateY(-100%)rotate(0)}.ticket p,.ticket dl{margin:0}.ticket-head{letter-spacing:.06em;text-align:center;border-bottom:1.5px dashed oklch(27% .045 255/.35);padding-bottom:8px;font-weight:600}.ticket dl{border-bottom:1.5px dashed oklch(27% .045 255/.35);padding:8px 0}.ticket dl div{justify-content:space-between;gap:8px;display:flex}.ticket dt{color:var(--print-soft)}.ticket dd{margin:0;font-weight:600}.ticket-ok{letter-spacing:.12em;text-align:center;padding-top:8px;font-weight:600}@keyframes print{to{transform:translateY(0)rotate(0)}}@keyframes draw{to{stroke-dashoffset:0}}.section-head{flex-wrap:wrap;align-items:baseline;gap:4px 20px;margin-bottom:clamp(32px,5vw,56px);display:flex}.section-head h2,.notes h2,.install h2{font-size:clamp(2.1rem,4.6vw,3.4rem);line-height:1.05}.how{padding-bottom:clamp(72px,10vw,140px)}.prints{grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(20px,3.5vw,44px);margin:0;padding:0;list-style:none;display:grid}.print{color:var(--print-ink);background:var(--print);box-shadow:var(--shadow);transition:transform .26s var(--ease-out);padding:14px 14px 0;position:relative}.print-1{transform:rotate(-2.4deg)}.print-2{transform:rotate(1.6deg)translateY(18px)}.print-3{transform:rotate(-.8deg)translateY(-6px)}.print:hover{transform:rotate(0)translateY(-4px)}.tape{z-index:1;background:var(--tape);width:92px;height:26px;position:absolute;top:-12px;left:50%;transform:translate(-50%)rotate(-3deg);mask:linear-gradient(90deg,#0000 0 2px,#000 2px calc(100% - 2px),#0000 0)}.photo{aspect-ratio:1;background:oklch(24% .03 250);place-items:center;display:grid;position:relative;overflow:hidden}.caption{font-family:var(--font-hand);margin:0;padding:14px 4px 18px;font-size:1.45rem;line-height:1.1}.caption b{border:2px solid var(--blue);width:1.4em;height:1.4em;color:var(--blue);border-radius:50%;place-items:center;margin-right:6px;font-size:.85em;font-weight:400;display:inline-grid}.photo-scan{background:radial-gradient(circle at 30% 20%,oklch(36% .04 70),#0000 60%),oklch(22% .025 60)}.photo-scan .qr{width:56%;color:var(--print-ink);transform:rotate(4deg);box-shadow:0 10px 20px oklch(0% 0 0/.35)}.corners{border:3px solid oklch(86% .12 95);border-radius:14px;position:absolute;inset:14%;mask:linear-gradient(#000 0 0) 0 0/26% 26% no-repeat,linear-gradient(#000 0 0) 100% 0/26% 26% no-repeat,linear-gradient(#000 0 0) 0 100%/26% 26% no-repeat,linear-gradient(#000 0 0) 100% 100%/26% 26% no-repeat}.scanline{filter:drop-shadow(0 0 6px oklch(86% .12 95));background:linear-gradient(oklch(86% .12 95),oklch(86% .12 95)) 0 0/100% 2px no-repeat;animation:2.6s ease-in-out infinite alternate scan;position:absolute;inset:22% 18%}@keyframes scan{to{background-position:0 100%}}.photo-check{background:radial-gradient(circle at 70% 80%,oklch(40% .05 160/.6),#0000 60%),oklch(22% .03 170)}.mini-card{color:oklch(94% .015 150);background:oklch(30% .025 170);border-radius:12px;gap:4px;width:78%;padding:16px;display:grid;transform:rotate(-3deg);box-shadow:0 10px 24px oklch(0% 0 0/.35)}.mini-card small{letter-spacing:.16em;opacity:.7;font-size:.62rem}.mini-card strong{font-size:1.3rem}.chips{flex-wrap:wrap;gap:5px;margin-top:6px;display:flex}.chips i{background:oklch(22% .02 170);border-radius:6px;padding:3px 8px;font-size:.72rem;font-style:normal}.photo-join{background:radial-gradient(circle at 50% 40%,oklch(64% .14 245/.45),#0000 55%),oklch(23% .04 255);align-content:center;gap:14px}.wifi{width:42%;overflow:visible}.wifi path{fill:none;stroke:oklch(95% .02 240);stroke-width:5.5px;stroke-linecap:round}.wifi circle{fill:oklch(95% .02 240)}.joined{color:oklch(85% .14 150);font-family:var(--font-mono);letter-spacing:.08em;text-transform:uppercase;border:2px solid oklch(80% .14 150);border-radius:999px;padding:4px 12px;font-size:.8rem}.app{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);align-items:center;gap:clamp(32px,6vw,80px);padding-bottom:clamp(80px,11vw,150px);display:grid}.big-print{background:var(--print);box-shadow:var(--shadow);margin:0;padding:clamp(10px,1.6vw,18px) clamp(10px,1.6vw,18px) 0;position:relative;transform:rotate(-1.2deg)}.big-print img{width:100%;height:auto}.big-print figcaption{color:var(--print-soft);font-family:var(--font-hand);padding:12px 4px 16px;font-size:1.35rem}.tape-l{left:12%;transform:translate(-50%)rotate(-8deg)}.tape-r{left:88%;transform:translate(-50%)rotate(6deg)}.stamp{background:var(--print);border:3px solid var(--stamp);color:var(--stamp);font-family:var(--font-mono);letter-spacing:.12em;text-align:center;text-transform:uppercase;mix-blend-mode:multiply;border-radius:8px;padding:8px 14px;font-size:clamp(.7rem,1.1vw,.88rem);font-weight:600;line-height:1.25;position:absolute;bottom:-18px;right:clamp(-28px,-2vw,-8px);transform:rotate(-9deg);mask:radial-gradient(circle at 30% 40%,#000 60%,#000b 75%,#000 90%)}:root[data-theme=dark] .stamp{mix-blend-mode:normal}.notes ul{gap:16px;margin:28px 0 0;padding:0;list-style:none;display:grid}.notes li{color:var(--ink-soft);padding-left:34px;position:relative}.notes li:before{content:"";background:var(--blue);width:20px;height:14px;position:absolute;top:.3em;left:0;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 14'%3E%3Cpath d='M2 7.5c2 1 3.5 2.8 5 5C9.5 7 13.5 3 18.5 1.5' fill='none' stroke='black' stroke-width='3' stroke-linecap='round'/%3E%3C/svg%3E") 50%/contain no-repeat}.install{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start;gap:clamp(32px,6vw,80px);padding-bottom:clamp(72px,10vw,120px);display:grid}.install-copy{position:sticky;top:32px}.install-copy p{max-width:30rem;color:var(--ink-soft);margin:20px 0 30px}.receipt{--tooth:9px;color:var(--print-ink);background:var(--print);font-family:var(--font-mono);box-shadow:var(--shadow);mask:conic-gradient(from 135deg at top, #0000, #000 1deg 89deg, #0000 90deg) top / calc(var(--tooth) * 2) 51% repeat-x, conic-gradient(from -45deg at bottom, #0000, #000 1deg 89deg, #0000 90deg) bottom / calc(var(--tooth) * 2) 51% repeat-x;padding:32px clamp(20px,3vw,32px) 40px;font-size:.86rem;line-height:1.55;transform:rotate(1deg)}.receipt p{margin:0}.receipt-head{letter-spacing:.1em;text-align:center;border-bottom:1.5px dashed oklch(27% .045 255/.35);padding:4px 0 10px;font-weight:600}.receipt ol{counter-reset:step;gap:14px;margin:16px 0 28px;padding:0;list-style:none;display:grid}.receipt li{counter-increment:step;grid-template-columns:2.4em minmax(0,1fr);display:grid}.receipt li:before{content:counter(step, decimal-leading-zero);color:var(--print-soft);grid-row:span 2}.receipt li span{color:var(--print-soft)}.receipt-note{color:var(--print-soft);margin-top:14px!important}.command{border:1.5px solid oklch(27% .045 255/.3);border-radius:6px;align-items:stretch;margin:12px 0 30px;display:flex}.command code{white-space:nowrap;flex:1;min-width:0;padding:10px 12px;font-size:.8rem;overflow-x:auto}.command button{color:var(--print-ink);font:inherit;cursor:pointer;background:oklch(27% .045 255/.06);border:0;border-left:1.5px solid oklch(27% .045 255/.3);padding:0 14px;font-size:.78rem;font-weight:600}.command button:hover{background:oklch(27% .045 255/.12)}.receipt-foot{color:var(--print-soft);letter-spacing:.14em;text-align:center;border-top:1.5px dashed oklch(27% .045 255/.35);padding-top:12px}.footer{max-width:1180px;padding:28px var(--gutter) 40px;border-top:1.5px dashed var(--line);color:var(--ink-soft);flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:8px 24px;margin:0 auto;font-size:.94rem;display:flex}.footer p{margin:0}.footer .scribble a{color:inherit}@media (width<=900px){.hero,.app,.install{grid-template-columns:minmax(0,1fr)}.camera{width:min(78%,340px);padding-bottom:170px}.install-copy{position:static}}@media (width<=720px){.bar nav a:not(:last-of-type){display:none}.prints{grid-template-columns:minmax(0,1fr);gap:40px;max-width:340px;margin:0 auto}.print-2,.print-3{transform:rotate(1.6deg)}.print-3{transform:rotate(-1.4deg)}.stamp{right:6px}}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.ticket{animation:none;transform:none}.squiggle path{stroke-dashoffset:0;animation:none}.scanline{animation:none}.print,.shutter,.theme-toggle{transition:none}}
