:root{
  --as-bg:#f6f8fc;
  --as-surface:#ffffff;
  --as-line:#e6ebf2;
  --as-text:#14233b;
  --as-muted:#68788f;
  --as-navy:#0b2148;
  --as-navy-2:#173a72;
  --as-orange:#f97316;
  --as-orange-2:#ea6a0a;
  --as-green:#1a8f5a;
  --as-green-soft:#e7f7ef;
  --as-amber:#a16207;
  --as-amber-soft:#fff7df;
  --as-red:#c0392b;
  --as-red-soft:#fdecec;
  --as-blue-soft:#eef5ff;
  --as-coach-soft:#f3f5f8;
  --as-shadow:0 10px 30px rgba(17,38,68,.06);
}

.active-session-v2{
  background:var(--as-bg);
  color:var(--as-text);
  padding:16px 20px 18px;
  display:flex;
  flex-direction:column;
  gap:12px;
  height:calc(100vh - var(--header-h,72px));
  min-height:0;
  overflow:hidden;
}
body:has(.active-session-v2) .main{
  height:100vh;
  min-height:0;
  overflow:hidden;
  display:grid;
  grid-template-rows:var(--header-h,72px) minmax(0,1fr);
}
body:has(.active-session-v2) #module-root{min-height:0;overflow:hidden}
.active-session-v2 *{box-sizing:border-box}
.active-session-v2 .toast{position:fixed;right:20px;bottom:20px;z-index:40}

.active-session-v2 .as-status-line{
  display:flex;
  align-items:center;
  gap:12px;
  min-height:34px;
  color:var(--as-muted);
  font-size:13px;
}
.active-session-v2 .as-live{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-size:13px;
  font-weight:700;
  color:#44566f;
}
.active-session-v2 .as-live i{
  width:10px;height:10px;border-radius:50%;background:#22c55e;display:inline-block;
  box-shadow:0 0 0 4px rgba(34,197,94,.12);
}

.active-session-v2 .ref-stagebar{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
}
.active-session-v2 .ref-stage{
  background:var(--as-surface);
  border:1px solid var(--as-line);
  border-radius:18px;
  padding:12px 14px;
  display:flex;
  align-items:flex-start;
  gap:12px;
  box-shadow:var(--as-shadow);
}
.active-session-v2 .ref-stage span{
  width:30px;height:30px;border-radius:50%;
  display:grid;place-items:center;
  background:#eef2f7;color:#50627d;font-weight:700;font-size:14px;flex:0 0 auto;
}
.active-session-v2 .ref-stage b{display:block;font-size:14px;line-height:1.2;color:var(--as-text)}
.active-session-v2 .ref-stage small{display:block;margin-top:4px;font-size:12px;color:var(--as-muted)}
.active-session-v2 .ref-stage.active{border-color:#f6b07c;box-shadow:0 10px 30px rgba(249,115,22,.12)}
.active-session-v2 .ref-stage.active span{background:var(--as-orange);color:#fff}
.active-session-v2 .ref-stage.active b{color:var(--as-orange-2)}
.active-session-v2 .ref-stage.done span{background:var(--as-navy);color:#fff}

.active-session-v2 .ref-session-layout{
  display:grid;
  grid-template-columns:minmax(0,1fr) 320px;
  gap:14px;
  min-height:0;
  flex:1 1 auto;
  overflow:hidden;
}
.active-session-v2 .ref-chat-panel,
.active-session-v2 .ref-session-side{
  min-width:0;
}
.active-session-v2 .ref-chat-panel{
  background:var(--as-surface);
  border:1px solid var(--as-line);
  border-radius:24px;
  box-shadow:var(--as-shadow);
  padding:14px;
  display:flex;
  flex-direction:column;
  gap:12px;
  min-height:0;
  overflow:hidden;
}
.active-session-v2 .ref-safety{
  align-self:flex-start;
  border-radius:999px;
  padding:9px 14px;
  font-size:12px;
  font-weight:700;
}
.active-session-v2 .ref-safety.green{background:var(--as-green-soft);color:var(--as-green)}
.active-session-v2 .ref-safety.amber{background:var(--as-amber-soft);color:var(--as-amber)}
.active-session-v2 .ref-safety.red{background:var(--as-red-soft);color:var(--as-red)}

.active-session-v2 .ref-overview{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:0;
  border:1px solid var(--as-line);
  border-radius:18px;
  overflow:hidden;
}
.active-session-v2 .overview-item{
  padding:12px 14px;
  background:#fbfcfe;
  border-right:1px solid var(--as-line);
}
.active-session-v2 .overview-item:last-child{border-right:0}
.active-session-v2 .overview-item span{
  display:block;font-size:12px;font-weight:600;color:var(--as-muted);margin-bottom:6px;
}
.active-session-v2 .overview-item strong{
  display:block;font-size:15px;line-height:1.35;color:var(--as-text)
}

.active-session-v2 .ref-chat{
  flex:1 1 auto;
  min-height:0;
  overflow:auto;
  padding:10px 6px 2px;
  display:flex;
  flex-direction:column;
  gap:18px;
}
.active-session-v2 .ref-chat::-webkit-scrollbar{width:10px}
.active-session-v2 .ref-chat::-webkit-scrollbar-thumb{background:#cfd7e3;border-radius:999px}
.active-session-v2 .message{
  display:flex;
  gap:12px;
  align-items:flex-end;
}
.active-session-v2 .message.user{justify-content:flex-end}
.active-session-v2 .message-avatar{
  width:40px;height:40px;border-radius:50%;display:grid;place-items:center;
  font-size:16px;font-weight:700;flex:0 0 auto;
}
.active-session-v2 .message.ai .message-avatar{background:#ffe8d7;color:var(--as-orange-2)}
.active-session-v2 .message.user .message-avatar{background:#e8f0ff;color:#3461d5}
.active-session-v2 .message-body{max-width:76%;display:flex;flex-direction:column;gap:6px}
.active-session-v2 .message.user .message-body{align-items:flex-end}
.active-session-v2 .message-label{font-size:12px;font-weight:700;color:#f17b1b;display:flex;align-items:center;gap:8px}
.active-session-v2 .message.user .message-label{color:#3562d7}
.active-session-v2 .message-audit{font-size:11px;font-weight:600;color:#8a99ad}
.active-session-v2 .bubble{
  background:var(--as-coach-soft);
  border:1px solid #e7ebf1;
  border-radius:20px 20px 20px 8px;
  padding:16px 18px;
  font-size:16px;
  line-height:1.65;
  color:var(--as-text);
  white-space:pre-wrap;
  word-break:break-word;
}
.active-session-v2 .message.user .bubble{
  background:var(--as-blue-soft);
  border-color:#d8e6ff;
  border-radius:20px 20px 8px 20px;
}
.active-session-v2 .message-meta{
  font-size:12px;
  color:#8593a6;
}

.active-session-v2 .ref-quick{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}
.active-session-v2 .ref-quick button{
  height:40px;
  padding:0 16px;
  border-radius:999px;
  border:1px solid var(--as-line);
  background:#fff;
  color:#304159;
  font-size:14px;
  font-weight:600;
  cursor:pointer;
}
.active-session-v2 .ref-quick button.active,
.active-session-v2 .ref-quick button:hover{
  border-color:#c8d9f7;
  background:#f3f8ff;
  color:#2457c5;
}

.active-session-v2 .ref-composer{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:12px;
  align-items:end;
}
.active-session-v2 .ref-composer textarea,
.active-session-v2 #refPrivateNote{
  width:100%;
  border:1px solid #d9e2ef;
  border-radius:18px;
  background:#fff;
  padding:15px 16px;
  resize:none;
  font:inherit;
  color:var(--as-text);
}
.active-session-v2 .ref-composer textarea{min-height:56px;max-height:120px}
.active-session-v2 .ref-composer textarea:focus,
.active-session-v2 #refPrivateNote:focus{outline:0;border-color:#8eb7ff;box-shadow:0 0 0 3px rgba(52,97,213,.12)}
.active-session-v2 .ref-composer .actions{display:flex;gap:10px}
.active-session-v2 .btn{
  border:1px solid var(--as-line);
  background:#fff;
  color:var(--as-text);
  height:48px;
  padding:0 20px;
  border-radius:16px;
  font-size:15px;
  font-weight:700;
  cursor:pointer;
}
.active-session-v2 .btn.navy{
  background:linear-gradient(180deg,#ff8a26,#f97316);
  border-color:#f97316;
  color:#fff;
}
.active-session-v2 .btn.danger{display:none!important}
.active-session-v2 .btn:hover{border-color:#cfd8e5}
.active-session-v2 .btn.navy:hover{background:linear-gradient(180deg,#ff7c13,#ea6a0a)}

.active-session-v2 .as-session-meta{
  display:flex;
  flex-wrap:wrap;
  gap:18px;
  padding-top:2px;
  color:#6f8096;
  font-size:12px;
}
.active-session-v2 .as-session-meta strong{color:var(--as-text);font-weight:700}

.active-session-v2 .ref-session-side{
  display:flex;
  flex-direction:column;
  gap:12px;
  min-height:0;
  overflow:auto;
  padding-right:3px;
}
.active-session-v2 .side-card{
  background:var(--as-surface);
  border:1px solid var(--as-line);
  border-radius:22px;
  box-shadow:var(--as-shadow);
  padding:18px;
}
.active-session-v2 .side-card h3{
  margin:0 0 14px;
  font-size:18px;
  color:var(--as-text);
}
.active-session-v2 #refContext,
.active-session-v2 #refInsight{display:flex;flex-direction:column;gap:10px}
.active-session-v2 .side-row{
  display:flex;
  justify-content:space-between;
  gap:14px;
  border-bottom:1px solid #eef2f7;
  padding-bottom:10px;
}
.active-session-v2 .side-row:last-child{border-bottom:0;padding-bottom:0}
.active-session-v2 .side-row span{font-size:13px;color:var(--as-muted)}
.active-session-v2 .side-row strong{font-size:14px;color:var(--as-text);text-align:right}
.active-session-v2 .ref-insight-row{
  border-left:3px solid #d7e3f7;
  background:#fafcff;
  border-radius:0 14px 14px 0;
  padding:10px 12px;
}
.active-session-v2 .ref-insight-row:first-child{border-left-color:var(--as-orange)}
.active-session-v2 .ref-insight-row span{display:block;font-size:12px;font-weight:700;color:#4f627c;margin-bottom:5px}
.active-session-v2 .ref-insight-row p{margin:0;font-size:13px;line-height:1.55;color:#203046}
.active-session-v2 .insight-empty{
  border:1px dashed #d7dfeb;
  border-radius:18px;
  padding:18px;
  text-align:center;
  background:#fcfdff;
}
.active-session-v2 .insight-empty strong{display:block;font-size:15px;color:var(--as-text);margin-bottom:8px}
.active-session-v2 .insight-empty p{margin:0;font-size:13px;line-height:1.55;color:var(--as-muted)}
.active-session-v2 #refBuildInsight,
.active-session-v2 #refSaveNote{width:100%;margin-top:14px}
.active-session-v2 #refPrivateNote{min-height:132px}

@media (max-width: 1180px){
  .active-session-v2{height:auto;min-height:calc(100vh - var(--header-h,72px));overflow:visible}
  body:has(.active-session-v2) .main{height:auto;overflow:visible;display:block}
  body:has(.active-session-v2) #module-root{overflow:visible}
  .active-session-v2 .ref-session-layout{grid-template-columns:1fr;overflow:visible}
  .active-session-v2 .ref-chat-panel{min-height:650px}
  .active-session-v2 .ref-session-side{overflow:visible}
}
@media (max-width: 860px){
  .active-session-v2{padding:16px}
  .active-session-v2 .ref-stagebar,
  .active-session-v2 .ref-overview{grid-template-columns:1fr 1fr}
  .active-session-v2 .ref-composer{grid-template-columns:1fr}
  .active-session-v2 .message-body{max-width:88%}
}
@media (max-width: 640px){
  .active-session-v2 .ref-stagebar,
  .active-session-v2 .ref-overview{grid-template-columns:1fr}
  .active-session-v2 .ref-stage{padding:14px}
  .active-session-v2 .bubble{font-size:15px}
  .active-session-v2 .message-body{max-width:100%}
}

/* v18.4 — chat visibility and viewport fit; UI-only override */
@media (min-width: 901px){
  .active-session-v2{
    padding:12px 18px 12px;
    gap:9px;
  }
  .active-session-v2 .as-status-line{
    min-height:24px;
    gap:10px;
    font-size:12px;
  }
  .active-session-v2 .ref-stagebar{gap:10px}
  .active-session-v2 .ref-stage{
    min-height:62px;
    padding:9px 12px;
    align-items:center;
    border-radius:16px;
  }
  .active-session-v2 .ref-stage span{width:28px;height:28px;font-size:13px}
  .active-session-v2 .ref-stage b{font-size:13px}
  .active-session-v2 .ref-stage small{font-size:11px;margin-top:2px}

  .active-session-v2 .ref-session-layout{gap:12px}
  .active-session-v2 .ref-chat-panel{
    padding:11px 12px 10px;
    gap:8px;
  }
  .active-session-v2 .ref-safety.green{display:none}
  .active-session-v2 .ref-safety.amber,
  .active-session-v2 .ref-safety.red{display:block;margin:0}

  .active-session-v2 .ref-overview{
    flex:0 0 auto;
    min-height:52px;
    border-radius:14px;
  }
  .active-session-v2 .overview-item{padding:8px 11px}
  .active-session-v2 .overview-item span{font-size:10px;margin-bottom:2px}
  .active-session-v2 .overview-item strong{font-size:12.5px;line-height:1.25}

  .active-session-v2 .ref-chat{
    flex:1 1 190px;
    min-height:180px;
    padding:8px 8px 4px;
    gap:14px;
    overscroll-behavior:contain;
  }
  .active-session-v2 .message{
    max-width:none;
    width:100%;
    margin:0;
  }
  .active-session-v2 .message-body{max-width:74%}
  .active-session-v2 .message-avatar{width:34px;height:34px;font-size:14px}
  .active-session-v2 .message-label{font-size:11px}
  .active-session-v2 .message-audit{font-size:10px}
  .active-session-v2 .bubble{
    padding:11px 14px;
    font-size:14px;
    line-height:1.5;
  }
  .active-session-v2 .message-meta{font-size:10.5px}

  .active-session-v2 .ref-quick{gap:8px;flex:0 0 auto}
  .active-session-v2 .ref-quick button{
    height:34px;
    padding:0 13px;
    font-size:12px;
  }
  .active-session-v2 .ref-composer{
    grid-template-columns:minmax(0,1fr) auto;
    gap:10px;
    flex:0 0 auto;
    align-items:center;
  }
  .active-session-v2 .ref-composer textarea{
    min-height:50px;
    height:50px;
    max-height:92px;
    padding:12px 14px;
    border-radius:15px;
  }
  .active-session-v2 .ref-composer .actions{gap:8px}
  .active-session-v2 .btn{
    height:46px;
    padding:0 18px;
    border-radius:14px;
    font-size:14px;
  }
  .active-session-v2 .as-session-meta{display:none}

  .active-session-v2 .ref-session-side{gap:10px}
  .active-session-v2 .side-card{padding:14px;border-radius:18px}
  .active-session-v2 .side-card h3{font-size:16px;margin-bottom:10px}
  .active-session-v2 #refContext,
  .active-session-v2 #refInsight{gap:7px}
  .active-session-v2 .side-row{padding-bottom:7px}
  .active-session-v2 .side-row span{font-size:12px}
  .active-session-v2 .side-row strong{font-size:12px;max-width:62%}
  .active-session-v2 .ref-insight-row{padding:8px 10px}
  .active-session-v2 .ref-insight-row span{font-size:10px;margin-bottom:3px}
  .active-session-v2 .ref-insight-row p{font-size:11.5px;line-height:1.4}
  .active-session-v2 .insight-empty{padding:14px}
  .active-session-v2 .insight-empty strong{font-size:13px;margin-bottom:5px}
  .active-session-v2 .insight-empty p{font-size:11.5px}
  .active-session-v2 #refBuildInsight,
  .active-session-v2 #refSaveNote{margin-top:10px;height:40px}
  .active-session-v2 #refPrivateNote{min-height:90px;padding:11px 12px}
}

@media (min-width:901px) and (max-height:760px){
  .active-session-v2 .as-status-line{display:none}
  .active-session-v2 .ref-stage{min-height:56px;padding:7px 10px}
  .active-session-v2 .ref-stage small{display:none}
  .active-session-v2 .ref-chat{min-height:170px}
  .active-session-v2 .ref-session-side .side-card:nth-child(3){display:none}
}

/* ========================================================================== 
   v23 — User message visibility fix
   UI-only: prevent the older global .message.user .bubble rule from making
   user text white on a pale bubble. No session/AI logic changed.
   ========================================================================== */
.active-session-v2 .message.user .bubble{
  background:#ffffff;
  border-color:#dfe6ef;
  color:var(--as-text)!important;
  opacity:1;
  -webkit-text-fill-color:var(--as-text);
}
