:root {
  --brand: #2E6BF0; --brand-dark: #2459C8; --ink: #17191F; --paper: #FBFBFC; --surface: #FFFFFF;
  --line: #E9EDF1; --muted: #5A6270; --dark: #0C0E13; --success: #2F8A5B; --warning: #C67D12; --critical: #C0473A;
  --radius-sm: 8px; --radius: 12px; --radius-lg: 18px; --shadow: 0 16px 42px rgba(23,25,31,.09);
  --font-ui: Inter, "Segoe UI", Arial, sans-serif; --font-title: Poppins, Inter, "Segoe UI", sans-serif;
  --font-data: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace; --scale: 1;
}
* { box-sizing: border-box; }
html { font-size: calc(16px * var(--scale)); }
body { margin: 0; color: var(--ink); background: var(--paper); font-family: var(--font-ui); line-height: 1.5; }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }
.hidden { display: none !important; }
.eyebrow { margin: 0 0 .5rem; color: var(--brand); font-size: .75rem; font-weight: 700; letter-spacing: .11em; text-transform: uppercase; }
h1,h2,h3 { margin: 0; font-family: var(--font-title); line-height: 1.15; letter-spacing: -.025em; }
h1 { font-size: clamp(2.4rem, 5vw, 4.8rem); } h2 { font-size: clamp(1.55rem, 2.7vw, 2.25rem); } h3 { font-size: 1.05rem; }
.muted { color: var(--muted); }.data { font-family: var(--font-data); font-variant-numeric: tabular-nums; }
.login-shell { min-height: 100vh; display: grid; grid-template-columns: minmax(0,1.1fr) minmax(420px,.9fr); }
.login-brand { min-height: 100vh; padding: clamp(2rem,5vw,5.5rem); display:flex; flex-direction:column; justify-content:space-between; color:var(--ink); background:#F1F5FF; position:relative; overflow:hidden; }
.login-brand::after { content:""; width:28rem; height:28rem; border:5rem solid rgba(46,107,240,.12); border-radius:50%; position:absolute; right:-13rem; bottom:-13rem; }
.login-logo { width:min(340px,65%); position:relative; z-index:1; }
.login-brand .eyebrow { color:var(--brand); }.login-copy { max-width:42rem; color:var(--muted); font-size:1.12rem; }.login-foot { color:#7A8390; font-size:.8rem; }
.login-panel { display:grid; place-items:center; padding:2rem; background:var(--surface); }
.login-form { width:min(100%,420px); display:grid; gap:1.2rem; }.login-form h2 { margin-bottom:-.55rem; }.login-symbol { width:64px; height:64px; }
label { display:grid; gap:.45rem; color:var(--ink); font-size:.84rem; font-weight:600; }
input,select,textarea { width:100%; border:1px solid #D9DEE5; border-radius:var(--radius-sm); background:var(--surface); color:var(--ink); padding:.72rem .8rem; outline:none; }
input:focus,select:focus,textarea:focus { border-color:var(--brand); box-shadow:0 0 0 3px rgba(46,107,240,.13); }
input:invalid:not(:placeholder-shown),select:invalid { border-color:#D58A7E; }
.required-marker { color:var(--critical); font-weight:800; }.optional-label { color:var(--muted); font-weight:400; }.sr-only { position:absolute!important; width:1px!important; height:1px!important; padding:0!important; margin:-1px!important; overflow:hidden!important; clip:rect(0,0,0,0)!important; white-space:nowrap!important; border:0!important; }
.form-intro { grid-column:1/-1; margin:0 0 .9rem; color:var(--muted); font-size:.82rem; }.button.compact { min-height:34px; padding:.4rem .62rem; font-size:.78rem; white-space:nowrap; }
.button { border-radius:var(--radius-sm); border:1px solid transparent; padding:.68rem 1rem; font-weight:650; min-height:42px; }
.button.primary { background:var(--brand); color:white; }.button.primary:hover { background:var(--brand-dark); }.button.secondary { background:var(--surface); border-color:#D9DEE5; color:var(--ink); }.button.danger { background:#FFF4F2; color:var(--critical); border-color:#F2D2CD; }.full { width:100%; }
.notice { padding:.8rem 1rem; border-radius:var(--radius-sm); font-size:.84rem; }.notice.warning { background:#FFF7E8; color:#7C4A05; border:1px solid #F0D5A7; }
.app-shell { min-height:100vh; display:grid; grid-template-columns:252px 1fr; }
.sidebar { background:var(--surface); border-right:1px solid var(--line); padding:1.3rem 1rem; display:flex; flex-direction:column; position:sticky; top:0; height:100vh; z-index:20; }
.brand-link { display:block; padding:.65rem .55rem 1.8rem; }.brand-link img { width:155px; display:block; }
.sidebar nav { display:grid; gap:.25rem; overflow-y:auto; padding-right:.2rem; }.nav-item { width:100%; display:flex; align-items:center; gap:.8rem; border:0; border-radius:10px; background:transparent; color:var(--muted); padding:.66rem .8rem; text-align:left; font-weight:600; }
.nav-item:hover { background:#F4F7FC; color:var(--ink); }.nav-item.active { background:#EDF3FF; color:var(--brand); }.nav-icon { width:1.5rem; text-align:center; color:currentColor; font-size:1.25rem; line-height:1; }
.sidebar-bottom { margin-top:auto; }.version { padding:0 .8rem; color:#8B93A0; font-family:var(--font-data); font-size:.68rem; }
.app-main { min-width:0; }.topbar { height:70px; padding:0 clamp(1rem,3vw,2.5rem); display:flex; align-items:center; justify-content:space-between; background:rgba(251,251,252,.92); border-bottom:1px solid var(--line); position:sticky; top:0; z-index:10; backdrop-filter:blur(12px); }
.company-context { display:flex; align-items:center; gap:.55rem; font-weight:600; }.status-dot { width:8px; height:8px; border-radius:50%; background:var(--success); box-shadow:0 0 0 3px rgba(47,138,91,.12); }
.top-actions { display:flex; align-items:center; gap:1rem; }.font-control { grid-template-columns:auto 125px; align-items:center; color:var(--muted); }.font-control select { padding:.42rem .55rem; }
.profile-chip { display:flex; align-items:center; gap:.6rem; border:0; background:transparent; color:var(--ink); font-weight:600; }.profile-chip > span:first-child { display:grid; place-items:center; width:34px; height:34px; border-radius:50%; color:white; background:var(--ink); font-size:.72rem; }
.page { padding:clamp(1.2rem,3vw,2.6rem); max-width:1540px; margin:0 auto; }
.page-head { display:flex; justify-content:space-between; gap:1rem; align-items:flex-start; margin-bottom:1.8rem; }.page-head p { max-width:54rem; margin:.55rem 0 0; color:var(--muted); }.page-actions { display:flex; flex-wrap:wrap; gap:.55rem; }
.stats { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1rem; margin-bottom:1.4rem; }.stat { background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:1.15rem; }.stat .value { display:block; margin:.35rem 0 .1rem; font:700 2rem/1 var(--font-title); }.stat .label { color:var(--muted); font-size:.82rem; }.stat .marker { width:32px;height:4px;border-radius:4px;background:var(--brand); }
.grid-2 { display:grid; grid-template-columns:1.4fr 1fr; gap:1rem; }.card { background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:1.15rem; min-width:0; }.card-head { display:flex; align-items:center; justify-content:space-between; gap:1rem; margin-bottom:1rem; }
.quick-actions { display:grid; gap:.55rem; }.quick-action { display:flex; align-items:center; justify-content:space-between; border:1px solid var(--line); border-radius:10px; background:var(--surface); padding:.82rem; text-align:left; }.quick-action:hover { border-color:#BFD0FA; background:#F8FAFF; }.arrow { color:var(--brand); }
.activity { list-style:none; margin:0; padding:0; }.activity li { display:grid; grid-template-columns:9px 1fr auto; gap:.7rem; align-items:start; padding:.68rem 0; border-bottom:1px solid var(--line); }.activity li:last-child { border:0; }.activity .dot { width:7px;height:7px;border-radius:50%;background:var(--brand);margin-top:.45rem; }.activity small { color:var(--muted); }
.toolbar { display:flex; gap:.7rem; align-items:center; margin-bottom:1rem; flex-wrap:wrap; }.search { min-width:min(100%,320px); flex:1; max-width:520px; }.result-count { margin-left:auto; color:var(--muted); font-size:.82rem; }
.table-wrap { width:100%; overflow:auto; border:1px solid var(--line); border-radius:var(--radius); background:var(--surface); }
table { width:100%; border-collapse:collapse; min-width:760px; } th,td { padding:.78rem .85rem; text-align:left; border-bottom:1px solid var(--line); vertical-align:middle; } th { position:sticky; top:0; background:#F6F8FB; color:var(--muted); font-size:.72rem; text-transform:uppercase; letter-spacing:.06em; white-space:nowrap; cursor:pointer; } tr:last-child td { border-bottom:0; } tbody tr:hover { background:#FAFBFE; }
.badge { display:inline-flex; align-items:center; gap:.35rem; border-radius:999px; padding:.28rem .55rem; font-size:.72rem; font-weight:650; background:#EFF2F6; color:var(--muted); }.badge.active,.badge.enabled { background:#EAF6F0;color:var(--success); }.badge.suspended { background:#FFF6E7;color:var(--warning); }.badge.inactive,.badge.disabled { background:#FCEDEA;color:var(--critical); }.badge.mandatory { background:#EDF3FF;color:var(--brand); }
.row-actions { display:flex; gap:.35rem; }.icon-button { width:38px;height:38px;border:1px solid var(--line);border-radius:9px;background:var(--surface);color:var(--ink);display:grid;place-items:center; }.icon-button:hover { border-color:#B7C5D8; background:#F7F9FC; }
.module-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; }.module-card { display:flex; flex-direction:column; gap:.8rem; background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:1rem; }.module-card.enabled { border-color:#BFD0FA; box-shadow:inset 3px 0 var(--brand); }.module-card p { margin:0;color:var(--muted);font-size:.84rem; }.module-card footer { margin-top:auto;display:flex;justify-content:space-between;align-items:center; }
.switch { width:46px;height:26px;border:0;border-radius:20px;background:#C7CDD6;padding:3px; }.switch::after { content:"";display:block;width:20px;height:20px;border-radius:50%;background:white;transition:transform .18s;box-shadow:0 1px 4px rgba(0,0,0,.2); }.switch.on { background:var(--brand); }.switch.on::after { transform:translateX(20px); }.switch:disabled { opacity:.55;cursor:not-allowed; }
.company-layout { display:grid;grid-template-columns:250px 1fr;gap:1rem; }.company-list { display:grid;gap:.4rem;align-content:start; }.company-tab { border:1px solid var(--line);border-radius:10px;background:var(--surface);padding:.8rem;text-align:left; }.company-tab.active { border-color:#AFC4F7;background:#F4F7FF; }.company-form { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem; }.company-form .wide { grid-column:1/-1; }.logo-preview { width:180px;height:100px;object-fit:contain;border:1px dashed #CBD2DC;border-radius:10px;padding:.5rem;background:white; }
.modal { width:min(760px,calc(100% - 2rem));border:0;border-radius:var(--radius-lg);padding:0;box-shadow:var(--shadow); }.modal::backdrop { background:rgba(12,14,19,.58);backdrop-filter:blur(3px); }.modal-card > header,.modal-card > footer { display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1.1rem 1.3rem;border-bottom:1px solid var(--line); }.modal-card > footer { border:0;border-top:1px solid var(--line);justify-content:flex-end; }.modal-body { padding:1.25rem;max-height:65vh;overflow:auto; }.form-grid { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem; }.form-grid .wide { grid-column:1/-1; }
.toast { position:fixed;right:1rem;bottom:1rem;z-index:100;background:var(--ink);color:white;padding:.8rem 1rem;border-radius:10px;box-shadow:var(--shadow);opacity:0;transform:translateY(10px);pointer-events:none;transition:.2s;max-width:420px; }.toast.show { opacity:1;transform:none; }.toast.error { background:var(--critical); }
.empty { padding:3rem 1rem;text-align:center;color:var(--muted); }.mobile-only { display:none; }
.mt-1 { margin-top:1rem; }.inline-check { width:auto; }
.permission-groups { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem; }.permission-group { border:1px solid var(--line); border-radius:10px; padding:.8rem; }.permission-group h3 { margin-bottom:.6rem; }.permission-item { display:grid; grid-template-columns:20px 1fr; align-items:start; gap:.55rem; margin:.45rem 0; font-weight:500; }.permission-item input { width:auto; margin-top:.22rem; }
.master-list { list-style:none; margin:0; padding:0; display:grid; gap:.45rem; }.master-list li { display:flex; justify-content:space-between; gap:.7rem; align-items:center; padding:.45rem 0; border-bottom:1px solid var(--line); }.master-list li:last-child { border-bottom:0; }
body.scale-compact { --scale:.9; } body.scale-normal { --scale:1; } body.scale-large { --scale:1.1; } body.scale-xlarge { --scale:1.2; }
@media(max-width:1050px){.stats{grid-template-columns:repeat(2,1fr)}.module-grid{grid-template-columns:repeat(2,1fr)}.grid-2{grid-template-columns:1fr}.company-layout{grid-template-columns:1fr}.company-list{grid-template-columns:repeat(2,1fr)}}
@media(max-width:760px){.login-shell{grid-template-columns:1fr}.login-brand{display:none}.login-panel{min-height:100vh}.app-shell{grid-template-columns:1fr}.sidebar{position:fixed;left:0;transform:translateX(-100%);transition:transform .2s;width:min(86vw,300px);box-shadow:var(--shadow)}.sidebar.open{transform:none}.mobile-only{display:grid}.topbar{height:62px}.company-context{display:none}.font-control{grid-template-columns:auto 105px}.font-control>span{display:none}.profile-chip>span:last-child{display:none}.page-head{display:grid}.page-actions{width:100%}.page-actions .button{flex:1}.module-grid,.stats,.permission-groups{grid-template-columns:1fr}.company-list{grid-template-columns:1fr}.company-form,.form-grid{grid-template-columns:1fr}.company-form .wide,.form-grid .wide{grid-column:auto}.toolbar .result-count{width:100%;margin:0}.login-form{gap:1rem}}
@media print {.sidebar,.topbar,.page-actions,.toolbar,.row-actions,.switch,.toast{display:none!important}.app-shell{display:block}.page{max-width:none;padding:0}.card,.table-wrap{border-color:#bbb;box-shadow:none}body{background:white;font-size:10pt}.module-grid{grid-template-columns:repeat(2,1fr)}@page{margin:14mm}}
