:root{--bg:#f5f7fb;--surface:#fff;--text:#1c2a41;--muted:#7c879a;--border:#e7ebf2;--primary:#3762f6;--primary-hover:#294ad4;--light-blue:#ecf2ff;--red:#e95d69;--green:#24a785;--shadow:0 5px 25px rgba(28,42,65,.045);--input:#fff;--side:#111d35;--side-muted:#8696b3;--radius:18px}
*{box-sizing:border-box}body{margin:0;background:var(--bg);font-family:Inter,"Segoe UI",system-ui,-apple-system,sans-serif;color:var(--text);font-size:14px;-webkit-font-smoothing:antialiased}button,input,select,textarea{font:inherit}button{cursor:pointer}button:disabled{opacity:.55;cursor:not-allowed}button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid rgba(55,98,246,.22);outline-offset:2px}.shell{display:flex;min-height:100vh}.sidebar{width:245px;background:var(--side);color:#eff4ff;position:sticky;top:0;min-height:100vh;height:100vh;display:flex;flex-direction:column;padding:30px 15px 20px;flex-shrink:0;z-index:4}.brand{display:flex;gap:12px;align-items:center;margin:0 9px 38px}.brand-icon{width:39px;height:39px;display:grid;place-items:center;background:linear-gradient(135deg,#6d82ff,#4ccebf);border-radius:12px;color:#fff;font-size:26px}.brand strong{font-size:21px;letter-spacing:-1px}.brand-pro{font-weight:600;color:#65d1c6;font-size:11px;letter-spacing:1.1px;margin-left:4px}.brand small,.side-footer>small{display:block;color:var(--side-muted);font-size:11px;margin-top:4px}.sidebar-label{font-size:10px;letter-spacing:1.4px;font-weight:700;color:#6c7e9f;margin:0 12px 11px}.scope-choice{display:grid;gap:5px;margin:0 0 31px}.scope-btn,.nav-btn{border:0;background:transparent;color:#a8b7d1;width:100%;text-align:left;padding:12px 14px;border-radius:10px;font-weight:550;display:flex;align-items:center;gap:12px;transition:background .18s}.scope-btn span,.nav-btn span{width:20px;text-align:center;font-size:19px;color:inherit}.scope-btn.active,.nav-btn.active{background:#243657;color:#fff}.scope-btn.active{background:#2a3962}.scope-btn:hover,.nav-btn:hover{background:#22314d;color:#fff}.nav{display:grid;gap:5px}.side-footer{margin-top:auto;border-top:1px solid #283751;padding-top:14px}.side-footer .nav-btn{padding-left:11px}.side-footer>small{padding-left:13px}.local-lock{display:flex;align-items:center;gap:9px;color:#8ca3c7;font-size:11px;padding:4px 12px 10px}.main{flex:1;min-width:0}.topbar{display:flex;justify-content:space-between;gap:16px;padding:24px 38px;border-bottom:1px solid var(--border);background:var(--surface);align-items:center}.page-title{display:flex;align-items:center;gap:16px}.eyebrow{color:#7291ae;font-size:10px;font-weight:800;letter-spacing:1.5px;margin:0 0 6px}.page-title h1{font-size:22px;line-height:1.2;margin:0;letter-spacing:-.7px}.top-actions{display:flex;align-items:center;gap:12px}.connection-status{font-size:11px;color:#64768e;background:#eef2f8;border-radius:30px;padding:9px 13px;display:flex;gap:7px;align-items:center;white-space:nowrap}.connection-status::first-letter{color:#93a5bf}.connection-status.online{color:#147f66;background:#e3f8f1}.icon-btn{border:1px solid var(--border);width:38px;height:38px;display:grid;place-items:center;border-radius:11px;background:var(--surface);color:var(--text);font-size:20px}.icon-btn:hover{background:var(--bg)}.btn{border-radius:10px;border:1px solid transparent;padding:11px 15px;font-weight:650;display:inline-flex;align-items:center;justify-content:center;gap:8px;white-space:nowrap}.add-symbol{font-size:17px}.btn-primary{background:var(--primary);color:white;box-shadow:0 3px 9px #3762f629}.btn-primary:hover{background:var(--primary-hover)}.btn-secondary{background:var(--surface);border-color:var(--border);color:var(--text)}.btn-secondary:hover{background:var(--bg)}.content{padding:30px 38px 23px;max-width:1540px;margin:auto}.intro-row{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:28px}.intro-row h2{font-size:26px;letter-spacing:-.8px;margin:0 0 7px}.muted{color:var(--muted);margin:0;line-height:1.6}.month-switch{display:flex;align-items:center;gap:6px;padding:5px;background:var(--surface);border:1px solid var(--border);border-radius:13px}.month-switch .icon-btn{border:none;width:30px;height:31px;background:transparent}.month-switch input{width:155px;text-align:center;border:0;background:transparent;color:var(--text);font-weight:650;outline:none;padding:5px 2px}.text-btn{border:0;background:transparent;color:var(--primary);font-size:12px;font-weight:700;padding:7px 10px}.notice{display:flex;align-items:center;gap:12px;background:#ecf2ff;border:1px solid #d9e5ff;padding:12px 16px;border-radius:13px;margin:0 0 20px;color:#39547f;font-size:12px}.notice>span:first-child{font-size:19px}.notice>span:nth-child(2){flex:1}.notice button{border:0;background:transparent;color:#2c5ad9;font-weight:700}.kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px;margin-bottom:22px}.kpi{display:flex;align-items:center;gap:14px;padding:22px 18px;background:var(--surface);border:1px solid var(--border);box-shadow:var(--shadow);border-radius:var(--radius);min-width:0}.kpi-icon{height:43px;width:43px;flex-shrink:0;display:grid;place-items:center;border-radius:12px;font-size:22px;font-weight:700}.kpi-blue{color:#4275f5;background:#e9efff}.kpi-violet{color:#8e6be6;background:#f2edff}.kpi-green{color:#21a784;background:#e5f8f3}.kpi-red{color:#ee6974;background:#fff0f0}.kpi span,.kpi small{display:block;color:var(--muted);font-size:12px}.kpi strong{display:block;font-size:23px;letter-spacing:-1px;white-space:nowrap;margin:5px 0}.kpi small{font-size:11px}.section-grid{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(280px,1fr);gap:19px}.stack{display:flex;flex-direction:column;gap:19px}.panel{background:var(--surface);border-radius:var(--radius);border:1px solid var(--border);box-shadow:var(--shadow);min-width:0}.panel-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:22px 23px 17px}.panel-heading h3{margin:0 0 5px;font-size:16px;letter-spacing:-.3px}.panel-heading p{margin:0;color:var(--muted);font-size:12px}.small-button{border:1px solid #dce5fe;background:#f1f5ff;color:var(--primary);font-weight:700;font-size:12px;border-radius:9px;padding:9px 11px;white-space:nowrap}.small-button:hover{background:#e5edff}.bill-list{padding:0 13px 13px}.bill-item{padding:14px 10px;display:flex;align-items:center;gap:12px;border-top:1px solid var(--border)}.bill-item:first-child{border-top:1px solid var(--border)}.category-avatar{display:grid;place-items:center;flex-shrink:0;background:#f1f4fa;color:#5d75a1;width:43px;height:43px;border-radius:11px;font-size:20px}.bill-details{flex:1;min-width:0}.bill-details strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px;margin-bottom:5px}.bill-details small{display:block;color:var(--muted);font-size:11px}.bill-sum{text-align:right;min-width:90px}.bill-sum strong{display:block;font-size:14px;white-space:nowrap}.status{font-size:10px;font-weight:750;margin-top:4px;display:block}.status.paid{color:var(--green)}.status.overdue{color:var(--red)}.status.today{color:#bd7e27}.status.pending{color:#8591a4}.bill-buttons{display:flex;gap:5px}.action-icon{display:grid;place-items:center;border:1px solid var(--border);background:var(--surface);color:#63738b;width:30px;height:30px;border-radius:9px;font-size:16px}.action-icon:hover{background:var(--bg);color:var(--primary)}.action-icon.danger:hover{color:var(--red)}.bill-badges{display:flex;gap:6px;flex-wrap:wrap}.bill-badge{display:inline-flex;background:#edf2fb;color:#6d7c91;font-size:10px;padding:3px 7px;border-radius:6px;margin-top:3px}.progress-panel{padding-bottom:21px}.progress-top{display:flex;align-items:baseline;justify-content:space-between;padding:5px 23px 12px}.progress-top strong{font-size:37px;letter-spacing:-2px}.progress-top span{font-weight:650;color:var(--muted)}.progress-rail{height:9px;margin:0 23px;background:#edf1f8;border-radius:20px;overflow:hidden}.progress-rail div{height:100%;width:0;background:linear-gradient(90deg,#4b7aff,#3bc3b3);border-radius:20px;transition:width .3s}.microcopy{font-size:11px;color:var(--muted);line-height:1.6}.progress-panel .microcopy{margin:12px 23px 0}.category-bars{padding:1px 23px 23px}.category-entry{margin-bottom:14px}.category-heading{display:flex;justify-content:space-between;gap:10px;margin-bottom:7px;font-size:12px}.category-heading span{color:#66758e}.category-heading strong{font-size:11px}.category-rail{width:100%;height:7px;border-radius:10px;background:#f0f3f8;overflow:hidden}.category-rail div{height:100%;border-radius:10px;background:#6988ee}.category-entry:nth-child(2n) .category-rail div{background:#55bea5}.category-entry:nth-child(3n) .category-rail div{background:#9a8be7}.forecast{margin-top:19px}.forecast-chart{padding:10px 26px 24px;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));align-items:end;gap:17px;min-height:175px}.forecast-bar{display:flex;flex-direction:column;justify-content:end;align-items:center;gap:6px;min-width:0}.forecast-bar .value{color:var(--text);font-size:11px;font-weight:750;white-space:nowrap}.forecast-bar .vertical{height:90px;width:min(55px,65%);display:flex;align-items:end;border-radius:7px;overflow:hidden;background:#edf2fe}.forecast-bar .vertical div{background:linear-gradient(180deg,#7194ff,#4165e6);border-radius:7px 7px 0 0;width:100%;min-height:3px}.forecast-bar>small{color:var(--muted);font-size:11px;text-align:center;white-space:nowrap}.filterbar{padding:2px 20px 17px;display:flex;gap:9px}.filterbar input{flex:1;min-width:0}.filterbar input,.filterbar select{border:1px solid var(--border);background:var(--input);color:var(--text);border-radius:10px;padding:10px 12px;outline:none}.filterbar select{max-width:210px}.empty{padding:44px 15px;text-align:center;color:var(--muted)}.empty-symbol{display:grid;place-items:center;background:#f1f5ff;color:#819bec;width:57px;height:57px;border-radius:18px;margin:0 auto 13px;font-size:25px}.empty h4{color:var(--text);font-size:15px;margin:0 0 7px}.empty p{margin:0 auto;max-width:350px;font-size:12px;line-height:1.65}.empty button{margin-top:14px}.history-list{padding:0 22px 23px}.history-item{border-top:1px solid var(--border);padding:13px 2px;display:flex;justify-content:space-between;gap:12px}.history-item strong{display:block;font-size:12px;margin-bottom:5px}.history-item span,.history-item time{color:var(--muted);font-size:11px}.footer-note{font-size:11px;color:var(--muted);text-align:center;margin:23px auto 0}.footer-note button{color:var(--primary);border:0;background:transparent;text-decoration:underline;cursor:pointer}.hidden{display:none!important}.mobile-menu{display:none}.modal{width:min(570px,calc(100vw - 30px));border:1px solid var(--border);background:var(--surface);color:var(--text);padding:0;border-radius:19px;box-shadow:0 28px 90px rgba(10,23,48,.24);max-height:min(93vh,1000px)}.modal-wide{width:min(690px,calc(100vw - 30px))}.modal::backdrop{background:rgba(12,26,50,.55);backdrop-filter:blur(3px)}.modal form{display:contents}.modal-header{padding:23px 25px 18px;display:flex;justify-content:space-between;align-items:flex-start;border-bottom:1px solid var(--border)}.modal-header h2{margin:0;font-size:21px;letter-spacing:-.5px}.modal-close{width:32px;height:32px;border:0;border-radius:8px;background:var(--bg);font-size:24px;line-height:1;color:var(--muted)}.modal-body{padding:20px 25px;overflow-y:auto;max-height:calc(92vh - 150px)}.modal-footer{padding:15px 25px;display:flex;justify-content:flex-end;gap:9px;border-top:1px solid var(--border)}.two-col{display:grid;grid-template-columns:1fr 1fr;gap:12px}.field{margin-bottom:15px;min-width:0}.field label{display:block;font-size:12px;font-weight:700;color:var(--text);margin-bottom:7px}.field input,.field select,.field textarea{display:block;width:100%;background:var(--input);border:1px solid #dce3ec;color:var(--text);border-radius:9px;min-height:42px;padding:10px 11px;outline:none}.field textarea{resize:vertical}.field input:focus,.field select:focus,.field textarea:focus{border-color:#819cf4}.checkbox-row{display:flex;gap:10px;align-items:center;margin:8px 0 17px;font-weight:650}.checkbox-row input{width:19px;height:19px;accent-color:var(--primary)}.error-message{margin-top:12px;padding:12px;border:1px solid #ffc5cc;color:#b63c48;background:#fff0f2;border-radius:8px;font-size:12px;line-height:1.5}.settings-section{padding-bottom:21px;margin-bottom:21px;border-bottom:1px solid var(--border)}.settings-section:last-child{border:0;margin:0;padding:0}.settings-section h3{font-size:15px;margin:0 0 8px}.settings-section p{font-size:12px;line-height:1.7;color:var(--muted)}.settings-section code{background:var(--bg);padding:3px 5px;border-radius:4px}.button-line{display:flex;flex-wrap:wrap;gap:8px;align-items:center}.button-line .btn{font-size:12px;padding:10px 12px}.cloud-panel{padding:16px;margin:14px 0;background:var(--bg);border:1px solid var(--border);border-radius:12px}.cloud-panel p:first-child{margin-top:0}.cloud-panel .field:last-child{margin:0}.small-copy{font-size:11px!important;margin-top:9px!important}.toast{position:fixed;right:23px;bottom:23px;padding:12px 17px;background:#1e3456;color:#fff;border-radius:10px;box-shadow:0 11px 28px #0f243544;max-width:calc(100vw - 35px);font-size:13px;line-height:1.5;z-index:40;opacity:0;transform:translateY(15px);transition:opacity .2s,transform .2s;pointer-events:none}.toast.show{opacity:1;transform:translateY(0)}.toast.error{background:#a43b4d}body[data-theme="dark"]{--bg:#101929;--surface:#19263b;--text:#ebf1fc;--muted:#9aacc5;--border:#2d3c53;--input:#1f2e45;--light-blue:#273651;--shadow:0 5px 25px #0000000b}body[data-theme="dark"] .connection-status{background:#283852;color:#c0d0e5}body[data-theme="dark"] .notice{background:#1d3351;color:#bed2f3;border-color:#335280}body[data-theme="dark"] .kpi-icon{background:#263651}body[data-theme="dark"] .category-avatar,body[data-theme="dark"] .empty-symbol{background:#253650}body[data-theme="dark"] .small-button{background:#253a60;border-color:#39517a;color:#a9c0ff}body[data-theme="dark"] .cloud-panel{background:#142034}body[data-theme="dark"] .bill-badge{background:#2b3d57;color:#bdcbe0}body[data-theme="dark"] .progress-rail,body[data-theme="dark"] .category-rail,body[data-theme="dark"] .forecast-bar .vertical{background:#2b3951}
@media(max-width:1190px){.sidebar{width:210px}.topbar{padding:22px 25px}.content{padding:25px}.kpi{gap:9px;padding:20px 13px}.kpi strong{font-size:20px}.section-grid{grid-template-columns:minmax(0,1.4fr) minmax(245px,1fr)}}
@media(max-width:940px){.kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.section-grid{grid-template-columns:1fr}.stack{display:grid;grid-template-columns:1fr 1fr}.sidebar{width:190px}.page-title h1{font-size:19px}}
@media(max-width:720px){.sidebar{position:fixed;left:0;transform:translateX(-105%);transition:transform .2s;box-shadow:20px 0 40px #0003;width:260px}.sidebar.open{transform:translateX(0)}.mobile-menu{display:grid}.topbar{padding:15px 16px}.content{padding:21px 14px}.page-title{gap:9px}.page-title .eyebrow{display:none}.page-title h1{font-size:16px;white-space:nowrap}.top-actions{gap:5px}.top-actions .add-top{padding:7px 11px}.top-actions .add-label{display:none}.top-actions .add-symbol{font-size:23px;line-height:1.1}.connection-status{padding:8px 9px;font-size:10px}.intro-row{align-items:flex-start;flex-direction:column;gap:15px;margin-bottom:18px}.intro-row h2{font-size:23px}.month-switch{width:100%;justify-content:space-between}.kpis{gap:9px}.kpi{padding:15px 12px}.kpi-icon{height:35px;width:35px;font-size:17px}.kpi strong{font-size:18px}.kpi span{font-size:11px}.kpi small{font-size:10px}.stack{grid-template-columns:1fr}.panel-heading{padding:18px 17px 14px}.bill-list{padding:0 7px 7px}.bill-item{gap:7px;padding:13px 8px}.category-avatar{width:35px;height:35px;font-size:17px}.bill-sum{min-width:68px}.bill-sum strong{font-size:12px}.bill-buttons{gap:3px}.action-icon{width:29px;height:29px}.bill-details strong{font-size:12px}.forecast-chart{gap:5px;padding:10px 13px 18px}.forecast-bar .value{font-size:9px}.forecast-bar>small{font-size:9px}.filterbar{flex-direction:column}.filterbar select{max-width:none}.two-col{grid-template-columns:1fr;gap:0}.modal-body{padding:17px}.modal-header,.modal-footer{padding:17px}.notice{align-items:flex-start}}
@media(max-width:370px){.connection-status span{display:none}.kpi{gap:7px}.kpi strong{font-size:16px}.bill-details small{font-size:10px}.bill-sum{min-width:59px}}

.quick-sync{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:12px 0 18px}.remaining-summary{font-weight:700;margin:8px 0 18px;color:var(--text,#24304a)}.swipe-hint{font-size:12px;color:#77849a;margin:0 16px 8px}.bill-item{touch-action:pan-y}

.remaining-summary{margin:0 0 16px;padding:14px 18px;border-radius:14px;background:var(--surface,#fff);font-weight:700;color:var(--text,#17213a);box-shadow:0 2px 12px rgba(20,30,55,.05)}

/* v21.6 — interaktywny gest opłacenia */
.swipe-shell{position:relative;overflow:hidden;border-radius:11px;isolation:isolate;margin:2px 0}
.swipe-paid-bg{position:absolute;inset:0;display:flex;align-items:center;justify-content:flex-start;padding:0 20px;background:linear-gradient(90deg,#16a67d,#34c5a0);color:white;font-size:13px;font-weight:800;letter-spacing:.2px}
.swipe-paid-bg span{opacity:.8;transform:scale(.94);transition:transform .15s,opacity .15s}
.swipe-shell.swipe-ready .swipe-paid-bg span{opacity:1;transform:scale(1.08)}
.swipe-foreground{position:relative;z-index:1;background:var(--surface);will-change:transform;touch-action:pan-y;user-select:none;-webkit-user-select:none}
.swipe-shell.swipe-complete .swipe-foreground{pointer-events:none}
@media(prefers-reduced-motion:reduce){.swipe-foreground,.swipe-paid-bg span{transition-duration:.01ms!important}}

/* v21.9: jedynie nowa górna nawigacja, cała reszta widoku v21.7 bez zmian */
.mobile-quick-nav{display:none}
@media(max-width:720px){
 .mobile-quick-nav{display:block;margin-bottom:14px}
 .quick-head{display:flex;align-items:center;justify-content:space-between;margin:0 1px 14px}
 .quick-head strong{display:block;font-size:26px;letter-spacing:-.9px;color:var(--text)}
 .quick-head em{font-style:normal;font-size:12px;letter-spacing:2px;color:#4c6cf3}
 .quick-head small{display:block;color:var(--muted);font-size:11px;margin-top:3px}
 .quick-gear{width:41px;height:41px;border:1px solid var(--border);background:var(--surface);border-radius:14px;font-size:20px;color:var(--text)}
 .quick-scopes,.quick-tabs{display:grid;gap:5px;padding:5px;background:var(--surface);border:1px solid var(--border);border-radius:17px;margin-bottom:9px}
 .quick-scopes{grid-template-columns:repeat(2,minmax(0,1fr))}
 .quick-tabs{grid-template-columns:repeat(3,minmax(0,1fr))}
 .quick-scope,.quick-tab{border:0;border-radius:12px;padding:12px 4px;background:transparent;color:var(--muted);font-size:13px;font-weight:750;white-space:nowrap}
 .quick-scope.active,.quick-tab.active{background:#365ff5;color:#fff;box-shadow:0 3px 9px #365ff52b}
}

/* v21.10: ukrycie dwóch paneli bez usuwania elementów potrzebnych obliczeniom */
#tabOverview .stack{display:none!important}
#tabOverview .section-grid{grid-template-columns:minmax(0,1fr)!important}
.quick-head-actions{display:flex;align-items:center;gap:7px;flex-shrink:0}
@media(max-width:720px){.quick-head{gap:8px}.quick-head strong{font-size:24px}.quick-head small{font-size:10px}.quick-gear{width:38px;height:38px;min-width:38px;border-radius:12px;font-size:20px}.quick-sync{display:none!important}}
@media(max-width:370px){.quick-head-actions{gap:4px}.quick-gear{width:34px;height:34px;min-width:34px}.quick-head strong{font-size:21px}}

/* v21.11: bez komunikatu o konfiguracji, cztery niskie podsumowania w rzędzie */
#sharedNotice{display:none!important}
.kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.kpi{min-width:0;min-height:85px;padding:13px 12px;gap:8px;align-items:center}
.kpi-icon{width:30px;height:30px;min-width:30px;font-size:15px}
.kpi>div:last-child{min-width:0}
.kpi span{font-size:11px;line-height:1.2}
.kpi strong{display:block;font-size:clamp(13px,1.55vw,20px);line-height:1.25;letter-spacing:-.5px;white-space:nowrap}
.kpi small{display:block;font-size:10px;line-height:1.2}
@media(max-width:940px){.kpis{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:720px){
 .kpis{grid-template-columns:repeat(4,minmax(0,1fr));gap:5px;margin-bottom:10px}
 .kpi{min-height:68px;padding:9px 5px;display:block;border-radius:11px}
 .kpi-icon{display:none}
 .kpi span{font-size:9px;letter-spacing:-.2px;white-space:nowrap}
 .kpi strong{font-size:clamp(10px,2.85vw,15px);margin:5px 0 3px;letter-spacing:-.55px}
 .kpi small{font-size:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
}
@media(max-width:370px){.kpis{gap:4px}.kpi{padding:9px 4px}.kpi strong{font-size:10px}.kpi span{font-size:8.5px}.kpi small{font-size:8px}}
