:root { --mp-min-readable-text-size: 10px; }
  html, body { margin: 0; height: 100%; background: #0a0b0e; }
  ::-webkit-scrollbar { width: 8px; height: 8px; }
  ::-webkit-scrollbar-thumb { background: #25282f; border-radius: 99px; }
  ::-webkit-scrollbar-track { background: transparent; }
  @keyframes mpPulse { 0%, 100% { opacity: 1; } 50% { opacity: .3; } }
  @keyframes mpFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-7px); } }
  @keyframes mpScan { 0% { transform: translateY(-130%); } 100% { transform: translateY(330%); } }
  @keyframes mpSpin { to { transform: rotate(360deg); } }
  [hidden] { display: none !important; }
  a { color:#5be0ff; text-decoration:none; }
  a:hover { color:#9fe9ff; }
  model-viewer { width: 100%; height: 100%; --poster-color: transparent; background: transparent; }
  button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, [tabindex]:focus-visible {
    outline:2px solid #2ad4ff; outline-offset:2px;
  }
  .mp-scroll { overflow-y:auto; min-height:0; }
  .mp-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(122px, 1fr)); gap:9px; align-content:start; }
  .mp-stage-toolbar { min-width:0; }
  .mp-viewer-area { box-sizing:border-box; }
  /* The inspector is a docked column in the workspace row, not a floating
     overlay — width and layout come from its inline style so the responsive
     rules below only need to narrow it. */
  .mp-asset-panel { overflow:hidden; }
  .mp-asset-panel-body { min-height:0; overflow-y:auto; }
  .mp-inspector-grid { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:12px 20px; align-items:baseline; }
  .mp-inspector-grid dt { margin:0; font-size:12.5px; color:#686f7d; }
  .mp-inspector-grid dd { margin:0; max-width:200px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-family:'IBM Plex Mono', monospace; font-size:11.5px; color:#d5d9e1; text-align:right; }
  .mp-print-check { padding:13px; border:1px solid #242a34; border-radius:11px; background:linear-gradient(145deg,rgba(20,24,31,.96),rgba(13,16,21,.96)); }
  .mp-print-check button:disabled { opacity:.46; cursor:not-allowed; }
  .mp-print-issue { display:flex; align-items:flex-start; gap:8px; padding-top:9px; margin-top:9px; border-top:1px solid #20252e; }
  .mp-print-reason { display:block; margin-top:5px; padding-left:2px; font-size:11px; line-height:1.5; color:#8a94a5; }
  .mp-print-tag { flex:0 0 auto; margin-top:1px; padding:4px 6px; border-radius:5px; font-family:'IBM Plex Mono', monospace; font-size:9px; letter-spacing:.04em; text-transform:uppercase; }
  .mp-actions-rail { overflow:hidden; }
  .mp-action-groups { scrollbar-gutter:stable; }
  .mp-action-group {
    padding:5px 6px; border:1px solid #1f232b; border-radius:9px;
    background:linear-gradient(145deg,rgba(20,22,28,.92),rgba(13,15,19,.92));
  }
  .mp-action-group + .mp-action-group { margin-top:5px; }
  .mp-action-group-title {
    display:block; margin:0; padding:0 2px 4px;
    font-family:'IBM Plex Mono', monospace; font-size:8.5px; font-weight:600;
    letter-spacing:.12em; text-transform:uppercase; color:#68717f;
  }
  .mp-action-group-buttons { display:flex; flex-direction:column; gap:3px; }
  .mp-action-chip {
    position:relative; width:100%; min-height:30px; box-sizing:border-box;
    display:grid; grid-template-columns:22px minmax(0,1fr); align-items:center; gap:6px;
    padding:4px 6px; text-align:left; font-family:'Space Grotesk', sans-serif;
    transition:border-color 120ms ease, background 120ms ease, box-shadow 120ms ease;
  }
  .mp-action-chip:hover:not(:disabled) { border-color:#386258 !important; color:#fff !important; }
  .mp-action-chip:disabled { cursor:not-allowed; }
  .mp-action-chip-icon {
    width:22px; height:22px; display:grid; place-items:center;
    border:1px solid #29313b; border-radius:6px; background:#0d1116;
  }
  .mp-action-chip-copy { min-width:0; display:flex; flex-direction:column; gap:0; }
  .mp-action-chip-label { display:flex; align-items:center; gap:5px; min-width:0; }
  .mp-action-chip-recommended {
    flex:0 0 auto; padding:1px 4px; border:1px solid #2b5770; border-radius:3px;
    background:rgba(42,155,255,.08); font-family:'IBM Plex Mono', monospace;
    font-size:7px; font-weight:600; letter-spacing:.06em; text-transform:uppercase; color:#8fddf4;
  }
  .mp-recommendation-list { display:flex; flex-direction:column; gap:9px; }
  .mp-recommendation-card {
    position:relative; width:100%; box-sizing:border-box; overflow:hidden;
    display:grid; grid-template-columns:24px minmax(0,1fr); gap:10px;
    padding:12px; border-radius:11px; color:inherit; text-align:left;
    font-family:'Space Grotesk', sans-serif;
    transition:border-color 120ms ease, background 120ms ease, transform 120ms ease;
  }
  .mp-recommendation-card:not(:disabled):hover {
    border-color:#3b6671 !important; transform:translateY(-1px);
  }
  .mp-recommendation-card:disabled { cursor:default; }
  .mp-recommendation-index {
    width:22px; height:22px; display:grid; place-items:center;
    border:1px solid currentColor; border-radius:99px;
    font-family:'IBM Plex Mono', monospace; font-size:9px; font-weight:600;
  }
  .mp-recommendation-copy { min-width:0; display:flex; flex-direction:column; }
  .mp-recommendation-kicker {
    font-family:'IBM Plex Mono', monospace; font-size:8px; font-weight:600;
    letter-spacing:.13em; text-transform:uppercase; color:#6f7784;
  }
  .mp-recommendation-title {
    margin-top:4px; font-size:13px; line-height:1.3; font-weight:650; color:#e1e5eb;
  }
  .mp-recommendation-detail {
    margin-top:4px; font-size:11.5px; line-height:1.48; color:#858d9a;
  }
  .mp-recommendation-action {
    display:flex; align-items:center; justify-content:space-between; gap:10px;
    margin-top:10px; padding-top:9px; border-top:1px solid rgba(255,255,255,.07);
  }
  .mp-recommendation-action-label {
    font-family:'IBM Plex Mono', monospace; font-size:8px; font-weight:600;
    letter-spacing:.12em; text-transform:uppercase; color:#68717e;
  }
  .mp-recommendation-action-value {
    display:inline-flex; align-items:center; gap:7px; font-size:11.5px;
    font-weight:650; color:inherit;
  }
  .mp-recommendation-card:not(:disabled):hover .mp-recommendation-action-value { color:#dff9ff; }
  .mp-next-action-card {
    padding:12px; border:1px solid #252d37; border-radius:11px;
    background:linear-gradient(145deg,rgba(42,155,255,.035),rgba(13,17,23,.96));
  }
  .mp-next-action-label {
    font-family:'IBM Plex Mono', monospace; font-size:8.5px; font-weight:650;
    letter-spacing:.14em; text-transform:uppercase; color:#657483;
  }
  .mp-next-action-title {
    display:block; margin-top:4px; font-size:11.5px; line-height:1.35; color:#818b98;
  }
  .mp-next-action-value {
    display:block; margin-top:2px; font-size:16px; line-height:1.3; font-weight:680; color:#dce4ea;
  }
  .mp-next-action-button {
    width:100%; height:34px; margin-top:11px; border:1px solid #315064; border-radius:8px;
    background:rgba(42,155,255,.055); color:#8bd8ea;
    font-family:'Space Grotesk',sans-serif; font-size:12px; font-weight:650;
    cursor:pointer;
  }
  .mp-next-action-button:disabled {
    border:1px solid #29303a; background:#15191f; color:#69717c;
    box-shadow:none; cursor:default;
  }
  .mp-diagnostic-row {
    display:grid; grid-template-columns:18px minmax(0,1fr); gap:9px;
    padding:9px 10px; border:1px solid #1c2129; border-radius:9px; background:#0d1014;
  }
  .mp-goal-sheet { width:min(620px,94vw); max-height:86vh; padding:22px; box-sizing:border-box; overflow-y:auto; border:1px solid #292e39; border-radius:17px; background:#0f1116; box-shadow:0 36px 110px rgba(0,0,0,.66); }
  /* Hollow and split expose enough controls to exceed a short viewport. Keep
     the sheet bounded and let only the editor body consume the scroll. */
  .mp-goal-sheet.mp-goal-sheet--editor { height:min(86vh,860px); max-height:none; min-height:0; display:flex; flex-direction:column; overflow:hidden; }
  .mp-goal-sheet--editor .mp-goal-sheet-editor { flex:1 1 auto; min-height:0; overflow-y:auto; padding-right:4px; scrollbar-gutter:stable; }
  /* Hollow and split are two-column workspaces: the spatial reference and the
     controls that move it on the left, the settings form on the right. Both
     columns fit the sheet without scrolling in the default state, so the
     editor body itself never becomes the scrollport. */
  .mp-goal-sheet.mp-goal-sheet--hollow, .mp-goal-sheet.mp-goal-sheet--split { width:min(1180px,96vw); }
  .mp-goal-sheet-editor.mp-editor-2col { overflow:hidden; display:flex; flex-direction:column; gap:0; padding-right:0; }
  .mp-editor-2col { margin-top:16px; }
  .mp-editor-layout { flex:1 1 auto; min-height:0; display:grid; grid-template-columns:minmax(0,1.04fr) minmax(0,.96fr); gap:20px; }
  .mp-editor-stage { min-width:0; min-height:0; display:flex; flex-direction:column; gap:12px; }
  .mp-editor-form { min-width:0; min-height:0; display:flex; flex-direction:column; gap:16px; overflow-y:auto; overscroll-behavior:contain; scrollbar-gutter:stable; padding-right:2px; }
  .mp-hollow-drain-viewer { position:relative; flex:1 1 auto; min-height:260px; overflow:hidden; border:1px solid #26343e; border-radius:12px; background:radial-gradient(circle at 50% 42%,rgba(42,212,255,.09),transparent 58%),#090c10; }
  .mp-hollow-drain-viewer__label { position:absolute; left:11px; top:11px; z-index:3; padding:5px 8px; border:1px solid #30443e; border-radius:7px; background:rgba(8,12,14,.86); font-family:'IBM Plex Mono',monospace; font-size:9px; letter-spacing:.02em; color:#a7dcca; pointer-events:none; }
  .mp-hollow-drain-viewer__actions { position:absolute; right:11px; top:11px; z-index:3; display:flex; gap:5px; padding:4px; border:1px solid #2c3940; border-radius:10px; background:rgba(8,12,14,.9); }
  .mp-hollow-drain-viewer__instruction { position:absolute; left:11px; right:11px; bottom:11px; z-index:3; padding:8px 10px; border:1px solid #313943; border-radius:8px; background:rgba(8,11,15,.92); line-height:1.45; color:#aab5bf; pointer-events:none; }
  /* The picker matches the on-model marker colors: drain 1 amber, drain 2 cyan. */
  .mp-hollow-drain-pick { height:28px; padding:0 11px; border:1px solid #31423d; border-radius:8px; background:#101713; font-family:'IBM Plex Mono',monospace; font-size:10px; font-weight:600; letter-spacing:.06em; cursor:pointer; }
  .mp-hollow-drain-pick--first { color:#ffdc9f; }
  .mp-hollow-drain-pick--second { color:#b8f1ff; }
  .mp-editor-panel { flex:0 0 auto; display:flex; flex-direction:column; gap:8px; padding:11px 12px; border:1px solid #26332f; border-radius:11px; background:linear-gradient(145deg,rgba(52,224,161,.05),rgba(42,212,255,.02)); }
  .mp-editor-panel-head { display:flex; align-items:center; justify-content:space-between; gap:10px; }
  .mp-hollow-suggestions { display:flex; flex-wrap:wrap; align-items:center; gap:6px; }
  .mp-hollow-suggestions-label { font-family:'IBM Plex Mono',monospace; font-size:9px; letter-spacing:.12em; text-transform:uppercase; color:#5f7469; }
  .mp-editor-sliders { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px 16px; }
  .mp-editor-sliders--second { padding-top:7px; border-top:1px solid #253b34; }
  .mp-editor-slider { display:flex; flex-direction:column; gap:3px; min-width:0; }
  .mp-editor-slider-head { display:flex; align-items:baseline; justify-content:space-between; gap:8px; font-size:10px; color:#77857f; }
  .mp-editor-slider-head b { flex:0 0 auto; font-family:'IBM Plex Mono',monospace; font-size:11px; font-weight:600; color:#cfdad3; }
  .mp-editor-slider input[type=range] { width:100%; height:15px; margin:0; accent-color:#50dfbd; }
  .mp-editor-slider input[type=range]:disabled { accent-color:#46525c; cursor:not-allowed; }
  .mp-editor-slider--first input[type=range] { accent-color:#ffbd69; }
  .mp-editor-slider--second input[type=range] { accent-color:#5be0ff; }
  /* Section rules carry the hierarchy so the form needs no nested boxes. */
  .mp-editor-section { display:flex; flex-direction:column; gap:10px; }
  .mp-editor-section-title { display:flex; align-items:center; gap:10px; font-family:'IBM Plex Mono',monospace; font-size:9px; font-weight:600; letter-spacing:.16em; text-transform:uppercase; color:#6a7480; }
  .mp-editor-section-title::after { content:''; flex:1 1 auto; height:1px; background:linear-gradient(90deg,#252c37,rgba(37,44,55,0)); }
  .mp-editor-panel-head .mp-editor-section-title { color:#9ec3b4; }
  .mp-editor-panel-head .mp-editor-section-title::after { background:linear-gradient(90deg,#2a4239,rgba(42,66,57,0)); }
  .mp-editor-row { display:grid; gap:9px; align-items:end; }
  .mp-editor-row--2 { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .mp-editor-row--3 { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .mp-editor-row--4 { grid-template-columns:repeat(4,minmax(0,1fr)); }
  .mp-editor-field { display:flex; flex-direction:column; gap:6px; min-width:0; }
  .mp-editor-field-label { font-size:11px; font-weight:500; color:#828b99; }
  .mp-editor-field select, .mp-editor-field input { width:100%; min-width:0; height:38px; box-sizing:border-box; padding:0 10px; border:1px solid #2a303b; border-radius:9px; background:#12151b; color:#e4e8ed; font-family:'Space Grotesk',sans-serif; font-size:12.5px; }
  .mp-editor-field input { font-family:'IBM Plex Mono',monospace; font-size:13.5px; }
  .mp-editor-field select:disabled { color:#79818d; background:#101318; cursor:not-allowed; }
  .mp-editor-field--hero input { height:46px; font-size:19px; font-weight:500; letter-spacing:.01em; color:#f0f4f8; }
  .mp-editor-field--hero .mp-editor-unit { font-size:11px; }
  .mp-editor-field--sm select, .mp-editor-field--sm input { height:34px; font-size:11.5px; }
  .mp-editor-field--sm input { font-size:12.5px; }
  .mp-editor-input { position:relative; display:block; min-width:0; }
  .mp-editor-input input { padding-right:42px; }
  .mp-editor-unit { position:absolute; right:11px; top:50%; transform:translateY(-50%); font-family:'IBM Plex Mono',monospace; font-size:10px; letter-spacing:.04em; color:#6d7684; pointer-events:none; }
  .mp-editor-hint { font-size:10.5px; line-height:1.5; color:#6e7787; }
  .mp-editor-note { display:block; padding:9px 11px; border-radius:9px; line-height:1.45; }
  .mp-editor-note--warn { border:1px solid #3a3428; background:rgba(255,189,105,.06); color:#d7c39a; }
  .mp-editor-note--info { border:1px solid #26332f; background:rgba(52,224,161,.04); color:#8eb8a8; }
  .mp-editor-note--error { border:1px solid #6a3f48; background:rgba(231,139,152,.08); color:#f0aab5; }
  .mp-editor-ack { display:flex; align-items:flex-start; gap:9px; }
  .mp-editor-ack input { margin:2px 0 0; }
  .mp-editor-chip { height:26px; padding:0 9px; border:1px solid #305047; border-radius:7px; background:#101a17; color:#8ee3c3; font-family:'IBM Plex Mono',monospace; font-size:10px; cursor:pointer; }
  .mp-editor-chip--warn { align-self:flex-start; margin-top:7px; border-color:#5a4a30; background:#1a1610; color:#ffbd69; }
  .mp-editor-ghost { height:26px; padding:0 9px; border:1px solid #305047; border-radius:7px; background:#101a17; color:#72dcb7; font-size:10px; cursor:pointer; }
  .mp-editor-ghost:disabled { border-color:#28322e; color:#5c6b66; cursor:default; }
  /* Advanced settings stay collapsed so the default form fits without scrolling. */
  .mp-editor-advanced { border:1px solid #242b35; border-radius:11px; background:#0d1014; }
  .mp-editor-advanced > summary { display:flex; align-items:center; gap:10px; min-height:40px; padding:0 12px; box-sizing:border-box; list-style:none; cursor:pointer; font-size:11.5px; font-weight:600; color:#98a3b1; }
  .mp-editor-advanced > summary::-webkit-details-marker { display:none; }
  .mp-editor-advanced > summary::after { content:''; flex:0 0 auto; margin-left:auto; width:6px; height:6px; border-right:1.5px solid #67717f; border-bottom:1.5px solid #67717f; transform:rotate(45deg) translateY(-2px); transition:transform 140ms ease; }
  .mp-editor-advanced[open] > summary::after { transform:rotate(-135deg) translateY(-2px); }
  .mp-editor-advanced-meta { font-family:'IBM Plex Mono',monospace; font-size:9px; font-weight:400; letter-spacing:.05em; color:#6b7684; }
  .mp-editor-advanced[open] > summary { border-bottom:1px solid #1e242c; }
  .mp-editor-advanced-body { display:flex; flex-direction:column; gap:15px; padding:13px 12px; }
  .mp-editor-group { display:flex; flex-direction:column; gap:8px; }
  .mp-editor-group-title { font-size:10.5px; font-weight:600; letter-spacing:.02em; color:#8fa198; }
  .mp-editor-footnote { margin:auto 0 0; padding-top:4px; font-size:10px; line-height:1.5; color:#5f6874; }
  .mp-editor-footer { flex:0 0 auto; display:flex; align-items:center; justify-content:space-between; gap:16px; margin-top:16px; padding-top:13px; border-top:1px solid #222630; }
  .mp-editor-status { min-width:0; font-family:'IBM Plex Mono',monospace; font-size:10px; line-height:1.4; }
  .mp-editor-footer-actions { flex:0 0 auto; display:flex; gap:9px; }
  /* Split: the schematic scales with its column instead of sitting in a strip.
     Everything inside the figure is positioned in percentages, so the figure
     and its plate line are the only sizes that need to stay in proportion. */
  .mp-split-preview { position:relative; flex:1 1 auto; min-height:210px; overflow:hidden; border:1px solid #252b35; border-radius:12px; background:radial-gradient(circle at 50% 34%,rgba(68,86,99,.24),transparent 60%),#0d1015; }
  .mp-split-preview__label { position:absolute; left:13px; top:12px; z-index:2; font-family:'IBM Plex Mono',monospace; font-size:9px; letter-spacing:.12em; text-transform:uppercase; color:#69737f; }
  .mp-split-preview__readout { position:absolute; right:12px; bottom:11px; z-index:2; padding:5px 8px; border:1px solid #2b3a35; border-radius:7px; background:rgba(8,12,14,.82); font-family:'IBM Plex Mono',monospace; font-size:9.5px; color:#7fc0aa; }
  .mp-split-scene { position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px; }
  .mp-split-figure { position:relative; flex:0 0 auto; width:min(300px,82%); aspect-ratio:300 / 137; height:auto; overflow:hidden; border-radius:46% 46% 18% 18% / 38% 38% 14% 14%; background:linear-gradient(140deg,#495864,#1c2930); box-shadow:0 18px 34px rgba(0,0,0,.42); }
  .mp-split-plate { flex:0 0 auto; width:min(354px,97%); height:2px; background:linear-gradient(90deg,transparent,#5f6d78 12% 88%,transparent); box-shadow:0 1px 0 rgba(91,224,255,.12); }
  .mp-split-plane-chips { display:flex; align-items:center; flex-wrap:wrap; gap:6px; }
  .mp-split-plane-chip { height:30px; display:inline-flex; align-items:center; gap:7px; padding:0 10px; border:1px solid #305047; border-radius:8px; font-family:'IBM Plex Mono',monospace; font-size:10px; cursor:pointer; }
  .mp-split-plane-remove { height:30px; padding:0 9px; border:1px solid #382d33; border-radius:8px; background:#171215; color:#a9828e; font-size:10px; cursor:pointer; }
  /* Measuring is a checking step, not a commit step: it sits with its own
     result instead of competing with Create in the footer. */
  .mp-split-check { display:flex; flex-direction:column; gap:9px; padding:11px 12px; border:1px solid #242b35; border-radius:11px; background:#0d1014; }
  .mp-split-preflight { display:flex; flex-direction:column; gap:4px; padding:9px 11px; border:1px solid #285044; border-radius:9px; }
  .mp-split-preflight strong { font-size:11px; font-weight:650; }
  .mp-split-volume { font-family:'IBM Plex Mono',monospace; font-size:10px; letter-spacing:.02em; color:#6e7787; }
  /* Two columns need real width. Below that the stage returns above the form
     and the editor body becomes the scrollport again, so the viewer takes a
     fixed share of it instead of flexing to nothing. */
  @media (max-width:900px) {
    /* Stacked, the columns size to their content and the editor body takes the
       scroll back; a grid here would split the bounded height between the two
       rows and spill both. */
    .mp-editor-layout { display:flex; flex-direction:column; gap:16px; flex:0 0 auto; }
    .mp-editor-stage, .mp-editor-form { flex:0 0 auto; overflow:visible; }
    /* Keep the commit action reachable while the stacked editor scrolls. */
    .mp-editor-footer { position:sticky; bottom:0; flex-wrap:wrap; gap:10px; margin-top:12px; padding-bottom:4px; background:#0f1116; }
    .mp-editor-status { flex:1 1 100%; }
    .mp-editor-footer-actions { flex:1 1 100%; }
    .mp-editor-footer-actions .mp-print-primary { flex:1 1 auto; }
    .mp-editor-advanced-meta { display:none; }
    .mp-goal-sheet--hollow .mp-goal-sheet-editor.mp-editor-2col { overflow-y:auto; padding-right:4px; }
    .mp-hollow-drain-viewer { flex:0 0 auto; height:min(42vh,330px); min-height:260px; }
    .mp-split-preview { flex:0 0 auto; height:min(34vh,260px); min-height:210px; }
    .mp-editor-footnote { margin-top:0; }
  }
  /* Keep the motion picker action in view while its longer clip library scrolls. */
  .mp-goal-sheet.mp-animation-motion-sheet { height:min(86vh,760px); max-height:none; display:flex; flex-direction:column; overflow:hidden; }
  /* Print preparation is a focused, multi-step task. Keep its header stable
     while the current step scrolls rather than turning the entire sheet into
     a moving target. */
  .mp-goal-sheet.mp-goal-sheet--print { width:min(1180px,96vw); height:min(90vh,900px); max-height:none; min-height:0; display:flex; flex-direction:column; overflow:hidden; }
  .mp-goal-sheet.mp-goal-sheet--print-v2 { width:min(1180px,96vw); }
  .mp-goal-sheet--print .mp-print-workflow { flex:1 1 auto; min-height:0; overflow-y:auto; padding:2px 3px 2px 0; }
  .mp-goal-sheet--print-v2 .mp-print-workflow { overflow:hidden; display:flex; flex-direction:column; }
  .mp-print-workspace-body { display:grid; grid-template-columns:minmax(400px,1.1fr) minmax(380px,.9fr); min-height:0; flex:1 1 auto; border:1px solid #232b34; border-radius:12px; overflow:hidden; background:#0c1015; }
  .mp-print-preview { position:relative; min-height:420px; padding:16px; box-sizing:border-box; overflow:hidden; border-right:1px solid #232b34; background:radial-gradient(ellipse at 50% 38%,rgba(42,212,255,.11),transparent 57%),linear-gradient(145deg,#101822,#0b0e13); }
  .mp-print-preview svg { width:100%; height:100%; min-height:385px; }
  .mp-print-drain-viewer { position:absolute; inset:72px 12px 34px; border:1px solid #26343e; border-radius:12px; overflow:hidden; background:radial-gradient(circle at 50% 42%,rgba(42,212,255,.09),transparent 58%),#090c10; }
  .mp-print-drain-hotspot { min-width:30px; height:30px; padding:0 7px; border:2px solid #ffcf83; border-radius:999px; background:rgba(22,16,8,.88); color:#ffdc9f; font-family:'IBM Plex Mono',monospace; font-size:8px; font-weight:700; box-shadow:0 0 0 5px rgba(255,189,105,.15),0 0 20px rgba(255,189,105,.65); pointer-events:none; }
  .mp-print-drain-hotspot--second { border-color:#72e5ff; color:#adf2ff; box-shadow:0 0 0 5px rgba(91,224,255,.14),0 0 20px rgba(91,224,255,.6); }
  .mp-result-drain-hotspot { min-width:24px; height:24px; padding:0 5px; border:1px solid #ffcf83; border-radius:999px; background:rgba(20,14,7,.9); color:#ffe0a7; font-family:'IBM Plex Mono',monospace; font-size:7px; font-weight:700; box-shadow:0 0 0 3px rgba(255,189,105,.13),0 0 13px rgba(255,189,105,.5); pointer-events:none; white-space:nowrap; }
  /* No bottom padding: sticky offsets resolve inside the scrollport's padding,
     so any bottom padding here becomes a strip where scrolling content shows
     under the sticky footer. The footer owns the bottom spacing instead. */
  .mp-print-controls { min-height:0; overflow-y:auto; overscroll-behavior:contain; scrollbar-gutter:stable; padding:16px 16px 0; box-sizing:border-box; }
  .mp-print-change-card { width:100%; display:flex; flex-direction:column; gap:6px; padding:12px; border:1px solid #28333d; border-radius:10px; background:#11161c; color:#d9e0e7; text-align:left; cursor:pointer; }
  .mp-print-change-card[disabled] { opacity:.62; cursor:default; }
  .mp-print-change-card + .mp-print-change-card { margin-top:8px; }
  .mp-print-workflow-footer { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-top:4px; position:sticky; bottom:0; padding:14px 0 20px; background:#0c1015; }
  .mp-print-secondary, .mp-print-primary, .mp-print-download, .mp-print-send { min-height:40px; padding:0 13px; border-radius:9px; font-family:'Space Grotesk',sans-serif; font-size:12px; font-weight:650; cursor:pointer; }
  .mp-print-secondary { border:1px solid #303845; background:#14181f; color:#aeb7c2; }
  .mp-print-primary { border:0; background:linear-gradient(135deg,#5be0ff,#34e0a1); color:#06140f; }
  .mp-print-primary:disabled { background:#1b2228; color:#6c7680; cursor:default; }
  .mp-print-send {
    border:0;
    background:linear-gradient(135deg,#5be0ff,#34e0a1);
    color:#06140f;
    box-shadow:0 0 0 1px rgba(52,224,161,.35), 0 6px 16px rgba(52,224,161,.18);
  }
  .mp-print-send:disabled {
    background:#1b2228;
    color:#6c7680;
    box-shadow:none;
    cursor:default;
  }
  .mp-print-send.mp-print-send--compact { min-height:30px; height:30px; padding:0 11px; font-size:11px; font-weight:700; }
  .mp-print-review-row { display:flex; align-items:baseline; justify-content:space-between; gap:16px; padding:10px 11px; border:1px solid #252d36; border-radius:9px; background:#0e1218; font-size:12px; color:#8d98a4; }
  .mp-print-review-row strong { max-width:62%; text-align:right; color:#e0e6eb; font-weight:620; }
  .mp-print-download { box-sizing:border-box; display:flex; align-items:center; justify-content:center; border:1px solid #2f5b4d; background:rgba(52,224,161,.08); color:#98e4c7; text-decoration:none; }
  .mp-print-download--secondary { border-color:#314254; background:rgba(42,155,255,.06); color:#9dcef4; }
  .mp-animation-editor.mp-animation-motion-editor { flex:1; min-height:0; }
  .mp-animation-motion-list { flex:1; min-height:0; overflow-y:auto; padding-right:4px; }
  .mp-animation-footer { flex:0 0 auto; }
  .mp-goal-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; margin-top:18px; }
  .mp-goal { min-height:62px; display:flex; align-items:center; gap:11px; padding:9px 12px; border:1px solid #242934; border-radius:11px; background:#12141a; color:#dce0e7; cursor:pointer; text-align:left; }
  .mp-goal[disabled] { opacity:.46; cursor:default; }
  .mp-goal-icon { flex:0 0 34px; width:34px; height:34px; display:grid; place-items:center; border:1px solid #29313b; border-radius:9px; background:#0d1116; color:#5be0ff; }
  /* User-facing explanatory copy must never render below 10px. */
  .mp-readable-copy { font-size:max(10px, var(--mp-min-readable-text-size)); line-height:1.45; }
  @media (max-width:1400px) {
    .mp-inspector { width:380px !important; }
    .mp-sidebar { width:236px !important; }
  }
  @media (max-width:1240px) {
    /* the same five tools stay available in the floating viewport toolbar */
    .mp-inline-tools { display:none !important; }
  }
  @media (max-width:1180px) {
    .mp-sidebar { width:208px !important; }
    .mp-inspector { width:352px !important; }
    .mp-actions-rail { width:164px !important; }
    .mp-grid { grid-template-columns:repeat(auto-fill, minmax(148px, 1fr)); }
  }
  @media (max-width:1080px) {
    .mp-download-label { display:none !important; }
  }
  @media (max-width:980px) {
    .mp-sidebar { display:none !important; }
  }
  @media (max-width:860px) {
    .mp-actions-rail { width:152px !important; }
    .mp-inspector { width:320px !important; }
  }
  @media (max-width:640px) {
    .mp-goal-sheet { width:100%; padding:16px; }
    .mp-goal-sheet.mp-goal-sheet--hollow { width:100%; }
    .mp-goal-sheet.mp-goal-sheet--split { width:100%; }
    .mp-hollow-drain-viewer__label { right:10px; max-width:calc(100% - 20px); box-sizing:border-box; }
    .mp-hollow-drain-viewer__actions { top:42px; }
    .mp-editor-row--3, .mp-editor-row--4 { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .mp-goal-sheet.mp-animation-motion-sheet { height:86vh; }
    .mp-goal-sheet.mp-goal-sheet--print { width:100%; height:100%; max-height:none; border-radius:0; border:0; padding:max(16px, env(safe-area-inset-top)) 16px max(16px, env(safe-area-inset-bottom)); }
    .mp-goal-sheet--print-v2 .mp-print-workflow { overflow-y:auto; }
    .mp-print-workspace-body { display:flex; flex-direction:column; overflow:visible; }
    .mp-print-preview { min-height:96px; height:min(38vh,300px); border-right:0; border-bottom:1px solid #232b34; }
    .mp-print-preview svg { min-height:0; }
    .mp-print-controls { overflow:visible; padding:14px; }
    .mp-print-workflow-footer { background:#0f1116; }
    .mp-print-secondary, .mp-print-primary { min-height:44px; }
    .mp-goal-grid { grid-template-columns:1fr; }
    .mp-animation-layout { grid-template-columns:1fr !important; }
    .mp-inspector { display:none !important; }
  }
  @media (min-width:641px) and (max-width:899px) {
    .mp-print-workspace-body { display:flex; flex-direction:column; overflow-y:auto; }
    .mp-print-preview { height:330px; min-height:300px; border-right:0; border-bottom:1px solid #232b34; }
    .mp-print-controls { overflow:visible; }
  }