/* ═══════════════════════════════════════════════════════
   JY investing — Personal Quant System
   Font: Pretendard (Korean), -apple-system fallback
═══════════════════════════════════════════════════════ */

:root {
  /* 2026-09 UI 개편: 다크 퀀트 트레이딩 터미널 팔레트를 전역 기본값으로 승격했다.
     (이전에는 body.theme-terminal 스코프에서만 다크였고 나머지 화면은 라이트를
     썼지만, "나머지도 전체 변경" 요청에 따라 :root 자체를 다크로 바꿨다.) */
  --bg:             #0a0e17;
  --surface:        #12161f;
  --surface-soft:   #171c28;
  --surface-hover:  #1c2230;
  --text:           #e8ebf1;
  --text-muted:     #8590a6;
  --text-subtle:    #565f74;
  --border:         #232938;
  --border-strong:  #333c52;
  --primary:        #f0b90b;
  --primary-dark:   #c99700;
  --primary-light:  rgba(240,185,11,.12);
  --accent:         #f0b90b;
  --green:          #00e396;
  --green-bg:       rgba(0,227,150,.12);
  --red:            #ff3b5c;
  --red-bg:         rgba(255,59,92,.12);
  --yellow:         #f0b90b;
  --yellow-bg:      rgba(240,185,11,.12);
  /* 주가 상승/하락 전용 색상 — 국내(한국) 증시 관행대로 상승=빨강, 하락=파랑.
     --green/--red(성공/실패 등 일반 의미)와는 별개로 둔다. */
  --up:             #f0304a;
  --up-bg:          rgba(240,48,74,.14);
  --down:           #3b82f6;
  --down-bg:        rgba(59,130,246,.14);
  --topbar-h:       56px;
  --mainnav-h:      46px;
  --radius:         10px;
  --radius-sm:      6px;
  --shadow-sm:      0 1px 4px rgba(0,0,0,.35), 0 1px 2px rgba(0,0,0,.25);
  --shadow:         0 4px 16px rgba(0,0,0,.45);
  --shadow-lg:      0 12px 40px rgba(0,0,0,.55);

  /* ── 퀀트 트레이딩 터미널 팔레트 (위 전역 토큰과 동일한 값의 별칭) ──────────
     인라인 스타일로 하드코딩된 화면들이 명시적으로 참조하기 위해 남겨 둔다. */
  --term-bg:          #0a0e17;
  --term-surface:     #12161f;
  --term-surface-2:   #171c28;
  --term-surface-3:   #1c2230;
  --term-border:      #232938;
  --term-border-soft: #1a1f2c;
  --term-text:        #e8ebf1;
  --term-text-muted:  #8590a6;
  --term-text-dim:    #565f74;
  --term-accent:      #f0b90b;
  --term-accent-dim:  #c99700;
  --term-accent-bg:   rgba(240,185,11,.12);
  --term-up:          #f0304a;
  --term-up-bg:       rgba(240,48,74,.14);
  --term-down:        #3b82f6;
  --term-down-bg:     rgba(59,130,246,.14);
  --term-mono: "JetBrains Mono", ui-monospace, "SF Mono", "Cascadia Mono", "Roboto Mono", Consolas, "Liberation Mono", Menlo, monospace;

  font-family: "Inter", "Pretendard", -apple-system, BlinkMacSystemFont, "Segoe UI", "Malgun Gothic", sans-serif;
}

/* 상단바·상단 메인 메뉴는 화면 종류와 무관하게 항상 보이는 "터미널 프레임"이므로
   전역 라이트 토큰을 이 두 컴포넌트 안에서만 다크 팔레트로 교체한다.
   :root 자체는 건드리지 않아 아직 리스킨하지 않은 화면들은 영향을 받지 않는다. */
.topbar, .mainnav {
  --bg:             var(--term-bg);
  --surface:        var(--term-surface);
  --surface-soft:   var(--term-surface-2);
  --surface-hover:  var(--term-surface-3);
  --text:           var(--term-text);
  --text-muted:     var(--term-text-muted);
  --text-subtle:    var(--term-text-dim);
  --border:         var(--term-border);
  --border-strong:  var(--term-border);
  --primary:        var(--term-accent);
  --primary-dark:   var(--term-accent-dim);
  --primary-light:  var(--term-accent-bg);
  --green:          var(--term-up);
  --green-bg:       var(--term-up-bg);
  --red:            var(--term-down);
  --red-bg:         var(--term-down-bg);
  background: var(--term-bg);
  color: var(--term-text);
}

/* 한글 기본 폰트 크기 17px 이상 */
html { font-size: 17px; }

*, *::before, *::after { box-sizing: border-box; }
html, body {
  margin: 0; height: 100%; overflow: hidden; background: var(--bg); color: var(--text);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  font-weight: 500;
  word-break: keep-all;
  word-wrap: break-word;
  font-feature-settings: "kern" 1, "liga" 1;
}
button, input, select, textarea { font: inherit; font-weight: 500; }
button { cursor: pointer; border: none; background: none; }
a { color: inherit; text-decoration: none; }
img { max-width: 100%; }

/* ApexCharts 전역 폰트 오버라이드 */
.apexcharts-text, .apexcharts-legend-text,
.apexcharts-tooltip, .apexcharts-xaxis-label,
.apexcharts-yaxis-label {
  font-family: "Pretendard", -apple-system, "Malgun Gothic", sans-serif !important;
}
.apexcharts-canvas { background:var(--surface) !important; }

/* ── Scrollbar ── */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--border-strong); border-radius: 3px; }

/* ═══════════════════════════════════════════════════════
   OVERLAY (mobile)
═══════════════════════════════════════════════════════ */
.overlay {
  display: none;
  position: fixed; inset: 0;
  background: rgba(15,23,42,.35);
  z-index: 40;
  backdrop-filter: blur(2px);
}
.overlay.show { display: block; }

/* ═══════════════════════════════════════════════════════
   TOPBAR
═══════════════════════════════════════════════════════ */
.topbar {
  position: fixed; top: 0; left: 0; right: 0;
  height: var(--topbar-h);
  z-index: 50;
  display: flex; align-items: center; gap: 16px;
  padding: 0 24px;
  background: var(--surface);
  border-bottom: 1px solid var(--border);
  box-shadow: 0 1px 4px rgba(0,0,0,.35);
}

.topbar-toggle {
  display: inline-flex;
  width: 36px; height: 36px;
  align-items: center; justify-content: center;
  border-radius: var(--radius-sm);
  color: var(--text-muted);
  font-size: 1rem;
  border: 1px solid var(--border);
  background: var(--surface);
  transition: background .15s, color .15s, border-color .15s;
}
.topbar-toggle:hover {
  background: var(--surface-soft);
  color: var(--primary);
  border-color: var(--primary);
}

.brand {
  display: inline-flex; align-items: center; gap: 9px;
  padding: 0; background: none; border: none;
  flex-shrink: 0;
}
.brand-mark {
  width: 34px; height: 34px;
  display: flex; align-items: center; justify-content: center;
  border-radius: 8px;
  background: linear-gradient(135deg, var(--term-accent-dim) 0%, var(--term-accent) 64%, #ffd84d 100%);
  box-shadow: 0 2px 8px rgba(240,185,11,.28);
  flex-shrink: 0;
}
.brand-text { display: flex; flex-direction: column; gap: 1px; }
.brand-name {
  font-size: .9rem; font-weight: 800; letter-spacing: .07em;
  color: var(--text); line-height: 1;
}
.brand-sub { font-size: .68rem; color: var(--text-muted); font-weight: 500; }

.global-search { position:relative; display:flex; align-items:center; gap:7px; width:min(300px,25vw); min-width:180px; padding:0 9px; border:1px solid var(--border); border-radius:8px; background:var(--surface-soft); }
.global-search:focus-within { border-color:var(--term-accent); background:var(--surface); box-shadow:0 0 0 2px var(--term-accent-bg); }
.global-search>i { color:var(--text-muted); font-size:.76rem; }.global-search input { width:100%; min-width:0; height:31px; border:0; outline:0; background:transparent; color:var(--text); font:inherit; font-size:.75rem; }.global-search input::placeholder { color:var(--text-dim,var(--text-muted)); }.global-search>button { display:grid; place-items:center; width:23px; height:23px; color:#151a10; border-radius:5px; background:var(--term-accent); font-size:.65rem; }.global-search-results { position:absolute; z-index:80; top:calc(100% + 7px); left:0; width:min(500px,calc(100vw - 32px)); max-height:360px; overflow-y:auto; padding:6px; border:1px solid var(--border); border-radius:10px; background:var(--surface); box-shadow:0 16px 36px rgba(0,0,0,.45); }.global-search-results[hidden] { display:none; }.global-search-result { display:block; width:100%; padding:10px; color:var(--text-muted); border-radius:7px; text-align:left; }.global-search-result:hover,.global-search-result:focus-visible { background:var(--surface-hover); }.global-search-result strong { display:block; color:var(--text); font-size:.78rem; }.global-search-result p { margin:4px 0 0; color:var(--text-muted); font-size:.7rem; line-height:1.45; }.global-search-state { margin:6px; color:var(--text-muted); font-size:.74rem; }

.topbar-ticker {
  display: flex; align-items: center; gap: 6px;
  flex: 1; min-width: 0; overflow: hidden;
  font-size: .75rem; color: var(--text-muted);
  white-space: nowrap;
}
.ticker-item { display: flex; align-items: center; gap: 4px; margin-right: 10px; }
.ticker-label { color: var(--text-subtle); }
.ticker-item b { color: var(--text); font-weight: 650; }
.ticker-item em { font-style: normal; font-weight: 650; }
.ticker-stamp {
  color: var(--text-subtle);
  font-size: .68rem;
  padding-left: 8px;
  border-left: 1px solid var(--border);
}
.up { color: var(--up); }
.dn { color: var(--down); }

.visitor-badge {
  display: flex; align-items: center; gap: 6px;
  padding: 4px 10px;
  background: var(--surface-soft);
  border: 1px solid var(--border);
  border-radius: 99px;
  font-size: .72rem; font-weight: 650; color: var(--text-muted);
  white-space: nowrap;
  flex-shrink: 0;
}
.visitor-badge i { color: var(--primary); }

.health-badge {
  display: flex; align-items: center; gap: 6px;
  padding: 4px 10px;
  background: var(--surface-soft);
  border: 1px solid var(--border);
  border-radius: 99px;
  font-size: .72rem; color: var(--text-muted);
  flex-shrink: 0;
}
.health-docs-link { text-decoration: none; }
.health-docs-link:hover {
  color: var(--primary);
  border-color: var(--primary);
  background: var(--primary-light);
}
.health-dot {
  width: 7px; height: 7px; border-radius: 50%;
  background: var(--border-strong);
  transition: background .3s;
}

.auth-badge {
  display: flex; align-items: center; gap: 6px;
  padding: 5px 12px;
  background: var(--primary);
  border: 1px solid var(--primary);
  border-radius: 99px;
  font-size: .74rem; font-weight: 700; color: var(--auth-badge-text, #fff);
  flex-shrink: 0;
}
.topbar .auth-badge { --auth-badge-text: #151a10; }
.auth-badge:hover { background: var(--primary-dark); border-color: var(--primary-dark); }
.auth-modal-backdrop { position: fixed; z-index: 2200; inset: 0; display: grid; place-items: center; padding: 16px; background: rgba(15,23,42,.58); backdrop-filter: blur(3px); }
.auth-modal-backdrop[hidden] { display: none; }
.auth-modal { position: relative; width: min(100%, 420px); padding: 28px; border-radius: 16px; background: var(--surface); border: 1px solid var(--border); box-shadow: 0 24px 70px rgba(0,0,0,.55); }
.auth-modal h2 { margin: 0; color: var(--text); font-size: 1.3rem; }.auth-modal h2 + p { margin: 8px 0 18px; color: var(--text-muted); font-size: .85rem; line-height: 1.5; }
.auth-modal-close { position: absolute; top: 12px; right: 12px; width: 34px; height: 34px; color: var(--text-muted); border-radius: 8px; }.auth-modal-close:hover { color: var(--text); background: var(--surface-soft); }
.auth-tabs { display: flex; margin-bottom: 16px; border-bottom: 1px solid var(--border); }.auth-tabs button { flex: 1; padding: 9px; color: var(--text-muted); font-weight: 700; }.auth-tabs button.active { color: var(--primary); border-bottom: 2px solid var(--primary); }
.auth-modal form { display: grid; gap: 12px; }.auth-modal label { display: grid; gap: 6px; color: var(--text-muted); font-size: .78rem; font-weight: 700; }.auth-modal input { padding: 10px 11px; border: 1px solid var(--border); border-radius: 7px; background: var(--surface-soft); color: var(--text); font: inherit; }.auth-modal input:focus { outline: 2px solid var(--primary-light); border-color: var(--primary); }
.auth-submit, .auth-logout { padding: 11px; color: #151a10; border-radius: 7px; background: var(--primary); font-weight: 750; }.auth-submit:disabled { opacity: .6; }.auth-logout { width: 100%; margin-top: 16px; background: var(--surface-hover); color: var(--text); }.auth-error { min-height: 18px; margin: 0; color: var(--red); font-size: .76rem; }.auth-modal h3 { margin: 22px 0 9px; color: var(--text); font-size: .88rem; }.auth-modal small { color: var(--text-muted); }.auth-activity { max-height: 220px; margin: 0; padding-left: 18px; overflow: auto; color: var(--text-muted); font-size: .78rem; line-height: 1.7; }

/* ── Enterprise 안내 모달 ── */
.enterprise-modal-overlay {
  position: fixed; inset: 0; z-index: 200;
  display: flex; align-items: center; justify-content: center;
  background: rgba(15, 23, 42, .45);
  padding: 16px;
}
.enterprise-modal-overlay[hidden] { display: none; }
.enterprise-modal {
  position: relative; width: min(92vw, 1600px); height: 90vh;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  overflow: auto;
  background: var(--surface); border: 1px solid var(--border); border-radius: 18px; padding: clamp(32px, 5vw, 72px);
  text-align: center; box-shadow: 0 20px 50px rgba(0,0,0,.5);
}
.enterprise-modal-close {
  position: absolute; top: 20px; right: 20px;
  width: 44px; height: 44px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  color: var(--text-muted); background: var(--surface-soft); border: none;
}
.enterprise-modal-close:hover { background: var(--border); color: var(--text); }
.enterprise-modal-icon {
  width: 78px; height: 78px; margin: 0 auto 24px;
  border-radius: 50%; display: flex; align-items: center; justify-content: center;
  background: linear-gradient(135deg, var(--term-accent-dim) 0%, var(--term-accent) 100%);
  color: #151a10; font-size: 2rem;
  box-shadow: 0 4px 14px rgba(240,185,11,.3);
}
.enterprise-modal h3 { margin: 0 0 14px; font-size: clamp(1.4rem, 2.5vw, 2rem); font-weight: 800; color: var(--text); }
.enterprise-modal p { margin: 0 0 28px; font-size: clamp(1rem, 1.7vw, 1.25rem); color: var(--text-muted); line-height: 1.65; }
.enterprise-modal-cta {
  padding: 14px 36px; border-radius: 10px; border: none;
  background: var(--primary); color: #151a10; font-size: 1rem; font-weight: 700;
}
.enterprise-modal-cta:hover { background: var(--primary-dark); }

/* ═══════════════════════════════════════════════════════
   LAYOUT SHELL
═══════════════════════════════════════════════════════ */
.layout {
  display: flex;
  padding-top: calc(var(--topbar-h) + var(--mainnav-h));
  height: 100vh;
  overflow: hidden;
}

/* ═══════════════════════════════════════════════════════
   MAIN MENU BAR (인베스팅닷컴 스타일 상단 가로 메뉴 + 드롭다운)
   좌측 사이드바를 대체한다. 상단바 바로 아래 고정, 항상 다크 팔레트.
═══════════════════════════════════════════════════════ */
.mainnav {
  position: fixed;
  top: var(--topbar-h); left: 0; right: 0;
  height: var(--mainnav-h);
  z-index: 44;
  border-bottom: 1px solid var(--border);
  overflow: visible;
}
.mainnav-inner {
  display: flex; align-items: stretch; height: 100%;
  max-width: 100%; padding: 0 12px;
  overflow: visible;
}

.mainnav-item {
  display: flex; align-items: center; gap: 7px;
  padding: 0 14px;
  height: 100%;
  font-size: .85rem; font-weight: 650;
  color: var(--text-muted);
  white-space: nowrap;
  border: none; background: none; cursor: pointer;
  border-bottom: 2px solid transparent;
  transition: color .12s, border-color .12s, background .12s;
}
.mainnav-item i:first-child { font-size: .8rem; color: var(--text-subtle); }
.mainnav-item:hover, .mainnav-item:focus-visible { color: var(--text); background: var(--surface-hover); }
.mainnav-item.active { color: var(--primary); border-bottom-color: var(--primary); }
.mainnav-item.active i:first-child { color: var(--primary); }
.mainnav-chev { margin-left: 1px; font-size: .6rem; color: var(--text-subtle); transition: transform .15s; }

.mainnav-group { position: relative; height: 100%; }
.mainnav-group.is-active-group > .mainnav-trigger { color: var(--primary); border-bottom-color: var(--primary); }
.mainnav-group.is-active-group > .mainnav-trigger i:first-child { color: var(--primary); }
.mainnav-group-utility { margin-left: auto; }

.mainnav-dropdown {
  position: absolute; top: 100%; left: 0;
  min-width: 230px;
  padding: 6px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 0 0 10px 10px;
  box-shadow: 0 16px 36px rgba(0,0,0,.45);
  opacity: 0; visibility: hidden; transform: translateY(-4px);
  transition: opacity .14s, transform .14s, visibility .14s;
  z-index: 46;
}
.mainnav-dropdown-end { left: auto; right: 0; border-radius: 0 0 10px 10px; }
.mainnav-group:hover > .mainnav-dropdown,
.mainnav-group:focus-within > .mainnav-dropdown,
.mainnav-group.is-open > .mainnav-dropdown {
  opacity: 1; visibility: visible; transform: translateY(0);
}
.mainnav-group:hover > .mainnav-trigger .mainnav-chev,
.mainnav-group.is-open > .mainnav-trigger .mainnav-chev { transform: rotate(180deg); }
.mainnav-dropdown .nav-item {
  padding: 8px 12px; border-radius: 7px; border-left: none; font-size: .82rem;
}
.mainnav-dropdown .nav-item.active { border-left: none; }

.mainnav-toggle-mobile { display: none; }

/* 우측 하단 AI 투자 도우미 */
.floating-chatbot { position: fixed; right: 24px; bottom: 24px; z-index: 100; display: flex; flex-direction: column; align-items: flex-end; gap: 10px; }
.floating-chatbot-trigger { display: inline-flex; align-items: center; gap: 9px; min-width: 54px; height: 54px; padding: 0 18px; color: #151a10; border-radius: 999px; background: linear-gradient(135deg, var(--term-accent), var(--term-accent-dim)); box-shadow: 0 8px 22px rgba(240,185,11,.32); font-size: .82rem; font-weight: 800; transition: transform .15s, box-shadow .15s; }
.floating-chatbot-trigger i { font-size: 1.15rem; }.floating-chatbot-trigger:hover { transform: translateY(-2px); box-shadow: 0 11px 26px rgba(240,185,11,.4); }
.floating-chatbot-panel { width: min(360px, calc(100vw - 32px)); padding: 13px; border: 1px solid var(--border); border-radius: 14px; background: var(--surface); box-shadow: 0 14px 36px rgba(0,0,0,.5); }.floating-chatbot-panel[hidden] { display: none; }
.floating-chatbot-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; color: var(--text); font-size: .85rem; font-weight: 800; }.floating-chatbot-head span { display: inline-flex; align-items: center; gap: 7px; }.floating-chatbot-head span i { color: var(--primary); }.floating-chatbot-head button { display: grid; place-items: center; width: 28px; height: 28px; color: var(--text-muted); border-radius: 50%; background: var(--surface-soft); }.floating-chatbot-head button:hover { color: var(--text); background: var(--border); }
.floating-chatbot-messages { display:flex; flex-direction:column; gap:12px; min-height:75px; max-height:260px; margin:14px 0 16px; overflow-y:auto; }.floating-chatbot-welcome { margin:0; padding:10px; color:var(--text-muted); border-radius:9px; background:var(--surface-soft); font-size:.75rem; line-height:1.5; }.floating-chatbot-message { margin:0; padding:9px 10px; border-radius:9px; font-size:.75rem; line-height:1.5; word-break:break-word; }.floating-chatbot-message.is-user { align-self:flex-end; margin-left:28px; color:var(--text); border:1px solid var(--border); background:var(--surface-soft); }.floating-chatbot-message.is-enterprise { align-self:flex-start; margin-right:14px; color:var(--primary); background:var(--primary-light); font-weight:750; }
.floating-chatbot-form { display: flex; gap: 6px; }.floating-chatbot-form input { min-width: 0; flex: 1; height: 36px; padding: 0 10px; color: var(--text); border: 1px solid var(--border); border-radius: 8px; background: var(--surface-soft); font-size: .75rem; outline: none; }.floating-chatbot-form input:focus { border-color: var(--primary); box-shadow: 0 0 0 2px var(--primary-light); }.floating-chatbot-form button { width: 36px; height: 36px; color: #151a10; border-radius: 8px; background: var(--primary); font-size: .75rem; }.floating-chatbot-form button:hover { background: var(--primary-dark); }
@media (max-width: 760px) { .floating-chatbot { right: 16px; bottom: 16px; }.floating-chatbot-trigger { width: 54px; padding: 0; justify-content: center; }.floating-chatbot-trigger span { display: none; } }

/* single nav item */
.nav-item {
  display: flex; align-items: center; gap: 9px;
  padding: 7px 14px 7px 20px;
  font-size: 1rem; font-weight: 500;
  color: var(--text-muted);
  border-radius: 0;
  cursor: pointer;
  transition: background .12s, color .12s;
  border-left: 3px solid transparent;
}
.nav-item i { width: 14px; text-align: center; font-size: .85rem; flex-shrink: 0; }
.nav-item:hover { background: var(--primary-light); color: var(--primary-dark); }
.nav-item.active {
  background: var(--primary-light);
  color: var(--primary-dark);
  border-left-color: var(--primary);
  font-weight: 700;
}
.nav-item.locked {
  opacity: .4;
  cursor: not-allowed;
  pointer-events: none;
}
.nav-item.locked::after {
  content: '\f023';
  font-family: 'Font Awesome 6 Free';
  font-weight: 900;
  font-size: .65rem;
  margin-left: auto;
  color: var(--text-muted);
}
.nav-home {
  border-bottom: 2px solid transparent;
}

/* ═══════════════════════════════════════════════════════
   CONTENT AREA
═══════════════════════════════════════════════════════ */
.content-wrap {
  flex: 1;
  min-width: 0;
  display: flex; flex-direction: column;
  height: 100%;
  overflow: hidden;
  background: var(--bg);
}

/* 대시보드·포트폴리오·전략 연구소 핵심 화면일 때만 콘텐츠 영역도 터미널
   팔레트로 전환한다(app.js의 navigate()가 body에 이 클래스를 토글함).
   다른 화면은 :root의 라이트 토큰을 그대로 써서 영향받지 않는다. */
body.theme-terminal .content-wrap {
  --bg:             var(--term-bg);
  --surface:        var(--term-surface);
  --surface-soft:   var(--term-surface-2);
  --surface-hover:  var(--term-surface-3);
  --text:           var(--term-text);
  --text-muted:     var(--term-text-muted);
  --text-subtle:    var(--term-text-dim);
  --border:         var(--term-border);
  --border-strong:  var(--term-border);
  --primary:        var(--term-accent);
  --primary-dark:   var(--term-accent-dim);
  --primary-light:  var(--term-accent-bg);
  --green:          var(--term-up);
  --green-bg:       var(--term-up-bg);
  --red:            var(--term-down);
  --red-bg:         var(--term-down-bg);
  background: var(--term-bg);
}
.content-main {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  padding: 28px 36px 48px;
  width: 100%;
}

/* breadcrumb */
.breadcrumb {
  font-size: 1rem; color: var(--text-muted);
  margin-bottom: 6px;
}
.breadcrumb .bc-sep { margin: 0 6px; color: var(--border-strong); }
.breadcrumb .bc-cur { color: var(--text); font-weight: 600; }

.page-head { margin-bottom: 20px; }

.app-surface { min-height: 200px; }

/* ═══════════════════════════════════════════════════════
   FOOTER
═══════════════════════════════════════════════════════ */
.site-footer {
  flex-shrink: 0;
  border-top: 1px solid #1f2937;
  background: #0b0f19;
  padding: 14px 28px;
  display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 10px;
}
.footer-logo { font-size: .95rem; font-weight: 800; letter-spacing: .07em; color: #ffffff; }
.footer-line { font-size: .8rem; color: #94a3b8; }

/* ═══════════════════════════════════════════════════════
   CARDS / GRID UTILITIES
═══════════════════════════════════════════════════════ */
.card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 20px;
  box-shadow: var(--shadow-sm);
}
.card-title {
  font-size: 1.05rem; font-weight: 700; margin: 0 0 12px;
  display: flex; align-items: center; gap: 8px;
}
.card-title i { color: var(--primary); }

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

.stat-box {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 16px 18px;
  box-shadow: var(--shadow-sm);
}
.stat-label { font-size: .82rem; color: var(--text-muted); font-weight: 600; text-transform: uppercase; letter-spacing: .04em; margin-bottom: 4px; }
.stat-value { font-size: 1.5rem; font-weight: 800; color: var(--text); line-height: 1; }
.stat-sub   { font-size: .88rem; color: var(--text-muted); margin-top: 3px; }

/* ═══════════════════════════════════════════════════════
   BUTTONS
═══════════════════════════════════════════════════════ */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 7px;
  padding: 8px 18px;
  border-radius: var(--radius-sm);
  font-size: .85rem; font-weight: 600;
  cursor: pointer; transition: all .15s;
  border: none;
}
.btn-primary   { background: var(--primary); color: #ffffff; border: 1.5px solid var(--primary-dark); }
.btn-primary:hover   { background: #006cbe; border-color: var(--primary-dark); }
.btn-secondary { background: var(--surface-soft); color: var(--text); border: 1.5px solid var(--border); }
.btn-secondary:hover { background: var(--primary-light); color: var(--primary-dark); border-color: var(--primary); }
.btn-danger    { background: var(--red-bg); color: var(--red); border: 1px solid #fca5a5; }
.btn-danger:hover { background: #fee2e2; }
.btn-success   { background: var(--green-bg); color: var(--green); border: 1px solid #6ee7b7; }
.btn-sm { padding: 5px 12px; font-size: .78rem; }
.btn:disabled { opacity: .5; cursor: not-allowed; }

/* ═══════════════════════════════════════════════════════
   BADGE / TAG
═══════════════════════════════════════════════════════ */
.badge {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 2px 8px; border-radius: 99px;
  font-size: .7rem; font-weight: 700; letter-spacing: .02em;
}
.badge-blue   { background: var(--primary-light); color: var(--primary-dark); border: 1px solid var(--primary); }
.badge-green  { background: var(--green-bg); color: #065f46; }
.badge-red    { background: var(--red-bg); color: #991b1b; }
.badge-yellow { background: var(--yellow-bg); color: #854d0e; border: 1px solid #eab308; }
.badge-gray   { background: var(--surface-soft); color: var(--text-muted); border: 1px solid #ccc; }

/* ═══════════════════════════════════════════════════════
   PROGRESS BAR
═══════════════════════════════════════════════════════ */
.progress-bar {
  height: 8px; border-radius: 99px;
  background: var(--border);
  overflow: hidden;
}
.progress-fill {
  height: 100%; border-radius: 99px;
  background: linear-gradient(90deg, #004578, #0078d4);
  transition: width .5s ease;
}

/* ═══════════════════════════════════════════════════════
   LEARNING VIEW — MD Renderer
═══════════════════════════════════════════════════════ */
.learn-container {
  position: relative;
}
.learn-body {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 32px 36px;
  box-shadow: var(--shadow-sm);
  min-height: 400px;
  min-width: 0;
}

/* 목차 — offcanvas (우측에서 슬라이드 인) */
.toc-toggle-btn {
  position: fixed;
  top: calc(var(--topbar-h) + 16px);
  right: 20px;
  z-index: 55;
  display: flex; align-items: center; gap: 6px;
  padding: 9px 14px;
  border: 1px solid var(--border);
  border-radius: 20px;
  background: var(--surface);
  box-shadow: var(--shadow);
  color: var(--text);
  font-size: .82rem; font-weight: 600;
  cursor: pointer;
}
.toc-toggle-btn:hover { background: var(--surface-hover); }
.toc-overlay {
  display: none;
  position: fixed; inset: 0;
  background: rgba(15,23,42,.35);
  z-index: 58;
  backdrop-filter: blur(2px);
}
.toc-overlay.show { display: block; }
.learn-toc {
  position: fixed;
  top: var(--topbar-h);
  right: 0;
  width: 300px;
  max-width: 85vw;
  height: calc(100vh - var(--topbar-h));
  overflow-y: auto;
  background: var(--surface);
  border-left: 1px solid var(--border);
  border-radius: 0;
  padding: 18px 16px;
  box-shadow: var(--shadow-lg);
  z-index: 59;
  visibility: hidden;
  pointer-events: none;
  transform: translateX(100%);
  transition: transform .22s cubic-bezier(.4,0,.2,1);
}
.learn-toc.open {
  visibility: visible;
  pointer-events: auto;
  transform: translateX(0);
}
.learn-toc-close {
  display: flex; align-items: center; justify-content: center;
  width: 28px; height: 28px;
  border: none; border-radius: 6px;
  background: var(--surface-soft);
  color: var(--text-muted);
  cursor: pointer;
  margin-left: auto;
}
.learn-toc-close:hover { background: var(--surface-hover); color: var(--text); }
.learn-toc-hdr { display: flex; align-items: center; margin-bottom: 10px; }
.learn-toc-title {
  font-size: .75rem; font-weight: 700; text-transform: uppercase;
  letter-spacing: .06em; color: var(--text-muted); margin-bottom: 10px;
}
.toc-list { list-style: none; padding: 0; margin: 0; }
.toc-item {
  padding: 4px 0;
  font-size: .88rem; color: var(--text-muted);
  cursor: pointer; transition: color .12s;
  border-left: 2px solid transparent;
  padding-left: 8px;
}
.toc-item:hover { color: var(--primary-dark); }
.toc-item.active { color: var(--primary); border-left-color: var(--primary); font-weight: 600; }
.toc-item.h3 { padding-left: 18px; font-size: .82rem; }

/* MD body styling */
.md-body {
  line-height: 1.75;
  color: var(--text);
  min-width: 0;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.md-body h1 { font-size: 1.65rem; font-weight: 800; margin: 0 0 20px; border-bottom: 2px solid var(--border); padding-bottom: 12px; }
.md-body h2 { font-size: 1.2rem; font-weight: 700; margin: 32px 0 12px; color:var(--text); border-left: 4px solid var(--primary); background: var(--primary-light); padding: 8px 10px 8px 14px; border-radius: 0 var(--radius-sm) var(--radius-sm) 0; }
.md-body h3 { display: flex; align-items: center; gap: 8px; font-size: 1.05rem; font-weight: 800; margin: 26px 0 10px; padding: 3px 0 3px 12px; border-left: 3px solid var(--primary); color:var(--text); }
.md-body h3::before { content: ""; flex: 0 0 auto; width: 6px; height: 6px; border-radius: 50%; background: var(--primary); }
.md-body h4 { font-size: 1rem; font-weight: 700; margin: 16px 0 6px; color: var(--text-muted); }
.md-body p  { margin: 0 0 12px; }
.md-body ul, .md-body ol { margin: 0 0 12px; padding-left: 24px; }
.md-body li { margin-bottom: 4px; }
.md-body table { width: 100%; border-collapse: collapse; margin: 16px 0; font-size: 1rem; }
.md-body th { background: var(--primary); color: #ffffff; font-weight: 700; padding: 8px 12px; border: 1px solid var(--primary-dark); text-align: left; }
.md-body td { padding: 7px 12px; border: 1px solid var(--border); }
.md-body tr:nth-child(even) td { background: var(--surface-soft); }
.md-body code { background: #f4f4f4; border: 1px solid #ddd; border-radius: 4px; padding: 1px 5px; font-size: .85em; font-family: "Fira Code", "Cascadia Code", monospace; }
.md-body pre  { background: #1e1e1e; border-radius: var(--radius-sm); padding: 16px; overflow-x: auto; margin: 16px 0; border: 1px solid #333; }
.md-body pre code { background: none; border: none; color: #e2e8f0; font-size: .85rem; }
.vocabulary-tip {
  display: flex; align-items: flex-start; gap: 8px;
  margin: 0 0 18px; padding: 10px 12px;
  color: #075985; background:rgba(56,189,248,.1); border: 1px solid #bae6fd;
  border-radius: 9px; font-size: .84rem; line-height: 1.55;
}
.vocabulary-tip i { margin-top: 3px; color: #0284c7; }
.vocabulary-term {
  display: inline; padding: 0; color: inherit; background: transparent;
  border: 0; border-radius: 3px;
  font: inherit; font-weight: 700; line-height: inherit; cursor: pointer;
  text-decoration: none;
}
.vocabulary-term:hover { color: #0369a1; background:rgba(56,189,248,.12); }
.vocabulary-term:focus-visible { outline: 3px solid rgba(14,165,233,.35); outline-offset: 2px; border-radius: 3px; }
.vocabulary-modal-backdrop {
  position: fixed; z-index: 1300; inset: 0; display: none;
  align-items: center; justify-content: center; padding: 20px;
  background: rgba(15,23,42,.58); backdrop-filter: blur(3px);
}
.vocabulary-modal-backdrop.show { display: flex; }
.vocabulary-modal {
  width: min(680px, 100%); max-height: min(720px, calc(100vh - 40px));
  overflow: auto; background:var(--surface); border: 1px solid var(--border);
  border-radius: 18px; box-shadow: 0 24px 70px rgba(15,23,42,.32);
}
.vocabulary-modal-header {
  display: flex; align-items: flex-start; justify-content: space-between; gap: 18px;
  padding: 24px 26px 20px; border-bottom: 1px solid #e2e8f0;
}
.vocabulary-modal-header > div { display: flex; align-items: center; gap: 14px; }
.vocabulary-modal-icon {
  display: inline-grid; place-items: center; width: 46px; height: 46px; flex: 0 0 auto;
  color: #fff; background: linear-gradient(135deg, #0284c7, #2563eb);
  border-radius: 12px; font-size: 1.12rem;
}
.vocabulary-modal-header p { margin: 0 0 2px; color:var(--text-muted); font-size: .76rem; font-weight: 750; letter-spacing: .03em; }
.vocabulary-modal-header h2 { margin: 0; color:var(--text); font-size: clamp(1.25rem, 3vw, 1.6rem); line-height: 1.25; }
.vocabulary-modal-close {
  display: grid; place-items: center; width: 40px; height: 40px; flex: 0 0 auto;
  color:var(--text-muted); border-radius: 10px; font-size: 1.05rem;
}
.vocabulary-modal-close:hover { color:var(--text); background:var(--surface-soft); }
.vocabulary-modal-content { display: grid; gap: 14px; padding: 22px 26px 28px; }
.vocabulary-modal-content section { padding: 15px 17px; background:var(--surface-soft); border: 1px solid var(--border); border-radius: 11px; }
.vocabulary-modal-content h3 { margin: 0 0 8px; color:var(--text); font-size: .82rem; }
.vocabulary-modal-content h3 i { width: 18px; color: #0284c7; }
.vocabulary-modal-content p { margin: 0; color:var(--text); line-height: 1.75; word-break: keep-all; }
.vocabulary-modal-content .vocabulary-modal-description { background:rgba(56,189,248,.1); border-color: #bae6fd; }
.vocabulary-modal-description h3 { color: #075985; }
body.modal-open { overflow: hidden; }
.screen-capture-fab { position: fixed; z-index: 1500; left: 24px; bottom: 24px; display: inline-flex; align-items: center; gap: 8px; padding: 12px 16px; color: #fff; background: linear-gradient(135deg, #2563eb, #7c3aed); border: 0; border-radius: 999px; box-shadow: 0 10px 26px rgba(37,99,235,.32); font-size: .84rem; font-weight: 800; }
.screen-capture-fab:hover { transform: translateY(-2px); box-shadow: 0 14px 30px rgba(37,99,235,.4); }
.screen-capture-fab.is-capturing { cursor: wait; opacity: .75; }
.screen-capture-panel { position: fixed; z-index: 1500; left: 24px; bottom: 78px; width: min(330px, calc(100vw - 32px)); padding: 13px; background:var(--surface); border: 1px solid var(--border); border-radius: 14px; box-shadow: 0 16px 38px rgba(15,23,42,.25); }
.screen-capture-panel[hidden] { display: none; }
.screen-capture-panel-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; color: #1e293b; font-size: .9rem; }
.screen-capture-panel-head strong i { margin-right: 5px; color:var(--primary); }
.screen-capture-panel-head button { width: 28px; height: 28px; color:var(--text-muted); border-radius: 6px; }
.screen-capture-panel-head button:hover { color:var(--text); background:var(--surface-soft); }
.screen-capture-panel img { display: block; width: 100%; max-height: 160px; object-fit: cover; object-position: top; background:var(--surface-soft); border: 1px solid var(--border); border-radius: 8px; }
.screen-capture-panel p { margin: 9px 0; color:var(--text); font-size: .74rem; line-height: 1.45; }
.screen-capture-panel label { display: grid; grid-template-columns: 1fr 1.35fr; gap: 8px; align-items: center; margin-bottom: 8px; color:var(--text); font-size: .74rem; font-weight: 750; }
.screen-capture-panel select { min-width: 0; padding: 7px 8px; color:var(--text); background:var(--surface); border: 1px solid var(--border); border-radius: 7px; font-size: .75rem; }
.screen-capture-open { display: flex; align-items: center; justify-content: center; gap: 7px; width: 100%; padding: 9px 10px; color: #fff; background: #2563eb; border: 1px solid #2563eb; border-radius: 8px; font-size: .78rem; font-weight: 800; }
.screen-capture-open:hover { background: #1d4ed8; }
.screen-capture-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; margin-top: 7px; }
.screen-capture-actions button { padding: 7px 5px; color:var(--text); background:var(--surface-soft); border: 1px solid var(--border); border-radius: 7px; font-size: .7rem; font-weight: 700; }
.screen-capture-actions button:hover { color:var(--primary); border-color: rgba(56,189,248,.3); background:rgba(56,189,248,.1); }
.integrated-content-trigger {
  display: inline; padding: 0; color: var(--primary); background: transparent; border: 0;
  font: inherit; text-align: inherit; text-decoration: underline; cursor: pointer;
}
.integrated-content-trigger:hover { color: var(--primary-dark); }
.integrated-content-trigger:focus-visible { outline: 3px solid rgba(14,165,233,.35); outline-offset: 2px; border-radius: 3px; }
.integrated-content-trigger i { margin-left: 4px; font-size: .74em; }
.integrated-content-modal-backdrop {
  position: fixed; z-index: 1300; inset: 0; display: none;
  align-items: center; justify-content: center; padding: 20px;
  background: rgba(15,23,42,.58); backdrop-filter: blur(3px);
}
.integrated-content-modal-backdrop.show { display: flex; }
.integrated-content-modal {
  width: min(880px, 100%); max-height: min(800px, calc(100vh - 40px)); overflow: auto;
  background:var(--surface); border: 1px solid var(--border); border-radius: 18px; box-shadow: 0 24px 70px rgba(15,23,42,.32);
}
.integrated-content-modal-header {
  display: flex; align-items: flex-start; justify-content: space-between; gap: 18px;
  padding: 24px 26px 20px; border-bottom: 1px solid #e2e8f0;
}
.integrated-content-modal-header > div { display: flex; align-items: center; gap: 14px; }
.integrated-content-modal-icon {
  display: inline-grid; place-items: center; width: 46px; height: 46px; flex: 0 0 auto;
  color: #fff; background: linear-gradient(135deg, #0f766e, #0284c7); border-radius: 12px; font-size: 1.12rem;
}
.integrated-content-modal-header p { margin: 0 0 2px; color:var(--text-muted); font-size: .76rem; font-weight: 750; letter-spacing: .03em; }
.integrated-content-modal-header h2 { margin: 0; color:var(--text); font-size: clamp(1.15rem, 3vw, 1.55rem); line-height: 1.3; }
.integrated-content-modal-close {
  display: grid; place-items: center; width: 40px; height: 40px; flex: 0 0 auto;
  color:var(--text-muted); border-radius: 10px; font-size: 1.05rem;
}
.integrated-content-modal-close:hover { color:var(--text); background:var(--surface-soft); }
.integrated-content-modal-body { padding: 24px 26px 30px; }
.integrated-content-modal-body > :first-child { margin-top: 0; }
.integrated-content-modal-body > :last-child { margin-bottom: 0; }
.integrated-content-modal-body h2 { display: none; }
.integrated-content-modal-loading, .integrated-content-modal-error { margin: 0; padding: 22px; text-align: center; border-radius: 10px; }
.integrated-content-modal-loading { color:var(--text); background:var(--surface-soft); }
.integrated-content-modal-error { color: #b91c1c; background:var(--red-bg); }
.mermaid-view-badge {
  display: inline-flex; align-items: center; gap: 7px;
  margin: 16px 0; padding: 7px 10px;
  color: #075985; background:rgba(56,189,248,.12);
  border: 1px solid #7dd3fc; border-radius: 999px;
  font-size: .76rem; font-weight: 800; letter-spacing: .04em;
  transition: transform .15s, background .15s, box-shadow .15s;
}
.mermaid-view-badge small { font-weight: 600; letter-spacing: 0; color: #0369a1; }
.mermaid-view-badge:hover { background: #bae6fd; transform: translateY(-1px); box-shadow: 0 3px 8px rgba(2,132,199,.18); }
.mermaid-view-badge:focus-visible { outline: 3px solid rgba(14,165,233,.35); outline-offset: 2px; }
.mermaid-modal-backdrop {
  display: none; position: fixed; inset: 0; z-index: 200;
  align-items: center; justify-content: center; padding: 0;
  background: rgba(15,23,42,.62); backdrop-filter: blur(3px);
}
.mermaid-modal-backdrop.show { display: flex; }
.mermaid-modal {
  width: 100vw; height: 100vh; max-width: none; max-height: none;
  display: flex; flex-direction: column; overflow: hidden;
  background: var(--surface); border: 0; border-radius: 0;
  box-shadow: none;
}
.mermaid-modal-header {
  display: flex; align-items: center; justify-content: space-between;
  gap: 12px; padding: 14px 18px; border-bottom: 1px solid var(--border);
  font-size: .95rem; font-weight: 750;
}
.mermaid-modal-header i { color: var(--primary); margin-right: 7px; }
.mermaid-modal-close {
  display: grid; place-items: center; width: 34px; height: 34px;
  border-radius: 50%; color: var(--text-muted);
}
.mermaid-modal-close:hover { background: var(--surface-soft); color: var(--text); }
.mermaid-modal-chart {
  flex: 1; min-height: 0; overflow: auto; padding: 40px; background:var(--surface);
  display: flex; align-items: center; justify-content: center;
  text-align: center;
}
.mermaid-modal-chart svg {
  width: max(100%, 1200px); height: auto; max-width: none; min-width: 0;
}
.mermaid-modal-loading { padding: 60px 20px; color: var(--text-muted); }
.mermaid-modal-error { margin: 0; padding: 36px 12px; color: var(--red); text-align: center; }
.macro-news-simulator-button { display: inline-flex; align-items: center; gap: 8px; padding: 10px 14px; color: #075985; background: #ecfeff; border: 1px solid #a5f3fc; border-radius: 9px; font-size: .82rem; font-weight: 800; box-shadow: 0 2px 5px rgba(8,145,178,.08); }
.macro-news-simulator-button:hover { color: #fff; background: #0891b2; border-color: #0891b2; }
.macro-news-modal-backdrop { position: fixed; z-index: 1200; inset: 0; display: none; align-items: center; justify-content: center; padding: 2vh 2vw; background: rgba(15,23,42,.55); backdrop-filter: blur(2px); }
.macro-news-modal-backdrop.show { display: flex; }
.macro-news-modal { width: 100%; height: 100%; overflow: auto; background:var(--surface); border: 1px solid var(--border); border-radius: 18px; box-shadow: 0 24px 70px rgba(15,23,42,.3); }
.macro-news-modal-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; padding: clamp(22px, 3vw, 42px); border-bottom: 1px solid #e2e8f0; }
.macro-news-modal-header > div { display: flex; align-items: center; gap: 16px; }
.macro-news-modal-icon { display: inline-flex; align-items: center; justify-content: center; width: 52px; height: 52px; color: #fff; background: linear-gradient(135deg, #0284c7, #2563eb); border-radius: 13px; font-size: 1.35rem; }
.macro-news-modal h2 { margin: 0; color:var(--text); font-size: clamp(1.25rem, 2.2vw, 1.75rem); }
.macro-news-modal-header p { margin: 5px 0 0; color:var(--text-muted); font-size: clamp(.92rem, 1.4vw, 1.1rem); }
.macro-news-modal-close { width: 44px; height: 44px; flex: 0 0 auto; color:var(--text-muted); border-radius: 10px; font-size: 1.2rem; }
.macro-news-modal-close:hover { color:var(--text); background:var(--surface-soft); }
.macro-news-controls { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px 36px; padding: clamp(24px, 3vw, 42px); background:var(--surface-soft); border-bottom: 1px solid #e2e8f0; }
.macro-news-controls label { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 10px; color:var(--text); font-size: clamp(1rem, 1.5vw, 1.2rem); font-weight: 750; }
.macro-news-controls input { grid-column: 1 / -1; width: 100%; accent-color: #0284c7; }
.macro-news-controls output { min-width: 32px; color: #0369a1; text-align: right; font-size: 1.1em; font-variant-numeric: tabular-nums; }
.macro-news-canvas-wrap { padding: clamp(24px, 3vw, 42px) clamp(24px, 3vw, 42px) 0; }
.macro-news-canvas { display: block; width: 100%; border: 1px solid var(--border); border-radius: 10px; }
.macro-news-insight { margin: 20px clamp(24px, 3vw, 42px) 0; padding: 18px 20px; color:var(--text); background:rgba(56,189,248,.1); border-left: 4px solid #0ea5e9; border-radius: 0 9px 9px 0; font-size: clamp(.95rem, 1.4vw, 1.12rem); line-height: 1.65; }
.macro-news-insight strong { color:var(--text); }
.macro-news-disclaimer { margin: 16px clamp(24px, 3vw, 42px) 28px; color: #94a3b8; font-size: clamp(.8rem, 1.15vw, .95rem); line-height: 1.55; }
.chart-drawing-offcanvas-backdrop { position: fixed; z-index: 1200; inset: 0; display: none; background: rgba(15,23,42,.42); backdrop-filter: blur(1px); }
.chart-drawing-offcanvas-backdrop.show { display: block; }
.chart-drawing-offcanvas { position: fixed; top: 0; right: 0; width: min(1640px, 96vw); max-width: 100%; height: 100vh; overflow: auto; background:var(--surface); border-left: 1px solid #cbd5e1; box-shadow: -24px 0 70px rgba(15,23,42,.28); transform: translateX(100%); transition: transform .25s cubic-bezier(.4,0,.2,1); }
.chart-drawing-offcanvas-backdrop.show .chart-drawing-offcanvas { transform: translateX(0); }
.chart-drawing-offcanvas-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; padding: clamp(18px, 2.2vw, 30px) clamp(20px, 3vw, 42px); border-bottom: 1px solid #e2e8f0; }
.chart-drawing-offcanvas-header > div { display: flex; align-items: center; gap: 16px; }
.chart-drawing-offcanvas-icon { display: inline-flex; align-items: center; justify-content: center; width: 52px; height: 52px; color: #fff; background: linear-gradient(135deg, #2563eb, #7c3aed); border-radius: 13px; font-size: 1.35rem; }
.chart-drawing-offcanvas h2 { margin: 0; color:var(--text); font-size: clamp(1.25rem, 2.2vw, 1.75rem); }
.chart-drawing-offcanvas-header p { margin: 5px 0 0; color:var(--text-muted); font-size: clamp(.82rem, 1.25vw, 1rem); }
.chart-drawing-offcanvas-close { width: 42px; height: 42px; flex: 0 0 auto; color:var(--text-muted); border-radius: 10px; font-size: 1.2rem; }
.chart-drawing-offcanvas-close:hover { color:var(--text); background:var(--surface-soft); }
.chart-drawing-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 15px; padding: 12px clamp(20px, 3vw, 42px); color:var(--text); background:var(--surface-soft); border-bottom: 1px solid #e2e8f0; font-size: .8rem; }
.chart-drawing-toolbar span i { margin-right: 5px; color:var(--primary); }
.chart-drawing-toolbar button { padding: 7px 10px; color:var(--primary); background:var(--surface); border: 1px solid rgba(56,189,248,.3); border-radius: 7px; font-size: .74rem; font-weight: 800; }
.chart-drawing-toolbar button:hover { color: #fff; background: #2563eb; }
.chart-drawing-split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(230px, .78fr); gap: 18px; padding: clamp(18px, 2.4vw, 36px) clamp(20px, 3vw, 42px); }
.chart-drawing-panel { min-width: 0; overflow: hidden; border: 1px solid #dbe3ee; border-radius: 13px; background:var(--surface); }
.chart-drawing-panel > header { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; padding: 13px 16px; background:var(--surface-soft); border-bottom: 1px solid #e2e8f0; }
.chart-drawing-panel header b { color: #1e293b; font-size: .9rem; }
.chart-drawing-panel header small { color: #94a3b8; font-size: .68rem; }
.chart-drawing-canvas-wrap { min-height: 300px; }
.chart-drawing-canvas-wrap canvas { display: block; width: 100%; touch-action: none; cursor: crosshair; }
.chart-drawing-insight { min-height: 92px; margin: 12px; padding: 13px 15px; color:var(--text); background:var(--surface-soft); border-left: 4px solid #94a3b8; border-radius: 0 8px 8px 0; font-size: .82rem; line-height: 1.55; }
.chart-drawing-insight strong { color:var(--text); font-size: .92rem; }
.chart-drawing-insight p { margin: 5px 0 0; }
.chart-drawing-insight.is-up { background:var(--up-bg); border-color: var(--up); }
.chart-drawing-insight.is-down { background:var(--down-bg); border-color: var(--down); }
.chart-drawing-insight.is-flat { background:var(--primary-light); border-color: #f59e0b; }
.chart-drawing-similar { display: flex; flex-direction: column; min-width: 0; overflow: hidden; border: 1px solid #dbeafe; border-radius: 13px; background:var(--surface); }
.chart-drawing-similar > header { display: flex; flex-direction: column; align-items: flex-start; gap: 3px; padding: 13px 16px; background:var(--surface-soft); border-bottom: 1px solid #e2e8f0; }
.chart-drawing-similar > header b { color:var(--primary); font-size: .86rem; }.chart-drawing-similar > header b i { margin-right: 5px; color:var(--primary); }
.chart-drawing-similar > header small { color:var(--text-muted); font-size: .68rem; }
.chart-drawing-similar-body { flex: 1; padding: 13px 15px; overflow-y: auto; }
.chart-drawing-similar-body > p { margin: 0 0 10px; color:var(--text); font-size: .74rem; line-height: 1.45; }
.chart-drawing-similar-cards { display: grid; gap: 8px; }
.chart-drawing-similar-cards article { display: grid; gap: 4px; padding: 10px 11px; background:var(--surface); border: 1px solid rgba(56,189,248,.3); border-left: 3px solid #3b82f6; border-radius: 8px; }
.chart-drawing-similar-cards span { color:var(--primary); font-size: .67rem; font-weight: 800; }.chart-drawing-similar-cards strong { color: #1e293b; font-size: .82rem; }
.chart-drawing-similar-cards small { color:var(--text-muted); font-size: .67rem; }.chart-drawing-similar-cards em { color:var(--primary); font-size: .68rem; font-style: normal; font-weight: 800; }
.chart-drawing-note { margin: 0 clamp(20px, 3vw, 42px) 24px; padding: 10px 12px; color:var(--text-muted); background:var(--surface-soft); border-radius: 8px; font-size: .74rem; line-height: 1.5; }
.chart-drawing-note i { margin-right: 5px; color:var(--primary); }
.rsi-macd-simulator-button { display: inline-flex; align-items: center; gap: 7px; margin: 4px 0; padding: 10px 14px; color:var(--primary); background:rgba(168,85,247,.1); border: 1px solid rgba(168,85,247,.3); border-radius: 9px; font-size: .82rem; font-weight: 800; box-shadow: 0 2px 5px rgba(124,58,237,.08); }
.rsi-macd-simulator-button:hover { color: #fff; background: #7c3aed; }
.rsi-macd-modal-backdrop { position: fixed; z-index: 1200; inset: 0; display: none; align-items: center; justify-content: center; padding: 1vh 1vw; background: rgba(15,23,42,.58); backdrop-filter: blur(2px); }.rsi-macd-modal-backdrop.show { display: flex; }
.rsi-macd-modal { width: min(1280px, 100%); max-height: 98vh; overflow: auto; background:var(--surface); border: 1px solid var(--border); border-radius: 18px; box-shadow: 0 24px 70px rgba(15,23,42,.32); }
.rsi-macd-modal-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; padding: 22px 28px 19px; border-bottom: 1px solid #e2e8f0; }.rsi-macd-modal-header > div { display: flex; align-items: center; gap: 14px; }
.rsi-macd-modal-icon { display: inline-flex; align-items: center; justify-content: center; width: 46px; height: 46px; color: #fff; background: linear-gradient(135deg, #7c3aed, #2563eb); border-radius: 13px; font-size: 1.2rem; }.rsi-macd-modal h2 { margin: 0; color:var(--text); font-size: 1.45rem; }.rsi-macd-modal-header p { margin: 4px 0 0; color:var(--text-muted); font-size: .88rem; }
.rsi-macd-modal-close { width: 40px; height: 40px; flex: 0 0 auto; color:var(--text-muted); border-radius: 10px; font-size: 1.2rem; }.rsi-macd-modal-close:hover { color:var(--text); background:var(--surface-soft); }.rsi-macd-simulator { padding: 20px 28px 24px; }
.rsi-macd-terms { display: grid; gap: 6px; margin-bottom: 16px; padding: 13px 15px; background:var(--surface-soft); border: 1px solid var(--border); border-radius: 11px; }.rsi-macd-terms p { margin: 0; color:var(--text); font-size: .8rem; line-height: 1.55; }.rsi-macd-terms b { color: #4c1d95; }
.rsi-macd-inputs { padding: 15px 17px 17px; background:rgba(168,85,247,.08); border: 1px solid #e9d5ff; border-radius: 12px; }.rsi-macd-section-heading { display: flex; align-items: center; gap: 9px; margin-bottom: 12px; }.rsi-macd-section-heading > span { padding: 3px 7px; color:var(--primary); background:rgba(168,85,247,.12); border-radius: 99px; font-size: .67rem; font-weight: 900; letter-spacing: .04em; }.rsi-macd-section-heading h3 { margin: 0; color: #4c1d95; font-size: .94rem; }.rsi-macd-section-heading p { margin: 0 0 0 auto; color:var(--text-muted); font-size: .72rem; }
.rsi-macd-input-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }.rsi-macd-input-grid label { display: grid; gap: 6px; color:var(--text); font-size: .76rem; font-weight: 750; }.rsi-macd-input-grid input[type="number"] { padding: 8px 9px; border: 1px solid var(--border); border-radius: 7px; font: inherit; font-weight: 800; }.rsi-macd-input-grid input[type="range"] { width: 100%; accent-color:var(--primary); }.rsi-macd-input-grid output { color:var(--primary); font-size: .78rem; font-weight: 800; }
.rsi-macd-chart-wrap { margin: 16px 0; overflow: hidden; border: 1px solid rgba(168,85,247,.3); border-radius: 12px; }.rsi-macd-chart-wrap canvas { display: block; width: 100%; }.rsi-macd-results { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-bottom: 16px; }.rsi-macd-results article { display: grid; gap: 5px; padding: 13px; background:var(--surface-soft); border: 1px solid #dbe3ee; border-radius: 10px; }.rsi-macd-results span { color:var(--text-muted); font-size: .73rem; font-weight: 750; }.rsi-macd-results strong { color:var(--primary); font-size: 1.1rem; font-variant-numeric: tabular-nums; }.rsi-macd-results small { color: #94a3b8; font-size: .65rem; }
.rsi-macd-reading { padding: 15px 17px; border: 1px solid #dbe3ee; border-radius: 12px; }.rsi-macd-reading > p { margin: 0 0 10px; color:var(--text); font-size: .8rem; line-height: 1.5; }.rsi-macd-reading ol { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }.rsi-macd-reading li { display: grid; grid-template-columns: 20% 1fr; gap: 10px; padding: 9px 10px; background:var(--surface-soft); border-radius: 7px; color:var(--text); font-size: .78rem; }.rsi-macd-reading li span { font-variant-numeric: tabular-nums; }.rsi-macd-note { display: flex; align-items: center; gap: 8px; margin-top: 14px; padding: 10px 12px; color:var(--text-muted); background:var(--surface-soft); border-radius: 9px; font-size: .74rem; line-height: 1.45; }.rsi-macd-note > i { color:var(--primary); }.rsi-macd-note button { flex: 0 0 auto; margin-left: auto; padding: 6px 8px; color:var(--primary); background:var(--surface); border: 1px solid rgba(168,85,247,.3); border-radius: 6px; font-size: .69rem; font-weight: 800; }.rsi-macd-note button:hover { color: #fff; background: #7c3aed; }
.atr-simulator-button { display: inline-flex; align-items: center; gap: 7px; margin: 4px 0; padding: 10px 14px; color: #b45309; background:var(--primary-light); border: 1px solid #fde68a; border-radius: 9px; font-size: .82rem; font-weight: 800; box-shadow: 0 2px 5px rgba(180,83,9,.08); }
.atr-simulator-button:hover { color: #fff; background: #b45309; }
.atr-modal-backdrop { position: fixed; z-index: 1200; inset: 0; display: none; align-items: center; justify-content: center; padding: 1vh 1vw; background: rgba(15,23,42,.58); backdrop-filter: blur(2px); }.atr-modal-backdrop.show { display: flex; }
.atr-modal { width: min(1280px, 100%); max-height: 98vh; overflow: auto; background:var(--surface); border: 1px solid var(--border); border-radius: 18px; box-shadow: 0 24px 70px rgba(15,23,42,.32); }
.atr-modal-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; padding: 22px 28px 19px; border-bottom: 1px solid #e2e8f0; }.atr-modal-header > div { display: flex; align-items: center; gap: 14px; }
.atr-modal-icon { display: inline-flex; align-items: center; justify-content: center; width: 46px; height: 46px; color: #fff; background: linear-gradient(135deg, #b45309, #d97706); border-radius: 13px; font-size: 1.2rem; }.atr-modal h2 { margin: 0; color:var(--text); font-size: 1.45rem; }.atr-modal-header p { margin: 4px 0 0; color:var(--text-muted); font-size: .88rem; }
.atr-modal-close { width: 40px; height: 40px; flex: 0 0 auto; color:var(--text-muted); border-radius: 10px; font-size: 1.2rem; }.atr-modal-close:hover { color:var(--text); background:var(--surface-soft); }.atr-simulator { padding: 20px 28px 24px; }
.atr-terms { display: grid; gap: 6px; margin-bottom: 16px; padding: 13px 15px; background:var(--surface-soft); border: 1px solid var(--border); border-radius: 11px; }.atr-terms p { margin: 0; color:var(--text); font-size: .8rem; line-height: 1.55; }.atr-terms b { color: #92400e; }
.atr-inputs { padding: 15px 17px 17px; background:var(--primary-light); border: 1px solid #fde68a; border-radius: 12px; }.atr-section-heading { display: flex; align-items: center; gap: 9px; margin-bottom: 12px; }.atr-section-heading > span { padding: 3px 7px; color: #92400e; background:var(--primary-light); border-radius: 99px; font-size: .67rem; font-weight: 900; letter-spacing: .04em; }.atr-section-heading h3 { margin: 0; color: #92400e; font-size: .94rem; }.atr-section-heading p { margin: 0 0 0 auto; color:var(--text-muted); font-size: .72rem; }
.atr-input-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }.atr-input-grid label { display: grid; gap: 6px; color:var(--text); font-size: .76rem; font-weight: 750; }.atr-input-grid input[type="number"] { padding: 8px 9px; border: 1px solid var(--border); border-radius: 7px; font: inherit; font-weight: 800; }.atr-input-grid input[type="range"] { width: 100%; accent-color: #b45309; }.atr-input-grid output { color: #92400e; font-size: .78rem; font-weight: 800; }
.atr-chart-wrap { margin: 16px 0; overflow: hidden; border: 1px solid #fde68a; border-radius: 12px; }.atr-chart-wrap canvas { display: block; width: 100%; }.atr-results { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-bottom: 16px; }.atr-results article { display: grid; gap: 5px; padding: 13px; background:var(--surface-soft); border: 1px solid #dbe3ee; border-radius: 10px; }.atr-results span { color:var(--text-muted); font-size: .73rem; font-weight: 750; }.atr-results strong { color: #92400e; font-size: 1.1rem; font-variant-numeric: tabular-nums; }.atr-results small { color: #94a3b8; font-size: .65rem; }
.atr-reading { padding: 15px 17px; border: 1px solid #dbe3ee; border-radius: 12px; }.atr-reading > p { margin: 0 0 10px; color:var(--text); font-size: .8rem; line-height: 1.5; }.atr-reading ol { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }.atr-reading li { display: grid; grid-template-columns: 20% 1fr; gap: 10px; padding: 9px 10px; background:var(--surface-soft); border-radius: 7px; color:var(--text); font-size: .78rem; }.atr-reading li span { font-variant-numeric: tabular-nums; }.atr-note { display: flex; align-items: center; gap: 8px; margin-top: 14px; padding: 10px 12px; color:var(--text-muted); background:var(--surface-soft); border-radius: 9px; font-size: .74rem; line-height: 1.45; }.atr-note > i { color: #b45309; }.atr-note button { flex: 0 0 auto; margin-left: auto; padding: 6px 8px; color: #92400e; background:var(--surface); border: 1px solid #fde68a; border-radius: 6px; font-size: .69rem; font-weight: 800; }.atr-note button:hover { color: #fff; background: #b45309; }
.opening-session-simulator-button { display: inline-flex; align-items: center; gap: 7px; margin: 4px 0; padding: 10px 14px; color: #0369a1; background:rgba(56,189,248,.1); border: 1px solid #bae6fd; border-radius: 9px; font-size: .82rem; font-weight: 800; box-shadow: 0 2px 5px rgba(2,132,199,.08); }.opening-session-simulator-button:hover { color: #fff; background: #0284c7; }
.opening-session-modal-backdrop { position: fixed; z-index: 1200; inset: 0; display: none; align-items: center; justify-content: center; padding: 1vh 1vw; background: rgba(15,23,42,.58); backdrop-filter: blur(2px); }.opening-session-modal-backdrop.show { display: flex; }.opening-session-modal { width: min(1250px, 100%); max-height: 98vh; overflow: auto; background:var(--surface); border: 1px solid var(--border); border-radius: 18px; box-shadow: 0 24px 70px rgba(15,23,42,.32); }
.opening-session-modal-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; padding: 22px 28px 19px; border-bottom: 1px solid #e2e8f0; }.opening-session-modal-header > div { display: flex; align-items: center; gap: 14px; }.opening-session-modal-icon { display: inline-flex; align-items: center; justify-content: center; width: 46px; height: 46px; color: #fff; background: linear-gradient(135deg, #0284c7, #2563eb); border-radius: 13px; font-size: 1.2rem; }.opening-session-modal h2 { margin: 0; color:var(--text); font-size: 1.45rem; }.opening-session-modal-header p { margin: 4px 0 0; color:var(--text-muted); font-size: .88rem; }.opening-session-modal-close { width: 40px; height: 40px; flex: 0 0 auto; color:var(--text-muted); border-radius: 10px; font-size: 1.2rem; }.opening-session-modal-close:hover { color:var(--text); background:var(--surface-soft); }
.opening-session-tabs { display: flex; gap: 8px; padding: 14px 28px 0; }.opening-session-tabs button { padding: 8px 11px; color:var(--text); background:var(--surface-soft); border: 1px solid #dbe3ee; border-radius: 8px; font-size: .76rem; font-weight: 800; }.opening-session-tabs button.is-active { color: #fff; background: #0284c7; border-color: #0284c7; }.opening-session-body { padding: 14px 28px 24px; }.opening-session-status { margin: 0 0 10px; color:var(--text); font-size: .78rem; }.opening-session-chart-wrap { overflow: hidden; border: 1px solid #bae6fd; border-radius: 11px; }.opening-session-chart-wrap canvas { display: block; width: 100%; }.opening-session-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-top: 14px; }.opening-session-summary article { display: grid; gap: 5px; padding: 12px; background:var(--surface-soft); border: 1px solid #dbe3ee; border-radius: 9px; }.opening-session-summary span { color:var(--text-muted); font-size: .72rem; font-weight: 750; }.opening-session-summary strong { color: #0369a1; font-size: 1.06rem; font-variant-numeric: tabular-nums; }.opening-session-note { margin: 14px 0 0; padding: 10px 12px; color:var(--text-muted); background:var(--surface-soft); border-radius: 8px; font-size: .72rem; line-height: 1.5; }
.percent-change-simulator-button { display:inline-flex; gap:7px; align-items:center; padding:10px 14px; color:#b45309; background:var(--primary-light); border:1px solid #fde68a; border-radius:9px; font-size:.82rem; font-weight:800; }.percent-change-simulator-button:hover { color:#fff; background:#d97706; }.percent-change-modal-backdrop { position:fixed; z-index:1200; inset:0; display:none; place-items:center; padding:16px; background:rgba(15,23,42,.58); backdrop-filter:blur(2px); }.percent-change-modal-backdrop.show { display:grid; }.percent-change-modal { width:min(920px,100%); max-height:96vh; overflow:auto; background:var(--surface); border:1px solid var(--border); border-radius:18px; box-shadow:0 24px 70px rgba(15,23,42,.32); }.percent-change-modal header { display:flex; justify-content:space-between; gap:16px; padding:22px 28px; border-bottom:1px solid #e2e8f0; }.percent-change-modal header>div { display:flex; align-items:center; gap:14px; }.percent-change-modal header span { display:grid; place-items:center; width:46px; height:46px; color:#fff; background:linear-gradient(135deg,#d97706,#ea580c); border-radius:13px; }.percent-change-modal h2 { margin:0; color:var(--text); font-size:1.4rem; }.percent-change-modal header p { margin:4px 0 0; color:var(--text-muted); font-size:.84rem; }.percent-change-modal header>button { width:40px; height:40px; color:var(--text-muted); border-radius:10px; font-size:1.2rem; }.percent-change-modal main { padding:20px 28px 24px; }.percent-change-inputs,.percent-change-results { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }.percent-change-inputs { padding:15px; background:var(--primary-light); border:1px solid #fde68a; border-radius:11px; }.percent-change-inputs label { display:grid; gap:6px; color:var(--text); font-size:.76rem; font-weight:750; }.percent-change-inputs input { padding:9px; border:1px solid var(--border); border-radius:7px; font:inherit; font-weight:800; }.percent-change-results { margin:15px 0; }.percent-change-results article { display:grid; gap:5px; padding:13px; background:var(--surface-soft); border:1px solid #dbe3ee; border-radius:9px; }.percent-change-results span { color:var(--text-muted); font-size:.72rem; font-weight:750; }.percent-change-results strong { color:#b45309; font-size:1.1rem; }.percent-change-reading { padding:15px; border:1px solid #dbe3ee; border-radius:11px; }.percent-change-reading h3 { margin:0 0 8px; color:var(--text-muted); font-size:.92rem; }.percent-change-reading p { margin:0; color:var(--text); line-height:1.5; }.percent-change-reading div { display:grid; gap:7px; margin-top:11px; }.percent-change-reading b { padding:9px; color:var(--text-muted); background:var(--primary-light); border-radius:7px; font-size:.76rem; }.percent-change-modal footer { display:flex; gap:8px; align-items:center; margin-top:14px; padding:10px 12px; color:var(--text-muted); background:var(--surface-soft); border-radius:8px; font-size:.73rem; }.percent-change-modal footer i { color:#d97706; }.percent-change-modal footer button { margin-left:auto; padding:6px 8px; color:#b45309; background:var(--surface); border:1px solid #fde68a; border-radius:6px; font-size:.69rem; font-weight:800; }
.order-simulator-button { display:inline-flex; align-items:center; gap:7px; padding:10px 14px; color:#075985; background:rgba(56,189,248,.1); border:1px solid #bae6fd; border-radius:9px; font-size:.82rem; font-weight:800; }.order-simulator-button:hover { color:#fff; background:#0284c7; }.order-modal-backdrop { position:fixed; z-index:1200; inset:0; display:none; place-items:center; padding:16px; background:rgba(15,23,42,.58); }.order-modal-backdrop.show { display:grid; }.order-modal { width:min(820px,100%); background:var(--surface); border-radius:16px; overflow:auto; max-height:96vh; }.order-modal header { display:flex; justify-content:space-between; padding:20px 24px; border-bottom:1px solid #e2e8f0; }.order-modal header>div { display:flex; gap:12px; align-items:center; }.order-modal header>div>i { padding:13px; color:#fff; background:#0284c7; border-radius:11px; }.order-modal h2 { margin:0; }.order-modal header p { margin:3px 0 0; color:var(--text-muted); font-size:.8rem; }.order-modal main { padding:18px 24px 22px; }.order-book { display:grid; grid-template-columns:1.2fr 1fr 1.2fr 1fr; gap:8px; padding:12px; background:var(--surface-soft); border-radius:9px; font-size:.8rem; }.order-book span { color:#ef4444; }.order-book strong { color:var(--primary); }.order-book small { color:var(--text-muted); }.order-inputs { display:grid; grid-template-columns:repeat(2,1fr); gap:10px; margin:14px 0; }.order-inputs label { display:grid; gap:5px; font-size:.75rem; font-weight:750; color:var(--text); }.order-inputs input,.order-inputs select { padding:8px; border:1px solid var(--border); border-radius:6px; font:inherit; }.order-quick { display:flex; gap:7px; }.order-quick button { padding:6px 9px; color:#0369a1; background:rgba(56,189,248,.1); border:1px solid #bae6fd; border-radius:6px; font-size:.73rem; font-weight:800; }.order-result { margin-top:14px; padding:14px; border:1px solid #bae6fd; border-radius:10px; }.order-result>strong { color:#0369a1; font-size:1.05rem; }.order-result p { margin:5px 0 10px; color:var(--text); font-size:.78rem; }.order-result dl { display:grid; grid-template-columns:repeat(4,1fr); gap:8px; margin:0; }.order-result dl div { padding:8px; background:var(--surface-soft); border-radius:6px; }.order-result dt { color:var(--text-muted); font-size:.67rem; }.order-result dd { margin:4px 0 0; font-weight:800; font-size:.78rem; }.order-modal footer { margin-top:13px; padding:10px; color:var(--text-muted); background:var(--surface-soft); border-radius:7px; font-size:.72rem; line-height:1.45; }
.order-inputs input:disabled { color:#94a3b8; background:var(--surface-soft); cursor:not-allowed; }
@media (max-width:640px) { .order-modal header,.order-modal main { padding-left:15px; padding-right:15px; }.order-book,.order-inputs,.order-result dl { grid-template-columns:1fr 1fr; }.order-book b { grid-column:span 2; } }
.backtest-simulator-button { display:inline-flex; align-items:center; gap:7px; padding:10px 14px; color:var(--primary); background:rgba(168,85,247,.1); border:1px solid rgba(168,85,247,.3); border-radius:9px; font-size:.82rem; font-weight:800; }.backtest-simulator-button:hover { color:#fff; background:#7c3aed; }.backtest-modal-backdrop { position:fixed; z-index:1200; inset:0; display:none; place-items:center; padding:16px; background:rgba(15,23,42,.58); }.backtest-modal-backdrop.show { display:grid; }.backtest-modal { width:min(900px,100%); max-height:96vh; overflow:auto; background:var(--surface); border-radius:16px; }.backtest-modal header { display:flex; justify-content:space-between; align-items:flex-start; padding:20px 24px; border-bottom:1px solid #e2e8f0; }.backtest-modal header>div { display:flex; align-items:center; gap:12px; }.backtest-modal header span { display:grid; width:42px; height:42px; place-items:center; color:#fff; background:#7c3aed; border-radius:11px; }.backtest-modal h2 { margin:0; }.backtest-modal header p { margin:3px 0 0; color:var(--text-muted); font-size:.8rem; }.backtest-modal main { padding:18px 24px 22px; }.backtest-step { display:flex; gap:8px; align-items:center; margin-bottom:10px; color:#4c1d95; font-size:.84rem; font-weight:800; }.backtest-step b { padding:3px 7px; color:var(--primary); background:rgba(168,85,247,.12); border-radius:20px; font-size:.67rem; }.backtest-inputs { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; }.backtest-inputs label { display:grid; gap:5px; color:var(--text); font-size:.74rem; font-weight:750; }.backtest-inputs input { width:100%; box-sizing:border-box; padding:9px; border:1px solid var(--border); border-radius:7px; font:inherit; }.backtest-results { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin:16px 0; }.backtest-results article { padding:12px; background:var(--surface-soft); border:1px solid var(--border); border-radius:9px; }.backtest-results small { display:block; color:var(--text-muted); font-size:.7rem; }.backtest-results strong { display:block; margin-top:5px; color:var(--text); font-size:1.05rem; }.backtest-chart-wrap { padding:10px; border:1px solid rgba(168,85,247,.3); border-radius:10px; background:var(--surface-soft); }.backtest-reading { margin-top:14px; padding:13px; border-radius:9px; background:var(--primary-light); }.backtest-reading h3 { margin:0 0 6px; color:#92400e; font-size:.86rem; }.backtest-reading p { margin:5px 0; color:#57534e; font-size:.79rem; line-height:1.55; }.backtest-reading p:last-child { color:#92400e; font-weight:700; }.backtest-modal footer { margin-top:14px; padding:10px; color:var(--text-muted); background:var(--surface-soft); border-radius:8px; font-size:.72rem; line-height:1.5; }.backtest-modal footer button { float:right; padding:5px 8px; color:var(--primary); background:var(--surface); border:1px solid rgba(168,85,247,.3); border-radius:5px; font-size:.7rem; font-weight:800; }
@media (max-width:640px) { .backtest-modal header,.backtest-modal main { padding-left:15px; padding-right:15px; }.backtest-inputs,.backtest-results { grid-template-columns:repeat(2,1fr); }.backtest-modal footer button { float:none; display:block; margin-top:8px; } }
.nps-holdings-button { display:inline-flex; align-items:center; gap:7px; padding:10px 14px; color:#075985; background:rgba(56,189,248,.1); border:1px solid rgba(56,189,248,.3); border-radius:9px; font-size:.82rem; font-weight:800; }.nps-holdings-button:hover { color:#fff; background:#2563eb; }.nps-holdings-backdrop { position:fixed; z-index:1200; inset:0; display:none; place-items:center; padding:16px; background:rgba(15,23,42,.58); }.nps-holdings-backdrop.show { display:grid; }.nps-holdings-modal { width:min(970px,100%); max-height:94vh; overflow:auto; background:var(--surface); border-radius:16px; }.nps-holdings-modal header { display:flex; justify-content:space-between; align-items:flex-start; padding:20px 24px; border-bottom:1px solid #e2e8f0; }.nps-holdings-modal header>div { display:flex; gap:12px; align-items:center; }.nps-holdings-modal header span { display:grid; place-items:center; width:42px; height:42px; color:#fff; background:#2563eb; border-radius:11px; }.nps-holdings-modal h2 { margin:0; }.nps-holdings-modal header p { margin:3px 0 0; color:var(--text-muted); font-size:.8rem; }.nps-holdings-modal main { padding:18px 24px 22px; }.nps-holdings-tabs { display:flex; gap:7px; padding-bottom:13px; border-bottom:1px solid #e2e8f0; }.nps-holdings-tabs button { padding:7px 10px; color:var(--text-muted); background:var(--surface-soft); border:1px solid var(--border); border-radius:7px; font-size:.75rem; font-weight:800; }.nps-holdings-tabs button.is-active { color:#fff; background:#2563eb; border-color:var(--primary); }.nps-holdings-tabs button:disabled { color:#94a3b8; cursor:not-allowed; }.nps-holdings-toolbar { display:flex; justify-content:space-between; align-items:center; gap:12px; margin:14px 0 8px; }.nps-holdings-toolbar label { display:flex; align-items:center; gap:7px; width:min(300px,100%); padding:8px 10px; border:1px solid var(--border); border-radius:7px; color:var(--text-muted); }.nps-holdings-toolbar input { width:100%; border:0; outline:0; font:inherit; }.nps-holdings-toolbar span { color:var(--text-muted); font-size:.75rem; }.nps-holdings-status,.nps-holdings-note { margin:8px 0; color:var(--text-muted); font-size:.75rem; }.nps-holdings-table-wrap { overflow-x:auto; border:1px solid var(--border); border-radius:9px; }.nps-holdings-table-wrap table { width:100%; min-width:650px; border-collapse:collapse; font-size:.8rem; }.nps-holdings-table-wrap th { padding:10px 12px; color:#fff; background:#1e3a5f; text-align:left; }.nps-holdings-table-wrap td { padding:10px 12px; border-top:1px solid #e2e8f0; }.nps-holdings-table-wrap td:not(:first-child) { text-align:right; font-variant-numeric:tabular-nums; }.nps-holdings-table-wrap tbody tr:nth-child(even) { background:var(--surface-soft); }.nps-holdings-note { padding:10px; background:var(--surface-soft); border-radius:7px; line-height:1.5; }
@media (max-width:640px) { .nps-holdings-modal header,.nps-holdings-modal main { padding-left:15px; padding-right:15px; }.nps-holdings-toolbar { align-items:stretch; flex-direction:column; }.nps-holdings-toolbar label { width:auto; } }
.split-buy-simulator-button { display:inline-flex; align-items:center; gap:7px; padding:10px 14px; color:#0f766e; background:var(--green-bg); border:1px solid #99f6e4; border-radius:9px; font-size:.82rem; font-weight:800; }.split-buy-simulator-button:hover { color:#fff; background:#0d9488; }.split-buy-modal-backdrop { position:fixed; z-index:1200; inset:0; display:none; place-items:center; padding:16px; background:rgba(15,23,42,.58); }.split-buy-modal-backdrop.show { display:grid; }.split-buy-modal { width:min(1080px,96vw); max-height:96vh; overflow-y:auto; overflow-x:hidden; background:var(--surface); border-radius:16px; }.split-buy-modal header { display:flex; justify-content:space-between; padding:20px 24px; border-bottom:1px solid #e2e8f0; }.split-buy-modal header>div { display:flex; gap:12px; align-items:center; }.split-buy-modal header span { display:grid; width:42px; height:42px; place-items:center; color:#fff; background:#0d9488; border-radius:11px; }.split-buy-modal h2 { margin:0; }.split-buy-modal header p { margin:3px 0 0; color:var(--text-muted); font-size:.8rem; }.split-buy-modal main { padding:18px 24px 22px; }.split-buy-steps { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; }.split-buy-step { display:grid; gap:6px; padding:10px; background:var(--green-bg); border:1px solid #99f6e4; border-radius:9px; }.split-buy-step label { display:grid; gap:4px; color:#134e4a; font-size:.71rem; font-weight:750; }.split-buy-step input[type="number"] { padding:6px; border:1px solid var(--border); border-radius:6px; font:inherit; }.split-buy-toggle { display:flex !important; flex-direction:row !important; align-items:center; gap:6px; font-size:.78rem !important; font-weight:800 !important; }.split-buy-now { display:grid; grid-template-columns:auto 160px; align-items:center; gap:10px; margin:14px 0; color:var(--text); font-size:.78rem; font-weight:750; }.split-buy-now input { padding:8px; border:1px solid var(--border); border-radius:6px; font:inherit; }.split-buy-chart-wrap { padding:10px; border:1px solid #99f6e4; border-radius:10px; background:var(--surface-soft); }.split-buy-table-wrap { overflow-x:auto; margin:14px 0; }.split-buy-table { width:100%; min-width:560px; margin:0; border-collapse:collapse; font-size:.78rem; }.split-buy-table th,.split-buy-table td { padding:7px 8px; text-align:right; border-bottom:1px solid #e2e8f0; }.split-buy-table th:first-child,.split-buy-table td:first-child { text-align:left; color:var(--text-muted); }.split-buy-table thead th { color:var(--text-muted); font-weight:750; }.split-buy-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin:14px 0; }.split-buy-summary article { display:grid; gap:5px; padding:12px; background:var(--surface-soft); border:1px solid var(--border); border-radius:9px; }.split-buy-summary span { color:var(--text-muted); font-size:.7rem; font-weight:750; }.split-buy-summary strong { color:#0f766e; font-size:1.02rem; }.split-buy-reading { margin:0; padding:12px 13px; color:#134e4a; background:var(--green-bg); border:1px solid #99f6e4; border-radius:9px; font-size:.8rem; line-height:1.55; }.split-buy-modal footer { display:flex; gap:8px; align-items:center; margin-top:14px; padding:10px 12px; color:var(--text-muted); background:var(--surface-soft); border-radius:8px; font-size:.72rem; }.split-buy-modal footer button { margin-left:auto; padding:6px 8px; color:#0f766e; background:var(--surface); border:1px solid #99f6e4; border-radius:6px; font-size:.69rem; font-weight:800; }
@media (max-width:640px) { .split-buy-modal header,.split-buy-modal main { padding-left:15px; padding-right:15px; }.split-buy-steps { grid-template-columns:repeat(2,1fr); }.split-buy-summary { grid-template-columns:repeat(2,1fr); }.split-buy-now { grid-template-columns:1fr; } }
.dividend-calendar-button { display:inline-flex; align-items:center; gap:7px; padding:10px 14px; color:#9d174d; background:rgba(255,59,92,.1); border:1px solid #fbcfe8; border-radius:9px; font-size:.82rem; font-weight:800; }.dividend-calendar-button:hover { color:#fff; background:#db2777; }
.dividend-calendar-modal-backdrop { position:fixed; z-index:1200; inset:0; display:none; place-items:center; padding:16px; background:rgba(15,23,42,.58); }.dividend-calendar-modal-backdrop.show { display:grid; }
.dividend-calendar-modal { width:min(980px,97vw); max-height:96vh; overflow:auto; background:var(--surface); border-radius:16px; }
.dividend-calendar-modal header { display:flex; justify-content:space-between; padding:20px 24px; border-bottom:1px solid #e2e8f0; }.dividend-calendar-modal header>div { display:flex; gap:12px; align-items:center; }
.dividend-calendar-modal header span { display:grid; width:42px; height:42px; place-items:center; color:#fff; background:#db2777; border-radius:11px; font-size:1.1rem; }
.dividend-calendar-modal h2 { margin:0; }.dividend-calendar-modal header p { margin:3px 0 0; color:var(--text-muted); font-size:.8rem; }
.dividend-calendar-modal header>button { width:40px; height:40px; flex:0 0 auto; color:var(--text-muted); border-radius:10px; font-size:1.2rem; }
.dividend-calendar-tabs { display:flex; flex-wrap:wrap; gap:8px; padding:14px 24px 0; }
.dividend-calendar-tabs button { padding:8px 12px; color:#9d174d; background:rgba(255,59,92,.1); border:1px solid #fbcfe8; border-radius:8px; font-size:.78rem; font-weight:800; }
.dividend-calendar-tabs button.is-active { color:#fff; background:#db2777; border-color:#db2777; }
.dividend-calendar-modal main { padding:16px 24px 22px; }
.dividend-calendar-status { margin:0 0 12px; color:var(--text); font-size:.78rem; }
.dividend-calendar-highlights { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin-bottom:18px; }
.dividend-calendar-highlights article { display:flex; flex-direction:column; gap:5px; padding:12px; background:var(--surface-soft); border:1px solid var(--border); border-radius:9px; }
.dividend-calendar-highlights article.is-estimate { background:rgba(255,59,92,.1); border-color:#fbcfe8; }
.dividend-calendar-highlights span { color:var(--text-muted); font-size:.7rem; font-weight:750; }
.dividend-calendar-highlights strong { color:var(--text); font-size:1.02rem; font-variant-numeric:tabular-nums; }
.dividend-calendar-highlights article.is-estimate strong { color:#9d174d; }
.dividend-calendar-subtitle { margin:0 0 8px; color:var(--text); font-size:.86rem; font-weight:800; }
.dividend-calendar-table-wrap { overflow-x:auto; }
.dividend-calendar-table { width:100%; min-width:420px; margin:0 0 10px; border-collapse:collapse; font-size:.78rem; }
.dividend-calendar-table th,.dividend-calendar-table td { padding:7px 8px; text-align:left; border-bottom:1px solid #e2e8f0; }
.dividend-calendar-table thead th { color:var(--text-muted); font-weight:750; }
.dividend-calendar-table small { margin-left:5px; padding:1px 5px; color:#db2777; background:rgba(255,59,92,.1); border-radius:4px; font-size:.64rem; font-weight:800; }
.dividend-calendar-table tr.is-estimate td { color:#9d174d; background:rgba(255,59,92,.1); }
.dividend-calendar-note { display:block; margin:8px 0 0; padding:11px 12px; color:#831843; background:rgba(255,59,92,.1); border:1px solid #fbcfe8; border-radius:8px; font-size:.74rem; line-height:1.5; }
@media (max-width:760px) { .dividend-calendar-highlights { grid-template-columns:repeat(2,1fr); } }
@media (max-width:640px) { .dividend-calendar-modal header,.dividend-calendar-modal main,.dividend-calendar-tabs { padding-left:15px; padding-right:15px; } }
.financial-statement-samples-button { display: inline-flex; align-items: center; gap: 8px; padding: 10px 14px; color:var(--primary); background:rgba(56,189,248,.1); border: 1px solid rgba(56,189,248,.3); border-radius: 9px; font-size: .82rem; font-weight: 800; box-shadow: 0 2px 5px rgba(37,99,235,.08); }
.financial-statement-samples-button:hover { color: #fff; background: #2563eb; border-color:var(--primary); }
.financial-statement-modal-backdrop { position: fixed; z-index: 1200; inset: 0; display: none; align-items: center; justify-content: center; padding: .5vh .5vw; background: rgba(15,23,42,.58); backdrop-filter: blur(2px); }
.financial-statement-modal-backdrop.show { display: flex; }
.financial-statement-modal { width: min(1480px, 100%); max-height: 99vh; overflow: auto; background:var(--surface); border: 1px solid var(--border); border-radius: 18px; box-shadow: 0 24px 70px rgba(15,23,42,.32); }
.financial-statement-modal-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; padding: clamp(18px, 2.1vw, 28px) clamp(20px, 3vw, 34px); border-bottom: 1px solid #e2e8f0; }
.financial-statement-modal-header > div { display: flex; align-items: center; gap: 16px; }
.financial-statement-modal-icon { display: inline-flex; align-items: center; justify-content: center; width: 46px; height: 46px; color: #fff; background: linear-gradient(135deg, #1d4ed8, #0f766e); border-radius: 13px; font-size: 1.2rem; }
.financial-statement-modal h2 { margin: 0; color:var(--text); font-size: clamp(1.25rem, 2.2vw, 1.75rem); }
.financial-statement-modal-header p { margin: 4px 0 0; color:var(--text-muted); font-size: clamp(.82rem, 1.2vw, .96rem); }
.financial-statement-modal-close { width: 40px; height: 40px; flex: 0 0 auto; color:var(--text-muted); border-radius: 10px; font-size: 1.2rem; }
.financial-statement-modal-close:hover { color:var(--text); background:var(--surface-soft); }
.financial-statement-simulator { position: relative; padding: clamp(16px, 2vw, 24px) clamp(20px, 3vw, 34px) 20px; }
.financial-statement-input-connections { position: absolute; z-index: 1; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; }
.financial-input-connection { fill: none; stroke-width: 2; stroke-dasharray: 4 3; opacity: .9; }
.financial-input-connection.input-link-0 { stroke: #2563eb; }
.financial-input-connection.input-link-1, .financial-input-connection.input-link-2 { stroke: #e11d48; }
.financial-input-connection.input-link-3 { stroke: #0891b2; }
.financial-input-connection.input-link-4 { stroke: #d97706; }
.financial-input-connection.input-link-5 { stroke: #7c3aed; }
.financial-input-connection.input-link-6 { stroke: #d97706; }
.financial-input-connection.input-link-7 { stroke: #7c3aed; }
.financial-statement-inputs { padding: 15px 17px 17px; background:var(--surface-soft); border: 1px solid #dbeafe; border-radius: 12px; }
.financial-statement-inputs, .financial-statement-flow, .financial-statement-modal-note { position: relative; z-index: 3; }
.financial-statement-section-heading { display: flex; justify-content: space-between; align-items: center; gap: 14px; margin-bottom: 12px; }
.financial-statement-section-heading > div { display: flex; align-items: center; gap: 9px; }
.financial-statement-section-heading span { padding: 3px 7px; color:var(--primary); background:var(--primary-light); border-radius: 99px; font-size: .67rem; font-weight: 900; letter-spacing: .04em; }
.financial-statement-section-heading h3 { margin: 0; color: #1e293b; font-size: .95rem; }
.financial-statement-section-heading p { margin: 0; color:var(--text-muted); font-size: .76rem; }
.financial-statement-input-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.financial-statement-input-grid label { display: grid; grid-template-columns: max-content minmax(0, 1fr); align-items: center; column-gap: 6px; color:var(--text); font-size: .76rem; font-weight: 750; }
.financial-statement-input-grid label > span { min-width: 0; }
.financial-statement-input-grid input { grid-column: 1 / -1; width: 100%; box-sizing: border-box; margin-top: 5px; padding: 8px 9px; color:var(--text); background:var(--surface); border: 1px solid var(--border); border-radius: 7px; font-size: .92rem; font-weight: 800; font-variant-numeric: tabular-nums; }
.financial-statement-input-grid input:focus { outline: 2px solid #93c5fd; border-color:var(--primary); }
.financial-statement-input-grid small { min-width: 0; color: #94a3b8; font-size: .64rem; font-weight: 500; white-space: nowrap; }
.financial-statement-flow { display: flex; align-items: center; justify-content: center; gap: 11px; padding: 14px 0 11px; color:var(--text-muted); font-size: .78rem; font-weight: 800; }
.financial-statement-flow span { padding: 4px 10px; color: #1e40af; background:rgba(56,189,248,.1); border-radius: 99px; }
.financial-statement-flow i { color: #94a3b8; font-size: .72rem; }
.financial-statement-results { position: relative; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.financial-statement-connections { position: absolute; z-index: 2; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; }
.financial-connection-line { fill: none; stroke-width: 2; stroke-dasharray: 4 3; }
.financial-connection-line.link-0 { stroke: #2563eb; }
.financial-connection-line.link-1 { stroke: #d97706; }
.financial-connection-line.link-2 { stroke: #7c3aed; }
.financial-connection-line.link-3 { stroke: #059669; }
.financial-connection-label.link-0 { fill: #2563eb; }
.financial-connection-label.link-1 { fill: #b45309; }
.financial-connection-label.link-2 { fill: #6d28d9; }
.financial-connection-label.link-3 { fill: #047857; }
.financial-connection-label { font-size: 10px; font-weight: 800; text-anchor: middle; paint-order: stroke; stroke: #fff; stroke-width: 4px; stroke-linejoin: round; }
.financial-statement-card { position: relative; z-index: 3; overflow: hidden; border: 1px solid #dbe3ee; border-radius: 11px; }
.financial-statement-card h3 { margin: 0; padding: 13px 15px; color: #fff; background: #1e3a5f; font-size: .98rem; }
.financial-statement-card h3 i { margin-right: 5px; }
.financial-statement-card dl { margin: 0; padding: 7px 15px 9px; }
.financial-statement-card dl > div { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 32px; border-bottom: 1px solid #eef2f7; }
.financial-statement-card dl > div:last-child { border-bottom: 0; }
.financial-statement-card dt { color:var(--text-muted); font-size: .84rem; }
.financial-statement-card .input-row { background:rgba(240,185,11,.1); }
.financial-statement-card .input-row dt { color: #9a6700; }
.financial-statement-card dt small { color: #94a3b8; font-size: .69rem; font-weight: 500; }
.financial-statement-card dd { margin: 0; color:var(--text); font-size: .96rem; font-weight: 800; font-variant-numeric: tabular-nums; }
.financial-statement-card dd.negative { color: #dc2626; }
.financial-statement-card .total { margin-inline: -15px; padding: 0 15px; background:rgba(56,189,248,.1); border-bottom: 0; }
.financial-statement-card .total dt, .financial-statement-card .total dd { color:var(--primary); font-weight: 900; }
.financial-statement-card .balance-check dd { color: #059669; font-size: .76rem; }
.financial-statement-modal-note { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 14px 0 0; padding: 10px 12px; color:var(--text); background:var(--surface-soft); border-radius: 9px; font-size: .74rem; line-height: 1.45; }
.financial-statement-modal-note i { margin-right: 4px; color:var(--primary); }
.financial-statement-modal-note button { flex: 0 0 auto; padding: 6px 8px; color:var(--primary); background:var(--surface); border: 1px solid rgba(56,189,248,.3); border-radius: 6px; font-size: .7rem; font-weight: 800; }
.financial-statement-modal-note button:hover { color: #fff; background: #2563eb; }
.valuation-simulator-button { display: inline-flex; align-items: center; gap: 7px; margin: 2px 0 4px; padding: 10px 14px; color:var(--primary); background:rgba(168,85,247,.1); border: 1px solid rgba(168,85,247,.3); border-radius: 9px; font-size: .82rem; font-weight: 800; box-shadow: 0 2px 5px rgba(124,58,237,.08); }
.valuation-simulator-button:hover { color: #fff; background: #7c3aed; border-color:var(--primary); }
.psr-simulator-button { display: inline-flex; align-items: center; gap: 7px; margin: 2px 0 4px 7px; padding: 10px 14px; color: #9a3412; background:rgba(240,185,11,.12); border: 1px solid #fed7aa; border-radius: 9px; font-size: .82rem; font-weight: 800; box-shadow: 0 2px 5px rgba(194,65,12,.08); }
.psr-simulator-button:hover { color: #fff; background: #ea580c; border-color: #ea580c; }
.valuation-modal-backdrop { position: fixed; z-index: 1200; inset: 0; display: none; align-items: center; justify-content: center; padding: .5vh .5vw; background: rgba(15,23,42,.58); backdrop-filter: blur(2px); }
.valuation-modal-backdrop.show { display: flex; }
.valuation-modal { width: min(1640px, 100%); max-height: 99vh; overflow: auto; background:var(--surface); border: 1px solid var(--border); border-radius: 18px; box-shadow: 0 24px 70px rgba(15,23,42,.32); }
.valuation-modal-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; padding: 23px 28px 20px; border-bottom: 1px solid #e2e8f0; }
.valuation-modal-header > div { display: flex; align-items: center; gap: 14px; }
.valuation-modal-icon { display: inline-flex; align-items: center; justify-content: center; width: 46px; height: 46px; color: #fff; background: linear-gradient(135deg, #7c3aed, #2563eb); border-radius: 13px; font-size: 1.2rem; }
.valuation-modal h2 { margin: 0; color:var(--text); font-size: 1.45rem; }
.valuation-modal-header p { margin: 4px 0 0; color:var(--text-muted); font-size: .88rem; }
.valuation-modal-close { width: 40px; height: 40px; flex: 0 0 auto; color:var(--text-muted); border-radius: 10px; font-size: 1.2rem; }
.valuation-modal-close:hover { color:var(--text); background:var(--surface-soft); }
.valuation-simulator { padding: 20px 28px 24px; }
.valuation-inputs { padding: 15px 17px 17px; background: #faf9ff; border: 1px solid #e9d5ff; border-radius: 12px; }
.valuation-section-heading { display: flex; align-items: center; gap: 9px; margin-bottom: 12px; }
.valuation-section-heading > span { padding: 3px 7px; color:var(--primary); background:rgba(168,85,247,.12); border-radius: 99px; font-size: .67rem; font-weight: 900; letter-spacing: .04em; }
.valuation-section-heading h3 { margin: 0; color:var(--text); font-size: .94rem; }
.valuation-section-heading p { margin: 0 0 0 auto; color:var(--text-muted); font-size: .72rem; }
.valuation-input-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 11px; }
.valuation-input-grid label { display: grid; gap: 5px; color:var(--text); font-size: .76rem; font-weight: 750; }
.valuation-input-grid input { width: 100%; box-sizing: border-box; padding: 8px 9px; color:var(--text); background:var(--surface); border: 1px solid var(--border); border-radius: 7px; font-size: .94rem; font-weight: 800; font-variant-numeric: tabular-nums; }
.valuation-input-grid input:focus { outline: 2px solid #c4b5fd; border-color:var(--primary); }
.valuation-results { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin: 16px 0; }
.valuation-metric { display: grid; gap: 5px; padding: 13px; background:var(--surface-soft); border: 1px solid #dbe3ee; border-radius: 10px; }
.valuation-metric > span { color:var(--text-muted); font-size: .73rem; font-weight: 750; }
.valuation-metric strong { color:var(--text); font-size: 1.08rem; font-variant-numeric: tabular-nums; white-space: nowrap; }
.valuation-metric strong b { font-weight: 800; }
.valuation-metric small { color: #94a3b8; font-size: .65rem; }
.valuation-metric.highlight { background:rgba(168,85,247,.1); border-color: rgba(168,85,247,.4); }
.valuation-metric.highlight strong { color:var(--primary); font-size: 1.22rem; }
.valuation-metric.highlight.green { background:var(--green-bg); border-color: #a7f3d0; }
.valuation-metric.highlight.green strong { color: #047857; }
.psr-results { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.valuation-metric.psr-highlight { background:rgba(240,185,11,.12); border-color: #fdba74; }
.valuation-metric.psr-highlight strong { color: #c2410c; }
.valuation-formulas { padding: 15px 17px; border: 1px solid #dbe3ee; border-radius: 12px; }
.valuation-formulas ol { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; counter-reset: formula; }
.valuation-formulas li { display: grid; grid-template-columns: 26% 1fr; gap: 10px; align-items: center; padding: 9px 10px; color:var(--text); background:var(--surface-soft); border-radius: 7px; font-size: .81rem; }
.valuation-formulas li b { color:var(--text); }
.valuation-formulas li span { color:var(--text); font-weight: 700; font-variant-numeric: tabular-nums; }
.valuation-formulas li.per-formula { color: #4c1d95; background:rgba(168,85,247,.1); border: 1px solid rgba(168,85,247,.3); }
.valuation-formulas li.per-formula b, .valuation-formulas li.per-formula span { color:var(--primary); }
.valuation-per-meaning { margin-top: 14px; padding: 14px 17px; background:var(--primary-light); border: 1px solid #fde68a; border-radius: 12px; }
.valuation-per-meaning .valuation-section-heading { margin-bottom: 9px; }
.valuation-per-meaning .valuation-section-heading > span { color: #a16207; background:var(--primary-light); }
.valuation-per-meaning .valuation-section-heading h3 { color:var(--text-muted); }
.valuation-per-meaning-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.valuation-per-meaning-grid article { display: grid; gap: 5px; padding: 11px 12px; background:var(--surface); border: 1px solid #fde68a; border-radius: 8px; }
.valuation-per-meaning-grid article > span { color: #a16207; font-size: .7rem; font-weight: 800; }
.valuation-per-meaning-grid article > span i { margin-right: 4px; }
.valuation-per-meaning-grid strong { color:var(--text-muted); font-size: .9rem; }
.valuation-per-meaning-grid p { margin: 0; color:var(--text-muted); font-size: .73rem; line-height: 1.5; }
.psr-meaning { margin-top: 14px; padding: 14px 17px; background:rgba(240,185,11,.12); border: 1px solid #fed7aa; border-radius: 12px; }
.psr-meaning .valuation-section-heading { margin-bottom: 9px; }
.psr-meaning .valuation-section-heading > span { color: #c2410c; background:rgba(240,185,11,.14); }
.psr-meaning .valuation-section-heading h3 { color: #9a3412; }
.psr-meaning-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.psr-meaning-grid article { padding: 11px 12px; background:var(--surface); border: 1px solid #fed7aa; border-radius: 8px; }
.psr-meaning-grid strong { display: block; color: #9a3412; font-size: .86rem; }
.psr-meaning-grid p { margin: 6px 0 0; color:var(--text-muted); font-size: .73rem; line-height: 1.5; }
.valuation-examples { margin-top: 14px; padding: 14px 17px; background:var(--surface-soft); border: 1px solid #dbe3ee; border-radius: 12px; }
.valuation-examples .valuation-section-heading { margin-bottom: 7px; }
.valuation-example-intro { margin: 0 0 10px; color:var(--text); font-size: .79rem; line-height: 1.45; }
.valuation-example-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.valuation-example-cards article { display: grid; gap: 4px; padding: 10px 12px; background:var(--surface); border: 1px solid var(--border); border-left: 3px solid #8b5cf6; border-radius: 8px; }
.valuation-example-cards article span { color:var(--primary); font-size: .69rem; font-weight: 800; }
.valuation-example-cards article strong { color: #1e293b; font-size: .88rem; }
.valuation-example-cards article p { margin: 0; color:var(--text-muted); font-size: .72rem; line-height: 1.4; }
.valuation-note { display: flex; align-items: center; gap: 8px; margin-top: 14px; padding: 10px 12px; color:var(--text-muted); background:var(--surface-soft); border-radius: 9px; font-size: .74rem; line-height: 1.45; }
.valuation-note > i { color:var(--primary); }
.valuation-note button { flex: 0 0 auto; margin-left: auto; padding: 6px 8px; color:var(--primary); background:var(--surface); border: 1px solid rgba(168,85,247,.3); border-radius: 6px; font-size: .69rem; font-weight: 800; }
.valuation-note button:hover { color: #fff; background: #7c3aed; }
.roe-eps-simulator-button { display: inline-flex; align-items: center; gap: 7px; margin: 4px 0; padding: 10px 14px; color: #0369a1; background:rgba(56,189,248,.1); border: 1px solid #bae6fd; border-radius: 9px; font-size: .82rem; font-weight: 800; box-shadow: 0 2px 5px rgba(2,132,199,.08); }
.roe-eps-simulator-button:hover { color: #fff; background: #0284c7; border-color: #0284c7; }
.roe-eps-modal-backdrop { position: fixed; z-index: 1200; inset: 0; display: none; align-items: center; justify-content: center; padding: 1vh 1vw; background: rgba(15,23,42,.58); backdrop-filter: blur(2px); }
.roe-eps-modal-backdrop.show { display: flex; }
.roe-eps-modal { width: min(1160px, 100%); max-height: 98vh; overflow: auto; background:var(--surface); border: 1px solid var(--border); border-radius: 18px; box-shadow: 0 24px 70px rgba(15,23,42,.32); }
.roe-eps-modal-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; padding: 22px 28px 19px; border-bottom: 1px solid #e2e8f0; }
.roe-eps-modal-header > div { display: flex; align-items: center; gap: 14px; }
.roe-eps-modal-icon { display: inline-flex; align-items: center; justify-content: center; width: 46px; height: 46px; color: #fff; background: linear-gradient(135deg, #0284c7, #0f766e); border-radius: 13px; font-size: 1.2rem; }
.roe-eps-modal h2 { margin: 0; color:var(--text); font-size: 1.45rem; }
.roe-eps-modal-header p { margin: 4px 0 0; color:var(--text-muted); font-size: .88rem; }
.roe-eps-modal-close { width: 40px; height: 40px; flex: 0 0 auto; color:var(--text-muted); border-radius: 10px; font-size: 1.2rem; }
.roe-eps-modal-close:hover { color:var(--text); background:var(--surface-soft); }
.roe-eps-simulator { padding: 20px 28px 24px; }
.roe-eps-inputs { padding: 15px 17px 17px; background:rgba(56,189,248,.1); border: 1px solid #bae6fd; border-radius: 12px; }
.roe-eps-section-heading { display: flex; align-items: center; gap: 9px; margin-bottom: 12px; }
.roe-eps-section-heading > span { padding: 3px 7px; color: #0369a1; background:var(--primary-light); border-radius: 99px; font-size: .67rem; font-weight: 900; letter-spacing: .04em; }
.roe-eps-section-heading h3 { margin: 0; color: #0c4a6e; font-size: .94rem; }
.roe-eps-section-heading p { margin: 0 0 0 auto; color:var(--text-muted); font-size: .72rem; }
.roe-eps-input-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 11px; }
.roe-eps-input-grid label { display: grid; gap: 5px; color:var(--text); font-size: .76rem; font-weight: 750; }
.roe-eps-input-grid input { width: 100%; box-sizing: border-box; padding: 8px 9px; color:var(--text); background:var(--surface); border: 1px solid var(--border); border-radius: 7px; font-size: .94rem; font-weight: 800; font-variant-numeric: tabular-nums; }
.roe-eps-input-grid input:focus { outline: 2px solid #7dd3fc; border-color: #0284c7; }
.roe-eps-results { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin: 16px 0; }
.roe-eps-results > div { display: grid; gap: 5px; padding: 14px; background:var(--surface-soft); border: 1px solid #dbe3ee; border-radius: 10px; }
.roe-eps-results span { color:var(--text-muted); font-size: .76rem; font-weight: 750; }
.roe-eps-results strong { color:var(--text); font-size: 1.3rem; font-variant-numeric: tabular-nums; }
.roe-eps-results small { color: #94a3b8; font-size: .67rem; }
.roe-eps-results .highlight { background:var(--green-bg); border-color: #a7f3d0; }
.roe-eps-results .highlight strong { color: #047857; }
.roe-eps-results .highlight.blue { background:rgba(56,189,248,.1); border-color: rgba(56,189,248,.3); }
.roe-eps-results .highlight.blue strong { color:var(--primary); }
.roe-eps-formulas { padding: 15px 17px; border: 1px solid #dbe3ee; border-radius: 12px; }
.roe-eps-formulas ol { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.roe-eps-formulas li { display: grid; grid-template-columns: 24% 1fr; gap: 10px; align-items: center; padding: 10px; color:var(--text); background:var(--surface-soft); border-radius: 7px; font-size: .84rem; font-weight: 700; font-variant-numeric: tabular-nums; }
.roe-eps-formulas li b { color:var(--text); }
.roe-eps-formulas .roe-formula { color: #047857; background:var(--green-bg); border: 1px solid #a7f3d0; }
.roe-eps-formulas .roe-formula b { color: #047857; }
.roe-eps-formulas .eps-formula { color:var(--primary); background:rgba(56,189,248,.1); border: 1px solid rgba(56,189,248,.3); }
.roe-eps-formulas .eps-formula b { color:var(--primary); }
.roe-eps-note { display: flex; align-items: center; gap: 8px; margin-top: 14px; padding: 10px 12px; color:var(--text-muted); background:var(--surface-soft); border-radius: 9px; font-size: .74rem; line-height: 1.45; }
.roe-eps-note > i { color: #0284c7; }
.roe-eps-note button { flex: 0 0 auto; margin-left: auto; padding: 6px 8px; color: #0369a1; background:var(--surface); border: 1px solid #bae6fd; border-radius: 6px; font-size: .69rem; font-weight: 800; }
.roe-eps-note button:hover { color: #fff; background: #0284c7; }
.financial-health-simulator-button { display: inline-flex; align-items: center; gap: 7px; margin: 4px 0; padding: 10px 14px; color: #047857; background:var(--green-bg); border: 1px solid #a7f3d0; border-radius: 9px; font-size: .82rem; font-weight: 800; box-shadow: 0 2px 5px rgba(5,150,105,.08); }
.financial-health-simulator-button:hover { color: #fff; background: #059669; border-color: #059669; }
.financial-health-modal-backdrop { position: fixed; z-index: 1200; inset: 0; display: none; align-items: center; justify-content: center; padding: 1vh 1vw; background: rgba(15,23,42,.58); backdrop-filter: blur(2px); }
.financial-health-modal-backdrop.show { display: flex; }
.financial-health-modal { width: min(1320px, 100%); max-height: 98vh; overflow: auto; background:var(--surface); border: 1px solid var(--border); border-radius: 18px; box-shadow: 0 24px 70px rgba(15,23,42,.32); }
.financial-health-modal-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; padding: 22px 28px 19px; border-bottom: 1px solid #e2e8f0; }
.financial-health-modal-header > div { display: flex; align-items: center; gap: 14px; }
.financial-health-modal-icon { display: inline-flex; align-items: center; justify-content: center; width: 46px; height: 46px; color: #fff; background: linear-gradient(135deg, #059669, #0f766e); border-radius: 13px; font-size: 1.2rem; }
.financial-health-modal h2 { margin: 0; color:var(--text); font-size: 1.45rem; }
.financial-health-modal-header p { margin: 4px 0 0; color:var(--text-muted); font-size: .88rem; }
.financial-health-modal-close { width: 40px; height: 40px; flex: 0 0 auto; color:var(--text-muted); border-radius: 10px; font-size: 1.2rem; }
.financial-health-modal-close:hover { color:var(--text); background:var(--surface-soft); }
.financial-health-simulator { padding: 20px 28px 24px; }
.financial-health-inputs { padding: 15px 17px 17px; background:var(--green-bg); border: 1px solid #a7f3d0; border-radius: 12px; }
.financial-health-section-heading { display: flex; align-items: center; gap: 9px; margin-bottom: 12px; }
.financial-health-section-heading > span { padding: 3px 7px; color: #047857; background: #d1fae5; border-radius: 99px; font-size: .67rem; font-weight: 900; letter-spacing: .04em; }
.financial-health-section-heading h3 { margin: 0; color: #065f46; font-size: .94rem; }
.financial-health-section-heading p { margin: 0 0 0 auto; color:var(--text-muted); font-size: .72rem; }
.financial-health-input-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 11px; }
.financial-health-input-grid label { display: grid; gap: 5px; color:var(--text); font-size: .76rem; font-weight: 750; }
.financial-health-input-grid input { width: 100%; box-sizing: border-box; padding: 8px 9px; color:var(--text); background:var(--surface); border: 1px solid var(--border); border-radius: 7px; font-size: .94rem; font-weight: 800; font-variant-numeric: tabular-nums; }
.financial-health-input-grid input:focus { outline: 2px solid #6ee7b7; border-color: #059669; }
.financial-health-results { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin: 16px 0; }
.financial-health-results article { display: grid; gap: 5px; padding: 13px; background:var(--surface-soft); border: 1px solid #dbe3ee; border-radius: 10px; }
.financial-health-results span { color:var(--text-muted); font-size: .73rem; font-weight: 750; }
.financial-health-results strong { color: #047857; font-size: 1.12rem; font-variant-numeric: tabular-nums; }
.financial-health-results small { color: #94a3b8; font-size: .65rem; }
.financial-health-reading, .financial-health-examples { padding: 15px 17px; border: 1px solid #dbe3ee; border-radius: 12px; }
.financial-health-checks { display: grid; gap: 8px; }
.financial-health-checks p { margin: 0; padding: 10px 11px; color:var(--text); background:var(--surface-soft); border-radius: 7px; font-size: .79rem; line-height: 1.5; }
.financial-health-examples { margin-top: 14px; background:var(--green-bg); border-color: #bbf7d0; }
.financial-health-examples > p { margin: 0 0 10px; color:var(--text); font-size: .79rem; line-height: 1.45; }
.financial-health-example-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.financial-health-example-cards article { display: grid; gap: 4px; padding: 10px 12px; background:var(--surface); border: 1px solid #d1fae5; border-left: 3px solid #10b981; border-radius: 8px; }
.financial-health-example-cards span { color: #047857; font-size: .69rem; font-weight: 800; }
.financial-health-example-cards strong { color: #1e293b; font-size: .88rem; }
.financial-health-example-cards p { margin: 0; color:var(--text-muted); font-size: .72rem; line-height: 1.4; }
.financial-health-note { display: flex; align-items: center; gap: 8px; margin-top: 14px; padding: 10px 12px; color:var(--text-muted); background:var(--surface-soft); border-radius: 9px; font-size: .74rem; line-height: 1.45; }
.financial-health-note > i { color: #059669; }
.financial-health-note button { flex: 0 0 auto; margin-left: auto; padding: 6px 8px; color: #047857; background:var(--surface); border: 1px solid #a7f3d0; border-radius: 6px; font-size: .69rem; font-weight: 800; }
.financial-health-note button:hover { color: #fff; background: #059669; }
.dcf-simulator-button { display: inline-flex; align-items: center; gap: 7px; margin: 4px 0; padding: 10px 14px; color: #92400e; background:var(--primary-light); border: 1px solid #fde68a; border-radius: 9px; font-size: .82rem; font-weight: 800; box-shadow: 0 2px 5px rgba(217,119,6,.08); }
.dcf-simulator-button:hover { color: #fff; background: #d97706; border-color: #d97706; }
.dcf-modal-backdrop { position: fixed; z-index: 1200; inset: 0; display: none; align-items: center; justify-content: center; padding: 1vh 1vw; background: rgba(15,23,42,.58); backdrop-filter: blur(2px); }
.dcf-modal-backdrop.show { display: flex; }
.dcf-modal { width: min(1200px, 100%); max-height: 98vh; overflow: auto; background:var(--surface); border: 1px solid var(--border); border-radius: 18px; box-shadow: 0 24px 70px rgba(15,23,42,.32); }
.dcf-modal-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; padding: 22px 28px 19px; border-bottom: 1px solid #e2e8f0; }
.dcf-modal-header > div { display: flex; align-items: center; gap: 14px; }
.dcf-modal-icon { display: inline-flex; align-items: center; justify-content: center; width: 46px; height: 46px; color: #fff; background: linear-gradient(135deg, #d97706, #ea580c); border-radius: 13px; font-size: 1.2rem; }
.dcf-modal h2 { margin: 0; color:var(--text); font-size: 1.45rem; }
.dcf-modal-header p { margin: 4px 0 0; color:var(--text-muted); font-size: .88rem; }
.dcf-modal-close { width: 40px; height: 40px; flex: 0 0 auto; color:var(--text-muted); border-radius: 10px; font-size: 1.2rem; }
.dcf-modal-close:hover { color:var(--text); background:var(--surface-soft); }
.dcf-simulator { padding: 20px 28px 24px; }
.dcf-inputs { padding: 15px 17px 17px; background:var(--primary-light); border: 1px solid #fde68a; border-radius: 12px; }
.dcf-section-heading { display: flex; align-items: center; gap: 9px; margin-bottom: 12px; }
.dcf-section-heading > span { padding: 3px 7px; color: #92400e; background:var(--primary-light); border-radius: 99px; font-size: .67rem; font-weight: 900; letter-spacing: .04em; }
.dcf-section-heading h3 { margin: 0; color:var(--text-muted); font-size: .94rem; }
.dcf-section-heading p { margin: 0 0 0 auto; color:var(--text-muted); font-size: .72rem; }
.dcf-input-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 11px; }
.dcf-input-grid label { display: grid; gap: 5px; color:var(--text); font-size: .76rem; font-weight: 750; }
.dcf-input-grid input { width: 100%; box-sizing: border-box; padding: 8px 9px; color:var(--text); background:var(--surface); border: 1px solid var(--border); border-radius: 7px; font-size: .94rem; font-weight: 800; font-variant-numeric: tabular-nums; }
.dcf-input-grid input:focus { outline: 2px solid #fcd34d; border-color: #d97706; }
.dcf-input-grid small { color: #94a3b8; font-size: .64rem; font-weight: 500; }
.dcf-results { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin: 16px 0; }
.dcf-results > div { display: grid; gap: 5px; padding: 14px; background:var(--surface-soft); border: 1px solid #dbe3ee; border-radius: 10px; }
.dcf-results span { color:var(--text-muted); font-size: .76rem; font-weight: 750; }
.dcf-results strong { color:var(--text); font-size: 1.25rem; font-variant-numeric: tabular-nums; }
.dcf-results small { color: #94a3b8; font-size: .67rem; }
.dcf-results .highlight { background:rgba(240,185,11,.12); border-color: #fdba74; }
.dcf-results .highlight strong { color: #c2410c; }
.dcf-forecast, .dcf-formula { padding: 15px 17px; border: 1px solid #dbe3ee; border-radius: 12px; }
.dcf-forecast-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; }
.dcf-forecast-grid > div { display: grid; gap: 4px; padding: 10px; background:var(--surface-soft); border-radius: 7px; }
.dcf-forecast-grid span { color:var(--text-muted); font-size: .7rem; font-weight: 750; }
.dcf-forecast-grid b { color:var(--text); font-size: .76rem; }
.dcf-forecast-grid strong { color: #b45309; font-size: .76rem; }
.dcf-formula { margin-top: 14px; background:var(--primary-light); border-color: #fde68a; }
.dcf-formula p { margin: 0; color:var(--text-muted); font-size: .84rem; font-weight: 750; line-height: 1.55; font-variant-numeric: tabular-nums; }
.dcf-formula small { display: block; margin-top: 6px; color: #a16207; font-size: .68rem; }
.dcf-note { display: flex; align-items: center; gap: 8px; margin-top: 14px; padding: 10px 12px; color:var(--text-muted); background:var(--surface-soft); border-radius: 9px; font-size: .74rem; line-height: 1.45; }
.dcf-note > i { color: #d97706; }
.dcf-note button { flex: 0 0 auto; margin-left: auto; padding: 6px 8px; color: #92400e; background:var(--surface); border: 1px solid #fde68a; border-radius: 6px; font-size: .69rem; font-weight: 800; }
.dcf-note button:hover { color: #fff; background: #d97706; }
@media (max-width: 850px) { .financial-statement-input-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } .financial-statement-results { grid-template-columns: 1fr; } .financial-statement-connections, .financial-statement-input-connections { display: none; } }
@media (max-width: 900px) { .roe-eps-input-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 820px) { .valuation-input-grid, .valuation-results { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) {
  .mermaid-modal-chart { padding: 18px; align-items: flex-start; }
  .mermaid-modal-chart svg { width: 1200px; }
  .macro-news-modal-backdrop { padding: 10px; }
  .macro-news-controls { grid-template-columns: 1fr; }
  .macro-news-modal-header { padding: 15px; }
  .macro-news-canvas-wrap { padding-inline: 12px; }
  .macro-news-insight, .macro-news-disclaimer { margin-inline: 12px; }
  .chart-drawing-offcanvas-header { padding: 15px; }
  .chart-drawing-offcanvas-header > div { gap: 10px; }
  .chart-drawing-offcanvas-icon { width: 40px; height: 40px; }
  .chart-drawing-toolbar { align-items: flex-start; flex-direction: column; padding: 12px 15px; }
  .chart-drawing-split { grid-template-columns: 1fr; padding: 12px; }
  .chart-drawing-panel > header { align-items: flex-start; flex-direction: column; gap: 4px; }
  .chart-drawing-note { margin: 0 12px 16px; }
  .rsi-macd-modal-backdrop { padding: 10px; }
  .rsi-macd-modal-header { padding: 17px 16px; }
  .rsi-macd-modal-header > div { gap: 10px; }
  .rsi-macd-modal-icon { width: 40px; height: 40px; }
  .rsi-macd-modal h2 { font-size: 1.15rem; }
  .rsi-macd-simulator { padding: 14px; }
  .rsi-macd-input-grid, .rsi-macd-results { grid-template-columns: 1fr; }
  .rsi-macd-reading li { grid-template-columns: 1fr; gap: 3px; }
  .rsi-macd-note { align-items: flex-start; flex-wrap: wrap; }
  .rsi-macd-note button { margin-left: 0; }
  .atr-modal-backdrop { padding: 10px; }
  .atr-modal-header { padding: 17px 16px; }
  .atr-modal-header > div { gap: 10px; }
  .atr-modal-icon { width: 40px; height: 40px; }
  .atr-modal h2 { font-size: 1.15rem; }
  .atr-simulator { padding: 14px; }
  .atr-input-grid, .atr-results { grid-template-columns: 1fr; }
  .atr-reading li { grid-template-columns: 1fr; gap: 3px; }
  .atr-note { align-items: flex-start; flex-wrap: wrap; }
  .atr-note button { margin-left: 0; }
  .opening-session-modal-backdrop { padding: 10px; }
  .opening-session-modal-header { padding: 17px 16px; }
  .opening-session-modal-header > div { gap: 10px; }
  .opening-session-modal-icon { width: 40px; height: 40px; }
  .opening-session-modal h2 { font-size: 1.15rem; }
  .opening-session-tabs { padding: 12px 14px 0; }
  .opening-session-body { padding: 12px 14px 18px; }
  .opening-session-summary { grid-template-columns: 1fr; }
  .financial-statement-modal-backdrop { padding: 10px; }
  .financial-statement-modal-header { padding: 15px; }
  .financial-statement-modal-header > div { gap: 10px; }
  .financial-statement-modal-icon { width: 40px; height: 40px; }
  .financial-statement-simulator { padding: 12px; }
  .financial-statement-input-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .financial-statement-modal-note { align-items: flex-start; flex-direction: column; }
  .valuation-modal-backdrop { padding: 10px; }
  .valuation-modal-header { padding: 17px 16px; }
  .valuation-modal-header > div { gap: 10px; }
  .valuation-modal-icon { width: 40px; height: 40px; }
  .valuation-modal h2 { font-size: 1.15rem; }
  .valuation-simulator { padding: 14px; }
  .valuation-input-grid, .valuation-results { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .psr-results, .psr-meaning-grid { grid-template-columns: 1fr; }
  .valuation-per-meaning-grid { grid-template-columns: 1fr; }
  .valuation-example-cards { grid-template-columns: 1fr; }
  .valuation-formulas li { grid-template-columns: 1fr; gap: 3px; }
  .valuation-note { align-items: flex-start; flex-wrap: wrap; }
  .valuation-note button { margin-left: 0; }
  .roe-eps-modal-backdrop { padding: 10px; }
  .roe-eps-modal-header { padding: 17px 16px; }
  .roe-eps-modal-header > div { gap: 10px; }
  .roe-eps-modal-icon { width: 40px; height: 40px; }
  .roe-eps-modal h2 { font-size: 1.15rem; }
  .roe-eps-simulator { padding: 14px; }
  .roe-eps-input-grid, .roe-eps-results { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .roe-eps-formulas li { grid-template-columns: 1fr; gap: 3px; }
  .roe-eps-note { align-items: flex-start; flex-wrap: wrap; }
  .roe-eps-note button { margin-left: 0; }
  .financial-health-modal-backdrop { padding: 10px; }
  .financial-health-modal-header { padding: 17px 16px; }
  .financial-health-modal-header > div { gap: 10px; }
  .financial-health-modal-icon { width: 40px; height: 40px; }
  .financial-health-modal h2 { font-size: 1.15rem; }
  .financial-health-simulator { padding: 14px; }
  .financial-health-input-grid, .financial-health-results { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .financial-health-example-cards { grid-template-columns: 1fr; }
  .financial-health-note { align-items: flex-start; flex-wrap: wrap; }
  .financial-health-note button { margin-left: 0; }
  .dcf-modal-backdrop { padding: 10px; }
  .dcf-modal-header { padding: 17px 16px; }
  .dcf-modal-header > div { gap: 10px; }
  .dcf-modal-icon { width: 40px; height: 40px; }
  .dcf-modal h2 { font-size: 1.15rem; }
  .dcf-simulator { padding: 14px; }
  .dcf-input-grid, .dcf-results { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dcf-forecast-grid { grid-template-columns: 1fr; }
  .dcf-note { align-items: flex-start; flex-wrap: wrap; }
  .dcf-note button { margin-left: 0; }
  .vocabulary-modal-backdrop { padding: 12px; }
  .vocabulary-modal-header { padding: 18px 16px 16px; }
  .vocabulary-modal-content { padding: 16px; }
  .integrated-content-modal-backdrop { padding: 12px; }
  .integrated-content-modal-header { padding: 18px 16px 16px; }
  .integrated-content-modal-body { padding: 18px 16px 22px; }
}
.md-body blockquote { border-left: 4px solid var(--primary); margin: 14px 0; padding: 10px 16px; background: var(--primary-light); border-radius: 0 var(--radius-sm) var(--radius-sm) 0; color: #444444; }
.md-body strong { font-weight: 700; color: var(--text); }
.md-body a { color: var(--primary); text-decoration: underline; }
.md-body hr { border: none; border-top: 1px solid var(--border); margin: 24px 0; }
.md-body img { display: block; max-width: 100%; height: auto; margin: 16px auto; border-radius: var(--radius-sm); }

/* ── Home market dashboard ── */
.home-dashboard { min-width: 0; }
.home-market-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.home-market-card { min-width: 0; background:var(--surface); border: 1px solid var(--border); border-radius: 12px; padding: 16px 18px 12px; box-shadow: 0 2px 10px rgba(15,23,42,.05); }
.home-market-card-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 8px; }
.home-market-name { font-size: .8rem; font-weight: 800; color:var(--text); letter-spacing: .03em; }
.home-market-name span { color: #94a3b8; font-weight: 600; }
.home-market-price-row { display: flex; align-items: baseline; gap: 8px; margin-top: 4px; }
.home-market-price-row strong { font-size: 1.35rem; line-height: 1; color:var(--text); letter-spacing: -.03em; }
.home-market-price-row em { font-style: normal; font-size: .72rem; font-weight: 750; padding: 3px 7px; border-radius: 999px; background:var(--surface-soft); color:var(--text-muted); }
.home-market-price-row em.is-up { background:var(--up-bg); color: var(--up); }
.home-market-price-row em.is-down { background:var(--down-bg); color: var(--down); }
.home-market-controls { display: flex; align-items: center; gap: 6px; }
.home-market-periods { display: inline-flex; overflow: hidden; border: 1px solid var(--border); border-radius: 6px; }
.home-market-periods button { padding: 3px 7px; color:var(--text-muted); font-size: .68rem; font-weight: 750; border-right: 1px solid #e2e8f0; }
.home-market-periods button:last-child { border-right: 0; }
.home-market-periods button.active { color: #fff; background: #0078d4; }
.home-market-expand { display: flex; align-items: center; justify-content: center; width: 24px; height: 24px; border: 1px solid var(--border); border-radius: 6px; color:var(--text-muted); font-size: .7rem; flex: 0 0 auto; }
.home-market-expand:hover, .home-market-expand:focus-visible { color:var(--primary); border-color:var(--primary); background:rgba(56,189,248,.1); }
.home-market-chart-wrap { position: relative; min-height: 250px; }
.home-market-chart { width: 100%; }
.home-market-loading { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; gap: 7px; color: #94a3b8; font-size: .78rem; background: rgba(255,255,255,.85); }
.home-chart-ma20-badge { position: absolute; top: 6px; left: 6px; display: inline-flex; align-items: center; gap: 5px; background: rgba(255,255,255,.92); border: 1px solid var(--border); border-radius: 6px; padding: 3px 9px; font-size: .68rem; font-weight: 750; color:var(--text); pointer-events: none; box-shadow: 0 1px 3px rgba(15,23,42,.06); }
.home-chart-ma20-badge .dot { width: 8px; height: 8px; border-radius: 50%; background: #0078d4; flex: 0 0 auto; }
.home-chart-modal-body .home-chart-ma20-badge { top: 10px; left: 10px; font-size: .74rem; padding: 4px 10px; }
.home-market-macd-wrap { margin-top: 6px; padding-top: 8px; border-top: 1px dashed #eef2f7; }
.home-market-macd-label { font-size: .67rem; font-weight: 750; color: #94a3b8; letter-spacing: .02em; margin-bottom: 2px; }
.home-market-macd { width: 100%; min-height: 110px; }
.home-market-error { color: var(--red); }
.home-market-foot { display: flex; justify-content: space-between; gap: 8px; margin-top: 4px; color: #94a3b8; font-size: .67rem; }
.home-market-foot .is-simulated { color: #a16207; }

.home-chart-modal-backdrop { position: fixed; z-index: 1300; inset: 0; display: grid; place-items: stretch; padding: 0; background: rgba(15,23,42,.58); backdrop-filter: blur(3px); }
.home-chart-modal-backdrop[hidden] { display: none; }
.home-chart-modal { width: 100%; height: 100%; max-height: 100vh; overflow: hidden; border: none; border-radius: 0; background:var(--surface); box-shadow: none; outline: none; display: flex; flex-direction: column; }
.home-chart-modal-header { flex: 0 0 auto; display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding: 16px 32px; border-bottom: 1px solid #e2e8f0; }
.home-chart-modal-header .home-market-name { font-size: 1.05rem; }
.home-chart-modal-header .home-market-price-row strong { font-size: 1.7rem; }
.home-chart-search { position: relative; display: flex; align-items: center; gap: 5px; }
.home-chart-instrument-label { color:var(--text-muted); font-size: .72rem; font-weight: 750; }
.home-chart-instrument-select { max-width: 210px; height: 30px; padding: 0 28px 0 9px; color:var(--text); border: 1px solid var(--border); border-radius: 6px; background:var(--surface); font-size: .73rem; font-weight: 700; }
.home-chart-instrument-select:focus-visible { outline: 2px solid #93c5fd; outline-offset: 1px; border-color:var(--primary); }
.home-chart-search-results { position: absolute; z-index: 2; top: calc(100% + 6px); right: 0; width: min(360px, 82vw); max-height: 270px; overflow-y: auto; padding: 5px; border: 1px solid var(--border); border-radius: 8px; background:var(--surface); box-shadow: 0 12px 28px rgba(15,23,42,.16); }
.home-chart-search-result { display: block; width: 100%; padding: 9px 10px; color:var(--text); border-radius: 5px; font-size: .75rem; font-weight: 700; text-align: left; }
.home-chart-search-result:hover, .home-chart-search-result:focus-visible { color: #075985; background:rgba(56,189,248,.1); }
.home-chart-intervals button { min-width: 34px; padding-inline: 8px; }
.home-chart-modal-close { display: grid; flex: 0 0 auto; place-items: center; width: 38px; height: 38px; border-radius: 9px; color:var(--text-muted); font-size: 1.1rem; }
.home-chart-modal-close:hover, .home-chart-modal-close:focus-visible { color:var(--text); background:var(--surface-soft); }
.home-chart-modal-body { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; padding: 14px 32px 16px; max-width: 1600px; width: 100%; margin: 0 auto; overflow-y: auto; }
.home-chart-modal-body .home-market-chart-wrap { flex: 3 1 0; min-height: 260px; }
.home-chart-modal-body .home-market-chart { height: 100%; }
.home-chart-modal-body .home-market-macd-wrap { flex: 1 1 0; min-height: 0; display: flex; flex-direction: column; margin-top: 4px; padding-top: 6px; }
.home-chart-modal-body .home-market-macd-label { flex: 0 0 auto; }
.home-chart-modal-macd, .home-chart-modal-rsi { flex: 1 1 auto; min-height: 0; width: 100%; }
.home-chart-trend { flex: 0 0 auto; margin-top: 8px; padding: 10px 12px; border: 1px solid #dbeafe; border-radius: 9px; background:rgba(56,189,248,.08); }
.home-chart-trend h3 { margin: 0 0 7px; color:var(--primary); font-size: .76rem; }.home-chart-trend h3 i { margin-right: 4px; }.home-chart-trend h3 small { margin-left: 5px; color:var(--text-muted); font-size: .65rem; font-weight: 600; }
.home-chart-trend p { margin: 8px 0 0; color:var(--text); font-size: .72rem; line-height: 1.55; }.home-chart-trend p strong { color:var(--primary); }
.home-chart-trend-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 7px; }.home-chart-trend-kpis span { padding: 6px 8px; border-radius: 6px; background:var(--surface); }.home-chart-trend-kpis b, .home-chart-trend-kpis small { display: block; }.home-chart-trend-kpis b { color:var(--text); font-size: .73rem; }.home-chart-trend-kpis small { margin-top: 2px; color:var(--text-muted); font-size: .62rem; line-height: 1.25; }
.home-chart-learning { flex: 0 0 auto; margin-top: 9px; padding: 12px; border: 1px solid var(--border); border-radius: 10px; background:var(--surface); }.home-chart-learning > header { display: flex; align-items: center; justify-content: space-between; gap: 10px; }.home-chart-learning h3 { margin: 0; color:var(--text); font-size: .8rem; }.home-chart-learning h3 i { color:var(--primary); margin-right: 5px; }.home-chart-learning > header span { color: #94a3b8; font-size: .65rem; font-weight: 700; }
.home-chart-learning-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-top: 10px; }.trend-lesson { padding: 9px; border: 1px solid var(--border); border-radius: 8px; background:var(--surface-soft); }.trend-lesson h4 { margin: 7px 0 4px; color:var(--text); font-size: .73rem; }.trend-lesson h4 i { margin-right: 4px; }.trend-lesson.is-up h4 i { color: var(--up); }.trend-lesson.is-down h4 i { color: var(--down); }.trend-lesson.is-ma h4 i { color:var(--primary); }.trend-lesson p, .trend-lesson small { display: block; margin: 0; color:var(--text-muted); font-size: .65rem; line-height: 1.45; }.trend-lesson small { margin-top: 6px; color:var(--text); }.trend-lesson small b { color:var(--primary); }
.trend-illustration { position: relative; height: 48px; overflow: hidden; border-bottom: 1px solid #cbd5e1; background: repeating-linear-gradient(0deg, transparent 0 15px, #e2e8f0 16px); }.trend-illustration i { position: absolute; bottom: 3px; width: 4px; border-radius: 2px; background: #94a3b8; }.trend-illustration i:nth-child(1) { left: 17%; height: 14px; }.trend-illustration i:nth-child(2) { left: 48%; height: 25px; }.trend-illustration i:nth-child(3) { left: 79%; height: 34px; }.trend-illustration b { position: absolute; left: 7%; width: 88%; height: 2px; border-radius: 99px; transform-origin: left center; }.trend-illustration .price-line { bottom: 13px; background: var(--up); transform: rotate(-19deg); }.trend-illustration .ma-line { bottom: 9px; background: #f59e0b; transform: rotate(-13deg); }.trend-lesson.is-down .trend-illustration i:nth-child(1) { height: 34px; }.trend-lesson.is-down .trend-illustration i:nth-child(3) { height: 14px; }.trend-lesson.is-down .price-line { bottom: 37px; background: var(--down); transform: rotate(19deg); }.trend-lesson.is-down .ma-line { bottom: 33px; background: #f59e0b; transform: rotate(13deg); }.trend-lesson.is-ma .price-line { bottom: 25px; background: var(--up); transform: rotate(0deg); clip-path: polygon(0 40%,12% 70%,24% 10%,37% 65%,50% 30%,63% 75%,76% 15%,88% 60%,100% 22%,100% 52%,88% 90%,76% 45%,63% 100%,50% 55%,37% 92%,24% 42%,12% 100%,0 70%); }.trend-lesson.is-ma .ma-line { bottom: 20px; background: #f59e0b; transform: rotate(-4deg); }.home-chart-learning-note { margin: 10px 1px 0; color:var(--text); font-size: .68rem; line-height: 1.5; }.home-chart-learning-note i { color: #f59e0b; margin-right: 4px; }
.home-chart-modal-body .home-market-foot { flex: 0 0 auto; margin-top: 4px; }

/* ── 대시보드 터미널 다크 오버라이드 ──────────────────────────────────────
   위 라이트 규칙은 그대로 두고, body.theme-terminal(홈 화면 진입 시 app.js가
   토글)일 때만 같은 선택자에 다크 값을 덮어씌운다. 상승/하락 색상은 기존
   한국식(빨강=상승/파랑=하락) 대신, 사용자가 고른 Bloomberg/터미널풍에 맞춰
   초록=상승/빨강=하락(서구·크립토 트레이딩 터미널 관행)으로 통일했다. */
body.theme-terminal .home-market-card { background: var(--surface); border-color: var(--border); box-shadow: 0 2px 10px rgba(0,0,0,.35); }
body.theme-terminal .home-market-name { color: var(--text); }
body.theme-terminal .home-market-name span { color: var(--text-subtle); }
body.theme-terminal .home-market-price-row strong { color: var(--text); font-family: var(--term-mono); font-variant-numeric: tabular-nums; }
body.theme-terminal .home-market-price-row em { background: var(--surface-soft); color: var(--text-muted); }
body.theme-terminal .home-market-price-row em.is-up { background: var(--up-bg); color: var(--up); }
body.theme-terminal .home-market-price-row em.is-down { background: var(--down-bg); color: var(--down); }
body.theme-terminal .home-market-periods { border-color: var(--border); }
body.theme-terminal .home-market-periods button { color: var(--text-muted); border-right-color: var(--border); }
body.theme-terminal .home-market-periods button.active { color: #151a10; background: var(--primary); }
body.theme-terminal .home-market-expand { border-color: var(--border); color: var(--text-muted); }
body.theme-terminal .home-market-expand:hover, body.theme-terminal .home-market-expand:focus-visible { color: var(--primary); border-color: var(--primary); background: var(--primary-light); }
body.theme-terminal .home-market-loading { color: var(--text-subtle); background: rgba(10,14,23,.85); }
body.theme-terminal .home-chart-ma20-badge { background: rgba(23,28,40,.92); border-color: var(--border); color: var(--text); }
body.theme-terminal .home-chart-ma20-badge .dot { background: var(--primary); }
body.theme-terminal .home-market-macd-wrap { border-top-color: var(--border); }
body.theme-terminal .home-market-macd-label { color: var(--text-subtle); }
body.theme-terminal .home-market-foot { color: var(--text-subtle); }
body.theme-terminal .home-market-foot .is-simulated { color: #fbbf24; }

body.theme-terminal .home-chart-modal { background: var(--term-bg); }
body.theme-terminal .home-chart-modal-header { border-bottom-color: var(--border); }
body.theme-terminal .home-chart-instrument-label { color: var(--text-muted); }
body.theme-terminal .home-chart-instrument-select { color: var(--text); border-color: var(--border); background: var(--surface); }
body.theme-terminal .home-chart-instrument-select:focus-visible { outline-color: var(--term-accent-bg); border-color: var(--primary); }
body.theme-terminal .home-chart-search-results { border-color: var(--border); background: var(--surface); box-shadow: 0 16px 36px rgba(0,0,0,.5); }
body.theme-terminal .home-chart-search-result { color: var(--text); }
body.theme-terminal .home-chart-search-result:hover, body.theme-terminal .home-chart-search-result:focus-visible { color: var(--primary); background: var(--surface-hover); }
body.theme-terminal .home-chart-modal-close { color: var(--text-muted); }
body.theme-terminal .home-chart-modal-close:hover, body.theme-terminal .home-chart-modal-close:focus-visible { color: var(--text); background: var(--surface-soft); }
body.theme-terminal .home-chart-trend { border-color: var(--border); background: var(--surface); }
body.theme-terminal .home-chart-trend h3 { color: var(--text); }
body.theme-terminal .home-chart-trend h3 small { color: var(--text-subtle); }
body.theme-terminal .home-chart-trend p { color: var(--text-muted); }
body.theme-terminal .home-chart-trend p strong { color: var(--primary); }
body.theme-terminal .home-chart-trend-kpis span { background: var(--surface-soft); }
body.theme-terminal .home-chart-trend-kpis b { color: var(--text); }
body.theme-terminal .home-chart-trend-kpis small { color: var(--text-subtle); }
body.theme-terminal .home-chart-learning { border-color: var(--border); background: var(--surface); }
body.theme-terminal .home-chart-learning h3 { color: var(--text); }
body.theme-terminal .home-chart-learning h3 i { color: var(--primary); }
body.theme-terminal .home-chart-learning > header span { color: var(--text-subtle); }
body.theme-terminal .trend-lesson { border-color: var(--border); background: var(--surface-soft); }
body.theme-terminal .trend-lesson h4 { color: var(--text); }
body.theme-terminal .trend-lesson.is-up h4 i { color: var(--up); }
body.theme-terminal .trend-lesson.is-down h4 i { color: var(--down); }
body.theme-terminal .trend-lesson.is-ma h4 i { color: var(--primary); }
body.theme-terminal .trend-lesson p, body.theme-terminal .trend-lesson small { color: var(--text-muted); }
body.theme-terminal .trend-lesson small b { color: var(--primary); }
body.theme-terminal .trend-illustration { border-bottom-color: var(--border); background: repeating-linear-gradient(0deg, transparent 0 15px, var(--border) 16px); }
body.theme-terminal .trend-illustration i { background: var(--text-dim,var(--text-subtle)); }
body.theme-terminal .trend-illustration .price-line { background: var(--green); }
body.theme-terminal .trend-illustration .ma-line { background: var(--primary); }
body.theme-terminal .trend-lesson.is-down .price-line { background: var(--down); }
body.theme-terminal .trend-lesson.is-down .ma-line { background: var(--primary); }
body.theme-terminal .trend-lesson.is-ma .price-line { background: var(--up); }
body.theme-terminal .trend-lesson.is-ma .ma-line { background: var(--primary); }
body.theme-terminal .home-chart-learning-note { color: var(--text-muted); }
body.theme-terminal .home-chart-learning-note i { color: var(--primary); }
@media (max-width: 760px) {
  .home-chart-modal-header { padding: 12px 16px; flex-wrap: wrap; }
  .home-chart-modal-header .home-market-controls { width: 100%; flex-wrap: wrap; }
  .home-chart-search { flex: 1 1 100%; }
  .home-chart-instrument-select { flex: 1 1 170px; max-width: none; }
  .home-chart-modal-body { padding: 10px 16px 12px; overflow-y: auto; }
  .home-chart-modal-body .home-market-chart-wrap { flex: none; min-height: 320px; }
  .home-chart-modal-macd, .home-chart-modal-rsi { flex: none; min-height: 140px; }
  .home-chart-trend-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .home-chart-learning-grid { grid-template-columns: 1fr; }
}
.home-quote-dashboard { margin-top: 18px; padding: 18px; background:var(--surface); border: 1px solid var(--border); border-radius: 12px; box-shadow: 0 2px 10px rgba(15,23,42,.05); }
.home-quote-dashboard-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; margin-bottom: 14px; }
.home-quote-dashboard-head h1 { margin: 0; color:var(--text); font-size: 1rem; font-weight: 800; }
.home-quote-dashboard-head p { margin: 4px 0 0; color:var(--text-muted); font-size: .76rem; }
.home-quote-actions { display: flex; align-items: center; gap: 9px; color: #94a3b8; font-size: .7rem; white-space: nowrap; }
.home-quote-actions button { padding: 6px 9px; color: #0369a1; border: 1px solid #bae6fd; border-radius: 7px; background:rgba(56,189,248,.1); font-size: .72rem; font-weight: 750; }
.home-quote-actions button:hover { background:rgba(56,189,248,.12); }
.home-quote-actions button:disabled { opacity: .65; cursor: wait; }
.home-quote-actions button.is-loading i { animation: spin 1s linear infinite; }
.home-quote-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.home-quote-panel { overflow: hidden; border: 1px solid var(--border); border-radius: 10px; }
.home-quote-panel-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 8px; padding: 11px 13px; background:var(--surface-soft); border-bottom: 1px solid #e2e8f0; }
.home-quote-panel-head h2 { margin: 0; color: #1e293b; font-size: .85rem; font-weight: 800; }
.home-quote-panel-head p { margin: 3px 0 0; color: #94a3b8; font-size: .68rem; }
.home-quote-count { padding: 3px 6px; color:var(--text); border-radius: 999px; background:var(--border); font-size: .64rem; font-weight: 750; }
.home-quote-list { display: grid; }
.home-quote-row { display: flex; width:100%; justify-content: space-between; align-items: center; gap: 10px; min-height: 47px; padding: 8px 13px; color:inherit; background:var(--surface); border:0; border-bottom: 1px solid #f1f5f9; text-align:left; font:inherit; cursor:pointer; }
.home-quote-row:last-child { border-bottom: 0; }.home-quote-row:hover { background:rgba(56,189,248,.08); }.home-quote-row:focus-visible { position:relative; z-index:1; outline:2px solid #93c5fd; outline-offset:-2px; }
.home-quote-row.is-loading { opacity: .6; }
.home-quote-row.is-error { background:var(--primary-light); }
.home-quote-name { display: flex; flex-direction: column; min-width: 0; }
.home-quote-name strong { color:var(--text); font-size: .76rem; font-weight: 750; }.home-quote-name strong i { margin-left:3px; color:var(--primary); font-size:.65rem; }
.home-quote-name span { margin-top: 2px; color: #94a3b8; font-size: .65rem; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; }
.home-quote-value { display: flex; flex-direction: column; align-items: flex-end; white-space: nowrap; }
.home-quote-value b { color:var(--text); font-size: .79rem; font-variant-numeric: tabular-nums; }
.home-quote-value em { margin-top: 2px; color:var(--text-muted); font-size: .66rem; font-style: normal; font-weight: 750; font-variant-numeric: tabular-nums; }
.home-quote-value em.is-up { color: var(--up); }
.home-quote-value em.is-down { color: var(--down); }
.home-quote-note { margin: 11px 0 0; color: #94a3b8; font-size: .67rem; }

body.theme-terminal .home-quote-dashboard { background: var(--surface); border-color: var(--border); box-shadow: 0 2px 10px rgba(0,0,0,.35); }
body.theme-terminal .home-quote-dashboard-head h1 { color: var(--text); }
body.theme-terminal .home-quote-dashboard-head p { color: var(--text-muted); }
body.theme-terminal .home-quote-actions { color: var(--text-subtle); }
body.theme-terminal .home-quote-actions button { color: var(--primary); border-color: var(--term-accent-dim); background: var(--primary-light); }
body.theme-terminal .home-quote-actions button:hover { background: var(--surface-hover); }
body.theme-terminal .home-quote-panel { border-color: var(--border); }
body.theme-terminal .home-quote-panel-head { background: var(--surface-soft); border-bottom-color: var(--border); }
body.theme-terminal .home-quote-panel-head h2 { color: var(--text); }
body.theme-terminal .home-quote-panel-head p { color: var(--text-subtle); }
body.theme-terminal .home-quote-count { color: var(--text-muted); background: var(--surface-hover); }
body.theme-terminal .home-quote-row { background: var(--surface); border-bottom-color: var(--border); }
body.theme-terminal .home-quote-row:hover { background: var(--surface-hover); }
body.theme-terminal .home-quote-row.is-error { background: rgba(255,59,92,.08); }
body.theme-terminal .home-quote-name strong { color: var(--text); }
body.theme-terminal .home-quote-name strong i { color: var(--primary); }
body.theme-terminal .home-quote-name span { color: var(--text-subtle); }
body.theme-terminal .home-quote-value b { color: var(--text); font-family: var(--term-mono); }
body.theme-terminal .home-quote-value em { color: var(--text-muted); }
body.theme-terminal .home-quote-value em.is-up { color: var(--up); }
body.theme-terminal .home-quote-value em.is-down { color: var(--down); }
body.theme-terminal .home-quote-note { color: var(--text-subtle); }
.server-resource-page { width: 100%; max-width: none; }
.server-resource-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 20px; }
.server-resource-head h1 { margin: 0; color:var(--text); font-size: 1.25rem; font-weight: 800; }
.server-resource-head h1 i { margin-right: 7px; color:var(--primary); }
.server-resource-head p { margin: 6px 0 0; color:var(--text-muted); font-size: .84rem; }
.server-resource-actions { display: flex; align-items: center; gap: 10px; color: #94a3b8; font-size: .72rem; white-space: nowrap; }
.server-resource-actions button { padding: 7px 10px; color: #0369a1; background:rgba(56,189,248,.1); border: 1px solid #bae6fd; border-radius: 7px; font-size: .75rem; font-weight: 750; }
.server-resource-actions button:hover { background:rgba(56,189,248,.12); }
.server-resource-actions button:disabled { opacity: .65; cursor: wait; }
.server-resource-actions button.is-loading i { animation: spin 1s linear infinite; }
.server-resource-history { margin-bottom: 16px; padding: 16px 18px 10px; background:var(--surface); border: 1px solid var(--border); border-radius: 12px; box-shadow: 0 2px 10px rgba(15,23,42,.05); }
.server-resource-history-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.server-resource-history h2 { margin: 0; color: #1e293b; font-size: .92rem; font-weight: 800; }
.server-resource-history h2 i { margin-right: 6px; color:var(--primary); }
.server-resource-history p { margin: 4px 0 0; color: #94a3b8; font-size: .7rem; }
.server-resource-live { display: inline-flex; align-items: center; gap: 5px; padding: 4px 7px; color: #15803d; background:var(--green-bg); border-radius: 999px; font-size: .65rem; font-weight: 800; letter-spacing: .05em; }
.server-resource-live i { width: 6px; height: 6px; background: #22c55e; border-radius: 50%; box-shadow: 0 0 0 3px rgba(34,197,94,.14); }
.server-resource-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.server-resource-card { min-width: 0; padding: 17px; background:var(--surface); border: 1px solid var(--border); border-radius: 12px; box-shadow: 0 2px 10px rgba(15,23,42,.05); }
.server-resource-card > header { display: flex; align-items: center; gap: 10px; }
.server-resource-icon { display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; color: var(--resource-color); background: color-mix(in srgb, var(--resource-color) 12%, white); border-radius: 9px; }
.server-resource-card h2 { margin: 0; color: #1e293b; font-size: .88rem; font-weight: 800; }
.server-resource-card header p { margin: 3px 0 0; color: #94a3b8; font-size: .68rem; }
.server-resource-chart { min-height: 255px; }
.server-resource-detail { margin: 0; padding-top: 10px; color:var(--text-muted); border-top: 1px solid #f1f5f9; text-align: center; font-size: .72rem; font-variant-numeric: tabular-nums; }
.server-resource-note { margin: 14px 0 0; padding: 10px 12px; color:var(--text-muted); background:var(--surface-soft); border: 1px solid var(--border); border-radius: 8px; font-size: .72rem; line-height: 1.55; }
.volume-cloud-page { width: 100%; max-width: none; }
.volume-cloud-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; margin-bottom: 18px; }
.volume-cloud-head h1 { margin: 0; color:var(--text); font-size: 1.25rem; font-weight: 800; }
.volume-cloud-head h1 i { margin-right: 7px; color: #0ea5e9; }
.volume-cloud-head p { margin: 6px 0 0; color:var(--text-muted); font-size: .84rem; }
.volume-cloud-actions { display: flex; align-items: center; gap: 10px; color: #94a3b8; font-size: .72rem; white-space: nowrap; }
.volume-cloud-actions button { padding: 7px 10px; color: #cbd5e1; background: #172033; border: 1px solid #334155; border-radius: 7px; font-size: .75rem; font-weight: 750; }
.volume-cloud-actions button:hover { color: #fff; background: #26344c; }
.volume-cloud-actions button:disabled { opacity: .65; cursor: wait; }
.volume-cloud-actions button.is-loading i { animation: spin 1s linear infinite; }
.volume-cloud-tabs { display: inline-flex; gap: 4px; padding: 4px; margin-bottom: 10px; background: var(--surface-soft); border-radius: 8px; }
.volume-cloud-tabs button { padding: 7px 11px; color:var(--text-muted); border-radius: 6px; font-size: .75rem; font-weight: 750; }
.volume-cloud-tabs button.active { color: #fff; background: #0f172a; box-shadow: 0 1px 2px rgba(15,23,42,.2); }
.volume-cloud-stage { padding: 0; overflow: hidden; background: #3f3f3f; border: 1px solid #262626; border-radius: 10px; box-shadow: 0 8px 24px rgba(15,23,42,.14); }
.volume-cloud-stage-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; min-height: 36px; padding: 0 14px; color: #f8fafc; background: #464646; border-bottom: 1px solid #252525; font-size: .78rem; }
.volume-cloud-stage-head > span { color: #d1d5db; font-size: .68rem; }
.volume-cloud-stage-head i { margin-left: 7px; font-size: .5rem; vertical-align: middle; }
.volume-cloud-stage-head i.is-up { color: var(--up); }
.volume-cloud-stage-head i.is-down { color: var(--down); }
.volume-cloud-stage .apexcharts-canvas { margin: 0 auto; }
.volume-cloud-stage .apexcharts-treemap-rect { cursor: pointer; }
.volume-cloud-stage .apexcharts-data-labels text { paint-order: stroke; stroke: rgba(0,0,0,.14); stroke-width: 1px; }
.volume-cloud-summary { margin-top: 10px; padding: 11px 13px; color: var(--text-muted); background: var(--surface-soft); border: 1px solid var(--border); border-radius: 8px; font-size: .75rem; }
.volume-cloud-summary strong { color: #1e293b; }
.volume-cloud-summary b { color:var(--text); }
.volume-cloud-summary span { color: #0369a1; font-weight: 750; }
.volume-cloud-note { margin: 10px 0 0; color: #94a3b8; font-size: .7rem; line-height: 1.55; }
.volume-cloud-tooltip { min-width: 175px; padding: 10px 11px; color: #cbd5e1; font-size: .72rem; }
.volume-cloud-tooltip strong { display: block; color: #fff; font-size: .8rem; }
.volume-cloud-tooltip strong span { color: #94a3b8; font-size: .65rem; font-weight: 500; }
.volume-cloud-tooltip b { display: block; margin-top: 7px; color: #fff; font-size: .9rem; }
.volume-cloud-tooltip em { display: block; margin-top: 3px; font-style: normal; font-weight: 750; }
.volume-cloud-tooltip em.is-up { color: var(--up); }
.volume-cloud-tooltip em.is-down { color: var(--down); }
.volume-cloud-tooltip p { margin: 5px 0 0; color: #94a3b8; }
.sector-cloud-page { width: 100%; max-width: none; }
.sector-cloud-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; margin-bottom: 18px; }
.sector-cloud-head h1 { margin: 0; color:var(--text); font-size: 1.25rem; font-weight: 800; }
.sector-cloud-head h1 i { margin-right: 7px; color: #8b5cf6; }
.sector-cloud-head p { margin: 6px 0 0; color:var(--text-muted); font-size: .84rem; }
.sector-cloud-actions { display: flex; align-items: center; gap: 10px; color: #94a3b8; font-size: .72rem; white-space: nowrap; }
.sector-cloud-actions button { padding: 7px 10px; color: #ddd6fe; background: #312e81; border: 1px solid #4c1d95; border-radius: 7px; font-size: .75rem; font-weight: 750; }
.sector-cloud-actions button:hover { color: #fff; background: #4338ca; }
.sector-cloud-actions button:disabled { opacity: .65; cursor: wait; }
.sector-cloud-actions button.is-loading i { animation: spin 1s linear infinite; }
.sector-cloud-tabs { display: inline-flex; gap: 4px; padding: 4px; margin-bottom: 10px; background: var(--surface-soft); border-radius: 8px; }
.sector-cloud-tabs button { padding: 7px 16px; color:var(--primary); border-radius: 6px; font-size: .75rem; font-weight: 750; }
.sector-cloud-tabs button.active { color: #fff; background: #5b21b6; box-shadow: 0 1px 2px rgba(76,29,149,.25); }
.sector-cloud-stage { padding: 0; overflow: hidden; background: #3f3f3f; border: 1px solid #262626; border-radius: 10px; box-shadow: 0 8px 24px rgba(15,23,42,.14); }
.sector-cloud-stage-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; min-height: 36px; padding: 0 14px; color: #f8fafc; background: #464646; border-bottom: 1px solid #252525; font-size: .78rem; }
.sector-cloud-stage-head > span { color: #d1d5db; font-size: .68rem; }
.sector-cloud-stage-head i { margin-left: 7px; font-size: .5rem; vertical-align: middle; }
.sector-cloud-stage-head i.is-up { color: var(--up); }
.sector-cloud-stage-head i.is-down { color: var(--down); }
.sector-cloud-stage .apexcharts-canvas { margin: 0 auto; }
.sector-cloud-stage .apexcharts-treemap-rect { cursor: pointer; }
.sector-cloud-stage .apexcharts-data-labels text { paint-order: stroke; stroke: rgba(0,0,0,.14); stroke-width: 1px; }
.sector-cloud-summary { margin-top: 10px; padding: 11px 13px; color: var(--text-muted); background: var(--surface-soft); border: 1px solid var(--border); border-radius: 8px; font-size: .75rem; }
.sector-cloud-summary strong, .sector-cloud-summary b { color:var(--text); }
.sector-cloud-summary span { color:var(--primary); font-weight: 750; }
.sector-cloud-note { margin: 10px 0 0; color: #94a3b8; font-size: .7rem; line-height: 1.55; }
.sector-cloud-tooltip { min-width: 205px; padding: 10px 11px; color: #cbd5e1; font-size: .72rem; }
.sector-cloud-tooltip strong { display: block; color: #fff; font-size: .83rem; }
.sector-cloud-tooltip b { display: block; margin-top: 7px; color: #fff; font-size: .9rem; }
.sector-cloud-tooltip em { display: block; margin-top: 3px; font-style: normal; font-weight: 750; }
.sector-cloud-tooltip em.is-up { color: var(--up); }
.sector-cloud-tooltip em.is-down { color: var(--down); }
.sector-cloud-tooltip p { margin: 5px 0 0; color: #94a3b8; }
.world-markets-page { width: 100%; max-width: none; }
.world-markets-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 18px; }
.world-markets-head h1 { margin: 0; color:var(--text); font-size: 1.25rem; font-weight: 800; }
.world-markets-head h1 i { margin-right: 7px; color:var(--primary); }
.world-markets-head p { margin: 6px 0 0; color:var(--text-muted); font-size: .84rem; }
.world-markets-actions { display: flex; align-items: center; gap: 10px; color: #94a3b8; font-size: .72rem; white-space: nowrap; }
.world-markets-actions button { padding: 7px 10px; color:var(--primary); background:rgba(56,189,248,.1); border: 1px solid rgba(56,189,248,.3); border-radius: 7px; font-size: .75rem; font-weight: 750; }
.world-markets-actions button:hover { background:var(--primary-light); }
.world-markets-actions button:disabled { opacity: .65; cursor: wait; }
.world-markets-actions button.is-loading i { animation: spin 1s linear infinite; }
.world-markets-kpis { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-bottom: 14px; }
.world-markets-kpis article { padding: 13px 15px; background: linear-gradient(135deg, #fff, #f8fbff); border: 1px solid #dbeafe; border-radius: 10px; }
.world-markets-kpis span, .world-markets-kpis small { display: block; color:var(--text-muted); font-size: .68rem; }
.world-markets-kpis strong { display: block; margin: 5px 0 3px; color:var(--text); font-size: 1.05rem; font-variant-numeric: tabular-nums; }
.world-markets-grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(370px, .85fr); gap: 14px; }
.world-market-panel { overflow: hidden; background:var(--surface); border: 1px solid var(--border); border-radius: 12px; box-shadow: 0 2px 10px rgba(15,23,42,.05); }
.world-market-panel-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 14px 16px 10px; }
.world-market-panel-head h2 { margin: 0; color: #1e293b; font-size: .9rem; font-weight: 800; }
.world-market-panel-head p { margin: 4px 0 0; color: #94a3b8; font-size: .68rem; }
.world-market-panel-head > span { padding-top: 2px; color:var(--text-muted); font-size: .66rem; white-space: nowrap; }
.world-market-map { position: relative; min-height: 390px; margin: 0 12px; overflow: hidden; background: radial-gradient(circle at 45% 20%, #f8fcff 0, #eaf5ff 45%, #dbeafe 100%); border: 1px solid #dbeafe; border-radius: 10px; }
.world-market-land { position: absolute; inset: 0; width: 100%; height: 100%; opacity: .48; }
.world-market-land path { fill: #bfdbfe; stroke: #93c5fd; stroke-width: 3; stroke-linejoin: round; }
.world-market-marker { position: absolute; left: var(--x); top: var(--y); z-index: 1; width: var(--size); height: var(--size); min-width: var(--size); padding: 0; color: #fff; background: var(--market-color); border: 3px solid rgba(255,255,255,.92); border-radius: 50%; box-shadow: 0 3px 10px color-mix(in srgb, var(--market-color) 35%, transparent); transform: translate(-50%, -50%); transition: transform .18s ease, box-shadow .18s ease; }
.world-market-marker:hover, .world-market-marker.is-selected { z-index: 2; transform: translate(-50%, -50%) scale(1.14); box-shadow: 0 6px 16px color-mix(in srgb, var(--market-color) 45%, transparent); }
.world-market-marker span, .world-market-marker b { position: absolute; left: 50%; white-space: nowrap; pointer-events: none; transform: translateX(-50%); text-shadow: 0 1px 2px rgba(15,23,42,.38); }
.world-market-marker span { top: calc(100% + 4px); color:var(--text); font-size: .61rem; font-weight: 800; text-shadow: none; }
.world-market-marker b { top: calc(100% + 15px); color:var(--text-muted); font-size: .56rem; text-shadow: none; }
.world-market-map-note { margin: 10px 16px 13px; color: #94a3b8; font-size: .66rem; }.world-market-map-note i { margin-right: 4px; color:var(--primary); font-size: .5rem; }
.world-market-chart-panel #world-market-cap-chart { min-height: 400px; }
.world-market-list-panel { margin-top: 14px; }.world-market-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid #f1f5f9; }
.world-market-row { display: grid; grid-template-columns: 9px minmax(0, 1fr); column-gap: 8px; align-items: center; padding: 11px 13px; border-right: 1px solid #f1f5f9; border-bottom: 1px solid #f1f5f9; transition: background .15s ease; }
.world-market-row:nth-child(3n) { border-right: 0; }.world-market-row:hover, .world-market-row.is-selected { background:rgba(56,189,248,.08); }
.world-market-dot { grid-row: span 2; width: 8px; height: 8px; background: var(--market-color); border-radius: 50%; }.world-market-row strong { color:var(--text); font-size: .76rem; }.world-market-row small { display: block; overflow: hidden; margin-top: 2px; color: #94a3b8; font-size: .62rem; text-overflow: ellipsis; white-space: nowrap; }.world-market-row > b { grid-column: 2; margin-top: 6px; color:var(--text); font-size: .74rem; }.world-market-row > div:last-child { grid-column: 2; min-width: 0; }
.world-market-quote { grid-column: 2; display: block; margin-top: 4px; color:var(--text-muted); font-size: .68rem; font-variant-numeric: tabular-nums; }.world-market-quote b { margin-left: 3px; font-weight: 750; }.world-market-quote.is-up, .world-market-quote.is-up b { color: var(--up); }.world-market-quote.is-down, .world-market-quote.is-down b { color: var(--down); }.world-market-quote.is-empty { color: #94a3b8; }
.world-markets-note { margin: 11px 0 0; color: #94a3b8; font-size: .67rem; line-height: 1.55; }
.world-market-index-panel { margin-top: 14px; padding: 16px 18px; }
.world-market-index-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin-top: 12px; }
@media (max-width: 1100px) { .world-market-index-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 700px) { .world-market-index-grid { grid-template-columns: 1fr; } }
.asset-class-grid { grid-template-columns: repeat(auto-fit, minmax(340px, 1fr)); }
.world-market-index-panel + .world-market-index-panel { margin-top: 14px; }

.gainers-page { width: 100%; max-width: 900px; margin: 0 auto; }
.gainers-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 16px; }
.gainers-head h1 { display: flex; align-items: center; gap: 9px; margin: 0; color:var(--text); font-size: 1.35rem; }
.gainers-head h1 i { color: #e11d48; }
.gainers-head p { margin: 6px 0 0; color:var(--text-muted); font-size: .82rem; line-height: 1.5; max-width: 560px; }
.gainers-actions { display: flex; align-items: center; gap: 10px; flex: 0 0 auto; }
.gainers-actions span { color: #94a3b8; font-size: .76rem; }
.gainers-actions span.is-simulated { color: #a16207; }
.gainers-actions button { display: flex; align-items: center; gap: 6px; padding: 7px 12px; color:var(--text); background:var(--surface); border: 1px solid var(--border); border-radius: 8px; font-size: .78rem; font-weight: 700; }
.gainers-actions button:hover { border-color:var(--primary); color:var(--primary); }
.gainers-actions button.is-loading i { animation: spin 1s linear infinite; }
.gainers-list { background:var(--surface); border: 1px solid var(--border); border-radius: 12px; overflow: hidden; box-shadow: 0 2px 10px rgba(15,23,42,.05); }
.gainers-loading, .gainers-error { display: flex; align-items: center; justify-content: center; gap: 8px; padding: 40px 16px; color: #94a3b8; font-size: .85rem; }
.gainers-error { color: var(--red); }
.gainers-row { display: grid; width: 100%; grid-template-columns: 40px minmax(0, 1fr) auto auto; align-items: center; gap: 12px; padding: 12px 16px; color: inherit; background:var(--surface); border: 0; border-bottom: 1px solid #f1f5f9; text-align: left; font: inherit; cursor: pointer; }
.gainers-row:last-child { border-bottom: 0; }
.gainers-row:hover { background:rgba(56,189,248,.08); }
.gainers-row:focus-visible { position: relative; z-index: 1; outline: 3px solid rgba(0,120,212,.3); outline-offset: -3px; }
.gainers-rank { display: grid; place-items: center; width: 30px; height: 30px; color:var(--text-muted); background:var(--surface-soft); border-radius: 8px; font-size: .82rem; font-weight: 800; }
.gainers-row.is-top1 .gainers-rank { color: #fff; background: linear-gradient(135deg, #f59e0b, #d97706); }
.gainers-row.is-top2 .gainers-rank { color: #fff; background: linear-gradient(135deg, #94a3b8, #64748b); }
.gainers-row.is-top3 .gainers-rank { color: #fff; background: linear-gradient(135deg, #c2703d, #9a5527); }
.gainers-name { min-width: 0; display: flex; flex-direction: column; }
.gainers-name strong { color:var(--text); font-size: .88rem; }
.gainers-name .gainers-meta { margin-top: 2px; color: #94a3b8; font-size: .72rem; }
.gainers-quote-action { display: inline-flex; align-items: center; gap: 4px; width: fit-content; margin-top: 5px; color:var(--primary); font-size: .72rem; font-weight: 750; text-decoration: underline; text-underline-offset: 2px; }
.gainers-row:hover .gainers-quote-action { color: #075985; }
.gainers-price { color:var(--text); font-size: .84rem; font-variant-numeric: tabular-nums; white-space: nowrap; }
.gainers-change { padding: 4px 10px; border-radius: 999px; font-size: .8rem; font-weight: 800; white-space: nowrap; }
.gainers-change.is-up { color: var(--up); background:var(--up-bg); }
.gainers-change.is-down { color: var(--down); background:var(--down-bg); }
.gainers-note { margin: 12px 0 0; color: #94a3b8; font-size: .72rem; line-height: 1.6; }
.gainers-quote-modal-backdrop { position: fixed; z-index: 1300; inset: 0; display: grid; place-items: center; padding: 20px; background: rgba(15,23,42,.58); backdrop-filter: blur(3px); }
.gainers-quote-modal-backdrop[hidden] { display: none; }
.gainers-quote-modal { width: min(900px, 100%); max-height: calc(100vh - 40px); overflow: auto; background:var(--surface); border: 1px solid var(--border); border-radius: 16px; box-shadow: 0 24px 70px rgba(15,23,42,.32); outline: none; }
.gainers-quote-modal-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding: 20px 24px 16px; border-bottom: 1px solid #e2e8f0; }
.gainers-quote-modal-header p { margin: 0 0 4px; color:var(--text-muted); font-size: .75rem; font-weight: 700; }
.gainers-quote-modal-header h2 { margin: 0; color:var(--text); font-size: 1.2rem; }
.gainers-quote-price-row { display: flex; align-items: center; gap: 9px; margin-top: 8px; }
.gainers-quote-price-row strong { color:var(--text); font-size: 1.55rem; }
.gainers-quote-price-row em { padding: 4px 8px; border-radius: 999px; font-size: .78rem; font-style: normal; font-weight: 800; }
.gainers-quote-price-row em.is-up { color: var(--up); background:var(--up-bg); }
.gainers-quote-price-row em.is-down { color: var(--down); background:var(--down-bg); }
.gainers-quote-modal-close { display: grid; place-items: center; width: 38px; height: 38px; color:var(--text-muted); border-radius: 9px; font-size: 1.05rem; }
.gainers-quote-modal-close:hover { color:var(--text); background:var(--surface-soft); }
.gainers-quote-periods { display: flex; gap: 6px; padding: 12px 24px 0; }
.gainers-quote-periods button { padding: 6px 10px; color:var(--text-muted); background:var(--surface-soft); border: 1px solid var(--border); border-radius: 7px; font-size: .74rem; font-weight: 750; }
.gainers-quote-periods button.active, .gainers-quote-periods button:hover { color: #fff; background: #0078d4; border-color:var(--primary); }
.gainers-quote-chart-wrap { position: relative; min-height: 390px; padding: 8px 16px 0; }
.gainers-quote-chart { width: 100%; }
.gainers-quote-loading { position: absolute; inset: 8px 16px 0; display: flex; align-items: center; justify-content: center; gap: 8px; color:var(--text-muted); background: rgba(255,255,255,.88); font-size: .84rem; }
.gainers-quote-source { padding: 8px 24px 16px; color: #94a3b8; font-size: .7rem; }
.gainers-quote-source.is-simulated { color: #a16207; }
@media (max-width: 640px) {
  .gainers-head { flex-direction: column; }
  .gainers-row { grid-template-columns: 32px minmax(0, 1fr) auto; gap: 9px; padding-inline: 12px; }
  .gainers-price { display: none; }
  .gainers-quote-modal-backdrop { padding: 10px; }
  .gainers-quote-modal-header { padding: 16px; }
  .gainers-quote-periods { padding-inline: 16px; }
  .gainers-quote-chart-wrap { min-height: 320px; padding-inline: 6px; }
  .gainers-quote-chart { min-height: 320px; }
  .gainers-quote-loading { inset-inline: 6px; }
  .gainers-quote-source { padding-inline: 16px; }
}
.global-capital-page { width: 100%; max-width: 1280px; margin: 0 auto; color: #172554; }
.global-capital-hero { display: flex; justify-content: space-between; gap: 20px; padding: 26px 28px; color: #eff6ff; background: radial-gradient(circle at 82% 20%, #2459c5 0, transparent 29%), linear-gradient(120deg, #071638, #102e72); border-radius: 16px; overflow: hidden; }
.global-capital-eyebrow { display: inline-flex; align-items: center; gap: 7px; color: #a5d8ff; font-size: .68rem; font-weight: 800; letter-spacing: .12em; }
.global-capital-hero h1 { margin: 8px 0 7px; color: #fff; font-size: 1.7rem; letter-spacing: -.04em; }
.global-capital-hero p { max-width: 630px; margin: 0; color: #cbd5e1; font-size: .85rem; line-height: 1.6; }
.global-capital-hero-stat { flex: 0 0 230px; align-self: center; padding: 15px 17px; background: rgba(255,255,255,.1); border: 1px solid rgba(191,219,254,.28); border-radius: 12px; backdrop-filter: blur(6px); }
.global-capital-hero-stat span,.global-capital-hero-stat small { display: block; color: #bfdbfe; font-size: .7rem; }.global-capital-hero-stat strong { display: block; margin: 5px 0; color: #fff; font-size: 1rem; }
.capital-warning { display: flex; align-items: flex-start; gap: 9px; padding: 11px 14px; margin: 13px 0; color:var(--text); background:var(--surface-soft); border: 1px solid var(--border); border-radius: 10px; font-size: .76rem; line-height: 1.55; }.capital-warning i { margin-top: 2px; color:var(--primary); }.capital-warning p { margin: 0; }.capital-warning b { color:var(--primary); }
.capital-type-tabs { display: flex; flex-wrap: wrap; gap: 7px; margin-bottom: 13px; }.capital-type-tabs button { padding: 7px 10px; color:var(--text-muted); background:var(--surface); border: 1px solid var(--border); border-radius: 999px; font-size: .72rem; font-weight: 750; }.capital-type-tabs button[aria-selected="true"] { color: #fff; background: #173b8c; border-color: #173b8c; box-shadow: 0 3px 8px rgba(30,58,138,.2); }
.global-capital-layout { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(280px, .7fr); gap: 14px; }.capital-map-panel,.capital-detail,.capital-flow-panel { background:var(--surface); border: 1px solid #e6edf8; border-radius: 14px; box-shadow: 0 6px 20px rgba(30,58,138,.06); }.capital-map-panel { padding: 16px; }.capital-panel-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; }.capital-panel-head h2 { margin: 0; color: #102a62; font-size: 1rem; letter-spacing: -.02em; }.capital-panel-head p { margin: 4px 0 0; color:var(--text-muted); font-size: .72rem; line-height: 1.45; }.capital-panel-head > span { padding: 5px 7px; color:var(--primary); background:rgba(56,189,248,.1); border-radius: 6px; font-size: .67rem; font-weight: 750; white-space: nowrap; }
.capital-orbit { position: relative; min-height: 445px; margin-top: 12px; overflow: hidden; background: linear-gradient(145deg, #f8fbff, #edf4ff); border: 1px solid #e0eaf9; border-radius: 12px; }.capital-orbit::before { content: ''; position: absolute; inset: 0; background-image: radial-gradient(#b8cae7 1px, transparent 1px); background-size: 18px 18px; opacity: .35; }.capital-orbit-core { position: absolute; top: 50%; left: 50%; z-index: 2; display: flex; flex-direction: column; align-items: center; justify-content: center; width: 126px; height: 126px; color: #fff; background: radial-gradient(circle at 35% 30%, #3b82f6, #132f6c 70%); border: 7px solid rgba(255,255,255,.8); border-radius: 50%; box-shadow: 0 12px 24px rgba(29,78,216,.24); transform: translate(-50%,-50%); text-align: center; }.capital-orbit-core i { color: #bfdbfe; font-size: 1.05rem; }.capital-orbit-core strong { margin: 6px 0 2px; font-size: .85rem; }.capital-orbit-core small { color: #dbeafe; font-size: .61rem; }.capital-orbit-ring { position: absolute; top: 50%; left: 50%; border: 1px dashed #b9cbe7; border-radius: 50%; transform: translate(-50%,-50%); }.ring-one { width: 270px; height: 270px; }.ring-two { width: 420px; height: 420px; }
.capital-profiles { position: relative; z-index: 3; display: grid; grid-template-columns: repeat(3, minmax(125px, 1fr)); gap: 11px; padding: 15px; }.capital-profile { min-height: 130px; padding: 12px; color: #102a62; background: rgba(255,255,255,.94); border: 1px solid #dbe7f8; border-top: 3px solid var(--capital-color); border-radius: 10px; box-shadow: 0 4px 10px rgba(30,58,138,.08); text-align: left; transition: transform .16s, box-shadow .16s, opacity .16s; }.capital-profile:hover,.capital-profile.is-selected { transform: translateY(-3px); box-shadow: 0 9px 18px rgba(30,58,138,.16); }.capital-profile.is-selected { outline: 2px solid var(--capital-color); }.capital-profile.blue { --capital-color:var(--primary); }.capital-profile.navy { --capital-color:#15357a; }.capital-profile.coral { --capital-color:#ef6b61; }.capital-profile.green { --capital-color:#149a76; }.capital-profile.purple { --capital-color:#7c4dca; }.capital-profile.teal { --capital-color:#0f9b9c; }.capital-profile-icon { display: inline-flex; align-items: center; justify-content: center; width: 25px; height: 25px; color: var(--capital-color); background: color-mix(in srgb, var(--capital-color) 10%, white); border-radius: 7px; font-size: .72rem; }.capital-profile-top { float: right; display: flex; flex-direction: column; align-items: flex-end; gap: 2px; }.capital-profile-top em { color: var(--capital-color); font-size: .57rem; font-style: normal; font-weight: 800; }.capital-profile-top small,.capital-profile-basis { color: #94a3b8; font-size: .56rem; }.capital-profile strong,.capital-profile b,.capital-profile-basis { display: block; }.capital-profile strong { clear: both; padding-top: 9px; font-size: .77rem; }.capital-profile b { margin: 4px 0 3px; color: #0f2c66; font-size: .9rem; font-variant-numeric: tabular-nums; }.capital-profile[hidden] { display: none; }
.capital-detail { display: flex; flex-direction: column; padding: 20px; }.capital-detail-type { display: inline-flex; align-self: flex-start; gap: 6px; padding: 5px 8px; color: var(--capital-color); background: color-mix(in srgb, var(--capital-color) 10%, white); border-radius: 6px; font-size: .67rem; font-weight: 800; }.capital-detail-type.blue { --capital-color:var(--primary); }.capital-detail-type.navy { --capital-color:#15357a; }.capital-detail-type.coral { --capital-color:#d64d46; }.capital-detail-type.green { --capital-color:#07815f; }.capital-detail-type.purple { --capital-color:#7042ba; }.capital-detail-type.teal { --capital-color:#087f80; }.capital-detail h2 { margin: 13px 0 8px; color: #102a62; font-size: 1.25rem; }.capital-detail-amount { padding: 12px; background: #f1f6ff; border-radius: 9px; }.capital-detail-amount strong,.capital-detail-amount span { display: block; }.capital-detail-amount strong { color: #173b8c; font-size: 1.2rem; }.capital-detail-amount span { margin-top: 3px; color:var(--text-muted); font-size: .67rem; }.capital-detail > p { color:var(--text); font-size: .77rem; line-height: 1.7; }.capital-korea-note { display: flex; gap: 9px; padding: 11px; margin-top: auto; color: #0f766e; background: #effcf9; border: 1px solid #ccfbf1; border-radius: 9px; }.capital-korea-note i { margin-top: 2px; }.capital-korea-note b,.capital-korea-note span { display: block; }.capital-korea-note b { font-size: .68rem; }.capital-korea-note span { margin-top: 3px; color: #47636c; font-size: .68rem; line-height: 1.5; }.capital-detail a { margin-top: 12px; color:var(--primary); font-size: .72rem; font-weight: 750; text-decoration: none; }.capital-detail a:hover { text-decoration: underline; }
.capital-flow-panel { padding: 16px; margin-top: 14px; }.capital-flow { display: grid; grid-template-columns: 1fr auto 1fr auto 1fr auto 1fr; align-items: center; gap: 8px; margin-top: 14px; }.capital-flow > i { color: #94a3b8; }.capital-flow article { padding: 12px; background:rgba(56,189,248,.08); border: 1px solid #e3edf9; border-radius: 9px; text-align: center; }.capital-flow article i { display: block; margin-bottom: 6px; color:var(--primary); }.capital-flow article b,.capital-flow article span { display: block; }.capital-flow article b { color: #173b8c; font-size: .73rem; }.capital-flow article span { margin-top: 4px; color:var(--text-muted); font-size: .65rem; }.capital-flow article.impact { background: #eefaf7; border-color: #ccefe5; }.capital-flow article.impact i,.capital-flow article.impact b { color: #07815f; }
.capital-impact-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-top: 14px; }.capital-impact-grid article { position: relative; padding: 17px 16px 16px; background:var(--surface); border: 1px solid #e6edf8; border-radius: 12px; box-shadow: 0 4px 14px rgba(30,58,138,.04); }.impact-no { color: #bfdbfe; font-size: 1.3rem; font-weight: 850; }.capital-impact-grid h3 { margin: 5px 0 6px; color: #102a62; font-size: .85rem; }.capital-impact-grid p { margin: 0; color:var(--text-muted); font-size: .7rem; line-height: 1.6; }.capital-sources { margin: 12px 2px 0; color: #94a3b8; font-size: .66rem; line-height: 1.5; }.capital-sources i { color:var(--primary); }
@media (max-width: 1000px) { .home-market-grid { grid-template-columns: 1fr; } }
@media (max-width: 760px) { .home-quote-grid { grid-template-columns: 1fr; } }
@media (max-width: 900px) { .server-resource-grid { grid-template-columns: 1fr; } }
@media (max-width: 960px) { .world-markets-grid,.global-capital-layout { grid-template-columns: 1fr; } .world-market-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }.world-market-row:nth-child(3n) { border-right: 1px solid #f1f5f9; }.world-market-row:nth-child(2n) { border-right: 0; } .global-capital-hero { flex-direction: column; }.global-capital-hero-stat { flex-basis: auto; align-self: stretch; }.capital-detail { min-height: 250px; }.capital-flow { grid-template-columns: repeat(4, 1fr); }.capital-flow > i { display: none; } }
@media (max-width: 560px) { .home-market-card-head, .home-quote-dashboard-head, .server-resource-head, .server-resource-history-head, .volume-cloud-head, .sector-cloud-head, .world-markets-head { flex-direction: column; } .home-quote-actions, .server-resource-actions, .volume-cloud-actions, .sector-cloud-actions, .world-markets-actions { width: 100%; justify-content: space-between; } .volume-cloud-stage, .sector-cloud-stage { padding-inline: 8px; } .world-markets-kpis, .world-market-list { grid-template-columns: 1fr; } .world-market-row, .world-market-row:nth-child(3n) { border-right: 0; } .world-market-map { min-height: 320px; } .world-market-marker span { font-size: .55rem; } .world-market-marker b { display: none; } .global-capital-hero { padding: 22px 19px; }.global-capital-hero h1 { font-size: 1.45rem; }.capital-profiles { grid-template-columns: repeat(2, minmax(0,1fr)); padding: 10px; gap: 8px; }.capital-profile { min-height: 122px; padding: 9px; }.capital-profile b { font-size: .79rem; }.capital-orbit { min-height: 430px; }.ring-two { width: 330px; height: 330px; }.ring-one { width: 220px; height: 220px; }.capital-orbit-core { width: 90px; height: 90px; border-width: 4px; }.capital-orbit-core strong { font-size: .69rem; }.capital-orbit-core small { display: none; }.capital-flow,.capital-impact-grid { grid-template-columns: 1fr; }.capital-flow article { text-align: left; }.capital-flow article i { display: inline-block; width: 18px; margin: 0 7px 0 0; }.capital-flow article b,.capital-flow article span { display: inline; }.capital-flow article span { margin-left: 7px; } }

/* ═══════════════════════════════════════════════════════
   QUIZ VIEW
═══════════════════════════════════════════════════════ */
.quiz-header {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 20px; flex-wrap: wrap; gap: 12px;
}
.quiz-meta { display: flex; align-items: center; gap: 10px; }
.quiz-progress-wrap { display: flex; flex-direction: column; gap: 4px; flex: 1; max-width: 360px; }
.quiz-progress-label { font-size: .75rem; color: var(--text-muted); display: flex; justify-content: space-between; }

.question-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 24px 28px;
  box-shadow: var(--shadow-sm);
  margin-bottom: 16px;
}
.q-num {
  font-size: .85rem; font-weight: 700; color: var(--primary);
  text-transform: uppercase; letter-spacing: .06em; margin-bottom: 10px;
  display: flex; align-items: center; gap: 8px;
}
.q-text { font-size: 1.05rem; font-weight: 600; line-height: 1.6; margin-bottom: 18px; }

.choices { display: flex; flex-direction: column; gap: 8px; }
.choice-btn {
  display: flex; align-items: flex-start; gap: 10px;
  width: 100%; padding: 12px 16px;
  border: 1.5px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--surface);
  text-align: left; font-size: 1rem; font-weight: 500;
  color: var(--text); cursor: pointer;
  transition: all .15s;
}
.choice-btn:hover:not(:disabled) { border-color: var(--primary); background: var(--primary-light); }
.choice-btn.selected  { border-color: var(--primary); background: var(--primary-light); color: var(--primary-dark); }
.choice-btn.correct   { border-color: var(--green); background: var(--green-bg); color: #065f46; }
.choice-btn.wrong     { border-color: var(--red);   background: var(--red-bg);   color: #991b1b; }
.choice-btn:disabled  { cursor: default; }
.choice-idx {
  display: flex; align-items: center; justify-content: center;
  width: 22px; height: 22px; flex-shrink: 0;
  border-radius: 50%; border: 1.5px solid var(--border-strong);
  font-size: .72rem; font-weight: 700;
}
.choice-btn.correct .choice-idx { border-color: var(--green); background: var(--green); color: #fff; }
.choice-btn.wrong   .choice-idx { border-color: var(--red);   background: var(--red);   color: #fff; }

.explanation {
  display: none;
  margin-top: 16px; padding: 14px 16px;
  background:var(--green-bg); border: 1px solid #bbf7d0;
  border-radius: var(--radius-sm);
  font-size: .85rem; line-height: 1.65; color: #14532d;
}
.explanation.show { display: block; }
.explanation.wrong-exp { background:rgba(240,185,11,.12); border-color: #fed7aa; color: #7c2d12; }
.exp-label { font-weight: 700; margin-bottom: 4px; display: flex; align-items: center; gap: 6px; }

.quiz-nav {
  display: flex; align-items: center; justify-content: space-between;
  margin-top: 20px; flex-wrap: wrap; gap: 10px;
}
.quiz-score-bar {
  display: flex; align-items: center; gap: 12px; font-size: .82rem; color: var(--text-muted);
}
.score-correct { color: var(--green); font-weight: 700; }
.score-wrong   { color: var(--red);   font-weight: 700; }

/* result screen */
.quiz-result {
  text-align: center; padding: 40px 24px;
  background: var(--surface); border: 1px solid var(--border);
  border-radius: var(--radius); box-shadow: var(--shadow-sm);
}
.result-score {
  font-size: 3.5rem; font-weight: 900;
  background: linear-gradient(135deg, #004578, #0078d4);
  -webkit-background-clip: text; -webkit-text-fill-color: transparent;
  line-height: 1; margin-bottom: 8px;
}
.result-label { font-size: 1.1rem; color: var(--text-muted); margin-bottom: 24px; }
.result-stats {
  display: flex; align-items: center; justify-content: center; gap: 32px;
  margin-bottom: 28px;
}
.result-stat { text-align: center; }
.result-stat .val { font-size: 1.6rem; font-weight: 800; }
.result-stat .lbl { font-size: .75rem; color: var(--text-muted); margin-top: 2px; }

/* edit modal */
.modal-backdrop {
  display: none;
  position: fixed; inset: 0;
  background: rgba(15,23,42,.45);
  z-index: 100;
  align-items: center; justify-content: center; padding: 2vh 2vw;
}
.modal-backdrop.show { display: flex; }
.modal {
  background: var(--surface);
  border-radius: var(--radius);
  box-shadow: var(--shadow-lg);
  width: 100%; height: 100%;
  overflow-y: auto;
  padding: clamp(24px, 3vw, 48px);
  border: 1px solid var(--border);
}
.modal-header {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 20px;
}
.modal-title { font-size: clamp(1.25rem, 2vw, 1.7rem); font-weight: 700; }
.modal-close { width: 44px; height: 44px; border-radius: 50%; color: var(--text-muted); font-size: 1.2rem; display: flex; align-items: center; justify-content: center; }
.modal-close:hover { background: var(--surface-soft); }
.modal-field { margin-bottom: 14px; }
.modal-label { font-size: 1rem; font-weight: 600; color: var(--text-muted); margin-bottom: 8px; display: block; }
.modal-input, .modal-textarea, .modal-select {
  width: 100%; padding: 13px 16px;
  border: 1.5px solid var(--border); border-radius: var(--radius-sm);
  font-size: 1rem; color: var(--text);
  background: var(--surface);
  transition: border-color .15s;
}
.modal-input:focus, .modal-textarea:focus, .modal-select:focus {
  outline: none; border-color: var(--primary);
  box-shadow: 0 0 0 3px rgba(0,120,212,.12);
}
.modal-textarea { resize: vertical; min-height: 140px; }
.modal-footer { display: flex; justify-content: flex-end; gap: 12px; margin-top: 28px; }

/* ═══════════════════════════════════════════════════════
   QUIZ PLAN HOME
═══════════════════════════════════════════════════════ */
.plan-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 14px;
  margin-top: 20px;
}
.plan-card {
  background: var(--surface); border: 1px solid var(--border);
  border-radius: var(--radius); padding: 16px;
  cursor: pointer; transition: all .15s;
  box-shadow: var(--shadow-sm);
}
.plan-card:hover { border-color: var(--primary); box-shadow: var(--shadow); transform: translateY(-1px); }
.plan-card.done { border-color: var(--green); background: var(--green-bg); }
.plan-day { font-size: .75rem; font-weight: 700; color: var(--text-subtle); text-transform: uppercase; letter-spacing: .06em; margin-bottom: 4px; }
.plan-topic { font-size: 1rem; font-weight: 700; color: var(--text); margin-bottom: 8px; line-height: 1.3; }
.plan-count { font-size: .88rem; color: var(--text-muted); }
.plan-prog { margin-top: 8px; }

/* ═══════════════════════════════════════════════════════
   HOME VIEW
═══════════════════════════════════════════════════════ */
.home-hero {
  background: linear-gradient(135deg, #004578 0%, #0078d4 55%, #2b88d8 100%);
  border-radius: var(--radius); padding: 36px 32px; color: #ffffff;
  margin-bottom: 28px; position: relative; overflow: hidden;
  border: none;
  box-shadow: 0 4px 20px rgba(0,120,212,.25);
}
.home-hero::after {
  content: ''; position: absolute; right: -20px; top: -20px;
  width: 200px; height: 200px;
  background: rgba(255,255,255,.08); border-radius: 50%;
}
.home-hero h1 { font-size: 1.6rem; font-weight: 800; margin: 0 0 8px; color: #ffffff; }
.home-hero p  { font-size: 1rem; opacity: .85; margin: 0 0 20px; }
.home-hero .btn { background:var(--surface); color: var(--primary); font-weight: 700; border: none; }
.home-hero .btn:hover { background:rgba(56,189,248,.1); }

.home-sections { display: grid; grid-template-columns: repeat(3,1fr); gap: 16px; margin-bottom: 28px; }
.home-section-card {
  background: var(--surface); border: 1px solid var(--border);
  border-radius: var(--radius); padding: 20px;
  cursor: pointer; transition: all .15s; box-shadow: var(--shadow-sm);
}
.home-section-card:hover { border-color: var(--primary); transform: translateY(-2px); box-shadow: var(--shadow); }
.hsc-icon {
  width: 44px; height: 44px; border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.2rem; margin-bottom: 12px;
}
.hsc-icon.learn   { background: var(--primary-light); color: var(--primary); border: 1.5px solid var(--primary); }
.hsc-icon.practice{ background:var(--green-bg); color: #065f46; border: 1.5px solid #6ee7b7; }
.hsc-icon.quiz    { background: var(--primary-light); color: var(--primary); border: 1.5px solid var(--primary); }
.hsc-title { font-size: 1.05rem; font-weight: 700; margin-bottom: 5px; }
.hsc-desc  { font-size: .9rem; color: var(--text-muted); line-height: 1.5; }

/* ═══════════════════════════════════════════════════════
   LOADING SPINNER
═══════════════════════════════════════════════════════ */
.spinner {
  width: 36px; height: 36px; border-radius: 50%;
  border: 3px solid var(--border);
  border-top-color: var(--primary);
  animation: spin .7s linear infinite;
  margin: 40px auto;
}
@keyframes spin { to { transform: rotate(360deg); } }

.loading-wrap { display: flex; flex-direction: column; align-items: center; gap: 12px; padding: 60px 0; }
.loading-text { font-size: .85rem; color: var(--text-muted); }

/* ═══════════════════════════════════════════════════════
   FORMS / INPUTS (general)
═══════════════════════════════════════════════════════ */
.form-row { display: flex; gap: 10px; flex-wrap: wrap; align-items: flex-end; margin-bottom: 16px; }
.form-group { display: flex; flex-direction: column; gap: 5px; }
.form-label { font-size: .88rem; font-weight: 600; color: var(--text-muted); }
.form-input, .form-select {
  padding: 8px 12px; border: 1.5px solid var(--border);
  border-radius: var(--radius-sm); font-size: 1rem;
  background: var(--surface); color: var(--text);
  transition: border-color .15s;
}
.form-input:focus, .form-select:focus {
  outline: none; border-color: var(--primary);
  box-shadow: 0 0 0 3px rgba(0,120,212,.12);
}

/* ═══════════════════════════════════════════════════════
   METRIC BOX (used in ML views)
═══════════════════════════════════════════════════════ */
.metric-box {
  background: var(--surface-soft); border: 1px solid var(--border);
  border-radius: var(--radius-sm); padding: 10px 14px; min-width: 110px;
}

/* ═══════════════════════════════════════════════════════
   HOME VIEW — ANALYSIS GROUP GRID
═══════════════════════════════════════════════════════ */
.analysis-group-grid {
  display: flex;
  flex-direction: column;
  gap: 28px;
}

.analysis-group {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 24px 28px;
  box-shadow: var(--shadow-sm);
}

.analysis-group-head {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  margin-bottom: 20px;
}

.analysis-group-icon {
  width: 48px; height: 48px;
  border-radius: 12px;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.25rem;
  background: var(--primary);
  color: #ffffff;
  border: none;
  flex-shrink: 0;
  box-shadow: 0 2px 8px rgba(0,120,212,.25);
}

.analysis-group-head h2 {
  font-size: 1.1rem; font-weight: 700;
  color: var(--text); margin: 0 0 4px;
}

.analysis-group-head p {
  font-size: 1rem; color: var(--text-muted);
  line-height: 1.5; margin: 0;
}

/* 실습 화면 — 분석/ML 기법 쉬운 설명 */
.practice-guide {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  margin: 0 0 18px;
  padding: 14px 16px;
  color: var(--text);
  background:rgba(56,189,248,.1);
  border: 1px solid rgba(56,189,248,.3);
  border-left: 4px solid var(--primary);
  border-radius: var(--radius-sm);
}
.practice-guide-icon {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  color: #92400e;
  background:var(--primary-light);
  border-radius: 50%;
}
.practice-guide-title { font-size: .9rem; font-weight: 800; }
.practice-guide-title span { margin-left: 6px; color: var(--primary); }
.practice-guide p { margin: 4px 0 0; color: var(--text-muted); font-size: .88rem; line-height: 1.6; }

.home-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 12px;
}

.home-card {
  background: var(--surface-soft);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  padding: 16px;
  cursor: pointer;
  transition: all .15s;
  display: flex; flex-direction: column; gap: 8px;
}

.home-card:hover {
  border-color: var(--primary);
  background: var(--primary-light);
  transform: translateY(-2px);
  box-shadow: var(--shadow);
}

.home-card.is-disabled {
  opacity: .5;
  cursor: not-allowed;
  pointer-events: none;
}

.home-icon {
  width: 36px; height: 36px;
  border-radius: 8px;
  background: var(--primary-light);
  border: 1.5px solid var(--primary);
  display: flex; align-items: center; justify-content: center;
  font-size: .95rem;
  color: var(--primary);
}

.home-card-title {
  font-size: 1rem; font-weight: 700;
  color: var(--text); line-height: 1.35;
}

.home-card-tag {
  font-size: .85rem; color: var(--text-muted);
  line-height: 1.4;
}

/* ═══════════════════════════════════════════════════════
   HOME MINI CARDS — Copilot-style
═══════════════════════════════════════════════════════ */
.home-mini-group {
  background:var(--surface);
  border: 1px solid var(--border);
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 1px 4px rgba(0,0,0,.05);
  transition: box-shadow .15s;
}

.home-mini-group:hover {
  box-shadow: 0 3px 12px rgba(0,0,0,.09);
}

.home-mini-group-head {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 14px;
  font-size: 0.78rem;
  font-weight: 600;
  color: #424242;
  background: var(--surface-soft);
  border-bottom: 1px solid var(--border);
  letter-spacing: .01em;
}

.home-mini-group-head i {
  color: var(--primary);
  font-size: 0.82rem;
}

.home-mini-items {
  display: flex;
  flex-direction: column;
}

.home-mini-card {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 14px;
  cursor: pointer;
  border-bottom: 1px solid #f5f5f5;
  transition: background .1s;
}

.home-mini-card:last-child { border-bottom: none; }

.home-mini-card:hover {
  background: var(--primary-light);
}

.home-mini-card:hover .home-mini-arrow {
  color: var(--primary);
  transform: translateX(2px);
}

.home-mini-card.is-disabled {
  opacity: .4;
  cursor: not-allowed;
  pointer-events: none;
}

.home-mini-icon {
  width: 28px; height: 28px;
  border-radius: 6px;
  display: flex; align-items: center; justify-content: center;
  font-size: 0.78rem;
  background: var(--primary-light);
  color: var(--primary);
  border: 1px solid #c8e0f7;
  flex-shrink: 0;
}

.home-mini-text { flex: 1; min-width: 0; }

.home-mini-name {
  font-size: 0.81rem;
  font-weight: 600;
  color: #212121;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.home-mini-tag {
  font-size: 0.7rem;
  color: #9e9e9e;
  margin-top: 1px;
}

.home-mini-arrow {
  font-size: 0.6rem;
  color: #bdbdbd;
  flex-shrink: 0;
  transition: color .1s, transform .1s;
}

/* ═══════════════════════════════════════════════════════
   DART VIEWS — 공통 UI (검색 패널, 결과 카드, 테이블)
═══════════════════════════════════════════════════════ */
.dart-search-panel {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 20px 24px;
  margin-bottom: 20px;
  box-shadow: var(--shadow-sm);
}
.dart-search-row {
  display: flex;
  align-items: flex-end;
  gap: 14px;
  flex-wrap: wrap;
}
.param-label {
  display: block;
  font-size: .74rem;
  font-weight: 700;
  color: var(--text-muted);
  margin-bottom: 5px;
  text-transform: uppercase;
  letter-spacing: .04em;
}
.param-input {
  padding: 8px 11px;
  border: 1.5px solid var(--border);
  border-radius: var(--radius-sm);
  font-size: 1rem;
  color: var(--text);
  background: var(--surface);
  transition: border-color .15s;
}
.param-input:focus { outline: none; border-color: var(--primary); box-shadow: 0 0 0 3px rgba(0,120,212,.12); }
.run-btn {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 9px 22px;
  background: var(--primary); color: var(--run-btn-text, #ffffff);
  border: 1.5px solid var(--primary-dark); border-radius: var(--radius-sm);
  font-size: 1rem; font-weight: 700;
  cursor: pointer; transition: background .15s;
  white-space: nowrap;
}
.run-btn:hover  { background: var(--primary-dark); }
.run-btn:disabled { opacity: .5; cursor: not-allowed; }
body.theme-terminal .content-wrap .run-btn { --run-btn-text: #151a10; }

/* ── 포트폴리오 조합 ── */
.page-heading { margin-bottom: 24px; }
.page-heading h1 { margin: 0 0 6px; font-size: 1.3rem; font-weight: 800; color: var(--text); }
.page-heading h1 i { color: var(--primary); }
.page-heading p { margin: 0; color: var(--text-muted); font-size: .9rem; }
.composition-guide { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 12px 14px; align-items: start; margin: 0 0 18px; padding: 16px 18px; border: 1px solid rgba(56,189,248,.3); border-radius: 12px; background: rgba(56,189,248,.08); }
.composition-guide-icon { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: var(--primary-light); color: var(--primary); }
.composition-guide strong { font-size: .9rem; color: var(--text); }.composition-guide p { margin: 5px 0 0; color: var(--text-muted); font-size: .82rem; line-height: 1.6; }
.signal-legend { grid-column: 2; display: flex; flex-wrap: wrap; gap: 8px 13px; margin-top: 1px; font-size: .73rem; color: var(--text-muted); }.signal-legend i { font-size: .6rem; }.legend-green i { color: #10b981; }.legend-yellow i { color: #eab308; }.legend-red i { color: #ef4444; }
.term-help-button { display: inline; padding: 0; color:var(--primary); border: 0; border-bottom: 1px dashed currentColor; background: transparent; font: inherit; font-weight: 700; cursor: pointer; }.term-help-button:hover, .term-help-button:focus-visible { color: #1e40af; outline: none; }.term-help-button:focus-visible { border-radius: 2px; box-shadow: 0 0 0 3px #bfdbfe; }.term-help-button i { font-size: .78em; }
.covariance-modal-backdrop { position: fixed; z-index: 1300; inset: 0; display: grid; place-items: center; padding: 16px; background: rgba(15,23,42,.58); backdrop-filter: blur(3px); }.covariance-modal-backdrop[hidden] { display: none; }.covariance-modal { width: min(1100px,100%); max-height: min(920px,calc(100vh - 32px)); overflow: auto; border: 1px solid var(--border); border-radius: 16px; background:var(--surface); box-shadow: 0 24px 70px rgba(15,23,42,.32); outline: none; }.covariance-modal-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding: 25px 30px 20px; border-bottom: 1px solid #e2e8f0; }.covariance-modal-header > div { display: flex; align-items: center; gap: 13px; }.covariance-modal-icon { display: grid; flex: 0 0 auto; place-items: center; width: 48px; height: 48px; border-radius: 11px; color: #fff; background: linear-gradient(135deg,#2563eb,#0f766e); }.covariance-kicker { margin: 0 0 3px !important; color:var(--primary) !important; font-size: .76rem !important; font-weight: 750; letter-spacing: .03em; }.covariance-modal h2 { margin: 0; color:var(--text); font-size: clamp(1.25rem,2vw,1.55rem); }.covariance-modal-header p { margin: 4px 0 0; color:var(--text-muted); font-size: .86rem; line-height: 1.45; }.covariance-modal-close { display: grid; flex: 0 0 auto; place-items: center; width: 38px; height: 38px; border-radius: 9px; color:var(--text-muted); font-size: 1.1rem; }.covariance-modal-close:hover, .covariance-modal-close:focus-visible { color:var(--text); background:var(--surface-soft); }.covariance-modal-body { padding: 25px 30px 30px; }.covariance-plain-language { margin-bottom: 18px; padding: 14px 16px; border: 1px solid rgba(56,189,248,.3); border-radius: 10px; background:rgba(56,189,248,.08); }.covariance-plain-language span { color:var(--primary); font-size: .78rem; font-weight: 750; }.covariance-plain-language span i { margin-right: 4px; }.covariance-plain-language p { margin: 6px 0 0; color:var(--text); font-size: .86rem; line-height: 1.65; }.covariance-intro { margin: 0; color:var(--text); font-size: .92rem; line-height: 1.7; }.covariance-sign-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 10px; margin: 16px 0; }.covariance-sign-grid div { display: grid; grid-template-columns: auto 1fr; gap: 3px 7px; padding: 12px; border: 1px solid var(--border); border-radius: 9px; background:var(--surface); }.covariance-sign-grid i { grid-row: span 2; padding-top: 2px; color:var(--primary); }.covariance-sign-grid b { color:var(--text); font-size: .82rem; }.covariance-sign-grid span { color:var(--text-muted); font-size: .75rem; line-height: 1.45; }.covariance-formula { margin: 17px 0 13px; padding: 15px; overflow-x: auto; border-radius: 10px; color:var(--primary); background:rgba(56,189,248,.1); font-family: ui-monospace,SFMono-Regular,Menlo,monospace; font-size: clamp(.83rem,2vw,1rem); text-align: center; white-space: nowrap; }.covariance-formula span { font-weight: 750; }.covariance-meaning { margin: 0; padding-left: 20px; color:var(--text-muted); font-size: .84rem; line-height: 1.7; }.covariance-mini-example { margin-top: 15px; padding: 14px 16px; border-radius: 10px; background:var(--primary-light); }.covariance-mini-example h3 { margin: 0; color: #92400e; font-size: .88rem; }.covariance-mini-example h3 i { margin-right: 5px; }.covariance-mini-example p { margin: 7px 0 0; color:var(--text-muted); font-size: .82rem; line-height: 1.65; }.covariance-example { margin-top: 18px; padding: 14px 16px; border-left: 4px solid #14b8a6; border-radius: 0 9px 9px 0; background:var(--green-bg); }.covariance-example h3, .covariance-code-head h3 { margin: 0; color:var(--text); font-size: .91rem; }.covariance-example h3 i { margin-right: 5px; color: #0d9488; }.covariance-example p { margin: 7px 0 0; color:var(--text); font-size: .84rem; line-height: 1.65; }.covariance-code-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 20px; }.covariance-code-head h3 i { margin-right: 5px; color: #3776ab; }.covariance-code-head span { color:var(--text-muted); font-size: .72rem; }.covariance-code { margin: 9px 0 0; padding: 15px; overflow: auto; border-radius: 10px; color: #e2e8f0; background: #0f172a; font: .76rem/1.6 ui-monospace,SFMono-Regular,Menlo,monospace; }.covariance-note { margin: 15px 0 0; color:var(--text-muted); font-size: .77rem; line-height: 1.55; }.covariance-note i { margin-right: 4px; color:var(--primary); }
.combination-card { padding: 22px; border: 1px solid var(--border); border-radius: 12px; background: var(--surface); box-shadow: var(--shadow-sm); }
.covariance-code-explanation { margin: 11px 0 0; color:var(--text); font-size: .8rem; line-height: 1.6; }.covariance-code-explanation code { padding: 1px 4px; border-radius: 4px; color:var(--primary); background:rgba(56,189,248,.1); font: .75rem ui-monospace,SFMono-Regular,Menlo,monospace; }
.correlation-modal-backdrop { position: fixed; z-index: 1300; inset: 0; display: grid; place-items: center; padding: 16px; background: rgba(15,23,42,.58); backdrop-filter: blur(3px); }.correlation-modal-backdrop[hidden] { display: none; }.correlation-modal { width: min(1100px,100%); max-height: min(920px,calc(100vh - 32px)); overflow: auto; border: 1px solid var(--border); border-radius: 16px; background:var(--surface); box-shadow: 0 24px 70px rgba(15,23,42,.32); outline: none; }.correlation-modal-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding: 25px 30px 20px; border-bottom: 1px solid #e2e8f0; }.correlation-modal-header > div { display: flex; align-items: center; gap: 13px; }.correlation-modal-icon { display: grid; flex: 0 0 auto; place-items: center; width: 48px; height: 48px; border-radius: 11px; color: #fff; background: linear-gradient(135deg,#7c3aed,#2563eb); }.correlation-kicker { margin: 0 0 3px !important; color:var(--primary) !important; font-size: .76rem !important; font-weight: 750; letter-spacing: .03em; }.correlation-modal h2 { margin: 0; color:var(--text); font-size: clamp(1.25rem,2vw,1.55rem); }.correlation-modal-header p { margin: 4px 0 0; color:var(--text-muted); font-size: .86rem; line-height: 1.45; }.correlation-modal-close { display: grid; flex: 0 0 auto; place-items: center; width: 38px; height: 38px; border-radius: 9px; color:var(--text-muted); font-size: 1.1rem; }.correlation-modal-close:hover, .correlation-modal-close:focus-visible { color:var(--text); background:var(--surface-soft); }.correlation-modal-body { padding: 25px 30px 30px; }.correlation-plain-language { padding: 14px 16px; border: 1px solid rgba(168,85,247,.3); border-radius: 10px; background:rgba(168,85,247,.08); }.correlation-plain-language span { color:var(--primary); font-size: .78rem; font-weight: 750; }.correlation-plain-language span i { margin-right: 4px; }.correlation-plain-language p { margin: 6px 0 0; color:var(--text); font-size: .86rem; line-height: 1.65; }.correlation-scale { display: grid; grid-template-columns: repeat(3,1fr); gap: 2px; margin: 16px 0; overflow: hidden; border-radius: 10px; color: #fff; text-align: center; }.correlation-scale div { display: grid; gap: 2px; padding: 13px; }.correlation-scale b { font-size: 1.05rem; }.correlation-scale span { font-size: .74rem; }.correlation-scale .negative { background: #2563eb; }.correlation-scale .neutral { background: #64748b; }.correlation-scale .positive { background: #e11d48; }.correlation-intro { margin: 0; color:var(--text); font-size: .92rem; line-height: 1.7; }.correlation-formula { margin: 17px 0 13px; padding: 15px; overflow-x: auto; border-radius: 10px; color:var(--primary); background:rgba(168,85,247,.1); font-family: ui-monospace,SFMono-Regular,Menlo,monospace; font-size: clamp(.83rem,2vw,1rem); text-align: center; white-space: nowrap; }.correlation-formula span { font-weight: 750; }.correlation-meaning { margin: 0; padding-left: 20px; color:var(--text-muted); font-size: .84rem; line-height: 1.7; }.correlation-example { margin-top: 18px; padding: 14px 16px; border-left: 4px solid #f59e0b; border-radius: 0 9px 9px 0; background:var(--primary-light); }.correlation-example h3, .correlation-code-head h3 { margin: 0; color:var(--text); font-size: .91rem; }.correlation-example h3 i { margin-right: 5px; color: #d97706; }.correlation-example p { margin: 7px 0 0; color:var(--text); font-size: .84rem; line-height: 1.65; }.correlation-code-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 20px; }.correlation-code-head h3 i { margin-right: 5px; color: #3776ab; }.correlation-code-head span { color:var(--text-muted); font-size: .72rem; }.correlation-code { margin: 9px 0 0; padding: 15px; overflow: auto; border-radius: 10px; color: #e2e8f0; background: #0f172a; font: .76rem/1.6 ui-monospace,SFMono-Regular,Menlo,monospace; }.correlation-code-explanation { margin: 11px 0 0; color:var(--text); font-size: .8rem; line-height: 1.6; }.correlation-code-explanation code { padding: 1px 4px; border-radius: 4px; color:var(--primary); background:rgba(168,85,247,.1); font: .75rem ui-monospace,SFMono-Regular,Menlo,monospace; }.correlation-note { margin: 15px 0 0; color:var(--text-muted); font-size: .77rem; line-height: 1.55; }.correlation-note i { margin-right: 4px; color:var(--primary); }
.combination-form { display: grid; grid-template-columns: minmax(160px,1fr) 28px minmax(160px,1fr) minmax(150px,.72fr); align-items: end; gap: 14px; }
.combination-form label { display: grid; gap: 7px; font-size: .82rem; color: var(--text-muted); font-weight: 700; }
.combination-form .param-input { width: 100%; background:var(--surface); }
.combination-plus { display: flex; align-items: center; justify-content: center; height: 42px; color: var(--primary); font-size: .85rem; }
.combination-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 13px; margin-top: 18px; }
.combination-examples { display: flex; gap: 7px; flex-wrap: wrap; color: var(--text-subtle); font-size: .75rem; }
.combination-examples button { color: var(--primary); border: 1px solid rgba(56,189,248,.3); background: var(--primary-light); border-radius: 99px; padding: 5px 9px; font-size: .73rem; }
.combination-examples button:hover { background:var(--primary-light); }
.combination-help { margin: 15px 0 0; color: var(--text-subtle); font-size: .76rem; }
.combination-result { margin-top: 20px; }
.combination-empty, .combination-loading { min-height: 180px; display: grid; place-content: center; gap: 10px; text-align: center; color: var(--text-subtle); border: 1px dashed var(--border-strong); border-radius: 12px; background: var(--surface-soft); font-size: .9rem; }
.combination-empty i { font-size: 1.8rem; color: #f59e0b; }
.combination-empty p { margin: 0; }
.signal-card { display: flex; align-items: center; gap: 20px; padding: 24px; border: 1px solid; border-radius: 12px; }
.signal-card.is-green { color: #047857; border-color: #86efac; background: var(--green-bg); }
.signal-card.is-yellow { color: #a16207; border-color: #fde68a; background: var(--yellow-bg); }
.signal-card.is-red { color: #b91c1c; border-color: rgba(255,59,92,.35); background: var(--red-bg); }
.signal-light { display: grid; place-items: center; flex: 0 0 58px; width: 58px; height: 58px; border-radius: 50%; color: #fff; font-size: 1.75rem; }
.is-green .signal-light { background: #10b981; }.is-yellow .signal-light { background: #eab308; }.is-red .signal-light { background: #ef4444; }
.signal-copy p { margin: 0; }.signal-eyebrow { font-weight: 700; font-size: .78rem; opacity: .78; }.signal-copy h2 { margin: 3px 0 7px; font-size: 1.15rem; }.signal-copy > p:last-child { color: var(--text); font-size: .9rem; line-height: 1.55; }
.combination-chart-card { margin-top: 14px; padding: 19px; border: 1px solid var(--border); border-radius: 10px; background: var(--surface); }.combination-chart-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; }.combination-chart-head h3 { margin: 0 0 5px; font-size: .94rem; }.combination-chart-head h3 i { color: var(--primary); }.combination-chart-head p { margin: 0; color: var(--text-muted); font-size: .8rem; line-height: 1.5; }.chart-legend { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 10px; flex-shrink: 0; color: var(--text-muted); font-size: .75rem; }.chart-legend span { display: inline-flex; align-items: center; gap: 5px; }.chart-legend i { display: inline-block; width: 17px; height: 3px; border-radius: 2px; }.line-a i { background: #0078d4; }.line-b i { background: #f97316; }.flow-chart-wrap { margin-top: 17px; height: 218px; padding: 7px 0 0; }.flow-chart-wrap svg { display: block; width: 100%; height: 190px; overflow: visible; }.flow-grid { stroke: #dbe3ed; stroke-width: 1; stroke-dasharray: 4 4; }.flow-line { fill: none; stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; }.flow-line-a { stroke: #0078d4; }.flow-line-b { stroke: #f97316; }.flow-chart-dates { display: flex; justify-content: space-between; padding: 7px 3px 0; color: var(--text-subtle); font-size: .69rem; }.chart-why { margin: 10px 0 0; padding: 11px 12px; border-radius: 7px; background: var(--surface-soft); color: var(--text-muted); font-size: .81rem; line-height: 1.6; }.chart-why i { color: #eab308; }.chart-why b { color: var(--text); }
.combination-detail-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin-top: 14px; }
.combination-detail-card { padding: 18px; border: 1px solid var(--border); border-radius: 10px; background: var(--surface); }.combination-detail-card h3 { margin: 0 0 9px; font-size: .9rem; }.combination-detail-card h3 i { color: var(--primary); }.combination-detail-card p { margin: 0 0 12px; font-size: .86rem; color: var(--text-muted); line-height: 1.55; }.combination-detail-card small { color: var(--text-subtle); font-size: .72rem; line-height: 1.45; }.combination-error { margin: 0; padding: 16px; border: 1px solid rgba(255,59,92,.35); border-radius: 10px; color: var(--red); background: var(--red-bg); font-size: .86rem; }
@media (max-width: 760px) { .composition-guide { grid-template-columns: auto minmax(0, 1fr); }.signal-legend { grid-column: 1 / -1; }.covariance-modal-backdrop { padding: 10px; }.covariance-modal { max-height: calc(100vh - 20px); border-radius: 12px; }.covariance-modal-header, .covariance-modal-body { padding: 17px; }.covariance-modal-icon { width: 38px; height: 38px; }.covariance-code-head { align-items: flex-start; flex-direction: column; }.combination-form { grid-template-columns: 1fr; }.combination-plus { height: auto; transform: rotate(90deg); }.combination-detail-grid { grid-template-columns: 1fr; }.signal-card { align-items: flex-start; padding: 18px; }.signal-light { flex-basis: 46px; width: 46px; height: 46px; font-size: 1.35rem; }.combination-chart-head { display: block; }.chart-legend { justify-content: flex-start; margin-top: 10px; }.flow-chart-wrap { height: 178px; }.flow-chart-wrap svg { height: 150px; } }
@media (max-width: 560px) { .covariance-sign-grid { grid-template-columns: 1fr; }.covariance-modal-header > div { align-items: flex-start; }.covariance-modal-header p { font-size: .8rem; } }
@media (max-width: 760px) { .correlation-modal-backdrop { padding: 10px; }.correlation-modal { max-height: calc(100vh - 20px); border-radius: 12px; }.correlation-modal-header, .correlation-modal-body { padding: 17px; }.correlation-modal-icon { width: 38px; height: 38px; }.correlation-code-head { align-items: flex-start; flex-direction: column; } }
@media (max-width: 560px) { .correlation-modal-header > div { align-items: flex-start; }.correlation-modal-header p { font-size: .8rem; } }

/* ── 포트폴리오 추천 ── */
.portfolio-guide-explainer { display: flex; gap: 13px; margin-bottom: 18px; padding: 16px 18px; color:var(--text); border: 1px solid rgba(56,189,248,.3); border-radius: 12px; background:rgba(56,189,248,.08); }.portfolio-guide-explainer > i { display: grid; place-items: center; flex: 0 0 34px; width: 34px; height: 34px; color: var(--primary); border-radius: 50%; background:var(--primary-light); }.portfolio-guide-explainer strong { font-size: .9rem; }.portfolio-guide-explainer p { margin: 5px 0 0; color: var(--text-muted); font-size: .82rem; line-height: 1.6; }
.sharpe-help-button { margin-top: 10px; padding: 5px 9px; color:var(--primary); border: 1px solid rgba(168,85,247,.3); border-radius: 99px; background:rgba(168,85,247,.08); font-size: .76rem; font-weight: 700; cursor: pointer; }.sharpe-help-button:hover, .sharpe-help-button:focus-visible { color:var(--primary); border-color: rgba(168,85,247,.4); background: #f3e8ff; outline: none; }.sharpe-help-button:focus-visible { box-shadow: 0 0 0 3px #ddd6fe; }.sharpe-help-button i { margin-right: 3px; }
.sharpe-modal-backdrop { position: fixed; z-index: 1300; inset: 0; display: grid; place-items: center; padding: 16px; background: rgba(15,23,42,.58); backdrop-filter: blur(3px); }.sharpe-modal-backdrop[hidden] { display: none; }.sharpe-modal { width: min(1040px,100%); max-height: min(900px,calc(100vh - 32px)); overflow: auto; border: 1px solid var(--border); border-radius: 16px; background:var(--surface); box-shadow: 0 24px 70px rgba(15,23,42,.32); outline: none; }.sharpe-modal-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding: 25px 30px 20px; border-bottom: 1px solid #e2e8f0; }.sharpe-modal-header > div { display: flex; align-items: center; gap: 13px; }.sharpe-modal-icon { display: grid; flex: 0 0 auto; place-items: center; width: 48px; height: 48px; border-radius: 11px; color: #fff; background: linear-gradient(135deg,#7c3aed,#db2777); }.sharpe-kicker { margin: 0 0 3px !important; color:var(--primary) !important; font-size: .76rem !important; font-weight: 750; letter-spacing: .03em; }.sharpe-modal h2 { margin: 0; color:var(--text); font-size: clamp(1.25rem,2vw,1.55rem); }.sharpe-modal-header p { margin: 4px 0 0; color:var(--text-muted); font-size: .86rem; line-height: 1.45; }.sharpe-modal-close { display: grid; flex: 0 0 auto; place-items: center; width: 38px; height: 38px; border-radius: 9px; color:var(--text-muted); font-size: 1.1rem; }.sharpe-modal-close:hover, .sharpe-modal-close:focus-visible { color:var(--text); background:var(--surface-soft); }.sharpe-modal-body { padding: 25px 30px 30px; }.sharpe-plain-language { padding: 14px 16px; border: 1px solid rgba(168,85,247,.3); border-radius: 10px; background:rgba(168,85,247,.08); }.sharpe-plain-language span { color:var(--primary); font-size: .78rem; font-weight: 750; }.sharpe-plain-language span i { margin-right: 4px; }.sharpe-plain-language p { margin: 6px 0 0; color:var(--text); font-size: .86rem; line-height: 1.65; }.sharpe-formula { margin: 17px 0 13px; padding: 15px; overflow-x: auto; border-radius: 10px; color:var(--primary); background:rgba(168,85,247,.1); font-family: ui-monospace,SFMono-Regular,Menlo,monospace; font-size: clamp(.8rem,2vw,1rem); text-align: center; white-space: nowrap; }.sharpe-formula span { font-weight: 750; }.sharpe-parts { display: grid; grid-template-columns: repeat(3,1fr); gap: 10px; }.sharpe-parts div { padding: 12px; border: 1px solid var(--border); border-radius: 9px; }.sharpe-parts b { display: block; color:var(--text); font-size: .82rem; }.sharpe-parts span { display: block; margin-top: 4px; color:var(--text-muted); font-size: .75rem; line-height: 1.45; }.sharpe-example { margin-top: 17px; padding: 14px 16px; border-left: 4px solid #f59e0b; border-radius: 0 9px 9px 0; background:var(--primary-light); }.sharpe-example h3, .sharpe-code-head h3 { margin: 0; color:var(--text); font-size: .91rem; }.sharpe-example h3 i { margin-right: 5px; color: #d97706; }.sharpe-example p { margin: 7px 0 0; color:var(--text-muted); font-size: .84rem; line-height: 1.65; }.sharpe-caution { display: flex; gap: 9px; margin-top: 16px; padding: 13px 15px; border-radius: 9px; color:var(--primary); background:rgba(56,189,248,.1); }.sharpe-caution i { margin-top: 2px; color:var(--primary); }.sharpe-caution p { margin: 0; font-size: .82rem; line-height: 1.6; }.sharpe-code-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 20px; }.sharpe-code-head h3 i { margin-right: 5px; color: #3776ab; }.sharpe-code-head span { color:var(--text-muted); font-size: .72rem; }.sharpe-code { margin: 9px 0 0; padding: 15px; overflow: auto; border-radius: 10px; color: #e2e8f0; background: #0f172a; font: .76rem/1.6 ui-monospace,SFMono-Regular,Menlo,monospace; }.sharpe-note { margin: 15px 0 0; color:var(--text-muted); font-size: .77rem; line-height: 1.55; }.sharpe-note i { margin-right: 4px; color:var(--primary); }
.portfolio-guide-layout { display: grid; grid-template-columns: minmax(260px, .7fr) minmax(0, 1.3fr); gap: 16px; align-items: start; }.portfolio-guide-form, .portfolio-guide-result, .portfolio-guide-check { padding: 20px; border: 1px solid var(--border); border-radius: 12px; background: var(--surface); box-shadow: var(--shadow-sm); }.portfolio-guide-form h2 { margin: 0 0 17px; font-size: .98rem; }.portfolio-guide-form label { display: grid; gap: 7px; margin: 0 0 14px; color: var(--text-muted); font-size: .8rem; font-weight: 750; }.portfolio-guide-form .param-input { width: 100%; background:var(--surface); }.portfolio-guide-form .run-btn { width: 100%; margin-top: 3px; }
.portfolio-guide-result-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }.portfolio-guide-result-head p { margin: 0; color: var(--text-subtle); font-size: .72rem; font-weight: 700; }.portfolio-guide-result-head h2 { margin: 4px 0 0; color: var(--text); font-size: 1.12rem; }.portfolio-guide-result-head h2 span { margin-left: 5px; font-size: .75rem; }.portfolio-guide-result-head > i { font-size: 1.6rem; }.portfolio-guide-intro { margin: 14px 0; color: var(--text-muted); font-size: .84rem; line-height: 1.62; }.guide-allocation-bar { display: flex; height: 19px; overflow: hidden; border-radius: 99px; background: var(--surface-soft); }.guide-allocation-bar span { min-width: 3px; border-right: 2px solid #fff; }.guide-allocation-bar span:last-child { border: 0; }.guide-allocation-list { display: grid; gap: 9px; padding: 0; margin: 16px 0; list-style: none; }.guide-allocation-list li { display: grid; grid-template-columns: 10px minmax(0, 1fr) auto; align-items: center; gap: 9px; }.guide-dot { width: 9px; height: 9px; border-radius: 50%; }.guide-allocation-list b { display: block; color: var(--text); font-size: .82rem; }.guide-allocation-list small { display: block; margin-top: 2px; color: var(--text-subtle); font-size: .69rem; }.guide-allocation-list strong { color: var(--text); font-size: .8rem; }.portfolio-guide-note { display: flex; gap: 8px; padding: 11px; color: var(--text-muted); border-radius: 8px; background: var(--surface-soft); font-size: .74rem; line-height: 1.5; }.portfolio-guide-note i { margin-top: 2px; color: #f59e0b; }.portfolio-guide-note b { color: var(--text); }
.portfolio-guide-check { margin-top: 16px; }.portfolio-guide-check h2 { margin: 0 0 14px; font-size: .92rem; }.portfolio-guide-check h2 i { color: var(--primary); }.portfolio-guide-check > div { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }.portfolio-guide-check p { margin: 0; }.portfolio-guide-check b { display: block; color: var(--text); font-size: .8rem; }.portfolio-guide-check span { display: block; margin-top: 5px; color: var(--text-muted); font-size: .74rem; line-height: 1.5; }.portfolio-guide-disclaimer { margin: 12px 2px 0; color: var(--text-subtle); font-size: .7rem; line-height: 1.5; }
@media (max-width: 760px) { .portfolio-guide-layout { grid-template-columns: 1fr; }.portfolio-guide-check > div { grid-template-columns: 1fr; gap: 12px; }.portfolio-guide-explainer { padding: 14px; } }
@media (max-width: 760px) { .sharpe-modal-backdrop { padding: 10px; }.sharpe-modal { max-height: calc(100vh - 20px); border-radius: 12px; }.sharpe-modal-header, .sharpe-modal-body { padding: 17px; }.sharpe-modal-icon { width: 38px; height: 38px; }.sharpe-code-head { align-items: flex-start; flex-direction: column; }.sharpe-parts { grid-template-columns: 1fr; } }

/* ── 포트폴리오 시뮬레이션 ── */
.simulation-explainer { display: flex; gap: 13px; margin-bottom: 18px; padding: 16px 18px; color:var(--text); border: 1px solid rgba(99,102,241,.3); border-radius: 12px; background:rgba(99,102,241,.08); }.simulation-explainer > i { display: grid; place-items: center; flex: 0 0 34px; width: 34px; height: 34px; color:var(--primary); border-radius: 50%; background:rgba(99,102,241,.12); }.simulation-explainer strong { font-size: .9rem; }.simulation-explainer p { margin: 5px 0 0; color: var(--text-muted); font-size: .82rem; line-height: 1.6; }
.monte-carlo-help-button { margin-top: 10px; padding: 5px 9px; color:var(--primary); border: 1px solid rgba(99,102,241,.3); border-radius: 99px; background:rgba(99,102,241,.1); font-size: .76rem; font-weight: 700; cursor: pointer; }.monte-carlo-help-button:hover, .monte-carlo-help-button:focus-visible { color:var(--text); border-color: rgba(99,102,241,.4); background:rgba(99,102,241,.12); outline: none; }.monte-carlo-help-button:focus-visible { box-shadow: 0 0 0 3px #c7d2fe; }.monte-carlo-help-button i { margin-right: 3px; }
.rag-chat-heading { display: grid; grid-template-columns: minmax(0,1fr) minmax(280px,330px); gap: 20px; align-items: start; margin-bottom: 16px; }.rag-chat-heading-copy { min-width: 0; }.rag-chat-heading-copy h2 { margin: 0 0 5px; font-size: 1.25rem; }.rag-chat-heading-copy h2 i { margin-right: 8px; color: var(--primary); }.rag-chat-heading-copy p { margin: 0; color: var(--text-muted); font-size: .87rem; line-height: 1.55; }.rag-chat-controls { display: grid; grid-template-columns: auto minmax(0,1fr); gap: 5px 8px; min-width: 0; align-items: center; }.rag-chat-controls label { color: var(--text-muted); font-size: .75rem; font-weight: 750; }.rag-chat-controls .param-input { width: 100%; min-width: 0; background:var(--surface); font-size: .8rem; }.rag-chat-controls small, .rag-chat-controls .badge { grid-column: 1 / -1; }.rag-chat-controls small { color: var(--text-subtle); font-size: .69rem; line-height: 1.4; }.rag-chat-controls .badge { justify-self: start; margin-top: 2px; }.rag-chat-layout { display: grid; grid-template-columns: minmax(0,1.7fr) minmax(260px,.62fr); gap: 16px; width: 100%; min-width: 0; align-items: stretch; }.rag-chat-panel { display: flex; min-width: 0; min-height: 540px; flex-direction: column; padding: 0; overflow: hidden; }.rag-messages { display: flex; flex: 1; min-height: 400px; max-height: 62vh; overflow: auto; flex-direction: column; gap: 14px; padding: 20px; }.rag-welcome { color: var(--text-muted); line-height: 1.6; }.rag-welcome strong { color: var(--text); }.rag-message { max-width: 92%; overflow-wrap: anywhere; padding: 11px 13px; border: 1px solid var(--border); border-radius: 12px 12px 12px 2px; background: var(--surface-alt); color: var(--text); line-height: 1.6; white-space: normal; }.rag-message.is-user { align-self: flex-end; max-width: 82%; border-color: var(--primary); border-radius: 12px 12px 2px 12px; background: var(--primary); color: #fff; }.rag-message.is-assistant { align-self: flex-start; }.rag-message.loading { align-self: flex-start; border-color: transparent; background: transparent; color: var(--text-muted); padding: 3px; }.rag-message.is-error { align-self: flex-start; border-color: var(--red); color: var(--red); }.rag-chat-compose { padding: 14px 20px; border-top: 1px solid var(--border); background: var(--surface-alt); }.rag-examples { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; }.rag-form { display: flex; gap: 8px; }.rag-form input { flex: 1; min-width: 0; padding: 11px 12px; border: 1px solid var(--border); border-radius: var(--radius-sm); background:var(--surface); font: inherit; }.rag-form input:focus { border-color: var(--primary); outline: 2px solid var(--primary-light); outline-offset: 1px; }.rag-source-panel { display: flex; min-width: 0; min-height: 540px; flex-direction: column; padding: 0; overflow: hidden; }.rag-source-title { display: flex; justify-content: space-between; gap: 10px; padding: 18px; border-bottom: 1px solid var(--border); background:rgba(56,189,248,.08); }.rag-source-title h3 { margin: 0; color: var(--text); font-size: .95rem; }.rag-source-title h3 i { margin-right: 6px; color:var(--primary); }.rag-source-title p { margin: 5px 0 0; color: var(--text-muted); font-size: .73rem; line-height: 1.45; }.rag-source-title > span { align-self: flex-start; padding: 4px 7px; border-radius: 99px; color:var(--primary); background:var(--primary-light); font-size: .69rem; font-weight: 750; white-space: nowrap; }.rag-sources { display: grid; gap: 10px; overflow: auto; padding: 14px; }.rag-source-empty { display: grid; min-height: 220px; place-content: center; gap: 10px; color: var(--text-subtle); text-align: center; font-size: .82rem; line-height: 1.55; }.rag-source-empty i { color: #93c5fd; font-size: 1.8rem; }.rag-source-empty p { max-width: 220px; margin: 0; }.rag-source-card { padding: 12px; border: 1px solid var(--border); border-radius: 9px; background: var(--surface); }.rag-source-head { display: flex; justify-content: space-between; gap: 7px; color: var(--text); font-size: .75rem; }.rag-source-head span { color: var(--text-subtle); font-size: .68rem; }.rag-source-name { margin: 6px 0 0; color:var(--primary); font-size: .71rem; font-weight: 700; overflow-wrap: anywhere; }.rag-source-text { margin: 8px 0 0; color: var(--text-muted); font-size: .78rem; line-height: 1.6; overflow-wrap: anywhere; white-space: normal; }
.monte-carlo-modal-backdrop { position: fixed; z-index: 1300; inset: 0; display: grid; place-items: center; padding: 16px; background: rgba(15,23,42,.58); backdrop-filter: blur(3px); }.monte-carlo-modal-backdrop[hidden] { display: none; }.monte-carlo-modal { width: min(1080px,100%); max-height: min(910px,calc(100vh - 32px)); overflow: auto; border: 1px solid var(--border); border-radius: 16px; background:var(--surface); box-shadow: 0 24px 70px rgba(15,23,42,.32); outline: none; }.monte-carlo-modal-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding: 25px 30px 20px; border-bottom: 1px solid #e2e8f0; }.monte-carlo-modal-header > div { display: flex; align-items: center; gap: 13px; }.monte-carlo-modal-icon { display: grid; flex: 0 0 auto; place-items: center; width: 48px; height: 48px; border-radius: 11px; color: #fff; background: linear-gradient(135deg,#4f46e5,#0ea5e9); }.monte-carlo-kicker { margin: 0 0 3px !important; color:var(--primary) !important; font-size: .76rem !important; font-weight: 750; letter-spacing: .03em; }.monte-carlo-modal h2 { margin: 0; color:var(--text); font-size: clamp(1.25rem,2vw,1.55rem); }.monte-carlo-modal-header p { margin: 4px 0 0; color:var(--text-muted); font-size: .86rem; line-height: 1.45; }.monte-carlo-modal-close { display: grid; flex: 0 0 auto; place-items: center; width: 38px; height: 38px; border-radius: 9px; color:var(--text-muted); font-size: 1.1rem; }.monte-carlo-modal-close:hover, .monte-carlo-modal-close:focus-visible { color:var(--text); background:var(--surface-soft); }.monte-carlo-modal-body { padding: 25px 30px 30px; }.monte-carlo-plain-language { padding: 14px 16px; border: 1px solid rgba(99,102,241,.3); border-radius: 10px; background:rgba(99,102,241,.08); }.monte-carlo-plain-language span { color:var(--primary); font-size: .78rem; font-weight: 750; }.monte-carlo-plain-language span i { margin-right: 4px; }.monte-carlo-plain-language p { margin: 6px 0 0; color:var(--text); font-size: .86rem; line-height: 1.65; }.monte-carlo-steps { display: grid; grid-template-columns: repeat(3,1fr); gap: 10px; margin: 17px 0; }.monte-carlo-steps div { display: grid; grid-template-columns: 28px 1fr; gap: 3px 8px; padding: 12px; border: 1px solid var(--border); border-radius: 9px; }.monte-carlo-steps b { display: grid; grid-row: span 2; place-items: center; width: 25px; height: 25px; color: #fff; border-radius: 50%; background: #6366f1; font-size: .75rem; }.monte-carlo-steps strong { color:var(--text); font-size: .82rem; }.monte-carlo-steps span { color:var(--text-muted); font-size: .74rem; line-height: 1.45; }.monte-carlo-example { padding: 14px 16px; border-left: 4px solid #14b8a6; border-radius: 0 9px 9px 0; background:var(--green-bg); }.monte-carlo-example h3, .monte-carlo-code-head h3 { margin: 0; color:var(--text); font-size: .91rem; }.monte-carlo-example h3 i { margin-right: 5px; color: #0d9488; }.monte-carlo-example p { margin: 7px 0 0; color:var(--text); font-size: .84rem; line-height: 1.65; }.monte-carlo-code-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 20px; }.monte-carlo-code-head h3 i { margin-right: 5px; color: #3776ab; }.monte-carlo-code-head span { color:var(--text-muted); font-size: .72rem; }.monte-carlo-code { margin: 9px 0 0; padding: 15px; overflow: auto; border-radius: 10px; color: #e2e8f0; background: #0f172a; font: .76rem/1.6 ui-monospace,SFMono-Regular,Menlo,monospace; }.monte-carlo-note { margin: 15px 0 0; color:var(--text-muted); font-size: .77rem; line-height: 1.55; }.monte-carlo-note i { margin-right: 4px; color:var(--primary); }
.simulation-steps { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 11px; }.simulation-steps span { display: inline-flex; align-items: center; gap: 5px; padding: 5px 8px; color:var(--primary); border-radius: 99px; background:rgba(99,102,241,.1); font-size: .7rem; }.simulation-steps b { display: grid; place-items: center; width: 16px; height: 16px; color: #fff; border-radius: 50%; background: #6366f1; font-size: .62rem; }
.simulation-layout { display: grid; grid-template-columns: minmax(250px, .65fr) minmax(0, 1.35fr); gap: 16px; align-items: start; }.simulation-form, .scenario-result { padding: 20px; border: 1px solid var(--border); border-radius: 12px; background: var(--surface); box-shadow: var(--shadow-sm); }.simulation-form h2 { margin: 0 0 17px; font-size: .98rem; }.simulation-form label { display: grid; gap: 7px; margin: 0 0 14px; color: var(--text-muted); font-size: .8rem; font-weight: 750; }.simulation-form .param-input { width: 100%; background:var(--surface); }.simulation-form .run-btn { width: 100%; margin-top: 3px; }.simulation-empty, .simulation-loading { min-height: 320px; display: grid; place-content: center; gap: 10px; text-align: center; color: var(--text-subtle); border: 1px dashed var(--border-strong); border-radius: 12px; background: var(--surface-soft); font-size: .86rem; }.simulation-empty i { color: #6366f1; font-size: 1.8rem; }.simulation-empty p { margin: 0; }
.scenario-result-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }.scenario-result-head p { margin: 0; color: var(--text-subtle); font-size: .72rem; font-weight: 700; }.scenario-result-head h2 { margin: 4px 0 0; color: var(--text); font-size: 1.05rem; }.scenario-result-head > i { color: #6366f1; font-size: 1.55rem; }.scenario-intro { margin: 13px 0; color: var(--text-muted); font-size: .8rem; line-height: 1.55; }.scenario-legend { display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: 5px; color: var(--text-muted); font-size: .72rem; }.scenario-legend span::before { content: ''; display: inline-block; width: 15px; height: 3px; margin-right: 5px; border-radius: 2px; vertical-align: middle; }.scenario-legend .is-cautious::before { background: #ef4444; }.scenario-legend .is-middle::before { background: #4f46e5; }.scenario-legend .is-positive::before { background: #10b981; }.scenario-chart-wrap { height: 200px; }.scenario-chart-wrap svg { display: block; width: 100%; height: 175px; }.scenario-area { fill: rgba(99, 102, 241, .12); }.scenario-grid { stroke: #dbe3ed; stroke-dasharray: 4 4; }.scenario-line { fill: none; stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; }.scenario-line.is-cautious { stroke: #ef4444; }.scenario-line.is-middle { stroke: #4f46e5; }.scenario-line.is-positive { stroke: #10b981; }.scenario-years { display: flex; justify-content: space-between; padding: 4px 2px 0; color: var(--text-subtle); font-size: .69rem; }.scenario-summary { display: grid; grid-template-columns: repeat(3, 1fr); gap: 9px; margin-top: 10px; }.scenario-summary article { padding: 11px; border: 1px solid var(--border); border-radius: 8px; background: var(--surface-soft); }.scenario-summary article.is-main { border-color: rgba(99,102,241,.3); background: #f5f7ff; }.scenario-summary span, .scenario-summary small { display: block; color: var(--text-subtle); font-size: .67rem; }.scenario-summary strong { display: block; margin: 5px 0; color: var(--text); font-size: .86rem; }.scenario-summary small { line-height: 1.45; }.scenario-paid { margin: 13px 0 0; color: var(--text-muted); font-size: .76rem; text-align: right; }.scenario-paid b { color: var(--text); }.simulation-disclaimer { margin: 12px 2px 0; color: var(--text-subtle); font-size: .7rem; line-height: 1.5; }
@media (max-width: 760px) { .simulation-layout { grid-template-columns: 1fr; }.simulation-explainer { padding: 14px; }.scenario-summary { grid-template-columns: 1fr; }.scenario-chart-wrap { height: 170px; }.scenario-chart-wrap svg { height: 145px; } }
@media (max-width: 1080px) { .rag-chat-heading { grid-template-columns: 1fr; }.rag-chat-controls { width: 100%; max-width: 500px; }.rag-chat-layout { grid-template-columns: minmax(0,1fr) minmax(250px,.55fr); } }
@media (max-width: 860px) { .rag-chat-layout { grid-template-columns: 1fr; }.rag-chat-panel, .rag-source-panel { min-height: auto; }.rag-source-panel { max-height: 440px; }.rag-messages { min-height: 360px; max-height: 52vh; } }
@media (max-width: 760px) { .monte-carlo-modal-backdrop { padding: 10px; }.monte-carlo-modal { max-height: calc(100vh - 20px); border-radius: 12px; }.monte-carlo-modal-header, .monte-carlo-modal-body { padding: 17px; }.monte-carlo-modal-icon { width: 38px; height: 38px; }.monte-carlo-code-head { align-items: flex-start; flex-direction: column; }.monte-carlo-steps { grid-template-columns: 1fr; } }.monte-carlo-modal-header > div { align-items: flex-start; }
.dart-help {
  margin-top: 10px;
  font-size: .88rem;
  color: var(--text-muted);
  line-height: 1.65;
}
/* RAG는 답변을 우선 보여 주고, 검색 근거는 사용자가 필요할 때만 펼친다. */
.rag-answer-layout { grid-template-columns: minmax(0, 1fr); }
.rag-source-panel { min-height: 0; margin-top: 16px; }
.rag-source-panel > summary { list-style: none; cursor: pointer; }
.rag-source-panel > summary::-webkit-details-marker { display: none; }
.rag-source-panel > summary::after { align-self: center; color: var(--text-muted); content: '⌄'; font-size: 1.1rem; }
.rag-source-panel[open] > summary::after { transform: rotate(180deg); }
.rag-source-panel:not([open]) > .rag-sources { display: none; }

 .dart-result-summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 14px;
  font-size: .9rem;
}
.dart-result-summary span {
  font-size: .85rem;
  color: var(--text-muted);
  background: var(--surface-soft);
  border: 1px solid var(--border);
  border-radius: 99px;
  padding: 2px 10px;
}
.dart-result-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 12px;
  margin-bottom: 16px;
}
.dart-result-card {
  background: var(--surface-soft);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  padding: 14px 16px;
  transition: border-color .15s;
}
.dart-result-card:hover { border-color: var(--primary); }
.dart-result-title {
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--text);
  margin-bottom: 4px;
}
.dart-ticker {
  font-size: .88rem;
  color: var(--primary);
  font-weight: 600;
  margin-bottom: 10px;
}
.dart-result-card dl { margin: 0 0 12px; display: grid; gap: 4px; }
.dart-result-card dl > div {
  display: flex; justify-content: space-between; align-items: center;
  font-size: .88rem;
}
.dart-result-card dt { color: var(--text-muted); }
.dart-result-card dd {
  margin: 0; font-weight: 600;
  font-family: "Fira Code", "Cascadia Code", monospace;
}
.dart-copy-row { display: flex; gap: 6px; flex-wrap: wrap; }
.copy-btn {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 4px 10px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  font-size: .72rem; font-weight: 600; color: var(--text-muted);
  cursor: pointer; transition: all .15s;
}
.copy-btn:hover { border-color: var(--primary); color: var(--primary); background: var(--primary-light); }
.dart-notes {
  font-size: .76rem;
  color: var(--text-muted);
  line-height: 1.65;
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid var(--border);
}
.dart-notes p { margin: 2px 0; }
.dart-error {
  background: var(--red-bg);
  border: 1px solid #fca5a5;
  border-radius: var(--radius-sm);
  padding: 14px 16px;
  color: var(--red);
}
.dart-error p { margin: 4px 0; font-size: .85rem; color: var(--text-muted); }
.dart-table {
  width: 100%;
  border-collapse: collapse;
  font-size: .82rem;
}
.dart-table th {
  background: var(--primary);
  color: #ffffff;
  font-weight: 700;
  padding: 8px 12px;
  text-align: left;
  border: 1px solid var(--primary-dark);
  white-space: nowrap;
  font-size: 1rem;
}
.dart-table td {
  padding: 7px 12px;
  border: 1px solid var(--border);
  vertical-align: top;
  font-size: 1rem;
}
.dart-table tr:nth-child(even) td { background: var(--surface-soft); }
.dart-table tr:hover td { background: var(--primary-light); }
.mono {
  font-family: "Fira Code", "Cascadia Code", monospace;
  font-size: .85em;
  letter-spacing: .02em;
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE
═══════════════════════════════════════════════════════ */
@media (min-width: 1440px) {
  :root {
    --topbar-h:   62px;
    --mainnav-h:  48px;
  }
  .content-main { padding: 32px 48px 56px; }
  .home-grid { grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); }
  .learn-body { padding: 36px 42px; }
  .grid-2 { gap: 20px; }
  .grid-3 { gap: 20px; }
  .grid-4 { gap: 18px; }
}

@media (min-width: 1920px) {
  :root {
    --topbar-h:   66px;
    --mainnav-h:  50px;
  }
  .content-main { padding: 36px 56px 64px; }
  .home-grid { grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); }
  .analysis-group { padding: 28px 36px; }
  .grid-3 { grid-template-columns: repeat(3, 1fr); }
  .grid-4 { grid-template-columns: repeat(4, 1fr); }
}

@media (max-width: 1024px) {
  /* 데스크톱 가로 메뉴바 대신, 상단바의 햄버거 버튼으로 여닫는 세로 드롭다운 패널로 전환한다. */
  .mainnav-toggle-mobile { display: inline-flex; }
  .layout { padding-top: var(--topbar-h); }
  .mainnav {
    height: auto; max-height: calc(100vh - var(--topbar-h));
    overflow-y: auto;
    box-shadow: var(--shadow-lg);
    opacity: 0; visibility: hidden; transform: translateY(-6px);
    transition: opacity .18s, transform .18s, visibility .18s;
  }
  .mainnav.open { opacity: 1; visibility: visible; transform: translateY(0); }
  .mainnav-inner { flex-direction: column; padding: 6px; overflow: visible; }
  .mainnav-group, .mainnav-group-utility { height: auto; margin-left: 0; }
  .mainnav-item {
    height: auto; width: 100%; padding: 11px 14px;
    border-bottom: none; border-left: 3px solid transparent;
    justify-content: space-between;
  }
  .mainnav-item.active { border-left-color: var(--primary); border-bottom-color: transparent; }
  .mainnav-trigger { justify-content: flex-start; gap: 9px; }
  .mainnav-trigger > span { flex: 1; text-align: left; }
  .mainnav-dropdown {
    position: static; display: none;
    min-width: 0; margin: 2px 0 4px 22px;
    padding: 2px; border: none; border-radius: 0;
    background: transparent; box-shadow: none;
    opacity: 1; visibility: visible; transform: none;
  }
  .mainnav-group.is-open > .mainnav-dropdown { display: block; }
  .mainnav-group.is-open > .mainnav-trigger .mainnav-chev { transform: rotate(180deg); }
  .mainnav-dropdown-end { right: auto; }

  .learn-toc { width: 86vw; }
  .home-sections { grid-template-columns: 1fr; }
  .grid-3 { grid-template-columns: 1fr 1fr; }
  .grid-4 { grid-template-columns: 1fr 1fr; }
  .result-stats { gap: 16px; }
}
@media (max-width: 640px) {
  .content-main { padding: 16px 14px 32px; }
  .topbar-ticker { display: none; }
  .global-search { flex:1; width:auto; min-width:0; }
  .brand-sub { display: none; }
  .grid-2, .grid-3, .grid-4 { grid-template-columns: 1fr; }
  .question-card { padding: 18px 16px; }
  .quiz-header { flex-direction: column; align-items: flex-start; }
  .home-hero { padding: 24px 20px; }
  .home-hero h1 { font-size: 1.25rem; }
  .home-grid { grid-template-columns: 1fr 1fr; }
  .analysis-group { padding: 16px; }
  .analysis-group-head { gap: 10px; }
}

.sox-semicon-button,.vix-kospi-button,.circuit-breaker-button { display:inline-flex; align-items:center; gap:7px; padding:10px 14px; border-radius:9px; font-size:.82rem; font-weight:800; }
.sox-semicon-button { color:var(--primary); background:rgba(168,85,247,.1); border:1px solid rgba(168,85,247,.3); }.sox-semicon-button:hover { color:#fff; background:#7c3aed; }
.vix-kospi-button { color:#b91c1c; background:var(--red-bg); border:1px solid rgba(255,59,92,.35); }.vix-kospi-button:hover { color:#fff; background:#dc2626; }
.circuit-breaker-button { color:#9a3412; background:rgba(240,185,11,.12); border:1px solid #fed7aa; }.circuit-breaker-button:hover { color:#fff; background:#ea580c; }

.theme-volatility-button { display:inline-flex; align-items:center; gap:7px; padding:10px 14px; color:#9a3412; background:rgba(240,185,11,.12); border:1px solid #fed7aa; border-radius:9px; font-size:.82rem; font-weight:800; }.theme-volatility-button:hover { color:#fff; background:#ea580c; }
.theme-volatility-modal-backdrop { position:fixed; z-index:1200; inset:0; display:none; place-items:center; padding:16px; background:rgba(15,23,42,.58); }.theme-volatility-modal-backdrop.show { display:grid; }
.theme-volatility-modal { width:min(1260px,97vw); max-height:96vh; overflow:auto; background:var(--surface); border-radius:16px; }.theme-volatility-modal>header { display:flex; justify-content:space-between; padding:20px 24px; border-bottom:1px solid #e2e8f0; }.theme-volatility-modal>header>div { display:flex; gap:12px; align-items:center; }.theme-volatility-modal>header span { display:grid; width:42px; height:42px; place-items:center; color:#fff; background:#ea580c; border-radius:11px; font-size:1.1rem; }.theme-volatility-modal h2 { margin:0; }.theme-volatility-modal>header p { margin:3px 0 0; color:var(--text-muted); font-size:.8rem; }.theme-volatility-modal>header>button { width:40px; height:40px; flex:0 0 auto; color:var(--text-muted); border-radius:10px; font-size:1.2rem; }
.theme-volatility-tabs { display:flex; flex-wrap:wrap; gap:8px; padding:14px 24px 0; }.theme-volatility-tabs button { display:flex; flex:1; flex-direction:column; gap:3px; padding:9px 11px; color:#9a3412; background:rgba(240,185,11,.12); border:1px solid #fed7aa; border-radius:8px; text-align:left; }.theme-volatility-tabs button small { color:#9a3412; font-size:.7rem; font-weight:600; }.theme-volatility-tabs button.is-active { color:#fff; background:#ea580c; border-color:#ea580c; }.theme-volatility-tabs button.is-active small { color:#ffedd5; }
.theme-volatility-modal main { padding:16px 24px 22px; }.theme-volatility-status { margin:0 0 10px; color:var(--text); font-size:.78rem; }.theme-volatility-chart-wrap { overflow:hidden; border:1px solid #fed7aa; border-radius:11px; }.theme-volatility-chart-wrap canvas { display:block; width:100%; }.theme-volatility-summary { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin-top:14px; }.theme-volatility-summary article { display:flex; flex-direction:column; gap:5px; padding:12px; color:var(--text); background:var(--surface-soft); border:1px solid var(--border); border-radius:9px; font-size:.78rem; }.theme-volatility-summary strong { color:var(--text); font-size:1rem; font-variant-numeric:tabular-nums; }.theme-volatility-summary strong.up { color:#dc2626; }.theme-volatility-summary strong.down { color:var(--primary); }.theme-volatility-summary small,.theme-volatility-note { color:var(--text-muted); font-size:.72rem; line-height:1.5; }.theme-volatility-note { margin:14px 0 0; padding:10px 12px; background:var(--surface-soft); border-radius:8px; }

.sox-semicon-modal-backdrop,.vix-kospi-modal-backdrop,.circuit-breaker-modal-backdrop { position:fixed; z-index:1200; inset:0; display:none; place-items:center; padding:16px; background:rgba(15,23,42,.58); }
.sox-semicon-modal-backdrop.show,.vix-kospi-modal-backdrop.show,.circuit-breaker-modal-backdrop.show { display:grid; }
.vix-kospi-modal { width:min(880px,96vw); max-height:96vh; overflow:auto; background:var(--surface); border-radius:16px; }
.sox-semicon-modal { width:min(1180px,97vw); max-height:96vh; overflow:auto; background:var(--surface); border-radius:16px; }
.sox-semicon-tabs { display:flex; flex-wrap:wrap; gap:8px; padding:14px 24px 0; }
.sox-semicon-tabs button { padding:8px 12px; color:var(--primary); background:rgba(168,85,247,.1); border:1px solid rgba(168,85,247,.3); border-radius:8px; font-size:.76rem; font-weight:800; }
.sox-semicon-tabs button.is-active { color:#fff; background:#7c3aed; border-color:var(--primary); }
.circuit-breaker-modal { width:min(1280px,97vw); max-height:96vh; overflow:auto; background:var(--surface); border-radius:16px; }
.sox-semicon-modal header,.vix-kospi-modal header,.circuit-breaker-modal header { display:flex; justify-content:space-between; padding:20px 24px; border-bottom:1px solid #e2e8f0; }
.sox-semicon-modal header>div,.vix-kospi-modal header>div,.circuit-breaker-modal header>div { display:flex; gap:12px; align-items:center; }
.sox-semicon-modal header span,.vix-kospi-modal header span,.circuit-breaker-modal header span { display:grid; width:42px; height:42px; place-items:center; color:#fff; border-radius:11px; font-size:1.1rem; }
.sox-semicon-modal header span { background:#7c3aed; }.vix-kospi-modal header span { background:#dc2626; }.circuit-breaker-modal header span { background:#ea580c; }
.sox-semicon-modal h2,.vix-kospi-modal h2,.circuit-breaker-modal h2 { margin:0; }
.sox-semicon-modal header p,.vix-kospi-modal header p,.circuit-breaker-modal header p { margin:3px 0 0; color:var(--text-muted); font-size:.8rem; }
.sox-semicon-modal header>button,.vix-kospi-modal header>button,.circuit-breaker-modal header>button { width:40px; height:40px; flex:0 0 auto; color:var(--text-muted); border-radius:10px; font-size:1.2rem; }
.sox-semicon-modal main,.vix-kospi-modal main,.circuit-breaker-modal main { padding:18px 24px 22px; }
.sox-semicon-status,.vix-kospi-status,.circuit-breaker-status { margin:0 0 10px; color:var(--text); font-size:.78rem; }
.sox-semicon-chart-wrap,.vix-kospi-chart-wrap,.circuit-breaker-chart-wrap { overflow:hidden; border-radius:11px; }
.sox-semicon-chart-wrap { border:1px solid rgba(168,85,247,.3); }.vix-kospi-chart-wrap { border:1px solid rgba(255,59,92,.35); }.circuit-breaker-chart-wrap { border:1px solid #fed7aa; }
.sox-semicon-chart-wrap canvas,.vix-kospi-chart-wrap canvas,.circuit-breaker-chart-wrap canvas { display:block; width:100%; }
.sox-semicon-summary { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin-top:14px; }
.vix-kospi-summary { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin-top:14px; }
.sox-semicon-summary article,.vix-kospi-summary article { display:flex; flex-direction:column; gap:5px; padding:12px; background:var(--surface-soft); border:1px solid var(--border); border-radius:9px; font-size:.78rem; color:var(--text); }
.sox-semicon-summary strong,.vix-kospi-summary strong { font-size:1.02rem; color:var(--text); font-variant-numeric:tabular-nums; }
.vix-kospi-summary .vix-risk-reading { background:var(--primary-light); border-color:#fde68a; }.vix-kospi-summary .vix-risk-reading small { color:var(--text-muted); }
.sox-semicon-note,.vix-kospi-note,.circuit-breaker-note { margin:14px 0 0; padding:10px 12px; color:var(--text-muted); background:var(--surface-soft); border-radius:8px; font-size:.72rem; line-height:1.5; }

.cb-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; margin-top:10px; }
.cb-panel { padding:10px; background:rgba(240,185,11,.12); border:1px solid #fed7aa; border-radius:11px; }
.cb-panel h3 { display:flex; align-items:center; gap:7px; margin:0 0 8px; color:#9a3412; font-size:.8rem; font-weight:800; }
.circuit-breaker-legend { display:flex; flex-wrap:wrap; gap:16px; margin-top:14px; color:var(--text); font-size:.76rem; font-weight:700; }
.circuit-breaker-legend span { display:inline-flex; align-items:center; gap:6px; }
.cb-dot { display:inline-block; width:10px; height:10px; border-radius:50%; }
.cb-dot.cb-1 { background:#f59e0b; }.cb-dot.cb-2 { background:#f97316; }.cb-dot.cb-3 { background:#ef4444; }.cb-dot.cb-side { background:#0d9488; }
.cb-section-title { margin:18px 0 8px; color:var(--text); font-size:.86rem; font-weight:800; }
.circuit-breaker-list { list-style:none; margin:0; padding:0; display:grid; gap:6px; max-height:220px; overflow-y:auto; }
.circuit-breaker-list li { display:flex; align-items:center; flex-wrap:wrap; gap:8px; padding:8px 10px; background:var(--surface-soft); border:1px solid var(--border); border-radius:7px; font-size:.76rem; color:var(--text); }
.circuit-breaker-list li a { margin-left:auto; color:#ea580c; font-weight:800; font-size:.72rem; white-space:nowrap; }
.cb-causes { margin:0; padding-left:18px; display:grid; gap:5px; color:var(--text); font-size:.8rem; line-height:1.5; }

@media (max-width:900px) { .cb-grid { grid-template-columns:1fr; } }
@media (max-width:640px) {
  .sox-semicon-modal header,.sox-semicon-modal main,.vix-kospi-modal header,.vix-kospi-modal main,.circuit-breaker-modal header,.circuit-breaker-modal main { padding-left:15px; padding-right:15px; }
  .sox-semicon-summary,.vix-kospi-summary { grid-template-columns:1fr; }
  .theme-volatility-modal>header,.theme-volatility-modal main { padding-left:15px; padding-right:15px; }.theme-volatility-tabs { padding:12px 15px 0; overflow:auto; }.theme-volatility-tabs button { min-width:135px; }.theme-volatility-summary { grid-template-columns:1fr; }
}

.mdd-history-button { display:inline-flex; align-items:center; gap:7px; padding:10px 14px; color:#991b1b; background:var(--red-bg); border:1px solid rgba(255,59,92,.35); border-radius:9px; font-size:.82rem; font-weight:800; }.mdd-history-button:hover { color:#fff; background:#dc2626; }
.mdd-history-modal-backdrop { position:fixed; z-index:1200; inset:0; display:none; place-items:center; padding:16px; background:rgba(15,23,42,.58); }.mdd-history-modal-backdrop.show { display:grid; }
.mdd-history-modal { width:min(880px,96vw); max-height:96vh; overflow:auto; background:var(--surface); border-radius:16px; }
.mdd-history-modal header { display:flex; justify-content:space-between; padding:20px 24px; border-bottom:1px solid #e2e8f0; }.mdd-history-modal header>div { display:flex; gap:12px; align-items:center; }
.mdd-history-modal header span { display:grid; width:42px; height:42px; place-items:center; color:#fff; background:#dc2626; border-radius:11px; font-size:1.1rem; }
.mdd-history-modal h2 { margin:0; }.mdd-history-modal header p { margin:3px 0 0; color:var(--text-muted); font-size:.8rem; }
.mdd-history-modal header>button { width:40px; height:40px; flex:0 0 auto; color:var(--text-muted); border-radius:10px; font-size:1.2rem; }
.mdd-history-modal main { padding:18px 24px 22px; }.mdd-history-status { margin:0 0 10px; color:var(--text); font-size:.78rem; }
.mdd-history-chart-wrap { overflow:hidden; border:1px solid rgba(255,59,92,.35); border-radius:11px; }.mdd-history-chart-wrap canvas { display:block; width:100%; }
.mdd-history-summary { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin-top:14px; }
.mdd-history-summary article { display:flex; flex-direction:column; gap:5px; padding:12px; background:var(--surface-soft); border:1px solid var(--border); border-radius:9px; font-size:.78rem; color:var(--text); }
.mdd-history-summary strong { font-size:1.05rem; color:#991b1b; font-variant-numeric:tabular-nums; }
.mdd-history-note { margin:14px 0 0; padding:10px 12px; color:var(--text-muted); background:var(--surface-soft); border-radius:8px; font-size:.72rem; line-height:1.5; }
@media (max-width:640px) { .mdd-history-modal header,.mdd-history-modal main { padding-left:15px; padding-right:15px; }.mdd-history-summary { grid-template-columns:1fr; } }
.capm-simulator-button { display:inline-flex; gap:7px; align-items:center; padding:10px 14px; color:var(--primary); background:rgba(99,102,241,.1); border:1px solid rgba(99,102,241,.3); border-radius:9px; font-size:.82rem; font-weight:800; }.capm-simulator-button:hover { color:#fff; background:#4f46e5; }
.capm-modal-backdrop { position:fixed; z-index:1200; inset:0; display:none; place-items:center; padding:16px; background:rgba(15,23,42,.58); }.capm-modal-backdrop.show { display:grid; }
.capm-modal { width:min(760px,96vw); max-height:96vh; overflow:auto; background:var(--surface); border:1px solid var(--border); border-radius:18px; box-shadow:0 24px 70px rgba(15,23,42,.32); }
.capm-modal header { display:flex; justify-content:space-between; gap:16px; padding:22px 28px; border-bottom:1px solid #e2e8f0; }.capm-modal header>div { display:flex; align-items:center; gap:14px; }
.capm-modal header span { display:grid; place-items:center; width:46px; height:46px; color:#fff; background:linear-gradient(135deg,#4f46e5,#4338ca); border-radius:13px; }
.capm-modal h2 { margin:0; color:var(--text); font-size:1.35rem; }.capm-modal header p { margin:4px 0 0; color:var(--text-muted); font-size:.84rem; }
.capm-modal header>button { width:40px; height:40px; color:var(--text-muted); border-radius:10px; font-size:1.2rem; }
.capm-modal main { padding:20px 28px 24px; }
.capm-inputs { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; padding:15px; background:rgba(99,102,241,.1); border:1px solid rgba(99,102,241,.3); border-radius:11px; }
.capm-inputs label { display:grid; gap:6px; color:#3730a3; font-size:.76rem; font-weight:750; }.capm-inputs input { padding:9px; border:1px solid var(--border); border-radius:7px; font:inherit; font-weight:800; }
.capm-results { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin:15px 0; }
.capm-results article { display:grid; gap:5px; padding:13px; background:var(--surface-soft); border:1px solid #dbe3ee; border-radius:9px; }
.capm-results span { color:var(--text-muted); font-size:.72rem; font-weight:750; }.capm-results strong { color:var(--primary); font-size:1.1rem; }
.capm-reading { padding:15px; border:1px solid #dbe3ee; border-radius:11px; }.capm-reading h3 { margin:0 0 8px; color:#3730a3; font-size:.92rem; }
.capm-reading p { margin:0; color:var(--text); line-height:1.5; }.capm-reading b { display:block; margin-top:11px; padding:9px; color:#3730a3; background:rgba(99,102,241,.1); border-radius:7px; font-size:.76rem; }
.capm-modal footer { display:flex; gap:8px; align-items:center; margin-top:14px; padding:10px 12px; color:var(--text-muted); background:var(--surface-soft); border-radius:8px; font-size:.73rem; }
.capm-modal footer i { color:var(--primary); }.capm-modal footer button { margin-left:auto; padding:6px 8px; color:var(--primary); background:var(--surface); border:1px solid rgba(99,102,241,.3); border-radius:6px; font-size:.69rem; font-weight:800; }
@media (max-width:640px) { .capm-modal header,.capm-modal main { padding-left:15px; padding-right:15px; }.capm-inputs,.capm-results { grid-template-columns:1fr 1fr; } }

.regime-explainer { display: flex; gap: 13px; margin-bottom: 18px; padding: 16px 18px; color:var(--text); border: 1px solid rgba(56,189,248,.3); border-radius: 12px; background:rgba(56,189,248,.08); }
.regime-explainer > i { display: grid; place-items: center; flex: 0 0 34px; width: 34px; height: 34px; color: var(--primary); border-radius: 50%; background:var(--primary-light); }
.regime-explainer strong { font-size: .9rem; }.regime-explainer p { margin: 5px 0 0; color: var(--text-muted); font-size: .82rem; line-height: 1.6; }
.regime-cards { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; margin-bottom: 24px; }
.regime-card { position: relative; padding: 15px; border: 1px solid var(--border); border-radius: 12px; background: var(--surface); box-shadow: var(--shadow-sm); }
.regime-card.is-current { border-color:var(--primary); box-shadow: 0 0 0 2px rgba(29,78,216,.18); }
.regime-current-tag { position: absolute; top: -10px; right: 12px; padding: 2px 9px; color: #fff; background: #1d4ed8; border-radius: 99px; font-size: .64rem; font-weight: 800; }
.regime-card-head { display: flex; align-items: center; gap: 9px; margin-bottom: 10px; }
.regime-badge { display: grid; place-items: center; width: 34px; height: 34px; flex: 0 0 auto; color: #fff; border-radius: 9px; font-size: .82rem; font-weight: 900; }
.regime-card-head b { display: block; color: var(--text); font-size: .86rem; }.regime-card-head small { display: block; margin-top: 1px; color: var(--text-subtle); font-size: .66rem; }
.regime-mapping { margin: 0 0 8px; color:var(--primary); font-size: .72rem; font-weight: 750; }.regime-mapping i { margin-right: 4px; }
.regime-market { margin: 0 0 8px; color: var(--text-muted); font-size: .76rem; line-height: 1.55; }
.regime-strategy { margin: 0; padding-top: 8px; border-top: 1px dashed var(--border); color: var(--text); font-size: .76rem; line-height: 1.55; }.regime-strategy b { display: block; margin-bottom: 3px; color: var(--text-subtle); font-size: .66rem; text-transform: uppercase; letter-spacing: .03em; }

.risk-sim-section { padding: 20px; border: 1px solid var(--border); border-radius: 12px; background: var(--surface); box-shadow: var(--shadow-sm); }
.risk-sim-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; flex-wrap: wrap; margin-bottom: 16px; }
.risk-sim-head h2 { margin: 0; font-size: 1.02rem; color: var(--text); }.risk-sim-head p { margin: 5px 0 0; color: var(--text-muted); font-size: .8rem; line-height: 1.55; max-width: 640px; }
.risk-sim-table { display: grid; gap: 8px; margin: 16px 0; }
.risk-sim-row { display: grid; grid-template-columns: 12px 1.1fr 1fr 1fr 1fr; align-items: center; gap: 10px; padding: 8px 4px; border-bottom: 1px solid var(--border); }
.risk-sim-row-head { color: var(--text-subtle); font-size: .68rem; font-weight: 800; text-transform: uppercase; letter-spacing: .03em; border-bottom: 2px solid var(--border); }
.risk-sim-dot { width: 10px; height: 10px; border-radius: 50%; }
.risk-sim-name { font-size: .84rem; font-weight: 750; color: var(--text); }
.risk-sim-row input { width: 100%; box-sizing: border-box; padding: 8px; border: 1px solid var(--border); border-radius: 6px; font: inherit; font-weight: 800; }
.risk-sim-correlation { display: flex; align-items: center; gap: 10px; margin: 6px 0 18px; color: var(--text-muted); font-size: .8rem; font-weight: 750; }
.risk-sim-correlation input[type="range"] { flex: 1; max-width: 280px; }
.risk-sim-correlation output { min-width: 40px; color: var(--text); font-weight: 800; }
.risk-sim-summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-bottom: 16px; }
.risk-sim-summary article { display: grid; gap: 4px; padding: 12px; background: var(--surface-soft); border-radius: 9px; }
.risk-sim-summary span { color: var(--text-subtle); font-size: .7rem; font-weight: 750; }
.risk-sim-summary strong { color: var(--text); font-size: 1.05rem; }
.risk-sim-summary small { color: var(--text-subtle); font-size: .64rem; }

@media (max-width: 1100px) { .regime-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); } .risk-sim-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 760px) {
  .regime-cards { grid-template-columns: 1fr; }
  .risk-sim-row { grid-template-columns: 1fr; gap: 6px; }
  .risk-sim-row-head { display: none; }
  .risk-sim-summary { grid-template-columns: 1fr; }
  .risk-sim-head { flex-direction: column; }
}

.pattern-verify-button { display:inline-flex; gap:7px; align-items:center; padding:10px 14px; color:#4c1d95; background:rgba(168,85,247,.1); border:1px solid rgba(168,85,247,.3); border-radius:9px; font-size:.82rem; font-weight:800; }.pattern-verify-button:hover { color:#fff; background:#7c3aed; }
.pattern-verify-modal-backdrop { position:fixed; z-index:1200; inset:0; display:none; place-items:center; padding:16px; background:rgba(15,23,42,.58); }.pattern-verify-modal-backdrop.show { display:grid; }
.pattern-verify-modal { width:min(920px,96vw); max-height:96vh; overflow:auto; background:var(--surface); border-radius:16px; }
.pattern-verify-modal header { display:flex; justify-content:space-between; padding:20px 24px; border-bottom:1px solid #e2e8f0; }
.pattern-verify-modal header>div { display:flex; gap:12px; align-items:center; }
.pattern-verify-modal header span { display:grid; width:42px; height:42px; place-items:center; color:#fff; background:#7c3aed; border-radius:11px; font-size:1.1rem; }
.pattern-verify-modal h2 { margin:0; }.pattern-verify-modal header p { margin:3px 0 0; color:var(--text-muted); font-size:.8rem; }
.pattern-verify-modal header>button { width:40px; height:40px; flex:0 0 auto; color:var(--text-muted); border-radius:10px; font-size:1.2rem; }
.pattern-verify-tabs { display:flex; flex-wrap:wrap; gap:8px; padding:14px 24px 0; }
.pattern-verify-tabs button { padding:8px 11px; color:var(--primary); background:rgba(168,85,247,.1); border:1px solid rgba(168,85,247,.3); border-radius:8px; font-size:.76rem; font-weight:800; }
.pattern-verify-tabs button.is-active { color:#fff; background:#7c3aed; border-color:var(--primary); }
.pattern-verify-modal main { padding:16px 24px 22px; }
.pattern-verify-status { margin:0 0 10px; color:var(--text); font-size:.78rem; }
.pattern-verify-chart-wrap { overflow:hidden; border:1px solid rgba(168,85,247,.3); border-radius:11px; }.pattern-verify-chart-wrap canvas { display:block; width:100%; }
.pattern-verify-summary { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin-top:14px; }
.pattern-verify-summary article { display:flex; flex-direction:column; gap:5px; padding:12px; background:var(--surface-soft); border:1px solid var(--border); border-radius:9px; font-size:.76rem; color:var(--text); }
.pattern-verify-summary strong { font-size:.92rem; color:#4c1d95; }
.pattern-verify-note { margin:14px 0 0; padding:10px 12px; color:var(--text-muted); background:var(--surface-soft); border-radius:8px; font-size:.72rem; line-height:1.5; }
@media (max-width:640px) { .pattern-verify-modal header,.pattern-verify-modal main { padding-left:15px; padding-right:15px; }.pattern-verify-summary { grid-template-columns:1fr; } }

.momentum-picks-button { display:inline-flex; gap:7px; align-items:center; padding:10px 14px; color:#166534; background:var(--green-bg); border:1px solid #bbf7d0; border-radius:9px; font-size:.82rem; font-weight:800; }.momentum-picks-button:hover { color:#fff; background:#16a34a; }
.momentum-picks-modal-backdrop { position:fixed; z-index:1200; inset:0; display:none; place-items:center; padding:16px; background:rgba(15,23,42,.58); }.momentum-picks-modal-backdrop.show { display:grid; }
.momentum-picks-modal { width:min(980px,96vw); max-height:96vh; overflow:auto; background:var(--surface); border-radius:16px; }
.momentum-picks-modal>header { display:flex; justify-content:space-between; padding:20px 24px; border-bottom:1px solid #e2e8f0; }.momentum-picks-modal>header>div { display:flex; gap:12px; align-items:center; }
.momentum-picks-modal>header span { display:grid; width:42px; height:42px; place-items:center; color:#fff; background:#16a34a; border-radius:11px; font-size:1.1rem; }
.momentum-picks-modal h2 { margin:0; }.momentum-picks-modal>header p { margin:3px 0 0; color:var(--text-muted); font-size:.8rem; }
.momentum-picks-modal>header>button { width:40px; height:40px; flex:0 0 auto; color:var(--text-muted); border-radius:10px; font-size:1.2rem; }
.momentum-picks-select-row { display:flex; flex-direction:column; gap:6px; padding:14px 24px 0; }
.momentum-picks-select-row label { color:#166534; font-size:.76rem; font-weight:800; }
.momentum-picks-select-row select { padding:9px 11px; color:#14532d; background:var(--green-bg); border:1px solid #bbf7d0; border-radius:8px; font-size:.82rem; font-weight:700; }
.momentum-picks-modal main { padding:16px 24px 22px; }.momentum-picks-status { margin:0 0 10px; color:var(--text); font-size:.78rem; }
.momentum-picks-chart-wrap { overflow:hidden; border:1px solid #bbf7d0; border-radius:11px; }.momentum-picks-chart-wrap canvas { display:block; width:100%; }
.momentum-picks-summary { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin-top:14px; }
.momentum-picks-summary article { display:flex; flex-direction:column; gap:5px; padding:12px; color:var(--text); background:var(--surface-soft); border:1px solid var(--border); border-radius:9px; font-size:.78rem; }
.momentum-picks-summary strong { color:var(--text); font-size:1rem; font-variant-numeric:tabular-nums; }.momentum-picks-summary strong.up { color:#dc2626; }.momentum-picks-summary strong.down { color:var(--primary); }
.momentum-picks-summary small,.momentum-picks-note { color:var(--text-muted); font-size:.72rem; line-height:1.5; }
.momentum-picks-note { margin:14px 0 0; padding:10px 12px; background:var(--surface-soft); border-radius:8px; }
@media (max-width:640px) { .momentum-picks-modal>header,.momentum-picks-modal main,.momentum-picks-select-row { padding-left:15px; padding-right:15px; }.momentum-picks-summary { grid-template-columns:1fr; } }

.ipo-chart-button,.penny-stock-rally-button { display:inline-flex; gap:7px; align-items:center; padding:10px 14px; border-radius:9px; font-size:.82rem; font-weight:800; }
.ipo-chart-button { color:var(--primary); background:rgba(99,102,241,.1); border:1px solid rgba(99,102,241,.3); }.ipo-chart-button:hover { color:#fff; background:#4f46e5; }
.penny-stock-rally-button { color:#9a3412; background:rgba(240,185,11,.12); border:1px solid #fed7aa; }.penny-stock-rally-button:hover { color:#fff; background:#ea580c; }
.ipo-chart-modal-backdrop,.penny-rally-modal-backdrop { position:fixed; z-index:1200; inset:0; display:none; place-items:center; padding:16px; background:rgba(15,23,42,.58); }
.ipo-chart-modal-backdrop.show,.penny-rally-modal-backdrop.show { display:grid; }
.ipo-chart-modal,.penny-rally-modal { width:min(980px,97vw); max-height:96vh; overflow:auto; background:var(--surface); border-radius:16px; }
.ipo-chart-modal header,.penny-rally-modal header { display:flex; justify-content:space-between; padding:20px 24px; border-bottom:1px solid #e2e8f0; }
.ipo-chart-modal header>div,.penny-rally-modal header>div { display:flex; gap:12px; align-items:center; }
.ipo-chart-modal header span,.penny-rally-modal header span { display:grid; width:42px; height:42px; place-items:center; color:#fff; border-radius:11px; font-size:1.1rem; }
.ipo-chart-modal header span { background:#4f46e5; }.penny-rally-modal header span { background:#ea580c; }
.ipo-chart-modal h2,.penny-rally-modal h2 { margin:0; }.ipo-chart-modal header p,.penny-rally-modal header p { margin:3px 0 0; color:var(--text-muted); font-size:.8rem; }
.ipo-chart-modal header>button,.penny-rally-modal header>button { width:40px; height:40px; flex:0 0 auto; color:var(--text-muted); border-radius:10px; font-size:1.2rem; }
.ipo-chart-tabs,.penny-rally-tabs { display:flex; flex-wrap:wrap; gap:8px; padding:14px 24px 0; }
.ipo-chart-tabs button { padding:8px 12px; color:var(--primary); background:rgba(99,102,241,.1); border:1px solid rgba(99,102,241,.3); border-radius:8px; font-size:.78rem; font-weight:800; }
.ipo-chart-tabs button.is-active { color:#fff; background:#4f46e5; border-color:var(--primary); }
.penny-rally-tabs button { padding:8px 12px; color:#9a3412; background:rgba(240,185,11,.12); border:1px solid #fed7aa; border-radius:8px; font-size:.78rem; font-weight:800; }
.penny-rally-tabs button.is-active { color:#fff; background:#ea580c; border-color:#ea580c; }
.ipo-chart-modal main,.penny-rally-modal main { padding:16px 24px 22px; }
.ipo-chart-status,.penny-rally-status { margin:0 0 10px; color:var(--text); font-size:.78rem; }
.ipo-chart-chart-wrap,.penny-rally-chart-wrap { overflow:hidden; border-radius:11px; }
.ipo-chart-chart-wrap { border:1px solid rgba(99,102,241,.3); }.penny-rally-chart-wrap { border:1px solid #fed7aa; }
.ipo-chart-chart-wrap canvas,.penny-rally-chart-wrap canvas { display:block; width:100%; }
.ipo-chart-summary,.penny-rally-summary { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin-top:14px; }
.ipo-chart-summary article,.penny-rally-summary article { display:flex; flex-direction:column; gap:5px; padding:12px; color:var(--text); background:var(--surface-soft); border:1px solid var(--border); border-radius:9px; font-size:.78rem; }
.ipo-chart-summary strong,.penny-rally-summary strong { color:var(--text); font-size:1rem; font-variant-numeric:tabular-nums; }
.ipo-chart-summary strong.up,.penny-rally-summary strong.up { color:#dc2626; }.ipo-chart-summary strong.down { color:var(--primary); }
.ipo-chart-summary small,.penny-rally-summary small { color:#94a3b8; font-size:.68rem; }
.ipo-chart-note,.penny-rally-note { margin:14px 0 0; padding:10px 12px; color:var(--text-muted); background:var(--surface-soft); border-radius:8px; font-size:.72rem; line-height:1.5; }
@media (max-width:760px) { .ipo-chart-summary,.penny-rally-summary { grid-template-columns:repeat(2,1fr); } }
@media (max-width:640px) { .ipo-chart-modal header,.ipo-chart-modal main,.ipo-chart-tabs,.penny-rally-modal header,.penny-rally-modal main,.penny-rally-tabs { padding-left:15px; padding-right:15px; } }

/* JY investing shell and decision dashboard */
.nav-eyebrow{padding:8px 20px 10px;color:var(--text-subtle);font-size:.6rem;font-weight:800;letter-spacing:.13em}.nav-section-utility{margin-top:auto;padding-top:8px;border-top:1px solid var(--border)}
.brand-name{color:var(--primary-dark);letter-spacing:-.01em;text-transform:none}.brand-sub{color:#9a7b3f;font-size:.56rem;font-weight:800;letter-spacing:.11em}.visitor-badge,.health-badge{display:none}.auth-badge{background:var(--primary);border-color:var(--primary)}
.jy-hero{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;margin-bottom:22px;padding:8px 2px}.jy-kicker,.jy-section-label{display:block;margin-bottom:7px;color:var(--primary);font-size:.65rem;font-weight:800;letter-spacing:.12em}.jy-hero h1{margin:0;color:var(--text);font-size:clamp(1.6rem,3vw,2.25rem);letter-spacing:-.045em}.jy-hero p{margin:9px 0 0;color:var(--text-muted);font-size:.86rem}
.jy-data-status{display:grid;grid-template-columns:10px auto;column-gap:8px;align-items:center;min-width:210px;padding:12px 14px;background:var(--surface);border:1px solid var(--border);border-radius:10px}.jy-data-status strong{color:var(--text);font-size:.76rem}.jy-data-status small{grid-column:2;color:var(--text-subtle);font-size:.66rem}.jy-live-dot{grid-row:1/3;width:8px;height:8px;background:var(--green);border-radius:50%;box-shadow:0 0 0 4px var(--green-bg)}
.jy-overview-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:16px}.jy-overview-card{position:relative;min-height:140px;padding:18px;overflow:hidden;background:var(--surface);border:1px solid var(--border);border-radius:12px;box-shadow:0 1px 2px rgba(0,0,0,.2)}.jy-overview-card>span{display:block;margin-bottom:13px;color:var(--text-muted);font-size:.72rem;font-weight:700}.jy-overview-card>strong{display:block;color:var(--text);font-family:var(--term-mono,inherit);font-size:1.25rem;font-weight:800;font-variant-numeric:tabular-nums}.jy-overview-card>small{display:block;margin-top:7px;color:var(--text-subtle);font-size:.66rem;line-height:1.4}.jy-overview-card>small.is-up{color:var(--up)}.jy-overview-card>small.is-down{color:var(--down)}.jy-overview-card>button{position:absolute;left:18px;bottom:15px;color:var(--primary);font-size:.68rem;font-weight:800}.jy-overview-card.is-primary{color:var(--text);border-color:var(--primary);background:linear-gradient(145deg,var(--surface),var(--surface-soft))}.jy-overview-card.is-primary>span,.jy-overview-card.is-primary>small{color:var(--text-muted)}.jy-overview-card.is-primary>strong,.jy-overview-card.is-primary>button{color:var(--primary)}
.jy-decision-grid{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(280px,1fr);gap:16px;margin-bottom:28px}.jy-panel{padding:20px;background:var(--surface);border:1px solid var(--border);border-radius:12px}.jy-panel>header{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}.jy-panel h2,.jy-section-head h2{margin:0;color:var(--text);font-size:1rem;letter-spacing:-.02em}.jy-count{display:grid;width:27px;height:27px;place-items:center;color:var(--bg);background:var(--primary);border-radius:50%;font-size:.7rem;font-weight:800}
.jy-action-row{display:grid;grid-template-columns:34px 1fr auto;gap:11px;align-items:center;width:100%;padding:12px 4px;text-align:left;border-top:1px solid var(--border)}.jy-action-row>i:first-child{display:grid;width:32px;height:32px;place-items:center;color:var(--primary);background:var(--primary-light);border-radius:8px;font-size:.75rem}.jy-action-row>i:last-child{color:var(--text-subtle);font-size:.65rem}.jy-action-row strong{display:block;color:var(--text);font-size:.76rem}.jy-action-row small{display:block;margin-top:3px;color:var(--text-subtle);font-size:.66rem}.jy-action-row:hover{background:var(--surface-hover)}.jy-action-row:hover>i:last-child{color:var(--primary)}
.jy-signal-panel dl{margin:0}.jy-signal-panel dl>div{display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid var(--border);font-size:.72rem}.jy-signal-panel dt{color:var(--text-muted)}.jy-signal-panel dd{margin:0;color:var(--text);font-weight:800}.jy-signal-panel dd.is-positive{color:var(--green)}.jy-signal-panel dd.is-neutral{color:var(--text-subtle)}.jy-signal-panel>p{margin:14px 0 0;color:var(--text-subtle);font-size:.66rem;line-height:1.55}
.jy-market-section{margin-bottom:28px}.jy-section-head{display:flex;justify-content:space-between;align-items:flex-end;gap:18px;margin-bottom:14px}.jy-section-head p{margin:5px 0 0;color:var(--text-subtle);font-size:.72rem}.jy-section-head>button{color:var(--primary);font-size:.7rem;font-weight:800}
@media(max-width:1100px){.jy-overview-grid{grid-template-columns:repeat(2,1fr)}.jy-decision-grid{grid-template-columns:1fr}}@media(max-width:680px){.jy-hero{align-items:flex-start;flex-direction:column}.jy-data-status{width:100%}.jy-overview-grid{grid-template-columns:1fr}.jy-overview-card{min-height:125px}.jy-section-head{align-items:flex-start;flex-direction:column}}

/* Personal holdings */
.holdings-ticker-search{min-width:220px}
.holdings-selected-ticker{display:block;margin:5px 2px 0;color:var(--primary);font-family:var(--term-mono,monospace);font-size:.66rem}
.holdings-editor .holdings-table-wrap table{min-width:620px}
.holdings-view{max-width:1180px}.holdings-head{display:flex;justify-content:space-between;align-items:flex-end;gap:22px;margin-bottom:20px}.holdings-head h1,.holdings-login h1{margin:0;color:var(--text);font-size:1.6rem;letter-spacing:-.04em}.holdings-head p,.holdings-login p{margin:8px 0 0;color:var(--text-muted);font-size:.8rem}.holdings-head>div:last-child{text-align:right}.holdings-head>div:last-child strong{display:block;color:var(--primary);font-family:var(--term-mono,inherit);font-size:1.3rem;font-variant-numeric:tabular-nums}.holdings-head>div:last-child small{color:var(--text-subtle);font-size:.66rem}.holdings-summary{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:10px}.holdings-summary article{padding:15px;background:var(--surface);border:1px solid var(--border);border-radius:10px}.holdings-summary span{display:block;margin-bottom:7px;color:var(--text-muted);font-size:.68rem}.holdings-summary strong{color:var(--text);font-family:var(--term-mono,inherit);font-size:.93rem;font-variant-numeric:tabular-nums}.holdings-summary strong.is-profit{color:var(--up)}.holdings-summary strong.is-loss{color:var(--down)}.holdings-valuation-note{margin:0 0 16px;color:var(--text-subtle);font-size:.67rem}.holdings-editor{padding:22px;background:var(--surface);border:1px solid var(--border);border-radius:12px}.holdings-editor header h2{margin:0;color:var(--text);font-size:1rem}.holdings-editor header p{margin:6px 0 18px;color:var(--text-muted);font-size:.72rem}.holdings-cash-label{display:grid;max-width:280px;gap:6px;margin-bottom:16px;color:var(--text-muted);font-size:.72rem;font-weight:700}.holdings-cash-label input,.holdings-table-wrap input,.holdings-table-wrap select{width:100%;padding:9px;border:1px solid var(--border);border-radius:7px;background:var(--surface-soft);color:var(--text);font-size:.74rem}.holdings-ticker-search{position:relative}.holdings-search-results{position:absolute;z-index:20;top:100%;left:0;right:0;margin:4px 0 0;padding:4px;list-style:none;background:var(--surface);border:1px solid var(--border);border-radius:8px;box-shadow:0 8px 20px rgba(0,0,0,.4);max-height:220px;overflow-y:auto}.holdings-search-results li{margin:0}.holdings-search-results button{display:block;width:100%;padding:7px 9px;text-align:left;color:var(--text);font-size:.74rem;border-radius:6px}.holdings-search-results button:hover{background:var(--surface-hover);color:var(--primary)}
.holdings-table-wrap{overflow-x:auto;border:1px solid var(--border);border-radius:9px}.holdings-table-wrap table{width:100%;min-width:720px;border-collapse:collapse}.holdings-table-wrap th{padding:10px;text-align:left;color:var(--text-subtle);background:var(--surface-soft);font-size:.66rem}.holdings-table-wrap td{padding:8px;border-top:1px solid var(--border)}.holdings-remove{width:32px;height:32px;color:var(--text-subtle);border-radius:7px}.holdings-remove:hover{color:var(--red);background:var(--red-bg)}.holdings-actions{display:flex;justify-content:space-between;gap:12px;margin-top:16px}.holdings-actions>button:first-child{padding:10px 12px;color:var(--primary);border:1px solid var(--border-strong);border-radius:8px;font-size:.74rem;font-weight:800}.holdings-status{min-height:18px;margin:12px 0 0;color:var(--text-muted);font-size:.72rem}.holdings-status.is-success{color:var(--green)}.holdings-status.is-error{color:var(--red)}.holdings-login{max-width:600px;margin:64px auto;padding:34px;background:var(--surface);border:1px solid var(--border);border-radius:14px;text-align:center}.holdings-login .jy-section-label{margin-bottom:12px}.holdings-login .run-btn{margin-top:22px}@media(max-width:760px){.holdings-head{align-items:flex-start;flex-direction:column}.holdings-head>div:last-child{text-align:left}.holdings-summary{grid-template-columns:repeat(2,1fr)}.holdings-actions{align-items:stretch;flex-direction:column}}
.holdings-insights{margin:0 0 16px;padding:20px;background:var(--surface);border:1px solid var(--border);border-radius:12px}.holdings-insights>header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.holdings-insights h2{margin:0;color:var(--text);font-size:1rem}.holdings-concentration{padding:5px 9px;border-radius:99px;font-size:.67rem;font-weight:800}.holdings-concentration.is-high{color:#fbbf24;background:rgba(251,191,36,.14)}.holdings-concentration.is-mid{color:#38bdf8;background:rgba(56,189,248,.14)}.holdings-concentration.is-low{color:var(--green);background:var(--green-bg)}.holdings-insight-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.holdings-insight-grid article{padding:13px;background:var(--surface-soft);border-radius:9px}.holdings-insight-grid span{display:block;color:var(--text-muted);font-size:.67rem}.holdings-insight-grid strong{display:block;margin-top:5px;color:var(--text);font-size:.82rem}.holdings-insight-grid small{display:block;margin-top:6px;color:var(--text-subtle);font-size:.63rem}.holdings-currency{display:flex;gap:14px;margin-top:6px}.holdings-currency div{display:flex;gap:5px;align-items:baseline}.holdings-currency strong{margin:0;color:var(--primary)}.holdings-weight-list{display:grid;gap:9px;margin:16px 0 0;padding:0;list-style:none}.holdings-weight-list li{display:grid;grid-template-columns:minmax(100px,1fr) 48px minmax(90px,2fr);gap:10px;align-items:center;font-size:.7rem}.holdings-weight-list span{color:var(--text-muted)}.holdings-weight-list small{color:var(--text-subtle)}.holdings-weight-list b{color:var(--text);text-align:right;font-family:var(--term-mono,inherit);font-variant-numeric:tabular-nums}.holdings-weight-list i{display:block;height:7px;overflow:hidden;background:var(--border);border-radius:99px}.holdings-weight-list em{display:block;height:100%;background:var(--primary);border-radius:99px}@media(max-width:600px){.holdings-insight-grid{grid-template-columns:1fr}.holdings-weight-list li{grid-template-columns:minmax(100px,1fr) 42px 1fr}}

/* ── 실제 보유자산 리스크 분석 ── */
.risk-view{max-width:1180px}.risk-head{display:flex;justify-content:space-between;align-items:flex-end;gap:22px;margin-bottom:20px;flex-wrap:wrap}.risk-head h1{margin:0;color:var(--text);font-size:1.6rem;letter-spacing:-.04em}.risk-head p{margin:8px 0 0;color:var(--text-muted);font-size:.8rem}.risk-controls{display:flex;align-items:flex-end;gap:10px}.risk-controls label{display:grid;gap:6px;color:var(--text-muted);font-size:.68rem;font-weight:700}.risk-controls select{padding:9px 10px;border:1px solid var(--border);border-radius:7px;background:var(--surface-soft);color:var(--text);font-size:.78rem}
.risk-basis-note{display:flex;gap:10px;margin-bottom:16px;padding:13px 15px;background:rgba(56,189,248,.1);border:1px solid rgba(56,189,248,.35);border-radius:10px;color:#7dd3fc;font-size:.72rem;line-height:1.6}.risk-basis-note i{margin-top:2px;color:#38bdf8}.risk-basis-note b{font-weight:800;color:#fff}
.risk-meta{display:flex;flex-wrap:wrap;gap:10px 18px;margin-bottom:16px;color:var(--text-muted);font-size:.7rem}.risk-meta b{color:var(--text);font-family:var(--term-mono,inherit)}
.risk-metric-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:18px}.risk-metric{padding:15px;background:var(--surface);border:1px solid var(--border);border-radius:10px}.risk-metric span{display:block;margin-bottom:7px;color:var(--text-muted);font-size:.68rem}.risk-metric strong{display:block;color:var(--text);font-family:var(--term-mono,inherit);font-size:1.05rem;font-variant-numeric:tabular-nums}.risk-metric small{display:block;margin-top:6px;color:var(--text-subtle);font-size:.63rem}.risk-metric.is-warn strong{color:#fbbf24}.risk-metric.is-danger strong{color:var(--red)}
.risk-currency{margin-bottom:16px;padding:18px;background:var(--surface);border:1px solid var(--border);border-radius:12px}.risk-currency h3{margin:0 0 12px;color:var(--text);font-size:.86rem}.risk-currency-grid{display:flex;flex-wrap:wrap;gap:16px}.risk-currency-grid div{display:flex;gap:6px;align-items:baseline}.risk-currency-grid span{color:var(--text-muted);font-size:.72rem}.risk-currency-grid strong{color:var(--primary);font-family:var(--term-mono,inherit);font-size:.86rem}
.risk-excluded{padding:18px;background:rgba(251,191,36,.08);border:1px solid rgba(251,191,36,.3);border-radius:12px}.risk-excluded h3{margin:0 0 12px;color:#fbbf24;font-size:.82rem;display:flex;align-items:center;gap:7px}.risk-excluded ul{display:grid;gap:9px;margin:0;padding:0;list-style:none}.risk-excluded li{padding:10px 12px;background:var(--surface-soft);border:1px solid rgba(251,191,36,.22);border-radius:8px;font-size:.72rem}.risk-excluded li b{color:var(--text)}.risk-excluded li small{margin-left:6px;color:var(--text-subtle)}.risk-excluded li p{margin:5px 0 0;color:#fbbf24}.risk-exclude-stage{float:right;padding:2px 8px;border-radius:99px;background:rgba(251,191,36,.16);color:#fbbf24;font-size:.62rem;font-weight:800}
.risk-unavailable{display:grid;justify-items:center;gap:8px;margin-bottom:16px;padding:34px 20px;background:var(--surface);border:1px solid var(--border);border-radius:12px;text-align:center;color:var(--text-muted)}.risk-unavailable i{color:var(--text-subtle);font-size:1.4rem}.risk-unavailable p{margin:0;font-size:.82rem;max-width:520px}.risk-unavailable small{color:var(--text-subtle);font-size:.68rem}
@media(max-width:760px){.risk-head{align-items:flex-start;flex-direction:column}.risk-metric-grid{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.risk-metric-grid{grid-template-columns:1fr}}

.lvdca-view{max-width:1180px}
.lvdca-head{display:flex;justify-content:space-between;align-items:flex-end;gap:22px;margin-bottom:18px;flex-wrap:wrap}.lvdca-head h1{margin:0;color:var(--text);font-size:1.6rem;letter-spacing:-.04em}.lvdca-head p{margin:8px 0 0;max-width:640px;color:var(--text-muted);font-size:.8rem;line-height:1.6}
.lvdca-warning{background:rgba(255,59,92,.08);border-color:rgba(255,59,92,.35);color:#ffb4c2}.lvdca-warning i{color:var(--red)}
.lvdca-config{margin-bottom:20px;padding:20px;background:var(--surface);border:1px solid var(--border);border-radius:12px}.lvdca-config h2{margin:0 0 14px;color:var(--text);font-size:.92rem;display:flex;align-items:center;gap:8px}
.lvdca-toggle{display:flex;align-items:center;gap:9px;margin-bottom:14px;color:var(--text);font-size:.82rem;font-weight:700}.lvdca-toggle input{width:18px;height:18px;accent-color:var(--primary)}
.lvdca-config-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:12px}.lvdca-config-grid label{display:grid;gap:6px;color:var(--text-muted);font-size:.68rem;font-weight:700}.lvdca-config-grid input{padding:9px 10px;border:1px solid var(--border);border-radius:7px;background:var(--surface-soft);color:var(--text);font-size:.8rem;font-family:var(--term-mono,inherit)}
.lvdca-config-note{margin:0 0 14px;color:var(--text-subtle);font-size:.68rem;line-height:1.6}.lvdca-config-note.is-warn{color:#fbbf24}.lvdca-config-note code{padding:1px 5px;background:var(--surface-soft);border-radius:4px;font-family:var(--term-mono,monospace)}
.lvdca-config-status{margin-left:12px;font-size:.72rem;color:var(--text-subtle)}.lvdca-config-status.is-success{color:var(--green)}.lvdca-config-status.is-error{color:var(--red)}
.lvdca-metric-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:18px}.lvdca-metric{padding:15px;background:var(--surface);border:1px solid var(--border);border-radius:10px}.lvdca-metric span{display:block;margin-bottom:7px;color:var(--text-muted);font-size:.68rem}.lvdca-metric strong{display:block;color:var(--text);font-family:var(--term-mono,inherit);font-size:1.02rem;font-variant-numeric:tabular-nums}.lvdca-metric.is-up strong{color:var(--green)}.lvdca-metric.is-down strong{color:var(--red)}
.lvdca-section{margin-bottom:18px;padding:18px;background:var(--surface);border:1px solid var(--border);border-radius:12px}.lvdca-section h3{margin:0 0 12px;color:var(--text);font-size:.86rem;display:flex;align-items:center;gap:8px}.lvdca-section h3 small{color:var(--text-subtle);font-weight:500;font-size:.68rem}
.lvdca-section-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:4px}.lvdca-section-head h3{margin:0}
.lvdca-reset-btn{flex-shrink:0;padding:6px 12px;background:transparent;border:1px solid rgba(255,59,92,.4);color:#ffb4c2;border-radius:8px;font-size:.7rem;cursor:pointer;display:inline-flex;align-items:center;gap:6px}.lvdca-reset-btn:hover{background:rgba(255,59,92,.08)}.lvdca-reset-btn:disabled{opacity:.6;cursor:not-allowed}
.lvdca-empty{margin:0;color:var(--text-subtle);font-size:.76rem}
.lvdca-note{margin:0 0 14px;font-size:.72rem}.lvdca-note.is-warn{color:#fbbf24}
.lvdca-signal-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px 18px;margin-bottom:6px}.lvdca-signal-grid div{display:flex;flex-direction:column;gap:4px}.lvdca-signal-grid span{color:var(--text-muted);font-size:.68rem}.lvdca-signal-grid strong{color:var(--text);font-family:var(--term-mono,inherit);font-size:.9rem}.lvdca-signal-grid strong.is-danger{color:var(--red)}
.lvdca-position-grid{display:flex;flex-wrap:wrap;gap:12px}.lvdca-position{display:flex;flex-direction:column;gap:3px;padding:10px 14px;background:var(--surface-soft);border:1px solid var(--border);border-radius:9px;min-width:140px}.lvdca-position span{color:var(--text-muted);font-size:.68rem;font-weight:700}.lvdca-position strong{color:var(--text);font-family:var(--term-mono,inherit)}.lvdca-position small{color:var(--text-subtle);font-size:.65rem}
.lvdca-badge{display:inline-block;margin-bottom:12px;padding:4px 10px;border-radius:99px;font-size:.68rem;font-weight:800}.lvdca-badge.is-success{background:var(--green-bg);color:var(--green)}.lvdca-badge.is-error{background:var(--red-bg);color:var(--red)}.lvdca-badge.is-muted{background:var(--surface-soft);color:var(--text-muted)}
p.lvdca-badge{display:block;width:fit-content}
.lvdca-divider{margin:16px 0;border:none;border-top:1px solid var(--border)}
.lvdca-check-list{display:grid;gap:7px;margin:12px 0 0;padding:0;list-style:none}.lvdca-check-list li{display:flex;align-items:center;gap:8px;padding:8px 10px;background:var(--surface-soft);border:1px solid var(--border);border-radius:8px;font-size:.74rem;color:var(--text-muted)}.lvdca-check-list li.is-ok{color:var(--green)}.lvdca-check-list li.is-ok i{color:var(--green)}.lvdca-check-list li.is-fail i{color:var(--red)}
.lvdca-table-wrap{overflow-x:auto;border:1px solid var(--border);border-radius:9px;margin-top:10px}.lvdca-table-wrap table{width:100%;min-width:560px;border-collapse:collapse}.lvdca-table-wrap th{padding:9px 10px;text-align:left;color:var(--text-subtle);background:var(--surface-soft);font-size:.64rem}.lvdca-table-wrap td{padding:8px 10px;border-top:1px solid var(--border);font-size:.74rem;color:var(--text)}
.lvdca-metric small{display:block;margin-top:5px;color:var(--text-muted);font-size:.66rem;font-variant-numeric:tabular-nums}.lvdca-table-wrap td.is-up{color:var(--green)}.lvdca-table-wrap td.is-down{color:var(--red)}.lvdca-table-wrap td small{color:var(--text-muted);font-size:.64rem}
@media(max-width:760px){.lvdca-head{align-items:flex-start;flex-direction:column}.lvdca-config-grid{grid-template-columns:1fr}.lvdca-metric-grid{grid-template-columns:1fr 1fr}.lvdca-signal-grid{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.lvdca-metric-grid{grid-template-columns:1fr}.lvdca-signal-grid{grid-template-columns:1fr}}

/* 대시보드 KQS 추천 요약: 기준일·만료 시각 한 줄 */
.jy-kqs-meta{margin:0 0 10px;color:var(--text-muted,#94a3b8);font-size:.75rem;line-height:1.5}

/* ── 전략 추천 (EINT-017): 3개 아이템 나란히 + 보유 종목 매도 신호 ── */
.sb-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;flex-wrap:wrap;margin-bottom:16px}
.sb-head h1{margin:0 0 6px;font-size:1.25rem;color:var(--text)}
.sb-head p{margin:0;color:var(--text-muted);font-size:.8rem}
.sb-actions{display:flex;gap:8px;flex-wrap:wrap}
.sb-actions button:not(.run-btn){padding:8px 12px;color:var(--text);background:var(--surface-soft);border:1px solid var(--border);border-radius:8px;font-size:.8rem;cursor:pointer}
.sb-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-bottom:18px}
@media (max-width:1100px){.sb-grid{grid-template-columns:1fr}}
.sb-item{display:flex;flex-direction:column;padding:16px;background:var(--surface);border:1px solid var(--border);border-radius:12px;min-width:0}
.sb-item>header{display:grid;grid-template-columns:1fr auto;gap:2px 8px;align-items:center}
.sb-label{grid-column:1;color:var(--primary);font-size:.72rem;font-weight:700;letter-spacing:.02em}
.sb-item h2{grid-column:1;margin:0;font-size:1rem;color:var(--text)}
.sb-count{grid-row:1/3;grid-column:2;padding:4px 10px;border-radius:999px;background:var(--surface-soft);color:var(--text);font-size:.78rem;font-weight:700}
.sb-count.is-alert{background:rgba(239,68,68,.18);color:#f87171}
.sb-summary{margin:8px 0 10px;color:var(--text-muted);font-size:.74rem;line-height:1.5}
.sb-picks{list-style:none;margin:0;padding:0;display:grid;gap:6px;flex:1}
.sb-pick details{background:var(--surface-soft);border:1px solid var(--border);border-radius:8px}
.sb-pick summary{display:grid;grid-template-columns:26px 1fr auto;gap:8px;align-items:center;padding:9px 10px;cursor:pointer;list-style:none}
.sb-pick summary::-webkit-details-marker{display:none}
.sb-rank{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--primary);color:#111;font-size:.72rem;font-weight:800}
.sb-name{display:flex;flex-direction:column;min-width:0}
.sb-name strong{color:var(--text);font-size:.86rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sb-name small,.sb-sells td small{color:var(--text-muted);font-size:.7rem}
.sb-close{color:var(--text);font-size:.8rem;font-variant-numeric:tabular-nums}
.sb-reasons{margin:0;padding:0 12px 8px 30px;color:#cbd5e1;font-size:.72rem;line-height:1.6}
.sb-note{margin:6px 10px 10px;color:var(--text-muted);font-size:.7rem;line-height:1.5}
.sb-item>footer{display:flex;flex-direction:column;gap:2px;margin-top:10px;padding-top:8px;border-top:1px solid var(--border);color:var(--text-muted);font-size:.68rem}
.sb-empty{margin:8px 0;color:var(--text-muted);font-size:.78rem}
.sb-error{color:#f87171}
.sb-sells{padding:16px;background:var(--surface);border:1px solid var(--border);border-radius:12px}
.sb-sells>header{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}
.sb-sells h2{margin:0;font-size:1rem;color:var(--text)}
.sb-table{overflow-x:auto}
.sb-sells table{width:100%;border-collapse:collapse;font-size:.78rem}
.sb-sells th{padding:8px;text-align:left;color:var(--text-muted);font-size:.7rem;font-weight:600;border-bottom:1px solid var(--border)}
.sb-sells td{padding:8px;color:var(--text);border-bottom:1px solid var(--border);vertical-align:top}
.sb-sells td small{display:block}
.sb-sells tr.is-alert td{background:rgba(239,68,68,.07)}
.sb-levels{color:var(--text-muted)!important;font-size:.72rem}
.sb-badge{display:inline-block;padding:2px 8px;border-radius:999px;font-size:.7rem;font-weight:700}
.sb-badge.is-sell{background:rgba(239,68,68,.2);color:#f87171}
.sb-badge.is-hold{background:rgba(34,197,94,.16);color:#4ade80}
.sb-badge.is-muted{background:var(--surface-soft);color:var(--text-muted)}
.sb-disclaimer{margin:12px 0 0;color:var(--text-muted);font-size:.7rem}
.sb-login{max-width:600px;margin:64px auto;padding:34px;background:var(--surface);border:1px solid var(--border);border-radius:14px;text-align:center}
.sb-login h1{margin:0 0 10px;color:var(--text);font-size:1.3rem}
.sb-login p{margin:0 0 20px;color:var(--text-muted);font-size:.85rem}
/* EINT-019 추천 성과 */
.ro-panel{margin-bottom:12px;padding:16px;background:var(--surface);border:1px solid var(--border);border-radius:12px}
.ro-title{margin:0 0 6px;font-size:1rem;color:var(--text)}
.ro-sub{margin:0 0 12px;color:var(--text-muted);font-size:.74rem;line-height:1.5}
.ro-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
@media (max-width:1100px){.ro-grid{grid-template-columns:1fr}}
.ro-item{padding:12px;background:var(--surface-soft);border:1px solid var(--border);border-radius:10px;min-width:0}
.ro-item h3{margin:2px 0 4px;font-size:.9rem;color:var(--text)}
.ro-meta{color:var(--text-muted);font-size:.7rem}
.ro-subtitle{margin:16px 0 8px;font-size:.88rem;color:var(--text)}
.ro-subtitle small{color:var(--text-muted);font-weight:400}
.ro-table{width:100%;border-collapse:collapse;font-size:.74rem;font-variant-numeric:tabular-nums}
.ro-table th,.ro-table td{padding:6px;text-align:left;border-bottom:1px solid var(--border);color:var(--text);white-space:nowrap}
.ro-table thead th{color:var(--text-muted);font-weight:600}
.ro-table td small{display:block;color:var(--text-muted);font-size:.68rem}
.ro-table tr.is-pending td{opacity:.7}
.ro-up{color:#f87171}.ro-down{color:#60a5fa}.ro-na{color:var(--text-muted)}

/* ── 매매 기록·연구 탭 ── */
.stg-tabs{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 14px;padding-bottom:10px;border-bottom:1px solid var(--border)}
.stg-tab{display:inline-flex;align-items:center;gap:6px;padding:8px 14px;color:var(--text-muted);background:var(--surface);border:1px solid var(--border);border-radius:8px;font-size:.8rem;font-weight:600;cursor:pointer}
.stg-tab:hover{color:var(--text);background:var(--surface-hover)}
.stg-tab.is-active{color:#111;background:var(--primary);border-color:var(--primary)}
.stg-tab-desc{margin:0 0 12px;color:var(--text-muted);font-size:.78rem;line-height:1.6}

/* ── 국내 종목명 자동완성 (EINT-018) ── */
.stock-search{position:relative;display:inline-block}
.stock-search-list{position:absolute;z-index:40;top:calc(100% + 4px);left:0;min-width:100%;width:max-content;max-width:360px;max-height:300px;overflow-y:auto;margin:0;padding:4px;list-style:none;background:var(--surface);border:1px solid var(--border-strong);border-radius:8px;box-shadow:0 8px 24px rgba(0,0,0,.35)}
.stock-search-item{display:flex;justify-content:space-between;gap:12px;padding:8px 10px;border-radius:6px;cursor:pointer;font-size:.82rem;color:var(--text)}
.stock-search-item span{color:var(--text-muted);font-size:.72rem;white-space:nowrap}
.stock-search-item.is-active,.stock-search-item:hover{background:var(--surface-hover)}
.stock-search-empty{padding:8px 10px;color:var(--text-muted);font-size:.78rem}