/* Classic: the WWAV desktop look. Brand blue and deep navy from the shield
   mark, clean white cards, Windows typography and one consistent icon weight.
   Cosmetic only: sizes that tests rely on (round side badges, full-height
   scan control) are left as they are. */
.classic-symbol { display: none; }
[data-layout="classic"] {
  --words: "Segoe UI Variable Text", "Segoe UI", system-ui, sans-serif;
  --display: "Segoe UI Variable Display", "Segoe UI Semibold", "Segoe UI", system-ui, sans-serif;
  --figures: var(--display);
  --button-font: var(--words);
  --bg: #f3f5fa;
  --surface: #ffffff;
  --surface-raised: #ffffff;
  --text: #0f1b33;
  --muted: #5a6680;
  --line: #e1e6f0;
  --soft: #eef1fb;
  --accent: #4763ff;
  --accent-hover: #3a55ec;
  --accent-ink: #ffffff;
  --accent-soft: #e8ecff;
  --focus: #3a55ec;
  --success-bg: #e3f5ec;
  --success-text: #18794e;
  --warning-bg: #fdf3dd;
  --warning-text: #8a5a00;
  --danger-bg: #fdebe8;
  --danger-text: #b42318;
  --shadow: 0 1px 2px #0f1b330d, 0 8px 20px -12px #0f1b3326;
  --spine-top: #4d68ff;
  --spine-bottom: #2b3dc6;
  --lime: #d4f56a;
  font-family: var(--words);
}
[data-layout="classic"][data-theme="dark"] {
  --bg: #0b1220;
  --surface: #111a2c;
  --surface-raised: #17223a;
  --text: #e8edf9;
  --muted: #9ba8c3;
  --line: #24314d;
  --soft: #1a2541;
  --accent-soft: #1d2a55;
  --focus: #a9b6ff;
  --success-bg: #12382a;
  --success-text: #6fdca7;
  --warning-bg: #3a2c0f;
  --warning-text: #f2c46b;
  --danger-bg: #401b18;
  --danger-text: #ff9b8f;
  --shadow: 0 1px 2px #0006;
  --spine-top: #3f58ef;
  --spine-bottom: #1f2c96;
}

/* Frame and title bar */
[data-layout="classic"] .app-shell { border-radius: 16px; --scan-width: 164px; }
[data-layout="classic"] .titlebar { height: 72px; padding-left: 25px; }
[data-layout="classic"] .brand { font-size: 24px; font-weight: 700; letter-spacing: -.5px; }
[data-layout="classic"] .brand-wordmark strong { font-family: var(--display); font-weight: 700; letter-spacing: .06em; color: var(--text); }
[data-layout="classic"] .brand-wordmark small { color: var(--muted); }
[data-layout="classic"] .preview-label { letter-spacing: .12em; font-weight: 600; color: var(--accent); background: var(--accent-soft); border-radius: 4px; padding: 2px 5px; margin-top: 2px; }
[data-layout="classic"][data-theme="dark"] .preview-label { color: #b6c2ff; }
[data-layout="classic"] .toolbar-button { border-radius: 8px; border-color: transparent; font-size: 12px; font-weight: 500; color: var(--muted); }
[data-layout="classic"] .toolbar-button:hover { background: var(--soft); color: var(--text); }
[data-layout="classic"] #theme-button { border-radius: 8px; }
[data-layout="classic"] .window-controls button { border-radius: 6px; }

/* Icons: one weight, rounded joins, a light duotone wash */
[data-layout="classic"] .standard-symbol { display: none; }
[data-layout="classic"] .classic-symbol { display: inline; }
[data-layout="classic"] svg { stroke-width: 1.7; stroke-linejoin: round; stroke-linecap: round; }
[data-layout="classic"] .icon-wash { stroke: none; fill: currentColor; opacity: .14; }
[data-layout="classic"] .icon-solid { stroke: none; fill: currentColor; }

/* Side navigation: round badges, brand blue when selected */
[data-layout="classic"] .nav-item {
  border: 0;
  outline: 0;
  box-shadow: none;
  background: transparent;
  color: var(--muted);
  gap: 6px;
  font-size: 10.5px;
  font-weight: 500;
  transition: background .15s ease, color .15s ease, box-shadow .15s ease;
}
[data-layout="classic"] .nav-item svg { width: 26px; height: 26px; transition: transform .16s ease; }
[data-layout="classic"] .nav-item:hover { color: var(--text); background: var(--soft); }
[data-layout="classic"] .nav-item:hover svg { transform: translateY(-1px); }
[data-layout="classic"] .nav-item.active { background: var(--accent); color: var(--accent-ink); font-weight: 600; box-shadow: 0 8px 18px -8px #4763ffb3; }
[data-layout="classic"] .nav-item.active .icon-wash { opacity: .28; }
[data-layout="classic"] .nav-item:focus-visible { outline: 2px solid var(--focus); outline-offset: 3px; }

/* Headings and text */
[data-layout="classic"] :is(h1, h2) { font-family: var(--display); }
[data-layout="classic"] h1 { font-size: 30px; font-weight: 650; letter-spacing: -.6px; line-height: 1.15; }
[data-layout="classic"] h2 { font-size: 18px; font-weight: 650; letter-spacing: -.2px; }
[data-layout="classic"] h3 { font-weight: 600; }
[data-layout="classic"] p { line-height: 1.55; }
[data-layout="classic"] .page-heading p { font-size: 12.5px; }
[data-layout="classic"] .device-chip { font-size: 11.5px; padding: 6px 10px; border: 1px solid var(--line); border-radius: 999px; background: var(--surface); }
[data-layout="classic"] .device-chip svg { color: var(--accent); }
[data-layout="classic"] #view-heading { padding-top: 18px; padding-bottom: 22px; }
[data-layout="classic"] #content { gap: 24px; }

/* Cards */
[data-layout="classic"] .panel,
[data-layout="classic"] .activity-panel {
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--surface);
  box-shadow: var(--shadow);
  padding: 20px;
  margin: 0 0 16px;
}
[data-layout="classic"] .activity-panel { padding: 4px 18px; }
[data-layout="classic"] .panel p { font-size: 12px; }
[data-layout="classic"] .panel-label { font-size: 10.5px; letter-spacing: .09em; font-weight: 650; gap: 8px; margin-bottom: 16px; color: var(--muted); }
[data-layout="classic"] .panel-label svg { width: 15px; height: 15px; color: var(--accent); }
[data-layout="classic"] .monitoring-status { font-size: 15px; font-weight: 650; gap: 10px; }
[data-layout="classic"] .status-dot { width: 9px; height: 9px; box-shadow: 0 0 0 4px var(--success-bg); }
[data-layout="classic"] .status-dot.off { box-shadow: 0 0 0 4px var(--warning-bg); }

/* Figures */
[data-layout="classic"] .large-reading { align-items: center; margin: 18px 0 16px; gap: 16px; line-height: 1; }
[data-layout="classic"] :is(.numeric, .metric strong, .step-number, .activity-row time, .section-meta) {
  font-family: var(--figures);
  font-variant-numeric: tabular-nums lining-nums;
  letter-spacing: 0;
}
[data-layout="classic"] .large-reading > .numeric { font-size: 58px; font-weight: 650; letter-spacing: -2px; color: var(--text); }
[data-layout="classic"] .large-reading > span:not(.numeric) { font-family: var(--words); font-size: 12px; line-height: 1.45; }
[data-layout="classic"] .metrics { gap: 10px; margin: 0 0 20px; }
[data-layout="classic"] .metric { border: 0; border-radius: 12px; background: var(--soft); padding: 14px 14px 12px; min-width: 0; }
[data-layout="classic"] .metric strong { font-size: 30px; font-weight: 650; line-height: 1.1; margin-bottom: 4px; overflow-wrap: anywhere; }
[data-layout="classic"] .metric span { font-size: 11px; }

/* Lists */
[data-layout="classic"] .ledger-row { padding: 13px 0; gap: 12px; }
[data-layout="classic"] .ledger-row strong { font-size: 13px; font-weight: 600; }
[data-layout="classic"] .ledger-row small { font-size: 11px; }
[data-layout="classic"] .ledger-row:hover { color: var(--accent); background: transparent; }
[data-layout="classic"][data-theme="dark"] .ledger-row:hover { color: #b6c2ff; }
[data-layout="classic"] .ledger-row:hover > svg:last-child { transform: translateX(2px); }
[data-layout="classic"] .ledger-row > svg:last-child { transition: transform .16s ease; color: var(--muted); }
[data-layout="classic"] .ledger-icon { background: var(--accent-soft); color: var(--accent); border-radius: 10px; width: 34px; height: 34px; flex: none; }
[data-layout="classic"][data-theme="dark"] .ledger-icon { color: #b6c2ff; }
[data-layout="classic"] .ledger-icon svg { width: 19px; height: 19px; }
[data-layout="classic"] .ledger-value { font-size: 22px; font-weight: 650; margin-left: auto; line-height: 1; }
[data-layout="classic"] .mini-fact { padding: 12px 0; }
[data-layout="classic"] .mini-fact strong { font-weight: 600; }

/* Buttons and fields */
[data-layout="classic"] :is(.primary, .secondary, .danger-button) { border-radius: 8px; min-height: 38px; padding: 9px 16px; font-weight: 600; }
[data-layout="classic"] .primary { box-shadow: 0 1px 2px #1a2a8a33; }
[data-layout="classic"] .secondary { background: var(--surface); border-color: var(--line); color: var(--text); }
[data-layout="classic"] .secondary:hover:not(:disabled) { background: var(--soft); border-color: #c9d1e3; }
[data-layout="classic"][data-theme="dark"] .secondary:hover:not(:disabled) { border-color: #34436a; }
[data-layout="classic"] .text-button { font-weight: 600; gap: 9px; color: var(--accent); }
[data-layout="classic"][data-theme="dark"] .text-button { color: #b6c2ff; }
[data-layout="classic"] .text-button:hover { color: var(--accent-hover); }
[data-layout="classic"][data-theme="dark"] .text-button:hover { color: #d3daff; }
[data-layout="classic"] :is(.primary, .secondary, .text-button):hover:not(:disabled) svg { transform: translateX(2px); }
[data-layout="classic"] :is(.primary, .secondary, .text-button) svg { transition: transform .16s ease; }
[data-layout="classic"] :is(select, .url-input, .scan-choices select) { border-radius: 8px; font-size: 12.5px; border-color: var(--line); background-color: var(--surface); color: var(--text); }
[data-layout="classic"] :is(select, .url-input):hover:not(:disabled) { border-color: #c3cbe0; }
[data-layout="classic"][data-theme="dark"] :is(select, .url-input):hover:not(:disabled) { border-color: #3a4a72; }
[data-layout="classic"] .scan-choices label { font-size: 11px; font-weight: 500; }
[data-layout="classic"] .scan-choices select { padding: 9px 8px; }
[data-layout="classic"] #scan-options {
  margin: 2px 4px 16px;
  padding: 18px 20px 16px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--surface);
  box-shadow: var(--shadow);
}
[data-layout="classic"] #scan-options .panel-label { margin-bottom: 12px; }
[data-layout="classic"] .choice-caption { font-size: 11px; }
[data-layout="classic"] #station-scope-note { font-size: 11px; }

/* Step guides */
[data-layout="classic"] .step-number { display: grid; place-items: center; flex: none; width: 26px; height: 26px; padding: 0; border-radius: 50%; background: var(--accent-soft); color: var(--accent); font-size: 12px; font-weight: 650; }
[data-layout="classic"][data-theme="dark"] .step-number { color: #b6c2ff; }
[data-layout="classic"] .scan-guide { gap: 14px; }
[data-layout="classic"] .scan-guide h2 { font-size: 16px; }

/* Scan control: the brand blue spine with a faint world grid */
[data-layout="classic"] #scan-station { border-inline: 1px solid #ffffff1f; background: var(--spine-bottom); }
[data-layout="classic"] .scan-switch {
  border-inline: 0;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 200' fill='none' stroke='%23fff' stroke-opacity='.09' stroke-width='1'%3E%3Ccircle cx='100' cy='100' r='96'/%3E%3Cellipse cx='100' cy='100' rx='48' ry='96'/%3E%3Cellipse cx='100' cy='100' rx='82' ry='96'/%3E%3Cpath d='M100 4v192M4 100h192M17 52h166M17 148h166'/%3E%3C/svg%3E") 50% 43% / 220px no-repeat,
    linear-gradient(180deg, var(--spine-top) 0%, #4058f4 42%, var(--spine-bottom) 100%);
}
[data-layout="classic"] .scan-switch-action { gap: 22px; }
[data-layout="classic"] .station-switch-title { font-size: 10px; font-weight: 650; letter-spacing: .2em; opacity: .85; }
[data-layout="classic"] .switch-disc {
  width: 100px;
  height: 100px;
  border: 1.5px solid #ffffffb8;
  background: radial-gradient(circle at 50% 30%, #ffffff3d, #ffffff12 72%);
  box-shadow: none;
  transition: background .15s ease, border-color .15s ease;
}
[data-layout="classic"] .switch-disc svg { width: 40px; height: 40px; stroke-width: 1.8; }
[data-layout="classic"] .switch-disc:hover:not(:disabled) { background: radial-gradient(circle at 50% 30%, #ffffff52, #ffffff1f 72%); border-color: #fff; }
[data-layout="classic"] #station-button-label { font-family: var(--display); font-size: 25px; font-weight: 650; letter-spacing: -.4px; }
[data-layout="classic"] .runner-caption { font-size: 11px; opacity: .9; }
[data-layout="classic"] .switch-track { width: 3px; height: 40px; border: 0; border-radius: 3px; background: #ffffff4d; }
[data-layout="classic"] .scan-switch.running {
  color: #ffffff;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 200' fill='none' stroke='%23fff' stroke-opacity='.08' stroke-width='1'%3E%3Ccircle cx='100' cy='100' r='96'/%3E%3Cellipse cx='100' cy='100' rx='48' ry='96'/%3E%3Cellipse cx='100' cy='100' rx='82' ry='96'/%3E%3Cpath d='M100 4v192M4 100h192M17 52h166M17 148h166'/%3E%3C/svg%3E") 50% 43% / 220px no-repeat,
    linear-gradient(180deg, #24339a 0%, #18226b 100%);
}
[data-layout="classic"] .scan-switch.running .switch-disc { color: #ffd08f; border-color: #ffc76a; background: radial-gradient(circle at 50% 30%, #ffc76a40, #ffc76a14 72%); box-shadow: none; transform: none; }
[data-layout="classic"] .scan-switch.running .switch-disc .globe-glyph { --glyph-ink: #fff3df; --glyph-cutout: #2a2a6e; }
[data-layout="classic"] .scan-switch.running .switch-track { background: #ffc76a80; }
[data-layout="classic"] #scan-station.is-running :is(.station-status, .station-foot) { color: #ffffff; }
[data-layout="classic"] .station-status strong { font-size: 12.5px; font-weight: 650; }
[data-layout="classic"] .station-status small { font-size: 10.5px; line-height: 1.45; opacity: .85; }
[data-layout="classic"] .station-foot { font-size: 10px; line-height: 1.65; opacity: .75; }

/* Supporting pieces */
[data-layout="classic"] :is(.module-icon, .empty-icon) { background: var(--accent-soft); color: var(--accent); border: 0; border-radius: 12px; width: 40px; height: 40px; }
[data-layout="classic"][data-theme="dark"] :is(.module-icon, .empty-icon) { color: #b6c2ff; }
[data-layout="classic"] :is(.module-icon, .empty-icon) svg { width: 22px; height: 22px; }
[data-layout="classic"] .empty-activity { padding: 14px 0; }
[data-layout="classic"] .activity-panel .empty-activity { padding: 14px 0; }
[data-layout="classic"] .activity-row { padding-inline: 0; }
[data-layout="classic"] .activity-row:hover { background: transparent; color: var(--accent); }
[data-layout="classic"] .activity-body strong { font-size: 12.5px; font-weight: 600; }
[data-layout="classic"] .pill { border-radius: 999px; padding: 3px 9px; font-size: 10px; font-weight: 600; }
[data-layout="classic"] .finding { border: 1px solid var(--line); border-radius: 12px; background: var(--surface); box-shadow: var(--shadow); }
[data-layout="classic"] .finding summary { padding: 14px 16px; }
[data-layout="classic"] .finding .detail { padding-inline: 16px; }
[data-layout="classic"] :is(.report-path, .finding-path, .recommendation, .info-strip, #notice, #protection-reminder, #scan-progress) { border-radius: 10px; }
[data-layout="classic"] #scan-progress { box-shadow: var(--shadow); }
[data-layout="classic"] .filter { border-radius: 999px; padding: 5px 11px; font-weight: 500; }
[data-layout="classic"] .header-checks span { border-radius: 6px; }
[data-layout="classic"] .setting-row strong { font-size: 13px; font-weight: 600; }
[data-layout="classic"] .setting-row p { font-size: 11.5px; }
[data-layout="classic"] .setting-row select { font-size: 12px; }
[data-layout="classic"] .switch input { background: #cfd6e6; border-color: transparent; }
[data-layout="classic"][data-theme="dark"] .switch input { background: #2f3d5e; }
[data-layout="classic"] .switch input:checked { background: var(--accent); border-color: var(--accent); }
[data-layout="classic"] .switch span { background: #ffffff; box-shadow: 0 1px 2px #0f1b3340; }
[data-layout="classic"] .workspace-footer { font-size: 10.5px; padding: 12px 25px; background: var(--surface); }
[data-layout="classic"][data-theme="dark"] .workspace-footer { background: #0e1626; }

/* Dialogs opened from Classic */
[data-layout="classic"] #scan-dialog { border-radius: 16px; font-family: var(--words); }
[data-layout="classic"] #scan-dialog::backdrop { background: #0b1220b3; }
[data-layout="classic"] #scan-dialog h2 { font-family: var(--display); font-weight: 650; }
[data-layout="classic"] .scan-preset { border-radius: 10px; }
[data-layout="classic"] .scan-preset:has(:checked) { background: var(--accent-soft); }
[data-layout="classic"] #scan-dialog button:not(#scan-dialog-close) { border-radius: 8px; font-weight: 600; }
[data-layout="classic"] :is(#threat-dialog, #licence-dialog) { background: #0f1a30; border-color: #2c3b5e; border-radius: 16px; font-family: var(--words); }
[data-layout="classic"] :is(#threat-dialog, #licence-dialog)::backdrop { background: #0b1220b3; }
[data-layout="classic"] :is(.threat-files, .threat-files article, .licence-plans) { border-color: #2c3b5e; }
[data-layout="classic"] #licence-dialog input { background: #17223a; border-color: #2c3b5e; }

@media (max-width: 1050px) {
  [data-layout="classic"] .app-shell { --scan-width: 140px; }
  [data-layout="classic"] #content { gap: 14px; }
  [data-layout="classic"] h1 { font-size: 26px; }
  [data-layout="classic"] .panel { padding: 16px; }
  [data-layout="classic"] .activity-panel { padding: 2px 14px; }
  [data-layout="classic"] #scan-options { padding: 14px 14px 12px; margin-bottom: 14px; }
  [data-layout="classic"] .large-reading { gap: 12px; }
  [data-layout="classic"] .large-reading > .numeric { font-size: 46px; }
  [data-layout="classic"] .large-reading > span:not(.numeric) { font-size: 11px; }
  [data-layout="classic"] .nav-item { font-size: 9px; gap: 4px; }
  [data-layout="classic"] .nav-item svg { width: 22px; height: 22px; }
  [data-layout="classic"] .scan-choices { grid-template-columns: minmax(0, 1fr); gap: 9px; }
  [data-layout="classic"] .switch-disc { width: 88px; height: 88px; }
  [data-layout="classic"] .station-foot { font-size: 9px; }
  [data-layout="classic"] .workspace-footer { font-size: 9.5px; }
  [data-layout="classic"] .ledger-row { gap: 9px; }
  [data-layout="classic"] .ledger-icon { width: 30px; height: 30px; }
  [data-layout="classic"] .ledger-value { font-size: 20px; }
  [data-layout="classic"] .metric strong { font-size: 26px; }
}
@media (max-height: 700px) {
  [data-layout="classic"] .titlebar { height: 59px; }
  [data-layout="classic"] #view-heading { padding-top: 10px; padding-bottom: 16px; }
  [data-layout="classic"] .switch-disc { width: 78px; height: 78px; }
  [data-layout="classic"] .switch-track { height: 26px; }
  [data-layout="classic"] #station-button-label { font-size: 22px; }
  [data-layout="classic"] .station-foot { font-size: 8.5px; }
}
@media (prefers-reduced-motion: reduce) {
  [data-layout="classic"] :is(svg, .switch-disc, .nav-item) { transition: none; }
}
@media (forced-colors: active) {
  [data-layout="classic"] .nav-item.active { outline: 2px solid Highlight; }
  [data-layout="classic"] .icon-wash { opacity: .3; }
  [data-layout="classic"] .switch-disc { border: 2px solid ButtonText; }
}
[data-layout="classic"] .switch-disc .globe-glyph { width: 72px; height: 72px; }
@media (max-width: 1050px) { [data-layout="classic"] .switch-disc .globe-glyph { width: 62px; height: 62px; } }
@media (max-height: 700px) { [data-layout="classic"] .switch-disc .globe-glyph { width: 56px; height: 56px; } }
[data-layout="classic"] #scan-station .scan-pause { background: #ffffff1f; border-color: #ffffff8c; color: #ffffff; font-family: var(--words); }
[data-layout="classic"] #scan-station .scan-pause:hover:not(:disabled) { background: #ffffff33; }
[data-layout="classic"] #scan-station .scan-pause:focus-visible { outline-color: #ffffff; }
