/* User-selected palette: pink, white, yellow and blue, matching the channel icon. */
:root {
  --paper: #ffffff;
  --white: #ffffff;
  --ink: #254b66;
  --green: #d92d84;
  --muted: #647d8f;
  --line: #e9e9e9;
  --accent: #d92d84;
  --yellow: #ffda28;
  --youtube: #d92d84;
  --leaf: #d92d84;
  --leaf-soft: #fff7cf;
  --gold: #ffda28;
  --berry: #d92d84;
  --zukan-blue: #254b66;
  --zukan-ink: #254b66;
  --zukan-line: #e9e9e9;
}
body, .footer { background: white; color: var(--ink); }
.topline { background: #fff6bf; color: #65551f; border-color: #ffe36e; }
.brand-mark, .brand-dot, .menu-button { color: var(--youtube); }
.brand strong, .footer .footer-brand strong { color: #254b66; }
.brand small, .footer-brand small { color: #647d8f; }
.channel-brand-icon { width: 54px; height: 54px; object-fit: contain; flex-shrink: 0; border-radius: 50%; }
.zukan-host figcaption { position: relative; display: grid; grid-template-columns: minmax(0,1fr) 60px; gap: 4px 12px; padding-right: 7px; min-height: 100px; }
.zukan-host figcaption>span { grid-column: 1; grid-row: 1; align-self: end; }
.zukan-host figcaption>strong { grid-column: 1; grid-row: 2; }
.host-channel-icon { grid-column: 2; grid-row: 1 / span 2; align-self: center; position: static; width: 60px; height: 60px; object-fit: contain; border-radius: 50%; }
.host-introduction { grid-column: 1 / -1; margin: 10px 0 0; font-size: 12px; line-height: 1.95; color: #5d7383; }
.youtube-link { background: white; border-color: #f3b6d4; color: #bd2975; }
.youtube-link:hover { background: #fff0f7; color: #b5216d; }
.menu-button span { background: var(--youtube); height: 2px; }
.zukan-breadcrumb { color: #737373; }
.zukan-breadcrumb>a { background: #fff3bf; color: #6e5915; }
.zukan-titlebar { background: #d92d84; border-radius: 12px; box-shadow: 0 6px 0 #fff0b0; }
.zukan-titlebar p { color: white; }
.zukan-titlebar h1 { color: white; font-weight: 700; }
.zukan-titlebar h1>span { display: block; color: white; margin: 4px 0 0; font-size: 16px; font-weight: 500; }
.zukan-titlebar:after { border-color: #ffffff35; box-shadow: 0 0 0 22px #ffffff0c, 0 0 0 45px #ffffff08; }
.title-emblem { background: #ffda28; color: #3c3216; width: 64px; height: 64px; font-size: 21px; font-weight: 700; }
.title-emblem>span { font-size: 12px; }
.zukan-heading, .zukan-lead { color: #254b66; }
.zukan-heading:before { background: #ffda28; }
.zukan-overview-copy>p, .zukan-section-description { color: #5d7383; }
.zukan-overview-copy .zukan-thanks { color: #bd2975; }
.zukan-text-link { color: #bd2975; border-color: #efc6dd; }
.zukan-host { border-color: #eee; border-radius: 10px; box-shadow: 0 6px 0 #ffe57b; transform: rotate(1deg); }
.host-portrait { border-radius: 5px; }
.zukan-host figcaption>span, .zukan-host figcaption>small { color: #647d8f; }
.zukan-host figcaption>strong { color: #254b66; font-weight: 700; }
.zukan-spread { background: #fffbea; border-color: #ffe57b; border-radius: 10px; box-shadow: 0 5px 0 #fff0aa; }
.spread-top, .spread-person>span { color: #254b66; }
.spread-top strong { color: #bd2975; }
.spread-top>span:last-child, .spread-person>small, .zukan-spread>p { color: #71674b; }
.button-green { background: var(--youtube); color: white; border-color: var(--youtube); }
.button-green:hover { background: #b5216d; color: white; border-color: #b5216d; }
.button-outline { background: white; color: #bd2975; border-color: #eab7d2; }
.button-outline:hover { background: #fff0f7; color: #b5216d; }
.channel-strip { background: #fff7cb; border-color: #ffe989; }
.strip-inner strong, .strip-inner>a { color: #254b66; }
.strip-description { color: #756742; }
.live-dot { background: #d92d84; box-shadow: 0 0 0 5px #d92d8412; }
.chapter-life, .chapter-roots { --chapter: #bd9200; --chapter-bg: #fff6c9; }
.chapter-care, .chapter-work { --chapter: #d92d84; --chapter-bg: #fff0f7; }
.chapter-button { border-radius: 10px; border-color: #eee; border-top-color: var(--chapter); }
.chapter-button>strong { color: #254b66; }
.chapter-en, .chapter-bottom>span { color: #716b5e; }
.chapter-top>span:first-child, .chapter-icon, .chapter-bottom>b { color: #715d21; }
.chapter-care .chapter-top>span:first-child, .chapter-care .chapter-icon, .chapter-care .chapter-bottom>b,
.chapter-work .chapter-top>span:first-child, .chapter-work .chapter-icon, .chapter-work .chapter-bottom>b { color: #bd2975; }
.people-section { background: #f6fbff; border-color: #ffebaf; }
.section-heading .eyebrow, .people-section .section-heading .eyebrow, .about-copy .eyebrow, .encounter-section>.eyebrow { color: #bd2975; }
.people-search-box { background: white; border-color: #e4e4e4; }
.people-search-box input { color: #254b66; }
.people-search-box>svg, .people-search-box input::placeholder { color: #6f8492; }
.people-search-box>button { color: #bd2975; }
.people-controls>p, .people-note { color: #706c61; }
.people-filters>button { color: #5d7383; background: white; border-color: #e4e4e4; }
.people-filters>button.active { background: #d92d84; border-color: #d92d84; color: white; }
.people-filters>button:hover:not(.active) { background: #fff0c2; }
.person-card { background: white; border-color: #e9e9e9; box-shadow: 0 4px 0 #ffdf6b40; }
.person-content h3 { color: #254b66; }
.is-video-entry .person-content h3 { font-family: var(--sans); font-size: 16px; line-height: 1.7; letter-spacing: 0; }
.more-people-wrap { display: flex; justify-content: center; gap: 14px; flex-wrap: wrap; }
.person-role, .person-content h3>small, .person-question { color: #5d7383; }
.person-interest { background: #fff6cfef; color: #725716; }
.person-play { background: #d92d84; }
.person-actions button, .person-actions button:last-child { color: #bd2975; }
.person-actions { border-color: #eee; }
.person-id { background: #ffda28; color: #3c3216; }
.person-context { background: #fff9df; border-color: #ffe27c; }
.person-context>strong { color: #254b66; }
.person-context>span, .person-context>p, .person-context>p>span, .person-context dt, .person-context dd { color: #5d7383; }
.person-context>button { color: #bd2975; border-color: #efc6dd; }
.zukan-steps>li>span { color: #4e3c12; background: #ffda28; }
.zukan-steps h3 { color: #254b66; }
.zukan-steps p, .photo-credit { color: #647d8f; }
.encounter-photos figure { border-color: #eee; border-radius: 10px; box-shadow: 0 4px 0 #fff0b0; }
.encounter-photos figcaption { color: #254b66; }
.format-entrances>button { background: #fff5bc; border-color: #ffe278; color: #3c3216; border-radius: 12px; }
.format-entrances>button:last-child { background: #fff0f7; border-color: #f3b6d4; color: #bd2975; }
.format-entrances strong+span { opacity: 1; color: #655d4c; }
.format-entrances>button:last-child strong+span { color: #765158; }
.format-entrances b { border-color: #d3be7c80; }
.format-description, .section-aside { color: #647d8f; }
.collection-section { background: white; border-color: #eee; }
.section-heading h2, .collection-count strong { color: #254b66; }
.search-form { background: white; border-color: #e3e3e3; box-shadow: 0 3px 0 #fff0ae; }
.search-form>svg, .search-form input::placeholder { color: #6f8492; }
.search-form button { background: #d92d84; color: white; }
.search-form button:hover { background: #b5216d; }
.suggestions button, .sidebar-note, .topic-button>span { color: #647d8f; }
.sidebar-note button { color: #bd2975; border-color: #efc6dd; }
.topic-button.active { background: #d92d84; color: white; }
.topic-button.active>span { color: white; }
.topic-button:not(.active):hover { background: #fff6d1; }
.type-tabs>button { color: #5d7383; }
.type-tabs>button.active { color: #bd2975; }
.type-tabs>button.active:after { background: #d92d84; }
.type-tabs>button>span:not(:empty) { background: #f4f4f4; color: #5d7383; }
.type-tabs>button.active>span:not(:empty) { background: #fff0f7; color: #bd2975; }
.region-control { background: white; border-color: #e5e5e5; }
.view-buttons button.active { background: #fff2b0; color: #665215; }
.video-card { border-color: #e9e9e9; }
.format-badge { background: #ffeb89f5; color: #554315; }
.format-badge.live { background: #d92d84f5; color: white; }
.duration { background: #254b66e8; }
.card-open:hover h3 { color: #bd2975; }
.topic-tag { background: #fff5ce; color: #6c581b; }
.bookmark-button { color: #6f8492; }
.bookmark-button:hover, .bookmark-button.saved { background: #ffe474; color: #6d5310; }
.bookmark-button.saved svg { fill: #ffda28; }
.about-illustration { background: #fff6cb; }
.about-small, .about-illustration>p { color: #75632c; }
.book { border-color: #cf9820; color: #4c3714; }
.b1, .b4 { background: #ffda28; }
.b2, .b5 { background: #ffe793; }
.b3 { background: #ffb1b8; }
.book-shelf { background: #d92d84; }
.illustration-star { color: #d92d84; }
.about-copy h2 { color: #254b66; }
.about-copy>p:not(.eyebrow) { color: #5d7383; }
.about-copy .gratitude-line { color: #bd2975; }
.text-link { color: #bd2975; border-color: #efc6dd; }
.footer-thanks { color: #555; }
.footer-links a, .footer-links button { color: #555; }
.footer-bottom { color: #6f8492; border-color: #eee; }
.player-container { background: #252525; }
.player-consent { background: #25252533; }
.player-consent button { background: #d92d84; }
.dialog-close { background: #fff3be; color: #bd2975; }
.info-dialog a { color: #bd2975; }
.toast { background: #254b66; color: white; border-color: #ffda28; }
@media(max-width:900px) { .zukan-titlebar h1>span { font-size: 14px; } }
@media(max-width:600px) {
  .channel-brand-icon { width: 44px; height: 44px; }
  .brand { gap: 9px; }
  .zukan-host figcaption { grid-template-columns: minmax(0,1fr) 50px; gap: 4px 10px; padding-right: 7px; }
  .host-channel-icon { width: 50px; height: 50px; }
  .zukan-titlebar { border-radius: 9px; }
  .zukan-titlebar h1>span { font-size: 11px; margin-top: 6px; }
  .title-emblem { width: 48px; height: 48px; font-size: 16px; }
  .title-emblem>span { font-size: 9px; }
  .zukan-host { max-width: 360px; }
  .zukan-actions { gap: 15px; }
  .zukan-actions .button { padding-inline: 15px; gap: 18px; }
}

/* Light blue and white carry the page; pink and yellow mark the highlights. */
.zukan-titlebar { background:#eff8ff; border:1px solid #d7eaf6; border-top:4px solid #ef8dbd; box-shadow:0 5px 0 #fff1b7; }
.zukan-titlebar h1 { color:#24668d; }
.zukan-titlebar p { color:#397da2; }
.zukan-titlebar h1>span { color:#456e88; }
.zukan-titlebar:after { border-color:#92c7e344; box-shadow:0 0 0 22px #bde4f51c,0 0 0 45px #bde4f512; }
.title-emblem { background:#ffe478; color:#295f80; }
.topline { background:#fff9da; color:#6d704f; border-color:#fff0b4; }
.zukan-heading:before { background:#f49ac6; }
.channel-strip { background:#edf8ff; border-color:#d8edf8; }
.strip-description { color:#5c7c91; }
.zukan-spread { background:white; border-color:#f1df8b; box-shadow:0 5px 0 #fff3bf; }
.chapter-life { --chapter:#c1a341; --chapter-bg:#fff9d9; }
.chapter-care { --chapter:#dc83b3; --chapter-bg:#fff0f8; }
.chapter-roots { --chapter:#66abd2; --chapter-bg:#edf8ff; }
.chapter-work { --chapter:#8ca9da; --chapter-bg:#f1f5ff; }
.chapter-top>span:first-child,.chapter-icon,.chapter-bottom>b { color:#547b98; }
.chapter-life .chapter-top>span:first-child,.chapter-life .chapter-icon,.chapter-life .chapter-bottom>b { color:#83702c; }
.chapter-care .chapter-top>span:first-child,.chapter-care .chapter-icon,.chapter-care .chapter-bottom>b { color:#ad4d86; }
.chapter-work .chapter-top>span:first-child,.chapter-work .chapter-icon,.chapter-work .chapter-bottom>b { color:#547b98; }
.about-photo { margin:0; padding:12px 12px 0; background:white; border:1px solid #e0edf5; border-radius:15px; box-shadow:0 6px 0 #e1f2fc; }
.about-photo>img { width:100%; height:auto; aspect-ratio:4/3; object-fit:cover; border-radius:9px; }
.about-photo figcaption { padding:17px 8px 18px; font-family:var(--serif); font-size:15px; color:#3b779a; }
.about-photo figcaption>small { display:block; margin-top:5px; font-family:var(--sans); font-size:9px; color:#7a91a0; }
@media(max-width:600px) { .about-photo figcaption { font-size:13px; } }