.calendar-page{background:var(--page-background-containers)}
.calendar-page :is(.app-heading,.simulation,.preview-footer,.interaction-status){display:none}
.calendar-page #surface{width:100%;max-width:640px;padding:var(--space-24) var(--screen-gutter) var(--space-32);margin-inline:auto}
.calendar-page h1{margin:0 0 var(--space-32)}
.calendar-day+.calendar-day{margin-top:var(--space-24)}
.calendar-day h2{font:var(--body-weight) var(--body-xs)/var(--body-leading) var(--font-body);color:var(--muted);margin:0 0 var(--space-12)}
.calendar-events{display:flex;flex-direction:column;gap:var(--space-8)}
.calendar-page .calendar-event{display:block;margin:0;padding:var(--space-16);background:var(--color-background-white);border:1px solid var(--border-subtle-color);border-radius:var(--radius-container)}
.calendar-page .calendar-fixed,.calendar-page .calendar-event summary{display:grid;grid-template-columns:64px minmax(0,1fr);gap:var(--space-12);align-items:center}
.calendar-page .calendar-event time{font-size:var(--body-xs);white-space:nowrap;color:var(--text-secondary)}
.calendar-title{font-size:var(--body-md);line-height:var(--body-leading)}
.calendar-copy{display:flex;flex-direction:column;gap:var(--space-4);min-width:0}
.calendar-meta{font-size:var(--body-sm);color:var(--text-secondary)}
.calendar-deadline{color:var(--rose-strong)}
.calendar-page .calendar-fixed{border-left:3px solid var(--companion-pulse-color)}
.calendar-page .calendar-editable{padding:0;border-style:dashed;border-color:var(--badge-connection-border)}
.calendar-page .calendar-event summary{grid-template-columns:64px minmax(0,1fr) 24px;padding:var(--space-16);min-height:0;list-style:none;border-radius:inherit;cursor:pointer}
.calendar-event summary::-webkit-details-marker{display:none}
.calendar-edit-mark{font-size:var(--body-lg);text-align:center;color:var(--badge-connection-text)}
.calendar-event summary:hover{background:var(--badge-connection-background)}
.calendar-event summary:focus-visible{outline:2px solid var(--badge-connection-text);outline-offset:2px}
.calendar-event-actions{padding:0 var(--space-16) var(--space-16);display:flex;justify-content:flex-end}
.calendar-top{display:flex;align-items:center;justify-content:space-between;gap:var(--space-16);margin-bottom:var(--space-24)}
.calendar-top h1{margin:0}
.calendar-view-switch{display:flex;padding:var(--space-4);gap:var(--space-4);border:1px solid var(--border-subtle-color);border-radius:var(--radius-button-pill);background:white}
.calendar-view-switch button{padding:var(--space-8) var(--space-12);min-height:0;background:transparent;color:var(--text-secondary);font-size:var(--body-sm)}
.calendar-view-switch button:is([aria-pressed=true],[aria-selected=true]){background:var(--badge-connection-background);color:var(--badge-connection-text)}
.calendar-day-picker{display:flex;align-items:center;justify-content:space-between;gap:var(--space-8);margin-bottom:var(--space-24)}
.calendar-day-picker h2{font:var(--body-weight) var(--body-md)/var(--body-leading) var(--font-body);margin:0;text-align:center}
.calendar-day-picker button{background:white;color:var(--ink);padding:var(--space-8) var(--space-12);min-height:0}
.calendar-day-picker button:disabled{opacity:.3;cursor:default}
.calendar-timeline{position:relative;display:block;height:1136px;margin-top:var(--space-8)}
.calendar-hour{position:absolute;left:0;right:0;border-top:1px solid var(--border-subtle-color);margin-left:52px}
.calendar-hour>span{position:absolute;right:calc(100% + var(--space-8));top:-9px;white-space:nowrap;font-size:var(--body-xs);color:var(--text-secondary)}
.calendar-page .calendar-timeline .calendar-event{position:absolute;left:64px;right:0;z-index:1;border-color:var(--border-standard-color)}
.calendar-page .calendar-timeline .calendar-fixed{border-left-color:var(--companion-pulse-color)}
.calendar-page .calendar-timeline .calendar-fixed,.calendar-page .calendar-timeline .calendar-event summary{grid-template-columns:minmax(0,1fr);gap:var(--space-4)}
.calendar-page .calendar-timeline .calendar-event summary{position:relative;padding-right:var(--space-40)}
.calendar-timeline .calendar-edit-mark{position:absolute;right:var(--space-12);top:var(--space-16)}
.calendar-page .calendar-timeline .calendar-event[open]{z-index:2}
/* Suggested events: the snooze control is the only action. */
.calendar-page .calendar-editable{position:relative;display:flex;align-items:center;gap:var(--space-12);padding:var(--space-16);border:1px solid transparent}
.calendar-page .calendar-timeline .calendar-editable{border-color:transparent}
.calendar-dashed-border{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none;stroke:var(--badge-connection-border)}
.calendar-timeline .calendar-dashed-border{stroke:var(--border-standard-color)}
.calendar-suggestion-copy{display:grid;grid-template-columns:64px minmax(0,1fr);gap:var(--space-12);align-items:center;flex:1;min-width:0}
.calendar-timeline .calendar-suggestion-copy{grid-template-columns:minmax(0,1fr);gap:var(--space-4)}
.calendar-snooze{display:grid;place-items:center;flex:0 0 24px;width:24px;height:24px;min-height:0;padding:0;background:transparent;color:var(--rose-strong);border-radius:var(--radius-container-nested);position:relative}
.calendar-snooze>span{display:block;width:24px;height:24px;background:currentColor;mask:url('/assets/approved/calendar-snooze.svg') center/24px 24px no-repeat}
.calendar-snooze:hover{color:var(--button-required-background)}
.calendar-page .calendar-editable{background:var(--container-suggested-background)}
.calendar-page .calendar-dashed-border{stroke:var(--container-suggested-border)}
.calendar-event.is-dismissing{pointer-events:none;transform-origin:center;animation:calendar-snooze-exit var(--motion-default) var(--motion-ease) forwards}
@keyframes calendar-snooze-exit{
  0%{transform:scale(1,1);opacity:1}
  25%{transform:scale(1.04,.9);opacity:.9}
  55%{transform:scale(.82,.94);opacity:.65}
  100%{transform:scale(0,0);opacity:0}
}
.calendar-inline-meta{display:flex;align-items:baseline;flex-wrap:wrap;gap:var(--space-4);color:var(--text-secondary);font-size:var(--body-sm)}
.calendar-page .calendar-inline-meta time,.calendar-inline-meta{font-size:var(--body-sm)}
.calendar-inline-meta>[aria-hidden=true]{color:var(--text-subtle)}
.calendar-page .calendar-inline-meta,.calendar-page .calendar-inline-meta time,.calendar-page .calendar-inline-meta .calendar-meta{font-size:var(--body-xs)}
.calendar-top{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.calendar-view-switch{width:100%;min-width:0}
.calendar-view-switch button{flex:1 1 0;min-width:0;padding-inline:var(--space-4)}
.calendar-timeline{height:2000px}
.calendar-page .calendar-timeline .calendar-fixed{align-content:start}
.calendar-page .calendar-timeline .calendar-editable{align-items:stretch}
.calendar-timeline .calendar-suggestion-copy{align-content:start}
.calendar-timeline .calendar-snooze{align-self:center}
.calendar-inline-meta{gap:0}
.calendar-time-separator{white-space:pre;font-size:10px}
.calendar-page .calendar-inline-meta .calendar-meta{font-weight:var(--body-emphasis-weight);font-synthesis:weight;color:var(--ink)}
.calendar-page .calendar-inline-meta .calendar-deadline{color:var(--rose-strong)}
.calendar-page .calendar-inline-meta .calendar-time-separator,.calendar-page .calendar-inline-meta .calendar-meta{color:var(--text-secondary)}
.calendar-page .calendar-inline-meta .calendar-deadline{color:var(--rose-strong)}
.calendar-inline-meta{gap:var(--space-4)}
.calendar-page .calendar-inline-meta .calendar-meta{font-weight:var(--body-weight);font-synthesis:none}
.calendar-elapsed-check{display:block;flex:0 0 24px;width:24px;height:24px;align-self:center;background:var(--rose-strong);mask:url('/assets/approved/calendar-elapsed.svg') center/24px 24px no-repeat}
.calendar-now{position:absolute;left:52px;right:0;height:2px;background:var(--rose-strong);z-index:3;pointer-events:none}
.calendar-now::before{content:"";position:absolute;left:-3px;top:-2px;width:6px;height:6px;border-radius:50%;background:inherit}
.calendar-page{--navigation-background:var(--color-background-white)}
/* Compact Day cards; Agenda retains its established sizing. */
.calendar-page .calendar-timeline .calendar-event{padding:var(--space-12)}
.calendar-timeline .calendar-title{font-size:var(--body-sm)}
.calendar-timeline{height:1872px}
.calendar-top{position:sticky;top:0;z-index:5;background:var(--page-background-containers);margin-inline:calc(-1 * var(--screen-gutter));padding:var(--space-12) var(--screen-gutter)}

/* Day navigation overlays both days only during the directional slide. */
.calendar-day-viewport{display:grid;overflow:hidden;isolation:isolate}
.calendar-day-viewport>.calendar-day{grid-area:1/1;min-width:0;width:100%;margin-top:0}
.calendar-day-viewport>.calendar-day{padding-block:var(--calendar-center-clearance,0px)}
/* Concurrent commitments share horizontal space, never paint over one another. */
.calendar-page .calendar-timeline .calendar-event{box-sizing:border-box;left:calc(64px + (100% - 64px + 8px) * var(--event-column,0) / var(--event-columns,1));right:auto;width:calc((100% - 64px + 8px) / var(--event-columns,1) - 8px);min-width:0}
.calendar-timeline .calendar-copy{min-width:0;overflow-wrap:anywhere}
.calendar-timeline .calendar-inline-meta{flex-wrap:wrap}
.calendar-page .calendar-notes-open{min-height:44px;padding:0;border:0;background:transparent;color:inherit;text-align:left;border-radius:var(--radius-container-nested);font:inherit;cursor:pointer}
.calendar-notes-open:focus-visible,.calendar-snooze:focus-visible{outline:2px solid var(--rose-strong);outline-offset:4px}
.calendar-page .calendar-snooze{flex-basis:44px;width:44px;height:44px}
.calendar-snooze:disabled{opacity:.5;cursor:wait}
.calendar-page .calendar-time-label.calendar-deadline{color:var(--rose-strong);font-size:var(--body-xs);white-space:nowrap}
.calendar-notes-dialog{box-sizing:border-box;max-height:80dvh;overflow:auto}
.calendar-note-quote{white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.6}
