:root{
  --bg-primary:#0B0F1A;
  --bg-panel:#1A1F2E;
  --bg-panel-soft:#222837;
  --accent-gold:#D4AF37;
  --accent-red:#C0392B;
  --text-primary:#EAECEE;
  --text-muted:#9AA5B1;
  --border-color:#2C3E50;
  --status-ok:#27AE60;
  --info-blue:#3498DB;
  --warning-orange:#E67E22;
  --font-heading:"Noto Serif SC","Source Han Serif SC",serif;
  --font-body:"Noto Sans SC","Source Han Sans SC",sans-serif;
  --font-numeric:"DIN Alternate","Roboto Mono",monospace;
  --ease: cubic-bezier(.25,.46,.45,.94);
  --radius-cut: 4px 12px 4px 12px;
  --header-h: 76px;
  --container: 1240px;
  --space: clamp(20px,4vw,48px);
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;background:var(--bg-primary)}
body{
  font-family:var(--font-body);
  background:var(--bg-primary);
  color:var(--text-primary);
  line-height:1.7;
  min-height:100vh;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
ul{list-style:none}
button{font-family:inherit;border:none;background:none;color:inherit;cursor:pointer}
::selection{background:rgba(212,175,55,.3);color:#fff}
:focus{outline:2px solid var(--accent-gold);outline-offset:4px}
:focus:not(:focus-visible){outline:none}
:focus-visible{outline:2px solid var(--accent-gold);outline-offset:4px;border-radius:4px}
.container{width:100%;max-width:var(--container);margin-inline:auto;padding-inline:var(--space)}
#main-content{min-height:60vh;outline:none}

/* ===================== 按钮系统 ===================== */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.5em;
  font-family:var(--font-body);font-size:.95rem;font-weight:600;
  padding:.7em 1.4em;border-radius:var(--radius-cut);
  border:1px solid transparent;transition:background .25s,color .25s,border-color .25s,transform .2s;
  line-height:1.4;white-space:nowrap;
}
.btn-accent{
  background:linear-gradient(135deg,#D4AF37 0%,#e6c95c 55%,#b8942a 100%);
  color:#0B0F1A;border-color:#d8b946;
}
.btn-accent:hover{transform:translateY(-2px);filter:brightness(1.08)}
.btn-ghost{
  background:transparent;color:var(--accent-gold);
  border-color:rgba(212,175,55,.55);
}
.btn-ghost:hover{background:rgba(212,175,55,.12);transform:translateY(-2px)}

/* ===================== 顶部条 ===================== */
.skip-link{
  position:fixed;top:-100px;left:20px;z-index:9999;
  background:var(--accent-gold);color:#0B0F1A;
  padding:.6em 1.2em;border-radius:8px;font-weight:700;
  transition:top .25s var(--ease);
}
.skip-link:focus{top:12px}

/* ===================== 头部 ===================== */
.sixi-header{
  background:rgba(11,15,26,.96);
  border-bottom:1px solid rgba(44,62,80,.7);
  position:sticky;top:0;z-index:900;
  backdrop-filter:blur(10px);
}
.header-inner{
  max-width:var(--container);margin-inline:auto;
  padding-inline:var(--space);
  display:flex;align-items:center;justify-content:space-between;
  min-height:var(--header-h);gap:24px;
}
.brand-lockup{
  display:inline-flex;align-items:center;gap:12px;flex-direction:row;
}
.brand-diamond{
  width:40px;height:40px;display:grid;place-items:center;
  background:linear-gradient(135deg,rgba(212,175,55,.2),rgba(212,175,55,0));
  border:1px solid rgba(212,175,55,.5);
  transform:rotate(45deg);border-radius:8px;position:relative;
}
.brand-diamond::after{
  content:"";position:absolute;inset:6px;
  border:1px solid rgba(212,175,55,.3);
  border-radius:4px;
}
.brand-diamond-core{
  width:12px;height:12px;background:var(--accent-gold);
  transform:rotate(-45deg);border-radius:2px;
}
.brand-diamond-line{
  position:absolute;width:22px;height:1px;
  background:linear-gradient(90deg,transparent,var(--accent-gold),transparent);
  transform:rotate(-45deg);
}
.brand-text{display:flex;flex-direction:column;line-height:1.2}
.brand-cn{
  font-family:var(--font-heading);font-size:1.2rem;font-weight:700;
  letter-spacing:.04em;color:#fff;
}
.brand-sub{font-size:.68rem;color:var(--text-muted);letter-spacing:.14em;text-transform:uppercase}

.nav-desktop{flex:1;display:flex;justify-content:flex-end}
.nav-list{display:flex;gap:4px}
.nav-link{
  font-size:.9rem;font-weight:500;color:var(--text-primary);
  padding:.6em .9em;border-radius:6px;
  position:relative;
  transition:color .25s,background .25s;
}
.nav-link::after{
  content:"";position:absolute;left:.8em;right:calc(100% - .8em);bottom:.35em;
  height:2px;background:var(--accent-gold);
  transition:right .3s var(--ease);
}
.nav-link:hover{color:var(--accent-gold)}
.nav-link:hover::after{right:.8em}
.nav-link[aria-current="page"]{color:var(--accent-gold)}
.nav-link[aria-current="page"]::after{right:1.4em;left:.4em;width:auto}
.header-cta{display:inline-flex;margin-left:14px}

.nav-toggle{
  display:none;width:44px;height:44px;flex-direction:column;
  align-items:center;justify-content:center;gap:5px;
}
.nav-toggle-line{
  width:24px;height:2px;background:var(--accent-gold);
  transition:transform .3s,opacity .3s;
}
.nav-toggle[aria-expanded="true"] .nav-toggle-line:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav-toggle[aria-expanded="true"] .nav-toggle-line:nth-child(2){opacity:0}
.nav-toggle[aria-expanded="true"] .nav-toggle-line:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

.nav-mobile{
  display:none;position:fixed;left:0;right:0;top:var(--header-h);
  background:rgba(11,15,26,.98);
  border-bottom:1px solid var(--border-color);
  padding:24px var(--space) 36px;
  box-shadow:0 18px 36px rgba(0,0,0,.4);
  z-index:899;
}
.nav-mobile[data-open="true"]{display:block}
.nav-list-mobile{display:flex;flex-direction:column;gap:2px}
.nav-list-mobile .nav-link{
  display:block;padding:.9em .4em;font-size:1.1rem;
  border-bottom:1px solid rgba(44,62,80,.5);
}
.nav-list-mobile .nav-link::after{content:none}
.nav-mobile-cta{margin-top:20px;width:100%}

/* ===================== 页脚 ===================== */
.sixi-footer{
  background:rgba(6,8,14,.9);
  border-top:1px solid rgba(212,175,55,.25);
  margin-top:80px;
  position:relative;
}
.sixi-footer::before{
  content:"四喜";
  position:absolute;right:0;top:-30px;
  font-family:var(--font-heading);font-size:clamp(3rem,10vw,7rem);
  font-weight:900;line-height:1;color:rgba(212,175,55,.045);
  pointer-events:none;user-select:none;
}
.footer-grand{
  display:grid;grid-template-columns:1fr 2fr;gap:60px;
  padding-block:64px 40px;
}
.footer-brand .brand-lockup{margin-bottom:20px}
.footer-statement{
  color:var(--text-muted);font-size:.92rem;max-width:320px;
  margin-top:16px;line-height:1.8;
  padding-left:16px;border-left:3px solid rgba(212,175,55,.4);
}
.footer-grid{
  display:grid;grid-template-columns:repeat(4,1fr);gap:24px;
}
.footer-col{min-width:0}
.footer-heading{
  font-family:var(--font-heading);font-size:1rem;font-weight:700;
  color:var(--text-primary);margin-bottom:18px;
  display:flex;align-items:center;gap:10px;
}
.footer-heading::before{
  content:"";width:16px;height:2px;background:var(--accent-gold);
  display:inline-block;
}
.footer-link-list{
  display:flex;flex-direction:column;gap:8px;
}
.footer-link{
  font-size:.9rem;color:var(--text-muted);
  position:relative;padding-left:16px;
  transition:color .25s,padding-left .25s;
}
.footer-link::before{
  content:"";position:absolute;left:0;top:50%;
  width:7px;height:1px;background:var(--accent-gold);
  transform:translateY(-50%) rotate(-45deg);
}
.footer-link:hover{color:var(--accent-gold);padding-left:20px}
.footer-contact-label{
  font-size:.72rem;color:var(--text-muted);
  display:block;opacity:.7;
}
.footer-address{font-size:.9rem;color:var(--text-muted)}
.footer-legal{
  display:flex;flex-wrap:wrap;gap:16px 28px;
  border-top:1px solid rgba(44,62,80,.6);
  padding-block:22px;
  font-size:.82rem;color:var(--text-muted);
}
.footer-icp{letter-spacing:.08em}

/* ===================== 面板与卡片 ===================== */
.panel-grid{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));
  gap:22px;
}
.panel-card{
  background:var(--bg-panel);
  border:1px solid var(--border-color);
  border-radius:var(--radius-cut);
  padding:26px;
  position:relative;
  transition:transform .25s var(--ease),border-color .25s var(--ease),background .25s;
}
.panel-card::before{
  content:"";position:absolute;left:0;top:24px;width:4px;height:36px;
  background:var(--accent-gold);border-radius:0 4px 4px 0;
  opacity:.7;
}
.panel-card:hover{transform:translateY(-4px);border-color:rgba(212,175,55,.45)}
.panel-title{
  font-family:var(--font-heading);font-size:var(--font-size-card-title,1.05rem);
  margin-bottom:10px;
}
.panel-meta{font-size:.78rem;color:var(--text-muted);font-family:var(--font-numeric)}
.panel-body{color:var(--text-muted);font-size:.92rem;margin-top:8px;line-height:1.8}
.panel-card[data-category]{cursor:pointer}

/* ===================== 标签 ===================== */
.tag{
  display:inline-flex;align-items:center;gap:6px;
  font-size:.72rem;font-weight:600;letter-spacing:.05em;
  padding:.3em .7em;border-radius:20px;
  border:1px solid transparent;
}
.tag-gold{background:rgba(212,175,55,.14);color:var(--accent-gold);border-color:rgba(212,175,55,.35)}
.tag-red{background:rgba(192,57,43,.14);color:#f3a59e;border-color:rgba(192,57,43,.4)}
.tag-green{background:rgba(39,174,96,.12);color:var(--status-ok);border-color:rgba(39,174,96,.3)}
.tag-blue{background:rgba(52,152,219,.12);color:var(--info-blue);border-color:rgba(52,152,219,.3)}
.tag-orange{background:rgba(230,126,34,.12);color:var(--warning-orange);border-color:rgba(230,126,34,.3)}

/* ===================== 指标带 ===================== */
.metric-strip{
  display:grid;grid-template-columns:repeat(4,1fr);gap:2px;
  background:var(--border-color);
  border-radius:12px;overflow:hidden;
}
.metric-item{
  background:var(--bg-panel);padding:26px 22px;
  position:relative;
}
.metric-item::after{
  content:"";position:absolute;right:0;top:28%;bottom:28%;
  width:1px;background:var(--border-color);
}
.metric-item:last-child::after{display:none}
.metric-number{
  font-family:var(--font-numeric);font-size:clamp(1.6rem,3vw,2.4rem);font-weight:700;
  color:var(--accent-gold);display:flex;align-items:baseline;gap:4px;
}
.metric-number small{font-size:.7em;color:var(--text-muted)}
.metric-label{font-size:.8rem;color:var(--text-muted);margin-top:6px}

/* ===================== 步骤时间线 ===================== */
.timeline{position:relative;padding-left:2px}
.timeline::before{
  content:"";position:absolute;left:9px;top:8px;bottom:8px;
  width:2px;background:linear-gradient(180deg,var(--accent-gold),rgba(212,175,55,.15));
}
.timeline-item{
  position:relative;padding-left:40px;margin-bottom:28px;
}
.timeline-item::after{
  content:"";position:absolute;left:0;top:6px;
  width:20px;height:20px;border-radius:50%;
  background:var(--bg-primary);
  border:2px solid var(--accent-gold);
}
.timeline-marker{
  font-family:var(--font-numeric);font-size:.78rem;color:var(--accent-gold);
  text-transform:uppercase;letter-spacing:.1em;
}
.timeline-point{font-size:.86rem;color:var(--text-primary);font-weight:500}

/* ===================== 标题块 ===================== */
.section-head{margin-bottom:36px}
.section-kicker{
  font-family:var(--font-numeric);font-size:.8rem;letter-spacing:.18em;
  color:var(--accent-gold);text-transform:uppercase;
  margin-bottom:10px;display:flex;align-items:center;gap:12px;
}
.section-kicker::before{content:"";width:26px;height:1px;background:var(--accent-gold)}
.section-title{
  font-family:var(--font-heading);
  font-size:clamp(1.6rem,3vw,2.2rem);
  line-height:1.3;margin-bottom:14px;
}
.section-desc{color:var(--text-muted);max-width:600px;font-size:.95rem}

/* ===================== 面包屑与正文 ===================== */
.breadcrumb{
  display:flex;flex-wrap:wrap;gap:8px;align-items:center;
  font-size:.84rem;color:var(--text-muted);
  margin:28px 0 0;
}
.breadcrumb li{display:flex;align-items:center;gap:8px}
.breadcrumb li:not(:last-child)::after{content:"/";color:var(--border-color)}
.breadcrumb a{color:var(--accent-gold)}
.article-body{max-width:780px;margin:0 auto;color:var(--text-muted);line-height:1.9}
.article-body h2,.article-body h3,.article-body h4{color:var(--text-primary);font-family:var(--font-heading);margin:24px 0 10px}
.article-body p{margin-bottom:1em}

/* ===================== 图片容器基础规则 ===================== */
.img-frame{
  position:relative;border-radius:var(--radius-cut);
  overflow:hidden;background:var(--bg-panel);
  border:1px solid var(--border-color);
  aspect-ratio:16/9;width:100%;
  display:grid;place-items:center;
}
.img-frame::before{
  content:"";position:absolute;inset:0;
  background:linear-gradient(135deg,rgba(212,175,55,.12),rgba(52,152,219,.08) 40%,transparent 70%);
  opacity:.7;
}
.img-frame::after{
  content:"";position:absolute;left:-10%;top:-20%;width:45%;height:150%;
  background:linear-gradient(135deg,transparent 0%,rgba(212,175,55,.1) 50%,transparent 100%);
  transform:rotate(30deg);
}
.img-frame--tall{aspect-ratio:3/4}
.img-frame--wide{aspect-ratio:21/9}
.img-frame-artwork{
  position:relative;z-index:1;
  font-size:.8rem;color:var(--text-muted);
  letter-spacing:.1em;text-transform:uppercase;
  font-family:var(--font-numeric);
  border:1px solid rgba(212,175,55,.4);
  border-radius:6px;
  padding:.4em .8em;
  transform:rotate(-2deg);
}

/* ===================== 返回顶部 ===================== */
.back-to-top{
  position:fixed;right:20px;bottom:20px;z-index:90;
  width:46px;height:46px;border-radius:10px;
  background:rgba(212,175,55,.14);border:1px solid rgba(212,175,55,.5);
  color:var(--accent-gold);font-size:1.2rem;font-weight:600;
  display:grid;place-items:center;
  opacity:0;pointer-events:none;
  transition:opacity .3s,transform .3s;
}
.back-to-top[data-visible="true"]{opacity:1;pointer-events:auto}
.back-to-top:hover{background:rgba(212,175,55,.25);transform:translateY(-4px)}

/* ===================== 滚动进度条 ===================== */
.scroll-progress{
  position:fixed;top:0;left:0;height:3px;width:0;
  background:linear-gradient(90deg,var(--accent-gold),#e6c95c,#B8860B);
  z-index:1000;transition:width .06s linear;
}

/* ===================== 响应式 ===================== */
@media (max-width:1024px){
  .nav-desktop{display:none}
  .nav-toggle{display:flex}
  .header-cta{display:none}
  .nav-mobile[data-open="true"]{display:block}
  .footer-grand{grid-template-columns:1fr;gap:40px}
  .footer-grid{grid-template-columns:repeat(2,1fr)}
  .metric-strip{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:640px){
  :root{--header-h:64px}
  .header-inner{padding-inline:18px}
  .brand-cn{font-size:1rem}
  .brand-sub{font-size:.6rem}
  .brand-diamond{width:34px;height:34px}
  .brand-diamond-core{width:10px;height:10px}
  .footer-grid{grid-template-columns:1fr;gap:32px}
  .footer-legal{flex-direction:column;gap:10px}
  .metric-strip{grid-template-columns:1fr}
  .panel-grid{grid-template-columns:1fr}
  .nav-mobile-cta{font-size:.95rem}
  .skip-link:focus{top:8px;left:8px}
}

/* ===================== prefers-reduced-motion ===================== */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.001s !important;
    animation-iteration-count:1 !important;
    transition-duration:.001s !important;
    scroll-behavior:auto !important;
  }
  html{scroll-behavior:auto}
  .back-to-top,.nav-mobile{transition:none}
}