:root{--viewport-bg:#1d2127;--chrome-bg:#16191e;--panel-bg:#181b21f0;--panel-border:#ffffff14;--text:#e7e9ee;--text-dim:#9aa1ad;--accent:#5fb3ff;--hover:#5fb3ff1f;--selected:#5fb3ff3d;--btn-bg:#ffffff14;--radius:8px;--topbar-h:44px;color:var(--text);--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,sans-serif}:root[data-theme=light]{--viewport-bg:#eef0f3;--chrome-bg:#fff;--panel-bg:#fffffff5;--panel-border:#0000001a;--text:#1c2027;--text-dim:#5d6572;--accent:#1f73c9;--hover:#1f73c914;--selected:#1f73c929;--btn-bg:#0000000f;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}*{box-sizing:border-box}html,body{background:var(--viewport-bg);height:100%;margin:0;overflow:hidden}#app{grid-template-columns:270px 1fr 300px;grid-template-rows:var(--topbar-h) 1fr;grid-template-areas:"top top top""layers view gui";display:grid;position:fixed;inset:0}#topbar{border-bottom:1px solid var(--panel-border);background:var(--chrome-bg);grid-area:top;align-items:center;gap:14px;min-width:0;padding:0 14px;display:flex}.brand{letter-spacing:.02em;white-space:nowrap;font-weight:700}.title{white-space:nowrap;text-overflow:ellipsis;min-width:0;font-size:14px;overflow:hidden}.menu-wrap{min-width:0;position:relative}.menu-btn{background:var(--btn-bg);border:1px solid var(--panel-border);max-width:100%;color:var(--text);cursor:pointer;font:inherit;border-radius:6px;align-items:center;gap:8px;padding:5px 10px;display:flex}.menu-btn:hover{border-color:var(--accent)}.caret{color:var(--text-dim);font-size:11px}.menu{z-index:20;background:var(--panel-bg);border:1px solid var(--panel-border);border-radius:var(--radius);width:min(380px,100vw - 20px);max-height:70vh;padding:6px;position:absolute;top:calc(100% + 6px);left:0;overflow-y:auto;box-shadow:0 12px 32px #0000004d}.menu h4{text-transform:uppercase;letter-spacing:.08em;color:var(--text-dim);margin:8px 8px 4px;font-size:11px}.menu-item{text-align:left;width:100%;color:var(--text);cursor:pointer;font:inherit;background:0 0;border:0;border-radius:6px;padding:8px 10px;display:block}.menu-item:hover,.menu-item:focus-visible{background:var(--hover);outline:none}.menu-item.active{background:var(--selected)}.menu-item .name{font-size:14px;font-weight:600}.menu-item .desc{color:var(--text-dim);margin-top:2px;font-size:12px}.theme-btn{font:inherit;color:var(--text);background:var(--btn-bg);border:1px solid var(--panel-border);cursor:pointer;white-space:nowrap;border-radius:999px;align-items:center;gap:7px;padding:5px 14px 5px 10px;font-size:14px;font-weight:600;display:flex}.theme-btn:hover{border-color:var(--accent)}.theme-btn .icon{font-size:20px;line-height:1}.badge{background:var(--btn-bg);color:var(--text-dim);white-space:nowrap;border-radius:999px;margin-left:auto;padding:3px 8px;font-size:12px}.badge.exaggerated{color:#d98a1c;background:#ffb04029}:root[data-theme=dark] .badge.exaggerated{color:#ffc46b}#viewport{grid-area:view;min-width:0;min-height:0;position:relative}#viewport canvas{touch-action:none;width:100%;height:100%;display:block}.panel{background:var(--panel-bg);border:1px solid var(--panel-border)}#layers{border-width:0 1px 0 0;grid-area:layers;padding:8px 0;overflow-y:auto}#layers h2{text-transform:uppercase;letter-spacing:.08em;color:var(--text-dim);align-items:center;margin:6px 14px 8px;font-size:11px;font-weight:600;display:flex}#layers h2 button{margin-left:auto}.layer-row{cursor:pointer;-webkit-user-select:none;user-select:none;grid-template-columns:14px 1fr auto auto;align-items:center;gap:8px;padding:5px 10px 5px 14px;font-size:13px;display:grid}.layer-row:hover,.layer-row.hover{background:var(--hover)}.layer-row.selected{background:var(--selected)}.layer-row.hidden .layer-name{color:var(--text-dim);text-decoration:line-through}.swatch{border:1px solid var(--panel-border);border-radius:3px;flex:none;width:14px;height:14px}.layer-name{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.icon-btn{color:var(--text-dim);cursor:pointer;background:0 0;border:0;border-radius:4px;padding:2px 4px;font-size:13px;line-height:1}.icon-btn:hover{color:var(--text);background:var(--btn-bg)}.icon-btn.on{color:var(--accent)}.text-btn{background:var(--btn-bg);color:var(--text);cursor:pointer;text-transform:none;letter-spacing:0;border:0;border-radius:4px;padding:3px 8px;font-size:11px}#info{border-radius:var(--radius);width:min(380px,100vw - 600px);padding:12px 14px;font-size:13px;line-height:1.45;position:absolute;bottom:14px;left:284px;box-shadow:0 8px 24px #00000059}#info h3{align-items:center;gap:8px;margin:0 0 2px;font-size:15px;display:flex}#info .material{color:var(--text-dim);margin-bottom:8px}#info p{margin:0 0 8px}#info dl{grid-template-columns:auto 1fr;gap:2px 12px;margin:0;font-size:12px;display:grid}#info dt{color:var(--text-dim)}#info dd{font-variant-numeric:tabular-nums;margin:0}#info .close{position:absolute;top:8px;right:8px}#gui{background:var(--chrome-bg);border-left:1px solid var(--panel-border);grid-area:gui;overflow-y:auto}#gui .lil-gui.lil-root{--width:100%;--name-width:42%;--background-color:var(--chrome-bg)}:root[data-theme=light] #gui .lil-gui{--text-color:#1c2027;--title-background-color:#eef0f3;--title-text-color:#1c2027;--widget-color:#e3e6ea;--hover-color:#d6dae0;--focus-color:#c9ced6;--number-color:#1f73c9;--string-color:#2f8a3b}.status{color:var(--text-dim);pointer-events:none;font-size:14px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.status.error{color:#ff8a80;white-space:pre-wrap}.status:empty{display:none}@media (width<=1100px) and (width>=761px){#app{grid-template-columns:230px 1fr 260px}#info{width:min(340px,100vw - 510px);left:240px}}@media (width<=760px){.theme-btn .label{display:none}.theme-btn{padding:4px 8px}#app{grid-template-columns:1fr;grid-template-rows:var(--topbar-h) 1fr 34vh;grid-template-areas:"top""view""layers"}#gui{top:calc(var(--topbar-h) + 8px);z-index:5;background:0 0;border:0;grid-area:auto;position:absolute;right:8px;overflow:visible}#layers{border-width:1px 0 0}#info{width:auto;bottom:calc(34vh + 10px);left:10px;right:10px}#gui .lil-gui.lil-root{--width:min(260px, calc(100vw - 20px));max-height:45vh;overflow-y:auto}.brand,.badge{display:none}.menu-wrap{flex:1}}.tip{pointer-events:none;z-index:4;background:var(--panel-bg);color:var(--text);border:1px solid var(--panel-border);white-space:nowrap;border-radius:4px;padding:3px 8px;font-size:12px;position:absolute;transform:translate(12px,14px)}@media (hover:none){.tip{display:none}}.hud[hidden]{display:none}.hud{z-index:4;background:var(--panel-bg);border:1px solid var(--panel-border);border-radius:var(--radius);grid-template-columns:minmax(250px,1.1fr) minmax(200px,1fr) minmax(240px,1.3fr);align-items:start;gap:4px 18px;max-height:46%;padding:10px 12px;font-size:12.5px;line-height:1.45;display:grid;position:absolute;bottom:10px;left:10px;right:10px;overflow-y:auto;box-shadow:0 6px 20px #00000040}.hud .nums{font-variant-numeric:tabular-nums;grid-template-columns:repeat(4,auto);gap:2px 14px;display:grid}.hud .nums b{color:var(--text);font-size:15px;font-weight:650;display:block}.hud .nums span{color:var(--text-dim);font-size:11px}.hud .over b{color:#ff6a3d}.hud .stage{border-top:1px solid var(--panel-border);margin-top:8px;padding-top:6px;font-weight:600}.hud .note{color:var(--text-dim);margin-top:6px;font-size:11px}.hud .legend{color:var(--text-dim);align-items:center;gap:6px;margin-top:6px;font-size:11px;display:flex}.hud .bar{border:1px solid var(--panel-border);border-radius:4px;flex:1;height:8px}@media (width<=760px){.hud{padding:6px 8px;font-size:11px}.hud .nums b{font-size:13px}}.hud .chart{color:var(--text-dim);margin-top:6px;display:block}.hud{padding-right:30px}.hud .hud-toggle{position:absolute;top:6px;right:6px}.hud.collapsed .details{display:none}.freq-label{color:var(--text-dim);white-space:nowrap;margin-left:6px;font-size:11px}.hud .note sub{font-size:9px}.hud .col>:first-child{margin-top:0}.hud.collapsed{grid-template-columns:minmax(250px,1.1fr) minmax(200px,1fr)}#app.physics-on #info{top:10px;bottom:auto}@media (width<=1100px){.hud{grid-template-columns:1fr 1fr}.hud .col.details{grid-column:1/-1}}@media (width<=760px){.hud{grid-template-columns:1fr;max-height:32vh}}.hud .nums{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px 16px}.hud .nums span{white-space:nowrap}