*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#3a3a5a;border-radius:3px}::-webkit-scrollbar-thumb:hover{background:#5a5a8a}*{scrollbar-width:thin;scrollbar-color:#3a3a5a transparent}:root{--bg: #0f0f0f;--surface: #1a1a2e;--primary: #6c63ff;--primary-hover: #5a52d5;--text: #e0e0e0;--text-muted: #888;--border: #2a2a3e;--danger: #ff4d4d;--success: #4caf50;--warning: #ff9800;--radius: 8px;--navbar-height: 52px}html,body{height:100%;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Helvetica Neue,sans-serif;background:var(--bg);color:var(--text);overflow:hidden}#root{height:100%;display:flex;flex-direction:column}@keyframes pageFadeIn{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}.page-transition{animation:pageFadeIn .25s ease-out}.tabular-nums{font-variant-numeric:tabular-nums}.label-uppercase{font-size:.75rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em}.navbar{height:var(--navbar-height);background:var(--surface);border-bottom:1px solid var(--border);display:flex;align-items:center;padding:0 20px;flex-shrink:0;z-index:20;position:relative}.navbar-brand{display:flex;align-items:center;gap:8px;font-size:1.1rem;font-weight:700;color:var(--primary);-webkit-user-select:none;user-select:none}.viewer-layout{display:flex;flex-direction:row;height:calc(100vh - var(--navbar-height));width:100vw;overflow:hidden}.mesh-list-panel{width:260px;flex-shrink:0;display:flex;flex-direction:column;overflow-y:auto;border-right:1px solid var(--border);background:var(--surface)}.canvas-area{flex:1;display:flex;flex-direction:column;overflow:hidden;position:relative}.canvas-mount{flex:1;position:relative;overflow:hidden;touch-action:none}.canvas-mount canvas{display:block;width:100%!important;height:100%!important}.info-panel{padding:14px 18px;border-top:1px solid var(--border);background:var(--surface);flex-shrink:0;min-height:80px}.info-panel h2{font-size:1.1rem;font-weight:700;color:#fff;margin-bottom:4px}.info-panel .info-description{font-size:.83rem;color:var(--text-muted);line-height:1.55;margin-bottom:8px}.info-stats{display:flex;gap:16px;font-size:.8rem;color:var(--text-muted)}.info-stats span{font-variant-numeric:tabular-nums}.category-filter{display:flex;gap:4px;padding:10px 10px 6px;flex-shrink:0}.category-btn{background:transparent;border:1px solid var(--border);border-radius:20px;color:var(--text-muted);cursor:pointer;font-size:.78rem;font-weight:500;padding:4px 12px;transition:all .2s ease;min-height:44px}.category-btn:hover{border-color:var(--primary);color:var(--text)}.category-btn.active{background:var(--primary);border-color:var(--primary);color:#fff}.category-btn:focus-visible{outline:2px solid var(--primary);outline-offset:2px}.badge{display:inline-block;font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;padding:2px 7px;border-radius:10px;flex-shrink:0}.badge-in-game{background:#4caf5033;color:var(--success)}.badge-concept{background:#ff980033;color:var(--warning)}.mesh-list-item{display:flex;align-items:center;gap:8px;padding:10px 12px;cursor:pointer;min-height:44px;border-bottom:1px solid var(--border);transition:all .2s ease;-webkit-user-select:none;user-select:none;touch-action:manipulation;-webkit-tap-highlight-color:transparent;flex-shrink:0}.mesh-list-item:hover{background:#6c63ff14}.mesh-list-item.active{background:#6c63ff2e;border-left:3px solid var(--primary)}.mesh-list-item .item-name{font-size:.85rem;font-weight:600;color:var(--text);flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mesh-list-item:focus-visible{outline:2px solid var(--primary);outline-offset:-2px}.empty-state{padding:20px 14px;font-size:.82rem;color:var(--text-muted);line-height:1.6;text-align:center}.canvas-overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;z-index:10;background:#0f0f0fd9;pointer-events:none}.canvas-overlay p{color:var(--text-muted);font-size:.9rem;text-align:center;padding:0 20px}.canvas-overlay.error-overlay{background:#0f0f0feb}.canvas-overlay .error-msg{color:var(--danger);font-size:.88rem}.spinner{width:36px;height:36px;border:3px solid var(--border);border-top-color:var(--primary);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.viewer-controls{display:flex;gap:8px;padding:10px 10px 6px;flex-shrink:0}.ctrl-btn{background:#22263a;border:1px solid var(--border);border-radius:6px;color:var(--text);cursor:pointer;font-size:.8rem;padding:7px 12px;transition:all .2s ease;min-height:44px;flex:1}.ctrl-btn:hover:not(:disabled){background:#2a2f4a;border-color:var(--primary);transform:scale(1.02)}.ctrl-btn.active{background:#1e3060;border-color:var(--primary);color:#fff}.ctrl-btn:disabled{opacity:.35;cursor:default}.ctrl-btn:focus-visible{outline:2px solid var(--primary);outline-offset:2px}@media (max-width: 700px){.viewer-layout{flex-direction:column}.mesh-list-panel{width:100%;height:80px;min-height:80px;flex-direction:row;overflow-x:auto;overflow-y:hidden;border-right:none;border-bottom:1px solid var(--border)}.canvas-mount{height:50vh;flex:none}.mesh-list-item{flex-direction:column;min-width:80px;height:80px;border-bottom:none;border-right:1px solid var(--border);padding:6px 8px;justify-content:center;align-items:center}.mesh-list-item .item-name{font-size:.72rem;text-align:center}}