@import"https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Manrope:wght@400;500;600;700&family=Playfair+Display:ital,wght@1,600&display=swap";:root{color:#f3f5ef;background:#0d1514;font-family:Manrope,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility;--ink: #f3f5ef;--muted: #98a5a0;--panel: #111d1b;--line: rgba(224, 238, 231, .15);--accent: #89ffd6;--accent-soft: rgba(137, 255, 214, .12);--danger: #ff9a8e}*{box-sizing:border-box}html{min-width:320px;background:#0d1514}body{margin:0;min-width:320px;min-height:100vh;min-height:100svh;background:radial-gradient(circle at 0% 0%,rgba(42,91,77,.3),transparent 35rem),#0d1514}button,select{font:inherit}button{-webkit-tap-highlight-color:transparent}.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}.app-shell{min-height:100vh;min-height:100svh;padding:max(1rem,env(safe-area-inset-top)) 1rem max(1rem,env(safe-area-inset-bottom))}.topbar{align-items:center;display:flex;justify-content:space-between;margin:0 auto 1rem;max-width:1440px}.brand{align-items:center;color:var(--ink);display:inline-flex;gap:.65rem;text-decoration:none}.brand-mark{align-items:center;border:1px solid rgba(137,255,214,.45);border-radius:50%;color:var(--accent);display:inline-flex;font-family:Playfair Display,serif;font-size:1.25rem;font-style:italic;height:2.35rem;justify-content:center;line-height:1;width:2.35rem}.brand-copy{display:grid;line-height:1}.brand-copy strong{font-size:.83rem;letter-spacing:.24em}.brand-copy small{color:var(--muted);font-family:DM Mono,monospace;font-size:.52rem;letter-spacing:.14em;margin-top:.3rem}.camera-controls{align-items:center;display:flex;gap:.45rem}.camera-select,.icon-button{background:#ffffff0a;border:1px solid var(--line);color:var(--ink);height:2.7rem}.camera-select{align-items:center;border-radius:999px;display:flex;max-width:11rem;padding:0 .55rem 0 .9rem}.camera-select select{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;border:0;color:inherit;cursor:pointer;font-size:.68rem;font-weight:600;letter-spacing:.04em;min-width:0;outline:0;overflow:hidden;padding-right:.25rem;text-overflow:ellipsis;width:100%}.camera-select svg{color:var(--muted);flex:0 0 auto}.icon-button{align-items:center;border-radius:50%;cursor:pointer;display:inline-flex;justify-content:center;padding:0;transition:background .16s ease,border-color .16s ease,transform .16s ease;width:2.7rem}.icon-button:active{transform:scale(.94)}.icon-button:disabled,.camera-select:has(select:disabled){cursor:wait;opacity:.5}.content{display:grid;gap:1.35rem;margin:0 auto;max-width:1440px}.intro{display:none}.camera-column{min-width:0}.camera-stage{aspect-ratio:3 / 4;background:#131c1a;border:1px solid var(--line);border-radius:1.2rem;isolation:isolate;max-height:calc(100svh - 8rem);min-height:26rem;overflow:hidden;position:relative}.camera-feed,.landmark-layer,.earring-layer,.necklace-layer,.stage-vignette{height:100%;top:0;right:0;bottom:0;left:0;position:absolute;width:100%}.camera-feed,.landmark-layer,.earring-layer,.necklace-layer{object-fit:cover}.camera-feed{background:#111b19}.is-mirrored{transform:scaleX(-1)}.landmark-layer{pointer-events:none;z-index:2}.earring-layer{pointer-events:none;transition:opacity .12s ease;z-index:3}.necklace-layer{pointer-events:none;transition:opacity .12s ease;z-index:2}.earring-layer.is-hidden,.necklace-layer.is-hidden{opacity:0}.debug-landmark-layer{display:none}.stage-vignette{background:linear-gradient(180deg,rgba(3,8,7,.5),transparent 20%,transparent 72%,rgba(3,8,7,.72)),radial-gradient(circle at center,transparent 55%,rgba(2,8,7,.4) 100%);pointer-events:none;z-index:4}.scan-frame{top:5.2rem;right:1.1rem;bottom:4.8rem;left:1.1rem;pointer-events:none;position:absolute;z-index:5}.corner{border-color:#89ffd680;border-style:solid;height:1.35rem;position:absolute;width:1.35rem}.corner--tl{border-width:1px 0 0 1px;left:0;top:0}.corner--tr{border-width:1px 1px 0 0;right:0;top:0}.corner--bl{border-width:0 0 1px 1px;bottom:0;left:0}.corner--br{border-width:0 1px 1px 0;bottom:0;right:0}.stage-status{left:.85rem;position:absolute;right:.85rem;top:.85rem;z-index:6}.tracking-status{align-items:center;display:flex;gap:.4rem}.status-pill,.metric-pill{align-items:center;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:#050c0ba8;border:1px solid rgba(255,255,255,.13);border-radius:999px;display:inline-flex;font-family:DM Mono,monospace;min-height:2rem}.status-pill{gap:.45rem;padding:.42rem .7rem;text-transform:uppercase;font-size:.58rem;letter-spacing:.07em}.status-dot{background:var(--muted);border-radius:50%;height:.38rem;width:.38rem}.status-pill--tracking .status-dot{background:var(--accent);box-shadow:0 0 0 4px #89ffd61f,0 0 10px var(--accent)}.status-pill--initializing .status-dot{animation:pulse 1s ease-in-out infinite;background:#ffe19a}.status-pill--error .status-dot{background:var(--danger)}.metric-pill{gap:.22rem;padding:.35rem .6rem}.metric-value{color:var(--accent);font-size:.7rem;font-weight:500}.metric-label{color:var(--muted);font-size:.52rem;text-transform:uppercase}.metric-pill--landmarks{display:none}.stage-message{align-items:center;color:var(--ink);display:flex;flex-direction:column;inset:50% auto auto 50%;max-width:17rem;position:absolute;text-align:center;transform:translate(-50%,-50%);width:calc(100% - 3rem);z-index:6}.message-icon{align-items:center;background:var(--accent-soft);border:1px solid rgba(137,255,214,.25);border-radius:50%;color:var(--accent);display:flex;height:4rem;justify-content:center;margin-bottom:1rem;width:4rem}.stage-message strong{font-size:1rem;margin-bottom:.45rem}.stage-message span{color:var(--muted);font-size:.75rem;line-height:1.55}.stage-message.is-error .message-icon{background:#ff9a8e14;border-color:#ff9a8e40;color:var(--danger)}.position-hint{bottom:1rem;color:#ffffffbf;font-size:.66rem;left:50%;letter-spacing:.04em;position:absolute;transform:translate(-50%);white-space:nowrap;z-index:6}.privacy-note{color:var(--muted);font-family:DM Mono,monospace;font-size:.52rem;letter-spacing:.02em;line-height:1.5;margin:.7rem 0 0;text-align:center}.product-picker{background:#ffffff06;border:1px solid var(--line);border-radius:1rem;margin-top:.75rem;padding:.8rem}.product-picker__header{align-items:center;display:flex;justify-content:space-between;margin-bottom:.7rem;padding:0 .15rem}.product-picker__header>div{display:grid;gap:.15rem}.product-picker__header span,.product-card small{color:var(--muted);font-family:DM Mono,monospace;font-size:.5rem;letter-spacing:.08em;text-transform:uppercase}.product-picker__header strong{font-size:.76rem}.product-count{white-space:nowrap}.product-list{display:grid;gap:.5rem;grid-auto-columns:minmax(8.8rem,1fr);grid-auto-flow:column;overflow-x:auto;padding-bottom:.1rem;scrollbar-width:none}.product-list::-webkit-scrollbar{display:none}.product-card{align-items:center;background:#ffffff06;border:1px solid var(--line);border-radius:.75rem;color:var(--ink);cursor:pointer;display:grid;gap:.55rem;grid-template-columns:2.65rem 1fr .55rem;min-width:0;padding:.45rem;text-align:left;transition:background .16s ease,border-color .16s ease}.product-card.is-selected{background:var(--accent-soft);border-color:#89ffd673}.product-card__image{align-items:center;background:radial-gradient(circle,rgba(255,255,255,.1),transparent 65%),#02080759;border-radius:.55rem;display:flex;height:2.65rem;justify-content:center}.product-card__image img{height:2.35rem;object-fit:contain;width:2rem}.product-card__copy{display:grid;gap:.18rem;min-width:0}.product-card__copy strong{font-size:.62rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.product-card__check{border:1px solid var(--line);border-radius:50%;height:.52rem;width:.52rem}.product-card.is-selected .product-card__check{background:var(--accent);border-color:var(--accent);box-shadow:0 0 0 3px #89ffd61a}.production-shell{min-height:100vh;min-height:100svh;padding:max(.75rem,env(safe-area-inset-top)) .75rem max(.75rem,env(safe-area-inset-bottom))}.production-try-on{margin:0 auto;max-width:64rem}.production-try-on .camera-stage{max-height:calc(100svh - 13rem);min-height:24rem}.try-on-controls{display:grid;gap:.6rem;grid-template-columns:1fr 1fr;margin-top:.75rem}.production-control{align-items:center;background:#ffffff09;border:1px solid var(--line);border-radius:999px;color:var(--ink);cursor:pointer;display:flex;font-size:.68rem;font-weight:600;gap:.5rem;justify-content:center;min-height:3rem;touch-action:none;transition:background .15s ease,border-color .15s ease,transform .15s ease}.production-control--capture{background:var(--accent);border-color:var(--accent);color:#07120f}.production-control[aria-pressed=true]{background:#ffffff1f;border-color:#fff6}.production-control:active{transform:scale(.98)}.production-control:disabled{cursor:not-allowed;opacity:.38}.fit-controls{-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#0a1211b3;border:1px solid rgba(255,255,255,.1);border-radius:1rem;bottom:max(.75rem,env(safe-area-inset-bottom));left:.75rem;padding:.7rem;position:sticky;right:.75rem;z-index:12}.fit-controls__row{display:grid;gap:.45rem;grid-template-columns:repeat(3,minmax(0,1fr))}.fit-controls__row+.fit-controls__row{margin-top:.45rem}.fit-controls__row--moves{grid-template-columns:repeat(4,minmax(0,1fr))}.fit-button{background:#ffffff0f;border:1px solid rgba(255,255,255,.12);border-radius:.8rem;color:var(--ink);cursor:pointer;font-size:.68rem;font-weight:600;min-height:2.85rem;transition:background .15s ease,border-color .15s ease,transform .15s ease}.fit-button:active{transform:scale(.98)}.fit-button:disabled{cursor:not-allowed;opacity:.4}.fit-button--reset{background:#89ffd61a;border-color:#89ffd647}@keyframes pulse{0%,to{opacity:.45;transform:scale(.8)}50%{opacity:1;transform:scale(1.15)}}@media(min-width:540px){.app-shell{padding-left:1.5rem;padding-right:1.5rem}.metric-pill--landmarks{display:inline-flex}.camera-stage{margin:0 auto;max-width:36rem}.product-list{grid-auto-columns:minmax(9rem,1fr)}.production-shell{padding-left:1.5rem;padding-right:1.5rem}.fit-controls{left:auto;margin-left:auto;max-width:32rem;right:auto}}@media(min-width:960px){.app-shell{display:flex;flex-direction:column;padding:1.5rem 2rem}.topbar{margin-bottom:1.5rem;width:100%}.content{align-items:center;flex:1;grid-template-columns:minmax(20rem,.8fr) minmax(30rem,1.2fr);width:100%}.intro{display:block;padding:2rem clamp(1rem,5vw,5rem) 2rem 1rem}.eyebrow{color:var(--accent);font-family:DM Mono,monospace;font-size:.6rem;letter-spacing:.16em;margin:0 0 1.2rem;text-transform:uppercase}.intro h1{font-size:clamp(3.5rem,6vw,6.8rem);font-weight:500;letter-spacing:-.075em;line-height:.92;margin:0}.intro h1 em{color:var(--accent);font-family:Playfair Display,serif;font-weight:600}.intro-copy{color:var(--muted);font-size:.82rem;line-height:1.7;margin:2rem 0 2.7rem;max-width:24rem}.feature-list{border-top:1px solid var(--line);margin:0;max-width:26rem}.feature-list div{align-items:center;border-bottom:1px solid var(--line);display:grid;grid-template-columns:2.6rem 1fr;padding:.85rem 0}.feature-list dt{color:var(--accent);font-family:DM Mono,monospace;font-size:.55rem}.feature-list dd{color:#c5cec9;font-size:.68rem;margin:0}.camera-stage{aspect-ratio:4 / 3;max-height:calc(100svh - 8.5rem);max-width:none;min-height:34rem}.scan-frame{top:5.2rem;right:1.4rem;bottom:4.8rem;left:1.4rem}.product-picker{padding:.7rem}.product-list{grid-auto-columns:1fr;grid-template-columns:repeat(3,minmax(0,1fr));overflow:visible}.production-try-on .camera-stage{aspect-ratio:4 / 3;min-height:26rem}.try-on-controls{margin-left:auto;max-width:24rem}.fit-controls{margin-left:auto;max-width:28rem}}@media(hover:hover){.icon-button:hover,.camera-select:hover{background:#89ffd612;border-color:#89ffd659}.product-card:hover{background:#89ffd60f;border-color:#89ffd64d}.production-control:not(:disabled):hover{background:#89ffd61a;border-color:#89ffd666}.production-control--capture:not(:disabled):hover{background:#adffe2;border-color:#adffe2}.fit-button:not(:disabled):hover{background:#89ffd61a;border-color:#89ffd64d}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}
