/* V8.10.1 — Immersive polish: reclaim vertical space, side-by-side notes, subtle brand motion. */

/* ---------- Dashboard geometry: remove the accidental blank grid row ---------- */
.os-shell .app-main{
  position:relative;
  grid-template-rows:auto auto minmax(0,1fr)!important;
}
.os-shell #save-status{
  min-height:24px;
  padding:4px 24px;
  font-size:10px;
  line-height:1.25;
  background:rgba(4,7,11,.72);
  border-bottom:1px solid rgba(255,255,255,.035);
}
.os-shell #save-status[data-status="failed"],
.os-shell #save-status[data-status="blocked"]{
  min-height:38px;
  padding-block:7px;
}
.os-shell .content{
  align-self:start;
  padding-top:14px;
  padding-bottom:56px;
}
.immersive-today,.immersive-learn{
  width:100%;
  max-width:1360px!important;
}

/* Today's Mission should visually own the screen, without adding widgets. */
.session-stage{
  min-height:clamp(430px,58vh,610px);
  display:grid;
  grid-template-rows:auto minmax(0,1fr) auto;
  row-gap:22px;
  padding:clamp(26px,3vw,42px)!important;
}
.session-stage-top{margin-bottom:0!important;min-width:0}
.session-stage-grid{align-self:stretch;min-width:0}
.session-stage-copy{min-width:0;align-self:center}
.session-stage-copy h2{
  max-width:15ch!important;
  font-size:clamp(38px,4.5vw,60px)!important;
  line-height:1.01!important;
  overflow-wrap:normal;
  text-wrap:balance;
}
.session-next{max-width:100%!important;min-width:0}
.session-next strong{
  display:block;
  max-width:100%;
  overflow-wrap:anywhere;
  line-height:1.28!important;
}
.session-chips{max-width:100%}
.session-chips span{white-space:nowrap}
.session-clock-card{min-height:220px!important}
.session-length-row{
  margin-top:0!important;
  min-width:0;
  flex-wrap:wrap;
}
.session-length-row>div{min-width:0}
.session-context{width:100%}
.session-context>summary{min-width:0}
.session-context>summary span{flex:0 0 auto}
.session-context>summary small{min-width:0;flex:1 1 auto;text-align:right}

/* ---------- Viewer notes: one Notes control, one panel, kept beside the visual ---------- */
#viewer.focus-layout-v894 .notes-panel{
  min-width:0;
  min-height:0;
  height:100%;
  display:grid;
  grid-template-rows:auto minmax(0,1fr) auto;
  overflow:hidden;
  border-left:1px solid rgba(103,220,255,.12);
  background:linear-gradient(180deg,#08101a 0%,#060b12 100%);
  color:#e8f1f8;
}
#viewer.focus-layout-v894 .notes-panel[hidden]{display:none!important}
#viewer.focus-layout-v894.immersive-viewer.notes-open:not(.focus-mobile):not(.ai-open):not(.recall-active):not(.recall-compare) .viewer-body{
  grid-template-columns:minmax(0,1fr) clamp(320px,28vw,430px)!important;
}
#viewer.focus-layout-v894:not(.focus-mobile).notes-open .slide-zone{grid-column:1!important}
#viewer.focus-layout-v894:not(.focus-mobile).notes-open .notes-panel{grid-column:2!important;grid-row:1!important}
#viewer.focus-layout-v894.notes-open .chunk-rail{display:none!important}
#viewer.focus-layout-v894.notes-open .ai-panel{display:none!important}
.notes-side-head{
  min-width:0;
  min-height:64px;
  padding:12px 12px 10px 14px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  border-bottom:1px solid rgba(255,255,255,.065);
}
.notes-side-head>div{min-width:0}
.notes-side-head .eyebrow{display:block;font-size:9px!important}
.notes-side-head strong{
  display:block;
  margin-top:4px;
  max-width:100%;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  font-size:13px;
  line-height:1.35;
}
.notes-side-close{
  flex:0 0 36px;
  width:36px;
  height:36px;
  padding:0;
  display:grid;
  place-items:center;
  border:1px solid rgba(255,255,255,.09);
  border-radius:11px;
  background:rgba(255,255,255,.025);
  color:#b9cad8;
  cursor:pointer;
}
.notes-side-close:hover{background:rgba(255,255,255,.055);color:#fff}
.notes-side-body{
  min-height:0;
  padding:14px;
  display:grid;
  grid-template-rows:auto auto minmax(0,1fr);
  gap:10px;
  overflow:hidden;
}
.notes-side-body p{
  margin:0;
  color:#7f94a8;
  font-size:11px;
  line-height:1.5;
}
.notes-side-label{color:#cfe2ef;font-size:11px;font-weight:800}
.notes-side-body textarea{
  width:100%;
  min-width:0;
  min-height:0;
  height:100%;
  resize:none;
  padding:13px 14px;
  border:1px solid rgba(105,155,194,.28);
  border-radius:14px;
  background:#040910;
  color:#f1f7fb;
  outline:none;
  font:500 14px/1.6 ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
.notes-side-body textarea:focus{
  border-color:rgba(91,209,255,.62);
  box-shadow:0 0 0 3px rgba(72,175,255,.10);
}
.notes-side-footer{
  min-height:44px;
  padding:8px 14px max(8px,env(safe-area-inset-bottom));
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  border-top:1px solid rgba(255,255,255,.06);
  color:#657a8e;
  font-size:10px;
}
.notes-autosave{color:#7ea7bc}

/* On narrow screens Notes becomes the study surface; no duplicate modal is created. */
#viewer.focus-layout-v894.focus-mobile.notes-open{
  grid-template-rows:minmax(0,1fr)!important;
}
#viewer.focus-layout-v894.focus-mobile.notes-open>.viewer-top,
#viewer.focus-layout-v894.focus-mobile.notes-open>.viewer-bottom,
#viewer.focus-layout-v894.focus-mobile.notes-open .slide-zone,
#viewer.focus-layout-v894.focus-mobile.notes-open .chunk-rail{
  display:none!important;
}
#viewer.focus-layout-v894.focus-mobile.notes-open .viewer-body{
  grid-template-columns:minmax(0,1fr)!important;
  grid-template-rows:minmax(0,1fr)!important;
}
#viewer.focus-layout-v894.focus-mobile.notes-open .notes-panel{
  display:grid!important;
  grid-column:1!important;
  grid-row:1!important;
  border-left:0;
}

/* ---------- Spence AI: subtle motion, not visual noise ---------- */
.tutor-brand .ai-orb{
  position:relative;
  overflow:hidden;
  animation:spenceOrbTurn 7s linear infinite,spenceOrbGlow 2.8s ease-in-out infinite;
}
.tutor-brand .ai-orb::after{
  content:"";
  position:absolute;
  inset:4px;
  border-radius:50%;
  background:radial-gradient(circle at 32% 28%,rgba(255,255,255,.75),rgba(255,255,255,.08) 35%,transparent 58%);
  mix-blend-mode:screen;
  pointer-events:none;
}
@keyframes spenceOrbTurn{to{transform:rotate(360deg)}}
@keyframes spenceOrbGlow{0%,100%{box-shadow:0 0 10px rgba(74,186,255,.18)}50%{box-shadow:0 0 22px rgba(91,141,255,.42)}}

/* ---------- Post-sign-in loading: animate the actual Med with Spence mark ---------- */
#os-loading::before{
  content:"";
  width:min(260px,64vw);
  height:74px;
  background:url('/assets/previews/mws-unified-logo-v811.webp') center/contain no-repeat;
  filter:drop-shadow(0 0 18px rgba(76,196,255,.16));
  animation:mwsLoaderFloat 2.6s ease-in-out infinite;
}
#os-loading::after{
  content:"";
  width:min(180px,46vw);
  height:2px;
  border-radius:999px;
  background:linear-gradient(90deg,transparent,#52dcff 35%,#6f63ff 65%,transparent);
  background-size:200% 100%;
  opacity:.72;
  animation:mwsLoaderSweep 1.6s ease-in-out infinite;
}
#os-loading strong{margin-top:2px;letter-spacing:-.015em}
@keyframes mwsLoaderFloat{0%,100%{transform:translateY(0) scale(1);opacity:.92}50%{transform:translateY(-5px) scale(1.015);opacity:1}}
@keyframes mwsLoaderSweep{0%{background-position:100% 0;opacity:.28}50%{opacity:.9}100%{background-position:-100% 0;opacity:.28}}

/* ---------- Defensive overlap fixes ---------- */
.topbar,.topbar-title,.topbar-actions,.session-stage-copy,.session-stage-grid,.viewer-title,.focus-timer{min-width:0}
.topbar-title h1,.viewer-title strong,.notes-side-head strong{overflow:hidden;text-overflow:ellipsis}
.focus-timer{flex-shrink:0}

@media(max-width:1100px){
  .session-stage{min-height:410px}
  .session-stage-copy h2{font-size:clamp(34px,5vw,52px)!important}
  .session-clock-card{min-height:190px!important}
}
@media(max-width:860px){
  .os-shell #save-status{padding-inline:14px}
  .os-shell .content{padding-top:10px}
  .session-stage{min-height:0;display:block}
  .session-stage-top{margin-bottom:18px!important}
  .session-length-row{margin-top:22px!important}
}
@media(max-width:640px){
  .session-stage-copy h2{max-width:none!important;font-size:34px!important;line-height:1.04!important}
  .session-chips span{white-space:normal}
}
@media(prefers-reduced-motion:reduce){
  .tutor-brand .ai-orb,#os-loading::before,#os-loading::after{animation:none!important}
}

/* Keep floating study controls from colliding with one another or the side panel. */
#viewer.focus-layout-v894.immersive-viewer .immersive-study-dock .slide-tools-group{
  max-width:100%;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  scrollbar-width:none;
}
#viewer.focus-layout-v894.immersive-viewer .immersive-study-dock .slide-tools-group::-webkit-scrollbar{display:none}
#viewer.focus-layout-v894.immersive-viewer .immersive-study-dock .tool-pill{white-space:nowrap}
#viewer.focus-layout-v894.immersive-viewer.notes-open .immersive-study-dock{max-width:calc(100% - 24px)!important}
.session-stage-top{flex-wrap:wrap}