/* Current hostinger.com homepage dark palette, verified 2026-11-02.
   The marketing hero uses black, white CTAs and purple illumination.
   Values are recorded in BRAND-SOURCES.json. */
:root {
  color-scheme: dark;
  --ink: #f8f9fa;
  --muted: #bfbfc3;
  --line: #ffffff26;
  --green: #9d99ff;
  --coral: #673de6;
  --mint: #d5cfff;
  --surface: #18181a;
  --surface-secondary: #101011;
  --surface-elevated: #222225;
  color: var(--ink);
  background: #000;
}
body { background: #000; color: var(--ink); }
.app > main {
  background: radial-gradient(ellipse 75% 600px at 80% 0, #251951 0, transparent 75%), #000;
}
a, summary, .eyebrow, .kicker { color: #9d99ff; }
h1, h2, h3, .topbar b, .title button, .work-impact p { color: var(--ink); }
button, .button { background: #ffffff0d; color: var(--ink); border-color: var(--line); }
button:hover, .button:hover { background: #ffffff26; }
.primary { background: #fff; color: #18181a; border-color: #fff; }
.primary:hover { background: #dedee2; color: #000; border-color: #dedee2; }
.quiet { background: transparent; color: #9d99ff; border-color: transparent; }
input, select, textarea { background: #101011; color: var(--ink); border-color: var(--line); }
input::placeholder, textarea::placeholder { color: #a5a5ad; }
input:focus, select:focus, textarea:focus { border-color: #9d99ff; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, summary:focus-visible {
  outline-color: #9d99ff;
}
.sidebar { background: #000; border-right: 1px solid var(--line); color: var(--ink); }
.sidebar nav button { color: #dedee2; }
.sidebar nav button:hover { background: #ffffff1a; }
.sidebar nav button.active { background: #673de6; color: #fff; }
.sidebar-bottom, .sidebar-bottom small, .sidebar-bottom button, .nav-label { color: #bfbfc3; }
.brand small { color: #bfbfc3; }
.topbar { background: #000; color: var(--muted); }
.topbar i { color: #797980; }
.dot { background: #9d99ff; }
.panel, .metric, .tech-category, .assessment-card { background: var(--surface); border-color: var(--line); }
.report-overview {
  background: radial-gradient(ellipse at 0 100%, #331c74 0, transparent 65%), #101011;
  border-color: #7b66ff66;
}
.report-coverage strong { color: #fff; }
.report-coverage .eyebrow, .quick-wins .eyebrow { color: #c5bfff; }
.report-tech-list > span, .tech-mark { background: #ffffff0d; border-color: var(--line); color: var(--ink); }
.tech-category h3, .toolbar.slim, .empty, .dropzone, dialog pre, .detail-metrics > div { background: #101011; border-color: var(--line); }
.tech-item-title a { color: #9d99ff; }
.tech-version, .tech-source-label, .tech-item-evidence summary { color: var(--muted); }
.quick-wins { background: var(--surface); }
.quick-number { background: #673de633; color: #d5cfff; }
.quick-win-list > li, .assessment-categories > div { border-color: var(--line); }
.summary-banner, .work-impact, .welcome-panel { background: #251951; border-color: #7b66ff66; }
.summary-banner p, .welcome-panel p { color: #dedee2; }
.welcome-label, .step-number { color: #c5bfff; }
.tag { background: #ffffff1a; color: #dedee2; }
.tag.good, .score.good, .browse-score.good { background: #003d24; color: #a0edbc; }
.tag.warn, .score.fair, .browse-score.fair, .assessment-status, .notice { background: #4a1c00; color: #ffd366; border-color: #ffd36640; }
.tag.bad, .score, .browse-score, .browse-error, .tech-security, .quick-asap { background: #45100f; color: #ffb5b1; border-color: #e73a4766; }
.error, .negative, .assessment-score, .tech-security a { color: #ffb5b1; }
.positive, .metric .positive { color: #a0edbc; }
.missing, .title small, th, th .sort-heading span { color: #bfbfc3; }
tbody tr:hover, th .sort-heading:hover { background: #ffffff0d; }
.timeline-entry:before { border-color: #18181a; }
.dropzone input { background: #18181a; }
dialog { background: #222225; color: var(--ink); border-color: var(--line); }
dialog::backdrop { background: #000b; }
dialog .close { color: #dedee2; }
.toast { background: #222225; color: #fff; border: 1px solid var(--line); }
.task-progress progress::-webkit-progress-bar { background: #ffffff26; }
.chart text { fill: #bfbfc3; }
.login { background: #000; }
.login-card img { filter: brightness(0) invert(1); }
.login-art { background: radial-gradient(ellipse at 50% 100%, #673de6 0, #251951 45%, #000 80%); }
.login-art > span { color: #d5cfff; }
/* Data tables, filters, selected rows and detail drawers share the same palette. */
.crawl-explorer { background: #101011; border-color: var(--line); }
.crawl-explorer button:hover, .crawl-explorer summary:hover { background: #ffffff1a; }
.browse-tabs, .browse-status, .browse-splitter, .browse-raw-details dt { background: #18181a; }
.crawl-explorer .browse-tabs button { color: #bfbfc3; }
.crawl-explorer .browse-tabs button[aria-selected="true"] { background: #673de6; color: #fff; }
.crawl-explorer .browse-columns summary { color: var(--ink); border-color: var(--line); }
.browse-column-menu { background: #222225; border-color: var(--line); }
.browse-column-menu label, .browse-table { color: var(--ink); }
.browse-device-tabs button[aria-pressed="true"], .browse-detail-tabs button[aria-selected="true"] {
  background: #331c74; color: #d5cfff; border-color: #7b66ff66;
}
.browse-table th, .browse-table th.browse-row-number, .browse-table th.browse-address {
  background: #222225; color: #dedee2;
}
.browse-table td, .browse-table tr.browse-spacer td { background: #101011; }
.browse-table tbody tr:nth-child(even) td { background: #18181a; }
.browse-table tbody tr:hover td { background: #251951; }
.browse-table tbody tr.is-selected td { background: #331c74; color: #fff; }
.browse-table th, .browse-table td, .browse-table .browse-address, .browse-raw-details dt, .browse-raw-details dd {
  border-color: var(--line);
}
.browse-table .browse-row-number { color: #bfbfc3; background: #18181a; }
.browse-splitter span { background: #797980; }
.browse-splitter:hover, .browse-splitter:focus-visible { background: #331c74; }
.browse-blank { color: #a5a5ad; }
@media (max-width: 700px) {
  .sidebar nav { scrollbar-color: #58585e #000; }
  .sidebar nav::-webkit-scrollbar-track { background: #000; }
}
@media print {
  :root { color-scheme: light; --ink: #18181a; --muted: #58585e; --line: #ddd; }
  body, .app > main, .panel, .metric, .report-overview, .quick-wins, .summary-banner { background: #fff; color: #18181a; }
  h1, h2, h3, .report-coverage strong, a { color: #18181a; }
}
.count-list > div, td { border-bottom-color: var(--line); }
.chart .grid { stroke: var(--line); }
/* Headline metrics use the selected report, not fixed totals. */
.report-headline-metrics { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; margin-bottom: 24px; }
.report-headline-metric { margin: 0; padding: 28px; min-width: 0; }
.report-headline-metric:first-child { background: radial-gradient(ellipse at 0 100%, #331c74, transparent 80%), #101011; border-color: #7b66ff66; }
.report-headline-metric h2 { margin: 0 0 20px; font-size: 16px; font-weight: 500; letter-spacing: 0; color: #dedee2; }
.report-headline-value { margin: 0 0 16px; font-size: 56px; line-height: 1; letter-spacing: -.04em; font-weight: 600; font-variant-numeric: tabular-nums; color: #fff; }
.report-headline-value > span { margin-left: 6px; font-size: 22px; font-weight: 400; letter-spacing: 0; color: #bfbfc3; }
.report-headline-metric .hint { margin: 0; line-height: 1.65; max-width: 390px; }
.report-headline-metric .quiet { margin: 12px 0 0; padding: 0; }
.report-mobile-findings { padding: 28px; }
.report-mobile-findings h2 { margin-bottom: 20px; }
@media (max-width: 600px) {
  .report-headline-metrics { grid-template-columns: 1fr; gap: 16px; }
  .report-headline-metric, .report-mobile-findings { padding: 24px; }
  .report-headline-value { font-size: 48px; }
}
@media print {
  .report-headline-metric:first-child { background: #fff; border-color: #ddd; }
  .report-headline-metric h2, .report-headline-value, .report-headline-value > span { color: #18181a; }
}
.report-headline-metrics.has-crawl { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.has-crawl .report-headline-value { font-size: 46px; }
.report-metric-source { color: var(--muted); font-size: 10px; line-height: 1.6; margin: 14px 0 0; overflow-wrap: anywhere; }
.report-stack-summary { padding: 28px; }
.report-stack-summary .panel-head { gap: 20px; flex-wrap: wrap; }
.report-stack-summary h2 { margin: 8px 0; }
.report-stack-summary .hint { margin-bottom: 0; }
.report-stack-summary .report-tech-list { margin-top: 24px; }
.report-stack-summary .report-tech-list small { color: #bfbfc3; }
@media (max-width: 1100px) {
  .report-headline-metrics.has-crawl { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .report-headline-metrics.has-crawl > :last-child { grid-column: 1 / -1; }
}
@media (max-width: 600px) {
  .report-headline-metrics.has-crawl { grid-template-columns: 1fr; }
  .report-stack-summary { padding: 24px; }
}
.tech-supplied .tech-category-list { grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: start; }
.tech-supplied .tech-category-items { grid-template-columns: 1fr; padding: 20px; gap: 20px; }
.tech-supplied .tech-category h3 { padding: 18px 20px; font-size: 15px; }
.tech-supplied .tech-item { gap: 12px; }
.tech-supplied .tech-item-title { font-size: 15px; overflow-wrap: anywhere; }
.tech-supplied .tech-mark { width: 30px; height: 30px; font-size: 11px; }
.tech-supplied .tech-version { font-size: 12px; }
@media (max-width: 1150px) { .tech-supplied .tech-category-list { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 750px) { .tech-supplied .tech-category-list { grid-template-columns: 1fr; } }
