:root{--brand-orange:#ff7900;--brand-orange-dark:#c45a00;--brand-orange-tint:#fff2e6;--brand-black:#080808;--page:#f7f8fa;--surface:#fff;--text:#17191d;--text-secondary:#626873;--border:#e2e5e9;--dark-surface:#17191d;--dark-text:#f5f6f7;--danger:#c62828;--ok:#2e7d32;--warn:#b26a00;--radius-sm:10px;--radius-md:12px;--radius-lg:16px;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:24px;--space-6:32px;--space-7:48px;--space-8:64px;--font:"Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--font-mono:ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;--transition:.16s ease;--btn-min-h:44px}*{box-sizing:border-box}html,body,#root{background:var(--page);height:100%;color:var(--text);font-family:var(--font);-webkit-font-smoothing:antialiased;margin:0;font-size:16px;line-height:1.5}.app{background:var(--page);flex-direction:column;height:100%;display:flex;position:relative;overflow:hidden}.chrome{z-index:6;justify-content:space-between;align-items:center;gap:var(--space-4);padding:var(--space-3) var(--space-5) var(--space-6);background:linear-gradient(to bottom, color-mix(in srgb, var(--brand-black) 72%, transparent) 0%, color-mix(in srgb, var(--brand-black) 38%, transparent) 45%, transparent 100%);color:var(--dark-text);pointer-events:none;border-bottom:0;display:flex;position:absolute;top:0;left:0;right:0}.chrome>*{pointer-events:auto}.brand-block{align-items:center;gap:var(--space-3);min-width:0;display:flex}.vpix-logo{flex-shrink:0;justify-content:center;align-items:center;line-height:0;display:inline-flex}.vpix-logo img{width:var(--logo-size,56px);height:var(--logo-size,56px);object-fit:contain;-webkit-user-select:none;user-select:none;-webkit-user-drag:none;display:block}.vpix-logo--header{--logo-size:56px}.vpix-logo--empty{--logo-size:72px}.brand-block h1{letter-spacing:-.01em;color:var(--dark-text);margin:0;font-size:1.05rem;font-weight:600}.toolbar{gap:var(--space-2);flex-wrap:wrap;justify-content:flex-end;display:flex}.toolbar .btn{white-space:nowrap;flex-shrink:0}.btn{appearance:none;min-height:var(--btn-min-h);border:1px solid var(--border);background:var(--surface);color:var(--text);border-radius:var(--radius-sm);padding:0 var(--space-4);font:inherit;cursor:pointer;transition:background var(--transition), border-color var(--transition), color var(--transition), opacity var(--transition);font-size:.875rem;font-weight:500}.btn:hover:not(:disabled){border-color:color-mix(in srgb, var(--brand-orange) 45%, var(--border));background:var(--brand-orange-tint)}.btn:focus-visible{outline:2px solid var(--brand-orange);outline-offset:2px}.btn:disabled{opacity:.45;cursor:not-allowed}.btn.primary{background:var(--brand-orange);border-color:var(--brand-orange);color:var(--text)}.btn.primary:hover:not(:disabled){background:color-mix(in srgb, var(--brand-orange) 88%, black);border-color:color-mix(in srgb, var(--brand-orange) 88%, black);color:var(--text)}.btn.active{border-color:var(--brand-orange);background:var(--brand-orange-tint);color:var(--text)}.btn.ghost{background:color-mix(in srgb, var(--dark-surface) 55%, transparent);border-color:color-mix(in srgb, var(--dark-text) 28%, transparent);color:var(--dark-text);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.btn.ghost:hover:not(:disabled){background:color-mix(in srgb, var(--dark-text) 14%, transparent);border-color:color-mix(in srgb, var(--brand-orange) 55%, transparent);color:var(--dark-text)}.chrome .btn:not(.primary):not(.ghost){background:color-mix(in srgb, var(--dark-surface) 72%, transparent);border-color:color-mix(in srgb, var(--dark-text) 22%, transparent);color:var(--dark-text);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.chrome .btn:not(.primary):not(.ghost):hover:not(:disabled){border-color:color-mix(in srgb, var(--brand-orange) 55%, transparent);background:color-mix(in srgb, var(--brand-orange) 22%, var(--dark-surface))}.chrome .btn.active:not(.primary){border-color:var(--brand-orange);background:color-mix(in srgb, var(--brand-orange) 28%, var(--dark-surface))}.chrome .btn.primary{box-shadow:0 1px 2px color-mix(in srgb, var(--brand-black) 35%, transparent)}.link-bar{z-index:6;gap:var(--space-2);padding:var(--space-3) var(--space-5);background:linear-gradient(to bottom, color-mix(in srgb, var(--brand-black) 55%, transparent), color-mix(in srgb, var(--brand-black) 18%, transparent));pointer-events:none;border-bottom:0;display:flex;position:absolute;top:72px;left:0;right:0}.link-bar>*{pointer-events:auto}.link-bar input{min-width:0;min-height:var(--btn-min-h);appearance:none;border:1px solid color-mix(in srgb, var(--dark-text) 22%, transparent);background:color-mix(in srgb, var(--dark-surface) 82%, transparent);color:var(--dark-text);border-radius:var(--radius-sm);padding:0 var(--space-3);font:inherit;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);flex:1;font-size:.875rem}.link-bar input::placeholder{color:color-mix(in srgb, var(--dark-text) 55%, transparent)}.link-bar input:focus-visible{outline:2px solid var(--brand-orange);outline-offset:1px}.stage{background:var(--brand-black);flex:1;width:100%;height:100%;min-height:0;position:relative}.stage.dragging{outline:2px dashed var(--brand-orange);outline-offset:-10px}.viewport{position:absolute;inset:0}.viewport canvas,.viewport .supersplat-frame{border:0;display:block;width:100%!important;height:100%!important}.empty{z-index:2;justify-content:center;align-items:center;gap:var(--space-3);text-align:center;padding:var(--space-5);pointer-events:none;background:radial-gradient(520px 280px at 50% 38%, color-mix(in srgb, var(--brand-orange) 10%, transparent), transparent 70%), var(--page);color:var(--text);flex-direction:column;display:flex;position:absolute;inset:0}.empty>*{pointer-events:auto}.empty-brand{margin:0}.empty h2{letter-spacing:-.02em;color:var(--text);margin:0;font-size:1.35rem;font-weight:600}.empty p{max-width:36rem;color:var(--text-secondary);margin:0;font-size:1rem;line-height:1.5}.cam-bar{left:50%;bottom:calc(var(--space-4) + 52px);z-index:8;gap:var(--space-1);padding:var(--space-1);border-radius:var(--radius-md);border:1px solid color-mix(in srgb, var(--dark-text) 14%, transparent);background:color-mix(in srgb, var(--dark-surface) 94%, transparent);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);pointer-events:auto;display:inline-flex;position:absolute;top:auto;transform:translate(-50%)}.cam-btn{appearance:none;min-height:40px;color:color-mix(in srgb, var(--dark-text) 72%, transparent);border-radius:var(--radius-sm);padding:0 var(--space-3);font:inherit;letter-spacing:.01em;cursor:pointer;text-transform:capitalize;transition:background var(--transition), border-color var(--transition), color var(--transition);background:0 0;border:1px solid #0000;font-size:.8125rem;font-weight:500}.cam-btn:hover{color:var(--dark-text);background:color-mix(in srgb, var(--dark-text) 8%, transparent)}.cam-btn:focus-visible{outline:2px solid var(--brand-orange);outline-offset:1px}.cam-btn.active{color:var(--text);background:var(--brand-orange);border-color:#0000}.hud{left:var(--space-4);right:var(--space-4);bottom:var(--space-4);z-index:3;align-items:flex-end;gap:var(--space-2);pointer-events:none;flex-wrap:wrap;display:flex;position:absolute}.hud--native{left:var(--space-4);right:auto;bottom:calc(var(--space-8) + var(--space-5));justify-content:flex-start;top:auto}.hud--native .pill{max-width:min(100%,28rem)}.pill{pointer-events:auto;max-width:min(100%,42rem);padding:var(--space-2) var(--space-3);border:1px solid color-mix(in srgb, var(--dark-text) 14%, transparent);background:color-mix(in srgb, var(--dark-surface) 90%, transparent);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:var(--dark-text);border-radius:999px;font-size:.875rem;line-height:1.35}.pill.status-error{border-color:color-mix(in srgb, var(--danger) 55%, transparent);color:#ffc9c9}.pill.status-ok{border-color:color-mix(in srgb, var(--ok) 50%, transparent)}.pill.meta{align-items:center;gap:var(--space-2);margin-left:auto;display:inline-flex}.tag{font-family:var(--font-mono);letter-spacing:.04em;text-transform:uppercase;color:var(--brand-orange);font-size:.72rem}.name{color:color-mix(in srgb, var(--dark-text) 70%, transparent);text-overflow:ellipsis;white-space:nowrap;max-width:16rem;overflow:hidden}.sr-only{clip:rect(0, 0, 0, 0);border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}@media (width<=720px){.chrome{padding:var(--space-3) var(--space-4) var(--space-6);flex-direction:column;align-items:stretch}.toolbar{justify-content:stretch}.toolbar .btn{flex:1}.link-bar{padding:var(--space-3) var(--space-4);top:132px}.cam-bar{bottom:calc(var(--space-5) + 64px);max-width:calc(100% - var(--space-4) * 2);flex-wrap:wrap;justify-content:center}.hud--native{bottom:calc(var(--space-8) + var(--space-6));left:var(--space-4);right:var(--space-4)}.pill.meta{margin-left:0}.vpix-logo--header{--logo-size:44px}.vpix-logo--empty{--logo-size:56px}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important}}html{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}body{margin:0}