.gyro-app,.gyro-lower{max-width:1480px;margin:0 auto;padding:0 clamp(16px,3vw,44px) 28px;color:#e7fbf7}.gyro-layout{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(290px,.8fr);gap:20px;align-items:start}.gyro-stage,.gyro-controls,.gyro-card{padding:clamp(16px,2.3vw,28px);min-width:0}.gyro-stage h2{font-size:clamp(1.35rem,2.5vw,2.1rem);line-height:1.2;margin:8px 0 14px}.gyro-stage header{display:flex;justify-content:space-between;gap:12px}.gyro-state{font:700 .8rem monospace;color:#91ffbf;white-space:nowrap}.gyro-stage p,.gyro-card p,.gyro-controls p{color:#a8bfbd;font-size:.88rem;line-height:1.7}.gyro-canvas-wrap{border:1px solid #264744;background:#070e13}.gyro-canvas-wrap canvas{display:block;width:100%;height:auto;aspect-ratio:4/3;touch-action:pan-y}.gyro-canvas-wrap canvas:focus-visible,.gyro-app button:focus-visible,.gyro-app select:focus-visible,.gyro-app input:focus-visible,.gyro-app a:focus-visible{outline:2px solid #91ffbf;outline-offset:4px}.gyro-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:#26413f;border:1px solid #26413f;margin:16px 0 0}.gyro-metrics>div{background:#0b1719;padding:12px;min-width:0}.gyro-metrics dt{font:600 .68rem/1.4 monospace;color:#91b0ad}.gyro-metrics dd{margin:6px 0 0;font:600 .94rem/1.3 monospace;overflow-wrap:anywhere;color:#e7fbf7}.gyro-controls h2,.gyro-card h2{font-size:1.25rem;margin:6px 0 16px}.gyro-controls label{display:block;font:.78rem/1.5 monospace;color:#c5e3dc;margin:18px 0 7px}.gyro-controls output{float:right;color:#91ffbf}.gyro-app select{width:100%;min-height:44px;border:1px solid #365b55;background:#0b1719;color:#e7fbf7;padding:8px;font:inherit;max-width:100%}.gyro-app input[type=range]{width:100%;min-height:44px;accent-color:#91ffbf}.gyro-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin:18px 0}.gyro-app button,.gyro-app a[download]{min-height:44px;border:1px solid #365b55;border-radius:0;background:#102524;color:#d8f5eb;padding:10px;font:700 .73rem/1.4 monospace;cursor:pointer;text-decoration:none;overflow-wrap:anywhere}.gyro-app button:hover{background:#1b3c35}.gyro-app button:disabled{opacity:.45;cursor:default}.gyro-app button[aria-pressed=true]{background:#91ffbf;color:#06130b}.gyro-results{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin:20px 0}.gyro-table-wrap{overflow-x:auto} .gyro-app table{width:100%;border-collapse:collapse;font:.72rem/1.5 monospace}.gyro-app th,.gyro-app td{padding:9px 6px;text-align:left;border-bottom:1px solid #26413f;overflow-wrap:anywhere}.gyro-app th{color:#91ffbf}.gyro-output{display:flex;gap:8px;flex-wrap:wrap;margin:16px 0}.gyro-app pre{max-height:360px;overflow:auto;white-space:pre-wrap;overflow-wrap:anywhere;font-size:.75rem}.gyro-app details{margin:16px 0}.gyro-app summary{min-height:44px;cursor:pointer;padding:12px 0}.gyro-app code{overflow-wrap:anywhere;white-space:normal}.gyro-app kbd{font-size:.75rem}.gyro-notes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.gyro-lower{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.gyro-app [hidden]{display:none!important}.gyro-formulas{font: .85rem/1.8 monospace}.gyro-badge{color:#91ffbf;font-family:monospace}.gyro-fallback{padding:20px;border:1px solid #ffc574;color:#e7fbf7;overflow-wrap:anywhere}.gyro-help{font-size:.78rem!important}.gyro-legend{display:flex;flex-wrap:wrap;gap:14px;font: .7rem/1.5 monospace;color:#a8bfbd;margin:10px 0}.gyro-legend span:first-child{color:#91ffbf}.gyro-legend span:nth-child(2){color:#83adff}.gyro-legend span:nth-child(3){color:#ffc574}@media(max-width:980px){.gyro-layout{grid-template-columns:minmax(0,1fr)}.gyro-controls{display:block}.gyro-lower{grid-template-columns:minmax(0,1fr)}.gyro-canvas-wrap canvas{aspect-ratio:4/3}}@media(max-width:600px){.gyro-results,.gyro-notes{grid-template-columns:minmax(0,1fr)}.gyro-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.gyro-stage header{display:block}.gyro-state{display:block;margin-bottom:12px}.gyro-app,.gyro-lower{padding-left:16px;padding-right:16px}.gyro-stage,.gyro-controls,.gyro-card{padding:16px}.gyro-app th,.gyro-app td{padding:8px 4px;font-size:.65rem}}