:root{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color:#243348;background:#f5f7fb;font-size:15px}*{box-sizing:border-box}body{margin:0}button,input,textarea,select{font:inherit}button{cursor:pointer;border:0;border-radius:11px;padding:11px 16px;min-height:43px;background:#e8edf5;color:#25354c;font-weight:650}button:active{transform:scale(.98)}button.primary{background:#2563eb;color:white}button.secondary{background:#edf1f6;color:#405066}button.danger{background:#fee2e2;color:#991b1b}button.tiny{font-size:12px;padding:7px 10px;min-height:33px}.top{display:flex;align-items:center;justify-content:space-between;background:white;padding:14px 23px;border-bottom:1px solid #e5ebf3}.brand,.right{display:flex;align-items:center;gap:14px}.brand>span{font-size:32px}.brand h1{margin:0;font-size:24px}.brand small{color:#768499}.clock{font-weight:800;font-size:28px}.tabs{display:flex;gap:9px;padding:14px 20px 4px}.tabs button{background:white}.tabs .selected{background:#213c62;color:white}.members{display:flex;flex-wrap:wrap;gap:9px;padding:14px 20px}.member{display:flex;align-items:center;gap:7px;background:white;padding:9px 12px;border-radius:30px;border:1px solid #ecf0f6}.dot{width:12px;height:12px;border-radius:50%;display:inline-block;flex-shrink:0}.bar{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:0 20px 13px}.bar h2{font-size:19px;text-align:center;margin:0}.navweek{display:flex;gap:7px}.week{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:7px;padding:0 15px 25px}.day{background:white;border:1px solid #e1e8f0;border-radius:13px;min-height:365px;overflow:hidden}.day.now{border:2px solid #3b82f6}.day-heading{text-align:center;padding:14px 3px;border-bottom:1px solid #edf1f5}.day-heading small{display:block;color:#718099}.day-heading b{font-size:26px}.event{margin:7px 5px;border-radius:9px;padding:8px 7px;text-align:left;display:block;width:calc(100% - 10px);height:auto;min-height:53px;font-weight:600;font-size:12px;line-height:1.3;white-space:normal;overflow-wrap:anywhere}.event .when{font-size:11px;display:block;margin-bottom:5px;font-weight:500}.sectionhead{display:flex;justify-content:space-between;align-items:center;padding:10px 25px}.sectionhead h2{margin:0}.tasklist{padding:5px 20px 24px;display:grid;gap:8px;max-width:900px}.item{display:flex;align-items:center;gap:14px;border-radius:12px;padding:13px;background:white}.item input[type=checkbox]{width:24px;height:24px;flex-shrink:0}.item span{flex:1}.item.done span{text-decoration:line-through;color:#919eac}.item small{color:#7b8ba0}.item button{margin-left:auto}.addrow{display:flex;gap:8px;padding:10px 20px;max-width:940px}.addrow input{flex:1;min-width:0}input:not([type=checkbox]),select,textarea{border:1px solid #cbd5e1;border-radius:10px;min-height:44px;padding:10px;background:white;color:#1e293b;width:100%}label{display:block;font-weight:600;margin-top:12px;margin-bottom:6px}dialog{border:0;border-radius:18px;box-shadow:0 16px 70px #172b4d55;padding:22px;width:min(94vw,540px);max-height:92vh;overflow:auto}dialog::backdrop{background:#10223790}.dialog-head{display:flex;justify-content:space-between;align-items:center}.dialog-head h2{margin:0}.two{display:grid;grid-template-columns:1fr 1fr;gap:12px}.checks{display:flex;flex-wrap:wrap;gap:12px}.checks label{background:#f0f4f9;border-radius:9px;padding:8px;margin:0;font-weight:500}.dialog-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:18px}.login-wrap{display:grid;place-items:center;min-height:100vh;padding:15px}.login{background:white;border-radius:20px;padding:35px;width:min(100%,440px);box-shadow:0 10px 45px #1e293b13}.login h1{font-size:27px;margin-bottom:2px}.login p{color:#65758a}.login-symbol{font-size:48px}.login .primary{width:100%;margin-top:18px}.error{color:#b91c1c!important}#toast{position:fixed;bottom:18px;left:50%;transform:translateX(-50%);background:#25354c;color:white;padding:10px 20px;border-radius:10px;display:none;z-index:5}[hidden]{display:none!important}@media(max-width:950px){.brand h1{font-size:19px}.week{overflow-x:auto;display:flex}.day{min-width:137px;flex:1;min-height:320px}.bar h2{font-size:15px}.bar{flex-wrap:wrap}.top{padding:10px}.clock{font-size:21px}}@media(max-width:570px){.top{flex-wrap:wrap}.tabs{padding:8px}.tabs button{font-size:13px;padding:8px}.bar{padding:7px}.members{padding:8px}.day{min-width:130px}}

/* Familienkalender 1.1: Monatsansicht und PIN-Tastatur */
.pin-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin:14px 0}
.pin-grid button{font-size:23px;min-height:54px;background:#edf2f9}
.view-controls{display:flex;align-items:center;gap:7px}
.view-controls .selected-mode{background:#213c62;color:#fff}
.month{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:5px;padding:0 15px 20px}
.month-head{text-align:center;padding:9px 2px;font-weight:700;color:#64748b}
.month-day,.month-empty{background:#fff;border:1px solid #e1e8f0;border-radius:9px;min-height:103px;min-width:0;padding:4px;overflow:hidden}
.month-empty{background:transparent;border:0}.month-day.now{border:2px solid #2563eb}
.month-num{display:block;min-height:30px;padding:3px 8px;background:transparent;font-size:16px}
.month-event{display:block;width:100%;text-align:left;min-height:27px;margin:3px 0;padding:3px 5px;border-radius:5px;border-left:3px solid #64748b;font-weight:500;font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.month-more{display:block;color:#64748b;font-size:10px}
@media(max-width:800px){.month{gap:2px;padding:0 4px 8px}.month-day{min-height:78px;padding:2px}.month-event{font-size:10px;padding:2px}.month-num{font-size:13px}.view-controls{flex-wrap:wrap}}

/* 1.2: Familienfilter und Tagesansicht */
button.filter-person{font-weight:600;min-height:42px;color:#243348}
button.filter-person.muted{opacity:.38;text-decoration:line-through;background:#e6e9ef}
button.filter-person:focus-visible{outline:3px solid #2563eb;outline-offset:2px}
.day-focus{padding:0 20px 28px;max-width:1150px;margin:auto;display:grid;gap:10px}
.day-event{display:grid;grid-template-columns:minmax(85px,130px) 1fr auto;align-items:center;gap:15px;background:white;border:1px solid #e2e8f0;border-left:6px solid #64748b;text-align:left;padding:16px;min-height:72px}
.day-time{font-size:14px;color:#475569}.day-event strong{font-size:19px}.day-people{font-size:13px;color:#64748b}
.day-empty{padding:30px;background:white;border-radius:12px;text-align:center;color:#64748b}
.day-add{justify-self:start}
@media(max-width:650px){.day-event{grid-template-columns:1fr;gap:5px}.day-people{font-size:12px}.day-event strong{font-size:16px}}

/* Essensplan */
.meal-nav{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:10px 20px 18px}.meal-nav button{border:0;background:#e8edf5;border-radius:9px;padding:12px 18px;font-size:18px}.meal-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px;padding:0 20px 25px}.meal-card{min-height:170px;text-align:left;background:white;border:1px solid #dfe6f0;border-radius:12px;padding:14px;display:flex;flex-direction:column;gap:15px;font:inherit;cursor:pointer;color:#1d3555;overflow-wrap:anywhere}.meal-card strong{font-size:14px}.meal-card span{white-space:pre-wrap;font-size:14px}@media(max-width:850px){.meal-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.meal-card{min-height:110px}}@media(max-width:460px){.meal-grid{grid-template-columns:1fr}}

/* Version 1.4 – Aufgaben direkt am Fälligkeitstag und überfällige Hinweise */
.task-alerts{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0 20px 14px;padding:10px 12px;background:#fff4e4;border:1px solid #f4cb87;border-radius:12px}
.task-alerts:empty{display:none}.task-alert-heading{font-weight:700;color:#8a3b0d;width:100%}
.due-task{display:block;width:100%;background:#fff1dc;border:1px solid #f2bb65;border-left:4px solid #dd7624;color:#813b0b;border-radius:7px;padding:8px 6px;margin:5px 0;text-align:left;min-height:34px;font-weight:650;white-space:normal;overflow-wrap:anywhere}
.due-task-small{font-size:11px;padding:5px;margin:3px 0;min-height:28px}.task-alerts .due-task{width:auto;max-width:100%}
.day-focus .due-task{font-size:15px;padding:14px}.month-day .due-task-small{font-size:10px}

.optional-toggle{display:flex;gap:10px;align-items:center;background:#f0f4f9;border-radius:10px;padding:10px 12px;margin:14px 0 6px}.optional-toggle input{width:20px;height:20px;flex-shrink:0}#multiDayRow,#taskDueRow{padding:4px 8px 10px;background:#f7f9fc;border-radius:10px}#taskForm small{display:block;color:#64748b;line-height:1.4;margin-top:8px}

.shopping-tabs{display:flex;gap:10px;flex-wrap:wrap;margin:0 0 14px}.recipe-entry{width:100%;display:flex;flex-direction:column;align-items:flex-start;gap:4px;white-space:pre-line;text-align:left}.recipe-entry small{white-space:pre-line;color:#64748b}

.ingredient-rows{display:grid;gap:10px;max-height:45vh;overflow:auto;margin:16px 0}.ingredient-row{display:grid;grid-template-columns:minmax(0,1fr) 125px;align-items:center;gap:12px;padding:10px;border:1px solid #dde4ed;border-radius:10px}.ingredient-row label{display:flex;align-items:center;gap:8px;min-width:0;overflow-wrap:anywhere}.ingredient-row input{width:22px;height:22px;flex-shrink:0}.ingredient-row select{width:100%}@media(max-width:500px){.ingredient-row{grid-template-columns:minmax(0,1fr) 105px}}

/* family-day-columns-v1 */
#dayFocus.family-day-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;max-width:none;margin:0;padding:0 14px 28px;align-items:stretch}
.family-day-column{background:white;border:1px solid #dde5ef;border-radius:12px;min-height:350px;padding:6px;min-width:0;display:flex;flex-direction:column;gap:7px}
.family-day-person{color:white;border-radius:8px;text-align:center;font-weight:700;padding:12px 3px;font-size:16px}
.family-day-event,.family-day-task{width:100%;margin:0;display:flex;flex-direction:column;align-items:stretch;text-align:left;gap:6px;border-radius:9px;min-height:62px;overflow-wrap:anywhere;font-size:13px}
.family-day-event{background:#f5f7fb;border-left:5px solid #64748b;padding:9px}
.family-day-event strong{font-size:14px}
.family-day-time{font-size:11px;color:#52637c}
.family-day-free{text-align:center;color:#8490a3;font-size:12px;margin:20px 0}
#dayFocus .family-day-task{padding:9px;font-size:12px;white-space:normal;word-break:break-word}
.family-day-add{grid-column:1/-1;justify-self:start}
@media(max-width:760px){#dayFocus.family-day-grid{overflow-x:auto;display:flex;gap:6px;padding:0 8px 22px}.family-day-column{flex:0 0 168px;min-height:340px}.family-day-add{align-self:start;flex:0 0 auto}}

/* family-colors-v1 */
.member-color-button{margin:0 16px 12px;min-height:40px}
.family-color-dialog{border:0;border-radius:16px;max-width:min(95vw,520px);width:100%;padding:24px;box-shadow:0 18px 55px #0003}
.family-color-dialog::backdrop{background:#0006}
.family-color-choices{display:grid;gap:10px;margin:20px 0}
.family-color-row{display:grid;grid-template-columns:minmax(0,1fr) 64px 110px;align-items:center;gap:12px;padding:9px;border:1px solid #d9e2eb;border-radius:10px}
.family-color-row input[type=color]{height:44px;width:60px;padding:2px;border:1px solid #ddd;border-radius:8px}
@media(max-width:500px){.family-color-row{grid-template-columns:minmax(0,1fr) 54px 86px;gap:6px}.family-color-row input[type=color]{width:50px}}

/* person-colors-everywhere-v1 */
.person-colors-strip{display:flex;gap:3px;margin-top:5px;min-height:5px;flex-wrap:wrap;pointer-events:none}
.person-colors-strip i{display:block;width:18px;height:6px;border-radius:5px}
.due-task,.item,.event,.month-event,.family-day-event{border-left-color:var(--person-color, #64748b)}
.item .person-colors-strip{align-self:center;margin-left:6px;margin-top:0}
#dayFocus .family-day-task{border-left-width:5px}
/* Aufgaben grafisch verschieben – fingerfreundliche Zielmarkierungen */
.fk-draggable{touch-action:none;cursor:grab;user-select:none;-webkit-user-select:none}
.fk-draggable:active{cursor:grabbing}
.fk-drag-source{opacity:.45}
.fk-drag-ghost{position:fixed;z-index:99999;pointer-events:none;max-width:220px;padding:11px 14px;border-radius:12px;background:#26384e;color:#fff;box-shadow:0 8px 26px #0004;font-weight:600;font-size:14px}
.fk-drop-hover{outline:3px solid #2563eb!important;outline-offset:-3px;background-color:#dbeafe!important}
.fk-day-strip{grid-column:1/-1;display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:5px;margin-bottom:10px;width:100%}
.fk-day-target{border:1px dashed #90a1b9;border-radius:9px;text-align:center;padding:12px 3px;font-size:12px;background:#f4f7fb;min-height:44px}
.fk-day-target.fk-current{border-style:solid;border-color:#2563eb;font-weight:700}
@media(max-width:700px){.fk-day-target{font-size:11px;padding:9px 2px}}

/* Monatsansicht: sichtbare Ablagezone fuer Termine und Aufgaben */
.month-day[data-fk-date] { position: relative; transition: background-color .12s ease, box-shadow .12s ease; }
.month-day.fk-drop-hover { background: #dceeff !important; box-shadow: inset 0 0 0 3px #2563eb !important; outline: 2px solid #2563eb; outline-offset: -2px; }
.month-day .month-num { position: relative; z-index: 1; }
.fk-event-dragging .month-day[data-fk-date] { cursor: copy; }

/* Familienkalender: Tages-Startseite mit Vorschau auf den nächsten Tag */
#dayFocus.family-day-grid .fk-tomorrow-panel{grid-column:1/-1;background:#fff;border:1px solid #dce5ee;border-radius:14px;padding:14px 16px;min-height:22vh;max-height:33vh;overflow:auto;position:relative}
.fk-tomorrow-head{font-size:18px;margin-bottom:10px;color:#25354c}
.fk-tomorrow-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:8px}
.fk-tomorrow-entry{background:#f8fafc;border:1px solid #e3e9f0;border-radius:9px;padding:8px;display:flex;flex-direction:column;align-items:flex-start;gap:3px;min-width:0;overflow-wrap:anywhere}
.fk-tomorrow-type,.fk-tomorrow-entry small{font-size:11px;color:#64748b}
.fk-tomorrow-entry strong{font-size:13px}
.fk-tomorrow-empty{color:#718198;margin:6px 0}
@media(min-width:761px){#dayFocus.family-day-grid .family-day-column{min-height:260px}}
@media(max-width:760px){#dayFocus.family-day-grid{flex-wrap:wrap}#dayFocus.family-day-grid .fk-tomorrow-panel{flex:0 0 100%;max-height:none;min-height:150px}}

/* fkTomorrowColumnsV1: passive five-column tomorrow preview */
#dayFocus.family-day-grid .fk-tomorrow-person-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:7px;width:100%}
.fk-tomorrow-person-column{min-width:0;border:1px solid #e1e7ee;border-radius:9px;padding:6px;background:#f8fafc}
.fk-tomorrow-person-name{color:white;font-size:12px;font-weight:700;text-align:center;padding:6px 3px;border-radius:6px;margin-bottom:6px;overflow-wrap:anywhere}
.fk-tomorrow-preview-card{background:white;border-left:4px solid #64748b;border-radius:6px;padding:6px;margin-bottom:5px;display:flex;flex-direction:column;gap:3px;overflow-wrap:anywhere;cursor:default;user-select:text}
.fk-tomorrow-preview-card.is-task{background:#f2f8f3}
.fk-tomorrow-preview-time{font-size:10px;color:#64748b}
.fk-tomorrow-preview-card strong{font-size:12px;line-height:1.25}
.fk-tomorrow-no-entry{font-size:11px;color:#8490a0;text-align:center;padding:9px 2px}
@media(max-width:760px){#dayFocus.family-day-grid .fk-tomorrow-person-grid{gap:3px}.fk-tomorrow-person-column{padding:3px}.fk-tomorrow-person-name{font-size:10px;padding:4px 1px}.fk-tomorrow-preview-card{padding:4px}.fk-tomorrow-preview-card strong{font-size:10px}}