:root{--color-surface:#0a0a0b;--color-panel:#0a0a0b;--color-panel-border:#ffffff0f;--color-border-soft:#ffffff0a;--color-text-strong:#f4f4f6;--color-text:#8a8a90;--color-text-dim:#55555a;--color-text-muted:#3a3a3e;--color-text-subtle:#55555a;--color-badge:#6a6a70;--color-badge-hover:#d0d0d4;--color-badge-active:#f4f4f6;--color-accent:#f4f4f6;--color-track:#ffffff14;--color-thumb:#f4f4f6;--color-thumb-hover:#fff;--color-danger-bg:#3c0f0feb;--color-danger-border:#533;--color-danger-text:#e88;--panel-width:272px;--panel-header-height:48px;--view-cube-size:118px;--view-cube-margin:16px;--ui-font:ui-monospace, "SF Mono", "Cascadia Code", "Fira Code", monospace}*{box-sizing:border-box;margin:0;padding:0}html,body{width:100%;height:100%}body.app{background:var(--color-surface);color:var(--color-text);font-family:var(--ui-font);-webkit-font-smoothing:antialiased;-webkit-user-select:none;user-select:none;overflow:hidden}.viewer{width:100vw;height:100vh;display:block}.viewer-info{color:var(--color-text-dim);letter-spacing:-.02em;pointer-events:none;z-index:2;font-size:10px;position:fixed;bottom:10px;left:12px}.error-banner{border:1px solid var(--color-danger-border);background:var(--color-danger-bg);max-width:70vw;color:var(--color-danger-text);z-index:3;border-radius:0;padding:8px 12px;font-size:10px;position:fixed;bottom:10px;left:12px}.error-banner.is-hidden{display:none}.error-copy{white-space:pre-wrap;display:block}@media (width<=767px){.viewer-info,.error-banner{top:10px;bottom:auto}}.control-panel{width:var(--panel-width);z-index:20;pointer-events:none;flex-direction:column;display:flex;position:fixed;top:0;left:0}.panel-header{height:var(--panel-header-height);min-height:var(--panel-header-height);pointer-events:auto;align-items:center;padding:0 20px;display:flex}@media (width<=767px){.control-panel{width:100%;inset:auto 0 0}.panel-header{height:32px;min-height:32px;padding:0 14px}}.panel-title{color:var(--color-text-strong);letter-spacing:.24em;text-transform:uppercase;font-size:10px;font-weight:500}.panel-body{max-height:calc(100vh - var(--panel-header-height));pointer-events:auto;padding:24px 20px 28px;overflow-y:auto}@media (width<=767px){.panel-body{max-height:42vh;padding:10px 14px 14px}.panel-section+.panel-section{margin-top:14px;padding-top:14px}.section-label{margin-bottom:10px}}.no-scrollbar{scrollbar-width:none}.no-scrollbar::-webkit-scrollbar{display:none}.panel-section+.panel-section{border-top:1px solid var(--color-border-soft);margin-top:24px;padding-top:24px}.section-label{color:var(--color-text-dim);letter-spacing:.24em;text-transform:uppercase;margin:0 0 14px;font-size:9px;font-weight:500}.badge-row{flex-wrap:wrap;gap:16px;display:flex}.badge-row+.slider-row,.slider-row+.badge-row{margin-top:14px}.badge{color:var(--color-badge);font:inherit;letter-spacing:.14em;text-transform:uppercase;cursor:pointer;background:0 0;border:0;border-radius:0;align-items:center;gap:8px;padding:3px 0;font-size:10px;transition:color .12s;display:inline-flex}.badge:before{content:"";border:1px solid var(--color-text-muted);background:0 0;width:7px;height:7px;transition:background .12s,border-color .12s;display:inline-block}.badge:hover{color:var(--color-badge-hover)}.badge:hover:before{border-color:var(--color-badge-hover)}.badge.active{color:var(--color-badge-active)}.badge.active:before{background:var(--color-accent);border-color:var(--color-accent)}.slider-row{align-items:center;gap:12px;height:22px;display:flex}.slider-row+.slider-row{margin-top:6px}.choice-row{align-items:center;gap:12px;height:22px;display:flex}.choice-row+.choice-row{margin-top:6px}.choice-row+.slider-row,.slider-row+.choice-row{margin-top:14px}.choice-label{text-align:left;width:20px;color:var(--color-text-muted);letter-spacing:.04em;font-variant-numeric:tabular-nums;flex-shrink:0;font-size:10px}.choice-button{color:var(--color-badge);font:inherit;letter-spacing:.14em;text-transform:uppercase;text-align:left;cursor:pointer;background:0 0;border:0;flex:1;align-items:center;gap:10px;padding:0;font-size:10px;transition:color .12s;display:inline-flex}.choice-button:before{content:"";border:1px solid var(--color-text-muted);background:0 0;width:7px;height:7px;transition:background .12s,border-color .12s;display:inline-block}.choice-button:hover{color:var(--color-badge-hover)}.choice-button:hover:before{border-color:var(--color-badge-hover)}.choice-button.active{color:var(--color-badge-active)}.choice-button.active:before{background:var(--color-accent);border-color:var(--color-accent)}.slider-label,.slider-value{font-variant-numeric:tabular-nums;flex-shrink:0;font-size:10px}.slider-label{text-align:left;width:20px;color:var(--color-text-muted);letter-spacing:.04em}.slider-value{text-align:right;width:40px;color:var(--color-text-strong)}.slider-row input[type=range]{appearance:none;background:var(--color-track);cursor:grab;border-radius:0;outline:none;flex:1;height:2px}.slider-row input[type=range]:active{cursor:grabbing}.slider-row input[type=range]::-webkit-slider-thumb{appearance:none;background:var(--color-thumb);cursor:grab;border:none;border-radius:0;width:2px;height:14px;margin-top:-6px;transition:background .1s,height .1s,margin-top .1s}.slider-row input[type=range]::-webkit-slider-thumb:hover{background:var(--color-thumb-hover);height:16px;margin-top:-7px}.slider-row input[type=range]:active::-webkit-slider-thumb{cursor:grabbing}.slider-row input[type=range]::-moz-range-thumb{background:var(--color-thumb);cursor:grab;border:none;border-radius:0;width:2px;height:14px}.slider-row input[type=range]::-moz-range-thumb:hover{background:var(--color-thumb-hover)}.slider-row input[type=range]:active::-moz-range-thumb{cursor:grabbing}.view-cube{right:var(--view-cube-margin);bottom:var(--view-cube-margin);z-index:10;width:var(--view-cube-size);height:var(--view-cube-size);position:fixed}.view-cube-home{right:calc(var(--view-cube-margin) + var(--view-cube-size) + 6px);bottom:calc(var(--view-cube-margin) + var(--view-cube-size) / 2 - 7px);z-index:11;width:14px;height:14px;color:var(--color-text-muted);cursor:pointer;background:0 0;border:0;padding:0;transition:color .12s;position:fixed}.view-cube-home:hover{color:var(--color-badge-active)}.view-cube-home svg{width:100%;height:100%}