/* latin-ext */
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url(fonts/dm-sans-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url(fonts/dm-sans-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* Kierunek Zocdoc: biel, granat, zolte akcje i DM Sans. Aktualizacja wlasciciela 21.09; cztery rozmiary pisma 40/17/15/13. */
:root{
  color-scheme:light;
  --soft:#F7F8FA; --selected:#FFFBD7; --field-line:#77889D; --bg:#FFFFFF; --ink:#00234B; --t2:#4A5566; --line:#E6E8EB;
  --yel:#FFF04B; --yel-ink:#00234B; --yel-good:#0F7A4A; --sky:#DCE9FD; --sky-ink:#00234B;
  --yel-hover:#F7E63A; --scrim:rgb(0 20 43 / .48);
  --select-arrow:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='m5 7 5 5 5-5' fill='none' stroke='%2300234B' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  --forecast:#956800; --good:#0F7A4A; --bad:#B7361F; --reserve:#A95100; --on-ink:#FFFFFF;
  --limit:#4A5566; --limit-ours:#6E3FB5;   /* Z114: limit ceny ogloszony (szary) i przewidywany przez nas (fiolet) */
  /* kolory paliw jak na dystrybutorach (wlasciciel 26.09): tylko identyfikacja, nigdy kierunek ceny */
  --fuel-pb95:#2E7D4F; --fuel-pb95-bg:#F0F7F2; --fuel-on:#4A5566; --fuel-on-bg:#F2F3F5; --fuel-gaz:#2E6DB4; --fuel-gaz-bg:#EFF4FB;
  --fuel-opal:#B0503A; --fuel-opal-bg:#FBF1ED; --fuel-lpg:#1E8585; --fuel-lpg-bg:#ECF6F6; --fuel-pigs:#B84A76; --fuel-pigs-bg:#FBEFF4;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  color-scheme:dark;
  --soft:#1C222B; --selected:#302F20; --field-line:#627087; --bg:#121417; --ink:#EEF3FA; --t2:#B9C2CE; --line:#2A3038;
  --yel:#FFF04B; --yel-ink:#00234B; --yel-good:#0F7A4A; --sky:#1C2D46; --sky-ink:#DCE9FD;
  --forecast:#FFF04B; --good:#5FD39A; --bad:#F2957E; --reserve:#FFB36B; --on-ink:#121417;
  --limit:#B9C2CE; --limit-ours:#B88CFF;
  --fuel-pb95:#6FCB93; --fuel-pb95-bg:#16231B; --fuel-on:#AEB8C5; --fuel-on-bg:#1B1F25; --fuel-gaz:#7DB2F0; --fuel-gaz-bg:#162132;
  --fuel-opal:#F0A08C; --fuel-opal-bg:#2A1B17; --fuel-lpg:#6FD1D1; --fuel-lpg-bg:#132625; --fuel-pigs:#F2A0BF; --fuel-pigs-bg:#2A1920;
  --select-arrow:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='m5 7 5 5 5-5' fill='none' stroke='%23EEF3FA' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}}
:root[data-theme="light"]{color-scheme:light}
:root[data-theme="dark"]{
  color-scheme:dark;
  --soft:#1C222B; --selected:#302F20; --field-line:#627087; --bg:#121417; --ink:#EEF3FA; --t2:#B9C2CE; --line:#2A3038;
  --yel:#FFF04B; --yel-ink:#00234B; --yel-good:#0F7A4A; --sky:#1C2D46; --sky-ink:#DCE9FD;
  --forecast:#FFF04B; --good:#5FD39A; --bad:#F2957E; --reserve:#FFB36B; --on-ink:#121417;
  --limit:#B9C2CE; --limit-ours:#B88CFF;
  --fuel-pb95:#6FCB93; --fuel-pb95-bg:#16231B; --fuel-on:#AEB8C5; --fuel-on-bg:#1B1F25; --fuel-gaz:#7DB2F0; --fuel-gaz-bg:#162132;
  --fuel-opal:#F0A08C; --fuel-opal-bg:#2A1B17; --fuel-lpg:#6FD1D1; --fuel-lpg-bg:#132625; --fuel-pigs:#F2A0BF; --fuel-pigs-bg:#2A1920;
  --select-arrow:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='m5 7 5 5 5-5' fill='none' stroke='%23EEF3FA' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;background:var(--bg);color:var(--ink);font-family:"DM Sans","Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  font-size:17px;line-height:1.45;-webkit-font-smoothing:antialiased;padding-inline:0;padding-block:0}
button,input,select,textarea{font:inherit;color:inherit}
button{background:none;border:0;padding:0;margin:0;cursor:pointer;text-align:left}
:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
b{font-weight:700;font-variant-numeric:tabular-nums}
p{margin:0}
[hidden]{display:none!important}

.app{max-width:1040px;margin:0 auto;min-height:100dvh;display:flex;flex-direction:column;background:var(--bg);position:relative}
@media (min-width:1041px){.app{border-inline:1px solid var(--line)}}

/* rozmiary: tylko te cztery */
.s40{font-size:40px;font-weight:700;letter-spacing:-.025em;word-spacing:.06em;line-height:1.05}
.s17{font-size:17px}
.s15{font-size:15px}
.s13{font-size:13px;line-height:1.4}
.t2{color:var(--t2)}
.bad{color:var(--bad)}.good{color:var(--good)}

.top{padding:12px 20px;border-bottom:1px solid var(--line);display:grid;grid-template-columns:1fr auto;align-items:center;gap:4px 16px}
.top #fresh{grid-column:1/-1}
.top-actions{display:flex;gap:16px;align-items:center}
.top-actions .profile-link{gap:5px}
.profile-link{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:8px 0;font-size:15px;color:var(--t2)}
.profile-link svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.profile-link[aria-current="page"]{color:var(--ink);font-weight:700}
.profile-link[aria-current="page"] svg{stroke-width:2.1}
.profile-link[aria-current="page"] span{text-decoration:underline;text-underline-offset:6px;text-decoration-thickness:2px}
@media (hover:hover){.profile-link:hover{color:var(--ink)}}
#profileTitle{font-size:17px;margin:0}
.profile-tabs{display:flex;gap:8px;margin-top:16px;border-bottom:1px solid var(--line)}
.profile-tabs button{flex:1;min-width:0;min-height:48px;padding:8px 2px;border-bottom:2px solid transparent;font-size:15px;color:var(--t2);text-align:center}
.profile-tabs button[aria-selected="true"]{color:var(--ink);font-weight:700;border-bottom-color:var(--ink)}
@media (hover:hover){.profile-tabs button:hover{color:var(--ink)}}
.settings-group{border-bottom:1px solid var(--line);padding:8px 0}
.settings-group:first-of-type{border-top:1px solid var(--line)}
.settings-group summary small,.settings-nav small{display:block;font-size:13px;font-weight:400;color:var(--t2);margin-top:4px}
.settings-group .settings-body{padding:8px 0 20px}
.settings-group .settings-body p{font-size:15px;color:var(--t2);margin-bottom:12px;max-width:48ch}
.settings-group .settings-body p.s13{font-size:13px}
.settings-nav{width:100%;min-height:48px;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 0;text-align:left;font-size:15px}
/* Z139 (zgloszenie wlasciciela 19.10 „tak pusto, brak piktogramow”): piktogram przy kazdej pozycji Ustawien, w stylu ikon naglowka */
.set-ik{width:36px;height:36px;border-radius:10px;background:var(--selected);display:grid;place-items:center;flex:none}
.settings-group .set-ik svg{width:22px;height:22px;fill:none;stroke:var(--ink);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.set-ik .szklo{fill:var(--yel)}
.set-ik+b,.set-ik+span{flex:1;min-width:0}
.settings-nav::after{content:"";width:8px;height:8px;flex:none;border:solid currentColor;border-width:0 1.5px 1.5px 0;transform:rotate(-45deg);margin-right:6px}
.install-link{gap:10px;text-align:left;flex:1;min-width:0;font-weight:700}.install-icon{width:24px;height:24px;flex:none;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
#installNudge{display:flex;align-items:center;gap:8px;margin:16px 0;padding:4px 12px;background:var(--soft);border:1px solid var(--line);border-radius:12px;max-width:480px}
#dismissInstall{flex:none;margin-left:auto;width:48px;height:48px;display:grid;place-items:center}#dismissInstall svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round}
#installDialog ol{padding-left:22px;margin:16px 0}#installDialog li{padding-left:4px;margin:12px 0;font-size:15px}#installDialog p{margin-top:16px}#installDialog .install-icon{width:20px;height:20px;vertical-align:middle}
#topicsStatus:empty,#pushSettingsStatus:empty,#householdStatus:empty,#dataStatus:empty,#resetStatus:empty{display:none}
.topic-choice{display:flex;align-items:center;gap:8px;min-width:0}.topic-choice .fuel-mark{flex:none;margin:0;width:16px;height:16px}.topic-choice .fuel-mark svg{width:16px;height:16px;color:inherit}
#pushForm .field{margin-top:12px}
#pushQuietTimes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
#pushQuietTimes .field{margin:0}#pushQuietTimes input{min-width:0;width:100%}
#pushForm fieldset{margin:16px 0 12px}#pushForm fieldset legend{font-size:13px;color:var(--t2);margin-bottom:8px}
#pushStatus{font-weight:700;color:var(--ink);margin:0 0 8px}#pushPrivacy{font-size:13px}
#pushTestArea{scroll-margin-block:8px}
#pushPrivacyDialog p{margin-top:12px}
.member-edit{display:inline-flex;align-items:center;justify-content:center;min-width:48px;min-height:48px}.settings-group .member-edit svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
#settingsHousehold .household-row{display:flex;align-items:center;justify-content:space-between;gap:8px}#settingsHousehold .household-row>b{min-width:0}#settingsHousehold .household-row .actions{flex:none;gap:8px}
#settingsData .actions{align-items:center}#settingsData .actions .primary{width:auto;margin:0;padding:0 16px;min-height:48px;font-size:15px}
#resetStatus{font-size:13px;margin-top:8px}
.logo{display:inline-flex;align-items:center;gap:10px;font-size:17px;font-weight:700;letter-spacing:-.02em}
.brand-mark{display:grid;place-items:center;width:32px;height:32px;border-radius:8px;background:var(--yel);color:var(--yel-ink);font-size:17px;font-weight:700}
.brand-mark svg{width:32px;height:32px}.brand-mark path{fill:none;stroke:currentColor;stroke-width:10;stroke-linecap:round;stroke-linejoin:round}
/* Motyw klusek (25.09): krawedz splatana = nie wiemy, rozplatana = rada. Ozdoba, nie informacja - nie rysuje zadnych zaleznosci. */
.edge{flex:none;width:72px;height:36px;color:var(--t2);overflow:visible}.edge path{fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.edge .ball{fill:currentColor}.edge .ghost{fill:none;stroke:currentColor;stroke-width:1.4;stroke-dasharray:2 2}
#speak .topic{position:relative}#speak .topic .edge{position:absolute;top:0;right:0}
#speak .topic .name{padding-right:84px}
#quiet .quiet .edge{width:48px;height:24px;margin-left:auto;color:var(--field-line)}#quiet .quiet .edge path{stroke-width:2.4}
.edge path.past{stroke-dasharray:3 3}
.environment-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;background:var(--selected);border-bottom:1px solid var(--line)}.environment-bar .environment-note{border-bottom:0;flex:1}.environment-bar .link{margin-right:20px;font-size:13px;white-space:nowrap}
.scenario-list{display:grid;gap:6px;margin:8px 0 16px}.scenario-row{display:flex;align-items:center;gap:10px;justify-content:space-between;border:1px solid var(--line);border-radius:10px;padding:8px 12px}.scenario-row span{flex:1;font-size:15px}.scenario-row small{display:block;color:var(--t2);font-size:13px}
.scenario-save .actions{gap:8px;align-items:center}.scenario-save input{flex:1;min-width:0}.scenario-save .primary{width:auto;margin:0;padding:0 18px;min-height:44px}
.environment-note{padding:8px 20px;background:var(--selected);border-bottom:1px solid var(--line);font-size:13px;line-height:1.4;color:var(--ink)}
.view{flex:1;display:flex;flex-direction:column;padding:24px 20px 32px;min-width:0}

/* ---- Dziś ---- */
.lead{font-size:17px;font-weight:700;max-width:30ch}
.lead + .s13{margin-top:6px}
.topics{display:flex;flex-direction:column;gap:32px}
.topics:not(:empty) + .topics:not(:empty){margin-top:32px}
.lead:not([hidden]) ~ .topics:not(:empty){margin-top:32px}
.topic{display:block;width:100%;min-height:48px}
.topic .name{display:block;font-size:13px;color:var(--t2)}
.topic .word{display:block;font-size:40px;font-weight:700;letter-spacing:-.025em;word-spacing:.06em;line-height:1.05;margin:4px 0 10px}
.topic .say{display:block;font-size:17px;max-width:32ch}
.topic .more{display:block;font-size:15px;font-weight:500;margin-top:12px;text-decoration:underline;text-underline-offset:4px;text-decoration-color:var(--line)}
.topic.quiet .line{display:block;font-size:17px;color:var(--t2)}
.topic.quiet .last{display:block;font-size:13px;color:var(--t2);margin-top:3px}
.karta{border:1px solid var(--line);border-radius:16px;padding:20px;margin:0 0 16px;background:var(--bg)}
.karta .advice-actions{margin:16px 0 0}.karta .advice-actions .primary{width:auto;margin:0;padding:0 22px}
.karta .topic .name:first-child{color:var(--ink);font-weight:500}


main[data-tank-advice="true"] .crumb b{font-size:17px}
.foot{margin-top:40px;font-size:13px;color:var(--t2);line-height:1.4}

/* ---- dolny pasek ---- */
.nav{position:sticky;bottom:0;background:var(--bg);border-top:1px solid var(--line);display:flex;gap:4px;padding:6px 12px max(6px,env(safe-area-inset-bottom));z-index:2}
.nav button{flex:1;min-width:0;min-height:48px;text-align:center;font-size:13px;font-weight:500;color:var(--t2)}
#navTabs button{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;padding:6px 4px 12px}
#navTabs svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
#navTabs button[aria-selected="true"]{color:var(--ink);font-weight:700}
#navTabs button[aria-selected="true"] svg{stroke-width:2.1}
#navTabs button[aria-selected="true"]::after{content:"";position:absolute;bottom:4px;width:20px;height:3px;border-radius:2px;background:var(--ink)}
@media (hover:hover){#navTabs button:hover{color:var(--ink)}}
.news-bell{position:absolute;top:3px;left:calc(50% + 5px);width:14px;height:14px;border-radius:50%;background:var(--yel);display:grid;place-items:center}
#navTabs .news-bell svg{width:10px;height:10px;fill:var(--yel-ink);stroke:none}
.nav.back button{color:var(--ink);font-weight:700}

/* ---- szczegół ---- */
.sec{margin-top:36px}
.sec h3{font-size:15px;font-weight:700;margin:0 0 12px}
.crumb{font-size:17px;color:var(--t2)}   /* Z164 (review 20.10): naglowek szczegolu w rozmiarze naglowka, nie okruszka */
.view>.crumb{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:48px}
#v-on>.crumb,#v-pb95>.crumb,#v-gaz>.crumb{position:sticky;top:var(--top-h,56px);z-index:1;background:var(--bg);margin:0 -16px;padding:6px 16px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:48px}
.crumb-fuel{display:inline-flex;align-items:center;flex-wrap:wrap;gap:0 4px;min-width:0}.crumb-car{display:inline-flex;align-items:center;gap:6px;color:var(--ink);font-weight:700;font-size:15px;flex:none;max-width:55%}.crumb-car .car-icon{width:34px;height:22px;flex:none}.crumb-car-name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.crumb-car .tile-edit{position:static;width:40px;height:40px;margin:-6px -10px -6px 0;flex:none;display:grid;place-items:center;padding:0;color:var(--ink);border-radius:10px}.crumb-car .tile-edit svg{width:18px;height:18px;stroke-width:1.6}@media(hover:hover){.crumb-car .tile-edit:hover{background:var(--soft)}}   /* Z058 (wlasciciel 13.10): po przewinieciu nadal widac, ktore paliwo */
.crumb b{color:var(--ink)}
.crumb + .sec{margin-top:20px}
.sec.lead-sec h3{font-size:17px}
.sec p{font-size:15px;color:var(--t2);line-height:1.5;margin-bottom:12px;max-width:40ch}
.sec p:last-child{margin-bottom:0}
.sec .short-prices p{margin:0;max-width:none}
.sec p b{color:var(--ink)}
.slots{display:grid;grid-template-columns:repeat(auto-fit,minmax(72px,1fr));gap:6px}
@media(max-width:374px){.slots:has(>.slot:nth-child(4):last-child){grid-template-columns:repeat(2,minmax(0,1fr))}}
.slot{border:1px solid var(--line);border-radius:12px;min-height:60px;padding:9px 2px;text-align:center;display:flex;flex-direction:column;justify-content:center;gap:2px}
.slot .d{font-size:15px;font-weight:500;white-space:nowrap;letter-spacing:-.01em}
.slot .z{font-size:15px;font-variant-numeric:tabular-nums;color:var(--t2)}
.slot[aria-pressed="true"]{border:2px solid var(--ink);padding:8px 1px}
.slot[data-real="true"] .z{color:var(--ink);font-weight:700}
.slot[data-best="true"] .z,.slot .z{color:var(--ink);font-weight:700}.when-lead{margin:0 0 8px}   /* kierunek niesie znak; kolor zostaje dla "blad po naszej stronie" i "trafione" */
.ans{font-size:17px;color:var(--ink);margin:16px 0 6px;max-width:32ch}
.sec p.ans{font-size:17px;color:var(--ink)}
/* 27.09: ostatnia rada po swoim terminie - widoczna, ale nie wyrozniona jak aktualne zalecenie (po .sec p.ans: ta sama specyficznosc) */
main.rada-stara .crumb b,main.rada-stara .sec p.ans,main.rada-stara .sec p.ans b{color:var(--t2)}
main.rada-stara .slots{opacity:.6}
.karta.rada-stara .word,.karta.rada-stara .say,.karta.rada-stara .say b{color:var(--t2)}
.karta.rada-stara .rada-od,.topic .po-porze{margin-top:8px}
.sec p.s13{font-size:13px}
.fact{background:var(--sky);color:var(--sky-ink);border-radius:12px;padding:14px 16px;font-size:15px;line-height:1.45;margin-bottom:14px}
.sec p.fact{color:var(--sky-ink);max-width:none}
.sec p.fact b{color:inherit}
.field{display:flex;flex-direction:column;gap:6px;margin-top:12px}
.field label{font-size:13px;color:var(--t2)}
.field .with{display:flex;gap:10px;align-items:center}
.field .with span{font-size:15px;color:var(--t2);flex:none}
input,select,textarea{width:100%;min-height:48px;border:1px solid var(--field-line);border-radius:12px;background:var(--bg);padding:10px 14px;font-size:17px;font-variant-numeric:tabular-nums}
input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--ink);outline-offset:2px;border-color:var(--ink)}
select{appearance:none;padding-right:42px;background-image:var(--select-arrow);background-repeat:no-repeat;background-position:right 12px center;background-size:20px}
/* Style the open picker as well as its closed field; keep native selection semantics. */
@supports (appearance:base-select){@media not (forced-colors:active){
  select,select::picker(select){appearance:base-select}
  select{display:flex;align-items:center;justify-content:space-between;gap:12px;background-image:none;padding-right:14px;min-width:0}
  select::picker-icon{content:"";width:20px;height:20px;flex:none;background:var(--select-arrow) center/20px no-repeat}
  select:open::picker-icon{transform:rotate(180deg)}
  select::picker(select){font:inherit;color:var(--ink);background:var(--bg);border:1px solid var(--field-line);border-radius:12px;padding:4px;box-shadow:none;max-height:min(360px,60dvh);overflow:auto;overscroll-behavior:contain;max-width:calc(100vw - 24px)}
  select option{display:flex;align-items:center;gap:12px;min-height:48px;padding:10px 12px;border-radius:8px;white-space:normal;overflow-wrap:anywhere}
  select option:checked{background:var(--selected);font-weight:700}
  select option:focus{outline:2px solid var(--ink);outline-offset:-2px}
  select option::checkmark{order:1;margin-left:auto;color:var(--ink)}
  select option:disabled{color:var(--t2)}
  @media(hover:hover){select option:not(:disabled):hover{background:var(--soft)}select option:checked:hover{background:var(--selected)}}
}}
.litres-entry{display:flex;align-items:center;justify-content:space-between;gap:12px}
.litres-entry input{width:110px;flex:none}
#tankLitresRange,#tripKm,.car-config-range{appearance:none;width:100%;height:48px;padding:0;border:0;background:transparent;cursor:pointer;accent-color:var(--ink)}
#tankLitresRange::-webkit-slider-runnable-track,#tripKm::-webkit-slider-runnable-track,.car-config-range::-webkit-slider-runnable-track{height:6px;border-radius:4px;background:var(--field-line)}
#tankLitresRange::-moz-range-track,#tripKm::-moz-range-track,.car-config-range::-moz-range-track{height:6px;border-radius:4px;background:var(--field-line)}
#tankLitresRange::-webkit-slider-thumb,#tripKm::-webkit-slider-thumb,.car-config-range::-webkit-slider-thumb{appearance:none;width:28px;height:28px;border:2px solid var(--ink);border-radius:50%;background:var(--yel);margin-top:-11px}
#tankLitresRange::-moz-range-thumb,#tripKm::-moz-range-thumb,.car-config-range::-moz-range-thumb{width:24px;height:24px;border:2px solid var(--ink);border-radius:50%;background:var(--yel)}
#tripKm::-webkit-slider-thumb{width:22px;height:22px;margin-top:-8px}#tripKm::-moz-range-thumb{width:20px;height:20px}
.range-limits{display:flex;justify-content:space-between;font-size:13px;color:var(--t2);margin-top:-4px}
#mic-tank[data-rec=true]{font-weight:700;text-decoration:underline;text-underline-offset:4px}
.tank-transcript textarea{min-height:64px;resize:vertical;background:var(--soft);font-size:15px;line-height:1.45}
#tankDialog:has(#tankTranscriptField:not([hidden])){padding:14px}
#tankDialog:has(#tankTranscriptField:not([hidden])) .field{margin-top:8px}
#tankDialog:has(#tankTranscriptField:not([hidden])) .tank-transcript textarea{min-height:56px;resize:none}
#tankDialog:has(#tankTranscriptField:not([hidden])) #heard-tank{margin-top:4px}
#tankDialog:has(#tankTranscriptField:not([hidden])) .primary{margin-top:8px}
#selectDialog{width:min(420px,calc(100vw - 24px));max-height:calc(100dvh - 40px);padding:16px;border:1px solid var(--field-line);border-radius:18px;background:var(--bg);color:var(--ink);overscroll-behavior:contain}
#selectDialog::backdrop{background:var(--scrim)}
#selectDialog h2{font-size:17px;margin:0}
#selectOptions{display:flex;flex-direction:column;gap:4px;margin-top:12px}
#selectOptions button{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;min-height:48px;padding:10px 12px;border:1px solid transparent;border-radius:8px;overflow-wrap:anywhere}
#selectOptions button[aria-pressed=true]{background:var(--selected);font-weight:700;border-color:var(--field-line)}
#selectOptions button[aria-pressed=true]::after{content:'✓';flex:none}
#selectOptions button:disabled{color:var(--t2);cursor:default}
input::placeholder,textarea::placeholder{color:var(--t2);opacity:1}
/* Natywna semantyka i klawiatura, wspolny wyglad we wszystkich formularzach. */
input[type="checkbox"]{appearance:none;display:inline-grid;place-content:center;width:22px;height:22px;min-height:22px;flex:none;margin:0;padding:0;border:1.5px solid var(--field-line);border-radius:5px;background:var(--bg);color:var(--yel-ink);cursor:pointer}
input[type="checkbox"]::after{content:"";width:6px;height:11px;border:solid currentColor;border-width:0 2px 2px 0;transform:translateY(-1px) rotate(45deg);visibility:hidden}
input[type="checkbox"]:checked{background:var(--yel);border-color:var(--yel-ink)}
input[type="checkbox"]:checked::after{visibility:visible}
input[type="checkbox"]:disabled{cursor:default;opacity:1;background:var(--soft)}
input[type="checkbox"]:checked:disabled{background:var(--selected);border-color:var(--field-line);color:var(--ink)}
@media (forced-colors:active){
  input[type="checkbox"]{appearance:auto}
  input[type="checkbox"]::after{display:none}
  select{appearance:auto;background-image:none}
  #tankLitresRange{appearance:auto}
}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
@media (max-width:360px){.grid2{grid-template-columns:1fr}}

/* ---- Moje ---- */
.steps{display:flex;flex-direction:column;gap:36px}
.step .k{font-size:13px;color:var(--t2)}
.step .k.ok{color:var(--good)}
.step .t{font-size:17px;font-weight:700;margin:2px 0 4px}
.step .g{font-size:15px;color:var(--t2);max-width:36ch}
.step.locked .t{color:var(--t2);font-weight:500}
.step.locked .body,.step.locked .g{display:none}
.step.done .mic,.step.done .heard{display:none}   /* zolty tylko na biezacym kroku */
.mic{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;min-height:52px;border-radius:12px;background:var(--yel);color:var(--yel-ink);font-size:15px;font-weight:700;margin-top:10px}
.mic .dot{width:10px;height:10px;border-radius:50%;background:currentColor}
.mic[data-rec="true"] .dot{animation:pulse 1s ease-in-out infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.25}}
@media (prefers-reduced-motion:reduce){.mic[data-rec="true"] .dot{animation:none}}
.heard{font-size:13px;color:var(--t2);margin-top:8px;min-height:1.4em}
.heard .ok{color:var(--good);font-weight:700}
.primary{display:block;width:100%;min-height:52px;padding:12px 16px;border:1px solid transparent;border-radius:12px;background:var(--yel);color:var(--yel-ink);font-size:15px;font-weight:700;text-align:center;margin-top:12px}
@media (hover:hover){.primary:hover:not(:disabled),.mic:hover:not(:disabled){background:var(--yel-hover)}}
.primary:disabled{opacity:.35;cursor:default}
a.link{color:var(--ink)}   /* Z131: stopka i Ustawienia, bez domyslnego niebieskiego */
.link{font-size:15px;font-weight:500;text-decoration:underline;text-underline-offset:4px;text-decoration-color:var(--line);min-height:48px;display:inline-flex;align-items:center}
.danger{margin-top:48px}
.saved .per{font-size:15px;color:var(--t2);margin-top:8px}
.saved .ex{font-size:13px;color:var(--t2);margin-top:3px}
.tanks{list-style:none;margin:16px 0 0;padding:0;font-size:15px}
.tanks li{display:flex;justify-content:space-between;gap:10px;padding:10px 0;border-top:1px solid var(--line);font-variant-numeric:tabular-nums}
.tanks li span:last-child{color:var(--t2);text-align:right;font-size:13px}
.tanks .del{font-size:13px;color:var(--t2);text-decoration:underline;text-underline-offset:3px}

/* ---- Wyniki ---- */
.rows{list-style:none;margin:0;padding:0}
.rows li{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:12px 0;border-top:1px solid var(--line)}
.grp{margin-top:28px}
.grp > .s13{margin-bottom:4px}
.rows li.month{border-top:0;padding:24px 0 4px;font-size:13px;color:var(--t2)}
.rows .a{font-size:15px}
.rows .b{display:block;font-size:13px;color:var(--t2);font-variant-numeric:tabular-nums}
.rows .r{font-size:15px;white-space:nowrap;color:var(--t2)}
.rows .r.ok{color:var(--good);font-weight:700}.rows .r.miss{color:var(--bad);font-weight:700}

/* ---- start ---- */
.sheet{position:fixed;inset:0;margin:0 auto;width:100%;max-width:520px;max-height:none;height:100dvh;border:0;background:var(--bg);color:var(--ink);padding:0;overflow:hidden;overscroll-behavior:contain}
.sheet[open]{display:flex;flex-direction:column}
.sheet::backdrop{background:var(--scrim)}
.sheet .editor-head{display:flex;align-items:center;justify-content:space-between;gap:12px;flex:none;padding:12px 20px;border-bottom:1px solid var(--line)}
.sheet h2{font-size:17px;font-weight:700;line-height:1.4;margin:0}
.sheet .editor-content{flex:1;min-height:0;padding:16px 20px;overflow-y:auto;overscroll-behavior:contain}
.sheet .sub{font-size:15px;color:var(--t2);margin:0 0 16px}
.sheet p.s13{font-size:13px;color:var(--t2);margin:8px 0 12px}
.sheet .editor-end{flex:none;padding:12px 20px 24px;border-top:1px solid var(--line)}
.sheet .editor-end .primary{margin:0}
@media(min-width:544px){
  .sheet{inset:12px;margin:auto;width:calc(100% - 24px);height:fit-content;max-height:calc(100dvh - 24px);border:1px solid var(--line);border-radius:18px}
  .sheet .editor-content{flex:0 1 auto}
}
@media(min-width:700px){
  #pushDialog{max-width:780px}
  #pushForm{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px;align-items:start}
  #pushForm fieldset{margin:0 0 12px}
  #pushDialog .editor-end{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:20px;padding-bottom:12px}
  #pushDialog .editor-end p{margin:0}
  #pushSave{width:auto;padding-inline:20px}
}
@media(min-width:544px) and (max-height:500px){
  .sheet{max-width:780px}
  .sheet .editor-head{padding-block:4px}
  .sheet .editor-content{padding-block:12px}
  .sheet .editor-end{padding-block:8px}
}
.pick{display:flex;align-items:center;gap:14px;min-height:56px;padding:8px 0;border-top:1px solid var(--line);font-size:17px;cursor:pointer}
.pick:last-of-type{border-bottom:1px solid var(--line)}
.pick.off{color:var(--t2);cursor:default}
.pick small{display:block;font-size:13px;color:var(--t2)}
/* ---- audyt U1-U7 ---- */
#tlo{display:flex;flex-direction:column;flex:1}
.slot .dd{font-size:13px;color:var(--t2);font-variant-numeric:tabular-nums}
.slot .z:has(>.bak-ik){white-space:nowrap}.bak-ik{display:inline-block;vertical-align:-2px;margin-left:2px;color:var(--t2)}.bak-ik svg{display:block;width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.bak-ik .pal{fill:currentColor;stroke:none;opacity:.5}   /* Z125 */
.bak-przed{margin:0 5px 0 0}[id$="-fill-label"] .bak-ik svg,#carTanksTitle .bak-ik svg{width:21px;height:21px}[id$="-fill-label"] .bak-ik,#carTanksTitle .bak-ik{vertical-align:-4px}#addCarTank .bak-ik svg{width:18px;height:18px}#addCarTank .bak-ik{vertical-align:-3px}   /* 1,3 x (wlasciciel 19.10) */   /* Z131: przy suwaku 1,5 x wiekszy (wlasciciel 19.10) */.bak-pod{margin:2px auto 0}
@media(max-width:389px){.slots:has(>.slot:nth-child(4):last-child){gap:4px}}   /* Z125: kwota ze znakiem baku miesci sie od 375 px */
.slot{min-height:76px}
.err{font-size:13px;color:var(--bad);margin:6px 0 0}
input[aria-invalid="true"]{border-color:var(--bad)}
.grp-h{font-size:15px;font-weight:700;margin:0 0 16px}

#v-moje{gap:20px}#cars > .garage-item:first-child,#places > :first-child{margin-top:0}
#v-moje > .sec,#v-moje > section{margin-top:0}
#v-moje > .danger{margin-top:12px}
.tanks li{align-items:center}
.tanks .tx{flex:1;min-width:0}
.tanks .tx .a{display:block;color:var(--ink);font-size:15px;text-align:left}
.tanks .tx .b{display:block;font-size:13px;color:var(--t2);text-align:left}
.tanks .del{min-width:48px;min-height:48px;display:inline-flex;align-items:center;justify-content:center;flex:none}
.fact a,.sec p a{color:inherit;text-underline-offset:3px}
[tabindex="-1"]:focus{outline:none}
/* Profil i podsumowania: te same kolory, jawne etykiety zamiast samego koloru. */
.garage-item{border:1px solid var(--line);border-radius:12px;padding:20px;margin:16px 0}
.car-heading{display:flex;align-items:center;gap:14px;margin-bottom:14px}
.car-heading h3{font-size:17px;margin:0;overflow-wrap:anywhere}
.car-icon{width:64px;height:42px;flex:none;color:var(--ink)}
.fuel-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 0;border-top:1px solid var(--line);font-size:15px}
.fuel-row b{white-space:nowrap}
.car-switches{display:grid;grid-template-columns:minmax(0,1fr);gap:8px;padding:4px 0 10px}
.car-switch{display:grid;grid-template-columns:48px minmax(0,1fr);column-gap:12px;align-items:center;min-width:0;width:100%;border:1px solid var(--line);border-radius:12px;padding:10px;min-height:72px}
.car-switch[aria-pressed="true"]{border:2px solid var(--ink);padding:9px}
.car-switch span{display:block;font-size:13px;overflow-wrap:anywhere}
.car-switch .car-icon{width:48px;height:32px;grid-row:1 / 3}
.car-overview{min-width:0;margin-bottom:20px}
.car-overview-head{display:flex;align-items:center;gap:6px}
.head-add{width:36px;height:36px;display:grid;place-items:center;border-radius:50%;color:var(--ink);margin:-6px 0}
.head-add svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
@media (hover:hover){.head-add:hover{background:var(--soft)}}.head-add:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
.car-overview-head{display:flex;align-items:center;justify-content:flex-start;gap:2px;margin-bottom:8px}
.car-overview-head h2{font-size:15px;margin:0}
/* Trzy auta muszą być widoczne w całości także przy 320 px. Bez karuzeli. */
#todayCars:empty{display:none}
.car-tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.car-tile{position:relative;min-width:0;border:1px solid var(--field-line);border-radius:12px;padding:6px;align-self:stretch;display:flex;flex-direction:column;gap:3px;background:var(--bg)}
.car-tile[data-action="wait"]{background:var(--soft)}
.car-tile[data-action="tank"]{background:var(--selected)}
.car-tile[data-action="tank"]{box-shadow:inset 0 0 0 2px var(--yel)}   /* wlasciciel 26.09: wewnetrzna zolta ramka zamiast paska u gory */
.car-tile[aria-pressed="true"]{border:2px solid var(--ink);padding:5px}
.car-tile-top{display:flex;align-items:center;justify-content:space-between;gap:4px;height:20px}
.car-tile .car-icon{width:32px;height:20px}
.car-tile-check{display:none}
.profile-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px}#profileHousehold{font-weight:400;margin-left:6px;overflow-wrap:anywhere}#profileHousehold:not(:empty)::before{content:"· ";}
#feedbackMine{margin-top:20px;border-top:1px solid var(--line);padding-top:12px}#feedbackMine h3{font-size:15px;margin:0 0 4px}
#feedbackMineList{list-style:none;margin:0;padding:0}#feedbackMineList li{padding:10px 0;border-bottom:1px solid var(--line);font-size:15px}
#feedbackMineList li:last-child{border-bottom:0}#feedbackMineList small{display:block;color:var(--t2);font-size:13px;margin-top:2px}
.fb-stan{display:inline-block;font-size:13px;font-weight:700;padding:1px 8px;border-radius:6px;margin-right:6px;background:var(--soft)}
.fb-stan[data-stan="done"]{background:var(--selected)}#profileAdd{font-size:15px;font-weight:700;text-decoration:none;min-height:44px;white-space:nowrap}
.tile-wrap{position:relative;min-width:0;display:flex}.tile-wrap > .car-tile{flex:1}
.tile-edit{position:absolute;top:0;right:0;width:30px;height:30px;display:grid;place-items:start end;padding:6px 6px 0 0;color:var(--field-line);border-radius:0 12px 0 8px}
.tile-edit svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round}
@media (hover:hover){.tile-edit:hover{color:var(--ink);background:var(--soft)}}
.tile-edit:focus-visible{outline:2px solid var(--ink);outline-offset:-2px}
.car-tile-name{font-size:13px;font-weight:700;line-height:18px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.car-tile-fuels{display:flex;flex-direction:column;gap:0;margin-top:auto;font-size:13px;line-height:18px}
.car-tile-fuels span{overflow-wrap:anywhere}
.car-tile-fuels .trip-fuel-result{display:flex;justify-content:space-between;gap:3px}.trip-fuel-result b{font-weight:inherit;font-variant-numeric:tabular-nums}.trip-fuel-result[data-net="loss"]{color:var(--bad)}
@media(min-width:700px){.car-overview{grid-column:1/-1;margin-bottom:0}.car-tiles{grid-template-columns:repeat(6,minmax(0,140px));gap:8px}}
.current-car{display:flex;gap:14px;align-items:center;min-width:0}.current-car > div{min-width:0;overflow-wrap:anywhere}.current-car h3{font-size:17px;margin:0 0 4px}.current-car p{font-size:13px;color:var(--t2)}
#todayActions{margin:0 0 28px}#todayActions .primary{margin-top:0}#tankSaved{font-size:15px;margin-top:8px}#tankHistoryEmpty{font-size:15px;color:var(--t2)}
#tankTotal{font-size:17px;margin:16px 0 0}#tankDialogCar{margin-bottom:8px;font-weight:700;overflow-wrap:anywhere}
#chooseCarList{margin-top:12px}#chooseCarEmpty{font-size:15px;padding:12px 0}
#carDialog,#chooseCarDialog,#tankDialog,#deferDialog,#tipsDialog,#placeDialog,#planDialog,#backupDialog,#restoreDialog,#syncDialog,#deleteSyncDialog,#joinDialog,#memberDialog,#purchaseDialog,#assignPersonDialog,#feedbackDialog,#chartHelp,#pushMsgDialog,#pushListDialog,#dataLicenses,#unsavedDialog,#shareDialog,#pushPrivacyDialog,#scenarioDialog,#installDialog{border:1px solid var(--line);border-radius:18px;background:var(--bg);color:var(--ink);width:calc(100% - 24px);max-width:480px;max-height:calc(100dvh - 24px);padding:20px;overflow-y:auto}
#carDialog::backdrop,#chooseCarDialog::backdrop,#tankDialog::backdrop,#deferDialog::backdrop,#tipsDialog::backdrop,#placeDialog::backdrop,#planDialog::backdrop,#backupDialog::backdrop,#restoreDialog::backdrop,#syncDialog::backdrop,#deleteSyncDialog::backdrop,#joinDialog::backdrop,#memberDialog::backdrop,#purchaseDialog::backdrop,#assignPersonDialog::backdrop,#feedbackDialog::backdrop,#chartHelp::backdrop,#pushMsgDialog::backdrop,#pushListDialog::backdrop,#dataLicenses::backdrop,#unsavedDialog::backdrop,#shareDialog::backdrop,#pushPrivacyDialog::backdrop,#scenarioDialog::backdrop,#installDialog::backdrop{background:var(--scrim)}
#carDialog h2,#chooseCarDialog h2,#tankDialog h2,#deferDialog h2,#tipsDialog h2,#placeDialog h2,#planDialog h2,#backupDialog h2,#restoreDialog h2,#syncDialog h2,#deleteSyncDialog h2,#joinDialog h2,#memberDialog h2,#purchaseDialog h2,#assignPersonDialog h2,#feedbackDialog h2,#chartHelp h2,#pushMsgDialog h2,#pushListDialog h2,#dataLicenses h2,#unsavedDialog h2,#shareDialog h2,#pushPrivacyDialog h2,#scenarioDialog h2,#installDialog h2{font-size:17px;margin:0}#carDialog h3,#placeDialog h3{font-size:15px;margin:20px 0 8px}
#feedbackFields{border:0;padding:0;margin:0;min-width:0}
#feedbackMessage{resize:vertical;min-height:128px}
#feedbackDraftNote:not(:empty){margin-top:12px}
#feedbackStatus:not(:empty){margin-top:20px}
#feedbackSend:disabled{opacity:.65;cursor:wait}
.dialog-title{justify-content:space-between;align-items:center}
.form-head{position:sticky;top:-20px;z-index:3;display:flex;gap:12px;align-items:center;background:var(--bg);margin:-20px -20px 16px;padding:12px 20px;border-bottom:1px solid var(--line)}
.form-head h2{flex:1;text-align:center;margin:0}.form-head .head-save{width:auto;min-height:40px;margin:0;padding:0 18px}
#unsavedDialog{max-width:360px}#unsavedDialog .actions{gap:12px;align-items:center}#unsavedDialog .primary{width:auto;margin:0;padding:0 22px}
.icon-field{border:0;padding:0;margin:20px 0}.icon-field legend{font-size:13px;color:var(--t2);margin-bottom:8px}
.icon-choices{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
.icon-choice{border:1px solid var(--field-line);border-radius:12px;padding:8px 2px;position:relative;text-align:center;cursor:pointer;font-size:13px}
.icon-choice:has(input:checked){border:2px solid var(--ink);padding:7px 1px}
.icon-choice:has(input:focus-visible){outline:2px solid var(--ink);outline-offset:3px}
.icon-choice input{position:absolute;opacity:0;width:1px;height:1px;min-height:0;padding:0}
.icon-choice .car-icon{display:block;margin:0 auto;width:48px;height:32px;max-width:100%}
.tank-editor{border:1px solid var(--line);border-radius:12px;padding:12px;margin:12px 0}.tank-foot{display:flex;align-items:center;gap:12px}
#carDialog{max-width:560px}.tank-fields{display:flex;flex-wrap:wrap;gap:8px 10px}.tank-fields>.field{flex:1 1 0;min-width:0;margin-top:0;gap:4px}.tank-fields>.tank-fuel{flex-grow:1.2}   /* Z164 (wlasciciel 21.10): paliwo, litry i spalanie w jednym wierszu; szersze okno, by sie zmiescily */
.tank-editor input:not([type=range]),.tank-editor select{min-width:0;padding:10px}
.tank-editor select{padding-right:34px;background-position:right 8px center;white-space:nowrap;text-overflow:ellipsis}
@media (max-width:480px){.tank-fields>.tank-fuel{flex-basis:100%}}   /* telefon: paliwo nad litrami i spalaniem */
@media (max-width:360px){#carIcons{grid-template-columns:repeat(2,minmax(0,1fr))}}
#carSummary{margin-top:12px}

.garage-item p{margin:4px 0;font-size:13px;color:var(--t2)}
.actions{display:flex;flex-wrap:wrap;gap:18px}
.car-context{margin-bottom:24px}
.score-bar{display:flex;height:14px;border-radius:7px;overflow:hidden;background:var(--line);margin:16px 0}
.score-bar .hit{background:var(--good)}.score-bar .miss{background:var(--bad)}
.score-counts{display:grid;grid-template-columns:1fr 1fr;gap:12px;font-size:15px}
.week-result{padding:12px 0;border-bottom:1px solid var(--line);font-size:15px}
/* Z069: zestawienie rad - kafelki tematow (jak kafelki Wynikow), znaczki rad: ksztalt + kolor + legenda */
#forecastResults>h2{margin:0 0 12px}.wy-filters{margin-bottom:8px}.wy-filters{align-items:end}.wy-filters .field{margin-top:0}   /* Z164 (wlasciciel 21.10): oba wybory na jednej wysokosci, takze przy zawinietej etykiecie */
.advice-topics{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px;margin:16px 0 8px}
.advice-topic{display:flex;flex-direction:column;align-items:flex-start;gap:2px;min-width:0;padding:10px;border:1px solid var(--line);border-radius:12px;background:var(--bg);color:var(--ink);text-align:left;font:inherit;cursor:pointer}
.advice-topic .at-name{font-size:13px;color:var(--t2)}.advice-topic strong{font-size:17px;line-height:1.25}.advice-topic small{font-size:13px;color:var(--t2)}
.advice-topic[aria-pressed="true"]{background:var(--selected);border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
.advice-topic:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
.dots{display:flex;flex-wrap:wrap;gap:3px;margin-top:6px}
.dot{display:inline-grid;place-items:center;width:17px;height:17px;border-radius:50%;font-size:13px;font-weight:700;line-height:1;vertical-align:-3px;box-sizing:border-box}   /* Z069: 13 px - jeden z czterech rozmiarow pisma */
.dot.ok{background:var(--good);color:var(--bg)}.dot.miss{background:var(--bad);color:var(--bg)}.dot.flat{background:var(--line);color:var(--ink)}.dot.wait{border:1.5px solid var(--field-line)}
.advice-legend{display:flex;flex-wrap:wrap;align-items:center;gap:4px 12px;margin:4px 0 12px}.advice-legend .lg{display:inline-flex;align-items:center;gap:4px;white-space:nowrap}
#wyCounts.score-counts{display:flex;flex-wrap:wrap;gap:4px 12px;font-size:13px;color:var(--t2)}#wyCounts>div{display:inline-flex;align-items:center;gap:4px;color:var(--t2)}
.week-result .dots{margin:4px 0 2px}
@media (forced-colors:active){.dot{border:1px solid CanvasText}.advice-topic[aria-pressed="true"]{border:2px solid Highlight}}
.week-result p{font-size:13px;color:var(--t2)}

.quick-prices{margin-bottom:24px}
#quickPrices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:8px}
#quickPrices button{border:1px solid var(--line);border-radius:8px;padding:8px 4px;min-height:72px;text-align:center}
#quickPrices strong,#quickPrices small{display:block;font-size:13px}
#quickPrices small{color:var(--t2)}
#quickPrices .price-unavailable > span:first-of-type{font-size:13px;line-height:1.35}
/* Paliwo: leciutki odcien kafelka ceny + znak EU (EN 16942: kolo benzyna, kwadrat diesel, romb gaz). Rada zostaje zolta;
   kolor paliwa przechodzi wtedy na pasek z lewej, zeby zolty zawsze znaczyl "dzialaj", a kolor - "ktore paliwo". */
[data-fuel="pb95"]{--fuel:var(--fuel-pb95);--fuel-bg:var(--fuel-pb95-bg)}[data-fuel="on"]{--fuel:var(--fuel-on);--fuel-bg:var(--fuel-on-bg)}
[data-fuel="gaz"]{--fuel:var(--fuel-gaz);--fuel-bg:var(--fuel-gaz-bg)}[data-fuel="opal"]{--fuel:var(--fuel-opal);--fuel-bg:var(--fuel-opal-bg)}[data-fuel="lpg"]{--fuel:var(--fuel-lpg);--fuel-bg:var(--fuel-lpg-bg)}[data-fuel="pigs"]{--fuel:var(--fuel-pigs);--fuel-bg:var(--fuel-pigs-bg)}
#quickPrices button[data-fuel]{background:var(--fuel-bg)}
.fuel-mark{display:inline-block;width:11px;height:11px;margin-right:5px;vertical-align:-1px;color:var(--fuel)}
.fuel-mark svg{display:block;width:11px;height:11px}.fuel-mark path,.fuel-mark circle,.fuel-mark rect{fill:none;stroke:currentColor;stroke-width:2}
.fuel-mark ellipse{fill:none;stroke:currentColor;stroke-width:1.6}.fuel-mark circle[fill]{fill:currentColor;stroke:none}   /* ryjek tucznikow (27.09) */

@media (forced-colors:active){#quickPrices button[data-fuel]{background:Canvas}}
.price-chart{max-width:620px}
.short-prices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;font-size:15px;margin:12px 0}.short-prices p{min-width:0}.short-prices strong{overflow-wrap:anywhere}
.short-prices p{background:var(--soft);border-radius:8px;padding:10px 8px}
.short-prices strong,.short-prices small{display:block}
.short-prices small{font-size:13px;color:var(--t2)}
.view>.short-prices{margin-top:20px}.view>.short-prices p{margin:0}   /* Z164: rzad cen Miejsc bezposrednio pod naglowkiem */
.price-chart svg{display:block;max-height:310px}
.chart-history{stroke:var(--ink);fill:none;stroke-width:2.5}
.chart-forecast{stroke:var(--forecast);fill:none;stroke-width:2.5;stroke-dasharray:6 4}
.chart-band{fill:var(--forecast);fill-opacity:.16;stroke:none}
.chart-range-edge{stroke:var(--forecast);stroke-opacity:.5;stroke-width:1;fill:none}
.chart-boundary{stroke:var(--t2);stroke-dasharray:2 4}
.chart-limit{stroke:var(--limit);stroke-width:1.5;fill:none}.chart-limit-ours{stroke:var(--limit-ours);stroke-width:2;stroke-dasharray:4 3}
/* Z114: legenda limitow tuz pod wykresem */
.limit-legend{margin:4px 0 8px}.chart-legend .limit-key:before{border-top:2px solid var(--limit)}.chart-legend .limit-key-ours:before{border-top:2px dashed var(--limit-ours)}
.chart-grid{stroke:var(--line)}
.chart-label{fill:var(--t2);font-size:13px;font-family:inherit}
.chart-legend{display:flex;flex-wrap:wrap;column-gap:16px;row-gap:8px;font-size:13px;margin:8px 0}
.chart-legend span:before{content:'';display:inline-block;vertical-align:middle;width:24px;margin-right:6px;border-top:3px solid var(--ink)}
.chart-legend .range-key:before{border:1px solid var(--forecast);height:10px;background:var(--selected)}
.chart-legend .forecast-key:before{border-color:var(--forecast);border-top-style:dashed}
.tank-simulation{max-width:620px}
.slots{max-width:620px}   /* 27.09: kafelki dni w tej samej kolumnie co wykres i bak (na szerokim ekranie wystawaly o 36 px) */
/* 27.09: kafelki paliw z wykresikiem i rada (usuwac razem z kafelkiPaliw) */
.spark{display:block;width:100%;height:28px}
.spark polyline{fill:none;stroke-width:2;stroke-linejoin:round;stroke-linecap:round;vector-effect:non-scaling-stroke}.spark-h{stroke:var(--ink)}.spark-f{stroke:var(--forecast);stroke-dasharray:3 3}
.spark-b{fill:var(--forecast);fill-opacity:.16}.spark-dot{stroke:var(--ink);stroke-width:5;stroke-linecap:round;vector-effect:non-scaling-stroke}.spark-fdot{stroke:var(--forecast);stroke-width:3;stroke-linecap:round;vector-effect:non-scaling-stroke}.spark-axis{fill:none;stroke:var(--t2);stroke-opacity:.45;stroke-width:.75;vector-effect:non-scaling-stroke}
#quickPrices .qp-spark{display:block;margin:2px 4px 0}#quickPrices .qp-spark .spark{height:24px}#quickPrices button:has(.qp){padding:6px 4px;display:flex;flex-direction:column;justify-content:flex-start}   /* tresc od gory: wykresiki w jednej linii, takze gdy obok jest slowo rady; Z164: wspolne wiersze nizej (subgrid) */#quickPrices .qp-word{display:block;font-size:15px;font-weight:700;color:var(--ink)}#quickPrices .qp-prog{display:block;font-size:13px;color:var(--t2);white-space:nowrap}
/* Z164 (review 20.10): wspolne wiersze dla rzedu kafelkow - cena w dwoch liniach („ok.” na 320 px) nie przesuwa wykresiku ani slowa rady obok */
#quickPrices>button,#quickPrices>button:has(.qp){display:grid;grid-row:span 6;grid-template-rows:subgrid;grid-template-columns:minmax(0,1fr);row-gap:0;align-content:start}
#quickPrices>button>strong{grid-row:1}#quickPrices>button>span:not(.qp){grid-row:2;align-self:end}#quickPrices>button>small{grid-row:3}#quickPrices .qp-spark{grid-row:4}#quickPrices .qp-word{grid-row:5}#quickPrices .qp-prog{grid-row:6}
#quickPrices button[data-rada="tank"]{box-shadow:inset 0 0 0 2px var(--yel)}
#todayContext:not([hidden]) + .quick-prices{margin-top:12px}
#v-dzis:has(> #todayContext:first-child:not([hidden])){padding-top:4px}   /* przelacznik tuz pod naglowkiem (wlasciciel 27.09: za duzo wolnego) */
main.view>.advice-actions{margin:8px 0 0}   /* zapis tuz pod decyzja; odstep do kosztu baku daje .sec */
.detail-links{display:flex;flex-direction:column;align-items:flex-start}   /* 27.09: linki na koncu szczegolu razem, rowny odstep */
.site-foot{display:flex;align-items:center;gap:12px;margin:24px 20px 0;padding:16px 0 max(16px,env(safe-area-inset-bottom));border-top:1px solid var(--line)}
.site-foot .brand-mark{width:32px;height:32px;flex:none}.foot-text{flex:1;min-width:0;font-size:13px;line-height:1.4;color:var(--t2)}.foot-text{display:flex;flex-direction:column;gap:2px}.foot-links{display:flex;flex-direction:column;align-items:flex-end;flex:none}.foot-links a.link{min-height:28px;font-size:13px}   /* Z136: dwie zwarte kolumny - nazwa z haslem po lewej, linki jeden pod drugim po prawej */.site-foot b{color:var(--ink);font-size:15px}   /* 27.09: polecanie w jednym rzedzie z nazwa */
#shareFooter{min-height:28px;font-size:13px;color:var(--ink)}
@media(min-width:720px){.site-foot{width:620px;margin-left:calc(50% - 328px)}   /* 27.09 stopka: ta sama kolumna co tresc widoku (720 - 2x32) i szerokosc wykresu */
  body:has(#v-dzis:not([hidden]),#v-tematy:not([hidden]),#v-moje:not([hidden]),#v-wyniki:not([hidden])) .site-foot{width:auto;margin-inline:32px}}   /* Z164: widoki bez limitu 720 maja stopke na swojej siatce */
#publicTopicLinks{margin:36px 20px 0;font-size:15px;line-height:2}#publicTopicLinks a{color:var(--ink);text-underline-offset:3px}   /* Z123: strony bez JS w kolumnie stopki, nie od krawedzi ekranu */
@media(min-width:720px){#publicTopicLinks{width:620px;margin-left:calc(50% - 328px)}}
.tank-simulation output{display:block;font-size:15px;margin-top:4px}.tank-simulation output b{font-weight:700}
.chart-scrub{touch-action:pan-y;cursor:crosshair}.chart-scrub:focus-visible{outline:2px solid var(--ink);outline-offset:3px;border-radius:4px}
.chart-cursor line{stroke:var(--ink);stroke-width:1}.chart-cursor circle{fill:var(--ink)}.chart-cursor[data-forecast=true] circle{fill:var(--forecast)}
.chart-cursor text{fill:var(--ink);font-size:13px;font-weight:700;font-family:inherit}
.chart-cursor text.chart-range-label{fill:var(--forecast);font-weight:500}   /* Z090: zakres pasma w kolorze prognozy */
.chart-forecast-label{fill:var(--forecast);paint-order:stroke;stroke:var(--bg);stroke-width:3px;stroke-linejoin:round}
[id$="-history-note"]{display:inline}.chart-help-link{display:inline;font-size:13px;margin-left:6px;min-height:0;padding:0}[id$="-history-note"][hidden]+.chart-help-link{margin-left:0}   /* Z127: sam link pod wykresem */
.price-chart{margin-top:20px}
[id$="-context"]:empty{display:none}
#dataLicenses a{color:var(--ink);text-underline-offset:4px}
#dataLicenses p,#chartHelp p{font-size:15px;color:var(--t2);margin:0 0 12px;max-width:40ch}#chartHelp p b{color:var(--ink)}
.topic-open strong{font-weight:400}.topic-open .edge{width:48px;height:24px;color:var(--field-line);margin-left:auto}
.garage-item{position:relative}.garage-item .car-heading{display:flex;align-items:center}
.card-open{margin-left:auto;font-size:17px;line-height:1;color:var(--t2);padding:8px;min-width:44px;min-height:44px}.card-open::after{content:'';position:absolute;inset:0;border-radius:12px}
#todayCars:has(> .link:only-child){display:flex;justify-content:flex-end;margin:-8px 0 8px}#todayCars > .link:only-child{font-size:15px}
.report-chips{display:flex;flex-wrap:wrap;gap:8px 12px;align-items:flex-end;margin-bottom:8px}.report-chips .grid2{display:contents}.report-chips .field{margin:0}
.report-chips label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.report-chips select{width:auto;min-height:44px;padding:8px 36px 8px 14px;border-radius:22px;font-size:15px}
.link.danger{color:var(--bad);margin-top:16px}
.tank-simulation input[type=range]{appearance:none;width:100%;height:48px;min-height:48px;margin:0;padding:0;border:0;border-radius:0;background:transparent;cursor:pointer}
.tank-simulation input[type=range]::-webkit-slider-runnable-track{height:8px;border-radius:8px;background:linear-gradient(90deg,var(--reserve) 0 12.5%,var(--field-line) 12.5% 100%)}
.tank-simulation input[type=range]::-moz-range-track{height:8px;border-radius:8px;background:linear-gradient(90deg,var(--reserve) 0 12.5%,var(--field-line) 12.5% 100%)}
.tank-simulation input[type=range]::-webkit-slider-thumb{appearance:none;width:26px;height:26px;margin-top:-9px;border:2px solid var(--ink);border-radius:50%;background:var(--yel)}
.tank-simulation input[type=range]::-moz-range-thumb{width:22px;height:22px;border:2px solid var(--ink);border-radius:50%;background:var(--yel)}
.tank-simulation input[type=range][data-low=true]::-webkit-slider-thumb,.tank-simulation input[type=range][data-low=true]::-moz-range-thumb{background:var(--reserve)}
.tank-simulation input[type=range]:disabled{cursor:default}
.tank-simulation input[type=range]:disabled::-webkit-slider-runnable-track,.tank-simulation input[type=range]:disabled::-moz-range-track{background:var(--line)}
.fill-stops{position:relative;height:104px;margin-top:6px}
.fill-stops button{position:absolute;top:0;left:clamp(24px,calc(13px + (100% - 26px)*var(--position)),calc(100% - 24px));transform:translateX(-50%);width:48px;min-height:40px;text-align:center;padding:0;border-radius:8px;border:1px solid var(--field-line);background:var(--bg);color:var(--ink);font-size:15px}   /* Z058: nieaktywne z obrysem, bez wypelnienia */
.fill-stops{height:52px}
.fill-stops button[aria-pressed=true]{background:var(--selected);border-color:var(--ink);font-weight:600}
.fill-stops button[data-low=true][aria-pressed=true]{border-color:var(--reserve);color:var(--reserve)}
.tank-simulation output{display:block;font-size:15px;margin-top:12px}
@media(forced-colors:active){.chart-limit{stroke:CanvasText}.chart-history{stroke:CanvasText}.chart-forecast{stroke:LinkText}.chart-boundary{stroke:CanvasText}.chart-band{fill:Highlight;fill-opacity:.15;forced-color-adjust:none}.chart-range-edge{stroke:LinkText;stroke-opacity:1}.fill-stops button[aria-pressed=true]{border:2px solid Highlight}.tank-simulation input[type=range]{appearance:auto;accent-color:Highlight}}

.price-history svg{width:100%;height:auto;color:var(--ink)}
.price-history summary{min-height:48px;cursor:pointer;font-size:15px;font-weight:500;padding:12px 0;list-style:none;display:flex;align-items:center;justify-content:space-between;gap:16px}
.price-history summary::-webkit-details-marker{display:none}
.price-history summary::after{content:"";width:8px;height:8px;flex:none;border:solid currentColor;border-width:0 1.5px 1.5px 0;transform:translateY(-2px) rotate(45deg);margin-right:6px}
.price-history[open]>summary::after{transform:translateY(2px) rotate(225deg)}
.price-history .ends{display:flex;justify-content:space-between;gap:12px;font-size:13px}
.topic-list{list-style:none;margin:0;padding:0}
.topic-row{border-bottom:1px solid var(--line);min-width:0}
.topic-open{display:flex;align-items:center;gap:12px;width:100%;min-height:64px;padding:12px 0}
.topic-open > span:first-child{flex:1;min-width:0;overflow-wrap:anywhere}
.topic-open strong,.topic-open small{display:block;font-size:15px}
.topic-open small{font-size:13px;color:var(--t2);margin-top:3px}
.topic-open[data-advice="true"] small{color:var(--ink);font-weight:700}
.topic-open[data-tank-advice="true"] small{display:inline-block;background:var(--yel);color:var(--yel-ink);padding:4px 8px;border-radius:6px;margin-top:6px}
.topic-follow{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--t2);min-height:48px;padding-bottom:10px}
#topicGroups .sec{margin-top:24px}
#topicGroups .topic-row{display:grid;grid-template-columns:minmax(0,1fr) 88px;gap:16px}
#topicGroups .topic-follow{flex-direction:column;justify-content:center;gap:4px;padding:8px 0;text-align:center;cursor:pointer}
#otherSummary{margin-bottom:20px;min-height:44px;font-size:15px}
#otherTopics h3,#topicsTitle{font-size:17px;margin:0 0 8px}
#otherTopics .actions{margin-top:12px}

/* Te same komponenty na telefonie i komputerze, bez makiety telefonu na szerokim ekranie. */
.today-main{min-width:0}
.car-context{border:1px solid var(--line);border-radius:12px;padding:16px;margin-bottom:12px}
.current-car .car-icon{width:48px;height:32px}
.car-context .actions{gap:8px;justify-content:space-between;margin-top:8px}
.car-context .actions .link{font-size:13px;min-height:40px}
#todayActions{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;margin-bottom:32px}
#todayActions .primary{min-height:48px;padding:12px}
#openTankHistory{font-size:15px}
.action-receipt{padding:16px;margin:16px 0;background:var(--soft);border:1px solid var(--line);border-radius:12px;scroll-margin-top:80px}
.action-receipt p{margin:0}.action-receipt .actions{gap:8px;margin-top:8px;flex-wrap:wrap}
.action-receipt button{font-size:15px;white-space:normal;text-align:left}
#spendingHistory{scroll-margin-top:80px}
.detail-follow{display:inline-flex;align-items:center;gap:8px;min-height:48px;margin-left:auto;font-size:13px;color:var(--t2);cursor:pointer;flex:none}.detail-follow[hidden]{display:none}   /* Z164: to samo pole co w katalogu, obok naglowka */#fresh:empty{display:none}
#tankSaved{grid-column:1/-1}
#otherSummary{margin-bottom:16px}
#otherTopics{margin-top:32px}
#otherTopics .topic-row:last-child{border-bottom:0}
@media (hover:hover){.topic-open:hover strong,.link:hover{text-decoration:underline;text-underline-offset:4px}}   /* bez „przyklejonego” podkreslenia po dotknieciu na telefonie */
#topicGroups .sec{margin-top:28px}
#topicGroups h3{font-size:17px;padding-bottom:12px;border-bottom:2px solid var(--ink)}
#topicGroups .topic-row{gap:12px}
#topicGroups .topic-follow{border-radius:8px}
@media (hover:hover){#topicGroups .topic-follow:has(input:enabled):hover{background:var(--soft)}}
#topicGroups .topic-follow:has(input:disabled){cursor:default}
.slot[aria-pressed="true"]{background:var(--selected)}
.car-switch[aria-pressed="true"],.icon-choice:has(input:checked){background:var(--selected)}
@media (min-width:700px){
  .top{padding:16px 32px;grid-template-columns:auto minmax(0,1fr) auto;gap:24px}
  .top .top-actions{grid-column:3;grid-row:1}
  .top #fresh{grid-column:2;grid-row:1;text-align:right}
  .view{padding:32px;width:100%;max-width:720px;margin-inline:auto}
  #v-dzis,#v-tematy,#v-moje,#v-wyniki{max-width:none}
  #v-dzis{display:grid;grid-template-columns:minmax(0,1fr);gap:20px;align-content:start}
  #otherTopics{margin-top:0;align-self:start}
  #topicGroups{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
  #topicGroups .topic-row{grid-template-columns:minmax(0,1fr)}
  #topicGroups .topic-follow{flex-direction:row;justify-content:flex-start;padding:8px 0 16px}
  #cars,#places{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:16px}
  .garage-item{margin:0}
  #newCar,#newPlace{max-width:360px;margin-top:20px}
  .nav{justify-content:center;padding-inline:24px;gap:8px}
  .nav button{max-width:160px}
}

#placeIcons{grid-template-columns:repeat(3,minmax(0,1fr))}
.place-card{min-width:0}.place-card .fuel-row{align-items:start}.place-card .fuel-row b{white-space:normal;text-align:right}
.place-resource{margin:16px 0;border:1px solid var(--line);border-radius:12px;padding:12px}
.place-resource .pick{padding:0;border:0;margin:0;min-height:48px}
.place-context{margin-top:16px;font-size:13px;color:var(--t2)}
.place-context label{display:block;margin-bottom:6px}
.place-context select{font-size:15px}
.place-context .link{font-size:13px}
#placeStatus{margin-top:8px}
#openPlan,#planSummary{grid-column:1/-1}#openPlan{display:none}.lead-sec .slots{margin-top:4px}
.when-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 8px}.when-head h3{margin:0}.when-go-group{display:flex;align-items:center;gap:8px;flex:none}.when-go-group .link{min-height:40px;font-size:13px}
.date-row{display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:12px}.date-row input{width:auto;max-width:60%}
.past-tank{display:inline-flex;align-items:center;gap:8px;font-size:15px;color:var(--ink);min-height:44px;padding:0 14px;border:1.5px solid var(--ink);border-radius:12px;background:var(--bg);text-decoration:none}.past-tank span{text-decoration:none}.past-tank svg{width:22px;height:22px;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.when-go{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;min-width:56px;min-height:48px;padding:4px 7px 3px;border:0;border-radius:12px;background:var(--yel);color:var(--yel-ink);flex:none}
.when-go svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.when-go .tick{stroke:var(--yel-good);stroke-width:2.2}.when-go span{font-size:13px;line-height:1.1;font-weight:500;white-space:nowrap}.when-go.icon-only{width:48px;min-width:48px;height:48px;padding:0}.when-go.icon-only svg{width:26px;height:26px}
@media(hover:hover){.when-go:hover{background:var(--yel-hover)}}
@keyframes slot-pulse{0%,100%{box-shadow:0 0 0 0 rgba(255,240,75,0)}50%{box-shadow:0 0 0 5px rgba(255,240,75,.55)}}
.slots[data-act="true"] .slot[aria-pressed="true"]{animation:slot-pulse 2.6s ease-in-out infinite}
.car-tile[data-action="tank"]{--ring:var(--yel)}@keyframes car-pulse{0%,100%{box-shadow:inset 0 0 0 2px var(--ring,transparent),0 0 0 0 rgba(255,240,75,0)}50%{box-shadow:inset 0 0 0 2px var(--ring,transparent),0 0 0 5px rgba(255,240,75,.55)}}
.car-tile[data-drugie="true"]{animation:car-pulse 2.6s ease-in-out infinite}.puls,#todayAdvice[data-car="true"] .karta.puls{animation:slot-pulse 1.3s ease-in-out 2;border-radius:12px}   /* Z128: ramka lekko zaokraglona (wlasciciel 19.10) */
@media(prefers-reduced-motion:reduce){.car-tile[data-drugie="true"]{animation:none;box-shadow:inset 0 0 0 2px var(--ring,transparent),0 0 0 3px rgba(255,240,75,.55)}.puls{animation:none;box-shadow:0 0 0 3px rgba(255,240,75,.55)}}
@media(prefers-reduced-motion:reduce){.slots[data-act="true"] .slot[aria-pressed="true"]{animation:none;box-shadow:0 0 0 3px rgba(255,240,75,.55)}}
#openPlan{min-height:40px}#planSummary{margin:0}
.plan-proposal{background:var(--selected);border-radius:12px;padding:14px 16px;font-size:15px}.plan-proposal[data-active="false"]{background:var(--soft)}
#planCar{margin:8px 0}#planAdvice{margin-top:20px}#planForm>.s13{margin-top:20px}
#personalResults h2{margin:0 0 12px}#effectRange{margin:8px 0 24px}
#effectAmount{margin:6px 0 12px}#effectSay{margin-bottom:8px}#effectCounts{margin:12px 0}
.plan-result{border-top:1px solid var(--line);padding:16px 0;font-size:15px;overflow-wrap:anywhere}
@media (max-width:699px){#effectDates{grid-template-columns:minmax(0,1fr)}}
.plan-result h4{font-size:15px;margin:0 0 8px}.plan-result p{margin:6px 0}
#worldNews{min-width:0}
#worldNews h2{font-size:17px;margin:0 0 6px}
#worldItems,.world-list{list-style:none;margin:16px 0 0;padding:0}
a.topic-open{color:inherit;text-decoration:none}   /* Z123: wiersz tematu jako link na stronie /news bez JS */
#publicNewsContent h2{font-size:17px;margin:32px 0 0;padding-bottom:12px;border-bottom:2px solid var(--ink)}   /* jak grupy katalogu tematow */
#publicNewsContent time,#publicTopicContent time{white-space:nowrap}
.world-item{padding:14px 0;border-bottom:1px solid var(--line);min-width:0}
.world-item a{display:block;font-size:15px;line-height:1.45;color:var(--ink);text-decoration:none;overflow-wrap:anywhere}
.world-item a:hover{text-decoration:underline;text-underline-offset:3px}
.world-item p{font-size:13px;color:var(--t2);margin-top:6px;overflow-wrap:anywhere}
.world-sources{margin-top:10px;font-size:13px}
/* Z124: artykuly Klusek nad wiadomosciami wydawcow; tekst rozwija sie w miejscu, jak historia cen (strzalka, cala linia klikalna) */
.od-klusek{margin-top:16px}.od-klusek h3{margin:0}.od-klusek .world-list{margin-top:4px}.od-klusek .price-history .world-list{margin-top:0}   /* Z335: wcześniejsze teksty zwinięte pod najnowszym */
#newsPriceCaps{margin-top:16px}#newsPriceCaps h3{margin:0}#newsPriceCaps .rows{margin-top:4px}
.artykul{scroll-margin-top:calc(var(--top-h,64px) + 12px)}   /* otwarty z adresu: tytul nie chowa sie pod naglowkiem */
.artykul>summary{cursor:pointer;list-style:none;display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:44px}
.artykul>summary::-webkit-details-marker{display:none}
.artykul>summary::after{content:"";width:8px;height:8px;flex:none;border:solid currentColor;border-width:0 1.5px 1.5px 0;transform:translateY(-2px) rotate(45deg);margin-right:6px}
.artykul[open]>summary::after{transform:translateY(2px) rotate(225deg)}
.artykul>summary b{display:block;font-size:15px;line-height:1.45;font-weight:700;color:var(--ink);overflow-wrap:anywhere}
.artykul>summary small{display:block;font-size:13px;color:var(--t2);margin-top:6px}
.artykul>summary:focus-visible{outline:2px solid var(--ink);outline-offset:3px;border-radius:4px}
.artykul>p{font-size:15px;line-height:1.5;margin:10px 0 0;overflow-wrap:anywhere}
.artykul .art-linki{list-style:none;padding:0;margin:12px 0 0}.artykul .art-linki a{display:inline-flex;align-items:center;min-height:32px}
.artykul .world-sources a{display:block}
#artykulInfo{margin-top:12px}
.world-sources summary{min-height:32px;font-size:13px}
.world-sources a{font-size:13px;text-decoration:underline;text-underline-offset:3px;padding:8px 0}
#worldUpdateNote{margin-top:6px}
#worldActions{margin-top:12px;align-items:center;gap:12px}
#worldActions button{min-height:48px}
#worldActions button:disabled{color:var(--t2);opacity:.5;cursor:default;text-decoration:none}
.news-filters{display:flex;gap:8px;margin:16px 0}
/* Z092: wiersze jak wiadomosci w News (linia pod spodem), otwarta wiadomosc na tle soft */
.push-history ol{list-style:none;padding:0;margin:4px 0 0}
.push-history li{padding:10px 0 2px;border-bottom:1px solid var(--line);min-width:0}
.push-history li[data-open="true"]{background:var(--soft);border:1px solid var(--line);border-radius:12px;padding:10px 12px 2px;margin:4px 0}
.push-history .ph-head{font-size:13px;color:var(--t2)}.push-history .ph-title{font-weight:700;color:var(--ink);font-size:15px}
.push-history .ph-body{font-size:15px;line-height:1.45;margin-top:2px;overflow-wrap:anywhere}
/* Z099 (wlasciciel 17.10): powiadomienia w ramce jak „Co nowego” (oddzielone od prasy); kafelki jak ceny na Dzis, ze znakami paliw;
   zolta kropka = jeszcze nieotwarte; wyszarzone = nieaktualne (termin minal, inna rada, zastapione, starsze niz tydzien) */
.push-tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:8px}
.push-tile{position:relative;border:1px solid var(--line);border-radius:8px;padding:8px 4px;min-height:72px;text-align:center;background:var(--bg);color:var(--ink);font:inherit;display:flex;flex-direction:column;align-items:center;gap:2px;min-width:0;cursor:pointer}
.push-tile strong,.push-tile small{display:block;font-size:13px;max-width:100%;overflow-wrap:anywhere}.push-tile small{color:var(--t2)}
.push-tile strong .fuel-mark{margin-right:3px}
.push-tile span.pt-word{font-size:15px;font-weight:700;line-height:1.3;max-width:100%;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.push-tile[data-nowe="true"]{border-color:var(--ink)}
.push-tile[data-nowe="true"]::after{content:"";position:absolute;top:6px;right:6px;width:8px;height:8px;border-radius:50%;background:var(--yel);border:1px solid var(--ink)}
.push-tile[data-aktualne="false"]{opacity:.55}
/* Z099 (wlasciciel 17.10): w oknach powiadomien „×” jak w polu Co nowego, zamiast napisu „Zamknij” */
.dialog-x{flex:none;width:48px;height:48px;margin:-10px -12px -10px 0;padding:0;border:0;background:none;color:var(--ink);display:grid;place-items:center;cursor:pointer}
#pushListDialog h2:focus,#pushMsgDialog h2:focus{outline:none}   /* poczatkowy fokus na tytule, bez ramki na „×” */
.dialog-x svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round}
#pushMsgDialog #pushMsgAction{display:flex;align-items:center;justify-content:center;gap:8px;margin:4px 0 8px}#pushMsgDialog #pushMsgAction svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}   /* Z099: akcja z powiadomienia */
#pushMsgDialog #pushMsgBody{font-size:15px;line-height:1.45;margin:8px 0}
/* Z093: jak potwierdzenie zapisu (tlo soft, cienka ramka); „×” jako ikona liniowa w rogu, dotyk na calym rogu */
.co-nowego{margin:0}.nowosci-box{position:relative;margin:8px 0;padding:12px 16px;background:var(--soft);border:1px solid var(--line);border-radius:12px}
.nowosci-box h3{margin:0;padding-right:28px}.nowosci-box ul{list-style:none;padding:0;margin:4px 0 0}
.nowosci-box li{font-size:15px;line-height:1.45;padding:2px 0;overflow-wrap:anywhere}
.nowosc-x{position:absolute;top:0;right:0;width:48px;height:48px;padding:10px;display:flex;justify-content:flex-end;align-items:flex-start;border:0;background:none;color:var(--ink);cursor:pointer}
.nowosc-x svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round}
.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.news-head{display:flex;flex-wrap:wrap;align-items:center;column-gap:10px}.news-head h2,.news-head p{margin:0}.news-head .link{flex:none;margin-left:auto}
/* Z099 (wlasciciel 17.10): powiadomienia jako dzwonek w wierszu naglowka News; kropka = aktualne, jeszcze nieotwarte */
.news-push{margin-left:auto;flex:none;width:48px;height:48px;padding:0;border:0;background:none;color:var(--ink);display:grid;place-items:center;position:relative}
.news-push svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.news-push[data-nowe="true"]::after{content:"";position:absolute;top:10px;right:10px;width:9px;height:9px;border-radius:50%;background:var(--yel);border:1px solid var(--ink)}
.news-head .news-push:not([hidden]) + .link{margin-left:0}   /* jak naglowek z akcja (editor-head, when-head) */
#coNowegoWszystkie{list-style:none;padding:0;margin:0 0 8px}#coNowegoWszystkie li{padding:10px 0;border-bottom:1px solid var(--line);font-size:15px;overflow-wrap:anywhere}
#coNowegoWszystkie small{display:block;font-size:13px;color:var(--t2)}
.nowosci-box li{padding-left:14px;position:relative}.nowosci-box li:not(.nowosci-data):not(.nowosci-tekst)::before{content:"·";position:absolute;left:2px;font-weight:700}   /* Z097: punkty wydania */
.nowosci-box li.nowosci-tekst{padding-left:0;margin:2px 0 4px}#coNowegoWszystkie p{margin:2px 0 0;font-size:15px;line-height:1.45}   /* Z116: opowiesc zespolu przed punktami */
.nowosci-box li.nowosci-data{padding-left:0;font-size:13px;color:var(--t2);margin-top:6px}
#coNowegoWszystkie ul{list-style:none;padding:0;margin:2px 0 0}#coNowegoWszystkie ul li{padding:2px 0 2px 14px;border:0;position:relative}#coNowegoWszystkie ul li::before{content:"·";position:absolute;left:2px;font-weight:700}
.news-filters button{min-height:48px;padding:8px 16px;border:1px solid var(--line);border-radius:8px}
.news-filters button:disabled{color:var(--t2);opacity:.5;cursor:default}
.news-filters button[aria-pressed=true]{background:var(--selected);border-color:var(--ink);font-weight:600}
/* Z095: szukanie po slowach - lupa na koncu wiersza filtrow, pole w jego miejscu; ikony liniowe jak „×” w Co nowego */
.news-filters .news-search-open{margin-left:auto;flex:none;width:48px;padding:0;border:0;display:grid;place-items:center;color:var(--ink)}
.news-search{display:flex;align-items:center;gap:4px;margin:16px 0;min-height:48px;padding-left:12px;border:1px solid var(--ink);border-radius:8px;color:var(--ink)}
.news-search input{flex:1;min-width:0;min-height:46px;border:0;background:none;color:var(--ink);font:inherit;font-size:17px}
.news-search input:focus-visible{outline:none}.news-search:focus-within{outline:2px solid var(--ink);outline-offset:2px}   /* jeden fokus na calym polu, jak inne pola */
.news-filters button{white-space:nowrap}@media(max-width:360px){.news-filters button{padding:8px 12px}}   /* z lupa „Dla Ciebie” w jednej linii przy 320 px */
.news-search input::-webkit-search-cancel-button{display:none}
.news-search button{width:48px;height:46px;border:0;background:none;color:var(--ink);display:grid;place-items:center;flex:none}
.news-search-open svg,.news-search svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;flex:none}
#newsSearchCount{margin:-8px 0 0}
.news-days{display:flex;align-items:center;justify-content:space-between;gap:6px;margin:16px 0}
.news-days button{min-width:48px;min-height:48px}
#worldDay{font-size:13px;text-align:center}

#worldEmpty{margin-top:16px}
#forecastResults>summary{font-weight:700;font-size:17px}
.start-card{border:1px solid var(--line);border-radius:12px;padding:20px;margin-bottom:24px}
.start-card h2{font-size:17px;margin:0 0 8px}.start-card>p{font-size:15px;color:var(--t2)}
.start-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:16px 0 8px}
.start-options button{display:flex;flex-direction:column;align-items:center;gap:8px;border:1px solid var(--field-line);border-radius:12px;padding:12px 4px;font-size:13px;text-align:center;min-width:0}
.start-options svg{width:32px;height:28px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.start-options button:hover{background:var(--selected)}
.start-card .actions{gap:8px 20px;margin-top:12px}.start-card .link{font-size:15px;min-height:48px}
#startHint{font-size:13px;margin-top:12px}#startReady{background:var(--soft);padding:12px;border-radius:12px}
#startIntro{margin:0 0 16px}#startIntro p{margin:0 0 8px}
#startGuide{position:fixed;inset:auto 12px 12px;margin:0 auto;width:calc(100% - 24px);max-width:420px;max-height:45dvh;overflow:auto;z-index:1000;border:1px solid var(--line);border-radius:18px;background:var(--bg);color:var(--ink);padding:20px}
#startGuide p{margin:8px 0 16px}#startGuide h2{margin:0;font-size:17px}
#startGuide .actions{justify-content:space-between;align-items:center;gap:16px}#startGuide .primary{width:auto;margin:0;padding:0 22px}
/* Z138 (wlasciciel 19.10): wskazowka na dole, nad trescia, jak samouczek; jedno zdanie, „Pokaz” i „×” */
.tip:not([hidden]){position:fixed;inset:auto 12px max(12px,env(safe-area-inset-bottom));margin:0 auto;width:calc(100% - 24px);max-width:420px;z-index:900;display:flex;align-items:center;gap:4px;border:2px solid var(--yel);border-radius:18px;background:var(--selected);color:var(--ink);padding:4px 4px 4px 12px}   /* nie zlewa sie z tlem: wyroznienie jak „Tankuj” (wlasciciel 19.10) */
.tip-go{flex:1;min-width:0;min-height:48px;display:flex;align-items:center;gap:10px;border:0;background:none;color:var(--ink);font:inherit;font-size:15px;line-height:1.35;text-align:left;padding:4px 0;cursor:pointer}.tip-go:focus-visible{outline:2px solid var(--ink);outline-offset:2px;border-radius:12px}
.tip-ik{flex:none}.tip-ik svg{display:block;width:28px;height:28px;fill:none;stroke:var(--ink);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.tip-ik .szklo{fill:var(--yel)}.tip .dialog-x{margin:0}   /* zolta zarowka, krzyzyk jak w oknach i „Co nowego” */
.tip-bulb:not([hidden]){position:fixed;right:16px;bottom:max(16px,env(safe-area-inset-bottom));z-index:900;width:52px;height:52px;border-radius:50%;border:0;background:var(--yel);color:var(--yel-ink);display:grid;place-items:center;cursor:pointer;animation:tip-bulb .9s ease-out 1}
.tip-bulb svg{width:28px;height:28px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.tip-bulb:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
@keyframes tip-bulb{0%{transform:scale(.6);opacity:0}60%{transform:scale(1.08);opacity:1}100%{transform:scale(1)}}@media(prefers-reduced-motion:reduce){.tip-bulb:not([hidden]){animation:none}}   /* Z138: zarowka czeka w rogu, wskazowka po dotknieciu */
.start-guide-target{outline:2px solid var(--ink);outline-offset:4px}
.data-notice{margin:16px 20px 0;padding:12px 16px;border:1px solid var(--bad);border-radius:12px;font-size:15px}
.data-notice .actions{margin-top:8px}.data-notice .link{font-size:13px;min-height:48px}
.data-block+.data-block{border-top:1px solid var(--line);padding-top:20px;margin-top:20px}
.data-block h3{font-size:15px;margin:0 0 8px}.data-block .actions{gap:8px 16px;flex-wrap:wrap}
#backupDialog p,#restoreDialog p{font-size:15px;margin:12px 0;overflow-wrap:anywhere}
#restoreSummary,#restoreCurrent{background:var(--soft);border-radius:12px;padding:12px}
#restoreFile{max-width:100%;font-size:13px}
#restoreFile::file-selector-button{font:inherit;color:var(--ink);background:var(--soft);border:1px solid var(--field-line);border-radius:8px;padding:8px;margin-right:8px;cursor:pointer}
#backupNudge{margin-top:24px;padding:16px;border:1px solid var(--line);border-radius:12px;font-size:13px}
#backupNudge .link{font-size:13px;min-height:48px}
@media(min-width:361px) and (max-width:420px){.start-card{padding-inline:16px}.start-options button{padding-inline:2px}}   /* Z164: „Gospodarstwo” z odstepem od ramki przy 390 px */
@media(max-width:360px){.start-options{grid-template-columns:minmax(0,1fr)}.start-options button{flex-direction:row;text-align:left;padding:8px 12px;min-height:48px;gap:12px}}
@media(min-width:700px){#startCard{grid-column:1/-1;max-width:640px;justify-self:start;width:100%}#startCard .start-options{max-width:420px}
  #startIntro .lead{font-size:40px;letter-spacing:-.025em;line-height:1.05;max-width:none;margin-bottom:12px}#startIntro .s13{font-size:15px}
  #quickPrices .qp-spark .spark{height:32px}#v-dzis>#startIntro,#v-dzis>#startCard,#v-dzis>#installNudge,#v-dzis #startBrowse{margin-block:0}}   /* Z164: odstepy daje sama siatka; na szerokim ekranie jedna lewa krawedz, naglowek z rozmiaru 40 i wykresik na szerokosc kafelka (review 20.10) */
.sync-notice{margin:12px 20px;color:var(--t2)}
#syncDialog p,#deleteSyncDialog p,#joinDialog p{font-size:15px;margin:12px 0;overflow-wrap:anywhere}
#syncDialog .actions,#joinDialog .actions{flex-wrap:wrap;gap:8px 16px}
#syncCode{font-size:13px;overflow-wrap:anywhere;background:var(--soft);border-radius:12px;padding:12px;user-select:all}
#syncQr{display:block;background:white;width:220px;max-width:100%;height:auto;margin:16px auto}
#syncDevices{padding-left:20px;font-size:13px;color:var(--t2)}
#syncState[data-state="pending"],#syncState[data-state="error"],#syncState[data-state="revoked"]{color:var(--bad)}
#joinDialog .pick input[type="radio"]{appearance:none;display:inline-grid;place-content:center;width:22px;height:22px;min-height:22px;flex:none;margin:0;padding:0;border:1.5px solid var(--field-line);border-radius:50%;background:var(--bg);cursor:pointer}
#joinDialog .pick input[type="radio"]::after{content:"";width:10px;height:10px;border-radius:50%;background:var(--yel-ink);visibility:hidden}
#joinDialog .pick input[type="radio"]:checked{background:var(--yel);border-color:var(--yel-ink)}
#joinDialog .pick input[type="radio"]:checked::after{visibility:visible}
@media(forced-colors:active){#joinDialog .pick input[type="radio"]{appearance:auto}#joinDialog .pick input[type="radio"]::after{display:none}}
#joinSummary{background:var(--soft);border-radius:12px;padding:12px}
#syncSecureLink{display:inline-block;min-height:48px;padding-block:12px;color:var(--ink)}
.household-row{padding:12px 0;border-bottom:1px solid var(--line);overflow-wrap:anywhere}.household-row p{margin:4px 0;font-size:13px;color:var(--t2)}
.household-row .actions{gap:8px 16px;flex-wrap:wrap}.household-row .link{font-size:13px;min-height:48px}
#householdNameLabel,#reportContext{overflow-wrap:anywhere}#reportContext{margin:8px 0 16px}
.report-totals{display:grid;gap:20px;margin:20px 0}.report-total{padding:18px;border:1px solid var(--line);border-radius:12px;min-width:0}.report-total h3{font-size:15px;margin:0 0 8px}.report-total .s40{overflow-wrap:anywhere}
/* Z067: dashboard Wynikow - trzy kafelki w rzedzie jak ceny na Dzis, liczba 17 px, wykres jednej serii bez legendy */
.report-totals.dash-tiles{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:16px 0 12px}
.dash-tiles .dash-tile{padding:10px 8px}.dash-tiles .dash-tile h3{font-size:13px;font-weight:500;color:var(--t2);margin:0 0 4px}
.dash-num{font-size:17px;font-weight:700;line-height:1.25;margin:0;overflow-wrap:anywhere}.dash-num.good{color:var(--good)}.dash-num.bad{color:var(--bad)}
.dash-tile .s13{margin-top:4px;line-height:1.35}
#effectSay:empty,#spendingBreakdown:empty{display:none}
.dash-chart{margin:12px 0 20px}.dash-chart figcaption{font-weight:700;margin-bottom:6px}
#dashBars{display:block;width:100%;max-width:480px;height:134px;overflow:visible}
#dashBars .bar{fill:var(--field-line)}#dashBars .sel .bar{fill:var(--ink)}#dashBars .hit{fill:transparent}
#dashBars text{font-size:13px;fill:var(--t2)}#dashBars .sel text{fill:var(--ink);font-weight:700}
#dashBars .base{stroke:var(--line);stroke-width:1}#dashBars g{cursor:pointer;outline:none}#dashBars g:focus-visible .hit{stroke:var(--ink);stroke-width:2}
@media (forced-colors:active){#dashBars .bar{fill:GrayText}#dashBars .sel .bar{fill:Highlight}}
#decisionsSection{margin:0 0 20px;max-width:640px}#decisionsSection h3{margin:0 0 4px}#decisionList{margin-top:8px}#decisionsNote{margin-top:4px}
#decisionList li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:0 12px;align-items:baseline}#decisionList .a{min-width:0;overflow-wrap:anywhere}#decisionList .b{grid-column:1/-1;overflow-wrap:anywhere}
#decisionList li[data-verdict="none"] .a{color:var(--t2)}
#spendingNote,#spendingBreakdown,#effectScopeNote{font-size:13px;color:var(--t2);margin-top:8px}#spendingHistory{margin:20px 0}#expenseList{list-style:none;padding:0}
.results-chart,.results-history{min-width:0}
@media(min-width:1000px){
  .results-columns{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:32px;align-items:start;margin-top:20px}
  .results-columns .dash-chart{margin-top:0}
  .results-history>.actions{margin-top:0}
}
#memberDialog p,#purchaseDialog p,#assignPersonDialog p{font-size:15px;overflow-wrap:anywhere;margin:12px 0}
@media(min-width:700px){.report-totals{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:699px){#reportFilters{grid-template-columns:minmax(0,1fr)}}

/* Nawigacja: logo, zakładki, Uwagi i Profil w jednym rzędzie. */
.top{position:sticky;top:0;z-index:2;background:var(--bg);padding:8px 12px;grid-template-columns:32px minmax(0,1fr) 104px;gap:8px}
.top .logo{grid-column:1;grid-row:1}
button.logo{border:0;background:none;padding:0;color:inherit;font:inherit;font-size:17px;font-weight:700;cursor:pointer}
#shareDialog{max-width:360px;text-align:center}#shareUrl{overflow-wrap:anywhere}#shareTopic{margin:12px 0 0}#shareQr{display:block;background:white;width:240px;max-width:100%;height:auto;margin:8px auto 4px;border-radius:12px}#shareUrl{font-size:17px;font-weight:700;margin:0 0 16px}#shareDialog .actions:not(.dialog-title){justify-content:center;gap:16px;align-items:center}#shareDialog .dialog-title{text-align:left}#shareDialog .primary{width:auto;margin:0;padding:0 22px}#shareStatus{min-height:1.4em}#shareQr .qr-mark{fill:var(--yel)}#shareQr .qr-k{fill:none;stroke:var(--yel-ink);stroke-width:10;stroke-linecap:round;stroke-linejoin:round}
.top .brand-name{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.top .top-actions{grid-column:3;grid-row:1;gap:4px}
.top-actions .profile-link{width:50px;min-width:48px;min-height:48px;flex-direction:column;gap:1px;padding:2px 0 5px;font-size:13px;line-height:16px}
.top-actions .profile-link svg{width:20px;height:20px}
.profile-link[aria-current="page"] span{text-underline-offset:4px}
#fresh{padding:8px 20px 0;white-space:pre-line}
.nav{position:static;grid-column:2;grid-row:1;bottom:auto;border:0;padding:0;gap:0;min-width:0}
#navTabs button{min-width:48px;flex-direction:column;gap:1px;padding:2px 0 5px;line-height:16px}
#navTabs svg{width:20px;height:20px}
#navTabs button[aria-selected="true"]::after{bottom:2px;left:calc(50% - 10px)}
.nav.back{justify-content:flex-start}
.nav.back button{flex:0 1 auto;text-align:left;max-width:none;padding-inline:8px}
.view{scroll-margin-top:72px}
@media(min-width:700px){
 .top{padding:8px 24px;grid-template-columns:auto minmax(0,1fr) auto;gap:24px}
 .top .brand-name{position:static;width:auto;height:auto;clip-path:none;overflow:visible}
 .top .top-actions{gap:16px}
 .top-actions .profile-link{width:auto;flex-direction:row;gap:6px;font-size:15px;padding:8px 0}
 #navTabs button{flex-direction:row;gap:8px;padding:8px}
 #fresh{padding-inline:32px}
}

.bug-attachment{display:flex;flex-wrap:wrap;column-gap:12px;margin:8px 0}.bug-attachment .link{min-height:48px;text-align:left}#bugPreview{width:100%}#bugImage{display:block;max-width:100%;max-height:180px;object-fit:contain;border:1px solid var(--line);border-radius:8px}

/* Codzienna decyzja przed konfiguracją i historią. */
.today-context{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:0 8px;grid-column:1/-1;border-bottom:1px solid var(--line)}
.today-groups{display:flex;gap:16px;min-width:0}
.today-context:has(#todayTools:not([hidden])) .today-groups{gap:8px}.today-context:has(#todayTools:not([hidden])) .today-groups button{font-size:15px}
.today-tools{display:flex;align-items:center;margin-left:auto;min-width:0}
.trip-switch{display:flex;align-items:center;gap:7px;min-height:48px;position:relative;cursor:pointer;font-size:13px;color:var(--t2);white-space:nowrap}
.trip-switch input{position:absolute;width:1px;height:1px;opacity:0}
.trip-track{width:36px;height:22px;box-sizing:border-box;border:1px solid var(--line);border-radius:12px;background:var(--bg);position:relative;flex:none}
.trip-track:before{content:"";position:absolute;top:3px;left:3px;width:14px;height:14px;border-radius:50%;background:var(--ink)}
.trip-switch:has(input:checked) .trip-track{background:var(--yel);border-color:var(--ink)}.trip-switch:has(input:checked) .trip-track:before{left:17px}
.trip-switch:has(input:not(:checked)) .trip-occasion,.trip-switch:has(input:checked) .trip-special{font-weight:700;color:var(--ink)}
.trip-switch:has(input:focus-visible){outline:2px solid var(--ink);outline-offset:3px;border-radius:4px}
#carOverview .car-overview-head{display:grid;grid-template-columns:minmax(0,max-content) 48px minmax(104px,1fr) 112px;gap:0;min-height:68px}   /* Z063: kolumna przycisku z podpisem 13 px ma minimum, dluzszy tytul sie zawija */
@media(max-width:359px){#carOverview .car-overview-head{grid-template-columns:minmax(0,max-content) 48px 1fr 112px}}   /* stala 4. kolumna: dystrybutor stoi w tym samym miejscu przy Przy okazji i Specjalnie (wlasciciel 12.10) */
#carOverview .car-overview-head h2{min-width:0;line-height:1.3}
#carOverview #quickAddCar{width:48px;height:48px}
@media(max-width:420px){#v-dzis>.quick-prices{margin-bottom:12px}#carOverview{margin-bottom:8px}#carOverview .car-overview-head{margin-bottom:4px}}
.trip-distance{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:4px;width:100%;min-width:0;margin-left:auto;font-size:13px}
.trip-distance label{display:flex;flex-direction:column;align-items:stretch;width:112px;max-width:100%;min-width:0;line-height:1.3;text-align:right}
#tripDistanceText{display:flex;align-items:center;justify-content:flex-end;gap:4px;white-space:nowrap}
#tripRoad{width:37px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;margin-right:auto;flex:none}
#tripRoad .dot{fill:currentColor;stroke:none}#tripRoad .pump{stroke-width:1.5}#tripRoad .dots{stroke-dasharray:.1 3.2;stroke-width:2.2}

#tripKmValue{text-align:right;font-variant-numeric:tabular-nums}.trip-fuel-line{display:flex;justify-content:space-between;gap:4px;color:var(--t2)}
#tripKm{height:32px;min-height:32px;margin:0}#tripKmNote{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.car-range p{margin:0}
.car-config-range{height:32px;min-height:32px;margin:0}#carTrip{grid-template-columns:1fr}
.trip-distance .link{font-size:13px;min-height:48px;min-width:0;line-height:1.3;text-align:right;justify-content:flex-end}#tripError:empty{display:none}.trip-distance:has(#tripError:not(:empty)){flex-wrap:wrap}
@media(forced-colors:active){#tripKm,.car-config-range{appearance:auto;accent-color:Highlight}}
.car-consumption{margin:2px 0 8px;font-size:13px;color:var(--t2)}
.car-trip{margin:8px 0 0;font-size:13px;color:var(--t2)}
.today-groups button{min-height:48px;padding:8px 4px;border:0;border-bottom:3px solid transparent;background:none;color:var(--t2);font:inherit}
.today-groups button[aria-pressed="true"]{color:var(--ink);border-bottom-color:var(--ink);font-weight:700}
.car-context{padding:0 0 12px;border:0;border-radius:0;display:flex;align-items:center;justify-content:space-between;gap:12px}
.car-context .current-car{margin:0;gap:8px;min-width:0}.car-context h3{font-size:17px;overflow-wrap:anywhere}
.car-context .current-car .car-icon{width:32px;height:24px;flex-shrink:0}.car-context .actions{margin:0;gap:8px;flex-shrink:0}
.car-context .actions .link{min-height:48px}.car-context .current-car p{display:none}
#todayActions{margin:20px 0 12px}#todayPlaceActions{margin:20px 0}
#quickTankRow{margin:0 0 16px}#quickTank{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;justify-self:center;gap:1px;width:auto;min-width:56px;min-height:48px;padding:4px 7px 3px;border:0;border-radius:12px;background:var(--yel);color:var(--yel-ink)}.quick-tank-label{font-size:13px;line-height:1.1;font-weight:500;white-space:nowrap;letter-spacing:-.01em}
@media(max-width:359px){#quickTank{min-width:48px;padding:0 4px}.quick-tank-label{display:none}}   /* 320 px: brak miejsca na podpis, zostaje etykieta dostepnosci */   /* Z056: podpis odroznia zapis od rady Tankuj i akcji Zaplanuj (wlasciciel 12.10) */#quickTank .tick{stroke:var(--yel-good);stroke-width:2.2}
#quickTank svg{width:24px;height:24px;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
@media(hover:hover){#quickTank:hover{background:var(--yel-hover)}}
.topics{gap:12px}.topics:not(:empty)+.topics:not(:empty){margin-top:20px}
.lead:not([hidden])~.topics:not(:empty){margin-top:20px}
#openPlan{justify-self:start}#editLastTank{grid-column:1/-1;justify-self:start}
.advice-actions{display:flex;flex-wrap:wrap;gap:12px;margin:0 0 20px}.advice-actions .link{min-height:48px}
#otherTopics{margin-top:24px;padding:0}#otherSummary{display:none}
#footDzis:empty,#leadMeta:empty{display:none}#startBrowse{margin:16px 0}#startExisting{margin-top:20px}
#quiet:not(:empty){border:1px solid var(--line);border-radius:16px;padding:0 20px;margin-bottom:16px}#quiet .quiet:last-child{border-bottom:0}
#otherTopics .topic-list{border:1px solid var(--line);border-radius:16px;padding:0 20px}
#quiet .quiet{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 0;min-height:64px;border-bottom:1px solid var(--line)}
#quiet .quiet .line{font-size:15px;color:var(--ink)}
#quiet .quiet .last{display:block;font-size:13px;margin-top:2px;color:var(--t2)}
#quiet .quiet:after{content:'›';flex:none;color:var(--t2)}
#planSection{margin-top:24px}.report-total .price-history{margin-top:16px}
#effectCounts:empty,#spendingBreakdown:empty,#spendingEmpty:empty{display:none}
.place-context .actions{gap:16px}#placeTiles .car-tile{min-height:72px}#placeTiles .car-tile .car-icon{height:24px}
@media(min-width:700px){
  #profileSettings{width:100%;max-width:640px;margin-inline:auto}
  #v-dzis .today-main{width:100%;max-width:none}
  #v-dzis>.quick-prices{margin-bottom:0}
  #todayContext,#placeOverview{grid-column:1/-1}
  #carOverview .car-overview-head{grid-template-columns:minmax(0,max-content) 48px auto minmax(112px,1fr);column-gap:8px}
  #carOverview #quickTank{justify-self:start}
}
@media(min-width:1000px){
  #v-dzis .today-main:has(#otherTopics:not([hidden])){display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);column-gap:32px;align-items:start}
  .today-main #todayAdvice,.today-main #todayEffect{grid-column:1}
  .today-main #otherTopics{grid-column:2;grid-row:1/3;margin-top:0}
  .today-main>.actions,.today-main #backupNudge,.today-main #otherSummary{grid-column:1/-1}
}
/* Z055: prototyp wspólnej sekcji rad wybranego auta. */
#todayAdvice[data-car="true"]{border:1px solid transparent;border-radius:16px;padding:12px 16px 4px;display:flex;flex-direction:column;background:var(--soft)}   /* Z056: strefa auta na szarym tle, zeby nie zlewala sie z Innymi obserwowanymi (wlasciciel 12.10) */
#todayAdvice[data-car="true"] #todayAdviceTitle{display:flex;align-items:center;justify-content:space-between;font-size:17px;margin:0 0 4px}
.advice-car{display:inline-flex;align-items:center;gap:8px;min-width:0}.advice-car .car-icon{width:36px;height:24px;flex:none}.advice-car-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#todayAdvice[data-car="true"] .advice-edit{position:static;width:40px;height:40px;margin:-8px -8px -8px 0}
#todayAdvice[data-car="true"] #quickTankRow{order:5}#todayAdvice[data-car="true"] #footDzis{order:6}
#todayAdvice[data-car="true"] .karta{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:0 12px;border:0;border-top:1px solid var(--line);border-radius:0;padding:10px 0;margin:0;background:transparent}
#todayAdvice[data-car="true"] .karta:first-child{border-top:0}
#todayAdvice[data-car="true"] .topic{display:flex;flex-wrap:wrap;align-items:baseline;gap:0 8px;min-height:0;text-align:left}
#todayAdvice[data-car="true"] .topic .name{font-size:13px;color:var(--t2)}#todayAdvice[data-car="true"] .topic .name:first-child{color:var(--ink);font-weight:500}
#todayAdvice[data-car="true"] .topic .word{font-size:17px;font-weight:700;margin:0;line-height:1.3}
#todayAdvice[data-car="true"] .topic .say{flex-basis:100%;font-size:13px;color:var(--t2)}
#todayAdvice[data-car="true"] .topic .name:not(:first-child):not(.rada-od):not(.po-porze){display:none}   /* data cen w szczegole */
#todayAdvice[data-car="true"] .advice-actions{margin:0;display:flex;flex-direction:column;align-items:center;gap:4px}#todayAdvice[data-car="true"] .advice-actions .edge{position:static;width:72px;height:36px}#todayAdvice[data-car="true"] .advice-actions .link{min-height:32px;font-size:13px}#todayAdvice[data-car="true"] .advice-actions .row-detail{display:none}#todayAdvice[data-car="true"] .advice-actions [data-cancel-defer]{order:2}   /* wiersz otwiera szczegol */
#todayAdvice[data-car="true"] .rada-stara .topic .word{color:var(--t2)}
#otherRows .topic-open{min-height:48px}   /* Z059 korekta: zawijasy wracaja (wlasciciel 13.10) */
#todayAdviceTitle{font-size:17px;font-weight:700;margin:0 0 16px;overflow-wrap:anywhere}
#todayAdvice[data-car="true"] #quickTankRow{display:flex;align-items:center;flex-wrap:wrap;gap:4px 16px;margin-bottom:0}
#todayAdvice[data-car="true"] #openTankHistory{min-height:48px;font-size:13px}
#todayAdvice[data-car="true"] .topics{gap:0}
#todayAdvice[data-car="true"] .topic .name{padding-right:0}
#todayAdvice[data-car="true"] .topic{padding-right:0}
#todayAdvice[data-car="true"] .topic .say{font-size:15px;max-width:none}
#todayAdvice[data-car="true"] .topic .word{margin-bottom:8px}
#todayAdvice[data-car="true"] .topic .more{display:none}
#todayAdvice[data-car="true"] .advice-actions{gap:4px 16px;margin:8px 0 0}
#todayAdvice[data-car="true"] .advice-actions .link{font-size:13px;min-height:48px}
#todayAdvice[data-car="true"] #todayActions{margin:0;gap:0}
#todayAdvice[data-car="true"] #quiet:not(:empty){margin-top:16px}
#todayAdvice[data-car="true"]~#otherTopics{margin-top:40px;border-top:0;padding-top:0}
#todayAdvice[data-car="true"]~#otherTopics h3{font-size:13px;font-weight:500;color:var(--t2);letter-spacing:.02em;margin:0 0 4px}
#todayAdvice[data-car="true"]~#otherTopics .topic-list{border:0;border-radius:0;padding:0}   /* Z056: lista bez ramki - tylko strefa auta jest karta */
@media(min-width:1000px){#todayAdvice[data-car="true"]~#otherTopics{margin-top:0}}
/* Z131 (wlasciciel 19.10, review): karta paliwa od 1024 px w dwoch kolumnach - decyzja bez przewijania obok wykresu */
@media(min-width:1024px){main.view[data-fuel]:not([hidden]){display:grid;grid-template-columns:minmax(0,1.15fr) minmax(340px,1fr);column-gap:40px;align-items:start}
  main.view[data-fuel]>*{grid-column:1/-1}
  main.view[data-fuel]>.price-history{grid-column:1;grid-row:span 8}
  main.view[data-fuel]>.lead-sec,main.view[data-fuel]>.tank-simulation,main.view[data-fuel]>.advice-actions,main.view[data-fuel]>.sec:not(.price-history),main.view[data-fuel]>button.link{grid-column:2}}