:root{font:16px Arial,Helvetica,sans-serif;color:#F4F7F9;background:#18162F;color-scheme:dark;accent-color:#E6007E}
*{box-sizing:border-box}
html,body{max-width:100%;overflow-x:clip}
body{margin:0;min-height:100vh;background:radial-gradient(circle at 95% 0,#282941,transparent 42%),#18162F}
header{border-bottom:1px solid #5E7A86;padding:17px max(18px,calc((100vw - 1080px)/2));display:flex;align-items:center;justify-content:space-between;gap:12px}
.brand-mark{display:inline-flex;align-items:center;gap:9px;text-decoration:none;color:#F4F7F9;min-width:0}
.brand-mark img{width:40px;height:40px;flex:none}
.brand-mark strong{font-size:15px;letter-spacing:.045em}
header nav{display:flex;gap:15px;font-size:14px}
a{color:#F4F7F9}header nav a,footer a{text-decoration:none}
main{max-width:1080px;margin:auto;padding:35px 20px 70px}
.eyebrow{color:#D5DEE3;font-size:13px;letter-spacing:.1em;text-transform:uppercase;font-weight:700}
h1{font-size:clamp(34px,5vw,54px);letter-spacing:-.04em;line-height:1.1;margin:9px 0 14px}
h2{font-size:23px;line-height:1.25;margin:0 0 14px}
h3{font-size:19px;line-height:1.25;margin:0}
p{line-height:1.5;color:#C6D4DC}
.intro{max-width:740px;font-size:18px;margin:0 0 34px}
button,.restore-button{border:0;border-radius:9px;background:#F4F7F9;color:#18162F;padding:12px 15px;font:inherit;font-weight:700;cursor:pointer;line-height:1.3}
button:where(:hover),.restore-button:hover{background:white}
button.secondary,.restore-button{background:#39495F;color:#F4F7F9}
button.secondary:hover,.restore-button:hover{background:#50627A}
button[aria-pressed=true]{box-shadow:inset 0 -3px #E6007E;border-color:#E6007E}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #F4F7F9;outline-offset:3px;box-shadow:0 0 0 6px #E6007E}
.panel,.goal-card{background:#25243C;border:1px solid #53687A;border-radius:18px;padding:22px;min-width:0}
.dashboard-head,.builder-head{display:flex;justify-content:space-between;align-items:center;gap:14px}
.dashboard-head{margin:0 0 16px}.dashboard-head h2{margin:0}
.views,.group-choices,.templates,.actions{display:flex;flex-wrap:wrap;gap:9px}
.views{margin-bottom:18px}.views button,.group-choices button,.templates button{background:#39495F;color:#F4F7F9;font-size:14px}
.templates{margin:15px 0 22px}.templates button{background:#201F38;border:1px solid #6F8894;text-align:left;min-height:56px}
.templates button.selected{border-color:#E6007E;box-shadow:inset 0 -3px #E6007E}
.templates button:disabled{opacity:.7;cursor:default}
.goals{display:grid;gap:15px;margin-bottom:24px}.group-title{font-size:17px;margin:13px 0 0}
.goal-card header{padding:0;border:0;align-items:flex-start}.goal-card header .eyebrow{margin-bottom:7px}
.goal-card h3{overflow-wrap:anywhere}.goal-card .target-date{font-size:14px;margin:8px 0 16px}
.goal-values{display:flex;align-items:flex-end;gap:16px;flex-wrap:wrap;margin:16px 0}
.goal-values strong{font-size:clamp(26px,5vw,38px);line-height:1;color:#F4F7F9}
.goal-values span{font-size:14px;color:#B9CAD3}
.goal-values .value-pair{display:flex;flex-direction:column;gap:6px}
.goal-values .arrow{font-size:24px;color:#B9CAD3;align-self:center}
.goal-bar{height:12px;border-radius:999px;background:#39495F;position:relative;overflow:visible;margin:18px 0 8px}
.goal-fill{height:100%;border-radius:999px;background:#B9CAD3;max-width:100%}
.goal-fill.achieved{background:#E6007E}
.milestone-tick{position:absolute;top:-5px;width:3px;height:22px;background:#F4F7F9}
.goal-path{display:flex;justify-content:space-between;gap:12px;font-size:13px;color:#B9CAD3;margin:0 0 16px}
.goal-path span{min-width:0;overflow-wrap:anywhere}
.goal-dots{display:flex;gap:8px;align-items:center;margin:13px 0 12px;overflow-x:auto;max-width:100%;padding-bottom:8px}
.goal-dots .dot{width:13px;height:13px;border-radius:50%;border:2px solid #B9CAD3;flex:none}
.goal-dots .dot.latest{background:#E6007E;border-color:#E6007E}
.goal-dots .line{width:28px;height:2px;background:#53687A;flex:none}
.goal-history{font-size:14px;color:#D5DEE3;margin:8px 0 0}
.goal-history summary{cursor:pointer;font-weight:700}
.goal-history ol{padding-left:22px}.goal-history li{margin-top:9px;line-height:1.4}
.goal-card .actions{margin-top:17px}.goal-card .actions button,.goal-card .actions a{font-size:14px}
.goal-card .actions a{display:inline-flex;align-items:center;padding:10px 12px}
.result-attempts{display:flex;gap:10px;overflow-x:auto;margin:16px 0}
.result-attempt{border:1px solid #6F8894;border-radius:12px;padding:11px;min-width:100px;text-align:center}
.result-attempt strong{display:block;font-size:22px}.result-attempt small{font-size:12px;color:#B9CAD3}
.result-attempt.met{border-color:#E6007E}
.empty{border:1px dashed #6F8894;border-radius:16px;padding:20px;margin:0;color:#D5DEE3}
.season-link{border-left:3px solid #E6007E}
.season-link strong{font-size:24px;color:#F4F7F9}
.builder{margin-top:18px}.builder-head h2{margin:6px 0 0}.group-choices{margin:22px 0 0}
.goal-form{border-top:1px solid #53687A;padding-top:18px}
.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.form-grid>div{min-width:0}.full{grid-column:1/-1}
label{display:block;font-size:14px;font-weight:700;color:#D5DEE3;margin-bottom:7px}
input,select{display:block;min-height:46px;width:100%;background:#201F38;border:1px solid #6F8894;border-radius:9px;color:#F4F7F9;font:inherit;padding:9px 11px}
input::placeholder{color:#B9CAD3}.form-grid [hidden],section[hidden],form[hidden]{display:none}
.help{font-size:14px;color:#B9CAD3;margin:6px 0 0}.goal-form>.help{margin:14px 0}
.status{font-size:14px;min-height:1.5em;color:#F4F7F9}
.prompt{background:#25243C;border:1px solid #6F8894;border-left:3px solid #E6007E;border-radius:12px;padding:18px;margin:0 0 25px}
.prompt p{margin:7px 0 12px;overflow-wrap:anywhere}.prompt .actions{margin:0}
.data-panel{margin-top:18px}.data-panel p{margin:0 0 14px}.data-panel h2{margin-bottom:8px}
.season-link a{font-weight:700}.future-panel{margin-top:18px}.future-panel p{margin-bottom:0}
.restore-button{display:inline-flex;align-items:center}#restore{position:absolute;width:1px;height:1px;opacity:0;overflow:hidden}
dialog{color:#F4F7F9;background:#25243C;border:1px solid #6F8894;border-radius:16px;width:min(100% - 30px,480px);padding:22px}
dialog::backdrop{background:#0E1021CF}dialog form{display:grid;gap:13px}dialog h2{margin:0 0 4px}dialog .actions{margin-top:5px}
footer{max-width:1080px;margin:auto;padding:0 20px 34px;color:#AEBFC8;font-size:13px}
@media(max-width:620px){main{padding:26px 16px 55px}.panel,.goal-card{padding:18px}.form-grid{grid-template-columns:1fr}.full{grid-column:1}.dashboard-head button{font-size:14px}.goal-values{gap:9px}.group-choices button{flex:1 1 135px}.templates button{flex:1 1 140px}}
@media(max-width:410px){header{padding:14px 15px;flex-wrap:wrap}.brand-mark img{width:34px;height:34px}.brand-mark strong{font-size:14px;letter-spacing:0}header nav{width:100%;gap:16px;font-size:14px}.intro{font-size:16px}}

/* Keep the goals header aligned at narrow widths. */
.dashboard-head{min-height:48px}
.dashboard-head #new-goal{flex:none;align-self:center}
@media(max-width:620px){.dashboard-head{align-items:center;gap:12px}.dashboard-head h2{margin:0;line-height:1.2}.dashboard-head #new-goal{font-size:14px;white-space:nowrap;padding:10px 12px}}
@media(max-width:360px){.dashboard-head{flex-wrap:wrap}.dashboard-head #new-goal{margin-left:auto}}

.preset-intro{font-size:14px;color:#D5DEE3;margin:14px 0 4px}
.outcome-choices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:16px 0}.outcome-choices button{min-height:54px;text-align:left;background:#39495F;color:#F4F7F9;border-bottom:3px solid transparent}.outcome-choices button[aria-pressed=true]{border-bottom-color:#E6007E}.more-goals{margin:12px 0 22px}.more-goals summary{cursor:pointer;color:#D5DEE3;text-decoration:underline;text-underline-offset:3px}.more-goals .group-choices{margin-top:14px}@media(max-width:500px){.outcome-choices{grid-template-columns:1fr}}
.builder-head .eyebrow,.goal-card header .eyebrow{border-left:3px solid #E6007E;padding-left:11px}
.goal-card .strava-button{border:1px solid #E6007E}
.strava-baseline{margin-top:9px;border:1px solid #E6007E;font-size:14px;text-align:left}
.time-picker-toggle{margin-top:8px;background:#39495F;color:#F4F7F9;padding:8px 12px;font-size:14px}
.time-picker{max-width:440px}.time-picker-fields{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.time-picker-fields label{min-width:0}.time-picker-fields select{width:100%}
.data-panel .actions{margin-bottom:0}.data-panel .status:empty{display:none}
@media(max-width:620px){.time-picker-fields{gap:7px}}
/* Keep utilities quiet below the goals. */
.season-link{background:transparent;border:0;border-top:1px solid #5E7A86;border-radius:0;padding:18px 0}.season-link h2{font-size:20px}.season-link p{margin:8px 0}.data-panel{background:transparent;border:0;border-top:1px solid #5E7A86;border-radius:0;padding:18px 0}.data-panel summary{cursor:pointer;font-weight:700}.data-panel[open] summary{margin-bottom:16px}

#update-event-context{min-width:0;overflow-wrap:anywhere}#update-event-context p{margin:0 0 8px}#update-event-context p:empty{display:none}#use-event-note{font-size:14px;padding:8px 12px}.goal-card:focus{outline:3px solid #F4F7F9;outline-offset:3px}

#goalNext{margin:8px 0;overflow-wrap:anywhere}#goalNext a{display:inline-flex;align-items:center;min-height:44px;font-weight:bold}
