/* Kimi-style calendar (pure HTML/JS) */

.kimi-cal{ width:100%; }

.kimi-cal__shell{
  display:grid;
  grid-template-columns: 320px 1fr;
  gap: 14px;
  padding: 14px;
}

@media (max-width: 1100px){
  .kimi-cal__shell{ grid-template-columns: 1fr; }
  .kimi-cal__left{ order:2; }
  .kimi-cal__right{ order:1; }
}

.kimi-cal__panel{
  border-radius: 22px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.03);
  backdrop-filter: blur(12px);
  box-shadow: 0 18px 60px rgba(0,0,0,.35);
  overflow:hidden;
}

/* Big primary button (matches reference) */
.kimi-cal__add{
  width: calc(100% - 28px);
  margin: 14px;
  padding: 14px 14px;
  border-radius: 16px;
  border: 1px solid rgba(1,149,226,.55);
  background: linear-gradient(180deg, rgba(1,149,226,.95), rgba(0,97,173,.82));
  color: rgba(255,255,255,.96);
  font-weight: 900;
  letter-spacing: -.01em;
  display:flex;
  align-items:center;
  justify-content:center;
  gap: 10px;
  cursor:pointer;
  box-shadow: 0 18px 40px rgba(0,0,0,.40), inset 0 1px 0 rgba(255,255,255,.16);
  transition: transform .16s ease, filter .16s ease, box-shadow .16s ease;
}
.kimi-cal__add:hover{ filter: brightness(1.05); transform: translateY(-1px); }
.kimi-cal__add:active{ transform: translateY(0px); }
.kimi-cal__add:focus-visible{ outline:none; box-shadow: 0 0 0 4px rgba(1,149,226,.18), 0 18px 40px rgba(0,0,0,.40), inset 0 1px 0 rgba(255,255,255,.16); }
.kimi-cal__addIcon{
  width: 18px; height: 18px;
  display:grid; place-items:center;
  border-radius: 8px;
  background: rgba(255,255,255,.14);
  border: 1px solid rgba(255,255,255,.18);
  font-size: 16px;
  line-height: 1;
}
.kimi-cal__addText{ font-size: 14px; }

.kimi-cal__ownerRow{ padding: 12px 14px 6px; }
.kimi-cal__label{ display:block; font-size:11px; letter-spacing:.12em; color: rgba(255,255,255,.36); text-transform: uppercase; margin-bottom: 8px; }
.kimi-cal__select{
  width:100%;
  padding: 10px 12px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.03);
  color: rgba(255,255,255,.88);
  outline:none;
}
.kimi-cal__hint{ font-size:12px; color: rgba(255,255,255,.55); }

.kimi-cal__templates{ padding: 12px 14px 14px; }
.kimi-cal__sectionLabel{ font-size:12px; font-weight: 800; color: rgba(255,255,255,.48); padding: 12px 0 12px; }

.kimi-tpl{
  display:flex;
  align-items:center;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 16px;
  border: 1px solid color-mix(in srgb, var(--c, rgba(109,94,252,1)) 40%, rgba(255,255,255,.10));
  background: linear-gradient(180deg,
    color-mix(in srgb, var(--c, rgba(109,94,252,1)) 18%, rgba(255,255,255,.03)),
    rgba(255,255,255,.02));
  cursor: grab;
  user-select:none;
  margin-bottom: 10px;
  transition: transform .12s ease, border-color .12s ease, background .12s ease;
}
.kimi-tpl:hover{ transform: translateY(-1px); border-color: color-mix(in srgb, var(--c, rgba(109,94,252,1)) 55%, rgba(255,255,255,.12)); }
.kimi-tpl:active{ cursor:grabbing; }
.kimi-tpl.is-dragging{ opacity:.55; }
.kimi-tpl__dot{ width:10px; height:10px; border-radius:999px; box-shadow: 0 0 0 6px rgba(255,255,255,.06); }
.kimi-tpl__text{ font-weight: 750; font-size: 13px; color: rgba(255,255,255,.88); }

.kimi-cal__right{
  border-radius: 22px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.02);
  backdrop-filter: blur(12px);
  box-shadow: 0 18px 60px rgba(0,0,0,.30);
  overflow:hidden;
}

.kimi-cal__top{
  padding: 14px;
  display:grid;
  grid-template-columns: 1fr auto 1fr;
  gap: 12px;
  align-items:center;
  border-bottom: 1px solid rgba(255,255,255,.08);
  background: radial-gradient(700px 300px at 40% 0%, rgba(109,94,252,.12), transparent 60%);
}

.kimi-cal__topLeft{ display:flex; gap: 10px; align-items:center; }
.kimi-cal__topCenter{ display:flex; justify-content:center; }
.kimi-cal__topRight{ display:flex; justify-content:flex-end; }

.kimi-cal__month{ font-weight: 950; letter-spacing:-.02em; font-size: 18px; color: rgba(255,255,255,.92); }

.kimi-cal__viewTabs{
  display:flex;
  gap: 6px;
  padding: 4px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.03);
}
.kimi-cal__tab{
  padding: 8px 10px;
  border-radius: 999px;
  border: 0;
  background: transparent;
  color: rgba(255,255,255,.70);
  font-weight: 850;
  cursor:pointer;
  transition: background .14s ease, color .14s ease, transform .14s ease;
}
.kimi-cal__tab:hover{ background: rgba(255,255,255,.05); color: rgba(255,255,255,.88); transform: translateY(-1px); }
.kimi-cal__tab:active{ transform: translateY(0px); }
.kimi-cal__tab:focus-visible{ outline:none; box-shadow: 0 0 0 4px rgba(1,149,226,.16); }
.kimi-cal__tab.is-active{
  background: rgba(1,149,226,.26);
  color: rgba(255,255,255,.92);
  box-shadow: 0 10px 30px rgba(0,0,0,.25);
}

.kimi-cal__navBtn{
  padding: 9px 12px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.03);
  color: rgba(255,255,255,.86);
  font-weight: 850;
  cursor:pointer;
  box-shadow: 0 10px 28px rgba(0,0,0,.20), inset 0 1px 0 rgba(255,255,255,.10);
  transition: transform .14s ease, background .14s ease, border-color .14s ease, box-shadow .14s ease;
}
.kimi-cal__navBtn:hover{ background: rgba(255,255,255,.05); border-color: rgba(109,94,252,.22); transform: translateY(-1px); box-shadow: 0 14px 40px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.12); }
.kimi-cal__navBtn:active{ transform: translateY(0px); }
.kimi-cal__navBtn:focus-visible{ outline:none; box-shadow: 0 0 0 4px rgba(1,149,226,.16), 0 14px 40px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.12); }

.kimi-cal__grid{ padding: 14px; }

/* Month grid */
.kimi-grid--month .kimi-grid__dow{
  display:grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 10px;
  margin-bottom: 10px;
}
.kimi-grid__dowCell{ font-size: 11px; letter-spacing:.12em; text-transform:uppercase; color: rgba(255,255,255,.35); padding: 0 6px; }

.kimi-grid--month .kimi-grid__cells{
  display:grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 10px;
}

.kimi-day{
  min-height: 110px;
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.02);
  padding: 10px;
  transition: border-color .12s ease, background .12s ease;
  cursor:pointer;
}
.kimi-day:hover{ border-color: rgba(255,255,255,.16); }
.kimi-day.is-out{ background: rgba(255,255,255,.01); opacity:.75; }
.kimi-day.is-today{ box-shadow: 0 0 0 1px rgba(56,189,248,.35) inset; border-color: rgba(56,189,248,.20); }
.kimi-day.is-over{ background: rgba(56,189,248,.06); border-color: rgba(56,189,248,.35); }

.kimi-day__cap{
  width: 28px;
  height: 28px;
  border-radius: 999px;
  display:grid;
  place-items:center;
  font-weight: 900;
  font-size: 12px;
  color: rgba(255,255,255,.55);
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.08);
}
.kimi-day.is-today .kimi-day__cap{ background: rgba(56,189,248,.16); border-color: rgba(56,189,248,.30); color: rgba(255,255,255,.92); }

.kimi-day__list{ margin-top: 10px; display:flex; flex-direction:column; gap: 6px; }

.kimi-ev{
  font-size: 11px;
  font-weight: 800;
  padding: 7px 8px;
  border-radius: 12px;
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.08);
  border-left: 2px solid;
  cursor:pointer;
}
.kimi-ev:hover{ background: rgba(255,255,255,.05); }
.kimi-ev.is-dragging{ opacity:.55; }

.kimi-day__more{ font-size: 11px; color: rgba(255,255,255,.40); padding-left: 6px; }

/* Week */
.kimi-grid--week .kimi-week__head{
  display:grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 10px;
  margin-bottom: 10px;
}
.kimi-week__headCell{
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.02);
  padding: 10px;
}
.kimi-week__headCell.is-today{ border-color: rgba(56,189,248,.25); box-shadow: 0 0 0 1px rgba(56,189,248,.30) inset; }
.kwh__dow{ font-size: 11px; letter-spacing:.12em; text-transform:uppercase; color: rgba(255,255,255,.35); }
.kwh__day{ margin-top: 6px; font-weight: 900; color: rgba(255,255,255,.78); font-size: 12px; }

.kimi-grid--week .kimi-week__body{
  display:grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 10px;
}
.kimi-week__col{
  min-height: 360px;
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.02);
  padding: 10px;
  cursor:pointer;
  transition: border-color .12s ease, background .12s ease;
}
.kimi-week__col:hover{ border-color: rgba(255,255,255,.16); }
.kimi-week__col.is-over{ background: rgba(56,189,248,.06); border-color: rgba(56,189,248,.35); }

.kimi-weekev{
  font-size: 12px;
  font-weight: 850;
  padding: 8px 10px;
  border-radius: 14px;
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.08);
  border-left: 2px solid;
  margin-bottom: 8px;
}

/* Day */
.kimi-dayview{
  min-height: 540px;
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.02);
  padding: 14px;
  cursor:pointer;
  transition: border-color .12s ease, background .12s ease;
}
.kimi-dayview:hover{ border-color: rgba(255,255,255,.16); }
.kimi-dayview.is-over{ background: rgba(56,189,248,.06); border-color: rgba(56,189,248,.35); }

.kimi-dayview__head{ display:flex; justify-content:space-between; align-items:center; margin-bottom: 10px; }
.kdv__title{ font-weight: 950; }
.kdv__hint{ font-size: 12px; color: rgba(255,255,255,.55); }

.kimi-dayview__list{ margin-top: 14px; display:flex; flex-direction:column; gap: 10px; }
.kimi-dayrow{
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.03);
  padding: 12px;
  border-left: 3px solid;
  cursor:pointer;
}
.kdr__title{ font-weight: 900; }
.kdr__meta{ margin-top: 6px; font-size: 12px; color: rgba(255,255,255,.55); }
.kimi-empty{ color: rgba(255,255,255,.45); font-size: 13px; padding: 14px; border-radius: 18px; border: 1px dashed rgba(255,255,255,.12); }

/* Modal */
.kimi-modal{ position: fixed; inset: 0; z-index: 200; display:none; }
.kimi-modal.is-open{ display:block; }
.kimi-modal__backdrop{ position:absolute; inset:0; background: rgba(0,0,0,.55); backdrop-filter: blur(4px); }
.kimi-modal__card{
  position: relative;
  width: min(640px, calc(100vw - 24px));
  margin: 8vh auto 0;
  border-radius: 22px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(10,12,16,.92);
  backdrop-filter: blur(16px);
  box-shadow: 0 30px 90px rgba(0,0,0,.65);
  overflow:hidden;
}
.kimi-modal__head{ padding: 14px; display:flex; align-items:flex-start; justify-content:space-between; border-bottom: 1px solid rgba(255,255,255,.08); }
.kimi-modal__title{ font-weight: 950; }
.kimi-modal__sub{ margin-top:4px; font-size:12px; color: rgba(255,255,255,.55); }
.kimi-modal__x{ width: 40px; height: 40px; border-radius: 14px; border: 1px solid rgba(255,255,255,.10); background: rgba(255,255,255,.04); color: rgba(255,255,255,.88); cursor:pointer; font-size: 18px; line-height: 1; }
.kimi-modal__x:hover{ background: rgba(255,255,255,.06); }

.kimi-modal__body{ padding: 14px; display:flex; flex-direction:column; gap: 12px; }
.kimi-field__label{ display:block; font-size: 11px; letter-spacing:.12em; color: rgba(255,255,255,.36); text-transform:uppercase; margin-bottom: 8px; }
.kimi-field__input{
  width:100%;
  padding: 10px 12px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.03);
  color: rgba(255,255,255,.88);
  outline:none;
}
.kimi-field__input:focus{ border-color: rgba(109,94,252,.28); box-shadow: 0 0 0 4px rgba(109,94,252,.10); }
.kimi-field__ta{ resize: vertical; min-height: 90px; }

.kimi-2col{ display:grid; grid-template-columns: 1fr 1fr; gap: 12px; }
@media (max-width: 720px){ .kimi-2col{ grid-template-columns: 1fr; } }

.kimi-check{ display:flex; gap: 10px; align-items:center; padding: 10px 12px; border-radius: 14px; border: 1px solid rgba(255,255,255,.10); background: rgba(255,255,255,.03); color: rgba(255,255,255,.78); }

.kimi-modal__foot{ padding: 12px 14px 14px; display:flex; gap: 10px; align-items:center; border-top: 1px solid rgba(255,255,255,.08); }
.kimi-modal__spacer{ flex:1; }
.kimi-btn{ padding: 10px 12px; border-radius: 14px; border: 1px solid rgba(109,94,252,.28); background: rgba(109,94,252,.12); color: rgba(255,255,255,.92); font-weight: 900; cursor:pointer; }
.kimi-btn:hover{ background: rgba(109,94,252,.16); }
.kimi-btn--ghost{ border-color: rgba(255,255,255,.10); background: rgba(255,255,255,.03); }
.kimi-btn--ghost:hover{ background: rgba(255,255,255,.05); }


/* Agenda side panel (comfortable always-on tracking) */
.kimi-cal__main{
  display:flex;
  gap: 14px;
  align-items: stretch;
}
.kimi-cal__grid{
  flex: 1;
  min-width: 0;
}
.kimi-agenda{
  width: 320px;
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(2,6,23,.22);
  box-shadow: 0 18px 55px rgba(0,0,0,.25);
  overflow:hidden;
}
.kimi-agenda__head{
  padding: 14px 14px 10px;
  border-bottom: 1px solid rgba(255,255,255,.08);
  background: radial-gradient(500px 180px at 30% 0%, rgba(14,165,233,.16), transparent 58%), rgba(2,6,23,.10);
}
.kimi-agenda__title{
  font-size: 13px;
  font-weight: 850;
  letter-spacing: -.01em;
}
.kimi-agenda__sub{
  font-size: 12px;
  color: rgba(148,163,184,.78);
  margin-top: 2px;
}
.kimi-agenda__list{
  padding: 10px;
  display:flex;
  flex-direction:column;
  gap: 8px;
  max-height: calc(100vh - 250px);
  overflow:auto;
}
.kimi-agitem{
  display:flex;
  gap: 10px;
  align-items:flex-start;
  padding: 10px 10px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.04);
}
.kimi-agdot{
  width: 10px; height: 10px;
  border-radius: 999px;
  margin-top: 4px;
  background: rgba(14,165,233,.9);
  box-shadow: 0 0 0 4px rgba(14,165,233,.10);
}
.kimi-agmeta{
  min-width:0;
  flex:1;
}
.kimi-agtitle{
  font-size: 12px;
  font-weight: 780;
  color: rgba(226,232,240,.96);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.kimi-agtime{
  font-size: 11px;
  color: rgba(148,163,184,.78);
  margin-top: 2px;
}
.kimi-agempty{
  padding: 14px 12px;
  border-radius: 14px;
  border: 1px dashed rgba(148,163,184,.22);
  color: rgba(148,163,184,.78);
  font-size: 12px;
}
@media (max-width: 1200px){
  .kimi-agenda{ display:none; }
}