/* HUANGDOU DRAMA */
:root{--paper:#F7F0D8;--paper2:#EDE3BE;--white:#FFFFFF;--pale:#FFF8E8;--sand:#F0E6C4;--ink:#3A2E10;--text:#4A3C18;--muted:#7A6A32;--lightmuted:#9A8850;--bean:#E0B83A;--bright:#F0D060;--darkbean:#B89220;--green:#6A8A3A;--edge:rgba(224,184,58,.22);--shadow:0 12px 28px rgba(58,46,16,.08);--limit:1120px}
*,*::before,*::after{box-sizing:border-box}
html{margin:0;max-width:100%;overflow-x:clip;scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--text);font-family:"PingFang SC","Microsoft YaHei","Noto Sans CJK SC",system-ui,sans-serif;font-size:15px;line-height:1.7;min-width:0;overflow-x:clip}
a{color:inherit;text-decoration:none}button,input{font:inherit}button{cursor:pointer}
a,button{touch-action:manipulation}a:hover{color:#87640c}a:focus-visible,button:focus-visible,input:focus-visible,summary:focus-visible{outline:3px solid #8f7021;outline-offset:3px}
img{max-width:100%;height:auto;display:block;object-fit:contain;object-position:center}
h1,h2,h3,h4,p{margin-top:0}h1{color:var(--ink);font-size:24px;line-height:1.3;letter-spacing:.01em;margin-bottom:15px}h2{color:var(--ink);font-size:20px;line-height:1.4}h3{color:var(--ink);font-size:16px;line-height:1.5}p{margin-bottom:12px}p:last-child{margin-bottom:0}
.shell{width:min(var(--limit),calc(100% - 32px));margin-inline:auto;min-width:0}
.site-header{position:fixed;top:0;left:0;right:0;width:100%;z-index:70;background:var(--white);box-shadow:0 3px 12px rgba(58,46,16,.06)}
.beanline{height:22px;background:var(--ink);color:var(--pale);font-size:12px}.beanline-inner{height:22px;display:flex;align-items:center;justify-content:space-between;gap:10px;white-space:nowrap}
.micro-search{display:flex;align-items:center;gap:4px;background:transparent;border:0;color:var(--pale);height:22px;line-height:1;padding:0 3px;font-size:12px}.micro-search:first-letter{font-size:15px}
.beanbar{height:60px;border-bottom:1px solid var(--edge);background:#fff}
.beanbar-inner{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;height:60px;gap:9px}
.site-logo{justify-self:start;display:flex;align-items:center;min-width:0;max-width:100%;min-height:44px}.site-logo img{height:28px;width:auto;max-width:165px;object-fit:contain}.text-logo{font-weight:850;font-size:16px;color:var(--ink);white-space:nowrap;letter-spacing:.04em}
.menu-open{background:var(--pale);border:1px solid var(--edge);border-radius:10px;height:44px;min-width:85px;display:flex;align-items:center;justify-content:center;gap:8px;color:var(--ink);font-weight:700;font-size:14px}.menu-mark{font-size:18px;line-height:1}
.app-shortcut{justify-self:end;display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 13px;border-radius:10px;background:linear-gradient(135deg,#F0D060 0%,#E0B83A 55%,#B89220 100%);color:var(--ink);font-size:14px;font-weight:750;white-space:nowrap}.app-shortcut:hover,.button-primary:hover{color:var(--ink);filter:brightness(1.04);box-shadow:0 5px 14px rgba(58,46,16,.15)}
.bean-tabs{height:40px;background:var(--pale);border-bottom:1px solid var(--edge)}.tab-inner{height:40px;display:flex;justify-content:center;align-items:center;gap:16px}.tab-inner a{font-size:13px;min-width:66px;min-height:30px;padding:4px 14px;display:grid;place-items:center;border-radius:7px}.tab-inner a.active{background:var(--bean);color:var(--ink);font-weight:750}
.page-main{padding-top:148px;padding-bottom:45px;min-height:calc(100vh - 280px)}
.section{margin-block:0 40px}.section-top{display:flex;justify-content:space-between;align-items:end;gap:15px;margin-bottom:14px}.section-top h2{margin:0}.section-top .fine-link{font-size:13px;font-weight:700;white-space:nowrap;color:#6e531a}
.eyebrow,.tag{font-size:12px;font-weight:800;letter-spacing:.06em;color:#7e6317}.eyebrow{display:block;margin-bottom:10px}.section-intro{color:var(--muted);max-width:820px}
.panel,.card,.entry-card,.feature-story,.wide-paper,.inside-hero,.article-step{background:var(--white);border:1px solid var(--edge);border-radius:12px;box-shadow:var(--shadow);min-width:0}
.panel{padding:20px}.card{padding:15px}.card h3{margin-bottom:9px}.card p{line-height:1.75}.card-footer{display:flex;justify-content:space-between;align-items:center;margin-top:14px;gap:10px}.fine-link{font-size:13px;color:#806018;font-weight:750}
.btnrow{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:18px}.button-primary,.button-secondary{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 18px;border-radius:10px;font-size:14px;font-weight:780;white-space:nowrap}.button-primary{background:linear-gradient(135deg,#F0D060 0%,#E0B83A 55%,#B89220 100%);color:var(--ink)}.button-secondary{background:#fff;border:1px solid var(--bean);color:var(--ink)}.button-secondary:hover{background:var(--pale);color:var(--ink)}
.media-slot{position:relative;background:linear-gradient(132deg,#FFF9EB 5%,#F3E7C6 55%,#E8D5A2 100%);border:1px solid var(--edge);border-radius:12px;overflow:hidden;min-height:95px;isolation:isolate}.media-slot:before{content:"";position:absolute;width:38%;aspect-ratio:1;border:1px solid rgba(184,146,32,.22);border-radius:50%;right:8%;top:12%;pointer-events:none}.media-slot:after{content:"";position:absolute;width:48%;height:2px;background:rgba(184,146,32,.25);left:9%;bottom:26%;transform:rotate(-18deg);pointer-events:none}.media-slot img{position:relative;z-index:2;display:block;width:100%;height:100%;object-fit:contain;object-position:center}.media-ornament{position:absolute;inset:auto auto 0 0;height:33%;width:65%;background:linear-gradient(95deg,rgba(224,184,58,.11),rgba(106,138,58,.05));clip-path:polygon(0 100%,10% 15%,75% 100%);pointer-events:none;z-index:0}
.hero-banner{height:260px;background:var(--pale)}.hero-copy{padding:23px 3px 2px}.hero-copy .minor-brand{font-size:12px;font-weight:850;color:#85671e;letter-spacing:.08em}.hero-copy h1{margin:8px 0 13px}.hero-copy .hero-summary{max-width:810px;margin:0;font-size:15px;line-height:1.8}
.triple-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.topic-card{display:flex;flex-direction:column;gap:0}.topic-card .media-slot{height:180px;border-radius:10px}.topic-card h3{margin:13px 0 8px}.topic-card p{flex:1}
.doukan-layout{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:18px}.doukan-layout .media-slot{height:200px}.doukan-entries{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:16px}.mini-entry{display:flex;align-items:center;gap:9px;border-top:1px solid var(--edge);padding:11px 5px;font-size:14px}.mini-entry b{color:#ab8021;font-size:18px}.mini-entry a{font-weight:750}
.feature-banner{height:190px;margin-bottom:13px}.shelf-list{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.shelf-unit{background:var(--pale);border-top:3px solid var(--bean);padding:16px 12px;border-radius:0 0 10px 10px}.shelf-unit h3{font-size:16px;margin-bottom:8px}.shelf-unit a{font-size:13px;color:#88621b;font-weight:780}
.rank-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}.rank-item{min-width:0;display:flex;flex-direction:column;gap:6px;padding:14px;background:var(--white);border:1px solid var(--edge);border-radius:10px}.rank-item b{font-size:29px;color:#b58d1e;line-height:1.2}.rank-item h3{margin-bottom:0}.rank-item p{font-size:14px;color:var(--muted);flex:1}
.timeline{position:relative;display:grid;gap:10px;counter-reset:flow}.timeline-item{position:relative;border-left:3px solid var(--bean);background:#fff;border-radius:0 10px 10px 0;padding:15px 18px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px}.timeline-item strong{font-size:15px}.timeline-item .state{font-size:12px;display:inline-flex;align-items:center;justify-content:center;align-self:start;border:1px solid var(--edge);padding:3px 9px;border-radius:6px;color:#64501b;background:var(--pale);white-space:nowrap}.timeline-item p{margin-top:6px;font-size:14px}
.note-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.note-card{border:1px solid var(--edge);border-radius:12px;padding:17px;background:var(--white)}.note-card:before{content:'↗';float:right;color:#b58d1e;font-size:18px}.note-card h3{margin-bottom:9px}
.app-preview{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.65fr);gap:20px;align-items:center}.app-preview .app-art{height:355px;background:#fff}.app-brand-icon{width:48px;height:48px;border-radius:12px;flex:none}.app-row{display:flex;align-items:center;gap:12px;margin:0 0 10px}.app-row h2{margin:0}.app-row .app-brand-icon img{height:100%;width:100%}
.bottom-info{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.bottom-info .panel{min-width:0}.bottom-info h2{margin-bottom:10px}.bottom-info .fine-link{display:inline-flex;margin-top:10px}
.quick-faq{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.faq-mini{background:#fff;padding:16px;border:1px solid var(--edge);border-radius:10px}.faq-mini h3{font-size:15px}.faq-mini p{font-size:14px}
.inside-hero{padding:21px;margin-bottom:22px;display:grid;grid-template-columns:minmax(0,1fr) minmax(240px,.7fr);gap:20px;align-items:center}.inside-hero.text-only{grid-template-columns:minmax(0,1fr)}.inside-hero .media-slot{height:202px}.inside-hero .intro{color:var(--text);font-size:15px;line-height:1.8}.inside-hero .breadcrumbs{font-size:12px;color:#806324;margin:0 0 13px}.inside-hero .breadcrumbs a{text-decoration:underline;text-underline-offset:3px}
.article-layout{display:grid;gap:14px;margin-bottom:24px}.article-layout.numbered{grid-template-columns:repeat(2,minmax(0,1fr))}.article-layout.numbered .article-step{padding:19px;display:grid;grid-template-columns:38px minmax(0,1fr);column-gap:12px}.article-step .step-num{grid-row:1 / span 2;align-self:start;font-size:24px;color:#a47c12;font-weight:800;line-height:1.4}.article-step h2{margin-bottom:8px}.article-step p{grid-column:2}.article-layout.catalog{grid-template-columns:repeat(2,minmax(0,1fr))}.article-layout.catalog .article-step{padding:18px;border-top:4px solid var(--bean)}.article-layout.catalog .article-step:nth-child(3n+2){border-top-color:var(--green)}.article-layout.catalog .article-step .step-num{display:inline-block;color:#ad8520;font-size:12px;margin-bottom:8px}.article-layout.strip .article-step{display:grid;grid-template-columns:minmax(0,.32fr) minmax(0,1fr);align-items:start;gap:22px;padding:20px 22px}.article-layout.strip .article-step .step-num{display:none}.article-layout.strip .article-step h2{border-right:1px solid var(--edge);padding-right:10px}.article-layout.strip .article-step p{line-height:1.82}.article-layout.timeline-article .article-step{padding:17px 20px 17px 25px;border-left:4px solid var(--bean);border-radius:0 10px 10px 0}.article-layout.timeline-article .article-step .step-num{float:right;color:#b78b21;font-size:17px}.article-layout.note{grid-template-columns:repeat(2,minmax(0,1fr))}.article-layout.note .article-step{padding:18px;background:var(--pale)}.article-layout.policy .article-step{padding:17px 21px;border-radius:0 10px 10px 0;border-left:4px solid var(--bean)}.article-layout.shelves{grid-template-columns:repeat(2,minmax(0,1fr))}.article-layout.shelves .article-step{padding:22px;border-top:4px solid #d0ac3f}.article-layout.product{grid-template-columns:repeat(2,minmax(0,1fr))}.article-layout.product .article-step{padding:18px;background:#fff}.article-layout .article-step p{margin:0;font-size:15px;line-height:1.75}
.article-after{padding:19px 21px;background:var(--sand);border:1px solid var(--edge);border-radius:12px;margin-bottom:26px}.article-after h2{margin-bottom:7px}.article-after p{max-width:930px}.related-links{display:flex;gap:9px;flex-wrap:wrap}.related-links a{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 13px;background:#fff;border:1px solid var(--edge);border-radius:9px;font-size:14px}
.faq-full{display:grid;gap:10px;margin-bottom:25px}.faq-full details{background:#fff;border:1px solid var(--edge);border-radius:10px;padding:0 17px}.faq-full summary{min-height:56px;padding:15px 24px 14px 1px;display:list-item;font-weight:800;font-size:15px;color:var(--ink);cursor:pointer}.faq-full details p{padding:2px 0 17px;margin:0}.faq-full details[open]{border-color:rgba(184,146,32,.55)}
.search-follow{margin-top:25px}.search-results{display:grid;gap:10px;max-width:920px}.search-result{padding:18px;background:#fff;border:1px solid var(--edge);border-radius:10px}.search-result h2{font-size:17px;margin-bottom:6px}.search-result p{font-size:14px}.search-inline-form{display:flex;gap:8px;max-width:630px;margin:18px 0}.search-inline-form input{flex:1;min-width:0;min-height:44px;padding:10px;border-radius:8px;border:1px solid var(--edge)}.search-inline-form button{min-height:44px;padding:0 17px;border:0;border-radius:8px;background:var(--bean);color:var(--ink);font-weight:750}
.site-footer{background:var(--ink);color:var(--paper);padding:37px 0 22px;font-size:13px}.site-footer a{color:var(--paper)}.site-footer a:hover{color:var(--bright)}.footer-head{display:flex;align-items:center;gap:20px;padding-bottom:22px;border-bottom:1px solid rgba(224,184,58,.24)}.footer-logo{display:flex;align-items:center;min-width:95px}.footer-logo img{max-height:28px;width:auto;object-fit:contain}.footer-head strong{font-size:16px;color:var(--pale)}.footer-head span{display:block;font-size:11px;letter-spacing:.09em;color:#e5cb84}.footer-head p{margin-top:7px;color:#e4d8b3}.footer-nav{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;padding:25px 0}.footer-col{display:flex;flex-direction:column;align-items:start;gap:9px}.footer-col h3{font-size:14px;color:var(--bright);margin-bottom:3px}.footer-notice{color:#e1d5ae;line-height:1.8;border-top:1px solid rgba(224,184,58,.22);padding:17px 0}.footer-bottom{border-top:1px solid rgba(224,184,58,.22);padding-top:15px;display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;color:#d4c598}.footer-bottom div{display:flex;gap:15px}
.mobile-bottom{display:none}
.global-shade{position:fixed;inset:0;background:rgba(24,18,3,.61);z-index:85;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .22s ease}.global-shade.is-open{opacity:1;visibility:visible;pointer-events:auto}
.pod-drawer{position:fixed;inset:0 auto 0 0;width:min(400px,86vw);z-index:90;background:var(--pale);box-shadow:var(--shadow);transform:translateX(-105%);opacity:0;visibility:hidden;pointer-events:none;transition:transform .25s ease,opacity .25s ease;display:flex;flex-direction:column;color:var(--ink)}.pod-drawer.is-open{transform:translateX(0);opacity:1;visibility:visible;pointer-events:auto}.drawer-head{padding:18px 16px;border-bottom:1px solid var(--edge);display:flex;align-items:center;justify-content:space-between;min-height:80px}.drawer-brand{display:flex;align-items:center;gap:10px}.drawer-brand img{width:auto;height:28px;max-width:125px}.drawer-brand strong{font-size:16px}.drawer-brand span{font-size:13px;color:var(--muted)}.layer-close{display:grid;place-items:center;min-width:44px;min-height:44px;background:var(--white);border:1px solid var(--edge);border-radius:10px;font-size:28px;line-height:1;color:var(--ink)}.drawer-scroll{overflow-y:auto;overscroll-behavior:contain;padding:14px 17px 28px}.drawer-intro{font-size:13px;color:var(--muted);margin:0 0 14px}.drawer-group{margin-bottom:23px}.drawer-group h2{font-size:15px;border-bottom:1px solid var(--edge);padding-bottom:8px;margin:0 0 7px;color:#9b7515}.drawer-link{display:block;min-height:62px;padding:8px 10px;border-radius:8px}.drawer-link strong{display:block;font-size:14px;line-height:1.5}.drawer-link span{display:block;font-size:12px;color:var(--muted);line-height:1.65}.drawer-link:hover,.drawer-link.selected{background:#eddfae;color:var(--ink)}
.search-layer{position:fixed;top:82px;left:50%;transform:translate(-50%,-10px);width:min(720px,calc(100% - 32px));z-index:95;background:var(--pale);border:1px solid var(--edge);border-radius:0 0 14px 14px;box-shadow:0 22px 55px rgba(28,22,8,.23);padding:23px;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .2s ease,transform .2s ease}.search-layer.is-open{transform:translate(-50%,0);opacity:1;visibility:visible;pointer-events:auto}.search-top{display:flex;justify-content:space-between;align-items:start;gap:12px}.search-top h2{font-size:20px;margin-bottom:14px}.search-form label{display:block;font-size:13px;font-weight:750;margin-bottom:8px}.search-form-row{display:flex;gap:8px}.search-form-row input{flex:1;min-width:0;border:1px solid var(--edge);background:#fff;min-height:44px;border-radius:8px;padding:0 12px;color:var(--ink);outline-offset:2px}.search-form-row button{min-height:44px;border:0;background:linear-gradient(135deg,#F0D060,#E0B83A,#B89220);color:var(--ink);font-weight:750;padding:0 13px;border-radius:8px;white-space:nowrap}.search-suggest h3{font-size:14px;margin:21px 0 10px}.suggest-links{display:flex;flex-wrap:wrap;gap:8px}.suggest-links a{font-size:13px;min-height:44px;padding:9px 14px;background:#fff;border:1px solid var(--edge);border-radius:8px}.overlay-active{overflow:hidden}
@media(max-width:900px){.shelf-list{grid-template-columns:repeat(2,minmax(0,1fr))}.rank-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.footer-nav{gap:12px}.inside-hero{grid-template-columns:minmax(0,1fr) minmax(200px,.55fr)}}
@media(max-width:700px){
 .bean-tabs{display:none}.page-main{padding-top:105px;padding-bottom:30px}.site-header{width:100%;left:0;right:0}.beanline,.beanbar{width:100%}.menu-open{min-width:74px;gap:5px}.app-shortcut{padding:0 9px;font-size:13px}.text-logo{font-size:16px}.site-logo img{max-width:137px}.page-main{min-height:70vh}.section{margin-bottom:30px}.triple-grid{grid-template-columns:1fr}.topic-card .media-slot{height:170px}.doukan-layout{grid-template-columns:1fr}.rank-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.note-grid,.bottom-info,.quick-faq{grid-template-columns:1fr}.app-preview{grid-template-columns:1fr}.app-preview .app-art{height:315px;max-width:340px;width:100%;margin:auto}.inside-hero{grid-template-columns:1fr;padding:18px}.inside-hero .media-slot{height:175px}.article-layout.numbered,.article-layout.catalog,.article-layout.note,.article-layout.shelves,.article-layout.product{grid-template-columns:1fr}.article-layout.strip .article-step{grid-template-columns:1fr;gap:8px}.article-layout.strip .article-step h2{border-right:0;border-bottom:1px solid var(--edge);padding:0 0 8px}.article-layout .article-step{padding:16px}.footer-nav{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.footer-head{align-items:start}.footer-head p{font-size:13px}.site-footer{padding-bottom:calc(76px + env(safe-area-inset-bottom,0px))}.mobile-bottom{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));position:fixed;bottom:0;left:0;right:0;width:100%;height:calc(48px + env(safe-area-inset-bottom,0px));padding-bottom:env(safe-area-inset-bottom,0px);background:#fff;border-top:1px solid var(--edge);box-shadow:0 -4px 20px rgba(38,27,7,.08);z-index:60}.mobile-bottom a{min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;font-size:11px;color:var(--text);height:48px}.bottom-symbol{font-weight:800;font-size:15px;line-height:1.1}.mobile-bottom a.current{background:var(--bean);color:var(--ink);font-weight:800}.pod-drawer{width:min(86vw,400px)}.search-layer{top:0;left:0;right:0;bottom:0;width:100vw;max-width:none;height:100dvh;overflow-y:auto;border:0;border-radius:0;background:var(--ink);color:var(--pale);transform:translateY(-10px);padding:26px 16px}.search-layer.is-open{transform:translateY(0)}.search-top h2,.search-top .eyebrow,.search-form label,.search-suggest h3{color:var(--pale)}.search-top h2{font-size:20px}.search-form-row{flex-direction:column}.search-form-row button{width:100%}.search-suggest a{background:#463a1b;color:var(--pale);border-color:rgba(224,184,58,.3)}.search-top .layer-close{background:#4b3c1a;color:var(--pale)}
}
@media(max-width:370px){.beanline{font-size:11px}.micro-search span{display:none}.text-logo{font-size:15px}.site-logo img{max-width:112px}.menu-open{min-width:68px;padding:0 5px}.app-shortcut{padding:0 6px;font-size:12px}.beanbar-inner{gap:6px}.hero-banner{height:260px}.shelf-list{gap:8px}.footer-head{flex-direction:column;gap:7px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important}}