:root { --bg: #f6f8f8; --surface: #ffffff; --ink: #1c2426; --body: #3d4749; --sub: #5e696b; --teal: #47bcc6; --teal-deep: #127c86; --edge: #d3dddf; }
* { box-sizing: border-box; }
body { margin: 0; background: var(--bg); color: var(--ink); font-family: "Noto Sans JP", "Hiragino Sans", sans-serif; line-height: 1.7; word-break: normal; line-break: strict; overflow-wrap: break-word; }
.player { max-width: 1120px; margin: 0 auto; padding: 32px 16px 64px; }
.series { margin: 0; font-size: 14px; font-weight: 700; color: var(--teal-deep); }
.series .no { font-family: "Source Code Pro", monospace; color: var(--body); }
h1 { margin: 4px 0 16px; font-size: 28px; }
.frame { position: relative; }
video { display: block; width: 100%; aspect-ratio: 16 / 9; background: var(--surface); border: 1px solid var(--edge); border-radius: 12px; }
.actions { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; margin-top: 12px; }
.sound { padding: 8px 18px; border: 0; border-radius: 999px; background: var(--teal-deep); color: #ffffff; font: inherit; font-size: 15px; font-weight: 700; cursor: pointer; }
.back { padding: 7px 18px; border: 1px solid var(--edge); border-radius: 999px; color: var(--ink); text-decoration: none; font-size: 15px; background: var(--surface); }
.lead { color: var(--body); }
.terms { margin-top: -8px; color: var(--sub); font-size: 15px; }
.transcript h2 { font-size: 18px; margin: 32px 0 8px; }
.transcript ol { margin: 0; padding-left: 1.4em; color: var(--body); }
.series .track { margin-left: 12px; font-family: "Noto Sans JP", "Hiragino Sans", sans-serif; font-weight: 400; color: var(--sub); }