/* Idea clinic: sits on the shared site system (assets/site.css). Only clinic parts live here. */
.clinic{ max-width:1180px; margin:0 auto; padding:calc(var(--top-h) + clamp(48px, 10vh, 120px)) max(var(--gutter), var(--sar)) 96px max(var(--gutter), var(--sal)); }
.clinic p{ color:var(--muted); }
.clinic h1{ font-size:clamp(30px, 1.1rem + 2.6vw, 56px); font-weight:300; line-height:1.08; letter-spacing:-.025em; margin:20px 0 22px; max-width:20ch; color:var(--ink); }
.clinic h2{ font-size:22px; font-weight:300; }
.eyebrow{ font-size:11px; font-weight:500; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); }
.intro-copy{ font-size:clamp(18px, 1rem + .4vw, 21px); font-weight:300; max-width:44ch; margin-bottom:36px; }
.panel{ border-top:1px solid var(--line); padding:28px 0; margin-bottom:22px; }
[hidden]{ display:none !important; }

/* controls */
.clinic label{ display:block; font-size:13px; margin:20px 0 8px; color:var(--muted); }
.clinic textarea{ font:inherit; display:block; width:100%; border:0; border-bottom:1px solid var(--line-hi); background:transparent; color:var(--ink); padding:12px 0; resize:vertical; font-size:18px; font-weight:300; }
.clinic textarea:focus-visible{ outline:none; border-color:var(--accent); }
.clinic button{ font:500 14px/1.4 'Inter', system-ui, sans-serif; min-height:44px; padding:10px 20px; border:1px solid var(--ink); border-radius:999px; background:var(--ink); color:var(--bg); cursor:pointer; transition:background .2s ease, color .2s ease, border-color .2s ease; }
.clinic button:hover{ background:var(--accent); border-color:var(--accent); }
.clinic button.secondary{ background:transparent; color:var(--ink); border-color:var(--line-hi); }
.clinic button.secondary:hover{ border-color:var(--ink); }
.clinic button.text{ background:transparent; color:var(--muted); border:0; padding:8px 0; border-radius:0; }
.clinic button.text:hover{ color:var(--ink); }
.clinic button:disabled{ opacity:.4; cursor:default; }
small, .small{ display:block; color:var(--muted); font-size:13px; }
.step-row, .actions{ display:flex; justify-content:space-between; align-items:center; gap:12px; flex-wrap:wrap; }
.actions{ margin-top:24px; justify-content:flex-start; }
progress{ appearance:none; width:100%; height:2px; border:0; background:var(--line); margin:12px 0 4px; accent-color:var(--accent); }
progress::-webkit-progress-bar{ background:var(--line); }
progress::-webkit-progress-value{ background:var(--accent); transition:width .4s var(--ease); }
progress::-moz-progress-bar{ background:var(--accent); }
#status{ font-size:13px; min-height:1.6em; color:var(--muted); }

/* intro */
.hero-actions{ margin:0 0 14px; }
.privacy{ margin:0 0 72px; }
.steps{ list-style:none; display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:24px; border-top:1px solid var(--line); padding-top:20px; }
.steps li{ color:var(--muted); font-size:15px; }
.steps span{ display:block; font-size:11px; letter-spacing:.1em; color:var(--muted); margin-bottom:10px; }
.steps strong{ display:block; font-weight:500; margin-bottom:2px; }
.resume{ border-top-color:var(--accent); }
.resume-idea{ color:var(--ink) !important; font-size:20px; font-weight:300; margin:10px 0 0; }

/* interview */
.destination{ font-size:12px; color:var(--muted); margin:14px 0 22px; }
.destination.big{ color:var(--accent); }
.conversation-grid{ display:grid; grid-template-columns:minmax(0,1.5fr) minmax(0,1fr); gap:clamp(24px, 4vw, 64px); align-items:start; }
.conversation{ border-top:0; padding-top:8px; }
.conversation h1{ font-size:clamp(28px, 1rem + 2vw, 44px); margin-top:12px; }
.conversation .actions{ justify-content:space-between; }
.kbd-hint{ opacity:.75; }
.unknown{ font-size:13px; margin-top:10px; text-decoration:underline; text-underline-offset:3px; }
.thought-card{ display:block; margin:24px 0 0; padding:4px 0 4px 24px; border-left:1px solid var(--line-hi); }
.thought-card blockquote{ font-size:clamp(20px, 1rem + .9vw, 26px); font-weight:300; line-height:1.35; letter-spacing:-.01em; margin:0 0 14px; color:var(--ink); }
.thought-card figcaption{ display:block; margin:0; font-size:13px; color:var(--muted); }
.thought-card.enter blockquote, .thought-card.enter figcaption{ animation:arrive .6s var(--ease) both; }
.thought-card.enter figcaption{ animation-delay:.15s; }
@keyframes arrive{ from{ opacity:0; transform:translateY(8px); } to{ opacity:1; transform:none; } }

/* choices: most questions are a single tap */
.choices{ display:grid; gap:0; margin:22px 0 4px; border-top:1px solid var(--line); }
.clinic .choice{ display:flex; align-items:center; gap:14px; width:100%; text-align:left; background:transparent; color:var(--ink); border:0; border-bottom:1px solid var(--line); border-radius:0; font-weight:400; font-size:16px; padding:16px 4px; min-height:56px; }
.clinic .choice:hover{ background:rgba(255,255,255,.03); color:var(--ink); border-color:var(--line); }
.clinic .choice[aria-pressed=true]{ color:var(--accent); }
.choice[aria-pressed=true]::after{ content:'✓'; margin-left:auto; color:var(--accent); }
.key{ display:inline-grid; place-items:center; width:24px; height:24px; flex:none; border:1px solid var(--line-hi); border-radius:6px; font-size:11px; color:var(--muted); }
.choice[aria-pressed=true] .key{ border-color:var(--accent); color:var(--accent); }

/* review */
.narrow{ max-width:760px; }
.route-note{ font-size:16px; }
.route-note.big{ color:var(--accent) !important; }
.summary{ padding:0; }
.summary-row{ display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 0; border-bottom:1px solid var(--line); }
.summary-q{ font-size:13px; margin:0; }
.summary-a{ color:var(--ink) !important; margin:2px 0 0; overflow-wrap:anywhere; }
.clinic .change{ color:var(--accent); flex:none; }
.field-title{ font-size:11px !important; letter-spacing:.1em; text-transform:uppercase; margin-top:0 !important; }

/* handoff */
.handoff-grid{ display:grid; grid-template-columns:minmax(0,1.6fr) minmax(0,1fr); gap:clamp(24px, 4vw, 56px); align-items:start; }
#prompt{ font:13px/1.6 ui-monospace, SFMono-Regular, Menlo, monospace; min-height:440px; color:#C4C5C1; background:var(--stage); border:0; border-radius:6px; padding:18px 20px; }
.open-in{ display:flex; gap:18px; flex-wrap:wrap; align-items:center; font-size:14px; margin:18px 0 0; }
.open-in a{ color:var(--ink); border-bottom:1px solid var(--line-hi); }
.open-in a:hover{ color:var(--accent); border-color:var(--accent); }
.handoff-grid small{ margin-top:16px; }
.how{ padding-left:20px; margin:16px 0 0; }
.how li{ margin:0 0 12px; color:var(--muted); font-size:15px; }
.how li::marker{ color:var(--muted); }
.thought-rule{ border-top:1px solid var(--line); margin:20px 0 14px; }
.inline-confirm{ display:flex; align-items:center; gap:12px; flex-wrap:wrap; border-top:1px solid var(--accent); padding:12px 0; margin:12px 0; color:var(--ink); font-size:14px; }
.inline-confirm span{ flex:1 1 220px; }
.inline-confirm button{ min-height:40px !important; padding:8px 14px !important; }

@media (max-width:760px){
  .handoff-grid, .steps, .conversation-grid{ grid-template-columns:1fr; }
  .privacy{ margin-bottom:40px; }
  .thought-card{ margin-top:8px; padding-left:16px; }
  .kbd-hint, .key{ display:none; }
  #prompt{ min-height:320px; }
}
@media (prefers-reduced-motion: reduce){ .thought-card.enter blockquote, .thought-card.enter figcaption{ animation:none; } }