/* ============================================================
   知识付费（用户端）：列表 / 详情 / 播放器 / 报名
   颜色与全站一致：主色 var(--accent,var(--v-600))
   ============================================================ */

/* ---------- 列表页 ---------- */
.course-seg{display:grid;grid-template-columns:1fr 1fr;gap:6px;background:var(--n-100);border-radius:14px;padding:6px;margin:4px 14px 12px}
.course-seg-btn{border:none;background:transparent;border-radius:10px;padding:10px;font-size:14px;font-weight:700;color:var(--n-500);cursor:pointer;transition:.16s}
.course-seg-btn.active{background:var(--c-surface);color:var(--accent,var(--v-600));box-shadow:0 2px 8px rgba(15,23,42,.12)}

.course-filter{display:flex;gap:8px;overflow-x:auto;padding:0 14px 8px;scrollbar-width:none}
.course-filter::-webkit-scrollbar{display:none}
.course-chip{flex:0 0 auto;border:1.5px solid #e7eaf0;background:var(--c-surface);color:var(--n-600);border-radius:999px;padding:7px 15px;font-size:13px;font-weight:600;cursor:pointer;transition:.15s;white-space:nowrap}
.course-chip.active{border-color:var(--accent,var(--v-600));color:var(--accent,var(--v-600));background:var(--v-50)}

.course-sort{display:flex;gap:8px;overflow-x:auto;padding:0 14px 10px;scrollbar-width:none;border-bottom:1px solid var(--n-100);margin-bottom:10px}
.course-sort::-webkit-scrollbar{display:none}
.course-sort-btn{flex:0 0 auto;border:none;background:transparent;color:var(--n-400);font-size:12.5px;font-weight:600;padding:4px 4px;cursor:pointer;position:relative}
.course-sort-btn.active{color:var(--n-800)}
.course-sort-btn.active::after{content:"";position:absolute;left:4px;right:4px;bottom:-2px;height:2px;border-radius:2px;background:var(--accent,var(--v-600))}

.course-list{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:2px 14px 30px}
@media(max-width:380px){.course-list{grid-template-columns:1fr}}
.course-card{background:var(--c-surface);border:1px solid var(--n-100);border-radius:16px;overflow:hidden;box-shadow:0 4px 16px rgba(20,30,60,.05);cursor:pointer;transition:.18s;position:relative}
.course-card:active{transform:scale(.985)}
@media(hover:hover){.course-card:hover{transform:translateY(-3px);box-shadow:0 10px 28px rgba(20,30,60,.10)}}
.course-card-cover{height:118px;background:linear-gradient(135deg,var(--v-100),var(--s-indigo-100));display:flex;align-items:center;justify-content:center;font-size:42px;position:relative}
.course-card-cover::after{content:"";position:absolute;left:0;right:0;bottom:0;height:42px;background:linear-gradient(180deg,rgba(0,0,0,0),rgba(0,0,0,.18));pointer-events:none}
.course-card-promo{position:absolute;top:8px;right:8px;font-size:10.5px;font-weight:800;color:var(--c-surface);background:linear-gradient(135deg,var(--brand-orange),var(--s-red-500));padding:2px 8px;border-radius:6px;z-index:2;box-shadow:0 2px 8px rgba(239,68,68,.3)}
.course-card-rating{display:inline-flex;align-items:center;gap:3px;font-size:11.5px;color:var(--n-500)}
.course-card-rating .stars{color:var(--s-amber-400);font-size:11px;letter-spacing:-1px}
.course-card-cover img{width:100%;height:100%;object-fit:cover}
.course-card-badge{position:absolute;top:8px;left:8px;font-size:11px;font-weight:800;color:var(--c-surface);background:rgba(15,23,42,.55);padding:3px 9px;border-radius:999px;backdrop-filter:blur(4px)}
.course-card-owned{position:absolute;top:8px;right:8px;font-size:11px;font-weight:800;color:var(--v-700);background:var(--s-green-50);border:1px solid var(--brand-5);padding:3px 9px;border-radius:999px}
.course-card-fin{position:absolute;top:8px;right:52px;font-size:11px;font-weight:800;color:var(--brand-blue);background:var(--s-blue-50);border:1px solid #bfdbfe;padding:3px 9px;border-radius:999px}
.course-card-learners{font-size:11.5px;color:#98a2b3;margin-left:6px}
.course-card-body{padding:11px 12px 13px}
.course-card-title{font-size:14.5px;font-weight:800;color:var(--n-800);line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.course-card-progress{display:flex;align-items:center;gap:8px;margin-top:7px}
.cp-bar{flex:1;height:5px;border-radius:999px;background:var(--n-100);overflow:hidden}
.cp-bar i{display:block;height:100%;border-radius:999px;background:linear-gradient(135deg,var(--indigo-400),var(--v-600))}
.cp-txt{font-size:10.5px;color:var(--v-600);font-weight:700;flex-shrink:0}
.course-card-sub{font-size:12px;color:var(--n-400);line-height:1.5;margin-top:5px;height:34px;overflow:hidden}
.course-card-foot{display:flex;align-items:center;justify-content:space-between;margin-top:10px}
.course-card-teacher{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--n-500);min-width:0}
.course-card-teacher .ct-ava{width:20px;height:20px;border-radius:50%;background:var(--n-100);display:flex;align-items:center;justify-content:center;font-size:13px;flex-shrink:0;overflow:hidden}
.course-card-teacher .ct-ava img{width:100%;height:100%;object-fit:cover}
.course-card-teacher span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.course-card-price{font-size:16px;font-weight:800;color:var(--accent,var(--v-600))}
.course-card-price.free{color:var(--s-emerald-600)}
.course-card-price .cc-old{font-size:11px;font-weight:600;color:var(--n-300);text-decoration:line-through;margin-left:4px}
.course-empty{text-align:center;color:var(--n-400);font-size:13.5px;padding:40px 20px}

/* ---------- 详情页 ---------- */
.cd-top{position:relative}
.cd-back{position:absolute;top:12px;left:12px;z-index:3;width:34px;height:34px;border-radius:50%;border:none;background:rgba(255,255,255,.9);color:var(--n-800);font-size:18px;cursor:pointer;box-shadow:0 2px 8px rgba(0,0,0,.15);display:flex;align-items:center;justify-content:center}
.cd-back-label{position:absolute;top:12px;left:12px;z-index:4;padding:8px 16px 8px 12px;border-radius:999px;border:none;background:rgba(255,255,255,.96);color:var(--v-700,var(--brand-deep));font-size:13px;font-weight:800;cursor:pointer;box-shadow:0 2px 10px rgba(0,0,0,.18);display:inline-flex;align-items:center;gap:4px;letter-spacing:.2px}
.cd-back-label:active{transform:scale(.97)}
.cd-cover{height:200px;background:linear-gradient(135deg,var(--v-100),var(--s-indigo-100));display:flex;align-items:center;justify-content:center;font-size:72px}
.cd-cover img{width:100%;height:100%;object-fit:cover}
.cd-main{padding:16px 16px 40px}
.cd-type{display:inline-block;font-size:11px;font-weight:800;color:var(--accent,var(--v-600));background:var(--v-50);padding:3px 10px;border-radius:999px;margin-bottom:8px}
.cd-title{font-size:21px;font-weight:800;color:var(--n-800);line-height:1.35}
.cd-sub{font-size:13px;color:var(--n-500);line-height:1.6;margin-top:8px}
.cd-teacher{display:flex;align-items:center;gap:10px;background:var(--n-50);border:1px solid var(--n-100);border-radius:14px;padding:11px 12px;margin:14px 0}
.cd-teacher .cdt-ava{width:40px;height:40px;border-radius:50%;background:#eef2f7;display:flex;align-items:center;justify-content:center;font-size:22px;flex-shrink:0;overflow:hidden}
.cd-teacher .cdt-ava img{width:100%;height:100%;object-fit:cover}
.cd-teacher .cdt-name{font-size:14px;font-weight:800;color:var(--n-800)}
.cd-teacher .cdt-title{font-size:12px;color:var(--n-400);margin-top:2px}
.cd-summary{font-size:13.5px;color:var(--n-600);line-height:1.75;margin:4px 0 8px;white-space:pre-wrap}
.cd-tags{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0}
.cd-tag{font-size:11.5px;color:var(--n-500);background:var(--n-100);border-radius:999px;padding:3px 10px}

.cd-pricebar{position:sticky;bottom:0;left:0;right:0;background:var(--c-surface);border-top:1px solid var(--n-100);padding:10px 14px calc(10px + env(safe-area-inset-bottom));display:flex;align-items:center;gap:12px;box-shadow:0 -4px 16px rgba(15,23,42,.06);z-index:5}
.cd-pricebar .cdp-info{flex:1;min-width:0}
.cd-pricebar .cdp-now{font-size:19px;font-weight:800;color:var(--accent,var(--v-600))}
.cd-pricebar .cdp-now.free{color:var(--s-emerald-600)}
.cd-pricebar .cdp-old{font-size:12px;color:var(--n-300);text-decoration:line-through;margin-left:6px}
.cd-pricebar .cdp-mem{font-size:11px;color:var(--s-amber-700);background:var(--s-amber-50);border-radius:6px;padding:2px 7px;margin-left:6px}
.cd-pricebar .cdp-meta{font-size:11px;color:var(--n-400);margin-top:2px}
.cd-buy{flex-shrink:0;border:none;border-radius:12px;padding:12px 26px;font-size:15px;font-weight:800;color:var(--c-surface);background:linear-gradient(135deg,var(--indigo-400),var(--v-600));box-shadow:0 8px 20px rgba(16,185,129,.28);cursor:pointer;transition:filter .15s,transform .12s}
.cd-buy:active{transform:scale(.97)}
.cd-buy:disabled{background:var(--n-300);box-shadow:none;cursor:default}
.cd-buy.owned{background:var(--s-green-50);color:var(--v-700)}
.cd-buy.claim{background:linear-gradient(135deg,var(--s-amber-500),var(--brand-orange))}

/* 目录（章节 / 节目） */
.cd-sec-title{font-size:15px;font-weight:800;color:var(--n-800);margin:18px 0 10px;display:flex;align-items:center;gap:8px}
.cd-sec-title .cd-count{font-size:12px;font-weight:600;color:var(--n-400)}
.cd-items{display:flex;flex-direction:column;gap:9px}
.cd-item{display:flex;align-items:center;gap:12px;background:var(--c-surface);border:1px solid var(--n-100);border-radius:13px;padding:12px;cursor:pointer;transition:.15s;position:relative}
.cd-item:active{background:var(--warm-50)}
.cd-item.locked{opacity:.92}
.cd-item.resuming{border-color:var(--v-500);background:linear-gradient(135deg,var(--brand-purple-soft),var(--c-surface));box-shadow:0 4px 14px rgba(16,185,129,.16)}
.cd-item.resuming::before{content:'上次学到';position:absolute;top:-9px;left:12px;font-size:10px;font-weight:800;color:var(--c-surface);background:linear-gradient(135deg,var(--v-500),var(--v-600));padding:2px 10px;border-radius:999px}
.cd-item-ico{width:38px;height:38px;border-radius:11px;background:var(--v-50);color:var(--accent,var(--v-600));display:flex;align-items:center;justify-content:center;font-size:18px;flex-shrink:0}
.cd-item-ico.audio{background:var(--s-indigo-50);color:var(--s-indigo-600)}
.cd-item-ico.video{background:var(--s-red-50);color:var(--s-red-500)}
.cd-item-main{flex:1;min-width:0}
.cd-item-title{font-size:14px;font-weight:700;color:var(--n-800);line-height:1.4}
.cd-item-meta{font-size:11.5px;color:var(--n-400);margin-top:3px}
.cd-item-free{font-size:11px;font-weight:800;color:var(--s-emerald-600);background:var(--s-green-50);padding:2px 8px;border-radius:999px;flex-shrink:0}
.cd-item-lock{font-size:16px;color:var(--n-300);flex-shrink:0}
.cd-content{font-size:14px;color:var(--n-700);line-height:1.85;padding:14px 16px;background:var(--n-50);border-radius:12px;margin-top:8px;word-break:break-word}
.cd-content:empty{display:none}
.cd-content h2{font-size:21px;font-weight:800;margin:14px 0 8px;line-height:1.4;color:var(--n-800)}
.cd-content h3{font-size:17px;font-weight:800;margin:12px 0 6px;line-height:1.4;color:var(--n-800)}
.cd-content h4{font-size:15px;font-weight:700;margin:10px 0 5px;color:var(--n-800)}
.cd-content p{margin:8px 0}
.cd-content blockquote{margin:10px 0;padding:10px 14px;border-left:3px solid var(--accent,var(--v-600));background:var(--c-surface);color:var(--n-600);border-radius:0 8px 8px 0;line-height:1.7}
.cd-content img{max-width:100%;border-radius:8px;margin:8px 0;display:block}
.cd-content ul,.cd-content ol{padding-left:22px;margin:8px 0}
.cd-content li{margin:3px 0}
.cd-content a{color:var(--accent,var(--v-600));text-decoration:underline}
.cd-content figure.rte-fig{margin:10px 0;text-align:center}
.cd-content figure.rte-fig img{display:inline-block;margin:0 auto 6px}
.cd-content figcaption{font-size:12.5px;color:var(--n-400);text-align:center}
.cd-content table.rte-table{border-collapse:collapse;width:100%;margin:10px 0;font-size:13px;background:var(--c-surface)}
.cd-content table.rte-table th,.cd-content table.rte-table td{border:1px solid var(--n-200);padding:6px 10px;text-align:left}
.cd-content table.rte-table th{background:var(--n-50);font-weight:700}

/* 播放器 */
.cd-player{background:var(--n-800);border-radius:14px;padding:14px;margin-top:10px}
.cd-player audio,.cd-player video{width:100%;border-radius:10px}
.cd-player-tip{color:var(--n-300);font-size:12px;text-align:center;padding:18px 0}

/* 报名表单 */
.cd-signup{background:var(--c-surface);border:1px solid var(--n-100);border-radius:16px;padding:16px;margin-top:16px}
.cd-signup h4{font-size:15px;font-weight:800;color:var(--n-800);margin:0 0 4px}
.cd-signup p.cd-signup-sub{font-size:12.5px;color:var(--n-500);margin:0 0 12px;line-height:1.6}
.cd-field{margin-bottom:12px}
.cd-field label{display:block;font-size:13px;font-weight:700;color:var(--n-700);margin-bottom:6px}
.cd-field label .req{color:var(--s-red-500);margin-left:3px}
.cd-field input,.cd-field textarea{width:100%;border:1.5px solid #e7eaf0;border-radius:11px;padding:11px 12px;font-size:14px;color:var(--n-800);outline:none;box-sizing:border-box;font-family:inherit}
.cd-field input:focus,.cd-field textarea:focus{border-color:var(--accent,var(--v-600))}
.cd-signup-info{font-size:12.5px;color:var(--n-500);line-height:1.7;background:var(--n-50);border-radius:10px;padding:10px 12px;margin-bottom:12px}
.cd-signup-info b{color:var(--n-700)}

/* 进度条 */
.cd-progress{display:flex;align-items:center;gap:10px;font-size:12px;color:var(--n-400);margin-top:6px}
.cd-progress .cdp-bar{flex:1;height:6px;border-radius:999px;background:var(--n-100);overflow:hidden}
.cd-progress .cdp-bar i{display:block;height:100%;background:var(--accent,var(--v-600));border-radius:999px}

/* 每日打卡 */
.cd-checkin{display:flex;align-items:center;justify-content:space-between;gap:12px;background:linear-gradient(135deg,var(--s-amber-25),#fef3f2);border:1px solid #fed7aa;border-radius:14px;padding:12px 14px;margin-top:12px}
.cd-checkin-info{display:flex;align-items:center;gap:10px;min-width:0}
.cd-checkin-flame{font-size:24px;line-height:1}
.cd-checkin-streak{font-size:14px;font-weight:800;color:var(--s-orange-700)}
.cd-checkin-streak b{color:#ea580c;font-size:16px;margin:0 2px}
.cd-checkin-sub{font-size:11.5px;color:#9a3412;margin-top:2px}
.cd-checkin-btn{border:none;border-radius:11px;padding:10px 18px;font-size:14px;font-weight:800;color:var(--c-surface);background:linear-gradient(135deg,var(--brand-orange),var(--s-red-500));cursor:pointer;flex-shrink:0;box-shadow:0 6px 16px rgba(249,115,22,.28);transition:transform .12s}
.cd-checkin-btn:active{transform:scale(.97)}
.cd-checkin-btn.done{background:var(--n-200);color:var(--n-500);box-shadow:none;cursor:default}

/* 整课主媒体（音频 / 视频） */
.cd-media{background:var(--n-800);border-radius:16px;padding:14px;margin:14px 0}
.cd-media-title{color:var(--n-200);font-size:13px;font-weight:700;margin-bottom:8px;display:flex;align-items:center;gap:6px}
.cd-media .cd-media-el{width:100%;border-radius:10px;display:block}
.cd-media audio{background:var(--n-800)}

/* 付费墙（试读 / 试看提示） */
.cd-paywall{margin-top:12px;display:flex;justify-content:center}
.cd-paywall .cd-buy{width:100%}

/* 分享按钮 */
.cd-share{flex-shrink:0;border:1.5px solid var(--n-200);background:var(--c-surface);color:var(--n-600);border-radius:12px;padding:12px 16px;font-size:14px;font-weight:700;cursor:pointer;transition:.15s;display:inline-flex;align-items:center;gap:5px}
.cd-share:active{transform:scale(.97)}

/* 相关推荐 */
/* —— 主应用内课程/活动详情（#page-course-detail）：干净实底，覆盖科技网格底纹（仅本页作用域） —— */
#page-course-detail{position:relative;background:linear-gradient(180deg,#F7FAF8 0%,#F4F7F5 100%);min-height:calc(100vh - 118px);z-index:1}
#courseDetailBox{overflow-x:hidden}
#page-course-detail .cd-teacher{background:var(--c-surface)}
#page-course-detail .cd-summary{background:var(--c-surface);border:1px solid #EEF2F0;border-radius:12px;padding:12px 14px;margin:12px 0}

.cd-quota{display:flex;align-items:center;gap:10px;margin:10px 0}
.cd-quota-bar{flex:1;height:8px;border-radius:2px;background:var(--n-100);overflow:hidden;box-shadow:inset 0 1px 2px rgba(15,23,42,.06)}
.cd-quota-bar i{display:block;height:100%;background:linear-gradient(90deg,var(--brand-1),var(--brand-2));border-radius:2px}
.cd-quota span{flex:none;font-size:12px;color:var(--n-500);font-weight:700}
.cd-ticket{margin-top:10px;background:linear-gradient(135deg,var(--v-25),var(--brand-purple-soft));border:1px dashed var(--brand-5);border-radius:10px;padding:12px 14px;text-align:center}
.cd-ticket-label{font-size:11px;color:var(--n-500);font-weight:700}
.cd-ticket-code{font-size:26px;font-weight:900;letter-spacing:4px;color:var(--brand-2);margin:6px 0;font-variant-numeric:tabular-nums}
.cd-ticket-hint{font-size:11px;color:var(--n-400)}
.cd-ticket-checked{font-size:12px;color:var(--brand-2);font-weight:800}

.cd-related{margin-top:22px;padding-top:16px;border-top:1px solid var(--n-100)}
.cd-related-title{font-size:15px;font-weight:800;color:var(--n-800);margin-bottom:12px;display:flex;align-items:center;gap:8px}
.cd-related-title::before{content:"";width:4px;height:15px;border-radius:3px;background:var(--accent,var(--v-600))}
.cd-related-scroll{display:flex;gap:10px;overflow-x:auto;padding-bottom:6px;scrollbar-width:none}
.cd-related-scroll::-webkit-scrollbar{display:none}
.cd-related-card{flex:0 0 148px;background:var(--c-surface);border:1px solid var(--n-100);border-radius:14px;overflow:hidden;cursor:pointer;transition:.16s}
.cd-related-card:active{transform:scale(.97)}
.cd-related-cover{height:84px;background:linear-gradient(135deg,var(--v-100),var(--s-indigo-100));display:flex;align-items:center;justify-content:center;font-size:34px}
.cd-related-cover img{width:100%;height:100%;object-fit:cover}
.cd-related-body{padding:8px 10px 10px}
.cd-related-name{font-size:13px;font-weight:700;color:var(--n-800);line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.cd-related-price{font-size:13.5px;font-weight:800;color:var(--accent,var(--v-600));margin-top:6px}
.cd-related-price.free{color:var(--s-emerald-600)}
.cd-related-empty{font-size:12.5px;color:var(--n-300);padding:6px 0}

/* 收藏按钮 */
.cd-fav-row{display:flex;justify-content:flex-end;margin:6px 0 2px}
.cd-fav-btn{border:1.5px solid var(--n-200);background:var(--c-surface);color:var(--n-500);border-radius:999px;padding:7px 16px;font-size:13px;font-weight:700;cursor:pointer;transition:.15s}
.cd-fav-btn.on{background:var(--v-50);border-color:var(--v-300);color:var(--v-600)}

/* 课程评价（评论 + 点赞） */
.cd-comments{margin-top:18px;padding-top:16px;border-top:1px solid var(--n-100)}
.cd-comments-head{font-size:15px;font-weight:800;color:var(--n-800);margin-bottom:12px}
.cd-comment-form textarea{width:100%;min-height:72px;border:1.5px solid #e7eaf0;border-radius:12px;padding:11px 12px;font-size:14px;color:var(--n-800);outline:none;box-sizing:border-box;font-family:inherit;resize:vertical}
.cd-comment-form textarea:focus{border-color:var(--accent,var(--v-600))}
.cd-comment-bar{display:flex;align-items:center;justify-content:space-between;margin-top:8px}
.cd-rating i{font-size:18px;color:var(--n-200);cursor:pointer;transition:.12s;font-style:normal}
.cd-rating i.on{color:var(--s-amber-400)}
.cd-comment-bar button{border:none;border-radius:10px;padding:8px 18px;font-size:13px;font-weight:800;color:var(--c-surface);background:linear-gradient(135deg,var(--indigo-400),var(--v-600));cursor:pointer}
.cd-comment-list{margin-top:14px;display:flex;flex-direction:column;gap:12px}
.cd-cm{display:flex;gap:10px}
.cd-cm-ava{width:36px;height:36px;border-radius:50%;object-fit:cover;background:var(--n-100);flex-shrink:0;overflow:hidden}
.cd-cm-ava img{width:100%;height:100%;object-fit:cover}
.cd-cm-main{flex:1;min-width:0;background:var(--c-surface);border:1px solid var(--n-100);border-radius:12px;padding:10px 12px}
.cd-cm-head{display:flex;align-items:center;gap:8px}
.cd-cm-head b{font-size:13px;color:var(--n-700)}
.cd-cm-stars{color:var(--s-amber-400);font-size:12px}
.cd-cm-content{font-size:13.5px;color:var(--n-700);line-height:1.7;margin-top:6px;word-break:break-word}
.cd-cm-foot{display:flex;align-items:center;gap:14px;margin-top:8px}
.cd-cm-time{font-size:11px;color:var(--n-300)}
.cd-cm-like,.cd-cm-del{border:none;background:none;font-size:12px;color:var(--n-400);cursor:pointer;padding:0}
.cd-cm-like.on{color:var(--v-600)}
.cd-cm-del{color:var(--n-300)}
.cd-cm-empty{text-align:center;color:var(--n-300);font-size:13px;padding:20px 0}