/* ============================================================
   语文潮 · 问课 —— 课件模式 / 专注模式 通用外壳 V3
   顶栏 + 底栏 + 封面 + 学情诊断 + 扩展动作位（actions）
   设计约束（经布局审核）：
   1) 自带 box-sizing 重置，不依赖宿主 reset
   2) 安全区（刘海/Home 条）自适应，底栏用 min-height 容纳大字号
   3) 左侧留白变量 --lc-inset-l，兼容宿主 274px 抽屉
   4) 浮层独立锁滚（.lc-lock），平时不锁
   5) 全部触控目标 ≥40px（伪元素扩热区），键盘 :focus-visible 可见
   ============================================================ */
:root{
  --lc-gold:#c9a84c; --lc-gold-deep:#b8902f; --lc-moss:#5f7a4e;
  --lc-ink:#1a1f27; --lc-ink-2:#242b36;
  --lc-line:rgba(239,228,203,.14);
  --lc-text:rgba(249,245,237,.94);
  --lc-text-dim:rgba(249,245,237,.68);   /* 审核：4.6:1 → 6.1:1 */
  --lc-paper:#f7f4ee;
  --lc-safe-t:env(safe-area-inset-top,0px);
  --lc-safe-b:env(safe-area-inset-bottom,0px);
  --lc-top-h:52px; --lc-bar-h:60px;
  --lc-inset-l:0px;
}

/* 局部 box-sizing（不用 * 以免污染宿主） */
.lc-top, .lc-top *, .lc-bar, .lc-bar *, .lc-cover, .lc-cover *,
.lc-diag, .lc-diag *{ box-sizing:border-box; }

/* ================= 顶栏 ================= */
.lc-top{
  position:fixed; top:0; left:var(--lc-inset-l); right:0; z-index:8900;
  height:calc(var(--lc-top-h) + var(--lc-safe-t));
  padding:0 14px; padding-top:var(--lc-safe-t);
  display:flex; align-items:center; gap:14px;
  background:linear-gradient(180deg,#212833,#171c23);
  border-bottom:1px solid var(--lc-line); color:var(--lc-text);
  font-family:"PingFang SC","Noto Sans SC","Microsoft YaHei",system-ui,sans-serif;
  box-shadow:0 2px 12px rgba(12,16,22,.28);
}
.lc-brand{display:flex; align-items:center; gap:8px; flex:0 0 auto; text-decoration:none; color:inherit}
.lc-mark{width:26px; height:26px; border-radius:8px; display:grid; place-items:center;
  background:linear-gradient(140deg,var(--lc-gold),var(--lc-gold-deep));
  color:#241c05; font-weight:800; font-size:15px}
/* 站标图（套卷通用模板：语文桥图标代替「潮」字，不写品牌名） */
.lc-logo{width:26px; height:26px; border-radius:50%; display:block; object-fit:cover;
  background:#fff; box-shadow:0 1px 4px rgba(0,0,0,.3)}
.lc-brand.lc-brand-icon{padding-right:2px}
.lc-brand-name{font-size:13.5px; font-weight:700; letter-spacing:.06em; white-space:nowrap}
.lc-brand-name .lc-dot{opacity:.5; margin:0 3px}
.lc-bc{display:flex; align-items:center; gap:7px; flex:0 1 auto; min-width:0; overflow:hidden;
  font-size:12.5px; color:var(--lc-text-dim); white-space:nowrap}
.lc-bc a{color:var(--lc-text-dim); text-decoration:none; transition:color .15s}
.lc-bc a:hover{color:var(--lc-gold)}
.lc-bc .lc-bc-cur{color:var(--lc-gold); font-weight:600; min-width:0;
  overflow:hidden; text-overflow:ellipsis}
.lc-bc .lc-bc-sep{opacity:.4; flex:0 0 auto}
.lc-tools{margin-left:auto; display:flex; align-items:center; gap:6px; flex:0 0 auto}
.lc-pager{display:flex; align-items:center; gap:2px; padding:2px;
  border:1px solid var(--lc-line); border-radius:999px; background:rgba(255,255,255,.04)}
.lc-pg{width:26px; height:26px; border:none; border-radius:50%; cursor:pointer; background:transparent;
  color:var(--lc-text); font-size:17px; line-height:1; display:grid; place-items:center;
  position:relative; transition:background .15s,color .15s}
.lc-pg:hover:not(:disabled){background:var(--lc-gold); color:#241c05}
.lc-pg:disabled{opacity:.28; cursor:default}
.lc-pg-ind{min-width:62px; text-align:center; font-size:12.5px; font-variant-numeric:tabular-nums;
  letter-spacing:.04em; color:var(--lc-text)}
.lc-btn{font:inherit; font-size:12.5px; cursor:pointer; padding:0 11px; height:30px;
  display:inline-flex; align-items:center; gap:5px; border-radius:8px;
  border:1px solid var(--lc-line); background:rgba(255,255,255,.05); color:var(--lc-text);
  white-space:nowrap; flex:0 0 auto; position:relative;   /* 2026-10-29 r47：热区 ::after 的定位祖先，缺了它会盖满整条固定栏 */
  transition:border-color .15s,background .15s,color .15s}
.lc-btn:disabled{opacity:.35; cursor:default}
.lc-btn:hover{border-color:var(--lc-gold); color:var(--lc-gold)}
.lc-btn.is-on{background:var(--lc-gold); border-color:var(--lc-gold); color:#241c05; font-weight:700}
.lc-exit:hover{border-color:#d1663f; color:#e8926c}
.lc-fs{width:34px; justify-content:center; padding:0}
.lc-btn[data-act="full"]{min-width:74px; justify-content:center}   /* 全屏 / 退出全屏 */
.lc-act{border-color:rgba(201,168,76,.34); color:#e2cd93}

/* ================= 底栏 ================= */
.lc-bar{
  position:fixed; left:var(--lc-inset-l); right:0; bottom:0; z-index:8900;
  min-height:calc(var(--lc-bar-h) + var(--lc-safe-b));
  padding-bottom:var(--lc-safe-b);
  background:linear-gradient(0deg,#20262f,#262e39);
  border-top:1px solid var(--lc-line); color:var(--lc-text);
  font-family:"PingFang SC","Noto Sans SC","Microsoft YaHei",system-ui,sans-serif;
  box-shadow:0 -2px 14px rgba(12,16,22,.3);
}
.lc-progress{position:absolute; top:0; left:0; right:0; height:3px; background:rgba(255,255,255,.07)}
.lc-progress > i{display:block; height:100%; width:0; border-radius:0 2px 2px 0;
  background:linear-gradient(90deg,var(--lc-gold-deep),var(--lc-gold)); transition:width .25s ease}
.lc-bar-inner{display:flex; align-items:center; gap:8px;
  min-height:var(--lc-bar-h); padding:0 12px; overflow:hidden}
.lc-arrow{width:30px; height:30px; flex:0 0 auto; border-radius:8px; cursor:pointer;
  border:1px solid var(--lc-line); background:rgba(255,255,255,.05); color:var(--lc-text);
  font-size:18px; line-height:1; display:grid; place-items:center;
  position:relative; transition:all .15s}
.lc-arrow:hover:not(:disabled){background:var(--lc-gold); color:#241c05; border-color:var(--lc-gold)}
.lc-arrow:disabled{opacity:.28; cursor:default}
.lc-tabs{flex:1 1 auto; display:flex; align-items:center; gap:6px; min-width:0;
  overflow-x:auto; overflow-y:hidden; scroll-behavior:smooth;
  scrollbar-width:thin; padding:0 2px}
.lc-tabs::-webkit-scrollbar{height:4px}
.lc-tabs::-webkit-scrollbar-thumb{background:rgba(239,228,203,.22); border-radius:2px}
.lc-tab{flex:0 0 auto; font:inherit; font-size:12.5px; height:30px; padding:0 13px; cursor:pointer;
  border-radius:8px; border:1px solid transparent; background:rgba(255,255,255,.06);
  color:var(--lc-text-dim); white-space:nowrap; position:relative; transition:all .15s}
.lc-tab:hover{color:var(--lc-text); background:rgba(255,255,255,.11)}
.lc-tab.is-active{background:var(--lc-gold); border-color:var(--lc-gold); color:#241c05; font-weight:700}
.lc-tab .lc-tab-n{margin-left:5px; font-size:11.5px; opacity:.85}
.lc-tab.is-active .lc-tab-n{opacity:.9}
.lc-tab .lc-tab-dot{position:absolute; top:4px; right:5px; width:5px; height:5px; border-radius:50%;
  background:var(--lc-moss); box-shadow:0 0 0 2px rgba(95,122,78,.25)}
.lc-tab.lc-tab-cover, .lc-tab.lc-tab-diag{background:rgba(201,168,76,.12); border-color:rgba(201,168,76,.3); color:#e2cd93}
.lc-tab.lc-tab-cover.is-active, .lc-tab.lc-tab-diag.is-active{background:var(--lc-gold); color:#241c05}
.lc-nums{flex:1 1 auto; display:flex; align-items:center; gap:5px; min-width:0; overflow-x:auto;
  scroll-behavior:smooth; scrollbar-width:thin; padding:0 2px}
.lc-nums::-webkit-scrollbar{height:4px}
.lc-nums::-webkit-scrollbar-thumb{background:rgba(239,228,203,.22); border-radius:2px}
.lc-num{flex:0 0 auto; min-width:30px; height:30px; padding:0 6px; cursor:pointer; font:inherit;
  font-size:12px; border-radius:8px; border:1px solid var(--lc-line);
  background:rgba(255,255,255,.05); color:var(--lc-text-dim); position:relative;
  display:grid; place-items:center; transition:all .15s; font-variant-numeric:tabular-nums}
.lc-num:hover{color:var(--lc-text); border-color:var(--lc-gold)}
.lc-num.is-active{background:var(--lc-gold); border-color:var(--lc-gold); color:#241c05; font-weight:700}
.lc-num.is-done{border-color:rgba(122,154,106,.85); color:#bcd6ad}
.lc-num.is-right{background:rgba(95,122,78,.30); border-color:var(--lc-moss); color:#d3e8c6}
.lc-num.is-wrong{background:rgba(191,86,66,.24); border-color:#c26a5c; color:#f6c2b6}
.lc-meta{flex:0 0 auto; display:flex; align-items:center; gap:10px; font-size:12px;
  color:var(--lc-text-dim); padding-left:8px; border-left:1px solid var(--lc-line)}
.lc-meta b{color:var(--lc-gold); font-weight:700; font-variant-numeric:tabular-nums}
.lc-mode{display:flex; border:1px solid var(--lc-line); border-radius:8px; overflow:hidden}
.lc-mode button{font:inherit; font-size:11.5px; padding:0 8px; height:26px; cursor:pointer;
  border:none; background:transparent; color:var(--lc-text-dim); position:relative}
.lc-mode button.is-on{background:rgba(255,255,255,.16); color:var(--lc-text)}

/* 触控热区扩展（视觉尺寸不变，命中区 ≥40px）
   2026-10-29 r47：只向上下扩，左右各扩 2px —— 原来 inset:-7px 会让相邻按钮（gap 6px）
   的热区互相压住，按钮边缘 8px 内的点击落到右边那个按钮上。 */
.lc-pg::after, .lc-arrow::after, .lc-tab::after, .lc-num::after,
.lc-mode button::after, .lc-btn::after{
  content:''; position:absolute; inset:-7px -2px;
}

/* ================= 扩展动作按钮（宿主注入） ================= */
.lc-actions{display:flex; align-items:center; gap:6px; flex:0 0 auto}

/* ================= 封面页 ================= */
.lc-cover{
  position:fixed; inset:calc(var(--lc-top-h) + var(--lc-safe-t)) var(--lc-inset-l)
          calc(var(--lc-bar-h) + var(--lc-safe-b)) 0;
  z-index:8800; display:none; overflow:auto; overscroll-behavior:contain;
  background:radial-gradient(120% 90% at 50% 0%,#2b3442 0%,#1a1f27 62%,#151a21 100%);
  color:var(--lc-text);
  font-family:"PingFang SC","Noto Sans SC","Microsoft YaHei",system-ui,sans-serif;
}
.lc-cover.is-on{display:block}
.lc-cover-inner{min-height:100%; display:flex; flex-direction:column;
  justify-content:center; align-items:center; text-align:center; padding:40px 24px}
.lc-cover-kicker{font-size:12px; letter-spacing:.42em; color:var(--lc-gold); margin-bottom:22px}
.lc-cover h1{font-family:"Noto Serif SC","Songti SC",Georgia,serif; font-size:clamp(26px,3.6vw,40px);
  font-weight:700; letter-spacing:.01em; line-height:1.35; margin-bottom:14px}
.lc-cover-sub{font-size:13.5px; color:var(--lc-text-dim); margin-bottom:34px}
.lc-cover-stats{display:flex; justify-content:center; flex-wrap:wrap; margin-bottom:38px}
.lc-cover-stats > div{padding:0 26px; border-left:1px solid var(--lc-line); text-align:center}
.lc-cover-stats > div:first-child{border-left:none}
.lc-cover-stats b{display:block; font-size:26px; color:var(--lc-gold); font-weight:800;
  font-variant-numeric:tabular-nums; line-height:1.3}
.lc-cover-stats span{font-size:11.5px; letter-spacing:.16em; color:var(--lc-text-dim)}
.lc-cover-btn{font:inherit; font-size:15px; font-weight:700; letter-spacing:.24em; cursor:pointer;
  padding:13px 42px; border-radius:999px; border:none; position:relative;
  background:linear-gradient(140deg,var(--lc-gold),var(--lc-gold-deep)); color:#241c05;
  box-shadow:0 8px 24px rgba(201,168,76,.28); transition:transform .15s,box-shadow .15s}
.lc-cover-btn:hover{transform:translateY(-1px); box-shadow:0 10px 28px rgba(201,168,76,.36)}

/* ================= 学情诊断 ================= */
.lc-diag{
  position:fixed; inset:calc(var(--lc-top-h) + var(--lc-safe-t)) var(--lc-inset-l)
          calc(var(--lc-bar-h) + var(--lc-safe-b)) 0;
  z-index:8800; display:none; overflow:auto; overscroll-behavior:contain;
  background:var(--lc-paper); color:#2c2c2c;
  font-family:"PingFang SC","Noto Sans SC","Microsoft YaHei",system-ui,sans-serif;
}
.lc-diag.is-on{display:block}
.lc-diag-inner{max-width:1040px; margin:0 auto; padding:32px 26px 60px}
.lc-diag-head{display:flex; align-items:baseline; gap:12px; margin-bottom:22px; flex-wrap:wrap}
.lc-diag-head h2{font-family:"Noto Serif SC","Songti SC",serif; font-size:22px; color:#2c2c2c}
.lc-diag-head span{font-size:12.5px; color:#6f6045}
.lc-diag-kpis{display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:12px; margin-bottom:24px}
.lc-kpi{background:#fffdf8; border:1px solid #e6dfd0; border-radius:12px; padding:16px 18px}
.lc-kpi b{display:block; font-size:24px; font-weight:800; color:#8a6a1e; font-variant-numeric:tabular-nums}
.lc-kpi span{font-size:12px; color:#6b6355}
.lc-diag-table{background:#fffdf8; border:1px solid #e6dfd0; border-radius:12px; overflow-x:auto}
.lc-diag-row{display:grid; grid-template-columns:minmax(96px,1.6fr) 52px 52px 52px 88px;
  gap:8px; align-items:center; padding:11px 16px;
  border-top:1px solid #eee7d8; font-size:13px; min-width:430px}
.lc-diag-row:first-child{border-top:none; background:#faf6ec; font-size:12px; color:#6b6355; letter-spacing:.06em}
.lc-diag-row .lc-bar-mini{height:6px; border-radius:3px; background:#eee7d8; overflow:hidden}
.lc-diag-row .lc-bar-mini > i{display:block; height:100%; background:linear-gradient(90deg,#b8902f,#c9a84c)}
.lc-diag-empty{padding:34px; text-align:center; color:#6f6045; font-size:13px}

/* ================= 键盘焦点 ================= */
.lc-top :focus-visible, .lc-bar :focus-visible,
.lc-cover :focus-visible, .lc-diag :focus-visible{
  outline:2px solid #fff; outline-offset:2px; border-radius:10px;
}

/* ================= 宿主让位 / 锁滚 ================= */
/* 宿主常写 html,body{min-width:1280px}；课件模式须能在任意屏放映 */
html.lc-on{ min-width:0 !important; }
body.lc-on.lc-pad{
  padding-top:calc(var(--lc-top-h) + var(--lc-safe-t)) !important;
  padding-bottom:calc(var(--lc-bar-h) + var(--lc-safe-b)) !important;
}
html.lc-lock, body.lc-lock{ overflow:hidden !important; overscroll-behavior:contain }

/* ================= 响应式 ================= */
/* 宿主可选用：给内部滚动区加渐隐，避免文字被硬切 */
.lc-fade-bottom{
  -webkit-mask-image:linear-gradient(180deg,#000 calc(100% - 26px),transparent);
          mask-image:linear-gradient(180deg,#000 calc(100% - 26px),transparent);
}
@media (max-width:1100px){ .lc-bc{max-width:38vw} }
@media (max-width:820px){
  .lc-bc{display:none}
  .lc-brand-name{display:none}
  .lc-top{gap:8px; padding:0 8px}
}
@media (max-width:560px){
  .lc-fs{display:none}                 /* 字号按钮在小屏收起，避免溢出 */
  .lc-pg-ind{min-width:auto; font-size:11.5px}
  .lc-btn{padding:0 8px}
  .lc-btn-txt{display:none}            /* 只留图标 */
  .lc-arrow{width:34px; height:34px}
  .lc-num{min-width:34px; height:34px}
  .lc-mode{display:none}               /* 大题/题号切换在窄屏收起 */
  .lc-pen span{display:none}
  .lc-meta{border-left:none; padding-left:0; gap:6px}
  .lc-count{font-size:11px}
}
@media (max-width:400px){
  .lc-pager{display:none}              /* 底栏已有翻页 */
  .lc-diag-row{grid-template-columns:1fr 34px 34px 34px}
  .lc-diag-row > div:last-child{grid-column:1/-1}
}
@media (prefers-reduced-motion:reduce){
  .lc-tabs, .lc-nums{scroll-behavior:auto}
  .lc-progress > i, .lc-cover-btn{transition:none}
}

/* ================= 左右侧翻题（2026-10-29） ================= */
/* 形态与 /css/yuanmao-lb.css 的 .ym-fnav 同款：46px 圆角块、深墨底、金线边、
   默认 .35 透明、悬停提亮；左右各一枚，垂直居中。只在专注模式挂载时存在。 */
.lc-sided{
  position:fixed; inset:0; z-index:8700; pointer-events:none;
}
.lc-sided .lc-side{
  position:absolute; top:50%; transform:translateY(-50%);
  width:46px; height:46px; display:flex; align-items:center; justify-content:center;
  padding:0; color:#e9e2cf; background:rgba(24,36,30,.38);
  border:1px solid rgba(201,168,76,.28); border-radius:12px;
  cursor:pointer; opacity:.62; pointer-events:auto;
  box-shadow:0 2px 12px rgba(20,26,22,.14);
  transition:opacity .45s ease, background .2s ease, border-color .2s ease;
  backdrop-filter:blur(3px); -webkit-backdrop-filter:blur(3px);
}
.lc-sided .lc-side svg{ width:20px; height:20px; }
.lc-sided .lc-side:hover{ opacity:1; background:rgba(201,168,76,.30); border-color:rgba(201,168,76,.75); }
.lc-sided .lc-side:focus-visible{ opacity:1; outline:2px solid #fff; outline-offset:2px; }
/* 首屏「上一题」不可用：不能淡到看不见，否则用户以为没有这个按钮 */
.lc-sided .lc-side[disabled]{ opacity:.30; cursor:default; }
.lc-sided .lc-side[disabled]:hover{ background:rgba(24,36,30,.38); border-color:rgba(201,168,76,.28); }
.lc-sided .lc-side-prev{ left:10px; }
.lc-sided .lc-side-next{ right:10px; }

@media (max-width:720px){
  .lc-sided .lc-side{ width:38px; height:38px; }
  .lc-sided .lc-side-prev{ left:6px; }
  .lc-sided .lc-side-next{ right:6px; }
}
@media (hover:none){
  .lc-sided .lc-side{ opacity:.7; }
}


/* ============================================================
   宣纸主题 —— 2026-11-01
   与工作台左下角「切换主题」同源：
   同一个 localStorage key（yw_skin）、同一个 body 类（yq-skin-paper）、
   同一套色值（工作台侧栏宣纸系 #fbf7ec / #f2ecdd / #2f3a2f）。
   只在 body 带 yq-skin-paper 时生效，墨绿（默认）完全不受影响。
   ============================================================ */
body.yq-skin-paper{
  --lc-line: rgba(47,58,47,.18);
  --lc-text: #2f3a2f;
  --lc-text-dim: rgba(47,58,47,.64);
  --lc-paper: #f7f2e4;
}
body.yq-skin-paper.cw-present .lc-top{
  background: linear-gradient(180deg,#fbf7ec,#f1e9d8);
  border-bottom-color: rgba(47,58,47,.16);
  box-shadow: 0 2px 12px rgba(47,58,47,.10);
}
body.yq-skin-paper.cw-present .lc-bar{
  background: linear-gradient(0deg,#f4eedf,#fbf7ec);
  border-top-color: rgba(47,58,47,.16);
  box-shadow: 0 -2px 14px rgba(47,58,47,.10);
}
body.yq-skin-paper.cw-present .lc-btn{
  border-color: rgba(47,58,47,.24);
  background: rgba(255,255,255,.58);
  color: #2f3a2f;
}
body.yq-skin-paper.cw-present .lc-btn:hover:not(:disabled){
  border-color: #7d8a6f;
  background: #fff;
  color: #223024;
}
body.yq-skin-paper.cw-present .lc-btn.is-on{
  background: #2f6b4f;
  border-color: #2f6b4f;
  color: #fff;
}
body.yq-skin-paper.cw-present .lc-tab{
  background: rgba(255,255,255,.58);
  border-color: rgba(47,58,47,.16);
  color: #2f3a2f;
}
body.yq-skin-paper.cw-present .lc-tab.is-on{
  background: #2f6b4f;
  border-color: #2f6b4f;
  color: #fff;
}
body.yq-skin-paper.cw-present .lc-pg:hover:not(:disabled){
  background: rgba(47,58,47,.12);
  color: #2f3a2f;
}
body.yq-skin-paper.cw-present .lc-tabs::-webkit-scrollbar-thumb{
  background: rgba(47,58,47,.22);
}
body.yq-skin-paper.cw-present .lc-mode button.is-on{
  background: rgba(47,58,47,.14);
}
body.yq-skin-paper.cw-present .lc-cover,
body.yq-skin-paper.cw-present .lc-diag{
  background: #fbf7ec;
  color: #2f3a2f;
}
body.yq-skin-paper.cw-present .lc-diag-head h2{ color: #2f3a2f; }