:root {
    color-scheme: light;
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --red: #e51f2a;
    --red-dark: #b90d17;
    --ink: #0f172a;
    --muted: #64748b;
    --line: #e7ebf3;
    --surface: #ffffff;
    --bg: #f4f7fb;
}
* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; background: var(--bg); color: var(--ink); }
a { color: inherit; }
button, input, select, textarea { font: inherit; }

.app-shell { min-height: 100vh; display: grid; grid-template-columns: 270px minmax(0,1fr); }
.sidebar { position: fixed; inset: 0 auto 0 0; width: 270px; padding: 22px 16px 18px; background: linear-gradient(180deg,#111c31 0%,#0d1627 100%); color: #fff; display: flex; flex-direction: column; box-shadow: 16px 0 50px rgba(15,23,42,.13); z-index: 20; }
.sidebar-brand { display: flex; align-items: center; gap: 12px; padding: 0 8px 18px; }
.brand-mark { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 14px; background: linear-gradient(135deg,#ef1e29,#b90d17); color: #fff; font-weight: 950; box-shadow: 0 14px 28px rgba(229,31,42,.25); }
.sidebar-brand strong, .sidebar-brand small { display: block; }
.sidebar-brand strong { font-size: .95rem; }.sidebar-brand small { margin-top: 3px; color: #94a3b8; font-size: .72rem; font-weight: 700; }
.tenant-card { margin: 2px 6px 18px; padding: 13px; display: flex; gap: 11px; align-items: center; border: 1px solid rgba(255,255,255,.08); background: rgba(255,255,255,.05); border-radius: 16px; }
.tenant-code { min-width: 42px; height: 42px; padding: 0 8px; display: grid; place-items: center; border-radius: 13px; color: #fff; background: rgba(229,31,42,.22); border: 1px solid rgba(239,68,68,.25); font-weight: 950; }
.tenant-card strong,.tenant-card small { display:block; }.tenant-card strong { font-size:.84rem }.tenant-card small { color:#94a3b8; margin-top:3px; font-size:.69rem; font-weight:700; }
.menu { overflow-y: auto; padding: 0 3px 12px; scrollbar-width: thin; }
.menu-label { margin: 16px 8px 7px; color: #718096; font-size: .66rem; letter-spacing: .13em; font-weight: 900; }
.menu-link { display: flex; gap: 11px; align-items: center; min-height: 42px; padding: 0 11px; margin: 4px 0; border-radius: 12px; color: #cbd5e1; text-decoration: none; font-size: .82rem; font-weight: 800; transition: .18s ease; }
.menu-link i { width: 20px; text-align:center; font-size:.95rem; }.menu-link:hover { background: rgba(255,255,255,.06); color:#fff; }.menu-link.active { background: linear-gradient(135deg,rgba(229,31,42,.98),rgba(185,13,23,.96)); color:#fff; box-shadow:0 12px 24px rgba(229,31,42,.18); }

.menu-tree { margin: 4px 0; }
.menu-parent { justify-content:flex-start; cursor:default; }
.menu-parent .menu-caret { margin-left:auto; width:auto; font-size:.72rem; color:#94a3b8; }
.menu-tree.open .menu-parent .menu-caret { transform:rotate(0deg); }
.menu-submenu { display:grid; gap:3px; margin:2px 0 7px 13px; padding-left:11px; border-left:1px solid rgba(148,163,184,.16); }
.menu-sublink { min-height:34px; display:flex; align-items:center; gap:9px; padding:0 9px; border-radius:8px; color:#94a3b8; text-decoration:none; font-size:.74rem; font-weight:750; transition:.15s ease; }
.menu-sublink i { width:17px; text-align:center; font-size:.75rem; }
.menu-sublink:hover { color:#fff; background:rgba(255,255,255,.05); }
.menu-sublink.active { color:#ff7180; background:rgba(255,255,255,.055); }

.sidebar-bottom { margin-top: auto; padding-top: 12px; border-top:1px solid rgba(255,255,255,.08); }
.user-mini { display:flex; gap:10px; align-items:center; padding:10px 7px; }.avatar { width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:#fff;color:#111c31;font-weight:950 }.user-mini strong,.user-mini small{display:block;max-width:150px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.user-mini strong{font-size:.78rem}.user-mini small{font-size:.67rem;color:#94a3b8;margin-top:2px;font-weight:700}.logout-btn{width:100%;margin-top:4px;padding:10px 12px;border:0;border-radius:11px;background:transparent;color:#94a3b8;text-align:left;font-weight:800;cursor:pointer}.logout-btn:hover{background:rgba(255,255,255,.06);color:#fff}.logout-btn i{margin-right:9px}
.main-area { grid-column: 2; min-width:0; }
.topbar { min-height: 78px; padding: 14px 28px; display:flex; align-items:center; justify-content:space-between; gap:20px; background:rgba(255,255,255,.94); border-bottom:1px solid #e7ebf3; position:sticky; top:0; z-index:10; backdrop-filter:blur(12px); }
.topbar h1 { margin:4px 0 0; font-size:1.12rem; font-weight:950; }.top-eyebrow { color:#64748b;font-size:.68rem;font-weight:900;letter-spacing:.1em }.topbar-actions { display:flex;align-items:center;gap:8px;color:#64748b;font-size:.76rem;font-weight:800 }.live-dot { width:9px;height:9px;border-radius:50%;background:#22c55e;box-shadow:0 0 0 5px #dcfce7; }
.content { padding: 28px; max-width: 1500px; margin:0 auto; }

.dashboard-hero { display:flex; justify-content:space-between; gap:22px; align-items:center; padding:26px; border-radius:26px; background:radial-gradient(circle at 100% 0%,rgba(239,68,68,.16),transparent 28%),linear-gradient(135deg,#fff 0%,#fff8f8 100%); border:1px solid var(--line); box-shadow:0 20px 50px rgba(15,23,42,.07); }
.eyebrow { display:block;color:#e51f2a;font-size:.68rem;font-weight:950;letter-spacing:.12em }.dashboard-hero h2 { margin:7px 0 5px;font-size:2rem;letter-spacing:-.035em }.dashboard-hero p{margin:0;color:var(--muted);font-weight:650;max-width:760px;line-height:1.55}.hero-tags{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px}.hero-tags span{padding:7px 10px;border-radius:999px;background:#fff;border:1px solid var(--line);font-size:.7rem;font-weight:850;color:#475569}.hero-status{display:flex;align-items:center;gap:12px;min-width:185px;padding:15px;border-radius:18px;background:#fff;border:1px solid var(--line);box-shadow:0 12px 28px rgba(15,23,42,.05)}.hero-status small,.hero-status strong{display:block}.hero-status small{color:#94a3b8;font-size:.67rem;font-weight:900;text-transform:uppercase;letter-spacing:.08em}.hero-status strong{margin-top:3px;font-size:.92rem}.status-dot{width:14px;height:14px;border-radius:50%;background:#22c55e;box-shadow:0 0 0 6px #dcfce7}.status-maintenance{background:#f59e0b;box-shadow:0 0 0 6px #fef3c7}.status-suspended,.status-disabled{background:#ef4444;box-shadow:0 0 0 6px #fee2e2}
.metric-grid { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-top:18px }.metric-card{display:flex;gap:13px;align-items:flex-start;padding:17px;border-radius:20px;background:#fff;border:1px solid var(--line);box-shadow:0 14px 30px rgba(15,23,42,.05);min-height:120px}.metric-icon{width:42px;height:42px;border-radius:14px;display:grid;place-items:center;background:#fff3f3;color:var(--red);border:1px solid #ffe0e0;flex-shrink:0}.metric-card span,.metric-card strong,.metric-card small{display:block}.metric-card span{font-size:.66rem;color:#94a3b8;font-weight:900;letter-spacing:.08em}.metric-card strong{margin-top:7px;font-size:.98rem}.metric-card small{margin-top:5px;color:#64748b;font-size:.7rem;line-height:1.4}
.dashboard-panel { margin-top:18px;padding:22px;border-radius:22px;background:#fff;border:1px solid var(--line);box-shadow:0 18px 38px rgba(15,23,42,.05) }.section-head{display:flex;justify-content:space-between;align-items:center;gap:15px;margin-bottom:16px}.section-head h3{margin:5px 0 0;font-size:1.1rem}.count-badge,.role-badge{padding:7px 10px;border-radius:999px;background:#f1f5f9;color:#475569;font-size:.7rem;font-weight:900}
.module-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.module-card{position:relative;display:flex;gap:13px;align-items:flex-start;padding:16px;border-radius:17px;border:1px solid #e9eef5;background:linear-gradient(180deg,#fff,#fbfdff);text-decoration:none;transition:.18s ease}.module-card:hover{transform:translateY(-2px);box-shadow:0 16px 32px rgba(15,23,42,.08);border-color:#f4c8cb}.module-icon{width:42px;height:42px;border-radius:14px;display:grid;place-items:center;background:#fff4f4;color:#e51f2a;border:1px solid #ffe0e0;flex-shrink:0}.module-card strong{display:block;font-size:.86rem}.module-card p{margin:4px 22px 7px 0;color:#64748b;font-size:.72rem;line-height:1.4}.module-card small{color:#94a3b8;font-size:.66rem;font-weight:800}.module-arrow{position:absolute;right:13px;top:13px;color:#94a3b8}.next-stage p{margin:7px 0 0;color:#64748b;line-height:1.55;font-size:.82rem}
.workspace-hero { display:flex;align-items:center;gap:17px;padding:22px;border-radius:22px;background:linear-gradient(135deg,#fff,#fff8f8);border:1px solid var(--line);box-shadow:0 18px 38px rgba(15,23,42,.05) }.workspace-icon{width:58px;height:58px;border-radius:18px;display:grid;place-items:center;background:linear-gradient(135deg,#e51f2a,#b90d17);color:#fff;font-size:1.25rem;box-shadow:0 14px 28px rgba(229,31,42,.2)}.workspace-hero h2{margin:5px 0 4px}.workspace-hero p{margin:0;color:#64748b;font-size:.8rem}.role-badge{margin-left:auto}.workspace-placeholder{text-align:center;padding:52px 24px}.placeholder-icon{width:62px;height:62px;margin:0 auto 13px;border-radius:20px;display:grid;place-items:center;background:#fff3f3;color:#e51f2a;font-size:1.35rem}.workspace-placeholder h3{margin:0}.workspace-placeholder>p{max-width:760px;margin:9px auto;color:#64748b;line-height:1.55;font-size:.83rem}.placeholder-meta{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:20px}.placeholder-meta span{padding:9px 12px;border-radius:12px;background:#f8fafc;border:1px solid var(--line);color:#64748b;font-size:.72rem}.placeholder-meta strong{color:#0f172a}

.auth-body{background:#0e1829;min-height:100vh}.auth-shell{min-height:100vh;display:grid;grid-template-columns:minmax(420px,1.1fr) minmax(420px,.9fr)}.auth-visual{position:relative;overflow:hidden;padding:42px;display:flex;flex-direction:column;justify-content:space-between;color:#fff;background:radial-gradient(circle at 0% 100%,rgba(239,68,68,.3),transparent 32%),linear-gradient(145deg,#111c31,#0b1321)}.auth-visual::after{content:"";position:absolute;right:-150px;top:10%;width:460px;height:460px;border-radius:50%;background:rgba(229,31,42,.12);filter:blur(8px)}.auth-brand{display:flex;align-items:center;gap:12px;font-weight:950;position:relative;z-index:2}.auth-copy{position:relative;z-index:2;max-width:620px}.eyebrow-light{font-size:.72rem;font-weight:900;letter-spacing:.14em;color:#fca5a5}.auth-copy h1{font-size:3.5rem;line-height:1.02;letter-spacing:-.05em;margin:14px 0}.auth-copy p{color:#cbd5e1;line-height:1.65;font-size:1rem}.auth-points{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px}.auth-points span{padding:9px 12px;border-radius:999px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.1);font-size:.73rem;font-weight:800}.auth-visual>small{position:relative;z-index:2;color:#64748b}.auth-card-wrap{display:grid;place-items:center;padding:36px;background:#f6f8fc}.auth-card{width:min(470px,100%);padding:34px;border-radius:28px;background:#fff;border:1px solid #e7ebf3;box-shadow:0 28px 70px rgba(15,23,42,.13)}.auth-icon{width:58px;height:58px;border-radius:18px;display:grid;place-items:center;background:#fff0f1;color:#e51f2a;font-size:1.35rem;margin-bottom:20px}.auth-icon.danger{color:#b91c1c}.auth-card h2{font-size:1.8rem;letter-spacing:-.03em;margin:8px 0}.auth-card>p{color:#64748b;line-height:1.5;font-size:.84rem;margin-bottom:20px}.auth-primary{width:100%;min-height:48px;border:0;border-radius:14px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#e51f2a,#b90d17);color:#fff;text-decoration:none;font-weight:900;cursor:pointer;box-shadow:0 16px 30px rgba(229,31,42,.2)}.auth-primary:disabled{opacity:.55;cursor:not-allowed}.auth-alert{padding:11px 12px;border-radius:12px;background:#fff1f2;color:#9f1239;border:1px solid #fecdd3;font-size:.78rem;font-weight:700;margin-bottom:14px}.auth-help{margin-top:10px;color:#64748b;font-size:.72rem;line-height:1.45}.auth-separator{display:flex;align-items:center;gap:10px;margin:24px 0 16px;color:#94a3b8;font-size:.64rem;font-weight:900;letter-spacing:.1em}.auth-separator::before,.auth-separator::after{content:"";height:1px;background:#eef2f7;flex:1}.auth-flow{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.auth-flow div{padding:10px;border-radius:12px;background:#f8fafc;text-align:center}.auth-flow strong,.auth-flow span{display:block}.auth-flow strong{width:24px;height:24px;margin:0 auto 6px;display:grid;place-items:center;border-radius:50%;background:#fff;color:#e51f2a;font-size:.7rem}.auth-flow span{color:#64748b;font-size:.64rem;font-weight:800}.simple-state{min-height:100vh;display:grid;place-items:center;padding:30px;background:#f4f7fb}.simple-state-card{width:min(430px,100%);padding:34px;text-align:center;background:#fff;border:1px solid var(--line);border-radius:26px;box-shadow:0 24px 60px rgba(15,23,42,.1)}.simple-state-card .auth-icon{margin:0 auto 16px}.simple-state-card p{color:#64748b;margin-bottom:20px}

@media(max-width:1180px){.metric-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.module-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:900px){.app-shell{display:block}.sidebar{position:relative;width:100%;min-height:auto}.main-area{grid-column:auto}.menu{max-height:420px}.content{padding:20px}.auth-shell{grid-template-columns:1fr}.auth-visual{min-height:420px}.auth-card-wrap{min-height:520px}}
@media(max-width:620px){.metric-grid,.module-grid{grid-template-columns:1fr}.dashboard-hero,.workspace-hero{display:block}.hero-status,.role-badge{margin-top:16px}.auth-copy h1{font-size:2.5rem}.auth-visual{padding:28px}.auth-card-wrap{padding:20px}.auth-flow{grid-template-columns:1fr}}