:root{--bg:#fbfbfa;--surface:#f7f6f3;--card:#fff;--line:#eaeaea;--text:#111;--text-2:#2f3437;--muted:#787774;--danger:#9f2f2d;--sans:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica Neue", sans-serif;--mono:"JetBrains Mono", "SF Mono", ui-monospace, monospace;--duration-stagger:40ms;--duration-micro:80ms;--duration-quick:.15s;--duration-fast:.25s;--duration-medium:.35s;--duration-slow:.4s;--duration-very-slow:.5s;--ease-smooth-out:cubic-bezier(.22, 1, .36, 1);--ease-in-out:ease-in-out;--ease-out:ease-out;--ease-linear:linear;--ease-bounce:cubic-bezier(.34, 1.36, .64, 1);--ease-bounce-strong:cubic-bezier(.34, 3.85, .64, 1);--distance-micro:4px;--distance-small:6px;--distance-base:8px;--distance-medium:12px;--distance-large:30px;--scale-large:.96;--scale-medium:.97;--scale-small:.98;--scale-tiny:.99;--blur-small:2px;--blur-medium:3px;--blur-large:8px;--ease:var(--ease-smooth-out);--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}*{box-sizing:border-box}html,body{margin:0}html{scroll-behavior:smooth}body{background:var(--bg);color:var(--text-2);font:15px/1.5 var(--sans);-webkit-font-smoothing:antialiased}button,input{font:inherit;color:inherit}.page{max-width:1240px;min-height:100dvh;padding:24px max(16px, env(safe-area-inset-right)) 64px max(16px, env(safe-area-inset-left));margin:0 auto}.masthead{margin-bottom:28px}.wordmark{color:var(--text);font:700 13px/1 var(--mono);letter-spacing:.14em;transition:opacity var(--duration-fast) var(--ease-bounce-strong);align-items:center;gap:8px;text-decoration:none;display:inline-flex}.wordmark:hover{opacity:.68;transition-timing-function:var(--ease-smooth-out)}.wordmark-glyph{width:13.5px;height:18px;transition:transform var(--duration-fast) var(--ease-bounce-strong)}.wordmark:hover .wordmark-glyph{transition-timing-function:var(--ease-smooth-out);transform:rotate(-4deg)}.hero{margin-bottom:72px}.hero h1{max-width:17ch;color:var(--text);font:500 clamp(30px, 5.2vw, 52px)/1.12 var(--mono);letter-spacing:-.035em;margin:0}.hero-sub{max-width:46ch;color:var(--muted);margin:14px 0 26px;font-size:16px}.btn{border:1px solid var(--line);background:var(--card);min-height:38px;color:var(--text);font-family:var(--mono);letter-spacing:.08em;text-transform:uppercase;cursor:pointer;transition:transform var(--duration-medium) var(--ease-bounce-strong), background-color var(--duration-fast) var(--ease-smooth-out), border-color var(--duration-fast) var(--ease-smooth-out), opacity var(--duration-quick) var(--ease-smooth-out);border-radius:6px;justify-content:center;align-items:center;gap:12px;padding:8px 16px;font-size:12px;font-weight:500;display:inline-flex}.btn:hover{background:var(--surface);transition-duration:var(--duration-fast);transition-timing-function:var(--ease-smooth-out);transform:translateY(-1px)}.btn:active{transform:translateY(0) scale(var(--scale-small));transition-duration:var(--duration-quick)}.btn:disabled{opacity:.45;cursor:default;transform:none}.btn-primary{border-color:var(--text);background:var(--text);color:#fff}.btn-primary:hover{background:#2a2a2a}.btn:focus-visible,.segmented button:focus-visible,.link:focus-visible,.text:focus-visible{outline:2px solid var(--text);outline-offset:2px}.link{color:var(--text);text-underline-offset:3px;cursor:pointer;transition:text-decoration-color var(--duration-quick) var(--ease-smooth-out);background:0 0;border:0;padding:0;-webkit-text-decoration:underline #c9c8c4;text-decoration:underline #c9c8c4}.link:hover{text-decoration-color:currentColor}.link.danger{color:var(--danger)}.segmented{border:1px solid var(--line);background:var(--surface);border-radius:6px;flex-wrap:wrap;padding:2px;display:inline-flex}.segmented button{min-height:30px;color:var(--muted);font-family:var(--mono);letter-spacing:.06em;text-transform:uppercase;cursor:pointer;transition:background-color var(--duration-fast) var(--ease-smooth-out), color var(--duration-fast) var(--ease-smooth-out), transform var(--duration-quick) var(--ease-smooth-out);background:0 0;border:0;border-radius:4px;padding:4px 12px;font-size:11px;font-weight:500}.segmented button:hover{color:var(--text)}.segmented button:active{transform:scale(var(--scale-small))}.segmented button.on{background:var(--card);color:var(--text);box-shadow:0 0 0 1px var(--line)}.text{border:1px solid var(--line);background:var(--card);width:100%;min-height:38px;color:var(--text);transition:border-color var(--duration-fast) var(--ease-smooth-out);border-radius:6px;padding:8px 10px}.text:hover{border-color:#dcdbd7}.text::placeholder{color:#aaa9a5}.note{color:var(--muted);margin:10px 0 0;font-size:13px}.note.quiet{margin-top:18px}.note.error{color:var(--danger)}.note.done{color:var(--text-2)}.muted{color:var(--muted);font-weight:400}.eyebrow{color:var(--muted);font:500 11px/1 var(--mono);letter-spacing:.16em;margin:0 0 10px}.dropzone{background:var(--card);text-align:center;min-height:min(38dvh,340px);transition:background-color var(--duration-fast) var(--ease-smooth-out), border-color var(--duration-fast) var(--ease-smooth-out), transform var(--duration-slow) var(--ease-smooth-out);border:1px dashed #d6d5d1;border-radius:8px;place-items:center;display:grid}.dropzone.over{border-color:var(--text);background:var(--surface);transform:scale(1.004)}.dropzone-inner{padding:32px 16px}.drop-title{color:var(--text);font:500 clamp(20px, 3vw, 26px)/1.2 var(--mono);letter-spacing:-.02em;animation:rise-in var(--duration-slow) var(--ease-smooth-out) both;margin:0}.dropzone .btn{margin-top:22px}.drop-veil{z-index:10;border:1px dashed var(--text);color:var(--text);font:500 20px var(--mono);letter-spacing:.06em;text-transform:uppercase;pointer-events:none;animation:rise-in var(--duration-quick) var(--ease-smooth-out);background:#fbfbfaeb;border-radius:8px;place-items:center;display:grid;position:fixed;inset:12px}@keyframes fade-in{0%{opacity:0}}@keyframes rise-in{0%{opacity:0;transform:translateY(var(--distance-base));filter:blur(var(--blur-medium))}}.studio{animation:rise-in var(--duration-slow) var(--ease-smooth-out) both;grid-template-columns:minmax(0,1fr) 320px;align-items:start;gap:32px;scroll-margin-top:16px;display:grid}.toolbar{align-items:center;gap:12px;margin-bottom:12px;display:flex}.loading{color:var(--muted);font:12px var(--mono)}.frame{border-radius:4px}.frame-fit{max-width:min(100%,70.7317dvh - 141.463px);margin:0 auto}.frame-close{overscroll-behavior:contain;border:1px solid var(--line);background:var(--surface);max-height:calc(100dvh - 200px);overflow:auto}.sheet{transition:box-shadow var(--duration-slow) var(--ease-smooth-out);display:block;box-shadow:0 1px 2px #0000000f,0 8px 24px #0000000f}.frame-close .sheet{box-shadow:none;margin:0 auto}.photos{border-top:1px solid var(--line);margin-top:24px;padding-top:16px}.photos-head{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;display:flex}.photos-head p{color:var(--text);margin:0}.photos-actions{gap:8px;display:flex}.thumbs{grid-template-columns:repeat(auto-fill,minmax(72px,1fr));gap:6px;max-height:420px;margin:14px 0 12px;padding:0;list-style:none;display:grid;overflow:auto}.thumb{aspect-ratio:3/4;background:var(--surface);transition:transform var(--duration-medium) var(--ease-bounce-strong);border-radius:3px;position:relative;overflow:hidden}.thumb:hover{transition-duration:var(--duration-fast);transition-timing-function:var(--ease-smooth-out);transform:scale(1.04)}.thumb img{object-fit:cover;width:100%;height:100%;animation:rise-in var(--duration-fast) var(--ease-smooth-out)}.thumb-remove{color:#fff;cursor:pointer;opacity:0;width:22px;height:22px;transition:opacity var(--duration-quick) var(--ease-smooth-out);background:#111111b8;border:0;border-radius:4px;font-size:15px;line-height:1;position:absolute;top:3px;right:3px}.thumb:hover .thumb-remove,.thumb-remove:focus-visible{opacity:1}@media (hover:none){.thumb-remove{opacity:1}}.panel{border:1px solid var(--line);background:var(--card);border-radius:8px;padding:20px;position:sticky;top:16px}.field{flex-direction:column;align-items:flex-start;margin-bottom:14px;display:flex}.field>span{color:var(--muted);font:500 10px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;margin-bottom:6px}.facts{border-top:1px solid var(--line);margin:18px 0 0;padding-top:12px;font-size:13px}.facts div{justify-content:space-between;gap:12px;padding:3px 0;display:flex}.facts dt{color:var(--muted)}.facts dd{color:var(--text);font-family:var(--mono);margin:0;font-size:12px}.buy{border-top:1px solid var(--line);flex-direction:column;gap:8px;margin-top:18px;padding-top:16px;display:flex}.buy .btn{justify-content:space-between;width:100%;min-height:44px}.buy .note{margin-top:2px}.price{font-family:var(--mono);letter-spacing:0;font-size:12px}.job{animation:rise-in var(--duration-fast) var(--ease-smooth-out);flex-direction:column;align-items:flex-start;gap:10px;display:flex}.job .note{color:var(--text-2);font-family:var(--mono);margin:0;font-size:12px}.bar{background:var(--line);border-radius:2px;width:100%;height:3px;overflow:hidden}.bar div{background:var(--text);transform-origin:0;height:100%;transition:transform var(--duration-fast) var(--ease-smooth-out)}.notice{border:1px solid var(--line);background:var(--card);animation:rise-in var(--duration-slow) var(--ease-smooth-out);border-radius:6px;justify-content:space-between;align-items:baseline;gap:16px;margin-bottom:20px;padding:12px 16px;display:flex}.notice p{color:var(--text);margin:0}.how{border-top:1px solid var(--line);margin-top:88px;padding-top:40px}.how-top{grid-template-columns:minmax(0,1fr) 300px;align-items:start;gap:56px;display:grid}.how-intro{max-width:58ch}.how h2{color:var(--text);font:500 clamp(22px, 3.4vw, 32px)/1.2 var(--mono);letter-spacing:-.03em;margin:0 0 14px}.how-intro p{color:var(--text-2);margin:0}.example{aspect-ratio:841/1189;border:1px solid var(--line);background:var(--card);border-radius:4px;flex-direction:column;width:min(100%,300px);margin:4px 0 44px;padding:12px 12px 10px;display:flex;box-shadow:0 1px 2px #0000000d,0 12px 32px #0000000f}.example-grid{grid-template-columns:repeat(8,1fr);gap:2px;display:grid}.example-grid span{aspect-ratio:3/4;background:var(--text);opacity:0;transform:scale(var(--scale-large));transition:opacity var(--duration-fast) var(--ease-smooth-out), transform var(--duration-fast) var(--ease-smooth-out)}.example-grid span:nth-child(3n){background:#3d3d3d}.example-grid span:nth-child(4n){background:#6a6a6a}.example-grid span:nth-child(7n){background:#9a9a9a}.example.in .example-grid span{opacity:1;transform:none}.example-words{margin-top:auto;padding-top:10px}.example-words strong{color:var(--text);font:700 11px/1.1 var(--mono);letter-spacing:.12em;display:block}.example-words span{color:var(--muted);font:9px/1.4 var(--mono);margin-top:3px;display:block}.steps{grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:24px;margin:0 0 40px;padding:0;list-style:none;display:grid}.steps li{border-top:1px solid var(--line);padding-top:14px}.step-n{color:var(--muted);font:500 11px var(--mono);letter-spacing:.1em}.steps h3{color:var(--text);font:500 15px/1.3 var(--mono);letter-spacing:-.02em;margin:8px 0 6px}.steps p{color:var(--muted);margin:0;font-size:13px}.sizes{grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px;margin:0;display:grid}.sizes div{border:1px solid var(--line);background:var(--card);border-radius:6px;padding:12px 14px}.sizes dt{color:var(--text);font:700 13px var(--mono);letter-spacing:.08em}.sizes dd{color:var(--muted);font:11px/1.5 var(--mono);margin:4px 0 0}@media (width<=899px){.hero{margin-bottom:56px}.studio{grid-template-columns:minmax(0,1fr);gap:24px}.panel{position:static}.frame-fit{max-width:100%}.frame-close{max-height:70dvh}.how{margin-top:64px}.how-top{grid-template-columns:minmax(0,1fr);gap:8px}}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,:before,:after{transition:none!important;animation:none!important}.example-grid span{opacity:1;transform:none}}