:root {
  --paper: #f3ead8;
  --paper-2: #e8dcc4;
  --ink: #16130e;
  --ink-soft: #4a4336;
  --ink-faint: #7a7162;
  --navy: #0c1a2e;
  --navy-2: #14263f;
  --navy-3: #1c3454;
  --gold: #b8923a;
  --gold-hi: #d4b45c;
  --gold-dim: rgba(184, 146, 58, 0.16);
  --cream: #fffaf1;
  --card: #fffdf8;
  --line: #d7cbb4;
  --line-hi: #c2b397;
  --bull: #18794a;
  --bull-bg: #e4f3ea;
  --bear: #b42318;
  --bear-bg: #fbe7e5;
  --amber: #9a6b12;
  --amber-bg: #f6ead0;
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --serif: "Playfair Display", "Times New Roman", Times, serif;
  --sans: "Source Sans 3", "Segoe UI", sans-serif;
  --card-sans: "Nunito Sans", "Segoe UI", sans-serif;
  --mono: "IBM Plex Mono", ui-monospace, monospace;
  --shadow: 0 10px 28px rgba(12, 26, 46, 0.08);
}

* { box-sizing: border-box; margin: 0; }

body {
  background:
    linear-gradient(180deg, rgba(12, 26, 46, 0.03), transparent 180px),
    repeating-linear-gradient(90deg, transparent 0 47px, rgba(12, 26, 46, 0.025) 47px 48px),
    var(--paper);
  color: var(--ink);
  font-family: var(--sans);
  padding: 0 0 calc(3rem + env(safe-area-inset-bottom, 0px));
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}

body.auth-pending { min-height: 100vh; overflow: hidden; background: var(--navy); }
body.auth-pending > .masthead,
body.auth-pending > .tape,
body.auth-pending > .pwa-install-tip,
body.auth-pending > .wrap { visibility: hidden; }

.tape {
  overflow: hidden;
  background: #091320;
  border-bottom: 1px solid rgba(184, 146, 58, .35);
  color: var(--gold-hi);
  font-family: var(--mono);
  font-size: .68rem;
  font-weight: 600;
  letter-spacing: .12em;
  white-space: nowrap;
}
.tape-track {
  display: inline-block;
  padding: .38rem 0;
  animation: tape-scroll 36s linear infinite;
}
@keyframes tape-scroll {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}
@media (prefers-reduced-motion: reduce) {
  .tape-track { animation: none; }
}

/* ---------- auth / membership pass ---------- */
.auth-gate {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: grid;
  place-items: center;
  padding: max(1.25rem, env(safe-area-inset-top, 0px)) max(1.25rem, env(safe-area-inset-right, 0px)) max(1.25rem, env(safe-area-inset-bottom, 0px)) max(1.25rem, env(safe-area-inset-left, 0px));
  overflow: auto;
  background:
    radial-gradient(circle at 12% 0%, rgba(212, 180, 92, 0.16), transparent 32%),
    linear-gradient(165deg, #08121f 0%, #0c1a2e 48%, #163050 100%);
}
.auth-gate[hidden] { display: none; }
.auth-gate::before {
  content: "";
  position: absolute;
  inset: 0;
  opacity: .18;
  background-image:
    linear-gradient(rgba(212, 180, 92, .18) 1px, transparent 1px),
    linear-gradient(90deg, rgba(212, 180, 92, .18) 1px, transparent 1px);
  background-size: 42px 42px;
  mask-image: linear-gradient(to bottom, black, transparent 82%);
}
.auth-shell {
  position: relative;
  width: min(760px, 100%);
  padding: 1px;
  background: linear-gradient(135deg, var(--gold-hi), rgba(184, 146, 58, .35) 45%, var(--gold));
  box-shadow: 0 28px 70px rgba(0, 0, 0, .45);
}
.auth-card {
  position: relative;
  display: grid;
  grid-template-columns: .9fr 1.25fr;
  min-height: 440px;
  overflow: hidden;
  background: linear-gradient(160deg, #102036, #0b1728);
}
.auth-aside {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 2rem 1.7rem;
  border-right: 1px solid rgba(212, 180, 92, .22);
  background: linear-gradient(180deg, rgba(184, 146, 58, .1), transparent 55%);
  overflow: hidden;
}
.auth-aside::after {
  content: "";
  position: absolute;
  width: 220px;
  height: 220px;
  left: -115px;
  bottom: -95px;
  border: 1px solid rgba(212, 180, 92, .28);
  border-radius: 50%;
  box-shadow: 0 0 0 32px rgba(212, 180, 92, .04);
}
.auth-wordmark {
  color: #f7f1e4;
  font-family: var(--serif);
  font-size: 2.1rem;
  font-weight: 700;
  letter-spacing: -.03em;
  line-height: .9;
}
.auth-wordmark span { display: block; color: var(--gold-hi); }
.auth-aside-copy {
  position: relative;
  z-index: 1;
  max-width: 15.5rem;
  color: #cfc4aa;
  font-size: .78rem;
  line-height: 1.65;
}
.auth-signal {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: .55rem;
  color: #d8c89a;
  font-size: .62rem;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.auth-signal i {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--gold-hi);
  box-shadow: 0 0 12px var(--gold);
}
.auth-form-body {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 2.25rem 2.1rem;
  background: var(--cream);
}
.auth-route {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  color: var(--ink-faint);
  font-size: .62rem;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.auth-route b { color: var(--navy); font-weight: 700; }
.auth-form-body h1 {
  margin: .7rem 0 .3rem;
  color: var(--navy);
  font-family: var(--serif);
  font-size: 1.85rem;
  letter-spacing: -.03em;
}
.auth-copy { margin-bottom: 1.3rem; color: var(--ink-soft); font-size: .86rem; }
.auth-field { display: block; margin-top: .8rem; }
.auth-field span {
  display: block;
  margin-bottom: .35rem;
  color: var(--ink-soft);
  font-size: .66rem;
  font-weight: 700;
  letter-spacing: .11em;
  text-transform: uppercase;
}
.auth-field input {
  width: 100%;
  min-height: 2.85rem;
  padding: .65rem .8rem;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  outline: none;
  color: var(--ink);
  background: #fff;
  font: 600 .9rem var(--sans);
}
.auth-field input:focus {
  border-color: var(--gold);
  box-shadow: 0 0 0 3px var(--gold-dim), inset 3px 0 var(--gold);
}
.auth-submit {
  width: 100%;
  min-height: 2.9rem;
  margin-top: 1.15rem;
  border: 0;
  border-radius: var(--radius-sm);
  color: #f8f1de;
  background: linear-gradient(180deg, #1a3354, var(--navy));
  font: 700 .78rem var(--sans);
  letter-spacing: .1em;
  text-transform: uppercase;
  cursor: pointer;
}
.auth-submit:hover { filter: brightness(1.08); }
.auth-submit:disabled { opacity: .55; cursor: wait; }
.auth-error { min-height: 1.15rem; margin-top: .7rem; color: var(--bear); font-size: .75rem; }
.auth-meta {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: .45rem .75rem;
  margin-top: 1rem;
  padding-top: .75rem;
  border-top: 1px solid var(--line);
  color: var(--ink-faint);
  font-size: .62rem;
  text-transform: uppercase;
  letter-spacing: .06em;
}
.auth-install {
  margin-left: auto;
  padding: 0;
  border: 0;
  color: var(--gold-hi);
  background: transparent;
  font: inherit;
  letter-spacing: inherit;
  text-transform: inherit;
  cursor: pointer;
}
.auth-install:hover { color: #fff8ea; }
@media (max-width: 620px) {
  .auth-card { grid-template-columns: 1fr; }
  .auth-aside { min-height: 150px; padding: 1.35rem 1.4rem; border-right: 0; border-bottom: 1px solid rgba(212, 180, 92, .22); }
  .auth-wordmark { font-size: 1.55rem; }
  .auth-aside-copy { display: none; }
  .auth-form-body { padding: 1.65rem 1.4rem 1.5rem; }
}

/* ---------- masthead ---------- */
.masthead {
  position: sticky;
  top: 0;
  z-index: 50;
  padding-top: env(safe-area-inset-top, 0px);
  background: var(--navy);
  color: #f4ead6;
  border-bottom: 3px solid var(--gold);
  box-shadow: 0 8px 24px rgba(12, 26, 46, .18);
}
.masthead-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  max-width: 1180px;
  margin: 0 auto;
  padding: .85rem 1.2rem .8rem;
}
.market-clock {
  flex: 0 0 auto;
  width: 17.5rem;
  padding: .55rem .65rem .5rem;
  border: 1px solid rgba(212, 180, 92, .38);
  border-radius: 8px;
  background: linear-gradient(145deg, rgba(255,255,255,.075), rgba(255,255,255,.025));
  box-shadow: inset 0 1px rgba(255,255,255,.06), 0 8px 20px rgba(0,0,0,.14);
  font-family: var(--mono);
}
.market-clock-times { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: .55rem; }
.market-clock-times > i { width: 1px; height: 1.8rem; background: rgba(212, 180, 92, .28); }
.market-clock-times > div { display: grid; grid-template-columns: 1fr auto; align-items: baseline; column-gap: .35rem; }
.market-clock-times span { grid-column: 1 / -1; color: #adbdcf; font: 700 .52rem var(--sans); letter-spacing: .1em; text-transform: uppercase; }
.market-clock-times time { color: #fff8ea; font-size: .88rem; font-weight: 700; letter-spacing: .025em; line-height: 1.2; }
.market-clock-times small { color: var(--gold-hi); font-size: .48rem; font-weight: 700; }
.market-session-row { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: .45rem; margin-top: .45rem; padding-top: .42rem; border-top: 1px solid rgba(212,180,92,.18); }
.market-session-badge { display: inline-flex; align-items: center; gap: .25rem; color: #d9cdb5; font: 700 .52rem var(--sans); white-space: nowrap; }
.market-session-badge i { width: 6px; height: 6px; border-radius: 50%; background: #8793a2; box-shadow: 0 0 7px currentColor; }
.market-session-badge b { color: #fff8ea; letter-spacing: .04em; }
.market-session-badge.is-open { color: #6ed49a; }
.market-session-badge.is-open i { background: #45c77d; }
.market-session-badge.is-premarket { color: var(--gold-hi); }
.market-session-badge.is-premarket i { background: var(--gold-hi); }
.market-countdown-label { min-width: 0; overflow: hidden; color: #9eacbd; font: 600 .5rem var(--sans); text-align: right; text-overflow: ellipsis; white-space: nowrap; }
.market-session-row strong { color: #fff8ea; font-size: .66rem; letter-spacing: .04em; white-space: nowrap; }
.masthead-brand { min-width: 0; }
.masthead-kicker {
  display: flex;
  align-items: center;
  gap: .45rem;
  color: var(--gold-hi);
  font-size: .62rem;
  font-weight: 700;
  letter-spacing: .16em;
  text-transform: uppercase;
}
.masthead-kicker::before {
  content: "";
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--gold-hi);
  box-shadow: 0 0 8px var(--gold);
  animation: live-blink 2.2s ease-in-out infinite;
}
@keyframes live-blink {
  0%, 100% { opacity: 1; }
  50% { opacity: .35; }
}
.masthead h1 {
  margin: .12rem 0 0;
  font-family: var(--serif);
  font-size: clamp(1.7rem, 3vw, 2.25rem);
  font-weight: 700;
  letter-spacing: -.03em;
  color: #fff8ea;
  line-height: 1;
}
.masthead h1 em {
  font-style: normal;
  color: var(--gold-hi);
}
.masthead-meta {
  display: flex;
  align-items: center;
  gap: .85rem;
  flex-wrap: wrap;
  justify-content: flex-end;
}
.masthead-date {
  color: #d8cbae;
  font-size: .78rem;
  text-align: right;
}
.masthead-date small {
  display: block;
  margin-top: .12rem;
  color: var(--gold);
  font-size: .58rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.account-actions { display: flex; align-items: center; gap: .45rem; }
.account-identity {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  min-height: 2.25rem;
  padding: .4rem .75rem;
  border: 1px solid rgba(212, 180, 92, .35);
  border-radius: 999px;
  color: #efe4cc;
  background: rgba(255, 255, 255, .05);
  font: 600 .72rem var(--sans);
}
.account-identity svg { flex: 0 0 auto; color: var(--gold-hi); }
.account-icon-btn {
  width: 2.25rem;
  height: 2.25rem;
  display: inline-grid;
  place-items: center;
  padding: 0;
  border: 1px solid rgba(242, 180, 176, .35);
  border-radius: 50%;
  color: #f3c4bf;
  background: rgba(180, 35, 24, .18);
  cursor: pointer;
}
.account-icon-btn:hover:not(:disabled) { background: rgba(180, 35, 24, .32); color: #fff; }
.account-icon-btn:disabled { opacity: .55; cursor: wait; }
.account-icon-btn.is-saving svg { animation: account-spin .8s linear infinite; }
.install-btn {
  border-color: rgba(212, 180, 92, .45);
  color: var(--gold-hi);
  background: rgba(184, 146, 58, .16);
}
.install-btn:hover:not(:disabled) {
  border-color: var(--gold);
  color: #fff8ea;
  background: rgba(184, 146, 58, .32);
}
.pwa-install-tip {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  padding: .55rem 1.2rem .55rem max(1.2rem, env(safe-area-inset-left, 0px));
  padding-right: max(1.2rem, env(safe-area-inset-right, 0px));
  background: var(--navy-2);
  border-bottom: 1px solid rgba(212, 180, 92, .28);
  color: #efe4cc;
  font-size: .78rem;
}
.pwa-install-tip[hidden] { display: none; }
.pwa-install-tip b { color: var(--gold-hi); font-weight: 700; }
.pwa-install-tip button {
  flex: 0 0 auto;
  padding: .22rem .5rem;
  border: 1px solid rgba(212, 180, 92, .35);
  border-radius: 999px;
  color: var(--gold-hi);
  background: transparent;
  font: 700 .62rem var(--sans);
  letter-spacing: .06em;
  text-transform: uppercase;
  cursor: pointer;
}
body.is-offline #sessionBadge { color: #f3c4bf; }
@media (display-mode: standalone) {
  .install-btn,
  .auth-install,
  .pwa-install-tip { display: none !important; }
}
@keyframes account-spin { to { transform: rotate(360deg); } }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
@media (max-width: 700px) {
  .market-clock { width: 100%; order: -1; }
  .market-clock-times time { font-size: 1rem; }
  .masthead-inner { flex-direction: column; align-items: flex-start; }
  .masthead-meta { width: 100%; justify-content: space-between; }
  .masthead-date { text-align: left; }
}

.wrap { max-width: 1180px; margin: 0 auto; padding: 1.35rem 1.15rem 0; }

/* ---------- desk intro / blotter tools ---------- */
.desk-intro { margin-bottom: 1.15rem; }
.desk-intro .sub {
  color: var(--ink-soft);
  font-size: .95rem;
}
.company-import {
  margin-top: 1rem;
  padding: 1rem 1.05rem 1.05rem;
  background: var(--card);
  border: 1px solid var(--line);
  border-top: 3px solid var(--navy);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow);
}
.company-import > label {
  display: block;
  margin-bottom: .55rem;
  color: var(--navy);
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.manual-company-form {
  display: grid;
  grid-template-columns: .75fr 1.6fr .65fr auto;
  gap: .5rem;
}
.manual-company-form input {
  width: 100%;
  min-height: 2.5rem;
  padding: .5rem .7rem;
  color: var(--ink);
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  font: 500 .92rem var(--sans);
}
.manual-company-form input:focus {
  outline: none;
  border-color: var(--gold);
  box-shadow: 0 0 0 3px var(--gold-dim);
}
.manual-company-form button {
  min-height: 2.5rem;
  padding: .5rem 1rem;
  color: #fff8ea;
  background: var(--navy);
  border: 0;
  border-radius: var(--radius-sm);
  font: 700 .78rem var(--sans);
  letter-spacing: .06em;
  text-transform: uppercase;
  cursor: pointer;
}
.manual-company-form button:hover { background: var(--navy-3); }
.import-actions,
.utility-actions { display: flex; align-items: center; flex-wrap: wrap; gap: .55rem; margin-top: .7rem; }
.csv-label,
.utility-btn {
  display: inline-flex;
  align-items: center;
  min-height: 2.15rem;
  padding: .4rem .8rem;
  border: 1px solid var(--line-hi);
  border-radius: var(--radius-sm);
  color: var(--navy);
  background: var(--cream);
  font: 700 .72rem var(--sans);
  letter-spacing: .04em;
  text-transform: uppercase;
  cursor: pointer;
}
.csv-label:hover,
.utility-btn:hover { border-color: var(--gold); color: var(--amber); }
.csv-label input { display: none; }
.gics-btn { border-color: #c9b27a; color: #7a5d18; }
.import-status { color: var(--ink-faint); font-size: .8rem; }
.live-all-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .42rem;
  min-height: 2.25rem;
  padding: .4rem .9rem;
  border: 0;
  border-radius: var(--radius-sm);
  color: var(--navy);
  background: linear-gradient(180deg, var(--gold-hi), var(--gold));
  font: 800 .72rem var(--sans);
  letter-spacing: .05em;
  text-transform: uppercase;
  cursor: pointer;
}
.live-all-btn:hover:not(:disabled) { filter: brightness(1.06); }
.live-all-btn:disabled { opacity: .68; cursor: wait; }
.live-all-btn.is-loading svg { animation: account-spin .8s linear infinite; }
.live-update-stamp {
  display: inline-flex;
  align-items: center;
  gap: .38rem;
  min-height: 2rem;
  color: var(--ink-faint);
  font-size: .72rem;
  font-weight: 600;
}
.live-update-stamp::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--line-hi); }
.live-update-stamp.has-data { color: var(--ink-soft); }
.live-update-stamp.has-data::before { background: var(--bull); }
.csv-preview {
  margin-top: .7rem;
  padding: .75rem;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: var(--paper);
  font-size: .8rem;
  color: var(--ink-soft);
}
.csv-preview[hidden] { display: none; }
.csv-preview-list { max-height: 7rem; overflow: auto; margin: .45rem 0; color: var(--ink-faint); }
.csv-preview-error { color: var(--bear); }
.csv-preview-actions { display: flex; gap: .45rem; }
@media (max-width: 650px) {
  .manual-company-form { grid-template-columns: 1fr 1fr; }
  .manual-company-form button { grid-column: span 2; }
}

/* ---------- market board ---------- */
.floor-board {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .85rem;
  margin: 0 0 1.4rem;
}
.dashboard-widget {
  position: relative;
  width: auto;
  min-height: 100%;
  padding: .95rem .95rem .85rem;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: var(--card);
  box-shadow: var(--shadow);
  font-family: var(--card-sans);
}
.dashboard-widget.is-hidden { display: none; }
.heatmap-rank { border-top: 3px solid var(--gold); }
.gain-summary { border-top: 3px solid var(--bull); }
.gics-summary { border-top: 3px solid var(--navy); }
.loss-summary { border-top: 3px solid var(--bear); }
.heatmap-rank-kicker,
.gain-summary-kicker,
.gics-summary-kicker,
.loss-summary-kicker {
  display: flex;
  align-items: center;
  gap: .4rem;
  font-size: .62rem;
  font-weight: 800;
  letter-spacing: .11em;
  text-transform: uppercase;
}
.heatmap-rank-kicker { color: var(--amber); }
.gain-summary-kicker { color: var(--bull); }
.gics-summary-kicker { color: var(--navy); }
.loss-summary-kicker { color: var(--bear); }
.heatmap-rank-kicker i,
.gain-summary-kicker i,
.gics-summary-kicker i,
.loss-summary-kicker i {
  width: .44rem;
  height: .44rem;
  border-radius: 50%;
}
.heatmap-rank-kicker i { background: var(--gold); }
.gain-summary-kicker i { background: var(--bull); }
.gics-summary-kicker i { background: var(--navy); border: 0; box-shadow: none; }
.loss-summary-kicker i { background: var(--bear); }
.heatmap-rank-title,
.gain-summary-title,
.gics-summary-title,
.loss-summary-title {
  margin-top: .18rem;
  color: var(--ink);
  font-family: var(--card-sans);
  font-size: 1.02rem;
  font-weight: 700;
}
.heatmap-rank-head,
.gain-summary-head,
.gics-summary-head,
.loss-summary-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: .6rem;
}
.gics-summary-total,
.gain-summary-count,
.loss-summary-count {
  font-family: var(--card-sans);
  font-size: 1.45rem;
  font-weight: 700;
  line-height: 1;
  text-align: right;
}
.gics-summary-total { color: var(--navy); }
.gain-summary-count { color: var(--bull); }
.loss-summary-count { color: var(--bear); }
.gics-summary-total small,
.gain-summary-count small,
.loss-summary-count small {
  display: block;
  margin-top: .2rem;
  color: var(--ink-faint);
  font-family: var(--card-sans);
  font-size: .52rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.gics-summary-meter {
  height: .32rem;
  margin: .75rem 0 .65rem;
  overflow: hidden;
  border-radius: 999px;
  background: var(--paper-2);
}
.gics-summary-meter > span {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, var(--navy), var(--gold));
  transition: width .25s ease;
}
.gics-summary-meta,
.heatmap-rank-note,
.gain-summary-date,
.loss-summary-date {
  color: var(--ink-faint);
  font-size: .68rem;
}
.gics-summary-meta { display: flex; justify-content: space-between; gap: .75rem; }
.gics-summary-list,
.heatmap-rank-list,
.gain-summary-list,
.loss-summary-list { display: grid; gap: .4rem; margin-top: .7rem; }
.gics-summary-row,
.heatmap-rank-row,
.gain-summary-row,
.loss-summary-row {
  display: grid;
  align-items: center;
  gap: .48rem;
  min-height: 1.85rem;
  padding: .28rem .38rem;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--cream);
}
.gics-summary-row {
  appearance: none;
  -webkit-appearance: none;
  grid-template-columns: minmax(0, 1fr) auto;
  width: 100%;
  color: var(--ink-soft);
  font: inherit;
  font-size: .78rem;
  text-align: left;
  cursor: pointer;
  transition: border-color .12s, background .12s;
}
.gics-summary-row:hover,
.gics-summary-row:focus-visible {
  border-color: var(--gold);
  outline: none;
  background: var(--gold-dim);
}
.gics-summary-row span:first-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gics-summary-row b {
  min-width: 1.35rem;
  padding: .1rem .3rem;
  border-radius: 999px;
  color: var(--navy);
  background: var(--gold-dim);
  font-size: .68rem;
  text-align: center;
}
.heatmap-rank-row,
.gain-summary-row,
.loss-summary-row {
  appearance: none;
  -webkit-appearance: none;
  width: 100%;
  font: inherit;
  text-align: left;
  cursor: pointer;
  transition: border-color .12s, background .12s;
}
.heatmap-rank-row { grid-template-columns: auto minmax(0, 1fr) auto; }
.heatmap-rank-row.worst { background: var(--bear-bg); border-color: #efc8c4; }
.gain-summary-row { grid-template-columns: auto minmax(0, 1fr) auto; }
.loss-summary-row { grid-template-columns: auto minmax(0, 1fr) auto; }
.heatmap-rank-row:hover,
.heatmap-rank-row:focus-visible,
.gain-summary-row:hover,
.gain-summary-row:focus-visible {
  border-color: var(--gold);
  outline: none;
  background: var(--gold-dim);
}
.heatmap-rank-row.worst:hover,
.heatmap-rank-row.worst:focus-visible,
.loss-summary-row:hover,
.loss-summary-row:focus-visible {
  border-color: var(--gold);
  outline: none;
  background: #f7d7d3;
}
.heatmap-rank-cells { display: flex; gap: 2px; }
.heatmap-rank-cells i { width: 6px; height: 6px; border-radius: 1px; background: var(--line-hi); }
.heatmap-rank-cells i.pos { background: var(--bull); }
.heatmap-rank-cells i.neg { background: var(--bear); }
.heatmap-rank-cells i.zero { background: var(--gold); }
.heatmap-rank-ticker,
.gain-summary-ticker,
.loss-summary-ticker {
  display: block;
  color: var(--navy);
  font-size: .78rem;
  font-weight: 800;
  line-height: 1.1;
}
.heatmap-rank-name,
.gain-summary-name,
.loss-summary-name {
  display: block;
  overflow: hidden;
  color: var(--ink-faint);
  font-size: .66rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.heatmap-rank-score,
.gain-summary-change,
.loss-summary-change { font-family: var(--card-sans); font-size: .74rem; font-weight: 800; }
.heatmap-rank-score.best,
.gain-summary-change { color: var(--bull); }
.heatmap-rank-score.worst,
.loss-summary-change { color: var(--bear); }
.gain-summary-rank,
.loss-summary-rank { width: 1.1rem; color: var(--ink-faint); font-size: .66rem; font-weight: 800; text-align: center; }
.heatmap-rank-toggle {
  display: flex;
  padding: .15rem;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--paper);
}
.heatmap-rank-toggle button {
  padding: .28rem .38rem;
  border: 0;
  border-radius: 4px;
  color: var(--ink-faint);
  background: transparent;
  font: 800 .58rem var(--sans);
  letter-spacing: .04em;
  text-transform: uppercase;
  cursor: pointer;
}
.heatmap-rank-toggle button.active[data-heatmap-mode="best"] { color: #fff; background: var(--bull); }
.heatmap-rank-toggle button.active[data-heatmap-mode="worst"] { color: #fff; background: var(--bear); }
.heatmap-rank-toggle button.active[data-heatmap-mode="days"] { color: var(--navy); background: var(--gold); }
.heatmap-rank-empty,
.gics-summary-empty,
.gain-summary-empty,
.loss-summary-empty { margin-top: .55rem; color: var(--ink-faint); font-size: .78rem; line-height: 1.5; }
@media (max-width: 1100px) { .floor-board { grid-template-columns: 1fr 1fr; } }
@media (max-width: 700px) { .floor-board { grid-template-columns: 1fr; } }

/* ---------- GICS sector holdings dialog ---------- */
.gics-sector-backdrop {
  position: fixed;
  inset: 0;
  z-index: 85;
  display: grid;
  place-items: center;
  padding: 1.25rem;
  background: rgba(12, 26, 46, .55);
  backdrop-filter: blur(5px);
}
.gics-sector-backdrop[hidden] { display: none; }
.gics-sector-dialog {
  display: flex;
  flex-direction: column;
  width: min(32rem, 100%);
  max-height: min(32rem, calc(100vh - 2.5rem));
  overflow: hidden;
  border: 1px solid var(--gold);
  border-radius: var(--radius-md);
  background: var(--cream);
  box-shadow: 0 28px 80px rgba(12, 26, 46, .35);
}
.gics-sector-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: .75rem;
  padding: .85rem 1rem;
  border-bottom: 1px solid var(--line);
  background: var(--navy);
}
.gics-sector-kicker {
  color: var(--gold-hi);
  font-size: .62rem;
  font-weight: 800;
  letter-spacing: .11em;
  text-transform: uppercase;
}
.gics-sector-head h2 {
  margin-top: .18rem;
  color: #fff8ea;
  font-family: var(--card-sans);
  font-size: 1.08rem;
  font-weight: 700;
  line-height: 1.25;
}
.gics-sector-close {
  display: grid;
  place-items: center;
  width: 1.85rem;
  height: 1.85rem;
  flex: 0 0 auto;
  border: 1px solid rgba(212, 180, 92, .4);
  border-radius: 5px;
  color: var(--gold-hi);
  background: transparent;
  font-size: 1.2rem;
  line-height: 1;
  cursor: pointer;
}
.gics-sector-close:hover,
.gics-sector-close:focus-visible {
  border-color: var(--gold);
  outline: none;
  background: rgba(212, 180, 92, .12);
}
.gics-sector-meta {
  padding: .55rem 1rem 0;
  color: var(--ink-faint);
  font-size: .72rem;
  font-weight: 600;
}
.gics-sector-list {
  display: grid;
  align-content: start;
  gap: .28rem;
  flex: 1;
  min-height: 0;
  margin: .55rem;
  overflow: auto;
}
.gics-sector-row {
  appearance: none;
  -webkit-appearance: none;
  display: grid;
  grid-template-columns: 4.4rem minmax(0, 1fr) auto;
  align-items: center;
  gap: .55rem;
  width: 100%;
  padding: .55rem .6rem;
  border: 1px solid var(--line);
  border-radius: 6px;
  color: var(--ink);
  background: var(--card);
  font: inherit;
  text-align: left;
  cursor: pointer;
}
.gics-sector-row:hover,
.gics-sector-row:focus-visible {
  border-color: var(--gold);
  outline: none;
  background: var(--gold-dim);
}
.gics-sector-ticker {
  color: var(--navy);
  font-family: var(--card-sans);
  font-size: .82rem;
  font-weight: 800;
}
.gics-sector-copy {
  min-width: 0;
}
.gics-sector-copy b {
  display: block;
  overflow: hidden;
  color: var(--navy);
  font-size: .8rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.gics-sector-copy span {
  display: block;
  overflow: hidden;
  margin-top: .1rem;
  color: var(--ink-faint);
  font-size: .68rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.gics-sector-change {
  color: var(--ink-soft);
  font-family: var(--card-sans);
  font-size: .74rem;
  font-weight: 800;
  white-space: nowrap;
}
.gics-sector-change.positive { color: var(--bull); }
.gics-sector-change.negative { color: var(--bear); }
.gics-sector-empty {
  padding: 1.2rem .6rem;
  color: var(--ink-faint);
  font-size: .8rem;
  text-align: center;
}

/* ---------- company snapshot dialog ---------- */
.company-snapshot-backdrop {
  position: fixed;
  inset: 0;
  z-index: 88;
  display: grid;
  place-items: center;
  padding: 1.25rem;
  background: rgba(12, 26, 46, .55);
  backdrop-filter: blur(5px);
}
.company-snapshot-backdrop[hidden] { display: none; }
.company-snapshot-dialog {
  width: min(44rem, 100%);
  max-height: min(46rem, calc(100vh - 2.5rem));
  overflow: hidden;
  border: 1px solid var(--gold);
  border-radius: var(--radius-md);
  background: var(--cream);
  box-shadow: 0 28px 80px rgba(12, 26, 46, .35);
}
.company-snapshot-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: .75rem;
  padding: .85rem 1rem;
  border-bottom: 1px solid var(--line);
  background: var(--navy);
}
.company-snapshot-kicker {
  color: var(--gold-hi);
  font-size: .62rem;
  font-weight: 800;
  letter-spacing: .11em;
  text-transform: uppercase;
}
.company-snapshot-head h2 {
  margin-top: .18rem;
  color: #fff8ea;
  font-family: var(--card-sans);
  font-size: 1.35rem;
  font-weight: 800;
  letter-spacing: -.02em;
  line-height: 1.15;
}
.company-snapshot-head p {
  margin-top: .18rem;
  color: #d8c9a4;
  font-size: .8rem;
  font-weight: 600;
}
.company-snapshot-close {
  display: grid;
  place-items: center;
  width: 1.85rem;
  height: 1.85rem;
  flex: 0 0 auto;
  border: 1px solid rgba(212, 180, 92, .4);
  border-radius: 5px;
  color: var(--gold-hi);
  background: transparent;
  font-size: 1.2rem;
  line-height: 1;
  cursor: pointer;
}
.company-snapshot-close:hover,
.company-snapshot-close:focus-visible {
  border-color: var(--gold);
  outline: none;
  background: rgba(212, 180, 92, .12);
}
.company-snapshot-body { max-height: calc(100vh - 9rem); padding: .9rem 1rem 1rem; overflow-y: auto; }
.company-snapshot-gics {
  margin-bottom: .75rem;
  padding: .3rem .45rem;
  border-left: 3px solid var(--gold);
  background: var(--amber-bg);
  color: var(--navy);
  font-size: .72rem;
  font-weight: 700;
}
.company-snapshot-stats {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .55rem;
}
.company-snapshot-stat {
  min-width: 0;
  padding: .65rem .7rem;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--card);
}
.company-snapshot-stat span {
  display: block;
  color: var(--ink-faint);
  font-size: .58rem;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.company-snapshot-stat b {
  display: block;
  margin-top: .22rem;
  color: var(--navy);
  font-family: var(--card-sans);
  font-size: 1.18rem;
  font-weight: 800;
  line-height: 1.15;
}
.company-snapshot-stat b.positive { color: var(--bull); }
.company-snapshot-stat b.negative { color: var(--bear); }
.company-snapshot-stat b.unavailable { color: var(--ink-faint); font-size: .92rem; font-weight: 700; }
.company-snapshot-stat small {
  display: block;
  margin-top: .22rem;
  color: var(--ink-faint);
  font-size: .66rem;
  font-weight: 600;
}
.company-snapshot-dialog .super-btns {
  order: 0;
  margin-top: .75rem;
  padding-top: .7rem;
}
.company-snapshot-dialog .super-btn { min-height: 2.05rem; font-size: .72rem; }
.company-snapshot-dialog .super-btn .sb-label { display: inline; }
.snapshot-performance { margin-top: .85rem; }
.snapshot-section-heading { display: flex; align-items: end; justify-content: space-between; gap: .75rem; margin-bottom: .55rem; }
.snapshot-section-heading span { color: var(--gold); font-size: .59rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.snapshot-section-heading h3,
.snapshot-breakdown > h3,
.snapshot-volatility h3 { margin: .08rem 0 0; color: var(--navy); font-family: var(--card-sans); font-size: .95rem; font-weight: 800; }
.snapshot-section-heading small { color: var(--ink-faint); font-size: .68rem; font-weight: 700; white-space: nowrap; }
.snapshot-metrics-head,
.snapshot-metric { display: grid; grid-template-columns: minmax(0, 1.2fr) .9fr .9fr; align-items: center; gap: .6rem; }
.snapshot-metrics-head { padding: 0 .65rem .3rem; color: var(--ink-faint); font-size: .57rem; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.snapshot-metrics-head span:nth-child(n+2) { text-align: right; }
.snapshot-metrics { overflow: hidden; border: 1px solid var(--line); border-radius: 7px; background: var(--card); }
.snapshot-metric { padding: .48rem .65rem; border-bottom: 1px solid var(--line); }
.snapshot-metric:last-child { border-bottom: 0; }
.snapshot-metric-name { display: flex; align-items: center; gap: .4rem; color: var(--ink); font-size: .72rem; font-weight: 800; }
.snapshot-metric-name i { display: grid; place-items: center; width: 1.25rem; height: 1.25rem; border-radius: 50%; color: var(--navy); background: var(--paper-2); font-style: normal; font-size: .65rem; }
.snapshot-metric b,
.snapshot-metric strong { text-align: right; font-family: var(--card-sans); font-size: .82rem; }
.snapshot-metric strong { color: var(--ink-soft); }
.snapshot-metric.positive strong { color: var(--bull); }
.snapshot-metric.negative strong { color: var(--bear); }
.snapshot-metric.metric-open { background: #e8f4fc; }
.snapshot-metric.metric-open .snapshot-metric-name i { color: #176b94; background: #cde8f7; }
.snapshot-metric.metric-open strong { color: #176b94; }
.snapshot-metric.metric-low { background: #fff8d9; }
.snapshot-metric.metric-low .snapshot-metric-name i { color: #8a6500; background: #f7e9a8; }
.snapshot-metric.metric-low strong { color: #8a6500; }
.snapshot-metric.metric-high { background: var(--bull-bg); }
.snapshot-metric.metric-high .snapshot-metric-name i { color: var(--bull); background: #c9e7d4; }
.snapshot-metric.metric-high strong { color: var(--bull); }
.snapshot-metric.metric-close { background: var(--bear-bg); }
.snapshot-metric.metric-close .snapshot-metric-name i { color: var(--bear); background: #f3c9c5; }
.snapshot-metric.metric-close strong { color: var(--bear); }
.snapshot-breakdown { margin-top: .9rem; }
.snapshot-breakdown > h3 { margin-bottom: .5rem; }
.snapshot-move { margin-top: .45rem; padding: .65rem .7rem; border: 1px solid var(--line); border-left: 3px solid var(--gold); border-radius: 6px; background: var(--card); }
.snapshot-move.positive { border-left-color: var(--bull); }
.snapshot-move.negative { border-left-color: var(--bear); }
.snapshot-move > div:first-child { display: flex; align-items: center; gap: .45rem; }
.snapshot-move-icon { font-size: .65rem; }
.snapshot-move.positive .snapshot-move-icon { color: var(--bull); }
.snapshot-move.negative .snapshot-move-icon { color: var(--bear); }
.snapshot-move b { color: var(--navy); font-family: var(--card-sans); font-size: .78rem; }
.snapshot-move small { display: block; color: var(--ink-faint); font-size: .63rem; font-weight: 700; }
.snapshot-move > small { margin-top: .55rem; }
.snapshot-move-values { display: flex; align-items: center; gap: .35rem; margin-top: .35rem; color: var(--ink); font-family: var(--card-sans); font-size: .78rem; font-weight: 750; }
.snapshot-move-values i { color: var(--ink-faint); font-style: normal; }
.snapshot-move-values b { margin-left: auto; padding: .15rem .35rem; border-radius: 4px; }
.snapshot-move-values b.positive { color: var(--bull); background: var(--bull-bg); }
.snapshot-move-values b.negative { color: var(--bear); background: var(--bear-bg); }
.snapshot-volatility { margin-top: .9rem; padding: .65rem .7rem; border: 1px solid var(--line); border-radius: 6px; background: var(--amber-bg); }
.snapshot-volatility h3 { margin-bottom: .38rem; }
.snapshot-volatility > div { display: flex; justify-content: space-between; gap: .75rem; padding-top: .3rem; color: var(--ink-soft); font-size: .7rem; font-weight: 700; }
.snapshot-volatility b { color: var(--navy); font-family: var(--card-sans); }
.snapshot-performance-state { display: grid; place-items: center; gap: .3rem; margin-top: .85rem; min-height: 8.5rem; padding: 1rem; border: 1px dashed var(--line); border-radius: 7px; color: var(--navy); text-align: center; background: var(--card); }
.snapshot-performance-state small { color: var(--ink-faint); font-size: .7rem; }
.snapshot-spinner { width: 1.35rem; height: 1.35rem; border: 2px solid var(--line); border-top-color: var(--gold); border-radius: 50%; animation: snapshot-spin .75s linear infinite; }
.snapshot-retry { margin-top: .25rem; padding: .35rem .65rem; border: 1px solid var(--gold); border-radius: 5px; color: var(--navy); background: var(--amber-bg); font: inherit; font-size: .7rem; font-weight: 800; cursor: pointer; }
@keyframes snapshot-spin { to { transform: rotate(360deg); } }
@media (max-width: 420px) {
  .company-snapshot-stats { grid-template-columns: 1fr; }
  .snapshot-metric { grid-template-columns: minmax(0, 1fr) .9fr .8fr; gap: .35rem; }
  .snapshot-metrics-head { grid-template-columns: minmax(0, 1fr) .9fr .8fr; gap: .35rem; }
}

/* ---------- command palette ---------- */
.command-palette-backdrop {
  position: fixed;
  inset: 0;
  z-index: 90;
  display: grid;
  place-items: start center;
  padding: 12vh 1rem 1rem;
  background: rgba(12, 26, 46, .55);
  backdrop-filter: blur(5px);
}
.command-palette-backdrop[hidden] { display: none; }
.command-palette {
  width: min(32rem, 100%);
  overflow: hidden;
  border: 1px solid var(--gold);
  border-radius: var(--radius-md);
  background: var(--cream);
  box-shadow: 0 28px 80px rgba(12, 26, 46, .35);
}
.command-palette-head {
  display: flex;
  align-items: center;
  gap: .65rem;
  padding: .75rem .85rem;
  border-bottom: 1px solid var(--line);
  background: var(--navy);
}
.command-palette-mark {
  display: grid;
  place-items: center;
  width: 1.5rem;
  height: 1.5rem;
  border: 1px solid var(--gold);
  border-radius: 5px;
  color: var(--gold-hi);
  font-size: .72rem;
  font-weight: 800;
}
.command-palette-input {
  flex: 1;
  min-width: 0;
  padding: .25rem 0;
  border: 0;
  outline: 0;
  color: #fff8ea;
  background: transparent;
  font: 600 .95rem var(--sans);
}
.command-palette-input::placeholder { color: #b9ae96; }
.command-palette-esc {
  padding: .18rem .35rem;
  border: 1px solid rgba(212, 180, 92, .4);
  border-radius: 4px;
  color: var(--gold-hi);
  font-size: .58rem;
}
.command-palette-list { display: grid; gap: .18rem; max-height: 18rem; padding: .45rem; overflow: auto; }
.command-item {
  display: grid;
  grid-template-columns: 1.7rem minmax(0, 1fr) auto;
  align-items: center;
  gap: .55rem;
  width: 100%;
  padding: .55rem;
  border: 1px solid transparent;
  border-radius: 6px;
  color: var(--ink);
  background: transparent;
  font: inherit;
  text-align: left;
  cursor: pointer;
}
.command-item:hover,
.command-item:focus { border-color: var(--gold); outline: none; background: var(--gold-dim); }
.command-item-icon {
  display: grid;
  place-items: center;
  width: 1.65rem;
  height: 1.65rem;
  border-radius: 5px;
  color: var(--navy);
  background: var(--gold-dim);
  font-size: .7rem;
  font-weight: 800;
}
.command-item-copy b { display: block; color: var(--navy); font-size: .82rem; }
.command-item-copy span { display: block; margin-top: .12rem; color: var(--ink-faint); font-size: .68rem; }
.command-item-key {
  padding: .16rem .3rem;
  border: 1px solid var(--line);
  border-radius: 4px;
  color: var(--ink-soft);
  font-size: .62rem;
}
.command-palette-empty { padding: 1rem; color: var(--ink-faint); font-size: .8rem; text-align: center; }

/* ---------- company blotter ---------- */
.company-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .8rem;
  margin: 0 0 1.5rem;
}
@media (max-width: 700px) { .company-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 450px) { .company-grid { grid-template-columns: 1fr; } }

.company-card {
  background: var(--card);
  border-radius: var(--radius-md);
  min-height: 11.25rem;
  padding: .95rem .9rem .8rem;
  border: 1px solid var(--line);
  box-shadow: var(--shadow);
  cursor: pointer;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: .12rem;
  color: var(--ink);
  font-family: var(--card-sans);
  transition: border-color .12s, transform .12s;
}
.company-card:hover { border-color: var(--gold); transform: translateY(-1px); }
.company-card.active {
  border-color: var(--navy);
  box-shadow: 0 0 0 2px var(--navy);
}
.company-card .ticker {
  order: 0;
  font-family: var(--card-sans);
  font-weight: 700;
  font-size: 1.28rem;
  letter-spacing: -.02em;
  color: var(--navy);
}
.ticker-snapshot-trigger {
  padding: 0;
  border: 0;
  color: inherit;
  background: transparent;
  font: inherit;
  text-align: left;
  cursor: pointer;
}
.ticker-snapshot-trigger:hover,
.ticker-snapshot-trigger:focus-visible { color: var(--gold); outline: none; text-decoration: underline; text-underline-offset: .16em; }
.company-card .name {
  order: 1;
  font-size: .82rem;
  font-weight: 600;
  color: var(--ink-soft);
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.company-card .stock-price {
  order: 2;
  display: flex;
  align-items: baseline;
  gap: .32rem;
  margin-top: .22rem;
  color: var(--ink);
  font-family: var(--card-sans);
  font-size: 1rem;
  font-weight: 700;
}
.company-card .stock-price small {
  color: var(--ink-faint);
  font-family: var(--card-sans);
  font-size: .52rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.company-card .stock-price.unavailable { color: var(--ink-faint); font-size: .78rem; font-weight: 600; }
.company-card .company-day {
  order: 2;
  margin-top: .15rem;
  color: var(--ink-faint);
  font-size: .72rem;
  font-weight: 600;
}
.company-card .company-date { color: var(--ink-soft); font-weight: 700; }
.company-card .drop-badge {
  order: 3;
  font-family: var(--card-sans);
  font-size: .74rem;
  font-weight: 700;
  color: var(--ink-soft);
  padding: .16rem .55rem;
  border-radius: 999px;
  margin-top: .45rem;
  background: var(--paper);
}
.company-card .drop-badge.positive { color: var(--bull); background: var(--bull-bg); }
.company-card .drop-badge.negative { color: var(--bear); background: var(--bear-bg); }
.drop-badge .badge-source { margin-right: .28rem; font-size: .55rem; letter-spacing: .07em; opacity: .72; }
.gics-badge {
  order: 3;
  margin-top: .38rem;
  width: 100%;
  padding: .3rem .45rem;
  border-left: 3px solid var(--gold);
  background: var(--amber-bg);
  color: var(--navy);
  font-size: .7rem;
  font-weight: 700;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.gics-badge small { color: var(--ink-faint); font-size: .55rem; font-weight: 600; }

.super-btns {
  order: 4;
  display: flex;
  width: 100%;
  gap: .25rem;
  margin-top: .5rem;
  padding-top: .45rem;
  border-top: 1px solid var(--line);
}
.super-btn {
  flex: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .18rem;
  min-height: 1.75rem;
  padding: .2rem .1rem;
  border-radius: 6px;
  border: 1px solid var(--line);
  background: var(--cream);
  font-size: .66rem;
  font-weight: 700;
  letter-spacing: .02em;
  text-decoration: none;
  text-transform: uppercase;
  color: var(--ink-soft);
}
.super-btn:hover { transform: translateY(-1px); }
.super-btn-gfin:hover { border-color: var(--navy); color: var(--navy); }
.super-btn-duck:hover { border-color: var(--gold); color: var(--amber); }
.super-btn-grok:hover { border-color: var(--navy-3); color: var(--navy-3); }
@media (max-width: 700px) {
  .super-btn .sb-label { display: none; }
  .super-btn { min-height: 1.85rem; }
}

/* ---------- main ledger ---------- */
.panel {
  position: relative;
  background: var(--card);
  border-radius: var(--radius-lg);
  border: 1px solid var(--line);
  overflow: hidden;
  box-shadow: var(--shadow);
}
.panel::before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 4px;
  background: linear-gradient(90deg, var(--navy) 0%, var(--gold) 55%, var(--bear) 100%);
}
.panel-header {
  display: flex;
  flex-direction: column;
  gap: 1.1rem;
  padding: 1.45rem 1.4rem 1.2rem;
  border-bottom: 1px solid var(--line);
  background: linear-gradient(180deg, #fff8ea 0%, var(--card) 100%);
}
.panel-meta-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  gap: 1rem;
}
.panel-stock-info { display: flex; align-items: center; gap: .8rem; }
.stock-avatar {
  width: 42px;
  height: 42px;
  border-radius: 8px;
  background: var(--paper);
  border: 1px solid var(--line-hi);
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 800;
  font-size: 1.15rem;
}
.stock-avatar.neutral { color: var(--ink-soft); }
.stock-avatar.positive { color: var(--bull); border-color: #9fd4b3; background: var(--bull-bg); }
.stock-avatar.negative { color: var(--bear); border-color: #efb4af; background: var(--bear-bg); }
.panel-header h2 { font-weight: 700; font-size: 1.15rem; color: var(--ink); margin: 0; line-height: 1.2; }
.panel-ticker {
  display: block;
  font-family: var(--serif);
  font-size: 1.45rem;
  font-weight: 700;
  color: var(--navy);
  line-height: 1.1;
}
.panel-name { display: block; margin-top: .15rem; font-size: .85rem; font-weight: 500; color: var(--ink-soft); }
.panel-status-wrap { display: flex; flex-direction: column; align-items: flex-end; gap: .25rem; }
.status-label {
  font-size: .62rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--ink-faint);
}
.panel-header .drop-large {
  font-family: var(--mono);
  font-size: .78rem;
  font-weight: 700;
  padding: .35rem .8rem;
  border-radius: 8px;
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  color: var(--bear);
  background: var(--bear-bg);
  border: 1px solid #efc8c4;
}
.panel-header .drop-large::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: currentColor;
}
.panel-header .drop-large.positive { color: var(--bull); background: var(--bull-bg); border-color: #b7ddc6; }
.panel-header .drop-large.neutral { color: var(--ink-soft); background: var(--paper); border-color: var(--line); }

.mini-days-section {
  background: var(--cream);
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  padding: .9rem 1rem;
}
.mini-days-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  margin-bottom: .75rem;
  flex-wrap: wrap;
}
.toolbar-title {
  display: block;
  font-size: .72rem;
  font-weight: 700;
  color: var(--navy);
  letter-spacing: .06em;
  text-transform: uppercase;
}
.toolbar-subtitle { display: block; font-size: .7rem; color: var(--ink-faint); }
.add-day-btn {
  display: inline-flex;
  align-items: center;
  gap: .3rem;
  min-height: 1.95rem;
  padding: .35rem .75rem;
  color: #fff8ea;
  background: var(--navy);
  border: 0;
  border-radius: var(--radius-sm);
  font: 700 .72rem var(--sans);
  text-transform: uppercase;
  cursor: pointer;
}
.add-day-btn:hover:not(:disabled) { background: var(--navy-3); }
.add-day-btn:disabled { opacity: .35; cursor: not-allowed; }
.mini-days-grid-wrapper { overflow-x: auto; padding: .15rem 0; }
.mini-days-grid { display: flex; gap: .65rem; align-items: center; }
.mini-day {
  position: relative;
  flex: 1 0 105px;
  display: flex;
  flex-direction: column;
  gap: .35rem;
  padding: .55rem;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 8px;
}
.mini-day:not(:first-child)::before {
  content: "";
  position: absolute;
  top: 50%;
  left: -.7rem;
  width: .7rem;
  height: 2px;
  transform: translateY(-50%);
  background: var(--line-hi);
}
.mini-day.connector-positive::before { background: var(--bull); }
.mini-day.connector-negative::before { background: var(--bear); }
.mini-day.positive { background: var(--bull-bg); border-color: #b7ddc6; }
.mini-day.negative { background: var(--bear-bg); border-color: #efc8c4; }
.mini-day input {
  width: 100%;
  padding: .22rem .25rem;
  color: var(--ink);
  background: transparent;
  border: 1px solid transparent;
  border-radius: 4px;
  font: 600 .74rem var(--mono);
  text-align: center;
}
.mini-day input[data-mini-field="day"] {
  color: var(--ink-soft);
  font-family: var(--sans);
  font-size: .62rem;
  letter-spacing: .04em;
  text-transform: uppercase;
}
.mini-day input[data-mini-field="change"] {
  font-size: .8rem;
  background: rgba(255, 255, 255, .7);
  border: 1px solid var(--line);
}
.mini-day input:focus {
  outline: none;
  border-color: var(--gold);
  background: #fff;
}
.mini-day-remove {
  position: absolute;
  top: .2rem;
  right: .2rem;
  width: 16px;
  height: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--ink-faint);
  background: transparent;
  border: none;
  cursor: pointer;
  opacity: 0;
  border-radius: 50%;
}
.mini-day:hover .mini-day-remove { opacity: 1; }
.mini-day-remove:hover { color: var(--bear); background: var(--bear-bg); }
.streak-widget { display: inline-flex; align-items: center; gap: .4rem; margin-left: auto; }
.streak-pill {
  padding: .22rem .55rem;
  border-radius: 6px;
  font: 700 .68rem var(--sans);
  display: inline-flex;
  align-items: center;
  gap: .25rem;
}
.streak-pill.positive { color: var(--bull); background: var(--bull-bg); border: 1px solid #b7ddc6; }
.streak-pill.positive::before { content: "▲"; font-size: .5rem; }
.streak-pill.negative { color: var(--bear); background: var(--bear-bg); border: 1px solid #efc8c4; }
.streak-pill.negative::before { content: "▼"; font-size: .5rem; }
.mini-day.csv-base { border-style: dashed; background: var(--paper); padding-top: .85rem; }
.mini-day-type-badge {
  position: absolute;
  top: .25rem;
  left: .35rem;
  font-size: .5rem;
  font-weight: 800;
  color: var(--ink-faint);
  border: 1px solid var(--line);
  border-radius: 3px;
  padding: .02rem .2rem;
  text-transform: uppercase;
}
.mini-day-label {
  font-weight: 700;
  font-size: .62rem;
  color: var(--ink-soft);
  text-align: center;
  text-transform: uppercase;
}
.mini-day-val { font-weight: 700; font-size: .8rem; text-align: center; font-family: var(--mono); }
.mini-day.csv-base.positive .mini-day-val { color: var(--bull); }
.mini-day.csv-base.negative .mini-day-val { color: var(--bear); }
@media (max-width: 700px) {
  .mini-days-toolbar { flex-direction: column; align-items: stretch; }
  .streak-widget { margin-left: 0; }
  .add-day-btn { width: 100%; justify-content: center; }
}
@media (max-width: 600px) {
  .panel-meta-row { flex-direction: column; align-items: flex-start; }
  .panel-status-wrap { align-items: flex-start; width: 100%; }
}

.week-nav {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: .8rem;
  padding: 1.1rem 1.3rem .4rem;
}
.week-nav-controls { display: flex; align-items: center; justify-content: center; gap: .5rem; flex-wrap: wrap; }
.week-nav-controls button {
  background: var(--cream);
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  width: 36px;
  height: 36px;
  font-size: 1rem;
  font-weight: 600;
  color: var(--navy);
  cursor: pointer;
}
.week-nav-controls button:hover:not(:disabled) { border-color: var(--gold); color: var(--amber); }
.week-nav-controls button:disabled { opacity: .3; cursor: not-allowed; }
.week-nav .wk-label {
  font-family: var(--serif);
  font-weight: 700;
  font-size: 1.05rem;
  min-width: 180px;
  text-align: center;
  color: var(--navy);
}
.week-nav .wk-num {
  display: block;
  font-family: var(--sans);
  font-weight: 600;
  font-size: .68rem;
  color: var(--ink-faint);
  letter-spacing: .08em;
  text-transform: uppercase;
  margin-top: .1rem;
}
.today-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  min-width: 130px;
  padding: .55rem 1.35rem;
  border: 0;
  border-radius: 999px;
  cursor: pointer;
  font-weight: 700;
  font-size: .74rem;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--navy);
  background: linear-gradient(180deg, var(--gold-hi), var(--gold));
}
.today-btn::before {
  content: "";
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--navy);
  animation: today-pulse 1.8s ease-in-out infinite;
}
@keyframes today-pulse {
  0%, 100% { opacity: .9; }
  50% { opacity: .35; }
}

.days-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: .55rem;
  padding: .9rem 1.3rem .3rem;
}
.day-card {
  position: relative;
  background: var(--cream);
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  padding: .9rem .4rem .75rem;
  text-align: center;
  cursor: pointer;
}
.day-card:hover,
.day-card:focus-visible { border-color: var(--gold); box-shadow: 0 0 0 2px rgba(184, 146, 58, .18); outline: none; }
.day-card input,
.day-card button { cursor: auto; }
.day-card button { cursor: pointer; }
.day-card.positive { border-color: #b7ddc6; background: var(--bull-bg); }
.day-card.negative { border-color: #efc8c4; background: var(--bear-bg); }
.day-card.is-today { border-color: var(--gold); background: var(--amber-bg); }
.day-card.is-today::after {
  content: "today";
  position: absolute;
  top: -.42rem;
  left: 50%;
  transform: translateX(-50%);
  font-size: .58rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--navy);
  background: var(--gold);
  padding: .1rem .4rem;
  border-radius: 999px;
}
.day-card .d-wd {
  font-size: .68rem;
  text-transform: uppercase;
  letter-spacing: .1em;
  color: var(--ink-faint);
  font-weight: 700;
}
.day-card.is-today .d-wd { color: var(--amber); }
.day-card .d-date {
  font-size: .86rem;
  color: var(--ink-soft);
  margin: .18rem 0 .6rem;
  font-weight: 600;
}
.day-card.is-today .d-date { color: var(--navy); }
.day-card input {
  width: 100%;
  background: #fff;
  border: 1.5px solid var(--line);
  border-radius: var(--radius-sm);
  padding: .55rem .25rem;
  text-align: center;
  font-family: var(--mono);
  font-weight: 600;
  font-size: .95rem;
  color: var(--ink);
}
.day-card input:focus {
  border-color: var(--gold);
  outline: none;
  box-shadow: 0 0 0 3px var(--gold-dim);
}
.day-card input.saved { border-color: var(--bull); color: var(--bull); }
.day-card input.err { border-color: var(--bear); color: var(--bear); }
.day-card .d-delta {
  font-family: var(--mono);
  font-size: .74rem;
  margin-top: .5rem;
  min-height: 1.1rem;
  font-weight: 700;
}
.d-delta.pos { color: var(--bull); background: #fff; display: inline-block; padding: .1rem .4rem; border-radius: 999px; }
.d-delta.neg { color: var(--bear); background: #fff; display: inline-block; padding: .1rem .4rem; border-radius: 999px; }
.live-quote-btn {
  width: 100%;
  margin-top: .45rem;
  padding: .35rem;
  border: 1px solid var(--gold);
  border-radius: var(--radius-sm);
  color: var(--navy);
  background: var(--gold-dim);
  font: 700 .66rem var(--sans);
  letter-spacing: .04em;
  text-transform: uppercase;
  cursor: pointer;
}
.live-quote-btn:hover:not(:disabled) { background: var(--gold); }
.live-quote-btn:disabled { cursor: wait; opacity: .55; }
@media (max-width: 560px) {
  .days-grid { grid-template-columns: 1fr; }
  .day-card {
    display: grid;
    grid-template-columns: 4.2rem 1fr auto;
    align-items: center;
    text-align: left;
    padding: .65rem .85rem;
    gap: .55rem;
  }
  .day-card .d-wd,
  .day-card .d-date { margin: 0; }
  .day-card input { max-width: 8rem; margin: 0 auto; }
  .day-card .d-delta { margin: 0; min-width: 3.4rem; text-align: right; }
}

.week-summary {
  font-size: .88rem;
  color: var(--ink-soft);
  margin: .8rem 1.3rem 0;
  padding: .75rem 1rem;
  background: var(--cream);
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  display: flex;
  gap: 1.1rem;
  flex-wrap: wrap;
  align-items: center;
}
.week-summary b { color: var(--navy); font-weight: 700; }
.week-summary .pos { color: var(--bull); }
.week-summary .neg { color: var(--bear); }

.analytics {
  margin: 1.2rem 1.4rem 0;
  padding: 1rem;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: var(--cream);
}
.analytics h3 {
  font-size: .72rem;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--ink-soft);
  margin-bottom: .75rem;
}
.analytics-grid { display: grid; grid-template-columns: 1.5fr repeat(4, 1fr); gap: .55rem; }
.metric {
  padding: .55rem;
  border-radius: 7px;
  background: #fff;
  border: 1px solid var(--line);
}
.metric-label { display: block; font-size: .58rem; color: var(--ink-faint); text-transform: uppercase; }
.metric-value { display: block; margin-top: .2rem; font-size: .86rem; font-weight: 700; color: var(--navy); }
.chart-card {
  grid-row: span 2;
  min-height: 132px;
  padding: .4rem;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 7px;
}
.chart-card svg { width: 100%; height: 112px; display: block; }
.heatmap { display: flex; gap: 3px; flex-wrap: wrap; align-content: flex-start; }
.heat-cell { width: 13px; height: 13px; border-radius: 2px; background: var(--line); }
.heat-cell.pos { background: var(--bull); }
.heat-cell.neg { background: var(--bear); }
.heat-cell.zero { background: var(--gold); }
.insights { grid-column: span 4; font-size: .78rem; line-height: 1.65; color: var(--ink-soft); }
.insights span {
  display: inline-block;
  margin: 0 .35rem .25rem 0;
  padding: .18rem .4rem;
  border-radius: 4px;
  background: var(--gold-dim);
  color: var(--navy);
}
@media (max-width: 700px) {
  .analytics { margin: 1rem; }
  .analytics-grid { grid-template-columns: repeat(2, 1fr); }
  .chart-card { grid-column: span 2; grid-row: auto; }
  .insights { grid-column: span 2; }
}

.panel-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: .65rem;
  padding: 1rem 1.3rem 1.2rem;
}
.clear-btn {
  background: #fff;
  border: 1px solid var(--line-hi);
  border-radius: var(--radius-sm);
  padding: .4rem .9rem;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--ink-soft);
  cursor: pointer;
}
.clear-btn:hover { border-color: var(--bear); color: var(--bear); background: var(--bear-bg); }
.footnote { font-size: .74rem; color: var(--ink-faint); font-weight: 500; }
.footnote::before {
  content: "●";
  display: inline-block;
  color: var(--bull);
  font-size: .5rem;
  vertical-align: middle;
  margin-right: .4rem;
}
.site-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  padding: 1.4rem 0 .4rem;
  color: var(--ink-faint);
  font-size: .78rem;
}
.site-footer strong { color: var(--navy); font-family: var(--serif); }
.loading-placeholder { color: var(--ink-faint); padding: 2rem 1rem; text-align: center; font-size: .95rem; }
#daysContainer { min-height: 8rem; }