:root{--paper:#f8f5eb;--ink:#263438;--teal:#00776b;--line:#cfc9ba;--muted:#50615b;--white:#fffdf7}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.5 system-ui,sans-serif}a{color:inherit;text-underline-offset:4px}a:hover{color:var(--teal)}a:focus-visible{outline:3px solid #278b7c;outline-offset:4px}h1,h2,h3{font-family:Georgia,serif;line-height:1.04;margin:0;font-weight:700;letter-spacing:-.04em}h2{font-size:clamp(28px,5vw,45px)}h3{font-size:clamp(24px,4vw,33px)}p{margin:.65em 0 1em}.shell{width:min(1080px,calc(100% - 40px));margin-inline:auto}.skip{position:absolute;top:-70px;background:white;padding:8px}.skip:focus{top:8px;z-index:2}.mast{border-top:5px solid #169e9c;background:#fff;border-bottom:1px solid var(--line)}.header{display:flex;align-items:center;justify-content:space-between;gap:10px 20px;padding-block:8px}.logo{width:84px;height:auto;display:block}.header nav,.footer{display:flex;flex-wrap:wrap;gap:0 16px}.header nav a,.footer a,.text-link{display:inline-flex;align-items:center;min-height:44px;font-size:.88rem;font-weight:650}.header nav a{text-decoration:none}.opening{margin-top:24px;background:var(--ink);border-top:4px solid #1da6a0;color:var(--white)}.intro{padding:clamp(24px,7vw,72px)}.kicker{font-size:.72rem;letter-spacing:.15em;text-transform:uppercase;font-weight:750;margin:0 0 13px}.intro .kicker{color:#cae2df}.intro h1{font-size:clamp(45px,10vw,104px)}.opening-label{margin:16px 0 10px}.button{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:9px 14px;background:var(--ink);color:var(--white);font-weight:700;text-decoration:none;font-size:.875rem}.button:hover{background:var(--teal);color:white}.play{background:#b5e9df;color:var(--ink)}.quick{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border:1px solid var(--line);border-top:0}.quick a{display:grid;place-items:center;text-align:center;min-height:56px;padding:6px;font-size:clamp(12px,3.6vw,16px);font-weight:750;text-decoration:none}.quick a+a{border-left:1px solid var(--line)}.listing,.panel{padding-block:26px;border-bottom:1px solid var(--line)}.section-title{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}.section-title a{font-size:.85rem;min-height:44px;display:flex;align-items:center}.episode{display:grid;grid-template-columns:minmax(100px,1fr) minmax(0,2fr);gap:17px;align-items:center;padding:14px 0;border-bottom:1px solid var(--line)}.scene{display:block;width:100%;aspect-ratio:3/2;object-fit:cover}.episode p{font-size:.89rem;margin-bottom:0}.episode h3 a{text-decoration:none}.page-title,.detail h1{font-size:clamp(38px,7vw,76px)}.page-title{padding:31px 0 20px}.detail{max-width:700px;padding:34px 0 12px}.detail .scene{margin:20px 0}.dek{font-size:1.13rem}.subtle{color:var(--muted)}.merch{display:grid;grid-template-columns:1fr 1fr;gap:20px;align-items:center;padding-bottom:18px}.merch-type{aspect-ratio:3/2;background:#e9e2cf;display:grid;align-content:center;padding:22px}.merch-type strong{font-family:Georgia,serif;font-size:clamp(22px,4vw,45px);line-height:1.1}.merch-type span{font-size:.8rem;font-weight:650}.footer{margin-top:25px;border-top:1px solid var(--line);padding:10px 0 22px}.footer a{text-decoration:none}@media(max-width:480px){.header{align-items:flex-start;flex-direction:column;gap:0}.header nav{gap:0 12px}.header nav a{font-size:.79rem}.opening{margin-top:15px}.episode{gap:12px;grid-template-columns:minmax(84px,1fr) minmax(0,2.4fr)}.merch{grid-template-columns:1fr}}

.opening {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(210px, 32%);
  align-items: center;
  gap: 20px;
  padding: 22px clamp(22px, 5vw, 64px);
  background: #233538;
}
.intro { padding: 0; }
.intro h1 { max-width: 10ch; font-size: clamp(42px, 7.7vw, 100px); }
[hidden] { display: none !important; }
.film {
  width: min(100%, 292px);
  justify-self: center;
  color: white;
}
.film-frame {
  position: relative;
  aspect-ratio: 512 / 910;
  background: #101b1d;
}
.film-poster, .film-frame video {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: inherit;
  color: inherit;
}
.film-frame img { display: block; width: 100%; height: 100%; }
.film-icon {
  position: absolute;
  inset: 50% auto auto 50%;
  transform: translate(-50%, -50%);
  display: grid;
  place-items: center;
  width: 64px;
  height: 64px;
  border: 2px solid white;
  border-radius: 50%;
  color: white;
  background: #14282ae8;
  font: 27px/1 system-ui, sans-serif;
  padding-left: 3px;
}
.film-poster:hover .film-icon { background: #00655a; }
.film-sr {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip-path: inset(50%);
}
.film-links { display: flex; justify-content: center; }
.film-links a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  font-size: .875rem;
  color: #cee9e7;
}
.film-error:empty { display: none; }
.film-error { margin: 0; font-size: .875rem; }
.footer nav { display: flex; flex-wrap: wrap; gap: 0 16px; }
@media (max-width: 580px) {
  .shell { width: calc(100% - 24px); }
  .header { padding-block: 5px 0; gap: 0; flex-direction: column; align-items: center; }
  .header .logo { width: 67px; }
  .header nav { width: 100%; justify-content: space-between; gap: 0 6px; }
  .header nav a { font-size: .8rem; }
  .opening { grid-template-columns: 1fr; gap: 13px; padding: 15px 12px 0; }
  .intro { text-align: center; }
  .intro .kicker { margin-bottom: 7px; }
  .intro h1 { max-width: none; font-size: clamp(29px, 7.8vw, 43px); }
  .film { width: min(100%, clamp(188px, 33svh, 286px)); }
}

/* The masthead and notices use paper, while the opening film anchors the front page. */
:root { --paper: #f5f1e6; --ink: #1e3032; --line: #cbc5b4; --white: #fcf9ee; }
body { font-family: system-ui, sans-serif; }
.mast { border-top: 4px solid #00776b; background: var(--paper); }
.header { min-height: 74px; padding-block: 8px; }
.header nav { align-items: center; gap: 4px 22px; }
.header nav a { font-size: .875rem; }
.header nav a[aria-current] { color: #005e53; text-decoration: underline; }
.header nav a:last-child { border: 1px solid var(--line); padding: 0 12px; }
.opening {
  position: relative;
  grid-template-columns: minmax(0, 1fr) minmax(235px, 36%);
  gap: clamp(20px, 6vw, 68px);
  padding: clamp(26px, 4vw, 56px) clamp(26px, 6vw, 78px);
  border-top: 0;
  background: radial-gradient(ellipse at 85% 35%, #365557 0%, #213638 60%, #1c2e30 100%);
}
.intro .kicker { color: #a9dfd3; margin-bottom: 17px; }
.intro h1 { font-size: clamp(43px, 8.4vw, 108px); }
.intro-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 5px 19px; margin-top: 25px; }
.watch-button { background: #abe0d1; color: #152d28; }
.intro-actions .text-link { color: var(--white); }
.film { width: min(100%, 268px); }
.film-frame { border: 1px solid #e4eddb56; box-shadow: 0 14px 38px #111d1d7f; }
.film-icon::after {
  content: "";
  width: 0;
  height: 0;
  border-block: 9px solid transparent;
  border-left: 15px solid #fff;
}
.film-links a { font-size: .78rem; }
.record { padding-block: 32px; }
.record h2, .home-paths h2 { letter-spacing: -.035em; }
.record-feature {
  display: grid;
  grid-template-columns: minmax(0, 1.14fr) minmax(0, 1fr);
  align-items: stretch;
  background: #ebe5d5;
  border: 1px solid var(--line);
}
.record-feature .scene { height: 100%; max-height: 325px; }
.record-copy { padding: clamp(17px, 3.5vw, 38px); align-self: center; min-width: 0; }
.record-copy p { margin-bottom: 3px; }
.home-paths { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.home-paths .panel {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 20px;
  border: 1px solid var(--line);
  background: #fbf7eb;
}
.home-paths h2 { font-size: clamp(24px, 3vw, 35px); }
.home-paths p { color: #354a46; }
.home-paths .text-link { margin-top: auto; color: #005e53; }
.footer { justify-content: space-between; }
@media (max-width: 640px) {
  .header { padding: 6px 0 3px; }
  .header nav { justify-content: space-between; gap: 1px 5px; }
  .header nav a { font-size: clamp(.745rem, 3.3vw, .875rem); }
  .header nav a:last-child { padding: 0 7px; }
  .opening { grid-template-columns: 1fr; gap: 13px; padding: 18px 10px 4px; }
  .intro { text-align: center; }
  .intro .kicker { margin-bottom: 6px; }
  .intro h1 { margin-inline: auto; max-width: 15ch; font-size: clamp(32px, 9vw, 53px); }
  .intro-actions { justify-content: center; gap: 0 12px; margin-top: 10px; }
  .intro-actions a { font-size: .78rem; }
  .film { width: min(100%, clamp(180px, 27svh, 238px)); }
  .record { padding-block: 22px; }
  .record-feature { grid-template-columns: 1fr; }
  .record-feature .scene { aspect-ratio: 16/9; }
  .home-paths { grid-template-columns: 1fr; }
}
.opening + script + .home-paths { margin-top: 12px; }
.record { margin-top: 28px; padding-block: 0; }
.mast { background: #fff; }
.record-feature .scene { aspect-ratio: 16/9; }

.merch > .scene { aspect-ratio: 3/4; object-fit: contain; background: #e9e2cf; max-height: 620px; }

/* Direct paths from entertainment to merchandise and correspondence. */
.merch-feature{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(22px,5vw,60px);align-items:center;margin-top:32px;padding:24px;background:#e9e2d1;border:1px solid var(--line)}
.merch-feature .scene{aspect-ratio:3/4;object-fit:contain;max-height:440px}
.merch-feature h2{font-size:clamp(40px,6vw,70px)}
.inquiry{margin:24px 0;padding:clamp(18px,4vw,30px);background:var(--white);border:1px solid var(--line);border-top:4px solid var(--teal)}
.inquiry>label{display:block;font-weight:650;margin:20px 0 7px}
.inquiry>label:first-of-type{margin-top:0}
.inquiry label span,.field-help{font-weight:400;color:var(--muted);font-size:.875rem}
.inquiry input:not([type=checkbox]),.inquiry textarea,.inquiry select{display:block;width:100%;font:inherit;font-size:16px;line-height:1.5;border:1px solid #8a9994;border-radius:2px;background:white;color:var(--ink);padding:12px;min-height:48px}
.inquiry textarea{resize:vertical;min-height:160px}
.inquiry input:focus-visible,.inquiry textarea:focus-visible,.inquiry select:focus-visible,button:focus-visible{outline:3px solid var(--teal);outline-offset:3px}
.inquiry .check{display:flex;align-items:flex-start;gap:12px;padding:12px 0;line-height:1.6}
.check input{width:22px;height:22px;flex:0 0 22px;margin:2px 0;accent-color:var(--teal)}
.inquiry .button{border:0;cursor:pointer;min-height:48px;font:inherit;font-weight:650;padding:12px 22px}
.inquiry .button:disabled{opacity:.6;cursor:wait}
.form-status:empty{display:none}.form-status{margin:14px 0 0}
.policy h2{font-size:28px;letter-spacing:-.02em;margin-top:30px}
.receipt{padding-block:64px}.receipt .text-link{margin-left:18px}
.footer-note{width:100%;font-size:.75rem;color:var(--muted);margin:4px 0}
@media(max-width:640px){.merch-feature{grid-template-columns:1fr;padding:18px;gap:20px}.merch-feature .scene{max-height:370px}.inquiry{padding:18px 14px}.inquiry .button{width:100%}.home-paths .panel{padding:18px}.receipt .text-link{margin-left:12px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}
