:root{--font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-display: "Space Grotesk", "Inter", sans-serif;--bg-primary: #f3f4f6;--accent-color: #2563eb;--accent-color-rgb: 37, 99, 235;--text-primary: #111827;--text-secondary: #4b5563;--text-muted: #9ca3af;--glass-bg: rgba(255, 255, 255, .75);--glass-border: rgba(0, 0, 0, .08);--glass-blur: blur(16px);--glass-shadow: 0 12px 30px 0 rgba(0, 0, 0, .06);--transition-fast: .2s cubic-bezier(.4, 0, .2, 1);--transition-normal: .3s cubic-bezier(.4, 0, .2, 1)}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-sans);background-color:var(--bg-primary);color:var(--text-primary);overflow:hidden;height:100vh;width:100vw;background-image:radial-gradient(circle at 50% 50%,#fff,#f3f4f6)}#loader-container{position:fixed;top:0;left:0;width:100vw;height:100vh;background-color:#f3f4f6;display:flex;justify-content:center;align-items:center;z-index:9999;opacity:1;transition:opacity var(--transition-normal)}#loader-container.fade-out{opacity:0;pointer-events:none}.loader-content{text-align:center;display:flex;flex-direction:column;align-items:center;max-width:320px;width:100%}.spinner-ring{position:relative;width:64px;height:64px;margin-bottom:1.5rem}.ring-segment{width:100%;height:100%;border-radius:50%;border:3px solid rgba(0,0,0,.03);border-top-color:var(--accent-color);animation:spin 1s infinite linear;box-shadow:0 0 15px rgba(var(--accent-color-rgb),.15)}.loader-text{font-family:var(--font-display);font-size:1rem;font-weight:500;color:var(--text-primary);margin-bottom:.5rem;letter-spacing:.02em}.loader-percentage{font-family:var(--font-display);font-size:1.5rem;font-weight:700;color:var(--accent-color);margin-bottom:1.25rem}.loader-progress-bar-container{width:100%;height:4px;background-color:#0000000d;border-radius:2px;overflow:hidden}.loader-progress-bar{width:0%;height:100%;background:linear-gradient(90deg,var(--accent-color),#0284c7);box-shadow:0 0 8px var(--accent-color);transition:width .15s ease-out}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}#drop-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background-color:#f3f4f6b3;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);z-index:5000;display:flex;justify-content:center;align-items:center;opacity:0;pointer-events:none;transition:opacity var(--transition-normal);border:4px dashed rgba(37,99,235,.3)}#drop-overlay.active{opacity:1}.drop-message{display:flex;flex-direction:column;align-items:center;gap:1.5rem;color:var(--accent-color)}.drop-message svg{animation:bounce 1.5s infinite ease-in-out;filter:drop-shadow(0 0 10px rgba(var(--accent-color-rgb),.5))}.drop-message span{font-family:var(--font-display);font-size:1.5rem;font-weight:700;letter-spacing:-.01em}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-12px)}}#app{position:relative;width:100vw;height:100vh}#canvas-container{width:100%;height:100%;position:absolute;top:0;left:0;z-index:1}canvas{display:block}.glass-panel{background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:20px;backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);box-shadow:var(--glass-shadow)}.dashboard-panel{position:absolute;bottom:30px;left:50%;transform:translate(-50%);z-index:10;width:max-content;max-width:90%;padding:1.25rem 2rem;display:flex;flex-direction:column;align-items:center;gap:1rem}.panel-header{display:flex;align-items:center;justify-content:center;gap:1rem;width:100%}.panel-title{font-family:var(--font-display);font-size:1.1rem;font-weight:700;letter-spacing:-.02em}.model-name-badge{font-family:var(--font-sans);font-size:.75rem;font-weight:600;color:var(--accent-color);background-color:rgba(var(--accent-color-rgb),.1);border:1px solid rgba(var(--accent-color-rgb),.25);padding:4px 10px;border-radius:6px;max-width:220px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.panel-controls{display:flex;align-items:center;gap:1.5rem}.control-item{display:flex;align-items:center;gap:1rem}.control-divider{width:1px;height:28px;background-color:var(--glass-border)}.panel-hint{font-size:.75rem;color:var(--text-muted)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;font-family:var(--font-sans);font-size:.85rem;font-weight:600;padding:.6rem 1.2rem;border-radius:10px;border:1px solid transparent;cursor:pointer;transition:all var(--transition-fast)}.btn-primary{background:var(--text-primary);color:#fff}.btn-primary:hover{background:#1f2937;box-shadow:0 4px 12px #00000026;transform:translateY(-1px)}.btn-primary:active{transform:translateY(0)}.btn-toggle{background:#00000005;border-color:var(--glass-border);color:var(--text-secondary)}.btn-toggle:hover{background:#0000000d;color:var(--text-primary)}.btn-toggle.active{background:rgba(var(--accent-color-rgb),.06);border-color:var(--accent-color);color:var(--text-primary);box-shadow:0 0 10px rgba(var(--accent-color-rgb),.1)}.slider-container{display:flex;align-items:center}input[type=range]{-webkit-appearance:none;width:90px;height:4px;background:#0000000f;border-radius:2px;outline:none}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:12px;height:12px;border-radius:50%;background:var(--text-primary);cursor:pointer;transition:transform var(--transition-fast),background var(--transition-fast)}input[type=range]::-webkit-slider-thumb:hover{transform:scale(1.25);background:var(--accent-color)}@media (max-width: 640px){.dashboard-panel{bottom:20px;width:95%;padding:1rem 1.25rem;gap:.75rem}.panel-header{flex-direction:column;gap:.4rem}.panel-controls{flex-direction:column;gap:.75rem;width:100%}.btn{width:100%}.control-item{width:100%;justify-content:space-between}.control-divider{display:none}input[type=range]{width:120px}}