/* V15-V14BASE: Hero hierarchy repair on top of V14 single-mark platform assets. */
:root{
  --navy:#1B1F3C;
  --jade:#406A70;
  --sky:#7FC4CA;
  --ink:#17213A;
  --sub:#8590A0;
  --canvas:#F2F7F7;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--canvas)}
body{margin:0;background:radial-gradient(circle at 0 6%,rgba(127,196,202,.20),transparent 31rem),linear-gradient(180deg,#F1F8F7 0%,#F7F9F9 44%,#EEF4F5 100%);color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent}
button{font:inherit}
.app{width:min(100%,760px);margin:0 auto;padding:0 14px 48px;overflow:hidden}

/* V15 hero: brand lockup stays top-left; the copy is a calm lower caption deck inside the same continuous scene. */
.hero{position:relative;aspect-ratio:4 / 3;height:auto;min-height:0;margin:0 -14px 12px;overflow:hidden;border-radius:0 0 30px 30px;background:#062151;box-shadow:0 18px 40px rgba(27,31,60,.15)}
.hero__scene{display:block;width:100%;height:100%;object-fit:contain;object-position:center;background:#062151;filter:saturate(1.04) contrast(1.015) brightness(1.05)}
.hero__shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(4,17,50,.42) 0%,rgba(4,17,50,.24) 35%,rgba(4,17,50,.06) 60%,rgba(4,17,50,0) 78%),linear-gradient(0deg,rgba(6,20,54,.92) 0%,rgba(6,20,54,.68) 30%,rgba(6,20,54,.22) 48%,rgba(6,20,54,0) 66%);pointer-events:none}
.hero__content{position:absolute;z-index:1;inset:0;color:#fff;text-shadow:none}
.hero__lockup{position:absolute;top:18px;left:20px;display:block;width:152px;height:auto;filter:drop-shadow(0 2px 4px rgba(0,0,0,.22))}
.hero__copy{position:absolute;left:20px;bottom:19px;color:#fff}
.hero__eyebrow{display:block;margin:0;color:rgba(190,232,235,.98);font-size:8.5px;line-height:1.2;font-weight:750;letter-spacing:.20em}
.hero h1{display:block;margin:9px 0 0;color:#fff;font-size:31px;line-height:1.08;font-weight:800;letter-spacing:.012em;white-space:nowrap;text-shadow:0 1px 1px rgba(0,0,0,.18)}
.hero__tagline{display:block;margin:9px 0 0;color:rgba(243,251,252,.97);font-size:14px;line-height:1.3;font-weight:500;letter-spacing:.025em;white-space:nowrap}
.hero__tagline span{color:#9EDBDD;font-weight:700;padding:0 3px}
.hero__rule,.hero__note{display:none}

.tabs{display:flex;gap:8px;padding:10px 2px 5px;overflow:auto;scrollbar-width:none}.tabs::-webkit-scrollbar{display:none}.tabs a{flex:0 0 auto;text-decoration:none;color:#5D6A7D;background:rgba(255,255,255,.76);border:1px solid rgba(255,255,255,.95);padding:8px 13px;border-radius:999px;font-size:12px;box-shadow:0 6px 14px rgba(36,55,68,.045)}.tabs a:active{transform:scale(.96)}
.intro{display:flex;align-items:center;gap:6px;margin:0 4px 11px;color:#7B8797;font-size:11px;line-height:1.35}.intro b{display:block;width:20px;height:1px;background:var(--jade);opacity:.78}.intro span{color:#526276;font-weight:650}.intro i{font-style:normal;color:#93B7B9}.intro em{font-style:normal;color:#8793A2}

.platform{position:relative;margin:0 0 16px;padding:17px 12px 14px;overflow:hidden;border-radius:23px;background:rgba(255,255,255,.86);border:1px solid rgba(255,255,255,.92);box-shadow:0 15px 35px rgba(36,57,75,.055)}
.platform::before,.platform::after{content:none!important;display:none!important;background:none!important;box-shadow:none!important}
.platform--wechat{--accent:#24A167}.platform--video{--accent:#D8962B}.platform--douyin{--accent:#5A6070}.platform--xiaohongshu{--accent:#E85570}.platform--zhihu{--accent:#4D8BD8}.platform--bilibili{--accent:#DD7FA2}.platform--kuaishou{--accent:#E98242}.platform--global{--accent:var(--jade)}
.platform__header{position:relative;z-index:1;display:flex;align-items:center;gap:11px;padding:0 2px 15px}.platform__icon{width:42px;height:42px;flex:0 0 42px;display:grid;place-items:center;overflow:visible}.platform__icon img{display:block;max-width:42px;max-height:42px;width:auto;height:auto;object-fit:contain;filter:drop-shadow(0 2px 4px rgba(30,48,63,.045))}.platform--video .platform__icon img{width:42px;height:35px}.platform--global .platform__icon img{width:36px;height:36px;max-width:none;max-height:none;filter:none}.platform__title strong{display:block;margin:0;font-size:20px;line-height:1;font-weight:700;letter-spacing:.01em}.platform__title small{display:block;margin-top:7px;color:#8C97A7;font-size:11px}.platform__line{height:2px;flex:1;max-width:155px;margin-left:4px;background:linear-gradient(90deg,var(--accent),transparent);opacity:.68}

.cards{position:relative;z-index:1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.card{min-height:86px;position:relative;overflow:hidden;border:1px solid rgba(27,31,60,.07);border-radius:18px;background:linear-gradient(136deg,#FFF 0%,#F5F9F9 100%);padding:14px 76px 14px 15px;text-align:left;color:var(--ink);box-shadow:0 7px 16px rgba(35,53,68,.03);cursor:pointer;transition:transform .17s ease,box-shadow .17s ease,border-color .17s ease}.card:hover{border-color:rgba(64,106,112,.18);box-shadow:0 12px 23px rgba(35,53,68,.07)}.card:active{transform:scale(.975);box-shadow:0 4px 9px rgba(35,53,68,.05)}
.card--wide{grid-column:1 / -1;min-height:74px}.card--terminal{grid-column:auto;width:auto;justify-self:stretch;min-height:86px}.card--terminal.card--nowrap{padding-right:76px}.card--terminal.card--nowrap .card__text{white-space:nowrap;word-break:normal;line-break:auto;font-size:13px;letter-spacing:0}.card--small .card__text{font-size:13px}.card__text{position:relative;z-index:2;display:block;font-size:14px;line-height:1.55;font-weight:500;letter-spacing:.01em;word-break:keep-all;line-break:strict}.card__text span{display:block;margin-top:4px;color:#758298;font-size:11px;line-height:1.25;font-weight:500;letter-spacing:.02em}
.card__ornament{position:absolute;top:50%;right:16px;bottom:auto;width:38px;height:38px;display:grid;place-items:center;transform:translateY(-50%);pointer-events:none}.card__ornament i{display:none!important}.card__ornament img{display:block;width:32px;height:32px;object-fit:contain;opacity:.78;filter:none}.card--wide .card__ornament{right:17px}.card--terminal .card__ornament{right:16px}.card--terminal.card--nowrap{padding-right:76px}.card__social{position:absolute;right:15px;bottom:14px;width:25px;height:25px;object-fit:contain}.cards--global .card{min-height:86px;padding:14px 46px 12px 14px}.cards--global .card__text{font-size:13px;line-height:1.25;font-weight:600;white-space:nowrap}.cards--global .card__text span{margin-top:5px;font-size:11px;font-weight:500;white-space:normal}
.footer{padding:26px 0 0;text-align:center;color:#9CA6B1;font-size:12px}

.sheet-mask{position:fixed;inset:0;z-index:9;background:rgba(9,18,36,.42);backdrop-filter:blur(3px)}.sheet{position:fixed;z-index:10;left:0;right:0;bottom:0;padding:11px 15px calc(16px + env(safe-area-inset-bottom));transform:translateY(105%);border-radius:25px 25px 0 0;background:#fff;box-shadow:0 -15px 46px rgba(0,0,0,.18);transition:transform .27s cubic-bezier(.2,.85,.25,1)}.sheet.is-open{transform:translateY(0)}.sheet__handle{display:block;width:35px;height:4px;margin:1px auto 15px;border-radius:99px;background:#DDE2E8}.sheet__platform{display:block;color:var(--jade);font-size:12px;text-align:center;font-weight:700}.sheet h2{margin:7px 0 6px;text-align:center;font-size:20px}.sheet p{margin:0 0 16px;text-align:center;color:#7E8999;font-size:13px}.sheet button{display:block;width:100%;border:0;border-radius:14px;margin:8px 0;padding:14px 12px;font-weight:600;cursor:pointer}.sheet button:active{transform:scale(.985)}.sheet__primary{color:#fff;background:linear-gradient(135deg,#406A70,#1B5D66);box-shadow:0 9px 18px rgba(64,106,112,.20)}.sheet__secondary{color:#273346;background:#EFF3F4}.sheet__cancel{color:#7E8999;background:#fff}.toast{position:fixed;left:50%;bottom:100px;z-index:15;opacity:0;pointer-events:none;transform:translate(-50%,14px);padding:10px 15px;white-space:nowrap;border-radius:999px;color:#fff;background:rgba(20,29,45,.90);font-size:12px;transition:opacity .2s,transform .2s}.toast.show{opacity:1;transform:translate(-50%,0)}

@media(min-width:600px){.app{padding-left:20px;padding-right:20px}.hero{aspect-ratio:4 / 3;height:auto;margin-left:-20px;margin-right:-20px;border-radius:0 0 33px 33px}.hero__content{inset:0;width:auto}.hero__lockup{top:28px;left:32px;width:178px}.hero__copy{left:32px;bottom:31px}.hero__eyebrow{font-size:10px}.hero h1{margin-top:11px;font-size:38px}.hero__tagline{margin-top:11px;font-size:16px}.cards{grid-template-columns:repeat(3,minmax(0,1fr))}.card--wide{grid-column:span 3}.card--terminal{grid-column:auto;width:auto}.card--terminal.card--nowrap{padding-right:76px}.cards--global{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:350px){.app{padding-left:10px;padding-right:10px}.hero{margin-left:-10px;margin-right:-10px;aspect-ratio:4 / 3;height:auto}.hero__lockup{top:15px;left:15px;width:126px}.hero__copy{left:15px;bottom:14px}.hero__eyebrow{font-size:7px}.hero h1{margin-top:7px;font-size:25px}.hero__tagline{margin-top:7px;font-size:11px}.card{padding-right:58px;padding-left:12px}.card__text{font-size:13px}.platform__line{max-width:118px}.cards--global .card__text{font-size:12px}}

/* V17-V16BASE: navigation and account-matrix introduction are intentionally separated into two calm zones. */
.discovery{
  margin:0 0 24px;
  padding:20px 4px 0;
}
.tabs{
  display:flex;
  gap:9px;
  padding:0;
  overflow:auto;
  scrollbar-width:none;
}
.tabs::-webkit-scrollbar{display:none}
.tabs a{
  flex:0 0 auto;
  padding:10px 14px;
  line-height:1;
}
.intro{
  display:block;
  margin:22px 3px 0;
  color:#7B8797;
}
.intro__lead{
  display:flex;
  align-items:center;
  gap:9px;
  min-height:20px;
}
.intro b{
  display:block;
  width:26px;
  height:1px;
  flex:0 0 26px;
  background:var(--jade);
  opacity:.82;
}
.intro span{
  color:#3E5268;
  font-size:13px;
  line-height:1.35;
  font-weight:700;
  letter-spacing:.01em;
}
.intro i{display:none}
.intro em{
  display:block;
  margin:9px 0 0 35px;
  color:#8B97A5;
  font-size:11.5px;
  line-height:1.55;
  font-style:normal;
  letter-spacing:.01em;
}
@media(min-width:600px){
  .discovery{padding-top:24px;margin-bottom:28px}
  .tabs a{padding:11px 16px}
  .intro{margin-top:24px}
  .intro span{font-size:14px}
  .intro em{font-size:12px}
}


/* V18-V17BASE: remove the redundant account-matrix caption; navigation becomes a calm standalone transition. */
.discovery{
  margin:0 0 24px;
  padding:24px 4px 0;
}
.discovery .tabs{
  padding:0;
  gap:10px;
}
.discovery .tabs a{
  padding:10px 14px;
}
.discovery .intro{display:none!important}
@media(min-width:600px){
  .discovery{padding-top:28px;margin-bottom:28px}
}


/* V19-V18BASE: the tab row is a true bridge between Hero and platform content.
   Top and bottom spacing are defined by padding (not collapsing margins),
   so the row never visually sticks to the Hero or the first platform card. */
.hero{margin-bottom:0}
.discovery{
  margin:0;
  padding:30px 4px 30px;
}
.discovery .tabs{
  min-height:36px;
  align-items:center;
}
@media(min-width:600px){
  .discovery{padding-top:36px;padding-bottom:36px}
}
@media(max-width:350px){
  .discovery{padding-top:26px;padding-bottom:26px}
}

/* V20-V19BASE: the tab row is given real external space, not a compressed in-flow strip.
   Hero → tabs: 24px. Tabs → first platform: 26px. */
.hero{margin-bottom:0}
.discovery{
  margin:0 0 26px;
  padding:24px 4px 0;
}
.discovery .tabs{gap:10px}
@media(min-width:600px){
  .discovery{margin-bottom:30px;padding-top:28px}
}
@media(max-width:350px){
  .discovery{margin-bottom:22px;padding-top:20px}
}


/* V21-V20BASE: the tabs become their own structural bridge, not a margin squeezed between Hero and the first card. */
.hero{margin-bottom:0}
.nav-bridge{
  position:relative;
  z-index:1;
  margin:0;
  padding:30px 0 42px;
}
.nav-bridge .tabs{
  min-height:36px;
  display:flex;
  align-items:center;
  gap:10px;
  padding:0 4px;
}
/* The first platform starts only after the bridge has completed its fixed lower breathing space. */
.nav-bridge + .platform{margin-top:0}
@media(min-width:600px){
  .nav-bridge{padding-top:36px;padding-bottom:48px}
  .nav-bridge .tabs{padding-left:4px;padding-right:4px}
}
@media(max-width:350px){
  .nav-bridge{padding-top:26px;padding-bottom:36px}
}


/* V22-V21BASE: hard structural spacing between Hero, tab bridge and first platform.
   Use explicit sibling margins rather than inherited padding so the first white card cannot visually stick to the tabs. */
.hero{margin-bottom:0}
.nav-bridge{
  margin:0;
  padding:26px 4px 0;
}
.nav-bridge .tabs{
  min-height:38px;
  padding:0;
  gap:10px;
}
.nav-bridge + .platform{
  margin-top:30px!important;
}
@media(min-width:600px){
  .nav-bridge{padding-top:32px}
  .nav-bridge + .platform{margin-top:36px!important}
}
@media(max-width:350px){
  .nav-bridge{padding-top:22px}
  .nav-bridge + .platform{margin-top:26px!important}
}


/* V23-V22BASE: real nav bridge spacing. This rule is intentionally after all legacy nav adjustments.
   The bridge owns the visual gap: 26px from Hero to tab row, 30px from tab row to the first platform card. */
.hero{margin-bottom:0!important}
.nav-bridge{
  display:block!important;
  position:relative;
  z-index:1;
  margin:0!important;
  padding:26px 4px 30px!important;
}
.nav-bridge .tabs{
  display:flex!important;
  align-items:center!important;
  min-height:38px!important;
  padding:0!important;
  gap:10px!important;
}
.nav-bridge + .platform{
  margin-top:0!important;
}
@media(min-width:600px){
  .nav-bridge{padding-top:32px!important;padding-bottom:34px!important}
}
@media(max-width:350px){
  .nav-bridge{padding-top:22px!important;padding-bottom:28px!important}
}



/* V25-V24BASE: all account cards enter a unified fallback sheet.
   Direct links are explicit actions inside the sheet; QR codes remain long-pressable. */
.sheet{
  max-height:calc(100dvh - 18px);
  overflow-y:auto;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
}
.sheet__status{
  display:flex;
  justify-content:center;
  flex-wrap:wrap;
  gap:7px;
  margin:9px 0 10px;
}
.sheet__badge{
  display:inline-flex;
  align-items:center;
  min-height:23px;
  padding:4px 9px;
  border:1px solid transparent;
  border-radius:999px;
  font-size:11px;
  font-weight:700;
  line-height:1;
}
.sheet__badge--ready{
  color:#236961;
  background:rgba(127,196,202,.18);
  border-color:rgba(64,106,112,.16);
}
.sheet__badge--idle{
  color:#788494;
  background:#F2F4F6;
  border-color:#E5E9ED;
}
.sheet__message{
  max-width:320px;
  margin:0 auto 13px!important;
  color:#7B8797!important;
  font-size:12px!important;
  line-height:1.55!important;
}
.sheet__qr{
  width:188px;
  margin:0 auto 14px;
  padding:8px;
  border:1px solid rgba(27,31,60,.08);
  border-radius:16px;
  background:#FAFCFC;
  text-align:center;
}
.sheet__qr img{
  display:block;
  width:170px;
  height:170px;
  margin:0 auto;
  object-fit:contain;
  background:#fff;
  -webkit-touch-callout:default;
  -webkit-user-select:auto;
  user-select:auto;
}
.sheet__qr figcaption{
  margin-top:8px;
  color:#657387;
  font-size:11px;
  line-height:1.35;
}
.sheet__primary[disabled],
.sheet__primary.is-disabled{
  color:#98A2AE;
  background:#E9EDF0;
  box-shadow:none;
  cursor:not-allowed;
}
.sheet__primary[disabled]:active{
  transform:none;
}
@media(max-width:350px){
  .sheet__qr{
    width:168px;
    padding:7px;
  }
  .sheet__qr img{
    width:152px;
    height:152px;
  }
}

/* RONGMEI-MANAGE-V1: consumer sheet only exposes available actions.
   No configuration labels, disabled CTAs or empty QR placeholders are shown. */
.sheet__status,
.sheet__badge{display:none!important}
.sheet__message{max-width:320px;margin:0 auto 13px!important;color:#7B8797!important;font-size:12px!important;line-height:1.55!important}
.sheet__qr{width:min(236px,calc(100vw - 62px));margin:0 auto 14px;padding:10px;border:1px solid rgba(27,31,60,.08);border-radius:16px;background:#FAFCFC;text-align:center}
.sheet__qr img{display:block;width:100%;height:auto;max-height:290px;margin:0 auto;object-fit:contain;background:#fff;-webkit-touch-callout:default;-webkit-user-select:auto;user-select:auto}
.sheet__qr figcaption{margin-top:8px;color:#657387;font-size:11px;line-height:1.45}
.sheet__search-card{max-width:300px;margin:0 auto 14px;padding:12px 14px;border:1px solid rgba(27,31,60,.08);border-radius:14px;color:#40576B;background:#F8FBFB;text-align:center;font-size:14px;font-weight:750;line-height:1.35;word-break:break-all}
.sheet__primary[hidden],
.sheet__secondary[hidden]{display:none!important}
.sheet__primary,.sheet__secondary{min-height:48px}
.sheet__cancel{margin-top:4px!important;color:#8692A0!important}
@media(max-width:350px){.sheet__qr{width:min(212px,calc(100vw - 48px));padding:8px}.sheet__qr img{max-height:250px}}

/* RONGMEI-CARD-NOTICE-A: optional per-card drawer notice. */
p.sheet__notice {
  max-width: 320px;
  margin: 8px auto 11px;
  padding: 9px 11px;
  border: 1px solid rgba(113, 92, 42, .16);
  border-radius: 12px;
  color: #6E5A2A;
  background: #FFF9EA;
  text-align: center;
  font-size: 12px;
  line-height: 1.55;
  white-space: pre-wrap;
  word-break: break-word;
}
.sheet__notice[hidden] { display: none !important; }