.hidden{
  display: none !important;
}input, textarea{
  -webkit-user-select: text;
  -moz-user-select: text;
  -ms-user-select: text;
  user-select: text;
}.clickable{
  cursor: pointer;
}
/* ---------------- 2) Variables ---------------- */
:root{
  --ev-tone-dark-rgb: 200, 200, 200;
  --ev-tone-light-rgb: 230, 230, 230;
  --ev-tone-rgb: var(--ev-tone-dark-rgb);
  --fg: #ffffff;
  --muted: #8b8b8b;
  --card: #151517;
  --border: #2a2a2e;
  --accent: #32aaff;
  --accent-alfa: #32aaffb1;
  --zakat-focus-top: 164px;
  --today-sep-floating-top-gap: 8px;
  --today-sep-floating-bottom-gap: 200px;
  --connector-edge-inset: 18px;

  /* базовые размеры для записей / отступов */
  --ENTRY_H: 30px;            /* высота записи (лист + таймлайн) */
  --ENTRY_V_PADDING: 0px;

  --DAY_W: 30px;              /* ширина колонки даты */
  --ROW_GAP: 5px;

  /* историческая переменная — читает JS */
  --TIMELINE_LANE_H: var(--ENTRY_H);
  --TIMELINE_LANE_MID_H: 10px;
  --calendar-base-bg: #121212;
  --calendar-visual-image: none;
  --calendar-visual-color: var(--calendar-base-bg);

  /* Text scale */
  --text-xs: 11px;
  --text-sm: 12px;
  --text-md: 13px;
  --text-lg: 14px;
  --text-xl: 16px;
  --weight-regular: 400;
  --weight-medium: 600;
  --weight-bold: 800;

  /* Surfaces */
  --text-primary: var(--fg);
  --text-secondary: rgba(255,255,255,0.78);
  --text-muted-2: rgba(255,255,255,0.60);
  --surface-1: rgba(171, 171, 171, 0.25);
  --surface-2: rgb(24,24,24);
  --surface-3: rgba(255,255,255,0.05);
  --surface-4: rgba(71, 71, 71, 0.6);
  --surface-5: rgba(0, 0, 0, 0.25);
  --surface-6: rgb(255, 255, 255);
  --surface-7: rgba(255, 255, 255, 0.35);
  --surface-8: rgb(45, 45, 45);
  --surface-9: rgb(87, 87, 87);  
  --sheader: #5c5c5c;  
  --surface-10event: rgb(69, 69, 69);
  --surface-11event: rgb(37, 37, 37);
  --surface-border: rgba(255,255,255,0.10);
  --shadow-elevated: 0 18px 40px rgba(0,0,0,0.65);

  /* Inputs */
  --input-bg: #0f0f11;
  --input-border: rgba(255,255,255,0.20);
  --input-radius: 10px;

  /* Buttons */
  --btn-radius: 999px;
  --btn-bg: transparent;
  --btn-bg-secondary: rgba(255,255,255,0.10);
  --btn-bg-primary: linear-gradient(to bottom right, #ffffff, #7177bc);
  --btn-text: var(--text-primary);
  --btn-text-muted: rgba(255,255,255,0.78);
  --btn-text-primary: #111;
  --btn-border: rgba(255,255,255,0.12);
  --btn-shadow: 0 10px 22px rgba(0,0,0,0.22);
  --settings-icon-filter: invert(1);
  --zakat-modepanel-h: 84px;
  --zakat-modepanel-right: 0px;
  --zakat-modepanel-left: 0px;
}body.theme-light, html[data-theme="light"] body{
  --calendar-base-bg: #d4d4d4;
  --fg: #141414;
  --muted: #5e5e5e;
  --card: #ffffff;
  --border: #d8d8dd;
  --ev-tone-rgb: var(--ev-tone-light-rgb);

  --text-primary: #000000;
  --text-secondary: rgba(0,0,0,0.72);
  --text-muted-2: rgba(0,0,0,0.56);
  --surface-1: rgba(0,0,0,0.15);
  --surface-2: rgba(255,255,255,1);
  --surface-3: rgba(0,0,0,0.15);
  --surface-4: rgba(255,255,255,0.60);
  --surface-5: rgba(200, 200, 200, 0.25);
  --surface-6: rgb(0, 0, 0);
  --surface-7: rgba(32, 32, 32, 0.35);
  --surface-8: rgb(196, 196, 196);
  --surface-9: rgb(242, 242, 242);
  --surface-10event: rgb(255, 255, 255);
  --surface-11event: rgb(229, 229, 229);
  --sheader: #ebebeb;
  --surface-border: rgba(0,0,0,0.12);
  --shadow-elevated: 0 18px 40px rgba(0,0,0,0.18);
  --input-bg: #c9c9c9;
  --input-border: rgba(0,0,0,0.12);
  --input-radius: 10px;
  --btn-bg-secondary: rgba(0,0,0,0.06);
  --btn-bg-primary: linear-gradient(to bottom right, #ffffff, #d6d6d6);
  --btn-text-muted: rgba(0,0,0,0.68);
  --btn-text-primary: #111;
  --btn-border: rgba(0,0,0,0.12);
  --btn-shadow: 0 10px 22px rgba(0,0,0,0.14);
  --settings-icon-filter: invert(0);
}/* ---------------- 3) Base layout ---------------- */
html, body{
  overflow-anchor: none !important;
  touch-action: manipulation;
  -ms-touch-action: manipulation;
  user-select: none;
  -webkit-user-select: none;
  height: 100%;
}
html{
  overscroll-behavior: none;
}body{
  overscroll-behavior-x: none;
  overscroll-behavior-y: none;
  background-color: var(--calendar-visual-color, var(--calendar-base-bg, #121212));
  background-image: var(--calendar-visual-image, none);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial,
    sans-serif;
  margin: 0;
  color: var(--fg);
  position: relative;
}
.tg-recover-overlay{
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0,0,0,0.45);
}.tg-recover-box{
  width: min(92vw, 420px);
  padding: 18px 16px;
  border-radius: 16px;
  box-shadow: var(--shadow-elevated);
  text-align: left;
  color: var(--text-primary);
  background: linear-gradient(
  145deg,
  var(--surface-10event),
  var(--surface-11event)
  ) padding-box,
  linear-gradient(320deg, var(--surface-10event), rgba(0,0,0, 0)) border-box;
  border: 2px solid transparent;
  box-sizing: border-box;
}.tg-recover-title{
  margin-top: 10px;
  font-size: var(--text-md);
}.tg-recover-sub{
  margin-top: 6px;
  font-size: var(--text-sm);
  opacity: 0.78;
  line-height: 1.35;
}.tg-recover-spinner{
  width: 34px;
  height: 34px;
  border-radius: 999px;
  border: 3px solid rgba(255,255,255,0);
  border-top-color: var(--surface-6);
  animation: tgspin 0.9s linear infinite;
  margin: 0 auto;
}.tg-recover-sec-wrap{
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
}.tg-recover-sec-host{
  width: min(100%, 540px);
  aspect-ratio: 3 / 1;
  min-height: 90px;
  max-height: 180px;
  overflow: hidden;
  color: var(--surface-6);
}.tg-recover-sec-host svg{
  width: 100%;
  height: 100%;
  display: block;
  color: currentColor;
}.tg-recover-sec-host svg text{
  fill: currentColor !important;
  stroke: currentColor !important;
}@keyframes tgspin { to { transform: rotate(360deg); } }.calendar-sync-indicator{
  position: fixed;
  top: calc(var(--zakat-header-bottom, calc(0px + 0px)) + 40px);
  left: 50%;
  transform: translateX(-50%);  z-index: 9998;
  width: 28px;
  height: 28px;
  border-radius: var(--btn-radius);
  background: transparent;
  display: flex;
  align-items: center;
  justify-content: center;
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  box-shadow: var(--btn-shadow);
}.calendar-sync-spinner{
  width: 16px;
  height: 16px;
  border-radius: 999px;
  border: 2px solid var(--btn-border);
  border-top-color: var(--text-primary);
  animation: tgspin 0.9s cubic-bezier(0.2, 0, 0.8, 1) infinite;
}
.calendar-pull-edge-layer{
  position: fixed;
  inset: 0;
  pointer-events: none;
  user-select: none;
  z-index: 9998;
}
.calendar-pull-edge-layer .calendar-pull-edge-indicator{
  position: absolute;
  left: 50%;
  width: 34px;
  height: 34px;
  margin-left: -17px;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
  user-select: none;
  overflow: visible;
}
.calendar-pull-edge-layer .calendar-pull-edge-indicator.top{
  top: calc(var(--zakat-header-bottom, calc(0px + 0px)) + 14px);
}
.calendar-pull-edge-layer .calendar-pull-edge-indicator.bottom{
  bottom: calc(var(--zakat-modepanel-h, 84px) + 14px);
}
.calendar-pull-edge-layer .calendar-pull-edge-indicator .calendar-sync-spinner{
  opacity: 0;
  transform: scale(var(--pull-edge-scale, 0.72));
  transition: opacity 120ms linear, transform 120ms ease;
}
.calendar-pull-edge-layer .calendar-pull-edge-indicator.is-active .calendar-sync-spinner{
  opacity: var(--pull-edge-opacity, 0.16);
}
.calendar-pull-edge-layer .calendar-pull-edge-indicator.is-spinning .calendar-sync-spinner{
  opacity: 1;
  transform: scale(1);
}
@media (hover: none) and (pointer: coarse){
  #root.list{
    --calendar-pull-space-top: 0px;
    --calendar-pull-space-bottom: 0px;
  }
}body.calendar-theme-active::before{
  /* Keep photos natural; avoid "washed/bleached" look on highlight images. */
  filter: none;
}
body.only-mine-mode{
  padding-top: 0;
}body.only-mine-mode #root{
  padding-top: 0;
}.calendar-theme-banner{
  --calendar-banner-expanded-h: 99px;
  --calendar-banner-collapsed-h: 44px;
  --calendar-banner-top-h: 60px;
  --calendar-banner-actions-h: 31px;
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  z-index: 79;
  box-sizing: border-box;
  padding: 4px 0px 2px;
  box-shadow: 0 18px 30px rgba(0, 0, 0, 0.38);
  background: var(--sheader);
  font-size: var(--text-md);
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 2px;
  overflow: hidden;
  height: var(--calendar-banner-expanded-h);
  min-height: var(--calendar-banner-expanded-h);
  will-change: height;
  transition: 700ms ease-out;
  contain: layout paint;
}
.calendar-theme-banner.is-desc-collapsed{
  height: var(--calendar-banner-expanded-h);
  min-height: var(--calendar-banner-expanded-h);
  max-height: var(--calendar-banner-expanded-h);
}
.calendar-theme-banner.is-skeleton{
  pointer-events: none;
}
.calendar-theme-banner .banner-skeleton{
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  gap: 2px;
}
.calendar-theme-banner:not(.is-skeleton) .banner-skeleton{
  display: none !important;
}
.calendar-theme-banner.is-skeleton .banner-top,
.calendar-theme-banner.is-skeleton .banner-actions{
  display: none !important;
}
.calendar-theme-banner .banner-skeleton-top{
  display: flex;
  align-items: center;
  gap: 10px;
  height: var(--calendar-banner-top-h);
  min-height: var(--calendar-banner-top-h);
  flex: 0 0 var(--calendar-banner-top-h);
  padding: 0 4px;
}
.calendar-theme-banner .banner-skeleton-avatar{
  width: 36px;
  height: 36px;
  border-radius: 999px;
  flex: 0 0 auto;
}
.calendar-theme-banner .banner-skeleton-title{
  height: 13px;
  border-radius: 999px;
  width: min(180px, 68%);
}
.calendar-theme-banner .banner-skeleton-actions{
  display: flex;
  align-items: center;
  gap: 8px;
  height: var(--calendar-banner-actions-h);
  min-height: var(--calendar-banner-actions-h);
  flex: 0 0 var(--calendar-banner-actions-h);
  padding: 0 4px;
}
.calendar-theme-banner .banner-skeleton-chip{
  height: 24px;
  border-radius: 999px;
  width: 72px;
}
.calendar-theme-banner .banner-skeleton-avatar,
.calendar-theme-banner .banner-skeleton-title,
.calendar-theme-banner .banner-skeleton-chip{
  background: linear-gradient(
    90deg,
    rgba(255, 255, 255, 0.16) 0%,
    rgba(255, 255, 255, 0.34) 45%,
    rgba(255, 255, 255, 0.16) 100%
  );
  background-size: 240% 100%;
  animation: banner-skeleton-shimmer 1.2s linear infinite;
}
@keyframes banner-skeleton-shimmer{
  0% { background-position: 100% 0; }
  100% { background-position: -120% 0; }
}
.calendar-theme-banner .banner-top{
  display: flex;
  position: relative;
  align-items: center;
  gap: 12px;
  width: 100%;
  min-height: 0;
  height: var(--calendar-banner-top-h);
  flex: 0 0 var(--calendar-banner-top-h);
  padding: 0 4px;
  transition: 700ms ease-out;
  will-change: height;
}
.calendar-theme-banner .banner-avatar{
  width: 48px;
  height: 48px;
  border-radius: 999px;
  background-size: cover;
  background-position: center;
  flex: 0 0 auto;
  overflow: hidden;
  transform: translate3d(0, 0, 0);
  transition:
    width 420ms ease-out,
    height 420ms ease-out,
    margin 420ms ease-out,
    opacity 420ms ease-out,
    transform 420ms ease-out,
    border-width 420ms ease-out;
}
.calendar-theme-banner .banner-avatar.is-discover-avatar{
  background-image: none !important;
  background: var(--surface-3);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--accent);
  line-height: 0;
}
.calendar-theme-banner .banner-avatar.is-discover-avatar .panelicon{
  width: 82%;
  height: 82%;
}
.calendar-theme-banner .banner-text{
  width: 100%;
  min-width: 0;
  min-height: 0;
  text-align: start;
  cursor: pointer;
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.calendar-theme-banner .banner-title{
  font-weight: 600;
  font-size: 17px;
  line-height: 1.15;
  margin: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.calendar-theme-banner .banner-privacy-pill{
  position: relative;
  top: 0;
  right: 0;
  display: inline-flex;
  align-self: start;
  margin-left: auto;
  gap: 3px;
  padding: 6px 7px;
  align-items: center;
  border-radius: 20px 0 0 20px;
  color: var(--text-primary);
  font-size: 12px;
  font-weight: 600;
  border: none;
  cursor: pointer;
  background: var(--surface-4);
}
.calendar-theme-banner .banner-desc{
  display: flex;
  align-items: flex-start;
  gap: 8px;
  min-height: 0;
  flex: 1 1 auto;
  overflow: hidden;
  opacity: 1;
  position: relative;
}
.calendar-theme-banner .banner-desc-text{
  flex: 1 1 auto;
  min-width: 0;
  opacity: 0.6;
  max-width: 100%;
  white-space: pre-line;
  overflow-wrap: anywhere;
  display: block;
  transform: translateY(0);
  will-change: transform;
}
.calendar-theme-banner .banner-desc-text.is-overflow-animate{
  animation: banner-desc-vertical-pingpong var(--banner-desc-duration, 8s) ease-in-out infinite alternate;
}
@keyframes banner-desc-vertical-pingpong{
  0%, 12% { transform: translateY(0); }
  88%, 100% { transform: translateY(calc(var(--banner-desc-overflow, 0px) * -1)); }
}
.calendar-theme-banner .banner-desc.is-slots-legend{
  align-items: flex-start;
}
.calendar-theme-banner .banner-desc-text.is-slots-legend{
  display: flex;
  flex-direction: column;
  gap: 0;
  white-space: normal;
}
.calendar-theme-banner .banner-slot-legend-line{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  line-height: 1.25;
}
.calendar-theme-banner .banner-slot-legend-dot{
  width: 10px;
  height: 10px;
  border-radius: 999px;
  flex: 0 0 auto;
}
.calendar-theme-banner .banner-slot-legend-label{
  font-size: 12px;
  font-weight: 500;
}
.calendar-theme-banner.is-desc-collapsed .banner-top{
  height: var(--calendar-banner-top-h);
  flex-basis: var(--calendar-banner-top-h);
  gap: 12px;
}
.calendar-theme-banner.is-desc-collapsed .banner-avatar{
  width: 48px;
  height: 48px;
  min-width: 48px;
  min-height: 48px;
  margin: 0;
  border-width: 0px;
  opacity: 1;
  transform: translate3d(0, 0, 0);
  pointer-events: auto;
}
.calendar-theme-banner.is-desc-collapsed .banner-desc{
  opacity: 1;
  transform: translate3d(0, 0, 0);
  pointer-events: auto;
}
.calendar-theme-banner.is-desc-collapsed .banner-privacy-btn{
  display: none;
}
.calendar-theme-banner .banner-actions{
  width: 100%;
  min-height: var(--calendar-banner-actions-h);
  height: var(--calendar-banner-actions-h);
  flex: 0 0 var(--calendar-banner-actions-h);
  display: flex;
  gap: 8px;
  justify-content: flex-start;
  align-items: center;
  flex-wrap: nowrap;
  padding: 0 4px;
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: none;
  opacity: 1;
}
.calendar-theme-banner .banner-actions::-webkit-scrollbar{
  display: none;
}
.calendar-theme-banner .banner-demo-lang{
  position: relative;
  padding: 0px 7px;
  border-radius: 14px 0px 0px 14px;
  background: var(--surface-5);
  min-height: 28px;
  height: 28px;
  right: 0;
  margin-left: auto;
  margin-right: -4px;
  z-index: 2;
  display: none;
  align-items: center;
  gap: 4px;
}
.calendar-theme-banner .banner-demo-lang .lang-icon{
  width: 18px;
  height: 18px;
}
.calendar-theme-banner .banner-demo-lang .banner-demo-lang-select{
  font-size: 12px;
}
.calendar-theme-banner .banner-demo-login-google-btn{
  display: none;
}
.calendar-theme-banner.demo-static{
  --calendar-banner-expanded-h: 99px;
  --calendar-banner-collapsed-h: 99px;
  --calendar-banner-top-h: 55px;
  --calendar-banner-actions-h: 36px;
  transition: none;
}
.calendar-theme-banner.demo-static .banner-top{
  padding-right: 132px;
  transition: none;
}
.calendar-theme-banner.demo-static .banner-avatar{
  width: 40px;
  height: 40px;
  border-radius: 12px;
}
.calendar-theme-banner.demo-static .banner-title{
  font-size: 16px;
  line-height: 1.15;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.calendar-theme-banner.demo-static .banner-desc{
  display: flex !important;
}
.calendar-theme-banner.demo-static .banner-desc-text{
  font-size: 12px;
  line-height: 1.2;
  opacity: 0.72;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.calendar-theme-banner.demo-static .banner-actions{
  flex-basis: var(--calendar-banner-actions-h);
}
.calendar-theme-banner.demo-static .banner-demo-lang{
  display: inline-flex;
}
.calendar-theme-banner.demo-static .banner-privacy-pill,
.calendar-theme-banner.demo-static .banner-privacy-btn,
.calendar-theme-banner.demo-static .banner-participants-btn,
.calendar-theme-banner.demo-static .banner-requests-btn,
.calendar-theme-banner.demo-static .banner-close-btn,
.calendar-theme-banner.demo-static #calendarShareToggle{
  display: none !important;
}
.calendar-theme-banner.demo-static .banner-actions .banner-demo-about-btn,
.calendar-theme-banner.demo-static .banner-actions .banner-demo-login-btn{
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  border: none;
  border-radius: 999px;
  min-height: 30px;
  height: 30px;
  padding: 0 10px;
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
}
.calendar-theme-banner.demo-static .banner-actions .banner-demo-login-btn{
  background: var(--btn-bg-secondary);
  color: var(--text-primary);
  box-shadow: inset 0 0 0 1px var(--btn-border);
}
.calendar-theme-banner.demo-static .banner-actions .banner-demo-login-google-btn{
  display: none !important;
}
.calendar-theme-banner.demo-static .banner-actions .banner-demo-about-btn{
  background: transparent;
  color: var(--text-secondary);
  box-shadow: inset 0 0 0 1px var(--btn-border);
}
.calendar-theme-banner.is-desc-collapsed .banner-actions{
  opacity: 1;
  transform: translate3d(0, 0, 0);
  pointer-events: auto;
}
.calendar-theme-banner .banner-actions .banner-share-toggle{
  order: 999;
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.calendar-theme-banner .banner-actions .banner-share-toggle .calendar-share-slots-icon{
  width: 16px;
  height: 16px;
  flex: 0 0 16px;
  display: none;
}
.calendar-theme-banner .banner-actions .banner-share-toggle.is-slots-share .calendar-share-slots-icon{
  display: inline-block;
}
.calendar-theme-banner .banner-actions .calendar-tool-toggle{
  width: auto;
  max-width: 100%;
  height: 30px;
  min-width: 40px;
  min-height: 30px;
  padding: 4px 8px;
  gap: 4px;
}
.calendar-theme-banner .banner-actions .calendar-tool-icon{
  width: 18px;
  height: 18px;
}
.calendar-theme-banner .banner-actions .calendar-tool-caption{
  font-size: var(--text-sm);
  font-weight: var(--weight-medium);
  padding-right: 8px;
}
.calendar-locked-overlay{
  position: fixed;
  inset: 0;
  display: none;
  align-items: center;
  justify-content: center;
  z-index: 1205;
  pointer-events: none;
}
.calendar-locked-card{
  pointer-events: auto;
  background: var(--surface-2);
  color: var(--text-primary);
  border: 1px solid var(--surface-border);
  border-radius: 14px;
  padding: 16px 18px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  box-shadow: 0 18px 50px rgba(0,0,0,0.4);
}
.calendar-locked-title{
  font-size: 14px;
  font-weight: 700;
}
.calendar-locked-btn{
  padding: 8px 14px;
  border-radius: 999px;
  background: var(--accent);
  color: #fff;
  font-size: 13px;
  font-weight: 700;
}
.calendar-locked-btn:disabled{
  opacity: 0.6;
}
.calendar-theme-banner .snapshot-range-row{
  display: none;
  align-items: center;
  gap: 8px;
  flex-wrap: nowrap;
}.calendar-theme-banner .snapshot-range-row .snapshot-range-toggle{
  padding: 4px;
}.calendar-theme-banner .snapshot-range-row .snapshot-range-inline{
  display: inline-flex;
  align-items: center;
  gap: 6px;
}.calendar-theme-banner.snapshot-text-mode .banner-top{
  display: none;
}.calendar-theme-banner.snapshot-text-mode .banner-actions > *{
  display: none;
}.calendar-theme-banner.snapshot-text-mode #calendarShareToggle{
  display: inline-flex;
}.calendar-theme-banner.snapshot-text-mode .banner-actions .snapshot-range-row{
  display: inline-flex;
}.calendar-theme-banner.snapshot-text-mode .banner-actions .snapshot-copy-btn{
  display: inline-flex;
}.calendar-theme-banner.snapshot-text-mode .banner-actions .snapshot-text-toggle-wrap{
  display: inline-flex;
}.calendar-theme-banner .snapshot-text-toggle-wrap{
  display: none;
  align-items: center;
  gap: 8px;
}.calendar-theme-banner .snapshot-text-toggle-label{
  font-size: 12px;
  font-weight: 600;
  opacity: 0.9;
}.calendar-theme-banner .snapshot-banner-text{
  width: 100%;
  padding-top: 0px;
  padding-left: 6px;
  padding-right: 6px;
  text-align: left;
}.calendar-theme-banner .snapshot-banner-title{
  display: none;
}.calendar-theme-banner .snapshot-banner-pre{
  margin: 0;
  max-height: calc(var(--snapshot-banner-lines, 8) * 1.4em);
  overflow: auto;
  white-space: pre-wrap;
  font: 12px/1.4 ui-monospace,Menlo,monospace;
  color: var(--text-primary);
}@media (max-width: 720px) {.calendar-theme-banner .snapshot-banner-pre{
    padding-top: calc(0px + 40px);
  }}/* banner expand/collapse button removed */

.calendar-theme-banner .banner-participants-btn, .calendar-theme-banner .banner-requests-btn, .calendar-theme-banner .banner-privacy-btn, .calendar-theme-banner .banner-join-btn{
  border: none;
  padding: 6px 8px;
  font-size: var(--text-md);
  font-weight: var(--weight-medium);
  cursor: pointer;
  line-height: 1;
}.calendar-theme-banner .banner-participants-btn:disabled, .calendar-theme-banner .banner-requests-btn:disabled, .calendar-theme-banner .banner-privacy-btn:disabled, .calendar-theme-banner .banner-join-btn:disabled{
  opacity: 0.65;
  cursor: default;
}.calendar-theme-banner .banner-participants-btn.is-static, .calendar-theme-banner .banner-requests-btn.is-static{
  background: transparent;
  padding: 10px calc(10px + 0px) 4px calc(10px + 0px);
  opacity: 0.92;
  cursor: default;
}.calendar-theme-banner .banner-participants-btn.is-static:disabled, .calendar-theme-banner .banner-requests-btn.is-static:disabled{
  opacity: 0.92;
}.calendar-theme-banner .banner-badge{
  background: rgba(255,59,48,0.95);
  color:#fff;
  border-radius:999px;
  padding:2px 7px;
  font-size:11px;
  font-weight:900;
  line-height:1;
  box-shadow: 0 10px 22px rgba(0,0,0,0.25);
}.calendar-theme-banner .banner-join-btn.is-ghost{
  background: transparent;
  box-shadow: none;
}/* ---------------- Calendar story strip (above mode panel) ---------------- */
.calendar-story-strip{
  position: fixed;
  left: 0;
  right: 0;
  bottom: var(--calendar-story-strip-bottom, 84px);
  z-index: 300;
  width: 100%;
  max-width: 100vw;
  display:flex;
  align-items: flex-end;
  gap: 4px;
  padding: 4px 90px 8px 34px;
  min-height: 78px;
  box-sizing: border-box;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  -webkit-backdrop-filter: none;
  pointer-events: auto;
  user-select: none;
  overflow-x: auto;
  overflow-y: hidden;
  touch-action: pan-x pan-y;
  overscroll-behavior-x: contain;
  overscroll-behavior-y: auto;
  scroll-behavior: auto;
  white-space: nowrap;
}.calendar-story-strip .calendar-story-section{
  display: inline-flex;
  align-items: flex-end;
  gap: 4px;
  flex: 0 0 auto;
  min-width: 0;
}.calendar-story-strip .calendar-story-section--recent{
  margin-left: auto;
  padding-left: 10px;
  border-left: 1px solid var(--surface-border);
}body.snapshot-mode .calendar-story-strip{
  z-index: 30;
}body.calendar-mode-panel-rail .calendar-story-strip{
  --calendar-story-strip-bottom: 0px;
  bottom: 0px;
}.calendar-story-strip::-webkit-scrollbar{ display:none; }.dm-activation-btn.primary{
  background: var(--btn-bg-secondary);
  color: var(--text-primary);
}.dm-activation-btn.secondary{
  background: var(--surface-3);
  color: var(--btn-text-muted);
}
.calendar-story-strip.is-skeleton{
  pointer-events: none;
}
.calendar-story-item--skeleton{
  cursor: default;
}
.calendar-story-item--skeleton .calendar-story-avatar{
  background: var(--surface-4);
  box-shadow: none;
  border: 1px solid var(--surface-border);
}
.calendar-story-strip .calendar-story-avatar{
  margin-top: 0;
}
.calendar-view-toggle-btn{
  position: fixed;
  left: 6px;
  bottom: 200px;
  z-index: 360;
  width: 44px;
  height: 44px;
  border: none;
  border-radius: 22px;
  padding: 6px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--accent);
  color: #fff;
  -webkit-backdrop-filter: blur(5px);
  backdrop-filter: blur(5px);
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.calendar-view-toggle-btn:active,
.calendar-view-toggle-btn:focus,
.calendar-view-toggle-btn:focus-visible{
  outline: none;
  box-shadow: var(--shadow-elevated);
}
.calendar-view-toggle-btn > .calendar-view-toggle-img{
  width: 100%;
  height: 100%;
  display: block;
  filter: brightness(0) invert(1);
  pointer-events: none;
}@keyframes dm-sec-float{
  0%{ transform: translateY(0px); }
  50%{ transform: translateY(-6px); }
  100%{ transform: translateY(0px); }
}.calendar-tool-toggle{
  width: 48px;
  height: 58px;
  display:flex;
  flex-direction: column;
  align-items:center;
  justify-content:center;
  gap: 0;
  cursor:pointer;
  -webkit-tap-highlight-color: transparent;
  color: var(--text-primary);
  position: relative;
}.calendar-tool-toggle:active{
  transform: none !important;
}.calendar-tool-toggle .calendar-tool-icon, .calendar-tool-toggle .cal-tool-icon{
  width: 26px;
  height: 26px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}.calendar-tool-toggle .panelicon{
  width: 26px;
  height: 26px;
  display:block;
  color: var(--text-primary);
}.calendar-tool-toggle.disabled{
  opacity: 0.35;
  cursor: default;
  pointer-events: none;
}.slots-chip{
  border:none;
  border-radius: var(--btn-radius);
  padding: 6px 10px;
  font-size: var(--text-sm);
  font-weight: var(--weight-bold);
  background: var(--surface-4);
  color: var(--text-primary);
  cursor: pointer;
}.slots-chip.active{
  background: var(--btn-bg-secondary);
  color: var(--text-primary);
}.slots-cell.empty{
  background: transparent;
  pointer-events: none;
}.slots-legend-item .dot{
  width: 10px;
  height: 10px;
  border-radius: 999px;
}body.slots-dedicated-mode #root{ display:none !important; }body.slots-dedicated-mode #calendarThemeBanner{ display:none !important; }body.slots-dedicated-mode #modePanel{ display:none !important; }body.slots-dedicated-mode #calendarFilterToggle{ display:none !important; }.slot-section.active{ opacity: 1; }.slot-color-btn{
  border:none;
  border-radius: var(--btn-radius);
  padding: 8px 10px;
  background: var(--surface-4);
  color: var(--text-primary);
  font-size: var(--text-sm);
  font-weight: var(--weight-bold);
  cursor:pointer;
  display:flex;
  align-items:center;
  gap: 8px;
}.slot-color-btn .dot{ 
  width: 12px; 
  height: 12px; 
  border-radius: 999px; 
}.slot-color-btn.on{ 
  background: var(--btn-bg-secondary); 
}.slot-color-panel{
  margin-top: 8px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--surface-border);
  display: flex;
  flex-direction: column;
  gap: 8px;
}.slot-color-row{
  display:flex;
  flex-direction: column;
  gap: 8px;
}.slot-color-line{
  display:flex;
  align-items:center;
  gap: 10px;
}.slot-color-line input{
  flex: 1 1 auto;
  min-width: 0;
  background: var(--input-bg);
  border: 1px solid var(--input-border);
  border-radius: var(--input-radius);
  padding: 6px 8px;
  color: var(--text-primary);
  font-size: var(--text-sm);
}.slot-foot-btn{
  border:none;
  border-radius: var(--btn-radius);
  padding: 10px 12px;
  background: var(--btn-bg-secondary);
  color: var(--text-primary);
  font-size: var(--text-md);
  font-weight: var(--weight-bold);
  cursor:pointer;
  flex: 1 1 160px;
}.slot-foot-btn.primary{ background: var(--btn-bg-primary); color: var(--btn-text-primary); }.calendar-publicfeed-toggle.is-on svg.panelicon{
  color: var(--text-primary);
}.calendar-myutc-toggle.is-on svg.panelicon{
  color: var(--text-primary);
}.calendar-tool-toggle .calendar-tool-caption, .calendar-tool-toggle .cal-tool-label{
  overflow: visible;
  text-overflow: ellipsis;
  white-space: nowrap;
  line-height: 1;
}.calendar-tool-toggle .calendar-tool-icon, .calendar-tool-toggle .calendar-tool-caption, .calendar-tool-toggle .cal-tool-label{
  pointer-events: auto;
}.today-sep.is-today.after-row + .row{
  margin-bottom: 0;
  margin-left: 6px;
  margin-right: 6px;
  border-radius: 0;
  padding: 0;
}.calendar-filter-toggle.is-mine svg.panelicon{
  color: var(--text-primary);
}.calendar-filter-badge{
  position: absolute;
  top: 6px;
  right: 6px;
  width: 16px;
  height: 16px;
  border-radius: 999px;
  background: rgb(255,59,48);
  color: rgba(255,255,255,0.98);
  font-size: 0;
  font-weight: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 3px 10px rgba(0,0,0,0.35);
  pointer-events: none;
}.calendar-tool-badge{
  position: absolute;
  top: 6px;
  right: 6px;
  width: 16px;
  height: 16px;
  border-radius: 999px;
  background: rgb(255,59,48);
  color: rgba(255,255,255,0.98);
  font-size: 11px;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 3px 10px rgba(0,0,0,0.35);
  pointer-events: none;
}/* All/Mine expanded menu (Repost / Joined) */
.calendar-filter-panel{
  position: relative;
  right: auto;
  bottom: auto;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border-radius: 999px;
  border: none;
  background: transparent;
  box-shadow: none;
  overflow: hidden;
  min-width: 58px;
  max-width: min(92vw, 520px);
  pointer-events: none;
}.calendar-filter-panel.is-expanded{
  padding: 0;
  pointer-events: auto;
}.calendar-filter-more{
  display: flex;
  align-items: center;
  gap: 0;
  padding-left: 0;
  padding-right: 0;
  max-width: 0;
  opacity: 0;
  transform: translateX(8px);
  transition: max-width 260ms ease, opacity 200ms ease, transform 260ms ease;
  pointer-events: none;
}.calendar-filter-panel.is-expanded .calendar-filter-more{
  max-width: 420px;
  opacity: 1;
  transform: translateX(0);
  padding: 0 10px;
  pointer-events: auto;
}/* ---------------- Capture mode (calendar screenshot) ---------------- */
body.capture-mode #modePanel, body.capture-mode .mode-panel, body.capture-mode .calendar-story-strip, body.capture-mode .calendar-view-toggle-btn, body.capture-mode #calendarThemeBanner, body.capture-mode #discoverLocationOverlay, body.capture-mode #discoverFilterOverlay, body.capture-mode #calendarFilterBackdrop, body.capture-mode #calendarFilterBar, body.capture-mode #sharePreviewOverlay, body.capture-mode #snapshotBuilder{
  display:none !important;
}body.capture-mode .today-sep.is-horizon, body.capture-mode .today-sep.is-today.after-row, body.capture-mode .today-sep.today-sep-floating{
  display: none !important;
}body.capture-mode{
  padding-left: 0 !important;
  padding-right: 0 !important;
  background-color: var(--calendar-visual-color, var(--calendar-base-bg, #121212));
  background-image: var(--calendar-visual-image, none);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
}/* ---------------- Snapshot Builder ---------------- */
body.snapshot-mode #root{
  padding-bottom: calc(88px + 0px);
}body.snapshot-mode #calendarPublicFeedToggle{
  display:none !important;
}body.snapshot-mode .mode-panel .mode-btn[data-action="settings"]{
  opacity: 0.45;
  pointer-events: none;
}body.snapshot-mode .calendar-filter-more{
  max-width: 360px;
  opacity: 1;
  transform: translateX(0);
  pointer-events: auto;
}body.snapshot-mode .calendar-filter-panel{
  overflow: visible;
  pointer-events: auto;
}.snapshot-capture-toggle .calendar-tool-icon::before{
  content: "";
  display: none;
}.snapshot-capture-toggle .calendar-tool-icon svg{
  width: 26px;
  height: 26px;
  display: block;
  stroke: currentColor;
  fill: none;
}.snapshot-range-toggle{
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px;
  border-radius: 999px;
  background: var(--surface-3);
  border: 1px solid var(--surface-border);
}.snapshot-range-btn{
  border: none;
  background: transparent;
  color: var(--text-secondary);
  padding: 6px 10px;
  border-radius: 999px;
  font-size: var(--text-sm);
  font-weight: var(--weight-medium);
  cursor: pointer;
  white-space: nowrap;
}.snapshot-range-btn.is-on{
  background: var(--btn-bg-secondary);
  color: var(--text-primary);
}.snapshot-custom-range{
  display: flex;
  align-items: center;
  gap: 6px;
}.snapshot-date-field{
  position: relative;
  min-width: 78px;
  height: 30px;
  border-radius: 999px;
  background: var(--surface-3);
  border: 1px solid var(--surface-border);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}.snapshot-date-field input[type="date"]{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  cursor: pointer;
  border: none;
  background: transparent;
}.snapshot-date-display{
  font-size: var(--text-sm);
  font-weight: var(--weight-medium);
  color: var(--text-primary);
  letter-spacing: 0.2px;
  pointer-events: none;
}.snapshot-date-sep{
  opacity: 0.6;
}.snapshot-preview-overlay{
  position: fixed;
  inset: 0;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 18px;
  z-index: 200000;
  background: rgba(8,8,12,0.6);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}body.snapshot-preview-open{
  overflow: hidden;
}.snapshot-preview-card{
  position: relative;
  max-width: min(92vw, 920px);
  max-height: 82vh;
  border-radius: 18px;
  overflow: hidden;
  background: var(--surface-2);
  box-shadow: var(--shadow-elevated);
}.snapshot-preview-img{
  display: block;
  width: 100%;
  height: auto;
  max-height: 82vh;
  object-fit: contain;
}.snapshot-preview-actions{
  position: absolute;
  top: 10px;
  right: 10px;
  display: flex;
  gap: 8px;
}.snapshot-preview-action-btn{
  border: none;
  border-radius: 999px;
  padding: 8px 12px;
  font-size: var(--text-sm);
  font-weight: var(--weight-bold);
  color: var(--text-primary);
  background: var(--surface-4);
  display: inline-flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
}.snapshot-preview-action-btn:active{
  opacity: 0.9;
}.snapshot-preview-download-icon{
  font-size: 12px;
  line-height: 1;
}body.capture-mode.snapshot-bg-color{
  background-image: none !important;
  background-color: var(--snapshot-bg-color, #101114) !important;
}body.capture-mode.snapshot-bg-color #root{
  background-image: none !important;
  background-color: var(--snapshot-bg-color, #101114) !important;
}.item.flash{
  box-shadow: 0 0 0 2px rgba(255,255,255,0.55), 0 18px 44px rgba(0,0,0,0.35);
}/* ---------------- Public Feed screen ---------------- */
body.public-feed-mode .row, body.public-feed-mode .rowline, body.public-feed-mode .rowline > .item{
}body.public-feed-mode #publicFeedList{
  width: 100%;
  padding-top: 0;
}body.public-feed-mode #publicFeedList .line{
  width: 100%;
}
body.public-feed-mode{
  overflow-x: hidden;
}
body.public-feed-mode #root{
  overflow-x: hidden;
}
body.public-feed-mode .calendar-view-toggle-btn{
  display: none !important;
}
body.public-feed-mode.discover-map-mode #root{
  display: none !important;
  overflow: hidden;
}
body.public-feed-mode.discover-map-mode #calendarSplitView{
  display: block !important;
  height: 100% !important;
  max-height: none !important;
  min-height: 0 !important;
  overflow: hidden !important;
  background: var(--map-picker-space-color, #141414) !important;
}
body.public-feed-mode.discover-map-mode #calendarSplitPaneList{
  height: 100%;
  min-height: 0;
}
body.public-feed-mode .calendar-story-strip{
  display:none !important;
}
body.public-feed-mode .calendar-theme-banner .banner-avatar{
  display:none !important;
}
body.public-feed-mode .calendar-theme-banner .banner-top{
  gap:0 !important;
}
body.public-feed-mode .calendar-theme-banner.is-desc-collapsed .banner-top{
  gap:0 !important;
}
body.public-feed-mode .calendar-theme-banner .banner-privacy-pill{
  display:none !important;
}
body.public-feed-mode .calendar-theme-banner .banner-actions > button:not(#calendarShareToggle){
  display:none !important;
}
body.public-feed-mode .calendar-theme-banner .banner-actions #calendarShareToggle{
  display:inline-flex !important;
}
.discover-header-controls{
  display: flex;
  align-items: center;
  gap: 6px;
  flex: 1 1 auto;
  min-width: 0;
  justify-content: space-around;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}
.discover-header-controls.is-map-view #discoverHeaderRadiusBtn{
  display: inline-flex !important;
}
.discover-header-mode-btn{
  flex: 0 0 auto;
  height: 34px;
  min-height: 34px;
  font-size: var(--text-md);
  font-weight: var(--weight-medium);
  border-radius: 0;
  padding: 0 10px;
  font-size: 11px;
  font-weight: 700;
  white-space: nowrap;
}
body.public-feed-mode.discover-map-mode .calendar-theme-banner.is-desc-collapsed{
  height: var(--calendar-banner-expanded-h);
  min-height: var(--calendar-banner-expanded-h);
}
body.public-feed-mode.discover-map-mode .calendar-theme-banner.is-desc-collapsed .banner-top{
  height: var(--calendar-banner-top-h);
  min-height: var(--calendar-banner-top-h);
  flex-basis: var(--calendar-banner-top-h);
  padding: 0 4px;
  opacity: 1;
  transform: translate3d(0, 0, 0);
  pointer-events: auto;
}
body.public-feed-mode.discover-map-mode .calendar-theme-banner.is-desc-collapsed .banner-desc{
  opacity: 1;
  transform: translate3d(0, 0, 0);
  pointer-events: auto;
}
body.public-feed-mode.discover-map-mode .calendar-theme-banner.is-desc-collapsed .banner-actions{
  opacity: 1;
  transform: translate3d(0, 0, 0);
  pointer-events: auto;
}
body.public-feed-mode.discover-map-mode .calendar-theme-banner.discover-route-seo{
  --calendar-banner-expanded-h: 168px;
  --calendar-banner-top-h: 134px;
  --calendar-banner-actions-h: 30px;
}
body.public-feed-mode .calendar-theme-banner.discover-route-seo .banner-avatar{
  display: none !important;
}
body.public-feed-mode .calendar-theme-banner.discover-route-seo .banner-top{
  gap: 0;
}
body.public-feed-mode.discover-map-mode .calendar-theme-banner.discover-route-seo .banner-title{
  white-space: normal;
  line-height: 1.08;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
body.public-feed-mode.discover-map-mode .calendar-theme-banner.discover-route-seo .banner-desc-text{
  opacity: 0.82;
  font-size: 12px;
  line-height: 1.2;
}
@media (max-width: 720px) {
  body.public-feed-mode.discover-map-mode .calendar-theme-banner.discover-route-seo{
    --calendar-banner-expanded-h: 178px;
    --calendar-banner-top-h: 144px;
    --calendar-banner-actions-h: 30px;
  }
  body.public-feed-mode.discover-map-mode .calendar-theme-banner.discover-route-seo .banner-title{
    font-size: 16px;
  }
}
.discover-map-fullscreen-view{
  position: relative;
  width: 100%;
  min-height: 0;
  height: 100%;
  max-height: none;
  flex: 1 1 auto;
  border-radius: 0;
  overflow: hidden;
  background: var(--map-picker-space-color, #141414);
}
.public-feed-mode.discover-map-mode .discover-map-fullscreen-view{
  position: fixed;
  top: 0;
  right: var(--zakat-modepanel-right, 0px);
  bottom: var(--zakat-modepanel-h, 84px);
  left: var(--zakat-modepanel-left, 0px);
  width: auto;
  height: auto;
  max-height: none;
  min-height: 0;
  flex: 0 0 auto;
  z-index: 24;
}
.discover-map-fullscreen-view.map-picker-body{
  min-height: 0;
  height: 100%;
  background: var(--map-picker-space-color, #141414);
}
.discover-map-fullscreen-view .map-picker-map{
  min-height: 0;
  height: 100%;
}

body.public-feed-mode.discover-map-mode #calendarSplitPaneList{
  min-height: 0 !important;
  height: 100% !important;
}
.public-feed-mode.discover-map-mode .discover-map-fullscreen-view .maplibregl-ctrl-group{
  display: none !important;
}
.discover-map-fullscreen-map{
  position: absolute;
  inset: 0;
  background: var(--map-picker-space-color, #141414);
}
.discover-map-fullscreen-map .maplibregl-map,
.discover-map-fullscreen-map .maplibregl-canvas-container,
.discover-map-fullscreen-map .maplibregl-canvas{
  width: 100% !important;
  height: 100% !important;
}
.discover-map-fullscreen-locate{
  left: 12px;
  right: auto;
  top: auto;
  bottom: calc(102px + env(safe-area-inset-bottom, 0px));
  width: auto;
  min-height: 32px;
  height: 32px;
  padding: 0 10px 0 8px;
  gap: 6px;
  border-radius: 999px;
  background: transparent;
  border: 0;
  box-shadow: none;
  color: #fff;
  z-index: 25;
}
.discover-map-fullscreen-locate img{
  width: 16px;
  height: 16px;
}
.discover-map-fullscreen-locate .map-picker-locate-label{
  display: inline-block;
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
  white-space: nowrap;
}
.discover-map-fullscreen-radius{
  left: 12px;
  right: auto;
  top: auto;
  bottom: calc(56px + env(safe-area-inset-bottom, 0px));
  z-index: 25;
}
.discover-map-event-marker-level-1{
  border-color: rgba(255, 224, 130, 0.98);
}
.discover-map-event-marker-level-2{
  border-color: rgba(255, 152, 120, 0.98);
  box-shadow: 0 8px 18px rgba(255, 88, 62, 0.42), 0 6px 14px rgba(0,0,0,0.28);
}
.discover-map-event-marker-level-3{
  border-color: rgba(255, 120, 170, 0.98);
  box-shadow: 0 10px 22px rgba(214, 70, 140, 0.48), 0 7px 16px rgba(0,0,0,0.3);
}
.discover-map-event-marker-level-4{
  border-color: rgba(255, 120, 170, 0.98);
  box-shadow: 0 10px 22px rgba(214, 70, 140, 0.48), 0 7px 16px rgba(0,0,0,0.3);
}
.discover-map-event-marker-level-3.is-highlight{
  box-shadow: 0 10px 22px rgba(214, 70, 140, 0.36), 0 7px 16px rgba(0,0,0,0.3);
}
.discover-map-event-marker-level-4.is-highlight{
  box-shadow: 0 10px 22px rgba(214, 70, 140, 0.36), 0 7px 16px rgba(0,0,0,0.3);
}
.discover-radius-menu{
  position: fixed;
  z-index: 12210;
  min-width: 88px;
  max-width: min(160px, calc(100vw - 16px));
  padding: 4px;
  border-radius: 12px;
  border: 1px solid var(--surface-border);
  background: var(--surface-2);
  box-shadow: 0 14px 30px rgba(0,0,0,0.28);
}
.discover-radius-menu-item{
  width: 100%;
  height: 32px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--text-primary);
  font-size: 12px;
  line-height: 1;
  text-align: left;
  padding: 0 10px;
  cursor: pointer;
}
.discover-radius-menu-item:hover{
  background: var(--surface-3);
}
.discover-radius-menu-item.is-selected{
  background: color-mix(in srgb, var(--accent) 22%, transparent);
  color: var(--text-primary);
  font-weight: 700;
}
.discover-header-radius-btn{
  flex: 0 0 auto;
  height: 34px;
  min-height: 34px;
  border-radius: 10px;
  padding: 0 8px;
  font-size: 11px;
  white-space: nowrap;
}
.discover-header-controls .map-picker-radius-btn.discover-map-fullscreen-radius{
  position: static;
  left: auto;
  right: auto;
  top: auto;
  bottom: auto;
  z-index: auto;
  min-width: 64px;
  height: 34px;
  box-shadow: none;
}
.discover-header-to-picker{
  flex: 0 1 auto;
  min-width: 0;
  max-width: min(44vw, 220px);
  height: 34px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  display: inline-flex;
  align-items: center;
  gap: 0;
  box-sizing: border-box;
  white-space: nowrap;
  font-size: 12px;
  line-height: 1;
  color: var(--text-primary);
  overflow: hidden;
  text-overflow: ellipsis;
  cursor: pointer;
  user-select: none;
}
.discover-header-to-picker:focus-visible{
  outline: 2px solid color-mix(in srgb, var(--accent) 70%, white);
  outline-offset: 2px;
}
.discover-date-picker-overlay{
  z-index: 12240;
  align-items: flex-end;
  padding: 12px;
}
.discover-date-picker-sheet{
  width: min(760px, 96vw);
  max-width: 760px;
  max-height: min(86lvh, 760px);
  background: var(--surface-8);
  border-radius: 20px !important;
  align-self: center;
}
.discover-date-picker-header-text{
  min-width: 0;
  display: flex;
  align-items: baseline;
  gap: 8px;
  white-space: nowrap;
}
.discover-date-picker-limit-note{
  font-size: 11px;
  line-height: 1;
  color: var(--text-secondary);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.discover-date-picker-body{
  padding: 10px 12px 8px;
}
.discover-date-picker-body .time-pickers-row{
  gap: 10px;
  margin-top: 0;
}
.discover-date-picker-footer{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 10px 12px 12px;
  border-top: 1px solid var(--surface-border);
}
@media (max-width: 760px){
  .discover-date-picker-overlay{
    padding: 8px;
  }
  .discover-date-picker-body .time-pickers-row{
    flex-direction: column;
    gap: 8px;
  }
}
.discover-header-filter-btn{
  flex: 0 0 auto;
  min-height: 34px;
  white-space: nowrap;
  border-radius: 0;
  font-size: var(--text-md);
  font-weight: var(--weight-medium);
}
.discover-location-overlay{
  position: fixed;
  inset: 0;
  z-index: 260100;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 12px;
  background: rgba(0,0,0,0.62);
}
.discover-location-box,
.discover-filter-box{
  width: min(560px, 94vw);
  border-radius: 14px;
  border: 1px solid var(--surface-border);
  background: var(--surface-2);
  box-shadow: var(--shadow-elevated);
  color: var(--text-primary);
  padding: 12px;
}
.discover-location-title{
  font-size: var(--text-lg);
  font-weight: var(--weight-bold);
}
.discover-location-sub{
  margin-top: 6px;
  font-size: var(--text-sm);
  color: var(--text-secondary);
}
.discover-filter-list{
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.discover-filter-item{
  position: relative;
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 34px;
  padding: 6px 8px;
  border-radius: 10px;
  cursor: pointer;
  user-select: none;
}
.discover-filter-item:hover{
  background: color-mix(in srgb, var(--surface-11event) 72%, transparent);
}
.discover-filter-input{
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}
.discover-filter-check{
  --discover-fill-color: var(--surface-10event);
  position: relative;
  width: 24px;
  height: 24px;
  border-radius: 12px;
  border: 1px solid transparent;
  background:
    linear-gradient(
      145deg,
      var(--discover-fill-color),
      var(--surface-11event)
    ) padding-box,
    linear-gradient(
      320deg,
      var(--discover-cat-color, rgba(255,255,255,0.35)) 0%,
      rgba(0, 0, 0, 0) 100%
    ) border-box;
  box-sizing: border-box;
  transition: transform 140ms ease, filter 140ms ease, background 140ms ease;
}
.discover-filter-input:checked + .discover-filter-check{
  --discover-fill-color: var(--discover-cat-color, var(--surface-10event));
  filter: saturate(1.05);
}
.discover-filter-input:focus-visible + .discover-filter-check{
  outline: 2px solid color-mix(in srgb, var(--discover-cat-color, #ffffff) 60%, transparent);
  outline-offset: 1px;
}
.discover-filter-text{
  font-size: var(--text-sm);
  color: var(--text-primary);
}
@media (max-width: 640px) {
  .discover-header-controls{
    gap: 4px;
  }
  .discover-header-radius-btn{
    height: 32px;
    min-height: 32px;
    padding: 0 7px;
    font-size: 10px;
  }
  .discover-header-to-picker{
    height: 32px;
    padding: 0;
    font-size: 10px;
  }
}
.calendar-story-strip::-webkit-scrollbar{ display:none; }body.cal-settings-open .calendar-story-strip, body.event-modal-open .calendar-story-strip{
  display:none !important;
}body.participants-modal-open .calendar-story-strip{
  display:none !important;
}
body.cal-settings-open .calendar-view-toggle-btn,
body.event-modal-open .calendar-view-toggle-btn,
body.participants-modal-open .calendar-view-toggle-btn,
body.snapshot-mode .calendar-view-toggle-btn{
  display: none !important;
}.lang-icon{
  display: block;
  flex: 0 0 auto;
}img[src^="/static/svg/"],
img[src*="/static/svg/"],
.svg-icon{
  filter: var(--settings-icon-filter);
}
.demo-theme-toggle{
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.demo-theme-label{
  font-size: var(--text-xs);
  color: var(--text-secondary);
}
.demo-login-lang{
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.inline-login-overlay{
  position: fixed;
  inset: 0;
  z-index: 1220;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 16px;
  background: rgba(0, 0, 0, 0.55);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}
.inline-login-overlay.active{
  display: flex;
}
.inline-login-card{
  width: min(520px, 100%);
  background: var(--surface-2);
  color: var(--text-primary);
  border: 1px solid var(--surface-border);
  border-radius: 16px;
  box-shadow: var(--shadow-elevated);
  padding: 16px 16px 14px;
  position: relative;
}
.inline-login-card h2{
  margin: 0 0 12px;
  font-size: 18px;
  line-height: 1.2;
}
.inline-login-actions{
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.inline-login-provider-btn{
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  gap: 12px;
  width: 100%;
  min-height: 44px;
  border-radius: 12px;
  border: none;
  background: transparent;
  color: var(--text-primary);
  font-size: 16px;
  font-weight: 600;
  cursor: pointer;
  padding: 0;
  box-sizing: border-box;
}
.inline-login-provider-icon-wrap{
  width: 24px;
  height: 24px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 24px;
}
.inline-login-provider-icon{
  width: 24px;
  height: 24px;
  display: block;
}
#inlineLoginOverlay .inline-login-provider-icon{
  filter: none;
}
.inline-login-provider-label{
  font-size: 16px;
  line-height: 1.25;
  font-weight: 600;
  color: var(--text-primary);
}
.top-right-actions{
  position: fixed;
  top: calc(var(--zakat-header-bottom, calc(0px + 0px)) + 8px);
  right: calc(10px + 0px);
  z-index: 1000;
  display: flex;
  align-items: center;
  gap: 8px;
  overflow: visible;
  transition: top 180ms ease;
  will-change: top;
}
.dm-activation-banner{
  position: relative;
  order: 1;
  border: none;
  border-radius: 999px;
  padding: 8px 14px;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.2px;
  background: linear-gradient(135deg, rgba(255, 189, 89, 0.95), rgba(255, 120, 55, 0.95));
  color: #111;
  box-shadow: 0 12px 28px rgba(0,0,0,0.35);
  cursor: pointer;
}
.task-overlay-btn{
  height: 26px;
  padding: 0;
  cursor: pointer;
}
.task-overlay-btn{
  display: inline-flex;
  align-items: stretch;
  overflow: hidden;
}
.task-overlay-main{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 15px;
  padding: 0 10px;
  min-height: 100%;
  color: var(--text-primary);
  transition: background 160ms ease, color 160ms ease;
}
.task-overlay-btn.is-active .task-overlay-main{
  background: var(--accent);
  color: #ffffff;
}
.task-seg-control{
  display: inline-flex;
  align-items: center;
  gap: 4px;
  min-width: 0;
  box-sizing: border-box;
  padding: 3px;
}
.task-seg-control .task-seg-btn{
  min-height: 30px;
  padding: 4px 10px;
  border: 0;
  border-radius: 99px;
  background: transparent;
  color: var(--text-primary);
  font-size: 12px;
  font-weight: 600;
  opacity: 0.9;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
  overflow: hidden;
  text-overflow: clip;
}
.task-seg-control .task-seg-btn.is-active,
.task-seg-control .task-seg-btn[aria-pressed="true"]{
  background: var(--surface-2);
}
.task-overlay-mode-switch{
  display: inline-flex;
}
.task-mode-subhead-wrap .task-overlay-mode-switch{
  align-self: flex-start;
  margin: 0;
  flex: 0 0 auto;
  max-width: 100%;
}
.task-overlay-mode-switch.task-seg-control{
  box-shadow: none;
  backdrop-filter: none;
}
.task-overlay-mode-switch .task-overlay-mode-switch-btn--route{
  font-weight: 700;
  border: 1px solid color-mix(in srgb, var(--accent) 55%, var(--surface-border));
  background: color-mix(in srgb, var(--accent) 16%, transparent);
}
.task-overlay-mode-switch .task-overlay-mode-switch-btn--route.is-active,
.task-overlay-mode-switch .task-overlay-mode-switch-btn--route[aria-pressed="true"]{
  background: var(--accent);
  color: #fff;
  border-color: transparent;
}
.task-overlay-mode-switch .task-overlay-mode-switch-btn--share{
  border: 1px solid transparent;
}
.task-overlay{
  order: 2;
}
.task-overlay{
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: block;
  pointer-events: none;
}

body.public-feed-mode.discover-map-mode .task-overlay-head{
  display: none !important;
}

.task-overlay-head{
  position: fixed;
  top: calc(var(--zakat-header-bottom, calc(0px + 0px)) + 8px);
  right: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
  z-index: 500;
  pointer-events: auto;
  align-items: flex-end;
}
.task-overlay-head-row{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  border-radius: 7px 0px 0px 7px;
  backdrop-filter: blur(5px);
  box-shadow: 0 12px 28px rgba(0,0,0,0.35);
  pointer-events: auto;
  background: var(--surface-4);
}
.task-overlay-head-divider{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--text-primary);
  opacity: 0.62;
  font-size: 14px;
  line-height: 1;
  user-select: none;
}
.task-overlay-head .calendar-utc-panel{
  position: absolute;
  top: calc(100% + 20px);
  right: 0;
  margin: 0;
}
.task-overlay-filter-toggle{
  border: none;
  font-size: 15px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.task-overlay-slots-leave-btn{
  min-height: 30px;
  padding: 4px 12px;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--accent) 56%, var(--surface-border));
  background: color-mix(in srgb, var(--accent) 16%, transparent);
  color: var(--text-primary);
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
  white-space: nowrap;
}
.task-overlay-slots-leave-btn:hover{
  background: color-mix(in srgb, var(--accent) 22%, transparent);
}
.task-overlay-slots-leave-btn:active{
  transform: translateY(1px);
}
#calendarFilterToggle.is-force-disabled,
#calendarFilterToggle.disabled{
  opacity: 0.5 !important;
  pointer-events: none;
}
.task-overlay-filter-toggle:active{
  transform: scale(0.98);
}
.task-overlay-filter-panel{
  position: relative;
  display: inline-flex;
  align-items: center;
  min-width: 0;
  max-width: none;
  overflow: visible;
  pointer-events: auto;
}
.task-overlay-filter-panel .calendar-filter-more{
  position: absolute;
  top: calc(100% + 6px);
  right: 0;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 6px;
  max-height: 0;
  min-width: 140px;
  opacity: 0;
  transform: translateY(-4px);
  transition: max-height 220ms ease, opacity 180ms ease, transform 180ms ease;
  pointer-events: none;
  padding: 0;
}
.task-overlay-filter-panel.is-expanded{
  max-width: none;
}
.task-overlay-filter-panel.is-expanded .calendar-filter-more{
  max-height: 320px;
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
  padding: 8px;
  background: var(--surface-1);
  border-radius: 10px 0 0 10px;
  border: 1px solid var(--surface-border);
  box-shadow: 0 12px 28px rgba(0,0,0,0.35);
}
.task-overlay-filter-panel .calendar-tool-toggle{
  width: auto;
  min-height: 28px;
  height: 28px;
  justify-content: center;
  border-radius: 8px;
  padding: 0 10px;
  gap: 0;
  background: var(--surface-4);
  color: var(--text-primary);
}
.task-overlay-filter-panel .calendar-tool-toggle.is-on{
  background: var(--accent);
  color: #ffffff;
}
.task-overlay-filter-panel .calendar-tool-icon,
.task-overlay-filter-panel .cal-tool-icon,
.task-overlay-filter-panel .panelicon,
.task-overlay-filter-panel .calendar-filter-badge,
.task-overlay-filter-panel .calendar-tool-badge{
  display: none !important;
}
.task-overlay-filter-panel .calendar-tool-caption,
.task-overlay-filter-panel .cal-tool-label{
  font-size: 12px;
  line-height: 1;
  white-space: nowrap;
}
.task-main-head{
  display: flex;
  flex-direction: column;
  padding: 2px 12px 6px;
  flex: 0 0 auto;
}
.task-main-head .task-main-row{
  display: flex;
  align-items: stretch;
  flex-wrap: wrap;
  gap: 12px;
}
.task-main-head .task-filter-btn{
  flex: 1;
  border-radius: 5px;
  max-width: none;
}
.task-main-head .task-seg-control .task-seg-btn{
  border-radius: 9px;
}
.task-second-head{
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.task-mode-subhead-wrap{
  display: none;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  column-gap: 8px;
  row-gap: 6px;
  padding: 11px;
}
.task-mode-subhead{
  display: none;
  min-width: 0;
  flex: 1 1 180px;
}
.task-second-controls{
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.task-panel-head{
  display: none;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
  flex-wrap: wrap;
  padding: 4px 12px;
  border-bottom: 1px solid var(--surface-border);
}
.task-panel-head .task-owner-filter{
  width: 100%;
}
.task-overlay.is-open[data-mode="tasks"] .task-panel-head{
  display: flex;
}
.task-overlay[data-mode="tasks"] .task-second-controls{
  display: none;
}
.task-overlay[data-mode="plans"] .task-panel-head{
  display: none;
}
.task-plan-panel{
  position: fixed;
  right: 10px;
  top: 10px;
  display: none;
  width: min(360px, 92vw);
  min-width: 240px;
  min-height: 300px;
  max-width: 88vw;
  max-height: 80vh;
  overflow: visible;
  overscroll-behavior: contain;
  touch-action: pan-y;
  filter: drop-shadow(-10px 21px 36px rgba(0,0,0,0.6));
  pointer-events: auto;
}
.task-plan-panel.is-dragging{
  cursor: grabbing;
}
.task-panel-drag{
  position: relative;
  display: block;
  width: 100%;
  min-height: 22px;
  max-height: 22px;
  flex: 0 0 22px;
  margin: 0;
  padding: 0;
  border: none;
  background: transparent;
  height: 22px;
  cursor: grab;
  z-index: 2;
}
.task-panel-drag:before{
  content: '';
  position: absolute;
  top: 6px;
  left: 50px;
  right: 50px;
  height: 4px;
  border-radius: 2px;
  background: var(--surface-7);
}
.task-overlay.is-open .task-plan-panel{
  display: block;
}
.task-overlay-btn{
  display: inline-flex;
  align-items: stretch;
  gap: 0;
}
.task-overlay-idea{
  font-size: 14px;
  line-height: 1;
  margin-left: 2px;
  filter: drop-shadow(0 2px 6px rgba(0,0,0,0.45));
}
.task-overlay-btn.is-active{
  background: var(--surface-4);
}
.task-overlay-btn.is-muted,
.task-overlay-btn:disabled{
  opacity: 0.45;
  filter: saturate(0.35);
  cursor: default;
  pointer-events: none;
}
.task-overlay-btn--plan{
}
.task-body[data-panel="plans"]{
  display: none;
}
.task-body[data-panel="slots"]{
  display: none;
}
.task-overlay[data-mode="plans"] .task-body[data-panel="tasks"]{
  display: none;
}
.task-overlay[data-mode="plans"] .task-body[data-panel="slots"]{
  display: none;
}
.task-overlay[data-mode="plans"] .task-body[data-panel="clients"]{
  display: none;
}
.task-overlay[data-mode="plans"] .task-body[data-panel="plans"]{
  padding-top: 11px;
  display: flex;
}
.task-overlay[data-mode="tasks"] .task-body[data-panel="tasks"]{
  display: flex;
}
.task-overlay[data-mode="tasks"] .task-body[data-panel="slots"]{
  display: none;
}
.task-overlay[data-mode="tasks"] .task-body[data-panel="clients"]{
  display: none;
}
.task-overlay[data-mode="tasks"] .task-body[data-panel="plans"]{
  display: none;
}
.task-overlay[data-mode="slots"] .task-body[data-panel="tasks"]{
  display: none;
}
.task-overlay[data-mode="slots"] .task-body[data-panel="plans"]{
  display: none;
}
.task-overlay[data-mode="slots"] .task-body[data-panel="clients"]{
  display: none;
}
.task-overlay[data-mode="slots"] .task-body[data-panel="slots"]{
  display: flex;
  gap: 6px;
}
.task-overlay[data-mode="slots"] .task-second-controls{
  display: none;
}
.task-overlay[data-mode="clients"] .task-body[data-panel="tasks"]{
  display: none;
}
.task-overlay[data-mode="clients"] .task-body[data-panel="slots"]{
  display: none;
}
.task-overlay[data-mode="clients"] .task-body[data-panel="plans"]{
  display: none;
}
.task-overlay[data-mode="clients"] .task-body[data-panel="clients"]{
  display: flex;
}
.task-overlay[data-mode="clients"] .task-second-controls{
  display: none;
}
.task-plan-input{
  width: 100%;
  height: 100%;
  flex: 1 1 auto;
  resize: none;
  box-sizing: border-box;
  padding: 4px 14px;
  border: none;
  border-radius: 10px;
  background: var(--surface-3);
  color: var(--text-primary);
  font-size: 14px;
  outline: none;
  line-height: 2;
}
.task-overlay-dots{
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin-left: 2px;
}
.task-overlay-dot{
  width: 6px;
  height: 6px;
  border-radius: 999px;
  background: #ffffff;
  box-shadow: 0 2px 6px rgba(0,0,0,0.35);
}
.task-overlay-dot.current{
  background: #ffffff;
}
.task-overlay-dot.overdue{
  background: #ff0000;
}
.task-box{
  width: 100%;
  height: 100%;
  max-height: none;
  min-height: 0;
  border-radius: 22px;
  background: var(--surface-8);
  color: var(--text-primary);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.task-plan-resize{
  position: absolute;
  left: -10px;
  bottom: -10px;
  width: 50px;
  height: 50px;
  cursor: nwse-resize;
  z-index: 5;
  opacity: 0.7;
  border: none;
  background: transparent;
  transition: opacity 0.15s ease;
  touch-action: none;
  overscroll-behavior: contain;
}
.task-plan-resize:before{
  content: '';
  position: absolute;
  left: 13px;
  bottom: 13px;
  height: 32px;
  width: 32px;
  border: 7px double var(--surface-6);
  border-radius: 19px;
  outline-offset: -7px;
  -webkit-mask-image: conic-gradient(from 197deg, black 57deg, transparent 0);
  mask-image: conic-gradient(from 197deg, black 57deg, transparent 0);
  pointer-events: none;
}
.task-plan-resize:hover{
  opacity: 1;
}
body.task-panel-resizing{
  overscroll-behavior: contain;
  touch-action: none;
}
.task-header{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}
.task-title{
  font-weight: 800;
  font-size: 16px;
}
.task-close{
  border: none;
  background: transparent;
  color: inherit;
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
}
.task-body{
  box-shadow: 0 24px 30px -10px rgba(0, 0, 0, 0.3) inset;
  position: relative;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 0;
  padding: 0;
}
.task-body-loading-indicator{
  position: absolute;
  inset: 0;
  display: none;
  align-items: center;
  justify-content: center;
  pointer-events: none;
  z-index: 5;
}
.task-body-loading-indicator::before{
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.05);
}
.task-body-loading-indicator .calendar-sync-spinner{
  position: relative;
  z-index: 1;
}
.task-body.is-cache-loading > :not(.task-body-loading-indicator){
  filter: blur(2.5px);
  opacity: 0.56;
  pointer-events: none;
  user-select: none;
}
.task-body.is-cache-loading .task-body-loading-indicator{
  display: flex;
}
.task-body.task-body-plans{
  overflow: hidden;
  overscroll-behavior: contain;
}
.task-second-controls{
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 6px;
}
.task-overlay .task-second-controls{
  display: none;
}
.task-overlay.is-open[data-mode="plans"] .task-second-controls{
  display: flex;
  width: 100%;
  padding: 4px 8px 10px;
}
.task-second-controls .task-filter-btn{
  max-width: 140px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.task-second-controls .plan-tabs-row{
  display: flex;
  align-items: center;
  gap: 6px;
  width: 100%;
}
.task-second-controls .plan-tabs-left{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex: 0 0 auto;
}
.task-second-controls .plan-tabs-right{
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  flex: 1 1 auto;
  min-width: 0;
}
.task-second-controls .plan-tabs-overflow{
  display: none;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  width: 100%;
}
.task-second-controls .task-filter-add{
  min-width: 28px;
  width: 28px;
  height: 28px;
  padding: 0;
  font-size: 16px;
  line-height: 1;
  font-weight: 900;
}
.task-second-controls .task-filter-remove{
  min-width: 28px;
  width: 28px;
  height: 28px;
  padding: 0;
  font-size: 18px;
  line-height: 1;
  font-weight: 900;
}
.task-second-controls .task-filter-remove.is-disabled{
  opacity: 0.45;
  cursor: default;
}
.plan-note-modal{
  z-index: 1200;
}
.plan-note-sheet{
  width: min(420px, 92vw);
  max-width: 420px;
}
.plan-note-modal-title{
  font-size: 15px;
  font-weight: 700;
  margin-bottom: 8px;
}
.plan-note-modal-body{
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.plan-note-modal-message{
  font-size: 13px;
  color: var(--text-secondary);
}
.plan-note-modal-actions{
  display: flex;
  gap: 8px;
  margin-top: 12px;
}
.plan-note-modal-actions .primary,
.plan-note-modal-actions .secondary{
  flex: 1 1 0;
}
.task-plan-panel-body{
  display: none;
  flex: 1 1 auto;
  min-height: 0;
}
.task-plan-panel-body[data-plan-panel="notes"]{
  flex-direction: column;
  gap: 8px;
  flex: 1 1 auto;
  min-height: 0;
  overflow: hidden;
}
.task-plan-panel-body[data-plan-panel="canvas"]{
  flex-direction: column;
  gap: 8px;
}
.task-overlay.plan-notes-loading .task-plan-panel-body[data-plan-panel="notes"],
.task-overlay.plan-notes-loading #planTabs{
  filter: blur(2px);
  opacity: 0.7;
}
.task-overlay.plan-notes-loading .task-plan-panel-body[data-plan-panel="notes"]{
  pointer-events: none;
}
.plan-notes-simple{
  display: flex;
  flex-direction: column;
  gap: 8px;
  width: 100%;
  height: 100%;
  flex: 1 1 auto;
  min-height: 0;
}
.plan-notes-header{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.plan-notes-title{
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.02em;
  color: var(--text-muted);
}
.plan-notes-help{
  background: transparent;
  border: none;
  padding: 0;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.plan-notes-help .calendar-utc-help{
  order: -1;
}
.plan-notes-add-btn{
  min-width: 0;
  padding: 0 10px;
  height: 26px;
  font-size: 12px;
  line-height: 1;
}
.plan-notes-help-pop{
  position: fixed;
  max-width: min(260px, 70vw);
  background: rgba(0,0,0,0.88);
  color: #fff;
  padding: 8px 10px;
  border-radius: 10px;
  font-size: 12px;
  line-height: 1.35;
  z-index: 2006;
  opacity: 0;
  transform: translateY(4px);
  transition: opacity 0.18s ease, transform 0.18s ease;
  pointer-events: none;
}
.plan-notes-help-pop.is-show{
  opacity: 1;
  transform: translateY(0);
}
.plan-notes-list{
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding-right: 2px;
}
.plan-note-row{
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr) 20px;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  border-radius: 10px;
  background: var(--surface-3);
}
.plan-note-row:focus-within{
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--surface-7) 45%, transparent) inset;
}
.plan-note-row-check{
  margin: 0;
  width: 16px;
  height: 16px;
}
.plan-note-row-input{
  min-width: 0;
  width: 100%;
  border: none;
  background: transparent;
  color: var(--text-primary);
  font-size: 14px;
  line-height: 1.35;
  outline: none;
}
.plan-note-row-check:checked + .plan-note-row-input{
  text-decoration: line-through;
  opacity: 0.72;
}
.plan-note-row-remove{
  margin: 0;
  width: 20px;
  height: 20px;
  padding: 0;
  border: none;
  background: transparent;
  color: var(--surface-7);
  font-size: 20px;
  line-height: 20px;
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.plan-note-row-remove:disabled{
  opacity: 0.38;
  cursor: default;
}
.calendar-utc-panel{
  position: relative;
  display: none;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
  padding: 6px 10px;
  border-radius: 10px 0px 0px 10px;
  background: var(--surface-4);
  backdrop-filter: blur(5px);
  max-width: min(60vw, 220px);
  color: var(--text-primary);
  pointer-events: auto;
  cursor: pointer;
  z-index: 1200;
}
.calendar-utc-panel.is-on{
  display: flex;
}
.calendar-utc-help{
  width: 18px;
  height: 18px;
  min-width: 16px;
  border-radius: 12px;
  color: var(--surface-7);
  border-radius: 999px;
  border: 1.5px solid;  
  font-size: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  opacity: 0.8;
}
#calendarMyUtcLabelPanel .calendar-utc-help[data-utc-panel-help="1"]{
  border: none;
  background: red;
  color: white;
}
.calendar-utc-label{
  font-size: 12px;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.ui-card-overlay{
  position: fixed;
  inset: 0;
  z-index: 12040;
  display: none;
  align-items: center;
  justify-content: center;
  padding: min(18px, 4vw);
  background: rgba(0, 0, 0, 0.62);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}
.ui-card-overlay.is-open{
  display: flex;
}
.ui-card-sheet{
  width: min(680px, 94vw);
  max-height: min(86vh, 820px);
  background: var(--surface-8);
  color: var(--text-1);
  border: 1px solid var(--surface-border);
  border-radius: 16px;
  box-shadow: 0 24px 56px rgba(0,0,0,0.45);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.ui-card-scroll{
  padding: 12px;
  overflow: auto;
  overscroll-behavior: contain;
}
.ui-card-grid{
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 12px;
}
.ui-card-grid[data-ui-card-layout="double"]{
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.ui-card-block{
  min-width: 0;
  background: var(--surface-4);
  border: 1px solid color-mix(in srgb, var(--surface-border) 78%, transparent);
  border-radius: 12px;
  padding: 12px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.ui-card-title{
  margin: 0;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.35;
}
.ui-card-subtitle{
  font-size: 13px;
  line-height: 1.4;
  opacity: 0.9;
}
.ui-card-actions{
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.ui-card-actions > button{
  flex: 1 1 0;
  min-width: 120px;
}
@media (max-width: 680px){
  .ui-card-grid[data-ui-card-layout="double"]{
    grid-template-columns: minmax(0, 1fr);
  }
}
.info-popover{
  z-index: 12040;
}
.info-popover .info-popover-sheet{
  width: min(520px, 94vw);
}
.info-popover .info-card{
  display: none;
  font-size: 13px;
  line-height: 1.4;
}
.info-popover .info-card.is-active{
  display: flex;
}
.info-popover .info-card .info-text{
  display: block;
}
.info-text{
  display: inline;
}
.info-inline-link{
  border: none;
  background: transparent;
  color: var(--accent);
  padding: 0;
  margin: 0;
  font: inherit;
  line-height: inherit;
  cursor: pointer;
}
.info-inline-link--privacy-settings{
  font-weight: 600;
}
.info-text--utc{
  opacity: 1;
}
.info-text--privacy{
  opacity: 1;
}
.info-client-help{
  display: flex;
  flex-direction: column;
  gap: 8px;
  user-select: none;
  -webkit-user-select: none;
  touch-action: pan-y;
}
.info-client-help-image-row{
  width: 100%;
  aspect-ratio: 16 / 9;
  border-radius: 10px;
  overflow: hidden;
  background: var(--surface-3);
}
.info-client-help-image{
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}
.info-client-help-dots{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 10px;
}
.info-client-help-dot{
  width: 7px;
  height: 7px;
  border: none;
  border-radius: 999px;
  background: color-mix(in srgb, var(--text-primary) 28%, transparent);
  padding: 0;
  cursor: pointer;
  transition: width 180ms ease, background-color 180ms ease, opacity 180ms ease;
}
.info-client-help-dot.is-active{
  width: 20px;
  background: var(--accent);
}
.info-client-help-copy{
  min-height: 54px;
  font-size: 13px;
  line-height: 1.35;
  color: var(--text-1);
}
.info-action{
  display: inline;
  border: none;
  background: transparent;
  color: var(--accent);
  font-weight: 700;
  margin-left: 4px;
  padding: 0;
  cursor: pointer;
}
.plan-canvas-wrap{
  display: flex;
  flex-direction: column;
  gap: 8px;
  flex: 1 1 auto;
  min-height: 0;
  position: relative;
}
.plan-canvas-viewport{
  position: relative;
  flex: 1 1 auto;
  min-height: 0;
  background: rgba(47, 47, 47, 1);
  border: 1px solid var(--surface-border);
  border-radius: 12px;
  overflow: hidden;
  touch-action: none;
}
.plan-canvas-insert{
  position: absolute;
  display: flex;
  gap: 6px;
  padding: 6px 8px;
  background: rgba(12,12,12,0.92);
  border: 1px solid rgba(255,255,255,0.12);
  border-radius: 12px;
  z-index: 6;
}
.plan-canvas-insert-btn{
  min-width: 44px;
  padding: 4px 8px;
  border-radius: 10px;
  background: rgba(255,255,255,0.1);
  color: #fff;
  font-size: 12px;
  border: none;
}
.plan-canvas-exit{
  position: absolute;
  top: 8px;
  right: 8px;
  border-radius: 999px;
  border: none;
  background: rgba(0,0,0,0.6);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 4px 10px;
  height: 30px;
  z-index: 6;
}
.plan-canvas-exit-label{
  font-size: 12px;
  white-space: nowrap;
}
.plan-canvas-stage{
  position: absolute;
  left: 0;
  top: 0;
  width: 1px;
  height: 1px;
  transform: translate(0px, 0px);
  transform-origin: 0 0;
}
.plan-canvas-item{
  position: absolute;
  user-select: none;
  touch-action: none;
  -webkit-user-drag: none;
}
.plan-canvas-item.is-dragging{
  opacity: 0.85;
}
.plan-canvas-text{
  padding: 4px 6px;
  min-width: 24px;
  min-height: 20px;
  border-radius: 6px;
  background: rgba(255,255,255,0.08);
  color: var(--text-primary);
  font-size: 13px;
  white-space: pre-wrap;
}
.plan-canvas-text[data-size="s"]{ font-size: 12px; }
.plan-canvas-text[data-size="m"]{ font-size: 14px; }
.plan-canvas-text[data-size="l"]{ font-size: 18px; }
.plan-canvas-text[data-size="xl"]{ font-size: 22px; }
.plan-canvas-text.is-note{
  background: rgba(255,255,255,0.16);
  box-shadow: 0 6px 14px rgba(0,0,0,0.18);
}
.plan-canvas-text.is-editing{
  background: rgba(255,255,255,0.12);
  outline: 1px dashed var(--surface-7);
}
.plan-canvas-image{
  display: block;
  max-width: 260px;
  max-height: 260px;
  border-radius: 8px;
  -webkit-user-drag: none;
}
.plan-canvas-link{
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  min-width: 180px;
  border-radius: 10px;
  background: rgba(255,255,255,0.08);
  color: var(--text-primary);
  border: 1px solid rgba(255,255,255,0.1);
}
.plan-canvas-link-thumb{
  width: 46px;
  height: 46px;
  border-radius: 8px;
  background: rgba(255,255,255,0.12);
  flex: 0 0 auto;
}
.plan-canvas-link-thumb.has-image{
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
.plan-canvas-link-text{
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.plan-canvas-link-title{
  font-size: 13px;
  font-weight: 600;
}
.plan-canvas-link-desc{
  font-size: 11px;
  opacity: 0.8;
}
.plan-canvas-link-url{
  font-size: 11px;
  color: var(--text-muted);
}
.plan-canvas-frame{
  border: 1px dashed rgba(255,255,255,0.35);
  border-radius: 10px;
  min-width: 120px;
  min-height: 80px;
  background: rgba(255,255,255,0.03);
  padding: 18px 10px 10px;
}
.plan-canvas-frame-title{
  position: absolute;
  top: 4px;
  left: 8px;
  font-size: 12px;
  color: var(--text-muted);
  pointer-events: none;
}
.plan-canvas-line,
.plan-canvas-pen{
  overflow: visible;
}
.plan-canvas-toolbar{
  display: flex;
  align-items: flex-end;
  justify-content: center;
  gap: 18px;
  position: sticky;
  bottom: 8px;
  margin-top: auto;
  padding: 6px 8px 8px;
  z-index: 3;
}
.plan-canvas-tools{
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  border-radius: 999px;
  background: var(--surface-2);
  box-shadow: 0 6px 18px rgba(0,0,0,0.18);
}
.plan-canvas-tool{
  min-width: 60px;
}
.plan-canvas-tool.is-active{
  background: var(--accent);
  color: #fff;
}
.plan-canvas-popover{
  position: absolute;
  padding: 8px 10px;
  border-radius: 12px;
  background: rgba(24,24,24,0.94);
  color: #fff;
  border: 1px solid rgba(255,255,255,0.12);
  box-shadow: 0 10px 24px rgba(0,0,0,0.35);
  display: flex;
  flex-wrap: wrap;
  gap: 6px 8px;
  align-items: center;
  z-index: 5;
}
.plan-canvas-popover .plan-canvas-popover-group{
  display: flex;
  align-items: center;
  gap: 6px;
}
.plan-canvas-popover .plan-canvas-popover-btn{
  min-width: 32px;
  padding: 4px 8px;
  border-radius: 10px;
  background: rgba(255,255,255,0.1);
  color: #fff;
  font-size: 12px;
}
.plan-canvas-popover .plan-canvas-popover-btn.is-disabled{
  opacity: 0.5;
  pointer-events: none;
}
.plan-canvas-popover .plan-canvas-popover-color{
  width: 26px;
  height: 26px;
  border-radius: 999px;
  display: inline-block;
  cursor: pointer;
}
.plan-canvas-popover .plan-canvas-popover-color-input{
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}
.plan-canvas-popover .plan-canvas-popover-btn.is-active{
  background: var(--accent);
  color: #fff;
}
.plan-canvas-popover .plan-canvas-popover-input{
  background: rgba(255,255,255,0.1);
  border: 1px solid rgba(255,255,255,0.2);
  color: #fff;
  border-radius: 8px;
  padding: 4px 6px;
  font-size: 12px;
}
.task-section-title{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 6px;
}
.task-section-label{
  font-size: 12px;
  font-weight: 700;
  opacity: 0.7;
  padding-left: 8px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
.task-section-label-inline{ }
.task-section-toggle{
  border: none;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: start;
  gap: 10px;
  padding: 4px 2px;
  background: transparent;
  color: var(--text-primary);
  cursor: pointer;
}
.task-section-toggle.is-empty{
  opacity: 0.55;
}
.task-section-toggle-right{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}
.task-section-content{
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.task-section-dots{
  display: inline-flex;
  align-items: center;
  gap: 4px;
  flex-wrap: wrap;
  max-width: 100%;
}
.task-section-dots.is-empty{
  width: 8px;
  min-width: 8px;
}
.task-section-dot{
  width: 6px;
  height: 6px;
  border-radius: 999px;
  display: inline-block;
}
.task-section-dot.is-current,
.task-section-dot.is-pending{
  background: #ffffff;
}
.task-section-dot.is-overdue,
.task-section-dot.is-done{
  background: #ff0000;
}
.task-filter{
  display: inline-flex;
  align-items: center;
  gap: 4px;
  background: var(--surface6);
}
.task-filter-btn{
  background: var(--surface-3);
  color: var(--text-primary);
  padding: 4px 12px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  opacity: 0.7;
  cursor: pointer;
}
.task-filter-btn.is-active{
  background: var(--surface-7);
  opacity: 1;
}
.task-list{
  display: flex;
  border-radius: 10px;
  flex-direction: column;
  gap: 2px;
}
.task-item{
  border: none;
  text-align: left;
  background: var(--surface-3);
  color: var(--text-primary);
  padding: 10px 12px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  cursor: pointer;
}
.task-item-group{
  border: none;
  text-align: left;
  background: var(--surface-3);
  box-shadow: 0 3px 10px rgba(0,0,0,0.35);
  color: var(--text-primary);
  padding: 10px 12px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.task-item-group-head{
  cursor: pointer;
}
.task-item-group-titlewrap{
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.task-item-group-sub{
  font-size: 11px;
  opacity: 0.7;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.task-item-group-meta{
  font-size: 11px;
  opacity: 0.86;
  line-height: 1.25;
}
.task-item-group-rows{
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.task-done-subhead{
  font-size: 11px;
  opacity: 0.78;
  padding: 2px 8px 0;
  text-transform: uppercase;
  letter-spacing: 0.4px;
}
.task-done-history-toggle{
  margin-top: 2px;
}
.task-item.task-item--grouped{
  background: var(--surface-2);
  padding: 8px 10px;
  border-radius: 10px;
}
.task-item-head{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.task-item-cal{
  border: none;
  background: transparent;
  color: var(--text-secondary);
  font-size: 11px;
  font-weight: 700;
  padding: 2px 6px;
  border-radius: 999px;
  cursor: pointer;
}
.task-item-cal:hover{
  color: var(--text-primary);
  background: rgba(255,255,255,0.08);
}
.task-item-title{
  font-weight: 700;
  font-size: 14px;
}
.task-item-head-actions{
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.task-item-group-progress{
  min-width: 36px;
  height: 20px;
  padding: 0 7px;
  border-radius: 999px;
  border: 1px solid var(--surface-border);
  background: var(--surface-2);
  color: var(--text-secondary);
  font-size: 11px;
  font-weight: 700;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
}
.task-item-done-btn{
  min-width: 64px;
  height: 28px;
  border-radius: 999px;
  padding: 0 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--surface-border);
  background: transparent;
  color: var(--text-primary);
  font-size: 11px;
  font-weight: 700;
  line-height: 1;
}
.task-item-done-btn.is-done{
  background: rgba(34, 197, 94, 0.16);
  border-color: rgba(34, 197, 94, 0.55);
}
.task-item-done-btn.is-loading{
  opacity: 0.72;
  pointer-events: none;
}
.task-item-meta{
  font-size: 12px;
  opacity: 0.7;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.task-slot-item{
  gap: 5px;
}
.task-slot-item-meta{
  font-size: 11px;
  opacity: 0.75;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.task-slot-requests-pill{
  min-width: 20px;
  height: 20px;
  padding: 0 6px;
  border-radius: 999px;
  border: 1px solid var(--surface-border);
  background: var(--surface-2);
  color: var(--text-secondary);
  font-size: 11px;
  font-weight: 700;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.task-slot-requests-pill.has-requests{
  background: color-mix(in srgb, var(--accent) 16%, var(--surface-2));
  border-color: color-mix(in srgb, var(--accent) 56%, var(--surface-border));
  color: var(--text-primary);
}
.task-item-status{
  margin-top: 4px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-height: 18px;
}
.task-item-status-percent{
  min-width: 38px;
  font-size: 11px;
  font-weight: 800;
  opacity: 0.92;
}
.task-item-status-group{
  display: inline-flex;
  align-items: center;
  gap: 4px;
  min-width: 0;
}
.task-item-status-count{
  font-size: 10px;
  font-weight: 700;
  opacity: 0.86;
  line-height: 1;
}
.task-item-status-group > img{
  width: 12px;
  height: 12px;
  display: block;
  opacity: 0.8;
}
.task-item-status-stack{
  display: inline-flex;
  align-items: center;
}
.task-item-status-stack--loading{
  padding-left: 0;
  min-width: 16px;
  justify-content: center;
}
.task-item-status-spinner.calendar-sync-spinner{
  width: 12px;
  height: 12px;
  border-width: 2px;
}
.task-item-status-avatar{
  width: 20px;
  height: 20px;
  border-radius: 99px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.task-item-status-avatar.task-item-status-avatar--photo{
  background-color: var(--surface-5);
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  color: transparent;
}
.task-item-status-avatar:first-child{
  margin-left: 0;
}
.task-item-status-avatar--more{
  font-size: 8px;
  background: var(--surface-5);
}
.ev-taskitem-main{
  min-width: 0;
}
.ev-taskitem-status{
  margin-top: 5px;
}
.task-item-actions{
  margin-top: 4px;
  display: flex;
  justify-content: flex-end;
}
.task-item-disconnect{
  min-height: 28px;
  padding: 5px 10px;
  font-size: 11px;
  border-radius: 999px;
}
.task-empty{
  font-size: 13px;
  opacity: 0.7;
  text-align: center;
  padding: 12px 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
}
.task-empty-help,
.task-empty-help-btn{
  background: transparent;
  border: none;
  padding: 0;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.task-empty-link-btn{
  border: none;
  background: transparent;
  color: var(--accent);
  font: inherit;
  text-decoration: none;
  cursor: pointer;
  padding: 0;
  margin: 0;
}
#taskSlotsListEmpty{
  opacity: 1;
  flex-direction: column;
  align-items: center;
  gap: 8px;
}
.task-mode-subhead-wrap .task-slots-subhead,
.task-mode-subhead-wrap .task-clients-subhead{
  flex: 1 1 180px;
  min-width: 0;
  padding: 0 2px;
}
.task-mode-subhead-wrap .task-clients-subhead{
  align-items: stretch;
}
.task-clients-subhead-top{
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-wrap: nowrap;
  gap: 10px;
  min-width: 0;
}
.task-clients-subhead-top .event-client-base-title{
  flex: 0 1 auto;
  min-width: 0;
}
.task-clients-subhead-top .event-client-base-scopes{
  display: flex;
  align-items: center;
  justify-content: flex-end;
  min-width: 0;
  margin-left: auto;
  margin-top: 0;
  margin-bottom: 0;
  max-width: 100%;
}
.task-clients-subhead-top .event-client-base-scopes.task-seg-control{
  width: auto;
  justify-content: flex-start;
  flex-wrap: nowrap;
}
.task-clients-subhead-top .event-client-base-scope-btn.task-seg-btn{
  flex: 0 1 auto;
}
.task-empty-help-pop{
  position: fixed;
  max-width: min(260px, 70vw);
  background: rgba(0,0,0,0.88);
  color: #fff;
  padding: 8px 10px;
  border-radius: 10px;
  font-size: 12px;
  line-height: 1.35;
  z-index: 2006;
  opacity: 0;
  transform: translateY(4px);
  transition: opacity 0.18s ease, transform 0.18s ease;
  pointer-events: auto;
}
.task-empty-help-pop.is-show{
  opacity: 1;
  transform: translateY(0);
}
.task-empty-help-link{
  color: var(--accent);
  text-decoration: underline;
  text-underline-offset: 2px;
  cursor: pointer;
}
.dm-activation-banner.is-blocked{
  background: linear-gradient(135deg, rgba(248, 113, 113, 0.95), rgba(244, 63, 94, 0.95));
  color: #fff;
}
.dm-activation-overlay{
  position: fixed;
  inset: 0;
  z-index: 12100;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 16px;
  background: rgba(0,0,0,0.58);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}
body.dm-activation-open{
  overflow: hidden;
}
.dm-activation-box{
  width: min(560px, 92vw);
  border-radius: 18px;
  background: var(--surface-2);
  color: var(--text-primary);
  box-shadow: var(--shadow-elevated);
  border: 1px solid var(--surface-border);
  padding: 14px 14px 12px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.dm-activation-sec{
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.dm-activation-sec svg{
  width: min(240px, 70vw);
  height: auto;
  animation: dm-sec-float 5s ease-in-out infinite;
}
.dm-activation-title{
  font-weight: 800;
  font-size: 16px;
}
.dm-activation-message{
  font-size: 13px;
  color: var(--text-secondary);
  line-height: 1.35;
}
.dm-activation-actions{
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.demo-lang-select{
  border: none;
  background: transparent;
  font-size: var(--text-sm);
  font-weight: var(--weight-medium);
  cursor: pointer;
  color: var(--text-primary);
  -webkit-appearance: none;
  appearance: none;
}
.demo-sec-wrap{
  margin-top: 10px;
  display: flex;
  justify-content: center;
}
.demo-sec-host{
  width: min(360px, 80%);
  max-width: 360px;
  color: var(--text-primary);
}
.demo-sec-host svg{
  width: 100%;
  height: auto;
  display: block;
  color: currentColor;
}
.demo-sec-host svg text{
  fill: currentColor !important;
  stroke: currentColor !important;
}

/* Demo banner (calendarThemeBanner) */
.demo-banner-meta{
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  text-align: center;
}
.demo-banner-sec{
  width: min(360px, 80%);
  max-width: 360px;
  color: var(--text-primary);
}
.demo-banner-sec svg{
  width: 100%;
  height: auto;
  display: block;
}
.demo-banner-sec svg text,
.demo-banner-sec svg path,
.demo-banner-sec svg rect,
.demo-banner-sec svg circle,
.demo-banner-sec svg ellipse,
.demo-banner-sec svg line,
.demo-banner-sec svg polyline,
.demo-banner-sec svg polygon{
  fill: currentColor !important;
  stroke: currentColor !important;
}
.demo-banner-lines{
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
  align-items: center;
}
.demo-banner-line{
  font-size: var(--text-sm);
  line-height: 1.25;
  color: var(--text-secondary);
  text-align: center;
}
.demo-lang-btn.is-active{
  background: var(--btn-bg-secondary);
  color: var(--text-primary);
}
.event-participants-tab{
  grid-column: 1 / -1;
  display: none;
}
.event-participants-manager{
  grid-column: 1 / -1;
  display: none;
  background: var(--surface-4);
  margin-top: 8px;
}
.event-open-row{
  display: none;
  width: 100%;
  grid-column: 1 / -1;
  margin-top: 10px;
}
.event-open-fix-row{
  display: none;
  width: 100%;
  grid-column: 1 / -1;
  margin-top: 8px;
}
.event-open-extra{
  grid-column: 1 / -1;
  display: none;
}
.event-open-join{
  display: none;
}
.event-full-btn{
  width: 100%;
  border-radius: 999px;
}
.event-hint{
  display: none;
  grid-column: 1 / -1;
  margin-top: 8px;
  font-size: 12px;
  line-height: 1.35;
  opacity: 0.75;
}
.event-hint-inline{
  margin-top: 8px;
  font-size: 12px;
  line-height: 1.35;
  opacity: 0.75;
  display: none;
}
.event-hint-inline.event-hint-strong{
  opacity: 1;
  font-weight: 600;
  text-decoration: underline;
}
.event-vis-slash,
.event-vis-secondary{
  opacity: 0.45;
}
.event-vis-primary{
  font-weight: 600;
}
.event-note-block{
  grid-column: 1 / -1;
  font-size: 13px;
}
.event-note-block-tight{
  margin-top: 6px;
}
.event-note-title{
  margin-bottom: 6px;
}
.event-chip-row{
  display: flex;
  gap: 8px;
}
.event-chip{
  flex: 1;
  padding: 8px 10px;
  cursor: pointer;
}
.event-chip.is-active{
  background: var(--surface-6);
  border-color: rgba(255,255,255,0.28);
  color: var(--surface-2);
}
.event-chip.is-disabled,
.event-chip:disabled{
  opacity: 0.38;
  cursor: default;
  pointer-events: none;
}
.event-slot-demo-badges{
  display: inline-flex;
  left: 150px;
  position: absolute;
  top: 0;
  gap: 6px;
  flex-wrap: wrap;
  opacity: 0.8;
}
.event-slot-demo-badge{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 14px;
  padding: 0 6px;
  border-radius: 0 0 6px 6px;
  font-size: 10px;
  font-weight: 700;
  line-height: 1;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
}
.event-slot-demo-badge.is-green{
  background: rgb(52, 199, 89);
  color: #ffffff;
}
.event-slot-demo-badge.is-yellow{
  background: rgb(255, 204, 0);
  color: #101010;
}
.event-slot-demo-badge.is-red{
  background: rgb(255, 59, 48);
  color: #ffffff;
}
.event-task-demo-badges{
  display: inline-flex;
  right: 40px;
  position: absolute;
  top: 0;
  gap: 8px;
  flex-wrap: wrap;
  opacity: 0.8;
}
.event-task-demo-badge{
  pointer-events: none;
}
.event-task-demo-badge .ev-task-dots{
  gap: 3px;
  margin-left: 4px;
}
.event-task-demo-badge .ev-task-dot{
  width: 5px;
  height: 5px;
}
.event-participants-list-wrap{
  grid-column: 1 / -1;
  display: none;
  margin-top: 6px;
  font-size: 13px;
}
.event-participants-count-row{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 6px 8px;
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 10px;
  cursor: pointer;
}
.event-participants-count-label{
  opacity: 0.8;
}
.event-participants-count-value{
  opacity: 0.95;
}
.event-participants-list{
  margin-top: 6px;
  display: none;
}
/* List events: occupy full width of the line */
.list .rowline > .item{
  flex: 1 1 auto;
  width: 100%;
}body.has-story-strip .calendar-filter-bar{
  display:none !important;
}.calendar-story-item{
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0;
  background: transparent;
  border: none;
  padding: 0;
  cursor: pointer;
  max-width: 74px;
  min-width: 68px;
  flex: 0 0 auto;
  -webkit-tap-highlight-color: transparent;
}.calendar-story-item--recent{
  opacity: 0.5;
}.calendar-story-item--recent.calendar-story-item--selected{
  opacity: 1;
}.calendar-story-item--folder .calendar-story-avatar{
  background: var(--surface-4);
  border: 1px solid var(--surface-border);
  box-shadow: 0 0 8px rgba(0,0,0,0.28);
}.calendar-story-item--folder.is-open .calendar-story-avatar{
  border-color: var(--accent);
  box-shadow: 0 0 0 1px var(--accent), 0 0 10px rgba(0,0,0,0.3);
}.calendar-story-folder-avatar{
  display: flex;
  align-items: center;
  justify-content: center;
}.calendar-story-folder-grid{
  width: 34px;
  height: 34px;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 3px;
}.calendar-story-folder-mini{
  display: block;
  border-radius: 6px;
  background-image: var(--story-bg, linear-gradient(135deg, rgba(255,255,255,0.15), rgba(255,255,255,0.06)));
  background-size: cover;
  background-position: center;
  border: 1px solid rgba(255,255,255,0.14);
}.calendar-story-folder-mini.is-empty{
  background: rgba(255,255,255,0.08);
  border-color: rgba(255,255,255,0.06);
}.calendar-story-folder-count{
  position: absolute;
  right: -4px;
  bottom: -4px;
  min-width: 16px;
  height: 16px;
  border-radius: 999px;
  padding: 0 5px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 10px;
  font-weight: 800;
  line-height: 1;
  color: #fff;
  background: var(--accent);
  box-shadow: 0 4px 12px rgba(0,0,0,0.35);
}.calendar-story-folder-popover{
  position: fixed;
  z-index: 1240;
  background: var(--surface-2);
  background: color-mix(in srgb, var(--surface-2) 88%, #000 12%);
  border: 1px solid var(--surface-border);
  border-radius: 16px;
  box-shadow: 0 20px 54px rgba(0,0,0,0.42);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  opacity: 0;
  transform: translateY(8px) scale(0.98);
  transition: opacity .14s ease, transform .14s ease;
}.calendar-story-folder-popover.is-open{
  opacity: 1;
  transform: translateY(0) scale(1);
}.calendar-story-folder-head{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 10px 12px 8px;
  border-bottom: 1px solid var(--surface-border);
}.calendar-story-folder-title{
  font-size: 13px;
  font-weight: 800;
  color: var(--text-primary);
}.calendar-story-folder-close{
  width: 28px;
  height: 28px;
  border-radius: 999px;
  border: none;
  background: var(--surface-4);
  color: var(--text-primary);
  font-size: 18px;
  line-height: 1;
  cursor: pointer;
}.calendar-story-folder-scroll{
  overflow: auto;
  padding: 8px;
  display: grid;
  gap: 8px;
}.calendar-story-folder-section{
  display: grid;
  gap: 6px;
}.calendar-story-folder-section-title{
  font-size: 11px;
  font-weight: 700;
  color: var(--text-secondary);
  padding: 0 4px;
}.calendar-story-folder-list{
  display: grid;
  gap: 4px;
}.calendar-story-folder-row{
  display: grid;
  grid-template-columns: 34px 1fr auto;
  align-items: center;
  gap: 8px;
  border-radius: 10px;
  padding: 6px;
  background: transparent;
  cursor: pointer;
  outline: none;
}.calendar-story-folder-row:hover,
.calendar-story-folder-row:focus-visible{
  background: var(--surface-4);
}.calendar-story-folder-row.is-selected{
  background: color-mix(in srgb, var(--accent) 16%, transparent 84%);
}.calendar-story-folder-row-avatar{
  width: 34px;
  height: 34px;
  border-radius: 999px;
}.calendar-story-folder-row-body{
  min-width: 0;
  display: grid;
  gap: 1px;
}.calendar-story-folder-row-title{
  font-size: 12px;
  font-weight: 700;
  color: var(--text-primary);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}.calendar-story-folder-row-sub{
  font-size: 10px;
  color: var(--text-secondary);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}.calendar-story-folder-pin{
  width: 24px;
  height: 24px;
  border-radius: 8px;
  border: 1px solid var(--surface-border);
  background: var(--surface-3);
  color: var(--text-secondary);
  cursor: pointer;
  font-size: 13px;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}.calendar-story-folder-pin.is-on{
  color: #fff;
  background: var(--accent);
  border-color: transparent;
}.calendar-story-folder-pin-spacer{
  width: 24px;
  height: 24px;
  display: inline-block;
}.calendar-story-folder-empty{
  font-size: 11px;
  color: var(--text-secondary);
  padding: 8px 6px;
}.calendar-story-folder-foot{
  border-top: 1px solid var(--surface-border);
  padding: 8px;
  display: flex;
  justify-content: flex-start;
}.calendar-story-folder-create-btn{
  width: 100%;
  border: 1px solid transparent;
  border-radius: 12px;
  min-height: 40px;
  padding: 0 12px;
  background: var(--accent);
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
  cursor: pointer;
  position: relative;
}.calendar-story-folder-create-btn:active{
  transform: translateY(0.5px);
}.calendar-story-folder-create-btn:focus-visible{
  outline: 2px solid color-mix(in srgb, var(--accent) 42%, #fff 58%);
  outline-offset: 1px;
}.calendar-story-folder-create-icon{
  width: 16px;
  height: 16px;
  display: block;
  filter: brightness(0) invert(1);
}.calendar-story-folder-create-text{
  display: inline-block;
}.calendar-story-folder-create-badge{
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: #ff3b30;
  box-shadow: 0 0 0 2px rgba(255,255,255,0.5);
}.mirror-picker-overlay{
  position: fixed;
  inset: 0;
  z-index: 12110;
  background: rgba(0,0,0,0.45);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}.mirror-picker-sheet{
  position: absolute;
  left: 50%;
  bottom: 18px;
  transform: translateX(-50%);
  width: min(720px, 92vw);
  background: rgba(20,20,20,0.98);
  color: #fff;
  border-radius: 18px;
  padding: 14px 14px 12px;
  box-shadow: 0 18px 40px rgba(0,0,0,0.65);
}.mirror-picker-head{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}.mirror-picker-title{
  font-size: 15px;
  font-weight: 800;
}.mirror-picker-close{
  border-radius: 999px;
  padding: 8px 10px;
  font-size: 12px;
}.mirror-picker-list{
  margin-top: 10px;
  display: flex;
  gap: 10px;
  overflow-x: auto;
  overflow-y: visible;
  -webkit-overflow-scrolling: touch;
  padding: 6px 2px 2px;
  align-items: flex-start;
}.mirror-picker-list .calendar-story-item{
  max-width: 86px;
  min-width: 72px;
}.mirror-picker-list .calendar-story-avatar{
  margin-top: 0;
}.mirror-picker-list .mirror-picker-story-label{
  display: -webkit-box;
  max-width: 86px;
  font-size: 11px;
  font-weight: 500;
  text-align: center;
  white-space: normal;
  background: var(--sheader);
  padding: 2px;
  border-radius: 6px;
  overflow: hidden;
  color: var(--text-primary);
  opacity: 0.82;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  word-break: normal;
  line-height: 1.15;
}.calendar-story-avatar{
  margin-top: 10px;
  width: 52px;
  height: 52px;
  border-radius: 999px;
  background-image: var(--story-bg, linear-gradient(135deg, rgba(255,255,255,0.12), rgba(255,255,255,0.06)));
  background-size: cover;
  background-position: center;
  position: relative;
  --cal-avatar-selected-shadow: 0 0px 12px rgba(0,0,0,1);
  box-shadow: 0 0 8px rgba(136, 136, 136, 0.7);
  outline: none;
}.calendar-avatar.is-selected{
  opacity: 1;
  outline: 2px solid white;
}.calendar-story-badges{
  position: absolute;
  top: 0px;
  right: 0px;
  display:flex;
  gap: 4px;
  align-items:center;
  pointer-events: none;
}.calendar-story-badge{
  position: absolute;
  min-width: 18px;
  height: 18px;
  border-radius: 999px;
  padding: 0 6px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size: 11px;
  font-weight: 900;
  line-height: 1;
  color: #fff;
  box-shadow: 0 10px 20px rgba(0,0,0,0.28);
  border: none;
  pointer-events: none;
}.calendar-story-badge--updates{
  right: -2px;
  top: -2px;
  background: rgb(0,122,255);
}.calendar-story-badge--requests{
  left: -2px;
  top: -2px;
  background: rgb(255,59,48);
}
.calendar-story-badges .calendar-story-badge{
  position: static;
  left: auto;
  right: auto;
  top: auto;
  bottom: auto;
}
.calendar-story-badge--tg{
  width: 16px;
  height: 16px;
  min-width: 16px;
  padding: 0;
  color: var(--text-primary);
  display:flex;
  align-items:center;
  justify-content:center;
}
.calendar-story-badge--tg .calendar-story-badge-icon{
  width: 16px;
  height: 16px;
  display: block;
}h1{
  font-size: 18px;
  margin: 0 0 12px;
}.month{
  text-align: end;
  font-weight: 500;
  margin: 40px 0px -24px 0px;
  position: sticky;
  top: calc(var(--zakat-header-bottom, calc(0px + 0px)) + 8px);
  z-index: 70;
  display: inline-block;
  cursor: pointer;
}.month-label{
  display: inline-block;
  padding: 4px 10px;
  border-radius: 0px 7px 7px 0px;
  background: var(--surface-4);
  box-shadow: 0 12px 28px rgba(0,0,0,0.35);
  backdrop-filter: blur(5px);
}.month-block{
  padding-top: 24px;
}/* контейнер для list / grid */
#root.list{
  --calendar-pull-space-top: 0px;
  --calendar-pull-space-bottom: 0px;
  display: flex;
  flex-direction: column;
  gap: 0;
  height: 100%;
  min-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
  overscroll-behavior-y: contain;
  overscroll-behavior-x: contain;
  -webkit-overflow-scrolling: touch;
  position: relative; /* for task connectors overlay */
  will-change: scroll-position;
}
#root.list > .calendar-list-content{
  display: flex;
  flex-direction: column;
  gap: 0;
  min-height: 100%;
  width: 100%;
}
#root.calendar-switch-slide,
#rootGrid.calendar-switch-slide,
#calendarSplitView.calendar-switch-slide,
#calendarSplitPaneList.calendar-switch-slide,
#calendarSplitPaneGrid.calendar-switch-slide{
  transform: translate3d(34px, 0, 0);
  opacity: 0.06;
}
#root.calendar-switch-slide.calendar-switch-slide-active,
#rootGrid.calendar-switch-slide.calendar-switch-slide-active,
#calendarSplitView.calendar-switch-slide.calendar-switch-slide-active,
#calendarSplitPaneList.calendar-switch-slide.calendar-switch-slide-active,
#calendarSplitPaneGrid.calendar-switch-slide.calendar-switch-slide-active{
  transform: translate3d(0, 0, 0);
  opacity: 1;
  transition: transform 240ms cubic-bezier(.22,.78,.25,1), opacity 240ms ease;
  will-change: transform, opacity;
}
@media (prefers-reduced-motion: reduce){
  #root.calendar-switch-slide,
  #rootGrid.calendar-switch-slide,
  #calendarSplitView.calendar-switch-slide,
  #root.calendar-switch-slide.calendar-switch-slide-active,
  #rootGrid.calendar-switch-slide.calendar-switch-slide-active,
  #calendarSplitView.calendar-switch-slide.calendar-switch-slide-active,
  #calendarSplitPaneList.calendar-switch-slide,
  #calendarSplitPaneGrid.calendar-switch-slide,
  #calendarSplitPaneList.calendar-switch-slide.calendar-switch-slide-active,
  #calendarSplitPaneGrid.calendar-switch-slide.calendar-switch-slide-active{
    transform: none !important;
    opacity: 1 !important;
    transition: none !important;
    will-change: auto !important;
  }
}
#calendarSplitView{
  position: relative;
  width: 100%;
  min-width: 0;
  height: 100dvh;
  min-height: 0;
  max-height: 100dvh;
  overflow: hidden;
}
#calendarSplitPaneList{
  height: 100%;
  min-height: 0;
  overflow: hidden;
}
#calendarSplitPaneGrid,
#calendarSplitDivider,
#rootGrid{
  display: none;
}
.calendar-split-pane{
  min-width: 0;
}
.calendar-split-divider{
  position: relative;
  width: 24px;
  margin-inline: -2px;
  z-index: 3;
  cursor: col-resize;
  touch-action: none;
  background: transparent;
  border: 0;
  outline: none;
}
.calendar-split-divider::before{
  content: '';
  position: absolute;
  left: 50%;
  top: 14px;
  bottom: 14px;
  width: 3px;
  transform: translateX(-50%);
  border-radius: 999px;
  background: color-mix(in srgb, var(--surface-6, #8ea0bf) 58%, transparent);
}
.calendar-split-divider::after{
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  width: 10px;
  height: 52px;
  transform: translate3d(-50%, -50%, 0);
  transform-origin: 50% 50%;
  border-radius: 999px;
  background: color-mix(in srgb, var(--surface-6, #8ea0bf) 84%, #ffffff 16%);
  opacity: 0.66;
}

.calendar-split-divider.is-dragging::before,
.calendar-split-divider.is-dragging::after{
  opacity: 1;
}
body.calendar-split-active #calendarSplitView{
  --calendar-split-ratio: 50%;
  --calendar-split-divider: 18px;
  --calendar-split-min-left: 120px;
  --calendar-split-min-right: 130px;
  display: grid;
  grid-template-columns: minmax(var(--calendar-split-min-left), var(--calendar-split-ratio)) var(--calendar-split-divider) minmax(var(--calendar-split-min-right), 1fr);
  align-items: stretch;
  width: 100%;
  box-sizing: border-box;
  min-height: 0;
  height: 100%;
  max-height: none;
  overflow: hidden;
  column-gap: 0;
}
body.calendar-split-active.calendar-mode-panel-rail #calendarSplitView{
  height: 100%;
  max-height: none;
  padding-right: var(--zakat-modepanel-right, 0px);
  box-sizing: border-box;
  padding-left: var(--zakat-modepanel-left, 0px);
}
body.public-feed-mode.discover-map-mode.calendar-split-active #calendarSplitView{
  height: 100% !important;
  max-height: none !important;
}
body.calendar-split-active.calendar-mode-panel-rail #calendarSplitPaneList,
body.calendar-split-active.calendar-mode-panel-rail #calendarSplitPaneGrid,
body.calendar-split-active.calendar-mode-panel-rail #root,
body.calendar-split-active.calendar-mode-panel-rail #rootGrid{
  height: 100%;
  min-height: 0;
}
body.calendar-split-active #calendarSplitPaneGrid,
body.calendar-split-active #calendarSplitDivider,
body.calendar-split-active #rootGrid{
  display: block;
}
body.calendar-split-active.calendar-mode-panel-rail #calendarSplitPaneList,
body.calendar-split-active.calendar-mode-panel-rail #calendarSplitPaneGrid{
  box-sizing: border-box;
}
body.calendar-split-active #calendarSplitPaneList,
body.calendar-split-active #calendarSplitPaneGrid{
  height: 100%;
  min-height: 0;
  overflow: hidden;
}
body.calendar-split-active #root,
body.calendar-split-active #rootGrid{
  display: block;
  height: 100%;
  min-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}

body.calendar-mode-panel-rail #calendarSplitView{
  --zakat-modepanel-h: 0px !important;
}

body.discover-map-mode .task-overlay-head{
  display: none !important;
}
body.public-feed-mode #calendarSplitPaneGrid,
body.public-feed-mode #calendarSplitDivider,
body.public-feed-mode #rootGrid{
  display: none !important;
}
body.public-feed-mode:not(.discover-map-mode) #calendarSplitView{
  display: block !important;
}
body.discover-guest-entry-mode #calendarSplitView{
  display: block !important;
  height: 100dvh !important;
  min-height: 100dvh !important;
  max-height: 100dvh !important;
}
body.discover-guest-entry-mode #calendarSplitPaneList,
body.discover-guest-entry-mode #root{
  height: 100% !important;
  min-height: 0 !important;
}
body.discover-guest-entry-mode #root{
  overflow: hidden !important;
}
body.discover-guest-entry-mode #rootContent{
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
  min-height: 0 !important;
}
#discoverGuestEntry{
  flex: 1 1 auto;
  min-height: 100%;
  width: 100%;
  display: flex;
  align-items: stretch;
  justify-content: center;
  padding: 14px;
  box-sizing: border-box;
}
.discover-guest-entry-shell{
  margin: auto;
  width: min(640px, 100%);
  border-radius: 18px;
  padding: 18px 16px;
  box-sizing: border-box;
  background: var(--surface-2);
  border: 1px solid rgba(255,255,255,0.14);
  box-shadow: 0 18px 44px rgba(0,0,0,0.34);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  text-align: center;
  cursor: pointer;
}
.discover-guest-entry-planet{
  width: 108px;
  height: 108px;
  border-radius: 999px;
  background:
    radial-gradient(72% 72% at 30% 28%, rgba(255,255,255,0.38), rgba(255,255,255,0) 62%),
    radial-gradient(118% 116% at 64% 74%, rgba(58,186,255,0.78), rgba(58,186,255,0.18) 62%, rgba(58,186,255,0) 100%),
    linear-gradient(165deg, rgba(68,104,255,0.82), rgba(20,28,66,0.9));
  box-shadow:
    0 0 0 1px rgba(255,255,255,0.16) inset,
    0 10px 26px rgba(0,0,0,0.32);
  animation: discoverGuestPlanetPulse 6.6s ease-in-out infinite;
}
.discover-guest-entry-title{
  font-size: 17px;
  font-weight: 760;
  color: var(--text-primary);
}
.discover-guest-entry-desc{
  max-width: 560px;
  font-size: 13px;
  line-height: 1.4;
  color: var(--text-secondary);
}
@keyframes discoverGuestPlanetPulse{
  0%,100%{ transform: scale(1); filter: saturate(1);}
  50%{ transform: scale(1.04); filter: saturate(1.16);}
}
/* ---------------- 4) List / rows / day / line ---------------- */
.list{
  display: flex;
  flex-direction: column;
  gap: 0;
}.scroll-slack{
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  min-height: 0 !important;
  max-height: 0 !important;
  overflow: hidden !important;
  pointer-events: none !important;
  flex: 0 0 0 !important;
}.row{
  z-index: 1;
  display: flex;
  align-items: center;
  column-gap: var(--ROW_GAP);
  margin: 0px 6px 0px 6px;
}.row-today{
  padding-top: 0;
  background: none;
}.row:last-child{
  margin-bottom: 0;
}/* левая колонка — день */
.day{
  width: var(--DAY_W);
  flex: 0 0 var(--DAY_W);
  display: flex;
  flex-direction: column;
  padding: 1px 2px;
  justify-content: start;
  box-sizing: border-box;
  border-radius: 6px;
  padding: 0px 1px;
  align-self: stretch;

  background: var(--surface-10event);
  position: relative;
  /* Day frames should stay above connector lines. */
  z-index: 3;
}/* Calendar settings: center the description text (matches centered banner) */
#calDescriptionInput{
  text-align: center;
  box-sizing: border-box;
  resize: none;
  border-radius: 12px;
  border: none;
  padding: 8px 12px;
  font-size: 13px;
}.day.clickable{
  cursor: pointer;
}.day.weekend:not(.today){
  background: rgba(232, 57, 68, 1);
  color: rgba(255,255,255,1);
}.day.weekend:not(.today) .day-num, .day.weekend:not(.today) .day-dow{
  color: rgba(255,255,255,1);
}.day.today{
  font-weight: 400;
}.day.today .day-num{
  font-size: 24px;
}.day.today .day-dow{
  font-size: 12px;
}.day .day-num{
  font-size: 20px;
  text-align: center;
  line-height: 0.8;
}.day .day-dow{
  font-size: 12px;
  text-align: end;
  line-height: 1;
  opacity: 0.9;
}.day .day-date-stack{
  display: flex;
  flex-direction: column;
  z-index: 2;
  margin-top: 2px;
  pointer-events: none;
  opacity: 0.8;
}.month-group{
  margin: 20px 0px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  position: relative; /* bounds for sticky month header */
}.month-block{
  display: block;
  position: relative;
}/* колонка с событиями дня */
.line{
  --line-gap: 3px;
  justify-content: center;
  min-height: 30px;
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: stretch;
}.line.day-compact-action-line{
  display: grid;
  grid-template-columns: 2fr 1fr;
  gap: 2px;
  min-height: 22px;
  height: 22px;
  background: transparent;
  border-radius: 6px;
  align-items: stretch;
  padding: 0;
}.line.day-compact-action-line.is-empty{
  border-radius: 6px;
}body.calendar-mode-list .line.day-compact-action-line, body.public-feed-mode .line.day-compact-action-line{
  gap: 2px;
}.line.day-compact-action-line > .day-compact-action-btn{
  border: none;
  margin: 0;
  padding: 0;
  min-height: 22px;
  height: 22px;
  border-radius: 6px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  background: var(--surface-4);
  color: var(--text-primary);
}.line.day-compact-action-line > .day-compact-action-btn.day-compact-action-btn-create{
  color: var(--surface-7);
}.line.day-compact-action-line > .day-compact-action-btn.day-compact-action-btn-expand{
  color: var(--surface-7);
}.day-compact-action-icon{
  display: block;
  width: 14px;
  height: 14px;
  background-color: currentColor;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: contain;
  mask-size: contain;
  pointer-events: none;
}.day-compact-action-icon-plus{
  -webkit-mask-image: url('/static/svg/icon+.svg');
  mask-image: url('/static/svg/icon+.svg');
}.day-compact-action-icon-expand-symbol{
  width: auto;
  height: auto;
  min-width: 14px;
  min-height: 14px;
  line-height: 1;
  font-size: 14px;
  font-weight: 700;
  background: none;
  -webkit-mask-image: none;
  mask-image: none;
}.row.day-expanded .line.day-compact-action-line{
  display: none !important;
}.row.day-expanded{
  display: grid;
  z-index: 1;
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: auto minmax(0, 1fr);
  align-items: stretch;
  column-gap: var(--ROW_GAP);
  row-gap: var(--line-gap, 2px);
}.row.day-expanded > .day{
  grid-column: 1;
  grid-row: 1;
  align-self: start;
}.row.day-expanded > .line{
  grid-column: 1;
  grid-row: 2;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: auto minmax(0, 1fr);
  align-content: stretch;
  min-width: 0;
  min-height: 0;
}.row.day-expanded .day-expanded-stack{
  display: grid;
  gap: 5px;
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: auto minmax(0, 1fr);
  width: 100%;
  min-width: 0;
  min-height: 0;
}.row.day-expanded .day-expanded-top-band{
  display: grid;
  grid-template-columns: var(--DAY_W) minmax(0, 1fr);
  align-items: stretch;
  column-gap: var(--ROW_GAP);
  width: 100%;
  min-width: 0;
  overflow: hidden;
  opacity: 1;
  transform-origin: 50% 0%;
  transform: translate3d(0, 0, 0) scaleY(1);
  backface-visibility: hidden;
  will-change: auto;
  transition: none;
}.row.day-expanded .day-expanded-top-band > .day{
  justify-content: flex-start;
  align-items: center;
  align-self: stretch;
  min-height: 0;
  height: auto;
  overflow: hidden;
}.row.day-expanded .day-expanded-top-band > .day .day-date-stack{
  position: relative;
  top: 0;
  left: auto;
  transform: none;
  width: 100%;
  min-width: 0;
}.row.day-expanded .day-expanded-top-band > .day .day-expanded-day-axis{
  position: relative;
  display: block;
  flex: 0 0 auto;
  width: 100%;
  min-height: 1px;
  overflow-y: hidden;
  overflow-x: hidden;
  opacity: 1;
  transform: translateY(0);
  transition: none;
}.row.day-expanded .day-expanded-top-band > .day .day-expanded-day-axis-label{
  color: inherit;
  position: absolute;
  transform: translateY(-50%);
  width: 100%;
  text-align: center;
  line-height: 1;
  white-space: nowrap;
  font-size: 11px;
  letter-spacing: -0.03em;
}.row.day-expanded .day-expanded-top-band > .day .day-expanded-day-axis-label-zero{
  visibility: visible;
  pointer-events: auto;
}.day-expanded-axis .day-expanded-day-axis-label-zero{
  visibility: visible;
  pointer-events: auto;
}.row.day-expanded .day-expanded-top-band > .day .day-expanded-day-meridiem{
  position: absolute;
  font-size: 9px;
  font-weight: 700;
  text-align: center;
  width: 100%;
  font-size: 11px;
  line-height: 1;
  pointer-events: none;
  white-space: nowrap;
}.row.day-expanded .day-expanded-top-band > .day .day-expanded-day-meridiem-pm{
  top: 50%;
  transform: translateY(-160%);
}.day-expanded-axis .day-expanded-day-meridiem-pm{
  top: 50%;
  transform: translateY(-160%);
}.row.day-expanded .day-expanded-top-band > .day .day-expanded-day-axis-scroll{
  position: relative;
  width: 100%;
  min-height: 100%;
  will-change: transform;
}
@media (prefers-reduced-motion: reduce){
  .row.day-expanded .day-expanded-top-band{
    transition: none !important;
    opacity: 1;
    transform: none;
    will-change: auto;
  }
}.day-expanded-wrap{
  --DAY_EXPANDED_H: 360px; /* 24h at 15px per hour (2h = 30px) */
  display: flex;
  position: relative;
  border-radius: 6px;
  flex: 1 1 auto;
  align-items: stretch;
  height: var(--DAY_EXPANDED_H);
  min-height: var(--DAY_EXPANDED_H);
  max-height: var(--DAY_EXPANDED_H);
  min-width: 0;
  overflow-x: auto;
  overflow-y: hidden;
  touch-action: auto;
  scrollbar-gutter: stable;
  scrollbar-width: thin;
  scrollbar-color: var(--accent) rgba(255,255,255,.16);
  overscroll-behavior-y: none;
  overscroll-behavior-x: auto;
  -webkit-overflow-scrolling: auto;
  box-sizing: border-box;
  opacity: 1;
  transform: translateY(0);
  transition: none;
  will-change: auto;
}
.day-expanded-scroll-content{
  position: relative;
  display: grid;
  gap: 5px;
  grid-template-columns: 30px minmax(0, 1fr);
  width: 100%;
  min-width: 0;
  flex: 0 0 auto;
  overflow: visible;
  overscroll-behavior: auto;
}
.day-expanded-wrap::-webkit-scrollbar{
  width: 8px;
  height: 8px;
  display: block;
}
.day-expanded-wrap::-webkit-scrollbar-track{
  background: rgba(255,255,255,.10);
  border-radius: 999px;
}
.day-expanded-wrap::-webkit-scrollbar-thumb{
  background: var(--accent);
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.10);
}
.day-expanded-stack{
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: auto minmax(0, 1fr);
  width: 100%;
  min-width: 0;
}
.day-expanded-top-row{
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  row-gap: var(--line-gap, 2px);
  width: 100%;
  min-width: 0;
}
.day-expanded-controls{
  height: 30px;
  min-height: 30px;
  max-height: 30px;
  min-width: 0;
  pointer-events: auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
  padding: 3px 6px;
  background: var(--surface-4);
  border-radius: 6px;
  overflow: hidden;
}
.day-expanded-controls-primary,
.day-expanded-controls-secondary{
  display: flex;
  align-items: center;
  gap: 0px;
  min-width: 0;
}
.day-expanded-controls-secondary{
  margin-left: auto;
}
.day-expanded-control-btn{
  border: 0;
  margin: 0;
  height: 24px;
  min-height: 24px;
  min-width: 24px;
  padding: 0 8px;
  border-radius: 6px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--text-primary);
  font-size: 14px;
  font-weight: 500;
  line-height: 1;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transform: translateZ(0);
  transition: transform 140ms ease, filter 140ms ease, opacity 140ms ease;
}
.day-expanded-control-btn-icon-only{
  width: 44px;
  padding: 0;
}
.day-expanded-control-btn-icon{
  display: block;
  width: 18px;
  height: 18px;
  background-color: currentColor;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: contain;
  mask-size: contain;
}
.day-expanded-control-btn-icon-plus{
  -webkit-mask-image: url('/static/svg/icon+.svg');
  mask-image: url('/static/svg/icon+.svg');
}
.day-expanded-control-btn-icon-minus{
  -webkit-mask-image: url('/static/svg/icon-.svg');
  mask-image: url('/static/svg/icon-.svg');
}
.day-expanded-control-btn:active{
  transform: translateZ(0) scale(0.96);
}
.day-expanded-control-btn:focus-visible{
  outline: 2px solid color-mix(in srgb, var(--accent) 78%, #fff 22%);
  outline-offset: 1px;
}
.day-expanded-control-btn:disabled{
  opacity: 0.45;
  pointer-events: none;
}
.day-expanded-control-btn-create{
  min-width: 0;
  padding: 0 10px;
  font-size: 12px;
  white-space: nowrap;
  background: var(--accent);
  color: #fff;
}
.day-expanded-no-time{
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  row-gap: var(--line-gap, 2px);
  width: 100%;
  min-width: 0;
}
.row.day-expanded .day-expanded-wrap{

}.day-expanded-axis{
  flex: 0 0 30px;
  position: relative;
  color: var(--surface-6);
  height: 100%;
  width: 30px;
  font-size: 11px;
  opacity: 0.7;
}.day-expanded-axis-label{
  position: absolute;
  transform: translateY(-50%);
  line-height: 1;
}.day-expanded-axis .day-expanded-axis-label{
  left: 0;
  width: 100%;
  text-align: center;
  white-space: nowrap;
  font-size: 11px;
  letter-spacing: -0.03em;
  color: inherit;
}.day-expanded-axis .day-expanded-day-meridiem{
  position: absolute;
  font-size: 9px;
  font-weight: 700;
  text-align: center;
  width: 100%;
  letter-spacing: 0.03em;
  opacity: 0.7;
  line-height: 1;
  pointer-events: none;
  white-space: nowrap;
}.day-expanded-track{
  position: relative;
  flex: 1 1 auto;
  width: 100%;
  min-width: 0;
  height: var(--DAY_EXPANDED_H);
  min-height: var(--DAY_EXPANDED_H);
  max-height: var(--DAY_EXPANDED_H);
  overflow: hidden;
}.day-expanded-grid-layer,
.day-expanded-items-layer{
  position: absolute;
  inset: 0;
  width: 100%;
  min-width: 100%;
  max-width: 100%;
  height: 100%;
  min-height: 100%;
  max-height: 100%;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}.day-expanded-grid-layer{
  z-index: 0;
  pointer-events: none;
  background-image: linear-gradient(to bottom, var(--surface-1) 1px, transparent 1px);
  background-repeat: repeat-y;
  background-size: 100% calc(100% / 24);
  background-position: 0 0;
}.day-expanded-items-layer{
  z-index: 1;
  pointer-events: none;
}
.day-expanded-now-line{
  position: absolute;
  left: 0;
  right: 0;
  border-top: 2px solid #ff3b30;
  pointer-events: none;
  z-index: 8;
}
.day-expanded-axis .day-expanded-now-label,
.row.day-expanded .day .day-expanded-now-label{
  position: absolute;
  left: 50%;
  transform: translate3d(-50%, -50%, 0);
  transform-origin: 50% 50%;
  padding: 2px 6px;
  border-radius: 999px;
  background: #ff3b30;
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.01em;
  white-space: nowrap;
  pointer-events: none;
  z-index: 9;
  box-shadow: 0 2px 6px rgba(0,0,0,0.28);
}
.day-expanded-rowline{
  position: absolute;
  inset: 0;
  margin: 0;
  pointer-events: none;
}
.day-expanded-rowline > .item{
  pointer-events: auto;
}
.day-expanded-event, .day-expanded-item{
  position: absolute;
  box-sizing: border-box;
  border-radius: 8px;
  padding: 6px 8px;
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-height: 0;
  cursor: pointer;
  z-index: 2;
  box-shadow: 0 3px 8px rgba(0,0,0,0.28);
}.day-expanded-event-time{
  font-size: 11px;
  font-weight: 600;
  opacity: 0.95;
  line-height: 1.1;
}.day-expanded-event-title{
  font-size: 12px;
  line-height: 1.2;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
@keyframes dayExpandedIn{
  from{
    opacity: 0;
    transform: translateY(-6px);
  }
  to{
    opacity: 1;
    transform: translateY(0);
  }
}.line.is-empty{
  background: var(--surface-3);
  border-radius: 6px;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}.line.only-ghosts{
  min-height: auto;
  justify-content: center;
}/* iOS/WebView: flex-gap can be unreliable → use margin-based spacing for list/discover */
body.calendar-mode-list .line, body.public-feed-mode .line{
  gap: var(--line-gap);
}.line > .rowline{
}.line > .rowline:last-child{
  margin-bottom: 0;
}.line .l1, .line .l2{
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}/* Quick Start (empty personal calendar) */
.item.quickstart-item{
  opacity: 0.62;
  filter: saturate(0.7);
  cursor: pointer;
}.item.quickstart-item .ev-text-pair .ev-title-clip{
  max-width: 100%;
  flex: 1 1 auto;
}.item.quickstart-item .ev-text-pair .ev-desc-clip{
  flex: 0 0 0;
  max-width: 0;
  min-width: 0;
  overflow: hidden;
}.tail-connector.quickstart-connector{
  opacity: 0.62;
  filter: saturate(0.7);
}
.today-sep{
  height: 28px;
  margin-left: 6px;
  width: auto;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 15px;
  font-weight: 500;
  pointer-events: none;
  position: relative;
  z-index: 3;
  margin-top: 20px;
}.today-sep.is-today{
  z-index: 70;
}.today-sep-placeholder{
}.today-sep.today-sep-floating{
  position: fixed;
  padding: 0;
  height: 26px;
  left: 50%;
  top: 120px;
  margin-left: 0;
  margin-top: 0;
  transform: translate3d(-50%, 0, 0);
  z-index: 160;
  width: auto;
  pointer-events: auto;
  opacity: 0;
  transition: opacity 120ms ease;
  will-change: top, opacity;
}.today-sep.today-sep-floating .today-sep-pill{
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  user-select: none;
}body.calendar-mode-grid .today-sep.today-sep-floating{
  display: none !important;
}.today-sep.today-sep-floating .today-sep-pill:active, .today-sep.today-sep-floating .today-sep-pill:focus, .today-sep.today-sep-floating .today-sep-pill:focus-visible{
  background: inherit;
  box-shadow: inherit;
  outline: none;
  filter: none;
}.today-sep.today-sep-floating[data-dir="up"] .today-sep-pill::before{
  content: "↑ ";
}.today-sep.today-sep-floating[data-dir="down"] .today-sep-pill::before{
  content: "↓ ";
}.today-sep.is-horizon{
  background: transparent;
  box-shadow: none;
  margin-bottom: 8px;
  display: flex;
  justify-content: center;
  align-items: center;
}.today-sep .today-sep-pill{
  align-items: center;
  justify-content: center;
}.today-sep-pill-is-today{
  border-radius: 4px;
  padding: 4px 10px;
}.today-sep.is-horizon .today-sep-pill{
  padding: 4px 10px;
  border-radius: 7px;
  color: var(--text-primary);
  backdrop-filter: blur(5px);
}.empty{
  color: var(--muted);
}.hint{
  font-size: 12px;
  opacity: 0.7;
  margin-top: 10px;
}/* отдельная запись в list-режиме */
.rowline{
  display: flex;
  align-items: center;
  width: 100%;
}.rowline.no-time-rowline{
  min-height: var(--ENTRY_H);
}.rowline.tail{
  height: 15px;
}.rowline.task-inline-open{
  flex-wrap: wrap;
  align-items: stretch;
}.rowline > .item{
  flex: 1 1 auto;
  min-width: 0;
}.rowline > .item.has-tail, .rowline > .item.tail-item{
}.rowline > .item:not(.tail-item){
}.rowline.task-inline-open > .item{
  flex: 0 0 100%;
}.rowline > .item:not(.tail-item){
  height: var(--ENTRY_H);
}body.calendar-mode-list .rowline:not(.day-expanded-rowline) > .item, body.calendar-mode-list .rowline:not(.day-expanded-rowline) > .item.has-tail, body.calendar-mode-list .rowline:not(.day-expanded-rowline) > .item.tail-item{
  border-radius: 6px;
  overflow: hidden;
  gap: 2px; 
  padding: 0;
}body.calendar-mode-list .rowline > .item.quickstart-item, body.calendar-mode-list .rowline > .item.tail-item.quickstart-item{
  filter: none !important;
}body.calendar-mode-list .tail-connector.quickstart-connector{
  filter: none !important;
}.rowline.tail > .item.tail-item{
  height: 15px;
  padding-top: 15px;
}.rowline.task-inline-open > .item:not(.tail-item){
  height: auto;
}.item.task-inline-open{
  flex-wrap: wrap;
  align-items: flex-start;
  white-space: normal;
}body.public-feed-mode .item.ev-expanded{
  flex-wrap: wrap;
  align-items: center;
  align-content: flex-start;
  white-space: normal;
  padding-top: 6px;
  padding-bottom: 8px;
}body.public-feed-mode .item.ev-expanded .ev-text-pair .ev-desc-clip{
  display: none;
}body.public-feed-mode .item.ev-expanded .ev-inline-details{
  width: 100%;
}.task-inline-item{
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font-size: 12px;
  width: 100%;
  flex: 1 1 100%;
  min-width: 0;
  max-width: 100%;
}.task-inline-toggle{
  width: 18px;
  height: 18px;
  border-radius: 999px;
  border: none;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 59, 48, 0.9);
  color: rgba(255,255,255,0.98);
  font-size: 12px;
  line-height: 1;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  box-shadow: 0 8px 18px rgba(0,0,0,0.24);
}.task-inline-item.is-done .task-inline-toggle{
  background: rgba(34, 197, 94, 0.9);
}.task-inline-body{
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
  flex: 1 1 0;
  width: 100%;
  max-width: 100%;
}.task-inline-title{
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
}.task-inline-item.is-done .task-inline-title{
  text-decoration: line-through;
  opacity: 0.75;
}.task-inline-desc{
  display: block;
  width: 100%;
  max-width: 100%;
  border: none;
  background: none;
  color: var(--text-secondary);
  font-size: 11px;
  line-height: 1.2;
  padding: 0;
  text-align: left;
  cursor: default;
  -webkit-tap-highlight-color: transparent;
  min-width: 0;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  word-break: break-word;
}.task-inline-item .m{
  width: 18px;
  flex: 0 0 18px;
  text-align: center;
  opacity: 0.98;
}.task-inline-item .t{
  flex: 1 1 auto;
  white-space: normal;
  overflow-wrap: anywhere;
}.item{
  position: relative;
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  border-radius: 8px;
  overflow: hidden;
  white-space: nowrap;
  z-index: 4;
  background-size: var(--ev-bg-size, auto);
  background-position: var(--ev-bg-pos, 0 0);
  background-repeat: no-repeat;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  box-sizing: border-box;
  box-shadow: none;
}.item.is-draft{
  opacity: 0.4;
  filter: saturate(0.7);
}.item.is-draft .ev-timechip,
.item.is-draft .ev-title-text,
.item.is-draft .ev-desc-text,
.item.is-draft .ev-organizer{
  opacity: 0.92;
}.item.is-no-time .ev-timewrap{
  display: inline-flex !important;
  top: 0px;
  max-width: 58px;
  text-wrap: auto;
}.item.is-no-time .ev-timechip:not(.ev-no-time-chip){
  display: none !important;
}.item.is-no-time .ev-timewrap .ev-no-time-chip{
  display: inline-flex;
  width: auto;
  min-width: 0;
  max-width: 58px;
  white-space: normal;
  overflow-wrap: anywhere;
  background: var(--surface-4);
  border-radius: 0px 0px 6px 0px;
  height: auto;
  min-height: 15px;
  line-height: 1;
  align-items: flex-start;
  justify-content: flex-start;
  padding: 0 3px;
}.day-expanded-rowline > .day-expanded-item{
  position: absolute;
  flex: 0 0 auto;
  overflow: visible;
  transition: none;
  will-change: auto;
}body.calendar-mode-list .day-expanded-rowline > .day-expanded-item{
  overflow: visible;
}.day-expanded-rowline > .day-expanded-item{
  min-height: 30px;
  display: block;
  line-height: 15px;
  white-space: normal;
  overflow: hidden;
}body.calendar-mode-list .day-expanded-rowline > .day-expanded-item{
  overflow: hidden;
  padding: 0;
  border-radius: 6px;
}body.calendar-mode-list .day-expanded-rowline > .day-expanded-item .ev-timewrap{
  position: relative;
  top: auto;
  left: auto;
  float: left;
  display: block;
  height: auto;
  margin-right: 6px;
}body.calendar-mode-list .day-expanded-rowline > .day-expanded-item.is-no-time .ev-timewrap{
  display: block !important;
}body.calendar-mode-list .day-expanded-rowline > .day-expanded-item .ev-timewrap .ev-timechip{
  display: block;
  min-width: 0;
  height: 15px;
}body.calendar-mode-list .day-expanded-rowline > .day-expanded-item .ev-timewrap .ev-timechip.ev-timechip-hidden{
  display: none !important;
  height: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}body.calendar-mode-list .day-expanded-rowline > .day-expanded-item .ev-badge-group{
  position: relative;
  top: auto;
  right: auto;
  float: right;
  clear: right;
  margin-left: 6px;
  max-width: 48%;
}body.calendar-mode-list .day-expanded-rowline > .day-expanded-item .ev-badge-group .ev-badge{
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}body.calendar-mode-list .day-expanded-rowline > .day-expanded-item .ev-organizer{
  position: absolute;
  top: auto;
  right: 0;
  bottom: 0;
  float: none;
  clear: none;
  margin: 0;
  max-width: 42%;
  z-index: 2;
}body.calendar-mode-list .day-expanded-rowline > .day-expanded-item .ev-text-pair{
  display: contents;
}body.calendar-mode-list .day-expanded-rowline > .day-expanded-item .ev-title-clip, body.calendar-mode-list .day-expanded-rowline > .day-expanded-item .ev-desc-clip{
  display: block;
  min-width: 0;
  max-width: none;
  overflow: hidden;
}body.calendar-mode-list .day-expanded-rowline > .day-expanded-item .ev-title-clip{
  white-space: nowrap;
  text-overflow: ellipsis;
}body.calendar-mode-list .day-expanded-rowline > .day-expanded-item .ev-desc-text{
  display: block;
  max-width: none;
  min-width: 0;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
  overflow: hidden;
  text-overflow: clip;
}body.calendar-mode-list .day-expanded-rowline > .day-expanded-item.highlight.highlight-has-cover .ev-desc-text{
  white-space: normal;
  overflow-wrap: anywhere;
}.day-expanded-wrap.day-expanded-lane-animating .day-expanded-rowline > .day-expanded-item{
  transition:
    left 700ms ease-out,
    width 700ms ease-out,
    top 700ms ease-out,
    height 700ms ease-out;
  will-change: left, width, top, height;
}.day-expanded-rowline > .day-expanded-item.day-expanded-lane-collapsed{
  padding: 0;
  gap: 0;
  border-radius: 4px;
  overflow: hidden;
}.day-expanded-rowline > .day-expanded-item.day-expanded-lane-collapsed .ev-badge-group,
.day-expanded-rowline > .day-expanded-item.day-expanded-lane-collapsed .ev-badge-group-left,
.day-expanded-rowline > .day-expanded-item.day-expanded-lane-collapsed .ev-timewrap,
.day-expanded-rowline > .day-expanded-item.day-expanded-lane-collapsed .ev-organizer,
.day-expanded-rowline > .day-expanded-item.day-expanded-lane-collapsed .ev-text-pair{
  display: none !important;
}@media (prefers-reduced-motion: reduce){
  .day-expanded-wrap.day-expanded-lane-animating .day-expanded-rowline > .day-expanded-item{
    transition: none !important;
    will-change: auto;
  }
}
.row.day-expanded .day-expanded-no-time > .rowline{
  position: relative;
  z-index: 6;
  margin-bottom: 0;
}.ev-preview-item{
  height: var(--ENTRY_H);
  min-height: var(--ENTRY_H);
  align-items: center;
}.ev-preview-item.highlight{
  height: calc(var(--ENTRY_H) * 2);
  min-height: calc(var(--ENTRY_H) * 2);
}.ev-preview-row{
  display: flex;
  align-items: flex-start;
  gap: 8px;
}.ev-preview-right{
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-width: 0;
}.ev-preview-right .ev-preview-rowline{
  flex: 0 0 auto;
  width: 100%;
}.ev-preview-rowline{
  flex: 1 1 auto;
  width: 100%;
  min-width: 0;
}.ev-preview-day{
  pointer-events: none;
}.ev-preview-item.highlight::before, .ev-preview-item.highlight::after{
  display: none;
}.ev-preview-main{
  display:flex;
  align-items:center;
  gap:6px;
  min-width:0;
  flex:1 1 auto;
}.ev-preview-cover{
  flex: 0 0 30%;
  max-width: 32%;
  min-width: 28%;
  height: 100%;
  border-radius: 5px;
  background: rgba(0,0,0,0.2);
  display:flex;
  align-items:center;
  justify-content:center;
  cursor: pointer;
  position: relative;
  overflow: hidden;
  background-size: cover;
  background-position: center;
}.ev-preview-cover.has-image{
}.ev-preview-cover.is-disabled{
  opacity: 0.45;
  pointer-events: none;
}.ev-preview-cover-plus{
  font-size: 20px;
  font-weight: 800;
  color: var(--text-primary);
}.ev-preview-palette{
  display:flex;
  justify-content: space-evenly;
  gap:8px;
  margin-top:6px;
  width: 100%;
  position: relative;
  z-index: 2;
}.ev-preview-palette.is-split{
  justify-content: space-between;
}.ev-preview-palette.is-center{
  justify-content: center;
}.ev-preview-swatch{
  width:26px;
  height:26px;
  border-radius: 999px;
  background: var(--surface-3);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: relative;
  outline: 1px solid var(--surface-7);
}.ev-preview-color-input{
  position: absolute;
  left: -9999px;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
  border: 0;
  background: transparent;
  -webkit-appearance: none;
}.ev-color-input{
  position: absolute;
  left: -9999px;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}.ev-preview-swatch.is-active{
}.ev-preview-swatch.is-disabled{
  opacity: 0.4;
  cursor: default;
  pointer-events: none;
}.ev-preview-swatch.is-locked{
  opacity: 0.3;
  pointer-events: none;
  cursor: default;
}#calEventPreviewWrap, #eventHighlightLivePreviewWrap, #eventHighlightDemoPreviewWrap{
  width: 100%;
  align-self: stretch;
  position: relative;
}#calEventPreviewWrap .ev-preview-row, #eventHighlightLivePreviewWrap .ev-preview-row, #eventHighlightDemoPreviewWrap .ev-preview-row{
  width: 100%;
  position: relative;
  z-index: 2;
}.ev-preview-tail-row{
  margin-top: 8px;
}.ev-preview-tail-rowline{
  margin-top: 0;
  position: relative;
  z-index: 2;
}.ev-preview-tail-rowline .ev-preview-tail-item{
  height: 15px;
  min-height: 15px;
  align-items: center;
}.ev-preview-tail-rowline .ev-preview-tail-item .ev-timewrap{
  margin-left: 0;
  top: -8px;
  left: -2px;
}.ev-preview-tail-connector-wrap{
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 1;
}.ev-preview-tail-connector{
  position: absolute;
  box-sizing: border-box;
  border-radius: 8px;
  background: rgb(189, 189, 189);
  border: none;
  opacity: 0.95;
}.item.tail-item{
  height: 12px;
  min-height: 12px;
  padding-top: 0;
  padding-bottom: 0;
  gap: 0;
  align-self: center;
  align-items: stretch;
  border: none;
  box-shadow: none;
}.item.is-optimistic-delete{
  pointer-events: none !important;
  animation: evItemOptimisticDeleteOut 220ms cubic-bezier(0.22, 0.78, 0.25, 1) forwards;
}
.item.is-optimistic-saving{
  filter: saturate(0.9);
}.item.is-optimistic-saving::after{
  content: '';
  position: absolute;
  right: 8px;
  bottom: 6px;
  width: 11px;
  height: 11px;
  border-radius: 50%;
  border: 1.8px solid rgba(255,255,255,0.9);
  border-top-color: rgba(255,255,255,0.15);
  animation: evItemOptimisticSpin 760ms linear infinite;
  pointer-events: none;
  z-index: 9;
}.tail-connector.is-optimistic-delete{
  pointer-events: none !important;
  opacity: 0 !important;
  transform: translate3d(42px, 0, 0) scaleX(0.92);
}.tail-connector.is-optimistic-saving{
  opacity: 0.72 !important;
}
@keyframes evItemOptimisticSpin{
  to{
    transform: rotate(360deg);
  }
}@keyframes evItemOptimisticDeleteOut{
  from{
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
  to{
    opacity: 0;
    transform: translate3d(42px, 0, 0);
  }
}.rowline.task-inline-animating .ev-badge-group, .rowline.task-inline-animating .ev-badge-group-left{
  top: 2px;
}.ev-badge-group{
  position: absolute;
  right: 0px;
  z-index: 8;
  pointer-events: none;
  display: flex;
  flex-direction: row-reverse;
  gap: 2px;
  align-items: flex-start;
}.ev-tail-badges{
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin-left: 6px;
  flex-direction: row-reverse;
  pointer-events: none;
}.item .ev-badge-group{
  top: 0px;
}.ev-badge{
  display: flex;
  height: 12px;
  padding: 0px 6px 0px;
  border-radius: 0px 0px 6px 6px;
  background: var(--ev-badge-bg, rgb(255, 59, 48));
  font-size: 10px;
  text-shadow: none;
  text-transform: none;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
  border: none;
  line-height: 1;
}.ev-task-label-badge{
  --ev-badge-bg: rgb(255, 59, 48);
  --ev-badge-fg: rgb(255, 255, 255);
  color: white;
}.ev-task-label-badge.is-done, .ev-task-badge.is-done{
  --ev-badge-bg: rgb(34, 197, 94);
}.ev-task-dots{
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin-left: 6px;
}.ev-task-dot{
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: rgb(255, 255, 255);
}.ev-task-dot.is-undone{
  background: rgb(255, 255, 255);
}.ev-task-dot.is-done{
  background: rgb(34, 197, 94);
}.ev-cityregion-badge{
  background: var(--surface-11event);
  border-radius: 0px 4px 0px 6px;
}.ev-draft-badge{
  color: white;
  border-radius: 0px 0px 6px 6px;
}.ev-bot-badge{
  --ev-badge-bg: var(--accent);
  --ev-badge-fg: rgb(255, 255, 255);
  color: rgb(255, 255, 255);
}.ev-repost-badge{
  --ev-badge-bg: rgb(10, 132, 255);
  --ev-badge-fg: rgb(255, 255, 255);
}.ev-highlight-star-badge{
  display: inline-flex;
  align-items: start;
  justify-content: center;
  width: 18px;
  height: 18px;
  font-size: 16px;
  line-height: 0.7;
  color: rgb(255, 214, 10);
  text-shadow: 0 2px 8px rgba(0,0,0,0.45);
}.ev-tail-badges .ev-highlight-star-badge{
  line-height: 1;
}.tail-connectors-overlay{
  position: absolute;
  pointer-events: none;
  z-index: 0;
  opacity: 1;
}.tail-connectors-overlay-top{
  transition: none;
}.tail-connector{
  filter: none;
  -webkit-mask-image: linear-gradient(
    to bottom,
    rgba(0, 0, 0, 1) 0%,
    rgba(0, 0, 0, 0.5) 50%,
    rgba(0, 0, 0, 1) 100%
  );
  mask-image: linear-gradient(
    to bottom,
    rgba(0, 0, 0, 1) 0%,
    rgba(0, 0, 0, 0.5) 50%,
    rgba(0, 0, 0, 1) 100%
  );
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  position: absolute;
  pointer-events: none;
  cursor: pointer;
  box-sizing: border-box;
  background-repeat: no-repeat;
  background-size: var(--ev-bg-size, auto);
  background-position: var(--ev-bg-pos, 0 0);
  transform-origin: center center;
  transform: scaleX(1);
  transition: transform 700ms ease-out, opacity 700ms ease-out;
  will-change: transform, opacity;
}
.tail-connectors-overlay-top .tail-connector{
  pointer-events: auto;
}
.tail-connector-spotlight-clone{
  position: absolute;
  pointer-events: none !important;
  z-index: 6;
  will-change: auto;
}
.tail-connector.is-connector-muted{
  opacity: 0 !important;
  transform: scaleX(0);
}

@media (prefers-reduced-motion: reduce){
  .tail-connectors-overlay-top{
    transition: none !important;
  }
  .tail-connector{
    transition: none !important;
  }
}
.map-picker-body .maplibregl-ctrl-group{
  border: none;
  box-shadow: none;
  background: transparent;
}
.map-picker-body .maplibregl-ctrl-top-left,
.map-picker-body .maplibregl-ctrl-top-right,
.map-picker-body .maplibregl-ctrl-bottom-left,
.map-picker-body .maplibregl-ctrl-bottom-right{
  position: absolute;
  z-index: 530;
}
.map-picker-body .maplibregl-ctrl-top-left{
  top: 10px !important;
  left: 10px !important;
  right: auto !important;
  bottom: auto !important;
}
.map-picker-body .maplibregl-ctrl-top-right{
  top: 10px !important;
  right: 10px !important;
  left: auto !important;
  bottom: auto !important;
}
.map-picker-body .maplibregl-ctrl-bottom-left{
  bottom: 10px !important;
  left: 10px !important;
  top: auto !important;
  right: auto !important;
}
.map-picker-body .maplibregl-ctrl-bottom-right{
  bottom: 10px !important;
  right: 10px !important;
  top: auto !important;
  left: auto !important;
}
.map-picker-body .maplibregl-map{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  background: transparent;
}
.map-picker-body .maplibregl-canvas-container{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  background: transparent;
}
.map-picker-body .maplibregl-canvas{
  position: absolute;
  inset: 0;
  width: 100% !important;
  height: 100% !important;
  background: transparent !important;
  display: block !important;
  opacity: 1 !important;
  visibility: visible !important;
}
.map-picker-body .maplibregl-ctrl-group button{
  width: 36px;
  height: 36px;
  margin-bottom: 8px;
  border-radius: 999px;
  background: var(--surface-2);
  color: var(--text-primary);
  border: 1px solid var(--surface-border);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 6px 14px rgba(0,0,0,0.25);
}
.map-picker-body .maplibregl-ctrl-group button:last-child{
  margin-bottom: 0;
}
.map-picker-body .maplibregl-ctrl button span{
  line-height: 1;
}
.map-picker-body .maplibregl-ctrl-attrib{
  font-size: 10px;
  background: rgba(0,0,0,0.38);
  color: rgba(255,255,255,0.9);
}
.map-picker-body .maplibregl-ctrl-attrib a{
  color: #fff;
}
.task-start-dot.is-done{
  background: rgb(34, 197, 94);
}/* View modal: highlight Task block when opened from Task badge */
#eventViewTaskItemsWrap.task-focus{
  padding: 12px;
  border-radius: 14px;
  background: var(--surface-3);
  box-shadow: 0 0 0 2px rgba(255,255,255,0.22), 0 16px 42px rgba(0,0,0,0.28);
}#eventViewTaskItemsWrap .task-focus{
  box-shadow: 0 0 0 2px rgba(255,255,255,0.22), 0 16px 42px rgba(0,0,0,0.22);
}.ev-public-badge{
  background: rgb(255,59,48);
  color: rgba(255,255,255,0.98);
}.ev-pe-badge{
  color: rgba(255,255,255,0.98);
}.ev-private-badge{
  background: rgb(255,59,48);
  color: rgba(255,255,255,0.98);
}.ev-repost-badge{
  background: rgb(59,130,246);
  color: rgba(255,255,255,0.98);
}.item::-webkit-scrollbar{
  height: 0;
  display: none;
}/* event label split: fixed time + animated title */
.ev-timewrap{
  position: sticky;
  top: 0px;
  left: -1px;
  height: 30px;
  display: inline-flex;
  align-items: flex-start;
  flex-direction: column;
  flex: 0 0 auto;
}.ev-timecell{
  height: 30px;
  display: flex;
}.ev-timecell-right{
  padding-left: 14px;
  box-sizing: border-box;
}.ev-timechip{
  height: 15px;
  font-size: 12px;
  align-items: center;
  flex: 0 0 auto;
  min-width: 0;
  opacity: 0.9;
}.ev-timewrap .ev-timechip{
  width: auto;
}.ev-timewrap .ev-timechip-start{
  padding-left: 3px;
}.ev-timewrap .ev-timechip-end{
  text-align: end;
  align-self: flex-end;
  margin-left: 8px;
}.ev-timewrap .ev-timechip-hidden{
  opacity: 0;
  display: none;
  pointer-events: none;
}.item .ev-title-clip{
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
}.item .ev-desc-clip{
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
  border-radius: 6px;
}.item .ev-organizer{
  position: absolute;
  background: var(--surface-11event);
  border-radius: 10px 0px 0px 0px;
  color: var(--btn-text-muted);
  flex: 0 0 auto;
  right: 0px;
  top: 14px;
  line-height: 14px;
  padding: 0 4px;
  font-size: 12px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 35%;
  z-index: 1;
}.item .ev-organizer.ev-organizer--swap{
  transition: opacity 180ms ease;
}.item .ev-organizer.ev-organizer--fade{
  opacity: 0;
}.ev-actions-backdrop{
  position: fixed;
  inset: 0;
  z-index: 1199;
  background: transparent;
}.ev-actions-popover{
  position: fixed;
  z-index: 1200;
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 10px;
  min-width: 200px;
  border-radius: 14px;
  background: var(--surface-2);
  box-shadow: 0 16px 40px rgba(0,0,0,0.35);
}.ev-actions-popover .ev-act{
  border: none;
  border-radius: 999px;
  padding: 8px 12px;
  font-size: 12px;
  font-weight: var(--weight-medium);
  text-align: left;
  background: var(--surface-3);
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}.ev-actions-popover .ev-act-primary{
  background: var(--accent);
  color: #fff;
}.ev-actions-popover .ev-act-danger{
  background: rgba(255, 59, 48, 0.12);
  color: #ff3b30;
}.ev-delete-overlay{
  z-index: 180010;
}.ev-delete-sheet{
  width: auto;
  height: auto;
  align-self: center;
  background: var(--surface-8);
  border-radius: 10px;
  padding: 12px;
  border: 1px solid var(--surface-border);
  box-sizing: border-box;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  gap: 10px;
}.ev-delete-title{
  font-size: 15px;
  font-weight: 700;
  margin: 0;
}.ev-delete-actions{
  display: flex;
  justify-content: space-evenly;
  gap: 8px;
  height: 34px;
}.modal-exit-confirm-leave-btn,
.modal-exit-confirm-delete-btn{
  flex: 1 1 0;
  background: var(--surface-4);
}.modal-exit-confirm-save-draft-btn{
  position: relative;
  flex: 1 1 0;
  background: var(--accent);
  color: white;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
}.modal-exit-confirm-save-draft-btn .ev-badge{
  position: absolute;
  top: 0px;
  right: 15px;
  pointer-events: none;
}.ev-delete-message{
  font-size: 13px;
  color: var(--text-secondary);
  margin-bottom: 12px;
}.modal-action-confirm-ok-btn.is-danger{
}.item .ev-title-text{
  display: inline-block;
  font-weight: 450;
  max-width: 100%;
  padding-left: 4px;
}.item .ev-desc-text{
  display: inline-block;
  max-width: 100%;
}.item .ev-text-pair{
  position: relative;
  line-height: 14px;
  flex: 1 1 auto;
}.item .ev-text-pair .ev-title-clip{
  max-width: 70%;
  min-width: 0;
}.item .ev-text-pair .ev-desc-clip{
  flex: 1 1 auto;
  min-width: 0;
}.item .ev-text-pair .ev-desc-text{
  display: block;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
  overflow: hidden;
  text-overflow: clip;
}

/* Collapsed list events: let text flow around time chips, badges, organizer and highlight cover. */
body.calendar-mode-list .rowline:not(.day-expanded-rowline):not(.ev-preview-rowline) > .item:not(.tail-item):not(.quickstart-item){
  display: block;
  line-height: 15px;
  white-space: normal;
}
body.calendar-mode-list .rowline:not(.day-expanded-rowline):not(.ev-preview-rowline) > .item:not(.tail-item):not(.quickstart-item) .ev-timewrap{
  position: relative;
  top: auto;
  left: auto;
  float: left;
  display: block;
  height: auto;
}
body.calendar-mode-list .rowline:not(.day-expanded-rowline):not(.ev-preview-rowline) > .item.is-no-time:not(.tail-item):not(.quickstart-item) .ev-timewrap{
  display: block !important;
}
body.calendar-mode-list .rowline:not(.day-expanded-rowline):not(.ev-preview-rowline) > .item:not(.tail-item):not(.quickstart-item) .ev-timewrap .ev-timechip{
  display: block;
  min-width: 0;
  height: 15px;
}
body.calendar-mode-list .rowline:not(.day-expanded-rowline):not(.ev-preview-rowline) > .item:not(.tail-item):not(.quickstart-item) .ev-timewrap .ev-timechip.ev-timechip-hidden{
  display: none !important;
  height: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}
body.calendar-mode-list .rowline:not(.day-expanded-rowline):not(.ev-preview-rowline) > .item:not(.tail-item):not(.quickstart-item) .ev-timewrap .ev-timechip-end{
 
}
body.calendar-mode-list .rowline:not(.day-expanded-rowline):not(.ev-preview-rowline) > .item:not(.tail-item):not(.quickstart-item) .ev-badge-group{
  position: relative;
  top: auto;
  right: auto;
  float: right;
  clear: right;
  margin-left: 6px;
  max-width: 48%;
}
body.calendar-mode-list .rowline:not(.day-expanded-rowline):not(.ev-preview-rowline) > .item:not(.tail-item):not(.quickstart-item) .ev-badge-group .ev-badge{
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  opacity: 0.9;
}
body.calendar-mode-list .rowline:not(.day-expanded-rowline):not(.ev-preview-rowline) > .item:not(.tail-item):not(.quickstart-item) .ev-organizer{
  position: absolute;
  top: auto;
  right: 0;
  bottom: 0;
  float: none;
  clear: none;
  margin: 0;
  max-width: 42%;
  z-index: 2;
}
body.calendar-mode-list .rowline:not(.day-expanded-rowline):not(.ev-preview-rowline) > .item:not(.tail-item):not(.quickstart-item) .ev-text-pair{
  display: contents;
}
body.calendar-mode-list .rowline:not(.day-expanded-rowline):not(.ev-preview-rowline) > .item:not(.tail-item):not(.quickstart-item) .ev-text-pair .ev-title-clip{
  display: block;
  max-width: none;
  min-width: 0;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
body.calendar-mode-list .rowline:not(.day-expanded-rowline):not(.ev-preview-rowline) > .item:not(.tail-item):not(.quickstart-item) .ev-text-pair .ev-desc-clip{
  display: block;
  max-width: none;
  min-width: 0;
  overflow: hidden;
}
body.calendar-mode-list .rowline:not(.day-expanded-rowline):not(.ev-preview-rowline) > .item:not(.tail-item):not(.quickstart-item) .ev-text-pair .ev-desc-text{
  display: block;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
  overflow: hidden;
  text-overflow: clip;
  padding-left: 4px;
  opacity: 0.7;
}
body.calendar-mode-list .rowline:not(.ev-preview-rowline) > .item .ev-cover-float{
  display: none;
}
body.calendar-mode-list .rowline:not(.ev-preview-rowline) > .item.highlight.highlight-has-cover .ev-cover-float{
  display: block;
  float: right;
  position: absolute;
  right: 0;
  width: clamp(88px, 42%, 220px);
  max-width: 50%;
  aspect-ratio: 2 / 1;
  height: auto;
  max-height: calc(100% - 4px);
  margin: 2px 2px 2px 8px;
  border-radius: 8px;
  overflow: hidden;
  background-image: var(--ev-highlight-cover, none);
  background-size: cover;
  background-position: center;
  pointer-events: none;
}
body.calendar-mode-list .rowline:not(.ev-preview-rowline) > .item.highlight.highlight-has-cover .ev-cover-float .ev-cover-float-img{
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
body.calendar-mode-list .rowline:not(.day-expanded-rowline):not(.ev-preview-rowline) > .item.highlight.highlight-has-cover .ev-text-pair .ev-desc-text{
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
  display: block;
}
.item.ev-variant-regular{
  background: linear-gradient(
  145deg,
  var(--surface-10event),
  var(--surface-11event)
  ) padding-box,
  linear-gradient(
  354deg,
  var(--ev-regular-stroke) 0%,
  rgba(0, 0, 0, 0) 60%
  ) border-box;
  border: 1px solid transparent;
  box-sizing: border-box;
  isolation: isolate;
}.item.ev-variant-highlight{
  border: none;
  box-sizing: border-box;
  background: var(--ev-highlight-bg, transparent);
}.item.highlight{
  /* Highlight events should look identical to normal ones; only background + optional cover differ. */
  isolation: isolate;
  min-height: calc(var(--ENTRY_H) * 2);
}.rowline > .item.highlight:not(.tail-item){
  height: calc(var(--ENTRY_H) * 2);
  min-height: calc(var(--ENTRY_H) * 2);
  align-items: start !important;
}.item.highlight.highlight-has-cover{
  height: calc(var(--ENTRY_H) * 2);
  min-height: calc(var(--ENTRY_H) * 2);
}.item.highlight::after{
  content: none;
  display: none;
}.item.highlight.highlight-has-cover::before{
  content: none;
  display: none;
}@keyframes marquee_pingpong{
  0% { transform: translateX(0); }
  100% { transform: translateX(var(--overflow-translate, 0px)); }
}.marquee-pingpong{
  animation: marquee_pingpong var(--marquee-duration, 4s) linear infinite alternate;
}.marquee-vertical-pingpong{
  animation: marquee_vertical_pingpong var(--marquee-vertical-duration, 5s) ease-in-out infinite alternate;
  will-change: transform;
}@keyframes marquee_vertical_pingpong{
  0% { transform: translateY(0); }
  100% { transform: translateY(var(--overflow-translate-y, 0px)); }
}/* плавная подсветка day и line */
.day.flash, .line.flash{
  transition: background-color 0.45s ease;
}.day.flash.active, .line.flash.active{
  background-color: rgba(255, 255, 255, 0.55);
}.day.flash.fade-out, .line.flash.fade-out{
  background-color: transparent;
}/* ---------------- 6) Modal / Pickers ---------------- */

/* overlay */
.overlay{
  position: fixed;
  overscroll-behavior: contain;
  overscroll-behavior: none;
  inset: 0;
  padding-top: 10px;
  justify-content: center;
  overflow-y: auto;
  padding-top: 10px;
  background: rgba(0, 0, 0, 0.7);
  backdrop-filter: blur(2px);
  display: none;
  z-index: 900;
}
#modal.overlay{
  overflow: hidden;
  padding-top: 0;
  display: none;
  justify-content: center;
  align-items: stretch;
}
#modal.overlay.open{
  display: flex;
}

.overlay.open{
  display: flex;
  z-index: 2900;
}
.map-picker-overlay{
  z-index: 12150;
}/* карточка модалки */
.sheet{
  width: min(520px, 92vw);
  max-width: 520px;
  margin: 0 auto;
  border-radius: 4px;
  padding: 0;
  box-sizing: border-box;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}.sheet h2{
  margin: 0 0 10px;
  font-size: 16px;
}#eventAddressWrap{
  cursor: pointer;
}#eventAddressWrap .event-text-field[readonly]{
  cursor: pointer;
  caret-color: transparent;
}/* Map picker */
.map-picker-sheet{
  width: min(720px, 94vw);
  background: var(--surface-8);
  max-width: 720px;
  height: min(720px, calc(100lvh - 24px));
  padding: 0;
}.map-picker-header{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 12px 14px;
  border-bottom: 1px solid var(--surface-border);
}.map-picker-title{
  font-size: 15px;
  font-weight: 700;
}.map-picker-body{
  position: relative;
  flex: 1 1 auto;
  min-height: 240px;
  background: var(--map-picker-space-color, #e9eef2);
}.map-picker-body.is-mode-discover{
  background: var(--map-picker-space-color, #141414);
}.map-picker-body.is-globe{
  background: var(--map-picker-space-color);
}.map-picker-body.is-globe .map-picker-stars-canvas{
  position: absolute;
  inset: -14%;
  width: 128%;
  height: 128%;
  pointer-events: none;
  z-index: 1;
  opacity: var(--map-globe-star-opacity, 1);
  transform: translate3d(0, 0, 0);
  will-change: opacity, transform;
}
.map-picker-map{
  position: absolute;
  inset: 0;
  background: transparent;
}.map-picker-map.is-globe{
  background: transparent;
  z-index: 2;
}.discover-map-radius-outline{
  --discover-radar-wave-rgb: 162, 162, 162;
  --discover-radar-fill-rgb: 148, 148, 148;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate3d(-50%, -50%, 0);
  transform-origin: 50% 50%;
  border: 0;
  border-radius: 9999px;
  box-sizing: border-box;
  pointer-events: none;
  overflow: visible;
  z-index: 4;
  transition: none;
  will-change: left, top, width, height;
  contain: layout style paint;
  box-shadow: none;
}.discover-map-radius-outline::before,
.discover-map-radius-outline::after{
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  box-shadow: 0 0 10px rgba(49, 123, 177, 1);
  border: 4px solid rgba(0, 140, 255, 0.8);
  transform-origin: 50% 50%;
  transform: scale(0.01);
  opacity: 0;
  animation: none;
  will-change: transform, opacity;
}.discover-map-radius-outline::after{
  animation-delay: 0.3s;
}.discover-map-radius-outline.is-wave-pulse::before,
.discover-map-radius-outline.is-wave-pulse::after{
  animation: discoverRadarWavePulse 2.8s cubic-bezier(0, 0.32, 0.64, 1) 1;
}.discover-map-radius-outline.is-wave-loop::before,
.discover-map-radius-outline.is-wave-loop::after,
.discover-map-radius-outline.is-wave-loop-before::before,
.discover-map-radius-outline.is-wave-loop-after::after{
  animation: discoverRadarWavePulse 2.8s cubic-bezier(0, 0.32, 0.64, 1) infinite;
}.discover-map-radius-outline.is-wave-pulse::after,
.discover-map-radius-outline.is-wave-loop::after,
.discover-map-radius-outline.is-wave-loop-after::after{
  animation-delay: 0.3s;
}.discover-map-radius-outline.discover-map-radius-outline-pin{
  --discover-radar-wave-rgb: 176, 176, 176;
  --discover-radar-fill-rgb: 160, 160, 160;
  z-index: 3;
  opacity: 0.92;
}@keyframes discoverRadarWavePulse{
  0%{
    transform: scale(0.01);
    opacity: 0;
  }
  16%{
    opacity: 0.5;
  }
  76%{
    opacity: 0.14;
  }
  100%{
    transform: scale(1);
    opacity: 0;
  }
}@media (prefers-reduced-motion: reduce){
  .discover-map-radius-outline::before,
  .discover-map-radius-outline::after{
    animation: none;
    transform: scale(1);
    opacity: 0.18;
  }
}.discover-map-event-marker-wrap{
  border: 0 !important;
  background: transparent !important;
}.discover-map-event-marker{
  display: block;
  position: relative;
  overflow: visible;
  width: 24px;
  height: 24px;
  border-radius: 999px;
  border: 2px solid rgb(255,255,255);
  background-color: color-mix(in srgb, var(--surface-2) 86%, #111 14%);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  box-shadow: 0 6px 14px rgba(0,0,0,0.28);
  opacity: 1 !important;
  transition: none !important;
}.maplibregl-marker[data-discover-marker="1"]{
  opacity: 1 !important;
  transition: none !important;
}.maplibregl-marker[data-discover-marker="1"] > .discover-map-event-marker{
  opacity: 1 !important;
  transition: none !important;
}.discover-map-event-marker.is-cover{
  border-radius: 7px;
}.discover-map-event-marker-days-badge{
  position: absolute;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  right: -8px;
  top: -8px;
  min-width: 22px;
  height: 22px;
  padding: 0 5px;
  border-radius: 999px;
  box-sizing: border-box;
  background: #fff;
  color: #000;
  font-size: 13px;
  line-height: 22px;
  font-weight: 800;
  letter-spacing: 0;
  text-align: center;
  box-shadow: 0 2px 6px rgba(0,0,0,0.28);
  pointer-events: none;
}.map-picker-user-dot{
  width: 14px;
  height: 14px;
  border-radius: 999px;
  background: #2286ff;
  border: 2px solid rgba(255,255,255,0.98);
  box-shadow: 0 3px 10px rgba(0,0,0,0.35);
}.map-picker-point-marker{
  position: relative;
  display: block;
  width: 20px;
  height: 20px;
  border-radius: 50% 50% 50% 0;
  background: #ff3b30;
  border: 2px solid #fff;
  transform: rotate(-45deg);
  box-shadow: 0 8px 18px rgba(0,0,0,0.38);
  padding: 0;
  outline: none;
  cursor: default;
  pointer-events: none;
}.map-picker-point-marker::after{
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 7px;
  height: 7px;
  border-radius: 999px;
  background: #fff;
  transform: translate(-50%, -50%) rotate(45deg);
}.map-picker-point-marker.map-picker-point-marker-discover{
  width: auto;
  min-width: 64px;
  height: 26px;
  z-index: 10;
  padding: 0 10px;
  border-radius: 999px;
  border: none;
  color: #000000;
  background: white;
  font-size: 12px;
  font-weight: 700;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
  transform: translateY(-8px);
  pointer-events: auto;
  cursor: pointer;
}.map-picker-point-marker.map-picker-point-marker-discover::after{
  content: none;
  display: none;
}.map-picker-point-marker.map-picker-point-marker-discover.map-picker-point-marker-discover-pending{
  min-width: 84px;
  background: #ffffff;
  color: #000000;
  transition: opacity 160ms ease, transform 160ms ease;
}.map-picker-point-marker.map-picker-point-marker-discover.map-picker-point-marker-discover-pending::after{
  background: #ffffff;
}.map-picker-point-marker.map-picker-point-marker-discover.map-picker-point-marker-discover-pending.is-fading-in,
.map-picker-point-marker.map-picker-point-marker-discover.map-picker-point-marker-discover-pending.is-fading-out{
  opacity: 0;
  transform: translateY(-8px) scale(0.9);
  pointer-events: none;
}.map-picker-point-marker.map-picker-point-marker-discover:focus-visible{
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--accent) 45%, transparent), 0 6px 14px rgba(0,0,0,0.25);
}.discover-map-left-controls{
  position: absolute;
  left: 12px;
  bottom: calc(40px + env(safe-area-inset-bottom, 0px));
  z-index: 26;
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
}.discover-map-left-controls > *{
  pointer-events: auto;
}.discover-map-left-controls .discover-map-zoom-badge{
  position: absolute;
  left: calc(100% + 8px);
  bottom: 2px;
  font-size: 10px;
  line-height: 1;
  font-weight: 600;
  color: rgba(255,255,255,0.7);
  background: rgba(0,0,0,0.3);
  border-radius: 999px;
  padding: 2px 6px;
  pointer-events: none;
  user-select: none;
  white-space: nowrap;
  z-index: 1;
}.discover-map-left-controls .discover-map-layer-indicator{
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 4px;
  border-radius: 999px;
  background: rgba(0,0,0,0.38);
  box-shadow: 0 1px 3px rgba(0,0,0,0.28);
  z-index: 1;
}.discover-map-left-controls .discover-map-layer-btn{
  min-width: 42px;
  height: 24px;
  border: 0;
  border-radius: 999px;
  padding: 0 8px;
  font-size: 11px;
  font-weight: 700;
  line-height: 1;
  color: #fff;
  background: rgba(255,255,255,0.12);
  opacity: 0.4;
  cursor: pointer;
  transition: opacity 160ms ease, background-color 160ms ease;
}.discover-map-left-controls .discover-map-layer-btn.is-active{
  opacity: 0.9;
  background: rgba(255,255,255,0.22);
}.discover-map-left-controls .discover-map-layer-btn.is-inactive{
  opacity: 0.4;
}.discover-map-left-controls .discover-map-layer-btn:focus-visible{
  outline: 2px solid rgba(255,255,255,0.74);
  outline-offset: 1px;
}.discover-map-left-controls .map-picker-point-marker.map-picker-point-marker-discover.discover-map-center-radius-btn{
  position: static;
  transform: none;
  margin: 0;
  min-width: 64px;
  height: 32px;
  padding: 0 10px;
  border-radius: 999px;
  background: rgba(0,0,0,0.78);
  color: #ffffff;
  box-shadow: 0 1px 3px rgba(0,0,0,0.35);
  z-index: 1;
  pointer-events: none;
}.discover-map-left-controls .map-picker-locate-btn.discover-map-fullscreen-locate{
  position: static;
  left: auto;
  right: auto;
  top: auto;
  bottom: auto;
  width: auto;
  min-height: 32px;
  height: 32px;
  padding: 0 10px 0 8px;
  gap: 6px;
  border-radius: 999px;
  background: #000;
  border: 0;
  box-shadow: 0 1px 3px rgba(0,0,0,0.3);
  color: #fff;
  z-index: 1;
}.discover-map-left-controls .map-picker-locate-btn.discover-map-fullscreen-locate img{
  width: 16px;
  height: 16px;
}.discover-map-left-controls .map-picker-locate-btn.discover-map-fullscreen-locate .map-picker-locate-label{
  display: inline-block;
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
  white-space: nowrap;
}.map-picker-locate-btn{
  position: absolute;
  right: 12px;
  top: 12px;
  z-index: 520;
  width: 36px;
  height: 36px;
  border-radius: 999px;
  background: var(--accent);
  color: var(--text-primary);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  font-weight: 700;
}.map-picker-locate-btn img{
  width: 18px;
  height: 18px;
}.map-picker-pin-btn{
  position: absolute;
  right: 12px;
  top: 100px;
  z-index: 520;
  width: 36px;
  height: 36px;
  border-radius: 999px;
  background: var(--surface-2);
  color: var(--text-primary);
  border: 1px solid var(--surface-border);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 6px 14px rgba(0,0,0,0.25);
}.map-picker-pin-btn img{
  width: 18px;
  height: 18px;
  display: block;
}.map-picker-pin-btn.is-active{
  background: var(--surface-2);
  border-color: var(--surface-border);
}.map-picker-pin-btn.is-active img{
  filter: none;
}.map-picker-pin-radius-btn{
  position: absolute;
  left: 0;
  right: auto;
  top: 0;
  bottom: auto;
  transform: translate(0, 0);
  z-index: 520;
  min-width: 64px;
  height: 36px;
  padding: 0 10px;
  border-radius: 999px;
  background: var(--surface-2);
  color: var(--text-primary);
  border: 1px solid var(--surface-border);
  display: none;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
  box-shadow: 0 6px 14px rgba(0,0,0,0.25);
}.map-picker-radius-btn{
  position: absolute;
  right: 12px;
  top: 56px;
  z-index: 520;
  min-width: 64px;
  height: 36px;
  padding: 0 10px;
  border-radius: 999px;
  background: var(--surface-2);
  color: var(--text-primary);
  border: 1px solid var(--surface-border);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
  box-shadow: 0 6px 14px rgba(0,0,0,0.25);
}.map-picker-overlay .map-picker-body.is-mode-discover .map-picker-locate-btn:not(.discover-map-fullscreen-locate){
  left: 12px;
  right: auto;
  top: auto;
  bottom: calc(102px + env(safe-area-inset-bottom, 0px));
  width: 32px;
  height: 32px;
}.map-picker-overlay .map-picker-body.is-mode-discover .map-picker-pin-btn{
  left: 12px;
  right: auto;
  top: auto;
  bottom: calc(148px + env(safe-area-inset-bottom, 0px));
  width: 32px;
  height: 32px;
  display: none !important;
}.map-picker-overlay .map-picker-body.is-mode-discover .map-picker-pin-radius-btn{
  left: 0;
  right: auto;
  top: 0;
  bottom: auto;
  min-width: 64px;
  height: 32px;
  padding: 0 9px;
  font-size: 11px;
  line-height: 1;
}.map-picker-overlay .map-picker-body.is-mode-discover .map-picker-locate-btn:not(.discover-map-fullscreen-locate) img{
  width: 26px;
  height: 26px;
}.map-picker-overlay .map-picker-body.is-mode-discover .map-picker-pin-btn img{
  width: 20px;
  height: 20px;
}.map-picker-overlay .map-picker-body.is-mode-discover .map-picker-radius-btn{
  left: 12px;
  right: auto;
  top: auto;
  bottom: calc(56px + env(safe-area-inset-bottom, 0px));
}.discover-map-fullscreen-view .map-picker-locate-btn.discover-map-fullscreen-locate{
  position: static;
  left: auto;
  right: auto;
  top: auto;
  bottom: auto;
  width: auto;
  min-height: 32px;
  height: 32px;
  padding: 0 10px 0 8px;
  gap: 6px;
  border-radius: 999px;
  background: #000;
  border: 0;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
  color: #fff;
}.discover-map-fullscreen-view .map-picker-pin-btn.discover-map-fullscreen-pin{
  left: 12px;
  right: auto;
  top: auto;
  bottom: calc(148px + env(safe-area-inset-bottom, 0px));
  width: 32px;
  height: 32px;
  display: none !important;
}.discover-map-fullscreen-view .map-picker-pin-radius-btn.discover-map-fullscreen-pin-radius{
  left: 0;
  right: auto;
  top: 0;
  bottom: auto;
  min-width: 64px;
  height: 32px;
  padding: 0 9px;
  font-size: 11px;
  line-height: 1;
}.discover-map-fullscreen-view .map-picker-locate-btn.discover-map-fullscreen-locate img{
  width: 16px;
  height: 16px;
}.discover-map-fullscreen-view .map-picker-locate-btn.discover-map-fullscreen-locate .map-picker-locate-label{
  display: inline-block;
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
  white-space: nowrap;
}.discover-map-fullscreen-view .map-picker-pin-btn.discover-map-fullscreen-pin img{
  width: 20px;
  height: 20px;
}.discover-map-fullscreen-view .map-picker-radius-btn.discover-map-fullscreen-radius{
  left: auto;
  right: auto;
  top: auto;
  bottom: auto;
}.discover-map-country-badge{
  position: absolute;
  left: 52px;
  right: auto;
  top: auto;
  bottom: calc(102px + env(safe-area-inset-bottom, 0px));
  z-index: 526;
  font-size: 11px;
  line-height: 1;
  letter-spacing: 0.01em;
  color: black;
  pointer-events: none;
}.discover-map-country-badge.is-unknown{
  opacity: 0.82;
}.map-picker-overlay .map-picker-body.is-mode-discover .discover-map-country-badge{
  left: 52px;
  right: auto;
  top: auto;
  bottom: calc(102px + env(safe-area-inset-bottom, 0px));
}.discover-map-fullscreen-view .discover-map-country-badge{
  left: 52px;
  right: auto;
  top: auto;
  bottom: calc(102px + env(safe-area-inset-bottom, 0px));
}
@media (max-width: 430px){
  .discover-map-country-badge{
    max-width: min(58vw, 198px);
    font-size: 10px;
    padding: 0 8px;
  }
}.map-picker-attrib-link{
  position: absolute;
  right: 12px;
  bottom: calc(12px + env(safe-area-inset-bottom, 0px));
  z-index: 520;
  font-size: 10px;
  color: rgba(255, 255, 255, 0.8);
  cursor: pointer;
}.map-picker-attrib-link:hover{
  border-color: rgba(245, 248, 255, 1);
}.discover-map-fullscreen-view .map-picker-attrib-link{
  z-index: 25;
}.map-picker-attrib-popover{
  position: absolute;
  right: 12px;
  bottom: calc(40px + env(safe-area-inset-bottom, 0px));
  z-index: 521;
  min-width: 220px;
  max-width: min(78vw, 320px);
  padding: 4px;
  border-radius: 10px;
  border: 1px solid var(--surface-border);
  background: var(--surface-2);
  box-shadow: var(--shadow-elevated);
  display: flex;
  flex-direction: column;
  gap: 2px;
}.map-picker-attrib-popover[hidden]{
  display: none !important;
}.map-picker-attrib-item{
  display: block;
  padding: 8px 10px;
  border-radius: 8px;
  color: var(--text-primary);
  text-decoration: none;
  font-size: 13px;
  line-height: 1.25;
}.map-picker-attrib-item:visited{
  color: var(--text-primary);
}.map-picker-attrib-item:hover{
  background: color-mix(in srgb, var(--surface-11event) 74%, transparent);
}.discover-map-fullscreen-view .map-picker-attrib-popover{
  z-index: 26;
}.map-picker-radius-btn.is-muted,
.map-picker-radius-btn[aria-disabled="true"],
.map-picker-radius-btn:disabled{
  opacity: 0.55;
  color: var(--btn-text-muted);
  pointer-events: none;
}.map-picker-footer{
  padding: 12px 14px calc(14px + 0px);
  border-top: 1px solid var(--surface-border);
  display: flex;
  flex-direction: column;
  gap: 10px;
}.map-picker-address{
  font-size: 12px;
  opacity: 0.86;
  line-height: 1.35;
  min-height: 32px;
}.map-picker-address.is-pending{
  opacity: 0.65;
}.map-picker-sheet .primary{
  width: 100%;
  border-radius: 999px;
}/* Event view modal (deeplink) */
body.event-view-open{
  overflow: hidden;
}.event-view-overlay{
  z-index: 1200;
}.event-view-sheet{
  width: min(720px, 94vw);
  max-width: 720px;
  max-height: 85lvh;
  position: relative;
  border-radius: 18px;
  --event-view-accent-rgb: 125, 125, 125;
  --event-view-regular-stroke: rgba(255,255,255,0.35);
  --event-view-row-fill: var(--surface-4);
  --event-view-row-border: var(--surface-border);
  background: var(--surface-2);
  color: var(--text-primary);
  border: 1px solid var(--surface-border);
  box-shadow: var(--shadow-elevated);
}.event-view-sheet.event-view-sheet--accent{
  border-color: transparent;
  background: linear-gradient(
  135deg,
  var(--surface-7),
  var(--surface-3)
  ) padding-box,
  linear-gradient(
  130deg,
  var(--event-view-regular-stroke, rgba(255,255,255,0.35)) 0%,
  rgba(0, 0, 0, 0) 100%
  ) border-box;
}.event-view-sheet.event-view-sheet--accent .event-view-row,
.event-view-sheet.event-view-sheet--accent .event-view-alert{
  background: linear-gradient(
  35deg,
  var(--surface-11event),
  var(--surface-10event)
  ) padding-box,
  linear-gradient(
  358deg,
  var(--event-view-regular-stroke, rgba(255,255,255,0.35)) 0%,
  rgba(0, 0, 0, 0) 100%
  ) border-box
}.event-view-sheet.event-view-sheet--highlight{
  background: var(--event-view-highlight-bg, var(--surface-2));
  border: none;
}.event-view-sheet.event-view-sheet--highlight .event-view-row,
.event-view-sheet.event-view-sheet--highlight .event-view-alert{
  --event-view-row-fill: rgba(255, 255, 255, 0.16);
  --event-view-row-border: rgba(255, 255, 255, 0.34);
}.event-view-header{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
}.event-view-titlewrap{
  min-width: 0;
  margin-top: 12px;
  text-align: center;
}.event-view-title{
  font-size: 16px;
  font-weight: 800;
  color: var(--text-primary);
  word-break: break-word;
}.event-view-sub{
  margin-top: 4px;
  padding: 10px;
  font-size: 12px;
  color: var(--text-muted);
}.event-view-close{
  position: absolute;
  top: 14px;
  right: 14px;
  border: none;
  width: 28px;
  height: 28px;
  padding: 0;
  background: transparent;
  color: var(--text-primary);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  z-index: 2;
}.event-view-close img{
  width: 100%;
  height: 100%;
  display: block;
}.event-view-back{
  position: absolute;
  top: 14px;
  left: 14px;
  border: none;
  width: 28px;
  height: 28px;
  padding: 0;
  background: transparent;
  color: var(--text-primary);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  z-index: 2;
}.event-view-back img{
  width: 100%;
  height: 100%;
  display: block;
}.event-view-back[aria-hidden="true"]{
  pointer-events: none;
}.event-view-body{
  margin-top: 10px;
}.event-view-alert{
  margin-bottom: 10px;
  padding: 10px 12px;
  border-radius: 12px;
  background: var(--event-view-row-fill);
  color: var(--text-primary);
  border: 1px solid var(--event-view-row-border);
  font-size: 13px;
}.event-view-row{
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin: 0 14px;
  padding: 10px 12px;
  border-radius: 12px;
  background: var(--event-view-row-fill);
  border: 1px solid var(--event-view-row-border);
}.event-view-join-actions{
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}.event-view-dm-btn{
  width: 100%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}.event-view-join-info{
  font-size: 12px;
  color: var(--text-muted);
}.event-view-label{
  font-size: 12px;
  color: var(--text-muted);
  font-weight: 700;
}.event-view-desc{
  font-size: 13px;
  color: var(--text-primary);
  align-self: center;
  text-align: center;
  white-space: pre-wrap;
  word-break: break-word;
}.event-view-task-items{
  align-self: stretch;
  text-align: left;
}.event-view-slot-requests-desc{
  align-self: stretch;
  text-align: left;
}.event-view-slot-requests-body{
  box-shadow: none;
  overflow: visible;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
}.event-view-slot-requests-body .task-list{
  gap: 6px;
}.event-view-slot-request-item{
  cursor: default;
}.event-view-slot-request-message{
  white-space: pre-wrap;
  word-break: break-word;
  line-height: 1.35;
}.event-view-daylist{
  display: flex;
  flex-direction: column;
  gap: 8px;
}.event-view-dayitem{
  width: 100%;
  border: 1px solid var(--event-view-row-border);
  background: var(--surface-3);
  color: var(--text-primary);
  border-radius: 10px;
  padding: 10px 12px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  text-align: left;
  cursor: pointer;
}.event-view-dayitem:active{
  transform: translateY(1px);
}.event-view-dayitem-time{
  font-size: 12px;
  color: var(--text-muted);
  font-weight: 600;
}.event-view-dayitem-title{
  font-size: 13px;
  font-weight: 700;
  color: var(--text-primary);
}.ev-taskitem-meta{
  margin-top: 3px;
  font-size: 11px;
  opacity: 0.78;
}.event-view-extra{
  margin-top: 10px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}.event-view-info{
  display: flex;
  flex-direction: column;
  gap: 6px;
}.event-view-info-title{
  font-size: 15px;
  font-weight: 800;
  color: var(--text-primary);
}.event-view-info-desc{
  font-size: 13px;
  color: var(--text-primary);
  white-space: pre-wrap;
  word-break: break-word;
}.event-view-location-desc{
  display: flex;
  align-items: center;
  flex-direction: column;
  gap: 10px;
}.event-view-location-text{
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}.event-view-address-line{
  font-size: 12px;
  opacity: 0.85;
}
.event-view-form-fields{
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.event-view-form-label{
  font-size: 12px;
  color: var(--text-muted);
  font-weight: 700;
}
.event-view-form-input{
  width: 100%;
  min-height: 44px;
  border-radius: 12px;
  border: 1px solid var(--surface-border);
  background: var(--surface-4);
  color: var(--text-primary);
  padding: 10px 12px;
  resize: vertical;
}
.event-view-form-input:focus{
  outline: none;
  border-color: var(--accent);
}
.event-view-footer #eventViewSlotBookingBtn{
  width: 100%;
  flex: 1 1 100%;
  min-width: 0;
}.event-view-footer{
  padding: 8px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}.event-view-action-btn{
  flex: 1 1 calc(25% - 8px);
  min-width: 120px;
  border-radius: 10px;
  background: var(--surface-4);
  justify-content: center;
}
@media (max-width: 820px){
  .event-view-action-btn{
    flex-basis: calc(33.333% - 8px);
    min-width: 108px;
  }
}
@media (max-width: 560px){
  .event-view-action-btn{
    flex-basis: calc(50% - 8px);
    min-width: 0;
  }
}.sheet-scroll{
  flex: 1 1 auto;
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
  padding-right: 2px;
}@keyframes skeleton-shine{
  0%{ background-position: -180% 0; }
  100%{ background-position: 180% 0; }
}.skeleton-ghost{
  position: relative;
  overflow: hidden;
}.skeleton-ghost::after{
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(255,255,255,0.08) 0%, rgba(255,255,255,0.16) 50%, rgba(255,255,255,0.08) 100%);
  background-size: 200% 100%;
  animation: skeleton-shine 1.2s ease-in-out infinite;
  opacity: 0.65;
  pointer-events: none;
}/* сетка полей */
.sheet .grid{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}.sheet .grid#eventHighlightWrap{
  grid-template-columns: 1fr;
}.sheet .grid > *{
  min-width: 0;
  padding: 6px 8px 6px;
  font-size: 13px;
}
/* Main tab is a vertical list; two-column layout is used only inside time/date pickers rows. */
#eventCreateTabWrap{
  display: flex;
  flex-direction: column;
  gap: 0px;
}
#eventCreateTabWrap > *{
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
}.event-all-day-row{
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  min-width: 0;
  flex-wrap: nowrap;
}
#eventCreateTabWrap #eventAllDayRow.event-create-preset-managed-block{
  flex-wrap: nowrap;
}
#eventCreateTabWrap #eventAllDayRow.event-create-preset-managed-block > .event-create-preset-tools{
  display: none;
  flex: 0 0 100%;
  width: 100%;
  order: -1;
}
#eventCreateTabWrap #eventAllDayRow.event-create-preset-managed-block.is-preset-editing{
  flex-wrap: wrap;
}
#eventCreateTabWrap #eventAllDayRow.event-create-preset-managed-block.is-preset-editing > .event-create-preset-tools{
  display: flex;
}
#eventCreateTabWrap #eventClientLinkWrap.event-create-preset-managed-block > .event-create-preset-tools,
#eventCreateTabWrap .note-private.event-create-preset-managed-block > .event-create-preset-tools{
  display: none;
  flex: 0 0 100%;
  width: 100%;
  order: -1;
}
#eventCreateTabWrap #eventClientLinkWrap.event-create-preset-managed-block.is-preset-editing > .event-create-preset-tools,
#eventCreateTabWrap .note-private.event-create-preset-managed-block.is-preset-editing > .event-create-preset-tools{
  display: flex;
}.event-all-day-section{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-width: 0;
  flex: 0 1 auto;
}.event-all-day-section--no-time, .event-all-day-section--all-day{
  justify-content: flex-start;
  flex: 1 1 0;
}.event-all-day-section--color{
  justify-content: center;
  overflow: hidden;
}.event-all-day-title{
  font-weight: 500;
  line-height: 12px;
  min-width: 0;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
  text-align: end;
}.event-time-toggle-row{
  display: flex;
  align-items: center;
  gap: 2px;
  width: 100%;
  min-width: 0;
}.event-color-quick-label{
  flex: 0 0 auto;
}.event-color-quick-row{
  display: inline-flex;
  height: 36px;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: flex-start;
  gap: 6px;
  flex: 0 0 auto;
  min-width: 36px;
  max-width: 100%;
  box-sizing: border-box;
  padding: 6px;
  border-radius: 8px;
  overflow: hidden;
}.event-color-quick-row::-webkit-scrollbar{
  display: none;
}.event-color-quick-row.is-disabled{
  opacity: 0.45;
  pointer-events: none;
}.event-color-quick-row .cal-theme-swatch{
  width: 26px;
  height: 26px;
  min-width: 26px;
  min-height: 26px;
  aspect-ratio: 1 / 1;
  border-radius: 8px;
  flex: 0 0 auto;
  padding: 0;
  line-height: 0;
}.event-color-quick-btn{
  border: none;
  background: transparent;
  padding: 0;
  cursor: pointer;
}.event-color-quick-btn.is-disabled{
  cursor: default;
}.event-color-quick-swatch{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  border-radius: 8px;
  outline: 1px solid var(--surface-7);
  color: gold;
  font-size: 14px;
  line-height: 1;
}.event-color-quick-swatch.is-highlight{
  text-shadow: 0 1px 3px rgba(0,0,0,0.45);
}.event-remind-row{
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}.event-remind-left{
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  min-width: 0;
}.event-remind-title{
  font-weight: 650;
  line-height: 1.2;
  min-width: 0;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
  flex: 0 1 124px;
}.event-remind-left .cal-toggle{
  margin-left: 0;
  flex: 0 0 auto;
}.event-remind-picker-mount{
  flex: 1 1 auto;
  min-width: 0;
}.event-remind-picker-shell{
  display: flex;
  flex-direction: column;
  gap: 2px;
  transition: opacity 0.16s ease;
}.event-remind-picker-shell.is-disabled{
  opacity: 0.35;
  pointer-events: none;
}.event-remind-picker{
  overflow: hidden;
  position: relative;
}.event-remind-picker .picker{
  min-width: 0;
  padding-inline-end: 0;
}.event-remind-picker .picker.event-remind-unit-picker .picker-item{
  text-align: right;
  padding-inline-end: 18px;
}.event-remind-picker-unit-overlay{
  position: absolute;
  inset: 0;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  pointer-events: none;
  z-index: 4;
}.event-remind-picker-unit{
  align-self: center;
  justify-self: end;
  padding-right: 8px;
  font-size: 10px;
  line-height: 1;
  font-weight: 650;
  opacity: 0.72;
  white-space: nowrap;
}.event-remind-picker--compact .picker{
  --picker-h: 32px;
  --picker-item-h: 26px;
  background: var(--surface-9);
  border-radius: 8px;
}.event-remind-picker--compact .picker-item{
  font-size: 13px;
}.event-remind-picker--compact .picker-item.active{
  font-size: 14px;
}.event-remind-picker--full .picker{
  --picker-h: 74px;
  --picker-item-h: 24px;
}.event-remind-picker--full .event-remind-picker-unit{
  font-size: 11px;
}
.event-remind-sheet{
  width: min(520px, 92vw);
  max-height: 88vh;
  overflow: auto;
  padding: 14px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}.event-remind-sheet-head{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}.event-remind-sheet-title{
  font-size: 15px;
  font-weight: 700;
}.event-remind-sheet-close{
  width: 34px;
  min-width: 34px;
  height: 34px;
  border-radius: 10px;
  padding: 0;
}.event-remind-sheet-toggle-row{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}.event-remind-sheet-toggle-label{
  font-weight: 650;
}.event-remind-sheet-picker-mount{
  width: 100%;
}.event-remind-sheet-hint{
  font-size: 12px;
  color: var(--muted);
}.event-remind-sheet-actions{
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
}.event-remind-sheet-actions button{
  min-width: 110px;
}
@media (max-width: 640px){
  .event-remind-sheet{
    width: calc(100vw - 24px);
  }
  .event-remind-sheet-actions{
    flex-direction: column-reverse;
    align-items: stretch;
  }
  .event-remind-sheet-actions button{
    width: 100%;
  }
}
.event-remind-row.is-disabled .event-remind-picker-shell{
  opacity: 0.35;
  pointer-events: none;
}.share-overlay{
  z-index: 12080;
}.share-sheet-main{
  width: min(760px, 96vw);
}.share-sheet-header{
  padding: 2px 2px 0;
}.share-sheet-title{
  font-size: 16px;
  font-weight: 700;
  line-height: 1.25;
  min-height: 20px;
  word-break: break-word;
}.share-cards{
  margin-top: 8px;
}
.share-card{
  display: flex;
  flex-direction: column;
  gap: 8px;
  flex: 1 1 auto;
  min-width: 0;
  background: var(--surface-3);
  border-radius: 12px;
  padding: 10px;
  cursor: pointer;
}
.share-card.is-disabled{
  opacity: 0.55;
  cursor: default;
}
.share-web-bar{
  display: flex;
  align-items: center;
  gap: 10px;
  color: var(--text-muted);
  font-size: 12px;
}
.share-web-dots{
  display: inline-flex;
  gap: 5px;
  align-items: center;
}
.share-web-dots .dot{
  width: 10px;
  height: 10px;
  border-radius: 999px;
  display: inline-block;
}
.share-web-dots .dot-red{ background: #FF5F57; }
.share-web-dots .dot-yellow{ background: #FFBD2E; }
.share-web-dots .dot-green{ background: #28C840; }
.share-web-domain{
  opacity: 0.85;
  letter-spacing: 0.01em;
}
.share-toast{
  position: fixed;
  left: 50%;
  bottom: 18px;
  transform: translateX(-50%) translateY(6px);
  background: rgba(0,0,0,0.85);
  color: #fff;
  padding: 8px 12px;
  border-radius: 10px;
  font-size: 12px;
  z-index: 15000;
  opacity: 0;
  transition: opacity 0.18s ease, transform 0.18s ease;
  pointer-events: none;
}
.share-toast.is-show{
  opacity: 1;
  transform: translateX(-50%) translateY(0);
}
.share-card-media{
  width: 100%;
  height: 124px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: color-mix(in srgb, var(--surface-4) 84%, transparent);
  overflow: hidden;
}
.share-card-img{
  width: 86px;
  height: 86px;
  object-fit: contain;
  object-position: 50% 50%;
  border-radius: 0;
}
.share-card-img-icon{
  display: block;
  background-color: #0088CC;
  -webkit-mask-image: var(--share-card-icon);
  mask-image: var(--share-card-icon);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: contain;
  mask-size: contain;
}
@supports not ((-webkit-mask-image: url("")) or (mask-image: url(""))) {
  .share-card-img-icon{
    background-color: transparent;
    background-image: var(--share-card-icon);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
  }
}
.share-tg-ui{
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 2px 6px;
}
.share-tg-island{
  width: 72px;
  height: 12px;
  border-radius: 999px;
  background: var(--surface-1);
}
.share-tg-home{
  width: 26px;
  height: 26px;
  border-radius: 999px;
  border: 3px solid var(--surface-1);
}
.share-card[data-share="web"] .share-card-img:not(.share-card-img-icon){
  animation: share-pan-x 8s ease-in-out infinite alternate;
}
.share-card[data-share="tg-context"] .share-card-img:not(.share-card-img-icon){
  animation: share-pan-y 8s ease-in-out infinite alternate;
}
@keyframes share-pan-x{
  from{ object-position: 0% 50%; }
  to{ object-position: 100% 50%; }
}
@keyframes share-pan-y{
  from{ object-position: 50% 0%; }
  to{ object-position: 50% 100%; }
}
@media (prefers-reduced-motion: reduce){
  .share-card-img{ animation: none !important; }
}
.share-card-body{
  display: flex;
  flex-direction: column;
  gap: 6px;
}.share-card-title{
  font-size: 14px;
  font-weight: 700;
}
#shareCalendarCardTitleName{
  color: var(--accent);
  margin-left: 4px;
}
.share-card-btn{
  width: 100%;
}
.purchase-offer-overlay{
  z-index: 12110;
}
.purchase-offer-sheet{
  width: min(620px, 94vw);
}
#subscriptionPlanOfferOverlay .purchase-offer-sheet{
  width: min(1180px, 96vw);
}
.purchase-offer-intro{
  gap: 10px;
}
.purchase-offer-bullets{
  margin: 0;
  padding-left: 18px;
  display: none;
  opacity: 0.92;
}
.purchase-offer-grid{
  margin-top: 10px;
}
.purchase-offer-option{
  gap: 10px;
  min-height: 64px;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  transition: background-color 140ms ease, border-color 140ms ease, opacity 140ms ease;
}
.purchase-offer-option.is-active{
  background: var(--surface-7);
}
.purchase-offer-option.is-disabled{
  opacity: 0.52;
  cursor: default;
}
.purchase-offer-option:focus-visible{
  outline: 2px solid color-mix(in srgb, var(--accent) 70%, white);
  outline-offset: 1px;
}
.purchase-offer-option-title{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.35;
  text-align: center;
  width: 100%;
}
.purchase-offer-option-title-text{
  min-width: 0;
}
.purchase-offer-option-badge{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 1px 8px;
  border-radius: 999px;
  font-size: 10px;
  line-height: 1.35;
  font-weight: 800;
  letter-spacing: 0.01em;
  color: #fff;
  background: #6b7280;
  white-space: nowrap;
}
.purchase-offer-option-badge.is-discount{
  background: #d93025;
}
.purchase-offer-option.has-subtitle{
  justify-content: flex-start;
  align-items: flex-start;
  text-align: left;
}
.purchase-offer-option-subtitle{
  width: 100%;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.45;
  opacity: 0.84;
  white-space: pre-line;
}
.purchase-offer-footer{
  padding: 10px 12px;
  border-top: 1px solid var(--surface-border);
  justify-content: stretch;
}
.purchase-offer-footer > button{
  width: 100%;
  min-width: 0;
}
.purchase-success-overlay{
  z-index: 12120;
}
.purchase-success-sheet{
  width: min(560px, 94vw);
}
.purchase-success-intro{
  align-items: center;
  text-align: center;
  gap: 10px;
}
.purchase-success-glow-wrap{
  width: 100%;
  display: flex;
  justify-content: center;
  margin-top: 2px;
  margin-bottom: 2px;
}
.purchase-success-item{
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 52px;
  max-width: min(420px, 100%);
  padding: 10px 20px;
  border-radius: 999px;
  background: linear-gradient(120deg, #FFD54F 0%, #FF8A65 100%);
  color: #1a1a1a;
  font-size: 22px;
  font-weight: 850;
  line-height: 1.15;
  letter-spacing: 0.01em;
  box-shadow:
    0 0 0 1px rgba(255,255,255,0.25) inset,
    0 10px 30px rgba(255, 152, 0, 0.28),
    0 0 28px rgba(255, 193, 7, 0.36);
  overflow: hidden;
  animation: purchase-success-pulse 2.1s ease-in-out infinite;
}
.purchase-success-item::after{
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(100deg, transparent 18%, rgba(255,255,255,0.45) 50%, transparent 82%);
  transform: translateX(-120%);
  animation: purchase-success-sweep 2.8s ease-in-out infinite;
}
.purchase-success-section{
  gap: 8px;
}
.purchase-success-section-title{
  font-size: 12px;
  line-height: 1.3;
  letter-spacing: 0.01em;
  opacity: 0.74;
  text-transform: uppercase;
}
.purchase-success-list{
  margin: 0;
  padding-left: 18px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-size: 13px;
  line-height: 1.4;
}
.purchase-success-list li{
  margin: 0;
}
@keyframes purchase-success-pulse{
  0%{ transform: translateZ(0) scale(1); box-shadow: 0 0 0 1px rgba(255,255,255,0.25) inset, 0 10px 30px rgba(255, 152, 0, 0.28), 0 0 28px rgba(255, 193, 7, 0.36); }
  50%{ transform: translateZ(0) scale(1.02); box-shadow: 0 0 0 1px rgba(255,255,255,0.34) inset, 0 14px 36px rgba(255, 152, 0, 0.34), 0 0 34px rgba(255, 193, 7, 0.44); }
  100%{ transform: translateZ(0) scale(1); box-shadow: 0 0 0 1px rgba(255,255,255,0.25) inset, 0 10px 30px rgba(255, 152, 0, 0.28), 0 0 28px rgba(255, 193, 7, 0.36); }
}
@keyframes purchase-success-sweep{
  0%{ transform: translateX(-120%); }
  55%{ transform: translateX(-120%); }
  100%{ transform: translateX(120%); }
}
.subscription-plan-grid{
  margin-top: 10px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}
.subscription-plan-card{
  display: flex;
  flex-direction: column;
  gap: 10px;
  background: var(--surface-2);
  box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.20);
}
.subscription-plan-card.is-current{
  border-color: var(--accent);
}
.subscription-plan-head{
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.subscription-plan-name{
  font-size: 33px;
  line-height: 1.04;
}
.subscription-plan-tagline{
  font-size: 14px;
  line-height: 1.35;
  opacity: 0.88;
}
.subscription-plan-price{
  display: inline-flex;
  align-items: baseline;
  gap: 6px;
  font-size: 26px;
  line-height: 1.1;
}
.subscription-plan-price-main{
  font-size: inherit;
  line-height: inherit;
}
.subscription-plan-price-period{
  font-size: 13px;
  line-height: 1.2;
  opacity: 0.8;
}
.subscription-plan-cta{
  width: 100%;
  min-width: 0;
}
.subscription-plan-section{
  display: flex;
  flex-direction: column;
  gap: 7px;
}
.subscription-plan-list{
  margin: 0;
  padding-left: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 5px;
  font-size: 13px;
  line-height: 1.45;
}
.subscription-plan-list li{
  margin: 0;
  display: flex;
  align-items: flex-start;
  gap: 8px;
}
.subscription-plan-list li::before{
  content: '';
  width: 20px;
  height: 20px;
  flex: 0 0 20px;
  -webkit-mask: center / 20px 20px no-repeat url('/static/svg/CheckMark.svg');
  mask: center / 20px 20px no-repeat url('/static/svg/CheckMark.svg');
  background: var(--text-primary);
  opacity: 0.8;
}
.subscription-plan-list--plain li{
  gap: 0;
}
.subscription-plan-list--plain li::before{
  display: none;
}
.subscription-plan-section-muted{
  opacity: 0.8;
}
.subscription-plan-section-muted .subscription-plan-list li{
  color: var(--text-secondary);
  font-style: italic;
  font-weight: 400;
  opacity: 0.82;
}
.subscription-plan-section-muted .subscription-plan-list li::before{
  opacity: 0.6;
}
@media (orientation: portrait){
  #subscriptionPlanOfferOverlay .purchase-offer-sheet{
    width: min(98vw, 680px);
    height: 96lvh;
    max-height: none;
    background: var(--surface-10event);
  }
  .subscription-plan-grid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-areas:
      "plus pro"
      "start start";
  }
  .subscription-plan-card--plus{
    grid-area: plus;
  }
  .subscription-plan-card--pro{
    grid-area: pro;
  }
  .subscription-plan-card--start{
    grid-area: start;
  }
  .subscription-plan-name{
    font-size: 30px;
  }
}
.event-color-popover-backdrop{
  position: fixed;
  inset: 0;
  background: transparent;
  z-index: 9998;
}.event-color-popover{
  position: fixed;
  z-index: 9999;
  background: var(--surface-8);
  border: 1px solid var(--surface-border);
  border-radius: 12px;
  padding: 10px;
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
  min-width: 170px;
  box-shadow: 0 12px 40px rgba(0,0,0,0.35);
}.event-color-popover .event-color-popover-grid{
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}.event-color-popover .cal-theme-swatch{
  width: 28px;
  height: 28px;
  border-radius: 8px;
}.event-color-popover .event-color-popover-edit-btn{
  width: 100%;
  min-width: 0;
  white-space: nowrap;
  padding: 8px 4px;
}.event-color-popover .event-color-popover-edit-btn.is-disabled{
  opacity: 0.45;
  pointer-events: none;
}.modal-sheet{
  position: absolute;
  width: 90%;
  height: 100vh;
  overflow-y: auto;
}.modal-sheet-footer{
  position: absolute;
  background: var(--surface-2);
  width: 100%;
  bottom: 0px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 110;
}#modal{
  gap: 4px;
  overflow-y: hidden;
  overscroll-behavior: none;
}#modal .event-modal-shell{
  position: relative;
  align-items: flex-start;
  overscroll-behavior: none;
  transform-origin: top center;
  display: flex;
  width: fit-content;
  max-width: 100%;
  min-height: 0;
  margin: 0 auto;
  gap: 4px;
  top: 4px;
  height: calc(100% - 4px);
  box-shadow: 0 8px 18px rgba(0,0,0,0.4);
}#modal .modal-sheet{
  overscroll-behavior: contain;
  position: relative;
  background: var(--surface-8);
  width: clamp(220px, calc(100vw - 50px), 520px);
  max-width: 520px;
  min-height: 0;
  margin: 0;
  overflow: hidden;
}#modal .event-modal-shell .modal-sheet{
  top: 0;
  height: 100%;
}
#modal .modal-sheet .modal-scroll{
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: scroll;
  overflow-x: hidden;
  overscroll-behavior: contain;
  overflow-anchor: none !important;
  -webkit-overflow-scrolling: touch;
  /* Keep scrollbar rail on the left side only for event modal. */
  direction: rtl;
  padding-left: 0;
  padding-right: 0;
}#modal .modal-sheet .modal-scroll > *{
  direction: ltr;
}
#modal .modal-sheet .modal-scroll .event-modal-scroll-spacer{
  width: 100%;
  min-height: 400px;
  height: 400px;
  pointer-events: none;
}
#modal .modal-sheet > .event-create-preset-footer{
  width: 100%;
  box-sizing: border-box;
  flex: 0 0 auto;
  align-self: stretch;
  position: relative;
  z-index: 12;
  padding: 4px 0px 4px 0px;
  max-height: 120px;
  opacity: 1;
  overflow: hidden;
  transition: none;
}#eventCreatePresetFooter .event-create-preset-mode-row{
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  padding: 0;
  margin: 0 0 6px;
  max-height: 30px;
  min-height: 0;
  opacity: 1;
  overflow: hidden;
  transform: translateY(0);
  transition: none;
}
@media (max-width: 900px){
  #modal .modal-sheet .modal-scroll{
    direction: ltr;
  }
}#eventCreatePresetFooter .event-create-preset-mode-row.is-collapsed{
  max-height: 0;
  margin-bottom: 0;
  opacity: 0;
  transform: translateY(-3px);
  pointer-events: none;
}.event-create-preset-mode-actions{
  display:flex;
  align-items:center;
  gap: 6px;
}#eventCreatePresetFooter .event-create-preset-rename-btn{
  flex: 0 0 auto;
  min-height: 24px;
  border-radius: 999px;
  color: var(--text-primary);
  padding: 2px 10px;
  font-size: 12px;
  line-height: 1.1;
  cursor: pointer;
}#eventCreatePresetFooter .event-create-preset-delete-btn{
  flex: 0 0 auto;
  min-height: 24px;
  border-radius: 999px;
  padding: 2px 10px;
  font-size: 12px;
  line-height: 1.1;
  cursor: pointer;
  color: var(--error, #ff453a);
}#eventCreatePresetFooter .event-create-preset-mode-switch{
  gap: 4px;
  border-radius: 999px;
  padding: 0;
  border: 0;
  box-shadow: none;
}#eventCreatePresetFooter .event-create-preset-mode-btn{
  height: 28px;
  padding: 3px 10px;
  font-size: 13px;
  color: var(--text-secondary);
  cursor: pointer;
}#eventCreatePresetFooter .event-create-preset-mode-btn.is-active{
  background: var(--accent);
  color: white;
}#eventCreatePresetFooter .event-create-preset-default-btn{
  color: var(--text-primary);
  border-color: var(--surface-6);
}#eventCreatePresetFooter .event-create-preset-mode-btn:disabled,
#eventCreatePresetFooter .event-create-preset-rename-btn:disabled,
#eventCreatePresetFooter .event-create-preset-delete-btn:disabled{
  opacity: 0.45;
  pointer-events: none;
}#eventCreatePresetFooter .event-create-preset-rename-btn.is-locked,
#eventCreatePresetFooter .event-create-preset-delete-btn.is-locked{
  opacity: 0.5;
  pointer-events: none;
}#eventCreatePresetFooter .event-create-preset-strip{
  display: flex;
  align-items: center;
  gap: 8px;
  overflow-x: auto;
  overflow-y: hidden;
  padding: 2px;
  padding-left: 4px;
  max-height: 32px;
  opacity: 1;
  scrollbar-width: none;
  transition: none;
}#eventCreatePresetFooter .event-create-preset-sort-container{
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  flex: 0 0 auto;
}#eventCreatePresetFooter .event-create-preset-strip::-webkit-scrollbar{
  display: none;
}#eventCreatePresetFooter.is-compact-collapsed .event-create-preset-mode-row{
  max-height: 0;
  margin-bottom: 0;
  opacity: 0;
  transform: translateY(-3px);
  pointer-events: none;
}#eventCreatePresetFooter.is-compact-collapsed .event-create-preset-strip{
  max-height: 0;
  padding-top: 0;
  padding-bottom: 0;
  opacity: 0;
  pointer-events: none;
}#modal .modal-sheet > .event-create-preset-footer.is-compact-collapsed{
  max-height: 0;
  padding-top: 0;
  padding-bottom: 0;
  opacity: 0;
  pointer-events: none;
  box-shadow: none;
}#eventCreatePresetFooter.is-auto-compact-switch .event-create-preset-mode-row,
#eventCreatePresetFooter.is-auto-compact-switch .event-create-preset-strip,
#eventCreatePresetFooter.is-auto-compact-switch .event-create-preset-mode-btn{
  transition: none !important;
}#eventCreatePresetFooter .event-create-preset-chip{
  flex: 0 0 auto;
  height: 28px;
  background: var(--surface-8);
  color: var(--text-primary);
  padding: 4px 10px;
  font-size: 14px;
  white-space: nowrap;
  cursor: pointer;
}#eventCreatePresetFooter .event-create-preset-chip.is-plus{
  min-width: 28px;
  width: 28px;
  padding: 0;
  font-weight: 500;
  font-size: 16px;
}#eventCreatePresetFooter .event-create-preset-chip.is-active{
  background: var(--surface-7);
  color: white;
}#eventCreatePresetFooter .event-create-preset-chip.is-editing{
  box-shadow: inset 0 0 0 1px var(--accent);
}#eventCreatePresetFooter .event-create-preset-chip.event-create-preset-chip--base-task,
#eventCreatePresetFooter .event-create-preset-chip.event-create-preset-chip--base-client,
#eventCreatePresetFooter .event-create-preset-chip.event-create-preset-chip--base-slot{
  --basepresetcolor: var(--surface-8);
  background:
    linear-gradient(
      145deg,
    var(--basepresetcolor),
    var(--basepresetcolor)
    ) padding-box,
    linear-gradient(320deg, var(--preset-base-chip-accent), rgba(0, 0, 0, 0)70%) border-box;
  border: 1px solid transparent;
  color: var(--text-primary);
}#eventCreatePresetFooter .event-create-preset-chip.event-create-preset-chip--base-task{
  --preset-base-chip-accent: rgba(255, 0, 0, 1);
}#eventCreatePresetFooter .event-create-preset-chip.event-create-preset-chip--base-client{
  --preset-base-chip-accent: rgba(0, 122, 255, 1);
}#eventCreatePresetFooter .event-create-preset-chip.event-create-preset-chip--base-slot{
  --preset-base-chip-accent: rgba(52, 199, 89, 1);
}#eventCreatePresetFooter .event-create-preset-chip.event-create-preset-chip--base-task.is-active,
#eventCreatePresetFooter .event-create-preset-chip.event-create-preset-chip--base-client.is-active,
#eventCreatePresetFooter .event-create-preset-chip.event-create-preset-chip--base-slot.is-active{
  --basepresetcolor: var(--surface-9);
  color: var(--text-primary);
}#eventCreatePresetFooter .event-create-preset-chip.event-create-preset-chip--base-task.is-editing,
#eventCreatePresetFooter .event-create-preset-chip.event-create-preset-chip--base-client.is-editing,
#eventCreatePresetFooter .event-create-preset-chip.event-create-preset-chip--base-slot.is-editing{
  box-shadow: none;
}#eventCreatePresetFooter .event-create-preset-sort-container.is-drag-enabled .event-create-preset-chip[data-sort-id]{
  cursor: grab;
  touch-action: none;
  user-select: none;
  -webkit-user-select: none;
  -webkit-user-drag: none;
}#eventCreatePresetFooter .event-create-preset-sort-container.is-drag-enabled .event-create-preset-chip[data-sort-id].is-dragging{
  opacity: 0.45;
  cursor: grabbing;
}#eventCreateTabWrap .event-create-preset-managed-block{
  position: relative;
  margin-top: 8px;
  --preset-tools-max-h: 0;
  --preset-tools-mb: 0;
  --preset-tools-pad-y: 0;
  --preset-tools-opacity: 0;
  --preset-tools-scale: 0;
  --preset-tools-pe: none;
  border-radius: 0;
  background: var(--surface-4);
  transition:
    background-color 320ms cubic-bezier(0.22, 0.78, 0.25, 1),
    border-radius 320ms cubic-bezier(0.22, 0.78, 0.25, 1);
}#eventCreateTabWrap .event-create-preset-managed-block.is-preset-editing{
  --preset-tools-max-h: 22px;
  --preset-tools-mb: 4px;
  --preset-tools-pad-y: 1px;
  --preset-tools-opacity: 1;
  --preset-tools-scale: 1;
  --preset-tools-pe: auto;
  background-color: var(--accent-alfa);
}#eventCreateTabWrap .event-create-preset-tools{
  display: flex;
  justify-content: center;
  margin-bottom: var(--preset-tools-mb, 0);
  gap: 4px;
  box-sizing: border-box;
  border-radius: 8px;
  max-height: var(--preset-tools-max-h, 0);
  padding: var(--preset-tools-pad-y, 0) 4px;
  opacity: var(--preset-tools-opacity, 0);
  transform: scaleY(var(--preset-tools-scale, 0));
  transform-origin: top center;
  pointer-events: var(--preset-tools-pe, none);
  overflow: hidden;
  transition:
    max-height 320ms cubic-bezier(0.22, 0.78, 0.25, 1),
    margin-bottom 320ms cubic-bezier(0.22, 0.78, 0.25, 1),
    padding 320ms cubic-bezier(0.22, 0.78, 0.25, 1),
    opacity 260ms ease,
    transform 320ms cubic-bezier(0.22, 0.78, 0.25, 1);
}#eventCreateTabWrap .event-create-preset-tool-btn[data-act="hide"],
#eventCreateTabWrap .event-create-preset-tool-btn[data-act="restore"]{
  max-width: 72px;
  opacity: 1;
  transform: scale(1);
  overflow: hidden;
  transition:
    max-width 220ms cubic-bezier(0.22, 0.78, 0.25, 1),
    opacity 180ms ease,
    transform 220ms cubic-bezier(0.22, 0.78, 0.25, 1);
}#eventCreateTabWrap .event-create-preset-tool-btn[data-act="restore"]{
  max-width: 0;
  opacity: 0;
  transform: scale(0.92);
  pointer-events: none;
  padding-left: 0;
  padding-right: 0;
  border-width: 0;
}#eventCreateTabWrap .event-create-preset-managed-block.is-order-only > .event-create-preset-tools .event-create-preset-tool-btn[data-act="hide"],
#eventCreateTabWrap .event-create-preset-managed-block.is-order-only > .event-create-preset-tools .event-create-preset-tool-btn[data-act="restore"]{
  max-width: 0;
  opacity: 0;
  transform: scale(0.92);
  pointer-events: none;
  padding-left: 0;
  padding-right: 0;
  border-width: 0;
}#eventCreateTabWrap .event-create-preset-managed-block.is-preset-hidden > .event-create-preset-tools .event-create-preset-tool-btn[data-act="hide"]{
  max-width: 0;
  opacity: 0;
  transform: scale(0.92);
  pointer-events: none;
  padding-left: 0;
  padding-right: 0;
  border-width: 0;
}#eventCreateTabWrap .event-create-preset-managed-block.is-preset-hidden > .event-create-preset-tools .event-create-preset-tool-btn[data-act="restore"]{
  max-width: 72px;
  opacity: 1;
  transform: scale(1);
  pointer-events: auto;
  padding-left: 7px;
  padding-right: 7px;
}#eventCreateTabWrap .event-create-preset-tool-btn{
  border: none;
  background: var(--surface-4);
  font-size: 11px;
  line-height: 1;
  min-height: 18px;
  height: 18px;
  padding: 0 7px;
  cursor: pointer;
}#eventCreateTabWrap .event-create-preset-tool-btn.event-create-preset-tool-icon{
  min-width: 18px;
  width: 18px;
  padding: 0;
  font-size: 12px;
  font-weight: 700;
}#eventCreateTabWrap .event-create-preset-tool-btn:disabled{
  opacity: 0.35;
  pointer-events: none;
}#eventCreateTabWrap .event-create-preset-tool-btn.is-locked{
  opacity: 0.5;
  pointer-events: none;
}#eventCreateTabWrap .event-create-preset-hidden-zone{
  display: none;
  padding: 10px 0px;
  background: var(--surface-4);
}#eventCreateTabWrap .event-create-preset-hidden-title{
  font-size: 13fpx;
  text-transform: uppercase;
  margin-bottom: 6px;
}#eventCreateTabWrap .event-create-preset-managed-block.is-preset-hidden{
  opacity: 0.88;
}#modal .event-modal-actions{
  position: relative;
  display: flex;
  justify-content: flex-start;
  align-items: stretch;
  gap: 8px;
  width: 100%;
  box-sizing: border-box;
  padding: 8px 8px 20px 8px;
}#modal .event-modal-btn{
  flex: 1 1 0;
  min-width: 0;
  min-height: 34px;
  width: auto;
  height: 34px;
  padding: 0 10px;
  border-radius: 10px;
  border: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  position: relative;
  user-select: none;
  -webkit-user-select: none;
  -webkit-tap-highlight-color: transparent;
  background-color: var(--surface-9);
  color: var(--text-primary);
  font-size: 14px;
  font-weight: 650;
  line-height: 1;
  text-align: center;
}#modal .event-modal-btn .event-modal-btn-label{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}#modal .event-modal-btn:disabled{
  opacity: 0.45;
  cursor: default;
  pointer-events: none;
}#modal .event-modal-btn.is-disabled,
#modal .event-modal-btn[aria-disabled="true"]{
  opacity: 0.45;
  cursor: default;
  pointer-events: none;
}#modal .event-modal-btn.is-busy .event-modal-btn-label{
  opacity: 0.55;
}#modal #btnDelete{
  display: none;
}#modal .event-modal-btn:focus-visible{
  outline: 2px solid var(--accent);
  outline-offset: 1px;
}
html:has(body.event-modal-open){
  overscroll-behavior: none !important;
}
body.event-modal-open{
  min-width: 0;
  overscroll-behavior: none;
  touch-action: auto !important;
}
.event-modal-tabs{
  display: flex;
  gap: 0;
  flex-wrap: wrap;
  justify-content: space-evenly;
  height: 40px;
  position: relative;
}.event-modal-tabs .event-tab-btn{
  position: relative;
  overflow: visible;
  border-radius: 999px;
  padding: 0px 4px;
  border: none;
  font-size: 13px;
  color: var(--text-secondary);
}.event-modal-tabs .event-tab-btn + .event-tab-btn{
  margin-left: 0;
}.event-tab-badge{
  position: absolute;
  top: -4px;
  right: 0px;
  padding: 0px 3px 0px;
  height: 10px;
  border-radius: 6px;
  font-size: 10px;
  font-weight: 400;
  line-height: 0.9;
}.event-tab-badges{
  position: absolute;
  top: -3px;
  right: 0px;
  display: inline-flex;
  gap: 1px;
  pointer-events: none;
}.event-tab-badges .event-tab-badge{
  position: static;
}.event-tab-badge.is-public{
  background: rgb(255,59,48);
  color: rgba(255,255,255,0.98);
}.event-tab-badge.is-private{
  background: rgb(255,59,48);
  color: rgba(255,255,255,0.98);
}.event-tab-badge.is-discover{
  background: rgb(255,59,48);
  color: rgba(255,255,255,0.98);
}.event-tab-badge.is-task{
  background: rgb(255, 59, 48);
  color: rgba(255,255,255,0.98);
}.event-tab-badge.is-task-undone{
  background: rgb(255,59,48);
  color: rgba(255,255,255,0.98);
}.event-tab-badge.is-task-done{
  background: rgb(34,197,94);
  color: rgba(255,255,255,0.98);
}.event-modal-tab-block{
  grid-column-start: 1;
  grid-column-end: -1;
  display: flex;
  flex-direction: column;
}#eventHighlightColorPreviewBlock .event-highlight-color-wrap{
  margin: 0 0 8px;
}#eventHighlightColorPreviewBlock .event-highlight-color-wrap .cal-theme-presets{
  margin-top: 0;
}#eventPublicFeedWrap{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  align-items: start;
}#eventPublicFeedWrap > .event-discover-card{
  margin-top: 0 !important;
}#eventPublicFeedWrap > .event-discover-card-wide{
  grid-column: 1 / -1;
}@media (max-width: 760px){
  #eventPublicFeedWrap{
    grid-template-columns: 1fr;
  }
}.cal-settings-tabrow.event-modal-tabs{
  height: 40px;
}.cal-settings-tabrow.event-modal-tabs .event-tab-btn{
  padding: 0 4px;
}.event-tab-badge.is-highlight{
  color: var(--accent);
  font-size: 14px;
  top: 5px;
  right: -6px;
}.event-tab-badge.is-discover{
  background: transparent;
  color: gold;
  box-shadow: none;
  font-size: 14px;
}.event-tab-badge.is-participants{
  background: rgb(34,197,94);
  color: rgba(255,255,255,0.98);
}.event-tab-badge.is-participants-requests{
  background: rgb(255,59,48);
  color: rgba(255,255,255,0.98);
}.event-tab-badge.dot-badge{
  padding: 0;
  width: 12px;
  height: 12px;
  min-width: 12px;
  min-height: 12px;
  box-shadow: 0 8px 16px rgba(0,0,0,0.25);
}.event-tab-badge.dot-badge.task-dot{
  width: 6px;
  height: 6px;
  min-width: 6px;
  min-height: 6px;
  box-shadow: 0 6px 10px rgba(0,0,0,0.25);
}.tasklist-toggle{
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: transparent;
  font-size: 0;
}.tasklist-toggle::before{
  content: "";
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: rgb(255, 59, 48);
}.tasklist-toggle.is-done::before{
  background: rgb(34, 197, 94);
}.tasklist-toggle.is-undone::before{
  background: rgb(255, 59, 48);
}.event-modal-tabs .event-tab-btn.active{
  color: var(--text-primary);
  font-weight: 700;
}.event-modal-tabs .event-tab-btn:disabled{
  opacity: 0.55;
}#modal .event-modal-header{
  display: flex;
  align-items: center;
  gap: 8px;
  padding-right: 6px;
}#modal .event-modal-header > #eventModalTabs{
  flex: 1 1 auto;
  min-width: 0;
}#modal .event-modal-header .event-modal-tabs-close{
  flex: 0 0 auto;
  width: 32px;
  height: 32px;
  min-width: 32px;
  min-height: 32px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  margin: 0;
  border: none;
  cursor: pointer;
}#modal .event-modal-header .event-modal-tabs-close img{
  width: 20px;
  height: 20px;
  display: block;
  opacity: 0.9;
}#modal .event-modal-header .event-modal-tabs-close:hover{
  background: color-mix(in srgb, var(--surface-2) 70%, transparent);
}#modal .event-modal-header .event-modal-tabs-close:focus-visible{
  outline: 2px solid var(--accent);
  outline-offset: 1px;
}.event-modal-header{
  flex: 0 0 auto;
  z-index: 3;
  box-shadow: 0 10px 26px rgba(0,0,0,0.4);
}#modal.is-skeleton .event-modal-header, #modal.is-skeleton .event-modal-tabs, #modal.is-skeleton .sheet-footer, #modal.is-skeleton .event-modal-btn{
  position: relative;
  overflow: hidden;
  border-radius: 12px;
  background: var(--surface-3);
  pointer-events: none;
}#modal.is-skeleton .event-modal-header{ min-height: 48px; }#modal.is-skeleton .event-modal-tabs{ min-height: 38px; }#modal.is-skeleton .sheet-footer, #modal.is-skeleton .event-modal-btn{ min-height: 30px; }#modal.is-skeleton .event-modal-header::after, #modal.is-skeleton .event-modal-tabs::after, #modal.is-skeleton .sheet-footer::after, #modal.is-skeleton .event-modal-btn::after{
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(255,255,255,0.08) 0%, rgba(255,255,255,0.16) 50%, rgba(255,255,255,0.08) 100%);
  background-size: 200% 100%;
  animation: skeleton-shine 1.2s ease-in-out infinite;
  opacity: 0.65;
}#modal.is-skeleton .event-modal-tabs > *, #modal.is-skeleton .sheet-footer > *{
  opacity: 0;
}#modal.is-skeleton .event-modal-btn .event-modal-btn-label{
  opacity: 0;
}#eventHighlightControls{
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
}#eventHighlightControls .note{
}#eventHighlightControls .event-highlight-demo-preview{
  margin-top: 10px;
}.event-highlight-demo-preview .ev-preview-cover{
  pointer-events: none;
}.event-highlight-demo-preview .ev-preview-cover-plus{
  display: none;
}.event-highlight-demo-preview .ev-preview-swatch,
.event-highlight-demo-preview .ev-preview-item{
  transition: background 800ms ease;
}.event-highlight-gradient-disabled{
  opacity: 0.5;
  pointer-events: none;
}.event-highlight-unlock-slot{
  margin-top: 36px;
  font-size: 14px;
  text-align: center;
}.event-highlight-unlock-btn{
  font: inherit;
  padding: 4px 8px;
  background: var(--surface-10event);
  width: 100%;
  border-radius: 6px;
}#rowOpenEventBtn #btnAddParticipant{
  background: rgba(255, 255, 255, 0.24);
  height: 30px;
}.event-highlight-stop-row{
  display: flex;
  align-items: center;
  gap: 8px;
}.event-highlight-stop-label{
  width: 14px;
  text-align: center;
  font-size: 11px;
  opacity: 0.7;
}.event-highlight-stop-val{
  width: 40px;
  text-align: right;
  font-size: 11px;
  opacity: 0.7;
}:is(.sheet, .cal-settings-box) label{
  font-size: 12px;
  color: var(--muted);
}/* текстовые поля / селекты по умолчанию */
.ui-text-control,
:is(.sheet, .cal-settings-box) input[type="text"],
:is(.sheet, .cal-settings-box) input[type="search"],
:is(.sheet, .cal-settings-box) input[type="number"],
:is(.sheet, .cal-settings-box) select{
  width: 100%;
  height: 26px;
  font-size: 13px;
  scroll-margin: 20px;
  box-sizing: border-box;
  border-radius: 8px;
  border: none;
  outline: none;
  padding: 0px 6px;
  -webkit-appearance: none;
  appearance: none;
  background: var(--surface-2);
  color: var(--text-primary);
  transition: background 0.3s ease;
}.ui-text-control:focus,
:is(.sheet, .cal-settings-box) input[type="text"]:focus,
:is(.sheet, .cal-settings-box) input[type="search"]:focus,
:is(.sheet, .cal-settings-box) input[type="number"]:focus,
:is(.sheet, .cal-settings-box) select:focus{
  background: #fff;
}:is(.sheet, .cal-settings-box) .event-text-field{
  width: 100%;
  box-sizing: border-box;
  border-radius: 10px;
  background: var(--input-bg);
  color: var(--text-primary);
  border: none;
  outline: none;
  -webkit-appearance: none;
  appearance: none;
  font-size: 16px;
  padding: 8px 10px;
}:is(.sheet, .cal-settings-box) .event-text-field:focus{
  background: #fff;
}
:is(.sheet, .cal-settings-box) .event-text-field.is-geo-readonly,
:is(.sheet, .cal-settings-box) input.is-geo-readonly{
  pointer-events: none;
  user-select: none;
  caret-color: transparent;
}
:is(.sheet, .cal-settings-box) textarea.event-text-field{
  resize: vertical;
  min-height: 2.4em;
}:is(.sheet, .cal-settings-box) .tasklist-input, :is(.sheet, .cal-settings-box) .tasklist-desc{
  width: 100%;
  box-sizing: border-box;
  border-radius: 10px;
  color: var(--text-primary);
  border: none;
  outline: none;
  background: var(--input-bg);
  padding: 6px 6px;
  font-size: 14px;
  line-height: 1.25;
}:is(.sheet, .cal-settings-box) .tasklist-desc{
  resize: none;
  min-height: 2.6em;
  white-space: pre-wrap;
}.tasklist-deadline-row{
  display: flex;
  flex-wrap: nowrap;
  justify-content: flex-start;
  gap: 6px;
  margin-top: -6px;
  align-items: center;
}.tasklist-deadline-label{
  flex: 0 0 auto;
  font-size: 11px;
  opacity: 0.9;
  white-space: nowrap;
}.tasklist-deadline-value{
  flex: 0 0 auto;
  min-height: 22px;
  border: none;
  outline: none;
  border-radius: 0;
  padding: 0;
  background: transparent;
  color: var(--text-primary);
  font-size: 12px;
  line-height: 1.25;
  text-align: left;
  white-space: nowrap;
  cursor: pointer;
}.tasklist-deadline-value:focus-visible{
  text-decoration: underline;
}.tasklist-deadline-value:disabled{
  opacity: 0.5;
  cursor: default;
}.tasklist-connect-row{
  display: flex;
  align-items: center;
  margin-top: 6px;
  gap: 6px;
  min-width: 0;
}.tasklist-connect-meta{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  margin: 4px;
}.tasklist-connect-label{
  font-size: 11px;
  opacity: 0.72;
}.tasklist-connect-help{
  display: none;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  padding: 0;
  color: var(--surface-6);
  border-radius: 999px;
  border: 1px solid;  font-size: 12px;
  line-height: 1;
  pointer-events: auto;
}.tasklist-connect-modes{
  display: flex;
  flex-wrap: nowrap;
  gap: 4px;
  background: var(--surface-2);
  border-radius: 18px;
  justify-content: space-between;
  overflow-x: auto;
  min-width: 0;
  flex: 1 1 auto;
  padding: 2px;
}.tasklist-connect-btn{
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  gap: 2px;
  min-height: 26px;
  padding: 4px 6px;
  border-radius: 16px;
  font-size: 11px;
  line-height: 1;
  white-space: nowrap;
  opacity: 0.82;
}.tasklist-connect-btn-icon{
  width: 16px;
  height: 16px;
  flex: 0 0 16px;
}.tasklist-connect-btn.is-active{
  background: var(--accent-alfa);
  opacity: 1;
}.tasklist-connect-btn.is-muted,
.tasklist-connect-btn:disabled{
  opacity: 0.45;
}.tasklist-connect-btn.is-muted .tasklist-connect-help{
  display: inline-flex;
  opacity: 1;
}.users-overlay-state-badge{
  margin-left: 6px;
  font-size: 10px;
  opacity: 0.7;
}.users-overlay-state-badge.is-connected{
  color: rgb(34, 197, 94);
  opacity: 1;
}.users-overlay-state-badge.is-disconnected{
  color: rgb(255, 59, 48);
  opacity: 1;
}.users-overlay-row-action{
  min-height: 26px;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 11px;
  line-height: 1;
  white-space: nowrap;
}.tasklist-muted{
  opacity: 0.55;
}/* textarea личной заметки */
:is(.sheet, .cal-settings-box) .note-private textarea{
  display: block;
  width: 100%;
  scroll-margin: 20px;
  box-sizing: border-box;
  border-radius: 8px;
  background: var(--surface-2);
  color: var(--text-primary);
  border: none;
  outline: none;
  resize: none;
  height: auto;
  min-height: 3.5em;
  line-height: 1.25;
  overflow: auto;
  font-size: 14px;
  transition: background 0.3s ease;
}:is(.sheet, .cal-settings-box) .note-private textarea:focus{
  background: var(--surface-2);
}:is(.sheet, .cal-settings-box) .note-private textarea[rows]{
  min-height: 3.5em;
}
#eventTaskInlineWrap.event-task-inline-highlight{
  background: var(--accent);
  transition: background-color 0.35s ease;
}
.event-task-assign-row{
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin: 0 0 8px;
}
.event-task-assign-label{
  font-size: 12px;
  opacity: 0.72;
}
.event-task-assign-modes{
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.event-task-assign-btn{
  border-radius: 999px;
  padding: 6px 10px;
  min-height: 30px;
  font-size: 12px;
  line-height: 1;
}
.event-task-assign-btn.is-active{
  background: var(--surface-5);
}
.event-task-assign-summary{
  min-height: 14px;
  font-size: 12px;
  opacity: 0.76;
}
.event-task-assign-overlay{
  position: fixed;
  inset: 0;
  z-index: 1300;
  display: none;
  align-items: flex-end;
  justify-content: center;
  background: rgba(0, 0, 0, 0.35);
  backdrop-filter: blur(2px);
  -webkit-backdrop-filter: blur(2px);
}
.event-task-assign-box{
  width: min(560px, 96vw);
  max-height: min(76vh, 740px);
  background: var(--surface-8);
  border-radius: 16px 16px 0 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.event-task-assign-head{
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 12px;
  border-bottom: 1px solid var(--btn-border);
}
.event-task-assign-search{
  width: 100%;
  min-height: 36px;
  border-radius: 10px;
  border: none;
  outline: none;
  background: var(--input-bg);
  color: var(--text-primary);
  padding: 8px 10px;
}
.event-task-assign-close{
  width: 32px;
  height: 32px;
  border-radius: 999px;
  font-size: 18px;
  line-height: 1;
}
.event-task-assign-list{
  overflow: auto;
  padding: 8px 12px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.event-task-assign-pick-row{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 8px 10px;
  border-radius: 10px;
  background: var(--surface-2);
}
.event-task-assign-pick-name{
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.event-task-assign-empty{
  padding: 10px;
  opacity: 0.7;
  font-size: 13px;
}
.event-task-assign-footer{
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  padding: 12px;
  border-top: 1px solid var(--btn-border);
}

:is(.sheet, .cal-settings-box) input[type="text"]:focus,
:is(.sheet, .cal-settings-box) input[type="search"]:focus,
:is(.sheet, .cal-settings-box) input[type="number"]:focus,
:is(.sheet, .cal-settings-box) select:focus,
:is(.sheet, .cal-settings-box) textarea:focus,
:is(.sheet, .cal-settings-box) .event-text-field:focus,
:is(.sheet, .cal-settings-box) textarea.event-text-field:focus,
:is(.sheet, .cal-settings-box) .tasklist-input:focus,
:is(.sheet, .cal-settings-box) .tasklist-desc:focus{
  background: var(--surface-2);
}

@media (hover: none) and (pointer: coarse) {
  :is(.sheet, .cal-settings-box) input[type="text"],
  :is(.sheet, .cal-settings-box) input[type="search"],
  :is(.sheet, .cal-settings-box) input[type="number"],
  :is(.sheet, .cal-settings-box) select,
  :is(.sheet, .cal-settings-box) .event-text-field,
  :is(.sheet, .cal-settings-box) textarea.event-text-field,
  :is(.sheet, .cal-settings-box) .tasklist-input,
  :is(.sheet, .cal-settings-box) .tasklist-desc,
  :is(.sheet, .cal-settings-box) .note-private textarea{
    font-size: 16px;
  }
}

/* общий стиль кнопок */
button{
  border-radius: 30px;
  gap: 6px;
  cursor: pointer;
  border: none;
  outline: none;
  -webkit-appearance: none;
  appearance: none;
  box-sizing: border-box;
  background: transparent;
  color: inherit;
}/* кнопки в блоке .btns */
.btns{
  display: flex;
  justify-content: flex-end;
  align-items: center;
}.btns button{
  flex: 1 1 0;
  min-width: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 8px 18px;
  border-radius: var(--input-radius);
  cursor: pointer;
  outline: none;
  box-sizing: border-box;
  line-height: 1;
  font-size: 15px;
  color: var(--text-primary);
  background: var(--btn-bg-secondary);
}#eventViewRepostCheck.is-active{
  background: rgba(255, 255, 255, 0.14);
}.btns #btnDelete{
  background: #b02a2a;
  color: #ffffff;
}.btns .primary{
}.modal-action-rows{
  display: flex;
  flex-direction: column;
  gap: 8px;
  width: 100%;
  margin-top: 6px;
  align-items: stretch;
  justify-content: flex-start;
}/* --- Лимит участников: инпут + кнопка "Без лимита" в одну строку --- */
.cap-row{
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 6px;
}.cap-label{
  font-size: 13px;
  white-space: nowrap;
}.cap-input{
  flex: 1 1 0;
  max-width: 96px;
  text-align: center;
  background: #ffffff;
  color: #000000;
  font-variant-numeric: tabular-nums;
}.cap-input.is-active{
  background: rgba(54,205,124,0.20);
  color: #eafff2;
  box-shadow: inset 0 0 0 1px rgba(54,205,124,0.55);
}.cap-input.is-disabled{
  cursor: not-allowed;
  opacity: 0.30;
}/* hide number input spinners (capacity limit etc) */
input[type="number"]::-webkit-outer-spin-button, input[type="number"]::-webkit-inner-spin-button{
  -webkit-appearance: none;
  margin: 0;
}input[type="number"]{
  -moz-appearance: textfield;
  appearance: textfield;
}/* серое состояние — значение "не важно" (при включённом Без лимита) */
.cap-input.muted{
  background: #18181b;
  color: var(--muted);
}/* кнопка "Без лимита" */
.cap-btn{
  white-space: nowrap;
  padding-inline: 10px;
  background: #2a2a2e;
  color: var(--fg);
  font-size: 13px;
}/* активная — синий */
.cap-btn.active{
  background: var(--accent);
  color: #ffffff;
}/* --- Пикеры времени --- */

/* общий ряд: начало/конец на одной строке */
.time-pickers-row{
  display: flex;
  gap: 16px;
  margin-top: 4px;
}/* каждая половина (начало / конец) */
.time-pickers-group{
  flex: 1 1 0;
  position: relative;
  border-radius: 12px;
}
.time-pickers-group.is-muted{
  opacity: 0.4;
}/* подпись группы (Starts / Ends) */
.time-pickers-label{
  padding: 2px 8px 0;
  height: 14px;
  font-size: 12px;
  font-weight: 600;
  color: var(--muted);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.time-pickers-past{
  display: none;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  font-weight: 600;
  color: var(--surface-6);
}
.time-pickers-past.is-visible{
  display: inline-flex;
}/* внутри группы — часы и минуты рядом, одна общая плашка */
.time-pickers-inner{
  position: relative;
  display: flex;
  justify-content: center;
  gap: 8px;
}/* базовый picker */
.picker{
  position: relative;
  --picker-h: 74px;
  --picker-item-h: 24px;
  height: var(--picker-h);
  overflow-y: scroll;
  scroll-snap-type: y mandatory;
  scroll-padding-block: calc((var(--picker-h) - var(--picker-item-h)) / 2);
  padding-block: calc((var(--picker-h) - var(--picker-item-h)) / 2);
  box-sizing: border-box;
}.picker::-webkit-scrollbar{
  display: none;
}/* Hide scrollbars (global) */
html, body{
  scrollbar-width: none;      /* Firefox */
  -ms-overflow-style: none;   /* IE/Edge legacy */
}html::-webkit-scrollbar, body::-webkit-scrollbar{
  width: 0;
  height: 0;
  display: none;
}/* Hide scrollbars for common scroll containers */
#root, #rootGrid, .modal-scroll, .sheet-scroll, .picker{
  scrollbar-width: none;
  -ms-overflow-style: none;
}#root::-webkit-scrollbar, #rootGrid::-webkit-scrollbar, .modal-scroll::-webkit-scrollbar, .sheet-scroll::-webkit-scrollbar, .picker::-webkit-scrollbar{
  width: 0;
  height: 0;
  display: none;
}/* Keep modal sheet content scrollbar visible */
.modal-sheet .modal-scroll{
  overflow-y: scroll;
}.modal-sheet .modal-scroll::-webkit-scrollbar-track{
  background: rgba(255,255,255,.1);
  border-radius: 999px;
}.modal-sheet .modal-scroll::-webkit-scrollbar-thumb{
  background: var(--accent);
  border-radius: 999px;
  border: 2px solid rgba(255,255,255,.1);
}
.modal-sheet.has-scrollbar-ghost .modal-scroll{
  padding-right: 8px;
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.modal-sheet.has-scrollbar-ghost .modal-scroll::-webkit-scrollbar{
  width: 0;
  height: 0;
  display: none;
}
.modal-sheet .modal-scrollbar-ghost{
  position: absolute;
  right: 3px;
  top: 0;
  bottom: 0;
  width: 4px;
  border-radius: 999px;
  background: rgba(255,255,255,.08);
  opacity: 0;
  pointer-events: none;
  z-index: 30;
  transition: opacity 160ms ease;
}
.modal-sheet .modal-scrollbar-ghost.is-visible{
  opacity: 0.72;
}
.modal-sheet .modal-scrollbar-ghost.is-visible:not(.is-scrollable){
  opacity: 0.28;
}
.modal-sheet .modal-scrollbar-thumb{
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  border-radius: 999px;
  background: var(--accent);
  box-shadow: none;
}
/* In event modal keep ghost rail on the left, matching the native scrollbar side. */
#modal .modal-sheet.has-scrollbar-ghost .modal-scroll{
  padding-left: 8px;
  padding-right: 0;
}
#modal .modal-sheet .modal-scrollbar-ghost{
  left: 3px;
  right: auto;
}
/* во внутреннем ряду — ширина делится пополам, а не фикс 86px */
.time-pickers-inner .picker{
  width: auto;
  flex: 1 1 0;
  z-index: 2;
}.time-pickers-inner .picker.picker-meridiem{
  flex: 0 0 56px;
}/* элементы пикера */
.picker-item{
  height: var(--picker-item-h);
  line-height: var(--picker-item-h);
  text-align: center;
  scroll-snap-align: center;
  font-size: 14px;
  opacity: 0.3;
}.picker-item.active{
  font-weight: 500;
  font-size: 16px;
  z-index: 5;
  opacity: 1;
}.picker-center{
  position: absolute;
  align-self: center;
  height: 28px;
  background: var(--surface-9);
  pointer-events: none;
  border-radius: 8px;
  box-shadow: 0 0px 16px rgba(0, 0, 0, 0.2);
  z-index: 1;
}/* внутри time-pickers-inner делаем плашку чуть шире */
.time-pickers-inner .picker-center{
  left: 0px;
  right: 0px;
}/* In event modal, keep date/time blocks closer */
#eventDateRow{
  margin-top: 0 !important;
}
#eventTimeRow{
  border-radius: 10px;
}
#eventTimeRow.is-muted{
  opacity: 0.40;
}/* ---------------- 7) Calendar grid ---------------- */

/* общий контейнер месяца */
.cal-month{
  margin-top: 20px;
  margin-bottom: 14px;
  width: 100%;
}/* заголовок месяца */
.cal-month-header{
  font-weight: 500;
  margin: 40px 0px -24px 0px;
  position: sticky;
  display: inline-block;
  padding: 4px 10px;
  border-radius: 0px 7px 7px 0px;
  background: var(--surface-4);
  box-shadow: 0 12px 28px rgba(0,0,0,0.35);
  backdrop-filter: blur(5px);
}/* wrapper сетки */
.cal-grid{
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding-top: 6px;
}.cal-weekdays{
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 8px;
}.cal-weeks{
  display: flex;
  flex-direction: column;
  margin: 6px;
  gap: 8px;
}.cal-week{
  position: relative;
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 8px;
  --cal-week-bars-top: 30px;
  --cal-week-slots: 1;
}.cal-week-bars{
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  column-gap: 8px;
  row-gap: 2px;
  grid-auto-rows: 14px;
  padding-top: var(--cal-week-bars-top);
  pointer-events: none;
  align-content: start;
  z-index: 3;
}.cal-week-bars .cal-span-bar{
  pointer-events: auto;
  align-self: stretch;
  justify-self: stretch;
}.cal-week-bars .cal-bar.highlight{
  height: 100%;
}.cal-week-bars .cal-bar{
  height: 100%;
  position: relative;
  overflow: hidden;
  border-radius: 5px;
}.cal-week-bars .cal-bar-times{
  position: absolute;
  inset: 0;
  display: flex;
  justify-content: space-between;
  gap: 2px;
  padding: 0 2px;
  padding-right: var(--grid-time-end-pad, 3px);
  pointer-events: none;
  z-index: 5;
  font-size: 12px;
  line-height: 1;
}.cal-week-bars .cal-bar-time{
  min-width: 0;
  max-width: 48%;
  white-space: nowrap;
  overflow: hidden;
}.cal-week-bars .cal-bar-time--end{
  text-align: right;
}.cal-week-bars .cal-bar.ev-variant-regular{
  background: linear-gradient(
  145deg,
  var(--surface-10event),
  var(--surface-11event)
  ) padding-box,
  linear-gradient(
  320deg,
var(--ev-regular-stroke) 0%,
  rgba(0, 0, 0, 0) 100%
  ) border-box;
  border: 1.5px solid transparent;
  box-sizing: border-box;
  isolation: isolate;
}.cal-week-bars .cal-bar.is-draft{
  opacity: 0.66;
  filter: saturate(0.55);
}.cal-week-bars .grid-badges-right{
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  display: flex;
  flex-direction: row-reverse;
  align-items: stretch;
  gap: 2px;
  padding-right: 0;
  pointer-events: none;
  z-index: 6;
}.cal-week-bars .grid-badge-dot{
  height: 100%;
  aspect-ratio: 1 / 1;
  border-radius: 999px;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.12);
}.cal-week-bars .grid-badge-dot.is-discover{
  background: rgb(255,59,48);
}.cal-week-bars .grid-badge-dot.is-repost{
  background: rgb(59,130,246);
}.cal-week-bars .grid-badge-dot.is-repost-changed{
  background: rgb(255,214,10);
}.cal-week-bars .grid-badge-dot.is-joined{
  background: rgb(255,59,48);
}.cal-week-bars .grid-badge-dot.is-public{
  background: rgb(255,59,48);
}.cal-week-bars .grid-badge-dot.is-personal{
  background: rgb(168, 85, 247);
}.cal-week-bars .grid-badge-dot.is-private{
  background: rgb(255,59,48);
}.cal-week-bars .grid-badge-dot.is-repost-deleted{
  background: rgb(255,149,0);
}.cal-week-bars .grid-badge-dot.is-slot{
  background: rgb(52, 199, 89);
}.cal-week-bars .grid-badge-dot.is-bot{
  background: var(--accent);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.16);
}.cal-week-bars .grid-badge-dot.is-google{
  background: rgb(66, 133, 244);
}.cal-week-bars .grid-badge-dot.is-task{
  background: rgba(255,59,48,0.95);
}.cal-week-bars .grid-badge-dot.is-task-done{
  background: rgba(34, 197, 94, 0.92);
}/* заголовки дней недели */
.daycell-weekday{
  border-radius: 6px;
  overflow: hidden;
  font-size: 12px;
  text-align: left;
  padding: 6px 8px;
}/* пустая ячейка */
.daycell-empty{
  border-radius: 6px;
  overflow: hidden;
  background: transparent;
}/* daycell */
.daycell{
  border-radius: 6px;
  overflow: hidden;
  position: relative;
  flex-direction: column;
  min-height: calc(
  var(--cal-week-bars-top) +
  (var(--cal-week-slots) * 14px) +
  ((var(--cal-week-slots) - 1) * 2px) +
  12px
  );
  background: var(--surface-3);
}/* число дня */
.cal-dayhead{
  box-shadow: 0 2px 6px rgba(0,0,0,0.35);
  padding-left: 4px;
}
.cal-daynum{
  font-size: 18px;
  font-weight: 600;
  height: 22px;
}
.cal-more{
  position: absolute;
  right: 0px;
  bottom: 0px;
  font-size: 12px;
  font-weight: 600;
  padding: 0px 6px;
  border-radius: 999px;
  line-height: 1;
  white-space: nowrap;
}/* today */
.daycell.today-cell{
  background: var(--accent);
  color: white;
}.daycell.today-cell .cal-daynum{
}/* "мои" дни */
.daycell.daycell-own{

}/* если today + own */
.daycell.today-cell.daycell-own{
  /* keep subtle cell tint for own+today; number pill stays green */
  
}.daycell.weekend{
  /* keep the cell glassy; highlight only the day number */
  background: rgba(232, 57, 68, 1);
}.daycell.weekend .cal-daynum{
/* grid weekend cell */
}.daycell.today-cell.weekend{
  background: var(--accent);
  color: white;
}.daycell.today-cell.weekend .cal-daynum{
}/* один бар */
.cal-bar{
}.cal-bar.highlight{
  height: 26px;
  border-radius: 8px;
  position: relative;
  overflow: hidden;
}.cal-bar.highlight .cal-bar-cover{
  position: absolute;
  right: 2px;
  top: 2px;
  bottom: 2px;
  width: 18px;
  border-radius: 5px;
  background: var(--surface-3);
  background-size: cover;
  background-position: center;
  box-shadow: inset 0 0 0 1px var(--surface-border);
}/* свои / чужие */
.cal-bar-own{
  background: linear-gradient(
    90deg,
    rgba(44, 235, 44, 0.9),
    rgba(88, 200, 88, 0.5)
  );
}/* ---------------- 8) Mode panel (нижняя панель) ---------------- */

.mode-panel-wrap{
  position: fixed;
  bottom: 0px;
  width: 100%;
  bottom: 0px;
  z-index: 400;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  pointer-events: auto;
  user-select: none;
}

@media (orientation: landscape) and (min-aspect-ratio: 13/10) and (max-height: 700px),
       (orientation: landscape) and (max-height: 520px) {
  .mode-panel-wrap{
    top: calc(var(--zakat-header-bottom, 0px) + 8px);
    right: 0;
    left: auto;
    width: 72px;
    height: calc(100dvh - var(--zakat-header-bottom, 0px) - env(safe-area-inset-bottom, 0px));
    padding: 8px 0;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: stretch;
  }

  .mode-panel{
    width: 72px;
    height: 100%;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
    padding: 0 6px 8px;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    gap: 6px;
  }

  .mode-panel .mode-icon,
  .mode-panel .calendar-tool-toggle .calendar-tool-icon,
  .mode-panel .mode-tool-icon,
  .calendar-discover-icon,
  .panelicon{
    width: 30px;
    height: 30px;
  }

  .mode-panel .mode-label,
  .mode-panel .calendar-tool-caption,
  .mode-panel .cal-tool-label{
    display: none;
  }

  .mode-panel .mode-btn,
  .mode-panel .calendar-tool-toggle{
    width: 100%;
    min-width: 0;
    max-width: none;
    margin: 0;
  }

  .mode-panel .mode-panel-block{
    width: 100%;
  }

  .mode-panel-legal{
    display: none !important;
  }

  .task-overlay-head .calendar-utc-panel{
    position: absolute;
    top: calc(100% + 20px);
    right: 0;
    margin: 0;
    left: auto;
    padding-bottom: 0;
  }
}
.mode-panel{
  position: relative;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-evenly;
  gap: 0;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  touch-action: pan-x;
  padding: 2px 6px;
  background: var(--sheader);
  min-height: 56px;
  padding-bottom: 0;
}
.mode-panel-legal{
  display: flex;
  height: 15px;
  align-items: center;
  justify-content: end;
  gap: 12px;
  padding: 0 4px;
  box-sizing: border-box;
  background: var(--sheader);
}
.mode-panel-legal-link{
  font-size: 12px;
  font-weight: 500;
  line-height: 1;
  color: var(--text-primary);
  text-decoration: none;
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
}
body.demo-mode .mode-panel-legal-link{
  visibility: visible;
  opacity: 1;
  pointer-events: auto;
}
body.theme-light .mode-panel-legal-link,
html[data-theme="light"] body .mode-panel-legal-link{
  color: #111111;
}
.mode-panel::-webkit-scrollbar{
  display: none;
}
.mode-panel > *{
  flex: 0 0 auto;
}
body:not(.i18n-ready) .calendar-view-toggle-btn{
  visibility: hidden;
}
.mode-panel-block{
  display: flex;
  align-items: center;
  gap: 6px;
  flex: 0 0 auto;
  position: relative;
  padding: 0;
}
.mode-panel-modes.is-expanded{
  display: contents;
}
.mode-panel-filter.is-expanded{
  display: contents;
}
.mode-panel-filter.is-expanded .calendar-filter-panel.is-expanded{
  display: contents;
  width: auto;
  min-width: 0;
  max-width: none;
  overflow: visible;
}
.mode-panel-filter.is-expanded .calendar-filter-more{
  display: contents;
  max-width: none;
  opacity: 1;
  transform: none;
  padding: 0;
  pointer-events: auto;
}
.mode-panel[data-active-block="modes"] .mode-panel-modes .mode-btn.mode-active .mode-icon,
.mode-panel[data-active-block="modes"] .mode-panel-modes .mode-btn.mode-active .panelicon{
  color: var(--accent);
}
.mode-panel[data-active-block="discover"] #modePanelDiscover .calendar-tool-icon,
.mode-panel[data-active-block="discover"] #modePanelDiscover .panelicon{
  color: var(--accent);
}
.mode-panel .mode-btn[data-action="assistant"] .mode-icon{
  border-radius: 10px;
  background: linear-gradient(135deg, rgba(110, 231, 183, 0.22), rgba(56, 189, 248, 0.24));
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.12);
}
.mode-panel .mode-btn[data-action="assistant"].is-assistant-open .mode-icon,
.mode-panel .mode-btn[data-action="assistant"].is-assistant-open .mode-label{
  color: var(--accent);
}
.mode-panel .mode-btn[data-action="assistant"] .soti-assistant-icon{
  width: 26px;
  height: 26px;
}
.mode-panel .mode-btn[data-action="assistant"].is-assistant-open .soti-assistant-icon{
  transform: scale(1.04);
}
.mode-panel .calendar-tool-toggle.is-filter-active .calendar-tool-icon,
.mode-panel .calendar-tool-toggle.is-filter-active .cal-tool-icon,
.mode-panel .calendar-tool-toggle.is-filter-active .panelicon{
  color: var(--accent);
}
.mode-panel .mode-panel-assistant{
  order: 2;
}
body.soti-newcomer-mode #modePanelDiscover,
body.soti-newcomer-mode #modePanelSettings,
body.soti-newcomer-mode #modePanelLegal{
  display: none !important;
}
body.soti-newcomer-mode #modePanel{
  justify-content: space-evenly;
}
.mode-panel-block.mode-panel-btn{
  height: 58px;
}.mode-panel .mode-panel-modes .mode-btn{
  display: none;
}.mode-panel .mode-panel-modes.is-expanded .mode-btn{
  display: flex;
}.mode-panel .mode-panel-modes.is-ready:not(.is-expanded) .mode-btn.mode-active{
  display: flex;
}.mode-panel .mode-panel-modes:not(.is-ready):not(.is-expanded) .mode-btn[data-action="list"]{
  display: flex;
}.mode-panel-block .calendar-tool-toggle{
  min-width: 0;
  min-height: 0;
}
.mode-panel .calendar-tool-toggle{
  width: 54px;
}
.mode-panel .mode-panel-btn:not(.mode-panel-block){
  width: 54px;
  min-width: 54px;
  min-height: 0;
  max-width: none;
  max-height: none;
}.mode-panel-block.mode-panel-btn{
  width: auto;
  height: 58px;
  min-width: 0;
  min-height: 0;
}.mode-panel-block.is-expanded{
  width: auto;
  background: var(--surface-1);
}.slots-mode-btn.active{
  background: var(--btn-bg-secondary);
  color: var(--text-primary);
}/* highlighter (под активной кнопкой) */
/* кнопки внутри панели */
.mode-panel .mode-btn{
  position: relative;
  z-index: 2;
  border: none;
  padding: 4px 4px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  color: var(--fg);
  font-size: 12px;
  cursor: pointer;
  min-width: 0;
  min-height: 0;

  -webkit-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
  -webkit-tap-highlight-color: transparent;

  transition: none !important;
}
.mode-panel .mode-panel-create.is-disabled .mode-btn{
  opacity: 0.5;
  pointer-events: none;
}
/* убираем фон при фокусе/нажатии */
.mode-panel .mode-btn:active, .mode-panel .mode-btn:focus, .mode-panel .mode-btn:focus-visible{
  background: transparent;
  box-shadow: none;
  outline: none;
  color: var(--fg) !important;
}.mode-panel .mode-btn:focus-visible{
  outline: 2px solid rgba(255,255,255,0.5);
  outline-offset: 4px;
}/* иконка + svg */
.mode-panel .mode-icon{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  flex: 0 0 32px;
}
.mode-panel .mode-icon.mode-day-icon{
  border-radius: 99px;
  outline: 1.5px solid;
  outline-offset: -2px;
}
.mode-panel .mode-day-number{
  font-size: 17px;
  font-weight: var(--weight-bold);
  line-height: 1;
  color: currentColor;
}
.mode-panel .mode-icon img{
  width: 100%;
  height: 100%;
  display: block;
}
.mode-panel .mode-avatar{
  width: 32px;
  height: 32px;
  border-radius: 999px;
  display: flex;
  overflow: visible;
  align-items: center;
  justify-content: center;
  position: relative;
}.mode-panel .mode-avatar.has-photo{
}.mode-panel .mode-avatar img{
  border-radius: 999px;
  width: 100%;
  height: 100%;
}.mode-panel .mode-avatar .mode-avatar-initial{
}.mode-panel .mode-avatar.is-active{
  box-shadow: 0 0 0 2px rgba(255,255,255,0.7);
}/* подпись */
.mode-panel .mode-label{
  font-size: 12px;
  line-height: 1;
  white-space: nowrap;
}.mode-panel .calendar-tool-caption, .mode-panel .cal-tool-label{
  font-size: 12px;
  line-height: 1;
  white-space: nowrap;
}.mode-panel .calendar-tool-toggle{
  gap: 4px;
  padding: 4px;
  justify-content: center;
}.mode-panel .calendar-tool-icon, .mode-panel .cal-tool-icon{
  width: 32px;
  height: 32px;
}.mode-panel .calendar-tool-toggle .panelicon{
  width: 32px;
  height: 32px;
}.mode-panel-filter .calendar-filter-panel{
  width: 0;
  min-width: 0;
  max-width: 0;
  overflow: hidden;
}.mode-panel-filter .calendar-filter-panel.is-expanded{
  width: auto;
  min-width: 58px;
  max-width: min(92vw, 520px);
}
.task-overlay-head .calendar-utc-panel{
  position: absolute;
  top: calc(100% + 20px);
  right: 0;
}
.soti-assistant-overlay{
  position: fixed;
  inset: 0;
  z-index: 1020;
  display: none;
}
.soti-assistant-overlay.is-open{
  display: block;
}
body.soti-assistant-open{
  overflow: hidden;
}
.soti-assistant-backdrop{
  position: absolute;
  inset: 0;
  border: none;
  margin: 0;
  padding: 0;
  width: 100%;
  background: rgba(8, 14, 20, 0.52);
  backdrop-filter: blur(2px);
  -webkit-backdrop-filter: blur(2px);
}
.soti-assistant-sheet{
  position: absolute;
  left: 50%;
  bottom: 0;
  transform: translateX(-50%) translateY(12px);
  width: min(560px, calc(100vw - 18px));
  max-height: min(80vh, 680px);
  border-radius: 18px 18px 0 0;
  border: 1px solid var(--surface-border);
  border-bottom: none;
  background: linear-gradient(180deg, rgba(16, 25, 34, 0.96), rgba(10, 18, 26, 0.96));
  color: var(--text-primary);
  box-shadow: 0 -18px 42px rgba(0,0,0,0.34);
  padding: 14px 14px calc(14px + env(safe-area-inset-bottom, 0px));
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  transition: transform 180ms ease;
}
.soti-assistant-overlay.is-open .soti-assistant-sheet{
  transform: translateX(-50%) translateY(0);
}
.soti-assistant-head{
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}
.soti-assistant-head-copy{
  min-width: 0;
}
.soti-assistant-title{
  font-size: 18px;
  font-weight: 700;
  line-height: 1.2;
}
.soti-assistant-sub{
  margin-top: 4px;
  font-size: 13px;
  line-height: 1.35;
  color: var(--text-secondary);
}
.soti-assistant-close{
  width: 32px;
  height: 32px;
  border-radius: 10px;
  border: 1px solid var(--surface-border);
  background: var(--surface-2);
  color: var(--text-secondary);
  font-size: 20px;
  line-height: 1;
  cursor: pointer;
  flex: 0 0 auto;
}
.soti-assistant-section{
  margin-top: 14px;
}
.soti-assistant-section-title{
  font-size: 12px;
  line-height: 1.2;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--text-secondary);
}
.soti-assistant-actions{
  margin-top: 10px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.soti-assistant-action{
  text-align: left;
  border: 1px solid var(--surface-border);
  border-radius: 12px;
  background: var(--surface-2);
  color: var(--text-primary);
  padding: 11px 11px 10px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-height: 80px;
  cursor: pointer;
}
.soti-assistant-action:active{
  filter: brightness(0.98);
}
.soti-assistant-action-title{
  font-size: 14px;
  line-height: 1.25;
  font-weight: 650;
}
.soti-assistant-action-desc{
  font-size: 12px;
  line-height: 1.35;
  color: var(--text-secondary);
}
.soti-assistant-foot{
  margin-top: 12px;
}
.soti-assistant-secondary{
  width: 100%;
  min-height: 36px;
  border-radius: 10px;
  border: 1px solid var(--surface-border);
  background: var(--surface-3);
  color: var(--text-primary);
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
}
@media (max-width: 560px){
  .soti-assistant-actions{
    grid-template-columns: 1fr;
  }
}
@media (orientation: landscape) and (min-aspect-ratio: 13/10) and (max-height: 700px),
       (orientation: landscape) and (max-height: 520px) {
  .soti-assistant-sheet{
    left: auto;
    right: 10px;
    bottom: 10px;
    transform: translateX(0) translateY(8px);
    width: min(420px, calc(100vw - 96px));
    border-radius: 14px;
    border: 1px solid var(--surface-border);
    max-height: calc(100vh - 20px);
    padding-bottom: 12px;
  }
  .soti-assistant-overlay.is-open .soti-assistant-sheet{
    transform: translateX(0) translateY(0);
  }
}
/* ---------------- Calendar filter bar (top) ---------------- */
.calendar-filter-bar{
  position: fixed;
  right: 14px;
  bottom: 104px; /* mode-panel top(40) + min-height(56) + gap(8) */
  top: auto;
  left: auto;
  transform: none;
  transform-origin: 100% 100%;
  transition: transform 160ms ease;
  z-index: 720;
  width: min(240px, 80vw);
  padding: 0;
  margin: 0;
  background: transparent;
  border: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}.calendar-filter-bar[data-use-scale="1"]{
  transform: scale(var(--cal-filter-scale, 0.8));
}.calendar-filter-bar[data-use-scale="1"][data-expanded="1"]{
  --cal-filter-scale: 1;
}.calendar-filter-bar .cal-frame{
  width: 100%;
  background: transparent;
  border: none;
  border-radius: 0;
  padding: 0;
  display:flex;
  flex-direction: column;
  gap: 12px;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}.calendar-filter-backdrop{
  position: fixed;
  inset: 0;
  z-index: 719;
  background: transparent;
  display:none;
  touch-action: none;
}.calendar-filter-backdrop.active{
  display:block;
}.calendar-filter-bar .cal-block{
  display:flex;
  flex-direction: column;
}.calendar-filter-bar .cal-block.hidden{
  display:none;
}.calendar-filter-bar .cal-row-wrap{
  position: relative;
  height: 28px;
  width: 100%;
  --row-actions-w: 92px;
}.calendar-filter-bar .cal-row-placeholder{
  height: 28px;
  width: 100%;
  border-radius: 999px;
  background: var(--surface-3);
}.calendar-filter-bar .cal-row-actions{
  position:absolute;
  right: 6px;
  top: 0;
  height: 28px;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap: 10px;
  padding-right: 0;
  pointer-events: none;
  opacity: 0;
  transition: opacity 140ms ease;
  z-index: 5;
}.calendar-filter-bar[data-expanded="1"] .cal-row-actions{
  pointer-events: auto;
  opacity: 1;
}.calendar-filter-bar[data-expanded="1"] .cal-row-wrap.with-x .cal-row-actions{
  right: 34px; /* X is rightmost */
}.calendar-filter-bar .cal-row-action{
  width: 24px;
  height: 24px;
  border-radius: 8px;
  border: none;
  background: transparent;
  color: rgba(255,255,255,0.92);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size: 20px;
  line-height: 1;
  cursor:pointer;
  padding: 0;
  position: relative;
}.calendar-filter-bar .cal-row-color{
  cursor: pointer;
}.calendar-filter-bar .cal-row-color-input{
  position: absolute;
  inset: 0;
  opacity: 0;
  width: 100%;
  height: 100%;
  border: none;
  padding: 0;
  margin: 0;
  cursor: pointer;
}.cal-color-sheet.active{ display:block; }#calSettingsOverlay.overlay.is-skeleton .cal-settings-cal-avatars.is-skeleton{
  min-height: 60px;
}.cal-settings-head{
  display: flex;
  flex-direction: column;
  gap: 4px;
}.calendar-filter-bar .cal-row-action svg{
  width: 24px;
  height: 24px;
  display:block;
}.calendar-filter-bar .cal-row-action.disabled{
  opacity: 0.30;
  pointer-events: none;
}.calendar-filter-bar .cal-row{
  position: relative;
  height: 28px;
  width: 100%;
  border-radius: 999px;
  background: var(--row-bg, var(--surface-3));
  box-shadow:
    inset 0 6px 10px rgba(0,0,0,0.28),
    inset 0 -6px 10px rgba(255,255,255,0.06),
    0 10px 24px rgba(0,0,0,0.22);
  overflow: hidden;
  transform: translateX(0);
  transition: transform 160ms ease;
  touch-action: pan-y;
  z-index: 1;
}.calendar-filter-bar .cal-row-wrap.open .cal-row{ transform: translateX(0); }.calendar-filter-bar .cal-row-icon{
  position:absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 24px;
  height: 24px;
  display:flex;
  align-items:center;
  justify-content:center;
  color: var(--text-secondary);
  opacity: 1;
  transition: opacity 140ms ease;
  font-size: 22px;
  line-height: 1;
}.calendar-filter-bar .cal-row-icon svg{
  width: 24px;
  height: 24px;
  display:block;
}.calendar-filter-bar .cal-row-wrap.open .cal-row-icon{
  opacity: 0.10;
}.calendar-filter-bar .cal-row-title{
  position:absolute;
  left: 0;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 16px;
  line-height: 18px;
  font-weight: 600;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: clip;
  color: rgba(255,255,255,0.98);
  padding-left: 24px;
  -webkit-mask-image: linear-gradient(to right, #000 var(--fade-start, 82%), transparent 93%);
  mask-image: linear-gradient(to right, #000 var(--fade-start, 82%), transparent 93%);
}.calendar-filter-bar .cal-row-wrap.with-x .cal-row-title{
  right: 34px;
  --fade-start: 63%;
}.calendar-filter-bar .cal-row-badges{
  position:absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  display:flex;
  gap: 6px;
  align-items:center;
  pointer-events: none;
}.calendar-filter-bar .cal-row-wrap.with-x .cal-row-badges{
  right: 34px;
}.calendar-filter-bar .cal-row-badge{
  min-width: 18px;
  height: 18px;
  border-radius: 999px;
  padding: 0 6px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size: 11px;
  font-weight: 900;
  line-height: 1;
  color: #fff;
  box-shadow: 0 10px 18px rgba(0,0,0,0.26);
  border: 1px solid rgba(0,0,0,0.18);
}.calendar-filter-bar .cal-row-badge--updates{
  background: rgba(0,122,255,0.92);
}.calendar-filter-bar .cal-row-badge--requests{
  background: rgba(255,59,48,0.92);
}.calendar-filter-bar[data-expanded="1"] .cal-row-wrap .cal-row-title{
  --fade-start: 41%;
}.calendar-filter-bar[data-expanded="1"] .cal-row-wrap.with-x .cal-row-title{
  --fade-start: 41%;
}.calendar-filter-bar .cal-row-x{
  position:absolute;
  right: 8px;
  top: 50%;
  transform: translateY(-50%);
  width: 22px;
  height: 22px;
  border-radius: 8px;
  border: none;
  background: transparent;
  color: rgba(255,255,255,0.92);
  display:flex;
  align-items:center;
  justify-content:center;
  font-size: 22px;
  line-height: 1;
  cursor:pointer;
  padding: 0;
}.calendar-filter-bar .cal-row-x.hidden{
  display:none;
}#btnEventHighlightUnlockOpen.is-attn{
  box-shadow: 0 0 0 2px rgba(255,255,255,0.85), 0 10px 26px rgba(255,214,10,0.35);
}.highlight-cover-modal{
  position: relative;
  max-width: 360px;
}.highlight-cover-modal-img{
  width: 100%;
  height: 240px;
  border-radius: 16px;
  background: var(--surface-4);
  background-size: cover;
  background-position: center;
}.highlight-cover-modal-btn{
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 46px;
  height: 46px;
  border-radius: 999px;
  border: 1px solid var(--btn-border);
  background: var(--surface-4);
  color: var(--text-primary);
  font-size: 22px;
  font-weight: 800;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor: pointer;
}.highlight-cover-modal-close{
  position: absolute;
  right: 10px;
  top: 10px;
  width: 28px;
  height: 28px;
  border-radius: 999px;
  border: 1px solid var(--btn-border);
  background: var(--surface-4);
  color: var(--text-primary);
  font-size: 16px;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor: pointer;
}/* ---------------- Calendar settings modal ---------------- */
#calSettingsOverlay.overlay{
  z-index: 1000;
  background: rgba(0, 0, 0, 0.7);
  backdrop-filter: blur(2px);
  overflow: hidden;
  padding-top: 0;
  display: none;
  justify-content: center;
  align-items: stretch;
}
#calSettingsOverlay.overlay.open{
  display: flex;
}
#calSettingsOverlay .cal-settings-shell{
  position: relative;
  align-items: flex-start;
  overscroll-behavior: none;
  transform-origin: top center;
  display: flex;
  width: fit-content;
  max-width: 100%;
  min-height: 0;
  margin: 0 auto;
  gap: 4px;
  top: 4px;
  height: 80lh;
}
#calSettingsOverlay .cal-settings-box.modal-sheet{
  overscroll-behavior: contain;
  position: relative;
  background: var(--surface-8);
  width: clamp(220px, calc(100vw - 50px), 520px);
  max-width: 520px;
  min-height: 0;
  margin: 0;
  padding: 0;
  overflow: hidden;
  top: 0;
  left: auto;
  transform: none;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  transition: none;
  will-change: auto;
}
#calSettingsOverlay .cal-settings-box.modal-sheet .cal-settings-scroll.modal-scroll{
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: scroll;
  overflow-x: hidden;
  overscroll-behavior: contain;
  overflow-anchor: none !important;
  -webkit-overflow-scrolling: touch;
  direction: ltr;
  padding-left: 0;
  padding-bottom: max(24px, 0px);
  transition: filter 140ms ease, opacity 140ms ease;
}
#calSettingsOverlay .cal-settings-box.modal-sheet .cal-settings-scroll.modal-scroll > *{
  direction: ltr;
}
.cal-settings-toast{
  position: fixed;
  left: 50%;
  bottom: calc(22px + 0px);
  transform: translateX(-50%) translateY(8px);
  background: rgba(18,18,18,0.92);
  color: #fff;
  padding: 10px 14px;
  border-radius: 12px;
  font-size: 13px;
  line-height: 1.35;
  max-width: min(520px, 90vw);
  text-align: center;
  box-shadow: 0 12px 28px rgba(0,0,0,0.45);
  opacity: 0;
  transition: opacity 180ms ease, transform 180ms ease;
  z-index: 10050;
}.cal-settings-toast.is-show{
  opacity: 1;
  transform: translateX(-50%) translateY(0);
}body.cal-settings-open{
  overflow: hidden;
}body.participants-modal-open{
  overflow: hidden;
}/* Hide calendar chooser overlay while any modal is open */
body.cal-settings-open .calendar-filter-bar, body.cal-settings-open .calendar-filter-backdrop, body.event-modal-open .calendar-filter-bar, body.event-modal-open .calendar-filter-backdrop, body.participants-modal-open .calendar-filter-bar, body.participants-modal-open .calendar-filter-backdrop{
  display: none !important;
}/* todayFocusDot удалён: фокус на сегодня реализован повторными кликами на аватар/режим. */
.cal-participants-overlay{
  position: fixed;
  inset: 0;
  z-index: 10020;
  background: rgba(0,0,0,0.55);
  display: none;
}
.cal-participants-box{
  position: absolute;
  left: 50%;
  top: 10lvh;
  transform: translateX(-50%);
  width: min(520px, 92%);
  background: var(--surface-2);
  color: var(--text-primary);
  border-radius: 18px;
  padding: 12px;
  box-shadow: var(--shadow-elevated);
  border: 1px solid var(--surface-border);
  max-height: 80lvh;
  height: 80lvh;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.cal-participants-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
.cal-participants-title{
  font-weight: var(--weight-bold);
  font-size: var(--text-lg);
}
.cal-participants-sub{
  font-size: 12px;
  opacity: 0.75;
  margin: 6px 0 4px;
}
.cal-participants-scroll{
  flex: 1 1 auto;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  padding-right: 2px;
  padding-bottom: max(12px, 0px);
}
.cal-participants-list{
  display:flex;
  flex-direction:column;
  gap:4px;
}
.cal-participants-item{
  padding: 6px 2px;
  font-size: 13px;
  border-bottom: 1px solid var(--surface-border);
}
.cal-settings-box{
  position: absolute;
  left: 50%;
  top: 12px;
  transform: translateX(-50%);
  width: 90%;
  max-width: 520px;
  background: var(--surface-8);
  color: var(--text-primary);
  border-radius: 6px;
  padding: 6px;
  box-sizing: border-box;
  height: 92vh;
  transition: height 180ms ease;
  will-change: height;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}.cal-settings-scroll{
  flex: 1 1 auto;
  overflow-y: scroll;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
  padding-bottom: max(24px, 0px);
  transition: filter 140ms ease, opacity 140ms ease;
}.cal-settings-scroll.is-stale{
  filter: blur(1px) saturate(0.85);
  opacity: 0.65;
}.cal-settings-actions{
  flex: 0 0 auto;
}.cal-create-group-sheet{
  background: var(--surface-8);
  position: absolute;
  top: 20lvh;
  border-radius: 18px;
  padding: 10px;
  width: min(420px, 92vw);
  gap: 10px;
  display: flex;
  flex-direction: column;
}
.cal-create-group-hero-wrap{
  border-radius: 14px;
  background: rgba(255,255,255,0.06);
  overflow: hidden;
  aspect-ratio: 16 / 9;
}
.cal-create-group-hero-wrap.is-loading .cal-create-group-hero{
  opacity: 0;
}
.cal-create-group-hero-wrap.is-loaded::after{
  opacity: 0;
  animation: none;
}
.cal-create-group-hero{
  width: 100%;
  height: auto;
  display: block;
  border-radius: 14px;
  object-fit: cover;
  transition: opacity 0.2s ease;
}
.cal-create-group-overlay{
  z-index: 10020;
}
.cal-create-group-title{
  font-weight: 650;
  font-size: 16px;
}
.cal-create-group-subtitle{
  margin-top: 6px;
  font-size: 13px;
  opacity: 0.65;
  line-height: 1.3;
}
.cal-create-group-step{
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.cal-create-group-choice-grid{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}
.cal-create-group-choice-btn{
  border: 1px solid var(--surface-border);
  border-radius: 12px;
  background: var(--surface-4);
  color: var(--text-primary);
  padding: 12px 10px;
  text-align: left;
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-height: 120px;
}
.cal-create-group-choice-btn:active{
  filter: brightness(0.98);
}
.cal-create-group-choice-title{
  font-weight: 700;
  font-size: 14px;
  line-height: 1.2;
}
.cal-create-group-choice-title-row{
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.cal-create-group-choice-tg-icon{
  width: 18px;
  height: 18px;
  flex: 0 0 18px;
}
.cal-create-group-choice-subtitle{
  font-size: 12px;
  line-height: 1.35;
  opacity: 0.72;
}
.cal-create-group-detail-head{
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
.cal-create-group-back-btn{
  border-radius: 10px;
  padding: 6px 10px;
  min-height: 30px;
}
.cal-create-group-manual-wrap{
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.cal-create-group-manual-avatar-row{
  display: flex;
  justify-content: center;
}
.cal-create-group-manual-avatar-btn{
  width: 72px;
  height: 72px;
  border-radius: 999px;
  border: 1px solid var(--surface-border);
  background: var(--surface-4);
  color: var(--text-primary);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  cursor: pointer;
}
.cal-create-group-manual-avatar-btn:active{
  filter: brightness(0.98);
}
.cal-create-group-manual-avatar-img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.cal-create-group-manual-avatar-plus{
  font-size: 26px;
  line-height: 1;
  font-weight: 500;
  opacity: 0.82;
}
.cal-create-group-manual-title-input{
  width: 100%;
  min-height: 38px;
  border-radius: 10px;
  border: 1px solid var(--surface-border);
  background: var(--input-bg);
  color: var(--text-primary);
  padding: 8px 10px;
  font-size: 14px;
  box-sizing: border-box;
}
.cal-create-group-actions{
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.cal-create-group-primary-btn{
  width: 100%;
  border-radius: 12px;
  padding: 12px 14px;
  font-size: 14px;
  font-weight: 700;
  background: var(--accent);
  color: white;
  cursor: pointer;
}
@media (max-width: 520px){
  .cal-create-group-choice-grid{
    grid-template-columns: 1fr;
  }
}#calDescriptionInput{
  resize: none;
  overflow: hidden;
}.support-thread-list{
  display:flex;
  flex-direction:column;
  gap:8px;
}.support-thread-item{
  width:100%;
  border:none;
  border-radius:12px;
  padding:10px 12px;
  text-align:left;
  background: var(--surface-3);
  color: var(--text-primary);
  position: relative;
  cursor:pointer;
}.support-thread-name{
  font-weight: var(--weight-medium);
  font-size: var(--text-md);
}.support-thread-last{
  font-size: var(--text-sm);
  opacity:0.7;
  margin-top:4px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}.support-chat-head{
  display:flex;
  align-items:center;
  gap:8px;
  margin-bottom:8px;
}.support-chat-title{
  font-weight: var(--weight-medium);
  font-size: var(--text-md);
}.support-chat-messages{
  display:flex;
  flex-direction:column;
  gap:6px;
  overflow:auto;
  padding: 0px 12px;
}.support-msg{
  max-width: 85%;
  padding:8px 10px;
  border-radius:12px;
  background: var(--surface-3);
  font-size: var(--text-sm);
  line-height:1.25;
}.support-msg.is-mine{
  align-self:flex-end;
  background: var(--surface-4);
}.support-chat-input{
  display:flex;
  gap:6px;
  margin-top: 4px;
}

.support-chat-input input{
  flex:1;
  min-width:0;
  border-radius: 6px;
  background: var(--input-bg);
  border: none;
  color: var(--text-primary);
  padding:8px 10px;
  font-size: var(--text-md);
}.support-chat-footer{
  border-top: 1px solid rgba(255,255,255,0.08);
  position: sticky;
  z-index: 2;
}.cal-settings-header{

}.cal-settings-headactions{
  display:flex;
  gap: 8px;
  margin-top: 4px;
  justify-content: flex-end;
  align-items: center;
  flex: 0 0 auto;
  flex-wrap: nowrap;
  margin-left: auto;
  width: 100%;
}.cal-settings-theme-toggle{
  display: inline-flex;
  align-items: center;
  gap: 2px;
  font-size: 12px;
  font-weight: 650;
  color: var(--fg);
}.cal-settings-theme-label{
  opacity: 0.8;
}
.cal-settings-head-help-btn{
  display: flex;
  justify-content: center;
  align-items: center;
  width: 34px;
  height: 34px;
  background: var(--surface-1);
  cursor: pointer;
  padding: 0;
  padding-top: 4px;
}
.cal-settings-head-close-btn{
  display: flex;
  justify-content: center;
  align-items: center;
  width: 34px;
  height: 34px;
  border: none;
  color: var(--text-secondary);
  cursor: pointer;
  padding: 0;
  flex: 0 0 auto;
}
.cal-settings-head-account-btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 34px;
  padding: 0 12px;
  border: none;
  border-radius: 999px;
  background: var(--surface-1);
  color: var(--text-secondary);
  font-size: var(--text-sm);
  font-weight: var(--weight-bold);
  cursor: pointer;
}
.cal-settings-head-help-btn .cal-settings-head-help-icon{
  width: 26px;
  height: 26px;
  display: block;
  pointer-events: none;
}
.cal-settings-head-close-btn .cal-settings-head-close-icon{
  width: 18px;
  height: 18px;
  display: block;
  pointer-events: none;
  opacity: 0.9;
}
.cal-settings-head-account-btn.active,
.cal-settings-head-help-btn.active{
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
}
.cal-settings-head-help-btn.active .cal-settings-head-help-icon{
  filter: brightness(0) saturate(100%) invert(100%);
}
.cal-settings-head-close-btn:hover{
  background: var(--surface-2);
}
.cal-settings-head-close-btn:focus-visible{
  outline: 2px solid var(--accent);
  outline-offset: 1px;
}
.demo-theme-toggle{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  font-weight: 650;
  color: var(--text-primary);
}
.theme-seg{
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px;
  border-radius: 999px;
  background: var(--surface-1);
}
.theme-seg-btn{
  border: none;
  border-radius: 999px;
  padding: 6px;
  font-size: 12px;
  font-weight: 700;
  background: transparent;
  color: var(--text-secondary);
  cursor: pointer;
  line-height: 1;
}
.theme-seg-btn.active{
  background: var(--surface-4);
  color: var(--text-primary);
  box-shadow: inset 0 0 0 1px var(--btn-border);
}
.theme-seg-btn:disabled{
  opacity: 0.4;
  cursor: default;
}
.cal-settings-cal-avatars{
  display:flex;
  gap: 10px;
  height: auto;
  padding: 8px 8px;
  align-items: center;
  -webkit-overflow-scrolling: touch;
  position: relative;
  scrollbar-width: none;
  -ms-overflow-style: none;
}.cal-settings-cal-avatars-list{
  display:flex;
  gap: 10px;
  align-items: flex-end;
  flex: 0 0 auto;
  align-items: center;
}.cal-settings-cal-avatar-wrap{
  position: relative;
  flex: 0 0 auto;
}.cal-settings-cal-avatar-settings{
  color: var(--text-primary);
}.cal-settings-cal-avatar-settings img{
  object-fit: contain;
}.cal-settings-cal-row{
  display:flex;
  align-items:flex-end;
  gap: 10px;
}.cal-settings-cal-row .cal-settings-cal-avatars{
  flex: 1 1 auto;
  min-width: 0;
}.cal-settings-cal-help-btn.tasklist-connect-help{
  display: inline-flex;
  flex: 0 0 auto;
  margin: 0;
  color: var(--text-primary);
  border-color: var(--surface-6);
  opacity: 0.78;
  align-self: center;
}.cal-settings-cal-help-btn.tasklist-connect-help:hover{
  opacity: 1;
}.cal-settings-cal-help-btn.tasklist-connect-help:active{
  transform: scale(0.97);
}.cal-settings-cal-avatar-create{
  background: var(--surface-3);
  color: var(--text-primary);
  display:flex;
  align-items:center;
  justify-content:center;
}.cal-settings-cal-avatar-create.is-disabled, .cal-settings-cal-avatar-create:disabled{
  opacity: 0.35;
  cursor: default;
  pointer-events: none;
}.cal-settings-cal-avatar-plus{
  font-size: 22px;
  font-weight: 800;
  line-height: 1;
}.cal-settings-cal-avatars::-webkit-scrollbar{
  width: 0;
  height: 0;
  display: none;
}.cal-settings-cal-avatar{
  width: 48px;
  height: 48px;
  border-radius: 999px;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  border: none;
  padding: 0;
  flex: 0 0 auto;
  cursor: pointer;
  position: relative;
  --cal-avatar-selected-outline: var(--surface-6);
  --cal-avatar-selected-shadow: 0 0 0 2px rgba(255,255,255,0.80), 0 10px 22px rgba(0,0,0,0.28);
}.cal-settings-cal-avatar-img{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 999px;
  pointer-events: none;
}.cal-settings-cal-avatar .initial{
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight: 850;
  color: var(--text-primary);
}.cal-settings-cal-avatar.has-photo .initial{
  opacity: 0;
}.cal-settings-cal-avatar.is-disabled{
  opacity: 0.62;
}.cal-settings-cal-avatar-placeholder{
  width: 48px;
  height: 48px;
  border-radius: 999px;
  flex: 0 0 auto;
  background: var(--surface-1);
  box-shadow: inset 0 0 0 1px var(--surface-border);
}.cal-settings-sub{
  font-size: var(--text-sm);
  color: var(--text-muted-2);
  margin-bottom: 12px;
  line-height: 1.35;
}.cal-settings-card{
  margin-bottom: 8px;
  background: var(--surface-4);
  padding: 8px;
  display: flex;
  flex-direction: column;
  grid-column-start: 1;
  grid-column-end: -1;
  transition: background-color 180ms ease;
}#calSettingsOverlay .cal-settings-card[data-section="privacy"][data-privacy-spotlight="1"]{
  background: var(--accent);
}.account-identity-card[data-provider="apple"]{
  opacity: 0.2;
  pointer-events: none;
}.cal-settings-row{
  display:flex;
  gap: 10px;
  justify-content: center;
  align-items: center;
  font-size: var(--text-md);
}.cal-settings-id-row{
  align-items: center;
  font-size: var(--text-sm);
  color: var(--text-muted-2);
}.cal-settings-id-value{
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  font-size: var(--text-sm);
  color: var(--text-secondary);
}.cal-settings-row.is-disabled{
  opacity: 0.45;
}.world-toggle-btn{
  flex: 0 0 auto;
  height: 26px;
  width: 26px;
  font-size: var(--text-sm);
  line-height: 1;
  white-space: nowrap;
  color: var(--text-secondary);
}.world-toggle-btn.is-active{
  background: var(--surface-3);
  color: var(--text-primary);
}.cal-tz-map-btns{
  display: flex;
  flex-direction: column;
  gap: 6px;
  flex: 0 0 auto;
}.cal-tz-map-btns.is-muted,
.cal-tz-map-btns.is-disabled{
  opacity: 0.45;
  pointer-events: none;
}.cal-tz-map-btns > .event-location-pin-btn{
  min-width: 64px;
}.event-location-layout{
  display: grid;
  margin-top: 6px;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 4px;
  align-items: stretch;
}
.event-location-main-pin{
  min-width: 50px;
  align-self: stretch;
  height: 100%;
}
.event-location-main-col{
  width: auto;
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.event-location-top-row{
  display: flex;
  gap: 4px;
  align-items: stretch;
}
.event-location-geo-inline{
  opacity: 0.5;
  flex: 1 1 auto;
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-areas:
    "region clear"
    "city city";
  gap: 6px;
  align-items: stretch;
}
.event-location-geo-inline > .event-text-field{
  flex: 1 1 0;
  min-width: 0;
}
.event-location-geo-inline > #inEventRegion{
  grid-area: region;
}
.event-location-geo-inline > #inEventCity{
  grid-area: city;
}
.event-location-geo-inline > #btnEventLocationClear{
  grid-area: clear;
  justify-self: end;
  align-self: center;
}
#calTzCard .event-location-geo-inline{
  grid-template-columns: minmax(0, 1fr);
  grid-template-areas:
    "region"
    "city";
}
#calTzCard .event-location-geo-inline > #calTzRegionInput{
  grid-area: region;
}
#calTzCard .event-location-geo-inline > #calTzCityInput{
  grid-area: city;
}
.event-location-geo-inline > #inEventCity{
  width: 100%;
  max-width: 100%;
}
.event-location-geo-inline > #inEventRegion{
  width: 100%;
  max-width: 100%;
}
.event-location-geo-inline > #btnEventLocationClear{
  margin: 0;
  flex: 0 0 auto;
  min-width: 0;
}
.event-location-open-btn{
  width: 56px;
}
.event-client-link-wrap{
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.event-client-link-wrap.is-feature-muted{
  opacity: 0.58;
}
.event-client-link-btn{
  min-height: 32px;
}
.event-client-soon-badge{
  --ev-badge-bg: rgb(255, 59, 48);
  --ev-badge-fg: rgb(255, 255, 255);
}
.event-client-link-editor{
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.event-client-rows{
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.event-client-row{
  display: flex;
  flex-direction: column;
  gap: 6px;
  align-items: stretch;
}
.event-client-row.is-muted{
  opacity: 0.62;
}
.event-client-row-main{
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr) auto auto auto;
  gap: 6px;
  align-items: center;
}
.event-client-kind-select{
  min-width: 32px;
  height: 32px;
  padding: 0 6px;
  border-radius: 8px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  font-weight: 700;
}
.event-client-kind-select.is-hidden{
  display: none !important;
}
.event-client-row-name-wrap{
  margin-left: 34px;
}
.event-client-row.is-muted.is-empty:not(.has-main-contact) .event-client-row-name-wrap{
  display: none;
}
.event-client-name-input{
  min-width: 0;
}
.event-client-row-prefix{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.event-client-row-prefix.is-disabled{
  opacity: 0.45;
  cursor: default;
  pointer-events: none;
}
.event-client-row-prefix-icon{
  width: 22px;
  height: 22px;
  display: block;
}
.event-client-row-prefix-remove{
  display: none;
  font-size: 16px;
  line-height: 1;
  font-weight: 700;
}
.event-client-row.is-linked-base .event-client-row-prefix-icon{
  display: none;
}
.event-client-row.is-linked-base .event-client-row-prefix-remove{
  display: block;
}
.event-client-contact-input{
  min-width: 0;
}
.event-client-row-spinner{
  min-width: 92px;
  min-height: 32px;
  display: none;
  align-items: center;
  justify-content: center;
  grid-column: 3 / 6;
  justify-self: end;
}
.event-client-row.is-lookup-loading .event-client-row-spinner{
  display: inline-flex;
}
.event-client-row.is-lookup-loading .event-client-main-kind-select,
.event-client-row.is-lookup-loading .event-client-row-open,
.event-client-row.is-lookup-loading .event-client-user-invite-btn{
  display: none !important;
}
.event-client-row-links{
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-left: 34px;
}
.event-client-link-row{
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto auto;
  gap: 6px;
  align-items: center;
}
.event-client-link-input{
  min-width: 0;
}
.event-client-link-kind{
  width: 18px;
  min-width: 18px;
  height: 18px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  opacity: 0.9;
}
.event-client-link-kind-select{
  min-width: 32px;
  height: 30px;
  padding-inline: 6px;
}
.event-client-link-row.is-muted .event-client-link-kind{
  opacity: 0.45;
}
.event-client-link-remove{
  min-width: 32px;
  padding-inline: 0;
}
.event-client-link-remove[data-mode="open"]{
  min-width: 72px;
  padding-inline: 8px;
}
.event-client-link-remove.is-muted{
  opacity: 0.45;
}
.event-client-link-base{
  text-align: left;
  white-space: nowrap;
  font-size: 14px;
}
.event-client-link-header{
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
.event-client-row-open{
  min-width: 92px;
  padding-inline: 8px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.event-client-user-invite-btn{
  min-width: 32px;
  width: 32px;
  padding-inline: 0;
  color: color-mix(in srgb, var(--danger) 78%, var(--text-primary));
  border-color: color-mix(in srgb, var(--danger) 38%, var(--border));
  background: color-mix(in srgb, var(--danger) 12%, transparent);
  font-weight: 800;
}
.event-client-user-invite-btn.is-hidden{
  display: none !important;
}
.event-client-user-invite-btn[aria-disabled="true"]{
  opacity: 0.45;
}
.event-client-link-open.is-muted{
  opacity: 0.45;
  pointer-events: none;
}
.event-client-row-open.is-muted{
  opacity: 0.45;
  pointer-events: none;
}
.event-client-open-kind{
  width: 16px;
  height: 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 16px;
}
.event-client-open-kind-icon{
  width: 14px;
  height: 14px;
  display: block;
}
.event-client-open-kind-badge{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 16px;
  height: 16px;
  border-radius: 999px;
  border: 1px solid var(--border);
  font-size: 9px;
  font-weight: 700;
  line-height: 1;
}
.event-client-open-label{
  white-space: nowrap;
}
.event-client-contact-input.is-copyable,
.event-client-link-input.is-copyable,
.event-client-row.is-linked-base .event-client-contact-input,
.event-client-link-row.is-linked-base .event-client-link-input{
  cursor: copy;
}
.event-client-link-row.is-linked-base{
  opacity: 0.64;
}
.event-client-link-row.is-linked-base .event-client-link-remove{
  display: inline-flex;
}
.event-client-row.is-linked-base .event-client-kind-select,
.event-client-link-row.is-linked-base .event-client-kind-select{
  display: none !important;
}
.event-client-link-help,
.event-slot-help-btn,
#btnEventClientHelp,
#btnEventSlotHelp{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  min-width: 18px;
  height: 18px;
  min-height: 18px;
  padding: 0;
  color: var(--surface-6);
  border-radius: 999px;
  border: 1px solid;
  font-size: 12px;
  line-height: 1;
  pointer-events: auto;
}
.event-client-base-sheet{
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.event-client-base-head{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}
.event-client-base-title{
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-size: 14px;
  font-weight: 700;
}
.event-client-base-title-icon{
  width: 16px;
  height: 16px;
  display: block;
}
.event-client-base-close{
  min-height: 30px;
}
.event-client-base-search-wrap{
  display: flex;
}
.event-client-base-search{
  width: 100%;
  border-radius: 10px;
  border: none;
  outline: none;
  background: var(--surface-4);
  color: var(--text-primary);
  margin: 8px 30px 0;
  padding: 8px 10px;
}
.event-client-base-scopes{
  display: flex;
  background: var(--surface-1);
  border-radius: 99px;
  padding: 3px;
}
.event-client-base-scope-btn{
  min-height: 30px;
  padding: 4px 10px;
  border-radius: 999px;
  flex: 1;
}
.event-client-base-scope-btn.is-active{
}
.event-client-base-list{
  display: flex;
  flex-direction: column;
  gap: 8px;
  overflow-y: auto;
  min-height: 80px;
}
.event-client-base-row{
  width: 100%;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--surface-2);
  color: inherit;
  text-align: left;
  min-height: 44px;
  padding: 8px 10px;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  cursor: pointer;
  box-sizing: border-box;
}
.event-client-base-card{
  background: var(--surface-3);
  box-shadow: 0 3px 10px rgba(0,0,0,0.35);
  padding: 6px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.event-client-base-main{
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.event-client-base-contact{
  font-size: 13px;
  font-weight: 650;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.event-client-base-title-sub{
  font-size: 11px;
  opacity: 0.72;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.event-client-base-kind{
  flex: 0 0 auto;
  font-size: 11px;
  opacity: 0.78;
  border: 1px solid var(--border);
  border-radius: 999px;
  padding: 2px 8px;
}
.event-client-base-links{
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  align-items: flex-start;
  gap: 6px;
  padding: 0;
}
.event-client-base-link-chip{
  min-height: 26px;
  border: 1px solid var(--border);
  border-radius: 999px;
  padding: 3px 8px;
  background: var(--surface-1);
  color: inherit;
  font-size: 11px;
  cursor: pointer;
}
.event-client-base-events{
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 0 4px 2px;
}
.event-client-base-event{
  width: 100%;
  text-align: left;
  color: inherit;
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 8px;
  border: 1px solid color-mix(in srgb, var(--border) 60%, transparent);
  border-radius: 9px;
  background: color-mix(in srgb, var(--surface-3) 82%, transparent);
  padding: 6px 8px;
  font-size: 11px;
  position: relative;
  min-height: 44px;
}
.event-client-base-event-main{
  min-width: 0;
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.event-client-base-event.has-owner .event-client-base-event-main{
  padding-right: 92px;
}
.event-client-base-event-meta{
  opacity: 0.78;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.event-client-base-event-title{
  font-size: 12px;
  font-weight: 600;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.event-client-base-event-owner{
  position: absolute;
  right: 8px;
  bottom: 5px;
  font-size: 11px;
  opacity: 0.8;
  max-width: 44%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  text-align: right;
}
.event-client-base-event-open{
  cursor: pointer;
}
.event-client-base-event-deleted{
  text-align: left;
  color: inherit;
  cursor: pointer;
}
.event-client-base-event-deleted-passive{
  cursor: default;
  border-color: color-mix(in srgb, var(--border) 78%, transparent);
  background: color-mix(in srgb, var(--surface-2) 74%, transparent);
}
.event-client-base-empty{
  font-size: 12px;
  opacity: 0.78;
  padding: 8px 4px;
}
.event-location-pin-btn{
  flex: 0 0 auto;
  width: 60px;
  flex-direction: column;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  background: var(--surface-2);
  padding: 3px;
  border-radius: 7px;
  transition: background-color 220ms ease;
}
.event-location-pin-btn svg,
.event-location-pin-btn img{
  width: 26px;
  height: 26px;
}
.event-location-pin-btn.is-muted{
  opacity: 0.45;
  pointer-events: none;
}
#btnEventAddressPin[data-geo-flash="1"]{
  background: var(--accent-alfa);
}
.event-location-pin-label{
  font-size: var(--text-sm);
  line-height: 1;
}
.cal-settings-row + .cal-settings-row{ margin-top: 8px; }.cal-settings-actions.cal-settings-actions-with-row{
  flex-direction: column;
  align-items: stretch;
  gap: 8px;
}.cal-settings-actions-row{
  display: flex;
  align-items: center;
  padding: 4px;
  justify-content: flex-end;
  gap: 8px;
}.cal-settings-tabrow{
  display:flex;
  gap:0;
  flex-wrap:wrap;
  justify-content: space-around;
  align-items: center;
}.cal-settings-tabrow .cal-settings-tab-btn{
  position: relative;
  overflow: visible;
  border-radius: 999px;
  padding: 5px 9px;
  border: none;
  font-size: 13px;
  background: transparent;
  color: var(--text-secondary);
  cursor: pointer;
}.cal-settings-tabrow .cal-settings-tab-btn + .cal-settings-tab-btn{
  margin-left: 0;
}.cal-settings-tabrow .cal-settings-tab-btn.active{
  color: var(--text-primary);
  font-weight: var(--weight-bold);
}.cal-settings-tabrow .cal-settings-tab-btn:disabled{
  opacity: 0.55;
}.cal-inline-badge{
  background: rgba(255,80,80,0.95);
  color:#fff;
  border-radius:999px;
  padding:2px 7px;
  font-size:11px;
  font-weight:600;
  line-height:1;
  box-shadow: 0 10px 22px rgba(0,0,0,0.25);
}.cal-settings-btn,
.modal-action-btn{
  border-radius: 6px;
  padding: 6px 10px;
  font-size: var(--text-md);
  cursor:pointer;
  box-shadow: none;
}.cal-settings-btn.compact{
  padding: 6px 10px;
  font-size: var(--text-sm);
}.cal-settings-btn.lg{

}.cal-settings-btn.rounded-md{
  border-radius: 14px;
}.cal-settings-btn.full{
}.cal-settings-btn.cal-palette-btn{
  background: var(--palette-color, var(--btn-bg-secondary));
  color: var(--palette-text, var(--text-primary));
  border-color: transparent;
}.cal-settings-link-btn{
  background: none;
  border: none;
  padding: 0;
  margin: 0;
  color: inherit;
  text-align: left;
  font-weight: 650;
  cursor: pointer;
}.cal-settings-btn.secondary,
.modal-action-btn.secondary{
}.cal-settings-btn.cal-privacy-chip{

}.cal-settings-btn.cal-privacy-chip.is-active{
  color: white;
  background: var(--accent);
}.cal-settings-btn.is-disabled,
.cal-settings-btn:disabled,
.modal-action-btn.is-disabled,
.modal-action-btn:disabled{
  opacity: 0.45;
  cursor: default;
  pointer-events: none;
}.cal-settings-btn.secondary.cal-tab-btn.active{
  color: var(--text-primary);
  font-weight: var(--weight-bold);
}#calGTabTools{
  opacity: 0.3;
  pointer-events: none;
}.cal-settings-btn.primary, .modal-action-btn.primary{
  background: var(--accent);
  color: white;
}.cal-visual-unlock-btns{
  display:flex;
  width:100%;
}.cal-visual-unlock-btn{
  flex:1;
  min-width:0;
  padding: 9px 14px;
  border-radius: 999px;
}.cal-visual-unlock-badge{
  position:absolute;
  top:-8px;
  right:12px;
  background: rgba(255,80,80,0.95);
  color:#fff;
  border-radius: 999px;
  padding: 2px 8px;
  font-size: 12px;
  font-weight: 800;
  line-height: 1;
  box-shadow: 0 10px 22px rgba(0,0,0,0.25);
}.cal-theme-preview-wrap{
  position: relative;
  width: 100%;
  height: 110px;
}.cal-theme-preview-btn{
  position: relative;
  width: 100%;
  height: 110px;
  border-radius: 14px;
  background: var(--surface-3);
  display:flex;
  align-items:center;
  justify-content:center;
  cursor: pointer;
  overflow: hidden;
}.cal-theme-preview-btn.has-image{
  background: transparent;
}.cal-theme-preview-btn.is-locked{
  opacity: 0.7;
  cursor: default;
}.cal-theme-preview-plus{
  width: 34px;
  height: 34px;
  border-radius: 999px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size: 22px;
  font-weight: 800;
  color: #000000;
  background: rgba(255, 255, 255, 0.7);  
  box-shadow: var(--btn-shadow);
}.cal-theme-preview-wrap img{
  position: absolute;
  inset: 0;
  z-index: 0;
}.cal-theme-preview-wrap .cal-theme-preview-btn{
  position: absolute;
  inset: 0;
  z-index: 1;
}.cal-theme-clear-x{
  z-index: 2;
}.cal-theme-mode-row{
  display:flex;
  gap:8px;
  width:100%;
}.cal-theme-mode-btn{
  flex:1;
  min-width:0;
  border-radius: var(--btn-radius);
  padding: 8px 10px;
  background: var(--surface-3);
  color: var(--btn-text-muted);
  font-size: var(--text-md);
  font-weight: var(--weight-bold);
  cursor: pointer;
}.cal-theme-mode-btn.active{
  background: rgb(255, 255, 255);
  color: #000000;
  box-shadow: 4px 4px 9px rgba(0, 0, 0, 0.40);
}.cal-theme-mode-btn.is-disabled{
  opacity: 0.3;
  pointer-events: none;
  cursor: default;
}.cal-theme-clear-x{
  position:absolute;
  top:8px;
  right:8px;
  width:28px;
  height:28px;
  border-radius:999px;
  border:1px solid var(--btn-border);
  background: var(--surface-4);
  color: var(--text-primary);
  display:flex;
  align-items:center;
  justify-content:center;
  font-size: 18px;
  font-weight: 800;
  cursor: pointer;
}.cal-theme-clear-x:disabled{
  opacity: 0.55;
  cursor: default;
}.cal-settings-small{
  font-size: 12px;
  margin-top: 6px;
  padding-left: 12px;
}.cal-theme-presets{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  width: 100%;
  align-items: center;
  justify-content: center;
}.cal-theme-swatch-group{
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 6px;
}.cal-theme-swatch-group-title{
  font-size: 11px;
  line-height: 1.35;
  opacity: 0.72;
  padding-left: 2px;
}.cal-theme-swatch-group-grid{
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}.cal-theme-swatch-group-subscription .cal-theme-swatch-group-title{
  opacity: 0.62;
}.cal-theme-presets.has-controls{
  justify-content: space-evenly;
  flex-wrap: nowrap;
}.cal-theme-presets-core{
  display: flex;
  gap: 8px;
  justify-content: center;
  flex: 0 0 auto;
}.cal-theme-presets-ctrl{
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
}.cal-theme-swatch{
  width:34px;
  height:34px;
  border-radius:10px;
  cursor:pointer;
  background:#000;
  display:flex;
  align-items:center;
  justify-content:center;
  color: rgba(255,255,255,0.8);
  font-size:18px;
  font-weight:700;
  position: relative;
  overflow: hidden;
}.cal-theme-swatch.cal-theme-swatch-ctrl{
  width: 26px;
  height: 26px;
  border-radius: 999px;
  outline: 2px solid var(--surface-6);
}.cal-theme-swatch.selected{
  width:36px;
  height:36px;
  outline: none;
  animation: swatch-bounce 240ms ease;
}.cal-theme-swatch.selected:focus{
  outline: none;
}.cal-theme-swatch.selected:focus-visible{
  outline: none;
}@keyframes swatch-bounce{
  0%{ transform: scale(1); }
  45%{ transform: scale(0.92); }
  70%{ transform: scale(1.04); }
  100%{ transform: scale(1); }
}.cal-theme-swatch.is-disabled{
  opacity: 0.15;
  cursor: not-allowed;
  box-shadow: none;
}.cal-theme-swatch.is-locked{
  opacity: 0.3;
  pointer-events: none;
  cursor: default;
}.cal-theme-swatch-highlight{
  color: rgba(255, 214, 10, 0.95);
  text-shadow: 0 2px 6px rgba(0,0,0,0.35);
  font-size: 16px;
}.cal-theme-swatch.light{
  background:#fff;
  border:1px solid rgba(255,255,255,0.6);
  color: rgba(0,0,0,0.65);
}.cal-theme-swatch.active{
  box-shadow: 0 0 0 2px rgba(54,205,124,0.65);
}.cal-theme-swatch.empty{
  background: var(--surface-3);
  border:1px dashed var(--surface-border);
}.cal-theme-swatch-add{
  background: var(--btn-bg-secondary);
  color: var(--text-primary);
  font-size: 18px;
  font-weight: 700;
}.cal-color-swatch.active{
  box-shadow: 0 0 0 2px rgba(54,205,124,0.65);
}.cal-settings-list{
  margin-top: 8px;
  display:none;
}.cal-settings-list .pitem{
  padding: 4px 0;
  font-size: 13px;
}.cal-switch input[type="checkbox"]{
  width:18px;
  height:18px;
}.cal-admin-list{
  margin-top:8px;
  max-height:220px;
  overflow:auto;
  border-radius:10px;
  border:1px solid rgba(255,255,255,0.08);
}.cal-admin-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:8px 10px;
  cursor:pointer;
  gap:8px;
  border-bottom:1px solid rgba(255,255,255,0.08);
}.cal-admin-actions{
  display:flex;
  align-items:center;
  gap:6px;
  flex:0 0 auto;
}.cal-admin-color-chip{
  width:24px;
  height:24px;
  border-radius:8px;
  padding:0;
  cursor:pointer;
  background:#34C759;
  display:inline-block;
}.cal-admin-color-chip:disabled{
  opacity:0.15;
  cursor:default;
}.cal-admin-color-popover .cal-theme-swatch{
  width:28px;
  height:28px;
  border-radius:8px;
}
.cal-admin-color-popover-backdrop{
  position: absolute;
  inset: 0;
  background: transparent;
  z-index: 10020;
}
.cal-admin-color-popover{
  position: absolute;
  z-index: 10021;
  background: var(--surface-2);
  border: 1px solid var(--surface-border);
  border-radius: 12px;
  padding: 10px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.cal-admin-row:last-child{
  border-bottom:none;
}.cal-admin-row:hover{
  background:rgba(255,255,255,0.05);
}.cal-admin-row.selected{
  font-size: 14px;
}.cal-admin-row .cal-admin-meta{
  font-size:12px;
}.cal-admin-empty{
  padding:10px;
  font-size:13px;
}.cal-toggle{
  --toggle-w: 46px;
  --toggle-h: 24px;
  --toggle-pad: 3px;
  --toggle-knob: 18px;
  position:relative;
  width:var(--toggle-w);
  min-width:var(--toggle-w);
  height:var(--toggle-h);
  display:inline-flex;
  align-items:center;
  justify-content:flex-start;
  cursor:pointer;
  flex:0 0 var(--toggle-w);
}.cal-toggle input{
  position:absolute;
  opacity:0;
  inset:0;
  cursor:pointer;
}.cal-toggle-track{
  width:100%;
  height:100%;
  border-radius:999px;
  background: rgba(108, 108, 108, 0.25);
  position:relative;
  overflow: hidden;
  transition:background 200ms ease;
}.cal-toggle-track::after{
  content:'';
  position:absolute;
  top:var(--toggle-pad);
  left:var(--toggle-pad);
  width:var(--toggle-knob);
  height:var(--toggle-knob);
  border-radius:50%;
  background:#fff;
  transition:transform 200ms ease, background 200ms ease;
}.cal-toggle input:checked + .cal-toggle-track{
  background: var(--accent);
}.cal-toggle input:checked + .cal-toggle-track::after{
  transform:translateX(calc(var(--toggle-w) - (var(--toggle-pad) * 2) - var(--toggle-knob)));
  background:#fff;
}
/* ---------------- 10) Top-right settings button ---------------- */
/* Удалено: верхние кнопки заменены на "Настройки" в нижней панели. */

/* ---------------- Event: participants notifications (v1) ---------------- */
.epm-v1{
  display:flex;
  flex-direction:column;
  gap:10px;
}.epm-notif-block{
  padding:10px 12px;
  border-radius:14px;
}.epm-notif-block.is-disabled{
  opacity: 0.45;
  pointer-events: none;
}.epm-notif-row{
  display:flex;
  gap:10px;
  margin-bottom:6px;
}.epm-notif-title{
  font-weight:600;
  font-size:17px;
  margin-bottom:6px;
}.epm-notif-desc{
  font-size:13px;
  opacity:0.75;
}.epm-members-block{
  padding:4px;
  border-radius:14px;
  background:var(--surface-3);
  border:1px solid var(--surface-border);
}.epm-grid-head{
  display:grid;
  grid-template-columns:1.4fr 1fr 1fr;
  gap:8px;
  align-items:center;
}.epm-head-col{
  font-size: var(--text-sm);
  color: var(--text-secondary);
  text-align:center;
}.epm-grid-body{
  margin-top:8px;
  display:flex;
  flex-direction:column;
  gap:6px;
}.epm-grid-row{
  display:grid;
  grid-template-columns:1.4fr 1fr 1fr;
  gap:8px;
  align-items:center;
}.epm-cell--name{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  padding:0 2px;
}.epm-search{
  width:100%;
  box-sizing:border-box;
  padding:6px 8px;
  border-radius: var(--btn-radius);
  border:1px solid var(--input-border);
  background: var(--input-bg);
  color:var(--text-primary);
  outline:none;
}.epm-head-controls{
  display:flex;
  align-items:center;
  gap:8px;
}.epm-head-controls .epm-search{
  flex:1;
}.epm-add-btn{
  height:32px;
  padding:0 12px;
  font-size: var(--text-sm);
}.epm-cfg-btn{
  flex:0 0 auto;
  min-width:0;
  height:32px;
  border-radius: var(--btn-radius);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0 12px;
  font-size: var(--text-md);
  font-weight: var(--weight-bold);
  background: var(--btn-bg-secondary);
  color: var(--text-primary);
  border: 1px solid var(--btn-border);
  text-shadow: none;
}.epm-cfg-btn--wide{
  flex:1;
}.epm-pill{
  width:100%;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:8px 10px;
  border-radius: var(--btn-radius);
  border:1px solid var(--btn-border);
  background: var(--btn-bg-secondary);
  color:var(--text-primary);
  font-size: var(--text-sm);
  line-height:1;
  min-height:34px;
}.epm-empty{
  font-size: var(--text-sm);
  color: var(--text-secondary);
  padding:8px 2px;
}.epm-loading{
  opacity:0.7;
  font-size:12px;
}.participant-item{
  padding:2px 0;
}.participants-empty{
  opacity:0.7;
  font-size:12px;
  line-height:1.3;
}.epm-add-overlay{
  position:fixed;
  inset:0;
  z-index:12120;
  display:none;
  align-items:center;
  justify-content:center;
  padding:16px;
  background: rgba(0,0,0,0.55);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}.epm-add-box{
  width:min(540px, 92vw);
  max-height:80vh;
  border-radius:16px;
  background: var(--surface-2);
  color: var(--text-primary);
  border:1px solid var(--surface-border);
  box-shadow: var(--shadow-elevated);
  padding:12px;
  display:flex;
  flex-direction:column;
  gap:10px;
}.epm-add-head{
  display:flex;
  align-items:center;
  gap:8px;
}.epm-add-search{
  flex:1;
  box-sizing:border-box;
  padding:8px 10px;
  border-radius: var(--btn-radius);
  border:1px solid var(--input-border);
  background: var(--input-bg);
  color:var(--text-primary);
  outline:none;
}.epm-add-close{
  border:none;
  background:transparent;
  color: inherit;
  font-size:22px;
  line-height:1;
  cursor:pointer;
}.epm-add-list{
  display:flex;
  flex-direction:column;
  gap:6px;
  max-height:50vh;
  overflow:auto;
  padding-right:2px;
}.epm-add-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:8px 10px;
  border-radius:12px;
  border:1px solid var(--surface-border);
  background: var(--surface-3);
}.epm-add-row.is-disabled{
  opacity:0.55;
}.epm-add-name{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}.epm-add-footer{
  display:flex;
  gap:8px;
  justify-content:flex-end;
}.epm-add-empty{
  font-size: var(--text-sm);
  color: var(--text-secondary);
  padding:6px 2px;
}/* --- Public feed buy modal tweaks --- */
.pf-buy-toggle-group .secondary.is-active, .pf-buy-toggle-group .secondary.primary{
  background: #ffffff;
  color: #111111;
  border: 1px solid rgba(0,0,0,0.12);
}.pf-buy-pack-btn.is-active, .pf-buy-pack-btn.primary{
  background: #ffffff;
  color: #111111;
  border: 1px solid rgba(0,0,0,0.12);
}