:root {
  color-scheme: dark;
  --bg: #080c12;
  --panel: rgba(255,255,255,.075);
  --panel-2: rgba(255,255,255,.115);
  --line: rgba(255,255,255,.12);
  --text: #f7f9ff;
  --muted: rgba(247,249,255,.66);
  --soft: rgba(247,249,255,.42);
  --accent: #45a3ff;
  --accent-2: #5ee3c1;
  --danger: #ff7373;
}
* { box-sizing: border-box; }
html { min-width: 320px; background: var(--bg); }
html,body { touch-action: pan-x pan-y; overscroll-behavior-x: none; }
body { margin: 0; min-width: 320px; min-height: 100vh; color: var(--text); font-family: "Microsoft YaHei UI","Microsoft YaHei","PingFang SC",Arial,sans-serif; background: radial-gradient(circle at 18% 4%,rgba(69,163,255,.22),transparent 34%),linear-gradient(135deg,#07101d,#111822 48%,#070a10); }
.app-shell.mobile-v2 {
  --mobile-v2-safe-top: env(safe-area-inset-top, 0px);
  --mobile-v2-safe-right: env(safe-area-inset-right, 0px);
  --mobile-v2-safe-bottom: env(safe-area-inset-bottom, 0px);
  --mobile-v2-safe-left: env(safe-area-inset-left, 0px);
  --mobile-v2-viewport-height: 100dvh;
  --mobile-v2-space-1: 4px;
  --mobile-v2-space-2: 8px;
  --mobile-v2-space-3: 12px;
  --mobile-v2-space-4: 16px;
  --mobile-v2-space-5: 20px;
  --mobile-v2-radius-sm: 8px;
  --mobile-v2-radius-md: 12px;
  --mobile-v2-radius-lg: 18px;
  min-height: var(--mobile-v2-viewport-height);
}
.mobile-v2 .mobile-v2-button { -webkit-tap-highlight-color: transparent; }
.mobile-v2 .mobile-v2-tab-list { scrollbar-width: none; overscroll-behavior-inline: contain; }
.mobile-v2 .mobile-v2-tab-list::-webkit-scrollbar { display: none; }
.mobile-v2 .mobile-v2-bottom-nav { padding-bottom: var(--mobile-v2-safe-bottom, 0px); }
.mobile-v2 .app-dialog { max-height: calc(var(--mobile-v2-viewport-height) - var(--mobile-v2-safe-top, 0px) - var(--mobile-v2-safe-bottom, 0px)); }
html.detail-scroll-locked,body.detail-scroll-locked { height: 100%; overflow: hidden !important; overscroll-behavior: none; }
body.detail-scroll-locked { position: fixed; left: 0; right: 0; width: 100%; }
button,input,select { font: inherit; }
button,input,select,textarea { touch-action: manipulation; }
button { border: 0; cursor: pointer; }
button:disabled { cursor: default; opacity: .45; }
.hidden { display: none !important; }
.mobile-only,.mobile-detail-heading,.mobile-login-identity,.source-menu-head,.source-menu-handle,.source-button em,.category-tabs,.source-search,.about-dialog>.sheet-handle,.about-name,.about-version,.confirm-icon { display: none; }
.app-shell,.login-view,.loading-view,.workspace { min-height: 100vh; }
.brand-mark { width: 46px; height: 46px; display: grid; place-items: center; flex: 0 0 auto; overflow: hidden; border-radius: 14px; background: linear-gradient(135deg,var(--accent),var(--accent-2)); box-shadow: 0 18px 42px rgba(69,163,255,.28); }
.brand-mark.large { width: 84px; height: 84px; border-radius: 26px; }
.brand-mark img { width: 100%; height: 100%; display: block; object-fit: contain; }
.loader { width: 34px; height: 34px; border: 3px solid rgba(255,255,255,.16); border-top-color: var(--accent); border-radius: 50%; animation: spin .9s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
@keyframes android-loading-dot-cyan {
  0%,100% { left: 17.1px; top: 19.6px; }
  50% { left: 13.9px; top: 10px; }
}
@keyframes android-loading-dot-navy {
  0%,100% { left: 13.6px; top: 10px; }
  50% { left: 8.1px; top: 19px; }
}
@keyframes android-loading-dot-purple {
  0%,100% { left: 9.9px; top: 16.6px; }
  50% { left: 20.5px; top: 17.1px; }
}
.login-view { min-height: 100vh; display: grid; grid-template-columns: minmax(460px,1fr) 460px; gap: 72px; align-items: center; padding: 80px 120px; }
.login-brand { display: grid; gap: 18px; }
.login-brand h1 { margin: 0; font-size: 46px; }
.login-brand p { max-width: 520px; margin: 0; color: var(--muted); font-size: 18px; line-height: 1.8; }
.login-panel { display: grid; gap: 18px; padding: 34px; border: 1px solid var(--line); border-radius: 24px; background: rgba(255,255,255,.08); box-shadow: 0 30px 90px rgba(0,0,0,.42); backdrop-filter: blur(24px); }
.login-heading h2 { margin: 0; font-size: 28px; }
.login-notice,.form-message { margin: 0; color: var(--muted); line-height: 1.65; white-space: pre-line; overflow-wrap: anywhere; }
.login-notice.is-long { max-height: 112px; overflow-y: auto; }
.mobile-login-title { display: none; }
.login-qrcode { display: grid; grid-template-columns: 92px 1fr; align-items: center; gap: 14px; padding: 12px; border: 1px solid var(--line); border-radius: 16px; background: rgba(255,255,255,.06); }
.login-qrcode-image { width: 92px; height: 92px; display: grid; place-items: center; padding: 7px; border-radius: 13px; background: #fff; }
.login-qrcode-image img { width: 100%; height: 100%; object-fit: contain; }
.login-qrcode-copy { display: grid; gap: 5px; min-width: 0; }
.login-qrcode-copy span { color: var(--muted); font-size: 13px; }
.field-label { color: rgba(255,255,255,.76); }
.login-panel input { width: 100%; height: 50px; margin-top: -9px; padding: 0 16px; border: 1px solid rgba(255,255,255,.1); border-radius: 14px; outline: none; color: var(--text); background: rgba(255,255,255,.08); }
.login-panel input:focus { border-color: rgba(69,163,255,.72); box-shadow: 0 0 0 4px rgba(69,163,255,.16); }
.primary-button,#login-submit { height: 46px; padding: 0 24px; border-radius: 14px; color: #06111c; font-weight: 800; background: linear-gradient(135deg,var(--accent-2),var(--accent)); }
.loading-view { display: grid; place-items: center; align-content: center; gap: 16px; }
.loading-view strong { font-size: 28px; }
.loading-view span { color: var(--muted); }

.workspace { display: block; }
.sidebar { position: fixed; inset: 0 auto 0 0; z-index: 50; width: 238px; display: flex; flex-direction: column; min-height: 0; padding: 22px 16px; border-right: 1px solid var(--line); background: rgba(4,8,14,.72); backdrop-filter: blur(18px); }
.sidebar-main { min-height: 0; display: flex; flex: 1; flex-direction: column; }
.sidebar-brand { display: flex; align-items: center; gap: 12px; padding: 10px 8px 18px; }
.sidebar-brand strong,.sidebar-brand span { display: block; }
.sidebar-brand span { max-width: 140px; margin-top: 3px; overflow: hidden; color: var(--soft); font-size: 12px; text-overflow: ellipsis; }
.desktop-category-list { display: grid; gap: 6px; overflow-y: auto; padding: 4px 4px 0 0; }
.desktop-category-list button,.nav-item,.sidebar-footer button { width: 100%; min-height: 42px; padding: 0 14px; border-radius: 12px; color: var(--muted); text-align: left; background: transparent; }
.desktop-category-list button:hover,.desktop-category-list button.active,.nav-item.active { color: var(--text); background: rgba(255,255,255,.1); }
.desktop-category-list button.active { box-shadow: inset 3px 0 var(--accent); }
.sidebar-bottom { display: grid; gap: 12px; padding-top: 14px; border-top: 1px solid rgba(255,255,255,.08); }
.sidebar-quick,.sidebar-footer { display: grid; gap: 8px; }
.sidebar-quick { padding: 8px; border: 1px solid rgba(255,255,255,.07); border-radius: 16px; background: rgba(255,255,255,.035); }
.nav-item { min-height: 44px; border: 1px solid transparent; background: rgba(255,255,255,.045); }
.nav-item:hover,.nav-item.active { border-color: rgba(94,227,193,.24); background: linear-gradient(135deg,rgba(94,227,193,.15),rgba(69,163,255,.11)); }
.sidebar-footer button { min-height: 38px; text-align: center; background: rgba(255,255,255,.055); }
.main-content { min-height: 100vh; margin-left: 238px; padding: 24px 30px 48px; overflow-x: hidden; }
.topbar { min-height: 74px; display: flex; align-items: center; }
.source-switcher { position: relative; width: min(560px,100%); }
.source-button { position: relative; width: 100%; min-height: 62px; display: grid; grid-template-columns: auto 1fr; grid-template-areas: "label title" "label hint"; align-items: center; column-gap: 14px; padding: 12px 52px 12px 18px; border: 1px solid rgba(69,163,255,.28); border-radius: 18px; color: var(--text); text-align: left; background: linear-gradient(135deg,rgba(69,163,255,.18),rgba(94,227,193,.08)),rgba(8,14,23,.92); box-shadow: inset 0 1px rgba(255,255,255,.08),0 18px 46px rgba(0,0,0,.2); }
.source-button::after { content: ""; position: absolute; right: 20px; top: 50%; width: 9px; height: 9px; border-right: 2px solid rgba(255,255,255,.78); border-bottom: 2px solid rgba(255,255,255,.78); transform: translateY(-65%) rotate(45deg); }
.source-button[aria-expanded=true]::after { transform: translateY(-35%) rotate(225deg); }
.source-button span { grid-area: label; color: var(--accent-2); font-size: 13px; font-weight: 800; }
.source-button strong { grid-area: title; min-width: 0; overflow: hidden; color: #fff; font-size: 20px; text-overflow: ellipsis; white-space: nowrap; }
.source-button small { grid-area: hint; color: rgba(255,255,255,.54); font-size: 12px; }
.source-menu { position: absolute; left: 0; top: calc(100% + 10px); z-index: 100; width: min(620px,calc(100vw - 340px)); max-height: 430px; overflow-y: auto; padding: 10px; border: 1px solid var(--line); border-radius: 18px; background: rgba(8,13,21,.98); box-shadow: 0 28px 88px rgba(0,0,0,.48); }
.source-menu-backdrop { display: none; }
.source-options { display: grid; gap: 2px; }
.source-search { width: 100%; height: 40px; margin: 4px 0 8px; padding: 0 12px; border: 1px solid var(--line); border-radius: 10px; outline: none; color: var(--text); background: rgba(255,255,255,.07); }
.source-search:focus { border-color: rgba(69,163,255,.72); box-shadow: 0 0 0 3px rgba(69,163,255,.14); }
.source-options button { min-height: 54px; display: grid; gap: 3px; padding: 10px 14px; border-radius: 14px; color: var(--text); text-align: left; background: transparent; }
.source-options button span { color: rgba(255,255,255,.52); font-size: 12px; }
.source-options button .source-option-label { color: inherit; font-size: inherit; }
.source-options button .source-option-radio { display: none; }
.source-options button:hover,.source-options button.active { background: linear-gradient(135deg,rgba(94,227,193,.18),rgba(69,163,255,.14)); }
.offline-note { margin: 12px 0; padding: 10px 14px; border: 1px solid rgba(255,115,115,.4); border-radius: 10px; color: #ffd4d4; background: rgba(255,115,115,.12); }
.notice-bar { height: 38px; margin: 18px 0; display: flex; align-items: center; overflow: hidden; border: 1px solid rgba(94,227,193,.18); border-radius: 12px; color: rgba(255,255,255,.72); background: rgba(94,227,193,.08); }
.notice-bar p { margin: 0; padding-left: 100%; white-space: nowrap; animation: marquee 22s linear infinite; }
@keyframes marquee { to { transform: translateX(-100%); } }
.banner-section { position: relative; margin: 18px 0 28px; }
.banner-list { display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 18px)/2); gap: 18px; overflow-x: auto; padding: 2px 2px 12px; scroll-snap-type: x mandatory; scrollbar-width: thin; }
.banner-item { position: relative; aspect-ratio: 2/1; overflow: hidden; border: 1px solid rgba(69,163,255,.2); border-radius: 24px; background: rgba(255,255,255,.06); scroll-snap-align: start; }
.banner-item img { width: 100%; height: 100%; display: block; object-fit: contain; }
.banner-indicator { display: none; }
.section-heading { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; }
.section-heading h2,.collection-heading h2 { margin: 0; font-size: 22px; }
.section-heading span { color: var(--muted); }
.course-grid { display: grid; grid-template-columns: repeat(auto-fill,minmax(168px,1fr)); align-items: start; gap: 22px 18px; min-height: 240px; }
.course-card { min-width: 0; display: grid; grid-template-rows: auto 44px auto; align-content: start; padding: 0; color: var(--text); text-align: left; background: transparent; }
.poster { position: relative; aspect-ratio: 3/4; overflow: hidden; border-radius: 16px; background: linear-gradient(135deg,rgba(255,255,255,.13),rgba(255,255,255,.04)); box-shadow: 0 18px 36px rgba(0,0,0,.22); transition: transform .18s,box-shadow .18s; }
.course-card:hover .poster { transform: translateY(-2px); box-shadow: 0 22px 44px rgba(0,0,0,.32); }
.poster img { width: 100%; height: 100%; display: block; object-fit: cover; }
.poster img[data-failed=true] { opacity: 0; }
.poster-badge { position: absolute; right: 8px; bottom: 8px; max-width: calc(100% - 16px); padding: 4px 7px; overflow: hidden; border-radius: 8px; color: #fff; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; background: rgba(0,0,0,.6); }
.mobile-poster-copy,.poster-year { display: none; }
.course-card h3 { height: 44px; margin: 10px 2px 0; overflow: hidden; font-size: 15px; line-height: 1.45; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.course-card p { margin: 2px 2px 0; overflow: hidden; color: var(--soft); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.course-card p:empty { display: none; }
.card-progress { width: calc(100% - 4px); height: 3px; margin: 5px 2px 0; accent-color: var(--accent-2); }
.skeleton { border-radius: 8px; background: linear-gradient(100deg,rgba(255,255,255,.04),rgba(255,255,255,.12),rgba(255,255,255,.04)); background-size: 200% 100%; animation: shimmer 1.2s infinite; }
@keyframes shimmer { to { background-position: -200% 0; } }
.skeleton-title { width: 82%; height: 16px; margin-top: 12px; }
.skeleton-meta { width: 48%; height: 12px; margin-top: 7px; }
.empty-state { grid-column: 1/-1; min-height: 220px; display: grid; place-content: center; justify-items: center; gap: 9px; padding: 22px; border: 1px dashed var(--line); border-radius: 16px; color: var(--muted); text-align: center; }
.empty-state strong { color: var(--text); font-size: 18px; }
.empty-state button { min-height: 38px; padding: 0 16px; border-radius: 10px; }
.pagination { display: none; }
.pagination:not(.hidden) { align-items: center; justify-content: center; gap: 12px; min-height: 44px; margin: 20px 0 8px; color: var(--muted); }
.pagination:not(.hidden) button { min-height: 36px; padding: 0 16px; border-radius: 10px; color: var(--text); background: rgba(255,255,255,.1); }
.form-message.is-error { color: #ffb5b5; }
.login-panel input[aria-invalid="true"] { border-color: rgba(255,115,115,.78); box-shadow: 0 0 0 4px rgba(255,115,115,.12); }
.pagination button,.collection-heading button { min-height: 38px; padding: 0 16px; border-radius: 10px; color: var(--text); background: rgba(255,255,255,.1); }
.collection-heading { display: flex; align-items: center; gap: 16px; margin: 16px 0 24px; }
.collection-heading button { display: none; }

.detail-view { position: fixed; z-index: 70; inset: 0; overflow-y: auto; background: #070a10; }
.detail-topbar { height: 64px; display: flex; align-items: center; justify-content: space-between; padding: 0 34px; }
.detail-topbar button { width: 86px; height: 40px; border-radius: 12px; color: var(--text); background: rgba(255,255,255,.1); }
.detail-topbar span { padding: 9px 14px; border: 1px solid var(--line); border-radius: 999px; color: var(--muted); background: rgba(255,255,255,.06); }
.desktop-detail-heading { display: none; }
.desktop-detail-heading p { margin: 4px 0; color: var(--muted); }
.desktop-detail-heading h2 { margin: 4px 0; font-size: 29px; }
.desktop-detail-heading #detail-type { color: var(--accent-2); font-weight: 800; }
#favorite-button { height: 34px; padding: 0 14px; border-radius: 999px; color: var(--text); background: rgba(255,255,255,.1); }
#favorite-button.active { color: #06111c; background: linear-gradient(135deg,#ffd66b,var(--accent-2)); }
.study-workbench { height: calc(100vh - 190px); margin: 0 34px 28px; display: grid; grid-template-columns: minmax(0,1fr) minmax(360px,450px); gap: 18px; }
.player-shell { position: relative; width: 100%; min-width: 0; min-height: 440px; overflow: hidden; border: 1px solid var(--line); border-radius: 22px; background: #000; box-shadow: 0 22px 70px rgba(0,0,0,.28); }
.player-shell video { width: 100%; height: 100%; display: block; background: #000; }
.player-shell video::-webkit-media-controls,.player-shell video::-webkit-media-controls-enclosure { display: none !important; }
body.player-web-fullscreen { overflow: hidden !important; }
.player-shell.web-fullscreen { position: fixed !important; z-index: 1000 !important; inset: 0 !important; width: 100vw !important; height: 100vh !important; height: 100dvh !important; min-height: 0 !important; max-height: none !important; aspect-ratio: auto !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; background: #000; }
@media (max-width:760px) and (orientation:portrait) {
  .player-shell.web-fullscreen { inset: auto !important; left: 50% !important; top: 50% !important; width: 100vh !important; width: 100dvh !important; height: 100vw !important; transform: translate(-50%,-50%) rotate(90deg); transform-origin: center; }
}
@media (orientation:portrait) and (any-pointer:coarse) and (max-width:1366px) {
  html.mobile-v2 .player-shell.web-fullscreen { inset: auto !important; left: 50% !important; top: 50% !important; width: 100vh !important; width: 100dvh !important; height: 100vw !important; transform: translate(-50%,-50%) rotate(90deg); transform-origin: center; }
}
.ratio-contain video { object-fit: contain; }.ratio-cover video { object-fit: cover; }.ratio-fill video { object-fit: fill; }.ratio-wide video,.ratio-classic video { width: auto; max-width: 100%; margin: 0 auto; object-fit: contain; }.ratio-wide video { aspect-ratio: 16 / 9; }.ratio-classic video { aspect-ratio: 4 / 3; }
.player-topshade { position: absolute; z-index: 3; inset: 0 0 auto; display: grid; gap: 4px; padding: 18px 20px 52px; background: linear-gradient(rgba(0,0,0,.75),transparent); pointer-events: none; }
.player-topshade span { color: rgba(255,255,255,.72); font-size: 12px; }
.video-center-button { position: absolute; z-index: 4; inset: 50% auto auto 50%; translate: -50% -50%; width: 68px; height: 68px; border: 1px solid rgba(255,255,255,.3); border-radius: 50%; color: #06111c; font-weight: 800; background: linear-gradient(135deg,var(--accent-2),var(--accent)); }
.video-center-button.playing { opacity: 0; pointer-events: none; }
.player-shell.message-visible .video-center-button { opacity: 0; pointer-events: none; }
.player-message { position: absolute; z-index: 6; inset: 50% auto auto 50%; translate: -50% -50%; display: grid; justify-items: center; gap: 12px; max-width: min(520px,calc(100% - 40px)); padding: 14px 18px; border: 1px solid var(--line); border-radius: 12px; text-align: center; background: rgba(7,19,31,.9); }
.player-message.loading { border-color: transparent; background: transparent; }
.player-message.loading::before { content: ""; width: 38px; height: 38px; border: 3px solid rgba(255,255,255,.2); border-top-color: var(--accent); border-radius: 50%; animation: spin .8s linear infinite; }
.player-loader { display: none; }
.player-message button { min-height: 36px; padding: 0 16px; border-radius: 8px; color: #fff; background: rgba(69,163,255,.3); }
.player-gesture-seek { position: absolute; z-index: 7; left: 50%; top: 50%; min-width: 146px; height: 58px; translate: -50% -50%; display: flex; align-items: center; justify-content: center; gap: 10px; padding: 0 18px; border-radius: 8px; color: #fff; font-size: 15px; font-variant-numeric: tabular-nums; background: rgba(0,0,0,.72); pointer-events: none; }
.player-gesture-seek img { width: 28px; height: 28px; display: block; object-fit: contain; }
.player-controls { position: absolute; z-index: 5; inset: auto 0 0; padding: 24px 14px 10px; background: linear-gradient(transparent,rgba(0,0,0,.94)); transition: opacity .18s; }
.player-shell.controls-hidden .player-controls,.player-shell.controls-hidden .player-topshade { opacity: 0; pointer-events: none; }
.player-progress-row,.player-action-row { display: flex; align-items: center; gap: 9px; }
.player-progress-row { margin-bottom: 5px; }
.player-progress-row>span { flex: none; font-size: 12px; font-variant-numeric: tabular-nums; }
.seek-wrap { position: relative; flex: 1; min-width: 80px; }
.seek-wrap input { width: 100%; accent-color: var(--accent); }
.seek-preview { position: absolute; left: 50%; bottom: 28px; translate: -50%; padding: 4px 7px; border-radius: 4px; font-size: 12px; background: #081521; }
.player-action-row button { min-height: 34px; padding: 0 9px; border-radius: 10px; color: #fff; white-space: nowrap; background: rgba(255,255,255,.1); }
#player-play-button { color: #06111c; font-weight: 800; background: var(--accent); }
.player-state-icon { display: none; }
.control-spacer { flex: 1; }
.control-model { position: absolute; width: 1px; height: 1px; overflow: hidden; opacity: 0; }
#volume-input { width: 74px; accent-color: var(--accent); }
.episode-panel { min-height: 0; overflow: hidden; padding: 20px; border: 1px solid var(--line); border-radius: 22px; background: rgba(255,255,255,.075); }
.desktop-episode-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.desktop-episode-head h3 { margin: 0; font-size: 19px; }
.desktop-episode-head>div:first-child>span { display: block; margin-top: 4px; color: var(--soft); font-size: 13px; }
.desktop-episode-head>div:last-child { display: flex; gap: 8px; }
.desktop-episode-head button { height: 34px; padding: 0 13px; border-radius: 999px; color: var(--text); background: rgba(255,255,255,.1); }
.line-title,.episode-heading h3 { margin: 0 0 12px; font-size: 19px; }
.line-tabs { display: flex; gap: 8px; overflow-x: auto; padding-bottom: 14px; }
.line-tabs button { flex: none; height: 36px; padding: 0 14px; border-radius: 12px; color: var(--muted); background: rgba(255,255,255,.1); }
.line-tabs button.active { color: #06111c; background: linear-gradient(135deg,var(--accent-2),var(--accent)); }
.episode-heading { display: flex; align-items: center; justify-content: space-between; }
.episode-heading button { min-height: 34px; padding: 0 13px; border-radius: 999px; color: var(--text); background: rgba(255,255,255,.1); }
.episode-summary { margin: -4px 0 12px; color: var(--soft); font-size: 13px; }
.episode-list { display: grid; grid-template-columns: repeat(auto-fill,minmax(180px,1fr)); gap: 8px; max-height: 200px; overflow-y: auto; }
.episode-button { min-height: 44px; padding: 8px 10px; overflow: visible; border: 1px solid var(--line); border-radius: 12px; color: var(--muted); text-align: left; overflow-wrap: anywhere; white-space: normal; background: rgba(255,255,255,.06); }
.episode-button.active { border-color: rgba(94,227,193,.5); color: var(--accent-2); background: rgba(94,227,193,.12); }
.episode-button span { display: block; min-width: 0; overflow-wrap: anywhere; white-space: normal; }
.episode-list.full-name { grid-template-columns: 1fr; }
.episode-button.long-name span { white-space: normal; }
.episode-pager { display: flex; gap: 8px; margin: 0 0 12px; overflow-x: auto; }
.episode-pager button { flex: none; height: 34px; padding: 0 12px; border-radius: 10px; color: var(--muted); background: rgba(255,255,255,.08); }
.episode-pager button.active { color: #06111c; background: linear-gradient(135deg,var(--accent-2),var(--accent)); }
.desktop-player-settings { position: absolute; z-index: 12; right: 18px; bottom: 68px; width: min(430px,calc(100% - 36px)); padding: 18px; border: 1px solid var(--line); border-radius: 16px; background: rgba(8,14,22,.96); box-shadow: 0 20px 60px rgba(0,0,0,.45); }
.desktop-player-settings section { display: grid; grid-template-columns: 50px 1fr; align-items: center; gap: 12px; margin: 0 0 14px; }
.desktop-player-settings section:last-child { margin-bottom: 0; }
.desktop-player-settings section>span { color: var(--soft); }
.desktop-player-settings section>div { display: flex; flex-wrap: wrap; gap: 8px; }
.desktop-player-settings button { min-width: 54px; height: 34px; padding: 0 10px; border-radius: 9px; color: var(--text); background: rgba(255,255,255,.1); }
.desktop-player-settings button.active { color: #06111c; background: var(--accent); }
.player-quality-panel { position: absolute; z-index: 15; inset: 0; display: grid; place-content: center; padding: 20px; background: rgba(0,0,0,.58); }
.player-quality-panel.hidden { display: none; }
.player-quality-panel::before { content: ""; position: absolute; z-index: -1; left: 50%; top: 50%; width: min(340px,calc(100% - 40px)); height: min(306px,calc(100% - 32px)); translate: -50% -50%; border-radius: 18px; background: rgba(25,29,37,.98); }
.player-quality-head,.player-quality-options { width: min(308px,calc(100vw - 72px)); }
.player-quality-head { display: flex; align-items: center; justify-content: space-between; min-height: 52px; padding-left: 2px; color: #fff; }
.player-quality-head strong { font-size: 16px; }
.player-quality-head button { width: 46px; height: 46px; color: rgba(255,255,255,.8); font-size: 26px; background: transparent; }
.player-quality-options { max-height: 240px; overflow-y: auto; display: grid; gap: 10px; padding: 0 0 16px; }
.player-quality-options button { min-height: 42px; padding: 0 14px; border-radius: 10px; color: rgba(255,255,255,.86); text-align: left; background: rgba(255,255,255,.08); }
.player-quality-options button.active { color: #fff; background: #2166f3; }
.player-episode-backdrop { display: none; }
.player-episode-drawer { position: absolute; z-index: 12; top: 0; right: 0; bottom: 0; width: min(460px,100%); overflow-y: auto; padding: 22px; color: var(--text); background: rgba(7,13,21,.97); box-shadow: -18px 0 50px rgba(0,0,0,.4); }
.drawer-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 16px; }
.drawer-head strong,.drawer-head span { display: block; }
.drawer-head span { margin-top: 4px; color: var(--soft); font-size: 12px; }
.drawer-head>div:last-child { display: flex; gap: 8px; }
.drawer-head button { height: 34px; padding: 0 12px; border-radius: 9px; color: var(--text); background: rgba(255,255,255,.1); }
.drawer-title-mobile,.drawer-mobile-close-button,.drawer-mobile-episode-pager { display: none; }
.drawer-episode-scroll { min-height: 0; }
.drawer-episode-list { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
.drawer-episode-list.full-name { grid-template-columns: 1fr; }
.drawer-episode-list .episode-button { width: 100%; }
.modal-mask { position: fixed; z-index: 400; inset: 0; display: grid; place-items: center; padding: 40px; background: rgba(0,0,0,.52); backdrop-filter: blur(14px); }
.library-modal { width: min(920px,100%); max-height: min(720px,calc(100vh - 80px)); display: grid; grid-template-rows: auto minmax(0,1fr); gap: 18px; padding: 26px; border: 1px solid rgba(255,255,255,.12); border-radius: 22px; background: linear-gradient(180deg,rgba(22,29,40,.96),rgba(8,12,18,.98)); box-shadow: 0 28px 90px rgba(0,0,0,.48); }
.library-grid { min-height: 160px; overflow: auto; display: grid; grid-template-columns: repeat(auto-fill,minmax(260px,1fr)); align-content: start; gap: 12px; padding-right: 4px; }
.library-card { min-width: 0; height: 86px; display: flex; align-items: center; gap: 12px; padding: 10px; border-radius: 16px; color: var(--text); text-align: left; background: rgba(255,255,255,.07); }
.library-card:hover { transform: translateY(-2px); background: rgba(255,255,255,.11); }
.library-card img,.library-poster-fallback { width: 52px; height: 66px; flex: 0 0 auto; border-radius: 10px; object-fit: cover; background: var(--panel); }
.library-card-copy { min-width: 0; display: block; }
.library-card-copy strong,.library-card-copy small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.library-card-copy small { margin-top: 6px; color: var(--soft); font-size: 13px; }
.route-view { display: none; }
.course-intro { width: min(420px,100%); max-width: none; margin: auto 0 0 auto; padding: 14px 16px 18px; border: 0; border-radius: 18px 18px 0 0; color: var(--mobile-text); background: #fff; }
.course-intro-layout { display: flex; gap: 14px; margin-top: 14px; }
.course-intro-poster { width: 90px; height: 126px; flex: 0 0 90px; overflow: hidden; border-radius: 14px; background: #e6ebf2; }
.course-intro-poster img { width: 100%; height: 100%; display: block; object-fit: cover; }
.course-intro-copy { min-width: 0; flex: 1; display: flex; flex-direction: column; }
.course-intro h3 { margin: 0; color: var(--mobile-text); font-size: 16px; line-height: 1.45; }
.course-intro p { max-height: 168px; margin: 10px 0 0; overflow-y: auto; color: var(--mobile-soft); font-size: 14px; line-height: 1.55; white-space: pre-wrap; }
.course-intro p.collapsed { max-height: 108px; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 5; }
.course-intro #course-intro-toggle { align-self: flex-end; margin-top: 3px; padding: 2px 0; color: #1e5eff; background: transparent; }
.course-intro-handle { width: 36px; height: 4px; margin: 0 auto; border-radius: 4px; background: #e6ebf2; }

.bottom-nav { display: none; }
.my-view { display: none; }
.app-dialog { width: min(480px,calc(100vw - 32px)); padding: 0; border: 1px solid var(--line); border-radius: 18px; color: var(--text); background: #111a25; box-shadow: 0 28px 90px rgba(0,0,0,.5); }
.app-dialog::backdrop { background: rgba(1,6,10,.74); backdrop-filter: blur(3px); }
.notice-dialog { padding: 18px 18px 16px; text-align: center; }
.notice-dialog .notice-icon { width: 46px; height: 46px; display: grid; place-items: center; margin: 0 auto 10px; border-radius: 50%; color: #fff; font-size: 21px; font-weight: 800; background: linear-gradient(90deg,#1e5eff,#4f8dff); }
.notice-dialog h2 { margin: 0; font-size: 20px; }
.notice-dialog-content { min-height: 46px; max-height: 170px; margin-top: 12px; overflow-y: auto; padding: 0 2px; color: #4f5a6d; font-size: 14px; line-height: 24px; text-align: left; white-space: pre-wrap; }
.notice-ignore { min-height: 30px; display: flex; align-items: center; gap: 7px; margin-top: 8px; color: #697386; font-size: 14px; text-align: left; }
.notice-ignore input { width: 18px; height: 18px; margin: 0; accent-color: #1e5eff; }
.notice-dialog-ok { width: 100%; height: 44px; margin-top: 8px; border-radius: 18px; color: #fff; font-size: 16px; background: linear-gradient(90deg,#1e5eff,#4f8dff); }
.dialog-header { display: flex; align-items: center; justify-content: space-between; padding: 18px 20px; border-bottom: 1px solid var(--line); }
.dialog-header h2 { margin: 0; font-size: 20px; }
.dialog-header button,.dialog-actions button { min-height: 36px; padding: 0 14px; border-radius: 9px; color: var(--text); background: rgba(255,255,255,.1); }
.dialog-content { margin: 0; padding: 22px 20px; color: var(--muted); line-height: 1.75; white-space: pre-wrap; }
.dialog-actions { display: flex; justify-content: flex-end; gap: 10px; padding: 0 20px 20px; }
.about-logo,.about-close-button { display: none; }
.player-failure-dialog { width: min(320px,calc(100vw - 36px)); padding: 22px 22px 20px; border: 1px solid rgba(255,255,255,.14); border-radius: 16px; color: #fff; text-align: center; background: #171d27; box-shadow: 0 24px 80px rgba(0,0,0,.6); }
.player-failure-dialog::backdrop { background: rgba(0,0,0,.7); }
.player-failure-icon { width: 48px; height: 48px; display: grid; place-items: center; margin: 0 auto; border: 1px solid rgba(255,214,107,.45); border-radius: 50%; color: #ffd66b; font-size: 26px; font-weight: 800; background: rgba(255,214,107,.12); }
.player-failure-dialog h2 { margin: 14px 0 0; font-size: 18px; }
.player-failure-dialog p { margin: 12px 0 0; color: rgba(255,255,255,.85); font-size: 14px; line-height: 1.65; }
.player-failure-actions { height: 40px; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; margin-top: 20px; }
.player-failure-actions button { height: 40px; border: 1px solid rgba(255,255,255,.2); border-radius: 8px; color: #fff; background: rgba(255,255,255,.08); }
.player-failure-actions button:last-child { border-color: #3977ff; background: #3977ff; }

@media (min-width: 761px) {
  .line-title,.episode-heading { display: none; }
  .detail-view { overflow-y: auto; overflow-x: hidden; padding-bottom: 40px; }
  .study-workbench { width: min(1420px,calc(100% - 68px)); height: auto; margin: 0 auto; grid-template-columns: minmax(0,1fr); grid-template-rows: auto auto; gap: 14px; }
  .player-shell { height: clamp(430px,52vh,620px); min-height: 0; max-height: 620px; border-radius: 20px; }
  .episode-panel { min-height: 228px; padding: 20px 22px 22px; border-radius: 20px; }
  .desktop-episode-head h3 { font-size: 24px; }
  .desktop-episode-head>div:first-child>span { display: block; margin-left: 0; }
  .episode-list { max-height: none; overflow: visible; grid-template-columns: repeat(auto-fill,minmax(156px,1fr)); gap: 10px; }
  .episode-button { min-height: 42px; }
}
.toast-region { position: fixed; z-index: 1000; right: 22px; bottom: 22px; display: grid; gap: 8px; pointer-events: none; }
.toast { max-width: 360px; padding: 12px 15px; border: 1px solid var(--line); border-radius: 12px; color: var(--text); background: #15283a; box-shadow: 0 16px 46px rgba(0,0,0,.34); }

@media (max-width: 760px), (max-height: 760px) and (max-width: 960px) {
  :root { color-scheme: light; --mobile-bg: #eff4f9; --mobile-panel: #fff; --mobile-text: #172033; --mobile-soft: #697386; --mobile-muted: #9aa6b5; --mobile-line: #e6ebf2; --mobile-brand: #1e5eff; --mobile-brand-soft: #e9f0ff; --mobile-orange: #ff7a45; --mobile-gold: #e7b967; }
  html,body { background: linear-gradient(180deg,#f8fafd,#eff4f9); color: var(--mobile-text); font-size: 14px; }
  .mobile-v2 button:focus-visible,.mobile-v2 input:focus-visible,.mobile-v2 select:focus-visible,.mobile-v2 textarea:focus-visible,.mobile-v2 [tabindex]:not([tabindex="-1"]):focus-visible { outline: 3px solid var(--mobile-brand); outline-offset: 2px; box-shadow: 0 0 0 2px rgba(255,255,255,.96); }
  .mobile-only,.mobile-login-identity,.mobile-detail-heading,.source-menu-head,.source-menu-handle,.source-button em,.category-tabs { display: flex; }
  .desktop-login-title,.login-brand,.login-qrcode,.sidebar,.desktop-detail-heading,.detail-topbar,.notice-bar { display: none; }
  .mobile-login-title { display: inline; }
  .login-view { min-height: 100dvh; display: block; padding: 32px 22px 22px; overflow-y: auto; background: linear-gradient(180deg,#f8fbff,#edf3f9); }
  .login-panel { width: 100%; max-width: 520px; min-height: 460px; margin: max(0px,calc((100dvh - 554px)/2)) auto 0; align-content: start; gap: 0; padding: 24px 18px 20px; border: 1px solid var(--mobile-line); border-radius: 12px; color: var(--mobile-text); background: #fff; box-shadow: 0 18px 50px rgba(31,55,83,.12); }
  .mobile-login-identity { display: grid; justify-items: center; gap: 8px; }
  .mobile-login-image-frame { width: 64px; height: 64px; display: grid; place-items: center; overflow: hidden; border-radius: 50%; background: #edf3fb; }
  .mobile-login-image-frame img { width: 100%; height: 100%; object-fit: cover; }
  .mobile-login-identity.has-qrcode .mobile-login-image-frame { width: 132px; height: 132px; padding: 6px; border: 1px solid var(--mobile-line); border-radius: 12px; background: #fff; }
  .mobile-login-identity.has-qrcode img { object-fit: contain; }
  .mobile-login-qrcode-copy { display: grid; justify-items: center; gap: 2px; max-width: 250px; color: var(--mobile-soft); text-align: center; }
  .mobile-login-qrcode-copy strong { color: var(--mobile-text); font-size: 13px; }
  .mobile-login-qrcode-copy span { font-size: 12px; }
  .login-heading h2 { margin: 14px 0 0; color: var(--mobile-text); font-size: 22px; text-align: center; }
  .login-notice { max-height: 86px; margin: 8px 0 22px; color: var(--mobile-soft); font-size: 13px; line-height: 1.55; text-align: center; }
  .field-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0,0,0,0); }
  .login-panel input { height: 48px; margin: 0 0 12px; border: 1px solid var(--mobile-line); border-radius: 9px; color: var(--mobile-text); background: #f6f8fb; box-shadow: none; }
  .mobile-v2 .login-panel input,.mobile-v2 .source-search { font-size: 16px; }
  #login-submit { order: 10; width: 100%; height: 46px; margin-top: 10px; border-radius: 9px; color: #fff; background: var(--mobile-brand); }
  .form-message { order: 11; margin-top: 12px; color: var(--mobile-soft); font-size: 12px; text-align: center; }
  .loading-view { min-height: 100dvh; color: var(--mobile-text); background: var(--mobile-bg); }
  .loading-view span { color: var(--mobile-soft); }

  .workspace { min-height: 100dvh; background: linear-gradient(180deg,#f8fafd,#eff4f9); }
  .main-content { min-height: 100dvh; margin: 0; padding: 0 0 calc(76px + env(safe-area-inset-bottom)); overflow: visible; }
  .topbar { min-height: 0; padding: calc(30px + env(safe-area-inset-top)) 16px 8px; }
  .source-switcher { position: static; width: 100%; }
  .source-button { min-height: 62px; display: flex; align-items: center; padding: 10px 14px 10px 18px; border: 0; border-radius: 10px; color: #fff; background: linear-gradient(120deg,#163b8f,#1e5eff); box-shadow: 0 10px 28px rgba(30,94,255,.18); }
  .source-button::after,.source-button small { display: none; }
  .source-button span { position: absolute; margin-top: -25px; color: rgba(255,255,255,.8); font-size: 11px; }
  .source-button strong { flex: 1; margin-top: 14px; font-size: 18px; }
  .source-button em { min-height: 32px; align-items: center; padding: 0 14px; border: 1px solid rgba(255,255,255,.26); border-radius: 8px; font-style: normal; font-size: 13px; }
  .source-menu-backdrop { position: fixed; z-index: 299; inset: 0; display: block; background: rgba(0,0,0,.56); }
  .source-menu { position: fixed; z-index: 300; inset: auto 0 0; width: min(100%,640px); max-height: min(82dvh,calc(100dvh - env(safe-area-inset-top) - 12px)); min-height: 220px; display: flex; flex-direction: column; margin: 0 auto; padding: 0 16px calc(16px + env(safe-area-inset-bottom)); overflow: hidden; border: 1px solid var(--mobile-line); border-bottom: 0; border-radius: 22px 22px 0 0; color: var(--mobile-text); background: var(--mobile-panel); box-shadow: 0 -18px 46px rgba(22,43,69,.18); transform: none; }
  .source-menu-handle { width: 40px; height: 4px; flex: 0 0 auto; display: block; margin: 10px auto 2px; border-radius: 999px; background: #cbd4df; }
  .source-menu-head { min-height: 52px; flex: 0 0 auto; align-items: center; justify-content: space-between; margin: 0 -16px; padding: 0 16px; }
  .source-menu-head strong { padding: 0 2px; color: var(--mobile-text); font-size: 17px; line-height: 22px; }
  .source-menu-head button { width: 42px; height: 42px; position: relative; border-radius: 50%; background: #f2f5f8; }
  .source-menu-head button::before,.source-menu-head button::after { content: ""; position: absolute; left: 11px; top: 20px; width: 20px; height: 2px; border-radius: 2px; background: #667386; rotate: 45deg; }
  .source-menu-head button::after { rotate: -45deg; }
  .source-options { grid-template-columns: 1fr; flex: 1 1 auto; min-height: 0; gap: 8px; max-height: none; overflow-y: auto; overscroll-behavior: contain; padding: 0 0 2px; }
  .mobile-v2 .source-search { display: block; flex: 0 0 auto; height: 46px; margin: 0 0 12px; border-color: var(--mobile-line); border-radius: 12px; color: var(--mobile-text); background: #f5f7fa; }
  .mobile-v2 .source-search::placeholder { color: var(--mobile-muted); }
  .source-options button { min-height: 54px; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: 12px; padding: 10px 14px; border: 1px solid var(--mobile-line); border-radius: 12px; color: var(--mobile-text); font-size: 15px; text-align: left; background: #fff; }
  .source-options button .source-option-label { min-width: 0; display: -webkit-box; overflow: hidden; color: inherit; font-size: inherit; line-height: 20px; overflow-wrap: anywhere; white-space: normal; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
  .source-options button .source-option-radio { width: 20px; height: 20px; display: block; position: relative; border: 1.5px solid #b8c3d0; border-radius: 50%; background: #fff; }
  .source-options button .source-option-radio::after { content: ""; position: absolute; inset: 4px; border-radius: 50%; background: var(--mobile-brand); opacity: 0; transform: scale(.6); transition: opacity .16s,transform .16s; }
  .source-options button.active { border-color: #a9c2ff; color: var(--mobile-brand); background: var(--mobile-brand-soft); }
  .source-options button.active .source-option-radio { border-color: var(--mobile-brand); }
  .source-options button.active .source-option-radio::after { opacity: 1; transform: scale(1); }
  .view-panel { padding: 0 12px; }
  .category-tabs { height: 44px; gap: 22px; margin: 6px -12px 0; padding: 0 16px; overflow-x: auto; scrollbar-width: none; }
  .category-tabs button { position: relative; flex: none; min-height: 44px; padding: 0; color: var(--mobile-soft); background: transparent; }
  .category-tabs button.active { color: var(--mobile-brand); font-size: 16px; font-weight: 800; }
  .category-tabs button.active::after { content: ""; position: absolute; left: 50%; bottom: 0; width: 16px; height: 5px; border-radius: 3px; translate: -50%; background: var(--mobile-brand); }
  .banner-section { height: 168px; margin: 20px 4px; overflow: hidden; border-radius: 10px; background: #dfe6ee; }
  .banner-list { display: block; width: 100%; height: 100%; padding: 0; overflow: hidden; }
  .banner-item { position: absolute; inset: 0; width: 100%; height: 168px; aspect-ratio: auto; border: 0; border-radius: 10px; opacity: 0; transform: scale(.88); transition: opacity .8s ease,transform .8s ease; pointer-events: none; }
  .banner-item.active { opacity: 1; transform: scale(1); }
  .banner-item img { object-fit: cover; }
  .banner-indicator { position: absolute; right: 9px; bottom: 9px; display: block; padding: 3px 8px; border-radius: 999px; color: #fff; font-size: 12px; background: rgba(0,0,0,.38); }
  .section-heading { margin: 0 4px 10px; }
  .section-heading h2,.section-heading span { display: none; }
  .course-grid { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 16px 8px; min-height: 220px; }
  .course-card { display: block; height: auto; color: var(--mobile-text); }
  .poster { width: 100%; height: auto; aspect-ratio: 2 / 3; border-radius: 10px; box-shadow: none; background: #dfe8f2; }
  .poster::after { content: ""; position: absolute; inset: 48% 0 0; background: linear-gradient(transparent,rgba(0,0,0,.7)); pointer-events: none; }
  .poster-badge,.course-card>h3,.course-card>p,.course-card>.card-progress { display: none; }
  .poster-year { position: absolute; z-index: 2; left: 0; top: 0; display: block; max-width: 70px; overflow: hidden; padding: 5px; border-radius: 10px 0 8px 0; color: #fff; font-size: 10px; line-height: 1; text-overflow: ellipsis; white-space: nowrap; background: var(--mobile-orange); }
  .mobile-poster-copy { position: absolute; z-index: 2; left: 0; right: 0; bottom: 0; display: grid; gap: 2px; padding: 5px 8px; color: #fff; }
  .mobile-poster-copy small,.mobile-poster-copy strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .mobile-poster-copy small { font-size: 10px; font-weight: 400; }
  .mobile-poster-copy strong { font-size: 12px; font-weight: 400; }
  .skeleton { background: linear-gradient(100deg,#e4eaf0,#f7f9fb,#e4eaf0); background-size: 200% 100%; }
  .empty-state { min-height: 220px; border-color: #cfd9e5; color: var(--mobile-soft); }
  .empty-state strong { color: var(--mobile-text); }
  .pagination button,.collection-heading button { color: var(--mobile-text); background: #fff; border: 1px solid var(--mobile-line); }

  .my-view { display: block; padding: calc(18px + env(safe-area-inset-top)) 14px 16px; }
  .my-active .topbar { display: none; }
  .my-active.source-menu-open .topbar { display: block; height: 0; padding: 0; }
  .my-active.source-menu-open .source-button { display: none; }
  .my-profile { min-height: 88px; display: flex; align-items: center; gap: 14px; padding: 16px; border-radius: 18px; color: #fff; background: linear-gradient(90deg,#172033,#2657d8); }
  .my-avatar { width: 56px; height: 56px; border-radius: 50%; object-fit: cover; background: rgba(255,255,255,.18); }
  .my-profile strong,.my-profile span { display: block; }
  .my-profile strong { font-size: 17px; }
  .my-profile span { margin-top: 7px; color: rgba(255,255,255,.85); font-size: 12px; }
  .my-action-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 0; margin-top: 14px; padding: 10px 8px; border: 1px solid rgba(255,255,255,.34); border-radius: 16px; background: #fff; }
  .my-action-grid button { height: 78px; margin: 0 4px; display: grid; place-content: center; justify-items: center; gap: 7px; border-radius: 14px; color: var(--mobile-text); font-size: 12px; background: #f4f7fb; }
  .my-action-grid button:active { background: var(--mobile-brand-soft); }
  .my-icon { width: 28px; height: 28px; display: block; object-fit: contain; }
  .my-services { margin-top: 16px; overflow: hidden; padding: 12px; border: 1px solid #eef3f8; border-radius: 24px; background: rgba(255,255,255,.99); }
  .my-services button { position: relative; width: 100%; height: 58px; display: grid; grid-template-columns: 38px 1fr 22px; align-items: center; gap: 12px; padding: 0 6px 0 8px; color: var(--mobile-text); font-size: 15px; font-weight: 700; text-align: left; background: transparent; }
  .my-services button:not(:last-child)::after { content: ""; position: absolute; left: 64px; right: 8px; bottom: 0; height: 1px; background: var(--mobile-line); }
  .my-services button:active { border-radius: 18px; background: #eaf1ff; }
  .my-services .logout-row { color: var(--mobile-orange); }
  .row-icon { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 50%; }
  .row-icon img { width: 21px; height: 21px; display: block; }
  .about-icon { background: #eaf1ff; }
  .cache-icon { background: #eaf8f8; }
  .logout-icon { background: #fff0ea; }
  .row-chevron { width: 22px; height: 22px; display: block; }
  .my-version { margin: 18px 0 0; padding-bottom: 6px; color: var(--mobile-muted); font-size: 12px; text-align: center; }
  .collection-active .topbar { display: none; }
  .collection-view { position: fixed; z-index: 205; inset: 0; overflow-y: auto; padding: env(safe-area-inset-top) 0 24px; color: var(--mobile-text); background: #fff; }
  .collection-heading { position: relative; height: 60px; display: grid; grid-template-columns: 52px 1fr 52px; align-items: center; margin: 0; }
  .collection-heading h2 { margin: 0; color: var(--mobile-text); font-size: 18px; font-weight: 500; text-align: center; }
  .collection-heading button { width: 46px; height: 46px; display: grid; place-items: center; padding: 0; border: 0; border-radius: 0; color: transparent; background: transparent; }
  .collection-back-button::before { content: ""; width: 11px; height: 11px; border-left: 2px solid #273241; border-bottom: 2px solid #273241; rotate: 45deg; }
  .collection-clear-button { justify-self: end; margin-right: 3px; }
  .collection-clear-button::before { content: ""; width: 24px; height: 24px; display: block; background: center/24px 24px no-repeat url("/assets/android/ic_clear.svg"); }
  .collection-clear-button::after { content: none; }
  .collection-tip { margin: 10px 0; color: #697386; font-size: 14px; text-align: center; }
  .collection-view .course-grid { grid-template-columns: 1fr; gap: 0; min-height: 0; padding: 0 16px 24px; }
  .collection-view .empty-state { min-height: calc(100dvh - 100px); border: 0; border-radius: 0; }
  .mobile-library-card { width: 100%; min-height: 128px; display: grid; grid-template-columns: 72px minmax(0,1fr) 18px; align-items: center; gap: 13px; padding: 14px 0; border-bottom: 1px solid var(--mobile-line); color: var(--mobile-text); text-align: left; background: transparent; }
  .mobile-library-poster { width: 72px; aspect-ratio: 2/3; display: block; overflow: hidden; border-radius: 7px; background: #e9eef4; }
  .mobile-library-poster img { width: 100%; height: 100%; display: block; object-fit: cover; }
  .mobile-library-copy { min-width: 0; display: grid; gap: 7px; }
  .mobile-library-copy strong { overflow: hidden; font-size: 15px; line-height: 21px; text-overflow: ellipsis; white-space: nowrap; }
  .mobile-library-copy small { overflow: hidden; color: var(--mobile-soft); font-size: 12px; line-height: 18px; text-overflow: ellipsis; white-space: nowrap; }
  .mobile-library-copy em { color: var(--mobile-brand); font-size: 11px; font-style: normal; }
  .mobile-library-progress { width: 100%; height: 3px; overflow: hidden; border-radius: 3px; background: #e7ecf2; }
  .mobile-library-progress i { height: 100%; display: block; border-radius: inherit; background: var(--mobile-brand); }
  .mobile-library-chevron { width: 9px; height: 9px; display: block; border-top: 2px solid #a6afbc; border-right: 2px solid #a6afbc; rotate: 45deg; }
  .mobile-library-empty { min-height: calc(100dvh - 120px); display: grid; place-content: center; justify-items: center; gap: 10px; padding: 40px 24px; color: var(--mobile-soft); text-align: center; }
  .mobile-library-empty img { width: 116px; height: 116px; display: block; object-fit: contain; opacity: .8; }
  .mobile-library-empty strong { color: var(--mobile-text); font-size: 17px; }
  .mobile-library-empty span { max-width: 260px; font-size: 13px; line-height: 20px; }
  .mobile-library-empty button { min-width: 126px; min-height: 40px; margin-top: 6px; border: 1px solid var(--mobile-brand); border-radius: 20px; color: var(--mobile-brand); background: #fff; }

  .detail-view { position: fixed; z-index: 200; inset: 0; overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; padding: 0; color: var(--mobile-text); background: var(--mobile-bg); }
  .study-workbench { width: 100%; height: auto; margin: 0; display: flex; flex-direction: column; gap: 0; }
  .player-shell { order: 0; height: max(180px,56.25vw); min-height: max(180px,56.25vw); max-height: max(180px,56.25vw); aspect-ratio: 16 / 9; flex: 0 0 auto; overscroll-behavior: none; touch-action: none; border: 0; border-radius: 0; box-shadow: none; }
  .player-message { max-width: calc(100% - 40px); color: #fff; font-size: 14px; }
  .player-message.loading { inset: 0; width: 100%; height: 100%; max-width: none; translate: 0; display: block; padding: 0; border: 0; border-radius: 0; background: transparent; pointer-events: none; }
  .player-message.loading::before { content: none; }
  .player-message.loading .player-loader { position: absolute; left: 50%; top: 50%; width: 30px; height: 30px; translate: -50% -50%; display: block; }
  .player-message.loading .player-loader i { position: absolute; translate: -50% -50%; display: block; border-radius: 50%; animation-duration: 1s; animation-timing-function: cubic-bezier(.15,.86,.785,.135); animation-iteration-count: infinite; }
  .player-message.loading .player-loader i:nth-child(1) { width: 8px; height: 8px; background: #00b2ff; animation-name: android-loading-dot-cyan; }
  .player-message.loading .player-loader i:nth-child(2) { width: 9px; height: 9px; background: #030061; animation-name: android-loading-dot-navy; }
  .player-message.loading .player-loader i:nth-child(3) { width: 6px; height: 6px; background: #4c41b6; animation-name: android-loading-dot-purple; }
  .player-message.loading #player-message-text { position: absolute; left: 12px; right: 12px; top: calc(50% + 50px); translate: 0 -50%; color: #fff; text-align: center; }
  .player-topshade { display: none; }
  .player-shell:is(:fullscreen,:-webkit-full-screen,.web-fullscreen) .player-topshade { display: none; }
  .video-center-button { display: none; }
  .mobile-player-back { position: absolute; z-index: 8; left: 20px; top: 6px; width: 38px; height: 38px; align-items: center; justify-content: center; overflow: hidden; color: transparent; background: transparent; }
  .mobile-player-back::before { content: ""; width: 26px; height: 26px; display: block; background: center/26px 26px no-repeat url("/assets/android/ic_player_back_plain.svg"); }
  .player-shell:is(:fullscreen,:-webkit-full-screen,.web-fullscreen) .mobile-player-back { left: 24px; top: 18px; width: auto; max-width: 300px; height: 40px; justify-content: flex-start; gap: 8px; padding: 0 12px; border: 1px solid rgba(255,255,255,.15); border-radius: 20px; color: transparent; font-size: 0; background: rgba(0,0,0,.2); }
  .player-shell:is(:fullscreen,:-webkit-full-screen,.web-fullscreen) .mobile-player-back::after { content: attr(data-fullscreen-title); min-width: 0; overflow: hidden; color: #fff; font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }
  .mobile-player-pip,.mobile-player-settings { position: absolute; z-index: 8; top: 6px; width: 34px; height: 34px; overflow: hidden; color: transparent; font-size: 0; border-radius: 50%; }
  .mobile-player-pip { right: 62px; padding: 3px; background: transparent; }
  .mobile-player-pip img { width: 28px; height: 28px; display: block; object-fit: contain; }
  .mobile-player-settings { right: 20px; padding: 5px; background: rgba(255,255,255,.12); }
  .mobile-player-settings::before { content: ""; width: 24px; height: 24px; display: block; background: center/24px 24px no-repeat url("/assets/android/ic_player_more.svg"); }
  .mobile-player-lock { position: absolute; z-index: 9; right: 24px; top: 50%; translate: 0 -50%; width: 40px; height: 40px; display: none; place-items: center; padding: 6px; background: transparent; }
  .mobile-player-lock img { width: 28px; height: 28px; display: block; object-fit: contain; }
  .player-shell.controls-hidden .mobile-player-back,.player-shell.controls-hidden .mobile-player-pip,.player-shell.controls-hidden .mobile-player-settings { opacity: 0; pointer-events: none; }
  .player-controls { padding: 16px 18px 8px; background: linear-gradient(0deg,rgba(0,0,0,.94),rgba(0,0,0,.72) 50%,transparent); }
  .player-progress-row { gap: 10px; margin-bottom: 2px; }
  .player-action-row { height: 34px; gap: 4px; }
  .player-progress-row>span { min-width: 42px; color: rgba(255,255,255,.9); font-size: 12px; }
  .player-progress-row>span:last-child { text-align: right; }
  .seek-wrap input { --seek-progress: 0%; width: 100%; height: 24px; margin: 0; appearance: none; -webkit-appearance: none; background: transparent; touch-action: pan-x; }
  .seek-wrap input::-webkit-slider-runnable-track { height: 3px; border-radius: 2px; background: linear-gradient(to right,#fff 0 var(--seek-progress),rgba(255,255,255,.33) var(--seek-progress) 100%); }
  .seek-wrap input::-webkit-slider-thumb { width: 10px; height: 10px; margin-top: -3.5px; appearance: none; -webkit-appearance: none; border: 0; border-radius: 50%; background: #fff; box-shadow: none; }
  .seek-wrap input::-moz-range-track { height: 3px; border: 0; border-radius: 2px; background: rgba(255,255,255,.33); }
  .seek-wrap input::-moz-range-progress { height: 3px; border-radius: 2px; background: #fff; }
  .seek-wrap input::-moz-range-thumb { width: 10px; height: 10px; border: 0; border-radius: 50%; background: #fff; }
  .player-action-row button { width: 34px; min-width: 34px; min-height: 34px; overflow: hidden; padding: 0; border-radius: 50%; color: transparent; font-size: 0; background-color: transparent; background-position: center; background-repeat: no-repeat; background-size: 26px 26px; }
  .player-action-row .control-spacer { display: block; }
  #previous-episode-button,#next-episode-button,#quality-button,#speed-button,#ratio-button,#mute-button,#volume-input,#episode-panel-button { display: none; }
  #player-play-button { order: 0; display: grid; place-items: center; background-color: transparent; background-image: none; }
  #player-play-button .player-state-icon { width: 26px; height: 26px; display: block; object-fit: contain; pointer-events: none; }
  #player-play-button .player-control-label { display: none; }
  #previous-episode-button { order: 1; }
  #next-episode-button { order: 2; }
  .player-action-row .control-spacer { order: 3; }
  #episode-panel-button { order: 4; }
  #ratio-button { order: 5; }
  #speed-button { order: 6; }
  #quality-button { order: 7; }
  #fullscreen-button { order: 8; }
  #fullscreen-button { margin-left: 7px; background-image: url("/assets/android/ic_player_fullscreen.png"); }
  .player-shell:is(:fullscreen,:-webkit-full-screen,.web-fullscreen) .mobile-player-settings { display: none; }
  .player-shell:is(:fullscreen,:-webkit-full-screen,.web-fullscreen) .mobile-player-pip { right: 20px; }
  .player-shell:is(:fullscreen,:-webkit-full-screen,.web-fullscreen) .mobile-player-lock { display: grid; }
  .player-shell:is(:fullscreen,:-webkit-full-screen,.web-fullscreen).controls-hidden:not(.player-locked) .mobile-player-lock,.player-shell.player-locked.lock-control-hidden .mobile-player-lock { opacity: 0; pointer-events: none; }
  .player-shell.player-locked .player-controls,.player-shell.player-locked .mobile-player-back,.player-shell.player-locked .mobile-player-pip,.player-shell.player-locked .player-topshade { opacity: 0; pointer-events: none; }
  .player-shell:is(:fullscreen,:-webkit-full-screen,.web-fullscreen) #previous-episode-button { display: block; margin-left: 4px; background-color: rgba(255,255,255,.12); background-image: url("/assets/android/ic_player_prev.png"); }
  .player-shell:is(:fullscreen,:-webkit-full-screen,.web-fullscreen) #next-episode-button { display: block; margin-left: 4px; background-color: rgba(255,255,255,.12); background-image: url("/assets/android/ic_player_next.png"); }
  .player-shell:is(:fullscreen,:-webkit-full-screen,.web-fullscreen) :is(#episode-panel-button,#ratio-button,#speed-button,#quality-button) { width: auto; min-width: 58px; height: 30px; min-height: 30px; display: block; margin-left: 7px; padding: 0 13px; border: 1px solid rgba(255,255,255,.12); border-radius: 15px; color: #fff; font-size: 12px; background: rgba(255,255,255,.1); }
  .player-shell:is(:fullscreen,:-webkit-full-screen,.web-fullscreen) #ratio-button { min-width: 70px; }
  .player-shell:is(:fullscreen,:-webkit-full-screen,.web-fullscreen) :is(#speed-button,#quality-button) { font-size: 0; }
  .player-shell:is(:fullscreen,:-webkit-full-screen,.web-fullscreen) :is(#speed-button,#quality-button)::before { content: attr(data-mobile-label); font-size: 12px; }
  .player-shell:is(:fullscreen,:-webkit-full-screen,.web-fullscreen) #ratio-button::before { content: "比例 "; }
  .mobile-detail-heading { order: 1; flex-direction: column; gap: 14px; margin: 0; padding: 16px 16px 14px; border-bottom: 1px solid var(--mobile-line); background: var(--mobile-panel); }
  .mobile-detail-title-row,.mobile-detail-title-row>div { min-width: 0; display: block; }
  .mobile-detail-heading h2 { margin: 0; overflow: hidden; color: var(--mobile-text); font-size: 18px; font-weight: 700; line-height: 1.45; text-overflow: ellipsis; white-space: nowrap; }
  #mobile-detail-episode { margin: 5px 0 0; overflow: hidden; color: var(--mobile-soft); font-size: 13px; line-height: 20px; text-overflow: ellipsis; white-space: nowrap; }
  .mobile-detail-action-row { display: grid !important; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px !important; }
  .mobile-detail-action-row .mobile-detail-action { min-width: 0; min-height: 60px; height: 60px; box-sizing: border-box; display: grid; place-items: center; align-content: center; gap: 4px; padding: 5px 4px; border: 1px solid transparent; border-radius: 12px; color: var(--mobile-brand); font-size: 12px; font-weight: 600; line-height: 16px; background: #f4f7ff; transition: background-color .16s ease,border-color .16s ease,transform .12s ease,opacity .16s ease; -webkit-tap-highlight-color: transparent; }
  .mobile-detail-action-row .mobile-detail-action img { width: 24px; height: 24px; display: block; object-fit: contain; }
  .mobile-detail-action-row .mobile-detail-action:active { transform: scale(.97); background: #e8efff; }
  .mobile-detail-action-row .mobile-detail-action:disabled { opacity: .42; cursor: not-allowed; transform: none; }
  #mobile-favorite-button.active { border-color: rgba(30,94,255,.3); color: var(--mobile-brand); background: var(--mobile-brand-soft); }
  .episode-panel { order: 2; min-height: 0; padding: 6px 12px 24px; border: 0; border-radius: 0; color: var(--mobile-text); background: transparent; }
  .line-title { display: block; margin: 6px 2px 0; color: var(--mobile-text); font-size: 15px; font-weight: 700; }
  .line-tabs { height: 40px; gap: 10px; margin: 0 -2px; padding: 5px 0; }
  .line-tabs button { position: relative; height: 30px; padding: 5px 10px 1px; border: 1px solid var(--mobile-line); border-radius: 18px; color: var(--mobile-text); font-size: 13px; background: #fff; }
  .line-tabs button.active { border-color: var(--mobile-line); color: var(--mobile-text); background: #fff; }
  .line-tabs button.active::after { content: ""; position: absolute; left: 15px; right: 15px; bottom: 1px; height: 4px; border-radius: 2px; background: var(--mobile-brand); }
  .episode-heading { display: flex; margin: 6px 2px 0; }
  .episode-heading h3 { margin: 0; color: var(--mobile-text); font-size: 15px; font-weight: 700; }
  .episode-heading button { min-height: 30px; display: flex; align-items: center; gap: 4px; padding: 5px 0; color: var(--mobile-text); background: transparent; }
  .episode-heading button img { width: 18px; height: 18px; display: block; }
  .episode-summary { display: none; }
  .episode-list { display: grid; gap: 8px; max-height: none; margin-top: 8px; overflow: visible; }
  .episode-button.mobile-episode-row { width: 100%; min-height: 54px; min-width: 0; display: grid; grid-template-columns: 28px minmax(0,1fr) auto; align-items: center; gap: 10px; padding: 9px 12px; border: 1px solid var(--mobile-line); border-radius: 10px; color: var(--mobile-text); font-size: 13px; text-align: left; background: #fff; }
  .episode-button.mobile-episode-row.active { border-color: var(--mobile-brand); color: var(--mobile-text); background: var(--mobile-brand-soft); }
  .episode-index-label { color: var(--mobile-muted); font-size: 12px; text-align: center; }
  .episode-name { min-width: 0; line-height: 19px; overflow-wrap: anywhere; white-space: normal; }
  .episode-playing-label { color: var(--mobile-brand); font-size: 12px; white-space: nowrap; }
  #episode-pager { height: 34px; gap: 8px; margin: 10px 0 2px; overflow-x: auto; scrollbar-width: none; }
  #episode-pager.hidden { display: none !important; }
  #episode-pager button { height: 34px; padding: 0 11px; border: 1px solid var(--mobile-line); border-radius: 8px; color: var(--mobile-soft); background: #f6f8fb; }
  #episode-pager button.active { color: #fff; border-color: var(--mobile-brand); background: var(--mobile-brand); }
  .desktop-player-settings,.player-episode-drawer,.desktop-episode-head { display: none !important; }
  .player-shell:is(:fullscreen,:-webkit-full-screen,.web-fullscreen) .player-episode-drawer:not(.hidden) { z-index: 15; top: 0; right: 0; bottom: 0; width: min(300px,44%); display: block !important; overflow-y: auto; padding: 14px; color: var(--mobile-text); border: 1px solid var(--mobile-line); border-radius: 18px 0 0 18px; background: rgba(255,255,255,.98); box-shadow: -10px 0 34px rgba(0,0,0,.3); }
  .player-shell:is(:fullscreen,:-webkit-full-screen,.web-fullscreen) .player-episode-drawer .drawer-head,.player-shell:is(:fullscreen,:-webkit-full-screen,.web-fullscreen) .player-episode-drawer .line-tabs { display: none; }
  .player-shell:is(:fullscreen,:-webkit-full-screen,.web-fullscreen) .player-episode-drawer .episode-pager { display: flex !important; height: 30px; gap: 8px; margin: 0 0 8px; overflow-x: auto; }
  .player-shell:is(:fullscreen,:-webkit-full-screen,.web-fullscreen) .player-episode-drawer .episode-pager.hidden { display: none !important; }
  .player-shell:is(:fullscreen,:-webkit-full-screen,.web-fullscreen) .player-episode-drawer .episode-pager button { height: 30px; padding: 0 10px; border: 1px solid var(--mobile-line); border-radius: 8px; color: var(--mobile-text); background: var(--mobile-panel); }
  .player-shell:is(:fullscreen,:-webkit-full-screen,.web-fullscreen) .player-episode-drawer .episode-pager button.active { color: #fff; border-color: var(--mobile-brand); background: var(--mobile-brand); }
  .player-shell:is(:fullscreen,:-webkit-full-screen,.web-fullscreen) .player-episode-drawer .drawer-episode-list { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 20px; }
  .player-shell:is(:fullscreen,:-webkit-full-screen,.web-fullscreen) .player-episode-drawer .episode-button { width: 100%; min-width: 0; min-height: 36px; padding: 8px 10px; border: 1px solid var(--mobile-line); border-radius: 10px; color: var(--mobile-text); text-align: center; background: var(--mobile-panel); }
  .player-shell:is(:fullscreen,:-webkit-full-screen,.web-fullscreen) .player-episode-drawer .episode-button.active { color: #fff; border-color: var(--mobile-brand); background: var(--mobile-brand); }
  .course-intro[open] { display: block; }
  .course-intro { box-sizing: border-box; width: 100%; max-width: none; max-height: 82vh; max-height: 82dvh; margin: 0; overflow-y: auto; padding: 8px 16px calc(22px + env(safe-area-inset-bottom)); border: 0; border-radius: 18px 18px 0 0; box-shadow: none; }
  .course-intro::backdrop { background: rgba(0,0,0,.68); backdrop-filter: none; }
  .course-intro .dialog-header { min-height: 52px; padding: 0; border: 0; }
  .course-intro .dialog-header h2 { font-size: 18px; }
  .course-intro-layout { width: 100%; display: grid; grid-template-columns: 92px minmax(0,1fr); align-items: start; gap: 14px; }
  .course-intro-poster { width: 92px; height: auto; aspect-ratio: 2/3; flex: none; overflow: hidden; border-radius: 7px; background: #eef2f6; }
  .course-intro-poster img { width: 100%; height: 100%; display: block; object-fit: cover; }
  .course-intro h3 { margin: 0 0 8px; color: var(--mobile-text); font-size: 16px; line-height: 23px; overflow-wrap: anywhere; }
  .course-intro #detail-content { margin: 0; color: var(--mobile-soft); font-size: 14px; line-height: 22px; white-space: pre-wrap; overflow-wrap: anywhere; }
  .detail-active .main-content { padding-bottom: 0; }
  .detail-active .bottom-nav,.collection-active .bottom-nav { display: none; }

  .bottom-nav { position: fixed; z-index: 120; left: 16px; right: 16px; bottom: max(8px,env(safe-area-inset-bottom)); height: 60px; display: grid; grid-template-columns: repeat(2,1fr); padding: 0; border: 1px solid #dde6ebf2; border-radius: 22px; background: rgba(255,255,255,.95); box-shadow: none; overflow: hidden; }
  .bottom-nav button { min-height: 60px; display: grid; place-content: center; justify-items: center; gap: 3px; color: #8994a3; font-size: 12px; background: transparent; }
  .bottom-nav button.active { color: var(--mobile-brand); font-weight: 700; }
  .bottom-icon { width: 22px; height: 22px; position: relative; display: block; flex: none; color: inherit; background: currentColor; -webkit-mask-position: center; mask-position: center; -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-size: contain; mask-size: contain; }
  .bottom-icon-home { -webkit-mask-image: url("/assets/android/ic_home.png"); mask-image: url("/assets/android/ic_home.png"); }
  .bottom-icon-my { -webkit-mask-image: url("/assets/android/ic_my.png"); mask-image: url("/assets/android/ic_my.png"); }

  .app-dialog { border-color: var(--mobile-line); color: var(--mobile-text); background: #fff; }
  .app-dialog::backdrop,.player-failure-dialog::backdrop { background: rgba(17,24,39,.58); backdrop-filter: none; }
  .about-dialog,.course-intro,.player-settings-sheet,.episode-selector-sheet { position: fixed; inset: auto 0 0; margin: 0; }
  .dialog-header { border-color: var(--mobile-line); }
  .dialog-content { color: var(--mobile-soft); }
  .notice-dialog { width: min(330px,calc(100vw - 36px)); padding: 20px 18px 16px; border: 1px solid #e6ebf2; border-radius: 20px; background: #fff; box-shadow: 0 22px 64px rgba(18,32,51,.2); }
  .notice-dialog .notice-icon { background: var(--mobile-brand-soft); }
  .notice-dialog .notice-icon img { width: 25px; height: 25px; display: block; }
  .confirm-dialog { width: min(328px,calc(100vw - 36px)); padding: 24px 22px 20px; overflow: hidden; border: 0; border-radius: 22px; color: var(--mobile-text); background: #fff; box-shadow: 0 22px 64px rgba(18,32,51,.2); }
  .confirm-icon { width: 54px; height: 54px; display: grid; place-items: center; margin: 0 auto 14px; border-radius: 50%; background: #fff0ea; }
  .confirm-icon img { width: 28px; height: 28px; display: block; }
  .confirm-dialog[data-kind="cache"] .confirm-icon { background: var(--mobile-brand-soft); }
  .confirm-dialog .dialog-header { min-height: 0; padding: 0; border: 0; }
  .confirm-dialog .dialog-header h2 { width: 100%; margin: 0; color: var(--mobile-text); font-size: 19px; font-weight: 700; line-height: 27px; text-align: center; }
  .confirm-dialog .dialog-content { min-height: 0; margin: 9px 0 22px; padding: 0; color: var(--mobile-soft); font-size: 14px; line-height: 21px; text-align: center; }
  .confirm-dialog .dialog-actions { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; padding: 0; }
  .confirm-dialog .dialog-actions button { height: 42px; min-height: 42px; padding: 0 12px; border: 1px solid var(--mobile-line); border-radius: 10px; color: var(--mobile-soft); font-size: 14px; background: #fff; }
  .confirm-dialog .dialog-actions button + button { color: #fff; border-color: var(--mobile-brand); background: var(--mobile-brand); }
  .confirm-dialog[data-kind="logout"] .dialog-actions button + button { border-color: var(--mobile-orange); background: var(--mobile-orange); }
  .about-dialog { box-sizing: border-box; width: 100%; max-width: none; height: auto; max-height: min(74dvh,calc(100dvh - env(safe-area-inset-top) - 16px)); margin: 0; overflow: hidden; padding: 8px 20px calc(24px + env(safe-area-inset-bottom)); border: 0; border-radius: 20px 20px 0 0; }
  .about-dialog[open] { display: flex; flex-direction: column; }
  .about-dialog>.sheet-handle { width: 36px; height: 4px; flex: 0 0 auto; margin: 2px auto 0; border-radius: 4px; background: #d9e0e8; }
  .about-dialog .dialog-header { min-height: 50px; padding: 0; border: 0; }
  .about-dialog .dialog-header h2 { color: var(--mobile-text); font-size: 18px; }
  .about-dialog .about-close-button { width: 42px; height: 42px; display: grid; place-items: center; padding: 0; border: 1px solid var(--mobile-line); border-radius: 50%; background: #f5f7fa; }
  .about-dialog .about-close-button img { width: 20px; height: 20px; display: block; }
  .about-logo { height: 106px; display: grid; place-items: center; }
  .about-logo img { width: 86px; height: 86px; display: block; object-fit: contain; }
  .about-name { display: block; color: var(--mobile-text); font-size: 18px; text-align: center; }
  .about-version { display: block; margin-top: 4px; color: var(--mobile-muted); font-size: 12px; text-align: center; }
  .about-dialog .dialog-content { min-height: 0; max-height: 28dvh; overflow-y: auto; margin: 18px 0 0; padding: 0 0 12px; color: var(--mobile-soft); font-size: 14px; line-height: 24px; white-space: pre-wrap; overscroll-behavior: contain; }
  .about-desktop-actions { display: none; }
  .sheet-close-button { width: 42px; height: 42px; min-height: 42px; display: grid; place-items: center; padding: 0; border: 1px solid var(--mobile-line); border-radius: 50%; background: #f5f7fa; }
  .sheet-close-button img { width: 20px; height: 20px; display: block; }
  .player-settings-sheet { box-sizing: border-box; width: 100%; max-width: none; height: auto; margin: 0; overflow: hidden; padding: 10px 18px calc(20px + env(safe-area-inset-bottom)); border: 0; border-radius: 20px 20px 0 0; }
  .mobile-v2 .player-settings-sheet { max-height: min(var(--mobile-v2-sheet-max-height,82dvh),calc(100dvh - env(safe-area-inset-top) - 12px)); }
  .player-settings-sheet[open] { display: flex; flex-direction: column; }
  .player-settings-sheet .sheet-handle { width: 36px; height: 4px; margin: 0 auto; border-radius: 4px; background: #d9e0e8; }
  .player-settings-sheet .dialog-header { min-height: 54px; padding: 8px 0 0; border: 0; }
  .player-settings-sheet .dialog-header h2 { font-size: 17px; }
  .episode-selector-sheet { width: 100%; max-width: none; height: min(760px,82dvh); max-height: calc(100dvh - env(safe-area-inset-top)); margin: 0; overflow: hidden; padding: 4px 14px calc(18px + env(safe-area-inset-bottom)); border: 0; border-radius: 18px 18px 0 0; translate: 0 var(--sheet-drag-y,0); transition: translate .18s ease; }
  .episode-selector-sheet[open] { display: flex; flex-direction: column; }
  .episode-selector-sheet.sheet-dragging { transition: none; }
  .episode-sheet-handle { position: relative; width: 52px; height: 28px; display: block; margin: 0 auto 2px; padding: 0; border: 0; border-radius: 0; background: transparent; touch-action: none; }
  .episode-sheet-handle::after { content: ""; position: absolute; left: 8px; top: 12px; width: 36px; height: 3px; border-radius: 10px; background: var(--mobile-line); }
  .episode-selector-sheet .dialog-header { align-items: flex-start; min-height: 58px; padding: 0 0 8px; border: 0; }
  .episode-selector-sheet .dialog-header h2 { margin: 0; font-size: 18px; }
  .episode-selector-sheet .dialog-header p { margin: 4px 0 0; color: var(--mobile-soft); font-size: 12px; }
  .episode-range-options { display: flex; justify-content: center; gap: 8px; overflow-x: auto; min-height: 38px; margin: 0 4px 10px; scrollbar-width: none; }
  .episode-range-options button { flex: none; min-width: 56px; height: 34px; padding: 0 8px; border: 1px solid var(--mobile-line); border-radius: 8px; color: var(--mobile-soft); font-size: 12px; background: #f6f8fb; }
  .episode-range-options button.active { border-color: var(--mobile-brand); color: var(--mobile-brand); font-weight: 700; background: var(--mobile-brand-soft); }
  .episode-range-options button.episode-page-arrow { min-width: 36px; width: 36px; padding: 0; font-size: 20px; }
  .episode-range-options button:disabled { opacity: .35; }
  .mobile-all-episode-options { min-height: 0; display: grid; grid-template-columns: 1fr; gap: 8px; overflow-y: auto; overscroll-behavior: contain; }
  .mobile-all-episode-options .empty-state { grid-column: 1/-1; }
  .mobile-all-episode-options button { min-height: 50px; display: grid; grid-template-columns: 28px minmax(0,1fr) auto; align-items: center; gap: 10px; overflow: visible; padding: 8px 12px; border: 1px solid var(--mobile-line); border-radius: 10px; color: var(--mobile-text); font-size: 13px; line-height: 19px; text-align: left; white-space: normal; overflow-wrap: anywhere; background: var(--mobile-panel); }
  .mobile-all-episode-options button.active { border-color: var(--mobile-brand); color: var(--mobile-text); background: var(--mobile-brand-soft); }
  .settings-groups { min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 0 0 2px; }
  .settings-groups section { margin: 0; padding: 14px 0; border-top: 1px solid #f0f3f7; }
  .settings-groups section:first-child { border-top: 0; }
  .settings-groups section>span { display: block; margin-bottom: 10px; color: var(--mobile-text); font-size: 14px; font-weight: 700; line-height: 20px; }
  .settings-groups section>div,.settings-actions { display: flex; flex-wrap: nowrap; gap: 8px; overflow-x: auto; scrollbar-width: none; }
  .settings-groups button { min-width: 62px; height: 40px; padding: 0 14px; border: 1px solid var(--mobile-line); border-radius: 10px; color: var(--mobile-text); font-size: 13px; font-weight: 600; background: #f7f9fc; transition: color .16s ease,border-color .16s ease,background-color .16s ease,transform .12s ease,opacity .16s ease; -webkit-tap-highlight-color: transparent; }
  .settings-groups button:active { transform: scale(.97); }
  .settings-groups button:disabled { opacity: .42; transform: none; }
  .mobile-setting-lines button { flex: none; }
  #mobile-speed-options,#mobile-quality-options { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); overflow: visible; }
  #mobile-speed-options button,#mobile-quality-options button { min-width: 0; }
  #mobile-ratio-button { min-width: 76px; }
  .settings-actions { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); overflow: visible; }
  .settings-actions button { display: flex; align-items: center; justify-content: center; gap: 7px; }
  .settings-actions button img { width: 19px; height: 19px; display: block; }
  .settings-groups button.active { border-color: var(--mobile-brand); color: var(--mobile-brand); background: var(--mobile-brand-soft); box-shadow: inset 0 0 0 1px rgba(30,94,255,.08); }
  .mobile-v2 .player-failure-dialog[open] { box-sizing: border-box; position: fixed; inset: max(12px,var(--mobile-v2-safe-top,0px)) max(12px,var(--mobile-v2-safe-right,0px)) max(12px,var(--mobile-v2-safe-bottom,0px)) max(12px,var(--mobile-v2-safe-left,0px)); max-height: calc(var(--mobile-v2-viewport-height) - var(--mobile-v2-safe-top,0px) - var(--mobile-v2-safe-bottom,0px) - 24px); margin: auto; overflow-y: auto; }
  .player-failure-icon img { width: 28px; height: 28px; display: block; }
  .toast-region { left: 14px; right: 14px; bottom: calc(76px + env(safe-area-inset-bottom)); }
  .toast { max-width: none; border-color: #d7e0ea; color: var(--mobile-text); background: #fff; }
  .route-view { position: fixed; z-index: 210; inset: 0; display: block; overflow-y: auto; color: var(--mobile-text); background: #fff; }
  .route-titlebar { position: relative; height: 60px; display: grid; place-items: center; border-bottom: 1px solid #edf1f5; }
  .route-titlebar h2 { margin: 0; font-size: 18px; font-weight: 500; }
  .route-titlebar button { position: absolute; left: 4px; top: 7px; width: 46px; height: 46px; background: transparent; }
  .route-titlebar button::before { content: ""; width: 11px; height: 11px; display: block; margin: auto; border-left: 2px solid #273241; border-bottom: 2px solid #273241; rotate: 45deg; }
  .route-content { padding: 22px 16px 80px; }
  .route-content h3 { margin: 0; color: var(--mobile-text); font-size: 19px; }
  .route-subtitle { margin: 7px 0 20px; color: var(--mobile-soft); font-size: 13px; }
  .route-options { display: grid; gap: 10px; }
  .route-options button { width: 100%; min-height: 76px; display: grid; grid-template-columns: 42px minmax(0,1fr) 22px; align-items: center; gap: 12px; padding: 12px 14px; border: 1px solid var(--mobile-line); border-radius: 14px; color: var(--mobile-text); text-align: left; background: #fff; }
  .route-options button.active { border-color: var(--mobile-brand); color: var(--mobile-text); background: var(--mobile-brand-soft); }
  .route-symbol { width: 42px; height: 42px; display: block; border-radius: 12px; background: #eef3fa center/24px 24px no-repeat url("/assets/android/cangku.png"); }
  .route-copy { min-width: 0; display: grid; gap: 5px; }
  .route-copy strong,.route-copy small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .route-copy strong { font-size: 15px; }
  .route-copy small { color: var(--mobile-soft); font-size: 12px; font-weight: 400; }
  .route-radio { width: 18px; height: 18px; display: block; border: 2px solid #c4ccd7; border-radius: 50%; }
  .route-options button.active .route-radio { border: 5px solid var(--mobile-brand); }
  .route-hint { display: grid; gap: 8px; margin-top: 20px; padding: 14px; border-radius: 12px; color: var(--mobile-soft); font-size: 12px; line-height: 19px; background: #f5f8fc; }
  .route-hint strong { color: var(--mobile-text); font-size: 13px; }
  .route-hint button { justify-self: start; padding: 0; color: var(--mobile-brand); background: transparent; }
  .route-options.is-loading { pointer-events: none; opacity: .55; }
  .route-active .topbar,.route-active .bottom-nav { display: none; }
  .modal-mask { padding: 18px; }
  .library-modal { max-height: calc(100dvh - 36px); padding: 18px; }
  .library-grid { grid-template-columns: 1fr; }
}
@media (min-width: 768px) and (max-width: 1366px) and (min-height: 600px) {
  .mobile-v2 .main-content { padding-bottom: calc(88px + env(safe-area-inset-bottom)); }
  .mobile-v2 .topbar,
  .mobile-v2 #home-view { box-sizing: border-box; width: min(calc(100% - 48px),1120px); margin-right: auto; margin-left: auto; }
  .mobile-v2 .topbar { padding-right: 0; padding-left: 0; }
  .mobile-v2 #home-view { padding-right: 0; padding-left: 0; }
  .mobile-v2 #home-view .category-tabs { margin-right: 0; margin-left: 0; padding-right: 4px; padding-left: 4px; }
  .mobile-v2 #home-view .banner-section { height: clamp(190px,24vw,260px); margin-right: 0; margin-left: 0; }
  .mobile-v2 #home-view .banner-item { height: 100%; }
  .mobile-v2 #home-view .course-grid { grid-template-columns: repeat(3,minmax(0,200px)); justify-content: center; gap: 22px 14px; }
  .mobile-v2 #home-view .course-card,
  .mobile-v2 #home-view .poster { height: auto; }
  .mobile-v2 #home-view .poster { aspect-ratio: 2 / 3; }
  .mobile-v2 .source-menu { width: min(calc(100vw - 48px),640px); max-height: min(82dvh,calc(100dvh - env(safe-area-inset-top) - 12px)); }
  .mobile-v2 .my-view { box-sizing: border-box; width: min(calc(100% - 48px),760px); margin-right: auto; margin-left: auto; padding-top: calc(24px + env(safe-area-inset-top)); }
  .mobile-v2 .collection-heading,
  .mobile-v2 .collection-view .course-grid,
  .mobile-v2 .collection-tip { box-sizing: border-box; width: min(calc(100% - 48px),760px); margin-right: auto; margin-left: auto; }
  .mobile-v2 .route-content { box-sizing: border-box; width: min(calc(100% - 48px),760px); margin: 0 auto; }
  .mobile-v2 .bottom-nav { right: auto; left: 50%; width: min(calc(100vw - 48px),520px); transform: translateX(-50%); }
  .mobile-v2 :is(.about-dialog,.course-intro,.player-settings-sheet,.episode-selector-sheet) { right: 0; left: 0; width: min(calc(100vw - 48px),640px); max-width: 640px; margin-right: auto; margin-left: auto; border-radius: 22px 22px 0 0; }
  .mobile-v2 .episode-selector-sheet { height: min(720px,78dvh); }
  .mobile-v2 .mobile-all-episode-options { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .mobile-v2 .detail-view { padding: 24px 0 calc(32px + env(safe-area-inset-bottom)); }
  .mobile-v2 .detail-view .study-workbench { width: min(calc(100% - 48px),900px); margin: 0 auto; gap: 16px; }
  .mobile-v2 .detail-view .player-shell { width: 100%; height: auto; min-height: 0; max-height: none; aspect-ratio: 16 / 9; border: 0; border-radius: 20px; }
  .mobile-v2 .detail-view .mobile-detail-heading { border: 1px solid var(--mobile-line); border-radius: 18px; }
  .mobile-v2 .detail-view .episode-panel { padding: 16px 18px 22px; border: 1px solid var(--mobile-line); border-radius: 18px; background: var(--mobile-panel); }
}
@media (min-width: 980px) and (max-width: 1366px) and (min-height: 600px) {
  .mobile-v2 #home-view .course-grid { grid-template-columns: repeat(4,minmax(0,200px)); }
}
@media (min-width: 1024px) and (max-width: 1366px) and (min-height: 600px) and (orientation: landscape) {
  .mobile-v2 .detail-view .study-workbench { width: min(calc(100% - 48px),1280px); display: grid; grid-template-columns: minmax(0,2fr) minmax(320px,.9fr); grid-template-rows: auto minmax(0,1fr); align-items: start; gap: 16px; }
  .mobile-v2 .detail-view .player-shell { grid-column: 1; grid-row: 1 / span 2; }
  .mobile-v2 .detail-view .mobile-detail-heading { grid-column: 2; grid-row: 1; }
  .mobile-v2 .detail-view .episode-panel { grid-column: 2; grid-row: 2; max-height: calc(100dvh - 246px); overflow-y: auto; overscroll-behavior: contain; }
}
@media (orientation: landscape) and (max-height: 500px) {
  .mobile-v2 .player-failure-dialog[open] {
    width: min(360px,calc(100vw - var(--mobile-v2-safe-left,0px) - var(--mobile-v2-safe-right,0px) - 32px));
    max-height: calc(100dvh - var(--mobile-v2-safe-top,0px) - var(--mobile-v2-safe-bottom,0px) - 20px);
    padding: 16px 20px 14px;
  }
  .mobile-v2 .player-failure-dialog h2 { margin-top: 10px; }
  .mobile-v2 .player-failure-dialog p { margin-top: 8px; line-height: 1.5; }
  .mobile-v2 .player-failure-actions { margin-top: 14px; }
  .mobile-v2 .detail-view {
    height: 100dvh;
    max-height: 100dvh;
    overflow: hidden;
    overscroll-behavior: none;
  }
  .mobile-v2 .detail-view .study-workbench {
    width: 100vw;
    height: 100dvh;
    max-height: 100dvh;
    overflow: hidden;
  }
  .mobile-v2 .detail-view .player-shell {
    width: 100vw;
    height: 100dvh;
    min-height: 0;
    max-height: 100dvh;
    aspect-ratio: auto;
    flex: 0 0 100dvh;
    border-radius: 0;
  }
  .mobile-v2 .detail-view .mobile-detail-heading,
  .mobile-v2 .detail-view .episode-panel {
    display: none;
  }
  .mobile-v2 .detail-view .mobile-player-back {
    left: calc(16px + env(safe-area-inset-left));
    top: calc(8px + env(safe-area-inset-top));
    width: auto;
    max-width: min(320px,45vw);
    height: 40px;
    justify-content: flex-start;
    gap: 8px;
    padding: 0 12px;
    border: 1px solid rgba(255,255,255,.15);
    border-radius: 20px;
    color: transparent;
    font-size: 0;
    background: rgba(0,0,0,.2);
  }
  .mobile-v2 .detail-view .mobile-player-back::after {
    content: attr(data-fullscreen-title);
    min-width: 0;
    overflow: hidden;
    color: #fff;
    font-size: 14px;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .mobile-v2 .detail-view .mobile-player-settings { display: none; }
  .mobile-v2 .detail-view .mobile-player-pip {
    top: calc(8px + env(safe-area-inset-top));
    right: calc(16px + env(safe-area-inset-right));
  }
  .mobile-v2 .detail-view .mobile-player-lock {
    right: calc(16px + env(safe-area-inset-right));
    display: grid;
  }
  .mobile-v2 .detail-view .player-controls {
    padding-right: calc(18px + env(safe-area-inset-right));
    padding-bottom: calc(8px + env(safe-area-inset-bottom));
    padding-left: calc(18px + env(safe-area-inset-left));
  }
  .mobile-v2 .detail-view .player-shell #previous-episode-button {
    display: block;
    margin-left: 4px;
    background-color: rgba(255,255,255,.12);
    background-image: url("/assets/android/ic_player_prev.png");
  }
  .mobile-v2 .detail-view .player-shell #next-episode-button {
    display: block;
    margin-left: 4px;
    background-color: rgba(255,255,255,.12);
    background-image: url("/assets/android/ic_player_next.png");
  }
  .mobile-v2 .detail-view .player-shell :is(#episode-panel-button,#ratio-button,#speed-button,#quality-button) {
    width: auto;
    min-width: 58px;
    height: 30px;
    min-height: 30px;
    display: block;
    margin-left: 7px;
    padding: 0 13px;
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 15px;
    color: #fff;
    font-size: 12px;
    background: rgba(255,255,255,.1);
  }
  .mobile-v2 .detail-view .player-shell #ratio-button { min-width: 70px; }
  .mobile-v2 .detail-view .player-shell :is(#speed-button,#quality-button) { font-size: 0; }
  .mobile-v2 .detail-view .player-shell :is(#speed-button,#quality-button)::before {
    content: attr(data-mobile-label);
    font-size: 12px;
  }
  .mobile-v2 .detail-view .player-shell #ratio-button::before { content: "比例 "; }
  .mobile-v2 .detail-view .player-shell .player-episode-backdrop:not(.hidden) {
    position: absolute;
    z-index: 18;
    inset: 0;
    display: block !important;
    width: 100%;
    height: 100%;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: rgba(4,8,14,.34);
    -webkit-backdrop-filter: blur(1px);
    backdrop-filter: blur(1px);
    touch-action: manipulation;
  }
  .mobile-v2 .detail-view .player-shell .player-episode-drawer:not(.hidden) {
    --drawer-drag-x: 0px;
    box-sizing: border-box;
    position: absolute;
    z-index: 19;
    top: 0;
    right: 0;
    bottom: 0;
    width: clamp(300px,42vw,420px);
    height: min(100%,var(--mobile-v2-viewport-height,100dvh));
    max-height: var(--mobile-v2-viewport-height,100dvh);
    display: flex !important;
    flex-direction: column;
    overflow: hidden;
    padding: max(10px,env(safe-area-inset-top)) max(12px,env(safe-area-inset-right)) max(10px,env(safe-area-inset-bottom)) 12px;
    color: #f7f9fc;
    border: 0;
    border-left: 1px solid rgba(255,255,255,.12);
    border-radius: 16px 0 0 16px;
    background: rgba(17,21,28,.985);
    box-shadow: -18px 0 46px rgba(0,0,0,.42);
    translate: var(--drawer-drag-x) 0;
    transition: translate .2s ease;
    touch-action: pan-y;
    overscroll-behavior: contain;
  }
  .mobile-v2 .detail-view .player-shell .player-episode-drawer.drawer-dragging { transition: none; }
  .mobile-v2 .detail-view .player-shell .player-episode-drawer .drawer-head {
    min-height: 54px;
    display: flex !important;
    flex: 0 0 auto;
    align-items: center;
    margin: 0;
    padding: 0 0 9px;
    border-bottom: 1px solid rgba(255,255,255,.1);
  }
  .mobile-v2 .detail-view .player-shell .player-episode-drawer .drawer-head strong { color: #fff; font-size: 17px; line-height: 22px; }
  .mobile-v2 .detail-view .player-shell .player-episode-drawer .drawer-head span { margin-top: 2px; color: rgba(225,232,242,.68); font-size: 12px; line-height: 17px; }
  .mobile-v2 .detail-view .player-shell .player-episode-drawer .drawer-title-desktop,
  .mobile-v2 .detail-view .player-shell .player-episode-drawer .drawer-desktop-actions,
  .mobile-v2 .detail-view .player-shell .player-episode-drawer > .line-tabs,
  .mobile-v2 .detail-view .player-shell .player-episode-drawer > .episode-pager { display: none !important; }
  .mobile-v2 .detail-view .player-shell .player-episode-drawer .drawer-title-mobile { display: inline; }
  .mobile-v2 .detail-view .player-shell .player-episode-drawer .drawer-mobile-close-button {
    width: 44px;
    height: 44px;
    min-width: 44px;
    min-height: 44px;
    display: grid;
    place-items: center;
    padding: 0;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 50%;
    color: #fff;
    background: rgba(255,255,255,.09);
  }
  .mobile-v2 .detail-view .player-shell .player-episode-drawer .drawer-mobile-close-button:active { background: rgba(255,255,255,.18); }
  .mobile-v2 .detail-view .player-shell .player-episode-drawer .drawer-mobile-close-button img { width: 20px; height: 20px; display: block; filter: brightness(0) invert(1); }
  .mobile-v2 .detail-view .player-shell .player-episode-drawer .drawer-episode-scroll {
    min-height: 0;
    flex: 1 1 auto;
    overflow-y: auto;
    padding: 8px 2px 8px 0;
    overscroll-behavior: contain;
    scrollbar-width: thin;
  }
  .mobile-v2 .detail-view .player-shell .player-episode-drawer .drawer-episode-list {
    display: grid;
    grid-template-columns: minmax(0,1fr);
    gap: 4px;
  }
  .mobile-v2 .detail-view .player-shell .player-episode-drawer .drawer-episode-row {
    position: relative;
    width: 100%;
    min-width: 0;
    min-height: 48px;
    display: grid;
    grid-template-columns: 34px minmax(0,1fr) auto;
    align-items: center;
    gap: 9px;
    overflow: visible;
    padding: 8px 10px;
    border: 0;
    border-radius: 8px;
    color: rgba(241,245,251,.88);
    font-size: 13px;
    line-height: 19px;
    text-align: left;
    white-space: normal;
    overflow-wrap: anywhere;
    background: transparent;
  }
  .mobile-v2 .detail-view .player-shell .player-episode-drawer .drawer-episode-row:active { background: rgba(255,255,255,.08); }
  .mobile-v2 .detail-view .player-shell .player-episode-drawer .drawer-episode-row.active { color: #76a1ff; background: rgba(42,103,245,.14); }
  .mobile-v2 .detail-view .player-shell .player-episode-drawer .drawer-episode-row.active::before { content: ""; position: absolute; left: 0; top: 9px; bottom: 9px; width: 3px; border-radius: 3px; background: #4b82ff; }
  .mobile-v2 .detail-view .player-shell .player-episode-drawer .episode-index-label { color: rgba(218,226,238,.56); font-variant-numeric: tabular-nums; text-align: center; }
  .mobile-v2 .detail-view .player-shell .player-episode-drawer .episode-name { min-width: 0; display: block; overflow: visible; text-overflow: clip; white-space: normal; overflow-wrap: anywhere; }
  .mobile-v2 .detail-view .player-shell .player-episode-drawer .episode-playing-label { color: #76a1ff; font-size: 11px; white-space: nowrap; }
  .mobile-v2 .detail-view .player-shell .player-episode-drawer .drawer-mobile-episode-pager:not(.hidden) {
    min-height: 52px;
    display: grid;
    grid-template-columns: 44px minmax(72px,1fr) 44px;
    align-items: center;
    gap: 8px;
    flex: 0 0 auto;
    padding-top: 8px;
    border-top: 1px solid rgba(255,255,255,.1);
  }
  .mobile-v2 .detail-view .player-shell .player-episode-drawer .drawer-mobile-episode-pager button {
    width: 44px;
    height: 44px;
    padding: 0;
    border: 1px solid rgba(255,255,255,.13);
    border-radius: 10px;
    color: #fff;
    font-size: 24px;
    background: rgba(255,255,255,.08);
  }
  .mobile-v2 .detail-view .player-shell .player-episode-drawer .drawer-mobile-episode-pager button:disabled { opacity: .32; }
  .mobile-v2 .detail-view .player-shell .player-episode-drawer .drawer-mobile-episode-pager span { color: rgba(241,245,251,.78); font-size: 13px; font-variant-numeric: tabular-nums; text-align: center; }
}
@media (max-width: 380px) {
  .course-grid { gap-inline: 6px; }
}
@media (prefers-reduced-motion: reduce) {
  *,*::before,*::after { scroll-behavior: auto !important; animation-duration: .01ms !important; transition-duration: .01ms !important; }
}