:root{color-scheme:light dark;--bg:#f3f5f9;--card:#fff;--text:#162034;--muted:#6d788a;--accent:#087af5;--accent-soft:#eaf3ff;--line:#e5eaf1;--shadow:0 8px 30px rgba(30,53,90,.055);--hover:#f5f8fc;--danger:#e43e43}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font:16px -apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,sans-serif;line-height:1.5}header,main{max-width:920px;margin:auto;padding:22px 24px}header{position:relative;padding-top:max(30px,env(safe-area-inset-top));padding-bottom:5px}h1{font-size:clamp(32px,5vw,43px);margin:4px 0 8px;letter-spacing:-1.6px;line-height:1.16}h2{letter-spacing:-.5px}h3{font-size:17px;letter-spacing:-.3px;margin:4px 0 18px}.sub{color:var(--muted);font-size:13px;text-transform:capitalize;font-weight:600}.card{background:var(--card);border:1px solid var(--line);border-radius:22px;padding:clamp(17px,3vw,25px);margin:16px 0;box-shadow:var(--shadow)}.row{display:flex;align-items:center;gap:13px;padding:14px 6px;border-bottom:1px solid var(--line);border-radius:9px;transition:background .16s ease}.row:last-child{border-bottom:0}.row:hover{background:var(--hover)}.grow{flex:1;min-width:0;overflow-wrap:anywhere}.grow[onclick]{cursor:pointer}.muted{color:var(--muted);font-size:13px}.done{text-decoration:line-through;color:var(--muted)}button,input,textarea,select{font:inherit}button{border:1px solid transparent;background:var(--accent);color:#fff;border-radius:13px;padding:11px 17px;cursor:pointer;font-weight:650;line-height:1.35;transition:transform .16s ease,box-shadow .16s ease,background-color .16s ease,border-color .16s ease;touch-action:manipulation}button:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 5px 15px rgba(8,122,245,.17);filter:brightness(1.035)}button:active:not(:disabled){transform:scale(.976);box-shadow:none}button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,.calendar-event:focus-visible{outline:3px solid rgba(8,122,245,.45);outline-offset:3px}button:disabled{opacity:.5;cursor:not-allowed}button.small{font-size:13px;padding:8px 11px;border-radius:10px}button.secondary{background:var(--accent-soft);color:var(--accent)}button.secondary:hover{background:color-mix(in srgb,var(--accent-soft) 85%,var(--accent) 15%)}button.danger{background:color-mix(in srgb,var(--danger) 10%,var(--card));color:var(--danger)}button.danger:hover{background:color-mix(in srgb,var(--danger) 18%,var(--card))}input:not([type=checkbox]),textarea,select{width:100%;padding:13px 14px;border:1px solid var(--line);background:var(--card);color:var(--text);border-radius:12px;margin:6px 0 12px;min-height:47px;transition:border-color .15s,box-shadow .15s}input:not([type=checkbox]):hover,textarea:hover,select:hover{border-color:color-mix(in srgb,var(--accent) 35%,var(--line))}input:not([type=checkbox]):focus,textarea:focus,select:focus{border-color:var(--accent);box-shadow:0 0 0 4px rgba(8,122,245,.09);outline:0}input[type=checkbox]{width:23px;height:23px;accent-color:var(--accent);margin:0;flex:none;cursor:pointer}label{display:block;margin-top:8px;font-size:14px;font-weight:600}.actions{display:flex;gap:9px;flex-wrap:wrap;margin:14px 0}nav{position:fixed;bottom:0;left:0;right:0;display:flex;justify-content:center;gap:5px;background:color-mix(in srgb,var(--card) 92%,transparent);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border-top:1px solid var(--line);padding:9px 9px max(10px,env(safe-area-inset-bottom));z-index:10}nav[hidden]{display:none}nav button{background:transparent;color:var(--muted);border-radius:12px;flex:1;max-width:180px;font-size:12px;padding:12px 3px;box-shadow:none!important}nav button:hover{background:var(--hover);color:var(--accent)}nav button.active{color:var(--accent);background:var(--accent-soft);font-weight:750}main{padding-bottom:calc(112px + env(safe-area-inset-bottom))}.empty{color:var(--muted);padding:16px 0;font-size:14px}#logout{position:absolute;right:24px;top:32px}dialog{border:1px solid var(--line);border-radius:23px;background:var(--card);color:var(--text);width:min(94vw,490px);max-height:calc(100dvh - 30px);overflow:auto;padding:25px;box-shadow:0 24px 80px rgba(0,0,0,.22)}dialog::backdrop{background:rgba(10,17,35,.48);backdrop-filter:blur(3px)}dialog h2{margin-top:0}.calendar-help{font-size:.88rem;color:var(--muted);line-height:1.65}.calendar-buttons{display:flex;gap:9px;flex-wrap:wrap;margin:18px 0}.calendar-buttons button{max-width:100%}.calendar-panel{padding-bottom:28px}.month-calendar{margin:22px 0 24px;border:1px solid var(--line);border-radius:19px;padding:15px;background:color-mix(in srgb,var(--card) 92%,var(--bg))}.month-header{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:14px}.month-label{font-size:19px;margin:0;font-weight:750;text-transform:capitalize;letter-spacing:-.45px;text-align:center}.month-arrow{font-size:27px;line-height:1;padding:4px;width:40px;height:40px;background:var(--accent-soft);color:var(--accent);box-shadow:none!important}.month-weekdays,.month-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:5px}.month-weekdays span{font-size:12px;font-weight:700;color:var(--muted);text-align:center;padding:6px 0 10px}.month-day{position:relative;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:2px;width:100%;aspect-ratio:1.07;min-width:0;min-height:39px;border-radius:12px;background:transparent;color:var(--text);font-size:14px;font-weight:600;padding:3px;box-shadow:none!important}.month-day:hover{background:var(--accent-soft);color:var(--accent)}.month-day.selected{background:var(--accent);color:white}.month-day.is-today:not(.selected){border:1.5px solid var(--accent);color:var(--accent)}.event-dot{position:absolute;bottom:5px;width:5px;height:5px;border-radius:50%;background:var(--accent)}.month-day.selected .event-dot{background:white}.month-footer{display:flex;justify-content:flex-end;margin-top:13px}.selected-day-title{margin:24px 0 12px;text-transform:capitalize}.calendar-events{display:grid;gap:10px}.calendar-event{border:1px solid var(--line);border-left:4px solid var(--accent);padding:15px 16px;background:var(--card);border-radius:12px;cursor:pointer;transition:transform .15s,box-shadow .15s,border-color .15s}.calendar-event:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--accent) 40%,var(--line));box-shadow:0 8px 19px rgba(8,122,245,.09)}.calendar-event strong{display:block;font-size:15px}.calendar-event small{display:block;color:var(--muted);margin-top:5px;font-size:12px}.calendar-day-row{display:flex;align-items:center;gap:10px;margin:10px 0}@media(prefers-color-scheme:dark){:root{--bg:#101216;--card:#1c2027;--text:#f1f4fb;--muted:#a1abbc;--accent:#5aa4ff;--accent-soft:#1f3857;--line:#303743;--shadow:0 8px 30px rgba(0,0,0,.12);--hover:#262c35;--danger:#ff7272}}@media(min-width:900px){nav{left:0;right:auto;top:0;bottom:0;width:205px;flex-direction:column;justify-content:flex-start;gap:8px;padding:128px 13px 20px;border-top:0;border-right:1px solid var(--line)}nav button{flex:none;max-width:none;font-size:15px;text-align:left;padding:15px 19px}header,main{max-width:910px;position:relative;left:100px}}@media(max-width:480px){header,main{padding-left:16px;padding-right:16px}.card{border-radius:19px}.row{gap:8px}.row button.small{padding:8px 8px;font-size:12px}.month-calendar{padding:10px}.month-grid,.month-weekdays{gap:3px}.month-day{min-height:37px;font-size:13px}.month-label{font-size:17px}dialog{width:100vw;max-width:none;position:fixed;top:auto;bottom:0;margin:0;border-radius:23px 23px 0 0;padding:22px 20px max(20px,env(safe-area-inset-bottom));max-height:90dvh}#logout{right:16px}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;animation:none!important;scroll-behavior:auto!important}}

/* PLANER 1.4 — większy kontrast, lekkie akcje, dopracowane arkusze */
:root{--accent:#4169e1;--accent-soft:#e9eeff;--bg:#f1f4fb;--card:#ffffff;--hover:#f0f4ff;--shadow:0 7px 32px rgba(39,67,124,.075);--line:#dfe5f1}
button{min-height:43px;letter-spacing:-.12px}
button.primary{background:linear-gradient(125deg,#4169e1,#5578e8)}
button.secondary{border:1px solid color-mix(in srgb,var(--accent) 11%,var(--line))}
button:active:not(:disabled){transform:scale(.965)}
.card{box-shadow:var(--shadow);border-radius:23px}
.card h3{font-size:18px}
.calendar-panel{background:var(--card)}
.month-calendar{background:linear-gradient(170deg,var(--accent-soft),var(--card) 35%);border:1px solid var(--line)}
.month-day{min-height:42px;font-weight:650}
.month-day.selected{box-shadow:0 6px 13px rgba(65,105,225,.22)!important}
.calendar-event{border-left-width:5px;box-shadow:0 2px 8px rgba(20,40,90,.04)}
.form-modal{padding:27px 28px 23px}
.form-modal h2{font-size:24px;margin:0 0 17px;letter-spacing:-.65px}
.form-modal label{margin:14px 0 3px;color:var(--text);font-weight:680}
.form-modal input,.form-modal textarea,.form-modal select{margin-top:5px}
.form-modal .actions{position:sticky;bottom:-23px;background:var(--card);padding:14px 0 5px;margin-bottom:0;border-top:1px solid var(--line);z-index:1}
.form-modal .actions button:last-child{flex:1}
.form-modal textarea{min-height:110px;resize:vertical}
input[data-shopping-add]{border:2px solid color-mix(in srgb,var(--accent) 24%,var(--line));background:var(--card)}
input[data-shopping-add]:focus{border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-soft)}
[hidden]{display:none!important}
@media(prefers-color-scheme:dark){:root{--bg:#101521;--card:#1c2535;--text:#f5f7ff;--muted:#aebbd1;--accent:#89a7ff;--accent-soft:#293a61;--line:#344059;--hover:#27334a;--shadow:0 8px 28px rgba(0,0,0,.2)}}
@media(max-width:600px){
 .form-modal{padding:24px 20px max(20px,env(safe-area-inset-bottom));width:100vw;max-height:min(91dvh,850px);overscroll-behavior:contain}
 .form-modal h2{font-size:23px;margin-bottom:10px}
 .form-modal .actions{bottom:calc(-20px - env(safe-area-inset-bottom));padding-bottom:max(10px,env(safe-area-inset-bottom))}
 .form-modal .actions button{min-height:47px}
 .form-modal input{font-size:16px}
 .row{align-items:center}
}

/* PLANNER 1.5 — ergonomia pulpitu i iPhone'a; nadpisania bez ingerencji w API */
:root{--bg:#f3f6fc;--card:#fff;--text:#17243b;--muted:#64758e;--accent:#3464dd;--accent-soft:#eaf0ff;--line:#e1e8f3;--hover:#f1f5ff;--shadow:0 8px 30px rgba(36,66,118,.055)}
html{min-width:320px;-webkit-text-size-adjust:100%}
body{overflow-x:hidden;overscroll-behavior-x:none}
button,input,select,textarea{-webkit-tap-highlight-color:transparent}
button{touch-action:manipulation;user-select:none;-webkit-user-select:none}
button:active:not(:disabled){filter:brightness(.94);transform:scale(.97)}
nav{isolation:isolate}
.nav-brand,.nav-footer{display:none}
.nav-links{display:contents}
nav button{display:flex;align-items:center;justify-content:center;gap:5px;flex-direction:column;min-width:0;min-height:58px}
nav button svg{width:21px;height:21px;flex:none;stroke-width:1.8;transition:transform .16s ease}
nav button span{font-size:11px;white-space:nowrap}
nav button.active svg{stroke-width:2.3}
nav button:active svg{transform:scale(.87)}
.preview-row{cursor:default}
.preview-row:hover{background:transparent}
.preview-row input[type=checkbox]{pointer-events:none;opacity:.65}
.preview-card .calendar-event{cursor:default}
.preview-card .calendar-event:hover{transform:none;box-shadow:none}
.month-calendar{max-width:100%;overflow:hidden}
.month-day{touch-action:manipulation}
.month-day:focus-visible,.calendar-event:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
.card,.month-calendar,.calendar-event{min-width:0}
.row{min-width:0}
.actions button{min-height:44px}
dialog{overscroll-behavior:contain}
@media(min-width:900px){
  nav{width:244px;padding:0 14px 22px;gap:0;background:color-mix(in srgb,var(--card) 97%,var(--accent-soft));box-shadow:4px 0 24px rgba(19,40,77,.025)}
  .nav-brand{display:flex;flex-direction:column;align-items:flex-start;padding:35px 13px 31px;border-bottom:1px solid var(--line);margin-bottom:18px}
  .brand-mark{width:48px;height:48px;display:grid;place-items:center;border-radius:15px;background:linear-gradient(145deg,#3569e9,#6289ef);color:white;font-weight:850;font-size:31px;letter-spacing:-3px;box-shadow:0 7px 18px rgba(52,100,221,.21);margin-bottom:17px}
  .brand-mark span{color:#c5d7ff}
  .brand-name{font-size:23px;font-weight:830;letter-spacing:1px;color:var(--text);line-height:1.2}
  .brand-caption{font-size:12px;color:var(--muted);margin-top:6px;letter-spacing:.1px}
  .nav-links{display:flex;flex-direction:column;gap:7px;width:100%}
  nav button{display:flex;flex-direction:row;justify-content:flex-start;align-items:center;text-align:left;gap:15px;width:100%;min-height:52px;padding:13px 15px;border-radius:14px;font-size:15px}
  nav button svg{width:22px;height:22px}
  nav button span{font-size:14px}
  nav button.active{box-shadow:inset 3px 0 0 var(--accent)!important}
  .nav-footer{display:flex;align-items:center;justify-content:space-between;margin-top:auto;padding:15px 13px 0;border-top:1px solid var(--line);font-size:11px;color:var(--muted);letter-spacing:.65px}
  .nav-footer span{letter-spacing:0}
  header,main{left:auto;margin-left:244px;margin-right:auto;width:calc(100% - 244px);max-width:1110px;padding-left:clamp(26px,4vw,56px);padding-right:clamp(26px,4vw,56px)}
  header{padding-top:30px}
  #logout{right:clamp(26px,4vw,56px)}
  main{padding-bottom:65px}
  .calendar-panel{max-width:800px}
  .month-calendar{max-width:485px;margin:15px auto 22px;padding:15px 18px}
  .month-day{min-height:34px;max-height:51px;aspect-ratio:1.15;font-size:13px}
  .month-grid,.month-weekdays{gap:3px}
  .month-header{margin-bottom:8px}
  .month-label{font-size:17px}
  .month-arrow{height:35px;min-height:35px;width:35px;font-size:22px}
  .month-weekdays span{padding:4px 0 6px;font-size:11px}
  .calendar-events{max-width:720px}
}
@media(max-width:899px){
  #app{min-height:100dvh}
  header,main{width:100%;max-width:750px}
  nav{padding-left:max(8px,env(safe-area-inset-left));padding-right:max(8px,env(safe-area-inset-right));gap:2px}
  nav button{flex:1 1 0;max-width:none;padding:7px 2px;min-height:60px;border-radius:12px}
  main{padding-bottom:calc(108px + env(safe-area-inset-bottom))}
}
@media(max-width:600px){
  header,main{padding-left:max(16px,env(safe-area-inset-left));padding-right:max(16px,env(safe-area-inset-right))}
  header{padding-top:calc(18px + env(safe-area-inset-top));padding-bottom:1px}
  h1{font-size:33px;line-height:1.22;margin:6px 0 0}
  .card{margin:12px 0;padding:17px 15px;border-radius:19px}
  .row{gap:9px;padding:12px 2px;flex-wrap:wrap}
  .row .grow{flex:1 1 52%;min-width:90px}
  .row button.small{min-height:42px;min-width:48px;padding:9px 11px}
  input[type=checkbox]{width:25px;height:25px}
  .month-calendar{margin:15px 0;padding:11px 9px;border-radius:16px}
  .month-grid,.month-weekdays{gap:2px}
  .month-day{min-height:40px;aspect-ratio:1.06;border-radius:10px;font-size:13px;padding:2px}
  .month-day:active{background:var(--accent-soft)}
  .month-weekdays span{font-size:11px;padding:5px 0}
  .month-label{font-size:16px}
  .month-arrow{width:42px;height:42px;min-height:42px}
  .event-dot{bottom:3px}
  .calendar-event{padding:14px 12px}
  .calendar-buttons{gap:8px}
  .calendar-buttons button{flex:1 1 auto;min-height:46px}
  dialog,.form-modal{width:100%;max-width:100%;max-height:min(90dvh,900px);max-height:min(90svh,900px);border-radius:23px 23px 0 0;padding:23px max(18px,env(safe-area-inset-right)) max(18px,env(safe-area-inset-bottom)) max(18px,env(safe-area-inset-left));margin:0;top:auto;bottom:0;left:0;right:0}
  dialog::before{content:'';display:block;width:38px;height:5px;margin:-10px auto 18px;border-radius:8px;background:var(--line)}
  .form-modal .actions{gap:10px;bottom:calc(-18px - env(safe-area-inset-bottom));padding:13px 0 max(10px,env(safe-area-inset-bottom));flex-wrap:nowrap}
  .form-modal .actions button{flex:1 1 0;min-height:49px}
  .form-modal input,.form-modal textarea,.form-modal select,input,textarea,select{font-size:16px}
  .form-modal label{margin-top:12px}
}
@media(max-width:360px){nav button span{font-size:10px}.month-day{min-height:36px}.row button.small{font-size:12px;padding:8px}}
@media(prefers-color-scheme:dark){:root{--bg:#111827;--card:#1b2638;--text:#f2f5fc;--muted:#afbdd3;--accent:#90afff;--accent-soft:#283c64;--line:#34415a;--hover:#273a56;--shadow:0 8px 32px rgba(0,0,0,.15)}.brand-mark{color:white}}

/* PLANNER 1.6 — responsive task interactions and today dates */
.task-row{gap:10px;min-width:0;flex-wrap:nowrap!important;padding:7px 4px;transition:background .14s ease,border-color .14s ease}
.task-info{appearance:none;-webkit-appearance:none;border:1px solid transparent;background:transparent;color:var(--text);display:flex;flex-direction:column;align-items:flex-start;justify-content:center;text-align:left;gap:5px;flex:1 1 auto;min-width:0;max-width:none;padding:11px 12px;border-radius:14px;line-height:1.35;white-space:normal;box-shadow:none!important;overflow-wrap:anywhere;transform:none!important}
.task-info:hover:not(:disabled){background:var(--accent-soft);border-color:color-mix(in srgb,var(--accent) 24%,transparent);filter:none;transform:none!important}
.task-info:active:not(:disabled){background:color-mix(in srgb,var(--accent-soft) 80%,var(--accent) 20%);transform:scale(.99)!important}
.task-name{font-weight:680;font-size:15px;line-height:1.4}
.task-date{display:flex;flex-wrap:wrap;align-items:center;gap:5px 11px;font-size:12px;font-weight:620;color:var(--muted)}
.task-time{padding:2px 8px;border-radius:8px;color:var(--accent);background:var(--accent-soft)}
.preview-row .task-info{pointer-events:none;padding-left:6px;cursor:default}
.preview-row:hover{background:transparent}
.preview-indicator{font-weight:900;color:var(--accent);min-width:24px;text-align:center;opacity:.8}
.today-date-banner{font-size:13px;color:var(--accent);font-weight:720;margin:-8px 0 13px;text-transform:capitalize}
.today-calendar .calendar-event{border-left-width:4px;background:color-mix(in srgb,var(--accent-soft) 26%,var(--card))}
.task-edit{flex:0 0 auto}
.toast-host{position:fixed;right:18px;bottom:calc(95px + env(safe-area-inset-bottom));z-index:1000;display:grid;gap:8px;pointer-events:none;max-width:min(420px,calc(100vw - 36px))}
.toast{background:var(--text);color:var(--card);border-radius:13px;padding:12px 16px;box-shadow:0 12px 35px rgba(0,0,0,.18);font-size:13px;font-weight:630;line-height:1.5}
.toast.error{background:#a82532;color:#fff}.toast.success{background:#205d4b;color:#fff}
.brand-mark{letter-spacing:0!important}.brand-mark svg{display:block}
@media(max-width:600px){.task-row{gap:5px}.task-info{padding:11px 7px;min-height:56px}.task-edit{min-width:54px!important;padding:9px!important}.task-name{font-size:14px}.task-date{font-size:11px}.toast-host{left:12px;right:12px;bottom:calc(90px + env(safe-area-inset-bottom))}.form-modal{scroll-padding-bottom:100px}.form-modal .actions{position:sticky;bottom:0;box-shadow:0 -9px 17px -17px rgba(0,0,0,.3)} }
@media(min-width:900px){.toast-host{bottom:20px}}

/* PLANNER 1.6.2 — Dzisiaj: checkbox aktywny, tytuł bez edycji */
.preview-row input[type=checkbox]{pointer-events:auto;opacity:1;cursor:pointer;flex-shrink:0}
.preview-row .task-info{pointer-events:none;cursor:default;min-width:0}
.preview-row .task-info:hover{background:transparent;border-color:transparent}
.preview-row{align-items:center}

/* PLANNER 1.7 — jeden modal szczegółów i edycji */
.preview-row .task-info{pointer-events:auto;cursor:pointer;padding-left:11px}
.preview-row .task-info:hover{background:var(--accent-soft);border-color:color-mix(in srgb,var(--accent) 24%,transparent)}
.preview-row:hover{background:color-mix(in srgb,var(--accent-soft) 15%,transparent)}
.task-info:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
.task-detail-modal{width:min(560px,calc(100vw - 24px));max-height:min(86dvh,850px);overflow-y:auto;overscroll-behavior:contain}
.task-dialog-heading{margin:0 0 19px}
.task-detail-title{font-size:clamp(19px,3.5vw,25px);line-height:1.3;margin:0 0 15px;overflow-wrap:anywhere}
.task-detail-meta{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:18px}
.task-meta-chip{font-size:12px;color:var(--text);background:var(--accent-soft);padding:7px 11px;border-radius:10px;font-weight:650}
.task-detail-actions{margin:16px 0 22px}
.task-notes{border-top:1px solid var(--line);padding-top:16px;margin-top:8px}
.task-notes h3{margin:0 0 13px}
.task-note-item{border:1px solid var(--line);border-radius:14px;padding:12px 14px;margin:9px 0;background:color-mix(in srgb,var(--card) 88%,var(--accent-soft) 12%)}
.task-note-text{white-space:pre-wrap;overflow-wrap:anywhere;margin:0 0 10px;line-height:1.55}
.task-note-actions{display:flex;gap:8px;justify-content:flex-end;flex-wrap:wrap}
.task-notes-controls{margin:13px 0}
.task-note-editor{padding:13px;border:1px solid var(--accent);border-radius:14px;margin:12px 0}
.task-note-editor textarea{width:100%;min-height:110px}
.task-attachments-info{font-size:12px}
.task-edit-form{display:grid;gap:11px}
.task-edit-field{display:grid;gap:5px;min-width:0}
.task-edit-field label{margin:0;font-weight:650}
.task-edit-field input{width:100%;min-width:0}
@media(max-width:600px){.task-detail-modal{width:100%;max-height:90dvh;max-height:90svh;padding-bottom:max(18px,env(safe-area-inset-bottom))}.task-detail-actions button{min-height:48px}.task-note-actions button{min-height:40px}.task-detail-meta{gap:6px}}


/* PLANNER 1.8 — Zakupy: nowy interfejs dotykowy */
.shop-page{width:100%;min-width:0;max-width:800px;margin:0 auto;padding-bottom:24px}
.shop-hero{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:8px 0 24px}
.shop-eyebrow{color:var(--accent);font-size:12px;font-weight:750;text-transform:uppercase;letter-spacing:.1em}
.shop-headline{font-size:clamp(25px,4.4vw,35px);line-height:1.2;letter-spacing:-.9px;margin:5px 0 7px;overflow-wrap:anywhere}
.shop-hint{color:var(--muted);font-size:13px;margin:0;line-height:1.5}
button.shop-primary{border-radius:14px;min-height:48px;padding:12px 18px;white-space:nowrap;box-shadow:0 6px 16px rgba(8,122,245,.13)}
.shop-list-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.shop-list-tile{display:flex;min-width:0;align-items:stretch;background:var(--card);border:1px solid var(--line);border-radius:19px;box-shadow:var(--shadow);transition:border-color .16s,transform .16s,box-shadow .16s;overflow:hidden}
.shop-list-tile:hover{border-color:color-mix(in srgb,var(--accent) 42%,var(--line));transform:translateY(-2px);box-shadow:0 10px 27px rgba(20,70,140,.09)}
button.shop-list-open{min-width:0;min-height:104px;display:flex;align-items:center;gap:12px;flex:1;background:transparent;color:var(--text);border-radius:0;padding:18px 6px 18px 17px;text-align:left;box-shadow:none!important;transform:none!important}
.shop-list-icon{flex:none;display:flex;align-items:center;justify-content:center;border-radius:14px;background:var(--accent-soft);color:var(--accent);width:44px;height:44px;font-size:25px}
.shop-list-text{display:grid;gap:5px;min-width:0;flex:1}.shop-list-name{font-weight:760;font-size:16px;overflow-wrap:anywhere}.shop-list-subtitle{font-size:12px;color:var(--muted)}.shop-chevron{color:var(--muted);font-size:25px;font-weight:400}
button.shop-more{flex:none;min-width:42px;min-height:44px;align-self:center;margin:0 8px 0 0;background:transparent;color:var(--muted);font-size:15px;letter-spacing:1px;padding:8px;border-radius:12px;box-shadow:none!important}
button.shop-more:hover{color:var(--accent);background:var(--accent-soft)}
.shop-topbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}
button.shop-back{background:transparent;color:var(--accent);padding:10px 6px;font-size:14px;font-weight:700;box-shadow:none!important}
.shop-list-heading{background:var(--card);border:1px solid var(--line);border-radius:21px;padding:20px 22px;margin-bottom:16px;box-shadow:var(--shadow)}
.shop-progress{font-size:13px;color:var(--muted);font-weight:600;margin:8px 0 12px}.shop-track{height:7px;border-radius:20px;background:var(--accent-soft);overflow:hidden}.shop-fill{height:100%;width:0;background:var(--accent);border-radius:inherit;transition:width .25s ease}
.shop-add-form{display:flex;align-items:center;gap:10px;background:var(--card);border:1px solid var(--line);border-radius:18px;padding:9px;margin-bottom:16px;box-shadow:var(--shadow)}
.shop-add-form input:not([type=checkbox]){flex:1;min-width:0;width:0;min-height:48px;margin:0;border:none;box-shadow:none!important;background:transparent;padding:10px 12px;font-size:16px}.shop-add-form input:focus{outline:none}
.shop-add-form button{min-width:88px}
.shop-group{background:var(--card);border:1px solid var(--line);border-radius:20px;overflow:hidden;margin:12px 0 17px;box-shadow:var(--shadow)}
.shop-group-label{font-size:13px;color:var(--muted);font-weight:760;padding:16px 18px 11px;margin:0;border-bottom:1px solid var(--line)}
.shop-product{display:flex;align-items:center;gap:13px;min-height:65px;padding:7px 12px 7px 17px;border-bottom:1px solid var(--line);transition:background .15s ease}.shop-product:last-child{border-bottom:0}.shop-product:hover{background:var(--hover)}
.shop-product input.shop-check{width:27px;height:27px;flex-shrink:0;accent-color:var(--accent)}
button.shop-product-name{display:block;flex:1;min-width:0;background:none;color:var(--text);text-align:left;font-size:16px;font-weight:590;padding:13px 3px;overflow-wrap:anywhere;box-shadow:none!important;transform:none!important}
button.shop-product-name:hover{color:var(--accent)}.shop-product.is-bought button.shop-product-name{color:var(--muted);text-decoration:line-through;text-decoration-thickness:1.5px}
.shop-empty{text-align:center;padding:38px 20px;color:var(--muted)}.shop-empty-main{border:1px dashed var(--line);border-radius:20px;background:var(--card)}.shop-empty-title{color:var(--text);font-weight:760;font-size:17px;margin-bottom:8px}.shop-empty p{font-size:14px;line-height:1.55}.shop-empty button{margin-top:12px}
.shop-menu{width:min(420px,calc(100vw - 26px));padding:19px;display:flex;flex-direction:column;gap:8px}.shop-menu:not([open]){display:none}.shop-menu-title{font-size:20px;margin:2px 0 12px}.shop-menu-action,.shop-menu-cancel{min-height:49px;width:100%;text-align:left}.shop-menu-cancel{text-align:center;background:var(--accent-soft);color:var(--accent)}
@media(max-width:650px){.shop-hero{align-items:stretch;flex-direction:column;gap:16px;margin-bottom:18px}.shop-hero button{align-self:stretch}.shop-list-grid{grid-template-columns:1fr;gap:10px}button.shop-list-open{min-height:82px;padding:12px 7px 12px 14px}.shop-list-icon{width:41px;height:41px}.shop-list-heading{padding:18px}.shop-add-form{gap:5px;padding:6px}.shop-add-form input:not([type=checkbox]){padding:8px}.shop-add-form button{min-width:74px;padding:11px 12px}.shop-product{min-height:63px;padding:5px 9px 5px 14px;gap:10px}.shop-product input.shop-check{width:28px;height:28px}.shop-product-name{min-height:50px}.shop-menu{position:fixed;inset:auto 0 0 0;width:100%;max-width:none;max-height:calc(90dvh - env(safe-area-inset-bottom));border-radius:22px 22px 0 0;padding:20px 16px max(22px,env(safe-area-inset-bottom));margin:0}.shop-menu::backdrop{background:rgba(8,15,28,.5)}}
@media(prefers-reduced-motion:reduce){.shop-list-tile,.shop-fill{transition:none}}

/* PLANNER v1.9 — modal, menu i interakcje */
a,button,[role="button"],summary,select,input[type="checkbox"],input[type="radio"],.calendar-event,.task-info{cursor:pointer}
button:disabled,input:disabled,[aria-disabled="true"]{cursor:not-allowed}
.task-detail-modal{padding:0!important;overflow-y:auto}
.task-modal-toolbar{position:sticky;top:0;z-index:4;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:14px 20px;background:var(--card);border-bottom:1px solid var(--line);min-height:66px}
.task-toolbar-label{font-size:13px;color:var(--muted);font-weight:750;letter-spacing:.04em;text-transform:uppercase}
.task-toolbar-buttons{display:flex;gap:9px;margin-left:auto}
button.modal-icon{width:42px;height:42px;min-height:42px;min-width:42px;display:inline-grid;place-items:center;padding:0;border-radius:13px;background:var(--accent-soft);color:var(--text);border:1px solid var(--line);box-shadow:none;touch-action:manipulation}
button.modal-icon.accent{color:var(--accent);background:var(--accent-soft);border-color:color-mix(in srgb,var(--accent) 25%,var(--line))}
button.modal-icon:hover{background:color-mix(in srgb,var(--accent-soft) 65%,var(--accent) 12%);color:var(--accent)}
button.modal-icon svg{width:20px;height:20px;pointer-events:none}
.task-detail-content{padding:23px 24px 28px}
.task-detail-meta{margin:0 0 18px;gap:8px}
.task-detail-title{margin:0 0 22px;font-size:clamp(22px,3.6vw,29px);line-height:1.28;letter-spacing:-.55px}
.task-meta-chip{font-size:12px;padding:8px 10px}
.task-meta-chip.is-done{color:#226f52;background:color-mix(in srgb,#57b993 16%,var(--card))}
.task-locked-hint{font-size:13px;color:var(--muted);padding:10px 13px;border-radius:12px;background:var(--hover);line-height:1.5}
.task-notes{margin-top:16px;padding-top:19px}
.task-notes h3{margin:0 0 14px}
.task-edit-actions{margin-top:20px!important}
.nav-bottom{display:none}
@media(min-width:900px){
 .nav-brand{flex-direction:row;align-items:center;gap:12px;padding:32px 12px 26px;margin-bottom:17px}
 .brand-mark{margin:0;width:43px;height:43px;border-radius:13px;flex:none}
 .brand-mark svg{width:29px;height:29px}
 .brand-name{font-size:22px;letter-spacing:.3px;white-space:nowrap}
 .brand-caption{display:none}
 #logout{display:none!important}
 .nav-bottom{display:flex;flex-direction:column;margin-top:auto;gap:10px;width:100%;padding:10px 4px 0}
 nav .nav-bottom #sidebar-logout{display:flex;justify-content:flex-start;align-items:center;gap:13px;width:100%;min-height:46px;padding:11px 13px;background:transparent;color:var(--muted);border:1px solid var(--line);font-size:14px;text-align:left}
 nav .nav-bottom #sidebar-logout:hover{color:var(--danger);background:color-mix(in srgb,var(--danger) 7%,var(--card));border-color:color-mix(in srgb,var(--danger) 25%,var(--line))}
 .nav-bottom .nav-footer{margin:0;padding:10px 9px 0}
}
@media(max-width:899px){.nav-bottom{display:none!important}}
@media(max-width:600px){
 .task-modal-toolbar{min-height:65px;padding:11px 17px}
 .task-detail-content{padding:20px 18px max(26px,env(safe-area-inset-bottom))}
 .task-detail-modal{padding:0!important;max-height:90dvh;max-height:90svh}
 button.modal-icon{min-width:45px;min-height:45px;width:45px;height:45px}
 .task-detail-title{font-size:23px}
}

.generic-modal-toolbar{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 0 15px}
.generic-modal-toolbar h2{font-size:clamp(19px,3vw,23px);margin:0;line-height:1.25}
.generic-modal-toolbar button.modal-icon{flex:none}
.form-modal .generic-modal-toolbar{margin-bottom:17px}

/* PLANNER 2.0 — techniczna paleta, lepsza hierarchia, ergonomiczne interakcje */
:root{--bg:#f6f7f9;--card:#ffffff;--text:#18232d;--muted:#647481;--accent:#167c70;--accent-soft:#e4f5f0;--line:#e1e6e8;--hover:#eff5f3;--shadow:0 3px 18px rgba(20,42,46,.045);--danger:#cc4f58}
@media(prefers-color-scheme:dark){:root{--bg:#101419;--card:#1b2229;--text:#f2f6f5;--muted:#a1b0bb;--accent:#66d0b2;--accent-soft:#203b37;--line:#33404a;--hover:#26343b;--shadow:0 6px 22px rgba(0,0,0,.11);--danger:#ff8186}}
body{background:var(--bg)}
.card{box-shadow:var(--shadow);border-radius:18px}
.card h3{font-size:17px;letter-spacing:-.3px}
button.primary{background:var(--accent);color:#fff;box-shadow:none}
button:focus-visible,.task-row-interactive:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
.task-row-interactive{cursor:pointer;position:relative;min-height:66px;border-radius:13px;padding:12px 14px!important;display:flex;align-items:center;gap:15px;transition:background-color .13s ease,box-shadow .13s ease,transform .13s ease}
.task-row-interactive:hover,.preview-row.task-row-interactive:hover{background:var(--hover)!important;box-shadow:inset 0 0 0 1px var(--line)}
.task-row-interactive:active{transform:scale(.997);background:var(--accent-soft)!important}
.task-row-interactive .task-info{cursor:pointer;flex:1;min-width:0;padding:3px 0!important;background:transparent!important;border:0!important;box-shadow:none!important;pointer-events:none;text-align:left}
.task-row-interactive input[type=checkbox],.preview-row.task-row-interactive input[type=checkbox]{pointer-events:auto!important;opacity:1!important;cursor:pointer;flex:none;width:25px;height:25px;accent-color:var(--accent);margin:0}
.task-row-interactive .task-name{font-size:15px;font-weight:650}
.task-row-interactive .task-date{margin-top:5px;color:var(--muted)}
.task-row-interactive .task-time{color:var(--accent);font-weight:700}
.today-calendar{order:0}
.today-date-banner{font-size:13px;font-weight:650;color:var(--muted);margin:-4px 0 16px;text-transform:capitalize}
.calendar-event,.preview-card .calendar-event{cursor:pointer!important;transition:background-color .14s,border-color .14s,transform .14s;box-shadow:none!important}
.calendar-event:hover,.preview-card .calendar-event:hover{background:var(--hover);border-color:var(--accent);transform:translateY(-1px)}
.calendar-event:active{transform:scale(.995)}
.month-day.selected{box-shadow:none!important}
.month-calendar{background:var(--card)}
.task-detail-modal,.event-detail-modal{background:var(--card);border:1px solid var(--line);border-radius:19px;padding:0!important;overflow:auto}
.task-modal-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:17px 21px;flex-wrap:wrap;position:sticky;top:0;background:var(--card);border-bottom:1px solid var(--line)}
.task-modal-meta{display:flex;flex:1 1 auto;flex-wrap:wrap;gap:6px;margin:0!important;align-items:center}
.task-meta-chip{font-size:12px;border-radius:9px;padding:7px 10px;background:var(--accent-soft);color:var(--text)}
.task-detail-content{padding:24px 23px 29px}
.task-detail-title,.event-detail-title{font-size:clamp(23px,3vw,29px);line-height:1.25;margin:3px 0 22px;overflow-wrap:anywhere}
.task-notes{border-top:1px solid var(--line);padding-top:21px}
.task-note-item{background:var(--hover);border:1px solid var(--line);border-radius:13px;padding:15px;margin-bottom:10px}
.task-note-text{white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.6}
.task-note-actions{display:flex;justify-content:flex-end;gap:7px;margin-top:9px}
.task-note-actions .modal-icon{width:39px;height:39px;min-width:39px;min-height:39px}
button.modal-icon.danger{color:var(--danger);background:color-mix(in srgb,var(--danger) 8%,var(--card))}
.event-detail-toolbar{display:flex;align-items:center;justify-content:space-between;padding:15px 21px;border-bottom:1px solid var(--line);gap:10px}
.event-detail-content{padding:22px 23px 29px}
.event-when{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px}
.event-detail-description{white-space:pre-wrap;line-height:1.65;background:var(--hover);padding:15px;border-radius:12px;overflow-wrap:anywhere}
.event-detail-location{color:var(--muted)}
@media(min-width:900px){nav{background:var(--card)}.nav-brand{border-bottom:1px solid var(--line)}.brand-mark{background:var(--accent);box-shadow:none}.calendar-panel{max-width:760px}.month-calendar{max-width:445px}}
@media(max-width:600px){.task-row-interactive{min-height:68px;padding:13px 10px!important}.task-modal-toolbar{padding:14px 16px;gap:10px}.task-modal-meta{flex-basis:100%;order:0}.task-toolbar-buttons{order:1;margin-left:auto}.task-detail-content,.event-detail-content{padding:19px 17px max(25px,env(safe-area-inset-bottom))}.event-detail-modal{width:100%;max-height:90dvh;margin:0;position:fixed;bottom:0;top:auto;left:0;right:0;border-radius:22px 22px 0 0}.event-detail-toolbar{padding:12px 17px}.task-meta-chip{font-size:11px}}

/* PLANNER 2.1 — Treść zadania i edytor */
.rich-editor{border:1px solid var(--border,#374151);border-radius:14px;overflow:hidden;margin:8px 0 18px;background:var(--surface,#1b2229)}
.rich-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:5px;padding:8px;border-bottom:1px solid var(--border,#374151)}
.rich-toolbar .rich-tool,.rich-toolbar .rich-color{font-size:13px;min-height:36px;min-width:36px;padding:7px 10px;border-radius:8px;cursor:pointer}
.rich-content{min-height:135px;max-height:42vh;overflow:auto;padding:14px;outline:none;line-height:1.65;white-space:pre-wrap;overflow-wrap:anywhere}
.rich-content:empty:before{content:attr(data-placeholder);color:#94a3b8;pointer-events:none}
.rich-content:focus-visible{box-shadow:inset 0 0 0 2px #34d399}
.task-body-display{margin-top:16px;line-height:1.65;overflow-wrap:anywhere;white-space:pre-wrap;padding:14px;border-radius:12px;background:rgba(127,127,127,.08)}
.task-body-display ul,.rich-content ul{padding-left:24px;list-style:disc}.task-body-display ol,.rich-content ol{padding-left:24px;list-style:decimal}
.task-body-display li,.rich-content li{margin:3px 0}.task-body-display p{margin:8px 0}
.task-modal-toolbar .modal-icon.danger:hover{color:#f87171;background:rgba(248,113,113,.14)}
@media(max-width:600px){.rich-toolbar{gap:4px}.rich-content{min-height:155px}.task-detail-modal{max-height:calc(100dvh - 22px)}}

/* PLANNER 2.2: nawigacja gestami i stany dotykowe */
@media (pointer:coarse){
 nav button,.shop-back,.task-row-interactive,.shop-list-open,.calendar-event{ -webkit-tap-highlight-color:transparent; }
 .task-row-interactive:active,.shop-list-tile:active,.calendar-event:active{transform:scale(.992);filter:brightness(1.09)}
 dialog.form-modal{overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
}
@media (prefers-reduced-motion:reduce){.task-row-interactive,.shop-list-tile,.calendar-event{transition:none!important}}

/* PLANNER v2.3 — iOS: formularze, klawiatura ekranowa i bezpieczne obszary */
html,body{max-width:100%;overflow-x:hidden}
@media (max-width:650px){
  dialog.form-modal,dialog.shop-menu,dialog.event-detail-modal{
    position:fixed!important;inset:auto 0 0 0!important;
    margin:0!important;width:100%!important;max-width:100%!important;
    max-height:min(calc(100dvh - 8px),calc(var(--planner-visible-height,100dvh) - 8px))!important;
    padding:0!important;border-radius:22px 22px 0 0!important;
    overflow-x:hidden!important;overflow-y:auto!important;
    overscroll-behavior-y:contain;-webkit-overflow-scrolling:touch;
    scroll-padding-bottom:calc(96px + env(safe-area-inset-bottom));
    box-sizing:border-box;
  }
  dialog.form-modal:not([open]),dialog.shop-menu:not([open]),dialog.event-detail-modal:not([open]){display:none!important}
  dialog.form-modal>*:not(.task-modal-toolbar):not(.task-detail-content),
  dialog.shop-menu>*{max-width:100%;min-width:0}
  dialog.form-modal:not(.task-detail-modal):not(.event-detail-modal){padding:18px 16px 0!important}
  dialog.form-modal .generic-modal-toolbar{position:relative;min-height:48px;margin:0 0 10px;gap:12px;align-items:center}
  dialog.form-modal .generic-modal-toolbar h2{font-size:clamp(19px,5.5vw,23px);line-height:1.2;overflow-wrap:anywhere}
  dialog.form-modal label{margin:9px 0 3px;font-size:14px}
  dialog.form-modal input:not([type=checkbox]),dialog.form-modal select,dialog.form-modal textarea{
    font-size:16px!important;min-height:46px;max-width:100%;margin:3px 0 10px;padding:11px 13px;border-radius:12px;
  }
  dialog.form-modal .actions{display:flex!important;flex-direction:row!important;flex-wrap:nowrap!important;
    gap:10px!important;position:sticky!important;bottom:0!important;z-index:8;
    width:100%;margin:16px 0 0!important;padding:12px 0 calc(12px + env(safe-area-inset-bottom))!important;
    background:var(--card);border-top:1px solid var(--line);box-shadow:0 -10px 22px -20px rgba(0,0,0,.5);
  }
  dialog.form-modal .actions button{min-width:0!important;flex:1 1 0!important;min-height:48px!important;
    white-space:nowrap!important;padding:11px 9px!important;font-size:15px!important;overflow:hidden;text-overflow:ellipsis}
  dialog.form-modal .task-modal-toolbar{padding:12px 16px 10px!important;position:sticky;top:0;z-index:9;
    background:var(--card);gap:8px}
  dialog.form-modal .task-modal-meta{flex-basis:100%;min-width:0;gap:5px}
  dialog.form-modal .task-meta-chip{font-size:11px;line-height:1.25;padding:7px 8px;white-space:normal}
  dialog.form-modal .task-toolbar-buttons{margin-left:auto;justify-content:flex-end;gap:6px}
  dialog.form-modal .task-detail-content{padding:15px 16px calc(20px + env(safe-area-inset-bottom))!important}
  dialog.form-modal .task-detail-title{margin:0 0 12px;font-size:22px}
  dialog.form-modal .task-edit-form{gap:7px;min-width:0}
  dialog.form-modal .task-edit-field{min-width:0}
  dialog.form-modal .rich-editor{margin:5px 0 9px;min-width:0;max-width:100%;border-color:var(--line)}
  dialog.form-modal .rich-toolbar{display:flex;flex-wrap:wrap;gap:4px;padding:6px}
  dialog.form-modal .rich-toolbar button{min-width:38px;min-height:38px;padding:7px 9px}
  dialog.form-modal .rich-content{min-height:115px;max-height:28dvh;padding:12px;font-size:16px;overflow:auto}
  dialog.form-modal .task-body-display{padding:12px;margin-top:10px}
  dialog.event-detail-modal .event-detail-toolbar{position:sticky;top:0;z-index:3;background:var(--card);padding:12px 16px}
  dialog.event-detail-modal .event-detail-content{padding:14px 16px calc(22px + env(safe-area-inset-bottom))!important}
  dialog.shop-menu{padding:16px 16px calc(16px + env(safe-area-inset-bottom))!important}
  dialog .modal-icon,dialog button.modal-icon{min-width:44px;min-height:44px;width:44px;height:44px}
  dialog.form-modal .task-detail-content *, dialog.form-modal .rich-editor *,dialog.form-modal .task-modal-toolbar *{max-width:100%}
}
@media(max-width:375px){
  dialog.form-modal:not(.task-detail-modal):not(.event-detail-modal){padding-left:13px!important;padding-right:13px!important}
  dialog.form-modal .task-modal-toolbar{padding-left:12px!important;padding-right:12px!important}
  dialog.form-modal .task-detail-content{padding-left:13px!important;padding-right:13px!important}
  dialog.form-modal .task-meta-chip{font-size:10px;padding:6px 7px}
}
@media(hover:none){button:active:not(:disabled),.task-row-interactive:active{filter:brightness(1.07)}}


/* PLANNER v2.4 — jednolity layout modali Safari iOS.
   Wcześniejsze reguły mobilne są nadpisywane tutaj, bez zmian API. */
@media (max-width: 650px) {
  html,body { width:100%; max-width:100%; overflow-x:hidden; }
  dialog.form-modal,dialog.event-detail-modal,dialog.shop-menu {
    box-sizing:border-box!important;
    position:fixed!important;
    inset:auto 0 0!important;
    margin:0!important;
    width:100%!important; min-width:0!important; max-width:100%!important;
    height:auto!important;
    max-height:min(94dvh,calc(var(--planner-visible-height,100dvh) - 8px))!important;
    border-radius:21px 21px 0 0!important;
    padding:0!important;
    overflow-x:hidden!important;overflow-y:auto!important;
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:thin;
  }
  dialog.form-modal:not([open]),dialog.event-detail-modal:not([open]),dialog.shop-menu:not([open]){display:none!important}
  dialog.form-modal *,dialog.event-detail-modal *,dialog.shop-menu * { box-sizing:border-box; min-width:0; }
  dialog.form-modal:not(.task-detail-modal):not(.event-detail-modal) {
    padding:0 16px calc(12px + env(safe-area-inset-bottom,0px))!important;
  }
  dialog.form-modal .generic-modal-toolbar {
    position:sticky!important;top:0;z-index:12;
    display:flex;flex-flow:row nowrap;align-items:center;
    padding:14px 0 11px!important;margin:0 0 9px!important;
    gap:10px;background:var(--card);
  }
  dialog.form-modal .generic-modal-toolbar h2 {
    flex:1 1 auto; margin:0!important;
    font-size:20px!important;line-height:1.22!important;
    overflow-wrap:break-word;
  }
  dialog.form-modal button.modal-icon,dialog.event-detail-modal button.modal-icon {
    flex:0 0 42px!important;width:42px!important;min-width:42px!important;
    height:42px!important;min-height:42px!important;padding:0!important;
  }
  /* Stały układ nagłówka: termin + status pozostają w jednej, przewijalnej linii;
     ikonki akcji mają własną linię bez nakładania na chipy. */
  dialog.task-detail-modal .task-modal-toolbar {
    position:sticky!important; top:0; z-index:12;
    display:grid!important;grid-template-columns:minmax(0,1fr)!important;
    gap:8px!important;padding:12px 16px 11px!important;
    background:var(--card);border-bottom:1px solid var(--line);
  }
  dialog.task-detail-modal .task-modal-meta {
    order:0!important;display:flex!important;flex-wrap:nowrap!important;
    flex:0 0 auto!important;width:100%!important;max-width:100%!important;
    margin:0!important;padding:0 0 3px!important;
    gap:6px!important;overflow-x:auto!important;overflow-y:hidden!important;
    -webkit-overflow-scrolling:touch;scrollbar-width:none;
  }
  dialog.task-detail-modal .task-modal-meta::-webkit-scrollbar{display:none}
  dialog.task-detail-modal .task-meta-chip {
    flex:0 0 auto!important;max-width:none!important;
    white-space:nowrap!important;line-height:1.2!important;
    font-size:11px!important;padding:7px 8px!important;
    border-radius:9px;
  }
  dialog.task-detail-modal .task-toolbar-buttons {
    order:1!important;display:flex!important;flex-wrap:nowrap!important;
    align-items:center!important;justify-content:flex-end!important;
    gap:7px!important;width:100%!important;margin:0!important;
  }
  dialog.task-detail-modal .task-detail-content {
    width:100%;padding:15px 16px calc(18px + env(safe-area-inset-bottom,0px))!important;
  }
  dialog.task-detail-modal .task-edit-form {display:flex!important;flex-direction:column!important;gap:5px!important;width:100%;}
  dialog.task-detail-modal .task-edit-field {width:100%;display:block;}
  dialog.task-detail-modal .task-edit-field label {margin:8px 0 3px!important;display:block;}
  dialog.form-modal input:not([type=checkbox]),dialog.form-modal textarea,dialog.form-modal select {
    width:100%!important;max-width:100%!important;min-width:0!important;
    font-size:16px!important;line-height:1.3!important;
    min-height:45px!important;margin:3px 0 8px!important;
    padding:9px 11px!important;
  }
  dialog.task-detail-modal input[type=date],dialog.task-detail-modal input[type=time] {
    display:block!important;max-width:100%!important;min-width:0!important;
    -webkit-appearance:none;appearance:none;
  }
  dialog.form-modal .rich-editor {width:100%!important;min-width:0!important;margin:4px 0 9px!important;}
  dialog.form-modal .rich-toolbar {
    display:flex!important;flex-wrap:nowrap!important;overflow-x:auto!important;
    gap:5px!important;padding:6px!important;-webkit-overflow-scrolling:touch;
  }
  dialog.form-modal .rich-toolbar .rich-tool,dialog.form-modal .rich-toolbar .rich-color {
    flex:0 0 auto!important;width:auto!important;min-width:38px!important;
    min-height:40px!important;max-width:122px!important;
    margin:0!important;white-space:nowrap!important;
  }
  dialog.form-modal .rich-content {width:100%;min-height:108px!important;max-height:26dvh!important;padding:11px!important;}
  dialog.form-modal .actions {
    display:grid!important;grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
    align-items:stretch!important;flex-wrap:nowrap!important;
    position:sticky!important;bottom:0!important;z-index:10!important;
    gap:9px!important;width:100%!important;
    padding:11px 0 calc(12px + env(safe-area-inset-bottom,0px))!important;
    margin:12px 0 0!important;
    border-top:1px solid var(--line);background:var(--card);
  }
  dialog.form-modal .actions button {
    display:flex!important;align-items:center!important;justify-content:center!important;
    width:100%!important;min-width:0!important;max-width:100%!important;
    min-height:48px!important;white-space:nowrap!important;
    padding:10px 7px!important;font-size:15px!important;line-height:1.2!important;
    overflow:hidden;text-overflow:ellipsis;
  }
  dialog.event-detail-modal .event-detail-toolbar {
    display:flex;flex-wrap:nowrap!important;align-items:center;
    gap:8px;padding:12px 16px!important;
  }
  dialog.event-detail-modal .event-detail-content {padding:15px 16px calc(18px + env(safe-area-inset-bottom,0px))!important;}
  dialog.event-detail-modal .event-when {display:flex;flex-wrap:nowrap!important;gap:7px;overflow-x:auto;-webkit-overflow-scrolling:touch;}
  dialog.shop-menu {padding:16px 16px calc(16px + env(safe-area-inset-bottom,0px))!important;}
}
@media (max-width: 370px){
  dialog.task-detail-modal .task-modal-toolbar,dialog.task-detail-modal .task-detail-content,
  dialog.event-detail-modal .event-detail-content {padding-left:12px!important;padding-right:12px!important;}
  dialog.form-modal:not(.task-detail-modal):not(.event-detail-modal){padding-left:12px!important;padding-right:12px!important;}
}
