@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;1,400&family=Manrope:wght@300;400;500;600&display=swap');

:root {
  --paper: #fffafd;
  --paper-2: #f8edf3;
  --blush: #f0ccd9;
  --rose: #d99ab3;
  --rose-deep: #a95f83;
  --mist: #ded7eb;
  --blue-mist: #d9eaf3;
  --ink: #3e2b3b;
  --muted: #786876;
  --line: rgba(169, 95, 131, .22);
  --night: #211827;
  --plum: #3a2644;
  --plum-2: #50304f;
  --wine: #6c3b59;
  --glow: rgba(230, 176, 201, .48);
  --content: 1240px;
  --radius: 28px;
  --ease: cubic-bezier(.2,.7,.2,1);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: Manrope, sans-serif;
  color: var(--ink);
  background:
    radial-gradient(circle at 18% 12%, rgba(255,255,255,.95), transparent 29%),
    radial-gradient(circle at 84% 22%, rgba(217,234,243,.68), transparent 28%),
    linear-gradient(145deg, #fffafd 0%, #f9edf4 48%, #f0e7f3 100%);
  min-height: 100vh;
  overflow-x: hidden;
}
body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 50;
  opacity: .18;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120' viewBox='0 0 120 120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.95' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.05'/%3E%3C/svg%3E");
}
a { color: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button { font: inherit; }

/* ---------- Shared chrome ---------- */
.shell { width: min(var(--content), calc(100% - 48px)); margin: 0 auto; }
.site-header {
  position: fixed;
  inset: 0 0 auto 0;
  height: 84px;
  z-index: 40;
  display: flex;
  align-items: center;
  background: linear-gradient(to bottom, rgba(255,250,253,.82), rgba(255,250,253,.24), transparent);
  backdrop-filter: blur(12px);
}
.header-inner { display:flex; align-items:center; justify-content:space-between; gap:22px; }
.header-controls { display:flex; align-items:center; gap:10px; flex:0 0 auto; }
.brand {
  text-decoration:none;
  font-family:"Cormorant Garamond", serif;
  font-size:31px;
  letter-spacing:.04em;
  font-weight:600;
}
.brand-dot { color: var(--rose-deep); }
.main-nav { display:flex; gap:10px; align-items:center; }
.main-nav a {
  position: relative;
  text-decoration:none;
  font-size:13px;
  letter-spacing:.08em;
  text-transform:uppercase;
  padding:10px 12px;
  color: var(--muted);
  transition: color .25s ease;
}
.main-nav a::after {
  content:"";
  position:absolute;
  left:12px; right:12px; bottom:4px;
  height:1px;
  transform:scaleX(0);
  transform-origin:center;
  background:var(--rose-deep);
  transition:transform .3s var(--ease);
}
.main-nav a:hover, .main-nav a[aria-current="page"] { color: var(--ink); }
.main-nav a:hover::after, .main-nav a[aria-current="page"]::after { transform:scaleX(1); }
.menu-button {
  display:none;
  width:42px;height:42px;border:1px solid var(--line);border-radius:50%;
  background:rgba(255,255,255,.62); color:var(--ink); cursor:pointer;
}
.menu-button svg { width:18px;height:18px; }

/* ---------- Ambient / game layers ---------- */
.ambient-scene { position:fixed; inset:0; pointer-events:none; z-index:-1; overflow:hidden; }
.orb { position:absolute; border-radius:50%; filter:blur(12px); opacity:.35; animation:drift 16s ease-in-out infinite alternate; }
.orb.a { width:340px;height:340px;left:-90px;top:17%; background:rgba(236,174,202,.35); }
.orb.b { width:420px;height:420px;right:-140px;top:5%; background:rgba(190,215,235,.4); animation-delay:-4s; }
.orb.c { width:300px;height:300px;left:47%;bottom:-130px;background:rgba(190,165,214,.26); animation-delay:-7s; }
@keyframes drift { from{transform:translate3d(0,0,0) scale(1)} to{transform:translate3d(22px,-18px,0) scale(1.08)} }

.butterfly {
  position:fixed;
  width:24px;height:18px;
  z-index:10;
  pointer-events:none;
  opacity:.72;
  filter:drop-shadow(0 0 9px rgba(213,132,171,.28));
  animation:fly var(--dur,18s) linear infinite;
}
.butterfly::before,.butterfly::after {
  content:"";position:absolute;top:2px;width:12px;height:15px;
  background:linear-gradient(150deg,rgba(255,255,255,.94),rgba(238,184,208,.78));
  border:1px solid rgba(183,104,144,.24);
}
.butterfly::before{left:0;border-radius:80% 25% 70% 30%;transform-origin:100% 60%;animation:wingL .72s ease-in-out infinite alternate}
.butterfly::after{right:0;border-radius:25% 80% 30% 70%;transform-origin:0 60%;animation:wingR .72s ease-in-out infinite alternate}
@keyframes wingL{to{transform:scaleX(.32) rotate(-6deg)}}
@keyframes wingR{to{transform:scaleX(.32) rotate(6deg)}}
@keyframes fly{from{transform:translate3d(var(--x1),110vh,0) rotate(-8deg)}50%{transform:translate3d(var(--x2),45vh,0) rotate(8deg)}to{transform:translate3d(var(--x3),-20vh,0) rotate(-7deg)}}

/* ---------- Home ---------- */
.home-main { min-height:100svh; position:relative; }
.home-hero {
  min-height:100svh;
  padding:140px 0 80px;
  display:grid;
  grid-template-columns:minmax(0,1.02fr) minmax(360px,.98fr);
  align-items:center;
  gap:clamp(36px,7vw,110px);
}
.hero-copy { position:relative; z-index:2; }
.kicker { display:flex;align-items:center;gap:12px;font-size:11px;text-transform:uppercase;letter-spacing:.24em;color:var(--rose-deep); }
.kicker::before { content:""; width:34px;height:1px;background:var(--rose-deep);opacity:.55; }
.hero-copy h1 { margin:20px 0 0;font-family:"Cormorant Garamond",serif;font-weight:500;font-size:clamp(88px,10vw,156px);line-height:.78;letter-spacing:-.055em; }
.hero-copy .subtitle { margin:22px 0 0;font-family:"Cormorant Garamond",serif;font-size:clamp(24px,2.2vw,37px);font-style:italic;color:#74566d; }
.hero-copy .hero-line { width:min(560px,100%);margin:32px 0 0;font-size:15px;line-height:1.9;color:var(--muted); }
.hero-actions { margin-top:38px;display:flex;gap:14px;align-items:center;flex-wrap:wrap; }
.cta { display:inline-flex;align-items:center;gap:14px;text-decoration:none;border:1px solid rgba(135,77,105,.26);border-radius:999px;padding:13px 19px 13px 23px;background:rgba(255,255,255,.52);backdrop-filter:blur(10px);box-shadow:0 14px 34px rgba(105,67,94,.08);transition:transform .35s var(--ease),box-shadow .35s var(--ease),background .35s ease; }
.cta:hover { transform:translateY(-3px);box-shadow:0 18px 44px rgba(105,67,94,.14);background:rgba(255,255,255,.75); }
.cta .arrow { width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:var(--ink);color:#fff; }
.cta .arrow svg { width:15px;height:15px; }
.text-link { text-decoration:none;font-size:13px;color:var(--muted);padding:10px; }
.text-link:hover { color:var(--ink); }

.hero-visual { min-height:620px;position:relative;display:grid;place-items:center; }
.character-stage {
  width:min(500px,82vw);
  height:620px;
  position:relative;
  display:grid;
  place-items:end center;
  transition:transform .55s var(--ease);
}
.character-aura { position:absolute;border-radius:50%;pointer-events:none;filter:blur(10px); }
.character-aura.aura-one { width:420px;height:500px;top:38px;left:50%;transform:translateX(-50%);background:radial-gradient(circle,rgba(255,255,255,.96) 0%,rgba(239,201,219,.42) 40%,rgba(205,214,235,.22) 62%,transparent 76%); }
.character-aura.aura-two { width:260px;height:260px;right:-10px;top:54px;background:radial-gradient(circle,rgba(220,212,236,.58),transparent 70%);opacity:.7; }
.character-art-slot {
  position:relative;
  width:min(390px,72vw);
  height:560px;
  display:grid;
  place-items:end center;
  padding-bottom:26px;
  isolation:isolate;
}
.character-art-slot::before {
  content:"";
  position:absolute;
  inset:6% 5% 0;
  border-radius:48% 48% 18% 18% / 25% 25% 8% 8%;
  background:linear-gradient(180deg,rgba(255,255,255,.30),rgba(246,224,235,.16) 55%,rgba(73,43,73,.05));
  border:1px dashed rgba(169,95,131,.22);
  box-shadow:0 36px 80px rgba(84,51,74,.10), inset 0 0 80px rgba(255,255,255,.46);
  backdrop-filter:blur(2px);
}
.character-art-slot::after {
  content:"";
  position:absolute;
  left:14%;right:14%;bottom:7%;height:1px;
  background:linear-gradient(90deg,transparent,rgba(169,95,131,.34),transparent);
}
.character-art-label {
  position:relative;
  z-index:2;
  font-size:10px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:#a28196;
  padding:8px 12px;
  border-radius:999px;
  background:rgba(255,250,253,.62);
  backdrop-filter:blur(8px);
}
.character-dark-seep {
  position:absolute;
  width:300px;
  height:120px;
  right:-18px;
  bottom:20px;
  border-radius:55% 45% 50% 50%;
  background:radial-gradient(circle at 35% 18%,rgba(112,60,94,.62),rgba(54,30,63,.82) 58%,rgba(31,24,37,.9));
  filter:blur(5px);
  opacity:.34;
  transform:rotate(-6deg);
  animation:characterSeep 8s ease-in-out infinite alternate;
}
@keyframes characterSeep { to { transform:translateY(-12px) rotate(-3deg) scaleX(1.05); opacity:.46; } }
.home-index { border-top:1px solid var(--line);padding:42px 0 72px; }
.home-index-grid { display:grid;grid-template-columns:repeat(6,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:24px;overflow:hidden;box-shadow:0 22px 60px rgba(84,51,74,.07); }
.home-index a { min-height:122px;background:rgba(255,252,254,.74);text-decoration:none;padding:22px;display:flex;flex-direction:column;justify-content:space-between;transition:background .3s ease, transform .3s var(--ease); }
.home-index a:hover { background:rgba(255,255,255,.96); }
.home-index small{font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:#a37a91}.home-index strong{font-family:"Cormorant Garamond",serif;font-size:24px;font-weight:500}.home-index svg{width:18px;height:18px;color:var(--rose-deep)}

/* ---------- Inner pages ---------- */
.page { min-height:100vh;padding-top:84px; }
.page-hero { padding:96px 0 58px; }
.page-hero-inner { display:grid;grid-template-columns:1fr auto;gap:40px;align-items:end;border-bottom:1px solid var(--line);padding-bottom:42px; }
.page-hero h1 { font-family:"Cormorant Garamond",serif;font-size:clamp(64px,8vw,112px);line-height:.86;font-weight:500;letter-spacing:-.045em;margin:14px 0 0; }
.page-hero p { max-width:620px;color:var(--muted);line-height:1.8;margin:18px 0 0; }
.page-mark { width:92px;height:92px;border-radius:50%;border:1px solid var(--line);display:grid;place-items:center;background:rgba(255,255,255,.46);box-shadow:0 14px 40px rgba(90,56,78,.08); }
.page-mark svg{width:38px;height:38px;stroke-width:1.2;color:var(--rose-deep)}

.language-switch { display:inline-flex;border:1px solid var(--line);border-radius:999px;padding:4px;background:rgba(255,255,255,.56);backdrop-filter:blur(10px); }
.site-language-switch { box-shadow:0 8px 24px rgba(84,51,74,.06); }
.language-switch button { border:0;border-radius:999px;padding:9px 14px;background:transparent;color:var(--muted);font-size:11px;letter-spacing:.08em;cursor:pointer;transition:.25s ease;white-space:nowrap; }
.language-switch button.active { background:var(--ink);color:#fff;box-shadow:0 8px 18px rgba(61,42,59,.16); }

/* Lore */
.lore-layout { display:grid;grid-template-columns:210px minmax(0,760px) 1fr;gap:56px;padding:38px 0 120px;align-items:start; }
.lore-rail { position:sticky;top:122px;display:flex;flex-direction:column;gap:12px;color:#9c7a91;font-size:11px;letter-spacing:.12em;text-transform:uppercase; }
.lore-rail::before { content:"";width:1px;height:80px;background:linear-gradient(var(--rose-deep),transparent);margin-bottom:8px; }
.lore-story { position:relative; }
.lore-story [data-lang] { display:none; }
.lore-story [data-lang].active { display:block;animation:fadeIn .45s ease; }
@keyframes fadeIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.lore-story .lead { font-family:"Cormorant Garamond",serif;font-size:clamp(28px,3.1vw,42px);line-height:1.28;color:#4d3648;margin:0 0 42px; }
.lore-story p { font-size:16px;line-height:2;color:#6f5f6d;margin:0 0 28px; }
.lore-story .turn { margin:66px 0;padding:44px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);position:relative; }
.lore-story .turn strong { display:block;font-family:"Cormorant Garamond",serif;font-size:clamp(35px,4.6vw,65px);line-height:1.04;font-weight:500;color:#452c46;max-width:650px; }
.lore-story .turn::after { content:"";position:absolute;right:-14%;top:50%;width:170px;height:170px;border-radius:50%;background:radial-gradient(circle,rgba(95,52,84,.18),transparent 68%);filter:blur(7px); }
.lore-story h2 { margin:70px 0 24px;font-family:"Cormorant Garamond",serif;font-size:37px;font-weight:500; }
.world-notes { margin-top:34px;border-top:1px solid var(--line); }
.world-note { display:grid;grid-template-columns:180px 1fr;gap:34px;padding:24px 0;border-bottom:1px solid var(--line); }
.world-note h3 { margin:0;font-family:"Cormorant Garamond",serif;font-size:23px;font-weight:500; }
.world-note p { margin:0;font-size:14px;line-height:1.8; }
.lore-art { position:sticky;top:124px;min-height:540px; }
.lore-art .dream-bloom { position:absolute;right:10%;top:8%;width:220px;height:220px;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.95),rgba(234,181,206,.32) 35%,transparent 68%);filter:blur(1px); }
.lore-art .dark-bloom { position:absolute;right:-14%;bottom:2%;width:320px;height:320px;border-radius:44% 56% 41% 59%;background:radial-gradient(circle at 35% 35%,rgba(121,63,100,.85),rgba(48,29,57,.92) 48%,transparent 72%);filter:blur(10px);opacity:.62; }
.lore-art .thread { position:absolute;top:30px;right:41%;width:1px;height:440px;background:linear-gradient(transparent,rgba(184,115,150,.42),rgba(80,45,76,.65),transparent);transform:rotate(8deg); }
.lore-art .moth { position:absolute;right:29%;top:165px;width:58px;height:45px;filter:drop-shadow(0 0 14px rgba(185,113,149,.24)); }
.lore-art .moth::before,.lore-art .moth::after { content:"";position:absolute;top:0;width:30px;height:42px;border:1px solid rgba(138,78,109,.36);background:linear-gradient(145deg,rgba(255,255,255,.8),rgba(230,170,199,.45)); }
.lore-art .moth::before{left:0;border-radius:92% 24% 75% 30%;transform:rotate(-18deg)}.lore-art .moth::after{right:0;border-radius:24% 92% 30% 75%;transform:rotate(18deg)}

/* Generic content pages */
.editorial-section { padding:28px 0 110px; }
.editorial-grid { display:grid;grid-template-columns:repeat(12,1fr);gap:24px; }
.editorial-card { border-top:1px solid var(--line);padding-top:18px;min-height:180px; }
.editorial-card h2,.editorial-card h3{font-family:"Cormorant Garamond",serif;font-weight:500;margin:6px 0 10px}.editorial-card h2{font-size:36px}.editorial-card h3{font-size:28px}.editorial-card p{color:var(--muted);line-height:1.8;margin:0}.editorial-card a{display:inline-flex;margin-top:18px;text-decoration:none;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--rose-deep)}
.span-4{grid-column:span 4}.span-5{grid-column:span 5}.span-6{grid-column:span 6}.span-7{grid-column:span 7}.span-8{grid-column:span 8}.span-12{grid-column:span 12}
.feature-panel { min-height:330px;border-radius:34px;border:1px solid var(--line);background:linear-gradient(145deg,rgba(255,255,255,.62),rgba(247,232,241,.46));box-shadow:0 26px 70px rgba(84,51,74,.08);padding:34px;position:relative;overflow:hidden; }
.feature-panel::after{content:"";position:absolute;width:220px;height:220px;border-radius:50%;right:-70px;bottom:-100px;background:radial-gradient(circle,rgba(100,56,91,.2),transparent 68%)}
.empty-state { color:#9a8393;font-size:13px;font-style:italic; }

/* Credits */
.credits-showcase {
  padding: 24px 0 110px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
}
.credit-card {
  position: relative;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 30px;
  background: linear-gradient(145deg, rgba(255,255,255,.70), rgba(248,237,243,.54));
  box-shadow: 0 22px 62px rgba(84,51,74,.07);
  padding: 26px;
  transition: transform .35s var(--ease), box-shadow .35s var(--ease), border-color .35s ease;
}
.credit-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 32px 82px rgba(84,51,74,.12);
  border-color: rgba(169,95,131,.34);
}
.credit-card-featured,
.credit-card-wide { grid-column: span 2; }
.credit-card-contribution {
  background: linear-gradient(145deg, rgba(255,255,255,.64), rgba(238,224,237,.56));
}
.credit-card-head {
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:24px;
  margin-bottom:22px;
}
.credit-card-head h2 {
  margin: 6px 0 5px;
  font-family: "Cormorant Garamond", serif;
  font-size: clamp(34px, 3.5vw, 48px);
  line-height: .95;
  font-weight: 500;
  letter-spacing: -.025em;
}
.credit-card-head p {
  margin:0;
  color:var(--muted);
  font-size:13px;
  line-height:1.6;
}
.credit-role {
  display:inline-block;
  font-size:10px;
  text-transform:uppercase;
  letter-spacing:.16em;
  color:#9b7890;
}
.credit-profile {
  flex:0 0 auto;
  min-height:40px;
  padding:0 13px;
  border:1px solid var(--line);
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  gap:8px;
  text-decoration:none;
  font-size:10px;
  letter-spacing:.08em;
  text-transform:uppercase;
  background:rgba(255,255,255,.52);
  transition:background .25s ease, transform .25s var(--ease);
}
.credit-profile:hover { background:rgba(255,255,255,.9); transform:translateY(-2px); }
.credit-profile svg { width:14px;height:14px; }
.credit-profile-static {
  width:40px;
  padding:0;
  justify-content:center;
  color:var(--rose-deep);
}
.credit-media-grid {
  display:grid;
  grid-template-columns:1fr;
  gap:12px;
}
.credit-media-grid-two { grid-template-columns:repeat(2,minmax(0,1fr)); }
.credit-media-grid-three { grid-template-columns:repeat(3,minmax(0,1fr)); }
.credit-media-slot {
  position:relative;
  min-height:220px;
  aspect-ratio:16/10;
  overflow:hidden;
  border-radius:22px;
  border:1px solid rgba(169,95,131,.15);
  isolation:isolate;
  display:flex;
  align-items:flex-end;
  padding:18px;
}
.credit-media-slot::before,
.credit-media-slot::after {
  content:"";
  position:absolute;
  pointer-events:none;
  z-index:-1;
}
.credit-media-slot::before {
  width:190px;
  height:190px;
  border-radius:50%;
  top:-72px;
  right:-45px;
  filter:blur(4px);
  opacity:.66;
}
.credit-media-slot::after {
  inset:0;
  background:
    linear-gradient(180deg, transparent 38%, rgba(46,31,48,.08)),
    radial-gradient(circle at 20% 18%, rgba(255,255,255,.72), transparent 30%);
}
.credit-media-slot.tone-dream {
  background:linear-gradient(145deg, rgba(255,250,253,.95), rgba(239,207,220,.72) 52%, rgba(221,212,235,.72));
}
.credit-media-slot.tone-dream::before { background:rgba(229,142,173,.32); }
.credit-media-slot.tone-soft {
  background:linear-gradient(145deg, rgba(255,255,255,.96), rgba(247,233,239,.86) 55%, rgba(214,232,242,.68));
}
.credit-media-slot.tone-soft::before { background:rgba(217,234,243,.48); }
.credit-media-slot.tone-blue {
  background:linear-gradient(145deg, rgba(248,246,251,.95), rgba(217,234,243,.80), rgba(226,209,230,.72));
}
.credit-media-slot.tone-blue::before { background:rgba(197,209,237,.42); }
.credit-media-slot.tone-night {
  color:#fff;
  background:
    radial-gradient(circle at 25% 18%, rgba(130,66,95,.52), transparent 32%),
    linear-gradient(145deg, #50324f, #2e2037 64%, #211827);
}
.credit-media-slot.tone-night::before { background:rgba(130,66,95,.58); }
.credit-media-number {
  position:absolute;
  top:15px;
  left:16px;
  font-family:"Cormorant Garamond",serif;
  font-size:17px;
  opacity:.55;
}
.credit-media-placeholder {
  position:relative;
  z-index:2;
  max-width:85%;
  font-family:"Cormorant Garamond",serif;
  font-size:clamp(22px,2vw,31px);
  line-height:1;
  font-weight:500;
}
.credit-media-slot img,
.credit-media-slot video {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  z-index:1;
}
.credit-media-slot.media-contain img,
.credit-media-slot.media-contain video { object-fit:contain; }
.credit-media-slot:has(img) .credit-media-placeholder,
.credit-media-slot:has(video) .credit-media-placeholder { display:none; }

/* Fanarts */
.fan-grid { display:grid;grid-template-columns:repeat(3,1fr);gap:18px; }
.fan-item { min-height:360px;border-radius:24px;overflow:hidden;position:relative;border:1px solid var(--line);background:linear-gradient(135deg,rgba(255,255,255,.75),rgba(233,210,225,.5)); }
.fan-item:nth-child(2n){min-height:440px}.fan-item:nth-child(3n){background:linear-gradient(150deg,rgba(222,215,235,.7),rgba(255,255,255,.8))}.fan-caption{position:absolute;left:16px;right:16px;bottom:16px;padding:13px 14px;border-radius:16px;background:rgba(255,250,253,.78);backdrop-filter:blur(9px);font-size:12px;display:flex;justify-content:space-between;gap:10px}.fan-caption a{text-decoration:none;color:var(--rose-deep)}

/* Socials */
.portal-list { padding:22px 0 110px; }
.portal-link { display:grid;grid-template-columns:90px 1fr auto;gap:24px;align-items:center;padding:32px 0;border-bottom:1px solid var(--line);text-decoration:none;transition:padding .35s var(--ease),color .3s ease; }
.portal-link:first-child{border-top:1px solid var(--line)}.portal-link:hover{padding-left:14px}.portal-link .num{color:#a78398;font-size:11px;letter-spacing:.1em}.portal-link strong{font-family:"Cormorant Garamond",serif;font-size:clamp(34px,4vw,54px);font-weight:500}.portal-link svg{width:24px;height:24px}

/* Footer */
.site-footer { padding:28px 0 38px;border-top:1px solid var(--line); }
.footer-inner { display:flex;justify-content:space-between;gap:24px;align-items:center;color:#9c8595;font-size:11px;letter-spacing:.08em;text-transform:uppercase; }
.footer-butterfly{width:20px;height:14px;position:relative}.footer-butterfly::before,.footer-butterfly::after{content:"";position:absolute;top:0;width:10px;height:13px;border:1px solid currentColor}.footer-butterfly::before{left:0;border-radius:80% 30% 70% 20%}.footer-butterfly::after{right:0;border-radius:30% 80% 20% 70%}

/* Responsive */
@media (max-width: 1100px){
  .home-hero{grid-template-columns:1fr .8fr}.home-index-grid{grid-template-columns:repeat(3,1fr)}
  .lore-layout{grid-template-columns:140px minmax(0,1fr);gap:38px}.lore-art{display:none}
  .main-nav{gap:0}.main-nav a{padding-inline:7px;font-size:10px}
  .language-switch button{padding:8px 10px;font-size:10px}
}
@media (max-width: 900px){
  .shell{width:min(100% - 30px,var(--content))}.site-header{height:72px}.page{padding-top:72px}
  .main-nav{position:fixed;top:72px;left:15px;right:15px;display:none;flex-direction:column;align-items:stretch;padding:14px;border:1px solid var(--line);border-radius:22px;background:rgba(255,250,253,.94);backdrop-filter:blur(16px);box-shadow:0 20px 50px rgba(80,48,70,.14)}.main-nav.open{display:flex}.main-nav a{padding:14px;font-size:11px}.menu-button{display:grid;place-items:center}.site-language-switch button{padding:7px 9px;font-size:9px}
  .home-hero{padding-top:116px;grid-template-columns:1fr;gap:34px}.hero-copy h1{font-size:clamp(78px,26vw,112px)}.hero-visual{min-height:510px;order:-1}.character-stage{height:500px;width:min(420px,88vw)}.character-art-slot{height:465px;width:min(330px,74vw)}
  .home-index-grid{grid-template-columns:repeat(2,1fr)}.home-index a{min-height:105px}
  .page-hero{padding-top:58px}.page-hero-inner{grid-template-columns:1fr}.page-mark{display:none}.page-hero h1{font-size:70px}
  .lore-layout{grid-template-columns:1fr;padding-top:14px}.lore-rail{position:static;flex-direction:row;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);padding-bottom:18px}.lore-rail::before{display:none}.lore-story .lead{font-size:31px}.world-note{grid-template-columns:1fr;gap:5px}
  .span-4,.span-5,.span-6,.span-7,.span-8{grid-column:span 12}.fan-grid{grid-template-columns:1fr 1fr}.credits-showcase{grid-template-columns:1fr}.credit-card-featured,.credit-card-wide{grid-column:span 1}.credit-media-grid-three{grid-template-columns:repeat(2,minmax(0,1fr))}.portal-link{grid-template-columns:42px 1fr auto}.footer-inner{flex-direction:column;align-items:flex-start}
}
@media (max-width: 520px){
  .header-inner{gap:10px}.brand{font-size:27px}.header-controls{gap:7px}.site-language-switch{padding:3px}.site-language-switch button{padding:6px 7px;font-size:8px;letter-spacing:.05em}.menu-button{width:38px;height:38px}
  .home-hero{padding-bottom:46px}.hero-copy .hero-line{font-size:14px;line-height:1.8}.hero-actions{align-items:stretch}.cta{justify-content:space-between}.home-index-grid{grid-template-columns:1fr}.home-index a{min-height:92px}.home-index{padding-bottom:46px}
  .fan-grid{grid-template-columns:1fr}.fan-item,.fan-item:nth-child(2n){min-height:340px}.credit-card{padding:20px;border-radius:24px}.credit-card-head{gap:14px}.credit-profile{padding:0 10px}.credit-media-grid-two,.credit-media-grid-three{grid-template-columns:1fr}.credit-media-slot{min-height:190px}.portal-link strong{font-size:38px}
}
@media (prefers-reduced-motion: reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}.butterfly{display:none}}


/* ---------- Fanart content refinements ---------- */
.fan-grid-featured {
  grid-template-columns:minmax(280px, 520px);
  justify-content:center;
  gap:26px;
}
.fan-item-artwork {
  min-height:0 !important;
  aspect-ratio:auto;
  overflow:visible;
  border:0;
  background:transparent !important;
  border-radius:0;
}
.fan-art-button {
  display:block;
  width:100%;
  padding:0;
  border:1px solid var(--line);
  border-radius:30px;
  overflow:hidden;
  background:rgba(255,255,255,.44);
  box-shadow:0 24px 70px rgba(111,72,97,.12);
  cursor:zoom-in;
  transition:transform .35s var(--ease), box-shadow .35s var(--ease);
}
.fan-art-button:hover { transform:translateY(-4px);box-shadow:0 32px 86px rgba(111,72,97,.18); }
.fan-art-button img { display:block;width:100%;height:auto; }
.fan-caption-rich {
  position:static;
  margin:14px 6px 0;
  padding:0;
  background:transparent;
  backdrop-filter:none;
  align-items:flex-start;
}
.fan-caption-rich > div { display:flex;flex-direction:column;gap:4px; }
.fan-caption-rich strong { font-family:"Cormorant Garamond",serif;font-size:25px;font-weight:500;line-height:1; }
.fan-caption-rich span { color:var(--muted);font-size:11px;letter-spacing:.08em;text-transform:uppercase; }
.fan-caption-rich .fanart-number { font-family:"Cormorant Garamond",serif;font-size:24px;color:var(--rose-deep);letter-spacing:0;text-transform:none; }

.fanart-dialog {
  width:min(760px,calc(100% - 28px));
  max-height:92vh;
  padding:0;
  border:0;
  border-radius:28px;
  overflow:auto;
  color:var(--ink);
  background:rgba(255,250,253,.96);
  box-shadow:0 40px 120px rgba(35,20,38,.35);
}
.fanart-dialog::backdrop { background:rgba(31,24,37,.62);backdrop-filter:blur(8px); }
.fanart-dialog img { display:block;width:100%;height:auto; }
.fanart-dialog p { margin:0;padding:16px 20px 20px;display:flex;justify-content:space-between;gap:18px;align-items:center; }
.fanart-dialog p span { color:var(--muted);font-size:11px;letter-spacing:.08em;text-transform:uppercase; }
.fanart-dialog-close {
  position:sticky;float:right;top:12px;margin:12px 12px -56px 0;z-index:2;
  width:42px;height:42px;border-radius:50%;border:1px solid rgba(255,255,255,.65);
  background:rgba(31,24,37,.66);color:#fff;font-size:25px;line-height:1;cursor:pointer;backdrop-filter:blur(10px);
}
@media (max-width:700px){
  .fan-grid-featured{grid-template-columns:1fr}.fan-art-button{border-radius:22px}
  .fan-caption-rich strong{font-size:22px}.fanart-dialog{border-radius:20px}
}


/* Music library */
.music-hero{padding-bottom:54px}
.music-page-mark svg{width:44px;height:44px}
.music-collection{display:flex;flex-direction:column;gap:22px;padding:18px 0 120px}
.song-card{
  --disc-a:#f2cfdd;--disc-b:#d7daee;--disc-c:#fffafd;
  display:grid;grid-template-columns:clamp(190px,22vw,260px) minmax(0,1fr);gap:clamp(34px,6vw,86px);align-items:center;
  min-height:310px;padding:38px clamp(24px,4vw,54px);border:1px solid rgba(206,164,187,.28);border-radius:36px;
  background:linear-gradient(135deg,rgba(255,255,255,.60),rgba(255,247,251,.30));
  box-shadow:0 24px 72px rgba(95,55,78,.07);backdrop-filter:blur(12px);overflow:hidden;position:relative;
}
.song-card::before{content:"";position:absolute;inset:auto -10% -65% 42%;height:240px;border-radius:50%;background:radial-gradient(circle,rgba(227,178,204,.20),transparent 68%);pointer-events:none}
.song-card--featured{min-height:390px;grid-template-columns:clamp(240px,27vw,330px) minmax(0,1fr);border-color:rgba(102,62,101,.22);background:linear-gradient(135deg,rgba(255,255,255,.64),rgba(245,225,237,.30) 52%,rgba(64,40,73,.055));box-shadow:0 28px 86px rgba(74,43,66,.10)}
.song-disc-column{display:grid;place-items:center;position:relative;z-index:1}
.cd-button{display:block;border:0;background:transparent;padding:0;border-radius:50%;cursor:pointer;filter:drop-shadow(0 20px 28px rgba(74,43,66,.14));transition:transform .32s var(--ease),filter .32s ease}
.cd-button:hover{transform:translateY(-4px);filter:drop-shadow(0 28px 38px rgba(74,43,66,.21))}
.cd-disc{
  width:min(100%,252px);aspect-ratio:1;border-radius:50%;display:grid;place-items:center;position:relative;overflow:hidden;
  background:
    radial-gradient(circle at 50% 50%,transparent 0 9%,rgba(255,255,255,.94) 9.6% 10.8%,transparent 11.4% 24%,rgba(255,255,255,.23) 24.6% 25.1%,transparent 25.7%),
    conic-gradient(from 22deg,var(--disc-a),rgba(255,255,255,.96),var(--disc-b),#d7edf2,var(--disc-c),#efc9dc,var(--disc-a));
  border:1px solid rgba(255,255,255,.88);box-shadow:inset 0 0 48px rgba(255,255,255,.62),inset 0 0 0 1px rgba(99,65,90,.10);
  animation:cd-spin 9s linear infinite;animation-play-state:paused;will-change:transform;
}
.song-card--featured .cd-disc{width:min(100%,320px)}
.cd-disc::before{content:"";position:absolute;inset:-26%;border-radius:50%;background:conic-gradient(from 80deg,transparent 0 15%,rgba(255,255,255,.78) 18%,transparent 22% 43%,rgba(204,228,244,.50) 46%,transparent 50% 69%,rgba(247,196,220,.48) 72%,transparent 76%);mix-blend-mode:screen;opacity:.72;pointer-events:none}
.cd-disc::after{content:"";position:absolute;width:9.5%;aspect-ratio:1;border-radius:50%;background:#fffafd;border:1px solid rgba(99,65,90,.18);box-shadow:0 0 0 7px rgba(255,255,255,.26),inset 0 2px 7px rgba(91,56,80,.08);z-index:3}
.cd-ring{position:absolute;width:35%;aspect-ratio:1;border-radius:50%;border:1px solid rgba(111,73,101,.18);background:rgba(255,250,253,.24);box-shadow:inset 0 0 18px rgba(255,255,255,.38)}
.cd-center{position:absolute;z-index:2;width:27%;aspect-ratio:1;border-radius:50%;display:grid;place-items:center;background:rgba(255,250,253,.80);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.70)}
.cd-center span{font-family:"Cormorant Garamond",serif;font-size:clamp(15px,2vw,24px);font-weight:600;color:#65455a;letter-spacing:.04em}
.cd-disc--sight{--disc-a:#f2cbd9;--disc-b:#d8d9ef;--disc-c:#fff9fc}
.cd-disc--girl{--disc-a:#efcfdd;--disc-b:#cae0eb;--disc-c:#e6d6ec}
.cd-disc--butterflies{--disc-a:#dfb9cc;--disc-b:#57405f;--disc-c:#ca88a7;background:radial-gradient(circle at 50% 50%,transparent 0 9%,rgba(255,255,255,.86) 9.6% 10.8%,transparent 11.4% 24%,rgba(255,255,255,.17) 24.6% 25.1%,transparent 25.7%),conic-gradient(from 22deg,#e4c6d5,#fff7fb,#7e6387,#d498b3,#3f2d48,#f0cbdc,#e4c6d5)}
.music-track--butterflies .cd-center{background:rgba(55,37,62,.76);border-color:rgba(255,255,255,.26)}
.music-track--butterflies .cd-center span{color:#fff6fb}
[data-audio-track].is-playing .cd-disc{animation-play-state:running}
@keyframes cd-spin{to{transform:rotate(360deg)}}
.song-info{position:relative;z-index:1;min-width:0}
.song-eyebrow{display:flex;align-items:center;gap:12px;min-height:24px;margin-bottom:16px;color:#9e8093;font-size:10px;letter-spacing:.12em;text-transform:uppercase}
.song-index{font-variant-numeric:tabular-nums}
.song-feature{display:inline-flex;align-items:center;min-height:25px;padding:5px 10px;border:1px solid rgba(107,72,101,.18);border-radius:999px;background:rgba(255,255,255,.48);color:#6a4a5f;letter-spacing:.08em}
.song-info h2{max-width:720px;margin:0;font-family:"Cormorant Garamond",serif;font-size:clamp(42px,5vw,68px);font-weight:500;line-height:.98;letter-spacing:-.025em;color:var(--ink)}
.song-card--featured .song-info h2{font-size:clamp(50px,6vw,82px);max-width:760px}
.track-player{display:grid;grid-template-columns:48px 45px minmax(140px,1fr) 45px;gap:12px;align-items:center;width:min(100%,680px);margin-top:34px}
.track-play{width:48px;height:48px;border-radius:50%;border:1px solid rgba(122,82,107,.22);background:rgba(255,255,255,.72);color:var(--ink);display:grid;place-items:center;cursor:pointer;box-shadow:0 8px 24px rgba(83,49,69,.07);transition:transform .22s var(--ease),background .22s ease,border-color .22s ease}
.track-play:hover{transform:scale(1.045);background:#fff;border-color:rgba(177,124,152,.46)}
.track-play svg{width:19px;height:19px}.track-play .icon-pause{display:none}[data-audio-track].is-playing .track-play .icon-play{display:none}[data-audio-track].is-playing .track-play .icon-pause{display:block}
.track-time{color:#9d8393;font-size:11px;font-variant-numeric:tabular-nums}
.track-progress{--progress:0%;width:100%;height:4px;appearance:none;border:0;background:linear-gradient(90deg,#c77899 0 var(--progress),rgba(104,76,96,.16) var(--progress) 100%);border-radius:999px;cursor:pointer;outline:none}
.track-progress::-webkit-slider-thumb{appearance:none;width:15px;height:15px;border-radius:50%;background:#fff;border:1px solid rgba(154,100,130,.42);box-shadow:0 2px 9px rgba(86,54,76,.16)}
.track-progress::-moz-range-thumb{width:15px;height:15px;border-radius:50%;background:#fff;border:1px solid rgba(154,100,130,.42);box-shadow:0 2px 9px rgba(86,54,76,.16)}
@media(max-width:900px){.song-card,.song-card--featured{grid-template-columns:210px minmax(0,1fr);gap:34px;min-height:290px;padding:32px}.song-card--featured{grid-template-columns:240px minmax(0,1fr)}.cd-disc{width:210px}.song-card--featured .cd-disc{width:240px}.song-info h2,.song-card--featured .song-info h2{font-size:clamp(40px,6.5vw,58px)}.track-player{grid-template-columns:46px 42px minmax(100px,1fr) 42px;gap:9px}}
@media(max-width:680px){.music-hero{padding-bottom:30px}.music-collection{gap:16px;padding-top:8px}.song-card,.song-card--featured{grid-template-columns:1fr;gap:22px;min-height:0;padding:28px 22px 32px;border-radius:28px}.song-card--featured{padding-top:32px}.cd-disc,.song-card--featured .cd-disc{width:min(70vw,260px)}.song-info{text-align:left}.song-info h2,.song-card--featured .song-info h2{font-size:clamp(40px,12vw,56px)}.song-eyebrow{margin-bottom:12px}.track-player{grid-template-columns:46px 38px minmax(70px,1fr) 38px;gap:7px;margin-top:28px}.track-play{width:46px;height:46px}.track-time{font-size:10px}}
@media(prefers-reduced-motion:reduce){.cd-disc{animation:none!important}}


/* ---------- V4.3 scale & harmony refinement ---------- */
:root{
  --content:1120px;
  --radius:24px;
}

/* Header and navigation */
.site-header{height:76px}
.page{padding-top:76px}
.brand{font-size:28px}
.main-nav{gap:5px}
.main-nav a{font-size:11px;letter-spacing:.07em;padding:9px 10px}
.main-nav a::after{left:10px;right:10px}
.language-switch button{padding:7px 11px;font-size:10px}

/* Global section scale */
.page-hero{padding:68px 0 42px}
.page-hero-inner{gap:32px;padding-bottom:30px}
.page-hero h1{font-size:clamp(52px,6.4vw,84px);line-height:.9;margin-top:10px}
.page-hero p{max-width:570px;font-size:14px;line-height:1.75;margin-top:14px}
.page-mark{width:70px;height:70px}
.page-mark svg{width:29px;height:29px}
.kicker{font-size:10px;letter-spacing:.2em;gap:10px}
.kicker::before{width:27px}

/* Home */
.home-hero{
  min-height:88svh;
  padding:112px 0 58px;
  grid-template-columns:minmax(0,1.02fr) minmax(320px,.86fr);
  gap:clamp(32px,5vw,72px);
}
.hero-copy h1{font-size:clamp(68px,8.3vw,116px);line-height:.82;margin-top:16px}
.hero-copy .subtitle{font-size:clamp(21px,1.9vw,30px);margin-top:17px}
.hero-copy .hero-line{max-width:510px;margin-top:24px;font-size:14px;line-height:1.82}
.hero-actions{margin-top:29px}
.cta{padding:11px 16px 11px 19px;font-size:13px;gap:11px}
.cta .arrow{width:29px;height:29px}
.hero-visual{min-height:510px}
.character-stage{width:min(430px,78vw);height:510px}
.character-aura.aura-one{width:350px;height:420px;top:28px}
.character-aura.aura-two{width:210px;height:210px}
.character-art-slot{width:min(330px,68vw);height:465px;padding-bottom:22px}
.character-dark-seep{width:250px;height:96px}
.home-index{padding:32px 0 54px}
.home-index-grid{border-radius:20px}
.home-index a{min-height:102px;padding:18px}
.home-index strong{font-size:21px}
.home-index small{font-size:9px}
.home-index svg{width:16px;height:16px}

/* Lore */
.lore-layout{grid-template-columns:170px minmax(0,700px) 1fr;gap:42px;padding:28px 0 90px}
.lore-rail{top:108px;font-size:10px}
.lore-story .lead{font-size:clamp(25px,2.7vw,35px);line-height:1.3;margin-bottom:32px}
.lore-story p{font-size:15px;line-height:1.88;margin-bottom:23px}
.lore-story .turn{margin:48px 0;padding:32px 0}
.lore-story .turn strong{font-size:clamp(30px,4vw,48px);max-width:610px}
.lore-story h2{margin:54px 0 19px;font-size:31px}
.world-notes{margin-top:26px}
.world-note{grid-template-columns:160px 1fr;gap:26px;padding:19px 0}
.world-note h3{font-size:20px}
.world-note p{font-size:13px;line-height:1.72}
.lore-art{min-height:470px}
.lore-art .dream-bloom{width:180px;height:180px}
.lore-art .dark-bloom{width:265px;height:265px}
.lore-art .thread{height:360px}
.lore-art .moth{width:50px;height:39px}

/* Generic editorial content */
.editorial-section{padding:20px 0 82px}
.editorial-grid{gap:20px}
.editorial-card{min-height:150px;padding-top:15px}
.editorial-card h2{font-size:30px}
.editorial-card h3{font-size:24px}
.editorial-card p{font-size:14px;line-height:1.7}
.feature-panel{min-height:270px;border-radius:27px;padding:27px}

/* Credits */
.credits-showcase{padding:14px 0 86px;gap:18px}
.credit-card{border-radius:24px;padding:21px;box-shadow:0 18px 48px rgba(84,51,74,.06)}
.credit-card:hover{transform:translateY(-3px);box-shadow:0 24px 60px rgba(84,51,74,.10)}
.credit-card-head{gap:18px;margin-bottom:17px}
.credit-card-head h2{font-size:clamp(29px,2.7vw,39px);margin:5px 0 4px}
.credit-card-head p{font-size:12px}
.credit-role{font-size:9px}
.credit-profile{min-height:36px;padding:0 11px;font-size:9px}
.credit-profile-static{width:36px}
.credit-media-grid{gap:10px}
.credit-media-slot{min-height:165px;border-radius:18px;padding:15px}
.credit-media-number{top:12px;left:13px;font-size:14px}
.credit-media-placeholder{font-size:clamp(18px,1.65vw,25px)}

/* Fanarts */
.fan-grid-featured{grid-template-columns:minmax(260px,430px);gap:20px}
.fan-art-button{border-radius:24px;box-shadow:0 18px 52px rgba(111,72,97,.10)}
.fan-caption-rich{margin-top:11px}
.fan-caption-rich strong{font-size:22px}
.fan-caption-rich .fanart-number{font-size:21px}
.fan-caption-rich span{font-size:10px}

/* Socials */
.portal-list{padding:12px 0 84px}
.portal-link{grid-template-columns:66px 1fr auto;gap:20px;padding:24px 0}
.portal-link strong{font-size:clamp(29px,3.2vw,43px)}
.portal-link svg{width:20px;height:20px}

/* Music */
.music-hero{padding-bottom:38px}
.music-page-mark svg{width:34px;height:34px}
.music-collection{gap:16px;padding:8px 0 88px}
.song-card{
  grid-template-columns:clamp(150px,17vw,195px) minmax(0,1fr);
  gap:clamp(26px,4vw,54px);
  min-height:238px;
  padding:26px clamp(22px,3vw,36px);
  border-radius:27px;
  box-shadow:0 18px 54px rgba(95,55,78,.055);
}
.song-card--featured{
  min-height:282px;
  grid-template-columns:clamp(185px,20vw,235px) minmax(0,1fr);
  box-shadow:0 22px 64px rgba(74,43,66,.08);
}
.cd-disc{width:min(100%,190px)}
.song-card--featured .cd-disc{width:min(100%,230px)}
.cd-button{filter:drop-shadow(0 15px 20px rgba(74,43,66,.12))}
.cd-center span{font-size:clamp(13px,1.6vw,19px)}
.song-eyebrow{margin-bottom:10px;min-height:20px;font-size:9px}
.song-feature{min-height:22px;padding:4px 8px}
.song-info h2{font-size:clamp(33px,4vw,50px);max-width:650px}
.song-card--featured .song-info h2{font-size:clamp(39px,4.7vw,59px);max-width:680px}
.track-player{grid-template-columns:40px 38px minmax(130px,1fr) 38px;gap:9px;width:min(100%,570px);margin-top:24px}
.track-play{width:40px;height:40px}
.track-play svg{width:16px;height:16px}
.track-time{font-size:10px}
.track-progress{height:3px}
.track-progress::-webkit-slider-thumb{width:13px;height:13px}
.track-progress::-moz-range-thumb{width:13px;height:13px}

/* Footer */
.site-footer{padding:22px 0 28px}
.footer-inner{font-size:10px}

@media(max-width:1100px){
  .home-hero{grid-template-columns:1fr .76fr}
  .lore-layout{grid-template-columns:125px minmax(0,1fr);gap:32px}
}

@media(max-width:900px){
  .site-header{height:68px}
  .page{padding-top:68px}
  .main-nav{top:68px}
  .home-hero{min-height:auto;padding-top:92px;gap:25px}
  .hero-copy h1{font-size:clamp(66px,22vw,94px)}
  .hero-visual{min-height:420px}
  .character-stage{height:420px;width:min(360px,86vw)}
  .character-art-slot{height:390px;width:min(285px,72vw)}
  .page-hero{padding-top:46px}
  .page-hero h1{font-size:58px}
  .credits-showcase{gap:15px}
  .credit-media-grid-three{grid-template-columns:repeat(2,minmax(0,1fr))}
  .song-card,.song-card--featured{grid-template-columns:170px minmax(0,1fr);gap:25px;min-height:220px;padding:24px}
  .song-card--featured{grid-template-columns:195px minmax(0,1fr)}
  .cd-disc{width:170px}
  .song-card--featured .cd-disc{width:195px}
  .song-info h2,.song-card--featured .song-info h2{font-size:clamp(32px,5.3vw,46px)}
}

@media(max-width:680px){
  .page-hero h1{font-size:52px}
  .music-collection{gap:13px}
  .song-card,.song-card--featured{grid-template-columns:1fr;gap:18px;padding:22px 18px 24px;border-radius:23px}
  .song-card--featured{padding-top:24px}
  .cd-disc,.song-card--featured .cd-disc{width:min(57vw,210px)}
  .song-info h2,.song-card--featured .song-info h2{font-size:clamp(34px,10vw,46px)}
  .track-player{grid-template-columns:40px 34px minmax(65px,1fr) 34px;gap:6px;margin-top:21px}
  .track-play{width:40px;height:40px}
}

@media(max-width:520px){
  .brand{font-size:25px}
  .home-hero{padding-bottom:36px}
  .hero-copy .hero-line{font-size:13px}
  .home-index{padding-bottom:38px}
  .home-index a{min-height:82px;padding:16px}
  .page-hero{padding-bottom:32px}
  .page-hero-inner{padding-bottom:24px}
  .lore-story p{font-size:14px}
  .credit-card{padding:17px;border-radius:20px}
  .credit-card-head h2{font-size:30px}
  .credit-media-grid-two,.credit-media-grid-three{grid-template-columns:1fr}
  .credit-media-slot{min-height:150px}
  .portal-link{padding:20px 0}
  .portal-link strong{font-size:32px}
}


/* ---------- V4.4 music player: synced lyrics + volume ---------- */
.music-collection{gap:18px}
.song-card,
.song-card--featured{
  grid-template-columns:clamp(150px,16vw,190px) minmax(250px,.86fr) minmax(290px,1.1fr);
  gap:clamp(22px,3vw,38px);
  align-items:center;
  min-height:250px;
  padding:24px clamp(22px,2.6vw,32px);
}
.song-card--featured{grid-template-columns:clamp(178px,18vw,215px) minmax(270px,.9fr) minmax(320px,1.12fr);min-height:280px}
.song-info h2{font-size:clamp(31px,3.25vw,44px);line-height:1.02}
.song-card--featured .song-info h2{font-size:clamp(35px,3.7vw,50px)}
.cd-disc{width:min(100%,175px)}
.song-card--featured .cd-disc{width:min(100%,205px)}
.track-controls{margin-top:21px;display:flex;flex-direction:column;gap:13px;width:min(100%,520px)}
.track-player{margin-top:0;width:100%;grid-template-columns:40px 36px minmax(110px,1fr) 36px;gap:8px}
.track-volume{display:grid;grid-template-columns:18px minmax(90px,150px) 34px;gap:8px;align-items:center;width:max-content;max-width:100%;color:#9d8393}
.volume-icon{width:16px;height:16px;stroke-width:1.45}
.volume-slider{--volume:82%;appearance:none;width:100%;height:3px;border:0;border-radius:999px;background:linear-gradient(90deg,#d28dab 0 var(--volume),rgba(104,76,96,.14) var(--volume) 100%);cursor:pointer;outline:none}
.volume-slider::-webkit-slider-thumb{appearance:none;width:11px;height:11px;border-radius:50%;background:#fff;border:1px solid rgba(154,100,130,.38);box-shadow:0 2px 7px rgba(86,54,76,.13)}
.volume-slider::-moz-range-thumb{width:11px;height:11px;border-radius:50%;background:#fff;border:1px solid rgba(154,100,130,.38)}
.volume-value{font-size:9px;font-variant-numeric:tabular-nums;text-align:right;color:#ab8e9f}
.lyrics-panel{position:relative;z-index:1;min-width:0;padding-left:clamp(12px,2vw,24px);border-left:1px solid rgba(178,130,156,.16)}
.lyrics-label{margin-bottom:7px;font-size:8px;letter-spacing:.18em;color:#b394a6}
.lyrics-viewport{position:relative;height:132px;overflow:hidden;mask-image:linear-gradient(to bottom,transparent 0,#000 20%,#000 80%,transparent 100%);-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 20%,#000 80%,transparent 100%)}
.lyrics-scroll{position:absolute;left:0;right:0;top:0;transition:transform .48s cubic-bezier(.22,.72,.21,1);will-change:transform}
.lyric-line{margin:0;min-height:42px;display:flex;align-items:center;font-family:"Cormorant Garamond",serif;font-size:clamp(18px,1.8vw,23px);line-height:1.12;color:#e3b8ca;opacity:.18;filter:blur(3px);transform:scale(.97);transform-origin:left center;transition:color .38s ease,opacity .38s ease,filter .38s ease,transform .38s ease}
.lyric-line.is-near{color:#d9a3ba;opacity:.44;filter:blur(1.5px);transform:scale(.985)}
.lyric-line.is-active{color:#5d4054;opacity:1;filter:none;transform:scale(1);font-weight:600}
.music-track--butterflies .lyric-line.is-active{color:#4c334c}
.music-track--butterflies .lyric-line.is-near{color:#c88eaa}
[data-audio-track]:not(.has-started) .lyric-line:first-child{color:#d9a3ba;opacity:.44;filter:blur(1.5px);transform:scale(.985)}
[data-audio-track].has-started:not(.is-vocal-active) .lyric-line.is-near{color:#d9a3ba;opacity:.42;filter:blur(1.6px);transform:scale(.985)}

@media(max-width:1000px){
  .song-card,.song-card--featured{grid-template-columns:165px minmax(0,1fr);gap:24px}
  .song-card--featured{grid-template-columns:185px minmax(0,1fr)}
  .lyrics-panel{grid-column:2;padding-left:0;border-left:0;border-top:1px solid rgba(178,130,156,.14);padding-top:14px}
  .lyrics-viewport{height:116px}
  .lyric-line{min-height:38px;font-size:20px}
}
@media(max-width:680px){
  .song-card,.song-card--featured{grid-template-columns:1fr;gap:16px}
  .lyrics-panel{grid-column:1;padding-top:14px}
  .lyrics-viewport{height:112px}
  .lyric-line{min-height:37px;font-size:19px}
  .track-volume{grid-template-columns:17px minmax(100px,1fr) 34px;width:min(100%,210px)}
}
@media(prefers-reduced-motion:reduce){.lyrics-scroll{transition:none}}
