:root{
    --bg: #0b0f17;
    --bg2:#0a1220;
    --panel: rgba(255,255,255,.04);
    --panel2: rgba(255,255,255,.03);
    --line: rgba(255,255,255,.10);

    --text:#e9f0ff;
    --muted:#aeb9cf;

    --a1:#3cffb9;
    --a2:#7b61ff;
    --a3:#ff4fd8;

    --radius: 16px;
    --shadow: 0 22px 80px rgba(0,0,0,.45);

    --sans: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial;
    --mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono","Courier New", monospace;
}

*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
@media (prefers-reduced-motion: reduce){
    html{ scroll-behavior:auto; }
    *{ animation:none !important; transition:none !important; }
}

body.rg_body{
    margin:0;
    font-family: var(--sans);
    color: var(--text);
    background:
            radial-gradient(900px 600px at 20% 10%, rgba(60,255,185,.10), transparent 60%),
            radial-gradient(900px 600px at 80% 20%, rgba(123,97,255,.10), transparent 62%),
            linear-gradient(180deg, var(--bg), var(--bg2));
    min-height:100vh;
    overflow-x:hidden;
}

/* subtle “web3 grid” */
body.rg_body::before{
    content:"";
    position:fixed;
    inset:0;
    pointer-events:none;
    background:
            linear-gradient(to right, rgba(255,255,255,.05) 1px, transparent 1px),
            linear-gradient(to bottom, rgba(255,255,255,.04) 1px, transparent 1px);
    background-size: 56px 56px;
    opacity:.08;
    mask-image: radial-gradient(circle at 20% 20%, black 20%, transparent 70%);
}

.rg_wrap{
    width: min(1120px, calc(100% - 32px));
    margin: 0 auto;
}

.rg_skip{
    position:absolute;
    left:-999px;
    top:12px;
    padding:10px 12px;
    border-radius: 12px;
    background: rgba(0,0,0,.45);
    border:1px solid var(--line);
    color: var(--text);
    z-index:9999;
}
.rg_skip:focus{ left:12px; }

.rg_head{
    position: sticky;
    top:0;
    z-index:1000;
    background: rgba(11,15,23,.74);
    backdrop-filter: blur(10px);
    border-bottom: 1px solid rgba(255,255,255,.10);
}
.rg_head__row{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap: 16px;
    padding: 14px 0;
}

.rg_brand{
    display:flex;
    align-items:center;
    gap: 12px;
    min-width: 0;
}
.rg_mark{
    width: 14px;
    height: 14px;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--a1), var(--a2), var(--a3));
    box-shadow: 0 0 0 1px rgba(255,255,255,.10) inset;
}
.rg_brand__name{
    font-weight: 800;
    letter-spacing: .14em;
    text-transform: uppercase;
    font-size: 13px;
}
.rg_brand__sub{
    font-size: 12px;
    color: rgba(174,185,207,.92);
    margin-top: 2px;
}

.rg_nav{
    display:flex;
    gap: 10px;
    flex-wrap:wrap;
    justify-content:flex-end;
}
.rg_nav__a{
    text-decoration:none;
    color: rgba(233,240,255,.92);
    font-size: 13px;
    padding: 10px 10px;
    border-radius: 12px;
    border: 1px solid transparent;
    transition: transform .18s ease, border-color .18s ease, background .18s ease;
}
.rg_nav__a:hover{
    transform: translateY(-1px);
    border-color: rgba(255,255,255,.12);
    background: rgba(255,255,255,.04);
}

.rg_main{ padding: 22px 0 70px; }

.rg_section{
    margin: 18px 0;
    padding: 22px;
    border-radius: calc(var(--radius) + 6px);
    border: 1px solid rgba(255,255,255,.10);
    background: linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02));
    box-shadow: var(--shadow);
    position:relative;
    overflow:hidden;
    scroll-margin-top: 84px;
}

/* Section top accent line (web3 touch, but still official) */
.rg_section::before{
    content:"";
    position:absolute;
    left:0; right:0; top:0;
    height: 2px;
    background: linear-gradient(90deg, var(--a1), var(--a2), var(--a3));
    opacity:.55;
}

.rg_section:target{
    border-color: rgba(60,255,185,.22);
    box-shadow: 0 0 0 1px rgba(123,97,255,.12) inset, var(--shadow);
}

.rg_section--hero{
    padding: 26px 22px;
}

.rg_hdr{ margin-bottom: 14px; }
.rg_kicker{
    margin:0 0 10px;
    font-family: var(--mono);
    letter-spacing:.16em;
    text-transform: uppercase;
    font-size: 12px;
    color: rgba(174,185,207,.92);
}
.rg_h1{
    margin: 0 0 12px;
    font-size: clamp(30px, 4vw, 46px);
    letter-spacing:.01em;
    line-height: 1.12;
}
.rg_h1__sub{
    display:block;
    margin-top: 8px;
    font-size: 14px;
    color: rgba(174,185,207,.92);
    font-weight: 500;
}
.rg_lead{
    margin:0 0 16px;
    color: rgba(233,240,255,.86);
    line-height: 1.75;
    font-size: 15px;
}
.rg_h2{
    margin: 0 0 8px;
    font-size: 20px;
}
.rg_h3{
    margin: 0 0 10px;
    font-size: 13px;
    letter-spacing:.12em;
    text-transform: uppercase;
    font-family: var(--mono);
    color: rgba(233,240,255,.92);
}
.rg_sub{
    margin:0;
    color: rgba(174,185,207,.92);
    line-height: 1.7;
}

.rg_hero{
    display:grid;
    grid-template-columns: 1.2fr .8fr;
    gap: 16px;
    align-items:start;
}
@media (max-width: 980px){
    .rg_hero{ grid-template-columns: 1fr; }
}

.rg_cta{
    display:flex;
    gap: 10px;
    flex-wrap:wrap;
    margin: 14px 0 14px;
}
.rg_btn{
    position:relative;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    padding: 12px 14px;
    border-radius: 14px;
    border: 1px solid rgba(255,255,255,.12);
    text-decoration:none;
    color: rgba(233,240,255,.92);
    background: rgba(255,255,255,.03);
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease, background .18s ease;
    overflow:hidden;
}
.rg_btn:hover{
    transform: translateY(-2px);
    border-color: rgba(255,255,255,.18);
    box-shadow: 0 18px 60px rgba(0,0,0,.35);
}
.rg_btn__glow{
    position:absolute;
    inset:-60%;
    background: conic-gradient(from 180deg, rgba(60,255,185,.0), rgba(60,255,185,.18), rgba(123,97,255,.14), rgba(255,79,216,.12), rgba(60,255,185,.0));
    filter: blur(18px);
    opacity:.32;
    animation: rg_spin 8s linear infinite;
    pointer-events:none;
}
@keyframes rg_spin{ to{ transform: rotate(360deg); } }

.rg_btn--primary{
    border-color: rgba(60,255,185,.22);
    background: linear-gradient(90deg, rgba(60,255,185,.14), rgba(123,97,255,.10));
}
.rg_btn--ghost{
    border-color: rgba(255,255,255,.12);
    background: rgba(0,0,0,.12);
}

.rg_meta{
    display:grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
    margin-top: 10px;
}
@media (max-width: 980px){
    .rg_meta{ grid-template-columns: 1fr; }
}
.rg_meta__item{
    border-radius: 14px;
    padding: 12px;
    border: 1px solid rgba(255,255,255,.10);
    background: rgba(0,0,0,.10);
}
.rg_meta__k{
    font-family: var(--mono);
    font-size: 11px;
    letter-spacing:.12em;
    text-transform: uppercase;
    color: rgba(174,185,207,.92);
}
.rg_meta__v{
    margin-top: 6px;
    color: rgba(233,240,255,.92);
}

.rg_card{
    border-radius: 16px;
    padding: 16px;
    border: 1px solid rgba(255,255,255,.10);
    background: rgba(0,0,0,.12);
}
.rg_card--accent{
    position:relative;
}
.rg_card--accent::before{
    content:"";
    position:absolute;
    inset:-1px;
    border-radius: 16px;
    padding: 1px;
    background: linear-gradient(90deg, rgba(60,255,185,.22), rgba(123,97,255,.16), rgba(255,79,216,.14));
    -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    opacity:.70;
    pointer-events:none;
}

.rg_card__top{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap: 10px;
    margin-bottom: 12px;
}
.rg_card__title{
    font-family: var(--mono);
    letter-spacing:.12em;
    text-transform: uppercase;
    font-size: 12px;
    color: rgba(174,185,207,.92);
}
.rg_pill{
    padding: 7px 10px;
    border-radius: 999px;
    border: 1px solid rgba(60,255,185,.22);
    background: rgba(60,255,185,.08);
    color: rgba(60,255,185,.92);
    font-family: var(--mono);
    font-size: 11px;
    letter-spacing:.10em;
    text-transform: uppercase;
}

.rg_kv{
    display:grid;
    grid-template-columns: 140px 1fr;
    gap: 10px 12px;
}
@media (max-width: 520px){
    .rg_kv{ grid-template-columns: 1fr; }
}
.rg_kv__k{ color: rgba(174,185,207,.92); }
.rg_kv__v{ color: rgba(233,240,255,.92); }

.rg_callout{
    margin-top: 14px;
    padding: 12px;
    border-radius: 14px;
    border: 1px solid rgba(255,255,255,.10);
    background: rgba(255,255,255,.03);
    color: rgba(233,240,255,.86);
    line-height: 1.65;
}

.rg_links{
    display:grid;
    grid-template-columns: 1fr;
    gap: 12px;
    margin-top: 14px;
}
.rg_link{
    border-radius: 16px;
    padding: 16px;
    border: 1px solid rgba(255,255,255,.10);
    background: rgba(0,0,0,.12);
    position:relative;
    word-break: break-all;
}
.rg_link--primary{
    border-color: rgba(60,255,185,.22);
    background: linear-gradient(90deg, rgba(60,255,185,.10), rgba(123,97,255,.06));
}
.rg_link__badge{
    font-family: var(--mono);
    font-size: 11px;
    letter-spacing:.12em;
    text-transform: uppercase;
    color: rgba(233,240,255,.92);
    background: rgba(255,255,255,.06);
    border: 1px solid rgba(255,255,255,.10);
    display:inline-block;
    padding: 7px 10px;
    border-radius: 999px;
}
.rg_link__badge--soft{
    color: rgba(174,185,207,.92);
}
.rg_link__name{
    margin-top: 10px;
    font-size: 16px;
    font-weight: 700;
}
.rg_link__url{
    margin-top: 8px;
    font-family: var(--mono);
    font-size: 13px;
}
.rg_link__note{
    margin-top: 10px;
    color: rgba(174,185,207,.92);
    line-height: 1.65;
}

.rg_grid{
    display:grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    margin-top: 14px;
}
.rg_grid--2{ grid-template-columns: 1fr 1fr; }
@media (max-width: 980px){
    .rg_grid{ grid-template-columns: 1fr; }
}
.rg_card--wide{
    grid-column: 1 / -1;
}
@media (max-width: 980px){
    .rg_card--wide{ grid-column: auto; }
    .rg_pre{
        max-width: 350px;
    }

}
.rg_field{
    display:flex;
    gap: 10px;
    align-items:center;
    padding: 12px;
    border-radius: 14px;
    border: 1px solid rgba(255,255,255,.10);
    background: rgba(255,255,255,.03);
    margin: 10px 0 0;
    word-break: break-all;
}
.rg_field__k{
    font-family: var(--mono);
    font-size: 11px;
    letter-spacing:.12em;
    text-transform: uppercase;
    color: rgba(174,185,207,.92);
    min-width: 110px;
}
.rg_field__v{ color: rgba(233,240,255,.92); }

.rg_pre{
    margin: 10px 0 0;
    padding: 14px;
    border-radius: 14px;
    border: 1px solid rgba(255,255,255,.10);
    background: rgba(0,0,0,.16);
    overflow:auto;
    font-family: var(--mono);
    font-size: 12px;
    line-height: 1.6;
}

.rg_faq{
    display:grid;
    gap: 10px;
    margin-top: 14px;
}
.rg_q{
    border-radius: 16px;
    border: 1px solid rgba(255,255,255,.10);
    background: rgba(0,0,0,.12);
    overflow:hidden;
}
.rg_q__s{
    cursor:pointer;
    padding: 14px;
    list-style:none;
    font-family: var(--mono);
    font-size: 12px;
    letter-spacing:.10em;
    text-transform: uppercase;
    color: rgba(233,240,255,.92);
}
.rg_q__s::-webkit-details-marker{ display:none; }
.rg_q[open] .rg_q__s{
    background: rgba(255,255,255,.03);
    border-bottom: 1px solid rgba(255,255,255,.10);
}
.rg_q__a{
    padding: 14px;
    color: rgba(233,240,255,.86);
    line-height: 1.7;
}

.rg_note{
    margin-top: 14px;
    padding: 12px 14px;
    border-radius: 14px;
    border: 1px dashed rgba(60,255,185,.22);
    background: rgba(60,255,185,.05);
    color: rgba(233,240,255,.86);
}

.rg_p{ margin: 10px 0 0; line-height:1.7; color: rgba(233,240,255,.86); }
.rg_muted{ color: rgba(174,185,207,.92); }

.rg_a{
    color: rgba(233,240,255,.92);
    text-decoration:none;
    border-bottom: 1px dashed rgba(60,255,185,.25);
}
.rg_a:hover{
    border-bottom-color: rgba(123,97,255,.40);
}

code{
    font-family: var(--mono);
    color: rgba(60,255,185,.92);
}

/* footer */
.rg_foot{
    margin-top: 16px;
    padding-top: 14px;
    border-top: 1px solid rgba(255,255,255,.10);
    display:flex;
    justify-content:space-between;
    gap: 12px;
    flex-wrap:wrap;
}
.rg_foot__brand{
    font-weight: 800;
    letter-spacing: .14em;
    text-transform: uppercase;
}
.rg_foot__muted{
    margin-top: 4px;
    color: rgba(174,185,207,.92);
    font-family: var(--mono);
    font-size: 12px;
    line-height: 1.6;
}
.rg_top{
    display:inline-block;
    margin-top: 6px;
    color: rgba(233,240,255,.92);
    text-decoration:none;
    border-bottom: 1px dashed rgba(60,255,185,.25);
    font-family: var(--mono);
    letter-spacing:.10em;
    text-transform: uppercase;
    font-size: 12px;
}
.rg_top:hover{ border-bottom-color: rgba(123,97,255,.40); }

.rg_sr{
    position:absolute !important;
    width:1px;height:1px;
    padding:0;margin:-1px;
    overflow:hidden;clip:rect(0,0,0,0);
    white-space:nowrap;border:0;
}