
    #main-storage-location-plan {
      color: var(--foreground);
      display: grid;
      gap: 18px;
      width: 100%;
    }
    #main-storage-location-plan h2,
    #main-storage-location-plan h3,
    #main-storage-location-plan p { margin: 0; }
    #main-storage-location-plan .storage-plan {
      display: block;
      height: auto;
      width: 100%;
    }
    #main-storage-location-plan .room-outline {
      fill: var(--card);
      stroke: var(--foreground);
      stroke-width: 3;
    }
    #main-storage-location-plan .shelf-run {
      fill: var(--viz-series-4);
      opacity: .5;
      stroke: var(--foreground);
      stroke-width: 2;
    }
    #main-storage-location-plan .door-gap { stroke: var(--card); stroke-width: 8; }
    #main-storage-location-plan .door-swing {
      fill: none;
      stroke: var(--muted-foreground);
      stroke-width: 2;
    }
    #main-storage-location-plan .map-label,
    #main-storage-location-plan .map-note,
    #main-storage-location-plan .map-code {
      fill: var(--foreground);
      pointer-events: none;
      text-anchor: middle;
    }
    #main-storage-location-plan .map-label { font-size: 24px; font-weight: 500; }
    #main-storage-location-plan .map-note { fill: var(--muted-foreground); font-size: 21px; }
    #main-storage-location-plan .map-code { font-size: 22px; font-weight: 500; }
    #main-storage-location-plan .wall-groups {
      display: grid;
      gap: 16px;
      grid-template-columns: 1fr;
    }
    #main-storage-location-plan .wall-group { display: grid; gap: 8px; }
    #main-storage-location-plan .tier-grid {
      display: grid;
      gap: 8px;
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }
    #main-storage-location-plan .tier-caption {
      color: var(--muted-foreground);
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      text-align: center;
    }
    #main-storage-location-plan .selected-location { display: grid; gap: 10px; }
    #main-storage-location-plan .selected-heading {
      align-items: baseline;
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
    }
    @media (min-width: 620px) {
      #main-storage-location-plan .wall-groups { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    }
  

    #kitchen-location-plan {
      color: var(--foreground);
      display: grid;
      gap: 16px;
      width: 100%;
    }
    #kitchen-location-plan h2,
    #kitchen-location-plan h3,
    #kitchen-location-plan p { margin: 0; }
    #kitchen-location-plan .kitchen-map {
      display: block;
      height: auto;
      width: 100%;
    }
    #kitchen-location-plan .room {
      fill: var(--card);
      stroke: var(--foreground);
      stroke-width: 3;
    }
    #kitchen-location-plan .door-gap { stroke: var(--card); stroke-width: 10; }
    #kitchen-location-plan .door-swing {
      fill: none;
      stroke: var(--muted-foreground);
      stroke-width: 2;
    }
    #kitchen-location-plan .zone {
      fill: var(--muted);
      stroke: var(--border);
      stroke-width: 2;
    }
    #kitchen-location-plan .zone.is-confirmed {
      fill: var(--viz-series-3);
      stroke: var(--foreground);
      stroke-width: 4;
    }
    #kitchen-location-plan .appliance {
      fill: var(--secondary);
      stroke: var(--foreground);
      stroke-width: 2;
    }
    #kitchen-location-plan .map-label,
    #kitchen-location-plan .map-note,
    #kitchen-location-plan .zone-label,
    #kitchen-location-plan .appliance-label {
      fill: var(--foreground);
      pointer-events: none;
      text-anchor: middle;
    }
    #kitchen-location-plan .map-label { font-size: 28px; font-weight: 500; }
    #kitchen-location-plan .map-note { fill: var(--muted-foreground); font-size: 20px; }
    #kitchen-location-plan .zone-label { font-size: 23px; font-weight: 500; }
    #kitchen-location-plan .appliance-label { font-size: 16px; font-weight: 500; }
    #kitchen-location-plan .selection { display: grid; gap: 10px; }
    #kitchen-location-plan .selection-title {
      align-items: baseline;
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
    }
  

    #welcome-area-location-plan {
      --welcome-yellow: color-mix(in srgb, var(--yellow) 58%, var(--card));
      color: var(--foreground);
      display: grid;
      gap: 16px;
      width: 100%;
    }
    #welcome-area-location-plan h2,
    #welcome-area-location-plan h3,
    #welcome-area-location-plan p { margin: 0; }
    #welcome-area-location-plan .area-map {
      display: block;
      height: auto;
      width: 100%;
    }
    #welcome-area-location-plan .room {
      fill: var(--card);
      stroke: var(--foreground);
      stroke-width: 3;
    }
    #welcome-area-location-plan .back-band { fill: var(--muted); }
    #welcome-area-location-plan .gap-zone {
      fill: var(--welcome-yellow);
      stroke: var(--foreground);
      stroke-width: 2;
    }
    #welcome-area-location-plan .shelf {
      fill: var(--welcome-yellow);
      stroke: var(--foreground);
      stroke-width: 2;
    }
    #welcome-area-location-plan .shelf-tier {
      stroke: var(--foreground);
      stroke-width: 2;
    }
    #welcome-area-location-plan .cupboard {
      fill: var(--welcome-yellow);
      stroke: var(--foreground);
      stroke-width: 3;
    }
    #welcome-area-location-plan .cupboard-tier {
      stroke: var(--muted-foreground);
      stroke-width: 2;
    }
    #welcome-area-location-plan .map-label,
    #welcome-area-location-plan .map-note,
    #welcome-area-location-plan .zone-code {
      fill: var(--foreground);
      pointer-events: none;
      text-anchor: middle;
    }
    #welcome-area-location-plan .map-label { font-size: 23px; font-weight: 500; }
    #welcome-area-location-plan .map-note { fill: var(--muted-foreground); font-size: 16px; }
    #welcome-area-location-plan .zone-code { font-size: 20px; font-weight: 500; }
    #welcome-area-location-plan .shelf-code {
      fill: var(--foreground);
      font-size: 20px;
      font-weight: 500;
      pointer-events: none;
      text-anchor: middle;
    }
    #welcome-area-location-plan .zone-list {
      display: grid;
      gap: 8px;
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    #welcome-area-location-plan .zone-group { display: grid; gap: 4px; }
    #welcome-area-location-plan .zone-group p { color: var(--muted-foreground); }
    #welcome-area-location-plan .next-step { display: grid; gap: 10px; }
    @media (max-width: 560px) {
      #welcome-area-location-plan .zone-list { grid-template-columns: 1fr; }
    }
  

    #studio-location-plan {
      --studio-zone: color-mix(in srgb, var(--blue) 32%, var(--card));
      color: var(--foreground);
      display: grid;
      gap: 16px;
      width: 100%;
    }
    #studio-location-plan h2,
    #studio-location-plan h3,
    #studio-location-plan p { margin: 0; }
    #studio-location-plan .studio-map {
      display: block;
      height: auto;
      width: 100%;
    }
    #studio-location-plan .room {
      fill: var(--card);
      stroke: var(--foreground);
      stroke-width: 3;
    }
    #studio-location-plan .zone {
      fill: var(--studio-zone);
      stroke: var(--foreground);
      stroke-width: 2;
    }
    #studio-location-plan .fixture {
      fill: var(--muted);
      stroke: var(--muted-foreground);
      stroke-width: 2;
    }
    #studio-location-plan .door {
      stroke: var(--foreground);
      stroke-width: 5;
    }
    #studio-location-plan .step {
      stroke: var(--muted-foreground);
      stroke-width: 2;
    }
    #studio-location-plan .map-label,
    #studio-location-plan .map-note,
    #studio-location-plan .zone-code {
      fill: var(--foreground);
      pointer-events: none;
      text-anchor: middle;
    }
    #studio-location-plan .map-label { font-size: 24px; font-weight: 500; }
    #studio-location-plan .map-note { fill: var(--muted-foreground); font-size: 16px; }
    #studio-location-plan .zone-code { font-size: 19px; font-weight: 500; }
    #studio-location-plan .zone-list {
      display: grid;
      gap: 8px;
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    #studio-location-plan .zone-group { display: grid; gap: 4px; }
    #studio-location-plan .zone-group p { color: var(--muted-foreground); }
    #studio-location-plan .next-step { display: grid; gap: 10px; }
    @media (max-width: 500px) {
      #studio-location-plan .zone-list { grid-template-columns: 1fr; }
    }
  

    #top-office-location-plan {
      --office-zone: color-mix(in srgb, var(--blue) 30%, var(--card));
      color: var(--foreground);
      display: grid;
      gap: 16px;
      width: 100%;
    }
    #top-office-location-plan h2,
    #top-office-location-plan h3,
    #top-office-location-plan p { margin: 0; }
    #top-office-location-plan .office-map {
      display: block;
      height: auto;
      width: 100%;
    }
    #top-office-location-plan .room {
      fill: var(--card);
      stroke: var(--foreground);
      stroke-width: 3;
    }
    #top-office-location-plan .zone {
      fill: var(--office-zone);
      stroke: var(--foreground);
      stroke-width: 2;
    }
    #top-office-location-plan .shelf-line,
    #top-office-location-plan .door-swing {
      fill: none;
      stroke: var(--muted-foreground);
      stroke-width: 2;
    }
    #top-office-location-plan .door-gap {
      stroke: var(--card);
      stroke-width: 10;
    }
    #top-office-location-plan .map-label,
    #top-office-location-plan .map-note,
    #top-office-location-plan .zone-code {
      fill: var(--foreground);
      pointer-events: none;
      text-anchor: middle;
    }
    #top-office-location-plan .map-label { font-size: 24px; font-weight: 500; }
    #top-office-location-plan .map-note { fill: var(--muted-foreground); font-size: 16px; }
    #top-office-location-plan .zone-code { font-size: 19px; font-weight: 500; }
    #top-office-location-plan .zone-list {
      display: grid;
      gap: 8px;
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    #top-office-location-plan .zone-group { display: grid; gap: 4px; }
    #top-office-location-plan .zone-group p { color: var(--muted-foreground); }
    #top-office-location-plan .next-step { display: grid; gap: 10px; }
    @media (max-width: 500px) {
      #top-office-location-plan .zone-list { grid-template-columns: 1fr; }
    }
  

    #loft-location-plan {
      --loft-zone: color-mix(in srgb, var(--red) 28%, var(--card));
      color: var(--foreground);
      display: grid;
      gap: 16px;
      width: 100%;
    }
    #loft-location-plan h2,
    #loft-location-plan h3,
    #loft-location-plan p { margin: 0; }
    #loft-location-plan .loft-map {
      display: block;
      height: auto;
      width: 100%;
    }
    #loft-location-plan .room {
      fill: var(--card);
      stroke: var(--foreground);
      stroke-width: 3;
    }
    #loft-location-plan .rack,
    #loft-location-plan .level {
      fill: var(--loft-zone);
      stroke: var(--foreground);
      stroke-width: 2;
    }
    #loft-location-plan .door-gap {
      stroke: var(--card);
      stroke-width: 10;
    }
    #loft-location-plan .door-swing {
      fill: none;
      stroke: var(--muted-foreground);
      stroke-width: 2;
    }
    #loft-location-plan .map-label,
    #loft-location-plan .map-note,
    #loft-location-plan .zone-code {
      fill: var(--foreground);
      pointer-events: none;
      text-anchor: middle;
    }
    #loft-location-plan .map-label { font-size: 24px; font-weight: 500; }
    #loft-location-plan .map-note { fill: var(--muted-foreground); font-size: 16px; }
    #loft-location-plan .zone-code { font-size: 18px; font-weight: 500; }
    #loft-location-plan .rack-levels {
      display: grid;
      gap: 8px;
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    #loft-location-plan .rack-summary { display: grid; gap: 4px; }
    #loft-location-plan .rack-summary p { color: var(--muted-foreground); }
    #loft-location-plan .next-step { display: grid; gap: 10px; }
    @media (max-width: 480px) {
      #loft-location-plan .rack-levels { grid-template-columns: 1fr; }
    }
  

