:root{--sky-top: #c3e5f8;--sky-bottom: #7bccf8;--yellow: #fefe9a;--brown: #382019;--brown-soft: #5a3a2f;--white: #ffffff;--slot: #d9d9d9;--danger: #a3281a;--radius: 20px;--font: "Poppins", system-ui, -apple-system, "Segoe UI", sans-serif;color-scheme:light}*,*:before,*:after{box-sizing:border-box}html,body{margin:0}body{min-height:100dvh;background:linear-gradient(to bottom,var(--sky-top),var(--sky-bottom)) fixed;color:var(--brown);font-family:var(--font);font-weight:500;-webkit-tap-highlight-color:transparent}main{max-width:480px;margin:0 auto;padding:max(16px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(16px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left))}.screen{min-height:calc(100dvh - 32px);display:flex;flex-direction:column;align-items:center;gap:16px}[hidden]{display:none!important}.btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:0;border-radius:999px;min-height:52px;padding:0 28px;font:700 17px/1 var(--font);cursor:pointer;transition:transform .12s ease,box-shadow .12s ease}.btn:active{transform:translateY(3px)}.btn:disabled{opacity:.6;cursor:default}.btn:focus-visible,.btn-icon:focus-visible,.shutter:focus-visible,.filter:focus-visible,.review-photo:focus-visible{outline:3px solid var(--brown);outline-offset:3px}.btn-primary{background:var(--brown);color:var(--white);box-shadow:0 5px 0 var(--yellow)}.btn-primary:active{box-shadow:0 2px 0 var(--yellow)}.btn-secondary{background:var(--white);color:var(--brown);box-shadow:inset 0 0 0 2px var(--brown),0 5px 0 var(--yellow)}.btn-lg{width:100%;min-height:58px;font-size:19px}.btn-link{background:none;color:var(--brown);text-decoration:underline;text-underline-offset:4px;min-height:48px}.btn-icon{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:52px;height:52px;border:0;border-radius:50%;background:var(--white);color:var(--brown);display:grid;place-items:center;cursor:pointer;box-shadow:0 4px 0 var(--yellow)}.btn-icon:disabled{opacity:.5}.btn-icon-spacer{width:52px}.screen-start{justify-content:center;text-align:center;gap:12px}.logo{width:min(300px,80vw);height:auto}.tagline{margin:0;font-size:13px}.title{margin:20px 0 28px;font-weight:900;font-style:italic;font-size:clamp(40px,12vw,56px);line-height:1;-webkit-text-stroke:10px var(--yellow);paint-order:stroke fill}.note{margin:8px 0 0;font-size:13px;color:var(--brown-soft)}.error{margin:0;padding:12px 16px;border-radius:14px;background:var(--white);color:var(--danger);font-size:14px;line-height:1.4}.screen-camera{justify-content:center}.step{margin:0;font-weight:700;font-size:18px}.viewfinder{position:relative;width:100%;aspect-ratio:337 / 293;border:7px solid var(--yellow);border-radius:var(--radius);background:var(--slot);overflow:hidden}.viewfinder video,.viewfinder .still{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover;display:block}.viewfinder video.mirrored{transform:scaleX(-1)}.countdown{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;pointer-events:none;font-weight:900;font-style:italic;font-size:110px;color:var(--brown);-webkit-text-stroke:14px var(--yellow);paint-order:stroke fill}.countdown.tick{animation:tick .9s ease-out}@keyframes tick{0%{transform:scale(1.4);opacity:0}25%{transform:scale(1);opacity:1}to{transform:scale(.9);opacity:.2}}.flash{position:absolute;top:0;right:0;bottom:0;left:0;background:var(--white);opacity:0;pointer-events:none}.flash.on{animation:flash .45s ease-out}@keyframes flash{0%{opacity:.95}to{opacity:0}}.thumbs{display:flex;gap:10px}.thumb{width:64px;aspect-ratio:337 / 293;border-radius:10px;background:#ffffff80;display:grid;place-items:center;font-weight:700;overflow:hidden;border:3px solid transparent}.thumb.is-current{border-color:var(--brown)}.thumb canvas{width:100%;height:100%;display:block;object-fit:cover}.controls{width:100%;display:flex;align-items:center;justify-content:space-between;padding:0 8px}.controls-confirm{gap:12px;padding:0}.controls-confirm .btn{flex:1}.shutter{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:80px;height:80px;border-radius:50%;border:6px solid var(--brown);background:var(--white);box-shadow:0 0 0 5px var(--yellow);cursor:pointer;transition:transform .12s ease}.shutter:active{transform:scale(.92)}.shutter:disabled{opacity:.6}.screen-review{justify-content:center}.review-grid{display:flex;gap:16px;align-items:center;justify-content:center;width:100%}.strip-preview{height:min(54dvh,560px);width:auto;border-radius:10px;box-shadow:0 8px 24px #38201940}.review-photos{display:flex;flex-direction:column;gap:12px;flex:0 1 150px}.review-photo{-webkit-appearance:none;-moz-appearance:none;appearance:none;padding:0;border:0;background:none;color:var(--brown);font:700 13px/1 var(--font);display:flex;flex-direction:column;align-items:center;gap:6px;cursor:pointer}.review-photo canvas{width:100%;height:auto;border-radius:10px;border:4px solid var(--yellow);display:block}.filters{display:flex;gap:10px;width:calc(100% + 32px);margin:0 -16px;padding:4px 16px 8px;overflow-x:auto;scroll-snap-type:x proximity;scrollbar-width:none}.filters::-webkit-scrollbar{display:none}.filter{-webkit-appearance:none;-moz-appearance:none;appearance:none;flex:0 0 auto;padding:0;border:0;background:none;color:var(--brown);font:500 12px/1 var(--font);display:flex;flex-direction:column;align-items:center;gap:6px;cursor:pointer;scroll-snap-align:start}.filter canvas{width:68px;height:auto;border-radius:10px;border:3px solid transparent;display:block}.filter[aria-checked=true] canvas{border-color:var(--brown)}.filter[aria-checked=true] span{font-weight:700}.screen-result{justify-content:center}.result-img{max-height:min(66dvh,760px);max-width:100%;height:auto;border-radius:12px;box-shadow:0 10px 28px #38201947}.result-actions{display:flex;gap:12px;width:100%}.result-actions .btn{flex:1}@media(min-width:720px){main{max-width:560px}}@media(prefers-reduced-motion:reduce){.countdown.tick,.flash.on{animation:none}.btn,.shutter{transition:none}}