
:root{
  --bg:#f5f7fa;
  --surface:#ffffff;
  --surface-2:#f8fafc;
  --surface-3:#eef2f6;
  --text:#0d1117;
  --muted:#667085;
  --muted-2:#98a2b3;
  --border:#e5eaf0;
  --border-strong:#d6dde6;
  --dark:#101317;
  --dark-2:#191d23;
  --success:#168451;
  --danger:#c53a3a;
  --shadow-sm:0 1px 2px rgba(16,24,40,.04),0 3px 10px rgba(16,24,40,.03);
  --shadow:0 14px 36px rgba(16,24,40,.08);
  --radius:18px;
  --radius-sm:12px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  color:var(--text);
  background:
    radial-gradient(circle at 85% 0%,rgba(17,24,39,.045),transparent 25%),
    linear-gradient(180deg,#f8fafc 0,var(--bg) 320px);
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  font-size:15px;
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit}
button,input,select{font:inherit}
button{cursor:pointer}
.container{width:min(1180px,calc(100% - 40px));margin:0 auto;padding:42px 0 64px}
.narrow{max-width:760px}
h1,h2,h3{letter-spacing:-.028em}
h1{font-size:clamp(2rem,3.6vw,2.7rem);line-height:1.08;margin:4px 0 10px}
h2{font-size:1.22rem;margin:0 0 16px}
h3{font-size:1rem;margin:22px 0 12px}
p{margin-top:0}
.muted{color:var(--muted)}
.small{font-size:.875rem}
.eyebrow{
  display:block;
  color:var(--muted);
  font-size:.76rem;
  font-weight:800;
  letter-spacing:.11em;
  text-transform:uppercase;
  margin-bottom:8px;
}

/* Header */
.app-header{
  position:sticky;
  top:0;
  z-index:100;
  background:rgba(16,19,23,.96);
  backdrop-filter:saturate(160%) blur(16px);
  border-bottom:1px solid rgba(255,255,255,.07);
}
.app-header-inner{
  width:min(1380px,calc(100% - 32px));
  min-height:72px;
  margin:0 auto;
  display:grid;
  grid-template-columns:minmax(210px,1fr) auto minmax(300px,1fr);
  align-items:center;
  gap:22px;
}
.brand-lockup{
  display:inline-flex;
  align-items:center;
  gap:11px;
  color:#fff;
  text-decoration:none;
  min-width:0;
}
.brand-mark{
  width:36px;height:36px;border-radius:10px;
  display:grid;place-items:center;
  flex:0 0 auto;
  background:#fff;color:#101317;
  font-weight:900;font-size:.78rem;letter-spacing:-.04em;
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.05);
}
.brand-mark.large{width:46px;height:46px;border-radius:13px;background:#101317;color:#fff}
.brand-copy{display:flex;flex-direction:column;min-width:0}
.brand-copy strong{font-size:.94rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.brand-copy small{color:#8e97a4;font-size:.72rem;margin-top:1px}

.main-nav{display:flex;gap:4px;align-items:center}
.nav-link,.settings-trigger{
  min-height:42px;
  display:inline-flex;
  align-items:center;
  gap:8px;
  border-radius:11px;
  padding:0 13px;
  color:#aab2bd;
  text-decoration:none;
  font-weight:650;
  font-size:.89rem;
  transition:.18s ease;
}
.nav-link:hover,.settings-trigger:hover{background:rgba(255,255,255,.07);color:#fff}
.nav-link.active,.settings-trigger.active{background:#fff;color:#101317}
.nav-icon{width:16px;text-align:center;font-size:.92rem}

.header-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px}
.account-chip{
  display:flex;align-items:center;gap:9px;
  padding:5px 8px 5px 5px;border-radius:12px;
  color:#fff;
}
.account-avatar{
  width:32px;height:32px;border-radius:9px;background:#282d35;
  display:grid;place-items:center;font-size:.76rem;font-weight:800;
}
.account-meta{display:flex;flex-direction:column;line-height:1.15}
.account-meta strong{font-size:.78rem;max-width:105px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.account-meta small{font-size:.67rem;color:#8e97a4;margin-top:3px}
.logout-button{
  text-decoration:none;color:#aab2bd;border:1px solid rgba(255,255,255,.11);
  padding:8px 11px;border-radius:10px;font-size:.8rem;font-weight:700;
}
.logout-button:hover{background:#fff;color:#101317}

/* settings dropdown */
.settings-menu{position:relative}
.settings-menu summary{list-style:none;cursor:pointer}
.settings-menu summary::-webkit-details-marker{display:none}
.chevron{font-size:.8rem;color:#7f8996}
.settings-popover{
  position:absolute;right:0;top:52px;width:260px;
  background:#fff;border:1px solid var(--border);border-radius:16px;
  box-shadow:var(--shadow);padding:8px;color:var(--text);
}
.popover-head{padding:10px 11px 9px;border-bottom:1px solid var(--border);margin-bottom:5px}
.popover-head{display:flex;justify-content:space-between;gap:10px}
.popover-head small{color:var(--muted)}
.settings-popover>a{display:flex;flex-direction:column;text-decoration:none;padding:11px;border-radius:10px}
.settings-popover>a:hover{background:var(--surface-2)}
.settings-popover>a span{font-weight:750;font-size:.88rem}
.settings-popover>a small{color:var(--muted);font-size:.75rem;margin-top:2px}

/* page */
.page-head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;margin-bottom:24px}
.status-pill,.role-badge{
  display:inline-flex;align-items:center;gap:7px;
  border:1px solid var(--border);background:#fff;border-radius:999px;
  padding:7px 11px;font-size:.75rem;font-weight:750;color:#344054;
}
.status-dot{width:7px;height:7px;border-radius:50%;background:#20a468;box-shadow:0 0 0 3px rgba(32,164,104,.12)}
.settings-tabs{display:flex;gap:5px;margin:-6px 0 22px;padding:5px;background:#e9eef3;border-radius:13px;width:max-content}
.settings-tab{padding:8px 13px;border-radius:9px;text-decoration:none;color:var(--muted);font-size:.86rem;font-weight:700}
.settings-tab.active{background:#fff;color:var(--text);box-shadow:var(--shadow-sm)}

/* cards */
.grid{display:grid;gap:18px}
.card{
  background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);
  padding:22px;box-shadow:var(--shadow-sm);
}
.card:hover{border-color:var(--border-strong)}
.metrics,.dashboard-metrics{grid-template-columns:repeat(4,minmax(0,1fr));margin:0 0 18px}
.metric-card{min-width:0;position:relative;overflow:hidden}
.metric-label{display:block;color:var(--muted);font-weight:650;font-size:.82rem}
.metric-card strong{display:block;font-size:clamp(1.6rem,2.6vw,2.2rem);line-height:1.08;letter-spacing:-.045em;margin:10px 0 6px;overflow-wrap:anywhere}
.metric-card small{color:var(--muted);font-size:.78rem}
.metric-card:after{content:"";position:absolute;width:86px;height:86px;border-radius:50%;right:-38px;bottom:-40px;background:#f2f5f8}
.dashboard-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.section-gap{margin-top:18px}
.card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:12px}
.card-head h2{margin:0}
.card-head a{font-size:.8rem;color:var(--muted);font-weight:700;text-decoration:none}
.card-head a:hover{color:var(--text)}

.program-summary{
  margin-top:16px;padding:14px 15px;border:1px solid var(--border);
  background:var(--surface-2);border-radius:13px;display:flex;flex-direction:column;gap:2px;
}
.program-summary span,.program-summary small{color:var(--muted);font-size:.78rem}
.program-summary strong{font-size:.9rem}
.list-row,.reward-row{
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:13px 0;border-bottom:1px solid #eef1f4;
}
.list-row:last-child,.reward-row:last-child{border-bottom:0}
.list-row-right{font-weight:750;text-align:right;white-space:nowrap}

/* forms */
label{display:block;margin:14px 0 6px;font-size:.82rem;font-weight:750;color:#344054}
input,select{
  width:100%;min-height:44px;padding:10px 13px;
  border:1px solid var(--border-strong);border-radius:11px;
  background:#fff;color:var(--text);outline:none;
  transition:border .15s,box-shadow .15s;
}
input::placeholder{color:#a4acb7}
input:focus,select:focus{border-color:#8b96a5;box-shadow:0 0 0 4px rgba(17,24,39,.055)}
button,.button-link{
  min-height:42px;border:0;border-radius:11px;padding:0 15px;
  background:#11151a;color:#fff;font-weight:750;text-decoration:none;
  display:inline-flex;align-items:center;justify-content:center;
  transition:transform .15s,background .15s;
}
button:hover,.button-link:hover{background:#252a31;transform:translateY(-1px)}
.secondary,.secondary-link{background:#eef2f5;color:var(--text)}
.secondary:hover,.secondary-link:hover{background:#e2e7ec}
button:disabled{opacity:.45;cursor:not-allowed;transform:none}
.inline-form,.search-bar{display:flex;align-items:center;gap:9px}
.inline-form input,.search-bar input{flex:1}
.inline-form button,.search-bar button{width:auto}
.quick-add{margin-top:15px;padding-top:15px;border-top:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;gap:16px}
.mode-help,.program-preview{margin-top:12px;padding:13px;border:1px solid var(--border);background:var(--surface-2);border-radius:12px}

/* tables */
.table-wrap{overflow:auto}
table{width:100%;border-collapse:collapse}
th,td{text-align:left;padding:13px 12px;border-bottom:1px solid #edf1f4;vertical-align:middle}
th{font-size:.7rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-weight:800;background:#fafbfc}
tbody tr:hover{background:#fbfcfd}
.customer-table-card{padding:0;overflow:hidden}
.customers-table{min-width:860px}
.row-actions{display:flex;gap:7px;white-space:nowrap}
.small-button{min-height:34px;padding:0 10px;font-size:.78rem}

/* messages */
.alert{padding:12px 14px;border-radius:11px;margin:0 0 16px;font-weight:650;font-size:.87rem}
.alert.success{background:#eef9f2;border:1px solid #d6eedf;color:#17663f}
.alert.error{background:#fff0f0;border:1px solid #f5d4d4;color:#a12b2b}
.positive{color:var(--success)}
.negative{color:var(--danger)}
.empty-state{text-align:center;padding:48px 20px}

/* rewards/customer */
.reward-card{background:linear-gradient(145deg,#11151a,#242a32);border-color:#2d333c;color:#fff;box-shadow:0 16px 34px rgba(16,19,23,.13)}
.reward-card .muted{color:#adb6c2}
.card-link{text-decoration:none;display:block}
.big-points{font-size:2.5rem;font-weight:850;letter-spacing:-.05em;margin:22px 0 8px}
.milestone-card{padding:14px 0;border-bottom:1px solid var(--border)}
.milestone-top{display:flex;justify-content:space-between;gap:14px;align-items:center;margin-bottom:9px}
.progress-track{height:7px;background:#e9edf1;border-radius:999px;overflow:hidden}
.progress-fill{height:100%;background:#11151a;border-radius:999px}
.earned-reward{padding:14px;border-radius:13px;border:1px solid #d6eedf;background:#f1faf5;display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:10px}

/* teams/settings */
.settings-grid{grid-template-columns:1fr 1fr}
.team-layout{grid-template-columns:minmax(290px,390px) 1fr;align-items:start}
.team-member{padding:15px 0;border-bottom:1px solid var(--border)}
.team-member:last-child{border-bottom:0}
.team-member-main{display:flex;justify-content:space-between;align-items:center;gap:12px}
.team-member-meta{color:var(--muted);font-size:.78rem;margin-top:5px}
.team-actions,.inline-action{display:flex;gap:8px;align-items:center}
.team-actions{margin-top:11px;flex-wrap:wrap}
.inline-action select{min-width:125px}
.inline-action button{width:auto}
.permission-card{margin-top:18px}

/* Auth */
.auth-page{
  min-height:100vh;
  display:grid;place-items:center;
  padding:30px;
  background:
    radial-gradient(circle at 50% -10%,rgba(255,255,255,.12),transparent 35%),
    #0f1216;
}
.auth-shell{width:min(430px,100%)}
.auth-brand{display:flex;align-items:center;gap:13px;color:#fff;margin-bottom:18px;padding:0 4px}
.auth-brand>div{display:flex;flex-direction:column}
.auth-brand strong{font-size:1.1rem}
.auth-brand small{color:#8f98a5;font-size:.78rem;margin-top:2px}
.auth-card{padding:28px;box-shadow:0 28px 65px rgba(0,0,0,.28)}
.auth-card h1{font-size:2rem}
.auth-card button{width:100%;margin-top:18px}
.auth-footer{text-align:center;color:#697382;font-size:.72rem;margin-top:16px}

/* misc */
.phone-link{font-weight:inherit}
.page-head + .card{}
.customer-earned{background:#f7faf8}

@media(max-width:1100px){
  .app-header-inner{grid-template-columns:190px 1fr auto}
  .account-meta{display:none}
  .dashboard-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:860px){
  .app-header{position:relative}
  .app-header-inner{grid-template-columns:1fr auto;min-height:auto;padding:13px 0;gap:12px}
  .main-nav{grid-column:1/-1;order:3;overflow-x:auto;padding-bottom:2px}
  .main-nav::-webkit-scrollbar{display:none}
  .account-chip{display:none}
  .dashboard-grid,.settings-grid,.team-layout{grid-template-columns:1fr}
}
@media(max-width:620px){
  .container{width:min(100% - 28px,1180px);padding:28px 0 48px}
  .app-header-inner{width:min(100% - 24px,1380px)}
  .brand-copy small{display:none}
  .header-actions{gap:5px}
  .settings-trigger{padding:0 10px}
  .settings-trigger>span:nth-child(2){display:none}
  .settings-popover{right:-50px}
  .page-head{align-items:flex-start;flex-direction:column}
  .metrics,.dashboard-metrics{grid-template-columns:1fr}
  .inline-form,.search-bar,.quick-add,.team-actions,.inline-action{flex-direction:column;align-items:stretch}
  .inline-form button,.search-bar button,.button-link,.inline-action button{width:100%}
  .card{padding:18px;border-radius:16px}
  .settings-tabs{width:100%}
  .settings-tab{flex:1;text-align:center}
  .logout-button{padding:8px}
}




/* =========================================================
   ÑAPA PUNTOS — FINAL BRAND SYSTEM v1.2
   Official palette supplied by design team.
   ========================================================= */
:root{
  --np-primary:#00583F;
  --np-primary-hover:#004532;
  --np-secondary:#10B96E;
  --np-accent:#38D27F;
  --np-background:#F7FAF8;
  --np-surface:#FFFFFF;
  --np-text:#10231C;
  --np-text-secondary:#61706A;
  --np-border:#DDE7E2;
  --np-success:#16A66A;
  --np-warning:#F4B740;
  --np-error:#DC4C4C;

  --bg:var(--np-background);
  --surface:var(--np-surface);
  --surface-2:#F1F7F4;
  --surface-3:#EAF3EF;
  --text:var(--np-text);
  --muted:var(--np-text-secondary);
  --muted-2:#8A9993;
  --border:var(--np-border);
  --border-strong:#C7D7D0;
  --dark:var(--np-primary);
  --dark-2:var(--np-primary-hover);
  --success:var(--np-success);
  --danger:var(--np-error);
}

body{
  color:var(--np-text);
  background:
    radial-gradient(circle at 88% -5%, rgba(56,210,127,.10), transparent 24%),
    linear-gradient(180deg,#FBFDFC 0,var(--np-background) 330px);
}

/* Navigation */
.app-header{
  background:rgba(0,88,63,.98);
  border-bottom:1px solid rgba(255,255,255,.10);
}
.brand-logo-img{
  width:42px;
  height:42px;
  object-fit:cover;
  border-radius:12px;
  background:#fff;
  padding:0;
  box-shadow:0 3px 14px rgba(0,0,0,.10);
}
.brand-copy strong{color:#fff}
.brand-copy small{color:rgba(255,255,255,.68)}

.nav-link,.settings-trigger{color:rgba(255,255,255,.72)}
.nav-link:hover,.settings-trigger:hover{
  background:rgba(255,255,255,.10);
  color:#fff;
}
.nav-link.active,.settings-trigger.active{
  background:#fff;
  color:var(--np-primary);
  box-shadow:0 8px 18px rgba(0,69,50,.20);
}
.account-avatar{
  background:rgba(255,255,255,.13);
  color:#fff;
}
.account-meta small{color:rgba(255,255,255,.62)}
.logout-button{
  color:rgba(255,255,255,.76);
  border-color:rgba(255,255,255,.20);
}
.logout-button:hover{
  background:#fff;
  color:var(--np-primary);
}

/* Brand accents */
.eyebrow{color:var(--np-secondary)}
.status-dot{
  background:var(--np-secondary);
  box-shadow:0 0 0 3px rgba(16,185,110,.15);
}
.status-pill{
  color:var(--np-primary);
  background:#F0FBF5;
  border-color:#CBEFDD;
}
.role-badge{
  background:var(--np-primary);
  color:#fff;
  border-color:var(--np-primary);
}

/* Cards */
.card{
  border-color:var(--np-border);
  box-shadow:0 8px 24px rgba(0,88,63,.045);
}
.card:hover{
  border-color:#C9DDD4;
  box-shadow:0 12px 30px rgba(0,88,63,.065);
}
.metric-card:after{background:rgba(16,185,110,.06)}
.metric-card strong{color:var(--np-text)}
.metric-label,.metric-card small{color:var(--np-text-secondary)}

/* Buttons / Inputs */
button,.button-link{
  background:var(--np-primary);
  color:#fff;
}
button:hover,.button-link:hover{background:var(--np-primary-hover)}
.secondary,.secondary-link{
  background:#EAF3EF;
  color:var(--np-primary);
}
.secondary:hover,.secondary-link:hover{background:#DDEBE5}
input,select{
  border-color:var(--np-border);
  color:var(--np-text);
}
input:focus,select:focus{
  border-color:var(--np-secondary);
  box-shadow:0 0 0 4px rgba(16,185,110,.10);
}
input::placeholder{color:#98A6A0}

/* Settings / program cards */
.program-summary,.mode-help,.program-preview{
  background:linear-gradient(180deg,#FFFFFF,#F3FAF6);
  border-color:#D7EAE1;
}
.settings-tabs{background:#EAF3EF}
.settings-tab.active{
  color:var(--np-primary);
  background:#fff;
}

/* Loyalty/rewards */
.progress-fill{
  background:linear-gradient(90deg,var(--np-secondary),var(--np-accent));
}
.reward-card{
  background:
    radial-gradient(circle at 85% 18%,rgba(56,210,127,.28),transparent 25%),
    linear-gradient(145deg,#004532,#00583F);
  border-color:#0A6E52;
}
.reward-card .muted{color:#C8DED5}
.earned-reward{
  background:#F1FBF5;
  border-color:#CDEDDC;
}
.earned-reward small{color:var(--np-primary)}

/* Feedback */
.alert.success{
  background:#ECF9F2;
  color:#0A6E47;
  border-color:#CFEEDD;
}
.alert.error{
  background:#FFF1F1;
  color:#A93232;
  border-color:#F2CCCC;
}
.positive{color:var(--np-success)}
.negative{color:var(--np-error)}

/* Tables */
th{background:#F7FAF8;color:var(--np-text-secondary)}
tbody tr:hover{background:#FBFDFC}

/* Auth */
.auth-page{
  background:
    radial-gradient(circle at 50% -10%,rgba(56,210,127,.22),transparent 30%),
    radial-gradient(circle at 105% 100%,rgba(16,185,110,.18),transparent 35%),
    var(--np-primary);
}
.auth-logo-img{
  width:168px;
  height:78px;
  object-fit:contain;
  border-radius:16px;
  background:#fff;
  padding:8px 12px;
  box-shadow:0 16px 38px rgba(0,69,50,.20);
}
.auth-card{
  border-top:3px solid var(--np-secondary);
}
.auth-footer{color:rgba(255,255,255,.58)}

/* Branding manager */
.branding-grid{grid-template-columns:1fr 1fr;align-items:start}
.logo-preview-stage{
  min-height:300px;
  display:grid;
  place-items:center;
  border:1px dashed var(--np-border);
  border-radius:18px;
  background:
    linear-gradient(45deg,#F5F9F7 25%,transparent 25%),
    linear-gradient(-45deg,#F5F9F7 25%,transparent 25%),
    linear-gradient(45deg,transparent 75%,#F5F9F7 75%),
    linear-gradient(-45deg,transparent 75%,#F5F9F7 75%);
  background-size:24px 24px;
  background-position:0 0,0 12px,12px -12px,-12px 0;
}
.logo-preview-stage img{max-width:90%;max-height:220px;object-fit:contain}
.icon-preview img{width:160px;height:160px;object-fit:cover;border-radius:30px}
.wordmark-preview img{max-width:480px}
.brand-note{
  background:#F1FBF5;
  border-color:#D1EDDE;
  color:var(--np-text-secondary);
}

@media(max-width:860px){
  .branding-grid{grid-template-columns:1fr}
}


/* =========================================================
   Ñapa Puntos — Super Admin Dashboard v1.3
   ========================================================= */
.admin-page-head{align-items:center}
.admin-head-actions{display:flex;gap:9px;align-items:center}
.admin-section{margin-top:8px}
.admin-section-gap{margin-top:20px}
.admin-section-title{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:20px;
  margin-bottom:14px;
}
.admin-section-title h2{margin:0;font-size:1.35rem}
.admin-metrics{
  grid-template-columns:repeat(4,minmax(0,1fr));
}
.admin-metric-card{
  min-width:0;
  overflow:hidden;
  position:relative;
  padding:20px;
}
.admin-metric-card strong{
  display:block;
  margin:8px 0 5px;
  font-size:clamp(1.65rem,2.4vw,2.15rem);
  line-height:1.05;
  letter-spacing:-.045em;
  color:var(--np-text);
  overflow-wrap:anywhere;
}
.admin-metric-card small{
  color:var(--np-text-secondary);
  font-size:.77rem;
}
.admin-metric-card:before{
  content:"";
  position:absolute;
  width:70px;
  height:70px;
  border-radius:50%;
  right:-30px;
  bottom:-32px;
  background:rgba(16,185,110,.07);
}
.admin-dashboard-grid{
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
}
.admin-feature-card{min-width:0}
.admin-list-row,
.admin-rank-row,
.admin-activity-row{
  display:flex;
  align-items:center;
  gap:12px;
  padding:13px 0;
  border-bottom:1px solid #EDF3F0;
}
.admin-list-row:last-child,
.admin-rank-row:last-child,
.admin-activity-row:last-child{border-bottom:0}

.admin-list-row{justify-content:space-between}
.admin-list-main,
.business-table-name{
  display:flex;
  align-items:center;
  gap:11px;
  min-width:0;
}
.admin-list-main>div,
.business-table-name>div,
.admin-rank-main,
.admin-activity-main{
  min-width:0;
  display:flex;
  flex-direction:column;
}
.admin-list-main strong,
.business-table-name strong,
.admin-rank-main strong,
.admin-activity-main strong{
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.admin-list-main small,
.business-table-name small,
.admin-rank-main small,
.admin-activity-main small{
  color:var(--np-text-secondary);
  font-size:.75rem;
  margin-top:2px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.business-avatar,
.customer-avatar{
  width:38px;
  height:38px;
  flex:0 0 auto;
  border-radius:11px;
  display:grid;
  place-items:center;
  font-weight:850;
}
.business-avatar{
  background:#E8F7F0;
  color:var(--np-primary);
}
.customer-avatar{
  background:#F3F6F4;
  color:var(--np-text);
}
.small-avatar{
  width:32px;
  height:32px;
  border-radius:9px;
  font-size:.78rem;
}
.business-status{
  display:inline-flex;
  align-items:center;
  min-height:26px;
  padding:0 9px;
  border-radius:999px;
  font-size:.7rem;
  font-weight:800;
}
.business-status.active{
  color:#0B7249;
  background:#EAF9F1;
  border:1px solid #CDEEDC;
}
.business-status.suspended{
  color:#A33434;
  background:#FFF0F0;
  border:1px solid #F2CCCC;
}
.membership-count{
  color:var(--np-text-secondary);
  font-size:.76rem;
  white-space:nowrap;
}
.admin-rank-row{gap:11px}
.rank-number{
  width:28px;
  height:28px;
  flex:0 0 auto;
  display:grid;
  place-items:center;
  border-radius:8px;
  background:#EDF7F2;
  color:var(--np-primary);
  font-weight:850;
  font-size:.75rem;
}
.admin-rank-main{flex:1}
.rank-value{
  font-size:.82rem;
  white-space:nowrap;
}
.activity-dot{
  width:9px;
  height:9px;
  flex:0 0 auto;
  border-radius:50%;
}
.positive-dot{background:var(--np-success)}
.negative-dot{background:var(--np-error)}
.admin-activity-main{flex:1}
.activity-value{font-weight:850;font-size:.83rem}
.admin-business-table-card{padding:0;overflow:hidden}
.admin-business-table{min-width:980px}
.admin-business-table td{padding-top:14px;padding-bottom:14px}
.empty-state.compact{padding:20px}

@media(max-width:1050px){
  .admin-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:820px){
  .admin-dashboard-grid{grid-template-columns:1fr}
  .admin-page-head{align-items:flex-start}
  .admin-head-actions{width:100%}
  .admin-head-actions .button-link{flex:1}
}
@media(max-width:560px){
  .admin-metrics{grid-template-columns:1fr}
  .admin-head-actions{flex-direction:column}
  .admin-head-actions .button-link{width:100%}
  .admin-section-title{align-items:flex-start;flex-direction:column}
}

/* Ñapa Puntos v1.4 — Signup, Trial & Subscription */
.subscription-chip{
  min-height:30px;
  display:inline-flex;
  align-items:center;
  padding:0 10px;
  border-radius:999px;
  text-decoration:none;
  font-size:.7rem;
  font-weight:850;
  border:1px solid rgba(255,255,255,.18);
  color:#fff;
}
.subscription-chip.trial{background:rgba(244,183,64,.16);color:#FFE19A}
.subscription-chip.active{background:rgba(56,210,127,.14);color:#BFF6D8}
.subscription-chip.pending_payment,
.subscription-chip.past_due,
.subscription-chip.suspended{background:rgba(220,76,76,.14);color:#FFD0D0}

.subscription-status{
  display:inline-flex;
  align-items:center;
  min-height:28px;
  padding:0 10px;
  border-radius:999px;
  font-size:.72rem;
  font-weight:850;
  white-space:nowrap;
}
.subscription-status.trial{background:#FFF6DD;color:#9B6A05;border:1px solid #F5E2A7}
.subscription-status.active{background:#E9F9F1;color:#0C754B;border:1px solid #CAECD9}
.subscription-status.pending_payment,
.subscription-status.past_due{background:#FFF0E8;color:#A6531F;border:1px solid #F4D2BD}
.subscription-status.suspended,
.subscription-status.cancelled{background:#FFF0F0;color:#A33434;border:1px solid #F2CCCC}

.signup-page{padding:0}
.signup-shell{
  width:min(1180px,calc(100% - 36px));
  min-height:100vh;
  margin:auto;
  display:grid;
  grid-template-columns:.9fr 1.1fr;
  gap:70px;
  align-items:center;
  padding:60px 0;
}
.signup-brand-side{color:#fff}
.signup-wordmark{
  width:min(310px,80%);
  max-height:110px;
  object-fit:contain;
  object-position:left center;
  background:#fff;
  padding:10px 16px;
  border-radius:18px;
  margin-bottom:34px;
}
.signup-brand-side h1{
  font-size:clamp(2.7rem,5vw,4.8rem);
  line-height:.98;
  letter-spacing:-.055em;
  margin:0 0 18px;
}
.signup-brand-side>p{
  color:#C3D9D1;
  font-size:1.08rem;
  max-width:500px;
}
.signup-benefits{
  display:grid;
  gap:10px;
  margin-top:28px;
  color:#D8EEE6;
  font-weight:650;
}
.signup-card{padding:28px}
.signup-card h2{font-size:1.7rem;margin-bottom:7px}
.form-grid.two{grid-template-columns:1fr 1fr;gap:12px}
.choice-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}
.choice-card{
  margin:0;
  display:flex;
  align-items:flex-start;
  gap:10px;
  padding:14px;
  border:1px solid var(--np-border);
  border-radius:13px;
  cursor:pointer;
  background:#fff;
}
.choice-card:has(input:checked){
  border-color:var(--np-secondary);
  box-shadow:0 0 0 3px rgba(16,185,110,.08);
  background:#F3FBF7;
}
.choice-card input{width:auto;min-height:auto;margin-top:3px}
.choice-card span{display:flex;flex-direction:column}
.choice-card small{color:var(--np-text-secondary);font-size:.75rem;margin-top:3px}
.terms-check{
  display:flex;
  align-items:flex-start;
  gap:9px;
  margin-top:17px;
  font-weight:600;
}
.terms-check input{width:auto;min-height:auto;margin-top:3px}
.signup-card button{width:100%;margin-top:18px}
.signup-login-link{text-align:center;margin:16px 0 0;color:var(--np-text-secondary);font-size:.84rem}
.signup-login-link a{color:var(--np-primary);font-weight:800}

.billing-grid{grid-template-columns:1fr 1fr;align-items:start}
.trial-callout{
  padding:18px;
  border-radius:15px;
  border:1px solid #F0DFAD;
  background:#FFF9E8;
  display:flex;
  flex-direction:column;
  gap:4px;
}
.trial-callout strong{font-size:1.15rem}
.trial-callout span{color:#7A6641;font-size:.86rem}
.active-callout{background:#EEFAF4;border-color:#CFEEDD}
.active-callout span{color:#3F6F5B}
.due-callout{background:#FFF2EA;border-color:#F3D4C1}
.due-callout span{color:#8A5A3C}
.plan-summary-list{margin-top:18px}
.plan-summary-list>div{
  display:flex;
  justify-content:space-between;
  gap:20px;
  padding:12px 0;
  border-bottom:1px solid var(--np-border);
}
.plan-summary-list span{color:var(--np-text-secondary)}
.payment-instructions{
  margin-top:18px;
  padding:14px;
  border-radius:12px;
  border:1px dashed var(--np-border);
  background:#F8FBF9;
  display:flex;
  flex-direction:column;
  gap:4px;
}
.payment-instructions span{color:var(--np-text-secondary);font-size:.8rem}
.admin-email{display:block;margin-top:2px}
.admin-sub-actions{flex-wrap:wrap}
.admin-sub-actions form{margin:0}
.subscription-table{min-width:1050px}

@media(max-width:900px){
  .signup-shell{grid-template-columns:1fr;gap:35px;padding:38px 0}
  .signup-brand-side h1{font-size:3rem}
  .billing-grid{grid-template-columns:1fr}
}
@media(max-width:620px){
  .form-grid.two,.choice-grid{grid-template-columns:1fr}
  .signup-shell{width:min(100% - 24px,1180px)}
  .signup-card{padding:20px}
}
