@charset "UTF-8";
/* base.css —— 变量 / 10 套主题 / 壁纸 / 字体缩放 / 公共组件 / 桌面适配 */

html{font-size:var(--fs,16px)}

:root{
  --bg:#0a0d17; --bg2:#121533; --text:#eef1ff; --muted:#9aa3c7;
  --primary:#5b8cff; --primary2:#a96bff; --accent:#ff5c8a;
  --vip1:#ffd75e; --vip2:#ff9f43; --free1:#3ddc97; --free2:#20b17a;
  --gem1:#7ee7ff; --gem2:#5b8cff; --sup1:#ff7ad9; --sup2:#a96bff;
  --glass:rgba(255,255,255,.08); --glass2:rgba(255,255,255,.14);
  --line:rgba(255,255,255,.14); --radius:18px;
  --shadow:0 12px 40px rgba(0,0,0,.45); --tab-h:66px;
  --app-max:620px; --pad-x:14px;
}
html[data-theme="light"]{
  --bg:#eef2fb; --bg2:#dfe7ff; --text:#151a2e; --muted:#5c6488;
  --glass:rgba(255,255,255,.68); --glass2:rgba(255,255,255,.9);
  --line:rgba(20,30,70,.12); --shadow:0 12px 34px rgba(60,80,160,.18);
}
html[data-theme="purple"]{--bg:#12071f;--bg2:#2a0f45;--primary:#b06bff;--primary2:#ff6bd6;--accent:#ff8ae2}
html[data-theme="pink"]{--bg:#1a0713;--bg2:#3d0f2b;--primary:#ff6b9d;--primary2:#ffa26b;--accent:#ffd166}
html[data-theme="blue"]{--bg:#04121f;--bg2:#0b2a44;--primary:#28c8ff;--primary2:#5b8cff;--accent:#5bffd0}
html[data-theme="green"]{--bg:#07140f;--bg2:#0e2a1e;--primary:#22c55e;--primary2:#86efac;--accent:#a3e635}
html[data-theme="orange"]{--bg:#170e06;--bg2:#33200d;--primary:#ff9f43;--primary2:#ffd75e;--accent:#ff7a5c}
html[data-theme="cyan"]{--bg:#04141a;--bg2:#0a2b36;--primary:#22d3ee;--primary2:#67e8f9;--accent:#38f9d7}
html[data-theme="red"]{--bg:#170608;--bg2:#340f14;--primary:#ff5c5c;--primary2:#ff9f43;--accent:#ff7ad9}
html[data-theme="mono"]{--bg:#0d0f12;--bg2:#1b1f26;--primary:#a8b0bf;--primary2:#dfe3ea;--accent:#8b93a3}

*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;padding:0}
body{
  font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",Helvetica,Arial,sans-serif;
  font-size:.875rem;line-height:1.5;background:var(--bg);color:var(--text);
  min-height:100vh;overflow-x:hidden;position:relative;transition:background .4s ease,color .3s ease;
}
body::before{
  content:'';position:fixed;inset:0;z-index:-3;pointer-events:none;
  background-image:var(--wallpaper,none);background-size:cover;background-position:center;background-repeat:no-repeat;
  background-attachment:fixed;opacity:0;transition:opacity .4s ease;
}
body::after{
  content:'';position:fixed;inset:0;z-index:-2;pointer-events:none;opacity:0;
  background:linear-gradient(180deg,rgba(6,8,18,.5),rgba(6,8,18,.86));transition:opacity .4s ease;
}
html[data-wallpaper="1"] body::before{opacity:.55}
html[data-wallpaper="1"] body::after{opacity:.85}
html[data-wallpaper="1"] .bg-orbs{display:none}

a{color:inherit;text-decoration:none}
img{display:block;max-width:100%;border:0}
button,input,select,textarea{font-family:inherit;font-size:.875rem;color:inherit;outline:none}
::-webkit-scrollbar{width:0;height:0}
::selection{background:var(--primary);color:#fff}
.muted{color:var(--muted)}
.tag{font-size:.625rem;padding:2px 8px;border-radius:8px;background:var(--glass2);border:1px solid var(--line);color:var(--muted);white-space:nowrap}

.bg-orbs{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none}
.bg-orbs i{position:absolute;display:block;border-radius:50%;filter:blur(70px);opacity:.5;animation:floaty 14s ease-in-out infinite}
.bg-orbs i:nth-child(1){width:260px;height:260px;background:var(--primary);top:-70px;left:-80px}
.bg-orbs i:nth-child(2){width:300px;height:300px;background:var(--primary2);bottom:-100px;right:-100px;animation-delay:-4s}
.bg-orbs i:nth-child(3){width:200px;height:200px;background:var(--accent);top:42%;right:-90px;animation-delay:-8s}

.glass{background:var(--glass);border:1px solid var(--line);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}
.app{max-width:var(--app-max);margin:0 auto;min-height:100vh;padding:0 var(--pad-x) calc(var(--tab-h) + 26px);position:relative}

/* ===== 顶部栏 ===== */
.topbar{position:sticky;top:0;z-index:60;display:flex;align-items:center;gap:10px;padding:10px 12px;margin:8px 0 12px;border-radius:16px;box-shadow:var(--shadow)}
.topbar-title{justify-content:space-between}
.topbar-title .tb-side{flex:0 0 auto;width:38px;height:38px}
.topbar-title .tb-title{flex:1;min-width:0;text-align:center;font-size:1rem;font-weight:800;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.logo{display:flex;align-items:center;gap:8px;flex:0 0 auto}
.logo img{height:32px;width:auto;border-radius:8px}
.logo-icon{width:34px;height:34px;border-radius:11px;display:grid;place-items:center;font-size:1rem;color:#fff;background:linear-gradient(135deg,var(--primary),var(--primary2))}
.search{flex:1 1 auto;display:flex;align-items:center;gap:8px;min-width:0;padding:7px 12px;border-radius:12px;border:1px solid var(--line);background:var(--glass2);transition:border-color .25s,box-shadow .25s;position:relative}
.search:focus-within{border-color:var(--primary);box-shadow:0 0 0 3px rgba(91,140,255,.16)}
.search i{color:var(--muted);font-size:.8125rem}
.search input{flex:1;min-width:0;border:0;background:transparent;font-size:.8125rem}
.search input::placeholder{color:var(--muted)}
.search input::-webkit-search-cancel-button{display:none}
.avatar-btn{flex:0 0 auto;width:38px;height:38px;border-radius:50%;overflow:hidden;display:grid;place-items:center;color:#fff;font-size:.9375rem;border:2px solid rgba(255,255,255,.35);background:linear-gradient(135deg,var(--primary),var(--primary2))}
.avatar-btn:active{transform:scale(.92)}
.avatar-btn img{width:100%;height:100%;object-fit:cover}

/* ===== 滚动通知条（一定动起来） ===== */
.notice-bar{display:flex;align-items:center;gap:8px;margin:-4px 0 12px;padding:8px 12px;border-radius:12px;overflow:hidden}
.notice-bar > i{flex:0 0 auto;color:var(--accent);font-size:.8125rem;animation:bellShake 2.6s ease-in-out infinite}
.nb-view{flex:1;min-width:0;overflow:hidden;position:relative}
.nb-track{
  display:flex;width:max-content;white-space:nowrap;will-change:transform;
  animation-name:nbScroll;animation-duration:var(--nb-dur,14s);
  animation-timing-function:linear;animation-iteration-count:infinite;
}
.nb-txt{display:inline-block;padding-right:64px;font-size:.75rem;color:var(--muted)}
.notice-bar:hover .nb-track{animation-play-state:paused}
@keyframes nbScroll{from{transform:translate3d(0,0,0)}to{transform:translate3d(-50%,0,0)}}
@keyframes bellShake{0%,100%{transform:rotate(0)}10%{transform:rotate(14deg)}20%{transform:rotate(-10deg)}30%{transform:rotate(6deg)}40%{transform:rotate(0)}}

/* ===== 搜索记录下拉 ===== */
.search-history{position:absolute;top:calc(100% + 8px);left:0;right:0;z-index:90;background:rgba(20,24,48,.96);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid var(--line);border-radius:14px;box-shadow:0 14px 40px rgba(0,0,0,.5);padding:10px;max-height:320px;overflow-y:auto;display:none;animation:slideDown .22s ease}
html[data-theme="light"] .search-history{background:rgba(255,255,255,.97)}
.search-history.show{display:block}
.sh-head{display:flex;align-items:center;justify-content:space-between;padding:2px 4px 8px;font-size:.6875rem;color:var(--muted)}
.sh-head b{font-size:.75rem;font-weight:700;color:var(--text)}
.sh-clear{border:0;background:transparent;color:var(--muted);font-size:.6875rem;cursor:pointer;padding:2px 6px;border-radius:6px}
.sh-clear:hover{color:var(--accent);background:var(--glass2)}
.sh-list{display:flex;flex-wrap:wrap;gap:6px}
.sh-item{display:inline-flex;align-items:center;gap:5px;padding:6px 12px;border-radius:20px;font-size:.75rem;font-weight:600;background:var(--glass2);border:1px solid var(--line);color:var(--text);cursor:pointer}
.sh-item:hover{border-color:var(--primary);color:var(--primary)}
.sh-item i{font-size:.625rem;color:var(--muted)}
.sh-empty{padding:14px 6px;text-align:center;color:var(--muted);font-size:.75rem}

/* ===== 区块 ===== */
.section{margin:18px 0}
.section-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}
.section-head h2{margin:0;font-size:1rem;font-weight:800;display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.section-head h2 i{background:linear-gradient(135deg,var(--primary),var(--primary2));-webkit-background-clip:text;background-clip:text;color:transparent}
.section-head .sub{font-size:.6875rem;color:var(--muted);font-weight:400}
.layout-switch{display:flex;gap:4px;padding:4px;border-radius:11px;border:1px solid var(--line);background:var(--glass);flex:0 0 auto}
.layout-switch button{width:28px;height:26px;border:0;border-radius:8px;background:transparent;color:var(--muted);cursor:pointer}
.layout-switch button.active{color:#fff;background:linear-gradient(135deg,var(--primary),var(--primary2))}

/* ===== 影片卡片 ===== */
.movie-list.layout-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.movie-list.layout-row{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.movie-list.layout-list{display:flex;flex-direction:column;gap:12px}
.m-card{display:block;border-radius:14px;overflow:hidden;background:var(--glass);border:1px solid var(--line);transition:transform .25s cubic-bezier(.22,.61,.36,1),box-shadow .25s,border-color .25s,filter .15s;animation:fadeUp .45s both;will-change:transform}
.m-card:hover{transform:translateY(-3px);border-color:rgba(120,160,255,.6);box-shadow:0 14px 28px rgba(0,0,0,.4)}
.m-card:active,.m-card.pressed{transform:scale(.94);filter:brightness(.94)}
.m-cover{position:relative;padding-top:142%;overflow:hidden;background:linear-gradient(135deg,#2b3566,#4b2b66)}
.m-cover img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:opacity .45s ease,transform .45s ease}
.m-card:hover .m-cover img{transform:scale(1.05)}
.m-badges{position:absolute;top:6px;left:6px;display:flex;gap:4px;flex-wrap:wrap;max-width:94%;z-index:3}
.m-info{padding:8px 9px 10px}
.m-name{font-size:.8125rem;font-weight:700;line-height:1.3;overflow:hidden;white-space:nowrap}
.m-name > span{display:inline-block;white-space:nowrap;will-change:transform}
.m-name.scroll > span{animation:mnameScroll var(--mname-dur,9s) linear infinite}
@keyframes mnameScroll{0%,12%{transform:translateX(0)}88%,100%{transform:translateX(var(--shift,-40px))}}
.m-meta{font-size:.625rem;color:var(--muted);margin-top:3px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.m-desc{display:none}
.layout-list .m-card{display:flex;align-items:stretch;gap:12px;padding:10px}
.layout-list .m-cover{flex:0 0 96px;width:96px;height:134px;padding-top:0;border-radius:12px}
.layout-list .m-info{flex:1;min-width:0;padding:0;display:flex;flex-direction:column;justify-content:center}
.layout-list .m-name{font-size:.9375rem}
.layout-list .m-desc{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:.6875rem;color:var(--muted);margin-top:6px}
.layout-row .m-cover{padding-top:130%}
.load-more{margin-top:14px;padding:12px}
.empty{padding:40px 16px;text-align:center;color:var(--muted);font-size:.8125rem;grid-column:1/-1}
.empty i{font-size:36px;display:block;margin-bottom:12px;opacity:.5}

.badge{font-size:.625rem;font-weight:800;padding:2px 7px;border-radius:8px;display:inline-flex;align-items:center;gap:3px;white-space:nowrap}
.badge.vip{background:linear-gradient(135deg,var(--vip1),var(--vip2));color:#3a2400}
.badge.vip.lv-gold{background:linear-gradient(135deg,var(--vip1),var(--vip2));color:#3a2400}
.badge.vip.lv-diamond{background:linear-gradient(135deg,var(--gem1),var(--gem2));color:#04283a}
.badge.vip.lv-super{background:linear-gradient(135deg,var(--sup1),var(--sup2));color:#fff}
.badge.free{background:linear-gradient(135deg,var(--free1),var(--free2));color:#04301f}
.badge.new{background:linear-gradient(135deg,var(--accent),#ff7a5c);color:#fff}

.btn{position:relative;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;gap:6px;border:0;border-radius:12px;padding:10px 18px;font-size:.8125rem;font-weight:700;cursor:pointer;transition:transform .18s,filter .18s}
.btn:active{transform:scale(.94);filter:brightness(.94)}
.btn.primary{color:#fff;background:linear-gradient(135deg,var(--primary),var(--primary2))}
.btn.ghost{color:var(--text);background:var(--glass2);border:1px solid var(--line)}
.btn.vipbtn{color:#3a2400;background:linear-gradient(135deg,var(--vip1),var(--vip2))}
.btn.block{width:100%}
.btn.sm{padding:7px 12px;font-size:.75rem;border-radius:10px}
.btn[disabled]{opacity:.7;cursor:not-allowed}
.ripple{position:absolute;border-radius:50%;transform:scale(0);background:rgba(255,255,255,.4);pointer-events:none;animation:ripple .6s linear}

.tabbar{position:fixed;left:0;right:0;bottom:0;z-index:70;padding:0 12px 10px;pointer-events:none}
.tabbar-inner{pointer-events:auto;max-width:calc(var(--app-max) - var(--pad-x) * 2);margin:0 auto;display:flex;padding:7px 6px;border-radius:20px;box-shadow:0 -6px 34px rgba(0,0,0,.4)}
.tab{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;padding:5px 0;border-radius:14px;color:var(--muted);font-size:.625rem;font-weight:600;position:relative;overflow:hidden}
.tab:active{transform:scale(.92)}
.tab i{font-size:1.0625rem}
.tab.active{color:var(--text)}
.tab.active i{background:linear-gradient(135deg,var(--primary),var(--primary2));-webkit-background-clip:text;background-clip:text;color:transparent}
.tab.active::after{content:'';position:absolute;bottom:1px;width:16px;height:3px;border-radius:3px;background:linear-gradient(135deg,var(--primary),var(--primary2))}

.toast-wrap{position:fixed;top:16px;left:0;right:0;z-index:300;display:flex;flex-direction:column;align-items:center;gap:8px;padding:0 16px;pointer-events:none}
.toast{max-width:100%;padding:10px 16px;border-radius:12px;font-size:.8125rem;font-weight:600;color:#fff;background:rgba(20,24,48,.92);border:1px solid var(--line);animation:slideDown .3s ease}
.toast.ok{background:linear-gradient(135deg,rgba(61,220,151,.94),rgba(32,177,122,.94))}
.toast.err{background:linear-gradient(135deg,rgba(255,92,138,.94),rgba(255,122,92,.94))}
.toast.vip{background:linear-gradient(135deg,rgba(255,215,94,.96),rgba(255,159,67,.96));color:#3a2400}
.modal{position:fixed;inset:0;z-index:200;display:none;align-items:flex-end;justify-content:center;padding:0 12px 12px;background:rgba(4,6,16,.6)}
.modal.show{display:flex;animation:fadeIn .25s ease}
.modal-card{position:relative;width:100%;max-width:520px;padding:20px 16px 16px;border-radius:22px;box-shadow:var(--shadow);animation:slideUp .32s cubic-bezier(.22,.61,.36,1)}
.modal-close{position:absolute;top:11px;right:11px;width:30px;height:30px;border:0;border-radius:10px;background:var(--glass2);color:var(--text);cursor:pointer;z-index:2}
.modal-title{margin:0 0 12px;font-size:1rem;font-weight:800;text-align:center}
.modal-content{max-height:66vh;overflow-y:auto}
.modal-text{margin:4px 0 8px;font-size:.8125rem;color:var(--muted);text-align:center;line-height:1.8}
.modal-actions{display:flex;gap:10px;margin-top:16px}
.modal-actions .btn{flex:1}

.skeleton{border-radius:14px;background:linear-gradient(90deg,var(--glass) 25%,var(--glass2) 37%,var(--glass) 63%);background-size:400% 100%;animation:shimmer 1.3s infinite}
.sk-card{height:190px}

.block-page{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px}
.block-card{width:100%;max-width:440px;padding:34px 22px;border-radius:24px;text-align:center;box-shadow:var(--shadow)}
.block-card .b-ico{font-size:44px;margin-bottom:14px;color:var(--vip1)}
.block-card h1{margin:0 0 10px;font-size:1.25rem}
.block-card p{margin:0 0 8px;font-size:.8125rem;color:var(--muted);line-height:1.8}
.block-tags{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-top:16px}

.form-msg{display:none;margin-bottom:12px;padding:9px 12px;border-radius:11px;font-size:.75rem}
.form-msg.err{display:block;color:#ff9ab5;background:rgba(255,92,138,.14);border:1px solid rgba(255,92,138,.35)}
.form-msg.ok{display:block;color:#7ff0c0;background:rgba(61,220,151,.14);border:1px solid rgba(61,220,151,.35)}
.input-box{display:flex;align-items:center;gap:9px;padding:11px 13px;border-radius:13px;border:1px solid var(--line);background:var(--glass2)}
.input-box:focus-within{border-color:var(--primary);box-shadow:0 0 0 3px rgba(91,140,255,.16)}
.input-box > i{color:var(--muted);font-size:.875rem}
.input-box input{flex:1;min-width:0;border:0;background:transparent}

@keyframes floaty{0%,100%{transform:translate3d(0,0,0) scale(1)}50%{transform:translate3d(0,-26px,0) scale(1.08)}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes fadeUp{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@keyframes slideUp{from{opacity:0;transform:translateY(40px)}to{opacity:1;transform:none}}
@keyframes slideDown{from{opacity:0;transform:translateY(-16px)}to{opacity:1;transform:none}}
@keyframes shimmer{0%{background-position:100% 0}100%{background-position:-100% 0}}
@keyframes ripple{to{transform:scale(4);opacity:0}}

/* =========================================================
 *  响应式：手机 → 平板 → 电脑（电脑上铺满，功能全展开）
 * ========================================================= */
@media (max-width:360px){
  .movie-list.layout-grid{grid-template-columns:repeat(2,1fr)}
}
@media (min-width:721px){
  :root{--app-max:780px;--pad-x:18px}
  .movie-list.layout-grid{grid-template-columns:repeat(4,1fr)}
  .modal{align-items:center;padding:24px}
  .tabbar{padding:0 18px 14px}
}
@media (min-width:1000px){
  :root{--app-max:1100px;--pad-x:22px}
  .app{padding-bottom:calc(var(--tab-h) + 34px)}
  .movie-list.layout-grid{grid-template-columns:repeat(5,1fr);gap:14px}
  .layout-list .m-cover{flex:0 0 130px;width:130px;height:180px}
  .layout-list .m-name{font-size:1rem}
  .modal-card{max-width:640px}
  .section-head h2{font-size:1.125rem}
  .tabbar{padding:0 22px 16px}
  .tab{font-size:.6875rem}
  .tab i{font-size:1.1875rem}
}
@media (min-width:1400px){
  :root{--app-max:1360px}
  .movie-list.layout-grid{grid-template-columns:repeat(6,1fr);gap:16px}
}
@media (min-width:1800px){
  :root{--app-max:1640px}
}
@media (prefers-reduced-motion:reduce){
  .m-name.scroll > span{animation:none !important}
}