[hidden]{display:none!important}
.app-tabs{display:flex;gap:8px;max-width:1440px;margin:20px auto 0;padding:0 28px}
.app-tabs button{padding:10px 20px;border:1px solid #303a46;border-radius:9px;background:#171d26;color:#fff;font:inherit;cursor:pointer}
.app-tabs button[aria-pressed=true]{color:#9af1df;background:#17332f;border-color:#438879}
#calendar-panel{max-width:1440px;margin:28px auto;padding:0 28px;color:#fff}
#calendar-panel *,#calendar-panel *::before,#calendar-panel *::after{box-sizing:border-box}
#calendar-panel button,#calendar-panel select{font:inherit;color:#fff;background:#19212d;border:1px solid #384657;border-radius:8px;padding:9px 12px;min-height:42px;max-width:100%}
#calendar-panel button{cursor:pointer}
#calendar-panel button:hover{border-color:#76dfcd;background:#20343b}
#calendar-panel :focus-visible{outline:2px solid #76dfcd;outline-offset:2px}
#calendar-panel h1{font-size:30px;line-height:1.2;margin:4px 0}
#calendar-panel h1 span{display:block;font-size:13px;color:#a1e8db;letter-spacing:2px;margin-top:9px}
#calendar-panel h2{font-size:18px;margin:0}
#calendar-panel h3{font-size:15px;margin:20px 0 8px;color:#fff}
#calendar-panel p{color:#fff;font-size:14px;line-height:1.6;margin:6px 0}
.cal-heading{display:flex;justify-content:space-between;gap:24px;align-items:center;flex-wrap:wrap;margin-bottom:20px}
.cal-title{display:flex;align-items:center;gap:16px;min-width:0;flex:1 1 400px}
.cal-title>img{width:56px;height:56px;object-fit:contain;flex-shrink:0}
.cal-title>div{min-width:0}
#cal-clock{white-space:pre-line;text-align:right;color:#b3e9de;font:13px/1.8 Consolas,monospace;background:#16232a;border:1px solid #2c494b;padding:12px 16px;border-radius:12px}
.cal-toolbar{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;margin:16px 0;padding:12px 16px;background:#171d26;border:1px solid #303a46;border-radius:12px}
.cal-month-nav,.cal-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap;min-width:0}
#calendar-panel .cal-month-nav>button{font-size:24px;padding:0;width:38px;min-height:38px;border-radius:50%}
.cal-month-nav h2{min-width:145px;text-align:center}
.cal-actions label{display:flex;align-items:center;gap:8px;font-size:13px;min-width:0}
#cal-filter{width:130px;min-width:0}
.cal-view{display:flex;border:1px solid #384657;border-radius:8px;padding:3px;background:#0f151c}
#calendar-panel .cal-view button{border:0;background:none;font-size:13px;min-height:34px;padding:6px 12px}
#calendar-panel .cal-view button[aria-pressed=true]{color:#9af1df;background:#21433c}
#calendar-panel #cal-today{color:#bdeee3;border-color:#438879;font-size:13px}
#cal-monthview{background:#121820;border:1px solid #303a46;border-radius:12px;overflow:hidden}
.cal-weekdays{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));padding:13px 0;color:#fff;text-align:center;font-size:12px;font-weight:600;border-bottom:1px solid #303743;letter-spacing:1px;background:#171f29}
.cal-weekdays span:nth-last-child(-n+2){color:#91c7da}
.cal-week{position:relative;min-height:calc(44px + var(--lanes)*32px + 10px);border-bottom:1px solid #2a3440}
.cal-week:last-child{border-bottom:0}
.cal-week-dates{position:absolute;inset:0;display:grid;grid-template-columns:repeat(7,minmax(0,1fr));align-items:start;background:repeating-linear-gradient(90deg,transparent 0,transparent calc(100%/7 - 1px),#28313b calc(100%/7 - 1px),#28313b calc(100%/7))}
#calendar-panel .cal-day{border:0;border-radius:0;border-right:1px solid #28313b;background:transparent;min-height:0;height:36px;padding:4px 7px;display:flex;align-items:flex-start;justify-content:flex-end;text-align:right}
#calendar-panel .cal-day:last-child{border-right:0}
#calendar-panel .cal-day:hover{background:#192631}
#calendar-panel .cal-day.cal-chosen{background:#193139}
#calendar-panel .cal-day.cal-today{background:#172b33}
.cal-day-number{display:flex;align-items:center;justify-content:center;width:27px;height:27px;font-size:13px;font-weight:600;border-radius:50%;color:#fff}
.cal-outside .cal-day-number{color:#fff}
.cal-today .cal-day-number{background:#88dccb;color:#10231f;box-shadow:0 0 16px #70cebd24}
.cal-chosen:not(.cal-today) .cal-day-number{outline:1px solid #7cc6b6;color:#b5f1e2}
.cal-week-events{position:relative;display:grid;grid-template-columns:repeat(7,minmax(0,1fr));grid-auto-rows:29px;gap:3px 0;padding:40px 0 10px;pointer-events:none}
#calendar-panel .cal-event-bar{display:flex;align-items:center;gap:6px;padding:2px 7px 2px 4px;min-width:0;min-height:0;height:28px;margin:0 3px;overflow:hidden;pointer-events:auto;border:1px solid color-mix(in srgb,var(--event-color) 48%,#273643);border-radius:16px;background:linear-gradient(90deg,color-mix(in srgb,var(--event-color) 36%,#17212c),color-mix(in srgb,var(--event-color) 20%,#15202a));color:#fff;box-shadow:0 1px 2px #0003;text-align:left}
#calendar-panel .cal-event-bar:hover{filter:brightness(1.2);border-color:var(--event-color)}
#calendar-panel .cal-event-bar.cal-continued-start{border-top-left-radius:2px;border-bottom-left-radius:2px;margin-left:0}
#calendar-panel .cal-event-bar.cal-continued-end{border-top-right-radius:2px;border-bottom-right-radius:2px;margin-right:0}
.cal-icon{width:42px;height:42px;object-fit:contain;flex-shrink:0}
.cal-event-bar .cal-icon{width:22px;height:22px}
.cal-bar-label{font-size:12px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.cal-legend{display:flex;flex-wrap:wrap;gap:10px 22px;margin:12px 2px;color:#fff;font-size:12px}
.cal-legend>span{display:flex;align-items:center;gap:6px}
.cal-legend i{display:inline-block;width:8px;height:8px;border-radius:50%;background:#88dccb}
.cal-days{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:18px;margin:24px 0}
.cal-days section{min-width:0;background:#151c25;border:1px solid #2d3945;border-radius:12px;padding:20px}
#calendar-panel .cal-section-note{font-size:12px;color:#fff;margin:6px 0 12px}
.cal-event-card{display:flex;align-items:flex-start;gap:13px;border-bottom:1px solid #2a3441;padding:16px 0;position:relative;min-width:0}
.cal-event-card:last-child{border-bottom:0}
.cal-event-body{min-width:0;flex:1}
.cal-event-heading{display:flex;align-items:flex-start;flex-wrap:wrap;gap:5px 10px;margin:0 0 5px}
.cal-event-heading strong{font-size:15px;line-height:1.45;color:#fff}
.cal-troop{display:inline-flex;align-items:center;gap:5px;color:#fff;font-size:12px;margin:2px 0 4px}
.cal-troop img{width:18px;height:18px;object-fit:contain}
#calendar-panel .cal-event-card p{font-size:12px;line-height:1.6;margin:2px 0;overflow-wrap:anywhere}
#calendar-panel .cal-event-card .cal-range{font-size:13px;color:#fff;margin-bottom:5px}
#calendar-panel .cal-event-card .cal-utc{color:#fff}
#calendar-panel .cal-event-card .cal-countdown{color:#97ddce;font:12px/1.6 Consolas,monospace;margin-top:7px}
#calendar-panel #cal-show-upcoming{margin-top:14px;width:100%;color:#a7dbce;background:#182b30;font-size:13px}
#cal-listview{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 24px;padding:12px 20px;background:#151c25;border:1px solid #303a46;border-radius:12px}
.cal-empty{color:#fff;font-style:italic}
#calendar-panel .cal-footnote{color:#fff;font-size:12px;border-top:1px solid #303743;padding-top:16px;margin-top:18px;line-height:1.7}
@media(max-width:900px){.cal-actions{gap:8px}.cal-title{flex-basis:100%}.cal-days{gap:12px}.cal-days section{padding:14px}.cal-event-card{gap:9px}.cal-icon{width:34px;height:34px}.cal-event-heading strong{font-size:14px}}
@media(max-width:640px){
 #calendar-panel{padding:0 12px;margin-top:22px}.app-tabs{padding:0 12px}
 #calendar-panel h1{font-size:25px}.cal-title{gap:10px}.cal-title>img{width:44px;height:44px}.cal-title .eyebrow{font-size:10px}
 #calendar-panel h1 span{font-size:11px;letter-spacing:1.5px}.cal-heading{gap:12px}#cal-clock{width:100%;text-align:left;padding:9px 12px;font-size:12px}
 #calendar-panel .cal-title p{font-size:12px}.cal-toolbar{padding:10px;gap:10px}.cal-month-nav{justify-content:space-between;width:100%}.cal-actions{width:100%;justify-content:space-between;gap:6px}.cal-actions label{font-size:11px;gap:4px}
 #cal-filter{width:90px;font-size:11px;padding:6px 3px;min-height:34px}#calendar-panel .cal-view button{font-size:11px;padding:5px 7px;min-height:32px}#calendar-panel #cal-today{font-size:11px;padding:6px 8px;min-height:34px}
 .cal-weekdays{font-size:10px;padding:10px 0}.cal-week{min-height:calc(39px + var(--lanes)*30px + 10px)}.cal-week-events{padding-top:35px;grid-auto-rows:27px}
 #calendar-panel .cal-day{padding:4px}.cal-day-number{width:24px;height:24px;font-size:11px}
 #calendar-panel .cal-event-bar{height:26px;gap:3px;margin:0 1px;padding:2px 4px 2px 2px}.cal-event-bar .cal-icon{width:19px;height:19px}.cal-bar-label{font-size:10px}.cal-event-bar[data-span="1"] .cal-bar-label{display:none}
 .cal-days{grid-template-columns:minmax(0,1fr);margin-top:18px}.cal-legend{font-size:10px;gap:8px 14px}#cal-listview{grid-template-columns:minmax(0,1fr);padding:8px 12px;gap:0}
 .cal-event-card{gap:9px}.cal-event-heading strong{font-size:14px}.cal-icon{width:32px;height:32px}
}

/* NO_VERDICT: toolbar-only draft; no execution or calendar-layout verdict. */
#calendar-panel .cal-toolbar{display:flex;flex-wrap:wrap;gap:12px;padding:12px;background:linear-gradient(180deg,#172335,#101925) padding-box,linear-gradient(115deg,#ad718e 0%,#8774ab 50%,#69a5b5 100%) border-box;border:1px solid transparent;border-radius:14px;box-shadow:inset 0 1px 0 #ffffff0d,0 4px 12px #00000026}
#calendar-panel .cal-toolbar .cal-month-nav,#calendar-panel .cal-toolbar .cal-actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px;min-width:0;max-width:100%}
#calendar-panel .cal-toolbar button,#calendar-panel .cal-toolbar select{min-width:44px;min-height:44px;height:auto;padding:8px 12px;font-size:14px;line-height:1.25;color:#fff;background:#1c2531;border:1px solid #525c69;border-radius:8px;box-shadow:none}
#calendar-panel .cal-toolbar .cal-month-nav>button{width:44px;min-width:44px;min-height:44px;padding:0;font-size:24px}
#calendar-panel .cal-toolbar .cal-month-nav h2{min-width:0;flex:1 1 130px;font-size:18px;text-align:center}
#calendar-panel .cal-toolbar .cal-actions label{display:flex;flex-wrap:wrap;gap:8px;min-width:0;font-size:14px;color:#fff}
#calendar-panel .cal-toolbar #cal-filter{width:140px;min-width:44px;max-width:100%;font-size:14px;min-height:44px}
#calendar-panel .cal-toolbar select option{color:#fff;background:#19212d}
#calendar-panel .cal-toolbar .cal-view{display:flex;flex-wrap:wrap;gap:4px;padding:3px;background:#0c1420;border:1px solid #394453;border-radius:10px}
#calendar-panel .cal-toolbar .cal-view button{min-height:44px;font-size:14px;border:1px solid transparent;background:#1c2531}
#calendar-panel .cal-toolbar #cal-today{min-height:44px;font-size:14px;color:#fff;border-color:#525c69;background:#1c2531}
#calendar-panel .cal-toolbar button:hover,#calendar-panel .cal-toolbar select:hover{color:#fff;background:#30303d;background-image:none;border-color:#71677f}
#calendar-panel .cal-toolbar .cal-view button[aria-pressed=true],#calendar-panel .cal-toolbar .cal-view button[aria-pressed=true]:is(:hover,:focus,:active){color:#fff!important;background:#51465f!important;background-image:none!important;border:1px solid #a99cc9!important;box-shadow:none!important;text-shadow:none!important}
#calendar-panel .cal-toolbar :is(button,select):focus-visible{outline:2px solid #d5cde6;outline-offset:2px}
@media(max-width:640px){
 #calendar-panel .cal-toolbar{padding:8px;gap:8px}
 #calendar-panel .cal-toolbar .cal-month-nav,#calendar-panel .cal-toolbar .cal-actions{width:100%;gap:8px}
 #calendar-panel .cal-toolbar .cal-actions{justify-content:flex-start}
 #calendar-panel .cal-toolbar .cal-actions label{flex:1 1 100%}
 #calendar-panel .cal-toolbar #cal-filter{flex:1 1 140px;width:auto}
 #calendar-panel .cal-toolbar .cal-view{flex:1 1 auto}
 #calendar-panel .cal-toolbar .cal-view button{flex:1 1 auto;padding:8px}
}
@media(prefers-reduced-motion:reduce){#calendar-panel .cal-toolbar :is(button,select){transition:none;animation:none}}
/* NO_VERDICT: unverified MONTH-only source draft; parent review and runtime verification required. */
#calendar-panel #cal-monthview {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  background: #101b2c;
  border: 1px solid #395376;
  border-radius: 14px;
  overflow-x: auto;
  overflow-y: auto;
  box-shadow: inset 0 1px 0 #ffffff08, 0 4px 14px #00000026;
}

#calendar-panel #cal-monthview .cal-weekdays,
#calendar-panel #cal-monthview #cal-grid {
  width: 100%;
  min-width: 1120px;
}

#calendar-panel #cal-monthview .cal-weekdays {
  grid-template-columns: repeat(7, minmax(160px, 1fr));
  padding: 13px 0;
  background: #18283e;
  border-bottom: 1px solid #395376;
  color: #fff;
  font-size: 12px;
}

#calendar-panel #cal-monthview .cal-weekdays span:nth-last-child(-n+2) {
  color: #a9d5e8;
}

#calendar-panel #cal-monthview .cal-week {
  height: auto;
  min-height: 0;
  max-height: none;
  background: #121e30;
  border-bottom: 1px solid #30435e;
}

#calendar-panel #cal-monthview .cal-week:last-child {
  border-bottom: 0;
}

#calendar-panel #cal-monthview .cal-week-dates {
  grid-template-columns: repeat(7, minmax(160px, 1fr));
  background: repeating-linear-gradient(90deg, transparent 0, transparent calc(100% / 7 - 1px), #2b3b53 calc(100% / 7 - 1px), #2b3b53 calc(100% / 7));
}

#calendar-panel #cal-monthview .cal-week-events {
  position: relative;
  display: grid;
  grid-template-columns: repeat(7, minmax(160px, 1fr));
  grid-auto-rows: auto;
  align-items: stretch;
  gap: 6px 0;
  height: auto;
  min-height: 96px;
  max-height: none;
  padding: 42px 0 12px;
  overflow: visible;
}

#calendar-panel #cal-monthview .cal-event-bar {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  gap: 7px;
  height: auto;
  min-height: 48px;
  max-height: none;
  min-width: 0;
  margin: 0 3px;
  padding: 9px 8px;
  overflow: visible;
  white-space: normal;
  color: #fff;
  text-align: left;
  border: 1px solid color-mix(in srgb, var(--event-color) 52%, #30435e);
  border-radius: 9px;
  background: linear-gradient(100deg, color-mix(in srgb, var(--event-color) 25%, #142238), color-mix(in srgb, var(--event-color) 14%, #101d30));
  box-shadow: inset 0 2px 0 color-mix(in srgb, var(--event-color) 80%, #fff 20%), 0 1px 2px #00000026;
  animation: none;
  transition: none;
}

#calendar-panel #cal-monthview .cal-event-bar:hover {
  filter: none;
  border-color: var(--event-color);
  background: linear-gradient(100deg, color-mix(in srgb, var(--event-color) 30%, #142238), color-mix(in srgb, var(--event-color) 19%, #101d30));
}

#calendar-panel #cal-monthview .cal-event-bar.cal-continued-start {
  margin-left: 0;
  border-top-left-radius: 2px;
  border-bottom-left-radius: 2px;
}

#calendar-panel #cal-monthview .cal-event-bar.cal-continued-end {
  margin-right: 0;
  border-top-right-radius: 2px;
  border-bottom-right-radius: 2px;
}

#calendar-panel #cal-monthview .cal-event-bar .cal-icon {
  display: block;
  flex: 0 0 24px;
  align-self: flex-start;
  width: 24px;
  height: 24px;
  object-fit: contain;
}

#calendar-panel #cal-monthview .cal-event-bar .cal-bar-label,
#calendar-panel #cal-monthview .cal-event-bar[data-span="1"] .cal-bar-label {
  display: block;
  flex: 1 1 0%;
  align-self: flex-start;
  min-width: 0;
  height: auto;
  min-height: 0;
  max-height: none;
  margin: 0;
  padding: 0;
  color: #fff;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.45;
  white-space: normal;
  text-wrap: wrap;
  overflow-wrap: anywhere;
  word-break: normal;
  overflow: visible;
  text-overflow: clip;
  -webkit-line-clamp: unset;
  line-clamp: unset;
  animation: none;
  transition: none;
}


/* NO_VERDICT: source-only compact agenda draft. Supplied Superpowers umbrella, systematic-debugging, test-driven-development and verification-before-completion read. Reported RED: upcoming count Expected 4, Received 6; not independently executed here. No tools/runtime used, no RED/GREEN or layout verdict claimed. Parent review and fresh acceptance execution required. Append to calendar/calendar.css. */
#calendar-panel .cal-days {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
#calendar-panel .cal-days > section {
  min-width: 0;
  padding: 13px 12px 12px;
  background: #101d30;
  border: 1px solid #354d6b;
  border-radius: 12px;
  color: #fff;
}
#calendar-panel .cal-days h2,
#calendar-panel .cal-days h3 {
  color: #fff;
  font-size: 17px;
  line-height: 1.3;
}
#calendar-panel .cal-days h2 { margin: 0 0 8px; }
#calendar-panel .cal-days h3 { margin: 10px 0 8px; }
#calendar-panel .cal-days .cal-section-note {
  margin: -2px 0 8px;
  color: #fff;
  font-size: 12px;
  line-height: 1.35;
}
#calendar-panel .cal-days :is(#cal-day, #cal-active, #cal-upcoming) {
  display: grid;
  gap: 8px;
  min-width: 0;
}
#calendar-panel .cal-days .cal-event-compact {
  display: block;
  min-width: 0;
  max-width: 100%;
  margin: 0;
  padding: 0;
  border: 1px solid #2d415b;
  border-left: 3px solid var(--event-color);
  border-radius: 8px;
  background: #15243a;
  background: color-mix(in srgb, var(--event-color) 7%, #15243a);
  color: #fff;
}
#calendar-panel .cal-days .cal-event-compact > details {
  display: block;
  min-width: 0;
  width: 100%;
}
#calendar-panel .cal-days .cal-event-compact summary {
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr) 8px;
  align-items: start;
  gap: 6px;
  min-width: 0;
  min-height: 44px;
  padding: 6px;
  list-style: none;
  color: #fff;
  cursor: pointer;
}
#calendar-panel .cal-days .cal-event-compact summary::-webkit-details-marker { display: none; }
#calendar-panel .cal-days .cal-event-compact summary::marker { content: ''; }
#calendar-panel .cal-days .cal-event-compact summary::after {
  content: '';
  width: 6px;
  height: 6px;
  margin-top: 5px;
  border-right: 1.5px solid #fff;
  border-bottom: 1.5px solid #fff;
  transform: rotate(45deg);
}
#calendar-panel .cal-days .cal-event-compact details[open] > summary::after { transform: rotate(225deg); }
#calendar-panel .cal-days .cal-event-compact summary:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 2px;
  border-radius: 6px;
}
#calendar-panel .cal-days .cal-event-compact .cal-icon {
  display: block;
  width: 24px;
  height: 24px;
  object-fit: contain;
}
#calendar-panel .cal-days .cal-event-compact .cal-event-body {
  min-width: 0;
  max-width: 100%;
}
#calendar-panel .cal-days .cal-event-compact .cal-event-heading {
  display: block;
  min-width: 0;
  margin: 0 0 2px;
}
#calendar-panel .cal-days .cal-event-compact .cal-event-heading strong {
  display: block;
  min-width: 0;
  height: auto;
  max-height: none;
  color: #fff;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.3;
  white-space: normal;
  overflow: visible;
  overflow-wrap: anywhere;
  word-break: normal;
  text-overflow: clip;
  -webkit-line-clamp: unset;
  line-clamp: unset;
}
#calendar-panel .cal-days .cal-event-compact .cal-range {
  display: block;
  margin: 0;
  color: #fff;
  font-size: 12px;
  line-height: 1.3;
  white-space: normal;
  overflow-wrap: anywhere;
}
#calendar-panel .cal-days .cal-event-compact .cal-countdown {
  display: block;
  margin: 2px 0 0;
  color: #97ddce;
  font: 12px/1.3 Consolas, monospace;
  white-space: normal;
  overflow-wrap: anywhere;
}
#calendar-panel .cal-days .cal-event-compact .cal-local,
#calendar-panel .cal-days .cal-event-compact .cal-utc {
  margin: 0;
  padding: 6px 8px;
  color: #fff;
  font-size: 12px;
  line-height: 1.5;
  white-space: normal;
  overflow-wrap: anywhere;
}
#calendar-panel .cal-days .cal-event-compact .cal-local { border-top: 1px solid #35465e; }
#calendar-panel .cal-days .cal-event-compact .cal-utc { padding-top: 0; padding-bottom: 8px; }
#calendar-panel .cal-days .cal-empty {
  margin: 0;
  color: #fff;
  font-size: 13px;
  line-height: 1.4;
}
#calendar-panel .cal-days #cal-show-upcoming {
  margin-top: 8px;
  color: #fff;
  background: #1a2d46;
  border-color: #435b78;
}
@media (max-width: 640px) {
  #calendar-panel .cal-days { grid-template-columns: minmax(0, 1fr); gap: 10px; }
}
/* NO_VERDICT: unverified source-only toolbar/month draft. Supplied Superpowers, TDD, debugging and verification skills read. Parent-reported heading RED not independently executed. No tools or execution used; parent must review replacements and verify layout, target month height and regressions. Append only. */
#calendar-panel .cal-title,
#calendar-panel .cal-title *{color:#fff!important;-webkit-text-fill-color:#fff;text-shadow:none}
#calendar-panel .cal-toolbar{flex-wrap:nowrap;gap:12px}
#calendar-panel .cal-toolbar .cal-month-nav{flex:0 0 auto;flex-wrap:nowrap;width:auto;gap:8px;justify-content:flex-start}
#calendar-panel .cal-toolbar .cal-month-nav h2{flex:0 0 auto;min-width:0;white-space:nowrap;font-size:18px;line-height:1.25}
#calendar-panel .cal-toolbar .cal-month-nav>button{flex:0 0 44px;width:44px;min-width:44px;min-height:44px}
#calendar-panel .cal-toolbar .cal-month-nav #cal-today{flex:0 0 auto;width:auto;min-width:44px;padding:8px 10px;font-size:14px;white-space:nowrap}
#calendar-panel .cal-toolbar #cal-clock{flex:1 1 240px;min-width:0;width:auto;max-width:100%;margin:0;padding:0;border:0;border-radius:0;background:none;box-shadow:none;color:#c6d9df;font:14px/1.5 Consolas,monospace;white-space:pre-line;overflow-wrap:anywhere;text-align:center}
#calendar-panel .cal-toolbar .cal-actions{flex:0 0 auto;width:auto;flex-wrap:nowrap;justify-content:flex-end}
#calendar-panel .cal-toolbar .cal-view{flex:0 0 auto;flex-wrap:nowrap;gap:4px}
#calendar-panel .cal-toolbar .cal-view button{flex:0 0 auto;min-width:44px;min-height:44px;font-size:14px;white-space:nowrap}
#calendar-panel #cal-monthview{border-radius:16px;background:#111b2a;border-color:#34465e}
#calendar-panel #cal-monthview .cal-weekdays{background:#192638;border-color:#34465e}
#calendar-panel #cal-monthview .cal-week{background:#131e2d;border-color:#2e3d51}
#calendar-panel #cal-monthview .cal-week-events{grid-auto-rows:auto;gap:4px 0;padding:34px 0 8px;min-height:76px;height:auto;max-height:none}
#calendar-panel #cal-monthview .cal-event-bar{height:auto;min-height:34px;max-height:none;padding:4px 8px;gap:6px;border-radius:13px;border-color:color-mix(in srgb,var(--event-color) 38%,#334154);background:linear-gradient(100deg,color-mix(in srgb,var(--event-color) 20%,#172333),color-mix(in srgb,var(--event-color) 11%,#142030));box-shadow:inset 0 1px 0 color-mix(in srgb,var(--event-color) 35%,#334154),0 1px 2px #0002;overflow:visible}
#calendar-panel #cal-monthview .cal-event-bar .cal-icon{flex:0 0 22px;width:22px;height:22px}
#calendar-panel #cal-monthview .cal-event-bar .cal-bar-label,
#calendar-panel #cal-monthview .cal-event-bar[data-span="1"] .cal-bar-label{display:block;font-size:14px;line-height:1.45;white-space:normal;overflow-wrap:anywhere;overflow:visible;text-overflow:clip;max-height:none;-webkit-line-clamp:unset;line-clamp:unset}
#calendar-panel #cal-monthview .cal-week-dates{align-items:stretch}
#calendar-panel #cal-monthview .cal-day{position:relative;align-self:stretch;align-items:flex-start;height:100%;min-height:44px;padding:2px 7px;background:transparent;border-color:#2b3b53}
#calendar-panel #cal-monthview .cal-day .cal-day-number{position:relative;flex:0 0 28px;width:28px;height:28px;font-size:16px;font-weight:700;line-height:1}
#calendar-panel #cal-monthview .cal-day.cal-chosen{background:#a99cc90b;box-shadow:inset 0 0 0 1px #a99cc96b}
#calendar-panel #cal-monthview .cal-day.cal-today{background:#88dccb0d}
#calendar-panel #cal-monthview .cal-day.cal-today.cal-chosen{background:linear-gradient(#a99cc90a,#a99cc90a),#88dccb0d;box-shadow:inset 0 0 0 1px #a99cc991}
#calendar-panel #cal-monthview .cal-day.cal-chosen:not(.cal-today) .cal-day-number{background:#51465f;color:#fff;outline:1px solid #a99cc9}
#calendar-panel #cal-monthview .cal-day.cal-today .cal-day-number{background:#a0d8cd;color:#10231f;box-shadow:0 0 0 2px #88dccb20}
#calendar-panel #cal-monthview .cal-day.cal-today.cal-chosen .cal-day-number{outline:2px solid #b4a5d0;outline-offset:1px}
#calendar-panel #cal-monthview .cal-day.cal-today::after{content:'';position:absolute;top:13px;right:42px;width:5px;height:5px;border-radius:50%;background:#a0d8cd;pointer-events:none}
@media(max-width:1000px){
 #calendar-panel .cal-toolbar{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px 12px}
 #calendar-panel .cal-toolbar .cal-month-nav{grid-column:1 / -1;justify-self:center;max-width:100%}
 #calendar-panel .cal-toolbar #cal-clock{grid-column:1;grid-row:2;text-align:left}
 #calendar-panel .cal-toolbar .cal-actions{grid-column:2;grid-row:2;justify-self:end}
}
@media(max-width:640px){
 #calendar-panel .cal-toolbar{padding:8px;gap:8px}
 #calendar-panel .cal-toolbar .cal-month-nav{width:100%;gap:4px;justify-content:center}
 #calendar-panel .cal-toolbar .cal-month-nav h2{font-size:14px}
 #calendar-panel .cal-toolbar .cal-month-nav #cal-today{padding:8px 4px;font-size:14px}
 #calendar-panel .cal-toolbar .cal-actions{width:auto;gap:0}
 #calendar-panel .cal-toolbar .cal-view{flex:0 0 auto;gap:2px;padding:2px}
 #calendar-panel .cal-toolbar .cal-view button{flex:0 0 auto;padding:8px 6px;font-size:14px}
 #calendar-panel .cal-toolbar #cal-clock{font-size:14px;line-height:1.5}
}

/* NO_VERDICT: unverified source-only list draft. Supplied Superpowers, systematic-debugging, test-driven-development and verification-before-completion read. Parent-reported RED: zero daily groups; not independently executed. No tools used or RED/GREEN claimed. Parent must review and run fresh behavioral, boundary, responsive and regression checks. */
#calendar-panel #cal-listview{display:block;min-width:0;padding:6px 12px;border:1px solid transparent;border-radius:12px;background:linear-gradient(#151c25,#151c25) padding-box,linear-gradient(115deg,rgb(224,127,192),rgb(157,111,224),rgb(79,224,224)) border-box;animation:none;transition:none}
#calendar-panel #cal-listview .cal-list-day{display:grid;grid-template-columns:100px minmax(0,1fr);gap:12px;min-width:0;padding:10px 0;border-bottom:1px solid #354052}
#calendar-panel #cal-listview .cal-list-day:last-child{border-bottom:0}
#calendar-panel #cal-listview .cal-list-day>h3{min-width:0;margin:0;padding:6px 0;color:#fff;font-size:14px;line-height:1.5;white-space:normal;overflow-wrap:anywhere}
#calendar-panel #cal-listview .cal-list-today>h3{color:#a0e8db;border-left:3px solid #88dccb;padding-left:6px}
#calendar-panel #cal-listview .cal-list-rows{display:block;min-width:0}
#calendar-panel #cal-listview .cal-event-compact{display:block;min-width:0;max-width:100%;margin:0;padding:0;border:0;border-bottom:1px solid #2a3441;border-radius:0;background:none;box-shadow:none}
#calendar-panel #cal-listview .cal-event-compact:last-child{border-bottom:0}
#calendar-panel #cal-listview .cal-event-compact>details{display:block;width:100%;min-width:0}
#calendar-panel #cal-listview .cal-event-compact summary{display:grid;grid-template-columns:26px minmax(0,1fr) 8px;align-items:start;gap:6px;min-width:0;min-height:44px;padding:6px;list-style:none;cursor:pointer;color:#fff}
#calendar-panel #cal-listview .cal-event-compact summary::-webkit-details-marker{display:none}
#calendar-panel #cal-listview .cal-event-compact summary::marker{content:''}
#calendar-panel #cal-listview .cal-event-compact summary::after{content:'';width:6px;height:6px;margin-top:6px;border-right:1.5px solid #fff;border-bottom:1.5px solid #fff;transform:rotate(45deg)}
#calendar-panel #cal-listview .cal-event-compact details[open]>summary::after{transform:rotate(225deg)}
#calendar-panel #cal-listview .cal-event-compact summary:focus-visible{outline:2px solid #b4a5d0;outline-offset:1px;border-radius:4px}
#calendar-panel #cal-listview .cal-icon{display:block;width:26px;height:26px;object-fit:contain}
#calendar-panel #cal-listview .cal-event-body{min-width:0;max-width:100%}
#calendar-panel #cal-listview .cal-event-heading{display:block;margin:0 0 2px}
#calendar-panel #cal-listview .cal-event-heading strong{display:block;color:#fff;font-size:14px;line-height:1.4}
#calendar-panel #cal-listview .cal-event-heading strong,
#calendar-panel #cal-listview .cal-range,
#calendar-panel #cal-listview .cal-countdown,
#calendar-panel #cal-listview .cal-local,
#calendar-panel #cal-listview .cal-utc{height:auto;max-height:none;white-space:normal;overflow:visible;overflow-wrap:anywhere;text-overflow:clip;-webkit-line-clamp:unset;line-clamp:unset}
#calendar-panel #cal-listview .cal-event-card .cal-range{display:block;margin:0;color:#fff;font-size:12px;line-height:1.4}
#calendar-panel #cal-listview .cal-event-card .cal-countdown{display:block;margin:2px 0 0;color:#a0e8db;font:12px/1.4 Consolas,monospace}
#calendar-panel #cal-listview .cal-event-card .cal-local,
#calendar-panel #cal-listview .cal-event-card .cal-utc{margin:0;padding:6px;color:#fff;font-size:12px;line-height:1.5}
#calendar-panel #cal-listview .cal-event-card .cal-local{border-top:1px solid #354052}
#calendar-panel #cal-listview .cal-event-card .cal-utc{padding-top:0}
#calendar-panel #cal-listview>.cal-empty{margin:6px 0;color:#fff}
@media(max-width:640px){
 #calendar-panel #cal-listview{padding:6px 8px}
 #calendar-panel #cal-listview .cal-list-day{grid-template-columns:minmax(0,1fr);gap:4px;padding:8px 0}
 #calendar-panel #cal-listview .cal-list-day>h3{padding-top:4px;padding-bottom:4px}
}

/* NO_VERDICT: unverified source-only spotlight/tooltip draft. Parent-reported missing-dimming RED was not independently run. No tools used; parent review and fresh execution required. */
#calendar-panel [data-event-id]{transition:opacity 150ms,filter 150ms,border-color 150ms}
#calendar-panel [data-event-id].cal-match{opacity:1;filter:brightness(1.15)}
#calendar-panel [data-event-id].cal-dim{opacity:.45;filter:none}
.cal-event-tooltip{position:fixed;z-index:10000;box-sizing:border-box;display:grid;gap:5px;width:max-content;max-width:calc(100vw - 16px);max-height:calc(100vh - 16px);overflow:auto;padding:10px 12px;border:1px solid #60738f;border-radius:8px;background:#102039;color:#fff;box-shadow:0 5px 18px #0008;font:13px/1.5 system-ui,sans-serif;white-space:normal;overflow-wrap:anywhere;pointer-events:none;opacity:1;transform:none;animation:none}
.cal-event-tooltip strong{display:block;font-weight:700}
.cal-event-tooltip span{display:block}
@media(prefers-reduced-motion:reduce){
 #calendar-panel [data-event-id],#calendar-panel [data-event-id] *,#calendar-panel [data-event-id]::before,#calendar-panel [data-event-id]::after,#calendar-panel [data-event-id] *::before,#calendar-panel [data-event-id] *::after,.cal-event-tooltip,.cal-event-tooltip *{transition-duration:0s!important;transition-delay:0s!important;animation:none!important}
}


/* NO_VERDICT: append-only unverified draft. Supplied Superpowers, debugging, TDD and verification workflows read. No execution claims. UI replacement path calendar-ui.js is an assumption requiring parent confirmation. */
#calendar-panel #cal-list-options[hidden],
#calendar-panel #cal-listview[hidden]{display:none!important}
#calendar-panel .cal-list-options{margin:0 0 12px;min-width:0;color:#fff;font-size:14px}
#calendar-panel .cal-list-options label{display:inline-flex;align-items:center;gap:8px;min-height:44px;cursor:pointer}
#calendar-panel .cal-list-options input{flex:none;width:18px;height:18px;accent-color:#a0d8cd}
#calendar-panel #cal-listview{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;align-items:start;padding:12px}
#calendar-panel #cal-listview .cal-list-day{display:grid;grid-template-columns:minmax(0,1fr);gap:8px;min-width:0;padding:0;border:0}
#calendar-panel #cal-listview .cal-list-day>h3{margin:0;padding:4px 0;min-width:0}
#calendar-panel #cal-listview .cal-list-today>h3{padding-left:6px}
#calendar-panel #cal-listview .cal-list-rows{display:grid;grid-template-columns:minmax(0,1fr);gap:8px;min-width:0}
#calendar-panel .cal-days .cal-event-card.cal-event-compact,
#calendar-panel #cal-listview .cal-event-card.cal-event-compact,
#calendar-panel #cal-listview .cal-event-card.cal-event-compact:last-child{box-sizing:border-box;display:flex;align-items:center;gap:8px;width:100%;min-width:0;max-width:100%;min-height:44px;height:auto;margin:0;padding:8px;border:1px solid color-mix(in srgb,var(--event-color) 55%,#35465e);border-left:3px solid var(--event-color);border-radius:10px;background:color-mix(in srgb,var(--event-color) 12%,#142030);box-shadow:none;overflow:visible}
#calendar-panel .cal-days .cal-event-card.cal-event-compact>.cal-icon,
#calendar-panel #cal-listview .cal-event-card.cal-event-compact>.cal-icon{display:block;flex:0 0 26px;width:26px;height:26px;object-fit:contain}
#calendar-panel .cal-days .cal-event-card.cal-event-compact>strong,
#calendar-panel #cal-listview .cal-event-card.cal-event-compact>strong{display:block;flex:1 1 0;min-width:0;max-width:100%;height:auto;max-height:none;margin:0;padding:0;color:#fff;font:700 14px/1.4 system-ui,sans-serif;white-space:normal;overflow:visible;overflow-wrap:anywhere;text-overflow:clip;-webkit-line-clamp:unset;line-clamp:unset}
#calendar-panel .cal-event-card.cal-event-compact:focus-visible{outline:2px solid #b4a5d0;outline-offset:2px}
@media(hover:hover) and (pointer:fine){
 #calendar-panel .cal-event-card.cal-event-compact:hover:not(.cal-dim){filter:brightness(1.15)}
}
#calendar-panel .cal-event-card.cal-event-compact.cal-match{opacity:1;filter:brightness(1.15)}
#calendar-panel .cal-event-card.cal-event-compact.cal-dim{opacity:.45;filter:none}
#calendar-panel #cal-listview>.cal-empty{grid-column:1 / -1}
@media(max-width:640px){
 #calendar-panel #cal-listview{grid-template-columns:minmax(0,1fr);gap:12px;padding:8px}
 #calendar-panel #cal-listview .cal-list-day{grid-template-columns:minmax(0,1fr);padding:0;gap:8px}
}
@media(prefers-reduced-motion:reduce){
 #calendar-panel .cal-event-card.cal-event-compact{transition:none!important;animation:none!important}
}


/* NO_VERDICT: unverified source-only append. No execution or RED/GREEN claimed.
   Supplied Superpowers/debugging/TDD/verification sources read.
   Parent review and fresh verification required; no repository files inspected. */
#calendar-panel #cal-listview{grid-template-columns:minmax(0,1fr)}
#calendar-panel #cal-listview .cal-list-day{width:100%;box-sizing:border-box;grid-template-columns:minmax(0,1fr)}
#calendar-panel #cal-listview .cal-list-rows{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}
#calendar-panel .cal-days .cal-event-card.cal-event-compact,
#calendar-panel #cal-listview .cal-event-card.cal-event-compact{align-items:flex-start}
#calendar-panel .cal-event-card.cal-event-compact>.cal-event-body{display:block;flex:1 1 0;min-width:0;max-width:100%}
#calendar-panel .cal-event-card.cal-event-compact>.cal-event-body>strong,
#calendar-panel .cal-event-card.cal-event-compact>.cal-event-body>p{display:block;width:auto;height:auto;max-height:none;margin:0;padding:0;white-space:normal;overflow:visible;overflow-wrap:anywhere;text-overflow:clip;-webkit-line-clamp:unset;line-clamp:unset}
#calendar-panel .cal-event-card.cal-event-compact>.cal-event-body>strong{color:#fff;font:700 14px/1.4 system-ui,sans-serif}
#calendar-panel .cal-event-card.cal-event-compact>.cal-event-body>.cal-range,
#calendar-panel .cal-event-card.cal-event-compact>.cal-event-body>.cal-utc{margin-top:3px;color:#fff;font:12px/1.5 system-ui,sans-serif;border:0}
#calendar-panel .cal-event-card.cal-event-compact>.cal-event-body>.cal-countdown{margin-top:4px;color:#a0e8db;font:12px/1.5 Consolas,monospace}
#calendar-panel .cal-list-options label.cal-switch{position:relative;box-sizing:border-box;display:inline-flex;align-items:center;gap:9px;min-height:44px;max-width:100%;padding:7px 12px;border:1px solid #35465e;border-radius:24px;background:#142030;color:#fff;cursor:pointer;line-height:1.4}
#calendar-panel .cal-list-options .cal-switch>input{position:absolute;width:1px;height:1px;min-width:0;min-height:0;padding:0;margin:-1px;border:0;clip:rect(0,0,0,0);clip-path:inset(50%);overflow:hidden;white-space:nowrap}
#calendar-panel .cal-switch-track{position:relative;display:block;flex:0 0 36px;width:36px;height:22px;border-radius:999px;background:#647080;transition:background-color 150ms}
#calendar-panel .cal-switch-track::before{content:'';position:absolute;left:3px;top:3px;width:16px;height:16px;border-radius:50%;background:#fff;box-shadow:0 1px 3px #0004;transition:transform 150ms}
#calendar-panel .cal-switch>input:checked+.cal-switch-track{background:#258c80}
#calendar-panel .cal-switch>input:checked+.cal-switch-track::before{transform:translateX(14px)}
#calendar-panel .cal-switch-state{flex:none;min-width:2em;color:#a0e8db;font-size:12px}
#calendar-panel .cal-list-options label.cal-switch:has(input:focus-visible){outline:2px solid #b4a5d0;outline-offset:3px}
@media(max-width:640px){
 #calendar-panel #cal-listview .cal-list-rows{grid-template-columns:minmax(0,1fr)}
}
@media(prefers-reduced-motion:reduce){
 #calendar-panel .cal-switch-track,#calendar-panel .cal-switch-track::before{transition:none!important}
}


/* NO_VERDICT: source-only append for calendar/calendar.css; no execution,
   RED/GREEN, build or layout verdict. Parent review and verification required.
   Paint-only surface changes: existing geometry and calendar behavior retained. */
#calendar-panel #cal-monthview,
#calendar-panel #cal-listview,
#calendar-panel .cal-days > section {
  background: linear-gradient(180deg, rgba(22,28,44,.92), rgba(13,17,28,.98));
  border-color: rgba(157,111,224,.35);
  border-radius: 16px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 8px 24px rgba(0,0,0,.30);
}

/* Nested day groups retain their borderless geometry; inset edges add depth. */
#calendar-panel #cal-listview .cal-list-day {
  background: linear-gradient(180deg, rgba(22,28,44,.64), rgba(13,17,28,.80));
  border-radius: 12px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06), inset 0 0 0 1px rgba(157,111,224,.18), 0 2px 6px rgba(0,0,0,.16);
}

/* Repeated card class intentionally outranks existing late card/state rules.
   Preserve event-colored borders, including the existing 3px left edge. */
#calendar-panel .cal-days .cal-event-card.cal-event-card.cal-event-compact,
#calendar-panel #cal-listview .cal-event-card.cal-event-card.cal-event-compact {
  background: linear-gradient(180deg, color-mix(in srgb, var(--event-color) 12%, #161c2c), color-mix(in srgb, var(--event-color) 8%, #0d111c));
  border-radius: 10px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 2px 6px rgba(0,0,0,.20);
  transition: background 150ms, box-shadow 150ms, filter 150ms;
}

/* Card emphasis is self-only and paint-only. Existing month-bar dimming,
   matching and tooltip rules are not changed. */
#calendar-panel .cal-days .cal-event-card.cal-event-card.cal-event-compact:focus-visible,
#calendar-panel #cal-listview .cal-event-card.cal-event-card.cal-event-compact:focus-visible {
  background: linear-gradient(180deg, color-mix(in srgb, var(--event-color) 16%, #1b2233), color-mix(in srgb, var(--event-color) 10%, #111725));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.09), 0 3px 9px rgba(0,0,0,.24);
}
@media (hover:hover) and (pointer:fine) {
  #calendar-panel .cal-days .cal-event-card.cal-event-card.cal-event-compact:hover:not(.cal-dim),
  #calendar-panel #cal-listview .cal-event-card.cal-event-card.cal-event-compact:hover:not(.cal-dim) {
    background: linear-gradient(180deg, color-mix(in srgb, var(--event-color) 16%, #1b2233), color-mix(in srgb, var(--event-color) 10%, #111725));
    box-shadow: inset 0 1px 0 rgba(255,255,255,.09), 0 3px 9px rgba(0,0,0,.24);
  }
}

/* Keep the switch's existing pill geometry, track, checked state and focus ring. */
#calendar-panel .cal-list-options label.cal-switch {
  background: linear-gradient(180deg, rgba(22,28,44,.92), rgba(13,17,28,.98));
  border-color: rgba(157,111,224,.35);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 3px 9px rgba(0,0,0,.20);
}

@media (prefers-reduced-motion:reduce) {
  #calendar-panel .cal-days .cal-event-card.cal-event-card.cal-event-compact,
  #calendar-panel #cal-listview .cal-event-card.cal-event-card.cal-event-compact {
    transition: none !important;
    animation: none !important;
  }
}

/* Append to calendar/calendar.css, not a new stylesheet.
 * NO_VERDICT: unverified source-only draft. No files inspected or changed,
 * no execution, no observed RED/GREEN, and no confirmed root cause.
 * Supplied Superpowers, systematic-debugging, TDD and verification read.
 * Parent must review the actual cascade, toolbar/clock selectors, date-target
 * geometry and today markers, then execute the regression and existing suite.
 * The supplied .cal-week already has min-height:0; compaction below changes
 * event-row padding, gaps, bar padding and label line-height instead.
 * Narrow !important only protects month bars from a possible shared button
 * minimum; confirm whether it is needed against the actual app styles.
 */
#calendar-panel #cal-monthview .cal-week {
  min-height: 0;
}

#calendar-panel #cal-monthview .cal-week-events {
  grid-auto-rows: auto;
  min-height: 0;
  padding: 32px 0 4px;
  gap: 2px 0;
}

#calendar-panel #cal-monthview .cal-event-bar {
  box-sizing: border-box;
  min-height: 30px;
  padding: 2px 6px;
  gap: 4px;
}

#calendar-panel #cal-monthview .cal-event-bar .cal-icon {
  flex: 0 0 20px;
  width: 20px;
  height: 20px;
}

#calendar-panel #cal-monthview .cal-event-bar .cal-bar-label,
#calendar-panel #cal-monthview .cal-event-bar[data-span="1"] .cal-bar-label {
  font-size: 14px;
  line-height: 1.25;
  height: auto;
  max-height: none;
  white-space: normal;
  overflow: visible;
  overflow-wrap: anywhere;
  text-overflow: clip;
  -webkit-line-clamp: unset;
  line-clamp: unset;
}

/* Keep existing font sizes, button targets, date overlays, today markers,
 * gradients, shadows, event colors and non-month layouts unchanged.
 * Toolbar/clock class names require confirmation from the actual UI source.
 */
#calendar-panel .cal-toolbar button,
#calendar-panel .cal-toolbar button *,
#calendar-panel .cal-toolbar #cal-clock,
#calendar-panel .cal-toolbar #cal-clock * {
  font-weight: 700;
}

#calendar-panel .cal-toolbar #cal-clock,
#calendar-panel .cal-toolbar #cal-clock * {
  color: #fff;
}

/* NO_VERDICT: source-only unverified draft; parent review and execution required.
   Supplied Superpowers, debugging, TDD and verification workflows read. */
#calendar-panel #cal-monthview,
#calendar-panel #cal-listview,
#calendar-panel .cal-days > section,
#calendar-panel .cal-toolbar,
#calendar-panel .rotation-dialog {
  background: linear-gradient(120deg,#142139e8,#0c1424ed);
  border-color: #30415b;
  border-radius: 16px;
  box-shadow: inset 0 1px 0 #ffffff08,0 12px 28px #0004;
}
#calendar-panel #cal-monthview .cal-weekdays {
  background: #19283f;
  border-color: #30415b;
}
#calendar-panel #cal-monthview .cal-week {
  background: #122037;
  border-color: #30415b;
}
#calendar-panel #cal-listview .cal-list-day {
  background: linear-gradient(155deg,#19294080,#0e192b80);
  box-shadow: inset 0 1px 0 #ffffff08,inset 0 0 0 1px #30415b80;
}
#calendar-panel .cal-days .cal-event-card.cal-event-card.cal-event-compact,
#calendar-panel #cal-listview .cal-event-card.cal-event-card.cal-event-compact {
  background: radial-gradient(ellipse at 50% 0%,color-mix(in srgb,var(--event-color) 14%,transparent),transparent 72%),linear-gradient(155deg,#17253d,#0b1424 80%);
}
#calendar-panel .cal-days .cal-event-card.cal-event-card.cal-event-compact:focus-visible,
#calendar-panel #cal-listview .cal-event-card.cal-event-card.cal-event-compact:focus-visible {
  background: radial-gradient(ellipse at 50% 0%,color-mix(in srgb,var(--event-color) 24%,transparent),transparent 72%),linear-gradient(155deg,#1c2d48,#101c30 80%);
}
@media (hover:hover) and (pointer:fine) {
  #calendar-panel .cal-days .cal-event-card.cal-event-card.cal-event-compact:hover:not(.cal-dim),
  #calendar-panel #cal-listview .cal-event-card.cal-event-card.cal-event-compact:hover:not(.cal-dim) {
    background: radial-gradient(ellipse at 50% 0%,color-mix(in srgb,var(--event-color) 24%,transparent),transparent 72%),linear-gradient(155deg,#1c2d48,#101c30 80%);
  }
}
#calendar-panel button:where(:not(.cal-day):not(.cal-event-bar):not(.cal-event-card)),
#calendar-panel select,
#calendar-panel .cal-toolbar :is(button,select),
#calendar-panel .cal-toolbar .cal-view button,
#calendar-panel .cal-toolbar #cal-today,
#calendar-panel .cal-days #cal-show-upcoming {
  color: #fff;
  background: #17253b;
  border-color: #3b506e;
}
#calendar-panel .cal-list-options label.cal-switch {
  background: linear-gradient(120deg,#142139e8,#0c1424ed);
  border-color: #30415b;
}
#calendar-panel button:where(:not(.cal-day):not(.cal-event-bar):not(.cal-event-card)):hover,
#calendar-panel select:hover,
#calendar-panel .cal-toolbar :is(button,select):hover,
#calendar-panel .cal-toolbar .cal-view button:hover,
#calendar-panel .cal-toolbar #cal-today:hover,
#calendar-panel .cal-days #cal-show-upcoming:hover {
  background: #21344f;
  border-color: #a78bfa;
}
#calendar-panel :focus-visible,
#calendar-panel .cal-toolbar :is(button,select):focus-visible,
#calendar-panel .cal-days .cal-event-compact summary:focus-visible {
  outline-color: #c4b5fd;
}
#calendar-panel .rotation-dialog { font: inherit; }
.rotation-dialog :is(button,select,input),
#calendar-panel .rotation-dialog :is(button,select,input) {
  font: inherit;
  color: #fff;
}
.rotation-dialog :is(button,select,input[type=date]),
#calendar-panel .rotation-dialog :is(button,select,input[type=date]) {
  background: #17253b;
  border-color: #3b506e;
  font-size: 14px;
  min-height: 44px;
}
.rotation-dialog .rotation-close,
#calendar-panel .rotation-dialog .rotation-close { font-size: 25px; line-height: 1; }
.rotation-dialog .rotation-option { background: #17253b; border-color: #3b506e; }
.rotation-dialog fieldset,
.rotation-dialog .rotation-list li { border-color: #30415b; }
.rotation-dialog :is(button,select,input[type=date]):hover,
#calendar-panel .rotation-dialog :is(button,select,input[type=date]):hover {
  background: #21344f;
  border-color: #a78bfa;
}
.rotation-dialog :is(button,select,input):focus-visible,
#calendar-panel .rotation-dialog :is(button,select,input):focus-visible,
.rotation-dialog .rotation-option:has(input:focus-visible) {
  outline: 2px solid #c4b5fd;
  outline-offset: 3px;
}
.rotation-dialog .rotation-primary,
.rotation-dialog .rotation-primary:is(:hover,:focus,:active),
#calendar-panel .rotation-dialog .rotation-controls button.rotation-primary,
#calendar-panel .rotation-dialog .rotation-controls button.rotation-primary:is(:hover,:focus,:active),
#calendar-panel .rotation-dialog .rotation-option:has(input:checked),
#calendar-panel .rotation-dialog .rotation-option:has(input:checked):is(:hover,:focus-within,:active) {
  color: #fff;
  background: linear-gradient(rgba(124,77,255,.38),rgba(76,29,149,.7)) #26153e;
  border-color: #a78bfa;
  box-shadow: 0 0 18px #8b5cf673,inset 0 1px 0 #ffffff59,inset 0 -2px 4px #0008;
}
/* Match the existing important selected-view declarations and state specificity. */
#calendar-panel .cal-toolbar .cal-view button[aria-pressed=true],
#calendar-panel .cal-toolbar .cal-view button[aria-pressed=true]:is(:hover,:focus,:active) {
  background: linear-gradient(rgba(124,77,255,.38),rgba(76,29,149,.7)) #26153e !important;
  border-color: #a78bfa !important;
  box-shadow: 0 0 18px #8b5cf673,inset 0 1px 0 #ffffff59,inset 0 -2px 4px #0008 !important;
}

#calendar-panel .cal-toolbar {
  border: 1px solid transparent;
  border-radius: 16px;
  background: linear-gradient(120deg, #142139, #0c1424) padding-box, linear-gradient(115deg, rgb(224,127,192), rgb(157,111,224), rgb(79,224,224)) border-box;
  animation: none;
}