.weekly-date-picker-hidden {
  position: absolute;
  width: 0;
  height: 0;
  opacity: 0;
  pointer-events: none;
  overflow: hidden;
}

.weekly-command-mic.stt-active svg {
  stroke: var(--brand-500, #168CA4);
}

/* Connecting / loading spinner — mirrors the .weekly-command-send.is-loading
   pattern. Hides the mic icon and paints a centred ring via ::after so the
   button keeps its perfect circle while the WebSocket negotiates. */
.weekly-command-mic {
  position: relative;
}

.weekly-command-mic.is-loading {
  cursor: progress;
}

.weekly-command-mic.is-loading svg {
  opacity: 0;
}

.weekly-command-mic.is-loading::after {
  content: "";
  position: absolute;
  width: 18px;
  height: 18px;
  border: 2.2px solid rgba(17, 24, 39, 0.18);
  border-top-color: var(--brand-500, #168CA4);
  border-radius: 999px;
  animation: weekly-spin 0.85s linear infinite;
}

@keyframes stt-spin {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

.weekly-sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.weekly-page {
  position: relative;
  z-index: 1;
}

.weekly-page-header {
  margin-bottom: 24px;
}

.weekly-page-actions {
  align-items: center;
}

.weekly-shell {
  display: grid;
  gap: 18px;
}

.weekly-command-card,
.weekly-toolbar,
.weekly-status-card,
.weekly-agenda-card,
.weekly-calendar-card {
  border: 1px solid rgba(17, 24, 39, 0.06);
  border-radius: 24px;
  background: rgba(255, 255, 255, 0.88);
  box-shadow: 0 18px 50px rgba(17, 24, 39, 0.07);
}

.weekly-command-card {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(360px, 1.1fr);
  gap: 24px;
  align-items: center;
  padding: 24px;
  background: linear-gradient(135deg, #ffffff 0%, #f1fbfd 100%);
  border-color: rgba(42, 159, 192, 0.16);
}

.weekly-kicker {
  margin: 0 0 6px;
  color: var(--brand-600, #0F7F97);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.08em;
  line-height: 1;
  text-transform: uppercase;
}

.weekly-command-card h2,
.weekly-card-header h2,
.weekly-week-nav h2 {
  margin: 0;
  color: var(--text-heading, #14213d);
  font-size: 20px;
  font-weight: 750;
  line-height: 1.25;
}

.weekly-command-card p,
.weekly-card-header p {
  margin: 8px 0 0;
  color: var(--text-muted, #6b7280);
  font-size: 14px;
  line-height: 1.5;
}

.weekly-command-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
}

.weekly-input,
.weekly-textarea {
  width: 100%;
  border: 1px solid var(--border-soft, #e5e7eb);
  border-radius: 16px;
  outline: none;
  background: rgba(255, 255, 255, 0.94);
  color: var(--text-main, #111827);
  font: inherit;
  font-size: 14px;
  font-weight: 600;
  transition: border-color 160ms ease, box-shadow 160ms ease, background 160ms ease;
}

.weekly-input {
  height: 48px;
  padding: 0 16px;
}

.weekly-textarea {
  min-height: 112px;
  padding: 14px 16px;
  resize: vertical;
}

.weekly-input:focus,
.weekly-textarea:focus {
  border-color: var(--brand-400, #1C9AB0);
  box-shadow: 0 0 0 4px rgba(42, 159, 192, 0.12);
}

.weekly-toolbar {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  align-items: center;
  padding: 16px 18px;
}

.weekly-week-nav {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 300px;
}

.weekly-toolbar-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 10px;
}

.weekly-view-toggle {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px;
  border: 1px solid rgba(17, 24, 39, 0.06);
  border-radius: 999px;
  background: rgba(248, 250, 252, 0.86);
}

.weekly-view-btn {
  height: 32px;
  padding: 0 10px;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: var(--text-muted, #6b7280);
  font: inherit;
  font-size: 13px;
  font-weight: 800;
  cursor: pointer;
  transition: background 160ms ease, color 160ms ease, box-shadow 160ms ease;
}

.weekly-view-btn:hover,
.weekly-view-btn.is-active {
  color: var(--brand-600, #0F7F97);
  background: #ffffff;
  box-shadow: 0 8px 20px rgba(17, 24, 39, 0.05);
}

.weekly-icon-btn {
  width: 42px;
  height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  border: 1px solid rgba(17, 24, 39, 0.08);
  border-radius: 999px;
  color: var(--text-muted, #6b7280);
  background: #ffffff;
  cursor: pointer;
  transition: background 160ms ease, border-color 160ms ease, color 160ms ease;
}

.weekly-icon-btn svg {
  width: 19px;
  height: 19px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.weekly-icon-btn:hover {
  color: var(--brand-600, #0F7F97);
  background: var(--brand-50, #e8f7fb);
  border-color: var(--border-brand, rgba(42, 159, 192, 0.28));
}

.weekly-filters {
  display: flex;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 8px;
}

.weekly-filter {
  height: 36px;
  padding: 0 13px;
  border: 1px solid var(--border-soft, #e5e7eb);
  border-radius: 999px;
  color: var(--text-muted, #6b7280);
  background: #ffffff;
  font: inherit;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
}

.weekly-filter:hover,
.weekly-filter.is-active {
  color: var(--brand-600, #0F7F97);
  background: var(--brand-50, #e8f7fb);
  border-color: var(--border-brand, rgba(42, 159, 192, 0.28));
}

.weekly-status-card {
  padding: 14px 18px;
  color: var(--brand-600, #0F7F97);
  background: var(--brand-50, #e8f7fb);
  border-color: rgba(42, 159, 192, 0.22);
  font-size: 14px;
  font-weight: 650;
}

.weekly-status-card.is-error {
  color: #b91c1c;
  background: #fee2e2;
  border-color: #fecaca;
}

/* ── File upload pill (shown when the "+" button picks a file) ─────────
   Visuals mirror the frontpage chat's .fp-chat-file-bar exactly so the
   experience is identical across the two surfaces. Pill sits ABOVE the
   command card. State-tinted: blue (idle), gray (reading), green (ready),
   red (error). */

.weekly-file-input-hidden {
  display: none;
}

.weekly-file-bar {
  display: none;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  margin: 0 0 12px;
  border-radius: 14px;
  background: rgba(232, 247, 251, 0.7);
  border: 1px solid rgba(42, 159, 192, 0.18);
  font-size: 13px;
  color: #0b6f96;
  flex-shrink: 0;
  transition: background 150ms, border-color 150ms, color 150ms;
}

.weekly-file-bar.is-visible {
  display: flex;
}

/* State: reading — muted background, spinner spinning */
.weekly-file-bar.is-reading {
  background: rgba(231, 236, 244, 0.85);
  border-color: rgba(75, 96, 120, 0.18);
  color: #475569;
}

/* State: ready — subtle green accent */
.weekly-file-bar.is-ready {
  background: rgba(220, 246, 232, 0.85);
  border-color: rgba(22, 163, 74, 0.22);
  color: #166534;
}

.weekly-file-bar.is-ready .weekly-file-bar-icon {
  background: rgba(22, 163, 74, 0.14);
}

.weekly-file-bar.is-ready .weekly-file-bar-icon svg {
  stroke: #16a34a;
}

/* State: error — red border + tint */
.weekly-file-bar.is-error {
  background: rgba(254, 226, 226, 0.7);
  border-color: rgba(220, 38, 38, 0.32);
  color: #b91c1c;
}

.weekly-file-bar.is-error .weekly-file-bar-icon {
  background: rgba(220, 38, 38, 0.12);
}

.weekly-file-bar.is-error .weekly-file-bar-icon svg {
  stroke: #dc2626;
}

.weekly-file-bar-icon {
  width: 36px;
  height: 36px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 10px;
  background: rgba(42, 159, 192, 0.1);
  flex-shrink: 0;
  transition: background 150ms;
}

.weekly-file-bar-icon svg {
  width: 18px;
  height: 18px;
  stroke: #0b8bbf;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
  fill: none;
  transition: stroke 150ms;
}

.weekly-file-bar-info {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.weekly-file-bar-name {
  font-weight: 700;
  font-size: 13px;
  color: inherit;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.weekly-file-bar-meta {
  font-weight: 500;
  font-size: 11px;
  letter-spacing: 0.01em;
  opacity: 0.82;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Spinner — only visible during 'reading'. The SVG inside spins. */
.weekly-file-bar-spinner {
  width: 18px;
  height: 18px;
  display: none;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.weekly-file-bar.is-reading .weekly-file-bar-spinner {
  display: inline-flex;
}

.weekly-file-bar-spinner svg {
  width: 18px;
  height: 18px;
  stroke: currentColor;
  stroke-width: 2.4;
  stroke-linecap: round;
  fill: none;
  animation: weekly-file-spin 0.9s linear infinite;
}

@keyframes weekly-file-spin {
  to { transform: rotate(360deg); }
}

.weekly-file-bar-remove {
  width: 28px;
  height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  border: 0;
  border-radius: 8px;
  cursor: pointer;
  color: #9eafc4;
  flex-shrink: 0;
  padding: 0;
  transition: color 150ms, background 150ms;
}

.weekly-file-bar-remove:hover,
.weekly-file-bar-remove:focus-visible {
  color: #475569;
  background: rgba(17, 24, 39, 0.06);
  outline: none;
}

.weekly-file-bar-remove svg {
  width: 14px;
  height: 14px;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
  fill: none;
}

.weekly-content-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 18px;
  align-items: start;
}

.weekly-agenda-card,
.weekly-calendar-card {
  overflow: hidden;
}

.weekly-calendar-card {
  order: 1;
}

.weekly-agenda-card {
  order: 2;
}

.weekly-card-header {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: flex-start;
  padding: 20px 22px 16px;
  border-bottom: 1px solid rgba(17, 24, 39, 0.06);
}

.weekly-calendar-header {
  align-items: center;
}

.weekly-count-badge {
  min-width: 34px;
  height: 30px;
  padding: 0 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  color: var(--brand-600, #0F7F97);
  background: var(--brand-50, #e8f7fb);
  font-size: 13px;
  font-weight: 800;
}

.weekly-link-button {
  border: 0;
  background: transparent;
  color: var(--brand-600, #0F7F97);
  font: inherit;
  font-size: 13px;
  font-weight: 800;
  cursor: pointer;
}

.weekly-agenda-list {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  padding: 16px;
}

.weekly-agenda-empty,
.weekly-day-empty {
  color: var(--text-muted, #6b7280);
  font-size: 14px;
  line-height: 1.45;
}

.weekly-agenda-empty {
  padding: 16px;
  border: 1px dashed rgba(42, 159, 192, 0.24);
  border-radius: 18px;
  background: rgba(232, 247, 251, 0.32);
}

.weekly-agenda-item {
  width: 100%;
  display: grid;
  grid-template-columns: 4px minmax(0, 1fr);
  gap: 12px;
  padding: 12px;
  border: 1px solid rgba(17, 24, 39, 0.07);
  border-radius: 16px;
  background: #ffffff;
  color: inherit;
  text-align: left;
  cursor: pointer;
}

.weekly-agenda-item::before {
  content: "";
  width: 4px;
  border-radius: 999px;
  background: var(--event-color, var(--brand-400, #1C9AB0));
}

.weekly-agenda-item strong {
  display: block;
  color: var(--text-heading, #14213d);
  font-size: 14px;
  line-height: 1.25;
}

.weekly-agenda-item span {
  display: block;
  margin-top: 4px;
  color: var(--text-muted, #6b7280);
  font-size: 12px;
  font-weight: 650;
}

.weekly-days--week {
  display: grid;
  grid-template-columns: repeat(7, minmax(128px, 1fr));
  min-height: 520px;
  overflow-x: auto;
}

.weekly-days--month {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  min-height: 680px;
  overflow: hidden;
  background: rgba(255, 255, 255, 0.72);
}

.weekly-day {
  min-width: 128px;
  display: flex;
  flex-direction: column;
  border-right: 1px solid rgba(17, 24, 39, 0.06);
  background: rgba(255, 255, 255, 0.74);
}

.weekly-day:last-child {
  border-right: 0;
}

.weekly-day.is-today {
  background: linear-gradient(180deg, rgba(232, 247, 251, 0.72), rgba(255, 255, 255, 0.82));
}

.weekly-day-header {
  padding: 15px 14px;
  border-bottom: 1px solid rgba(17, 24, 39, 0.06);
}

.weekly-day-header strong {
  display: block;
  color: var(--text-heading, #14213d);
  font-size: 14px;
}

.weekly-day-header span {
  display: block;
  margin-top: 3px;
  color: var(--text-muted, #6b7280);
  font-size: 12px;
  font-weight: 700;
}

.weekly-day-events {
  display: grid;
  gap: 10px;
  align-content: start;
  padding: 12px;
  flex: 1;
}

.weekly-event-card {
  padding: 10px;
  border: 1px solid rgba(17, 24, 39, 0.07);
  border-left: 4px solid var(--event-color, var(--brand-400, #1C9AB0));
  border-radius: 14px;
  background: #ffffff;
  box-shadow: 0 8px 18px rgba(17, 24, 39, 0.04);
  color: inherit;
  text-align: left;
  cursor: pointer;
  min-width: 0;
  overflow: hidden;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.weekly-event-card strong {
  display: block;
  color: var(--text-heading, #14213d);
  font-size: 13px;
  line-height: 1.25;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.weekly-event-card span {
  display: block;
  margin-top: 5px;
  color: var(--text-muted, #6b7280);
  font-size: 11px;
  font-weight: 700;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.weekly-event-chip {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  margin-top: 7px;
  padding: 4px 8px;
  border-radius: 999px;
  color: var(--brand-600, #0F7F97);
  background: var(--brand-50, #e8f7fb);
  font-size: 11px;
  font-weight: 800;
}

.weekly-month-weekday {
  padding: 14px 12px;
  border-right: 1px solid rgba(17, 24, 39, 0.06);
  border-bottom: 1px solid rgba(17, 24, 39, 0.06);
  color: var(--text-muted, #6b7280);
  background: rgba(248, 250, 252, 0.78);
  font-size: 12px;
  font-weight: 850;
  letter-spacing: 0.06em;
  text-align: center;
  text-transform: uppercase;
}

.weekly-month-weekday:nth-child(7n) {
  border-right: 0;
}

.weekly-month-day {
  min-height: 104px;
  padding: 10px;
  border-right: 1px solid rgba(17, 24, 39, 0.06);
  border-bottom: 1px solid rgba(17, 24, 39, 0.06);
  background: rgba(255, 255, 255, 0.72);
  transition: background 160ms ease;
  cursor: pointer;
}

.weekly-month-day:nth-child(7n) {
  border-right: 0;
}

.weekly-month-day:nth-last-child(-n+7) {
  border-bottom: 0;
}

.weekly-month-day.is-muted {
  background: rgba(248, 250, 252, 0.58);
}

.weekly-month-day.is-today {
  background: linear-gradient(180deg, rgba(232, 247, 251, 0.82), rgba(255, 255, 255, 0.78));
  box-shadow: inset 0 0 0 1px rgba(42, 159, 192, 0.22);
}

.weekly-month-day-header {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  margin-bottom: 8px;
}

.weekly-month-day-number {
  width: 30px;
  height: 30px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid transparent;
  border-radius: 999px;
  background: transparent;
  color: var(--text-heading, #14213d);
  font: inherit;
  font-size: 13px;
  font-weight: 850;
  cursor: pointer;
}

.weekly-month-day-number:hover {
  color: var(--brand-600, #0F7F97);
  background: var(--brand-50, #e8f7fb);
  border-color: var(--border-brand, rgba(42, 159, 192, 0.28));
}

.weekly-month-day.is-muted .weekly-month-day-number {
  color: #a4adbb;
}

.weekly-month-day.is-today .weekly-month-day-number {
  color: #ffffff;
  background: linear-gradient(180deg, var(--brand-400, #1C9AB0), var(--brand-500, #168CA4));
  box-shadow: 0 10px 22px rgba(42, 159, 192, 0.22);
}

.weekly-month-events {
  display: grid;
  gap: 6px;
  align-content: start;
}

.weekly-month-event {
  min-width: 0;
  height: 28px;
  display: grid;
  grid-template-columns: 7px auto minmax(0, 1fr);
  gap: 6px;
  align-items: center;
  padding: 0 8px;
  border: 1px solid rgba(17, 24, 39, 0.06);
  border-radius: 999px;
  background: #ffffff;
  color: var(--text-heading, #14213d);
  font: inherit;
  font-size: 12px;
  font-weight: 750;
  text-align: left;
  cursor: pointer;
  box-shadow: 0 8px 18px rgba(17, 24, 39, 0.035);
}

.weekly-month-event:hover {
  border-color: rgba(42, 159, 192, 0.28);
  background: var(--brand-50, #e8f7fb);
}

.weekly-month-event-dot {
  width: 7px;
  height: 7px;
  border-radius: 999px;
  background: var(--event-color, var(--brand-400, #1C9AB0));
}

.weekly-month-event-time {
  color: var(--text-muted, #6b7280);
  font-size: 11px;
  font-weight: 850;
}

.weekly-month-event-title {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.weekly-month-more {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  padding: 2px 8px;
  border: none;
  border-radius: 999px;
  color: var(--brand-600, #0F7F97);
  background: var(--brand-50, #e8f7fb);
  font-size: 11px;
  font-weight: 850;
  font-family: inherit;
  cursor: pointer;
  transition: background 0.15s, color 0.15s;
}

.weekly-month-more:hover,
.weekly-month-more:focus-visible {
  background: var(--brand-100, #cdebf5);
  color: var(--brand-700, #0f5366);
  outline: none;
}

.weekly-more-popover {
  position: fixed;
  z-index: 100;
  min-width: 220px;
  max-width: 320px;
  max-height: 60vh;
  background: #ffffff;
  border: 1px solid rgba(15, 23, 42, 0.08);
  border-radius: 14px;
  box-shadow: 0 12px 36px rgba(15, 23, 42, 0.18), 0 2px 8px rgba(15, 23, 42, 0.08);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  animation: weekly-more-popover-in 120ms ease-out;
}

@keyframes weekly-more-popover-in {
  from { opacity: 0; transform: translateY(-4px); }
  to   { opacity: 1; transform: translateY(0); }
}

.weekly-more-popover-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 10px 12px;
  border-bottom: 1px solid rgba(15, 23, 42, 0.06);
}

.weekly-more-popover-title {
  font-size: 13px;
  font-weight: 700;
  color: var(--brand-700, #0f5366);
  text-transform: capitalize;
}

.weekly-more-popover-close {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  padding: 0;
  background: transparent;
  border: none;
  border-radius: 6px;
  color: rgb(107, 114, 128);
  cursor: pointer;
  transition: background 0.15s, color 0.15s;
}

.weekly-more-popover-close:hover {
  background: rgba(15, 23, 42, 0.05);
  color: rgb(31, 41, 55);
}

.weekly-more-popover-list {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 8px;
  overflow-y: auto;
}

.weekly-more-popover-list .weekly-month-event {
  width: 100%;
}

.weekly-drawer-backdrop {
  position: fixed;
  inset: 0;
  z-index: 90;
  background: rgba(17, 24, 39, 0.32);
  backdrop-filter: blur(8px);
}

.weekly-drawer {
  position: fixed;
  top: 16px;
  right: 16px;
  z-index: 100;
  width: min(520px, calc(100vw - 32px));
  max-height: calc(100vh - 32px);
  overflow-y: auto;
  border: 1px solid rgba(17, 24, 39, 0.08);
  border-radius: 28px;
  background: #ffffff;
  box-shadow: 0 28px 80px rgba(17, 24, 39, 0.2);
}

.weekly-drawer[hidden],
.weekly-drawer-backdrop[hidden] {
  display: none;
}

.weekly-drawer-close {
  position: absolute;
  top: 18px;
  right: 18px;
  width: 42px;
  height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(17, 24, 39, 0.08);
  border-radius: 999px;
  color: var(--text-muted, #6b7280);
  background: #ffffff;
  cursor: pointer;
}

.weekly-drawer-close svg {
  width: 19px;
  height: 19px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.weekly-drawer-header {
  padding: 28px 76px 18px 28px;
  border-bottom: 1px solid rgba(17, 24, 39, 0.06);
  background: linear-gradient(180deg, #ffffff 0%, #f8fbfc 100%);
}

.weekly-drawer-header h2 {
  margin: 0;
  color: var(--text-heading, #14213d);
  font-size: 28px;
  font-weight: 750;
  line-height: 1.15;
}

.weekly-drawer-header p:last-child {
  margin: 8px 0 0;
  color: var(--text-muted, #6b7280);
  font-size: 14px;
  line-height: 1.45;
}

.weekly-form {
  display: grid;
  gap: 16px;
  padding: 24px 28px 28px;
}

/* Source notice — surfaces above the form when the user opens a deadline
   that's actually backed by a saved_jobs row (virtual event). Soft amber
   tint so it reads as "info, not error". Hidden by default; openDrawer()
   toggles via the [hidden] attribute. */
.weekly-source-notice {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 12px 14px;
  border: 1px solid rgba(217, 119, 6, 0.22);
  border-radius: 14px;
  background: rgba(255, 246, 227, 0.72);
  color: #8a4b00;
}

.weekly-source-notice[hidden] {
  display: none;
}

.weekly-source-notice svg {
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  margin-top: 2px;
  color: #b45309;
}

.weekly-source-notice-text {
  margin: 0 0 4px;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.35;
  color: inherit;
}

.weekly-source-notice-link {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 13px;
  font-weight: 700;
  color: #b45309;
  text-decoration: underline;
}

.weekly-source-notice-link:hover,
.weekly-source-notice-link:focus-visible {
  color: #8a4b00;
}

/* Read-only mode — applied to .weekly-form when the open event is a virtual
   deadline. Form is left visually intact so the user can still review the
   detail, but disabled inputs make it obvious nothing can be changed here. */
.weekly-form.is-readonly :is(input, select, textarea):disabled {
  opacity: 0.72;
  cursor: not-allowed;
  background: rgba(245, 247, 250, 0.7);
}

.weekly-form.is-readonly .weekly-checkbox {
  opacity: 0.72;
  cursor: not-allowed;
}

.weekly-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.weekly-time-grid {
  grid-template-columns: 1fr 1fr auto;
  align-items: end;
}

.weekly-field label,
.weekly-checkbox {
  color: #536176;
  font-size: 13px;
  font-weight: 750;
}

.weekly-field label {
  display: block;
  margin-bottom: 7px;
}

.weekly-checkbox {
  min-height: 48px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 0 12px;
  border: 1px solid var(--border-soft, #e5e7eb);
  border-radius: 16px;
  background: #ffffff;
}

.weekly-drawer-message {
  display: none;
  padding: 12px 14px;
  border-radius: 14px;
  font-size: 13px;
  font-weight: 700;
}

.weekly-drawer-message.is-error,
.weekly-drawer-message.is-success {
  display: block;
}

.weekly-drawer-message.is-error {
  color: #b91c1c;
  background: #fee2e2;
}

.weekly-drawer-message.is-success {
  color: var(--brand-600, #0F7F97);
  background: var(--brand-50, #e8f7fb);
}

.weekly-drawer-actions {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  align-items: center;
  padding-top: 4px;
}

.weekly-drawer-actions > div {
  display: flex;
  gap: 10px;
  align-items: center;
}

@media (max-width: 1100px) {
  .weekly-command-card {
    grid-template-columns: 1fr;
  }

  .weekly-toolbar {
    align-items: flex-start;
    flex-direction: column;
  }

  .weekly-filters {
    justify-content: flex-start;
  }

  .weekly-toolbar-actions {
    justify-content: flex-start;
  }

  .weekly-agenda-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  .weekly-command-card {
    padding: 18px;
  }

  .weekly-command-form,
  .weekly-form-grid,
  .weekly-time-grid {
    grid-template-columns: 1fr;
  }

  .weekly-agenda-list {
    grid-template-columns: 1fr;
  }

  .weekly-calendar-card {
    overflow-x: auto;
  }

  .weekly-days--week {
    grid-template-columns: repeat(7, minmax(180px, 1fr));
  }

  .weekly-days--month {
    /* Scroll the month grid itself horizontally (same pattern as
       .weekly-days--week above): no min-width so the grid stays the card's
       width, and its 7 min-122px columns overflow -> the grid scrolls, without
       dragging the toolbar. Previously min-width:860px relied on the card
       scrolling, which did not move on mobile. */
    overflow-x: auto;
    grid-template-columns: repeat(7, minmax(122px, 1fr));
  }

  .weekly-drawer {
    inset: auto 8px 8px;
    top: 8px;
    width: auto;
    max-height: calc(100vh - 16px);
  }

  .weekly-drawer-actions,
  .weekly-drawer-actions > div {
    align-items: stretch;
    flex-direction: column;
  }
}

/* Reference-style weekly schedule */
.weekly-page {
  max-width: 1420px;
  margin: 0 auto;
}

.weekly-page-header {
  margin-bottom: 22px;
}

.weekly-page-header .app-page-title {
  font-family: var(--font-body, 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif);
  font-size: clamp(46px, 4.4vw, 58px);
  line-height: 1.02;
  font-weight: 500;
  letter-spacing: 0;
}

.weekly-page-header .app-page-subtitle {
  max-width: 680px;
  margin-top: 12px;
  font-size: 16px;
}

.weekly-shell {
  gap: 20px;
}

.weekly-command-card {
  display: block;
  padding: 16px;
  border-radius: 22px;
  background: rgba(255, 255, 255, 0.82);
  border-color: rgba(17, 24, 39, 0.08);
  box-shadow: 0 18px 50px rgba(17, 24, 39, 0.06);
}

.weekly-command-form {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) 38px 52px;
  gap: 12px;
  align-items: center;
}

.weekly-command-card .weekly-input {
  height: 72px;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
  font-size: 16px;
  font-weight: 500;
}

.weekly-command-card .weekly-input:focus {
  box-shadow: none;
}

.weekly-command-add,
.weekly-command-mic,
.weekly-command-send,
.weekly-new-event-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(17, 24, 39, 0.08);
  background: #ffffff;
  color: var(--brand-600, #0F7F97);
  cursor: pointer;
  transition: transform 160ms ease, background 160ms ease, border-color 160ms ease, color 160ms ease;
}

.weekly-command-add {
  width: 44px;
  height: 44px;
  border-radius: 999px;
  color: #6b7280;
  box-shadow: 0 10px 24px rgba(17, 24, 39, 0.06);
}

.weekly-command-mic {
  width: 40px;
  height: 40px;
  border: 1px solid transparent;
  border-radius: 999px;
  background: transparent;
  color: #6b7280;
}

.weekly-command-send {
  width: 52px;
  height: 52px;
  border: 0;
  border-radius: 999px;
  color: #ffffff;
  background: linear-gradient(180deg, var(--brand-400, #1C9AB0), var(--brand-600, #0F7F97));
  box-shadow: 0 16px 34px rgba(42, 159, 192, 0.28);
}

.weekly-command-add svg,
.weekly-command-mic svg,
.weekly-command-send svg,
.weekly-new-event-btn svg,
.weekly-date-range svg {
  width: 20px;
  height: 20px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.weekly-command-add:hover,
.weekly-command-mic:hover {
  color: var(--brand-600, #0F7F97);
  background: var(--brand-50, #e8f7fb);
  border-color: var(--border-brand, rgba(42, 159, 192, 0.28));
}

.weekly-command-send:hover,
.weekly-new-event-btn:hover {
  transform: translateY(-1px);
}

/* Loading state for the round send button. setButtonLoading toggles
   .is-loading; we hide the send arrow and paint a spinning ring via
   ::after so the button keeps its perfect circle shape (previously the
   "Analyzing..." text replaced the SVG and spilled outside the circle). */
.weekly-command-send.is-loading {
  cursor: progress;
  transform: none;
}

.weekly-command-send.is-loading svg {
  opacity: 0;
}

.weekly-command-send.is-loading::after {
  content: "";
  position: absolute;
  width: 20px;
  height: 20px;
  border: 2.4px solid rgba(255, 255, 255, 0.32);
  border-top-color: #ffffff;
  border-radius: 999px;
  animation: weekly-spin 0.85s linear infinite;
}

@keyframes weekly-spin {
  to { transform: rotate(360deg); }
}

/* The button needs an explicit positioning context for the absolute
   spinner to centre on it. Adding .is-loading triggers it; the base
   :inline-flex layout the original rules establish keeps the SVG centred
   when not loading. */
.weekly-command-send {
  position: relative;
}

/* Kill Chrome / Edge autofill + saved-suggestion blue background tint.
   The composer input sits on a transparent background (so the card behind
   shows through). Without this, Chrome paints a 1000px box-shadow tint
   that bleeds into the empty width of the input — visible as the light
   blue rectangle stretching from the typed text to the mic icon. */
.weekly-command-card .weekly-input:-webkit-autofill,
.weekly-command-card .weekly-input:-webkit-autofill:hover,
.weekly-command-card .weekly-input:-webkit-autofill:focus,
.weekly-command-card .weekly-input:-webkit-autofill:active {
  -webkit-text-fill-color: var(--text-heading, #14213d);
  -webkit-box-shadow: 0 0 0 1000px transparent inset !important;
  caret-color: var(--text-heading, #14213d);
  transition: background-color 5000s ease-in-out 0s;
}

.weekly-toolbar {
  padding: 6px 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  gap: 12px;
}

.weekly-toolbar-actions {
  flex-wrap: nowrap;
  gap: 8px;
}

.weekly-toolbar-left {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}

.weekly-week-nav {
  min-width: 0;
  gap: 8px;
}

.weekly-week-pill,
.weekly-date-range {
  height: 42px;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  border: 1px solid rgba(17, 24, 39, 0.08);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.9);
  color: var(--text-heading, #14213d);
  font-size: 14px;
  font-weight: 750;
}

.weekly-week-pill {
  padding: 0 16px;
}

.weekly-date-range {
  padding: 0 14px;
  cursor: pointer;
}

.weekly-date-chevron {
  width: 16px !important;
  height: 16px !important;
}

.weekly-view-toggle {
  order: 2;
}

.weekly-filters {
  order: 1;
}

.weekly-new-event-btn {
  order: 3;
  height: 44px;
  gap: 8px;
  padding: 0 14px;
  border-radius: 14px;
  color: var(--brand-600, #0F7F97);
  font: inherit;
  font-size: 14px;
  font-weight: 800;
}

.weekly-filter {
  position: relative;
  height: 36px;
  padding: 0 11px;
  border-radius: 14px;
  font-weight: 650;
}

.weekly-filter:not([data-filter="all"]) {
  padding-left: 22px;
}

.weekly-filter:not([data-filter="all"])::before {
  content: "";
  position: absolute;
  left: 11px;
  top: 50%;
  width: 6px;
  height: 6px;
  border-radius: 999px;
  background: var(--brand-400, #1C9AB0);
  transform: translateY(-50%);
}

.weekly-filter[data-filter="deadline"]::before {
  background: #f97316;
}

.weekly-filter[data-filter="follow_up"]::before {
  background: #16a34a;
}

.weekly-filter[data-filter="personal"]::before {
  background: #3b82f6;
}

.weekly-content-grid {
  grid-template-columns: minmax(0, 1fr) 292px;
  gap: 22px;
}

.weekly-calendar-card {
  order: 1;
  border-radius: 22px;
}

.weekly-agenda-card {
  order: 2;
  border-radius: 22px;
}

.weekly-calendar-card > .weekly-card-header {
  display: none;
}

.weekly-ai-card .weekly-card-header {
  display: block;
  padding: 24px 22px 10px;
  border-bottom: 0;
}

.weekly-ai-card .weekly-count-badge {
  display: none;
}

.weekly-ai-card .weekly-card-header h2 {
  margin-top: 2px;
  font-size: 18px;
}

.weekly-agenda-list {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
  padding: 14px 18px 18px;
}

.weekly-insight-item {
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr);
  gap: 12px;
  align-items: start;
  padding: 16px;
  border: 1px solid rgba(17, 24, 39, 0.07);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.78);
}

.weekly-insight-icon {
  width: 34px;
  height: 34px;
  border-radius: 12px;
  background: var(--brand-50, #e8f7fb);
}

.weekly-insight-item.is-deadline .weekly-insight-icon {
  background: #fff3e8;
}

.weekly-insight-item.is-follow_up .weekly-insight-icon {
  background: #e8f8ef;
}

.weekly-insight-item strong {
  display: block;
  color: var(--text-heading, #14213d);
  font-size: 14px;
  line-height: 1.35;
}

.weekly-insight-item span span {
  display: block;
  margin-top: 8px;
  color: var(--text-muted, #6b7280);
  font-size: 13px;
  line-height: 1.45;
}

.weekly-insights-button {
  width: calc(100% - 36px);
  height: 44px;
  margin: 10px 18px 20px;
  border: 1px solid var(--border-brand, rgba(42, 159, 192, 0.28));
  border-radius: 14px;
  background: #ffffff;
  color: var(--brand-600, #0F7F97);
  font: inherit;
  font-size: 14px;
  font-weight: 800;
  cursor: pointer;
}

.weekly-days--timegrid {
  display: block;
  min-height: 0;
  overflow-x: auto;
  background: rgba(255, 255, 255, 0.76);
}

.weekly-timegrid {
  min-width: 0;
  display: grid;
  grid-template-columns: 58px repeat(7, minmax(92px, 1fr));
  /* 24-hour grid: ~30px per hour = 720px total body height. */
  grid-template-rows: 70px 720px;
}

.weekly-timegrid-corner,
.weekly-timegrid-day-header {
  border-bottom: 1px solid rgba(17, 24, 39, 0.07);
  background: rgba(255, 255, 255, 0.82);
}

.weekly-timegrid-day-header {
  display: grid;
  place-items: center;
  align-content: center;
  gap: 5px;
  border-left: 1px solid rgba(17, 24, 39, 0.055);
}

.weekly-timegrid-day-header strong {
  color: var(--text-heading, #14213d);
  font-size: 15px;
  line-height: 1;
}

.weekly-timegrid-day-header span {
  color: var(--text-muted, #6b7280);
  font-size: 12px;
  font-weight: 700;
}

.weekly-timegrid-day-header.is-today strong {
  color: var(--brand-600, #0F7F97);
}

.weekly-time-axis {
  display: grid;
  /* 12 axis labels — one every 2 hours (00, 02, 04, … 22). Each label
     spans two of the underlying 24 hourly slot rows so events still land
     at their exact hour but the axis stays readable. */
  grid-template-rows: repeat(12, 1fr);
  padding-top: 2px;
  border-right: 1px solid rgba(17, 24, 39, 0.055);
  color: var(--text-muted, #6b7280);
  font-size: 12px;
  font-weight: 700;
}

.weekly-time-axis span {
  padding: 9px 10px 0 0;
  text-align: right;
}

.weekly-time-day {
  position: relative;
  display: grid;
  /* One row per hour so the slot guides align with the axis labels. */
  grid-template-rows: repeat(24, 1fr);
  min-height: 720px;
  border-left: 1px solid rgba(17, 24, 39, 0.055);
  background: rgba(255, 255, 255, 0.7);
}

.weekly-time-day.is-today {
  background: rgba(232, 247, 251, 0.22);
}

.weekly-time-slot {
  border-bottom: 1px solid rgba(17, 24, 39, 0.055);
}

.weekly-time-slot:last-child {
  border-bottom: 0;
}

/* All week-view events render as a compact horizontal pill — visually
   matching .weekly-month-event from the month view. The category colour is
   carried by the dot rather than a left border. `top: var(--event-top)` is
   preserved so the pill still floats at its start-time slot in the hour
   grid; `--event-height` is intentionally ignored since the pill has a
   fixed 28px height regardless of duration. */
.weekly-time-event {
  position: absolute;
  top: var(--event-top);
  left: 10px;
  right: 10px;
  height: 28px;
  min-height: 28px;
  max-height: 28px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 0 12px;
  border: 1px solid rgba(17, 24, 39, 0.06);
  border-radius: 999px;
  background: #ffffff;
  color: var(--text-heading, #14213d);
  font: inherit;
  font-size: 12px;
  font-weight: 750;
  text-align: left;
  cursor: pointer;
  box-shadow: 0 6px 14px rgba(17, 24, 39, 0.05);
  overflow: hidden;
}

.weekly-time-event:hover {
  border-color: rgba(42, 159, 192, 0.28);
  background: var(--brand-50, #e8f7fb);
}

.weekly-time-event-icon {
  width: 7px;
  height: 7px;
  margin-top: 0;
  border-radius: 999px;
  background: var(--event-color, var(--brand-400, #1C9AB0));
  opacity: 1;
  flex-shrink: 0;
}

.weekly-time-event-body {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  flex: 1;
}

.weekly-time-event-body > span {
  margin: 0;
  color: var(--text-muted, #6b7280);
  font-size: 11px;
  font-weight: 850;
  white-space: nowrap;
}

.weekly-time-event strong {
  margin: 0;
  min-width: 0;
  overflow: hidden;
  color: var(--text-heading, #14213d);
  font-size: 12px;
  font-weight: 750;
  line-height: 1;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Full detail (description / company / category) lives in the drawer.
   Keeping the pill single-line matches the month version. */
.weekly-time-event small {
  display: none;
}

/* Inline "+N …" indicator rendered inside the event pill when extra events
   share the same hour bucket. Lives inside the chip (next to the title) so
   it never overlaps the chip in the following hour. */
.weekly-time-event-more {
  display: inline-flex;
  align-items: center;
  flex-shrink: 0;
  margin-left: auto;
  padding: 2px 8px;
  border-radius: 999px;
  background: rgba(17, 24, 39, 0.06);
  color: var(--text-muted, #6b7280);
  font-size: 11px;
  font-weight: 700;
  line-height: 1;
  white-space: nowrap;
  cursor: pointer;
  transition: background-color 0.15s ease, color 0.15s ease;
}

.weekly-time-event-more:hover {
  background: var(--brand-50, #e8f7fb);
  color: var(--brand-600, #0F7F97);
}

@media (max-width: 1200px) {
  .weekly-content-grid {
    grid-template-columns: 1fr;
  }

  .weekly-ai-card {
    max-width: none;
  }
}

@media (max-width: 760px) {
  .weekly-page-header .app-page-title {
    font-size: 42px;
  }

  .weekly-command-form {
    grid-template-columns: 40px minmax(0, 1fr) 36px 46px;
  }

  .weekly-command-card .weekly-input {
    height: 58px;
    font-size: 14px;
  }

  .weekly-toolbar-left,
  .weekly-toolbar-actions {
    width: 100%;
  }

  .weekly-date-range {
    flex: 1;
  }
}

/* Quiet visual-system tuning for the schedule page */
.weekly-page {
  --week-soft-line: rgba(17, 24, 39, 0.055);
  --week-surface: rgba(255, 255, 255, 0.86);
  --week-shadow: 0 18px 50px rgba(17, 24, 39, 0.055);
}

.weekly-page-header .app-page-title {
  font-weight: 500;
}

.weekly-page-header .app-page-subtitle {
  color: var(--text-muted, #6b7280);
  font-weight: 400;
}

.weekly-kicker,
.weekly-command-card h2,
.weekly-card-header h2,
.weekly-week-nav h2,
.weekly-view-btn,
.weekly-filter,
.weekly-week-pill,
.weekly-date-range,
.weekly-new-event-btn,
.weekly-insights-button {
  font-weight: 650;
}

.weekly-command-card {
  width: calc(100% - 314px);
  max-width: 920px;
  min-height: 76px;
  padding: 0 16px;
  display: flex;
  align-items: center;
  background: var(--week-surface);
  border-color: rgba(17, 24, 39, 0.075);
  box-shadow: var(--week-shadow);
}

.weekly-command-form {
  width: 100%;
}

.weekly-command-card .weekly-input {
  height: 74px;
  color: var(--text-heading, #14213d);
  font-size: 15px;
  font-weight: 400;
}

.weekly-command-card .weekly-input::placeholder {
  color: var(--text-soft, #9ca3af);
}

.weekly-command-add {
  color: #6b7280;
  box-shadow: 0 8px 20px rgba(17, 24, 39, 0.045);
}

.weekly-command-send {
  width: 48px;
  height: 48px;
  box-shadow: 0 12px 28px rgba(42, 159, 192, 0.22);
}

.weekly-toolbar {
  margin-top: 2px;
}

.weekly-icon-btn,
.weekly-week-pill,
.weekly-date-range,
.weekly-filter,
.weekly-view-toggle,
.weekly-new-event-btn {
  border-color: rgba(17, 24, 39, 0.075);
  background: rgba(255, 255, 255, 0.86);
  box-shadow: none;
}

.weekly-filter,
.weekly-view-btn,
.weekly-date-range,
.weekly-week-pill {
  color: #596579;
  font-size: 13px;
}

.weekly-filter.is-active,
.weekly-view-btn.is-active {
  color: var(--brand-600, #0F7F97);
  background: var(--brand-50, #e8f7fb);
  border-color: rgba(42, 159, 192, 0.28);
}

.weekly-new-event-btn {
  color: var(--brand-600, #0F7F97);
  font-size: 14px;
}

.weekly-calendar-card,
.weekly-ai-card {
  background: var(--week-surface);
  border-color: var(--week-soft-line);
  box-shadow: var(--week-shadow);
}

.weekly-timegrid-corner,
.weekly-timegrid-day-header {
  border-bottom-color: var(--week-soft-line);
}

.weekly-timegrid-day-header,
.weekly-time-day,
.weekly-time-axis {
  border-color: var(--week-soft-line);
}

.weekly-timegrid-day-header strong {
  font-weight: 650;
}

.weekly-timegrid-day-header span,
.weekly-time-axis,
.weekly-time-event-body > span {
  font-weight: 500;
}

.weekly-time-slot {
  border-bottom-color: var(--week-soft-line);
}

.weekly-time-event {
  border-color: rgba(17, 24, 39, 0.045);
  box-shadow: none;
}

.weekly-time-event strong {
  font-weight: 650;
}

.weekly-time-event small {
  font-weight: 400;
}

.weekly-ai-card .weekly-card-header {
  padding: 22px 20px 8px;
}

.weekly-ai-card .weekly-kicker {
  color: #6b7280;
  font-weight: 650;
}

.weekly-insight-item {
  border-color: var(--week-soft-line);
  box-shadow: none;
}

.weekly-insight-item strong {
  font-weight: 650;
}

.weekly-insight-item span span {
  font-weight: 400;
}

@media (max-width: 1200px) {
  .weekly-command-card {
    width: 100%;
    max-width: none;
  }
}

/* Calendar shell hierarchy: date controls, view mode, action, filters, grid */
.weekly-content-grid {
  margin-top: 2px;
}

.weekly-calendar-card {
  border-radius: 28px;
}

.weekly-calendar-card .weekly-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin: 0;
  padding: 18px 20px;
  border-bottom: 1px solid var(--week-soft-line);
}

.weekly-calendar-card .weekly-toolbar-left,
.weekly-calendar-card .weekly-toolbar-actions {
  display: flex;
  align-items: center;
  min-width: 0;
}

.weekly-calendar-card .weekly-toolbar-left {
  gap: 14px;
}

.weekly-calendar-card .weekly-toolbar-actions {
  justify-content: flex-end;
  gap: 12px;
  flex-wrap: nowrap;
}

.weekly-calendar-card .weekly-week-nav {
  gap: 8px;
  min-width: 0;
}

.weekly-calendar-card .weekly-view-toggle {
  order: initial;
  gap: 0;
  padding: 4px;
  border: 1px solid rgba(17, 24, 39, 0.06);
  border-radius: 999px;
  background: #f3f4f6;
}

.weekly-calendar-card .weekly-view-btn {
  height: 34px;
  min-width: 72px;
  padding: 0 14px;
  color: #6b7280;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 650;
}

.weekly-calendar-card .weekly-view-btn.is-active {
  background: #ffffff;
  color: var(--brand-600, #0F7F97);
  box-shadow: 0 6px 14px rgba(17, 24, 39, 0.06);
}

.weekly-calendar-card .weekly-new-event-btn {
  order: initial;
  height: 42px;
  padding: 0 18px;
  border-radius: 16px;
  background: linear-gradient(180deg, var(--brand-500, #168CA4), var(--brand-600, #0F7F97));
  color: #ffffff;
  border-color: rgba(255, 255, 255, 0.14);
  box-shadow: 0 12px 26px rgba(42, 159, 192, 0.2);
}

.weekly-calendar-card .weekly-new-event-btn:hover {
  background: linear-gradient(180deg, var(--brand-400, #1C9AB0), var(--brand-600, #0F7F97));
}

.weekly-calendar-card .weekly-filters {
  order: initial;
  justify-content: flex-start;
  gap: 8px;
  padding: 14px 20px;
  border-bottom: 1px solid var(--week-soft-line);
  background: rgba(255, 255, 255, 0.46);
}

.weekly-calendar-card .weekly-filter {
  height: 30px;
  padding: 0 10px;
  border-color: transparent;
  background: transparent;
  color: #6b7280;
  font-size: 12px;
  font-weight: 550;
}

.weekly-calendar-card .weekly-filter:not([data-filter="all"]) {
  padding-left: 21px;
}

.weekly-calendar-card .weekly-filter:not([data-filter="all"])::before {
  left: 10px;
  width: 5px;
  height: 5px;
}

.weekly-calendar-card .weekly-filter.is-active {
  background: var(--brand-50, #e8f7fb);
  color: var(--brand-600, #0F7F97);
  border-color: rgba(42, 159, 192, 0.24);
}

.weekly-calendar-card .weekly-card-header {
  display: none;
}

@media (max-width: 1080px) {
  .weekly-calendar-card .weekly-toolbar {
    align-items: flex-start;
    flex-direction: column;
  }

  .weekly-calendar-card .weekly-toolbar-left,
  .weekly-calendar-card .weekly-toolbar-actions {
    width: 100%;
  }

  .weekly-calendar-card .weekly-toolbar-actions {
    justify-content: space-between;
  }
}

@media (max-width: 760px) {
  .weekly-calendar-card .weekly-toolbar-left,
  .weekly-calendar-card .weekly-toolbar-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .weekly-calendar-card .weekly-week-nav,
  .weekly-calendar-card .weekly-date-range,
  .weekly-calendar-card .weekly-view-toggle,
  .weekly-calendar-card .weekly-new-event-btn {
    width: 100%;
  }

  .weekly-calendar-card .weekly-view-btn {
    flex: 1;
  }
}

/* ── AI Overview hidden (visual-only) ─────────────────────────────────────
   The .weekly-ai-card aside is kept in the markup so the JS that populates
   `weekly-summary-line`, `weekly-count-badge`, and `weekly-agenda-list`
   still finds its targets and doesn't throw. We hide it from view and
   collapse the two-column content grid to one column so the calendar +
   command bar take the full available width.

   Restoring the AI Overview later: delete this override block.
   The aside markup, JS hooks, and i18n keys are all unchanged. */
.weekly-page .weekly-ai-card {
  display: none !important;
}

.weekly-page .weekly-content-grid {
  grid-template-columns: minmax(0, 1fr) !important;
}

.weekly-page .weekly-command-card {
  width: 100% !important;
  max-width: none !important;
}

/* Absolute final V2 premium weekly planner refresh. */
body {
  background: #f7f8f9 !important;
}

.sb-main {
  background: #f7f8f9 !important;
}

.weekly-page {
  --week-v2-bg: #f7f8f9;
  --week-v2-surface: rgba(255, 255, 255, 0.75);
  --week-v2-surface-strong: rgba(255, 255, 255, 0.9);
  --week-v2-frost-border: rgba(255, 255, 255, 0.6);
  --week-v2-subtle-border: rgba(0, 0, 0, 0.04);
  --week-v2-line: rgba(16, 24, 40, 0.055);
  --week-v2-text: #101828;
  --week-v2-soft: #445066;
  --week-v2-body: #5b6675;
  --week-v2-label: #8993a4;
  --week-v2-primary: #168CA4;
  --week-v2-primary-soft: rgba(42, 159, 192, 0.12);
  --week-v2-primary-gradient: linear-gradient(180deg, #1C9AB0 0%, #168CA4 100%);
  --week-v2-shadow: 0 1px 2px rgba(0, 0, 0, 0.02), 0 8px 30px rgba(0, 0, 0, 0.04);
  --week-v2-shadow-hover: 0 1px 2px rgba(0, 0, 0, 0.025), 0 14px 38px rgba(0, 0, 0, 0.06);
  width: min(1180px, 100%);
  max-width: 1180px;
  margin: 0 auto;
  color: var(--week-v2-text);
  font-family: Inter, "Source Sans Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.weekly-page-header {
  margin: 0 0 24px;
}

.weekly-page-header .app-page-title {
  margin: 0;
  color: var(--week-v2-text);
  font-family: Inter, "Source Sans Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: clamp(42px, 4vw, 58px);
  font-weight: 500;
  line-height: 1.1;
  letter-spacing: 0;
}

.weekly-page-header .app-page-subtitle {
  max-width: 620px;
  margin: 10px 0 0;
  color: var(--week-v2-body);
  font-size: 15px;
  font-weight: 400;
  line-height: 1.65;
}

.weekly-shell {
  gap: 32px;
}

.weekly-command-card,
.weekly-status-card,
.weekly-calendar-card,
.weekly-agenda-card,
.weekly-ai-card {
  border: 1px solid var(--week-v2-frost-border);
  background: var(--week-v2-surface);
  box-shadow: var(--week-v2-shadow);
  backdrop-filter: blur(20px);
}

.weekly-page .weekly-command-card {
  width: 100% !important;
  max-width: none !important;
  min-height: 0;
  display: block;
  padding: 24px;
  border-radius: 32px;
  background: var(--week-v2-surface);
  border-color: var(--week-v2-frost-border);
  box-shadow: var(--week-v2-shadow);
}

.weekly-command-form {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) 42px 48px;
  gap: 10px;
  align-items: center;
  width: 100%;
  min-height: 64px;
  padding: 8px;
  border: 1px solid var(--week-v2-subtle-border);
  border-radius: 24px;
  background: rgba(255, 255, 255, 0.84);
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.015), 0 10px 28px rgba(0, 0, 0, 0.035);
  backdrop-filter: blur(18px);
}

.weekly-command-form:focus-within {
  border-color: rgba(42, 159, 192, 0.24);
  box-shadow: 0 0 0 4px rgba(42, 159, 192, 0.1), 0 10px 30px rgba(0, 0, 0, 0.045);
}

.weekly-command-card .weekly-input {
  height: 48px;
  min-height: 48px;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--week-v2-text);
  box-shadow: none;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.55;
}

.weekly-command-card .weekly-input::placeholder {
  color: rgba(91, 102, 117, 0.72);
}

.weekly-command-card .weekly-input:focus {
  box-shadow: none;
}

.weekly-command-add,
.weekly-command-mic,
.weekly-command-send {
  width: 42px;
  height: 42px;
  border-radius: 999px;
  box-shadow: none;
}

.weekly-command-add {
  border: 1px solid rgba(42, 159, 192, 0.12);
  color: var(--week-v2-primary);
  background: var(--week-v2-primary-soft);
}

.weekly-command-mic {
  border: 0;
  color: var(--week-v2-label);
  background: transparent;
}

.weekly-command-send {
  width: 48px;
  height: 48px;
  border: 0;
  color: #ffffff;
  background: var(--week-v2-primary-gradient);
  box-shadow: 0 8px 20px rgba(31, 127, 155, 0.16);
}

.weekly-command-add:hover,
.weekly-command-add:focus-visible,
.weekly-command-mic:hover,
.weekly-command-mic:focus-visible {
  outline: 0;
  color: var(--week-v2-primary);
  background: rgba(42, 159, 192, 0.1);
  border-color: rgba(42, 159, 192, 0.18);
  transform: none;
}

.weekly-command-send:hover,
.weekly-command-send:focus-visible,
.weekly-new-event-btn:hover,
.weekly-new-event-btn:focus-visible {
  outline: 0;
  color: #ffffff;
  background: var(--week-v2-primary-gradient);
  box-shadow: 0 10px 24px rgba(31, 127, 155, 0.2);
  transform: translateY(-1px);
}

.weekly-content-grid {
  gap: 28px;
}

.weekly-calendar-card {
  overflow: hidden;
  border-radius: 32px;
  background: var(--week-v2-surface);
}

.weekly-calendar-card .weekly-toolbar {
  gap: 18px;
  padding: 20px 24px;
  border-bottom: 1px solid var(--week-v2-subtle-border);
  background: transparent;
}

.weekly-calendar-card .weekly-toolbar-left,
.weekly-calendar-card .weekly-toolbar-actions {
  gap: 12px;
}

.weekly-icon-btn,
.weekly-week-pill,
.weekly-date-range,
.weekly-view-toggle,
.weekly-filter,
.weekly-new-event-btn,
.weekly-link-button,
.weekly-insights-button {
  border: 1px solid rgba(0, 0, 0, 0.045);
  background: rgba(255, 255, 255, 0.68);
  box-shadow: none;
  color: var(--week-v2-soft);
  font-family: inherit;
  font-weight: 500;
}

.weekly-icon-btn {
  width: 40px;
  height: 40px;
}

.weekly-week-pill,
.weekly-date-range {
  height: 40px;
  border-radius: 999px;
  color: var(--week-v2-text);
  font-size: 14px;
}

.weekly-date-range {
  padding: 0 14px;
}

.weekly-view-toggle {
  padding: 4px;
  border-radius: 999px;
  background: rgba(245, 247, 250, 0.72);
}

.weekly-calendar-card .weekly-view-btn,
.weekly-view-btn {
  height: 32px;
  min-width: 68px;
  padding: 0 12px;
  color: var(--week-v2-body);
  background: transparent;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 500;
}

.weekly-view-btn.is-active,
.weekly-calendar-card .weekly-view-btn.is-active {
  color: var(--week-v2-primary);
  background: rgba(255, 255, 255, 0.9);
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.02);
}

.weekly-calendar-card .weekly-new-event-btn,
.weekly-new-event-btn {
  height: 42px;
  gap: 8px;
  padding: 0 18px;
  border: 0;
  border-radius: 999px;
  color: #ffffff;
  background: var(--week-v2-primary-gradient);
  box-shadow: 0 8px 20px rgba(31, 127, 155, 0.16);
  font-size: 14px;
  font-weight: 500;
}

.weekly-calendar-card .weekly-filters {
  gap: 8px;
  padding: 14px 24px;
  border-bottom: 1px solid var(--week-v2-subtle-border);
  background: rgba(255, 255, 255, 0.34);
}

.weekly-calendar-card .weekly-filter,
.weekly-filter {
  height: 32px;
  padding: 0 12px;
  border-color: transparent;
  border-radius: 999px;
  color: var(--week-v2-body);
  background: transparent;
  font-size: 13px;
  font-weight: 500;
}

.weekly-calendar-card .weekly-filter:not([data-filter="all"]),
.weekly-filter:not([data-filter="all"]) {
  padding-left: 24px;
}

.weekly-calendar-card .weekly-filter:not([data-filter="all"])::before,
.weekly-filter:not([data-filter="all"])::before {
  left: 12px;
  width: 5px;
  height: 5px;
}

.weekly-calendar-card .weekly-filter.is-active,
.weekly-filter.is-active {
  color: var(--week-v2-primary);
  background: var(--week-v2-primary-soft);
  border-color: transparent;
}

.weekly-status-card {
  padding: 16px 18px;
  border-radius: 24px;
  color: var(--week-v2-body);
  font-size: 15px;
  font-weight: 400;
}

.weekly-days--timegrid,
.weekly-days--month {
  background: transparent;
}

.weekly-timegrid {
  grid-template-columns: 58px repeat(7, minmax(96px, 1fr));
  grid-template-rows: 68px 720px;
}

.weekly-timegrid-corner,
.weekly-timegrid-day-header {
  border-bottom: 1px solid var(--week-v2-subtle-border);
  background: rgba(255, 255, 255, 0.54);
}

.weekly-timegrid-day-header,
.weekly-time-day,
.weekly-time-axis {
  border-color: var(--week-v2-subtle-border);
}

.weekly-timegrid-day-header strong {
  color: var(--week-v2-text);
  font-size: 15px;
  font-weight: 550;
}

.weekly-timegrid-day-header span,
.weekly-time-axis,
.weekly-time-event-body > span {
  color: var(--week-v2-label);
  font-size: 12px;
  font-weight: 500;
}

.weekly-timegrid-day-header.is-today strong {
  color: var(--week-v2-primary);
}

.weekly-time-day {
  background: rgba(255, 255, 255, 0.42);
}

.weekly-time-day.is-today {
  background: rgba(42, 159, 192, 0.055);
}

.weekly-time-slot {
  border-bottom: 1px solid rgba(16, 24, 40, 0.04);
}

.weekly-time-event,
.weekly-month-event {
  border: 1px solid rgba(0, 0, 0, 0.045);
  background: rgba(255, 255, 255, 0.92);
  color: var(--week-v2-text);
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.02);
  font-size: 12px;
  font-weight: 500;
}

.weekly-time-event:hover,
.weekly-time-event:focus-visible,
.weekly-month-event:hover,
.weekly-month-event:focus-visible {
  outline: 0;
  border-color: rgba(42, 159, 192, 0.18);
  background: rgba(255, 255, 255, 0.98);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.045);
}

.weekly-time-event strong,
.weekly-month-event-title {
  color: var(--week-v2-text);
  font-weight: 500;
}

.weekly-time-event-body > span,
.weekly-month-event-time {
  color: var(--week-v2-label);
  font-weight: 500;
}

.weekly-time-event-more,
.weekly-month-more {
  background: #f5f7fa;
  color: #556070;
  font-weight: 500;
}

.weekly-days--month {
  border-top: 1px solid var(--week-v2-subtle-border);
}

.weekly-month-weekday {
  color: var(--week-v2-label);
  background: rgba(255, 255, 255, 0.54);
  border-color: var(--week-v2-subtle-border);
  font-size: 12px;
  font-weight: 500;
}

.weekly-month-day {
  border-color: var(--week-v2-subtle-border);
  background: rgba(255, 255, 255, 0.42);
}

.weekly-month-day.is-muted {
  background: rgba(255, 255, 255, 0.22);
}

.weekly-month-day.is-today {
  background: rgba(42, 159, 192, 0.055);
}

.weekly-month-day-number {
  color: var(--week-v2-soft);
  background: transparent;
  font-size: 13px;
  font-weight: 500;
}

.weekly-month-day.is-today .weekly-month-day-number {
  color: #ffffff;
  background: var(--week-v2-primary-gradient);
  box-shadow: 0 8px 18px rgba(31, 127, 155, 0.16);
}

.weekly-drawer-backdrop {
  background: rgba(15, 23, 42, 0.24);
  backdrop-filter: blur(6px);
}

.weekly-drawer {
  width: min(480px, calc(100vw - 28px));
  border-left: 1px solid var(--week-v2-frost-border);
  background: rgba(255, 255, 255, 0.92);
  box-shadow: -24px 0 60px rgba(0, 0, 0, 0.12);
  backdrop-filter: blur(22px);
}

.weekly-drawer-close {
  border: 1px solid rgba(0, 0, 0, 0.045);
  background: rgba(255, 255, 255, 0.72);
  color: var(--week-v2-body);
}

.weekly-drawer-header {
  padding: 32px 32px 16px;
}

.weekly-kicker,
.weekly-drawer-mode {
  color: var(--week-v2-label);
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0.01em;
  text-transform: none;
}

.weekly-drawer-header h2,
.weekly-card-header h2,
.weekly-command-card h2 {
  color: var(--week-v2-text);
  font-size: 22px;
  font-weight: 550;
  line-height: 1.2;
}

.weekly-drawer-header p:last-child,
.weekly-card-header p,
.weekly-command-card p {
  color: var(--week-v2-body);
  font-size: 15px;
  font-weight: 400;
  line-height: 1.65;
}

.weekly-form {
  padding: 0 32px 32px;
}

.weekly-field label,
.weekly-checkbox {
  color: var(--week-v2-label);
  font-size: 13px;
  font-weight: 500;
}

.weekly-input,
.weekly-textarea {
  border: 1px solid rgba(0, 0, 0, 0.055);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.8);
  color: var(--week-v2-text);
  font-size: 15px;
  font-weight: 400;
  line-height: 1.55;
}

.weekly-input {
  height: 46px;
}

.weekly-textarea {
  min-height: 104px;
}

.weekly-input:focus,
.weekly-textarea:focus {
  border-color: rgba(42, 159, 192, 0.32);
  box-shadow: 0 0 0 4px rgba(42, 159, 192, 0.1);
  background: rgba(255, 255, 255, 0.94);
}

.weekly-source-notice,
.weekly-drawer-message.is-success,
.weekly-drawer-message.is-error {
  border-radius: 18px;
  border-color: rgba(0, 0, 0, 0.045);
  background: rgba(255, 255, 255, 0.72);
}

.weekly-drawer-actions {
  border-top: 1px solid var(--week-v2-subtle-border);
  padding-top: 20px;
}

.weekly-drawer-actions .btn,
.weekly-page .btn {
  min-height: 42px;
  border-radius: 999px;
  font-size: 14px;
  font-weight: 500;
}

.weekly-drawer-actions .btn-primary,
.weekly-page .btn-primary {
  border: 0;
  color: #ffffff;
  background: var(--week-v2-primary-gradient);
  box-shadow: 0 8px 20px rgba(31, 127, 155, 0.16);
}

.weekly-drawer-actions .btn-secondary,
.weekly-page .btn-secondary {
  border: 1px solid rgba(0, 0, 0, 0.055);
  color: #445066;
  background: rgba(255, 255, 255, 0.7);
}

@media (max-width: 1180px) {
  .weekly-page {
    max-width: none;
  }
}

@media (max-width: 1080px) {
  .weekly-calendar-card .weekly-toolbar {
    align-items: stretch;
    flex-direction: column;
  }

  .weekly-calendar-card .weekly-toolbar-left,
  .weekly-calendar-card .weekly-toolbar-actions {
    width: 100%;
  }

  .weekly-calendar-card .weekly-toolbar-actions {
    justify-content: space-between;
  }
}

@media (max-width: 760px) {
  .weekly-page-header .app-page-title {
    font-size: 32px;
  }

  .weekly-shell {
    gap: 24px;
  }

  .weekly-page .weekly-command-card {
    padding: 18px;
    border-radius: 28px;
  }

  .weekly-command-form {
    grid-template-columns: 40px minmax(0, 1fr) 44px;
    border-radius: 22px;
  }

  .weekly-command-card .weekly-input {
    height: 44px;
    font-size: 14px;
  }

  .weekly-command-mic {
    display: none;
  }

  .weekly-command-send {
    width: 44px;
    height: 44px;
  }

  .weekly-calendar-card {
    border-radius: 28px;
  }

  .weekly-calendar-card .weekly-toolbar,
  .weekly-calendar-card .weekly-filters {
    padding-right: 18px;
    padding-left: 18px;
  }

  .weekly-calendar-card .weekly-toolbar-left,
  .weekly-calendar-card .weekly-toolbar-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .weekly-calendar-card .weekly-week-nav,
  .weekly-calendar-card .weekly-date-range,
  .weekly-calendar-card .weekly-view-toggle,
  .weekly-calendar-card .weekly-new-event-btn {
    width: 100%;
  }

  .weekly-calendar-card .weekly-view-btn {
    flex: 1;
  }

  .weekly-drawer-header,
  .weekly-form {
    padding-right: 24px;
    padding-left: 24px;
  }
}