/* Supporting surfaces: entry, account, onboarding and administration. */
body.vari-landing {
  overflow-x: hidden;
  background: var(--vi-canvas) !important;
}
.vari-landing .ambient, .vari-landing .hero-grid, .vari-landing .orbit-field,
.vari-landing .scroll-cue, .vari-landing .auth-scene { display: none !important; }
.vari-landing .landing-header,
.vari-landing .landing-nav { background: var(--vi-paper) !important; border-color: var(--vi-line) !important; }
.vari-landing .landing-hero {
  min-height: min(820px, 100svh) !important; padding: 110px max(5vw, 32px) 72px !important;
  display: grid !important; grid-template-columns: minmax(160px, .42fr) minmax(0, 1.58fr) !important;
  align-items: center !important; gap: clamp(52px, 8vw, 150px) !important;
  text-align: left !important; background: var(--vi-paper) !important;
  border-bottom: 1px solid var(--vi-line);
}
.vari-landing .institute-mark {
  position: static !important; transform: none !important; align-self: start; justify-self: start;
  grid-column: 1; grid-row: 1; padding-top: 8px;
}
.vari-landing .institute-mark .status-dot { background: var(--vi-green) !important; box-shadow: none !important; }
.vari-landing .institute-mark small { font-family: var(--vi-font) !important; color: var(--vi-muted) !important; font-size: 10px !important; letter-spacing: .08em !important; }
.vari-landing .hero-copy {
  width: min(100%, 1120px) !important; transform: none !important; grid-column: 2; grid-row: 1;
  padding-left: clamp(34px, 5vw, 78px); border-left: 1px solid var(--vi-line);
}
.vari-landing .hero-kicker { margin: 0 0 18px !important; color: var(--vi-green) !important; font: 750 11px/1.4 var(--vi-font) !important; letter-spacing: .09em !important; }
.vari-landing .landing-logo {
  margin: 0 !important; color: var(--vi-green) !important; background: none !important;
  font: 900 clamp(72px, 9vw, 148px)/.82 var(--vi-font) !important;
  letter-spacing: -.065em !important; text-shadow: none !important; animation: none !important;
}
.vari-landing .hero-cn { margin: 28px 0 48px !important; color: var(--vi-ink) !important; font-family: var(--vi-serif); font-size: clamp(20px, 2vw, 30px) !important; letter-spacing: .04em !important; }
.vari-landing .hero-copy h2 { max-width: 920px; margin: 0 !important; color: var(--vi-ink) !important; font-size: clamp(36px, 5vw, 72px) !important; line-height: 1.03 !important; letter-spacing: -.045em !important; }
.vari-landing .hero-description { max-width: 780px !important; margin: 26px 0 0 !important; color: var(--vi-body) !important; font-size: 16px !important; line-height: 1.8 !important; }
.vari-landing .enter-platform {
  min-width: 190px !important; min-height: 50px !important; margin: 34px 0 0 !important;
  color: #fff !important; background: var(--vi-green) !important; border: 1px solid var(--vi-green) !important;
  border-radius: var(--vi-radius-sm) !important; box-shadow: none !important; letter-spacing: 0 !important;
}
.vari-landing .enter-platform:hover { color: #fff !important; background: var(--vi-green-hover) !important; transform: none !important; box-shadow: none !important; }
.vari-landing .hero-trust { justify-content: flex-start !important; margin-top: 24px !important; gap: 14px !important; }
.vari-landing .hero-trust span { padding: 0 !important; color: var(--vi-muted) !important; border: 0 !important; background: transparent !important; font: 700 10px/1.4 var(--vi-font) !important; letter-spacing: .08em !important; }
.vari-landing .orbit, .vari-landing [class*="ring"], .vari-landing [class*="glow"] { opacity: .12 !important; filter: grayscale(1); }
.vari-landing .landing-section { width: min(1320px, calc(100% - 64px)) !important; padding: clamp(76px, 8vw, 124px) 0 !important; }
.vari-landing .section-heading { max-width: 880px !important; margin-bottom: 38px !important; }
.vari-landing .section-heading > p, .vari-landing .institute-section > div > p { color: var(--vi-muted) !important; font: 700 11px/1.4 var(--vi-font) !important; letter-spacing: .06em !important; }
.vari-landing .section-heading h2, .vari-landing .institute-section h2 { color: var(--vi-ink) !important; font-size: clamp(34px, 4vw, 58px) !important; }
.vari-landing .section-heading span { color: var(--vi-body) !important; }
.vari-landing .demo-shell { border: 1px solid var(--vi-line) !important; border-radius: var(--vi-radius) !important; background: var(--vi-paper) !important; box-shadow: none !important; }
.vari-landing .demo-visual, .vari-landing .demo-copy { background: transparent !important; border-color: var(--vi-line) !important; }
.vari-landing .demo-node { color: var(--vi-body) !important; background: var(--vi-paper) !important; border-color: var(--vi-line-strong) !important; box-shadow: none !important; }
.vari-landing .demo-node.active { color: var(--vi-green) !important; background: var(--vi-green-soft) !important; border-color: var(--vi-green) !important; }
.vari-landing .demo-lines path { stroke: var(--vi-line-strong) !important; filter: none !important; }
.vari-landing .demo-core { color: #fff !important; background: var(--vi-green) !important; border-color: var(--vi-green) !important; box-shadow: none !important; }
.vari-landing .mission-grid { gap: 0 !important; border-block: 1px solid var(--vi-line); }
.vari-landing .mission-grid article {
  min-height: 290px !important; padding: 34px !important; border: 0 !important; border-right: 1px solid var(--vi-line) !important;
  border-radius: 0 !important; background: transparent !important; box-shadow: none !important; transform: none !important;
}
.vari-landing .mission-grid article:last-child { border-right: 0 !important; }
.vari-landing .mission-grid article > b { color: var(--vi-line-strong) !important; }
.vari-landing .mission-icon { color: var(--vi-green) !important; border-color: var(--vi-line) !important; background: var(--vi-green-soft) !important; }
.vari-landing .mission-grid p { color: var(--vi-body) !important; }
.vari-landing .mission-grid small { color: var(--vi-muted) !important; font-family: var(--vi-font) !important; }
.vari-landing .capability-grid { gap: 1px !important; padding: 1px; background: var(--vi-line); }
.vari-landing .capability-grid article {
  border: 0 !important; border-radius: 0 !important; background: var(--vi-paper) !important;
  box-shadow: none !important; transform: none !important;
}
.vari-landing .capability-grid article > i, .vari-landing .capability-grid article > small { color: var(--vi-green) !important; }
.vari-landing .capability-grid p, .vari-landing .institute-section > p { color: var(--vi-body) !important; }
.vari-landing .network-visual { display: none !important; }
.vari-landing .institute-section { border-color: var(--vi-line) !important; }
.vari-landing .enter-platform.secondary { color: var(--vi-green) !important; background: transparent !important; }
.vari-landing > footer { color: var(--vi-muted) !important; background: var(--vi-paper) !important; border-color: var(--vi-line) !important; }

.entry-topbar {
  display: flex; align-items: center; justify-content: space-between; padding: 0 34px !important;
}
.entry-brand { display: flex; align-items: baseline; gap: 16px; }
.entry-brand > span { color: var(--vi-green) !important; font-size: 28px; letter-spacing: -.045em; }
.entry-brand small, .entry-institute small { color: var(--vi-muted) !important; }
.auth-shell { min-height: calc(100vh - 68px); }
.auth-aside { position: relative; overflow: hidden; }
.auth-aside::after {
  content: ""; position: absolute; inset: auto 8% 8% auto; width: 35%; aspect-ratio: 1;
  border: 1px solid rgba(255,255,255,.25); border-radius: 50%; pointer-events: none;
}
.auth-aside-copy { max-width: 640px; }
.auth-aside-copy .entry-vari { font-size: clamp(66px, 9vw, 138px) !important; letter-spacing: -.06em; }
.auth-aside-copy .entry-cn { font-family: var(--vi-serif); font-size: clamp(22px, 2.4vw, 34px); }
.auth-main { padding: clamp(26px, 5vw, 80px) !important; }
.auth-card { width: min(500px, 100%); padding: clamp(28px, 4vw, 52px) !important; }
.auth-card-head, .auth-card-footer { border-color: var(--vi-line) !important; }
.access-status i { background: var(--vi-success) !important; box-shadow: none !important; }
.login-role-line h2 { font-size: 30px !important; }

.vari-account .app-topbar, .vari-admin .app-topbar, .vari-onboarding .app-topbar {
  display: flex; align-items: center; gap: 28px; padding: 0 32px !important;
}
.vari-account .app-topbar nav, .vari-admin .app-topbar nav { margin-left: auto; }
.logout-btn { margin-left: 0; }
.account-card { padding: 32px !important; }
.account-card h2 { padding-bottom: 18px; border-bottom: 1px solid var(--vi-line); }
.account-card .form-field { margin-top: 20px; }

.vari-onboarding .onboarding-card { padding: clamp(28px, 5vw, 64px) !important; }
.vari-onboarding .preference-group { padding: 28px 0 !important; border: 0 !important; border-top: 1px solid var(--vi-line) !important; background: transparent !important; }
.vari-onboarding .preset-grid, .vari-onboarding .topic-grid,
.vari-onboarding .delivery-grid, .vari-onboarding .option-grid { gap: 8px !important; }
.vari-onboarding .preset-grid label, .vari-onboarding .topic-grid label,
.vari-onboarding .delivery-grid label, .vari-onboarding .option-grid label {
  border-color: var(--vi-line) !important; border-radius: var(--vi-radius-sm) !important;
  background: var(--vi-paper) !important; box-shadow: none !important;
}

.vari-admin .admin-shell { max-width: 1320px !important; }
.vari-admin .workspace-card { padding: 30px 0 !important; }
.vari-admin .workspace-card > header { align-items: flex-start; padding-bottom: 18px; }
.vari-admin .metric-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); border-block: 1px solid var(--vi-line); }
.vari-admin .metric-row > * { padding: 18px; border-right: 1px solid var(--vi-line); border-radius: 0 !important; background: transparent !important; }
.vari-admin .admin-table { border-block: 1px solid var(--vi-line); }
.vari-admin .admin-table th, .vari-admin .admin-table td { padding: 14px 12px; }
.vari-admin .moderation-list > *, .vari-admin .audit-list > * { border-radius: 0 !important; border-width: 0 0 1px !important; box-shadow: none !important; }

@media (max-width: 900px) {
  .vari-landing .landing-hero {
    min-height: auto !important; grid-template-columns: 1fr !important; gap: 38px !important;
    padding: 46px 28px 70px !important;
  }
  .vari-landing .institute-mark { grid-column: 1; grid-row: 1; }
  .vari-landing .hero-copy { grid-column: 1; grid-row: 2; padding: 34px 0 0 !important; border-left: 0; border-top: 1px solid var(--vi-line); }
  .vari-landing .landing-section { width: min(100% - 40px, 1320px) !important; }
  .vari-landing .mission-grid { grid-template-columns: 1fr !important; }
  .vari-landing .mission-grid article { min-height: 240px !important; border-right: 0 !important; border-bottom: 1px solid var(--vi-line) !important; }
  .vari-landing .mission-grid article:last-child { border-bottom: 0 !important; }
  .vari-landing .capability-grid { grid-template-columns: 1fr 1fr !important; }
  .vari-landing .capability-feature { grid-column: 1 / -1 !important; min-height: 300px !important; }
  .auth-shell { grid-template-columns: 1fr !important; }
  .auth-aside { min-height: 330px; padding: 48px 28px !important; }
  .auth-scene { display: none !important; }
  .auth-main { padding: 28px 18px 48px !important; }
  .vari-admin .admin-table { display: block; overflow-x: auto; }
}

@media (max-width: 600px) {
  .vari-landing .landing-hero { padding: 32px 20px 54px !important; }
  .vari-landing .hero-copy { padding-top: 28px !important; }
  .vari-landing .landing-logo { font-size: 72px !important; }
  .vari-landing .hero-cn { margin: 20px 0 32px !important; font-size: 19px !important; }
  .vari-landing .hero-copy h2 { font-size: 34px !important; }
  .vari-landing .hero-description { font-size: 14px !important; }
  .vari-landing .landing-section { width: calc(100% - 28px) !important; padding: 64px 0 !important; }
  .vari-landing .capability-grid { grid-template-columns: 1fr !important; }
  .vari-landing .capability-feature { grid-column: auto !important; }
  .entry-topbar { padding: 0 16px !important; }
  .entry-brand small, .entry-institute { display: none; }
  .auth-aside { min-height: 250px; }
  .auth-aside-copy h2, .auth-aside-copy .entry-description, .auth-aside-copy .trust-list { display: none; }
  .auth-aside-copy .entry-vari { font-size: 64px !important; }
  .vari-account .app-topbar, .vari-admin .app-topbar, .vari-onboarding .app-topbar { padding: 0 14px !important; gap: 10px; }
  .vari-account .app-topbar nav, .vari-admin .app-topbar nav { display: none; }
  .account-card { padding: 22px !important; }
}