:root{
      --bg:#061412; --surface:#0c2422; --surface-soft:#12302c; --accent:#2dd4bf; --accent-2:#e4b15a;
      --text:#eef8f6; --muted:#c5ddd8; --border:#1f4a45; --shadow:0 12px 28px rgba(0,0,0,.28);
      --radius:8px; --container:1080px; --hero-dir:column;
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{margin:0;background:var(--bg);color:var(--text);font:16px/1.65 "Segoe UI",system-ui,sans-serif;overflow-x:hidden}
    img,svg{max-width:100%;height:auto}
    a{color:var(--accent-2)}
    a:hover{color:var(--text)}
    .skip{position:absolute;left:-999px;top:8px;background:#fff;color:#000;padding:8px 12px;z-index:9}
    .skip:focus{left:8px}
    .wrap{width:min(var(--container),calc(100% - 32px));margin-inline:auto}
    header.site{position:sticky;top:0;z-index:20;background:rgba(8,6,8,.92);backdrop-filter:blur(10px);border-bottom:1px solid var(--border)}
    .bar{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:64px;position:relative}
    .logo img{height:42px;width:auto;display:block}
    .nav-toggle{background:transparent;color:var(--text);border:1px solid var(--border);border-radius:var(--radius);padding:8px 12px}
    nav.primary{display:none;position:absolute;left:0;right:0;top:100%;background:var(--surface);border-bottom:1px solid var(--border);padding:8px 16px 16px;z-index:30}
    nav.primary.open{display:block}
    nav.primary a{display:block;padding:10px 4px;text-decoration:none;color:var(--text)}
    .btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:10px 16px;border-radius:var(--radius);text-decoration:none;font-weight:700}
    .btn-primary{background:linear-gradient(180deg,var(--accent-2),#b8892e);color:#1a1208}
    .btn-ghost{border:1px solid var(--border);color:var(--text);background:transparent}
    .hero{padding:0}
    .section{padding:28px 0}
    h1{font-size:clamp(1.7rem,6vw,3rem);line-height:1.15;margin:0 0 12px}
    h2{font-size:clamp(1.3rem,3vw,1.8rem);line-height:1.25;margin:0 0 10px}
    h3{margin:0 0 8px}
    .muted{color:var(--muted)}
    .panel,.post-card,.feature,.content-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow)}
    .feature,.content-card,.post-card{padding:16px}
    .hero-banner{position:relative;width:100%;overflow:hidden;border-bottom:1px solid var(--border);background:#000}
    .hero-banner__img{display:block;width:100%;height:auto;aspect-ratio:16/7;object-fit:cover;object-position:center center}
    .hero-banner__scrim{position:absolute;inset:0;background:linear-gradient(90deg,rgba(8,4,6,.84) 0%,rgba(8,4,6,.62) 36%,rgba(8,4,6,.2) 62%,rgba(8,4,6,.04) 100%);pointer-events:none}
    .hero-banner__scrim--end{background:linear-gradient(270deg,rgba(4,14,12,.86) 0%,rgba(4,14,12,.58) 38%,rgba(4,14,12,.16) 64%,transparent 100%)}
    .hero-banner__content{position:absolute;inset:0;display:flex;align-items:center;z-index:2;padding:clamp(18px,3vw,36px) 0}
    .hero-banner__content .wrap{max-width:min(560px,92vw)}
    .hero-banner__content--start{justify-content:flex-start}
    .hero-banner__content--end{justify-content:flex-end}
    .hero-banner__content h1,.hero-banner__content p{text-shadow:0 2px 16px rgba(0,0,0,.55)}
    .hero-banner__content .btn-ghost{background:rgba(0,0,0,.35);backdrop-filter:blur(6px)}
    .crumbs{display:flex;flex-wrap:wrap;gap:6px;color:var(--muted);font-size:.92rem;padding-top:18px}
    .crumbs a{color:var(--muted);text-decoration:none}
    .meta{display:flex;flex-wrap:wrap;gap:8px 14px;color:var(--muted);font-size:.92rem}
    .badge{display:inline-block;padding:2px 8px;border:1px solid var(--border);border-radius:999px;color:var(--accent-2);text-decoration:none;font-size:.8rem}
    table{width:100%;border-collapse:collapse;font-size:.95rem}
    th,td{border:1px solid var(--border);padding:8px;text-align:left;vertical-align:top}
    details{padding:10px 12px;margin:8px 0}
    summary{cursor:pointer;font-weight:700}
    .pager{display:flex;flex-wrap:wrap;gap:8px;padding:12px 0 28px}
    .pager a,.pager span{min-width:40px;min-height:40px;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--border);border-radius:10px;text-decoration:none;color:var(--text);padding:0 10px}
    .pager .current{background:var(--accent);color:#fff;border-color:transparent}
    footer.site{border-top:1px solid var(--border);padding:28px 0 40px;background:#070607}
    .pay img{width:min(100%,720px);background:transparent}
    .article{max-width:760px}
    .article p{margin:0 0 14px}
    form .field{display:flex;flex-direction:column;gap:6px;margin-bottom:12px}
    input,textarea{width:100%;padding:12px;border-radius:10px;border:1px solid var(--border);background:var(--surface-soft);color:var(--text)}
    .notice{font-size:.92rem;color:var(--muted)}
    @media(min-width:1024px){
      .nav-toggle{display:none}
      nav.primary{display:flex;position:static;background:transparent;border:0;padding:0;gap:14px;align-items:center;flex:1;justify-content:flex-end}
      nav.primary a{display:inline;padding:0;white-space:nowrap}
    }
    @media(max-width:359px){.wrap{width:calc(100% - 20px)}}
    
      .feature-grid{display:grid;gap:12px}
      .card-grid,.blog-grid{display:grid;gap:14px}
      .post-card{display:grid;grid-template-columns:1fr;gap:10px}
      .faq-list details{border:1px solid var(--border);border-radius:var(--radius);background:transparent}
      .faq-list summary{font-variant-numeric:tabular-nums}
      .footer-grid{display:grid;gap:22px}
      .featured{display:grid;gap:12px;padding:14px;border:1px solid var(--border);border-radius:var(--radius)}
      @media(min-width:768px){.card-grid,.blog-grid{grid-template-columns:1fr 1fr}.post-card{grid-template-columns:148px 1fr}.footer-grid{grid-template-columns:1.4fr .8fr}}
      @media(min-width:1024px){.feature-grid{grid-template-columns:1.2fr .8fr}.blog-grid{grid-template-columns:repeat(3,1fr)}}