/* Storyverse v36.75 — calendar redesign + fullscreen scene reading */

/* ---------- Calendar / desktop ---------- */
.v3675-calendar-app{
  height:100%;
  min-height:0;
  display:grid;
  grid-template-rows:auto auto minmax(0,1fr);
  overflow:hidden;
  background:#fff;
  color:#151515;
}
.v3675-calendar-head{
  min-height:62px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:13px 18px 9px;
  border-bottom:1px solid #ececf0;
}
.v3675-calendar-title span{
  display:block;
  font-size:8px;
  text-transform:uppercase;
  letter-spacing:.1em;
  color:#8b8b94;
  font-weight:800;
}
.v3675-calendar-title h1{
  margin:2px 0 0;
  font-size:22px;
  line-height:1;
  letter-spacing:-.04em;
}
.v3675-calendar-head-actions{display:flex;align-items:center;gap:7px}
.v3675-calendar-head-actions button,
.v3675-month-nav button,
.v3675-mode button,
.v3675-category-tabs button{
  border:1px solid #e4e4e8;
  background:#fff;
  color:#24242a;
  cursor:pointer;
}
.v3675-today,.v3675-add{
  height:34px;
  border-radius:10px!important;
  padding:0 12px;
  font-size:9px;
  font-weight:750;
}
.v3675-add{
  background:var(--u-accent,#7d67de)!important;
  border-color:transparent!important;
  color:#fff!important;
}
.v3675-calendar-controls{
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  gap:12px;
  align-items:center;
  min-height:52px;
  padding:8px 18px;
  border-bottom:1px solid #ececf0;
}
.v3675-month-nav{display:flex;align-items:center;gap:5px}
.v3675-month-nav button{
  width:30px;height:30px;border-radius:50%;padding:0;font-size:15px
}
.v3675-month-nav strong{
  min-width:132px;
  padding:0 5px;
  font-size:12px;
  text-transform:capitalize;
  white-space:nowrap;
}
.v3675-category-tabs{
  min-width:0;
  display:flex;
  justify-content:center;
  gap:3px;
  overflow-x:auto;
  scrollbar-width:none;
}
.v3675-category-tabs::-webkit-scrollbar{display:none}
.v3675-category-tabs button{
  flex:0 0 auto;
  height:30px;
  border-color:transparent;
  border-radius:8px;
  padding:0 9px;
  font-size:8px;
  color:#777781;
}
.v3675-category-tabs button:hover{background:#f3f3f6}
.v3675-category-tabs button.active{
  background:#222228;
  color:#fff;
}
.v3675-view-controls{display:flex;align-items:center;gap:6px}
.v3675-view-controls select{
  height:32px;
  max-width:150px;
  border:1px solid #e4e4e8;
  border-radius:9px;
  background:#fff;
  padding:0 8px;
  color:#303037;
  font-size:8px;
}
.v3675-mode{
  display:flex;
  padding:2px;
  border:1px solid #e7e7ea;
  border-radius:9px;
}
.v3675-mode button{
  height:26px;
  padding:0 8px;
  border:0;
  border-radius:7px;
  font-size:8px;
}
.v3675-mode button.active{background:#f0f0f4;font-weight:800}

.v3675-calendar-layout{
  min-height:0;
  display:grid;
  grid-template-columns:minmax(0,1fr) 286px;
}
.v3675-calendar-main{
  min-width:0;
  min-height:0;
  overflow:auto;
  border-right:1px solid #ececf0;
}
.v3675-weekdays{
  position:sticky;
  top:0;
  z-index:5;
  display:grid;
  grid-template-columns:repeat(7,minmax(0,1fr));
  height:34px;
  background:rgba(255,255,255,.94);
  backdrop-filter:blur(12px);
  border-bottom:1px solid #ececf0;
}
.v3675-weekdays span{
  display:grid;
  place-items:center;
  border-right:1px solid #f0f0f2;
  font-size:7px;
  color:#85858e;
  text-transform:uppercase;
  font-weight:800;
}
.v3675-month-grid{
  display:grid;
  grid-template-columns:repeat(7,minmax(0,1fr));
  grid-template-rows:repeat(6,minmax(88px,1fr));
  min-height:calc(100% - 34px);
}
.v3675-calendar-day{
  position:relative;
  min-width:0;
  min-height:88px;
  padding:5px 4px 6px;
  border-right:1px solid #ececf0;
  border-bottom:1px solid #ececf0;
  background:#fff;
  overflow:hidden;
}
.v3675-calendar-day:nth-child(7n){border-right:0}
.v3675-calendar-day.outside{
  background:repeating-linear-gradient(135deg,#fbfbfc,#fbfbfc 6px,#f7f7f9 6px,#f7f7f9 7px);
  color:#b7b7be;
}
.v3675-calendar-day.today:after{
  content:"";
  position:absolute;
  left:0;right:0;top:0;
  height:2px;
  background:var(--u-accent,#7d67de);
}
.v3675-day-number{
  width:26px;height:23px;
  display:grid;place-items:center;
  margin-left:auto;
  border:0;
  border-radius:8px;
  background:transparent;
  color:inherit;
  font-size:8px;
  cursor:pointer;
}
.v3675-calendar-day.today .v3675-day-number{
  background:var(--u-accent,#7d67de);
  color:#fff;
  font-weight:800;
}
.v3675-day-events{display:grid;gap:2px;margin-top:2px}
.v3675-calendar-event{
  position:relative;
  width:100%;
  min-width:0;
  height:18px;
  display:grid;
  grid-template-columns:2px minmax(0,1fr);
  gap:4px;
  align-items:center;
  border:0;
  border-radius:3px;
  background:#f5f5f7;
  color:#34343a;
  padding:0 5px 0 3px;
  text-align:left;
  cursor:pointer;
}
.v3675-calendar-event i{
  width:2px;height:11px;border-radius:2px;background:#8094ff
}
.v3675-calendar-event span{
  min-width:0;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
  font-size:6.5px;
  line-height:1;
}
.v3675-more{
  justify-self:start;
  border:0;
  background:transparent;
  color:#777;
  padding:1px 3px;
  font-size:6px;
  cursor:pointer;
}

.v3675-calendar-event.cat-birthday i,.v3675-side-event.cat-birthday>i{background:#f08d58}
.v3675-calendar-event.cat-anniversary i,.v3675-side-event.cat-anniversary>i{background:#e4688f}
.v3675-calendar-event.cat-trip i,.v3675-side-event.cat-trip>i{background:#55a8df}
.v3675-calendar-event.cat-work i,.v3675-side-event.cat-work>i{background:#54a56e}
.v3675-calendar-event.cat-school i,.v3675-side-event.cat-school>i{background:#9a75d5}
.v3675-calendar-event.cat-appointment i,.v3675-side-event.cat-appointment>i{background:#df6c68}
.v3675-calendar-event.cat-important i,.v3675-side-event.cat-important>i{background:#d3a13c}
.v3675-calendar-event.cat-health i,.v3675-side-event.cat-health>i{background:#64a5a4}
.v3675-calendar-event.surprise{background:#f3edff}

.v3675-calendar-side{
  min-width:0;
  min-height:0;
  overflow-y:auto;
  background:#fafafd;
  padding:13px 10px 18px;
}
.v3675-calendar-side section+section{
  margin-top:17px;
  padding-top:14px;
  border-top:1px solid #e9e9ed;
}
.v3675-calendar-side section>header{
  padding:0 4px 7px;
}
.v3675-calendar-side section>header span,
.v3675-calendar-side section>header strong{display:block}
.v3675-calendar-side section>header span{
  font-size:6.5px;
  text-transform:uppercase;
  letter-spacing:.1em;
  color:#9999a2;
  font-weight:850;
}
.v3675-calendar-side section>header strong{
  margin-top:2px;
  font-size:11px;
}
.v3675-side-event{
  position:relative;
  width:100%;
  min-width:0;
  min-height:42px;
  display:grid;
  grid-template-columns:3px 28px minmax(0,1fr);
  gap:7px;
  align-items:center;
  margin-bottom:5px;
  padding:6px 7px 6px 5px;
  border:1px solid #ececf0;
  border-radius:9px;
  background:#fff;
  color:#25252b;
  text-align:left;
  cursor:pointer;
}
.v3675-side-event>i{width:3px;height:100%;min-height:27px;border-radius:3px;background:#8094ff}
.v3675-event-avatar,.v3675-event-icon{
  width:28px;height:28px;border-radius:50%;object-fit:cover
}
.v3675-event-icon{display:grid;place-items:center;background:#f1f1f4;font-size:10px}
.v3675-side-event>span{min-width:0}
.v3675-side-event strong,.v3675-side-event small{
  display:block;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
}
.v3675-side-event strong{font-size:8px}
.v3675-side-event small{font-size:6.5px;color:#8a8a92;margin-top:2px}
.v3675-side-empty{margin:0;padding:8px 5px;color:#999;font-size:7px}
.v3675-agenda-only{min-height:0;overflow:auto;padding:18px;width:min(720px,100%);margin:0 auto}
.v3675-agenda-only>header{display:flex;justify-content:space-between;align-items:end;margin-bottom:10px}
.v3675-agenda-only>header span{font-size:8px;color:#888;text-transform:uppercase;font-weight:800}
.v3675-agenda-only>header strong{font-size:10px}
.v3675-mobile-add{display:none}

/* Let a maximized Mac calendar actually use the available space. */
.v33-mac-window.maximized .v33-mac-windowcontent:has(.v3675-calendar-app){
  padding:0!important;
  overflow:hidden!important;
}
.v33-mac-window.maximized .v3675-calendar-app{
  width:100%!important;
  max-width:none!important;
  height:100%!important;
  margin:0!important;
}

/* ---------- Calendar / mobile ---------- */
@media(max-width:760px){
  .v3675-calendar-app{
    grid-template-rows:auto auto minmax(0,1fr);
    padding:0!important;
    background:#fff;
  }
  .v3675-calendar-head{
    min-height:58px;
    padding:9px 12px 6px;
    border-bottom:0;
  }
  .v3675-calendar-title span{display:none}
  .v3675-calendar-title h1{font-size:19px}
  .v3675-calendar-head-actions .v3675-add{display:none}
  .v3675-today{
    height:30px;
    font-size:9px;
    padding:0 10px;
  }
  .v3675-calendar-controls{
    display:grid;
    grid-template-columns:1fr;
    min-height:0;
    gap:7px;
    padding:3px 10px 9px;
  }
  .v3675-month-nav{
    justify-content:center;
    position:relative;
  }
  .v3675-month-nav strong{
    min-width:170px;
    text-align:center;
    font-size:18px;
    letter-spacing:-.03em;
  }
  .v3675-month-nav button{
    width:32px;height:32px;font-size:18px
  }
  .v3675-category-tabs{
    justify-content:flex-start;
    padding-bottom:1px;
  }
  .v3675-category-tabs button{
    height:28px;
    font-size:9px;
    padding:0 9px;
    border:1px solid #ededf0;
  }
  .v3675-view-controls{
    display:none;
  }
  .v3675-calendar-layout{
    display:block;
    min-height:0;
    overflow:auto;
  }
  .v3675-calendar-main{
    overflow:visible;
    border-right:0;
  }
  .v3675-weekdays{
    height:34px;
    position:sticky;
    top:0;
  }
  .v3675-weekdays span{
    font-size:9px;
    text-transform:none;
  }
  .v3675-month-grid{
    grid-template-rows:repeat(6,100px);
    min-height:600px;
  }
  .v3675-calendar-day{
    min-height:100px;
    padding:4px 2px 5px;
  }
  .v3675-day-number{
    width:25px;height:23px;
    margin:0 auto 2px;
    font-size:10px;
  }
  .v3675-day-events{
    gap:2px;
    margin-top:0;
  }
  .v3675-calendar-event{
    height:20px;
    grid-template-columns:2px minmax(0,1fr);
    gap:2px;
    padding:0 2px;
    border-radius:2px;
  }
  .v3675-calendar-event span{
    font-size:7px;
  }
  .v3675-calendar-side{
    display:none;
  }
  .v3675-more{font-size:7px}
  .v3675-mobile-add{
    position:fixed;
    right:18px;
    bottom:calc(22px + env(safe-area-inset-bottom));
    z-index:80;
    width:48px;height:48px;
    display:grid;
    place-items:center;
    border:0;
    border-radius:50%;
    background:var(--u-accent,#7d67de);
    color:#fff;
    box-shadow:0 10px 26px rgba(40,34,64,.25);
    font-size:28px;
    font-weight:300;
  }
  .v3675-agenda-only{
    padding:10px 12px 80px;
  }
}

/* ---------- Fullscreen Scenes: readable at desktop scale ---------- */
.v33-mac-window.maximized .v3651-scene-detail-immersive .app-page-head,
.julia-mac-window.is-maximized .v3651-scene-detail-immersive .app-page-head{
  max-width:1120px!important;
  padding-top:72px!important;
}
.v33-mac-window.maximized .v3651-scene-detail-immersive .app-page-heading h1,
.julia-mac-window.is-maximized .v3651-scene-detail-immersive .app-page-heading h1{
  font-size:46px!important;
}
.v33-mac-window.maximized .v3651-scene-detail-immersive .app-page-heading .eyebrow,
.julia-mac-window.is-maximized .v3651-scene-detail-immersive .app-page-heading .eyebrow{
  font-size:9px!important;
}
.v33-mac-window.maximized .v3651-scene-detail-immersive .app-page-heading>p,
.julia-mac-window.is-maximized .v3651-scene-detail-immersive .app-page-heading>p{
  font-size:12px!important;
}
.v33-mac-window.maximized .v3651-scene-detail-immersive .v35-scene-description,
.v33-mac-window.maximized .v3651-scene-detail-immersive .v35-scene-participants,
.v33-mac-window.maximized .v3651-scene-detail-immersive .v35-knowledge-card,
.v33-mac-window.maximized .v3651-scene-detail-immersive .v35-reveal-controls,
.v33-mac-window.maximized .v3651-scene-detail-immersive .v35-scene-stream,
.v33-mac-window.maximized .v3651-scene-detail-immersive .v35-scene-composer,
.julia-mac-window.is-maximized .v3651-scene-detail-immersive .v35-scene-description,
.julia-mac-window.is-maximized .v3651-scene-detail-immersive .v35-scene-participants,
.julia-mac-window.is-maximized .v3651-scene-detail-immersive .v35-knowledge-card,
.julia-mac-window.is-maximized .v3651-scene-detail-immersive .v35-reveal-controls,
.julia-mac-window.is-maximized .v3651-scene-detail-immersive .v35-scene-stream,
.julia-mac-window.is-maximized .v3651-scene-detail-immersive .v35-scene-composer{
  width:min(1040px,calc(100% - 88px))!important;
}
.v33-mac-window.maximized .v3651-scene-detail-immersive .v35-scene-description,
.julia-mac-window.is-maximized .v3651-scene-detail-immersive .v35-scene-description{
  font-size:15px!important;
}
.v33-mac-window.maximized .v3651-scene-detail-immersive .v35-scene-stream,
.julia-mac-window.is-maximized .v3651-scene-detail-immersive .v35-scene-stream{
  padding:40px 46px!important;
}
.v33-mac-window.maximized .v3651-scene-detail-immersive .v35-scene-narration,
.v33-mac-window.maximized .v3651-scene-detail-immersive .v35-scene-message,
.julia-mac-window.is-maximized .v3651-scene-detail-immersive .v35-scene-narration,
.julia-mac-window.is-maximized .v3651-scene-detail-immersive .v35-scene-message{
  max-width:880px!important;
}
.v33-mac-window.maximized .v3651-scene-detail-immersive .v35-scene-narration p,
.julia-mac-window.is-maximized .v3651-scene-detail-immersive .v35-scene-narration p{
  font-size:16px!important;
  line-height:1.8!important;
}
.v33-mac-window.maximized .v3651-scene-detail-immersive .v35-scene-message,
.julia-mac-window.is-maximized .v3651-scene-detail-immersive .v35-scene-message{
  margin-bottom:20px!important;
  padding:17px 18px!important;
}
.v33-mac-window.maximized .v3651-scene-detail-immersive .v35-scene-message img,
.julia-mac-window.is-maximized .v3651-scene-detail-immersive .v35-scene-message img{
  width:44px!important;height:44px!important;
}
.v33-mac-window.maximized .v3651-scene-detail-immersive .v35-scene-message strong,
.julia-mac-window.is-maximized .v3651-scene-detail-immersive .v35-scene-message strong{
  font-size:12px!important;
}
.v33-mac-window.maximized .v3651-scene-detail-immersive .v35-scene-message p,
.julia-mac-window.is-maximized .v3651-scene-detail-immersive .v35-scene-message p{
  font-size:15px!important;
  line-height:1.62!important;
}
.v33-mac-window.maximized .v3651-scene-detail-immersive .v35-scene-message small,
.julia-mac-window.is-maximized .v3651-scene-detail-immersive .v35-scene-message small{
  font-size:9px!important;
}
.v33-mac-window.maximized .v3651-scene-detail-immersive .v35-scene-participants span,
.julia-mac-window.is-maximized .v3651-scene-detail-immersive .v35-scene-participants span{
  font-size:10px!important;
  min-height:38px!important;
}
.v33-mac-window.maximized .v3651-scene-detail-immersive .v35-knowledge-card strong,
.v33-mac-window.maximized .v3651-scene-detail-immersive .v35-knowledge-card span,
.julia-mac-window.is-maximized .v3651-scene-detail-immersive .v35-knowledge-card strong,
.julia-mac-window.is-maximized .v3651-scene-detail-immersive .v35-knowledge-card span{
  font-size:10px!important;
}
