Spaces:
Running
Running
| /* Hugging Face Static Space layout overrides. | |
| Keep the simulator at the parent iframe's natural browser zoom and neutralize | |
| the sidebar-oriented <main> rules inherited from the full D1 Studio CSS. */ | |
| html, | |
| body { | |
| zoom: 1 ; | |
| width: 100%; | |
| min-width: 0; | |
| } | |
| body.space-body { | |
| margin: 0; | |
| min-height: 100vh; | |
| min-height: 100dvh; | |
| overflow-x: hidden; | |
| } | |
| body.space-body > #spaceMain { | |
| box-sizing: border-box; | |
| width: min(1480px, calc(100vw - 48px)) ; | |
| max-width: 1680px ; | |
| margin: 0 auto ; | |
| padding: 24px 0 42px ; | |
| } | |
| .space-title { | |
| /* margin: 0 0 22px; */ | |
| font-size: 18px; | |
| font-weight: 650; | |
| letter-spacing: -.02em; | |
| color: var(--text); | |
| } | |
| .space-stage, | |
| #simMount { | |
| width: 100%; | |
| min-width: 0; | |
| margin: 0 auto; | |
| } | |
| .space-loading { | |
| padding: 48px; | |
| text-align: center; | |
| color: var(--muted); | |
| } | |
| /* Static Space has no Studio sidebar, so the simulation owns the centered shell. */ | |
| .hf-space-mode .sim-shell { | |
| width: 100% ; | |
| max-width: none ; | |
| margin-left: auto ; | |
| margin-right: auto ; | |
| } | |
| .hf-space-mode .sim-shell > .sim-head, | |
| .hf-space-mode .sim-shell > .task-line, | |
| .hf-space-mode .sim-shell > .sim-studio { | |
| width: 100% ; | |
| max-width: none ; | |
| margin-left: 0 ; | |
| margin-right: 0 ; | |
| } | |
| .hf-space-mode .sim-studio { | |
| /* grid-template-columns: minmax(0, 1fr) minmax(320px, 360px);*/ | |
| grid-template-columns: minmax(0, 1fr) minmax(300px, 300px); | |
| gap: 18px; | |
| } | |
| .hf-space-mode .sim-chat { | |
| width: 100%; | |
| max-width: none; | |
| } | |
| .hf-space-mode .saved-panel { | |
| display: none ; | |
| } | |
| .hf-space-mode .sim-bottom { | |
| grid-template-columns: minmax(0, 1fr) ; | |
| } | |
| .hf-space-mode .sim-bottom > .controls { | |
| width: 100%; | |
| } | |
| .hf-space-mode .sim-head-runtime-only { | |
| display: flex ; | |
| } | |
| .hf-space-mode .runtime-pill { | |
| margin: 0; | |
| } | |
| .hf-space-mode .sim-chat .card-title b { | |
| white-space: nowrap; | |
| } | |
| .hf-space-note { | |
| font-size: 12px; | |
| color: var(--muted); | |
| margin: 8px 0 0; | |
| } | |
| .hf-space-mode .chat-tools { | |
| flex-wrap: wrap; | |
| } | |
| .hf-space-mode .chat-empty strong { | |
| font-size: 14px; | |
| font-weight: 650; | |
| letter-spacing: -.02em; | |
| } | |
| @media (max-width: 1250px) { | |
| body.space-body > #spaceMain { | |
| width: min(1180px, calc(100vw - 32px)) ; | |
| } | |
| .hf-space-mode .sim-studio { | |
| grid-template-columns: minmax(0, 1fr) 300px; | |
| } | |
| } | |
| @media (max-width: 900px) { | |
| body.space-body > #spaceMain { | |
| width: calc(100vw - 24px) ; | |
| padding-top: 18px ; | |
| } | |
| .space-title { | |
| font-size: 21px; | |
| } | |
| .hf-space-mode .sim-studio { | |
| grid-template-columns: 1fr; | |
| } | |
| } | |
| /* Static VLM selector: one browser model dropdown, no provider/reasoning controls. */ | |
| .hf-space-mode #chat-model-name { | |
| margin-left: 6px; | |
| font-size: 11px; | |
| font-weight: 500; | |
| color: var(--muted); | |
| } | |
| .hf-space-mode #chat-model { | |
| width: 100%; | |
| min-width: 0; | |
| } | |
| /* Static simulator drag hint: centered immediately below the overview camera controls. */ | |
| .hf-space-mode .pane-0.has-drag-hint .camera-buttons { | |
| bottom: 48px; | |
| } | |
| .hf-space-mode .pane-0.has-drag-hint .pick-place-web-hint { | |
| left: 50%; | |
| right: auto; | |
| bottom: 13px; | |
| width: min(56%, 520px); | |
| transform: translateX(-50%); | |
| text-align: center; | |
| padding: 6px 10px; | |
| white-space: normal; | |
| } | |
| @media (max-width: 760px) { | |
| .hf-space-mode .pane-0.has-drag-hint .pick-place-web-hint { | |
| width: min(62%, 360px); | |
| font-size: 10px; | |
| } | |
| } | |