:root {
  --app-bg: #f4f6fb;
  --surface: #ffffff;
  --surface-soft: #f8fafc;
  --border: #e8ebf2;
  --text: #182230;
  --muted: #667085;
  --primary: #6d5dfc;
  --primary-dark: #5948eb;
  --sidebar: #111827;
  --sidebar-soft: #1c2637;
  --success: #12b76a;
  --danger: #f04438;
  --shadow: 0 12px 32px rgba(16, 24, 40, .07);
}
html.dark {
  --app-bg: #0c111d;
  --surface: #161d2b;
  --surface-soft: #1d2636;
  --border: #293448;
  --text: #f2f4f7;
  --muted: #98a2b3;
  --sidebar: #090d16;
  --sidebar-soft: #151d2b;
  color-scheme: dark;
}
* { box-sizing: border-box; }
body { margin: 0; color: var(--text); background: var(--app-bg); font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
button, input { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
.eyebrow { margin: 0 0 5px; color: var(--primary); font-size: 10px; font-weight: 800; letter-spacing: .16em; }
.brand-mark { display: grid; width: 38px; height: 38px; flex: 0 0 38px; place-items: center; border-radius: 12px; color: white; background: linear-gradient(145deg, #8877ff, #5745e7); box-shadow: 0 8px 22px rgba(109, 93, 252, .34); font-weight: 900; }
.brand-mark span { transform: skew(-8deg); }
.brand-mark-lg { width: 52px; height: 52px; border-radius: 16px; font-size: 21px; }
.auth-body { min-height: 100vh; background: #0b1020; }
.auth-shell { display: grid; min-height: 100vh; grid-template-columns: minmax(340px, .95fr) minmax(420px, 1.05fr); }
.auth-brand-panel { position: relative; display: flex; overflow: hidden; padding: clamp(38px, 7vw, 100px); color: white; background: radial-gradient(circle at 20% 15%, rgba(119, 95, 255, .42), transparent 34%), radial-gradient(circle at 88% 80%, rgba(19, 176, 246, .2), transparent 28%), linear-gradient(145deg, rgba(17,25,51,.90), rgba(11,16,32,.94)),var(--login-bg,none) center/cover; flex-direction: column; justify-content: space-between; }
.auth-brand-panel::after { position: absolute; right: -120px; bottom: 10%; width: 360px; height: 360px; border: 1px solid rgba(255,255,255,.08); border-radius: 50%; box-shadow: 0 0 0 60px rgba(255,255,255,.025), 0 0 0 120px rgba(255,255,255,.015); content: ""; }
.auth-brand-panel h1 { max-width: 560px; margin: 16px 0 10px; font-size: clamp(36px, 5vw, 66px); font-weight: 750; letter-spacing: -.045em; line-height: 1; }
.auth-lead { max-width: 520px; margin: 0; color: #aeb9d0; font-size: 17px; line-height: 1.75; }
.security-points { z-index: 1; display: flex; gap: 10px; flex-wrap: wrap; }
.security-points span { display: inline-flex; padding: 9px 12px; border: 1px solid rgba(255,255,255,.1); border-radius: 10px; color: #c9d1e3; background: rgba(255,255,255,.04); align-items: center; gap: 8px; font-size: 12px; backdrop-filter: blur(8px); }
.security-points i { color: #8f82ff; }
.auth-form-panel { display: flex; padding: 36px; background: #f7f8fb; align-items: center; justify-content: center; flex-direction: column; }
.login-card { width: min(100%, 440px); padding: clamp(28px, 5vw, 46px); border: 1px solid #e9ebf2; border-radius: 24px; background: white; box-shadow: 0 20px 60px rgba(20, 25, 45, .1); }
.login-heading { margin-bottom: 28px; }
.login-heading h2 { margin: 6px 0 8px; color: #172033; font-size: 27px; letter-spacing: -.03em; }
.login-heading > p:last-child { margin: 0; color: #7b8497; font-size: 13px; }
.login-icon { display: grid; width: 44px; height: 44px; margin-bottom: 20px; border-radius: 13px; color: var(--primary); background: #eeecff; place-items: center; font-size: 19px; }
.login-form { display: flex; gap: 18px; flex-direction: column; }
.login-form label > span { display: block; margin-bottom: 7px; color: #344054; font-size: 12px; font-weight: 650; }
.input-wrap { display: flex; height: 48px; padding: 0 14px; border: 1px solid #dfe3eb; border-radius: 11px; background: #fff; align-items: center; gap: 10px; transition: .2s; }
.input-wrap:focus-within { border-color: var(--primary); box-shadow: 0 0 0 3px rgba(109, 93, 252, .12); }
.input-wrap i { color: #98a2b3; }
.input-wrap input { width: 100%; height: 100%; outline: 0; border: 0; color: #1d2939; background: transparent; font-size: 13px; }
.primary-button { display: flex; height: 48px; margin-top: 3px; cursor: pointer; border: 0; border-radius: 11px; color: white; background: var(--primary); box-shadow: 0 8px 20px rgba(109,93,252,.22); align-items: center; justify-content: center; gap: 8px; font-size: 13px; font-weight: 700; transition: .2s; }
.primary-button:hover { background: var(--primary-dark); transform: translateY(-1px); }
.login-note { display: flex; margin: 24px 0 0; color: #7b8497; align-items: center; justify-content: center; gap: 7px; font-size: 11px; }
.login-note i { color: var(--success); }
.auth-footer { margin: 24px 0 0; color: #98a2b3; font-size: 11px; }
.alert { display: flex; padding: 12px 14px; margin: 0 0 20px; border-radius: 10px; align-items: flex-start; gap: 9px; font-size: 12px; line-height: 1.5; }
.alert-danger { color: #9b2c25; background: #fff0ef; border: 1px solid #ffd5d2; }
.app-frame { display: flex; min-height: 100vh; }
.sidebar { position: fixed; z-index: 30; top: 0; bottom: 0; left: 0; display: flex; width: 258px; padding: 18px 14px; color: #d1d7e3; background: var(--sidebar); flex-direction: column; }
.sidebar-brand { display: flex; height: 58px; padding: 0 7px; align-items: center; justify-content: space-between; }
.brand-link { display: flex; color: white; text-decoration: none; align-items: center; gap: 11px; }
.brand-copy { display: flex; flex-direction: column; }
.brand-copy strong { max-width: 160px; overflow: hidden; font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }
.brand-copy small { margin-top: 2px; color: #758096; font-size: 8px; font-weight: 800; letter-spacing: .14em; }
.sidebar-nav { flex: 1; padding: 17px 0; }
.nav-label { padding: 0 12px; margin: 19px 0 8px; color: #69758b; font-size: 9px; font-weight: 800; letter-spacing: .15em; }
.nav-item { display: flex; min-height: 43px; padding: 0 12px; border-radius: 10px; color: #9ca7bb; text-decoration: none; align-items: center; gap: 12px; font-size: 12px; font-weight: 580; }
.nav-item i { width: 18px; font-size: 17px; text-align: center; }
.nav-item:hover:not(.disabled), .nav-item.active { color: white; background: var(--sidebar-soft); }
.nav-item.active { box-shadow: inset 3px 0 var(--primary); }
.nav-item small { padding: 2px 6px; margin-left: auto; border-radius: 5px; color: #68758b; background: rgba(255,255,255,.04); font-size: 8px; text-transform: uppercase; }
.nav-item.disabled { cursor: default; opacity: .68; }
.sidebar-security { display: flex; padding: 13px; border: 1px solid rgba(255,255,255,.07); border-radius: 12px; background: rgba(255,255,255,.035); align-items: center; gap: 10px; }
.sidebar-security div { display: flex; flex-direction: column; }
.sidebar-security strong { color: #cbd3e0; font-size: 10px; }
.sidebar-security div > span { margin-top: 3px; color: #6f7b90; font-size: 8px; }
.sidebar-security div > span b { display: inline-block; width: 5px; height: 5px; margin-right: 4px; border-radius: 50%; background: #ff3347; box-shadow: 0 0 0 0 rgba(255,51,71,.5); vertical-align: 1px; animation: security-dot 3s ease-out infinite; }
.security-monitor-icon { position: relative; display: grid; width: 34px; height: 34px; flex: 0 0 34px; margin: 0; border: 1px solid rgba(143,130,255,.25); border-radius: 10px; color: #8f82ff; background: rgba(109,93,252,.09); place-items: center; font-size: 20px; animation: security-watch 3s ease-in-out infinite; }
.security-monitor-icon::before, .security-monitor-icon::after { position: absolute; pointer-events: none; content: ""; }
.security-monitor-icon::before { z-index: 2; width: 18px; height: 2px; border-radius: 2px; background: linear-gradient(90deg, transparent, #ff3347, transparent); box-shadow: 0 0 8px rgba(255,51,71,.85); opacity: 0; animation: security-icon-scan 3s ease-in-out infinite; }
.security-monitor-icon::after { inset: -5px; border: 1px solid rgba(255,51,71,.46); border-radius: 13px; opacity: 0; animation: security-ring 3s ease-out infinite; }
.sidebar-close { display: none !important; }
.app-main { display: flex; width: calc(100% - 258px); min-height: 100vh; margin-left: 258px; flex-direction: column; }
.topbar { position: sticky; z-index: 20; top: 0; display: flex; height: 74px; padding: 0 30px; border-bottom: 1px solid var(--border); background: color-mix(in srgb, var(--surface) 90%, transparent); backdrop-filter: blur(14px); align-items: center; justify-content: space-between; }
.topbar-title, .topbar-actions, .user-chip { display: flex; align-items: center; }
.topbar-title { gap: 12px; }
.topbar-title h2 { margin: 0; font-size: 17px; letter-spacing: -.02em; }
.topbar-title .eyebrow { font-size: 8px; }
.topbar-actions { gap: 10px; }
.icon-button { display: grid; width: 36px; height: 36px; padding: 0; cursor: pointer; border: 1px solid var(--border); border-radius: 10px; color: var(--muted); background: var(--surface); place-items: center; }
.icon-button:hover { color: var(--primary); border-color: color-mix(in srgb, var(--primary) 30%, var(--border)); }
.icon-button.danger:hover { color: var(--danger); }
.menu-toggle { display: none; }
.user-chip { padding: 4px 10px 4px 4px; border: 1px solid var(--border); border-radius: 11px; background: var(--surface); gap: 8px; }
.user-avatar { display: grid; width: 29px; height: 29px; border-radius: 8px; color: #fff; background: linear-gradient(145deg, #7c6aff, #5848dc); place-items: center; font-size: 11px; font-weight: 800; }
.user-chip > span:last-child { display: flex; min-width: 80px; flex-direction: column; }
.user-chip strong { max-width: 135px; overflow: hidden; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.user-chip small { margin-top: 1px; color: var(--muted); font-size: 8px; text-transform: capitalize; }
.app-content { width: min(100%, 1500px); padding: 30px; margin: 0 auto; flex: 1; }
.page-heading { display: flex; margin-bottom: 25px; align-items: flex-end; justify-content: space-between; gap: 20px; }
.page-heading h1 { margin: 3px 0 6px; font-size: 25px; letter-spacing: -.035em; }
.page-heading > div > p:last-child { margin: 0; color: var(--muted); font-size: 12px; }
.status-pill { display: inline-flex; padding: 8px 11px; border: 1px solid #ccebdc; border-radius: 20px; color: #087443; background: #ecfdf3; align-items: center; gap: 7px; font-size: 10px; font-weight: 700; }
.status-pill > span { width: 6px; height: 6px; border-radius: 50%; background: var(--success); box-shadow: 0 0 0 3px rgba(18,183,106,.13); }
.stats-grid { display: grid; margin-bottom: 20px; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.stat-card { display: flex; min-height: 125px; padding: 21px; border: 1px solid var(--border); border-radius: 15px; background: var(--surface); box-shadow: 0 4px 16px rgba(16,24,40,.025); align-items: flex-start; gap: 15px; }
.stat-icon { display: grid; width: 40px; height: 40px; flex: 0 0 40px; border-radius: 11px; place-items: center; font-size: 18px; }
.stat-icon.violet { color: #6d5dfc; background: #eeecff; }
.stat-icon.blue { color: #1570ef; background: #e9f2ff; }
.stat-icon.amber { color: #dc6803; background: #fff3df; }
.stat-icon.emerald { color: #039855; background: #e8f9f0; }
.stat-icon.red { color: #d92d20; background: #ffefed; }
.stat-card .stat-icon { animation: stat-icon-float 4s ease-in-out infinite; animation-delay: calc(var(--card-index,0) * .18s); }
.stat-card div { display: flex; flex-direction: column; }
.stat-card p { margin: 0 0 4px; color: var(--muted); font-size: 10px; font-weight: 650; }
.stat-card strong { font-size: 24px; letter-spacing: -.04em; }
.stat-card small { margin-top: 3px; color: var(--muted); font-size: 9px; }
.dashboard-grid { display: grid; grid-template-columns: 1.15fr .85fr; gap: 20px; }
.panel { padding: 23px; border: 1px solid var(--border); border-radius: 15px; background: var(--surface); box-shadow: var(--shadow); }
.panel-heading { display: flex; padding-bottom: 18px; border-bottom: 1px solid var(--border); align-items: center; justify-content: space-between; }
.panel-heading h3 { margin: 0; font-size: 15px; }
.panel-icon { color: var(--primary); font-size: 21px; }
.security-scan-panel { position: relative; overflow: hidden; isolation: isolate; }
.security-scan-panel::after { position: absolute; z-index: 2; right: 0; left: 0; height: 2px; pointer-events: none; background: linear-gradient(90deg, transparent 3%, rgba(255,51,71,.12) 22%, rgba(255,51,71,.72) 50%, rgba(255,51,71,.12) 78%, transparent 97%); box-shadow: 0 0 12px rgba(255,51,71,.3); content: ""; opacity: 0; animation: dashboard-scan-line 4.8s linear infinite; }
.security-scan-status { display: flex; align-items: center; gap: 9px; }
.security-scan-status > span:last-child { display: flex; flex-direction: column; }
.security-scan-status strong { color: var(--text); font-size: 9px; }
.security-scan-status small { margin-top: 3px; color: var(--muted); font-size: 8px; }
.security-scan-status .security-monitor-icon { width: 36px; height: 36px; flex-basis: 36px; color: var(--primary); background: color-mix(in srgb,var(--primary) 9%,var(--surface)); }
.check-list > div, .module-list > div { display: flex; min-height: 64px; border-bottom: 1px solid var(--border); align-items: center; gap: 12px; }
.check-list > div:last-child, .module-list > div:last-child { border-bottom: 0; }
.check-list > div > i { color: var(--success); font-size: 18px; }
.check-list span, .module-list span { display: flex; flex-direction: column; }
.check-list strong, .module-list strong { font-size: 11px; }
.check-list small, .module-list small { margin-top: 3px; color: var(--muted); font-size: 9px; }
.security-row-scan { display: grid !important; width: 28px; height: 28px; margin-left: auto; border: 1px solid var(--border); border-radius: 8px; color: var(--muted); background: var(--surface-soft); place-items: center; opacity: .45; font-size: 14px; animation: security-row-check 4.8s ease-in-out infinite; animation-delay: calc(var(--scan-index) * 1.05s); }
.security-row-scan i { display: block; }
.security-scan-list > div { position: relative; }
.security-scan-list > div::after { position: absolute; right: 0; bottom: -1px; left: 0; height: 1px; background: linear-gradient(90deg, transparent, rgba(255,51,71,.7), transparent); content: ""; opacity: 0; transform: scaleX(.2); animation: security-row-line 4.8s ease-in-out infinite; animation-delay: calc(var(--scan-index) * 1.05s); }
.module-number { display: grid !important; width: 30px; height: 30px; flex: 0 0 30px; border-radius: 8px; color: var(--primary); background: color-mix(in srgb, var(--primary) 11%, var(--surface)); place-items: center; font-size: 9px; font-weight: 800; }
.tag { padding: 4px 7px; margin-left: auto; border-radius: 6px; color: var(--primary); background: color-mix(in srgb, var(--primary) 10%, var(--surface)); font-size: 8px; font-weight: 800; text-transform: uppercase; }
.tag.muted { color: var(--muted); background: var(--surface-soft); }
.app-footer { display: flex; padding: 18px 30px; border-top: 1px solid var(--border); color: var(--muted); align-items: center; justify-content: space-between; font-size: 9px; }
.sidebar-backdrop { display: none; }
@keyframes stat-icon-float { 0%,100% { transform:translateY(0) rotate(0); } 45% { transform:translateY(-3px) rotate(-2deg); } 65% { transform:translateY(-1px) rotate(2deg); } }
@keyframes security-watch { 0%,58%,100% { color:#8f82ff; filter:none; } 66%,82% { color:#ff3347; filter:drop-shadow(0 0 5px rgba(255,51,71,.65)); } }
@keyframes security-icon-scan { 0%,57%,100% { opacity:0; transform:translateY(-8px); } 65% { opacity:1; } 82% { opacity:.9; transform:translateY(8px); } 88% { opacity:0; } }
@keyframes security-ring { 0%,61%,100% { opacity:0; transform:scale(.78); } 70% { opacity:.75; } 90% { opacity:0; transform:scale(1.18); } }
@keyframes security-dot { 0%,60%,100% { box-shadow:0 0 0 0 rgba(255,51,71,.48); } 78% { box-shadow:0 0 0 5px rgba(255,51,71,0); } }
@keyframes dashboard-scan-line { 0% { top:78px; opacity:0; } 8% { opacity:1; } 88% { opacity:.75; } 100% { top:calc(100% - 8px); opacity:0; } }
@keyframes security-row-check { 0%,14%,100% { color:var(--muted); border-color:var(--border); opacity:.38; transform:scale(.9); } 21%,34% { color:#ff3347; border-color:rgba(255,51,71,.45); background:color-mix(in srgb,#ff3347 8%,var(--surface)); box-shadow:0 0 0 4px rgba(255,51,71,.07),0 0 12px rgba(255,51,71,.2); opacity:1; transform:scale(1); } 43%,88% { color:var(--success); border-color:color-mix(in srgb,var(--success) 38%,var(--border)); opacity:.82; transform:scale(.94); } }
@keyframes security-row-line { 0%,15%,100% { opacity:0; transform:scaleX(.2); } 23%,34% { opacity:.8; transform:scaleX(1); } 43% { opacity:0; transform:scaleX(1); } }
@media (prefers-reduced-motion: reduce) { .security-monitor-icon, .security-monitor-icon::before, .security-monitor-icon::after, .sidebar-security div > span b, .security-scan-panel::after, .security-row-scan, .security-scan-list > div::after { animation:none !important; } .security-row-scan { color:var(--success); opacity:.8; } }
@media (prefers-reduced-motion: reduce) { .stat-card .stat-icon { animation:none!important; } }
.error-page { display: grid; min-height: 100vh; padding: 30px; background: #0d1324; place-items: center; text-align: center; }
.error-page main { max-width: 480px; color: white; }
.error-page main > span { color: #7d6eff; font-size: 82px; font-weight: 900; letter-spacing: -.08em; }
.error-page h1 { margin: 0; font-size: 27px; }
.error-page p { margin: 12px 0 25px; color: #9da8bc; }
.error-page a { display: inline-flex; padding: 11px 17px; border-radius: 9px; color: white; background: var(--primary); text-decoration: none; font-size: 12px; font-weight: 700; }
@media (max-width: 1050px) {
  .stats-grid { grid-template-columns: repeat(2, 1fr); }
  .dashboard-grid { grid-template-columns: 1fr; }
}
@media (max-width: 820px) {
  .auth-shell { grid-template-columns: 1fr; }
  .auth-brand-panel { min-height: 270px; padding: 34px; }
  .auth-brand-panel h1 { font-size: 38px; }
  .auth-lead { max-width: 570px; }
  .security-points { margin-top: 35px; }
  .sidebar { transform: translateX(-100%); transition: transform .22s ease; }
  body.sidebar-open .sidebar { transform: translateX(0); }
  .sidebar-close, .menu-toggle { display: grid !important; }
  .sidebar-backdrop { position: fixed; z-index: 25; inset: 0; background: rgba(4,8,17,.55); backdrop-filter: blur(2px); }
  body.sidebar-open .sidebar-backdrop { display: block; }
  .app-main { width: 100%; margin-left: 0; }
}
@media (max-width: 580px) {
  .auth-form-panel { padding: 20px; }
  .auth-brand-panel { min-height: 230px; }
  .security-points { display: none; }
  .login-card { padding: 27px 22px; border-radius: 18px; }
  .topbar { height: 66px; padding: 0 16px; }
  .topbar-title .eyebrow, .user-chip > span:last-child { display: none; }
  .user-chip { padding-right: 4px; }
  .app-content { padding: 22px 16px; }
  .page-heading { align-items: flex-start; flex-direction: column; }
  .stats-grid { grid-template-columns: 1fr; }
  .app-footer { padding: 16px; align-items: flex-start; flex-direction: column; gap: 5px; }
}

/* CMS and data-review components */
.admin-button{display:inline-flex;min-height:40px;padding:0 15px;border:1px solid var(--border);border-radius:9px;align-items:center;justify-content:center;gap:7px;text-decoration:none;cursor:pointer;font-size:11px;font-weight:700}
.admin-button.primary{color:#fff;background:var(--primary);border-color:var(--primary)}.admin-button.secondary{color:var(--primary);background:var(--surface)}
.table-wrap{overflow:auto}.admin-table{width:100%;border-collapse:collapse;font-size:11px}.admin-table th{padding:11px 13px;color:var(--muted);background:var(--surface-soft);text-align:left;font-size:9px;text-transform:uppercase;letter-spacing:.07em}.admin-table td{padding:14px 13px;border-top:1px solid var(--border)}.admin-table td small{display:block;margin-top:3px;color:var(--muted)}.table-link{display:inline-flex;color:var(--primary);align-items:center;gap:3px;text-decoration:none;font-weight:700}.empty-state{padding:45px!important;text-align:center;color:var(--muted)}
.status-badge{display:inline-flex;padding:5px 8px;border-radius:20px;color:#344054;background:#eef1f5;font-size:9px;font-weight:800;text-transform:uppercase}.status-badge.published,.status-badge.approved{color:#087443;background:#e8f8f0}.status-badge.submitted{color:#175cd3;background:#eaf2ff}.status-badge.in_review{color:#b54708;background:#fff2df}.status-badge.rejected,.status-badge.closed{color:#b42318;background:#ffefed}
.admin-alert{margin-bottom:16px;padding:13px 15px;border-radius:9px;font-size:11px}.admin-alert.success{color:#087443;background:#ecfdf3;border:1px solid #ccebdc}.admin-alert.danger{color:#9b2c25;background:#fff0ef;border:1px solid #ffd5d2}.admin-alert ul{margin:0;padding-left:17px}
.page-actions{display:flex;align-items:center;justify-content:flex-end;gap:9px;flex-wrap:wrap}.table-filters{display:flex;padding:15px;margin-bottom:15px;align-items:end;gap:10px;flex-wrap:wrap}.table-filters label{display:flex;min-width:125px;flex:1;flex-direction:column;gap:5px;color:var(--muted);font-size:9px;font-weight:700}.table-filters input,.table-filters select{width:100%;height:38px;padding:0 10px;border:1px solid var(--border);border-radius:8px;color:var(--text);background:var(--surface);outline:0;font-size:10px}.table-filters .admin-button{min-height:38px}.pagination{display:flex;padding:15px 0 0;border-top:1px solid var(--border);align-items:center;justify-content:space-between;gap:12px;color:var(--muted);font-size:9px}.pagination>div{display:flex;gap:5px;flex-wrap:wrap}.pagination a{display:inline-flex;min-width:30px;height:30px;padding:0 9px;border:1px solid var(--border);border-radius:7px;color:var(--muted);background:var(--surface);align-items:center;justify-content:center;text-decoration:none}.pagination a.active{color:#fff;border-color:var(--primary);background:var(--primary)}.pagination.single{justify-content:flex-end}.account-type{display:inline-flex;padding:5px 8px;border-radius:7px;font-size:8px;font-weight:800}.account-type.admin{color:#5925dc;background:#f0edff}.account-type.staff{color:#175cd3;background:#eaf2ff}.account-type.vendor{color:#087443;background:#e8f8f0}.permission-summary{display:flex;max-width:460px;gap:4px;flex-wrap:wrap}.permission-summary span{padding:3px 6px;border-radius:5px;color:var(--primary);background:color-mix(in srgb,var(--primary) 9%,var(--surface));font-size:7px}.permission-picker{padding:14px;border:1px solid var(--border);border-radius:10px}.permission-picker legend{padding:0 7px;font-size:10px;font-weight:800}.permission-picker>div{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.permission-picker label{display:flex;padding:10px;border:1px solid var(--border);border-radius:8px;background:var(--surface-soft);align-items:flex-start;flex-direction:row;gap:8px}.permission-picker input{width:15px;min-height:15px;accent-color:var(--primary)}.permission-picker label>span{display:flex;flex-direction:column;gap:3px}.permission-picker strong{font-size:9px}.permission-picker small{color:var(--muted);font-size:7px}.document-state{display:inline-flex;align-items:center;gap:4px;font-size:9px;font-weight:700}.document-state.complete{color:var(--success)}.document-state.pending{color:#b54708}
.cms-settings{margin-bottom:16px}.cms-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px;padding-top:18px}.cms-grid label,.review-panel label{display:flex;flex-direction:column;gap:6px;color:var(--muted);font-size:9px;font-weight:700}.cms-grid .wide{grid-column:span 2}.cms-grid input,.cms-grid select,.cms-grid textarea,.review-panel input,.review-panel select,.review-panel textarea{width:100%;min-height:39px;padding:8px 10px;border:1px solid var(--border);border-radius:8px;color:var(--text);background:var(--surface);outline:0;font:inherit;font-size:11px}.cms-grid textarea,.review-panel textarea{min-height:72px;resize:vertical}
.cms-step{margin-bottom:13px;border:1px solid var(--border);border-radius:13px;background:var(--surface);box-shadow:0 4px 14px rgba(16,24,40,.025)}.cms-step summary{display:flex;padding:16px 18px;cursor:pointer;align-items:center;justify-content:space-between;list-style:none}.cms-step summary::-webkit-details-marker{display:none}.cms-step summary>span{display:flex;align-items:center;gap:10px}.cms-step summary b{display:grid;width:28px;height:28px;border-radius:8px;color:var(--primary);background:color-mix(in srgb,var(--primary) 10%,var(--surface));place-items:center;font-size:10px}.cms-step summary strong{font-size:12px}.cms-step summary small{color:var(--muted);font-size:9px}.cms-fields{padding:0 15px 15px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.field-editor{padding:14px;border:1px solid var(--border);border-radius:11px;background:var(--surface-soft)}.field-editor header{display:flex;align-items:center;gap:9px}.field-editor header>div{display:flex;flex-direction:column}.field-editor header strong{font-size:11px}.field-editor header small{margin-top:2px;color:var(--muted);font-size:8px}.type-icon{display:grid;width:30px;height:30px;border-radius:8px;color:var(--primary);background:color-mix(in srgb,var(--primary) 10%,var(--surface));place-items:center}.system-tag{padding:3px 6px;margin-left:auto;border-radius:5px;color:#175cd3;background:#eaf2ff;font-size:7px;font-weight:800;text-transform:uppercase}.cms-grid.compact{grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}.toggle-label{padding-top:19px;flex-direction:row!important;align-items:center}.toggle-label input{width:16px;min-height:16px;accent-color:var(--primary)}
.sticky-save{position:sticky;z-index:10;bottom:12px;display:flex;padding:10px 12px;margin:15px 0;align-items:center;justify-content:flex-end;gap:14px;border:1px solid var(--border);border-radius:11px;background:color-mix(in srgb,var(--surface) 94%,transparent);box-shadow:var(--shadow);backdrop-filter:blur(10px)}.sticky-save>a{color:var(--muted);font-size:11px;text-decoration:none}.add-field-panel{margin-top:22px}.add-field-panel form{align-items:end}
.review-layout{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:18px}.detail-panel{margin-bottom:16px}.detail-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0;margin:0}.detail-grid>div{padding:13px 8px;border-bottom:1px solid var(--border)}.detail-grid dt{color:var(--muted);font-size:9px;font-weight:700}.detail-grid dd{margin:5px 0 0;font-size:11px;line-height:1.5;overflow-wrap:anywhere}.review-panel{position:sticky;top:94px;height:max-content}.review-panel form{display:flex;padding-top:17px;flex-direction:column;gap:14px}.attachment-list>a{display:flex;padding:12px 7px;border-bottom:1px solid var(--border);color:var(--text);align-items:center;gap:10px;text-decoration:none}.attachment-list>a>i:first-child{color:var(--primary);font-size:20px}.attachment-list>a>i:last-child{margin-left:auto;color:var(--muted)}.attachment-list span{display:flex;flex-direction:column}.attachment-list strong{font-size:10px}.attachment-list small{margin-top:3px;color:var(--muted);font-size:8px}
@media(max-width:1100px){.cms-fields{grid-template-columns:1fr}.review-layout{grid-template-columns:1fr}.review-panel{position:static}}
@media(max-width:700px){.cms-grid,.cms-grid.compact{grid-template-columns:1fr}.cms-grid .wide{grid-column:1}.detail-grid{grid-template-columns:1fr}.page-heading .admin-button{width:100%}}
@media(max-width:900px){.permission-picker>div{grid-template-columns:repeat(2,minmax(0,1fr))}.table-filters label{min-width:180px}}@media(max-width:600px){.permission-picker>div{grid-template-columns:1fr}.pagination{align-items:flex-start;flex-direction:column}.page-actions{width:100%;justify-content:flex-start}.table-filters label{min-width:100%}}

/* Account security */
.security-setup-card{width:min(100%,900px);padding:34px;border:1px solid #e9ebf2;border-radius:24px;background:#fff;box-shadow:0 20px 60px rgba(20,25,45,.1)}
.security-setup-heading h2{margin:6px 0 7px;color:#172033}.security-setup-heading>p:last-child{margin:0 0 24px;color:#667085;font-size:13px;line-height:1.6}
.security-setup-grid{display:grid;grid-template-columns:1fr 1fr;gap:30px}.security-setup-grid h3{margin:8px 0;color:#172033}.security-setup-grid section>p{color:#667085;font-size:12px;line-height:1.6}
.setup-number{display:grid;width:28px;height:28px;border-radius:8px;color:#fff;background:var(--primary);place-items:center;font-size:11px;font-weight:800}
.qr-frame{display:grid;width:min(100%,360px);padding:14px;margin:15px auto;border:1px solid #d9deea;border-radius:14px;background:#fff;place-items:center}.qr-frame img{display:block;width:100%;height:auto;image-rendering:crisp-edges}
.qr-panel details{font-size:11px;color:#667085}.qr-panel summary{cursor:pointer;color:var(--primary);font-weight:700}.qr-panel code{display:block;padding:10px;margin-top:7px;border-radius:8px;color:#172033;background:#f2f4f7;font-size:12px;overflow-wrap:anywhere;user-select:all}
.otp-input input{font-size:20px;font-weight:800;letter-spacing:.35em;text-align:center}.security-setup-card .alert ul{margin:0;padding-left:17px}
@media(max-width:780px){.security-setup-grid{grid-template-columns:1fr}.security-setup-card{padding:24px 18px}.qr-frame{width:min(100%,320px)}}
.language-switch{display:flex;height:36px;padding:0 8px;border:1px solid var(--border);border-radius:10px;background:var(--surface);align-items:center;gap:5px}.language-switch i{color:var(--muted)}.language-switch select{border:0;outline:0;color:var(--text);background:transparent;font-size:10px;font-weight:800}
.action-group{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.action-group form{display:inline-flex}.mini-action{display:inline-flex;min-height:30px;padding:0 9px;border:1px solid var(--border);border-radius:7px;color:var(--primary);background:var(--surface);align-items:center;text-decoration:none;cursor:pointer;font-size:9px;font-weight:750}.mini-action.danger{color:var(--danger)}
.verified-text{color:var(--success)!important}.file-count{display:inline-flex;align-items:center;gap:5px;color:var(--success);font-size:10px;font-weight:750}.attachment-indicator{display:inline-flex;align-items:center;gap:5px;color:var(--success);font-size:9px;font-weight:800}
.attachment-list.expandable details{border-bottom:1px solid var(--border)}.attachment-list.expandable details:last-child{border-bottom:0}.attachment-list.expandable summary{display:flex;padding:13px 7px;cursor:pointer;align-items:center;gap:10px;list-style:none}.attachment-list.expandable summary::-webkit-details-marker{display:none}.attachment-list.expandable summary>i{margin-left:auto;color:var(--muted);transition:.2s}.attachment-list.expandable details[open] summary>i{transform:rotate(180deg)}.file-present{display:grid;width:24px;height:24px;border-radius:7px;color:var(--success);background:#e8f8f0;place-items:center}.attachment-list.expandable summary span:nth-child(2){display:flex;flex-direction:column}.attachment-detail{display:flex;padding:2px 7px 14px 41px;align-items:center;justify-content:space-between;gap:12px}.attachment-detail p{display:flex;margin:0;flex-direction:column;font-size:10px}.attachment-detail small{margin-top:3px;color:var(--muted);font-size:8px}.attachment-detail>div{display:flex;gap:6px}
.review-side{display:flex;flex-direction:column;gap:16px}.review-side .review-panel{position:static}.history-panel{padding-bottom:12px}.history-list{padding:15px 0 0;margin:0;list-style:none}.history-list li{position:relative;display:flex;padding:0 0 17px 22px;gap:9px}.history-list li:not(:last-child)::before{position:absolute;top:10px;bottom:0;left:5px;width:1px;background:var(--border);content:""}.history-dot{position:absolute;top:4px;left:0;width:11px;height:11px;border:3px solid color-mix(in srgb,var(--primary) 25%,var(--surface));border-radius:50%;background:var(--primary)}.history-list div{display:flex;min-width:0;flex-direction:column}.history-list strong{font-size:10px}.history-list small,.history-list span{margin-top:3px;color:var(--muted);font-size:8px}.history-list p{padding:7px 8px;margin:6px 0 0;border-radius:7px;background:var(--surface-soft);font-size:9px;line-height:1.5}
@media(max-width:700px){.attachment-detail{padding-left:7px;align-items:flex-start;flex-direction:column}.topbar-actions{gap:5px}.language-switch{padding:0 5px}}

.brand-logo{display:grid;width:38px;height:38px;flex:0 0 38px;overflow:hidden;border-radius:11px;background:#fff;place-items:center}.brand-logo img{width:100%;height:100%;object-fit:contain}
.nav-group{margin:2px 0}.nav-group>summary{cursor:pointer;list-style:none}.nav-group>summary::-webkit-details-marker{display:none}.nav-chevron{margin-left:auto!important;font-size:11px!important;transition:.2s}.nav-group[open] .nav-chevron{transform:rotate(180deg)}.nav-submenu{padding:3px 0 5px 18px;border-left:1px solid rgba(255,255,255,.08);margin-left:20px}.nav-submenu .nav-item{min-height:37px;padding-left:10px;font-size:10px}.nav-submenu .nav-item i{font-size:14px}
.activity-stats{grid-template-columns:repeat(3,1fr)}.activity-panel{margin-bottom:16px}.activity-details{padding:0;margin-bottom:14px}.activity-details>summary{display:flex;padding:18px 22px;cursor:pointer;align-items:center;justify-content:space-between;list-style:none}.activity-details>summary::-webkit-details-marker{display:none}.activity-details>summary>span{display:flex;align-items:center;gap:9px}.activity-details>summary strong{font-size:12px}.activity-details>summary small{color:var(--muted);font-size:9px}.activity-details>summary>i{transition:.2s}.activity-details[open]>summary>i{transform:rotate(180deg)}.activity-details .table-wrap{border-top:1px solid var(--border)}.activity-details code{font-size:8px;white-space:normal;overflow-wrap:anywhere}
.menu-builder{margin-bottom:18px}.builder-note{display:flex;padding:11px;border-radius:9px;color:#175cd3;background:#eaf2ff;align-items:flex-start;gap:8px;font-size:10px;line-height:1.5}.branding-preview{display:block;width:100%;max-width:300px;height:130px;margin-top:9px;border:1px solid var(--border);border-radius:9px;background:#f3f4f7;object-fit:cover}.logo-preview{width:100px;height:100px;object-fit:contain}.dynamic-table{min-width:max-content}.dynamic-table td{max-width:220px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media(max-width:700px){.activity-stats{grid-template-columns:1fr}.nav-submenu{margin-left:15px}}

/* NDA template CMS */
.nda-template-form textarea{min-height:300px;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;line-height:1.65}.nda-template-form code{padding:2px 5px;border-radius:4px;color:var(--primary);background:var(--surface-soft)}
.nda-field-picker{padding:17px;border:1px solid var(--border);border-radius:12px}.nda-field-picker legend{padding:0 7px;font-size:11px;font-weight:800}.nda-field-picker>p{margin:0 0 13px;color:var(--muted);font-size:10px}.nda-field-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.nda-field-grid>label{display:flex;padding:10px;border:1px solid var(--border);border-radius:9px;align-items:flex-start;gap:8px;cursor:pointer}.nda-field-grid input{width:16px;height:16px;margin:1px 0 0;accent-color:var(--primary)}.nda-field-grid span{display:flex;min-width:0;flex-direction:column}.nda-field-grid strong{font-size:10px}.nda-field-grid small{margin-top:3px;color:var(--muted);font-size:8px;overflow-wrap:anywhere}.nda-template-note{display:flex;padding:12px;border-radius:9px;color:#175cd3;background:#eaf2ff;align-items:center;gap:8px;font-size:10px}
.nda-clause-editor{padding:17px;border:1px solid var(--border);border-radius:12px}.nda-clause-editor>legend{padding:0 7px;font-size:11px;font-weight:800}.nda-clause-editor>p{margin:0 0 13px;color:var(--muted);font-size:10px}.nda-clause-editor>section{display:grid;grid-template-columns:120px 1fr 1fr;padding:12px 0;border-top:1px solid var(--border);align-items:start;gap:12px}.nda-clause-editor>section>strong{padding-top:8px;font-size:10px}.nda-clause-editor textarea{min-height:125px;font-family:inherit;font-size:10px;line-height:1.5}
.nda-preview-shell{display:flex;flex-direction:column;align-items:center;gap:18px}.nda-paper{width:min(100%,850px);min-height:1050px;padding:62px 68px;border:1px solid #d9dde7;background:#fff;box-shadow:0 15px 45px rgba(16,24,40,.08);color:#172033}.nda-paper-letterhead{display:block;width:100%;height:auto;max-height:145px;margin:0 auto 28px;object-fit:contain;object-position:center top}.nda-letterhead-preview{display:block;width:100%;max-height:150px;margin-top:10px;border:1px solid var(--border);border-radius:8px;background:#fff;object-fit:contain}.nda-paper header{text-align:center;border-bottom:2px solid #172033;padding-bottom:18px}.nda-paper header p{margin:0;color:#b54708;font-size:9px;font-weight:800;letter-spacing:.15em}.nda-paper h2{margin:8px 0 0;font-size:23px}.nda-preview-body{margin:32px 0;font-size:12px;line-height:1.85;text-align:justify}.nda-paper h3{margin-top:32px;font-size:13px}.nda-paper dl{border-top:1px solid #d9dde7}.nda-paper dl>div{display:grid;grid-template-columns:210px 1fr;padding:8px 0;border-bottom:1px solid #e8eaf0}.nda-paper dt{font-size:10px;font-weight:750}.nda-paper dd{margin:0;font-size:10px}.nda-paper footer{display:grid;grid-template-columns:1fr 1fr;gap:70px;margin-top:70px}.nda-paper footer div{display:flex;min-height:110px;flex-direction:column;justify-content:space-between;text-align:center;font-size:10px}.nda-preview-actions{display:flex;width:min(100%,850px);justify-content:flex-end;gap:10px}.nda-preview-actions form{display:inline-flex}
@media(max-width:850px){.nda-field-grid{grid-template-columns:1fr 1fr}.nda-paper{padding:38px 28px;min-height:0}.nda-paper dl>div{grid-template-columns:1fr;gap:3px}}
@media(max-width:560px){.nda-field-grid{grid-template-columns:1fr}.nda-preview-actions{flex-direction:column}.nda-preview-actions .admin-button{width:100%}}
@media(max-width:850px){.nda-clause-editor>section{grid-template-columns:1fr}.nda-clause-editor>section>strong{padding-top:0}}

/* TPP branding and managed document templates */
.auth-company-logo{display:grid;width:92px;height:78px;padding:8px;border:1px solid rgba(255,255,255,.22);border-radius:18px;background:rgba(255,255,255,.94);box-shadow:0 14px 35px rgba(0,0,0,.2);place-items:center}.auth-company-logo img{display:block;width:100%;height:100%;object-fit:contain}
.managed-document-current{display:flex;padding:12px 14px;border:1px solid var(--border);border-radius:10px;background:var(--surface-soft);align-items:center;gap:11px}.managed-document-current>i{display:grid;width:36px;height:36px;flex:0 0 36px;border-radius:9px;color:var(--primary);background:color-mix(in srgb,var(--primary) 12%,var(--surface));place-items:center;font-size:18px}.managed-document-current>span{display:flex;min-width:0;flex:1;flex-direction:column}.managed-document-current strong{font-size:10px;overflow-wrap:anywhere}.managed-document-current small{margin-top:3px;color:var(--muted);font-size:8px}.managed-document-current .admin-button{flex:0 0 auto}

/* A4 NDA preview matching the supplied PT Tri Panji Puring reference */
.nda-reference-page{position:relative;width:min(100%,794px);min-height:1123px;padding:42px 68px 48px;border:1px solid #d9dde7;background:#fff;box-shadow:0 15px 45px rgba(16,24,40,.1);color:#111;font-family:"Times New Roman",serif;font-size:13px;line-height:1.24}.nda-reference-custom-header{display:block;width:100%;max-height:160px;margin:0 auto 8px;object-fit:contain;object-position:center top}.nda-reference-header{display:grid;grid-template-columns:126px 1fr 145px;min-height:120px;padding-bottom:10px;border-bottom:2px solid #111;align-items:center;gap:10px}.nda-reference-logo{width:120px;max-height:105px;object-fit:contain}.nda-reference-header h2{margin:0 0 7px;color:#7f0000;font:bold 30px Arial,sans-serif;white-space:nowrap}.nda-reference-header p{margin:0;font-size:10px;line-height:1.25}.nda-reference-certs{display:flex;justify-content:flex-end;gap:4px}.nda-reference-certs img{width:67px;height:auto}.nda-reference-title{margin:7px 0 22px;text-align:center}.nda-reference-title h1{margin:0;font-size:18px}.nda-reference-title em{display:block;font-size:17px;font-weight:700}.nda-reference-identity{margin:0 0 22px}.nda-reference-identity>div{display:grid;grid-template-columns:205px 1fr;min-height:20px}.nda-reference-identity dt,.nda-reference-identity dd{margin:0}.nda-reference-identity dd{border-bottom:1px dotted #111;overflow-wrap:anywhere}.nda-reference-columns-head,.nda-reference-clause,.nda-reference-close{display:grid;grid-template-columns:1fr 1fr;gap:28px}.nda-reference-columns-head{margin:0 8px 3px}.nda-reference-clause{margin:0 8px 18px}.nda-reference-clause>div{display:grid;grid-template-columns:25px 1fr;align-items:start}.nda-reference-clause b{font-weight:400}.nda-reference-clause p,.nda-reference-close p{margin:0;text-align:justify}.nda-reference-close{margin:26px 8px}.nda-reference-signatures{display:grid;grid-template-columns:1fr 1fr;gap:70px;margin:26px 0 0}.nda-reference-signatures>div{display:flex;min-height:185px;flex-direction:column}.nda-reference-signatures>div>span{flex:1;border-bottom:1px solid #111}.nda-reference-signatures p{margin:3px 0}.nda-reference-confidential{position:absolute;right:0;bottom:20px;left:0;margin:0;text-align:center}.nda-preview-extra{width:min(100%,850px);padding:12px;border:1px solid var(--border);border-radius:10px;background:var(--surface)}.nda-preview-extra summary{cursor:pointer;font-size:10px;font-weight:800}.nda-preview-extra div{padding-top:12px;color:var(--muted);font-size:10px;line-height:1.6}
@media(max-width:850px){.nda-reference-page{min-height:0;padding:28px 22px}.nda-reference-header{grid-template-columns:90px 1fr}.nda-reference-logo{width:85px}.nda-reference-header h2{font-size:22px;white-space:normal}.nda-reference-certs{grid-column:1/-1;justify-content:center}.nda-reference-identity>div{grid-template-columns:1fr}.nda-reference-columns-head{display:none}.nda-reference-clause,.nda-reference-close,.nda-reference-signatures{grid-template-columns:1fr;gap:14px}.nda-reference-clause>div:nth-child(2){padding:10px;border-left:3px solid var(--primary);background:#f5f7fd}.nda-reference-signatures{gap:22px}.nda-reference-signatures>div{min-height:150px}.nda-reference-confidential{position:static;margin-top:24px}.managed-document-current{align-items:flex-start;flex-wrap:wrap}.managed-document-current .admin-button{width:100%}}
.review-final{display:flex;align-items:center;gap:12px}.review-final>i{display:grid;width:42px;height:42px;flex:0 0 42px;border-radius:11px;color:var(--success);background:#e8f8f0;place-items:center;font-size:21px}.review-final h3{margin:3px 0;font-size:15px}.review-final small{color:var(--muted);font-size:9px;line-height:1.5}.vendor-registration-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:16px}.vendor-registration-summary article{display:flex;padding:15px;border:1px solid var(--border);border-radius:12px;background:var(--surface);box-shadow:0 5px 18px rgba(16,24,40,.03);flex-direction:column}.vendor-registration-summary span{color:var(--muted);font-size:8px}.vendor-registration-summary strong{margin-top:5px;font-size:11px;overflow-wrap:anywhere}@media(max-width:900px){.vendor-registration-summary{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:560px){.vendor-registration-summary{grid-template-columns:1fr}}
.vendor-admin-edit { display: grid; gap: 22px; }
.vendor-edit-step { padding: 20px; border: 1px solid var(--border); border-radius: 16px; background: var(--surface-soft); }
.vendor-edit-step-heading { display: flex; margin-bottom: 18px; align-items: center; gap: 12px; }
.vendor-edit-step-heading>span { display: grid; width: 38px; height: 38px; border-radius: 12px; color: #fff; background: #3157c7; place-items: center; font-weight: 800; }
.vendor-edit-step-heading h2 { margin: 2px 0 0; font-size: 18px; }
.existing-files { display: grid; gap: 8px; margin: 3px 0 8px; }
.existing-files>span { display: flex; padding: 9px 10px; border: 1px solid var(--border); border-radius: 9px; align-items: center; gap: 8px; background: var(--surface); font-size: 12px; }
.existing-files b { min-width: 0; margin-right: auto; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.existing-files a { font-weight: 700; }
.immutable-field { display: flex; padding: 14px; border: 1px solid rgba(49,87,199,.24); border-radius: 12px; align-items: flex-start; gap: 12px; background: rgba(49,87,199,.07); }
.immutable-field>span { color: #3157c7; font-size: 22px; }
.immutable-field div { display: grid; gap: 3px; }
.immutable-field small { color: var(--muted); }
.admin-checkbox { display: flex !important; min-height: 46px; flex-direction: row !important; align-items: center; gap: 10px !important; }
.admin-checkbox input[type="checkbox"] { width: 18px; height: 18px; }
.vendor-edit-actions { display: flex; padding-top: 4px; justify-content: flex-end; gap: 10px; }
@media (max-width: 700px) { .vendor-edit-step { padding: 16px 12px; } .existing-files>span { align-items: flex-start; flex-wrap: wrap; } .existing-files b { width: calc(100% - 32px); } .vendor-edit-actions { flex-direction: column-reverse; } .vendor-edit-actions .admin-button { width: 100%; justify-content: center; } }

/* Vendor portal */
.vendor-coming{position:relative;display:grid;min-height:420px;padding:46px;border:1px solid var(--border);border-radius:24px;background:linear-gradient(135deg,var(--surface) 0%,color-mix(in srgb,var(--primary) 7%,var(--surface)) 100%);box-shadow:0 18px 55px rgba(16,24,40,.07);grid-template-columns:minmax(0,1fr) 360px;align-items:center;gap:36px;overflow:hidden}.vendor-coming:before{position:absolute;width:280px;height:280px;border-radius:50%;background:color-mix(in srgb,var(--primary) 9%,transparent);content:"";right:-100px;top:-130px}.vendor-coming-copy{position:relative;z-index:1}.vendor-coming-icon{display:grid;width:58px;height:58px;margin:18px 0;border-radius:18px;color:#fff;background:linear-gradient(145deg,var(--primary),#6f5cff);box-shadow:0 16px 32px color-mix(in srgb,var(--primary) 28%,transparent);place-items:center;font-size:27px}.vendor-coming h1{margin:0;font-size:clamp(30px,4vw,48px);letter-spacing:-.045em}.vendor-coming-copy>p:last-of-type{max-width:620px;margin:14px 0 24px;color:var(--muted);font-size:13px;line-height:1.75}.coming-badge,.security-status{display:inline-flex;min-height:34px;padding:0 12px;border:1px solid color-mix(in srgb,var(--primary) 24%,var(--border));border-radius:999px;color:var(--primary);background:color-mix(in srgb,var(--primary) 8%,var(--surface));align-items:center;gap:7px;font-size:10px;font-weight:800}.vendor-coming-visual{position:relative;display:grid;width:270px;height:270px;margin:auto;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--primary) 17%,var(--surface)) 0 29%,transparent 30%);place-items:center}.scan-core{position:relative;z-index:3;display:grid;width:94px;height:94px;border:1px solid color-mix(in srgb,var(--primary) 30%,var(--border));border-radius:28px;color:var(--primary);background:var(--surface);box-shadow:0 20px 45px rgba(16,24,40,.12);place-items:center;font-size:43px;animation:vendorCorePulse 3s ease-in-out infinite}.scan-orbit{position:absolute;border:1px solid color-mix(in srgb,var(--primary) 32%,transparent);border-radius:50%;inset:25px;animation:vendorOrbit 8s linear infinite}.scan-orbit:after{position:absolute;width:10px;height:10px;border-radius:50%;background:var(--primary);box-shadow:0 0 16px var(--primary);content:"";left:26px;top:18px}.scan-orbit.orbit-two{inset:55px;animation-direction:reverse;animation-duration:5s}.vendor-coming-visual small{position:absolute;bottom:24px;color:var(--muted);font-size:9px;font-weight:800;letter-spacing:.12em;text-transform:uppercase}.vendor-coming-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:16px}.vendor-coming-cards article{display:flex;padding:18px;border:1px solid var(--border);border-radius:15px;background:var(--surface);align-items:center;gap:13px}.vendor-coming-cards i{display:grid;width:38px;height:38px;flex:0 0 38px;border-radius:11px;color:var(--primary);background:color-mix(in srgb,var(--primary) 10%,var(--surface));place-items:center;font-size:18px}.vendor-coming-cards div{display:flex;flex-direction:column;gap:4px}.vendor-coming-cards strong{font-size:11px}.vendor-coming-cards span{color:var(--muted);font-size:9px;line-height:1.5}@keyframes vendorCorePulse{0%,100%{transform:scale(1)}50%{transform:scale(1.055)}}@keyframes vendorOrbit{to{transform:rotate(360deg)}}
.vendor-account-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:18px}.vendor-account-summary article{display:flex;min-width:0;padding:16px;border:1px solid var(--border);border-radius:13px;background:var(--surface);flex-direction:column;gap:6px}.vendor-account-summary span{color:var(--muted);font-size:8px}.vendor-account-summary strong{font-size:11px;overflow-wrap:anywhere}.vendor-security-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:start;gap:18px}.vendor-security-card{margin:0}.security-card-icon{display:grid;width:42px;height:42px;border-radius:12px;color:var(--primary);background:color-mix(in srgb,var(--primary) 10%,var(--surface));place-items:center;font-size:20px}.danger-zone .security-card-icon{color:#d92d20;background:#fff0ef}.security-card-description{margin:0 0 18px;color:var(--muted);font-size:10px;line-height:1.65}.vendor-security-form{display:grid;gap:13px}.vendor-security-form>label:not(.reset-confirm){display:flex;flex-direction:column;gap:6px;color:var(--muted);font-size:9px;font-weight:750}.vendor-security-form input:not([type=checkbox]){width:100%;min-height:43px;padding:9px 11px;border:1px solid var(--border);border-radius:9px;color:var(--text);background:var(--surface);outline:0;font:inherit;font-size:11px}.vendor-security-form input:focus{border-color:var(--primary);box-shadow:0 0 0 3px color-mix(in srgb,var(--primary) 12%,transparent)}.vendor-security-form small{font-size:8px;line-height:1.5}.reset-confirm{display:flex;padding:12px;border:1px solid #ffd5d2;border-radius:10px;color:var(--text);background:#fff8f7;align-items:flex-start;gap:9px;font-size:9px;line-height:1.5}.reset-confirm input{width:16px;height:16px;flex:0 0 16px;margin:1px 0 0;accent-color:#d92d20}.admin-button.danger{color:#fff;border-color:#d92d20;background:#d92d20}.vendor-company-panel{padding:22px}.profile-change-list{border-top:1px solid var(--border)}.profile-change-list details{border-bottom:1px solid var(--border)}.profile-change-list summary{display:flex;min-height:64px;padding:11px 5px;cursor:pointer;align-items:center;gap:11px;list-style:none}.profile-change-list summary::-webkit-details-marker{display:none}.profile-change-list summary>span:nth-child(2){display:flex;min-width:0;flex:1;flex-direction:column;gap:4px}.profile-change-list summary strong{font-size:10px}.profile-change-list summary small{color:var(--muted);font-size:8px}.profile-change-list summary>i{transition:.2s}.profile-change-list details[open] summary>i{transform:rotate(180deg)}.profile-change-icon{display:grid;width:34px;height:34px;flex:0 0 34px;border-radius:9px;color:var(--primary);background:color-mix(in srgb,var(--primary) 9%,var(--surface));place-items:center}.profile-change-values{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));padding:0 5px 14px 50px;gap:10px}.profile-change-values>div{padding:10px;border:1px solid var(--border);border-radius:9px;background:var(--surface-soft)}.profile-change-values small{color:var(--muted);font-size:8px}.profile-change-values p{margin:5px 0 0;font-size:9px;line-height:1.55;overflow-wrap:anywhere}
@media(max-width:980px){.vendor-coming{grid-template-columns:1fr;min-height:0}.vendor-coming-visual{width:230px;height:230px}.vendor-account-summary{grid-template-columns:repeat(2,minmax(0,1fr))}.vendor-security-grid{grid-template-columns:1fr}}
@media(max-width:620px){.vendor-coming{padding:26px 18px;border-radius:18px}.vendor-coming h1{font-size:31px}.vendor-coming-visual{width:190px;height:190px}.vendor-coming-cards,.vendor-account-summary{grid-template-columns:1fr}.vendor-profile-heading .security-status{width:auto}.vendor-company-panel{padding:12px}.profile-change-values{grid-template-columns:1fr;padding-left:5px}.vendor-security-form .admin-button{width:100%}.page-heading.vendor-profile-heading{gap:12px}}

/* One-time encrypted temporary credential popup */
.credential-modal{position:fixed;z-index:1200;inset:0;display:grid;padding:20px;place-items:center}.credential-modal-backdrop{position:absolute;inset:0;background:rgba(5,11,26,.76);backdrop-filter:blur(5px)}.credential-dialog{position:relative;width:min(100%,560px);max-height:calc(100vh - 40px);padding:30px;border:1px solid var(--border);border-radius:20px;color:var(--text);background:var(--surface);box-shadow:0 30px 100px rgba(0,0,0,.38);overflow-y:auto;text-align:center}.credential-icon{display:grid;width:56px;height:56px;margin:0 auto 15px;border:1px solid color-mix(in srgb,var(--primary) 25%,var(--border));border-radius:16px;color:var(--primary);background:color-mix(in srgb,var(--primary) 11%,var(--surface));place-items:center;font-size:25px}.credential-dialog h2{margin:5px 0 8px;font-size:22px}.credential-dialog>p:not(.eyebrow):not(.credential-warning){margin:0;color:var(--muted);font-size:11px;line-height:1.6}.credential-values{display:grid;gap:10px;margin:20px 0;text-align:left}.credential-values label{display:grid;padding:12px 14px;border:1px solid var(--border);border-radius:11px;background:var(--surface-soft);gap:6px}.credential-values span{color:var(--muted);font-size:8px;font-weight:800;text-transform:uppercase;letter-spacing:.08em}.credential-values output{font:700 13px ui-monospace,SFMono-Regular,Consolas,monospace;overflow-wrap:anywhere;user-select:all}.credential-mail-status,.credential-warning{display:flex;padding:11px 12px;border-radius:10px;align-items:flex-start;gap:8px;text-align:left;font-size:10px;line-height:1.5}.credential-mail-status.sent{color:#087443;background:#e8f8f0}.credential-mail-status.failed{color:#b54708;background:#fff2df}.credential-warning{margin:10px 0 0!important;color:var(--muted);background:var(--surface-soft)}.credential-mail-status i,.credential-warning i{flex:0 0 auto;margin-top:1px;font-size:15px}.credential-actions{display:flex;margin-top:18px;justify-content:flex-end;gap:9px}.credential-actions .admin-button{min-height:44px}
@media(max-width:560px){.credential-modal{padding:12px}.credential-dialog{max-height:calc(100vh - 24px);padding:23px 16px;border-radius:16px}.credential-dialog h2{font-size:19px}.credential-actions{flex-direction:column-reverse}.credential-actions .admin-button{width:100%}.credential-values output{font-size:11px}}