/* Generated core style bundle. Source files remain authoritative. */

/* Source: assets/styles/tokens/design-tokens.css */
:root{
  --font-family-base:'bog-font', Arial, sans-serif;

  --color-bg:rgba(22,9,9,.90);
  --color-surface:rgba(17,12,12,.78);
  --color-surface-soft:rgba(255,255,255,.045);
  --color-surface-raised:rgba(255,255,255,.065);
  --color-accent:#d6b075;
  --color-accent-soft:rgba(214,176,117,.18);
  --color-accent-line:rgba(214,176,117,.32);
  --color-border:rgba(255,255,255,.11);
  --color-border-soft:rgba(255,255,255,.08);
  --color-text:#fff;
  --color-muted:rgba(255,255,255,.74);
  --color-muted-strong:rgba(255,255,255,.58);
  --color-success:#4dc27a;
  --color-danger:#e36b6b;
  --color-warning:#d8b35f;
  --color-info:#67b7f7;

  --space-1:4px;
  --space-2:6px;
  --space-3:8px;
  --space-4:10px;
  --space-5:12px;
  --space-6:14px;
  --space-7:16px;
  --space-8:18px;
  --space-9:24px;

  --radius-sm:10px;
  --radius-md:12px;
  --radius-lg:14px;
  --radius-xl:18px;

  --shadow-md-token:0 12px 30px rgba(0,0,0,.32);
  --shadow-lg-token:0 20px 46px rgba(0,0,0,.42);

  --transition-fast:160ms ease;
  --transition-normal:220ms ease;

  --layout-page-width:1180px;
}

/* Source: assets/styles/base/base.css */
@font-face{
  font-family:'bog-font';
  src:url('../../../Cairo-Regular.ttf') format('truetype');
  font-weight:400;
  font-style:normal;
  font-display:swap;
}

*{
  font-family:'bog-font', Arial, sans-serif;
  box-sizing:border-box;
  margin:0;
  padding:0;
}

:root{
  --bg:rgba(22,9,9,.90);
  --panel:rgba(17,12,12,.78);
  --panel-2:rgba(255,255,255,.045);
  --panel-3:rgba(255,255,255,.065);
  --glass1:rgba(120,18,18,.56);
  --glass2:rgba(120,18,18,.24);
  --glass3:rgba(120,18,18,.10);
  --accent:#d6b075;
  --accent-soft:rgba(214,176,117,.18);
  --accent-line:rgba(214,176,117,.32);
  --stroke:rgba(255,255,255,.11);
  --stroke-2:rgba(255,255,255,.08);
  --text:#fff;
  --muted:rgba(255,255,255,.74);
  --muted-2:rgba(255,255,255,.58);
  --ok:#4dc27a;
  --bad:#e36b6b;
  --warn:#d8b35f;
  --shadow:0 12px 30px rgba(0,0,0,.32);
  --shadow-lg:0 20px 46px rgba(0,0,0,.42);
  --radius-xl:18px;
  --radius-lg:14px;
  --radius-md:12px;
  --radius-sm:10px;
  --page-w:1180px;
}

html,body{
  width:100%;
  max-width:100%;
}

body{
  min-height:100vh;
  min-height:100svh;
  background-color:var(--bg);
  background-image:
    radial-gradient(900px 520px at 86% 18%, rgba(120,18,18,.42), transparent 62%),
    radial-gradient(780px 520px at 8% 86%, rgba(85,12,12,.55), transparent 64%),
    linear-gradient(135deg, rgba(9,3,3,.96), rgba(34,9,9,.94));
  background-size:cover;
  background-position:center;
  background-attachment:fixed;
  color:var(--text);
  direction:rtl;
}

a{
  color:inherit;
  text-decoration:none;
}

img{
  max-width:100%;
  height:auto;
}

button,
input,
select,
textarea{
  font-family:inherit;
}

.overlay{
  position:fixed;
  inset:0;
  background:
    radial-gradient(1000px 540px at 85% 10%, rgba(214,176,117,.11), transparent 58%),
    radial-gradient(760px 420px at 10% 85%, rgba(160,28,28,.18), transparent 55%),
    linear-gradient(180deg, rgba(0,0,0,.36), rgba(0,0,0,.56));
  pointer-events:none;
  z-index:0;
}

.app{
  position:relative;
  z-index:1;
  min-height:100vh;
  min-height:100svh;
  display:flex;
  flex-direction:column;
}

.page{
  width:94%;
  max-width:var(--page-w);
  margin:14px auto 0;
  padding-bottom:18px;
}

.topbar{
  border-radius:16px;
  padding:14px;
  background-image:linear-gradient(180deg, var(--glass1), var(--glass2) 45%, var(--glass3));
  border:1px solid var(--stroke);
  box-shadow:var(--shadow);
  -webkit-backdrop-filter:blur(10px);
  backdrop-filter:blur(10px);
}

.topbar-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}

.brand{
  display:flex;
  align-items:center;
  gap:8px;
  min-width:0;
  flex:1;
}

.logo{
  width:100%;
  max-width:250px;
  height:96px;
  border-radius:18px;
  background:rgba(255,255,255,.08);
  border:1px solid var(--stroke);
  box-shadow:0 10px 24px rgba(0,0,0,.24);
  display:grid;
  place-items:center;
  overflow:hidden;
  flex:0 0 auto;
}

.logo img{
  width:100%;
  max-height:82%;
  object-fit:contain;
  padding:4px 18px;
  display:block;
}

select,
.sys-action-select,
.row-action-select{
  text-align:center;
  text-align-last:center;
}

select option{
  text-align:center;
}

.brand-text{
  min-width:0;
  text-align:right;
  flex:1;
}

.brand-text h1{
  font-size:20px;
  line-height:1.55;
}

.brand-text p{
  margin-top:4px;
  font-size:13px;
  color:var(--muted);
  line-height:1.7;
}

.chip{
  display:flex;
  align-items:center;
  gap:10px;
  padding:10px 12px;
  border-radius:14px;
  background:rgba(20,16,16,.74);
  border:1px solid var(--stroke);
  box-shadow:var(--shadow);
  user-select:none;
  flex:0 0 auto;
  text-align:center;
}

.chip small{
  display:block;
  color:var(--muted);
  font-size:12px;
  line-height:1.2;
}

.chip strong{
  display:block;
  font-size:14px;
  letter-spacing:0;
  line-height:1.45;
}

/* Source: assets/styles/themes/default-theme.css */
:root{
  --bg:var(--color-bg);
  --panel:var(--color-surface);
  --panel-2:var(--color-surface-soft);
  --panel-3:var(--color-surface-raised);
  --accent:var(--color-accent);
  --accent-soft:var(--color-accent-soft);
  --accent-line:var(--color-accent-line);
  --stroke:var(--color-border);
  --stroke-2:var(--color-border-soft);
  --text:var(--color-text);
  --muted:var(--color-muted);
  --muted-2:var(--color-muted-strong);
  --ok:var(--color-success);
  --bad:var(--color-danger);
  --warn:var(--color-warning);
  --shadow:var(--shadow-md-token);
  --shadow-lg:var(--shadow-lg-token);
  --page-w:var(--layout-page-width);
}

/* Source: assets/styles/components/layout-surfaces.css */
.content,
.card,
.sys-card{
  margin-top:12px;
  border-radius:var(--radius-xl);
  padding:18px;
  background:var(--panel);
  border:1px solid var(--stroke);
  box-shadow:var(--shadow-lg);
  -webkit-backdrop-filter:blur(8px);
  backdrop-filter:blur(8px);
}

.content + .content,
.card + .card,
.sys-card + .sys-card{
  margin-top:14px;
}

.headline,
.sys-headline{
  text-align:center;
  margin-bottom:14px;
}

.headline h1{
  font-size:28px;
  font-size:clamp(24px,3.8vw,38px);
  font-weight:900;
  line-height:1.5;
  margin-bottom:10px;
  text-align:center;
  max-width:100%;
  white-space:normal;
  word-break:normal;
  overflow-wrap:break-word;
  overflow-wrap:anywhere;
}

.headline h2,
.sys-headline h2,
.title{
  font-size:22px;
  font-weight:900;
  line-height:1.55;
  margin-bottom:8px;
  text-align:center;
}

.headline p,
.sys-headline p,
.sub{
  max-width:920px;
  margin-inline:auto;
  text-align:center;
  font-size:14px;
  color:var(--muted);
  line-height:1.85;
}

.section-title{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:12px;
}

.section-title h3{
  font-size:18px;
  font-weight:900;
  line-height:1.5;
}

.section-title p{
  font-size:13px;
  color:var(--muted);
  line-height:1.7;
}


.alert,
.sys-alert{
  border-radius:14px;
  padding:12px 14px;
  margin:10px 0 14px;
  border:1px solid var(--stroke);
  background:rgba(19,16,16,.72);
  box-shadow:0 8px 20px rgba(0,0,0,.20);
  text-align:right;
}

.alert.ok,
.alert.success,
.sys-alert.ok,
.sys-alert.success{
  border-color:rgba(77,194,122,.32);
  box-shadow:0 0 0 3px rgba(77,194,122,.10) inset;
}

.alert.bad,
.alert.error,
.sys-alert.bad,
.sys-alert.error{
  border-color:rgba(227,107,107,.30);
  box-shadow:0 0 0 3px rgba(227,107,107,.10) inset;
}

.alert.warn,
.sys-alert.warn{
  border-color:rgba(216,179,95,.32);
  box-shadow:0 0 0 3px rgba(216,179,95,.10) inset;
}

.alert ul,
.sys-alert ul{
  margin:8px 18px 0 0;
  color:var(--muted);
  line-height:1.9;
}

/* Source: assets/styles/components/tables-basic.css */
.tbl{
  width:100%;
  border-collapse:separate;
  border-spacing:0;
  border-radius:16px;
  overflow:hidden;
  border:1px solid var(--stroke);
  background:rgba(0,0,0,.16);
  margin-top:12px;
  table-layout:auto;
}

.tbl th,
.tbl td{
  padding:12px 14px;
  border-bottom:1px solid var(--stroke-2);
  vertical-align:middle;
}

.tbl tr:last-child th,
.tbl tr:last-child td{
  border-bottom:0;
}

.tbl th{
  width:230px;
  background:rgba(255,255,255,.05);
  color:var(--muted);
  font-weight:900;
  text-align:right;
  font-size:14px;
  line-height:1.6;
}

.tbl td{
  text-align:right;
}

.sys-table{
  width:100%;
  border-collapse:collapse;
}

.sys-table th,
.sys-table td{
  padding:10px 8px;
  border-bottom:1px solid var(--stroke-2);
  text-align:center;
  font-size:13px;
  line-height:1.6;
}

.sys-table th{
  background:rgba(255,255,255,.05);
  color:var(--muted);
  font-weight:900;
}

/* Source: assets/styles/components/forms.css */
.form-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0,1fr));
  gap:12px;
  margin-top:12px;
}

.field{
  display:flex;
  flex-direction:column;
  gap:6px;
}

.field label{
  color:var(--muted);
  font-size:13px;
  font-weight:800;
  line-height:1.5;
}

.field.full{
  grid-column:1 / -1;
}

.checks{
  display:flex;
  align-items:center;
  gap:14px;
  flex-wrap:wrap;
  margin:12px 0;
}

.checks label{
  display:inline-flex;
  align-items:center;
  gap:8px;
  border-radius:12px;
  padding:10px 12px;
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.08);
  font-size:13px;
  font-weight:700;
  line-height:1.5;
}


input[type='text'],
input[type='password'],
input[type='date'],
input[type='time'],
input[type='number'],
input[type='email'],
input[type='search'],
input[type='file'],
select,
textarea{
  width:100%;
  max-width:420px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(0,0,0,.24);
  color:var(--text);
  padding:11px 12px;
  outline:none;
  font-size:14px;
  text-align:right;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.03);
  transition:border-color .18s ease, box-shadow .18s ease, background .18s ease;
}

.tbl td input[type='text'],
.tbl td input[type='password'],
.tbl td input[type='date'],
.tbl td input[type='time'],
.tbl td input[type='number'],
.tbl td input[type='email'],
.tbl td input[type='search'],
.tbl td input[type='file'],
.tbl td select,
.tbl td textarea,
.field input,
.field select,
.field textarea{
  width:100%;
  max-width:100%;
}

input[type='file']{
  cursor:pointer;
  padding:10px;
  line-height:1.5;
}

input::placeholder,
textarea::placeholder{
  color:rgba(255,255,255,.52);
}

input:focus,
select:focus,
textarea:focus{
  border-color:var(--accent-line);
  box-shadow:0 0 0 3px rgba(214,176,117,.10);
  background:rgba(0,0,0,.30);
}

textarea{
  min-height:100px;
  resize:vertical;
}

select{
  appearance:none;
  -webkit-appearance:none;
  -moz-appearance:none;
  background-image:
    linear-gradient(45deg, transparent 50%, rgba(255,255,255,.72) 50%),
    linear-gradient(135deg, rgba(255,255,255,.72) 50%, transparent 50%);
  background-position:
    calc(14px) calc(50% - 3px),
    calc(8px) calc(50% - 3px);
  background-size:6px 6px, 6px 6px;
  background-repeat:no-repeat;
  padding-left:28px;
}


button:disabled,
.btn:disabled,
.sys-btn:disabled,
input:disabled,
select:disabled,
textarea:disabled{
  opacity:.62;
  cursor:not-allowed;
  box-shadow:none;
  transform:none;
}

input[readonly],
textarea[readonly]{
  background:rgba(255,255,255,.04);
  border-color:rgba(255,255,255,.10);
}

input[type='checkbox'],
input[type='radio']{
  accent-color:var(--accent);
  width:16px;
  height:16px;
  cursor:pointer;
}

/* Source: assets/styles/components/actions.css */
.actions,
.table-actions,
.form-actions{
  margin-top:14px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  flex-wrap:wrap;
}

.btn,
.sys-btn,
button.btn,
button.sys-btn,
a.btn,
a.sys-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  min-width:110px;
  max-width:100%;
  min-height:42px;
  padding:10px 16px;
  border-radius:12px;
  border:1px solid transparent;
  cursor:pointer;
  font-weight:900;
  font-size:13px;
  line-height:1.2;
  text-align:center;
  text-decoration:none;
  transition:transform .16s ease, box-shadow .16s ease, background .16s ease, border-color .16s ease;
  box-shadow:0 6px 14px rgba(0,0,0,.18);
}

[hidden],
.btn[hidden],
.sys-btn[hidden],
button.btn[hidden],
button.sys-btn[hidden],
a.btn[hidden],
a.sys-btn[hidden]{
  display:none !important;
}

.btn:hover,
.sys-btn:hover,
button.btn:hover,
button.sys-btn:hover,
a.btn:hover,
a.sys-btn:hover{
  transform:translateY(-1px);
}

.btn:active,
.sys-btn:active,
button.btn:active,
button.sys-btn:active,
a.btn:active,
a.sys-btn:active{
  transform:translateY(0);
}

.btn-primary,
.btn,
.sys-btn{
  background:var(--accent);
  color:#171717;
  border-color:rgba(214,176,117,.38);
}

.btn-secondary,
.sys-btn-secondary{
  background:rgba(255,255,255,.90);
  color:#151515;
  border-color:rgba(255,255,255,.26);
}

.btn-outline,
.sys-btn-outline{
  background:rgba(255,255,255,.03);
  color:#fff;
  border-color:rgba(255,255,255,.15);
}

.btn-success,
.sys-btn-success{
  background:rgba(77,194,122,.92);
  color:#101010;
  border-color:rgba(77,194,122,.30);
}

.btn-warning,
.sys-btn-warning{
  background:rgba(216,179,95,.95);
  color:#111;
  border-color:rgba(216,179,95,.30);
}

.btn-danger,
.sys-btn-danger{
  background:rgba(227,107,107,.94);
  color:#111;
  border-color:rgba(227,107,107,.26);
}

.btn-sm,
.sys-btn-sm{
  min-width:86px;
  min-height:36px;
  padding:7px 11px;
  border-radius:10px;
  font-size:12px;
}

.btn-lg,
.sys-btn-lg{
  min-width:132px;
  min-height:46px;
  padding:12px 18px;
}

.btn-block,
.sys-btn-block{
  width:100%;
}

.sys-action-menu{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:8px;
  flex-wrap:wrap;
  width:100%;
}

.sys-action-menu.start{
  justify-content:flex-start;
}

.sys-action-select,
.module-action-select,
.row-action-select{
  width:100%;
  max-width:280px;
  min-height:42px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.18);
  background:rgba(255,255,255,.92);
  color:#151515;
  padding:9px 12px;
  font-size:13px;
  font-weight:900;
  line-height:1.2;
  cursor:pointer;
  box-shadow:0 6px 14px rgba(0,0,0,.16);
}

.row-action-select{
  min-width:132px;
  max-width:190px;
  min-height:38px;
  padding:8px 10px;
  font-size:12px;
}

.sys-action-select-wide{
  max-width:360px;
}

.inline-form{
  display:inline-flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
}


.toolbar,
.sys-toolbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  flex-wrap:wrap;
  margin-bottom:14px;
}

.toolbar-start,
.toolbar-end,
.sys-toolbar-start,
.sys-toolbar-end{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}

.filter-bar,
.sys-filter-bar{
  display:grid;
  grid-template-columns:repeat(4, minmax(0,1fr));
  gap:10px;
  margin-top:12px;
  margin-bottom:14px;
  padding:12px;
  border-radius:14px;
  background:rgba(255,255,255,.035);
  border:1px solid rgba(255,255,255,.08);
}

.filter-bar.compact,
.sys-filter-bar.compact{
  grid-template-columns:repeat(5, minmax(0,1fr));
}

.sys-subhead{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:12px;
  padding-bottom:10px;
  border-bottom:1px solid rgba(255,255,255,.08);
}

.sys-subhead-title{
  font-size:17px;
  font-weight:900;
  line-height:1.6;
}

.sys-subhead-note{
  font-size:12px;
  color:var(--muted);
  line-height:1.7;
}

/* Source: assets/styles/components/data-display.css */
.stats-grid,
.sys-stats-grid{
  display:grid;
  grid-template-columns:repeat(4, minmax(0,1fr));
  gap:10px;
  margin-top:12px;
}

.stat-box,
.sys-stat-box{
  border-radius:14px;
  padding:14px 12px;
  text-align:center;
  background:rgba(255,255,255,.045);
  border:1px solid rgba(255,255,255,.10);
  box-shadow:0 8px 18px rgba(0,0,0,.16);
}

.stat-box .num,
.sys-stat-box .num{
  font-size:22px;
  font-weight:900;
  line-height:1.2;
  margin-bottom:5px;
}

.stat-box .lbl,
.sys-stat-box .lbl{
  font-size:12px;
  color:var(--muted);
  line-height:1.7;
}


.info-grid,
.sys-info-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0,1fr));
  gap:12px;
  margin-top:12px;
}

.info-box,
.sys-info-box,
.sys-user-box{
  border-radius:14px;
  padding:13px 12px;
  background:rgba(255,255,255,.045);
  border:1px solid rgba(255,255,255,.10);
  min-width:0;
}

.info-label,
.sys-info-label{
  font-size:12px;
  color:var(--muted);
  margin-bottom:4px;
  line-height:1.7;
}

.info-value,
.sys-info-value{
  font-size:15px;
  font-weight:800;
  line-height:1.8;
  word-break:break-word;
  overflow-wrap:anywhere;
}


.list-stack{
  display:grid;
  gap:12px;
}

.list-card{
  border-radius:14px;
  padding:14px;
  background:rgba(255,255,255,.045);
  border:1px solid rgba(255,255,255,.10);
}

.list-card-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  flex-wrap:wrap;
  margin-bottom:10px;
}

.list-card-title{
  font-size:15px;
  font-weight:900;
  line-height:1.7;
}

.list-card-sub{
  font-size:12px;
  color:var(--muted);
  line-height:1.7;
}

/* Source: assets/styles/components/tables-data.css */
.table-wrap{
  overflow:auto;
  border-radius:16px;
  border:1px solid var(--stroke);
  background:rgba(0,0,0,.16);
  margin-top:12px;
  box-shadow:0 8px 20px rgba(0,0,0,.20);
  scrollbar-width:thin;
  scrollbar-color:rgba(255,255,255,.18) transparent;
  max-width:100%;
  -webkit-overflow-scrolling:touch;
}

[class$='-table-wrap'],
[class*='-table-wrap ']{
  max-width:100%;
}

.table-wrap::-webkit-scrollbar{
  height:8px;
  width:8px;
}

.table-wrap::-webkit-scrollbar-thumb{
  background:rgba(255,255,255,.16);
  border-radius:999px;
}

.table-wrap table{
  width:100%;
  min-width:760px;
  border-collapse:collapse;
}

.table-wrap th,
.table-wrap td{
  padding:12px 10px;
  border-bottom:1px solid var(--stroke-2);
  text-align:center;
  color:#fff;
  white-space:nowrap;
  font-size:13px;
}

.table-wrap th{
  background:rgba(255,255,255,.05);
  color:var(--muted);
  font-weight:900;
  position:sticky;
  top:0;
  z-index:1;
}

.table-wrap tr:hover td{
  background:rgba(255,255,255,.018);
}

.table-wrap table tr:last-child td{
  border-bottom:0;
}

.table-wrap td.text-start,
.table-wrap th.text-start{
  text-align:right;
}

.table-wrap td.text-center,
.table-wrap th.text-center{
  text-align:center;
}

.table-wrap td.wrap,
.table-wrap th.wrap{
  white-space:normal;
  word-break:break-word;
  overflow-wrap:anywhere;
}

.table-wrap td.actions-cell{
  white-space:normal;
}

.table-responsive{
  width:100%;
  max-width:100%;
  overflow:auto;
  border-radius:16px;
  border:1px solid var(--stroke);
  background:rgba(0,0,0,.16);
  margin-top:12px;
  box-shadow:0 8px 20px rgba(0,0,0,.20);
  scrollbar-width:thin;
  scrollbar-color:rgba(255,255,255,.18) transparent;
  -webkit-overflow-scrolling:touch;
}

.table-responsive::-webkit-scrollbar{
  height:8px;
  width:8px;
}

.table-responsive::-webkit-scrollbar-thumb{
  background:rgba(255,255,255,.16);
  border-radius:999px;
}

.table-responsive table{
  width:100%;
  min-width:760px;
  border-collapse:collapse;
}

.table-responsive th,
.table-responsive td{
  padding:12px 10px;
  border-bottom:1px solid var(--stroke-2);
  text-align:center;
  color:#fff;
  white-space:nowrap;
  font-size:13px;
  line-height:1.6;
}

.table-responsive th{
  background:rgba(255,255,255,.05);
  color:var(--muted);
  font-weight:900;
  position:sticky;
  top:0;
  z-index:1;
}

.table-responsive tr:hover td{
  background:rgba(255,255,255,.018);
}

.table-responsive table tr:last-child td{
  border-bottom:0;
}

.table-actions-inline{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  flex-wrap:wrap;
}

.sys-table-compact th,
.sys-table-compact td{
  padding:9px 8px;
  font-size:12px;
}

.sys-table-dense th,
.sys-table-dense td{
  padding:7px 6px;
  font-size:11px;
}

/* Source: assets/styles/components/mobile-card-tables.css */
@media (max-width:860px){
  .emp-table-wrap,
  .recruitment-table-wrap,
  .profile-table-wrap,
  .rec-table-wrap{
    overflow:visible;
    border:0;
    background:transparent;
  }

  .emp-table,
  .recruitment-table,
  .profile-table,
  .rec-table{
    display:block;
    width:100%;
    min-width:0;
    max-width:100%;
    table-layout:auto;
    border-collapse:separate;
    border-spacing:0;
    overflow:visible;
  }

  .emp-table thead,
  .recruitment-table thead,
  .profile-table thead,
  .rec-table thead{
    display:none;
  }

  .emp-table tbody,
  .recruitment-table tbody,
  .profile-table tbody,
  .rec-table tbody{
    display:grid;
    grid-template-columns:1fr;
    gap:7px;
    width:100%;
  }

  .emp-table tr,
  .recruitment-table tr,
  .profile-table tr,
  .rec-table tr{
    display:grid;
    grid-template-columns:34px minmax(0,1fr);
    align-items:start;
    gap:0 8px;
    width:100%;
    padding:8px 10px;
    border:1px solid rgba(255,255,255,.10);
    border-radius:12px;
    background:rgba(255,255,255,.035);
    overflow:visible;
    cursor:pointer;
    transition:background .16s ease, border-color .16s ease;
  }

  .emp-table tr::before,
  .recruitment-table tr::before,
  .profile-table tr::before,
  .rec-table tr::before{
    content:"\203A";
    grid-column:1;
    grid-row:1 / span 4;
    width:28px;
    height:28px;
    display:grid;
    place-items:center;
    border-radius:999px;
    background:rgba(245,190,108,.18);
    border:1px solid rgba(245,190,108,.28);
    color:#f4d093;
    font-size:13px;
    font-weight:900;
    transform:rotate(90deg);
    transition:transform .16s ease, background .16s ease;
  }

  .emp-table tr.is-expanded,
  .recruitment-table tr.is-expanded,
  .profile-table tr.is-expanded,
  .rec-table tr.is-expanded{
    background:rgba(255,255,255,.055);
    border-color:rgba(245,190,108,.20);
  }

  .emp-table tr.is-expanded::before,
  .recruitment-table tr.is-expanded::before,
  .profile-table tr.is-expanded::before,
  .rec-table tr.is-expanded::before{
    transform:rotate(0deg);
    background:rgba(245,190,108,.26);
  }

  .emp-table td,
  .recruitment-table td,
  .profile-table td,
  .rec-table td{
    display:grid;
    grid-column:2;
    grid-template-columns:minmax(74px, .36fr) minmax(0, 1fr);
    align-items:center;
    justify-items:start;
    gap:7px;
    width:100%;
    min-width:0;
    max-width:none;
    border:0;
    padding:2px 0;
    font-size:11.5px;
    line-height:1.55;
    white-space:normal;
    word-break:normal;
    overflow-wrap:anywhere;
    overflow:visible;
    text-overflow:clip;
    direction:rtl;
    text-align:right;
  }

  .emp-table tr:not(.is-expanded) td:nth-child(n+4),
  .recruitment-table tr:not(.is-expanded) td:nth-child(n+4),
  .profile-table tr:not(.is-expanded) td:nth-child(n+4),
  .rec-table tr:not(.is-expanded) td:nth-child(n+4){
    display:none;
  }

  .emp-table tr:not(.is-expanded) td:nth-child(1),
  .recruitment-table tr:not(.is-expanded) td:nth-child(1),
  .profile-table tr:not(.is-expanded) td:nth-child(1),
  .rec-table tr:not(.is-expanded) td:nth-child(1){
    opacity:.74;
  }

  .emp-table td[colspan],
  .recruitment-table td[colspan],
  .profile-table td[colspan],
  .rec-table td[colspan]{
    display:block;
    text-align:center;
  }

  .emp-table td::before,
  .recruitment-table td::before,
  .profile-table td::before,
  .rec-table td::before{
    content:attr(data-label);
    display:block;
    color:rgba(255,255,255,.62);
    font-size:10px;
    font-weight:800;
    line-height:1.35;
    justify-self:start;
    direction:rtl;
    text-align:right;
  }

  .emp-table td:not([data-label])::before,
  .recruitment-table td:not([data-label])::before,
  .profile-table td:not([data-label])::before,
  .rec-table td:not([data-label])::before,
  .emp-table td[data-label='']::before,
  .recruitment-table td[data-label='']::before,
  .profile-table td[data-label='']::before,
  .rec-table td[data-label='']::before{
    display:none;
  }

  .rec-table .rec-card-row:not(.is-expanded){
    grid-template-columns:32px minmax(0,1.15fr) minmax(84px,.9fr) minmax(66px,.7fr) minmax(96px,1fr);
    align-items:center;
    gap:0 7px;
  }

  .rec-table .rec-card-row:not(.is-expanded)::before{
    grid-row:1;
    align-self:center;
  }

  .rec-table .rec-card-row:not(.is-expanded) td{
    display:none;
  }

  .rec-table .rec-card-row:not(.is-expanded) .rec-name-cell,
  .rec-table .rec-card-row:not(.is-expanded) .rec-identity-cell,
  .rec-table .rec-card-row:not(.is-expanded) .rec-nationality-cell,
  .rec-table .rec-card-row:not(.is-expanded) .rec-datetime-cell{
    display:block;
    grid-column:auto;
    min-width:0;
    padding:0;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    font-size:11.5px;
    line-height:1.45;
  }

  .rec-table .rec-card-row:not(.is-expanded) .rec-name-cell::before,
  .rec-table .rec-card-row:not(.is-expanded) .rec-identity-cell::before,
  .rec-table .rec-card-row:not(.is-expanded) .rec-nationality-cell::before,
  .rec-table .rec-card-row:not(.is-expanded) .rec-datetime-cell::before{
    display:none;
  }

  .rec-table .rec-card-row:not(.is-expanded) .rec-name-cell{
    font-weight:800;
  }

  .rec-table .rec-card-row:not(.is-expanded) .rec-identity-cell,
  .rec-table .rec-card-row:not(.is-expanded) .rec-datetime-cell{
    direction:ltr;
    text-align:right;
    unicode-bidi:plaintext;
  }

  .rec-table .rec-card-row:not(.is-expanded) .rec-nationality-cell,
  .rec-table .rec-card-row:not(.is-expanded) .rec-datetime-cell{
    color:rgba(255,255,255,.72);
  }

  .table-wrap.has-mobile-card-table,
  .table-responsive.has-mobile-card-table{
    overflow:visible;
    border:0;
    background:transparent;
    box-shadow:none;
  }

  .mobile-card-table{
    display:block;
    width:100%;
    min-width:0;
    max-width:100%;
    table-layout:auto;
    border-collapse:separate;
    border-spacing:0;
    overflow:visible;
  }

  .table-scroll > table.mobile-card-table,
  .table-wrap > table.mobile-card-table,
  .table-responsive > table.mobile-card-table{
    display:block;
    width:100%;
    min-width:0;
    max-width:100%;
    table-layout:auto;
    border-collapse:separate;
    border-spacing:0;
  }

  .mobile-card-table thead{
    display:none;
  }

  .mobile-card-table tbody{
    display:grid;
    grid-template-columns:1fr;
    gap:7px;
    width:100%;
  }

  .mobile-card-table tr{
    display:grid;
    grid-template-columns:34px minmax(0,1fr);
    align-items:start;
    gap:0 8px;
    width:100%;
    padding:8px 10px;
    border:1px solid rgba(255,255,255,.10);
    border-radius:12px;
    background:rgba(255,255,255,.035);
    overflow:visible;
    cursor:pointer;
    transition:background .16s ease, border-color .16s ease;
  }

  .mobile-card-table tr::before{
    content:"\203A";
    grid-column:1;
    grid-row:1 / span 4;
    width:28px;
    height:28px;
    display:grid;
    place-items:center;
    border-radius:999px;
    background:rgba(245,190,108,.18);
    border:1px solid rgba(245,190,108,.28);
    color:#f4d093;
    font-size:13px;
    font-weight:900;
    transform:rotate(90deg);
    transition:transform .16s ease, background .16s ease;
  }

  .mobile-card-table tr.is-expanded{
    background:rgba(255,255,255,.055);
    border-color:rgba(245,190,108,.20);
  }

  .mobile-card-table tr.is-expanded::before{
    transform:rotate(0deg);
    background:rgba(245,190,108,.26);
  }

  .mobile-card-table tr.inc-expand-row:not(.is-open){
    display:none;
  }

  .emp-table tr:not(.is-expanded),
  .recruitment-table tr:not(.is-expanded),
  .profile-table tr:not(.is-expanded),
  .mobile-card-table tr:not(.is-expanded){
    grid-template-columns:32px repeat(4, minmax(0,1fr));
    align-items:center;
    gap:0 7px;
  }

  .emp-table tr:not(.is-expanded)::before,
  .recruitment-table tr:not(.is-expanded)::before,
  .profile-table tr:not(.is-expanded)::before,
  .mobile-card-table tr:not(.is-expanded)::before{
    grid-row:1;
    align-self:center;
  }

  .emp-table tr:not(.is-expanded) td,
  .recruitment-table tr:not(.is-expanded) td,
  .profile-table tr:not(.is-expanded) td,
  .mobile-card-table tr:not(.is-expanded) td{
    display:none;
  }

  .emp-table tr:not(.is-expanded) td:nth-child(-n+4),
  .recruitment-table tr:not(.is-expanded) td:nth-child(-n+4),
  .profile-table tr:not(.is-expanded) td:nth-child(-n+4),
  .mobile-card-table tr:not(.is-expanded) td:nth-child(-n+4){
    display:block;
    grid-column:auto;
    min-width:0;
    padding:0;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    font-size:11.5px;
    line-height:1.45;
    text-align:right;
  }

  .emp-table tr:not(.is-expanded) td::before,
  .recruitment-table tr:not(.is-expanded) td::before,
  .profile-table tr:not(.is-expanded) td::before,
  .mobile-card-table tr:not(.is-expanded) td::before{
    display:none;
  }

  .mobile-card-table td{
    display:grid;
    grid-column:2;
    grid-template-columns:minmax(74px, .36fr) minmax(0, 1fr);
    align-items:center;
    justify-items:start;
    gap:7px;
    width:100%;
    min-width:0;
    max-width:none;
    border:0;
    padding:2px 0;
    font-size:11.5px;
    line-height:1.55;
    white-space:normal;
    word-break:normal;
    overflow-wrap:break-word;
    overflow-wrap:anywhere;
    overflow:visible;
    text-overflow:clip;
    direction:rtl;
    text-align:right;
  }

  .mobile-card-table td[colspan]{
    display:block;
    text-align:center;
  }

  .mobile-card-table td > *{
    max-width:100%;
    min-width:0;
    justify-self:stretch;
  }

  .mobile-card-table td::before{
    content:attr(data-label);
    display:block;
    color:rgba(255,255,255,.62);
    font-size:10px;
    font-weight:800;
    line-height:1.35;
    justify-self:start;
    direction:rtl;
    text-align:right;
  }

  .mobile-card-table td:not([data-label])::before,
  .mobile-card-table td[data-label='']::before{
    display:none;
  }

  .mobile-card-table .has-action-select{
    overflow:visible;
    text-overflow:clip;
  }

  .mobile-card-table .row-action-select,
  .mobile-card-table .js-action-select{
    width:100%;
    max-width:none;
    min-width:0;
    min-height:40px;
    padding:8px 10px;
    border-radius:11px;
    background:rgba(255,255,255,.94);
    color:#151515;
    font-size:13px;
    line-height:1.35;
    text-align:center;
    text-align-last:center;
  }


  .emp-table .text-start,
  .recruitment-table .wrap,
  .profile-table .break-anywhere,
  .rec-table .wrap,
  .emp-scope-cell,
  .recruitment-scope-cell{
    max-width:none;
    white-space:normal;
    overflow:visible;
    text-overflow:clip;
    word-break:normal;
    overflow-wrap:anywhere;
  }

  .emp-table .row-action-select,
  .recruitment-table .row-action-select,
  .profile-table .row-action-select{
    width:100%;
    max-width:none;
    min-width:0;
    min-height:40px;
    padding:8px 10px;
    border-radius:11px;
    background:rgba(255,255,255,.94);
    color:#151515;
    font-size:13px;
    line-height:1.35;
    text-align:center;
    text-align-last:center;
  }

  .profile-table .profile-badge,
  .recruitment-table .recruitment-badge,
  .emp-table .badge,
  .rec-table .rec-link{
    justify-self:start;
    width:auto;
    max-width:100%;
    min-height:28px;
    padding:5px 10px;
    font-size:11.5px;
    white-space:normal;
    overflow:visible;
    text-overflow:clip;
  }

  .rec-table .rec-actions{
    display:grid;
    grid-template-columns:repeat(2, minmax(0,1fr));
    gap:8px;
    width:100%;
    justify-content:stretch;
  }

  .rec-table .rec-actions .rec-link{
    width:100%;
    justify-self:stretch;
    min-height:38px;
    border-radius:10px;
    font-size:12px;
  }

  .emp-table tr.is-expanded,
  .recruitment-table tr.is-expanded,
  .profile-table tr.is-expanded{
    grid-template-columns:34px minmax(0,1fr);
  }

  .table-wrap th,
  .table-wrap td,
  .table-responsive th,
  .table-responsive td,
  table.sys-table th,
  table.sys-table td,
  table.recruitment-table th,
  table.recruitment-table td{
    padding:7px 5px;
    font-size:11.5px;
    line-height:1.42;
  }

  .table-actions-inline a,
  .table-actions-inline button,
  .table-actions a,
  .table-actions button,
  .recruitment-actions a,
  .recruitment-actions button,
  .recruitment-link,
  .file-state,
  .badge,
  .recruitment-badge{
    padding:7px 9px;
    min-height:34px;
    font-size:11.5px;
    border-radius:9px;
  }
}

@media (max-width:420px){
  .table-wrap th,
  .table-wrap td,
  .table-responsive th,
  .table-responsive td,
  table.sys-table th,
  table.sys-table td,
  table.recruitment-table th,
  table.recruitment-table td{
    padding:7px 5px;
    font-size:11px;
  }

  .table-actions-inline a,
  .table-actions-inline button,
  .table-actions a,
  .table-actions button,
  .recruitment-actions a,
  .recruitment-actions button,
  .recruitment-link,
  .file-state,
  .badge,
  .recruitment-badge{
    padding:7px 8px;
    min-height:34px;
    font-size:11px;
  }

  .emp-table td,
  .recruitment-table td,
  .profile-table td,
  .rec-table td{
    grid-template-columns:minmax(78px, .40fr) minmax(0, 1fr);
    font-size:11.5px;
  }

  .rec-table .rec-card-row:not(.is-expanded){
    grid-template-columns:30px minmax(0,1.1fr) minmax(70px,.8fr) minmax(54px,.6fr) minmax(78px,.9fr);
    gap:0 5px;
    padding-inline:7px;
  }

  .rec-table .rec-card-row:not(.is-expanded) .rec-name-cell,
  .rec-table .rec-card-row:not(.is-expanded) .rec-identity-cell,
  .rec-table .rec-card-row:not(.is-expanded) .rec-nationality-cell,
  .rec-table .rec-card-row:not(.is-expanded) .rec-datetime-cell{
    font-size:10.5px;
  }
}

/* Source: assets/styles/components/badges.css */
.badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:24px;
  min-height:24px;
  padding:4px 10px;
  border-radius:999px;
  font-size:12px;
  font-weight:900;
  background:rgba(214,176,117,.14);
  border:1px solid rgba(214,176,117,.22);
}

.badge.soft{
  background:rgba(255,255,255,.07);
  border-color:rgba(255,255,255,.14);
}

.badge.ok{
  background:rgba(77,194,122,.12);
  border-color:rgba(77,194,122,.24);
  color:#dff7e8;
}

.badge.bad{
  background:rgba(227,107,107,.12);
  border-color:rgba(227,107,107,.24);
  color:#ffd8d8;
}

.badge.warn{
  background:rgba(216,179,95,.12);
  border-color:rgba(216,179,95,.24);
  color:#fff0c8;
}

.file-link{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:8px 12px;
  border-radius:12px;
  background:rgba(255,255,255,.08);
  border:1px solid var(--stroke);
  transition:.16s ease;
}

.file-link:hover{
  background:rgba(255,255,255,.12);
  border-color:var(--accent-line);
}

.menu-list,
.info-list{
  list-style:none;
  display:grid;
  gap:10px;
  margin-top:12px;
}

.menu-list li,
.info-list li{
  border-radius:12px;
  padding:12px 14px;
  background:rgba(255,255,255,.04);
  border:1px solid var(--stroke-2);
}

/* Source: assets/styles/components/admincp-cards.css */
.sys-home-grid,
.sys-groups-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0,1fr));
  gap:12px;
}

.sys-home-card,
.sys-group-box{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:flex-start;
  gap:8px;
  border-radius:16px;
  padding:16px;
  min-height:150px;
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.10);
  box-shadow:0 10px 22px rgba(0,0,0,.18);
  transition:.18s ease;
}

.sys-home-card:hover,
.sys-group-box:hover{
  border-color:var(--accent-line);
  background:rgba(255,255,255,.06);
  transform:translateY(-1px);
}

.sys-home-icon,
.sys-group-icon{
  width:42px;
  height:42px;
  border-radius:12px;
  display:grid;
  place-items:center;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.08);
  font-size:20px;
  line-height:1;
}

.sys-home-icon.sidebar-icon,
.sys-group-icon.sidebar-icon{
  position:relative;
  color:#f5be6c;
  font-size:0;
}

.sys-home-title,
.sys-group-title{
  font-size:17px;
  font-weight:900;
  line-height:1.6;
  word-break:break-word;
  text-align:right;
}

.sys-home-text,
.sys-group-text{
  color:var(--muted);
  font-size:13px;
  line-height:1.9;
  word-break:break-word;
  text-align:right;
}

.sys-home-note,
.sys-group-note{
  margin-top:14px;
  text-align:center;
  color:var(--muted-2);
  font-size:12px;
  line-height:1.8;
}

/* Source: assets/styles/components/admin-dashboard.css */
.admin-dashboard{
  display:grid;
  gap:14px;
  width:100%;
  max-width:100%;
  min-width:0;
}

.admin-hero{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:12px;
  align-items:center;
}

.admin-hero-actions{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  align-items:center;
  justify-content:flex-end;
  min-width:0;
}

.admin-hero-actions .sys-action-select{
  min-width:220px;
  max-width:100%;
}

.admin-governance,
.admin-metrics,
.admin-grid-two,
.admin-status-grid,
.admin-status-list,
.admin-recent-list{
  display:grid;
  gap:12px;
  width:100%;
  max-width:100%;
  min-width:0;
}

.admin-governance{
  grid-template-columns:repeat(var(--ui-dashboard-governance-columns,5),minmax(0,1fr));
}

.admin-metrics{
  grid-template-columns:repeat(var(--ui-dashboard-metric-columns,4),minmax(0,1fr));
}

.admin-grid-two{
  grid-template-columns:repeat(2,minmax(0,1fr));
}

.admin-gov-card,
.admin-metric,
.admin-status-item,
.admin-recent-item{
  display:grid;
  gap:8px;
  min-width:0;
  border:1px solid var(--stroke);
  border-radius:var(--radius-lg);
  padding:14px;
  background:var(--panel-2);
  color:var(--text);
  box-shadow:var(--shadow);
  overflow:hidden;
}

.admin-gov-card.ok,
.admin-metric.ok,
.admin-status-item.ok{
  border-color:rgba(77,194,122,.34);
  background:rgba(77,194,122,.08);
}

.admin-gov-card.warn,
.admin-metric.warn,
.admin-status-item.warn{
  border-color:rgba(216,179,95,.34);
  background:rgba(216,179,95,.08);
}

.admin-gov-card.bad,
.admin-gov-card.error,
.admin-metric.bad,
.admin-metric.error,
.admin-status-item.bad,
.admin-status-item.error{
  border-color:rgba(227,107,107,.34);
  background:rgba(227,107,107,.10);
}

.admin-gov-label,
.admin-metric-label,
.admin-status-label,
.admin-recent-label{
  color:var(--muted);
  font-size:12px;
  line-height:1.6;
  overflow-wrap:break-word;
}

.admin-gov-value,
.admin-metric-value,
.admin-status-value{
  color:var(--text);
  font-size:28px;
  font-weight:900;
  line-height:1.2;
  overflow-wrap:break-word;
}

.admin-gov-detail,
.admin-metric-detail,
.admin-status-detail,
.admin-recent-detail{
  color:var(--muted-2);
  font-size:12px;
  line-height:1.7;
  overflow-wrap:break-word;
}

.admin-status-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  min-width:0;
}

.admin-status-row > *{
  min-width:0;
}

@media (max-width:1024px){
  .admin-governance,
  .admin-metrics{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .admin-grid-two{
    grid-template-columns:1fr;
  }
}

@media (max-width:768px){
  .admin-hero{
    grid-template-columns:1fr;
    text-align:center;
  }

  .admin-hero .sys-headline,
  .admin-hero .sys-headline h2,
  .admin-hero .sys-headline p{
    text-align:center;
  }

  .admin-hero-actions{
    justify-content:center;
  }

  .admin-hero-actions .sys-action-select{
    width:100%;
    min-width:0;
  }

  .admin-gov-card,
  .admin-metric,
  .admin-status-item,
  .admin-recent-item{
    padding:12px;
  }
}

@media (max-width:430px){
  .admin-governance,
  .admin-metrics{
    grid-template-columns:1fr;
  }

  .admin-gov-value,
  .admin-metric-value,
  .admin-status-value{
    font-size:24px;
  }
}

/* Source: assets/styles/components/system-governance.css */
.system-health,
.system-map{
  display:grid;
  gap:14px;
  width:100%;
  max-width:100%;
  min-width:0;
}

.site-page-layout{
  display:grid;
  gap:14px;
}

.site-page-layout .site-list-panel{
  order:20;
}

.site-page-layout .site-add-primary-panel,
.site-page-layout .site-add-pickup-panel{
  order:30;
}

.system-health *,
.system-map *{
  min-width:0;
}

.system-health-hero,
.system-map-hero{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}

.system-health-actions,
.system-map-actions{
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  gap:8px;
  max-width:100%;
}

.system-health-metrics,
.system-map-metrics{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:10px;
}

.system-health-metric,
.system-map-metric,
.system-health-empty,
.system-health-module,
.system-map-module{
  border:1px solid var(--stroke);
  border-radius:var(--radius-lg);
  background:rgba(255,255,255,.045);
  box-shadow:var(--shadow);
}

.system-health-metric,
.system-map-metric{
  padding:14px;
}

.system-health-metric span,
.system-map-metric span{
  display:block;
  color:var(--muted);
  font-size:12px;
  line-height:1.7;
}

.system-health-metric strong,
.system-map-metric strong{
  display:block;
  margin-top:4px;
  color:var(--text);
  font-size:24px;
  font-weight:900;
  line-height:1.25;
}

.system-health-empty{
  padding:14px;
  color:var(--muted);
  line-height:1.8;
  text-align:center;
}

.system-health-list,
.system-map-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:12px;
  width:100%;
  max-width:100%;
}

.system-map-grid{
  grid-template-columns:repeat(2,minmax(0,1fr));
}

.system-health-module,
.system-map-module{
  display:grid;
  gap:12px;
  padding:14px;
}

.system-health-top,
.system-map-top{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:10px;
}

.system-health-title,
.system-map-title{
  margin:0;
  color:var(--text);
  font-size:16px;
  font-weight:900;
  line-height:1.65;
  overflow-wrap:anywhere;
}

.system-health-text,
.system-map-text,
.system-health-check-detail,
.system-map-check{
  color:var(--muted);
  font-size:13px;
  line-height:1.85;
  overflow-wrap:anywhere;
}

.system-health-meta{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
}

.system-health-box,
.system-health-check,
.system-map-section{
  border:1px solid var(--stroke-2);
  border-radius:var(--radius-md);
  background:rgba(0,0,0,.12);
  padding:11px;
}

.system-health-box-title,
.system-map-section-title{
  color:var(--muted-2);
  font-size:12px;
  font-weight:900;
  line-height:1.7;
  margin-bottom:6px;
}

.system-health-code{
  direction:ltr;
  unicode-bidi:plaintext;
  color:#f4d093;
  font-family:Consolas, Monaco, monospace;
  font-size:12px;
  line-height:1.65;
  overflow-wrap:anywhere;
}

.system-health-checks{
  display:grid;
  gap:8px;
}

.system-health-check-title{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  color:var(--text);
  font-weight:900;
  line-height:1.6;
}

.system-health-badge,
.system-map-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  max-width:100%;
  border:1px solid var(--stroke);
  border-radius:999px;
  padding:5px 10px;
  background:rgba(255,255,255,.08);
  color:var(--text);
  font-size:12px;
  line-height:1.45;
  white-space:normal;
}

.system-health-ok,
.system-map-ok{
  background:rgba(77,194,122,.14);
  border-color:rgba(77,194,122,.34);
  color:#c9f7d8;
}

.system-health-warning,
.system-map-warning{
  background:rgba(216,179,95,.14);
  border-color:rgba(216,179,95,.34);
  color:#ffe7a8;
}

.system-health-danger,
.system-map-danger{
  background:rgba(227,107,107,.14);
  border-color:rgba(227,107,107,.34);
  color:#ffd7d7;
}

.system-map-tags{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
}

.system-map-tag{
  direction:ltr;
  unicode-bidi:plaintext;
  display:inline-flex;
  max-width:100%;
  border:1px solid var(--stroke-2);
  border-radius:999px;
  padding:4px 8px;
  background:rgba(255,255,255,.07);
  color:#f4d093;
  font-family:Consolas, Monaco, monospace;
  font-size:11px;
  line-height:1.45;
  overflow-wrap:anywhere;
}

@media (max-width:860px){
  .system-health-hero,
  .system-map-hero,
  .system-health-top,
  .system-map-top{
    display:grid;
    grid-template-columns:1fr;
  }

  .system-health-actions,
  .system-map-actions{
    justify-content:stretch;
    width:100%;
  }

  .system-health-actions .sys-action-select,
  .system-map-actions .sys-btn{
    width:100%;
    max-width:100%;
    min-width:0;
  }

  .system-health-metrics,
  .system-map-metrics,
  .system-health-meta,
  .system-map-grid{
    grid-template-columns:1fr;
  }

  .system-health-module,
  .system-map-module{
    padding:12px;
  }
}

/* Source: assets/styles/components/helpers.css */
.empty-state{
  border-radius:14px;
  padding:18px 14px;
  text-align:center;
  background:rgba(255,255,255,.035);
  border:1px dashed rgba(255,255,255,.14);
  color:var(--muted);
  line-height:1.9;
}

.text-muted{
  color:var(--muted);
}

.text-soft{
  color:var(--muted-2);
}

.text-ok{
  color:var(--ok);
}

.text-warn{
  color:var(--warn);
}

.text-bad{
  color:var(--bad);
}

.text-center{
  text-align:center;
}

.text-start{
  text-align:right;
}


.form-section{
  margin-top:14px;
  padding:14px;
  border-radius:16px;
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.10);
}

.form-section:first-child{
  margin-top:0;
}

.pagination{
  display:flex;
  justify-content:center;
  gap:8px;
  flex-wrap:wrap;
  margin-top:14px;
}

.pagination a,
.pagination span{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:38px;
  min-height:38px;
  padding:8px 10px;
  border-radius:10px;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.10);
  font-size:12px;
  font-weight:800;
}

.pagination .active{
  background:rgba(214,176,117,.18);
  border-color:rgba(214,176,117,.34);
  color:#fff;
}


.site-footer{
  margin-top:auto;
  padding:12px 0 18px;
}

.site-footer .foot-wrap{
  width:94%;
  max-width:var(--page-w);
  margin:0 auto;
  text-align:center;
  border-radius:14px;
  padding:10px 12px;
  background-image:linear-gradient(180deg, var(--glass1), var(--glass2) 40%, var(--glass3));
  box-shadow:0 10px 24px rgba(0,0,0,.28);
  border:1px solid var(--stroke);
  -webkit-backdrop-filter:blur(10px);
  backdrop-filter:blur(10px);
  color:var(--muted);
  font-size:12.5px;
  line-height:1.8;
}

.impersonation-banner{
  width:94%;
  max-width:var(--page-w);
  margin:14px auto 0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:12px 14px;
  border-radius:14px;
  border:1px solid rgba(216,179,95,.36);
  background:rgba(216,179,95,.14);
  box-shadow:0 12px 26px rgba(0,0,0,.18);
}

.impersonation-banner-text{
  min-width:0;
  display:grid;
  gap:4px;
  line-height:1.8;
}

.impersonation-banner-text strong{
  color:#fff;
  font-size:14px;
}

.impersonation-banner-text span{
  color:rgba(255,255,255,.78);
  font-size:13px;
}

.impersonation-banner form{
  margin:0;
  flex:0 0 auto;
}

/* Source: assets/styles/components/data-fit.css */
html,
body{
  max-width:100%;
}

.page,
.content,
.card,
.sys-card,
.sys-main,
.module-page,
.sys-module{
  min-width:0;
}

.table-scroll,
.table-wrap,
.table-responsive{
  width:100%;
  max-width:100%;
  min-width:0;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
}

.table-scroll > table,
.table-wrap > table,
.table-responsive > table{
  width:100%;
  min-width:760px;
  table-layout:auto;
  border-collapse:collapse;
}

.table-wrap th,
.table-wrap td,
.table-responsive th,
.table-responsive td,
.table-scroll th,
.table-scroll td{
  min-width:0;
  max-width:none;
  vertical-align:middle;
  overflow-wrap:break-word;
}

.table-cell-ellipsis,
td.table-cell-ellipsis,
th.table-cell-ellipsis{
  max-width:180px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.table-wrap td.wrap,
.table-wrap th.wrap,
.table-responsive td.wrap,
.table-responsive th.wrap{
  white-space:normal;
  word-break:break-word;
  overflow-wrap:break-word;
}

.btn,
.sys-btn,
.table-actions-inline a,
.table-actions-inline button,
.table-actions a,
.table-actions button,
.recruitment-actions a,
.recruitment-actions button,
.recruitment-link,
.file-state,
.badge,
.recruitment-badge{
  max-width:100%;
  min-width:0;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  line-height:1.25;
}

.table-actions-inline,
.table-actions,
.recruitment-actions,
.actions-cell{
  min-width:0;
  max-width:100%;
  gap:4px;
}

.actions-cell,
td.has-action-select,
td.actions-cell{
  overflow:visible;
  text-overflow:clip;
}

.table-actions-inline > *,
.table-actions > *,
.recruitment-actions > *{
  min-width:0;
  flex:1 1 0;
}

/* Source: assets/styles/components/theme-switcher.css */
.app-ui-switchers{
  width:100%;
  text-align:right;
  margin-bottom:8px;
}

.app-ui-switchers-inner{
  display:inline-flex;
  align-items:center;
  justify-content:flex-end;
  gap:6px;
  max-width:100%;
  padding:5px;
  border:1px solid var(--stroke);
  border-radius:12px;
  background:rgba(255,255,255,.055);
  -webkit-backdrop-filter:blur(10px);
  backdrop-filter:blur(10px);
}

.theme-switcher{
  display:inline-grid;
  grid-template-columns:auto minmax(0,1fr);
  align-items:center;
  gap:8px;
  min-width:0;
}

.language-switcher{
  display:inline-grid;
  grid-template-columns:auto minmax(0,1fr);
  align-items:center;
  gap:8px;
  min-width:0;
}

.theme-switcher-label,
.language-switcher-label{
  color:var(--muted);
  font-size:12px;
  font-weight:900;
  line-height:1.2;
  white-space:nowrap;
}

.theme-switcher-select,
.language-switcher-select{
  width:100%;
  min-width:86px;
  min-height:32px;
  border:1px solid var(--stroke);
  border-radius:8px;
  background:#fff;
  color:#111;
  color-scheme:light;
  font-weight:900;
  line-height:1.2;
  padding:5px 24px 5px 8px;
  box-shadow:0 8px 18px rgba(0,0,0,.12);
  cursor:pointer;
  font-size:12px;
}

.theme-switcher-select{
  min-width:104px;
}

.language-switcher-select{
  min-width:82px;
}

.theme-switcher-select option,
.language-switcher-select option{
  background:#fff;
  color:#111;
  color-scheme:light;
}

.theme-switcher-button{
  min-height:34px;
  border:0;
  border-radius:10px;
  background:var(--accent);
  color:#111;
  font-weight:900;
  padding:6px 12px;
}

@media (max-width:520px){
  .app-ui-switchers-inner{
    gap:5px;
    padding:4px;
  }

  .theme-switcher{
    gap:6px;
  }

  .language-switcher{
    gap:6px;
  }

  .theme-switcher-label,
  .language-switcher-label{
    font-size:10px;
  }

  .theme-switcher-select,
  .language-switcher-select{
    min-width:0;
    min-height:30px;
    font-size:10px;
    border-radius:9px;
    padding-block:5px;
  }

  .theme-switcher-select{
    width:88px;
  }

  .language-switcher-select{
    width:72px;
  }
}

/* Source: assets/styles/components/device-admin-shell.css */
.device-admin-shell,
.device-page-v2{
  display:grid;
  gap:16px;
  width:100%;
  max-width:100%;
  min-width:0;
}

.device-admin-shell > *,
.device-page-v2 > *{
  min-width:0;
  max-width:100%;
}

.device-admin-actions,
.device-hero-actions,
.actions,
.device-action-row,
.device-command-form{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  align-items:center;
}

.device-admin-actions > *,
.device-hero-actions > *,
.actions > *,
.device-action-row > *,
.device-command-form > *{
  min-width:0;
  max-width:100%;
}

.device-admin-actions{
  margin-bottom:4px;
}

.device-page-v2 .device-hero,
.device-page-v2 .device-panel,
.device-page-v2 .device-table-card,
.device-page-v2 .device-mobile-card,
.device-admin-shell .card{
  border:1px solid var(--stroke);
  background:var(--panel-2);
  border-radius:var(--radius-xl);
  padding:14px;
  box-shadow:var(--shadow);
}

.device-page-v2 .device-hero{
  background-image:linear-gradient(180deg, var(--glass1), var(--glass2) 45%, var(--glass3));
}

.device-page-v2 .device-hero h1,
.device-page-v2 h2,
.device-admin-shell h2,
.device-admin-shell h3{
  margin:0 0 8px;
  color:var(--text);
  font-weight:900;
  line-height:1.55;
  text-align:start;
}

.device-page-v2 .device-hero h1{
  font-size:24px;
}

.device-page-v2 .device-hero p,
.device-page-v2 .muted,
.device-admin-shell .muted,
.device-name-sub,
.device-mobile-sub,
.hint,
.small-text{
  color:var(--muted);
  line-height:1.8;
  font-size:13px;
}

.device-stat-grid,
.stats{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
  gap:10px;
}

.device-grid-top,
.device-admin-shell .grid.two,
.grid.two{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
}

.device-admin-shell .grid.three,
.grid.three{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
}

.device-stat-card,
.stat{
  display:block;
  min-height:72px;
  border:1px solid var(--stroke-2);
  background:var(--panel-3);
  border-radius:var(--radius-md);
  padding:11px 12px;
  color:var(--text);
}

.device-stat-card small,
.stat span{
  display:block;
  color:var(--muted-2);
  font-size:12px;
  line-height:1.6;
  margin-bottom:7px;
}

.device-stat-card strong,
.stat strong{
  display:block;
  color:var(--text);
  font-size:20px;
  font-weight:900;
  line-height:1.25;
}

.device-stat-card .sub{
  margin-top:6px;
  color:var(--muted-2);
  font-size:12px;
  line-height:1.6;
}

.device-panel .form,
.device-admin-shell .form{
  display:grid;
  gap:12px;
}

.device-admin-shell .form .row,
.form .row{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}

.device-page-v2 input,
.device-page-v2 select,
.device-page-v2 textarea,
.device-admin-shell input,
.device-admin-shell select,
.device-admin-shell textarea{
  width:100%;
  min-width:0;
  border:1px solid rgba(255,255,255,.14);
  border-radius:var(--radius-md);
  padding:8px 10px;
  background:rgba(0,0,0,.28);
  color:var(--text);
  outline:none;
  font-size:12.5px;
}

.device-page-v2 input:focus,
.device-page-v2 select:focus,
.device-page-v2 textarea:focus,
.device-admin-shell input:focus,
.device-admin-shell select:focus,
.device-admin-shell textarea:focus{
  border-color:var(--accent-line);
  box-shadow:0 0 0 3px var(--accent-soft);
}

.device-btn,
.device-admin-shell .btn,
.device-page-v2 .btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-height:32px;
  min-width:0;
  border:1px solid var(--accent-line);
  border-radius:var(--ui-button-radius,12px);
  padding:6px 9px;
  background:var(--ui-button-primary-bg,var(--accent));
  color:#16120d;
  text-decoration:none;
  cursor:pointer;
  font-weight:900;
  font-size:11.5px;
  line-height:1.35;
  white-space:nowrap;
  transition:transform .16s ease, background .16s ease, border-color .16s ease;
}

.device-command-form{
  flex-wrap:nowrap;
}

.device-command-select{
  width:auto;
  min-width:132px;
  max-width:180px;
}

.device-btn:hover,
.device-admin-shell .btn:hover,
.device-page-v2 .btn:hover{
  transform:translateY(-1px);
}

.device-btn.blue,
.device-btn.green,
.device-admin-shell .btn.blue,
.device-admin-shell .btn.green,
.device-page-v2 .btn.blue,
.device-page-v2 .btn.green{
  background:rgba(255,255,255,.10);
  border-color:var(--stroke);
  color:var(--text);
}

.device-btn.danger,
.device-admin-shell .btn.danger,
.device-page-v2 .btn.danger{
  background:rgba(227,107,107,.16);
  border-color:rgba(227,107,107,.34);
  color:#ffd7d7;
}

.device-chip,
.pill,
.device-badge,
.badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  min-height:24px;
  max-width:100%;
  border:1px solid var(--stroke);
  border-radius:999px;
  padding:4px 8px;
  background:rgba(255,255,255,.08);
  color:var(--text);
  font-size:11.5px;
  line-height:1.4;
  white-space:normal;
}

.device-badge.ok,
.badge.ok,
.alert.ok{
  background:rgba(77,194,122,.14);
  border-color:rgba(77,194,122,.34);
  color:#c9f7d8;
}

.device-badge.off,
.badge.off{
  color:var(--muted);
  background:rgba(255,255,255,.07);
}

.device-badge.warn,
.badge.warn,
.alert.warn{
  background:rgba(216,179,95,.14);
  border-color:rgba(216,179,95,.34);
  color:#ffe7a8;
}

.device-badge.danger,
.badge.danger,
.alert.err{
  background:rgba(227,107,107,.14);
  border-color:rgba(227,107,107,.34);
  color:#ffd7d7;
}

.alert{
  border-radius:var(--radius-md);
  padding:10px 12px;
  border:1px solid var(--stroke);
}

.device-code,
.u-ltr-small{
  direction:ltr;
  unicode-bidi:plaintext;
  font-family:Consolas, Monaco, monospace;
  color:#f4d093;
  overflow-wrap:anywhere;
}

.kpis,
.device-pair-list{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:12px;
}

.table-wrap,
.device-table-wrap{
  width:100%;
  max-width:100%;
  overflow:auto;
  border:1px solid var(--stroke-2);
  border-radius:var(--radius-md);
  -webkit-overflow-scrolling:touch;
}

.device-table-v2,
.device-admin-shell table,
.device-card-table{
  width:100%;
  min-width:780px;
  border-collapse:collapse;
}

.device-admin-shell .device-card-table{
  min-width:100%;
}

.device-table-v2 th,
.device-table-v2 td,
.device-admin-shell th,
.device-admin-shell td,
.device-card-table th,
.device-card-table td{
  padding:8px;
  border-bottom:1px solid var(--stroke-2);
  color:var(--text);
  font-size:12px;
  line-height:1.55;
  text-align:start;
  vertical-align:middle;
}

.device-card-table td{
  white-space:normal;
  word-break:break-word;
  overflow-wrap:anywhere;
}

.device-table-v2 th,
.device-admin-shell th,
.device-card-table th{
  background:rgba(255,255,255,.06);
  color:#f4d093;
  font-weight:900;
  white-space:nowrap;
}

.device-name-main,
.device-mobile-title{
  display:block;
  color:var(--text);
  font-weight:900;
  line-height:1.5;
}

.device-name-sub,
.device-mobile-sub{
  display:block;
  margin-top:3px;
}

.device-action-row form,
.device-mobile-actions form{
  margin:0;
}

.device-mobile-list{
  display:none;
}

.device-mobile-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:10px;
  margin-bottom:12px;
}

.device-mobile-row{
  display:grid;
  grid-template-columns:110px minmax(0,1fr);
  gap:8px;
  padding:6px 0;
  border-top:1px solid var(--stroke-2);
  color:var(--text);
  font-size:12px;
}

.device-mobile-row span:first-child{
  color:var(--muted-2);
}

.device-mobile-actions{
  display:grid;
  grid-template-columns:minmax(82px,.7fr) minmax(0,1.6fr);
  gap:8px;
  margin-top:12px;
}

.device-mobile-actions form,
.device-mobile-actions a,
.device-mobile-actions .device-btn{
  width:100%;
}

.map{
  width:100%;
  min-height:280px;
  border:0;
  border-radius:var(--radius-md);
  background:rgba(255,255,255,.06);
}

.thumbs{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(140px,1fr));
  gap:10px;
}

.thumb{
  display:block;
  border:1px solid var(--stroke);
  border-radius:var(--radius-md);
  overflow:hidden;
  background:rgba(255,255,255,.06);
}

.thumb img{
  display:block;
  width:100%;
  aspect-ratio:4 / 3;
  object-fit:cover;
}

.card-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:12px;
}

.empty{
  text-align:center;
  color:var(--muted);
}

.u-device-rule{
  border:0;
  border-top:1px solid var(--stroke-2);
  margin:14px 0;
}

.u-device-title-tight{
  margin-top:0;
}

.u-device-inline-edit{
  display:grid;
  grid-template-columns:minmax(110px,1fr) minmax(80px,.75fr) auto;
  gap:6px;
  align-items:center;
}

.device-advanced-panel{
  border:1px solid var(--stroke-2);
  border-radius:var(--radius-md);
  padding:10px 12px;
  background:rgba(255,255,255,.035);
}

.device-advanced-panel summary{
  cursor:pointer;
  color:#f4d093;
  font-weight:900;
  margin:-2px 0 8px;
}

.device-advanced-panel:not([open]) summary{
  margin-bottom:0;
}

.device-advanced-panel[open]{
  display:grid;
  gap:10px;
}

@media(max-width:1024px){
  .device-stat-grid,
  .stats{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .device-grid-top,
  .device-admin-shell .grid.two,
  .device-admin-shell .grid.three,
  .grid.two,
  .grid.three,
  .device-admin-shell .form .row,
  .form .row{
    grid-template-columns:1fr;
  }

  .u-device-inline-edit{
    grid-template-columns:1fr;
  }
}

@media(max-width:1024px){
  .device-page-v2 .device-hero,
  .device-page-v2 .device-panel,
  .device-page-v2 .device-table-card,
  .device-page-v2 .device-mobile-card,
  .device-admin-shell .card{
    padding:13px;
    border-radius:var(--radius-lg);
  }

  .device-table-wrap{
    display:none;
  }

  .device-card-table-wrap{
    overflow:visible;
    border:0;
    background:transparent;
  }

  .device-card-table{
    display:block;
    width:100%;
    min-width:0;
    max-width:100%;
    table-layout:auto;
    border-collapse:separate;
    border-spacing:0;
    overflow:visible;
  }

  .device-admin-shell .device-card-table{
    display:block;
    width:100%;
    min-width:0;
    max-width:100%;
    table-layout:auto;
    border-collapse:separate;
    border-spacing:0;
  }

  .device-card-table thead{
    display:none;
  }

  .device-card-table tbody{
    display:grid;
    grid-template-columns:1fr;
    gap:8px;
    width:100%;
  }

  .device-card-table tr{
    display:grid;
    grid-template-columns:34px minmax(0,1fr);
    align-items:start;
    gap:0 8px;
    width:100%;
    padding:8px 10px;
    border:1px solid rgba(255,255,255,.10);
    border-radius:12px;
    background:rgba(255,255,255,.035);
    overflow:visible;
    cursor:pointer;
    transition:background .16s ease, border-color .16s ease;
  }

  .device-card-table tr::before{
    content:"\203A";
    grid-column:1;
    grid-row:1 / span 4;
    width:28px;
    height:28px;
    display:grid;
    place-items:center;
    border-radius:999px;
    background:rgba(245,190,108,.18);
    border:1px solid rgba(245,190,108,.28);
    color:#f4d093;
    font-size:13px;
    font-weight:900;
    transform:rotate(90deg);
    transition:transform .16s ease, background .16s ease;
  }

  .device-card-table tr.is-expanded{
    background:rgba(255,255,255,.055);
    border-color:rgba(245,190,108,.20);
  }

  .device-card-table tr.is-expanded::before{
    transform:rotate(0deg);
    background:rgba(245,190,108,.26);
  }

  .device-card-table td{
    display:grid;
    grid-column:2;
    grid-template-columns:minmax(78px,.36fr) minmax(0,1fr);
    align-items:center;
    justify-items:start;
    gap:7px;
    width:100%;
    min-width:0;
    max-width:none;
    border:0;
    padding:2px 0;
    font-size:11.5px;
    line-height:1.55;
    white-space:normal;
    word-break:normal;
    overflow-wrap:anywhere;
    overflow:visible;
    text-overflow:clip;
    direction:rtl;
    text-align:right;
  }

  .device-card-table td::before{
    content:attr(data-label);
    display:block;
    color:rgba(255,255,255,.62);
    font-size:10px;
    font-weight:800;
    line-height:1.35;
    justify-self:start;
    direction:rtl;
    text-align:right;
  }

  .device-card-table td:not([data-label])::before,
  .device-card-table td[data-label='']::before{
    display:none;
  }

  .device-card-table td[colspan]{
    display:block;
    grid-column:1 / -1;
    text-align:center;
  }

  .device-card-table tr:not(.is-expanded){
    grid-template-columns:32px minmax(0,1fr) minmax(60px,.55fr) minmax(78px,.7fr);
    align-items:center;
  }

  .device-card-table tr:not(.is-expanded)::before{
    grid-row:1;
    align-self:center;
  }

  .device-card-table tr:not(.is-expanded) td{
    display:none;
  }

  .device-card-table tr:not(.is-expanded) td:nth-child(1),
  .device-card-table tr:not(.is-expanded) td:nth-child(2),
  .device-card-table tr:not(.is-expanded) td:nth-child(3){
    display:block;
    grid-column:auto;
    min-width:0;
    padding:0;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    font-size:11.5px;
    line-height:1.45;
  }

  .device-card-table tr:not(.is-expanded) td:nth-child(1)::before,
  .device-card-table tr:not(.is-expanded) td:nth-child(2)::before,
  .device-card-table tr:not(.is-expanded) td:nth-child(3)::before{
    display:none;
  }

  .device-card-table tr:not(.is-expanded) td:nth-child(1){
    font-weight:900;
  }

  .device-mobile-list{
    display:block;
  }
}

@media(max-width:430px){
  .device-stat-grid,
  .stats{
    grid-template-columns:1fr;
  }

  .device-mobile-row{
    grid-template-columns:92px minmax(0,1fr);
  }

  .device-command-form{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    width:100%;
  }

  .device-command-select{
    min-width:0;
    max-width:none;
    width:100%;
  }

  .device-btn,
  .device-admin-shell .btn,
  .device-page-v2 .btn{
    white-space:normal;
    text-align:center;
  }
}

/* Source: assets/styles/components/face-workflows.css */
.face-attendance-page{
  display:flex;
  flex-direction:column;
  gap:14px;
  max-width:1100px;
  margin-inline:auto;
}

.face-attendance-shell{
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(280px,.85fr);
  gap:14px;
  align-items:stretch;
}

.face-enroll-shell{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(280px,420px);
  gap:14px;
  align-items:stretch;
}

.face-attendance-camera{
  position:relative;
  min-height:420px;
  aspect-ratio:4 / 3;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.12);
  border-radius:8px;
  background:#f8fafc url("../../images/face-camera-placeholder.png") center / min(54%, 320px) auto no-repeat;
}

.face-attendance-camera video,
.face-attendance-camera canvas{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
}

.face-attendance-camera video{
  transform:none;
  transform-origin:center center;
  opacity:0;
  transition:opacity .18s ease;
}

.face-attendance-camera.is-camera-active video{
  opacity:1;
}

.face-guide-camera{
  isolation:isolate;
}

.face-guide-frame{
  position:absolute;
  z-index:3;
  inset:13.5% 25.5% 15.5%;
  border:3px solid rgba(255,255,255,.82);
  border-radius:50% / 44%;
  box-shadow:0 0 0 999px rgba(0,0,0,.16), 0 0 28px rgba(255,255,255,.16);
  pointer-events:none;
  transition:border-color .18s ease, box-shadow .18s ease;
}

.face-guide-frame.is-ok{
  border-color:#35d07f;
  box-shadow:0 0 0 999px rgba(0,0,0,.12), 0 0 30px rgba(53,208,127,.34);
}

.face-guide-frame.is-warn{
  border-color:#f5b942;
  box-shadow:0 0 0 999px rgba(0,0,0,.18), 0 0 30px rgba(245,185,66,.28);
}

.face-guide-label{
  position:absolute;
  z-index:31;
  inset-block-start:18px;
  inset-inline:32px;
  margin-inline:auto;
  width:calc(100% - 64px);
  max-width:900px;
  box-sizing:border-box;
  min-height:40px;
  border:2px solid rgba(255,255,255,.30);
  border-radius:16px;
  background:rgba(2,6,23,.94);
  box-shadow:0 12px 32px rgba(0,0,0,.38);
  color:#fff;
  padding:14px 20px;
  font-size:28px;
  font-weight:800;
  line-height:1.32;
  text-align:center;
  pointer-events:none;
}

.face-guide-arrow{
  position:absolute;
  z-index:4;
  top:50%;
  width:52px;
  height:52px;
  opacity:0;
  pointer-events:none;
  transition:opacity .18s ease, transform .18s ease;
}

.face-guide-arrow::before{
  content:"";
  position:absolute;
  top:12px;
  left:9px;
  width:24px;
  height:24px;
  border:solid #fff;
  border-width:0 8px 8px 0;
  transform:rotate(-45deg);
  filter:drop-shadow(0 2px 8px rgba(0,0,0,.42));
}

.face-guide-arrow.is-visible{
  opacity:1;
}

.face-guide-arrow.look-right{
  right:9%;
  transform:translateY(-50%);
}

.face-guide-arrow.look-left{
  left:9%;
  transform:translateY(-50%);
}

.face-guide-arrow.look-left::before{
  transform:rotate(135deg);
}

.face-hidden-canvas{
  display:none;
}

.face-attendance-camera-hint{
  display:none;
}

.face-attendance-panel{
  display:flex;
  flex-direction:column;
  gap:12px;
}

.face-attendance-scope,
.face-attendance-clock,
.face-attendance-result{
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.045);
  border-radius:8px;
  padding:14px;
}

.face-attendance-scope{
  display:grid;
  gap:6px;
}

.face-attendance-scope strong,
.face-attendance-result strong,
.face-attendance-clock strong{
  font-size:24px;
  line-height:1.3;
}

.face-attendance-scope span,
.face-attendance-result span,
.face-attendance-result small,
.face-attendance-clock span{
  color:var(--muted);
  line-height:1.7;
}

.face-attendance-result{
  display:grid;
  gap:6px;
}

.face-attendance-actions{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
}

.native-face-launcher{
  display:grid;
  gap:14px;
}

.native-face-summary{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
}

.native-face-summary > div,
.native-face-controls{
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.045);
  border-radius:8px;
  padding:14px;
}

.native-face-summary span,
.native-face-controls span{
  display:block;
  color:var(--muted);
  line-height:1.6;
}

.native-face-summary strong{
  display:block;
  font-size:20px;
  line-height:1.4;
}

.native-face-controls{
  display:grid;
  gap:12px;
}

.native-face-controls label{
  display:grid;
  gap:6px;
}

.native-face-controls select{
  width:100%;
}

.native-face-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}

.native-face-actions .sys-btn{
  min-width:220px;
}

.face-enroll-save-ready:not(:disabled){
  background:#22c55e;
  border-color:#86efac;
  color:#052e16;
  box-shadow:0 0 0 3px rgba(34,197,94,.22), 0 12px 28px rgba(34,197,94,.22);
}

.face-enroll-retry-ready:not(:disabled){
  background:rgba(255,255,255,.10);
  border-color:rgba(255,255,255,.28);
  color:#fff;
}

.face-enroll-page #faceEnrollStatus{
  display:none;
}

.face-enroll-page:not(.face-enroll-captured) .face-attendance-actions{
  grid-template-columns:1fr;
}

#faceCheckInBtn{
  background:#16a34a;
  border-color:rgba(134,239,172,.38);
  color:#fff;
}

#faceCheckOutBtn{
  background:#dc2626;
  border-color:rgba(252,165,165,.42);
  color:#fff;
}

.face-attendance-page.is-face-recognized .face-attendance-result{
  border-color:rgba(34,197,94,.38);
  background:rgba(34,197,94,.08);
}

.face-verify-details{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
}

.face-verify-details span{
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.045);
  border-radius:8px;
  padding:10px;
}

.face-verify-details small,
.face-verify-details strong{
  display:block;
  line-height:1.6;
}

.face-verify-details small{
  color:var(--muted);
}

@media (max-width:900px){
  .face-attendance-shell{
    grid-template-columns:1fr;
  }

  .face-enroll-shell{
    grid-template-columns:1fr;
  }

  .native-face-summary{
    grid-template-columns:1fr;
  }

  .face-attendance-camera{
    min-height:300px;
  }
}

@media (max-width:520px){
  .face-attendance-camera{
    min-height:240px;
  }

  .face-guide-label{
    inset-block-start:10px;
    inset-inline:10px;
    width:calc(100% - 20px);
    max-width:calc(100% - 20px);
    padding:8px 10px;
    font-size:16px;
    line-height:1.4;
  }

  .face-attendance-actions{
    grid-template-columns:1fr;
  }

  .native-face-actions .sys-btn{
    width:100%;
    min-width:0;
  }

  .face-verify-details{
    grid-template-columns:1fr;
  }
}

/* Source: assets/styles/components/platform-tokens.css */
.logo{
  width:100%;
  max-width:var(--ui-logo-width,250px);
  width:var(--ui-logo-width,min(250px,100%));
  height:var(--ui-logo-height,96px);
}

.btn,
.sys-btn,
button.btn,
button.sys-btn,
a.btn,
a.sys-btn{
  border-radius:var(--ui-button-radius,12px);
  min-height:var(--ui-button-min-height,42px);
}

.btn-primary,
.btn,
.sys-btn{
  background:var(--ui-button-primary-bg,var(--accent));
  border-color:var(--accent-line);
}

.sys-sidebar-badge,
.item-badge{
  display:var(--ui-navigation-badge-display,inline-flex);
}

.admin-metrics{
  grid-template-columns:repeat(var(--ui-dashboard-metric-columns,4),minmax(0,1fr));
}

.admin-governance{
  grid-template-columns:repeat(var(--ui-dashboard-governance-columns,5),minmax(0,1fr));
}

/* Source: assets/styles/components/unified-header.css */
.uh-panel{
    border-radius:18px;
    padding:10px;
    background:rgba(20,12,12,.62);
    border:1px solid rgba(255,255,255,.10);
    box-shadow:0 12px 30px rgba(0,0,0,.22);
  }

  .uh-line1,
  .uh-line2{
    display:grid;
    align-items:stretch;
    background:rgba(255,255,255,.03);
    overflow:hidden;
  }

  .uh-line1{
    grid-template-columns:minmax(0,1.45fr) 1px minmax(0,1fr) 1px minmax(0,.95fr);
    border-radius:14px 14px 0 0;
  }

  .uh-line2{
    grid-template-columns:minmax(0,1fr) 1px minmax(0,1fr);
    border-top:1px solid rgba(255,255,255,.10);
    border-radius:0 0 14px 14px;
  }

  .uh-sep{
    width:1px;
    height:100%;
    background:rgba(255,255,255,.12);
  }

  .uh-cell{
    min-width:0;
    text-align:center;
    padding:8px 6px;
    display:flex;
    flex-direction:column;
    justify-content:center;
  }

  .uh-label{
    color:rgba(255,255,255,.78);
    font-size:12px;
    margin-bottom:3px;
    line-height:1.25;
  }

  .uh-label-divider{
    opacity:.62;
    padding-inline:4px;
  }

  .uh-value{
    color:#fff;
    font-weight:900;
    line-height:1.35;
    font-size:15px;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }

  .uh-role-scope-cell{
    flex-direction:row;
    align-items:center;
    justify-content:center;
    gap:0;
  }

  .uh-role-scope-cell .uh-label{
    flex:0 0 auto;
    margin-bottom:0;
    white-space:nowrap;
  }

  .uh-role-scope-value{
    min-width:0;
    width:100%;
    max-width:100%;
    flex:0 1 auto;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:2px;
    color:#fff;
    font-weight:900;
    line-height:1.25;
  }

  .uh-role-line,
  .uh-scope-line{
    display:block;
    min-width:0;
    box-sizing:border-box;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    font-size:13px;
  }

  .uh-role-line{
    flex:0 1 auto;
    max-width:46%;
  }

  .uh-scope-line{
    flex:0 1 auto;
    max-width:54%;
    color:rgba(255,255,255,.76);
    border-inline-start:1px solid rgba(255,255,255,.22);
    padding-inline-start:4px;
  }

  .uh-user-name{
    font-size:15px;
  }

  .uh-user-name.is-long{
    font-size:13px;
  }

  .uh-user-name.is-very-long{
    font-size:12px;
  }

  .uh-role-title{
    font-size:15px;
  }

  .uh-role-title.is-long{
    font-size:13px;
  }

  .uh-role-title.is-very-long{
    font-size:12px;
  }

  .uh-scope-text.is-long{
    font-size:11px;
  }

  .uh-scope-text.is-very-long{
    font-size:10px;
  }

  .uh-role-scope-value .uh-role-line,
  .uh-role-scope-value .uh-role-line.uh-role-title,
  .uh-role-scope-value .uh-scope-line,
  .uh-role-scope-value .uh-scope-line.uh-scope-text{
    font-size:13px;
  }

  .uh-role-scope-value .uh-role-line.is-long,
  .uh-role-scope-value .uh-scope-line.is-long{
    font-size:12px;
  }

  .uh-role-scope-value .uh-role-line.is-very-long,
  .uh-role-scope-value .uh-scope-line.is-very-long{
    font-size:11px;
  }

  .uh-time-value,
  .uh-date-value{
    font-size:15px;
    font-weight:900;
    letter-spacing:0;
  }

  .uh-line2 .uh-cell{
    flex-direction:row;
    align-items:center;
    justify-content:center;
    gap:6px;
    padding:6px 8px;
  }

  .uh-line2 .uh-label{
    margin-bottom:0;
    white-space:nowrap;
    flex:0 0 auto;
  }

  .uh-line2 .uh-value{
    flex:0 0 auto;
    overflow:visible;
    text-overflow:clip;
  }

  .uh-actions{
    display:grid;
    grid-template-columns:repeat(4, minmax(0,1fr));
    gap:6px;
    margin-top:8px;
  }

  .uh-btn{
    border:0;
    border-radius:10px;
    padding:9px 6px;
    font-weight:900;
    text-align:center;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:0;
    min-height:42px;
    font-size:12px;
    line-height:1.2;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    text-decoration:none;
    cursor:pointer;
  }

  .uh-btn-secondary{
    background:rgba(255,255,255,.88);
    color:#111;
  }

  .uh-btn-danger{
    background:#ffb3b3;
    color:#111;
  }

  @media (max-width:768px){
    .uh-panel{
      padding:8px;
    }

    .uh-line1{
      grid-template-columns:minmax(0,1.36fr) 1px minmax(0,.96fr) 1px minmax(0,.90fr);
    }

    .uh-cell{
      padding:7px 4px;
    }

    .uh-label{
      font-size:10px;
      margin-bottom:2px;
    }

    .uh-value,
    .uh-user-name,
    .uh-user-name.is-long,
    .uh-user-name.is-very-long,
    .uh-role-title,
    .uh-role-title.is-long,
    .uh-role-title.is-very-long,
    .uh-time-value,
    .uh-date-value{
      font-size:11px;
    }

    .uh-scope-line,
    .uh-scope-text.is-long,
    .uh-scope-text.is-very-long{
      font-size:11px;
    }

    .uh-role-scope-value .uh-role-line,
    .uh-role-scope-value .uh-role-line.uh-role-title,
    .uh-role-scope-value .uh-scope-line,
    .uh-role-scope-value .uh-scope-line.uh-scope-text,
    .uh-role-scope-value .uh-role-line.is-long,
    .uh-role-scope-value .uh-role-line.is-very-long,
    .uh-role-scope-value .uh-scope-line.is-long,
    .uh-role-scope-value .uh-scope-line.is-very-long{
      font-size:11px;
    }

    .uh-line2 .uh-cell{
      gap:5px;
      padding:5px 6px;
    }

    .uh-actions{
      grid-template-columns:repeat(4, minmax(0,1fr));
      gap:5px;
      margin-top:7px;
    }

    .uh-btn{
      min-height:38px;
      padding:8px 3px;
      font-size:10px;
      border-radius:9px;
    }
  }

  @media (max-width:520px){
    .uh-line1{
      grid-template-columns:minmax(0,1fr) minmax(0,.78fr);
    }

    .uh-line1 .uh-sep{
      display:none;
    }

    .uh-user-cell{
      grid-column:1;
      grid-row:1;
    }

    .uh-emp-cell{
      grid-column:2;
      grid-row:1;
    }

    .uh-role-scope-cell{
      grid-column:1 / -1;
      grid-row:2;
      padding:7px 5px;
      border-top:1px solid rgba(255,255,255,.10);
    }

    .uh-line2 .uh-sep{
      display:none;
    }

    .uh-role-scope-cell{
      gap:1px;
    }

    .uh-role-scope-value{
      flex-direction:column;
      gap:1px;
    }

    .uh-role-line,
    .uh-scope-line{
      width:100%;
      max-width:100%;
      white-space:normal;
      overflow:visible;
      text-overflow:clip;
      line-height:1.35;
    }

    .uh-scope-line{
      border-inline-start:0;
      padding-inline-start:0;
    }
  }

  @media (max-width:420px){
    .uh-cell{
      padding:6px 3px;
    }

    .uh-label{
      font-size:9px;
    }

    .uh-value,
    .uh-user-name,
    .uh-user-name.is-long,
    .uh-user-name.is-very-long,
    .uh-role-title,
    .uh-role-title.is-long,
    .uh-role-title.is-very-long,
    .uh-time-value,
    .uh-date-value{
      font-size:10px;
    }

    .uh-scope-line,
    .uh-scope-text.is-long,
    .uh-scope-text.is-very-long{
      font-size:9px;
    }

    .uh-role-scope-value .uh-role-line,
    .uh-role-scope-value .uh-role-line.uh-role-title,
    .uh-role-scope-value .uh-scope-line,
    .uh-role-scope-value .uh-scope-line.uh-scope-text,
    .uh-role-scope-value .uh-role-line.is-long,
    .uh-role-scope-value .uh-role-line.is-very-long,
    .uh-role-scope-value .uh-scope-line.is-long,
    .uh-role-scope-value .uh-scope-line.is-very-long{
      font-size:9px;
    }

    .uh-line2 .uh-cell{
      gap:4px;
      padding:5px 4px;
    }

    .uh-actions{
      grid-template-columns:repeat(4, minmax(0,1fr));
      gap:4px;
    }

    .uh-btn{
      min-height:31px;
      padding:6px 1px;
      font-size:8px;
      border-radius:8px;
    }
  }

/* Source: assets/styles/components/sidebar.css */
:root{
  --sb-main-width: 122px;
  --sb-sub-width: 340px;
  --sb-sub-width: min(92vw, 340px);
  --sb-top-offset: 160px;
  --sb-panel-max-height: calc(100vh - var(--sb-top-offset) - 16px);
  --sb-right-gap: 12px;
  --sb-gap: 8px;
  --sb-z: 9999;
  --sb-glass: rgba(18,10,10,.94);
  --sb-glass-2: rgba(255,255,255,.07);
  --sb-line: rgba(255,255,255,.11);
  --sb-gold: rgba(245,190,108,.20);
  --sb-gold-line: rgba(245,190,108,.38);
  --sb-shadow: 0 20px 45px rgba(0,0,0,.40);
  --sb-radius: 18px;
}

.admincp-page{
  position:relative;
}

.sys-sidebar-backdrop{
  position:fixed;
  inset:0;
  z-index:calc(var(--sb-z) - 1);
  background:rgba(0,0,0,.18);
  opacity:0;
  visibility:hidden;
  transition:opacity .18s ease, visibility .18s ease;
  isolation:isolate;
}

.sys-sidebar-backdrop.is-open{
  opacity:1;
  visibility:visible;
}

.sys-sidebars-float{
  position:fixed;
  top:calc(var(--sb-top-offset) - 6px);
  bottom:12px;
  right:var(--sb-right-gap);
  z-index:var(--sb-z);
  display:flex;
  flex-direction:row;
  align-items:flex-start;
  gap:var(--sb-gap);
  pointer-events:none;
  isolation:isolate;
  max-width:calc(100vw - (var(--sb-right-gap) * 2));
  overflow:visible;
}

.sys-sidebar-main-float,
.sys-sidebar-sub-float{
  pointer-events:auto;
  box-sizing:border-box;
  min-width:0;
  border-radius:var(--sb-radius);
  border:1px solid var(--sb-line);
  background:var(--sb-glass);
  box-shadow:var(--sb-shadow);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  overflow-x:hidden;
  overflow-y:hidden;
}

.sys-sidebar-main-float{
  width:var(--sb-main-width);
  padding:10px 8px;
  transform:translateY(-8px) scale(.96);
  opacity:0;
  visibility:hidden;
  transition:transform .18s ease, opacity .18s ease, visibility .18s ease;
  overflow-x:hidden;
  overflow-y:auto;
  max-height:var(--sb-panel-max-height);
}

.sys-sidebar-main-float.is-open{
  transform:translateY(0) scale(1);
  opacity:1;
  visibility:visible;
}

.sys-sidebar-sub-float{
  width:var(--sb-sub-width);
  padding:10px 8px;
  transform:translateX(14px) scale(.98);
  opacity:0;
  visibility:hidden;
  transition:transform .20s ease, opacity .20s ease, visibility .20s ease;
  overflow-x:hidden;
  overflow-y:auto;
  max-height:var(--sb-panel-max-height);
}

.sys-sidebar-sub-float.is-open{
  transform:translateX(0) scale(1);
  opacity:1;
  visibility:visible;
}

.sys-sidebar-main-list,
.sys-sidebar-sub-list{
  list-style:none;
  display:flex;
  flex-direction:column;
  gap:8px;
  margin:0;
  padding:0;
  min-width:0;
  max-width:100%;
  overflow-x:hidden;
}

.sys-sidebar-main-item{
  position:relative;
  min-width:0;
  max-width:100%;
}

.sys-sidebar-main-btn{
  width:100%;
  min-height:76px;
  border:1px solid var(--sb-line);
  background:var(--sb-glass-2);
  color:#fff;
  border-radius:16px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:6px;
  cursor:pointer;
  transition:.18s ease;
  position:relative;
  padding:8px 6px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
}

.sys-sidebar-main-btn:hover,
.sys-sidebar-main-btn.is-active{
  background:var(--sb-gold);
  border-color:var(--sb-gold-line);
  transform:translateY(-1px);
}

.sys-sidebar-main-btn .icon{
  width:28px;
  height:28px;
  display:grid;
  place-items:center;
  flex:0 0 auto;
}

.sidebar-icon{
  position:relative;
  color:#f5be6c;
  font-size:0;
  line-height:1;
}

.sidebar-icon::before,
.sidebar-icon::after,
.sys-sidebar-main-btn .icon::before,
.sys-sidebar-main-btn .icon::after,
.sys-sidebar-sub-head .icon::before,
.sys-sidebar-sub-head .icon::after{
  content:"";
  position:absolute;
  display:block;
  box-sizing:border-box;
}

.sidebar-icon--dashboard::before{
  width:17px;
  height:13px;
  border:2px solid currentColor;
  border-top:0;
  border-radius:3px;
  left:50%;
  bottom:5px;
  transform:translateX(-50%);
}

.sidebar-icon--dashboard::after{
  width:13px;
  height:13px;
  border-top:2px solid currentColor;
  border-left:2px solid currentColor;
  left:50%;
  top:5px;
  transform:translateX(-50%) rotate(45deg);
}

.sidebar-icon--field_entry::before,
.sidebar-icon--records::before,
.sidebar-icon--recruitment::before,
.sidebar-icon--incidents::before{
  width:17px;
  height:21px;
  border:2px solid currentColor;
  border-radius:4px;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
}

.sidebar-icon--field_entry::after,
.sidebar-icon--records::after,
.sidebar-icon--recruitment::after,
.sidebar-icon--incidents::after{
  width:9px;
  height:2px;
  background:currentColor;
  left:50%;
  top:42%;
  transform:translateX(-50%);
  box-shadow:0 6px 0 currentColor;
}

.sidebar-icon--account::before,
.sidebar-icon--account_operations::before,
.sidebar-icon--users::before,
.sidebar-icon--employees::before,
.sidebar-icon--supervisors::before{
  width:10px;
  height:10px;
  border:2px solid currentColor;
  border-radius:50%;
  left:50%;
  top:5px;
  transform:translateX(-50%);
}

.sidebar-icon--account::after,
.sidebar-icon--account_operations::after,
.sidebar-icon--users::after,
.sidebar-icon--employees::after,
.sidebar-icon--supervisors::after{
  width:18px;
  height:9px;
  border:2px solid currentColor;
  border-bottom:0;
  border-radius:12px 12px 0 0;
  left:50%;
  bottom:5px;
  transform:translateX(-50%);
}

.sidebar-icon--system::before,
.sidebar-icon--system_management::before{
  width:19px;
  height:19px;
  border:2px dashed currentColor;
  border-radius:50%;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
}

.sidebar-icon--system::after,
.sidebar-icon--system_management::after{
  width:7px;
  height:7px;
  border:2px solid currentColor;
  border-radius:50%;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
}

.sidebar-icon--permissions::before,
.sidebar-icon--permissions_settings::before{
  width:18px;
  height:14px;
  border:2px solid currentColor;
  border-radius:4px;
  left:50%;
  bottom:5px;
  transform:translateX(-50%);
}

.sidebar-icon--permissions::after,
.sidebar-icon--permissions_settings::after{
  width:12px;
  height:10px;
  border:2px solid currentColor;
  border-bottom:0;
  border-radius:10px 10px 0 0;
  left:50%;
  top:4px;
  transform:translateX(-50%);
}

.sidebar-icon--attendance::before{
  width:21px;
  height:21px;
  border:2px solid currentColor;
  border-radius:50%;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
}

.sidebar-icon--attendance::after{
  width:8px;
  height:8px;
  border-left:2px solid currentColor;
  border-bottom:2px solid currentColor;
  left:50%;
  top:50%;
  transform:translate(-1px,-7px);
}

.sidebar-icon--spatial_structure::before{
  width:21px;
  height:17px;
  border:2px solid currentColor;
  border-radius:4px;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%) skewY(-7deg);
}

.sidebar-icon--spatial_structure::after{
  width:8px;
  height:8px;
  border:2px solid currentColor;
  border-radius:50% 50% 50% 0;
  left:50%;
  top:6px;
  transform:translateX(-50%) rotate(-45deg);
}

.sidebar-icon--organization_structure::before{
  width:7px;
  height:7px;
  border:2px solid currentColor;
  border-radius:50%;
  left:50%;
  top:4px;
  transform:translateX(-50%);
  box-shadow:-8px 14px 0 -2px currentColor,8px 14px 0 -2px currentColor;
}

.sidebar-icon--organization_structure::after{
  width:18px;
  height:12px;
  border-left:2px solid currentColor;
  border-right:2px solid currentColor;
  border-top:2px solid currentColor;
  left:50%;
  top:11px;
  transform:translateX(-50%);
}

.sidebar-icon--shifts::before{
  width:21px;
  height:21px;
  border:2px solid currentColor;
  border-radius:50%;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
}

.sidebar-icon--shifts::after{
  width:8px;
  height:8px;
  border-left:2px solid currentColor;
  border-bottom:2px solid currentColor;
  left:50%;
  top:50%;
  transform:translate(-1px,-7px);
}

.sidebar-icon--devices::before{
  width:16px;
  height:22px;
  border:2px solid currentColor;
  border-radius:5px;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
}

.sidebar-icon--devices::after{
  width:4px;
  height:4px;
  background:currentColor;
  border-radius:50%;
  left:50%;
  bottom:5px;
  transform:translateX(-50%);
}

.sidebar-icon--reports::before{
  width:18px;
  height:16px;
  border-left:2px solid currentColor;
  border-bottom:2px solid currentColor;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
}

.sidebar-icon--reports::after{
  width:3px;
  height:7px;
  background:currentColor;
  left:9px;
  bottom:7px;
  box-shadow:6px -4px 0 currentColor,12px -8px 0 currentColor;
}

.sidebar-icon--settings::before{
  width:20px;
  height:20px;
  border:2px dashed currentColor;
  border-radius:50%;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
}

.sidebar-icon--settings::after{
  width:7px;
  height:7px;
  border:2px solid currentColor;
  border-radius:50%;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
}

.sidebar-icon--logs::before{
  width:17px;
  height:21px;
  border:2px solid currentColor;
  border-radius:4px;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
}

.sidebar-icon--logs::after{
  width:9px;
  height:2px;
  background:currentColor;
  left:50%;
  top:42%;
  transform:translateX(-50%);
  box-shadow:0 6px 0 currentColor;
}

.sidebar-icon--maintenance::before{
  width:19px;
  height:4px;
  border:2px solid currentColor;
  border-radius:999px;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%) rotate(-35deg);
}

.sidebar-icon--maintenance::after{
  width:8px;
  height:8px;
  border:2px solid currentColor;
  border-left:0;
  border-bottom:0;
  left:16px;
  top:7px;
  transform:rotate(-35deg);
}

.sidebar-icon--default::before{
  width:18px;
  height:18px;
  border:2px solid currentColor;
  border-radius:6px;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
}

.sys-sidebar-main-btn .label{
  display:block;
  width:100%;
  font-size:11px;
  font-weight:900;
  line-height:1.25;
  color:#fff;
  text-align:center;
  white-space:normal;
  overflow:visible;
  text-overflow:clip;
  word-break:break-word;
  overflow-wrap:anywhere;
  min-height:28px;
}

.sys-sidebar-main-btn .tip{
  position:absolute;
  right:100%;
  margin-right:10px;
  top:50%;
  transform:translateY(-50%);
  background:rgba(0,0,0,.78);
  border:1px solid rgba(255,255,255,.10);
  color:#fff;
  padding:7px 10px;
  border-radius:12px;
  font-size:12px;
  line-height:1.3;
  white-space:nowrap;
  opacity:0;
  visibility:hidden;
  transition:.15s ease;
  pointer-events:none;
}

.sys-sidebar-main-btn:hover .tip{
  opacity:1;
  visibility:visible;
}

.sys-sidebar-badge{
  position:absolute;
  top:-5px;
  left:-5px;
  min-width:20px;
  height:20px;
  padding:0 5px;
  border-radius:999px;
  display:var(--ui-navigation-badge-display, inline-flex);
  align-items:center;
  justify-content:center;
  background:rgba(193,26,23,.95);
  color:#fff;
  font-size:10px;
  font-weight:900;
  line-height:1;
  box-shadow:0 0 0 2px rgba(255,255,255,.08) inset;
}

.sys-sidebar-badge.is-zero{
  display:none;
}

.sys-sidebar-sub-head{
  border-radius:14px;
  padding:12px;
  background:var(--sb-glass-2);
  border:1px solid var(--sb-line);
  margin-bottom:8px;
  display:flex;
  align-items:center;
  gap:10px;
}

.sys-sidebar-sub-head .icon{
  width:34px;
  height:34px;
  border-radius:10px;
  display:grid;
  place-items:center;
  background:rgba(255,255,255,.07);
  position:relative;
  color:#f5be6c;
  font-size:0;
  flex:0 0 auto;
}

.sys-sidebar-sub-head .title{
  min-width:0;
  font-size:15px;
  font-weight:900;
  line-height:1.5;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.sys-sidebar-sub-link{
  width:100%;
  max-width:100%;
  min-width:0;
  box-sizing:border-box;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:12px 13px;
  border-radius:14px;
  border:1px solid var(--sb-line);
  background:var(--sb-glass-2);
  color:#fff;
  text-decoration:none;
  transition:.18s ease;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.03);
}

.sys-sidebar-sub-link:hover,
.sys-sidebar-sub-link.is-active{
  background:var(--sb-gold);
  border-color:var(--sb-gold-line);
  transform:translateX(-1px);
}

.sys-sidebar-sub-link .txt{
  min-width:0;
  flex:1;
  font-size:14px;
  font-weight:800;
  line-height:1.5;
  white-space:normal;
  overflow:visible;
  text-overflow:clip;
  word-break:break-word;
  overflow-wrap:anywhere;
}

.sys-sidebar-sub-link .item-badge{
  min-width:19px;
  height:19px;
  padding:0 5px;
  border-radius:999px;
  display:var(--ui-navigation-badge-display, inline-flex);
  align-items:center;
  justify-content:center;
  background:rgba(193,26,23,.95);
  color:#fff;
  font-size:10px;
  font-weight:900;
  line-height:1;
  box-shadow:0 0 0 2px rgba(255,255,255,.08) inset;
  flex:0 0 auto;
}

.sys-sidebar-sub-link .item-badge.is-zero{
  display:none;
}

.sys-sidebar-main-float::-webkit-scrollbar,
.sys-sidebar-sub-float::-webkit-scrollbar{
  width:8px;
  height:0;
}

.sys-sidebar-main-float::-webkit-scrollbar-thumb,
.sys-sidebar-sub-float::-webkit-scrollbar-thumb{
  background:rgba(245,190,108,.25);
  border-radius:999px;
}

.sys-sidebar-main-float::-webkit-scrollbar-track,
.sys-sidebar-sub-float::-webkit-scrollbar-track{
  background:transparent;
}

@media (max-width:768px){
  :root{
    --sb-main-width: 112px;
    --sb-sub-width: calc(100vw - 146px);
    --sb-right-gap: 8px;
    --sb-gap: 8px;
    --sb-top-offset: 150px;
    --sb-panel-max-height: calc(100dvh - var(--sb-top-offset) - 16px);
  }

  .sys-sidebar-backdrop{
    background:rgba(0,0,0,.38);
    left:0;
    right:auto;
    width:100vw;
    max-width:100vw;
  }

  .sys-sidebars-float{
    left:8px;
    right:8px;
    width:calc(100vw - 16px);
    max-width:calc(100vw - 16px);
    display:grid;
    grid-template-columns:var(--sb-main-width) minmax(0,1fr);
    align-items:stretch;
    gap:var(--sb-gap);
  }

  .sys-sidebar-main-float,
  .sys-sidebar-sub-float{
    width:auto;
    max-width:100%;
    max-height:var(--sb-panel-max-height);
    min-height:min(320px, var(--sb-panel-max-height));
  }

  .sys-sidebar-main-list{
    flex-direction:column;
    gap:7px;
    overflow:visible;
    padding:0;
  }

  .sys-sidebar-main-btn{
    min-height:58px;
    border-radius:14px;
    padding:7px 5px;
    flex-direction:column;
    justify-content:center;
    gap:5px;
  }

  .sys-sidebar-main-btn .icon{
    font-size:18px;
  }

  .sys-sidebar-main-btn .label{
    width:100%;
    font-size:10px;
    line-height:1.35;
    min-height:0;
    white-space:normal;
    word-break:normal;
    overflow-wrap:normal;
    text-align:center;
  }

  .sys-sidebar-sub-head{
    position:sticky;
    top:0;
    z-index:1;
    background:rgba(18,18,18,.92);
    backdrop-filter:blur(10px);
    -webkit-backdrop-filter:blur(10px);
  }

  .sys-sidebar-sub-link{
    padding:10px 10px;
    border-radius:12px;
  }

  .sys-sidebar-sub-link .txt{
    font-size:12px;
  }
}

@media (max-width:420px){
  :root{
    --sb-main-width: 108px;
    --sb-sub-width: calc(100vw - 132px);
    --sb-top-offset: 142px;
    --sb-panel-max-height: calc(100dvh - var(--sb-top-offset) - 14px);
    --sb-gap: 6px;
  }

  .sys-sidebars-float{
    left:7px;
    right:7px;
    width:calc(100vw - 14px);
    max-width:calc(100vw - 14px);
    grid-template-columns:var(--sb-main-width) minmax(0,1fr);
    align-items:stretch;
    gap:var(--sb-gap);
  }

  .sys-sidebar-main-float,
  .sys-sidebar-sub-float{
    max-width:100%;
    max-height:var(--sb-panel-max-height);
    min-height:min(300px, var(--sb-panel-max-height));
  }

  .sys-sidebar-main-float{
    padding:8px 7px;
  }

  .sys-sidebar-sub-float{
    padding:9px 7px;
  }

  .sys-sidebar-main-list{
    flex-direction:column;
    gap:7px;
    overflow:visible;
    padding:0;
  }

  .sys-sidebar-main-item{
    flex:0 0 auto;
  }

  .sys-sidebar-main-btn{
    min-height:64px;
    flex-direction:column;
    gap:5px;
    padding:7px 6px;
    justify-content:center;
  }

  .sys-sidebar-main-btn .icon{
    font-size:18px;
    flex:0 0 auto;
  }

  .sys-sidebar-main-btn .label{
    width:100%;
    min-height:0;
    font-size:10px;
    line-height:1.35;
    white-space:normal;
    word-break:normal;
    overflow-wrap:normal;
    text-align:center;
  }

  .sys-sidebar-sub-head{
    padding:10px;
  }

  .sys-sidebar-sub-link{
    min-height:42px;
  }

  .sys-sidebar-sub-link .txt{
    font-size:13px;
    word-break:normal;
    overflow-wrap:normal;
  }
}

/* Source: assets/styles/utilities/utilities.css */
.u-m-0{margin:0;}
.u-mt-6{margin-top:6px;}
.u-mt-8{margin-top:8px;}
.u-mt-10{margin-top:10px;}
.u-mt-12{margin-top:12px;}
.u-mt-14{margin-top:14px;}
.u-mt-16{margin-top:16px;}
.u-mb-0{margin-bottom:0;}
.u-mb-6{margin-bottom:6px;}
.u-mb-8{margin-bottom:8px;}
.u-mb-10{margin-bottom:10px;}
.u-mb-12{margin-bottom:12px;}
.u-mb-14{margin-bottom:14px;}
.u-mb-16{margin-bottom:16px;}
.u-my-12{margin-top:12px;margin-bottom:12px;}
.u-my-16{margin-top:16px;margin-bottom:16px;}
.u-text-start{text-align:start;}
.u-text-right{text-align:right;}
.u-justify-center{justify-content:center;}
.u-hidden{display:none;}
.u-grid-gap-8{display:grid;gap:8px;}
.u-grid-gap-12{display:grid;gap:12px;}
.u-flex-gap-6-wrap{display:flex;gap:6px;flex-wrap:wrap;}
.u-flex-gap-8-wrap{display:flex;gap:8px;flex-wrap:wrap;}
.u-grid-full{grid-column:1/-1;}
.u-actions-between{justify-content:space-between;align-items:center;}
.u-muted-text{color:rgba(255,255,255,.60);}
.u-min-h-160{min-height:160px;}
.u-ltr-small{direction:ltr;font-size:11px;}
.u-access-fallback{max-width:560px;margin:80px auto;font-family:Arial;text-align:center;}

/* Source: assets/styles/responsive/desktop.css */
:root{
  --desktop-table-font:12px;
}

.table-wrap,
.table-responsive,
[class$='-table-wrap'],
[class*='-table-wrap ']{
  max-width:100%;
}

.row-action-select{
  cursor:pointer;
}

/* Source: assets/styles/responsive/mobile-tablet.css */
@media (max-width:980px){
  .filter-bar,
  .sys-filter-bar,
  .filter-bar.compact,
  .sys-filter-bar.compact,
  .stats-grid,
  .sys-stats-grid{
    grid-template-columns:repeat(2, minmax(0,1fr));
  }
}

@media (max-width:920px){
  .form-grid{
    grid-template-columns:1fr;
  }

  .sys-home-grid,
  .sys-groups-grid{
    grid-template-columns:1fr;
  }
}

@media (max-width:768px){
  body{
    background-attachment:scroll;
  }

  .page{
    width:calc(100% - 18px);
    margin:10px auto 0;
  }

  .topbar,
  .content,
  .card,
  .sys-card{
    padding:14px;
    border-radius:16px;
  }

  .topbar-inner{
    flex-direction:column;
    align-items:stretch;
  }

  .impersonation-banner{
    flex-direction:column;
    align-items:stretch;
    text-align:center;
  }

  .impersonation-banner .btn{
    width:100%;
  }

  .brand{
    flex-direction:column;
    justify-content:center;
    align-items:center;
    text-align:center;
  }

  .brand-text{
    text-align:center;
  }

  .brand-text h1{
    font-size:20px;
  }

  .brand-text p{
    font-size:13px;
  }

  .logo{
    width:72vw;
    max-width:220px;
    width:min(220px, 72vw);
    height:84px;
    margin:0 auto;
  }

  .topbar-inner,
  .brand,
  .brand .logo{
    margin-inline:auto;
  }

  .sys-action-select,
  .row-action-select,
  select{
    text-align:center;
    text-align-last:center;
  }

  .chip{
    display:flex;
    justify-content:center;
    width:100%;
    flex-wrap:wrap;
  }

  .headline h1{
    font-size:18px;
    line-height:1.65;
    max-width:280px;
    margin-left:auto;
    margin-right:auto;
  }

  .headline h2,
  .sys-headline h2,
  .title{
    font-size:20px;
  }

  .headline p,
  .sys-headline p,
  .sub{
    font-size:13px;
  }

  .tbl th,
  .tbl td{
    display:block;
    width:100%;
    text-align:right;
  }

  .tbl th{
    white-space:normal;
    border-bottom:0;
    padding-bottom:6px;
  }

  .tbl td{
    padding-top:0;
    padding-bottom:12px;
  }

  input[type='text'],
  input[type='password'],
  input[type='date'],
  input[type='time'],
  input[type='number'],
  input[type='email'],
  input[type='search'],
  input[type='file'],
  select,
  textarea{
    width:100%;
    max-width:100%;
    font-size:13px;
  }

  .actions,
  .table-actions,
  .form-actions{
    gap:8px;
  }

  .btn,
  .sys-btn{
    min-width:96px;
    padding:10px 14px;
    font-size:13px;
  }

  .btn-block,
  .sys-btn-block{
    width:100%;
  }

  .table-wrap,
  .table-responsive,
  .table-scroll{
    width:100%;
    max-width:100%;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
  }

  .table-wrap table,
  .table-responsive table{
    width:100%;
    min-width:620px;
    table-layout:auto;
  }

  .table-wrap th,
  .table-wrap td,
  .table-responsive th,
  .table-responsive td,
  .sys-table th,
  .sys-table td{
    padding:8px 6px;
    font-size:12px;
    line-height:1.55;
    white-space:nowrap;
    word-break:normal;
    overflow-wrap:normal;
  }

  .sys-table{
    display:block;
    width:100%;
    max-width:100%;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
  }

  .sys-home-card,
  .sys-group-box{
    min-height:auto;
    padding:14px;
  }

  .sys-home-title,
  .sys-group-title{
    font-size:16px;
  }

  .sys-home-text,
  .sys-group-text{
    font-size:12px;
  }

  .toolbar,
  .sys-toolbar,
  .toolbar-start,
  .toolbar-end,
  .sys-toolbar-start,
  .sys-toolbar-end,
  .pagination{
    flex-direction:column;
    align-items:stretch;
  }

  .toolbar .btn,
  .toolbar .sys-btn,
  .sys-toolbar .btn,
  .sys-toolbar .sys-btn,
  .pagination a,
  .pagination span{
    width:100%;
    text-align:center;
  }

  .filter-bar,
  .sys-filter-bar,
  .filter-bar.compact,
  .sys-filter-bar.compact,
  .info-grid,
  .sys-info-grid{
    grid-template-columns:1fr;
  }

  .stats-grid,
  .sys-stats-grid{
    grid-template-columns:repeat(2, minmax(0,1fr));
  }

  .section-title,
  .sys-subhead{
    flex-direction:column;
    align-items:flex-start;
  }

  .table-actions-inline{
    flex-direction:column;
  }

  .table-actions-inline .btn,
  .table-actions-inline .sys-btn{
    width:100%;
  }

  .checks{
    flex-direction:column;
    align-items:stretch;
  }
}

@media (max-width:420px){
  .page{
    width:calc(100% - 14px);
  }

  .topbar,
  .content,
  .card,
  .sys-card{
    padding:12px;
  }

  .logo{
    width:70vw;
    max-width:200px;
    height:78px;
  }

  .headline h1{
    font-size:16px;
    line-height:1.65;
    max-width:240px;
    margin-left:auto;
    margin-right:auto;
  }

  .headline h2,
  .sys-headline h2,
  .title{
    font-size:18px;
  }

  .headline p,
  .sys-headline p,
  .sub{
    font-size:12px;
  }

  .btn,
  .sys-btn{
    min-width:84px;
    min-height:38px;
    padding:9px 12px;
    font-size:12px;
    border-radius:10px;
  }

  .btn-sm,
  .sys-btn-sm{
    min-width:76px;
    min-height:34px;
    font-size:11px;
  }

  .table-wrap table,
  .table-responsive table{
    min-width:560px;
  }

  .table-wrap th,
  .table-wrap td,
  .table-responsive th,
  .table-responsive td,
  .sys-table th,
  .sys-table td{
    font-size:11px;
    padding:7px 5px;
    white-space:nowrap;
  }
}

@media (max-width:1024px){
  .table-wrap th,
  .table-wrap td,
  .table-responsive th,
  .table-responsive td,
  table.sys-table th,
  table.sys-table td,
  table.recruitment-table th,
  table.recruitment-table td{
    padding:8px 6px;
    font-size:12px;
    line-height:1.45;
  }

  .table-actions-inline a,
  .table-actions-inline button,
  .table-actions a,
  .table-actions button,
  .recruitment-actions a,
  .recruitment-actions button,
  .recruitment-link,
  .file-state,
  .badge,
  .recruitment-badge{
    padding:7px 9px;
    min-height:34px;
    font-size:11.5px;
    border-radius:9px;
  }
}

@media (max-width:420px){
  .table-wrap th,
  .table-wrap td,
  .table-responsive th,
  .table-responsive td,
  table.sys-table th,
  table.sys-table td,
  table.recruitment-table th,
  table.recruitment-table td{
    padding:7px 5px;
    font-size:11px;
  }

  .table-actions-inline a,
  .table-actions-inline button,
  .table-actions a,
  .table-actions button,
  .recruitment-actions a,
  .recruitment-actions button,
  .recruitment-link,
  .file-state,
  .badge,
  .recruitment-badge{
    padding:7px 8px;
    min-height:34px;
    font-size:11px;
  }
}
