/* Convert Run premium UI layer — governed by docs/UI-SPEC.md */
:root,
:root[data-theme="light"] {
  --surface-base:#f7f8fa;
  --surface-raised:#fff;
  --surface-overlay:#fff;
  --surface-sunken:#f1f3f6;
  --surface-hover:#f5f7fa;
  --surface-active:#e9edf3;
  --border-subtle:#edf0f4;
  --border-default:#e2e7ed;
  --border-strong:#cbd2dd;
  --text-primary:#17233b;
  --text-secondary:#667085;
  --text-tertiary:#98a2b3;
  --brand-300:#8facf0;
  --brand-400:#527cdf;
  --brand-500:#315fc5;
  --brand-600:#254ca5;
  --brand-700:#1f4089;
  --accent-500:#527cdf;
  --accent-600:#315fc5;
  --brand-gradient:linear-gradient(135deg,#3d6bd2,#274fa9);
  --brand-glow:0 16px 40px rgba(49,95,197,.16);
  --success-500:#087ea4;
  --success-bg:rgba(8,126,164,.09);
  --font-display:"Manrope",var(--font-sans);
  --shadow-sm:0 1px 2px rgba(16,24,40,.04);
  --shadow-md:0 4px 14px rgba(16,24,40,.06);
  --shadow-lg:0 14px 36px rgba(16,24,40,.08);
  --sidebar-width:256px;
  --topbar-height:68px;
}

body { color:var(--text-primary); background:#f7f8fa; }
body::before { display:none; }
h1,h2,h3 { text-wrap:balance; }

/* Product shell */
.app-shell { background:#f7f8fa; }
.app-content { max-width:1480px; padding:36px clamp(24px,3vw,48px) 72px; }
.sidebar {
  background:#fff !important; border-right:1px solid #e7eaf0 !important;
  box-shadow:none !important;
}
.sidebar__brand { height:68px; padding:0 20px; border-bottom:1px solid #edf0f4; }
.sidebar__logo {
  width:32px; height:32px; border-radius:9px !important; background:#315fc5 !important;
  color:#fff !important; box-shadow:0 1px 3px rgba(49,95,197,.22) !important;
  font-family:var(--font-display); font-weight:700;
}
.sidebar__wordmark { color:#17233b !important; font-size:11px; font-weight:700; letter-spacing:.13em; }
.sidebar__nav { padding:18px 12px; gap:2px; }
.sidebar__group-label { padding:22px 10px 8px; color:#a0a8b5; font-size:10px; letter-spacing:.12em; }
.nav-item {
  min-height:42px; padding:0 11px; border-radius:9px; color:#667085;
  font-size:13px; font-weight:520; transition:background-color 140ms,color 140ms;
}
.nav-item:hover { background:#f5f7fa; color:#17233b; }
.nav-item.active { background:#eef3ff; color:#254ca5; box-shadow:none; font-weight:620; }
.nav-item__icon { width:20px; color:#8993a3; font-size:15px; }
.nav-item.active .nav-item__icon { color:#315fc5; }
.nav-item__count { background:#315fc5; color:#fff; }
.sidebar__footer { border-top:1px solid #edf0f4; background:#fff; }

.topbar {
  height:68px; padding:0 clamp(20px,3vw,40px); background:rgba(255,255,255,.9) !important;
  border-bottom:1px solid #e7eaf0 !important; box-shadow:none; backdrop-filter:blur(18px);
}
.topbar__title { color:#17233b; font-size:13px; }
.topbar__title b { font-weight:650; }
.topbar__title small { color:#98a2b3; }
.topbar .btn--icon { border-color:#e5e9ef; background:#fff; color:#667085; }

/* Dashboard */
.dashboard-hero {
  margin:-36px calc(clamp(24px,3vw,48px) * -1) 28px;
  padding:42px clamp(24px,3vw,48px) 34px; background:#fff !important;
  border-bottom:1px solid #e7eaf0 !important;
}
.dashboard-hero::after { display:none !important; }
.dashboard-hero .page-header { align-items:flex-end; }
.dashboard-hero .page-header__title {
  margin:8px 0 8px; font-family:var(--font-display); font-size:clamp(30px,3vw,42px);
  font-weight:650; letter-spacing:-.04em; color:#17233b;
}
.dashboard-hero .page-header__subtitle { max-width:680px; color:#667085; font-size:14px; }
.dashboard-kicker { color:#315fc5 !important; font-size:10px; letter-spacing:.13em; }
.dashboard-kicker i { background:#315fc5 !important; box-shadow:none !important; }
.dashboard-stats { grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; }
.dashboard-stats .stat,
.dashboard-stats .stat--primary {
  min-height:146px; padding:20px; border:1px solid #e6eaf0 !important;
  border-radius:14px; background:#fff !important; box-shadow:0 1px 2px rgba(16,24,40,.025) !important;
  color:#17233b !important;
}
.dashboard-stats .stat::before { content:""; width:32px; height:3px; border-radius:4px; background:#dce5fa; }
.dashboard-stats .stat--primary::before { background:#315fc5; }
.dashboard-stats .stat * { color:inherit; }
.dashboard-stats .stat__label { color:#667085 !important; font-size:10px; letter-spacing:.1em; }
.dashboard-stats .stat__value { margin-top:auto; color:#17233b !important; font-family:var(--font-display); font-size:34px; font-weight:650; }
.dashboard-stats .stat__value small { color:#98a2b3 !important; font-family:var(--font-sans); font-size:11px; }
.dashboard-stats .stat__meta { color:#98a2b3 !important; font-size:11px; }
.dashboard-section-head { margin:34px 0 16px; }
.dashboard-section-head h2 { font-family:var(--font-display); font-size:21px; }

/* Product surfaces and controls */
.card,.video-card,.stat {
  border:1px solid #e6eaf0; background:#fff; box-shadow:0 1px 2px rgba(16,24,40,.025);
}
.card { border-radius:14px; padding:22px; }
.card__header { border-bottom-color:#edf0f4; }
.card__title { color:#17233b; font-weight:650; }
.video-card { border-radius:14px; overflow:hidden; transition:border-color 160ms,box-shadow 160ms,transform 160ms; }
.video-card:hover { transform:translateY(-2px); border-color:#cbd2dd; box-shadow:0 10px 26px rgba(16,24,40,.07); }
.video-card__preview { background:#eef1f5; }
.video-card__body { padding:16px; }

.btn { min-height:40px; border-radius:9px; font-size:13px; font-weight:620; }
.btn--primary { background:#315fc5 !important; border-color:#315fc5 !important; color:#fff !important; box-shadow:0 1px 2px rgba(16,24,40,.08),0 3px 8px rgba(49,95,197,.13) !important; }
.btn--primary:hover:not(:disabled) { background:#254ca5 !important; border-color:#254ca5 !important; box-shadow:0 4px 12px rgba(49,95,197,.18) !important; }
.btn--secondary { background:#fff; border-color:#d6dce5; color:#344054; }
.btn--secondary:hover:not(:disabled) { background:#f8fafc; border-color:#b8c0cc; }
.btn--ghost { color:#536072; }
.btn--ghost:hover:not(:disabled) { background:#eef2f6; color:#17233b; }
.input,.textarea,.select { background:#fff; border-color:#d6dce5; color:#17233b; border-radius:9px; box-shadow:0 1px 2px rgba(16,24,40,.025); }
.input:focus,.textarea:focus,.select:focus { border-color:#527cdf; box-shadow:0 0 0 3px rgba(49,95,197,.11); }

/* Marketing */
.lp-nav { background:rgba(250,249,246,.88) !important; border-color:rgba(23,35,59,.08) !important; }
.lp-nav .lp-brand,.lp-nav__links a,.lp-nav .lp-link { color:#17233b !important; }
.lp-brand__mark { background:#315fc5 !important; color:#fff !important; box-shadow:0 1px 3px rgba(49,95,197,.2); }
.lp-brand__word { font-family:var(--font-display); font-weight:700; }
.lp-hero { min-height:860px; background:#f7f4ee !important; color:#17233b !important; }
.lp-hero__light { background:radial-gradient(circle at 75% 35%,rgba(49,95,197,.11),transparent 32%) !important; }
.lp-hero__rule { opacity:.05; }
.lp-hero__inner { padding-block:clamp(110px,12vw,170px); gap:clamp(40px,6vw,88px); }
.lp-hero .lp-eyebrow { color:#315fc5 !important; border-color:rgba(49,95,197,.18) !important; background:rgba(49,95,197,.06) !important; }
.lp-hero .lp-eyebrow__dot { background:#315fc5 !important; }
.lp-hero .lp-display {
  color:#17233b !important; font-family:var(--font-display); font-size:clamp(3.7rem,7vw,6.8rem);
  font-weight:650; line-height:.92; letter-spacing:-.072em;
}
.lp-hero .lp-accent { color:#315fc5 !important; }
.lp-hero .lp-lead { color:#5e6877 !important; font-size:clamp(1rem,1.4vw,1.15rem); line-height:1.7; }
.lp-hero .lp-hero__note { color:#87909d !important; }
.lp-hero .lp-btn--ghost { color:#283548 !important; border-color:rgba(23,35,59,.16) !important; background:rgba(255,255,255,.62) !important; }
.lp-btn--primary { background:#315fc5 !important; border-color:#315fc5 !important; color:#fff !important; box-shadow:0 12px 28px rgba(49,95,197,.17) !important; }
.lp-btn--primary:hover { background:#254ca5 !important; border-color:#254ca5 !important; }
.lp-frame--hero { min-height:600px; border:1px solid rgba(23,35,59,.12) !important; border-radius:26px; background:#ede9e1 !important; box-shadow:0 36px 90px rgba(46,50,62,.16) !important; }
.lp-frame--hero .lp-frame__bar { background:rgba(255,253,248,.86) !important; border-color:rgba(23,35,59,.08) !important; }
.lp-frame__body--floating { background:rgba(255,255,255,.88) !important; border-color:rgba(23,35,59,.09) !important; box-shadow:0 20px 50px rgba(45,50,62,.12); }
.lp-frame__body--floating .lp-field { background:#f6f7f9 !important; border-color:#e3e7ed !important; }
.lp-frame__body--floating .lp-output__poster { background:#315fc5 !important; color:#fff !important; }
.lp-marquee { background:#edf3ff !important; color:#263e6a !important; border-color:#dbe5fb !important; }
.lp-marquee__item { color:#263e6a !important; }
.lp-section { padding-block:clamp(88px,10vw,144px); }
.lp-section--tint { background:#f4f6f9 !important; }
.lp-index { color:#315fc5 !important; }
.lp-h2 { font-family:var(--font-display); color:#17233b; letter-spacing:-.045em; }
.lp-tile { border-color:#e4e8ee; border-radius:18px; box-shadow:none; }
.lp-tile:hover { border-color:#cbd2dd; box-shadow:0 14px 34px rgba(16,24,40,.06); }
.lp-status__badge--done { background:rgba(8,126,164,.08) !important; color:#08708f !important; border-color:rgba(8,126,164,.22) !important; }

/* Reliability band: the legacy landing theme rendered this section dark. */
.lp-section--ink {
  background:#eef3fb !important;
  color:#17233b !important;
  border-block:1px solid #dce5f3 !important;
}
.lp-section--ink .lp-h2,
.lp-section--ink .lp-h3 { color:#17233b !important; }
.lp-section--ink .lp-lead { color:#536276 !important; }
.lp-section--ink .lp-index { color:#315fc5 !important; }
.lp-section--ink .lp-index::before { background:#315fc5 !important; }
.lp-section--ink .lp-tile {
  background:rgba(255,255,255,.86) !important;
  border-color:#dbe3ef !important;
  box-shadow:0 1px 2px rgba(16,24,40,.025) !important;
}
.lp-section--ink .lp-tile__text,
.lp-section--ink .lp-body { color:#5f6c7c !important; }
.lp-section--ink .lp-tile:hover {
  background:#fff !important;
  border-color:#c4d0e2 !important;
  box-shadow:0 12px 28px rgba(40,61,92,.07) !important;
}

@media(max-width:1024px){
  .app-content{padding:26px 18px 60px}.dashboard-hero{margin:-26px -18px 24px;padding:32px 18px 28px}
  .dashboard-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:680px){
  .dashboard-stats{grid-template-columns:1fr}.dashboard-stats .stat{min-height:132px}
  .dashboard-hero .page-header__actions,.dashboard-hero .page-header__actions .btn{width:100%}
  .lp-hero{min-height:auto}.lp-hero__inner{padding-block:84px 72px}.lp-frame--hero{min-height:470px}
}