*,*:before,*:after{box-sizing:border-box}:root{color-scheme:dark;--panel: rgba(11, 13, 20, .82);--panel-border: rgba(255, 255, 255, .1);--text: #f5f5f5;--text-muted: rgba(245, 245, 245, .62);--focus: #72b7f2}html,body,#root{margin:0;padding:0;width:100%;height:100%}html{height:-webkit-fill-available}body{font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;background:#050509;color:var(--text)}.layout-root{position:relative;height:100%;height:100dvh;height:100svh;width:100%;overflow:hidden;background:#090b12}.topbar{position:absolute;top:12px;left:12px;z-index:10;pointer-events:none}.model-picker{display:flex;align-items:center;flex-wrap:wrap;gap:10px 14px;pointer-events:auto;padding:8px 10px;border-radius:10px;background:var(--panel);border:1px solid var(--panel-border);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.model-picker-field{display:flex;align-items:center;gap:8px}.model-picker-label{font-size:12px;color:#f5f5f5b3;white-space:nowrap}.model-picker-select{-webkit-appearance:none;-moz-appearance:none;appearance:none;min-width:220px;max-width:min(70vw,420px);padding:6px 28px 6px 10px;border-radius:6px;border:1px solid rgba(255,255,255,.14);background:linear-gradient(45deg,transparent 50%,#f5f5f5 50%) right 10px top 11px / 5px 5px no-repeat,linear-gradient(135deg,#f5f5f5 50%,transparent 50%) right 6px top 11px / 5px 5px no-repeat,#ffffff0f;color:#f5f5f5;font-size:14px;cursor:pointer}.model-picker-select:focus{outline:2px solid var(--focus);outline-offset:2px}.model-picker-select optgroup{color:#111;background:#fff;font-weight:600}.model-picker-select option{color:#111;background:#fff}.content,.viewer-root,.viewer-canvas-wrapper{width:100%;height:100%}.viewer-canvas-wrapper{position:relative}.viewer-canvas-wrapper canvas{display:block}.dev-stats{position:fixed;top:12px;right:12px;z-index:10;width:min(280px,calc(100vw - 24px));padding:10px 12px;border-radius:10px;background:var(--panel);border:1px solid var(--panel-border);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);font-size:11px;line-height:1.35;pointer-events:auto}.dev-stats.is-collapsed{width:auto;min-width:0}.dev-stats-head{display:flex;align-items:center;gap:8px}.dev-stats-title{flex:1;min-width:0;font-size:11px;font-weight:600;letter-spacing:.02em;color:#f5f5f5e0}.dev-stats:not(.is-collapsed) .dev-stats-title{margin-bottom:0}.dev-stats:not(.is-collapsed) .dev-stats-head{margin-bottom:8px}.dev-stats-tiers{display:flex;gap:4px;margin-bottom:8px}.dev-stats-tier{flex:1;min-width:0;height:24px;padding:0 4px;border:1px solid rgba(255,255,255,.12);border-radius:6px;background:#ffffff0f;color:#f5f5f5b8;font-size:10px;line-height:22px;cursor:pointer}.dev-stats-tier:hover{background:#ffffff1f;color:#f5f5f5}.dev-stats-tier.is-active{border-color:#72b7f28c;background:#72b7f238;color:#f5f5f5}.dev-stats-tier:focus-visible{outline:2px solid var(--focus);outline-offset:1px}.dev-stats-toggle{flex:0 0 auto;width:22px;height:22px;padding:0;border:0;border-radius:6px;background:#ffffff14;color:#f5f5f5d9;font-size:12px;line-height:22px;cursor:pointer}.dev-stats-toggle:hover{background:#ffffff24}.dev-stats-muted{color:#f5f5f573}.dev-stats-block+.dev-stats-block{margin-top:8px;padding-top:8px;border-top:1px solid rgba(255,255,255,.08)}.dev-stats-row{display:flex;justify-content:space-between;gap:12px}.dev-stats-k{color:#f5f5f58c;white-space:nowrap}.dev-stats-v{color:#f5f5f5;font-variant-numeric:tabular-nums;text-align:right}.dev-stats-v.is-warn{color:#f0c36d}.dev-stats-gpu{margin-top:8px;padding-top:8px;border-top:1px solid rgba(255,255,255,.08);color:#f5f5f573;font-size:10px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.viewer-loading,.app-loading,.viewer-error,.empty-state{border:1px solid var(--panel-border);border-radius:8px;background:var(--panel);color:var(--text);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.viewer-loading{width:max-content;padding:10px 14px;font-size:13px}.app-loading{position:absolute;inset:50% auto auto 50%;padding:10px 14px;transform:translate(-50%,-50%)}.viewer-error{position:absolute;inset:50% auto auto 50%;z-index:5;display:grid;width:min(420px,calc(100vw - 32px));gap:10px;padding:18px;transform:translate(-50%,-50%)}.viewer-error span{color:var(--text-muted);overflow-wrap:anywhere}.viewer-error button{min-height:36px;padding:7px 12px;cursor:pointer}.empty-state{position:absolute;inset:50% auto auto 50%;margin:0;padding:14px;transform:translate(-50%,-50%)}button:focus-visible,select:focus-visible{outline:2px solid var(--focus);outline-offset:2px}@media (max-width: 800px){.topbar{right:12px;max-width:calc(100vw - 24px)}.model-picker{width:100%}.model-picker-field{flex:1 1 140px;min-width:0}.model-picker-select{min-width:0;width:100%;max-width:none}.dev-stats{top:auto;right:12px;left:auto;bottom:max(12px,env(safe-area-inset-bottom,0px));width:min(280px,calc(100vw - 24px));max-height:min(45svh,calc(100svh - 160px));overflow:auto}.dev-stats.is-collapsed{width:auto}}.import-file-input{display:none}.import-button{min-height:30px;padding:5px 10px;border:1px solid rgba(114,183,242,.45);border-radius:6px;background:#72b7f229;color:#f5f5f5;cursor:pointer}.import-button:hover{background:#72b7f242}.import-status{max-width:min(40vw,440px);overflow:hidden;color:var(--text-muted);font-size:12px;text-overflow:ellipsis;white-space:nowrap}.model-picker-toggle{display:flex;align-items:center;gap:7px;min-height:30px;color:#f5f5f5d1;font-size:12px;white-space:nowrap;cursor:pointer;-webkit-user-select:none;user-select:none}.model-picker-toggle input{width:16px;height:16px;margin:0;accent-color:var(--focus);cursor:pointer}
