/* roulang page: index */
:root{
      --bg:#0d0b10;
      --bg-2:#141118;
      --panel:#17141c;
      --panel-2:#201826;
      --line:#2d2333;
      --text:#f5f0ee;
      --muted:#b9acb4;
      --accent:#ff365d;
      --accent-2:#ffb84d;
      --accent-3:#43d6c8;
      --danger:#ff5478;
      --shadow:0 18px 40px rgba(0,0,0,.45);
      --shadow-hard:0 10px 0 rgba(0,0,0,.35);
      --radius:8px;
      --radius-sm:6px;
      --container:1240px;
      --gap:1.25rem;
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{
      margin:0;
      background:
        radial-gradient(circle at top left, rgba(255,54,93,.15), transparent 32%),
        radial-gradient(circle at 90% 15%, rgba(67,214,200,.12), transparent 26%),
        linear-gradient(180deg, #0b0910 0%, #110d14 52%, #0d0b10 100%);
      color:var(--text);
      font-family:"PingFang SC","Hiragino Sans GB","Microsoft YaHei",system-ui,-apple-system,sans-serif;
      line-height:1.75;
      overflow-x:hidden;
    }
    body::before{
      content:"";
      position:fixed;
      inset:0;
      pointer-events:none;
      opacity:.08;
      background-image:
        linear-gradient(rgba(255,255,255,.9) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.9) 1px, transparent 1px);
      background-size:24px 24px;
      mix-blend-mode:soft-light;
      z-index:0;
    }
    img{max-width:100%;display:block}
    a{color:inherit;text-decoration:none}
    a:hover{color:inherit}
    .site-shell{position:relative;z-index:1}
    .container-xxl{max-width:var(--container)}
    .site-header{
      position:sticky;
      top:0;
      z-index:1030;
      background:linear-gradient(90deg, rgba(255,54,93,.98), rgba(19,14,22,.98) 58%, rgba(19,14,22,.98));
      border-bottom:1px solid rgba(255,255,255,.08);
      box-shadow:0 8px 28px rgba(0,0,0,.24);
    }
    .brand-mark{
      display:inline-flex;
      align-items:center;
      gap:.72rem;
      color:#fff;
      font-weight:900;
      letter-spacing:.02em;
      text-transform:none;
    }
    .brand-badge{
      width:38px;height:38px;
      border-radius:10px;
      display:grid;
      place-items:center;
      background:linear-gradient(135deg, #fff 0%, #ffd5dd 30%, #ff365d 100%);
      color:#111;
      font-weight:900;
      box-shadow:var(--shadow-hard);
      transform:rotate(-8deg);
    }
    .brand-text{font-size:1.05rem;line-height:1.1}
    .navbar{padding:.85rem 0}
    .navbar-nav{gap:.45rem}
    .nav-link{
      color:rgba(255,255,255,.86) !important;
      font-weight:700;
      font-size:.97rem;
      letter-spacing:.01em;
      padding:.72rem 1rem !important;
      border-radius:999px;
      position:relative;
      transition:.22s ease;
    }
    .nav-link:hover,
    .nav-link:focus{
      background:rgba(255,255,255,.09);
      color:#fff !important;
      transform:translateY(-1px);
      outline:none;
    }
    .nav-link.active{
      background:#fff;
      color:#111 !important;
      box-shadow:var(--shadow-hard);
    }
    .nav-link.active::after{
      content:"";
      position:absolute;
      left:50%;
      bottom:-8px;
      transform:translateX(-50%);
      width:18px;
      height:3px;
      border-radius:999px;
      background:var(--accent-2);
    }
    .nav-cta{
      display:inline-flex;
      align-items:center;
      gap:.5rem;
      border:1px solid rgba(255,255,255,.2);
      border-radius:999px;
      padding:.72rem 1rem;
      color:#fff !important;
      background:rgba(0,0,0,.16);
      box-shadow:var(--shadow-hard);
      font-weight:800;
      transition:.22s ease;
      white-space:nowrap;
    }
    .nav-cta:hover{transform:translateY(-1px);background:rgba(0,0,0,.26)}
    .navbar-toggler{
      border:1px solid rgba(255,255,255,.38);
      border-radius:10px;
      padding:.45rem .6rem;
      box-shadow:none !important;
    }
    .navbar-toggler:focus{box-shadow:0 0 0 .2rem rgba(255,255,255,.18)}
    .navbar-toggler-icon{
      filter:invert(1) brightness(100);
    }
    .hero-section{
      padding:1.2rem 0 0;
    }
    .hero-wrap{
      position:relative;
      overflow:hidden;
      border-bottom:1px solid rgba(255,255,255,.06);
    }
    .hero-panel{
      position:relative;
      margin:1rem auto 0;
      max-width:var(--container);
      border:1px solid rgba(255,255,255,.08);
      background:
        linear-gradient(145deg, rgba(25,18,29,.92), rgba(10,8,13,.95)),
        radial-gradient(circle at 85% 15%, rgba(255,184,77,.14), transparent 18%),
        radial-gradient(circle at 15% 25%, rgba(255,54,93,.2), transparent 22%);
      box-shadow:var(--shadow);
      border-radius:calc(var(--radius) + 2px);
      overflow:hidden;
    }
    .hero-panel::before{
      content:"";
      position:absolute;
      inset:0;
      background:
        linear-gradient(115deg, rgba(255,255,255,.08), transparent 32%),
        radial-gradient(circle at 72% 42%, rgba(255,54,93,.18), transparent 26%);
      pointer-events:none;
    }
    .hero-inner{
      position:relative;
      padding:1.3rem;
    }
    .hero-grid{
      display:grid;
      grid-template-columns:minmax(0,1.15fr) minmax(340px,.85fr);
      gap:1.25rem;
      align-items:stretch;
    }
    .eyebrow-row{
      display:flex;
      flex-wrap:wrap;
      gap:.55rem;
      margin-bottom:1rem;
    }
    .chip{
      display:inline-flex;
      align-items:center;
      gap:.35rem;
      padding:.42rem .72rem;
      border-radius:999px;
      font-size:.84rem;
      font-weight:800;
      letter-spacing:.02em;
      background:rgba(255,255,255,.08);
      color:#fff;
      border:1px solid rgba(255,255,255,.1);
    }
    .chip.accent{
      background:rgba(255,54,93,.18);
      border-color:rgba(255,54,93,.45);
      color:#ffd8e0;
    }
    .chip.warn{
      background:rgba(255,184,77,.16);
      border-color:rgba(255,184,77,.42);
      color:#ffe7b7;
    }
    .hero-title{
      font-size:clamp(2rem, 4vw, 4.35rem);
      line-height:1.08;
      letter-spacing:-.03em;
      font-weight:900;
      margin:0 0 .9rem;
      max-width:11ch;
    }
    .hero-copy{
      max-width:56ch;
      color:var(--muted);
      font-size:1.02rem;
      margin-bottom:1.2rem;
    }
    .hero-actions{
      display:flex;
      flex-wrap:wrap;
      gap:.8rem;
      margin-bottom:1.1rem;
    }
    .btn-spot{
      border:1px solid transparent;
      border-radius:999px;
      padding:.86rem 1.1rem;
      font-weight:800;
      transition:.22s ease;
      box-shadow:var(--shadow-hard);
    }
    .btn-spot-primary{
      background:linear-gradient(135deg, #ff365d, #ff5f7d);
      color:#fff;
    }
    .btn-spot-primary:hover{transform:translateY(-2px);color:#fff;filter:saturate(1.1)}
    .btn-spot-ghost{
      background:transparent;
      color:#fff;
      border-color:rgba(255,255,255,.22);
    }
    .btn-spot-ghost:hover{background:rgba(255,255,255,.08);transform:translateY(-2px);color:#fff}
    .btn-spot-light{
      background:#fff;
      color:#111;
    }
    .btn-spot-light:hover{transform:translateY(-2px);color:#111}
    .hero-notes{
      display:flex;
      flex-wrap:wrap;
      gap:.7rem;
      margin-top:1rem;
    }
    .note-pill{
      padding:.55rem .8rem;
      background:rgba(255,255,255,.05);
      border:1px solid rgba(255,255,255,.08);
      border-radius:14px;
      color:#e9e2e6;
      font-size:.92rem;
    }
    .hero-visual{
      position:relative;
      min-height:100%;
      background:
        linear-gradient(180deg, rgba(255,54,93,.18), rgba(255,54,93,.02)),
        linear-gradient(135deg, rgba(255,255,255,.06), rgba(255,255,255,.01));
      border:1px solid rgba(255,255,255,.08);
      border-radius:calc(var(--radius) + 2px);
      padding:1rem;
      overflow:hidden;
    }
    .hero-cover{
      position:relative;
      min-height:320px;
      border-radius:18px;
      overflow:hidden;
      background:
        radial-gradient(circle at 25% 22%, rgba(255,184,77,.3), transparent 22%),
        radial-gradient(circle at 72% 28%, rgba(67,214,200,.24), transparent 20%),
        radial-gradient(circle at 50% 72%, rgba(255,54,93,.22), transparent 24%),
        linear-gradient(135deg, #141118 0%, #201826 38%, #0f0c12 100%);
      border:1px solid rgba(255,255,255,.1);
      box-shadow:inset 0 0 0 1px rgba(255,255,255,.03);
    }
    .hero-cover::before{
      content:"";
      position:absolute;
      inset:-10%;
      background:
        linear-gradient(180deg, rgba(255,255,255,.08), transparent 16% 18%, rgba(255,255,255,.03) 19% 20%, transparent 21% 40%, rgba(255,255,255,.06) 42% 43%, transparent 45% 100%),
        radial-gradient(circle at 30% 55%, rgba(255,255,255,.12), transparent 18%);
      opacity:.36;
      transform:rotate(-7deg);
    }
    .hero-cover-inner{
      position:relative;
      z-index:1;
      display:flex;
      flex-direction:column;
      justify-content:space-between;
      min-height:320px;
      padding:1.2rem;
    }
    .cover-top{
      display:flex;
      justify-content:space-between;
      align-items:flex-start;
      gap:.75rem;
      flex-wrap:wrap;
    }
    .stamp{
      display:inline-flex;
      align-items:center;
      gap:.35rem;
      padding:.5rem .72rem;
      border-radius:12px;
      background:#fff;
      color:#111;
      font-weight:900;
      box-shadow:var(--shadow-hard);
      transform:rotate(-4deg);
    }
    .stamp.small{font-size:.84rem;padding:.42rem .62rem}
    .countdown-wrap{
      display:grid;
      grid-template-columns:repeat(4,minmax(0,1fr));
      gap:.55rem;
      margin-top:1rem;
    }
    .count-box{
      background:rgba(0,0,0,.33);
      border:1px solid rgba(255,255,255,.1);
      border-radius:12px;
      padding:.8rem .55rem;
      text-align:center;
      backdrop-filter:blur(2px);
    }
    .count-num{
      display:block;
      font-size:clamp(1.25rem, 2.4vw, 1.9rem);
      line-height:1;
      font-weight:900;
      letter-spacing:.02em;
      font-variant-numeric:tabular-nums;
      min-height:1.9rem;
    }
    .count-label{
      display:block;
      margin-top:.35rem;
      color:#d8cfd5;
      font-size:.8rem;
    }
    .cover-bottom{
      display:grid;
      grid-template-columns:1fr auto;
      gap:.8rem;
      align-items:end;
      margin-top:1rem;
    }
    .cover-copy{
      max-width:28ch;
      color:#f5e7ec;
      font-size:.98rem;
      line-height:1.55;
    }
    .cover-side{
      display:flex;
      flex-direction:column;
      gap:.6rem;
      align-items:flex-end;
    }
    .cover-stat{
      min-width:128px;
      padding:.7rem .78rem;
      border-radius:12px;
      background:rgba(255,255,255,.06);
      border:1px solid rgba(255,255,255,.09);
    }
    .cover-stat strong{
      display:block;
      font-size:1.2rem;
      line-height:1.05;
      margin-bottom:.12rem;
    }
    .cover-stat span{
      color:var(--muted);
      font-size:.82rem;
    }
    .peek-strip{
      display:grid;
      grid-template-columns:repeat(3,minmax(0,1fr));
      gap:.8rem;
      margin-top:1rem;
    }
    .peek-item{
      padding:.82rem .9rem;
      border-radius:14px;
      background:rgba(255,255,255,.05);
      border:1px solid rgba(255,255,255,.08);
      min-height:88px;
    }
    .peek-item .small-tag{
      display:inline-block;
      font-size:.72rem;
      font-weight:800;
      letter-spacing:.06em;
      color:#ffe4ca;
      margin-bottom:.4rem;
    }
    .peek-item h3{
      font-size:1rem;
      margin:0 .0rem .35rem;
      line-height:1.35;
    }
    .peek-item p{
      margin:0;
      color:var(--muted);
      font-size:.9rem;
      line-height:1.6;
    }
    .section{
      padding:4.2rem 0;
    }
    .section.tight{padding-top:2rem}
    .section-title{
      margin-bottom:1.5rem;
      display:flex;
      justify-content:space-between;
      gap:1rem;
      align-items:end;
      flex-wrap:wrap;
    }
    .section-title h2{
      margin:0;
      font-size:clamp(1.5rem, 2.4vw, 2.3rem);
      line-height:1.15;
      font-weight:900;
      letter-spacing:-.02em;
    }
    .section-title p{
      margin:0;
      color:var(--muted);
      max-width:58ch;
    }
    .panel{
      background:linear-gradient(180deg, rgba(27,21,31,.96), rgba(18,14,22,.96));
      border:1px solid rgba(255,255,255,.08);
      border-radius:calc(var(--radius) + 2px);
      box-shadow:var(--shadow);
    }
    .panel .panel-inner{padding:1.1rem}
    .showcase-list{
      display:grid;
      gap:1rem;
    }
    .showcase-card{
      display:grid;
      grid-template-columns:74px 1fr auto;
      gap:1rem;
      align-items:center;
      padding:1rem 1.05rem;
      border-radius:16px;
      background:
        linear-gradient(90deg, rgba(255,54,93,.08), transparent 16%),
        rgba(255,255,255,.03);
      border:1px solid rgba(255,255,255,.08);
      transition:.22s ease;
      min-height:96px;
    }
    .showcase-card:hover{
      transform:translateY(-2px);
      border-color:rgba(255,54,93,.35);
      box-shadow:0 14px 28px rgba(0,0,0,.26);
    }
    .showcase-index{
      width:58px;
      height:58px;
      display:grid;
      place-items:center;
      border-radius:14px;
      background:linear-gradient(135deg, #ff365d, #ff8a9b);
      color:#fff;
      font-weight:900;
      font-size:1.3rem;
      box-shadow:var(--shadow-hard);
    }
    .showcase-content h3{
      margin:0 0 .4rem;
      font-size:1.06rem;
      line-height:1.35;
      font-weight:900;
    }
    .showcase-content p{
      margin:0;
      color:var(--muted);
      font-size:.94rem;
      line-height:1.65;
    }
    .meta-tags{
      display:flex;
      flex-wrap:wrap;
      gap:.45rem;
      margin-top:.6rem;
    }
    .meta-tag{
      font-size:.76rem;
      padding:.3rem .52rem;
      border-radius:999px;
      border:1px solid rgba(255,255,255,.1);
      background:rgba(255,255,255,.05);
      color:#ddd5db;
      white-space:nowrap;
    }
    .showcase-side{
      display:flex;
      flex-direction:column;
      gap:.45rem;
      align-items:flex-end;
      justify-content:center;
      min-width:120px;
    }
    .time-label{
      color:#ffd8e0;
      font-weight:800;
      font-size:.9rem;
    }
    .status-bar{
      width:110px;
      height:6px;
      border-radius:999px;
      background:#3a3138;
      overflow:hidden;
    }
    .status-bar > span{
      display:block;
      height:100%;
      border-radius:inherit;
      background:linear-gradient(90deg, #ff365d, #ffb84d);
    }
    .status-copy{
      color:var(--muted);
      font-size:.82rem;
    }
    .latest-grid{
      display:grid;
      grid-template-columns:1.2fr .8fr;
      gap:1rem;
      align-items:stretch;
    }
    .update-board{
      padding:1rem;
    }
    .update-row{
      display:grid;
      grid-template-columns:110px 1fr 90px;
      gap:1rem;
      padding:.9rem 0;
      border-bottom:1px solid rgba(255,255,255,.08);
      align-items:center;
    }
    .update-row:last-child{border-bottom:none}
    .update-key{
      color:#ffd0d9;
      font-weight:800;
      font-variant-numeric:tabular-nums;
    }
    .update-title{
      font-weight:800;
      margin-bottom:.15rem;
    }
    .update-desc{
      color:var(--muted);
      font-size:.92rem;
    }
    .update-state{
      justify-self:end;
      padding:.35rem .6rem;
      border-radius:999px;
      background:rgba(67,214,200,.12);
      color:#a8fff4;
      border:1px solid rgba(67,214,200,.3);
      font-size:.8rem;
      font-weight:800;
      white-space:nowrap;
    }
    .trend-box{
      padding:1rem;
      height:100%;
    }
    .trend-list{
      display:grid;
      gap:.75rem;
    }
    .trend-item{
      padding:.85rem .88rem;
      background:rgba(255,255,255,.04);
      border:1px solid rgba(255,255,255,.08);
      border-radius:14px;
    }
    .trend-item strong{
      display:block;
      margin-bottom:.3rem;
      font-size:1rem;
    }
    .trend-item span{
      color:var(--muted);
      font-size:.9rem;
    }
    .remind-wrap{
      padding:1rem;
      background:
        linear-gradient(135deg, rgba(255,54,93,.15), rgba(255,54,93,.03)),
        linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.03));
    }
    .remind-grid{
      display:grid;
      grid-template-columns:1.2fr .8fr;
      gap:1rem;
      align-items:center;
    }
    .remind-title{
      margin:0 0 .55rem;
      font-size:1.35rem;
      line-height:1.2;
      font-weight:900;
    }
    .remind-text{color:var(--muted);margin:0 0 1rem;max-width:62ch}
    .form-control,
    .form-select{
      background:#0f0d12;
      color:var(--text);
      border:1px solid #4a3945;
      border-radius:12px;
      padding:.85rem 1rem;
      min-height:50px;
      box-shadow:none !important;
    }
    .form-control::placeholder{color:#8e8089}
    .form-control:focus,
    .form-select:focus{
      background:#120f15;
      color:#fff;
      border-color:#ff365d;
      box-shadow:0 0 0 .25rem rgba(255,54,93,.16) !important;
    }
    .form-label{font-weight:700;color:#f0e8ea;margin-bottom:.45rem}
    .form-hint{
      color:#b9acb4;
      font-size:.9rem;
      margin-top:.55rem;
    }
    .signal-box{
      padding:1rem;
      border-radius:18px;
      background:
        linear-gradient(135deg, rgba(255,184,77,.17), rgba(255,184,77,.05)),
        rgba(255,255,255,.04);
      border:1px solid rgba(255,184,77,.25);
    }
    .signal-box h3{
      margin:0 0 .5rem;
      font-size:1.06rem;
      font-weight:900;
    }
    .signal-box ul{
      margin:0;
      padding-left:1.05rem;
      color:var(--muted);
    }
    .signal-box li{margin-bottom:.45rem}
    .matrix-wrap{
      padding:1rem;
    }
    .matrix-grid{
      display:grid;
      grid-template-columns:repeat(4,minmax(0,1fr));
      gap:1rem;
    }
    .matrix-card{
      position:relative;
      padding:1rem;
      min-height:188px;
      border-radius:16px;
      border:1px solid rgba(255,255,255,.08);
      background:
        linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02)),
        rgba(255,255,255,.03);
      transition:.22s ease;
      overflow:hidden;
    }
    .matrix-card:hover{
      transform:translateY(-3px);
      border-color:rgba(255,54,93,.42);
      box-shadow:0 16px 28px rgba(0,0,0,.28);
    }
    .matrix-card::after{
      content:"";
      position:absolute;
      inset:auto -12% -30% auto;
      width:140px;
      height:140px;
      border-radius:50%;
      background:radial-gradient(circle, rgba(255,54,93,.2), transparent 68%);
      pointer-events:none;
    }
    .matrix-top{
      display:flex;
      justify-content:space-between;
      gap:.75rem;
      align-items:flex-start;
      margin-bottom:.8rem;
    }
    .matrix-num{
      display:inline-grid;
      place-items:center;
      width:36px;
      height:36px;
      border-radius:10px;
      background:#fff;
      color:#111;
      font-weight:900;
      box-shadow:var(--shadow-hard);
    }
    .matrix-state{
      font-size:.76rem;
      font-weight:800;
      color:#ffe2e8;
      padding:.34rem .5rem;
      border-radius:999px;
      background:rgba(255,54,93,.14);
      border:1px solid rgba(255,54,93,.28);
    }
    .matrix-card h3{
      font-size:1.05rem;
      font-weight:900;
      line-height:1.35;
      margin:0 0 .45rem;
    }
    .matrix-card p{
      color:var(--muted);
      font-size:.92rem;
      margin:0 0 .8rem;
      line-height:1.65;
    }
    .matrix-card .btn-link-like{
      display:inline-flex;
      align-items:center;
      gap:.35rem;
      font-weight:800;
      color:#fff;
      padding:0;
      background:none;
      border:none;
      text-decoration:none;
    }
    .matrix-card .btn-link-like::after{
      content:"→";
      transition:.22s ease;
    }
    .matrix-card:hover .btn-link-like::after{transform:translateX(3px)}
    .topic-wall{
      display:grid;
      grid-template-columns:1.1fr .9fr;
      gap:1rem;
      align-items:stretch;
    }
    .topic-cloud{
      padding:1rem;
    }
    .cloud-tags{
      display:flex;
      flex-wrap:wrap;
      gap:.7rem;
    }
    .cloud-tags .tag{
      padding:.58rem .82rem;
      border-radius:999px;
      background:rgba(255,255,255,.05);
      border:1px solid rgba(255,255,255,.08);
      color:#eee7eb;
      font-weight:700;
      font-size:.92rem;
    }
    .featured-entry{
      padding:1rem;
      background:
        linear-gradient(135deg, rgba(67,214,200,.11), rgba(255,255,255,.03)),
        rgba(255,255,255,.03);
    }
    .feature-card{
      height:100%;
      padding:1rem;
      border-radius:18px;
      border:1px solid rgba(67,214,200,.22);
      background:
        radial-gradient(circle at 25% 20%, rgba(67,214,200,.14), transparent 24%),
        linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.03));
    }
    .feature-card h3{
      margin:0 0 .6rem;
      font-size:1.3rem;
      font-weight:900;
    }
    .feature-card p{
      color:var(--muted);
      margin:0 0 1rem;
    }
    .feature-meta{
      display:flex;
      flex-wrap:wrap;
      gap:.5rem;
      margin-bottom:1rem;
    }
    .feature-meta .meta-tag{
      background:rgba(67,214,200,.09);
      border-color:rgba(67,214,200,.2);
      color:#cff9f4;
    }
    .accordion.faq-accordion .accordion-item{
      background:transparent;
      border:1px solid rgba(255,255,255,.08);
      border-radius:16px;
      overflow:hidden;
      margin-bottom:.8rem;
    }
    .accordion.faq-accordion .accordion-button{
      background:rgba(255,255,255,.04);
      color:var(--text);
      font-weight:800;
      box-shadow:none;
      padding:1rem 1.1rem;
    }
    .accordion.faq-accordion .accordion-button:not(.collapsed){
      color:#fff;
      background:rgba(255,54,93,.12);
      box-shadow:none;
    }
    .accordion.faq-accordion .accordion-button:focus{
      border-color:#ff365d;
      box-shadow:0 0 0 .2rem rgba(255,54,93,.15);
    }
    .accordion.faq-accordion .accordion-body{
      color:var(--muted);
      background:rgba(17,13,20,.86);
      padding:1rem 1.1rem 1.1rem;
    }
    .cta-band{
      padding:1rem;
      background:
        linear-gradient(135deg, rgba(255,54,93,.2), rgba(255,184,77,.12)),
        linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02));
      border:1px solid rgba(255,255,255,.08);
      border-radius:18px;
      box-shadow:var(--shadow);
    }
    .cta-band-inner{
      display:flex;
      justify-content:space-between;
      gap:1rem;
      align-items:center;
      flex-wrap:wrap;
    }
    .cta-band h2{
      margin:0 0 .3rem;
      font-size:1.5rem;
      font-weight:900;
    }
    .cta-band p{margin:0;color:#f1dfe4;max-width:60ch}
    .footer{
      margin-top:2rem;
      background:linear-gradient(180deg, #0b0910, #07060a);
      border-top:1px solid rgba(255,255,255,.08);
      padding:2rem 0 1.4rem;
      color:#d5c9cf;
    }
    .footer-top{
      display:grid;
      grid-template-columns:1.1fr .9fr;
      gap:1rem;
      align-items:flex-start;
      margin-bottom:1.4rem;
    }
    .footer-brand{
      display:flex;
      flex-direction:column;
      gap:.8rem;
    }
    .footer-brand p{
      margin:0;
      max-width:58ch;
      color:var(--muted);
    }
    .footer-links{
      display:grid;
      grid-template-columns:repeat(2,minmax(0,1fr));
      gap:.5rem 1rem;
    }
    .footer-links a{
      color:#f1e9ec;
      padding:.35rem 0;
      font-weight:700;
    }
    .footer-links a:hover{color:#fff;text-decoration:underline}
    .footer-note{
      padding-top:1rem;
      border-top:1px solid rgba(255,255,255,.08);
      display:flex;
      justify-content:space-between;
      gap:1rem;
      flex-wrap:wrap;
      color:#a89ba3;
      font-size:.92rem;
    }
    .adult-badge{
      display:inline-flex;
      align-items:center;
      gap:.4rem;
      padding:.38rem .65rem;
      border-radius:999px;
      background:rgba(255,184,77,.14);
      color:#ffdca0;
      border:1px solid rgba(255,184,77,.25);
      font-weight:800;
      font-size:.82rem;
    }
    .mini-divider{
      height:1px;
      background:linear-gradient(90deg, transparent, rgba(255,255,255,.12), transparent);
      margin:1.2rem 0;
    }
    .btn-focus:focus,
    .btn:focus{
      box-shadow:0 0 0 .22rem rgba(255,54,93,.18) !important;
    }
    .age-gate{
      position:fixed;
      inset:0;
      background:rgba(6,5,8,.8);
      backdrop-filter:blur(12px);
      display:none;
      align-items:center;
      justify-content:center;
      z-index:2000;
      padding:1rem;
    }
    .age-gate.show{display:flex}
    .age-card{
      width:min(560px, 100%);
      background:
        linear-gradient(180deg, rgba(24,18,28,.98), rgba(11,9,14,.98));
      border:1px solid rgba(255,255,255,.1);
      border-radius:22px;
      box-shadow:0 28px 60px rgba(0,0,0,.6);
      padding:1.25rem;
    }
    .age-card h2{
      margin:0 0 .6rem;
      font-size:1.55rem;
      font-weight:900;
    }
    .age-card p{color:var(--muted);margin:0 0 1rem}
    .age-actions{display:flex;gap:.75rem;flex-wrap:wrap}
    @media (max-width: 1199.98px){
      .hero-grid,
      .latest-grid,
      .remind-grid,
      .topic-wall,
      .footer-top{grid-template-columns:1fr}
      .matrix-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
      .peek-strip{grid-template-columns:1fr}
      .hero-title{max-width:none}
    }
    @media (max-width: 767.98px){
      .hero-inner{padding:1rem}
      .hero-cover-inner{min-height:280px}
      .countdown-wrap{gap:.45rem}
      .count-box{padding:.65rem .35rem}
      .count-label{font-size:.72rem}
      .cover-bottom{grid-template-columns:1fr}
      .cover-side{align-items:flex-start}
      .showcase-card{grid-template-columns:1fr;gap:.8rem}
      .showcase-side{align-items:flex-start}
      .update-row{grid-template-columns:1fr;gap:.35rem}
      .update-state{justify-self:flex-start}
      .matrix-grid{grid-template-columns:1fr}
      .section{padding:3.2rem 0}
      .nav-cta{width:100%;justify-content:center;margin-top:.5rem}
      .navbar-collapse{
        margin-top:.7rem;
        padding:1rem;
        background:rgba(7,6,10,.28);
        border:1px solid rgba(255,255,255,.08);
        border-radius:16px;
      }
      .navbar-nav{padding-bottom:.3rem}
    }

/* roulang page: category1 */
:root{
      --bg:#0c0c0f;
      --bg-soft:#131318;
      --panel:#17171d;
      --panel-2:#1e1e26;
      --panel-3:#23232c;
      --line:rgba(255,255,255,.09);
      --line-strong:rgba(255,255,255,.16);
      --text:#f3efe8;
      --muted:#b0a8a0;
      --soft:#8f8880;
      --accent:#e64646;
      --accent-2:#ff6a7a;
      --accent-3:#f5bf3c;
      --accent-4:#46d6d0;
      --shadow:0 18px 40px rgba(0,0,0,.35);
      --shadow-hard:0 10px 0 rgba(0,0,0,.28);
      --radius:8px;
      --radius-sm:6px;
      --section-gap:28px;
      --max:1280px;
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{
      margin:0;
      background:
        linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,0)),
        repeating-linear-gradient(90deg, rgba(255,255,255,.015) 0 1px, transparent 1px 120px),
        repeating-linear-gradient(180deg, rgba(255,255,255,.012) 0 1px, transparent 1px 120px),
        var(--bg);
      color:var(--text);
      font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", "Noto Sans CJK SC", "Segoe UI", sans-serif;
      line-height:1.7;
      letter-spacing:0;
      text-rendering:optimizeLegibility;
      -webkit-font-smoothing:antialiased;
    }
    a{color:inherit;text-decoration:none}
    img{max-width:100%;display:block}
    button,input,select,textarea{font:inherit}
    .container-xxl{max-width:var(--max)}
    .site-header{
      position:sticky;
      top:0;
      z-index:1030;
      background:linear-gradient(180deg, rgba(12,12,15,.98), rgba(12,12,15,.92));
      border-bottom:1px solid var(--line);
      box-shadow:0 1px 0 rgba(255,255,255,.03);
      backdrop-filter:none;
    }
    .site-header .navbar{
      padding:.9rem 0;
    }
    .brand-mark{
      display:inline-flex;
      align-items:center;
      gap:.7rem;
      font-weight:800;
      letter-spacing:0;
      color:var(--text);
      text-decoration:none;
    }
    .brand-badge{
      width:2rem;height:2rem;
      display:inline-flex;
      align-items:center;
      justify-content:center;
      border-radius:6px;
      background:linear-gradient(135deg, var(--accent), #8d1515);
      color:#fff;
      box-shadow:var(--shadow-hard);
      border:1px solid rgba(255,255,255,.1);
      flex:0 0 auto;
    }
    .brand-text{
      font-size:1.05rem;
      line-height:1;
      white-space:nowrap;
    }
    .navbar-toggler{
      border:1px solid var(--line-strong);
      border-radius:6px;
      padding:.55rem .7rem;
      box-shadow:none !important;
    }
    .navbar-toggler:focus{box-shadow:0 0 0 .2rem rgba(230,70,70,.2) !important}
    .navbar-toggler-icon{
      background-image:none !important;
      width:1.25rem;
      height:1.05rem;
      position:relative;
      display:inline-block;
    }
    .navbar-toggler-icon::before,
    .navbar-toggler-icon::after,
    .navbar-toggler-icon span{
      content:"";
      position:absolute;
      left:0;
      right:0;
      height:2px;
      background:var(--text);
      border-radius:2px;
    }
    .navbar-toggler-icon::before{top:0}
    .navbar-toggler-icon::after{bottom:0}
    .navbar-toggler-icon span{top:50%;transform:translateY(-50%)}
    .navbar-collapse{
      align-items:center;
    }
    .navbar-nav{
      gap:.45rem;
    }
    .nav-link{
      color:var(--muted);
      border:1px solid transparent;
      border-radius:6px;
      padding:.55rem .85rem !important;
      font-weight:700;
      font-size:.96rem;
      transition:.18s ease;
    }
    .nav-link:hover,
    .nav-link:focus{
      color:var(--text);
      background:rgba(255,255,255,.04);
      border-color:var(--line);
    }
    .nav-link.active{
      color:#fff;
      background:linear-gradient(135deg, rgba(230,70,70,.98), rgba(141,21,21,.92));
      border-color:rgba(255,255,255,.08);
      box-shadow:var(--shadow-hard);
    }
    .nav-cta{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      gap:.45rem;
      background:var(--accent);
      color:#fff;
      border:1px solid rgba(255,255,255,.08);
      padding:.7rem 1rem;
      border-radius:6px;
      font-weight:800;
      box-shadow:var(--shadow-hard);
      transition:.18s ease;
      white-space:nowrap;
    }
    .nav-cta:hover,.nav-cta:focus{
      color:#fff;
      transform:translateY(-1px);
      filter:saturate(1.08);
    }
    .page-badge-row{
      display:flex;
      flex-wrap:wrap;
      gap:.55rem;
      align-items:center;
      margin-bottom:.9rem;
    }
    .stamp{
      display:inline-flex;
      align-items:center;
      gap:.35rem;
      border:1px solid var(--line-strong);
      background:rgba(255,255,255,.03);
      color:var(--text);
      border-radius:999px;
      padding:.35rem .7rem;
      font-size:.84rem;
      font-weight:700;
      letter-spacing:0;
    }
    .stamp.warn{
      background:rgba(245,191,60,.12);
      border-color:rgba(245,191,60,.35);
      color:#ffe7ad;
    }
    .stamp.hot{
      background:rgba(230,70,70,.16);
      border-color:rgba(230,70,70,.32);
      color:#ffd0d0;
    }
    .adult-strip{
      background:linear-gradient(135deg, rgba(245,191,60,.16), rgba(230,70,70,.18));
      border:1px solid rgba(245,191,60,.25);
      border-radius:6px;
      padding:.8rem 1rem;
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:1rem;
      box-shadow:var(--shadow-hard);
    }
    .adult-strip p{
      margin:0;
      color:#f7e7c3;
      font-size:.95rem;
    }
    .adult-strip .btn{
      white-space:nowrap;
    }
    .site-main{
      padding:22px 0 48px;
    }
    .hero-stage{
      position:relative;
      overflow:hidden;
      background:
        linear-gradient(115deg, rgba(255,255,255,.02), rgba(255,255,255,0)),
        linear-gradient(180deg, #16161b 0%, #101014 100%);
      border-top:1px solid rgba(255,255,255,.05);
      border-bottom:1px solid var(--line);
      box-shadow:inset 0 1px 0 rgba(255,255,255,.03);
    }
    .hero-stage::before{
      content:"";
      position:absolute;
      inset:0;
      background:
        radial-gradient(circle at 18% 18%, rgba(230,70,70,.12), transparent 22%),
        radial-gradient(circle at 85% 20%, rgba(70,214,208,.08), transparent 18%),
        radial-gradient(circle at 78% 72%, rgba(245,191,60,.08), transparent 18%);
      pointer-events:none;
    }
    .hero-grid{
      position:relative;
      display:grid;
      grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr);
      gap:1.2rem;
      align-items:stretch;
      padding:1.4rem 0 1.1rem;
    }
    .hero-panel{
      background:linear-gradient(180deg, rgba(23,23,29,.96), rgba(17,17,21,.98));
      border:1px solid var(--line-strong);
      border-radius:var(--radius);
      box-shadow:var(--shadow);
      position:relative;
      overflow:hidden;
    }
    .hero-panel::after{
      content:"";
      position:absolute;
      inset:auto 0 0 0;
      height:5px;
      background:linear-gradient(90deg, var(--accent), var(--accent-3), var(--accent-4));
      opacity:.95;
    }
    .hero-copy{
      padding:1.45rem 1.45rem 1.3rem;
      min-height:100%;
    }
    .hero-kicker{
      color:#ffc8c8;
      font-weight:800;
      letter-spacing:0;
      text-transform:none;
      font-size:.92rem;
      margin-bottom:.55rem;
    }
    .hero-title{
      font-size:clamp(2rem, 4vw, 3.4rem);
      line-height:1.08;
      margin:0 0 .95rem;
      letter-spacing:0;
      font-weight:900;
    }
    .hero-title span{
      color:#fff;
      text-shadow:0 1px 0 rgba(0,0,0,.35);
    }
    .hero-text{
      color:var(--muted);
      font-size:1rem;
      margin:0 0 1.1rem;
      max-width:56rem;
    }
    .hero-meta{
      display:flex;
      flex-wrap:wrap;
      gap:.55rem;
      margin-bottom:1rem;
    }
    .hero-actions{
      display:flex;
      flex-wrap:wrap;
      gap:.75rem;
      margin-top:1rem;
    }
    .btn-strong,
    .btn-ghost{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      gap:.45rem;
      border-radius:6px;
      padding:.8rem 1rem;
      font-weight:800;
      border:1px solid transparent;
      transition:.18s ease;
      letter-spacing:0;
      box-shadow:var(--shadow-hard);
    }
    .btn-strong{
      background:var(--accent);
      color:#fff;
      border-color:rgba(255,255,255,.08);
    }
    .btn-strong:hover,.btn-strong:focus{
      color:#fff;
      transform:translateY(-1px);
      filter:saturate(1.06);
    }
    .btn-ghost{
      background:transparent;
      color:var(--text);
      border-color:var(--line-strong);
      box-shadow:none;
    }
    .btn-ghost:hover,.btn-ghost:focus{
      color:var(--text);
      background:rgba(255,255,255,.04);
      border-color:rgba(255,255,255,.22);
      transform:translateY(-1px);
    }
    .count-wrap{
      margin-top:1rem;
      display:grid;
      grid-template-columns:repeat(4, minmax(0, 1fr));
      gap:.75rem;
    }
    .count-box{
      background:linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.02));
      border:1px solid var(--line);
      border-radius:6px;
      padding:.85rem .6rem .7rem;
      text-align:center;
      min-height:4.8rem;
    }
    .count-num{
      display:block;
      font-size:1.55rem;
      line-height:1;
      font-weight:900;
      letter-spacing:0;
      min-height:1.6rem;
      color:#fff;
      font-variant-numeric:tabular-nums;
    }
    .count-label{
      display:block;
      margin-top:.35rem;
      color:var(--muted);
      font-size:.83rem;
    }
    .hero-side{
      padding:1.1rem;
      display:flex;
      flex-direction:column;
      gap:.9rem;
      min-height:100%;
    }
    .cover-board{
      position:relative;
      aspect-ratio: 16 / 10;
      border-radius:var(--radius);
      overflow:hidden;
      border:1px solid var(--line-strong);
      background:
        linear-gradient(150deg, rgba(230,70,70,.95), rgba(17,17,21,.92) 45%, rgba(70,214,208,.18)),
        linear-gradient(180deg, #1c1c23, #101013);
      box-shadow:var(--shadow-hard);
    }
    .cover-board::before{
      content:"";
      position:absolute;
      inset:0;
      background:
        repeating-linear-gradient(90deg, rgba(255,255,255,.04) 0 1px, transparent 1px 16px),
        repeating-linear-gradient(180deg, rgba(255,255,255,.04) 0 1px, transparent 1px 16px);
      opacity:.28;
    }
    .cover-board::after{
      content:"";
      position:absolute;
      inset:0;
      background:linear-gradient(180deg, transparent 0%, rgba(0,0,0,.18) 100%);
    }
    .cover-badge{
      position:absolute;
      left:1rem;
      top:1rem;
      z-index:1;
      display:inline-flex;
      align-items:center;
      gap:.35rem;
      padding:.34rem .62rem;
      border-radius:999px;
      background:rgba(12,12,15,.82);
      border:1px solid rgba(255,255,255,.14);
      font-weight:800;
      color:#fff;
      font-size:.82rem;
    }
    .cover-copy{
      position:absolute;
      left:1rem;
      right:1rem;
      bottom:1rem;
      z-index:1;
    }
    .cover-copy h2{
      font-size:1.3rem;
      line-height:1.1;
      margin:0 0 .4rem;
      font-weight:900;
    }
    .cover-copy p{
      margin:0;
      color:#efe8dd;
      font-size:.92rem;
      max-width:26rem;
    }
    .side-stats{
      display:grid;
      grid-template-columns:repeat(3, minmax(0,1fr));
      gap:.6rem;
    }
    .stat-tile{
      background:var(--panel-2);
      border:1px solid var(--line);
      border-radius:6px;
      padding:.7rem .7rem .75rem;
      min-height:5rem;
    }
    .stat-tile .num{
      display:block;
      font-size:1.22rem;
      font-weight:900;
      line-height:1.1;
      font-variant-numeric:tabular-nums;
      color:#fff;
    }
    .stat-tile .txt{
      display:block;
      margin-top:.32rem;
      font-size:.82rem;
      color:var(--muted);
    }
    .section-band{
      padding:var(--section-gap) 0 0;
    }
    .section-head{
      display:flex;
      align-items:flex-end;
      justify-content:space-between;
      gap:1rem;
      margin-bottom:1rem;
    }
    .section-head h2{
      margin:0;
      font-size:1.55rem;
      font-weight:900;
      line-height:1.15;
    }
    .section-head p{
      margin:0;
      color:var(--muted);
      max-width:54rem;
      font-size:.96rem;
    }
    .filter-strip{
      background:linear-gradient(180deg, rgba(24,24,30,.96), rgba(19,19,24,.98));
      border:1px solid var(--line);
      border-radius:var(--radius);
      padding:1rem;
      box-shadow:var(--shadow-hard);
    }
    .filter-row{
      display:flex;
      flex-wrap:wrap;
      gap:.65rem;
      margin-bottom:.85rem;
    }
    .filter-chip{
      display:inline-flex;
      align-items:center;
      gap:.4rem;
      padding:.54rem .8rem;
      border-radius:999px;
      border:1px solid var(--line-strong);
      background:rgba(255,255,255,.03);
      color:var(--text);
      font-size:.88rem;
      font-weight:700;
      transition:.18s ease;
    }
    .filter-chip:hover{
      border-color:rgba(255,255,255,.28);
      background:rgba(255,255,255,.06);
      transform:translateY(-1px);
    }
    .filter-chip.active{
      color:#fff;
      border-color:rgba(230,70,70,.58);
      background:rgba(230,70,70,.18);
      box-shadow:0 0 0 1px rgba(230,70,70,.15) inset;
    }
    .filter-note{
      display:flex;
      flex-wrap:wrap;
      justify-content:space-between;
      gap:.8rem;
      padding-top:.85rem;
      border-top:1px solid var(--line);
      color:var(--muted);
      font-size:.92rem;
    }
    .preview-list{
      margin-top:1rem;
      display:grid;
      gap:.9rem;
    }
    .preview-item{
      display:grid;
      grid-template-columns:120px minmax(0,1fr) auto;
      gap:.9rem;
      align-items:stretch;
      background:linear-gradient(180deg, rgba(24,24,30,.95), rgba(18,18,22,.98));
      border:1px solid var(--line);
      border-radius:var(--radius);
      overflow:hidden;
      box-shadow:var(--shadow-hard);
      transition:.18s ease;
    }
    .preview-item:hover{
      border-color:rgba(255,255,255,.2);
      transform:translateY(-1px);
    }
    .preview-thumb{
      position:relative;
      min-height:120px;
      background:
        linear-gradient(135deg, rgba(230,70,70,.78), rgba(245,191,60,.22) 45%, rgba(70,214,208,.18)),
        linear-gradient(180deg, #1f1f27, #101013);
      border-right:1px solid var(--line);
    }
    .preview-thumb::before{
      content:"";
      position:absolute;
      inset:0;
      background:
        linear-gradient(90deg, rgba(255,255,255,.08), transparent 28%, transparent 72%, rgba(255,255,255,.08)),
        repeating-linear-gradient(180deg, rgba(255,255,255,.05) 0 1px, transparent 1px 12px);
      opacity:.35;
    }
    .preview-thumb span{
      position:absolute;
      left:.7rem;
      bottom:.7rem;
      z-index:1;
      display:inline-flex;
      align-items:center;
      padding:.26rem .46rem;
      border-radius:4px;
      background:rgba(12,12,15,.82);
      color:#fff;
      font-size:.76rem;
      font-weight:800;
      border:1px solid rgba(255,255,255,.12);
    }
    .preview-body{
      padding:1rem 0;
      min-width:0;
    }
    .preview-kicker{
      display:flex;
      flex-wrap:wrap;
      gap:.4rem;
      align-items:center;
      margin-bottom:.45rem;
      color:var(--soft);
      font-size:.82rem;
      font-weight:700;
    }
    .preview-title{
      margin:0 0 .45rem;
      font-size:1.08rem;
      line-height:1.35;
      font-weight:900;
      color:#fff;
    }
    .preview-desc{
      margin:0;
      color:var(--muted);
      font-size:.93rem;
      max-width:52rem;
    }
    .preview-tags{
      display:flex;
      flex-wrap:wrap;
      gap:.4rem;
      margin-top:.7rem;
    }
    .tag{
      display:inline-flex;
      align-items:center;
      padding:.24rem .46rem;
      border-radius:4px;
      border:1px solid var(--line);
      color:#d8d0c8;
      background:rgba(255,255,255,.03);
      font-size:.78rem;
      font-weight:700;
    }
    .preview-actions{
      padding:1rem 1rem 1rem 0;
      display:flex;
      align-items:center;
    }
    .preview-actions .btn{
      min-width:7.8rem;
    }
    .preview-item.featured{
      border-color:rgba(230,70,70,.34);
    }
    .preview-item.featured .preview-thumb{
      background:
        linear-gradient(140deg, rgba(230,70,70,.96), rgba(141,21,21,.75) 56%, rgba(245,191,60,.18)),
        linear-gradient(180deg, #1f1f27, #101013);
    }
    .subscription-band{
      margin-top:1rem;
      background:
        linear-gradient(135deg, rgba(230,70,70,.18), rgba(245,191,60,.1)),
        linear-gradient(180deg, rgba(24,24,30,.98), rgba(18,18,22,.98));
      border:1px solid rgba(230,70,70,.22);
      border-radius:var(--radius);
      box-shadow:var(--shadow-hard);
      padding:1.15rem;
    }
    .subscription-head{
      display:flex;
      flex-wrap:wrap;
      align-items:flex-end;
      justify-content:space-between;
      gap:1rem;
      margin-bottom:1rem;
    }
    .subscription-head h2{
      margin:0;
      font-size:1.4rem;
      font-weight:900;
    }
    .subscription-head p{
      margin:0;
      color:var(--muted);
      font-size:.95rem;
      max-width:48rem;
    }
    .form-control,
    .form-select{
      background:var(--bg-soft);
      color:var(--text);
      border:1px solid var(--line-strong);
      border-radius:6px;
      min-height:48px;
      box-shadow:none;
    }
    .form-control::placeholder{color:#807970}
    .form-control:focus,
    .form-select:focus{
      background:var(--bg-soft);
      color:var(--text);
      border-color:rgba(230,70,70,.55);
      box-shadow:0 0 0 .2rem rgba(230,70,70,.16);
    }
    .form-label{
      color:#ece6dd;
      font-weight:700;
      margin-bottom:.45rem;
    }
    .helper-note{
      color:var(--muted);
      font-size:.86rem;
      margin-top:.7rem;
    }
    .entry-section{
      margin-top:1rem;
    }
    .entry-grid{
      display:grid;
      grid-template-columns:repeat(4, minmax(0,1fr));
      gap:.9rem;
    }
    .entry-card{
      background:linear-gradient(180deg, rgba(24,24,30,.95), rgba(18,18,22,.98));
      border:1px solid var(--line);
      border-radius:var(--radius);
      padding:1rem;
      box-shadow:var(--shadow-hard);
      display:flex;
      flex-direction:column;
      gap:.7rem;
      min-height:100%;
      transition:.18s ease;
    }
    .entry-card:hover{
      border-color:rgba(255,255,255,.2);
      transform:translateY(-1px);
    }
    .entry-head{
      display:flex;
      align-items:flex-start;
      justify-content:space-between;
      gap:.7rem;
    }
    .entry-num{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      width:2rem;height:2rem;
      border-radius:6px;
      background:rgba(255,255,255,.06);
      border:1px solid var(--line);
      color:#fff;
      font-size:.86rem;
      font-weight:900;
      flex:0 0 auto;
    }
    .entry-status{
      display:inline-flex;
      align-items:center;
      gap:.3rem;
      padding:.28rem .48rem;
      border-radius:999px;
      font-size:.76rem;
      font-weight:800;
      color:#ffdede;
      background:rgba(230,70,70,.14);
      border:1px solid rgba(230,70,70,.22);
      white-space:nowrap;
    }
    .entry-card h3{
      margin:0;
      font-size:1.03rem;
      line-height:1.35;
      font-weight:900;
    }
    .entry-card p{
      margin:0;
      color:var(--muted);
      font-size:.92rem;
    }
    .entry-meta{
      display:flex;
      flex-wrap:wrap;
      gap:.4rem;
      color:var(--soft);
      font-size:.83rem;
      border-top:1px solid var(--line);
      padding-top:.75rem;
      margin-top:auto;
    }
    .entry-card .btn{
      align-self:flex-start;
      margin-top:.2rem;
    }
    .load-more-wrap{
      margin-top:1rem;
      display:flex;
      justify-content:center;
    }
    .accordion-wrap{
      margin-top:1rem;
      background:linear-gradient(180deg, rgba(24,24,30,.98), rgba(18,18,22,.98));
      border:1px solid var(--line);
      border-radius:var(--radius);
      padding:1rem;
      box-shadow:var(--shadow-hard);
    }
    .accordion{
      --bs-accordion-bg: transparent;
      --bs-accordion-color: var(--text);
      --bs-accordion-border-color: var(--line);
      --bs-accordion-btn-color: var(--text);
      --bs-accordion-btn-bg: transparent;
      --bs-accordion-active-bg: rgba(255,255,255,.03);
      --bs-accordion-active-color: #fff;
      --bs-accordion-btn-focus-box-shadow: 0 0 0 .2rem rgba(230,70,70,.16);
      --bs-accordion-btn-icon-width: 1rem;
    }
    .accordion-item{
      background:transparent;
      border-color:var(--line);
      border-radius:6px;
      overflow:hidden;
      margin-bottom:.75rem;
    }
    .accordion-button{
      font-weight:800;
      border-radius:0 !important;
      box-shadow:none !important;
      padding:1rem 1rem;
    }
    .accordion-button:not(.collapsed){
      background:rgba(255,255,255,.04);
      color:#fff;
    }
    .accordion-button::after{
      filter:brightness(1.2) contrast(1.1);
    }
    .accordion-body{
      color:var(--muted);
      padding:0 1rem 1rem;
    }
    .footer{
      margin-top:2rem;
      border-top:1px solid var(--line);
      background:linear-gradient(180deg, rgba(16,16,20,.96), rgba(12,12,15,.98));
      padding:1.4rem 0 1rem;
    }
    .footer-top{
      display:flex;
      justify-content:space-between;
      gap:1.2rem;
      align-items:flex-start;
      flex-wrap:wrap;
      padding-bottom:1rem;
      border-bottom:1px solid var(--line);
    }
    .footer-brand{
      max-width:38rem;
    }
    .footer-brand p{
      margin:.85rem 0 .7rem;
      color:var(--muted);
      font-size:.95rem;
    }
    .adult-badge{
      display:inline-flex;
      align-items:center;
      gap:.35rem;
      padding:.34rem .65rem;
      border-radius:999px;
      background:rgba(245,191,60,.12);
      border:1px solid rgba(245,191,60,.26);
      color:#f7e3b0;
      font-weight:800;
      font-size:.84rem;
    }
    .footer-links{
      display:flex;
      flex-wrap:wrap;
      gap:.5rem 1rem;
      align-items:center;
      max-width:24rem;
      justify-content:flex-end;
    }
    .footer-links a{
      color:var(--muted);
      font-weight:700;
      font-size:.92rem;
    }
    .footer-links a:hover{
      color:#fff;
    }
    .footer-note{
      display:flex;
      justify-content:space-between;
      gap:1rem;
      flex-wrap:wrap;
      padding-top:1rem;
      color:var(--soft);
      font-size:.85rem;
    }
    .section-shell{
      max-width:var(--max);
      margin:0 auto;
      padding-left:var(--bs-gutter-x,.75rem);
      padding-right:var(--bs-gutter-x,.75rem);
    }
    .live-divider{
      display:flex;
      gap:.5rem;
      flex-wrap:wrap;
      align-items:center;
      margin-top:.95rem;
      color:var(--muted);
      font-size:.87rem;
    }
    .live-pill{
      display:inline-flex;
      align-items:center;
      padding:.22rem .46rem;
      border-radius:4px;
      border:1px solid rgba(70,214,208,.2);
      background:rgba(70,214,208,.08);
      color:#bdf7f3;
      font-weight:800;
    }
    .subtle-rule{
      height:1px;
      background:var(--line);
      margin:1rem 0;
    }
    .fake-rank{
      display:grid;
      gap:.6rem;
    }
    .fake-row{
      display:grid;
      grid-template-columns:auto minmax(0,1fr) auto;
      gap:.6rem;
      align-items:center;
      background:var(--panel-2);
      border:1px solid var(--line);
      border-radius:6px;
      padding:.7rem .75rem;
    }
    .fake-row .rnum{
      width:2rem;height:2rem;
      border-radius:6px;
      display:inline-flex;
      align-items:center;
      justify-content:center;
      background:rgba(255,255,255,.05);
      color:#fff;
      font-weight:900;
    }
    .fake-row .rtxt{
      min-width:0;
    }
    .fake-row .rtxt strong{
      display:block;
      color:#fff;
      font-size:.95rem;
      line-height:1.3;
    }
    .fake-row .rtxt span{
      display:block;
      color:var(--muted);
      font-size:.82rem;
    }
    .fake-row .rbadge{
      padding:.25rem .48rem;
      border-radius:4px;
      background:rgba(230,70,70,.16);
      border:1px solid rgba(230,70,70,.2);
      color:#ffd6d6;
      font-size:.75rem;
      font-weight:800;
      white-space:nowrap;
    }
    .alert-line{
      padding:.7rem .9rem;
      border-radius:6px;
      border:1px solid rgba(230,70,70,.22);
      background:rgba(230,70,70,.1);
      color:#ffdede;
      font-size:.9rem;
      margin-top:.9rem;
    }
    .small-muted{
      color:var(--muted);
      font-size:.86rem;
    }
    .form-actions{
      display:flex;
      gap:.7rem;
      flex-wrap:wrap;
      align-items:center;
      margin-top:.75rem;
    }
    .form-feedback{
      min-height:1.3rem;
      margin-top:.5rem;
      color:#d8f1d0;
      font-size:.9rem;
      font-weight:700;
    }
    .btn i{font-size:1rem;line-height:1}
    @media (max-width: 1199.98px){
      .hero-grid{grid-template-columns:1fr}
      .entry-grid{grid-template-columns:repeat(2, minmax(0,1fr))}
    }
    @media (max-width: 991.98px){
      .navbar-collapse{
        margin-top:.9rem;
        padding:.8rem;
        border:1px solid var(--line);
        border-radius:var(--radius);
        background:rgba(18,18,22,.98);
      }
      .nav-cta{margin-top:.9rem}
      .hero-copy,.hero-side{padding:1.1rem}
      .preview-item{grid-template-columns:110px minmax(0,1fr)}
      .preview-actions{
        grid-column:1 / -1;
        padding:0 1rem 1rem 1rem;
      }
      .preview-body{padding-right:1rem}
      .side-stats{grid-template-columns:repeat(3, minmax(0,1fr))}
    }
    @media (max-width: 767.98px){
      .hero-title{font-size:1.95rem}
      .count-wrap{grid-template-columns:repeat(2, minmax(0,1fr))}
      .side-stats{grid-template-columns:repeat(2, minmax(0,1fr))}
      .section-head{flex-direction:column;align-items:flex-start}
      .entry-grid{grid-template-columns:1fr}
      .preview-item{
        grid-template-columns:1fr;
      }
      .preview-thumb{
        min-height:150px;
        border-right:none;
        border-bottom:1px solid var(--line);
      }
      .preview-body{padding:1rem 1rem 0}
      .preview-actions{padding:0 1rem 1rem}
      .adult-strip{
        flex-direction:column;
        align-items:flex-start;
      }
      .footer-top,.footer-note{
        flex-direction:column;
        align-items:flex-start;
      }
      .footer-links{justify-content:flex-start}
    }
    @media (max-width: 575.98px){
      .hero-copy,.hero-side,.subscription-band,.filter-strip,.accordion-wrap{
        padding:1rem;
      }
      .hero-title{font-size:1.7rem}
      .hero-text{font-size:.95rem}
      .count-box{min-height:4.5rem}
      .count-num{font-size:1.3rem}
      .hero-actions .btn,
      .nav-cta{
        width:100%;
      }
      .side-stats{grid-template-columns:1fr}
      .filter-chip{width:100%;justify-content:center}
    }