/* ===========================================================
   /assets/site.css — 金花游戏 共享外壳
   暖金 / 深墨蓝 / 墨黑 / 暖纸白 + 朱砂红 · 翡翠绿 · 紫罗兰
   =========================================================== */

:root{
  --jh-gold:#D9A441;
  --jh-gold-lite:#F2D69B;
  --jh-ink-blue:#101B2E;
  --jh-ink:#0B1017;
  --jh-card:#1D2E4A;
  --jh-vermilion:#C8382F;
  --jh-paper:#F4EDE2;
  --jh-jade:#2E8B6E;
  --jh-violet:#6B4FA0;
  --jh-mist:#7C8CA0;

  --jh-line:rgba(124,140,160,.28);
  --jh-line-gold:rgba(217,164,65,.34);
  --jh-hair:rgba(244,237,226,.14);

  --jh-radius-s:12px;
  --jh-radius:20px;
  --jh-radius-l:32px;

  --jh-wrap:1240px;
  --jh-measure:36em;
  --jh-ease:cubic-bezier(.2,.8,.25,1);

  --jh-font:"PingFang SC","Hiragino Sans GB","Noto Sans SC","Microsoft YaHei",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --jh-mono:ui-monospace,SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace;
}

/* ---------- reset ---------- */
*,*::before,*::after{box-sizing:border-box;}
html{
  -webkit-text-size-adjust:100%;
  scroll-behavior:smooth;
  scroll-padding-top:132px;
}
body{
  margin:0;
  background:var(--jh-ink-blue);
  color:var(--jh-paper);
  font-family:var(--jh-font);
  font-size:17px;
  font-weight:400;
  line-height:1.8;
  -webkit-font-smoothing:antialiased;
}
main{display:block;}
img,svg,video{max-width:100%;height:auto;}
ul,ol{margin:0;padding:0;list-style:none;}
a{color:var(--jh-gold);text-decoration:none;}
a:hover{color:var(--jh-gold-lite);}
:focus-visible{outline:2px solid var(--jh-gold-lite);outline-offset:3px;}

/* ---------- 排版 ---------- */
h1,h2,h3,h4{
  margin:0 0 .6em;
  font-weight:900;
  line-height:1.16;
  letter-spacing:-.01em;
  color:var(--jh-paper);
}
h1{font-size:clamp(2.25rem,5.4vw,4.5rem);letter-spacing:-.02em;}
h2{font-size:clamp(1.5rem,2.6vw,1.75rem);}
h3{font-size:1.25rem;}
p{margin:0 0 1.15em;}
.jh-num{
  font-family:var(--jh-mono);
  letter-spacing:.02em;
  color:var(--jh-gold-lite);
  font-variant-numeric:tabular-nums;
}
.jh-small{font-size:13px;letter-spacing:.06em;color:var(--jh-mist);}
.jh-slash{
  height:1px;
  margin:clamp(32px,5vw,64px) 0;
  background:linear-gradient(90deg,transparent,var(--jh-line-gold) 20%,var(--jh-line-gold) 80%,transparent);
  transform:rotate(-1.3deg);
  transform-origin:left center;
}

/* ---------- 容器与分区 ---------- */
.jh-wrap{width:100%;max-width:var(--jh-wrap);margin:0 auto;padding:0 24px;}
.jh-band{padding:clamp(52px,7.5vw,108px) 0;}
.jh-band--paper{background:var(--jh-paper);color:#26313F;}
.jh-band--paper h1,.jh-band--paper h2,.jh-band--paper h3,.jh-band--paper h4{color:#0E1728;}
.jh-band--paper a{color:#8A5A0F;}
.jh-band--paper .jh-small,.jh-band--paper .jh-crumb{color:#5F6C7E;}
.jh-band--ink{background:var(--jh-ink);}
.jh-band--card{background:var(--jh-card);}
.jh-prose{max-width:var(--jh-measure);}
.jh-prose p{margin:0 0 1.15em;}

/* ---------- 栅格 ---------- */
.jh-grid{display:grid;gap:clamp(20px,3vw,36px);}
.jh-grid--split{grid-template-columns:minmax(0,8fr) minmax(0,3fr);}
.jh-grid--duo{grid-template-columns:repeat(2,minmax(0,1fr));}
.jh-grid--trio{grid-template-columns:repeat(3,minmax(0,1fr));}
.jh-grid--quad{grid-template-columns:repeat(4,minmax(0,1fr));}
@media (min-width:1025px){
  .jh-offset--40{margin-top:-40px;}
  .jh-offset--64{margin-top:-64px;}
  .jh-offset--down{margin-top:48px;}
}
@media (max-width:1024px){
  .jh-grid--split{grid-template-columns:minmax(0,1fr);}
  .jh-grid--quad{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media (max-width:720px){
  .jh-grid--duo,.jh-grid--trio,.jh-grid--quad{grid-template-columns:minmax(0,1fr);}
}

/* ---------- 按钮 ---------- */
.jh-btn{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:10px 16px;
  border:1px solid transparent;
  border-radius:999px;
  font-family:var(--jh-font);
  font-size:14px;
  font-weight:700;
  line-height:1.2;
  letter-spacing:.02em;
  text-decoration:none;
  cursor:pointer;
  transition:transform .18s var(--jh-ease),background .18s var(--jh-ease),border-color .18s var(--jh-ease),box-shadow .18s var(--jh-ease);
}
.jh-btn:hover{transform:translateY(-1px);}
.jh-btn--deal{
  background:var(--jh-vermilion);
  color:#fff;
  box-shadow:0 10px 24px -14px rgba(200,56,47,.95);
}
.jh-btn--deal:hover{background:#D8463D;color:#fff;}
.jh-btn--ghost{
  background:rgba(242,214,155,.06);
  border-color:var(--jh-line-gold);
  color:var(--jh-gold-lite);
}
.jh-btn--ghost:hover{background:rgba(242,214,155,.14);color:var(--jh-paper);}
.jh-btn--line{
  background:transparent;
  border-color:rgba(244,237,226,.24);
  color:var(--jh-paper);
}
.jh-btn--line:hover{border-color:var(--jh-line-gold);color:var(--jh-gold-lite);}
.jh-btn--ink{background:var(--jh-card);color:var(--jh-paper);}
.jh-btn--ink:hover{background:#24395C;}
.jh-btn--jade{background:var(--jh-jade);color:#fff;}
.jh-btn--jade:hover{background:#37A181;color:#fff;}

/* ---------- 标签 / 图例 ---------- */
.jh-tag{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:4px 10px;
  border:1px solid currentColor;
  border-radius:999px;
  font-size:12.5px;
  font-weight:600;
  letter-spacing:.06em;
  line-height:1.5;
  color:var(--jh-gold-lite);
}
.jh-tag--jade{color:#5FC7A2;}
.jh-tag--violet{color:#A98BD8;}
.jh-tag--verm{color:#E9766D;}
.jh-tag--mist{color:var(--jh-mist);}
.jh-legend{
  display:flex;
  flex-wrap:wrap;
  gap:8px 16px;
  font-size:13px;
  color:var(--jh-mist);
}
.jh-legend__item{display:inline-flex;align-items:center;gap:7px;}
.jh-legend__dot{
  width:9px;height:9px;
  border-radius:3px;
  background:var(--jh-gold);
  flex:none;
}
.jh-legend__dot--jade{background:var(--jh-jade);}
.jh-legend__dot--violet{background:var(--jh-violet);}
.jh-legend__dot--verm{background:var(--jh-vermilion);}

/* ---------- 卡片 ---------- */
.jh-card{
  padding:clamp(20px,2.4vw,30px);
  border:1px solid rgba(217,164,65,.18);
  border-radius:var(--jh-radius);
  background:linear-gradient(150deg,var(--jh-card) 0%,#131F35 100%);
}
.jh-card--paper{
  background:var(--jh-paper);
  border-color:rgba(124,140,160,.3);
  color:#1B2636;
}
.jh-card--paper h3{color:#0E1728;}
.jh-card__kicker{
  display:block;
  margin-bottom:10px;
  font-family:var(--jh-mono);
  font-size:13px;
  letter-spacing:.14em;
  color:var(--jh-gold);
}
.jh-card--paper .jh-card__kicker{color:#8A5A0F;}

/* ---------- 面包屑 ---------- */
.jh-crumb{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:6px 10px;
  margin:0 0 22px;
  font-size:13px;
  letter-spacing:.08em;
  color:var(--jh-mist);
}
.jh-crumb li{display:inline-flex;align-items:center;gap:10px;}
.jh-crumb li+li::before{content:"";width:14px;height:1px;background:var(--jh-line);}
.jh-crumb a{color:var(--jh-mist);}
.jh-crumb a:hover{color:var(--jh-gold);}
.jh-crumb [aria-current="page"]{color:var(--jh-gold-lite);font-weight:600;}

/* ---------- 章节目录（粘性索引栏） ---------- */
.jh-rail{
  position:sticky;
  top:clamp(96px,14vh,140px);
  align-self:start;
}
.jh-rail__title{
  margin:0 0 12px;
  font-family:var(--jh-mono);
  font-size:11px;
  letter-spacing:.2em;
  color:var(--jh-gold);
  font-weight:600;
}
.jh-rail__list{border-left:2px solid rgba(124,140,160,.22);}
.jh-rail__link{
  display:block;
  margin-left:-2px;
  padding:7px 0 7px 14px;
  border-left:2px solid transparent;
  font-size:14px;
  color:var(--jh-mist);
  transition:color .18s var(--jh-ease),border-color .18s var(--jh-ease);
}
.jh-rail__link:hover{color:var(--jh-paper);}
.jh-rail__link[aria-current="location"]{
  border-left-color:var(--jh-gold);
  color:var(--jh-gold-lite);
  font-weight:600;
}

/* ---------- 图片容器基础（页面阶段放占位） ---------- */
.jh-figure{
  position:relative;
  margin:0;
  overflow:hidden;
  border:1px solid var(--jh-line-gold);
  border-radius:var(--jh-radius);
  background:radial-gradient(120% 120% at 18% 8%,#22355A 0%,#101B2E 55%,#0B1017 100%);
}
.jh-figure::after{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  box-shadow:inset 0 0 0 1px rgba(242,214,155,.16);
  pointer-events:none;
}
.jh-figure img{display:block;width:100%;height:100%;object-fit:cover;aspect-ratio:4/3;}
.jh-figure--wide img{aspect-ratio:16/9;}
.jh-figure--tall img{aspect-ratio:3/4;}
.jh-figure__ph{
  position:absolute;
  inset:0;
  display:grid;
  place-items:center;
  font-family:var(--jh-mono);
  font-size:12px;
  letter-spacing:.2em;
  color:rgba(242,214,155,.5);
  text-transform:uppercase;
}
.jh-figure__cap{
  padding:12px 16px;
  font-size:13px;
  line-height:1.7;
  color:var(--jh-mist);
  background:rgba(11,16,23,.72);
}

/* ===========================================================
   页头
   =========================================================== */
.jh-header{
  position:sticky;
  top:0;
  z-index:60;
  background:linear-gradient(180deg,#101B2E 0%,#0D1728 100%);
  color:var(--jh-paper);
  border-bottom:1px solid var(--jh-line-gold);
  transition:box-shadow .28s var(--jh-ease);
}
.jh-header[data-shrink]{box-shadow:0 20px 44px -30px rgba(0,0,0,.95);}
.jh-header__rail{
  max-width:var(--jh-wrap);
  margin:0 auto;
  padding:16px 24px 10px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  transition:padding .28s var(--jh-ease);
}
.jh-header[data-shrink] .jh-header__rail{padding-top:8px;padding-bottom:6px;}

.jh-skip{
  position:absolute;
  left:16px;
  top:-72px;
  z-index:90;
  padding:12px 18px;
  border-radius:0 0 var(--jh-radius-s) var(--jh-radius-s);
  background:var(--jh-gold);
  color:#101B2E;
  font-weight:800;
  font-size:14px;
  transition:top .2s var(--jh-ease);
}
.jh-skip:focus{top:0;color:#101B2E;}

.jh-brand{display:inline-flex;align-items:center;gap:10px;color:var(--jh-paper);}
.jh-brand:hover{color:var(--jh-paper);}
.jh-brand__pip{
  width:12px;
  height:19px;
  flex:none;
  border-radius:3px 3px 4px 4px;
  background:linear-gradient(160deg,var(--jh-gold-lite) 0%,var(--jh-gold) 45%,var(--jh-vermilion) 100%);
  box-shadow:0 0 0 1px rgba(242,214,155,.45),0 6px 16px -8px rgba(217,164,65,.9);
  transform:rotate(-8deg);
}
.jh-brand__text{
  display:inline-flex;
  align-items:baseline;
  gap:8px;
  font-size:19px;
  font-weight:900;
  letter-spacing:.02em;
}
.jh-brand__sep{color:var(--jh-gold);font-weight:700;}
.jh-brand__sub{
  display:inline-block;
  max-width:14em;
  overflow:hidden;
  white-space:nowrap;
  font-size:12.5px;
  font-weight:600;
  letter-spacing:.16em;
  color:var(--jh-mist);
  transition:max-width .3s var(--jh-ease),opacity .3s var(--jh-ease);
}
.jh-header[data-shrink] .jh-brand__sub{max-width:0;opacity:0;}

.jh-nav{}
.jh-nav__label,.jh-nav__quick{display:none;}
.jh-nav__list{display:flex;flex-wrap:wrap;align-items:center;gap:2px;}
.jh-nav__link{
  position:relative;
  display:block;
  padding:9px 12px;
  border-radius:10px;
  font-size:15px;
  font-weight:500;
  color:rgba(244,237,226,.78);
  transition:color .18s var(--jh-ease),background .18s var(--jh-ease);
}
.jh-nav__link:hover{color:var(--jh-paper);background:rgba(217,164,65,.12);}
.jh-nav__link[aria-current="page"]{color:var(--jh-gold-lite);font-weight:700;}
.jh-nav__link[aria-current="page"]::after{
  content:"";
  position:absolute;
  left:12px;right:12px;bottom:3px;
  height:2px;
  border-radius:2px;
  background:var(--jh-gold);
}

.jh-header__actions{display:flex;align-items:center;gap:10px;flex:none;}

.jh-burger{
  display:none;
  align-items:center;
  gap:9px;
  padding:9px 14px;
  border:1px solid var(--jh-line-gold);
  border-radius:999px;
  background:rgba(242,214,155,.08);
  color:var(--jh-gold-lite);
  font-family:var(--jh-font);
  font-size:13px;
  font-weight:600;
  line-height:1;
  letter-spacing:.1em;
  cursor:pointer;
}
.jh-burger__box{display:inline-flex;flex-direction:column;gap:4px;width:16px;}
.jh-burger__bar{
  display:block;
  height:2px;
  border-radius:2px;
  background:currentColor;
  transition:transform .22s var(--jh-ease);
}
.jh-burger[aria-expanded="true"] .jh-burger__bar:first-child{transform:translateY(3px) rotate(45deg);}
.jh-burger[aria-expanded="true"] .jh-burger__bar:last-child{transform:translateY(-3px) rotate(-45deg);}

.jh-header__strip{
  max-width:var(--jh-wrap);
  margin:0 auto;
  padding:0 24px 9px;
  display:flex;
  align-items:center;
  gap:12px;
}
.jh-header__coords{
  flex:none;
  font-family:var(--jh-mono);
  font-size:11px;
  letter-spacing:.18em;
  color:rgba(217,164,65,.85);
  white-space:nowrap;
}
.jh-header__rule{
  position:relative;
  flex:1;
  height:2px;
  border-radius:2px;
  background:var(--jh-hair);
  overflow:hidden;
}
.jh-header__fill{
  display:block;
  height:100%;
  width:0;
  border-radius:2px;
  background:linear-gradient(90deg,var(--jh-gold),var(--jh-gold-lite));
}

@media (max-width:1140px){
  .jh-nav__link{padding:8px 9px;font-size:14px;}
  .jh-header__actions .jh-btn{padding:9px 12px;font-size:13px;}
  .jh-brand__sub{max-width:0;opacity:0;}
}

@media (max-width:1000px){
  .jh-header__rail{padding:12px 16px 8px;gap:12px;}
  .jh-header[data-shrink] .jh-header__rail{padding-top:8px;padding-bottom:6px;}
  .jh-header__strip{padding:0 16px 8px;}
  .jh-brand__text{font-size:17px;}
  .jh-header__actions .jh-btn{display:none;}
  .jh-burger{display:inline-flex;}

  .jh-nav{
    position:fixed;
    left:0;right:0;bottom:0;
    z-index:80;
    max-height:84vh;
    overflow-y:auto;
    padding:22px 20px calc(22px + env(safe-area-inset-bottom,0px));
    border-top:1px solid var(--jh-line-gold);
    border-radius:24px 24px 0 0;
    background:linear-gradient(180deg,#16243F 0%,#0B1017 100%);
    box-shadow:0 -26px 64px -28px rgba(0,0,0,.95);
    transform:translateY(112%);
    visibility:hidden;
    transition:transform .32s var(--jh-ease),visibility .32s var(--jh-ease);
  }
  .jh-nav[data-open="true"]{transform:translateY(0);visibility:visible;}

  .jh-nav__label{
    display:block;
    margin:0 0 14px;
    font-family:var(--jh-mono);
    font-size:11px;
    letter-spacing:.2em;
    color:var(--jh-gold);
    font-weight:600;
  }
  .jh-nav__list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;}
  .jh-nav__link{
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:14px;
    border:1px solid rgba(217,164,65,.16);
    border-radius:14px;
    background:rgba(242,214,155,.06);
    font-size:16px;
    font-weight:600;
    color:var(--jh-paper);
  }
  .jh-nav__link[aria-current="page"]{background:rgba(217,164,65,.18);}
  .jh-nav__link[aria-current="page"]::after{
    position:static;
    width:8px;height:8px;
    border-radius:2px;
    background:var(--jh-gold);
  }
  .jh-nav__quick{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:18px;}
  .jh-nav__quick .jh-btn{justify-content:center;padding:14px 10px;font-size:15px;}
}

html.jh-nav-open,html.jh-nav-open body{overflow:hidden;}

/* ===========================================================
   页脚
   =========================================================== */
.jh-footer{
  background:var(--jh-ink);
  color:rgba(244,237,226,.74);
  border-top:1px solid var(--jh-line-gold);
}
.jh-footer__deck{
  max-width:var(--jh-wrap);
  margin:0 auto;
  padding:clamp(48px,7vw,88px) 24px clamp(30px,4vw,48px);
  display:grid;
  grid-template-columns:minmax(0,4fr) minmax(0,8fr);
  gap:clamp(32px,5vw,64px);
}
.jh-footer__mark{
  margin:0 0 10px;
  font-size:20px;
  font-weight:900;
  letter-spacing:.02em;
  color:var(--jh-paper);
}
.jh-footer__slogan{
  margin:0 0 14px;
  font-size:clamp(22px,2.6vw,30px);
  font-weight:900;
  line-height:1.28;
  letter-spacing:-.01em;
  color:var(--jh-gold-lite);
}
.jh-footer__note{
  margin:0 0 20px;
  max-width:32em;
  font-size:14px;
  line-height:1.75;
  color:var(--jh-mist);
}
.jh-footer__legend{gap:8px 18px;}
.jh-footer__cols{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:24px 20px;
}
.jh-footer__title{
  margin:0 0 12px;
  font-size:14px;
  font-weight:800;
  letter-spacing:.12em;
  color:var(--jh-gold);
}
.jh-footer__list{display:grid;gap:9px;}
.jh-footer__link{
  display:inline-block;
  font-size:14.5px;
  color:rgba(244,237,226,.72);
  border-bottom:1px solid transparent;
  transition:color .18s var(--jh-ease),border-color .18s var(--jh-ease);
}
.jh-footer__link:hover{color:var(--jh-paper);border-bottom-color:var(--jh-line-gold);}
.jh-footer__base{
  max-width:var(--jh-wrap);
  margin:0 auto;
  padding:20px 24px 28px;
  border-top:1px solid rgba(124,140,160,.22);
  display:flex;
  flex-wrap:wrap;
  align-items:baseline;
  gap:8px 24px;
  font-size:13px;
  color:var(--jh-mist);
}
.jh-footer__legal,.jh-footer__copy{margin:0;}
.jh-footer__contact{
  margin:0;
  width:100%;
  display:flex;
  flex-wrap:wrap;
  gap:4px 20px;
}
.jh-footer__ci{
  font-family:var(--jh-mono);
  letter-spacing:.02em;
  color:#8E9CAE;
}

@media (max-width:1000px){
  .jh-footer__deck{grid-template-columns:minmax(0,1fr);}
}
@media (max-width:640px){
  .jh-footer__cols{grid-template-columns:repeat(2,minmax(0,1fr));}
}

/* ===========================================================
   返回顶部 / 状态反馈
   =========================================================== */
.jh-totop{
  position:fixed;
  right:22px;
  bottom:96px;
  z-index:70;
  padding:11px 16px;
  border:1px solid var(--jh-line-gold);
  border-radius:999px;
  background:rgba(16,27,46,.94);
  color:var(--jh-gold-lite);
  font-family:var(--jh-font);
  font-size:13px;
  font-weight:600;
  line-height:1;
  letter-spacing:.1em;
  cursor:pointer;
  opacity:0;
  visibility:hidden;
  transform:translateY(10px);
  transition:opacity .24s var(--jh-ease),transform .24s var(--jh-ease),visibility .24s var(--jh-ease),background .18s var(--jh-ease);
}
.jh-totop.is-visible{opacity:1;visibility:visible;transform:none;}
.jh-totop:hover{background:#1D2E4A;color:var(--jh-paper);}

[data-copy].is-copied{
  box-shadow:0 0 0 2px var(--jh-gold-lite);
  color:var(--jh-gold-lite);
}

/* ===========================================================
   入场
   =========================================================== */
[data-reveal]{
  opacity:0;
  transform:translateY(18px);
  transition:opacity .32s var(--jh-ease),transform .32s var(--jh-ease);
}
[data-reveal].is-in{opacity:1;transform:none;}

@media (max-width:640px){
  .jh-totop{right:14px;bottom:78px;padding:10px 14px;font-size:12px;}
  .jh-wrap{padding:0 18px;}
  .jh-header__rail{padding-left:16px;padding-right:16px;}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  *,*::before,*::after{
    transition-duration:.001ms !important;
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
  }
  [data-reveal]{opacity:1 !important;transform:none !important;}
}