/* =========================================================
   GTA6GURU - GTA 6 BUSINESS PROFIT CALCULATOR
   SELF CONTAINED
========================================================= */

:root{
    --g6-red:#e51c2a;
    --g6-red-dark:#b80e19;
    --g6-orange:#ff7a18;
    --g6-yellow:#ffc928;

    --ink:#16181c;
    --muted:#69717c;
    --light:#f5f6f8;
    --white:#ffffff;

    --green:#16864d;
    --green-bg:#eaf8f0;

    --blue:#286fe8;
    --blue-bg:#edf4ff;

    --purple:#7657d9;
    --purple-bg:#f3efff;

    --orange:#a96708;
    --orange-bg:#fff5df;

    --gray-bg:#f0f1f3;

    --border:#e3e6ea;

    --shadow:0 12px 40px rgba(17,20,25,.08);
    --shadow-small:0 5px 18px rgba(17,20,25,.06);

    --radius:18px;
}

*{
    box-sizing:border-box;
}

html{
    scroll-behavior:smooth;
}

body{
    margin:0;
    background:
        radial-gradient(
            circle at 80% 0%,
            rgba(229,28,42,.06),
            transparent 30%
        ),
        var(--light);

    color:var(--ink);

    font-family:
        Inter,
        system-ui,
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        sans-serif;

    line-height:1.6;
}

button,
input,
select{
    font:inherit;
}

button{
    cursor:pointer;
}

a{
    color:inherit;
}

/* =========================================================
   HEADER
========================================================= */

.g6bp-header{
    position:sticky;
    top:0;
    z-index:9999;

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

    backdrop-filter:blur(15px);

    border-bottom:1px solid rgba(0,0,0,.07);
}

.g6bp-nav{
    max-width:1200px;
    min-height:70px;

    margin:auto;
    padding:0 20px;

    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
}

.g6bp-logo{
    display:flex;
    align-items:center;
    gap:10px;

    text-decoration:none;
    font-weight:950;
}

.g6bp-logo-icon{
    width:40px;
    height:40px;

    display:grid;
    place-items:center;

    color:white;

    border-radius:12px;

    background:
        linear-gradient(
            135deg,
            var(--g6-red),
            var(--g6-orange)
        );

    box-shadow:
        0 7px 18px rgba(229,28,42,.25);

    font-size:11px;
}

.g6bp-logo-name{
    font-size:17px;
}

.g6bp-logo-name span{
    color:var(--g6-red);
}

.g6bp-nav-links{
    display:flex;
    gap:5px;
}

.g6bp-nav-links a{
    padding:8px 12px;

    border-radius:9px;

    text-decoration:none;

    color:#606873;

    font-size:13px;
    font-weight:800;
}

.g6bp-nav-links a:hover{
    background:#f0f1f3;
    color:var(--ink);
}

/* =========================================================
   CONTAINER
========================================================= */

.g6bp-container{
    width:100%;
    max-width:1200px;

    margin:auto;

    padding-left:20px;
    padding-right:20px;
}

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

.g6bp-hero{
    padding:70px 0 30px;
}

.g6bp-hero-grid{
    display:grid;

    grid-template-columns:
        minmax(0,1.25fr)
        minmax(300px,.75fr);

    gap:45px;

    align-items:center;
}

.g6bp-label{
    display:inline-flex;

    padding:7px 12px;

    border-radius:999px;

    background:#fff0f2;

    border:1px solid #ffd6da;

    color:var(--g6-red);

    font-size:11px;

    text-transform:uppercase;

    letter-spacing:.8px;

    font-weight:950;
}

.g6bp-hero h1{
    margin:17px 0 14px;

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

    line-height:1.02;

    letter-spacing:-3px;
}

.g6bp-gradient{
    background:
        linear-gradient(
            90deg,
            var(--g6-red),
            var(--g6-orange)
        );

    -webkit-background-clip:text;
    background-clip:text;

    color:transparent;
}

.g6bp-hero-text{
    max-width:700px;

    color:#68707b;

    font-size:17px;

    line-height:1.75;
}

.g6bp-hero-buttons{
    margin-top:25px;

    display:flex;

    flex-wrap:wrap;

    gap:10px;
}

.g6bp-btn{
    border:0;

    padding:12px 17px;

    border-radius:11px;

    font-weight:900;

    transition:.2s;
}

.g6bp-btn:hover{
    transform:translateY(-1px);
}

.g6bp-btn-primary{
    color:white;

    background:
        linear-gradient(
            135deg,
            var(--g6-red),
            var(--g6-orange)
        );
}

.g6bp-btn-dark{
    color:white;
    background:var(--ink);
}

.g6bp-btn-light{
    color:var(--ink);

    background:white;

    border:1px solid var(--border);
}

.g6bp-launch-card{
    background:#17191d;

    color:white;

    border-radius:25px;

    padding:28px;

    position:relative;

    overflow:hidden;

    box-shadow:var(--shadow);
}

.g6bp-launch-card:after{
    content:"";

    position:absolute;

    width:240px;
    height:240px;

    right:-100px;
    top:-110px;

    border-radius:50%;

    background:
        radial-gradient(
            circle,
            rgba(255,122,24,.4),
            transparent 65%
        );
}

.g6bp-launch-small{
    color:#9fa6af;

    font-size:10px;

    text-transform:uppercase;

    letter-spacing:1px;

    font-weight:900;
}

.g6bp-launch-card h2{
    margin:7px 0;

    font-size:29px;
}

.g6bp-launch-date{
    font-size:21px;
    font-weight:950;
}

.g6bp-launch-card p{
    margin:14px 0 0;

    color:#aeb4bd;

    font-size:12px;
}

/* =========================================================
   NOTICE
========================================================= */

.g6bp-notice{
    margin:10px 0 25px;

    padding:16px 18px;

    border:1px solid #ffdfaa;

    background:#fff9ed;

    border-radius:14px;

    color:#76561d;

    font-size:13px;
}

.g6bp-notice strong{
    color:#4e390d;
}

/* =========================================================
   MAIN APP
========================================================= */

.g6bp-app{
    padding:20px 0 60px;
}

.g6bp-app-layout{
    display:grid;

    grid-template-columns:
        minmax(0,1fr)
        minmax(0,1fr);

    gap:20px;

    align-items:start;
}

.g6bp-result{
    grid-column:1 / -1;
    position:static;
}

/* =========================================================
   PANEL
========================================================= */

.g6bp-panel{
    background:white;

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

    border-radius:var(--radius);

    box-shadow:var(--shadow-small);

    overflow:hidden;
}

.g6bp-panel-title{
    padding:20px 21px;

    border-bottom:1px solid var(--border);
}

.g6bp-panel-title h2{
    margin:0;

    font-size:20px;
}

.g6bp-panel-title p{
    margin:4px 0 0;

    color:var(--muted);

    font-size:12px;
}

/* =========================================================
   DATABASE
========================================================= */

.g6bp-database-controls{
    padding:18px;

    border-bottom:1px solid var(--border);

    display:grid;

    grid-template-columns:
        1fr
        170px
        150px;

    gap:10px;
}

.g6bp-input,
.g6bp-select{
    width:100%;

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

    background:white;

    border-radius:10px;

    padding:11px 12px;

    outline:none;

    color:var(--ink);
}

.g6bp-input:focus,
.g6bp-select:focus{
    border-color:var(--g6-red);

    box-shadow:
        0 0 0 3px rgba(229,28,42,.08);
}

.g6bp-database-count{
    padding:12px 18px;

    color:#7b828b;

    font-size:11px;

    border-bottom:1px solid var(--border);
}

.g6bp-business-list{
    max-height:800px;

    overflow-y:auto;

    padding:12px;
}

.g6bp-business{
    width:100%;

    text-align:left;

    background:white;

    border:1px solid transparent;

    border-radius:13px;

    padding:14px;

    margin-bottom:7px;

    transition:.18s;
}

.g6bp-business:hover{
    background:#fafafa;

    border-color:#dfe2e6;
}

.g6bp-business.active{
    border-color:var(--g6-red);

    background:#fff7f8;

    box-shadow:
        0 0 0 3px rgba(229,28,42,.06);
}

.g6bp-business-top{
    display:flex;

    align-items:flex-start;

    justify-content:space-between;

    gap:12px;
}

.g6bp-business-name{
    font-size:14px;

    font-weight:950;
}

.g6bp-business-type{
    color:#7b828c;

    font-size:11px;

    margin-top:2px;
}

.g6bp-business-location{
    margin-top:8px;

    color:#727983;

    font-size:11px;
}

.g6bp-badge{
    display:inline-flex;

    white-space:nowrap;

    padding:4px 7px;

    border-radius:999px;

    font-size:9px;

    font-weight:950;
}

.g6bp-confirmed{
    color:#117143;

    background:var(--green-bg);
}

.g6bp-reported{
    color:#775612;

    background:#fff4d9;
}

.g6bp-rumored{
    color:#9a4c08;

    background:#fff0e1;
}

.g6bp-property{
    color:#2b62bd;

    background:var(--blue-bg);
}

.g6bp-historical{
    color:#654bb6;

    background:var(--purple-bg);
}

.g6bp-unknown{
    color:#636a73;

    background:var(--gray-bg);
}

/* =========================================================
   CALCULATOR
========================================================= */

.g6bp-calculator{
    padding:20px;
}

.g6bp-selected{
    padding:15px;

    background:#f8f9fa;

    border:1px solid #e9ebee;

    border-radius:13px;

    margin-bottom:18px;
}

.g6bp-selected-name{
    font-size:16px;
    font-weight:950;
}

.g6bp-selected-meta{
    margin-top:4px;

    color:#6d747d;

    font-size:11px;
}

.g6bp-selected-note{
    margin-top:9px;

    font-size:11px;

    color:#6e747d;
}

.g6bp-section-heading{
    display:flex;

    align-items:center;

    gap:8px;

    margin:22px 0 12px;

    font-size:13px;

    font-weight:950;
}

.g6bp-number{
    width:22px;
    height:22px;

    display:grid;

    place-items:center;

    border-radius:7px;

    background:#f0f1f3;

    font-size:10px;
}

.g6bp-form-grid{
    display:grid;

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

    gap:12px;
}

.g6bp-field{
    display:flex;

    flex-direction:column;

    gap:5px;
}

.g6bp-field.full{
    grid-column:1/-1;
}

.g6bp-field label{
    color:#414850;

    font-size:11px;

    font-weight:850;
}

.g6bp-field small{
    color:#9298a0;

    font-size:9px;
}

.g6bp-money{
    position:relative;
}

.g6bp-money-symbol{
    position:absolute;

    left:11px;
    top:50%;

    transform:translateY(-50%);

    color:#858c95;

    font-size:12px;

    font-weight:900;

    pointer-events:none;
}

.g6bp-money input{
    padding-left:25px;
}

.g6bp-range-row{
    display:grid;

    grid-template-columns:1fr 65px;

    gap:10px;

    align-items:center;
}

.g6bp-range{
    width:100%;

    accent-color:var(--g6-red);
}

.g6bp-range-output{
    border:1px solid var(--border);

    border-radius:9px;

    padding:7px;

    text-align:center;

    font-size:11px;

    font-weight:950;
}

/* =========================================================
   RESULT PANEL
========================================================= */

.g6bp-result{
    grid-column:1 / -1;
    position:static;
}

.g6bp-result-main{
    padding:25px;

    background:#17191d;

    color:white;
}

.g6bp-result-label{
    color:#9da5af;

    font-size:10px;

    text-transform:uppercase;

    letter-spacing:1px;

    font-weight:900;
}

.g6bp-result-profit{
    margin:4px 0;

    font-size:43px;

    line-height:1;

    letter-spacing:-2px;

    font-weight:950;
}

.g6bp-result-caption{
    color:#9da5af;

    font-size:11px;
}

.g6bp-result-body{
    padding:20px;
}

.g6bp-stat-grid{
    display:grid;

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

    gap:9px;
}

.g6bp-stat{
    padding:13px;

    background:#f8f9fa;

    border:1px solid #eaecf0;

    border-radius:12px;
}

.g6bp-stat-label{
    color:#7d848d;

    font-size:9px;

    text-transform:uppercase;

    font-weight:900;

    letter-spacing:.4px;
}

.g6bp-stat-value{
    margin-top:3px;

    font-size:17px;

    font-weight:950;
}

.g6bp-green{
    color:var(--green);
}

.g6bp-blue{
    color:var(--blue);
}

.g6bp-purple{
    color:var(--purple);
}

.g6bp-red{
    color:var(--g6-red);
}

.g6bp-break-even{
    margin-top:11px;

    padding:14px;

    border-radius:12px;

    background:var(--purple-bg);

    border:1px solid #e5defa;
}

.g6bp-break-even strong{
    color:var(--purple);

    display:block;

    font-size:12px;
}

.g6bp-break-even span{
    color:#706888;

    font-size:10px;
}

.g6bp-result-buttons{
    display:grid;

    grid-template-columns:
        1fr
        1fr;

    gap:8px;

    margin-top:14px;
}

.g6bp-result-buttons button{
    width:100%;
}

.g6bp-chart-title{
    margin:22px 0 5px;

    font-size:11px;

    font-weight:950;
}

.g6bp-chart{
    height:160px;

    display:flex;

    align-items:flex-end;

    gap:7px;

    padding:10px 3px 25px;

    border-bottom:1px solid var(--border);
}

.g6bp-chart-bar{
    flex:1;

    min-width:8px;

    border-radius:6px 6px 0 0;

    background:
        linear-gradient(
            to top,
            var(--g6-red),
            var(--g6-orange)
        );

    position:relative;

    transition:.3s;
}

.g6bp-chart-bar span{
    position:absolute;

    bottom:-21px;

    left:50%;

    transform:translateX(-50%);

    color:#9298a0;

    font-size:8px;
}

/* =========================================================
   DATA EXPLANATION
========================================================= */

.g6bp-section{
    padding:65px 0;
}

.g6bp-section-header{
    max-width:750px;

    margin-bottom:25px;
}

.g6bp-section-kicker{
    color:var(--g6-red);

    font-size:10px;

    font-weight:950;

    text-transform:uppercase;

    letter-spacing:1px;
}

.g6bp-section-header h2{
    margin:6px 0;

    font-size:34px;

    line-height:1.1;

    letter-spacing:-1.2px;
}

.g6bp-section-header p{
    color:var(--muted);

    margin:0;

    font-size:14px;
}

.g6bp-info-grid{
    display:grid;

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

    gap:14px;
}

.g6bp-info-card{
    background:white;

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

    border-radius:16px;

    padding:20px;

    box-shadow:var(--shadow-small);
}

.g6bp-info-icon{
    width:40px;
    height:40px;

    display:grid;

    place-items:center;

    background:#f2f3f5;

    border-radius:11px;

    margin-bottom:12px;
}

.g6bp-info-card h3{
    margin:0 0 6px;

    font-size:16px;
}

.g6bp-info-card p{
    margin:0;

    color:#6c737d;

    font-size:12px;
}

/* =========================================================
   DATABASE TABLE
========================================================= */

.g6bp-table-wrap{
    overflow:auto;

    background:white;

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

    border-radius:16px;

    box-shadow:var(--shadow-small);
}

.g6bp-table{
    width:100%;

    min-width:850px;

    border-collapse:collapse;
}

.g6bp-table th,
.g6bp-table td{
    padding:13px 15px;

    border-bottom:1px solid #eceef1;

    text-align:left;

    font-size:11px;
}

.g6bp-table th{
    background:#f8f9fa;

    color:#737a84;

    text-transform:uppercase;

    letter-spacing:.4px;

    font-size:9px;
}

.g6bp-table tr:last-child td{
    border-bottom:0;
}

/* =========================================================
   FAQ
========================================================= */

.g6bp-faq{
    max-width:900px;
}

.g6bp-faq-item{
    margin-bottom:9px;

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

    background:white;

    border-radius:13px;

    overflow:hidden;
}

.g6bp-faq-question{
    width:100%;

    border:0;

    background:white;

    padding:16px;

    text-align:left;

    display:flex;

    align-items:center;

    justify-content:space-between;

    gap:15px;

    font-size:13px;

    font-weight:950;
}

.g6bp-faq-answer{
    display:none;

    padding:0 16px 16px;

    color:#68707b;

    font-size:12px;
}

.g6bp-faq-item.open
.g6bp-faq-answer{
    display:block;
}

.g6bp-faq-item.open
.g6bp-faq-question{
    color:var(--g6-red);
}

/* =========================================================
   FOOTER
========================================================= */

.g6bp-footer{
    background:#17191d;

    color:#aeb5be;

    padding:35px 0;
}

.g6bp-footer-inner{
    max-width:1200px;

    margin:auto;

    padding:0 20px;

    display:flex;

    justify-content:space-between;

    gap:30px;

    align-items:center;
}

.g6bp-footer strong{
    color:white;
}

.g6bp-footer p{
    margin:4px 0 0;

    font-size:10px;
}

/* =========================================================
   TOAST
========================================================= */

.g6bp-toast{
    position:fixed;

    bottom:20px;
    left:50%;

    transform:
        translate(-50%,120px);

    background:#17191d;

    color:white;

    padding:11px 15px;

    border-radius:10px;

    font-size:11px;

    font-weight:900;

    box-shadow:var(--shadow);

    transition:.25s;

    z-index:99999;
}

.g6bp-toast.show{
    transform:
        translate(-50%,0);
}

/* =========================================================
   RESPONSIVE
========================================================= */

.g6bp-guide-content{
    max-width:900px;
    color:var(--text);
    font-size:14px;
    line-height:1.75;
}

.g6bp-guide-content h3{
    margin:30px 0 8px;
    font-size:20px;
    line-height:1.25;
    letter-spacing:-.3px;
}

.g6bp-guide-content h3:first-child{
    margin-top:0;
}

.g6bp-guide-content p{
    margin:0 0 14px;
    color:var(--muted);
}

.g6bp-guide-content ol,
.g6bp-guide-content ul{
    margin:0 0 18px;
    padding-left:22px;
    color:var(--muted);
}

.g6bp-guide-content li{
    margin-bottom:8px;
}

.g6bp-guide-content strong{
    color:var(--text);
    font-weight:800;
}

@media(max-width:950px){

    .g6bp-hero-grid{
        grid-template-columns:1fr;
    }

    .g6bp-app-layout{
        grid-template-columns:1fr;
    }

    .g6bp-result{
        grid-column:auto;
        position:static;
    }

    .g6bp-info-grid{
        grid-template-columns:
            1fr 1fr;
    }

}

@media(max-width:700px){

    .g6bp-nav-links{
        display:none;
    }

    .g6bp-hero{
        padding-top:45px;
    }

    .g6bp-hero h1{
        letter-spacing:-2px;
    }

    .g6bp-database-controls{
        grid-template-columns:1fr;
    }

    .g6bp-form-grid{
        grid-template-columns:1fr;
    }

    .g6bp-field.full{
        grid-column:auto;
    }

    .g6bp-info-grid{
        grid-template-columns:1fr;
    }

    .g6bp-footer-inner{
        flex-direction:column;
        align-items:flex-start;
    }

}

@media(max-width:450px){

    .g6bp-container{
        padding-left:14px;
        padding-right:14px;
    }

    .g6bp-calculator{
        padding:14px;
    }

    .g6bp-result-main{
        padding:20px;
    }

    .g6bp-result-profit{
        font-size:35px;
    }

}

/* =========================================================
   PRINT
========================================================= */

@media print{

    .g6bp-header,
    .g6bp-hero-buttons,
    .g6bp-database-controls,
    .g6bp-business-list,
    .g6bp-result-buttons,
    .g6bp-footer{
        display:none!important;
    }

    body{
        background:white;
    }

    .g6bp-result{
        position:static;
    }

}


/* =========================================================
   EXTRACTED INLINE LAYOUT HELPERS
========================================================= */

.g6bp-calculator-actions{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:8px;
    margin-top:20px;
}

.g6bp-print-button{
    width:100%;
    margin-top:8px;
}

.g6bp-empty-state{
    padding:30px;
    text-align:center;
    color:#858c95;
    font-size:12px;
}

.g6bp-static-bar-15{height:15%}
.g6bp-static-bar-25{height:25%}
.g6bp-static-bar-35{height:35%}
.g6bp-static-bar-45{height:45%}
.g6bp-static-bar-55{height:55%}
.g6bp-static-bar-65{height:65%}

@media print{
    .g6bp-print-button{
        display:none!important;
    }
}