/* The wall view keeps the whole week and the family essentials in sight. */
.tile-navigation{display:none}
.board-grid{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:20px;overflow:visible;scroll-snap-type:none;padding:0}
.panel{min-width:0;min-height:0;padding:23px;border-radius:25px}
.calendar{grid-column:1;grid-row:1 / span 2}
.shopping{grid-column:2;grid-row:1;background:#fff4c5;box-shadow:0 8px 22px #89691d0b;position:relative;border-top-right-radius:7px}
.shopping:after{content:'';position:absolute;right:0;top:0;border-style:solid;border-width:0 26px 26px 0;border-color:transparent var(--bg) #e9d995 transparent;border-bottom-left-radius:6px}
.shopping h2{font-size:23px}.shopping .eyebrow{color:#786329}.shopping .quick-add{margin-top:16px}.shopping .quick-add input{background:#ffffff70}.shopping .entries{max-height:190px;min-height:90px}.shopping .empty{padding:20px 0}.shopping .entry{padding:8px 0}.shopping .shopping-note{margin:10px 0 0;color:#756331}
.gallery{grid-column:2;grid-row:2;background:var(--panel)}.gallery h2{font-size:22px}.photo-stage{height:170px;margin-top:15px}.photo-symbol{font-size:30px;margin-bottom:8px}#gallery-empty{padding:12px}#gallery-empty h3{font-size:15px}#gallery-empty p{font-size:11px;margin:6px 0}.photo-controls{gap:3px}.photo-controls button{padding:6px 9px}.photo-controls span{min-width:60px;font-size:11px}
.calendar .week-nav{margin:22px 0}.days{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:7px;flex:1;align-items:stretch}.week-day{min-width:0;border-radius:16px;background:#f7f8fa;padding:5px;display:flex;flex-direction:column;min-height:335px}.week-day.is-today{background:#edf4ff}.week-day .day{width:100%;border:0;min-height:68px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;background:transparent}.week-day .day.selected{background:var(--accent);color:white}.day-appointments{display:flex;flex-direction:column;gap:8px;padding:12px 0;flex:1}.appointment{width:100%;display:flex;flex-direction:column;align-items:start;text-align:left;gap:7px;padding:10px 7px;border:0;border-left:3px solid var(--person-ink);border-radius:9px;background:var(--person-bg);color:#202b3d;overflow-wrap:anywhere;line-height:1.4}.appointment strong{font-size:12px;font-weight:650}.appointment-time{font-size:10px;font-weight:650}.appointment-person{font-size:10px;opacity:.8}.day-free{font-size:10px;color:var(--muted);text-align:center;margin-top:12px}.day-add{border:0;background:transparent;color:var(--muted);font-size:21px;min-height:44px;width:100%}.day-add:hover{background:var(--soft)}.person-0{--person-bg:#e4edff;--person-ink:#4678c5}.person-1{--person-bg:#eee6fa;--person-ink:#9063b5}.person-2{--person-bg:#e4f1e5;--person-ink:#55845a}.person-3{--person-bg:#fce7dd;--person-ink:#be7452}.person-4{--person-bg:#f8e2ec;--person-ink:#bd668d}.person-5{--person-bg:#e0f1f2;--person-ink:#40898e}#person-legend{display:flex;flex-wrap:wrap;gap:12px;margin-top:12px}.person-label{font-size:11px;display:flex;align-items:center;gap:6px}.person-label:before{content:'';width:8px;height:8px;border-radius:50%;background:var(--person-ink)}.section-line{margin-top:18px}.calendar-note{margin-bottom:0}.intro{margin-bottom:24px}h1{font-size:clamp(32px,3.4vw,48px)}
.night .week-day{background:#2b2b32}.night .week-day.is-today{background:#25374e}.night .shopping{background:#393426}.night .shopping .eyebrow,.night .shopping-note{color:#e2cf93}.night .shopping .quick-add input{background:#ffffff10}.night .shopping:after{border-bottom-color:#625735}.night .appointment{color:#202b3d}
@media(max-width:1150px){.board-grid{grid-template-columns:minmax(0,1fr) 270px;gap:14px}.panel{padding:17px}.days{gap:3px}.week-day{padding:3px}.appointment{padding:8px 5px}.appointment strong{font-size:11px}.calendar h2{font-size:23px}main{padding:20px}.photo-controls button{padding:5px 7px}}
@media(max-width:900px){.board-grid{grid-template-columns:1fr 1fr}.calendar{grid-column:1 / -1;grid-row:1}.shopping{grid-column:1;grid-row:2}.gallery{grid-column:2;grid-row:2}.week-day{min-height:240px}.photo-stage{height:180px}}
@media(max-width:600px){.board-grid{display:flex;flex-direction:column;overflow:visible}.panel,.calendar,.gallery{flex:auto;min-height:0;width:100%;padding:18px}.days{display:flex;flex-direction:column;gap:8px}.week-day{min-height:90px;display:grid;grid-template-columns:48px minmax(0,1fr) 36px;gap:7px;align-items:start}.week-day .day{min-height:70px}.day-appointments{padding:5px 0}.day-free{text-align:left;padding:10px}.day-add{margin-top:14px}.appointment strong{font-size:14px}.appointment-time,.appointment-person{font-size:12px}.photo-stage{height:230px}.intro h1{font-size:35px}.week-nav{flex-wrap:wrap}.shopping .entries{max-height:280px}}
/* Readable at tablet distance: content takes priority over decorative space. */
:root{--muted:#50545c}
header{padding:14px 24px}main{padding:16px 24px 24px}.intro{margin-bottom:18px}.intro h1{font-size:32px;margin:6px 0}.intro .subtitle{display:none}.intro .eyebrow{font-size:14px;letter-spacing:.7px}.header-actions,.header-actions button,.sync,.sync button{font-size:15px}#clock{font-size:26px}
.board-grid{grid-template-columns:1fr 1fr;gap:18px}.calendar{grid-column:1 / -1;grid-row:1}.shopping{grid-column:1;grid-row:2}.gallery{grid-column:2;grid-row:2}.panel{padding:20px}.panel .eyebrow{font-size:12px;letter-spacing:.7px}.panel h2{font-size:27px}.calendar .week-nav{margin:16px 0}.week-nav strong{font-size:20px}.week-nav button,#today{font-size:17px;min-height:48px}.days{gap:10px}.week-day{min-height:220px;padding:6px}.week-day .day{min-height:80px}.day span{font-size:17px}.day strong{font-size:30px}.appointment{padding:12px 9px;gap:8px;line-height:1.45;overflow-wrap:break-word;hyphens:auto}.appointment strong{font-size:18px}.appointment-time,.appointment-person{font-size:16px;opacity:1}.day-free{font-size:16px}.day-add{font-size:26px;min-height:48px}.section-line,.section-line h3,.person-label{font-size:16px}.calendar-note{font-size:14px;line-height:1.6}.entry-title{font-size:20px}.entry-meta{font-size:16px}.quick-add input{font-size:18px}.shopping .shopping-note{font-size:16px}.empty,.empty span{font-size:17px}.empty strong{font-size:21px}.photo-controls span,.photo-controls button,#photo-delete{font-size:16px}.photo-controls{gap:8px}#photo-status{font-size:14px}#gallery-empty h3{font-size:21px}#gallery-empty p{font-size:16px}.photo-stage{height:190px}.shopping .entries{max-height:260px}footer{font-size:14px}dialog label,#editor-note{font-size:16px}
@media(max-width:1100px){.days{display:flex;flex-direction:column;gap:10px}.week-day{min-height:96px;display:grid;grid-template-columns:76px minmax(0,1fr) 48px;gap:12px;align-items:center}.week-day .day{min-height:80px}.day-appointments{padding:4px 0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(230px,100%),1fr));gap:10px;align-items:start}.day-free{text-align:left;margin:0;padding:12px}.day-add{margin:0}.appointment strong{font-size:20px}.appointment-time,.appointment-person{font-size:17px}.week-day .day.selected span{color:inherit}}
@media(max-width:600px){header{padding:16px}.header-actions button{font-size:14px;padding:8px}.header-actions{gap:8px}main{padding:16px}.intro h1{font-size:29px}.board-grid{display:flex;flex-direction:column}.panel{padding:16px}.week-day{grid-template-columns:54px minmax(0,1fr) 34px;gap:6px;padding:4px}.day span{font-size:16px}.day strong{font-size:27px}.appointment{padding:10px 8px}.appointment strong{font-size:18px}.appointment-time,.appointment-person{font-size:16px}.week-nav strong{font-size:17px}.sync{flex-wrap:wrap}.panel h2{font-size:25px}.calendar-note{font-size:14px}.photo-controls{flex-wrap:wrap}.intro .eyebrow{font-size:13px}}
.mobile-nav{display:none}#network-status{padding:14px;border:1px solid var(--danger);color:var(--danger);border-radius:12px}
@media(max-width:700px){
 main{padding-bottom:100px}.mobile-nav{position:fixed;bottom:0;left:0;right:0;z-index:10;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px;padding:10px 8px calc(10px + env(safe-area-inset-bottom));background:var(--panel);border-top:1px solid var(--border);box-shadow:0 -4px 20px #17233d09}.mobile-nav a{display:flex;align-items:center;justify-content:center;min-height:48px;text-decoration:none;font-size:15px;font-weight:600;border-radius:12px;color:var(--muted)}.mobile-nav a[aria-current=page]{background:var(--soft);color:var(--accent)}
 body[data-view=shopping] .panel:not(.shopping),body[data-view=calendar] .panel:not(.calendar),body[data-view=gallery] .panel:not(.gallery){display:none}
 body[data-view]:not([data-view=overview]) .board-grid{display:block}body[data-view]:not([data-view=overview]) .intro h1{display:none}body[data-view]:not([data-view=overview]) .shopping .entries{max-height:none}body[data-view]:not([data-view=overview]) .intro{margin-bottom:14px}#network-status{position:relative;margin-bottom:15px}
}
.mobile-nav{display:flex;gap:8px;flex-wrap:wrap;margin:20px 0}.mobile-nav a{padding:12px 16px;min-height:48px;border-radius:12px;text-decoration:none;background:var(--panel);color:var(--text)}.mobile-nav a[aria-current=page]{background:var(--accent);color:var(--panel)}
body[data-view=energy] .board-grid,body[data-view=cameras] .board-grid{display:none}.energy,.cameras{margin-top:18px}.energy-values,.camera-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.energy-card,.camera-card{padding:20px;background:var(--bg);border-radius:18px;min-width:0}.energy-card h3,.camera-card h3{font-size:21px}.energy-number{display:block;font-size:36px;margin:15px 0}.energy-card p,.camera-message{font-size:15px}.camera-card{display:flex;flex-direction:column;gap:14px}.camera-source{width:100%;min-height:48px;padding:8px;font:inherit;background:var(--panel);color:var(--text);border:1px solid var(--border);border-radius:10px}.camera-preview{width:100%;max-height:300px;object-fit:contain;cursor:zoom-in;border-radius:12px}#camera-viewer{width:min(1100px,96vw)}#camera-large{width:100%;max-height:75vh;object-fit:contain}
@media(max-width:700px){.mobile-nav{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin:0;gap:4px;padding:6px 8px calc(6px + env(safe-area-inset-bottom))}.mobile-nav a{padding:8px;min-height:44px}main{padding-bottom:145px}.energy-values,.camera-cards{grid-template-columns:1fr}.energy-number{font-size:32px}}
