/*
 * MineGrid Studio v79 - complete desktop workspace
 *
 * v76 keeps the editorial canvas language, but hides the engineering
 * inspector at every width. v79 restores the complete desktop workflow:
 * result sheet + persistent inspector at >=1280px, drawer below that.
 * Calculation and API contracts are unchanged.
 */

.cw.mg63.cv75.cd76.cd77.cd79.studio {
  --cv-inspector: clamp(280px, 19.5vw, 320px);
}

/* Small and medium screens keep the decision summary above the fold. */
@media (max-width: 1279px) {
  .cw.mg63.cv75.cd76.cd77.cd79.studio #view-overview .overview-hero {
    grid-template-areas:
      "copy score"
      "mix mix"
      "signal signal";
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .hero-copy {
    padding: clamp(22px, 3.4vw, 32px) clamp(20px, 3.8vw, 34px)
      clamp(18px, 2.6vw, 24px);
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .hero-copy h1 {
    margin: clamp(13px, 2.2vw, 22px) 0 10px;
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .hero-lede {
    max-width: 72ch;
    font-size: clamp(12px, 1.55vw, 14px);
    line-height: 1.62;
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .hero-tags {
    margin-top: clamp(12px, 2vw, 18px);
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .hero-mix {
    grid-template-columns: minmax(130px, 0.32fr) minmax(0, 1fr);
    column-gap: clamp(14px, 2.6vw, 22px);
    padding: 14px clamp(20px, 3.8vw, 34px) 16px;
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .mix-bar {
    grid-column: 2;
    grid-row: 1;
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .mix-legend {
    grid-column: 1 / -1;
    margin-top: 9px;
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .hero-score {
    min-height: 0;
    align-self: stretch;
    margin: clamp(12px, 2.4vw, 18px) clamp(20px, 3.8vw, 34px);
    padding: clamp(18px, 3vw, 26px) clamp(20px, 3.8vw, 34px);
    border: 1px solid rgba(160, 92, 66, 0.14);
    border-radius: 13px;
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .brief-score {
    min-height: 0;
    margin: 14px 0 12px;
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .score-value {
    font-size: clamp(58px, 10vw, 82px);
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .hero-signal {
    grid-template-columns: minmax(160px, 0.34fr) minmax(0, 1fr);
    gap: clamp(14px, 2.2vw, 22px);
    padding: 18px clamp(20px, 3.8vw, 34px) 16px;
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .hero-energy-map {
    height: clamp(145px, 20vw, 210px);
  }
}

@media (max-width: 900px) {
  .cw.mg63.cv75.cd76.cd77.cd79.studio #view-overview .overview-hero {
    grid-template-areas:
      "copy"
      "mix"
      "score"
      "signal";
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .hero-copy {
    padding: 20px 20px 18px;
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .hero-copy h1 {
    margin-top: 11px;
    font-size: clamp(38px, 11vw, 54px);
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .hero-score {
    margin-top: 8px;
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .brief-score {
    min-height: 78px;
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .score-value {
    font-size: clamp(52px, 14vw, 70px);
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .score-delta {
    margin-top: 8px;
    padding-top: 9px;
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .hero-tags {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 5px;
    margin-top: 12px;
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .hero-tags > * {
    min-width: 0;
    padding-inline: 7px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .hero-mix {
    grid-template-columns: 1fr;
    padding: 13px 20px 15px;
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .mix-bar {
    grid-column: 1;
    grid-row: auto;
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .mix-legend {
    margin-top: 0;
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .hero-score {
    margin: 12px 14px 14px;
    padding: 17px 18px 18px;
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .hero-score-head {
    margin-bottom: 2px;
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .brief-score {
    min-height: 92px;
    margin: 8px 0 6px;
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .score-value {
    font-size: clamp(56px, 16vw, 78px);
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .hero-score > p,
  .cw.mg63.cv75.cd76.cd77.cd79.studio .score-delta {
    font-size: 9.5px;
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .score-delta {
    margin-top: 7px;
    padding-top: 9px;
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .hero-signal {
    grid-template-columns: 1fr;
    gap: 7px;
    padding: 18px 20px 15px;
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .hero-signal-note {
    max-width: 52ch;
    margin-top: 6px;
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .hero-signal-legend {
    margin-top: 5px;
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .hero-energy-map {
    height: clamp(130px, 45vw, 178px);
  }

  /* Legacy workbench layers hide the indicator below 900px. v79 owns the
     current mobile dock, so restore the same visual selection used on desktop. */
  .cw.mg63.cv75.cd76.cd77.cd79.studio
    .canvas-nav-row
    .view-tab-indicator {
    display: block;
    opacity: 1;
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio
    .canvas-nav-row
    .view-tab.is-active {
    color: var(--cv-surface);
  }

}

.cw.mg63.cv75.cd76.cd77.cd79.studio
  .startup-console.startup-console.is-leaving {
  pointer-events: none;
  animation: cv79-startup-out 260ms cubic-bezier(0.22, 1, 0.36, 1) both;
}

@keyframes cv79-startup-out {
  to {
    visibility: hidden;
    opacity: 0;
    transform: translateY(-5px);
  }
}

@media (min-width: 901px) and (max-width: 1279px) {
  .cw.mg63.cv75.cd76.cd77.cd79.studio #view-overview .overview-hero {
    grid-template-columns: minmax(0, 1fr) minmax(280px, 0.55fr);
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .hero-copy {
    padding: 22px 24px 20px;
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .hero-copy h1 {
    margin: 12px 0 9px;
    font-size: clamp(40px, 5.1vw, 58px);
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .hero-lede {
    font-size: 12px;
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .hero-score {
    align-self: start;
    margin: 20px 18px 16px;
    padding: 18px;
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .brief-score {
    min-height: 78px;
    margin: 10px 0 8px;
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .score-value {
    font-size: clamp(52px, 6vw, 72px);
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .score-delta {
    margin-top: 8px;
    padding-top: 8px;
    font-size: 9px;
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .hero-score > p {
    margin-top: 5px;
    font-size: 8px;
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .hero-mix {
    grid-template-columns: minmax(150px, 0.28fr) minmax(0, 1fr);
    padding: 11px 24px 13px;
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .hero-signal {
    grid-template-columns: minmax(160px, 0.30fr) minmax(0, 1fr);
    gap: 18px;
    padding: 16px 24px 13px;
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .hero-energy-map {
    height: clamp(142px, 17vw, 190px);
  }
}

@media (max-width: 380px) {
  .cw.mg63.cv75.cd76.cd77.cd79.studio .hero-copy {
    padding-inline: 17px;
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .hero-copy h1 {
    font-size: clamp(34px, 10.8vw, 42px);
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .hero-mix,
  .cw.mg63.cv75.cd76.cd77.cd79.studio .hero-signal {
    padding-inline: 17px;
  }
}

@media (min-width: 1280px) {
  .cw.mg63.cv75.cd76.cd77.cd79.studio .workspace {
    display: grid;
    grid-template-columns: minmax(0, 1fr) var(--cv-inspector);
    gap: 16px;
    align-items: start;
    padding: 10px 24px 34px;
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .main-stage {
    order: 1;
    max-width: none;
    margin: 0;
    padding: 0 0 calc(60px + var(--calculation-dock-offset, 0px));
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .control-rail {
    --cv-paper: #f5f2eb;
    --cv-paper-deep: #e9e5dc;
    --cv-surface: #fcfbf7;
    --cv-surface-soft: #f1eee7;
    --cv-surface-raised: #e6e2d9;
    --cv-ink: #1f1e1b;
    --cv-ink-soft: #45423b;
    --cv-muted: #625e56;
    --cv-faint: #706c63;
    --cv-line: #d8d3c8;
    --cv-line-strong: #bdb7aa;
    --cv-accent: #d66f4f;
    --cv-accent-deep: #a6432a;
    --cv-accent-soft: #f2ddd3;
    --cv-blue: #5f8fb7;
    --cv-green: #596c44;
    --cv-amber: #95652f;
    --cv-red: #9c433d;
    position: sticky;
    top: calc(var(--cv-topbar) + 72px);
    right: auto;
    bottom: auto;
    z-index: 3;
    order: 2;
    display: flex;
    width: var(--cv-inspector);
    height: calc(100dvh - var(--cv-topbar) - 86px);
    max-height: calc(100dvh - var(--cv-topbar) - 86px);
    margin: 0;
    padding: 19px 17px 26px;
    overflow-x: hidden;
    overflow-y: auto;
    color: var(--cv-ink);
    background:
      linear-gradient(180deg, rgba(255, 255, 255, 0.5), transparent 170px),
      var(--cv-paper);
    border: 1px solid rgba(95, 88, 76, 0.2);
    border-radius: 16px;
    box-shadow:
      0 1px 0 rgba(255, 255, 255, 0.84) inset,
      0 18px 54px rgba(46, 40, 31, 0.1);
    visibility: visible;
    opacity: 1;
    transform: none;
    transition: none;
    overscroll-behavior: contain;
    scrollbar-color: var(--cv-line-strong) transparent;
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .control-rail > * {
    flex: 0 0 auto;
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .control-trigger,
  .cw.mg63.cv75.cd76.cd77.cd79.studio .rail-close,
  .cw.mg63.cv75.cd76.cd77.cd79.studio .panel-backdrop,
  .cw.mg63.cv75.cd76.cd77.cd79.studio .mode-mobile {
    display: none !important;
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio.controls-open {
    overflow: visible;
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .control-rail .rail-head {
    position: static;
    margin: 0 0 9px;
    padding: 0 1px 14px;
    background: transparent;
    border-bottom: 1px solid var(--cv-line-strong);
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .control-rail .rail-head .eyebrow {
    color: var(--cv-accent-deep);
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .control-rail .rail-head h2 {
    margin-top: 5px;
    color: var(--cv-ink);
    font-size: clamp(23px, 1.8vw, 28px);
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .control-rail .inspector-intro {
    padding: 2px 1px 12px;
    border-bottom: 1px solid var(--cv-line);
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .control-rail .inspector-intro > span,
  .cw.mg63.cv75.cd76.cd77.cd79.studio .control-rail .section-count,
  .cw.mg63.cv75.cd76.cd77.cd79.studio .control-rail .scenario-editor-label small,
  .cw.mg63.cv75.cd76.cd77.cd79.studio .control-rail .field > span,
  .cw.mg63.cv75.cd76.cd77.cd79.studio .control-rail .control-copy small {
    color: var(--cv-faint);
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .control-rail details,
  .cw.mg63.cv75.cd76.cd77.cd79.studio .control-rail .control-group {
    margin-top: 0;
    overflow: hidden;
    background: transparent;
    border: 0;
    border-bottom: 1px solid var(--cv-line);
    border-radius: 0;
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .control-rail summary {
    color: var(--cv-ink-soft);
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .control-rail summary:hover {
    background: rgba(31, 30, 27, 0.035);
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .control-rail .scenario-editor-body,
  .cw.mg63.cv75.cd76.cd77.cd79.studio .control-rail .control-body {
    padding-bottom: 14px;
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .control-rail .field input,
  .cw.mg63.cv75.cd76.cd77.cd79.studio .control-rail select,
  .cw.mg63.cv75.cd76.cd77.cd79.studio .control-rail .number-field input,
  .cw.mg63.cv75.cd76.cd77.cd79.studio .control-rail .text-field input,
  .cw.mg63.cv75.cd76.cd77.cd79.studio .control-rail .control-value input {
    color: var(--cv-ink);
    background: var(--cv-surface);
    border-color: var(--cv-line);
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .control-rail .field input:hover,
  .cw.mg63.cv75.cd76.cd77.cd79.studio .control-rail .control-value input:hover {
    background: #fff;
    border-color: var(--cv-line-strong);
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .control-rail .field input:focus,
  .cw.mg63.cv75.cd76.cd77.cd79.studio .control-rail select:focus,
  .cw.mg63.cv75.cd76.cd77.cd79.studio .control-rail .control-value input:focus {
    border-color: var(--cv-accent);
    box-shadow: 0 0 0 3px rgba(214, 111, 79, 0.13);
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .control-rail .mode-rail-note {
    color: var(--cv-muted);
    background: rgba(31, 30, 27, 0.035);
    border-color: var(--cv-line);
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .control-rail .mode-rail-note.is-warning {
    color: #714d24;
    background: var(--cv-amber-soft);
    border-color: rgba(155, 106, 50, 0.16);
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .control-rail .preset-section {
    margin-top: 0;
    padding: 15px 1px 17px;
    background: transparent;
    border: 0;
    border-bottom: 1px solid var(--cv-line);
    border-radius: 0;
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .control-rail .preset-button {
    color: var(--cv-ink-soft);
    background: var(--cv-surface);
    border-color: var(--cv-line);
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .control-rail .preset-button:hover,
  .cw.mg63.cv75.cd76.cd77.cd79.studio .control-rail .preset-button.is-active {
    color: var(--cv-accent-deep);
    background: var(--cv-accent-soft);
    border-color: rgba(214, 111, 79, 0.4);
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .control-rail .simple-mode-guide {
    margin-top: 14px;
    padding: 15px;
    background:
      radial-gradient(circle at 100% 0, rgba(214, 111, 79, 0.1), transparent 52%),
      var(--cv-surface);
    border: 1px solid var(--cv-line);
    border-radius: 11px;
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .control-rail .simple-mode-guide-button {
    color: var(--cv-surface);
    background: var(--cv-ink);
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .control-rail .rail-footer {
    margin-top: 15px;
    padding-top: 14px;
    border-top: 1px solid var(--cv-line);
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .view {
    padding: 18px 24px 28px;
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .view-intro {
    margin-bottom: 20px;
    padding-bottom: 20px;
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio #view-overview .overview-hero {
    grid-template-areas:
      "copy score"
      "mix mix"
      "signal signal";
    grid-template-columns: minmax(0, 1fr) minmax(272px, 0.5fr);
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .hero-copy {
    min-height: 190px;
    padding: 18px 24px 16px;
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .hero-copy h1 {
    margin: 10px 0 8px;
    font-size: clamp(40px, 3.8vw, 58px);
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .hero-lede {
    font-size: clamp(12px, 1vw, 14px);
    line-height: 1.62;
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .hero-tags {
    margin-top: 10px;
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .hero-score {
    min-height: 0;
    margin: 9px;
    padding: 15px 17px;
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .brief-score {
    min-height: 82px;
    margin: 8px 0 5px;
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .score-value {
    font-size: clamp(52px, 4.5vw, 72px);
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .score-delta {
    margin-top: 11px;
    padding-top: 10px;
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .hero-mix {
    grid-template-columns: minmax(190px, 0.34fr) minmax(0, 1fr);
    column-gap: 24px;
    padding: 10px 24px 12px;
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .mix-bar {
    grid-column: 2;
    grid-row: 1;
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .mix-legend {
    grid-column: 1 / -1;
    gap: 6px 14px;
    margin-top: 8px;
    font-size: 9px;
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .hero-signal {
    grid-template-columns: minmax(180px, 0.28fr) minmax(0, 1fr);
    gap: 20px;
    padding: 13px 24px 10px;
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .hero-signal h2 {
    font-size: clamp(24px, 2vw, 31px);
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .hero-signal-note {
    margin-top: 5px;
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .hero-signal-legend {
    margin-top: 5px;
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .hero-energy-map {
    height: clamp(116px, 9.2vw, 154px);
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .calculation-dock {
    right: calc(var(--cv-inspector) + 42px);
    width: min(390px, calc(100vw - var(--cv-sidebar) - var(--cv-inspector) - 72px));
  }
}

@media (min-width: 1280px) and (max-width: 1599px) {
  .cw.mg63.cv75.cd76.cd77.cd79.studio {
    --cv-sidebar: 224px;
    --cv-inspector: 280px;
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .workspace {
    gap: 13px;
    padding-inline: 18px;
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .view {
    padding: 18px 21px 28px;
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .hero-copy {
    padding: 18px 21px 17px;
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .hero-copy h1 {
    font-size: clamp(42px, 4.1vw, 53px);
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .hero-score {
    padding: 17px;
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .score-value {
    font-size: 60px;
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .hero-mix,
  .cw.mg63.cv75.cd76.cd77.cd79.studio .hero-signal {
    padding-inline: 21px;
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .hero-signal {
    grid-template-columns: 170px minmax(0, 1fr);
    gap: 18px;
  }
}

@media (min-width: 1600px) {
  .cw.mg63.cv75.cd76.cd77.cd79.studio {
    --cv-sidebar: 252px;
    --cv-inspector: clamp(292px, 17vw, 324px);
  }
}

@media (min-width: 1900px) {
  .cw.mg63.cv75.cd76.cd77.cd79.studio .workspace {
    gap: 22px;
    padding-inline: 30px;
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .view {
    padding: 32px 36px 42px;
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .hero-copy h1 {
    font-size: clamp(68px, 4vw, 88px);
  }

  .cw.mg63.cv75.cd76.cd77.cd79.studio .hero-energy-map {
    height: clamp(205px, 10vw, 260px);
  }
}
