/* ── XiuRen.Live 前台通用样式 ── */

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}

:root{
  --bg:#0a0a0a;--bg2:#111111;--bg3:#161616;--bg4:#1c1c1c;
  --line:rgba(255,255,255,.06);--line2:rgba(255,255,255,.12);
  --accent:#c8a96e;--accent2:#8b6b3d;
  --text:#e8e8e8;--text2:#a0a0a0;--text3:#606060;
  --serif:'Georgia','Times New Roman',serif;
  --sans:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
}

html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--text);font-family:var(--sans);min-height:100vh;overflow-x:hidden;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}

/* NAV */
nav{position:fixed;top:0;left:0;right:0;z-index:100;background:rgba(10,10,10,.96);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--line);padding:0 32px;height:56px;display:flex;align-items:center;justify-content:space-between}
.nav-logo{font-family:var(--serif);font-size:18px;letter-spacing:.18em;color:var(--accent);text-transform:uppercase;text-decoration:none;flex-shrink:0}
.nav-logo span{color:var(--text3);font-size:9px;letter-spacing:.3em;display:block;margin-top:1px;font-family:var(--sans)}
.nav-links{display:flex;gap:28px;list-style:none;align-items:center}
.nav-links a{color:var(--text2);text-decoration:none;font-size:11px;letter-spacing:.2em;text-transform:uppercase;transition:color .3s;white-space:nowrap}
.nav-links a:hover{color:var(--accent)}
.nav-cta{border:1px solid var(--accent2);color:var(--accent)!important;padding:5px 14px;font-size:10px;letter-spacing:.15em;text-transform:uppercase;text-decoration:none}
.nav-hamburger{display:none;flex-direction:column;gap:5px;background:none;border:none;cursor:pointer;padding:6px}
.nav-hamburger span{display:block;width:22px;height:1px;background:var(--text2);transition:all .3s}
.nav-mobile-menu{display:none;position:fixed;top:56px;left:0;right:0;bottom:0;background:rgba(10,10,10,.98);z-index:101;flex-direction:column;align-items:center;justify-content:center;gap:32px;overflow-y:auto;-webkit-overflow-scrolling:touch}
.nav-mobile-menu.open{display:flex}
.nav-mobile-menu a{color:var(--text2);text-decoration:none;font-size:16px;letter-spacing:.3em;text-transform:uppercase;transition:color .3s}
.nav-mobile-menu a:hover,.nav-mobile-menu a:active{color:var(--accent)}

/* HERO */
.hero{height:100vh;min-height:560px;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}
.hero-bg{position:absolute;inset:0;background:radial-gradient(ellipse 60% 50% at 30% 50%,rgba(200,169,110,.07) 0%,transparent 60%),radial-gradient(ellipse 40% 60% at 80% 30%,rgba(200,169,110,.04) 0%,transparent 50%)}
.hero-grid{position:absolute;inset:0;background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:80px 80px;-webkit-mask-image:radial-gradient(ellipse 80% 80% at center,black 30%,transparent 100%);mask-image:radial-gradient(ellipse 80% 80% at center,black 30%,transparent 100%)}
.hero-content{text-align:center;position:relative;z-index:2;padding:0 24px}
.hero-eyebrow{font-size:10px;letter-spacing:.5em;text-transform:uppercase;color:var(--accent);margin-bottom:20px}
.hero-title{font-family:var(--serif);font-size:clamp(36px,7vw,80px);font-weight:400;line-height:1.08;letter-spacing:-.01em;margin-bottom:24px}
.hero-title em{font-style:italic;color:var(--accent)}
.hero-sub{font-size:13px;letter-spacing:.06em;color:var(--text2);max-width:380px;margin:0 auto 40px;line-height:1.8}
.hero-btns{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.btn-primary{background:var(--accent);color:#0a0a0a;border:none;padding:11px 28px;font-size:11px;letter-spacing:.18em;text-transform:uppercase;cursor:pointer;text-decoration:none;display:inline-block;transition:opacity .3s}
.btn-primary:hover{opacity:.85}
.btn-ghost{background:transparent;color:var(--text2);border:1px solid var(--line2);padding:11px 28px;font-size:11px;letter-spacing:.18em;text-transform:uppercase;cursor:pointer;text-decoration:none;display:inline-block;transition:border-color .3s,color .3s}
.btn-ghost:hover{border-color:var(--accent2);color:var(--accent)}

/* Hero 底部滚动提示 + 流光动画 */
.hero-scroll{position:absolute;bottom:32px;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:8px;color:var(--text3);font-size:9px;letter-spacing:.3em;text-transform:uppercase}
.scroll-line{width:1px;height:36px;background:linear-gradient(to bottom,transparent,var(--accent2));animation:scrollDown 2s infinite}
@keyframes scrollDown{0%{opacity:0;transform:scaleY(0);transform-origin:top}50%{opacity:1;transform:scaleY(1)}100%{opacity:0;transform:scaleY(1);transform-origin:bottom}}

/* CTA 探索按钮 */
.btn-explore{display:inline-block;background:transparent;color:#c8a96e;border:1px solid #c8a96e;padding:14px 40px;font-size:13px;letter-spacing:.15em;text-decoration:none;cursor:pointer;transition:all .3s}
.btn-explore:hover{background:#c8a96e;color:#0a0a0a}
.explore-cta-row{text-align:center;margin-top:56px;padding-bottom:16px}

/* 分类导航栏 - 居中对齐 */
.cat-nav{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:0 auto 32px;max-width:900px;padding:0 16px}
.cat-nav::-webkit-scrollbar{display:none}
.cat-nav a{display:inline-flex;padding:6px 16px;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:#a0a0a0;border:1px solid rgba(255,255,255,.08);transition:all .2s;border-radius:4px}
.cat-nav a:hover,.cat-nav a.active{color:#c8a96e;border-color:#c8a96e;background:rgba(200,169,110,.06)}
.cat-nav a.all-btn{color:#606060;border-color:rgba(255,255,255,.04)}
.cat-nav a.all-btn:hover{color:#a0a0a0;border-color:rgba(255,255,255,.08)}
.cat-nav a.all-btn.active{color:#c8a96e;border-color:#c8a96e;background:rgba(200,169,110,.06)}

/* 分类导航 — 更多下拉 */
.cat-more-wrap{position:relative;display:inline-flex}
.cat-more-btn{display:inline-flex;padding:6px 16px;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--text3);border:1px solid var(--line);background:transparent;border-radius:4px;cursor:pointer;transition:all .2s;font-family:var(--sans);white-space:nowrap}
.cat-more-btn:hover{color:var(--accent);border-color:var(--accent2);background:rgba(200,169,110,.06)}
.cat-more-dropdown{display:none;position:absolute;top:100%;right:0;z-index:50;min-width:140px;background:var(--bg2);border:1px solid var(--line);border-radius:6px;padding:6px 0;margin-top:4px;box-shadow:0 8px 24px rgba(0,0,0,.35)}
.cat-more-dropdown.open{display:flex;flex-direction:column}
.cat-more-dropdown a{display:block;padding:7px 14px;font-size:11px;letter-spacing:.1em;color:var(--text2);text-decoration:none;white-space:nowrap;transition:all .2s}
.cat-more-dropdown a:hover{color:var(--accent);background:rgba(200,169,110,.06)}

/* 卡片上的分类标签 */
.model-card .card-cats{display:flex;flex-wrap:nowrap;gap:4px;justify-content:center;margin:8px 0 0;max-width:100%;overflow:hidden}
.model-card .card-cat{font-size:8px;letter-spacing:.08em;text-transform:uppercase;color:#8b6b3d;border:1px solid rgba(139,107,61,.3);padding:2px 6px;white-space:nowrap;transition:all .2s}
.model-card .card-cat:hover{background:rgba(139,107,61,.15);color:#c8a96e}
.model-card .card-cat::before{content:'#';margin-right:2px;opacity:.5}

/* 筛选状态提示 */
.filter-status{text-align:center;margin:0 auto 16px;max-width:600px;font-size:12px;color:#707070}
.filter-status strong{color:#c8a96e}

/* SECTIONS */
section{padding:80px 32px}
.section-label{font-size:10px;letter-spacing:.5em;text-transform:uppercase;color:var(--accent);margin-bottom:10px}
.section-title{font-family:var(--serif);font-size:clamp(24px,4vw,40px);font-weight:400;margin-bottom:14px}
.section-desc{font-size:13px;color:var(--text2);line-height:1.8;max-width:480px}
.divider{width:40px;height:1px;background:var(--accent2);margin:20px 0}

/* MODELS GRID */
.models-header{text-align:center;max-width:600px;margin:0 auto 56px}
.models-header .section-desc{max-width:100%}
.models-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:1px;background:var(--line);max-width:1200px;margin:0 auto}
.model-card{background:var(--bg2);padding:36px 20px 28px;display:flex;flex-direction:column;align-items:center;text-align:center;position:relative;overflow:hidden;transition:background .3s;cursor:pointer;min-height:340px}
.model-card:hover{background:var(--bg3)}
.model-card::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,var(--accent2),transparent);opacity:0;transition:opacity .4s}
.model-card:hover::before{opacity:1}
.model-avatar-ring{width:92px;height:92px;border-radius:50%;border:1px solid var(--accent2);display:flex;align-items:center;justify-content:center;margin-bottom:16px;position:relative;flex-shrink:0}
.model-avatar-ring::after{content:'';position:absolute;inset:-4px;border-radius:50%;border:1px solid var(--line)}
.avatar-inner{width:80px;height:80px;border-radius:50%;overflow:hidden}
.avatar-inner img{width:100%;height:100%;object-fit:cover;filter:grayscale(15%);transition:filter .4s}
.model-card:hover .avatar-inner img{filter:grayscale(0%)}
.model-name{font-family:var(--serif);font-size:16px;font-weight:400;margin-bottom:4px;color:var(--text)}
/* 首页模型卡片名字 - 缩小 */
.models-grid .model-card .model-name{font-size:15px!important}
.model-detail .model-name{font-size:32px}
.model-role{font-size:8px!important;letter-spacing:.3em;text-transform:uppercase;color:var(--accent);margin-bottom:14px}
.model-divider{width:24px;height:1px;background:var(--line2);margin:0 auto 14px}
.model-bio{font-size:11px!important;color:var(--text2);line-height:1.8;max-height:65px;overflow:hidden}
/* 首页卡片标签 — 最多显示3个 */
.models-grid .model-card .model-tags{display:flex;flex-wrap:wrap;gap:5px;justify-content:center;margin-top:auto;padding:0 8px}
.models-grid .model-card .model-tag:nth-child(n+4){display:none!important}
/* 详情页标签 — 同样限制显示3个 */
.model-detail .model-tags span:nth-child(n+4){display:none!important}
.models-grid .model-card .model-tag{font-size:9px!important;letter-spacing:.1em;text-transform:uppercase;color:var(--text3)!important;border:1px solid var(--line)!important;padding:2px 8px!important;white-space:nowrap!important;border-radius:3px!important;flex-shrink:0!important;display:inline-block!important}
/* 空白占位卡片 */
.model-card[style*="opacity:.25"]{background:transparent;border:none!important;pointer-events:none}

/* 当天发布角标 */
.model-badge-new {
  position: absolute;
  top: 8px;
  right: 8px;
  background: #e74c3c;
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  padding: 2px 6px;
  border-radius: 3px;
  letter-spacing: .05em;
  z-index: 5;
  box-shadow: 0 2px 8px rgba(231,76,60,.35);
  pointer-events: none;
}

/* SEARCH */
.search-bar{position:relative;max-width:420px;margin:16px auto 32px;text-align:center}
.search-input{width:100%;background:var(--bg3);border:1px solid var(--line2);color:var(--text);padding:11px 40px 11px 16px;font-size:13px;font-family:var(--sans);outline:none;transition:border-color .2s;border-radius:2px}
.search-input:focus{border-color:var(--accent2)}
.search-input::placeholder{color:var(--text3)}
.search-icon{position:absolute;right:14px;top:50%;transform:translateY(-50%);color:var(--text3);font-size:16px;pointer-events:none}

/* PAGINATION */
.pagination-row{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;margin-top:48px;gap:16px;padding:0 4px}
.pagination{display:inline-flex;align-items:center;gap:6px;flex-wrap:nowrap;justify-content:center}
.page-btn{display:inline-flex;align-items:center;justify-content:center;min-width:38px;height:38px;padding:0 14px;background:transparent;color:var(--text2);border:1px solid var(--line);border-radius:6px;font-size:13px;cursor:pointer;transition:all .2s;text-decoration:none;white-space:nowrap;font-family:var(--sans)}
.page-btn:hover{border-color:var(--accent2);color:var(--accent)}
.page-btn.active{background:var(--accent);color:#0a0a0a;border-color:var(--accent);font-weight:600}
.page-btn:disabled{opacity:.3;cursor:default;pointer-events:none}
.page-dots{display:inline-flex;align-items:center;justify-content:center;min-width:38px;height:38px;font-size:13px;color:var(--text3);letter-spacing:.15em;user-select:none}
/* 页面跳转 */
.page-jump{display:inline-flex;align-items:center;gap:8px;white-space:nowrap}
.page-info{font-size:12px;color:var(--text3);letter-spacing:.05em}
.page-jump-input{width:52px;height:38px;background:var(--bg2);border:1px solid var(--line);border-radius:6px;color:var(--text);font-size:13px;text-align:center;padding:0 6px;appearance:textfield;-moz-appearance:textfield}
.page-jump-input::-webkit-outer-spin-button,
.page-jump-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.page-jump-input:focus{outline:none;border-color:var(--accent)}
.page-jump-btn{height:38px;padding:0 14px;background:rgba(200,169,110,.08);color:var(--accent);border:1px solid var(--accent2);border-radius:6px;font-size:12px;cursor:pointer;transition:all .2s;font-weight:500;letter-spacing:.05em}
.page-jump-btn:hover{background:var(--accent);color:#0a0a0a;border-color:var(--accent)}
/* 手机端 */
@media(max-width:768px){
  .pagination-row{margin-top:32px;gap:10px;justify-content:center}
  .pagination{gap:4px}
  .page-btn{min-width:32px;height:32px;padding:0 10px;font-size:11px;border-radius:5px}
  .page-dots{min-width:28px;height:32px;font-size:11px}
  .page-jump-input{width:44px;height:32px;font-size:11px}
  .page-jump-btn{height:32px;padding:0 10px;font-size:11px}
}
@media(max-width:480px){
  .page-btn{min-width:28px;height:28px;padding:0 8px;font-size:10px}
  .pagination{gap:3px}
  .page-jump-input{width:38px;height:28px;font-size:10px}
  .page-jump-btn{height:28px;padding:0 8px;font-size:10px}
  .page-info{font-size:10px}
}

/* FOOTER */
footer{background:var(--bg2);border-top:1px solid var(--line);padding:40px 32px;text-align:center}
.footer-logo{font-family:var(--serif);font-size:16px;color:var(--accent);letter-spacing:.12em;margin-bottom:20px}
.footer-nav{display:flex;gap:20px;list-style:none;justify-content:center;flex-wrap:wrap;margin-bottom:20px}
.footer-nav a{font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--text3);text-decoration:none;transition:color .3s}
.footer-nav a:hover{color:var(--accent)}
.footer-copy{font-size:10px;color:var(--text3);letter-spacing:.05em}
.footer-link{color:var(--text3);text-decoration:none;margin-left:12px;transition:color .3s;border-left:1px solid var(--line);padding-left:12px}
.footer-link:hover{color:var(--accent)}

/* RESPONSIVE */
@media(max-width:768px){
  .models-grid{grid-template-columns:repeat(2,1fr)}
  .model-card{padding:22px 14px 16px;min-height:0}
  .model-avatar-ring{width:76px;height:76px;margin-bottom:12px}
  .avatar-inner{width:64px;height:64px}
  .model-name{font-size:14px}
  .model-role{margin-bottom:10px}
  .model-divider{margin:0 auto 10px}
  .model-bio{max-height:50px;margin-bottom:10px}
  /* 标签不再推到底部，紧跟bio */
  .models-grid .model-card .model-tags{width:100%;max-width:100%;margin-top:8px}
  footer{padding:32px 16px}
}
@media(max-width:768px){
  nav{padding:0 16px}
  .nav-links{display:none!important}
  .nav-hamburger{display:flex!important}
  .nav-mobile-menu{top:56px;left:0;right:0;bottom:0;padding:40px 24px}
  .nav-logo{font-size:15px}
  .nav-logo span{font-size:8px}
}
@media(max-width:480px){
  .model-card{padding:20px 10px 14px;min-height:0}
  .model-avatar-ring{width:60px;height:60px;margin-bottom:10px}
  .avatar-inner{width:50px;height:50px}
  .model-name{font-size:13px}
  .model-role{margin-bottom:8px}
  .model-divider{margin:0 auto 8px}
  .model-bio{max-height:44px;margin-bottom:8px}
  .models-grid .model-card .model-tags{margin-top:6px}
  /* 手机窄屏标签缩小 — 确保3个标签能平排 */
  .models-grid .model-card .model-tag{font-size:7px!important;padding:1px 4px!important}
  .models-grid .model-card .model-tags{gap:3px}
}
/* ── MODEL.PHP 详情页样式 ── */

.model-detail { padding-top: 60px; }
.model-detail .model-detail { padding-top: 0; }
.model-detail { max-width: 1000px; margin: 0 auto; padding: 32px 20px; }
.breadcrumb { font-size: 13px; color: var(--text3); margin-bottom: 24px; }
.breadcrumb a { color: var(--text2); text-decoration: none; transition: color .2s; }
.breadcrumb a:hover { color: var(--accent); }

.model-header { display: flex; gap: 28px; margin-bottom: 40px; flex-wrap: wrap; align-items: flex-start; }
.model-cover { width: 160px; height: 160px; border-radius: 50%; overflow: hidden; flex-shrink: 0; background: var(--bg3); border: 2px solid var(--line); }
.model-cover img { width: 100%; height: 100%; object-fit: cover; display: block; }
.model-info { flex: 1; min-width: 280px; }
.model-name { font-family: var(--serif); font-size: 32px; font-weight: 400; color: #fff; margin: 0 0 8px; letter-spacing: .02em; }
.model-role-tag { display: inline-block; font-size: 12px; color: var(--accent); margin-bottom: 16px; letter-spacing: .1em; }
.model-short-bio { font-size: 14px; line-height: 1.8; color: var(--text); background: var(--bg3); border-left: 3px solid var(--accent); padding: 14px 18px; border-radius: 0 8px 8px 0; margin-bottom: 20px; }
.model-bio-text { font-size: 13px; line-height: 1.9; color: var(--text2); margin-bottom: 20px; }
.model-bio-text p { margin: 0 0 10px; }
.model-bio-text p:last-child { margin-bottom: 0; }

/* ── 富文本：引用块（blockquote） ── */
.model-bio-text blockquote {
  border-left: 3px solid var(--accent);
  padding: 12px 18px;
  margin: 16px 0;
  background: rgba(200,169,110,.06);
  color: #ccc;
  font-style: italic;
  border-radius: 0 8px 8px 0;
  font-size: 13px;
  line-height: 1.8;
}
.model-bio-text blockquote p { margin: 0; }

/* ── 富文本：代码块（pre / code） ── */
.model-bio-text pre {
  background: #141414;
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 8px;
  padding: 16px 20px;
  margin: 16px 0;
  overflow-x: auto;
  font-family: 'Consolas','Monaco','Courier New',monospace;
  font-size: 12px;
  line-height: 1.65;
  color: #c8a96e;
  white-space: pre-wrap;
  word-wrap: break-word;
}
.model-bio-text code {
  background: rgba(200,169,110,.12);
  color: #c8a96e;
  padding: 2px 6px;
  border-radius: 3px;
  font-family: 'Consolas','Monaco','Courier New',monospace;
  font-size: 12px;
}
.model-bio-text pre code {
  background: none;
  padding: 0;
  color: inherit;
  font-size: inherit;
  font-family: inherit;
}

/* ── 富文本：有序/无序列表 ── */
.model-bio-text ol,
.model-bio-text ul {
  margin: 10px 0;
  padding-left: 24px;
}
.model-bio-text li { margin-bottom: 4px; }

/* ── 富文本：链接 ── */
.model-bio-text a {
  color: var(--accent);
  text-decoration: underline;
  text-underline-offset: 3px;
}
.model-bio-text a:hover { opacity: .8; }
.section-label { font-size: 11px; letter-spacing: .15em; text-transform: uppercase; color: var(--accent); margin-bottom: 10px; font-weight: 600; }
.section-label::before { content: '\25A0'; font-size: 8px; }
.model-tags { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.model-tags span { display: inline-block; background: var(--bg3); border: 1px solid var(--line); border-radius: 20px; padding: 5px 16px; font-size: 12px; color: var(--accent2); letter-spacing: .05em; }

/* 相关作品 — 超链接按钮 */
.link-section { margin-top: 32px; }
.link-btn {
    display: inline-flex; align-items: center; gap: 8px;
    background: linear-gradient(135deg, rgba(200,169,110,.12) 0%, rgba(200,169,110,.06) 100%);
    border: 1px solid var(--accent);
    color: var(--accent);
    padding: 14px 36px;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    letter-spacing: .08em;
    transition: all .3s;
}
.link-btn:hover { background: rgba(255,214,0,.15); box-shadow: 0 4px 20px rgba(255,214,0,.2); transform: translateY(-1px); }
.link-btn::before { content: '\2192'; font-weight: 700; }

/* 相关模特 */
.related-section { margin-top: 48px; }
.related-title { font-family: var(--serif); font-size: 20px; font-weight: 400; color: #fff; margin-bottom: 20px; padding-bottom: 12px; border-bottom: 1px solid var(--line); }
.related-order-tabs { display:flex; gap:6px; }
.ro-tab {
  background: rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.1);
  color: var(--text3); font-size:12px; padding:5px 14px; border-radius:20px;
  cursor:pointer; transition:all .2s; font-family:inherit;
}
.ro-tab:hover { border-color:rgba(255,214,0,.3); color:var(--text2); }
.ro-tab.active { background: linear-gradient(135deg,rgba(255,214,0,.18),rgba(255,214,0,.08)); border-color:var(--accent); color:var(--accent); }
.related-grid { display: flex; flex-wrap: wrap; gap: 14px; }
.related-grid a { display: flex; flex-direction: column; width: calc(25% - 11px); min-width: 160px; background: var(--bg2); border: 1px solid var(--line); border-radius: 8px; overflow: hidden; transition: border-color .2s; text-decoration: none; flex-shrink: 0; }
.related-grid a:hover { border-color: var(--accent2); }
.related-grid a > div:first-child { aspect-ratio: 3/4; overflow: hidden; background: var(--bg3); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.related-grid a > div:first-child img { width: 100%; height: 100%; object-fit: cover; display: block; transition: filter .5s ease; filter: grayscale(45%) brightness(.5); }
.related-grid a:hover > div:first-child img { filter: grayscale(0%) brightness(1); }
.related-grid a > div:last-child { padding: 10px 10px; flex-shrink: 0; text-align: center; }
.related-grid a > div:last-child div { font-size: 13px; color: var(--text); line-height: 1.3; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

@media (max-width: 768px) {
  .model-header { flex-direction: column; gap: 24px; align-items: center; }
  .model-cover { width: 120px; height: 120px; }
  .model-name { font-size: 24px; text-align: center; }
  .related-grid a { width: calc(33.333% - 10px); }
}

/* 作品列表 */
.works-section { margin-top: 48px; }
.section-title-bar {
  display:flex; align-items:center; gap:12px;
  margin-bottom:20px; padding-bottom:14px;
  border-bottom: 1px solid var(--line);
}
.section-title-text { font-family:var(--serif); font-size:20px; font-weight:400; color:#fff; margin:0; }
.section-title-count {
  display:inline-flex; align-items:center; justify-content:center;
  background:rgba(255,214,0,.12); color:var(--accent);
  font-size:11px; font-weight:600; letter-spacing:.08em;
  padding:2px 10px; border-radius:10px;
}
.works-grid { display:flex; flex-wrap:wrap; gap:16px; }
.work-card {
  display:flex; flex-direction:column;
  width:calc(25% - 12px); min-width:180px;
  background:var(--bg2);
  border:1px solid var(--line);
  border-radius:8px; overflow:hidden;
  text-decoration:none;
  transition:border-color .2s, transform .25s;
  flex-shrink:0;
}
.work-card:hover { border-color:var(--accent2); transform:translateY(-3px); box-shadow:0 6px 24px rgba(0,0,0,.4); }
.work-cover { aspect-ratio:3/4; overflow:hidden; background:var(--bg3); display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.work-cover img { width:100%; height:100%; object-fit:cover; display:block; transition:filter .5s ease, transform .6s ease; filter:grayscale(30%) brightness(.65); }
.work-card:hover .work-cover img { filter:grayscale(0%) brightness(1); transform:scale(1.05); }
.work-info { padding:12px 14px; flex-shrink:0; }
.work-title { font-size:13px; font-weight:600; color:#e8e8e8; line-height:1.4; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; margin-bottom:4px; }
.work-desc { font-size:11px; color:var(--text3); line-height:1.5; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

@media (max-width:768px) {
  .work-card { width:calc(33.333% - 11px); min-width:150px; }
}
@media (max-width: 480px) {
  .related-grid a { width: calc(50% - 7px); min-width: 130px; }
  .related-grid a > div:first-child { aspect-ratio: 1/1; }
  .work-card { width:calc(50% - 8px); min-width:130px; }
  .work-cover { aspect-ratio:1/1; }
}

/* ── CATEGORY.PHP 分类页样式 ── */

.cat-page { max-width: 1100px; margin: 0 auto; padding: 40px 24px; }
.cat-header { text-align: center; margin-bottom: 48px; }
.cat-back { font-size: 12px; color: var(--text3); letter-spacing: .08em; margin-bottom: 16px; }
.cat-back a { color: var(--text3); text-decoration: none; transition: color .2s; }
.cat-back a:hover { color: var(--accent); }
.cat-title { font-family: var(--serif); font-size: clamp(28px,4vw,42px); font-weight: 400; color: #fff; letter-spacing: .06em; }
.cat-count { font-size: 12px; color: var(--text3); margin-top: 8px; letter-spacing: .15em; text-transform: uppercase; }
.cat-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 20px; justify-content: center; margin-bottom: 48px; }
.cat-item { background: var(--bg2); border: 1px solid var(--line); border-radius: 12px; overflow: hidden; transition: all .25s ease; cursor: pointer; }
.cat-item:hover { border-color: var(--accent2); transform: translateY(-4px); box-shadow: 0 12px 32px rgba(0,0,0,.35); }
.cat-item-img { aspect-ratio: 3/4; overflow: hidden; background: var(--bg3); position: relative; }
.cat-item-img img { width: 100%; height: 100%; object-fit: cover; transition: filter .45s ease, transform .45s ease; filter: grayscale(40%) brightness(.55); }
.cat-item:hover .cat-item-img img { filter: grayscale(0%) brightness(1); transform: scale(1.05); }
.cat-item-img::after { content:''; position:absolute; bottom:0;left:0;right:0;height:40%;background:linear-gradient(transparent,rgba(0,0,0,.55));pointer-events:none; }
.cat-item-name { padding: 12px 14px; text-align: center; }
.cat-item-name span { font-size: 13px; color: var(--text); font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; }
.cat-empty { text-align: center; padding: 80px 0; color: var(--text3); }
.cat-empty-icon { font-size: 48px; margin-bottom: 16px; opacity: .3; }

@media (max-width: 900px) { .cat-grid { grid-template-columns: repeat(4, 1fr); gap: 16px; } }
@media (max-width: 680px) { .cat-grid { grid-template-columns: repeat(3, 1fr); gap: 12px; } }
@media (max-width: 480px) { .cat-grid { grid-template-columns: repeat(2, 1fr); gap: 10px; } .cat-page { padding: 24px 16px; } }

/* ── 详细介绍中的图片样式（已废弃，改用 model-gallery 网格，保留作降级） ── */
.model-bio-text img { max-width:100%; height:auto; display:block; margin:14px auto; border-radius:6px; }

/* ── 图片相册网格 ── */
.model-gallery {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
  margin-bottom: 28px;
}
.gallery-item {
  aspect-ratio: 3/4;
  overflow: hidden;
  border-radius: 6px;
  background: var(--bg3);
  border: 1px solid var(--line);
  cursor: pointer;
  transition: all .25s;
  position: relative;
}
.gallery-item:hover {
  border-color: var(--accent2);
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(0,0,0,.4);
}
.gallery-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: filter .4s ease, transform .5s ease;
  filter: grayscale(20%) brightness(.7);
}
.gallery-item:hover img {
  filter: grayscale(0%) brightness(1);
  transform: scale(1.04);
}

@media (max-width: 768px) {
  .model-gallery { grid-template-columns: repeat(3, 1fr); gap: 8px; }
}
@media (max-width: 480px) {
  .model-gallery { grid-template-columns: repeat(2, 1fr); gap: 6px; }
  .gallery-item { border-radius: 4px; }
}

/* ── 图片灯箱（相册） ── */
.gallery-lightbox { display:none; position:fixed; top:0;left:0;right:0;bottom:0;z-index:9999; }
.gallery-lightbox.open { display:block; }
.gallery-overlay { position:absolute; inset:0; background:rgba(0,0,0,.92); cursor:pointer; }
.gallery-close {
  position:absolute; top:20px; right:28px; z-index:10;
  background:none; border:none; color:#ccc; font-size:36px; line-height:1;
  cursor:pointer; transition:color .2s; padding:8px;
}
.gallery-close:hover { color:#fff; }
.gallery-prev, .gallery-next {
  position:absolute; top:50%; transform:translateY(-50%); z-index:10;
  background:rgba(0,0,0,.45); border:none; color:#ccc;
  font-size:42px; line-height:1; width:56px; height:80px;
  cursor:pointer; transition:all .2s; display:flex; align-items:center; justify-content:center;
}
.gallery-prev { left:0; border-radius:0 8px 8px 0; }
.gallery-next { right:0; border-radius:8px 0 0 8px; }
.gallery-prev:hover, .gallery-next:hover { background:rgba(200,169,110,.2); color:#fff; }
.gallery-image-wrap {
  position:absolute; inset:50px 60px 60px;
  display:flex; align-items:center; justify-content:center;
}
.gallery-image-wrap img {
  max-width:100%; max-height:100%; object-fit:contain;
  border-radius:4px; box-shadow:0 8px 40px rgba(0,0,0,.6);
  user-select:none; -webkit-user-select:none;
}
.gallery-counter {
  position:absolute; bottom:28px; left:50%; transform:translateX(-50%);
  color:rgba(255,255,255,.5); font-size:13px; letter-spacing:.1em;
  background:rgba(0,0,0,.4); padding:4px 16px; border-radius:12px;
}
.gallery-caption { display:none; }

@media (max-width:768px) {
  .gallery-close { top:12px; right:16px; font-size:30px; }
  .gallery-prev, .gallery-next { width:44px; height:60px; font-size:32px; }
  .gallery-image-wrap { inset:60px 50px 70px; }
  .gallery-counter { bottom:20px; font-size:12px; }
}
@media (max-width:480px) {
  .gallery-image-wrap { inset:60px 16px 70px; }
  .gallery-prev, .gallery-next { width:36px; height:50px; font-size:26px; }
}
