:root{
    color-scheme:light;
    --bg:#f4f6f8;
    --bg-soft:#eef1f4;
    --surface:#ffffff;
    --surface-2:#f8f9fb;
    --surface-3:#f1f3f6;
    --text:#111827;
    --text-soft:#606a7a;
    --text-faint:#8b95a5;
    --border:#e2e6eb;
    --border-strong:#d4d9e0;
    --accent:#f36b21;
    --accent-hover:#df5b15;
    --accent-soft:#fff0e7;
    --accent-text:#a9400c;
    --navy:#17233b;
    --success:#168454;
    --success-soft:#e8f8f0;
    --danger:#c84242;
    --danger-soft:#fff0f0;
    --warning:#b06b00;
    --warning-soft:#fff6df;
    --shadow-sm:0 1px 2px rgba(15,23,42,.04),0 4px 14px rgba(15,23,42,.04);
    --shadow-md:0 16px 40px rgba(15,23,42,.08);
    --shadow-lg:0 30px 80px rgba(15,23,42,.14);
    --radius-sm:10px;
    --radius:16px;
    --radius-lg:24px;
    --transition:160ms ease;
    font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}

html[data-theme="dark"]{
    color-scheme:dark;
    --bg:#0d1118;
    --bg-soft:#121822;
    --surface:#151c26;
    --surface-2:#19222e;
    --surface-3:#202a37;
    --text:#f2f5f8;
    --text-soft:#aab4c3;
    --text-faint:#7f8998;
    --border:#293443;
    --border-strong:#384456;
    --accent:#ff7a2f;
    --accent-hover:#ff8b4d;
    --accent-soft:#362115;
    --accent-text:#ffae7d;
    --navy:#eef3fa;
    --success:#48ba83;
    --success-soft:#153126;
    --danger:#ff7979;
    --danger-soft:#3a2022;
    --warning:#f0b85a;
    --warning-soft:#352b18;
    --shadow-sm:0 1px 2px rgba(0,0,0,.15),0 6px 18px rgba(0,0,0,.13);
    --shadow-md:0 18px 46px rgba(0,0,0,.25);
    --shadow-lg:0 32px 88px rgba(0,0,0,.42);
}

*{box-sizing:border-box}
html{min-height:100%;background:var(--bg)}
body{margin:0;min-height:100vh;background:var(--bg);color:var(--text);font-size:15px;line-height:1.5;-webkit-font-smoothing:antialiased}
a{color:inherit}
h1,h2,h3,p{margin-top:0}
h1,h2,h3{letter-spacing:-.025em}
h1{font-size:clamp(1.7rem,2.7vw,2.35rem);line-height:1.15}
h2{font-size:1.18rem;line-height:1.25}
small,.muted{color:var(--text-soft)}
code{padding:.18rem .42rem;border-radius:7px;background:var(--surface-3);font-size:.82em;color:var(--text)}

button,.button{
    min-height:42px;border:1px solid transparent;border-radius:11px;padding:.68rem 1rem;background:var(--navy);color:var(--surface);
    font:inherit;font-weight:700;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:.45rem;
    transition:transform var(--transition),background var(--transition),border-color var(--transition),box-shadow var(--transition),color var(--transition),opacity var(--transition)
}
html[data-theme="dark"] button:not(.secondary):not(.danger-button),html[data-theme="dark"] .button:not(.secondary):not(.danger-button){background:var(--accent);color:#fff}
button:hover,.button:hover{transform:translateY(-1px)}
button:focus-visible,.button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,a:focus-visible{outline:3px solid color-mix(in srgb,var(--accent) 28%,transparent);outline-offset:2px}
button:disabled,.button.disabled{opacity:.55;cursor:not-allowed;transform:none}
.secondary{background:var(--surface-3);border-color:var(--border);color:var(--text)}
.secondary:hover{background:var(--surface-2);border-color:var(--border-strong)}
.danger-button{background:var(--danger);color:#fff}
button.small,.button.small{min-height:34px;padding:.42rem .72rem;border-radius:9px;font-size:.84rem}

input,select,textarea{
    width:100%;border:1px solid var(--border-strong);border-radius:11px;padding:.72rem .82rem;background:var(--surface);color:var(--text);
    font:inherit;transition:border-color var(--transition),box-shadow var(--transition),background var(--transition)
}
input:hover,select:hover,textarea:hover{border-color:color-mix(in srgb,var(--border-strong) 65%,var(--text-soft))}
input:focus,select:focus,textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 13%,transparent);outline:0}
textarea{resize:vertical}
label{display:grid;gap:.42rem;font-weight:650;color:var(--text)}
label small{font-weight:400}

.panel{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:1.25rem;box-shadow:var(--shadow-sm)}
.alert{padding:.88rem 1rem;border:1px solid var(--border);border-left:4px solid var(--accent);border-radius:12px;margin-bottom:1rem;background:var(--surface);box-shadow:var(--shadow-sm)}
.alert.danger{border-left-color:var(--danger);background:var(--danger-soft)}
.alert.success{border-left-color:var(--success);background:var(--success-soft)}

.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}.form-grid .full{grid-column:1/-1}
.form-stack{display:grid;gap:.9rem}.actions{display:flex;gap:.6rem;align-items:center;flex-wrap:wrap}
.check{display:flex;grid-auto-flow:column;justify-content:start;align-items:center;gap:.5rem}.check input{width:auto;accent-color:var(--accent)}
.inline-form{display:flex;align-items:center;gap:.7rem;flex-wrap:wrap}.inline-form label{display:flex;align-items:center;gap:.35rem}.inline-form input{width:auto}

.table-wrap{width:100%;overflow:auto}.table-panel{padding:0;overflow:hidden}
table{width:100%;border-collapse:collapse}th,td{text-align:left;padding:.86rem .72rem;border-bottom:1px solid var(--border);vertical-align:middle}
th{font-size:.75rem;text-transform:uppercase;letter-spacing:.055em;color:var(--text-faint);font-weight:750}td small{display:block;margin-top:.2rem}
tbody tr:last-child td{border-bottom:0}.data-table{min-width:720px}.data-table thead th{background:var(--surface-2);position:sticky;top:0;z-index:1}.data-table tbody tr{transition:background var(--transition)}.data-table tbody tr:hover{background:var(--surface-2)}
.data-table th:first-child,.data-table td:first-child{padding-left:1.2rem}.data-table th:last-child,.data-table td:last-child{padding-right:1.2rem}.table-actions{text-align:right;white-space:nowrap}
.compact-table{min-width:620px}.compact-table th,.compact-table td{padding:.72rem .55rem}.compact-table-wrap{margin:0 -1.25rem -1.25rem;width:calc(100% + 2.5rem)}.compact-table th:first-child,.compact-table td:first-child{padding-left:1.25rem}.compact-table th:last-child,.compact-table td:last-child{padding-right:1.25rem}
.empty-state{text-align:center!important;color:var(--text-soft);padding:2.2rem!important}

.badge{display:inline-flex;align-items:center;gap:.35rem;padding:.28rem .58rem;border-radius:999px;background:var(--surface-3);color:var(--text-soft);font-size:.78rem;font-weight:750;line-height:1.1}
.badge.active,.badge.success{background:var(--success-soft);color:var(--success)}.badge.disabled,.badge.danger,.badge.failed{background:var(--danger-soft);color:var(--danger)}
.badge.pending,.badge.warning{background:var(--warning-soft);color:var(--warning)}
.role-superadmin{background:#f1eaff;color:#663aa8}.role-admin{background:#eaf0ff;color:#355da7}.role-customer{background:var(--surface-3);color:var(--text-soft)}
html[data-theme="dark"] .role-superadmin{background:#2d223e;color:#c9a9ff}html[data-theme="dark"] .role-admin{background:#192a47;color:#90b5ff}

.page-head,.panel-head{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem}.page-head{margin-bottom:1.3rem}.page-head h1,.panel-head h2{margin:0}.page-head p,.panel-head p{margin:.35rem 0 0;color:var(--text-soft)}.page-head-actions{display:flex;gap:.6rem;align-items:center;flex-wrap:wrap}
.section-gap{margin-top:1rem}.two-col{display:grid;grid-template-columns:2fr 1fr;gap:1rem;margin-bottom:1rem}.customer-overview-grid{grid-template-columns:minmax(0,.9fr) minmax(0,1.6fr)}
.detail-list{display:grid;gap:.15rem;margin:0}.detail-list>div{display:grid;grid-template-columns:110px minmax(0,1fr);gap:1rem;padding:.72rem 0;border-bottom:1px solid var(--border)}.detail-list>div:last-child{border-bottom:0}.detail-list dt{color:var(--text-soft);font-weight:650}.detail-list dd{margin:0;overflow-wrap:anywhere}
.empty,.empty-card{padding:1.25rem;border:1px dashed var(--border-strong);border-radius:13px;background:var(--surface-2);color:var(--text-soft)}.empty{text-align:center;padding:2rem}.inline-result{margin-top:.8rem;color:var(--text-soft)}.permission-form{justify-content:flex-end}
.danger-zone{margin-top:1rem;border-color:color-mix(in srgb,var(--danger) 35%,var(--border));background:color-mix(in srgb,var(--danger-soft) 36%,var(--surface))}

.theme-toggle{width:42px;height:42px;min-height:42px;padding:0;border-radius:12px;background:var(--surface-2);border:1px solid var(--border);color:var(--text);position:relative;overflow:hidden}
.theme-toggle:hover{background:var(--surface-3)}.theme-toggle-icon{font-size:1.08rem;line-height:1}.theme-toggle .icon-sun{display:none}html[data-theme="dark"] .theme-toggle .icon-moon{display:none}html[data-theme="dark"] .theme-toggle .icon-sun{display:inline}

/* Auth */
.auth-body{min-height:100vh;background:var(--bg);display:grid;place-items:center;padding:clamp(1rem,4vw,3rem);position:relative;overflow-x:hidden}
.auth-shell{width:min(1050px,100%)}.auth-layout{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(380px,.75fr);min-height:620px;background:var(--surface);border:1px solid var(--border);border-radius:28px;overflow:hidden;box-shadow:var(--shadow-lg)}
.auth-visual{position:relative;overflow:hidden;padding:clamp(2rem,4vw,4rem);display:flex;flex-direction:column;justify-content:space-between;background:linear-gradient(145deg,#18243a 0%,#111827 56%,#2a1c13 100%);color:#fff}
.auth-visual:before{content:"";position:absolute;width:420px;height:420px;border-radius:50%;right:-170px;top:-140px;background:radial-gradient(circle,rgba(243,107,33,.7),rgba(243,107,33,0) 67%)}
.auth-visual-copy,.auth-visual-brand{position:relative;z-index:2}.auth-visual-brand{font-weight:900;letter-spacing:.16em;font-size:1rem}.auth-visual-copy h2{font-size:clamp(2rem,4vw,3.5rem);max-width:560px;margin-bottom:1rem}.auth-visual-copy p{max-width:500px;color:#cbd5e1;font-size:1.02rem}
.auth-tower-image{position:absolute;right:-3%;bottom:-10%;height:92%;max-width:55%;object-fit:contain;object-position:right bottom;filter:drop-shadow(0 24px 24px rgba(0,0,0,.25));z-index:1;opacity:.88}
.auth-content{padding:clamp(2rem,4vw,4rem);display:flex;align-items:center}.login-card{width:100%;max-width:430px;margin:auto}.login-card h1{margin-bottom:.55rem}.login-card>p{color:var(--text-soft);margin-bottom:1.8rem}.login-card form{display:grid;gap:1rem}.login-card form>button{margin-top:.35rem;background:var(--accent);color:#fff}.login-card form>button:hover{background:var(--accent-hover)}
.auth-theme{position:fixed;top:1.2rem;right:1.2rem;z-index:10}

/* Modals */
body.modal-open{overflow:hidden}.modal{position:fixed;inset:0;z-index:1000;display:none;align-items:center;justify-content:center;padding:1.25rem}.modal.is-open{display:flex}.modal-backdrop{position:absolute;inset:0;background:rgba(5,10,18,.58);backdrop-filter:blur(4px)}
.modal-dialog{position:relative;z-index:1;width:min(720px,100%);max-height:min(88vh,900px);overflow:auto;background:var(--surface);border:1px solid var(--border);border-radius:20px;box-shadow:var(--shadow-lg)}.modal-dialog-small{width:min(520px,100%)}.modal-dialog-wide{width:min(980px,100%)}
.modal-header{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;padding:1.25rem 1.35rem;border-bottom:1px solid var(--border)}.modal-header h2{margin:0;font-size:1.2rem}.modal-header p{margin:.3rem 0 0;color:var(--text-soft)}
.modal-close{width:38px;height:38px;min-height:38px;padding:0;border-radius:10px;background:var(--surface-3)!important;color:var(--text)!important;font-size:1.45rem;line-height:1}.modal-body{padding:1.35rem}.modal-actions{display:flex;justify-content:flex-end;gap:.65rem;margin-top:.35rem}.modal .form-grid{align-items:start}.modal .form-stack{gap:1rem}.modal .check{min-height:44px}
.entity-search{margin-bottom:1rem}.entity-picker{display:grid;gap:.55rem;max-height:52vh;overflow:auto;padding-right:.25rem}.entity-option{display:flex;align-items:center;gap:.8rem;border:1px solid var(--border);border-radius:12px;padding:.82rem;background:var(--surface-2);cursor:pointer;transition:border-color var(--transition),background var(--transition)}.entity-option:hover{border-color:color-mix(in srgb,var(--accent) 45%,var(--border));background:var(--accent-soft)}.entity-option.is-filtered{display:none!important}.entity-option input{width:auto;accent-color:var(--accent)}.entity-option span{display:grid}.entity-option small{margin-top:.2rem}.function-delete-form{padding-top:0;border-top:1px solid var(--border)}.function-delete-form .button{width:100%}
.hp-field{position:absolute!important;left:-10000px!important;width:1px!important;height:1px!important;overflow:hidden!important}

@media(max-width:900px){.two-col,.customer-overview-grid{grid-template-columns:1fr}.auth-layout{grid-template-columns:1fr;min-height:0}.auth-visual{display:none}.auth-content{padding:2rem}.compact-table-wrap{margin:0;width:100%}.compact-table th:first-child,.compact-table td:first-child{padding-left:.55rem}.compact-table th:last-child,.compact-table td:last-child{padding-right:.55rem}}
@media(max-width:700px){.form-grid{grid-template-columns:1fr}.form-grid .full{grid-column:auto}.page-head,.panel-head{align-items:stretch;flex-direction:column}.page-head-actions,.page-head-actions .button,.panel-head>.button{width:100%}.modal{padding:.65rem;align-items:flex-end}.modal-dialog{width:100%;max-height:92vh;border-radius:18px 18px 10px 10px}.modal-actions{flex-direction:column-reverse}.modal-actions .button,.modal-actions button{width:100%}.auth-content{padding:1.5rem}.auth-theme{top:.75rem;right:.75rem}}