/* 学生端新外观（UI2）· 主题 A 漫画 / C 简约 / D 录音棚（第 4 步，2026-09-30）· 归 Claude Code（课程页 / 上课页 / 选老师 / 离开卡）。
   B 清新是默认（变量在 ui2-theme.css）。这里每套只改变量 + 少量差异；挂在 html[data-ui="2"][data-theme="a|c|d"] 下。
   来源：产品会话 样稿\themes.css（2026-09-30 巡检后的版本；class 名是样稿的，对着网站真实 DOM 写）；截图 截图\A*.png、C*.png、D*.png、截图\iPad\。
   名字（负责人 2026-09-29「你定就行」）：A 漫画、B 清新（默认）、C 简约、D 录音棚。练习 / 注册 / 入口 / 设置抽屉的主题差异归 Codex（ui2-themes-lesson.css、ui2-themes-entry.css）。 */

/* ================= A · 漫画：黑描边 + 硬阴影（比旧外观细：3→2、6→3），米白底 + 珊瑚，黄只标「当前 / 新课」 ================= */
html[data-ui="2"][data-theme="a"]{
  --bg:#FFFBF2; --surface:#fff; --line:#1F1F24; --bw:2px; --bc:#1F1F24; --r:14px; --r-sm:10px;
  --sh:3px 3px 0 #1F1F24; --sh-press:1px 1px 0 #1F1F24;
  --accent:#FF7F66; --on-accent:#1F1F24; --accent-ink:#B8452F; --accent-soft:#FFE3DA; --hi:#FFD15C;
  --soft:#FFF8E6; --field:#fff;
  --t-bub:#fff; --s-bub:#FFE3DA; --s-ink:#1F1F24; --bar:#FFFBF2;
  --prog-off:#fff; --prog-done:#1F1F24; --sys-bg:#FFF8E6; --ex-bg:#FFF8E6;
}
html[data-ui="2"][data-theme="a"] body{background:#FFFBF2 radial-gradient(#EFE5CF 1.2px,transparent 1.5px) 0 0/24px 24px;}
html[data-ui="2"][data-theme="a"] .gridp .g-top,html[data-ui="2"][data-theme="a"] .classp .lv-top{box-shadow:none;border-bottom:2px solid var(--line);-webkit-backdrop-filter:none;backdrop-filter:none;}
html[data-ui="2"][data-theme="a"] .classp .cl-scene{box-shadow:none;border-bottom:2px solid var(--line);}
html[data-ui="2"][data-theme="a"] .classp .prog i{height:8px;border:2px solid var(--line);border-radius:5px;}
html[data-ui="2"][data-theme="a"] .classp .b{border:2px solid var(--line);}
html[data-ui="2"][data-theme="a"] .classp .b.t{box-shadow:2px 2px 0 var(--line);}
html[data-ui="2"][data-theme="a"] .classp .b.card{border-style:dashed;background:#FFF8E6;box-shadow:none;}
html[data-ui="2"][data-theme="a"] .classp .b.sys{border:0;}
html[data-ui="2"][data-theme="a"] .classp .cl-input{box-shadow:none;border-top:2px solid var(--line);}
html[data-ui="2"][data-theme="a"] .classp .cl-input textarea{border:2px solid var(--line);border-radius:14px;}
html[data-ui="2"][data-theme="a"] .classp .cl-input .lv-btn{border-radius:14px;box-shadow:2px 2px 0 var(--line);}
html[data-ui="2"][data-theme="a"] .classp .cl-ref{border:2px solid var(--line);}
html[data-ui="2"][data-theme="a"] .classp .cl-learn::before{border:2px solid var(--line);background:var(--hi);}
html[data-ui="2"][data-theme="a"] .classp .cp-fig{border:2px solid var(--line);}
html[data-ui="2"][data-theme="a"] .classp .tav{border:2px solid var(--line);}
html[data-ui="2"][data-theme="a"] .pill{border:2px solid var(--line);background:#fff;color:var(--ink);}
html[data-ui="2"][data-theme="a"] .pill.on{background:#fff;color:var(--ink);} html[data-ui="2"][data-theme="a"] .pill.sub{background:var(--hi);}
html[data-ui="2"][data-theme="a"] .pill:not(.on):not(.sub):not(.doing){border-style:dashed;opacity:1;}
html[data-ui="2"][data-theme="a"] .lc.new .lc-date{color:var(--ink);}
html[data-ui="2"][data-theme="a"] .lc.resume .rs-ico,html[data-ui="2"][data-theme="a"] .split .bd .badge,html[data-ui="2"][data-theme="a"] .tpic,html[data-ui="2"][data-theme="a"] .wb-ico{border:2px solid var(--line);}
html[data-ui="2"][data-theme="a"] .wb{background:var(--hi);}
html[data-ui="2"][data-theme="a"] .split .half{border:2px solid var(--line);background:#fff;}
html[data-ui="2"][data-theme="a"] .cp-card.on{outline:0;background:var(--accent-soft);}
html[data-ui="2"][data-theme="a"] .lv-card.leave{border:2px solid var(--line);border-bottom:0;}
html[data-ui="2"][data-theme="a"][data-layout="pad"] .lv-card.leave,html[data-ui="2"][data-theme="a"][data-layout="pad-wide"] .lv-card.leave{border-bottom:2px solid var(--line);}
html[data-ui="2"][data-theme="a"] .seg b.on{background:var(--accent-soft);box-shadow:none;}

/* ================= C · 简约：白底细线、没有阴影；主按钮深墨色；珊瑚只留 Logo 的「Ah」和未读小红点；系统字体 ================= */
html[data-ui="2"][data-theme="c"]{
  --bg:#fff; --surface:#fff; --line:#E9E9EC; --bw:1px; --bc:#E9E9EC; --r:12px; --r-sm:10px; --sh:none; --sh-press:none;
  --accent:#1F1F24; --on-accent:#fff; --accent-ink:#1F1F24; --accent-soft:#F4F4F6; --hi:#1F1F24; --ok:#1F1F24; --ok-soft:#F4F4F6;
  --soft:#F7F7F9; --field:#F4F4F6;
  --t-bub:#F2F2F5; --s-bub:#1F1F24; --s-ink:#fff; --bar:#fff;
  --prog-off:#E9E9EC; --prog-done:#1F1F24; --prog-cur:#8E8E96; --sys-bg:#F4F4F6; --ex-bg:#fff; --ex-line:#1F1F24;
  --head:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;
  --body:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;
}
html[data-ui="2"][data-theme="c"] h1,html[data-ui="2"][data-theme="c"] h2,html[data-ui="2"][data-theme="c"] h3,
html[data-ui="2"][data-theme="c"] .lc-title,html[data-ui="2"][data-theme="c"] .myt h2,html[data-ui="2"][data-theme="c"] .wb-t,html[data-ui="2"][data-theme="c"] .cp-card b,
html[data-ui="2"][data-theme="c"] .classp .cl-topic b,html[data-ui="2"][data-theme="c"] .lv-btn{font-weight:600;}
html[data-ui="2"][data-theme="c"] .gridp .g-top,html[data-ui="2"][data-theme="c"] .classp .lv-top{box-shadow:none;border-bottom:1px solid var(--line);-webkit-backdrop-filter:none;backdrop-filter:none;}
html[data-ui="2"][data-theme="c"] .classp .cl-scene{box-shadow:none;border-bottom:1px solid var(--line);}
html[data-ui="2"][data-theme="c"] .classp .prog i{height:3px;}
html[data-ui="2"][data-theme="c"] .classp .b.t{box-shadow:none;}
html[data-ui="2"][data-theme="c"] .classp .b.card{border:1px solid var(--line);box-shadow:none;}
html[data-ui="2"][data-theme="c"] .classp .b.s .ex{background:rgba(255,255,255,.12);border-left-color:#fff;color:#fff;}
html[data-ui="2"][data-theme="c"] .classp .cl-input{box-shadow:none;border-top:1px solid var(--line);}
html[data-ui="2"][data-theme="c"] .pill{background:#F4F4F6;color:var(--mute);font-weight:600;} html[data-ui="2"][data-theme="c"] .pill.on{color:var(--ink);}
html[data-ui="2"][data-theme="c"] .pill.sub{background:#1F1F24;color:#fff;}
html[data-ui="2"][data-theme="c"] .lc.new .lc-date{color:var(--ink);}
/* 课程列表：手机上一张卡里细线隔开；iPad 两三列时还是一张张卡（产品 ipad.css） */
html[data-ui="2"][data-theme="c"][data-layout="phone"] .cards{gap:0;border:1px solid var(--line);border-radius:12px;overflow:hidden;}
html[data-ui="2"][data-theme="c"][data-layout="phone"] .cards .lc{border:0;border-radius:0;box-shadow:none;}
html[data-ui="2"][data-theme="c"][data-layout="phone"] .cards .lc + .lc,html[data-ui="2"][data-theme="c"][data-layout="phone"] .cards .lc + .split,html[data-ui="2"][data-theme="c"][data-layout="phone"] .cards .split + .lc{border-top:1px solid var(--line);}
html[data-ui="2"][data-theme="c"][data-layout="phone"] .cards .split{border:0;border-radius:0;box-shadow:none;}
html[data-ui="2"][data-theme="c"] .split .half{background:#F7F7F9;}
html[data-ui="2"][data-theme="c"] .cp-card.on{outline:1px solid #1F1F24;}
html[data-ui="2"][data-theme="c"] .lv-btn.go{box-shadow:none;}
html[data-ui="2"][data-theme="c"] .mailbtn .dot{background:#FF7F66;}        /* 未读小红点：珊瑚保留 */

/* ================= D · 录音棚：吸音棉灰蓝底 + 调音台深蓝顶栏 + 窄体大写标题；红只给 ON AIR 和录音按钮，黄只标「当前 / 新课」 ================= */
html[data-ui="2"][data-theme="d"]{
  --bg:#EDF1F6; --surface:#fff; --ink:#1B2A44; --mute:#5E6A80; --line:#D5DCE6; --bw:0px; --bc:transparent; --r:16px; --r-sm:10px;
  --sh:0 1px 2px rgba(27,42,68,.06),0 6px 16px rgba(27,42,68,.07); --sh-press:0 1px 2px rgba(27,42,68,.1);
  --accent:#1B2A44; --on-accent:#fff; --accent-ink:#1B2A44; --accent-soft:#E3E9F2; --hi:#F0B23A; --ok:#2FA36B; --ok-soft:#E1F2E8;
  --soft:#F2F5F9; --field:#EDF1F6; --rec:#D63A26;
  --t-bub:#fff; --s-bub:#1B2A44; --s-ink:#fff; --bar:#1B2A44; --bar-ink:#fff; --bar-mute:#9FB0C8; --chip-bg:#2C3E5C;
  --prog-off:#2C3E5C; --prog-done:#8FA3BF; --prog-cur:#F0B23A; --sys-bg:rgba(27,42,68,.06); --ex-bg:#F7F4EA; --ex-line:#F0B23A;
  --head:"Barlow Condensed","Nunito Sans","PingFang SC","Microsoft YaHei",sans-serif;
  --body:"Nunito Sans","PingFang SC","Microsoft YaHei",sans-serif;
}
html[data-ui="2"][data-theme="d"] body{background:#EDF1F6 repeating-linear-gradient(135deg,rgba(27,42,68,.025) 0 10px,transparent 10px 20px);}
html[data-ui="2"][data-theme="d"] .gridp .g-top,html[data-ui="2"][data-theme="d"] .classp .lv-top{box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none;color:#fff;}
html[data-ui="2"][data-theme="d"] .gridp .g-top .brand{color:#fff;}
html[data-ui="2"][data-theme="d"] .mailbtn .dot{box-shadow:0 0 0 2px #1B2A44;border-color:#1B2A44;}
html[data-ui="2"][data-theme="d"] .gridp .g-head h1{font:700 30px/1.15 var(--head);letter-spacing:.02em;}
html[data-ui="2"][data-theme="d"] .lc-title{font-size:21px;}
html[data-ui="2"][data-theme="d"] .lc.new .lc-date{color:#B07A12;}
html[data-ui="2"][data-theme="d"] .lc.resume .rs-ico{background:#D63A26;color:#fff;}
html[data-ui="2"][data-theme="d"] .wb-ico{background:#1B2A44;color:#fff;}
html[data-ui="2"][data-theme="d"] .split .wait .bd .badge,html[data-ui="2"][data-theme="d"] .split .prep .bd .badge{background:#D5DCE6;color:#5E6A80;}
html[data-ui="2"][data-theme="d"] .pill{background:#E3E9F2;color:#1B2A44;} html[data-ui="2"][data-theme="d"] .pill.on{background:#E1F2E8;color:#1F6B45;}
html[data-ui="2"][data-theme="d"] .pill.sub{background:#F0B23A;color:#1B2A44;}
/* 上课页：进度条长在调音台上；题卡顶上一道黄线；学到的小牌深蓝 */
html[data-ui="2"][data-theme="d"] .classp .cl-topic b{font:700 20px/1.2 var(--head);letter-spacing:.03em;text-transform:uppercase;}
html[data-ui="2"][data-theme="d"] .classp .cl-scene{background:var(--bar);box-shadow:none;}
html[data-ui="2"][data-theme="d"] .classp .cl-learn{color:#fff;}
html[data-ui="2"][data-theme="d"] .classp .b.card{border-top:4px solid #F0B23A;}
html[data-ui="2"][data-theme="d"] .classp .b.t{box-shadow:0 1px 2px rgba(27,42,68,.08);}
html[data-ui="2"][data-theme="d"] .classp .b.s .ex{background:rgba(255,255,255,.1);border-left-color:#F0B23A;color:#fff;}
html[data-ui="2"][data-theme="d"] .classp .cl-input{box-shadow:0 -1px 0 #D5DCE6;}
html[data-ui="2"][data-theme="d"] .classp .cl-side h3{font-family:var(--head);text-transform:uppercase;letter-spacing:.03em;}
html[data-ui="2"][data-theme="d"] .cp-card.on{outline:3px solid #1B2A44;}
html[data-ui="2"][data-theme="d"] .cp-say{background:#1B2A44;} html[data-ui="2"][data-theme="d"] .cp-say::after{border-top-color:#1B2A44;}
html[data-ui="2"][data-theme="d"] .leave .leave-note{background:#E1F2E8;}
html[data-ui="2"][data-theme="d"] .lv-btn,html[data-ui="2"][data-theme="d"] .leave h2,html[data-ui="2"][data-theme="d"] .cp-pick h2{font-family:var(--head);letter-spacing:.02em;}
