/* ============================================================
   临河村赵氏家族 · 数字宗祠  —  中式视觉规范
   宣纸米白 #F5F0E6 / 墨黑 #1A1A1A / 朱红 #B03A2E / 靛蓝 #2C3E5C
   ============================================================ */

:root{
  --paper:#F5F0E6;
  --paper-2:#FBF7EE;
  --paper-3:#EFE8D8;
  --ink:#1A1A1A;
  --ink-2:#4A4640;
  --ink-3:#8B8578;
  --zhu:#B03A2E;
  --zhu-soft:rgba(176,58,46,.12);
  --dian:#2C3E5C;
  --dian-soft:rgba(44,62,92,.08);
  --line:#D8CFC0;
  --font-kai:"KaiTi","STKaiti","Kaiti SC","楷体","BiauKai",serif;
  --font-song:"Songti SC","STSong","SimSun","宋体",serif;
  --font-hei:-apple-system,"PingFang SC","Microsoft YaHei",sans-serif;
}

*{box-sizing:border-box;}
html,body{margin:0;padding:0;max-width:100%;overflow-x:hidden;}
body{
  font-family:var(--font-song);
  color:var(--ink);
  background-color:var(--paper);
  background-image:
    repeating-linear-gradient(0deg, rgba(139,133,120,.030) 0 1px, transparent 1px 5px),
    repeating-linear-gradient(90deg, rgba(139,133,120,.022) 0 1px, transparent 1px 7px),
    radial-gradient(ellipse at 15% 10%, rgba(176,58,46,.035), transparent 55%),
    radial-gradient(ellipse at 85% 80%, rgba(44,62,92,.035), transparent 55%);
  min-height:100vh;
  -webkit-font-smoothing:antialiased;
  line-height:1.75;
}
a{color:inherit;text-decoration:none;}
button{font-family:inherit;cursor:pointer;}
.hidden{display:none !important;}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);}

/* ---------------- 页眉 ---------------- */
.site-header{
  background:var(--dian);
  background-image:linear-gradient(180deg,#31445f,#2C3E5C 60%,#27364f);
  color:#F5F0E6;
  position:sticky;top:0;z-index:50;
}
.header-inner{
  max-width:1280px;margin:0 auto;
  padding:14px 28px;
  display:flex;align-items:center;gap:32px;
}
.brand{display:flex;align-items:center;gap:12px;flex-shrink:0;}
.brand-seal{
  width:38px;height:38px;flex-shrink:0;
  background:var(--zhu);
  color:#FBF7EE;
  font-family:var(--font-kai);
  font-size:23px;line-height:38px;text-align:center;
  border-radius:3px;
  box-shadow:inset 0 0 0 1px rgba(251,247,238,.35);
  letter-spacing:0;
}
.brand-text{display:flex;flex-direction:column;line-height:1.3;}
.brand-text strong{
  font-family:var(--font-kai);
  font-size:20px;font-weight:400;letter-spacing:3px;
}
.brand-text em{
  font-style:normal;font-size:11px;letter-spacing:2px;
  color:rgba(245,240,230,.62);
  font-family:var(--font-song);
}
.main-nav{display:flex;gap:26px;margin-left:8px;flex:1;}
.main-nav a{
  font-family:var(--font-kai);
  font-size:16px;letter-spacing:2px;
  color:rgba(245,240,230,.78);
  padding:6px 0;position:relative;
  transition:color .18s ease;
}
.main-nav a:hover{color:#FBF7EE;}
.main-nav a.active{color:#FBF7EE;}
.main-nav a.active::after{
  content:"";position:absolute;left:0;right:0;bottom:-2px;height:2px;
  background:var(--zhu);opacity:.95;
}
.user-area{display:flex;align-items:center;gap:10px;margin-left:auto;flex-shrink:0;}
.meander{
  height:7px;
  background-color:rgba(0,0,0,.14);
  background-image:
    repeating-linear-gradient(90deg, rgba(176,58,46,.85) 0 2px, transparent 2px 14px),
    repeating-linear-gradient(90deg, transparent 0 7px, rgba(176,58,46,.5) 7px 9px, transparent 9px 14px);
  opacity:.5;
}

/* ---------------- 布局 ---------------- */
.view{max-width:1280px;margin:0 auto;padding:34px 28px 64px;}
.site-footer{margin-top:40px;}
.footer-inner{
  max-width:1280px;margin:0 auto;
  padding:18px 28px 26px;
  display:flex;flex-wrap:wrap;gap:8px;align-items:center;
  font-size:12px;color:var(--ink-3);letter-spacing:1px;
}
.footer-inner .sep{opacity:.5;}
.footer-inner .footer-domain{
  color:var(--ink-3);text-decoration:none;
  border-bottom:1px dotted var(--line);
  letter-spacing:.6px;transition:color .15s,border-color .15s;
}
.footer-inner .footer-domain:hover{color:var(--zhu);border-bottom-color:var(--zhu);}

/* ---------------- 通用组件 ---------------- */
.page-head{margin-bottom:26px;}
.page-head h2{
  font-family:var(--font-kai);
  font-size:26px;font-weight:400;letter-spacing:6px;
  margin:0 0 8px;color:var(--ink);
  display:flex;align-items:center;gap:12px;
}
.page-head h2::before{
  content:"";width:3px;height:22px;background:var(--zhu);display:inline-block;
}
.page-head p{margin:0;color:var(--ink-3);font-size:13px;letter-spacing:.5px;}
.page-head .sub-actions{margin-top:14px;display:flex;gap:10px;flex-wrap:wrap;}

.card{
  background:var(--paper-2);
  border:1px solid var(--line);
  border-radius:2px;
  padding:22px 24px;
  position:relative;
}
.card + .card{margin-top:18px;}
.card-title{
  font-family:var(--font-kai);font-size:17px;letter-spacing:3px;
  margin:0 0 16px;padding-bottom:10px;
  border-bottom:1px solid var(--line);
  display:flex;align-items:center;justify-content:space-between;gap:12px;
}
.card-title small{font-family:var(--font-song);font-size:12px;color:var(--ink-3);letter-spacing:.5px;}

.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:6px;
  padding:8px 18px;border-radius:2px;
  border:1px solid var(--zhu);background:transparent;color:var(--zhu);
  font-family:var(--font-kai);font-size:14px;letter-spacing:2px;
  transition:all .18s ease;white-space:nowrap;
}
.btn:hover{background:var(--zhu);color:#FBF7EE;}
.btn.solid{background:var(--zhu);color:#FBF7EE;}
.btn.solid:hover{background:#96301f;}
.btn.ghost{border-color:var(--line);color:var(--ink-2);}
.btn.ghost:hover{background:var(--paper-3);color:var(--ink);border-color:var(--ink-3);}
.btn.small{padding:5px 12px;font-size:12px;letter-spacing:1px;}
.btn:disabled{opacity:.45;cursor:not-allowed;}
.btn.on-header{
  border-color:rgba(245,240,230,.5);color:rgba(245,240,230,.92);
  padding:5px 14px;font-size:13px;
}
.btn.on-header:hover{background:rgba(245,240,230,.14);color:#FBF7EE;}
.btn.danger, .btn.ghost.danger{border-color:rgba(176,58,46,.42);color:var(--zhu);background:transparent;}
.btn.danger:hover, .btn.ghost.danger:hover{background:var(--zhu);border-color:var(--zhu);color:#FBF7EE;}

.tag{
  display:inline-block;padding:1px 8px;border-radius:2px;
  font-size:11px;letter-spacing:1px;font-family:var(--font-song);
  border:1px solid var(--line);color:var(--ink-3);background:rgba(255,255,255,.4);
}
.tag.zhu{border-color:rgba(176,58,46,.4);color:var(--zhu);background:var(--zhu-soft);}
.tag.dian{border-color:rgba(44,62,92,.35);color:var(--dian);background:var(--dian-soft);}
.tag.green{border-color:rgba(59,109,17,.35);color:#3B6D11;background:rgba(59,109,17,.08);}

input[type=text],input[type=password],input[type=search],input[type=date],input[type=number],select,textarea{
  font-family:var(--font-song);font-size:14px;color:var(--ink);
  background:rgba(255,255,255,.55);
  border:1px solid var(--line);border-radius:2px;
  padding:8px 10px;outline:none;width:100%;
  transition:border-color .15s ease,background .15s ease;
}
input:focus,select:focus,textarea:focus{border-color:var(--zhu);background:#fff;}
textarea{resize:vertical;min-height:90px;line-height:1.7;}
label.field{display:block;margin-bottom:14px;}
label.field > span{
  display:block;font-size:12px;color:var(--ink-3);
  letter-spacing:1px;margin-bottom:5px;
}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
.field-row-3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:14px;}

.empty{
  padding:60px 20px;text-align:center;color:var(--ink-3);
  font-size:14px;letter-spacing:1px;
}

/* ---------------- 世系图 ---------------- */
.tree-toolbar{
  display:flex;align-items:center;gap:12px;flex-wrap:wrap;
  padding:12px 16px;margin-bottom:14px;
  background:var(--paper-2);border:1px solid var(--line);border-radius:2px;
}
.tree-toolbar .grow{flex:1;}
.branch-tabs{display:flex;gap:6px;flex-wrap:wrap;}
.branch-tabs button{
  background:transparent;border:1px solid var(--line);color:var(--ink-2);
  padding:5px 14px;border-radius:2px;font-family:var(--font-kai);
  font-size:13px;letter-spacing:2px;transition:all .16s ease;
}
.branch-tabs button:hover{border-color:var(--zhu);color:var(--zhu);}
.branch-tabs button.active{background:var(--dian);border-color:var(--dian);color:#F5F0E6;}
.search-box{position:relative;width:210px;}
.search-box input{padding-left:30px;font-size:13px;}
.search-box::before{
  content:"⌕";position:absolute;left:10px;top:50%;transform:translateY(-52%);
  color:var(--ink-3);font-size:16px;pointer-events:none;
}
.zoom-group{display:flex;gap:0;border:1px solid var(--line);border-radius:2px;overflow:hidden;}
.zoom-group button{
  background:transparent;border:none;border-right:1px solid var(--line);
  padding:6px 12px;font-size:13px;color:var(--ink-2);
}
.zoom-group button:last-child{border-right:none;}
.zoom-group button:hover{background:var(--paper-3);color:var(--zhu);}
.zoom-group .pct{min-width:56px;text-align:center;font-size:12px;color:var(--ink-3);padding:6px 4px;}

.tree-stage{
  position:relative;overflow:hidden;
  height:min(76vh,820px);min-height:560px;
  background:var(--paper-2);
  border:1px solid var(--line);border-radius:2px;
  touch-action:none;
  background-image:
    repeating-linear-gradient(0deg, rgba(139,133,120,.028) 0 1px, transparent 1px 6px),
    radial-gradient(ellipse at 50% 0%, rgba(176,58,46,.03), transparent 60%);
  cursor:grab;
}
.tree-stage.dragging{cursor:grabbing;}
.tree-stage svg{display:block;}
.tree-hint{
  position:absolute;left:14px;bottom:12px;
  font-size:11px;color:var(--ink-3);letter-spacing:1px;
  background:rgba(251,247,238,.8);padding:3px 8px;border-radius:2px;
  pointer-events:none;
}
.legend{
  position:absolute;right:14px;top:12px;
  background:rgba(251,247,238,.92);border:1px solid var(--line);
  padding:10px 12px;border-radius:2px;font-size:11px;color:var(--ink-2);
  line-height:1.9;pointer-events:none;
}
.legend i{display:inline-block;vertical-align:middle;margin-right:6px;}
.legend .l-zhu{width:16px;height:0;border-top:1.5px solid var(--zhu);}
.legend .l-mo{width:16px;height:0;border-top:1px solid var(--ink);}
.legend .l-dot{width:9px;height:9px;border-radius:50%;border:1.5px solid var(--dian);background:var(--paper-3);}
.legend .l-fem{width:9px;height:9px;border-radius:50%;border:1.5px solid var(--zhu);background:var(--paper-3);}

/* SVG 节点交互 */
.tree-stage .node-g{cursor:pointer;}
.tree-stage .node-g:hover .node-label{fill:var(--zhu);}
.tree-stage .node-g.dim{opacity:.16;}
.tree-stage .node-g.hit .node-halo{opacity:1;}

/* 手机:竖列脉枝 */
.mobile-tree{
  background:var(--paper-2);
  border:1px solid var(--line);border-radius:2px;
  padding:8px 4px 10px;
  background-image:repeating-linear-gradient(0deg, rgba(139,133,120,.03) 0 1px, transparent 1px 7px);
}
.mobile-tree .mt-svg{display:block;width:100%;height:auto;max-width:460px;margin:0 auto;}
.mobile-tree .mt-row{cursor:pointer;}
.mobile-tree .mt-row:active{opacity:.6;}
.mobile-tree .mt-add{cursor:pointer;}
.mobile-tree .mt-add:active circle{fill:var(--zhu);}

/* 移动端逐世阅读 */
.generation-flow{padding:0;}
.gen-block{margin-bottom:6px;}
.gen-head{
  display:flex;align-items:center;gap:10px;
  padding:10px 0 8px;
  font-family:var(--font-kai);font-size:14px;letter-spacing:3px;color:var(--dian);
  position:sticky;top:0;background:var(--paper);z-index:5;
}
.gen-head::after{content:"";flex:1;height:1px;background:var(--line);}
.gen-people{display:flex;flex-direction:column;gap:8px;padding-bottom:12px;}
.person-row{
  display:flex;align-items:center;gap:12px;
  padding:12px 14px;background:var(--paper-2);border:1px solid var(--line);
  border-radius:2px;border-left:3px solid var(--zhu);
  transition:background .15s ease;
}
.person-row:active{background:var(--paper-3);}
.person-row.female{border-left-color:#B03A2E;background:linear-gradient(90deg,rgba(176,58,46,.04),transparent 40%);}
.person-row .pr-name{font-family:var(--font-kai);font-size:17px;letter-spacing:2px;}
.person-row .pr-meta{font-size:11px;color:var(--ink-3);letter-spacing:.5px;}
.person-row .pr-right{margin-left:auto;text-align:right;}

/* ---------------- 齿录页 ---------------- */
.scroll-card{
  background:var(--paper-2);
  border:1px solid var(--line);
  position:relative;
  padding:0;
  margin-bottom:22px;
}
.scroll-card::before,.scroll-card::after{
  content:"";position:absolute;left:0;right:0;height:12px;
  background-image:
    repeating-linear-gradient(90deg, var(--zhu) 0 1px, transparent 1px 9px,
      transparent 9px 10px);
  opacity:.32;
}
.scroll-card::before{top:0;}
.scroll-card::after{bottom:0;transform:scaleY(-1);}
.scroll-inner{padding:32px 34px 30px;}

.cartouche{display:flex;align-items:flex-start;gap:26px;flex-wrap:wrap;}
.cartouche .seal-name{
  flex-shrink:0;width:92px;height:118px;
  border:1px solid var(--zhu);border-radius:2px;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  background:rgba(176,58,46,.045);
  font-family:var(--font-kai);
}
.cartouche .seal-name .big{font-size:44px;line-height:1;color:var(--zhu);letter-spacing:0;}
.cartouche .seal-name .gen{font-size:11px;color:var(--ink-3);margin-top:10px;letter-spacing:2px;}
.cartouche .head-main{flex:1;min-width:220px;}
.cartouche h1{
  font-family:var(--font-kai);font-size:34px;font-weight:400;
  letter-spacing:8px;margin:0 0 6px;
}
.cartouche .sub-line{
  color:var(--ink-3);font-size:13px;letter-spacing:2px;margin-bottom:14px;
}
.cartouche .tags{display:flex;gap:8px;flex-wrap:wrap;}

/* ---- 头像 / 小像 ---- */
.avt{
  display:block;width:100%;height:100%;object-fit:cover;border-radius:50%;
  background:var(--paper-3);border:1px solid rgba(139,133,120,.4);
}
.avt-fallback{display:flex;align-items:center;justify-content:center;font-family:var(--font-kai);color:var(--zhu);}
.cartouche .portrait{flex-shrink:0;width:104px;display:flex;flex-direction:column;align-items:center;gap:8px;}
.cartouche .portrait .portrait-img{
  width:104px;height:104px;border:1px solid var(--zhu);
  box-shadow:0 0 0 3px var(--paper-2),0 0 0 4px rgba(176,58,46,.22);
}
.cartouche .portrait .gen{font-size:11px;color:var(--ink-3);letter-spacing:2px;font-family:var(--font-song);white-space:nowrap;}
.portrait-btn{padding:3px 10px;font-size:11px;letter-spacing:1px;}
.avatar-edit{
  display:flex;align-items:center;gap:14px;margin-bottom:18px;padding-bottom:14px;
  border-bottom:1px dotted rgba(139,133,120,.25);
}
.avatar-edit .edit-avt{width:62px;height:62px;flex-shrink:0;border:1px solid var(--zhu);}
.record-card .rc-avt{width:54px;height:54px;flex-shrink:0;border:1px solid var(--zhu);}
.person-row .pr-avt{width:42px;height:42px;flex-shrink:0;border:1px solid rgba(176,58,46,.5);}

.record-lines{margin-top:26px;border-top:1px solid var(--line);padding-top:18px;}
.record-line{
  display:flex;gap:14px;padding:7px 0;font-size:14.5px;line-height:1.9;
  border-bottom:1px dotted rgba(139,133,120,.22);
}
.record-line .k{
  flex:0 0 62px;font-family:var(--font-kai);font-size:15px;
  color:var(--zhu);letter-spacing:3px;
}
.record-line .v{flex:1;color:var(--ink);}
.record-line .v .muted{color:var(--ink-3);font-size:13px;margin-left:6px;}
.record-line .v a{color:var(--dian);border-bottom:1px solid rgba(44,62,92,.3);}

.kinship{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px;}
.kinship a{
  display:inline-flex;align-items:center;gap:6px;
  padding:3px 10px;border:1px solid var(--line);border-radius:2px;
  font-size:13px;color:var(--ink-2);background:rgba(255,255,255,.45);
  transition:all .15s ease;
}
.kinship a:hover{border-color:var(--zhu);color:var(--zhu);}
.kinship a .rel{font-size:11px;color:var(--ink-3);}

/* 照片墙 */
.photo-grid{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:14px;
}
.photo-item{
  position:relative;border:1px solid var(--line);background:#fff;
  padding:8px 8px 0;border-radius:2px;margin:0;
}
.photo-item figcaption{margin:0;}
.photo-item .frame{
  position:relative;display:block;padding-top:100%;overflow:hidden;
  background:var(--paper-3);cursor:zoom-in;
}
.photo-item img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:contain;display:block;}
.photo-item .cap{
  padding:8px 2px 9px;font-size:12px;color:var(--ink-2);line-height:1.6;
  display:flex;justify-content:space-between;gap:8px;align-items:flex-start;
}
.photo-item .cap time{color:var(--ink-3);font-size:11px;white-space:nowrap;}
.photo-item .del{
  position:absolute;top:12px;right:12px;
  background:rgba(26,26,26,.6);color:#fff;border:none;
  width:22px;height:22px;line-height:1;border-radius:2px;font-size:13px;
  opacity:0;transition:opacity .15s ease;
}
.photo-item:hover .del{opacity:1;}

.upload-drop{
  border:1px dashed var(--line);border-radius:2px;
  padding:26px;text-align:center;color:var(--ink-3);font-size:13px;
  background:rgba(255,255,255,.32);transition:all .15s ease;cursor:pointer;
}
.upload-drop:hover{border-color:var(--zhu);color:var(--zhu);background:rgba(176,58,46,.03);}
.upload-drop.solo{grid-column:span 2;max-width:340px;}

/* ---------------- 后台 ---------------- */
.admin-tabs{display:flex;gap:4px;margin-bottom:20px;border-bottom:1px solid var(--line);}
.admin-tabs button{
  background:transparent;border:none;border-bottom:2px solid transparent;
  padding:10px 18px;font-family:var(--font-kai);font-size:15px;letter-spacing:3px;
  color:var(--ink-3);margin-bottom:-1px;
}
.admin-tabs button.active{color:var(--zhu);border-bottom-color:var(--zhu);}

table.data{width:100%;border-collapse:collapse;font-size:13.5px;}
table.data th{
  text-align:left;font-weight:400;font-family:var(--font-kai);
  font-size:13px;letter-spacing:2px;color:var(--ink-3);
  padding:10px 12px;border-bottom:1px solid var(--line);
}
table.data td{padding:12px;border-bottom:1px solid rgba(139,133,120,.16);vertical-align:top;}
table.data tr:hover td{background:rgba(176,58,46,.022);}
table.data .actions{display:flex;gap:6px;flex-wrap:wrap;}

.stat-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:14px;margin-bottom:22px;}
.stat{
  background:var(--paper-2);border:1px solid var(--line);border-radius:2px;
  padding:16px 18px;
}
.stat .n{font-family:var(--font-kai);font-size:28px;color:var(--zhu);line-height:1.2;}
.stat .l{font-size:12px;color:var(--ink-3);letter-spacing:2px;margin-top:2px;}

/* ---------------- 相册 ---------------- */
.album-group{margin-bottom:30px;}
.album-group h3{
  font-family:var(--font-kai);font-size:16px;font-weight:400;letter-spacing:3px;
  margin:0 0 12px;display:flex;align-items:center;gap:10px;color:var(--ink);
}
.album-group h3 small{font-family:var(--font-song);font-size:11px;color:var(--ink-3);letter-spacing:1px;}
.album-group h3::after{content:"";flex:1;height:1px;background:var(--line);}

/* ---------------- 文书页(竖排) ---------------- */
.doc-card{
  background:var(--paper-2);border:1px solid var(--line);padding:40px 46px;
  margin-bottom:22px;position:relative;
}
.doc-card::before{
  content:"";position:absolute;top:10px;right:10px;bottom:10px;left:10px;inset:10px;border:1px solid rgba(176,58,46,.18);pointer-events:none;
}
.doc-card h3{
  font-family:var(--font-kai);font-size:22px;font-weight:400;letter-spacing:8px;
  text-align:center;margin:0 0 26px;color:var(--ink);
}
.doc-card .body{
  font-size:15px;line-height:2.2;letter-spacing:1.2px;color:var(--ink-2);
  white-space:pre-wrap;text-align:justify;
}
.doc-card .body.indent p{text-indent:2em;}
.doc-card .body .doc-link{
  color:var(--zhu);border-bottom:1px solid rgba(176,58,46,.35);
  padding-bottom:1px;letter-spacing:.5px;
  font-family:var(--font-hei);font-size:14px;
}
.doc-card .body .doc-link:hover{background:var(--zhu-soft);}
.vertical-note{
  writing-mode:vertical-rl;text-orientation:upright;
  font-family:var(--font-kai);letter-spacing:6px;font-size:15px;
  color:var(--ink-3);height:180px;
}

/* ---------------- 弹层 ---------------- */
.modal-mask{
  position:fixed;top:0;right:0;bottom:0;left:0;inset:0;background:rgba(26,26,26,.42);
  display:flex;align-items:center;justify-content:center;padding:20px;z-index:100;
  animation:fade .16s ease;
}
@keyframes fade{from{opacity:0}to{opacity:1}}
@keyframes rise{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.modal{
  background:var(--paper-2);border:1px solid var(--line);
  border-top:3px solid var(--zhu);
  width:100%;max-width:520px;max-height:88vh;overflow:auto;
  padding:26px 28px 24px;border-radius:2px;position:relative;
  animation:rise .18s ease;
  box-shadow:0 18px 48px rgba(26,26,26,.18);
}
.modal.wide{max-width:760px;}
.modal h3{
  font-family:var(--font-kai);font-size:20px;font-weight:400;letter-spacing:4px;
  margin:0 0 4px;
}
.modal .modal-sub{font-size:12px;color:var(--ink-3);letter-spacing:1px;margin-bottom:20px;}
.modal .close{
  position:absolute;top:14px;right:16px;background:none;border:none;
  font-size:20px;color:var(--ink-3);line-height:1;
}
.modal .close:hover{color:var(--zhu);}
.modal-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:20px;flex-wrap:wrap;}
.modal-actions .left{margin-right:auto;}

/* 齿录卡片(点击世系节点) */
.record-card .rc-head{display:flex;gap:14px;align-items:flex-start;margin-bottom:16px;}
.record-card .rc-seal{
  width:52px;height:52px;flex-shrink:0;border:1px solid var(--zhu);border-radius:2px;
  display:flex;align-items:center;justify-content:center;
  font-family:var(--font-kai);font-size:28px;color:var(--zhu);
  background:rgba(176,58,46,.05);
}
.record-card .rc-name{font-family:var(--font-kai);font-size:24px;letter-spacing:4px;line-height:1.3;}
.record-card .rc-sub{font-size:12px;color:var(--ink-3);letter-spacing:1px;}
.record-card dl{margin:0;font-size:13.5px;}
.record-card .rc-row{display:flex;gap:12px;padding:6px 0;border-bottom:1px dotted rgba(139,133,120,.22);}
.record-card .rc-row dt{flex:0 0 50px;font-family:var(--font-kai);color:var(--zhu);letter-spacing:2px;}
.record-card .rc-row dd{margin:0;flex:1;}

/* 登录 */
.auth-tabs{display:flex;gap:2px;margin-bottom:18px;border-bottom:1px solid var(--line);}
.auth-tabs button{
  background:none;border:none;border-bottom:2px solid transparent;
  padding:8px 16px;font-family:var(--font-kai);font-size:15px;letter-spacing:3px;
  color:var(--ink-3);margin-bottom:-1px;
}
.auth-tabs button.active{color:var(--zhu);border-bottom-color:var(--zhu);}
.demo-accounts{
  margin-top:16px;padding:12px 14px;background:rgba(44,62,92,.05);
  border:1px solid rgba(44,62,92,.14);border-radius:2px;
  font-size:12px;color:var(--ink-2);line-height:2;
}
.demo-accounts b{font-family:var(--font-kai);letter-spacing:1px;color:var(--dian);}
.demo-accounts code{
  font-family:ui-monospace,Consolas,monospace;font-size:11.5px;
  background:rgba(255,255,255,.7);padding:1px 5px;border-radius:2px;color:var(--ink);
}

/* Toast */
.toast{
  position:fixed;left:50%;bottom:36px;transform:translateX(-50%) translateY(12px);
  background:rgba(26,26,26,.9);color:#F5F0E6;
  padding:10px 22px;border-radius:2px;font-size:13.5px;letter-spacing:1px;
  opacity:0;pointer-events:none;transition:all .22s ease;z-index:200;
  max-width:80vw;text-align:center;
}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0);}
.toast.err{background:rgba(176,58,46,.94);}

/* 隐私/提示条 */
.notice{
  padding:12px 16px;border-left:3px solid var(--dian);
  background:var(--dian-soft);font-size:13px;color:var(--ink-2);
  line-height:1.8;margin-bottom:18px;
}
.notice.zhu{border-left-color:var(--zhu);background:var(--zhu-soft);}

/* ---------------- 响应式 ---------------- */
@media (max-width:900px){
  .header-inner{padding:12px 16px;gap:12px 14px;flex-wrap:wrap;max-width:100%;}
  .brand{order:1;min-width:0;}
  .user-area{order:2;margin-left:auto;min-width:0;}
  .main-nav{order:3;flex:0 0 100%;width:100%;gap:20px;margin:0;overflow-x:auto;padding-bottom:2px;}
  .main-nav a{font-size:15px;white-space:nowrap;}
  .view{padding:22px 16px 50px;}
  .scroll-inner{padding:24px 20px 22px;}
  .doc-card{padding:30px 22px;}
  .cartouche .seal-name{width:70px;height:92px;}
  .cartouche .seal-name .big{font-size:34px;}
  .cartouche .portrait{width:76px;}
  .cartouche .portrait .portrait-img{width:76px;height:76px;}
  .cartouche h1{font-size:26px;letter-spacing:5px;}
  .record-line{flex-direction:column;gap:2px;}
  .record-line .k{flex:none;font-size:14px;}
  .field-row,.field-row-3{grid-template-columns:1fr;}
  .tree-toolbar{gap:8px;}
  .search-box{width:100%;order:5;}
  .legend{display:none;}
  .page-head h2{font-size:22px;letter-spacing:4px;}
  .modal{padding:22px 18px;max-height:92vh;}
  table.data{font-size:12.5px;}
  table.data th,table.data td{padding:8px 6px;}
  .photo-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px;}
}

@media (max-width:480px){
  .brand-text em{display:none;}
  .brand-text strong{font-size:18px;letter-spacing:2px;}
  .user-area .btn.on-header{padding:5px 10px;font-size:12px;letter-spacing:1px;}
  .header-inner{gap:10px 12px;}
}

/* 手机横屏:视口矮,竖向别浪费,导航收回一行,逐世阅读改两栏 */
@media (max-height:540px) and (orientation:landscape){
  .header-inner{padding:8px 16px;gap:8px 14px;flex-wrap:nowrap;max-width:100%;}
  .brand{order:1;flex:0 0 auto;}
  .brand-text em{display:none;}
  .brand-text strong{font-size:17px;letter-spacing:2px;}
  .main-nav{order:2;flex:1 1 auto;width:auto;margin:0 14px;gap:16px;padding:0;overflow-x:auto;}
  .main-nav a{font-size:14px;letter-spacing:2px;}
  .user-area{order:3;margin-left:0;flex:0 0 auto;}
  .meander{height:2px;}
  .view{padding:14px 18px 32px;}
  .page-head{margin-bottom:14px;}
  .page-head h2{font-size:20px;letter-spacing:3px;}
  .page-head p{font-size:12.5px;line-height:1.7;}
  .gen-block{margin-bottom:2px;}
  .gen-head{padding:6px 0;}
  .gen-people{display:grid;grid-template-columns:1fr 1fr;gap:8px 12px;padding-bottom:10px;}
  .person-row{padding:8px 10px;gap:10px;}
  .person-row .pr-avt{width:34px;height:34px;}
  .person-row .pr-name{font-size:15px;}
  .person-row .pr-meta{font-size:10.5px;}
  .record-line{flex-direction:row;gap:14px;}
  .record-line .k{flex:0 0 62px;}
  .cartouche{gap:16px;align-items:center;}
  .cartouche .portrait{width:64px;}
  .cartouche .portrait .portrait-img{width:64px;height:64px;}
  .cartouche .portrait .gen{font-size:10px;letter-spacing:1px;}
  .cartouche h1{font-size:24px;letter-spacing:4px;}
  .cartouche .sub-line{font-size:12px;}
  .cartouche .tags{gap:6px;}
  .scroll-inner{padding:16px 18px 14px;}
  .record-lines .record-line{padding:7px 0;}
  .photo-grid{grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:8px;}
  .video-grid{grid-template-columns:repeat(auto-fill,minmax(200px,1fr));}
  .doc-card{padding:24px 22px;}
  .modal{max-height:94vh;padding:18px 16px;width:min(560px,94vw);}
  .site-footer{margin-top:18px;}
  .footer-inner{padding:10px 18px 14px;font-size:11px;gap:6px;}
  .tree-stage{height:calc(100vh - 210px);min-height:260px;}
}

/* ---------------- 详情页新增:加配偶、视频 ---------------- */
.record-line .k{white-space:nowrap;}
.plus-btn{
  display:inline-flex;align-items:center;justify-content:center;
  width:24px;height:24px;margin-left:8px;padding:0;
  border:1px solid rgba(176,58,46,.45);border-radius:50%;
  background:transparent;color:var(--zhu);font-size:14px;line-height:1;cursor:pointer;
  vertical-align:middle;transition:all .15s ease;
}
.plus-btn:hover{background:var(--zhu);color:#fff;border-color:var(--zhu);}
.plus-btn.wide{width:auto;height:24px;padding:0 10px;border-radius:12px;font-size:12px;letter-spacing:1px;font-family:var(--font-song);}
/* 世系图上的加人虚线圈 */
.add-spouse-g{cursor:pointer;}
.add-spouse-g:hover circle{fill:#F1DED9;stroke-width:1.8;stroke-dasharray:none;}
.add-spouse-g:hover text{opacity:1;}
/* 添加/新增表单里的说明 */
.form-hint{font-size:12.5px;color:var(--ink-3);line-height:1.9;margin:-2px 0 12px;padding:9px 12px;background:rgba(176,58,46,.05);border-left:2px solid rgba(176,58,46,.35);}
/* 世系图工具栏:添加族人 */
.add-person-btn{margin-right:10px;white-space:nowrap;}
/* 手机端逐世流的顶部操作条 */
.flow-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0 0 14px;}
.flow-actions .muted{font-size:12px;color:var(--ink-3);line-height:1.7;}
.field .must{font-style:normal;font-size:11px;color:rgba(176,58,46,.85);margin-left:6px;letter-spacing:0;}

.video-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px;}
.video-item{
  position:relative;margin:0;border:1px solid var(--line);background:#fff;
  padding:8px;border-radius:2px;
}
.video-item video{width:100%;display:block;background:#141210;border-radius:2px;}
.video-item .cap{
  padding:8px 2px 2px;font-size:12px;color:var(--ink-2);line-height:1.6;
}
.video-item .del{
  position:absolute;top:12px;right:12px;z-index:2;
  background:rgba(26,26,26,.6);color:#fff;border:none;
  width:22px;height:22px;line-height:1;border-radius:2px;font-size:13px;
  opacity:0;transition:opacity .15s ease;
}
.video-item:hover .del{opacity:1;}

/* ============================================================
   节点侧栏:点节点 → 右侧信息栏(手机为底部抽屉)
   ============================================================ */
.drawer-mask{
  position:fixed;top:0;right:0;bottom:0;left:0;inset:0;z-index:80;
  background:rgba(26,26,26,.09);
  opacity:0;transition:opacity .24s ease;
}
#drawerRoot.open .drawer-mask{opacity:1;}

.drawer{
  position:fixed;top:var(--hdr-h,0px);right:0;bottom:0;z-index:81;
  width:386px;max-width:92vw;
  background:var(--paper-2);
  background-image:linear-gradient(180deg,rgba(176,58,46,.045),transparent 180px);
  border-left:1px solid var(--line);
  box-shadow:-18px 0 44px rgba(44,40,32,.16);
  transform:translateX(104%);
  transition:transform .28s cubic-bezier(.22,.75,.3,1);
  display:flex;flex-direction:column;
}
#drawerRoot.open .drawer{transform:translateX(0);}
.drawer::before{
  content:"";position:absolute;left:0;top:0;bottom:0;width:3px;
  background:linear-gradient(180deg,var(--zhu),rgba(176,58,46,.15));
}
.drawer-x{
  position:absolute;top:10px;right:10px;z-index:3;
  width:30px;height:30px;line-height:1;padding:0;
  border:none;background:transparent;color:var(--ink-3);font-size:22px;
  border-radius:50%;transition:all .15s ease;
}
.drawer-x:hover{background:var(--paper-3);color:var(--zhu);}
.drawer-load{padding:56px 24px;text-align:center;color:var(--ink-3);font-size:13px;letter-spacing:2px;}

.dw-scroll{flex:1 1 auto;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;padding-bottom:8px;}

.dw-head{
  display:flex;gap:14px;align-items:flex-start;
  padding:26px 22px 18px;border-bottom:1px solid var(--line);
}
.dw-avt{
  width:64px;height:64px;flex-shrink:0;border-radius:50%;overflow:hidden;
  border:1px solid rgba(176,58,46,.45);background:var(--paper-3);
  display:flex;align-items:center;justify-content:center;
}
.dw-avt .dw-avt-img{width:100%;height:100%;object-fit:cover;display:block;border-radius:50%;font-size:24px;}
.dw-id{min-width:0;padding-right:22px;}
.dw-id h3{
  margin:0 0 4px;font-family:var(--font-kai);font-size:25px;font-weight:400;
  letter-spacing:3px;line-height:1.25;
}
.dw-meta{font-size:12px;color:var(--ink-3);letter-spacing:.5px;line-height:1.7;}
.dw-tags{display:flex;gap:6px;flex-wrap:wrap;margin-top:7px;}
.dw-tags .tag{font-size:10.5px;padding:1px 7px;}

.dw-sec{padding:16px 22px 15px;border-bottom:1px dotted rgba(139,133,120,.28);}
.dw-h{
  display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;
  font-family:var(--font-kai);font-size:13.5px;letter-spacing:2px;color:var(--zhu);
  margin-bottom:10px;
}
.dw-h small{font-family:var(--font-song);font-size:11px;color:var(--ink-3);letter-spacing:0;}

.dw-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;}
.dw-grid.three{grid-template-columns:1fr 1fr 1fr;}
.dw-btn{
  height:42px;padding:0 8px;
  border:1px solid var(--line);background:#fff;color:var(--ink);
  font-family:var(--font-kai);font-size:15px;letter-spacing:2px;
  border-radius:2px;transition:all .15s ease;white-space:nowrap;
}
.dw-btn:hover{border-color:var(--zhu);color:var(--zhu);background:#fff;}
.dw-btn.solid{background:var(--zhu);border-color:var(--zhu);color:#FBF7EE;}
.dw-btn.solid:hover{background:#96301f;color:#fff;}
.dw-mini{
  height:34px;padding:0 4px;border:1px solid var(--line);background:#fff;
  color:var(--ink-2);font-family:var(--font-song);font-size:12.5px;letter-spacing:1px;
  border-radius:2px;transition:all .15s ease;
}
.dw-mini:hover{border-color:var(--dian);color:var(--dian);}

.dw-note{font-size:11.5px;color:var(--ink-3);line-height:1.8;margin-top:9px;}
.dw-note.line{margin:0;padding:14px 22px;border-bottom:1px dotted rgba(139,133,120,.28);}
.dw-link{
  border:none;background:none;padding:0;margin:0 2px;
  color:var(--zhu);border-bottom:1px solid rgba(176,58,46,.4);
  font-size:11.5px;font-family:var(--font-song);
}

.dw-chips{display:flex;flex-wrap:wrap;gap:6px;}
.dw-chip{
  display:inline-flex;align-items:center;gap:5px;
  padding:5px 10px 5px 6px;border:1px solid var(--line);background:#fff;
  border-radius:14px;font-family:var(--font-kai);font-size:14px;letter-spacing:.5px;
  color:var(--ink);transition:all .15s ease;
}
.dw-chip:hover{border-color:var(--zhu);color:var(--zhu);}
.dw-chip .rel{
  display:inline-block;min-width:16px;text-align:center;
  font-family:var(--font-song);font-size:10.5px;letter-spacing:0;
  color:var(--ink-3);border-right:1px solid var(--line);padding-right:5px;
}
.dw-chip.zhu{border-color:rgba(176,58,46,.35);background:rgba(176,58,46,.045);}

.dw-full{
  display:block;margin:18px 22px 22px;padding:11px;
  text-align:center;border:1px solid rgba(44,62,92,.35);
  color:var(--dian);font-family:var(--font-kai);font-size:14px;letter-spacing:2px;
  transition:all .15s ease;
}
.dw-full:hover{background:var(--dian);color:#F5F0E6;border-color:var(--dian);}
/* 删除入口:固定在侧栏页脚,不随内容滚走 */
.dw-foot{
  flex:0 0 auto;padding:10px 22px;
  padding-bottom:calc(10px + env(safe-area-inset-bottom,0px));
  border-top:1px solid rgba(176,58,46,.16);
  background:linear-gradient(180deg,rgba(176,58,46,.035),rgba(176,58,46,.055));
}
.dw-danger{
  display:block;width:100%;margin:0;padding:8px 0;border-radius:2px;
  border:1px solid rgba(176,58,46,.34);background:rgba(255,255,255,.5);
  color:var(--zhu);font-size:12.5px;letter-spacing:1.2px;text-align:center;
  transition:background .15s ease,color .15s ease,border-color .15s ease;
}
.dw-danger:hover{background:var(--zhu);border-color:var(--zhu);color:#FBF7EE;}
.dw-danger:hover small{color:rgba(251,247,238,.8);}
.dw-danger small{display:block;margin-top:2px;font-size:10px;letter-spacing:.4px;color:var(--ink-3);font-weight:400;}
.dw-danger:hover{background:rgba(176,58,46,.08);color:var(--zhu);}

/* 选中的那个人:画布上留一圈朱线 */
.tree-stage .node-g.sel .node-halo{opacity:1;}
.mobile-tree .mt-row.sel rect{fill:rgba(176,58,46,.07);}
/* 画布上的「＋」退成浅色,鼠标靠近才亮起来,平时不抢眼 */
.tree-stage .add-spouse-g{opacity:0;transition:opacity .18s ease;}
.tree-stage .node-g:hover .add-spouse-g,
.tree-stage .add-spouse-g:hover{opacity:1;}
.mobile-tree .mt-add{opacity:.4;transition:opacity .18s ease;}
.mobile-tree .mt-add:hover,.mobile-tree .mt-add:active{opacity:1;}

@media (max-width:720px){
  .drawer{
    top:auto;left:0;right:0;width:100%;max-width:none;
    max-height:86vh;border-left:none;border-top:1px solid var(--line);
    border-radius:14px 14px 0 0;
    transform:translateY(104%);
    box-shadow:0 -14px 40px rgba(44,40,32,.2);
  }
  #drawerRoot.open .drawer{transform:translateY(0);}
  .drawer::before{
    left:50%;top:8px;bottom:auto;transform:translateX(-50%);
    width:38px;height:4px;border-radius:2px;
    background:rgba(139,133,120,.35);
  }
  .dw-head{padding:26px 18px 16px;}
  .dw-sec{padding:14px 18px 13px;}
  .dw-note.line{padding:12px 18px;}
  .dw-full{margin:14px 18px 18px;}
  .dw-id h3{font-size:23px;}
}
@media (max-height:540px) and (orientation:landscape){
  .drawer{width:340px;max-height:100vh;border-radius:0 0 0 0;}
  .dw-head{padding:18px 18px 12px;}
  .dw-avt{width:52px;height:52px;}
  .dw-sec{padding:12px 18px;}
  .dw-btn{height:38px;font-size:14px;}
}

/* ============================================================
   首页:村子题图 · 简介 · 家族影像
   ============================================================ */
.home-hero{margin-bottom:26px;}

.hero-banner{
  position:relative;overflow:hidden;
  aspect-ratio:24/9;min-height:310px;max-height:400px;
  background:linear-gradient(140deg,#332C23 0%,#221E19 58%,#2C2620 100%);
  border:1px solid var(--line);
  box-shadow:0 14px 34px rgba(44,40,32,.16);
}
.hero-banner.plain{
  background-image:
    url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20width%3D%271200%27%20height%3D%27430%27%20viewBox%3D%270%200%201200%20430%27%3E%3Cg%20fill%3D%27none%27%20stroke%3D%27%23F5F0E6%27%20stroke-opacity%3D%270.16%27%3E%3Cpath%20d%3D%27M-40%20292%20q150%20-16%20300%200%20t300%200%20t300%200%20t300%200%27/%3E%3Cpath%20d%3D%27M-40%20322%20q170%20-14%20320%200%20t300%200%20t300%200%20t300%200%27/%3E%3Cpath%20d%3D%27M-10%20352%20q160%20-12%20310%200%20t300%200%20t300%200%20t300%200%27/%3E%3Cpath%20d%3D%27M-40%20382%20q180%20-10%20330%200%20t300%200%20t300%200%20t300%200%27/%3E%3Cpath%20d%3D%27M-20%20412%20q150%20-8%20300%200%20t300%200%20t300%200%20t300%200%27/%3E%3C/g%3E%3Cg%20fill%3D%27none%27%20stroke%3D%27%23F5F0E6%27%20stroke-opacity%3D%270.10%27%3E%3Cpath%20d%3D%27M700%20120%20q60%20-46%20130%20-30%20q40%20-44%20110%20-20%20q60%204%2070%2050%27/%3E%3Cpath%20d%3D%27M830%20150%20q80%20-34%20160%20-14%27/%3E%3C/g%3E%3C/svg%3E"),
    radial-gradient(ellipse at 16% 14%, rgba(176,58,46,.22), transparent 58%),
    radial-gradient(ellipse at 88% 88%, rgba(176,58,46,.10), transparent 52%),
    linear-gradient(140deg,#332C23 0%,#221E19 60%,#2C2620 100%);
  background-size:100% auto,auto,auto,auto;
  background-position:center bottom,0 0,0 0,0 0;
  background-repeat:no-repeat,no-repeat,no-repeat,no-repeat;
}
.hero-banner>img{
  position:absolute;top:0;right:0;bottom:0;left:0;inset:0;width:100%;height:100%;object-fit:cover;display:block;
}
.hero-banner::after{
  content:"";position:absolute;top:0;right:0;bottom:0;left:0;inset:0;z-index:1;
  background:linear-gradient(180deg,rgba(20,16,12,.52) 0%,rgba(20,16,12,.22) 32%,rgba(20,16,12,.48) 60%,rgba(20,16,12,.86) 100%);
}
.hero-banner::before{
  content:"";position:absolute;top:11px;right:11px;bottom:11px;left:11px;inset:11px;z-index:2;pointer-events:none;
  border:1px solid rgba(245,240,230,.20);
}

.hero-inner{
  position:absolute;top:0;right:0;bottom:0;left:0;inset:0;z-index:3;
  display:flex;flex-direction:column;justify-content:flex-end;
  padding:40px 46px 34px;color:#F5F0E6;
}
.hero-eyebrow{
  font-size:11.5px;letter-spacing:5px;
  color:rgba(245,240,230,.72);
}
.hero-inner h1{
  margin:14px 0 0;
  font-family:var(--font-kai);font-weight:400;
  font-size:58px;letter-spacing:6px;line-height:1.2;
  color:#FBF7EE;
  text-shadow:0 2px 18px rgba(0,0,0,.4);
}
.hero-sub{
  margin-top:10px;font-size:13px;letter-spacing:1.5px;
  color:rgba(245,240,230,.88);
  text-shadow:0 1px 8px rgba(0,0,0,.35);
}
.hero-word{
  margin:14px 0 0;font-family:var(--font-kai);
  font-size:19px;line-height:1.9;color:rgba(251,247,238,.95);
  text-shadow:0 1px 10px rgba(0,0,0,.4);
}
.hero-facts{
  display:flex;gap:30px;flex-wrap:wrap;
  margin-top:20px;padding:13px 0 0;
  border-top:1px solid rgba(245,240,230,.22);
}
.hero-facts span{font-size:12px;letter-spacing:1px;color:rgba(245,240,230,.72);}
.hero-facts b{
  font-family:var(--font-kai);font-size:26px;font-weight:400;
  color:#F3C9AE;margin-right:5px;letter-spacing:0;
}
.hero-btns{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px;}
.hero-btns .btn{
  border-color:rgba(245,240,230,.4);background:rgba(20,16,12,.28);
  color:#F5F0E6;backdrop-filter:blur(2px);
}
.hero-btns .btn:hover{border-color:rgba(245,240,230,.8);background:rgba(20,16,12,.5);color:#fff;}
.hero-btns .btn.solid{background:var(--zhu);border-color:var(--zhu);color:#FBF7EE;}
.hero-btns .btn.solid:hover{background:#96301f;border-color:#96301f;color:#fff;}
.hero-stamp{
  position:absolute;right:26px;top:26px;z-index:4;
  writing-mode:vertical-rl;text-orientation:upright;
  background:rgba(176,58,46,.88);color:#FBF7EE;
  font-family:var(--font-kai);font-size:13px;letter-spacing:5px;
  padding:9px 5px 9px 6px;line-height:1;border-radius:1px;
  box-shadow:0 3px 12px rgba(0,0,0,.28);
}
.hero-tools{
  position:absolute;right:64px;top:26px;z-index:5;
  display:flex;gap:7px;
}
.hero-tools button{
  border:1px solid rgba(245,240,230,.36);background:rgba(20,16,12,.42);
  color:#F5F0E6;font-family:var(--font-song);font-size:11.5px;letter-spacing:1px;
  padding:5px 10px;border-radius:2px;line-height:1.5;
  backdrop-filter:blur(3px);transition:all .15s ease;
}
.hero-tools button:hover{background:var(--zhu);border-color:var(--zhu);color:#fff;}

/* 改首页弹窗里:题图下拉 + 上传 */
.hero-pick{display:flex;gap:7px;align-items:stretch;}
.hero-pick select{flex:1;min-width:0;}
.mini-upload{
  flex:0 0 auto;white-space:nowrap;
  border:1px solid var(--line);background:#fff;color:var(--ink-2);
  font-family:var(--font-song);font-size:12.5px;letter-spacing:.5px;
  padding:0 11px;border-radius:2px;transition:all .15s ease;
}
.mini-upload:hover{border-color:var(--zhu);color:var(--zhu);}

.hero-credit{
  position:absolute;right:20px;bottom:14px;z-index:4;
  font-size:11px;letter-spacing:.5px;color:rgba(245,240,230,.55);
  max-width:46%;text-align:right;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}

.home-intro{
  background:var(--paper-2);border:1px solid var(--line);
  padding:38px 48px 30px;margin-bottom:28px;position:relative;
}
.home-intro::before{
  content:"";position:absolute;top:10px;right:10px;bottom:10px;left:10px;inset:10px;border:1px solid rgba(176,58,46,.14);pointer-events:none;
}
.intro-head{display:flex;align-items:center;gap:18px;margin-bottom:22px;}
.intro-head h2{
  margin:0;font-family:var(--font-kai);font-size:22px;font-weight:400;letter-spacing:7px;
}
.intro-rule{flex:1;height:1px;background:var(--line);}
.intro-body p{
  margin:0 0 13px;font-size:15px;line-height:2.15;
  color:var(--ink-2);text-indent:2em;
}
.intro-body p:last-child{margin-bottom:0;}
.intro-body .muted{color:var(--ink-3);font-size:13.5px;text-indent:0;}
.intro-more{margin-top:18px;}
.intro-more a{
  font-size:12.5px;letter-spacing:1px;color:var(--zhu);
  border-bottom:1px solid rgba(176,58,46,.35);padding-bottom:1px;
}

.home-gallery{margin-bottom:30px;}
.sec-head{
  display:flex;align-items:flex-end;justify-content:space-between;
  gap:16px;margin-bottom:14px;
}
.sec-head h2{
  margin:0 0 4px;font-family:var(--font-kai);font-size:22px;font-weight:400;
  letter-spacing:6px;display:flex;align-items:center;gap:11px;
}
.sec-head h2::before{content:"";width:3px;height:20px;background:var(--zhu);display:inline-block;}
.sec-head p{margin:0;font-size:12.5px;color:var(--ink-3);letter-spacing:.5px;}

/* —— 首页大图轮播:一张一张完整呈现,比例不合就留白,绝不裁切 —— */
.car{position:relative;max-width:960px;margin:0 auto;}
.car-stage{
  position:relative;height:64vh;min-height:380px;max-height:680px;
  background:var(--paper-3);border:1px solid var(--line);
  overflow:hidden;
  box-shadow:inset 0 0 0 6px rgba(255,255,255,.55);
}
.car-slide{
  position:absolute;top:0;right:0;bottom:0;left:0;margin:0;
  display:flex;align-items:center;justify-content:center;
  opacity:0;transition:opacity .55s ease;pointer-events:none;
}
.car-slide.on{opacity:1;pointer-events:auto;}
.car-slide img{
  max-width:100%;max-height:100%;width:auto;height:auto;
  object-fit:contain;display:block;cursor:zoom-in;
  box-shadow:0 12px 34px rgba(70,52,30,.18);
  transition:opacity .15s ease;
}
.car-slide:hover img{opacity:.95;}
.car-arrow{
  position:absolute;top:50%;transform:translateY(-50%);
  width:42px;height:42px;border-radius:50%;padding:0;z-index:3;
  display:flex;align-items:center;justify-content:center;
  border:1px solid rgba(245,240,230,.5);background:rgba(26,26,26,.42);
  color:#fff;font-size:23px;line-height:1;
  opacity:0;transition:background .15s ease,opacity .2s ease;
}
.car:hover .car-arrow{opacity:1;}
.car-arrow:hover{background:var(--zhu);border-color:transparent;}
.car-arrow.prev{left:14px;}
.car-arrow.next{right:14px;}
@media (hover:none){ .car-arrow{opacity:.85;} }
.car-bar{
  display:flex;align-items:center;gap:14px;flex-wrap:wrap;
  padding:11px 2px 0;
}
.car-cap{
  display:flex;flex-direction:column;gap:2px;
  min-width:0;flex:1 1 220px;
}
.car-ct{font-family:var(--font-kai);font-size:14.5px;letter-spacing:1px;color:var(--ink);}
.car-cm{font-size:11px;color:var(--ink-3);letter-spacing:.3px;}
.car-tools{display:flex;gap:5px;}
.car-tools button{
  border:1px solid var(--line);background:#fff;color:var(--ink-2);
  font-size:11.5px;line-height:1.7;padding:1px 8px;border-radius:2px;
  transition:all .15s ease;
}
.car-tools button:hover{background:var(--zhu);border-color:var(--zhu);color:#fff;}
.car-nav{display:flex;align-items:center;gap:13px;margin-left:auto;}
.car-idx{font-size:11px;color:var(--ink-3);letter-spacing:1px;font-variant-numeric:tabular-nums;}
.car-dots{display:flex;align-items:center;gap:6px;}
.car-dot{
  width:6px;height:6px;padding:0;border:none;border-radius:50%;
  background:var(--line);transition:all .2s ease;
}
.car-dot.on{width:16px;border-radius:3px;background:var(--zhu);}
.car-hint{font-size:10.5px;color:var(--ink-3);letter-spacing:.4px;}
.car-strip{
  display:flex;gap:8px;overflow-x:auto;padding:11px 0 3px;
  max-width:960px;margin:0 auto;scrollbar-width:thin;
}
.car-thumb{
  flex:0 0 86px;height:58px;padding:0;overflow:hidden;
  border:1px solid var(--line);background:var(--paper-3);
  opacity:.55;transition:opacity .15s ease,border-color .15s ease;
}
.car-thumb img{width:100%;height:100%;object-fit:cover;display:block;}
.car-thumb.on,.car-thumb:hover{opacity:1;border-color:var(--zhu);}
.gal-empty{
  border:1px dashed var(--line);background:rgba(255,255,255,.34);
  padding:48px 20px;text-align:center;
}
.gal-empty .ge-t{font-family:var(--font-kai);font-size:18px;letter-spacing:5px;color:var(--ink-2);margin-bottom:7px;}
.gal-empty .ge-s{font-size:12.5px;color:var(--ink-3);margin-bottom:18px;letter-spacing:.5px;}

/* —— 看大图 —— */
.lb{
  position:fixed;top:0;right:0;bottom:0;left:0;inset:0;z-index:130;
  display:flex;align-items:center;justify-content:center;gap:8px;
  padding:40px 14px 26px;background:rgba(20,17,13,.95);
  opacity:0;transition:opacity .18s ease;
}
.lb[hidden]{display:none;}
.lb.on{opacity:1;}
.lb-stage{
  margin:0;min-width:0;max-width:100%;
  display:flex;flex-direction:column;align-items:center;gap:9px;
}
.lb-img{
  max-width:100%;max-height:calc(100vh - 150px);
  width:auto;height:auto;object-fit:contain;display:block;
  box-shadow:0 16px 46px rgba(0,0,0,.45);
}
.lb-cap{
  display:flex;align-items:center;gap:12px;flex-wrap:wrap;justify-content:center;
  color:#EFE8DA;font-size:11.5px;letter-spacing:.4px;
}
.lb-t{font-family:var(--font-kai);font-size:15px;letter-spacing:1.8px;}
.lb-idx{color:rgba(239,232,218,.55);font-size:11px;letter-spacing:1px;}
.lb-arrow{
  width:40px;height:40px;flex:0 0 auto;border-radius:50%;padding:0;
  display:flex;align-items:center;justify-content:center;
  border:1px solid rgba(245,240,230,.28);background:rgba(245,240,230,.07);
  color:#F5F0E6;font-size:22px;line-height:1;transition:all .15s ease;
}
.lb-arrow:hover{background:rgba(176,58,46,.9);border-color:transparent;}
.lb.solo .lb-arrow{display:none;}
.lb-close{
  position:absolute;top:12px;right:14px;
  width:32px;height:32px;border-radius:50%;padding:0;
  border:1px solid rgba(245,240,230,.24);background:rgba(245,240,230,.07);
  color:#F5F0E6;font-size:19px;line-height:1;transition:all .15s ease;
}
.lb-close:hover{background:var(--zhu);border-color:transparent;}

/* —— 我上传的 —— */
.home-mine{margin-bottom:30px;}
.mine-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(186px,1fr));gap:14px;}
.mine-item{display:block;margin:0;border:1px solid var(--line);background:#fff;padding:7px;}
.mine-pic{position:relative;display:block;padding-top:100%;overflow:hidden;background:var(--paper-3);line-height:0;}
.mine-pic img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:contain;display:block;}
.mine-item figcaption{
  display:flex;align-items:center;justify-content:space-between;gap:8px;
  padding:7px 2px 2px;font-size:12px;color:var(--ink-2);
}
.mi-cap{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0;}
.mi-tools{display:flex;gap:4px;flex-shrink:0;}
.mi-tools button{
  border:1px solid var(--line);background:transparent;color:var(--ink-3);
  font-size:11px;line-height:1.6;padding:0 7px;border-radius:2px;transition:all .15s ease;
}
.mi-tools button:hover{border-color:var(--zhu);color:var(--zhu);}

/* —— 相册 / 详情页上的「改 · 删」 —— */
.photo-tools{
  position:absolute;top:11px;right:11px;z-index:2;
  display:flex;gap:5px;opacity:0;transition:opacity .15s ease;
}
.photo-item:hover .photo-tools,
.video-item:hover .photo-tools{opacity:1;}
.photo-tools button{
  border:none;background:rgba(26,26,26,.62);color:#fff;
  font-size:11.5px;line-height:1.7;padding:1px 7px;border-radius:2px;
  transition:background .15s ease;
}
.photo-tools .photo-del{width:22px;padding:0;font-size:13px;}
.photo-tools button:hover{background:var(--zhu);}
@media (hover:none){
  .photo-tools{opacity:1;}
}

@media (max-width:900px){
  .hero-inner{padding:30px 26px 26px;}
  .hero-inner h1{font-size:40px;letter-spacing:4px;}
  .hero-word{font-size:17px;margin:10px 0 0;}
  .intro-head h2{font-size:19px;}
}
@media (max-width:720px){
  .home-intro{padding:26px 20px 22px;}
  .home-intro::before{top:7px;right:7px;bottom:7px;left:7px;inset:7px;}
  .intro-head{gap:12px;margin-bottom:16px;}
  .intro-body p{font-size:14px;line-height:2;}
  .car{max-width:none;}
  .car-strip{max-width:none;}
  .car-stage{height:52vh;min-height:280px;max-height:520px;box-shadow:none;}
  .car-arrow{width:34px;height:34px;font-size:19px;}
  .car-arrow.prev{left:8px;}
  .car-arrow.next{right:8px;}
  .car-bar{gap:8px;padding-top:9px;}
  .car-ct{font-size:13.5px;}
  .car-hint{display:none;}
  .car-thumb{flex:0 0 68px;height:47px;}
  .lb{padding:34px 8px 20px;gap:2px;}
  .lb-img{max-height:calc(100vh - 140px);}
  .lb-arrow{width:32px;height:32px;font-size:18px;}
  .lb-t{font-size:13px;letter-spacing:1px;}
  .sec-head{align-items:flex-start;flex-direction:column;gap:9px;}
  .hero-banner{aspect-ratio:4/3;min-height:270px;max-height:none;}
  .hero-banner::before{top:7px;right:7px;bottom:7px;left:7px;inset:7px;}
  .hero-inner{padding:22px 18px 20px;}
  .hero-inner h1{font-size:34px;letter-spacing:3px;margin-top:10px;}
  .hero-eyebrow{font-size:10.5px;letter-spacing:3px;}
  .hero-sub{font-size:12px;margin-top:7px;}
  .hero-word{font-size:15.5px;margin:9px 0 0;line-height:1.8;}
  .hero-facts{gap:16px;margin-top:14px;padding:10px 0 0;}
  .hero-facts span{font-size:11px;}
  .hero-facts b{font-size:21px;}
  .hero-btns{gap:8px;margin-top:14px;}
  .hero-btns .btn{padding:7px 12px;font-size:13px;letter-spacing:1px;}
  .hero-stamp{right:14px;top:12px;font-size:11px;letter-spacing:3px;padding:6px 4px 6px 5px;}
  .hero-tools{right:44px;top:10px;bottom:auto;gap:5px;}
  .hero-tools button{font-size:10.5px;padding:4px 8px;}
  .hero-credit{right:14px;bottom:9px;font-size:10px;max-width:60%;}
  .mine-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px;}
}

@media (max-width:480px){
  .mine-grid{grid-template-columns:1fr 1fr;gap:9px;}
  .mine-item{padding:5px;}
  .car-stage{height:46vh;min-height:240px;}
  .car-dots{display:none;}
}