:root{
  --blue:#075f94; --blue-dark:#064b78; --sky:#d8edf4; --card:#ffffff; --ink:#13202a;
  --muted:#5b7781; --line:#d5e2e8; --orange:#ffad13; --orange-dark:#f08600;
  --green:#49b34f; --bad:#d92c2c; --good:#77bd00; --paper:#f3fbff;
  --shadow:0 18px 48px rgba(0,0,0,.16); --radius:22px;
}
*{box-sizing:border-box}
html{background:var(--sky)}
body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,"Noto Sans",sans-serif;color:var(--ink);background:linear-gradient(180deg,#b8dce7 0,#e9f6f9 48%,#fff 100%);min-height:100vh}
button,input,select,textarea{font:inherit}
button{border:0;cursor:pointer;-webkit-tap-highlight-color:transparent}
.hidden{display:none!important}.app-shell{max-width:720px;margin:0 auto;padding-bottom:40px}
.mobile-topbar{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:14px;padding:18px 18px calc(16px + env(safe-area-inset-top));background:var(--blue);color:#fff;box-shadow:0 2px 0 rgba(0,0,0,.05)}
.brandmark{width:64px;height:64px;border-radius:15px;background:linear-gradient(145deg,#ffc93d,#f15b00);display:grid;place-items:center;box-shadow:inset 0 0 0 3px #ffe57c,0 5px 0 #b93900;flex:0 0 auto}
.typewriter{font-size:34px;line-height:1;filter:drop-shadow(0 2px 0 rgba(0,0,0,.18))}
.brandcopy{min-width:0}.brandcopy h1{margin:0;font-size:31px;letter-spacing:-.7px;font-weight:850}.brandcopy p{margin:2px 0 0;font-weight:700;opacity:.94;font-size:15px}.hamburger{margin-left:auto;background:transparent;color:#fff;font-size:40px;line-height:1;padding:8px 6px;border-radius:12px}
.hero-card{margin:18px 10px 16px;border-radius:18px;background:var(--blue);color:#fff;padding:24px 18px;box-shadow:var(--shadow);position:relative;overflow:hidden}.hero-card:after{content:"";position:absolute;width:260px;height:150px;border-radius:50%;right:-80px;bottom:-60px;background:rgba(255,255,255,.14)}
.hero-copy h2{font-size:31px;line-height:1.13;margin:0 0 12px;letter-spacing:-.7px}.hero-copy p{font-size:19px;line-height:1.36;margin:0 0 18px;opacity:.96}
.tabs{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;position:relative;z-index:2;margin:12px 0}.tab{border-radius:999px;padding:12px 8px;background:rgba(255,255,255,.14);color:#fff;font-weight:900;font-size:14px}.tab.active{background:#fff;color:var(--blue)}
.context-bar{position:relative;z-index:2;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.26);border-radius:16px;padding:12px;display:flex;gap:10px;align-items:center;justify-content:space-between;margin:12px 0}.context-bar strong{display:block}.context-bar small{display:block;opacity:.9;margin-top:3px;word-break:break-all}.context-bar button{background:#fff;color:var(--blue);border-radius:999px;padding:9px 12px;font-weight:900;white-space:nowrap}
.global-meter{position:relative;z-index:1;margin-top:14px}.meter-label{display:flex;justify-content:space-between;font-weight:850}.meter-track{height:10px;background:rgba(255,255,255,.23);border-radius:999px;margin:8px 0;overflow:hidden}.meter-fill{height:100%;width:0;background:#fff;border-radius:999px;transition:width .2s ease}.global-meter small{opacity:.9}
.ai-card,.saved-card,.race-card,.results-card{margin:0 10px 18px;background:rgba(255,255,255,.96);border-radius:20px;box-shadow:0 10px 28px rgba(0,0,0,.12);border:1px solid rgba(0,0,0,.07)}
.ai-card,.saved-card{padding:18px 14px}.ai-step{display:flex;gap:12px;align-items:flex-start;margin-bottom:12px}.ai-step.small{margin-top:16px}.step-badge{width:34px;height:34px;border-radius:999px;background:var(--orange);color:#fff;font-weight:950;display:grid;place-items:center;box-shadow:0 3px 0 #c46f00;flex:0 0 auto}.ai-step h2{font-size:23px;margin:0 0 4px;color:#285591}.ai-step p{margin:0;color:#607d87;line-height:1.4}
.idea-input{width:100%;min-height:132px;border:3px solid #cde6ef;background:#f7fcff;border-radius:18px;padding:14px;font-size:19px;line-height:1.4;outline:0;resize:vertical}.idea-input:focus{border-color:#72c9ff;box-shadow:0 0 0 4px rgba(62,175,245,.15)}
.example-chips,.quick-options{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}.example-chips button,.chip{border-radius:999px;background:#eef8fc;color:#24536d;border:1px solid #cce1ea;padding:10px 12px;font-weight:850}.chip.selected{background:#075f94;color:#fff;border-color:#075f94}
.ai-actions,.race-top-actions{display:grid;gap:10px;margin-top:12px}.orange-btn,.light-blue-btn{min-height:54px;border-radius:12px;font-weight:950;font-size:18px}.orange-btn{background:linear-gradient(180deg,var(--orange),var(--orange-dark));color:#fff;box-shadow:0 5px 0 #c46f00}.light-blue-btn{background:#e9f7ff;color:#075f94;border:1px solid #b7ddec}
.status-box{margin-top:12px;padding:12px 14px;border-radius:14px;background:#fff8df;border:1px solid #f1da78;color:#604b00;font-weight:800;line-height:1.4}
.menu-group{padding:13px 0;border-top:1px solid #e1edf2}.menu-group h3{margin:0 0 9px;font-size:17px;color:#315d7d}
.preview-content{border:1px solid #d8e8ee;background:#f7fcff;border-radius:16px;padding:14px;line-height:1.45}.preview-content h3{margin:0 0 8px;color:#285591}.preview-content p{margin:6px 0}.preview-content ol{margin:8px 0 0;padding-left:22px}.preview-meta{display:grid;gap:6px;margin:10px 0}.preview-meta div{background:#fff;border:1px solid #e3eef3;border-radius:12px;padding:9px}.preview-meta strong{color:#315d7d}
.resume-box{display:grid;gap:10px;margin:12px 0 16px}.saved-list{display:grid;gap:10px}.saved-item{border:1px solid #e0edf2;background:#fbfdff;border-radius:16px;padding:12px;display:grid;gap:8px}.saved-item h3{margin:0;color:#285591;font-size:18px}.saved-item p{margin:0;color:#607d87;font-size:14px;line-height:1.35}.saved-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}.saved-actions button{border-radius:12px;padding:11px 10px;font-weight:900}.saved-actions .open{background:#075f94;color:#fff}.saved-actions .copy{background:#eef8fc;color:#24536d;border:1px solid #cce1ea}
.race-card{padding:18px 14px;position:relative}.race-setup{margin-bottom:12px}.setup-grid{display:grid;gap:12px}.field span{display:block;margin:0 0 7px;font-weight:850;font-size:14px;letter-spacing:.2px;color:#315d7d}.field input,.field select{width:100%;min-height:48px;border:0;border-radius:13px;background:#fff;color:#123;padding:0 14px;box-shadow:inset 0 0 0 1px rgba(0,0,0,.14);outline:0}.field input:focus,.field select:focus{box-shadow:0 0 0 4px rgba(97,197,255,.25),inset 0 0 0 1px #28a6ef}
.section-title{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:14px 0 12px}.section-title h2{margin:0;font-size:24px;line-height:1.15;color:#285591;letter-spacing:-.4px}.segment-pill{background:#e9f7ff;color:#075f94;border:1px solid #b7ddec;border-radius:999px;padding:7px 10px;font-weight:900;white-space:nowrap}
.race-stage{padding:5px 0 10px}.lane-row{display:grid;grid-template-columns:92px minmax(0,1fr)58px;align-items:center;gap:5px;height:82px}.racer-name{text-align:right;color:#6b969c;font-size:20px;line-height:1.05;font-weight:700}.racer-name strong{display:block}.racer-name span{display:block;font-size:14px;font-weight:850}.road{position:relative;height:62px;overflow:hidden}.road-line{position:absolute;left:0;right:0;top:34px;border-top:4px dashed #efd72d}.finish-mark{position:absolute;right:0;top:6px;font-size:11px;font-weight:950;letter-spacing:.12em;color:#285591;background:#fff6c6;border:1px solid #f0da65;border-radius:999px;padding:4px 7px;z-index:3}.car{position:absolute;left:0;top:14px;font-size:43px;line-height:1;transition:left .18s linear, transform .18s ease;filter:drop-shadow(0 4px 2px rgba(0,0,0,.18));transform:scaleX(-1);transform-origin:center center}.speed{text-align:right;color:#6f9aa0}.speed strong{display:block;font-size:20px}.speed span{font-size:14px}
.target-box{background:var(--paper);border:2px solid #c6d7df;border-radius:22px;padding:16px 12px 14px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.7)}.target-box h3{margin:0 0 12px;font-size:16px;color:#315d7d;font-weight:950;line-height:1.25}.target-text{font-family:"Courier New",ui-monospace,SFMono-Regular,Consolas,monospace;font-size:28px;line-height:1.33;letter-spacing:.4px;white-space:pre-wrap;word-break:break-word;max-height:205px;overflow:auto;padding:2px 0 14px;color:#050505;scroll-behavior:smooth}.target-text.hidden{display:none}.char.good{color:var(--good)}.char.bad{color:#fff;background:var(--bad);border-radius:4px}.char.current{background:#d7f0ff;border-radius:4px;box-shadow:inset 0 -3px 0 #56afe7}.char.done{opacity:.95}textarea#typingInput{width:100%;min-height:82px;margin-top:7px;border-radius:15px;border:5px solid #72c9ff;background:#fff;padding:12px 14px;font-size:22px;line-height:1.3;resize:vertical;outline:0;color:#59666d}textarea#typingInput:focus{box-shadow:0 0 0 4px rgba(62,175,245,.22)}
.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:14px}.stats-grid div{background:#eef8fc;border:1px solid #cde6ef;border-radius:14px;padding:10px 5px;text-align:center}.stats-grid span{display:block;font-size:12px;color:#60838e;font-weight:950;text-transform:uppercase}.stats-grid strong{font-size:20px;color:#0f4f79}.action-row{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:13px}.soft-btn,.danger-btn{min-height:46px;border-radius:12px;font-weight:950}.soft-btn{background:#f4f9fb;color:#24536d;border:1px solid #cee1e8}.danger-btn{background:#fff1f1;color:#b51616;border:1px solid #ffd0d0;padding:0 14px}.hint{color:#657d86;font-size:14px;line-height:1.4;margin:12px 0 0}
.results-card{padding:16px 14px}.results-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.results-head p{margin:0;font-size:12px;color:#71909a;text-transform:uppercase;font-weight:950}.results-head h2{margin:2px 0 0;font-size:20px;color:#204f76}.compact-counter{display:inline-flex;margin:10px 0;background:#eef8fc;border-radius:999px;padding:7px 12px;color:#315d7d;font-weight:950}.results-list{display:grid;gap:8px}.result-item{display:grid;grid-template-columns:1fr auto auto;gap:8px;align-items:center;padding:10px;border:1px solid #e1edf2;border-radius:12px;background:#fbfdfe}.result-item div:first-child span{display:block;color:#7a8b92;font-size:12px;margin-top:3px}.result-item div:not(:first-child){text-align:right}.result-item div:not(:first-child) strong{display:block;color:#174f74}.result-item div:not(:first-child) span{font-size:11px;color:#80929a}.hide-mobile{display:none!important}
.modal{position:fixed;inset:0;background:rgba(0,0,0,.42);display:grid;place-items:center;padding:16px;z-index:50}.modal-card{max-width:560px;width:100%;background:#fff;border-radius:22px;padding:22px;box-shadow:var(--shadow);position:relative}.modal-close{position:absolute;right:12px;top:10px;background:#eef8fc;border-radius:999px;width:36px;height:36px;font-size:24px;color:#24536d}.modal-card h2{margin:0 0 8px;color:#285591}.modal-card p{line-height:1.45}.coach-list{margin:10px 0;padding-left:20px}
@media (min-width:560px){.app-shell{padding:0 12px 48px}.mobile-topbar{border-radius:0 0 18px 18px}.hero-card,.ai-card,.saved-card,.race-card,.results-card{margin-left:0;margin-right:0}.setup-grid,.ai-actions,.race-top-actions,.resume-box{grid-template-columns:1fr 1fr}.target-text{font-size:31px}.hide-mobile{display:block!important}.result-item{grid-template-columns:1fr 70px 82px 70px 70px}.preview-meta{grid-template-columns:1fr 1fr}}
@media (max-width:380px){.brandcopy h1{font-size:27px}.brandmark{width:56px;height:56px}.hero-copy h2{font-size:27px}.hero-copy p{font-size:18px}.tabs{grid-template-columns:1fr}.lane-row{grid-template-columns:74px minmax(0,1fr)48px}.car{font-size:38px}.target-text{font-size:24px}.stats-grid{grid-template-columns:repeat(2,1fr)}}
@media (prefers-reduced-motion:reduce){.car,.meter-fill{transition:none}}