:root{color-scheme:light;--ink:#17231f;--muted:#5d6861;--paper:#fbf7ef;--paper-strong:#fffdf8;--line:#dfd7c8;--green:#16443c;--green-soft:#dfe8d8;--rust:#d6512a;--blue:#276070;--gold:#c59843;--shadow:0 24px 80px rgba(28,38,32,0.14)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);background:var(--paper);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}button,input,select,textarea{font:inherit}a{color:inherit;text-decoration:none}main{min-height:100vh}.hero{min-height:92vh;padding:24px clamp(18px,5vw,72px) 48px;background:linear-gradient(90deg,rgba(251,247,239,.96),rgba(251,247,239,.66) 62%,rgba(251,247,239,.2)),url(/assets/pyrenees-route-placeholder.svg) 100% /cover no-repeat}.nav{align-items:center;display:flex;justify-content:space-between;gap:24px;margin:0 auto;max-width:1180px}.brand,.button,.navLinks,.rideTopline span{align-items:center;display:inline-flex}.brand{gap:10px;color:var(--green);font-weight:800}.brand svg{width:28px;height:28px}.navLinks{gap:22px;color:var(--muted);font-size:.95rem;font-weight:700}.heroGrid{align-items:center;display:grid;grid-gap:clamp(32px,6vw,84px);gap:clamp(32px,6vw,84px);grid-template-columns:minmax(0,1.02fr) minmax(320px,.78fr);margin:0 auto;max-width:1180px;min-height:calc(92vh - 78px);padding:42px 0}.heroCopy{max-width:720px}.eyebrow{color:var(--rust);font-size:.78rem;font-weight:900;letter-spacing:.14em;margin:0 0 14px;text-transform:uppercase}h1,h2,h3,p{margin-top:0}h1{font-size:clamp(3rem,8vw,6.4rem);line-height:.94;margin-bottom:26px;max-width:820px}h1,h2{letter-spacing:0}h2{font-size:clamp(2.1rem,5vw,4.2rem);line-height:1;margin-bottom:16px}h3{font-size:1.1rem;letter-spacing:0;margin-bottom:8px}.lede{color:#39453f;font-size:clamp(1.1rem,2vw,1.38rem);line-height:1.55;margin-bottom:32px;max-width:650px}.heroActions{display:flex;flex-wrap:wrap;gap:12px}.button{border:1px solid transparent;border-radius:8px;cursor:pointer;font-weight:850;gap:8px;justify-content:center;min-height:48px;padding:12px 18px}.button svg{height:19px;width:19px}.primary{background:var(--green);color:#fffdf8}.ghost{background:rgba(255,253,248,.78);border-color:rgba(22,68,60,.18);color:var(--green)}.heroMedia{align-self:stretch;display:flex;min-height:440px}.videoPlate{align-items:center;background:linear-gradient(145deg,rgba(22,68,60,.88),rgba(39,96,112,.8)),url(/assets/pyrenees-route-placeholder.svg) 50% /cover;border:1px solid rgba(255,255,255,.3);border-radius:8px;box-shadow:var(--shadow);color:#fffdf8;display:flex;flex:1 1;flex-direction:column;justify-content:center;min-height:360px;overflow:hidden;padding:32px;position:relative}.videoPlate:after{background:linear-gradient(transparent,rgba(0,0,0,.28));content:"";inset:0;position:absolute}.playMark,.videoPlate p{position:relative;z-index:1}.videoPlate p{font-size:1.05rem;font-weight:850;margin:18px 0 0}.playMark{border-bottom:34px solid transparent;border-left:54px solid #fffdf8;border-top:34px solid transparent;filter:drop-shadow(0 12px 20px rgba(0,0,0,.2));height:0;margin-left:14px;width:0}.statsBand{background:var(--green);color:#fffdf8;display:grid;grid-gap:1px;gap:1px;grid-template-columns:repeat(4,1fr)}.statsBand div{padding:clamp(20px,4vw,34px)}.statsBand span,.statsBand strong{display:block}.statsBand strong{font-size:clamp(1.45rem,3vw,2.2rem);line-height:1;margin-bottom:8px}.statsBand span{color:rgba(255,253,248,.76)}.routeSection,.training{padding:clamp(56px,8vw,104px) clamp(18px,5vw,72px)}.sectionHeading{margin:0 auto 28px;max-width:1180px}.routeVisual{margin:0 auto;max-width:1180px}.routeVisual img{aspect-ratio:16/8.2;border:1px solid var(--line);border-radius:8px;box-shadow:var(--shadow);display:block;object-fit:cover;width:100%}.principles{background:#eef1e6;display:grid;grid-gap:1px;gap:1px;grid-template-columns:repeat(3,1fr);padding:1px}.principles>div{background:var(--paper-strong);min-height:220px;padding:clamp(26px,5vw,54px)}.principles svg{color:var(--rust);height:32px;margin-bottom:24px;width:32px}.principles p,.rideItem p{color:var(--muted);line-height:1.55;margin-bottom:0}.training{background:#f8f4eb}.trackerPage{min-height:100vh;padding-top:clamp(18px,5vw,42px)}.trackHeader{align-items:center;display:flex;gap:16px;justify-content:space-between;margin:0 auto 40px;max-width:1180px}.trackHeader .button{min-height:42px}.liveTracker{background:var(--green);border-radius:8px;box-shadow:var(--shadow);color:#fffdf8;margin:0 auto 22px;max-width:1180px;padding:clamp(18px,4vw,30px)}.liveTrackerTop{align-items:flex-start;display:flex;gap:18px;justify-content:space-between;margin-bottom:18px}.liveTracker h2{color:#fffdf8;font-size:clamp(2rem,7vw,4rem);margin-bottom:0}.compactSwitch{background:rgba(255,253,248,.12);flex:0 0 min(260px,45%);margin-bottom:0}.compactSwitch button.active{background:#fffdf8}.trackerMetrics{display:grid;grid-gap:10px;gap:10px;grid-template-columns:repeat(3,1fr)}.trackerMetrics div{background:rgba(255,253,248,.1);border:1px solid rgba(255,253,248,.16);border-radius:8px;min-height:116px;padding:16px}.trackerMetrics svg{height:22px;margin-bottom:18px;width:22px}.trackerMetrics span,.trackerMetrics strong{display:block}.trackerMetrics strong{font-size:clamp(1.32rem,5vw,2.15rem);line-height:1;margin-bottom:6px}.trackerMetrics span{color:rgba(255,253,248,.72);font-size:.9rem;font-weight:800}.gpsStatus{align-items:center;background:rgba(255,253,248,.1);border-radius:8px;display:flex;gap:10px;margin:12px 0;min-height:48px;padding:11px 13px}.gpsStatus svg{height:18px;width:18px}.gpsStatus span{color:rgba(255,253,248,.78);flex:1 1;font-weight:750}.trackSaveStatus{background:rgba(255,253,248,.12);border-radius:8px;color:#fffdf8;font-weight:850;margin:0 0 12px;padding:10px 12px}.trackerControls{display:flex;gap:10px}.startButton{flex:1 1}.trainingGrid{align-items:flex-start;display:grid;grid-gap:22px;gap:22px;grid-template-columns:minmax(280px,.42fr) minmax(0,.58fr);margin:0 auto;max-width:1180px}.buddyStrip,.logPanel,.rideForm{background:var(--paper-strong);border:1px solid var(--line);border-radius:8px;box-shadow:0 16px 54px rgba(28,38,32,.08)}.rideForm{display:grid;grid-gap:16px;gap:16px;padding:22px}.buddyStrip,.combinedProgress,.formHeader,.rideTopline{align-items:center;display:flex;justify-content:space-between;gap:16px}.formHeader h3{margin-bottom:0}.iconButton{align-items:center;background:#f2eadc;border:1px solid var(--line);border-radius:8px;color:var(--green);cursor:pointer;display:inline-flex;height:40px;justify-content:center;width:40px}.iconButton svg{height:18px;width:18px}.iconButton.compact{height:34px;width:34px}.iconButton.compact svg{height:15px;width:15px}button:disabled{cursor:wait;opacity:.68}.dataNotice{align-items:center;background:#f2eadc;border:1px solid var(--line);border-radius:8px;color:var(--muted);display:flex;font-size:.88rem;font-weight:800;gap:8px;min-height:42px;padding:9px 11px}.dataNotice svg{color:var(--blue);flex:0 0 auto;height:17px;width:17px}.dataNotice.supabase{background:var(--green-soft);color:var(--green)}.dataNotice.local{background:#fff3dd;color:#6d5121}.emptyState,.formError{border-radius:8px;font-size:.9rem;line-height:1.45;margin:0;padding:12px}.formError{background:#fae6df;color:#81351e}.emptyState{background:#f3eadb;color:var(--muted)}label{color:#34413b;display:grid;font-size:.88rem;font-weight:800;grid-gap:7px;gap:7px}input,select,textarea{background:#fffefa;border:1px solid #d9cfbf;border-radius:8px;color:var(--ink);min-height:46px;padding:10px 12px;width:100%}textarea{line-height:1.45;resize:vertical}a:focus-visible,button:focus-visible,input:focus,select:focus,textarea:focus{outline:3px solid rgba(214,81,42,.34);outline-offset:2px}.formRow{display:grid;grid-gap:12px;gap:12px;grid-template-columns:1fr 1fr}.submitButton{border:0;width:100%}.logPanel{padding:22px}.riderSwitch{background:#f2eadc;border-radius:8px;display:grid;grid-template-columns:1fr 1fr;margin-bottom:18px;padding:4px}.riderSwitch button{background:transparent;border:0;border-radius:6px;color:var(--muted);cursor:pointer;font-weight:850;min-height:42px}.riderSwitch button.active{background:var(--paper-strong);box-shadow:0 8px 18px rgba(28,38,32,.1);color:var(--green)}.summaryGrid{display:grid;grid-gap:12px;gap:12px;grid-template-columns:repeat(3,1fr);margin-bottom:14px}.summaryGrid div{background:#f7f0e4;border-radius:8px;min-height:118px;padding:16px}.summaryGrid svg{color:var(--blue);height:22px;margin-bottom:18px;width:22px}.summaryGrid span,.summaryGrid strong{display:block}.summaryGrid strong{font-size:clamp(1.25rem,2.4vw,1.8rem);line-height:1.05;margin-bottom:5px}.summaryGrid span{color:var(--muted);font-size:.88rem;font-weight:750}.combinedProgress{background:var(--green-soft);border-radius:8px;margin-bottom:18px;padding:16px}.combinedProgress p{color:var(--muted);font-size:.85rem;font-weight:850;margin-bottom:4px;text-transform:uppercase}.combinedProgress strong{color:var(--green)}.combinedProgress svg{color:var(--rust);height:26px;flex:0 0 auto;width:26px}.rideList{display:grid;grid-gap:12px;gap:12px}.rideItem{border:1px solid var(--line);border-radius:8px;padding:16px}.rideTopline{margin-bottom:10px}.rideActions{align-items:center;display:flex;gap:10px}.rideTopline span{color:var(--muted);gap:8px;font-size:.92rem;font-weight:750}.rideTopline svg{height:16px;width:16px}.rideTopline strong{color:var(--green);font-size:1.2rem}.rideMetrics{color:#6c5d48;display:flex;flex-wrap:wrap;font-size:.9rem;font-weight:800;gap:8px;margin-bottom:10px}.rideMetrics span{background:#f3eadb;border-radius:999px;padding:5px 9px}.buddyStrip{margin:22px auto 0;max-width:1180px;padding:22px}.buddyStrip h3{margin-bottom:0}.buddyRides{display:grid;grid-gap:10px;gap:10px;grid-template-columns:repeat(3,minmax(132px,1fr))}.buddyRides article{background:#f3eadb;border-radius:8px;min-width:132px;padding:13px 14px}.buddyRides span,.buddyRides strong{display:block}.buddyRides span{color:var(--muted);font-size:.86rem;margin-top:4px}@media (max-width:900px){.hero{min-height:auto}.heroGrid,.trainingGrid{grid-template-columns:1fr}.heroMedia{min-height:320px}.principles,.statsBand{grid-template-columns:repeat(2,1fr)}.buddyStrip{align-items:stretch;flex-direction:column}.liveTrackerTop{display:grid}.compactSwitch{flex-basis:auto;width:100%}}@media (max-width:620px){.nav{align-items:flex-start;flex-direction:column}.button,.heroActions,.navLinks{width:100%}.buddyRides,.formRow,.principles,.statsBand,.summaryGrid,.trackerMetrics{grid-template-columns:1fr}.trackHeader,.trackerControls{align-items:stretch;flex-direction:column}.heroMedia{min-height:260px}.routeVisual img{aspect-ratio:1/1}}