@layer workspace {
  .map-controls {position:absolute;z-index:5;top:22px;right:22px;display:flex;gap:4px;max-width:calc(100% - 44px);padding:4px;background:var(--surface);border:1px solid var(--line);border-radius:10px;box-shadow:0 4px 16px var(--shadow);}
  .map-controls>button {background:var(--surface);font-size:12px;padding:8px 10px;min-height:44px;}
  .map-controls #fitMap{display:flex;align-items:center;gap:6px}.map-controls #fitMap svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.5}
  .map-controls>button[aria-pressed=true] {background:var(--atlas-accent);color:white;}
  #mapOptionsPanel {position:absolute;top:52px;right:0;width:260px;max-width:calc(100vw - 32px);padding:12px 16px;border:1px solid var(--line);border-radius:10px;background:var(--surface);box-shadow:0 8px 32px var(--shadow-strong);}
  #mapOptionsPanel p {font-size:12px;line-height:1.5;color:var(--muted);}
  #mapOptionsPanel h3{font:600 14px var(--ui);margin:4px 0 8px}
  body[data-mode=client] #mapOptionsPanel .map-key{position:static;display:grid;max-width:none;border:0;padding:0 0 12px;margin:0 0 8px;box-shadow:none;border-bottom:1px solid var(--line);border-radius:0;gap:8px;background:transparent}
  body[data-mode=client] .site-view-action{display:inline-flex;align-items:center;min-height:24px;padding:4px 7px;background:var(--atlas-accent);color:var(--white);font:600 12px var(--ui);border-radius:5px;white-space:nowrap}
  body[data-mode=client] .site-select:hover .site-view-action{background:var(--atlas-accent-strong)}
  body[data-mode=client] .site-card.selected .site-view-action{background:var(--atlas-accent-strong)}
  body[data-mode=client] .card-actions{border-top:1px solid var(--line);margin-top:0}
  body[data-mode=client] .map-title{box-shadow:none!important;padding:10px 14px!important}
  body[data-mode=client] .map-title h2{font-size:18px!important}
  #mapControlStatus {position:absolute;right:0;top:48px;width:260px;max-width:calc(100vw - 32px);padding:10px;border-radius:8px;background:var(--surface);font-size:12px;box-shadow:0 4px 14px var(--shadow);}
  .map-controls:has(#mapOptionsPanel:not([hidden])) #mapControlStatus {display:none;}
  @media(min-width:761px) {body[data-mode=client] .map-stage:has(.detail:not([hidden])) .map-controls {right:calc(var(--client-detail-width) + 44px);}}
  @media(max-width:760px) {.map-controls {top:128px;right:15px;max-width:calc(100% - 30px);gap:2px;padding:3px}.map-controls>button{padding:8px}.map-controls #fitMap svg{display:none}body[data-mode=client] .map-key {display:none;}body[data-mode=client] .maplibregl-ctrl-top-right {top:190px;}body[data-mode=client] .map-stage:has(.detail[data-expanded=true]:not([hidden])) .map-controls {display:none;}}
  .client-workspace {max-width:1320px;height:calc(100dvh - 108px);overflow:auto;margin:0 auto;padding:0 clamp(16px,4vw,64px) 80px;}
  .client-workspace .dialog-heading {position:sticky;top:0;z-index:6;background:var(--surface);align-items:center;gap:20px;margin-bottom:24px;padding:20px 0 14px;}
  .client-workspace .dialog-heading h2 {font:600 clamp(36px,4vw,52px)/1.05 var(--display);}
  .client-workspace .dialog-heading .eyebrow {font-size:12px;letter-spacing:.12em;}
  .client-workspace .dialog-heading>button {flex-shrink:0;}
  .client-workspace .actions {flex-wrap:wrap;}
  .client-workspace #tourOrder {max-width:900px;}
  .client-workspace #tourOrder button {min-width:44px;}
  .client-workspace #packet {margin-top:32px;}
  .client-workspace .comparison-scroll {overflow:auto;}
  body[data-mode=client] .dossier-source {padding:10px;gap:12px;min-height:64px;}
  body[data-mode=client] .dossier-source .record-flyer-thumbnail {width:64px;}
  body[data-mode=client] .dossier-source .record-flyer-thumbnail img {height:80px;}
  body[data-mode=client] .dossier-source p {font-size:12px;line-height:1.5;margin:0;}
  @media(max-width:760px) {
    .client-workspace {height:calc(100dvh - 112px);}
    body[data-mode=client] .client-workspace .dialog-heading {align-items:center;flex-wrap:nowrap;gap:12px;padding:12px 0;margin-bottom:12px;}
    body[data-mode=client] .client-workspace .dialog-heading h2 {font-size:30px;}
    .client-workspace .dialog-heading .eyebrow {display:none;}
    .client-workspace .dialog-heading>button {padding:8px 12px;}
    .client-workspace #tourOrder li {flex-wrap:wrap;}
    body[data-mode=client] .client-workspace .compare-heads h3 {font-size:20px;line-height:1.1;}
    .client-workspace .comparison-toolbar {display:flex;flex-wrap:nowrap;align-items:center;gap:8px;}
    .client-workspace .comparison-toolbar .band-control {flex-shrink:0;}
    .client-workspace .comparison-toolbar .band-control button {padding:8px;}
    .client-workspace .comparison-toolbar .check {font-size:12px;min-height:44px;}
    body[data-mode=client] .client-workspace .overlap-section h3 {font-size:24px;}
  }
}
