/* MF Analyser homepage branding: /assets/landing.css and /assets/mfa-landing.css.
   Keep the compact research layout; share the site's colours and typography. */
:root {
  color-scheme: dark;
  --bg: #05111f;
  --bg2: #081929;
  --bg3: #0c2038;
  --card: #0c2038;
  --a: #c9982a;
  --a2: #e8b84b;
  --gold: #c9982a;
  --t1: #e4dfd0;
  --t2: #7a8799;
  --t3: #576576;
  --green: #10b981;
  --red: #ef4444;
  --line: rgba(228, 223, 208, .08);
  --line-strong: rgba(201, 152, 42, .18);
  --glass-bg: rgba(12, 32, 56, .55);
  --glass-border: rgba(201, 152, 42, .18);
  --glass-shadow: 0 30px 80px -30px rgba(0, 0, 0, .7);
  --grad: linear-gradient(135deg, #c9982a 0%, #e8b84b 100%);
  --display: 'DM Sans', system-ui, sans-serif;
  --body: 'DM Sans', system-ui, sans-serif;
  --mono: 'JetBrains Mono', ui-monospace, monospace;
  --navy: #05111f;
  --navy-mid: #081929;
  --surface: var(--card);
  --ink: var(--t1);
  --muted: #a0adbd;
  --gold-soft: rgba(201, 152, 42, .10);
  font-family: var(--body);
  color: var(--t1);
  background: var(--bg);
}

html, body {
  background:
    radial-gradient(1100px 640px at 82% -12%, rgba(201, 152, 42, .13), transparent 60%),
    radial-gradient(900px 600px at 2% 8%, rgba(16, 41, 74, .6), transparent 55%),
    #05111f;
  background-attachment: fixed;
  color: var(--t1);
}
body {font-family: var(--body); text-rendering: optimizeLegibility;}
h1, h2, h3, .tool-label strong {font-family: var(--display); color: var(--t1); font-weight: 700;}
h1 {letter-spacing: -.035em;}
p {color: var(--muted);}
button, input, select {font-family: var(--body);}
::selection {background: var(--a); color: var(--bg);}
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, summary:focus-visible {outline-color: var(--a2);}
.skip {background: var(--a2); color: var(--bg);}

.rt-header {background: rgba(5, 17, 31, .94); border-color: var(--glass-border);}
.brand img {height: 32px; width: auto; max-width: min(230px, 65vw); object-fit: contain;}
.rt-header nav {color: var(--muted); font-weight: 500;}
.rt-header nav a:hover, .rt-header nav a:focus-visible {color: var(--a2);}
.page-intro p {color: var(--muted);}
.data-button, .inline-details summary, .rule summary {
  color: var(--a2);
  border-color: var(--glass-border);
  background: var(--gold-soft);
}
.data-button:hover, .inline-details summary:hover, .rule summary:hover {background: rgba(201, 152, 42, .18);}

/* The three highlighted tools use the same navy/gold material as the homepage. */
.tool-tabs > a {
  color: var(--t1);
  background: linear-gradient(150deg, #10294a, #081929);
  border-color: var(--glass-border);
  box-shadow: 0 5px 0 #030b14, 0 12px 26px rgba(0, 0, 0, .25), inset 0 1px 0 rgba(228, 223, 208, .07);
}
.tool-tabs > a:after {background: linear-gradient(115deg, rgba(228, 223, 208, .03), transparent 55%);}
.tool-tabs > a:hover {
  background: linear-gradient(150deg, #10294a, #0c2038);
  border-color: var(--a);
  box-shadow: 0 8px 0 #030b14, 0 17px 25px rgba(0, 0, 0, .35);
}
.tool-tabs > a:active {box-shadow: 0 2px 0 #030b14, 0 5px 10px rgba(0, 0, 0, .25);}
.tool-tabs > a.active {
  color: var(--t1);
  background: linear-gradient(145deg, #10294a, #0c2038);
  border-color: var(--a);
  box-shadow: 0 5px 0 #73551a, 0 14px 30px -12px rgba(201, 152, 42, .30), inset 0 1px 0 rgba(232, 184, 75, .18);
}
.tool-tabs > a.active:hover {box-shadow: 0 8px 0 #73551a, 0 17px 30px -12px rgba(201, 152, 42, .30);}
.tool-label strong {color: var(--t1);}
.tool-label small, .tool-tabs > a.active .tool-label small {color: var(--muted);}
.tool-icon {
  background: rgba(201, 152, 42, .08);
  border-color: var(--glass-border);
  color: var(--a2);
  box-shadow: inset 0 1px 0 rgba(232, 184, 75, .1);
}
.tool-tabs > a.active .tool-icon {
  background: var(--grad);
  color: var(--bg);
  border-color: rgba(232, 184, 75, .7);
  box-shadow: 0 3px 7px rgba(0, 0, 0, .2), inset 0 1px 0 rgba(255, 255, 255, .3);
}
.tool-selected, .tool-tabs > a.active .tool-selected {color: var(--a2);}

.panel {background: var(--card); border-color: var(--glass-border); box-shadow: 0 8px 25px -16px rgba(0, 0, 0, .55);}
.scope {background: var(--bg2);}
.scope label, .stock-search > label {color: var(--muted);}
select, .search-box, .suggestions {
  color: var(--t1);
  background: var(--bg);
  border-color: rgba(228, 223, 208, .18);
}
select {accent-color: var(--a2);}
option {background: var(--bg2); color: var(--t1);}
.search-box input {color: var(--t1);}
.search-box input::placeholder {color: var(--muted); opacity: 1;}
.search-box > span, .search-panel .search-hint {color: var(--muted);}
.search-box:focus-within {border-color: var(--a); box-shadow: 0 0 0 2px rgba(201, 152, 42, .12);}
.suggestions {box-shadow: 0 14px 32px rgba(0, 0, 0, .45);}
.suggestions a:hover, .suggestions a:focus {background: rgba(201, 152, 42, .14);}
.suggestions small {color: var(--muted);}
.btn {
  background: linear-gradient(180deg, #e8b84b, #c9982a);
  border-color: rgba(255, 255, 255, .18);
  color: var(--bg);
  font-weight: 700;
  box-shadow: 0 1px 0 rgba(255, 255, 255, .3) inset, 0 10px 24px -10px rgba(201, 152, 42, .6);
}
.btn:hover {background: #e8b84b;}
.btn.secondary {background: var(--bg2); border-color: var(--glass-border); color: var(--a2); box-shadow: none;}
.btn.secondary:hover {background: var(--gold-soft); border-color: var(--a);}
.date-line > span {color: var(--a2); border-color: var(--glass-border); background: var(--gold-soft);}
.date-line a, .rt-footer a {color: var(--muted);}
.date-line a:hover, .rt-footer a:hover {color: var(--a2);}

.stock-grid > a {border-color: var(--line);}
.stock-grid > a:hover, .stock-grid span b {color: var(--a2);}
.stats strong {color: var(--t1); font-family: var(--mono); font-size: 25px; font-weight: 500;}
.stats, .stats > div, .history {border-color: var(--line);}
.verdict {background: var(--gold-soft); border-color: var(--glass-border); border-left-color: var(--a); color: var(--t1);}
.verdict b, .verdict strong, .history-bars b {color: var(--t1);}
.history-bars .column {border-color: var(--line-strong);}
.history-bars i {background: var(--grad);}
.sort-links a.on {color: var(--a2); background: var(--gold-soft);}
.table-scroll {border-color: var(--line); scrollbar-color: var(--t3) var(--bg2);}
thead {background: var(--bg2);}
thead th {color: var(--muted);}
th, td {border-color: var(--line);}
tbody tr:hover {background: rgba(201, 152, 42, .045);}
.text-link, .change-question {color: var(--a2); border-color: rgba(201, 152, 42, .35);}
.text-link:hover {color: var(--t1);}
.delta, .delta.down {color: var(--muted);}
.delta.up {color: var(--a2);}
.mini-bar {background: rgba(228, 223, 208, .1);}
.mini-bar i {background: var(--grad);}
.basis > b {color: var(--a2);}
.basis strong {color: var(--t1);}
.sector-row {border-color: var(--line);}
.sector-row:hover, .sector-row.selected {background: var(--gold-soft);}
.sector-row.selected {box-shadow: inset 2px 0 var(--a);}
.sector-row > b {color: var(--t1);}
.diverging:before {border-color: rgba(228, 223, 208, .24);}
.diverging .positive {background: var(--a2);}
.diverging .negative {background: var(--t2);}
.sector-summary {background: var(--bg2); border-color: var(--glass-border);}
.sector-summary > strong {color: var(--a2); font-family: var(--mono); font-weight: 500;}
.summary-line, .sector-summary > small {border-color: var(--line); color: var(--muted);}
.summary-line b {color: var(--t1);}
.segmented {border-color: var(--glass-border); background: var(--bg2);}
.segmented a {color: var(--muted);}
.segmented a.on {background: var(--gold-soft); color: var(--a2);}
.heatmap td a {color: var(--t1);}
.heatmap td a:hover {box-shadow: inset 0 0 0 1px var(--a);}
.question-card {background: var(--bg2); border-color: rgba(228, 223, 208, .12);}
.question-card:hover {background: var(--gold-soft); border-color: var(--a);}
.question-card.on {background: var(--gold-soft); border-color: var(--a); box-shadow: inset 3px 0 var(--a);}
.question-card.on strong {color: var(--a2);}
.answer-summary > strong {color: var(--a2); font-family: var(--mono); font-weight: 500;}
.answer-summary > span {color: var(--t1);}
.methodology {background: var(--bg2);}
.methodology > summary {color: var(--muted);}
.methodology > summary:before {background: var(--gold-soft); color: var(--a2); border-color: var(--glass-border);}
.methodology summary:hover {color: var(--a2);}
.stale, .table-hint {background: var(--gold-soft); color: var(--a2); border-color: var(--glass-border);}
.rt-footer {border-color: var(--line);}

@media (max-width: 450px) {
  .brand img {height: 30px; width: auto;}
  .stats strong {font-size: 23px;}
}
@media print {
  :root {color-scheme: light; --ink: #0f172a; --muted: #475569; --line: #d6dce4; --surface: #fff; --t1: #0f172a;}
  html, body {background: #fff!important; color: #0f172a;}
  h1, h2, h3, p, .stats strong, .sector-summary > strong, .summary-line b,
  .verdict, .verdict b, .verdict strong, .basis strong, .answer-summary > span,
  .answer-summary > strong, .sector-row > b, .delta, .delta.up, .delta.down,
  .history-bars b, .heatmap td a {color: #0f172a;}
  .rt-header {background: #05111f!important; print-color-adjust: exact;}
  .panel, .sector-summary, .methodology, .verdict {background: #fff; border-color: #d6dce4; box-shadow: none;}
  thead {background: #f1f5f9;}
  .date-line > span {color: #6b4d12; background: #faf1dc; border-color: #ded5c2;}
  .sector-row:hover, .sector-row.selected, tbody tr:hover {background: transparent;}
}