/* ======================================================
   BULLFROG — STAKE LAKE V3
   FRONTEND VISUAL LAYER ONLY
====================================================== */

:root{
    --lake-bg:#010504;
    --lake-panel:rgba(4,16,11,.72);
    --lake-panel-2:rgba(7,28,18,.68);

    --lake-text:#f5fff7;
    --lake-muted:#82968a;

    --lake-lime:#c8ff4d;
    --lake-green:#6dff9b;
    --lake-aqua:#58ead4;
    --lake-gold:#e8c76c;

    --lake-line:rgba(194,255,105,.13);
    --lake-line-soft:rgba(255,255,255,.055);
}

/* ======================================================
   AMBIENT WORLD
====================================================== */

body{
    background:
        #010504 !important;
}

body:before{

    content:"";

    position:fixed;

    inset:0;

    z-index:-40;

    pointer-events:none;

    background:

        radial-gradient(
            circle at 70% 8%,
            rgba(189,255,75,.10),
            transparent 28%
        ),

        radial-gradient(
            circle at 14% 72%,
            rgba(59,239,205,.07),
            transparent 33%
        ),

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

}

#lakeV3Particles{

    position:fixed;

    inset:0;

    z-index:-25;

    pointer-events:none;

    background-size:cover;

    background-position:center;

    opacity:.28;

    mix-blend-mode:screen;

}

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

.lake-v3-hero{

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

    min-height:
        min(
            760px,
            calc(100vh - 110px)
        );

    margin:
        112px auto 18px;

    position:relative;

    overflow:hidden;

    display:flex;

    align-items:flex-end;

    border-radius:34px;

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

    box-shadow:

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

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

    background:
        #031008;

}

.lake-v3-hero-bg{

    position:absolute;

    inset:0;

    background-size:cover;

    background-position:center;

    transform:scale(1.02);

}

.lake-v3-hero-bg:after{

    content:"";

    position:absolute;

    inset:0;

    background:

        linear-gradient(
            180deg,
            rgba(0,0,0,.04) 0%,
            rgba(0,0,0,.13) 32%,
            rgba(1,6,4,.80) 82%,
            rgba(1,5,3,.96) 100%
        ),

        radial-gradient(
            circle at 74% 36%,
            rgba(201,255,75,.09),
            transparent 30%
        );

}

.lake-v3-hero-grid{

    position:relative;

    z-index:3;

    width:100%;

    display:grid;

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

    gap:26px;

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

    align-items:end;

}

.lake-v3-kicker{

    color:var(--lake-lime);

    font-size:9px;

    font-weight:950;

    letter-spacing:.20em;

}

.lake-v3-title{

    margin:
        15px 0
        17px;

    max-width:900px;

    color:#fff;

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

    line-height:.77;

    letter-spacing:-.085em;

    text-shadow:
        0 18px 60px
        rgba(0,0,0,.42);

}

.lake-v3-title span{

    color:var(--lake-lime);

}

.lake-v3-copy{

    max-width:700px;

    margin:0;

    color:#a5b7ac;

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

    line-height:1.7;

}

.lake-v3-actions{

    display:flex;

    flex-wrap:wrap;

    gap:8px;

    margin-top:25px;

}

.lake-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;

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

}

.lake-v3-action:hover{

    transform:
        translateY(-2px);

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

}

.lake-v3-action.primary{

    color:#041006;

    border:0;

    background:

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

}

/* ======================================================
   HERO STATUS TERMINAL
====================================================== */

.lake-v3-status{

    padding:20px;

    border-radius:22px;

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

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

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

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

    box-shadow:
        0 30px 80px
        rgba(0,0,0,.30);

}

.lake-v3-status-head{

    display:flex;

    align-items:center;

    justify-content:space-between;

    gap:12px;

}

.lake-v3-status-head span{

    color:#809288;

    font-size:8px;

    font-weight:950;

    letter-spacing:.14em;

}

.lake-v3-status-head strong{

    color:var(--lake-lime);

    font-size:8px;

    letter-spacing:.10em;

}

.lake-v3-orb{

    position:relative;

    min-height:220px;

    display:grid;

    place-items:center;

    margin:12px 0;

}

.lake-v3-orb:before{

    content:"";

    position:absolute;

    width:180px;
    height:180px;

    border-radius:50%;

    background:
        rgba(181,255,75,.12);

    filter:
        blur(48px);

    animation:
        lakeV3Pulse
        3s ease-in-out
        infinite;

}

.lake-v3-orb img{

    position:relative;

    z-index:2;

    width:min(76%,240px);

    max-height:220px;

    object-fit:contain;

    filter:

        drop-shadow(
            0 0 24px
            rgba(187,255,77,.30)
        )

        drop-shadow(
            0 0 70px
            rgba(72,255,206,.11)
        );

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

}

@keyframes lakeV3Pulse{

    50%{
        opacity:.55;
        transform:scale(1.18);
    }

}

@keyframes lakeV3Float{

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

}

.lake-v3-status-grid{

    display:grid;

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

    gap:7px;

}

.lake-v3-stat{

    padding:13px;

    border-radius:13px;

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

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

}

.lake-v3-stat span{

    display:block;

    color:#74867b;

    font-size:7px;

    font-weight:950;

    letter-spacing:.12em;

}

.lake-v3-stat strong{

    display:block;

    margin-top:6px;

    color:#f3fff5;

    font-size:10px;

}

/* ======================================================
   LAKE LOCATIONS
====================================================== */

.lake-v3-world{

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

    margin:
        0 auto 22px;

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

    border-radius:30px;

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

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

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

}

.lake-v3-world-head{

    display:flex;

    align-items:end;

    justify-content:space-between;

    gap:20px;

    margin-bottom:20px;

}

.lake-v3-world-head span{

    color:var(--lake-lime);

    font-size:8px;

    font-weight:950;

    letter-spacing:.17em;

}

.lake-v3-world-head h2{

    margin:
        6px 0 0;

    color:#fff;

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

    line-height:.92;

    letter-spacing:-.06em;

}

.lake-v3-world-head p{

    max-width:520px;

    margin:0;

    color:#7f9387;

    font-size:11px;

    line-height:1.6;

}

.lake-v3-tiers{

    display:grid;

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

    gap:8px;

}

.lake-v3-tier{

    position:relative;

    min-height:360px;

    overflow:hidden;

    display:flex;

    align-items:flex-end;

    padding:18px;

    border-radius:19px;

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

    background:#04110b;

    cursor:pointer;

    transition:
        transform .20s ease,
        border-color .20s ease;

}

.lake-v3-tier:hover{

    transform:
        translateY(-4px);

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

}

.lake-v3-tier-bg{

    position:absolute;

    inset:0;

    background-size:cover;

    background-position:center;

    transition:
        transform .45s ease,
        filter .45s ease;

}

.lake-v3-tier:hover
.lake-v3-tier-bg{

    transform:
        scale(1.04);

}

.lake-v3-tier-bg:after{

    content:"";

    position:absolute;

    inset:0;

    background:

        linear-gradient(
            180deg,
            rgba(0,0,0,.04),
            rgba(0,0,0,.14) 42%,
            rgba(1,7,4,.94)
        );

}

.lake-v3-tier-content{

    position:relative;

    z-index:2;

    width:100%;

}

.lake-v3-tier-index{

    color:var(--lake-lime);

    font-size:8px;

    font-weight:950;

    letter-spacing:.13em;

}

.lake-v3-tier h3{

    margin:
        6px 0
        5px;

    color:#fff;

    font-size:25px;

    letter-spacing:-.04em;

}

.lake-v3-tier p{

    margin:0;

    color:#8da095;

    font-size:10px;

    line-height:1.5;

}

.lake-v3-tier-state{

    display:flex;

    align-items:center;

    justify-content:space-between;

    margin-top:15px;

    padding-top:12px;

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

    color:#c7ff4c;

    font-size:8px;

    font-weight:950;

}

/* ======================================================
   EXISTING LAKE UI — PREMIUM OVERRIDES
====================================================== */

body.lake-v3-loaded
button,

body.lake-v3-loaded
input,

body.lake-v3-loaded
select{

    font-family:
        Inter,
        system-ui,
        sans-serif;

}

body.lake-v3-loaded
button{

    min-height:46px;

    border-radius:13px !important;

    cursor:pointer;

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

}

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

    transform:
        translateY(-1px);

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

}

body.lake-v3-loaded
button:disabled{

    cursor:not-allowed;

    opacity:.48;

}

/* TRANSACTION BUTTONS */

#lakeApproveButton,
#lakeStakeButton{

    border:0 !important;

    color:#041006 !important;

    font-weight:950 !important;

    letter-spacing:.07em;

    background:

        linear-gradient(
            135deg,
            #c8ff4d,
            #6dff9b
        ) !important;

    box-shadow:
        0 12px 35px
        rgba(157,255,76,.10);

}

#lakeHarvestButton{

    border:
        1px solid
        rgba(87,235,211,.22) !important;

    color:#dffff8 !important;

    background:
        rgba(41,174,151,.10) !important;

}

#lakeWithdrawButton{

    border:
        1px solid
        rgba(232,200,108,.20) !important;

    color:#ffeab1 !important;

    background:
        rgba(232,200,108,.075) !important;

}

/* INPUTS */

body.lake-v3-loaded
input,

body.lake-v3-loaded
select{

    min-height:48px;

    color:#fff !important;

    border:
        1px solid
        rgba(200,255,77,.11) !important;

    border-radius:13px !important;

    background:
        rgba(0,8,5,.62) !important;

    outline:none;

}

body.lake-v3-loaded
input:focus,

body.lake-v3-loaded
select:focus{

    border-color:
        rgba(200,255,77,.40) !important;

    box-shadow:
        0 0 0 3px
        rgba(200,255,77,.055);

}

/* GENERIC CARDS */

body.lake-v3-loaded
.card,

body.lake-v3-loaded
.panel,

body.lake-v3-loaded
.glass{

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

}

/* ======================================================
   SPECIAL VISUAL SECTIONS
====================================================== */

.lake-v3-art-strip{

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

    margin:
        0 auto 22px;

    display:grid;

    grid-template-columns:
        1.1fr
        .9fr;

    gap:8px;

}

.lake-v3-art-card{

    position:relative;

    min-height:390px;

    overflow:hidden;

    padding:24px;

    display:flex;

    align-items:flex-end;

    border-radius:24px;

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

    background:#031008;

}

.lake-v3-art-card-bg{

    position:absolute;

    inset:0;

    background-size:cover;

    background-position:center;

}

.lake-v3-art-card-bg:after{

    content:"";

    position:absolute;

    inset:0;

    background:

        linear-gradient(
            180deg,
            rgba(0,0,0,.04),
            rgba(0,0,0,.14) 42%,
            rgba(1,7,4,.92)
        );

}

.lake-v3-art-card-content{

    position:relative;

    z-index:2;

}

.lake-v3-art-card-content span{

    color:var(--lake-lime);

    font-size:8px;

    font-weight:950;

    letter-spacing:.15em;

}

.lake-v3-art-card-content h3{

    margin:
        7px 0
        6px;

    font-size:
        clamp(
            30px,
            4vw,
            48px
        );

    letter-spacing:-.055em;

}

.lake-v3-art-card-content p{

    max-width:500px;

    margin:0;

    color:#86998d;

    font-size:11px;

    line-height:1.6;

}

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

@media(max-width:980px){

    .lake-v3-hero-grid{

        grid-template-columns:1fr;

    }

    .lake-v3-tiers{

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

    }

    .lake-v3-art-strip{

        grid-template-columns:1fr;

    }

}

@media(max-width:650px){

    .lake-v3-hero,
    .lake-v3-world,
    .lake-v3-art-strip{

        width:
            calc(100% - 18px);

    }

    .lake-v3-hero{

        margin-top:95px;

    }

    .lake-v3-title{

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

    }

    .lake-v3-tiers{

        grid-template-columns:1fr;

    }

    .lake-v3-tier{

        min-height:320px;

    }

    .lake-v3-world-head{

        align-items:flex-start;

        flex-direction:column;

    }

}

/* BULLFROG FINAL V3 TOP SPACING NORMALIZER START */

/* ======================================================
   LAKE — 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(
    .lake-v3-hero,
    .lake-v3-world,
    .lake-v3-stage,
    .lake-v3-shell,
    .lake-v3-arena,
    .lake-v3-command,
    .lake-v3-terminal,
    .lake-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(
    .lake-v3-hero,
    .lake-v3-world,
    .lake-v3-stage,
    .lake-v3-shell,
    .lake-v3-arena
) > * {
    margin-top: 0 !important;

    align-self: start !important;
}


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

body :is(
    .lake-v3-hero-inner,
    .lake-v3-inner,
    .lake-v3-container,
    .lake-v3-grid,
    .lake-v3-hero-grid,
    .lake-v3-layout,
    .lake-v3-content,
    .lake-v3-stage-inner,
    .lake-v3-command-grid,
    .lake-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(
    .lake-v3-copy,
    .lake-v3-hero-copy,
    .lake-v3-intro,
    .lake-v3-left,
    .lake-v3-content-left
) {
    margin-top: 0 !important;
    padding-top: 0 !important;

    align-self: start !important;

    transform: none !important;
}


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

body :is(
    .lake-v3-right,
    .lake-v3-core,
    .lake-v3-panel,
    .lake-v3-vault,
    .lake-v3-radar,
    .lake-v3-telemetry,
    .lake-v3-terminal,
    .lake-v3-identity,
    .lake-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*="lake-v3-hero"] {
    min-height: 0 !important;
}

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

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


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

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


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

@media(max-width: 1000px) {

    body :is(
        .lake-v3-hero,
        .lake-v3-world,
        .lake-v3-stage,
        .lake-v3-shell,
        .lake-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(
        .lake-v3-hero,
        .lake-v3-world,
        .lake-v3-stage,
        .lake-v3-shell,
        .lake-v3-arena
    ) {
        margin-top: 6px !important;

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

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

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

}

/* BULLFROG FINAL V3 TOP SPACING NORMALIZER END */

/* BULLFROG FINAL TINY HEADER GAP START */

/* ======================================================
   LAKE — 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(
    .lake-v3-hero,
    .lake-v3-world,
    .lake-v3-stage,
    .lake-v3-shell,
    .lake-v3-arena,
    .lake-v3-command,
    .lake-v3-terminal,
    .lake-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(
        .lake-v3-hero,
        .lake-v3-world,
        .lake-v3-stage,
        .lake-v3-shell,
        .lake-v3-arena
    ) {
        margin-top: 12px !important;
    }

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

}

/* Mobile */

@media(max-width:650px) {

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

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

}

/* BULLFROG FINAL TINY HEADER GAP END */

