/* Mobile QA: stable snap geometry, readable small screens and comfortable controls. */
:root{color-scheme:dark}
@media(max-width:600px){
  .race-hud{bottom:calc(14px + env(safe-area-inset-bottom,0px));padding:8px 12px 10px;gap:8px 12px}
  .race-hud .hud-current{min-width:125px}
  .race-hud .hud-next{min-height:38px}
  .race-hud .motion-toggle{min-width:38px;min-height:38px;justify-content:center;padding:0 0 0 10px}
  .race-hud .hud-checkpoints{padding-top:6px;gap:5px}
  .race-hud .hud-checkpoints a{height:44px;min-width:0;width:auto;font-size:18px}
  .checkpoint-list{display:flex;max-width:100%;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;scrollbar-width:thin;scrollbar-color:#476aff #05243c;gap:16px;padding-bottom:7px;grid-column:1/-1;min-width:0}
  .checkpoint-list .checkpoint-link{flex:0 0 160px;scroll-snap-align:start;scroll-snap-stop:always;padding:13px 0;min-height:69px}
  .checkpoint-list .checkpoint-link small{font-size:9px;line-height:1.6}
  .project-heading>p:not(.eyebrow){font-size:14px;line-height:1.75;margin:0 0 16px}
  .project-heading>.eyebrow{font-size:9px;letter-spacing:1px;margin:0}
  .thesis .project-heading h2{font-size:40px;line-height:1.04;margin:17px 0 20px}
  .project-heading .project-name{font-size:16px!important;margin:0 0 20px}
  .project-facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:10px;padding-top:18px}
  .project-facts strong{font-size:18px;line-height:1.15;overflow-wrap:normal}
  .project-facts span{font-size:8px;line-height:1.6}
  .project-facts div{gap:7px;min-width:0}
  .leadership-case .result-line{display:block}
  .leadership-case .result-line strong{font-size:78px}
  .leadership-case .result-line p{font-size:11px;line-height:1.7;margin:12px 0 0;max-width:240px}
  .leadership-case .result-line p br{display:none}
  .leadership-case .result-line p br:after{content:' '}
  .personal-intro>.personal-copy>p:not(.eyebrow){margin:0 0 15px}
  .personal-intro>.personal-copy h2{font-size:42px;line-height:1.04;margin:17px 0 22px}
  .personal-intro>.personal-copy .personal-scroll{margin-top:12px}
  .thesis>.project-heading,.thesis>.research-console,.story>.section-heading,.story>.story-list,.leadership-inner>div:first-child,.leadership-case,.athena-story,.education>div:first-child,.scroll-timeline li,.personal-intro>.personal-copy,.personal-intro>.personal-photo,.person.personal-story>.personal-lap,.finish.snap-scene{padding-bottom:calc(150px + env(safe-area-inset-bottom,0px))}
  .finish-actions .text-link{display:inline-flex;align-items:center;min-height:44px}
  footer{padding-bottom:calc(160px + env(safe-area-inset-bottom,0px))}
}
@media(max-width:360px){
  .thesis .project-heading h2{font-size:36px}
  .project-facts strong{font-size:16px}
  .project-heading>p:not(.eyebrow){font-size:14px}
  .personal-intro>.personal-copy h2{font-size:39px}
  .race-hud .hud-current{min-width:110px}
  .leadership-case .result-line strong{font-size:72px}
  .checkpoint-list .checkpoint-link{flex-basis:150px}
}
@media(max-width:600px){
  .story-list summary{gap:12px}
  .story-list summary>.number{flex:0 0 13px}
  .story-list summary>span:nth-child(2){flex:1;min-width:0}
  .story-list summary small{letter-spacing:.8px}
  .story-list summary .plus{display:flex;align-items:center;justify-content:center;flex:0 0 24px;width:24px;height:24px;margin-left:0;margin-right:6px;line-height:1;font-size:24px}
}
@media(max-width:360px){.race-hud{width:calc(100% - 12px);padding-left:8px;padding-right:8px}.race-hud .hud-checkpoints{gap:2px}}

/* The starting lights are the primary control, with one generous hit area. */
.hero .race-start-button{display:grid;grid-template-columns:1fr 44px;gap:18px 20px;width:min(100%,360px);margin-top:27px;padding:22px 24px 19px;border:2px solid #476aff;border-bottom:4px solid #1044ff;background:linear-gradient(135deg,#102c48,#051d32);color:#f4f7ff;text-align:left;cursor:pointer;box-shadow:0 8px 25px #0003;transition:transform .2s,border-color .2s,box-shadow .2s}
.hero .race-start-button .light-rig{grid-column:1/-1;display:flex;justify-content:space-between;gap:12px;padding:0;background:none;border:0}
.hero .race-start-button .light-rig i{display:block;flex:0 1 43px;width:43px;height:auto;aspect-ratio:1;border-radius:50%;border:2px solid #ff8b96;background:radial-gradient(circle at 35% 30%,#ff6470,#e3223a 55%,#a70c25);box-shadow:0 0 16px #e3223a65,inset 0 0 0 4px #00132233;animation:none}
.hero .race-start-button .race-start-label{color:#f4f7ff;font-size:inherit;letter-spacing:0}
.race-start-label strong{display:block;font:700 28px/1.1 'Racing',Impact,sans-serif;text-transform:uppercase}
.race-start-label small{display:block;margin-top:7px;font-size:8px;line-height:1.5;letter-spacing:1.2px;color:#b8c9e1}
.hero .race-start-button .race-start-arrow{display:grid;place-items:center;align-self:center;width:44px;height:44px;background:#1044ff;color:white;font-size:25px;letter-spacing:0}
.hero .race-start-button:hover{transform:translateY(-3px);border-color:#829bff;box-shadow:0 10px 32px #1044ff30}
.hero .race-start-button:hover .light-rig i{box-shadow:0 0 25px #e3223aa0,inset 0 0 0 4px #00132233}
.hero .race-start-button:active{transform:translateY(1px)}
.hero .race-start-button:focus-visible{outline:3px solid #ffcc00;outline-offset:5px}
.hero .race-start-button+.actions{margin-top:17px}
@media(max-width:600px){.hero .race-start-button{width:100%;max-width:360px;padding:20px;gap:16px;margin-top:23px}.hero .race-start-button .light-rig{gap:10px}.hero .race-start-button .light-rig i{flex-basis:40px;max-width:40px}.race-start-label strong{font-size:27px}.race-start-label small{font-size:7px;letter-spacing:.9px}}
@media(max-width:360px){.hero .race-start-button{padding:17px;gap:15px 10px;grid-template-columns:1fr 40px}.hero .race-start-button .light-rig i{flex-basis:35px;max-width:35px}.hero .race-start-button .race-start-arrow{width:40px;height:40px}.race-start-label strong{font-size:22px}}
@media(prefers-reduced-motion:reduce){.hero .race-start-button{transition:none}.hero .race-start-button:hover{transform:none}}
