:root{--bg:#fff;--surface:#f4f4f5;--text:#18181b;--muted:#71717a;--border:#e4e4e7;--accent:#111827;--accent-text:#fff;--applied:#16a34a;--error:#dc2626;--brand:#eb7724;--brand-hover:#d4661a;--radius:14px;--font:-apple-system, BlinkMacSystemFont, "Segoe UI", Tahoma, "Noto Sans Arabic", "Geeza Pro", Arial, sans-serif;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}*{box-sizing:border-box}html,body{background:var(--bg);height:100%;color:var(--text);font-family:var(--font);-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;margin:0}button{font:inherit;color:inherit;cursor:pointer}[hidden]{display:none!important}.vto{grid-template-rows:auto 1fr auto;height:100dvh;display:grid;overflow:hidden}.vto-top{padding:max(10px, env(safe-area-inset-top)) 16px 10px;border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;gap:12px;display:flex}.brand-logo{flex-shrink:0;width:auto;height:32px;display:block}.pd{flex-wrap:wrap;flex:1;align-items:baseline;gap:4px 8px;min-width:0;font-size:14px;display:flex}.pd-label{color:var(--muted)}.pd-value{font-variant-numeric:tabular-nums;font-size:16px}.pd-note{color:var(--muted);border:1px solid var(--border);border-radius:999px;padding:1px 8px;font-size:11px}.top-actions{flex-shrink:0;gap:8px;display:flex}.chip{border:1px solid var(--border);background:var(--bg);border-radius:999px;min-height:36px;padding:6px 12px;font-size:13px}.icon-btn{border:1px solid var(--border);background:var(--bg);border-radius:50%;place-items:center;width:36px;height:36px;display:grid}.vto-body{grid-template-rows:1fr auto;grid-template-areas:"stage""catalog";min-height:0;display:grid}.vto-stage-wrap{background:#0b0b0c;grid-area:stage;min-height:0;position:relative;overflow:hidden}.stage{width:100%;height:100%;position:absolute;top:0;left:0;transform:scaleX(-1)}.stage video,.stage canvas{width:100%;height:100%;display:block;position:absolute;inset:0}.stage .debug-canvas{pointer-events:none}.debug-panel{color:#e5e7eb;text-align:left;pointer-events:none;white-space:pre;direction:ltr;background:#000000b3;border-radius:8px;max-width:calc(100% - 16px);margin:0;padding:8px 10px;font:11px/1.35 ui-monospace,Consolas,monospace;position:absolute;top:8px;left:8px;overflow:hidden}.calib{z-index:5;color:#f4f4f5;text-align:left;background:#000000c7;border-radius:10px;gap:6px;width:min(300px,100% - 16px);padding:10px 12px;font-size:12px;display:grid;position:absolute;bottom:40px;right:8px}.calib-row{gap:2px;display:grid}.calib input[type=number]{font:inherit;color:inherit;background:#18181b;border:1px solid #52525b;border-radius:6px;padding:4px 6px}.calib-actions{flex-wrap:wrap;gap:6px;display:flex}.calib-actions button{color:inherit;background:#27272a;border:1px solid #71717a;border-radius:6px;padding:5px 9px;font-size:12px}.calib-status{color:#a1a1aa}.face-hint{inset-inline:0;color:#fff;text-align:center;opacity:0;pointer-events:none;background:#0009;border-radius:999px;width:max-content;max-width:calc(100% - 32px);margin:auto;padding:10px 18px;font-size:15px;transition:opacity .25s;position:absolute;top:45%}.face-hint.visible{opacity:1}.status{color:#fff;text-align:center;background:#0b0b0cd9;flex-direction:column;justify-content:center;align-items:center;gap:12px;padding:24px;display:flex;position:absolute;inset:0}.status p{max-width:32ch;margin:0;line-height:1.5}.status.error .spinner{display:none}.spinner{border:3px solid #ffffff40;border-top-color:#fff;border-radius:50%;width:28px;height:28px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.privacy{bottom:8px;color:#ffffffd9;text-align:center;background:#0006;border-radius:999px;width:max-content;max-width:calc(100% - 32px);margin:0 auto;padding:4px 10px;font-size:11px;position:absolute;inset-inline:0}.vto-catalog{border-top:1px solid var(--border);grid-area:catalog;overflow:hidden}.grid{scroll-snap-type:x proximity;scrollbar-width:none;grid-auto-columns:112px;grid-auto-flow:column;gap:10px;margin:0;padding:12px 16px;list-style:none;display:grid;overflow-x:auto}.grid::-webkit-scrollbar{display:none}.grid li{scroll-snap-align:start}.card{border:1.5px solid var(--border);border-radius:var(--radius);background:var(--bg);text-align:center;flex-direction:column;align-items:center;gap:6px;width:100%;padding:10px 8px 8px;display:flex;position:relative}.card img{aspect-ratio:2;object-fit:contain;background:var(--surface);border-radius:10px;width:100%}.card-name{font-size:13px;line-height:1.3}.card-badge{top:6px;background:var(--applied);color:#fff;border-radius:999px;padding:2px 7px;font-size:10px;font-weight:600;display:none;position:absolute;inset-inline-end:6px}.card[aria-pressed=true]{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}.card[aria-pressed=true] .card-badge{display:block}.vto-bottom{padding:10px 16px max(12px, env(safe-area-inset-bottom));border-top:1px solid var(--border);align-items:center;gap:12px;display:flex}.selected{flex-direction:column;flex:1;min-width:0;display:flex}.selected-name{white-space:nowrap;text-overflow:ellipsis;font-weight:600;overflow:hidden}.selected-price{color:var(--muted);font-size:13px}.btn-primary{background:var(--brand);color:#fff;border:0;border-radius:12px;flex-shrink:0;min-height:48px;padding:0 24px;font-size:16px;font-weight:700;transition:background .15s}.btn-primary:not(:disabled):hover,.btn-primary:not(:disabled):active{background:var(--brand-hover)}.btn-primary:disabled{opacity:.5;cursor:default}.btn-secondary{color:#fff;background:0 0;border:1px solid #ffffff80;border-radius:10px;min-height:40px;padding:0 18px}.toast{inset-inline:16px;background:var(--accent);color:#fff;opacity:0;pointer-events:none;border-radius:10px;width:max-content;max-width:calc(100% - 32px);margin:0 auto;padding:10px 16px;font-size:14px;transition:opacity .2s,transform .2s;position:fixed;bottom:88px;transform:translateY(8px)}.toast.visible{opacity:1;transform:none}.toast.error{background:var(--error)}@media (width>=820px){.vto-body{grid-template:"catalog stage"1fr/minmax(260px,340px) 1fr}.vto-catalog{border-top:0;border-inline-end:1px solid var(--border);overflow-y:auto}.grid{grid-template-columns:repeat(2,1fr);grid-auto-columns:auto;grid-auto-flow:row;align-content:start;overflow:visible}.vto-bottom{justify-content:flex-end}.selected{text-align:end;flex:0 auto}}