@import"https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Space+Grotesk:wght@400;500;600;700&display=swap";:root{font-family:Space Grotesk,sans-serif;color:#263238;background:#e7e4db;font-synthesis:none}*{box-sizing:border-box}body{margin:0;min-width:320px}#app{max-width:1700px;margin:auto;padding:24px 30px 30px}header{display:flex;justify-content:space-between;align-items:end;gap:20px;padding-bottom:18px;border-bottom:1px solid #c3c0b6}.eyebrow,.label,.status,.model-tag,.controls-title,footer{font:500 10px DM Mono,monospace;letter-spacing:.1em}.eyebrow,.model-tag{color:#bd6040}h1{margin:7px 0 0;font-size:34px;line-height:1.05}.lede{margin:9px 0 0;color:#747b77;font-size:13px}.status{color:#59605e;white-space:nowrap}.status:before{display:inline-block;width:7px;height:7px;margin-right:8px;border-radius:50%;background:#8ca9a4;content:""}main{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:16px;padding-top:16px}.model-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;min-width:0}.model-panel{min-width:0;background:#f3f0e8;border:1px solid #d1cec3}.model-head{display:flex;justify-content:space-between;align-items:baseline;gap:8px;padding:13px 14px 10px}.model-head h2{margin:0;font-size:15px;font-weight:600}.model-tag{text-align:right;font-size:9px}.stage{position:relative;height:min(60vh,600px);min-height:380px;overflow:hidden;background:#ebe8df;border-top:1px solid #d1cec3;border-bottom:1px solid #d1cec3}.stage canvas{display:block;width:100%;height:100%}.readout{display:flex;justify-content:space-between;gap:8px;padding:9px 14px;color:#737a76;font:10px DM Mono,monospace}.metrics{display:grid;grid-template-columns:1fr 1fr;gap:9px;padding:12px 14px 14px;border-top:1px solid #d1cec3}.metric{min-width:0}.metric span{display:block;color:#777e79;font:9px DM Mono,monospace;letter-spacing:.05em}.metric strong{display:block;margin-top:3px;font-size:21px;line-height:1.1}.metric-wide{grid-column:1 / -1}.metric-wide strong{font-size:12px;font-weight:500}aside{display:flex;flex-direction:column;gap:14px;padding:16px;background:#f3f0e8}.controls-title{display:flex;justify-content:space-between;color:#59605e}.controls-title a{color:#bd6040;text-decoration:none}.actions{display:grid;grid-template-columns:1fr 1fr;gap:6px}button,select{min-height:36px;border:1px solid #c6c3b9;background:#ebe8df;color:#344044;font:500 10px DM Mono,monospace;cursor:pointer}button{padding:8px}button.primary{grid-column:1 / -1;background:#344044;color:#f5f1e7}button:disabled{opacity:.45;cursor:default}.control{padding-top:10px;border-top:1px solid #d5d1c6}.control label{display:flex;justify-content:space-between;gap:8px;margin-bottom:7px;color:#59605e;font:500 9px DM Mono,monospace;letter-spacing:.06em}.control output{color:#bd6040}select,input[type=range]{width:100%}select{padding:0 9px}input[type=range]{accent-color:#bd6040}.speed{display:grid;grid-template-columns:repeat(4,1fr);gap:4px}.speed button.selected{background:#bd6040;color:#fff;border-color:#bd6040}.model-parameters{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding-top:10px;border-top:1px solid #d5d1c6}.model-parameters h3{grid-column:1 / -1;margin:0;color:#59605e;font:500 9px DM Mono,monospace;letter-spacing:.08em}.model-parameters .control{padding-top:0;border:0}.model-parameters .control label{min-height:22px;font-size:8px}footer{margin-top:auto;color:#969b95;font-size:9px}@media(max-width:1050px){#app{padding:20px}main{grid-template-columns:1fr}aside{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}.controls-title,.actions,footer{grid-column:1 / -1}}@media(max-width:700px){#app{padding:14px}header{align-items:flex-start}h1{font-size:28px}.lede{max-width:44ch}.status{padding-top:7px;font-size:9px}.model-grid{grid-template-columns:1fr}.stage{height:340px;min-height:300px}aside{display:flex}}.mechanism-note{margin:0;padding:13px 15px;border-top:1px solid #d1cec3;color:#59605e;font-size:12px;line-height:1.55}.mechanism-note strong{color:#344044}.mechanism-note code{color:#a85034;font:11px DM Mono,monospace}.phase-meter{height:5px;margin-top:7px;background:#d9d5ca}.phase-meter i{display:block;width:0;height:100%;background:#6b9994;transition:width .15s linear}.torsion-stage-label{position:absolute;top:14px;left:16px;color:#737a76;font:9px DM Mono,monospace;letter-spacing:.08em;pointer-events:none}.torsion-stage-label:before{display:inline-block;width:15px;height:3px;margin:0 7px 2px 0;background:#527f98;content:""}.model-parameters .control label{min-height:16px}aside{gap:9px;padding:12px;align-items:stretch}.actions{grid-template-columns:repeat(4,minmax(0,1fr));width:100%;gap:5px}.actions button,.actions button.primary{grid-column:auto;min-width:0;min-height:34px;padding:5px 2px;font-size:12px}.control{padding-top:7px}.control label{margin-bottom:4px;font-size:8px}.grid-dimensions{gap:6px;padding-top:7px}.grid-dimensions input{min-height:32px}.model-parameters{gap:6px;padding-top:7px}.model-parameters .control label{min-height:14px}.preset-parameters h3{display:flex;align-items:baseline;justify-content:space-between;gap:5px}.preset-parameters h3 span{color:#777e79;font:8px DM Mono,monospace;letter-spacing:0;text-align:right}.preset-grid{display:grid;grid-column:1 / -1;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px}.preset-grid button{min-width:0;min-height:36px;padding:8px;font-size:10px}.preset-grid button.saved{border-color:#8ca9a4;color:#527f78}@media(max-width:700px){header>div:first-child{min-width:0}.status{max-width:108px;flex-shrink:1;white-space:normal;text-align:right;font-size:8px;line-height:1.4}.stage{height:54vh;min-height:320px}}.grid-dimensions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;padding-top:7px;border-top:1px solid #d5d1c6}.grid-dimensions label{display:grid;gap:6px;color:#59605e;font:500 9px DM Mono,monospace;letter-spacing:.06em}.grid-dimensions input{width:100%;min-height:36px;padding:0 9px;border:1px solid #c6c3b9;background:#ebe8df;color:#344044;font:500 12px DM Mono,monospace}.grid-total{min-width:0}.grid-total output{display:flex;align-items:center;width:100%;min-height:36px;padding:0 9px;border:1px solid #c6c3b9;background:#ebe8df;color:#bd6040;font:500 12px DM Mono,monospace}.swing-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px}.swing-options button{min-height:32px;padding:6px 3px;font-size:7px}.swing-options button.selected{background:#bd6040;color:#fff;border-color:#bd6040}.torsion-stage-label{background:#f3f0e8d1;padding:5px 7px}
