:root{
    --rain-100:#cfe0ec;
    --rain-200:#a5c2d6;
    --rain-300:#7ba2bf;
    --rain-400:#5a87a3;
    --rain-500:#42718e;
    --rain-600:#2f5a74;
    --rain-700:#21455c;
    --rain-800:#163245;
    --ink-900:#070a0e;
    --ink-850:#0b0f15;
    --ink-800:#0e141c;
    --ink-700:#141c26;
    --ink-600:#1a2330;
    --line:rgba(122,162,191,.14);
    --line-strong:rgba(122,162,191,.28);
    --text:#cdd6df;
    --muted:#7a8794;
    --hot:#86c7e8;
    --warn:#e8b86c;
    --ok:#9edcff;
    --mint:#84c8ef;
    --amber:#f0c36f;
    --surface:rgba(12,17,24,.74);
    --surface-strong:rgba(18,26,36,.88);
    --shadow-deep:0 32px 90px -42px rgba(0,0,0,.92);
    --shadow-blue:0 20px 60px -36px rgba(84,152,190,.7);
  }

  *{box-sizing:border-box}
  html,body{margin:0;padding:0}

  :root{
    --mood-bg-a: rgba(90,135,163,.18);
    --mood-bg-b: rgba(33,69,92,.35);
    --mood-bg-base: #070a0e;
    --mood-bg-base-2: #060809;
    --mood-text:#cdd6df;
    --mood-rain:165,194,214;
    --mood-accent: var(--rain-400);
    --mood-pillbg: rgba(33,69,92,.18);
    --sec-pad: 120px;
    --hero-pad: 60px;
    --type-scale: 1;
  }
  body{
    background:var(--mood-bg-base);
    color:var(--text);
    font-family:'Space Grotesk',Helvetica,Arial,sans-serif;
    font-feature-settings:"ss01","ss02","cv11";
    -webkit-font-smoothing:antialiased;
    overflow-x:hidden;
    line-height:1.5;
  }
  body::before{
    display:none;
  }
  ::selection{background:var(--rain-400);color:#06090d}

  .bg{
    position:fixed;inset:0;z-index:-2;pointer-events:none;
    background:
      linear-gradient(135deg, rgba(134,199,232,.09), transparent 28%),
      radial-gradient(1200px 700px at 80% -10%, var(--mood-bg-a), transparent 62%),
      radial-gradient(1200px 700px at -10% 110%, rgba(232,184,108,.06), transparent 58%),
      linear-gradient(180deg,var(--mood-bg-base) 0%, var(--mood-bg-base-2) 100%);
    transition:background .6s ease;
  }
  .grid-bg{
    display:none;
  }
  canvas#rain,
  canvas#particles{
    position:fixed;inset:0;z-index:-1;pointer-events:none;
  }
  canvas#particles{z-index:-1;opacity:.85}

  .wrap{max-width:1320px;margin:0 auto;padding:0 32px}

  .site-header{
    position:sticky;top:0;z-index:50;
    backdrop-filter:blur(0) saturate(120%);
    -webkit-backdrop-filter:blur(0) saturate(120%);
    background:transparent;
    border-bottom:1px solid transparent;
    transition:background .35s ease,border-color .35s ease,backdrop-filter .35s ease,box-shadow .35s ease;
  }
  .site-header.is-scrolled{
    backdrop-filter:blur(18px) saturate(150%);
    -webkit-backdrop-filter:blur(18px) saturate(150%);
    background:linear-gradient(180deg,rgba(8,13,19,.88),rgba(8,13,19,.62));
    border-bottom-color:var(--line);
    box-shadow:0 16px 42px -28px rgba(0,0,0,.9);
  }
  .nav-link.is-active{color:var(--rain-100);text-shadow:0 0 14px rgba(156,201,223,.34)}
  .nav-discord{margin-left:4px}
  .nav-toggle{
    display:none;flex-direction:column;justify-content:center;gap:5px;
    width:40px;height:40px;padding:8px;border-radius:8px;
    background:rgba(18,26,36,.6);border:1px solid var(--line);cursor:pointer;
  }
  .nav-toggle span{display:block;height:2px;background:var(--rain-200);border-radius:2px;transition:transform .2s,opacity .2s}
  .nav{
    display:flex;align-items:center;justify-content:space-between;
    height:64px;
  }
  .brand{display:flex;align-items:center;gap:10px;font-weight:600;letter-spacing:.04em}
  .brand-logo{
    height:30px;width:auto;display:block;
    filter:drop-shadow(0 7px 16px rgba(90,135,163,.56));
  }
  .brand-mark{
    width:28px;height:28px;border-radius:6px;
    background:linear-gradient(135deg,var(--rain-300),var(--rain-600));
    box-shadow:0 0 0 1px rgba(165,194,214,.25), 0 8px 24px rgba(90,135,163,.35);
    display:grid;place-items:center;
    color:#0a1219;font-weight:800;font-family:'JetBrains Mono',monospace;font-size:13px;
  }
  .brand-name{color:#dfe8f0;font-size:15px}
  .brand-tag{color:var(--muted);font-size:11px;font-family:'JetBrains Mono',monospace;margin-left:8px;letter-spacing:.1em;text-transform:uppercase}
  .nav-links{display:flex;gap:28px;align-items:center}
  .nav-links a{
    color:var(--muted);text-decoration:none;font-size:13.5px;letter-spacing:.02em;
    font-family:'JetBrains Mono',monospace;
    transition:color .2s, transform .2s;
  }
  .nav-links a:hover{color:var(--rain-100);transform:translateY(-1px) scale(1.04);text-shadow:0 0 14px rgba(156,201,223,.34)}
  .nav-cta{
    display:inline-flex;gap:8px;align-items:center;
    padding:10px 15px;border-radius:8px;
    background:linear-gradient(180deg,#f5fbff,#b9d8e9 74%,#9ec5dc);
    color:#06090d;font-weight:600;font-size:13px;text-decoration:none;
    box-shadow:0 16px 34px -18px rgba(134,199,232,.85), inset 0 1px 0 rgba(255,255,255,.7);
    transition:transform .15s, box-shadow .15s, background .2s;
  }
  .nav-cta:hover{transform:translateY(-2px);background:linear-gradient(180deg,#ffffff,#cfe0ec);box-shadow:0 22px 42px -20px rgba(134,199,232,.95), inset 0 1px 0 rgba(255,255,255,.75)}
  .nav-cta span{color:#1a2330;opacity:.65}

  .hero{position:relative;padding:var(--hero-pad) 0 calc(var(--hero-pad) * .78);overflow:hidden}
  .hero::before{
    content:"";position:absolute;inset:0 0 auto;height:58%;
    background:linear-gradient(105deg, transparent 0 34%, rgba(123,162,191,.08) 45%, transparent 58%);
    pointer-events:none;opacity:.65;
  }
  .hero-grid{
    display:grid;grid-template-columns:minmax(0,1.02fr) minmax(500px,.98fr);gap:72px;align-items:center;
    position:relative;
  }
  .pill{
    display:inline-flex;align-items:center;gap:10px;
    padding:6px 12px 6px 8px;border-radius:999px;
    border:1px solid rgba(143,201,231,.32);
    background:linear-gradient(180deg,rgba(26,45,60,.58),rgba(15,23,32,.48));
    font-family:'JetBrains Mono',monospace;font-size:11.5px;letter-spacing:.08em;
    color:var(--rain-100);text-transform:uppercase;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.06), 0 12px 28px -24px rgba(134,199,232,.9);
  }
  .pill .dot{width:8px;height:8px;border-radius:50%;background:var(--ok);box-shadow:0 0 12px var(--ok)}
  .ver{color:var(--muted);margin-left:6px}

  h1.hero-title{
    font-size:calc(72px * var(--type-scale));
    line-height:.92;letter-spacing:0;
    font-weight:600;color:#eaf1f7;margin:24px 0 20px;
    text-wrap:balance;
    text-shadow:0 24px 80px rgba(165,194,214,.12);
  }
  h1.hero-title em{
    font-style:normal;
    background:linear-gradient(180deg,var(--rain-200),var(--rain-500));
    -webkit-background-clip:text;background-clip:text;color:transparent;
  }
  h1.hero-title .slash{
    display:inline-block;color:var(--rain-400);font-weight:300;transform:translateY(-6px);
    margin:0 .15em;
  }
  .lede{
    font-size:20px;color:#b8c4cf;max-width:560px;line-height:1.58;
    text-wrap:pretty;
  }
  .cta-row{display:flex;gap:12px;margin-top:32px;flex-wrap:wrap}
  .btn{
    display:inline-flex;align-items:center;gap:10px;
    padding:14px 22px;border-radius:8px;font-weight:700;font-size:14.5px;
    text-decoration:none;letter-spacing:.01em;
    transition:transform .15s, box-shadow .15s, background .2s;
  }
  .btn-primary{
    background:linear-gradient(180deg,#e8f6ff 0%,var(--rain-200) 36%,var(--rain-500) 100%);
    color:#06090d;
    box-shadow:0 20px 48px -22px rgba(134,199,232,.9), inset 0 1px 0 rgba(255,255,255,.55);
  }
  .btn-primary:hover{transform:translateY(-2px) scale(1.025);box-shadow:0 24px 58px -22px rgba(134,199,232,1), inset 0 1px 0 rgba(255,255,255,.65)}
  .btn-ghost{
    color:#dfe8f0;border:1px solid rgba(123,162,191,.28);
    background:linear-gradient(180deg,rgba(22,31,42,.72),rgba(10,15,22,.66));
    box-shadow:inset 0 1px 0 rgba(255,255,255,.045);
  }
  .btn-ghost:hover{background:linear-gradient(180deg,rgba(34,55,70,.76),rgba(12,21,30,.74));border-color:var(--rain-300);transform:translateY(-2px) scale(1.025)}
  .btn .kbd{
    font-family:'JetBrains Mono',monospace;font-size:11px;
    padding:2px 6px;border-radius:4px;background:rgba(0,0,0,.25);color:rgba(255,255,255,.85);
  }

  .meta-row{
    display:flex;gap:32px;margin-top:36px;color:var(--muted);
    font-family:'JetBrains Mono',monospace;font-size:12.5px;flex-wrap:wrap;
  }
  .meta-row b{color:#dfe8f0;font-weight:500}

  .rain-ui{
    position:relative;
    display:flex;flex-direction:column;gap:10px;
    padding:22px;
    border-radius:8px;
    background:
      linear-gradient(180deg,rgba(8,12,18,.92),rgba(5,8,12,.96));
    border:1px solid rgba(90,135,163,.18);
    box-shadow:var(--shadow-deep), var(--shadow-blue), inset 0 1px 0 rgba(255,255,255,.04);
    overflow:hidden;
    font-family:'Space Grotesk','Inter',Helvetica,Arial,sans-serif;
    isolation:isolate;
  }

  .rain-ui-hud{
    padding:0;
    aspect-ratio: 1 / 1;
    background:
      linear-gradient(180deg,rgba(11,17,24,.46),rgba(4,8,12,.72)),
      radial-gradient(900px 500px at 20% 0%, rgba(134,199,232,.09), transparent 58%);
    display:block;
    border:0;
    box-shadow:var(--shadow-deep), inset 0 1px 0 rgba(255,255,255,.02);
    overflow:hidden;
  }
  .rain-ui.rain-ui-hud {
    background:
      linear-gradient(180deg,rgba(11,17,24,.46),rgba(4,8,12,.72)),
      radial-gradient(900px 500px at 20% 0%, rgba(134,199,232,.09), transparent 58%);
  }
  .rain-ui-hud::before{
    display:none;
  }
  .rain-ui-hud::after{
    display:none;
  }
  .ru-grid-bg{
    display:none;
  }
  .ru-mod{
    border-radius:8px;
    background:rgba(20,28,38,.72);
    border:1px solid rgba(90,135,163,.10);
    overflow:hidden;
    transition:border-color .2s, box-shadow .2s, transform .2s;
    position:relative;
  }
  .ru-mod-open{
    border-color:rgba(123,162,191,.55);
    box-shadow:0 0 0 1px rgba(123,162,191,.18), 0 12px 28px -10px rgba(0,0,0,.6);
    overflow:visible;
    z-index:5;
  }
  .ru-mod:hover{
    border-color:rgba(156,201,223,.38);
    box-shadow:0 14px 32px -24px rgba(156,201,223,.8);
  }
  .ru-mod-head{
    display:flex;align-items:center;justify-content:space-between;
    padding:14px 14px 14px 18px;
    cursor:pointer;
  }
  .ru-mod-title{
    font-size:16px;font-weight:600;color:#e8eef4;letter-spacing:.005em;
    display:inline-block;transform-origin:left center;
    transition:transform .16s ease,color .16s ease,text-shadow .16s ease;
  }
  .ru-mod-head:hover .ru-mod-title{transform:scale(1.055);color:#fff;text-shadow:0 0 14px rgba(156,201,223,.42)}
  .ru-mod-right{display:flex;align-items:center;gap:10px}
  .ru-keybind{
    min-width:34px;height:24px;padding:0 8px;
    display:grid;place-items:center;
    border-radius:5px;
    background:rgba(35,48,64,.85);
    border:1px solid rgba(90,135,163,.18);
    color:#aebccb;font-size:11.5px;font-weight:500;letter-spacing:.04em;
    font-family:'JetBrains Mono',monospace;
    cursor:pointer;transition:all .15s;
  }
  .ru-keybind:hover{color:#e8eef4;border-color:rgba(123,162,191,.4)}
  .ru-keybind.ru-keybind-listening{
    color:#7ba2bf;border-color:#7ba2bf;
    background:rgba(33,69,92,.6);
    box-shadow:0 0 0 2px rgba(123,162,191,.2);
    animation:ru-pulse 1s ease-in-out infinite;
  }
  @keyframes ru-pulse{50%{box-shadow:0 0 0 4px rgba(123,162,191,.1)}}
  .ru-chevron{color:#7a8794;display:grid;place-items:center;width:18px;height:18px;transition:transform .2s}
  .ru-chevron-closed{transform:rotate(-90deg)}
  .ru-mod-body{
    padding:6px 18px 18px;
    display:flex;flex-direction:column;gap:14px;
    border-top:1px solid rgba(90,135,163,.08);
    margin-top:-1px;
  }
  .ru-mod:not(.ru-mod-open) .ru-mod-body{display:none}
  .ru-row{display:flex;flex-direction:column;gap:8px}
  .ru-row:not(.ru-slider-row){
    flex-direction:row;align-items:center;justify-content:space-between;
    padding-top:8px;
  }
  .ru-label{
    font-size:13.5px;color:#a3b1bf;font-weight:400;
    transition:transform .15s ease,color .15s ease;
  }
  .ru-row:hover .ru-label{transform:scale(1.035);color:#dfe8f0}
  .ru-val{
    font-size:13.5px;color:#e8eef4;font-weight:600;
    font-variant-numeric:tabular-nums;
  }
  .ru-select{
    appearance:none;border:none;cursor:pointer;
    display:inline-flex;align-items:center;gap:10px;
    padding:7px 10px 7px 14px;
    border-radius:6px;
    background:rgba(35,48,64,.9);
    color:#dfe8f0;font-size:13px;font-weight:500;
    font-family:inherit;
    border:1px solid rgba(90,135,163,.18);
    min-width:120px;justify-content:space-between;
  }
  .ru-select svg{color:#7a8794}
  .ru-slider-row .ru-slider-head{
    display:flex;justify-content:space-between;align-items:baseline;gap:12px;
  }
  .ru-slider-head .ru-label{white-space:nowrap}
  .ru-track{
    height:6px;border-radius:999px;
    background:rgba(35,48,64,.85);
    overflow:visible;position:relative;
    cursor:pointer;
    touch-action:none;
  }
  .ru-track:hover .ru-thumb,.ru-track.ru-dragging .ru-thumb{opacity:1;transform:translate(-50%,-50%) scale(1)}
  .ru-fill{
    height:100%;border-radius:999px;
    background:linear-gradient(90deg,#5a87a3,#7ba2bf);
    box-shadow:0 0 12px rgba(123,162,191,.5);
    width:0%;
    pointer-events:none;
  }
  .ru-thumb{
    position:absolute;top:50%;left:0;
    width:14px;height:14px;border-radius:50%;
    background:#cfe0ec;border:2px solid #5a87a3;
    transform:translate(-50%,-50%) scale(.7);
    opacity:0;transition:opacity .15s, transform .15s;
    pointer-events:none;
    box-shadow:0 0 8px rgba(123,162,191,.6);
  }

  .ru-select-wrap{position:relative}
  .rain-ui{overflow:visible}
  .ru-mod-open{overflow:visible}
  .ru-options{
    position:absolute;top:calc(100% + 6px);left:0;right:0;z-index:100;
    list-style:none;margin:0;padding:4px;
    min-width:140px;
    border-radius:8px;
    background:rgba(15,22,30,.98);
    border:1px solid rgba(123,162,191,.3);
    box-shadow:0 12px 32px rgba(0,0,0,.6);
    display:none;
    backdrop-filter:blur(8px);
  }
  .ru-options.ru-options-open{display:block}
  .ru-options li{
    padding:8px 12px;border-radius:5px;
    color:#a3b1bf;font-size:13px;cursor:pointer;
    transition:background .12s, color .12s;
  }
  .ru-options li:hover{background:rgba(33,69,92,.6);color:#e8eef4}
  .ru-opt-active{color:#7ba2bf !important;background:rgba(33,69,92,.4)}

  .terminal{
    position:relative;border-radius:14px;overflow:hidden;
    background:linear-gradient(180deg,rgba(20,28,38,.85),rgba(11,15,21,.95));
    border:1px solid var(--line-strong);
    box-shadow:0 40px 80px -20px rgba(0,0,0,.7), inset 0 1px 0 rgba(255,255,255,.04);
  }
  .term-bar{
    display:flex;align-items:center;gap:10px;
    padding:12px 14px;border-bottom:1px solid var(--line);
    background:rgba(7,10,14,.6);
  }
  .term-dots{display:flex;gap:6px}
  .term-dots span{width:11px;height:11px;border-radius:50%;background:#1d2a37}
  .term-dots span:nth-child(1){background:#e35a5a;opacity:.55}
  .term-dots span:nth-child(2){background:#e8b86c;opacity:.55}
  .term-dots span:nth-child(3){background:#9edcff;opacity:.55}
  .term-title{
    font-family:'JetBrains Mono',monospace;font-size:11.5px;color:var(--muted);
    flex:1;text-align:center;letter-spacing:.04em;
  }
  .term-body{
    padding:18px 20px 22px;font-family:'JetBrains Mono',monospace;
    font-size:12.5px;line-height:1.7;color:#c5d2dd;
    min-height:380px;
  }
  .term-body .c{color:#5b6b7a}
  .term-body .k{color:var(--rain-200)}
  .term-body .s{color:var(--ok)}
  .term-body .n{color:var(--warn)}
  .term-body .h{color:var(--hot)}
  .term-body .p{color:var(--rain-400)}
  .term-body .ok{color:var(--ok)}
  .term-body .err{color:#e35a5a}
  .term-prompt::before{content:"$ ";color:var(--rain-400)}
  .cursor{display:inline-block;width:8px;height:14px;background:var(--rain-200);vertical-align:-2px;animation:blink 1s step-end infinite}
  @keyframes blink{50%{opacity:0}}

  .logo-card{
    position:absolute;left:-120px;top:36%;
    width:340px;padding:18px;border-radius:14px;
    background:rgba(11,15,21,.7);border:1px solid var(--line-strong);
    backdrop-filter:blur(8px);
    box-shadow:0 20px 60px -20px rgba(0,0,0,.7);
    transform:rotate(-6deg);
    display:none;
  }

  .strip{
    margin-top:0;border-top:0;border-bottom:0;
    background:linear-gradient(90deg,rgba(11,15,21,.55),rgba(18,28,38,.58),rgba(11,15,21,.55));overflow:hidden;
    box-shadow:none;
  }
  .marquee{
    display:flex;gap:64px;padding:18px 0;
    animation:marq 40s linear infinite;
    width:max-content;
    font-family:'JetBrains Mono',monospace;font-size:12px;
    color:var(--muted);text-transform:uppercase;letter-spacing:.18em;
  }
  .marquee span{display:inline-flex;align-items:center;gap:10px;white-space:nowrap}
  .marquee em{color:var(--rain-300);font-style:normal}
  .marquee .sep{color:var(--rain-700)}
  @keyframes marq{from{transform:translateX(0)}to{transform:translateX(-50%)}}

  .sec{padding:var(--sec-pad) 0;position:relative}
  .sec-head{
    display:flex;align-items:flex-start;justify-content:space-between;gap:32px;
    margin-bottom:48px;
  }
  .sec-eyebrow{
    font-family:'JetBrains Mono',monospace;font-size:11.5px;letter-spacing:.18em;
    text-transform:uppercase;color:var(--rain-400);margin-bottom:14px;
  }
  .sec-title{
    font-size:calc(56px * var(--type-scale));font-weight:600;line-height:1.02;letter-spacing:0;
    color:#eaf1f7;max-width:760px;text-wrap:balance;
  }
  .sec-title-line{max-width:none;white-space:nowrap}
  .features{
    display:grid;grid-template-columns:repeat(12,1fr);gap:16px;
  }
  .feat{
    grid-column:span 4;
    border:1px solid var(--line);border-radius:8px;
    background:
      linear-gradient(180deg,rgba(26,38,50,.66),rgba(9,14,20,.68)),
      linear-gradient(125deg,rgba(123,162,191,.08),transparent 42%);
    padding:28px;position:relative;overflow:hidden;
    transition:transform .25s, border-color .25s, box-shadow .25s;
  }
  .feat::before{
    content:"";position:absolute;left:0;top:0;bottom:0;width:2px;
    background:linear-gradient(180deg,var(--rain-300),var(--mint),transparent);
    opacity:.55;
  }
  .feat:hover{transform:translateY(-4px);border-color:rgba(123,162,191,.38);box-shadow:0 28px 56px -34px rgba(0,0,0,.9), 0 18px 52px -42px rgba(134,199,232,.84)}
  .feat.wide{grid-column:span 8}
  .feat.tall{grid-column:span 4;grid-row:span 2}
  .feat .num{
    font-family:'JetBrains Mono',monospace;font-size:11px;color:var(--rain-500);letter-spacing:.18em;
    margin-bottom:24px;
  }
  .feat h3{
    font-size:22px;font-weight:600;color:#eaf1f7;margin:0 0 10px;letter-spacing:0;
    display:inline-block;transform-origin:left center;transition:transform .18s ease,text-shadow .18s ease;
  }
  .feat:hover h3{transform:scale(1.045);text-shadow:0 0 16px rgba(156,201,223,.32)}
  .feat p{color:var(--muted);font-size:14.5px;line-height:1.6;margin:0;text-wrap:pretty}
  .feat .iconwrap{
    width:44px;height:44px;border-radius:8px;
    background:linear-gradient(180deg,rgba(42,72,92,.5),rgba(20,31,42,.55));border:1px solid var(--line-strong);
    display:grid;place-items:center;margin-bottom:18px;color:var(--rain-200);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.055), 0 18px 36px -28px rgba(134,199,232,.8);
  }

  .jni-panel{
    grid-column:span 8;grid-row:span 2;
    border:1px solid var(--line);border-radius:14px;overflow:hidden;
    background:linear-gradient(180deg,rgba(20,28,38,.75),rgba(11,15,21,.85));
    position:relative;
    display:grid;grid-template-rows:auto 1fr;
  }
  .jni-head{
    padding:24px 28px;border-bottom:1px solid var(--line);
    display:flex;justify-content:space-between;align-items:center;gap:24px;
  }
  .jni-head h3{font-size:22px;font-weight:600;color:#eaf1f7;margin:0}
  .jni-head .num{font-family:'JetBrains Mono',monospace;font-size:11px;color:var(--rain-500);letter-spacing:.18em}
  .jni-body{
    display:grid;grid-template-columns:1fr 1fr;
  }
  .jni-col{padding:22px 24px;font-family:'JetBrains Mono',monospace;font-size:12px;color:#aebccb;line-height:1.7}
  .jni-col + .jni-col{border-left:1px solid var(--line)}
  .jni-col .label{color:var(--muted);font-size:10.5px;letter-spacing:.15em;text-transform:uppercase;margin-bottom:10px}
  .jni-col .row{display:flex;justify-content:space-between;padding:5px 0;border-bottom:1px dashed rgba(122,162,191,.08)}
  .jni-col .row:last-child{border-bottom:none}
  .jni-col .row b{color:#dfe8f0;font-weight:500}
  .jni-col .ok{color:var(--ok)}
  .jni-col .warn{color:var(--warn)}

  .modules{
    display:grid;grid-template-columns:280px 1fr;gap:32px;align-items:flex-start;
    padding:18px;border:1px solid var(--line);border-radius:8px;
    background:linear-gradient(180deg,rgba(12,18,26,.52),rgba(7,11,16,.42));
  }
  .mod-cats{display:flex;flex-direction:column;gap:4px}
  .mod-cat{
    display:flex;justify-content:space-between;align-items:center;
    padding:12px 14px;border-radius:6px;cursor:pointer;
    border:1px solid transparent;color:var(--muted);
    font-family:'JetBrains Mono',monospace;font-size:12.5px;letter-spacing:.06em;
    text-transform:uppercase;transition:all .18s, transform .18s, text-shadow .18s;
  }
  .mod-cat:hover{color:#dfe8f0;transform:translateX(4px) scale(1.015);text-shadow:0 0 14px rgba(156,201,223,.28)}
  .mod-cat.active{
    color:#eaf1f7;background:linear-gradient(90deg,rgba(45,79,100,.62),rgba(18,28,38,.44));
    border-color:rgba(123,162,191,.34);
    box-shadow:inset 2px 0 0 var(--rain-300);
  }
  .mod-cat .count{color:var(--rain-500);font-size:11px}
  .mod-cat.active .count{color:var(--rain-200)}

  .mod-grid{
    display:grid;grid-template-columns:repeat(3,1fr);gap:12px;
  }
  .mod{
    border:1px solid var(--line);border-radius:8px;padding:18px;
    background:linear-gradient(180deg,rgba(20,30,40,.62),rgba(9,14,20,.62));
    transition:all .2s;cursor:pointer;position:relative;
  }
  .mod:hover{border-color:var(--rain-500);transform:translateY(-2px);box-shadow:0 18px 42px -34px rgba(134,199,232,.75)}
  .mod.on{border-color:var(--rain-400);background:linear-gradient(180deg,rgba(42,80,100,.52),rgba(15,35,46,.46));}
  .mod-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
  .mod h4{margin:0;font-size:14.5px;font-weight:500;color:#eaf1f7;display:inline-block;transform-origin:left center;transition:transform .16s ease,text-shadow .16s ease}
  .mod:hover h4{transform:scale(1.06);text-shadow:0 0 14px rgba(156,201,223,.34)}
  .mod .toggle{
    width:30px;height:17px;border-radius:999px;background:#1a2330;border:1px solid var(--line-strong);
    position:relative;transition:all .2s;
  }
  .mod .toggle::after{
    content:"";position:absolute;width:10px;height:10px;border-radius:50%;
    background:var(--muted);top:2px;left:2px;transition:all .2s;
  }
  .mod.on .toggle{background:var(--rain-500);border-color:var(--rain-300)}
  .mod.on .toggle::after{background:#eaf1f7;left:15px}
  .mod-tag{
    font-family:'JetBrains Mono',monospace;font-size:10.5px;color:var(--rain-500);
    letter-spacing:.12em;text-transform:uppercase;margin-top:8px;display:block;
  }

  .install{
    display:grid;grid-template-columns:1.1fr 1fr;gap:48px;align-items:center;
  }
  .step-list{display:flex;flex-direction:column;gap:18px}
  .step{
    display:flex;gap:18px;padding:18px 20px;border-radius:8px;
    border:1px solid var(--line);background:linear-gradient(180deg,rgba(20,30,40,.52),rgba(10,15,22,.48));
    transition:border-color .2s;
  }
  .step:hover{border-color:var(--line-strong)}
  .step .n{
    font-family:'JetBrains Mono',monospace;font-size:13px;color:var(--rain-300);
    width:28px;flex-shrink:0;padding-top:2px;
  }
  .step h4{margin:0 0 6px;font-size:16px;font-weight:600;color:#eaf1f7}
  .step p{margin:0;color:var(--muted);font-size:13.5px;line-height:1.55}
  .step code{
    display:inline-block;margin-top:8px;padding:6px 10px;border-radius:6px;
    background:rgba(7,10,14,.7);border:1px solid var(--line);
    font-family:'JetBrains Mono',monospace;font-size:12.5px;color:var(--rain-100);
  }

  .stats{
    display:grid;grid-template-columns:repeat(4,1fr);
    border:1px solid var(--line);border-radius:14px;overflow:hidden;
    background:linear-gradient(180deg,rgba(20,28,38,.4),rgba(11,15,21,.4));
  }
  .stat{padding:32px;border-right:1px solid var(--line)}
  .stat:last-child{border-right:none}
  .stat .v{
    font-size:44px;font-weight:600;color:#eaf1f7;letter-spacing:0;line-height:1;
    font-family:'Space Grotesk',sans-serif;
  }
  .stat .v small{font-size:18px;color:var(--rain-400);font-weight:400;margin-left:4px}
  .stat .l{
    margin-top:10px;font-family:'JetBrains Mono',monospace;font-size:11.5px;
    color:var(--muted);letter-spacing:.12em;text-transform:uppercase;
  }

  .faq{
    display:flex;align-items:flex-start;position:relative;
  }
  .faq::before{
    content:"";position:absolute;left:50%;top:0;bottom:0;width:1px;
    background:var(--line-strong);transform:translateX(-50%);pointer-events:none;
  }
  .faq-col{flex:1;display:flex;flex-direction:column;gap:14px;min-width:0;padding:0 24px}
  .faq-col:first-child{padding-left:0}
  .faq-col:last-child{padding-right:0}
  details.q{
    display:block;
    border:1px solid var(--line);border-radius:8px;padding:18px 20px;
    background:linear-gradient(180deg,rgba(20,30,40,.46),rgba(9,14,20,.44));transition:border-color .25s ease, background .25s ease;
    overflow-wrap:anywhere;word-break:break-word;min-width:0;max-width:100%;
  }
  details.q[open]{border-color:var(--line-strong);background:linear-gradient(180deg,rgba(33,69,92,.3),rgba(12,20,28,.48))}
  details.q summary{
    cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;
    font-size:15px;font-weight:500;color:#eaf1f7;
  }
  details.q summary::-webkit-details-marker{display:none}
  details.q summary::after{
    content:"+";color:var(--rain-400);font-size:20px;font-weight:300;transition:transform .25s ease;
  }
  details.q[open] summary::after{transform:rotate(45deg)}
  details.q p{
    margin:0;color:var(--muted);font-size:14px;line-height:1.6;
    max-height:0;opacity:0;overflow:hidden;
    transition:max-height .3s ease, opacity .25s ease, margin-top .3s ease;
  }
  details.q[open] p{margin-top:14px;opacity:1;max-height:2000px}

  footer{
    border-top:1px solid var(--line);padding:32px 0 24px;margin-top:44px;
    background:rgba(7,10,14,.6);
  }
  footer .wrap{max-width:740px}
  .foot{
    display:flex;align-items:center;justify-content:center;
  }
  .foot-links{display:flex;align-items:center;justify-content:center;padding-top:0}
  .foot-group{
    display:flex;align-items:center;justify-content:center;gap:10px 22px;flex-wrap:wrap;
  }
  .foot-group h5{flex-basis:100%;text-align:center}
  .foot h5{
    margin:0;font-family:'JetBrains Mono',monospace;font-size:11px;
    color:var(--muted);letter-spacing:.18em;text-transform:uppercase;font-weight:500;
  }
  .foot a{display:block;color:#aebccb;text-decoration:none;font-size:13.5px;padding:0;transition:color .15s}
  .foot a:hover{color:var(--rain-200)}
  .foot p{color:var(--muted);font-size:13px;line-height:1.55;margin:14px 0 0;max-width:340px}
  .foot-bot{
    margin-top:24px;padding-top:18px;border-top:1px solid var(--line);
    display:flex;justify-content:center;color:var(--muted);font-family:'JetBrains Mono',monospace;font-size:11.5px;letter-spacing:.04em;
  }

  .legal{
    display:inline-flex;align-items:center;gap:8px;
    padding:6px 12px;border-radius:6px;
    background:rgba(232,184,108,.08);border:1px solid rgba(232,184,108,.25);
    color:var(--warn);font-family:'JetBrains Mono',monospace;font-size:11px;
    letter-spacing:.08em;text-transform:uppercase;
  }

  .cta-banner{
    margin:0;padding:76px 56px;border-radius:8px;
    background:
      linear-gradient(120deg,rgba(134,199,232,.18),transparent 38%),
      radial-gradient(600px 400px at 80% 0%, rgba(123,162,191,.5), transparent 60%),
      linear-gradient(180deg,rgba(52,93,118,.68),rgba(9,14,20,.88));
    border:1px solid var(--rain-400);
    position:relative;overflow:hidden;
    box-shadow:var(--shadow-deep), 0 24px 90px -54px rgba(134,199,232,.86);
  }
  .cta-banner h2{
    font-size:60px;font-weight:600;letter-spacing:0;line-height:1;
    color:#eaf1f7;max-width:620px;margin:0 0 18px;text-wrap:balance;
  }
  .cta-banner p{color:#aebccb;max-width:540px;font-size:16px;line-height:1.55;margin:0 0 30px}
  .cta-banner::before{
    content:"";position:absolute;right:-100px;top:-100px;width:520px;height:520px;
    background:radial-gradient(circle,rgba(123,162,191,.18),transparent 60%);
    pointer-events:none;
  }

  body[data-mood="storm"]{
    --mood-bg-base:#070a0e; --mood-bg-base-2:#060809;
    --mood-bg-a: rgba(90,135,163,.18);
    --mood-bg-b: rgba(33,69,92,.35);
    --mood-rain:165,194,214;
  }
  body[data-mood="overcast"]{
    --mood-bg-base:#1a1d22; --mood-bg-base-2:#15181d;
    --mood-bg-a: rgba(180,190,200,.10);
    --mood-bg-b: rgba(70,82,96,.32);
    --mood-rain:200,210,220;
  }
  body[data-mood="dawn"]{
    --mood-bg-base:#0d0a14; --mood-bg-base-2:#0a070f;
    --mood-bg-a: rgba(232,140,108,.16);
    --mood-bg-b: rgba(108,76,140,.30);
    --mood-rain:230,180,200;
  }
  body[data-mood="dawn"] h1.hero-title em{
    background:linear-gradient(180deg,#f0c8b8,#9c6088);
    -webkit-background-clip:text;background-clip:text;color:transparent;
  }
  body[data-mood="neon"]{
    --mood-bg-base:#04060a; --mood-bg-base-2:#020306;
    --mood-bg-a: rgba(80,210,255,.14);
    --mood-bg-b: rgba(180,90,240,.22);
    --mood-rain:120,220,255;
  }
  body[data-mood="neon"] h1.hero-title em{
    background:linear-gradient(180deg,#9af0ff,#7a5cff);
    -webkit-background-clip:text;background-clip:text;color:transparent;
  }
  body[data-mood="neon"] .pill .dot{background:#9af0ff;box-shadow:0 0 12px #9af0ff}

  body[data-density="loose"]{ --sec-pad: 160px; --hero-pad: 128px; --type-scale: 1.08; }
  body[data-density="default"]{ --sec-pad: 120px; --hero-pad: 96px; --type-scale: 1; }
  body[data-density="compact"]{ --sec-pad: 72px; --hero-pad: 60px; --type-scale: .88; }

  @media (max-width:980px){
    .hero-grid{grid-template-columns:1fr;gap:40px}
    h1.hero-title{font-size:70px}
    .sec-title{font-size:44px}
    .cta-banner h2{font-size:46px}
    .feat,.feat.wide,.feat.tall,.jni-panel{grid-column:span 12 !important;grid-row:auto !important}
    .jni-body{grid-template-columns:1fr}
    .jni-col + .jni-col{border-left:none;border-top:1px solid var(--line)}
    .modules{grid-template-columns:1fr}
    .mod-grid{grid-template-columns:repeat(2,1fr)}
    .install{grid-template-columns:1fr;gap:32px}
    .stats{grid-template-columns:repeat(2,1fr)}
    .stat:nth-child(2){border-right:none}
    .stat:nth-child(1),.stat:nth-child(2){border-bottom:1px solid var(--line)}
    .faq{display:flex;flex-direction:column;gap:14px}
    .faq::before{display:none}
    .faq-col{padding:0 !important}
    footer .wrap{max-width:740px}
    .foot{display:flex}
    .foot-links{gap:16px;padding-top:0}
    .foot-group{align-items:center;justify-content:center;gap:8px 14px}
    .cta-banner{padding:48px 28px}
    .sec-title-line{white-space:normal}
  }
  @media (max-width:700px){
    .wrap{padding:0 24px}
    .nav{height:64px}
    .brand-tag{display:none}
    .hero{padding-top:60px}
    h1.hero-title{font-size:48px;line-height:1.02;margin-top:22px}
    .lede{font-size:18px}
    .meta-row{gap:18px 26px}
    .rain-ui-hud{aspect-ratio:1 / 1.08}
    .rain-ui-hud .r-viewport{transform-origin:top left;transform:scale(0.62)}
    .rain-ui-hud .r-zoom-badge{display:none}
    .sec{padding:76px 0}
    .sec-title{font-size:34px;line-height:1.08}
    .features{gap:14px}
    .feat{padding:22px}
    .modules{padding:12px}
    .mod-grid{grid-template-columns:1fr}
    .cta-banner{padding:44px 24px}
    .cta-banner h2{font-size:38px;line-height:1.04}
  }
  @media (max-width:430px){
    .wrap{padding:0 32px}
    .nav-links{gap:12px}
    .nav-cta{padding:10px 13px}
    .pill{font-size:11px;max-width:100%}
    h1.hero-title{font-size:44px}
    .cta-row{gap:10px}
    .btn{min-height:52px}
    .rain-ui-hud .r-viewport{transform:scale(0.55);transform-origin:top left}
    .rain-ui-hud{aspect-ratio:1 / 1.1}
  }

  /* ── Hero enhancements ── */
  .hero-glow{
    position:absolute;inset:0;pointer-events:none;overflow:hidden;
  }
  .hero-glow::before{
    content:"";position:absolute;width:680px;height:680px;
    top:-120px;right:-80px;
    background:radial-gradient(circle,rgba(123,162,191,.22),rgba(120,90,240,.08) 45%,transparent 68%);
    animation:glow-drift 14s ease-in-out infinite alternate;
  }
  .hero-glow::after{
    content:"";position:absolute;width:520px;height:520px;
    bottom:-160px;left:-60px;
    background:radial-gradient(circle,rgba(134,199,232,.12),transparent 65%);
    animation:glow-drift 18s ease-in-out infinite alternate-reverse;
  }
  @keyframes glow-drift{
    from{transform:translate(0,0) scale(1)}
    to{transform:translate(24px,-18px) scale(1.06)}
  }

  .hero-visual{position:relative}
  .float-card{
    position:absolute;z-index:6;
    display:flex;align-items:center;gap:10px;
    padding:10px 14px;border-radius:8px;
    background:rgba(11,15,21,.78);border:1px solid var(--line-strong);
    backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
    box-shadow:0 16px 40px -20px rgba(0,0,0,.8),0 0 24px -12px rgba(134,199,232,.5);
    font-family:'JetBrains Mono',monospace;font-size:11px;
    animation:float-card 5s ease-in-out infinite;
  }
  .float-card--1{top:8%;left:-6%;animation-delay:0s}
  .float-card--2{top:42%;right:-4%;animation-delay:1.2s}
  .float-card--3{bottom:10%;left:4%;animation-delay:2.4s}
  .float-card__label{color:var(--muted);text-transform:uppercase;letter-spacing:.08em}
  .float-card__val{color:var(--rain-200);font-weight:600}
  .float-card__val.on{color:var(--ok)}
  @keyframes float-card{
    0%,100%{transform:translateY(0)}
    50%{transform:translateY(-10px)}
  }

  .fade-up{
    opacity:0;transform:translateY(28px);
    transition:opacity .65s cubic-bezier(.22,1,.36,1),transform .65s cubic-bezier(.22,1,.36,1);
    transition-delay:var(--delay,0s);
  }
  .fade-up.is-visible{opacity:1;transform:none}

  /* ── Showcase ── */
  .showcase{
    border:1px solid var(--line);border-radius:14px;
    background:linear-gradient(180deg,rgba(12,18,26,.55),rgba(7,11,16,.45));
    padding:28px;overflow:hidden;
  }
  .showcase-tabs{display:flex;gap:8px;margin-bottom:24px;flex-wrap:wrap}
  .showcase-tab,.config-tab{
    padding:10px 18px;border-radius:8px;cursor:pointer;
    border:1px solid var(--line);background:rgba(18,26,36,.5);
    color:var(--muted);font-family:'JetBrains Mono',monospace;font-size:12px;
    letter-spacing:.06em;text-transform:uppercase;
    transition:all .2s;
  }
  .showcase-tab:hover,.config-tab:hover{color:var(--rain-100);border-color:var(--line-strong)}
  .showcase-tab.is-active,.config-tab.is-active{
    color:var(--rain-100);border-color:rgba(123,162,191,.45);
    background:linear-gradient(180deg,rgba(33,69,92,.45),rgba(18,28,38,.55));
    box-shadow:0 0 24px -12px rgba(134,199,232,.6);
  }
  .showcase-panels{position:relative;min-height:320px}
  .showcase-panel{
    display:none;animation:panel-in .45s ease;
  }
  .showcase-panel.is-active{display:block}
  @keyframes panel-in{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
  .showcase-frame{
    border-radius:10px;overflow:hidden;
    border:1px solid var(--line-strong);
    background:linear-gradient(180deg,rgba(7,10,14,.9),rgba(11,15,21,.95));
    box-shadow:var(--shadow-deep);
  }
  .showcase-mock{padding:0}
  .mock-bar{
    display:flex;align-items:center;gap:8px;padding:12px 16px;
    border-bottom:1px solid var(--line);background:rgba(7,10,14,.7);
  }
  .mock-bar span{width:10px;height:10px;border-radius:50%;background:#1d2a37}
  .mock-bar span:nth-child(1){background:#e35a5a;opacity:.55}
  .mock-bar span:nth-child(2){background:#e8b86c;opacity:.55}
  .mock-bar span:nth-child(3){background:#9edcff;opacity:.55}
  .mock-bar em{flex:1;text-align:center;font-style:normal;font-family:'JetBrains Mono',monospace;font-size:11px;color:var(--muted);letter-spacing:.06em}
  .mock-rows{padding:16px;display:flex;flex-direction:column;gap:8px;min-height:220px}
  .mock-row{
    display:flex;justify-content:space-between;align-items:center;
    padding:12px 16px;border-radius:6px;
    border:1px solid var(--line);background:rgba(20,28,38,.6);
    font-size:14px;color:var(--muted);
  }
  .mock-row.on{border-color:rgba(123,162,191,.4);color:#eaf1f7;background:rgba(33,69,92,.35)}
  .mock-row small{font-family:'JetBrains Mono',monospace;font-size:11px;color:var(--rain-400)}
  .mock-esp{position:relative;min-height:240px;padding:24px;background:radial-gradient(ellipse at 50% 60%,rgba(123,162,191,.08),transparent 60%)}
  .mock-esp-box{
    position:absolute;padding:8px 12px;border-radius:4px;
    border:1px solid;font-family:'JetBrains Mono',monospace;font-size:11px;
    display:flex;flex-direction:column;gap:4px;
  }
  .mock-esp-box.hostile{top:28%;left:18%;border-color:#e35a5a;color:#e35a5a;background:rgba(227,90,90,.08)}
  .mock-esp-box.friendly{bottom:22%;right:16%;border-color:#9edcff;color:#9edcff;background:rgba(158,220,255,.08)}
  .showcase-caption{margin:16px 0 0;color:var(--muted);font-size:14px;text-align:center}
  .showcase-nav{display:flex;align-items:center;justify-content:center;gap:16px;margin-top:20px}
  .showcase-arrow{
    width:36px;height:36px;border-radius:8px;
    border:1px solid var(--line);background:rgba(18,26,36,.6);
    color:var(--rain-200);cursor:pointer;
    display:grid;place-items:center;transition:all .2s;
  }
  .showcase-arrow:hover{border-color:var(--rain-400);background:rgba(33,69,92,.4)}
  .showcase-dots{display:flex;gap:8px}
  .showcase-dots button{
    width:8px;height:8px;border-radius:50%;padding:0;border:0;
    background:rgba(123,162,191,.25);cursor:pointer;transition:all .2s;
  }
  .showcase-dots button.is-active{background:var(--rain-300);box-shadow:0 0 10px rgba(123,162,191,.6);transform:scale(1.2)}

  /* ── Configs ── */
  .config-tabs{display:flex;gap:8px;margin-bottom:28px;flex-wrap:wrap}
  .config-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
  .config-card{
    border:1px solid var(--line);border-radius:8px;padding:22px;
    background:linear-gradient(180deg,rgba(20,30,40,.55),rgba(9,14,20,.5));
    transition:transform .22s,border-color .22s,box-shadow .22s;
  }
  .config-card:hover{transform:translateY(-3px);border-color:rgba(123,162,191,.38);box-shadow:0 20px 48px -32px rgba(134,199,232,.5)}
  .config-card__top{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:16px}
  .config-card h4{margin:0;font-size:16px;font-weight:600;color:#eaf1f7}
  .config-card__cat{
    font-family:'JetBrains Mono',monospace;font-size:10px;
    color:var(--rain-400);letter-spacing:.1em;text-transform:uppercase;
    padding:4px 8px;border-radius:4px;background:rgba(33,69,92,.35);white-space:nowrap;
  }
  .config-card__meta{display:flex;gap:16px;font-family:'JetBrains Mono',monospace;font-size:12px;color:var(--muted)}
  .config-card__rating{color:var(--warn)}
  .config-card__rating i,.config-card__dl i{margin-right:4px;opacity:.7}

  /* ── Why Aurian ── */
  .why-grid{display:grid;grid-template-columns:1fr 1fr;gap:48px}
  .why-col{display:flex;flex-direction:column;gap:24px}
  .why-item{
    display:flex;gap:18px;padding:22px;border-radius:8px;
    border:1px solid var(--line);
    background:linear-gradient(180deg,rgba(20,30,40,.4),rgba(9,14,20,.35));
    transition:border-color .2s,transform .2s;
  }
  .why-item:hover{border-color:var(--line-strong);transform:translateX(4px)}
  .why-icon{
    width:44px;height:44px;flex-shrink:0;border-radius:8px;
    display:grid;place-items:center;
    background:linear-gradient(180deg,rgba(42,72,92,.5),rgba(20,31,42,.55));
    border:1px solid var(--line-strong);color:var(--rain-200);
  }
  .why-item h4{margin:0 0 6px;font-size:17px;font-weight:600;color:#eaf1f7}
  .why-item p{margin:0;color:var(--muted);font-size:14px;line-height:1.55}

  @media (max-width:980px){
    .nav-toggle{display:flex}
    .nav-links{
      position:fixed;inset:64px 0 auto 0;
      flex-direction:column;align-items:stretch;gap:0;
      padding:16px 24px 24px;
      background:linear-gradient(180deg,rgba(8,13,19,.97),rgba(8,13,19,.92));
      border-bottom:1px solid var(--line);
      backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
      transform:translateY(-110%);opacity:0;pointer-events:none;
      transition:transform .3s ease,opacity .3s ease;
    }
    .nav-links.is-open{transform:translateY(0);opacity:1;pointer-events:auto}
    .nav-links a{padding:14px 0;border-bottom:1px solid var(--line);font-size:14px}
    .nav-links .nav-cta{justify-content:center;margin-top:8px}
    .config-grid{grid-template-columns:1fr 1fr}
    .why-grid{grid-template-columns:1fr;gap:24px}
    .float-card--1{left:0}.float-card--2{right:0}
  }
  @media (max-width:700px){
    .config-grid{grid-template-columns:1fr}
    .float-card{display:none}
  }