:root{color-scheme:light;--cream: #faf7f2;--paper: #fffdf9;--ink: #1c1816;--muted: #756b64;--line: #ded5cb;--terracotta: #b8662c;--action: #c63a21;--action-hover: #97290f;--shadow: 0 18px 50px rgba(70, 43, 30, .14);font-family:Manrope,system-ui,sans-serif;background:var(--cream);color:var(--ink)}*{box-sizing:border-box}html,body{min-height:100%}body{margin:0;background:linear-gradient(180deg,rgba(184,102,44,.08),transparent 28rem),var(--cream)}button,a,label,h1,p,span{-webkit-tap-highlight-color:transparent}button,.eyebrow,.picker-title,.product-group h2,.test-label,.camera-hint,.live-topline,.result-fabric{-webkit-user-select:none;user-select:none}button,input{font:inherit}button,a{touch-action:manipulation}.app-shell{width:min(100%,34rem);min-height:100dvh;margin:0 auto;display:flex;flex-direction:column;background:var(--paper);box-shadow:var(--shadow)}.brand-bar{min-height:4.5rem;padding:max(1rem,env(safe-area-inset-top)) 1.25rem .9rem;display:flex;align-items:center;justify-content:space-between;gap:1rem;border-bottom:1px solid var(--line)}.brand-logo{display:block;width:min(52vw,10.25rem);height:auto}.test-label{color:var(--muted);font-size:.72rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase}.screen{flex:1;padding:clamp(1.5rem,5vw,2.5rem) 1.25rem max(1.5rem,env(safe-area-inset-bottom))}.screen[hidden]{display:none!important}.screen--intro,.screen--error{display:flex;flex-direction:column}.screen--intro{gap:clamp(1.2rem,3vh,1.8rem)}.screen--error{justify-content:space-between;gap:3rem}.intro-copy{max-width:29rem}.eyebrow{margin:0 0 .65rem;color:var(--terracotta);font-size:.78rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase}h1{margin:0;font:700 clamp(2.15rem,9vw,3.55rem)/.98 "Bricolage Grotesque",sans-serif;letter-spacing:-.045em}.intro-copy>p:last-child,.screen--error div>p:last-child{max-width:29rem;margin:1rem 0 0;color:var(--muted);font-size:1rem;line-height:1.6}.fabric-picker{display:grid;gap:.8rem}.picker-title{margin:0 0 .1rem;color:var(--ink);font-size:.86rem;font-weight:700}.product-group{display:grid;grid-template-columns:5.6rem minmax(0,1fr);align-items:stretch;gap:.7rem}.product-group h2{margin:0;align-self:center;font:650 .82rem/1.2 Bricolage Grotesque,sans-serif;color:var(--muted)}.product-options{display:grid;grid-template-columns:1fr 1fr;gap:.55rem}.fabric-option{min-width:0;min-height:3.7rem;padding:.65rem .7rem;display:grid;align-content:center;gap:.14rem;border:1px solid var(--line);border-radius:.5rem;background:var(--paper);color:var(--ink);text-align:left;cursor:pointer;transition:border-color .18s ease,background .18s ease,transform .18s cubic-bezier(.2,.8,.2,1)}.fabric-option:hover{border-color:var(--action);background:#fff8f4}.fabric-option:active{transform:scale(.985)}.fabric-option:focus-visible{outline:3px solid rgba(198,58,33,.28);outline-offset:2px}.fabric-option__name{font:650 .95rem/1.1 Bricolage Grotesque,sans-serif}.fabric-option__detail{color:var(--muted);font-size:.68rem;line-height:1.25}.primary-action{width:100%;min-height:3.6rem;margin-top:auto;border:0;border-radius:.55rem;background:var(--action);color:#fff;font-weight:750;cursor:pointer;transition:transform .18s cubic-bezier(.2,.8,.2,1),background .18s ease}.primary-action:hover{background:var(--action-hover)}.primary-action:active{transform:scale(.985)}.primary-action:disabled{cursor:wait;opacity:.58}.primary-action:focus-visible,.icon-action:focus-visible,.new-recording:focus-visible,.download-action:focus-visible{outline:3px solid rgba(198,58,33,.28);outline-offset:3px}.privacy-note{margin:-1.25rem 0 0;color:var(--muted);font-size:.74rem;line-height:1.45;text-align:center}.screen--intro .privacy-note{margin-top:-.5rem}@media(max-height:43rem){.brand-bar{min-height:3.8rem;padding-top:max(.7rem,env(safe-area-inset-top))}.screen--intro{padding-top:1rem;gap:.9rem}.intro-copy .eyebrow{display:none}h1{font-size:1.9rem}.intro-copy>p:last-child{margin-top:.65rem;font-size:.86rem;line-height:1.4}.fabric-picker{gap:.55rem}.fabric-option{min-height:3.25rem}}.screen--camera,.screen--live{padding:0;display:flex;flex-direction:column;background:var(--ink)}.camera-stage{position:relative;flex:1;min-height:0;overflow:hidden;background:#181513}.camera-stage video{width:100%;height:100%;min-height:23rem;display:block;object-fit:cover}.screen--live .camera-stage video{object-fit:contain}.live-camera-preview{position:absolute;inset:0;z-index:1;transition:opacity .24s cubic-bezier(.2,.8,.2,1)}.loading-overlay{position:absolute;inset:0;z-index:3;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem;padding:2rem;background:#1c18164d;-webkit-backdrop-filter:blur(14px) saturate(.72);backdrop-filter:blur(14px) saturate(.72);color:#fff;text-align:center;pointer-events:none;transition:opacity .24s cubic-bezier(.2,.8,.2,1),visibility .24s step-end}.loading-overlay p{max-width:18rem;margin:0;font:650 1rem/1.45 Manrope,sans-serif;text-shadow:0 1px 12px rgba(0,0,0,.34);-webkit-user-select:none;user-select:none}.loading-spinner{width:2.7rem;height:2.7rem;fill:none;stroke:#fff;stroke-width:3;stroke-linecap:round;stroke-dasharray:88 32;animation:loading-spin .9s linear infinite}.screen--live.is-output-ready .loading-overlay,.screen--camera.is-aligning .loading-overlay{opacity:0;visibility:hidden;pointer-events:none}.window-guide{position:absolute;top:50%;left:50%;width:min(calc(100% - 2rem),38rem);aspect-ratio:16 / 9;transform:translate(-50%,-50%);border:1.5px solid rgba(255,255,255,.82);box-shadow:0 0 0 100vmax #1c181633}.window-guide span{position:absolute;width:1.15rem;height:1.15rem;border-color:#fff}.window-guide span:nth-child(1){top:-2px;left:-2px;border-top:3px solid;border-left:3px solid}.window-guide span:nth-child(2){top:-2px;right:-2px;border-top:3px solid;border-right:3px solid}.window-guide span:nth-child(3){bottom:-2px;left:-2px;border-bottom:3px solid;border-left:3px solid}.window-guide span:nth-child(4){right:-2px;bottom:-2px;border-right:3px solid;border-bottom:3px solid}.camera-topline,.live-topline{position:absolute;z-index:2;top:max(1rem,env(safe-area-inset-top));left:1rem;right:1rem;display:flex;align-items:center;justify-content:space-between;color:#fff}.camera-topline>span,.live-topline>span,.live-topline>strong,.result-fabric{padding:.48rem .7rem;background:#1c1816b8;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-radius:.35rem;font-size:.76rem;font-weight:700}.icon-action{width:2.65rem;height:2.65rem;border:0;border-radius:50%;background:#1c1816b8;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);color:#fff;font-size:1.75rem;line-height:1;cursor:pointer}.camera-hint{position:absolute;z-index:2;left:1rem;right:1rem;bottom:1rem;margin:0;padding:.68rem .8rem;background:#1c1816b8;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);color:#fff;font-size:.78rem;line-height:1.35;text-align:center;border-radius:.35rem}.camera-controls{display:none;padding:1rem 1.25rem max(1rem,env(safe-area-inset-bottom));background:var(--paper)}.screen--camera.is-aligning .camera-controls{display:block}.camera-controls .primary-action{margin:0}.camera-controls p{margin:.65rem 0 0;color:var(--muted);font-size:.72rem;text-align:center}.live-word{background:var(--action)!important}.screen--result{display:flex;flex-direction:column;gap:1.25rem;padding-top:1.25rem}.result-video-wrap{position:relative;flex:1;min-height:20rem;overflow:hidden;background:#181513;border-radius:.6rem}.result-video-wrap video{width:100%;height:100%;min-height:20rem;display:block;object-fit:contain}.result-fabric{position:absolute;top:.75rem;left:.75rem;color:#fff}.result-actions{display:grid;gap:.85rem}.result-actions .primary-action{margin:0}.download-action{min-height:3rem;display:flex;align-items:center;justify-content:center;gap:.55rem;border:1px solid var(--line);border-radius:.5rem;color:var(--ink);font-size:.86rem;font-weight:700;text-decoration:none}.download-action svg{width:1.15rem;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.new-recording{min-height:2.5rem;border:0;background:transparent;color:var(--muted);font-size:.78rem;text-decoration:underline;text-underline-offset:.2rem;cursor:pointer}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media(min-width:42rem){body{padding:2rem 0}.app-shell{min-height:calc(100dvh - 4rem);border-radius:.85rem;overflow:hidden}}@media(orientation:landscape){body[data-active-screen=camera],body[data-active-screen=live]{padding:0;overflow:hidden}body[data-active-screen=camera] .app-shell,body[data-active-screen=live] .app-shell{width:100vw;max-width:none;height:100dvh;min-height:100dvh;border-radius:0}body[data-active-screen=camera] .brand-bar,body[data-active-screen=live] .brand-bar{display:none}body[data-active-screen=camera] .screen--camera,body[data-active-screen=live] .screen--live{height:100dvh;min-height:0}body[data-active-screen=camera] .camera-stage video,body[data-active-screen=live] .camera-stage video{min-height:0}.window-guide{width:min(calc(100% - 2rem),calc((100dvh - 9rem) * 16 / 9),38rem)}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition-duration:.01ms!important}.loading-spinner{animation-duration:1.8s}}@keyframes loading-spin{to{transform:rotate(360deg)}}