/* roulang page: index */
:root{
      --plum:#4b244a;
      --plum-deep:#261d26;
      --plum-soft:#765271;
      --terracotta:#d56b45;
      --terracotta-dark:#b85032;
      --paper:#f7f3ee;
      --cream:#fffaf4;
      --mist:#eadde4;
      --almond:#f0e4d5;
      --ink:#302932;
      --muted:#756b72;
      --line:#dfd3d8;
      --green:#4d805f;
      --shadow:0 16px 38px rgba(59,34,55,.09);
      --shadow-lift:0 22px 45px rgba(59,34,55,.16);
      --radius:16px;
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{
      margin:0;color:var(--ink);background:var(--paper);
      font-family:"PingFang SC","Microsoft YaHei","Noto Sans SC",system-ui,sans-serif;
      font-size:16px;line-height:1.8;
      background-image:radial-gradient(rgba(75,36,74,.055) .7px,transparent .7px);
      background-size:15px 15px;
    }
    body.menu-open{overflow:hidden}
    a{color:inherit;text-decoration:none}
    button,input,select,textarea{font:inherit}
    button{cursor:pointer}
    img{max-width:100%;display:block}
    ::selection{background:#e4c3b5;color:var(--plum-deep)}
    :focus-visible{outline:3px solid rgba(213,107,69,.65);outline-offset:3px}
    .container{width:min(1180px,calc(100% - 48px));margin:0 auto}
    .section{padding:92px 0;position:relative}
    .eyebrow{display:flex;align-items:center;gap:9px;color:var(--plum);font-size:13px;font-weight:800;letter-spacing:.08em}
    .eyebrow i{width:8px;height:8px;border-radius:50%;background:var(--terracotta);box-shadow:0 0 0 4px rgba(213,107,69,.14)}
    .section-title{font-size:clamp(28px,3vw,38px);line-height:1.28;letter-spacing:-.035em;margin:13px 0 16px;font-weight:850;color:var(--plum-deep)}
    .section-intro{max-width:650px;color:var(--muted);margin:0;font-size:16px}
    .site-header{position:sticky;top:0;z-index:60;background:rgba(247,243,238,.94);border-bottom:1px solid transparent;transition:.22s ease}
    .site-header.scrolled{border-color:var(--line);box-shadow:0 6px 22px rgba(38,29,38,.07)}
    .nav-wrap{height:72px;display:flex;align-items:center;justify-content:space-between;gap:20px}
    .brand{display:inline-flex;align-items:center;flex-shrink:0;gap:9px;color:var(--plum-deep);font-weight:900;font-size:16px;letter-spacing:-.04em}
    .brand-mark{display:grid;place-items:center;width:28px;height:28px;border-radius:8px;background:var(--plum);color:#fff5ec;font-size:15px;box-shadow:inset 0 -3px 0 rgba(0,0,0,.14)}
    .desktop-nav{display:flex;align-items:center;gap:18px;margin-left:auto}
    .nav-link{font-size:14px;font-weight:700;color:#655a62;position:relative;padding:8px 2px;transition:color .2s ease}
    .nav-link:after{content:"";position:absolute;left:0;bottom:2px;width:0;height:2px;background:var(--terracotta);transition:width .2s ease}
    .nav-link:hover,.nav-link.active{color:var(--plum)}
    .nav-link:hover:after,.nav-link.active:after{width:100%}
    .stage-nav{display:flex;align-items:center;gap:5px;padding-left:5px;border-left:1px solid var(--line)}
    .stage{display:inline-flex;align-items:center;gap:5px;border-radius:8px;padding:5px 8px;font-size:12px;font-weight:800;color:#71636e;background:#ebe3e4;transition:.2s ease}
    .stage:hover{transform:translateY(-1px)}
    .stage.preheat{background:#e8dce7;color:#684063}
    .stage.live{background:#f2c8b8;color:#6e301d}
    .stage.live:before{content:"";width:6px;height:6px;border-radius:50%;background:var(--terracotta);animation:pulse 1.8s infinite}
    .stage.replay{background:#e8e1d9;color:#75695f}
    .stage.current{box-shadow:inset 0 0 0 1px rgba(213,107,69,.4)}
    .btn{min-height:44px;padding:10px 17px;border-radius:11px;border:1px solid transparent;display:inline-flex;align-items:center;justify-content:center;gap:8px;font-size:14px;font-weight:800;line-height:1.2;transition:transform .2s,background .2s,border-color .2s,box-shadow .2s}
    .btn:active{transform:translateY(1px)}
    .btn-primary{background:var(--plum);color:#fffaf4;box-shadow:0 7px 16px rgba(75,36,74,.18)}
    .btn-primary:hover{background:var(--plum-deep);transform:translateY(-2px);box-shadow:0 11px 22px rgba(75,36,74,.23)}
    .btn-secondary{background:rgba(255,250,244,.76);border-color:#bda8b8;color:var(--plum)}
    .btn-secondary:hover{border-color:var(--terracotta);color:var(--terracotta-dark);transform:translateY(-2px)}
    .btn-accent{background:var(--terracotta);color:#fffaf4}
    .btn-accent:hover{background:var(--terracotta-dark);transform:translateY(-2px)}
    .menu-toggle{display:none;border:1px solid var(--line);background:var(--cream);border-radius:10px;width:43px;height:43px;color:var(--plum);font-size:20px}
    .mobile-panel{display:none;padding:12px 24px 22px;border-top:1px solid var(--line);background:var(--paper)}
    .mobile-panel.open{display:block}
    .mobile-panel .nav-link{display:block;padding:11px 0}
    .mobile-panel .stage-nav{border:0;padding:8px 0 14px;margin:3px 0 10px}
    .notice-bar{background:var(--plum-deep);color:#f7eee7}
    .notice-inner{display:flex;align-items:center;gap:12px;min-height:39px;font-size:13px}
    .notice-dot{width:7px;height:7px;border-radius:50%;background:#e58a63;box-shadow:0 0 0 4px rgba(229,138,99,.12)}
    .notice-time{margin-left:auto;color:#d5c4cc;font-variant-numeric:tabular-nums}
    .hero{padding:66px 0 74px;overflow:hidden;position:relative;background:linear-gradient(130deg,#f7f3ee 0%,#f7f3ee 54%,#ebdce2 54%,#f0e4d5 100%)}
    .hero:before{content:"";position:absolute;width:600px;height:600px;border:1px solid rgba(75,36,74,.12);border-radius:50%;right:-210px;top:-155px}
    .hero-grid{display:grid;grid-template-columns:5fr 7fr;gap:54px;align-items:center;min-height:570px;position:relative}
    .hero-copy{padding:35px 0;position:relative;z-index:2}
    .hero h1{font-size:clamp(38px,4.3vw,55px);line-height:1.14;letter-spacing:-.065em;color:var(--plum-deep);font-weight:900;margin:17px 0 21px}
    .hero h1 em{font-style:normal;color:var(--terracotta)}
    .hero-text{font-size:17px;line-height:1.9;color:#675c65;margin:0;max-width:535px}
    .hero-actions{display:flex;flex-wrap:wrap;gap:11px;margin-top:28px}
    .adult-note{display:flex;gap:8px;align-items:flex-start;margin-top:20px;font-size:12px;line-height:1.65;color:#776d74}
    .adult-note strong{color:var(--plum)}
    .cover-stage{position:relative;min-height:530px;transform:translateY(14px)}
    .cover-main{position:absolute;inset:32px 7px 18px 38px;border-radius:28px;background:var(--plum-deep);overflow:hidden;box-shadow:var(--shadow-lift);transform:rotate(2.1deg)}
    .cover-main:before{content:"";position:absolute;inset:0;background:linear-gradient(130deg,rgba(255,255,255,.09),transparent 35%),radial-gradient(circle at 77% 24%,rgba(213,107,69,.78) 0 10%,transparent 10.3%),radial-gradient(circle at 64% 72%,rgba(226,175,163,.28) 0 18%,transparent 18.3%)}
    .cover-lines{position:absolute;inset:40px;border:1px solid rgba(255,246,237,.22);border-radius:22px}
    .cover-label{position:absolute;left:47px;bottom:49px;color:#fff5ec}
    .cover-label small{display:block;color:#decad6;font-size:12px;letter-spacing:.12em}
    .cover-label b{display:block;font-size:30px;line-height:1.25;margin-top:8px;letter-spacing:-.04em}
    .cover-index{position:absolute;right:47px;top:57px;color:#f3dcd4;text-align:right}
    .cover-index span{display:block;font-size:12px;letter-spacing:.16em}
    .cover-index strong{display:block;font-size:64px;line-height:1;margin-top:6px;font-weight:900}
    .floating-card{position:absolute;background:rgba(255,250,244,.95);border:1px solid rgba(255,255,255,.8);box-shadow:var(--shadow);border-radius:14px;padding:14px 16px;color:var(--plum-deep)}
    .floating-card.top{right:0;top:0;width:192px;transform:rotate(-4deg)}
    .floating-card.bottom{left:0;bottom:0;width:205px;transform:rotate(-3deg)}
    .floating-card span{font-size:12px;color:var(--muted);display:block}
    .floating-card b{font-size:23px;line-height:1.25;display:block;margin:3px 0 8px}
    .mini-bars{display:flex;align-items:end;gap:4px;height:20px}
    .mini-bars i{width:8px;background:var(--terracotta);border-radius:3px 3px 0 0}
    .dashboard{padding-top:0}
    .dashboard-box{background:var(--cream);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:24px;display:grid;grid-template-columns:1.2fr 2fr;gap:25px;align-items:center}
    .dashboard-copy{border-right:1px solid var(--line);padding-right:22px}
    .dashboard-copy h2{font-size:22px;line-height:1.4;margin:6px 0;color:var(--plum-deep);font-weight:850}
    .dashboard-copy p{font-size:14px;color:var(--muted);margin:0}
    .metric-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
    .metric{padding:14px;border-radius:12px;background:#f5edf0;border:1px solid #eadde3}
    .metric:nth-child(2){background:#f8ece2}.metric:nth-child(3){background:#eee7ed}.metric:nth-child(4){background:#f1ede8}
    .metric small{display:block;font-size:12px;color:var(--muted)}
    .metric b{font-size:25px;line-height:1.3;color:var(--plum-deep);font-variant-numeric:tabular-nums}
    .metric .rise{font-size:11px;color:var(--green);font-weight:800}
    .updates{background:linear-gradient(to bottom,transparent 0,transparent 80%,rgba(234,221,228,.4) 80%)}
    .updates-layout{display:grid;grid-template-columns:1.35fr .65fr;gap:28px;margin-top:35px}
    .update-list{border-top:1px solid var(--line)}
    .update-item{display:grid;grid-template-columns:86px 1fr auto;gap:18px;align-items:center;padding:19px 0;border-bottom:1px solid var(--line);transition:.2s ease}
    .update-item:hover{padding-left:10px;background:rgba(255,250,244,.58)}
    .update-date{font-size:13px;line-height:1.35;color:var(--plum);font-weight:850}
    .update-item h3{font-size:17px;line-height:1.45;margin:0 0 3px;font-weight:850}
    .update-item p{font-size:13px;color:var(--muted);margin:0}
    .arrow{color:var(--terracotta);font-size:22px;transition:transform .2s}
    .update-item:hover .arrow,.matrix-card:hover .arrow{transform:translateX(5px)}
    .rank-panel{background:var(--plum-deep);border-radius:var(--radius);padding:23px;color:#f9eee7}
    .rank-panel h3{font-size:18px;margin:0 0 15px}
    .rank-row{display:grid;grid-template-columns:26px 1fr auto;gap:10px;align-items:center;border-top:1px solid rgba(255,255,255,.13);padding:13px 0;font-size:13px}
    .rank-row:first-of-type{border-top:0}.rank-no{color:#e99b7d;font-weight:900}.rank-value{color:#d9c7d2;font-variant-numeric:tabular-nums}
    .matrix-head{display:flex;justify-content:space-between;gap:20px;align-items:end}
    .matrix{display:grid;grid-template-columns:repeat(12,1fr);gap:15px;margin-top:34px}
    .matrix-card{min-height:188px;border:1px solid var(--line);border-radius:16px;padding:19px;display:flex;flex-direction:column;position:relative;overflow:hidden;box-shadow:0 6px 17px rgba(59,34,55,.035);transition:.22s ease}
    .matrix-card:hover{transform:translateY(-3px);border-color:var(--terracotta);box-shadow:var(--shadow)}
    .matrix-card.large{grid-column:span 5;grid-row:span 2;min-height:391px;background:var(--plum);color:#fff8f0}
    .matrix-card.c1{grid-column:span 4;background:#eee5ed}.matrix-card.c2{grid-column:span 3;background:#f5e5db}.matrix-card.c3{grid-column:span 3;background:#eee9e4}.matrix-card.c4{grid-column:span 4;background:#e7dbe4}
    .channel-no{font-size:12px;letter-spacing:.12em;font-weight:900;color:var(--terracotta)}
    .large .channel-no{color:#f0ad90}
    .badge{display:inline-flex;width:max-content;margin-top:10px;padding:3px 7px;border-radius:6px;background:#f3c6b4;color:#73331f;font-size:11px;font-weight:850}
    .badge.cool{background:#d9cad8;color:#553151}.large .badge{background:rgba(255,255,255,.16);color:#fde4d8}
    .matrix-card h3{font-size:clamp(18px,2vw,25px);line-height:1.35;letter-spacing:-.04em;margin:13px 0 7px;font-weight:900}
    .matrix-card:not(.large) h3{font-size:18px;margin-top:11px}
    .matrix-card p{font-size:13px;line-height:1.7;margin:0;color:#655b63}
    .large p{font-size:15px;color:#e8d9e2;max-width:330px}
    .tagline{display:flex;flex-wrap:wrap;gap:6px;margin-top:auto;padding-top:14px}
    .tagline span{font-size:11px;padding:3px 6px;border:1px solid rgba(75,36,74,.2);border-radius:5px;color:#68435f}
    .large .tagline span{color:#f6e6df;border-color:rgba(255,255,255,.22)}
    .card-foot{margin-top:11px;display:flex;justify-content:space-between;align-items:center;font-size:12px;color:#766a72}.large .card-foot{color:#e5ceda}
    .heatline{height:3px;border-radius:5px;background:rgba(75,36,74,.12);overflow:hidden;margin-top:10px}.heatline i{display:block;height:100%;width:68%;background:var(--terracotta);border-radius:5px;transition:width .25s}.matrix-card:hover .heatline i{width:92%}
    .contrast{background:#f0e5df}
    .contrast-grid{display:grid;grid-template-columns:1fr 70px 1fr;gap:20px;align-items:center;margin-top:35px}
    .compare-card{min-height:330px;border-radius:var(--radius);padding:27px;border:1px solid var(--line)}
    .compare-card.before{background:#e8e2df;color:#746d70}.compare-card.after{background:var(--cream);box-shadow:var(--shadow)}
    .compare-card h3{font-size:22px;margin:5px 0 17px;color:var(--plum-deep)}
    .compare-list{display:grid;gap:10px}.compare-list div{padding:11px 13px;border-radius:9px;font-size:14px;background:rgba(255,255,255,.5)}
    .before .compare-list div{color:#888084;filter:saturate(.45)}
    .after .compare-list div{border-left:3px solid var(--terracotta);background:#f7efe9;color:#554955}
    .compare-list b{font-weight:850;color:var(--plum)}
    .compare-arrow{display:grid;place-items:center;width:55px;height:55px;margin:auto;border-radius:50%;background:var(--terracotta);color:#fff;font-size:27px;box-shadow:0 7px 15px rgba(213,107,69,.23)}
    .timeline{display:flex;gap:0;margin-top:28px;padding:15px 4px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);overflow:auto}
    .time-node{min-width:195px;position:relative;padding:0 16px;border-left:2px solid #cdaeba}
    .time-node:first-child{border-left-color:var(--terracotta)}.time-node small{display:block;color:var(--muted);font-size:12px}.time-node b{display:block;color:var(--plum);font-size:14px;margin-top:3px}
    .access-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:26px;align-items:stretch}
    .access-copy{padding:34px;background:var(--plum-deep);border-radius:var(--radius);color:#f8eee7;position:relative;overflow:hidden}
    .access-copy:after{content:"";width:170px;height:170px;border:1px solid rgba(255,255,255,.12);border-radius:50%;position:absolute;right:-55px;bottom:-68px}
    .access-copy .section-title{color:#fff5ec;margin-top:11px}.access-copy p{color:#dbccd3;font-size:15px;position:relative;z-index:1}
    .access-list{display:grid;grid-template-columns:1fr 1fr;gap:13px}
    .access-item{border:1px solid var(--line);background:var(--cream);border-radius:14px;padding:18px;transition:.2s ease}
    .access-item:hover{border-color:var(--terracotta);transform:translateY(-2px);box-shadow:var(--shadow)}
    .access-icon{width:36px;height:36px;display:grid;place-items:center;border-radius:10px;background:#eee0e7;color:var(--plum);font-weight:900}
    .access-item h3{font-size:16px;margin:10px 0 5px;color:var(--plum-deep);font-weight:850}.access-item p{font-size:13px;color:var(--muted);line-height:1.65;margin:0}
    .faq-layout{display:grid;grid-template-columns:.6fr 1.4fr;gap:70px;align-items:start}
    .faq-sticky{position:sticky;top:105px}.faq-sticky p{color:var(--muted);font-size:15px}.faq-list{border-top:1px solid var(--line)}
    details{border-bottom:1px solid var(--line);background:transparent}
    summary{list-style:none;display:flex;align-items:center;gap:14px;padding:19px 3px;cursor:pointer;font-size:16px;font-weight:850;color:var(--plum-deep)}
    summary::-webkit-details-marker{display:none}
    summary:after{content:"＋";margin-left:auto;color:var(--terracotta);font-size:23px;font-weight:400;transition:transform .2s}
    details[open] summary:after{transform:rotate(45deg)}
    .faq-no{font-size:12px;color:var(--terracotta);font-variant-numeric:tabular-nums}
    .faq-answer{margin:0 0 18px 38px;padding:14px 16px;border-radius:10px;background:#f4e8dd;color:#645862;font-size:14px;line-height:1.85}
    .contact{background:var(--plum-deep);padding:90px 0}
    .contact-grid{display:grid;grid-template-columns:.82fr 1.18fr;gap:55px;align-items:center}
    .contact-copy .eyebrow{color:#efc4b1}.contact-copy .eyebrow i{background:#ef9b78}.contact-copy .section-title{color:#fff4ec}.contact-copy p{color:#d9c8d1;font-size:16px}
    .contact-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}.contact-tags span{color:#ead8d0;border:1px solid rgba(255,255,255,.2);padding:5px 8px;border-radius:6px;font-size:12px}
    .form-card{background:var(--cream);border-radius:18px;padding:27px;box-shadow:0 18px 45px rgba(0,0,0,.18)}
    .form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}.field{margin-bottom:14px}
    label{display:block;font-size:13px;color:#554955;font-weight:800;margin-bottom:6px}
    input,select,textarea{width:100%;border:1px solid #d8c9cf;border-radius:10px;background:#fffdf9;color:var(--ink);padding:11px 12px;outline:0;transition:.2s;line-height:1.4}
    textarea{min-height:93px;resize:vertical}input:focus,select:focus,textarea:focus{border-color:var(--terracotta);box-shadow:0 0 0 3px rgba(213,107,69,.13)}
    .checkline{display:flex;gap:8px;align-items:flex-start;color:#71666d;font-size:12px;line-height:1.55;margin:5px 0 16px}.checkline input{width:16px;height:16px;accent-color:var(--plum);margin-top:2px;flex:0 0 auto}
    .form-message{display:none;margin-top:11px;padding:10px;border-radius:8px;font-size:13px}.form-message.show{display:block}.form-message.success{background:#e5f0e7;color:#356141}.form-message.error{background:#f8e4dd;color:#873d29}
    footer{background:#1d171e;color:#dfd0d7;padding:48px 0 26px}
    .footer-grid{display:grid;grid-template-columns:1.2fr .7fr .7fr;gap:35px;padding-bottom:32px;border-bottom:1px solid rgba(255,255,255,.12)}
    .footer-brand{color:#fff2e9;font-size:17px;font-weight:900}.footer-brand span{color:#e79a79}.footer-text{color:#bcaeb5;font-size:13px;max-width:390px;margin:10px 0 0}
    .footer-title{color:#f2dfd7;font-size:13px;font-weight:850;margin-bottom:11px}.footer-links{display:grid;gap:7px;font-size:13px;color:#bcaeb5}.footer-links a:hover{color:#e89a78;text-decoration:underline;text-underline-offset:4px}
    .footer-bottom{display:flex;justify-content:space-between;gap:18px;padding-top:20px;color:#978a91;font-size:12px}.footer-bottom a:hover{color:#e89a78}
    @keyframes pulse{50%{opacity:.35;transform:scale(.82)}}
    @media (max-width:1024px){
      .desktop-nav{gap:11px}.nav-link{font-size:13px}.hero-grid{gap:25px}.dashboard-box{grid-template-columns:1fr}.dashboard-copy{border-right:0;border-bottom:1px solid var(--line);padding:0 0 18px}.matrix-card.large{grid-column:span 6}.matrix-card.c1{grid-column:span 6}.matrix-card.c2,.matrix-card.c3{grid-column:span 3}.matrix-card.c4{grid-column:span 6}.faq-layout{gap:40px}
    }
    @media (max-width:767px){
      body{font-size:15px}.container{width:min(100% - 32px,1180px)}.section{padding:58px 0}.desktop-nav,.header-cta{display:none}.menu-toggle{display:grid;place-items:center;margin-left:auto}.nav-wrap{height:64px}.brand{font-size:14px}.brand-mark{width:26px;height:26px}.notice-inner{font-size:11px;gap:8px}.notice-time{font-size:10px}.hero{padding:38px 0 54px;background:linear-gradient(160deg,#f7f3ee 0%,#f7f3ee 68%,#eadce2 68%)}.hero-grid{grid-template-columns:1fr;min-height:0}.hero-copy{padding:0}.hero h1{font-size:38px}.hero-text{font-size:15px}.cover-stage{min-height:320px;transform:none;margin-top:5px}.cover-main{inset:24px 7px 16px 20px}.cover-label{left:29px;bottom:32px}.cover-label b{font-size:23px}.cover-index{right:28px;top:42px}.cover-index strong{font-size:48px}.floating-card.top{width:150px;padding:11px;right:0}.floating-card.bottom{width:160px;padding:11px;left:0}.floating-card b{font-size:18px}.dashboard-box{padding:17px}.metric-grid{grid-template-columns:1fr 1fr}.metric b{font-size:21px}.updates-layout,.access-grid,.contact-grid,.faq-layout{grid-template-columns:1fr;gap:28px}.update-item{grid-template-columns:61px 1fr auto;gap:9px}.update-item h3{font-size:15px}.matrix-head{display:block}.matrix-head .btn{margin-top:18px}.matrix{grid-template-columns:1fr 1fr;gap:11px}.matrix-card,.matrix-card.large,.matrix-card.c1,.matrix-card.c2,.matrix-card.c3,.matrix-card.c4{grid-column:span 1;grid-row:auto;min-height:210px;padding:15px}.matrix-card.large{grid-column:span 2;min-height:280px}.matrix-card h3{font-size:17px}.matrix-card.large h3{font-size:23px}.contrast-grid{grid-template-columns:1fr;gap:15px}.compare-arrow{transform:rotate(90deg)}.compare-card{min-height:auto;padding:20px}.timeline{margin-top:20px}.access-copy{padding:25px}.access-list{gap:10px}.access-item{padding:14px}.faq-sticky{position:static}.form-row{grid-template-columns:1fr}.contact{padding:58px 0}.form-card{padding:20px}.footer-grid{grid-template-columns:1fr;gap:25px}.footer-bottom{display:block}.footer-bottom p{margin:0 0 8px}
    }
    @media (max-width:430px){.hero-actions .btn{width:100%}.stage-nav{gap:3px}.stage{font-size:11px;padding:5px 6px}.matrix{grid-template-columns:1fr}.matrix-card.large{grid-column:span 1}.access-list{grid-template-columns:1fr 1fr}.section-title{font-size:27px}}
    @media (prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}

/* roulang page: category1 */
:root{
 --plum:#4b244a;
 --plum-deep:#261d26;
 --plum-soft:#765271;
 --terracotta:#d56b45;
 --terracotta-dark:#b85032;
 --paper:#f7f3ee;
 --cream:#fffaf4;
 --mist:#eadde4;
 --almond:#f0e4d5;
 --ink:#302932;
 --muted:#756b72;
 --line:#dfd3d8;
 --green:#4d805f;
 --shadow:0 16px 38px rgba(59,34,55,.09);
 --shadow-lift:0 22px 45px rgba(59,34,55,.16);
 --radius:16px;
 --radius-sm:11px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
 margin:0;
 color:var(--ink);
 background:var(--paper);
 font-family:"PingFang SC","Microsoft YaHei","Noto Sans SC",system-ui,sans-serif;
 font-size:16px;
 line-height:1.8;
 -webkit-font-smoothing:antialiased;
 background-image:radial-gradient(rgba(75,36,74,.055) .7px,transparent .7px);
 background-size:15px 15px;
}
body.menu-open{overflow:hidden}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit}
button{cursor:pointer}
button:disabled{cursor:not-allowed;opacity:.58;transform:none!important}
img{display:block;max-width:100%}
input,select,textarea{width:100%}
::selection{background:#dec5d4;color:var(--plum-deep)}
:focus-visible{outline:3px solid rgba(213,107,69,.42);outline-offset:3px}
.container{width:min(1180px,calc(100% - 48px));margin:0 auto}
.section{padding:86px 0;position:relative}
.eyebrow{
 display:flex;align-items:center;gap:9px;color:var(--plum);
 font-size:13px;font-weight:800;letter-spacing:.08em
}
.eyebrow i{
 width:8px;height:8px;border-radius:50%;background:var(--terracotta);
 box-shadow:0 0 0 4px rgba(213,107,69,.14)
}
.section-title{
 font-size:clamp(28px,3vw,38px);line-height:1.28;letter-spacing:-.035em;
 margin:13px 0 16px;font-weight:850;color:var(--plum-deep)
}
.section-intro{max-width:680px;color:var(--muted);margin:0;font-size:16px}
.site-header{
 position:sticky;top:0;z-index:60;background:rgba(247,243,238,.94);
 border-bottom:1px solid transparent;transition:.22s ease
}
.site-header.scrolled{border-color:var(--line);box-shadow:0 6px 22px rgba(38,29,38,.07)}
.nav-wrap{height:72px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.brand{
 display:inline-flex;align-items:center;flex-shrink:0;gap:9px;color:var(--plum-deep);
 font-weight:900;font-size:16px;letter-spacing:-.04em
}
.brand-mark{
 display:grid;place-items:center;width:28px;height:28px;border-radius:8px;
 background:var(--plum);color:#fff5ec;font-size:15px;
 box-shadow:inset 0 -3px 0 rgba(0,0,0,.14)
}
.desktop-nav{display:flex;align-items:center;gap:18px;margin-left:auto}
.nav-link{
 font-size:14px;font-weight:700;color:#655a62;position:relative;
 padding:8px 2px;transition:color .2s ease
}
.nav-link:after{
 content:"";position:absolute;left:0;bottom:2px;width:0;height:2px;
 background:var(--terracotta);transition:width .2s ease
}
.nav-link:hover,.nav-link.active{color:var(--plum)}
.nav-link:hover:after,.nav-link.active:after{width:100%}
.stage-nav{
 display:flex;align-items:center;gap:5px;padding-left:5px;
 border-left:1px solid var(--line)
}
.stage{
 display:inline-flex;align-items:center;gap:5px;border-radius:8px;padding:5px 8px;
 font-size:12px;font-weight:800;color:#71636e;background:#ebe3e4;
 transition:.2s ease
}
.stage:hover{transform:translateY(-1px)}
.stage.preheat{background:#e8dce7;color:#684063}
.stage.live{background:#f2c8b8;color:#6e301d}
.stage.live:before{
 content:"";width:6px;height:6px;border-radius:50%;background:var(--terracotta);
 animation:pulse 1.8s infinite
}
.stage.replay{background:#e8e1d9;color:#75695f}
.stage.current{box-shadow:inset 0 0 0 1px rgba(213,107,69,.4)}
.btn{
 min-height:44px;padding:10px 17px;border-radius:11px;border:1px solid transparent;
 display:inline-flex;align-items:center;justify-content:center;gap:8px;
 font-size:14px;font-weight:800;line-height:1.2;
 transition:transform .2s,background .2s,border-color .2s,box-shadow .2s,color .2s
}
.btn:active{transform:translateY(1px)}
.btn-primary{background:var(--plum);color:#fffaf4;box-shadow:0 7px 16px rgba(75,36,74,.18)}
.btn-primary:hover{background:var(--plum-deep);transform:translateY(-2px);box-shadow:0 11px 22px rgba(75,36,74,.23)}
.btn-secondary{background:rgba(255,250,244,.76);border-color:#bda8b8;color:var(--plum)}
.btn-secondary:hover{border-color:var(--terracotta);color:var(--terracotta-dark);transform:translateY(-2px)}
.btn-accent{background:var(--terracotta);color:#fffaf4}
.btn-accent:hover{background:var(--terracotta-dark);transform:translateY(-2px)}
.menu-toggle{
 display:none;border:1px solid var(--line);background:var(--cream);border-radius:10px;
 width:43px;height:43px;color:var(--plum);font-size:20px
}
.menu-toggle:hover{border-color:var(--terracotta);background:#fff6ed}
.mobile-panel{display:none;padding:12px 24px 22px;border-top:1px solid var(--line);background:var(--paper)}
.mobile-panel.open{display:block}
.mobile-panel .nav-link{display:block;padding:11px 0}
.mobile-panel .stage-nav{border:0;padding:8px 0 14px;margin:3px 0 10px}
.mobile-panel .btn{width:100%}
.status-strip{background:var(--plum-deep);color:#e9dde5;border-bottom:1px solid rgba(255,255,255,.07)}
.status-inner{
 min-height:39px;display:flex;align-items:center;justify-content:space-between;
 gap:18px;font-size:12px
}
.status-message{display:flex;align-items:center;gap:9px;min-width:0}
.status-dot{width:7px;height:7px;border-radius:50%;background:#75a984;box-shadow:0 0 0 4px rgba(117,169,132,.13)}
.status-message strong{color:#fff8f0}
.status-meta{display:flex;align-items:center;gap:14px;color:#cbbdc6;white-space:nowrap}
.channel-hero{
 position:relative;overflow:hidden;padding:70px 0 74px;
 background:
 linear-gradient(118deg,rgba(255,250,244,.96) 0 56%,rgba(234,221,228,.94) 56%),
 radial-gradient(circle at 85% 20%,rgba(213,107,69,.18),transparent 34%)
}
.channel-hero:before{
 content:"";position:absolute;right:-130px;top:-240px;width:570px;height:570px;
 border:1px dashed rgba(75,36,74,.17);border-radius:50%
}
.channel-hero:after{
 content:"";position:absolute;left:5%;bottom:28px;width:160px;height:8px;
 background:repeating-linear-gradient(90deg,rgba(213,107,69,.25) 0 8px,transparent 8px 14px)
}
.breadcrumb{display:flex;align-items:center;flex-wrap:wrap;gap:8px;color:var(--muted);font-size:13px;margin-bottom:20px}
.breadcrumb a:hover{color:var(--terracotta-dark)}
.hero-layout{display:grid;grid-template-columns:minmax(0,1.06fr) minmax(370px,.94fr);gap:68px;align-items:center}
.channel-code{
 display:inline-flex;align-items:center;gap:9px;padding:6px 10px;border:1px solid #ccb9c6;
 border-radius:8px;background:rgba(255,250,244,.72);color:var(--plum);
 font-size:12px;font-weight:800;letter-spacing:.08em
}
.channel-code span{color:var(--terracotta-dark)}
.channel-hero h1{
 margin:18px 0 20px;color:var(--plum-deep);font-weight:900;
 font-size:clamp(37px,4.5vw,56px);line-height:1.15;letter-spacing:-.06em
}
.channel-hero h1 em{font-style:normal;color:var(--terracotta)}
.hero-summary{max-width:650px;margin:0;color:#665a63;font-size:17px;line-height:1.9}
.hero-tags{display:flex;flex-wrap:wrap;gap:8px;margin:25px 0}
.tag{
 display:inline-flex;align-items:center;min-height:30px;padding:4px 10px;
 border:1px solid #d5c6cd;border-radius:7px;background:rgba(255,250,244,.72);
 color:#65485f;font-size:12px;font-weight:750;transition:.2s
}
.tag:hover{border-color:var(--terracotta);color:var(--terracotta-dark);transform:translateY(-1px)}
.hero-meta{display:flex;flex-wrap:wrap;gap:20px;color:var(--muted);font-size:13px}
.hero-meta b{color:var(--plum-deep)}
.hero-actions{display:flex;flex-wrap:wrap;gap:11px;margin-top:27px}
.topic-map{position:relative;min-height:425px}
.map-board{
 position:absolute;inset:16px 8px 12px 24px;border-radius:24px;background:var(--plum-deep);
 box-shadow:var(--shadow-lift);overflow:hidden;padding:29px;color:#fff9f2
}
.map-board:before{
 content:"";position:absolute;inset:0;
 background:
 radial-gradient(circle at 80% 18%,rgba(213,107,69,.85) 0 7%,transparent 7.4%),
 radial-gradient(circle at 78% 18%,rgba(213,107,69,.13) 0 20%,transparent 20.4%),
 linear-gradient(135deg,rgba(255,255,255,.08),transparent 40%)
}
.map-head{position:relative;display:flex;justify-content:space-between;align-items:center;gap:15px}
.map-head span{font-size:12px;color:#cbbbc5;letter-spacing:.08em}
.map-head b{font-size:15px}
.cloud{position:relative;height:245px;margin-top:20px}
.cloud-item{
 position:absolute;display:inline-flex;align-items:center;gap:7px;padding:8px 11px;
 border-radius:9px;border:1px solid rgba(255,255,255,.16);
 background:rgba(255,250,244,.08);font-size:12px;font-weight:700;color:#f5eaf0
}
.cloud-item:before{content:"";width:6px;height:6px;border-radius:50%;background:#d89a80}
.cloud-item.c1{left:3%;top:7%}
.cloud-item.c2{right:4%;top:24%;font-size:14px;background:rgba(213,107,69,.22)}
.cloud-item.c3{left:20%;top:41%;font-size:16px;border-color:rgba(213,107,69,.55)}
.cloud-item.c4{right:13%;bottom:20%}
.cloud-item.c5{left:4%;bottom:5%}
.map-foot{
 position:absolute;left:29px;right:29px;bottom:26px;display:grid;
 grid-template-columns:1fr 1fr;gap:10px
}
.map-stat{padding-top:11px;border-top:1px solid rgba(255,255,255,.15)}
.map-stat strong{display:block;font-size:22px;line-height:1.2;font-variant-numeric:tabular-nums}
.map-stat span{font-size:11px;color:#c8bac3}
.recommend-card{
 position:absolute;right:-10px;bottom:-5px;width:205px;padding:15px;
 border:1px solid #ead7c9;border-radius:14px;background:var(--cream);
 color:var(--plum-deep);box-shadow:var(--shadow);transform:rotate(-2deg)
}
.recommend-card .badge{margin-bottom:7px}
.recommend-card b{display:block;font-size:16px;margin-bottom:4px}
.recommend-card p{margin:0 0 10px;color:var(--muted);font-size:12px;line-height:1.55}
.recommend-card a{color:var(--terracotta-dark);font-size:12px;font-weight:850}
.badge{
 display:inline-flex;align-items:center;gap:6px;border-radius:7px;padding:4px 8px;
 font-size:11px;font-weight:850;line-height:1.4
}
.badge-hot{background:#f3d6c9;color:#843e27}
.badge-new{background:#e6d8e3;color:#613b5d}
.badge-update{background:#dce9df;color:#386448}
.badge-special{background:#eee3d5;color:#705846}
.tag-band{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:rgba(255,250,244,.72)}
.tag-scroll{
 min-height:70px;display:flex;align-items:center;gap:9px;overflow-x:auto;
 scrollbar-width:thin;scrollbar-color:#c8b6c1 transparent
}
.filter-chip{
 flex:0 0 auto;min-height:38px;padding:8px 14px;border:1px solid #d3c3cb;
 border-radius:9px;background:var(--cream);color:#66535f;font-size:13px;font-weight:750;
 transition:.2s
}
.filter-chip:hover{border-color:var(--terracotta);color:var(--terracotta-dark);transform:translateY(-1px)}
.filter-chip.active{background:var(--plum);border-color:var(--plum);color:#fffaf4}
.content-section{padding:82px 0 94px}
.content-head{display:flex;justify-content:space-between;align-items:end;gap:24px;margin-bottom:30px}
.content-count{font-size:13px;color:var(--muted)}
.content-count b{font-size:24px;color:var(--plum);margin-right:5px;font-variant-numeric:tabular-nums}
.content-layout{display:grid;grid-template-columns:minmax(0,8fr) minmax(280px,4fr);gap:28px;align-items:start}
.topic-flow{display:flex;flex-direction:column;gap:15px}
.topic-card{
 position:relative;display:grid;grid-template-columns:72px minmax(0,1fr) 38px;
 gap:17px;align-items:center;padding:21px;border:1px solid var(--line);
 border-radius:var(--radius);background:rgba(255,250,244,.86);box-shadow:0 8px 22px rgba(59,34,55,.05);
 transition:transform .22s,border-color .22s,box-shadow .22s,background .22s
}
.topic-card:hover{transform:translateY(-3px);border-color:#d49a83;box-shadow:var(--shadow)}
.topic-card.featured{
 grid-template-columns:88px minmax(0,1fr) 48px;padding:29px;
 background:linear-gradient(120deg,#fffaf4 0 68%,#f1e3d7 68%);
 border-color:#cfb6c2
}
.topic-number{
 display:grid;place-items:center;align-self:stretch;min-height:78px;border-radius:12px;
 background:var(--mist);color:var(--plum);font-size:20px;font-weight:900;
 font-variant-numeric:tabular-nums
}
.featured .topic-number{background:var(--plum);color:#fffaf4;font-size:24px}
.topic-main{min-width:0}
.topic-top{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-bottom:7px}
.topic-card h3{margin:0;color:var(--plum-deep);font-size:20px;line-height:1.42;font-weight:850}
.topic-card p{
 display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
 margin:7px 0 12px;color:var(--muted);font-size:14px;line-height:1.75
}
.topic-tags{display:flex;flex-wrap:wrap;gap:6px}
.topic-tags span{padding:3px 7px;border-radius:5px;background:#eee5e5;color:#6e5867;font-size:11px;font-weight:700}
.topic-meta{display:flex;flex-wrap:wrap;gap:14px;margin-top:12px;color:#887c83;font-size:11px}
.topic-arrow{
 display:grid;place-items:center;width:36px;height:36px;border-radius:9px;
 border:1px solid #d7c7ce;color:var(--plum);font-size:18px;transition:.2s
}
.topic-card:hover .topic-arrow{transform:translateX(4px);background:var(--terracotta);border-color:var(--terracotta);color:#fff}
.update-banner{
 position:relative;overflow:hidden;display:flex;align-items:center;justify-content:space-between;
 gap:20px;padding:22px 24px;border-radius:var(--radius);background:var(--plum);color:#fffaf4
}
.update-banner:after{
 content:"";position:absolute;right:-28px;top:-46px;width:150px;height:150px;
 border:25px solid rgba(255,255,255,.07);border-radius:50%
}
.update-banner strong{display:block;font-size:18px;position:relative;z-index:1}
.update-banner p{margin:3px 0 0;color:#ddcfd8;font-size:13px;position:relative;z-index:1}
.update-banner .badge{position:relative;z-index:1;white-space:nowrap}
.load-area{display:flex;justify-content:center;gap:8px;padding-top:15px}
.page-dot{
 width:43px;height:43px;border:1px solid var(--line);border-radius:9px;background:var(--cream);
 color:var(--plum);font-size:13px;font-weight:800;transition:.2s
}
.page-dot:hover,.page-dot.active{background:var(--plum);border-color:var(--plum);color:#fffaf4}
.sidebar{display:flex;flex-direction:column;gap:18px;position:sticky;top:96px}
.side-card{
 padding:22px;border:1px solid var(--line);border-radius:var(--radius);
 background:rgba(255,250,244,.92);box-shadow:0 8px 22px rgba(59,34,55,.05)
}
.side-card h2,.side-card h3{margin:0 0 15px;color:var(--plum-deep);font-size:18px;font-weight:850}
.side-title-row{display:flex;align-items:center;justify-content:space-between;gap:12px}
.side-title-row span{font-size:11px;color:var(--muted)}
.filter-list{display:grid;gap:8px}
.filter-option{
 display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 11px;
 border:1px solid transparent;border-radius:9px;background:#f3ece7;color:#66565f;
 font-size:13px;font-weight:700;transition:.2s
}
.filter-option:hover,.filter-option.active{border-color:#cdb5c3;background:#eee0e7;color:var(--plum)}
.filter-option small{color:#978a91;font-variant-numeric:tabular-nums}
.rank-list{list-style:none;padding:0;margin:0;display:grid;gap:13px}
.rank-item{display:grid;grid-template-columns:24px 1fr;gap:10px;align-items:start}
.rank-index{color:var(--terracotta-dark);font-size:13px;font-weight:900}
.rank-name{display:flex;justify-content:space-between;gap:8px;font-size:13px;font-weight:750}
.rank-name span:last-child{color:var(--muted);font-size:11px;font-weight:600}
.heat-line{height:4px;margin-top:7px;border-radius:4px;background:#eadfe2;overflow:hidden}
.heat-line i{display:block;height:100%;border-radius:4px;background:var(--terracotta)}
.timeline{position:relative;margin:4px 0 0;padding-left:20px}
.timeline:before{content:"";position:absolute;left:5px;top:7px;bottom:8px;width:1px;background:#d4c4cc}
.timeline-item{position:relative;padding:0 0 16px}
.timeline-item:last-child{padding-bottom:0}
.timeline-item:before{
 content:"";position:absolute;left:-19px;top:7px;width:9px;height:9px;border-radius:50%;
 background:#b9aab2;border:2px solid var(--cream)
}
.timeline-item.current:before{background:var(--terracotta);box-shadow:0 0 0 4px rgba(213,107,69,.13)}
.timeline-item b{display:block;font-size:13px;color:var(--plum-deep)}
.timeline-item span{display:block;font-size:11px;color:var(--muted)}
.side-callout{background:var(--almond);border-color:#ddc9b6}
.side-callout p{margin:0 0 14px;color:#75665f;font-size:13px}
.side-callout .btn{width:100%}
.compare-section{padding:86px 0;background:#eee5e2;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.compare-layout{display:grid;grid-template-columns:4fr 8fr;gap:58px;align-items:start}
.compare-copy{position:sticky;top:110px}
.compare-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;position:relative}
.compare-grid:before{
 content:"→";position:absolute;z-index:3;left:50%;top:44px;transform:translateX(-50%);
 width:39px;height:39px;display:grid;place-items:center;border-radius:50%;
 background:var(--terracotta);color:#fff;font-weight:900;box-shadow:0 7px 18px rgba(213,107,69,.24)
}
.compare-card{padding:25px;border:1px solid var(--line);border-radius:var(--radius);background:#f3efeb}
.compare-card.after{background:var(--cream);border-color:#c7aaba;box-shadow:var(--shadow)}
.compare-label{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:18px}
.compare-label b{font-size:17px;color:var(--plum-deep)}
.compare-list{list-style:none;padding:0;margin:0;display:grid;gap:11px}
.compare-list li{
 display:flex;align-items:flex-start;gap:10px;padding:11px;border-radius:9px;
 background:rgba(117,107,114,.07);color:#756d71;font-size:13px
}
.compare-card.after li{background:#f2e8e3;color:#574850}
.compare-icon{
 flex:0 0 21px;height:21px;border-radius:6px;display:grid;place-items:center;
 background:#ddd6d4;color:#82777b;font-size:11px;font-weight:900
}
.after .compare-icon{background:#e3c9bd;color:#813f2b}
.selection-note{
 margin-top:16px;padding:16px;border-left:3px solid var(--terracotta);
 background:rgba(255,250,244,.66);color:#65575e;font-size:13px
}
.faq-section{padding:90px 0}
.faq-layout{display:grid;grid-template-columns:4fr 8fr;gap:60px;align-items:start}
.faq-heading{position:sticky;top:110px}
.faq-heading p{color:var(--muted);max-width:350px}
.faq-list{display:grid;gap:11px}
.faq-item{
 border:1px solid var(--line);border-radius:14px;background:rgba(255,250,244,.9);
 overflow:hidden;transition:border-color .2s,box-shadow .2s
}
.faq-item[open]{border-color:#d2a994;box-shadow:0 12px 27px rgba(59,34,55,.07)}
.faq-item summary{
 list-style:none;display:grid;grid-template-columns:46px minmax(0,1fr) 28px;
 align-items:center;gap:12px;min-height:73px;padding:12px 18px;cursor:pointer;
 color:var(--plum-deep);font-size:15px;font-weight:800
}
.faq-item summary::-webkit-details-marker{display:none}
.faq-no{color:var(--terracotta-dark);font-size:12px;font-weight:900;letter-spacing:.07em}
.faq-arrow{display:grid;place-items:center;font-size:20px;transition:transform .2s}
.faq-item[open] .faq-arrow{transform:rotate(45deg)}
.faq-answer{padding:17px 19px 19px 76px;border-top:1px solid #eadbd4;background:#f6e9df;color:#685b61;font-size:14px}
.faq-answer p{margin:0}
.contact-section{padding:88px 0;background:var(--plum-deep);color:#fffaf4;position:relative;overflow:hidden}
.contact-section:before{
 content:"";position:absolute;left:-160px;bottom:-250px;width:520px;height:520px;
 border:1px dashed rgba(255,255,255,.1);border-radius:50%
}
.contact-layout{display:grid;grid-template-columns:5fr 7fr;gap:70px;align-items:center;position:relative}
.contact-copy .eyebrow{color:#e9cbbd}
.contact-copy .section-title{color:#fffaf4}
.contact-copy p{color:#cdbfc8;max-width:460px}
.contact-tags{display:flex;flex-wrap:wrap;gap:8px;margin:24px 0}
.contact-tags span{padding:5px 9px;border:1px solid rgba(255,255,255,.15);border-radius:7px;color:#e6d9e1;font-size:12px}
.adult-note{
 display:flex;align-items:flex-start;gap:10px;margin-top:20px;padding:14px;
 border-left:3px solid var(--terracotta);background:rgba(255,255,255,.05);
 color:#d5c7cf;font-size:12px
}
.form-card{padding:30px;border-radius:20px;background:var(--cream);color:var(--ink);box-shadow:var(--shadow-lift)}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.field.full{grid-column:1/-1}
.field label{display:block;margin-bottom:6px;color:#594c54;font-size:13px;font-weight:800}
.field input,.field select,.field textarea{
 border:1px solid #d8cbd0;border-radius:10px;background:#fffdf9;color:var(--ink);
 padding:11px 12px;min-height:46px;transition:border-color .2s,box-shadow .2s,background .2s
}
.field textarea{min-height:112px;resize:vertical}
.field input:hover,.field select:hover,.field textarea:hover{border-color:#bda8b8}
.field input:focus,.field select:focus,.field textarea:focus{
 outline:none;border-color:var(--terracotta);box-shadow:0 0 0 4px rgba(213,107,69,.12);background:#fff
}
.check-row{display:flex;align-items:flex-start;gap:9px;margin:17px 0}
.check-row input{width:17px;height:17px;margin-top:5px;accent-color:var(--plum);flex:0 0 auto}
.check-row label{color:#6c6066;font-size:12px;line-height:1.6}
.form-actions{display:flex;align-items:center;gap:14px}
.form-actions .btn{min-width:150px}
.form-status{font-size:12px;color:var(--green);font-weight:750;min-height:20px}
.privacy-note{margin:12px 0 0;color:#8b7f85;font-size:11px}
footer{padding:62px 0 24px;background:#1f181f;color:#cfc1ca;border-top:1px solid rgba(255,255,255,.06)}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:60px;padding-bottom:42px}
.footer-brand{display:inline-flex;color:#fffaf4;font-size:18px;font-weight:900}
.footer-brand span{color:#d49a83;font-size:13px;margin-left:4px}
.footer-text{max-width:430px;margin:14px 0 0;color:#a99ca4;font-size:13px}
.footer-title{margin-bottom:13px;color:#eee3e9;font-size:13px;font-weight:850}
.footer-links{display:grid;gap:8px}
.footer-links a{
 position:relative;width:max-content;color:#ae9fa8;font-size:13px;transition:color .2s
}
.footer-links a:after{
 content:"";position:absolute;left:0;bottom:1px;width:0;height:1px;
 background:var(--terracotta);transition:width .2s
}
.footer-links a:hover{color:#e6a88f}
.footer-links a:hover:after{width:100%}
.footer-bottom{
 display:flex;justify-content:space-between;gap:20px;padding-top:21px;
 border-top:1px solid rgba(255,255,255,.09);color:#8f828a;font-size:11px
}
.footer-bottom p{margin:0}
@keyframes pulse{
 0%,100%{box-shadow:0 0 0 0 rgba(213,107,69,.2)}
 50%{box-shadow:0 0 0 5px rgba(213,107,69,0)}
}
@media (max-width:1100px){
 .brand{font-size:14px}
 .desktop-nav{gap:12px}
 .stage{padding:5px 6px}
 .header-cta{display:none}
 .hero-layout{gap:38px}
 .channel-hero h1{font-size:44px}
 .content-layout{grid-template-columns:minmax(0,7fr) minmax(260px,4fr)}
}
@media (max-width:900px){
 .container{width:min(100% - 36px,1180px)}
 .section{padding:68px 0}
 .desktop-nav,.header-cta{display:none}
 .menu-toggle{display:grid;place-items:center}
 .hero-layout{grid-template-columns:1fr;gap:35px}
 .channel-hero{padding:54px 0 70px;background:linear-gradient(155deg,#fffaf4 0 63%,#eadde4 63%)}
 .topic-map{min-height:390px;max-width:620px;width:100%;margin:auto}
 .content-layout{grid-template-columns:1fr}
 .sidebar{position:static;display:grid;grid-template-columns:1fr 1fr}
 .compare-layout,.faq-layout,.contact-layout{grid-template-columns:1fr;gap:34px}
 .compare-copy,.faq-heading{position:static}
 .footer-grid{grid-template-columns:1.5fr 1fr 1fr;gap:34px}
}
@media (max-width:767px){
 body{font-size:15px;line-height:1.75}
 .container{width:calc(100% - 32px)}
 .nav-wrap{height:64px}
 .brand{max-width:255px;line-height:1.25}
 .brand-mark{width:26px;height:26px}
 .status-inner{min-height:43px}
 .status-meta span:first-child{display:none}
 .channel-hero{padding:42px 0 58px}
 .breadcrumb{margin-bottom:15px}
 .channel-hero h1{font-size:clamp(34px,10vw,44px);letter-spacing:-.055em}
 .hero-summary{font-size:15px}
 .hero-meta{gap:9px 16px}
 .hero-actions .btn{flex:1 1 150px}
 .topic-map{min-height:360px}
 .map-board{inset:12px 4px 15px 4px;padding:23px}
 .map-foot{left:23px;right:23px}
 .recommend-card{right:0;width:180px}
 .tag-scroll{min-height:64px}
 .content-section{padding:62px 0 70px}
 .content-head{align-items:start;flex-direction:column;gap:9px}
 .topic-card,.topic-card.featured{
  grid-template-columns:54px minmax(0,1fr);padding:17px;gap:13px
 }
 .topic-number{min-height:58px;font-size:16px}
 .topic-card.featured .topic-number{font-size:19px}
 .topic-card h3{font-size:17px}
 .topic-arrow{grid-column:2;justify-self:end;margin-top:-4px}
 .update-banner{align-items:flex-start;flex-direction:column;padding:20px}
 .sidebar{grid-template-columns:1fr}
 .compare-grid{grid-template-columns:1fr;gap:22px}
 .compare-grid:before{content:"↓";left:50%;top:calc(50% - 20px)}
 .faq-item summary{grid-template-columns:37px minmax(0,1fr) 24px;padding:11px 14px}
 .faq-answer{padding:16px 16px 18px}
 .contact-section{padding:66px 0}
 .form-card{padding:21px}
 .form-grid{grid-template-columns:1fr}
 .field.full{grid-column:auto}
 .form-actions{align-items:stretch;flex-direction:column}
 .form-actions .btn{width:100%}
 .footer-grid{grid-template-columns:1fr;gap:28px}
 .footer-bottom{flex-direction:column;gap:7px}
}
@media (max-width:520px){
 .container{width:calc(100% - 28px)}
 .mobile-panel{padding-left:14px;padding-right:14px}
 .status-meta{display:none}
 .status-message{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
 .channel-code{font-size:11px}
 .channel-hero h1{font-size:34px}
 .topic-map{min-height:335px}
 .cloud-item.c4{display:none}
 .cloud-item.c3{left:8%;top:42%;font-size:14px}
 .recommend-card{bottom:-4px}
 .map-stat strong{font-size:18px}
 .topic-card,.topic-card.featured{grid-template-columns:1fr}
 .topic-number{width:54px;min-height:42px}
 .topic-arrow{grid-column:1}
 .topic-meta{gap:7px 10px}
 .load-area{flex-wrap:wrap}
}
@media (prefers-reduced-motion:reduce){
 html{scroll-behavior:auto}
 *,*:before,*:after{animation:none!important;transition:none!important}
}