/* HUANGGUO DRAMA · responsive editorial site */
:root{--pink:#EB7295;--pink-soft:#F4B7C8;--pink-pale:#FBE5EC;--yellow:#FFF1BF;--yellow-soft:#F6DE8F;--ink:#171316;--body:#393237;--muted:#72666D;--faint:#968A90;--bg:#FFF9F8;--line:rgba(35,22,28,.12);--shadow:0 12px 30px rgba(80,35,50,.08)}
*,*::before,*::after{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--body);background:var(--bg);font:15px/1.75 system-ui,-apple-system,"PingFang SC","Microsoft YaHei",sans-serif;overflow-x:hidden}body.panel-open{overflow:hidden}a{color:inherit;text-decoration:none}button,input{font:inherit}button{cursor:pointer}img{display:block;max-width:100%;width:100%;height:100%;object-fit:contain;object-position:center}h1,h2,h3,p{margin-top:0}h1,h2,h3{line-height:1.35;color:var(--ink);font-weight:750;letter-spacing:-.025em}h1{font-size:30px}h2{font-size:22px}h3{font-size:17px}p{margin-bottom:15px}a,button{transition:color .18s,background-color .18s,box-shadow .18s,transform .18s}a:hover{color:#B72D62}button:active,.button:active{transform:scale(.98)}:focus-visible{outline:2px solid var(--pink);outline-offset:2px}.wrap{max-width:1140px;margin:0 auto;padding-left:24px;padding-right:24px}.skip{position:absolute;top:-100px;left:15px;background:#fff;padding:10px;z-index:90}.skip:focus{top:10px}.brandline{height:32px;background:var(--ink);color:#fff;font-size:12px}.brandline-inner{height:100%;display:flex;justify-content:space-between;align-items:center;gap:10px}.brandline-english,.adult-mini{color:var(--yellow)}.brandline-actions{display:flex;align-items:center;gap:17px}.top-search{background:none;border:0;color:#fff;padding:0 5px;min-height:30px}.site-header{background:#fff;border-bottom:1px solid #f3d9e1;position:relative;z-index:12}.header-inner{height:64px;display:flex;align-items:center;justify-content:space-between;gap:20px}.brand{flex:0 0 auto;display:flex;align-items:center;min-width:156px}.brand-logo{width:auto;height:28px;max-width:185px;object-fit:contain}.brand-text{font-size:17px;font-weight:800;color:var(--ink)}.primary{display:flex;align-items:stretch;justify-content:center;gap:22px;height:100%}.primary a{display:flex;align-items:center;position:relative;font-size:14px;font-weight:650;white-space:nowrap}.primary a.active,.desktop-app.active,.categories a.active{color:#BD2859}.primary a.active:after{position:absolute;content:"";height:2px;background:var(--pink);bottom:0;left:0;right:0}.header-actions{display:flex;align-items:center;gap:18px;white-space:nowrap}.desktop-app{font-size:13px;font-weight:700}.panel-toggle,.mobile-search{border:1px solid var(--line);border-radius:9px;background:white;padding:0 12px;min-height:44px;color:var(--ink);font-size:13px;font-weight:700}.panel-toggle:hover,.mobile-search:hover{background:var(--pink-pale)}.mobile-search{display:none}.category-band{background:#fffdf5;border-bottom:1px solid var(--line)}.categories{display:flex;gap:22px;align-items:center;flex-wrap:wrap;min-height:44px;padding-top:2px;padding-bottom:2px}.categories a{font-size:13px;font-weight:650;min-height:40px;display:inline-flex;align-items:center}.mobile-categories{display:none}.eyebrow{display:inline-block;color:#9C3158;text-transform:uppercase;letter-spacing:.1em;font-size:12px;font-weight:800;margin-bottom:14px}.hero{display:flex;align-items:center;gap:30px;padding-top:70px;padding-bottom:70px}.hero-copy{flex:0 1 56%;min-width:0}.hero-copy h1{max-width:650px;line-height:1.3;margin-bottom:20px}.hero-copy p{max-width:635px}.hero-art{flex:1 1 44%;min-width:0;max-width:500px;min-height:0;border-radius:16px;background:var(--pink-pale);padding:12px;display:flex;align-items:center;justify-content:center}.hero-image{height:auto;max-height:320px}.button-row{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px}.button{min-height:44px;border-radius:10px;padding:9px 20px;font-size:14px;font-weight:750;display:inline-flex;align-items:center;justify-content:center}.primary-button{background:#B93362;color:white}.primary-button:hover{color:white;background:#9d2450;box-shadow:var(--shadow)}.secondary-button{background:var(--yellow);border:1px solid #e9d59a;color:var(--ink)}.secondary-button:hover{background:#f6e5a1;color:var(--ink)}.home-section{margin-top:0;margin-bottom:66px}.section-heading{margin-bottom:26px}.section-heading h2{margin-bottom:9px}.section-heading p{max-width:750px;color:var(--muted)}.text-link{display:inline-flex;align-items:center;font-weight:750;color:#B33362;font-size:14px;min-height:44px}.text-link:after{content:'›';font-size:20px;margin-left:7px}.feature-mosaic{display:grid;grid-template-columns:1.2fr 1fr;gap:16px}.feature-main,.feature-stack article{background:white;border:1px solid var(--line);border-radius:16px;padding:26px;min-width:0}.feature-main{display:flex;flex-direction:column;background:#fff5f7}.feature-main .feature-img{margin-top:auto}.feature-copy>span,.feature-stack article span{font-size:12px;color:#AD3864}.feature-copy h3,.feature-stack h3{margin:5px 0 10px}.feature-stack{display:grid;gap:16px}.feature-stack article{display:flex;align-items:center;gap:16px;background:white}.feature-stack article>div:first-child{flex:1;min-width:0}.feature-stack .feature-img{flex:0 0 34%;min-width:0}.feature-img img{height:auto;max-height:225px}.feature-stack .feature-img img{max-height:145px}.wide-image{max-width:790px;margin:0 auto 24px;background:#fff;border-radius:15px}.wide-image img{height:auto;max-height:230px}.readable{max-width:835px;margin:auto}.split-section{display:grid;grid-template-columns:42% 1fr;gap:44px;align-items:center}.split-section.reverse .split-media{order:2}.split-media{min-width:0;background:#fff;border-radius:14px;padding:10px}.split-media img{height:auto;max-height:250px}.split-copy{min-width:0}.split-copy h2{margin-bottom:15px}.full-tint{background:var(--pink-pale);padding-top:42px;padding-bottom:42px}.topic-strip{display:grid;grid-template-columns:1fr 42%;gap:30px;align-items:center}.strip-image{min-width:0}.strip-image img{height:auto;max-height:230px}.mystery-block{display:grid;grid-template-columns:1fr 40%;gap:22px}.mystery-main{max-width:670px}.mystery-image img{height:auto;max-height:225px}.mystery-aside{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:18px}.mystery-aside>div{border-top:2px solid var(--pink-soft);padding-top:15px}.comedy-block{display:grid;grid-template-columns:42% 1fr;align-items:center;gap:40px}.comedy-image img{height:auto;max-height:220px}.rhythm-section{padding:45px 0;background:#fff;border-block:1px solid var(--line)}.rhythm-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:30px}.rhythm-grid section{border-top:3px solid var(--pink-soft);padding-top:18px}.rhythm-grid span{font-size:12px;color:#A33C64;font-weight:800}.creative-duo{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:25px}.creative-duo article{background:white;border:1px solid var(--line);padding:23px;border-radius:16px;min-width:0}.creative-image{margin:0 0 18px}.creative-image img{height:auto;max-height:210px}.mobile-experience{background:#fff1f1;padding:45px 0}.mobile-experience-inner{display:grid;grid-template-columns:35% 1fr;gap:70px;align-items:center}.mobile-visual{position:relative;max-width:280px;justify-self:center}.mobile-visual .app-portrait{width:auto;max-width:280px;max-height:420px;height:auto}.mobile-icon{position:absolute;bottom:8px;right:-18px;background:white;padding:7px;border-radius:12px;box-shadow:var(--shadow)}.app-icon{width:56px;height:56px}.adult-box{background:var(--yellow);padding:28px 34px;border-radius:16px}.adult-box p{max-width:850px}.faq-teaser{display:grid;grid-template-columns:1fr 1fr;gap:0 28px;margin-bottom:15px}.faq-teaser a{padding:13px 0;border-bottom:1px solid var(--line);min-height:48px;font-weight:650}.services-links{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}.services-links a{display:flex;flex-direction:column;gap:5px;padding:17px;background:#fff;border:1px solid var(--line);border-radius:12px;min-height:100px}.services-links strong{font-size:14px;color:var(--ink)}.services-links span{font-size:12px;color:var(--muted)}.quick-links{padding-top:22px;padding-bottom:22px;border-top:1px solid var(--line);display:flex;gap:19px;flex-wrap:wrap;align-items:center}.quick-links a{min-height:44px;display:inline-flex;align-items:center;font-size:13px}.quick-links strong{font-size:14px;color:var(--ink)}.site-footer{background:var(--ink);color:#e8dfe4;padding:45px 0 22px}.footer-head{display:flex;justify-content:space-between;gap:25px;margin-bottom:28px;align-items:center}.footer-brand{display:flex;align-items:center;gap:14px;color:white}.footer-brand img{max-width:125px}.footer-brand span{display:flex;flex-direction:column}.footer-brand small{font-size:12px;color:#e7c7d0}.footer-head p{font-size:13px;color:#dccbd3;max-width:400px;margin:0}.footer-groups{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px}.footer-groups h2{color:#fff;font-size:15px;margin-bottom:13px}.footer-groups a{display:block;font-size:13px;color:#e1d8dc;min-height:30px}.footer-groups a:hover{color:#fff0bd}.footer-policy{margin-top:26px;padding-top:18px;border-top:1px solid #4d4248;color:#d7cdd1;font-size:12px}.footer-policy p{margin-bottom:8px}.panel-overlay{visibility:hidden;pointer-events:none;position:fixed;inset:0;z-index:20;background:rgba(17,12,16,.44)}.panel-overlay.open{visibility:visible;pointer-events:auto}.floating-panel{visibility:hidden;pointer-events:none;position:fixed;z-index:25;left:50%;top:112px;transform:translateX(-50%);background:#fff;border-top:3px solid var(--pink);border-radius:0 0 13px 13px;box-shadow:0 20px 60px rgba(20,10,18,.18);max-height:68vh;overflow-y:auto;padding:20px 24px}.floating-panel.open{visibility:visible;pointer-events:auto}.directory{width:min(900px,calc(100vw - 40px))}.search-panel{width:min(640px,calc(100vw - 32px))}.panel-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.panel-heading h2{margin:0;font-size:21px}.close-panel{width:44px;height:44px;border:0;border-radius:8px;background:var(--pink-pale);color:var(--ink);font-size:26px;line-height:1}.directory-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px 30px}.directory-group h3{font-size:14px;margin-bottom:10px;color:#AC3862}.directory-group a{display:block;padding:8px 0;border-bottom:1px solid var(--line)}.directory-group strong{display:block;font-size:14px;color:var(--ink)}.directory-group span{display:block;font-size:12px;color:var(--muted)}.search-label{display:block;font-size:13px;margin-bottom:6px}.search-panel input{width:100%;height:44px;border:1px solid var(--line);border-radius:9px;padding:10px 12px;color:var(--ink);background:#fff}.search-results{display:grid;grid-template-columns:1fr 1fr;gap:6px 12px;margin-top:14px}.search-results a{border-bottom:1px solid var(--line);padding:10px;min-height:44px}.search-results a[hidden],.search-empty[hidden]{display:none}.search-empty{color:var(--muted);padding-top:12px}.page-shell{padding-top:26px;padding-bottom:52px}.breadcrumb{display:flex;gap:10px;align-items:center;font-size:12px;color:var(--muted);margin-bottom:24px}.page-intro{max-width:860px;margin-bottom:28px}.page-intro h1{margin-bottom:16px}.page-intro p{font-size:16px;color:var(--muted);line-height:1.8}.page-visual{max-width:900px;background:#fff;border-radius:14px;margin:0 0 28px;padding:12px}.page-visual img{height:auto;max-height:260px}.page-visual .brand-banner{max-height:260px}.page-visual .app-portrait{height:auto;max-height:420px;width:auto;max-width:280px;margin:auto}.small-icon{margin-bottom:20px}.article-body{max-width:835px}.article-part{margin-bottom:30px;padding-bottom:16px;border-bottom:1px solid var(--line)}.article-part h2{margin-bottom:13px}.article-part p{line-height:1.86}.article-part.part-1{border-left:3px solid var(--pink-soft);padding-left:20px}.article-part.part-2{background:#fffdf8;border-radius:10px;padding:20px 22px;border-bottom:0}.read-next{margin-top:26px;max-width:835px;border-top:2px solid var(--pink-soft);padding:22px 0}.read-next h2{font-size:19px}.next-links{display:flex;gap:11px;flex-wrap:wrap}.next-links a{min-height:44px;display:inline-flex;align-items:center;color:#a22c58;font-weight:650;font-size:14px;padding:0 15px;border:1px solid var(--line);border-radius:9px;background:white}.page-chang .article-body,.page-about .article-body{max-width:960px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.page-chang .article-part,.page-about .article-part{margin:0}.page-about .article-part:last-child{grid-column:1/-1}.page-lian .article-body{max-width:780px}.page-xiao .article-part{background:transparent;border-left:0;border-bottom:1px dashed var(--line);padding:0 0 18px}.page-mu .article-part{border-left:3px solid var(--pink);padding-left:20px;position:relative}.page-mu .article-part:before{content:'';position:absolute;left:-7px;top:6px;border-radius:50%;background:var(--pink);width:11px;height:11px}.page-app .page-visual{max-width:420px}.page-privacy .article-body,.page-banquan .article-body{max-width:780px}.muted-note{background:var(--yellow);padding:16px 20px;border-radius:10px;margin-bottom:24px}.faq-list{max-width:870px}.faq-item{margin-bottom:12px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:14px 20px}.faq-item summary{font-weight:750;color:var(--ink);cursor:pointer;font-size:16px;min-height:30px}.faq-item p{margin:12px 0 0;color:var(--body)}
@media(max-width:950px){.primary{gap:11px}.header-inner{gap:12px}.desktop-app{display:none}.feature-stack article{align-items:stretch;flex-direction:column}.feature-stack .feature-img{flex:auto}.services-links{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:700px){.wrap{padding-left:16px;padding-right:16px}.brandline-english{display:none}.brandline-actions{gap:10px}.top-search{display:none}.header-inner{height:58px}.brand{min-width:0}.brand-logo{height:28px;max-width:155px}.primary{display:none}.header-actions{gap:8px}.mobile-search{display:inline-flex;justify-content:center;align-items:center;font-size:22px;width:44px;padding:0}.panel-toggle{padding:0 9px;font-size:12px}.categories{gap:6px 18px;min-height:60px;align-content:center}.desktop-categories{display:none}.mobile-categories{display:flex}.categories a{min-height:28px;font-size:13px}.hero{padding-top:38px;padding-bottom:38px;display:flex;flex-direction:column;align-items:stretch;gap:22px}.hero h1{font-size:26px}.hero-art{max-width:none;width:100%;padding:8px}.hero-image{max-height:220px}.home-section{margin-bottom:40px}.section-heading{margin-bottom:18px}.feature-mosaic,.split-section,.topic-strip,.mystery-block,.comedy-block,.rhythm-grid,.creative-duo,.mobile-experience-inner,.faq-teaser,.page-chang .article-body,.page-about .article-body{grid-template-columns:1fr}.feature-main,.feature-stack article{padding:17px}.feature-main .feature-img{margin-top:10px}.feature-stack article{display:grid;grid-template-columns:1fr 33%;gap:12px;align-items:center}.feature-img img,.feature-stack .feature-img img{height:auto;max-height:200px}.split-section,.comedy-block{gap:17px}.split-section.reverse .split-media{order:0}.split-media img,.comedy-image img,.mystery-image img,.strip-image img,.wide-image img,.creative-image img{max-height:210px}.full-tint,.mobile-experience{padding:33px 0}.mystery-aside{grid-column:1;grid-template-columns:1fr;gap:10px}.rhythm-grid{gap:17px}.mobile-experience-inner{gap:20px}.mobile-visual{max-width:230px}.mobile-visual .app-portrait{max-width:230px;max-height:360px}.adult-box{padding:20px 18px}.services-links{grid-template-columns:1fr 1fr;gap:9px}.services-links a{padding:13px}.quick-links{gap:5px 15px}.footer-head{align-items:start;flex-direction:column}.footer-groups{grid-template-columns:1fr 1fr;gap:20px}.floating-panel{top:90px;padding:16px;max-height:72vh}.directory{width:calc(100vw - 24px)}.directory-grid,.search-results{grid-template-columns:1fr}.directory-grid{gap:16px}.page-shell{padding-top:18px;padding-bottom:34px}.page-intro h1{font-size:26px}.page-intro p{font-size:15px}.page-visual img{max-height:205px}.page-visual .brand-banner{max-height:190px}.page-visual .app-portrait{max-height:360px;max-width:230px}.article-part.part-2{padding:16px}.page-about .article-part:last-child{grid-column:auto}}
@media(min-width:701px) and (max-width:1000px){.wrap{padding-left:24px;padding-right:24px}.hero{gap:20px}.hero-copy{flex-basis:56%}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}a,button{transition:none}}

/* Media-absent layouts must collapse without vacant image columns. */
.split-media:empty,.mystery-image:empty,.comedy-block>div:first-child:empty,.strip-image:empty,.mobile-visual:empty{display:none}
.split-section:has(.split-media:empty),.comedy-block:has(>div:first-child:empty),.topic-strip:has(.strip-image:empty),.mystery-block:has(.mystery-image:empty),.mobile-experience-inner:has(.mobile-visual:empty){display:block}