/* Zu Online site - shared look (landing, reg.php, account.php).
   Palette follows the in-game re-brand: ink, teal (our "jade"), gold; gilt and cinnabar are accents. */
:root{
  --ink:#04131a; --ink2:#082630; --ink3:#020c12;
  --teal:#46e6dc; --teal2:#1f9f98; --gold:#ffdea0; --gold2:#d39a3c; --cinnabar:#e93f2d;
  --text:#e8f1ee; --dim:#8fb0aa; --bad:#ff7a6b; --good:#7cf59a;
  --card:rgba(4,23,32,.72); --line:rgba(90,200,190,.28); --goldline:rgba(255,222,160,.26);
  --gilt:linear-gradient(180deg,#f8e4a7 0%,#e7ba54 48%,#b47825 100%);
  --f-head:"Cinzel","Palatino Linotype","Book Antiqua",Palatino,Georgia,serif;
  --f-brush:"Ma Shan Zheng","KaiTi","STKaiti","SimSun",serif;
  --f-body:"Segoe UI",system-ui,-apple-system,Roboto,sans-serif;
}
.serif,.f-head{font-family:var(--f-head)}
.f-brush{font-family:var(--f-brush);font-weight:400}
.gilt{background:var(--gilt);-webkit-background-clip:text;background-clip:text;color:transparent}
.glow-teal{text-shadow:0 0 18px rgba(70,230,220,.45)}

/* section heading: brush line, ornament + small caps label, gilt title, lead */
.eyebrow{text-align:center;max-width:720px;margin:0 auto}
.eyebrow .zh{font-family:var(--f-brush);font-size:26px;color:rgba(70,230,220,.8);line-height:1}
.eyebrow .tag{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:6px;
  font-size:12px;letter-spacing:.35em;text-transform:uppercase;color:var(--gold)}
.eyebrow .tag svg{width:40px;height:12px;color:rgba(255,222,160,.6);flex:0 0 auto}
.eyebrow .tag svg.flip{transform:scaleX(-1)}
.eyebrow h2{margin-top:14px;font-family:var(--f-head);font-weight:700;font-size:clamp(28px,4.4vw,46px);line-height:1.12;letter-spacing:.02em}
.eyebrow p{margin-top:14px;color:var(--dim);line-height:1.7;font-size:16px}

/* buttons */
.zbtn{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:14px 26px;border-radius:12px;font-weight:700;
  font-size:15px;letter-spacing:.04em;text-decoration:none;cursor:pointer;border:1px solid var(--goldline);color:var(--gold);
  background:rgba(4,20,26,.55);transition:transform .15s,box-shadow .2s,background .2s,border-color .2s}
.zbtn:hover{transform:translateY(-2px);border-color:var(--gold);box-shadow:0 10px 30px rgba(0,0,0,.4),0 0 20px rgba(255,222,160,.18)}
.zbtn.primary{border:0;color:#062026;background:linear-gradient(135deg,var(--teal),var(--gold));background-size:200% 200%;animation:zflow 5s ease infinite}
.zbtn.primary:hover{box-shadow:0 10px 30px rgba(0,0,0,.4),0 0 26px rgba(70,230,220,.4)}
.zbtn .zh{font-family:var(--f-brush);font-weight:400;font-size:18px;opacity:.85}
@keyframes zflow{50%{background-position:100% 100%}}

/* cinnabar seal */
.seal-stamp{display:inline-grid;place-items:center;width:46px;height:46px;border-radius:6px;background:var(--cinnabar);color:#fff4e6;
  font-family:var(--f-brush);font-size:22px;line-height:1;box-shadow:inset 0 0 0 2px rgba(255,244,230,.35),0 6px 18px rgba(233,63,45,.35);transform:rotate(-6deg)}

@media (prefers-reduced-motion:reduce){.zbtn.primary{animation:none}}