/* Combined entry: one shared band, equal answers, always-visible tap arrows.
   All colors and fonts use the original tokens. Original styles stay untouched. */
.start-choice { color:var(--cream); font-family:var(--sans); min-width:0; }
.start-context { max-width:680px; margin:0; font-size:16px; line-height:1.5; color:var(--muted); }
.start-context b { color:var(--cream); font-weight:500; }
.start-question { margin:12px 0 24px; font-family:var(--serif); font-size:clamp(38px,4.5vw,64px); font-weight:400; line-height:1.04; letter-spacing:-.035em; }
.start-answers { position:relative; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); border-bottom:1px solid var(--line); }
.start-answers::before { content:''; position:absolute; inset:0 0 auto; height:2px; background:var(--orange); transform-origin:left; animation:start-draw .9s var(--motion-ease) .15s backwards; z-index:2; }
.start-answer { position:relative; isolation:isolate; display:grid; grid-template-columns:minmax(0,1fr) 48px; grid-template-rows:44px auto 1fr; gap:12px 20px; min-width:0; margin:0; padding:24px 32px 28px; border:0; border-radius:0; background:transparent; color:var(--cream); font:inherit; text-align:left; text-decoration:none; cursor:pointer; animation:start-rise .7s var(--motion-ease) .25s backwards; }
.start-answer[data-answer=me] { border-left:1px solid var(--line); }
.start-answer::before { content:''; position:absolute; inset:0; z-index:-1; background:var(--panel); transform:scaleY(0); transform-origin:bottom; transition:transform .5s var(--motion-ease); }
.start-answer:hover::before,.start-answer:focus-visible::before { transform:scaleY(1); }
.start-answer:focus-visible { outline:3px solid var(--orange); outline-offset:-3px; }
.start-title { grid-column:1/-1; display:block; font-family:var(--serif); font-size:clamp(28px,2.7vw,38px); font-weight:400; line-height:1.08; letter-spacing:-.025em; }
.start-sub { grid-column:1/-1; display:block; max-width:45ch; font-size:16px; line-height:1.5; color:var(--muted); }
.start-go { grid-column:2; grid-row:1; display:grid; place-items:center; width:46px; height:46px; border:1px solid var(--orange); border-radius:50%; background:var(--orange); color:var(--ink); font-size:24px; line-height:1; transition:transform .25s var(--motion-ease),background .25s var(--motion-ease); }
.start-answer:hover .start-go,.start-answer:focus-visible .start-go { transform:translateX(3px); background:var(--orange-hover); }
.start-or { position:absolute; left:50%; top:50%; z-index:3; display:grid; place-items:center; width:34px; height:34px; margin:-17px 0 0 -17px; border:1px solid var(--line); border-radius:50%; background:var(--bg); font-family:var(--serif); font-style:italic; font-size:17px; line-height:1; color:var(--muted); pointer-events:none; animation:start-pop .5s var(--motion-ease) .55s backwards; }
.start-note { margin:10px 0 0; font-size:13px; line-height:1.5; color:var(--muted); }
/* Small marks that say what each answer is: a page for the guide, six bars for the six questions.
   Both fill orange on hover, one piece at a time. */
.start-mark{display:flex;align-items:center;height:40px}
.start-mark i{display:block;border-radius:2px;transition:background .25s var(--motion-ease),border-color .25s var(--motion-ease)}
.start-mark-guide i{position:relative;overflow:hidden;width:30px;height:38px;border:1.5px solid var(--cream);background:linear-gradient(var(--muted),var(--muted)) 5px 8px/15px 2px no-repeat,linear-gradient(var(--muted),var(--muted)) 5px 14px/15px 2px no-repeat,linear-gradient(var(--muted),var(--muted)) 5px 20px/9px 2px no-repeat}
.start-mark-guide i::after{content:'';position:absolute;left:0;right:0;bottom:0;height:0;background:var(--orange);transition:height .5s var(--motion-ease)}
.start-answer:hover .start-mark-guide i::after,.start-answer:focus-visible .start-mark-guide i::after{height:100%}
.start-mark-quiz{gap:5px}
.start-mark-quiz i{box-sizing:border-box;width:16px;height:7px;border:1.5px solid var(--cream);background:transparent}
.start-mark-quiz i:nth-child(2){transition-delay:.05s}.start-mark-quiz i:nth-child(3){transition-delay:.1s}.start-mark-quiz i:nth-child(4){transition-delay:.15s}.start-mark-quiz i:nth-child(5){transition-delay:.2s}.start-mark-quiz i:nth-child(6){transition-delay:.25s}
.start-answer:hover .start-mark-quiz i,.start-answer:focus-visible .start-mark-quiz i{background:var(--orange);border-color:var(--orange)}

@keyframes start-draw{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes start-rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes start-pop{from{opacity:0;transform:scale(.6)}to{opacity:1;transform:none}}


/* Compact identity and uncropped collage above the full-width band. */
.hero.choice-hero { grid-template-columns:minmax(0,1fr) 320px; gap:24px 64px; padding-top:24px; }
.choice-hero h1 { display:flex; align-items:center; gap:18px; margin:0 0 14px; font-size:58px; white-space:nowrap; }
.choice-hero .hero-wordmark { width:180px; height:auto; margin:0; }
.choice-hero .hero-lead { max-width:660px; font-size:20px; line-height:1.5; }
.choice-hero .hero-figure { width:100%; margin:0; }
.choice-hero .hero-figure img { width:270px; margin:auto; }
.choice-hero .hero-figure figcaption { margin-top:8px; font-size:12px; }
.choice-hero .start-choice { grid-column:1/-1; }
.site-header .button-small,.start-subscribe { background:transparent; border:1px solid var(--line); color:var(--muted); }
.site-header .button-small:hover,.start-subscribe:hover { background:var(--panel); border-color:var(--muted); color:var(--cream); transform:none; }
.start-subscribe { display:inline-flex; align-items:center; justify-content:center; min-height:44px; padding:10px 18px; border-radius:999px; font-size:14px; line-height:1.4; letter-spacing:0; text-decoration:none; }

/* /you: reuse #skip directly; retain the dial geometry for enterChat(). */
body.choice-entry[data-stage=intro] { height:auto; overflow:auto; }
.choice-entry #intro { display:block; width:min(1232px,calc(100% - 96px)); max-width:none; height:auto; min-height:100dvh; padding:0 0 40px; }
.choice-entry .mast { min-height:104px; padding:20px 0; flex-wrap:nowrap; }
.choice-entry .mast .start-subscribe { margin-left:auto; }
.choice-entry #intro > .start-choice { padding-top:clamp(48px,16vh,150px); }
.choice-entry #stage { position:absolute; top:0; left:0; width:220px; height:220px; padding:0; visibility:hidden; pointer-events:none; overflow:hidden; contain:strict; }
.choice-entry #dial-wrap { width:220px; height:220px; }
.choice-entry[data-stage=intro] #intro { opacity:1 !important; }
.choice-entry[data-stage=intro] .mast .pdf-control,
.choice-entry[data-stage=intro] #pdf-exit,
.choice-entry[data-stage=leaving] #pdf-exit { display:none; }
.choice-entry[data-stage=leaving] #intro { width:100%; padding-inline:max(48px,calc((100vw - 1232px)/2)); }

@media (max-width:1100px) {
  .hero.choice-hero { grid-template-columns:minmax(0,1fr) 260px; column-gap:24px; }
  .choice-entry #intro { width:calc(100% - 64px); }
}
@media (max-width:760px) {
  .nav-row { height:76px; }
  .hero.choice-hero { grid-template-columns:minmax(0,1fr); padding-top:14px; row-gap:20px; }
  .choice-hero h1 { font-size:36px; gap:12px; margin:0 0 8px; }
  .choice-hero .hero-wordmark { width:112px; }
  .choice-hero .hero-lead { font-size:16px; line-height:1.5; }
  .choice-hero .hero-figure { grid-row:2; width:min(100%,220px); margin:0 auto; }
  .choice-hero .hero-figure img { width:100%; }
  .choice-hero .hero-figure figcaption { display:none; }
  .start-context { font-size:14px; line-height:1.5; }
  .start-question { font-size:38px; margin:10px 0 18px; max-width:15ch; }
  .start-answers { grid-template-columns:minmax(0,1fr); grid-auto-rows:1fr; }
  .start-answer { padding:14px 6px 18px; grid-template-rows:44px auto 1fr; gap:7px 12px; }
  .start-answer[data-answer=me] { border-left:0; border-top:1px solid var(--line); }
  .start-title { font-size:27px; }
  .start-sub { font-size:14px; line-height:1.45; max-width:none; }
  .start-go { width:44px; height:44px; }
  .start-or { width:28px; height:28px; margin:-14px 0 0 -14px; font-size:14px; }
  .start-note { margin-top:8px; font-size:12px; }
  .choice-entry #intro { width:calc(100% - 40px); padding-bottom:28px; }
  .choice-entry .mast { min-height:76px; padding:12px 0; gap:12px; }
  .choice-entry .mast > span { font-size:9px; letter-spacing:.04em; white-space:nowrap; }
  .choice-entry .mast img { width:65px; height:auto; }
  .choice-entry .start-subscribe { padding-inline:13px; }
  .choice-entry #intro > .start-choice { padding-top:36px; }
  .choice-entry[data-stage=leaving] #intro { padding-inline:20px; }
}
@media (prefers-reduced-motion:reduce) {
  .start-answers::before,.start-answer,.start-or { animation:none; }
  .start-answer::before,.start-go,.start-mark i,.start-mark-guide i::after { transition:none; }
  .start-answer:hover .start-go,.start-answer:focus-visible .start-go { transform:none; }
}

/* Keep the compact phone masthead on one line. */
@media (max-width:760px) {
  .choice-entry .mast { gap:8px; }
  .choice-entry .mast img { width:56px; }
  .choice-entry .start-subscribe { padding-inline:10px; font-size:12px; }
}