/*
 * Midnight Aurora — one responsive visual system for every Localmachine tool.
 * This file intentionally loads last and modernises the existing product UI
 * without changing any of its behaviour or server-rendered structure.
 */

:root {
  --aurora-bg: #070b16;
  --aurora-bg-soft: #0b1020;
  --aurora-panel: rgba(16, 24, 43, .82);
  --aurora-panel-solid: #10182b;
  --aurora-panel-raised: #151f36;
  --aurora-line: rgba(148, 163, 184, .17);
  --aurora-line-strong: rgba(148, 163, 184, .28);
  --aurora-text: #edf3ff;
  --aurora-muted: #92a0b8;
  --aurora-faint: #66738b;
  --aurora-violet: #8b5cf6;
  --aurora-violet-bright: #a78bfa;
  --aurora-cyan: #22d3ee;
  --aurora-green: #34d399;
  --aurora-orange: #fbbf24;
  --aurora-red: #fb7185;
  --aurora-gradient: linear-gradient(135deg, #8b5cf6 0%, #6366f1 45%, #22d3ee 100%);
  --aurora-shadow: 0 24px 70px rgba(0, 0, 0, .28);
  --aurora-radius: 18px;
  --aurora-radius-sm: 11px;
}

/* Tools homepage */
.tools-home {
  margin: 0;
  min-height: 100vh;
  color: var(--aurora-text);
  background:
    radial-gradient(circle at 8% 0%, rgba(139, 92, 246, .18), transparent 30rem),
    radial-gradient(circle at 96% 10%, rgba(34, 211, 238, .11), transparent 30rem),
    var(--aurora-bg);
  background-attachment: fixed;
  color-scheme: dark;
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.tools-home * { box-sizing: border-box; }
.tools-home a { color: inherit; text-decoration: none; }
.tools-home button { font: inherit; }

.tools-header {
  min-height: 68px;
  padding: 8px max(22px, calc((100vw - 1440px) / 2));
  position: sticky;
  top: 0;
  z-index: 20;
  display: grid;
  grid-template-columns: minmax(190px, 1fr) auto minmax(190px, 1fr);
  align-items: center;
  gap: 18px;
  border-bottom: 1px solid var(--aurora-line);
  background: rgba(7, 11, 22, .8);
  backdrop-filter: blur(20px) saturate(145%);
  -webkit-backdrop-filter: blur(20px) saturate(145%);
}

.tools-brand {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  width: max-content;
}

.tools-brand > span {
  width: 35px;
  height: 35px;
  display: grid;
  place-items: center;
  color: #fff;
  border-radius: 10px;
  background: var(--aurora-gradient);
  box-shadow: 0 10px 26px rgba(99, 102, 241, .28);
  font-size: 10px;
  font-weight: 850;
  letter-spacing: .06em;
}

.tools-brand strong { font-size: 15px; letter-spacing: -.035em; }
.tools-brand em { color: var(--aurora-cyan); font-style: normal; }
.tools-header .global-tool-nav { justify-self: center; }
.tools-header .global-auth-actions { justify-self: end; }

.tools-main {
  width: min(1280px, calc(100% - 48px));
  margin: 0 auto;
}

.tools-hero {
  min-height: 480px;
  padding: 90px 0 70px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 210px;
  align-items: center;
  gap: 70px;
}

.tools-home .eyebrow {
  margin: 0 0 17px;
  color: var(--aurora-cyan);
  font-size: 10px;
  font-weight: 850;
  letter-spacing: .16em;
}

.tools-hero h1 {
  max-width: 900px;
  margin: 0;
  color: var(--aurora-text);
  font-size: clamp(52px, 7vw, 94px);
  font-weight: 780;
  line-height: .94;
  letter-spacing: -.07em;
}

.tools-hero h1 em {
  color: transparent;
  background: var(--aurora-gradient);
  background-clip: text;
  -webkit-background-clip: text;
  font-style: normal;
}

.tools-hero > div > p:last-child {
  max-width: 720px;
  margin: 26px 0 0;
  color: var(--aurora-muted);
  font-size: 17px;
  line-height: 1.7;
}

.tool-summary {
  padding: 24px;
  display: flex;
  flex-direction: column;
  border: 1px solid var(--aurora-line-strong);
  border-radius: 20px;
  background: linear-gradient(145deg, rgba(20, 30, 52, .9), rgba(13, 20, 36, .92));
  box-shadow: var(--aurora-shadow), inset 0 1px rgba(255, 255, 255, .04);
}

.tool-summary span { color: var(--aurora-cyan); font-size: 9px; font-weight: 800; letter-spacing: .11em; text-transform: uppercase; }
.tool-summary strong { margin: 10px 0 2px; font-size: 58px; line-height: 1; letter-spacing: -.07em; }
.tool-summary small { color: var(--aurora-muted); font-size: 11px; }

.tools-directory {
  padding: 60px 0 80px;
  border-top: 1px solid var(--aurora-line);
}

.tools-directory > header {
  margin-bottom: 28px;
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 30px;
}

.tools-directory h2 { margin: 0; font-size: clamp(30px, 4vw, 46px); letter-spacing: -.05em; }
.tools-directory > header > p { max-width: 440px; margin: 0; color: var(--aurora-muted); font-size: 12px; line-height: 1.65; text-align: right; }

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

.tool-card {
  min-height: 330px;
  padding: 25px;
  position: relative;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  border: 1px solid var(--aurora-line);
  border-radius: 20px;
  background: linear-gradient(145deg, rgba(20, 30, 52, .88), rgba(13, 20, 36, .9));
  box-shadow: 0 16px 45px rgba(0, 0, 0, .16), inset 0 1px rgba(255, 255, 255, .035);
  transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}

.tool-card::after {
  content: "";
  position: absolute;
  width: 180px;
  height: 180px;
  right: -90px;
  bottom: -100px;
  border-radius: 50%;
  background: var(--tool-glow, rgba(139, 92, 246, .12));
  filter: blur(18px);
  pointer-events: none;
}

.tool-card:hover,
.tool-card:focus-visible {
  transform: translateY(-4px);
  border-color: var(--tool-accent, var(--aurora-violet));
  box-shadow: 0 24px 60px rgba(0, 0, 0, .25), inset 0 1px rgba(255, 255, 255, .05);
  outline: none;
}

.tool-card.accent-violet { --tool-accent: #a78bfa; --tool-glow: rgba(139, 92, 246, .16); }
.tool-card.accent-cyan { --tool-accent: #22d3ee; --tool-glow: rgba(34, 211, 238, .13); }
.tool-card.accent-orange { --tool-accent: #fbbf24; --tool-glow: rgba(251, 191, 36, .12); }
.tool-card.accent-green { --tool-accent: #34d399; --tool-glow: rgba(52, 211, 153, .13); }
.tool-card.accent-pink { --tool-accent: #f472b6; --tool-glow: rgba(244, 114, 182, .13); }

.tool-card-top { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 12px; }
.tool-mark {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  color: var(--tool-accent);
  border: 1px solid color-mix(in srgb, var(--tool-accent) 28%, transparent);
  border-radius: 12px;
  background: color-mix(in srgb, var(--tool-accent) 11%, transparent);
  font-size: 17px;
  font-weight: 800;
}
.tool-category { color: var(--aurora-muted); font-size: 9px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.tool-arrow { color: var(--aurora-faint); font-size: 18px; transition: color .18s, transform .18s; }
.tool-card:hover .tool-arrow { color: var(--tool-accent); transform: translate(2px, -2px); }

.tool-card-copy { margin-top: 24px; }
.tool-card h3 { margin: 0; font-size: 24px; letter-spacing: -.045em; }
.tool-card-copy p { max-width: 540px; margin: 10px 0 0; color: var(--aurora-muted); font-size: 13px; line-height: 1.65; }
.tool-card ul { margin: 20px 0 25px; padding: 0; display: flex; flex-wrap: wrap; gap: 7px; list-style: none; }
.tool-card li { padding: 6px 8px; color: var(--aurora-muted); border: 1px solid var(--aurora-line); border-radius: 7px; background: rgba(255, 255, 255, .025); font-size: 9px; font-weight: 700; }
.tool-open { margin-top: auto; color: var(--aurora-text); font-size: 11px; font-weight: 800; }
.tool-open b { margin-left: 7px; color: var(--tool-accent); font-size: 14px; }

.tools-empty { grid-column: 1 / -1; padding: 60px 24px; display: grid; gap: 7px; color: var(--aurora-muted); border: 1px dashed var(--aurora-line-strong); border-radius: 18px; text-align: center; }
.tools-empty strong { color: var(--aurora-text); }
.tools-footer { padding: 24px 0 40px; display: flex; justify-content: space-between; color: var(--aurora-faint); border-top: 1px solid var(--aurora-line); font-size: 10px; }
.tools-footer p { margin: 0; }

/* Consistent product identity: localmachine + current tool name. */
.product-brand {
  min-width: 0;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: var(--aurora-text);
  text-decoration: none;
}

.product-brand .product-brand-mark {
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  display: grid;
  place-items: center;
  color: #fff;
  border: 0;
  border-radius: 10px;
  background: var(--aurora-gradient);
  box-shadow: 0 10px 26px rgba(99, 102, 241, .28);
  font-family: Inter, ui-sans-serif, sans-serif;
  font-size: 9px;
  font-weight: 850;
  letter-spacing: .06em;
}

.product-brand strong {
  min-width: 0;
  color: var(--aurora-text);
  font-size: 15px;
  font-weight: 750;
  letter-spacing: -.035em;
  white-space: nowrap;
}

.product-brand strong em {
  margin-left: 5px;
  color: var(--aurora-cyan);
  font-style: normal;
  font-weight: 650;
}

.command-theme .sidebar .product-brand {
  padding-inline: 10px;
}

.command-theme .sidebar .product-brand strong em { color: var(--aurora-cyan); }
.mocker-theme .topbar .product-brand strong em { color: var(--aurora-cyan); }

@media (max-width: 620px) {
  .product-brand strong { font-size: 13px; }
  .product-brand strong em { margin-left: 4px; }
}

@media (max-width: 420px) {
  .product-brand strong { display: none; }
}

.documentation-theme,
.command-theme,
.mocker-theme,
.portal-page,
.auth-page {
  --ink: var(--aurora-text);
  --muted: var(--aurora-muted);
  --line: var(--aurora-line);
  --canvas: var(--aurora-bg);
  --paper: var(--aurora-bg);
  --card: var(--aurora-panel-solid);
  --panel: var(--aurora-panel-solid);
  --nav: var(--aurora-bg-soft);
  --purple: var(--aurora-violet);
  --green: var(--aurora-green);
  --orange: var(--aurora-orange);
  --red: var(--aurora-red);
  color: var(--aurora-text);
  background:
    radial-gradient(circle at 8% 0%, rgba(139, 92, 246, .16), transparent 28rem),
    radial-gradient(circle at 95% 8%, rgba(34, 211, 238, .10), transparent 28rem),
    var(--aurora-bg);
  background-attachment: fixed;
  color-scheme: dark;
}

.documentation-theme *,
.command-theme *,
.mocker-theme *,
.portal-page *,
.auth-page * {
  scrollbar-color: rgba(139, 92, 246, .55) rgba(255, 255, 255, .035);
}

.documentation-theme ::selection,
.command-theme ::selection,
.mocker-theme ::selection,
.portal-page ::selection,
.auth-page ::selection {
  color: #fff;
  background: rgba(139, 92, 246, .7);
}

.documentation-theme button,
.documentation-theme input,
.documentation-theme select,
.documentation-theme textarea,
.command-theme button,
.command-theme input,
.command-theme select,
.command-theme textarea,
.mocker-theme button,
.mocker-theme input,
.mocker-theme select,
.mocker-theme textarea,
.portal-page button,
.portal-page input,
.auth-page button,
.auth-page input {
  border-radius: var(--aurora-radius-sm);
}

.documentation-theme button,
.command-theme button,
.mocker-theme button,
.portal-page button,
.auth-page button,
.global-tool-nav a,
.global-auth-actions a {
  transition: color .18s ease, background .18s ease, border-color .18s ease,
    box-shadow .18s ease, transform .18s ease, opacity .18s ease;
}

.documentation-theme button:hover:not(:disabled),
.command-theme button:hover:not(:disabled),
.mocker-theme button:hover:not(:disabled),
.portal-page button:hover:not(:disabled),
.auth-page button:hover:not(:disabled) {
  transform: translateY(-1px);
}

.documentation-theme :focus-visible,
.command-theme :focus-visible,
.mocker-theme :focus-visible,
.portal-page :focus-visible,
.auth-page :focus-visible {
  outline: 2px solid var(--aurora-cyan) !important;
  outline-offset: 3px !important;
}

/* Shared navigation */
.documentation-theme .topbar,
.command-theme .topbar,
.command-theme .repo-topbar,
.mocker-theme .topbar,
.portal-page .portal-header {
  color: var(--aurora-text);
  background: rgba(7, 11, 22, .78);
  border-color: var(--aurora-line);
  box-shadow: 0 1px 0 rgba(255, 255, 255, .025);
  backdrop-filter: blur(20px) saturate(145%);
  -webkit-backdrop-filter: blur(20px) saturate(145%);
}

.global-tool-nav,
.documentation-theme .global-tool-nav,
.command-theme .global-tool-nav,
.mocker-theme .global-tool-nav,
.portal-page .global-tool-nav {
  --header-ink: var(--aurora-text);
  --header-muted: var(--aurora-muted);
  --header-surface: rgba(255, 255, 255, .055);
  --header-active-ink: #fff;
  --header-line: var(--aurora-line);
  --header-accent: var(--aurora-cyan);
  padding: 4px;
  gap: 2px;
  border: 1px solid var(--aurora-line);
  border-radius: 13px;
  background: rgba(255, 255, 255, .025);
}

.global-tool-nav a {
  padding: 8px 13px;
  border-radius: 9px;
  font-size: 11px;
  letter-spacing: .01em;
}

.global-tool-nav a:hover { background: rgba(255, 255, 255, .06); }

.global-tool-nav a.active {
  color: #fff;
  border-color: rgba(167, 139, 250, .2);
  background: linear-gradient(135deg, rgba(139, 92, 246, .28), rgba(34, 211, 238, .13));
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .03), 0 8px 24px rgba(0, 0, 0, .15);
}

.global-tool-nav a.active::before { background: var(--aurora-cyan); }

.global-auth-actions,
.documentation-theme .global-auth-actions,
.command-theme .global-auth-actions,
.mocker-theme .global-auth-actions,
.portal-page .global-auth-actions {
  --header-ink: var(--aurora-text);
  --header-muted: var(--aurora-muted);
  --header-surface: rgba(255, 255, 255, .055);
  --header-line: var(--aurora-line);
  --header-accent: var(--aurora-cyan);
}

.global-account-label { color: var(--aurora-muted); }

.global-auth-actions .global-sign-in,
.global-auth-actions button,
.command-theme .global-auth-actions button,
.command-theme .global-auth-actions .global-sign-in,
.mocker-theme .global-auth-actions button,
.mocker-theme .global-auth-actions .global-sign-in {
  color: var(--aurora-text);
  border: 1px solid var(--aurora-line);
  border-radius: 9px;
  background: rgba(255, 255, 255, .035);
}

.global-auth-actions .global-sign-in:hover,
.global-auth-actions button:hover { border-color: rgba(34, 211, 238, .4); }

/* Keep product navigation centred on the viewport across every tool. */
.mocker-theme .topbar {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  gap: 16px;
}

.mocker-theme .topbar > .global-auth-actions { justify-self: end; }

.command-theme:not(.repo-detail-page) {
  --command-sidebar-width: 246px;
}

.command-theme:not(.repo-detail-page) .shell {
  grid-template-columns: var(--command-sidebar-width) minmax(0, 1fr);
}

.command-theme:not(.repo-detail-page) .topbar > .global-tool-nav {
  transform: translateX(calc(var(--command-sidebar-width) / -2));
}

/* Documentation Studio */
.documentation-theme main { height: calc(100% - 68px); }

.documentation-theme .brand { color: var(--aurora-text); }
.documentation-theme .brand-mark {
  color: #fff;
  border-radius: 10px;
  background: var(--aurora-gradient);
  box-shadow: 0 10px 28px rgba(99, 102, 241, .32);
}

.documentation-theme .welcome {
  isolation: isolate;
  padding: clamp(44px, 7vw, 110px);
}

.documentation-theme .welcome::before {
  width: 520px;
  height: 520px;
  left: -260px;
  bottom: -260px;
  border-color: rgba(139, 92, 246, .16);
  box-shadow: 0 0 0 85px rgba(139, 92, 246, .035), 0 0 0 170px rgba(34, 211, 238, .018);
}

.documentation-theme .welcome::after {
  content: "";
  position: absolute;
  z-index: -1;
  width: 380px;
  height: 380px;
  right: 8%;
  top: 14%;
  border-radius: 50%;
  background: rgba(34, 211, 238, .09);
  filter: blur(100px);
  pointer-events: none;
}

.documentation-theme .eyebrow,
.command-theme .eyebrow,
.mocker-theme .eyebrow,
.portal-page .eyebrow,
.auth-page .eyebrow {
  color: var(--aurora-cyan);
}

.documentation-theme h1 {
  color: var(--aurora-text);
  font-family: Inter, ui-sans-serif, system-ui, sans-serif;
  font-weight: 750;
  letter-spacing: -.065em;
}

.documentation-theme h1 em {
  color: transparent;
  background: var(--aurora-gradient);
  background-clip: text;
  -webkit-background-clip: text;
  font-style: normal;
}

.documentation-theme .intro { color: var(--aurora-muted); }

.documentation-theme .open-card {
  border: 1px solid var(--aurora-line-strong);
  border-radius: 22px;
  background: linear-gradient(145deg, rgba(21, 31, 54, .94), rgba(13, 20, 36, .94));
  box-shadow: var(--aurora-shadow), inset 0 1px rgba(255, 255, 255, .05);
}

.documentation-theme .path-row input,
.documentation-theme .download-name-field input,
.documentation-theme .drop-zone,
.documentation-theme .paste-markdown {
  color: var(--aurora-text);
  border-color: var(--aurora-line);
  background: rgba(255, 255, 255, .035);
}

.documentation-theme .path-row input { border-radius: 11px 0 0 11px; }
.documentation-theme .path-row .button { border-radius: 0 11px 11px 0; }
.documentation-theme .path-row input::placeholder { color: var(--aurora-faint); }
.documentation-theme .field-help,
.documentation-theme .drop-zone div span,
.documentation-theme .paste-markdown small { color: var(--aurora-muted); }

.documentation-theme .button-primary,
.documentation-theme .button-dark,
.documentation-theme .paste-icon {
  color: #fff;
  background: var(--aurora-gradient);
  box-shadow: 0 10px 24px rgba(99, 102, 241, .2);
}

.documentation-theme .button-outline {
  color: var(--aurora-text);
  border-color: var(--aurora-line-strong);
  background: rgba(255, 255, 255, .035);
}

.documentation-theme .drop-zone { border-style: dashed; }
.documentation-theme .drop-zone:hover,
.documentation-theme .drop-zone:focus-visible,
.documentation-theme .drop-zone.dragging,
.documentation-theme .paste-markdown:hover,
.documentation-theme .paste-markdown:focus-visible {
  border-color: rgba(34, 211, 238, .55);
  background: rgba(34, 211, 238, .055);
  box-shadow: inset 3px 0 var(--aurora-cyan);
}

.documentation-theme .upload-icon { color: var(--aurora-cyan); border-color: var(--aurora-cyan); }
.documentation-theme .paste-markdown b { color: var(--aurora-cyan); }

.documentation-theme .workspace { background: transparent; }
.documentation-theme .panes {
  overflow: hidden;
  border-color: var(--aurora-line-strong);
  border-radius: 18px;
  background: var(--aurora-panel-solid);
  box-shadow: var(--aurora-shadow);
}

.documentation-theme .pane-header {
  color: var(--aurora-muted);
  border-color: var(--aurora-line);
  background: #111a2d;
}

.documentation-theme #editor { color: #d8e4ff; background: #080d19; }
.documentation-theme #preview { background: #fff; }
.documentation-theme .divider { border-color: var(--aurora-line); background: #0d1424; }
.documentation-theme .divider span { background: var(--aurora-violet-bright); }
.documentation-theme .state-dot { background: var(--aurora-green); box-shadow: 0 0 0 3px rgba(52, 211, 153, .12); }
.documentation-theme .text-button { color: var(--aurora-cyan); }

/* Command Center and repository details */
.command-theme .sidebar {
  color: var(--aurora-text);
  border-color: var(--aurora-line);
  background: linear-gradient(180deg, rgba(15, 22, 39, .98), rgba(8, 13, 25, .99));
  box-shadow: 18px 0 50px rgba(0, 0, 0, .16);
}

.command-theme .brand { color: var(--aurora-text); }
.command-theme .brand em { color: var(--aurora-muted); }
.command-theme .brand-mark,
.command-theme .repo-hero-mark {
  color: #fff;
  border-radius: 10px;
  background: var(--aurora-gradient);
  box-shadow: 0 10px 26px rgba(99, 102, 241, .28);
}

.command-theme .nav-label,
.command-theme .side-repos header { color: var(--aurora-faint); }
.command-theme .nav-item { color: var(--aurora-muted); border-radius: 10px; }
.command-theme .nav-item:hover { color: var(--aurora-text); background: rgba(255, 255, 255, .045); }
.command-theme .nav-item.active {
  color: #fff;
  background: linear-gradient(90deg, rgba(139, 92, 246, .2), rgba(34, 211, 238, .05));
  box-shadow: inset 3px 0 var(--aurora-cyan);
}
.command-theme .nav-item b { color: #fff; background: var(--aurora-violet); }
.command-theme .side-repos,
.command-theme .profile { border-color: var(--aurora-line); }
.command-theme .side-repos a,
.command-theme #side-repo-list > a { color: var(--aurora-muted); border-radius: 8px; }
.command-theme .side-repos a:hover,
.command-theme #side-repo-list > a:hover { color: var(--aurora-text); background: rgba(255, 255, 255, .045); }
.command-theme .side-repos small,
.command-theme #side-repo-list > a small,
.command-theme .profile small { color: var(--aurora-faint); }
.command-theme .live { color: var(--aurora-green); }

.command-theme .content,
.command-theme .repo-detail-shell { position: relative; }

.command-theme .welcome h1,
.command-theme .repo-identity h1 {
  color: var(--aurora-text);
  font-family: Inter, ui-sans-serif, system-ui, sans-serif;
  font-weight: 750;
  letter-spacing: -.055em;
}

.command-theme .welcome > div > p:last-child,
.command-theme .repo-identity p,
.command-theme .repo-hero .eyebrow,
.command-theme .repo-facts small { color: var(--aurora-muted); }

.command-theme .metrics article,
.command-theme .card,
.command-theme .updated,
.command-theme .repo-metrics article,
.command-theme .period-card,
.command-theme .detail-card,
.command-theme .repo-hero {
  border: 1px solid var(--aurora-line);
  border-radius: var(--aurora-radius);
  background: linear-gradient(145deg, rgba(20, 30, 52, .88), rgba(13, 20, 36, .88));
  box-shadow: 0 16px 45px rgba(0, 0, 0, .17), inset 0 1px rgba(255, 255, 255, .035);
}

.command-theme .metrics article { overflow: hidden; }
.command-theme .metrics article::after,
.command-theme .repo-metrics article::after {
  content: "";
  position: absolute;
  width: 70px;
  height: 70px;
  right: -25px;
  bottom: -35px;
  border-radius: 50%;
  background: rgba(139, 92, 246, .08);
  filter: blur(5px);
}

.command-theme .card-head,
.command-theme .detail-card > header {
  border-color: var(--aurora-line);
  background: rgba(255, 255, 255, .018);
}

.command-theme .card-head h2,
.command-theme .detail-card h2 { color: var(--aurora-text); }

.command-theme .metric-icon,
.command-theme .repo-monogram,
.command-theme .quick-links a > span,
.command-theme .quick-links .repo-quick-link > span {
  color: var(--aurora-violet-bright);
  border: 1px solid rgba(167, 139, 250, .15);
  border-radius: 10px;
  background: rgba(139, 92, 246, .12);
}

.command-theme .metric-icon.green { color: var(--aurora-green); background: rgba(52, 211, 153, .1); }
.command-theme .metric-icon.blue { color: var(--aurora-cyan); background: rgba(34, 211, 238, .1); }
.command-theme .metric-icon.orange { color: var(--aurora-orange); background: rgba(251, 191, 36, .1); }

.command-theme .top-actions button,
.command-theme .task-form button,
.command-theme .custom-range-form button,
.command-theme .repo-range-form button,
.command-theme .open-local-repo {
  color: #fff;
  border: 0;
  border-radius: 10px;
  background: var(--aurora-gradient);
  box-shadow: 0 9px 22px rgba(99, 102, 241, .2);
}

.command-theme .range-picker select,
.command-theme .custom-range-form input,
.command-theme .task-form input,
.command-theme .task-form select,
.command-theme .repo-range-form select,
.command-theme .repo-range-form input {
  color: var(--aurora-text);
  border-color: var(--aurora-line);
  border-radius: 9px;
  background: rgba(255, 255, 255, .04);
}

.command-theme .task-form { border-color: var(--aurora-line); background: rgba(255, 255, 255, .018); }
.command-theme .repo-row,
.command-theme .activity-list article,
.command-theme .task-list article,
.command-theme .service-list article { border-color: var(--aurora-line); }
.command-theme .repo-row:hover,
.command-theme .activity-list article:hover,
.command-theme .task-list article:hover { background: rgba(255, 255, 255, .022); }
.command-theme .repo-primary span,
.command-theme .branch small,
.command-theme .changes small,
.command-theme .commit small,
.command-theme .changes span,
.command-theme .commit span,
.command-theme .activity-list span,
.command-theme .activity-list time { color: var(--aurora-muted); }
.command-theme .branch strong { color: #c3cee1; }
.command-theme .activity-list code,
.command-theme .repo-commit-list code { color: var(--aurora-cyan); background: rgba(34, 211, 238, .08); }
.command-theme .avatar { color: #ddd6fe; background: rgba(139, 92, 246, .16); }

.command-theme .note {
  color: var(--aurora-text);
  border-color: rgba(251, 191, 36, .2);
  border-radius: var(--aurora-radius);
  background: linear-gradient(145deg, rgba(66, 48, 20, .62), rgba(28, 27, 30, .88));
  box-shadow: 0 16px 45px rgba(0, 0, 0, .16);
}
.command-theme .note textarea { color: var(--aurora-text); }
.command-theme .quick-links a,
.command-theme .quick-links .repo-quick-link { color: var(--aurora-text); border-radius: 12px; background: rgba(255, 255, 255, .025); }
.command-theme .quick-links a:hover,
.command-theme .quick-links .repo-quick-link:hover { border-color: rgba(34, 211, 238, .38); box-shadow: 0 10px 25px rgba(0, 0, 0, .14); }
.command-theme .contributors div,
.command-theme .repo-contributors article div > span,
.command-theme .file-types article span { background: rgba(255, 255, 255, .06); }
.command-theme .contributors i,
.command-theme .repo-contributors i,
.command-theme .file-types i,
.command-theme .bar-wrap i { background: var(--aurora-gradient); }
.command-theme .repo-facts,
.command-theme .tunnel-card > header { border-color: var(--aurora-line); }
.command-theme .period-card { background: linear-gradient(120deg, rgba(139, 92, 246, .13), rgba(34, 211, 238, .05)); }
.command-theme .heat-cell.level-0 { background: rgba(255, 255, 255, .05); }
.command-theme .heat-cell.level-1 { background: rgba(139, 92, 246, .28); }
.command-theme .heat-cell.level-2 { background: rgba(139, 92, 246, .5); }
.command-theme .heat-cell.level-3 { background: rgba(99, 102, 241, .75); }
.command-theme .heat-cell.level-4 { background: var(--aurora-cyan); }

/* API Mocker */
.mocker-theme .topbar .brand { color: var(--aurora-text); }
.mocker-theme .topbar .brand span {
  color: #fff;
  border-radius: 10px;
  background: var(--aurora-gradient);
  box-shadow: 0 10px 26px rgba(99, 102, 241, .28);
}
.mocker-theme .brand em { color: var(--aurora-muted); }
.mocker-theme main { color: var(--aurora-text); }
.mocker-theme .intro h1 { color: var(--aurora-text); font-size: clamp(38px, 5vw, 62px); letter-spacing: -.055em; }
.mocker-theme .intro p,
.mocker-theme .ttl-notice { color: var(--aurora-muted); }
.mocker-theme .intro > code {
  color: var(--aurora-cyan);
  border-color: var(--aurora-line);
  border-radius: 12px;
  background: rgba(16, 24, 43, .76);
  box-shadow: 0 12px 35px rgba(0, 0, 0, .14);
}

.mocker-theme .panel,
.mocker-theme .request-inspector,
.mocker-theme .response-preview {
  color: var(--aurora-text);
  border-color: var(--aurora-line);
  border-radius: var(--aurora-radius);
  background: linear-gradient(145deg, rgba(20, 30, 52, .9), rgba(13, 20, 36, .92));
  box-shadow: 0 18px 50px rgba(0, 0, 0, .18), inset 0 1px rgba(255, 255, 255, .035);
}
.mocker-theme .panel-title,
.mocker-theme .history-toolbar,
.mocker-theme .mock-search-wrap,
.mocker-theme .collection-tools,
.mocker-theme th,
.mocker-theme td { border-color: var(--aurora-line); }

.mocker-theme .collection-tools,
.mocker-theme .mock-search-wrap,
.mocker-theme .history-toolbar {
  background: rgba(8, 13, 25, .62);
}
.mocker-theme .panel-title h2,
.mocker-theme .response-preview h2,
.mocker-theme h3 { color: var(--aurora-text); }
.mocker-theme label,
.mocker-theme .hint,
.mocker-theme .history-toolbar small,
.mocker-theme th,
.mocker-theme .empty,
.mocker-theme .inspector-empty { color: var(--aurora-muted); }
.mocker-theme input,
.mocker-theme select,
.mocker-theme textarea {
  color: var(--aurora-text);
  border-color: var(--aurora-line);
  background: rgba(5, 10, 20, .46);
}
.mocker-theme input::placeholder,
.mocker-theme textarea::placeholder { color: var(--aurora-faint); }
.mocker-theme input:focus,
.mocker-theme select:focus,
.mocker-theme textarea:focus { border-color: var(--aurora-violet); box-shadow: 0 0 0 3px rgba(139, 92, 246, .14); }
.mocker-theme .primary-button,
.mocker-theme .collection-save,
.mocker-theme #refresh-history,
.mocker-theme #replay-request {
  color: #fff;
  border-color: transparent;
  background: var(--aurora-gradient);
  box-shadow: 0 9px 22px rgba(99, 102, 241, .18);
}
.mocker-theme .collection-add,
.mocker-theme .link-button,
.mocker-theme .prettify-button { color: var(--aurora-cyan); }

.mocker-theme .search-field {
  position: relative;
}

.mocker-theme .search-field::before {
  content: "";
  position: absolute;
  z-index: 1;
  top: 50%;
  left: 14px;
  width: 8px;
  height: 8px;
  border: 2px solid var(--aurora-cyan);
  border-radius: 50%;
  transform: translateY(-62%);
  pointer-events: none;
}

.mocker-theme .search-field::after {
  content: "";
  position: absolute;
  z-index: 1;
  top: calc(50% + 5px);
  left: 24px;
  width: 6px;
  height: 2px;
  border-radius: 2px;
  background: var(--aurora-cyan);
  transform: rotate(45deg);
  transform-origin: left center;
  pointer-events: none;
}

.mocker-theme .search-field input[type="search"] {
  min-height: 42px;
  padding: 10px 38px 10px 42px;
  color: var(--aurora-text);
  border: 1px solid rgba(148, 163, 184, .27);
  border-radius: 11px;
  background-color: #18233a;
  background-image: none;
  box-shadow: inset 0 1px rgba(255, 255, 255, .035), 0 8px 20px rgba(0, 0, 0, .12);
  appearance: none;
  -webkit-appearance: none;
}

.mocker-theme .search-field input[type="search"]::placeholder {
  color: #8998b1;
  opacity: 1;
}

.mocker-theme .search-field input[type="search"]:hover {
  border-color: rgba(34, 211, 238, .36);
  background-color: #1b2842;
}

.mocker-theme .search-field input[type="search"]:focus {
  border-color: var(--aurora-cyan);
  background-color: #111b30;
  box-shadow: 0 0 0 3px rgba(34, 211, 238, .12), 0 10px 24px rgba(0, 0, 0, .16);
}

.mocker-theme .search-field input[type="search"]::-webkit-search-cancel-button {
  cursor: pointer;
  filter: invert(84%) sepia(18%) saturate(803%) hue-rotate(184deg);
}
.mocker-theme .count { color: #ddd6fe; background: rgba(139, 92, 246, .14); }
.mocker-theme .collection-item,
.mocker-theme .history-item,
.mocker-theme .actions button,
.mocker-theme .preview-header,
.mocker-theme .preview-request,
.mocker-theme .inspector-section,
.mocker-theme pre { border-color: var(--aurora-line); }
.mocker-theme .collection-form,
.mocker-theme .inspector-heading { background: rgba(8, 13, 25, .62); }
.mocker-theme .collection-item,
.mocker-theme .actions button { color: var(--aurora-text); background: rgba(255, 255, 255, .022); }
.mocker-theme .collection-item:hover,
.mocker-theme .history-item:hover,
.mocker-theme tbody tr:hover { background: rgba(255, 255, 255, .025); }
.mocker-theme .collection-item.active,
.mocker-theme .history-item.active { background: linear-gradient(90deg, rgba(139, 92, 246, .15), rgba(34, 211, 238, .04)); }
.mocker-theme pre,
.mocker-theme .preview-body { color: #d7e4ff; background: #080d19; }
.mocker-theme dialog::backdrop { background: rgba(2, 6, 16, .78); backdrop-filter: blur(6px); }
.mocker-theme .toast { color: #fff; background: #171f34; box-shadow: var(--aurora-shadow); }

/* Tunnels and authentication */
.portal-page .portal-brand,
.auth-page .auth-brand { color: var(--aurora-text); }
.portal-page .portal-brand > span,
.auth-page .auth-brand > span {
  color: #fff;
  border-radius: 10px;
  background: var(--aurora-gradient);
  box-shadow: 0 10px 26px rgba(99, 102, 241, .28);
}
.portal-page .portal-brand em,
.auth-page .auth-brand em { color: var(--aurora-cyan); }
.portal-page .account-avatar { color: #fff; background: var(--aurora-gradient); }
.portal-page .account-menu small { color: var(--aurora-muted); }
.portal-page .account-menu button { color: var(--aurora-muted); border-color: var(--aurora-line); background: rgba(255, 255, 255, .025); }
.portal-page .portal-hero h1 { color: var(--aurora-text); }
.portal-page .portal-hero h1 em {
  color: transparent;
  background: var(--aurora-gradient);
  background-clip: text;
  -webkit-background-clip: text;
}
.portal-page .portal-hero > div > p:last-child { color: var(--aurora-muted); }
.portal-page .create-tunnel-card {
  border: 1px solid var(--aurora-line-strong);
  border-radius: 20px;
  background: linear-gradient(145deg, #17223c, #0e1628);
  box-shadow: var(--aurora-shadow), inset 0 1px rgba(255, 255, 255, .05);
}
.portal-page .subdomain-input { overflow: hidden; border: 1px solid var(--aurora-line); border-radius: 11px; background: #0a1120; }
.portal-page .subdomain-input:focus-within { border-color: var(--aurora-cyan); box-shadow: 0 0 0 3px rgba(34, 211, 238, .12); }
.portal-page .subdomain-input input { color: var(--aurora-text); background: transparent; }
.portal-page .subdomain-input input { font-size: 13px; }
.portal-page .subdomain-input span { color: var(--aurora-muted); font-size: 12px; }
.portal-page .create-tunnel-card > button { color: #fff; border-radius: 10px; background: var(--aurora-gradient); }
.portal-page .create-tunnel-card > button:hover { box-shadow: 0 10px 28px rgba(99, 102, 241, .26); }
.portal-page .create-tunnel-card > small { color: var(--aurora-muted); }
.portal-page .tunnel-section,
.portal-page .guide-section,
.portal-page .inspector-guide-section { border-color: var(--aurora-line); }
.portal-page .section-heading h2,
.portal-page .guide-grid h3,
.portal-page .tunnel-card h3 { color: var(--aurora-text); }
.portal-page .tunnel-count,
.portal-page .reserved-label { color: var(--aurora-cyan); background: rgba(34, 211, 238, .09); }
.portal-page .guide-grid { gap: 14px; border: 0; background: transparent; }
.portal-page .guide-grid article,
.portal-page .tunnel-card,
.portal-page .empty-tunnels {
  color: var(--aurora-text);
  border: 1px solid var(--aurora-line);
  border-radius: var(--aurora-radius);
  background: linear-gradient(145deg, rgba(20, 30, 52, .88), rgba(13, 20, 36, .9));
  box-shadow: 0 16px 45px rgba(0, 0, 0, .16), inset 0 1px rgba(255, 255, 255, .035);
}
.portal-page .guide-grid article:hover { border-color: rgba(34, 211, 238, .32); box-shadow: 0 18px 48px rgba(0, 0, 0, .22), inset 0 3px var(--aurora-cyan); }
.portal-page .guide-grid article > span { color: var(--aurora-cyan); }
.portal-page .guide-grid p,
.portal-page .empty-tunnels,
.portal-page .field-label small,
.portal-page .port-note { color: var(--aurora-muted); }
.portal-page .guide-grid code,
.portal-page .command-block pre {
  color: #d7e4ff;
  border-color: var(--aurora-violet);
  border-radius: 10px;
  background: #080d19;
  font-size: 12px;
  line-height: 1.7;
}
.portal-page .guide-grid code b { color: var(--aurora-cyan); }
.portal-page .tunnel-card > header,
.portal-page .tunnel-card > footer { border-color: var(--aurora-line); }
.portal-page .status-dot { background: var(--aurora-green); border-color: rgba(52, 211, 153, .3); box-shadow: 0 0 0 4px rgba(52, 211, 153, .1); }
.portal-page .tunnel-card header a { color: var(--aurora-cyan); font-size: 12px; }
.portal-page .secret-field { overflow: hidden; border-color: var(--aurora-line); border-radius: 10px; }
.portal-page .secret-field input { color: var(--aurora-text); background: rgba(5, 10, 20, .46); font-size: 12px; }
.portal-page .port-note { font-size: 11px; }
.portal-page .launch-methods {
  margin-top: 22px;
  padding-top: 22px;
  border-top: 1px solid var(--aurora-line);
}
.portal-page .launch-methods > header {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 4px;
}
.portal-page .launch-methods > header h4 {
  margin: 4px 0 0;
  color: var(--aurora-text);
  font-size: 18px;
  letter-spacing: -.025em;
}
.portal-page .launch-methods > header > small {
  color: var(--aurora-muted);
  font-size: 10px;
  text-align: right;
}
.portal-page .launch-kicker {
  color: var(--aurora-cyan);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.portal-page .method-choice-note {
  margin-top: 14px;
  padding: 13px 15px;
  display: flex;
  align-items: center;
  gap: 12px;
  color: #c7d2fe;
  border: 1px solid rgba(34, 211, 238, .2);
  border-radius: 11px;
  background: linear-gradient(90deg, rgba(139, 92, 246, .12), rgba(34, 211, 238, .07));
}
.portal-page .method-choice-note strong {
  flex: 0 0 auto;
  color: var(--aurora-cyan);
  font-size: 11px;
}
.portal-page .method-choice-note span {
  color: var(--aurora-muted);
  font-size: 11px;
  line-height: 1.5;
}
.portal-page .launch-port-note {
  margin: 10px 0 0;
  color: var(--aurora-muted);
  font-size: 11px;
  line-height: 1.55;
}
.portal-page .launch-tabs {
  margin-top: 16px;
  padding: 4px;
  display: flex;
  gap: 4px;
  overflow-x: auto;
  border: 1px solid var(--aurora-line);
  border-radius: 12px;
  background: rgba(5, 10, 20, .46);
  scrollbar-width: none;
}
.portal-page .launch-tabs::-webkit-scrollbar { display: none; }
.portal-page .launch-tab {
  min-height: 38px;
  flex: 1 0 auto;
  padding: 8px 13px;
  color: var(--aurora-muted);
  border: 1px solid transparent;
  border-radius: 8px;
  background: transparent;
  font-size: 10px;
  font-weight: 750;
  white-space: nowrap;
}
.portal-page .launch-tab:hover {
  color: var(--aurora-text);
  background: rgba(255, 255, 255, .04);
}
.portal-page .launch-tab.active {
  color: #fff;
  border-color: rgba(167, 139, 250, .22);
  background: linear-gradient(135deg, rgba(139, 92, 246, .38), rgba(34, 211, 238, .2));
  box-shadow: 0 7px 18px rgba(0, 0, 0, .16);
}
.portal-page .launch-method {
  padding: 18px 0;
}
.portal-page .launch-method[hidden] { display: none; }
.portal-page .launch-method .field-label { margin-bottom: 6px; }
.portal-page .launch-method .command-block { padding-top: 0; }
.portal-page .launch-method .command-block pre { min-height: 58px; }
.portal-page .secret-field button,
.portal-page .command-copy,
.portal-page .rotate-button,
.portal-page .delete-button { border-color: var(--aurora-line); background: rgba(255, 255, 255, .035); }
.portal-page .secret-field button,
.portal-page .command-copy,
.portal-page .rotate-button { color: var(--aurora-cyan); }
.portal-page .delete-button { color: var(--aurora-red); }
.portal-page .security-note { border-color: var(--aurora-orange); border-radius: 12px; background: rgba(251, 191, 36, .065); }
.portal-page .security-note strong { color: var(--aurora-orange); }
.portal-page .security-note p { color: #c1b38e; }
.portal-page .inspector-overview {
  overflow: hidden;
  border-color: var(--aurora-line);
  border-radius: 16px;
  background: var(--aurora-panel-solid);
  box-shadow: var(--aurora-shadow);
}
.portal-page .inspector-intro,
.portal-page .inspector-features li { border-color: var(--aurora-line); }
.portal-page .inspector-mark { color: var(--aurora-cyan); background: rgba(34, 211, 238, .08); border-color: rgba(34, 211, 238, .25); }
.portal-page .inspector-intro h3,
.portal-page .inspector-features strong { color: var(--aurora-text); }
.portal-page .inspector-intro p,
.portal-page .inspector-features span { color: var(--aurora-muted); }
.portal-page .inspector-intro code { color: var(--aurora-cyan); background: var(--aurora-bg-soft); border-color: var(--aurora-violet); }
.portal-page .inspector-security-note { border-color: var(--aurora-cyan); border-radius: 12px; background: rgba(34, 211, 238, .055); }
.portal-page .inspector-security-note strong { color: var(--aurora-cyan); }
.portal-page .inspector-security-note p { color: var(--aurora-muted); }
.portal-page .inspector-security-note b { color: var(--aurora-text); }
.portal-page .portal-toast { border-radius: 11px; background: linear-gradient(135deg, #7c3aed, #0891b2); box-shadow: var(--aurora-shadow); }

.auth-page {
  background:
    radial-gradient(circle at 16% 18%, rgba(139, 92, 246, .22), transparent 30rem),
    radial-gradient(circle at 86% 84%, rgba(34, 211, 238, .13), transparent 28rem),
    var(--aurora-bg);
}
.auth-page .auth-card {
  color: var(--aurora-text);
  border: 1px solid var(--aurora-line-strong);
  border-radius: 22px;
  background: linear-gradient(145deg, rgba(21, 31, 54, .94), rgba(13, 20, 36, .96));
  box-shadow: var(--aurora-shadow), inset 0 1px rgba(255, 255, 255, .05);
}
.auth-page .auth-intro,
.auth-page .password-note,
.auth-page .auth-switch,
.auth-page .auth-foot { color: var(--aurora-muted); }
.auth-page .auth-form input { color: var(--aurora-text); border-color: var(--aurora-line); background: rgba(5, 10, 20, .48); }
.auth-page .auth-form input:focus { border-color: var(--aurora-cyan); box-shadow: 0 0 0 3px rgba(34, 211, 238, .12); }
.auth-page .auth-form > button,
.auth-page .auth-corner-link { color: #fff; border: 0; border-radius: 10px; background: var(--aurora-gradient); box-shadow: 0 10px 26px rgba(99, 102, 241, .22); }
.auth-page .auth-switch a { color: var(--aurora-cyan); }
.auth-page .auth-divider { color: var(--aurora-muted); }
.auth-page .auth-divider::before,
.auth-page .auth-divider::after { background: var(--aurora-line); }
.auth-page .google-sign-in { color: #e8edf8; border-color: var(--aurora-line-strong); background: rgba(255, 255, 255, .07); }
.auth-page .google-sign-in:hover { border-color: rgba(34, 211, 238, .42); background: rgba(255, 255, 255, .11); box-shadow: 0 8px 24px rgba(0, 0, 0, .18); }

/* Responsive behaviour shared across all products */
@media (max-width: 1100px) {
  .command-theme:not(.repo-detail-page) { --command-sidebar-width: 210px; }
  .command-theme .shell { grid-template-columns: var(--command-sidebar-width, 210px) minmax(0, 1fr); }
  .command-theme .layout { grid-template-columns: 1fr; }
  .command-theme .right-column { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; }
  .command-theme .right-column .note { min-height: 100%; }
  .mocker-theme main { padding-inline: 20px; }
}

@media (max-width: 900px) {
  .global-tool-nav { border-radius: 11px; }
  .global-tool-nav a { text-align: center; }
  .documentation-theme .welcome { grid-template-columns: 1fr; gap: 46px; align-content: start; overflow: visible; }
  .documentation-theme h1 { font-size: clamp(48px, 12vw, 78px); }
  .command-theme .shell { display: block; }
  .command-theme .sidebar {
    position: static;
    width: 100%;
    height: auto;
    min-height: 0;
    padding: 15px 18px;
    display: block;
    border-right: 0;
    border-bottom: 1px solid var(--aurora-line);
  }
  .command-theme .sidebar .brand { padding: 0 0 13px; }
  .command-theme .sidebar nav { display: flex; flex-direction: row; gap: 6px; overflow-x: auto; scrollbar-width: none; }
  .command-theme .sidebar nav::-webkit-scrollbar { display: none; }
  .command-theme .nav-label,
  .command-theme .side-repos,
  .command-theme .profile { display: none; }
  .command-theme .nav-item { min-height: 38px; flex: 0 0 auto; padding: 0 11px; }
  .command-theme .nav-item.active { box-shadow: inset 0 -2px var(--aurora-cyan); }
  .command-theme .topbar { position: static; }
  .command-theme:not(.repo-detail-page) .topbar > .global-tool-nav { transform: none; }
  .mocker-theme .topbar {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas:
      "brand auth"
      "nav nav";
  }
  .command-theme .repo-metrics { grid-template-columns: repeat(3, 1fr); }
  .mocker-theme .mocker-workspace { grid-template-columns: 1fr; }
  .mocker-theme .collections-panel { position: static; max-height: none; }
  .portal-page .portal-hero { gap: 32px; }
}

@media (max-width: 720px) {
  .command-theme .content { padding: 24px 15px 45px; }
  .command-theme .welcome { align-items: flex-start; gap: 18px; flex-direction: column; }
  .command-theme .updated { width: 100%; }
  .command-theme .metrics { grid-template-columns: repeat(2, 1fr); }
  .command-theme .right-column { display: flex; }
  .command-theme .repo-metrics { grid-template-columns: repeat(2, 1fr); }
  .command-theme .period-card { align-items: stretch; gap: 14px; flex-direction: column; }
  .command-theme .repo-range-form { width: 100%; flex-wrap: wrap; }
  .command-theme .repo-detail-grid { grid-template-columns: 1fr; }
  .mocker-theme .mock-builder-layout,
  .mocker-theme .history-layout { grid-template-columns: 1fr; }
  .mocker-theme .request-inspector { min-height: 260px; }
  .portal-page .portal-main { width: min(100% - 28px, 1180px); padding-top: 40px; }
  .portal-page .portal-hero { padding: 8px 0 50px; }
}

@media (max-width: 560px) {
  .global-tool-nav { width: 100%; justify-content: flex-start; }
  .global-tool-nav a { min-width: max-content; padding-inline: 9px; font-size: 9px; }
  .documentation-theme .topbar { padding-inline: 13px; }
  .documentation-theme .welcome { padding: 34px 15px 46px; }
  .documentation-theme h1 { font-size: clamp(44px, 14vw, 62px); }
  .documentation-theme .intro { font-size: 15px; }
  .documentation-theme .open-card { padding: 20px; border-radius: 16px; }
  .documentation-theme .path-row input { border-radius: 10px 10px 0 0; }
  .documentation-theme .path-row .button { border-radius: 0 0 10px 10px; }
  .documentation-theme .panes { border-radius: 13px; }
  .command-theme .sidebar { padding-inline: 12px; }
  .command-theme .metrics,
  .command-theme .repo-metrics { grid-template-columns: 1fr; }
  .command-theme .metrics article { min-height: 120px; }
  .command-theme .top-actions .sync-state { display: none; }
  .command-theme .repo-row { grid-template-columns: 36px minmax(0, 1fr) auto; gap: 10px; }
  .command-theme .repo-row .branch,
  .command-theme .repo-row .commit,
  .command-theme .repo-row .external { display: none; }
  .command-theme .repo-row .changes { text-align: right; }
  .command-theme .repo-status { grid-column: 2 / -1; }
  .command-theme .activity-list article { grid-template-columns: 29px minmax(0, 1fr); }
  .command-theme .activity-list code,
  .command-theme .activity-list time { display: none; }
  .command-theme .task-form { grid-template-columns: 1fr; }
  .command-theme .repo-hero { padding: 22px; }
  .command-theme .repo-identity { align-items: flex-start; }
  .command-theme .repo-hero-actions,
  .command-theme .repo-facts { grid-template-columns: 1fr; }
  .mocker-theme main { padding: 28px 12px 45px; }
  .mocker-theme .intro h1 { font-size: 40px; }
  .mocker-theme .panel { border-radius: 14px; }
  .mocker-theme .row { display: block; }
  .portal-page .portal-hero h1 { font-size: clamp(40px, 12vw, 54px); }
  .portal-page .create-tunnel-card { padding: 18px; border-radius: 16px; box-shadow: var(--aurora-shadow); }
  .portal-page .guide-grid article,
  .portal-page .tunnel-card { border-radius: 14px; }
  .portal-page .launch-methods > header { align-items: flex-start; flex-direction: column; gap: 7px; }
  .portal-page .launch-methods > header > small { text-align: left; }
  .portal-page .method-choice-note { align-items: flex-start; flex-direction: column; gap: 4px; }
  .portal-page .launch-tab { flex: 0 0 auto; }
  .auth-page .auth-card { padding: 28px 22px; border-radius: 17px; }
  .auth-page .auth-corner-link { top: 15px; right: 15px; }
}

@media (prefers-reduced-motion: reduce) {
  .documentation-theme *,
  .command-theme *,
  .mocker-theme *,
  .portal-page *,
  .auth-page * {
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
  }
}

/* Site-wide color mode control */
.theme-toggle,
.global-auth-actions .theme-toggle,
.account-menu .theme-toggle {
  min-width: 78px;
  min-height: 32px;
  padding: 0 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  color: var(--aurora-text);
  border: 1px solid var(--aurora-line);
  border-radius: 9px;
  background: rgba(255, 255, 255, .035);
  font-size: 10px;
  font-weight: 750;
  line-height: 1;
  white-space: nowrap;
  cursor: pointer;
}

.theme-toggle:hover,
.global-auth-actions .theme-toggle:hover,
.account-menu .theme-toggle:hover {
  color: #fff;
  border-color: rgba(34, 211, 238, .42);
  background: rgba(34, 211, 238, .08);
}

.theme-toggle-icon {
  color: var(--aurora-cyan);
  font-size: 15px;
  line-height: 1;
}

.auth-page > .theme-toggle {
  position: fixed;
  top: 22px;
  left: 24px;
  z-index: 10;
}

html[data-theme="light"] {
  --aurora-bg: #f4f7fb;
  --aurora-bg-soft: #edf2f8;
  --aurora-panel: rgba(255, 255, 255, .9);
  --aurora-panel-solid: #ffffff;
  --aurora-panel-raised: #f8fafc;
  --aurora-line: rgba(51, 65, 85, .14);
  --aurora-line-strong: rgba(51, 65, 85, .23);
  --aurora-text: #142033;
  --aurora-muted: #5d6b81;
  --aurora-faint: #8290a5;
  --aurora-violet: #7451db;
  --aurora-violet-bright: #6d4bd0;
  --aurora-cyan: #087f9a;
  --aurora-green: #16855f;
  --aurora-orange: #b77909;
  --aurora-red: #d3455b;
  --aurora-shadow: 0 20px 55px rgba(45, 59, 82, .11);
}

html[data-theme="light"] .documentation-theme,
html[data-theme="light"] .command-theme,
html[data-theme="light"] .mocker-theme,
html[data-theme="light"] .portal-page,
html[data-theme="light"] .auth-page {
  color-scheme: light;
  background:
    radial-gradient(circle at 8% 0%, rgba(116, 81, 219, .1), transparent 28rem),
    radial-gradient(circle at 95% 8%, rgba(8, 127, 154, .08), transparent 28rem),
    var(--aurora-bg);
}

html[data-theme="light"] .documentation-theme .topbar,
html[data-theme="light"] .command-theme .topbar,
html[data-theme="light"] .command-theme .repo-topbar,
html[data-theme="light"] .mocker-theme .topbar,
html[data-theme="light"] .portal-page .portal-header {
  color: var(--aurora-text);
  background: rgba(255, 255, 255, .82);
  border-color: var(--aurora-line);
  box-shadow: 0 1px 0 rgba(51, 65, 85, .04);
}

html[data-theme="light"] .global-tool-nav {
  --header-ink: var(--aurora-text);
  --header-muted: var(--aurora-muted);
  --header-surface: rgba(51, 65, 85, .055);
  --header-active-ink: #26334a;
  --header-line: var(--aurora-line);
  background: rgba(241, 245, 249, .82);
}

html[data-theme="light"] .global-tool-nav a.active {
  color: #3f3182;
  border-color: rgba(116, 81, 219, .18);
  background: linear-gradient(135deg, rgba(116, 81, 219, .13), rgba(8, 127, 154, .08));
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .55), 0 5px 16px rgba(51, 65, 85, .07);
}

html[data-theme="light"] .global-auth-actions,
html[data-theme="light"] .portal-page .account-menu {
  --header-ink: var(--aurora-text);
  --header-muted: var(--aurora-muted);
  --header-surface: rgba(51, 65, 85, .055);
  --header-line: var(--aurora-line);
}

html[data-theme="light"] .theme-toggle,
html[data-theme="light"] .global-auth-actions .theme-toggle,
html[data-theme="light"] .account-menu .theme-toggle,
html[data-theme="light"] .global-auth-actions .global-sign-in,
html[data-theme="light"] .global-auth-actions button {
  color: var(--aurora-text);
  border-color: var(--aurora-line);
  background: rgba(255, 255, 255, .78);
}

html[data-theme="light"] .theme-toggle:hover,
html[data-theme="light"] .global-auth-actions .theme-toggle:hover,
html[data-theme="light"] .account-menu .theme-toggle:hover {
  color: #3f3182;
  border-color: rgba(116, 81, 219, .34);
  background: rgba(116, 81, 219, .07);
}

/* Documentation — light */
html[data-theme="light"] .documentation-theme .welcome::before { border-color: rgba(116, 81, 219, .13); }
html[data-theme="light"] .documentation-theme .welcome::after { background: rgba(8, 127, 154, .08); }
html[data-theme="light"] .documentation-theme .open-card,
html[data-theme="light"] .documentation-theme .panes {
  border-color: var(--aurora-line-strong);
  background: rgba(255, 255, 255, .92);
  box-shadow: var(--aurora-shadow), inset 0 1px rgba(255, 255, 255, .8);
}

html[data-theme="light"] .documentation-theme .path-row input,
html[data-theme="light"] .documentation-theme .download-name-field input,
html[data-theme="light"] .documentation-theme .drop-zone,
html[data-theme="light"] .documentation-theme .paste-markdown {
  color: var(--aurora-text);
  border-color: var(--aurora-line-strong);
  background: #f8fafc;
}

html[data-theme="light"] .documentation-theme .pane-header {
  color: var(--aurora-muted);
  background: #edf2f7;
}

html[data-theme="light"] .documentation-theme #editor { color: #23314a; background: #f8fafc; }
html[data-theme="light"] .documentation-theme .divider { background: #e8edf5; }

/* Command Center — light */
html[data-theme="light"] .command-theme .sidebar {
  color: var(--aurora-text);
  border-color: var(--aurora-line);
  background: linear-gradient(180deg, rgba(255, 255, 255, .98), rgba(240, 244, 250, .99));
  box-shadow: 18px 0 45px rgba(51, 65, 85, .07);
}

html[data-theme="light"] .command-theme .nav-item:hover,
html[data-theme="light"] .command-theme .side-repos a:hover,
html[data-theme="light"] .command-theme #side-repo-list > a:hover {
  color: var(--aurora-text);
  background: rgba(51, 65, 85, .055);
}

html[data-theme="light"] .command-theme .nav-item.active {
  color: #3f3182;
  background: linear-gradient(90deg, rgba(116, 81, 219, .12), rgba(8, 127, 154, .05));
}

html[data-theme="light"] .command-theme .metrics article,
html[data-theme="light"] .command-theme .card,
html[data-theme="light"] .command-theme .updated,
html[data-theme="light"] .command-theme .repo-metrics article,
html[data-theme="light"] .command-theme .period-card,
html[data-theme="light"] .command-theme .detail-card,
html[data-theme="light"] .command-theme .repo-hero {
  border-color: var(--aurora-line);
  background: rgba(255, 255, 255, .92);
  box-shadow: var(--aurora-shadow), inset 0 1px rgba(255, 255, 255, .8);
}

html[data-theme="light"] .command-theme .card-head,
html[data-theme="light"] .command-theme .detail-card > header,
html[data-theme="light"] .command-theme .task-form {
  background: rgba(244, 247, 251, .72);
}

html[data-theme="light"] .command-theme .repo-row:hover,
html[data-theme="light"] .command-theme .activity-list article:hover,
html[data-theme="light"] .command-theme .task-list article:hover { background: rgba(51, 65, 85, .025); }

html[data-theme="light"] .command-theme .range-picker select,
html[data-theme="light"] .command-theme .custom-range-form input,
html[data-theme="light"] .command-theme .task-form input,
html[data-theme="light"] .command-theme .task-form select,
html[data-theme="light"] .command-theme .repo-range-form select,
html[data-theme="light"] .command-theme .repo-range-form input,
html[data-theme="light"] .command-theme .quick-links a,
html[data-theme="light"] .command-theme .quick-links .repo-quick-link {
  color: var(--aurora-text);
  background: #f8fafc;
}

html[data-theme="light"] .command-theme .note {
  color: #3e3420;
  border-color: rgba(183, 121, 9, .22);
  background: linear-gradient(145deg, #fff8de, #fffdf5);
}
html[data-theme="light"] .command-theme .note textarea { color: #3e3420; }
html[data-theme="light"] .command-theme .period-card { background: linear-gradient(120deg, rgba(116, 81, 219, .1), rgba(8, 127, 154, .04)); }

/* API Mocker — light */
html[data-theme="light"] .mocker-theme .intro > code,
html[data-theme="light"] .mocker-theme .panel,
html[data-theme="light"] .mocker-theme .request-inspector,
html[data-theme="light"] .mocker-theme .response-preview {
  color: var(--aurora-text);
  border-color: var(--aurora-line);
  background: rgba(255, 255, 255, .94);
  box-shadow: var(--aurora-shadow), inset 0 1px rgba(255, 255, 255, .8);
}

html[data-theme="light"] .mocker-theme .collection-tools,
html[data-theme="light"] .mocker-theme .mock-search-wrap,
html[data-theme="light"] .mocker-theme .history-toolbar,
html[data-theme="light"] .mocker-theme .collection-form,
html[data-theme="light"] .mocker-theme .inspector-heading {
  background: #f4f7fb;
}

html[data-theme="light"] .mocker-theme input,
html[data-theme="light"] .mocker-theme select,
html[data-theme="light"] .mocker-theme textarea,
html[data-theme="light"] .mocker-theme .search-field input[type="search"] {
  color: var(--aurora-text);
  border-color: var(--aurora-line-strong);
  background-color: #ffffff;
}

html[data-theme="light"] .mocker-theme .search-field input[type="search"]:hover { background-color: #f8fafc; }
html[data-theme="light"] .mocker-theme .search-field input[type="search"]:focus { background-color: #ffffff; }
html[data-theme="light"] .mocker-theme .search-field input[type="search"]::placeholder { color: #758399; }

html[data-theme="light"] .mocker-theme .collection-item,
html[data-theme="light"] .mocker-theme .actions button { color: var(--aurora-text); background: #fff; }
html[data-theme="light"] .mocker-theme .collection-item:hover,
html[data-theme="light"] .mocker-theme .history-item:hover,
html[data-theme="light"] .mocker-theme tbody tr:hover { background: #f5f7fb; }
html[data-theme="light"] .mocker-theme .collection-item.active,
html[data-theme="light"] .mocker-theme .history-item.active { background: linear-gradient(90deg, rgba(116, 81, 219, .1), rgba(8, 127, 154, .035)); }
html[data-theme="light"] .mocker-theme pre,
html[data-theme="light"] .mocker-theme .preview-body { color: #24324a; background: #f3f6fa; }

/* Tunnels — light */
html[data-theme="light"] .portal-page .account-menu button { color: var(--aurora-muted); background: rgba(255, 255, 255, .75); }
html[data-theme="light"] .portal-page .create-tunnel-card,
html[data-theme="light"] .portal-page .guide-grid article,
html[data-theme="light"] .portal-page .tunnel-card,
html[data-theme="light"] .portal-page .empty-tunnels {
  color: var(--aurora-text);
  border-color: var(--aurora-line);
  background: rgba(255, 255, 255, .94);
  box-shadow: var(--aurora-shadow), inset 0 1px rgba(255, 255, 255, .8);
}

html[data-theme="light"] .portal-page .create-tunnel-card > label { color: var(--aurora-text); }
html[data-theme="light"] .portal-page .subdomain-input,
html[data-theme="light"] .portal-page .secret-field input,
html[data-theme="light"] .portal-page .launch-tabs { background: #f4f7fb; }
html[data-theme="light"] .portal-page .subdomain-input input,
html[data-theme="light"] .portal-page .secret-field input { color: var(--aurora-text); }
html[data-theme="light"] .portal-page .guide-grid code,
html[data-theme="light"] .portal-page .command-block pre { color: #24324a; background: #eef3f8; }
html[data-theme="light"] .portal-page .secret-field button,
html[data-theme="light"] .portal-page .command-copy,
html[data-theme="light"] .portal-page .rotate-button,
html[data-theme="light"] .portal-page .delete-button { background: #fff; }
html[data-theme="light"] .portal-page .method-choice-note { color: #3f3182; background: linear-gradient(90deg, rgba(116, 81, 219, .09), rgba(8, 127, 154, .055)); }
html[data-theme="light"] .portal-page .launch-tab:hover { color: var(--aurora-text); background: rgba(51, 65, 85, .05); }
html[data-theme="light"] .portal-page .launch-tab.active { color: #3f3182; border-color: rgba(116, 81, 219, .2); background: linear-gradient(135deg, rgba(116, 81, 219, .14), rgba(8, 127, 154, .09)); }
html[data-theme="light"] .portal-page .security-note { background: #fff8e6; }

/* Authentication — light */
html[data-theme="light"] .auth-page {
  background:
    radial-gradient(circle at 16% 18%, rgba(116, 81, 219, .12), transparent 30rem),
    radial-gradient(circle at 86% 84%, rgba(8, 127, 154, .09), transparent 28rem),
    var(--aurora-bg);
}
html[data-theme="light"] .auth-page .auth-card {
  color: var(--aurora-text);
  border-color: var(--aurora-line-strong);
  background: rgba(255, 255, 255, .94);
  box-shadow: var(--aurora-shadow), inset 0 1px rgba(255, 255, 255, .8);
}
html[data-theme="light"] .auth-page .auth-form input { color: var(--aurora-text); border-color: var(--aurora-line-strong); background: #f8fafc; }
html[data-theme="light"] .auth-page .google-sign-in { color: #1f1f1f; border-color: #747775; background: #fff; }
html[data-theme="light"] .auth-page .google-sign-in:hover { background: #f8faff; box-shadow: 0 1px 3px rgba(60, 64, 67, .3); }

/* Tools homepage — light */
html[data-theme="light"] .tools-home {
  color-scheme: light;
  background:
    radial-gradient(circle at 8% 0%, rgba(116, 81, 219, .1), transparent 30rem),
    radial-gradient(circle at 96% 10%, rgba(8, 127, 154, .08), transparent 30rem),
    var(--aurora-bg);
}
html[data-theme="light"] .tools-header {
  border-color: var(--aurora-line);
  background: rgba(255, 255, 255, .82);
  box-shadow: 0 1px 0 rgba(51, 65, 85, .04);
}
html[data-theme="light"] .tool-summary,
html[data-theme="light"] .tool-card {
  color: var(--aurora-text);
  border-color: var(--aurora-line);
  background: rgba(255, 255, 255, .92);
  box-shadow: var(--aurora-shadow), inset 0 1px rgba(255, 255, 255, .8);
}
html[data-theme="light"] .tool-card:hover,
html[data-theme="light"] .tool-card:focus-visible {
  border-color: var(--tool-accent);
  box-shadow: 0 24px 55px rgba(45, 59, 82, .14), inset 0 1px rgba(255, 255, 255, .85);
}
html[data-theme="light"] .tool-card li { background: #f7f9fc; }

@media (max-width: 900px) {
  .tools-header {
    min-height: 0;
    padding: 10px 18px;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas:
      "brand auth"
      "nav nav";
    gap: 8px;
  }
  .tools-header .tools-brand { grid-area: brand; }
  .tools-header .global-auth-actions { grid-area: auth; }
  .tools-header .global-tool-nav { grid-area: nav; width: 100%; justify-self: stretch; }
  .tools-hero { min-height: 420px; grid-template-columns: 1fr; gap: 35px; padding: 65px 0 55px; }
  .tool-summary { width: min(100%, 270px); }
}

@media (max-width: 700px) {
  .tools-main { width: min(100% - 28px, 1280px); }
  .tools-hero { padding-top: 50px; }
  .tools-hero h1 { font-size: clamp(47px, 13vw, 70px); }
  .tools-hero > div > p:last-child { font-size: 15px; }
  .tools-directory > header { align-items: flex-start; flex-direction: column; gap: 12px; }
  .tools-directory > header > p { text-align: left; }
  .tool-grid { grid-template-columns: 1fr; }
  .tool-card { min-height: 310px; }
}

@media (max-width: 440px) {
  .tools-brand strong { display: none; }
  .tools-header { padding-inline: 12px; }
  .tools-hero h1 { font-size: 44px; }
  .tool-summary { width: 100%; }
  .tool-card { min-height: 0; padding: 21px; border-radius: 16px; }
  .tool-card ul { margin-bottom: 28px; }
  .tools-footer { align-items: flex-start; flex-direction: column; gap: 5px; }
}

@media (max-width: 620px) {
  .theme-toggle,
  .global-auth-actions .theme-toggle,
  .account-menu .theme-toggle {
    min-width: 32px;
    width: 32px;
    padding: 0;
  }
  .theme-toggle-label { display: none; }
  .auth-page > .theme-toggle { top: 15px; left: 15px; }
}

/* Keep the shared brand authoritative over legacy product-specific rules. */
.documentation-theme .product-brand .product-brand-mark,
.command-theme .product-brand .product-brand-mark,
.mocker-theme .product-brand .product-brand-mark,
.portal-page .product-brand .product-brand-mark,
.auth-page .product-brand .product-brand-mark {
  width: 34px;
  height: 34px;
  color: #fff;
  border-radius: 10px;
  background: var(--aurora-gradient);
  box-shadow: 0 10px 26px rgba(99, 102, 241, .28);
  font: 850 9px/1 Inter, ui-sans-serif, sans-serif;
  letter-spacing: .06em;
}

.documentation-theme .product-brand strong,
.command-theme .product-brand strong,
.mocker-theme .product-brand strong,
.portal-page .product-brand strong,
.auth-page .product-brand strong { color: var(--aurora-text); }

.documentation-theme .product-brand strong em,
.command-theme .product-brand strong em,
.mocker-theme .product-brand strong em,
.portal-page .product-brand strong em,
.auth-page .product-brand strong em { color: var(--aurora-cyan); }
