:root { --sound-accent: #d6b66d; --sound-bright: #f3dda0; }
/* Scoped additions to the existing Han dossier. */
[hidden] { display: none !important; }
.dossier-header { gap: clamp(.7rem, 1.6vw, 2rem); }
.dossier-header nav { margin-left: auto; gap: clamp(.8rem, 1.6vw, 2rem); }
.dossier { height: auto; min-height: calc(100svh - var(--header-h)); }
.viewer { grid-template-rows: minmax(0, 1fr) auto auto auto; }
.viewer__stage { height: clamp(400px, calc(100svh - 320px), 1000px); align-self: stretch; }
.viewer .frame-stack { height: 100%; }
.angle-track { margin-bottom: .15rem; min-height: 36px; }
.angle-track button { width: 36px; height: 36px; border: 0; border-radius: 50%; background: transparent; }
.angle-track button::after { content: ''; position: absolute; left: 50%; top: 50%; width: 8px; height: 8px; transform: translate(-50%, -50%); border: 1px solid #c3b38c; border-radius: 50%; background: var(--ink); }
.angle-track button:hover, .angle-track button:focus-visible, .angle-track button[aria-current=true] { background: transparent; transform: none; }
.angle-track button[aria-current=true]::after, .angle-track button:hover::after { background: var(--sound-bright); border-color: var(--sound-bright); }
.angle-track button:focus-visible { outline: 1px solid var(--sound-bright); outline-offset: -3px; }

.sound-panel { position: relative; z-index: 20; width: min(100% - 2rem, 480px); margin: 0 auto .9rem; padding-top: .75rem; border-top: 1px solid var(--line); user-select: text; }
.sound-panel__actions { display: grid; grid-template-columns: 1fr 1.25fr; gap: .65rem; }
.sound-button { display: inline-flex; align-items: center; justify-content: center; gap: .55rem; min-height: 44px; padding: .65rem .75rem; color: #c6becf; background: rgba(21, 18, 29, .80); border: 1px solid #403929; border-radius: 3px; font: 500 .72rem/1.2 var(--sans); cursor: pointer; white-space: nowrap; transition: color 160ms ease, border-color 160ms ease, background 160ms ease; }
.sound-button:hover { border-color: #d6b66d; color: var(--paper); }
.sound-button[aria-pressed=true] { background: #241f16; border-color: #d6b66d; color: #f8ebcb; }
.sound-button--voice { color: var(--sound-bright); border-color: rgba(205,168,87,.5); }
.sound-button--voice[aria-pressed=true] { border-color: var(--sound-bright); color: var(--sound-bright); background: #211c15; }
.sound-button [data-voice-icon] { font-size: .60rem; }
.sound-button:disabled { opacity: .5; cursor: default; }
.header-harp { flex-shrink: 0; font-size: .66rem; min-height: 40px; background: transparent; padding-inline: .8rem; }
.harp-dot { width: 7px; height: 7px; border-radius: 50%; border: 1px solid #d6b66d; background: transparent; flex-shrink: 0; }
[aria-pressed=true] > .harp-dot { background: #f3dda0; box-shadow: 0 0 10px #d6b66d66; }
.voice-timeline { display: flex; align-items: center; gap: .7rem; margin-top: .55rem; }
.voice-timeline progress { display: block; appearance: none; width: 100%; height: 3px; border: none; background: #27222f; color: var(--sound-accent); accent-color: var(--sound-accent); }
.voice-timeline progress::-webkit-progress-bar { background: #27222f; }
.voice-timeline progress::-webkit-progress-value { background: var(--sound-accent); }
.voice-timeline progress::-moz-progress-bar { background: var(--sound-accent); }
.voice-timeline span { flex-shrink: 0; font: 400 .62rem var(--sans); font-variant-numeric: tabular-nums; color: #aaa1b5; }
.sound-panel__settings { display: flex; align-items: center; gap: .45rem; min-height: 40px; color: #aaa1b5; font: 400 .65rem var(--sans); }
.sound-panel__settings input { width: clamp(55px, 7vw, 85px); min-width: 0; height: 32px; accent-color: #d6b66d; cursor: pointer; }
.sound-panel__settings output { min-width: 3ch; font-variant-numeric: tabular-nums; }
.text-control { margin-left: auto; min-height: 40px; padding: .4rem 0 .4rem .6rem; background: transparent; border: 0; color: #f3dda0; font: inherit; cursor: pointer; text-decoration: underline; text-underline-offset: 4px; }
.sound-status { margin: 0; color: #c3b38c; font-size: .68rem; line-height: 1.45; }
.sound-status:empty { display: none; }
.sound-button:focus-visible, .text-control:focus-visible, .dialog-close:focus-visible, #han-volume:focus-visible { outline: 2px solid var(--sound-bright); outline-offset: 3px; }

.invocation-dialog { position: fixed; width: min(92vw, 540px); max-height: 88svh; padding: clamp(2rem, 6vw, 3.3rem); overflow-y: auto; border: 1px solid #403929; border-top: 2px solid var(--sound-accent); border-radius: 3px; color: var(--paper); background: radial-gradient(ellipse at top left, #241f16, transparent 75%), #0a090f; box-shadow: 0 25px 100px #000a; }
.invocation-dialog::backdrop { background: #030308da; backdrop-filter: blur(8px); }
.invocation-dialog .eyebrow { margin: .5rem 0 1rem; font-size: .65rem; line-height: 1.5; }
.invocation-dialog h2 { margin: 0 0 1.6rem; font: 500 clamp(1.8rem, 5vw, 2.5rem)/1.1 var(--serif); }
.dialog-close { position: absolute; top: .3rem; right: .3rem; width: 44px; height: 44px; border: 0; background: transparent; color: #c7bbd0; font-size: 1.7rem; cursor: pointer; }
.invocation-verse { font: 400 clamp(.94rem, 2.4vw, 1.08rem)/1.9 var(--serif); color: #f8ebcb; }
.invocation-verse p { margin: 0 0 1.3rem; }
.invocation-verse .invocation-unitas { margin: 1.5rem 0 0; font-size: 1.7rem; letter-spacing: .12em; color: var(--sound-bright); }

@media (max-width: 1100px) {
  .dossier-header nav { gap: .85rem; }
}
@media (max-width: 740px) {
  .dossier-header { gap: .7rem; }
  .brand strong { font-size: .77rem; letter-spacing: .08em; }
  .dossier-header nav { margin-left: auto; }
  .dossier-header nav a:not(:first-child) { display: none; }
  .header-harp { padding-inline: .6rem; font-size: .62rem; }
  .viewer { min-height: 0; grid-template-rows: auto auto auto auto; }
  .viewer__stage { height: max(360px, min(145vw, calc(100svh - 340px))); }
  .viewer .frame-stack { height: 100%; }
  .viewer__gesture { font-size: .6rem; }
  .viewer__controls { gap: .5rem; }
  .sound-panel { width: calc(100% - 2rem); margin-bottom: 1.4rem; }
  .sound-panel__settings input { width: 70px; }
}
@media (max-width: 360px) {
  .brand { gap: .4rem; }
  .brand strong { font-size: .69rem; }
  .header-harp { font-size: .6rem; padding-inline: .45rem; }
  .sound-panel__settings { flex-wrap: wrap; }
  .sound-panel__settings input { width: 52px; }
  .text-control { padding-left: .25rem; }
}

/* Keep the ambient switch reachable beside the full dossier navigation. */
.dossier-header .brand { flex-shrink: 0; }
.dossier-header nav { flex: 1 1 auto; min-width: 0; overflow-x: auto; scrollbar-width: thin; }
.dossier-header nav a { flex-shrink: 0; white-space: nowrap; }
.viewer .sound-button { min-height: 44px; }
.invocation-dialog { margin: auto; }
@media (max-width: 740px) {
  .dossier-header nav a:first-child { display: inline-block; }
}
@media (prefers-reduced-motion: reduce) {
  .sound-button { transition: none; }
}