/* Hub v211: visual-only theme presets. Navigation, layout and semantic status colors stay unchanged. */
html[data-hub-theme="classic"] {
  --hub-theme-bg: #eef3f8;
  --hub-theme-surface: #ffffff;
  --hub-theme-surface-soft: #f4f8fc;
  --hub-theme-text: #142844;
  --hub-theme-muted: #53657b;
  --hub-theme-line: #cbd9e7;
  --hub-theme-accent: #1769c2;
  --hub-theme-accent-strong: #0b4f93;
  --hub-theme-accent-soft: #e4f0ff;
  --hub-theme-hero-start: #0d2949;
  --hub-theme-hero-middle: #0b6176;
  --hub-theme-hero-end: #0b736b;
  --hub-theme-hero-copy: #e8f8f8;
  --hub-theme-glow: rgba(34, 135, 178, .13);
  --hub-theme-shadow: rgba(20, 49, 82, .09);
  --hub-theme-focus: #0b64c0;
}

html[data-hub-theme="ocean"] {
  --hub-theme-bg: #e9f8fb;
  --hub-theme-surface: #ffffff;
  --hub-theme-surface-soft: #effbfc;
  --hub-theme-text: #0c3440;
  --hub-theme-muted: #42636b;
  --hub-theme-line: #b9dce3;
  --hub-theme-accent: #087e98;
  --hub-theme-accent-strong: #056177;
  --hub-theme-accent-soft: #d9f3f7;
  --hub-theme-hero-start: #06384b;
  --hub-theme-hero-middle: #087f92;
  --hub-theme-hero-end: #08706d;
  --hub-theme-hero-copy: #eaffff;
  --hub-theme-glow: rgba(21, 166, 161, .17);
  --hub-theme-shadow: rgba(7, 83, 101, .10);
  --hub-theme-focus: #087e98;
}

html[data-hub-theme="forest"] {
  --hub-theme-bg: #eef7f0;
  --hub-theme-surface: #ffffff;
  --hub-theme-surface-soft: #f2f9f3;
  --hub-theme-text: #183629;
  --hub-theme-muted: #50685b;
  --hub-theme-line: #c5ddca;
  --hub-theme-accent: #287a4e;
  --hub-theme-accent-strong: #185c39;
  --hub-theme-accent-soft: #e0f2e5;
  --hub-theme-hero-start: #153b2b;
  --hub-theme-hero-middle: #276346;
  --hub-theme-hero-end: #3b6033;
  --hub-theme-hero-copy: #effff3;
  --hub-theme-glow: rgba(69, 136, 79, .16);
  --hub-theme-shadow: rgba(35, 86, 57, .10);
  --hub-theme-focus: #287a4e;
}

html[data-hub-theme="celebration"] {
  --hub-theme-bg: #fbf2fb;
  --hub-theme-surface: #ffffff;
  --hub-theme-surface-soft: #fff7fc;
  --hub-theme-text: #351840;
  --hub-theme-muted: #6b526f;
  --hub-theme-line: #dfcce5;
  --hub-theme-accent: #8b3fc7;
  --hub-theme-accent-strong: #6e258d;
  --hub-theme-accent-soft: #f6eafa;
  --hub-theme-hero-start: #4c1d74;
  --hub-theme-hero-middle: #a42e6f;
  --hub-theme-hero-end: #8f421b;
  --hub-theme-hero-copy: #fff8ec;
  --hub-theme-glow: rgba(187, 63, 149, .15);
  --hub-theme-shadow: rgba(95, 36, 104, .11);
  --hub-theme-focus: #8b3fc7;
}

html[data-dark="true"][data-hub-theme="classic"] {
  --hub-theme-bg: #071124;
  --hub-theme-surface: #101d38;
  --hub-theme-surface-soft: #162642;
  --hub-theme-text: #eef5ff;
  --hub-theme-muted: #b7c4d7;
  --hub-theme-line: #33496a;
  --hub-theme-accent: #65a9ff;
  --hub-theme-accent-strong: #95c5ff;
  --hub-theme-accent-soft: #18365d;
  --hub-theme-hero-start: #071a34;
  --hub-theme-hero-middle: #0a4559;
  --hub-theme-hero-end: #0c6d65;
  --hub-theme-hero-copy: #e8f8f8;
  --hub-theme-glow: rgba(62, 143, 210, .18);
  --hub-theme-shadow: rgba(0, 0, 0, .32);
  --hub-theme-focus: #65a9ff;
}

html[data-dark="true"][data-hub-theme="ocean"] {
  --hub-theme-bg: #04171c;
  --hub-theme-surface: #0b2931;
  --hub-theme-surface-soft: #103741;
  --hub-theme-text: #effcff;
  --hub-theme-muted: #b0ccd2;
  --hub-theme-line: #2e5962;
  --hub-theme-accent: #5fd6e5;
  --hub-theme-accent-strong: #92ebf4;
  --hub-theme-accent-soft: #123f49;
  --hub-theme-hero-start: #042a35;
  --hub-theme-hero-middle: #075e6e;
  --hub-theme-hero-end: #0a7b78;
  --hub-theme-hero-copy: #eaffff;
  --hub-theme-glow: rgba(39, 190, 192, .20);
  --hub-theme-shadow: rgba(0, 0, 0, .34);
  --hub-theme-focus: #5fd6e5;
}

html[data-dark="true"][data-hub-theme="forest"] {
  --hub-theme-bg: #08170f;
  --hub-theme-surface: #11271b;
  --hub-theme-surface-soft: #173324;
  --hub-theme-text: #f0fbf3;
  --hub-theme-muted: #b8d1c0;
  --hub-theme-line: #355843;
  --hub-theme-accent: #70d69a;
  --hub-theme-accent-strong: #a0e8bb;
  --hub-theme-accent-soft: #173d29;
  --hub-theme-hero-start: #0d291c;
  --hub-theme-hero-middle: #1d5136;
  --hub-theme-hero-end: #365a30;
  --hub-theme-hero-copy: #effff3;
  --hub-theme-glow: rgba(86, 171, 101, .20);
  --hub-theme-shadow: rgba(0, 0, 0, .33);
  --hub-theme-focus: #70d69a;
}

html[data-dark="true"][data-hub-theme="celebration"] {
  --hub-theme-bg: #160d24;
  --hub-theme-surface: #27153b;
  --hub-theme-surface-soft: #331d4a;
  --hub-theme-text: #fff8f0;
  --hub-theme-muted: #d7c5df;
  --hub-theme-line: #563b6f;
  --hub-theme-accent: #ffd05a;
  --hub-theme-accent-strong: #ffe398;
  --hub-theme-accent-soft: #493317;
  --hub-theme-hero-start: #3a1456;
  --hub-theme-hero-middle: #7d235d;
  --hub-theme-hero-end: #8c451f;
  --hub-theme-hero-copy: #fff8ec;
  --hub-theme-glow: rgba(216, 97, 169, .20);
  --hub-theme-shadow: rgba(0, 0, 0, .35);
  --hub-theme-focus: #ffd05a;
}

html[data-hub-theme] body.page-hub {
  background:
    radial-gradient(circle at 86% 0, var(--hub-theme-glow), transparent 28rem),
    var(--hub-theme-bg);
  color: var(--hub-theme-text);
}

html[data-hub-theme] .page-hub .topbar,
html[data-hub-theme] .page-hub .primary-card,
html[data-hub-theme] .page-hub .secondary-grid > a {
  border-color: var(--hub-theme-line);
  background: var(--hub-theme-surface);
  box-shadow: 0 8px 24px var(--hub-theme-shadow);
}

html[data-hub-theme] .page-hub .brand strong,
html[data-hub-theme] .page-hub .section-heading h2,
html[data-hub-theme] .page-hub .primary-card h3,
html[data-hub-theme] .page-hub .secondary-grid > a strong {
  color: var(--hub-theme-text);
}

html[data-hub-theme] .page-hub .brand small,
html[data-hub-theme] .page-hub .section-heading > span,
html[data-hub-theme] .page-hub .primary-card p,
html[data-hub-theme] .page-hub footer {
  color: var(--hub-theme-muted);
}

html[data-hub-theme] .page-hub .hero {
  background: linear-gradient(115deg, var(--hub-theme-hero-start), var(--hub-theme-hero-middle) 62%, var(--hub-theme-hero-end));
  box-shadow: 0 15px 34px var(--hub-theme-shadow);
}

html[data-hub-theme] .page-hub .hero .eyebrow,
html[data-hub-theme] .page-hub .hero h1 span,
html[data-hub-theme] .page-hub .hub-clock-label {
  color: var(--hub-theme-hero-copy);
}

html[data-hub-theme] .page-hub .hero-copy > p:last-child,
html[data-hub-theme] .page-hub .hub-clock-date {
  color: var(--hub-theme-hero-copy);
}

html[data-hub-theme] .page-hub .secondary-grid > a:hover,
html[data-hub-theme] .page-hub .ghost:hover {
  border-color: var(--hub-theme-accent);
  background: var(--hub-theme-surface-soft);
}

html[data-hub-theme] .page-hub .secondary-grid > a span {
  background: var(--hub-theme-accent-soft);
  color: var(--hub-theme-accent-strong);
}

html[data-hub-theme] .page-hub .secondary-grid > a i,
html[data-hub-theme] .page-hub .eyebrow {
  color: var(--hub-theme-accent-strong);
}

html[data-hub-theme] .page-hub .ghost {
  border-color: var(--hub-theme-line);
  background: var(--hub-theme-surface);
  color: var(--hub-theme-text);
}

html[data-hub-theme] .page-hub :focus-visible,
.hub-theme-dialog :focus-visible {
  outline: 3px solid var(--hub-theme-focus);
  outline-offset: 3px;
}

.hub-theme-open {
  white-space: nowrap;
}

.hub-theme-dialog {
  width: min(760px, calc(100% - 24px));
  max-height: min(760px, calc(100dvh - 24px));
  padding: 0;
  overflow: auto;
  border: 0;
  border-radius: 24px;
  background: transparent;
  color: var(--hub-theme-text);
}

.hub-theme-dialog::backdrop {
  background: rgba(3, 10, 25, .72);
  backdrop-filter: blur(7px);
}

.hub-theme-panel {
  padding: 24px;
  border: 1px solid var(--hub-theme-line);
  border-radius: 24px;
  background: var(--hub-theme-surface);
  box-shadow: 0 30px 80px rgba(0, 0, 0, .30);
}

.hub-theme-head,
.hub-theme-mode {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.hub-theme-head h2 {
  margin: 3px 0 0;
  font-size: 28px;
}

.hub-theme-head .eyebrow {
  margin: 0;
  color: var(--hub-theme-accent-strong);
}

.hub-theme-close {
  width: 44px;
  min-width: 44px;
  min-height: 44px;
  padding: 0;
  border: 1px solid var(--hub-theme-line);
  border-radius: 50%;
  background: var(--hub-theme-surface-soft);
  color: var(--hub-theme-text);
  font: inherit;
  font-size: 22px;
  cursor: pointer;
}

.hub-theme-summary {
  margin: 10px 0 20px;
  color: var(--hub-theme-muted);
  font-size: 14px;
}

.hub-theme-fieldset {
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
}

.hub-theme-fieldset legend {
  margin-bottom: 10px;
  color: var(--hub-theme-text);
  font-weight: 900;
}

.hub-theme-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.hub-theme-option {
  position: relative;
  min-width: 0;
  cursor: pointer;
}

.hub-theme-option input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
}

.hub-theme-option-card {
  display: grid;
  grid-template-columns: 88px minmax(0, 1fr) 24px;
  align-items: center;
  gap: 12px;
  min-height: 84px;
  padding: 11px;
  border: 2px solid var(--hub-theme-line);
  border-radius: 17px;
  background: var(--hub-theme-surface-soft);
  transition: border-color .16s ease, box-shadow .16s ease, background .16s ease;
}

.hub-theme-option input:checked + .hub-theme-option-card {
  border-color: var(--hub-theme-accent);
  background: var(--hub-theme-accent-soft);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--hub-theme-accent) 18%, transparent);
}

.hub-theme-option input:focus-visible + .hub-theme-option-card {
  outline: 3px solid var(--hub-theme-focus);
  outline-offset: 3px;
}

.hub-theme-swatch {
  display: grid;
  grid-template-columns: 1.4fr 1fr 1fr;
  gap: 4px;
  height: 58px;
  padding: 6px;
  border-radius: 12px;
  background: #f4f7fb;
  box-shadow: inset 0 0 0 1px rgba(20, 40, 68, .12);
}

.hub-theme-swatch i {
  border-radius: 7px;
}

.hub-theme-swatch[data-preview="company"] i:nth-child(1) { background: linear-gradient(145deg, #1769c2, #139b8e); }
.hub-theme-swatch[data-preview="company"] i:nth-child(2) { background: #ffffff; }
.hub-theme-swatch[data-preview="company"] i:nth-child(3) { background: #e4f0ff; }
.hub-theme-swatch[data-preview="classic"] i:nth-child(1) { background: #0d2949; }
.hub-theme-swatch[data-preview="classic"] i:nth-child(2) { background: #139b8e; }
.hub-theme-swatch[data-preview="classic"] i:nth-child(3) { background: #e4f0ff; }
.hub-theme-swatch[data-preview="ocean"] i:nth-child(1) { background: #06384b; }
.hub-theme-swatch[data-preview="ocean"] i:nth-child(2) { background: #15a6a1; }
.hub-theme-swatch[data-preview="ocean"] i:nth-child(3) { background: #d9f3f7; }
.hub-theme-swatch[data-preview="forest"] i:nth-child(1) { background: #153b2b; }
.hub-theme-swatch[data-preview="forest"] i:nth-child(2) { background: #5a874a; }
.hub-theme-swatch[data-preview="forest"] i:nth-child(3) { background: #e0f2e5; }
.hub-theme-swatch[data-preview="celebration"] i:nth-child(1) { background: #4c1d74; }
.hub-theme-swatch[data-preview="celebration"] i:nth-child(2) { background: #d8892d; }
.hub-theme-swatch[data-preview="celebration"] i:nth-child(3) { background: #f6eafa; }

.hub-theme-option-copy {
  min-width: 0;
}

.hub-theme-option-copy strong,
.hub-theme-option-copy small {
  display: block;
}

.hub-theme-option-copy strong {
  color: var(--hub-theme-text);
  font-size: 15px;
}

.hub-theme-option-copy small {
  margin-top: 4px;
  overflow: hidden;
  color: var(--hub-theme-muted);
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.hub-theme-check {
  color: transparent;
  font-size: 20px;
  font-weight: 950;
}

.hub-theme-option input:checked + .hub-theme-option-card .hub-theme-check {
  color: var(--hub-theme-accent-strong);
}

.hub-theme-mode {
  margin-top: 18px;
  padding: 14px;
  border: 1px solid var(--hub-theme-line);
  border-radius: 16px;
  background: var(--hub-theme-surface-soft);
}

.hub-theme-mode strong,
.hub-theme-mode small {
  display: block;
}

.hub-theme-mode small {
  margin-top: 3px;
  color: var(--hub-theme-muted);
}

.hub-theme-mode [data-theme] {
  min-height: 44px;
  white-space: nowrap;
}

.hub-theme-done {
  width: 100%;
  min-height: 48px;
  margin-top: 16px;
  border: 0;
  border-radius: 14px;
  background: var(--hub-theme-accent-strong);
  color: var(--hub-theme-surface);
  font: inherit;
  font-weight: 900;
  cursor: pointer;
}

@media (max-width: 620px) {
  .hub-theme-dialog {
    width: min(100% - 12px, 760px);
    max-height: calc(100dvh - 12px);
  }

  .hub-theme-panel {
    padding: 18px 14px 14px;
  }

  .hub-theme-head h2 {
    font-size: 23px;
  }

  .hub-theme-grid {
    grid-template-columns: 1fr;
  }

  .hub-theme-option-card {
    grid-template-columns: 76px minmax(0, 1fr) 22px;
    min-height: 76px;
  }

  .hub-theme-swatch {
    height: 52px;
  }

  .hub-theme-mode {
    align-items: flex-start;
    flex-direction: column;
  }

  .hub-theme-mode [data-theme] {
    width: 100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .hub-theme-option-card {
    transition: none;
  }
}