/* WadeGlobal AI home: live-surface grammar.
   Locked brand: Navy #0B1533, Electric Blue #1FA9FF, Steel #C7CCD4, White.
   Instrument Sans only, sentence case, letter spacing 0. */
:root {
  --sc-canvas: #0A1330;
  --sc-surface: #111C40;
  --sc-ink: #F3F6FB;
  --sc-ink-soft: #A9B4C7;
  --sc-accent: #1FA9FF;
  --sc-accent-ink: #04142E;
  --sc-font-display: "Instrument Sans", system-ui, sans-serif;
  --sc-font-text: "Instrument Sans", system-ui, sans-serif;
  --sc-font-mono: "Instrument Sans", system-ui, sans-serif;
  --sc-track-tight: 0; --sc-track-snug: 0; --sc-track-normal: 0; --sc-track-wide: 0;
  --navy: #0B1533; --steel: #C7CCD4;
  --line: rgba(199, 204, 212, .13);
  --line-2: rgba(199, 204, 212, .22);
  --raise: #15224B;
  --side: 236px;
  --top: 60px;
}
html { scroll-padding-top: calc(var(--top) + 8px); }
body.cc { margin: 0; background: var(--sc-canvas); color: var(--sc-ink); font-family: var(--sc-font-text); letter-spacing: 0; }
body.cc * { letter-spacing: 0; }
.cc a { color: inherit; }
.cc h1, .cc h2, .cc h3 { font-family: var(--sc-font-display); letter-spacing: 0; margin: 0; }
.cc p { margin: 0; }
.skip-link { position: absolute; left: 12px; top: -60px; z-index: 100; padding: 10px 14px; border-radius: 8px; background: var(--sc-accent); color: var(--sc-accent-ink); font-weight: 600; text-decoration: none; }
.skip-link:focus { top: 12px; }
[data-sc-progress] { z-index: 80; }

/* ---------------------------------------------------------------- chrome -- */
.cc-side {
  position: fixed; inset: 0 auto 0 0; width: var(--side); z-index: 70;
  display: flex; flex-direction: column; gap: 22px; overflow-y: auto;
  padding: 18px 14px 20px; box-sizing: border-box;
  background: linear-gradient(180deg, #0F1B45 0%, #0B1533 55%, #09112A 100%);
  border-right: 1px solid var(--line);
}
.cc-brand { display: flex; align-items: center; gap: 10px; text-decoration: none; padding: 2px 6px 14px; border-bottom: 1px solid var(--line); }
.cc-brand img { width: 40px; height: 40px; object-fit: contain; }
.cc-brand strong { display: block; font-size: 15px; font-weight: 700; }
.cc-brand small { display: block; font-size: 11.5px; color: var(--sc-ink-soft); margin-top: 2px; }
.cc-nav { display: grid; gap: 2px; }
.cc-nav a, .cc-side-group a {
  display: flex; align-items: center; gap: 11px; min-height: 38px; padding: 0 10px;
  border-radius: 9px; text-decoration: none; font-size: 14.5px; color: #CFD7E4;
  transition: background-color 160ms var(--sc-ease-out), color 160ms var(--sc-ease-out);
}
.cc-nav a i { width: 7px; height: 7px; border-radius: 2px; background: rgba(199, 204, 212, .35); flex: none; transition: background-color 160ms; }
.cc-nav a:hover, .cc-side-group a:hover { background: rgba(255, 255, 255, .05); color: #fff; }
.cc-nav a.is-active { background: rgba(31, 169, 255, .12); color: #fff; }
.cc-nav a.is-active i { background: var(--sc-accent); }
.cc-nav-start { margin-top: 6px; border: 1px solid rgba(31, 169, 255, .35); }
.cc-needs { margin-left: auto; min-width: 20px; height: 20px; padding: 0 6px; box-sizing: border-box; border-radius: 99px; display: inline-grid; place-items: center; font-size: 11.5px; font-weight: 700; background: rgba(199, 204, 212, .14); color: var(--sc-ink-soft); font-variant-numeric: tabular-nums; transition: background-color 240ms, color 240ms, transform 240ms var(--sc-ease-out); }
.cc-needs.is-hot { background: var(--sc-accent); color: var(--sc-accent-ink); transform: scale(1.08); }
.cc-side-group { display: grid; gap: 1px; }
.cc-side-group p { font-size: 12px; color: #7F8BA3; padding: 0 10px 6px; }
.cc-side-group a { min-height: 32px; font-size: 13.5px; color: #AEB8CA; }

.cc-body { margin-left: var(--side); min-width: 0; }
.cc-top {
  position: sticky; top: 0; z-index: 65; height: var(--top); box-sizing: border-box;
  display: flex; align-items: center; gap: 18px; padding: 0 clamp(16px, 3vw, 36px);
  background: rgba(10, 19, 48, .82); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
  border-bottom: 1px solid var(--line);
}
.cc-top-brand { display: none; }
.cc-top-brand img { display: block; }
.cc-clock { display: flex; align-items: center; gap: 12px; min-width: 0; font-size: 14px; color: var(--sc-ink-soft); margin-right: auto !important; }
.cc-clock-co { color: #fff; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 22ch; }
.cc-clock time { font-variant-numeric: tabular-nums; font-weight: 600; color: var(--sc-accent); min-width: 7ch; }
.cc-sample { font-size: 12px; padding: 3px 9px; border-radius: 99px; border: 1px solid var(--line-2); color: var(--sc-ink-soft); white-space: nowrap; }
.cc-phone { font-size: 14px; color: var(--sc-ink-soft) !important; text-decoration: none; white-space: nowrap; }
.cc-phone:hover { color: #fff !important; }
.cc-cta, .btn {
  display: inline-flex; align-items: center; justify-content: center; white-space: nowrap;
  min-height: 42px; padding: 0 18px; border-radius: 10px; font: 600 15px/1 var(--sc-font-text);
  text-decoration: none; cursor: pointer; border: 1px solid transparent;
  transition: transform 140ms var(--sc-ease-out), background-color 160ms, border-color 160ms;
}
.cc-cta, .btn-primary { background: var(--sc-accent); color: var(--sc-accent-ink) !important; }
.cc-cta:hover, .btn-primary:hover { background: #4BBBFF; }
.cc-cta:active, .btn:active { transform: translateY(1px); }
.btn-ghost { background: transparent; color: #fff !important; border-color: var(--line-2); }
.btn-ghost:hover { border-color: var(--steel); }
.btn { min-height: 48px; padding: 0 22px; font-size: 16px; }
.cc :focus-visible { outline: 2px solid var(--sc-accent); outline-offset: 3px; border-radius: 8px; }

.help-kicker { font-size: 14px; font-weight: 600; color: var(--sc-accent); }
.help-links { display: flex; flex-wrap: wrap; gap: 8px 20px; margin-top: 18px !important; }
.help-links a { font-size: 14.5px; color: #CFE9FF; text-decoration: none; border-bottom: 1px solid rgba(31, 169, 255, .45); padding-bottom: 2px; }
.help-links a:hover { color: #fff; border-color: var(--sc-accent); }

.act h2 { font-size: clamp(1.7rem, 1.15rem + 1.5vw, 2.55rem); line-height: 1.08; font-weight: 600; text-wrap: balance; }
.act p { color: var(--sc-ink-soft); font-size: 1.04rem; line-height: 1.6; max-width: 58ch; }
.act h2 + p, .act p + p { margin-top: 14px; }

/* ----------------------------------------------------------- 1 · today -- */
.act-today { position: relative; overflow: clip; min-height: calc(100svh - var(--top)); display: grid; align-items: center; padding: clamp(28px, 5vw, 64px) clamp(16px, 3.4vw, 48px); box-sizing: border-box; --hp: 0; }
.today-plane--grid {
  position: absolute; inset: -10% -5% -10% -5%; z-index: 0; pointer-events: none;
  background-image:
    radial-gradient(60% 55% at 72% 42%, rgba(31, 169, 255, .20), transparent 70%),
    linear-gradient(rgba(199, 204, 212, .07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(199, 204, 212, .07) 1px, transparent 1px);
  background-size: auto, 44px 44px, 44px 44px;
  -webkit-mask-image: radial-gradient(75% 70% at 65% 45%, #000 30%, transparent 85%);
  mask-image: radial-gradient(75% 70% at 65% 45%, #000 30%, transparent 85%);
  transform: translate3d(calc(var(--mx, 0) * -8px), calc(var(--hp) * 90px), 0);
}
.today-grid { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.02fr); gap: clamp(28px, 4vw, 64px); align-items: center; max-width: 1240px; margin: 0 auto; width: 100%; }
.cc-status { display: inline-flex; align-items: center; gap: 9px; font-size: 13.5px !important; color: var(--sc-ink-soft); padding: 6px 12px; border-radius: 99px; border: 1px solid var(--line-2); background: rgba(255, 255, 255, .03); }
.cc-status i { width: 7px; height: 7px; border-radius: 50%; background: #34D399; box-shadow: 0 0 0 3px rgba(52, 211, 153, .18); }
.act-today h1 { margin-top: 20px; font-size: clamp(2.25rem, 1.3rem + 2.7vw, 3.65rem); line-height: 1.04; font-weight: 600; text-wrap: balance; max-width: 15ch; }
.today-deck { margin-top: 20px !important; font-size: 1.12rem !important; color: #C3CCDA !important; max-width: 52ch; }
.today-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 18px; margin-top: 28px; }
.today-actions p { font-size: 14px !important; margin: 0 !important; max-width: 30ch; }

.today-stage { position: relative; padding: 36px 0 40px; --mx: 0; --my: 0; }
.board {
  position: relative; z-index: 1; border-radius: 18px; padding: 20px;
  background: linear-gradient(180deg, #14214A, #0F1A3C);
  border: 1px solid var(--line-2);
  box-shadow: 0 1px 0 rgba(255, 255, 255, .06) inset, 0 30px 70px -20px rgba(2, 6, 20, .75), 0 10px 24px -8px rgba(2, 6, 20, .5);
  transform: translate3d(calc(var(--mx) * 10px), calc(var(--my) * 8px + var(--hp) * -50px), 0);
  transition: transform 500ms var(--sc-ease-out);
}
.board-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 14px; flex-wrap: wrap; }
.board-co { display: grid; gap: 6px; flex: 1 1 200px; }
.board-co span { font-size: 12.5px; color: var(--sc-ink-soft); }
.board-co input {
  width: 100%; box-sizing: border-box; height: 44px; padding: 0 12px; border-radius: 10px;
  background: rgba(3, 8, 24, .45); border: 1px solid var(--line-2); color: #fff;
  font: 600 1.05rem var(--sc-font-text);
}
.board-co input::placeholder { color: #7D89A1; font-weight: 500; }
.board-co input:focus { border-color: var(--sc-accent); outline: none; box-shadow: 0 0 0 3px rgba(31, 169, 255, .25); }
.board-hello { font-size: 14px !important; color: #fff !important; white-space: nowrap; }
.board-hello time { color: var(--sc-accent); font-variant-numeric: tabular-nums; font-weight: 600; }
.board-hint { margin-top: 10px !important; font-size: 12.5px !important; color: #8793AB !important; line-height: 1.45 !important; }
.tiles { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-top: 16px; }
.tile { padding: 12px; border-radius: 12px; background: rgba(3, 8, 24, .35); border: 1px solid var(--line); min-width: 0; }
.tile small { display: block; font-size: 12px; color: var(--sc-ink-soft); }
.tile strong { display: block; margin-top: 6px; font-size: 1.9rem; line-height: 1; font-weight: 600; font-variant-numeric: tabular-nums; }
.tile span { display: block; margin-top: 6px; font-size: 11.5px; color: #7F8BA3; line-height: 1.3; }
.tile--needs strong { color: var(--sc-ink-soft); transition: color 300ms; }
.tile--needs strong.is-hot { color: var(--sc-accent); }
.board-next { margin-top: 12px; padding: 12px 14px; border-radius: 12px; border: 1px solid rgba(31, 169, 255, .35); background: rgba(31, 169, 255, .07); }
.board-next small { font-size: 12px; color: var(--sc-accent); font-weight: 600; }
.board-next p { margin-top: 4px !important; font-size: 14.5px !important; color: #E6EEF9 !important; }

.toast {
  position: absolute; z-index: 2; display: grid; gap: 3px; padding: 11px 14px 11px 38px;
  border-radius: 12px; background: #F3F6FB; color: var(--navy);
  box-shadow: 0 18px 40px -12px rgba(2, 6, 20, .7), 0 3px 8px rgba(2, 6, 20, .35);
  font-size: 13px; max-width: 250px;
  transition: opacity 420ms var(--sc-ease-out), transform 500ms var(--sc-ease-out);
}
.toast::before { content: ""; position: absolute; left: 14px; top: 15px; width: 12px; height: 12px; border-radius: 50%; background: #1FA9FF; box-shadow: 0 0 0 4px rgba(31, 169, 255, .2); }
.toast b { font-size: 13.5px; }
.toast span { color: #46526B; }
.toast--a { top: -2px; right: -18px; transform: translate3d(calc(var(--mx) * 26px), calc(var(--my) * 20px + var(--hp) * -150px), 0); }
.toast--b { bottom: 4px; left: -26px; transform: translate3d(calc(var(--mx) * 18px), calc(var(--my) * 14px + var(--hp) * -100px), 0); }
.live .toast:not(.is-on) { opacity: 0; }

/* shared pinned stage */
.stage { box-sizing: border-box; padding: calc(var(--top) + clamp(16px, 4vh, 44px)) clamp(16px, 3.4vw, 48px) clamp(20px, 5vh, 48px); display: grid; align-items: center; }

/* ------------------------------------------------------- 2 · coming in -- */
.panel-grid { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: clamp(24px, 4vw, 64px); align-items: center; max-width: 1240px; width: 100%; margin: 0 auto; }
.feed { border-radius: 16px; border: 1px solid var(--line-2); background: var(--sc-surface); overflow: hidden; box-shadow: 0 24px 60px -24px rgba(2, 6, 20, .7); }
.feed-head { display: flex; justify-content: space-between; gap: 12px; padding: 13px 16px; font-size: 13px; color: var(--sc-ink-soft); border-bottom: 1px solid var(--line); background: rgba(255, 255, 255, .02); }
.feed-head b { color: #fff; font-variant-numeric: tabular-nums; }
.row { display: grid; grid-template-columns: 50px minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 11px 16px; border-bottom: 1px solid var(--line); font-size: 14px; transition: opacity 360ms var(--sc-ease-out), transform 360ms var(--sc-ease-out), background-color 600ms; }
.row:last-child { border-bottom: 0; }
.row time { color: #7F8BA3; font-variant-numeric: tabular-nums; font-size: 13px; }
.row p { color: #DDE4EF !important; font-size: 14px !important; line-height: 1.35 !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.row p b { color: #fff; font-weight: 600; margin-right: 6px; }
.row em { font-style: normal; font-size: 12.5px; color: #7DD3A8; white-space: nowrap; }
.live .row:not(.is-on) { opacity: .1; transform: translateX(6px); }

/* ------------------------------------------------------- 3 · follow-up -- */
.act-follow { padding: clamp(72px, 12vh, 140px) clamp(16px, 3.4vw, 48px); }
.follow-wrap { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.4fr); gap: clamp(24px, 4vw, 56px); align-items: start; max-width: 1240px; margin: 0 auto; }
.follow-copy { position: sticky; top: calc(var(--top) + 40px); }
.pipe { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; min-height: 360px; }
.pipe-col { border-radius: 14px; background: rgba(255, 255, 255, .025); border: 1px solid var(--line); padding: 10px; display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.pipe-h { font-size: 13px !important; color: var(--sc-ink-soft) !important; font-weight: 600; padding: 2px 4px 6px; border-bottom: 1px solid var(--line); margin-bottom: 2px !important; }
.card { padding: 11px 12px; border-radius: 10px; background: var(--raise); border: 1px solid var(--line-2); font-size: 13.5px; line-height: 1.35; color: #E7EDF7; }
.card--won { border-color: rgba(52, 211, 153, .55); background: rgba(52, 211, 153, .08); }
html:not(.live) .card[data-until] { display: none; }
.live .card:not(.is-on) { display: none; }
.live .card.is-on { animation: cardIn 420ms var(--sc-ease-out); }
@keyframes cardIn { from { opacity: 0; transform: translateY(6px) scale(.98); } }

/* --------------------------------------------------------- 4 · won work -- */
.stage--pan { padding-left: 0; padding-right: 0; align-items: center; }
.rail { gap: clamp(16px, 2vw, 24px); align-items: stretch; padding: 0 clamp(16px, 3.4vw, 48px); width: max-content; }
.rail-lead { width: min(420px, 78vw); flex: none; align-self: center; }
.trail { display: flex; gap: 14px; list-style: none; margin: 0; padding: 0; counter-reset: none; }
.trail li { width: 250px; flex: none; box-sizing: border-box; padding: 20px; border-radius: 16px; background: var(--sc-surface); border: 1px solid var(--line); display: grid; align-content: start; gap: 8px; transition: opacity 360ms, border-color 360ms, transform 360ms var(--sc-ease-out); position: relative; }
.trail li::after { content: ""; position: absolute; top: 50%; right: -15px; width: 14px; height: 1px; background: var(--line-2); }
.trail li:last-child::after { display: none; }
.trail time { font-size: 13px; color: var(--sc-accent); font-weight: 600; font-variant-numeric: tabular-nums; }
.trail b { font-size: 1.15rem; font-weight: 600; }
.trail span { font-size: 14px; color: var(--sc-ink-soft); line-height: 1.45; }
.trail-win { border-color: rgba(52, 211, 153, .6) !important; background: linear-gradient(180deg, rgba(52, 211, 153, .12), var(--sc-surface)) !important; }
.live .trail li:not(.is-on) { opacity: .28; transform: translateY(8px); }

/* ------------------------------------------------ 5 · needs you (peak) -- */
.stage--decision { place-items: center; transition: background-color 900ms; }
.is-dusk .stage--decision { background: radial-gradient(70% 60% at 50% 48%, rgba(31, 169, 255, .10), transparent 70%), #070E26; }
.dusk { position: absolute; left: clamp(16px, 3.4vw, 48px); bottom: clamp(24px, 6vh, 56px); display: grid; gap: 6px; font-size: 14px; color: var(--sc-ink-soft); transition: opacity 900ms; min-width: 210px; }
.dusk-row { display: flex; justify-content: space-between; gap: 24px; border-bottom: 1px solid var(--line); padding-bottom: 6px; }
.dusk-row b { color: #fff; font-variant-numeric: tabular-nums; }
.is-dusk .dusk { opacity: .32; }
.decide {
  position: relative; z-index: 2; width: min(640px, 100%); box-sizing: border-box; padding: clamp(24px, 3.4vw, 40px);
  border-radius: 22px; background: linear-gradient(180deg, #16244F, #101B40); border: 1px solid rgba(31, 169, 255, .55);
  box-shadow: 0 40px 90px -30px rgba(0, 0, 0, .8), 0 0 0 6px rgba(31, 169, 255, .06);
}
.decide-kicker { font-size: 14px !important; color: var(--sc-accent) !important; font-weight: 600; }
.decide-kicker time { font-variant-numeric: tabular-nums; }
.decide h2 { margin-top: 12px; font-size: clamp(1.55rem, 1.1rem + 1.4vw, 2.3rem); }
.decide-body { margin-top: 12px !important; }
.decide-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 24px; }
.decide-actions .btn:disabled { cursor: default; opacity: .38; }
.decide-actions .btn.is-picked:disabled { opacity: 1; box-shadow: 0 0 0 3px rgba(31, 169, 255, .35); }
.decide-stamp { margin-top: 16px !important; min-height: 1.4em; font-size: 15px !important; color: #7DD3A8 !important; font-weight: 600; }
.decide-foot { position: absolute; right: clamp(16px, 3.4vw, 48px); bottom: clamp(24px, 6vh, 56px); max-width: 34ch !important; text-align: right; font-size: 1rem !important; color: #C3CCDA !important; }

/* ---------------------------------------------------------- 6 · proof -- */
.act-proof { padding: clamp(80px, 13vh, 150px) clamp(16px, 3.4vw, 48px) clamp(56px, 8vh, 96px); border-top: 1px solid var(--line); }
.proof-wrap { max-width: 1240px; margin: 0 auto; display: grid; grid-template-columns: minmax(0, .7fr) minmax(0, 1.3fr); gap: clamp(24px, 4vw, 56px); align-items: start; }
.film { margin: 0; grid-row: span 2; }
.film video { display: block; width: 100%; aspect-ratio: 16 / 10; object-fit: cover; border-radius: 16px; border: 1px solid var(--line-2); background: #0B1022; box-shadow: 0 30px 70px -28px rgba(2, 6, 20, .8); }
.film figcaption { margin-top: 10px; font-size: 13px; color: #8793AB; }
.receipts { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; align-self: end; }
.receipt { padding: 16px; border-radius: 14px; border: 1px solid var(--line); background: rgba(255, 255, 255, .025); display: grid; gap: 6px; }
.receipt strong { font-size: 2rem; font-weight: 600; line-height: 1; font-variant-numeric: tabular-nums; }
.receipt span { font-size: 14px; color: #DDE4EF; line-height: 1.35; }
.receipt small { font-size: 12px; color: #7F8BA3; }
.receipt-note { grid-column: 1 / -1; font-size: 13.5px !important; color: #8793AB !important; }
.receipt-note a { color: #CFE9FF; }

/* --------------------------------------------------------- 7 · phases -- */
.act-phases { padding: clamp(80px, 13vh, 150px) clamp(16px, 3.4vw, 48px); background: linear-gradient(180deg, transparent, rgba(31, 169, 255, .04) 40%, transparent); }
.phases-wrap { max-width: 1240px; margin: 0 auto; }
.phases-copy { max-width: 760px; }
.phases-copy h2 { margin-top: 12px; font-size: clamp(1.9rem, 1.2rem + 2vw, 3rem); }
.phases { list-style: none; margin: 40px 0 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.phases li { padding: 20px; border-radius: 16px; border: 1px solid var(--line-2); background: var(--sc-surface); display: flex; flex-direction: column; gap: 8px; }
.phases li:first-child { border-color: rgba(31, 169, 255, .55); }
.phases small { font-size: 13px; color: var(--sc-accent); font-weight: 600; }
.phases b { font-size: 1.25rem; font-weight: 600; }
.phases p { font-size: 14.5px !important; line-height: 1.5 !important; margin: 0 !important; }
.phases em { margin-top: auto; padding-top: 10px; font-style: normal; font-size: 14px; color: #fff; font-weight: 600; border-top: 1px solid var(--line); }
.phases-cost { margin-top: 22px !important; font-size: 15px !important; max-width: 90ch !important; }
.lanes { margin-top: 44px; display: grid; border-top: 1px solid var(--line); }
.lanes > p { font-size: 13.5px !important; padding: 14px 0 6px; }
.lanes a { display: grid; grid-template-columns: minmax(180px, .5fr) 1fr auto; gap: 18px; align-items: baseline; padding: 16px 4px; border-bottom: 1px solid var(--line); text-decoration: none; transition: background-color 160ms; }
.lanes a::after { content: "→"; color: var(--sc-accent); }
.lanes a:hover { background: rgba(255, 255, 255, .03); }
.lanes b { font-size: 1.05rem; font-weight: 600; }
.lanes span { color: var(--sc-ink-soft); font-size: 15px; }

/* ---------------------------------------------------------- 8 · start -- */
.act-start { padding: clamp(80px, 12vh, 140px) clamp(16px, 3.4vw, 48px) 0; border-top: 1px solid var(--line); background: #08102A; }
.start-wrap { max-width: 1240px; margin: 0 auto; display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: clamp(24px, 4vw, 64px); align-items: start; }
.start-copy h2 { margin-top: 12px; font-size: clamp(1.9rem, 1.2rem + 2vw, 3rem); }
.start-list { margin: 22px 0 0; padding: 0; list-style: none; display: grid; gap: 10px; }
.start-list li { position: relative; padding-left: 26px; color: #DDE4EF; }
.start-list li::before { content: ""; position: absolute; left: 0; top: .5em; width: 12px; height: 7px; border-left: 2px solid var(--sc-accent); border-bottom: 2px solid var(--sc-accent); transform: rotate(-45deg); }
.start-alt { margin-top: 24px !important; font-size: 14.5px !important; }
.start-alt a { color: #CFE9FF; }
.start-panel { border-radius: 20px; border: 1px solid var(--line-2); background: var(--sc-surface); padding: clamp(18px, 2.6vw, 30px); box-shadow: 0 30px 70px -30px rgba(2, 6, 20, .8); }
.audit-form { display: grid; gap: 14px; position: relative; }
.af-group { font-size: 13.5px !important; font-weight: 600; color: var(--sc-accent) !important; margin-top: 4px !important; }
.af-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.af-field { display: grid; gap: 6px; }
.af-field > span { font-size: 13.5px; color: #C3CCDA; }
.af-field em { font-style: normal; color: #7F8BA3; }
.af-field input, .af-field select {
  width: 100%; box-sizing: border-box; height: 46px; padding: 0 12px; border-radius: 10px;
  background: #0A1330; border: 1px solid var(--line-2); color: #fff; font: 500 15.5px var(--sc-font-text);
}
.af-field select { appearance: none; background-image: linear-gradient(45deg, transparent 50%, #A9B4C7 50%), linear-gradient(135deg, #A9B4C7 50%, transparent 50%); background-position: calc(100% - 18px) 20px, calc(100% - 13px) 20px; background-size: 5px 5px; background-repeat: no-repeat; padding-right: 30px; }
.af-field input:focus, .af-field select:focus { border-color: var(--sc-accent); outline: none; box-shadow: 0 0 0 3px rgba(31, 169, 255, .25); }
.af-field .af-invalid, .af-invalid { border-color: #FF7A7A !important; }
.af-submit { width: 100%; margin-top: 6px; min-height: 52px; font-size: 16.5px; }
.af-fine { font-size: 12.5px !important; color: #8793AB !important; }
.audit-assumptions summary { cursor: pointer; font-size: 13px; color: #AEB8CA; }
.audit-assumptions p { margin-top: 8px !important; font-size: 12.5px !important; color: #8793AB !important; }
.af-status { padding: 10px 12px; border-radius: 10px; font-size: 14px; }
.af-status.err { background: rgba(255, 122, 122, .12); color: #FFB4B4; }
.af-status.ok { background: rgba(52, 211, 153, .12); color: #A7F3D0; }
.leak-map { display: grid; gap: 14px; }
.lm-kicker { color: var(--sc-accent) !important; font-weight: 600; font-size: 14px !important; }
.lm-total span { display: block; font-size: 14px; color: var(--sc-ink-soft); }
.lm-total strong { font-size: clamp(2.2rem, 1.5rem + 2vw, 3rem); font-weight: 600; font-variant-numeric: tabular-nums; }
.lm-total em { font-style: normal; font-size: 1rem; color: var(--sc-ink-soft); margin-left: 4px; }
.lm-sub, .lm-fine { font-size: 13.5px !important; }
.lm-bars { display: grid; gap: 12px; }
.lm-bar-h { display: flex; justify-content: space-between; font-size: 14px; }
.lm-track { height: 8px; border-radius: 99px; background: rgba(255, 255, 255, .07); margin-top: 6px; overflow: hidden; }
.lm-track i { display: block; height: 100%; background: var(--sc-accent); border-radius: 99px; }
.lm-fix { padding: 14px; border-radius: 12px; border: 1px solid rgba(31, 169, 255, .4); background: rgba(31, 169, 255, .07); }
.lm-fix span { font-size: 13px; color: var(--sc-accent); font-weight: 600; }
.lm-fix p { margin-top: 4px !important; color: #fff !important; }
.lm-cta { display: flex; flex-wrap: wrap; gap: 10px; }
.lm-cta .button { display: inline-flex; align-items: center; min-height: 46px; padding: 0 18px; border-radius: 10px; font-weight: 600; text-decoration: none; }
.lm-cta .button.primary { background: var(--sc-accent); color: var(--sc-accent-ink); }
.lm-cta .button.secondary { border: 1px solid var(--line-2); color: #fff; }

.cc-foot { max-width: 1240px; margin: clamp(64px, 10vh, 120px) auto 0; padding: 28px 0 36px; border-top: 1px solid var(--line); display: grid; gap: 12px; font-size: 14px; color: #8793AB; }
.cc-foot b { color: #fff; }
.cc-foot nav { display: flex; flex-wrap: wrap; gap: 8px 20px; }
.cc-foot a { color: #AEB8CA; text-decoration: none; }
.cc-foot a:hover { color: #fff; }
.cc-foot-copy { font-size: 13px !important; color: #6F7B93 !important; }

.cc-tabs { display: none; }

/* ------------------------------------------------------------- tablet -- */
@media (max-width: 1100px) {
  .cc-phone { display: none; }
  .tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .phases { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* -------------------------------------------------------------- phone -- */
@media (max-width: 900px) {
  :root { --top: 56px; }
  .cc-side { display: none; }
  .cc-body { margin-left: 0; }
  .cc-top { gap: 10px; padding: 0 12px; }
  .cc-top-brand { display: block; flex: none; }
  .cc-clock { gap: 8px; font-size: 13px; }
  .cc-clock-co { max-width: 11ch; }
  .cc-sample { display: none; }
  .cc-cta { min-height: 38px; padding: 0 12px; font-size: 13.5px; }
  .cc-tabs {
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 70; display: grid; grid-template-columns: repeat(5, 1fr);
    padding: 6px 4px calc(6px + env(safe-area-inset-bottom)); background: rgba(9, 17, 42, .94);
    backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); border-top: 1px solid var(--line);
  }
  .cc-tabs a { position: relative; display: grid; justify-items: center; gap: 4px; padding: 6px 0; min-height: 44px; font-size: 11.5px; color: #AEB8CA; text-decoration: none; }
  .cc-tabs a i { width: 18px; height: 4px; border-radius: 3px; background: rgba(199, 204, 212, .28); margin-top: 4px; }
  .cc-tabs a.is-active { color: #fff; }
  .cc-tabs a.is-active i { background: var(--sc-accent); }
  .cc-tabs .cc-needs { position: absolute; top: 0; right: calc(50% - 30px); height: 17px; min-width: 17px; font-size: 10.5px; }
  body.cc { padding-bottom: calc(64px + env(safe-area-inset-bottom)); }
  body.cc #avery-launcher, body.cc #avery-premium-fallback { bottom: calc(76px + env(safe-area-inset-bottom)) !important; }

  .act-today { min-height: auto; padding: 28px 16px 44px; }
  .today-grid { grid-template-columns: 1fr; gap: 26px; }
  .act-today h1 { font-size: clamp(2rem, 8.4vw, 2.5rem); margin-top: 16px; }
  .today-deck { font-size: 1.02rem !important; }
  .today-actions .btn { width: 100%; }
  .today-actions p { max-width: none; }
  .today-stage { padding: 30px 0 34px; }
  .toast { max-width: 210px; font-size: 12px; }
  .toast--a { right: -4px; top: -6px; }
  .toast--b { left: -4px; bottom: -4px; }
  .board { padding: 14px; }
  .tile strong { font-size: 1.55rem; }

  .stage { padding: calc(var(--top) + 14px) 16px 84px; align-items: start; }
  .panel-grid { grid-template-columns: 1fr; gap: 16px; }
  .act-coming .help p:not(.help-links) { display: none; }
  .act-coming .help h2 { font-size: 1.5rem; }
  .row { grid-template-columns: 42px minmax(0, 1fr); padding: 9px 12px; row-gap: 2px; }
  .row em { grid-column: 2; }
  .row p { white-space: normal; }

  .follow-wrap { grid-template-columns: 1fr; }
  .follow-copy { position: static; }
  .pipe { grid-template-columns: 1fr 1fr; min-height: 0; }

  .stage--pan { padding-left: 0; padding-right: 0; align-items: center; }
  .rail-lead h2 { font-size: 1.55rem; }
  .trail li { width: 230px; }

  .stage--decision { align-items: center; }
  .dusk { display: none; }
  .decide { padding: 22px 18px; }
  .decide-actions .btn { flex: 1 1 100%; }
  .decide-foot { position: static; text-align: left; margin-top: 18px !important; }
  .stage--decision { display: flex; flex-direction: column; justify-content: center; }

  .proof-wrap { grid-template-columns: 1fr; }
  .receipts { grid-template-columns: 1fr 1fr; }
  .phases { grid-template-columns: 1fr; }
  .lanes a { grid-template-columns: 1fr auto; }
  .lanes a span { grid-column: 1; }
  .lanes a::after { grid-row: 1; grid-column: 2; }
  .start-wrap { grid-template-columns: 1fr; }
  .af-row { grid-template-columns: 1fr; }
}
@media (max-width: 380px) {
  .cc-clock-co { display: none; }
}
