body { overflow: auto; }
.site-shell { height: auto; grid-template-rows: auto auto auto auto; }
@media (min-width: 981px) { .workspace { height: max(660px, calc(100vh - 128px)); } }
.model-section { padding: 28px; margin-top: 8px; }
.model-section[hidden] { display: none; }
.model-heading { display: flex; justify-content: space-between; align-items: start; gap: 20px; margin-bottom: 22px; }
.model-heading h2 { font-size: clamp(22px, 3vw, 32px); font-weight: 600; margin: 7px 0; }
.model-heading p:not(.eyebrow) { color: var(--muted); max-width: 760px; }
.model-chip { color: var(--cyan); border: 1px solid var(--line-bright); border-radius: 20px; padding: 5px 12px; white-space: nowrap; font: 11px var(--font-mono); }
.model-picker { display:flex; flex-wrap:wrap; gap:7px; margin-top:16px; }
.model-choice { cursor:pointer; color:var(--muted); border:1px solid var(--line); border-radius:999px; padding:6px 12px; background:transparent; font:12px var(--font-mono); }
.model-choice[aria-selected="true"] { color:var(--cyan); border-color:var(--line-bright); background:rgba(var(--cyan-rgb),.08); }
.model-stage { height: 420px; position: relative; border: 1px solid var(--line); border-radius: 12px; overflow: hidden; background: radial-gradient(ellipse at center, #152b32, #080c12 72%); }
.model-stage canvas { display: block; width: 100%; height: 100%; touch-action: none; outline-offset: -4px; }
#modelStatus { position: absolute; z-index: 1; inset: 45% 20px auto; text-align: center; color: var(--muted); pointer-events: none; }
.model-axis { position: absolute; bottom: 20px; left: 22px; color: var(--quiet); font: 12px/1.8 var(--font-mono); pointer-events: none; }
.model-toolbar { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 16px; margin-top: 16px; }
.model-toolbar > span { font-size: 12px; color: var(--muted); }
.model-toolbar > div { display: flex; gap: 8px; flex-wrap: wrap; }
.model-toolbar button { cursor: pointer; padding: 8px 13px; color: var(--muted); border: 1px solid var(--line); border-radius: 7px; background: var(--surface-soft); }
.model-toolbar button[aria-pressed="true"] { color: var(--cyan); border-color: var(--line-bright); }
.model-toolbar button:hover { color: var(--text); }
@media (max-width: 640px) { .model-section { padding: 18px; } .model-stage { height: 330px; } .model-chip { display: none; } }
