/* Backend UI Style for Member Frontend Pages */
:root{
  --be-bg:#f3f6fb;
  --be-side:#0d1328;
  --be-card:#ffffff;
  --be-primary:#6d5dfc;
  --be-primary2:#18d4ff;
  --be-text:#1d2740;
  --be-muted:#6b7894;
  --be-border:#e7edf7;
  --be-shadow:0 10px 30px rgba(18,38,63,.07);
  --be-shadow-hover:0 18px 46px rgba(18,38,63,.16);
}
body.pc-page,
body.publish-member-page{
  background:var(--be-bg)!important;
  color:var(--be-text)!important;
  font-family:Arial,"Microsoft YaHei",sans-serif!important;
}
body.pc-page .page-bg,
body.pc-page .ember-layer{display:none!important}

/* page shell */
.member-page-wrap,
.pm-wrap{
  width:min(1220px,94vw)!important;
  margin:28px auto 76px!important;
}
.member-page-wrap{
  display:grid!important;
  grid-template-columns:1.08fr .92fr!important;
  gap:18px!important;
  align-items:start!important;
}
.pm-hero{
  display:grid!important;
  grid-template-columns:1.12fr .88fr!important;
  gap:18px!important;
  margin-bottom:18px!important;
}
.pm-grid{
  display:grid!important;
  grid-template-columns:1.08fr .92fr!important;
  gap:18px!important;
}

/* backend-like cards */
.member-card,
.pm-card{
  background:var(--be-card)!important;
  color:var(--be-text)!important;
  border:1px solid var(--be-border)!important;
  border-radius:18px!important;
  padding:22px!important;
  box-shadow:var(--be-shadow)!important;
  backdrop-filter:none!important;
  overflow:hidden!important;
  position:relative!important;
  transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease!important;
  animation:none!important;
}
.member-card:hover,
.pm-card:hover{
  transform:translateY(-6px)!important;
  box-shadow:var(--be-shadow-hover)!important;
  border-color:rgba(109,93,252,.26)!important;
}
.member-card:before,
.pm-card:before{
  content:""!important;
  position:absolute!important;
  right:-70px!important;
  top:-70px!important;
  width:190px!important;
  height:190px!important;
  border-radius:50%!important;
  background:radial-gradient(circle,rgba(109,93,252,.12),transparent 70%)!important;
  pointer-events:none!important;
}

/* titles */
.member-card h1,
.pm-card h1{
  color:var(--be-text)!important;
  font-size:30px!important;
  line-height:1.18!important;
  margin:0 0 10px!important;
  font-weight:900!important;
}
.member-card h2,
.pm-card h2,
.pm-section-title h2{
  color:var(--be-text)!important;
  font-size:20px!important;
  margin:0!important;
  font-weight:900!important;
}
.member-card p,
.pm-card p{
  color:var(--be-muted)!important;
  line-height:1.75!important;
}
.member-hero-note .big{
  color:var(--be-primary)!important;
  font-size:30px!important;
  font-weight:900!important;
}

/* info blocks */
.member-info-grid{
  display:grid!important;
  grid-template-columns:repeat(2,1fr)!important;
  gap:12px!important;
  margin-top:18px!important;
}
.member-info-grid>div,
.pm-stat,
.pm-rule,
.pm-site,
.tpl-card{
  background:#f8faff!important;
  color:var(--be-text)!important;
  border:1px solid var(--be-border)!important;
  border-radius:14px!important;
  padding:14px!important;
  box-shadow:none!important;
  transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease!important;
}
.member-info-grid>div:hover,
.pm-stat:hover,
.pm-rule:hover,
.pm-site:hover,
.tpl-card:hover{
  transform:translateY(-5px)!important;
  box-shadow:0 14px 34px rgba(18,38,63,.11)!important;
  border-color:rgba(109,93,252,.25)!important;
}
.member-info-grid b,
.pm-rule strong{
  display:block!important;
  color:var(--be-muted)!important;
  font-size:12px!important;
  margin-bottom:6px!important;
}
.member-info-grid span,
.pm-rule span{
  color:var(--be-text)!important;
  font-weight:800!important;
}
.pm-stats{
  display:grid!important;
  grid-template-columns:repeat(3,1fr)!important;
  gap:10px!important;
}
.pm-stat b{
  color:var(--be-primary)!important;
  font-size:26px!important;
  display:block!important;
}
.pm-stat span{color:var(--be-muted)!important}

/* form */
.pm-form{display:grid!important;gap:14px!important}
.pm-row{
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  gap:12px!important;
}
.pm-form label{
  color:var(--be-text)!important;
  font-weight:800!important;
}
.pm-form small{
  display:block!important;
  margin-top:6px!important;
  color:var(--be-muted)!important;
  font-weight:400!important;
}
.pm-input,
.pm-select,
.pm-textarea,
.member-form input{
  width:100%!important;
  border:1px solid var(--be-border)!important;
  border-radius:12px!important;
  background:#fff!important;
  color:var(--be-text)!important;
  padding:11px 12px!important;
  outline:none!important;
  box-shadow:none!important;
  transition:border-color .2s ease,box-shadow .2s ease!important;
}
.pm-textarea{min-height:150px!important}
.pm-input:focus,
.pm-select:focus,
.pm-textarea:focus,
.member-form input:focus{
  border-color:rgba(109,93,252,.55)!important;
  box-shadow:0 0 0 4px rgba(109,93,252,.10)!important;
}

/* buttons */
.member-btn,
.pm-btn{
  min-height:40px!important;
  border:0!important;
  border-radius:12px!important;
  padding:10px 16px!important;
  background:linear-gradient(135deg,var(--be-primary),var(--be-primary2))!important;
  color:#fff!important;
  font-weight:900!important;
  text-decoration:none!important;
  cursor:pointer!important;
  box-shadow:0 10px 24px rgba(109,93,252,.18)!important;
  transition:transform .22s ease,box-shadow .22s ease,opacity .22s ease!important;
}
.member-btn:hover,
.pm-btn:hover{
  transform:translateY(-3px)!important;
  box-shadow:0 18px 38px rgba(109,93,252,.24)!important;
}
.member-btn.secondary,
.pm-btn.secondary{
  background:#fff!important;
  color:var(--be-primary)!important;
  border:1px solid rgba(109,93,252,.22)!important;
  box-shadow:none!important;
}
.pm-btn:disabled{opacity:.45!important;cursor:not-allowed!important;transform:none!important;box-shadow:none!important}
.pm-actions{display:flex!important;gap:10px!important;flex-wrap:wrap!important}

/* labels badges messages */
.pm-section-title{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:12px!important;
  margin-bottom:16px!important;
}
.pm-badge{
  border-radius:999px!important;
  padding:5px 10px!important;
  background:rgba(109,93,252,.10)!important;
  border:1px solid rgba(109,93,252,.18)!important;
  color:var(--be-primary)!important;
  font-size:12px!important;
  font-weight:900!important;
}
.pm-badge.ok{background:rgba(24,212,255,.10)!important;color:#087f99!important;border-color:rgba(24,212,255,.24)!important}
.pm-badge.warn{background:#fff7e2!important;color:#9a6a00!important;border-color:#ffe3a1!important}
.pm-badge.bad{background:#ffeff1!important;color:#b42336!important;border-color:#ffcbd3!important}
.pm-msg,
.member-msg{
  border-radius:12px!important;
  padding:11px 13px!important;
  margin:10px 0!important;
  display:none;
}
.pm-msg.ok,.member-msg.ok{display:block!important;background:#e9fff2!important;color:#16794a!important;border:1px solid #bff0d2!important}
.pm-msg.err,.member-msg.err{display:block!important;background:#fff0f2!important;color:#af263a!important;border:1px solid #ffd0d7!important}

/* preview/table */
.pm-preview{
  min-height:220px!important;
  border-radius:14px!important;
  background:#f8faff!important;
  border:1px dashed #cbd6ea!important;
  padding:16px!important;
  color:var(--be-text)!important;
}
.pm-table{
  width:100%!important;
  border-collapse:separate!important;
  border-spacing:0!important;
  overflow:hidden!important;
  border-radius:14px!important;
  background:#fff!important;
}
.pm-table th{
  background:#f7f9fe!important;
  color:var(--be-muted)!important;
  font-size:13px!important;
  padding:12px!important;
  border-bottom:1px solid var(--be-border)!important;
}
.pm-table td{
  color:var(--be-text)!important;
  padding:12px!important;
  border-bottom:1px solid var(--be-border)!important;
  vertical-align:top!important;
}
.pm-empty{color:var(--be-muted)!important;padding:18px!important;text-align:center!important}

/* layout helpers */
.member-action-card{grid-column:1/-1!important}
.member-top-actions{display:flex!important;gap:10px!important;align-items:center!important}
.member-top-actions a,.member-top-actions button{
  border:1px solid var(--be-border)!important;
  border-radius:12px!important;
  background:#fff!important;
  color:var(--be-primary)!important;
  padding:7px 12px!important;
  text-decoration:none!important;
  font-weight:800!important;
}

@media(max-width:900px){
  .member-page-wrap,.pm-hero,.pm-grid,.pm-row{grid-template-columns:1fr!important}
  .pm-stats,.member-info-grid{grid-template-columns:1fr!important}
}