/* Neumorphism UI: one porcelain material across the collection interface. */
:root {
  --paper:#e8ecef; --canvas:#e8ecef; --ink:#35434e; --muted:#62717c;
  --line:#cdd6dd; --neu-surface:#e8ecef; --neu-highlight:#fff;
  --neu-raised:4px 5px 12px rgba(174,187,197,.38),-4px -4px 12px rgba(255,255,255,.88);
  --neu-inset:inset 2px 2px 5px rgba(174,187,197,.5),inset -2px -2px 5px rgba(255,255,255,.9);
  --neu-field-focus:inset 3px 3px 7px rgba(154,171,184,.65),inset -3px -3px 7px rgba(255,255,255,.95);
  --explore-top:108px; --explore-left:20px; --explore-width:344px;
}
html,body,.app,.explorer,#space-viewport,#viewport,#gallery {background:var(--neu-surface)}
body {color:var(--ink)}
button,input,select {font-family:Manrope,Arial,sans-serif}
button:focus-visible,input:focus-visible,select:focus-visible,a:focus-visible {
  outline:2px solid #62717c; outline-offset:4px;
}
.museum-name {color:var(--ink);border-left-color:#cdd6dd}
/* Fixed-width parent slots and a smaller, evenly inset contextual track. */
.view-toolbar .nested-view-nav {
  position:absolute;top:28px;left:50%;transform:translateX(-50%);
  width:280px;height:80px;pointer-events:auto;isolation:isolate;
}
.nested-nav-surface {position:absolute;inset:0;width:280px;height:80px;overflow:visible;pointer-events:none;z-index:-1}
.nested-view-nav .view-switch {
  position:absolute;top:6px;left:10px;right:auto;transform:none;
  width:260px;height:30px;display:flex;gap:4px;padding:0;
  border:0;box-shadow:none;background:none;backdrop-filter:none;
  -webkit-backdrop-filter:none;border-radius:0;
}
.nested-view-nav .view-switch button {
  display:flex;align-items:center;justify-content:center;flex:0 0 84px;
  width:84px;height:30px;min-height:0;padding:0;border:0;border-radius:15px;
  color:var(--muted);background:none;box-shadow:none;font-size:12px;line-height:16px;
}
.nested-view-nav .view-switch button.active {
  color:var(--ink);font-weight:600;background:var(--neu-surface);box-shadow:var(--neu-inset);
}
.nested-view-nav .view-switch button:hover:not(.active) {background:rgba(255,255,255,.28);color:var(--ink)}
.nested-view-nav #graph-modes {
  display:flex;position:absolute;top:44px;left:50%;right:auto;transform:translateX(-50%);
  width:180px;height:28px;gap:2px;padding:2px;border:0;border-radius:14px;
  background:var(--neu-surface);box-shadow:var(--neu-inset);
  backdrop-filter:none;-webkit-backdrop-filter:none;
}
.nested-view-nav #graph-modes[hidden] {display:none}
.nested-view-nav #graph-modes button {
  position:relative;isolation:isolate;
  flex:1 1 0;min-width:0;height:24px;min-height:0;display:flex;align-items:center;justify-content:center;
  padding:0;border:0;border-radius:12px;background:none;box-shadow:none;
  color:var(--muted);font-size:var(--submenu-font-size);line-height:14px;white-space:nowrap;
}
/* Inset the visible thumb while keeping the whole button available to click. */
.nested-view-nav #graph-modes button::before {
  content:"";position:absolute;inset:2px;border-radius:10px;z-index:-1;pointer-events:none;
}
.nested-view-nav #graph-modes button[aria-pressed=true] {
  color:var(--ink);font-weight:600;
}
.nested-view-nav #graph-modes button[aria-pressed=true]::before {
  background:linear-gradient(145deg,#f1f4f6,#e2e7eb);
  box-shadow:1px 1px 2px rgba(174,187,197,.4),-1px -1px 2px rgba(255,255,255,.8);
}
/* Explore has one morphing shell. Its real filters scroll in the recessed well. */
.explore-shell {
  position:fixed;left:var(--explore-left);top:var(--explore-top);width:var(--explore-width);
  height:calc(100dvh - var(--explore-top) - var(--footer-height) - 20px);
  overflow:visible;pointer-events:none;z-index:15;
}
#filter-toggle {top:var(--explore-top);left:var(--explore-left);height:38px;width:132px;--control-height:38px;color:var(--ink);z-index:19}
#filter-toggle .liquid-surface {display:none}
#filter-toggle .liquid-icon {width:38px;height:38px}
#filter-toggle .liquid-icon::before {
  content:"";position:absolute;inset:5px;border-radius:50%;background:var(--neu-surface);
  box-shadow:var(--neu-inset);z-index:-1;
}
#filter-toggle:hover,#filter-toggle[aria-expanded=true] {color:var(--ink)}
#filter-toggle .liquid-label {font-size:11px;font-weight:600}
#filter-toggle .explore-arrow {font-size:15px}
#filter-toggle[aria-expanded=true] .explore-arrow {transform:rotate(180deg)}
#filter-backdrop {background:rgba(137,157,174,.08);backdrop-filter:blur(2px)}
.app .filters,.app.filters-open .filters {
  top:calc(var(--explore-top) + 58px);left:calc(var(--explore-left) + 54px);
  bottom:74px;width:276px;max-width:calc(100vw - 96px);padding:20px 18px;gap:18px;
  border:0;border-radius:24px;background:var(--neu-surface);box-shadow:inset 4px 4px 10px rgba(174,187,197,.55),inset -4px -4px 10px rgba(255,255,255,.9);
  backdrop-filter:none;-webkit-backdrop-filter:none;overflow-y:auto;overflow-x:hidden;
  overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#aebbc5 transparent;scrollbar-gutter:stable;
  opacity:0;transform:translateY(8px);
}
.filters>* {flex-shrink:0}
.filters[hidden] {display:none!important}
.filters .filter-heading>span {font-size:9px;letter-spacing:.07em;color:var(--muted)}
.filters .filter-heading-actions {gap:8px}
.filters #filter-close {width:28px;height:28px;color:var(--muted);border-radius:50%}
.filters .search-box,.filters select,.filters .year-inputs input {
  background:var(--neu-surface);border:0;border-radius:12px;box-shadow:var(--neu-inset);color:var(--ink);
}
.filters .search-box {padding:10px 12px;border-radius:20px}
.filters .search-box input {min-width:0;width:100%;border:0;background:none;box-shadow:none;color:var(--ink);appearance:none}
.filters :is(input[type=search],input[type=number],select):focus-visible,
.floating-search input:focus-visible,.space-lineage-nav select:focus-visible {outline:none}
.filters .search-box:focus-within,.filters .year-inputs input:focus,.filters select:focus,
.space-lineage-nav select:focus {box-shadow:var(--neu-field-focus)}
.filters input::placeholder {color:var(--muted)}
.filters .category-button {border:0;color:var(--muted);border-radius:12px;padding:9px 10px}
.filters .category-button.active {background:var(--neu-surface);box-shadow:var(--neu-inset);color:var(--ink)}
.filters .filter-section select,.filters .exhibition-filter select {padding:10px 12px}
.filters .sidebar-footer {border-color:var(--line)}
.filters .connection-help,.filters .sidebar-footer p,.filters .sidebar-footer a {color:var(--muted)}
/* Pill and round controls use the same material as the navigation. */
.floating-search {color:var(--ink)}
.floating-search .liquid-surface {
  background:linear-gradient(145deg,#f1f4f6,#e2e7eb);backdrop-filter:none;-webkit-backdrop-filter:none;
}
.floating-search {filter:drop-shadow(4px 5px 8px rgba(174,187,197,.45)) drop-shadow(-4px -4px 8px rgba(255,255,255,.8))}
.floating-search input {border:0;box-shadow:none;color:var(--ink);appearance:none}
.floating-search input::placeholder {color:var(--muted)}
.floating-search:focus-within .liquid-surface {background:linear-gradient(145deg,#e8edf1,#dce3e9)}
.floating-search input:focus::placeholder,.filters input:focus::placeholder {color:var(--ink)}
.floating-search .liquid-icon {border-radius:50%;color:var(--ink)}
.floating-search .liquid-icon::before {
  background:var(--neu-surface);box-shadow:var(--neu-inset);transition:box-shadow .18s;
}
.floating-search .liquid-icon:hover::before {box-shadow:var(--neu-field-focus)}
.floating-search .liquid-icon:active::before {
  box-shadow:inset 4px 4px 8px rgba(154,171,184,.7),inset -2px -2px 5px rgba(255,255,255,.9);
}
.floating-search kbd {color:var(--muted);border-color:#c4cfd7;background:none}
.zoom-controls,.space-camera .zoom-controls,.space-actions>button,.space-company-context button,
.space-lineage-nav,.exhibition-context,.canvas-topline button {
  background:linear-gradient(145deg,#f1f4f6,#e2e7eb);color:var(--ink);border:0;
  box-shadow:var(--neu-raised);backdrop-filter:none;-webkit-backdrop-filter:none;
}
.zoom-controls {padding:3px;border-radius:999px}
.zoom-controls button,.space-actions>button {border-radius:999px}
.zoom-controls button:hover,.space-actions>button:hover,.canvas-topline button:hover {background:rgba(255,255,255,.3);color:var(--ink)}
.space-actions>button[aria-pressed=true],.space-actions>button[aria-pressed=true]:hover,
.space-company-context button[aria-pressed=true],.canvas-topline button[aria-pressed=true] {
  background:var(--neu-surface);box-shadow:var(--neu-inset);color:var(--ink);border:0;
}
.space-lineage-nav select {background:var(--neu-surface);border:0;box-shadow:var(--neu-inset);color:var(--ink)}
.space-lineage-nav {grid-template-columns:144px 260px}
.space-lineage-nav>div {width:144px;gap:8px}
.space-lineage-nav output {min-width:40px}
.space-lineage-nav button {
  flex:0 0 44px;width:44px;height:44px;padding:0;border:0;
  background:var(--neu-surface);box-shadow:var(--neu-inset);color:var(--muted);
  transition:box-shadow .18s,color .18s;
}
.space-lineage-nav button:hover:not(:disabled) {
  background:var(--neu-surface);border:0;color:var(--ink);
  box-shadow:inset 3px 3px 7px rgba(174,187,197,.55),inset -3px -3px 7px rgba(255,255,255,.95);
}
.space-lineage-nav button:active:not(:disabled) {
  box-shadow:inset 4px 4px 8px rgba(174,187,197,.6),inset -2px -2px 5px rgba(255,255,255,.9);
}
.space-lineage-nav button:disabled {opacity:.35}
.space-lineage-nav button svg {width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
/* Mirrored edge tabs: 15px circular shoulders and an 18px semicircular end cap. */
.space-selection-header {min-height:24px;pointer-events:none}
.space-selection-header .space-edge-tab,.space-edge-tab {
  position:fixed;top:53%;transform:translateY(-50%);isolation:isolate;
  display:flex;align-items:center;justify-content:center;width:100px;height:44px;
  padding:0;border:0;background:none;box-shadow:none;color:#fff;
  font-size:11px;font-weight:600;line-height:16px;cursor:pointer;pointer-events:auto;
}
[data-space-back] {left:0;border-radius:0 28px 28px 0}
/* Back is shared by every selected-item view, outside the phone canvas focus lock. */
#selection-back {z-index:11}
.space-selection-header [data-space-details] {right:0;border-radius:28px 0 0 28px}
.space-selection-header .space-edge-tab:hover,.space-edge-tab:hover {background:none;color:#fff}
.space-edge-surface {
  position:absolute;top:-11px;left:0;width:100px;height:66px;overflow:visible;
  pointer-events:none;z-index:-1;
  filter:drop-shadow(2px 3px 5px rgba(151,165,177,.28)) drop-shadow(-2px -2px 4px rgba(255,255,255,.85));
  transition:filter .18s;
}
[data-space-details] .space-edge-surface {transform:scaleX(-1)}
.space-edge-tab:hover .space-edge-surface {
  filter:brightness(1.03) drop-shadow(2px 3px 5px rgba(151,165,177,.34)) drop-shadow(-2px -2px 4px rgba(255,255,255,.9));
}
.space-edge-tab:active .space-edge-surface {
  filter:brightness(.94) drop-shadow(1px 2px 2px rgba(133,147,158,.4)) drop-shadow(-1px -1px 2px rgba(255,255,255,.7));
}
.space-edge-label {display:flex;align-items:center;gap:4px;padding-right:8px;pointer-events:none;text-shadow:0 1px 2px rgba(66,80,92,.35)}
[data-space-details] .space-edge-label {padding-right:0;padding-left:8px}
.space-edge-label svg {width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.space-company-action {color:var(--muted);border-color:var(--line)}
.space-instructions {background:transparent}
.space-instructions p,.canvas-hint,.result-summary {color:var(--muted)}
.space-node-caption,.object-node .node-name {text-shadow:0 0 5px #e8ecef,0 1px 3px #e8ecef}
.space-node-caption strong,.space-selection-title strong {color:var(--ink)}
.space-node-caption small,.object-node .node-year {color:var(--muted)}
#year-axis,.app[data-view=clouds] .cluster-label {background:rgba(232,236,239,.9)}
#year-guides line {stroke:#d7dfe5}
.region-outer {fill:#e2e8ed;stroke:#d5dfe6}.region-middle {fill:#d9e2e8}.region-inner {fill:#cfdbe3}
#detail,.detail-topbar,dialog {background:var(--neu-surface);color:var(--ink);border-color:var(--line)}
#detail {box-shadow:-8px 0 24px rgba(125,145,161,.15)}
.close-button {background:var(--neu-surface);box-shadow:var(--neu-raised);color:var(--ink)}
.gallery-photo,.detail-photo {background:var(--neu-surface);border:0;border-radius:18px}
.gallery-photo {box-shadow:var(--neu-inset)}
.gallery-card p,.description,.image-caption,.object-meta dt,.meta-role,.relation-note,dialog p {color:var(--muted)}
@media(max-width:800px) {
  :root {--explore-top:174px;--explore-left:14px;--explore-width:344px}
  .view-toolbar .nested-view-nav {top:88px;left:50%;right:auto;transform:translateX(-50%)}
  #filter-toggle {left:14px;right:auto;top:174px;width:132px}
  .space-overview-controls {top:174px}.space-actions {padding-top:0}
  .space-selection {top:222px}.has-exhibition .space-selection {top:258px}
  .canvas-topline,.app[data-view=clouds] .canvas-topline {top:176px}
  #gallery {padding-top:190px}.exhibition-context {top:210px}
  .has-exhibition #gallery {padding-top:250px}
  .app[data-view=gallery] .result-summary,.app[data-view=timeline] .result-summary {top:145px}
  .app .filters,.app.filters-open .filters {left:68px;right:auto;top:232px;width:276px;bottom:74px}
  .museum-name {font-size:8px;padding-left:10px}
}
@media(max-width:600px) {
  .space-lineage-nav {grid-template-columns:144px minmax(0,1fr)}
}
@media(max-width:372px) {
  :root {--explore-left:14px;--explore-width:calc(100vw - 28px)}
  .app .filters,.app.filters-open .filters {width:calc(100vw - 96px)}
  .museum-name {display:none}
}
@media(prefers-reduced-motion:reduce) {
  .nested-view-nav,.filters,.explore-arrow,.space-edge-surface,.floating-search .liquid-icon::before {transition:none!important}
}

/* Supporting collection pages share the same canvas and tactile controls. */
.exhibition-header,.exhibition-header>span,.exhibition-meta,.source-note,
body:has(.cards)>header,.card,.object {border-color:var(--line)}
.exhibition-hero .primary,.exhibition-editions a,.card .open {
  display:inline-flex;align-items:center;justify-content:center;padding:12px 18px;
  border:0;border-radius:999px;background:linear-gradient(145deg,#f1f4f6,#e2e7eb);
  color:var(--ink);box-shadow:var(--neu-raised);text-decoration:none;
}
.exhibition-editions a[aria-current=page] {background:var(--neu-surface);box-shadow:var(--neu-inset);color:var(--ink)}
body:has(.cards) input,body:has(.cards) select {border:0;border-radius:14px;background:var(--neu-surface);box-shadow:var(--neu-inset);color:var(--ink)}
.exhibition-hero .intro,.exhibition-meta dt,.coverage,.object .designer,.object details,
.venue-note,.source-note,body:has(.cards) .intro,body:has(.cards) .card p,body:has(.cards) #count {color:var(--muted)}

/* Panel hierarchy: the title lives on the shell; only the content well scrolls. */
#detail {
  top:24px;right:20px;bottom:auto;width:405px;max-width:calc(100vw - 40px);
  height:min(760px,calc(100dvh - var(--footer-height) - 48px));
  display:flex;flex-direction:column;gap:8px;padding:12px;
  border:0;border-radius:28px;overflow:visible;
  background:linear-gradient(145deg,#edf1f4,#e4e9ed);
  box-shadow:6px 8px 24px rgba(149,166,180,.32),-5px -5px 18px rgba(255,255,255,.8);
}
#detail[hidden] {display:none!important}
#detail .detail-topbar {
  position:relative;top:auto;flex:0 0 auto;min-height:52px;padding:8px 10px;
  border:0;background:none;color:var(--ink);gap:12px;font-size:9px;
}
#detail .detail-topbar>span {color:var(--muted);font-size:9px;letter-spacing:.1em}
#detail .detail-topbar .close-button {flex:0 0 36px;width:36px;height:36px;font-size:25px}
#detail .detail-scroll {
  flex:1 1 auto;min-height:0;width:100%;overflow-y:auto;overflow-x:hidden;
  overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#aebbc5 transparent;
  scrollbar-gutter:stable;border-radius:18px;background:var(--neu-surface);
  box-shadow:inset 4px 4px 10px rgba(174,187,197,.55),inset -4px -4px 10px rgba(255,255,255,.9);
}
#detail .detail-scroll:focus-visible {outline:2px solid #62717c;outline-offset:3px}
#detail .detail-photo {background:none;border-radius:12px}
#detail .detail-actions {gap:10px}
#detail .detail-actions button {
  border:0;border-radius:999px;background:linear-gradient(145deg,#f1f4f6,#e2e7eb);
  color:var(--ink);box-shadow:var(--neu-raised);padding:11px 10px;
}
#detail .detail-actions button.active {background:var(--neu-surface);box-shadow:var(--neu-inset)}
@media(max-width:600px) {
  #detail {top:14px;right:14px;width:405px;max-width:calc(100vw - 28px);
    height:min(720px,calc(100dvh - var(--footer-height) - 28px));padding:10px;border-radius:24px}
  #detail .detail-topbar {gap:8px;padding:6px;min-height:48px;font-size:8px}
  #detail .detail-topbar>span {font-size:8px}
  #detail .detail-scroll {border-radius:16px}
  #detail .detail-content {padding-inline:18px}
  #detail .detail-photo {margin-inline:18px}
  #detail .image-caption {margin-inline:18px}
}