:root {
  --blue: #0878e6;
  --blue-dark: #004f9e;
  --blue-bright: #00a3ff;
  --blue-soft: #e7f4ff;
  --blue-pale: #f5fbff;
  --ink: #102a43;
  --muted: #4c6d8c;
  --line: #9dcef4;
  --line-soft: #d6ebfb;
  --highlight: #dff2ff;
  --highlight-strong: #bfe5ff;
  --text: 12px;
  --small: 12px;
}

html { font-size: 12px; }
body {
  font-size: 12px;
  line-height: 1.62;
  background:
    linear-gradient(180deg, #ffffff 0%, #fbfdff 45%, #f4faff 100%);
}

body,
button,
input,
textarea,
select,
.nav a,
.brand,
.identity-code,
.formal-name,
.role,
.institution-block,
.profile-tagline,
.profile-links,
.lineage-trigger,
.content,
.content h1,
.content h2,
.content h3,
.content h4,
.kicker,
.hero-overline,
.metric-label,
.eyebrow,
.stage-label,
.modal-kicker,
.footer-code,
.you-marker,
.tag,
.paper-tags span,
.badge,
.pub-no,
.pub-title,
.pub-meta,
.pub-links,
table,
th,
td,
.ui-button,
.modal-note,
.modal-panel,
.lineage-stage,
.lineage-stage article,
.lineage-stage article span {
  font-size: 12px;
}

.masthead {
  border-bottom-color: var(--line);
  box-shadow: 0 5px 22px rgba(8, 120, 230, .07);
}

.brand {
  color: var(--blue-dark);
  letter-spacing: .04em;
}
.brand-prompt,
.brand-cursor { color: var(--blue-bright); }

.nav a {
  color: #356487;
  font-weight: 800;
  letter-spacing: .06em;
}
.nav a:hover,
.nav a.active {
  color: #fff;
  background: var(--blue);
  border-bottom-color: var(--blue-dark);
  padding-left: 8px;
  padding-right: 8px;
  text-decoration: none;
}

.portrait-frame {
  border-color: var(--line);
  background: linear-gradient(135deg, #fff, var(--blue-soft));
  box-shadow: 0 8px 24px rgba(8, 120, 230, .10);
}
.avatar-photo { filter: saturate(.96) contrast(1.03); }

.identity-code,
.hero-overline,
.kicker,
.metric-label,
.eyebrow,
.modal-kicker,
.footer-code,
.you-marker {
  color: var(--blue);
  font-weight: 800;
}

.identity-block h2,
.content h1,
.content h2,
.content h3,
.content h4 {
  color: var(--blue-dark);
}

.institution-block {
  border-color: var(--line);
  background: linear-gradient(90deg, var(--blue-pale), #fff);
  padding: 10px;
}
.institution-block strong {
  color: var(--blue-dark);
  background: linear-gradient(transparent 62%, var(--highlight-strong) 62%);
  display: inline;
}

.profile-links a {
  border-color: var(--line-soft);
  background: #fff;
}
.profile-links a:hover {
  background: var(--blue-soft);
  border-color: var(--blue-bright);
  transform: translateX(2px);
}

.lineage-trigger {
  border-color: var(--blue-bright);
  background: linear-gradient(90deg, #eaf6ff, #f8fcff);
  box-shadow: inset 3px 0 0 var(--blue-bright);
}
.lineage-trigger:hover,
.lineage-trigger:focus-visible {
  background: linear-gradient(90deg, #d9efff, #eff9ff);
  border-color: var(--blue-dark);
}

.content h1 {
  border-left-color: var(--blue-bright);
  background: linear-gradient(90deg, var(--blue-soft), #fff 72%);
}
.content h2 {
  border-bottom-color: var(--line);
}

.hero-block {
  border-color: var(--line);
  background: linear-gradient(100deg, #fff 0%, #f5fbff 78%, #eaf6ff 100%);
  padding: 14px 12px;
}
.hero-lead strong,
.signature-main,
.metric-strip strong,
.pub-title,
.current-position strong,
.influence-highlight strong,
.expertise-focus strong {
  color: var(--blue-dark);
  background: linear-gradient(transparent 62%, var(--highlight-strong) 62%);
}

.metric-strip {
  border-color: var(--line);
  box-shadow: 0 7px 18px rgba(8, 120, 230, .06);
}
.metric-strip > div:nth-child(1),
.metric-strip > div:nth-child(4) {
  background: var(--blue-pale);
}
.metric-label {
  color: var(--blue);
}

.card {
  border-color: var(--line-soft);
  border-top: 2px solid var(--line);
  transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease, background .16s ease;
}
.card.premium:hover,
.card:hover {
  transform: translateY(-2px);
  border-color: var(--blue-bright);
  border-top-color: var(--blue);
  background: var(--blue-pale);
  box-shadow: 0 8px 20px rgba(8, 120, 230, .08);
}

.signature-box,
.notice,
.influence-highlight,
.expertise-focus {
  border: 1px solid var(--line);
  border-left: 4px solid var(--blue-bright);
  background: linear-gradient(90deg, var(--blue-pale), #fff);
  padding: 11px 12px;
  margin: 14px 0;
}

.influence-highlight {
  box-shadow: 0 7px 18px rgba(8, 120, 230, .06);
}
.influence-highlight .influence-list {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin-top: 8px;
}
.influence-highlight .influence-list span {
  display: inline-block;
  padding: 4px 7px;
  border: 1px solid var(--line);
  background: #fff;
  color: var(--blue-dark);
  font-weight: 800;
}

.expertise-focus ul {
  margin-bottom: 0;
}
.method-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 7px;
  padding: 5px 8px;
  border: 1px solid var(--blue-bright);
  background: var(--blue);
  color: #fff;
  font-weight: 800;
  text-decoration: none;
}
.method-link:hover {
  background: var(--blue-dark);
  color: #fff;
  text-decoration: none;
}

.flowline {
  border-color: var(--line);
  background: linear-gradient(90deg, #f7fcff, var(--blue-soft));
}
.flowline span {
  border-color: var(--line);
  color: var(--blue-dark);
  font-weight: 800;
}
.flowline b { color: var(--blue-bright); }

.tag,
.paper-tags span {
  border-color: var(--line);
  background: var(--blue-pale);
}
.badge.plan {
  background: var(--blue);
  border-color: var(--blue);
}

.ui-button {
  font-weight: 800;
  border-color: var(--blue-bright);
  background: #fff;
}
.action-row .ui-button:first-child {
  background: var(--blue);
  color: #fff;
}
.ui-button:hover {
  background: var(--blue-dark);
  color: #fff;
  text-decoration: none;
}

.modal-backdrop {
  background: rgba(3, 45, 86, .66);
  backdrop-filter: blur(5px);
}
.modal-panel {
  border-color: var(--blue-bright);
  box-shadow: 0 30px 80px rgba(0, 66, 130, .28);
}
.modal-head {
  background: linear-gradient(90deg, var(--blue-dark), var(--blue));
  color: #fff;
}
.modal-head h2,
.modal-kicker { color: #fff; }
.modal-close {
  border-color: rgba(255,255,255,.7);
  color: #fff;
  background: rgba(255,255,255,.08);
}
.modal-note {
  border-left: 4px solid var(--blue-bright);
  background: var(--blue-pale);
}
.stage-label {
  display: inline-block;
  padding: 4px 7px;
  background: var(--blue);
  color: #fff;
  border: 1px solid var(--blue);
}
.lineage-stage {
  border-color: var(--line);
}
.lineage-stage article {
  border-color: var(--line-soft);
  background: #fff;
}
.lineage-stage article:hover {
  border-color: var(--blue-bright);
  background: var(--blue-pale);
}
.influence-stage {
  border-left: 4px solid var(--blue-bright);
  background: linear-gradient(90deg, #f4fbff, #fff);
}
.current-stage {
  border: 2px solid var(--blue-bright);
  background: linear-gradient(135deg, #f2faff, #fff);
}
.you-marker {
  display: inline-block;
  padding: 4px 7px;
  background: var(--blue);
  color: #fff;
}
.flow-arrow {
  color: var(--blue-bright);
  font-weight: 900;
}

@media (max-width: 760px) {
  html, body { font-size: 12px; }
  .nav a { font-size: 12px; }
  .page-shell { gap: 28px; }
}

@media (prefers-reduced-motion: reduce) {
  .card,
  .profile-links a { transition: none; }
}