/* roulang page: index */
:root{
      --bg-0:#050816;
      --bg-1:#07111f;
      --bg-2:#0b1b33;
      --bg-3:#0f2a4a;
      --line:rgba(148, 163, 184, .16);
      --text:#e2e8f0;
      --muted:#94a3b8;
      --muted-2:#cbd5e1;
      --brand:#38bdf8;
      --brand-2:#2563eb;
      --violet:#8b5cf6;
      --cyan:#22d3ee;
      --radius-xl:1.5rem;
      --radius-2xl:1.25rem;
      --radius-3xl:1.75rem;
    }
    html{scroll-behavior:smooth}
    body{
      margin:0;
      color:var(--text);
      background:
        radial-gradient(circle at 15% 12%, rgba(56,189,248,.18), transparent 28%),
        radial-gradient(circle at 85% 15%, rgba(139,92,246,.18), transparent 30%),
        radial-gradient(circle at 50% 85%, rgba(34,211,238,.12), transparent 30%),
        linear-gradient(180deg, var(--bg-0) 0%, var(--bg-1) 42%, #04101c 100%);
      font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", "Noto Sans SC", sans-serif;
      overflow-x:hidden;
    }
    body::before{
      content:"";
      position:fixed;
      inset:0;
      pointer-events:none;
      background-image:
        linear-gradient(rgba(148,163,184,.05) 1px, transparent 1px),
        linear-gradient(90deg, rgba(148,163,184,.05) 1px, transparent 1px);
      background-size: 72px 72px;
      mask-image: linear-gradient(180deg, rgba(0,0,0,.45), rgba(0,0,0,.08));
      opacity:.42;
      z-index:0;
    }
    a, button, input, summary{transition: all .22s ease}
    a{color:inherit; text-decoration:none}
    img{max-width:100%; display:block}
    .glass-card{
      background: linear-gradient(180deg, rgba(15, 23, 42, .74), rgba(8, 15, 32, .58));
      border: 1px solid rgba(148, 163, 184, .16);
      backdrop-filter: blur(18px);
      -webkit-backdrop-filter: blur(18px);
      box-shadow: 0 16px 48px rgba(2, 8, 23, .38);
    }
    .glass-card:hover{
      border-color: rgba(56, 189, 248, .28);
      box-shadow: 0 18px 56px rgba(2, 8, 23, .44), 0 0 0 1px rgba(56, 189, 248, .08);
    }
    .card-hover{
      transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease, background .25s ease;
    }
    .card-hover:hover{
      transform: translateY(-3px);
    }
    .glow-button{
      background: linear-gradient(135deg, #38bdf8 0%, #2563eb 55%, #8b5cf6 100%);
      box-shadow: 0 12px 30px rgba(37, 99, 235, .34), 0 0 0 1px rgba(255,255,255,.08) inset;
    }
    .glow-button:hover{
      transform: translateY(-1px);
      box-shadow: 0 16px 38px rgba(37, 99, 235, .38), 0 0 28px rgba(56, 189, 248, .22);
    }
    .ghost-button{
      background: rgba(15, 23, 42, .42);
      border: 1px solid rgba(148, 163, 184, .22);
      backdrop-filter: blur(16px);
    }
    .ghost-button:hover{
      border-color: rgba(56, 189, 248, .34);
      background: rgba(8, 15, 32, .66);
    }
    .chip{
      display:inline-flex;
      align-items:center;
      gap:.45rem;
      border-radius:999px;
      padding:.46rem .82rem;
      font-size:.84rem;
      line-height:1;
      border:1px solid rgba(148, 163, 184, .18);
      background: rgba(15, 23, 42, .46);
      color:#dbeafe;
    }
    .chip strong{color:#fff}
    .chip.active{
      border-color: rgba(56, 189, 248, .42);
      background: linear-gradient(135deg, rgba(37, 99, 235, .24), rgba(56, 189, 248, .14));
      box-shadow: 0 0 0 1px rgba(56, 189, 248, .08) inset;
    }
    .section-kicker{
      color:#7dd3fc;
      letter-spacing:.18em;
      text-transform:uppercase;
      font-size:.78rem;
      font-weight:700;
    }
    .section-title{
      font-size: clamp(1.8rem, 4vw, 3rem);
      line-height:1.1;
      font-weight:800;
      letter-spacing:-.03em;
    }
    .section-desc{
      color:var(--muted-2);
      line-height:1.8;
      font-size: 1rem;
      max-width: 70ch;
    }
    .nav-link{
      position:relative;
      padding:.7rem .95rem;
      border-radius:999px;
      color:#dbeafe;
      font-weight:600;
      letter-spacing:.01em;
    }
    .nav-link:hover{
      background: rgba(148,163,184,.10);
      color:#fff;
    }
    .nav-link.active{
      background: linear-gradient(135deg, rgba(56,189,248,.18), rgba(37,99,235,.12));
      border:1px solid rgba(56,189,248,.24);
      box-shadow: 0 0 0 1px rgba(56,189,248,.06) inset;
    }
    .nav-pill{
      border:1px solid rgba(148,163,184,.15);
      background: rgba(7,17,31,.55);
      backdrop-filter: blur(18px);
      -webkit-backdrop-filter: blur(18px);
    }
    .bg-grid{
      background-image:
        linear-gradient(rgba(148,163,184,.07) 1px, transparent 1px),
        linear-gradient(90deg, rgba(148,163,184,.07) 1px, transparent 1px);
      background-size: 28px 28px;
    }
    .radial-glow{
      background: radial-gradient(circle at 30% 30%, rgba(56,189,248,.24), transparent 40%),
                  radial-gradient(circle at 70% 70%, rgba(139,92,246,.20), transparent 42%);
    }
    .glass-input{
      background: rgba(2, 6, 23, .36);
      border: 1px solid rgba(148, 163, 184, .18);
      color:#e2e8f0;
      outline:none;
    }
    .glass-input::placeholder{color:#8ea3c1}
    .glass-input:focus{
      border-color: rgba(56,189,248,.40);
      box-shadow: 0 0 0 4px rgba(56,189,248,.12);
    }
    .metric{
      border:1px solid rgba(148,163,184,.14);
      background: rgba(8, 15, 32, .48);
    }
    .mini-line{
      width:100%;
      height:8px;
      border-radius:999px;
      background: linear-gradient(90deg, rgba(56,189,248,.18), rgba(139,92,246,.18));
      overflow:hidden;
    }
    .mini-line span{
      display:block;
      height:100%;
      border-radius:999px;
      background: linear-gradient(90deg, #38bdf8, #2563eb, #8b5cf6);
      box-shadow: 0 0 18px rgba(56,189,248,.28);
    }
    details > summary{
      list-style:none;
      cursor:pointer;
    }
    details > summary::-webkit-details-marker{display:none}
    .faq-item[open]{
      border-color: rgba(56,189,248,.38);
      box-shadow: 0 0 0 1px rgba(56,189,248,.08) inset, 0 18px 45px rgba(2, 8, 23, .34);
    }
    .faq-item[open] .faq-icon{
      transform: rotate(45deg);
      background: rgba(56,189,248,.18);
      color:#fff;
    }
    .scrollbar-hide::-webkit-scrollbar{display:none}
    .scrollbar-hide{-ms-overflow-style:none; scrollbar-width:none}
    @media (max-width: 1024px){
      .section-desc{max-width: 100%}
    }
    @media (max-width: 640px){
      .nav-link{padding:.6rem .8rem}
    }

/* roulang page: category2 */
:root{
      --bg:#050816;
      --bg-2:#07111f;
      --panel:rgba(15,23,42,.66);
      --panel-strong:rgba(8,18,38,.82);
      --text:#f8fafc;
      --muted:#94a3b8;
      --soft:#bfdbfe;
      --line:rgba(148,163,184,.22);
      --line-bright:rgba(56,189,248,.42);
      --primary:#38bdf8;
      --primary-2:#2563eb;
      --accent:#8b5cf6;
      --cyan:#22d3ee;
      --radius-xl:1.5rem;
      --radius-2xl:2rem;
      --shadow:0 24px 80px rgba(2,6,23,.45);
      --glow:0 0 30px rgba(56,189,248,.32);
      --glow-strong:0 0 42px rgba(34,211,238,.42),0 16px 44px rgba(37,99,235,.24);
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{
      margin:0;
      min-height:100vh;
      font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei","Noto Sans SC",sans-serif;
      color:var(--text);
      background:
        radial-gradient(circle at 18% 6%,rgba(56,189,248,.20),transparent 28rem),
        radial-gradient(circle at 82% 12%,rgba(139,92,246,.18),transparent 24rem),
        radial-gradient(circle at 50% 70%,rgba(37,99,235,.18),transparent 36rem),
        linear-gradient(145deg,#050816 0%,#07111f 42%,#0b1b33 100%);
      line-height:1.75;
      overflow-x:hidden;
    }
    a{color:inherit;text-decoration:none;transition:color .2s ease,background .2s ease,border-color .2s ease,transform .2s ease}
    img,svg{display:block;max-width:100%}
    button,input{font:inherit}
    button{cursor:pointer}
    input:focus,button:focus-visible,a:focus-visible,summary:focus-visible{
      outline:2px solid rgba(34,211,238,.85);
      outline-offset:3px;
      border-radius:1rem;
    }
    .site-bg-grid{
      position:fixed;
      inset:0;
      pointer-events:none;
      z-index:-1;
      opacity:.24;
      background-image:
        linear-gradient(rgba(148,163,184,.14) 1px,transparent 1px),
        linear-gradient(90deg,rgba(148,163,184,.14) 1px,transparent 1px);
      background-size:56px 56px;
      mask-image:linear-gradient(to bottom,rgba(0,0,0,.9),transparent 78%);
    }
    .container-shell{width:min(100% - 2rem,80rem);margin-inline:auto}
    .glass-card{
      background:linear-gradient(180deg,rgba(15,23,42,.72),rgba(8,18,38,.58));
      border:1px solid var(--line);
      box-shadow:var(--shadow);
      backdrop-filter:blur(18px);
      -webkit-backdrop-filter:blur(18px);
    }
    .glass-strong{
      background:linear-gradient(135deg,rgba(8,18,38,.88),rgba(15,23,42,.68));
      border:1px solid rgba(56,189,248,.24);
      box-shadow:0 28px 90px rgba(2,6,23,.56);
      backdrop-filter:blur(22px);
      -webkit-backdrop-filter:blur(22px);
    }
    .card-hover{transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease,background .25s ease}
    .card-hover:hover{transform:translateY(-4px);border-color:rgba(56,189,248,.48);box-shadow:var(--shadow),var(--glow)}
    .glow-button{
      background:linear-gradient(135deg,#2563eb 0%,#38bdf8 52%,#22d3ee 100%);
      box-shadow:var(--glow-strong);
      color:white;
      font-weight:700;
      transition:transform .22s ease,filter .22s ease,box-shadow .22s ease;
    }
    .glow-button:hover{transform:translateY(-2px);filter:brightness(1.08);box-shadow:0 0 52px rgba(34,211,238,.56),0 18px 50px rgba(37,99,235,.32)}
    .ghost-button{
      background:rgba(15,23,42,.58);
      border:1px solid rgba(148,163,184,.28);
      color:#dbeafe;
      transition:transform .22s ease,background .22s ease,border-color .22s ease;
    }
    .ghost-button:hover{transform:translateY(-2px);background:rgba(56,189,248,.10);border-color:rgba(34,211,238,.55)}
    .top-strip{
      background:rgba(2,6,23,.72);
      border-bottom:1px solid rgba(148,163,184,.14);
      backdrop-filter:blur(14px);
      -webkit-backdrop-filter:blur(14px);
    }
    .main-header{
      position:sticky;
      top:0;
      z-index:50;
      background:rgba(5,8,22,.72);
      border-bottom:1px solid rgba(148,163,184,.16);
      backdrop-filter:blur(20px);
      -webkit-backdrop-filter:blur(20px);
    }
    .nav-link{
      display:inline-flex;
      align-items:center;
      gap:.45rem;
      min-height:2.5rem;
      padding:.55rem .9rem;
      border-radius:999px;
      color:#cbd5e1;
      font-size:.92rem;
      font-weight:650;
      border:1px solid transparent;
    }
    .nav-link:hover{color:#e0f2fe;background:rgba(56,189,248,.08);border-color:rgba(56,189,248,.18)}
    .nav-link.active{color:white;background:rgba(56,189,248,.16);border-color:rgba(56,189,248,.40);box-shadow:0 0 22px rgba(56,189,248,.18)}
    .mobile-panel{
      display:none;
      border-top:1px solid rgba(148,163,184,.16);
      background:rgba(5,8,22,.94);
      backdrop-filter:blur(18px);
      -webkit-backdrop-filter:blur(18px);
    }
    .mobile-panel.open{display:block}
    .badge{
      display:inline-flex;
      align-items:center;
      gap:.45rem;
      border-radius:999px;
      border:1px solid rgba(56,189,248,.30);
      background:rgba(14,165,233,.10);
      color:#bae6fd;
      padding:.38rem .75rem;
      font-size:.78rem;
      font-weight:650;
      white-space:nowrap;
    }
    .badge-dot{width:.45rem;height:.45rem;border-radius:50%;background:#22d3ee;box-shadow:0 0 14px rgba(34,211,238,.85)}
    .section-pad{padding:5rem 0}
    .page-hero{position:relative;padding:4rem 0 3.25rem}
    .hero-orb{
      position:absolute;
      border-radius:999px;
      filter:blur(58px);
      opacity:.42;
      pointer-events:none;
    }
    .orb-a{width:18rem;height:18rem;left:-4rem;top:4rem;background:#2563eb}
    .orb-b{width:16rem;height:16rem;right:6%;top:2rem;background:#8b5cf6}
    .play-halo{
      display:flex;
      align-items:center;
      justify-content:center;
      border-radius:999px;
      background:radial-gradient(circle,rgba(56,189,248,.38),rgba(37,99,235,.20) 48%,rgba(8,18,38,.14) 70%);
      box-shadow:0 0 65px rgba(56,189,248,.34);
    }
    .cover-lines::before{
      content:"";
      position:absolute;
      inset:0;
      background:linear-gradient(120deg,transparent 0%,rgba(56,189,248,.10) 28%,transparent 52%,rgba(139,92,246,.12) 74%,transparent 100%);
      pointer-events:none;
    }
    .timeline{
      position:relative;
    }
    .timeline::before{
      content:"";
      position:absolute;
      left:1.05rem;
      top:.5rem;
      bottom:.5rem;
      width:1px;
      background:linear-gradient(to bottom,rgba(56,189,248,.65),rgba(139,92,246,.28),transparent);
    }
    .timeline-item{
      position:relative;
      padding-left:3.1rem;
    }
    .timeline-dot{
      position:absolute;
      left:.55rem;
      top:1.15rem;
      width:1rem;
      height:1rem;
      border-radius:50%;
      background:#07111f;
      border:2px solid rgba(34,211,238,.82);
      box-shadow:0 0 22px rgba(34,211,238,.38);
    }
    .thumb{
      position:relative;
      overflow:hidden;
      border-radius:1.25rem;
      background:
        radial-gradient(circle at 24% 18%,rgba(34,211,238,.34),transparent 28%),
        linear-gradient(135deg,rgba(37,99,235,.35),rgba(15,23,42,.9) 56%,rgba(139,92,246,.22));
      border:1px solid rgba(148,163,184,.18);
    }
    .thumb::after{
      content:"";
      position:absolute;
      inset:auto 0 0 0;
      height:42%;
      background:linear-gradient(to top,rgba(2,6,23,.78),transparent);
    }
    .mini-thumb{
      border-radius:.85rem;
      background:linear-gradient(135deg,rgba(56,189,248,.28),rgba(15,23,42,.80),rgba(139,92,246,.22));
      border:1px solid rgba(255,255,255,.10);
      aspect-ratio:16/10;
    }
    .search-box{
      display:flex;
      align-items:center;
      gap:.7rem;
      border-radius:999px;
      border:1px solid rgba(148,163,184,.22);
      background:rgba(15,23,42,.62);
      padding:.4rem .45rem .4rem 1rem;
      box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
    }
    .search-box input{
      min-width:0;
      flex:1;
      border:0;
      outline:0;
      background:transparent;
      color:#e2e8f0;
      font-size:.92rem;
    }
    .search-box input::placeholder{color:#64748b}
    .rank-item{
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:1rem;
      border-radius:1.1rem;
      padding:.85rem;
      border:1px solid rgba(148,163,184,.14);
      background:rgba(15,23,42,.42);
      transition:background .2s ease,border-color .2s ease,transform .2s ease;
    }
    .rank-item:hover{background:rgba(56,189,248,.08);border-color:rgba(56,189,248,.28);transform:translateX(3px)}
    .faq details{
      border:1px solid rgba(148,163,184,.18);
      border-radius:1.25rem;
      background:rgba(15,23,42,.58);
      overflow:hidden;
      transition:border-color .2s ease,box-shadow .2s ease;
    }
    .faq details[open]{border-color:rgba(56,189,248,.42);box-shadow:0 0 28px rgba(56,189,248,.12)}
    .faq summary{
      list-style:none;
      cursor:pointer;
      padding:1.05rem 1.2rem;
      font-weight:700;
      color:#f8fafc;
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:1rem;
    }
    .faq summary::-webkit-details-marker{display:none}
    .faq summary::after{content:"+";color:#67e8f9;font-size:1.25rem;line-height:1}
    .faq details[open] summary::after{content:"−"}
    .faq p{padding:0 1.2rem 1.15rem;color:#cbd5e1;font-size:.95rem;line-height:1.8}
    .cta-panel{
      position:relative;
      overflow:hidden;
      border-radius:2rem;
      background:
        radial-gradient(circle at 12% 20%,rgba(56,189,248,.24),transparent 32%),
        radial-gradient(circle at 78% 42%,rgba(139,92,246,.22),transparent 34%),
        linear-gradient(135deg,rgba(15,23,42,.86),rgba(8,18,38,.72));
      border:1px solid rgba(56,189,248,.28);
      box-shadow:0 28px 90px rgba(2,6,23,.55),0 0 36px rgba(56,189,248,.13);
    }
    @media (max-width:1024px){
      .section-pad{padding:4rem 0}
      .page-hero{padding:3.25rem 0 2.5rem}
    }
    @media (max-width:768px){
      .container-shell{width:min(100% - 1.25rem,80rem)}
      .section-pad{padding:3.25rem 0}
      .top-strip .hide-sm{display:none}
      .timeline::before{left:.82rem}
      .timeline-item{padding-left:2.55rem}
      .timeline-dot{left:.33rem}
    }
    @media (max-width:520px){
      .nav-link{width:100%;justify-content:center}
      .search-box{border-radius:1.25rem;align-items:stretch;flex-direction:column;padding:.85rem}
      .search-box button{width:100%}
      .badge{font-size:.74rem}
    }

/* roulang page: category1 */
:root{
      --bg-0:#050816;
      --bg-1:#07111f;
      --bg-2:#0b1b33;
      --bg-3:#10294a;
      --line:rgba(255,255,255,.10);
      --line-strong:rgba(125,211,252,.28);
      --text:#e5eefc;
      --muted:#9fb2cc;
      --muted-2:#7f93ad;
      --sky:#38bdf8;
      --blue:#2563eb;
      --violet:#8b5cf6;
      --cyan:#22d3ee;
      --radius-xl:24px;
      --radius-2xl:28px;
      --radius-3xl:36px;
    }

    html { scroll-behavior: smooth; }
    body {
      background:
        radial-gradient(circle at 12% 8%, rgba(56,189,248,.14), transparent 24%),
        radial-gradient(circle at 84% 14%, rgba(139,92,246,.14), transparent 23%),
        radial-gradient(circle at 50% 86%, rgba(34,211,238,.08), transparent 26%),
        linear-gradient(180deg, #050816 0%, #07111f 46%, #050816 100%);
      color: var(--text);
      font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", "Noto Sans SC", sans-serif;
      overflow-x: hidden;
    }

    body::before{
      content:"";
      position:fixed;
      inset:0;
      pointer-events:none;
      z-index:-20;
      background:
        radial-gradient(circle at 20% 20%, rgba(56,189,248,.10), transparent 0 18%),
        radial-gradient(circle at 80% 10%, rgba(139,92,246,.12), transparent 0 18%),
        radial-gradient(circle at 70% 80%, rgba(34,211,238,.08), transparent 0 16%);
      filter: blur(8px);
    }

    body::after{
      content:"";
      position:fixed;
      inset:0;
      pointer-events:none;
      z-index:-10;
      background-image:
        linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px);
      background-size: 84px 84px;
      mask-image: linear-gradient(to bottom, rgba(0,0,0,.30), rgba(0,0,0,.04) 70%);
      opacity:.55;
    }

    ::selection{
      background: rgba(56,189,248,.28);
      color:#fff;
    }

    a{
      transition: color .2s ease, background-color .2s ease, border-color .2s ease, transform .2s ease, box-shadow .2s ease, opacity .2s ease;
    }

    .glass-card{
      background: rgba(8, 18, 38, .72);
      backdrop-filter: blur(20px);
      -webkit-backdrop-filter: blur(20px);
      border: 1px solid rgba(255,255,255,.10);
      box-shadow: 0 18px 60px rgba(2, 6, 23, .36);
    }

    .glass-card-soft{
      background: rgba(15, 23, 42, .54);
      backdrop-filter: blur(18px);
      -webkit-backdrop-filter: blur(18px);
      border: 1px solid rgba(255,255,255,.08);
    }

    .card-hover{
      transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease, background-color .25s ease;
    }

    .card-hover:hover{
      transform: translateY(-3px);
      border-color: rgba(56,189,248,.36);
      box-shadow: 0 24px 70px rgba(2, 6, 23, .52), 0 0 0 1px rgba(56,189,248,.16), 0 0 36px rgba(56,189,248,.14);
    }

    .nav-link{
      display:inline-flex;
      align-items:center;
      gap:.45rem;
      border:1px solid rgba(255,255,255,.10);
      background: rgba(255,255,255,.04);
      color:#cbd5e1;
      border-radius:9999px;
      padding:.68rem 1rem;
      font-size:.92rem;
      line-height:1;
      font-weight:600;
      letter-spacing:.01em;
      box-shadow: 0 10px 24px rgba(2,6,23,.12);
    }

    .nav-link:hover{
      color:#fff;
      border-color: rgba(125,211,252,.25);
      background: rgba(56,189,248,.10);
      box-shadow: 0 14px 28px rgba(2,6,23,.24), 0 0 18px rgba(56,189,248,.10);
    }

    .nav-link.active{
      color:#fff;
      background: linear-gradient(135deg, rgba(56,189,248,.16), rgba(139,92,246,.12));
      border-color: rgba(125,211,252,.34);
      box-shadow: 0 16px 34px rgba(2,6,23,.26), 0 0 0 1px rgba(56,189,248,.14);
    }

    .glow-button{
      position:relative;
      display:inline-flex;
      align-items:center;
      justify-content:center;
      gap:.5rem;
      border-radius:9999px;
      padding:.95rem 1.35rem;
      font-weight:700;
      color:#fff;
      background: linear-gradient(135deg, #38bdf8 0%, #2563eb 52%, #8b5cf6 100%);
      box-shadow: 0 18px 38px rgba(37,99,235,.26), 0 0 24px rgba(56,189,248,.20);
      border: 1px solid rgba(255,255,255,.08);
    }

    .glow-button:hover{
      transform: translateY(-1px);
      box-shadow: 0 22px 44px rgba(37,99,235,.30), 0 0 28px rgba(56,189,248,.24);
    }

    .glass-button{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      gap:.5rem;
      border-radius:9999px;
      padding:.95rem 1.35rem;
      color:#e2e8f0;
      background: rgba(255,255,255,.05);
      border:1px solid rgba(148,163,184,.18);
      backdrop-filter: blur(18px);
      -webkit-backdrop-filter: blur(18px);
    }

    .glass-button:hover{
      color:#fff;
      background: rgba(56,189,248,.10);
      border-color: rgba(125,211,252,.30);
      box-shadow: 0 16px 28px rgba(2,6,23,.22);
      transform: translateY(-1px);
    }

    .chip{
      display:inline-flex;
      align-items:center;
      gap:.42rem;
      border-radius:9999px;
      border:1px solid rgba(125,211,252,.18);
      background: rgba(56,189,248,.08);
      color:#cceeff;
      padding:.45rem .8rem;
      font-size:.8rem;
      line-height:1;
      white-space:nowrap;
    }

    .chip-muted{
      display:inline-flex;
      align-items:center;
      gap:.42rem;
      border-radius:9999px;
      border:1px solid rgba(255,255,255,.10);
      background: rgba(255,255,255,.04);
      color:#cbd5e1;
      padding:.45rem .8rem;
      font-size:.8rem;
      line-height:1;
      white-space:nowrap;
    }

    .section-kicker{
      display:inline-flex;
      align-items:center;
      gap:.5rem;
      border-radius:9999px;
      padding:.42rem .8rem;
      border:1px solid rgba(125,211,252,.16);
      background: rgba(56,189,248,.08);
      color:#cdefff;
      font-size:.82rem;
      font-weight:700;
      letter-spacing:.02em;
    }

    .play-badge{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      width:2.75rem;
      height:2.75rem;
      border-radius:9999px;
      background: linear-gradient(135deg, rgba(56,189,248,.24), rgba(139,92,246,.18));
      border:1px solid rgba(125,211,252,.22);
      box-shadow: 0 0 24px rgba(56,189,248,.16);
    }

    .mini-divider{
      height:1px;
      background: linear-gradient(90deg, transparent, rgba(148,163,184,.22), transparent);
    }

    .faq-item{
      border:1px solid rgba(255,255,255,.09);
      background: rgba(8, 18, 38, .60);
      border-radius: 1.25rem;
      overflow:hidden;
    }

    .faq-item[open]{
      border-color: rgba(56,189,248,.30);
      box-shadow: 0 0 0 1px rgba(56,189,248,.08), 0 18px 36px rgba(2,6,23,.22);
    }

    .faq-item summary{
      list-style:none;
      cursor:pointer;
      padding: 1rem 1.1rem;
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:1rem;
      color:#f8fbff;
      font-weight:700;
    }

    .faq-item summary::-webkit-details-marker{ display:none; }

    .faq-content{
      padding: 0 1.1rem 1rem;
      color:#b7c7dc;
      line-height:1.8;
      font-size:.96rem;
    }

    .nav-glass{
      background: rgba(5, 8, 22, .80);
      backdrop-filter: blur(22px);
      -webkit-backdrop-filter: blur(22px);
    }

    .mobile-panel{
      background: rgba(5, 8, 22, .92);
      backdrop-filter: blur(22px);
      -webkit-backdrop-filter: blur(22px);
      border-top:1px solid rgba(255,255,255,.08);
    }

    .content-thumb{
      position:relative;
      overflow:hidden;
      border-radius: 1.35rem;
      background:
        linear-gradient(135deg, rgba(56,189,248,.20), rgba(37,99,235,.14), rgba(139,92,246,.16)),
        linear-gradient(180deg, rgba(15,23,42,.25), rgba(2,6,23,.85));
      border:1px solid rgba(255,255,255,.08);
    }

    .content-thumb::before{
      content:"";
      position:absolute;
      inset:-20%;
      background:
        radial-gradient(circle at 30% 30%, rgba(255,255,255,.15), transparent 24%),
        radial-gradient(circle at 72% 28%, rgba(34,211,238,.18), transparent 24%),
        radial-gradient(circle at 50% 80%, rgba(139,92,246,.18), transparent 28%);
      filter: blur(8px);
      opacity:.8;
    }

    .scrollbar-hide{
      scrollbar-width:none;
      -ms-overflow-style:none;
    }
    .scrollbar-hide::-webkit-scrollbar{ display:none; }

    .muted-border{
      border-color: rgba(255,255,255,.08);
    }