@import "https://fonts.googleapis.com/css2?family=Outfit:wght@400;600;700;900&family=Space+Mono:wght@700&display=swap";:root{--bg-dark:#07090e;--panel-bg:#0f1420;--panel-border:#1e283d;--text-main:#fff;--text-muted:#94a3b8;--cyan-glow:#00f2fe;--cyan-subtle:#00f2fe26;--hazard-red:#f05;--hazard-glow:#ff005540;--warning-amber:#ffb700;--safe-green:#00e676;--safe-glow:#00e67633;--font-main:"Outfit", -apple-system, BlinkMacSystemFont, sans-serif;--font-mono:"Space Mono", monospace}body.high-contrast{--bg-dark:#000;--panel-bg:#000;--panel-border:#fff;--text-main:#fff;--text-muted:#ff0;--cyan-glow:#0ff;--hazard-red:red;--safe-green:#0f0}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--bg-dark);color:var(--text-main);font-family:var(--font-main);-webkit-font-smoothing:antialiased;-webkit-user-select:none;user-select:none;touch-action:manipulation;min-height:100vh;overflow-x:hidden}#root{flex-direction:column;max-width:1200px;min-height:100vh;margin:0 auto;padding:24px 16px;display:flex}.app-container{cursor:pointer;outline:none;min-height:100vh}:focus-visible{outline-offset:4px;outline:4px solid var(--cyan-glow)!important}.app-header{border-bottom:2px solid var(--panel-border);justify-content:space-between;align-items:center;margin-bottom:20px;padding-bottom:20px;display:flex}.brand{align-items:center;gap:12px;display:flex}.brand-icon{background:linear-gradient(135deg, var(--cyan-glow), #4facfe);color:#000;width:44px;height:44px;box-shadow:0 0 20px var(--cyan-subtle);border-radius:12px;justify-content:center;align-items:center;display:flex}.brand-title{letter-spacing:-.5px;background:linear-gradient(90deg,#fff,#94a3b8);-webkit-text-fill-color:transparent;-webkit-background-clip:text;font-size:28px;font-weight:900}.a11y-toggles{gap:12px;display:flex}.btn-a11y{background:var(--panel-bg);border:2px solid var(--panel-border);color:var(--text-main);cursor:pointer;border-radius:10px;align-items:center;gap:8px;padding:10px 18px;font-size:15px;font-weight:700;transition:all .2s;display:flex}.btn-a11y:hover{border-color:var(--cyan-glow);color:var(--cyan-glow)}.status-banner{border-radius:20px;justify-content:space-between;align-items:center;margin-bottom:20px;padding:24px;transition:all .3s;display:flex}.status-banner.safe{background:radial-gradient(circle at top left, var(--safe-glow), var(--panel-bg));border:3px solid var(--safe-green);box-shadow:0 0 30px var(--safe-glow)}.status-banner.hazard{background:radial-gradient(circle at top left, var(--hazard-glow), var(--panel-bg));border:3px solid var(--hazard-red);box-shadow:0 0 40px var(--hazard-glow);animation:1.5s infinite alternate pulse-border}@keyframes pulse-border{0%{box-shadow:0 0 20px var(--hazard-glow)}to{box-shadow:0 0 50px var(--hazard-red)}}.status-info{align-items:center;gap:20px;width:100%;display:flex}.status-indicator-dot{border-radius:50%;flex-shrink:0;width:24px;height:24px}.status-banner.safe .status-indicator-dot{background:var(--safe-green);box-shadow:0 0 15px var(--safe-green)}.status-banner.hazard .status-indicator-dot{background:var(--hazard-red);box-shadow:0 0 20px var(--hazard-red);animation:.8s infinite alternate blink}@keyframes blink{0%{opacity:.3}to{opacity:1}}.status-title{text-transform:uppercase;font-size:28px;font-weight:900;line-height:1.1}.status-banner.safe .status-title{color:var(--safe-green)}.status-banner.hazard .status-title{color:var(--hazard-red)}.loop-pulse-badge{font-family:var(--font-mono);color:var(--cyan-glow);border:1px solid var(--cyan-glow);background:#00f2fe26;border-radius:6px;padding:3px 8px;font-size:11px;font-weight:700}.direction-box{border:2px solid var(--cyan-glow);background:#0006;border-radius:12px;align-items:center;gap:12px;margin-top:14px;padding:12px 18px;display:flex}.direction-icon{font-size:24px}.direction-text{color:var(--cyan-glow);font-size:20px;font-family:var(--font-main)}.gesture-pad-banner{border:3px solid var(--cyan-glow);box-shadow:0 0 30px var(--cyan-subtle);background:linear-gradient(135deg,#0e1726,#142238);border-radius:20px;margin-bottom:24px;padding:20px;position:relative}.gesture-badge{font-family:var(--font-mono);color:var(--cyan-glow);border:1px solid var(--cyan-glow);background:#00f2fe1a;border-radius:6px;margin-bottom:10px;padding:4px 12px;font-size:12px;font-weight:700;display:inline-block}.gesture-feedback-text{color:var(--cyan-glow);letter-spacing:-.3px;min-height:30px;margin-bottom:16px;font-size:18px;font-weight:800}.gesture-guide-grid{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;display:grid}.gesture-card{border:2px solid var(--panel-border);text-align:center;background:#0000004d;border-radius:12px;flex-direction:column;align-items:center;gap:4px;padding:14px;display:flex}.gesture-icon{font-size:28px}.gesture-title{color:#fff;font-size:15px;font-weight:800}.gesture-desc{color:var(--text-muted);font-size:12px}.workspace-grid{grid-template-columns:1.4fr 1fr;gap:24px;margin-bottom:24px;display:grid}@media (width<=900px){.workspace-grid{grid-template-columns:1fr}}.card{background:var(--panel-bg);border:2px solid var(--panel-border);border-radius:20px;flex-direction:column;padding:20px;display:flex}.card-title{justify-content:space-between;align-items:center;margin-bottom:16px;font-size:18px;font-weight:700;display:flex}.camera-view{aspect-ratio:16/9;border:2px solid var(--panel-border);background:#000;border-radius:14px;justify-content:center;align-items:center;display:flex;position:relative;overflow:hidden}.camera-feed{object-fit:cover;width:100%;height:100%}.safe-corridor-overlay{pointer-events:none;background:#00f2fe0d;border-left:2px dashed #00f2fe80;border-right:2px dashed #00f2fe80;justify-content:center;align-items:flex-start;width:40%;padding-top:10px;display:flex;position:absolute;top:0;bottom:0;left:30%}.corridor-label{font-family:var(--font-mono);color:var(--cyan-glow);text-transform:uppercase;background:#000c;border-radius:4px;padding:3px 8px;font-size:11px}.detections-list{flex-direction:column;gap:12px;max-height:380px;display:flex;overflow-y:auto}.detection-item{border:2px solid var(--panel-border);background:#ffffff08;border-radius:12px;justify-content:space-between;align-items:center;padding:14px 16px;display:flex}.detection-item.in-path-hazard{border-color:var(--hazard-red);background:var(--hazard-glow)}.detection-name{text-transform:capitalize;font-size:17px;font-weight:700}.detection-badge{font-family:var(--font-mono);border-radius:6px;padding:4px 10px;font-size:12px;font-weight:700}.detection-badge.hazard{background:var(--hazard-red);color:#fff}.detection-badge.safe{background:var(--panel-border);color:var(--text-muted)}.screen-reader-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}