body{margin:0;overflow:hidden;background-color:#1a1a1a;font-family:Inter,sans-serif;color:#eee;display:flex;flex-direction:column;align-items:center;justify-content:center;height:100vh}#info{position:absolute;top:10px;left:50%;transform:translate(-50%);background:#0009;padding:8px 15px;border-radius:8px;font-size:.9em;color:#ccc;z-index:10}#loading-message{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:1.5em;color:#fff;text-shadow:2px 2px 4px rgba(0,0,0,.5);z-index:20;transition:opacity .3s ease-in-out}.loading-overlay.active~#loading-message{opacity:0;pointer-events:none}.loading-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background:#141923f2;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:1000;opacity:0;pointer-events:none;transition:opacity .3s ease-in-out}.loading-overlay.active{opacity:1;pointer-events:all}.loading-gauge{position:relative;width:120px;height:120px;margin-bottom:30px}.gauge-track{width:100%;height:100%;border:3px solid rgba(255,255,255,.1);border-radius:50%;position:relative;overflow:hidden}.gauge-fill{position:absolute;top:-3px;left:-3px;width:calc(100% + 6px);height:calc(100% + 6px);border-radius:50%;background:conic-gradient(from 0deg,#3498db 0deg,#2ecc71 90deg,#f39c12 180deg,#e74c3c 270deg,transparent 270deg);transform:rotate(-90deg);transition:transform .3s ease-out}.gauge-fill:before{content:"";position:absolute;top:50%;left:50%;width:calc(100% - 12px);height:calc(100% - 12px);background:#141923f2;border-radius:50%;transform:translate(-50%,-50%)}.gauge-center{position:absolute;top:50%;left:50%;width:8px;height:8px;background:#fff;border-radius:50%;transform:translate(-50%,-50%);box-shadow:0 0 15px #ffffff80}.loading-text{font-size:1.1em;font-weight:500;color:#fff;text-align:center;letter-spacing:.5px;margin-bottom:10px}.loading-subtitle{font-size:.9em;color:#fff9;text-align:center;font-weight:300}@keyframes pulse{0%,to{transform:translate(-50%,-50%) scale(1);box-shadow:0 0 15px #ffffff80}50%{transform:translate(-50%,-50%) scale(1.2);box-shadow:0 0 25px #fffc}}.gauge-center{animation:pulse 2s ease-in-out infinite}canvas{display:block;background-color:#2c2c2c;width:100vw;height:100vh}#webcamVideo{display:block;position:fixed;bottom:20px;right:20px;width:240px;height:180px;border-radius:12px;border:2px solid #00ffff;box-shadow:0 4px 8px #0006;z-index:100;transform:scaleX(-1)}#fps-counter{position:absolute;top:10px;right:10px;background:#0009;padding:8px 15px;border-radius:8px;font-size:1em;color:#0f0;font-weight:700;z-index:10}@media (max-width: 768px){#webcamVideo{width:160px;height:120px;bottom:10px;right:10px}#info{font-size:.8em;padding:6px 10px}#loading-message{font-size:1.2em}}