/* Approved RF-008/009/010 refinements. */
#tools .section-head { box-shadow: inset 0 -1px 0 #CBD7D1; }

.art-stage { display: block; width: 57.6923%; height: auto; }
.art-stage .motif-svg { display: block; width: 100%; height: auto; overflow: visible; fill: none; }
.art-stage .motif-svg path { transform-box: fill-box; transform-origin: center; }
.tool-motion-status,.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

.tool-card[data-explore-card]:focus-within:not(:hover):not(:has(:focus-visible)) { background: var(--paper); }
.tool-card[data-explore-card]:focus-within:not(:hover):not(:has(:focus-visible)) .pill { --control-fill: transparent; --control-stroke: var(--ink); background: transparent; color: var(--ink); }

.explore-panel {
  position: fixed;
  margin: 0;
  padding: 0;
  width: 0;
  height: 0;
  max-width: none;
  max-height: none;
  border: 0;
  border-radius: 8px;
  background: #F5F4EF;
  color: #202020;
  overflow: auto;
}
.explore-panel::backdrop { background: rgba(32,32,32,.4); }
.explore-panel[open] { animation: explore-panel-enter .35s ease both; }
@keyframes explore-panel-enter { from { transform: translateY(calc(-100% - 40px)); } to { transform: translateY(0); } }
.explore-panel .panel-controls { position: absolute; top: 24px; left: 24px; right: 24px; display: flex; justify-content: space-between; align-items: center; }
.explore-panel .panel-controls button { background: none; border: 0; padding: 4px 0; color: inherit; font: 500 12px/16px var(--mono); letter-spacing: 1px; text-transform: uppercase; cursor: pointer; }
.explore-panel #explore-close { display: flex; align-items: center; gap: 12px; margin-left: auto; }
.explore-panel #explore-close span { font: 400 28px/1 var(--sans); }
@media (max-width: 749px) {
  .explore-panel[data-pointer-open="true"] #explore-close:focus { outline: none; box-shadow: none; }
}
.explore-panel .filter-headings { position: absolute; top: 88px; left: 40px; right: 40px; font: 500 var(--panel-heading-size,48px)/1 var(--sans); letter-spacing: -.02em; }
.explore-panel .filter-lists { position: absolute; bottom: 40px; left: 40px; right: 40px; }
.explore-panel .swipe-hint { display: none; margin: 0 0 8px; font: 500 10px/16px var(--mono); letter-spacing: 1px; text-transform: uppercase; color: #48514E; }
.explore-panel .list-window { overflow: hidden; height: 16px; font: 500 12px/16px var(--mono); letter-spacing: 1px; text-transform: uppercase; white-space: nowrap; }
.explore-panel .list-track { display: flex; width: max-content; animation: explore-list-drift var(--duration,120s) linear infinite; animation-play-state: paused; }
.explore-panel .list-copy { flex: none; white-space: pre; }
.explore-panel.running[data-mode="hover"] .list-window:focus-visible .list-track { animation-play-state: running; }
@media(hover:hover) { .explore-panel.running[data-mode="hover"] .list-window:hover .list-track { animation-play-state: running; } }
@keyframes explore-list-drift { from { transform: translateX(0); } to { transform: translateX(-50%); } }
.explore-panel .list-window:focus-visible { outline: 1px solid #202020; outline-offset: 2px; }
.explore-panel.paused .list-window,.explore-panel.reduced .list-window { overflow-x: auto; scrollbar-width: none; }
.explore-panel.paused .list-track,.explore-panel.reduced .list-track { animation: none; transform: none; }
.explore-panel.paused .list-copy[aria-hidden],.explore-panel.reduced .list-copy[aria-hidden] { display: none; }
.explore-panel.manual-reading .swipe-hint { display: block; }
.explore-panel.manual-reading .list-window { overflow-x: auto; overflow-y: hidden; scrollbar-width: none; overscroll-behavior-x: contain; height: 32px; padding-block: 8px; cursor: grab; }
.explore-panel.manual-reading .list-window:active { cursor: grabbing; }
.explore-panel.manual-reading .list-track { animation: none !important; transform: none; }
.explore-panel.manual-reading .list-copy[aria-hidden] { display: none; }
@media(max-width:749px) { .explore-panel .filter-headings,.explore-panel .filter-lists { left: 24px; right: 24px; } }
@media(max-height:500px) { .explore-panel .filter-headings { top: 72px; font-size: 32px; line-height: 34px; } .explore-panel .filter-lists { bottom: 40px; } }
@media(prefers-reduced-motion:reduce) { .explore-panel[open] { animation: none; } .explore-panel .list-track { animation: none !important; transform: none; } }

