:root{--cream:#f7f2e7;--paper:#fffdf7;--navy:#091e31;--green:#00494d;--teal:#00858a;--red:#c74e32;--muted:#5e706e;--line:#d9d7c8;font-family:Arial,"Microsoft JhengHei","Noto Sans TC",sans-serif;color:var(--navy);background:var(--cream);font-synthesis:none}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:85px}body{margin:0;-webkit-font-smoothing:antialiased}button,a{-webkit-tap-highlight-color:transparent;touch-action:manipulation}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:3px solid var(--red);outline-offset:5px}img{display:block;max-width:100%;height:auto}[hidden]{display:none!important}::selection{background:var(--green);color:var(--cream)}.skip{position:absolute;top:-70px;left:20px;background:var(--paper);padding:15px;z-index:30}.skip:focus{top:12px}.wrap{width:min(1370px,90%);margin-inline:auto}.station-strip{padding:10px 5%;display:flex;justify-content:space-between;gap:20px;font-size:11px;letter-spacing:1.3px;background:var(--green);color:var(--cream)}.site-header{padding:25px 5%;display:flex;gap:30px;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.wordmark{display:flex;align-items:center;gap:12px;font-size:26px;letter-spacing:-1px;font-weight:800;white-space:nowrap}.wordmark small{display:block;font-size:9px;letter-spacing:3px;font-weight:600;margin-top:5px}.logo-mark{width:46px;height:46px;border:1px solid var(--green);border-radius:50%;display:grid;place-items:center;color:var(--green);position:relative;font-size:29px}.logo-mark:after{content:"";position:absolute;inset:3px;border:1px solid var(--green);border-radius:50%}.site-header nav{display:flex;gap:26px;font-size:15px;font-weight:600}.site-header nav a{padding:12px 0;white-space:nowrap}.site-header nav a[aria-current]{color:var(--green);border-bottom:2px solid var(--green)}.site-header nav a:hover{color:var(--teal)}.listen{display:inline-flex;gap:25px;align-items:center;border:1px solid var(--green);padding:16px 20px;font-size:14px;white-space:nowrap;font-weight:600}.listen:hover{background:var(--green);color:var(--cream)}.hero{padding-top:54px}.hero-top{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;margin-bottom:40px}.eyebrow{font-size:11px;letter-spacing:2px;font-weight:600;color:var(--green);line-height:1.8}.hero .eyebrow{display:flex;gap:12px;align-items:center}.eyebrow>span{height:7px;width:7px;background:var(--teal);border-radius:50%}h1{font-family:Arial,sans-serif;font-size:clamp(65px,10vw,150px);letter-spacing:-.075em;line-height:1;margin:22px 0}.dot{color:var(--red)}.hero-sub{font-size:clamp(18px,2vw,25px);letter-spacing:.07em;margin:20px 0 0}.hero-side{max-width:350px;padding-bottom:2px}.edition{font-size:10px;letter-spacing:1.6px;color:var(--muted)}.hero-side p{font-size:17px;line-height:1.9;margin:16px 0}.text-link{font-size:14px;border-bottom:1px solid var(--navy);padding-bottom:6px;display:inline-flex;gap:38px}.hero-frame{margin:0}.hero-frame img{width:100%;height:auto}.hero-frame figcaption{display:flex;justify-content:space-between;font-size:11px;letter-spacing:1px;padding:15px 0 25px;color:var(--muted)}.art-open{border:0;padding:0;position:relative;display:block;width:100%;background:#eee9df;overflow:hidden;cursor:zoom-in}.art-open img{width:100%;height:auto;object-fit:contain}.zoom{position:absolute;right:12px;bottom:12px;font-size:11px;letter-spacing:1px;padding:9px 12px;background:#fffdf7ed;opacity:0;transform:translateY(4px);transition:opacity .2s,transform .2s}.art-open:hover .zoom,.art-open:focus-visible .zoom{opacity:1;transform:translateY(0)}.chapter-nav{position:sticky;top:0;z-index:5;background:#f7f2e7f5;backdrop-filter:blur(12px);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.chapter-nav>div{display:flex;justify-content:space-between;gap:20px}.chapter-nav a{padding:23px 0;display:flex;gap:14px;font-size:14px;font-weight:600;white-space:nowrap}.chapter-nav a>span{color:var(--teal);font-size:11px}.chapter-nav a:hover{color:var(--teal)}.section{padding-block:80px;scroll-margin-top:0}.section-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;margin-bottom:36px}.section-heading h2{font-size:clamp(26px,3vw,43px);line-height:1.4;letter-spacing:-1px;margin:14px 0 0}.section-heading>p{font-size:15px;line-height:1.9;color:var(--muted);margin:0;max-width:440px}.art-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:42px 28px}.art-card{min-width:0}.art-caption{padding:18px 0 0;border-bottom:1px solid var(--line);padding-bottom:22px}.art-tag{font-size:10px;letter-spacing:1.5px;color:var(--teal);font-weight:700}.art-caption h3{font-size:21px;margin:9px 0 10px;font-weight:600}.art-caption p{font-size:14px;line-height:1.8;color:var(--muted);margin:0;max-width:600px}.cast-section{background:#eeeee3;border-block:1px solid var(--line)}.wardrobe-key{display:flex;align-items:center;gap:25px;flex-wrap:wrap;margin:-5px 0 32px;font-size:12px}.wardrobe-key>span{color:var(--muted)}.wardrobe-key b{display:inline-flex;align-items:center;gap:8px;font-weight:500}.swatch{height:13px;width:13px;border-radius:50%;border:1px solid #203d3b38}.brown{background:#50382a}.black-teal{background:linear-gradient(90deg,#162b2f 50%,#007588 50%)}.white-teal{background:linear-gradient(90deg,#f8f2de 50%,#007588 50%)}.filter-bar{display:flex;justify-content:space-between;gap:16px;align-items:center;margin-bottom:28px}.pose-filters{display:flex;gap:8px;flex-wrap:wrap}.pose-filters button{background:transparent;border:1px solid var(--line);padding:12px 17px;font-size:13px;min-height:44px}.pose-filters button span{font-size:10px;opacity:.65;margin-left:12px}.pose-filters button[aria-pressed=true]{color:var(--paper);background:var(--green);border-color:var(--green)}.pose-filters button:hover{border-color:var(--green)}#pose-count{font-size:12px;color:var(--muted);white-space:nowrap}.scene-section{background:#e7ede8;border-block:1px solid #ccd8ce}.section-note{font-size:12px;color:var(--muted);margin:28px 0 0;line-height:1.8}.closing{padding-block:80px;text-align:center}.closing h2{font-size:clamp(30px,4vw,53px);line-height:1.5;margin:22px 0 30px;font-weight:600}.closing>p{font-size:12px;color:var(--muted);margin-top:25px}.site-footer{background:var(--green);color:var(--cream);padding:42px 5%;display:flex;justify-content:space-between;align-items:center;gap:30px}.site-footer .wordmark{display:block}.site-footer p{font-size:12px;line-height:2}.site-footer>a:last-child{font-size:13px}dialog{border:0;padding:0;background:var(--paper);color:var(--navy);width:min(1500px,96vw);max-width:96vw;max-height:96dvh;border-radius:2px}dialog::backdrop{background:#061c20e8;backdrop-filter:blur(8px)}.viewer-top{display:flex;align-items:center;justify-content:space-between;padding:12px 20px;border-bottom:1px solid var(--line)}.viewer-top span{font-size:12px;letter-spacing:1px;color:var(--muted)}.viewer-top button{background:none;border:0;min-height:38px;font-size:14px}.viewer-image{display:flex;align-items:center;justify-content:center;position:relative;background:#eeeae1}.viewer-image img{display:block;max-height:70dvh;width:auto;max-width:100%;object-fit:contain}.viewer-image button{position:absolute;top:50%;transform:translateY(-50%);border:1px solid #ccd6cf;background:#fffdf7ed;width:42px;height:52px;font-size:34px;z-index:1}#viewer-prev{left:10px}#viewer-next{right:10px}.viewer-bottom{padding:17px 22px;display:flex;gap:20px;align-items:center;justify-content:space-between}#viewer-id{font-size:10px;letter-spacing:1.5px;color:var(--teal);margin:0 0 5px}#viewer-title{font-size:20px;margin:0 0 6px}#viewer-note{font-size:13px;line-height:1.7;color:var(--muted);margin:0}#viewer-download{font-size:13px;white-space:nowrap;border-bottom:1px solid var(--green);padding-bottom:4px}.viewer-open{overflow:hidden}
@media(max-width:1100px){.site-header{flex-wrap:wrap;gap:18px}.site-header nav{order:3;justify-content:space-between;width:100%;border-top:1px solid var(--line);padding-top:10px}.hero-top{gap:30px}.hero-side{max-width:310px}.hero-side p{font-size:15px}.section-heading{display:block}.section-heading>p{margin-top:20px;max-width:none}}
@media(max-width:650px){html{scroll-padding-top:69px}.wrap{width:90%}.station-strip{font-size:9px;letter-spacing:.4px}.station-strip>span:last-child{display:none}.site-header{padding:20px 5%;gap:15px}.wordmark{font-size:23px;gap:9px}.wordmark small{font-size:7px;letter-spacing:2px}.logo-mark{width:38px;height:38px;font-size:25px}.site-header>.listen{font-size:11px;gap:7px;padding:11px 9px}.site-header nav{gap:12px;font-size:13px}.hero{padding-top:32px}.hero-top{display:block;margin-bottom:28px}h1{font-size:clamp(65px,15vw,92px)}.hero-side{margin-top:28px;max-width:none}.hero-side p{font-size:15px;display:inline}.hero-side p br{display:none}.edition{display:block;margin-bottom:10px}.hero-side .text-link{display:flex;width:max-content;margin-top:15px}.hero-sub{font-size:18px}.hero-frame figcaption{font-size:9px;letter-spacing:0;gap:10px;line-height:1.6}.chapter-nav>div{gap:5px;justify-content:space-between}.chapter-nav a{font-size:11px;padding:21px 0;gap:5px}.chapter-nav a>span{font-size:9px}.section{padding-block:48px}.section-heading{margin-bottom:26px}.section-heading h2{font-size:28px;letter-spacing:-.6px}.section-heading>p{font-size:14px}.art-grid{grid-template-columns:1fr;gap:29px}.art-caption h3{font-size:20px}.art-caption p{font-size:13px}.wardrobe-key{gap:12px;font-size:11px}.wardrobe-key>span{width:100%}.filter-bar{display:block}.pose-filters{gap:6px}.pose-filters button{font-size:12px;padding:10px 12px}.pose-filters button span{margin-left:6px}#pose-count{display:block;margin-top:12px}.zoom{opacity:1;transform:none;padding:6px 9px;font-size:10px}.closing{padding-block:50px}.closing h2{font-size:32px}.closing .listen{font-size:13px;gap:14px;padding:16px}.site-footer{flex-wrap:wrap;padding-block:30px}.site-footer p{order:3;width:100%;margin:0}.site-footer .wordmark{font-size:24px}.viewer-image img{max-height:62dvh}.viewer-bottom{align-items:flex-start;flex-wrap:wrap;padding:15px}#viewer-note{font-size:12px}.viewer-image button{width:34px;height:44px;font-size:29px}#viewer-prev{left:3px}#viewer-next{right:3px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}

/* MV-only type scale, aligned with the Music Station homepage. */
body {font-size:18px; line-height:1.85}
body > .station-strip {font-size:12px; line-height:1.6; letter-spacing:.8px; min-height:40px; align-items:center}
body > .site-header {min-height:110px; padding-top:18px; padding-bottom:18px; gap:24px}
body > .site-header .wordmark {font-size:28px; letter-spacing:-.8px}
body > .site-header .wordmark small {font-size:11px; letter-spacing:2px}
body > .site-header .logo-mark {width:48px; height:48px; font-size:30px; flex-shrink:0}
body > .site-header nav {font-size:16px; gap:28px; flex-wrap:wrap}
body > .site-header nav a {min-height:44px; display:inline-flex; align-items:center}
.listen {font-size:16px; line-height:1.5; min-height:56px; padding:15px 18px; gap:16px; justify-content:center}
#main .hero-top > div {min-width:0}
#main .hero h1 {font-size:clamp(44px,5vw,79px); line-height:1.35; font-weight:800; letter-spacing:-3px}
#main .hero-sub, #main .hero-side p {font-size:20px; line-height:1.85; letter-spacing:0}
#main .eyebrow {font-size:13px; line-height:1.6; letter-spacing:.7px}
#main .hero .eyebrow, #main .edition {font-size:12px; line-height:1.6; letter-spacing:.8px}
#main .text-link {font-size:16px; line-height:1.7; min-height:56px; align-items:center}
#main .hero-frame figcaption {font-size:14px; line-height:1.7; letter-spacing:.4px; gap:16px; flex-wrap:wrap}
#main .zoom {font-size:14px; line-height:1.6; letter-spacing:.4px}
#main .chapter-nav a {font-size:16px; line-height:1.5; min-height:56px; align-items:center}
#main .chapter-nav a > span {font-size:12px}
#main .section-heading {align-items:center}
#main .section-heading > div, #main .section-heading > p {min-width:0}
#main .section-heading h2, #main .closing h2 {font-size:clamp(34px,3.5vw,54px); line-height:1.45; font-weight:700; letter-spacing:-1.9px}
#main .section-heading > p, #main .art-caption p {font-size:18px; line-height:1.85}
#main .art-caption h3 {font-size:20px; line-height:1.6}
#main .art-tag {font-size:13px; line-height:1.6; letter-spacing:.7px}
#main .wardrobe-key {font-size:14px; line-height:1.7; gap:16px 25px}
#main .pose-filters button {font-size:16px; line-height:1.5; min-height:56px; padding:15px 17px}
#main .pose-filters button span {font-size:12px}
#main #pose-count, #main .section-note, #main .closing > p {font-size:14px; line-height:1.7}
body > .site-footer .wordmark {font-size:36px}
body > .site-footer .wordmark small {font-size:11px; letter-spacing:2px}
body > .site-footer p {font-size:12px; line-height:1.7}
body > .site-footer > a:last-child {font-size:15px; line-height:1.7; min-height:44px; display:inline-flex; align-items:center}
#viewer .viewer-top {gap:16px}
#viewer .viewer-top span, #viewer-id {font-size:14px; line-height:1.7}
#viewer .viewer-top button, #viewer-download {font-size:16px; line-height:1.5; min-height:56px; display:inline-flex; align-items:center}
#viewer-title {font-size:20px; line-height:1.6}
#viewer-note {font-size:18px; line-height:1.85}
#viewer .viewer-bottom > div {min-width:0}
#viewer .viewer-image button {min-width:44px; min-height:56px}

@media (max-width:1100px) {
 #main .hero h1 {font-size:54px}
 #main .section-heading > p {margin-top:24px}
}
@media (max-width:800px) {
 body > .site-header .wordmark {font-size:26px}
 #main .hero h1 {font-size:44px; letter-spacing:-2px}
 #main .hero-sub, #main .hero-side p {font-size:18px}
 #main .section-heading h2, #main .closing h2 {font-size:34px}
}
@media (max-width:600px) {
 html {scroll-padding-top:116px}
 body {font-size:16px}
 body > .station-strip {font-size:12px; line-height:1.6; letter-spacing:.4px}
 body > .site-header {display:grid; grid-template-columns:minmax(0,1fr); gap:14px; padding-top:18px; padding-bottom:18px}
 body > .site-header .wordmark {grid-row:1}
 body > .site-header > .listen {grid-row:2; justify-self:start}
 body > .site-header nav {grid-row:3; order:initial; justify-content:flex-start; gap:10px 16px; font-size:15px}
 #main .hero h1 {font-size:55px; line-height:1.27; letter-spacing:-2px}
 #main .hero-sub, #main .hero-side p {font-size:16px; line-height:1.85}
 #main .eyebrow, #main .hero .eyebrow, #main .edition {font-size:12px; line-height:1.6; letter-spacing:.4px}
 #main .hero-frame figcaption {font-size:12px; line-height:1.7}
 #main .chapter-nav > div {display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 16px}
 #main .chapter-nav a {font-size:15px; min-height:48px; padding:12px 0; gap:8px}
 #main .chapter-nav a > span {font-size:12px}
 #main .section-heading h2, #main .closing h2 {font-size:35px; line-height:1.45; letter-spacing:-1.4px}
 #main .section-heading > p, #main .art-caption p {font-size:16px; line-height:1.85}
 #main .art-caption h3 {font-size:18px; line-height:1.6}
 #main .art-tag {font-size:12px}
 #main .wardrobe-key {font-size:12px; gap:12px}
 #main #pose-count, #main .section-note, #main .closing > p {font-size:13px; line-height:1.7}
 #main .zoom {font-size:12px; line-height:1.6}
 body > .site-footer .wordmark {font-size:34px}
 #viewer .viewer-top {padding:12px 15px}
 #viewer .viewer-top span, #viewer-id {font-size:12px}
 #viewer-title {font-size:18px; line-height:1.6}
 #viewer-note {font-size:16px; line-height:1.85}
}

/* MV header: the same five destinations and responsive rhythm as the homepage. */
body > .site-header {padding-inline:4.5%; flex-wrap:nowrap; background:var(--cream); position:relative; z-index:3}
body > .site-header .wordmark small {margin-top:3px}
body > .site-header nav {order:initial; width:auto; padding-top:0; border-top:0; justify-content:flex-start; font-size:16px; line-height:1.5; gap:28px}
body > .site-header nav a {display:block; min-height:44px; padding:10px 0; white-space:nowrap}
body > .site-header nav a > span:first-child {font-size:12px; margin-right:8px; color:var(--teal)}
body > .site-header nav a > span:last-child {font:inherit; color:inherit; letter-spacing:inherit}
body > .site-header nav .nav-artbook, body > .site-header nav .nav-systems {color:var(--green)}
body > .site-header nav a[aria-current="page"] {border-bottom:0; box-shadow:inset 0 -2px 0 var(--green)}
body > .site-header .header-actions {display:flex; align-items:center; justify-content:flex-end; gap:17px; min-width:0}
body > .site-header .header-actions .listen {flex-shrink:0}
@media (min-width:601px) and (max-width:1700px) {
 body > .site-header {display:grid; grid-template-columns:1fr auto; gap:16px 24px}
 body > .site-header .wordmark {grid-column:1; grid-row:1}
 body > .site-header .header-actions {grid-column:2; grid-row:1; border:0; padding-top:0}
 body > .site-header nav {grid-column:1/-1; grid-row:2; justify-content:center; flex-wrap:wrap; gap:14px 30px; border-top:1px solid var(--line); padding-top:10px}
}
@media (min-width:601px) and (max-width:800px) {
 body > .site-header .header-actions {grid-column:1/-1; grid-row:2}
 body > .site-header nav {grid-row:3}
}
@media (max-width:800px) {
 body > .site-header nav a > span:first-child {display:none}
}
@media (max-width:600px) {
 body > .site-header {grid-template-columns:minmax(0,1fr); gap:14px; padding-top:18px; padding-bottom:18px}
 body > .site-header .wordmark {grid-column:1/-1; grid-row:1}
 body > .site-header .header-actions {grid-column:1/-1; grid-row:2; justify-content:flex-start; border-top:1px solid var(--line); padding-top:12px; width:100%}
 body > .site-header nav {grid-column:1/-1; grid-row:3; justify-content:space-between; flex-wrap:wrap; gap:10px 16px; font-size:15px; border-top:0; padding-top:0}
}

/* The Music Station uses its shared blue icon; the wordmark remains text. */
body > .site-header .logo-mark.site-icon {
 display:block; width:48px; height:48px; min-width:48px; flex:0 0 48px;
 object-fit:contain; border:0; border-radius:0; padding:0;
 background:transparent; box-shadow:none;
}
body > .site-header .logo-mark.site-icon::before,
body > .site-header .logo-mark.site-icon::after {content:none; display:none}