/* Extracted from public/index.html style block 2 id=phase-x-market-intelligence-height-5-6-17. */
/* Phase X 5.6.22: Kalender und News auf Desktop deutlich besser lesbar. */
#CalendarDAX, #NewsDAX, #CalendarFX, #NewsFX {
    height: 300px !important;
    min-height: 300px !important;
}
.v2-intelligence-grid > .v2-data-card {
    min-height: 392px !important;
}
@media (max-height: 820px) and (min-width: 901px) {
    #CalendarDAX, #NewsDAX, #CalendarFX, #NewsFX {
        height: 235px !important;
        min-height: 235px !important;
    }
    .v2-intelligence-grid > .v2-data-card {
        min-height: 325px !important;
    }
}
@media (max-width: 900px) {
    #CalendarDAX, #NewsDAX, #CalendarFX, #NewsFX {
        height: 220px !important;
        min-height: 220px !important;
    }
    .v2-intelligence-grid > .v2-data-card {
        min-height: 300px !important;
    }
}

/* Extracted from public/index.html style block 3. */
/* Phase X 5.6.22 – öffentliche Marktdaten kompakt und aufklappbar. */
.market-status-strip.dp-market-status-strip {
    display:block !important;
    padding:6px 10px !important;
    overflow:visible !important;
}
.market-status-summary {
    min-height:42px !important;
    display:grid !important;
    grid-template-columns:minmax(220px,1fr) auto auto !important;
    align-items:center !important;
    gap:12px !important;
    padding:4px 8px !important;
}
.market-status-toggle {
    border:1px solid rgba(76,139,245,.55);
    background:#17283d;
    color:#eaf2ff;
    border-radius:6px;
    padding:7px 12px;
    font:inherit;
    font-size:11px;
    font-weight:800;
    cursor:pointer;
    white-space:nowrap;
}
.market-status-toggle:hover { background:#203753; }
.market-quote-panel { margin-top:7px; }
.market-quote-panel[hidden] { display:none !important; }
.market-quote-groups {
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:7px !important;
    width:100% !important;
    min-width:0 !important;
}
.market-quote-group {
    display:grid !important;
    grid-template-columns:82px minmax(0,1fr) !important;
    align-items:center !important;
    gap:8px !important;
    padding:5px 7px !important;
    border:1px solid rgba(255,255,255,.07) !important;
    border-radius:6px !important;
    background:rgba(255,255,255,.012) !important;
}
.market-quote-group-title {
    padding:0 5px !important;
    font-size:8px !important;
    font-weight:850 !important;
    letter-spacing:.12em !important;
    color:#9db2cb !important;
}
.market-quote-group .market-quote-cards {
    display:flex !important;
    flex-wrap:wrap !important;
    gap:6px !important;
}
.market-quote-group .market-quote-card {
    min-width:138px !important;
    flex:0 1 158px !important;
}
@media (max-width:760px) {
    .market-status-summary { grid-template-columns:1fr auto !important; }
    .market-status-update { grid-column:1 / -1; }
    .market-quote-group { grid-template-columns:1fr !important; }
}

/* Extracted from public/index.html style block 4. */
<!-- ================================================================= -->
<!-- ENDE: BLOCK 5C - TEIL 3                                           -->
<!-- ================================================================= -->
/* Phase X 5.6.22: News- und Statussemantik tradergerecht trennen. */
.news-impact-summary {
    display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin:8px 0 10px;
    padding:7px 9px; border:1px solid rgba(255,255,255,.08); border-radius:7px;
    background:rgba(255,255,255,.025); font-size:11px; font-weight:700;
}
.news-impact-summary .news-summary-alarm { color:#ff6b6b; }
.news-impact-summary .news-summary-info { color:#8cbcff; }
.news-impact-summary .news-summary-state { margin-left:auto; color:#c9d3df; }
.v2-news-feed { display:block !important; }
.tde-news-line {
    display:flex !important; width:100%; box-sizing:border-box; flex:0 0 auto;
    align-items:flex-start; gap:8px; margin:0 0 6px 0; padding:7px 9px;
    border-radius:5px; line-height:1.35; white-space:normal; overflow-wrap:anywhere;
}
.tde-news-line.tde-news-alarm { color:#fff; background:rgba(255,69,58,.18); border-left:3px solid #ff453a; }
.tde-news-line.tde-news-info { color:#c9d3df; background:rgba(86,156,214,.08); border-left:3px solid rgba(86,156,214,.55); }
.tde-news-badge { flex:0 0 78px; font-size:10px; line-height:1.35; white-space:nowrap; }
.tde-news-headline { display:block; flex:1 1 auto; min-width:0; }
.v3-state-chip.v3-state-neutral { background:rgba(86,156,214,.10); border-color:rgba(86,156,214,.35); color:#9ecbff; }

/* Extracted from public/index.html style block 5 id=phase-x-ui-hardening-5-6-34. */
/* Release 5.6.35: nicht freigegebene Navigation ist sichtbar deaktiviert statt als Platzhalter getarnt. */
.v31-menu-button[disabled] { opacity:.38 !important; cursor:not-allowed !important; filter:none !important; }

/* Extracted from public/index.html style block 6 id=phase-x-user-session-status-5-6-36. */
.v31-user-zone .v36-user-meta { display:flex !important; flex-direction:row !important; align-items:center !important; gap:0 !important; white-space:nowrap; }
.v31-user-zone .v36-user-meta-separator { color:#8e8e93 !important; }
.v31-user-zone .v36-session-online { color:#30d158 !important; }
.v31-user-zone .v36-session-checking { color:#ff9f0a !important; }
.v31-user-zone .v36-session-offline { color:#ff453a !important; }
.v31-user-zone .v36-session-lost { color:#ff453a !important; }

/* Extracted from public/index.html style block 7 id=phase-x-hotfix4-role-license-summary. */
.tde-role-license-summary {
    grid-column: 1 / -1;
    display:flex;
    flex-direction:column;
    gap:4px;
    padding:12px 14px;
    margin-bottom:4px;
    border:1px solid rgba(90,200,250,.28);
    border-radius:10px;
    background:rgba(90,200,250,.06);
}
.tde-role-license-summary small { font-size:10px; letter-spacing:.08em; opacity:.72; }
.tde-role-license-summary strong { font-size:13px; }
.tde-role-license-summary span { font-size:11px; opacity:.82; }

/* Extracted from public/index.html style block 8 id=phase-x-hotfix5-backend-lock. */
#tdeBackendInteractionLock[hidden] { display:none !important; }
#tdeBackendInteractionLock {
    position:fixed;
    inset:0;
    z-index:19000;
    display:flex;
    align-items:center;
    justify-content:center;
    background:rgba(3,8,16,.42);
    backdrop-filter:blur(1.5px);
    cursor:not-allowed;
}
#tdeBackendInteractionLock .tde-backend-lock-card {
    max-width:520px;
    margin:24px;
    padding:18px 22px;
    border:1px solid rgba(255,69,58,.55);
    border-radius:12px;
    background:#101927;
    box-shadow:0 14px 40px rgba(0,0,0,.38);
    display:flex;
    flex-direction:column;
    gap:7px;
    text-align:center;
}
#tdeBackendInteractionLock strong {
    color:#ff6961;
    font-size:13px;
    letter-spacing:.06em;
}
#tdeBackendInteractionLock span {
    color:#c7d2e3;
    font-size:12px;
    line-height:1.45;
}

/* Extracted from public/index.html style block 9. */
/* BUTTON-DESIGNS FÜR DIE NEUE STARTSEITE */
        .btn-landing {
            display: inline-flex; align-items: center; justify-content: center;
            padding: 10px 22px; border-radius: 6px; font-size: 0.95rem; font-weight: 700;
            text-decoration: none; cursor: pointer; transition: all 0.18s ease-out; border: none;
        }
        .btn-landing-primary {
            background: var(--accent); color: #ffffff;
            box-shadow: 0 0 15px rgba(0, 122, 255, 0.45);
        }
        .btn-landing-primary:hover {
            background: #2a8fff; box-shadow: 0 0 20px rgba(0, 122, 255, 0.65);
        }
        .btn-landing-secondary {
            border: 2px solid var(--accent); color: var(--accent); background: transparent;
        }
        .btn-landing-secondary:hover {
            background: rgba(0, 127, 255, 0.12);
        }

        /* STRUKTUR-ELEMENTE DER STARTSEITE */
        .landing-section { padding: 35px 24px; border-top: 1px solid rgba(255,255,255,0.04); }
        .landing-section-inner { max-width: 960px; margin: 0 auto; }
        .landing-section-title { font-size: 1.4rem; margin-bottom: 12px; color: var(--accent-glow); font-weight: 700; }
        .landing-section-text { color: var(--text-muted); max-width: 720px; margin-bottom: 20px; font-size: 0.95rem; }

        /* GRID-LAYOUT FÜR KERNMODULE UND KEYPOINTS */
        .landing-grid-3 { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 15px; margin-top: 15px; }
        .landing-grid-4 { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 12px; }
        
        .landing-card {
            padding: 15px; border-radius: 8px; border: 1px solid rgba(255,255,255,0.06);
            background: radial-gradient(circle at top left, rgba(0,122,255,0.08), transparent 65%);
        }
        .landing-card-title { font-size: 1.05rem; margin-bottom: 6px; font-weight: 700; color: var(--text-main); }
        .landing-card-text { color: var(--text-muted); font-size: 0.9rem; margin-bottom: 8px; }
        
        .landing-list { list-style: none; padding-left: 0; color: var(--text-muted); font-size: 0.85rem; margin: 0; }
        .landing-list li { margin-bottom: 4px; padding-left: 12px; position: relative; }
        .landing-list li::before { content: "•"; color: var(--accent); position: absolute; left: 0; }

        .landing-two-column { display: grid; grid-template-columns: 1.3fr 1fr; gap: 20px; }

        .patent-badge {
            background-color: rgba(90, 200, 250, 0.1); color: var(--accent-glow);
            border: 1px solid rgba(90, 200, 250, 0.3); font-size: 10px; font-weight: 700;
            padding: 2px 6px; border-radius: 4px; letter-spacing: 0.5px;
        }
        
        /* TWO-SIDED TABS */
        .tabs { display: flex; border-bottom: 1px solid #2c2c2e; margin-bottom: 10px; height: 30px; justify-content: space-between; }
        .tabs-left { display: flex; }
        
        .tab-btn { 
            background: none; border: none; color: var(--text-muted); padding: 2px 18px; 
            cursor: pointer; font-size: 13px; font-weight: 600; transition: all 0.15s ease;
            text-transform: uppercase; letter-spacing: 0.3px;
        }
        .tab-btn:hover { color: var(--accent-glow); }
        .tab-btn.active { 
            color: #ffffff; border-bottom: 3px solid var(--accent); font-weight: 700; 
            text-shadow: 0 0 10px rgba(0, 122, 255, 0.5);
        }
        
        .tab-content { display: none; }
        .tab-content.active { 
            display: grid; grid-template-columns: 460px 1fr; gap: 15px; 
            height: calc(100vh - 115px); box-sizing: border-box;
        }

        /* Das scrollbare Farb-Radar-Pad */
        .color-radar-pad {
            background-color: #050505; color: #d1d1d6; border: 1px solid #2c2c2e; padding: 8px;
            font-family: 'SF Mono', Monaco, Consolas, monospace; font-size: 11px; line-height: 1.5;
            border-radius: 5px; width: 100%; height: 100%; box-sizing: border-box; overflow-y: auto; white-space: pre-wrap;
        }

        .radar-orange { background-color: #ff9f0a !important; color: #000000 !important; font-weight: bold; padding: 2px 4px; border-radius: 3px; display: block; margin-bottom: 2px; }
        .radar-rot { background-color: #ff3b30 !important; color: #ffffff !important; font-weight: bold; padding: 2px 4px; border-radius: 3px; display: block; margin-bottom: 2px; box-shadow: 0 0 8px rgba(255, 59, 48, 0.3); }
/* Rechtliche Sektion im warnenden Orange-Profil */
        .disclaimer-box {
            background-color: rgba(255, 159, 10, 0.05); border: 1px solid rgba(255, 159, 10, 0.3);
            border-radius: 6px; padding: 15px; margin-top: 15px;
        }

/* Extracted from public/index.html style block 10. */
/* Linke Spalte im edlen Studio-Look */
        .grid-left { 
            background-color: #1c1c1e; 
            padding: 12px; 
            border-radius: 8px; 
            border: 1px solid #2c2c2e; 
            height: 100%; 
            box-sizing: border-box; 
            display: flex; 
            flex-direction: column; 
            gap: 6px; 
            overflow: hidden; 
            box-shadow: 0 4px 12px rgba(0,0,0,0.3);
        }
        
        .grid-right { 
            height: 100%; 
            box-sizing: border-box; 
            display: flex;
            flex-direction: column;
            gap: 12px;
        }

        .btn-container { display: flex; gap: 8px; margin-top: 4px; margin-bottom: 4px; }
        
        /* Eisblaue Premium-Aktionsknöpfe */
        button { 
            background-color: var(--accent); 
            color: #ffffff; 
            border: none; 
            padding: 6px 14px; 
            cursor: pointer; 
            border-radius: 5px; 
            font-weight: 700; 
            font-size: 12px; 
            transition: background-color 0.15s ease;
            box-shadow: 0 2px 6px rgba(0, 122, 255, 0.2);
        }
        button:hover { background-color: #0051ba; }
        .btn-full { width: 100%; margin-bottom: 3px; }
        
        /* UNZERSTÖRBAR LESBAR: Die Rechen-Matrix wird tiefschwarz und gestochen scharf terminal-grün */
        textarea { 
            background-color: #050505; 
            color: #30d158 !important; 
            border: 1px solid #2c2c2e; 
            padding: 10px; 
            font-family: 'SF Mono', Monaco, Consolas, monospace; 
            font-size: 12px; 
            line-height: 1.45;
            border-radius: 5px; 
            width: 100%; 
            box-sizing: border-box; 
            resize: none; 
        }
        
        .matrix-title { 
            font-size: 12px; 
            font-weight: 700; 
            color: var(--accent-glow); 
            margin-bottom: 6px; 
            border-bottom: 1px solid #3a3a3c; 
            padding-bottom: 3px; 
            text-transform: uppercase; 
            letter-spacing: 0.6px;
        }
        
        /* SYNCHRON-REPARATUR: Feste Label-Breite zwingt alle weißen Eingabefelder in eine gerade Flucht */
        .form-group { display: flex; justify-content: space-between; align-items: center; margin-bottom: 5px; }
        label { font-size: 12px; width: 190px; color: #a2a2a7; font-weight: 500; text-align: left; }
        
        /* Einheitliche Optik für die weißen Eingaben und Dropdowns links */
        input, select { 
            background-color: #ffffff !important; 
            color: #000000 !important; 
            border: 1px solid #48484a; 
            padding: 5px 8px; 
            width: 210px; 
            border-radius: 5px; 
            font-size: 12px; 
            font-weight: 700;
            box-sizing: border-box; 
            transition: border-color 0.15s ease;
        }
        input:focus, select:focus { border-color: #5ac8fa; outline: none; box-shadow: 0 0 5px rgba(90, 200, 250, 0.2); }
        
        .risk-row { display: flex; gap: 10px; align-items: center; }
        .risk-group { display: flex; align-items: center; gap: 5px; }
        .risk-group input { width: 95px; }
        
        /* Unzerstörbarer Live-Journal-Behälter */
        .journal-container {
            max-height: calc(100vh - 170px);
            overflow-y: auto; 
            overflow-x: auto; 
            border: 1px solid #2c2c2e;
            border-radius: 6px;
            background-color: #0a0a0c;
        }

        .journal-table { width: 100%; border-collapse: collapse; font-size: 12px; }
        .journal-table th { 
            background-color: var(--accent); 
            color: #ffffff; 
            padding: 10px; 
            text-align: left; 
            position: sticky; 
            top: 0; 
            z-index: 10; 
            white-space: nowrap;
            font-weight: 700;
        }
        .journal-table td { padding: 10px; border-bottom: 1px solid #2c2c2e; color: #d1d1d6; white-space: nowrap; }
        .journal-table tr:hover { background-color: #1c1c1e; }
        
        .badge-tp { background-color: rgba(52, 199, 89, 0.15); color: #34c759; padding: 3px 8px; border-radius: 4px; font-weight: 700; border: 1px solid rgba(52, 199, 89, 0.4); }
        .badge-sl { background-color: rgba(255, 59, 48, 0.15); color: #ff3b30; padding: 3px 8px; border-radius: 4px; font-weight: 700; border: 1px solid rgba(255, 59, 48, 0.4); }
        .badge-manuell { background-color: rgba(255, 159, 10, 0.15); color: #ff9f0a; padding: 3px 8px; border-radius: 4px; font-weight: 700; border: 1px solid rgba(255, 159, 10, 0.4); }

        .legal-footer {
            height: 24px;
            margin-top: 10px;
            border-top: 1px solid #2c2c2e;
            display: flex;
            justify-content: space-between;
            align-items: center;
            font-size: 11px;
            color: #636366;
            font-weight: 500;
            letter-spacing: 0.3px;
        }

        /* Die Trade-Ergebnis Dropdowns sauber lesbar halten */
        #OutcomeChoiceDAX, #OutcomeChoiceFX {
            color: #000000 !important;
            background-color: #ffffff !important;
            border: 1px solid #48484a !important;
        }

        /* Signal-Rot NUR für die GBE ONE Knöpfe */
        button[onclick=""], .btn-full {
            transition: background-color 0.15s ease;
        }
        .btn-full[style*="background-color: #6c757d"],
        .btn-full[style*="background-color:#6c757d"] {
            background-color: #dc3545 !important;
            color: #ffffff !important;
            box-shadow: 0 2px 8px rgba(220, 53, 69, 0.4) !important;
            border: 1px solid #bd2130 !important;
        }
        .btn-full[style*="background-color: #6c757d"]:hover {
            background-color: #bd2130 !important;
        }

        /* Der fette Journal-Speicherknopf bleibt unzerstörbar GRÜN */
        .btn-green { 
            background-color: #34c759 !important; 
            color: #ffffff !important; 
            border: none !important; 
            padding: 6px 12px; 
            cursor: pointer; 
            border-radius: 5px; 
            font-weight: 700; 
            font-size: 13px; 
            width: 100%; 
            height: 34px; 
            box-shadow: 0 2px 6px rgba(52, 199, 89, 0.2);
        }
        .btn-green:hover { background-color: #248a3d !important; }

/* Extracted from public/index.html style block 11. */
/*
        Phase 2.1: reine Anzeige der vorhandenen MT5-Brokerverbindung.
        Dieser Bereich verändert weder Risiko-Eingaben noch Berechnungen.
    */
    .header-right-area {
        display: flex;
        align-items: center;
        justify-content: flex-end;
        gap: 12px;
    }

    .mt5-status-panel {
        display: flex;
        align-items: center;
        gap: 12px;
        min-height: 42px;
        padding: 5px 10px;
        background-color: #1c1c1e;
        border: 1px solid #3a3a3c;
        border-radius: 7px;
        box-sizing: border-box;
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.35);
    }

    .mt5-status-main {
        display: flex;
        align-items: center;
        gap: 7px;
        min-width: 130px;
        padding-right: 10px;
        border-right: 1px solid #3a3a3c;
    }

    .mt5-status-dot {
        width: 10px;
        height: 10px;
        flex: 0 0 10px;
        border-radius: 50%;
        background-color: #8e8e93;
        box-shadow: 0 0 7px rgba(142, 142, 147, 0.55);
    }

    .mt5-status-dot.connected {
        background-color: #30d158;
        box-shadow: 0 0 9px rgba(48, 209, 88, 0.8);
    }

    .mt5-status-dot.warning {
        background-color: #ff9f0a;
        box-shadow: 0 0 9px rgba(255, 159, 10, 0.8);
    }

    .mt5-status-dot.disconnected {
        background-color: #ff453a;
        box-shadow: 0 0 9px rgba(255, 69, 58, 0.8);
    }

    .mt5-status-text {
        display: flex;
        flex-direction: column;
        gap: 1px;
    }

    .mt5-status-title {
        color: #ffffff;
        font-size: 11px;
        font-weight: 800;
        line-height: 1.1;
        letter-spacing: 0.5px;
        text-transform: uppercase;
    }

    .mt5-status-subtitle {
        color: #8e8e93;
        font-size: 9px;
        font-weight: 600;
        line-height: 1.1;
    }

    .mt5-status-details {
        display: grid;
        grid-template-columns: auto auto auto;
        column-gap: 14px;
        align-items: center;
    }

    .mt5-status-item {
        display: flex;
        flex-direction: column;
        gap: 1px;
        white-space: nowrap;
    }

    .mt5-status-label {
        color: #8e8e93;
        font-size: 8px;
        font-weight: 700;
        line-height: 1;
        letter-spacing: 0.3px;
        text-transform: uppercase;
    }

    .mt5-status-value {
        color: #e5e5ea;
        font-size: 10px;
        font-weight: 700;
        line-height: 1.2;
    }

    .mt5-status-value.balance {
        color: #30d158;
        font-size: 11px;
    }

    @media (max-width: 1250px) {
        .header-right-area .patent-badge { display: none; }
    }

    @media (max-width: 950px) {
        .mt5-status-details { grid-template-columns: auto auto; }
        .mt5-status-item.mt5-server-item { display: none; }
    }

/* Extracted from public/index.html style block 12. */
/*
        Phase 2.2C: öffentliche Marktdaten aus GET /api/market/status.
        Dieser Bereich ist reine Anzeige und verändert keine Eingabefelder.
    */

    .market-status-strip {
        display: flex;
        align-items: stretch;
        gap: 8px;
        width: 100%;
        margin: 8px 0 10px 0;
        padding: 8px;
        overflow-x: auto;
        background: #111214;
        border: 1px solid #2c2c2e;
        border-radius: 8px;
        box-sizing: border-box;
        scrollbar-width: thin;
    }

    .market-status-summary {
        min-width: 150px;
        flex: 0 0 150px;
        display: flex;
        flex-direction: column;
        justify-content: center;
        gap: 3px;
        padding: 7px 10px;
        background: #1c1c1e;
        border: 1px solid #3a3a3c;
        border-radius: 6px;
    }

    .market-status-summary-main {
        display: flex;
        align-items: center;
        gap: 7px;
    }

    .market-status-dot {
        width: 9px;
        height: 9px;
        flex: 0 0 9px;
        border-radius: 50%;
        background: #8e8e93;
        box-shadow: 0 0 6px rgba(142, 142, 147, 0.55);
    }

    .market-status-dot.connected {
        background: #30d158;
        box-shadow: 0 0 8px rgba(48, 209, 88, 0.75);
    }

    .market-status-dot.warning {
        background: #ff9f0a;
        box-shadow: 0 0 8px rgba(255, 159, 10, 0.75);
    }

    .market-status-dot.disconnected {
        background: #ff453a;
        box-shadow: 0 0 8px rgba(255, 69, 58, 0.75);
    }

    .market-status-heading {
        color: #ffffff;
        font-size: 10px;
        font-weight: 800;
        letter-spacing: 0.5px;
        text-transform: uppercase;
    }

    .market-status-update {
        color: #8e8e93;
        font-size: 9px;
        font-weight: 600;
    }

    .market-quote-cards {
    display: flex;
    align-items: stretch;
    gap: 8px;
    min-width: max-content;
}
    .market-quote-card {
        min-width: 158px;
        padding: 7px 9px;
        background: #1c1c1e;
        border: 1px solid #3a3a3c;
        border-radius: 6px;
        box-sizing: border-box;
    }

    .market-quote-symbol {
        margin-bottom: 5px;
        color: #5ac8fa;
        font-size: 11px;
        font-weight: 800;
        letter-spacing: 0.4px;
    }

    .market-quote-grid {
        display: grid;
        grid-template-columns: repeat(3, auto);
        gap: 9px;
    }

    .market-quote-label {
        display: block;
        color: #8e8e93;
        font-size: 8px;
        font-weight: 700;
        text-transform: uppercase;
    }

    .market-quote-value {
        display: block;
        margin-top: 2px;
        color: #f2f2f7;
        font-size: 10px;
        font-weight: 700;
        white-space: nowrap;
    }

    .market-quote-value.spread {
        color: #ffcc00;
    }


    .market-quote-groups {
        display: flex; align-items: stretch; gap: 10px; min-width: max-content;
    }
    .market-quote-group {
        display: flex; align-items: stretch; gap: 7px; padding-right: 10px;
        border-right: 1px solid rgba(255,255,255,.08);
    }
    .market-quote-group:last-child { border-right: 0; padding-right: 0; }
    .market-quote-group-title {
        min-width: 58px; display: flex; align-items: center; justify-content: center;
        padding: 0 5px; color: #8ea1ba; font-size: 8px; font-weight: 800;
        letter-spacing: .08em; text-transform: uppercase; writing-mode: vertical-rl; transform: rotate(180deg);
    }
    .calendar-time-basis {
        margin: 0 0 6px; padding: 4px 7px; border-left: 2px solid #5ac8fa;
        color: #9fb1c7; background: rgba(90,200,250,.06); font-size: 9px; font-weight: 700;
    }
    .calendar-display-controls {
        display: flex; align-items: center; gap: 7px; margin: 6px 0; flex-wrap: wrap;
        color: #9fb1c7; font-size: 9px; font-weight: 700;
    }
    .calendar-display-controls select {
        min-width: 165px; padding: 5px 7px; border-radius: 6px; border: 1px solid rgba(255,255,255,.12);
        background: #111820; color: #eef3f9; font-size: 10px;
    }
    .calendar-impact-summary {
        display: flex; gap: 8px; flex-wrap: wrap; margin: 0 0 7px; font-size: 9px; font-weight: 800;
    }
    .calendar-impact-summary span { padding: 3px 6px; border-radius: 5px; background: rgba(255,255,255,.04); }
    .market-status-empty {
        min-width: 320px;
        display: flex;
        align-items: center;
        padding: 7px 10px;
        color: #8e8e93;
        font-size: 10px;
        font-weight: 600;
    }

    @media (max-width: 850px) {
        .market-status-strip {
            margin-top: 6px;
        }

        .market-status-summary {
            min-width: 135px;
        }

        .market-quote-card {
            min-width: 150px;
        }
    }

/* Extracted from public/index.html style block 13. */
/*
        Layout-Reparatur nach Einbau der öffentlichen Marktleiste.

        Ziele:
        - Der untere Dashboard-Inhalt bleibt vollständig sichtbar.
        - Kalender und News scrollen innerhalb ihrer eigenen Fenster.
        - Die gesamte Seite erhält keinen zusätzlichen Browser-Scrollbalken.
        - Eingabemasken, Berechnungen und Funktionen bleiben unverändert.
    */

    /*
        Die alte Berechnung lautete:
        height: calc(100vh - 115px);

        Durch Header, Marktleiste und Tabs werden jetzt
        ungefähr 205 Pixel oberhalb des Inhalts benötigt.
    */
    .tab-content.active {
        height: calc(100vh - 205px);
        min-height: 0;
        overflow: hidden;
    }

    /*
        Grid-Spalten müssen innerhalb der verfügbaren Höhe
        schrumpfen dürfen. Ohne min-height: 0 können Kinder
        ihre Eltern nach unten vergrößern.
    */
    .grid-left,
    .grid-right {
        min-height: 0;
        max-height: 100%;
    }

    /*
        Linke Eingabemaske:
        Bei kleineren Bildschirmhöhen darf ausschließlich
        die linke Spalte intern scrollen.
    */
    .tab-content.active > .grid-left {
        overflow-y: auto !important;
        overflow-x: hidden !important;
        scrollbar-width: thin;
    }

    /*
        Rechte Dashboard-Spalte bleibt auf die verfügbare
        Höhe begrenzt.
    */
    .tab-content.active > .grid-right {
        overflow: hidden;
        min-height: 0;
    }

    /*
        Der obere Bereich der rechten Spalte enthält
        Kalender und News. Auch dieser Bereich muss
        innerhalb der verfügbaren Höhe schrumpfen dürfen.
    */
    .grid-right > div:first-child {
        min-height: 0;
        overflow: hidden;
    }

    /*
        Die beiden direkten Kalender-/News-Boxen dürfen
        nicht über ihren übergeordneten Bereich hinauswachsen.
    */
    .grid-right > div:first-child > .matrix-box {
        min-height: 0;
        overflow: hidden;
    }

    /*
        Kalender und News scrollen ausschließlich innerhalb
        ihrer schwarzen Anzeigefenster.
    */
    .color-radar-pad {
        min-height: 0 !important;
        height: auto !important;
        overflow-y: auto !important;
        overflow-x: hidden !important;
        overscroll-behavior: contain;
        scrollbar-width: thin;
    }

    /*
        In den Kalender-/News-Boxen belegt das Radar-Fenster
        automatisch den noch freien Platz.
    */
    #CalendarDAX,
    #NewsDAX,
    #CalendarFX,
    #NewsFX {
        flex: 1 1 auto !important;
        min-height: 0 !important;
        height: 0 !important;
        overflow-y: auto !important;
    }

    /*
        Dezente Scrollbars für Chromium/Edge.
    */
    .color-radar-pad::-webkit-scrollbar,
    .grid-left::-webkit-scrollbar {
        width: 8px;
    }

    .color-radar-pad::-webkit-scrollbar-track,
    .grid-left::-webkit-scrollbar-track {
        background: #111214;
    }

    .color-radar-pad::-webkit-scrollbar-thumb,
    .grid-left::-webkit-scrollbar-thumb {
        background: #48484a;
        border-radius: 8px;
    }

    .color-radar-pad::-webkit-scrollbar-thumb:hover,
    .grid-left::-webkit-scrollbar-thumb:hover {
        background: #636366;
    }

    /*
        Anpassung für kleinere Bildschirmhöhen.
    */
    @media (max-height: 800px) {
        .tab-content.active {
            height: calc(100vh - 195px);
        }
    }

/* Extracted from public/index.html style block 14. */
#OutputDAX,
#OutputFX {

    overflow-y: auto !important;
    overflow-x: hidden !important;
    resize: none !important;

    min-height: 140px !important;
    max-height: 220px !important;

    white-space: pre-wrap;
    word-break: break-word;

    scrollbar-width: thin;
    overscroll-behavior: contain;
}

#OutputDAX::-webkit-scrollbar,
#OutputFX::-webkit-scrollbar{
    width:8px;
}

#OutputDAX::-webkit-scrollbar-thumb,
#OutputFX::-webkit-scrollbar-thumb{
    background:#555;
    border-radius:8px;
}

/* Extracted from public/index.html style block 15. */
/* ---------- LANDINGPAGE ---------- */

    .landing-page-wrapper {
        padding: 0;
        background:
            radial-gradient(circle at 50% -10%, rgba(0, 122, 255, 0.13), transparent 34%),
            linear-gradient(180deg, #0d0e11 0%, #121214 46%, #0d0e11 100%);
        scrollbar-color: #48484a #111214;
    }

    .landing-page-wrapper .hero {
        min-height: 58vh;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 72px 24px 58px;
        border-bottom: 1px solid rgba(255,255,255,0.06);
        box-sizing: border-box;
    }

    .landing-page-wrapper .hero-inner {
        max-width: 920px;
    }

    .landing-page-wrapper .hero-title {
        margin: 0 0 14px;
        font-size: clamp(2.15rem, 4vw, 3.35rem);
        line-height: 1.08;
        letter-spacing: 0.085em;
        text-shadow: 0 0 28px rgba(90, 200, 250, 0.11);
    }

    .landing-page-wrapper .hero-slogan {
        margin: 0;
        color: #d1d1d6;
        font-size: clamp(1rem, 2vw, 1.2rem);
        letter-spacing: 0.025em;
    }

    .landing-page-wrapper .landing-section {
        padding: 58px 24px;
        border-top: 1px solid rgba(255,255,255,0.055);
    }

    .landing-page-wrapper .landing-section-inner {
        max-width: 1080px;
    }

    .landing-page-wrapper .landing-section-title {
        margin: 0 0 14px;
        color: #f2f2f7;
        font-size: clamp(1.35rem, 2vw, 1.72rem);
        line-height: 1.25;
        letter-spacing: -0.015em;
    }

    .landing-page-wrapper .landing-section-title::after {
        content: "";
        display: block;
        width: 46px;
        height: 2px;
        margin-top: 11px;
        border-radius: 2px;
        background: linear-gradient(90deg, var(--accent), var(--accent-glow));
    }

    .landing-page-wrapper .landing-section-text {
        max-width: 790px;
        margin-top: 0;
        margin-bottom: 18px;
        color: #a7a7ad;
        font-size: 0.96rem;
        line-height: 1.72;
    }

    .landing-page-wrapper .landing-grid-3,
    .landing-page-wrapper .landing-grid-4 {
        gap: 16px;
    }

    .landing-page-wrapper .landing-card,
    .landing-page-wrapper .matrix-box {
        border: 1px solid rgba(255,255,255,0.085);
        border-radius: 8px;
        background:
            linear-gradient(180deg, rgba(255,255,255,0.025), rgba(255,255,255,0.008)),
            #17181b;
        box-shadow: 0 10px 28px rgba(0,0,0,0.18);
    }

    .landing-page-wrapper .landing-card {
        min-height: 112px;
        padding: 20px;
    }

    .landing-page-wrapper .landing-card:hover,
    .landing-page-wrapper .matrix-box:hover {
        border-color: rgba(90, 200, 250, 0.28);
        transform: translateY(-1px);
        transition: border-color 0.18s ease, transform 0.18s ease;
    }

    .landing-page-wrapper .landing-card-title {
        margin-top: 0;
        margin-bottom: 9px;
        color: #f2f2f7;
        font-size: 1.03rem;
    }

    .landing-page-wrapper .landing-card-text,
    .landing-page-wrapper .landing-list {
        color: #9b9ba1;
        line-height: 1.6;
    }

    .landing-page-wrapper .matrix-box {
        padding: 17px;
        color: #d7d7dc;
        line-height: 1.5;
    }

    .landing-page-wrapper .disclaimer-box {
        border-radius: 8px;
        padding: 20px;
        box-shadow: 0 8px 24px rgba(0,0,0,0.16);
    }

    .landing-page-wrapper .btn-landing {
        min-height: 42px;
        padding: 10px 25px;
        border-radius: 5px;
        letter-spacing: 0.015em;
    }

    .landing-page-wrapper .btn-landing-primary {
        background: linear-gradient(180deg, #1687ff, #0069d9);
        box-shadow: 0 8px 24px rgba(0, 122, 255, 0.26);
    }

    /* ---------- DASHBOARD ---------- */

    body {
        background:
            radial-gradient(circle at 50% 0%, rgba(0, 122, 255, 0.055), transparent 28%),
            #101114;
    }

    .header-container {
        min-height: 54px;
        margin-bottom: 8px;
        padding: 0 2px 8px;
        border-bottom: 1px solid #303238;
    }

    .brand-title {
        font-size: 18px;
        letter-spacing: 0.65px;
    }

    .mt5-status-panel,
    .market-status-strip,
    .grid-left,
    .journal-container {
        border-color: #303238;
        background-color: #17181b;
        box-shadow: 0 8px 24px rgba(0,0,0,0.18);
    }

    .market-status-strip {
        margin: 7px 0 9px;
        padding: 7px;
        border-radius: 7px;
    }

    .market-status-summary,
    .market-quote-card {
        border-color: #35373d;
        background: #1c1d21;
    }

    .tabs {
        height: 34px;
        margin-bottom: 11px;
        border-bottom-color: #303238;
    }

    .tab-btn {
        padding: 3px 17px;
        font-size: 12px;
        letter-spacing: 0.5px;
    }

    .tab-btn.active {
        border-bottom-width: 2px;
        text-shadow: none;
    }

    .tab-content.active {
        gap: 14px;
    }

    .grid-left {
        padding: 14px;
        border-radius: 7px;
        gap: 7px;
    }

    .grid-right {
        gap: 10px;
    }

    .matrix-box {
        border: 1px solid #34363c;
        border-radius: 7px;
        background: #1b1c20;
        box-sizing: border-box;
    }

    .matrix-title {
        color: #d9efff;
        font-size: 11px;
        letter-spacing: 0.75px;
        border-bottom-color: #34363c;
    }

    .form-group {
        min-height: 30px;
        margin-bottom: 4px;
    }

    label {
        color: #b0b0b6;
        font-size: 11px;
        letter-spacing: 0.01em;
    }

    input,
    select {
        min-height: 29px;
        border-color: #65676d;
        border-radius: 4px;
        font-size: 11px;
        box-shadow: inset 0 1px 1px rgba(0,0,0,0.08);
    }

    input:focus,
    select:focus {
        border-color: var(--accent);
        box-shadow: 0 0 0 2px rgba(0,122,255,0.16);
    }

    button {
        min-height: 30px;
        border-radius: 4px;
        letter-spacing: 0.01em;
        box-shadow: none;
    }

    button:hover {
        filter: brightness(1.08);
    }

    textarea,
    .color-radar-pad {
        border-color: #34363c;
        background-color: #08090b;
        box-shadow: inset 0 0 18px rgba(0,0,0,0.26);
    }

    #OutputDAX,
    #OutputFX {
        color: #46db72 !important;
        font-size: 11.5px;
        line-height: 1.5;
    }

    .journal-table th {
        background: #066fd8;
        font-size: 11px;
        letter-spacing: 0.3px;
    }

    .journal-table td {
        border-bottom-color: #292b30;
    }

    .legal-footer {
        border-top-color: #303238;
    }

    @media (max-width: 900px) {
        .landing-page-wrapper .hero {
            min-height: auto;
            padding-top: 54px;
        }

        .landing-page-wrapper .landing-section {
            padding: 44px 18px;
        }

        .landing-two-column {
            grid-template-columns: 1fr;
        }
    }

/* Extracted from public/index.html style block 16. */
/* ================================================================== */
/* LANDINGPAGE PROFESSIONAL EDITION V1                                 */
/* Eigenständige Produkt-Startseite im Stil moderner Trading-Software. */
/* Keine Dashboard-Berechnung oder Handelslogik wird verändert.        */
/* ================================================================== */

.landing-pro {
    --lp-bg: #0b0c0f;
    --lp-panel: #13151a;
    --lp-panel-2: #17191f;
    --lp-line: rgba(255,255,255,.08);
    --lp-line-strong: rgba(255,255,255,.14);
    --lp-text: #f2f4f7;
    --lp-muted: #969ba6;
    --lp-blue: #2962ff;
    --lp-cyan: #5ac8fa;
    --lp-green: #30d158;
    --lp-orange: #ff9f0a;
    color: var(--lp-text);
    background:
        radial-gradient(circle at 50% -12%, rgba(41,98,255,.18), transparent 31%),
        linear-gradient(180deg, #090a0d 0%, #0e0f13 42%, #090a0d 100%);
}

.landing-pro * {
    box-sizing: border-box;
}

.lp-shell {
    width: min(1180px, calc(100% - 40px));
    margin: 0 auto;
}

.lp-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 10px;
    border: 1px solid rgba(90,200,250,.28);
    border-radius: 5px;
    color: var(--lp-cyan);
    background: rgba(90,200,250,.055);
    font-size: 11px;
    font-weight: 750;
    letter-spacing: .085em;
    text-transform: uppercase;
}

.lp-eyebrow-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--lp-green);
    box-shadow: 0 0 10px rgba(48,209,88,.65);
}

.lp-hero {
    min-height: 76vh;
    display: grid;
    place-items: center;
    padding: 78px 0 66px;
    border-bottom: 1px solid var(--lp-line);
}

.lp-hero-inner {
    max-width: 980px;
    text-align: center;
}

.lp-title {
    margin: 22px 0 14px;
    color: #fff;
    font-size: clamp(2.55rem, 6vw, 5.15rem);
    line-height: .98;
    font-weight: 820;
    letter-spacing: -.045em;
}

.lp-subtitle {
    max-width: 790px;
    margin: 0 auto;
    color: #c8ccd4;
    font-size: clamp(1.05rem, 2.2vw, 1.35rem);
    line-height: 1.5;
}

.lp-workflow {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 0;
    margin: 27px 0 0;
    color: var(--lp-text);
    font-size: .88rem;
    font-weight: 750;
    letter-spacing: .055em;
    text-transform: uppercase;
}

.lp-workflow span {
    display: inline-flex;
    align-items: center;
}

.lp-workflow span:not(:last-child)::after {
    content: "";
    width: 22px;
    height: 1px;
    margin: 0 12px;
    background: rgba(90,200,250,.45);
}

.lp-hero-copy {
    max-width: 730px;
    margin: 26px auto 0;
    color: var(--lp-muted);
    font-size: .96rem;
    line-height: 1.72;
}

.lp-actions {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 31px;
}

.lp-button {
    min-width: 190px;
    min-height: 45px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    padding: 11px 20px;
    border: 1px solid transparent;
    border-radius: 6px;
    font-size: .9rem;
    font-weight: 750;
    text-decoration: none;
    transition: transform .16s ease, border-color .16s ease, background .16s ease;
}

.lp-button:hover {
    transform: translateY(-1px);
}

.lp-button-primary {
    color: #fff;
    background: linear-gradient(180deg, #3672ff, #2454dc);
    box-shadow: 0 12px 30px rgba(41,98,255,.26);
}

.lp-button-primary:hover {
    background: linear-gradient(180deg, #447cff, #2c5be5);
}

.lp-button-secondary {
    color: #e6e9ef;
    background: rgba(255,255,255,.025);
    border-color: var(--lp-line-strong);
}

.lp-button-secondary:hover {
    border-color: rgba(90,200,250,.42);
    background: rgba(90,200,250,.055);
}

.lp-hero-meta {
    margin-top: 19px;
    color: #6f7580;
    font-size: .72rem;
    letter-spacing: .035em;
}

.lp-section {
    padding: 76px 0;
    border-bottom: 1px solid var(--lp-line);
}

.lp-section-alt {
    background: rgba(255,255,255,.012);
}

.lp-section-head {
    max-width: 780px;
    margin-bottom: 31px;
}

.lp-kicker {
    margin-bottom: 9px;
    color: var(--lp-cyan);
    font-size: .7rem;
    font-weight: 760;
    letter-spacing: .105em;
    text-transform: uppercase;
}

.lp-heading {
    margin: 0;
    color: #f7f8fa;
    font-size: clamp(1.65rem, 3vw, 2.35rem);
    line-height: 1.16;
    letter-spacing: -.025em;
}

.lp-lead {
    margin: 15px 0 0;
    color: var(--lp-muted);
    font-size: .98rem;
    line-height: 1.72;
}

.lp-pillars {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
}

.lp-card {
    position: relative;
    min-width: 0;
    padding: 23px;
    border: 1px solid var(--lp-line);
    border-radius: 8px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.025), transparent),
        var(--lp-panel);
    box-shadow: 0 13px 30px rgba(0,0,0,.15);
    overflow: hidden;
}

.lp-card::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 2px;
    background: linear-gradient(180deg, var(--lp-blue), transparent 70%);
    opacity: .8;
}

.lp-card:hover {
    border-color: rgba(90,200,250,.25);
}

.lp-icon {
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    margin-bottom: 17px;
    border: 1px solid rgba(90,200,250,.18);
    border-radius: 7px;
    color: var(--lp-cyan);
    background: rgba(90,200,250,.045);
}

.lp-icon svg {
    width: 20px;
    height: 20px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.7;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.lp-card h3 {
    margin: 0 0 10px;
    color: #f2f4f7;
    font-size: 1rem;
    letter-spacing: .01em;
}

.lp-card p {
    margin: 0;
    color: var(--lp-muted);
    font-size: .88rem;
    line-height: 1.62;
}

.lp-card ul {
    margin: 13px 0 0;
    padding: 0;
    list-style: none;
    color: #a9aeb8;
    font-size: .82rem;
    line-height: 1.7;
}

.lp-card li {
    position: relative;
    padding-left: 13px;
}

.lp-card li::before {
    content: "";
    position: absolute;
    left: 0;
    top: .68em;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: var(--lp-blue);
}

.lp-split {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(300px, .85fr);
    gap: 34px;
    align-items: start;
}

.lp-copy-block {
    color: var(--lp-muted);
    font-size: .96rem;
    line-height: 1.78;
}

.lp-copy-block p {
    margin: 0 0 17px;
}

.lp-principles {
    display: grid;
    gap: 10px;
}

.lp-principle {
    display: grid;
    grid-template-columns: 34px 1fr;
    gap: 13px;
    align-items: start;
    padding: 16px;
    border: 1px solid var(--lp-line);
    border-radius: 7px;
    background: var(--lp-panel);
}

.lp-principle-index {
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    border-radius: 6px;
    color: var(--lp-cyan);
    background: rgba(41,98,255,.11);
    font-size: .75rem;
    font-weight: 800;
}

.lp-principle strong {
    display: block;
    margin-bottom: 4px;
    color: #e9ecf1;
    font-size: .88rem;
}

.lp-principle span {
    color: var(--lp-muted);
    font-size: .8rem;
    line-height: 1.5;
}

.lp-timeline {
    position: relative;
    display: grid;
    grid-template-columns: repeat(8, minmax(100px, 1fr));
    gap: 12px;
    margin-top: 37px;
}

.lp-timeline::before {
    content: "";
    position: absolute;
    top: 21px;
    left: 6.25%;
    right: 6.25%;
    height: 1px;
    background: linear-gradient(90deg, var(--lp-blue), rgba(90,200,250,.5), rgba(48,209,88,.55));
}

.lp-step {
    position: relative;
    text-align: center;
}

.lp-step-dot {
    position: relative;
    z-index: 1;
    width: 43px;
    height: 43px;
    display: grid;
    place-items: center;
    margin: 0 auto 14px;
    border: 1px solid rgba(90,200,250,.3);
    border-radius: 50%;
    color: #fff;
    background: #11141a;
    box-shadow: 0 0 0 6px #0e0f13;
    font-size: .72rem;
    font-weight: 800;
}

.lp-step h3 {
    margin: 0 0 6px;
    color: #e9ecf1;
    font-size: .82rem;
}

.lp-step p {
    margin: 0;
    color: var(--lp-muted);
    font-size: .72rem;
    line-height: 1.45;
}

.lp-note {
    margin-top: 32px;
    padding: 19px 21px;
    border: 1px solid rgba(90,200,250,.18);
    border-radius: 8px;
    background: rgba(90,200,250,.025);
    color: #aeb3bd;
    font-size: .88rem;
    line-height: 1.68;
}

.lp-note strong {
    color: var(--lp-cyan);
}

.lp-roadmap {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 14px;
}

.lp-roadmap-card {
    min-height: 235px;
}

.lp-roadmap-status {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    margin-bottom: 17px;
    font-size: .7rem;
    font-weight: 790;
    letter-spacing: .07em;
    text-transform: uppercase;
}

.lp-roadmap-status::before {
    content: "";
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: currentColor;
    box-shadow: 0 0 9px currentColor;
}

.lp-status-live { color: var(--lp-green); }
.lp-status-build { color: var(--lp-orange); }
.lp-status-vision { color: var(--lp-cyan); }

.lp-roadmap-card h3 {
    margin: 0 0 7px;
    color: #f3f5f8;
    font-size: 1.13rem;
}

.lp-roadmap-card > p {
    margin: 0 0 15px;
    color: var(--lp-muted);
    font-size: .82rem;
    line-height: 1.55;
}

.lp-roadmap-card ul {
    margin-top: 0;
}

.lp-status-panel {
    display: grid;
    grid-template-columns: 1.2fr 1fr 1fr 1.2fr;
    border: 1px solid var(--lp-line);
    border-radius: 9px;
    background: var(--lp-panel);
    overflow: hidden;
}

.lp-status-item {
    min-height: 118px;
    padding: 22px;
    border-right: 1px solid var(--lp-line);
}

.lp-status-item:last-child {
    border-right: none;
}

.lp-status-label {
    display: block;
    margin-bottom: 14px;
    color: #707681;
    font-size: .67rem;
    font-weight: 760;
    letter-spacing: .09em;
    text-transform: uppercase;
}

.lp-status-value {
    display: block;
    color: #f3f5f8;
    font-size: 1.03rem;
    font-weight: 760;
    line-height: 1.35;
}

.lp-status-value.is-green {
    color: var(--lp-green);
}

.lp-progress {
    margin-top: 18px;
    padding: 20px 22px;
    border: 1px solid var(--lp-line);
    border-radius: 8px;
    background: var(--lp-panel);
}

.lp-progress-head {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 11px;
    color: #dfe2e7;
    font-size: .81rem;
    font-weight: 700;
}

.lp-progress-head span:last-child {
    color: var(--lp-cyan);
}

.lp-progress-track {
    height: 6px;
    border-radius: 10px;
    background: rgba(255,255,255,.07);
    overflow: hidden;
}

.lp-progress-bar {
    width: 70%;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, var(--lp-blue), var(--lp-cyan));
}

.lp-modules {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 14px;
}

.lp-module {
    min-height: 184px;
}

.lp-disclaimer {
    padding: 31px;
    border: 1px solid rgba(255,159,10,.22);
    border-radius: 9px;
    background:
        linear-gradient(115deg, rgba(255,159,10,.055), transparent 48%),
        var(--lp-panel);
}

.lp-disclaimer-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 24px;
    margin-bottom: 24px;
}

.lp-disclaimer-head h2 {
    margin: 0 0 9px;
    color: #f2f4f7;
    font-size: 1.35rem;
}

.lp-disclaimer-head p {
    max-width: 790px;
    margin: 0;
    color: #a9aeb8;
    font-size: .87rem;
    line-height: 1.65;
}

.lp-risk-badge {
    flex: 0 0 auto;
    padding: 8px 12px;
    border: 1px solid rgba(255,159,10,.35);
    border-radius: 5px;
    color: var(--lp-orange);
    background: rgba(255,159,10,.055);
    font-size: .7rem;
    font-weight: 780;
    letter-spacing: .08em;
    text-transform: uppercase;
    white-space: nowrap;
}

.lp-disclaimer-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
}

.lp-disclaimer-item {
    padding: 18px;
    border: 1px solid var(--lp-line);
    border-radius: 7px;
    background: rgba(255,255,255,.018);
}

.lp-disclaimer-item strong {
    display: block;
    margin-bottom: 8px;
    color: #eceff4;
    font-size: .85rem;
}

.lp-disclaimer-item p {
    margin: 0;
    color: var(--lp-muted);
    font-size: .8rem;
    line-height: 1.62;
}

.lp-final {
    padding: 82px 0 48px;
    text-align: center;
}

.lp-final h2 {
    margin: 0;
    color: #fff;
    font-size: clamp(1.9rem, 4vw, 3rem);
    letter-spacing: -.025em;
}

.lp-final p {
    max-width: 650px;
    margin: 15px auto 0;
    color: var(--lp-muted);
    font-size: .94rem;
    line-height: 1.68;
}

.lp-footer {
    padding: 24px 0 30px;
    border-top: 1px solid var(--lp-line);
}

.lp-footer-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 18px;
}

.lp-footer-brand {
    color: #d9dde4;
    font-size: .78rem;
    font-weight: 700;
}

.lp-footer-sub {
    margin-top: 4px;
    color: #686e79;
    font-size: .68rem;
}

.lp-footer-links {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 16px;
}

.lp-footer-link {
    min-height: auto;
    padding: 0;
    border: none;
    color: #858b96;
    background: transparent;
    box-shadow: none;
    font-size: .72rem;
    font-weight: 650;
}

.lp-footer-link:hover {
    color: var(--lp-cyan);
    background: transparent;
    filter: none;
}

.lp-legal-panel {
    display: none;
    margin-top: 18px;
    padding: 20px;
    border: 1px solid var(--lp-line);
    border-radius: 7px;
    background: var(--lp-panel);
    text-align: left;
}

.lp-legal-panel.is-open {
    display: block;
}

.lp-legal-panel h3 {
    margin: 0 0 10px;
    color: #f1f3f6;
    font-size: 1rem;
}

.lp-legal-panel h4 {
    margin: 18px 0 6px;
    color: #dfe3e9;
    font-size: .84rem;
}

.lp-legal-panel h4:first-of-type {
    margin-top: 12px;
}

.lp-legal-placeholder {
    display: inline-block;
    padding: 2px 6px;
    border: 1px solid rgba(255,159,10,.28);
    border-radius: 4px;
    color: var(--lp-orange);
    background: rgba(255,159,10,.055);
    font-weight: 700;
}

.lp-legal-panel p,
.lp-legal-panel li {
    color: var(--lp-muted);
    font-size: .8rem;
    line-height: 1.62;
}

.lp-legal-warning {
    color: var(--lp-orange) !important;
    font-weight: 700;
}

@media (max-width: 1020px) {
    .lp-pillars,
    .lp-modules {
        grid-template-columns: repeat(2, 1fr);
    }

    .lp-timeline {
        grid-template-columns: repeat(4, 1fr);
        row-gap: 30px;
    }

    .lp-timeline::before {
        display: none;
    }

    .lp-status-panel {
        grid-template-columns: repeat(2, 1fr);
    }

    .lp-status-item:nth-child(2) {
        border-right: none;
    }

    .lp-status-item:nth-child(-n+2) {
        border-bottom: 1px solid var(--lp-line);
    }
}

@media (max-width: 760px) {
    .lp-shell {
        width: min(100% - 28px, 1180px);
    }

    .lp-hero {
        min-height: auto;
        padding: 58px 0 50px;
    }

    .lp-title {
        font-size: clamp(2.25rem, 13vw, 3.6rem);
    }

    .lp-workflow {
        gap: 8px 13px;
    }

    .lp-workflow span:not(:last-child)::after {
        display: none;
    }

    .lp-section {
        padding: 56px 0;
    }

    .lp-pillars,
    .lp-roadmap,
    .lp-modules,
    .lp-split,
    .lp-status-panel {
        grid-template-columns: 1fr;
    }

    .lp-timeline {
        grid-template-columns: repeat(2, 1fr);
    }

    .lp-status-item,
    .lp-status-item:nth-child(2) {
        border-right: none;
        border-bottom: 1px solid var(--lp-line);
    }

    .lp-status-item:last-child {
        border-bottom: none;
    }

    .lp-disclaimer-head {
        flex-direction: column;
    }

    .lp-disclaimer-grid {
        grid-template-columns: 1fr;
    }

    .lp-risk-badge {
        align-self: flex-start;
    }

    .lp-footer-row {
        align-items: flex-start;
        flex-direction: column;
    }

    .lp-footer-links {
        justify-content: flex-start;
    }
}


/* HOTFIX-42: JForex calendar uses deterministic UTC -> browser time. */
.calendar-display-controls.calendar-time-fixed strong {
    padding: 5px 7px;
    border-radius: 6px;
    border: 1px solid rgba(255,255,255,.12);
    background: #111820;
    color: #eef3f9;
    font-size: 10px;
    font-weight: 700;
}
