:root{color-scheme:light;--cream:#FFFAEE;--milk:#FFF2CF;--white:#fff;--soft:#F8F4E9;--ink:#24282B;--body:#41484C;--muted:#626C70;--yellow:#FFCD38;--yellow-light:#FFE07A;--gold:#C99018;--orange:#EF9A43;--sage:#7B9873;--mint:#85BBB1;--lilac:#998BB7;--night:#15191C;--rule:rgba(77,67,41,.13);--shadow:0 14px 34px rgba(39,38,26,.09);--radius:15px;--container:1240px}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:124px}
body{margin:0;min-width:280px;background:var(--cream);color:var(--body);font-family:system-ui,-apple-system,"PingFang SC","Microsoft YaHei","Noto Sans CJK SC",sans-serif;font-size:16px;line-height:1.73;-webkit-font-smoothing:antialiased}
body.overlay-open{overflow:hidden}
button,input{font:inherit}
button{cursor:pointer}
a{color:inherit;text-decoration:none}
img,video{display:block;max-width:100%;height:auto}
img{object-fit:contain;object-position:center}
p{margin:0 0 1em}
h1,h2,h3,h4{margin:0;color:var(--ink);letter-spacing:-.02em;line-height:1.3}
h1{font-size:clamp(25px,3.5vw,36px);font-weight:850}
h2{font-size:clamp(21px,2.5vw,26px);font-weight:800}
h3{font-size:18px;font-weight:790}
strong{color:inherit}
:focus-visible{outline:3px solid #A86800;outline-offset:3px;border-radius:4px}
::selection{background:#FFDB63;color:#161616}
.shell{width:min(var(--container),calc(100% - 40px));margin-inline:auto}
.skip-link{position:fixed;top:-100px;left:12px;padding:12px 16px;background:#191c1d;color:white;z-index:300}.skip-link:focus{top:6px}
.eyebrow{display:block;color:#94680C;letter-spacing:.12em;text-transform:uppercase;font-weight:850;font-size:12px;line-height:1.5}
.eyebrow.light{color:var(--yellow-light)}
.section{padding:50px 0}
.section + .section{border-top:1px solid rgba(87,81,65,.065)}
.section.soft{background:#fff9ea}
.section.white{background:white}
.section.dark{background:var(--night);color:#F2F1EA}
.section.dark h2,.section.dark h3,.section.dark h1{color:#FAFAF5}
.section.dark .section-lead{color:#CBD2D0}
.section-head{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:24px}
.section-head>div{max-width:770px}
.section-head h2{margin-top:4px}
.section-lead{color:var(--muted);max-width:760px;margin:9px 0 0;font-size:15px}
.section-head>.text-link{white-space:nowrap}
.small-note{font-size:13px;color:var(--muted)}
.mini-label{display:inline-flex;gap:6px;align-items:center;padding:5px 10px;border-radius:5px;background:#FFF0BC;color:#684A00;font-size:12px;font-weight:800}
.pill{display:inline-flex;gap:6px;align-items:center;border:1px solid #D4BF84;background:#FFFCF3;padding:4px 9px;border-radius:8px;font-size:13px;color:#65522D}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:10px 20px;border-radius:11px;border:1px solid transparent;font-size:14px;line-height:1.35;font-weight:820;white-space:nowrap;transition:background .2s ease,transform .2s ease,border-color .2s ease}
.btn:hover{transform:translateY(-2px)}
.btn-primary{background:var(--yellow);color:#202428;border-color:#F0BD20;box-shadow:0 8px 16px rgba(201,144,24,.13)}
.btn-primary:hover{background:#F5B800}
.btn-secondary{background:white;border-color:#D9BC6B;color:#292C2C}
.btn-secondary:hover{background:#FFF6D8}
.btn-dark{background:#202629;color:white;border-color:#202629}
.btn-dark:hover{background:#3A4246}
.btn-row{display:flex;flex-wrap:wrap;gap:12px;margin-top:22px}
.text-link{display:inline-flex;align-items:center;gap:7px;min-height:40px;color:#2E4F38;font-size:14px;font-weight:800;transition:gap .2s ease,color .2s ease}
.text-link:hover{gap:12px;color:#936110}
.dark .text-link{color:#FFE07A}
.standalone-link{display:flex;justify-content:space-between;align-items:center;gap:12px;background:var(--white);border:1px solid var(--rule);border-radius:11px;padding:12px 15px;min-height:52px;font-size:14px;font-weight:750}
.standalone-link:hover{border-color:#DBA82B;background:#FFF9E8}

/* Unbroken viewport-wide header; content width is independent of header paint. */
.site-header{position:sticky;top:0;z-index:60;width:100%;background:white;border-bottom:1px solid var(--rule);box-shadow:0 5px 20px rgba(43,38,23,.035)}
.masthead{height:70px;background:#fff}
.nav-shell{width:min(var(--container),calc(100% - 40px));height:100%;margin:auto;display:flex;align-items:center;gap:24px}
.site-logo{display:flex;align-items:center;flex:0 0 auto;min-width:126px;height:52px}
.site-logo img{max-height:36px;max-width:165px;width:auto;height:auto}
.logo-word{display:inline-flex;align-items:baseline;gap:3px;color:#21282B;font-size:25px;font-weight:950;letter-spacing:-.08em;position:relative;padding-right:3px;white-space:nowrap}
.logo-ai{color:#9D6900;background:var(--yellow);font-size:17px;line-height:1.2;padding:3px 5px;border-radius:6px;letter-spacing:-.04em}
.logo-word small{position:absolute;top:32px;left:2px;font-size:8px;font-weight:850;letter-spacing:.12em;color:#6C7270}
.primary-links{display:flex;justify-content:center;align-items:center;gap:clamp(8px,1.2vw,21px);margin:auto;min-width:0}
.primary-links a{min-height:44px;display:flex;align-items:center;padding:5px 7px;font-size:14px;font-weight:740;border-bottom:3px solid transparent;white-space:nowrap}
.primary-links a:hover,.primary-links a.is-active{color:#6E4B00;border-bottom-color:var(--yellow)}
.header-actions{display:flex;gap:6px;align-items:center;flex:0 0 auto}
.icon-action{height:46px;min-width:46px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;padding:5px 7px;border:0;border-radius:9px;background:transparent;color:#32393B}
.icon-action:hover{background:#FFF1C9}
.button-name{font-size:10px;font-weight:760;line-height:1.1}
.magnify{display:block;width:16px;height:16px;border:2px solid currentColor;border-radius:50%;position:relative;margin-right:3px;margin-top:0}
.magnify:after{content:"";width:7px;height:2px;position:absolute;right:-6px;bottom:-3px;transform:rotate(46deg);background:currentColor;border-radius:3px}
.menu-lines{display:flex;width:20px;height:16px;flex-direction:column;justify-content:space-between;align-items:center;padding-block:1px}
.menu-lines b{display:block;width:19px;height:2px;background:currentColor;border-radius:4px}
.header-app{display:flex;align-items:center;justify-content:center;white-space:nowrap;min-height:44px;gap:6px;padding:7px 12px;background:#252A2B;color:#fff;border-radius:9px;font-size:13px;font-weight:750}
.header-app:hover{background:#49452D}
.topic-nav{height:44px;background:#FFF5DD;border-top:1px solid rgba(201,144,24,.12)}
.topic-scroll{width:min(var(--container),calc(100% - 40px));height:44px;display:flex;align-items:center;gap:26px;margin:auto;overflow-x:auto;overflow-y:hidden;scrollbar-width:thin;white-space:nowrap}
.topic-scroll a{align-self:stretch;display:inline-flex;align-items:center;position:relative;font-size:13px;font-weight:730;color:#665636;flex:0 0 auto}
.topic-scroll a:hover,.topic-scroll a.is-active{color:#292721}
.topic-scroll a.is-active:after,.topic-scroll a:hover:after{content:"";position:absolute;bottom:2px;left:0;width:100%;height:3px;background:#D9A42D;border-radius:4px}
.site-main{min-height:45vh}

/* Site's responsive image slots: no external file, URL or generated bitmaps. */
.media-slot{display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;border:1px solid rgba(85,75,43,.15);border-radius:var(--radius);background:linear-gradient(135deg,#FFF0C6 0%,#F8EFDF 43%,#E7EEDB 100%);isolation:isolate}
.media-slot img{width:100%;height:100%;object-fit:contain;object-position:center;max-width:100%;max-height:100%}
.media-wide{aspect-ratio:16 / 9;max-height:300px}
.media-banner{aspect-ratio:20 / 7;min-height:185px;max-height:315px;background:linear-gradient(130deg,#FFF1BC 0%,#FFE5A0 43%,#E7F0E3 100%)}
.media-portrait{aspect-ratio:3 / 4;max-height:420px}
.media-phone{aspect-ratio:3 / 4;max-height:400px;max-width:285px;margin-inline:auto}
.media-square{aspect-ratio:1 / 1;max-height:235px}
.media-mini{aspect-ratio:5 / 3;max-height:170px}
.media-art{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;padding:22px;text-align:center;overflow:hidden}
.media-art::before{content:"";position:absolute;width:190px;height:190px;border-radius:50%;top:-75px;right:-35px;background:rgba(255,255,255,.37)}
.media-art::after{content:"";position:absolute;width:130px;height:130px;bottom:-73px;left:7%;border:20px solid rgba(151,166,143,.19);border-radius:40%;transform:rotate(-22deg)}
.media-art i{display:block;width:58px;height:58px;border-radius:17px 4px 17px 4px;background:linear-gradient(140deg,#EBC862 0%,#C4D8B7 100%);transform:rotate(20deg);box-shadow:16px 8px 0 rgba(121,143,143,.13);position:relative;z-index:1}
.media-art span{position:relative;z-index:1;font-size:clamp(18px,2.7vw,26px);letter-spacing:.06em;font-weight:900;color:#554528}
.media-art small{position:relative;z-index:1;font-size:10px;font-weight:750;color:#736949;letter-spacing:.12em}
.media-portrait .media-art span,.media-phone .media-art span{font-size:19px}

/* Home opening */
.hero-section{padding:25px 0 40px;background:radial-gradient(circle at 92% 30%,rgba(225,187,89,.10),transparent 32%)}
.hero-image{margin-bottom:23px}
.hero-under{max-width:950px;margin:0 auto;text-align:center;padding:0 14px}
.hero-under h1{margin:5px 0 10px}
.hero-under .hero-sentence{font-size:17px;font-weight:750;color:#383F40;margin:4px 0 10px}
.hero-under .intro-text{font-size:15px;line-height:1.8;max-width:880px;margin:0 auto;color:#4B5555}
.hero-under .btn-row{justify-content:center}
.hero-flag{display:inline-block;margin:0 0 7px;font-size:11px;color:#74581F;font-weight:800;letter-spacing:.1em}

/* Story cards & variable density */
.story-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;min-width:0}
.story-grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}
.story-grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}
.story-card{background:#fff;border:1px solid var(--rule);border-radius:var(--radius);display:flex;flex-direction:column;min-width:0;overflow:hidden;box-shadow:0 4px 12px rgba(40,38,24,.025);transition:box-shadow .2s,transform .2s}
.story-card:hover{box-shadow:var(--shadow);transform:translateY(-3px)}
.story-card-visual{min-height:105px;padding:16px 18px;background:linear-gradient(128deg,#FFE49C,#E6E9DD);display:flex;justify-content:space-between;align-items:end;position:relative;overflow:hidden}
.story-card:nth-child(3n + 2) .story-card-visual{background:linear-gradient(125deg,#E2ECDE,#F9E8C4)}
.story-card:nth-child(3n + 3) .story-card-visual{background:linear-gradient(125deg,#E7E4F2,#F8E1B6)}
.story-glyph{position:absolute;top:-42px;right:10px;font-size:140px;line-height:1;color:rgba(255,255,255,.6)}
.story-card-visual small{font-size:12px;color:#574B38;font-weight:850;z-index:1}
.story-card-content{padding:18px;display:flex;flex-direction:column;flex:1;gap:10px;min-width:0}
.story-card-content p{font-size:14px;line-height:1.7;margin:0}
.story-card h3 a:hover{color:#956C16}
.card-meta{display:flex;align-items:center;flex-wrap:wrap;gap:6px;font-size:11px;font-weight:780;color:#656B66}
.card-meta .dot{color:#C29A23}
.story-card .state-line{font-size:13px;color:#736032;font-weight:800;padding-top:4px;margin-top:auto}
.story-card .text-link{align-self:flex-start}
.feature-row{display:grid;grid-template-columns:minmax(0,1.32fr) minmax(0,1fr);gap:18px}
.feature-row .story-featured{grid-row:span 2}
.story-featured .story-card-visual{min-height:260px}
.story-featured .story-card-content{padding:22px}
.story-featured h3{font-size:26px}
.story-featured .story-card-content p{font-size:15px}
.feature-side{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.feature-side .story-card-visual{min-height:85px}
.story-compact{flex-direction:row;align-items:stretch}
.story-compact .story-card-visual{min-width:90px;width:28%;min-height:100%}
.story-compact .story-card-content{padding:14px}
.story-compact h3{font-size:16px}
.story-compact .story-card-content p{font-size:13px}

.topic-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.topic-card{min-height:160px;display:flex;flex-direction:column;align-items:flex-start;padding:20px;gap:8px;border:1px solid var(--rule);border-left:5px solid var(--accent,#D5AC45);background:var(--white);border-radius:13px}
.topic-card:nth-child(2){--accent:var(--mint)}.topic-card:nth-child(3){--accent:var(--orange)}.topic-card:nth-child(4){--accent:var(--sage)}.topic-card:nth-child(5){--accent:var(--lilac)}.topic-card:nth-child(6){--accent:#B7C3A8}
.topic-card p{font-size:14px;color:var(--muted);margin:0;flex:1}
.topic-card .text-link{margin-top:auto}

.split-feature{display:grid;grid-template-columns:1.2fr .88fr;gap:28px;align-items:center}
.split-feature .media-slot{width:100%}
.split-feature .feature-copy h2{margin:6px 0 15px}
.split-feature .feature-copy p{font-size:15px;line-height:1.88}
.split-feature .feature-copy .standalone-link{margin-top:9px}
.feature-quote{border-left:3px solid #C9A32F;padding-left:18px;color:#434E49;font-style:normal;font-size:16px}
.genre-duo{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.genre-duo article{border:1px solid var(--rule);background:#fff;border-radius:var(--radius);padding:20px;min-width:0}
.genre-duo article:nth-child(2){background:#F5F7F0}
.genre-duo .media-slot{margin-bottom:14px}
.genre-duo p{font-size:15px}
.uneven-pair{display:grid;grid-template-columns:.85fr 1.15fr;gap:24px;align-items:stretch}
.uneven-pair article{border-radius:var(--radius);padding:24px;background:#fff;border:1px solid var(--rule)}
.uneven-pair article:nth-child(2){background:#F0F3E7}
.uneven-pair h3{margin:11px 0}
.inline-episode{display:flex;justify-content:space-between;gap:8px;padding:12px 0;border-bottom:1px solid var(--rule);font-size:14px}
.inline-episode span{color:var(--muted)}

.timeline{position:relative;display:grid;gap:0;border-left:2px solid #E4CE83;margin-left:11px;padding-left:26px}
.timeline-entry{padding:4px 5px 19px;position:relative}
.timeline-entry:before{content:"";position:absolute;left:-34px;top:12px;width:14px;height:14px;border-radius:50%;background:var(--yellow);border:3px solid #FFF8E1;box-shadow:0 0 0 1px #C59C42}
.timeline-entry h3{margin:3px 0 7px}
.timeline-entry p{font-size:14px;color:var(--muted);margin-bottom:5px}
.timeline-entry a{font-weight:750;color:#33635E}
.process-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.process-step{background:white;border:1px solid var(--rule);border-radius:12px;padding:21px}
.process-step .step-num{color:#B38414;font-size:28px;font-weight:950;letter-spacing:-.08em;line-height:1.1}
.process-step h3{margin:8px 0}
.process-step p{font-size:14px;color:var(--muted);margin:0}
.character-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.character-item{display:grid;grid-template-columns:48px 1fr;gap:12px;align-items:start;border:1px solid var(--rule);background:white;padding:15px;border-radius:12px}
.char-token{display:flex;align-items:center;justify-content:center;width:48px;height:48px;border-radius:13px;background:#FFF0BF;color:#6D5B31;font-weight:930}
.character-item h3{margin:2px 0 5px;font-size:16px}
.character-item p{font-size:14px;margin:0}
.editor-panel{padding:24px;background:#F4F6EB;border:1px solid #E3E2CA;border-radius:13px}
.editor-panel p{margin:0}
.summary-panel{background:#fff;border:1px solid var(--rule);border-radius:14px;padding:22px}
.summary-panel p:last-child{margin-bottom:0}
.dark-panel{padding:26px;border:1px solid rgba(255,224,122,.23);background:#22282A;border-radius:15px}
.dark-panel h3{color:#fff}
.dark-panel p{color:#E5E7E2}
.icon-tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.icon-tile{background:#fff;border:1px solid var(--rule);padding:20px;border-radius:13px}
.icon-tile h3{margin-bottom:9px}
.icon-tile p{font-size:14px;color:var(--muted);margin:0}

/* Rich interior pages */
.page-opening{padding:42px 0 33px;background:linear-gradient(180deg,#FFF3D6 0%,#FFFAEE 100%)}
.page-opening .opening-copy{max-width:910px}
.page-opening h1{margin:7px 0 14px}
.page-opening p{max-width:900px;margin:0;color:#4A514F;line-height:1.85}
.crumbs{display:flex;gap:8px;align-items:center;flex-wrap:wrap;color:#7B775F;font-size:13px}
.crumbs a{color:#545B57}.crumbs a:hover{text-decoration:underline}
.page-article{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:35px;align-items:start}
.prose h2{margin:28px 0 12px}.prose h2:first-child{margin-top:0}
.prose h3{margin:18px 0 8px}
.prose p{font-size:16px;line-height:1.84;color:#41484C;margin-bottom:15px}
.prose .note-block{padding:20px;background:#FFF6DC;border-left:4px solid #D8AF3A;border-radius:0 11px 11px 0}
.prose .note-block p{font-size:15px;margin:0}
.prose .mini-list{padding-left:22px;margin:6px 0 22px}
.prose .mini-list li{padding:5px 0}
.info-side{position:sticky;top:137px;display:grid;gap:14px}
.info-side .media-slot{margin-bottom:2px}
.info-side .small-card{border:1px solid var(--rule);background:#fff;border-radius:12px;padding:16px}
.info-side .small-card h3{font-size:16px;margin-bottom:12px}
.info-side .small-card a{display:block;font-size:14px;padding:9px 0;border-top:1px solid var(--rule)}
.info-side .small-card a:hover{color:#87601B}
.reading-pair{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:18px 0}
.reading-pair article{border:1px solid var(--rule);background:white;border-radius:13px;padding:21px}
.reading-pair p{font-size:15px}
.work-stream{display:grid;gap:12px}
.work-stream .story-card-visual{min-height:120px}
.status-list{display:grid;gap:11px}
.status-row{padding:16px 18px;background:#fff;border:1px solid var(--rule);border-radius:11px;display:flex;gap:12px;align-items:flex-start;justify-content:space-between}
.status-row h3{font-size:16px}
.status-row p{font-size:14px;color:var(--muted);margin:4px 0 0}
.status-row .mini-label{white-space:nowrap}
.figure-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.figure-grid .character-item{grid-template-columns:54px 1fr}
.related-block{padding:26px;border:1px solid var(--rule);border-radius:14px;background:#fff;margin-top:30px}
.related-links{display:flex;flex-wrap:wrap;gap:10px;margin-top:12px}
.related-links a{display:inline-flex;align-items:center;min-height:44px;border:1px solid #D1B966;padding:8px 14px;border-radius:9px;font-size:14px;font-weight:800}
.related-links a:hover{background:#FFF0C5}

/* Detail and honest video state */
.detail-hero{display:grid;grid-template-columns:minmax(210px,330px) 1fr;gap:32px;align-items:start}
.detail-hero .media-slot{max-height:440px}
.detail-hero h1{margin:10px 0 14px}
.detail-hero .story-summary{font-size:16px;line-height:1.82;margin-top:15px}
.detail-facts{display:flex;gap:9px;flex-wrap:wrap;margin-bottom:10px}
.episode-list{display:grid;gap:9px}
.episode-row{background:white;display:grid;grid-template-columns:66px minmax(0,1fr) auto;align-items:center;gap:14px;padding:17px;border-radius:12px;border:1px solid var(--rule)}
.episode-row .ep-index{font-size:21px;font-weight:950;color:#AD7916;text-align:center}
.episode-row h3{font-size:16px;margin-bottom:5px}
.episode-row p{font-size:14px;margin:0;color:var(--muted)}
.episode-row .ep-actions{display:grid;gap:3px;justify-items:end}
.episode-row .ep-actions small{font-size:12px;color:#806F4C}
.episode-row .btn{min-height:44px;padding:8px 13px}
.player-shell{border-radius:14px;overflow:hidden;background:#15191C;color:white;border:1px solid rgba(255,255,255,.08)}
.player-shell video{width:100%;max-height:min(65vh,680px);height:auto;background:#080909}
.player-missing{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;min-height:245px;padding:27px;gap:10px;background:radial-gradient(circle at 50% 0%,#31392D 0%,#15191C 75%)}
.player-missing .no-video-mark{font-size:30px;display:flex;align-items:center;justify-content:center;width:72px;height:72px;background:#303833;border:1px solid #777D63;color:#FFE07A;border-radius:50%}
.player-missing h2{color:#FAFAF5}.player-missing p{color:#BFC8BE;max-width:560px;font-size:14px;margin:0}
.player-meta{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;background:#202629;padding:16px 18px;color:#F6F6F2}
.player-meta strong{font-size:16px}
.episode-step-links{display:flex;gap:11px;flex-wrap:wrap;margin-top:18px}
.episode-step-links a{min-height:44px;padding:10px 15px;background:white;border:1px solid var(--rule);border-radius:9px;font-size:14px;font-weight:780}
.episode-step-links a:hover{background:#FFF2CB}

.search-results{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}
.search-page-form{display:flex;gap:9px;max-width:780px;margin-top:20px}
.search-page-form input{height:48px;min-width:0;flex:1;border-radius:10px;border:1px solid #C7B17C;padding:0 15px;background:#fff;font-size:16px}
.search-page-form button{min-width:106px}
.empty-list{padding:37px 26px;border:1px dashed #C4A64F;border-radius:13px;background:#FFF9E6;text-align:center}
.empty-list p{margin:10px auto;max-width:660px}
.faq-list{display:grid;gap:15px;max-width:1000px}
.faq-item{background:#fff;border:1px solid var(--rule);padding:20px;border-radius:12px}
.faq-item h2{font-size:17px;margin:0 0 9px}
.faq-item p{font-size:15px;margin:0;color:#4A5351;line-height:1.78}
.faq-preview{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.faq-preview article{border:1px solid var(--rule);border-radius:12px;background:#fff;padding:18px}
.faq-preview h3{font-size:16px;margin-bottom:8px}
.faq-preview p{font-size:14px;margin:0}

/* APP experience */
.app-showcase{display:grid;grid-template-columns:1fr 290px;gap:27px;align-items:center}
.app-showcase>div:first-child{max-width:770px}
.app-showcase p{line-height:1.83}
.app-showcase .media-slot{width:100%}

/* Footer & all interactive panels */
.site-footer{background:#15191C;color:#E4E5DC;border-top:4px solid #E6BE48}
.footer-inner{padding-top:46px;padding-bottom:24px}
.footer-intro{display:grid;grid-template-columns:210px 1fr;gap:28px;align-items:center;padding-bottom:27px;border-bottom:1px solid #41443A}
.footer-brand{display:flex;flex-direction:column;align-items:flex-start;gap:5px;color:#fff}
.footer-brand img{max-height:36px;max-width:160px}
.footer-brand strong{font-size:26px;font-weight:900;color:var(--yellow-light)}
.footer-brand span{font-size:11px;color:#F8E1A5;letter-spacing:.12em;font-weight:750}
.footer-intro p{font-size:14px;color:#D2D7D0;margin:0;max-width:800px}
.footer-menus{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:26px;padding:30px 0}
.footer-group{display:flex;flex-direction:column;gap:10px}
.footer-group h2{font-size:15px;color:#FFE07A;border-bottom:1px solid #3D4240;padding-bottom:8px;margin-bottom:3px}
.footer-group a{font-size:13px;color:#D5DCD3;min-height:22px}
.footer-group a:hover{color:#FFF3A9;text-decoration:underline}
.footer-bottom{display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px 25px;padding-top:21px;border-top:1px solid #41443A}
.footer-bottom p{margin:0;font-size:12px;color:#CDD4C9;max-width:850px}
.ui-mask{position:fixed;inset:0;z-index:90;opacity:0;background:rgba(19,24,25,.55);visibility:hidden;pointer-events:none;transition:opacity .2s ease}
.ui-mask.is-open{opacity:1;visibility:visible;pointer-events:auto}
.drawer{position:fixed;z-index:100;right:0;top:0;bottom:0;width:min(390px,86vw);max-height:100dvh;background:#FFFAEE;box-shadow:-18px 0 45px rgba(20,19,16,.2);transform:translateX(103%);opacity:0;visibility:hidden;pointer-events:none;transition:transform .25s ease,opacity .2s ease;display:flex;flex-direction:column}
.drawer.is-open{transform:translateX(0);opacity:1;visibility:visible;pointer-events:auto}
.drawer-head{display:flex;align-items:center;justify-content:space-between;gap:15px;min-height:76px;padding:15px 21px;border-bottom:1px solid var(--rule);background:#fff}
.drawer-head>div{display:flex;flex-direction:column}
.drawer-brand{font-size:22px;font-weight:940;color:#25282A}
.drawer-head small{font-size:10px;letter-spacing:.08em;color:#7B725C;font-weight:800}
.close-button{min-width:44px;min-height:44px;border:1px solid #E4C881;border-radius:10px;background:#FFF3D2;color:#302B20;font-size:27px;line-height:1;display:flex;align-items:center;justify-content:center}
.close-button:hover{background:#FFE29C}
.drawer-body{overflow-y:auto;overscroll-behavior:contain;padding:19px 20px 28px;min-height:0;flex:1}
.drawer-subline{font-size:14px;color:#5F655E;margin:0 0 20px}
.drawer-group{margin-bottom:23px}
.drawer-group h2{font-size:14px;margin-bottom:10px;padding-left:9px;border-left:4px solid #E7B834}
.drawer-links{display:grid;grid-template-columns:1fr;gap:7px}
.drawer-links a{display:block;padding:11px 12px;border-radius:10px;background:#fff;border:1px solid var(--rule)}
.drawer-links a:hover{border-color:#D6A730;background:#FFF5DA}
.drawer-links strong{display:block;font-size:14px;color:#303432;margin-bottom:3px}
.drawer-links span{display:block;font-size:12px;color:#6C7670;line-height:1.55}
.search-panel{position:fixed;right:max(20px,calc((100vw - 1240px)/2));top:79px;z-index:101;width:min(560px,calc(100vw - 40px));max-height:calc(100dvh - 100px);overflow:auto;visibility:hidden;pointer-events:none;opacity:0;transform:translateY(-9px);transition:opacity .18s,transform .18s;background:#fff;border:1px solid #E8D8AA;border-radius:15px;box-shadow:0 20px 60px rgba(20,20,13,.18);padding:24px}
.search-panel.is-open{opacity:1;visibility:visible;pointer-events:auto;transform:translateY(0)}
.search-header{display:flex;justify-content:space-between;align-items:start;gap:12px}
.search-header h2{font-size:20px;margin:3px 0 0}
.search-form{margin-top:18px}
.search-form label{display:block;font-size:13px;color:#4A514D;font-weight:820;margin-bottom:8px}
.search-field{display:flex;gap:9px}
.search-field input{flex:1;min-width:0;background:#FFFDF7;border:1px solid #CDBE95;border-radius:10px;padding:10px 13px;min-height:47px;outline-offset:2px;font-size:16px;color:#293032}
.search-field .btn{padding:8px 12px}
.search-quick{border-top:1px solid var(--rule);display:flex;flex-wrap:wrap;gap:7px;margin-top:19px;padding-top:14px;align-items:center}
.search-quick span{font-size:13px;color:#5A625B;margin-right:2px}
.search-quick a{display:inline-flex;align-items:center;min-height:38px;padding:7px 10px;border-radius:8px;font-size:13px;background:#FFF1C9;font-weight:720}
.search-quick a:hover{background:#FFDC78}
.bottom-nav{display:none}

@media (max-width:1100px){.primary-links{gap:6px}.primary-links a{font-size:13px;padding-inline:4px}.nav-shell{gap:10px}.header-app{padding-inline:10px}.story-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.feature-side .story-card-visual{min-height:75px}}
@media (max-width:870px){.primary-links{display:none}.nav-shell{justify-content:space-between}.header-actions{margin-left:auto}.story-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.feature-row{grid-template-columns:1fr}.feature-row .story-featured{grid-row:auto}.feature-side{grid-template-columns:repeat(2,minmax(0,1fr))}.feature-row .story-featured .story-card-visual{min-height:170px}.split-feature{grid-template-columns:1fr 1fr}.page-article{grid-template-columns:minmax(0,1fr) 225px;gap:20px}.footer-menus{grid-template-columns:repeat(2,minmax(0,1fr))}.app-showcase{grid-template-columns:1fr 230px}}
@media (max-width:650px){
 html{scroll-padding-top:124px}
 body{padding-bottom:calc(61px + env(safe-area-inset-bottom,0px))}
 .shell{width:calc(100% - 32px)}
 .masthead{height:68px}
 .nav-shell{width:calc(100% - 32px);gap:9px}
 .site-logo{min-width:0;height:50px;max-width:41%;overflow:hidden;flex:1 1 auto}
 .site-logo img{max-width:100%;max-height:32px}
 .logo-word{font-size:23px;letter-spacing:-.075em}
 .logo-ai{font-size:15px}
 .logo-word small{top:29px;font-size:7px}
 .header-actions{gap:0;flex:0 0 auto}
 .icon-action{min-width:44px;height:48px;padding:5px}
 .button-name{font-size:9px}
 .header-app{display:none}
 .topic-nav{height:42px;width:100%;background:#FFF4D8}
 .topic-scroll{height:42px;width:100%;padding:0 16px;gap:19px;overscroll-behavior-x:contain}
 .topic-scroll a{font-size:12px}
 .hero-section{padding:15px 0 28px}
 .media-banner{aspect-ratio:16 / 8;min-height:140px;max-height:275px}
 .hero-image{margin-bottom:17px}
 .hero-under{padding:0 3px}
 .hero-under .hero-sentence{font-size:15px}
 .hero-under .intro-text{font-size:14px}
 .hero-under h1{font-size:27px}
 .btn-row{gap:9px}
 .btn{padding:9px 12px;min-height:44px}
 .section{padding:32px 0}
 .section-head{align-items:flex-start;gap:6px;flex-direction:column;margin-bottom:18px}
 .section-head>.text-link{min-height:32px}
 .story-grid,.story-grid.three,.story-grid.two,.feature-side,.genre-duo,.uneven-pair,.search-results{grid-template-columns:1fr}
 .story-card{min-height:0}
 .story-card-visual{min-height:95px}
 .story-card-content{padding:16px}
 .story-featured .story-card-visual{min-height:140px}
 .story-featured h3{font-size:22px}
 .story-compact .story-card-visual{min-width:80px}
 .topic-cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
 .topic-card{padding:14px;min-height:175px}
 .topic-card h3{font-size:16px}
 .topic-card p{font-size:13px}
 .split-feature,.detail-hero,.page-article,.app-showcase,.footer-intro{grid-template-columns:1fr}
 .info-side{position:static;grid-template-columns:1fr}
 .info-side .media-slot{max-height:220px}
 .app-showcase .media-slot{max-height:300px}
 .process-grid{grid-template-columns:1fr 1fr;gap:10px}
 .process-step{padding:14px}
 .character-list,.figure-grid,.reading-pair,.icon-tiles{grid-template-columns:1fr}
 .page-opening{padding:27px 0 21px}
 .page-opening h1{font-size:27px}
 .page-opening p{font-size:15px}
 .prose p{font-size:15px}
 .detail-hero .media-slot{max-height:300px;max-width:360px}
 .episode-row{grid-template-columns:40px minmax(0,1fr);gap:10px;padding:13px}
 .episode-row .ep-actions{grid-column:2;justify-items:start}
 .search-page-form input{font-size:16px}
 .footer-inner{padding-top:34px}
 .footer-menus{gap:21px 16px}
 .footer-bottom{padding-bottom:12px}
 .footer-intro{gap:15px}
 .footer-intro p{font-size:13px}
 .search-panel{position:fixed;inset:0;width:100%;height:100dvh;max-height:none;max-width:none;border-radius:0;border:0;padding:28px 18px;overflow:auto;transform:translateY(-10px);background:#F5F7F4}
 .search-panel .search-header{margin-top:5px}
 .search-panel .search-field{flex-direction:column;gap:11px}
 .search-panel .search-field .btn{height:48px}
 .drawer{width:min(390px,86vw)}
 .bottom-nav{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));align-items:start;position:fixed;left:0;right:0;bottom:0;width:100%;min-height:55px;padding:5px 5px calc(5px + env(safe-area-inset-bottom,0px));z-index:65;background:#fff;border-top:1px solid rgba(64,57,39,.15);box-shadow:0 -5px 18px rgba(26,26,21,.055)}
 .bottom-nav a{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:0;min-height:44px;border-radius:8px;font-size:11px;font-weight:800;color:#485051;line-height:1.4}
 .bottom-symbol{font-size:19px;line-height:1.2}
 .bottom-nav a.is-active{background:var(--yellow);color:#202428}
 .bottom-nav a:hover{background:#FFF0BB}
 .site-footer{margin-bottom:0}
}
@media (max-width:365px){.header-actions{gap:0}.nav-shell{width:calc(100% - 32px)}.site-logo{max-width:42%}.topic-scroll{gap:15px}.topic-cards{grid-template-columns:1fr 1fr}.topic-card{padding:12px}.topic-card p{font-size:12.5px}.feature-side{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important;animation:none!important}}

.inline-channel-image{max-width:360px;margin-bottom:20px}