/* SvS Planner interface cleanup v5.2.1.
   Presentation only: map geometry, assignments, saving and sharing are unchanged. */

.planner-jump-nav { display: none; }

.planner-disclosure,
.assignment-disclosure,
.battle-roster,
.map-reference,
.objective-legend { overflow: hidden; }

.planner-disclosure > summary,
.assignment-disclosure > summary,
.battle-roster > summary,
.map-reference > summary,
.objective-legend > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 52px;
  padding: 10px 13px;
  color: #fff4e8;
  cursor: pointer;
  list-style: none;
  user-select: none;
}

.planner-disclosure > summary::-webkit-details-marker,
.assignment-disclosure > summary::-webkit-details-marker,
.battle-roster > summary::-webkit-details-marker,
.map-reference > summary::-webkit-details-marker,
.objective-legend > summary::-webkit-details-marker { display: none; }

.planner-disclosure > summary::after,
.assignment-disclosure > summary::after,
.battle-roster > summary::after,
.map-reference > summary::after,
.objective-legend > summary::after {
  content: "+";
  flex: 0 0 28px;
  display: grid;
  width: 28px;
  height: 28px;
  place-items: center;
  border: 1px solid rgba(244,122,31,.42);
  border-radius: 7px;
  color: #ff8b2c;
  background: #0a1317;
  font-size: 20px;
  font-weight: 400;
  line-height: 1;
}

.planner-disclosure[open] > summary::after,
.assignment-disclosure[open] > summary::after,
.battle-roster[open] > summary::after,
.map-reference[open] > summary::after,
.objective-legend[open] > summary::after { content: "−"; }

.planner-disclosure > summary strong,
.assignment-disclosure > summary strong,
.battle-roster > summary strong {
  display: block;
  color: #f47a1f;
  font-size: 12px;
  font-weight: 850;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.planner-disclosure > summary small,
.assignment-disclosure > summary small,
.battle-roster > summary small,
.map-reference > summary span,
.objective-legend > summary span {
  display: block;
  margin-top: 3px;
  color: #858d8e;
  font-size: 10px;
  font-weight: 650;
  letter-spacing: .02em;
  text-transform: none;
}

details.planner-disclosure:not([open]) > .planner-disclosure-content,
details.assignment-disclosure:not([open]) > .assignment-disclosure-content,
details.battle-roster:not([open]) > .battle-roster-content,
details.map-reference:not([open]) > .map-reference-content,
details.objective-legend:not([open]) > .objective-legend-items { display: none !important; }

.planner-disclosure[open] > summary,
.assignment-disclosure[open] > summary,
.battle-roster[open] > summary,
.map-reference[open] > summary,
.objective-legend[open] > summary { border-bottom: 1px solid rgba(244,122,31,.2); }

.planner-disclosure-content,
.assignment-disclosure-content,
.battle-roster-content { padding: 12px; }

/* Remove repeated headings from the previous card layout. */
.planner-workspace-controls .missile-tools::before,
.planner-workspace-controls .flag-tools::before,
.planner-workspace-controls .saved-plan-tools::before { content: none !important; display: none !important; }

.planner-workspace-controls details.planner-disclosure,
.control-panel details.state-import-pro {
  display: block !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 1px solid rgba(244,122,31,.28) !important;
  border-radius: 11px !important;
  background: linear-gradient(180deg,rgba(12,23,28,.92),rgba(7,15,19,.96)) !important;
}

.planner-workspace-controls .planner-disclosure-content { display: grid; gap: 10px; }
.planner-workspace-controls .flag-tools .planner-disclosure-content { grid-template-columns: repeat(2,minmax(0,1fr)); }
.planner-workspace-controls .flag-tools .alliance-actions,
.planner-workspace-controls .flag-tools .planner-disclosure-content > p { grid-column: 1 / -1; }
.planner-workspace-controls .saved-plan-tools .planner-disclosure-content { grid-template-columns: 1fr; }
.planner-workspace-controls .saved-plan-tools .planner-disclosure-content > * { grid-column: 1 / -1; }
.state-import-pro .planner-disclosure-content { display: block; padding: 14px; }
.state-import-pro .sip-lead { margin: 0 0 12px; color: #a3a6a7; font-size: 12px; line-height: 1.45; }
.state-import-pro .sip-badge { margin-left: auto; }

/* Assignment cards are now a compact command list instead of an image carousel. */
.objective-deck { padding: 12px !important; }
.objective-legend {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  height: auto !important;
  margin: 0 0 10px !important;
  padding: 0 !important;
  border: 1px solid rgba(244,122,31,.22) !important;
  border-radius: 9px !important;
  background: rgba(5,12,15,.72) !important;
}

.objective-legend > summary { min-height: 44px; padding: 8px 11px; color: #f47a1f; font-size: 11px; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.objective-legend > summary::after { width: 24px; height: 24px; flex-basis: 24px; font-size: 17px; }
.objective-legend-items { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 8px; padding: 10px; }
.objective-legend-items > div { display: flex; align-items: center; gap: 7px; min-width: 0; color: #d8d5cf; font-size: 10px; }

.objective-cards-track {
  display: grid !important;
  grid-template-columns: repeat(3,minmax(0,1fr)) !important;
  gap: 10px !important;
  width: 100% !important;
  padding: 0 !important;
  overflow: visible !important;
}
.objective-cards-track::after { content: none !important; display: none !important; }
.objective-cards-track .objective-card.turret-settings-card {
  width: 100% !important;
  min-width: 0 !important;
  min-height: 116px !important;
  height: 116px !important;
  padding: 11px !important;
}
.objective-card.turret-settings-card .objective-title { position: relative; z-index: 5; font-size: 12px; }
.objective-card.turret-settings-card .objective-meta {
  position: absolute !important;
  z-index: 5 !important;
  left: 11px !important;
  right: auto !important;
  top: 37px !important;
  width: 48% !important;
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 4px !important;
  white-space: normal !important;
}
.objective-card.turret-settings-card .objective-meta span:first-child { width: 100%; font-size: 7px !important; }
.objective-card.turret-settings-card .objective-meta span:nth-of-type(n+2),
.objective-card.turret-settings-card .objective-meta b,
.objective-card.turret-settings-card .objective-meta em { display: none !important; }
.objective-card.turret-settings-card .objective-meta strong { max-width: 100% !important; font-size: 9px !important; }
.objective-card.turret-settings-card .turret-card-art.armored-card-turret {
  left: auto !important;
  right: 25px !important;
  bottom: -3px !important;
  width: 52% !important;
  height: 105% !important;
  object-position: right bottom !important;
  opacity: .9;
}
.objective-card .objective-edit { z-index: 6; right: 7px; bottom: 7px; width: 27px; height: 27px; }
.objective-cards-track .objective-add-note { grid-column: 1 / -1; width: 100% !important; min-width: 0 !important; min-height: 42px !important; height: 42px !important; flex-direction: row; border-radius: 8px; }
.objective-cards-track .objective-add-note span { font-size: 20px; }

.assignment-disclosure,
.battle-roster {
  margin: 0 !important;
  padding: 0 !important;
  border: 1px solid rgba(244,122,31,.26) !important;
  border-radius: 10px !important;
  background: #091419 !important;
}
.assignment-disclosure-content,
.battle-roster-content { display: grid; gap: 9px; }
.assignment-disclosure-content .assignment-grid { margin: 0; }
.battle-roster-content .battle-roster-help { margin: 0; }

.map-reference { display: block !important; padding: 0 !important; }
.map-reference > summary { min-height: 48px; color: #f47a1f; font-size: 11px; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.map-reference-content { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; padding: 10px; }

/* Desktop command workspace: setup above, map and live assignments side-by-side. */
@media (min-width: 1100px) {
  .page-shell {
    width: min(1760px,100%) !important;
    display: grid !important;
    grid-template-columns: minmax(0,1fr) !important;
    grid-template-rows: auto !important;
    gap: 11px !important;
    padding: 14px clamp(14px,1.6vw,26px) 32px !important;
  }

  .page-heading {
    grid-column: 1 !important;
    grid-row: auto !important;
    min-height: 104px !important;
    margin: 0 !important;
    padding: 18px 26px !important;
  }
  .page-heading h1 { font-size: clamp(28px,2.2vw,36px) !important; }
  .page-heading p:last-child { max-width: 820px; margin-top: 6px !important; }

  .control-panel {
    grid-column: 1 !important;
    grid-row: auto !important;
    grid-template-columns: repeat(12,minmax(0,1fr)) !important;
    gap: 9px !important;
    padding: 11px !important;
  }
  .control-panel::before,
  .control-panel > .command-panel-heading { grid-column: 1 / -1 !important; }
  .control-panel > .plan-field { grid-column: span 4 !important; }
  .control-panel > .state-field { grid-column: span 2 !important; }
  .control-panel > .member-field { grid-column: span 3 !important; }
  .control-panel > .decode-import {
    grid-column: span 8 !important;
    display: grid !important;
    grid-template-columns: minmax(0,1fr) minmax(0,1.25fr) minmax(170px,.9fr) !important;
    gap: 8px !important;
    padding: 9px !important;
  }
  .control-panel .decode-import-heading { grid-column: 1 / -1 !important; flex-direction: row; align-items: center; }
  .control-panel .decode-player-preview { grid-column: auto !important; min-height: 42px; }
  .control-panel > .state-import-pro {
    grid-column: span 4 !important;
    align-self: stretch !important;
  }
  .control-panel > .state-import-pro:not([open]) > summary { min-height: 100%; }

  .control-panel > .planner-workspace-controls {
    grid-column: 1 / -1 !important;
    grid-template-columns: minmax(330px,1.15fr) minmax(330px,1fr) minmax(300px,.85fr) !important;
    gap: 9px !important;
  }
  .planner-workspace-controls .planner-placement-tools {
    display: grid !important;
    grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    gap: 8px !important;
  }
  .planner-workspace-controls .hq-placement-actions {
    grid-column: 1 / -1 !important;
    grid-template-columns: repeat(2,minmax(0,1fr)) !important;
  }
  .planner-workspace-controls .planner-placement-tools details.planner-disclosure { grid-column: auto !important; }
  .planner-workspace-controls .planner-placement-tools details.planner-disclosure[open] { grid-column: 1 / -1 !important; }

  .planner-workspace-controls .control-actions {
    grid-template-columns: repeat(3,minmax(0,1fr)) !important;
    gap: 7px !important;
    padding: 11px !important;
  }
  .planner-workspace-controls .control-actions::before { grid-column: 1 / -1 !important; }
  .planner-workspace-controls .control-actions > button,
  .planner-workspace-controls .control-actions #newPlanButton { grid-column: auto !important; min-height: 40px !important; padding: 8px 7px !important; font-size: 10px !important; }
  .planner-workspace-controls .saved-plan-tools { align-self: start !important; padding: 0 !important; }

  .action-message {
    grid-column: 1 !important;
    grid-row: auto !important;
    min-height: 34px !important;
    margin: 0 !important;
    padding: 8px 12px !important;
  }

  .planner-grid {
    grid-column: 1 !important;
    grid-row: auto !important;
    display: grid !important;
    grid-template-columns: minmax(0,1fr) minmax(390px,440px) !important;
    gap: 11px !important;
    align-items: start !important;
  }
  .planner-grid > .map-card {
    grid-column: 1 !important;
    grid-row: 1 !important;
    width: auto !important;
    margin: 0 !important;
  }
  .planner-grid > .roster-card {
    grid-column: 2 !important;
    grid-row: 1 !important;
    display: grid !important;
    grid-template-columns: minmax(0,1fr) !important;
    gap: 8px !important;
    align-self: start !important;
    margin: 0 !important;
    padding: 10px !important;
  }
  .planner-grid > .roster-card::before,
  .planner-grid > .roster-card > * { grid-column: 1 !important; }
  .canvas-wrap { height: clamp(690px,62vw,900px) !important; min-height: 690px !important; }

  .roster-card .objective-deck { padding: 9px !important; }
  .roster-card .objective-cards-track { grid-template-columns: minmax(0,1fr) !important; gap: 7px !important; }
  .roster-card .objective-cards-track .objective-card.turret-settings-card { min-height: 86px !important; height: 86px !important; }
  .roster-card .objective-card.turret-settings-card .objective-meta { top: 34px !important; width: 46% !important; }
  .roster-card .objective-card.turret-settings-card .turret-card-art.armored-card-turret { right: 28px !important; width: 46% !important; height: 108% !important; }
  .roster-card .objective-cards-track .objective-add-note { min-height: 40px !important; height: 40px !important; }
  .roster-card .empty-state { min-height: 140px; padding-block: 22px; }

  .intel-strip.map-reference {
    grid-column: 1 !important;
    grid-row: auto !important;
    margin: 0 !important;
  }
}

@media (max-width: 760px) {
  html { scroll-behavior: smooth; }
  #planControls, #mapCard, #planAssignments { scroll-margin-top: 112px; }

  .planner-jump-nav {
    position: sticky;
    z-index: 18;
    top: 62px;
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 6px;
    margin: 0 0 8px;
    padding: 6px;
    border: 1px solid rgba(244,122,31,.3);
    border-radius: 10px;
    background: rgba(5,10,13,.94);
    backdrop-filter: blur(12px);
  }
  .planner-jump-nav a {
    display: flex;
    min-height: 38px;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border: 1px solid #26363c;
    border-radius: 7px;
    background: #091419;
    color: #ece8df;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .07em;
    text-decoration: none;
    text-transform: uppercase;
  }
  .planner-jump-nav a span { display: grid; width: 18px; height: 18px; place-items: center; border-radius: 50%; background: #f47a1f; color: #090b0c; font-size: 9px; }

  .control-panel { gap: 7px !important; padding: 9px !important; }
  .control-panel .command-panel-heading { margin-bottom: 1px; }
  .control-panel input,
  .control-panel select { min-height: 40px !important; height: 40px !important; }
  .control-panel .field { gap: 5px; }
  .control-panel .field > span { font-size: 8px !important; }

  .control-panel .decode-import {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 7px !important;
    padding: 9px !important;
  }
  .decode-import-heading,
  .decode-player-preview { grid-column: 1 / -1 !important; }
  .decode-import-heading { flex-direction: row; align-items: center; }
  .decode-player-preview { min-height: 34px; }

  .planner-placement-tools { grid-template-columns: 1fr 1fr; gap: 7px; }
  .planner-placement-tools .hq-placement-actions { grid-column: 1 / -1 !important; }
  .planner-placement-tools details.planner-disclosure { grid-column: auto !important; }
  .planner-placement-tools details.planner-disclosure[open] { grid-column: 1 / -1 !important; }
  .planner-placement-tools details.planner-disclosure > summary { min-height: 54px; padding: 8px 9px; }
  .planner-placement-tools details.planner-disclosure > summary::after { flex-basis: 24px; width: 24px; height: 24px; }
  .planner-placement-tools details.planner-disclosure > summary small { font-size: 8px; }

  .planner-workspace-controls .control-actions {
    grid-template-columns: repeat(6,minmax(0,1fr)) !important;
    gap: 6px !important;
    padding: 10px !important;
  }
  .planner-workspace-controls .control-actions::before { grid-column: 1 / -1; font-size: 11px; }
  .planner-workspace-controls .control-actions > button { grid-column: span 3 !important; min-height: 40px !important; font-size: 9px !important; padding: 8px 6px !important; }
  .planner-workspace-controls .control-actions #undoButton,
  .planner-workspace-controls .control-actions #clearPlanButton,
  .planner-workspace-controls .control-actions #newPlanButton { grid-column: span 2 !important; }

  .planner-workspace-controls .saved-plan-tools { padding: 0 !important; }
  .planner-workspace-controls .saved-plan-actions,
  .planner-workspace-controls .public-plan-picker { grid-template-columns: 1fr 1fr !important; }

  .action-message { min-height: 34px; padding: 8px 10px; font-size: 10px; }
  .map-help { padding: 9px 11px; font-size: 10px; line-height: 1.4; }

  .roster-card { display: grid; gap: 8px; padding: 9px !important; }
  .roster-card::before { padding: 4px 2px 2px !important; font-size: 11px; }
  .objective-deck { padding: 9px !important; }
  .objective-deck-heading { margin-bottom: 8px !important; }

  .objective-legend-items { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .objective-legend-items > div:last-child { grid-column: 1 / -1; }
  .objective-cards-track { grid-template-columns: repeat(3,minmax(0,1fr)) !important; gap: 7px !important; }
  .objective-cards-track .objective-card.turret-settings-card { min-height: 106px !important; height: 106px !important; }
  .objective-card.turret-settings-card .turret-card-art.armored-card-turret { right: 21px !important; width: 58% !important; height: 100% !important; }
  .objective-card.turret-settings-card .objective-meta { width: 48% !important; }

  .map-reference-content { grid-template-columns: 1fr; }
}

@media (max-width: 520px) {
  .page-heading { min-height: 0 !important; padding: 14px !important; }
  .page-heading .eyebrow,
  .page-heading .hero-kicker,
  .page-heading p:last-child { display: none !important; }
  .page-heading h1 { font-size: 20px !important; }

  .objective-cards-track { grid-template-columns: 1fr !important; }
  .objective-cards-track .objective-card.turret-settings-card { min-height: 88px !important; height: 88px !important; }
  .objective-card.turret-settings-card .objective-meta { top: 34px !important; width: 46% !important; }
  .objective-card.turret-settings-card .turret-card-art.armored-card-turret { right: 30px !important; width: 46% !important; height: 108% !important; }
  .objective-cards-track .objective-add-note { min-height: 40px !important; height: 40px !important; }

  .assignment-disclosure-content .assignment-grid { grid-template-columns: 1fr 1fr; }
  .assignment-disclosure-content .assignment-grid .button { width: 100%; font-size: 8px; padding-inline: 5px; }

  .battle-roster-columns { grid-template-columns: 1fr 1fr; gap: 7px; }
  .battle-player-list { max-height: 150px; }
}

@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
