.planner{--bg:#f5f7f6;--paper:#fff;--ink:#10231e;--muted:#64716d;--line:#dce4e0;--accent:#0d765c;--mint:#3ee6b2;--soft:#e5f6ee;background:var(--bg);min-height:100vh;color:var(--ink);font-family:Arial,sans-serif}.planner.dark{--bg:#0a1411;--paper:#101e1a;--ink:#edf7f2;--muted:#9bb0a8;--line:#20342d;--accent:#66d4ad;--soft:#142d25}.planner *{box-sizing:border-box}.top,main,.tabs,.planner footer{max-width:1240px;margin:auto}.top{justify-content:space-between;align-items:end;gap:24px;padding:40px 24px 26px;display:flex}.back,.eyebrow{letter-spacing:.12em;text-transform:uppercase;color:var(--accent);font-size:11px;font-weight:800}.top h1{letter-spacing:-.05em;margin:5px 0 2px;font-size:clamp(30px,5vw,52px)}.top em{font-family:Georgia,serif;font-weight:400}.top p,.sub{color:var(--muted);margin:0}.actions{flex-wrap:wrap;justify-content:end;gap:8px;display:flex}.planner button{background:var(--paper);color:var(--ink);border:1px solid var(--line);cursor:pointer;border-radius:9px;padding:10px 13px;font-weight:700}.planner button.primary{background:var(--accent);color:#fff;border-color:var(--accent)}.tabs{border-bottom:1px solid var(--line);gap:4px;padding:0 24px;display:flex;overflow:auto}.tabs button{color:var(--muted);white-space:nowrap;background:0 0;border:0;border-radius:0;padding:14px}.tabs button.active{color:var(--ink);border-bottom:2px solid var(--accent)}main{padding:28px 24px 55px}.hero{background:var(--paper);border:1px solid var(--line);border-radius:16px;justify-content:space-between;gap:28px;margin-bottom:16px;padding:28px;display:flex}.hero h2{margin:6px 0;font-size:25px}.status{background:var(--soft);border-radius:12px;flex-direction:column;justify-content:center;min-width:220px;padding:16px;display:flex}.status strong{margin:4px 0;font-size:25px}.status small{color:var(--muted)}.green{color:#19a777!important}.amber{color:#d18b23!important}.red{color:#e05858!important}.metrics{grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:16px;display:grid}.metric{flex-direction:column;gap:5px;display:flex}.metric span{color:var(--muted);font-size:12px}.metric strong{letter-spacing:-.03em;font-size:20px}.metrics>.metric{background:var(--paper);border:1px solid var(--line);border-radius:12px;padding:17px}.grid{gap:16px;margin-bottom:16px;display:grid}.grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}.grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}.card{background:var(--paper);border:1px solid var(--line);border-radius:15px;margin-bottom:16px;padding:22px}.grid .card{margin:0}.card h2{margin:0 0 18px;font-size:16px}.card h3{margin:8px 0;font-size:19px}.allocation,.bar{background:var(--soft);border-radius:10px;height:19px;overflow:hidden}.allocation>div,.bar>div{background:var(--accent);border-radius:10px;height:100%}.legend{color:var(--muted);flex-wrap:wrap;gap:18px;margin:12px 0 17px;font-size:12px;display:flex}.legend i{background:#a6beb4;border-radius:50%;width:9px;height:9px;margin-right:4px;display:inline-block}.legend .land{background:var(--accent)}.waterfall{border-top:1px solid var(--line);grid-template-columns:repeat(3,1fr);gap:10px;padding-top:14px;display:grid}.chart{background:linear-gradient(to bottom,transparent 24%,var(--line) 25%,transparent 26%,transparent 49%,var(--line) 50%,transparent 51%,transparent 74%,var(--line) 75%,transparent 76%);width:100%;height:200px}.chart-labels{color:var(--muted);justify-content:space-between;font-size:11px;display:flex}.inline-metrics{grid-template-columns:repeat(4,1fr);gap:10px;margin-top:17px;display:grid}.answers{grid-template-columns:repeat(3,1fr);gap:20px;display:grid}.answers>div{border-left:2px solid var(--accent);padding-left:12px}.answers span{color:var(--accent);font-weight:800}.answers p{color:var(--muted);margin:5px 0;font-size:13px}.answers b{font-size:14px}.duration{flex-wrap:wrap;gap:6px;margin-bottom:18px;display:flex}.duration .selected{background:var(--accent);color:#fff}.field{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;gap:12px;padding:8px 0;font-size:13px;display:flex}.field>span{color:var(--muted)}.field>div{background:var(--bg);border-radius:7px;align-items:center;padding-left:8px;display:flex}.field i{color:var(--muted);font-size:12px;font-style:normal}.field input,.field select{width:115px;color:var(--ink);font:inherit;text-align:right;background:0 0;border:0;outline:0;padding:8px}.field select{text-align:left;background:var(--bg);border:1px solid var(--line);border-radius:7px;width:200px}.callout{background:var(--soft);border-radius:10px;grid-template-columns:repeat(2,1fr);gap:14px;margin-top:17px;padding:15px;display:grid}.scenario-grid{grid-template-columns:repeat(4,1fr);gap:12px;display:grid}.scenario{border:1px solid var(--line);border-radius:11px;padding:16px}.scenario p{min-height:52px;color:var(--muted);font-size:13px}.scenario .metric{margin:12px 0}.scenario button{width:100%;margin-top:8px}.saved{flex-wrap:wrap;gap:9px;display:flex}.saved button{text-align:left;flex-direction:column;display:flex}.saved small{color:var(--muted);margin-top:4px}.warning{color:#a86c13;background:#fff5df;border-radius:8px;margin-top:18px;padding:12px;font-size:12px}.dark .warning{color:#f1cf83;background:#342a13}.compact{grid-template-columns:repeat(3,1fr)}.comparison{grid-template-columns:repeat(3,1fr);gap:12px;margin:26px 0;display:grid}.comparison>div{background:var(--soft);border-radius:10px;gap:4px;padding:16px;display:grid}.comparison span,.comparison small{color:var(--muted);font-size:12px}.comparison strong{font-size:19px}.planner footer{color:var(--muted);border-top:1px solid var(--line);padding:25px 24px;font-size:12px}@media (max-width:800px){.top,.hero{display:block}.actions{justify-content:start;margin-top:18px}.metrics,.scenario-grid{grid-template-columns:repeat(2,1fr)}.grid.two,.grid.three,.answers{grid-template-columns:1fr}.card{padding:16px}.waterfall,.inline-metrics{grid-template-columns:repeat(2,1fr)}.status{margin-top:18px}.comparison{grid-template-columns:1fr}}@media print{.top .actions,.tabs,.back{display:none}.planner,.planner.dark{--bg:#fff;--paper:#fff;--ink:#111;--muted:#555;--line:#ddd}.card,.hero{break-inside:avoid}.planner{font-size:12px}main{padding:12px}.chart{height:130px}}.period-row{margin:14px 0 4px}.period-row .sub{margin-top:8px}.totals-row{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin:14px 0 18px;display:grid}.legs{gap:14px;margin:14px 0 18px;display:grid}.leg{border:1px solid #ffffff1f;border-radius:12px;padding:12px}.leg-line{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.leg-line input{min-width:110px;color:inherit;background:#0003;border:1px solid #ffffff29;border-radius:8px;flex:1;padding:8px 10px}.leg-line .arrow{opacity:.6;font-size:.8rem}.leg-line.numbers{margin-top:8px}.leg-line.numbers label{opacity:.8;align-items:center;gap:6px;font-size:.78rem;display:flex}.leg-line.numbers input{flex:none;max-width:92px}.leg-cost{margin-left:auto;font-weight:700}.leg-note{opacity:.7;margin:8px 0 0;font-size:.78rem}.ghost.danger{opacity:.6}.around{border-top:1px solid #ffffff1a;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px;margin-top:12px;padding-top:12px;display:grid}.around-col p{margin:4px 0;font-size:.8rem}.around-col em{opacity:.6;font-size:.74rem;font-style:normal}.around-col .none{opacity:.45}.around-note{opacity:.55;grid-column:1/-1;margin:4px 0 0;font-size:.72rem}.map-card{padding:10px}.map-wrap{z-index:0;isolation:isolate;margin:0 0 10px;position:relative}.map{background:#ffffff0a;border-radius:12px;height:min(78vh,900px);min-height:520px;overflow:hidden}.map.skeleton{display:block}.leaflet-container{font:inherit;background:#0f172a}.pricepin{background:var(--pin);color:#08131f;font-variant-numeric:tabular-nums;letter-spacing:-.01em;white-space:nowrap;border-radius:7px;justify-content:center;align-items:center;min-width:52px;height:26px;padding:0 8px;font:800 13px/1 ui-sans-serif,system-ui,sans-serif;display:flex;position:relative;box-shadow:0 2px 6px #00000073,0 0 0 1.5px #ffffff8c}.pricepin:after{content:"";border:5px solid #0000;border-top-color:var(--pin);filter:drop-shadow(0 1.5px #ffffff80);position:absolute;top:100%;left:50%;transform:translate(-50%)}.pricepin.best{border-radius:8px;min-width:58px;height:30px;font-size:14.5px;box-shadow:0 3px 10px #00000080,0 0 0 2.5px #fff,0 0 0 5px #3ee6b273}.pricepin.best:after{border-width:6px}.leaflet-tooltip.pump-tip{color:#e2e8f0;white-space:nowrap;background:#0b1220;border:1px solid #ffffff29;border-radius:8px;padding:8px 10px;font-size:12.5px;line-height:1.45;box-shadow:0 8px 24px #00000080}.leaflet-tooltip.pump-tip:before{border-top-color:#ffffff29}.key-price{flex-basis:100%}.key-pin{background:linear-gradient(90deg,#3ee6b2 0 50%,#ef4444 50% 100%);border-radius:3px!important;width:16px!important;height:11px!important}.map-key{opacity:.75;flex-wrap:wrap;gap:14px;margin-top:10px;font-size:.74rem;display:flex}.map-key span{align-items:center;gap:6px;display:inline-flex}.map-key i{border-radius:50%;width:9px;height:9px;display:inline-block}@media (max-width:640px){.map{height:68vh;min-height:380px}.pricepin{min-width:46px;height:24px;padding:0 7px;font-size:12px}.pricepin.best{min-width:52px;height:27px;font-size:13px}.leaflet-tooltip.pump-tip{white-space:normal;max-width:62vw;font-size:11.5px}}.town-bar{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;padding:4px 6px 2px;display:flex}.radius{opacity:.8;align-items:center;gap:8px;font-size:.78rem;display:inline-flex}.radius select{background:var(--bg);color:var(--ink);border:1px solid var(--line);font:inherit;border-radius:7px;padding:6px 8px}.things{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px;margin-bottom:4px;display:grid}.thing{border:1px solid var(--line);border-radius:10px;gap:2px;padding:10px 12px;display:grid}.thing-name{font-size:.9rem;font-weight:700}.thing em{opacity:.65;font-size:.74rem;font-style:normal}.thing-hours{opacity:.45!important}.town .around{border-top:1px solid var(--line);margin-top:16px;padding-top:14px}.around-col .place{gap:2px;margin:8px 0;display:grid}.around-col .place>span{font-weight:600}.ghost.tiny{border-radius:6px;justify-self:start;margin-top:2px;padding:3px 8px;font-size:.68rem}.np-rule{border:1px solid #ffffff1f;border-radius:12px;margin:4px 0 18px;padding:14px}.np-rule .sub{margin:10px 0 0}.np-tick{opacity:.85;align-items:center;gap:6px;font-size:.78rem;display:inline-flex}.np-tick input{width:auto}.np-night{opacity:.85;padding:6px 0;font-size:.78rem}.picking{color:#3ee6b2;margin-top:10px;font-size:.82rem;font-weight:600}.planner{border-radius:14px;min-height:auto;overflow:hidden}.top.embedded{justify-content:flex-end;padding:18px 24px 0}.top.embedded .actions{justify-content:flex-end}@media (max-width:800px){.top.embedded{padding:14px 16px 0;display:block}.top.embedded .actions{justify-content:flex-start;margin-top:0}}.diesel{background:#3ee6b20f;border:1px solid #3ee6b247;border-radius:12px;margin-bottom:16px;padding:14px}.diesel-head{flex-wrap:wrap;align-items:flex-start;gap:18px 32px;display:flex}.diesel-best,.diesel-avg{gap:2px;display:grid}.diesel-head strong{letter-spacing:-.02em;font-size:1.9rem;font-weight:700;line-height:1.05}.diesel-best strong{color:#3ee6b2}.diesel-head strong i{opacity:.6;margin-left:2px;font-size:.82rem;font-style:normal}.diesel-head em{opacity:.7;font-size:.76rem;font-style:normal}.diesel-use{flex-wrap:wrap;gap:6px;margin-top:6px;display:flex}.diesel-list{border-top:1px solid var(--line);gap:6px;margin-top:14px;padding-top:12px;display:grid}.pump{grid-template-columns:74px 1fr;align-items:baseline;gap:2px 12px;margin:0;display:grid}.pump-price{font-variant-numeric:tabular-nums;font-weight:700}.pump-name{font-size:.86rem;font-weight:600}.pump em{opacity:.6;grid-column:2;font-size:.72rem;font-style:normal}@media (max-width:800px){.diesel-head strong{font-size:1.5rem}.diesel-head{gap:14px 20px}.pump{grid-template-columns:66px 1fr}}.mine-add{border:1px dashed #ffffff2e;border-radius:12px;margin-bottom:14px;padding:12px 14px}.mine-add-row{flex-wrap:wrap;align-items:center;gap:8px 12px;display:flex}.mine-add-row .sub{flex:220px;margin:0}.mine-form{gap:10px;display:grid}.mine-fields{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px;display:grid}.mine-fields input{width:100%}.mine-actions{flex-wrap:wrap;gap:8px;display:flex}.mine-form .sub{margin:0}.add-error{color:#fca5a5!important;opacity:1!important}.yours{letter-spacing:.1em;text-transform:uppercase;vertical-align:middle;color:#fff;background:#ffffff24;border-radius:5px;margin-left:6px;padding:2px 6px;font-size:.58rem;font-weight:800}.thing.mine,.place.from-travellers{border-left:2px solid #fff6;padding-left:10px}.mine-things{margin-bottom:4px}.install{background:#3ee6b212;border:1px solid #3ee6b24d;border-radius:12px;flex-wrap:wrap;align-items:center;gap:12px;margin:0 0 14px;padding:12px 14px;display:flex}.install-icon{background:#0f172a url(/planner-icon-192.png) 50%/cover;border-radius:9px;flex:none;width:34px;height:34px;box-shadow:0 2px 8px #0006}.install-copy{flex:220px;gap:2px;min-width:0;display:grid}.install-copy b{font-size:.9rem}.install-copy span{opacity:.7;font-size:.76rem}@media (display-mode:standalone){body>header,body>footer{display:none!important}.tool-page{padding-top:max(16px, env(safe-area-inset-top))!important;padding-bottom:max(28px, env(safe-area-inset-bottom))!important;padding-left:max(16px, env(safe-area-inset-left))!important;padding-right:max(16px, env(safe-area-inset-right))!important}.install{display:none}}@media (max-width:640px){.top.embedded .actions{flex-wrap:wrap;gap:6px}.top.embedded .actions button{flex:auto;padding:8px 10px;font-size:.78rem}.totals-row{grid-template-columns:repeat(2,1fr)!important}.trip-grid,.around{grid-template-columns:1fr!important}.leg-line{flex-wrap:wrap;gap:6px}.leg-line input{min-width:0}.hero{display:block}.hero .status{margin-top:14px}.diesel-list{max-height:46vh;overflow-y:auto}.mine-fields{grid-template-columns:1fr}}.leg-line.numbers label{white-space:nowrap}.leg-line.numbers .np-tick{margin-left:4px}.span-manual{color:var(--muted);flex-wrap:wrap;align-items:center;gap:8px;margin-top:4px;font-size:.8rem;display:flex}.span-manual input{text-align:right;border:1px solid var(--line);background:var(--bg);width:74px;color:var(--ink);border-radius:8px;padding:8px 10px}.span-manual select{border:1px solid var(--line);background:var(--bg);color:var(--ink);border-radius:8px;padding:8px 10px}.span-manual b{color:var(--ink);font-weight:800}.field.derived>div{padding:8px 12px}.field.derived b{font-weight:800}.fills{gap:10px;margin:14px 0 4px;display:grid}.fill{background:#ffffff08;border:1px solid #ffffff1f;border-radius:12px;flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:16px;padding:12px 14px;display:flex}.fill-where{flex:240px;gap:3px;min-width:0;display:grid}.fill-where strong{letter-spacing:-.01em;font-size:1.05rem}.fill-where em,.fill-cost em{opacity:.65;font-size:.76rem;font-style:normal}.fill-cost{text-align:right;flex:none;gap:2px;display:grid}.fill-cost strong{color:#3ee6b2;letter-spacing:-.02em;font-size:1.3rem}.fill-servo{opacity:.5!important}@media (max-width:640px){.fill{gap:8px}.fill-cost{text-align:left}}.toolstrip{z-index:20;background:color-mix(in srgb, var(--bg) 92%, transparent);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid var(--line);padding-top:env(safe-area-inset-top);position:sticky;top:0}.toolstrip .tabs{border-bottom:0}.jump{scrollbar-width:none;gap:6px;max-width:1240px;margin:auto;padding:0 24px 10px;display:flex;overflow-x:auto}.jump::-webkit-scrollbar{display:none}.jump button{color:var(--muted);border:1px solid var(--line);background:0 0;border-radius:999px;flex:none;padding:6px 12px;font-size:.76rem;font-weight:700}.jump button:hover{color:var(--ink);border-color:var(--accent)}.card[id^=sec-]{scroll-margin-top:104px}@media (max-width:640px){.jump{padding:0 12px 8px}.card[id^=sec-]{scroll-margin-top:96px}}
.trip-grid{grid-template-columns:repeat(5,1fr);gap:10px;margin:20px 0;display:grid}.stepper{border:1px solid var(--line);border-radius:10px;padding:12px}.stepper>span{color:var(--muted);min-height:30px;font-size:12px;display:block}.stepper>div{justify-content:space-between;align-items:center;gap:6px;display:flex}.stepper button{width:28px;height:28px;padding:0;font-size:18px;line-height:1}.stepper b{white-space:nowrap;font-size:13px}.trip-total{background:var(--soft);border-radius:11px;grid-template-columns:repeat(6,1fr);gap:10px;padding:16px;display:grid}.trip-total .metric strong{font-size:17px}@media (max-width:1000px){.trip-grid,.trip-total{grid-template-columns:repeat(3,1fr)}}@media (max-width:600px){.trip-grid,.trip-total{grid-template-columns:repeat(2,1fr)}}