.journey-card{padding:20px 18px 18px;border:2px solid #d3d9dd;background:#f8f9fa}
.journey-card.on{border-color:#36a867;background:#f4fbf6}
.journey-card .status-head{align-items:center}
.journey-card .status-head small{font-size:10px;letter-spacing:.12em}
.journey-card .status-head h2{font-size:24px;margin-top:5px}
.journey-card .pill{display:inline-flex;align-items:center;gap:7px;padding:9px 12px;font-size:12px;letter-spacing:.06em}
.journey-card .pill.off{background:#e4e8eb;color:#414b51}
.journey-card .pill.on{background:#d8f2e1;color:#116a39}
.status-dot{width:11px;height:11px;border-radius:50%;background:#7d878c}
.pill.on .status-dot{background:#1d9e53;box-shadow:0 0 0 3px #bee8cc}
.journey-action-wrap{display:grid;place-items:center;padding:22px 0 5px}
.journey-action{width:158px;height:158px;min-width:158px;border:6px solid #fff;border-radius:50%;background:#168a4b;color:#fff;box-shadow:0 0 0 2px #9ed4b1,0 12px 25px #157a4140;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;text-align:center;touch-action:manipulation;transition:transform .15s,box-shadow .15s}
.journey-action:hover{transform:scale(1.035)}
.journey-action:active{transform:scale(.97)}
.journey-action:disabled,.journey-card.on .journey-action:disabled{background:#83919a;box-shadow:0 0 0 2px #cbd3d8;cursor:not-allowed;opacity:.75}
.journey-action:disabled:hover,.journey-action:disabled:active{transform:none}
.journey-action:focus-visible{outline:4px solid #0a678c;outline-offset:5px}
.journey-action-icon{font-size:31px;line-height:1;transform:rotate(-35deg);font-weight:800;margin-bottom:5px}
.journey-action strong{font-size:17px;letter-spacing:.03em;line-height:1.1}
.journey-action small{font-size:10px;font-weight:700;line-height:1.2;opacity:.95}
.journey-card.on .journey-action{background:#263c47;box-shadow:0 0 0 2px #aec3cc,0 12px 25px #263c4740}
.journey-card.on .journey-action-icon{transform:rotate(35deg)}
.journey-card .journey-prompt{text-align:center;color:#315266;font-size:12px;font-weight:800;margin:8px 0 17px}
.journey-card .last-mark{border-top:1px solid #dce5e8;padding-top:12px;font-size:10px;margin:0 0 10px}
.journey-card .privacy-note{margin:9px 0 0}
.camera-picker{position:relative;min-height:82px;display:flex!important;align-items:center;gap:13px;border:2px solid #92cddd!important;background:#eef8fa!important;padding:13px 15px!important;cursor:pointer;touch-action:manipulation}
.camera-picker:focus-within{outline:3px solid #087da4;outline-offset:2px}
.camera-picker.has-photo{border-color:#46ae73!important;background:#f0fbf4!important}
.camera-picker input[type=file]{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer;z-index:1}
.camera-picker .camera-icon{width:49px;height:49px;flex:none;display:grid;place-items:center;border-radius:13px;background:#087da4;color:#fff;font-size:25px;line-height:1}
.camera-picker.has-photo .camera-icon{background:#168a4b}
.camera-picker .camera-copy{flex:1;min-width:0;display:block;color:#0b2638}
.camera-copy strong{display:block;font-size:13px;line-height:1.25}
.camera-copy small{display:block;color:#496779;font-size:10px;font-weight:600;line-height:1.4;margin-top:4px}
.camera-picker .camera-arrow{font-size:29px;color:#087da4;line-height:1}
.sheet label:not(.camera-picker){font-size:12px}
.sheet input:not([type=file]):not([type=checkbox]){height:50px;font-size:16px}
.sheet .gps-card{padding:14px}
.sheet .gps-card strong{font-size:11px}
.sheet .gps-card small{font-size:10px}
.sheet .button.action[type=submit]{min-height:54px;font-size:14px}
.refuel-card{gap:14px;padding:18px 16px;align-items:center}
.refuel-copy{flex:1;min-width:0}
.refuel-copy h2{font-size:16px;margin:5px 0 7px}
.refuel-copy p{font-size:10px;line-height:1.5}
.energy-action{width:108px;height:108px;min-width:108px;border:4px solid #fff;border-radius:50%;background:#087da4;color:#fff;box-shadow:0 0 0 2px #91d2df,0 8px 18px #087da433;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;text-align:center;touch-action:manipulation;transition:transform .15s}
.energy-action:hover{transform:scale(1.04)}
.energy-action:active{transform:scale(.96)}
.energy-action:focus-visible{outline:4px solid #0b2638;outline-offset:4px}
.energy-action-icon{font-size:31px;line-height:1.1}
.energy-action strong{font-size:10px;line-height:1.1;letter-spacing:.02em}
.sheet select{display:block;width:100%;height:50px;border:1px solid #dce8ec;border-radius:8px;padding:0 11px;margin-top:6px;color:#0b2638;background:#fff;font:inherit;font-size:16px}
.bike-banner #vehicle-energy{display:block;color:#a7e6ef;font-size:9px;font-weight:700;margin-top:4px}
@media(max-width:360px){.journey-action{width:144px;height:144px;min-width:144px}.journey-card .status-head h2{font-size:21px}.journey-card .pill{font-size:10px}}
@media(max-width:360px){.energy-action{width:96px;height:96px;min-width:96px}.energy-action-icon{font-size:27px}.energy-action strong{font-size:9px}}
.sheet .camera-picker{width:112px;height:112px;min-height:112px;display:grid!important;place-items:center;gap:0;margin:0 auto 38px;padding:0!important;border-radius:50%;box-shadow:0 0 0 4px #d6edf4}
.sheet .camera-picker .camera-icon{width:68px;height:68px;border-radius:50%;font-size:31px;box-shadow:none}
.sheet .camera-picker.has-photo{box-shadow:0 0 0 4px #d2efdc}
.sheet .camera-picker .camera-copy{position:absolute;top:calc(100% + 10px);left:50%;width:210px;max-width:75vw;transform:translateX(-50%);text-align:center;pointer-events:none}
.sheet .camera-picker .camera-copy strong{font-size:11px}
.sheet .camera-picker .camera-copy small,.sheet .camera-picker .camera-arrow{display:none}
.odometer-field{display:grid;gap:7px;min-width:0}
.odometer-field>strong{font-size:12px;color:#415767}
.odometer-field>small{font-size:10px;line-height:1.45;color:#71838b}
.km-entry-label{display:grid;gap:5px;margin-top:4px;color:#415767;font-size:10px;font-weight:800}
.sheet .km-entry{width:100%;height:42px;margin:0!important;font-size:16px!important;font-weight:700}
.km-suggestions{display:flex;align-items:center;flex-wrap:wrap;gap:7px;padding:10px;border:1px solid #b8dce5;border-radius:9px;background:#eef8fa}
.km-suggestions strong{width:100%;font-size:10px;color:#415767}
.km-suggestions button{border:1px solid #087da4;border-radius:7px;background:#fff;color:#0a678c;padding:8px 12px;font-size:12px;font-weight:800}
.km-suggestions button[aria-pressed="true"]{background:#0b2638;border-color:#0b2638;color:#fff}
.km-suggestions button:focus-visible{outline:3px solid #087da4;outline-offset:2px}
.odometer-display{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:3px;padding:7px;border-radius:12px;border:1px solid #cadce2;background:#dce9ed;box-shadow:inset 0 2px 8px #0b26381c;touch-action:none;width:100%;text-align:center}
.odometer-display:focus-visible{outline:3px solid #087da4;outline-offset:3px}
.odometer-wheel{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:0;height:78px;padding:0;border:1px solid #bacdd3;border-radius:7px;background:linear-gradient(#e4eaec,#fff 30%,#fff 70%,#dce5e8);box-shadow:0 2px 3px #0b26381c;color:#0b2638;overflow:hidden;user-select:none;-webkit-user-select:none}
.odometer-wheel strong{display:grid;place-items:center;width:100%;height:34px;font-size:25px;font-variant-numeric:tabular-nums;line-height:1;border-top:1px solid #d8e4e8;border-bottom:1px solid #d8e4e8}
.odometer-wheel .wheel-neighbor{font-size:13px;line-height:19px;opacity:.35;font-variant-numeric:tabular-nums}
.odometer-display:active .odometer-wheel{background:#e7f6f9}
.odometer-wheel.rolling.up strong{animation:odometer-roll-up .2s ease-out}
.odometer-wheel.rolling.down strong{animation:odometer-roll-down .2s ease-out}
@keyframes odometer-roll-up{from{transform:translateY(10px);opacity:.4}to{transform:translateY(0);opacity:1}}
@keyframes odometer-roll-down{from{transform:translateY(-10px);opacity:.4}to{transform:translateY(0);opacity:1}}
.sheet input[type=hidden]{display:none!important}
@media(prefers-reduced-motion:reduce){.odometer-wheel.rolling strong{animation:none}}
@media(max-width:360px){.odometer-display{gap:2px;padding:5px}.odometer-wheel{height:70px}.odometer-wheel strong{font-size:22px}}
.fuel-photo-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;align-items:start;padding:8px 0 2px}
.fuel-photo-grid>div{min-width:0;text-align:center}
.fuel-photo-grid .camera-picker{width:98px;height:98px;min-height:98px;margin-bottom:43px}
.fuel-photo-grid .camera-picker .camera-icon{width:60px;height:60px;font-size:27px}
.fuel-photo-grid .camera-copy{width:145px!important;max-width:100%!important}
.fuel-photo-grid .photo-preview img{max-height:100px}
.quantity-field{display:grid;gap:8px;min-width:0}
.quantity-field>strong{font-size:12px;color:#415767}
.quantity-display{display:flex;justify-content:center;align-items:center;gap:3px;min-height:88px;width:100%;padding:6px 7px;border:1px solid #cadce2;border-radius:12px;background:#dce9ed;box-shadow:inset 0 2px 8px #0b26381c;touch-action:none}
.quantity-display .odometer-wheel{flex:1;max-width:57px;height:72px}
.quantity-display .odometer-wheel strong{font-size:23px}
.roller-separator{align-self:center;font-size:25px;font-weight:900;color:#0b2638;margin:0 1px 0 -1px}
.quantity-display:focus-visible{outline:3px solid #087da4;outline-offset:3px}
.roller-guide{font-size:10px;line-height:1.45;color:#71838b;margin:0}
@media(max-width:360px){.quantity-display{gap:2px;padding:5px}.quantity-display .odometer-wheel{height:65px}.quantity-display .odometer-wheel strong{font-size:20px}.fuel-photo-grid .camera-picker{width:90px;height:90px;min-height:90px}}
.mark-exit{width:100%;border:1px solid #cbdfe5;background:#fff;color:#415767}
.mark-exit:hover{background:#eef8fa}
.gps-help{padding:12px 14px;border:1px solid #e8c58e;border-radius:10px;background:#fff8eb;color:#754b16;font-size:11px;line-height:1.5}
.gps-help strong,.gps-help span{display:block}
.gps-help span{margin-top:5px}