.live-view.active{
  display:grid;
  grid-template-rows:auto minmax(0,1fr) auto;
  height:100svh;
  min-height:0;
  overflow:hidden;
}
.live-view .live-header{
  position:relative;
  top:auto;
}
.live-view main{
  width:100%;
  max-width:none;
  min-height:0;
  height:100%;
  margin:0;
  padding:12px 12px 70px;
  display:grid;
  gap:10px;
  grid-template-columns:minmax(320px,.92fr) minmax(360px,1.08fr);
  grid-template-rows:auto auto minmax(180px,1fr) auto minmax(110px,.55fr);
  grid-template-areas:
    "score transcript"
    "ratio transcript"
    "question transcript"
    "spin transcript"
    "alerts transcript"
    "insights transcript";
  overflow:hidden;
}
.spin-score{
  grid-area:score;
  display:flex;
  align-items:baseline;
  gap:6px;
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:8px;
  padding:12px 14px;
}
.spin-score small{
  margin-right:auto;
  font-weight:900;
}
.spin-score strong{
  font-size:34px;
  line-height:1;
  color:var(--gold);
}
.spin-score span{
  color:var(--muted);
  font-weight:800;
}
.live-view .ratio{grid-area:ratio}
.live-view .spin-grid{grid-area:spin}
.live-view .question{
  grid-area:question;
  display:grid;
  align-content:center;
  min-height:0;
}
.live-view .question h1{
  font-size:clamp(28px,4.2vh,46px);
  overflow-wrap:anywhere;
}
.live-view .alerts{
  grid-area:alerts;
  min-height:0;
  overflow:hidden;
}
.live-view .insights{
  grid-area:insights;
  min-height:0;
  overflow:hidden;
}
.live-view .transcript{
  grid-area:transcript;
  min-height:0;
  height:100%;
  display:grid;
  grid-template-rows:auto minmax(0,1fr) auto;
  overflow:hidden;
}
.live-view .transcript summary{
  cursor:default;
  font-weight:900;
  margin-bottom:8px;
}
#transcriptList{
  min-height:0;
  overflow:auto;
  padding-right:4px;
}
.live-view .manual{
  margin-top:10px;
}
@media(max-width:760px){
  .live-view main{
    padding:10px 10px 72px;
    grid-template-columns:1fr 1fr;
    grid-template-rows:auto auto minmax(168px,1fr) auto minmax(120px,.7fr);
    grid-template-areas:
      "score ratio"
      "spin spin"
      "question question"
      "alerts alerts"
      "transcript transcript";
  }
  .live-view .insights{display:none}
  .live-view .spin-grid{grid-template-columns:repeat(4,1fr)}
  .live-view .spin-cell{padding:9px}
  .live-view .spin-cell strong{font-size:10px}
  .live-view .ratio div{padding:10px}
  .live-view .ratio strong{font-size:24px}
  .spin-score{padding:10px}
  .spin-score strong{font-size:28px}
  .live-view .transcript summary{display:none}
}
@media(max-width:430px){
  .live-view main{
    grid-template-columns:1fr;
    grid-template-rows:auto auto auto minmax(156px,1fr) auto minmax(118px,.62fr);
    grid-template-areas:
      "score"
      "ratio"
      "spin"
      "question"
      "alerts"
      "transcript";
  }
  .live-view .question h1{font-size:26px}
  .live-view .manual{grid-template-columns:1fr}
}
