@import"https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@300;400;500&family=Geist:wght@300;400;500&display=swap";.app-root{width:100%;height:100%;position:relative;background:var(--bg);overflow:hidden}.canvas-container{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%}.canvas-container canvas{width:100%!important;height:100%!important}.loading-overlay{position:absolute;top:0;right:0;bottom:0;left:0;z-index:100;display:flex;align-items:center;justify-content:center;background:var(--bg);transition:opacity .6s ease;pointer-events:none}.loading-content{display:flex;flex-direction:column;align-items:center;gap:16px}.loading-spinner{width:24px;height:24px;border:1.5px solid var(--border);border-top-color:var(--accent);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.loading-text{font-family:var(--font-display);font-weight:300;font-size:11px;letter-spacing:.15em;color:var(--muted);text-transform:uppercase}.fps-counter{position:absolute;top:20px;right:20px;z-index:10;display:flex;align-items:baseline;gap:6px;padding:6px 10px;background:#23232b99;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:.5px solid var(--glass-border);border-radius:2px;font-family:var(--font-display);font-weight:300;pointer-events:none}.fps-label{font-size:9px;letter-spacing:.1em;color:var(--muted);text-transform:uppercase}.fps-value{font-size:13px;color:var(--fg);font-variant-numeric:tabular-nums}.nav-strip{position:absolute;left:0;top:50%;transform:translateY(-50%);z-index:10;display:flex;flex-direction:column;gap:4px;padding:8px 6px}.nav-btn{width:36px;height:36px;display:flex;align-items:center;justify-content:center;border-radius:2px;color:var(--muted);font-size:16px;transition:all .15s ease;position:relative}.nav-btn:hover{color:var(--fg);background:#23232b80}.nav-btn.active{color:var(--accent);background:#23232bb3}.nav-btn.active:before{content:"";position:absolute;left:-6px;top:50%;transform:translateY(-50%);width:2px;height:20px;background:var(--accent);border-radius:1px}.side-panel{position:absolute;left:50px;top:50%;transform:translateY(-50%);z-index:10;width:240px;max-height:70vh;overflow-y:auto;background:#23232bb3;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:.5px solid var(--glass-border);border-radius:2px;animation:slideIn .2s ease}@keyframes slideIn{0%{opacity:0;transform:translateY(-50%) translate(-8px)}to{opacity:1;transform:translateY(-50%) translate(0)}}.panel-header{display:flex;align-items:center;justify-content:space-between;padding:12px 14px;border-bottom:.5px solid var(--glass-border)}.panel-title{font-family:var(--font-display);font-weight:300;font-size:11px;letter-spacing:.12em;color:var(--fg);text-transform:uppercase}.panel-close{font-size:12px;color:var(--muted);transition:color .15s ease;line-height:1}.panel-close:hover{color:var(--fg)}.panel-body{padding:10px 14px 16px}.panel-section{padding:10px 0}.panel-section+.panel-section{border-top:.5px solid var(--glass-border)}.section-label{font-family:var(--font-display);font-weight:300;font-size:9px;letter-spacing:.15em;color:var(--muted);text-transform:uppercase;margin-bottom:8px}.info-row{display:flex;align-items:center;justify-content:space-between;padding:4px 0;font-family:var(--font-body);font-size:11px;color:var(--fg)}.info-val{color:var(--muted);font-family:var(--font-display);font-weight:300;font-size:10px;letter-spacing:.03em}.panel-btn{display:block;width:100%;padding:7px 10px;margin-bottom:4px;font-family:var(--font-display);font-weight:300;font-size:10px;letter-spacing:.1em;color:var(--fg);text-align:left;border:.5px solid var(--glass-border);border-radius:2px;background:#ffffff05;transition:all .15s ease;text-transform:uppercase}.panel-btn:hover{background:#d48c4a1a;border-color:var(--accent);color:var(--accent)}.panel-btn.active-btn{background:#d48c4a26;border-color:var(--accent);color:var(--accent)}.viewport-label{position:absolute;bottom:20px;left:20px;z-index:10;font-family:var(--font-display);font-weight:300;font-size:9px;letter-spacing:.15em;color:var(--muted);text-transform:uppercase;pointer-events:none}.bottom-title{position:absolute;bottom:20px;right:20px;z-index:10;display:flex;align-items:baseline;gap:6px;pointer-events:none}.title-main{font-family:var(--font-display);font-weight:300;font-size:16px;letter-spacing:.08em;color:var(--accent)}.title-sub{font-family:var(--font-display);font-weight:300;font-size:9px;letter-spacing:.15em;color:var(--muted);text-transform:uppercase}.side-panel::-webkit-scrollbar{width:4px}.side-panel::-webkit-scrollbar-track{background:transparent}.side-panel::-webkit-scrollbar-thumb{background:var(--border);border-radius:2px}.side-panel::-webkit-scrollbar-thumb:hover{background:var(--muted)}@media (max-width: 600px){.side-panel{width:200px;left:46px}.bottom-title .title-main{font-size:13px}}:root{--bg: #18181f;--surface: #23232b;--border: #2e2e38;--fg: #eee5cd;--muted: #a09a8a;--accent: #d48c4a;--accent-cool: #5b9188;--glass-border: rgba(255, 255, 255, .063);--font-display: "JetBrains Mono", ui-monospace, monospace;--font-body: "Geist", system-ui, sans-serif;--text-sm: 11px;--text-lg: 13px;font-family:var(--font-body);color:var(--fg);background:var(--bg)}*{margin:0;padding:0;box-sizing:border-box}html,body,#root{width:100%;height:100%;overflow:hidden;background:var(--bg)}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}canvas{display:block}button{font-family:inherit;cursor:pointer;color:inherit;background:none;border:none}a{color:inherit;text-decoration:none}