:root { font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; color: #f7f7f5; background:#0b0b0c; font-synthesis:none; }
* { box-sizing:border-box; }
body { margin:0; min-width:320px; background:radial-gradient(circle at 78% 10%, #26262a 0, #101012 26%, #09090a 58%); }
button,input,select { font:inherit; }
button { color:inherit; }
.app-shell { min-height:100vh; display:grid; grid-template-columns:260px 1fr; }
.sidebar { border-right:1px solid #27272a; padding:28px 20px; background:rgba(10,10,11,.82); backdrop-filter:blur(24px); position:sticky; top:0; height:100vh; overflow:auto; }
.brand-lockup { display:flex; align-items:center; gap:12px; margin-bottom:38px; }
.brand-lockup div { display:flex; flex-direction:column; }
.brand-lockup small { color:#85858d; margin-top:2px; }
.brand-mark { width:40px; height:40px; border-radius:12px; display:grid; place-items:center; background:#f4f4ef; color:#111; font-weight:900; }
nav { display:flex; flex-direction:column; gap:2px; }
nav > div { display:flex; flex-direction:column; }
nav button { text-align:left; border:0; background:transparent; color:#a9a9b0; padding:10px 12px; border-radius:9px; cursor:pointer; }
nav button.active, nav button:hover { color:#fff; background:#1d1d20; }
.nav-label, .eyebrow { text-transform:uppercase; letter-spacing:.14em; font-size:11px; color:#76767f; font-weight:700; }
.nav-label { margin:22px 12px 8px; }
.workspace { padding:44px clamp(24px,5vw,72px) 80px; max-width:1600px; width:100%; }
.topbar { display:flex; justify-content:space-between; align-items:flex-end; gap:30px; margin-bottom:32px; }
.top-actions { display:flex; gap:9px; align-items:center; flex-wrap:wrap; justify-content:flex-end; }
h1 { font-size:clamp(38px,5vw,68px); margin:7px 0 0; letter-spacing:-.055em; line-height:.95; }
h2 { font-size:clamp(26px,3vw,40px); letter-spacing:-.035em; margin:8px 0 12px; }
.tenant-chip, .pill { border:1px solid #2f2f34; background:#151517; color:#c2c2c8; border-radius:999px; padding:10px 14px; font-size:13px; }
.tenant-chip span { display:inline-block; width:8px; height:8px; border-radius:50%; background:#d7ff5c; margin-right:7px; }
select { color:#eee; background:#151517; border:1px solid #2f2f34; border-radius:10px; padding:10px 12px; }
.metric-grid { display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:12px; margin:20px 0 12px; }
.metric, .panel { background:rgba(22,22,24,.84); border:1px solid #2b2b30; border-radius:18px; }
.metric { padding:20px; display:flex; flex-direction:column; min-height:150px; }
.metric span { color:#8d8d95; font-size:13px; }
.metric strong { font-size:42px; letter-spacing:-.04em; margin:10px 0 auto; }
.metric small { color:#777780; }
.panel { padding:28px; margin-top:12px; }
.platform-principle p, .muted { color:#9999a1; line-height:1.65; }
.section-heading { display:flex; justify-content:space-between; align-items:flex-end; gap:20px; margin-bottom:26px; }
.catalog-groups { display:grid; gap:30px; }
.module-group h3 { text-transform:capitalize; color:#9898a1; font-size:14px; }
.module-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.module-card { padding:18px; background:#101012; border:1px solid #29292e; border-radius:14px; min-height:180px; display:flex; flex-direction:column; }
.module-card.enabled { border-color:#3a4326; box-shadow:inset 0 0 0 1px rgba(215,255,92,.04); }
.module-card-top, .module-card-footer { display:flex; justify-content:space-between; gap:12px; align-items:center; }
.module-card p { color:#85858e; line-height:1.5; font-size:13px; flex:1; }
.module-card code { color:#66666d; font-size:11px; }
.status { border-radius:999px; padding:4px 7px; font-size:10px; text-transform:uppercase; letter-spacing:.08em; }
.status.available { background:#242a18; color:#d7ff5c; }
.status.planned { background:#242426; color:#8e8e95; }
.enabled-row { display:flex; flex-wrap:wrap; gap:8px; }
.module-chip { background:#242a18; color:#d7ff5c; border:1px solid #3b4621; padding:8px 10px; border-radius:999px; font-size:12px; }
.table-list { display:grid; gap:8px; }
.org-row { width:100%; border:1px solid #29292e; background:#101012; padding:16px 18px; border-radius:12px; display:flex; align-items:center; justify-content:space-between; text-align:left; cursor:pointer; }
.org-row.selected { border-color:#4b5630; }
.org-row div { display:flex; flex-direction:column; gap:5px; }
.org-row div:last-child { align-items:flex-end; }
.org-row small { color:#777780; }
.primary-button,.secondary-button,.danger-button,.icon-button { border:1px solid #333338; border-radius:10px; padding:10px 13px; cursor:pointer; background:#19191c; }
.primary-button { border-color:#d7ff5c; background:#d7ff5c; color:#111; font-weight:800; }
.secondary-button:hover,.icon-button:hover { background:#242428; }
.danger-button { border-color:#4a2c2c; color:#f1a3a3; background:#241717; }
button:disabled { opacity:.5; cursor:not-allowed; }
.error-box { border:1px solid #693b3b; background:#291919; color:#ffb5b5; padding:11px 12px; border-radius:10px; font-size:13px; }
.page-error { margin-bottom:12px; }
.login-shell,.loading-screen { min-height:100vh; display:grid; place-items:center; padding:24px; }
.loading-screen { color:#aaa; }
.login-card { width:min(460px,100%); background:rgba(17,17,19,.94); border:1px solid #2c2c31; border-radius:22px; padding:32px; box-shadow:0 24px 80px rgba(0,0,0,.35); }
.login-brand { margin-bottom:42px; }
.login-title { font-size:52px; margin:8px 0 12px; }
.login-form { display:grid; gap:14px; margin-top:28px; }
.login-form label { color:#9b9ba3; font-size:12px; display:grid; gap:7px; }
.login-form input { width:100%; background:#0d0d0f; color:#fff; border:1px solid #333338; border-radius:10px; padding:12px 13px; outline:none; }
.login-form input:focus { border-color:#74747e; }
.login-note { display:block; color:#6f6f76; margin-top:18px; line-height:1.5; }
@media (max-width:1100px){ .metric-grid{grid-template-columns:repeat(2,1fr)}.module-grid{grid-template-columns:repeat(2,1fr)} }
@media (max-width:980px){ .app-shell{grid-template-columns:1fr}.sidebar{display:none}.topbar{align-items:flex-start;flex-direction:column}.top-actions{justify-content:flex-start} }
@media (max-width:620px){ .workspace{padding:28px 16px 60px}.metric-grid,.module-grid{grid-template-columns:1fr}.tenant-chip{width:100%}.panel{padding:20px}.section-heading{align-items:flex-start;flex-direction:column}.login-title{font-size:42px}.top-actions{width:100%}.top-actions select{width:100%} }