/* The home calendar owns the space left in the viewport, at any window size. */
.workspace:has(.home-view){height:100dvh;display:flex;flex-direction:column}
.workspace:has(.home-view)>:not(.main){flex-shrink:0}
.workspace:has(.home-view) .topbar{height:56px;padding-inline:24px}
.main.home-view{max-width:1480px;padding:14px 42px 24px;flex:1;min-height:0;width:100%;margin:0 auto}
.home-calendar-frame{height:100%;display:flex;flex-direction:column;gap:12px;margin-bottom:24px;min-height:0}
.home-summary{display:flex;align-items:center;gap:20px;flex:none;min-width:0}
.home-summary h1{font-size:18px;letter-spacing:-.04em;white-space:nowrap;margin:0;line-height:32px}
.home-counts{display:flex;align-items:center;gap:18px}
.home-counts .stat{display:flex;align-items:center;gap:6px;height:32px;padding:0;border:0;background:none;box-shadow:none;white-space:nowrap;line-height:1}
.home-counts .stat-label{font-size:11px;color:var(--muted)}
.home-counts .stat strong{display:inline-flex;align-items:baseline;font-size:15px;margin:0;font-weight:600;line-height:1}
.home-counts .stat small{font-size:10px;margin-left:3px;font-weight:400}
.home-actions{margin-left:auto;display:flex;gap:10px;align-items:center;min-width:0}
.home-actions select{margin:0;padding:7px 10px;max-width:190px;font-size:11px;min-width:0}
.home-actions .btn{min-height:32px;padding:7px 12px;font-size:11px}
.home-calendar-frame>.planner-panel{flex:1;min-height:0;margin:0}
.home-calendar-frame>.planner-panel:not(.is-calendar){overflow:auto}
.planner-panel.is-calendar{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto minmax(0,1fr)}
.is-calendar .planner-heading{padding:12px 16px;gap:14px;flex-wrap:nowrap}
.is-calendar .planner-title{display:flex;align-items:baseline;gap:14px;white-space:nowrap}
.is-calendar .planner-title .eyebrow{margin:0;font-size:9px;letter-spacing:.14em}
.is-calendar .planner-heading h2{font-size:24px;margin:0}
.is-calendar .planner-heading h2 span{margin-right:0}
.is-calendar .planner-heading>.actions{flex-wrap:nowrap;gap:7px;width:auto}
.is-calendar .planner-toolbar{padding:12px 16px 12px 0;gap:0;flex-wrap:nowrap}
.is-calendar .planner-toolbar>p,.is-calendar>.planner-sync{display:none}
.is-calendar .planner-toolbar .actions{flex-wrap:nowrap}
.is-calendar #planner-body{grid-column:1/-1;min-height:0;display:flex;flex-direction:column}
.is-calendar .calendar-scroll{flex:1;min-height:0}
.is-calendar .calendar-grid{height:100%;grid-template-rows:26px repeat(6,minmax(0,1fr))}
.is-calendar .calendar-weekday{padding:5px 0}
.is-calendar .calendar-day{min-height:0;display:flex;flex-direction:column;overflow:hidden;padding:4px 6px;cursor:crosshair;user-select:none}
.is-calendar .calendar-day-head{flex:none;height:24px;margin:0 0 2px;gap:2px}
.is-calendar .calendar-day-head>button:first-child{height:24px;width:24px;font-size:11px;flex:none}
.is-calendar .calendar-more{font-size:10px;padding:3px 2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--green)}
.is-calendar .calendar-holiday{flex:none;line-height:14px;padding:0 2px;height:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.calendar-week{grid-column:1/-1;display:grid;grid-template-columns:repeat(7,minmax(0,1fr));position:relative;min-height:0;overflow:hidden}
.calendar-week-events{position:absolute;inset:30px 0 3px;display:grid;grid-template-columns:repeat(7,minmax(0,1fr));grid-auto-rows:24px;align-content:start;pointer-events:none;overflow:hidden}
.calendar-week.has-holiday .calendar-week-events{top:44px}
.calendar-week-events .calendar-entry{pointer-events:auto;width:calc(100% - 6px);margin-inline:3px!important;min-width:0}
.calendar-week-events .continues-before{border-top-left-radius:0;border-bottom-left-radius:0;border-left:0}
.calendar-week-events .continues-after{border-top-right-radius:0;border-bottom-right-radius:0}
.calendar-continuation{margin-left:auto}
.calendar-person{font-size:9px;font-weight:400;opacity:.85;margin-left:auto;max-width:42%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex-shrink:0}
.calendar-entry:has(.calendar-person) strong{flex:1}
@media(max-width:720px){.calendar-person{font-size:8px;max-width:38%}}
.is-calendar .calendar-entry{height:22px;margin:0 0 2px;padding:3px 5px;line-height:16px;align-items:center;cursor:grab}
.calendar-entry[hidden],.calendar-more[hidden]{display:none}
.is-calendar .calendar-legend{flex:none;padding:7px 14px;gap:14px;line-height:14px;flex-wrap:nowrap;border-top:1px solid var(--line);white-space:nowrap}
.calendar-instructions{opacity:.85}
.calendar-day.calendar-selected{background:color-mix(in srgb,var(--tiffany) 30%,var(--white));box-shadow:inset 0 0 0 1px var(--green)}
.calendar-entry.calendar-moving{opacity:.35}
.calendar-dragging,.calendar-dragging *{cursor:grabbing!important;user-select:none}
.planner-busy .calendar-grid{opacity:.65;pointer-events:none}
.planner-kind{display:inline-flex;gap:4px;background:var(--paper);padding:4px;border-radius:9px;margin-bottom:16px}
.planner-kind button{padding:7px 22px;border-radius:6px;font-size:12px;color:var(--muted)}
.planner-kind button[aria-pressed=true]{background:var(--tiffany);color:var(--tiffany-ink);font-weight:650}
/* Calendars opened from Kanban still have a bounded, resizable monthly grid. */
.main:not(.home-view) .planner-panel.is-calendar{height:calc(100dvh - 230px)}
@media(max-width:1250px){
 .home-counts{gap:10px}.home-summary{gap:12px}
 .is-calendar .planner-title .eyebrow{display:none}
 .is-calendar .planner-heading{gap:10px;padding:10px 12px}
 .is-calendar .planner-toolbar{padding:10px 12px 10px 0}
 .calendar-instructions{display:none}
}
@media(max-width:1100px){.main.home-view{padding-inline:28px}}
@media(max-width:950px){
 .home-summary{flex-wrap:wrap}.home-counts{margin-left:auto}.home-actions{width:100%;justify-content:flex-end}.home-summary h1{font-size:16px}
 .planner-panel.is-calendar{grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto minmax(0,1fr)}
 .is-calendar .planner-toolbar{padding:0 12px 7px;justify-content:flex-end}
 .is-calendar .planner-toolbar .btn{min-height:24px;padding:3px 8px;font-size:10px}
 .is-calendar .planner-toolbar .icon-button{padding:1px 6px}
 .is-calendar .planner-heading h2{font-size:21px}
 .is-calendar .calendar-day{padding:3px}
 .is-calendar .calendar-legend{gap:10px;font-size:9px;padding:5px 8px}
}
@media(max-width:720px){
 .workspace:has(.home-view) .topbar{height:48px;padding-inline:12px}
 .main.home-view{padding:8px 8px 16px}
 .workspace:has(.home-view){height:calc(100dvh - 65px)}
 .home-calendar-frame{gap:8px}
 .home-actions{gap:6px}.home-actions select{max-width:125px}.home-actions .btn{padding:6px 8px}
 .home-summary h1{font-size:14px}.home-summary{gap:6px}
 .is-calendar .planner-heading{padding:8px;gap:4px}
 .is-calendar .planner-heading h2{font-size:18px}.is-calendar .planner-heading h2 span{font-size:10px;margin-left:1px}
 .is-calendar .planner-heading>.actions{gap:4px}.is-calendar .planner-heading .btn{font-size:10px;padding:5px 7px;min-height:28px}
 .calendar-navigation{gap:0}.calendar-navigation .icon-button{padding:5px}
 .is-calendar .calendar-day{padding:2px}
 .is-calendar .calendar-day-head{height:22px;gap:0}.is-calendar .calendar-day-head>button:first-child{height:22px;width:22px}
 .is-calendar .calendar-more{font-size:8px;padding:2px 0}
 .calendar-week-events{top:27px}.calendar-week.has-holiday .calendar-week-events{top:41px}
 .is-calendar .calendar-entry{font-size:9px;padding:3px 2px;gap:2px}.is-calendar .calendar-entry span{display:none}
 .is-calendar .calendar-legend .right{margin-left:auto}
}
@media(max-height:550px){
 .is-calendar .calendar-legend{display:none}
 .is-calendar .calendar-day{padding-block:1px}
 .is-calendar .calendar-holiday{display:none}
 .is-calendar .calendar-day-head{height:20px;margin:0}
 .is-calendar .calendar-day-head>button:first-child{height:20px;width:20px}
 .calendar-week .calendar-week-events,.calendar-week.has-holiday .calendar-week-events{top:23px}
}

/* Both views share the same header geometry and permanent view controls. */
.planner-panel,.planner-panel.is-calendar{display:flex;flex-direction:column}
.planner-panel .planner-heading{display:flex;flex-wrap:nowrap;align-items:center;justify-content:space-between;gap:16px;min-height:60px;padding:12px 16px;flex-shrink:0}
.planner-panel .planner-title{display:block;min-width:0}
.planner-panel .planner-heading h2{font-size:22px;line-height:32px;margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.planner-panel .planner-heading h2 span{font-size:12px;margin:0 4px}
.planner-view-switch{display:flex;flex:none;gap:2px;padding:3px;background:var(--surface-subtle);border:1px solid var(--line);border-radius:8px}
.planner-view-switch button{width:94px;height:30px;padding:0 10px;border-radius:5px;font-size:12px;font-weight:500;color:var(--muted)}
.planner-view-switch button:hover{color:var(--ink)}
.planner-view-switch button[aria-pressed=true]{background:var(--action);color:var(--action-text)}
.planner-panel .planner-toolbar{display:flex;flex-wrap:nowrap;justify-content:space-between;align-items:center;gap:12px;min-height:48px;padding:0 16px 12px;flex-shrink:0;border-bottom:1px solid var(--line)}
.planner-context{display:flex;align-items:center;min-width:0;height:32px}
.planner-context p{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.planner-panel .calendar-navigation{gap:4px}
.planner-panel .calendar-navigation .icon-button{width:28px;height:32px;padding:4px;font-size:24px}
.planner-panel .planner-toolbar .actions{flex-wrap:nowrap;gap:8px;flex-shrink:0}
.planner-panel .planner-toolbar .btn{min-height:32px;height:32px;padding:7px 11px;font-size:11px}
.planner-panel .planner-toolbar>.actions>.icon-button{width:32px;height:32px;padding:5px;font-size:22px}
.planner-panel .planner-trash{height:32px;padding:0 4px}
.planner-panel>.planner-sync{display:none}
.planner-panel #planner-body{min-height:0;flex:1}
.planner-panel:not(.is-calendar) #planner-body{overflow:auto;scrollbar-gutter:stable}
.home-calendar-frame>.planner-panel:not(.is-calendar){overflow:hidden}
.planner-panel .planner-filters{padding:16px;gap:16px}
.planner-panel .planner-hint{padding-inline:16px}
.planner-panel .kanban-board{padding-inline:16px;gap:16px}
@media(max-width:720px){
 .planner-panel .planner-heading{gap:8px;min-height:54px;padding:8px}
 .planner-panel .planner-heading h2{font-size:16px;line-height:30px}
 .planner-panel .planner-heading h2 span{font-size:10px;margin:0 1px}
 .planner-view-switch button{width:72px;padding:0 5px;font-size:10px}
 .planner-panel .planner-toolbar{padding:0 8px 8px;min-height:42px;gap:4px}
 .planner-panel .planner-toolbar .actions{gap:4px}
 .planner-panel .planner-toolbar .btn{padding:5px 7px;min-height:30px;height:30px;font-size:10px}
 .planner-panel .planner-toolbar>.actions>.icon-button{width:26px;height:30px;font-size:20px}
 .planner-panel .planner-trash{font-size:10px;height:30px;padding:0 2px}
 .planner-panel .calendar-navigation{gap:0}
 .planner-panel .calendar-navigation .icon-button{width:22px;height:30px}
 .planner-context{height:30px;flex:1}
 .planner-context p{font-size:10px}
 .planner-panel .planner-filters{padding:12px 8px;gap:8px}
 .planner-panel .planner-hint{padding-inline:8px}
 .planner-panel .kanban-board{padding-inline:8px;gap:12px}
}
