:root{--bg-color:#030305;--card-bg:#0c0c1299;--card-border:#ffffff14;--accent-color:#3b82f6;--accent-glow:#3b82f680;--accent-success:#10b981;--text-primary:#f3f4f6;--text-secondary:#9ca3af;--font-family:"Outfit", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif}*{box-sizing:border-box;margin:0;padding:0}body,html{background-color:var(--bg-color);width:100%;height:100%;font-family:var(--font-family);color:var(--text-primary);-webkit-font-smoothing:antialiased;overflow:hidden}#canvas-container{z-index:1;width:100%;height:100%;position:absolute;top:0;left:0}.glass-card{background:var(--card-bg);-webkit-backdrop-filter:blur(16px);border:1px solid var(--card-border);border-radius:16px;box-shadow:0 8px 32px #0006}.glass-panel{-webkit-backdrop-filter:blur(10px);border:1px solid var(--card-border);background:#0c0c1273;border-radius:10px}.overlay-screen{z-index:100;background:radial-gradient(circle,#0a0c14e6 0%,#020305fa 100%);justify-content:center;align-items:center;width:100%;height:100%;transition:opacity .8s cubic-bezier(.25,1,.5,1),visibility .8s;display:flex;position:fixed;top:0;left:0}.overlay-screen.fade-out{opacity:0;visibility:hidden;pointer-events:none}.loading-card{text-align:center;width:90%;max-width:500px;padding:48px;transition:transform .8s cubic-bezier(.25,1,.5,1);transform:translateY(0)}.overlay-screen.fade-out .loading-card{transform:translateY(-20px)}.glow-text{letter-spacing:.15em;background:linear-gradient(135deg,#fff 0%,#a5b4fc 100%);-webkit-text-fill-color:transparent;text-shadow:0 0 30px #a5b4fc4d;-webkit-background-clip:text;margin-bottom:8px;font-size:2.5rem;font-weight:800}.subtitle{letter-spacing:.3em;color:var(--text-secondary);text-transform:uppercase;margin-bottom:40px;font-size:.85rem}.loader-container{width:100%;margin-bottom:32px}.loader-bar{background:#ffffff0d;border-radius:3px;width:100%;height:6px;margin-bottom:12px;position:relative;overflow:hidden}.loader-progress{background:linear-gradient(90deg, var(--accent-color) 0%, #818cf8 100%);width:0%;height:100%;box-shadow:0 0 12px var(--accent-color);border-radius:3px;transition:width .2s cubic-bezier(.1,.8,.2,1)}.loader-text{color:var(--text-secondary);letter-spacing:.05em;font-size:.9rem}.btn{font-family:var(--font-family);letter-spacing:.1em;color:#fff;background:var(--accent-color);cursor:pointer;border:none;border-radius:8px;justify-content:center;align-items:center;width:100%;padding:14px 28px;font-size:.95rem;font-weight:600;transition:background .3s,transform .2s,box-shadow .3s;display:inline-flex;position:relative;overflow:hidden}.btn:hover:not(.disabled){box-shadow:0 0 20px var(--accent-glow);background:#2563eb;transform:translateY(-2px)}.btn:active:not(.disabled){transform:translateY(1px)}.btn.disabled{color:#fff3;cursor:not-allowed;background:#ffffff0d;border:1px solid #ffffff05}.btn span{z-index:2;position:relative}.btn-glow{z-index:1;background:radial-gradient(circle,#ffffff26 0%,#0000 60%);width:120%;height:120%;transition:transform .5s ease-out;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)scale(0)}.btn:hover:not(.disabled) .btn-glow{transform:translate(-50%,-50%)scale(1.5)}.btn-secondary{background:#ffffff0f;border:1px solid #ffffff14}.btn-secondary:hover{background:#ffffff1f;border-color:#fff3;box-shadow:0 0 15px #ffffff0d}#hud{z-index:10;pointer-events:none;box-sizing:border-box;flex-direction:column;justify-content:space-between;width:100%;height:100%;padding:24px;transition:opacity .5s;display:flex;position:absolute;top:0;left:0}#hud.hidden{opacity:0;pointer-events:none}#hud *{pointer-events:auto}.hud-header{pointer-events:none;justify-content:space-between;align-items:center;width:100%;display:flex}.logo{align-items:center;gap:10px;padding:10px 18px;display:flex}.pulse-dot{background-color:var(--accent-success);width:8px;height:8px;box-shadow:0 0 8px var(--accent-success);border-radius:50%;animation:1.8s infinite pulse}.logo-text{letter-spacing:.08em;font-size:.95rem;font-weight:600}.camera-controls{pointer-events:auto}.cam-btn{color:var(--text-primary);font-family:var(--font-family);letter-spacing:.05em;cursor:pointer;background:0 0;border:none;border-radius:8px;align-items:center;gap:8px;padding:10px 18px;font-size:.85rem;font-weight:600;transition:background .3s,color .3s;display:flex}.cam-btn:hover{color:var(--accent-color);background:#ffffff0f}.cam-btn.active{color:var(--accent-color)}.icon{transition:transform .3s}.cam-btn:hover .icon{transform:rotate(15deg)}.crosshair{pointer-events:none;z-index:15;background:#ffffff80;border-radius:50%;width:6px;height:6px;transition:opacity .3s;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 0 4px #00000080}.crosshair.hidden{opacity:0}.controls-panel{width:280px;padding:20px;position:absolute;bottom:24px;left:24px}.controls-panel h3{letter-spacing:.1em;color:var(--text-secondary);border-bottom:1px solid #ffffff0d;margin-bottom:14px;padding-bottom:6px;font-size:.85rem;font-weight:600}.control-grid{flex-direction:column;gap:8px;display:flex}.control-row{color:var(--text-secondary);align-items:center;font-size:.8rem;display:flex}.control-row span:last-child{color:var(--text-primary);margin-left:auto}.key{background:#ffffff14;border:1px solid #ffffff26;border-radius:4px;margin-right:4px;padding:3px 7px;font-size:.75rem;font-weight:600;display:inline-block;box-shadow:0 2px #0003}.long-key{text-align:center;min-width:45px}.status-panel{padding:12px;position:absolute;bottom:24px;right:24px}.status-panel .btn{padding:10px 18px;font-size:.8rem}@keyframes pulse{0%{transform:scale(.9);box-shadow:0 0 #10b981b3}70%{transform:scale(1.1);box-shadow:0 0 0 6px #10b98100}to{transform:scale(.9);box-shadow:0 0 #10b98100}}@media (width<=768px){.controls-panel{display:none}.loading-card{padding:32px 24px}.glow-text{font-size:2rem}}.debug-panel{color:#a5b4fc;border-color:#6366f133;width:280px;padding:16px;font-family:monospace;font-size:.75rem;position:absolute;top:84px;left:24px}.debug-panel.hidden{display:none!important}.debug-panel h4{color:#3b82f6;letter-spacing:.05em;border-bottom:1px solid #ffffff0d;margin-bottom:10px;padding-bottom:4px;font-size:.8rem}.debug-grid{flex-direction:column;gap:6px;display:flex}.debug-row{justify-content:space-between;display:flex}.debug-row span:last-child{color:var(--text-primary)}.debug-tip{color:var(--text-secondary);text-align:center;margin-top:12px;font-size:.65rem}