/* ============================================================
   lesson-shell.css — 独立课章 L01 视觉标准适配层
   作用域仅限带 data-ui-standard="l01" 的 L02–L12 页面；
   不修改 agency，也不接管各课业务状态机。
   ============================================================ */

body[data-ui-standard="l01"]{
  --paper:var(--ag-paper);
  --paper2:var(--ag-well);
  --paper3:var(--ag-panel);
  --ink:var(--ag-ink);
  --muted:var(--ag-ink-soft);
  --line:var(--ag-line);
  --gold:var(--ag-gold);
  --golddeep:var(--ag-gold-deep);
  --green:var(--ag-green);
  --red:var(--ag-red);
  --blue:var(--ag-blue);
  --serif:var(--ag-serif);
  --sans:var(--ag-sans);
}

body[data-ui-standard="l01"] :where(button,a,input,textarea,select):focus-visible{
  outline:2px solid var(--ag-gold);
  outline-offset:2px;
}
body[data-ui-standard="l01"] :where(button,.btn,.primary,.ghost,.chip){min-height:40px}
body[data-ui-standard="l01"] :where(input,textarea,select){font-family:var(--ag-sans)}

/* L04–L12 使用同一 DOM 壳；在不改业务结构的前提下映射到 L01。 */
body[data-shell-family="studio"] .drawer{
  background:rgba(245,242,236,.94);
  border-right:1px solid var(--ag-line);
  box-shadow:8px 0 30px rgba(64,53,42,.09);
  backdrop-filter:blur(20px);
}
body[data-shell-family="studio"] .drawer-head{border-bottom-color:var(--ag-line)}
body[data-shell-family="studio"] .brand small{
  color:var(--ag-ink-faint);
  letter-spacing:1.7px;
}
body[data-shell-family="studio"] .nav button{
  min-height:48px;
  color:var(--ag-ink-soft);
  border-left:3px solid transparent;
}
body[data-shell-family="studio"] .nav button:hover{
  background:var(--ag-card);
  color:var(--ag-ink);
}
body[data-shell-family="studio"] .nav button.active{
  background:#f3eee5;
  border-left-color:var(--ag-gold);
  color:var(--ag-ink);
}
body[data-shell-family="studio"] .nav .ico{
  color:var(--ag-gold-deep);
  font-family:Georgia,var(--ag-serif);
}

/* 顶部课程牌与 HUD：纸质浮签，对齐 L01 的轻层级。 */
body[data-shell-family="studio"] .stage-top{
  left:28px;
  right:28px;
  top:14px;
  justify-content:flex-end;
  pointer-events:none;
}
body[data-shell-family="studio"] .cover{
  position:absolute;
  left:50%;
  top:0;
  transform:translateX(-50%);
  min-width:300px;
  padding:11px 22px 10px;
  text-align:center;
  color:var(--ag-ink);
  background:rgba(249,247,242,.9);
  border:1px solid rgba(185,154,107,.38);
  box-shadow:0 8px 26px rgba(62,50,37,.1);
  backdrop-filter:blur(12px);
}
body[data-shell-family="studio"] .cover b{
  color:var(--ag-ink);
  font:500 20px/1.25 var(--ag-serif);
  letter-spacing:.06em;
}
body[data-shell-family="studio"] .cover small{
  color:var(--ag-gold-deep);
  letter-spacing:.28em;
  margin-top:6px;
}
body[data-shell-family="studio"] .hud{margin-left:auto}
body[data-shell-family="studio"] .hud-pill{
  min-width:135px;
  padding:7px 12px;
  color:var(--ag-ink);
  background:rgba(248,246,241,.82);
  border:1px solid rgba(138,118,91,.25);
  box-shadow:0 7px 22px rgba(62,50,37,.08);
  backdrop-filter:blur(12px);
}
body[data-shell-family="studio"] .hud-pill small{color:var(--ag-ink-faint)}
body[data-shell-family="studio"] .hud-pill b{color:var(--ag-ink)}

/* 选项卡恢复 L01 的纸卡形态，保留后续页的编号与回调。 */
body[data-shell-family="studio"] .choice-panel{
  display:flex;
  flex-direction:column;
  right:94px;
  gap:9px;
  padding:10px;
  background:rgba(247,244,238,.88);
  border:1px solid rgba(185,154,107,.32);
  border-top:3px solid var(--ag-gold);
  backdrop-filter:blur(12px);
}
body[data-shell-family="studio"] .choice-panel:empty{display:none}
body[data-shell-family="studio"] .choice{
  min-height:62px;
  padding:12px 16px 11px 56px;
  color:var(--ag-ink);
  background:rgba(250,248,244,.92);
  border:1px solid rgba(153,129,96,.34);
  box-shadow:0 8px 22px rgba(64,52,37,.07);
}
body[data-shell-family="studio"] .choice:hover{
  background:#fff;
  border-color:var(--ag-gold);
  transform:translateX(-3px);
}

/* 角色与对话：统一采用顾宁式左侧身份栏；人物脚位压入对话栏约 20px。 */
body[data-shell-family="studio"] .actor{
  bottom:170px;
  width:min(62vw,820px);
  height:74vh;
  overflow:visible;
}
body[data-shell-family="studio"] .actor img:is([src*="shenlan_"],[src*="guning_"]){
  flex:0 0 auto;
  width:auto!important;
  height:100%!important;
  max-width:none!important;
  max-height:100%!important;
  object-fit:contain;
}
body[data-shell-family="studio"] .dialogue{
  left:0;
  right:0;
  bottom:0;
  height:190px;
  display:grid;
  grid-template-columns:132px minmax(0,1fr) 72px;
  gap:20px;
  padding:20px 26px 18px;
  overflow:hidden;
  color:var(--ag-ink);
  background:rgba(250,248,244,.96);
  border:0;
  border-top:1px solid rgba(177,148,105,.52);
  border-radius:0;
  box-shadow:0 -10px 45px rgba(45,35,25,.16);
  backdrop-filter:blur(16px);
}
body[data-shell-family="studio"] .speaker{
  position:static;
  width:auto;
  min-width:0;
  height:auto;
  padding:0 20px 0 0;
  border:0;
  border-right:1px solid var(--ag-line);
  color:var(--ag-ink);
  background:transparent;
  box-shadow:none;
  clip-path:none;
}
body[data-shell-family="studio"] .speaker-avatar{
  position:static;
  width:72px;
  height:72px;
  border:1px solid var(--ag-gold);
  border-radius:50%;
  object-fit:cover;
  object-position:center 20%;
  background:#ddd2c3;
  box-shadow:none;
}
body[data-shell-family="studio"] .speaker strong{
  display:block;
  margin-top:8px;
  color:var(--ag-ink);
  font:700 17px/1.25 var(--ag-serif);
  white-space:nowrap;
}
body[data-shell-family="studio"] .speaker small{
  display:block;
  margin-top:3px;
  color:var(--ag-gold-deep);
  font-size:8px;
  letter-spacing:.12em;
  white-space:nowrap;
}
body[data-shell-family="studio"] .dialogue-copy{
  position:relative;
  height:100%;
  min-width:0;
  padding-top:1px;
  overflow:auto;
}
body[data-shell-family="studio"] .dialogue-text{
  max-width:980px;
  color:var(--ag-ink);
  font:500 16px/1.85 var(--ag-serif);
  letter-spacing:.03em;
}
body[data-shell-family="studio"] .type-hint{
  right:2px;
  bottom:0;
  color:var(--ag-ink-faint);
}
body[data-shell-family="studio"] .next-btn{
  position:static;
  align-self:center;
  width:50px;
  height:50px;
  border:1px solid var(--ag-line);
  border-radius:0;
  color:var(--ag-gold-deep);
  background:#fff;
}
body[data-shell-family="studio"] .next-btn:hover{
  color:var(--ag-ink);
  border-color:var(--ag-gold);
  background:var(--ag-gold-wash);
}

/* L05–L08 的只读巡检栏属于剧情辅助，不得覆盖右侧“下一句”。
   Terminal 样式在页面末尾动态注入，因此这里用更高作用域和 !important
   固定到对白底部安全区，并把层级压到正式 overlay（z-index:80）之下。 */
body[data-shell-family="studio"]:is(
  [data-agency-c3-lesson="L05"],
  [data-agency-c3-lesson="L06"],
  [data-agency-c3-lesson="L07"],
  [data-agency-c3-lesson="L08"]
) .agency-lesson-support-rail{
  right:78px!important;
  bottom:10px!important;
  z-index:70!important;
  max-width:calc(100vw - 156px)!important;
}
body[data-shell-family="studio"]:is(
  [data-agency-c3-lesson="L05"],
  [data-agency-c3-lesson="L06"],
  [data-agency-c3-lesson="L07"],
  [data-agency-c3-lesson="L08"]
) .agency-lesson-support-rail button{
  min-height:44px!important;
  padding:7px 10px!important;
  font-size:11px!important;
}

/* L08 起只改变剧情域为冷蓝考核态，纸域不随意换色。 */
body[data-shell-family="studio"][data-phase="assess"] .dialogue{
  color:#eef4f9;
  background:rgba(31,40,52,.94);
  border-color:rgba(127,155,181,.72);
  box-shadow:0 20px 60px rgba(6,10,16,.32);
}
body[data-shell-family="studio"][data-phase="assess"] .speaker{
  color:#eef4f9;
  background:transparent;
  border-right-color:rgba(150,175,200,.35);
  box-shadow:none;
}
body[data-shell-family="studio"][data-phase="assess"] .speaker strong{color:#eef4f9}
body[data-shell-family="studio"][data-phase="assess"] .speaker small{color:#9db6cf}
body[data-shell-family="studio"][data-phase="assess"] .speaker-avatar{border-color:#edf3f7}
body[data-shell-family="studio"][data-phase="assess"] .dialogue-text{color:#eef4f9}
body[data-shell-family="studio"][data-phase="assess"] .type-hint{color:#9cb0c2}
body[data-shell-family="studio"][data-phase="assess"] .next-btn{
  color:#d7e4ef;
  background:rgba(255,255,255,.06);
  border-color:#7f9bb5;
}
body[data-shell-family="studio"][data-phase="assess"] .next-btn:hover{background:rgba(127,155,181,.2)}
body[data-shell-family="studio"][data-phase="assess"] .hud-pill{
  color:#eef4f9;
  background:rgba(31,40,52,.84);
  border-color:rgba(127,155,181,.55);
}
body[data-shell-family="studio"][data-phase="assess"] .hud-pill small{color:#a8bdcf}
body[data-shell-family="studio"][data-phase="assess"] .hud-pill b{color:#eef4f9}
body[data-shell-family="studio"][data-phase="assess"] .choice-panel{border-top-color:#6886a1}

/* L02–L03 与 L01 同 DOM：同样改成顾宁式左侧身份栏。 */
body[data-shell-family="l01"] .sprite-wrap{
  left:3%;
  bottom:170px;
  height:74vh;
  max-height:720px;
}
body[data-shell-family="l01"] .sprite-wrap img:is([src*="shenlan_"],[src*="guning_"]){
  flex:0 0 auto;
  width:auto!important;
  height:100%!important;
  max-width:none!important;
  max-height:100%!important;
  object-fit:contain;
}
body[data-shell-family="l01"] .dialogue{
  left:0;
  right:0;
  bottom:0;
  height:190px;
  padding:20px 100px 18px 174px;
  border-width:1px 0 0;
  border-radius:0;
  overflow:hidden;
  box-shadow:0 -10px 45px rgba(45,35,25,.16);
}
body[data-shell-family="l01"] .dialogue::before{display:none}
body[data-shell-family="l01"] .speaker{
  left:26px;
  top:18px;
  bottom:18px;
  width:122px;
  min-width:0;
  height:auto;
  padding:0 18px 0 0;
  color:var(--ag-ink);
  background:transparent;
  border-right:1px solid var(--ag-line);
  box-shadow:none;
  clip-path:none;
}
body[data-shell-family="l01"] .speaker img{
  position:static;
  width:72px;
  height:72px;
  border:1px solid var(--ag-gold);
}
body[data-shell-family="l01"] .speaker b{margin-top:8px;font-size:17px;line-height:1.25;color:var(--ag-ink)}
body[data-shell-family="l01"] .speaker small{margin-top:3px;color:var(--ag-gold-deep);font-size:8px;letter-spacing:.12em}

/* 面板、表单、门槛：共用纸墨金与“只提示缺项、不清空”的可见语义。 */
body[data-shell-family="studio"] .overlay{background:rgba(36,31,27,.58)}
body[data-shell-family="studio"] .overlay[hidden]{display:none!important}
body[data-shell-family="studio"].c3-modal-open{overflow:hidden}
body[data-shell-family="studio"] .panel,
body[data-shell-family="studio"] .guard-panel{
  color:var(--ag-ink);
  background:rgba(249,247,242,.985);
  border:1px solid rgba(185,154,107,.56);
  border-radius:0;
  box-shadow:0 30px 90px rgba(29,23,18,.34);
}
body[data-shell-family="studio"] .panel-head{
  background:rgba(249,247,242,.98);
  border-bottom-color:var(--ag-line);
}
body[data-shell-family="studio"] .panel h2{font-family:var(--ag-serif);font-weight:500}
body[data-shell-family="studio"] .panel-sub{color:var(--ag-ink-soft)}
body[data-shell-family="studio"] .panel-actions{
  background:rgba(249,247,242,.98);
  border-top-color:var(--ag-line);
}
body[data-shell-family="studio"] :where(.brief-card,.archive-card,.gate-box,.card){
  border-color:var(--ag-line);
  border-radius:0;
  background:var(--ag-card);
}
body[data-shell-family="studio"] :where(input,textarea,select){
  color:var(--ag-ink);
  background:#fff;
  border-color:var(--ag-line);
}
body[data-shell-family="studio"] :where(input,textarea,select):focus{border-color:var(--ag-gold)}
body[data-shell-family="studio"] :where(.btn,.primary,.ghost){
  min-height:44px;
  border-radius:0;
  border-color:var(--ag-line);
  font-family:var(--ag-sans);
}
body[data-shell-family="studio"] :where(.btn.primary,.primary){
  color:#fff;
  background:var(--ag-ink);
  border-color:var(--ag-ink);
}
body[data-shell-family="studio"] :where(.btn.primary,.primary):hover{background:#000}
body[data-shell-family="studio"] :where(.btn,.primary,.ghost):disabled{opacity:.4;cursor:not-allowed}
body[data-shell-family="studio"] :where(.chip,.work-tabs button){border-radius:0}
body[data-shell-family="studio"] :where(.work-tabs button,.close){min-width:44px;min-height:44px}
body[data-shell-family="studio"] :where(button,a[href],input,textarea,select,[tabindex]):focus-visible{
  outline:3px solid #9a5b2e;
  outline-offset:2px;
}
body[data-shell-family="studio"] :where(.chip.selected,.work-tabs button.active){
  color:var(--ag-gold-deep);
  background:var(--ag-gold-wash);
  border-color:var(--ag-gold);
}
body[data-shell-family="studio"] .gate-box{border-left:3px solid var(--ag-gold)}
body[data-shell-family="studio"] .gate-item.ok,
body[data-shell-family="studio"] .gate.ok{color:var(--ag-green)}
body[data-shell-family="studio"] .gate-item:not(.ok),
body[data-shell-family="studio"] .gate:not(.ok){color:#9a6c5a}

@media(max-width:1050px) and (min-width:761px){
  body[data-shell-family="studio"] .cover{display:none}
}

@media(max-width:760px){
  body[data-shell-family="studio"]:is(
    [data-agency-c3-lesson="L05"],
    [data-agency-c3-lesson="L06"],
    [data-agency-c3-lesson="L07"],
    [data-agency-c3-lesson="L08"]
  ) .agency-lesson-support-rail{
    right:58px!important;
    bottom:6px!important;
    max-width:calc(100vw - 116px)!important;
  }
  body[data-shell-family="studio"]:is(
    [data-agency-c3-lesson="L05"],
    [data-agency-c3-lesson="L06"],
    [data-agency-c3-lesson="L07"],
    [data-agency-c3-lesson="L08"]
  ) .agency-lesson-support-rail button{
    min-height:44px!important;
    padding:7px 8px!important;
    font-size:10px!important;
  }
  body[data-shell-family="studio"] .cover{display:none}
  body[data-shell-family="studio"] .stage-top{left:61px;right:9px;top:8px}
  body[data-shell-family="studio"] .actor{
    left:-10%;
    bottom:150px;
    width:min(92vw,760px);
    height:60vh;
  }
  body[data-shell-family="studio"] .choice-panel{
    left:9px;
    right:9px;
    top:auto;
    bottom:190px;
    width:auto;
    max-height:205px;
    padding:7px;
    transform:none;
    overflow:auto;
  }
  body[data-shell-family="studio"] .dialogue{
    left:0;
    right:0;
    bottom:0;
    height:176px;
    grid-template-columns:92px minmax(0,1fr) 46px;
    gap:10px;
    padding:15px 12px;
  }
  body[data-shell-family="studio"] .speaker{
    position:static;
    min-width:0;
    width:auto;
    height:auto;
    padding:0 10px 0 0;
  }
  body[data-shell-family="studio"] .speaker-avatar{
    position:static;
    width:56px;
    height:56px;
  }
  body[data-shell-family="studio"] .speaker strong{font-size:15px}
  body[data-shell-family="studio"] .dialogue-copy{padding-top:2px;padding-bottom:48px}
  body[data-shell-family="studio"] .dialogue-text{font-size:13px;line-height:1.7}
  body[data-shell-family="studio"] .next-btn{position:static;width:44px;height:44px}
  body[data-shell-family="l01"] .sprite-wrap{
    left:-10%;
    bottom:150px;
    height:60vh;
    max-height:620px;
  }
  body[data-shell-family="l01"] .dialogue{
    left:0;
    right:0;
    bottom:0;
    height:176px;
    padding:15px 58px 14px 112px;
  }
  body[data-shell-family="l01"] .speaker{
    left:12px;
    top:12px;
    bottom:12px;
    width:84px;
    height:auto;
    padding-right:10px;
  }
  body[data-shell-family="l01"] .speaker img{width:52px;height:52px}
  body[data-shell-family="l01"] .speaker b{font-size:15px}
  body[data-shell-family="l01"] .dialogue-text{font-size:15px;line-height:1.65;max-height:96px;overflow:auto}
  body[data-shell-family="studio"] .panel-actions :where(.btn,.primary,.ghost){min-height:44px}
}

@media(prefers-reduced-motion:reduce){
  body[data-ui-standard="l01"] *,
  body[data-ui-standard="l01"] *::before,
  body[data-ui-standard="l01"] *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}
