:root { color-scheme: dark; --bg:#041329; --panel:#071d3d; --line:rgba(103,179,255,.24); --ink:#f4f9ff; --muted:#9cb4d0; --soft:#6f8bad; --blue:#258cff; --blue-light:#71c1ff; font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
* { box-sizing:border-box; } html { scroll-behavior:smooth; } body { min-width:320px; min-height:100vh; margin:0; overflow-x:hidden; background:radial-gradient(circle at 78% -12%,rgba(20,128,255,.27),transparent 31rem),linear-gradient(145deg,#031027 0%,#061b39 52%,#020d20 100%); color:var(--ink); font-size:16px; line-height:1.5; }
body::before { position:fixed; z-index:-2; inset:0; content:""; pointer-events:none; background-image:linear-gradient(rgba(123,191,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(123,191,255,.035) 1px,transparent 1px); background-size:58px 58px; } a { color:inherit; text-decoration:none; }
.page-glow { position:fixed; z-index:-1; right:-14rem; bottom:-14rem; width:34rem; height:34rem; border-radius:50%; background:#006ff0; filter:blur(115px); opacity:.2; pointer-events:none; }
.site-header,main,.site-footer { width:min(980px,calc(100% - 48px)); margin:0 auto; }.site-header { display:flex; align-items:center; justify-content:space-between; min-height:86px; }.brand { display:inline-flex; align-items:center; gap:.65rem; font-size:1.05rem; font-weight:830; letter-spacing:-.035em; }.brand-mark { display:grid; width:2rem; height:2rem; place-items:center; border:1px solid rgba(173,222,255,.6); border-radius:.64rem; background:linear-gradient(145deg,#39a9ff,#0860ca); box-shadow:0 0 20px rgba(38,147,255,.45); color:#fff; font-size:1.2rem; font-style:italic; }.discord-link { padding:.55rem .8rem; border:1px solid rgba(116,188,255,.35); border-radius:.65rem; background:rgba(21,103,190,.15); color:#dbf0ff; font-size:.83rem; font-weight:760; transition:background 160ms ease,border-color 160ms ease; }.discord-link:hover { border-color:#69baff; background:rgba(21,127,229,.28); }
.hero { max-width:620px; padding:clamp(3.4rem,7vw,5.4rem) 0 2.6rem; }.eyebrow,.overline { display:flex; align-items:center; gap:.5rem; margin:0 0 .75rem; color:var(--blue-light); font-size:.7rem; font-weight:840; letter-spacing:.13em; text-transform:uppercase; }.eyebrow span { width:.44rem; height:.44rem; border-radius:50%; background:#58b5ff; box-shadow:0 0 11px #58b5ff; }h1,h2,h3,p { margin-top:0; }h1,h2 { letter-spacing:-.06em; }h1 { margin-bottom:.85rem; font-size:clamp(3rem,6.5vw,5.15rem); line-height:.96; }h1 em { color:#6ac1ff; font-style:normal; text-shadow:0 0 28px rgba(72,173,255,.28); }.hero>p:last-child { max-width:500px; margin:0; color:var(--muted); font-size:1.03rem; }
.tool-card { display:block; max-width:680px; margin:0 auto; overflow:hidden; border:1px solid var(--line); border-radius:1.4rem; background:linear-gradient(135deg,rgba(9,36,74,.94),rgba(3,20,46,.97)); box-shadow:0 28px 65px rgba(0,5,18,.37),inset 0 1px 0 rgba(255,255,255,.05); }.tool-visual { position:relative; min-height:345px; overflow:hidden; border-bottom:1px solid var(--line); background:#082553; }.tool-visual::after { position:absolute; inset:0; content:""; background:linear-gradient(180deg,rgba(1,16,42,.02),rgba(3,18,45,.68)); pointer-events:none; }.tool-visual img { display:block; width:100%; height:100%; object-fit:cover; transition:transform 220ms ease; }.tool-card:hover .tool-visual img { transform:scale(1.03); }.tag,.ready,.game-tag,.trending { position:absolute; z-index:1; display:inline-flex; align-items:center; border:1px solid rgba(190,228,255,.34); border-radius:999px; background:rgba(5,34,78,.9); box-shadow:0 5px 14px rgba(0,0,0,.24); color:#e9f7ff; font-size:.69rem; font-weight:790; }.tag { top:1rem; right:1rem; padding:.38rem .62rem; }.game-tag { top:1rem; left:1rem; padding:.38rem .62rem; }.trending { bottom:1rem; left:1rem; padding:.38rem .62rem; }.ready { right:1rem; bottom:1rem; gap:.35rem; padding:.38rem .62rem; background:#0a9b5d; border-color:rgba(180,255,214,.35); color:#fff; }.ready i { width:.38rem; height:.38rem; border-radius:50%; background:#c4ffe1; box-shadow:0 0 8px rgba(196,255,225,.9); }
.tool-content { display:flex; flex-direction:column; padding:clamp(1.4rem,3.5vw,2.25rem); }.tool-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:1rem; }.overline { margin-bottom:.25rem; color:#6abfff; font-size:.64rem; }h2 { margin:0; font-size:clamp(2rem,4vw,3rem); line-height:1; }.file-size { margin-top:.15rem; padding:.34rem .55rem; border:1px solid rgba(121,192,255,.25); border-radius:.52rem; color:#b8dcf6; font-size:.7rem; font-weight:750; white-space:nowrap; }.tool-description { margin:1rem 0 1.2rem; color:var(--muted); font-size:.92rem; }.metadata { display:flex; flex-wrap:wrap; gap:.7rem 1.15rem; margin:0; }.metadata div { display:flex; gap:.32rem; }.metadata dt { color:var(--soft); font-size:.7rem; }.metadata dd { margin:0; color:#dceeff; font-size:.7rem; font-weight:760; }
.download-box { margin-top:auto; padding-top:1.45rem; }.download-copy { padding:.9rem 1rem; border:1px solid rgba(103,180,255,.2); border-radius:.85rem .85rem 0 0; background:rgba(1,14,35,.35); }.download-line { display:flex; align-items:baseline; justify-content:space-between; gap:1rem; }.download-line h3 { margin:0; color:#e5f4ff; font-size:.77rem; font-weight:790; }.download-line strong { color:#77c7ff; font-size:.76rem; }.progress-track { height:.42rem; overflow:hidden; margin:.62rem 0 .48rem; border:1px solid rgba(165,215,255,.18); border-radius:999px; background:rgba(0,8,25,.72); }.progress-track span { display:block; width:0; height:100%; border-radius:inherit; background:linear-gradient(90deg,#177ae5,#6ec7ff); box-shadow:0 0 14px rgba(65,176,255,.65); transition:width 220ms ease; }.download-copy p { margin:0; color:var(--soft); font-size:.71rem; }.download-action { display:flex; width:100%; align-items:center; justify-content:center; gap:.5rem; padding:.88rem 1rem; border:1px solid rgba(186,229,255,.32); border-top:0; border-radius:0 0 .85rem .85rem; background:linear-gradient(135deg,#147fe7,#0752bd); box-shadow:0 11px 24px rgba(0,89,196,.25),inset 0 1px 0 rgba(255,255,255,.14); color:#fff; cursor:pointer; font:inherit; font-size:.82rem; font-weight:830; transition:filter 160ms ease,transform 160ms ease; }.download-action:hover { filter:brightness(1.13); transform:translateY(1px); }.button-step { padding:.14rem .38rem; border-radius:.34rem; background:rgba(2,39,101,.45); color:#eaf8ff; font-size:.66rem; }.download-action b { font-size:1rem; line-height:1; }
.site-footer { display:flex; align-items:center; justify-content:space-between; padding:2rem 0; color:var(--soft); font-size:.73rem; }:focus-visible { outline:3px solid #74c9ff; outline-offset:4px; }
@media (max-width:700px) { .site-header,main,.site-footer { width:min(100% - 32px,980px); }.site-header { min-height:74px; }.hero { padding:3.1rem 0 2.2rem; }h1 { font-size:clamp(2.7rem,13vw,4.3rem); }.tool-visual { min-height:235px; }.tool-content { padding:1.35rem; }.download-box { margin-top:1.6rem; } }
@media (max-width:420px) { .discord-link { padding:.5rem .62rem; font-size:.76rem; }.hero>p:last-child { font-size:.94rem; }.site-footer { gap:.5rem; flex-direction:column; align-items:flex-start; } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; }*,*::before,*::after { transition-duration:.01ms !important; } }