/* Familienzentrale – Layout: App-Rahmen in Telefonbreite, Schicht-Band oben, Inhalt als Tageskarten, Navigation unten */
:root{
  --bg:#eef3f8; --surface:#ffffff; --surface-2:#f5f8fb; --ink:#1d2a3a; --muted:#5d6b7c; --line:#d9e2ec;
  --accent:#1f6fd1; --accent-soft:#e2edfb; --ok:#1f8a5b; --ok-soft:#e1f3ea; --alarm:#d42a2a; --alarm-soft:#fde4e4; --todo:#c2410c; --todo-soft:#fdeee4;
  --p1:#7454c2; --p2:#1f6fd1; --p3:#d1456f; --p4:#23845f; --p5:#c98a0c; --p6:#0f8a8a; --p7:#d0601c; --p8:#56657a; --p-family:#3c4a5c;
  --display:"Baloo 2", "Trebuchet MS", system-ui, sans-serif;
  --body:"Nunito Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --bg:#111820; --surface:#1a232e; --surface-2:#212c38; --ink:#e7edf4; --muted:#9aa8b8; --line:#2d3a48;
  --accent:#6aa8f5; --accent-soft:#1c2f48; --ok:#5ccf98; --ok-soft:#163528; --alarm:#ff6b6b; --alarm-soft:#3d1a1c; --todo:#f59a66; --todo-soft:#3a2418;
  --p1:#a68ef0; --p2:#6aa8f5; --p3:#f07a9c; --p4:#56c497; --p5:#f0bd4a; --p6:#4fd0d0; --p7:#f59a5c; --p8:#a3b1c2; --p-family:#a9b6c6;
  color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#111820; --surface:#1a232e; --surface-2:#212c38; --ink:#e7edf4; --muted:#9aa8b8; --line:#2d3a48;
  --accent:#6aa8f5; --accent-soft:#1c2f48; --ok:#5ccf98; --ok-soft:#163528; --alarm:#ff6b6b; --alarm-soft:#3d1a1c; --todo:#f59a66; --todo-soft:#3a2418;
  --p1:#a68ef0; --p2:#6aa8f5; --p3:#f07a9c; --p4:#56c497; --p5:#f0bd4a; --p6:#4fd0d0; --p7:#f59a5c; --p8:#a3b1c2; --p-family:#a9b6c6;
  color-scheme:dark}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0}
img{max-width:100%}
[hidden]{display:none!important}
body{background:var(--bg);color:var(--ink);font-family:var(--body);font-size:15px;line-height:1.45}
.app{max-width:560px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));padding-block:max(12px,env(safe-area-inset-top,0px)) 104px}
h1,h2,h3{font-family:var(--display);margin:0;line-height:1.15;text-wrap:balance}
h1{font-size:1.7rem;font-weight:800}
h2{font-size:1.15rem;font-weight:700}
.eyebrow{font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-weight:700}
.top{display:flex;align-items:center;justify-content:space-between;gap:12px}
.brand{font-family:var(--display);font-weight:800;font-size:1.25rem}
.demo{font-size:.72rem;color:var(--muted);background:var(--surface-2);border:1px dashed var(--line);border-radius:99px;padding:2px 10px;white-space:nowrap}
/* Schicht-Band */
.shifts{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px}
.shift{background:var(--surface);border-radius:14px;padding:10px 12px;display:flex;gap:10px;align-items:center;border:1px solid var(--line);min-width:0}
.shift .dot{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;color:#fff;font-family:var(--display);font-weight:700;flex:none}
.shift b{display:block;font-size:.95rem}
.shift span{font-size:.8rem;color:var(--muted)}
/* Personenwahl */
.who{display:flex;gap:6px;margin:16px 0 4px;overflow-x:auto;padding-bottom:4px}
.who button{flex:none;border:2px solid var(--line);background:var(--surface);color:var(--ink);font:600 .9rem var(--body);border-radius:99px;padding:6px 14px;cursor:pointer;display:flex;align-items:center;gap:6px}
.who button[aria-pressed="true"]{border-color:var(--pc);background:var(--pc);color:#fff}
.who .sw{width:10px;height:10px;border-radius:50%;background:var(--pc)}
.who button[aria-pressed="true"] .sw{background:#fff}
button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
.hello{margin:14px 0 12px}
.hello p{margin:2px 0 0;color:var(--muted)}
.stack{display:grid;gap:12px}
.card{background:var(--surface);border-radius:18px;padding:14px 16px;border:1px solid var(--line)}
.card h2{margin-bottom:8px}
/* Aufgaben */
.task{display:flex;align-items:center;gap:14px;background:var(--surface);border-radius:18px;padding:14px 16px;border:2px solid var(--line);width:100%;text-align:left;cursor:pointer;color:var(--ink);font:inherit}
.task .ic{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;background:var(--todo-soft);color:var(--todo);flex:none}
.task .txt{flex:1;min-width:0}
.task .txt b{font-family:var(--display);font-size:1.2rem;display:block;line-height:1.1}
.task .txt span{font-size:.82rem;color:var(--muted)}
.task .state{font-size:.78rem;font-weight:700;padding:4px 10px;border-radius:99px;background:var(--todo-soft);color:var(--todo);white-space:nowrap}
.task.done{border-color:var(--ok)}
.task.done .ic{background:var(--ok-soft);color:var(--ok)}
.task.done .state{background:var(--ok-soft);color:var(--ok)}
/* Termine */
.ev{display:flex;gap:12px;padding:9px 0;border-top:1px solid var(--line);align-items:flex-start}
.ev:first-of-type{border-top:0}
.ev time{font-variant-numeric:tabular-nums;font-weight:700;min-width:46px;font-size:.9rem}
.ev .bar{width:4px;align-self:stretch;border-radius:4px;background:var(--pc);flex:none}
.ev .b{flex:1;min-width:0}
.ev .b b{display:block}
.ev .tags{display:flex;gap:4px;flex-wrap:wrap;margin-top:3px}
.tag{font-size:.7rem;font-weight:700;padding:1px 8px;border-radius:99px;color:#fff;background:var(--pc)}
.ev img{width:48px;height:48px;object-fit:cover;border-radius:10px}
.day{font-family:var(--display);font-weight:700;margin:12px 0 2px;font-size:1rem;display:flex;gap:8px;align-items:baseline}
.day small{font-family:var(--body);color:var(--muted);font-weight:600;font-size:.8rem}
.day.today{color:var(--accent)}
.empty{color:var(--muted);font-size:.9rem;padding:4px 0}
.school{display:grid;grid-template-columns:auto 1fr;gap:4px 12px;font-size:.92rem}
.school dt{color:var(--muted)}
.school dd{margin:0;font-weight:600}
.school .x{color:var(--todo)}
.note{font-size:.75rem;color:var(--muted);margin-top:8px}
/* Elternbereich */
.grid3{display:grid;gap:8px}
.kidrow{display:grid;grid-template-columns:1fr auto auto;gap:8px;align-items:center;padding:8px 0;border-top:1px solid var(--line)}
.kidrow:first-child{border-top:0}
.kidrow .n{display:flex;align-items:center;gap:8px;min-width:0}
.kidrow .n i{width:12px;height:12px;border-radius:50%;background:var(--pc);flex:none}
.pill{font-size:.74rem;font-weight:700;padding:3px 9px;border-radius:99px;white-space:nowrap}
.pill.ok{background:var(--ok-soft);color:var(--ok)}
.pill.no{background:var(--todo-soft);color:var(--todo)}
label{font-size:.82rem;font-weight:700;color:var(--muted);display:block;margin-bottom:4px}
input[type=text],input[type=date],input[type=time],input[type=email],input[type=number],select{width:100%;font:inherit;color:var(--ink);background:var(--surface-2);border:1px solid var(--line);border-radius:10px;padding:9px 10px}
.field{display:grid;gap:2px}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.rot{width:100%;border-collapse:collapse;font-size:.88rem}
.rot th,.rot td{padding:7px 6px;text-align:left;border-top:1px solid var(--line)}
.rot th{font-size:.72rem;text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}
.rot td .tag{font-size:.75rem}
.tbl{overflow-x:auto}
.chips{display:flex;gap:6px;flex-wrap:wrap}
.chips button{border:2px solid var(--pc);background:transparent;color:var(--ink);border-radius:99px;padding:4px 12px;font:600 .85rem var(--body);cursor:pointer}
.chips button[aria-pressed="true"]{background:var(--pc);color:#fff}
.btn{background:var(--accent);color:#fff;border:0;border-radius:12px;padding:11px 16px;font:700 .95rem var(--body);cursor:pointer;width:100%}
.btn.sec{background:var(--accent-soft);color:var(--accent)}
.toast{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(84px + env(safe-area-inset-bottom,0px));background:var(--ink);color:var(--bg);padding:9px 16px;border-radius:99px;font-weight:700;font-size:.9rem}
.preview{max-height:120px;border-radius:12px;margin-top:6px}
/* Konto */
.who{align-items:center;justify-content:space-between}
.acct{display:flex;align-items:center;gap:8px;font-size:.9rem;color:var(--muted)}
.acct b{color:var(--ink)}
.acct .sw{width:12px;height:12px;border-radius:50%;background:var(--pc)}
.link{background:none;border:0;color:var(--accent);font:700 .88rem var(--body);cursor:pointer;padding:4px 0;text-align:left}
.pick{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:10px;margin-top:10px}
.pick button{display:grid;justify-items:center;gap:6px;background:var(--surface-2);border:2px solid var(--line);border-radius:16px;padding:14px 8px;font:700 1rem var(--body);color:var(--ink);cursor:pointer}
.pick button:hover{border-color:var(--pc)}
.pick .av{width:52px;height:52px;border-radius:50%;background:var(--pc);color:#fff;display:grid;place-items:center;font:800 1.5rem var(--display)}
input[type=password],textarea{width:100%;font:inherit;color:var(--ink);background:var(--surface-2);border:1px solid var(--line);border-radius:10px;padding:9px 10px}
#otp{font-size:1.4rem;letter-spacing:.25em;font-variant-numeric:tabular-nums}
/* Listen */
.seg{display:flex;gap:6px;overflow-x:auto;padding-bottom:4px}
.seg button{flex:none;border:1px solid var(--line);background:var(--surface);color:var(--ink);border-radius:12px;padding:8px 12px;font:600 .88rem var(--body);cursor:pointer}
.seg button small{color:var(--muted);font-weight:700;margin-left:2px}
.seg button[aria-pressed="true"]{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.seg button[aria-pressed="true"] small{color:inherit;opacity:.7}
.seg .add{border-style:dashed;color:var(--accent)}
.snap{display:flex;align-items:center;gap:14px;background:var(--accent);color:#fff;border-radius:18px;padding:14px 16px;cursor:pointer;margin:0;font-size:inherit}
.snap > span{display:grid}
.snap b{font-family:var(--display);font-size:1.15rem;line-height:1.1}
.snap span span{font-size:.82rem;font-weight:600;opacity:.9}
.snap svg{flex:none}
.addrow{display:grid;grid-template-columns:1fr auto;gap:8px}
.addrow .btn{width:auto}
.li{display:flex;gap:12px;align-items:center;padding:9px 0;border-top:1px solid var(--line)}
.li:first-child,.row-h + .li{border-top:0}
.li .cb{width:30px;height:30px;border-radius:9px;border:2px solid var(--line);background:var(--surface);color:var(--ok);display:grid;place-items:center;cursor:pointer;flex:none;padding:0}
.li .cb svg{width:18px;height:18px}
.li.is-done .cb{border-color:var(--ok);background:var(--ok-soft)}
.li.is-done b{text-decoration:line-through;color:var(--muted)}
.li img{width:52px;height:52px;object-fit:cover;border-radius:10px;flex:none}
.li .b{flex:1;min-width:0}
.src{font-size:.72rem;color:var(--muted);font-weight:600}
.row-h{display:flex;justify-content:space-between;align-items:baseline;gap:8px;margin-bottom:4px}
.row-h h2{margin:0}
/* Rezepte */
.rec .ic{background:var(--accent-soft);color:var(--accent)}
.ing{display:flex;gap:10px;align-items:center;padding:8px 0;border-top:1px solid var(--line);font-size:.95rem;font-weight:600;color:var(--ink);margin:0;cursor:pointer}
.ing input{width:20px;height:20px;accent-color:var(--accent);flex:none}
.row-h + .ing{border-top:0}
.steps{margin:0;padding-left:1.3em;display:grid;gap:8px}
/* Klassenbuch-Alarm */
.alerts{display:grid;gap:8px;margin-top:10px}
.alerts:empty{display:none}
.alert{display:flex;align-items:center;gap:12px;background:var(--alarm-soft);border:2px solid var(--alarm);color:var(--ink);border-radius:14px;padding:10px 12px}
.alert .pulse{width:14px;height:14px;border-radius:50%;background:var(--alarm);flex:none}
.alert .b{flex:1;min-width:0;display:grid}
.alert b{color:var(--alarm);font-size:.9rem}
.alert span{font-size:.88rem}
.alert button{background:var(--alarm);color:#fff;border:0;border-radius:99px;padding:6px 12px;font:700 .8rem var(--body);cursor:pointer;flex:none}
@media (prefers-reduced-motion:no-preference){
  .alert{animation:blink 1.4s ease-in-out infinite}
  .alert .pulse{animation:pulse 1.4s ease-in-out infinite}
  @keyframes blink{50%{background:var(--surface);border-color:var(--alarm-soft)}}
  @keyframes pulse{50%{transform:scale(.6);opacity:.5}}
}
/* Aufgaben mit Kommentaren */
.tk{border-top:1px solid var(--line)}
.tk:first-of-type,.row-h + .tk{border-top:0}
.tk .li{border-top:0}
.tk.is-done b{text-decoration:line-through;color:var(--muted)}
.tk details{margin:-4px 0 8px 42px}
.tk summary{font-size:.8rem;font-weight:700;color:var(--accent);cursor:pointer;list-style:none;display:inline-block;padding:2px 0}
.tk summary::-webkit-details-marker{display:none}
.tk summary::before{content:"▸ ";}
.tk details[open] summary::before{content:"▾ ";}
.cms{display:grid;gap:8px;margin-top:8px}
.cm{display:flex;gap:8px;align-items:flex-start;font-size:.88rem;background:var(--surface-2);border-radius:10px;padding:7px 9px}
.cm .tag{flex:none;margin-top:1px}
/* Essen */
.meal{background:var(--accent-soft);border-color:transparent}
.meal h2{margin:0}
.mrow{display:grid;grid-template-columns:52px 1fr auto;gap:10px;align-items:center;padding:8px 0;border-top:1px solid var(--line)}
.mrow:first-child{border-top:0}
.mrow .md{display:grid;line-height:1.1}
.mrow .md small{color:var(--muted);font-size:.75rem;font-variant-numeric:tabular-nums}
.mrow.today .md b{color:var(--accent)}
.mc{min-width:0}
.untis-off .ufm{grid-column:1/-1;margin-top:4px}
/* Startseite & Kommentar-Hinweise */
.seg.big{display:grid;grid-template-columns:1fr 1fr;background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:4px;gap:4px}
.seg.big button{border:0;border-radius:10px;padding:10px;font:700 1rem var(--display);background:transparent}
.seg.big button[aria-pressed="true"]{background:var(--accent);color:#fff}
.notice{display:flex;align-items:center;gap:12px;background:var(--accent-soft);border:2px solid var(--accent);border-radius:14px;padding:10px 12px}
.notice .ndot{width:26px;height:26px;border-radius:50%;background:var(--accent);color:#fff;display:grid;place-items:center;font-weight:800;font-size:.85rem;flex:none}
.notice .b{flex:1;min-width:0;display:grid}
.notice b{color:var(--accent);font-size:.9rem}
.notice span{font-size:.88rem}
.notice button{background:var(--accent);color:#fff;border:0;border-radius:99px;padding:6px 12px;font:700 .8rem var(--body);cursor:pointer;flex:none}
.newb{background:var(--accent);color:#fff;border-radius:99px;padding:1px 7px;font-size:.7rem;margin-left:4px}
.cm.unread{background:var(--accent-soft);box-shadow:inset 3px 0 0 var(--accent)}
/* Kalender */
.ev{width:100%}
.ev .b{display:block}
.ev .tags{display:flex}
button.ev{background:none;border:0;border-top:1px solid var(--line);font:inherit;color:inherit;text-align:left;cursor:pointer;border-radius:0}
button.ev:hover b{color:var(--accent)}
.ev.unassigned .bar{background:repeating-linear-gradient(var(--muted) 0 4px,transparent 4px 7px)}
.ev.unassigned b::after{content:" ?";color:var(--muted)}
.seg.big.three{grid-template-columns:repeat(3,1fr)}
.calnav{display:flex;align-items:center;gap:8px}
.calnav b{flex:1;text-align:center;font-family:var(--display);font-size:1.1rem;font-variant-numeric:tabular-nums}
.calnav .nb{width:40px;height:40px;border-radius:12px;border:1px solid var(--line);background:var(--surface);color:var(--ink);font-size:1.4rem;line-height:1;cursor:pointer}
.fchips{flex-wrap:nowrap;overflow-x:auto;padding-bottom:4px}
.fchips button{flex:none;font-size:.8rem;padding:3px 10px}
.mgrid{display:grid;grid-template-columns:repeat(7,1fr);gap:3px}
.wdh{font-size:.7rem;font-weight:700;color:var(--muted);text-align:center;text-transform:uppercase;letter-spacing:.05em;padding-bottom:4px}
.mcell{aspect-ratio:1/1.05;max-width:100%;border:1px solid transparent;border-radius:10px;background:var(--surface-2);color:var(--ink);display:grid;grid-template-rows:auto 1fr;justify-items:center;padding:4px 2px;cursor:pointer;font:600 .85rem var(--body);min-width:0}
.mcell.out{opacity:.4}
.mcell.today .dn{background:var(--accent);color:#fff;border-radius:99px;padding:0 6px}
.mcell.sel{border-color:var(--accent);background:var(--accent-soft)}
.mcell .dots{display:flex;gap:2px;flex-wrap:wrap;justify-content:center;align-content:center}
.mcell .dots i{width:6px;height:6px;border-radius:50%;background:var(--pc)}
.ygrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
.ym{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:10px;cursor:pointer;color:var(--ink);text-align:left;display:grid;gap:6px;font:inherit}
.ym:hover{border-color:var(--accent)}
.ymh{display:flex;justify-content:space-between;align-items:baseline;gap:6px}
.ymh b{font-family:var(--display)}
.ymh small{font-size:.7rem;color:var(--muted);font-weight:700}
.yd{display:grid;grid-template-columns:repeat(7,1fr);gap:1px;font-size:.62rem;text-align:center;font-variant-numeric:tabular-nums;color:var(--muted)}
.yd .h{color:#fff;background:var(--accent);border-radius:4px;font-weight:700}
.yd .t{outline:1.5px solid var(--ink);border-radius:4px;color:var(--ink)}
.sheet{border:2px solid var(--accent)}
.chips button:disabled{cursor:default;opacity:.85}
.btn.danger{background:var(--alarm);color:#fff}
.mealline{font-size:.8rem;color:var(--muted);padding:2px 0 6px 58px}
.warn{border:2px dashed var(--muted)}
.ualabel{font-size:.75rem;font-weight:700;color:var(--muted);margin-top:8px}
.acct-act{display:flex;gap:14px}
.gcrow{display:grid;grid-template-columns:1fr 1.3fr;gap:10px;align-items:center;padding:6px 0;border-top:1px solid var(--line)}
.gcrow label{margin:0;color:var(--ink);font-size:.9rem}
/* Stundenplan */
.lessons{list-style:none;margin:8px 0 6px;padding:0;display:grid;gap:2px}
.lessons li{display:flex;gap:8px;align-items:baseline;font-size:.9rem;padding:3px 0}
.lessons .pn{color:var(--muted);font-variant-numeric:tabular-nums;width:22px;flex:none}
.lessons li.x .sj{text-decoration:line-through;color:var(--muted)}
.lessons em{font-style:normal;font-size:.75rem;font-weight:700;color:var(--todo)}
.lessons li.x em{color:var(--alarm)}
.tt{border-collapse:separate;border-spacing:3px;width:100%;min-width:420px;font-size:.8rem}
.tt th{font-size:.72rem;color:var(--muted);font-weight:700;text-transform:uppercase;letter-spacing:.05em;padding:2px}
.tt th.tday{color:var(--accent)}
.tt .pt{text-align:left;text-transform:none;letter-spacing:0;white-space:nowrap}
.tt .pt b{display:block;color:var(--ink);font-size:.82rem}
.tt .pt small{font-size:.66rem;font-weight:600;font-variant-numeric:tabular-nums}
.tt td{background:var(--surface-2);border-radius:8px;padding:6px 4px;text-align:center;font-weight:600;vertical-align:middle}
.tt td.tday{background:var(--accent-soft)}
.tt td.x{background:var(--alarm-soft);color:var(--alarm);text-decoration:line-through}
.tt td.r{background:var(--todo-soft)}
.tt td small{display:block;font-size:.62rem;text-decoration:none;font-weight:700}
.tt.edit td{padding:0;background:none}
.tt.edit input{width:100%;min-width:0;font:600 .78rem var(--body);color:var(--ink);background:var(--surface-2);border:1px solid var(--line);border-radius:8px;padding:7px 4px;text-align:center}
.ttbar{display:flex;gap:10px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.ttbar > .btn{width:auto;flex:1}
.stepper{display:flex;align-items:center;gap:8px;font-weight:700;font-size:.88rem}
.stepper .btn{width:38px;padding:8px 0}
/* Navigation */
nav.tabs{position:fixed;left:0;right:0;bottom:0;background:var(--surface);border-top:1px solid var(--line);padding:6px max(16px,env(safe-area-inset-right,0px)) calc(6px + env(safe-area-inset-bottom,0px)) max(16px,env(safe-area-inset-left,0px));z-index:5}
nav.tabs .in{max-width:560px;margin:0 auto;display:flex;gap:4px}
nav.tabs button{flex:1;background:none;border:0;color:var(--muted);font:700 .78rem var(--body);padding:6px 4px;border-radius:12px;cursor:pointer;display:grid;justify-items:center;gap:2px}
nav.tabs button[aria-current="page"]{color:var(--accent);background:var(--accent-soft)}
nav.tabs svg{width:22px;height:22px}
@media (prefers-reduced-motion:no-preference){.task{transition:border-color .2s}.task .ic{transition:background .2s,color .2s}}

/* Ergänzungen der echten Version */
.bday{background:var(--surface);border:1px solid var(--line)}
.bday .li{border-top:1px solid var(--line)}
.bday .li:first-of-type{border-top:0}
.bday .cake{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:var(--todo-soft);color:var(--todo);flex:none;font-weight:800;font-family:var(--display)}
.bday .soon b{color:var(--todo)}
.qr{display:grid;place-items:center;background:#fff;border-radius:12px;padding:12px;margin:8px auto;width:max-content}
.secret{font-family:ui-monospace,Menlo,monospace;font-size:.95rem;letter-spacing:.08em;word-break:break-all;background:var(--surface-2);border-radius:10px;padding:8px 10px;text-align:center}
.loading{display:grid;place-items:center;min-height:50vh;color:var(--muted);font-weight:700}
.err-line{color:var(--alarm);font-size:.85rem;font-weight:600}
.small-btn{width:auto;padding:7px 12px;font-size:.85rem}
.tt th.pt input{width:76px;font:600 .7rem var(--body);padding:4px;border:1px solid var(--line);border-radius:6px;background:var(--surface-2);color:var(--ink);text-align:left}
.sync{font-size:.75rem;color:var(--muted)}

/* Hausaufgaben-Fotos */
.hwph{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-top:-4px}
.kidrow + .hwph,.hwph + .kidrow{margin-top:0}
.kidrow + .hwph{grid-column:1/-1;padding:0 0 8px 20px}
.hwph .ph{position:relative;display:block}
.hwph img{width:64px;height:64px;object-fit:cover;border-radius:12px;display:block;border:1px solid var(--line)}
.hwph .ph button{position:absolute;top:-6px;right:-6px;width:24px;height:24px;border-radius:50%;border:2px solid var(--surface);background:var(--ink);color:var(--bg);font:700 .85rem var(--body);line-height:1;cursor:pointer;padding:0}
.addph{display:flex;align-items:center;gap:8px;height:64px;padding:0 14px;border:2px dashed var(--line);border-radius:12px;color:var(--accent);font-weight:700;font-size:.88rem;cursor:pointer;margin:0;background:var(--surface)}
.addph svg{width:22px;height:22px}

/* Ferien, Feiertage, mehrtägige Termine */
.ev time small{display:block;font-size:.72rem;font-weight:600;color:var(--muted)}
.holi{display:inline-block;font-family:var(--body);font-size:.7rem;font-weight:700;padding:1px 8px;border-radius:99px;margin-left:4px;background:var(--ok-soft);color:var(--ok)}
.holi.feiertag{background:var(--todo-soft);color:var(--todo)}
.holirow{margin:0 0 6px}
.holirow .holi{margin-left:0;margin-right:4px}
.holicard{background:var(--ok-soft);border-color:transparent}
.holicard h2{margin:0}
.mcell.fer{background:var(--ok-soft)}
.mcell.hol{background:var(--todo-soft)}
.mcell.hol .dn{color:var(--todo)}
.yd .fer{background:var(--ok-soft);border-radius:4px}
.yd .hol{background:var(--todo-soft);color:var(--todo);border-radius:4px}
.legend{display:flex;gap:14px;font-size:.75rem;color:var(--muted);font-weight:600}
.legend i{display:inline-block;width:12px;height:12px;border-radius:4px;margin-right:5px;vertical-align:-2px}
.lg-fer{background:var(--ok-soft);border:1px solid var(--ok)}
.lg-hol{background:var(--todo-soft);border:1px solid var(--todo)}

/* Rezept-Import */
.impbtns{display:grid;grid-template-columns:1fr 1fr;gap:8px}
@media (max-width:420px){.impbtns{grid-template-columns:1fr}}
.snap.alt{background:var(--accent-soft);color:var(--accent)}
.snap.off{opacity:.45;pointer-events:none}
details.tip{font-size:.85rem;color:var(--muted)}
details.tip summary{cursor:pointer;color:var(--accent);font-weight:700}
details.tip p{margin:6px 0 0}
.recimg{width:100%;max-height:260px;object-fit:cover;border-radius:18px;display:block}
.task.rec .ic img{width:48px;height:48px;object-fit:cover;border-radius:14px;display:block}
.task.rec .ic:has(img){background:none}

/* Klassenbuch-Verlauf */
.alert small,.notice small{color:var(--muted);font-size:.78rem}
.kb{display:flex;gap:10px;padding:8px 0;border-top:1px solid var(--line)}
.kb:first-of-type{border-top:0}
.kb .kbd{font-variant-numeric:tabular-nums;font-weight:700;font-size:.85rem;min-width:44px}
.kb .b{display:grid;gap:1px;min-width:0}
.kb .b span{white-space:pre-line}
.kb .b small{color:var(--muted);font-size:.78rem}
.kb.stu .kbd{color:var(--alarm)}
.kb.cls .kbd{color:var(--accent)}

.mealin{width:100%;font:inherit;color:var(--ink);background:var(--surface-2);border:1px solid var(--line);border-radius:10px;padding:8px 10px}

.netbox{margin-top:12px;display:grid;gap:8px}
.netrow{display:flex;gap:10px;align-items:flex-start;padding:6px 0;border-top:1px solid var(--line);font-size:.85rem}
.netrow small{color:var(--muted)}

/* Essensplan 14 Tage, Rezeptformular */
.mweek{font-size:.72rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);padding:10px 0 2px}
.mweek:first-child{padding-top:0}
.mrow.past{opacity:.55}
.calnav .nb:disabled{opacity:.35;cursor:default}
.link.small{font-size:.78rem;padding:2px 0}
textarea{line-height:1.45}

/* Arbeitszeiten im Kalender */
.shiftline{display:flex;flex-wrap:wrap;gap:4px 12px;font-size:.78rem;color:var(--muted);padding:2px 0 4px}
.shp{display:inline-flex;align-items:center;gap:5px}
.shp i{width:8px;height:8px;border-radius:2px;background:var(--pc);flex:none}
.shp b{color:var(--ink);font-weight:700}
.shp small{font-variant-numeric:tabular-nums}

/* nächste Schultage */
.tt th small.thd{display:block;font-size:.66rem;font-weight:600;letter-spacing:0;text-transform:none}
.tt td.free{background:transparent}
.ttend{display:flex;flex-wrap:wrap;gap:4px 14px;font-size:.78rem;color:var(--muted);margin-top:8px;font-variant-numeric:tabular-nums}
.ttend b{color:var(--ink)}
.nextday{display:flex;justify-content:space-between;gap:8px;align-items:baseline;margin-top:8px}

/* Aus Foto erkennen */
.scanitem{display:grid;gap:8px;padding:12px 0;border-top:1px solid var(--line)}
.scanitem:first-of-type{border-top:0;padding-top:0}
.scanitem.off > :not(:first-child){opacity:.4}
.pdfthumb{width:64px;height:64px;border-radius:12px;border:1px solid var(--line);background:var(--surface-2);display:grid;place-items:center;align-content:center;font-weight:800;color:var(--alarm);font-size:.9rem}
.pdfthumb small{font-size:.55rem;color:var(--muted);font-weight:600;max-width:60px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.btn.small-btn svg{vertical-align:-3px;margin-right:4px}

/* ---------- Mobil: kompakter Kopf ---------- */
.alertpill{display:flex;align-items:center;gap:10px;width:100%;border:2px solid var(--accent);background:var(--accent-soft);color:var(--ink);border-radius:14px;padding:8px 12px;font:600 .85rem var(--body);cursor:pointer;text-align:left}
.alertpill > span:nth-child(2){flex:1;min-width:0}
.alertpill b{color:var(--accent);white-space:nowrap}
.alertpill.red{border-color:var(--alarm);background:var(--alarm-soft)}
.alertpill.red b{color:var(--alarm)}
.alertpill .pulse{width:12px;height:12px;border-radius:50%;background:var(--alarm);flex:none}
.alertpill .ndot{width:22px;height:22px;border-radius:50%;background:var(--accent);color:#fff;display:grid;place-items:center;font-weight:800;font-size:.75rem;flex:none}
.who{flex-wrap:wrap;row-gap:4px}
.acct-act{flex-wrap:wrap;gap:4px 14px}
@media (max-width:560px){
  .app{padding-block:max(10px,env(safe-area-inset-top,0px)) 96px}
  .brand{font-size:1.1rem}
  .shifts{grid-template-columns:1fr 1fr;gap:6px;margin-top:8px}
  .shift{padding:7px 9px;gap:8px;border-radius:12px;align-items:flex-start}
  .shift .dot{width:24px;height:24px;font-size:.75rem}
  .shift b{font-size:.8rem;line-height:1.25}
  .shift span{font-size:.72rem}
  .alerts{gap:6px;margin-top:8px}
  .alert,.notice{padding:8px 10px;gap:10px;border-radius:12px}
  .alert b,.notice b,.alert span,.notice span{font-size:.82rem}
  .alert button,.notice button{padding:5px 10px;font-size:.75rem}
  .who{margin:10px 0 0}
  .acct{font-size:.82rem}
  .acct-act .link{font-size:.82rem}
  .hello{margin:10px 0 10px}
  h1{font-size:1.45rem}
  .hello p{font-size:.88rem}
  /* Kalender */
  .seg.big button{padding:8px;font-size:.92rem}
  .calnav{gap:6px}
  .calnav b{font-size:.98rem}
  .calnav .nb{width:36px;height:36px}
  .mgrid{gap:2px}
  .mcell{border-radius:8px;padding:3px 1px;font-size:.8rem;aspect-ratio:1/1.1}
  .mcell .dots i{width:5px;height:5px}
  .ygrid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .ym{padding:8px;border-radius:12px}
  .yd{font-size:.58rem}
  .day{margin-top:10px}
  .ev{gap:10px}
  .ev time{min-width:40px;font-size:.82rem}
  .card{padding:12px 13px;border-radius:16px}
}
@media (max-width:380px){.shifts{grid-template-columns:1fr 1fr}}
/* Monatsansicht: Titel ab Tablet-Breite */
.mcell .mt{display:none}
@media (min-width:640px){
  .app{max-width:760px}
  nav.tabs .in{max-width:760px}
  .mcell{aspect-ratio:auto;min-height:92px;justify-items:stretch;align-content:start;text-align:left;padding:5px 6px;gap:3px}
  .mcell .dn{justify-self:start}
  .mcell .dots{display:none}
  .mcell .mt{display:grid;gap:2px;min-width:0;align-content:start}
  .mcell .mt span{display:block;font-size:.68rem;font-weight:600;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;border-left:3px solid var(--pc);padding-left:4px;color:var(--ink)}
  .mcell .mt b{font-weight:700;color:var(--muted)}
  .mcell .mt .more{border:0;color:var(--muted)}
  .ygrid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (min-width:1000px){.app{max-width:980px} nav.tabs .in{max-width:980px} .ygrid{grid-template-columns:repeat(4,minmax(0,1fr))}}

.gcst{display:block;font-size:.72rem;font-weight:600;color:var(--muted);margin-top:1px}
.gcst.warn{color:var(--todo)}
.gcst.bad{color:var(--alarm)}

/* Aufgaben verwalten */
.tkact{display:flex;gap:18px}
.tkedit{padding:10px 0;border-top:1px solid var(--line)}
.tkedit:first-of-type{border-top:0}
.fchips button small{font-weight:800;opacity:.75;margin-left:2px}

.li .tags,.tk .tags{display:flex;flex-wrap:wrap;gap:3px 8px;align-items:center;margin-top:2px}

.seg.trange{margin:2px 0 6px}
.seg.trange button{padding:6px 10px;font-size:.82rem}
.seg.trange button small{opacity:.7;font-weight:800}

/* Aufgaben: Bearbeiten/Löschen direkt in der Zeile */
.tk .li{position:relative}
.tk .li .b{order:1}
.tkicons{order:2;display:flex;gap:2px;margin-left:auto;align-self:flex-start;flex:none}
.ib{width:34px;height:34px;border:0;border-radius:10px;background:transparent;color:var(--muted);display:grid;place-items:center;cursor:pointer;padding:0}
.ib:hover{background:var(--surface-2);color:var(--ink)}
.ib.del:hover{color:var(--alarm)}
.ib.armed{width:auto;padding:0 10px;background:var(--alarm);color:#fff;font:700 .78rem var(--body)}

/* Wetter & Sonne */
:root{--wx-sun:#f2a516;--wx-cloud:#9aa9bb;--wx-rain:#2f7fd8;--wx-snow:#7fb6e8}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){--wx-sun:#ffc24d;--wx-cloud:#7d8ea3;--wx-rain:#6aa8f5;--wx-snow:#a9cff2}}
:root[data-theme="dark"]{--wx-sun:#ffc24d;--wx-cloud:#7d8ea3;--wx-rain:#6aa8f5;--wx-snow:#a9cff2}
.wxbar{grid-column:1/-1;display:flex;align-items:center;gap:8px;background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:6px 12px;min-width:0}
.wxbar svg{flex:none}
.wxtemp{font-family:var(--display);font-size:1.45rem;line-height:1;font-variant-numeric:tabular-nums}
.wxinfo{display:grid;flex:1;min-width:0;line-height:1.2}
.wxinfo span{font-weight:700;font-size:.9rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wxinfo small{color:var(--muted);font-size:.75rem;font-variant-numeric:tabular-nums;white-space:nowrap}
.wxsun{display:grid;gap:2px;font-weight:700;font-size:.82rem;font-variant-numeric:tabular-nums;flex:none}
.wxsun span{display:inline-flex;align-items:center;gap:4px}
.wxsun svg{color:var(--wx-sun);width:16px;height:16px}
@media (max-width:560px){.wxbar{padding:5px 9px;gap:7px;border-radius:12px}.wxtemp{font-size:1.25rem}.wxinfo span{font-size:.8rem}.wxinfo small{font-size:.7rem}.wxsun{font-size:.74rem}}

/* Termin-Infos vom anderen Elternteil */
.evnotes{border:2px solid var(--accent)}
.evn{display:flex;align-items:center;gap:10px;padding:8px 0;border-top:1px solid var(--line);transition:opacity .2s,transform .2s}
.evn:first-of-type{border-top:0}
.evn.gone{opacity:0;transform:translateX(24px)}
.evnb{flex:1;min-width:0;display:grid;gap:2px}
.evnb>small{color:var(--muted);font-size:.75rem}
.evnb>small b{color:var(--accent)}
.evn.changed .evnb>small b{color:var(--todo)}
.evn.deleted .evnb>small b{color:var(--alarm)}
.evn.deleted .ev b{text-decoration:line-through;color:var(--muted)}
.evn .ev{margin:0;padding:4px 0;border:0;background:none}
.evok{flex:none;display:grid;justify-items:center;gap:2px;min-width:58px;padding:6px 8px;border-radius:12px;border:1px solid var(--line);background:var(--surface-2);color:var(--ok);font:700 .7rem var(--body);cursor:pointer}
.evok svg{width:20px;height:20px}
.evok:active{transform:scale(.95)}

/* Suche */
.search{display:flex;align-items:center;gap:8px;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:0 12px;color:var(--muted)}
.search svg{flex:none}
.search input{flex:1;min-width:0;border:0;background:transparent;font:inherit;font-size:16px;color:var(--ink);padding:10px 0;outline:none;-webkit-appearance:none;appearance:none}
.search:focus-within{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}

/* Kategorien (Rezepte, Belege) */
.catchips button,.qchips button{--pc:var(--accent)}
.qchips{margin-top:6px}
.qchips button{font-size:.78rem;padding:3px 10px}
.ctag{font-size:.7rem;font-weight:700;padding:1px 8px;border-radius:99px;background:var(--accent-soft);color:var(--accent)}
.rcats{display:flex;flex-wrap:wrap;gap:4px;margin-top:6px}

/* Wischen im Kalender */
.swipe{touch-action:pan-y}
.swipe.from-r{animation:swR .22s ease-out}
.swipe.from-l{animation:swL .22s ease-out}
@keyframes swR{from{opacity:.3;transform:translateX(36px)}to{opacity:1;transform:none}}
@keyframes swL{from{opacity:.3;transform:translateX(-36px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.swipe.from-r,.swipe.from-l{animation:none}}

/* Belege */
.acct .cnt,.acct-act .cnt{display:inline-grid;place-items:center;min-width:18px;height:18px;padding:0 5px;border-radius:99px;background:var(--alarm);color:#fff;font-size:.68rem;font-weight:800;margin-left:2px}
.rcrow{display:flex;align-items:center;gap:12px;width:100%;text-align:left;background:none;border:0;border-top:1px solid var(--line);padding:9px 0;color:var(--ink);font:inherit;cursor:pointer}
.row-h + .rcrow,.card > .rcrow:first-child{border-top:0}
.rcrow .b{flex:1;min-width:0;display:grid}
.rcrow .b b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rcrow .tags{display:flex;flex-wrap:wrap;gap:3px 6px;align-items:center;margin-top:2px}
.rcth{width:46px;height:46px;flex:none;border-radius:10px;background:var(--surface-2);display:grid;place-items:center;color:var(--muted);overflow:hidden;border:1px solid var(--line)}
.rcth img{width:100%;height:100%;object-fit:cover;display:block}
.pdfmini{font-size:.7rem;font-weight:800;color:var(--alarm)}
.amt{font-weight:800;font-variant-numeric:tabular-nums;white-space:nowrap}
.wtag{font-size:.7rem;font-weight:700;color:var(--muted)}
.wtag.soon{color:var(--todo)}
.wtag.over{text-decoration:line-through}
.hwph.big img,.hwph.big .pdfthumb{width:96px;height:96px}
a.pdfthumb{text-decoration:none;color:var(--alarm);font-weight:800}
.rcnote{white-space:pre-wrap;font-size:.9rem;margin:10px 0 0}
.mailpick{margin-top:8px;display:grid}
.warnpill{border-color:var(--todo);background:var(--todo-soft)}
.warnpill .ndot{background:var(--todo)}
.warnpill b{color:var(--todo)}

/* Posteingang */
.card.mail{transition:opacity .2s,transform .2s}
.card.mail.gone{opacity:0;transform:translateX(24px)}
.card.mail h2{font-size:1rem;overflow-wrap:anywhere}
.mailtext{margin-top:8px;font-size:.85rem}
.mailtext summary{cursor:pointer;color:var(--muted);list-style:none}
.mailtext summary::-webkit-details-marker{display:none}
.mailtext[open] summary{display:none}
.mailtext div{white-space:pre-wrap;overflow-wrap:anywhere;max-height:50vh;overflow:auto;background:var(--surface-2);border-radius:10px;padding:8px 10px}
.mailact{display:grid;grid-template-columns:repeat(auto-fit,minmax(0,1fr));gap:6px;margin-top:10px}
.mailact .btn{padding:9px 6px;font-size:.82rem;display:inline-flex;align-items:center;justify-content:center;gap:4px}
.mailact .btn svg{width:16px;height:16px}
@media (max-width:380px){.mailact{grid-template-columns:1fr 1fr}.mailact .btn:first-child{grid-column:1/-1}}
.card > .tags{display:flex;flex-wrap:wrap;gap:4px 8px;align-items:center}
#rcForm .impbtns .snap{padding:12px 14px}