:root{--paper:#f8f6ef;--ink:#1f2430;--muted:#5d6272;--line:#1f243012;--rule:#1f24308c;--hand:"Bradley Hand", "Segoe Print", "Segoe Script", "Chalkboard SE", "Marker Felt", "Comic Sans MS", cursive;--sans:system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", sans-serif;font-family:var(--sans);color:var(--ink);background:var(--paper);--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;scroll-behavior:smooth}*{box-sizing:border-box}[hidden]{display:none!important}html,body{margin:0}body.landing{background-color:var(--paper);background-image:linear-gradient(var(--line) 1px, transparent 1px), linear-gradient(90deg, var(--line) 1px, transparent 1px);background-size:24px 24px;min-height:100vh;line-height:1.55;overflow-x:hidden}a{color:inherit}:focus-visible{outline:2px solid var(--ink);outline-offset:4px;border-radius:6px}.skip{z-index:100;background:var(--ink);color:var(--paper);padding:8px 12px;position:absolute;top:0;left:-999px}.skip:focus{left:8px}h1,h2,h3,p,ul{margin:0}ul{padding:0;list-style:none}svg path,svg rect,svg circle,svg ellipse,svg line{fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round}.art,.ico,.scrib{color:var(--ink);display:block;overflow:visible}.art path,.art rect,.art circle,.art ellipse{stroke-width:2.2px}.ico path,.ico rect,.ico circle,.ico ellipse{stroke-width:2.6px}.scrib path{stroke-width:2.4px}.btn{border:1.5px solid var(--ink);min-height:52px;color:var(--ink);font-family:var(--hand);cursor:pointer;background:0 0;border-radius:999px;justify-content:center;align-items:center;gap:12px;padding:10px 34px;font-size:1.25rem;text-decoration:none;transition:background .2s,color .2s;display:inline-flex}.btn:hover{background:var(--ink);color:var(--paper)}.btn-sm{gap:10px;min-height:40px;padding:6px 22px;font-size:1.05rem}.play{flex:none;width:12px;height:14px}.play path{fill:currentColor;stroke:none}.nav,.foot{align-items:center;gap:24px;max-width:1200px;margin:0 auto;padding:18px clamp(16px,4vw,40px);display:flex}.nav{border-bottom:1px solid var(--rule)}.brand{align-items:center;gap:12px;font-size:1.05rem;text-decoration:none;display:inline-flex}.brand small{color:var(--muted);font-size:1em}.logo{width:34px;height:34px;color:var(--ink);flex:none}.logo path{stroke-width:2.4px}.links{gap:clamp(18px,3vw,40px);margin-left:auto;margin-right:auto;display:flex}.links a{padding:4px 0;font-size:.92rem;text-decoration:none;position:relative}.links a:after{content:"";background:var(--ink);transform-origin:0;height:1.5px;transition:transform .25s;position:absolute;bottom:0;left:0;right:0;transform:scaleX(0)}.links a:hover:after{transform:scaleX(1)}h1,h2,h3,.lead,.sub{font-family:var(--hand);font-weight:400}h1{text-wrap:balance;letter-spacing:-.01em;font-size:clamp(2.3rem,4.2vw,3.9rem);line-height:1.05}h2{font-size:clamp(2.2rem,5.5vw,3.6rem);line-height:1.1}h3{font-size:1.4rem}.lead{font-family:var(--sans);color:var(--ink);font-size:clamp(1.05rem,1.8vw,1.25rem);line-height:1.5}.scrib{width:min(100%,360px);height:12px;margin:10px 0 22px}.scrib path{vector-effect:non-scaling-stroke}.sub{color:var(--muted);font-family:var(--sans);font-size:1.05rem}.section{max-width:1200px;margin:0 auto;padding:clamp(56px,9vw,110px) clamp(16px,4vw,40px)}.hero{grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);align-items:center;gap:clamp(24px,5vw,72px);max-width:1200px;margin:0 auto;padding:clamp(48px,8vw,110px) clamp(16px,4vw,40px) clamp(40px,6vw,80px);display:grid}.hero .lead{margin-bottom:30px}.art-hero{width:100%;height:auto}.head{margin-bottom:clamp(32px,5vw,56px)}.tools{grid-template-columns:repeat(4,minmax(0,1fr));display:grid}.tool{text-align:center;border-left:1px solid var(--rule);flex-direction:column;align-items:center;gap:6px;padding:8px 20px 12px;display:flex}.tool:first-child{border-left:0}.ico{width:92px;height:92px;margin-bottom:14px}.tool p{color:var(--muted);max-width:24ch;font-size:.92rem}.studio{grid-template-columns:minmax(0,.9fr) minmax(0,1.2fr);align-items:center;gap:clamp(24px,5vw,72px);display:grid}.studio .lead{max-width:30ch}.notes{color:var(--muted);flex-wrap:wrap;gap:8px 22px;margin-top:26px;font-size:.92rem;display:flex}.notes li:before{content:"—";margin-right:8px}.art-studio{width:100%;height:auto}.art text{fill:currentColor;stroke:none;font-family:var(--hand);font-size:19px}.art text.dim{opacity:.4;font-size:16px}.sung{stroke-width:3.5px;transform-box:fill-box;transform-origin:0;animation:5s ease-in-out infinite sing}@keyframes sing{0%{transform:scaleX(0)}85%,to{transform:scaleX(1)}}.final{border-top:1px solid var(--rule);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:28px 40px;max-width:1200px;margin:0 auto;padding:clamp(40px,6vw,72px) clamp(16px,4vw,40px) clamp(56px,8vw,100px);display:flex}.final .scrib{margin-bottom:14px}.hint{color:var(--muted);margin-top:4px;font-size:.9rem}.foot{border-top:1px solid var(--rule);flex-wrap:wrap;padding-block:26px 40px}.foot .links a{color:var(--muted);font-size:.85rem}.foot .links a:hover{color:var(--ink)}.legal{color:var(--muted);flex-basis:100%;font-size:.78rem}.draw path,.draw rect,.draw circle,.draw ellipse{stroke-dasharray:1;stroke-dashoffset:0}.js .reveal{opacity:0;transition:opacity .6s,transform .6s;transition-delay:var(--rd,0s);transform:translateY(16px)}.js .reveal.in{opacity:1;transform:none}.js .draw:not(.in) path,.js .draw:not(.in) rect,.js .draw:not(.in) circle,.js .draw:not(.in) ellipse,.js .reveal:not(.in) .draw path,.js .reveal:not(.in) .draw rect,.js .reveal:not(.in) .draw circle,.js .reveal:not(.in) .draw ellipse{stroke-dashoffset:1px}.js .draw.in path,.js .draw.in rect,.js .draw.in circle,.js .draw.in ellipse,.js .reveal.in .draw path,.js .reveal.in .draw rect,.js .reveal.in .draw circle,.js .reveal.in .draw ellipse{animation:1.4s ease-out both trace}@keyframes trace{0%{stroke-dashoffset:1px}}@media (max-width:900px){.hero,.studio{grid-template-columns:minmax(0,1fr)}.art-hero{max-width:480px;margin:0 auto}.tools{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:28px}.tool:nth-child(3){border-left:0}.links{display:none}.nav .btn{margin-left:auto}}@media (max-width:520px){.tools{grid-template-columns:minmax(0,1fr)}.tool{border-left:0;border-top:1px solid var(--rule);padding-block:18px}.tool:first-child{border-top:0}.nav,.foot{gap:14px}.brand{gap:8px}.brand span{font-size:.88rem}.logo{width:28px;height:28px}.btn{padding-inline:26px}}@media (prefers-reduced-motion:reduce){:root{scroll-behavior:auto}.sung{transform:none}*,:before,:after{transition:none!important;animation:none!important}.js .reveal{opacity:1;transform:none}.js .draw path,.js .draw rect,.js .draw circle,.js .draw ellipse{stroke-dashoffset:0!important}}
