/* =========================================================
   祝由平台 — 单一样式表
   - 主色 #2563eb / 强调 #10b981 / 危险 #ef4444
   - 顶部 fixed-top 导航 + 卡片 + 闲鱼式列表 + 后台布局
   - 完全离线,无外部 CDN / 字体
   ========================================================= */

/* ---------- 0. reset / 基础 ---------- */
*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Microsoft YaHei",
                 "PingFang SC", "Hiragino Sans GB", Roboto, Helvetica, Arial, sans-serif;
    font-size: 14px;
    line-height: 1.6;
    color: #1f2937;
    background: #f7f8fa;
    -webkit-font-smoothing: antialiased;
}

/* 手机首页分类：横向排列并支持左右滑动 */
@media (max-width: 720px) {
  .hero .guest-categories,
  .category-sidebar .category-chips {
    display:flex;
    width:100%;
    flex-direction:row;
    flex-wrap:nowrap;
    align-items:center;
    gap:8px;
    overflow-x:auto;
    overflow-y:hidden;
    padding:2px 2px 8px;
    scroll-snap-type:x proximity;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
  }
  .hero .guest-categories::-webkit-scrollbar,
  .category-sidebar .category-chips::-webkit-scrollbar { display:none; }
  .hero .guest-categories .category-chip,
  .category-sidebar .category-chip {
    flex:0 0 auto;
    width:auto;
    min-height:40px;
    padding:9px 14px;
    border:1px solid #e2e5ee;
    border-radius:999px;
    background:#fff;
    color:#64748b;
    white-space:nowrap;
    box-shadow:none;
    scroll-snap-align:start;
  }
  .hero .guest-categories .category-chip.active,
  .category-sidebar .category-chip.active {
    color:#fff;
    border-color:transparent;
    background:linear-gradient(135deg,var(--front-primary),var(--front-primary-2));
    box-shadow:0 5px 12px rgba(79,70,229,.2);
  }
  .content-browser { display:block; margin-left:0; margin-right:0; }
  .category-sidebar { position:static; overflow:visible; margin:0 0 14px; border:0; background:transparent; }
  .category-sidebar-title { display:none; }
  .content-results { border-radius:16px; }
}

/* ===== 移动端体验增强 v4 ===== */
@media (max-width: 720px) {
    body { -webkit-text-size-adjust: 100%; padding-bottom: env(safe-area-inset-bottom); }
    .navbar-inner { flex-wrap: wrap; padding: 9px 14px 7px; gap: 7px; }
    .navbar-brand { flex: 1; }.brand-logo { width: 42px; height: 42px; }
    .navbar-nav { order: 2; width: 100%; display: flex; gap: 4px; padding-top: 6px; border-top: 1px solid #eef0f5; overflow-x: auto; scrollbar-width: none; }
    .navbar-nav::-webkit-scrollbar,.category-chips::-webkit-scrollbar { display:none; }
    .navbar-nav a { flex: 0 0 auto; font-size: 13px; padding: 7px 10px; }
    .hero { min-height: auto; padding: 44px 18px 48px; }.hero-logo { width: 138px; height: 138px; }.hero h1 { margin-top: 25px; font-size: 27px; }.hero p { line-height: 1.7; }
    .hero-actions { width:100%; display:grid; grid-template-columns:1fr 1fr; gap:10px; }.hero-actions .btn { margin:0; padding:12px 8px; }
    .search-form { display:grid; grid-template-columns:minmax(0,1fr) auto; }.search-form .btn { min-width:72px; padding-left:12px; padding-right:12px; }
    .row-between { align-items:flex-start; }.card-header { align-items:center; }
    .detail-meta { display:flex; flex-wrap:wrap; gap:8px; }.detail-desc { font-size:15px; line-height:1.8; overflow-wrap:anywhere; }
    .detail-gallery { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .table-responsive { overflow:visible; }.table { min-width:0; border:0; }.table thead { display:none; }.table tbody,.table tr,.table td { display:block; width:100%; box-sizing:border-box; }
    .table tr { margin-bottom:12px; padding:12px 14px; border:1px solid #e8eaf2; border-radius:12px; background:#fff; box-shadow:0 5px 16px rgba(30,41,59,.04); }
    .table td { display:flex; justify-content:space-between; align-items:center; gap:16px; padding:8px 0; border-bottom:1px dashed #edf0f5; text-align:right; }
    .table td:last-child { border-bottom:0; }.table td::before { content:attr(data-label); color:#718096; font-size:12px; font-weight:500; text-align:left; }.table td code { overflow-wrap:anywhere; }
}

/* ===== 整站自适应补强：桌面 / 平板 / 手机 ===== */
img,video,iframe,canvas,svg{max-width:100%}
input,select,textarea,button{max-width:100%;box-sizing:border-box}
.detail-desc,.item-body,.card,.profile-main{min-width:0}
.detail-desc table{display:block;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
.detail-desc pre{max-width:100%;overflow:auto;white-space:pre-wrap;overflow-wrap:anywhere}
.detail-desc iframe{width:100%;aspect-ratio:16/9;height:auto}

@media(max-width:1024px){
  .navbar-inner{padding-left:18px;padding-right:18px}
  .container{width:100%;box-sizing:border-box}
  .profile-shell{grid-template-columns:220px minmax(0,1fr)}
  .plan-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media(max-width:720px){
  .navbar-inner{flex-wrap:wrap;gap:7px;padding:9px 14px 10px}
  .navbar-brand{width:100%;min-width:0}
  .navbar-brand .front-brand-copy{min-width:0}
  .navbar-brand .front-brand-copy strong,.navbar-brand .front-brand-copy small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .navbar-nav{width:100%;justify-content:flex-start;gap:3px;padding-bottom:2px;scrollbar-width:none}
  .navbar-nav a{flex:0 0 auto}
  .row-between{align-items:flex-start;flex-wrap:wrap;gap:10px}
  .search-form{width:100%}
  .search-form .form-input{min-width:0}
  .plan-grid{grid-template-columns:1fr}
  .plan-card{min-width:0}
  .detail-desc{font-size:15px;line-height:1.75}
  .detail-desc h1{font-size:23px}.detail-desc h2{font-size:20px}.detail-desc h3{font-size:18px}
  .detail-gallery{grid-template-columns:repeat(2,minmax(0,1fr))}
  .modal{padding:10px}
  .modal-panel{margin:8px auto;max-height:calc(100dvh - 20px);overflow:auto;border-radius:12px}
  .modal-head{position:sticky;top:0}
  .form-grid{grid-template-columns:1fr}
  .admin-main .card{overflow-x:auto;-webkit-overflow-scrolling:touch}
  .admin-main table{min-width:720px}
  .admin-main .modal table{min-width:0}
}

/* 购买套餐图片验证码 */
.purchase-captcha-modal{display:none;position:fixed;inset:0;z-index:12000;place-items:center;padding:20px;background:rgba(15,23,42,.62);backdrop-filter:blur(5px)}
.purchase-captcha-modal.open{display:grid}
.purchase-captcha-card{position:relative;width:min(420px,100%);padding:28px;border-radius:18px;background:#fff;box-shadow:0 24px 70px rgba(15,23,42,.3)}
.purchase-captcha-card h2{margin:0 0 6px;color:#172033;font-size:22px}.purchase-captcha-card>p{margin:0 0 20px;color:#64748b}.purchase-captcha-card>p strong{color:#312e81}
.purchase-captcha-close{position:absolute;top:10px;right:14px;border:0;background:transparent;color:#64748b;font-size:28px;cursor:pointer}
.purchase-captcha-label{display:block;margin-bottom:7px;color:#334155;font-size:13px;font-weight:650}
.purchase-captcha-row{display:grid;grid-template-columns:minmax(0,1fr) 140px;gap:10px;align-items:center}
.purchase-captcha-row .form-input{height:48px;text-transform:uppercase}.purchase-captcha-row img{width:140px;height:48px;border:1px solid #d8deed;border-radius:10px;cursor:pointer}
.purchase-captcha-refresh{display:block;margin:7px 0 18px auto;padding:0;border:0;background:transparent;color:#64748b;font-size:12px;cursor:pointer}.purchase-captcha-refresh:hover{color:#4f46e5}
@media(max-width:480px){.purchase-captcha-card{padding:24px 18px}.purchase-captcha-row{grid-template-columns:minmax(0,1fr) 118px}.purchase-captcha-row img{width:118px;object-fit:cover}}

@media(max-width:420px){
  .container{padding-left:10px;padding-right:10px}
  .card{padding:14px;border-radius:13px}
  .btn{padding-left:12px;padding-right:12px}
  .content-browser{margin-left:-10px;margin-right:-10px;grid-template-columns:104px minmax(0,1fr)}
  .category-sidebar .category-chip{padding-left:7px;padding-right:6px;font-size:11px}
  .content-results{padding:11px}
  .content-results .item-row{align-items:flex-start}
  .content-results .item-title{font-size:14px}
  .content-results .item-desc{font-size:11px;line-height:1.5}
  .detail-gallery{grid-template-columns:1fr}
}
a { color: #2563eb; text-decoration: none; }
a:hover { color: #1d4ed8; text-decoration: underline; }
.pinned-badge { background:#fff1d6!important; color:#b45309!important; border:1px solid #f8d48a; font-weight:700; }
img { max-width: 100%; display: block; }
button, input, select, textarea { font: inherit; color: inherit; }

/* ---------- 1. 顶部导航 ---------- */
.navbar {
    position: sticky;
    top: 0;
    z-index: 100;
    background: #ffffff;
    border-bottom: 1px solid #e5e7eb;
    box-shadow: 0 2px 6px rgba(15, 23, 42, 0.04);
}
.navbar-inner {
    max-width: 1080px;
    margin: 0 auto;
    padding: 12px 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}
.navbar-brand {
    font-size: 18px;
    font-weight: 700;
    color: #111827;
    display: flex;
    align-items: center;
    gap: 8px;
}
.navbar-brand .brand-logo {
    height: 48px;
    width: auto;
    display: block;
    object-fit: contain;
}
.navbar-brand:hover .brand-logo {
    opacity: .85;
    transition: opacity .2s;
}
.front-brand-copy { display:flex; flex-direction:column; min-width:0; line-height:1.15; }
.front-brand-copy strong { max-width:220px; overflow:hidden; color:#1f2937; font-size:15px; text-overflow:ellipsis; white-space:nowrap; }
.front-brand-copy small { max-width:220px; margin-top:3px; overflow:hidden; color:#64748b; font-size:11px; font-weight:400; text-overflow:ellipsis; white-space:nowrap; }
.front-contact { margin-top:36px; padding:26px 0; border-top:1px solid #e5e7eb; background:#f8fafc; color:#475569; }
.front-contact-title { margin-bottom:10px; color:#1e293b; font-size:16px; font-weight:700; }
.front-contact-items { display:flex; align-items:center; flex-wrap:wrap; gap:10px 24px; font-size:13px; }
.front-contact-items span { display:inline-flex; align-items:center; gap:5px; }
.front-contact-items a { color:#4f46e5; text-decoration:none; }
.front-contact-items a:hover { text-decoration:underline; }
.front-contact-layout { display:flex; align-items:center; justify-content:space-between; gap:28px; }
.front-contact-copy { min-width:0; }
.front-contact-qrcode { display:flex; flex:0 0 auto; flex-direction:column; align-items:center; gap:6px; color:#64748b; font-size:12px; }
.front-contact-qrcode img { width:108px; height:108px; padding:5px; object-fit:contain; border:1px solid #e2e8f0; border-radius:10px; background:#fff; }
.membership-status-card { display:flex; align-items:center; justify-content:space-between; gap:24px; padding:22px 26px; background:linear-gradient(135deg,#eef2ff,#fff); border-color:#dbe3ff; }
.membership-status-label { color:#64748b; font-size:13px; }
.membership-status-level { margin-top:5px; color:#312e81; font-size:23px; font-weight:750; }
.membership-status-level span { margin-left:5px; color:#6366f1; font-size:14px; }
.membership-status-expire { display:flex; flex-direction:column; align-items:flex-end; gap:4px; color:#64748b; font-size:13px; }
.membership-status-expire strong { color:#172033; font-size:20px; }
.membership-status-expire a { color:#4f46e5; text-decoration:none; }
.profile-shell{display:grid;grid-template-columns:250px minmax(0,1fr);gap:22px;align-items:start}.profile-side{position:sticky;top:92px;text-align:center;padding:28px 20px}.profile-avatar{display:grid;place-items:center;width:78px;height:78px;margin:0 auto 12px;border-radius:50%;overflow:hidden;background:linear-gradient(135deg,#4f46e5,#8b5cf6);color:#fff;font-size:30px;font-weight:800;box-shadow:0 10px 25px #4f46e538}.profile-avatar img{width:100%;height:100%;object-fit:cover}.profile-side h1,.profile-mobile-head h1{margin:0;color:#172033;font-size:21px}.profile-side p,.profile-mobile-head p{margin:5px 0 12px;color:#94a3b8;font-size:12px}.profile-side-links{display:flex;flex-direction:column;gap:5px;margin:24px -8px 0;text-align:left}.profile-side-links a{padding:11px 14px;border-radius:9px;color:#475569;text-decoration:none;font-size:14px}.profile-side-links a:hover,.profile-side-links a.active{background:#eef2ff;color:#4f46e5}.profile-side-links a.danger{margin-top:8px;color:#e11d48}.profile-main{min-width:0}.profile-mobile-head{display:none}.profile-member-card{position:relative;display:flex;align-items:center;justify-content:space-between;gap:24px;overflow:hidden;padding:28px 30px;border-radius:18px;background:radial-gradient(circle at 90% 0,#a78bfa66,transparent 36%),linear-gradient(135deg,#312e81,#5b21b6);color:#fff;box-shadow:0 18px 38px #4f46e52e}.profile-member-card small,.profile-member-card strong,.profile-member-card span{display:block}.profile-member-card>div:first-child strong{margin:5px 0;font-size:25px}.profile-member-card>div:first-child span{color:#c4b5fd;font-size:13px}.profile-expire{text-align:right}.profile-expire strong{font-size:20px}.profile-expire small{margin-top:6px;color:#ddd6fe}.profile-member-card>a{padding:9px 14px;border:1px solid #ffffff55;border-radius:9px;background:#ffffff16;color:#fff;text-decoration:none;white-space:nowrap}.profile-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:18px 0}.profile-stats a{text-align:center;text-decoration:none}.profile-stats strong{display:block;color:#312e81;font-size:26px}.profile-stats span{display:block;margin-top:5px;color:#64748b;font-size:12px}.profile-actions h2{margin:0 0 16px;font-size:17px}.profile-action-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.profile-action-grid>a{display:flex;flex-direction:column;gap:5px;padding:15px;border:1px solid #e8eaf1;border-radius:11px;color:#334155;text-decoration:none;font-weight:650}.profile-action-grid>a:hover{border-color:#a5b4fc;background:#fafaff}.profile-action-grid span{color:#94a3b8;font-size:12px;font-weight:400}.mobile-bottom-nav,.mobile-logout{display:none!important}
.article-qrcode { display:flex; justify-content:center; margin:32px auto 8px; padding-top:26px; border-top:1px solid #eef2f7; }
.article-qrcode img { width:min(220px,70vw); height:auto; object-fit:contain; border:1px solid #e5e7eb; border-radius:14px; background:#fff; box-shadow:0 8px 24px rgba(15,23,42,.08); }
@media(max-width:640px){.front-contact{margin-top:22px;padding:20px 0}.front-contact-layout{align-items:flex-start}.front-contact-items{align-items:flex-start;flex-direction:column;gap:9px}.front-contact-qrcode img{width:92px;height:92px}.membership-status-card{align-items:flex-start;flex-direction:column;padding:18px}.membership-status-expire{align-items:flex-start}}
@media(max-width:720px){body.profile-page{padding-bottom:76px;background:#f4f6fb}.profile-desktop-nav{display:none}.profile-shell{display:block;padding:0 14px 24px}.profile-side{display:none}.profile-mobile-head{display:flex;align-items:center;gap:14px;margin:0 -14px;padding:24px 20px 46px;background:linear-gradient(135deg,#312e81,#6d28d9);color:#fff}.profile-mobile-head .profile-avatar{width:64px;height:64px;margin:0;flex:0 0 64px;font-size:24px;border:3px solid #ffffff50}.profile-mobile-head h1{color:#fff}.profile-mobile-head p{margin-bottom:0;color:#ddd6fe}.profile-member-card{align-items:flex-start;flex-wrap:wrap;margin-top:-28px;padding:20px;border-radius:16px}.profile-member-card>div:first-child{width:42%}.profile-expire{width:52%;text-align:right}.profile-expire strong{font-size:16px}.profile-expire small{font-size:10px}.profile-member-card>a{width:100%;box-sizing:border-box;text-align:center}.profile-stats{gap:8px;margin:12px 0}.profile-stats .card{padding:13px 5px}.profile-stats strong{font-size:21px}.profile-actions{padding:16px}.profile-action-grid{grid-template-columns:1fr}.profile-action-grid>a{padding:13px}.mobile-logout{display:flex!important;color:#e11d48!important}.mobile-bottom-nav{position:fixed;z-index:1000;left:0;right:0;bottom:0;display:grid!important;grid-template-columns:repeat(4,1fr);padding:7px 8px calc(7px + env(safe-area-inset-bottom));border-top:1px solid #e5e7eb;background:#fffffff2;backdrop-filter:blur(14px);box-shadow:0 -8px 24px #0f172a12}.mobile-bottom-nav a{display:flex;flex-direction:column;align-items:center;gap:2px;color:#94a3b8;text-decoration:none;font-size:11px}.mobile-bottom-nav a span{font-size:21px;line-height:24px}.mobile-bottom-nav a.active{color:#4f46e5}}

/* “我的”移动端精细优化 */
@media(max-width:720px){
  .profile-mobile-head{padding-top:max(22px,env(safe-area-inset-top));padding-bottom:42px}
  .profile-member-card{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:14px 10px;margin-top:-24px;padding:17px 18px}
  .profile-member-card>div:first-child,.profile-expire{width:auto;min-width:0}
  .profile-member-card>div:first-child strong{font-size:22px}
  .profile-expire{align-self:center;text-align:right}
  .profile-expire strong{overflow-wrap:anywhere;font-size:15px;line-height:1.35}
  .profile-expire small{overflow-wrap:anywhere;line-height:1.4}
  .profile-member-card>a{grid-column:1/-1;padding:10px 12px}
  .profile-stats{grid-template-columns:repeat(3,minmax(0,1fr))}
  .profile-stats .card{min-width:0;border-radius:13px;box-shadow:0 5px 16px #1e293b0c}
  .profile-stats span{font-size:11px;white-space:nowrap}
  .profile-actions{border-radius:15px}
  .profile-action-grid>a{position:relative;min-height:48px;justify-content:center;padding:11px 38px 11px 13px}
  .profile-action-grid>a:after{content:'›';position:absolute;right:15px;top:50%;transform:translateY(-50%);color:#b0b7c5;font-size:22px;font-weight:400}
  .mobile-bottom-nav{min-height:54px;padding-top:6px}
  .mobile-bottom-nav a{justify-content:center;min-height:44px}
}
.guest-search { width:min(620px,100%); margin:24px auto 12px; }
.guest-categories { justify-content:center; max-width:760px; margin:0 auto; }
.auth-gate-modal { display:none; position:fixed; inset:0; z-index:11000; place-items:center; padding:20px; background:rgba(15,23,42,.62); backdrop-filter:blur(5px); }
.auth-gate-modal.open { display:grid; }
.auth-gate-card { position:relative; width:min(400px,100%); padding:30px; border-radius:18px; background:#fff; text-align:center; box-shadow:0 24px 70px rgba(15,23,42,.3); }
.auth-gate-card h2 { margin:8px 0; }.auth-gate-card p { margin:0 0 20px; color:#64748b; line-height:1.7; }.auth-gate-card .btn+.btn { margin-top:10px; }
.auth-gate-icon { font-size:38px; }.auth-gate-close { position:absolute; top:10px; right:12px; border:0; background:transparent; color:#64748b; font-size:26px; cursor:pointer; }
.navbar-nav {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}
.navbar-nav a {
    padding: 6px 12px;
    border-radius: 6px;
    color: #374151;
    font-weight: 500;
}
.navbar-nav a:hover { background: #f3f4f6; text-decoration: none; }
.navbar-nav a.active { background: #eff6ff; color: #2563eb; }
.navbar-nav .badge-admin { background: #fef3c7; color: #92400e; }
.navbar-user {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #4b5563;
    font-size: 13px;
}

/* ---------- 2. 主容器 ---------- */
.container {
    max-width: 1080px;
    margin: 0 auto;
    padding: 24px 20px 48px;
}
.container-narrow { max-width: 720px; }

/* ---------- 3. hero 区(未登录) ---------- */
.hero {
    text-align: center;
    padding: 48px 20px 40px;
    background: linear-gradient(135deg, #eff6ff 0%, #ffffff 100%);
    border-radius: 12px;
    margin-bottom: 24px;
}
.hero-logo {
    display: block;
    margin: 0 auto 20px;
    width: 240px;
    height: 240px;
    object-fit: contain;
    filter: drop-shadow(0 6px 20px rgba(26,42,94,0.18));
    transition: transform .35s ease;
}
.hero-logo:hover {
    transform: scale(1.04);
}
.hero h1 {
    font-size: 28px;
    margin: 0 0 8px;
    color: #111827;
}
.hero p {
    font-size: 15px;
    color: #6b7280;
    margin: 0 0 24px;
}
.hero .hero-actions {
    display: flex;
    justify-content: center;
    gap: 12px;
    flex-wrap: wrap;
}

/* ---------- 4. 按钮 ---------- */
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 9px 18px;
    border: 1px solid transparent;
    border-radius: 8px;
    background: #ffffff;
    color: #374151;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.15s ease;
    text-decoration: none;
}
.btn:hover { background: #f9fafb; text-decoration: none; }
.btn-primary {
    background: #2563eb;
    color: #ffffff;
    border-color: #2563eb;
}
.btn-primary:hover { background: #1d4ed8; color: #ffffff; }
.btn-success {
    background: #10b981;
    color: #ffffff;
    border-color: #10b981;
}
.btn-success:hover { background: #059669; color: #ffffff; }
.btn-danger {
    background: #ef4444;
    color: #ffffff;
    border-color: #ef4444;
}
.btn-danger:hover { background: #dc2626; color: #ffffff; }
.btn-outline {
    background: transparent;
    border-color: #d1d5db;
    color: #374151;
}
.btn-outline:hover { background: #f3f4f6; }
.btn-sm { padding: 5px 12px; font-size: 13px; }
.btn-lg { padding: 12px 28px; font-size: 15px; }
.btn-block { width: 100%; }
.btn[disabled], .btn:disabled { opacity: 0.55; cursor: not-allowed; }

/* ---------- 5. 表单 ---------- */
.form-group { margin-bottom: 16px; }
.form-label {
    display: block;
    margin-bottom: 6px;
    font-size: 13px;
    font-weight: 500;
    color: #374151;
}
.form-input {
    width: 100%;
    padding: 9px 12px;
    border: 1px solid #d1d5db;
    border-radius: 8px;
    background: #ffffff;
    font-size: 14px;
    transition: border-color 0.15s ease;
}
.form-input:focus {
    outline: none;
    border-color: #2563eb;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.15);
}
.search-form {
    display: flex;
    gap: 8px;
    margin-bottom: 20px;
}
.search-form .form-input { flex: 1; }

/* ---------- 6. 卡片 ---------- */
.card {
    background: #ffffff;
    border-radius: 8px;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06), 0 1px 2px rgba(15, 23, 42, 0.04);
    padding: 20px;
    margin-bottom: 16px;
}
.card-header {
    font-size: 16px;
    font-weight: 600;
    color: #111827;
    margin: -4px 0 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

/* ---------- 7. 套餐卡 grid ---------- */
.plan-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 16px;
}
.plan-card {
    background: #ffffff;
    border-radius: 8px;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06);
    padding: 24px 20px;
    display: flex;
    flex-direction: column;
    border: 2px solid transparent;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.plan-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(15, 23, 42, 0.08);
}
.plan-card.featured { border-color: #2563eb; }
.plan-name {
    font-size: 18px;
    font-weight: 600;
    color: #111827;
    margin-bottom: 8px;
}
.plan-price {
    font-size: 28px;
    font-weight: 700;
    color: #ef4444;
    margin-bottom: 4px;
}
.plan-price .unit { font-size: 14px; color: #6b7280; font-weight: 400; }
.plan-days {
    font-size: 13px;
    color: #6b7280;
    margin-bottom: 12px;
}
.plan-desc {
    color: #4b5563;
    font-size: 13px;
    flex: 1;
    margin-bottom: 16px;
    min-height: 40px;
}

/* ---------- 8. 闲鱼式列表 ---------- */
.item-list { display: flex; flex-direction: column; gap: 12px; }
.item-row {
    display: flex;
    gap: 14px;
    background: #ffffff;
    border-radius: 8px;
    padding: 14px;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06);
    transition: box-shadow 0.15s ease;
    text-decoration: none;
    color: inherit;
}
.item-row:hover {
    box-shadow: 0 4px 12px rgba(15, 23, 42, 0.08);
    text-decoration: none;
}
.item-thumb {
    flex: 0 0 80px;
    width: 80px;
    height: 80px;
    border-radius: 6px;
    overflow: hidden;
    background: #f3f4f6;
    display: flex;
    align-items: center;
    justify-content: center;
}
.item-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    background: #f8fafc;
}
.item-thumb .placeholder {
    color: #9ca3af;
    font-size: 12px;
}
.item-body { flex: 1; min-width: 0; }
.item-title {
    font-size: 15px;
    font-weight: 600;
    color: #111827;
    margin: 0 0 4px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.item-desc {
    font-size: 13px;
    color: #6b7280;
    margin: 0 0 8px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}
.item-desc { display:-webkit-box; overflow:hidden; line-height:1.65; -webkit-box-orient:vertical; -webkit-line-clamp:2; }
.item-meta {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 12px;
    color: #9ca3af;
}

/* ---------- 9. 等级徽章 ---------- */
.level-badge {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    padding: 2px 8px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 500;
    line-height: 1.4;
}
.level-badge.lv-0 { background: #f3f4f6; color: #6b7280; }
.level-badge.lv-1 { background: #fef3c7; color: #92400e; }
.level-badge.lv-2 { background: #e0e7ff; color: #3730a3; }
.level-badge.lv-3 { background: linear-gradient(135deg, #fde68a, #f59e0b); color: #78350f; }
.member-upgrade-notice { display:flex; align-items:center; justify-content:space-between; gap:18px; margin:14px 0; padding:16px 18px; border:1px solid #ddd6fe; border-radius:13px; background:linear-gradient(135deg,#f5f3ff,#eef2ff); }
.member-upgrade-notice strong,.member-upgrade-notice span { display:block; }
.member-upgrade-notice strong { color:#4338ca; margin-bottom:4px; }
.member-upgrade-notice span { color:#64748b; font-size:13px; }
.item-row.item-locked { border-color:#ddd6fe; background:linear-gradient(135deg,#fff,#faf5ff); }
.item-row.item-locked:hover { border-color:#8b5cf6; }
.locked-thumb { display:grid; place-items:center; width:100%; height:100%; min-height:76px; font-size:30px; background:#ede9fe; }
.locked-copy { color:#7c3aed; font-weight:600; }
.unlock-action { margin-left:auto; color:#6d28d9; font-weight:700; }
@media (max-width:640px) { .member-upgrade-notice { align-items:stretch; flex-direction:column; } .member-upgrade-notice .btn { text-align:center; } .unlock-action { width:100%; margin:5px 0 0; } }

/* ---------- 10. 状态徽章(订单) ---------- */
.status-badge {
    display: inline-block;
    padding: 2px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 500;
}
.status-pending { background: #fef3c7; color: #92400e; }
.status-paid    { background: #d1fae5; color: #065f46; }
.status-failed  { background: #fee2e2; color: #991b1b; }

/* ---------- 11. 表格 ---------- */
.table {
    width: 100%;
    border-collapse: collapse;
    background: #ffffff;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06);
}
.table th, .table td {
    padding: 12px 14px;
    text-align: left;
    border-bottom: 1px solid #f3f4f6;
    font-size: 13px;
}
.table th {
    background: #f9fafb;
    color: #6b7280;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    font-size: 12px;
}
.table tr:last-child td { border-bottom: none; }
.table tr:hover td { background: #fafbfc; }

/* ---------- 12. 提示 / alert ---------- */
.alert {
    padding: 12px 16px;
    border-radius: 8px;
    margin-bottom: 16px;
    font-size: 14px;
    border: 1px solid transparent;
}
.alert-info    { background: #eff6ff; color: #1e40af; border-color: #bfdbfe; }
.alert-success { background: #d1fae5; color: #065f46; border-color: #a7f3d0; }
.alert-warning { background: #fef3c7; color: #92400e; border-color: #fde68a; }
.alert-danger  { background: #fee2e2; color: #991b1b; border-color: #fecaca; }

/* ---------- 13. 空状态 ---------- */
.empty {
    text-align: center;
    padding: 60px 20px;
    color: #9ca3af;
}
.empty-icon { font-size: 48px; margin-bottom: 12px; opacity: 0.5; }
.empty-text { font-size: 14px; }

/* ---------- 14. 详情页 ---------- */
.detail-image {
    width: 100%;
    max-width: 680px;
    aspect-ratio: 4 / 3;
    margin: 0 auto 20px;
    border-radius: 8px;
    overflow: hidden;
    background: #f8fafc;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06);
}
.detail-image img { display:block; width:100%; height:100%; object-fit:contain; object-position:center; }
.detail-meta {
    display: flex;
    align-items: center;
    gap: 12px;
    color: #6b7280;
    font-size: 13px;
    margin-bottom: 16px;
}
.detail-desc {
    font-size: 15px;
    line-height: 1.8;
    color: #374151;
    white-space: pre-wrap;
    word-break: break-word;
}

/* ---------- 15. 后台布局 ---------- */
.admin-layout {
    display: flex;
    gap: 16px;
    align-items: flex-start;
}
.admin-sidebar {
    flex: 0 0 200px;
    background: #ffffff;
    border-radius: 8px;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06);
    padding: 16px 0;
    position: sticky;
    top: 72px;
}
.admin-sidebar a {
    display: block;
    padding: 10px 18px;
    color: #4b5563;
    border-left: 3px solid transparent;
    font-size: 14px;
}
.admin-sidebar a:hover {
    background: #f9fafb;
    text-decoration: none;
    color: #2563eb;
}
.admin-sidebar a.active {
    background: #eff6ff;
    color: #2563eb;
    border-left-color: #2563eb;
    font-weight: 500;
}
.admin-main {
    flex: 1;
    min-width: 0;
}
.admin-page-title {
    font-size: 20px;
    font-weight: 600;
    color: #111827;
    margin: 0 0 20px;
}

/* ---------- 16. flex 工具 ---------- */
.row { display: flex; gap: 12px; flex-wrap: wrap; align-items: center; }
.row-between { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; }
.mt-0 { margin-top: 0; } .mt-1 { margin-top: 8px; } .mt-2 { margin-top: 16px; } .mt-3 { margin-top: 24px; }
.mb-0 { margin-bottom: 0; } .mb-1 { margin-bottom: 8px; } .mb-2 { margin-bottom: 16px; } .mb-3 { margin-bottom: 24px; }
.text-muted { color: #6b7280; }
.text-small { font-size: 12px; }
.text-center { text-align: center; }

/* ---------- 17. 响应式 ---------- */
@media (max-width: 768px) {
    .navbar-inner { padding: 10px 14px; gap: 8px; }
    .navbar-brand { font-size: 16px; }
    .navbar-nav a { padding: 5px 8px; font-size: 13px; }
    .container { padding: 16px 14px 32px; }
    .hero { padding: 32px 16px 28px; }
    .hero h1 { font-size: 22px; }
    .hero p { font-size: 14px; }

    /* 列表:缩略图变小 */
    .item-row { padding: 10px; gap: 10px; }
    .item-thumb { flex: 0 0 64px; width: 64px; height: 64px; }
    .item-title { font-size: 14px; }

    /* 表格:水平滚动 */
    .table-responsive { overflow-x: auto; -webkit-overflow-scrolling: touch; }
    .table { min-width: 560px; }

    /* 后台:侧栏变顶栏 */
    .admin-layout { flex-direction: column; }
    .admin-sidebar {
        flex: 1 1 auto;
        width: 100%;
        position: static;
        display: flex;
        overflow-x: auto;
        padding: 0;
    }
    .admin-sidebar a {
        flex: 0 0 auto;
        border-left: none;
        border-bottom: 3px solid transparent;
        padding: 10px 14px;
    }
    .admin-sidebar a.active {
        border-left: none;
        border-bottom-color: #2563eb;
    }

    /* 详情页大图 */
    .detail-image { max-width: 100%; }
}

/* ===== 后台多媒体编辑 ===== */
.media-input {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}
.media-input input[type="text"],
.media-input input[name] {
    flex: 1;
    min-width: 240px;
    padding: 6px 10px;
    border: 1px solid #d1d5db;
    border-radius: 4px;
    font-size: 13px;
}
.media-input input[type="file"] {
    flex: 0 0 auto;
}
.media-preview {
    display: none;
    max-width: 200px;
    max-height: 120px;
    margin-top: 6px;
    border-radius: 4px;
    background: #f5f5f5;
}
.media-preview:is(img) { width:240px; height:150px; max-width:100%; max-height:none; object-fit:contain; border:1px solid #e2e8f0; background:#f8fafc; }
.admin-media-cell { display:flex; align-items:center; flex-wrap:wrap; gap:8px; min-width:150px; }
.admin-media-cell img,.admin-media-cell video { width:110px; height:72px; object-fit:cover; border:1px solid #e2e8f0; border-radius:8px; background:#0f172a; }
.admin-media-cell video { object-fit:contain; }
.drag-handle { border:0; padding:7px 10px; color:#64748b; background:#f1f5f9; border-radius:7px; cursor:grab; font-size:18px; line-height:1; }
.drag-handle:active { cursor:grabbing; }
#level-sortable tr { transition:background .15s,opacity .15s; }
#level-sortable tr.dragging { opacity:.45; background:#ede9fe; }
.mobile-sort-buttons { display:none; gap:3px; }
.mobile-sort-buttons button { border:1px solid #cbd5e1; padding:5px 8px; background:#fff; border-radius:6px; }
@media(max-width:640px){.drag-handle{display:none}.mobile-sort-buttons{display:inline-flex}}
.video-source-switch { display:inline-flex; gap:4px; padding:4px; margin:4px 0 10px; border:1px solid #e2e8f0; border-radius:10px; background:#f8fafc; }
.video-source-btn { border:0; border-radius:7px; padding:8px 16px; color:#64748b; background:transparent; cursor:pointer; font-weight:600; }
.video-source-btn.active { color:#fff; background:linear-gradient(135deg,#4f46e5,#7c3aed); box-shadow:0 4px 12px #4f46e533; }
.video-source-panel[hidden] { display:none; }
.video-drop-row { display:flex; align-items:center; flex-wrap:wrap; gap:10px; padding:14px; border:1px dashed #cbd5e1; border-radius:10px; background:#f8fafc; }
.video-source-panel input[type="url"] { width:100%; box-sizing:border-box; }
.field-help { margin-top:7px; color:#64748b; font-size:12px; }
.media-preview.video-preview-large { width:100%; max-width:680px; max-height:380px; margin-top:12px; background:#0f172a; border-radius:12px; }
@media (max-width:640px) { .video-source-switch { display:flex; } .video-source-btn { flex:1; } .video-drop-row input[type="file"] { width:100%; } }
.gallery-preview {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 6px;
}
.gallery-preview img {
    width: 80px;
    height: 80px;
    object-fit: cover;
    border-radius: 4px;
    border: 1px solid #ddd;
}

/* ===== 富文本编辑器 ===== */
.rt-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px;
    padding: 6px 8px;
    background: #f8f9fa;
    border: 1px solid #ddd;
    border-bottom: none;
    border-radius: 4px 4px 0 0;
}
.rt-toolbar button {
    padding: 4px 10px;
    background: #fff;
    border: 1px solid #d1d5db;
    border-radius: 3px;
    cursor: pointer;
    font-size: 13px;
    line-height: 1.4;
}
.rt-toolbar button:hover { background: #e8f5e9; }
.rt-toolbar .rt-sep {
    color: #cbd5e0;
    margin: 0 4px;
}
.rt-editor {
    border-radius: 0 0 4px 4px;
    font-size: 14px;
    line-height: 1.6;
}
.rt-editor:empty::before { content:attr(data-placeholder); color:#94a3b8; pointer-events:none; }
.rt-editor.uploading { opacity:.65; cursor:wait; }
.rt-editor p { margin:0 0 12px; }
.rt-editor h2 { margin:20px 0 10px; }
.rt-editor img { max-width: 100%; height: auto; }
.rt-editor video, .rt-editor audio { max-width: 100%; }
.rt-editor blockquote {
    border-left: 4px solid #ddd;
    padding-left: 12px;
    color: #555;
    margin: 8px 0;
}
.wang-editor-box {
    overflow: hidden;
    border: 1px solid #dfe2ea;
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 2px 10px rgba(24, 32, 51, .04);
    transition: border-color .18s ease, box-shadow .18s ease;
}
.wang-editor-box:focus-within {
    border-color: #5b5bd6;
    box-shadow: 0 0 0 3px rgba(91, 91, 214, .1);
}
.wang-editor-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-height: 38px;
    padding: 0 13px;
    border-bottom: 1px solid #e8eaf2;
    background: #fafbfc;
    color: #414a5f;
    font-size: 12px;
    font-weight: 700;
}
.wang-editor-heading > span:first-child {
    display: inline-flex;
    align-items: center;
    gap: 7px;
}
.wang-editor-heading .layui-icon-edit { color: #5b5bd6; }
.wang-scroll-tip {
    color: #8991a2;
    font-size: 11px;
    font-weight: 400;
}
.wang-scroll-tip .layui-icon {
    margin: 0 -3px;
    font-size: 11px;
}
#wang-toolbar-container {
    border-bottom: 1px solid #e5e7eb;
    background: #f8fafc;
}
#wang-editor-container {
    min-height: 360px;
    max-height: 56vh;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: #b7b9e8 #f4f5f9;
    scrollbar-gutter: stable;
}
#wang-editor-container::-webkit-scrollbar { width: 9px; }
#wang-editor-container::-webkit-scrollbar-track { background: #f4f5f9; }
#wang-editor-container::-webkit-scrollbar-thumb {
    border: 2px solid #f4f5f9;
    border-radius: 999px;
    background: #b7b9e8;
}
#wang-editor-container::-webkit-scrollbar-thumb:hover { background: #8587d8; }
@media (max-width: 600px) {
    .wang-scroll-tip { display: none; }
    #wang-editor-container { min-height: 300px; max-height: 58vh; }
}
.wang-editor-extra {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    margin-top: 9px;
}
.wang-editor-extra .field-help { margin: 0; }

/* 详情页媒体 */
.detail-media { margin-top: 16px; }
.detail-media h4 { margin: 0 0 8px; font-size: 14px; color: #555; }
.detail-gallery {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
    gap: 8px;
    margin-bottom: 16px;
}
.detail-gallery img {
    width: 100%;
    aspect-ratio: 1;
    object-fit: cover;
    border-radius: 6px;
    cursor: pointer;
    transition: transform .2s;
}
.detail-gallery img:hover { transform: scale(1.05); }
.detail-video, .detail-audio {
    width: 100%;
    margin-bottom: 12px;
}
.detail-desc img {
    display: block !important;
    box-sizing: border-box;
    width: 100% !important;
    max-width: 680px !important;
    height: clamp(280px, 58vw, 510px) !important;
    margin: 16px auto !important;
    padding: 8px;
    border: 1px solid #eef2f7;
    border-radius: 10px;
    background: #f8fafc;
    object-fit: contain;
    object-position: center;
}
.detail-desc video { display:block; max-width:100%; height:auto; border-radius:6px; margin:12px auto; }
.detail-desc audio { width: 100%; margin: 8px 0; }

@media (max-width: 620px) {
    .detail-image { aspect-ratio: 1 / 1; }
    .detail-desc img { height: min(92vw, 390px) !important; padding: 5px; }
}

/* ===== 整站水印(防复制) - v2: 单 div + SVG background-image 平铺 ===== */
.zh-watermark {
    position: fixed;
    inset: 0;
    z-index: 9999;
    pointer-events: none;
    overflow: hidden;
    user-select: none;
    background-repeat: repeat;
}
@media print {
    .zh-watermark { display: none; }
}
.zh-tab {
    padding: 10px 20px;
    color: #555;
    text-decoration: none;
    border-bottom: 3px solid transparent;
    margin-bottom: -2px;
    font-size: 14px;
    transition: all .15s;
}

/* ===== 前台视觉系统 v3 ===== */
:root { --front-primary:#4f46e5; --front-primary-2:#7c3aed; --front-text:#172033; --front-muted:#718096; --front-border:#e8eaf2; }
body { background:linear-gradient(180deg,#f8f9ff 0,#f4f6fb 420px,#f7f8fc 100%); color:var(--front-text); }
.navbar { background:rgba(255,255,255,.88); border-bottom:1px solid rgba(226,232,240,.85); backdrop-filter:blur(16px); position:sticky; top:0; z-index:100; }
.navbar-inner { max-width:1120px; min-height:72px; }.brand-logo { width:46px; height:46px; border-radius:13px; object-fit:cover; box-shadow:0 5px 16px rgba(15,23,42,.14); }
.navbar-nav { gap:5px; }.navbar-nav a { border-radius:9px; padding:8px 12px; font-size:14px; }.navbar-nav a:hover,.navbar-nav a.active { color:var(--front-primary); background:#eef2ff; }
.container { max-width:1080px; padding-top:34px; }.container-narrow { max-width:820px; }
.hero { position:relative; overflow:hidden; min-height:570px; display:flex; flex-direction:column; justify-content:center; padding:56px 24px; border:1px solid rgba(255,255,255,.8); border-radius:24px; background:radial-gradient(circle at 80% 10%,rgba(129,140,248,.22),transparent 35%),radial-gradient(circle at 15% 80%,rgba(192,132,252,.16),transparent 32%),rgba(255,255,255,.76); box-shadow:0 24px 70px rgba(79,70,229,.09); }
.hero-logo { width:190px; height:190px; border-radius:28px; box-shadow:0 22px 55px rgba(30,41,59,.18); }.hero h1 { font-size:38px; letter-spacing:-1px; margin-top:30px; }.hero p { font-size:16px; color:var(--front-muted); }
.btn-primary,.btn { background:linear-gradient(135deg,var(--front-primary),#6366f1); border-color:transparent; border-radius:9px; box-shadow:0 6px 16px rgba(79,70,229,.18); }.btn-primary:hover,.btn:hover { background:linear-gradient(135deg,#4338ca,#5b5fe8); transform:translateY(-1px); }.btn-outline { background:#fff; border-color:#dfe3ec; color:#475569; box-shadow:none; }
.card { border:1px solid var(--front-border); border-radius:16px; box-shadow:0 9px 30px rgba(30,41,59,.055); padding:24px; }.card-header { border-color:var(--front-border); font-size:17px; }
.search-form { padding:6px; border:1px solid #dfe3ec; border-radius:13px; background:#fff; box-shadow:0 8px 24px rgba(30,41,59,.06); }.search-form .form-input { border:0; box-shadow:none; padding:12px 14px; }.search-form .btn { min-width:92px; }
.category-chips { display:flex; flex-direction:column; align-items:stretch; gap:8px; width:min(100%,320px); margin-top:15px; }.category-chip { display:flex; align-items:center; width:100%; box-sizing:border-box; padding:9px 13px; border:1px solid #e2e5ee; border-radius:10px; color:#64748b; background:#fff; text-decoration:none; font-size:13px; transition:.18s; }.category-chip:hover,.category-chip.active { color:#fff; border-color:transparent; background:linear-gradient(135deg,var(--front-primary),var(--front-primary-2)); box-shadow:0 5px 12px rgba(79,70,229,.2); }
@media(min-width:721px){.hero .guest-categories{width:min(100%,760px);flex-direction:row;flex-wrap:wrap;justify-content:center;align-items:center}.hero .guest-categories .category-chip{width:auto;border-radius:999px;padding:8px 14px}}
.content-browser { display:block; margin-top:18px; }
.category-sidebar { margin-bottom:18px; }
.category-sidebar-title { display:none; }
.category-sidebar .category-chips { width:100%; flex-direction:row; flex-wrap:wrap; gap:8px; margin:0; }
.category-sidebar .category-chip { width:auto; min-height:0; padding:8px 14px; border:1px solid #e2e5ee; border-radius:999px; background:#fff; color:#64748b; box-shadow:none; line-height:1.45; }
.category-sidebar .category-chip:hover,.category-sidebar .category-chip.active { color:#fff; border-color:transparent; background:linear-gradient(135deg,var(--front-primary),var(--front-primary-2)); box-shadow:0 5px 12px rgba(79,70,229,.2); }
.category-sidebar-hint { margin:10px 0 0; color:#8a94a6; font-size:12px; line-height:1.55; }
.content-results { min-width:0; margin:0; }
.item-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }.item-row { border:1px solid var(--front-border); border-radius:13px; padding:13px; background:#fff; }.item-row:hover { border-color:#c7d2fe; transform:translateY(-2px); box-shadow:0 12px 25px rgba(79,70,229,.08); }.item-thumb { width:92px; height:92px; flex:0 0 92px; border-radius:10px; }.item-title { font-size:15px; }.item-desc { color:var(--front-muted); }
.detail-image img,.detail-video { border-radius:14px; }.detail-meta { padding-bottom:14px; border-bottom:1px solid var(--front-border); }
.level-badge,.badge { border-radius:999px; }
@media(max-width:720px){.navbar-inner{min-height:62px}.navbar-nav{overflow-x:auto}.navbar-nav a{white-space:nowrap;padding:7px 9px}.container{padding:20px 14px 34px}.hero{min-height:480px;border-radius:18px}.hero-logo{width:150px;height:150px}.hero h1{font-size:28px}.item-list{grid-template-columns:1fr}.item-thumb{width:76px;height:76px;flex-basis:76px}.card{padding:17px}.category-chips{width:100%;overflow:visible;padding-bottom:0}.category-chip{flex:none}.content-browser{display:grid;grid-template-columns:112px minmax(0,1fr);align-items:start;gap:0;margin-left:-14px;margin-right:-14px}.category-sidebar{position:sticky;top:62px;overflow:hidden;margin:0;border:1px solid #e8eaf1;border-left:0;border-radius:0;background:#f7f8fb}.category-sidebar-title{display:block;padding:13px 10px;border-bottom:1px solid #eceef4;background:#fff;color:#172033;font-size:13px;font-weight:700}.category-sidebar .category-chips{flex-direction:column;flex-wrap:nowrap;gap:0}.category-sidebar .category-chip{width:100%;min-height:48px;padding:10px 8px;border:0;border-left:3px solid transparent;border-radius:0;background:transparent;color:#374151;box-shadow:none;font-size:12px}.category-sidebar .category-chip:hover{color:var(--front-primary);background:#eef2ff;box-shadow:none}.category-sidebar .category-chip.active{color:var(--front-primary);border-left-color:var(--front-primary);background:#fff;box-shadow:none;font-weight:700}.category-sidebar-hint{display:none}.content-results{border-radius:0;padding:13px}.content-results .card-header{gap:6px;align-items:flex-start}.content-results .item-row{gap:10px;padding:12px 0}.content-results .item-thumb{width:70px;height:70px;flex-basis:70px}}
.zh-tab:hover { color: #4fc3f7; background: #f8f9fa; }
.zh-tab.active {
    color: #4fc3f7;
    border-bottom-color: #4fc3f7;
    font-weight: 600;
}

/* 基础信息表单 label 颜色 */
.admin-main .form-row label {
    color: #2c3e50;
    font-weight: 500;
}

/* ===== 重新设计的系统配置页 ===== */
.config-layout {
    display: flex;
    gap: 16px;
    align-items: flex-start;
}
.config-side {
    width: 220px;
    flex: 0 0 220px;
    position: sticky;
    top: 12px;
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.06);
    overflow: hidden;
}
.config-side a {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 16px;
    color: #2c3e50;
    text-decoration: none;
    border-left: 3px solid transparent;
    font-size: 14px;
    transition: all .15s;
}
.config-side a:hover { background: #f8f9fa; }
.config-side a.active {
    background: #e8f4fd;
    color: #4fc3f7;
    border-left-color: #4fc3f7;
    font-weight: 600;
}
.config-side .side-icon {
    font-size: 16px;
    width: 20px;
    text-align: center;
}
.config-side .side-count {
    margin-left: auto;
    font-size: 11px;
    background: #ecf0f1;
    color: #7f8c8d;
    padding: 1px 6px;
    border-radius: 8px;
}
.config-side a.active .side-count { background: #4fc3f7; color: #fff; }
.config-side .side-section {
    padding: 10px 16px 4px;
    font-size: 11px;
    color: #95a5a6;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    background: #f8f9fa;
    border-top: 1px solid #ecf0f1;
}
.config-side .side-section:first-child { border-top: 0; }

.config-main {
    flex: 1;
    min-width: 0;
}

.config-card {
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.06);
    margin-bottom: 16px;
    overflow: hidden;
}
.config-card-header {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px 20px;
    border-bottom: 1px solid #ecf0f1;
    background: linear-gradient(to right, #fafbfc, #fff);
}
.config-card-header h3 {
    margin: 0;
    font-size: 15px;
    color: #2c3e50;
    font-weight: 600;
}
.config-card-header .header-sub {
    font-size: 12px;
    color: #95a5a6;
}
.config-card-body {
    padding: 20px;
}
.config-card-footer {
    padding: 12px 20px;
    background: #f8f9fa;
    border-top: 1px solid #ecf0f1;
    display: flex;
    align-items: center;
    gap: 8px;
    justify-content: flex-end;
}

/* 配置概览卡 */
.config-overview {
    background: linear-gradient(135deg, #4fc3f7 0%, #2196f3 100%);
    color: #fff;
    border-radius: 8px;
    padding: 20px;
    margin-bottom: 16px;
}
.config-overview h2 {
    margin: 0 0 4px;
    font-size: 20px;
}
.config-overview .ov-sub {
    opacity: 0.85;
    font-size: 13px;
    margin-bottom: 16px;
}
.config-overview .ov-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 12px;
}
.config-overview .ov-item {
    background: rgba(255,255,255,0.15);
    border-radius: 6px;
    padding: 12px;
    backdrop-filter: blur(4px);
}
.config-overview .ov-item .label {
    font-size: 12px;
    opacity: 0.85;
}
.config-overview .ov-item .value {
    font-size: 18px;
    font-weight: bold;
    margin-top: 4px;
}
.config-overview .ov-item.set .value { color: #fff; }
.config-overview .ov-item.unset .value { color: rgba(255,255,255,0.55); font-weight: normal; }

/* 表单字段包装 */
.config-field {
    margin-bottom: 16px;
}
.config-field:last-child { margin-bottom: 0; }
.config-field > label {
    display: block;
    margin-bottom: 6px;
    color: #2c3e50;
    font-weight: 500;
    font-size: 13px;
}
.config-field .help {
    display: block;
    margin-top: 4px;
    color: #95a5a6;
    font-size: 12px;
}
.config-field input[type="text"],
.config-field input[type="email"],
.config-field input[type="url"],
.config-field input[type="number"],
.config-field select,
.config-field textarea {
    width: 100%;
    padding: 8px 12px;
    border: 1px solid #dce4ec;
    border-radius: 4px;
    font-size: 13px;
    box-sizing: border-box;
    transition: border-color .15s;
    background: #fff;
}
.config-field input:focus,
.config-field select:focus,
.config-field textarea:focus {
    outline: none;
    border-color: #4fc3f7;
    box-shadow: 0 0 0 2px rgba(79, 195, 247, 0.15);
}
.config-field textarea { min-height: 70px; resize: vertical; }
.config-field .row-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.config-field .row-3 { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 16px; }

.config-field input[type="checkbox"] {
    margin-right: 6px;
    vertical-align: middle;
}

.config-field .upload-row {
    display: flex;
    align-items: center;
    gap: 8px;
}
.config-field .upload-row input[type="text"] { flex: 1; }
.config-field .upload-row input[type="file"] { flex: 0 0 200px; }
.config-field .preview-img {
    margin-top: 8px;
    max-height: 80px;
    border: 1px solid #ecf0f1;
    padding: 4px;
    border-radius: 4px;
    background: #fff;
}
.config-field .preview-qr {
    margin-top: 8px;
    max-width: 120px;
    border: 1px solid #ecf0f1;
    padding: 4px;
    border-radius: 4px;
    background: #fff;
}

/* 开关 */
.zh-switch {
    position: relative;
    display: inline-block;
    width: 44px;
    height: 22px;
}
.zh-switch input { display: none; }
.zh-switch .slider {
    position: absolute;
    inset: 0;
    background: #dce4ec;
    border-radius: 22px;
    transition: .2s;
    cursor: pointer;
}
.zh-switch .slider::before {
    content: '';
    position: absolute;
    top: 3px;
    left: 3px;
    width: 16px;
    height: 16px;
    background: #fff;
    border-radius: 50%;
    transition: .2s;
}
.zh-switch input:checked + .slider { background: #4fc3f7; }
.zh-switch input:checked + .slider::before { transform: translateX(22px); }

/* 状态徽章 */
.zh-tag {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 10px;
    font-size: 11px;
    background: #ecf0f1;
    color: #7f8c8d;
}
.zh-tag.ok { background: #d4edda; color: #155724; }
.zh-tag.warn { background: #fff3cd; color: #856404; }

.auth-card{max-width:560px;margin:20px auto;padding:34px;border-radius:20px}.auth-heading{display:flex;align-items:center;gap:14px;margin-bottom:25px}.auth-heading img{width:54px;height:54px;border-radius:15px;box-shadow:0 7px 20px #1e293b24}.auth-heading h1{margin:0;font-size:25px}.auth-heading p{margin:5px 0 0;color:#718096;font-size:13px}.auth-tabs{display:grid;grid-template-columns:1fr 1fr;padding:4px;margin-bottom:18px;border-radius:11px;background:#f1f3f8}.auth-tab{padding:10px;border:0;border-radius:8px;background:transparent;color:#64748b;font-size:14px;cursor:pointer}.auth-tab.active{background:#fff;color:#4f46e5;font-weight:600;box-shadow:0 3px 10px #1e293b12}.account-auth-grid.single{display:block}.account-auth-box{display:none;padding:0;border:0;background:transparent}.account-auth-box.active{display:block}.account-auth-box .form-input{height:48px;border-radius:10px}.account-auth-box .btn{height:48px;font-size:15px}.auth-divider{display:flex;align-items:center;gap:12px;margin:24px 0 18px;color:#94a3b8;font-size:12px}.auth-divider:before,.auth-divider:after{content:"";height:1px;background:#e8eaf2;flex:1}.auth-captcha-row{display:grid;grid-template-columns:minmax(0,1fr) 140px;gap:10px;align-items:center}.auth-captcha-row img{display:block;width:140px;height:48px;border:1px solid #d8deed;border-radius:10px;cursor:pointer}.auth-captcha-refresh{display:block;margin:7px 0 0 auto;padding:0;border:0;background:transparent;color:#64748b;font-size:12px;cursor:pointer}.auth-captcha-refresh:hover{color:#4f46e5}
.admin-login-page{min-height:calc(100vh - 80px);display:flex;align-items:center;justify-content:center}.admin-login-card{width:100%;max-width:470px}.admin-login-links{display:flex;align-items:center;justify-content:center;gap:10px;margin-top:22px;color:#94a3b8;font-size:13px}.admin-login-links a{color:#4f46e5;text-decoration:none}.admin-login-links a:hover{text-decoration:underline}
@media(max-width:620px){.auth-card{margin:0 auto;padding:22px 18px;border-radius:16px}.auth-heading{margin-bottom:20px}.auth-heading img{width:48px;height:48px}.auth-heading h1{font-size:22px}.auth-captcha-row{grid-template-columns:minmax(0,1fr) 118px}.auth-captcha-row img{width:118px;object-fit:cover}}

@media (max-width: 768px) {
    .config-layout { flex-direction: column; }
    .config-side { width: 100%; position: static; }
    .config-field .row-2, .config-field .row-3 { grid-template-columns: 1fr; }
}

@media (max-width: 720px) {
    .navbar-inner{flex-wrap:wrap;padding:9px 14px 7px;gap:7px}.navbar-brand{flex:1}.navbar-nav{order:2;width:100%;padding-top:6px;border-top:1px solid #eef0f5;overflow-x:auto;scrollbar-width:none}.navbar-nav a{flex:0 0 auto;white-space:nowrap}
    .hero{min-height:auto;padding:44px 18px 48px}.hero-logo{width:138px;height:138px}.hero-actions{width:100%;display:grid;grid-template-columns:1fr 1fr;gap:10px}.hero-actions .btn{margin:0;padding:12px 8px}
    .table-responsive{overflow:visible}.table{min-width:0;border:0}.table thead{display:none}.table tbody,.table tr,.table td{display:block;width:100%;box-sizing:border-box}.table tr{margin-bottom:12px;padding:12px 14px;border:1px solid #e8eaf2;border-radius:12px;background:#fff}.table td{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:8px 0;border-bottom:1px dashed #edf0f5;text-align:right}.table td:last-child{border-bottom:0}.table td:before{content:attr(data-label);color:#718096;font-size:12px;font-weight:500;text-align:left}
}

/* 搜索后折叠分类：桌面端不显示折叠按钮 */
.category-fold-toggle{display:none}

/* 最终移动端首页布局：按后台顺序固定三列 */
@media (max-width: 720px) {
    .navbar-brand .brand-logo{width:40px;height:40px;border-radius:11px}
    .hero .hero-logo{width:108px;height:108px;border-radius:22px}
    .hero .guest-categories,
    .category-sidebar .category-chips{display:grid;width:100%;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;overflow:visible;padding:2px 0 9px}
    .hero .guest-categories .category-chip,.category-sidebar .category-chip{display:flex;width:100%;min-width:0;min-height:42px;align-items:center;justify-content:center;padding:7px 4px;border:1px solid #e2e5ee;border-radius:12px;background:#fff;color:#64748b;font-size:11px;line-height:1.25;text-align:center;white-space:normal;box-shadow:none}
    .hero .guest-categories .category-chip.active,.category-sidebar .category-chip.active{color:#fff;border-color:transparent;background:linear-gradient(135deg,var(--front-primary),var(--front-primary-2));box-shadow:0 5px 12px rgba(79,70,229,.2)}
    .content-browser{display:block;margin-left:0;margin-right:0}
    .category-sidebar{position:static;overflow:visible;margin:0 0 14px;border:0;background:transparent}
    .category-sidebar-title{display:none}
    .content-results{border-radius:16px}

    /* 搜索后折叠分类，优先展示列表 */
    .category-fold-toggle{
        display:flex;align-items:center;justify-content:space-between;gap:10px;
        width:100%;margin:0 0 10px;padding:11px 14px;
        border:1px solid #e2e5ee;border-radius:12px;background:#fff;
        color:#334155;font-size:13px;font-weight:600;line-height:1.3;
        cursor:pointer;-webkit-tap-highlight-color:transparent;
    }
    .category-fold-toggle:active{background:#f8fafc}
    .category-fold-label{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:left}
    .category-fold-action{
        flex:0 0 auto;display:inline-flex;align-items:center;gap:4px;
        color:var(--front-primary,#4f46e5);font-size:12px;font-weight:700;
    }
    .category-fold-action::after{
        content:"";width:7px;height:7px;margin-top:-2px;
        border-right:2px solid currentColor;border-bottom:2px solid currentColor;
        transform:rotate(45deg);
    }
    .category-fold:not(.is-collapsed) .category-fold-action::after{margin-top:2px;transform:rotate(-135deg)}
    .category-fold.is-collapsed .category-chips,
    .category-fold.is-collapsed .category-sidebar-hint{display:none}
    .hero .category-fold{width:100%;max-width:760px;margin:0 auto}
}

/* 分类内容数量 */
.category-chip{gap:7px;justify-content:space-between}
.category-count{display:inline-flex;align-items:center;justify-content:center;min-width:22px;height:20px;padding:0 6px;border-radius:999px;background:#eef2f7;color:#64748b;font-size:11px;font-weight:700;line-height:1}
.category-chip:hover .category-count,.category-chip.active .category-count{background:rgba(255,255,255,.22);color:#fff}
.hero .guest-categories .category-chip{justify-content:center}

/* 手机端各主页统一底部导航 */
@media(max-width:720px){
    body.front-mobile-nav{padding-bottom:calc(76px + env(safe-area-inset-bottom))}
    .mobile-bottom-nav{grid-template-columns:repeat(var(--mobile-nav-columns,4),minmax(0,1fr))}
    .mobile-bottom-nav a{min-width:0}
    .mobile-bottom-nav a:not(.active):hover{color:#6366f1;text-decoration:none}
    .hero .guest-categories .category-chip,.category-sidebar .category-chip{gap:4px;justify-content:center}
    .category-count{min-width:19px;height:18px;padding:0 5px;font-size:10px}
}