/* Four new destinations extend the original album's visual language. */
.berlin-title,.delhi-title{font:400 clamp(100px,10.7vw,174px)/.82 var(--serif);letter-spacing:-.025em}
.berlin-title>.title-line:first-child{font-size:.72em;line-height:.95;margin-bottom:8px}
.berlin-top{font-family:var(--sans);font-weight:500;letter-spacing:-.065em}
.berlin-title em{font-weight:400}
.delhi-title>.title-line:last-child{font-size:.61em;line-height:.94;margin-top:13px;letter-spacing:-.025em}
.delhi-subtitle{font-size:inherit;font-weight:400}
.chicago-title{font:700 clamp(94px,10.2vw,165px)/.87 var(--sans);letter-spacing:-.07em}
.chicago-outline{font-weight:400;-webkit-text-stroke:1px var(--ink);color:transparent;letter-spacing:-.035em}
.tokyo-title{font:600 clamp(110px,12vw,190px)/.84 var(--sans);letter-spacing:-.075em}
.tokyo-title>.title-line:last-child{font-size:.72em;line-height:.93;letter-spacing:-.025em;margin-top:6px}
.tokyo-subtitle{font-family:var(--serif);font-weight:400}
.scene[data-scene="2"] .scene-shade{background:linear-gradient(90deg,rgba(15,15,31,.54),rgba(15,15,31,.12) 58%,transparent 80%),linear-gradient(0deg,rgba(12,13,24,.95),rgba(12,13,24,.15) 55%,rgba(12,13,24,.05))}
.scene[data-scene="3"] .scene-shade{background:linear-gradient(90deg,rgba(31,10,10,.2),rgba(31,10,10,.08) 60%,transparent),linear-gradient(0deg,rgba(27,9,14,.94),rgba(27,9,14,.1) 55%,transparent)}
.scene[data-scene="4"] .scene-shade{background:linear-gradient(90deg,rgba(3,12,22,.43),transparent 85%),linear-gradient(0deg,rgba(3,10,20,.94),rgba(3,10,20,.1) 55%,transparent)}
.scene[data-scene="5"] .scene-shade{background:linear-gradient(90deg,rgba(5,12,28,.4),transparent 80%),linear-gradient(0deg,rgba(5,10,24,.94),rgba(5,10,24,.14) 50%,transparent)}
.scene[data-scene="2"] .scene-light{background:radial-gradient(ellipse at 72% 48%,rgba(255,210,165,.15),transparent 58%)}
.scene[data-scene="3"] .scene-light{background:radial-gradient(ellipse at 75% 58%,rgba(255,169,77,.22),transparent 58%)}
.scene[data-scene="4"] .scene-light{background:radial-gradient(ellipse at 75% 48%,rgba(150,212,255,.15),transparent 58%)}
.scene[data-scene="5"] .scene-light{background:radial-gradient(ellipse at 76% 68%,rgba(99,246,255,.2),transparent 42%),radial-gradient(ellipse at 64% 38%,rgba(255,91,179,.17),transparent 50%)}
body[data-track="berlin"] .player-bar{background:rgba(20,19,32,.65)}
body[data-track="delhi"] .player-bar{background:rgba(32,13,17,.65)}
body[data-track="chicago"] .player-bar{background:rgba(8,17,28,.65)}
body[data-track="tokyo"] .player-bar{background:rgba(8,14,31,.65)}
body[data-track="berlin"] .lyrics-modal{background:rgba(25,22,33,.98)}
body[data-track="delhi"] .lyrics-modal{background:rgba(31,14,19,.98)}
body[data-track="chicago"] .lyrics-modal{background:rgba(10,20,29,.98)}
body[data-track="tokyo"] .lyrics-modal{background:rgba(11,17,34,.98)}
body[data-track="berlin"] .orbit{color:#eed8ca}
body[data-track="delhi"] .orbit{color:#ffe0bd}
body[data-track="chicago"] .orbit{color:#c9e7f1}
body[data-track="tokyo"] .orbit{color:#bafafa}
.journey-label{gap:8px;font-size:6px}
.journey-stop{color:rgba(246,240,229,.33);transition:color .7s;white-space:nowrap}
.journey-stop.is-current{color:var(--accent)}
.journey-connector{display:block;width:13px;height:1px;background:rgba(246,240,229,.2)}
.journey-sub{margin-left:9px}
.next-copy strong{max-width:225px;line-height:1.05}
/* All six choices fit in a two-row editorial index on a desktop. */
.tracklist-modal{width:1100px;padding:27px 30px}
.tracklist-heading{margin:20px 0 23px}
.tracklist-heading h2{font-size:54px;line-height:.87}
.track-cards{grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}
.track-card{height:208px}
.tracklist-modal .card-number{top:16px;left:20px;right:20px;font-size:11px}
.tracklist-modal .card-number>span{font-size:5px;letter-spacing:.09em}
.tracklist-modal .card-title{top:66px;left:20px;font-size:42px;line-height:.88}
.tracklist-modal .saigon-card .card-title{top:62px;font-size:39px;line-height:.9}
.tracklist-modal .saigon-card .card-vietnamese{font-size:6px;margin-top:11px}
.tracklist-modal .berlin-card .card-title{font:500 35px/.87 var(--sans);letter-spacing:-.065em;top:64px}
.tracklist-modal .berlin-card .card-title em{font:italic 52px/.9 var(--serif);letter-spacing:-.02em}
.tracklist-modal .delhi-card .card-title{font-size:48px;top:60px}
.tracklist-modal .delhi-card .card-title em{font-size:32px}
.tracklist-modal .chicago-card .card-title{font:700 34px/.95 var(--sans);letter-spacing:-.07em;top:66px}
.card-outline{color:transparent;-webkit-text-stroke:.7px var(--ink);font-weight:400;letter-spacing:-.025em}
.tracklist-modal .tokyo-card .card-title{font:600 39px/.9 var(--sans);letter-spacing:-.07em;top:62px}
.tracklist-modal .tokyo-card .card-title em{font:italic 46px/.95 var(--serif);letter-spacing:-.025em}
.tracklist-modal .card-foot{left:20px;right:20px;bottom:16px;font-size:6px;letter-spacing:.11em}
.tracklist-modal .card-foot .icon{width:18px;height:18px}
.tracklist-modal .card-current{right:20px;bottom:45px;font-size:5px}
.tracklist-modal .modal-foot{margin-top:20px}
/* The selected upload slot remains reachable without a very tall dialog. */
.audio-slots{max-height:min(36dvh,305px);overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:rgba(246,240,229,.22) transparent;padding-right:6px}
.audio-slot{scroll-margin-top:8px;scroll-margin-bottom:8px}
.audio-modal h2{margin-top:29px}
.audio-modal[open]{display:flex;flex-direction:column}
.audio-modal .modal-top,.audio-modal h2,.audio-intro,.audio-format,.audio-privacy,.audio-done{flex-shrink:0}
.audio-slots{min-height:76px;flex:0 1 auto}
@media(max-width:1050px){
 .tracklist-modal{padding:25px}.track-cards{gap:12px}.track-card{height:195px}
 .tracklist-modal .card-title{font-size:37px;left:16px}.tracklist-modal .saigon-card .card-title{font-size:35px}
 .tracklist-modal .card-number,.tracklist-modal .card-foot{left:16px;right:16px}
 .tracklist-modal .card-number>span{font-size:4.5px}
 .tracklist-modal .chicago-card .card-title{font-size:29px}.tracklist-modal .delhi-card .card-title em{font-size:28px}
}
@media(max-height:780px) and (min-width:761px){
 .berlin-title,.delhi-title{font-size:clamp(85px,17vh,130px)}.chicago-title{font-size:clamp(82px,17vh,130px)}.tokyo-title{font-size:clamp(94px,18.5vh,143px)}
 .tracklist-heading{margin:15px 0 19px}.tracklist-heading h2{font-size:47px}.tracklist-modal{padding-top:23px;padding-bottom:23px}
 .track-card{height:191px}.tracklist-modal .modal-foot{margin-top:17px}.audio-modal h2{font-size:58px;margin:24px 0 21px}
}
@media(max-width:760px){
 .berlin-title{font-size:clamp(98px,24vw,142px)}.delhi-title{font-size:clamp(96px,24vw,146px)}
 .chicago-title{font-size:clamp(66px,18.1vw,130px)}.tokyo-title{font-size:clamp(92px,24vw,150px)}
 .berlin-title>.title-line:first-child{margin-bottom:6px}.delhi-title>.title-line:last-child{margin-top:10px}
 .scene-nav{left:var(--gutter);right:var(--gutter);justify-content:space-between;gap:0}
 .scene-nav button{min-width:32px}.journey-label{display:none}
 .scene[data-scene="2"] .scene-image{object-position:71% center}.scene[data-scene="3"] .scene-image{object-position:70% center}
 .scene[data-scene="4"] .scene-image{object-position:72% center}.scene[data-scene="5"] .scene-image{object-position:77% center}
 .tracklist-modal{padding:24px}.tracklist-heading h2{font-size:49px}
 .track-cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.track-card{height:195px}
 .tracklist-modal .card-number>span{font-size:5px}.tracklist-modal .card-title{font-size:38px}
 .tracklist-modal .berlin-card .card-title{font-size:32px}.tracklist-modal .berlin-card .card-title em{font-size:49px}
 .tracklist-modal .delhi-card .card-title{font-size:46px}.tracklist-modal .delhi-card .card-title em{font-size:28px}
 .tracklist-modal .tokyo-card .card-title{font-size:36px}.tracklist-modal .tokyo-card .card-title em{font-size:42px}
 .audio-slots{max-height:36dvh}.audio-slot{padding-top:15px;padding-bottom:15px}
}
@media(max-width:540px){
 .track-cards{grid-template-columns:1fr}.track-card{height:184px}
 .tracklist-heading{margin:22px 0}.tracklist-heading h2{font-size:48px}
 .tracklist-modal .card-number{top:14px}.tracklist-modal .card-number>span{font-size:6px}
 .tracklist-modal .card-title{font-size:42px;top:56px}.tracklist-modal .saigon-card .card-title{top:53px;font-size:37px}
 .tracklist-modal .berlin-card .card-title{top:55px;font-size:34px}.tracklist-modal .berlin-card .card-title em{font-size:50px}
 .tracklist-modal .delhi-card .card-title{top:50px}.tracklist-modal .delhi-card .card-title em{font-size:31px}
 .tracklist-modal .chicago-card .card-title{font-size:33px;top:58px}
 .tracklist-modal .tokyo-card .card-title{top:53px;font-size:37px}.tracklist-modal .tokyo-card .card-title em{font-size:44px}
 .tracklist-modal .card-current{bottom:42px}
}
@media(max-height:740px) and (max-width:760px){
 .berlin-title{font-size:clamp(80px,14.6vh,107px)}.delhi-title{font-size:clamp(80px,14.6vh,107px)}
 .chicago-title{font-size:clamp(64px,11.7vh,87px)}.tokyo-title{font-size:clamp(80px,14.6vh,107px)}
}
@media(max-height:590px) and (max-width:599px){
 .berlin-title,.delhi-title{font-size:clamp(70px,14.8vh,87px)}.chicago-title{font-size:clamp(60px,12.7vh,75px)}.tokyo-title{font-size:clamp(72px,15.2vh,90px)}
}
@media(max-height:510px) and (min-width:500px){
 .berlin-title,.delhi-title{font-size:clamp(66px,18vh,88px)}.chicago-title{font-size:clamp(62px,16.5vh,82px)}.tokyo-title{font-size:clamp(72px,19vh,94px)}
 .scene-nav{left:auto;right:9px;justify-content:flex-start;gap:0}.scene-nav button{min-height:24px;min-width:28px}
 .scene-nav button i{height:12px}.scene-nav button.is-active i{height:20px}
 .track-cards{grid-template-columns:repeat(3,minmax(0,1fr))}.track-card{height:180px}.tracklist-heading h2{font-size:41px}
 .tracklist-modal .card-title{font-size:31px}.tracklist-modal .saigon-card .card-title{font-size:29px}
 .tracklist-modal .berlin-card .card-title{font-size:26px}.tracklist-modal .berlin-card .card-title em{font-size:40px}
 .tracklist-modal .delhi-card .card-title{font-size:35px}.tracklist-modal .delhi-card .card-title em{font-size:23px}
 .tracklist-modal .chicago-card .card-title{font-size:25px}.tracklist-modal .tokyo-card .card-title{font-size:28px}.tracklist-modal .tokyo-card .card-title em{font-size:34px}
 .tracklist-modal .card-number>span{display:none}.tracklist-modal .card-foot{font-size:5px}
 .audio-slots{max-height:30dvh}.audio-modal h2{font-size:43px}
}

/* Public listening controls share the album's existing typography and palette. */
:root { --muted: rgba(246, 240, 229, .76); }
.site-header, .player-bar, .next-destination,
.track-content.is-active .hero-copy > * { animation: none; }
#main-content { touch-action: pinch-zoom; }
.brand { gap: 11px; text-align: left; }
.brand > img { width: 44px; height: 44px; }
.brand > span { font-size: 12px; letter-spacing: .12em; line-height: 1.5; }
.brand > span > span { display: block; color: var(--muted); font-size: 9px; letter-spacing: .15em; }
.header-manifesto { font-size: 10px; }
.header-actions .share-link { min-width: 44px; }
.share-link .icon { width: 19px; height: 19px; }
.hero-kicker { font-size: 11px; }
.track-mood { font-size: 10px; letter-spacing: .13em; }
.play-copy { font-size: 11px; }
.hero-lyrics { min-height: 44px; font-size: 11px; }
.close-button, .choose-file { width: 44px; height: 44px; }
.scene-nav button { min-width: 44px; min-height: 44px; color: var(--muted); }
.journey-stop { color: var(--muted); }
.player-bar {
  bottom: calc(56px + env(safe-area-inset-bottom, 0px));
  padding: 12px 20px;
  grid-template-columns: minmax(160px, 1fr) minmax(300px, 1.4fr) minmax(180px, 1fr);
  grid-template-areas: 'info transport tools' 'info timeline tools';
  column-gap: 28px;
  row-gap: 4px;
  min-height: 112px;
  background: rgba(7, 13, 24, .78);
  border-radius: 12px;
}
.player-track { grid-area: info; }
.player-cover { width: 52px; height: 52px; border-radius: 6px; }
.player-track-copy { gap: 6px; }
.player-track-copy strong { font-size: 12px; }
.player-track-copy button { font-size: 10px; min-height: 24px; }
.player-track-copy button.has-error { color: #ffb29c; text-decoration: underline; }
.playback-mode { color: var(--muted); font-size: 10px; line-height: 1.5; }
.transport { grid-area: transport; justify-content: center; gap: 8px; }
.transport .icon-button { width: 44px; height: 44px; min-width: 44px; }
.player-play { width: 48px; height: 48px; position: relative; flex-shrink: 0; }
.player-play.is-loading::after {
  content: ''; position: absolute; inset: -5px; border: 2px solid transparent;
  border-top-color: var(--accent); border-radius: 50%; animation: orbit-turn 1s linear infinite;
}
.mode-button {
  width: 48px; min-width: 44px; height: 48px; padding: 4px 0;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px;
  color: var(--muted); border: 1px solid transparent; border-radius: 8px;
  transition: color .2s, background .2s, border-color .2s;
}
.mode-button .icon { width: 18px; height: 18px; }
.mode-button span { font-size: 8px; line-height: 1.2; white-space: nowrap; }
.mode-button:hover { color: var(--ink); background: rgba(246, 240, 229, .06); }
.mode-button[aria-pressed='true'] { color: var(--accent); background: rgba(246, 240, 229, .08); border-color: var(--accent); }
.timeline { grid-area: timeline; width: 100%; gap: 10px; }
.time { font-size: 10px; min-width: 28px; }
input[type='range'] { height: 36px; }
input[type='range']::-webkit-slider-runnable-track { height: 3px; }
input[type='range']::-webkit-slider-thumb { width: 10px; height: 10px; margin-top: -3.5px; }
input[type='range']::-moz-range-thumb { width: 10px; height: 10px; }
.player-bar .player-tools { grid-area: tools; position: static; justify-content: flex-end; gap: 2px; }
.player-tools .icon-button { min-width: 44px; width: 44px; height: 44px; }
.volume-control { margin-right: 0; }
.volume-control input { width: 56px; }
.bottom-notes { bottom: calc(16px + env(safe-area-inset-bottom, 0px)); min-height: 24px; }
.bottom-notes > span { font-size: 8px; }
.stage-mode { bottom: calc(4px + env(safe-area-inset-bottom, 0px)); min-height: 44px; padding: 4px 14px; }
.stage-mode-copy > span, .stage-status { font-size: 8px; }
.stage-mode-copy > strong { font-size: 10px; }
.journey-label { bottom: calc(190px + env(safe-area-inset-bottom, 0px)); }
.next-destination { bottom: calc(192px + env(safe-area-inset-bottom, 0px)); }
.next-copy > span { font-size: 10px; }
.toast { bottom: calc(188px + env(safe-area-inset-bottom, 0px)); }
.eyebrow { font-size: 10px; }
.tracklist-heading { justify-content: flex-start; align-items: center; gap: 24px; }
.album-cover { flex-shrink: 0; border-radius: 6px; width: 112px; height: 112px; object-fit: cover; }
.tracklist-heading h2 { font-size: 48px; }
.tracklist-heading p { margin-left: auto; font-size: 12px; }
.tracklist-modal .card-number > span { font-size: 8px; }
.tracklist-modal .card-foot { font-size: 8px; }
.tracklist-modal .card-current { font-size: 8px; }
.modal-foot { align-items: center; gap: 16px; font-size: 9px; letter-spacing: .08em; }
.modal-foot .text-link { font-size: 11px; letter-spacing: 0; }
.audio-intro { font-size: 13px; }
.audio-slot strong { font-size: 13px; }
.audio-slot .eyebrow, .file-name, .audio-privacy { font-size: 11px; }
.audio-format { font-size: 9px; }
.share-modal { width: 500px; }
.share-modal h2 { font: 400 46px/1.1 var(--serif); }
.share-modal label { display: block; font-size: 13px; margin-bottom: 10px; }
.share-modal input {
  width: 100%; padding: 14px; color: var(--ink); background: rgba(255,255,255,.05);
  border: 1px solid var(--faint); border-radius: 6px; font: 13px var(--sans); margin-bottom: 20px;
}
.share-modal p { font-size: 12px; line-height: 1.6; color: var(--muted); }

@media (max-width: 1200px) {
  .player-bar { column-gap: 12px; grid-template-columns: minmax(150px,1fr) minmax(300px,1.5fr) auto; padding: 12px 16px; }
  .player-tools .motion-toggle { display: none; }
  .volume-control input { width: 40px; }
  .transport { gap: 4px; }
}
@media (max-width: 1000px) {
  .player-bar { grid-template-columns: minmax(135px,1fr) minmax(288px,1.6fr) auto; }
  .player-tools .volume-control input, .player-tools #fullscreen { display: none; }
  .player-bar .player-tools { gap: 0; }
  .player-track-copy strong { font-size: 11px; }
}
@media (max-width: 760px) {
  :root { --gutter: max(20px, env(safe-area-inset-left,0px), env(safe-area-inset-right,0px)); }
  .site-header { top: calc(18px + env(safe-area-inset-top,0px)); }
  .brand > span { font-size: 11px; letter-spacing: .07em; }
  .brand > span > span { font-size: 8px; letter-spacing: .08em; }
  .brand > img { width: 38px; height: 38px; }
  .header-actions { gap: 8px; }
  .header-divider, .share-link > span { display: none; }
  .tracklist-link .icon { display: none; }
  .header-actions .tracklist-link { font-size: 10px; }
  .hero-copy {
    top: calc(104px + env(safe-area-inset-top,0px)); bottom: calc(270px + env(safe-area-inset-bottom,0px));
    transform: none; display: flex; flex-direction: column; justify-content: center;
    max-width: calc(100% - 2 * var(--gutter));
  }
  .hero-kicker { font-size: 10px; margin-bottom: 22px; }
  .track-mood { font-size: 9px; letter-spacing: .08em; }
  .hero-actions { gap: 24px; }
  .play-copy, .hero-lyrics { font-size: 10px; }
  .player-bar {
    bottom: calc(58px + env(safe-area-inset-bottom,0px)); min-height: 0; padding: 12px 14px;
    grid-template-columns: minmax(0,1fr) auto; grid-template-areas: 'info tools' 'transport transport' 'timeline timeline';
    gap: 6px 8px;
  }
  .player-cover { width: 44px; height: 44px; }
  .player-track-copy { gap: 1px; }
  .player-track-copy strong { font-size: 12px; }
  .player-track-copy button { font-size: 9px; min-height: 20px; max-width: 205px; }
  .playback-mode { font-size: 9px; }
  .player-bar .player-tools { display: flex; }
  .player-tools .volume-control, .player-tools .motion-toggle, .player-tools #fullscreen { display: none; }
  .transport { justify-content: space-between; gap: 0; }
  .mode-button { width: 44px; height: 48px; }
  .timeline { gap: 8px; }
  .time { font-size: 10px; }
  .scene-nav { bottom: calc(248px + env(safe-area-inset-bottom,0px)); }
  .scene-nav button { min-width: 44px; min-height: 44px; font-size: 10px; padding: 5px; }
  .bottom-notes { bottom: calc(10px + env(safe-area-inset-bottom,0px)); min-height: 34px; }
  .bottom-notes > span { font-size: 7px; max-width: 88px; line-height: 1.6; }
  .stage-mode { min-width: 132px; min-height: 44px; padding: 4px 6px; bottom: calc(5px + env(safe-area-inset-bottom,0px)); }
  .stage-mode-copy > span, .stage-status { font-size: 6px; }
  .stage-mode-copy > strong { font-size: 8px; }
  .mobile-motion { min-height: 44px; font-size: 7px; }
  .toast { bottom: calc(250px + env(safe-area-inset-bottom,0px)); }
  .tracklist-heading { flex-wrap: wrap; gap: 16px; }
  .album-cover { width: 80px; height: 80px; }
  .tracklist-heading h2 { font-size: 37px; }
  .tracklist-heading p { display: none; }
  .modal-foot { font-size: 8px; }
  .modal-foot > span { max-width: 105px; text-align: right; line-height: 1.6; }
  .audio-format { flex-wrap: wrap; }
}
@media (max-height: 780px) and (max-width: 760px) {
  .hero-quote { display: none; }
  .hero-kicker { margin-bottom: 16px; }
  .hero-actions { margin-top: 18px; }
}
@media (min-height: 661px) and (max-height: 780px) and (max-width: 760px) {
  .hero-copy { bottom: calc(352px + env(safe-area-inset-bottom,0px)); }
}
@media (max-height: 660px) and (max-width: 599px) {
  .hero-copy { top: 88px; }
  .track-mood { display: none; }
  .hero-kicker { font-size: 9px; margin-bottom: 12px; }
  .hero-actions { margin-top: 14px; }
  .riviera-title { font-size: clamp(54px,12vh,72px); }
  .saigon-title { font-size: clamp(54px,12vh,70px); }
  .berlin-title { font-size: clamp(64px,13vh,78px); }
  .delhi-title { font-size: clamp(64px,12.5vh,74px); }
  .nights { display: inline-block; margin: 0 0 0 12px; font-size: .16em; letter-spacing: .2em; }
  .tokyo-title { font-size: clamp(64px,13vh,80px); }
  .chicago-title { font-size: clamp(52px,10.8vh,66px); }
  .scene-nav { left: auto; right: 8px; top: 82px; bottom: auto; flex-direction: column; width: 44px; }
  .scene-nav button { min-height: 40px; width: 44px; }
  .hero-actions { width: calc(100vw - 90px); gap: 12px; }
  .hero-play { flex: 1; min-width: 0; gap: 10px; }
  .play-orb { flex-shrink: 0; }
  .play-copy { min-width: 0; }
  .play-copy > span { font-size: 12px; line-height: 1.25; white-space: normal; }
  .hero-lyrics { white-space: nowrap; flex-shrink: 0; }
}
@media (max-width: 350px) {
  :root { --gutter: max(14px, env(safe-area-inset-left,0px), env(safe-area-inset-right,0px)); }
  .brand { gap: 6px; }
  .brand > span { font-size: 10px; }
  .brand > img { width: 32px; height: 32px; }
  .header-actions { gap: 0; }
  .player-bar { padding-left: 10px; padding-right: 10px; }
  .player-track-copy strong { font-size: 11px; }
  .player-track-copy button { max-width: 158px; }
  .hero-actions { gap: 16px; }
  .tracklist-modal { padding: 20px; }
  .album-cover { width: 60px; height: 60px; }
  .tracklist-heading h2 { font-size: 32px; }
}
@media (max-height: 510px) and (min-width: 500px) {
  .site-header { top: calc(10px + env(safe-area-inset-top,0px)); }
  .brand > img { width: 32px; height: 32px; }
  .brand > span { font-size: 10px; }
  .hero-copy { top: 72px; bottom: 104px; transform: none; justify-content: center; }
  .hero-quote, .track-mood { display: none; }
  .hero-kicker { font-size: 9px; margin-bottom: 12px; }
  .hero-actions { margin-top: 14px; }
  .player-bar {
    bottom: calc(10px + env(safe-area-inset-bottom,0px)); min-height: 68px; padding: 8px 10px;
    grid-template-columns: minmax(95px,1fr) 268px minmax(90px,1fr);
    grid-template-areas: 'info transport timeline'; gap: 10px;
  }
  .player-bar .player-tools { display: none !important; }
  .player-cover, .playback-mode { display: none; }
  .transport { gap: 0; justify-content: space-between; }
  .mode-button, .transport .icon-button { width: 44px; min-width: 44px; }
  .player-track-copy strong { font-size: 10px; }
  .player-track-copy button { font-size: 8px; }
  .scene-nav { left: auto; top: 46%; bottom: auto; right: 9px; flex-direction: column; transform: translateY(-50%); }
  .scene-nav button { min-height: 36px; min-width: 36px; }
  .stage-mode { top: 56px; bottom: auto; right: var(--gutter); left: auto; transform: none; }
  .toast { bottom: 90px; }
}