:root {
        --bg: #07101f;
        --bg2: #0b1727;
        --card: #0d1b2e;
        --border: #172d47;
        --border-lt: #1d3a58;
        --gold: #c9a766;
        --gold-d: #7a5f2e;
        --gold-bg: rgba(201, 167, 102, 0.08);
        --silver: #8faabb;
        --text: #dae8f3;
        --dim: #5d7d98;
        --muted: #2e4862;
        --green: #4db87f;
        --green-bg: rgba(77, 184, 127, 0.09);
        --red: #df5f5f;
        --yellow: #e0be48;
        --mono: "JetBrains Mono", monospace;
        --disp: "Barlow Condensed", sans-serif;
        --body: "DM Sans", sans-serif;
        --radius: 4px;
      }
      *,
      *::before,
      *::after {
        box-sizing: border-box;
        margin: 0;
        padding: 0;
      }
      body {
        background: var(--bg);
        color: var(--text);
        font-family: var(--body);
        font-size: 15px;
        line-height: 1.65;
      }
      :focus-visible {
        outline: 2px solid var(--gold);
        outline-offset: 2px;
      }

      /* NAV */
      nav {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        z-index: 200;
        height: 60px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 0 48px;
        background: rgba(7, 16, 31, 0.94);
        backdrop-filter: blur(20px);
        border-bottom: 1px solid var(--border);
      }
      .nav-logo {
        display: flex;
        align-items: center;
        gap: 10px;
        text-decoration: none;
        color: var(--text);
      }
      .nav-logo img {
        width: 28px;
        height: 28px;
        border-radius: 50%;
      }
      .nav-logo-name {
        font-family: var(--disp);
        font-size: 17px;
        font-weight: 700;
        letter-spacing: 0.14em;
      }
      .nav-center {
        font-family: var(--mono);
        font-size: 10px;
        letter-spacing: 0.14em;
        color: var(--dim);
      }
      .nav-back {
        font-family: var(--mono);
        font-size: 11px;
        letter-spacing: 0.08em;
        color: var(--dim);
        text-decoration: none;
        transition: color 0.2s;
        padding: 8px 0;
      }
      .nav-back:hover {
        color: var(--gold);
      }

      /* HERO */
      .hero {
        max-width: 1200px;
        margin: 0 auto;
        padding: 108px 48px 52px;
      }
      .hero-eyebrow {
        font-family: var(--mono);
        font-size: 11px;
        letter-spacing: 0.18em;
        color: var(--gold);
        text-transform: uppercase;
        margin-bottom: 16px;
        display: flex;
        align-items: center;
        gap: 12px;
      }
      .hero-eyebrow::before {
        content: "";
        display: block;
        width: 20px;
        height: 1px;
        background: var(--gold);
      }
      .hero h1 {
        font-family: var(--disp);
        font-size: clamp(38px, 5vw, 64px);
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.03em;
        line-height: 1.05;
        margin-bottom: 16px;
        text-wrap: balance;
      }
      .hero h1 em {
        font-style: normal;
        color: var(--gold);
      }
      .hero-sub {
        font-size: 15px;
        color: var(--dim);
        max-width: 620px;
        line-height: 1.8;
        margin-bottom: 28px;
      }
      .hero-chips {
        display: flex;
        flex-wrap: wrap;
        gap: 9px;
      }
      .chip {
        font-family: var(--mono);
        font-size: 10px;
        letter-spacing: 0.09em;
        padding: 5px 12px;
        border: 1px solid var(--border-lt);
        color: var(--dim);
        background: var(--bg2);
        border-radius: var(--radius);
      }
      .chip.ok {
        border-color: rgba(77, 184, 127, 0.4);
        color: var(--green);
        background: var(--green-bg);
      }
      .chip.warn {
        border-color: rgba(224, 190, 72, 0.3);
        color: var(--yellow);
        background: rgba(224, 190, 72, 0.07);
      }

      /* TABS */
      .tabs-wrap {
        max-width: 1200px;
        margin: 0 auto;
        padding: 0 48px;
      }
      .tab-nav {
        display: flex;
        border-bottom: 1px solid var(--border);
        margin-bottom: 44px;
        gap: 4px;
      }
      .tab-btn {
        font-family: var(--mono);
        font-size: 11px;
        letter-spacing: 0.1em;
        text-transform: uppercase;
        padding: 13px 24px;
        background: none;
        border: none;
        border-bottom: 2px solid transparent;
        margin-bottom: -1px;
        color: var(--muted);
        cursor: pointer;
        transition:
          color 0.2s,
          border-color 0.2s;
        border-radius: var(--radius) var(--radius) 0 0;
      }
      .tab-btn:hover {
        color: var(--silver);
      }
      .tab-btn.on {
        color: var(--gold);
        border-bottom-color: var(--gold);
      }
      .tab-panel {
        display: none;
      }
      .tab-panel.on {
        display: block;
      }

      /* SECTION ANATOMY */
      .sec-wrap {
        margin-bottom: 52px;
      }
      .sec-head {
        margin-bottom: 28px;
      }
      .sec-title {
        font-family: var(--disp);
        font-size: 24px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.05em;
        color: var(--text);
        margin-bottom: 8px;
      }
      .sec-desc {
        font-size: 14px;
        color: var(--dim);
        max-width: 700px;
        line-height: 1.8;
      }
      .sec-divider {
        height: 1px;
        background: var(--border);
        margin: 44px 0 40px;
      }

      /* TABLES */
      .tbl-wrap {
        overflow-x: auto;
        margin-bottom: 8px;
        border: 1px solid var(--border);
        border-radius: var(--radius);
      }
      table.comp {
        width: 100%;
        border-collapse: collapse;
        font-family: var(--mono);
        font-size: 12px;
      }
      table.comp th {
        background: var(--bg2);
        padding: 12px 16px;
        text-align: left;
        font-size: 10px;
        letter-spacing: 0.12em;
        text-transform: uppercase;
        color: var(--dim);
        border-bottom: 1px solid var(--border);
        white-space: nowrap;
      }
      table.comp th.hl {
        color: var(--gold);
        background: var(--gold-bg);
      }
      table.comp td {
        padding: 10px 16px;
        border-bottom: 1px solid rgba(23, 45, 71, 0.6);
        color: var(--text);
        white-space: nowrap;
      }
      table.comp td.label {
        color: var(--dim);
        font-size: 11px;
        letter-spacing: 0.03em;
      }
      table.comp td.hl {
        color: var(--gold);
        background: rgba(201, 167, 102, 0.03);
      }
      table.comp tr.group td {
        background: var(--bg2);
        color: var(--muted);
        font-size: 9px;
        letter-spacing: 0.18em;
        text-transform: uppercase;
        padding: 6px 16px;
        border-bottom: 1px solid var(--border);
      }
      table.comp tr:hover td {
        background: rgba(255, 255, 255, 0.015);
      }
      .pos {
        color: var(--green) !important;
      }
      .neg {
        color: var(--red) !important;
      }
      .nm {
        color: var(--muted) !important;
        font-style: italic;
      }

      /* CHARTS */
      .chart-row {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 18px;
        margin-bottom: 8px;
      }
      .chart-box {
        background: var(--card);
        border: 1px solid var(--border);
        padding: 24px 24px 20px;
        border-radius: var(--radius);
      }
      .chart-box-title {
        font-family: var(--mono);
        font-size: 10px;
        letter-spacing: 0.14em;
        text-transform: uppercase;
        color: var(--silver);
        margin-bottom: 6px;
      }
      .chart-box-desc {
        font-size: 12px;
        color: var(--dim);
        margin-bottom: 18px;
        line-height: 1.6;
      }
      .chart-box canvas {
        max-height: 220px;
      }

      /* INSIGHT CARDS */
      .ins-grid {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 13px;
        margin-bottom: 8px;
      }
      .ins-card {
        background: var(--card);
        border: 1px solid var(--border);
        border-left: 3px solid var(--gold-d);
        padding: 20px 22px;
        border-radius: 0 var(--radius) var(--radius) 0;
      }
      .ins-label {
        font-family: var(--mono);
        font-size: 9px;
        letter-spacing: 0.15em;
        text-transform: uppercase;
        color: var(--gold);
        margin-bottom: 6px;
      }
      .ins-heading {
        font-size: 15px;
        font-weight: 500;
        color: var(--text);
        margin-bottom: 8px;
      }
      .ins-card p {
        font-size: 13px;
        color: var(--dim);
        line-height: 1.72;
      }

      /* DCF SCENARIOS */
      .scen-row {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
        gap: 13px;
        margin-bottom: 20px;
      }
      .scen {
        background: var(--card);
        border: 1px solid var(--border);
        padding: 28px 22px;
        text-align: center;
        position: relative;
        overflow: hidden;
        border-radius: var(--radius);
      }
      .scen::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        height: 3px;
      }
      .scen.bear::before {
        background: var(--red);
      }
      .scen.base::before {
        background: var(--gold);
      }
      .scen.bull::before {
        background: var(--green);
      }
      .scen-case {
        font-family: var(--mono);
        font-size: 9px;
        letter-spacing: 0.18em;
        text-transform: uppercase;
        margin-bottom: 10px;
      }
      .scen.bear .scen-case {
        color: var(--red);
      }
      .scen.base .scen-case {
        color: var(--gold);
      }
      .scen.bull .scen-case {
        color: var(--green);
      }
      .scen-price {
        font-family: var(--disp);
        font-size: 56px;
        font-weight: 700;
        line-height: 1;
        margin-bottom: 4px;
        transition: all 0.3s ease;
      }
      .scen.bear .scen-price {
        color: var(--red);
      }
      .scen.base .scen-price {
        color: var(--gold);
      }
      .scen.bull .scen-price {
        color: var(--green);
      }
      .scen-sub {
        font-family: var(--mono);
        font-size: 9px;
        letter-spacing: 0.1em;
        color: var(--muted);
        margin-bottom: 16px;
      }
      .scen-detail {
        font-size: 12px;
        color: var(--dim);
        line-height: 1.75;
      }

      /* INTERACTIVE CONTROLS */
      .dcf-controls {
        background: var(--card);
        border: 1px solid var(--border-lt);
        padding: 28px 32px;
        margin-bottom: 20px;
        border-radius: var(--radius);
      }
      .dcf-ctrl-hdr {
        display: flex;
        align-items: center;
        gap: 12px;
        margin-bottom: 24px;
      }
      .dcf-ctrl-title {
        font-family: var(--disp);
        font-size: 20px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.06em;
      }
      .dcf-ctrl-desc {
        font-size: 13px;
        color: var(--dim);
        margin-bottom: 24px;
        line-height: 1.7;
      }
      .dcf-ctrl-badge {
        font-family: var(--mono);
        font-size: 9px;
        letter-spacing: 0.12em;
        text-transform: uppercase;
        padding: 4px 9px;
        border-radius: var(--radius);
        background: var(--green-bg);
        color: var(--green);
        border: 1px solid rgba(77, 184, 127, 0.3);
      }
      .dcf-sliders {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
        gap: 28px;
      }
      .slider-group label {
        display: flex;
        justify-content: space-between;
        align-items: baseline;
        font-size: 13px;
        color: var(--silver);
        margin-bottom: 10px;
      }
      .slider-group label span {
        font-family: var(--mono);
        font-size: 15px;
        font-weight: 500;
        color: var(--gold);
      }
      .slider-group input[type="range"] {
        width: 100%;
        height: 4px;
        appearance: none;
        background: var(--border-lt);
        border-radius: 2px;
        cursor: pointer;
        outline: none;
      }
      .slider-group input[type="range"]::-webkit-slider-thumb {
        appearance: none;
        width: 18px;
        height: 18px;
        border-radius: 50%;
        background: var(--gold);
        border: 2px solid var(--bg);
        cursor: pointer;
        transition: background 0.2s;
      }
      .slider-group input[type="range"]:hover::-webkit-slider-thumb {
        background: #d4b880;
      }
      .slider-group input[type="range"]::-moz-range-thumb {
        width: 18px;
        height: 18px;
        border-radius: 50%;
        background: var(--gold);
        border: 2px solid var(--bg);
        cursor: pointer;
      }
      .slider-hint {
        font-family: var(--mono);
        font-size: 10px;
        color: var(--muted);
        margin-top: 6px;
      }
      .dcf-reset {
        display: inline-block;
        margin-top: 20px;
        font-family: var(--mono);
        font-size: 10px;
        letter-spacing: 0.1em;
        text-transform: uppercase;
        padding: 8px 16px;
        background: none;
        border: 1px solid var(--border-lt);
        color: var(--dim);
        cursor: pointer;
        border-radius: var(--radius);
        transition: all 0.2s;
      }
      .dcf-reset:hover {
        border-color: var(--gold-d);
        color: var(--gold);
      }

      /* PROBABILITY BANNER */
      .prob-banner {
        background: var(--gold-bg);
        border: 1px solid var(--gold-d);
        padding: 22px 28px;
        border-radius: var(--radius);
        display: flex;
        align-items: center;
        justify-content: space-between;
        flex-wrap: wrap;
        gap: 16px;
        margin-bottom: 8px;
      }
      .prob-title {
        font-family: var(--mono);
        font-size: 10px;
        letter-spacing: 0.15em;
        text-transform: uppercase;
        color: var(--gold);
        margin-bottom: 4px;
      }
      .prob-note {
        font-size: 13px;
        color: var(--dim);
        max-width: 400px;
        line-height: 1.6;
      }
      .prob-vals {
        display: flex;
        gap: 44px;
        flex-wrap: wrap;
      }
      .prob-item .pv {
        font-family: var(--disp);
        font-size: 40px;
        font-weight: 700;
        color: var(--gold);
        line-height: 1;
      }
      .prob-item .pd {
        font-family: var(--mono);
        font-size: 9px;
        letter-spacing: 0.1em;
        text-transform: uppercase;
        color: var(--muted);
        margin-top: 3px;
      }
      .prob-delta {
        font-family: var(--mono);
        font-size: 12px;
        color: var(--green);
      }

      /* RISK TABLE */
      .risk-wrap {
        overflow-x: auto;
        margin-bottom: 8px;
      }
      table.risk {
        width: 100%;
        border-collapse: collapse;
        border: 1px solid var(--border);
        border-radius: var(--radius);
        overflow: hidden;
      }
      table.risk thead th {
        font-family: var(--mono);
        font-size: 9px;
        letter-spacing: 0.15em;
        text-transform: uppercase;
        color: var(--dim);
        padding: 11px 16px;
        text-align: left;
        background: var(--bg2);
        border-bottom: 1px solid var(--border);
      }
      table.risk tbody td {
        padding: 14px 16px;
        border-bottom: 1px solid rgba(23, 45, 71, 0.5);
        vertical-align: top;
      }
      table.risk tbody tr:hover td {
        background: rgba(255, 255, 255, 0.013);
      }
      .risk-name {
        font-size: 14px;
        font-weight: 500;
        color: var(--text);
        margin-bottom: 3px;
      }
      .risk-note {
        font-size: 12px;
        color: var(--dim);
      }
      .risk-sens {
        font-size: 13px;
        color: var(--dim);
      }
      .badge {
        font-family: var(--mono);
        font-size: 10px;
        letter-spacing: 0.05em;
        padding: 4px 9px;
        border-radius: var(--radius);
        display: inline-block;
        white-space: nowrap;
      }
      .badge-low {
        background: rgba(77, 184, 127, 0.12);
        color: var(--green);
        border: 1px solid rgba(77, 184, 127, 0.25);
      }
      .badge-med {
        background: rgba(224, 190, 72, 0.12);
        color: var(--yellow);
        border: 1px solid rgba(224, 190, 72, 0.25);
      }
      .badge-high {
        background: rgba(223, 95, 95, 0.12);
        color: var(--red);
        border: 1px solid rgba(223, 95, 95, 0.25);
      }
      .badge-ok {
        background: rgba(77, 184, 127, 0.1);
        color: var(--green);
        border: 1px solid rgba(77, 184, 127, 0.2);
      }
      .badge-warn {
        background: rgba(224, 190, 72, 0.1);
        color: var(--yellow);
        border: 1px solid rgba(224, 190, 72, 0.2);
      }
      .badge-track {
        background: rgba(143, 170, 187, 0.1);
        color: var(--silver);
        border: 1px solid rgba(143, 170, 187, 0.2);
      }

      /* MILESTONES */
      .ms-track {
        border-left: 2px solid var(--border-lt);
        padding-left: 28px;
        margin-bottom: 8px;
      }
      .ms-item {
        position: relative;
        padding: 10px 0;
      }
      .ms-item::before {
        content: "";
        position: absolute;
        left: -35px;
        top: 16px;
        width: 10px;
        height: 10px;
        border-radius: 50%;
        border: 2px solid var(--border-lt);
        background: var(--bg);
      }
      .ms-item.done::before {
        border-color: var(--green);
        background: var(--green);
        box-shadow: 0 0 8px rgba(77, 184, 127, 0.4);
      }
      .ms-item.pend::before {
        border-color: var(--yellow);
      }
      .ms-item.track::before {
        border-color: var(--gold);
        background: rgba(201, 167, 102, 0.3);
      }
      .ms-date {
        font-family: var(--mono);
        font-size: 10px;
        letter-spacing: 0.08em;
        color: var(--muted);
        margin-bottom: 2px;
      }
      .ms-name {
        font-size: 14px;
        font-weight: 500;
        color: var(--text);
        margin-bottom: 2px;
      }
      .ms-impact {
        font-size: 13px;
        color: var(--dim);
      }

      /* TAKEAWAYS */
      .ai-wrap {
        max-width: 1200px;
        margin: 0 auto;
        padding: 52px 48px 80px;
        border-top: 1px solid var(--border);
      }
      .ai-hdr {
        display: flex;
        align-items: center;
        gap: 14px;
        margin-bottom: 32px;
      }
      .ai-dot {
        width: 8px;
        height: 8px;
        border-radius: 50%;
        background: var(--green);
        box-shadow: 0 0 10px rgba(77, 184, 127, 0.5);
        flex-shrink: 0;
      }
      .ai-ttl {
        font-family: var(--disp);
        font-size: 26px;
        font-weight: 700;
        letter-spacing: 0.08em;
        text-transform: uppercase;
      }
      .ai-sub {
        font-size: 13px;
        color: var(--dim);
        margin-top: 2px;
      }
      .tk-grid {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 13px;
      }
      .tk-card {
        background: var(--card);
        border: 1px solid var(--border);
        padding: 22px 24px;
        border-radius: var(--radius);
        border-left: 3px solid var(--border);
      }
      .tk-card.tk-nvda {
        border-left-color: var(--gold);
      }
      .tk-card.tk-t1 {
        border-left-color: var(--silver);
      }
      .tk-card.tk-both {
        border-left-color: var(--green);
        grid-column: 1 / -1;
      }
      .tk-co {
        font-family: var(--mono);
        font-size: 9px;
        letter-spacing: 0.18em;
        text-transform: uppercase;
        margin-bottom: 6px;
      }
      .tk-nvda .tk-co {
        color: var(--gold);
      }
      .tk-t1 .tk-co {
        color: var(--silver);
      }
      .tk-both .tk-co {
        color: var(--green);
      }
      .tk-heading {
        font-size: 15px;
        font-weight: 500;
        color: var(--text);
        margin-bottom: 9px;
      }
      .tk-card p {
        font-size: 13px;
        color: var(--dim);
        line-height: 1.72;
      }
      .tk-card p strong {
        color: var(--text);
        font-weight: 500;
      }

      /* FOOTER */
      footer {
        background: var(--bg2);
        border-top: 1px solid var(--border);
        padding: 22px 48px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        flex-wrap: wrap;
        gap: 10px;
        font-family: var(--mono);
        font-size: 10px;
        color: var(--muted);
        letter-spacing: 0.08em;
      }

      /* RESPONSIVE */
      @media (max-width: 960px) {
        nav {
          padding: 0 20px;
        }
        .nav-center {
          display: none;
        }
        .hero,
        .tabs-wrap,
        .ai-wrap,
        footer {
          padding-left: 20px;
          padding-right: 20px;
        }
        .chart-row,
        .ins-grid,
        .scen-row,
        .tk-grid,
        .dcf-sliders {
          grid-template-columns: 1fr;
        }
        .tk-card.tk-both {
          grid-column: 1;
        }
        .tab-btn {
          padding: 11px 14px;
          font-size: 10px;
        }
        .prob-vals {
          gap: 24px;
        }
      }