:root {
    --bg: #030711;
    --panel: rgba(9, 17, 32, .72);
    --panel-solid: #081120;
    --line: rgba(129, 171, 221, .16);
    --line-hot: rgba(76, 226, 255, .44);

    --text: #f5f8ff;
    --muted: #8293aa;
    --muted-2: #5e7088;

    --cyan: #55e6ff;
    --cyan-2: #00a7d8;
    --blue: #4f7cff;
    --violet: #8d63ff;

    --green: #4ff5a7;
    --red: #ff647c;
    --gold: #ffc96b;

    --radius: 22px;
}


* {
    box-sizing: border-box;
}


html {
    scroll-behavior: smooth;
}


body {
    margin: 0;

    min-height: 100vh;

    background:
        radial-gradient(
            circle at 50% -10%,
            #101d36 0,
            #050a14 36%,
            #02050b 74%
        );

    color: var(--text);

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

    overflow-x: hidden;
}


button,
input,
select {
    font: inherit;
}


button {
    cursor: pointer;
}


/* ================================================================ */
/* BACKGROUND */
/* ================================================================ */

.titan-bg {
    position: fixed;
    inset: 0;

    z-index: -10;

    overflow: hidden;

    pointer-events: none;
}


.titan-grid {
    position: absolute;
    inset: -30%;

    opacity: .25;

    background-image:
        linear-gradient(
            rgba(80, 192, 255, .075) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(80, 192, 255, .075) 1px,
            transparent 1px
        );

    background-size:
        58px 58px;

    transform:
        perspective(850px)
        rotateX(64deg)
        translateY(-8%);

    transform-origin: center;

    animation:
        titanGridMove 18s linear infinite;
}


@keyframes titanGridMove {

    0% {
        background-position:
            0 0,
            0 0;
    }

    100% {
        background-position:
            0 58px,
            58px 0;
    }

}


.titan-orb {
    position: absolute;

    width: 520px;
    height: 520px;

    border-radius: 50%;

    filter: blur(120px);

    opacity: .15;

    animation:
        titanFloat 12s ease-in-out infinite;
}


.orb-one {
    top: -180px;
    right: -80px;

    background: #245cff;
}


.orb-two {
    left: -240px;
    top: 45%;

    background: #00d8ff;

    animation-delay: -6s;
}


@keyframes titanFloat {

    0%,
    100% {
        transform:
            translate3d(0, 0, 0)
            scale(1);
    }

    50% {
        transform:
            translate3d(35px, -25px, 0)
            scale(1.08);
    }

}


.titan-beam {
    position: absolute;

    width: 1px;
    height: 120vh;

    opacity: .2;

    background:
        linear-gradient(
            transparent,
            #4fe2ff,
            transparent
        );

    transform: rotate(28deg);

    animation:
        beamSweep 10s linear infinite;
}


.beam-one {
    left: 24%;
    top: -15%;
}


.beam-two {
    right: 18%;
    top: -30%;

    animation-delay: -5s;
}


@keyframes beamSweep {

    0% {
        opacity: 0;
        transform:
            translateX(-160px)
            rotate(28deg);
    }

    50% {
        opacity: .25;
    }

    100% {
        opacity: 0;
        transform:
            translateX(240px)
            rotate(28deg);
    }

}


.titan-noise {
    position: absolute;
    inset: 0;

    opacity: .018;

    background-image:
        repeating-radial-gradient(
            circle at 20% 30%,
            #fff 0,
            #fff 1px,
            transparent 1px,
            transparent 4px
        );
}


/* ================================================================ */
/* MAIN SHELL */
/* ================================================================ */

.v7-shell {
    width:
        min(
            1380px,
            calc(100% - 56px)
        );

    margin: 0 auto;

    padding:
        26px 0
        54px;
}


/* ================================================================ */
/* TOP BAR */
/* ================================================================ */

.v7-topbar {
    min-height: 74px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    padding:
        0 4px
        0 0;

    border-bottom:
        1px solid
        rgba(120, 166, 213, .12);
}


.v7-brand {
    display: flex;
    align-items: center;

    gap: 13px;
}


.v7-brand-mark {
    width: 42px;
    height: 42px;

    display: grid;
    place-items: center;

    position: relative;

    border:
        1px solid
        rgba(85, 230, 255, .48);

    border-radius: 13px;

    background:
        linear-gradient(
            145deg,
            rgba(85, 230, 255, .16),
            rgba(79, 124, 255, .06)
        );

    box-shadow:
        0 0 35px
        rgba(85, 230, 255, .12);
}


.v7-brand-mark::after {
    content: "";

    position: absolute;
    inset: 4px;

    border:
        1px solid
        rgba(85, 230, 255, .11);

    border-radius: 9px;
}


.v7-brand-mark span {
    font-size: 21px;
    font-weight: 900;

    color: var(--cyan);

    text-shadow:
        0 0 16px
        rgba(85, 230, 255, .5);
}


.v7-brand strong {
    display: block;

    font-size: 18px;
    font-weight: 900;
    letter-spacing: .14em;
}


.v7-brand small {
    display: block;

    margin-top: 2px;

    color: var(--muted);

    font-size: 9px;
    font-weight: 700;

    letter-spacing: .24em;
}


.v7-top-status {
    display: flex;
    align-items: center;

    gap: 10px;
}


.v7-simulated,
.v7-live-pill {
    display: inline-flex;
    align-items: center;

    min-height: 34px;

    padding: 0 13px;

    border-radius: 999px;

    font-size: 10px;
    font-weight: 800;
    letter-spacing: .12em;
}


.v7-simulated {
    color: #8fa0b9;

    border:
        1px solid
        rgba(145, 167, 195, .14);

    background:
        rgba(255,255,255,.025);
}


.v7-live-pill {
    color: #82ffd0;

    border:
        1px solid
        rgba(79, 245, 167, .24);

    background:
        rgba(79, 245, 167, .06);
}


.v7-live-pill i {
    width: 7px;
    height: 7px;

    margin-right: 8px;

    border-radius: 50%;

    background: var(--green);

    box-shadow:
        0 0 0
        0 rgba(79,245,167,.65);

    animation:
        livePulse 1.8s
        infinite;
}


@keyframes livePulse {

    0% {
        box-shadow:
            0 0 0
            0 rgba(79,245,167,.48);
    }

    70% {
        box-shadow:
            0 0 0
            9px rgba(79,245,167,0);
    }

    100% {
        box-shadow:
            0 0 0
            0 rgba(79,245,167,0);
    }

}


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

.v7-hero {
    position: relative;

    min-height: 590px;

    display: grid;

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

    gap: 64px;

    align-items: center;

    padding:
        74px 62px
        66px;

    margin-top: 26px;

    border:
        1px solid
        rgba(120, 174, 230, .16);

    border-radius: 30px;

    overflow: hidden;

    background:
        linear-gradient(
            118deg,
            rgba(9,18,34,.94),
            rgba(5,11,23,.78)
        );

    box-shadow:
        inset 0 1px 0
        rgba(255,255,255,.035),
        0 40px 100px
        rgba(0,0,0,.32);
}


.v7-hero::before {
    content: "";

    position: absolute;

    width: 620px;
    height: 620px;

    right: -240px;
    top: -270px;

    border-radius: 50%;

    border:
        1px solid
        rgba(85,230,255,.12);

    box-shadow:
        0 0 120px
        rgba(31,118,255,.08);
}


.v7-hero::after {
    content: "";

    position: absolute;

    left: 0;
    top: 0;

    width: 100%;
    height: 2px;

    background:
        linear-gradient(
            90deg,
            transparent,
            var(--cyan),
            #697cff,
            transparent
        );

    opacity: .52;

    animation:
        heroLine 5s ease-in-out infinite;
}


@keyframes heroLine {

    0%,
    100% {
        opacity: .2;
        transform: translateX(-35%);
    }

    50% {
        opacity: .8;
        transform: translateX(35%);
    }

}


.v7-hero-copy {
    position: relative;
    z-index: 2;
}


.v7-eyebrow {
    display: flex;
    align-items: center;

    gap: 12px;

    color: var(--cyan);

    font-size: 11px;
    font-weight: 900;
    letter-spacing: .18em;
}


.v7-eyebrow-line {
    width: 36px;
    height: 1px;

    background:
        var(--cyan);

    box-shadow:
        0 0 12px
        rgba(85,230,255,.7);
}


.v7-hero h1 {
    max-width: 820px;

    margin:
        22px 0
        20px;

    font-size:
        clamp(
            50px,
            5.2vw,
            82px
        );

    line-height: .97;

    letter-spacing: -.055em;

    font-weight: 900;
}


.v7-hero h1 span {
    display: block;

    color: transparent;

    background:
        linear-gradient(
            90deg,
            #ffffff 0%,
            #9eefff 36%,
            #7fa0ff 72%,
            #b783ff 100%
        );

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

    filter:
        drop-shadow(
            0 0 22px
            rgba(85,230,255,.12)
        );
}


.v7-hero-text {
    max-width: 680px;

    margin: 0;

    color: #a8b6ca;

    font-size: 18px;
    line-height: 1.7;
}


.v7-hero-text strong {
    color: #eefaff;
}


.v7-feature-row {
    display: flex;
    flex-wrap: wrap;

    gap: 10px;

    margin-top: 27px;
}


.v7-feature-row span {
    display: inline-flex;
    align-items: center;

    gap: 8px;

    padding:
        9px 12px;

    border:
        1px solid
        rgba(116, 177, 232, .12);

    border-radius: 9px;

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

    color: #a8b9cb;

    font-size: 11px;
    font-weight: 700;
}


.v7-feature-row i {
    width: 5px;
    height: 5px;

    border-radius: 50%;

    background: var(--cyan);

    box-shadow:
        0 0 10px
        rgba(85,230,255,.75);
}


.v7-steps {
    display: grid;

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

    gap: 13px;

    margin-top: 38px;
}


.v7-steps > div {
    display: flex;

    gap: 12px;

    min-height: 76px;

    padding:
        14px 15px;

    border:
        1px solid
        rgba(112,165,219,.1);

    border-radius: 13px;

    background:
        rgba(0,0,0,.13);
}


.v7-steps b {
    color: var(--cyan);

    font-size: 11px;
}


.v7-steps span {
    display: block;

    color: #70839a;

    font-size: 10px;
    line-height: 1.5;
}


.v7-steps strong {
    display: block;

    margin-bottom: 3px;

    color: #dce6f4;

    font-size: 10px;

    letter-spacing: .08em;
}


/* HERO VISUAL */

.v7-hero-visual {
    position: relative;
    z-index: 2;

    min-height: 430px;

    display: grid;
    place-items: center;
}


.v7-ring {
    position: relative;

    width: 280px;
    height: 280px;

    display: grid;
    place-items: center;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(31,70,109,.38) 0,
            rgba(8,18,34,.72) 49%,
            rgba(0,0,0,.05) 70%
        );

    box-shadow:
        0 0 90px
        rgba(50,155,255,.12);
}


.v7-ring::before,
.v7-ring::after {
    content: "";

    position: absolute;

    border-radius: 50%;
}


.v7-ring::before {
    inset: 0;

    border:
        1px solid
        rgba(85,230,255,.32);

    border-left-color:
        rgba(79,124,255,.04);

    border-bottom-color:
        rgba(141,99,255,.28);

    animation:
        ringSpin 12s linear infinite;
}


.v7-ring::after {
    inset: 23px;

    border:
        1px dashed
        rgba(124,180,232,.19);

    animation:
        ringSpinReverse
        17s linear infinite;
}


@keyframes ringSpin {
    to {
        transform: rotate(360deg);
    }
}


@keyframes ringSpinReverse {
    to {
        transform: rotate(-360deg);
    }
}


.v7-ring-orbit {
    position: absolute;
    inset: -10px;

    border-radius: 50%;

    animation:
        ringSpin 6s linear infinite;
}


.v7-ring-orbit span {
    position: absolute;

    top: 50%;
    left: -2px;

    width: 9px;
    height: 9px;

    border-radius: 50%;

    background: var(--cyan);

    box-shadow:
        0 0 25px
        7px rgba(85,230,255,.25);
}


.v7-ring-inner {
    position: relative;

    z-index: 2;

    text-align: center;
}


.v7-ring-inner small {
    display: block;

    color: #7188a3;

    font-size: 10px;
    font-weight: 900;

    letter-spacing: .22em;
}


.v7-ring-inner strong {
    display: block;

    margin:
        3px 0 4px;

    font-size: 63px;
    line-height: 1;

    letter-spacing: -.06em;

    background:
        linear-gradient(
            180deg,
            #fff,
            #83e8ff
        );

    color: transparent;

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


.v7-ring-inner span {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-width: 60px;
    min-height: 25px;

    border:
        1px solid
        rgba(79,245,167,.26);

    border-radius: 999px;

    color: #77ffc5;

    background:
        rgba(79,245,167,.07);

    font-size: 9px;
    font-weight: 900;
    letter-spacing: .15em;
}


.v7-risk-engine {
    position: absolute;

    right: 0;
    bottom: 0;

    width: 230px;

    padding: 15px;

    border:
        1px solid
        rgba(85,230,255,.16);

    border-radius: 15px;

    background:
        rgba(5,14,27,.85);

    box-shadow:
        0 24px 60px
        rgba(0,0,0,.3);

    backdrop-filter: blur(14px);
}


.v7-engine-head {
    display: flex;
    align-items: center;
    justify-content: space-between;

    margin-bottom: 9px;
    padding-bottom: 10px;

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

    color: #b1c4d8;

    font-size: 8px;
    font-weight: 900;
    letter-spacing: .16em;
}


.v7-engine-head i {
    width: 6px;
    height: 6px;

    border-radius: 50%;

    background: var(--green);

    box-shadow:
        0 0 10px
        rgba(79,245,167,.7);
}


.v7-engine-row {
    display: flex;
    align-items: center;
    justify-content: space-between;

    padding: 6px 0;

    color: #687c94;

    font-size: 8px;
    font-weight: 700;
}


.v7-engine-row b {
    color: #d7e4f1;

    font-size: 8px;
    letter-spacing: .08em;
}


/* ================================================================ */
/* STATS */
/* ================================================================ */

.v7-stats {
    display: grid;

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

    gap: 15px;

    margin-top: 16px;
}


.v7-stat-card {
    position: relative;

    display: flex;
    align-items: center;

    gap: 17px;

    min-height: 124px;

    padding:
        20px 23px;

    border:
        1px solid
        rgba(112,170,224,.13);

    border-radius: 18px;

    background:
        linear-gradient(
            140deg,
            rgba(12,23,42,.76),
            rgba(7,15,29,.66)
        );

    overflow: hidden;

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


.v7-stat-card:hover {
    transform:
        translateY(-3px);

    border-color:
        rgba(85,230,255,.28);

    box-shadow:
        0 15px 45px
        rgba(0,0,0,.18);
}


.v7-stat-card::after {
    content: "";

    position: absolute;

    width: 80px;
    height: 80px;

    right: -30px;
    top: -30px;

    border-radius: 50%;

    background:
        rgba(85,230,255,.06);

    filter: blur(15px);
}


.v7-stat-icon {
    width: 46px;
    height: 46px;

    flex: 0 0 46px;

    display: grid;
    place-items: center;

    border:
        1px solid
        rgba(85,230,255,.22);

    border-radius: 13px;

    background:
        rgba(85,230,255,.055);

    color: var(--cyan);

    font-size: 18px;
}


.v7-stat-card small {
    display: block;

    color: #647991;

    font-size: 9px;
    font-weight: 900;
    letter-spacing: .13em;
}


.v7-stat-card strong {
    display: block;

    margin:
        3px 0 2px;

    font-size: 27px;
    font-weight: 850;

    letter-spacing: -.035em;
}


.v7-stat-card span {
    color: #65788e;

    font-size: 10px;
}


/* ================================================================ */
/* RIBBON */
/* ================================================================ */

.v7-market-ribbon {
    display: flex;
    align-items: center;

    min-height: 54px;

    margin-top: 16px;

    border:
        1px solid
        rgba(111,167,219,.1);

    border-radius: 14px;

    background:
        rgba(7,15,29,.62);

    overflow: hidden;
}


.v7-ribbon-label {
    align-self: stretch;

    display: flex;
    align-items: center;

    padding: 0 19px;

    border-right:
        1px solid
        rgba(111,167,219,.1);

    color: var(--cyan);

    background:
        rgba(85,230,255,.035);

    font-size: 9px;
    font-weight: 900;

    letter-spacing: .14em;
}


.v7-ribbon-track {
    display: flex;
    align-items: center;

    flex: 1;

    gap: 28px;

    padding: 0 22px;

    overflow: hidden;
}


.v7-ribbon-track span {
    display: inline-flex;
    align-items: center;

    white-space: nowrap;

    color: #9fb1c4;

    font-size: 10px;
    font-weight: 800;
    letter-spacing: .06em;
}


.v7-ribbon-track i {
    width: 5px;
    height: 5px;

    margin-right: 7px;

    border-radius: 50%;

    background: var(--green);

    box-shadow:
        0 0 8px
        rgba(79,245,167,.5);
}


.v7-ribbon-track
.v7-ribbon-muted {
    color: #51647c;
}


/* ================================================================ */
/* REGISTRATION */
/* ================================================================ */

.v7-register-wrap {
    display: grid;

    grid-template-columns:
        .86fr 1.14fr;

    gap: 52px;

    align-items: center;

    margin-top: 18px;

    padding:
        62px;

    border:
        1px solid
        rgba(115,172,224,.14);

    border-radius: 26px;

    background:
        linear-gradient(
            120deg,
            rgba(7,15,29,.86),
            rgba(10,20,37,.67)
        );
}


.v7-section-index {
    display: block;

    color: var(--cyan);

    font-size: 9px;
    font-weight: 900;

    letter-spacing: .2em;
}


.v7-register-copy h2 {
    max-width: 520px;

    margin:
        14px 0
        19px;

    font-size:
        clamp(
            34px,
            3.2vw,
            52px
        );

    line-height: 1.05;

    letter-spacing: -.045em;
}


.v7-register-copy h2 span {
    display: block;

    color: #74dfff;
}


.v7-register-copy > p {
    max-width: 520px;

    color: #7f91a7;

    font-size: 15px;
    line-height: 1.7;
}


.v7-register-copy > p strong {
    color: #dce8f5;
}


.v7-mini-specs {
    display: grid;

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

    gap: 8px;

    margin-top: 28px;
}


.v7-mini-specs div {
    padding:
        13px 12px;

    border:
        1px solid
        rgba(110,164,218,.1);

    border-radius: 10px;

    background:
        rgba(0,0,0,.12);
}


.v7-mini-specs small {
    display: block;

    color: #546980;

    font-size: 7px;
    font-weight: 900;
    letter-spacing: .11em;
}


.v7-mini-specs strong {
    display: block;

    margin-top: 5px;

    color: #d9e8f5;

    font-size: 11px;
}


.v7-form-card {
    position: relative;

    overflow: hidden;

    padding: 30px;

    border:
        1px solid
        rgba(85,230,255,.16);

    border-radius: 22px;

    background:
        linear-gradient(
            145deg,
            rgba(11,24,43,.9),
            rgba(6,14,26,.88)
        );

    box-shadow:
        0 30px 80px
        rgba(0,0,0,.28),
        inset 0 1px 0
        rgba(255,255,255,.035);
}


.v7-form-glow {
    position: absolute;

    width: 260px;
    height: 260px;

    right: -120px;
    top: -130px;

    border-radius: 50%;

    background:
        rgba(36,139,255,.11);

    filter: blur(45px);
}


.v7-form-head {
    position: relative;

    display: flex;
    align-items: center;
    justify-content: space-between;

    margin-bottom: 25px;
}


.v7-form-head small {
    color: #5f748d;

    font-size: 8px;
    font-weight: 900;

    letter-spacing: .15em;
}


.v7-form-head h3 {
    margin:
        5px 0 0;

    font-size: 23px;

    letter-spacing: -.025em;
}


.v7-secure {
    padding:
        7px 9px;

    border:
        1px solid
        rgba(79,245,167,.16);

    border-radius: 7px;

    color: #6ef2ba;

    background:
        rgba(79,245,167,.04);

    font-size: 7px;
    font-weight: 900;

    letter-spacing: .1em;
}


#v6-register-form {
    position: relative;

    display: grid;

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

    gap: 13px;
}


#v6-register-form label > span {
    display: block;

    margin:
        0 0 7px
        2px;

    color: #5d7289;

    font-size: 8px;
    font-weight: 900;
    letter-spacing: .1em;
}


#v6-register-form input {
    width: 100%;
    height: 52px;

    outline: none;

    padding: 0 15px;

    border:
        1px solid
        rgba(119,165,211,.17);

    border-radius: 10px;

    color: #eaf4ff;

    background:
        rgba(2,8,17,.6);

    transition:
        border-color .25s ease,
        box-shadow .25s ease,
        background .25s ease;
}


#v6-register-form
input::placeholder {
    color: #40546b;
}


#v6-register-form
input:focus {
    border-color:
        rgba(85,230,255,.48);

    background:
        rgba(4,12,24,.85);

    box-shadow:
        0 0 0 3px
        rgba(85,230,255,.05);
}


.v7-primary {
    grid-column: 1 / -1;

    position: relative;

    height: 57px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    margin-top: 5px;

    padding: 0 20px;

    overflow: hidden;

    border:
        1px solid
        rgba(85,230,255,.5);

    border-radius: 11px;

    color: #021018;

    background:
        linear-gradient(
            90deg,
            #53e2ff,
            #77d8ff,
            #6e93ff
        );

    font-size: 11px;
    font-weight: 900;

    letter-spacing: .06em;

    box-shadow:
        0 12px 35px
        rgba(49,171,238,.16);

    transition:
        transform .25s ease,
        box-shadow .25s ease;
}


.v7-primary::before {
    content: "";

    position: absolute;

    width: 80px;
    height: 140px;

    top: -40px;
    left: -120px;

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

    transform:
        rotate(25deg);

    filter: blur(10px);

    animation:
        buttonShine 4.5s
        infinite;
}


@keyframes buttonShine {

    0%,
    65% {
        left: -130px;
    }

    100% {
        left: 120%;
    }

}


.v7-primary:hover {
    transform:
        translateY(-2px);

    box-shadow:
        0 18px 45px
        rgba(49,171,238,.26);
}


.v7-primary b {
    font-size: 19px;
}


.v7-form-note {
    display: flex;
    align-items: center;

    gap: 8px;

    margin-top: 16px;

    color: #53687f;

    font-size: 9px;
}


.v7-form-note i {
    width: 6px;
    height: 6px;

    border-radius: 50%;

    background: var(--green);
}


/* ================================================================ */
/* MODE SECTION */
/* ================================================================ */

.v7-mode-section {
    margin-top: 18px;

    padding:
        54px;

    border:
        1px solid
        rgba(111,168,220,.14);

    border-radius: 26px;

    background:
        rgba(6,14,27,.83);
}


.v7-section-heading {
    text-align: center;

    margin-bottom: 34px;
}


.v7-section-heading h2 {
    margin:
        10px 0 6px;

    font-size: 36px;

    letter-spacing: -.04em;
}


.v7-section-heading p {
    color: #71859c;
}


.v7-mode-grid {
    display: grid;

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

    gap: 14px;
}


.v7-mode-card {
    position: relative;

    min-height: 380px;

    padding: 25px;

    text-align: left;

    border:
        1px solid
        rgba(110,165,218,.14);

    border-radius: 18px;

    color: white;

    background:
        linear-gradient(
            150deg,
            rgba(12,23,41,.95),
            rgba(5,13,25,.9)
        );

    overflow: hidden;

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


.v7-mode-card:hover {
    transform:
        translateY(-6px);
}


.v7-mode-card.safe:hover {
    border-color:
        rgba(79,245,167,.35);

    box-shadow:
        0 25px 60px
        rgba(79,245,167,.06);
}


.v7-mode-card.balanced:hover {
    border-color:
        rgba(85,230,255,.38);

    box-shadow:
        0 25px 60px
        rgba(85,230,255,.07);
}


.v7-mode-card.aggressive:hover {
    border-color:
        rgba(255,100,124,.35);

    box-shadow:
        0 25px 60px
        rgba(255,100,124,.06);
}


.mode-tag {
    display: inline-flex;

    padding:
        6px 8px;

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

    border-radius: 6px;

    color: #6f839a;

    font-size: 7px;
    font-weight: 900;
    letter-spacing: .12em;
}


.v7-mode-card > strong {
    display: block;

    margin-top: 30px;

    font-size: 21px;
}


.v7-mode-card > b {
    display: block;

    margin-top: 5px;

    font-size: 60px;
    line-height: 1;

    letter-spacing: -.06em;
}


.v7-mode-card.safe > b {
    color: var(--green);
}


.v7-mode-card.balanced > b {
    color: var(--cyan);
}


.v7-mode-card.aggressive > b {
    color: var(--red);
}


.v7-mode-card > small {
    display: block;

    margin-bottom: 27px;

    color: #687d94;

    font-size: 9px;
}


.v7-mode-card > div {
    display: flex;
    align-items: center;
    justify-content: space-between;

    padding:
        10px 0;

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

    color: #6b8098;

    font-size: 9px;
}


.v7-mode-card > div b {
    color: #dce8f5;
}


.v7-mode-card em {
    position: absolute;

    left: 24px;
    bottom: 22px;

    color: #8499ae;

    font-size: 8px;
    font-style: normal;
    font-weight: 900;

    letter-spacing: .1em;
}


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

.v7-terminal {
    margin-top: 18px;

    border:
        1px solid
        rgba(111,168,220,.15);

    border-radius: 25px;

    background:
        rgba(5,13,25,.9);

    overflow: hidden;
}


.v7-terminal-top {
    min-height: 84px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    padding: 0 25px;

    border-bottom:
        1px solid
        rgba(112,166,219,.11);
}


.v7-terminal-top small {
    display: block;

    color: var(--cyan);

    font-size: 7px;
    font-weight: 900;

    letter-spacing: .15em;
}


.v7-terminal-top strong {
    display: block;

    margin-top: 4px;

    font-size: 18px;
}


.v7-tabs {
    display: flex;

    gap: 5px;
}


.v7-tabs button {
    min-height: 39px;

    padding: 0 15px;

    border:
        1px solid
        transparent;

    border-radius: 8px;

    color: #60748b;

    background: transparent;

    font-size: 8px;
    font-weight: 900;

    letter-spacing: .08em;
}


.v7-tabs button.active {
    color: #dff9ff;

    border-color:
        rgba(85,230,255,.2);

    background:
        rgba(85,230,255,.07);
}


.v7-panel {
    padding: 25px;
}


.v7-account-grid {
    display: grid;

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

    gap: 10px;
}


.v7-account-grid article {
    padding:
        17px 18px;

    border:
        1px solid
        rgba(111,165,218,.1);

    border-radius: 12px;

    background:
        rgba(8,18,33,.65);
}


.v7-account-grid small {
    display: block;

    color: #60748b;

    font-size: 8px;
    font-weight: 900;
    letter-spacing: .1em;
}


.v7-account-grid strong {
    display: block;

    margin-top: 6px;

    font-size: 22px;

    letter-spacing: -.025em;
}


.v7-trading-layout {
    display: grid;

    grid-template-columns:
        1fr 1fr;

    gap: 13px;

    margin-top: 13px;
}


.v7-market-panel,
.v7-execution-panel {
    padding: 24px;

    border:
        1px solid
        rgba(110,164,217,.11);

    border-radius: 15px;

    background:
        rgba(4,11,22,.67);
}


.v7-panel-title {
    display: flex;
    align-items: center;
    justify-content: space-between;

    margin-bottom: 22px;
}


.v7-panel-title small {
    display: block;

    color: #596e86;

    font-size: 7px;
    font-weight: 900;

    letter-spacing: .13em;
}


.v7-panel-title strong {
    display: block;

    margin-top: 4px;

    font-size: 18px;
}


.v7-panel-title > span {
    padding:
        6px 8px;

    border:
        1px solid
        rgba(79,245,167,.15);

    border-radius: 6px;

    color: #74eeb8;

    font-size: 7px;
    font-weight: 900;
}


.v7-select-label > span {
    display: block;

    margin-bottom: 7px;

    color: #566a81;

    font-size: 8px;
    font-weight: 900;
}


#v6-symbol {
    width: 100%;
    height: 51px;

    outline: 0;

    padding: 0 14px;

    border:
        1px solid
        rgba(111,165,218,.17);

    border-radius: 9px;

    color: #e7f4ff;

    background: #07111f;
}


.v7-indicator-button {
    width: 100%;
    height: 48px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    margin-top: 10px;

    padding: 0 14px;

    border:
        1px solid
        rgba(85,230,255,.21);

    border-radius: 9px;

    color: #8cecff;

    background:
        rgba(85,230,255,.045);

    font-size: 8px;
    font-weight: 900;
    letter-spacing: .08em;
}


.v7-indicator-result {
    min-height: 67px;

    display: flex;
    align-items: center;

    gap: 9px;

    margin-top: 10px;

    padding: 13px;

    border:
        1px solid
        rgba(111,165,218,.09);

    border-radius: 9px;

    color: #71869d;

    background:
        rgba(0,0,0,.13);

    font-size: 10px;
}


.v7-loader-dot {
    width: 7px;
    height: 7px;

    flex: 0 0 7px;

    border-radius: 50%;

    background: var(--cyan);

    animation:
        statusBlink 1.6s
        infinite;
}


@keyframes statusBlink {

    0%,
    100% {
        opacity: .35;
    }

    50% {
        opacity: 1;
        box-shadow:
            0 0 14px
            rgba(85,230,255,.7);
    }

}


.v7-execution-panel > p {
    color: #687d94;

    font-size: 11px;
    line-height: 1.6;
}


.v7-trade-actions {
    display: grid;

    grid-template-columns:
        1fr 1fr;

    gap: 9px;

    margin-top: 18px;
}


.v7-trade-actions button {
    position: relative;

    min-height: 105px;

    padding: 17px;

    text-align: left;

    border-radius: 12px;

    overflow: hidden;
}


.v7-trade-actions button small {
    display: block;

    margin-bottom: 3px;

    font-size: 8px;
    font-weight: 900;
    letter-spacing: .12em;
}


.v7-trade-actions button strong {
    font-size: 26px;
}


.v7-trade-actions button span {
    position: absolute;

    right: 17px;
    bottom: 15px;

    font-size: 26px;
}


.v7-buy {
    color: #79f8bd;

    border:
        1px solid
        rgba(79,245,167,.25);

    background:
        linear-gradient(
            145deg,
            rgba(79,245,167,.085),
            rgba(4,16,18,.65)
        );
}


.v7-sell {
    color: #ff8596;

    border:
        1px solid
        rgba(255,100,124,.23);

    background:
        linear-gradient(
            145deg,
            rgba(255,100,124,.075),
            rgba(18,7,13,.6)
        );
}


.v7-refresh-button {
    width: 100%;
    height: 43px;

    margin-top: 9px;

    border:
        1px solid
        rgba(112,165,218,.13);

    border-radius: 9px;

    color: #71869d;

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

    font-size: 8px;
    font-weight: 900;
    letter-spacing: .08em;
}


/* DASHBOARD */

.v7-dashboard-title {
    display: flex;
    align-items: center;
    justify-content: space-between;

    margin-bottom: 20px;
}


.v7-dashboard-title small {
    color: var(--cyan);

    font-size: 8px;
    font-weight: 900;

    letter-spacing: .14em;
}


.v7-dashboard-title h2 {
    margin:
        4px 0 0;

    font-size: 27px;
}


.v7-provisional {
    padding:
        7px 10px;

    border:
        1px solid
        rgba(255,201,107,.18);

    border-radius: 7px;

    color: var(--gold);

    font-size: 7px;
    font-weight: 900;
    letter-spacing: .12em;
}


.v7-dashboard-summary {
    padding: 15px;

    margin-bottom: 14px;

    border:
        1px solid
        rgba(112,165,218,.1);

    border-radius: 10px;

    color: #8397ad;

    background:
        rgba(0,0,0,.12);

    font-size: 10px;
}


.v7-table-wrap {
    overflow-x: auto;

    border:
        1px solid
        rgba(112,165,218,.1);

    border-radius: 11px;
}


table {
    width: 100%;

    border-collapse: collapse;
}


th,
td {
    padding:
        13px 14px;

    text-align: left;

    white-space: nowrap;

    border-bottom:
        1px solid
        rgba(112,165,218,.075);
}


th {
    color: #576b82;

    font-size: 7px;
    letter-spacing: .1em;
}


td {
    color: #afbecd;

    font-size: 10px;
}


.v7-leaderboard {
    min-height: 200px;

    padding: 25px;

    border:
        1px solid
        rgba(112,165,218,.1);

    border-radius: 12px;

    color: #8195ab;

    background:
        rgba(0,0,0,.12);

    line-height: 1.8;
}


/* ================================================================ */
/* MESSAGE + FOOTER */
/* ================================================================ */

.v7-message {
    position: fixed;

    right: 22px;
    bottom: 22px;

    z-index: 100;

    max-width: 420px;

    padding:
        14px 18px;

    border:
        1px solid
        rgba(85,230,255,.27);

    border-radius: 11px;

    color: #dff9ff;

    background:
        rgba(7,18,32,.94);

    box-shadow:
        0 25px 70px
        rgba(0,0,0,.42);

    backdrop-filter:
        blur(14px);

    font-size: 11px;

    animation:
        messageIn .3s ease;
}


@keyframes messageIn {

    from {
        opacity: 0;
        transform:
            translateY(10px)
            scale(.97);
    }

    to {
        opacity: 1;
        transform:
            translateY(0)
            scale(1);
    }

}


.v7-footer {
    display: flex;
    align-items: center;
    justify-content: center;

    gap: 25px;

    padding:
        28px 0
        4px;

    color: #32465d;

    font-size: 7px;
    font-weight: 900;

    letter-spacing: .15em;
}


.v7-footer span:not(:last-child)::after {
    content: "•";

    margin-left: 25px;

    color: #2b425a;
}


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

@media (
    max-width: 1050px
) {

    .v7-hero {
        grid-template-columns: 1fr;

        gap: 30px;
    }

    .v7-hero-visual {
        min-height: 390px;
    }

    .v7-register-wrap {
        grid-template-columns: 1fr;
    }

}


@media (
    max-width: 780px
) {

    .v7-shell {
        width:
            calc(
                100% - 24px
            );
    }


    .v7-topbar {
        min-height: 66px;
    }


    .v7-simulated {
        display: none;
    }


    .v7-hero {
        min-height: auto;

        padding:
            42px 22px;

        border-radius: 22px;
    }


    .v7-hero h1 {
        font-size: 48px;
    }


    .v7-hero-text {
        font-size: 15px;
    }


    .v7-steps {
        grid-template-columns: 1fr;
    }


    .v7-hero-visual {
        min-height: 365px;
    }


    .v7-ring {
        width: 230px;
        height: 230px;
    }


    .v7-risk-engine {
        width: 200px;
    }


    .v7-stats {
        grid-template-columns: 1fr;
    }


    .v7-market-ribbon {
        display: block;
    }


    .v7-ribbon-label {
        min-height: 40px;

        border-right: 0;

        border-bottom:
            1px solid
            rgba(111,167,219,.1);
    }


    .v7-ribbon-track {
        overflow-x: auto;

        min-height: 48px;

        gap: 22px;
    }


    .v7-register-wrap {
        padding:
            38px 20px;

        gap: 31px;
    }


    .v7-mini-specs {
        grid-template-columns: 1fr;
    }


    .v7-form-card {
        padding: 20px;
    }


    #v6-register-form {
        grid-template-columns: 1fr;
    }


    .v7-mode-section {
        padding:
            36px 18px;
    }


    .v7-mode-grid {
        grid-template-columns: 1fr;
    }


    .v7-terminal-top {
        display: block;

        padding:
            20px;
    }


    .v7-tabs {
        margin-top: 16px;

        overflow-x: auto;
    }


    .v7-panel {
        padding: 15px;
    }


    .v7-account-grid {
        grid-template-columns:
            1fr 1fr;
    }


    .v7-trading-layout {
        grid-template-columns: 1fr;
    }


    .v7-footer {
        flex-wrap: wrap;

        gap: 9px;

        text-align: center;
    }


    .v7-footer
    span:not(:last-child)::after {
        display: none;
    }

}


@media (
    max-width: 480px
) {

    .v7-brand strong {
        font-size: 15px;
    }


    .v7-brand small {
        font-size: 7px;
    }


    .v7-live-pill {
        padding:
            0 9px;

        font-size: 8px;
    }


    .v7-hero h1 {
        font-size: 39px;
    }


    .v7-feature-row {
        display: grid;
    }


    .v7-account-grid {
        grid-template-columns: 1fr;
    }


    .v7-trade-actions {
        grid-template-columns: 1fr 1fr;
    }

}


[hidden] {
    display: none !important;
}


/* ================================================================
   TITAN_V8_CORRECTED_POLISH
   ================================================================ */


/* ------------------------------------------------
   REAL TITAN SHIELD
   Gold asset visually transformed to cyan/blue.
   ------------------------------------------------ */

.v8-brand-mark {
    width: 52px;
    height: 52px;

    overflow: visible;

    border-color:
        rgba(85,230,255,.30);

    background:
        radial-gradient(
            circle,
            rgba(85,230,255,.11),
            rgba(4,13,26,.25)
        );

    box-shadow:
        0 0 34px
        rgba(85,230,255,.10);
}


.v8-brand-mark::after {
    display: none;
}


.v8-brand-mark img {
    width: 48px;
    height: 48px;

    display: block;

    object-fit: contain;

    border-radius: 10px;

    mix-blend-mode: screen;

    filter:
        hue-rotate(138deg)
        saturate(1.65)
        brightness(1.18)
        drop-shadow(
            0 0 8px
            rgba(85,230,255,.48)
        );

    animation:
        titanV8LogoPulse
        4.4s ease-in-out infinite;
}


@keyframes titanV8LogoPulse {

    0%,
    100% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.055);
    }

}



/* ------------------------------------------------
   FIX THE OVERLAP
   Circle on top.
   Risk Engine completely below it.
   ------------------------------------------------ */

.v7-hero-visual {
    min-height: 560px;

    display: flex;

    flex-direction: column;

    align-items: center;
    justify-content: center;

    gap: 27px;

    overflow: visible;
}


.v7-ring {
    position: relative;

    flex: 0 0 auto;

    width: 275px;
    height: 275px;

    margin: 0;

    animation:
        titanV8RingPulse
        5s ease-in-out infinite;
}


@keyframes titanV8RingPulse {

    0%,
    100% {
        box-shadow:
            0 0 82px
            rgba(50,155,255,.10);
    }

    50% {
        box-shadow:
            0 0 125px
            rgba(50,190,255,.19);
    }
}


.v7-ring-inner {
    min-width: 220px;
}


.v7-ring-inner strong {
    font-size: 35px;

    line-height: 1;

    letter-spacing: -.045em;

    white-space: nowrap;

    font-variant-numeric:
        tabular-nums;

    text-shadow:
        0 0 28px
        rgba(85,230,255,.23);
}


.v7-ring-inner::after {
    content: "";

    position: absolute;

    left: 50%;
    top: 50%;

    width: 165px;
    height: 165px;

    border:
        1px solid
        rgba(85,230,255,.16);

    border-radius: 50%;

    pointer-events: none;

    animation:
        titanV8Sonar
        3.2s ease-out infinite;
}


@keyframes titanV8Sonar {

    0% {
        opacity: .66;

        transform:
            translate(-50%, -50%)
            scale(.64);
    }

    100% {
        opacity: 0;

        transform:
            translate(-50%, -50%)
            scale(1.42);
    }
}



/* This overrides the old absolute positioning */

.v7-risk-engine {
    position: relative;

    right: auto;
    bottom: auto;

    width:
        min(
            340px,
            100%
        );

    margin: 0 auto;

    padding: 17px 19px;

    transform: none;

    border-color:
        rgba(85,230,255,.22);

    background:
        linear-gradient(
            135deg,
            rgba(7,18,34,.97),
            rgba(4,11,23,.96)
        );

    box-shadow:
        0 24px 65px
        rgba(0,0,0,.32),
        0 0 34px
        rgba(38,156,255,.065);

    animation:
        titanV8EngineFloat
        5.2s ease-in-out infinite;
}


.v7-risk-engine::before {
    content: "";

    position: absolute;

    left: 50%;
    top: -28px;

    width: 1px;
    height: 27px;

    background:
        linear-gradient(
            transparent,
            rgba(85,230,255,.54)
        );

    box-shadow:
        0 0 9px
        rgba(85,230,255,.28);
}


@keyframes titanV8EngineFloat {

    0%,
    100% {
        transform:
            translateY(0);
    }

    50% {
        transform:
            translateY(-5px);
    }

}



/* ------------------------------------------------
   RISK ENGINE SCANNING LINES
   ------------------------------------------------ */

.v7-engine-row {
    position: relative;
}


.v7-engine-row::after {
    content: "";

    position: absolute;

    left: 0;
    bottom: 0;

    width: 0;
    height: 1px;

    background:
        linear-gradient(
            90deg,
            rgba(85,230,255,.48),
            transparent
        );

    animation:
        titanV8Scan
        4.7s ease-in-out infinite;
}


.v7-engine-row:nth-child(3)::after {
    animation-delay: .35s;
}


.v7-engine-row:nth-child(4)::after {
    animation-delay: .70s;
}


.v7-engine-row:nth-child(5)::after {
    animation-delay: 1.05s;
}


.v7-engine-row:nth-child(6)::after {
    animation-delay: 1.40s;
}


@keyframes titanV8Scan {

    0%,
    55% {
        width: 0;
        opacity: 0;
    }

    77% {
        width: 72%;
        opacity: .9;
    }

    100% {
        width: 100%;
        opacity: 0;
    }

}



/* ------------------------------------------------
   MOVING TITLE GRADIENT
   ------------------------------------------------ */

.v7-hero h1 span {
    background-size:
        190% 190%;

    animation:
        titanV8Title
        7s ease-in-out infinite;
}


@keyframes titanV8Title {

    0%,
    100% {
        background-position:
            0% 50%;
    }

    50% {
        background-position:
            100% 50%;
    }

}



/* ------------------------------------------------
   LIVE STAT SHIMMER
   ------------------------------------------------ */

.v7-stat-card::before {
    content: "";

    position: absolute;

    top: -45%;
    left: -52%;

    width: 38%;
    height: 190%;

    transform:
        rotate(18deg);

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(85,230,255,.06),
            transparent
        );

    animation:
        titanV8StatShine
        8s linear infinite;

    pointer-events: none;
}


.v7-stat-card:nth-child(2)::before {
    animation-delay: -2.6s;
}


.v7-stat-card:nth-child(3)::before {
    animation-delay: -5.2s;
}


@keyframes titanV8StatShine {

    0% {
        left: -55%;
    }

    36%,
    100% {
        left: 130%;
    }

}



/* ------------------------------------------------
   LIVE MARKET DOTS
   ------------------------------------------------ */

.v7-ribbon-track i {
    animation:
        titanV8MarketDot
        1.9s ease-in-out infinite;
}


@keyframes titanV8MarketDot {

    0%,
    100% {
        opacity: .5;
    }

    50% {
        opacity: 1;

        box-shadow:
            0 0 12px
            rgba(79,245,167,.80);
    }

}



@media (max-width: 780px) {

    .v7-hero-visual {
        min-height: auto;

        padding-top: 14px;

        gap: 28px;
    }


    .v7-ring {
        width: 230px;
        height: 230px;
    }


    .v7-ring-inner strong {
        font-size: 28px;
    }


    .v7-risk-engine {
        width: 100%;

        max-width: 320px;
    }


    .v8-brand-mark {
        width: 45px;
        height: 45px;
    }


    .v8-brand-mark img {
        width: 41px;
        height: 41px;
    }

}



/* TITAN 48H V9 INDICATOR */

.v9-indicator-card{
    margin-top:18px;
    padding:18px;
    position:relative;
    overflow:hidden;
    border:1px solid rgba(55,215,255,.22);
    border-radius:18px;
    background:linear-gradient(
        145deg,
        rgba(4,21,37,.96),
        rgba(3,12,26,.95)
    );
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.04),
        0 18px 55px rgba(0,0,0,.22);
}

.v9-indicator-card::before{
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    background:linear-gradient(
        90deg,
        transparent,
        rgba(55,215,255,.04),
        transparent
    );
    transform:translateX(-100%);
    animation:v9Scan 5s linear infinite;
}

@keyframes v9Scan{
    to{transform:translateX(100%)}
}

.v9-indicator-top{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:12px;
    margin-bottom:17px;
}

.v9-indicator-top small{
    display:block;
    color:#708ca3;
    font-size:10px;
    font-weight:900;
    letter-spacing:.16em;
}

.v9-indicator-top strong{
    display:block;
    margin-top:4px;
    color:#ecfaff;
    font-size:13px;
}

.v9-live-pill{
    display:flex;
    align-items:center;
    gap:6px;
    padding:6px 9px;
    border:1px solid rgba(66,222,255,.25);
    border-radius:999px;
    color:#8deaff;
    background:rgba(43,198,232,.08);
    font-size:10px;
    font-weight:900;
}

.v9-live-pill i{
    width:7px;
    height:7px;
    border-radius:50%;
    background:#43e7ff;
    box-shadow:0 0 11px #43e7ff;
}

.v9-signal-zone{
    display:grid;
    grid-template-columns:1.1fr .9fr;
    gap:12px;
}

.v9-signal-orb{
    min-height:145px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    border-radius:16px;
    border:1px solid rgba(255,255,255,.08);
    background:radial-gradient(
        circle at 50% 35%,
        rgba(55,204,255,.15),
        rgba(3,15,28,.95) 70%
    );
}

.v9-signal-orb span{
    color:#7691a7;
    font-size:10px;
    font-weight:900;
    letter-spacing:.17em;
}

.v9-signal-orb strong{
    margin:8px 0 5px;
    font-size:34px;
    letter-spacing:.06em;
    color:#7fe4ff;
}

.v9-signal-orb small{
    color:#819aae;
    font-size:11px;
}

.v9-signal-orb.v9-buy{
    border-color:rgba(63,236,171,.35);
}

.v9-signal-orb.v9-buy strong{
    color:#55efb1;
}

.v9-signal-orb.v9-sell{
    border-color:rgba(255,98,119,.38);
}

.v9-signal-orb.v9-sell strong{
    color:#ff7488;
}

.v9-metrics{
    display:grid;
    gap:10px;
}

.v9-metric{
    padding:14px;
    display:flex;
    flex-direction:column;
    justify-content:center;
    border:1px solid rgba(255,255,255,.07);
    border-radius:14px;
    background:rgba(255,255,255,.025);
}

.v9-metric span{
    color:#70899e;
    font-size:9px;
    font-weight:900;
    letter-spacing:.12em;
}

.v9-metric strong{
    margin-top:5px;
    color:#e9faff;
    font-size:23px;
}

.v9-context{
    margin-top:12px;
    padding:13px;
    border-radius:13px;
    border:1px solid rgba(255,255,255,.06);
    background:rgba(2,13,25,.65);
}

.v9-context span{
    color:#718ca3;
    font-size:9px;
    font-weight:900;
    letter-spacing:.14em;
}

.v9-context p{
    margin:6px 0 0;
    color:#bfd0dd;
    font-size:12px;
    line-height:1.55;
}

.v9-mtf{
    margin-top:9px;
    padding:10px 12px;
    border-radius:11px;
    color:#8ab9ca;
    background:rgba(41,188,226,.055);
    font-size:10px;
}

.v9-decision-note{
    margin-top:11px;
    padding:11px 12px;
    display:flex;
    gap:9px;
    border:1px solid rgba(53,211,255,.15);
    border-radius:12px;
    background:rgba(35,184,221,.045);
}

.v9-decision-note > span{
    color:#52ddff;
}

.v9-decision-note p{
    margin:0;
    color:#849daf;
    font-size:11px;
    line-height:1.5;
}

.v9-decision-note strong{
    color:#d9f6ff;
}

.v7-indicator-button.v9-loading{
    opacity:.65;
    pointer-events:none;
}

@media(max-width:700px){
    .v9-signal-zone{
        grid-template-columns:1fr;
    }

    .v9-metrics{
        grid-template-columns:1fr 1fr;
    }
}

/* TITAN 48H V10 REAL CHART CSS */

.t48-v10-chart-shell {
    margin: 22px 0 18px;
    padding: 20px;
    border:
        1px solid
        rgba(106,137,198,.22);
    border-radius: 22px;
    background:
        radial-gradient(
            circle at 88% 0%,
            rgba(42,116,255,.12),
            transparent 34%
        ),
        linear-gradient(
            180deg,
            rgba(10,21,40,.98),
            rgba(5,13,27,.98)
        );
}

.t48-v10-chart-head {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 16px;
}

.t48-v10-chart-eyebrow {
    margin-bottom: 5px;
    color: #53a6ff;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .18em;
}

.t48-v10-chart-head h3 {
    margin: 0;
    color: #f5f8ff;
    font-size: 26px;
}

.t48-v10-chart-head p {
    max-width: 680px;
    margin: 7px 0 0;
    color: #8f9db6;
    line-height: 1.55;
}

.t48-v10-live-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    height: fit-content;
    padding: 8px 11px;
    border:
        1px solid
        rgba(44,218,166,.24);
    border-radius: 999px;
    color: #6ee7bd;
    font-size: 11px;
    font-weight: 800;
}

.t48-v10-live-badge span {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #22d3a6;
}

.t48-v10-chart-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px;
    margin-bottom: 10px;
    color: #92a0b9;
    font-size: 12px;
}

.t48-v10-chart-meta strong {
    color: #eef4ff;
    font-size: 14px;
}

#v10-chart-price {
    color: #6db2ff;
    font-weight: 800;
}

#v10-chart-status {
    margin-left: auto;
}

.t48-v10-chart {
    width: 100%;
    min-height: 430px;
    overflow: hidden;
    border:
        1px solid
        rgba(117,145,196,.13);
    border-radius: 16px;
    background: #07101f;
}

.t48-v10-chart-foot {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 12px;
}

.t48-v10-chart-foot span {
    padding: 6px 9px;
    border:
        1px solid
        rgba(115,145,200,.15);
    border-radius: 999px;
    color: #8795ad;
    font-size: 10px;
}

@media (max-width: 720px) {

    .t48-v10-chart-shell {
        padding: 14px;
    }

    .t48-v10-chart-head {
        display: block;
    }

    .t48-v10-live-badge {
        margin-top: 12px;
    }

    .t48-v10-chart {
        min-height: 350px;
    }

    #v10-chart-status {
        width: 100%;
        margin-left: 0;
    }
}

/* ============================================================
   TITAN 48H V11 — FULL EDGE PRO TERMINAL
   ============================================================ */

.v7-trading-layout {
    display: block !important;
}

.v7-market-panel {
    display: none !important;
}

.campaign-edge-full {
    width: 100%;
    margin: 0 0 22px;
    padding: 0;
}

.campaign-edge-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
    margin: 0 0 14px;
    padding: 18px 20px;
    border: 1px solid rgba(61, 162, 255, .18);
    border-radius: 18px;
    background:
        linear-gradient(
            135deg,
            rgba(9, 24, 46, .96),
            rgba(5, 14, 29, .98)
        );
}

.campaign-edge-heading small {
    color: #56b9ff;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .16em;
}

.campaign-edge-heading h2 {
    margin: 4px 0 5px;
    color: #f7faff;
    font-size: 27px;
}

.campaign-edge-heading p {
    max-width: 760px;
    margin: 0;
    color: #8e9db8;
    line-height: 1.55;
}

.campaign-edge-heading > span {
    flex: 0 0 auto;
    padding: 7px 11px;
    border: 1px solid rgba(37, 218, 163, .24);
    border-radius: 999px;
    color: #60e5bb;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .12em;
}

.campaign-edge-frame {
    display: block;
    width: 100%;
    height: 980px;
    border: 1px solid rgba(89, 126, 189, .2);
    border-radius: 20px;
    background: #050c18;
}

.v7-execution-panel {
    width: 100% !important;
    margin: 0 !important;
}

.v7-trade-actions {
    max-width: none !important;
}

@media (max-width: 760px) {
    .campaign-edge-heading {
        display: block;
        padding: 15px;
    }

    .campaign-edge-heading > span {
        display: inline-block;
        margin-top: 10px;
    }

    .campaign-edge-frame {
        height: 900px;
        border-radius: 14px;
    }
}

/* TITAN 48H V11 COMPACT EDGE TERMINAL */

.campaign-edge-frame {
    height: 620px !important;
    min-height: 620px !important;
    max-height: 620px !important;
}

@media (max-width: 760px) {
    .campaign-edge-frame {
        height: 700px !important;
        min-height: 700px !important;
        max-height: 700px !important;
    }
}


/* ============================================================
   TITAN 48H V12 ONE SCREEN
   ============================================================ */

/*
 * Indicator directly under account cards.
 */
.campaign-edge-full {
    margin: 8px 0 10px !important;
}

/*
 * Compact Edge terminal so BUY / SELL stays nearby.
 */
.campaign-edge-frame {
    display: block !important;

    width: 100% !important;

    height: 520px !important;
    min-height: 520px !important;
    max-height: 520px !important;

    border-radius: 16px !important;
}


/*
 * BUY / SELL panel immediately under indicator.
 */
.v7-execution-panel {
    display: flex !important;
    flex-direction: column !important;

    width: 100% !important;

    gap: 9px !important;

    margin: 0 !important;
    padding: 14px 18px !important;
}


/*
 * Buttons FIRST.
 */
.v7-execution-panel .v7-trade-actions {
    order: 1 !important;

    width: 100% !important;

    margin: 0 !important;
}


/*
 * "Your Decision" AFTER BUY / SELL.
 */
.v7-execution-panel .v7-panel-title {
    order: 2 !important;

    margin: 2px 0 0 !important;
}


/*
 * Direction explanation AFTER heading.
 */
.v7-execution-panel > p {
    order: 3 !important;

    margin: 0 !important;
}


/*
 * Refresh P/L last.
 */
.v7-execution-panel .v7-refresh-button {
    order: 4 !important;

    margin: 0 !important;
}


/*
 * 48H access information is moved below
 * the trading decision instead of sitting
 * above the indicator.
 */
.campaign-edge-heading {
    margin: 8px 0 0 !important;

    padding: 10px 14px !important;

    border-radius: 12px !important;

    background:
        rgba(7, 18, 35, .68) !important;
}

.campaign-edge-heading h2 {
    display: inline !important;

    margin: 0 8px 0 0 !important;

    font-size: 14px !important;
}

.campaign-edge-heading small {
    font-size: 9px !important;
}

.campaign-edge-heading p {
    display: inline !important;

    margin: 0 !important;

    font-size: 11px !important;
    line-height: 1.4 !important;
}

.campaign-edge-heading > span {
    display: none !important;
}


/*
 * Desktop: keep account row + Edge + BUY/SELL
 * as tight as reasonably possible.
 */
@media (min-width: 1000px) {

    .v7-account-strip,
    .v7-account-summary {
        margin-bottom: 8px !important;
    }

    .v7-trade-actions button {
        min-height: 86px !important;
    }
}


/*
 * Mobile gets more vertical room.
 */
@media (max-width: 760px) {

    .campaign-edge-frame {
        height: 650px !important;
        min-height: 650px !important;
        max-height: 650px !important;
    }

    .v7-execution-panel {
        padding: 12px !important;
    }
}


/* ============================================================
   TITAN 48H V13 DESKTOP PROPORTIONS
   ============================================================ */

/*
 * Give the actual Titan Edge Pro more vertical room.
 */
.campaign-edge-frame {
    height: 580px !important;
    min-height: 580px !important;
    max-height: 580px !important;
}


/*
 * Compact the account strip so more viewport
 * belongs to the indicator.
 */
.v7-account-strip,
.v7-account-summary,
.v7-account-cards {
    gap: 10px !important;
    margin-bottom: 8px !important;
}


/*
 * Current account cards use article blocks.
 * Compact only the top trading summary cards.
 */
[data-panel="trading"] article {
    min-height: 0 !important;
}


/*
 * The four account cards immediately before
 * the trading layout.
 */
[data-panel="trading"] .v7-dashboard-summary,
[data-panel="trading"] .v7-account-strip,
[data-panel="trading"] .v7-account-summary {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}


/*
 * Tighten common card spacing without changing
 * widths or horizontal layout.
 */
[data-panel="trading"] article small {
    margin-bottom: 4px !important;
}

[data-panel="trading"] article strong {
    line-height: 1.05 !important;
}


/*
 * Most important rule for the visible four cards.
 */
[data-panel="trading"] > div:first-of-type article,
[data-panel="trading"] .v7-stats article,
[data-panel="trading"] .v7-summary-grid article {
    padding-top: 12px !important;
    padding-bottom: 12px !important;
}


/*
 * Keep Edge terminal tight against account cards.
 */
.campaign-edge-full {
    margin-top: 6px !important;
}


/*
 * BUY / SELL sizing remains unchanged.
 */
.v7-execution-panel {
    margin-top: 10px !important;
}


/*
 * Desktop target:
 * compact top summary + taller chart + BUY/SELL.
 */
@media (min-width: 1000px) {

    .campaign-edge-frame {
        height: 580px !important;
        min-height: 580px !important;
        max-height: 580px !important;
    }

    [data-panel="trading"] article {
        padding-top: 10px !important;
        padding-bottom: 10px !important;
    }

    [data-panel="trading"] article strong {
        font-size: 24px !important;
    }
}


/*
 * Keep mobile V12 behavior.
 */
@media (max-width: 760px) {

    .campaign-edge-frame {
        height: 650px !important;
        min-height: 650px !important;
        max-height: 650px !important;
    }
}


/* TITAN V15.2 TRADE FEEDBACK */

.v7-trade-actions [data-side] {
    transition:
        transform .10s ease,
        filter .12s ease,
        box-shadow .12s ease,
        opacity .12s ease !important;
}

.v7-trade-actions [data-side]:active,
.v7-trade-actions [data-side].titan-trade-opening {
    transform:
        translateY(4px)
        scale(.985) !important;

    filter:
        brightness(.70)
        saturate(1.25) !important;
}

.v7-trade-actions [data-side].titan-trade-success {
    transform:
        translateY(2px)
        scale(.99) !important;

    filter:
        brightness(1.35)
        saturate(1.45) !important;

    box-shadow:
        0 0 28px
        rgba(255,255,255,.20)
        !important;
}

.v7-trade-actions [data-side]:disabled {
    pointer-events: none !important;
    cursor: wait !important;
}


/* ============================================================
   TITAN V16 LIVE STATS
   ============================================================ */

.v7-stat-card strong {
    display: block !important;
    margin-top: 3px !important;

    font-size:
        clamp(30px, 3vw, 46px)
        !important;

    line-height: 1 !important;
    font-weight: 800 !important;

    color: #ffffff !important;

    letter-spacing:
        -0.035em !important;

    text-shadow:
        0 0 18px
        rgba(255,255,255,.14)
        !important;
}

.v7-stat-card strong span {
    font-size: inherit !important;
    line-height: inherit !important;
    font-weight: inherit !important;
    color: inherit !important;
}

.v7-stat-card small {
    font-size: 13px !important;
    font-weight: 750 !important;
    letter-spacing: .07em !important;

    color:
        rgba(255,255,255,.78)
        !important;
}

.v7-stat-card > div > span {
    font-size: 13px !important;

    color:
        rgba(255,255,255,.62)
        !important;
}

@media (max-width: 760px) {
    .v7-stat-card strong {
        font-size:
            clamp(27px, 8vw, 38px)
            !important;
    }
}


/* ============================================================
   TITAN V20 MANUAL CLOSE
   ============================================================ */

.titan-close-cell-v20 {
    text-align: center !important;
    vertical-align: middle !important;
}

.titan-close-trade-v20 {
    width: 32px !important;
    height: 32px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    border:
        1px solid rgba(255,70,70,.72)
        !important;

    border-radius: 8px !important;

    background:
        rgba(220,30,30,.20)
        !important;

    color: #ff5555 !important;

    font-size: 19px !important;
    font-weight: 900 !important;
    line-height: 1 !important;

    cursor: pointer !important;

    transition:
        transform .10s ease,
        background .12s ease,
        box-shadow .12s ease
        !important;
}

.titan-close-trade-v20:hover {
    background:
        rgba(230,40,40,.38)
        !important;

    box-shadow:
        0 0 15px
        rgba(255,50,50,.20)
        !important;
}

.titan-close-trade-v20:active {
    transform:
        scale(.86)
        !important;
}

.titan-close-trade-v20:disabled {
    opacity: .55 !important;
    cursor: wait !important;
}


/* ============================================================
   TITAN V23 CLOSE MODAL
   ============================================================ */

.titan-close-modal-overlay-v23 {
    position: fixed !important;
    inset: 0 !important;
    z-index: 999999 !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    padding: 20px !important;

    background:
        rgba(1, 6, 14, .68)
        !important;

    backdrop-filter:
        blur(5px)
        !important;
}

.titan-close-modal-box-v23 {
    width:
        min(430px, calc(100vw - 36px))
        !important;

    padding:
        26px 26px 22px
        !important;

    border:
        1px solid rgba(90, 120, 155, .30)
        !important;

    border-radius:
        16px
        !important;

    background:
        #08111d
        !important;

    box-shadow:
        0 24px 70px rgba(0, 0, 0, .55)
        !important;

    text-align:
        center
        !important;
}

.titan-close-modal-title-v23 {
    margin-bottom:
        10px
        !important;

    font-size:
        19px
        !important;

    font-weight:
        800
        !important;

    color:
        #f4f7fb
        !important;
}

.titan-close-modal-subtitle-v23 {
    margin:
        0 auto 22px
        !important;

    max-width:
        340px
        !important;

    font-size:
        13px
        !important;

    line-height:
        1.55
        !important;

    color:
        #98a7ba
        !important;
}

.titan-close-modal-actions-v23 {
    display:
        flex
        !important;

    align-items:
        center
        !important;

    justify-content:
        center
        !important;

    gap:
        12px
        !important;
}

.titan-close-modal-cancel-v23,
.titan-close-modal-ok-v23 {
    min-width:
        105px
        !important;

    height:
        42px
        !important;

    border-radius:
        10px
        !important;

    font-size:
        14px
        !important;

    font-weight:
        750
        !important;

    cursor:
        pointer
        !important;
}

.titan-close-modal-cancel-v23 {
    border:
        1px solid rgba(130, 150, 175, .30)
        !important;

    background:
        rgba(120, 140, 165, .08)
        !important;

    color:
        #c3ccd8
        !important;
}

.titan-close-modal-ok-v23 {
    border:
        1px solid rgba(255, 75, 75, .62)
        !important;

    background:
        rgba(220, 40, 40, .22)
        !important;

    color:
        #ff6868
        !important;
}

.titan-close-modal-ok-v23:hover {
    background:
        rgba(225, 45, 45, .35)
        !important;
}