.sample-section{padding:110px 0;background:#171526;color:#fff}.sample-intro{text-align:center;max-width:820px;margin:0 auto 52px}.sample-intro .eyebrow{color:#d1c1f1}.sample-intro h2{font-size:clamp(48px,6vw,82px)}.sample-intro .lede{margin:24px auto}.pip-cue{display:inline-block;padding:9px 16px;border:1px solid #77708d;border-radius:999px;font-family:Georgia,serif}.sample{background:var(--cream);color:var(--ink);border:2px solid var(--ink);border-radius:30px;overflow:hidden;box-shadow:10px 10px 0 var(--lilac)}.sample-progress{display:flex;justify-content:space-between;align-items:center;padding:18px 26px;border-bottom:1px solid var(--line);font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.1em}.sample-progress div{display:flex;gap:6px}.sample-progress i{width:38px;height:5px;border-radius:5px;background:#d8d1c8}.sample-progress i.active{background:var(--orange)}.sample-layout{display:grid;grid-template-columns:1.1fr .9fr;min-height:660px}.sample-visual{padding:24px;background:#dcd2f3;border-right:1px solid var(--line)}.visual-caption{min-height:52px;font-size:14px;font-weight:700}.sample svg{width:100%;height:auto;background:#211d37;border-radius:22px;color:#fff;font:700 15px Arial}.star-glow{fill:#f0b84f;opacity:.22}.star{fill:#ffd66b;stroke:#fff1b7;stroke-width:2}.planet{fill:#181725;stroke:#fff;stroke-width:2}.axis{stroke:#8f89a2;stroke-width:1}.trace{fill:none;stroke:#ff8b6f;stroke-width:4}.trace.alt{stroke:#b9a5e9;stroke-dasharray:8 5}.cursor{stroke:#fff;stroke-width:1;stroke-dasharray:4 4}.tick,.axis-label{font-size:11px;fill:#c9c4d4}.position-controls{padding:18px 5px}.position-controls label{font-size:13px;font-weight:800}.position-controls input{width:100%;accent-color:var(--orange);min-height:44px}.position-controls>div,.visual-actions{display:flex;gap:8px;flex-wrap:wrap}.sample button{min-height:44px;border:1.5px solid var(--ink);border-radius:12px;background:#fff;padding:10px 14px;font-weight:800;cursor:pointer}.sample button:hover,.sample button:focus-visible{background:#eee6ff}.sample button:disabled{opacity:.45;cursor:default}.sample-copy{padding:34px;display:flex;flex-direction:column}.sample-copy p{margin-top:0}.sample-copy fieldset{border:0;padding:0;margin:20px 0}.sample-copy legend{font-family:Georgia,serif;font-size:27px;line-height:1.15;font-weight:700;margin-bottom:20px}.answer{display:block;width:100%;text-align:left;margin:9px 0}.answer.selected{background:#ded2f5;box-shadow:inset 0 0 0 2px #6d579a}.answer.correct{background:#cfe6c5}.answer.incorrect{background:#f5c8bc}.sample-feedback{min-height:90px;padding:16px;border-radius:14px;background:#ede8df;font-size:15px}.sample-feedback:empty{background:transparent}.sample-nav{display:flex;gap:10px;margin-top:auto;padding-top:24px}.sample-nav #check,.sample-nav #continue{margin-left:auto;background:var(--orange);color:#fff}.model-note{padding:20px 26px;border-top:1px solid var(--line);font-size:14px}.model-note summary{font-family:Arial,sans-serif;font-size:14px}.sources a{text-decoration:underline}.finish-list{font-family:Georgia,serif;font-size:22px}.reflection{padding:18px;background:#ded2f5;border-radius:16px}@media(max-width:820px){.sample-section{padding:75px 0}.sample-layout{grid-template-columns:1fr}.sample-visual{border-right:0;border-bottom:1px solid var(--line);padding:16px}.sample-copy{padding:24px;min-height:590px}.sample svg{min-height:250px}.sample-copy legend{font-size:24px}.sample-progress{padding:15px 18px}}@media(max-width:350px){.sample-copy{padding:18px}.sample-visual{padding:10px}.sample button{padding:9px}.sample-progress i{width:25px}}

.sample svg text{fill:#fff}.sample svg .tick,.sample svg .axis-label{fill:#d8d3e1}

/* Polished experiment layout: let content define the card height and keep both
   columns aligned without leaving an empty lower half. */
.sample-layout{grid-template-columns:minmax(0,1.06fr) minmax(340px,.94fr);min-height:0;align-items:start}
.sample-visual{min-width:0;padding:26px}
.visual-caption{display:flex;align-items:center;min-height:46px;margin-bottom:12px;line-height:1.35}
.sample svg{display:block;border:1px solid rgba(255,255,255,.13);box-shadow:0 12px 28px rgba(33,29,55,.14)}
.trace{stroke-linecap:round;stroke-linejoin:round}.trace.third{stroke:#72c8cb;stroke-dasharray:2 6}
.position-controls{padding:18px 5px 4px}.position-controls label{display:block;margin-bottom:4px}.position-controls>div button{flex:1}.visual-actions{padding-top:10px}
.sample button:focus-visible,.position-controls input:focus-visible{outline:3px solid #7053a4;outline-offset:3px}
.sample-copy{min-width:0}.sample-copy fieldset{margin-bottom:12px}.sample-feedback{min-height:0}.sample-feedback:empty{display:none}.sample-nav{margin-top:0;padding-top:18px}
.transit-key{display:flex;align-items:center;gap:16px;margin:0 0 10px;padding:9px 12px;border:1px solid rgba(31,28,26,.18);border-radius:12px;background:rgba(248,245,237,.7);font-size:12px;font-weight:800}.transit-key span{display:flex;align-items:center;gap:6px}.transit-key i{display:inline-block;width:13px;height:13px;border-radius:50%}.key-star{background:#ffd66b;border:1px solid #7b5a18}.key-planet{background:#211d37;border:1px solid #fff}.transit-key strong{margin-left:auto}.transit-key output{font-variant-numeric:tabular-nums;color:var(--orange)}
@media(max-width:820px){.sample-layout{grid-template-columns:1fr}.sample-copy{min-height:0}.sample svg{min-height:0}.transit-key{font-size:13px;gap:10px;flex-wrap:wrap}.transit-key strong{width:100%;margin-left:0;padding-top:7px;border-top:1px solid var(--line)}.sample svg .model-view-label,.sample svg .light-measured-label,.sample svg .axis-label,.sample svg .object-label,.sample svg .reading-kicker,.sample svg .reading-value{display:none}}
