/* Clear glass over the existing page background. */
#view-calendar .calendar-workspace{position:relative;isolation:isolate;margin:0 42px 48px;min-width:0}



#view-calendar .calendar-surface{position:relative;padding:24px 28px 28px;border:1px solid #ecf5ff5e;border-radius:26px;background:rgb(225 237 255 / 2.5%);backdrop-filter:blur(5px) saturate(1.12);-webkit-backdrop-filter:blur(5px) saturate(1.12);box-shadow:inset 0 1px 1px #fff8,inset 1px 0 1px #e0edff3b,inset 0 -2px 1px #d7ebff24,0 3px 0 -1px #9fb5d227,0 12px 25px #0005}
#view-calendar .calendar-surface:before{content:'';position:absolute;inset:4px;pointer-events:none;border-radius:22px;border:1px solid #e5f0ff1f;background:linear-gradient(125deg,transparent 5%,#ffffff0f 20%,transparent 36%);box-shadow:inset 0 1px 2px #eff6ff20}
#view-calendar .calendar-toolbar{position:relative;margin:0;padding:0 0 22px;min-height:60px;display:flex;align-items:center;justify-content:flex-start;flex-wrap:wrap;gap:12px;background:none;border:0;border-bottom:1px solid #d6e2f326;border-radius:0;box-shadow:none}
#view-calendar .calendar-toolbar h2{flex:0 1 auto;min-width:0;margin:0 4px;font:400 24px/1.3 var(--sans);letter-spacing:-.035em;text-transform:none;color:#eef3fb}
#view-calendar .calendar-toolbar .bare-button{display:grid;place-items:center;flex:none;width:40px;height:40px;min-width:40px;padding:0;border:0;border-radius:0;background:none;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;color:#c9d7eb;cursor:pointer;transition:color .15s}
#view-calendar .calendar-toolbar .bare-button:hover{background:none;color:#fff}
#view-calendar .calendar-toolbar .bare-button svg{display:block;width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
#view-calendar .calendar-summary{display:block;margin-left:auto;color:#c2d1e4;font-size:11px;letter-spacing:.025em;text-transform:none;line-height:1.5}
#view-calendar .calendar-split{position:relative;display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,1fr);gap:30px;padding-top:26px;align-items:start}
#view-calendar .calendar-month{min-width:0}
#view-calendar .calendar-weekdays{margin:0;padding:0 0 14px;display:grid;grid-template-columns:repeat(7,minmax(0,1fr))}
#view-calendar .calendar-weekdays span{padding:0;border:0;text-align:center;font:400 11px/1.4 var(--sans);color:#b7c8de;letter-spacing:.03em}
#view-calendar #calendar-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px;margin:0;padding:0;border:0;background:transparent;box-shadow:none;overflow:visible;border-radius:0;backdrop-filter:none;-webkit-backdrop-filter:none}
#view-calendar .calendar-date{min-width:0;min-height:74px;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:8px 2px;border:1px solid transparent;border-radius:13px;background:transparent;color:#e2ebf9;font:400 17px/1.2 var(--sans);cursor:pointer;box-shadow:none;transition:background .15s,border-color .15s}
#view-calendar .calendar-date:hover{background:#ffffff0b;border-color:#e1efff29}
#view-calendar .calendar-date[aria-pressed=true]{background:#ffffff10;border-color:#e1efff80;box-shadow:inset 0 1px #fff7,0 4px 12px #0002}
#view-calendar .calendar-date.outside{color:#8493a9}
#view-calendar .calendar-date.today .calendar-date-number{border-bottom:1px solid #d2e4ff;padding-bottom:3px;margin-bottom:-4px}


#view-calendar .calendar-agenda{min-width:0;border-left:1px solid #e2efff25;padding-left:30px}
#view-calendar .calendar-agenda-heading{display:flex;align-items:center;gap:10px;margin-bottom:18px;min-height:35px}
#view-calendar .calendar-agenda-heading h2{margin:0;color:#eff4fc;font:400 23px/1.3 var(--sans);letter-spacing:-.03em}
#view-calendar #calendar-day-count{margin-left:auto;color:#c0d0e5;font:400 11px/1.4 var(--sans);white-space:nowrap}
#view-calendar #calendar-day-add{width:32px;height:32px;flex:none;display:grid;place-items:center;border:1px solid #e2efff36;border-radius:10px;background:#ffffff08;color:#d8e7fa;box-shadow:inset 0 1px #fff3;cursor:pointer}
#view-calendar #calendar-day-add svg{width:15px;height:15px}
#view-calendar #calendar-day-add:hover{background:#ffffff18}
#view-calendar #calendar-day-list{display:flex;flex-direction:column;gap:10px;min-height:340px;max-height:min(660px,65dvh);padding:3px 8px 12px 3px;margin:-3px -8px -12px -3px;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#b3c6e052 transparent}
#view-calendar .calendar-agenda-card{display:grid;grid-template-columns:3px 36px minmax(0,1fr) auto;align-items:center;gap:11px;flex-shrink:0;min-width:0;min-height:76px;width:100%;padding:13px 12px;text-align:left;border:1px solid #e2efff3b;border-radius:14px;background:linear-gradient(140deg,#ffffff18,#ffffff04 65%);color:#f3f6fc;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);box-shadow:inset 0 1px 1px #ffffff48,inset 0 -1px 1px #dae9ff14,0 3px 7px #0003;cursor:pointer;transition:transform .16s,background .16s,box-shadow .16s;font-family:var(--sans)}
#view-calendar .calendar-agenda-card:hover{transform:translateY(-2px);background:linear-gradient(140deg,#ffffff2b,#ffffff0a 65%);box-shadow:inset 0 1px 1px #fff7,0 6px 12px #0005}
#view-calendar .calendar-status-mark{height:28px;border-radius:3px;background:#a1d3bb}
#view-calendar .calendar-status-mark.amber{background:#9bb7e4}
#view-calendar .calendar-status-mark.red{background:#e7a8ae}
#view-calendar .calendar-account-avatar{width:36px;height:36px;border:1px solid #dbe9ff60;border-radius:50%;display:grid;place-items:center;overflow:hidden;background:#ffffff0c;color:#edf4ff;font-size:11px;box-shadow:inset 0 1px #fff3,0 2px 4px #0003}
#view-calendar .calendar-account-avatar img{width:100%;height:100%;object-fit:cover;object-position:center}
#view-calendar .calendar-account-copy{min-width:0}
#view-calendar .calendar-account-copy strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:500 14px/1.4 var(--sans);text-shadow:0 1px 4px #0006}
#view-calendar .calendar-account-meta{display:flex;align-items:center;gap:6px;margin-top:5px;color:#b9cbe3;font:400 11px/1.4 var(--sans)}
#view-calendar .calendar-account-meta svg{width:12px;height:12px;flex:none}
#view-calendar .calendar-agenda-card time{color:#d5e2f5;font:400 12px/1.3 var(--sans);font-variant-numeric:tabular-nums;white-space:nowrap}
#view-calendar .calendar-day-empty{margin:auto;text-align:center;padding:50px 10px;color:#b7c9e1;font:400 13px/1.5 var(--sans)}
#view-calendar .calendar-day-empty svg{width:26px;height:26px;opacity:.6}
#view-calendar :is(.calendar-date,.calendar-agenda-card,#calendar-day-list,#calendar-day-add):focus-visible{outline:2px solid #d5e7ff;outline-offset:2px}
@media(max-width:1000px){#view-calendar .calendar-workspace{margin-left:24px;margin-right:24px}#view-calendar .calendar-surface{padding:20px}#view-calendar .calendar-split{gap:20px;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}#view-calendar .calendar-agenda{padding-left:20px}#view-calendar .calendar-date{min-height:65px}#view-calendar .calendar-agenda-card{grid-template-columns:3px 30px minmax(0,1fr) auto;gap:8px;padding:12px 9px}#view-calendar .calendar-account-avatar{width:30px;height:30px}#view-calendar .calendar-account-copy strong{font-size:13px}}
@media(max-width:720px){#view-calendar .calendar-workspace{margin:0 16px 32px}#view-calendar .calendar-surface{padding:18px 16px;border-radius:22px}#view-calendar .calendar-toolbar{gap:10px;padding-bottom:16px}#view-calendar .calendar-toolbar h2{font-size:21px;margin:0}#view-calendar .calendar-summary{flex-basis:100%;margin:0;font-size:11px}#view-calendar .calendar-split{grid-template-columns:1fr;gap:22px;padding-top:20px}#view-calendar .calendar-agenda{border-left:0;border-top:1px solid #e2efff25;padding:20px 0 0}#view-calendar .calendar-date{min-height:58px;font-size:15px}#view-calendar #calendar-grid{gap:4px}#view-calendar #calendar-day-list{max-height:520px;min-height:180px}#view-calendar .calendar-account-meta{font-size:11px}}
@media(max-width:380px){#view-calendar .calendar-toolbar{gap:7px}#view-calendar .calendar-toolbar h2{font-size:18px}#view-calendar .calendar-date{font-size:14px;min-height:54px}#view-calendar .calendar-account-meta{font-size:10px}}
@media(prefers-reduced-motion:reduce){#view-calendar .calendar-date,#view-calendar .calendar-agenda-card{transition:none}#view-calendar .calendar-agenda-card:hover{transform:none}}
@media(prefers-reduced-transparency:reduce){#view-calendar .calendar-surface{background:#172130;backdrop-filter:none;-webkit-backdrop-filter:none}#view-calendar .calendar-agenda-card{background:#263346;backdrop-filter:none;-webkit-backdrop-filter:none}}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){#view-calendar .calendar-surface{background:#172130}#view-calendar .calendar-agenda-card{background:#263346}}

/* Align the calendar title with the calendar surface at each breakpoint. */
#view-calendar>.page-heading>div:first-child{margin-inline-start:42px}
@media(max-width:1000px){#view-calendar>.page-heading>div:first-child{margin-inline-start:24px}}
@media(max-width:720px){#view-calendar>.page-heading>div:first-child{margin-inline-start:16px}}
