/* Mobile V2 base rules mirrored from the primary mobile media block. */
: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; }