:root{color-scheme:dark;font-family:Inter,ui-sans-serif,system-ui,sans-serif;color:#f4f5ee;background:#090c0f;font-synthesis:none;--line: #283036;--muted: #899398;--lime: #d7ff64;--orange: #ff6b4a}*{box-sizing:border-box}html,body{min-width:320px;min-height:100%;margin:0}body{background:radial-gradient(circle at 18% 10%,rgba(63,112,117,.13),transparent 34rem),radial-gradient(circle at 82% 65%,rgba(215,255,100,.035),transparent 28rem),#090c0f}button{color:inherit;font:inherit}button:focus-visible{outline:2px solid var(--lime);outline-offset:3px}button:disabled{cursor:wait;opacity:.45}.app-shell{width:min(1440px,100%);min-height:100vh;margin:0 auto;padding:0 clamp(16px,3.5vw,52px)}.topbar{min-height:78px;display:flex;align-items:center;justify-content:space-between;gap:20px;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:13px;color:inherit;text-decoration:none}.brand>span:last-child{display:flex;flex-direction:column}.brand strong{font:600 12px/1.3 ui-monospace,SFMono-Regular,monospace;letter-spacing:.14em}.brand small{color:#6f797e;font:500 8px/1.5 ui-monospace,monospace;letter-spacing:.11em;text-transform:uppercase}.brand-mark{position:relative;width:36px;height:36px;border:1px solid #536066;transform:rotate(8deg)}.brand-mark i{position:absolute;display:block;border:1px solid var(--lime)}.brand-mark i:first-child{width:12px;height:12px;left:5px;top:15px;background:#d7ff641f;transform:rotate(20deg)}.brand-mark i:last-child{width:9px;height:9px;right:5px;top:6px;border-radius:50%;background:var(--orange);border-color:var(--orange)}.engine-state{display:flex;align-items:center;gap:8px;color:#99a3a8;font:600 9px/1.4 ui-monospace,monospace;letter-spacing:.08em;text-transform:uppercase}.status-dot{width:7px;height:7px;border-radius:50%;background:#ffc857;box-shadow:0 0 10px #ffc8578c;animation:blink 1s infinite}.engine-state[data-state=running]{color:var(--lime)}.engine-state[data-state=running] .status-dot{background:var(--lime);box-shadow:0 0 12px #d7ff6499;animation:none}.engine-state[data-state=error]{color:#ff8c74}.engine-state[data-state=error] .status-dot{background:#ff6b4a;animation:none}.intro{display:grid;grid-template-columns:1.1fr .9fr;align-items:end;gap:40px;padding:clamp(36px,6vw,84px) 0 clamp(30px,4vw,52px)}.eyebrow{margin:0 0 18px;color:var(--lime);font:600 9px/1 ui-monospace,monospace;letter-spacing:.18em}h1{margin:0;font-size:clamp(48px,7vw,96px);font-weight:550;line-height:.87;letter-spacing:-.072em}h1 em{color:#707a7f;font-style:normal;font-weight:400}.intro>p{max-width:500px;justify-self:end;margin:0 0 4px;color:#a4adb1;font-size:clamp(14px,1.3vw,18px);line-height:1.7}.playground{border:1px solid var(--line);background:#0c1013db;box-shadow:0 25px 80px #00000038}.toolbar{min-height:64px;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:10px;border-bottom:1px solid var(--line)}.tool-group,.action-group{display:flex;flex-wrap:wrap;gap:7px}.tool,.action{min-height:40px;padding:0 14px;border:1px solid #323c42;background:#151b1f;cursor:pointer;color:#a8b1b5;font:600 9px/1 ui-monospace,monospace;letter-spacing:.045em;text-transform:uppercase}.tool{display:inline-flex;align-items:center;gap:8px}.tool:hover,.action:hover{border-color:#657177;color:#f4f5ee}.tool.active{border-color:var(--lime);background:#d7ff641a;color:var(--lime)}.action:last-child{border-color:#684239;color:#ff9e89}.box-icon{width:12px;height:12px;display:inline-block;border:1px solid currentColor}.circle-icon{width:12px;height:12px;display:inline-block;border:1px solid currentColor;border-radius:50%}.joint-icon{font-size:11px;letter-spacing:-.12em}.grab-icon{font-size:14px}.canvas-wrap{position:relative;aspect-ratio:5 / 3;min-height:360px;max-height:760px;overflow:hidden}#physics-canvas{display:block;width:100%;height:100%;cursor:grab;touch-action:none}.canvas-label{position:absolute;z-index:2;left:15px;right:15px;top:14px;display:flex;justify-content:space-between;gap:12px;pointer-events:none;color:#d2dddd94;font:600 8px/1.3 ui-monospace,monospace;letter-spacing:.1em;text-transform:uppercase}.loading-card{position:absolute;z-index:5;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;background:#10151a}.loading-card[hidden]{display:none}.loading-card strong{font:600 11px/1 ui-monospace,monospace;letter-spacing:.09em;text-transform:uppercase}.loading-card small{color:#778388;font-size:11px}.loader{width:28px;height:28px;margin-bottom:7px;border:2px solid #344046;border-top-color:var(--lime);border-radius:50%;animation:spin .8s linear infinite}.telemetry{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line)}.telemetry>div{min-height:68px;display:flex;flex-direction:column;justify-content:center;gap:7px;padding:10px 16px;border-right:1px solid var(--line)}.telemetry>div:last-child{border-right:0}.telemetry span{color:#68757a;font:600 7px/1 ui-monospace,monospace;letter-spacing:.13em}.telemetry strong{color:#cbd2d0;font:600 10px/1 ui-monospace,monospace;letter-spacing:.03em}.telemetry>div:first-child strong{color:var(--lime)}footer{min-height:82px;display:flex;align-items:center;justify-content:space-between;gap:20px;color:#59656a;font:500 8px/1.5 ui-monospace,monospace;letter-spacing:.08em;text-transform:uppercase}@keyframes spin{to{transform:rotate(360deg)}}@keyframes blink{50%{opacity:.35}}@media (max-width: 900px){.intro{grid-template-columns:1fr;align-items:start}.intro>p{justify-self:start}.toolbar{align-items:flex-start;flex-direction:column}.telemetry{grid-template-columns:1fr 1fr}.telemetry>div:nth-child(2){border-right:0}.telemetry>div:nth-child(-n+2){border-bottom:1px solid var(--line)}}@media (max-width: 620px){.topbar{min-height:86px}.engine-state{max-width:140px;justify-content:flex-end;text-align:right}.intro{gap:24px}.canvas-wrap{aspect-ratio:4 / 3;min-height:330px}.tool-group{display:grid;width:100%;grid-template-columns:1fr 1fr}.tool{justify-content:center;padding:0 7px}.action-group{width:100%}.action{flex:1}.canvas-label span:last-child{display:none}footer{min-height:92px;align-items:flex-start;flex-direction:column;justify-content:center}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important}}