:root{
  --bg:#07111f;
  --bg-soft:#0a1528;
  --panel:#0d1b31;
  --panel-2:#0f203a;
  --panel-3:#122745;
  --line:rgba(148,163,184,.16);
  --line-strong:rgba(96,165,250,.28);
  --text:#eef4ff;
  --muted:#9fb0cb;
  --blue:#4f8cff;
  --blue-2:#2f6df5;
  --green:#22c55e;
  --red:#ef4444;
  --yellow:#f59e0b;
  --purple:#a855f7;
  --shadow:0 18px 48px rgba(0,0,0,.34);
  --radius:20px;
  --sidebar-w:248px;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;min-height:100%}
body{
  background:radial-gradient(circle at top,rgba(79,140,255,.14),transparent 28%),linear-gradient(180deg,#07111f 0%,#050c17 100%);
  color:var(--text);
  font-family:Inter,Segoe UI,Roboto,Arial,sans-serif;
  line-height:1.45;
  overflow-x:hidden;
}
a{color:inherit}
img{max-width:100%;display:block}
button,input,select,textarea{font:inherit}
code{font-family:ui-monospace,SFMono-Regular,Consolas,monospace}
.app-shell{display:grid;grid-template-columns:var(--sidebar-w) minmax(0,1fr);min-height:100vh}
.main{padding:clamp(14px,2vw,24px);min-width:0}
.sidebar{
  position:sticky;top:0;height:100vh;overflow:auto;
  background:linear-gradient(180deg,rgba(5,12,24,.98),rgba(7,16,31,.97));
  border-right:1px solid var(--line);
  padding:22px 14px 18px;
  z-index:40;
}
.sidebar-backdrop{position:fixed;inset:0;background:rgba(2,6,23,.58);backdrop-filter:blur(4px);opacity:0;pointer-events:none;transition:.2s;z-index:35}
.brand{display:flex;align-items:center;gap:14px;padding:8px 8px 18px;margin-bottom:12px}
.brand-logo{width:42px;height:42px;border-radius:14px;background:linear-gradient(135deg,var(--blue),#715dff);display:grid;place-items:center;font-weight:800;box-shadow:0 10px 28px rgba(79,140,255,.32)}
.brand-title{font-size:16px;font-weight:800;line-height:1.05}
.brand-sub{font-size:12px;color:var(--muted);margin-top:2px}
.nav-block{margin-bottom:14px}
.nav-label{padding:8px 10px 10px;color:#7f93b4;font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}
.nav-link{display:flex;align-items:center;gap:10px;padding:12px 12px;border-radius:15px;color:#dbe7ff;text-decoration:none;border:1px solid transparent;transition:.18s;background:transparent}
.nav-link:hover{background:rgba(255,255,255,.04);border-color:var(--line)}
.nav-link.active{background:linear-gradient(180deg,rgba(19,43,80,.92),rgba(13,31,59,.98));border-color:rgba(79,140,255,.34);box-shadow:inset 0 0 0 1px rgba(79,140,255,.08)}
.dot{width:9px;height:9px;border-radius:999px;display:inline-block;flex:0 0 auto}
.topbar{display:flex;justify-content:space-between;gap:18px;align-items:flex-start;margin-bottom:20px}
.topbar h1{margin:0;font-size:clamp(28px,4vw,40px);line-height:1.06;letter-spacing:-.03em}
.topbar .sub{margin:8px 0 0;color:var(--muted);font-size:clamp(14px,2vw,18px);max-width:760px}
.topbar-actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.topbar-actions > *{min-width:0}
.menu-toggle{display:none}
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  min-height:44px;padding:11px 16px;border-radius:15px;border:1px solid transparent;
  background:linear-gradient(180deg,var(--blue),var(--blue-2));color:#fff;text-decoration:none;font-weight:700;
  box-shadow:0 8px 20px rgba(47,109,245,.26);cursor:pointer;transition:.18s transform,.18s opacity,.18s background;
}
.btn:hover{transform:translateY(-1px)}
.btn.secondary{background:rgba(255,255,255,.05);color:#e5eeff;border-color:var(--line);box-shadow:none}
.btn.secondary:hover{background:rgba(255,255,255,.09)}
.btn.success{background:linear-gradient(180deg,#24c76a,#159f52);color:#04170c}
.btn.warning{background:linear-gradient(180deg,#f7b83a,#ef9b07);color:#2b1700}
.btn.danger{background:linear-gradient(180deg,#ff5e5e,#ef4444)}
.card{
  background:linear-gradient(180deg,rgba(12,24,44,.94),rgba(8,16,30,.98));
  border:1px solid var(--line);border-radius:var(--radius);padding:clamp(14px,1.8vw,18px);box-shadow:var(--shadow);
}
.card-title{font-size:24px;font-weight:800;line-height:1.15;margin:0 0 8px;letter-spacing:-.02em}
.card-sub{margin:0;color:var(--muted);font-size:14px;line-height:1.6}
.metric-label{font-size:13px;color:var(--muted)}
.metric-value{font-size:34px;font-weight:900;line-height:1;margin:8px 0 6px;letter-spacing:-.04em}
.grid-2,.grid-3,.grid-4,.field-grid,.field-grid-2,.field-grid-3,.dashboard-kpis,.dashboard-panels,.module-grid,.module-management-grid,.module-data-grid{display:grid;gap:16px}
.grid-2,.field-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.grid-4,.dashboard-kpis{grid-template-columns:repeat(4,minmax(0,1fr))}
.field-grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.field-grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.module-grid{grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}
.table-wrap{overflow:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--line);border-radius:16px}
table{width:100%;border-collapse:collapse;min-width:620px}
th,td{padding:14px 14px;border-bottom:1px solid rgba(148,163,184,.1);vertical-align:top;text-align:left;font-size:14px}
th{font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:#8ea0bf;background:rgba(255,255,255,.03)}
tr:hover td{background:rgba(255,255,255,.02)}
.forms{display:grid;gap:14px}
.field{display:grid;gap:7px}
.field label{font-size:13px;color:#c9d7ef;font-weight:600}
.field input,.field select,.field textarea,
.field-inline input,.field-inline select,
.auth-card input,.auth-card select,.auth-card textarea,
.landing-body input,.landing-body select,.landing-body textarea{
  width:100%;min-width:0;border:1px solid rgba(148,163,184,.16);border-radius:14px;background:rgba(3,8,17,.45);color:var(--text);
  min-height:46px;padding:0 14px;outline:none;transition:border-color .18s, box-shadow .18s, background .18s;
}
.field textarea,.auth-card textarea{min-height:110px;padding:12px 14px;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus,.field-inline input:focus,.field-inline select:focus{border-color:rgba(79,140,255,.42);box-shadow:0 0 0 4px rgba(79,140,255,.14);background:rgba(8,18,34,.82)}
.field-inline{display:flex;align-items:center;gap:10px;background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:16px;padding:10px 12px;min-width:0}
.field-inline.range-inline{padding-right:16px}
.toolbar-label{font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:#90a3c3;white-space:nowrap}
.toolbar-search{flex:1 1 320px}
.check-inline{display:inline-flex;gap:8px;align-items:center;color:#d5e2fa}
.check-inline input{accent-color:var(--blue)}
.bridge-summary,.kv,.screen-modal-info,.modal-badges,.form-actions,.landing-actions,.hero-actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.bridge-summary > *, .kv > *, .screen-modal-info > *, .modal-badges > *, .form-actions > *, .landing-actions > *, .hero-actions > *{min-width:0}
.status-pill,.soft-pill{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:6px 10px;border-radius:999px;font-size:12px;line-height:1;font-weight:700;border:1px solid var(--line);background:rgba(255,255,255,.04)}
.status-pill.online{color:#c7f7d6;background:rgba(34,197,94,.12);border-color:rgba(34,197,94,.25)}
.status-pill.offline{color:#ffd0d0;background:rgba(239,68,68,.12);border-color:rgba(239,68,68,.24)}
.soft-pill{color:#dbe8ff}
.alert-box{padding:14px 16px;border-radius:16px;border:1px solid var(--line);margin-bottom:16px;background:rgba(255,255,255,.03)}
.alert-box.danger{background:rgba(127,29,29,.24);border-color:rgba(239,68,68,.24);color:#ffd4d4}
.footer-note,.muted{color:var(--muted);font-size:13px}
.brand-inline{display:flex;gap:14px;align-items:center}
.landing-body,.auth-body{min-height:100vh}
.landing-shell{width:min(1280px,calc(100% - 28px));margin:0 auto;padding:24px 0 36px}
.landing-topbar{display:flex;justify-content:space-between;gap:16px;align-items:center;margin-bottom:20px}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(300px,.9fr);gap:18px;align-items:stretch}
.hero-card{padding:24px}
.hero-copy h1{margin:10px 0 14px;font-size:clamp(34px,5.2vw,58px);line-height:1.03;letter-spacing:-.045em}
.hero-copy p{margin:0;color:#d3e0f8;font-size:16px;max-width:720px}
.hero-module-list{display:grid;gap:12px;margin-top:18px}
.hero-module-item{display:flex;gap:12px;align-items:flex-start;padding:12px 0;border-top:1px solid rgba(148,163,184,.12)}
.hero-module-item:first-child{border-top:0;padding-top:0}
.dot.big{width:14px;height:14px;box-shadow:0 0 0 8px rgba(255,255,255,.03)}
.auth-shell{min-height:100vh;display:grid;place-items:center;padding:24px}
.auth-card{width:min(460px,100%);padding:24px}
.section-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:16px}
.compact-head .card-sub{margin-bottom:0}
.feature-card,.premium-form-card,.premium-table-card,.module-hero-card{padding:20px}
.mini-feature-grid,.social-chip-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.mini-feature,.social-chip-card{border:1px solid rgba(148,163,184,.1);border-radius:16px;padding:14px;background:rgba(255,255,255,.03)}
.social-chip-card{text-decoration:none;color:inherit;display:flex;gap:12px;align-items:center}
.social-chip-card:hover{border-color:rgba(79,140,255,.26);transform:translateY(-1px)}
.mini-feature h3,.module-card h3{margin:0 0 6px;font-size:18px}
.module-card{position:relative;overflow:hidden;padding-top:18px}
.module-card-head{display:flex;gap:12px;align-items:center;margin-bottom:10px}
.module-card p{color:var(--muted);min-height:56px}
.module-accent{position:absolute;inset:0 auto auto 0;height:4px;width:100%;opacity:.95}
.module-hero-card{position:relative;overflow:hidden}
.module-hero-card::after{content:'';position:absolute;right:-60px;top:-40px;width:240px;height:240px;border-radius:50%;background:radial-gradient(circle,rgba(79,140,255,.18),transparent 70%)}
.module-hero-top{position:relative;z-index:1;display:flex;justify-content:space-between;gap:16px;align-items:flex-start;margin-bottom:18px}
.module-hero-badge-wrap{display:flex;gap:14px;align-items:flex-start}
.module-icon-dot{width:18px;height:18px;border-radius:999px;margin-top:7px;box-shadow:0 0 0 10px rgba(255,255,255,.03)}
.module-display-name{font-size:30px!important;margin-bottom:8px}
.status-text{text-transform:capitalize}
.device-grid,.screen-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(var(--tile-w,160px),1fr));gap:14px;width:100%}
.screen-wall-tile,.device-card,.screen-device-row{
  width:100%;min-width:0;background:linear-gradient(180deg,rgba(15,31,56,.95),rgba(10,19,35,.98));
  border:1px solid rgba(79,140,255,.16);border-radius:18px;padding:10px;color:var(--text);text-align:left;cursor:pointer;box-shadow:0 10px 24px rgba(0,0,0,.2);transition:.16s transform,.16s border-color;
}
.screen-wall-tile:hover,.device-card:hover{transform:translateY(-2px);border-color:rgba(79,140,255,.34)}
.tile-topline{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px}
.tile-name,.device-name{font-weight:800;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.screen-wall-thumb,.device-thumb{overflow:hidden;border-radius:15px;border:1px solid rgba(148,163,184,.14);background:#030913;aspect-ratio:var(--device-ratio,9/16);display:grid;place-items:center}
.screen-wall-thumb img,.device-thumb img{width:100%;height:100%;object-fit:cover}
.tile-meta,.device-meta{display:grid;gap:4px;margin-top:9px;min-width:0}
.tile-line,.device-line{font-size:12px;line-height:1.38;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tile-line strong,.device-line strong{font-weight:700}
.device-card-empty{display:grid;place-items:center;height:100%;min-height:120px;color:var(--muted)}
.premium-screen .screen-hero{display:flex;justify-content:space-between;gap:18px;align-items:flex-start;margin-bottom:16px}
.premium-toolbar{display:grid;grid-template-columns:minmax(240px,1.6fr) repeat(2,minmax(170px,.8fr)) minmax(220px,1fr) max-content;gap:12px;align-items:center;margin-bottom:16px}
.range-inline{display:grid;grid-template-columns:auto minmax(120px,1fr);align-items:center;column-gap:12px;min-width:0}
.range-inline .toolbar-label{white-space:nowrap}
.range-inline input[type=range]{width:100%;min-width:120px;max-width:100%}
.check-inline{white-space:nowrap;justify-self:start;align-self:center}
.compact-summary{margin-bottom:16px}
.screen-modal[hidden]{display:none}
.screen-modal{position:fixed;inset:0;z-index:1200}
.screen-modal-backdrop{position:absolute;inset:0;background:rgba(3,8,18,.76);backdrop-filter:blur(4px)}
.screen-modal-dialog{position:relative;z-index:1;width:min(94vw,960px);max-height:92vh;overflow:auto;margin:4vh auto;background:linear-gradient(180deg,rgba(12,24,44,.98),rgba(8,16,30,.99));border:1px solid var(--line);border-radius:22px;box-shadow:0 24px 60px rgba(0,0,0,.46);padding:18px}
.screen-modal-close{position:absolute;top:14px;right:14px;width:38px;height:38px;border-radius:999px;border:1px solid var(--line);background:rgba(255,255,255,.05);color:#fff;font-size:24px;cursor:pointer}
.screen-modal-head{display:flex;justify-content:space-between;gap:14px;align-items:flex-start;padding-right:52px;margin-bottom:14px}
.screen-modal-head h3{margin:0 0 6px;font-size:24px}
.device-card-udid{color:var(--muted);font-size:12px;word-break:break-all}
.screen-modal-preview{overflow:hidden;border-radius:18px;border:1px solid rgba(148,163,184,.14);background:#020617;max-height:74vh}
.screen-modal-preview img{width:100%;height:100%;object-fit:contain}
body.modal-open{overflow:hidden}
.bridge-section-head,.module-shell{display:grid;gap:16px}
.kv .soft-pill,.bridge-summary .soft-pill,.bridge-summary .status-pill{backdrop-filter:blur(6px)}
.empty-note.card{display:grid;place-items:center;text-align:center;min-height:160px;color:var(--muted)}
.sidebar-close{display:none}
@media (max-width:1280px){
  .premium-toolbar{grid-template-columns:repeat(2,minmax(220px,1fr));}
  .hero-grid{grid-template-columns:1fr}
}
@media (max-width:1080px){
  .grid-4,.dashboard-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
  .grid-3,.mini-feature-grid,.social-chip-grid{grid-template-columns:1fr}
  .grid-2,.field-grid,.field-grid-2,.field-grid-3,.module-management-grid,.module-data-grid{grid-template-columns:1fr}
  .topbar{flex-direction:column;align-items:flex-start}
}
@media (max-width:980px){
  .app-shell{grid-template-columns:1fr}
  .sidebar{position:fixed;left:0;top:0;bottom:0;width:min(88vw,320px);transform:translateX(-100%);transition:.22s ease;box-shadow:0 20px 50px rgba(0,0,0,.45)}
  body.sidebar-open .sidebar{transform:translateX(0)}
  body.sidebar-open .sidebar-backdrop{opacity:1;pointer-events:auto}
  .sidebar-close{display:inline-flex}
  .menu-toggle{display:inline-flex}
  .premium-screen .screen-hero,.section-head,.module-hero-top,.screen-modal-head,.landing-topbar{flex-direction:column;align-items:flex-start}
  .premium-toolbar{grid-template-columns:1fr}
  .topbar-actions,.landing-actions,.hero-actions,.form-actions{width:100%}
  .topbar-actions .btn,.landing-actions .btn,.hero-actions .btn,.form-actions .btn{flex:1 1 auto}
}
@media (max-width:720px){
  .card,.hero-card,.auth-card,.module-hero-card,.feature-card,.premium-form-card,.premium-table-card{padding:16px}
  .topbar h1{font-size:34px}
  .card-title{font-size:22px}
  .metric-value{font-size:30px}
  .screen-grid,.device-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .field-inline{flex-direction:column;align-items:flex-start}
  .range-inline input[type=range]{width:100%}
  .toolbar-search{flex:1 1 auto}
  table{min-width:560px}
  .table-wrap.mobile-card-wrap{overflow:visible;border:0;background:transparent}
  .mobile-card-table{min-width:0!important;border-collapse:separate;border-spacing:0}
  .mobile-card-table thead{display:none}
  .mobile-card-table,.mobile-card-table tbody,.mobile-card-table tr,.mobile-card-table td{display:block;width:100%}
  .mobile-card-table tbody{display:grid;gap:12px}
  .mobile-card-table tr{overflow:hidden;border:1px solid var(--line);border-radius:18px;background:linear-gradient(180deg,rgba(15,31,56,.96),rgba(10,19,35,.99));box-shadow:0 12px 28px rgba(0,0,0,.22)}
  .mobile-card-table td{display:grid;grid-template-columns:minmax(90px,116px) minmax(0,1fr);gap:12px;align-items:flex-start;padding:12px 14px;border-bottom:1px solid rgba(148,163,184,.1)}
  .mobile-card-table td:last-child{border-bottom:0}
  .mobile-card-table td::before{content:attr(data-label);font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#8ea0bf}
  .mobile-card-table td[data-label='Hành động'],.mobile-card-table td[data-label='Hanh dong']{grid-template-columns:1fr}
  .mobile-card-table td[data-label='Hành động']::before,.mobile-card-table td[data-label='Hanh dong']::before{margin-bottom:2px}
  .mobile-card-table td .btn{width:100%}
  .mobile-card-table td input,.mobile-card-table td select,.mobile-card-table td textarea{width:100%}
}
@media (max-width:520px){
  .screen-grid,.device-grid,.grid-4,.dashboard-kpis{grid-template-columns:1fr}
  .brand{padding-top:4px}
  .topbar h1{font-size:30px}
  .tile-topline{align-items:flex-start;flex-direction:column}
  .screen-modal-dialog{width:min(96vw,96vw);margin:2vh auto;padding:14px}
  .topbar-actions{display:grid;grid-template-columns:1fr 1fr;width:100%}
  .topbar-actions .soft-pill{grid-column:1 / -1;justify-content:flex-start}
  .topbar-actions .btn{width:100%}
  .landing-actions,.hero-actions,.form-actions{display:grid;grid-template-columns:1fr}
  .table-wrap{border-radius:14px}
}

/* landing commerce index */
.commerce-body{
  background:
    radial-gradient(circle at top left, rgba(79,140,255,.16), transparent 26%),
    radial-gradient(circle at top right, rgba(168,85,247,.12), transparent 24%),
    linear-gradient(180deg,#07111f 0%,#050c17 100%);
}
.landing-topbar-wide{
  gap:18px;
  margin-bottom:24px;
}
.landing-section{
  margin-top:22px;
}
.landing-section-head{
  margin-bottom:16px;
}
.soft-pill-accent{
  background:rgba(79,140,255,.16);
  border-color:rgba(79,140,255,.24);
  color:#dce8ff;
}
.commerce-hero{
  display:grid;
  grid-template-columns:minmax(0,1.25fr) minmax(320px,.88fr);
  gap:20px;
  padding:30px;
  overflow:hidden;
  position:relative;
}
.commerce-hero::before{
  content:'';
  position:absolute;
  inset:auto -120px -140px auto;
  width:360px;
  height:360px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(79,140,255,.16), transparent 70%);
  pointer-events:none;
}
.commerce-hero-copy,
.commerce-hero-side{position:relative;z-index:1}
.commerce-hero-copy h1{
  margin:12px 0 14px;
  font-size:clamp(38px,5vw,66px);
  line-height:1.02;
  letter-spacing:-.05em;
  max-width:820px;
}
.commerce-hero-copy p{
  margin:0;
  max-width:760px;
  color:#d7e4f8;
  font-size:16px;
  line-height:1.7;
}
.commerce-hero-actions{margin-top:20px}
.commerce-bullets{
  display:grid;
  gap:12px;
  margin-top:22px;
}
.commerce-bullet{
  display:flex;
  align-items:flex-start;
  gap:12px;
  padding:14px 16px;
  border-radius:18px;
  background:rgba(255,255,255,.035);
  border:1px solid rgba(148,163,184,.12);
}
.commerce-bullet strong{
  width:28px;
  height:28px;
  flex:0 0 auto;
  display:grid;
  place-items:center;
  border-radius:999px;
  background:linear-gradient(180deg,var(--blue),var(--blue-2));
  box-shadow:0 10px 22px rgba(47,109,245,.24);
}
.hero-stat-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
}
.hero-stat-card{
  padding:18px;
  border-radius:18px;
  border:1px solid rgba(148,163,184,.12);
  background:rgba(255,255,255,.035);
  min-height:122px;
}
.hero-stat-card .metric-value{margin-top:12px}
.commerce-highlight{
  margin-top:14px;
  padding:18px;
  border-radius:22px;
  background:linear-gradient(180deg,rgba(16,33,60,.92),rgba(10,20,37,.96));
}
.catalog-grid{
  display:grid;
  gap:16px;
}
.software-grid{
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
}
.resource-grid{
  grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
}
.catalog-card{
  position:relative;
  overflow:hidden;
  padding:22px;
}
.catalog-card::after{
  content:'';
  position:absolute;
  inset:0 auto auto 0;
  width:100%;
  height:3px;
  background:linear-gradient(90deg,rgba(79,140,255,.95),rgba(168,85,247,.92));
  opacity:.94;
}
.catalog-badge{
  display:inline-flex;
  align-items:center;
  min-height:28px;
  padding:6px 10px;
  border-radius:999px;
  margin-bottom:14px;
  font-size:12px;
  font-weight:800;
  letter-spacing:.06em;
  text-transform:uppercase;
  background:rgba(79,140,255,.12);
  border:1px solid rgba(79,140,255,.2);
  color:#dbe7ff;
}
.catalog-card h3{
  margin:0 0 10px;
  font-size:24px;
  line-height:1.14;
}
.catalog-card p{
  margin:0;
  color:var(--muted);
  line-height:1.7;
}
.catalog-list{
  display:grid;
  gap:10px;
  margin:18px 0 0;
  padding:0;
  list-style:none;
}
.catalog-list li{
  position:relative;
  padding-left:18px;
  color:#dbe7ff;
}
.catalog-list li::before{
  content:'';
  position:absolute;
  left:0;
  top:.55em;
  width:8px;
  height:8px;
  border-radius:999px;
  background:linear-gradient(180deg,var(--blue),var(--purple));
}
.catalog-actions{
  margin-top:18px;
}
.catalog-tags{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:18px;
}
.resource-link{
  display:inline-flex;
  margin-top:18px;
  color:#dbe7ff;
  text-decoration:none;
  font-weight:700;
}
.resource-link:hover{text-decoration:underline}
.dual-section-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:16px;
}
.info-panel{padding:22px}
.info-platform-list{margin-top:18px}
.step-list{
  display:grid;
  gap:12px;
  margin-top:18px;
}
.step-item{
  display:flex;
  gap:14px;
  align-items:flex-start;
  padding:14px;
  border-radius:18px;
  background:rgba(255,255,255,.035);
  border:1px solid rgba(148,163,184,.12);
}
.step-number{
  width:38px;
  height:38px;
  flex:0 0 auto;
  display:grid;
  place-items:center;
  border-radius:14px;
  background:linear-gradient(180deg,rgba(79,140,255,.98),rgba(47,109,245,.95));
  font-weight:800;
  box-shadow:0 10px 22px rgba(47,109,245,.24);
}
.cta-banner{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:18px;
  padding:26px;
}
.cta-actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  align-items:center;
}
@media (max-width:1280px){
  .commerce-hero{grid-template-columns:1fr}
}
@media (max-width:980px){
  .hero-stat-grid,.dual-section-grid{grid-template-columns:1fr}
  .cta-banner{flex-direction:column;align-items:flex-start}
}
@media (max-width:720px){
  .commerce-hero{padding:18px}
  .commerce-hero-copy h1{font-size:40px}
  .catalog-card,.info-panel,.cta-banner{padding:18px}
}
@media (max-width:520px){
  .commerce-bullet{padding:12px 14px}
  .commerce-hero-copy h1{font-size:34px}
  .hero-stat-grid{grid-template-columns:1fr}
  .cta-actions{display:grid;grid-template-columns:1fr;width:100%}
  .cta-actions .btn{width:100%}
}

/* Member storefront dashboard */
.member-body{
  margin:0;
  min-height:100vh;
  background:
    radial-gradient(circle at top left, rgba(79,140,255,.18), transparent 28%),
    radial-gradient(circle at 100% 0, rgba(139,92,246,.18), transparent 32%),
    #06111f;
  color:#eef4ff;
}
.member-shell{
  min-height:100vh;
  display:grid;
  grid-template-columns:260px minmax(0,1fr);
}
.member-sidebar{
  position:sticky;
  top:0;
  align-self:start;
  min-height:100vh;
  padding:24px 18px;
  border-right:1px solid rgba(148,163,184,.12);
  background:linear-gradient(180deg,rgba(9,17,30,.98),rgba(7,15,28,.94));
}
.member-brand{
  display:flex;
  align-items:center;
  gap:12px;
  padding:10px 8px 18px;
}
.member-brand-mark{
  width:48px;
  height:48px;
  border-radius:16px;
  display:grid;
  place-items:center;
  font-weight:900;
  background:linear-gradient(180deg,#76a7ff,#8a63ff);
  color:#fff;
  box-shadow:0 12px 24px rgba(76,99,255,.32);
}
.member-brand strong{display:block;font-size:16px;letter-spacing:.04em}
.member-brand span{display:block;color:var(--muted);font-size:13px;margin-top:4px}
.member-nav{display:grid;gap:8px;margin-top:18px}
.member-nav-label{
  margin-top:12px;
  color:#8b7ee9;
  text-transform:uppercase;
  letter-spacing:.08em;
  font-size:11px;
  font-weight:800;
}
.member-nav-link{
  display:flex;
  align-items:center;
  gap:10px;
  text-decoration:none;
  color:#dce7ff;
  min-height:46px;
  padding:0 14px;
  border-radius:16px;
  border:1px solid transparent;
  background:rgba(255,255,255,.02);
}
.member-nav-link:hover,.member-nav-link.active{
  background:linear-gradient(180deg,rgba(118,167,255,.18),rgba(124,58,237,.15));
  border-color:rgba(118,167,255,.24);
}
.member-side-robot{
  margin-top:28px;
  padding:18px;
  border-radius:24px;
  background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.025));
  border:1px solid rgba(148,163,184,.14);
  color:#cfe0ff;
}
.member-robot-face{
  position:relative;
  margin:0 auto 14px;
  width:120px;
  height:120px;
  border-radius:36px;
  background:linear-gradient(180deg,#f8fafc,#dbeafe);
  display:flex;
  align-items:center;
  justify-content:center;
  gap:16px;
}
.member-robot-face::before{
  content:'';
  position:absolute;
  inset:24px 18px 38px;
  border-radius:26px;
  background:#111827;
}
.member-robot-face span{
  position:relative;
  width:14px;
  height:30px;
  border-radius:999px;
  background:linear-gradient(180deg,#38bdf8,#2563eb);
  box-shadow:0 0 12px rgba(56,189,248,.65);
}
.member-side-robot p{margin:0;color:#cbd5e1;line-height:1.65;font-size:13px;text-align:center}
.member-side-user{display:block;margin-top:12px;color:#94a3b8;text-align:center}
.member-sidebar-actions{display:grid;gap:10px;margin-top:14px}
.member-sidebar-btn{display:flex;align-items:center;justify-content:center;min-height:42px;padding:0 14px;border-radius:14px;text-decoration:none;font-weight:700;border:1px solid rgba(148,163,184,.18);background:rgba(255,255,255,.04);color:#e2e8f0;transition:all .18s ease}
.member-sidebar-btn:hover{transform:translateY(-1px);background:rgba(255,255,255,.08);border-color:rgba(148,163,184,.28)}
.member-sidebar-btn--logout{background:linear-gradient(180deg,rgba(239,68,68,.18),rgba(153,27,27,.18));border-color:rgba(248,113,113,.28);color:#fee2e2}
.member-sidebar-btn--logout:hover{background:linear-gradient(180deg,rgba(239,68,68,.24),rgba(153,27,27,.24));border-color:rgba(248,113,113,.4)}
.member-main{padding:24px;display:grid;gap:18px;align-content:start;grid-auto-rows:max-content}
.member-topbar{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(280px,320px) auto;
  gap:16px;
  align-items:center;
}
.member-topbar-copy h1{margin:0;font-size:34px;line-height:1.08;letter-spacing:-.03em}
.member-topbar-copy p{margin:8px 0 0;color:var(--muted);max-width:760px}
.member-search{
  display:flex;
  align-items:center;
  gap:10px;
  padding:10px 12px;
  border-radius:18px;
  border:1px solid rgba(118,167,255,.2);
  background:rgba(89,112,186,.15);
}
.member-search input{
  width:100%;
  background:transparent;
  border:0;
  color:#fff;
  outline:none;
  font-size:15px;
}
.member-search input::placeholder{color:#d0dcff}
.member-search button{
  width:42px;
  height:42px;
  border-radius:14px;
  border:0;
  cursor:pointer;
  background:rgba(255,255,255,.1);
  color:#fff;
}
.member-avatar{
  width:54px;
  height:54px;
  border-radius:18px;
  display:grid;
  place-items:center;
  font-weight:900;
  background:linear-gradient(180deg,#eaf7d8,#d9f99d);
  color:#243119;
  border:1px solid rgba(217,249,157,.38);
}
.member-kpis{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:16px;
}
.member-kpi-card{
  padding:22px;
  border-radius:24px;
  border:1px solid rgba(148,163,184,.14);
  background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.03));
  box-shadow:0 24px 48px rgba(0,0,0,.16);
}
.member-kpi-label{font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:#b5c6ef;font-weight:700}
.member-kpi-value{margin-top:12px;font-size:32px;line-height:1.05;font-weight:900;letter-spacing:-.03em}
.member-kpi-sub{margin-top:8px;color:#cbd5e1;line-height:1.6}
.accent-wallet{background:linear-gradient(180deg,rgba(84,208,160,.16),rgba(255,255,255,.04))}
.accent-pending{background:linear-gradient(180deg,rgba(249,115,22,.16),rgba(255,255,255,.04))}
.accent-order{background:linear-gradient(180deg,rgba(139,92,246,.18),rgba(255,255,255,.04))}
.accent-platform{background:linear-gradient(180deg,rgba(59,130,246,.18),rgba(255,255,255,.04))}
.member-banner{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:18px;
  padding:24px;
}
.member-banner h2{margin:14px 0 10px;font-size:30px;line-height:1.08}
.member-banner p{margin:0;color:#cbd5e1;max-width:760px;line-height:1.7}
.member-section{display:grid;gap:14px}
.member-section-head{display:flex;justify-content:center;align-items:center;margin:6px 0 2px}
.member-section-head h2{margin:0;font-size:24px;text-align:center}
.member-card-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:18px;
}
.member-product-card{
  padding:18px;
  border-radius:22px;
  border:1px solid rgba(118,167,255,.16);
  background:linear-gradient(180deg,rgba(8,19,35,.98),rgba(10,20,37,.94));
  box-shadow:0 24px 48px rgba(0,0,0,.18);
}
.member-product-preview{
  position:relative;
  overflow:hidden;
  height:190px;
  border-radius:18px;
  border:1px solid rgba(148,163,184,.14);
  background:
    linear-gradient(135deg, rgba(59,130,246,.18), rgba(17,24,39,.1)),
    radial-gradient(circle at 15% 15%, rgba(96,165,250,.5), transparent 18%),
    #0b1220;
  display:grid;
  place-items:center;
}
.member-preview-screen{
  width:84%;
  height:70%;
  border-radius:12px;
  border:1px solid rgba(96,165,250,.32);
  background:
    linear-gradient(180deg, rgba(37,99,235,.96) 0 14%, rgba(17,24,39,.96) 14% 100%);
  box-shadow:0 12px 26px rgba(7,12,30,.45);
  position:relative;
}
.member-preview-screen::before{
  content:'';
  position:absolute;
  inset:22px 20px 18px;
  border-radius:10px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02)),
    repeating-linear-gradient(180deg, rgba(148,163,184,.08), rgba(148,163,184,.08) 1px, transparent 1px, transparent 26px);
}
.member-preview-tag{
  position:absolute;
  top:14px;
  left:14px;
  padding:7px 10px;
  border-radius:999px;
  background:rgba(124,58,237,.68);
  color:#fff;
  font-size:12px;
  font-weight:800;
  letter-spacing:.04em;
  border:1px solid rgba(255,255,255,.18);
}
.member-product-card h3{
  margin:16px 0 8px;
  font-size:20px;
  line-height:1.28;
}
.member-price{
  color:#9d7bff;
  font-size:19px;
  font-weight:800;
  margin-bottom:10px;
}
.member-product-card p{margin:0;color:#cbd5e1;line-height:1.65;min-height:76px}
.member-buy-form{margin-top:16px;display:flex}
.member-buy-form .btn{width:100%;justify-content:center}
.member-resource-card{min-height:100%}
.member-resource-head{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:8px}
.member-wallet-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.member-wallet-card{padding:24px}
.member-bank-box,.member-note-box{
  margin:16px 0;
  padding:16px 18px;
  border-radius:18px;
  border:1px solid rgba(148,163,184,.14);
  background:rgba(255,255,255,.035);
  line-height:1.7;
}
.member-deposit-form .field-grid-2{margin-bottom:16px}
.status-pill.pending{background:rgba(249,115,22,.14);border-color:rgba(249,115,22,.26);color:#fed7aa}
.status-pill.approved{background:rgba(34,197,94,.14);border-color:rgba(34,197,94,.28);color:#bbf7d0}
.status-pill.rejected{background:rgba(248,113,113,.16);border-color:rgba(248,113,113,.28);color:#fecaca}
.finance-main .alert-box{margin-bottom:16px}
.finance-panels .card,.finance-kpis .metric-card{min-height:100%}
.finance-manual-card .summary-list{margin-top:10px}
@media (max-width:1320px){
  .member-kpis,.member-card-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
  .member-topbar{grid-template-columns:1fr;}
}
@media (max-width:980px){
  .member-shell{grid-template-columns:1fr}
  .member-sidebar{position:relative;min-height:auto;border-right:0;border-bottom:1px solid rgba(148,163,184,.12)}
  .member-wallet-grid,.member-banner{grid-template-columns:1fr;display:grid}
}
@media (max-width:720px){
  .member-main{padding:16px}
  .member-kpis,.member-card-grid,.member-wallet-grid{grid-template-columns:1fr}
  .member-topbar-copy h1{font-size:28px}
  .member-product-preview{height:170px}
}


.member-inline-note{margin:10px 0 0;color:#94a3b8;font-size:13px;line-height:1.6}
.btn.sm{padding:8px 12px;font-size:13px;border-radius:12px}
.payment-qr-modal[hidden]{display:none}
.payment-qr-modal{position:fixed;inset:0;z-index:1300}
.payment-qr-backdrop{position:absolute;inset:0;background:rgba(2,6,23,.76);backdrop-filter:blur(5px)}
.payment-qr-dialog{position:relative;z-index:1;width:min(94vw,980px);max-height:92vh;overflow:auto;margin:4vh auto;background:linear-gradient(180deg,rgba(12,24,44,.98),rgba(8,16,30,.99));border:1px solid rgba(148,163,184,.16);border-radius:24px;box-shadow:0 28px 64px rgba(0,0,0,.46);padding:20px}
.payment-qr-close{position:absolute;top:14px;right:14px;width:40px;height:40px;border-radius:999px;border:1px solid rgba(148,163,184,.24);background:rgba(255,255,255,.05);color:#fff;font-size:24px;cursor:pointer}
.payment-qr-grid{display:grid;grid-template-columns:minmax(280px,360px) minmax(0,1fr);gap:18px;align-items:start}
.payment-qr-preview{padding:18px;border-radius:22px;background:rgba(255,255,255,.05);border:1px solid rgba(148,163,184,.14)}
.payment-qr-preview img{display:block;width:100%;height:auto;border-radius:18px;background:#fff;padding:10px}
.payment-qr-state{display:flex;gap:14px;align-items:center;padding:16px 18px;border-radius:20px;border:1px solid rgba(148,163,184,.14);background:rgba(255,255,255,.05);margin-top:4px;margin-bottom:14px;transition:all .24s ease}
.payment-qr-state-icon{position:relative;flex:0 0 58px;width:58px;height:58px;border-radius:999px;display:grid;place-items:center;background:rgba(15,23,42,.66);border:1px solid rgba(148,163,184,.18);overflow:hidden}
.payment-qr-state-ring{position:absolute;inset:10px;border-radius:999px;border:3px solid rgba(96,165,250,.28);border-top-color:#60a5fa;animation:qr-spin 1s linear infinite}
.payment-qr-state-check{position:relative;display:block;width:24px;height:14px;border-left:4px solid transparent;border-bottom:4px solid transparent;transform:rotate(-45deg) scale(.7);opacity:0;transition:all .24s ease}
.payment-qr-state-copy{display:grid;gap:6px}
.payment-qr-state-copy strong{font-size:16px;color:#f8fafc}
.payment-qr-state-copy span{line-height:1.6;color:#cbd5e1}
.payment-qr-autoclose{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:#bfdbfe}
.payment-qr-state.success{border-color:rgba(34,197,94,.34);background:linear-gradient(180deg,rgba(9,46,29,.95),rgba(8,32,20,.96))}
.payment-qr-state.success .payment-qr-state-icon{background:rgba(11,77,46,.45);border-color:rgba(34,197,94,.34)}
.payment-qr-state.success .payment-qr-state-ring{display:none}
.payment-qr-state.success .payment-qr-state-check{width:24px;height:12px;border-left-color:#dcfce7;border-bottom-color:#dcfce7;opacity:1;transform:rotate(-45deg) scale(1)}
.payment-qr-state.success .payment-qr-state-copy span{color:#d1fae5}
.payment-qr-state.expired{border-color:rgba(251,191,36,.34);background:linear-gradient(180deg,rgba(64,40,6,.94),rgba(42,25,5,.96))}
.payment-qr-state.expired .payment-qr-state-icon{background:rgba(120,53,15,.3);border-color:rgba(251,191,36,.34)}
.payment-qr-state.expired .payment-qr-state-ring{display:none}
.payment-qr-state.expired .payment-qr-state-check{opacity:1;width:20px;height:20px;transform:none}
.payment-qr-state.expired .payment-qr-state-check::before,.payment-qr-state.expired .payment-qr-state-check::after{content:'';position:absolute;left:9px;top:0;width:3px;height:20px;border-radius:999px;background:#fde68a}
.payment-qr-state.expired .payment-qr-state-check::before{transform:rotate(45deg)}
.payment-qr-state.expired .payment-qr-state-check::after{transform:rotate(-45deg)}
.payment-qr-state.expired .payment-qr-state-copy span{color:#fde68a}
.payment-qr-summary{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:12px}
.payment-qr-summary div{padding:14px 16px;border-radius:16px;background:rgba(255,255,255,.04);border:1px solid rgba(148,163,184,.12)}
.payment-qr-summary span{display:block;font-size:12px;letter-spacing:.04em;text-transform:uppercase;color:#94a3b8;margin-bottom:6px}
.payment-qr-summary strong{display:block;font-size:15px;line-height:1.6;color:#fff;word-break:break-word}
.payment-qr-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}
.payment-qr-note{margin-top:14px}
#payment-status{color:#f8fafc}
@media (max-width:900px){
  .payment-qr-grid,.payment-qr-summary{grid-template-columns:1fr}
  .payment-qr-dialog{width:min(96vw,96vw);margin:2vh auto;padding:16px}
}


.btn.disabled,.btn[aria-disabled="true"],.btn[disabled]{pointer-events:none;opacity:.58;filter:saturate(.72)}
.member-toast-stack{position:fixed;top:20px;right:20px;z-index:1500;display:grid;gap:10px;width:min(92vw,360px)}
.member-toast{transform:translateY(-8px);opacity:0;padding:14px 16px;border-radius:18px;border:1px solid rgba(148,163,184,.18);background:rgba(15,23,42,.96);box-shadow:0 18px 40px rgba(0,0,0,.3);transition:all .24s ease;color:#e5eefc}
.member-toast.show{transform:translateY(0);opacity:1}
.member-toast strong{display:block;font-size:13px;letter-spacing:.04em;text-transform:uppercase;margin-bottom:6px}
.member-toast span{display:block;line-height:1.5;color:#d6e2fb}
.member-toast.success{border-color:rgba(34,197,94,.28);background:linear-gradient(180deg,rgba(8,35,22,.96),rgba(10,24,18,.97))}
.payment-qr-note.success{border-color:rgba(34,197,94,.28);background:rgba(34,197,94,.12);color:#dcfce7}
.payment-qr-note.warning{border-color:rgba(251,191,36,.28);background:rgba(251,191,36,.12);color:#fef3c7}
.payment-qr-success{margin-top:14px;padding:14px 16px;border-radius:18px;border:1px solid rgba(34,197,94,.28);background:linear-gradient(180deg,rgba(12,59,34,.95),rgba(8,34,22,.95));color:#ecfdf5}
.payment-qr-success strong{display:block;margin-bottom:6px;font-size:15px}
.payment-qr-success span{display:block;color:#d1fae5;line-height:1.6}
#payment-status.status-pill{display:inline-flex}

@keyframes qr-spin{to{transform:rotate(360deg)}}

/* storefront v2 index */
.storefront-shell{display:grid;gap:22px}
.storefront-topbar{
  display:grid;
  grid-template-columns:auto 1fr auto;
  gap:18px;
  align-items:center;
  padding:18px 22px;
  margin-bottom:0;
}
.storefront-nav{
  display:flex;
  justify-content:center;
  flex-wrap:wrap;
  gap:16px;
}
.storefront-nav a{
  color:#dce8ff;
  text-decoration:none;
  font-weight:700;
  font-size:14px;
}
.storefront-nav a:hover{color:#fff}
.storefront-actions{justify-content:flex-end}
.storefront-hero{
  display:grid;
  grid-template-columns:minmax(0,1.18fr) minmax(320px,.92fr);
  gap:22px;
  padding:34px;
  position:relative;
  overflow:hidden;
}
.storefront-hero::before{
  content:'';
  position:absolute;
  right:-120px;
  top:-90px;
  width:340px;
  height:340px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(79,140,255,.2), transparent 70%);
}
.storefront-hero::after{
  content:'';
  position:absolute;
  left:-100px;
  bottom:-140px;
  width:320px;
  height:320px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(168,85,247,.12), transparent 72%);
}
.storefront-copy,.storefront-stack{position:relative;z-index:1}
.storefront-copy h1{
  margin:14px 0 14px;
  font-size:clamp(40px,5.4vw,72px);
  line-height:1.01;
  letter-spacing:-.055em;
  max-width:860px;
}
.storefront-copy p{
  margin:0;
  max-width:760px;
  color:#d7e4f8;
  font-size:16px;
  line-height:1.75;
}
.storefront-hero-actions{margin-top:22px}
.storefront-points{display:grid;gap:12px;margin-top:24px}
.storefront-point{
  display:flex;
  gap:14px;
  align-items:flex-start;
  padding:14px 16px;
  border-radius:18px;
  border:1px solid rgba(148,163,184,.12);
  background:rgba(255,255,255,.035);
}
.storefront-point strong{
  width:40px;
  height:40px;
  display:grid;
  place-items:center;
  border-radius:14px;
  background:linear-gradient(180deg,var(--blue),var(--purple));
  box-shadow:0 10px 22px rgba(47,109,245,.22);
}
.storefront-stack{display:grid;gap:14px}
.storefront-metrics{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
}
.storefront-metric{
  min-height:128px;
  padding:18px;
  border-radius:20px;
  border:1px solid rgba(148,163,184,.12);
  background:rgba(255,255,255,.035);
}
.storefront-metric .metric-value{margin-top:12px}
.storefront-panel{
  padding:20px;
  border-radius:22px;
  border:1px solid rgba(148,163,184,.12);
  background:linear-gradient(180deg,rgba(16,33,60,.92),rgba(10,20,37,.96));
}
.storefront-panel-soft{background:linear-gradient(180deg,rgba(12,23,42,.86),rgba(9,17,31,.95))}
.storefront-panel-top{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:14px}
.storefront-panel h2{margin:0 0 10px;font-size:22px;line-height:1.2}
.storefront-panel p{margin:0;color:var(--muted);line-height:1.7}
.storefront-kv-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
  margin-top:16px;
}
.storefront-kv-grid div{
  padding:12px 14px;
  border-radius:16px;
  background:rgba(255,255,255,.035);
  border:1px solid rgba(148,163,184,.1);
}
.storefront-kv-grid span{display:block;color:#96a8c5;font-size:12px;text-transform:uppercase;letter-spacing:.08em}
.storefront-kv-grid strong{display:block;margin-top:6px;font-size:20px}
.storefront-flow{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}
.storefront-flow span{
  display:inline-flex;
  align-items:center;
  min-height:36px;
  padding:8px 12px;
  border-radius:999px;
  background:rgba(255,255,255,.05);
  border:1px solid rgba(148,163,184,.12);
  font-weight:700;
}
.storefront-strip{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
}
.storefront-strip-card{padding:22px}
.storefront-strip-card h3{margin:14px 0 8px;font-size:22px;line-height:1.15}
.storefront-strip-card p{margin:0;color:var(--muted);line-height:1.7}
.storefront-catalog{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:16px;
}
.storefront-card{padding:24px;position:relative;overflow:hidden}
.storefront-card::after{
  content:'';
  position:absolute;
  inset:0 auto auto 0;
  width:100%;
  height:3px;
  background:linear-gradient(90deg,rgba(79,140,255,.95),rgba(168,85,247,.9));
  opacity:.96;
}
.storefront-card-head{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:14px}
.storefront-price-tag{
  display:inline-flex;
  align-items:center;
  min-height:28px;
  padding:6px 10px;
  border-radius:999px;
  font-size:12px;
  font-weight:800;
  letter-spacing:.06em;
  text-transform:uppercase;
  background:rgba(255,255,255,.05);
  border:1px solid rgba(148,163,184,.14);
  color:#f4f7ff;
}
.storefront-product-card h3,
.storefront-resource-card h3,
.storefront-advantage-card h3{margin:0 0 10px;font-size:24px;line-height:1.15}
.storefront-product-card p,
.storefront-resource-card p,
.storefront-advantage-card p{margin:0;color:var(--muted);line-height:1.7}
.storefront-list{margin-top:18px}
.storefront-card-actions{margin-top:20px}
.storefront-resource-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
}
.storefront-tags{margin-top:18px}
.storefront-system-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:16px;
}
.storefront-system-card{padding:24px}
.storefront-module-list,.storefront-journey{display:grid;gap:12px;margin-top:18px}
.storefront-module-item,.storefront-journey-item{
  display:flex;
  gap:14px;
  align-items:flex-start;
  padding:14px;
  border-radius:18px;
  background:rgba(255,255,255,.035);
  border:1px solid rgba(148,163,184,.12);
}
.storefront-advantage-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
}
.storefront-advantage-card{padding:24px}
.storefront-cta{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:18px;
  padding:28px;
}
.storefront-cta-actions{justify-content:flex-end}
@media (max-width:1280px){
  .storefront-hero,
  .storefront-catalog,
  .storefront-resource-grid,
  .storefront-system-grid,
  .storefront-advantage-grid,
  .storefront-strip{grid-template-columns:1fr}
}
@media (max-width:1080px){
  .storefront-topbar{grid-template-columns:1fr;justify-items:start}
  .storefront-nav{justify-content:flex-start}
}
@media (max-width:980px){
  .storefront-metrics,
  .storefront-kv-grid{grid-template-columns:1fr}
  .storefront-cta{flex-direction:column;align-items:flex-start}
}
@media (max-width:720px){
  .storefront-hero,.storefront-card,.storefront-system-card,.storefront-strip-card,.storefront-advantage-card,.storefront-cta{padding:18px}
  .storefront-copy h1{font-size:clamp(34px,12vw,48px)}
  .storefront-panel-top,.storefront-card-head{flex-direction:column;align-items:flex-start}
}


/* ===== Storefront v3 landing ===== */
body.landing-shell{
  background:
    radial-gradient(circle at top left, rgba(79,140,255,.18), transparent 30%),
    radial-gradient(circle at top right, rgba(168,85,247,.12), transparent 26%),
    linear-gradient(180deg,#07111f 0%,#050c17 100%);
}
.page-wrap{max-width:1280px;margin:0 auto;padding:22px clamp(14px,2vw,24px) 48px}
.surface-glow{position:relative;overflow:hidden}
.surface-glow::before{
  content:'';position:absolute;inset:-30% auto auto -10%;width:220px;height:220px;border-radius:50%;
  background:radial-gradient(circle, rgba(79,140,255,.14), transparent 70%);pointer-events:none;
}
.surface-glow > *{position:relative;z-index:1}
.landing-topbar{
  display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:18px;
  padding:16px 18px;margin-bottom:22px;background:rgba(8,18,34,.78);backdrop-filter:blur(12px);
}
.landing-brand{display:flex;align-items:center;gap:14px;text-decoration:none}
.landing-brand-logo{
  width:46px;height:46px;border-radius:15px;display:grid;place-items:center;font-size:13px;font-weight:900;letter-spacing:.08em;
  background:linear-gradient(135deg,var(--blue),#7c4dff);box-shadow:0 14px 28px rgba(79,140,255,.3);color:#fff;
}
.landing-brand strong{display:block;font-size:16px;letter-spacing:.03em}
.landing-brand small{display:block;color:var(--muted);font-size:12px;margin-top:2px}
.landing-nav{display:flex;flex-wrap:wrap;gap:10px 18px;justify-content:center}
.landing-nav a{color:#d7e3f8;text-decoration:none;font-weight:600;opacity:.9}
.landing-nav a:hover{opacity:1;color:#fff}
.landing-topbar-actions{display:flex;flex-wrap:wrap;gap:10px;justify-content:flex-end}
.flash-card{display:flex;align-items:center;gap:14px;padding:14px 16px;margin-bottom:18px}
.status-pill{display:inline-flex;align-items:center;justify-content:center;padding:7px 10px;border-radius:999px;font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.status-pill.success{background:rgba(34,197,94,.15);color:#9ae6b4}
.status-pill.error,.status-pill.danger{background:rgba(239,68,68,.15);color:#fca5a5}
.status-pill.info{background:rgba(79,140,255,.16);color:#bfdbfe}
.landing-hero{
  display:grid;grid-template-columns:minmax(0,1.15fr) minmax(320px,.92fr);gap:24px;padding:34px;margin-bottom:20px;
}
.landing-hero-copy h1{margin:14px 0 14px;font-size:clamp(40px,5.2vw,74px);line-height:1.01;letter-spacing:-.055em;max-width:820px}
.landing-hero-copy p{margin:0;max-width:760px;color:#d3e1f6;font-size:16px;line-height:1.8}
.landing-hero-actions{margin-top:24px}
.landing-badges{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px}
.landing-badges span{
  display:inline-flex;align-items:center;min-height:36px;padding:7px 12px;border-radius:999px;
  background:rgba(255,255,255,.045);border:1px solid rgba(148,163,184,.14);color:#dce8ff;font-weight:600;font-size:13px;
}
.landing-hero-panel{display:grid;gap:16px}
.hero-panel-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.hero-panel-head h2{margin:8px 0 0;font-size:24px;line-height:1.12}
.panel-signal{
  display:inline-flex;align-items:center;padding:8px 12px;border-radius:999px;background:rgba(34,197,94,.13);
  color:#9ae6b4;font-size:12px;font-weight:800;white-space:nowrap;
}
.hero-stat-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.hero-stat-card{
  padding:18px;border-radius:18px;border:1px solid rgba(148,163,184,.12);
  background:linear-gradient(180deg,rgba(15,29,55,.88),rgba(8,18,34,.96));
}
.hero-stat-card strong{display:block;font-size:30px;line-height:1;font-weight:900;letter-spacing:-.04em;margin-bottom:8px}
.hero-stat-card span{display:block;color:#c9d8ef;font-size:13px}
.hero-stat-card.tone-blue strong{color:#b7d5ff}
.hero-stat-card.tone-green strong{color:#9ae6b4}
.hero-stat-card.tone-purple strong{color:#dfb8ff}
.hero-stat-card.tone-yellow strong{color:#ffd68a}
.hero-mini-flow{display:grid;gap:12px}
.hero-mini-item{
  display:flex;gap:14px;align-items:flex-start;padding:15px 16px;border-radius:18px;
  border:1px solid rgba(148,163,184,.12);background:rgba(255,255,255,.03)
}
.mini-step{
  width:38px;height:38px;border-radius:12px;display:grid;place-items:center;flex:0 0 auto;
  background:linear-gradient(180deg,rgba(79,140,255,.22),rgba(47,109,245,.18));color:#ddebff;font-weight:800;font-size:12px;
}
.hero-mini-item strong{display:block;font-size:15px}
.hero-mini-item small{display:block;color:#aebfda;margin-top:4px;line-height:1.5}
.quick-access-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin:0 0 22px}
.quick-access-card{display:block;text-decoration:none;padding:22px;transition:.2s transform,.2s border-color,.2s background}
.quick-access-card:hover{transform:translateY(-3px);border-color:rgba(79,140,255,.34);background:rgba(255,255,255,.045)}
.quick-access-card h3{margin:14px 0 8px;font-size:22px;line-height:1.12}
.quick-access-card p{margin:0;color:#bccce4;line-height:1.7}
.quick-access-link{display:inline-flex;margin-top:16px;color:#8eb8ff;font-weight:700}
.section-shell{margin-bottom:26px}
.section-note{color:#8ea0bd;font-size:13px;max-width:340px;text-align:right}
.catalog-grid{display:grid;gap:16px}
.software-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.resource-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.catalog-card,.resource-card,.portal-card,.journey-card,.faq-card,.plan-card{padding:22px}
.catalog-card-top,.resource-card-head,.plan-card-top{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.catalog-card h3,.resource-card h3,.plan-card h3,.journey-card h3,.faq-card h3{margin:16px 0 10px;font-size:24px;line-height:1.08}
.catalog-card p,.resource-card p,.plan-card p,.journey-card p,.faq-card p{margin:0;color:#bfd0e8;line-height:1.72}
.catalog-card ul,.plan-card ul{list-style:none;padding:0;margin:18px 0 0;display:grid;gap:10px}
.catalog-card li,.plan-card li{position:relative;padding-left:20px;color:#e4edff}
.catalog-card li::before,.plan-card li::before{content:'•';position:absolute;left:0;top:0;color:#72b0ff;font-weight:900}
.catalog-price{color:#a8bee3;font-size:13px;text-align:right;line-height:1.4}
.catalog-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
.btn.ghost{background:transparent;border-color:rgba(79,140,255,.3);color:#dce8ff;box-shadow:none}
.btn.ghost:hover{background:rgba(79,140,255,.08)}
.chip-row{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
.chip{display:inline-flex;align-items:center;padding:8px 12px;border-radius:999px;background:rgba(255,255,255,.045);border:1px solid rgba(148,163,184,.14);font-size:12px;font-weight:700;color:#dce7fb}
.resource-link{display:inline-flex;margin-top:18px;color:#8eb8ff;font-weight:700;text-decoration:none}
.plan-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.plan-card{position:relative}
.plan-card.featured{border-color:rgba(79,140,255,.34);box-shadow:0 18px 52px rgba(47,109,245,.16)}
.plan-featured-badge{
  display:inline-flex;align-items:center;padding:8px 12px;border-radius:999px;background:rgba(79,140,255,.16);color:#bfdbfe;font-size:12px;font-weight:800;
}
.portal-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-bottom:26px}
.portal-point-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:18px}
.portal-point{
  padding:14px 16px;border-radius:16px;background:rgba(255,255,255,.04);border:1px solid rgba(148,163,184,.14);font-weight:700;color:#ebf2ff
}
.journey-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.journey-step{display:inline-flex;align-items:center;justify-content:center;width:46px;height:46px;border-radius:14px;background:linear-gradient(180deg,rgba(79,140,255,.26),rgba(47,109,245,.14));font-size:14px;font-weight:900;color:#dcebff}
.faq-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.landing-cta{display:flex;justify-content:space-between;align-items:center;gap:18px;padding:28px}
@media (max-width:1180px){
  .landing-topbar{grid-template-columns:1fr;justify-items:start}
  .landing-nav,.landing-topbar-actions{justify-content:flex-start}
  .landing-hero,.software-grid,.resource-grid,.plan-grid,.portal-grid,.journey-grid,.faq-grid,.quick-access-grid{grid-template-columns:1fr}
  .section-note{text-align:left;max-width:none}
}
@media (max-width:720px){
  .page-wrap{padding:14px 12px 38px}
  .landing-topbar,.landing-hero,.quick-access-card,.catalog-card,.resource-card,.portal-card,.journey-card,.faq-card,.plan-card,.landing-cta{padding:18px}
  .landing-hero-copy h1{font-size:clamp(34px,11vw,48px)}
  .hero-stat-grid,.portal-point-grid{grid-template-columns:1fr}
  .landing-cta{flex-direction:column;align-items:flex-start}
}


/* storefront v4 */
.highlight-strip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-top:22px}
.highlight-strip-card{min-height:100%;background:linear-gradient(180deg,rgba(15,31,56,.96),rgba(9,18,33,.98));border:1px solid rgba(79,140,255,.16)}
.highlight-strip-card h3{margin:0 0 8px;font-size:18px}
.highlight-strip-card p{margin:0;color:var(--muted);line-height:1.65}
.stack-section{margin-top:22px}
.stack-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.stack-card{position:relative;overflow:hidden}
.stack-card::after{content:'';position:absolute;right:-40px;bottom:-60px;width:180px;height:180px;border-radius:50%;background:radial-gradient(circle,rgba(79,140,255,.12),transparent 70%);pointer-events:none}
.stack-card h3{margin:14px 0 10px;font-size:22px}
.stack-card p{margin:0 0 14px;color:#d8e3f4;line-height:1.72;position:relative;z-index:1}
.stack-card ul{margin:0;padding-left:18px;display:grid;gap:8px;position:relative;z-index:1}
.catalog-footnote{margin-top:12px;color:#91a3c0;font-size:13px;line-height:1.55}
.resource-actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:14px}
.plan-actions{margin-top:14px}
.plan-actions .btn{width:100%;justify-content:center}
@media (max-width:1080px){
  .highlight-strip{grid-template-columns:repeat(2,minmax(0,1fr))}
  .stack-grid{grid-template-columns:1fr}
}
@media (max-width:720px){
  .highlight-strip{grid-template-columns:1fr}
  .resource-actions{display:grid;grid-template-columns:1fr}
}

/* storefront v5 */
.hero-offer-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:0 0 22px}
.hero-offer-card{padding:22px;min-height:100%;background:linear-gradient(180deg,rgba(16,31,58,.96),rgba(8,17,31,.98));border:1px solid rgba(79,140,255,.18)}
.hero-offer-card h3{margin:14px 0 10px;font-size:22px;line-height:1.12}
.hero-offer-card p{margin:0;color:#c2d2ea;line-height:1.72}
.hero-offer-link{display:inline-flex;margin-top:18px;font-weight:800;color:#8eb8ff;text-decoration:none}
.storefront-focus-section{margin-top:6px}
.focus-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.focus-card{padding:24px;display:flex;flex-direction:column;min-height:100%}
.focus-card h3{margin:16px 0 10px;font-size:26px;line-height:1.08}
.focus-card p{margin:0;color:#c7d7ee;line-height:1.74}
.focus-card ul{list-style:none;padding:0;margin:18px 0 0;display:grid;gap:10px}
.focus-card li{position:relative;padding-left:20px;color:#e4edff}
.focus-card li::before{content:'•';position:absolute;left:0;top:0;color:#72b0ff;font-weight:900}
.focus-actions{margin-top:auto;padding-top:16px}
.delivery-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:0 0 24px}
.delivery-card{padding:22px;background:linear-gradient(180deg,rgba(11,24,44,.94),rgba(8,17,29,.98));border:1px solid rgba(148,163,184,.12)}
.delivery-icon{display:inline-flex;width:42px;height:42px;border-radius:14px;background:linear-gradient(135deg,rgba(79,140,255,.24),rgba(124,77,255,.22));box-shadow:inset 0 0 0 1px rgba(255,255,255,.06)}
.delivery-card h3{margin:16px 0 10px;font-size:21px;line-height:1.12}
.delivery-card p{margin:0;color:#c6d5ea;line-height:1.72}
@media (max-width:1180px){
  .hero-offer-grid,.focus-grid,.delivery-grid{grid-template-columns:1fr}
}

/* index real storefront v6 */
.wallet-section{margin-top:24px}
.wallet-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(280px,.9fr);gap:18px}
.wallet-card-head{display:flex;justify-content:space-between;gap:14px;align-items:center;margin-bottom:16px}
.wallet-step-list{display:grid;gap:12px}
.wallet-step-item{display:flex;gap:14px;align-items:flex-start;padding:14px 16px;border-radius:18px;background:rgba(255,255,255,.04);border:1px solid rgba(148,163,184,.12)}
.wallet-step-no{width:40px;height:40px;display:grid;place-items:center;border-radius:12px;background:rgba(79,140,255,.15);border:1px solid rgba(79,140,255,.26);font-weight:800;color:#e3ecff;flex:0 0 auto}
.wallet-step-item h3{margin:0 0 6px;font-size:18px}
.wallet-step-item p{margin:0;color:var(--muted)}
.wallet-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:18px}
.qr-preview-card{display:grid;gap:16px;align-content:start}
.qr-preview-box{display:grid;place-items:center;padding:18px;border-radius:22px;background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.02));border:1px solid rgba(148,163,184,.12)}
.qr-preview-grid{width:min(100%,260px);aspect-ratio:1;border-radius:18px;background:
linear-gradient(90deg,rgba(255,255,255,.95) 10px,transparent 10px) 0 0/26px 26px,
linear-gradient(rgba(255,255,255,.95) 10px,transparent 10px) 0 0/26px 26px,
radial-gradient(circle at 20% 20%,#fff 0 14%,transparent 15%),
radial-gradient(circle at 80% 20%,#fff 0 14%,transparent 15%),
radial-gradient(circle at 20% 80%,#fff 0 14%,transparent 15%),
linear-gradient(180deg,#f8fbff,#dfe8f7);
box-shadow:inset 0 0 0 12px #fff}
.qr-preview-meta{display:grid;gap:10px}
.qr-preview-meta > div{padding:14px 16px;border-radius:16px;background:rgba(255,255,255,.035);border:1px solid rgba(148,163,184,.11)}
.qr-preview-meta strong{display:block;margin-bottom:6px}
.qr-preview-meta span{display:block;color:var(--muted);line-height:1.5}
@media (max-width:980px){.wallet-grid{grid-template-columns:1fr}}


.member-topbar-kicker{display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border-radius:999px;background:rgba(96,165,250,.16);border:1px solid rgba(96,165,250,.22);font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#dbeafe;margin-bottom:12px}
.member-overview-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.member-overview-card{padding:22px;display:grid;gap:16px}
.member-overview-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.member-mini-label{display:inline-block;font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#93c5fd;margin-bottom:8px}
.member-overview-head h3{margin:0;font-size:24px;line-height:1.15}
.member-overview-card p{margin:0;color:#cbd5e1;line-height:1.7}
.member-overview-list{display:grid;gap:10px}
.member-overview-list div{display:flex;justify-content:space-between;gap:12px;padding:12px 14px;border-radius:16px;border:1px solid rgba(148,163,184,.12);background:rgba(15,23,42,.42)}
.member-overview-list span{color:#9fb2d9;font-size:13px}
.member-overview-list strong{color:#f8fbff;font-size:14px}
.member-overview-empty{padding:14px 16px;border-radius:16px;border:1px dashed rgba(148,163,184,.2);background:rgba(15,23,42,.35);color:#cbd5e1;line-height:1.6}
.member-shortcuts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.member-shortcuts a{display:grid;gap:4px;padding:16px;border-radius:18px;border:1px solid rgba(148,163,184,.14);background:linear-gradient(180deg,rgba(15,23,42,.66),rgba(2,6,23,.72));color:#eaf2ff;text-decoration:none;transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease}
.member-shortcuts a:hover{transform:translateY(-2px);border-color:rgba(96,165,250,.28);box-shadow:0 16px 30px rgba(2,6,23,.34)}
.member-shortcuts strong{font-size:24px;line-height:1;font-weight:900;letter-spacing:-.03em}
.member-shortcuts span{color:#b7c7e8;font-size:13px}
.member-activity-note{padding:12px 14px;border-radius:16px;background:rgba(20,31,55,.7);border:1px solid rgba(148,163,184,.12);color:#d8e4fb;line-height:1.6}
@media (max-width: 1120px){.member-overview-grid{grid-template-columns:1fr}}

/* member wallet page */
.wallet-kpis-grid{margin-bottom:18px}
.member-wallet-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(320px,.8fr);gap:18px;margin-bottom:24px}
.wallet-main-card,.wallet-bank-card,.wallet-latest-card{padding:24px}
.wallet-side-column{display:grid;gap:18px;align-content:start}
.wallet-create-form{display:grid;gap:16px}
.wallet-create-form label{display:grid;gap:10px}
.wallet-create-form span{font-size:13px;font-weight:700;color:#d5e3fb}
.wallet-create-form input,.wallet-create-form textarea{width:100%;border-radius:18px;border:1px solid rgba(148,163,184,.16);background:rgba(8,15,28,.88);color:#f8fbff;padding:15px 16px;outline:none;box-shadow:none}
.wallet-create-form input:focus,.wallet-create-form textarea:focus{border-color:rgba(96,165,250,.4);box-shadow:0 0 0 4px rgba(59,130,246,.12)}
.wallet-form-actions{display:flex;flex-wrap:wrap;gap:12px}
.wallet-checklist{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:18px}
.wallet-check-item{display:flex;gap:12px;align-items:flex-start;padding:14px 16px;border-radius:18px;border:1px solid rgba(148,163,184,.12);background:rgba(15,23,42,.44)}
.wallet-check-item strong{display:grid;place-items:center;min-width:34px;height:34px;border-radius:12px;background:rgba(59,130,246,.16);color:#eff6ff;font-size:13px}
.wallet-check-item span{color:#cbd5e1;line-height:1.6}
.wallet-bank-list,.wallet-latest-data{display:grid;gap:10px}
.wallet-bank-list div,.wallet-latest-data div{display:flex;justify-content:space-between;gap:12px;padding:12px 14px;border-radius:16px;border:1px solid rgba(148,163,184,.12);background:rgba(15,23,42,.42)}
.wallet-bank-list span,.wallet-latest-data span{color:#9fb2d9;font-size:13px}
.wallet-bank-list strong,.wallet-latest-data strong{color:#f8fbff;font-size:14px;max-width:56%;text-align:right;word-break:break-word}
.wallet-latest-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:16px}
@media (max-width:1120px){.member-wallet-grid{grid-template-columns:1fr}.wallet-checklist{grid-template-columns:1fr}}

.member-catalog-hero{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(280px,.8fr);gap:18px;align-items:center;padding:24px;margin-bottom:18px}
.member-catalog-hero h2{margin:12px 0 10px;font-size:34px;line-height:1.1}
.member-catalog-hero p{margin:0;color:#cbd5e1;line-height:1.8;max-width:760px}
.member-filter-bar{display:grid;gap:16px;padding:20px}
.member-filter-copy h2{margin:0 0 6px;font-size:24px}
.member-filter-copy p{margin:0;color:#9fb2d9;line-height:1.7}
.member-filter-pills{display:flex;flex-wrap:wrap;gap:10px}
.member-filter-pills a{display:inline-flex;align-items:center;justify-content:center;padding:11px 16px;border-radius:999px;border:1px solid rgba(148,163,184,.14);background:rgba(15,23,42,.5);color:#dce7fb;text-decoration:none;font-weight:700;transition:border-color .18s ease,transform .18s ease,background .18s ease}
.member-filter-pills a:hover{transform:translateY(-1px);border-color:rgba(96,165,250,.28)}
.member-filter-pills a.active{background:linear-gradient(135deg,#2563eb,#06b6d4);border-color:transparent;color:#fff;box-shadow:0 18px 30px rgba(37,99,235,.22)}
.member-card-grid-wide{grid-template-columns:repeat(3,minmax(0,1fr))}
.member-product-card-lg{display:grid;gap:14px;padding:20px}
.member-product-meta-row{display:flex;flex-wrap:wrap;gap:8px}
.member-product-footer-row{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:auto}
.member-product-hint{font-size:13px;line-height:1.6;color:#b9c9e7;max-width:320px}
.inline-buy-form{display:flex;align-items:center;justify-content:flex-end}
.inline-buy-form .btn{min-width:180px;text-align:center}
.member-empty-state{padding:26px;display:grid;gap:14px;text-align:center}
.member-empty-state h3{margin:0;font-size:26px}
.member-empty-state p{margin:0;color:#cbd5e1;line-height:1.75}
@media (max-width: 1120px){.member-catalog-hero{grid-template-columns:1fr}.member-card-grid-wide{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width: 780px){.member-card-grid-wide{grid-template-columns:1fr}.member-product-footer-row{flex-direction:column;align-items:stretch}.member-product-hint{max-width:none}.inline-buy-form{justify-content:stretch}.inline-buy-form .btn{width:100%}.member-catalog-hero h2{font-size:28px}}

/* member orders page */
.orders-hero{margin-bottom:18px}
.orders-layout{display:grid;grid-template-columns:minmax(0,.92fr) minmax(320px,1.08fr);gap:18px;align-items:start}
.orders-list-card,.order-spotlight-card,.order-support-card{padding:22px}
.orders-list-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:16px}
.orders-list-head h2{margin:0 0 6px;font-size:24px}
.orders-list-head p{margin:0;color:#9fb2d9;line-height:1.7}
.orders-list-stack{display:grid;gap:12px}
.order-row-link{display:grid;gap:12px;padding:16px 18px;border-radius:20px;border:1px solid rgba(148,163,184,.12);background:linear-gradient(180deg,rgba(15,23,42,.6),rgba(2,6,23,.72));color:#eaf2ff;text-decoration:none;transition:border-color .18s ease,transform .18s ease,box-shadow .18s ease}
.order-row-link:hover{transform:translateY(-2px);border-color:rgba(96,165,250,.28);box-shadow:0 16px 30px rgba(2,6,23,.3)}
.order-row-link.active{border-color:rgba(56,189,248,.34);box-shadow:0 20px 36px rgba(14,165,233,.16)}
.order-row-top{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.order-row-top strong{display:block;font-size:15px;line-height:1.5}
.order-row-top span:not(.status-badge){display:block;margin-top:4px;color:#92a6ce;font-size:12px}
.order-row-meta{display:flex;align-items:center;justify-content:space-between;gap:10px;color:#cfe1ff;font-size:13px;font-weight:700}
.order-row-note{color:#b7c7e8;line-height:1.65;font-size:13px}
.orders-detail-column{display:grid;gap:18px}
.order-spotlight-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:16px}
.order-spotlight-head h2{margin:0 0 8px;font-size:28px;line-height:1.12}
.order-spotlight-head p{margin:0;color:#cbd5e1;line-height:1.75;max-width:700px}
.order-spotlight-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-bottom:16px}
.order-spotlight-grid div{padding:14px 16px;border-radius:18px;border:1px solid rgba(148,163,184,.12);background:rgba(15,23,42,.42)}
.order-spotlight-grid span{display:block;color:#9fb2d9;font-size:13px;margin-bottom:6px}
.order-spotlight-grid strong{display:block;color:#f8fbff;font-size:15px;line-height:1.5;word-break:break-word}
.order-feature-list{display:grid;gap:10px}
.order-feature-list div{display:flex;gap:12px;align-items:flex-start;padding:12px 14px;border-radius:16px;border:1px solid rgba(148,163,184,.12);background:rgba(15,23,42,.42)}
.order-feature-list strong{display:grid;place-items:center;min-width:28px;height:28px;border-radius:10px;background:rgba(59,130,246,.16);color:#eff6ff;font-size:13px}
.order-feature-list span{color:#dbe7fb;line-height:1.65}
@media (max-width:1120px){.orders-layout{grid-template-columns:1fr}.order-spotlight-grid{grid-template-columns:1fr}}

/* member licenses & downloads */
.soft-pill.success{background:rgba(34,197,94,.14);border:1px solid rgba(34,197,94,.22);color:#dcfce7}
.soft-pill.processing{background:rgba(59,130,246,.16);border:1px solid rgba(59,130,246,.24);color:#dbeafe}
.soft-pill.cancelled{background:rgba(239,68,68,.14);border:1px solid rgba(239,68,68,.22);color:#fee2e2}
.license-layout,.download-layout{align-items:start}
.license-key-mini{padding:12px 14px;border-radius:16px;background:rgba(15,23,42,.54);border:1px solid rgba(148,163,184,.14);font-size:14px;font-weight:800;letter-spacing:.08em;color:#dbeafe}
.license-key-panel{display:grid;gap:10px;padding:18px 20px;border-radius:22px;border:1px solid rgba(96,165,250,.22);background:linear-gradient(180deg,rgba(15,23,42,.72),rgba(2,6,23,.88));margin-bottom:16px}
.license-key-panel span{font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#93c5fd}
.license-key-panel strong{font-size:24px;line-height:1.35;letter-spacing:.05em;color:#f8fbff;word-break:break-word}
.license-key-panel.compact strong{font-size:18px}
.download-includes-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-bottom:16px}
.download-include-card{display:flex;gap:12px;align-items:flex-start;padding:14px 16px;border-radius:18px;border:1px solid rgba(148,163,184,.12);background:rgba(15,23,42,.42)}
.download-include-card strong{display:grid;place-items:center;min-width:28px;height:28px;border-radius:10px;background:rgba(59,130,246,.16);color:#eff6ff;font-size:13px}
.download-include-card span{color:#dbe7fb;line-height:1.6}
.license-detail-card .kv,.download-detail-card .kv{display:flex;flex-wrap:wrap;gap:10px}
@media (max-width:780px){.download-includes-grid{grid-template-columns:1fr}.license-key-panel strong{font-size:18px}}


/* member profile & support */
.profile-layout,.support-layout{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(320px,.88fr);gap:18px;align-items:start}
.profile-form-card,.profile-password-card,.profile-ticket-card,.support-form-card{padding:22px}
.profile-side-column,.support-side-column{display:grid;gap:18px;align-content:start}
.profile-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.profile-form-grid.compact{grid-template-columns:1fr}
.profile-form-grid label{display:grid;gap:10px}
.profile-form-grid span{font-size:13px;font-weight:700;color:#d5e3fb}
.profile-form-grid input,.profile-form-grid textarea,.profile-form-grid select{width:100%;border-radius:18px;border:1px solid rgba(148,163,184,.16);background:rgba(8,15,28,.88);color:#f8fbff;padding:15px 16px;outline:none;box-shadow:none}
.profile-form-grid input:focus,.profile-form-grid textarea:focus,.profile-form-grid select:focus{border-color:rgba(96,165,250,.4);box-shadow:0 0 0 4px rgba(59,130,246,.12)}
.profile-form-full{grid-column:1 / -1}
.profile-form-actions{display:flex;flex-wrap:wrap;gap:12px}
.profile-ticket-list{display:grid;gap:12px}
.profile-ticket-item{display:grid;gap:8px;padding:15px 16px;border-radius:18px;border:1px solid rgba(148,163,184,.12);background:rgba(15,23,42,.42);text-decoration:none;color:#eef4ff;transition:transform .18s ease,border-color .18s ease}
.profile-ticket-item:hover{transform:translateY(-2px);border-color:rgba(96,165,250,.28)}
.profile-ticket-top{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.profile-ticket-item small{color:#9fb2d9}
.support-ticket-stack{display:grid;gap:14px}
.support-ticket-card{padding:18px;border-radius:22px;border:1px solid rgba(148,163,184,.12);background:linear-gradient(180deg,rgba(15,23,42,.58),rgba(2,6,23,.76))}
.support-ticket-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:14px}
.support-ticket-head strong{display:block;font-size:13px;color:#93c5fd;letter-spacing:.08em}
.support-ticket-head h3{margin:8px 0 0;font-size:22px;line-height:1.2}
.support-ticket-badges{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px}
.support-ticket-body{display:grid;gap:14px}
.support-ticket-message{color:#dbe7fb;line-height:1.8;white-space:normal}
.support-ticket-meta{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.support-ticket-meta div{padding:13px 14px;border-radius:16px;border:1px solid rgba(148,163,184,.12);background:rgba(15,23,42,.42)}
.support-ticket-meta span{display:block;color:#9fb2d9;font-size:13px;margin-bottom:6px}
.support-ticket-meta strong{display:block;color:#f8fbff;font-size:14px}
.support-reply-box{display:grid;gap:8px;padding:16px 18px;border-radius:18px;border:1px solid rgba(34,197,94,.18);background:rgba(20,83,45,.16)}
.support-reply-box span{font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#bbf7d0}
.support-reply-box strong{color:#f0fdf4}
.support-reply-box div{color:#dcfce7;line-height:1.75}
@media (max-width:1120px){.profile-layout,.support-layout{grid-template-columns:1fr}.profile-form-grid{grid-template-columns:1fr}.support-ticket-meta{grid-template-columns:1fr}}


.toolbar-row{display:flex;gap:12px;flex-wrap:wrap;align-items:center}
.toolbar-row input,.toolbar-row select{min-width:180px;flex:1 1 180px;padding:12px 14px;border-radius:14px;border:1px solid rgba(148,163,184,.22);background:rgba(8,16,30,.82);color:#e8f0ff}
.split-panel{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(320px,.95fr);gap:16px}
.split-panel-primary,.split-panel-side{min-width:0}
.detail-stack{display:flex;flex-direction:column;gap:14px}
.detail-hero{display:flex;align-items:center;gap:12px}
.detail-avatar{width:52px;height:52px;border-radius:16px;display:grid;place-items:center;background:linear-gradient(135deg,#2563eb,#7c3aed);color:#fff;font-weight:800;letter-spacing:.08em}
.mini-stats-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.mini-stats-grid>div{padding:12px 14px;border-radius:16px;border:1px solid rgba(148,163,184,.16);background:rgba(255,255,255,.03)}
.mini-stats-grid span{display:block;font-size:12px;color:#94a3b8;margin-bottom:6px}
.mini-stats-grid strong{font-size:14px;color:#eff6ff}
.detail-list-block{padding:14px;border-radius:18px;border:1px solid rgba(148,163,184,.14);background:rgba(255,255,255,.03)}
.detail-list-block h4{margin:0 0 10px;font-size:15px}
.detail-list-item{display:flex;flex-direction:column;gap:4px;padding:10px 0;border-top:1px dashed rgba(148,163,184,.16)}
.detail-list-item:first-of-type{border-top:0;padding-top:0}
.list-inline-meta{font-size:12px;color:#94a3b8}
.ticket-stack-admin{display:flex;flex-direction:column;gap:12px}
.admin-ticket-link{text-decoration:none;color:inherit;display:block}
.admin-ticket-link.is-active{border-color:rgba(59,130,246,.55);box-shadow:0 0 0 1px rgba(59,130,246,.32)}
.compact-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.compact-form-grid .profile-form-full{grid-column:1 / -1}
@media (max-width: 1100px){.split-panel{grid-template-columns:1fr}.compact-form-grid{grid-template-columns:1fr}}
.soft-pill.published{background:rgba(34,197,94,.14);border-color:rgba(34,197,94,.24);color:#dcfce7}
.soft-pill.sold_out{background:rgba(245,158,11,.14);border-color:rgba(245,158,11,.24);color:#fde68a}
.soft-pill.hidden{background:rgba(148,163,184,.16);border-color:rgba(148,163,184,.22);color:#e2e8f0}

/* admin finance v2 */
.finance-top-panels{align-items:start}
.finance-overview-card,.finance-block-card,.finance-users-card,.finance-user-side{padding:22px}
.finance-mini-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
.finance-split{align-items:start}
.finance-user-side{position:sticky;top:24px}
.finance-filter-row input,.finance-filter-row select{min-width:160px;flex:1 1 160px}
.finance-table-wrap table td,.finance-table-wrap table th{vertical-align:top}
.finance-inline-actions{display:grid;gap:8px}
.finance-inline-actions input{width:100%;padding:10px 12px;border-radius:12px;border:1px solid rgba(148,163,184,.18);background:rgba(8,16,30,.82);color:#e8f0ff}
.selected-row td{background:rgba(59,130,246,.08)}
.finance-users-card .admin-ticket-link{display:block;padding:4px 0}
.finance-users-card .admin-ticket-link.is-active{padding:10px 12px;border-radius:14px;background:rgba(59,130,246,.12)}
.compact-admin-form .field label{display:block;margin-bottom:6px;font-size:13px;font-weight:700;color:#d5e3fb}
.compact-admin-form .field input,.compact-admin-form .field select{width:100%;border-radius:14px;border:1px solid rgba(148,163,184,.18);background:rgba(8,16,30,.86);color:#f8fbff;padding:12px 14px}
.compact-admin-form .field input:focus,.compact-admin-form .field select:focus{border-color:rgba(96,165,250,.4);box-shadow:0 0 0 4px rgba(59,130,246,.12);outline:none}
.finance-overview-card code{display:block;overflow:auto;white-space:nowrap;padding:4px 0;color:#bfdbfe}
@media (max-width:1100px){.finance-user-side{position:static}}

/* admin runtime */
.runtime-split{align-items:start}
.runtime-primary,.runtime-side{min-width:0}
.runtime-log-stack{display:grid;gap:12px}
.runtime-log-item pre.runtime-json-block{margin:0;padding:14px 16px;border-radius:16px;border:1px solid rgba(148,163,184,.16);background:rgba(8,16,30,.82);color:#dbeafe;white-space:pre-wrap;word-break:break-word;font-size:12px;line-height:1.65;overflow:auto}
.runtime-frame-preview{border-radius:22px;overflow:hidden;border:1px solid rgba(148,163,184,.14);background:rgba(15,23,42,.48)}
.runtime-frame-preview img{display:block;width:100%;height:auto}
.runtime-frame-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.runtime-frame-card{padding:12px;border-radius:18px;border:1px solid rgba(148,163,184,.14);background:rgba(255,255,255,.03)}
.runtime-frame-thumb{aspect-ratio:9/16;border-radius:14px;overflow:hidden;background:rgba(8,16,30,.82);margin-bottom:10px;display:grid;place-items:center}
.runtime-frame-thumb img{display:block;width:100%;height:100%;object-fit:cover}
.runtime-actions form{margin:0}
@media (max-width:1100px){.runtime-frame-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:720px){.runtime-frame-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.runtime-frame-grid{grid-template-columns:1fr}}


/* admin device center */
.device-center-split{align-items:start}
.device-center-side{position:sticky;top:24px}
.device-breakdown-list{display:grid;gap:6px;margin-top:8px}
.device-breakdown-list span{font-size:12px;color:#9fb2d9}
.device-center-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
.device-command-form textarea{width:100%;border-radius:14px;border:1px solid rgba(148,163,184,.18);background:rgba(8,16,30,.86);color:#f8fbff;padding:12px 14px;resize:vertical}
.device-command-form textarea:focus{border-color:rgba(96,165,250,.4);box-shadow:0 0 0 4px rgba(59,130,246,.12);outline:none}
@media (max-width:1100px){.device-center-side{position:static}}


/* admin automation core */
.automation-split{align-items:start}
.automation-side{position:sticky;top:24px}
.automation-form-grid textarea{width:100%;border-radius:14px;border:1px solid rgba(148,163,184,.18);background:rgba(8,16,30,.86);color:#f8fbff;padding:12px 14px;resize:vertical}
.automation-form-grid textarea:focus{border-color:rgba(96,165,250,.4);box-shadow:0 0 0 4px rgba(59,130,246,.12);outline:none}
.automation-mini-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
@media (max-width:1100px){.automation-side{position:static}}


.reports-main .report-bars{display:grid;gap:12px}.report-bar-row{display:grid;grid-template-columns:90px 1fr 1fr;gap:12px;align-items:center}.report-bar-meta{display:flex;flex-direction:column;gap:4px}.report-bar-meta span{color:#9fb1d9;font-size:12px}.report-bar-stack{display:flex;align-items:center;gap:10px}.report-bar{height:10px;border-radius:999px;background:#334155;min-width:6px}.report-bar-green{background:linear-gradient(90deg,#22c55e,#34d399)}.report-bar-blue{background:linear-gradient(90deg,#38bdf8,#6366f1)}.report-status-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.report-status-card{border:1px solid rgba(148,163,184,.18);border-radius:16px;padding:16px;background:rgba(10,18,31,.55)}.report-status-card h3{margin:0 0 12px}.settings-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.settings-form-grid-bridge{grid-template-columns:repeat(4,minmax(0,1fr))}.settings-form-grid .full-span,.settings-form-grid-bridge .full-span{grid-column:1/-1}.checkbox-row{display:flex;align-items:center;gap:8px}.checkbox-row label{display:flex;gap:8px;align-items:center;color:#dce7ff}.compact-table small{color:#9fb1d9}.report-bar-stack small{color:#c8d7f5}.summary-list-item a{color:#9fd4ff;text-decoration:none}
@media (max-width: 1100px){.report-bar-row{grid-template-columns:1fr}.report-status-grid,.settings-form-grid,.settings-form-grid-bridge{grid-template-columns:1fr}}


.grid-5 {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 16px;
}

.accent-slate {
  border-color: rgba(148, 163, 184, 0.35);
}

.logs-main .toolbar-row .field span {
  display: block;
  font-size: 12px;
  color: #94a3b8;
  margin-bottom: 6px;
}

.log-console {
  background: #0f172a;
  border: 1px solid rgba(148, 163, 184, 0.18);
  border-radius: 16px;
  padding: 14px;
  max-height: 520px;
  overflow: auto;
}

.log-console-line {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 12px;
  line-height: 1.55;
  color: #e2e8f0;
  padding: 6px 0;
  border-bottom: 1px dashed rgba(148, 163, 184, 0.16);
  white-space: pre-wrap;
  word-break: break-word;
}

.log-console-line:last-child {
  border-bottom: 0;
}

.tiny {
  font-size: 12px;
}

@media (max-width: 1380px) {
  .grid-5 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 768px) {
  .grid-5 {
    grid-template-columns: 1fr;
  }

  .logs-main .toolbar-row {
    grid-template-columns: 1fr !important;
  }
}


.member-nav-count {
    min-width: 22px;
    padding: 2px 8px;
    border-radius: 999px;
    background: rgba(59, 130, 246, 0.16);
    color: #dbeafe;
    font-size: 12px;
    font-weight: 700;
    text-align: center;
}
.member-side-user {
    display: block;
    margin-top: 10px;
    color: #94a3b8;
    font-size: 12px;
}
.notification-stack {
    display: grid;
    gap: 14px;
}
.notification-card {
    display: block;
    border: 1px solid rgba(148, 163, 184, 0.18);
    border-radius: 18px;
    padding: 16px 18px;
    background: rgba(15, 23, 42, 0.72);
    text-decoration: none;
    color: inherit;
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.notification-card:hover {
    transform: translateY(-1px);
    border-color: rgba(96, 165, 250, 0.34);
    box-shadow: 0 14px 28px rgba(2, 6, 23, 0.24);
}
.notification-card.is-active {
    border-color: rgba(96, 165, 250, 0.62);
    box-shadow: 0 16px 32px rgba(37, 99, 235, 0.18);
}
.notification-card.is-unread {
    background: linear-gradient(180deg, rgba(30, 41, 59, 0.95), rgba(15, 23, 42, 0.82));
}
.notification-card-head {
    display: flex;
    justify-content: space-between;
    gap: 14px;
    align-items: flex-start;
    margin-bottom: 10px;
}
.notification-card-head strong {
    display: block;
    font-size: 16px;
    line-height: 1.35;
    margin-bottom: 6px;
}
.notifications-kpis {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}

.auth-links-row{display:flex;gap:12px;flex-wrap:wrap;margin-top:16px}
.auth-links-stack{display:flex;gap:12px;flex-wrap:wrap;margin-top:14px;font-size:.95rem}
.auth-links-stack a{color:#9fc2ff;text-decoration:none}
.auth-grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.auth-grid-2 .field-full{grid-column:1/-1}
.auth-card-wide{max-width:760px;width:min(760px,100%)}
.member-auth-page .auth-card .btn.ghost{background:rgba(255,255,255,.04)}
@media (max-width: 720px){.auth-grid-2{grid-template-columns:1fr}}

.accent-success {
    border-color: rgba(34, 197, 94, 0.24);
    background: linear-gradient(180deg, rgba(6, 95, 70, 0.22), rgba(15, 23, 42, 0.88));
}
.inline-buy-actions {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    justify-content: flex-end;
    align-items: center;
}
.cart-layout-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.5fr) minmax(320px, 420px);
    gap: 18px;
    align-items: start;
}
.cart-main-column,
.cart-summary-column {
    min-width: 0;
}
.cart-update-card,
.cart-summary-card {
    padding: 20px;
}
.cart-items-stack {
    display: grid;
    gap: 14px;
}
.cart-item-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 240px;
    gap: 18px;
    border: 1px solid rgba(148, 163, 184, 0.16);
    border-radius: 18px;
    padding: 16px 18px;
    background: rgba(15, 23, 42, 0.56);
}
.cart-item-card.has-problem {
    border-color: rgba(248, 113, 113, 0.38);
    box-shadow: inset 0 0 0 1px rgba(239, 68, 68, 0.08);
}
.cart-item-copy h3 {
    margin: 12px 0 8px;
    font-size: 1.1rem;
}
.cart-item-copy p {
    margin: 0;
    color: #cbd5e1;
    line-height: 1.6;
}
.cart-item-side {
    display: grid;
    gap: 12px;
    justify-items: stretch;
    align-content: start;
}
.cart-price-unit,
.cart-line-total {
    font-weight: 800;
    font-size: 1rem;
    color: #e2e8f0;
}
.cart-line-total {
    color: #93c5fd;
}
.cart-qty-label {
    display: grid;
    gap: 6px;
    font-size: 13px;
    color: #94a3b8;
}
.cart-qty-label input {
    width: 100%;
    padding: 10px 12px;
    border-radius: 12px;
    border: 1px solid rgba(148, 163, 184, 0.18);
    background: rgba(15, 23, 42, 0.9);
    color: #f8fafc;
}
.cart-problem-note {
    margin-top: 12px;
    border-radius: 14px;
    padding: 10px 12px;
    background: rgba(127, 29, 29, 0.22);
    color: #fecaca;
    border: 1px solid rgba(248, 113, 113, 0.2);
}
.cart-card-actions,
.cart-summary-links,
.cart-clear-form {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}
.cart-card-actions {
    margin-top: 16px;
}
.cart-clear-form {
    margin-top: 12px;
}
.cart-summary-lines {
    display: grid;
    gap: 10px;
    margin-bottom: 16px;
}
.cart-summary-lines > div {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    border: 1px solid rgba(148, 163, 184, 0.12);
    border-radius: 14px;
    padding: 12px 14px;
    background: rgba(15, 23, 42, 0.55);
}
.cart-summary-lines span {
    color: #94a3b8;
}
.cart-summary-lines strong {
    color: #f8fafc;
}
.cart-note-field textarea {
    width: 100%;
    min-height: 96px;
    border-radius: 14px;
    border: 1px solid rgba(148, 163, 184, 0.18);
    background: rgba(15, 23, 42, 0.92);
    color: #f8fafc;
    padding: 12px 14px;
    resize: vertical;
}
.cart-summary-hint {
    margin: 14px 0;
    border-radius: 14px;
    padding: 12px 14px;
    font-size: 14px;
    line-height: 1.55;
}
.cart-summary-hint.warning {
    background: rgba(146, 64, 14, 0.18);
    border: 1px solid rgba(251, 191, 36, 0.18);
    color: #fde68a;
}
.cart-summary-hint.success {
    background: rgba(6, 95, 70, 0.18);
    border: 1px solid rgba(34, 197, 94, 0.18);
    color: #bbf7d0;
}
.compact .member-section-head,
.member-section-head.compact {
    margin-bottom: 14px;
}
.order-row-meta {
    flex-wrap: wrap;
}
@media (max-width: 1024px) {
    .cart-layout-grid {
        grid-template-columns: 1fr;
    }
}
@media (max-width: 720px) {
    .inline-buy-actions,
    .cart-card-actions,
    .cart-summary-links,
    .cart-clear-form {
        flex-direction: column;
    }
    .cart-item-card {
        grid-template-columns: 1fr;
    }
}

.cart-coupon-card {
    margin-bottom: 16px;
}
.cart-coupon-actions {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    margin-top: 10px;
    margin-bottom: 10px;
}
.cart-summary-lines div:last-child strong {
    color: #fff;
}
.cart-summary-lines div:nth-child(4) strong {
    color: #7dd3fc;
}

.wishlist-layout-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.8fr) minmax(320px, .9fr);
    gap: 24px;
    align-items: start;
}
.wishlist-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 18px;
}
.wishlist-card {
    min-height: 100%;
}
.wishlist-card-top {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 10px;
}
.wishlist-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: auto;
}
.wishlist-actions .inline-buy-form,
.wishlist-compare-toggle {
    margin: 0;
}
.compare-pill {
    border: 1px solid rgba(125, 211, 252, 0.24);
    background: rgba(12, 20, 36, 0.85);
    color: #cbd5e1;
}
.compare-pill.active {
    background: rgba(37, 99, 235, 0.22);
    color: #dbeafe;
    border-color: rgba(96, 165, 250, 0.3);
}
.compare-panel-card {
    overflow: hidden;
}
.compare-table-wrap {
    overflow-x: auto;
}
.compare-table {
    width: 100%;
    min-width: 760px;
    border-collapse: separate;
    border-spacing: 0;
}
.compare-table th,
.compare-table td {
    vertical-align: top;
    text-align: left;
    padding: 14px 16px;
    border-bottom: 1px solid rgba(148, 163, 184, 0.12);
}
.compare-table th {
    color: #f8fafc;
    background: rgba(15, 23, 42, 0.72);
    position: sticky;
    top: 0;
}
.compare-table td:first-child,
.compare-table th:first-child {
    min-width: 160px;
    color: #94a3b8;
}
.compare-features {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.compact-tips {
    gap: 10px;
}
@media (max-width: 1024px) {
    .wishlist-layout-grid {
        grid-template-columns: 1fr;
    }
}
@media (max-width: 720px) {
    .wishlist-actions {
        flex-direction: column;
    }
}


/* store detail pages */
.detail-breadcrumb{display:flex;align-items:center;gap:10px;margin-bottom:14px;color:#9fb2d9;font-size:13px;flex-wrap:wrap}
.detail-breadcrumb a{color:#cfe1ff;text-decoration:none}
.detail-breadcrumb strong{color:#f8fbff}
.detail-hero{display:grid;grid-template-columns:minmax(320px,.9fr) minmax(0,1.1fr);gap:20px;padding:24px;margin-bottom:18px}
.detail-preview-box{height:250px}
.resource-preview-box{background:linear-gradient(135deg, rgba(249,115,22,.16), rgba(17,24,39,.1)),radial-gradient(circle at 15% 15%, rgba(251,146,60,.45), transparent 18%),#0b1220}
.detail-stat-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:14px}
.detail-stat-grid div,.detail-info-list div,.detail-wallet-inline{padding:14px 16px;border-radius:18px;border:1px solid rgba(148,163,184,.12);background:rgba(15,23,42,.42)}
.detail-stat-grid span,.detail-info-list span,.detail-mini-label{display:block;color:#9fb2d9;font-size:12px;margin-bottom:6px;text-transform:uppercase;letter-spacing:.05em}
.detail-stat-grid strong,.detail-info-list strong,.detail-wallet-inline strong{display:block;color:#f8fbff;line-height:1.6;word-break:break-word}
.detail-hero-content h2{margin:12px 0 10px;font-size:34px;line-height:1.08}
.detail-price-row{display:flex;align-items:flex-end;justify-content:space-between;gap:14px;flex-wrap:wrap}
.detail-price-note{color:#b8caeb;line-height:1.6}
.detail-summary{margin:10px 0 0;color:#d5e3fb;line-height:1.85}
.detail-tags{margin-top:14px}
.detail-action-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:18px}
.detail-action-grid .member-buy-form,.detail-action-grid .btn{margin-top:0}
.detail-wallet-inline{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:16px}
.subtle-card{background:rgba(255,255,255,.03)}
.detail-body-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(300px,.9fr);gap:18px;align-items:start}
.detail-copy-card,.detail-side-card{padding:22px}
.left-align{justify-content:flex-start}
.left-align h2{text-align:left}
.top-gap{margin-top:24px}
.top-gap-18{margin-top:18px}
.detail-feature-list{display:grid;gap:12px}
.detail-feature-list div{display:flex;gap:12px;align-items:flex-start;padding:14px 16px;border-radius:18px;border:1px solid rgba(148,163,184,.12);background:rgba(15,23,42,.42)}
.detail-feature-list strong{display:grid;place-items:center;min-width:32px;height:32px;border-radius:12px;background:rgba(59,130,246,.16);color:#eff6ff;font-size:13px}
.detail-feature-list span{color:#dbe7fb;line-height:1.7}
.compact-list strong{min-width:34px}
.detail-side-column{display:grid;gap:18px;align-content:start}
.detail-latest-order{margin-top:16px;padding:16px;border-radius:18px;border:1px solid rgba(96,165,250,.16);background:linear-gradient(180deg,rgba(37,99,235,.12),rgba(15,23,42,.42))}
.detail-latest-order p{margin:6px 0 12px;color:#cbd5e1}
.detail-related-card p{min-height:0}
@media (max-width:1180px){.detail-hero,.detail-body-grid{grid-template-columns:1fr}.detail-preview-box{height:220px}}
@media (max-width:760px){.detail-action-grid,.detail-wallet-inline,.detail-stat-grid{grid-template-columns:1fr}.detail-hero-content h2{font-size:28px}}


.workflow-builder-shell{margin-top:10px;border:1px solid rgba(148,163,184,.18);border-radius:20px;background:rgba(7,14,26,.72);padding:18px}
.workflow-builder-head{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;margin-bottom:14px}
.workflow-builder-head h3{margin:0 0 4px;font-size:18px}
.workflow-builder-head p{margin:0;color:#9fb1cc;font-size:13px;line-height:1.5}
.workflow-builder-toolbar{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.workflow-builder-summary{padding:10px 12px;border-radius:14px;background:rgba(15,23,42,.72);border:1px solid rgba(148,163,184,.14);color:#c9d7eb;font-size:13px;margin-bottom:12px}
.workflow-builder-list{display:grid;gap:14px}
.workflow-step-card{border:1px solid rgba(148,163,184,.16);border-radius:18px;background:rgba(10,18,32,.78);padding:14px}
.workflow-step-head{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:12px}
.workflow-step-title{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.workflow-step-index{display:inline-flex;align-items:center;justify-content:center;min-width:72px;padding:7px 12px;border-radius:999px;background:rgba(37,99,235,.16);color:#bfdbfe;font-weight:700;font-size:12px;text-transform:uppercase;letter-spacing:.04em}
.workflow-step-action{min-width:220px}
.workflow-step-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.workflow-builder-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.workflow-builder-field,.workflow-builder-check{display:flex;flex-direction:column;gap:6px}
.workflow-builder-field span,.workflow-builder-check span{font-size:12px;font-weight:700;color:#d9e4f5}
.workflow-builder-field input,.workflow-builder-field select,.workflow-builder-field textarea{width:100%;border-radius:14px;border:1px solid rgba(148,163,184,.18);background:rgba(8,16,30,.86);color:#f8fbff;padding:12px 14px;resize:vertical}
.workflow-builder-check{justify-content:flex-end;padding-top:22px}
.workflow-builder-check input{margin-right:8px}
.workflow-builder-field-full{grid-column:1/-1}
.workflow-json-field textarea[data-collapsed="1"]{display:none}
.workflow-json-field textarea.workflow-json-expanded{display:block}
.workflow-toggle-row{display:flex;align-items:center;justify-content:space-between;gap:12px}
@media (max-width:960px){.workflow-builder-head,.workflow-step-head{flex-direction:column;align-items:stretch}.workflow-builder-grid{grid-template-columns:1fr}.workflow-step-action{min-width:0;width:100%}}


.order-detail-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(320px, .9fr);
  gap: 18px;
  align-items: start;
}
.order-detail-main,
.order-detail-side {
  display: grid;
  gap: 18px;
}
.order-detail-summary-head {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: flex-start;
}
.order-detail-summary-head h2 {
  margin: 10px 0 8px;
}
.order-timeline {
  display: grid;
  gap: 14px;
}
.order-timeline-item {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr);
  gap: 12px;
  align-items: start;
}
.order-timeline-item.compact {
  gap: 10px;
}
.order-timeline-dot {
  width: 12px;
  height: 12px;
  border-radius: 999px;
  background: rgba(99, 102, 241, .85);
  box-shadow: 0 0 0 5px rgba(99, 102, 241, .12);
  margin-top: 6px;
}
.order-timeline-content,
.order-timeline-item > div:last-child {
  background: rgba(15, 23, 42, .03);
  border: 1px solid rgba(148, 163, 184, .18);
  border-radius: 16px;
  padding: 14px 16px;
}
.order-timeline-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  flex-wrap: wrap;
  margin-bottom: 4px;
}
.order-timeline-meta {
  color: var(--text-soft, #64748b);
  font-size: 12px;
  margin-bottom: 6px;
}
.order-timeline-item p {
  margin: 0;
  color: var(--text-soft, #64748b);
  line-height: 1.55;
}
.payload-preview-list {
  display: grid;
  gap: 8px;
  margin-top: 10px;
}
.payload-preview-list > div {
  border: 1px dashed rgba(148, 163, 184, .28);
  border-radius: 12px;
  padding: 10px 12px;
  background: rgba(15, 23, 42, .03);
  word-break: break-word;
}
.related-orders-stack {
  display: grid;
  gap: 10px;
}
.related-order-link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border: 1px solid rgba(148, 163, 184, .18);
  border-radius: 14px;
  padding: 12px 14px;
  text-decoration: none;
  color: inherit;
  background: rgba(15, 23, 42, .03);
}
.related-order-link:hover {
  border-color: rgba(99, 102, 241, .28);
  transform: translateY(-1px);
}
.order-row-actions {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--text-soft, #64748b);
  font-size: 12px;
  margin-top: 8px;
}
.member-topbar-actions {
  display: flex;
  align-items: center;
  gap: 10px;
}
@media (max-width: 1080px) {
  .order-detail-layout {
    grid-template-columns: 1fr;
  }
}

.member-dashboard-redesign{gap:20px}
.member-topbar--compact{align-items:flex-start}
.member-hero-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}
.member-kpis--compact{margin-bottom:4px}
.member-dashboard-tabs{display:flex;flex-wrap:wrap;gap:10px;margin:6px 0 10px}
.member-dashboard-tab{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;appearance:none;border:1px solid rgba(148,163,184,.28);background:#101b31;color:#dbeafe;padding:12px 16px;border-radius:999px;font-weight:700;cursor:pointer;transition:.18s ease;box-shadow:0 10px 28px rgba(15,23,42,.2)}
.member-dashboard-tab:hover{transform:translateY(-1px);border-color:rgba(96,165,250,.45)}
.member-dashboard-tab.is-active{background:linear-gradient(135deg,#2563eb,#1d4ed8);border-color:transparent;color:#fff;box-shadow:0 16px 34px rgba(37,99,235,.28)}
.member-dashboard-panel{display:none;gap:18px}
.member-dashboard-panel.is-active{display:block}
.member-overview-grid--new{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.member-dashboard-split{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.member-dashboard-split--narrow{grid-template-columns:repeat(2,minmax(0,1fr))}
.member-shop-card,.member-assets-card,.member-support-card,.member-social-card{min-height:100%}
.member-activity-list,.member-mini-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:10px}
.member-activity-list li,.member-mini-list li{border:1px solid rgba(148,163,184,.18);background:rgba(15,23,42,.45);border-radius:14px;padding:12px 14px}
.member-activity-list li a{display:flex;flex-direction:column;gap:4px;color:inherit;text-decoration:none}
.member-activity-list li strong,.member-mini-list li strong{font-size:14px;color:#f8fafc}
.member-activity-list li span,.member-mini-list li span{font-size:13px;color:#cbd5e1}
.member-activity-list li small,.member-mini-list li small{font-size:12px;color:#94a3b8}
.member-activity-list li.tone-warning{border-color:rgba(251,191,36,.4)}
.member-activity-list li.tone-success{border-color:rgba(74,222,128,.35)}
.member-activity-list li.tone-info{border-color:rgba(96,165,250,.35)}
.member-search-inline{max-width:340px;margin-left:auto}
.member-search-inline input{min-width:220px}
.member-compact-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.member-compact-card{border:1px solid rgba(148,163,184,.18);background:rgba(15,23,42,.42);border-radius:18px;padding:16px;display:flex;flex-direction:column;gap:12px}
.member-compact-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}
.member-compact-head span{font-weight:800;color:#f8fafc;white-space:nowrap}
.member-compact-card p{margin:0;color:#cbd5e1;font-size:13px;line-height:1.55}
.member-social-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.member-social-card{position:relative;overflow:hidden;padding-top:20px}
.member-social-card::before{content:"";position:absolute;inset:0 auto 0 0;width:4px;background:var(--platform-color,#60a5fa)}
.member-social-icon{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;background:rgba(15,23,42,.45);border:1px solid rgba(148,163,184,.18);font-size:20px;font-weight:800;color:#fff;margin-bottom:12px}
.member-social-card h3{margin:0 0 6px;font-size:18px}
.member-social-card p{margin:0 0 12px;color:#cbd5e1;font-size:13px;line-height:1.55;min-height:40px}
.member-social-stats{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:12px}
.member-assets-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.compact-deposit-form{margin-top:8px}
.compact-form{display:inline-flex}
.kv.compact{gap:8px}
@media (max-width: 1200px){
  .member-social-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .member-dashboard-split--narrow{grid-template-columns:1fr}
}
@media (max-width: 900px){
  .member-overview-grid--new,.member-dashboard-split,.member-dashboard-split--narrow,.member-assets-grid,.member-social-grid,.member-compact-grid{grid-template-columns:1fr}
  .member-search-inline{max-width:none;width:100%;margin-left:0}
  .member-dashboard-tabs{overflow:auto;flex-wrap:nowrap;padding-bottom:6px}
  .member-dashboard-tab{white-space:nowrap}
}


.member-platform-main{gap:20px}
.member-platform-hero{align-items:flex-start;position:relative;overflow:hidden}
.member-platform-hero::after{content:"";position:absolute;inset:0 0 auto auto;width:160px;height:160px;border-radius:999px;background:color-mix(in srgb,var(--platform-color,#60a5fa) 24%, transparent);filter:blur(12px);transform:translate(35%,-25%)}
.member-platform-badge{width:74px;height:74px;border-radius:24px;display:grid;place-items:center;font-size:30px;font-weight:800;background:rgba(15,23,42,.5);border:1px solid rgba(148,163,184,.2);color:#fff;position:relative;z-index:1}
.member-platform-switcher{display:flex;flex-wrap:wrap;gap:12px}
.member-platform-chip{display:inline-flex;align-items:center;gap:10px;padding:12px 14px;border-radius:999px;border:1px solid rgba(148,163,184,.22);background:rgba(15,23,42,.46);color:#e2e8f0;text-decoration:none;transition:.18s ease}
.member-platform-chip:hover{transform:translateY(-1px);border-color:color-mix(in srgb,var(--platform-color,#60a5fa) 45%, rgba(148,163,184,.22))}
.member-platform-chip.is-active{background:linear-gradient(135deg,color-mix(in srgb,var(--platform-color,#60a5fa) 90%, #0f172a), #0f172a);border-color:transparent;color:#fff;box-shadow:0 16px 34px rgba(15,23,42,.22)}
.member-platform-chip-icon{width:28px;height:28px;border-radius:10px;display:grid;place-items:center;background:rgba(255,255,255,.08);font-weight:800}
.member-platform-kpis .member-kpi-card{min-height:100%}
.member-stage-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.member-stage-card{border:1px solid rgba(148,163,184,.18);border-radius:16px;background:rgba(15,23,42,.42);padding:14px;display:flex;flex-direction:column;gap:8px}
.member-stage-card strong{width:28px;height:28px;border-radius:999px;display:grid;place-items:center;background:#1d4ed8;color:#fff}
.member-empty-box{border:1px dashed rgba(148,163,184,.24);border-radius:16px;padding:18px;color:#cbd5e1;background:rgba(15,23,42,.35)}
@media (max-width:900px){.member-stage-grid{grid-template-columns:1fr}.member-platform-badge{width:56px;height:56px;font-size:24px}}

.member-overview-card,.member-shop-card,.member-assets-card,.member-support-card,.member-social-card{height:100%}
.member-social-card .kv.compact{display:flex;flex-wrap:wrap}
.member-dashboard-panel .member-section-head.compact-head{margin-bottom:12px}

.member-social-workspace-main{gap:20px;align-content:start;grid-auto-rows:max-content}
.member-social-device-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.member-social-device-card{display:flex;flex-direction:column;gap:10px;padding:16px;border-radius:18px;border:1px solid rgba(148,163,184,.18);background:rgba(15,23,42,.42);text-decoration:none;color:#e2e8f0;transition:.18s ease;min-height:100%}
.member-social-device-card:hover{transform:translateY(-1px);border-color:rgba(96,165,250,.4)}
.member-social-device-card.is-active{border-color:rgba(37,99,235,.7);box-shadow:0 18px 38px rgba(37,99,235,.18);background:linear-gradient(180deg,rgba(30,41,59,.9),rgba(15,23,42,.72))}
.member-social-device-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.member-social-device-meta{font-size:12px;color:#94a3b8;word-break:break-all}
.member-social-mini-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.member-social-mini-grid>div{border-radius:12px;border:1px solid rgba(148,163,184,.16);background:rgba(15,23,42,.45);padding:10px 8px;text-align:center}
.member-social-mini-grid strong{display:block;color:#f8fafc;font-size:15px}
.member-social-mini-grid span{display:block;color:#94a3b8;font-size:11px;margin-top:3px}
.member-social-workspace-card{display:flex;flex-direction:column;gap:14px}
.member-social-table-wrap{overflow:auto}
.member-social-table{width:100%;border-collapse:collapse;min-width:860px}
.member-social-table th,.member-social-table td{padding:12px 10px;border-bottom:1px solid rgba(148,163,184,.14);vertical-align:top;text-align:left}
.member-social-table th{font-size:12px;text-transform:uppercase;letter-spacing:.04em;color:#94a3b8;background:rgba(15,23,42,.4)}
.member-social-table td{font-size:13px;color:#e2e8f0}
.member-inline-actions{display:flex;flex-wrap:wrap;gap:8px}
.member-inline-actions form{margin:0}
.member-import-form{margin-top:10px;padding-top:10px;border-top:1px dashed rgba(148,163,184,.18)}
.member-format-box{border:1px dashed rgba(148,163,184,.28);background:rgba(15,23,42,.38);border-radius:14px;padding:14px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;line-height:1.7;color:#cbd5e1}
.member-social-device-focus .member-context-grid-two{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.member-social-device-focus .member-context-card{border-radius:14px;padding:14px;border:1px solid rgba(148,163,184,.18);background:rgba(15,23,42,.42)}
.member-social-device-focus .member-context-card span{display:block;color:#94a3b8;font-size:12px;margin-bottom:6px}
.member-social-device-focus .member-context-card strong{display:block;color:#f8fafc;font-size:14px;word-break:break-word}
@media (max-width: 1200px){.member-social-device-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.member-social-device-focus .member-context-grid-two{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width: 800px){.member-social-device-grid,.member-social-device-focus .member-context-grid-two,.member-social-mini-grid{grid-template-columns:1fr}.member-social-table{min-width:720px}}

.member-social-mini-grid--runtime {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.member-runtime-frame-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 12px;
}
.member-runtime-frame-card {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 10px;
  border: 1px solid rgba(148,163,184,.28);
  border-radius: 14px;
  background: rgba(15,23,42,.03);
  text-decoration: none;
  color: inherit;
}
.member-runtime-frame-card img {
  width: 100%;
  aspect-ratio: 9 / 16;
  object-fit: cover;
  border-radius: 12px;
  border: 1px solid rgba(148,163,184,.25);
  background: #0f172a;
}
.member-runtime-frame-card span {
  font-size: 12px;
  color: #64748b;
}
.member-log-context {
  white-space: pre-wrap;
  word-break: break-word;
  max-width: 520px;
}
@media (max-width: 900px) {
  .member-social-mini-grid--runtime {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}


.member-social-admin-tabs{display:flex;flex-wrap:wrap;gap:12px;margin-top:4px}
.member-social-admin-tab{display:inline-flex;align-items:center;justify-content:center;padding:12px 18px;border-radius:16px;border:1px solid rgba(148,163,184,.18);background:rgba(15,23,42,.42);text-decoration:none;color:#e2e8f0;font-weight:700;transition:.18s ease}
.member-social-admin-tab:hover{transform:translateY(-1px);border-color:rgba(96,165,250,.35);background:rgba(15,23,42,.56)}
.member-social-admin-tab.is-active{background:linear-gradient(135deg,rgba(37,99,235,.95),rgba(59,130,246,.72));border-color:rgba(96,165,250,.6);box-shadow:0 16px 34px rgba(37,99,235,.2)}
.member-social-workspace-main .member-dashboard-panel{display:none}
.member-social-workspace-main .member-dashboard-panel.is-active{display:block}
.member-social-workspace-main .member-social-section{display:block;margin-top:18px}
.member-social-workspace-main .member-social-section:first-of-type{margin-top:0}
.member-social-hero-meta{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}
.member-social-workspace-main .member-hero-actions{display:none}
.member-social-workspace-main .member-dashboard-tabs{display:none}
.member-social-workspace-main .member-section-head.compact-head{scroll-margin-top:96px}
.member-social-workspace-main .member-social-workspace-card,
.member-social-workspace-main .member-support-card,
.member-social-workspace-main .member-overview-card{margin-top:0}
@media (max-width: 900px){
  .member-social-hero-meta{gap:8px}
}

@media (max-width: 900px){.member-social-admin-tabs{gap:10px;overflow:auto;padding-bottom:4px}.member-social-admin-tab{white-space:nowrap;padding:11px 14px}}

/* Compact user social modules */
.member-social-workspace-main{gap:14px;align-content:start;grid-auto-rows:max-content}
.member-social-workspace-main .card{padding:14px 15px;border-radius:16px}
.member-social-workspace-main .card-title{font-size:18px;line-height:1.2;margin-bottom:4px}
.member-social-workspace-main .card-sub{font-size:12px;line-height:1.45;color:#9fb0cd}
.member-social-admin-tabs{display:flex;align-items:flex-start;gap:8px;margin-top:0;margin-bottom:4px;overflow-x:auto;overflow-y:hidden;padding-bottom:2px;flex-wrap:nowrap;min-height:auto;height:auto}
.member-social-admin-tab{display:inline-flex;flex:0 0 auto;align-items:center;justify-content:center;align-self:flex-start;padding:8px 12px;border-radius:13px;font-size:12.5px;line-height:1.15;white-space:nowrap;min-height:40px;height:40px;max-height:40px;writing-mode:horizontal-tb}
.member-social-workspace-main .member-kpi-grid{gap:10px}
.member-social-workspace-main .member-kpi-card{padding:12px 13px;border-radius:14px}
.member-social-workspace-main .member-kpi-label{font-size:12px}
.member-social-workspace-main .member-kpi-value{font-size:24px}
.member-social-device-grid{gap:10px}
.member-social-device-card{padding:12px;border-radius:15px;gap:8px}
.member-social-device-meta{font-size:11px}
.member-social-mini-grid{gap:6px}
.member-social-mini-grid>div{padding:8px 6px;border-radius:10px}
.member-social-mini-grid strong{font-size:14px}
.member-social-mini-grid span{font-size:10px}
.member-social-device-focus .member-context-grid-two{gap:10px}
.member-social-device-focus .member-context-card{padding:11px 12px;border-radius:12px}
.member-social-device-focus .member-context-card span{font-size:11px;margin-bottom:4px}
.member-social-device-focus .member-context-card strong{font-size:13px}
.member-social-workspace-card{gap:10px}
.member-social-workspace-card .compact-head{gap:8px;align-items:flex-start}
.member-social-workspace-card .compact-head .kv.compact{gap:6px}
.member-social-workspace-card .forms{gap:10px}
.member-social-workspace-card .field-grid,.member-social-workspace-card .field-grid-2{gap:10px}
.member-social-workspace-card .field span{font-size:12px;margin-bottom:5px}
.member-social-workspace-card input,
.member-social-workspace-card select,
.member-social-workspace-card textarea{min-height:40px;padding:10px 12px;border-radius:12px;font-size:13px}
.member-social-workspace-card textarea{min-height:110px}
.member-social-workspace-card .form-actions{gap:8px;margin-top:2px}
.member-social-workspace-card .footer-note{font-size:12px}
.member-social-table-wrap{border-radius:14px}
.member-social-table{min-width:760px}
.member-social-table th,.member-social-table td{padding:10px 9px;font-size:12.5px}
.member-social-table th{font-size:11px;letter-spacing:.05em}
.member-social-table td .row-sub{margin-top:3px;font-size:11px;line-height:1.35;color:#94a3b8}
.member-social-table td:last-child{width:1%;white-space:nowrap}
.member-inline-actions{display:flex;flex-wrap:nowrap;align-items:center;gap:6px}
.member-inline-actions form{display:inline-flex;margin:0}
.member-inline-actions .btn{min-height:34px;padding:7px 11px;border-radius:10px;box-shadow:none;font-size:12px}
.member-inline-actions--single .btn{min-width:auto}
.member-runtime-frame-grid{gap:10px}
.member-runtime-frame-card{border-radius:12px;padding:8px}
.member-mini-list li{padding:9px 0}
.member-social-workspace-main .soft-pill{font-size:11px;padding:6px 9px;border-radius:999px}
.member-social-workspace-main .kv.compact{gap:6px}
.member-social-workspace-main .btn.sm{min-height:34px;padding:7px 11px;border-radius:10px;font-size:12px;box-shadow:none}
.member-social-workspace-main .btn.secondary.sm{background:rgba(255,255,255,.04)}
.member-social-workspace-main .member-empty-box{padding:14px 16px;border-radius:14px;font-size:13px}
@media (max-width: 900px){
  .member-social-workspace-main .card{padding:13px}
  .member-social-admin-tab{padding:7px 10px;font-size:12px;min-height:36px;height:36px;max-height:36px}
  .member-social-table{min-width:680px}
  .member-social-table th,.member-social-table td{padding:9px 8px}
}


.member-view-wall-card {
  margin-bottom: 14px;
}
.member-device-wall-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 16px;
}
.member-device-wall-item {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 12px;
  border-radius: 24px;
  background: linear-gradient(180deg, rgba(11,18,36,.94), rgba(16,27,58,.92));
  border: 1px solid rgba(255,255,255,.08);
  box-shadow: 0 18px 30px rgba(2,6,23,.24);
  text-decoration: none;
  color: inherit;
}
.member-device-wall-item.is-active {
  border-color: rgba(96,165,250,.6);
  box-shadow: 0 20px 34px rgba(59,130,246,.18);
}
.member-device-wall-top,
.member-device-wall-bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.member-device-wall-name {
  font-size: 13px;
  font-weight: 800;
  color: #e5eefc;
}
.member-phone-shell {
  position: relative;
  aspect-ratio: 9 / 19;
  border-radius: 28px;
  padding: 10px;
  background: linear-gradient(180deg, #0f172a, #111827);
  border: 2px solid rgba(255,255,255,.08);
  overflow: hidden;
  display: flex;
  align-items: stretch;
  justify-content: stretch;
}
.member-phone-shell::before {
  content: '';
  position: absolute;
  top: 6px;
  left: 50%;
  transform: translateX(-50%);
  width: 40%;
  height: 10px;
  border-radius: 999px;
  background: rgba(15,23,42,.85);
  z-index: 2;
}
.member-phone-shell img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 20px;
  display: block;
}
.member-phone-empty {
  width: 100%;
  min-height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  color: #94a3b8;
  font-size: 12px;
  border-radius: 20px;
  background: rgba(15,23,42,.85);
}
.member-device-wall-bottom {
  font-size: 11px;
  color: #9fb3d9;
}
.member-device-wall-bottom strong {
  font-size: 11px;
  color: #e5eefc;
  font-weight: 700;
}
@media (max-width: 768px) {
  .member-device-wall-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }
  .member-device-wall-item {
    padding: 10px;
    border-radius: 20px;
  }
}
@media (max-width: 520px) {
  .member-device-wall-grid {
    grid-template-columns: 1fr;
  }
}


.member-view-wall-card--youtube {padding: 16px 16px 18px;}
.member-viewwall-head {align-items:flex-end; gap:12px;}
.member-viewwall-tools {display:flex; align-items:center; gap:12px; flex-wrap:wrap;}
.member-viewwall-zoom-control {display:flex; align-items:center; gap:10px; padding:8px 12px; border-radius:14px; background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.08);}
.member-viewwall-zoom-control span {font-size:12px; font-weight:700; color:#cbd5e1; white-space:nowrap;}
.member-viewwall-zoom-control input[type="range"] {width:140px; accent-color:#3b82f6;}
.member-device-wall-grid--youtube {--member-wall-zoom:1; --member-wall-card-width:calc(210px * var(--member-wall-zoom)); grid-template-columns:repeat(auto-fill,minmax(var(--member-wall-card-width),var(--member-wall-card-width))); justify-content:center; gap:18px; align-items:start; transition:grid-template-columns .18s ease, gap .18s ease;}
.member-device-wall-item--youtube {width:var(--member-wall-card-width); padding:0; gap:0; overflow:hidden; border-radius:26px; background:linear-gradient(180deg, rgba(10,12,18,.98), rgba(22,26,42,.95)); transition:width .18s ease, transform .18s ease;}
.member-device-wall-focus {display:block; color:inherit; text-decoration:none;}
.member-device-wall-focus:hover {text-decoration:none;}
.member-device-phone-frame {padding: 12px 12px 10px;}
.member-device-phone-badges {display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:8px;}
.member-device-day-badge {display:inline-flex; align-items:center; justify-content:center; min-width:72px; padding:5px 10px; border-radius:10px; font-size:12px; font-weight:900; color:#fff; background:linear-gradient(135deg,#ef4444,#dc2626); box-shadow:0 10px 20px rgba(239,68,68,.22);}
.member-device-day-badge.is-tone-1 {background:linear-gradient(135deg,#ef4444,#dc2626); box-shadow:0 12px 22px rgba(239,68,68,.28);}
.member-device-day-badge.is-tone-2 {background:linear-gradient(135deg,#8b5cf6,#6d28d9); box-shadow:0 12px 22px rgba(139,92,246,.28);}
.member-device-day-badge.is-tone-3 {background:linear-gradient(135deg,#06b6d4,#2563eb); box-shadow:0 12px 22px rgba(37,99,235,.28);}
.member-device-day-badge.is-tone-4 {background:linear-gradient(135deg,#10b981,#059669); box-shadow:0 12px 22px rgba(16,185,129,.28);}
.member-device-day-badge.is-tone-5 {background:linear-gradient(135deg,#f59e0b,#ea580c); box-shadow:0 12px 22px rgba(245,158,11,.28);}
.member-device-day-badge.is-tone-6 {background:linear-gradient(135deg,#ec4899,#be185d); box-shadow:0 12px 22px rgba(236,72,153,.28);}
.member-device-capacity-badge {display:inline-flex; align-items:center; justify-content:center; min-width:58px; padding:4px 8px; border-radius:999px; font-size:11px; font-weight:700; color:#e2e8f0; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.1);}
.member-phone-shell--youtube {padding: 14px 14px 56px; border-radius: 34px; background: linear-gradient(180deg, #2b3142 0%, #111827 60%, #0b1220 100%); border:2px solid rgba(255,255,255,.14); box-shadow:inset 0 1px 0 rgba(255,255,255,.16), inset 0 -2px 6px rgba(0,0,0,.35), 0 20px 40px rgba(2,6,23,.32); overflow:visible;}
.member-phone-shell--youtube::before {top:8px; width:42%; height:12px; border-radius:999px; background:linear-gradient(180deg, rgba(6,10,18,.95), rgba(22,28,40,.92)); box-shadow:inset 0 -1px 0 rgba(255,255,255,.05);}
.member-phone-camera-dot {position:absolute; top:12px; left:50%; transform:translateX(-50%); z-index:3; width:8px; height:8px; border-radius:999px; background:#0f172a; box-shadow:0 0 0 2px rgba(255,255,255,.08), inset 0 0 0 1px rgba(255,255,255,.06);}
.member-phone-side-icons {position:absolute; left:-16px; top:50%; transform:translateY(-50%); z-index:4; display:flex; flex-direction:column; gap:10px;}
.member-phone-side-icon {display:inline-flex; align-items:center; justify-content:center; width:28px; height:28px; border-radius:999px; color:#fff; font-size:12px; font-weight:900; background:rgba(15,23,42,.92); border:1px solid rgba(255,255,255,.18); box-shadow:0 10px 16px rgba(2,6,23,.28); backdrop-filter:blur(8px);}
.member-phone-mini-actions {position:absolute; right:10px; bottom:14px; z-index:3; display:flex; gap:6px;}
.member-phone-mini-actions span {display:inline-flex; align-items:center; justify-content:center; min-width:42px; padding:5px 8px; border-radius:7px; font-size:10px; font-weight:800; color:#fff; background:rgba(15,23,42,.88); border:1px solid rgba(255,255,255,.12); box-shadow:0 8px 16px rgba(2,6,23,.18);}
.member-phone-home-indicator {position:absolute; left:50%; bottom:10px; transform:translateX(-50%); z-index:3; width:34%; height:5px; border-radius:999px; background:rgba(255,255,255,.22); box-shadow:0 1px 0 rgba(255,255,255,.08);}
.member-phone-bottom-foot {position:absolute; left:50%; bottom:-12px; transform:translateX(-50%); z-index:1; width:54%; height:18px; border-radius:0 0 20px 20px; background:linear-gradient(180deg, rgba(18,24,38,.96), rgba(8,12,20,.96)); box-shadow:0 10px 18px rgba(2,6,23,.28);}
.member-device-wall-meta {padding: 2px 12px 14px; display:flex; flex-direction:column; gap:10px;}

.member-device-wall-accordion {display:grid; grid-template-rows:0fr; opacity:0; transform:translateY(-6px); transition:grid-template-rows .28s ease, opacity .24s ease, transform .24s ease, margin-top .24s ease; margin-top:0; overflow:hidden;}
.member-device-wall-accordion > * {min-height:0;}
.member-device-wall-item--youtube.is-active .member-device-wall-accordion {grid-template-rows:1fr; opacity:1; transform:translateY(0); margin-top:2px;}
.member-device-wall-detail {display:flex; flex-direction:column; gap:10px; overflow:hidden;}
.member-device-inline-actions--collapsible {display:grid; overflow:hidden;}
.member-device-wall-item--youtube .member-device-wall-top {padding-bottom:2px;}
.member-device-wall-item--youtube:not(.is-active) .member-device-wall-meta {padding-bottom:10px;}
.member-device-wall-item--youtube:not(.is-active) .member-device-wall-focus {cursor:pointer;}

.member-device-wall-script {display:flex; flex-direction:column; gap:4px; padding:10px 12px; border-radius:14px; background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.06);}
.member-device-wall-script span {font-size:11px; color:#8ea3c7; text-transform:uppercase; letter-spacing:.04em;}
.member-device-wall-script strong {font-size:13px; color:#f8fafc; font-weight:800;}
.member-device-wall-script--compact {display:flex; margin-top:2px;}
.member-device-wall-script--compact strong {display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.member-device-wall-item--youtube.is-active .member-device-wall-script--compact {display:none;}
.member-device-inline-actions {display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; padding:0 12px 14px;}
.member-device-inline-action {display:inline-flex; align-items:center; justify-content:center; min-height:34px; padding:8px 10px; border-radius:12px; text-decoration:none; text-align:center; font-size:11px; font-weight:800; color:#e2e8f0; background:rgba(15,23,42,.72); border:1px solid rgba(255,255,255,.08); transition:transform .16s ease, background .16s ease, border-color .16s ease;}
.member-device-inline-action:hover {transform:translateY(-1px); background:rgba(30,41,59,.88); border-color:rgba(96,165,250,.3);}
.member-device-action-sheet {margin-top: 14px;}
.member-device-action-grid {display:grid; grid-template-columns:repeat(auto-fit,minmax(170px,1fr)); gap:12px; margin-bottom:14px;}
.member-device-action-card {display:flex; flex-direction:column; gap:6px; padding:14px; border-radius:16px; text-decoration:none; color:inherit; background:linear-gradient(180deg, rgba(15,23,42,.9), rgba(17,24,39,.82)); border:1px solid rgba(255,255,255,.06); box-shadow:0 12px 24px rgba(2,6,23,.12);}
.member-device-action-card strong {font-size:14px; color:#eff6ff; font-weight:800;}
.member-device-action-card span {font-size:12px; color:#94a3b8; line-height:1.5;}
.member-context-grid-two--compact .member-context-card {padding:10px 12px; border-radius:14px;}
@media (max-width: 900px){
  .member-viewwall-head {align-items:flex-start;}
  .member-viewwall-tools {width:100%; justify-content:space-between;}
  .member-viewwall-zoom-control {width:100%; justify-content:space-between;}
  .member-viewwall-zoom-control input[type="range"] {flex:1; min-width:110px;}
  .member-device-wall-grid--youtube {--member-wall-card-width:min(100%, calc(200px * var(--member-wall-zoom))); grid-template-columns: repeat(auto-fill, minmax(var(--member-wall-card-width), var(--member-wall-card-width))); justify-content:center; gap:12px;}
  .member-phone-slot-overlay {font-size:14px; padding:8px 18px;}
  .member-device-inline-actions {grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media (max-width: 560px){
  .member-device-wall-grid--youtube {--member-wall-card-width:min(100%, calc(100vw - 48px)); grid-template-columns:1fr; justify-content:stretch;}
  .member-device-wall-item--youtube {width:100%;}
  .member-device-action-grid {grid-template-columns:1fr;}
  .member-phone-mini-actions span {min-width: 38px; padding: 5px 6px;}
  .member-phone-side-icons {left:-10px; gap:8px;}
  .member-phone-side-icon {width:24px; height:24px; font-size:11px;}
  .member-device-inline-actions {grid-template-columns:1fr 1fr;}
}

}


.member-social-mini-grid--wall {grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; margin-top:2px;}
.member-social-mini-grid--wall div {padding:8px 6px; border-radius:12px; background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.06); text-align:center;}
.member-social-mini-grid--wall strong {font-size:14px; color:#f8fafc;}
.member-social-mini-grid--wall span {font-size:10px; color:#9fb0cc;}
.member-device-inline-grid--tight {grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin-top:0;}
.member-device-inline-grid--tight .member-device-inline-stat {padding:8px 10px; min-height:auto;}
.member-device-inline-grid--tight .member-device-inline-stat span {font-size:10px;}
.member-device-inline-grid--tight .member-device-inline-stat strong {font-size:12px; word-break:break-all;}
@media (max-width: 900px){
  .member-social-mini-grid--wall {grid-template-columns:repeat(2,minmax(0,1fr));}
}


.member-collapse-actions{flex-wrap:wrap;justify-content:flex-end}
.member-collapsible-box{display:flex;flex-direction:column;gap:12px}
.member-empty-box.compact-empty{padding:14px 16px;font-size:13px}

.member-proxy-mode-nav { gap: 10px; }
.member-proxy-mode-nav .member-tab-link { min-height: 40px; padding: 0 16px; }
.compact-inline-form { margin: 0; }
.compact-inline-grid { display: grid; grid-template-columns: minmax(180px, 1fr) auto; gap: 10px; align-items: center; }
.compact-inline-grid input,
.compact-inline-grid select { min-height: 40px; }
.compact-note { margin-top: 8px; min-height: 18px; }
.btn.compact { min-height: 40px; padding: 0 14px; }
.table-subline { margin-top: 6px; font-size: 12px; color: var(--muted); word-break: break-all; }
@media (max-width: 760px) {
  .compact-inline-grid { grid-template-columns: 1fr; }
  .member-proxy-mode-nav { width: 100%; overflow-x: auto; }
}


.member-proxy-toolbar{display:flex;gap:10px;justify-content:space-between;align-items:center;flex-wrap:wrap;margin:10px 0 14px}
.member-proxy-search-form{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.member-proxy-search-form input[type="text"]{min-width:260px;height:34px;border-radius:10px;padding:0 12px;background:#fff;color:#111827;border:1px solid rgba(148,163,184,.35)}
.compact-inline-grid--proxy{grid-template-columns:minmax(190px,1fr) auto}
.member-inline-actions--proxy{justify-content:flex-end;gap:8px;align-items:center;flex-wrap:wrap}
.member-inline-actions--proxy .compact-note{display:none}
@media (max-width: 720px){.member-proxy-search-form input[type="text"]{min-width:unset;width:100%}.member-proxy-toolbar{align-items:stretch}.member-proxy-search-form{width:100%}}


.member-proxy-bulk-actions{display:grid;gap:8px;align-items:start}.member-proxy-import-box{margin-top:10px;padding:12px;border:1px solid rgba(255,255,255,.08);border-radius:14px;background:rgba(255,255,255,.03)}
@media (min-width: 960px){.member-proxy-bulk-actions{grid-auto-flow:column;justify-content:start}}


/* YouTube-like compact layout for all user social modules */
.member-social-workspace-main .member-kpis.member-platform-kpis{display:none}
.member-social-workspace-main .member-social-device-focus{display:none}
.member-social-workspace-main .member-overview-card{display:none}
.member-social-device-panel--compact{margin-top:0}
.member-social-device-panel--compact .member-section-head.compact-head{margin-bottom:10px}
.member-social-device-panel--compact .card-title{margin-bottom:2px}
.member-social-device-panel--compact .card-sub{max-width:820px}
.member-social-workspace-main .member-dashboard-panel{margin-top:12px}
.member-social-workspace-main .member-dashboard-panel:first-of-type{margin-top:0}

.member-search-static{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;padding:12px}
.member-search-static-item{padding:10px 12px;border-radius:14px;background:rgba(255,255,255,.05);border:1px solid rgba(148,163,184,.14)}
.member-search-static-item span{display:block;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:#9fb0cb;margin-bottom:6px}
.member-search-static-item strong{display:block;font-size:15px;color:#f8fbff;word-break:break-word}
.member-side-card-upgrade{background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.03))}
.member-social-stage-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.member-social-stage-card{border:1px solid rgba(148,163,184,.16);border-radius:18px;padding:16px;background:rgba(15,23,42,.42);display:flex;flex-direction:column;gap:8px}
.member-social-stage-card span{width:30px;height:30px;border-radius:999px;display:grid;place-items:center;background:rgba(37,99,235,.22);color:#dbeafe;font-weight:800}
.member-social-stage-card strong{font-size:15px;color:#f8fbff}
.member-social-stage-card small{color:#cbd5e1;line-height:1.55}
.reveal-on-scroll{opacity:0;transform:translateY(16px);transition:opacity .45s ease,transform .45s ease}
.reveal-on-scroll.is-visible{opacity:1;transform:none}
.portal-kicker{display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border-radius:999px;background:rgba(96,165,250,.14);border:1px solid rgba(96,165,250,.22);font-size:12px;font-weight:800;color:#dbeafe;letter-spacing:.08em;text-transform:uppercase}
.public-store-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.public-hero-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr);gap:22px;align-items:stretch}
.public-stat-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.public-stat-card{padding:18px;border-radius:20px;border:1px solid rgba(148,163,184,.14);background:rgba(255,255,255,.04)}
.public-stat-card span{display:block;font-size:12px;color:#9fb0cb;text-transform:uppercase;letter-spacing:.08em;margin-bottom:8px}
.public-stat-card strong{display:block;font-size:28px;line-height:1.05;color:#fff}
.public-store-card{height:100%;display:flex;flex-direction:column;gap:14px}
.public-store-card .member-price{margin-bottom:0}
.public-feature-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.public-feature-card{padding:18px;border-radius:20px;border:1px solid rgba(148,163,184,.14);background:rgba(255,255,255,.04)}
.public-feature-card h3{margin:0 0 8px;font-size:18px}
.public-feature-card p{margin:0;color:#cbd5e1;line-height:1.65}
.faq-grid{display:grid;gap:12px}
.faq-item{padding:18px;border-radius:18px;border:1px solid rgba(148,163,184,.14);background:rgba(255,255,255,.04)}
.faq-item h3{margin:0 0 8px;font-size:17px}
.faq-item p{margin:0;color:#cbd5e1;line-height:1.7}
.copy-feedback{font-size:13px;color:#bfdbfe;margin-top:8px}
@media (max-width:1120px){.member-search-static,.member-social-stage-grid,.public-store-grid,.public-feature-grid,.public-hero-grid{grid-template-columns:1fr}.public-stat-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:720px){.member-search-static,.public-stat-grid{grid-template-columns:1fr}.member-social-stage-grid{grid-template-columns:1fr}.public-feature-grid,.public-store-grid{grid-template-columns:1fr}}

.portal-card{display:block;text-decoration:none;transition:transform .22s ease,border-color .22s ease,background .22s ease}
.portal-card:hover{transform:translateY(-4px);border-color:rgba(104,168,255,.34);background:rgba(255,255,255,.05)}
.portal-card h3{margin:14px 0 10px}
.portal-card p{margin:0;color:#bfd0e8;line-height:1.72}
.portal-card .soft-pill{display:inline-flex}

.table-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.payload-preview{margin:0;padding:14px 16px;border-radius:18px;background:rgba(8,17,31,.72);border:1px solid rgba(148,163,184,.16);font-size:13px;line-height:1.6;white-space:pre-wrap;word-break:break-word;max-height:320px;overflow:auto}

.support-thread{display:grid;gap:12px;margin-top:8px}
.support-thread-item{display:grid;gap:8px}
.support-thread-item.from-admin{justify-items:end}
.support-thread-item.is-internal .support-thread-bubble{border-style:dashed;opacity:.92}
.support-thread-meta{display:flex;gap:10px;align-items:center;font-size:12px;color:var(--muted,#8ea0b8)}
.support-thread-bubble{max-width:min(100%,720px);padding:14px 16px;border-radius:18px;border:1px solid rgba(148,163,184,.18);background:rgba(15,23,42,.72);line-height:1.65;white-space:normal}
.support-thread-item.from-admin .support-thread-bubble{background:rgba(30,64,175,.18);border-color:rgba(96,165,250,.28)}
.support-thread-item.from-member .support-thread-bubble{background:rgba(15,23,42,.76)}
.ops-action-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.ops-action-card{display:grid;gap:8px;text-decoration:none;color:inherit;min-height:108px;align-content:flex-start}
.ops-action-card strong{font-size:16px}
.ops-action-card span{color:var(--muted,#8ea0b8);line-height:1.55}
.support-detail-side .detail-stack{gap:16px}
.support-admin-shell .ticket-stack-admin{max-height:none}
@media (max-width: 1080px){.ops-action-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width: 720px){.ops-action-grid{grid-template-columns:1fr}.support-thread-bubble{max-width:100%}}


.inline-code-wrap{display:block;word-break:break-all;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;line-height:1.5;color:#c9d8ff}
.automation-alert-card{gap:10px}
.automation-health-grid{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}
.automation-center-main .table-wrap table td{vertical-align:top}
.ops-action-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}
.ops-action-card span{display:block;margin-top:8px;color:#9fb0d3;line-height:1.55}
@media (max-width: 900px){.automation-health-grid{grid-template-columns:1fr}.inline-code-wrap{font-size:11px}}