/* Portfolio page styles plus late global responsive overrides retained last for cascade safety. */

.logo-mark,
      .nl,
      .nav-search,
      .n-chip,
      .terminal-card,
      .terminal-badge,
      .calendar-panel,
      .calendar-side,
      .calendar-interpret,
      .calendar-speakers,
      .calendar-tab,
      .calendar-cell,
      .cal-item,
      .event-card,
      .event-empty,
      .event-metrics span,
      .event-result,
      .interpret-item,
      .interpret-more,
      .speaker-item,
      .speaker-top span,
      .speaker-more,
      .home-heatmap,
      .home-news-panel,
      .market-judgment-panel,
      .home-sector-panel,
      .market-index-card,
      .ranking-panel,
      .ranking-group,
      .market-signal-card,
      .market-signal-state,
      .news-action-card,
      .news-action-tag,
      .news-action-meta span,
      .ranking-sentiment,
      .panel,
      .panel-badge,
      .tag,
      .stock-icon,
      .sector-tile,
      .bok-card,
      .phase,
      .quick-menu,
      .quick-link,
      .event-subtab,
      .event-drawer-card,
      .event-drawer-card span {
        border-radius: 3px;
      }

.calendar-cell {
        border-radius: 2px;
      }

.market-map,
      .market-map-legend,
      .map-sector,
      .map-tile {
        border-radius: 1px;
      }

.breaking-ticker {
        border-radius: 4px;
      }

.live-dot,
      .avatar,
      .quick-toggle,
      .quick-link::after,
      .legend i {
        border-radius: 50%;
      }

.nav {
        border-bottom-color: rgba(255, 176, 32, 0.2);
        box-shadow: inset 0 -1px 0 rgba(255, 176, 32, 0.08);
      }

.logo-mark {
        border: 0.5px solid rgba(255, 176, 32, 0.55);
        background: var(--amber);
        color: #05070b;
        font-weight: 900;
      }

.nl {
        color: rgba(232, 237, 248, 0.52);
      }

.nl.active {
        background: rgba(255, 176, 32, 0.1);
        color: #ffd27a;
        box-shadow: inset 0 -2px 0 rgba(255, 176, 32, 0.92);
      }

.nav-search,
      .n-chip {
        background: rgba(0, 0, 0, 0.18);
        border-color: rgba(255, 176, 32, 0.16);
      }

.nav-search span,
      .panel-badge,
      .terminal-kicker,
      .market-map-title span,
      .ranking-title span {
        color: rgba(255, 176, 32, 0.78);
      }

.terminal-card,
      .calendar-panel,
      .calendar-side,
      .calendar-interpret,
      .calendar-speakers,
      .home-heatmap,
      .home-news-panel,
      .market-judgment-panel,
      .home-sector-panel,
      .ranking-panel,
      .panel {
        border-color: rgba(255, 255, 255, 0.085);
        background:
          linear-gradient(180deg, rgba(255, 255, 255, 0.028), rgba(255, 255, 255, 0.006)),
          #0c1017;
        box-shadow:
          inset 0 1px 0 rgba(255, 255, 255, 0.045),
          inset 3px 0 0 rgba(255, 176, 32, 0.16);
      }

.terminal-page-head h1,
      .calendar-panel-head h2,
      .calendar-side-head h2,
      .calendar-interpret-head h2,
      .calendar-speakers-head h2,
      .market-map-title,
      .ranking-title,
      .panel-title {
        color: #f4f7ff;
        letter-spacing: 0.01em;
      }

.calendar-tab,
      .interpret-more,
      .speaker-more {
        border-color: rgba(255, 176, 32, 0.22);
        background: rgba(255, 176, 32, 0.055);
        color: rgba(255, 211, 122, 0.88);
      }

.calendar-tab.active,
      .panel-badge,
      .tag {
        background: rgba(255, 176, 32, 0.14);
        color: #ffd27a;
      }

.calendar-cell {
        border-color: rgba(255, 255, 255, 0.075);
        background: rgba(0, 0, 0, 0.14);
      }

.calendar-cell:not(.muted):hover,
      .event-card:hover {
        border-color: rgba(255, 176, 32, 0.5);
        background: rgba(255, 176, 32, 0.06);
      }

.calendar-cell.selected,
      .event-card.selected {
        border-color: rgba(255, 176, 32, 0.82);
        box-shadow:
          inset 0 0 0 1px rgba(255, 176, 32, 0.22),
          inset 3px 0 0 rgba(255, 176, 32, 0.58);
      }

.event-card,
      .interpret-item,
      .speaker-item,
      .ranking-group,
      .sector-tile,
      .bok-card,
      .phase {
        border-color: rgba(255, 255, 255, 0.075);
        background: rgba(255, 255, 255, 0.022);
      }

.market-index-card {
        background: #161b24;
        border-color: rgba(255, 176, 32, 0.22);
        box-shadow:
          inset 0 1px 0 rgba(255, 255, 255, 0.055),
          inset 0 -2px 0 rgba(255, 176, 32, 0.16);
      }

.market-index-name {
        color: rgba(232, 237, 248, 0.84);
      }

.market-map {
        background: #070a0f;
        border-color: rgba(255, 176, 32, 0.18);
      }

.map-sector {
        background: #0c1118;
        border-color: rgba(255, 255, 255, 0.16);
      }

.sector-label,
      .ranking-group-title {
        background: rgba(255, 176, 32, 0.13);
        color: rgba(255, 232, 185, 0.9);
      }

.home-lower-row .market-map {
        height: clamp(390px, 34vw, 500px);
        min-height: 390px;
      }

.breaking-ticker {
        border-color: transparent;
        background: transparent;
        box-shadow: none;
      }

.ticker-track b {
        color: #ffd84f;
      }

.quick-menu {
        border-color: rgba(255, 176, 32, 0.24);
        background: rgba(8, 11, 16, 0.96);
      }

.quick-toggle {
        border-color: rgba(255, 176, 32, 0.45);
        background:
          radial-gradient(circle at 34% 28%, rgba(255, 255, 255, 0.28), transparent 32%),
          var(--amber);
        box-shadow:
          0 14px 34px rgba(255, 176, 32, 0.24),
          0 0 0 6px rgba(255, 176, 32, 0.08);
      }

.quick-toggle span,
      .quick-toggle span::before,
      .quick-toggle span::after {
        background: #05070b;
      }

@media (max-width: 1180px) {
        .home-top-row,
        .home-lower-row {
          grid-template-columns: 1fr;
        }

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

        .market-signal-grid {
          grid-template-columns: repeat(2, minmax(0, 1fr));
        }

        .action-queue-list {
          grid-template-columns: repeat(3, minmax(0, 1fr));
        }

        .terminal-grid {
          grid-template-columns: repeat(2, minmax(0, 1fr));
        }

        .terminal-card.wide {
          grid-column: span 2;
        }

        .market-index-detail-grid {
          grid-template-columns: 1fr;
        }

        .etf-etn-dashboard {
          grid-template-columns: 1fr;
        }

        .fx-overview-grid {
          grid-template-columns: 1fr;
        }

        .fx-overview-grid .fx-map-stage {
          height: 260px;
          min-height: 240px;
        }

        .index-session-note {
          grid-template-columns: repeat(3, minmax(0, 1fr));
        }

        .ranking-grid {
          grid-template-columns: 1fr;
        }

        .market-map {
          height: 600px;
          min-height: 600px;
        }

        .home-lower-row .market-map {
          height: 560px;
          min-height: 560px;
        }

        .layout,
        .calendar-shell,
        .split-row {
          grid-template-columns: 1fr;
        }

        .calendar-interpret {
          width: 100%;
        }

        .calendar-lower {
          grid-template-columns: 1fr;
        }

        .interpret-grid {
          grid-template-columns: 1fr;
        }
      }

@media (max-width: 720px) {
        .nav {
          height: auto;
          padding: 12px 16px;
          align-items: flex-start;
          flex-direction: column;
        }

        .nav-links {
          flex-wrap: wrap;
        }

        .page {
          padding-left: 46px;
        }

        .side-nav {
          width: 46px;
        }

        .side-nav-head {
          grid-template-columns: 1fr;
          padding: 8px;
        }

        .side-search,
        .side-brand-name,
        .side-text,
        .side-helper,
        .side-caret,
        .side-sublist {
          display: none;
        }

        .side-brand {
          justify-content: center;
          padding: 8px;
        }

        .side-main {
          grid-template-columns: 1fr;
          justify-items: center;
          padding: 0;
        }

        .event-drawer.open {
          max-height: 240px;
        }

        .event-drawer-inner {
          grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
          padding: 7px 16px;
        }

        .event-drawer-hint {
          display: none;
        }

        .nav-right {
          width: 100%;
          flex-wrap: wrap;
        }

        .nav-search {
          width: 100%;
          order: -1;
        }

        .body {
          padding: 16px 16px 74px;
        }

        .market-overview,
        .home-index-grid,
        .market-signal-grid,
        .action-queue-list,
        .news-action-meta,
        .ranking-grid,
        .bok-grid,
        .sector-grid,
        .terminal-grid,
        .roadmap {
          grid-template-columns: 1fr;
        }

        .market-overview.home-index-grid {
          grid-template-columns: 1fr;
          grid-template-rows: none;
          height: auto;
        }

        .terminal-card.wide {
          grid-column: auto;
        }

        .global-index-row {
          grid-template-columns: minmax(72px, 1fr) 54px 76px 58px 58px 44px;
          gap: 6px;
          font-size: 10px;
        }

        .selected-index-summary,
        .index-session-note {
          grid-template-columns: 1fr;
        }

        .etf-ranking-row {
          grid-template-columns: 22px minmax(0, 1fr) 58px 58px;
          gap: 6px;
        }

        .terminal-page-head {
          align-items: flex-start;
          flex-direction: column;
        }

        .ranking-row {
          grid-template-columns: minmax(78px, 1fr) 74px minmax(62px, auto) minmax(54px, auto) minmax(44px, auto);
          gap: 6px;
          padding: 8px;
        }

        .ranking-chart {
          width: 74px;
        }

        .market-map-head {
          align-items: flex-start;
          flex-direction: column;
        }

        .market-map-legend {
          grid-template-columns: repeat(7, 1fr);
          width: 100%;
        }

        .market-map {
          height: 760px;
          min-height: 760px;
        }

        .calendar-weekdays,
        .calendar-month-grid {
          min-width: 640px;
        }

        .calendar-cell {
          min-height: 92px;
        }

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

        .quick-dock {
          right: 10px;
          bottom: 10px;
          gap: 8px;
        }

        .breaking-ticker {
          width: calc(100vw - 126px);
          height: 32px;
          margin-bottom: 7px;
        }

        .ticker-track {
          gap: 14px;
          font-size: 12px;
          animation-duration: 11s;
        }

        .quick-menu {
          width: 198px;
          bottom: 56px;
        }

        .quick-toggle {
          width: 46px;
          height: 46px;
        }

        .quick-help-bubble,
        .quick-settings-bubble {
          width: 23px;
          height: 23px;
          font-size: 12px;
        }

        .quick-help-tooltip,
        .quick-settings-panel {
          right: 0;
          width: min(204px, calc(100vw - 28px));
        }
      }
