:root{--ink: #ffffff;--ink-soft: rgba(255, 255, 255, .7);--border: rgba(255, 255, 255, .16);--background: #0d1659;--surface: #0d1659;--surface-raised: rgba(255, 255, 255, .08);--accent: #ffd13e;--accent-hover: #f0c430;--accent-ink: #0d1659;--accent-soft: rgba(255, 209, 62, .18);--success: #3c9a6e;--success-soft: rgba(60, 154, 110, .22);--warning: #c9851a;--warning-soft: rgba(201, 133, 26, .22);--error: #d6432b;--error-soft: rgba(214, 67, 43, .22);--rounded-sm: 12px;--rounded-md: 16px;--rounded-lg: 20px;--rounded-xl: 24px;--rounded-full: 9999px;--page-padding: 16px;--shadow-card: 0 20px 50px -30px rgba(0, 0, 0, .5);--shadow-cta: 0 10px 24px -10px rgba(255, 209, 62, .55);--primary: var(--ink);--text: var(--ink);--text-secondary: var(--ink-soft)}*{margin:0;padding:0;box-sizing:border-box}html,body{height:100%;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;font-size:16px;color:var(--ink);background:var(--surface);color-scheme:dark;-webkit-font-smoothing:antialiased}body{margin:0;padding:0;touch-action:manipulation;-webkit-tap-highlight-color:transparent}#app{width:100%;min-height:100%;min-height:100dvh;display:flex;flex-direction:column}.app-shell{width:100%;max-width:420px;margin:0 auto;min-height:100%;min-height:100dvh;background:var(--surface);border-radius:0;box-shadow:none;padding:24px 24px 32px;display:flex;flex-direction:column;flex:1}.app-header{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:20px;min-height:38px}.app-brand-lockup{display:flex;flex-direction:column;align-items:flex-start;min-width:0}.app-logo{display:block;height:36px;width:auto;max-width:180px;object-fit:contain;object-position:left center;filter:brightness(0) invert(1)}.app-baseline{margin:4px 0 0;font-size:17px;font-weight:800;color:var(--ink)}.app-header-title{font-size:17px;font-weight:800;color:var(--ink)}.icon-btn{width:38px;height:38px;border:1px solid var(--border);border-radius:12px;background:var(--surface-raised);color:var(--ink);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;flex:none}.icon-btn:hover{opacity:.85}.screen{display:flex;flex-direction:column;flex:1;width:100%;animation:fadeUp .35s ease;position:relative}.screen--center{align-items:center;text-align:center;justify-content:center}.screen--center-top{justify-content:flex-start;padding-top:32px}.screen--fill{justify-content:center}@keyframes fadeUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes popIn{0%{opacity:0;transform:scale(.7)}to{opacity:1;transform:scale(1)}}.btn-primary{width:100%;min-height:56px;padding:18px 24px;background:var(--accent);color:var(--accent-ink);border:none;border-radius:var(--rounded-md);font-size:17px;font-weight:700;cursor:pointer;box-shadow:var(--shadow-cta);transition:background .2s,transform .1s,opacity .2s}.btn-primary:hover:not(:disabled){background:var(--accent-hover)}.btn-primary:active:not(:disabled){transform:scale(.98)}.btn-primary:disabled{opacity:.7;cursor:default}.btn-link{background:none;border:none;color:var(--accent);font-size:14px;font-weight:700;cursor:pointer;padding:8px}.btn-link--muted{color:var(--ink-soft);text-decoration:underline;font-weight:600}.btn-link:hover{opacity:.75}.back-row{display:flex;align-items:center;gap:8px;margin-bottom:12px}.back-btn{display:inline-flex;align-items:center;gap:6px;background:none;border:none;color:var(--ink-soft);font-size:14px;font-weight:600;cursor:pointer;padding:4px 0}.step-label{font-size:12px;font-weight:700;color:var(--ink-soft);letter-spacing:.02em;margin-bottom:8px}.back-btn+.step-label,.back-btn+.screen-title{margin-top:10px}.screen-title{font-size:21px;font-weight:800;color:var(--ink);line-height:1.25;margin-bottom:18px}.screen-title--center{text-align:center}.screen-body{font-size:15px;font-weight:400;color:var(--ink-soft);line-height:1.5}.screen-body strong{color:var(--ink);font-weight:700}.inline-error{color:var(--error);font-size:13px;font-weight:600;min-height:20px;margin-top:8px}.icon-circle{display:inline-flex;align-items:center;justify-content:center;border-radius:50%;flex:none}.icon-circle--success{width:72px;height:72px;background:var(--success-soft);color:var(--success)}.icon-circle--success-lg{width:76px;height:76px;background:var(--success-soft);color:var(--success);animation:popIn .4s ease}.icon-circle--warning{width:72px;height:72px;background:var(--warning-soft);color:var(--warning)}.icon-circle--error{width:72px;height:72px;background:var(--error-soft);color:var(--error)}.icon-circle--bike{width:64px;height:64px;background:var(--surface-raised);color:var(--ink)}.chip{display:inline-flex;align-items:center;padding:8px 14px;border-radius:var(--rounded-full);background:var(--accent-soft);color:var(--accent);font-size:13px;font-weight:700}.distance-stepper{display:flex;align-items:center;justify-content:center;gap:18px;width:100%;margin:22px 0 24px}.distance-stepper .distance-value{flex:1;font-size:42px;font-weight:800;font-variant-numeric:tabular-nums;color:var(--ink);line-height:1}.distance-stepper .distance-unit{font-size:22px;font-weight:700;color:var(--ink-soft);margin-left:4px}.stepper-btn{flex:none;width:48px;height:48px;border-radius:50%;background:var(--surface-raised);border:1.6px solid var(--border);color:var(--ink);font-size:24px;font-weight:700;line-height:1;cursor:pointer;user-select:none;-webkit-user-select:none;transition:transform .1s,opacity .2s}.stepper-btn:active:not(:disabled){transform:scale(.94)}.stepper-btn:disabled{opacity:.35;cursor:default}.recap-screen{text-align:left}.hero-card{display:flex;align-items:center;justify-content:space-between;gap:12px;background:var(--accent);color:var(--accent-ink);border-radius:18px;padding:16px 18px;margin-bottom:22px}.hero-card-date{display:flex;flex-direction:column;min-width:0}.hero-card-weekday{font-size:11px;font-weight:700;letter-spacing:.08em;opacity:.75}.hero-card-day{font-size:22px;font-weight:800;line-height:1.15}.hero-card-weather{display:flex;align-items:center;gap:6px;font-size:13px;font-weight:800;letter-spacing:.04em;text-align:right;flex:none}.hero-card .weather-glyph{color:var(--accent-ink);width:20px;height:20px}.recap-kicker{font-size:17px;font-weight:800;color:var(--ink);margin-bottom:6px}.recap-headline{font-size:28px;font-weight:800;line-height:1.15;color:var(--ink);margin-bottom:18px}.recap-info-label{font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--accent);margin-bottom:10px}.summary-card{background:#fff;color:var(--accent-ink);border-radius:18px;overflow:hidden}.summary-block{padding:16px 16px 14px}.summary-block+.summary-block{border-top:1px solid rgba(13,22,89,.1)}.summary-label{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#0d16598c}.summary-hint{margin-top:4px;font-size:12px;font-weight:500;color:#0d165973}.summary-card .distance-stepper{margin:14px 0 2px}.summary-card .distance-value{color:var(--accent-ink);font-size:34px}.summary-card .distance-unit{color:#0d165973}.summary-card .stepper-btn{background:#0d165914;border:none;color:var(--accent-ink)}.summary-bike-row{display:flex;align-items:center;gap:8px;margin-top:8px}.summary-bike-code{font-size:22px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--accent-ink)}.edit-btn{width:32px;height:32px;border:none;background:transparent;color:#0d165973;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;padding:0}.edit-btn:hover{color:var(--accent-ink)}.recap-footer{margin-top:auto;padding-top:22px}.recap-confirm-prompt{font-size:17px;font-weight:800;color:var(--ink)}.recap-confirm-hint{margin:4px 0 16px;font-size:14px;font-weight:500;color:var(--ink-soft)}.distance-frame{border:1.5px solid var(--border);border-radius:18px;padding:18px 16px;display:flex;flex-direction:column;align-items:center;gap:6px;transition:border-color .2s}.distance-frame.is-error{border-color:var(--error)}.distance-input{width:100%;border:none;outline:none;background:transparent;font-size:52px;font-weight:800;text-align:center;color:var(--ink);color-scheme:dark;font-variant-numeric:tabular-nums;min-height:64px}.distance-unit-label{font-size:15px;font-weight:600;color:var(--ink-soft)}.distance-info{display:flex;align-items:flex-start;gap:8px;margin-top:14px;font-size:13px;font-weight:500;line-height:1.4;color:var(--ink-soft);text-align:left}.distance-info svg{flex:none;margin-top:1px}.confirm-screen{text-align:center}.confirm-eyebrow{margin:0 0 6px;font-size:13px;font-weight:600;color:var(--ink-soft)}.confirm-title{margin-bottom:20px}.confirm-icon{width:72px;height:72px;margin:0 auto 24px;border-radius:50%;background:var(--accent);color:var(--accent-ink);display:flex;align-items:center;justify-content:center}.confirm-icon svg{width:36px;height:36px;display:block}.confirm-card{border:1px solid var(--border);border-radius:18px;overflow:hidden;margin-bottom:22px;text-align:left}.confirm-row{display:flex;align-items:center;gap:12px;padding:14px 16px;font-size:15px}.confirm-row+.confirm-row{border-top:1px solid var(--border)}.confirm-row-icon{flex-shrink:0;width:36px;height:36px;border-radius:10px;background:var(--surface-raised);color:var(--ink-soft);display:inline-flex;align-items:center;justify-content:center}.confirm-row-icon svg{width:18px;height:18px;display:block}.confirm-label{flex:1;color:var(--ink-soft);font-weight:600}.confirm-value{color:var(--ink);font-weight:800}.confirm-modify{text-decoration:underline;text-underline-offset:3px}.camera-zone{position:relative;width:100%;aspect-ratio:1;border-radius:20px;border:2px dashed var(--border);background:var(--surface-raised);overflow:hidden;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;color:var(--ink-soft);margin-bottom:18px}.camera-zone video{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover}.camera-zone-label{font-size:13px;font-weight:600;position:relative;z-index:1}.camera-zone.has-video .camera-placeholder{display:none!important}.bike-code-input{width:100%;font-size:26px;font-weight:800;text-align:center;text-transform:uppercase;letter-spacing:.08em;border:1.5px solid var(--border);border-radius:18px;padding:16px;color:var(--ink);background:var(--surface-raised);color-scheme:dark;outline:none;transition:border-color .2s}.bike-code-input:focus{border-color:var(--accent)}.bike-code-input.is-error{border-color:var(--error)}.link-row{display:flex;justify-content:center;gap:18px;flex-wrap:wrap;margin-top:4px}.history-stats{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:20px}.history-device-note{text-align:center;margin-bottom:16px;font-size:13px}.history-stat{background:var(--surface-raised);border-radius:14px;padding:16px;text-align:center}.history-stat-value{font-size:22px;font-weight:800;color:var(--ink)}.history-stat-label{font-size:12px;font-weight:600;color:var(--ink-soft);margin-top:4px}.history-list{list-style:none;display:flex;flex-direction:column}.history-item{display:flex;align-items:center;gap:12px;padding:14px 0;border-bottom:1px solid var(--border)}.weather-glyph{flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;color:var(--ink-soft)}.weather-glyph svg{width:100%;height:100%;display:block}.weather-glyph--sunny{color:#b17000;color:oklch(60% .16 70)}.weather-glyph--hot{color:#b84b00;color:oklch(55% .2 45)}.weather-glyph--rain{color:#496684}.weather-glyph--snow{color:#57768c}.weather-glyph--night{color:#374863}.weather-glyph--windy{color:#396669}.weather-glyph--cloudy{color:var(--ink-soft)}.history-item:last-child{border-bottom:none}.history-date{flex:1;font-size:14px;font-weight:600;color:var(--ink);text-align:left;text-transform:capitalize}.history-distance{font-size:14px;font-weight:800;color:var(--ink)}.spinner{width:40px;height:40px;border:4px solid var(--border);border-top-color:var(--accent);border-radius:50%;animation:spin .8s linear infinite;margin:0 auto 16px}@keyframes spin{to{transform:rotate(360deg)}}.mt-auto{margin-top:auto}.stack-gap{display:flex;flex-direction:column;gap:14px;width:100%}.reward-fun{margin-top:20px;display:flex;flex-direction:column;align-items:center;gap:8px}.reward-emoji{font-size:40px;line-height:1;animation:popIn .45s ease}.reward-text{font-size:17px;font-weight:700;color:var(--ink);line-height:1.35}.reward-praise{font-size:14px;font-weight:600;color:var(--ink-soft)}.weather-capsule{position:relative;display:flex;align-items:center;gap:12px;width:100%;box-sizing:border-box;margin-top:20px;padding:14px 16px;border-radius:16px;overflow:hidden;isolation:isolate;text-align:left}.weather-capsule--sunny{background:linear-gradient(135deg,#fcf1d4,#ffe6d3);background:linear-gradient(135deg,#fcf1d4,color(xyz 0.821 0.823 0.677))}.weather-capsule--hot{background:linear-gradient(135deg,#ffeadc,#ffdcd0);background:linear-gradient(135deg,color(xyz 0.86 0.846 0.67),color(xyz 0.821 0.76 0.584))}.weather-capsule--rain{background:linear-gradient(135deg,#e4ecf5,#d4dfeb)}.weather-capsule--snow{background:linear-gradient(135deg,#eef2f7,#dce6ee)}.weather-capsule--night{background:linear-gradient(135deg,#192941,#0a1628)}.weather-capsule--cloudy{background:linear-gradient(135deg,#e4e8ef,#d6dbe3)}.weather-capsule--windy{background:linear-gradient(135deg,#ddf0ef,#cce3e7)}.weather-capsule-halo{position:absolute;top:-20px;right:-14px;width:90px;height:90px;border-radius:50%;background:radial-gradient(circle,oklch(88% .12 75) 0%,transparent 70%);animation:weatherSunPulse 3.5s ease-in-out infinite;pointer-events:none}.weather-capsule-halo--hot{background:radial-gradient(circle,oklch(82% .18 45) 0%,transparent 70%);animation:weatherSunPulse 2.4s ease-in-out infinite}.weather-capsule-fx{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.weather-capsule-fx--clouds{opacity:.6}.weather-capsule-icon{position:relative;z-index:1;flex-shrink:0;width:38px;height:38px}.weather-capsule-icon svg{width:100%;height:100%;display:block}.weather-capsule-copy{position:relative;z-index:1;min-width:0}.weather-capsule-title{font-size:13px;font-weight:700;color:#0f1d32;line-height:1.3}.weather-capsule-subtitle{margin-top:1px;font-size:12px;font-weight:400;color:#596475;line-height:1.35}.weather-capsule--night .weather-capsule-title{color:#fff}.weather-capsule--night .weather-capsule-subtitle{color:#b0b8c4}.weather-rain--1{animation:weatherRainFall 1s linear infinite}.weather-rain--2{animation:weatherRainFall 1.2s linear infinite .2s}.weather-rain--3{animation:weatherRainFall .9s linear infinite .4s}.weather-rain--4{animation:weatherRainFall 1.1s linear infinite .1s}.weather-snow--1{animation:weatherSnowDrift 3s ease-in-out infinite}.weather-snow--2{animation:weatherSnowDrift 3.4s ease-in-out infinite .3s}.weather-snow--3{animation:weatherSnowDrift 2.8s ease-in-out infinite .6s}.weather-snow--4{animation:weatherSnowDrift 3.2s ease-in-out infinite .15s}.weather-star--1{animation:weatherTwinkle 2.2s ease-in-out infinite}.weather-star--2{animation:weatherTwinkle 1.8s ease-in-out infinite .4s}.weather-star--3{animation:weatherTwinkle 2.6s ease-in-out infinite .8s}.weather-star--4{animation:weatherTwinkle 2s ease-in-out infinite .2s}.weather-clouds{animation:weatherCloudDrift 6s ease-in-out infinite alternate}.weather-wind--1{animation:weatherWindSweep 1.4s linear infinite}.weather-wind--2{animation:weatherWindSweep 1.7s linear infinite .25s}.weather-wind--3{animation:weatherWindSweep 1.5s linear infinite .45s}.weather-wind--4{animation:weatherWindSweep 1.8s linear infinite .1s}@keyframes weatherSunPulse{0%,to{opacity:.55;transform:scale(1)}50%{opacity:.85;transform:scale(1.08)}}@keyframes weatherRainFall{0%{transform:translateY(-6px)}to{transform:translateY(14px)}}@keyframes weatherSnowDrift{0%{transform:translateY(-6px)}50%{transform:translate(3px,6px)}to{transform:translateY(-6px)}}@keyframes weatherTwinkle{0%,to{opacity:.3}50%{opacity:1}}@keyframes weatherCloudDrift{0%{transform:translate(0)}to{transform:translate(10px)}}@keyframes weatherWindSweep{0%{transform:translate(-12px,4px);opacity:0}20%{opacity:.55}80%{opacity:.45}to{transform:translate(18px,-6px);opacity:0}}.confetti-particle{position:absolute;width:8px;height:8px;border-radius:2px;top:40%;left:50%;pointer-events:none;z-index:5;animation:confettiFall 1.2s cubic-bezier(.25,.46,.45,.94) forwards;animation-delay:var(--delay, 0s);opacity:0}@keyframes confettiFall{0%{transform:translate(0) rotate(0);opacity:1}to{transform:translate(var(--x),var(--y)) rotate(var(--r));opacity:0}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}.streak{width:100%;box-sizing:border-box;margin-top:16px;padding:13px 14px;background:var(--surface-raised);border-radius:14px;display:flex;flex-direction:column;gap:10px;text-align:left}.streak--hero{background:var(--accent-soft);border:1px solid rgba(255,209,62,.45);padding:16px 14px}.streak-top{display:flex;align-items:baseline;justify-content:space-between;gap:8px}.streak-count{font-size:19px;font-weight:800;font-variant-numeric:tabular-nums}.streak--hero .streak-count{font-size:27px;color:var(--accent)}.streak-label{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-soft)}.streak--hero .streak-label{color:var(--accent)}.streak-dots{display:flex;gap:7px;align-items:center}.streak-dot{flex:1;height:9px;border-radius:var(--rounded-full);background:transparent;border:1.5px solid var(--border)}.streak-dot--on{background:var(--success);border-color:var(--success)}.streak-dot--today{background:var(--accent);border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}.streak-dot--today-pending{background:transparent;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}.streak-dot--missed{background:var(--border);border-color:var(--border)}.streak-dot--forgiven{border-color:var(--warning);border-style:dashed;background:transparent}.streak-dow{display:flex;gap:7px}.streak-dow span{flex:1;text-align:center;font-size:9.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-soft)}.streak-forgiven{font-size:12px;line-height:1.4;color:var(--ink-soft)}.reward-first{margin-top:14px;font-size:12.5px;font-weight:700;letter-spacing:.03em;color:var(--accent);text-align:center}.reward-fun--inline{margin-top:12px;flex-direction:row;align-items:center;justify-content:center;gap:7px}.reward-fun--inline .reward-emoji{font-size:17px;animation:none}.reward-fun--inline .reward-text{font-size:12.5px;font-weight:600;color:var(--ink-soft)}.history-streak{margin-bottom:16px}.already-hint{margin-top:14px;font-size:13px;font-weight:600;color:var(--ink-soft);text-align:center}