/* ======================================================
   BULLFROG — THE POND V3
====================================================== */

:root{
    --pond-lime:#c8ff4d;
    --pond-green:#6dff9b;
    --pond-aqua:#59ead5;
    --pond-gold:#e8c76c;
    --pond-text:#f5fff7;
    --pond-muted:#819288;
    --pond-line:rgba(194,255,105,.13);
    --pond-line2:rgba(255,255,255,.055);
}

body.pond-v3-loaded{
    background:#010604 !important;
}

body.pond-v3-loaded:before{

    content:"";

    position:fixed;

    inset:0;

    z-index:-30;

    pointer-events:none;

    background:

        radial-gradient(
            circle at 72% 12%,
            rgba(189,255,75,.09),
            transparent 29%
        ),

        radial-gradient(
            circle at 18% 76%,
            rgba(76,236,203,.055),
            transparent 34%
        ),

        linear-gradient(
            180deg,
            rgba(1,8,5,.18),
            rgba(1,5,3,.88) 72%,
            #010403
        );

}

/* ======================================================
   CINEMATIC HERO
====================================================== */

.pond-v3-hero{

    width:
        min(
            1320px,
            calc(100% - 28px)
        );

    min-height:
        min(
            720px,
            calc(100vh - 105px)
        );

    margin:
        112px auto 14px;

    position:relative;

    overflow:hidden;

    display:flex;

    align-items:flex-end;

    border-radius:34px;

    border:
        1px solid
        rgba(194,255,105,.15);

    background:#031008;

    box-shadow:

        inset 0 1px 0
        rgba(255,255,255,.06),

        0 50px 140px
        rgba(0,0,0,.52);

}

.pond-v3-hero-bg{

    position:absolute;

    inset:0;

    background-size:cover;

    background-position:center;

    transform:scale(1.015);

}

.pond-v3-hero-bg:after{

    content:"";

    position:absolute;

    inset:0;

    background:

        linear-gradient(
            180deg,
            rgba(0,0,0,.06),
            rgba(0,0,0,.12) 34%,
            rgba(1,6,4,.81) 82%,
            rgba(1,5,3,.96)
        ),

        radial-gradient(
            circle at 72% 38%,
            rgba(200,255,77,.09),
            transparent 31%
        );

}

.pond-v3-hero-grid{

    position:relative;

    z-index:2;

    width:100%;

    display:grid;

    grid-template-columns:
        1.08fr
        .92fr;

    gap:24px;

    align-items:end;

    padding:
        clamp(
            28px,
            5vw,
            62px
        );

}

.pond-v3-kicker{

    color:var(--pond-lime);

    font-size:9px;

    font-weight:950;

    letter-spacing:.20em;

}

.pond-v3-title{

    margin:
        15px 0
        17px;

    color:#fff;

    font-size:
        clamp(
            68px,
            9vw,
            124px
        );

    line-height:.77;

    letter-spacing:-.085em;

}

.pond-v3-title span{
    color:var(--pond-lime);
}

.pond-v3-copy{

    max-width:700px;

    margin:0;

    color:#a5b7ac;

    font-size:
        clamp(
            14px,
            1.45vw,
            17px
        );

    line-height:1.7;

}

.pond-v3-actions{

    display:flex;

    flex-wrap:wrap;

    gap:8px;

    margin-top:25px;

}

.pond-v3-action{

    min-height:52px;

    display:inline-flex;

    align-items:center;

    justify-content:center;

    padding:
        0 18px;

    border-radius:14px;

    text-decoration:none;

    border:
        1px solid
        rgba(200,255,77,.14);

    color:#fff;

    background:
        rgba(2,12,7,.48);

    backdrop-filter:blur(14px);

    font-size:9px;

    font-weight:950;

    letter-spacing:.10em;

    cursor:pointer;

}

.pond-v3-action.primary{

    color:#041006;

    border:0;

    background:

        linear-gradient(
            135deg,
            var(--pond-lime),
            var(--pond-green)
        );

}

/* ======================================================
   IDENTITY TERMINAL
====================================================== */

.pond-v3-terminal{

    padding:20px;

    border-radius:22px;

    border:
        1px solid
        rgba(255,255,255,.07);

    background:
        rgba(1,12,7,.58);

    backdrop-filter:
        blur(28px)
        saturate(145%);

    -webkit-backdrop-filter:
        blur(28px)
        saturate(145%);

}

.pond-v3-terminal-head{

    display:flex;

    align-items:center;

    justify-content:space-between;

    gap:12px;

}

.pond-v3-terminal-head span{

    color:#809288;

    font-size:8px;

    font-weight:950;

    letter-spacing:.14em;

}

.pond-v3-terminal-head strong{

    color:var(--pond-lime);

    font-size:8px;

    letter-spacing:.10em;

}

.pond-v3-identity{

    position:relative;

    min-height:210px;

    display:flex;

    align-items:center;

    justify-content:center;

    margin:
        12px 0;

}

.pond-v3-identity:before{

    content:"";

    position:absolute;

    width:180px;
    height:180px;

    border-radius:50%;

    background:
        rgba(185,255,77,.12);

    filter:
        blur(46px);

}

.pond-v3-identity img{

    position:relative;

    z-index:2;

    width:min(72%,210px);

    max-height:205px;

    object-fit:contain;

    filter:

        drop-shadow(
            0 0 24px
            rgba(189,255,75,.30)
        )

        drop-shadow(
            0 0 70px
            rgba(66,255,205,.11)
        );

    animation:
        pondV3Float
        5s ease-in-out
        infinite;

}

@keyframes pondV3Float{

    50%{
        transform:
            translateY(-7px)
            scale(1.015);
    }

}

.pond-v3-terminal-grid{

    display:grid;

    grid-template-columns:
        repeat(2,1fr);

    gap:7px;

}

.pond-v3-stat{

    padding:13px;

    border-radius:13px;

    border:
        1px solid
        rgba(255,255,255,.055);

    background:
        rgba(255,255,255,.022);

}

.pond-v3-stat span{

    display:block;

    color:#73857a;

    font-size:7px;

    font-weight:950;

    letter-spacing:.12em;

}

.pond-v3-stat strong{

    display:block;

    margin-top:6px;

    font-size:10px;

}

/* ======================================================
   COMMAND DECK
====================================================== */

.pond-v3-command{

    width:
        min(
            1320px,
            calc(100% - 28px)
        );

    margin:
        0 auto 16px;

    padding:
        clamp(
            22px,
            4vw,
            38px
        );

    border-radius:30px;

    border:
        1px solid
        var(--pond-line);

    background:
        rgba(2,13,8,.76);

    backdrop-filter:
        blur(26px)
        saturate(140%);

}

.pond-v3-command-head{

    display:flex;

    justify-content:space-between;

    align-items:end;

    gap:20px;

    margin-bottom:20px;

}

.pond-v3-command-head span{

    color:var(--pond-lime);

    font-size:8px;

    font-weight:950;

    letter-spacing:.17em;

}

.pond-v3-command-head h2{

    margin:
        6px 0 0;

    color:#fff;

    font-size:
        clamp(
            38px,
            5vw,
            66px
        );

    letter-spacing:-.06em;

}

.pond-v3-command-head p{

    max-width:520px;

    margin:0;

    color:#7f9387;

    font-size:11px;

    line-height:1.6;

}

.pond-v3-grid{

    display:grid;

    grid-template-columns:
        repeat(4,1fr);

    gap:8px;

}

.pond-v3-product{

    position:relative;

    min-height:230px;

    overflow:hidden;

    display:flex;

    flex-direction:column;

    justify-content:flex-end;

    padding:18px;

    border-radius:18px;

    text-decoration:none;

    border:
        1px solid
        rgba(255,255,255,.06);

    background:

        radial-gradient(
            circle at 82% 12%,
            rgba(194,255,75,.07),
            transparent 34%
        ),

        rgba(255,255,255,.018);

    transition:
        transform .18s ease,
        border-color .18s ease,
        background .18s ease;

}

.pond-v3-product:hover{

    transform:
        translateY(-4px);

    border-color:
        rgba(200,255,77,.25);

    background:

        radial-gradient(
            circle at 82% 12%,
            rgba(194,255,75,.13),
            transparent 38%
        ),

        rgba(255,255,255,.028);

}

.pond-v3-product-index{

    position:absolute;

    top:5px;
    right:13px;

    color:
        rgba(255,255,255,.045);

    font-size:66px;

    font-weight:950;

}

.pond-v3-product-tag{

    color:var(--pond-lime);

    font-size:7px;

    font-weight:950;

    letter-spacing:.14em;

}

.pond-v3-product h3{

    margin:
        7px 0
        6px;

    color:#fff;

    font-size:22px;

    letter-spacing:-.035em;

}

.pond-v3-product p{

    margin:0;

    color:#7f9186;

    font-size:10px;

    line-height:1.55;

}

.pond-v3-product-link{

    display:flex;

    justify-content:space-between;

    align-items:center;

    margin-top:16px;

    padding-top:12px;

    border-top:
        1px solid
        rgba(255,255,255,.055);

    color:var(--pond-lime);

    font-size:8px;

    font-weight:950;

}

/* ======================================================
   STATUS WALL
====================================================== */

.pond-v3-status-wall{

    width:
        min(
            1320px,
            calc(100% - 28px)
        );

    margin:
        0 auto 18px;

    display:grid;

    grid-template-columns:
        repeat(5,1fr);

    gap:8px;

}

.pond-v3-health{

    padding:16px;

    border-radius:16px;

    border:
        1px solid
        var(--pond-line2);

    background:
        rgba(3,14,9,.76);

}

.pond-v3-health span{

    display:block;

    color:#718278;

    font-size:7px;

    font-weight:950;

    letter-spacing:.12em;

}

.pond-v3-health strong{

    display:block;

    margin-top:7px;

    color:#fff;

    font-size:10px;

}

.pond-v3-health strong.good{
    color:var(--pond-lime);
}

.pond-v3-health strong.wait{
    color:#a5b1a9;
}

/* ======================================================
   ORIGINAL POND UI PREMIUM OVERRIDES
====================================================== */

body.pond-v3-loaded
.glass,

body.pond-v3-loaded
.card,

body.pond-v3-loaded
.panel,

body.pond-v3-loaded
.section{

    border-color:
        rgba(194,255,105,.11) !important;

}

body.pond-v3-loaded
button{

    border-radius:13px !important;

    transition:
        transform .17s ease,
        border-color .17s ease,
        box-shadow .17s ease;

}

body.pond-v3-loaded
button:hover:not(:disabled){

    transform:
        translateY(-1px);

    box-shadow:
        0 12px 35px
        rgba(0,0,0,.22);

}

#connectWallet{

    border:0 !important;

    color:#041006 !important;

    background:

        linear-gradient(
            135deg,
            var(--pond-lime),
            var(--pond-green)
        ) !important;

}

/* ======================================================
   MOBILE
====================================================== */

@media(max-width:1000px){

    .pond-v3-hero-grid{

        grid-template-columns:1fr;

    }

    .pond-v3-grid{

        grid-template-columns:
            repeat(2,1fr);

    }

    .pond-v3-status-wall{

        grid-template-columns:
            repeat(2,1fr);

    }

}

@media(max-width:650px){

    .pond-v3-hero,
    .pond-v3-command,
    .pond-v3-status-wall{

        width:
            calc(100% - 18px);

    }

    .pond-v3-hero{

        margin-top:95px;

    }

    .pond-v3-title{

        font-size:
            clamp(
                58px,
                20vw,
                88px
            );

    }

    .pond-v3-grid,
    .pond-v3-status-wall,
    .pond-v3-terminal-grid{

        grid-template-columns:1fr;

    }

    .pond-v3-command-head{

        align-items:flex-start;

        flex-direction:column;

    }

}

/* BULLFROG FINAL V3 TOP SPACING NORMALIZER START */

/* ======================================================
   POND — FINAL HERO SPACING NORMALIZATION

   This intentionally overrides every earlier experimental
   spacing patch on this page.

   Goal:
   - hero close to header
   - hero content starts near top
   - no giant empty vertical dead zone
   - retain enough breathing room for premium layout
====================================================== */

/* ------------------------------------------------------
   PAGE WRAPPER
------------------------------------------------------ */

body main {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

body main > :first-child {
    margin-top: 0 !important;
}


/* ------------------------------------------------------
   MAJOR V3 HERO CONTAINERS
------------------------------------------------------ */

body :is(
    .pond-v3-hero,
    .pond-v3-world,
    .pond-v3-stage,
    .pond-v3-shell,
    .pond-v3-arena,
    .pond-v3-command,
    .pond-v3-terminal,
    .pond-v3-championship
) {
    margin-top: 10px !important;

    padding-top: 22px !important;
    padding-bottom: 28px !important;

    min-height: 0 !important;
    height: auto !important;

    align-items: start !important;
    align-content: start !important;

    justify-items: stretch;
}


/* ------------------------------------------------------
   DIRECT HERO CONTENT
------------------------------------------------------ */

body :is(
    .pond-v3-hero,
    .pond-v3-world,
    .pond-v3-stage,
    .pond-v3-shell,
    .pond-v3-arena
) > * {
    margin-top: 0 !important;

    align-self: start !important;
}


/* ------------------------------------------------------
   COMMON INNER V3 WRAPPERS
------------------------------------------------------ */

body :is(
    .pond-v3-hero-inner,
    .pond-v3-inner,
    .pond-v3-container,
    .pond-v3-grid,
    .pond-v3-hero-grid,
    .pond-v3-layout,
    .pond-v3-content,
    .pond-v3-stage-inner,
    .pond-v3-command-grid,
    .pond-v3-terminal-grid
) {
    margin-top: 0 !important;
    padding-top: 0 !important;

    min-height: 0 !important;
    height: auto !important;

    align-items: start !important;
    align-content: start !important;
}


/* ------------------------------------------------------
   LEFT-SIDE HERO COPY
------------------------------------------------------ */

body :is(
    .pond-v3-copy,
    .pond-v3-hero-copy,
    .pond-v3-intro,
    .pond-v3-left,
    .pond-v3-content-left
) {
    margin-top: 0 !important;
    padding-top: 0 !important;

    align-self: start !important;

    transform: none !important;
}


/* ------------------------------------------------------
   RIGHT-SIDE HERO PANEL
------------------------------------------------------ */

body :is(
    .pond-v3-right,
    .pond-v3-core,
    .pond-v3-panel,
    .pond-v3-vault,
    .pond-v3-radar,
    .pond-v3-telemetry,
    .pond-v3-terminal,
    .pond-v3-identity,
    .pond-v3-trophy
) {
    margin-top: 0 !important;

    align-self: start !important;

    transform: none !important;
}


/* ------------------------------------------------------
   HEADER TO FIRST PRODUCT AREA
------------------------------------------------------ */

header + main,
header + section,
header + div {
    margin-top: 10px !important;
}


/* ------------------------------------------------------
   PREVENT OLD HUGE HERO MIN-HEIGHTS
------------------------------------------------------ */

body [class*="pond-v3-hero"] {
    min-height: 0 !important;
}

body [class*="pond-v3-world"] {
    min-height: 0 !important;
}

body [class*="pond-v3-stage"] {
    min-height: 0 !important;
}


/* ------------------------------------------------------
   IMPORTANT:
   Hero cards should size from their actual content,
   not viewport height.
------------------------------------------------------ */

body :is(
    .pond-v3-hero,
    .pond-v3-world,
    .pond-v3-stage,
    .pond-v3-arena,
    .pond-v3-shell
) {
    max-height: none !important;
}


/* ------------------------------------------------------
   TABLET
------------------------------------------------------ */

@media(max-width: 1000px) {

    body :is(
        .pond-v3-hero,
        .pond-v3-world,
        .pond-v3-stage,
        .pond-v3-shell,
        .pond-v3-arena
    ) {
        margin-top: 8px !important;

        padding-top: 18px !important;
        padding-bottom: 24px !important;

        min-height: 0 !important;
    }

}


/* ------------------------------------------------------
   MOBILE
------------------------------------------------------ */

@media(max-width: 650px) {

    body main {
        margin-top: 0 !important;
        padding-top: 0 !important;
    }

    body :is(
        .pond-v3-hero,
        .pond-v3-world,
        .pond-v3-stage,
        .pond-v3-shell,
        .pond-v3-arena
    ) {
        margin-top: 6px !important;

        padding-top: 14px !important;
        padding-bottom: 20px !important;

        min-height: 0 !important;
        height: auto !important;
    }

    body :is(
        .pond-v3-copy,
        .pond-v3-hero-copy,
        .pond-v3-intro,
        .pond-v3-left,
        .pond-v3-right,
        .pond-v3-core,
        .pond-v3-panel,
        .pond-v3-vault,
        .pond-v3-radar,
        .pond-v3-telemetry,
        .pond-v3-terminal
    ) {
        transform: none !important;
    }

}

/* BULLFROG FINAL V3 TOP SPACING NORMALIZER END */

/* BULLFROG FINAL TINY HEADER GAP START */

/* ======================================================
   POND — FINAL TINY HEADER GAP
====================================================== */

/*
 * Previous cleanup removed excessive dead space.
 * This restores only a small intentional separation
 * so hero cards do not visually collide with header.
 */

body :is(
    .pond-v3-hero,
    .pond-v3-world,
    .pond-v3-stage,
    .pond-v3-shell,
    .pond-v3-arena,
    .pond-v3-command,
    .pond-v3-terminal,
    .pond-v3-championship
) {
    margin-top: 16px !important;
}

/* Direct first content after header */

header + main,
header + section,
header + div {
    margin-top: 16px !important;
}

/* Tablet */

@media(max-width:1000px) {

    body :is(
        .pond-v3-hero,
        .pond-v3-world,
        .pond-v3-stage,
        .pond-v3-shell,
        .pond-v3-arena
    ) {
        margin-top: 12px !important;
    }

    header + main,
    header + section,
    header + div {
        margin-top: 12px !important;
    }

}

/* Mobile */

@media(max-width:650px) {

    body :is(
        .pond-v3-hero,
        .pond-v3-world,
        .pond-v3-stage,
        .pond-v3-shell,
        .pond-v3-arena
    ) {
        margin-top: 10px !important;
    }

    header + main,
    header + section,
    header + div {
        margin-top: 10px !important;
    }

}

/* BULLFROG FINAL TINY HEADER GAP END */

