/* Dissertation visual brief: static SVG figures, native controls, no dependencies. */
.dissertation-viewer {
  --slide-duration: 8s;
  min-width: 0;
  position: relative;
  overflow: hidden;
  align-self: stretch;
  border-right: 1px solid #282c32;
  background: radial-gradient(ellipse at 55% 32%, #ffffff04, transparent 65%), #08090b;
  display: flex;
  flex-direction: column;
  justify-content: center;
  touch-action: pan-y pinch-zoom;
}
.dissertation-viewer:focus-visible { outline: 1px solid #d1d7df; outline-offset: -3px; }
.viewer-topline { display: flex; justify-content: space-between; align-items: center; padding: 17px 24px 12px; font: 8px var(--mono); letter-spacing: 1px; color: #969da8; }
.viewer-topline > span:first-child { display: inline-flex; align-items: center; gap: 8px; }
.viewer-topline i { width: 4px; height: 4px; border-radius: 50%; background: #c5ccd6; box-shadow: 0 0 8px #d5dce333; }
.viewer-count { letter-spacing: 0; font-size: 10px; }
.viewer-count b { font-weight: 400; color: #e3e7ed; }
.viewer-count > span { color: #737c89; }
.viewer-stage { position: relative; }
.diss-slide { margin: 0; display: grid; grid-template-rows: auto 154px; }
.diss-slide[hidden] { display: none; }
.diss-slide:not([hidden]) { animation: visual-enter .45s ease-out; }
.diss-slide img { display: block; width: 100%; height: auto; aspect-ratio: 600 / 330; object-fit: contain; user-select: none; }
.diss-slide figcaption { padding: 5px 25px 18px; }
.slide-meta { display: flex; justify-content: space-between; gap: 10px; align-items: center; font: 7px/1.6 var(--mono); letter-spacing: .3px; text-transform: uppercase; }
.slide-meta > span:first-child { color: #bac2cd; }
.slide-meta > span:last-child { color: #727c8a; font-size: 6px; text-align: right; }
.diss-slide h4 { font: 450 18px/1.5 var(--sans); color: #e3e7ed; letter-spacing: -.3px; margin: 10px 0 5px; }
.diss-slide figcaption > p { font-size: 11px; line-height: 1.8; color: #a0a8b4; max-width: 430px; }
.viewer-controls { border-top: 1px solid #282e36; padding: 13px 24px 14px; }
.viewer-controls[hidden] { display: none; }
.viewer-steps { display: grid; grid-template-columns: repeat(6, 1fr); gap: 8px; }
.viewer-step { appearance: none; border: 0; border-radius: 0; background: transparent; padding: 0 0 10px; color: #748090; font: 7px var(--mono); text-align: left; cursor: pointer; min-height: 28px; }
.viewer-step > i { display: block; height: 2px; background: #252c35; position: relative; overflow: hidden; margin-top: 7px; }
.viewer-step > i::after { content: ''; position: absolute; inset: 0; background: #cdd5df; transform: scaleX(0); transform-origin: left; }
.viewer-step[aria-current] { color: #e0e6ed; }
.viewer-step[aria-current] > i::after { transform: scaleX(1); }
.dissertation-viewer[data-running='true'] .viewer-step[aria-current] > i::after { animation: visual-progress var(--slide-duration) linear both; }
.viewer-step:hover { color: #f0f3f7; }
.viewer-buttons { display: flex; justify-content: space-between; align-items: center; margin-top: 4px; }
.viewer-buttons button { display: inline-flex; align-items: center; justify-content: center; cursor: pointer; border: 1px solid #353e4a; background: #10151b; color: #c2ccd8; border-radius: 3px; transition: border-color .2s, background .2s; }
.viewer-buttons button:hover { border-color: #77889b; background: #202a35; }
.viewer-buttons button:focus-visible, .viewer-step:focus-visible { outline: 1px solid #d1d7df; outline-offset: 3px; }
.viewer-toggle { padding: 6px 9px; gap: 6px; font: 8px var(--mono); height: 30px; }
.viewer-toggle svg { width: 10px; height: 10px; }
.viewer-toggle[aria-pressed='false'] { color: #9ba8b8; }
.viewer-arrows { display: flex; gap: 6px; }
.viewer-arrows button { width: 34px; height: 30px; padding: 6px; }
.viewer-arrows svg { width: 16px; height: 16px; }
.project { border-color: #372a45; background: linear-gradient(125deg, #1a1124, #0d0a12); }
.project .project-label { color: #a3aab5; }
.project .project-label > span { color: #606b79; }
.project .project-copy h3 { color: #e6e9ee; }
.project .project-copy > p:not(.eyebrow) { color: #a1a9b4; }
.project .tags > span { color: #b1bdcc; border-color: #323d4a; }
.project-copy { display: flex; flex-direction: column; justify-content: center; }
.visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
@keyframes visual-enter { from { opacity: 0; transform: translateY(5px); } to { opacity: 1; transform: none; } }
@keyframes visual-progress { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@media (max-width: 1000px) {
  .viewer-topline { padding-inline: 19px; font-size: 7px; letter-spacing: .5px; }
  .diss-slide { grid-template-rows: auto 175px; }
  .diss-slide figcaption { padding-inline: 20px; }
  .slide-meta { font-size: 6px; }
  .slide-meta > span:last-child { font-size: 5px; }
  .diss-slide h4 { font-size: 16px; }
  .viewer-controls { padding-inline: 20px; }
}
@media (max-width: 700px) {
  .dissertation-viewer { border-right: 0; border-bottom: 1px solid #282c32; }
  .viewer-topline { padding: 16px 20px 8px; font-size: 7px; }
  .diss-slide { grid-template-rows: auto 185px; }
  .diss-slide figcaption { padding: 6px 21px 17px; }
  .slide-meta { font-size: 6px; gap: 6px; }
  .slide-meta > span:last-child { font-size: 5px; }
  .diss-slide h4 { font-size: 17px; margin-top: 10px; }
  .diss-slide figcaption > p { font-size: 11px; }
  .viewer-controls { padding: 13px 20px 14px; }
  .viewer-step { min-height: 33px; }
  .viewer-toggle { height: 34px; }
  .viewer-arrows button { height: 34px; width: 38px; }
}
@media (prefers-reduced-motion: reduce) {
  .diss-slide:not([hidden]) { animation: none; }
  .dissertation-viewer[data-running='true'] .viewer-step[aria-current] > i::after { animation: none; }
}