/* Editorial instrument. Independent candidate; no content or interaction ownership. */
@property --ed-bg { syntax:"<color>"; inherits:true; initial-value:#f4f1e9; }
@property --ed-surface { syntax:"<color>"; inherits:true; initial-value:#fffdf8; }
@property --ed-raised { syntax:"<color>"; inherits:true; initial-value:#eae5da; }
@property --ed-ink { syntax:"<color>"; inherits:true; initial-value:#242823; }
@property --ed-muted { syntax:"<color>"; inherits:true; initial-value:#5e655d; }
@property --ed-line { syntax:"<color>"; inherits:true; initial-value:#c9c9bc; }
@property --ed-accent { syntax:"<color>"; inherits:true; initial-value:#94402e; }
@property --ed-on-accent { syntax:"<color>"; inherits:true; initial-value:#fff9ef; }
@property --ed-selected { syntax:"<color>"; inherits:true; initial-value:#ead8cc; }
@property --plane-sx { syntax:"<number>"; inherits:true; initial-value:1; }
@property --plane-sy { syntax:"<number>"; inherits:true; initial-value:1; }
@property --tr-setting-y { syntax:"<percentage>"; inherits:true; initial-value:50%; }
/* Stationary old/new views: only the soft reveal mask and opacity animate. */
html[data-theme-gradient]::view-transition-old(root) { animation:none; }
html[data-theme-gradient]::view-transition-new(root) {
  mix-blend-mode:normal;
  /* Swup Reveal gradient recipe, adapted to stationary theme snapshots:
     github.com/swup/demos/blob/main/reveal/transitions.css (MIT). */
  mask-image:linear-gradient(to left,transparent 33.33%,white 66.66%);
  mask-size:300% 100%;
  animation:theme-soft-reveal 450ms ease-in-out both;
}
@keyframes theme-soft-reveal {
  from { mask-position:100%; opacity:0; }
  to { mask-position:0%; opacity:1; }
}
html[data-theme-gradient][data-theme-reveal="day"]::view-transition-new(root) {
  mask-image:linear-gradient(to right,transparent 33.33%,white 66.66%);
  animation-name:theme-soft-reveal-reverse;
}
@keyframes theme-soft-reveal-reverse {
  from { mask-position:0%; opacity:0; }
  to { mask-position:100%; opacity:1; }
}
:root[data-theme-ready] {
  transition:--ed-bg 450ms ease-in-out,--ed-surface 450ms ease-in-out,--ed-raised 450ms ease-in-out,--ed-ink 450ms ease-in-out,--ed-muted 450ms ease-in-out,--ed-line 450ms ease-in-out,--ed-accent 450ms ease-in-out,--ed-on-accent 450ms ease-in-out,--ed-selected 450ms ease-in-out!important;
}
@media(prefers-reduced-motion:reduce) {
  :root[data-theme-ready] { transition:none!important; }
}
:root {
  --ed-bg:#f4f1e9; --ed-surface:#fffdf8; --ed-raised:#eae5da;
  --ed-ink:#242823; --ed-muted:#5e655d; --ed-line:#c9c9bc;
  --ed-accent:#94402e; --ed-on-accent:#fff9ef; --ed-selected:#ead8cc;
  --tr-ink:var(--ed-ink); --tr-sheet:var(--ed-surface); --tr-chrome:var(--ed-surface);
  --tr-fill:var(--ed-raised); --tr-hairline:var(--ed-line); --tr-tint:var(--ed-selected);
  --tr-btn-ink:var(--ed-ink); --tr-btn-ink-quiet:var(--ed-muted);
  --lq-solid:var(--ed-surface); --lq-tint-panel:var(--ed-surface);
  --lq-tint-field:var(--ed-surface); --lq-tint:var(--ed-surface);
  --lq-sheen:none; --lq-rim:0 0 0 1px var(--ed-line); --lq-shadow:none;
  --lq-r-pil:12px; --lq-r-rechthoek:12px;
  --electric:var(--ed-accent);
  color-scheme:light;
}
:root[data-theme="dark"] {
  --ed-bg:#191e1b; --ed-surface:#242c26; --ed-raised:#303a32;
  --ed-ink:#f1f0e4; --ed-muted:#b8c1b6; --ed-line:#505e51;
  --ed-accent:#e5a28b; --ed-on-accent:#251c17; --ed-selected:#493930;
  --tr-ink:var(--ed-ink); --tr-sheet:var(--ed-surface); --tr-chrome:var(--ed-surface);
  --tr-fill:var(--ed-raised); --tr-hairline:var(--ed-line); --tr-tint:var(--ed-selected);
  --tr-btn-ink:var(--ed-ink); --tr-btn-ink-quiet:var(--ed-muted);
  color-scheme:dark;
}
/* Named important layer deliberately outranks legacy unlayered !important material
   rules, including compact-player.css added after load. Tokens stay unlayered.
   https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/Values/important */
@layer titus-editorial {
html[data-global-navigation] { --global-navigation-height:61px; }
html[data-global-navigation] body { margin:0!important; min-height:100dvh; }
html[data-global-navigation] :is(.site-bar,.utilities,body>header.bar) { display:none!important; }
html[data-global-navigation="general"] .titus-room>.room-header { display:none!important; }
html[data-global-navigation="general"] body>.titus-player { display:none!important; }
html[data-global-navigation]:is([data-family="reading"],[data-family="watching"]) body>.titus-player { display:none!important; }
/* Reading/Watching do not own the legacy audio player's reserved space.
   Keep one full-height scroller regardless of whether an audio queue is saved. */
html[data-global-navigation]:is([data-family="reading"],[data-family="watching"]) { height:100%; overflow:hidden; }
html[data-global-navigation]:is([data-family="reading"],[data-family="watching"]) body {
  margin:0!important; padding:0!important; height:100dvh!important;
  display:block!important; overflow:hidden!important;
}
html[data-global-navigation]:is([data-family="reading"],[data-family="watching"]) body>.blad {
  box-sizing:border-box; height:100dvh!important; min-height:0!important;
  max-height:100dvh; overflow:auto!important; overscroll-behavior:contain;
  padding-top:var(--global-navigation-height)!important; padding-bottom:24px!important;
}
html[data-global-navigation]:is([data-family="reading"],[data-family="watching"]) .blad>.podcast-picker-nav {
  margin-block:0!important; border-radius:0!important;
}
html[data-global-navigation="general"] .titus-room>.room-transport { visibility:hidden!important; }
html[data-global-navigation="general"] .room-discover-pane { padding-top:var(--global-navigation-height)!important; }
html[data-global-navigation] .titus-room:not(.x-bars)>.room-stage { grid-row:2; }
html[data-global-navigation] .titus-room:not(.x-bars)>.room-transport { grid-row:3; }
html[data-global-navigation] .titus-room:not(.x-bars)>.room-matchbar { grid-row:4; }
html[data-global-navigation="general"][data-family="menu"] .garden { padding-top:calc(var(--global-navigation-height) + 24px)!important; }
.global-navigation {
  position:fixed; inset:0 0 auto; z-index:150;
  background:var(--ed-surface); color:var(--ed-ink); border-bottom:1px solid var(--ed-line);
  transform:translateY(0); transition:transform 420ms cubic-bezier(.4,0,.2,1);
}
.global-navigation[hidden],.global-navigation nav[hidden] { display:none!important; }
.global-navigation.is-away { transform:translateY(-100%); }
/* General navigation owns both upper layers; the old podcast room cannot
   independently leave the sticky filter strip behind. No layout-height changes. */
html[data-global-navigation="general"] .podcast-picker-nav {
  position:sticky!important; top:var(--global-navigation-height)!important;
  z-index:140!important; transform:translateY(0)!important; opacity:1!important;
  transition:transform 420ms cubic-bezier(.4,0,.2,1)!important;
}
html[data-global-navigation="general"] .titus-room .podcast-picker-nav { top:0!important; }
html[data-global-navigation]:is([data-family="reading"],[data-family="watching"]) .blad>.podcast-picker-nav { top:0!important; }
html[data-global-navigation="general"]:has(.global-navigation.is-away) .podcast-picker-nav {
  transform:translateY(calc(-100% - var(--global-navigation-height)))!important;
  pointer-events:none;
}
html[data-global-navigation="general"] #titus-paper-room > .room-matchbar { transform:translateY(0)!important; }
html[data-global-navigation="general"]:has(.global-navigation.is-away) #titus-paper-room > .room-matchbar { transform:translateY(calc(100% + var(--room-dock-h,58px)))!important; pointer-events:none; }
@media(prefers-reduced-motion:reduce){
  html[data-global-navigation="general"] .podcast-picker-nav { transition:none!important; }
}
.global-navigation-main,.global-navigation-content {
  display:grid; grid-template-columns:repeat(7,minmax(0,1fr));
  max-width:860px; min-height:60px; margin:auto; padding:2px 8px; gap:2px;
}
.global-navigation-content { grid-template-columns:repeat(6,minmax(0,1fr)); }
html[data-system][data-global-navigation] .global-navigation :is(a,button,summary) {
  display:flex!important; flex-direction:column; align-items:center; justify-content:center;
  min-width:0; min-height:52px; gap:3px; padding:3px 2px!important;
  background:transparent!important; color:var(--ed-ink)!important; border:0!important; box-shadow:none!important;
  text-decoration:none; font:500 11px/1.2 Arial,sans-serif!important; cursor:pointer;
}
.global-navigation svg { width:21px!important; height:21px!important; flex-shrink:0; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linejoin:round; stroke-linecap:round; }
/* All top-level controls share the same icon and label tracks, including
   dropdown summaries. Dropdown contents retain their own layout. */
html[data-system][data-global-navigation] .global-navigation :is(.global-navigation-main,.global-navigation-content) > :is(a,button),
html[data-system][data-global-navigation] .global-navigation :is(.global-navigation-main,.global-navigation-content) > details > summary {
  display:grid!important; grid-template-rows:21px 13.2px; justify-items:center;
  align-content:center; align-items:center; row-gap:3px; height:56px; box-sizing:border-box;
}
html[data-system][data-global-navigation] .global-navigation :is(.global-navigation-main,.global-navigation-content) > details { min-width:0; }
html[data-system][data-global-navigation] .global-navigation :is(.theme-toggle,button#theme,button#media-theme,[data-paper-theme],.room-theme)::after {
  top:calc(50% - 8.1px)!important;
}
.global-navigation summary { list-style:none; }
.global-navigation .civilizations-label { white-space:nowrap; text-align:center; font-size:inherit; }
/* Vergrootglas rechts van Menu: alleen het pictogram, subtiel, raakvlak minstens 44 px. */
html[data-system][data-global-navigation] .global-navigation .global-navigation-main > .global-search {
  grid-template-rows:1fr!important; min-width:44px; min-height:44px; color:var(--ed-muted)!important;
}
html[data-system][data-global-navigation] .global-navigation .global-navigation-main > .global-search svg { width:20px!important; height:20px!important; stroke-width:1.6; }
html[data-system][data-global-navigation] .global-navigation .global-navigation-main > .global-search:is(:hover,:focus-visible) { color:var(--ed-ink)!important; }
/* All content (voorheen Themes), R9 K: geen kale Alpha/Beta-kolommen; alle themachips lopen in één rij door. Rome en Greece gebruiken dezelfde regels. */
html[data-system] .ifl-k { display:none!important; }
html[data-system] .ifl-cols { display:grid!important; grid-template-columns:repeat(auto-fill,minmax(min(100%,232px),1fr))!important; gap:10px!important; }
html[data-system] .ifl-cols > div { display:contents!important; }
html[data-system] .ifl-cols .ifl-b { justify-content:space-between; align-items:center; margin:0; }
html[data-system] .ifl-h1 { max-width:22ch; margin-inline:auto; text-wrap:balance; }
/* Labels keep their full names and use proportional type, not tiny abbreviations. */
.historical-figure-filter { margin:76px auto 24px; padding:16px; width:min(100% - 32px,860px); box-sizing:border-box; }
.kies>.historical-figure-filter { margin:16px auto 24px; }
.historical-figure-filter label { display:block; margin-bottom:8px; font-weight:600; }
.historical-figure-filter select { max-width:100%; min-height:44px; padding:8px; color:var(--ed-ink); background:var(--ed-surface); border:1px solid var(--ed-line); font:inherit; }
.historical-figure-filter nav { display:flex; flex-wrap:wrap; gap:8px; }
html[data-system] :is(.historical-figure-filter .tr-btn,.kies .chip,.kies .fmt,.picker-format-group button) {
  min-height:44px; padding:10px 14px!important; white-space:normal; overflow-wrap:break-word;
  box-sizing:border-box; line-height:1.35;
}
html[data-system] :is(.pcard,.eracard,.startbox,.bk) { box-sizing:border-box; padding:18px 20px; }
[data-figure-hidden] { display:none!important; }
html[data-system] .bk.has-book-cover { display:grid!important; grid-template-columns:90px minmax(0,1fr); gap:10px 18px; padding:20px!important; }
html[data-system] .bk.has-book-cover>:not(.media-card-art) { grid-column:2; min-width:0; margin:0; }
html[data-system] .media-card-art { display:block; position:relative; min-width:0; overflow:hidden; color:var(--ed-muted); background:var(--ed-raised); border-radius:4px; }
html[data-system] .media-book-cover { grid-column:1; grid-row:1 / span 5; align-self:start; width:90px; aspect-ratio:2 / 3; }
html[data-system] .media-card-art img { display:block!important; position:relative!important; width:100%!important; height:100%!important; object-fit:contain!important; border-radius:0!important; }
html[data-system] .media-art-fallback { position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px; padding:6px; text-align:center; font:11px/1.3 "Source Serif 4",serif; }
html[data-system] .media-art-fallback svg { width:18px; height:18px; flex:none; fill:none; stroke:currentColor; stroke-width:1.4; }
html[data-system] .media-art-fallback[hidden] { display:none!important; }
html[data-system] .item.has-media-art>summary { position:relative; display:grid!important; grid-template-columns:112px minmax(0,1fr)!important; grid-template-areas:"art duration" "art title" "art tags"!important; gap:8px 16px; padding:18px!important; }
html[data-system] .media-video-image { grid-area:art!important; width:112px; aspect-ratio:16 / 9; align-self:start; }
html[data-system] .item.has-media-art>summary>.dur { grid-area:duration!important; }
html[data-system] .item.has-media-art>summary>.it { grid-area:title!important; min-width:0; width:auto!important; }
html[data-system] .item.has-media-art>summary>.tags { grid-area:tags!important; min-width:0; }
html[data-system] .item.has-media-art>summary::after { position:absolute; right:10px; top:10px; grid-area:auto!important; }
html[data-system] .item.has-media-art>:not(summary) { margin:12px 16px!important; }
html[data-system] .page-watch #all-episodes .group { padding:0!important; background:none!important; border:0!important; }
.book-cover-credit { padding:16px 20px; font-size:12px; }
html[data-system][data-family] .bk h3 button[data-content-select] { display:block!important; width:100%; padding:0!important; background:none!important; border:0!important; box-shadow:none!important; text-align:center; white-space:normal; font:inherit!important; }
@media(max-width:420px){
  html[data-system] .page-books .book-group { padding:0!important; background:none!important; border:0!important; }
  html[data-system] .bk.has-book-cover .bk-v { font-size:16px!important; line-height:1.5; }
  html[data-system] .bk.has-book-cover { grid-template-columns:70px minmax(0,1fr); gap:10px 14px; padding:16px!important; }
  html[data-system] .media-book-cover { width:70px; }
  html[data-system] .item.has-media-art>summary { grid-template-columns:84px minmax(0,1fr)!important; gap:8px 12px; padding:16px!important; }
  html[data-system] .media-video-image { width:84px; }
}
.global-navigation summary::-webkit-details-marker { display:none; }
html[data-system][data-global-navigation] .global-navigation :is([aria-current="page"],[aria-current="true"]) { color:var(--ed-accent)!important; }
@media(max-width:420px){.global-navigation-main,.global-navigation-content { gap:0; padding-inline:6px; }}
@media(max-width:420px) {
  .global-navigation [data-short] { font-size:0; }
  .global-navigation [data-short]::after { content:attr(data-short); font:600 9px/1.2 "Geist Mono",monospace; }
}
.global-navigation details>nav {
  position:absolute; top:100%; right:12px; display:grid; min-width:180px;
  max-height:70svh; overflow:auto; padding:8px; border:1px solid var(--ed-line); border-radius:12px;
  background:var(--ed-surface); box-shadow:0 8px 24px #0002;
}
.global-navigation details:not([open])>nav { display:none; }
.global-navigation details>nav a { flex-direction:row; justify-content:flex-start; padding:8px 12px!important; font-size:12px!important; gap:10px; }
html [data-content-select] { font:inherit!important; color:inherit!important; background:none!important; border:0!important; padding:0!important; text-align:inherit; cursor:pointer; }
html :is(.bk,.item,.pick,.pcard) { scroll-margin-top:80px; }
@media(prefers-reduced-motion:reduce){.global-navigation { transition:none!important; }}
/* A theme snapshot must contain the final palette and final artwork.
   This important layer also outranks the home image/color transitions. */
html[data-theme-gradient][data-theme-ready],
:root[data-theme-gradient][data-family] :is(body,body *,body *::before,body *::after) {
  transition:none!important;
}
/* Descendants consume the same interpolated palette instead of chasing
   an inherited intermediate color with a second transition. */
html[data-theme-changing] :is(body,body *,body *::before,body *::after) {
  transition-property:transform,translate,scale,opacity!important;
  text-shadow:none!important;
}
html[data-setting] body {
  background:var(--ed-bg)!important; color:var(--ed-ink)!important;
  --preview-world:none!important; --tr-world:none!important;
  --paper-scene:none!important; --scene:none!important;
}
html { scroll-padding-block:100px 120px; }
body { text-rendering:optimizeLegibility; }
h1,h2,h3 { text-wrap:balance; text-shadow:none!important; }
p { text-wrap:pretty; }
html[data-system][data-cta-surface] :is(.tr-btn,.tr-field) {
  color:var(--ed-ink)!important; background:var(--ed-surface)!important;
  border:1px solid var(--ed-line)!important; border-radius:12px!important;
  box-shadow:none!important; filter:none!important; backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important; text-shadow:none!important;
  transition:background-color 160ms ease,border-color 160ms ease,box-shadow 160ms ease;
}
/* Text controls have a shared inset. Icon-only, navigation, wheel rows and
   title-as-link controls intentionally keep their specialised geometry. */
html[data-system][data-cta-surface] .tr-btn:not([data-variant="icon"]):not([data-variant="wheel"]):not([data-content-select]):not(.picker-wheel-option):not(.titus-queue-track):not(.global-navigation *):not(.room-dock *):not(.utilities *):not(.site-bar *):not([data-player-control]):not([data-paper-theme]):not(.theme-toggle):not(.room-theme) {
  box-sizing:border-box; min-height:44px; max-width:100%; height:auto!important;
  padding:10px 16px!important; line-height:1.35; white-space:normal; overflow-wrap:break-word;
}
html[data-system] :is(.podcast-wall-foot button,.episode-jump,.episode-more,.episode-retry,.episode-results-actions>button) {
  box-sizing:border-box; min-height:44px; max-width:100%; padding:12px 18px!important;
  line-height:1.35; white-space:normal; overflow-wrap:break-word;
}
html[data-system] .podcast-wall-foot { display:flex!important; flex-direction:column; align-items:stretch!important; padding:16px!important; gap:12px; }
html[data-system] .podcast-wall-foot>p { width:100%!important; max-width:none!important; margin:0!important; }
html[data-system] .podcast-wall-foot button { width:100%!important; }
html[data-system][data-cta-surface] .tr-btn::before,
html[data-system][data-cta-surface] .tr-btn::after { display:none!important; }
html .tr-btn { overflow:hidden; min-height:44px; }
html .tr-btn:is(:hover,:focus-visible) { background:var(--ed-raised)!important; border-color:var(--ed-ink)!important; }
html :is(a,button,input,summary,select,textarea):focus-visible {
  outline:3px solid var(--ed-accent)!important; outline-offset:4px;
}
html .tr-btn:is([aria-pressed="true"],[aria-selected="true"],.is-selected,.active),
html .tr-btn[data-variant="primary"] {
  background:var(--ed-accent)!important; color:var(--ed-on-accent)!important;
  border-color:var(--ed-accent)!important;
}
html :is(.room-dock,.utilities,.room-header,.room-matchbar,.site-bar,body>header.bar,.titus-player[data-paper-compact]),
html #titus-paper-room .room-transport {
  background:var(--ed-surface)!important; color:var(--ed-ink)!important;
  border-block:1px solid var(--ed-line)!important; box-shadow:none!important;
  backdrop-filter:none!important; -webkit-backdrop-filter:none!important;
}
html :is(.room-dock,.utilities,.room-header,.room-matchbar,.site-bar,body>header.bar,.titus-player[data-paper-compact])::before,
html #titus-paper-room .room-transport::before { display:none!important; }
html :is(.section-menu nav,.site-menu-panel,.room-next-choice,.titus-menu,.titus-library) {
  background:var(--ed-surface)!important; color:var(--ed-ink)!important;
  border:1px solid var(--ed-line)!important; border-radius:16px!important;
  backdrop-filter:none!important; -webkit-backdrop-filter:none!important;
  box-shadow:0 18px 55px -22px #17201b55!important;
}
html :is(.blad,body>.wrap,main.wrap,footer.wrap,.harbor-rest,.kies,.room-options-panel,.room-listen-scroll>ol) {
  background:var(--ed-surface)!important; color:var(--ed-ink)!important;
  border-radius:16px!important; box-shadow:none!important;
}
html :is(.blad,.wrap) :is(.kies,.room-options-panel) { background:transparent!important; }
html :is(a.pcard,a.pick,article.pick,article.bk,article.person,details.item,div.group,.harbor-rest .maker,.ifl-cols>div,.picker-wheel-shell,.podcast-wall,.room-listen-scroll li,.room-balloon) {
  background:var(--ed-raised)!important; color:var(--ed-ink)!important;
  border:1px solid var(--ed-line)!important; border-radius:12px!important; box-shadow:none!important;
}
html .picker-wheel-band { background:var(--ed-selected)!important; box-shadow:none!important; border-block:1px solid var(--ed-line)!important; }
html :is(.setting,.world) { opacity:.13!important; filter:grayscale(1)!important; pointer-events:none; }
html #titus-spatial-setting { display:none!important; }
html[data-theme][data-system] body::before { background:none!important; }
html[data-theme][data-system] #titus-paper-room :is(.room-stage,.room-discover-pane,.room-listen-pane) {
  background:var(--ed-bg)!important;
}
html[data-theme][data-system] #titus-paper-room .picker-wheel-shell {
  background:var(--ed-surface)!important; border:1px solid var(--ed-line)!important;
}
html[data-theme][data-system] #titus-paper-room .room-options-panel {
  background:var(--ed-surface)!important; color:var(--ed-ink)!important;
  border-inline-start:1px solid var(--ed-line)!important;
}
html[data-system][data-cta-surface] .room-dock .tr-btn[data-variant="tab"] {
  background:transparent!important; border-color:transparent!important; border-radius:10px!important;
}
html[data-system][data-cta-surface] .room-dock .tr-btn[aria-current="page"],
html[data-system][data-cta-surface] .room-dock .tr-btn[aria-expanded="true"] {
  background:var(--ed-selected)!important; color:var(--ed-ink)!important;
  border-color:var(--ed-line)!important;
}
html[data-system][data-cta-surface] .tr-btn:disabled {
  opacity:.48; cursor:not-allowed;
}
html[data-system][data-cta-surface] .titus-queue-track {
  background:transparent!important; border:0!important; border-radius:0!important;
  text-align:start!important; box-shadow:none!important;
}
html[data-system] :is(.utilities,.room-dock,.site-bar) a { color:var(--ed-muted)!important; }
html[data-system] :is(.utilities,.room-dock,.site-bar) a[aria-current="page"] {
  color:var(--ed-accent)!important; border-color:var(--ed-accent)!important;
}
html[data-system] input[type="range"] { accent-color:var(--ed-accent)!important; }
html[data-system] .titus-player[data-paper-compact] :is(.titus-now,.titus-title,.titus-show) {
  color:var(--ed-ink)!important; text-shadow:none!important;
}
html[data-system] .titus-player[data-paper-compact] .titus-show { color:var(--ed-muted)!important; }
html[data-system] :is(.utilities,.room-dock,.site-bar) a[aria-current="page"]::after {
  background:var(--ed-accent)!important; border-color:var(--ed-accent)!important;
}
html[data-system] :is(.where,.dekrij) a {
  display:inline-flex; align-items:center; justify-content:center;
  min-height:44px; padding:8px 14px;
  background:var(--ed-surface)!important; color:var(--ed-ink)!important;
  border:1px solid var(--ed-line)!important; border-radius:12px!important;
  box-shadow:none!important; text-shadow:none!important; text-decoration:none;
  backdrop-filter:none!important; -webkit-backdrop-filter:none!important;
}
html[data-system] :is(.where,.dekrij) a:is(:hover,:focus-visible) {
  background:var(--ed-raised)!important; border-color:var(--ed-ink)!important;
}
html[data-system][data-cta-surface] :is(.tr-btn,.tr-field) { font-kerning:normal; }
html[data-system] :is(.prose,.verdict,.blurb,.note,.about-show) {
  max-width:65ch; line-height:1.65;
}
html[data-system] :is(.wrap,.blad) > :is(.mast,.route-head) {
  padding-block:clamp(2rem,5vw,4.5rem); border-bottom:1px solid var(--ed-line)!important;
}
html[data-system] :is(.wrap,.blad) h1 {
  font-size:clamp(2.2rem,5vw,4.2rem); line-height:1.08; letter-spacing:-.035em;
}
html[data-system] .titus-room { background:var(--ed-bg)!important; }
html[data-system] .podcast-picker-nav { background:var(--ed-bg)!important; border-bottom:1px solid var(--ed-line)!important; }
/* The picker already settles the nearest row on its measured selection band.
   A second CSS snap aimed at the viewport centre fights that native smooth
   scroll, producing a hard second jump. Leave touch/trackpad inertia native. */
html[data-system] .picker-wheel { scroll-snap-type:none!important; -webkit-overflow-scrolling:touch; }
html[data-system] .picker-wheel-shell { background:var(--ed-surface)!important; }
html[data-system] .picker-wheel-shell .tr-btn:not([aria-pressed="true"]) { background:transparent!important; border-color:transparent!important; }
html[data-system] .picker-wheel-shell .tr-btn[aria-pressed="true"] { background:var(--ed-selected)!important; color:var(--ed-ink)!important; }
html :is(.identity,.journey,.decision) { color:var(--ed-ink)!important; text-shadow:none!important; }
html .identity .brand { font-size:clamp(2.5rem,6vw,5rem); letter-spacing:-.045em; }
html .identity .slogan { color:var(--ed-muted); }
html :is(.media,.choices) .tr-btn {
  padding:1.25rem 1.5rem!important; min-height:88px;
  background:var(--ed-surface)!important; border-color:var(--ed-line)!important;
}
html :is(.media,.choices) .tr-btn:hover { background:var(--ed-selected)!important; }
html :is(.media,.choices) .tr-btn__label { font-weight:500; letter-spacing:-.025em; }
html .media .symbol { stroke-width:1.5; }
/* Media choice is a document flow, not two independently positioned overlays. */
html[data-family="menu"] { height:auto!important; overflow:auto!important; }
html[data-family="menu"] body { height:auto!important; overflow:visible!important; }
html[data-family="menu"] .garden {
  height:auto!important; max-height:none!important; min-height:100svh;
  overflow:visible!important; padding:90px 0 calc(32px + var(--player-reserve,0px));
}
html[data-family="menu"] .identity { position:static!important; padding:0 24px!important; }
/* Present the existing garden painting as the same inset arch as Harbor,
   rather than a faint full-screen backdrop behind the menu. */
html[data-family="menu"] .garden {
  display:grid!important;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  grid-template-rows:auto auto;
  align-content:center;
  align-items:center;
  column-gap:clamp(2rem,5vw,6rem);
  max-width:1440px;
  margin:auto;
  padding:5rem clamp(1.5rem,5vw,5rem) calc(2rem + var(--player-reserve,0px))!important;
}
html[data-family="menu"] .identity { grid-column:1; grid-row:1; }
html[data-family="menu"] .decision { grid-column:1; grid-row:2; }
html[data-family="menu"] .garden > .setting {
  position:relative!important; inset:auto!important;
  grid-column:2; grid-row:1 / 3;
  width:100%!important; height:min(74svh,760px)!important; min-height:460px;
  object-fit:cover; object-position:center; transform:none!important;
  border-radius:240px 240px 14px 14px;
  opacity:1!important; filter:none!important; mask-image:none!important;
  border:0!important; box-shadow:none!important;
}
@media(max-width:900px) {
  html[data-family="menu"] .garden {
    grid-template-columns:minmax(0,1fr); gap:0;
    padding:5rem 1.5rem calc(2rem + var(--player-reserve,0px))!important;
  }
  html[data-family="menu"] .garden > .setting {
    grid-column:1; grid-row:3; margin:2rem auto 0;
    min-width:0!important; min-height:0; height:240px!important;
    max-width:560px; border-radius:120px 120px 12px 12px;
  }
}
html[data-family="menu"] .decision {
  position:static!important; transform:none!important; width:min(430px,calc(100% - 48px))!important;
  max-width:none!important; margin:32px auto 0!important;
}
html[data-family="menu"] :is(.garden,.decision)::before { display:none!important; }
html[data-family="menu"] .media { grid-template-columns:1fr!important; }
html[data-family="menu"] .media .tr-btn {
  width:100%!important; max-width:100%!important; min-width:0!important; box-sizing:border-box!important;
  background:rgb(180 85 58 / .13)!important; border:0!important; box-shadow:none!important;
  color:var(--ed-ink)!important; height:auto!important; min-height:80px;
  grid-template-columns:42px minmax(0,1fr) 42px!important;
}
html[data-family="menu"][data-civ="greece"] .media .tr-btn { background:rgb(93 134 154 / .14)!important; }
html[data-family="menu"] .media .tr-btn:hover { background:rgb(180 85 58 / .21)!important; }
html[data-family="menu"][data-civ="greece"] .media .tr-btn:hover { background:rgb(93 134 154 / .22)!important; }
html[data-family="menu"] .media .direction { display:block!important; transform:rotate(90deg); }
html[data-family="menu"] .utilities { flex-wrap:nowrap; padding:6px 8px!important; gap:4px!important; }
html[data-family="menu"] .utilities :is(a,button,summary) {
  display:flex!important; align-items:center; justify-content:center; min-width:0; min-height:44px;
  padding:8px 6px!important; font:clamp(12px,2.7vw,16px) 'Source Serif 4',serif;
  text-decoration:none; color:var(--ed-ink)!important;
}
html[data-family="menu"] .utilities .section-menu { margin-left:auto; }
html[data-family="menu"] .utilities .back svg { display:none; }
html[data-family="menu"] .utilities #media-theme { margin-left:0; }
html[data-family="menu"] .utilities #player-toggle { display:none!important; }
html[data-family="menu"] .utilities.room-modes {
  display:grid!important; grid-template-columns:repeat(5,minmax(0,1fr)) 52px!important;
  padding:2px max(8px,calc((100% - 760px)/2))!important; gap:0!important;
}
html[data-family="menu"] .utilities.room-modes :is(a,button,summary) {
  min-height:52px!important; flex-direction:column; justify-content:center;
  font:600 9px/1.1 "Geist Mono",monospace!important; gap:2px!important;
}
html[data-family="menu"] .utilities.room-modes .section-menu { margin:0; }
html[data-family="menu"] .media-shared-header {
  position:fixed; inset:0 0 auto; z-index:100; width:100%;
}
html[data-family="menu"] .media-shared-header .room-dock { position:relative; }
html[data-family="menu"] .media-shared-header > .section-menu > summary { display:none!important; }
html[data-family="menu"] .media-shared-header .room-dock svg { width:21px!important; height:21px!important; flex-shrink:0; }
html[data-family="menu"] .media-shared-header .room-dock strong[hidden] { display:none!important; }
html[data-family="menu"] .media-shared-header .room-harbour { font:600 10px/1.1 "Geist Mono",monospace; }
html[data-family="menu"] .room-landing .room-discover-pane > :not(.garden) { display:none!important; }
html[data-family="menu"] .room-landing .room-discover-pane > .garden { width:100%; }
html[data-family="menu"] .room-landing .room-discover-pane { padding-inline:0!important; }
html[data-family="menu"] .room-landing .room-matchbar { display:none!important; }
html[data-family="menu"] .room-landing .room-dock svg { width:21px!important; height:21px!important; }
html[data-family="menu"] .room-landing .room-dock strong[hidden] { display:none!important; }
html[data-family="menu"] .room-landing .room-options > summary { display:none!important; }
html .titus-room .room-options > summary { display:none!important; }
html .titus-room[data-mode="discover"] > .room-transport:not(:has(.is-playing)) {
  visibility:hidden; pointer-events:none; box-shadow:none!important;
}
html[data-player-landing="true"]:not([data-landing-revealed]) .titus-room > .room-header {
  transform:translateY(-100%)!important;
  pointer-events:none;
}
html[data-player-landing="true"] .room-landing > .room-header {
  position:absolute!important; top:0; left:0; right:0;
  transition:transform var(--balk-duur,240ms) var(--balk-curve,cubic-bezier(.2,0,0,1))!important;
}
html[data-player-landing="true"] .room-landing { grid-template-rows:minmax(0,1fr)!important; }
html[data-player-landing="true"] .room-landing > .room-stage { grid-row:1; }
html[data-player-landing="true"] .room-landing .room-discover-pane { padding-top:0!important; }
html[data-player-landing="true"] body > :is(header.bar,.blad)[hidden] { display:none!important; }
/* Shared room chrome: slide as solid surfaces, never fade while travelling. */
html .titus-room.x-bars {
  --balk-duur:420ms!important;
  --balk-curve:cubic-bezier(.4,0,.2,1)!important;
}
html .titus-room.x-bars.bars-hidden { --balk-duur:420ms!important; --balk-curve:cubic-bezier(.4,0,.2,1)!important; }
html .titus-room.x-bars > :is(.room-header,.room-matchbar,.room-transport) {
  transition:transform var(--balk-duur) var(--balk-curve)!important;
}
html .titus-room.x-bars > :is(.room-matchbar,.room-transport) { opacity:1!important; }
html #titus-paper-room .room-matchbar {
  display:grid!important; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:10px;
  padding:10px max(12px,calc((100% - 760px)/2));
}
html #titus-paper-room .room-matchbar[hidden],
html #titus-paper-room.room-landing .room-matchbar { display:none!important; }
html #titus-paper-room[data-results-open="true"] .room-view-matches { display:none!important; }
html #titus-paper-room[data-results-open="true"] .room-matchbar { grid-template-columns:minmax(0,1fr); }
html #titus-paper-room[data-results-open="true"] .room-add-matches { background:var(--ed-accent)!important; color:var(--ed-on-accent)!important; }
html[data-system] .episode-links { display:flex; flex-wrap:wrap; gap:10px; margin-top:14px; }
html[data-system] .episode-links>button { min-height:44px; padding:10px 14px!important; line-height:1.35; white-space:normal; box-sizing:border-box; }
html #titus-paper-room .room-playlist-limit { display:none; grid-column:1 / -1; margin:0; padding:0 4px 2px; color:var(--ed-muted); font:12px/1.4 "Source Serif 4",serif; text-align:center; }
html #titus-paper-room[data-results-open="true"] .room-playlist-limit { display:block; }
html #titus-paper-room .room-matchbar > button {
  display:flex; align-items:center; justify-content:center; gap:8px;
  min-height:52px; border-radius:8px; padding:10px 12px;
  font:600 13px/1.3 "Source Serif 4",serif;
  background:var(--ed-raised)!important; color:var(--ed-ink)!important;
  border:1px solid var(--ed-line)!important;
}
html #titus-paper-room .room-matchbar > button > svg { width:20px!important; height:20px!important; flex:0 0 20px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; }
html #titus-paper-room .room-matchbar > .room-view-matches { background:var(--ed-accent)!important; color:var(--ed-on-accent)!important; }
html #titus-paper-room .room-matchbar strong { font:inherit; }
html #titus-paper-room .room-result-count { font:500 10px/1.2 "Geist Mono",monospace; padding:3px 5px; border-radius:4px; background:rgb(255 255 255 / .12); }
html .room-view-matches > span { display:none; }
@media(prefers-reduced-motion:reduce) {
  html .titus-room.x-bars > :is(.room-header,.room-matchbar,.room-transport) { transition:none!important; }
}
/* Theme control: drawn celestial ink, not font/emoji glyphs. */
html :is(.theme-toggle,button#theme,button#media-theme,[data-paper-theme],.room-theme) {
  font-size:0!important; position:relative!important; overflow:visible!important;
  background:transparent!important; border:0!important; box-shadow:none!important;
  display:grid!important; place-items:center!important;
  padding:0!important; min-width:44px; min-height:44px;
}
html :is(.theme-toggle,button#theme,button#media-theme,[data-paper-theme],.room-theme)::before { display:none!important; }
html[data-family="home"] :is(#theme,.theme-toggle) {
  position:fixed!important; top:16px!important; right:16px!important;
  left:auto!important; bottom:auto!important; z-index:100;
}
html[data-family="menu"] .garden > .identity { display:none!important; }
html[data-family="menu"] .garden > .decision { grid-row:1; margin-top:0!important; }
html[data-family="menu"] .garden > .setting { grid-row:1; }
@media(max-width:900px) {
  html[data-family="menu"] .garden > .setting { grid-row:2; }
  html[data-family="menu"] .garden { padding-top:1.5rem!important; align-content:start; }
}
html :is(.theme-toggle,button#theme,button#media-theme,[data-paper-theme],.room-theme):is(:hover,:active,:focus) {
  background:transparent!important; border:0!important; box-shadow:none!important;
}
html :is(.theme-toggle,button#theme,button#media-theme,[data-paper-theme],.room-theme)::after {
  content:""!important; display:block!important;
  position:absolute!important; width:14px!important; height:14px!important; left:50%!important; top:50%!important;
  margin:0!important; transform:translate(-50%,-50%)!important;
  border:0!important; border-radius:50%;
  background:linear-gradient(100deg,#aabccc 15%,#f4eee0 48%,#aabccc 80%);
  background-size:260% 100%;
  mask-image:radial-gradient(circle at 72% 27%,transparent 0 42%,#000 45%);
  -webkit-mask-image:radial-gradient(circle at 72% 27%,transparent 0 42%,#000 45%);
  filter:drop-shadow(0 0 3px #b8c8dc70);
  animation:theme-orb-glimmer 4.8s ease-in-out infinite alternate;
  pointer-events:none;
}
html[data-theme="dark"] :is(.theme-toggle,button#theme,button#media-theme,[data-paper-theme],.room-theme)::after {
  background-image:linear-gradient(100deg,#ccaa70 15%,#fff0bb 48%,#ccaa70 80%);
  mask-image:none; -webkit-mask-image:none;
  filter:drop-shadow(0 0 4px #e1bd6d80);
}
@keyframes theme-orb-glimmer {
  from { background-position:0% 50%; opacity:.8; }
  to { background-position:100% 50%; opacity:1; }
}
@media(prefers-reduced-motion:reduce) {
  html :is(.theme-toggle,button#theme,button#media-theme,[data-paper-theme],.room-theme)::after { animation:none; }
}
html[data-family="menu"] .media-shared-header > .section-menu nav {
  top:58px; bottom:auto; left:auto; right:12px;
}
/* The harbour becomes a separate editorial illustration, never a text backdrop. */
html[data-family="home"] .harbor {
  display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  align-items:center; gap:clamp(2rem,5vw,6rem); max-width:1440px;
  min-height:100svh; padding:5rem clamp(1.5rem,5vw,5rem); margin:auto;
}
html[data-family="home"] .world {
  position:relative!important; inset:auto!important; z-index:0!important; order:2;
  width:100%; height:min(74svh,760px); min-height:460px;
  border-radius:240px 240px 14px 14px; overflow:hidden;
  opacity:1!important; filter:none!important; border:0!important;
}
html[data-family="home"] .world img {
  position:absolute!important; inset:0!important; height:100%!important; width:100%!important;
  object-fit:cover; object-position:center; transform:none!important; mask-image:none!important;
}
html[data-family="home"] .world .world-day { opacity:1!important; }
html[data-family="home"] .world::after {
  content:""; display:block!important; position:absolute; inset:0; z-index:2;
  pointer-events:none; border-radius:inherit;
  background-image:var(--g-paint),var(--g-paint-alt);
  background-size:var(--grain-tile-size); background-repeat:repeat;
  animation:button-grain-jitter 5.333333s steps(1,end) infinite; opacity:1;
}
html[data-family] body { isolation:isolate; }
html[data-family] body::after {
  content:""; display:block!important; position:fixed; inset:0; z-index:-1;
  pointer-events:none; opacity:.5;
  background-image:var(--g-btn),var(--g-btn-alt);
  background-size:var(--grain-tile-size); background-repeat:repeat;
  animation:button-grain-jitter 5.333333s steps(1,end) infinite;
}
html[data-family]:not([data-family="home"]) :is(.blad,.room-stage,.room-discover-pane,.room-listen-pane,.room-listen-scroll>ol) {
  background-image:var(--g-bg),var(--g-bg-alt)!important;
  background-size:var(--grain-tile-size)!important; background-repeat:repeat!important;
  animation:button-grain-jitter 5.333333s steps(1,end) infinite;
}
/* Same two Harbour textures and timing; ink remains outside the texture layers. */
html[data-family]:not([data-family="home"]) :is(.tr-btn:not([data-content-select]):not(.global-search),button:not(.global-theme):not([data-paper-theme]):not([data-content-select]):not(.global-search)) {
  background-image:var(--g-btn),var(--g-btn-alt)!important;
  background-size:var(--grain-tile-size)!important;
  background-repeat:repeat!important;
  animation:button-grain-jitter 5.333333s steps(1,end) infinite;
}
html[data-family="menu"] .shared-painting-grain {
  grid-column:2; grid-row:1; align-self:center; justify-self:center;
  width:100%; height:min(74svh,760px); min-height:460px;
  border-radius:240px 240px 14px 14px; pointer-events:none; z-index:1;
  background-image:var(--g-paint),var(--g-paint-alt);
  background-size:var(--grain-tile-size);
  animation:button-grain-jitter 5.333333s steps(1,end) infinite;
}
@media(max-width:900px){
  html[data-family="menu"] .shared-painting-grain {
    grid-column:1; grid-row:2; height:240px; min-height:0; max-width:560px;
    margin:2rem auto 0; border-radius:120px 120px 12px 12px;
  }
}
@media(prefers-reduced-motion:reduce) {
  html[data-family="home"] .world::after,
  html[data-family] body::after,
  html[data-family] .shared-painting-grain,
  html[data-family] :is(.blad,.room-stage,.room-discover-pane,.room-listen-pane,.room-listen-scroll>ol),
  html[data-family]:not([data-family="home"]) :is(.tr-btn,button) { animation:none; }
}
html[data-family="home"] .world .world-night { opacity:0!important; }
html[data-family="home"][data-theme="dark"] .world .world-night { opacity:1!important; }
html[data-family="home"] .world img { transition:opacity 450ms ease-in-out!important; }
html[data-family="home"] :is(body,.theme-toggle) {
  transition:background-color 450ms ease-in-out,color 450ms ease-in-out,border-color 450ms ease-in-out!important;
}
html[data-family="home"] :is(.journey,.mast,.destinations,.journey h1,.journey h2,.slogan,.description) {
  color:inherit!important; transition:none!important;
}
html[data-family="home"] .tagline { transition:color 450ms ease-in-out!important; }
html[data-family="home"] .choices .tr-btn[data-sheet] {
  transition:color 450ms ease-in-out,background-color 160ms ease,border-color 160ms ease!important;
}
html[data-family="home"] :is(.journey,.mast,.destinations,.journey h1,.journey h2,.journey p,.journey a,.journey span) {
  text-shadow:none!important;
}
@media(prefers-reduced-motion:reduce) {
  html[data-family="home"] :is(.world img,body,.journey,.journey h1,.journey h2,.journey p,.theme-toggle,.choices .tr-btn) { transition:none!important; }
}
html[data-family="home"] .journey {
  order:1; width:100%; min-width:0!important; padding:0!important; margin:0; text-align:center;
}
html[data-family="home"] .journey::before { display:none!important; }
html[data-family="home"] .journey h1 {
  font-size:clamp(3.2rem,6.5vw,6.5rem); letter-spacing:-.055em; line-height:.99;
}
html[data-family="home"] .choices { gap:16px; }
html[data-family="home"] .choices .tr-btn { width:min(100%,360px); }
html[data-family="home"] .choices .tr-btn[data-sheet="rome"] {
  --destination-fill:rgb(180 85 58 / .13); --destination-hover:rgb(180 85 58 / .21);
  --destination-line:rgb(170 91 68 / .32);
}
html[data-family="home"] .choices .tr-btn[data-sheet="greece"] {
  --destination-fill:rgb(93 134 154 / .14); --destination-hover:rgb(93 134 154 / .22);
  --destination-line:rgb(98 132 149 / .34);
}
html[data-family="home"] .choices .tr-btn[data-sheet] {
  background:var(--destination-fill)!important; color:var(--ed-ink)!important;
  border:0!important; box-shadow:none!important;
}
html[data-family="home"] .choices .tr-btn[data-sheet]:hover {
  background:var(--destination-hover)!important; border:0!important;
}
html[data-family="home"] .choices .tr-btn[data-sheet] :is(.tr-btn__label,svg) { color:inherit!important; }
/* Oil-lamp light touches ink and SVG silhouettes only, never the button surface.
   50 BPM: Rome, rest, Greece, rest. Light envelope 67% -> 100% -> 67%. */
html[data-family="home"] .choices .tr-btn[data-sheet] { position:relative; }
html[data-family="home"] .choices .tr-btn[data-sheet],
html[data-family="home"] .choices .tr-btn[data-sheet]:is(:hover,:active,:focus-visible) {
  background:transparent!important; overflow:visible!important; isolation:isolate;
}
html[data-family="home"] .choices .tr-btn[data-sheet]::before {
  content:""; display:block!important; position:absolute; inset:0; z-index:-1;
  border-radius:inherit; background-color:var(--destination-fill)!important;
  background-image:var(--g-btn),var(--g-btn-alt)!important;
  background-repeat:repeat!important; background-size:var(--grain-tile-size)!important;
  pointer-events:none; box-shadow:none!important; mask:none!important;
  transform-origin:center; transform:scale(var(--plane-sx),var(--plane-sy))!important;
  animation:button-grain-jitter 5.333333s steps(1,end) infinite;
}
html[data-family="home"] .choices .tr-btn[data-sheet]:hover::before { background-color:var(--destination-hover)!important; }
html[data-family="home"] .choices .tr-btn[data-sheet="greece"]::before { animation-delay:-.73s; }
@keyframes button-grain-jitter {
  0.0000% { background-position:98px 116px,-23px -120px; }
  1.5625% { background-position:74px -50px,-28px 125px; }
  3.1250% { background-position:114px 79px,104px 57px; }
  4.6875% { background-position:-43px -58px,32px 76px; }
  6.2500% { background-position:88px 67px,-87px 75px; }
  7.8125% { background-position:-43px -28px,114px -50px; }
  9.3750% { background-position:-109px 40px,105px 20px; }
  10.9375% { background-position:21px -19px,60px -90px; }
  12.5000% { background-position:-97px -108px,-19px -100px; }
  14.0625% { background-position:-23px 3px,-2px 69px; }
  15.6250% { background-position:-75px 108px,122px 79px; }
  17.1875% { background-position:118px 29px,-106px -58px; }
  18.7500% { background-position:18px -60px,-52px 126px; }
  20.3125% { background-position:-127px -43px,-126px -91px; }
  21.8750% { background-position:-41px 24px,-77px -63px; }
  23.4375% { background-position:-35px 128px,60px 55px; }
  25.0000% { background-position:119px -55px,-89px 24px; }
  26.5625% { background-position:82px -107px,-94px -9px; }
  28.1250% { background-position:-83px -16px,-128px -36px; }
  29.6875% { background-position:45px 114px,111px -86px; }
  31.2500% { background-position:18px -126px,54px -113px; }
  32.8125% { background-position:78px 90px,-64px 77px; }
  34.3750% { background-position:50px -60px,-83px 111px; }
  35.9375% { background-position:-49px -41px,-78px -52px; }
  37.5000% { background-position:58px 9px,-102px -42px; }
  39.0625% { background-position:59px 102px,8px -102px; }
  40.6250% { background-position:54px -55px,115px 126px; }
  42.1875% { background-position:74px 104px,-30px 13px; }
  43.7500% { background-position:-33px 0px,109px 120px; }
  45.3125% { background-position:64px 122px,-123px -124px; }
  46.8750% { background-position:-14px -29px,-115px 16px; }
  48.4375% { background-position:-53px 2px,58px 118px; }
  50.0000% { background-position:34px -31px,-51px 108px; }
  51.5625% { background-position:122px 36px,45px 45px; }
  53.1250% { background-position:-111px -8px,72px 1px; }
  54.6875% { background-position:-66px -9px,109px 118px; }
  56.2500% { background-position:-30px 83px,120px -30px; }
  57.8125% { background-position:-124px 16px,-15px 5px; }
  59.3750% { background-position:-54px 63px,-114px -49px; }
  60.9375% { background-position:86px 96px,-79px -74px; }
  62.5000% { background-position:76px 113px,-51px 28px; }
  64.0625% { background-position:14px 87px,-48px -99px; }
  65.6250% { background-position:102px -112px,-4px 107px; }
  67.1875% { background-position:32px 105px,-47px -28px; }
  68.7500% { background-position:106px 35px,-25px 48px; }
  70.3125% { background-position:105px -50px,-28px 120px; }
  71.8750% { background-position:-45px -73px,-18px 8px; }
  73.4375% { background-position:-107px -91px,60px -122px; }
  75.0000% { background-position:-74px 107px,-88px -30px; }
  76.5625% { background-position:23px 90px,118px -47px; }
  78.1250% { background-position:-70px -68px,-111px -16px; }
  79.6875% { background-position:-88px 94px,19px -55px; }
  81.2500% { background-position:-88px -80px,-53px 115px; }
  82.8125% { background-position:96px 57px,6px 123px; }
  84.3750% { background-position:-121px 62px,-15px 77px; }
  85.9375% { background-position:86px -34px,64px 81px; }
  87.5000% { background-position:71px 23px,-13px 108px; }
  89.0625% { background-position:-38px 90px,101px -95px; }
  90.6250% { background-position:-3px -73px,10px -3px; }
  92.1875% { background-position:53px -55px,125px 10px; }
  93.7500% { background-position:-75px -54px,-71px 116px; }
  95.3125% { background-position:0px -90px,-66px -95px; }
  96.8750% { background-position:-58px -39px,-37px 98px; }
  98.4375% { background-position:7px 102px,106px -10px; }
}
html[data-family="home"] .choices .lamp-ink-layer {
  position:absolute; inset:0; pointer-events:none; overflow:visible;
  mask-image:linear-gradient(to right,transparent 45%,#000 50%,transparent 55%);
  mask-size:300% 100%; mask-repeat:no-repeat;
  animation:lamp-ink-sweep 4.8s linear infinite;
  filter:drop-shadow(0 0 3px #ddbd7b9a)!important;
}
html[data-family="home"] .choices .tr-btn[data-sheet="greece"] .lamp-ink-layer { animation-delay:-2.4s; }
html[data-family="home"] .choices .tr-btn[data-sheet] .lamp-ink-layer > :is(svg,span) {
  position:absolute!important; margin:0!important;
  color:#ddbd7b!important; background:none!important; text-shadow:0 0 3px #ddbd7b60!important;
}
html[data-family="home"] .choices .lamp-letter {
  display:inline-block; transform-origin:center 65%; white-space:pre;
}
/* Minimal glyph-only Gaussian trial; no shadow/opacity blend underneath. */
html[data-family="home"] .journey :is(h1,h2,p),
html[data-family="home"] .choices .tr-btn[data-sheet] > .tr-btn__label,
html[data-family="home"] .choices .tr-btn[data-sheet] .lamp-ink-layer > .tr-btn__label {
  filter:none!important;
  color:var(--harbor-letter-ink,var(--ed-ink))!important;
  text-shadow:none!important;
}
html[data-family="home"] .choices .tr-btn[data-sheet] .lamp-ink-layer > .tr-btn__label {
  --harbor-letter-ink:#ddbd7b;
}
/* The complete word follows the same inherited recoil values as its surface;
   individual letter transforms remain independent for the preceding light pass. */
html[data-family="home"] .choices .tr-btn[data-sheet] > .tr-btn__label,
html[data-family="home"] .choices .tr-btn[data-sheet] > :is(.emblem,.arrow),
html[data-family="home"] .choices .tr-btn[data-sheet] .lamp-ink-layer > :is(.tr-btn__label,.emblem,.arrow) {
  transform:scale(var(--plane-sx),var(--plane-sy))!important;
  transform-origin:center 65%;
}
@keyframes lamp-ink-sweep {
  0% { mask-position:100% 0; opacity:.67; }
  12.5% { mask-position:50% 0; opacity:1; }
  25% { mask-position:0% 0; opacity:.67; }
  25.01%,100% { mask-position:100% 0; opacity:0; }
}
@media(prefers-reduced-motion:reduce),(forced-colors:active) {
  html[data-family="home"] .choices .lamp-ink-layer { display:none!important; }
  html[data-family="home"] .choices .tr-btn[data-sheet]::before { animation:none!important; }
}
html[data-family="home"] .tagline { color:var(--ed-muted); text-shadow:none!important; }
@media(max-width:900px) {
  html[data-family="home"] .harbor { grid-template-columns:minmax(0,1fr); padding:5rem 1.5rem 2rem; gap:2rem; }
  html[data-family="home"] .world { min-width:0!important; min-height:0; height:240px; border-radius:120px 120px 12px 12px; max-width:560px; margin:auto; }
  html[data-family="home"] .destinations { margin-top:2rem; }
  html[data-family="home"] .choices .tr-btn { min-height:76px; }
}
html .room-listen-scroll li:is([aria-current],.is-current,.current) { background:var(--ed-selected)!important; }
html #titus-paper-room :is(.titus-controls button,.reference-secondary>button,.reference-speed,.reference-volume>button) {
  background:var(--ed-raised)!important; color:var(--ed-ink)!important;
  border:1px solid var(--ed-line)!important; border-radius:12px!important; box-shadow:none!important;
}
html #titus-paper-room .titus-controls button[data-player-control="play"],
html .titus-player button.titus-play.titus-play {
  background:var(--ed-accent)!important; color:var(--ed-on-accent)!important;
  border:1px solid var(--ed-accent)!important; box-shadow:none!important;
}
@media(max-width:600px) {
  html :is(.media,.choices) .tr-btn { min-height:74px; padding:1rem 1.25rem!important; }
  html :is(.blad,body>.wrap,main.wrap) { border-radius:0!important; }
}
@media(prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto!important; }
  html .tr-btn { transition:none!important; }
}
html :is(#titus-paper-room,.titus-player) :is(.titus-elapsed,.titus-duration) {
  color:var(--ed-ink)!important;
  opacity:1!important;
  font-variant-numeric:tabular-nums;
}
html[data-system] #titus-paper-room button.room-player-grabber::after {
  display:block!important; content:''!important;
  position:absolute!important; left:50%!important; top:18px!important;
  width:10px!important; height:10px!important; margin-left:-5px!important;
  border:0!important; border-right:2px solid var(--ed-ink)!important;
  border-bottom:2px solid var(--ed-ink)!important;
  background:none!important; box-shadow:none!important;
  transform:rotate(225deg)!important;
}
html[data-system] #titus-paper-room button.room-player-grabber[aria-expanded="true"]::after {
  top:13px!important; transform:rotate(45deg)!important;
}
/* ---- R5 (22 oktober): foutpagina, voet ---------------------------------------------------- */
/* 404: de kop begint onder de vaste balk; de vier bestemmingen staan al in de balk, dus de
   herhaling als knoppen verdwijnt zodra de balk gemount is (zonder script blijft de reeks). */
html[data-global-navigation] body.page-notfound .blad { padding-top:var(--global-navigation-height)!important; }
html[data-global-navigation] body.page-notfound .notfound-links { display:none!important; }
/* Voet: de merknaam kreeg een eigen onderrand die door het padding-gat van het raakvlak midden
   door de tagline liep; de onderstreping van de link blijft. */
html .foot .merk-n { border-bottom:0!important; }
/* Hoofd-404 (/zzz): zelfde groen-zwarte palet en vlak als de sectie-404, met de keuze tussen Rome en Greece. */
html[data-system] body.paper-error { background:var(--ed-bg)!important; color:var(--ed-ink)!important; padding:0!important; }
html[data-system] body.paper-error>div {
  box-sizing:border-box; width:min(560px,calc(100% - 32px)); margin-top:var(--global-navigation-height);
  padding:32px 24px!important; border:1px solid var(--ed-line); border-radius:16px!important;
  background:var(--ed-surface)!important; color:var(--ed-ink)!important; box-shadow:none!important;
}
html[data-system] body.paper-error h1 { color:var(--ed-ink)!important; margin-inline:auto!important; }
html[data-system] body.paper-error p { color:var(--ed-muted)!important; margin-inline:auto!important; text-align:center; }
html[data-system] body.paper-error>div>a:not(.tr-btn) { color:var(--ed-ink)!important; border-bottom:1px solid var(--ed-line); }
html[data-system] body.paper-error .paper-error-choice { display:flex; flex-wrap:wrap; justify-content:center; gap:12px; margin-top:24px; }
html[data-global-navigation] body.paper-error .paper-theme:not(#r5) { display:none!important; }
/* Nacht: de oude blauwe tokens van presentation.css (--surface #283744, --canvas #202c39, --rule #768b99, --muted #d0dce0)
   vallen terug op de groen-zwarte redactionele tokens; Rome-podcastresultaten waren al groen en zijn het referentiepunt. */
html[data-theme="dark"][data-system] {
  --canvas:var(--ed-bg)!important; --surface:var(--ed-surface)!important; --surface-2:var(--ed-raised)!important;
  --stone:var(--ed-surface)!important; --stone-2:var(--ed-raised)!important; --tessera:var(--ed-bg)!important;
  --rule:var(--ed-line)!important; --rule-faint:var(--ed-line)!important;
  --muted:var(--ed-muted)!important; --dim:var(--ed-muted)!important;
}
html[data-theme="dark"][data-system] .titus-room :is(.picker-mood,.picker-format-group,.picker-wheel-shell,.episode-results,#all-episodes,.titus-queue li) {
  background:var(--ed-surface)!important;
}
html[data-theme="dark"][data-system] body.paper-all {
  --surface:var(--ed-surface)!important; --stone:var(--ed-surface)!important; --stone-2:var(--ed-raised)!important;
}
html[data-theme="dark"][data-system] .room-discover-pane { background:transparent!important; }
/* ---- R5 punt 3: letter-tegels (show- en tijdvaklijsten, podcastranglijst) halen AA via de redactionele tokens ---- */
html[data-system] :is(.thumb-x,.rank-art-x) {
  color:var(--ed-ink)!important; background:var(--ed-raised)!important; border-color:var(--ed-line)!important;
}
/* ---- R5 punt 4: de eerste regel (kicker, kruimelpad) begint onder de vaste balk ----
   De statische kop is verborgen en de balk ligt vast bovenop; zonder bovenpadding schoof de eerste regel eronder.
   Kamers met een eigen bovenruimte (Listening, Watching, Reading, menu) blijven buiten schot. */
html[data-global-navigation]:not([data-family="listening"]):not([data-family="reading"]):not([data-family="watching"]):not([data-family="menu"]) body>.blad {
  padding-top:var(--global-navigation-height)!important;
}
/* Kruimelpad: één regel, geen lijn eronder (twee regels met streep was een artefact van de padding-gaten van de links). */
html .blad>nav.crumbs { display:flex; flex-wrap:wrap; align-items:center; gap:0 6px; border-bottom:0!important; }
html .crumbs a { border-bottom:0!important; text-decoration:underline; text-underline-offset:3px; }
/* De halfdoorzichtige band (70% oppervlak plus blur) achter kop en kruimelpad gaf een vage streep op het redactionele vlak. */
html body.paper-editorial :is(.mast,.crumbs) { background:transparent!important; backdrop-filter:none!important; -webkit-backdrop-filter:none!important; }
html body.paper-editorial .mast::after { display:none!important; }
/* ---- R5 punt 6: raakvlakken van minimaal 44 px (visuele opmaak blijft; alleen de hoogte/breedte van het vlak) ---- */
html[data-system] :is(.chip,.episode-details,.ifl-s,.ifl-b,.podcast-tile,.where-copy,.player-add) { min-height:44px!important; }
html[data-system] :is(.podcast-tile,.podcast-picker-nav a) { min-width:44px!important; }
html[data-system] .rail a { min-height:44px!important; box-sizing:border-box; align-items:center; }
html[data-system] .podcast-picker-nav a { display:inline-flex!important; align-items:center; justify-content:center; min-height:44px!important; padding-inline:10px!important; }
/* ---- R5 punt 7: Listening op brede schermen deelt de leesbreedte (960 px) van Watching en Reading;
   keuzekolommen, tabbalk en onderbalk lopen dan in dezelfde baan in plaats van 720/850/864 px. ---- */
@media(min-width:1100px) {
  html[data-global-navigation][data-family="listening"] .room-discover-pane { padding-inline:calc((100% - 960px)/2)!important; }
  html[data-global-navigation][data-family="listening"] .room-discover-pane .kies { max-width:960px!important; margin-inline:0!important; }
  html[data-global-navigation][data-family="listening"] #titus-paper-room>.room-matchbar { padding-inline:calc((100% - 960px)/2)!important; }
}
/* ---- R5 punt 8: aarderood op donker (duur, rangnummer, badge) haalt AA via het nachtaccent ---- */
html[data-theme="dark"][data-system] { --crimson:var(--ed-accent)!important; --hot:var(--ed-accent)!important; }
html[data-theme="dark"][data-system] :is(.picker-number,.count,.mono,.road) { color:var(--ed-accent)!important; }
html[data-theme="dark"][data-system] .badge { background:var(--ed-accent)!important; color:var(--ed-on-accent)!important; }
/* Dock: het aantal mag de rand van de knop niet raken (375 px: het getal stak 4 px buiten de binnenruimte). */
html #titus-paper-room .room-view-matches { gap:6px!important; padding-inline:12px!important; }
@media(max-width:420px) { html #titus-paper-room .room-view-matches>svg { display:none!important; } }
html #titus-paper-room .room-view-matches .room-result-count { flex:0 0 auto; padding-inline:7px!important; margin-inline-start:0!important; margin-inline-end:8px!important; }
/* ---- R6 punt 3: dezelfde grain op elke knop als op Harbour: de matchbalkknoppen (Show episodes, Add to playlist) misten hem omdat hun
   achtergrond-shorthand met id-specificiteit de beeldlaag wiste. Dezelfde twee texturen, maten en kloktempo als de Harbour-knoppen. ---- */
html[data-family]:not([data-family="home"]) #titus-paper-room .room-matchbar .tr-btn {
  background-image:var(--g-btn),var(--g-btn-alt)!important;
  background-size:var(--grain-tile-size)!important; background-repeat:repeat!important;
  animation:button-grain-jitter 5.333333s steps(1,end) infinite;
}
/* ---- R6 punt 4: de aquarel (Rostra, Theatrum, Taberna, per pagina uit --tr-setting-day/-night) staat terug achter Listening,
   Watching en Reading. De schilderijen liggen vast achter de pagina; het leesblad krijgt een sluier van de pagina-achtergrond
   (94% dag, 92% nacht) zodat de tekst AA blijft. Geen wijziging van de geometrie. ---- */
html[data-family="listening"][data-theme][data-system] body::before, html[data-family="watching"][data-theme][data-system] body::before, html[data-family="reading"][data-theme][data-system] body::before {
  content:""!important; display:block!important; position:fixed; inset:0; z-index:-3; pointer-events:none;
  background:var(--tr-setting-day) 50% var(--tr-setting-y)/cover no-repeat!important;
}
html[data-family="listening"][data-theme="dark"][data-system] body::before, html[data-family="watching"][data-theme="dark"][data-system] body::before, html[data-family="reading"][data-theme="dark"][data-system] body::before {
  background:var(--tr-setting-night) 50% var(--tr-setting-y)/cover no-repeat!important;
}
/* Wide landscape screens otherwise crop the tall watercolor at one fixed
   point. Let Mac and tablet visitors slowly travel from its top to its bottom;
   phones, portrait layouts and reduced-motion users keep a still painting. */
@keyframes tr-setting-landscape-pan {
  from { --tr-setting-y:0%; }
  to { --tr-setting-y:100%; }
}
html[data-family="listening"], html[data-family="watching"], html[data-family="reading"] { --ed-veil:90%; }
html[data-family="listening"][data-theme="dark"], html[data-family="watching"][data-theme="dark"], html[data-family="reading"][data-theme="dark"] { --ed-veil:88%; }
html[data-family="watching"] body>.blad, html[data-family="reading"] body>.blad {
  background-color:color-mix(in srgb,var(--ed-surface) var(--ed-veil),transparent)!important;
}
html[data-family="listening"][data-theme] #titus-paper-room :is(.room-stage,.room-discover-pane,.room-listen-pane) { background-color:transparent!important; }
html[data-family="listening"] #titus-paper-room .room-discover-pane .kies { background-color:color-mix(in srgb,var(--ed-bg) var(--ed-veil),transparent)!important; }
/* ---- R6 keuzemenu V1: één voet per stap (Back omhoog, Skip omlaag), Figure als ingeklapte rij, één actieknop met aantal ---- */
.historical-figure-filter[hidden] { display:none!important; }
html .picker-voet { display:flex!important; justify-content:center; gap:12px; margin:20px auto 8px; padding:0; position:sticky; bottom:92px; z-index:6; background:none!important; border:0!important; pointer-events:none; }
html .picker-voet .tr-btn { pointer-events:auto; }
html[data-family="watching"] .picker-voet, html[data-family="reading"] .picker-voet { bottom:84px; }
html .podcast-picker-flow>.picker-voet { margin-top:0; }
/* vier stappen in de balk (Mood, Period, Figure, vorm): vier gelijke kolommen, het zoekveld erachter */
html .podcast-picker-nav { grid-template-columns:repeat(4,minmax(0,1fr))!important; }
html .titus-room .podcast-picker-nav { grid-template-columns:repeat(4,minmax(0,1fr)) auto!important; }
@media(max-width:560px) { html .titus-room .podcast-picker-nav { grid-template-columns:auto auto auto minmax(0,1fr) auto!important; column-gap:2px; } html .titus-room .podcast-picker-nav a { font-size:10px!important; padding-inline:5px!important; } }
@media(max-width:420px) { html .podcast-picker-nav a { font-size:11px!important; letter-spacing:0!important; padding-inline:4px!important; } }
html .picker-voet .tr-btn { display:inline-flex!important; align-items:center; justify-content:center; gap:8px; min-width:124px; min-height:48px!important; padding:8px 18px!important; font-weight:600; }
html .picker-voet .tr-btn svg { width:20px; height:20px; flex:none; }
html .picker-voet .tr-btn[aria-disabled="true"] { opacity:.5; cursor:default; }
html .figure-row { display:block; margin:8px auto; max-width:min(100%,560px); border:1px solid var(--ed-line); border-radius:12px; background:var(--ed-surface); }
html .figure-summary { display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:48px; padding:10px 16px; cursor:pointer; list-style:none; font-weight:600; }
html .figure-summary::-webkit-details-marker { display:none; }
html .figure-summary svg { transition:transform 220ms var(--tr-ease-out,ease); flex:none; }
html .figure-row[open] .figure-summary svg { transform:rotate(180deg); }
html .figure-row[data-gekozen] .figure-keuze { color:var(--ed-accent); }
html .figure-wheel-host { padding:0 8px 12px; }
html .picker-view-bar { position:sticky; bottom:12px; z-index:7; display:flex; justify-content:center; margin:16px auto 0; pointer-events:none; }
html .picker-view-bar .picker-view { pointer-events:auto; display:inline-flex!important; align-items:center; justify-content:center; gap:12px; min-width:min(100%,320px); min-height:52px!important; padding:10px 24px!important; font-weight:700; }
html .picker-view-n, html .match-sticky-n { font:600 13px/1 ui-monospace,monospace; padding:4px 8px; border-radius:8px; background:color-mix(in srgb,currentColor 18%,transparent); }
html .match-sticky-n { margin-inline-start:10px; }
html .room-view-matches[data-busy="true"] strong::after { content:""; display:inline-block; width:14px; height:14px; margin-inline-start:10px; border:2px solid currentColor; border-right-color:transparent; border-radius:50%; vertical-align:-2px; animation:r6-spin .8s linear infinite; }
@keyframes r6-spin { to { transform:rotate(360deg); } }
@media(prefers-reduced-motion:reduce) { html .room-view-matches[data-busy="true"] strong::after { animation:none; } }
/* ---- R6 keuzemenu V2 "ingeklapt" (html[data-keuze="ingeklapt"], ?keuze=v2) ---- */
html[data-keuze="ingeklapt"] .podcast-picker-nav, html[data-keuze="ingeklapt"] .picker-voet { display:none!important; }
html:not([data-keuze="ingeklapt"]) .keuze-bar { display:none; }
html[data-keuze="ingeklapt"] .figure-summary { display:none; }
html[data-keuze="ingeklapt"] .figure-row { border:0; background:none; max-width:none; }
html[data-keuze="ingeklapt"] .keuze-bar { display:block; max-width:min(100%,960px); margin:12px auto 20px; padding:0 4px; text-align:center; }
/* R9 zoekblok: 'Search by' / één rij met vier chips / 'and add the matching episodes to your playlist!'. Smal: de rij scrolt horizontaal met snap en randfade. */
html .keuze-zoek-a { margin:0 0 10px; font:600 20px/1.2 var(--tr-font-display,Georgia,serif); color:var(--ed-ink); }
html .keuze-zoek-b { margin:6px 0 0; font:500 15px/1.4 var(--tr-font-body,system-ui); color:var(--ed-muted); }
html .keuze-strip { --fl:0px; --fr:0px; position:relative; }
html .keuze-strip[data-meer-l] { --fl:30px; }
html .keuze-strip[data-meer-r] { --fr:34px; }
html[data-keuze="ingeklapt"] .keuze-chips { display:flex; gap:8px; overflow-x:auto; overflow-y:hidden; scroll-snap-type:x proximity; scrollbar-width:none; -webkit-overflow-scrolling:touch; padding:8px 14px 10px; margin-inline:-14px;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 var(--fl),#000 calc(100% - var(--fr)),transparent 100%); mask-image:linear-gradient(90deg,transparent 0,#000 var(--fl),#000 calc(100% - var(--fr)),transparent 100%); }
html[data-keuze="ingeklapt"] .keuze-chips::-webkit-scrollbar { display:none; }
html[data-keuze="ingeklapt"] .keuze-chips>.keuze-chip-wrap { flex:0 0 auto; scroll-snap-align:center; max-width:min(78vw,270px); }
html[data-keuze="ingeklapt"] .keuze-chips>.keuze-chip-wrap:first-child { margin-inline-start:auto; }
html[data-keuze="ingeklapt"] .keuze-chips>.keuze-chip-wrap:last-child { margin-inline-end:auto; }
@media(min-width:640px) { html[data-keuze="ingeklapt"] .keuze-chips { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); overflow:visible; scroll-snap-type:none; margin-inline:0; padding-inline:0; -webkit-mask-image:none; mask-image:none; }
  html[data-keuze="ingeklapt"] .keuze-chips>.keuze-chip-wrap { max-width:none; margin-inline:0!important; } }
html .keuze-chip-wrap { position:relative; display:block; min-width:0; }
html .keuze-chip { display:flex!important; flex-direction:column; align-items:center; justify-content:center; gap:2px; width:100%; min-height:56px!important; padding:8px 18px!important; text-align:center; overflow:hidden; }
html .keuze-chip-wrap[data-gekozen] .keuze-chip { align-items:flex-start; padding:8px 40px 8px 16px!important; text-align:start; }
html .keuze-chip-n { font:600 16px/1.2 var(--tr-font-display,Georgia,serif); color:var(--ed-ink); white-space:nowrap; }
html .keuze-chip-wrap[data-gekozen] .keuze-chip-n { font:600 11px/1.2 ui-monospace,monospace; letter-spacing:.04em; text-transform:uppercase; color:var(--ed-muted); }
html .keuze-chip-v { font:600 16px/1.2 var(--tr-font-display,Georgia,serif); max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
html .keuze-chip-wrap:not([data-gekozen]) .keuze-chip-v { display:none; }
html .keuze-chip-wrap[data-gekozen] .keuze-chip { border-color:var(--ed-accent)!important; }
html .keuze-chip-wrap[data-gekozen] .keuze-chip-v { color:var(--ed-accent); }
html .keuze-chip-x { position:absolute; inset-block:0; inset-inline-end:0; width:44px; min-height:44px; display:grid; place-items:center; border:0; background:none; color:var(--ed-ink); font:600 22px/1 system-ui; cursor:pointer; }
html .keuze-chip-x[hidden] { display:none; }
html .keuze-summary { display:flex; align-items:center; justify-content:center; gap:12px; flex-wrap:wrap; margin-top:10px; min-height:44px; font:500 14px/1.4 var(--tr-font-body,system-ui); color:var(--ed-muted); }
html .keuze-summary[hidden] { display:none; }
html .keuze-summary-t { flex:0 1 auto; min-width:0; }
/* zoekveld weg uit het keuzemenu (zoeken gaat via het vergrootglas in de bovenbalk); 'The essentials' op Watching en Reading blijft */
html[data-keuze="ingeklapt"] .room-search { display:none!important; }
html[data-keuze="ingeklapt"] .tools .searchrow #q { display:none!important; }
html[data-keuze="ingeklapt"] .tools .searchrow { justify-content:center; }
html dialog.keuze-sheet { box-sizing:border-box; padding:0; border:1px solid var(--ed-line); background:var(--ed-surface); color:var(--ed-ink); display:none; flex-direction:column; overflow:hidden; }
html dialog.keuze-sheet[open] { display:flex; }
html dialog.keuze-sheet::backdrop { background:rgba(10,14,12,.55); }
@media(max-width:699px) { html dialog.keuze-sheet { position:fixed; inset:auto 0 0 0; margin:0; width:100%; max-width:none; height:min(86dvh,720px); max-height:86dvh; border-radius:16px 16px 0 0; } }
@media(min-width:700px) { html dialog.keuze-sheet { width:min(720px,calc(100% - 48px)); height:min(80dvh,760px); border-radius:16px; } }
@media(max-width:699px) { html dialog.keuze-sheet[open] {
  bottom:auto; top:var(--sheet-visible-top,0px);
  height:var(--sheet-visible-height,100dvh); max-height:var(--sheet-visible-height,100dvh); border-radius:0;
} }
html .sheet-head { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:10px 14px; border-bottom:1px solid var(--ed-line); }
html .sheet-title { margin:0; font-size:20px; }
/* Modal content used to retain the page picker's intrinsic width/height. Constrain
   both flex axes so only the body scrolls; keep header and actions in view. */
html dialog.keuze-sheet { min-width:0; min-height:0; max-inline-size:100%; }
html .sheet-head, html .sheet-foot { flex:0 0 auto; min-width:0; }
html .sheet-head { padding-top:max(10px,env(safe-area-inset-top)); }
html .sheet-foot { padding-bottom:max(10px,env(safe-area-inset-bottom)); flex-wrap:wrap; }
html .sheet-body { box-sizing:border-box; flex:1 1 auto; min-width:0; min-height:0; overflow:auto; padding:8px 12px; overscroll-behavior:contain; }
html .sheet-body > * { box-sizing:border-box; min-width:0; max-width:100%; }
html .sheet-body > .podcast-picker-step { width:100%; padding:8px 0; overflow:clip; }
html .sheet-body :is(.picker-wheel-shell,.picker-wheel,.picker-format-group,.picker-mood) { min-width:0; max-width:100%; box-sizing:border-box; }
html .sheet-body :is(button,label,summary) { overflow-wrap:anywhere; }
html .room-about > summary { text-align:center; }
html[data-keuze="ingeklapt"] .keuze[data-page] { display:none; }
html .sheet-body .picker-number, html .sheet-body>.podcast-picker-step>h2 { display:none; }
html .sheet-foot { display:flex; gap:10px; justify-content:space-between; padding:10px 14px max(10px,env(safe-area-inset-bottom)); border-top:1px solid var(--ed-line); }
html .sheet-foot .tr-btn { min-height:48px!important; }
html .sheet-view { flex:1 1 auto; display:inline-flex!important; align-items:center; justify-content:center; gap:10px; font-weight:700; }
html .sheet-view-n { font:600 13px/1 ui-monospace,monospace; padding:4px 8px; border-radius:8px; background:color-mix(in srgb,currentColor 18%,transparent); }
/* Context belongs below the wheel, never behind it or in a second scroller.
   Reserve roughly two thirds for choosing; short viewports keep copy readable. */
html .sheet-body:has(>.sheet-context) { display:grid; grid-template-rows:minmax(0,2fr) minmax(min-content,1fr); gap:8px; overflow:hidden; }
html .sheet-body:has(>.sheet-context)>.podcast-picker-step { display:flex; flex-direction:column; min-height:0; margin:0!important; padding:0!important; border:0!important; }
html .sheet-context { align-self:start; padding:10px 8px 0; text-align:left; }
html .sheet-context-title { margin:0 0 6px!important; font:600 19px/1.2 var(--tr-font-display,Georgia,serif)!important; color:var(--ed-ink); }
html .sheet-context-copy { margin:0!important; font:400 16px/1.4 var(--tr-font-body,system-ui)!important; color:var(--ed-muted); }
html .sheet-body:has(>.sheet-context) .figure-row { position:relative; flex:1; min-height:0; margin:0; padding:0; }
html .sheet-body:has(>.sheet-context) .figure-wheel-host { position:absolute; inset:0; min-height:0; margin:0; padding:0; }
html .sheet-body:has(>.sheet-context) .picker-topic-columns { flex:1; min-height:0; }
html .sheet-body:has(>.sheet-context) .picker-wheel-shell { container-type:size; flex:1; min-height:0; height:100%; }
html .sheet-body:has(>.sheet-context) .picker-wheel { height:100%!important; min-height:0!important; padding-block:64px max(64px,calc(100cqh - 128px))!important; }
html .sheet-body:has(>.sheet-context) .picker-wheel-band { top:64px!important; }
@media(min-width:700px) { html .sheet-body:has(>.sheet-context) .picker-topic-col { display:flex; flex-direction:column; min-height:0; height:100%; } }
@media(max-width:699px) { html .sheet-body:has(>.sheet-context) .picker-topic-col.is-open { display:flex; flex-direction:column; min-height:0; height:100%; } }
/* ---- R7: zoekveld en Show everything (.tools) liggen in de flow; als vaste balk lag de doorzichtige strook over de boekkaarten ---- */
html[data-global-navigation] .blad .tools:not(.room-search .tools) { position:static!important; top:auto!important; z-index:auto!important; }
}
/* ---- R7: kleurcode per medium. Listening klei (Rostra), Watching leisteenblauw (Theatrum), Reading saliegroen (Taberna): de warme ochre-
   aquarellen dragen overal klei en oker; de drie tinten zijn daaruit afgeleid en onderling >= 19 delta E (licht) en >= 20 (donker).
   Per medium drie tokens: vlak (fill), rand/accent (line), tekst-op-vlak (ink). Aarderood blijft de primaire actie en de selectie. ---- */
:root {
  --medium-listening-fill:#eecbb9; --medium-listening-line:#a4503a; --medium-listening-ink:#2b1a14;
  --medium-watching-fill:#cad9e3;  --medium-watching-line:#4b6a7c;  --medium-watching-ink:#14222b;
  --medium-reading-fill:#d7e3c2;   --medium-reading-line:#5a7442;   --medium-reading-ink:#1b2412;
}
:root[data-theme="dark"] {
  --medium-listening-fill:#4a3029; --medium-listening-line:#e0987e; --medium-listening-ink:#f6e6dd;
  --medium-watching-fill:#2d3c46;  --medium-watching-line:#8fb3c8;  --medium-watching-ink:#e3eef4;
  --medium-reading-fill:#34402a;   --medium-reading-line:#a9c58a;   --medium-reading-ink:#e9f2dc;
}
@layer titus-editorial {
html[data-family="listening"] { --m-fill:var(--medium-listening-fill); --m-line:var(--medium-listening-line); --m-ink:var(--medium-listening-ink); }
html[data-family="watching"]  { --m-fill:var(--medium-watching-fill);  --m-line:var(--medium-watching-line);  --m-ink:var(--medium-watching-ink); }
html[data-family="reading"]   { --m-fill:var(--medium-reading-fill);   --m-line:var(--medium-reading-line);   --m-ink:var(--medium-reading-ink); }
/* keuzepagina (Rome/Greece, I feel like): elke knop zijn eigen vlak; icoon in de randtint, tekst in de inkt van het vlak */
html[data-family="menu"] .media a[href$="/podcasts"] { --mf:var(--medium-listening-fill); --ml:var(--medium-listening-line); --mi:var(--medium-listening-ink); }
html[data-family="menu"] .media a[href$="/watch"]    { --mf:var(--medium-watching-fill);  --ml:var(--medium-watching-line);  --mi:var(--medium-watching-ink); }
html[data-family="menu"] .media a[href$="/books"]    { --mf:var(--medium-reading-fill);   --ml:var(--medium-reading-line);   --mi:var(--medium-reading-ink); }
html[data-family="menu"] .media a.tr-btn[href] { --destination-fill:var(--mf); --destination-hover:color-mix(in srgb,var(--mf) 82%,var(--ml)); background:var(--mf)!important; color:var(--mi)!important; border:1px solid color-mix(in srgb,var(--ml) 45%,transparent)!important; }
html[data-family="menu"] .media a.tr-btn[href]:hover { background:color-mix(in srgb,var(--mf) 82%,var(--ml))!important; }
html[data-family="menu"] .media a.tr-btn[href]::before { background-color:var(--mf)!important; }
html[data-family="menu"] .media a.tr-btn[href] .tr-btn__label { color:var(--mi)!important; }
html[data-family="menu"] .media a.tr-btn[href] :is(.tr-btn__icon,.direction,svg) { color:var(--ml)!important; stroke:var(--ml)!important; }
/* The three media choices reuse Harbor's exact 50 BPM lamp pass, 4% glyph
   lift and damped surface recoil. Only the cycle grows to fit three choices:
   Listening, rest, Watching, rest, Reading, rest. */
html[data-family="menu"] .media a.tr-btn.lamp-pulse-button {
  position:relative; background:transparent!important; overflow:visible!important;
  isolation:isolate; border-color:transparent!important;
}
html[data-family="menu"] .media a.tr-btn.lamp-pulse-button::before {
  content:""; display:block!important; position:absolute; inset:0; z-index:-1;
  border-radius:inherit; background-color:var(--mf)!important;
  background-image:var(--g-btn),var(--g-btn-alt)!important;
  background-repeat:repeat!important; background-size:var(--grain-tile-size)!important;
  box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--ml) 45%,transparent)!important;
  pointer-events:none; transform-origin:center;
  transform:scale(var(--plane-sx),var(--plane-sy))!important;
  animation:button-grain-jitter 5.333333s steps(1,end) infinite;
}
html[data-family="menu"] .media a.tr-btn.lamp-pulse-button:hover::before {
  background-color:color-mix(in srgb,var(--mf) 82%,var(--ml))!important;
}
html[data-family="menu"] .media .lamp-ink-layer {
  position:absolute; inset:0; pointer-events:none; overflow:visible;
  mask-image:linear-gradient(to right,transparent 45%,#000 50%,transparent 55%);
  mask-size:300% 100%; mask-repeat:no-repeat;
  animation:lamp-ink-sweep-media 7.2s linear infinite;
  filter:drop-shadow(0 0 3px #ddbd7b9a)!important;
}
html[data-family="menu"] .media .lamp-ink-layer > * {
  position:absolute!important; margin:0!important;
  color:#ddbd7b!important; stroke:#ddbd7b!important;
  background:none!important; text-shadow:0 0 3px #ddbd7b60!important;
}
html[data-family="menu"] .media .lamp-letter {
  display:inline-block; transform-origin:center 65%; white-space:pre;
}
html[data-family="menu"] .media a.tr-btn.lamp-pulse-button > :is(.tr-btn__label,.tr-btn__icon),
html[data-family="menu"] .media a.tr-btn.lamp-pulse-button .lamp-ink-layer > :is(.tr-btn__label,.tr-btn__icon) {
  transform:scale(var(--plane-sx),var(--plane-sy))!important;
  transform-origin:center 65%;
}
html[data-family="menu"] .media a.tr-btn.lamp-pulse-button > .tr-btn__end,
html[data-family="menu"] .media a.tr-btn.lamp-pulse-button .lamp-ink-layer > .tr-btn__end {
  transform:rotate(90deg) scale(var(--plane-sx),var(--plane-sy))!important;
  transform-origin:center 65%;
}
@keyframes lamp-ink-sweep-media {
  0% { mask-position:100% 0; opacity:.67; }
  8.333333% { mask-position:50% 0; opacity:1; }
  16.666667% { mask-position:0% 0; opacity:.67; }
  16.673333%,100% { mask-position:100% 0; opacity:0; }
}
@media(prefers-reduced-motion:reduce),(forced-colors:active) {
  html[data-family="menu"] .media .lamp-ink-layer { display:none!important; }
  html[data-family="menu"] .media a.tr-btn.lamp-pulse-button::before { animation:none!important; }
}
/* Only the current medium carries its accent. Neutral neighbours make the
   existing icon and aria-current state a clear location signal in both themes. */
html[data-system][data-global-navigation] .global-navigation-main > a:is([href*="/podcasts"],[href*="/watch"],[href*="/books"]) svg { stroke:var(--ed-muted)!important; }
html[data-system][data-global-navigation] .global-navigation-main > a[href*="/podcasts"][aria-current="page"] svg { stroke:var(--medium-listening-line)!important; }
html[data-system][data-global-navigation] .global-navigation-main > a[href*="/watch"][aria-current="page"] svg { stroke:var(--medium-watching-line)!important; }
html[data-system][data-global-navigation] .global-navigation-main > a[href*="/books"][aria-current="page"] svg { stroke:var(--medium-reading-line)!important; }
html[data-system][data-global-navigation] .global-navigation-main > a[href*="/podcasts"][aria-current="page"] { color:var(--medium-listening-line)!important; }
html[data-system][data-global-navigation] .global-navigation-main > a[href*="/watch"][aria-current="page"] { color:var(--medium-watching-line)!important; }
html[data-system][data-global-navigation] .global-navigation-main > a[href*="/books"][aria-current="page"] { color:var(--medium-reading-line)!important; }
/* pagina's: wielband, accenten, iconen en labels in de mediumtint; het blad krijgt een lichte tint in de sluier */
html:is([data-family="listening"],[data-family="watching"],[data-family="reading"]) .picker-wheel-band { background:var(--m-fill)!important; border-block:1px solid var(--m-line)!important; }
html:is([data-family="listening"],[data-family="watching"],[data-family="reading"]) .picker-col-icon { color:var(--m-line)!important; }
html:is([data-family="listening"],[data-family="watching"],[data-family="reading"]) .picker-wheel-option:is(.is-current,[aria-pressed="true"]):not(#r7):not(#r7b) { background-color:var(--m-fill)!important; color:var(--m-ink)!important; }
html:is([data-family="listening"],[data-family="watching"],[data-family="reading"]) .chip:not([aria-pressed="true"]) { border-color:color-mix(in srgb,var(--m-line) 55%,var(--ed-line))!important; }
html:is([data-family="listening"],[data-family="watching"],[data-family="reading"]) :is(.tag,.chip-n,.fmt-n) { color:var(--m-ink)!important; }
html:is([data-family="listening"],[data-family="watching"],[data-family="reading"]) .tag { background:var(--m-fill)!important; border-color:var(--m-line)!important; }
html:is([data-family="listening"],[data-family="watching"],[data-family="reading"]) :is(.figure-row[data-gekozen] .figure-keuze,.keuze-chip-wrap[data-gekozen] .keuze-chip-v) { color:var(--m-line)!important; }
html:is([data-family="listening"],[data-family="watching"],[data-family="reading"]) .keuze-chip-wrap[data-gekozen] .keuze-chip { border-color:var(--m-line)!important; }
/* The scroller is transparent; only its content panel carries the Listening veil. */
html:is([data-family="watching"],[data-family="reading"]) body>.blad {
  background-color:transparent!important;
  width:100%!important; max-width:none!important;
  padding-inline:max(24px,calc((100% - 850px)/2))!important;
}
html:is([data-family="watching"],[data-family="reading"]) body>.blad .kies {
  width:100%!important; max-width:none!important; box-sizing:border-box;
  margin-inline:0!important;
  background-color:color-mix(in srgb,color-mix(in srgb,var(--m-fill) 16%,var(--ed-bg)) var(--ed-veil),transparent)!important;
}
@media(min-width:1100px) {
  html:is([data-family="watching"],[data-family="reading"]) body>.blad { padding-inline:calc((100% - 960px)/2)!important; }
}
@media(max-width:760px) {
  html:is([data-family="watching"],[data-family="reading"]) body>.blad { padding-inline:18px!important; }
}
html[data-family="listening"] #titus-paper-room .room-discover-pane .kies { background-color:color-mix(in srgb,color-mix(in srgb,var(--m-fill) 16%,var(--ed-bg)) var(--ed-veil),transparent)!important; }
}

/* ---- R9 kies: tokens (de tuner, tab 'Kiezen', schrijft dezelfde namen), sheet in en uit, glow-squish-puls ---- */
:root {
  /* sheet: in met een lange zachte uitloop, uit korter en strakker; getallen zonder eenheid zodat app.js ze kan lezen */
  --kies-sheet-in-ms:520; --kies-sheet-uit-ms:260; --kies-sluit-ms:200; --kies-rij-ms:380;
  --kies-sheet-in-ease:cubic-bezier(.16,1,.3,1); --kies-sheet-uit-ease:cubic-bezier(.5,0,.75,.3);
  /* puls per chip */
  --kies-puls-ms:700; --kies-puls-rust-ms:3200; --kies-puls-herhaal:3; --kies-puls-start-ms:1100; --kies-puls-scrollrust-ms:260;
  --kies-puls-sterkte:1; --kies-puls-squish:.06;
}
@media(min-width:700px) { :root { --kies-sheet-in-ease:cubic-bezier(.16,1,.3,1); } }
/* Omar-principe: het venster blijft op ware grootte en wordt vanuit de exacte
   triggerpositie onthuld. Geen fade, geen schaal van tekst en geen losse
   rij-stagger; zo blijft de ruimtelijke relatie knop -> venster intact. */
html dialog.keuze-sheet { transform:none; opacity:1; clip-path:inset(0 round 16px); transition:clip-path calc(var(--kies-sheet-in-ms)*1ms) var(--kies-sheet-in-ease); will-change:clip-path; }
html dialog.keuze-sheet[data-state="pre"],html dialog.keuze-sheet[data-state="out"] { clip-path:inset(var(--sheet-origin-top,50%) var(--sheet-origin-right,50%) var(--sheet-origin-bottom,50%) var(--sheet-origin-left,50%) round var(--sheet-origin-radius,16px)); }
html dialog.keuze-sheet[data-state="out"] { transition-duration:calc(var(--kies-sheet-uit-ms)*1ms); transition-timing-function:var(--kies-sheet-uit-ease); }
html dialog.keuze-sheet::backdrop { opacity:1; transition:none; }
html dialog.keuze-sheet[data-state] .picker-wheel-option { animation:none; }
/* glow-squish-puls: de glow is een eigen laag (geen box-shadow-animatie); alleen opacity en scale bewegen */
html .keuze-glow { position:absolute; inset:-5px; z-index:0; border-radius:var(--lq-r-pil,999px); pointer-events:none; opacity:0;
  box-shadow:0 0 0 2px color-mix(in srgb,var(--m-line,var(--ed-accent)) calc(var(--kies-puls-sterkte)*55%),transparent),0 0 20px 3px color-mix(in srgb,var(--m-line,var(--ed-accent)) calc(var(--kies-puls-sterkte)*45%),transparent); }
html .keuze-chip-wrap>.keuze-chip { z-index:1; }
html .keuze-bar[data-puls-statisch] .keuze-chip-wrap:not([data-gekozen]) .keuze-chip { outline:1px solid color-mix(in srgb,var(--m-line,var(--ed-accent)) 50%,transparent); outline-offset:2px; }
@media(prefers-reduced-motion:reduce) {
  html dialog.keuze-sheet, html dialog.keuze-sheet::backdrop { transition:none!important; clip-path:none!important; }
  html dialog.keuze-sheet[data-state] .picker-wheel-option { animation:none!important; }
  html .keuze-glow { display:none; }
}

/* ---- R9 F: één selectievlak. Het vaste vlak is .picker-wheel-band; geen wielrij draagt zelf een selectievulling, rand, schaduw of schaal, in geen enkele staat.
   Voorheen kregen de rij die gekozen was (aria-pressed) en de rij die het dichtst bij de band lag (.is-current) elk een eigen vulling, rand en
   vette letter, naast de band zelf: tijdens het scrollen stonden er twee of drie vlakken door elkaar (de 'blob'). Alleen de rij op de band is vet. ---- */
@layer titus-editorial {
html :is(.picker-wheel-shell,.picker-wheel) .picker-wheel-option:is(.tr-btn,.chip,.picker-any),
html :is(.picker-wheel-shell,.picker-wheel) .picker-wheel-option:is(.is-current,[aria-pressed="true"],:hover,:focus-visible,:active):not(#r9):not(#r9b):not(#r9c) {
  background-color:transparent!important; border-color:transparent!important; box-shadow:none!important; scale:none; }
html :is(.picker-wheel-shell,.picker-wheel) .picker-wheel-option:not(.is-current):not(#r9):not(#r9b) { font-weight:500!important; }
html :is(.picker-wheel-shell,.picker-wheel) .picker-wheel-option.is-current:not(#r9):not(#r9b) { font-weight:620!important; color:var(--m-ink,var(--ed-ink))!important; }
}

/* ---- R9 E: grain over de hele site. De bestanden staan in vars zodat de tuner (tab Grain) ze met een sterkte kan vervangen; zonder tuner zijn het
   dezelfde Harbour-bestanden als altijd. ---- */
:root {
  --grain-sterkte:1;
  --grain-tile-size:96px 96px,101px 101px;
  --g-btn:url("./button-grain.svg"); --g-btn-alt:url("./button-grain-alt.svg");
  --g-bg:url("./background-grain.svg"); --g-bg-alt:url("./background-grain-alt.svg");
  --g-paint:url("./painting-grain.svg"); --g-paint-alt:url("./painting-grain-alt.svg");
}
/* Eén korrelfilm over elke pagina behalve Harbour (daar is het schilderij zelf de referentie): zo hebben ook de vlakken die bovenop het blad liggen
   (kaarten, pillen, de Listening-kamer, de bovenbalk) dezelfde grain als Harbour. Dezelfde bestanden, hetzelfde ritme, halve knopsterkte (opacity .5 op
   de knop-grain, zoals body::after); de tuner (tab Grain) schaalt hem mee via --g-*. Geen pointer-events; reduced motion zet het ritme stil. */
html:not([data-family="home"])::after {
  content:""; position:fixed; inset:0; z-index:2147482000; pointer-events:none; opacity:.5;
  background-image:var(--g-btn),var(--g-btn-alt); background-size:var(--grain-tile-size); background-repeat:repeat;
  animation:button-grain-jitter 5.333333s steps(1,end) infinite;
}
html dialog.keuze-sheet { background-image:var(--g-bg),var(--g-bg-alt); background-size:var(--grain-tile-size); background-repeat:repeat; }
/* Finer tooth only at night: same textures, alpha and rhythm, one shared scale. */
html[data-theme="dark"],
html[data-theme="dark"] :is(body,.world,.shared-painting-grain,.tr-btn,button,dialog) {
  --grain-tile-size:64px 64px,67px 67px;
}
@media(prefers-color-scheme:dark) {
  html:not([data-theme]) { --grain-tile-size:64px 64px,67px 67px; }
}
@media(prefers-reduced-motion:reduce) { html:not([data-family="home"])::after { animation:none; } }
/* de korrelfilm hierboven is nu de enige laag voor achtergrond en bladen op niet-Harbour-pagina's: de oude body::after en de bladgrain deden hetzelfde op een deel
   van de pagina's, waardoor sommige pagina's dubbel zoveel korrel hadden als Harbour (gemeten: ruis 1,0 tegen 0,5). Knoppen houden hun eigen grain. */
html[data-family]:not([data-family="home"]) body::after { display:none!important; }
html[data-family]:not([data-family="home"]) :is(.blad,.room-stage,.room-discover-pane,.room-listen-pane,.room-listen-scroll>ol) { background-image:none!important; animation:none; }
/* de wis-kruisjes liggen binnen de chip (absoluut, rechts) en verdwijnen met [hidden]; op Watching en Reading kreeg de tr-btn-stempel er een eigen plek en display bij */
@layer titus-editorial {
html .keuze-chip-wrap>.keuze-chip-x:not(#r9):not(#r9b) { position:absolute!important; inset-block:0!important; inset-inline-end:0!important; width:44px!important; min-width:44px!important; display:grid!important; place-items:center; background:none!important; border:0!important; box-shadow:none!important; padding:0!important; z-index:2; }
html .keuze-chip-wrap>.keuze-chip-x[hidden]:not(#r9):not(#r9b) { display:none!important; }
}

/* ==== Pariteit 27-10 (Ben): overrides binnen de editorial-laag (een !important buiten de laag verliest van een erbinnen) ==== */
@layer titus-editorial {
/* ==== Pariteit 27-10 (Ben): Listening is het voorbeeld voor Watching en Reading; beweging uit setshopper ==== */

/* 1. Listening krijgt zijn aquarel terug: de kamer was een dekkend papiervlak over het schilderij heen. */
html[data-family="listening"][data-system] :is(body.has-titus-room,#titus-paper-room,#titus-paper-room>.room-stage){background-color:transparent!important}

/* 2. Maan en zon op de hoogte van het vergrootglas (het midden lag 8 px te hoog). */
html[data-system][data-global-navigation] .global-navigation :is(.theme-toggle,button#theme,button#media-theme,[data-paper-theme],.room-theme)::after{top:calc(50% + var(--tr-theme-dy,0px))!important}

/* 4. Watching en Reading zoals Listening: geen sprongrij, geen inleidend proza, geen zoekregel met The essentials,
      geen Show everything en geen losse View-knop. Wat ze deden zit in de vier knoppen en de muur. */
html[data-media-wall] :is(nav.jumps,section.prose,.blad>.tools,#clear,.picker-view-bar){display:none!important}
html[data-media-wall] .mast-finder{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;white-space:nowrap!important;margin:0!important;padding:0!important}
html[data-media-wall] :is(#all-episodes,#all-reviews)[hidden]{display:none!important}
/* Een titel zonder beeld: dezelfde tegel als een cover, met de beginletter (de regel voor tr-btn verbergt anders elke span). */
html .podcast-tile>span.podcast-tile-letter,html .podcast-tile.tr-btn>span.podcast-tile-letter{
  position:relative!important;display:grid!important;place-items:center;width:100%!important;height:auto!important;aspect-ratio:1;
  clip:auto!important;overflow:hidden!important;white-space:normal!important;
  border-radius:var(--lq-r-rechthoek,var(--tr-r-s,6px));background:var(--tr-paper-solid,#f8f1e5);color:var(--tr-ink-soft,#6c594c);
  font-family:var(--tr-font-display,Georgia,serif)!important;font-weight:500!important;font-size:calc(var(--wall-size,96px)*.42)!important;line-height:1!important;text-transform:none!important;letter-spacing:0!important;box-shadow:inset 0 0 0 1px var(--tr-hairline,rgba(53,44,39,.16))}
}
/* ==== Pariteit 27-10: nieuwe onderdelen, buiten de laag ==== */

/* 3. Het schilderij leeft: setshopper mo-drift (zoom tot 1,12 in 24 s, drift 1,2 %, heen en terug), eerste helft naar beneden.
      Eén klok voor elke pagina (--mo-phase uit site-navigation.js), zodat een volgende pagina doorloopt waar de vorige was. */
:root{--mo-zoom:1.12;--mo-dur:24s;--mo-drift:1.2%;--mo-dir-x:1;--mo-dir-y:1;--mo-cover:.034;--mo-vig:.3;--mo-breath-min:.67}
@media (prefers-reduced-motion:no-preference){
  html:is([data-family="listening"],[data-family="watching"],[data-family="reading"])[data-theme][data-system]:not([data-bg-motion="off"]) body::before{
    transform-origin:50% 50%;will-change:transform;
    animation:tr-bg-drift var(--mo-dur) ease-in-out var(--mo-phase,0s) infinite alternate!important;
  }
  html:not([data-bg-motion="off"]) .tr-vignette{animation:tr-bg-breath 9s ease-in-out var(--mo-phase,0s) infinite alternate}
}
@keyframes tr-bg-drift{
  0%{transform:translate(calc(var(--mo-drift)*-1*var(--mo-dir-x)),calc(var(--mo-drift)*-.6*var(--mo-dir-y))) scale(calc(1 + var(--mo-cover)))}
  100%{transform:translate(calc(var(--mo-drift)*var(--mo-dir-x)),calc(var(--mo-drift)*.6*var(--mo-dir-y))) scale(calc(var(--mo-zoom) + var(--mo-cover)))}
}
/* The parity drift owns transform. On wide landscape screens a second,
   independent clock pans the tall watercolor from top to bottom, so restoring
   the original painting motion never sacrifices the requested full setting. */
@media (min-width:700px) and (orientation:landscape) and (prefers-reduced-motion:no-preference) {
  html:is([data-family="listening"],[data-family="watching"],[data-family="reading"])[data-theme][data-system]:not([data-bg-motion="off"]) body::before {
    animation:
      tr-bg-drift var(--mo-dur) ease-in-out var(--mo-phase,0s) infinite alternate,
      tr-setting-landscape-pan 62.4s ease-in-out 0s infinite alternate!important;
  }
}
@keyframes tr-bg-breath{from{opacity:var(--mo-breath-min)}to{opacity:1}}
.tr-vignette{position:fixed;inset:-6%;z-index:-2;pointer-events:none;
  background:radial-gradient(ellipse at 50% 50%,transparent 45%,rgba(0,0,0,calc(var(--mo-vig)*1.6)) 100%)}
html[data-bg-motion="off"] .tr-vignette{opacity:1}
html[data-media-wall] .is-picked{animation:tr-picked 1.8s var(--tr-ease-out,ease-out)}
@keyframes tr-picked{0%,40%{box-shadow:0 0 0 3px var(--tr-focus-color,#2f6f7e)}100%{box-shadow:0 0 0 0 transparent}}
html[data-family="reading"] .media-wall .podcast-tile img{object-position:50% 12%}

/* 5. Het vergrootglas opent een veld waarin je typt. */
.titus-zoek{position:fixed;z-index:2000;left:50%;top:calc(var(--tr-nav-h,61px) + 10px);transform:translateX(-50%);
  width:min(560px,calc(100vw - 32px));display:block;padding:0;min-height:52px;
  border-radius:999px;background:var(--tr-paper-solid,#f8f1e5);color:var(--tr-ink,#352c27);
  box-shadow:0 10px 30px rgba(0,0,0,.18),inset 0 0 0 1px var(--tr-hairline,rgba(53,44,39,.16))}
.titus-zoek[hidden]{display:none}
/* Tegelmaat van de Watching- en Reading-muur: gelijk aan de Listening-tegels (desktop ±112 px, telefoon ±44 px, zes per rij). */
.media-wall .podcast-wall-grid{--wall-target:var(--lab-wall-target,112px)}
@media (max-width:600px){.media-wall .podcast-wall-grid{--wall-target:var(--lab-wall-target-m,44px)}}
.titus-zoek>svg{width:20px;height:20px;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}
.titus-zoek input{flex:1;min-width:0;border:0;background:transparent;color:inherit;font:400 17px/1.3 var(--tr-font-body,Georgia,serif);outline:none;padding:12px 0}
.titus-zoek input::-webkit-search-cancel-button{display:none}
.titus-zoek-x{flex:none;width:44px;height:44px;border:0;border-radius:50%;background:transparent!important;background-image:none!important;color:inherit;display:grid;place-items:center;cursor:pointer}
.titus-zoek-x svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}
html[data-theme="dark"] .titus-zoek{background:var(--tr-paper-solid,#26211d)}
@layer titus-editorial{html .titus-zoek input:is(*,:focus,:focus-visible,:hover){border:0!important;box-shadow:none!important;outline:none!important;background:transparent!important;min-height:0!important;height:auto!important;padding:12px 0!important;margin:0!important;border-radius:0!important}}
@layer titus-editorial{html .titus-zoek :is(input,button){background:transparent!important;background-image:none!important;border:0!important;box-shadow:none!important;outline:none!important;filter:none!important;animation:none!important}html .titus-zoek :is(input,button)::before,html .titus-zoek :is(input,button)::after{content:none!important;display:none!important}html .titus-zoek button:focus-visible{outline:2px solid var(--tr-focus-color,#2f6f7e)!important;outline-offset:2px}}
/* Hovertitel naast Your matches (Ben, 27-10). Alleen met een muis (data-wall-hover zet app.js); op de telefoon blijft de kop gecentreerd. */
@layer titus-editorial{html[data-wall-hover] .podcast-wall-head{display:grid!important;grid-template-columns:max-content minmax(0,1fr);column-gap:22px;row-gap:2px;align-items:center!important;justify-items:start;text-align:left!important}html[data-wall-hover] .podcast-wall-head>:not(.podcast-wall-hover){grid-column:1}html[data-wall-hover] .podcast-wall-head h2{text-align:left!important}html[data-wall-hover] .podcast-wall-hover{grid-column:2;grid-row:1/span 3;align-self:center;justify-self:stretch;margin:0;padding-left:22px;border-left:1px solid color-mix(in srgb,currentColor 22%,transparent);font-family:"Fraunces",Georgia,serif;font-style:italic;font-size:21px;line-height:1.2;text-wrap:balance;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;opacity:0;transform:translateX(-4px);transition:opacity .16s ease,transform .16s ease}html[data-wall-hover] .podcast-wall-hover.is-on{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){html[data-wall-hover] .podcast-wall-hover{transition:none;transform:none}}
/* Player altijd onderin en de playlistbalk met Discover more en Clear playlist (Ben, 28-10). */
@layer titus-editorial{html #titus-paper-room .room-matchbar{grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto!important}html #titus-paper-room[data-results-open="true"] .room-matchbar{grid-template-columns:minmax(0,1fr) auto!important}html #titus-paper-room .room-matchbar>.room-to-player{padding-inline:14px}html #titus-paper-room .room-to-player-count{background:color-mix(in srgb,currentColor 12%,transparent)!important}html .room-listen-bar{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin:0 0 12px;padding:4px 0}html .room-listen-bar[hidden]{display:none}html .room-listen-count{margin:0;font:500 11px/1.3 "Geist Mono",monospace;letter-spacing:.04em;color:var(--ed-muted)}html .room-listen-actions{display:flex;gap:8px;flex-wrap:wrap}html .room-listen-actions>button{min-height:40px!important;padding:8px 14px!important;font:600 13px/1.2 "Source Serif 4",serif!important}html #titus-paper-room .room-listen-actions>.room-listen-clear{color:var(--ed-danger,#9b2c1f)!important;border:1px solid color-mix(in srgb,var(--ed-danger,#9b2c1f) 45%,transparent)!important}html #titus-paper-room .room-listen-actions>.room-listen-clear.is-armed{background:var(--ed-danger,#9b2c1f)!important;color:#fff!important}}
@media (max-width:600px){html #titus-paper-room .room-to-player .room-action-label{display:none}}
/* Form-sheet: een gekozen optie is duidelijk gekozen, nu je er meerdere tegelijk kiest (Ben, 28-10). */
@layer titus-editorial{html .keuze-sheet .picker-format-group .chip[aria-pressed="true"]{background:var(--ed-accent)!important;background-image:none!important;color:var(--ed-on-accent)!important;border-color:var(--ed-accent)!important}html .keuze-sheet .picker-format-group .chip[aria-pressed="true"] *{color:inherit!important}}
/* Telefoon: de Player-knop is alleen icoon en aantal, zodat View episodes en Add hun ruimte houden. */
@layer titus-editorial{@media (max-width:600px){html #titus-paper-room .room-matchbar{grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto!important;column-gap:6px!important}html #titus-paper-room[data-results-open="true"] .room-matchbar{grid-template-columns:minmax(0,1fr) auto!important}html #titus-paper-room .room-matchbar>.room-to-player{padding-inline:8px!important;gap:4px!important}html #titus-paper-room .room-to-player-count{font-size:11px!important;line-height:1.2!important;padding:3px 5px!important}}}
/* Telefoon met volle playlist: de uitgeschakelde Add-knop wijkt voor View episodes en Player; de aantallen zijn klein. */
@layer titus-editorial{@media (max-width:600px){html #titus-paper-room .room-matchbar .room-result-count{font-size:11px!important;line-height:1.2!important;padding:3px 5px!important}html #titus-paper-room .room-matchbar>.room-add-matches[data-full="true"]{display:none!important}html #titus-paper-room .room-matchbar:has(>.room-add-matches[data-full="true"]){grid-template-columns:minmax(0,1fr) auto!important}}}
@layer titus-editorial{@media (max-width:600px){html #titus-paper-room .room-matchbar>.room-add-matches>svg{display:none!important}html #titus-paper-room .room-matchbar>.room-add-matches{white-space:normal!important;line-height:1.15!important;padding-inline:8px!important}html #titus-paper-room .room-matchbar>.room-add-matches .room-action-label{white-space:normal!important}}}