﻿            /* === 3D STAGE === */
            .stage {
                position: relative;
                overflow: hidden;
                background:
                    radial-gradient(ellipse at 30% 20%, rgba(0, 120, 212, 0.04) 0%, transparent 60%),
                    radial-gradient(ellipse at 70% 80%, rgba(0, 120, 212, 0.03) 0%, transparent 60%),
                    #f9fafb;
            }

            .stage::before {
                content: '';
                position: absolute;
                inset: 0;
                opacity: 0.5;
                background-image:
                    linear-gradient(rgba(0, 0, 0, 0.03) 1px, transparent 1px),
                    linear-gradient(90deg, rgba(0, 0, 0, 0.03) 1px, transparent 1px);
                background-size: 40px 40px;
                pointer-events: none;
            }

            #glCanvas {
                position: absolute;
                inset: 0;
                width: 100%;
                height: 100%;
                cursor: grab;
                z-index: 1;
                touch-action: none;
            }
            #glCanvas:active { cursor: grabbing; }

            .stage-top, .stage-bottom {
                position: absolute;
                left: 12px; right: 12px;
                z-index: 3;
                display: flex;
                justify-content: space-between;
                align-items: center;
                gap: 8px;
                pointer-events: none;
            }

            .stage-top { top: 10px; }
            .stage-bottom { bottom: 10px; }

            .model-tag {
                padding: 5px 8px;
                border: 1px solid var(--border);
                border-radius: 4px;
                background: rgba(255, 255, 255, 0.85);
                backdrop-filter: blur(8px);
                color: var(--accent);
                font-size: 13px;
            }

            .metric {
                display: flex;
                align-items: baseline;
                gap: 3px;
                padding: 5px 8px;
                border: 1px solid var(--border);
                border-radius: 4px;
                background: rgba(255, 255, 255, 0.85);
                backdrop-filter: blur(8px);
                color: var(--text-3);
                font-size: 12px;
            }

            .metric strong { color: var(--text); font-family: "Cascadia Code", monospace; font-size: 14px; }

            .view-help {
                padding: 4px 8px;
                border: 1px solid var(--border);
                border-radius: 4px;
                background: rgba(255, 255, 255, 0.85);
                backdrop-filter: blur(8px);
                color: var(--text-3);
                font-size: 12px;
            }

            .view-actions {
                display: flex;
                gap: 4px;
                pointer-events: auto;
            }

            .view-actions button {
                min-width: 30px;
                height: 28px;
                border: 1px solid var(--border);
                border-radius: 4px;
                background: rgba(255, 255, 255, 0.85);
                backdrop-filter: blur(8px);
                color: var(--text-2);
                font-size: 14px;
                cursor: pointer;
                transition: border-color 0.15s, color 0.15s;
            }

            .view-actions button:hover { border-color: var(--accent); color: var(--accent); }

            /* === BUSY === */
            .busy {
                position: absolute;
                inset: 0;
                z-index: 8;
                display: none;
                place-items: center;
                background: rgba(243, 244, 246, 0.7);
                backdrop-filter: blur(4px);
                color: var(--accent);
                font-size: 14px;
            }

            .busy.show { display: grid; }

            .busy::before {
                content: '';
                display: block;
                width: 32px;
                height: 32px;
                margin-bottom: 8px;
                border: 2px solid var(--border);
                border-top-color: var(--accent);
                border-radius: 50%;
                animation: spin 0.8s linear infinite;
            }

            @keyframes spin { to { transform: rotate(360deg); } }
