:root{--bg:#eff3ef;--surface:#fff;--text:#243f39;--muted:#5d7169;--line:#dce5df;--soft:#e2eee4;--strong:#285840;--on:#fff;--error:#a92e36;--radius:16px;--font:clamp(15px,1.25vw,21px);color-scheme:light;font-family:system-ui,-apple-system,sans-serif;font-size:var(--font);line-height:1.45}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);min-height:100vh;min-height:100dvh}body[data-theme=dark]{--bg:#121f28;--surface:#1e2e39;--text:#edf4f0;--muted:#afc4b8;--line:#3a4c50;--soft:#2b463c;--strong:#bedfc9;--on:#183526;--error:#ffadb1;color-scheme:dark}@media(prefers-color-scheme:dark){body:not([data-theme=light]){--bg:#121f28;--surface:#1e2e39;--text:#edf4f0;--muted:#afc4b8;--line:#3a4c50;--soft:#2b463c;--strong:#bedfc9;--on:#183526;--error:#ffadb1;color-scheme:dark}}body[data-size=large]{--font:clamp(18px,1.6vw,25px)}body[data-size=compact]{--font:clamp(14px,1.1vw,18px)}button,input,textarea,select{font:inherit}button,.button{border:1px solid var(--line);border-radius:10px;padding:.55rem .8rem;min-height:44px;display:inline-flex;align-items:center;justify-content:center;gap:.45rem;background:var(--surface);color:var(--text);cursor:pointer;text-decoration:none}button:disabled{opacity:.5;cursor:wait}button[aria-pressed=true],.primary{background:var(--strong);border-color:var(--strong);color:var(--on)}button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,a:focus-visible{outline:3px solid var(--strong);outline-offset:3px}button svg,svg{width:1.3rem;height:1.3rem;stroke:currentColor;stroke-width:1.7;fill:none;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}.sprite{position:absolute;width:0;height:0;overflow:hidden}input:not([type=checkbox]),textarea,select{width:100%;min-width:0;border:1px solid var(--line);border-radius:9px;padding:.65rem;background:var(--bg);color:var(--text);font-size:max(16px,1rem)}input[type=checkbox]{width:21px;height:21px;accent-color:#4b805e;flex-shrink:0}textarea{resize:vertical}label{display:block}strong{font-weight:600}h1,h2,h3,p{margin:0}h1{font-size:1.55rem;font-weight:550}h2{font-size:1.12rem;font-weight:550;display:flex;align-items:center;gap:.5rem}h3{font-size:1.03rem;font-weight:500}.small{font-size:.8rem;color:var(--muted)}.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}[hidden]{display:none!important}#app{padding:clamp(12px,1.5vw,28px);max-width:2600px;margin:auto}.topbar{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:1rem;border-bottom:1px solid var(--line);padding-bottom:1rem}.brand{display:flex;align-items:center;gap:.6rem;font-size:1.2rem;font-weight:550;min-width:0}.brand-mark{background:var(--soft);padding:.7rem;border-radius:12px;display:flex}#brand-name{overflow-wrap:anywhere}.mainnav{display:flex;gap:.4rem}.mainnav button{padding:.65rem .95rem;gap:.55rem;font-size:.92rem;font-weight:550}.mainnav svg{width:1.4rem;height:1.4rem}.clock{text-align:right;display:flex;flex-direction:column}.clock time{font-size:1.65rem;font-weight:550;font-variant-numeric:tabular-nums}.clock span{font-size:.75rem;color:var(--muted)}.intro{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin:1rem 0}.intro p{font-size:.85rem;color:var(--muted);margin-top:.15rem}.home-layout{display:grid;grid-template-columns:minmax(0,2.2fr) minmax(270px,1fr);align-items:start;gap:1rem}.panel{background:var(--surface);border-radius:var(--radius);padding:1rem;min-width:0}.panel-head{display:flex;align-items:center;justify-content:space-between;gap:.5rem;flex-wrap:wrap;margin-bottom:.7rem}.segments{display:flex;gap:.25rem}.segments button{font-size:.78rem;padding:.4rem .6rem}.icon-button{padding:.5rem}.period-row{display:flex;align-items:center;justify-content:space-between;gap:.7rem;flex-wrap:wrap;margin-bottom:.7rem}.period-nav{display:flex;gap:.25rem}.period-nav button{font-size:.8rem;padding:.4rem .65rem}.calendar-controls{display:flex;align-items:flex-start;gap:.3rem;margin-bottom:.35rem}.calendar-controls>div{flex:1}.calendar-controls .quiet{font-size:.75rem}#calendar-list{display:flex;flex-wrap:wrap;gap:.25rem}.calendar-pill{border:1px solid var(--line);display:flex;align-items:center;gap:.3rem;font-size:.75rem;border-radius:8px;padding:.3rem .4rem;min-height:44px;cursor:pointer;max-width:100%}.calendar-pill span{overflow-wrap:anywhere}.calendar-pill input{width:17px;height:17px}.color-dot{width:9px;height:9px;flex-shrink:0;background:var(--calendar-color);border-radius:50%;display:inline-block}#calendar-status{margin:.3rem 0 .7rem}.week-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:.3rem}.calendar-day{background:var(--bg);border-radius:9px;padding:.4rem .3rem;min-width:0;min-height:clamp(240px,36vh,440px)}.calendar-day.today{background:var(--soft);box-shadow:inset 0 0 0 1px var(--strong)}.day-heading{display:flex;flex-direction:column;align-items:center;color:var(--muted);font-size:.7rem;margin-bottom:.8rem}.day-heading b{font-weight:550;color:var(--text);font-size:1.45rem;margin-top:.15rem}.event-button{width:100%;display:block;text-align:left;min-height:44px;border:0;border-left:3px solid var(--calendar-color);padding:.4rem .3rem;background:var(--surface);border-radius:5px;overflow-wrap:anywhere;margin:.35rem 0;font-size:.75rem;line-height:1.3}.event-button time{display:block;color:var(--muted);font-size:.68rem;margin-bottom:.2rem}.event-button .event-name{display:block}.month-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:.25rem}.weekday-label{text-align:center;font-size:.7rem;color:var(--muted);padding:.2rem}.month-grid .calendar-day{min-height:80px}.month-grid .day-heading{margin-bottom:.2rem;align-items:flex-start}.month-grid .day-heading b{font-size:1rem}.month-grid .outside{opacity:.5}.month-grid .event-button{font-size:.68rem;min-height:34px;padding:.25rem}.more-events{font-size:.7rem;width:100%;padding:.15rem;min-height:34px;border:0;background:transparent}.year-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.5rem}.year-month{border:1px solid var(--line);border-radius:9px;padding:.5rem;min-width:0}.year-month>button{border:0;padding:.2rem;min-height:36px;text-transform:capitalize;background:transparent;font-size:.85rem}.mini-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));text-align:center;gap:1px}.mini-grid>span{font-size:.6rem;color:var(--muted);padding:.2rem 0}.mini-day{padding:.2rem 0;border:0;min-height:27px;font-size:.67rem;background:transparent;border-radius:4px;flex-direction:column;gap:1px}.mini-day.today{box-shadow:inset 0 0 0 1px var(--strong)}.mini-marks{display:flex;gap:2px;height:4px;max-width:100%;justify-content:center;flex-wrap:wrap}.mini-marks i{width:4px;height:4px;border-radius:50%;background:var(--calendar-color)}#family-side{display:flex;flex-direction:column;gap:1rem}.heading-button{border:0;padding:0;background:transparent;justify-content:flex-start;gap:.55rem;flex:1;min-width:0}.heading-button h2{min-width:0}.expand-icon{width:1rem;height:1rem;color:var(--muted)}#shopping-items{display:flex;flex-direction:column}.shopping-row{display:flex;align-items:center;gap:.3rem;border-bottom:1px solid var(--line);min-height:48px}.shopping-row label{display:flex;align-items:center;gap:.45rem;flex:1;min-width:0;min-height:48px}.shopping-row span{overflow-wrap:anywhere}.shopping-row .edit-shopping{border:0;background:transparent;padding:.25rem .3rem;min-width:44px;font-size:.75rem;color:var(--muted);max-width:45%;overflow-wrap:anywhere}.shopping-row.bought label span{text-decoration:line-through;color:var(--muted)}.shopping-entry{display:grid;grid-template-columns:minmax(0,1fr) 4.5rem 44px;gap:.3rem;margin-top:.7rem}.shopping-entry input{padding:.55rem .4rem;font-size:max(16px,.85rem)}.shopping-actions{display:flex;justify-content:space-between;flex-wrap:wrap;gap:.3rem;margin-top:.6rem}.check-label{display:flex;align-items:center;gap:.4rem;font-size:.73rem;min-height:44px}.shopping-actions .quiet{font-size:.73rem}.quiet{background:transparent;border:0;padding:.4rem .3rem}.note-card{display:block;text-align:left;border:0;background:var(--soft);width:100%;padding:.8rem;margin-top:.5rem;overflow-wrap:anywhere}.note-card strong,.note-card span{display:block}.note-card span{font-size:.85rem;font-weight:400;white-space:pre-wrap;margin-top:.3rem}.note-card .note-preview{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.empty{color:var(--muted);font-size:.85rem;padding:.8rem 0}.page.expanded .home-layout{display:block}.page.expanded #family-side{display:block}.page.expanded[data-focus=shopping] #calendar-panel,.page.expanded[data-focus=shopping] #notes-panel,.page.expanded[data-focus=notes] #calendar-panel,.page.expanded[data-focus=notes] #shopping-panel,.page.expanded[data-focus=calendar] #family-side{display:none}.page.expanded[data-focus=shopping] #shopping-panel,.page.expanded[data-focus=notes] #notes-panel{max-width:1100px;margin:auto}.page.expanded .shopping-row{min-height:60px;font-size:1.2rem}.page.expanded .shopping-row label{min-height:60px}.page.expanded .note-card span{font-size:1.05rem}.page.expanded .note-card .note-preview{-webkit-line-clamp:unset;display:block}.page.expanded .calendar-day{min-height:44vh}.page.expanded .year-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.page.expanded .mini-day{min-height:32px}.connection-panel{max-width:1100px;margin:0 auto;padding:2rem}.connection-panel>h2{justify-content:center;margin:.7rem 0}.connection-panel>p{text-align:center;margin:.7rem auto;max-width:65ch}.connection-panel>.button{display:flex;width:fit-content;margin:1rem auto}.large-icon{display:block;width:3rem;height:3rem;margin:auto;color:var(--muted)}.future-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem;margin:1.4rem 0}.future-grid>div{background:var(--bg);border-radius:10px;padding:1rem;min-width:0}.future-grid span{display:block;font-size:.85rem;color:var(--muted)}.future-grid strong{display:block;font-size:1.5rem;margin-top:.4rem;font-weight:500}footer{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin-top:.8rem;color:var(--muted);font-size:.72rem}footer>div{display:flex;gap:.5rem}footer button{font-size:.75rem}.version{opacity:.7}#alert{padding:.7rem 1rem;background:var(--soft);border-radius:10px;margin-top:.7rem;font-size:.85rem}dialog{color:var(--text);background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:1.2rem;width:min(580px,94vw);max-height:90dvh;overflow:auto}dialog::backdrop{background:#0007}.dialog-head{display:flex;justify-content:space-between;align-items:center;gap:.8rem;margin-bottom:.8rem}.dialog-head h2{overflow-wrap:anywhere}dialog form>label,dialog>label{margin:.7rem 0}dialog label input,dialog label textarea,dialog label select{display:block;margin-top:.3rem}.dialog-actions{display:flex;justify-content:flex-end;gap:.5rem;flex-wrap:wrap;margin-top:1rem}.error,.danger{color:var(--error)}#event-info{white-space:pre-line;margin-bottom:.8rem;overflow-wrap:anywhere}#calendar-dialog-list label{margin:.3rem 0}#export-text{white-space:pre-wrap}#display-dialog>p{margin-top:1rem}
@media(min-width:1500px){.home-layout{grid-template-columns:minmax(0,2.5fr) minmax(330px,1fr)}.year-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.month-grid .calendar-day{min-height:110px}}
@media(max-width:1050px){.topbar{grid-template-columns:minmax(0,1fr) auto}.clock{grid-column:2;grid-row:1}.mainnav{grid-column:1/-1;justify-content:center}.brand{font-size:1.15rem}.home-layout{grid-template-columns:minmax(0,1.9fr) minmax(250px,1fr)}.panel{padding:.8rem}.panel-head{gap:.3rem}.segments button{padding:.35rem .45rem}.event-button{font-size:.73rem}}
@media(max-width:820px){.home-layout{grid-template-columns:1fr}#family-side{display:grid;grid-template-columns:1fr 1fr}#family-status{grid-column:1/-1}.week-grid .calendar-day{min-height:230px}.year-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.page.expanded .year-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:520px){#app{padding:10px}.brand-mark{padding:.5rem}.mainnav{gap:.3rem}.mainnav button{flex:1;min-width:0;padding:.55rem .35rem;gap:.3rem;font-size:.78rem}.mainnav button svg{width:1.1rem;height:1.1rem}#family-side{display:flex}.intro{margin:.8rem 0}h1{font-size:1.3rem}.week-grid{grid-template-columns:1fr}.week-grid .calendar-day{min-height:0;display:grid;grid-template-columns:48px minmax(0,1fr);gap:.5rem}.week-grid .day-heading{margin:0;align-self:start}.week-grid .event-button{font-size:.9rem}.week-grid .event-button time{font-size:.75rem}.year-grid,.page.expanded .year-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.month-grid .event-button{font-size:.65rem}.month-grid .calendar-day{min-height:75px;padding:.2rem}.month-grid .event-button time{display:none}.panel-head h2{font-size:1rem}.calendar-pill{font-size:.75rem}.future-grid{grid-template-columns:1fr}.connection-panel{padding:1rem}.period-row{align-items:flex-start}.clock time{font-size:1.35rem}.clock span{font-size:.68rem}.brand{font-size:1rem}footer{align-items:flex-start}.shopping-entry{grid-template-columns:minmax(0,1fr) 4.5rem 44px}}
@media print{body{background:white!important;color:black!important}.topbar,main,footer,#alert,dialog:not(#export-dialog){display:none!important}#export-dialog{display:block!important;position:static;border:0;width:100%;max-height:none;color:black;background:white}#export-dialog::backdrop{display:none}#export-dialog button,#export-dialog .dialog-actions,#export-status{display:none}#export-text{border:0;background:white;color:black;height:auto;min-height:70vh;font:18px/1.8 sans-serif}}