:root{
  --bg:#0a0a0b;
  --surface:#141416;
  --surface-2:#1d1d20;
  --surface-hover:#242427;
  --border:#2a2a2e;
  --border-light:#38383d;
  --text:#f4f4f2;
  --text-dim:#98989e;
  --text-faint:#5c5c62;
  --white:#ffffff;
  --cut:14px;
  --cut-sm:8px;
  --font-display:'Space Grotesk', sans-serif;
  --font-body:'Inter', sans-serif;
  --font-mono:'JetBrains Mono', monospace;
}
*{box-sizing:border-box; margin:0; padding:0;}
html,body{height:100%;}
body{
  background:
    radial-gradient(ellipse 900px 500px at 100% 0%, rgba(255,255,255,0.035), transparent 60%),
    var(--bg);
  color:var(--text);
  font-family:var(--font-body);
  -webkit-font-smoothing:antialiased;
}
a{color:inherit;}
::selection{background:var(--white); color:#000;}
::-webkit-scrollbar{width:9px; height:9px;}
::-webkit-scrollbar-track{background:transparent;}
::-webkit-scrollbar-thumb{background:var(--border-light);}
::-webkit-scrollbar-thumb:hover{background:var(--text-faint);}

.app{display:flex; min-height:100vh; width:100%;}

/* ---------- SIDEBAR ---------- */
.sidebar{
  width:236px; min-width:236px;
  background:var(--surface);
  border-right:1px solid var(--border);
  display:flex; flex-direction:column;
  position:sticky; top:0; height:100vh;
}
.brand{
  display:flex; align-items:center; gap:12px;
  padding:24px 20px 20px;
  border-bottom:1px solid var(--border);
}
.brand img{width:40px; height:40px; object-fit:contain; filter:drop-shadow(0 2px 6px rgba(0,0,0,0.6));}
.brand-text{display:flex; flex-direction:column; line-height:1.15;}
.brand-text .name{font-family:var(--font-display); font-weight:700; font-size:15.5px; letter-spacing:0.02em;}
.brand-text .sub{font-size:10px; color:var(--text-faint); text-transform:uppercase; letter-spacing:0.14em; margin-top:2px;}

.nav{flex:1; padding:18px 12px; display:flex; flex-direction:column; gap:4px; overflow-y:auto;}
.nav-label{font-size:10px; color:var(--text-faint); text-transform:uppercase; letter-spacing:0.14em; padding:6px 12px 8px;}
.nav-item{
  display:flex; align-items:center; gap:11px;
  padding:10px 12px;
  color:var(--text-dim);
  font-size:13.5px; font-weight:500;
  text-decoration:none;
  border:1px solid transparent;
  clip-path:polygon(var(--cut-sm) 0, 100% 0, 100% 100%, 0 100%, 0 var(--cut-sm));
  transition:color .15s ease, background .15s ease;
}
.nav-item svg{width:16px; height:16px; flex-shrink:0; opacity:0.85;}
.nav-item:hover{color:var(--text); background:var(--surface-2);}
.nav-item.active{color:#000; background:var(--white); font-weight:600;}
.nav-item.active svg{opacity:1;}
.nav-item .count{margin-left:auto; font-family:var(--font-mono); font-size:10.5px; color:var(--text-faint); background:var(--surface-2); padding:1px 6px;}
.nav-item.active .count{background:rgba(0,0,0,0.12); color:#000;}

.sidebar-footer{padding:14px 20px 18px; border-top:1px solid var(--border);}
.user-chip{display:flex; align-items:center; gap:9px;}
.user-chip .avatar{
  width:26px; height:26px; background:var(--white); color:#000;
  display:flex; align-items:center; justify-content:center;
  font-family:var(--font-display); font-weight:700; font-size:11px;
  clip-path:polygon(4px 0, 100% 0, 100% 100%, 0 100%, 0 4px);
  flex-shrink:0;
}
.user-chip .info{line-height:1.3; overflow:hidden;}
.user-chip .info .u-name{font-size:12px; font-weight:600; color:var(--text); white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.user-chip .info .u-role{font-size:10px; color:var(--text-faint); text-transform:uppercase; letter-spacing:0.06em;}
.logout-btn{
  margin-top:12px; width:100%; justify-content:center;
  display:flex; align-items:center; gap:7px;
  background:transparent; border:1px solid var(--border-light); color:var(--text-dim);
  font-size:11.5px; font-weight:600; padding:8px 10px; cursor:pointer;
  clip-path:polygon(var(--cut-sm) 0, 100% 0, 100% 100%, 0 100%, 0 var(--cut-sm));
  transition:all .15s ease; text-decoration:none;
}
.logout-btn:hover{color:var(--text); background:var(--surface-2);}
.logout-btn svg{width:13px; height:13px;}

/* ---------- MAIN ---------- */
.main{flex:1; display:flex; flex-direction:column; min-width:0;}
.topbar{
  display:flex; align-items:center; justify-content:space-between;
  padding:22px 32px 18px; border-bottom:1px solid var(--border);
  flex-wrap:wrap; gap:14px;
}
.topbar h1{font-family:var(--font-display); font-size:22px; font-weight:600; letter-spacing:-0.01em;}
.topbar .subtitle{font-size:12.5px; color:var(--text-dim); margin-top:3px;}
.topbar-actions{display:flex; align-items:center; gap:10px;}

.search-box{
  display:flex; align-items:center; gap:8px;
  background:var(--surface); border:1px solid var(--border);
  padding:8px 12px; min-width:220px;
  clip-path:polygon(var(--cut-sm) 0, 100% 0, 100% 100%, 0 100%, 0 var(--cut-sm));
}
.search-box svg{width:14px; height:14px; color:var(--text-faint); flex-shrink:0;}
.search-box input{background:none; border:none; outline:none; color:var(--text); font-size:13px; width:100%; font-family:var(--font-body);}
.search-box input::placeholder{color:var(--text-faint);}

.btn{
  font-family:var(--font-body); font-size:13px; font-weight:600;
  padding:9px 16px; border:1px solid var(--border-light);
  background:var(--surface-2); color:var(--text); cursor:pointer;
  display:inline-flex; align-items:center; gap:7px; text-decoration:none;
  clip-path:polygon(var(--cut-sm) 0, 100% 0, 100% 100%, 0 100%, 0 var(--cut-sm));
  transition:background .15s ease, transform .1s ease, border-color .15s ease;
  white-space:nowrap;
}
.btn svg{width:14px; height:14px;}
.btn:hover{background:var(--surface-hover); border-color:var(--text-faint);}
.btn:active{transform:scale(0.97);}
.btn-primary{background:var(--white); color:#000; border-color:var(--white);}
.btn-primary:hover{background:#e2e2e2;}
.btn-sm{padding:6px 10px; font-size:12px;}

.content{flex:1; padding:26px 32px 40px;}

/* ---------- STAT CARDS ---------- */
.stat-grid{display:grid; grid-template-columns:repeat(4, 1fr); gap:14px; margin-bottom:28px;}
.stat-card{
  background:var(--surface); border:1px solid var(--border);
  padding:18px 18px 16px;
  clip-path:polygon(0 0, calc(100% - var(--cut)) 0, 100% var(--cut), 100% 100%, 0 100%);
  position:relative;
}
.stat-card .label{font-size:11px; color:var(--text-dim); text-transform:uppercase; letter-spacing:0.1em; margin-bottom:10px;}
.stat-card .value{font-family:var(--font-mono); font-size:26px; font-weight:600; letter-spacing:-0.01em;}
.stat-card .value small{font-size:14px; color:var(--text-dim); font-weight:400; margin-left:2px;}

.section-row{display:grid; grid-template-columns:1.3fr 1fr; gap:16px; align-items:start;}
.panel{background:var(--surface); border:1px solid var(--border);}
.panel-head{display:flex; align-items:center; justify-content:space-between; padding:16px 18px; border-bottom:1px solid var(--border);}
.panel-head h3{font-family:var(--font-display); font-size:14.5px; font-weight:600;}
.panel-head .tag{font-size:10.5px; color:var(--text-faint); font-family:var(--font-mono);}
.panel-body{padding:6px 0;}

.mini-row{display:flex; align-items:center; justify-content:space-between; padding:11px 18px; border-bottom:1px solid var(--border); font-size:13px;}
.mini-row:last-child{border-bottom:none;}
.mini-row .name{font-weight:500;}
.mini-row .meta{color:var(--text-faint); font-size:11.5px; margin-top:2px;}
.mini-row .right{text-align:right; font-family:var(--font-mono); font-size:12.5px;}

.empty-state{padding:48px 20px; text-align:center; color:var(--text-faint);}
.empty-state svg{width:34px; height:34px; margin-bottom:12px; opacity:0.5;}
.empty-state p{font-size:13px; margin-bottom:16px;}

/* ---------- TABLE ---------- */
.table-wrap{background:var(--surface); border:1px solid var(--border); overflow-x:auto;}
table{width:100%; border-collapse:collapse;}
thead th{
  text-align:left; font-size:10.5px; text-transform:uppercase; letter-spacing:0.08em;
  color:var(--text-faint); font-weight:600; padding:13px 16px; border-bottom:1px solid var(--border);
  background:var(--surface-2); white-space:nowrap;
}
tbody td{padding:13px 16px; border-bottom:1px solid var(--border); font-size:13px; vertical-align:middle;}
tbody tr:last-child td{border-bottom:none;}
tbody tr:hover{background:var(--surface-2);}
.cell-name{font-weight:600;}
.cell-sub{color:var(--text-faint); font-size:11.5px; margin-top:2px;}
.cell-mono{font-family:var(--font-mono); font-size:12.5px;}
.row-actions{display:flex; gap:6px; justify-content:flex-end;}
.icon-btn{
  width:28px; height:28px; display:inline-flex; align-items:center; justify-content:center;
  background:transparent; border:1px solid transparent; color:var(--text-faint);
  cursor:pointer; transition:all .15s ease; text-decoration:none;
}
.icon-btn:hover{color:var(--text); border-color:var(--border-light); background:var(--surface-hover);}
.icon-btn svg{width:14px; height:14px;}
.icon-btn.delete:hover{color:var(--white); border-color:var(--white);}

.qty-badge{font-family:var(--font-mono); font-size:12.5px; font-weight:600; padding:3px 9px; border:1px solid var(--border-light); display:inline-block;}
.qty-badge.low{background:var(--white); color:#000; border-color:var(--white);}
.cat-badge{font-size:10.5px; color:var(--text-dim); border:1px solid var(--border); padding:3px 8px; text-transform:uppercase; letter-spacing:0.04em;}
.role-badge{font-size:10px; font-weight:600; padding:2px 8px; border:1px solid var(--border-light); color:var(--text-dim); text-transform:uppercase; letter-spacing:0.06em; display:inline-block;}
.role-badge.owner{background:var(--white); color:#000; border-color:var(--white);}

/* ---------- MODAL ---------- */
.overlay{position:fixed; inset:0; background:rgba(0,0,0,0.65); backdrop-filter:blur(3px); display:none; align-items:center; justify-content:center; z-index:100; padding:20px;}
.overlay.active{display:flex;}
.modal{background:var(--surface); border:1px solid var(--border-light); width:460px; max-width:100%; max-height:88vh; overflow-y:auto; clip-path:polygon(0 0, calc(100% - 20px) 0, 100% 20px, 100% 100%, 0 100%);}
.modal-head{display:flex; align-items:center; justify-content:space-between; padding:18px 20px; border-bottom:1px solid var(--border);}
.modal-head h3{font-family:var(--font-display); font-size:16px; font-weight:600;}
.modal-body{padding:20px;}
.field{margin-bottom:14px;}
.field label{display:block; font-size:11.5px; color:var(--text-dim); margin-bottom:6px; text-transform:uppercase; letter-spacing:0.06em;}
.field input, .field select, .field textarea{
  width:100%; background:var(--surface-2); border:1px solid var(--border-light);
  color:var(--text); padding:10px 11px; font-size:13.5px; font-family:var(--font-body); outline:none;
}
.field input:focus, .field select:focus, .field textarea:focus{border-color:var(--text-dim);}
.field textarea{resize:vertical; min-height:60px;}
.field-row{display:grid; grid-template-columns:1fr 1fr; gap:12px;}
.modal-foot{display:flex; justify-content:flex-end; gap:10px; padding:16px 20px; border-top:1px solid var(--border);}
.confirm-text{font-size:13.5px; color:var(--text-dim); line-height:1.5;}
.confirm-text b{color:var(--text);}

/* ---------- TOAST / FLASH ---------- */
.toast-wrap{position:fixed; bottom:22px; right:22px; z-index:200; display:flex; flex-direction:column; gap:8px;}
.toast{
  background:var(--white); color:#000; font-size:13px; font-weight:600;
  padding:12px 16px; display:flex; align-items:center; gap:9px;
  clip-path:polygon(10px 0, 100% 0, 100% 100%, 0 100%, 0 10px);
  box-shadow:0 8px 24px rgba(0,0,0,0.4);
}
.toast svg{width:15px; height:15px; flex-shrink:0;}

/* ---------- AUTH PAGES ---------- */
.auth-page{min-height:100vh; display:flex; align-items:center; justify-content:center; padding:20px;
  background:radial-gradient(ellipse 900px 600px at 50% 0%, rgba(255,255,255,0.05), transparent 60%), var(--bg);}
.auth-card{width:380px; max-width:100%; background:var(--surface); border:1px solid var(--border-light); clip-path:polygon(0 0, calc(100% - 22px) 0, 100% 22px, 100% 100%, 0 100%);}
.auth-card-head{display:flex; flex-direction:column; align-items:center; text-align:center; padding:32px 28px 22px; border-bottom:1px solid var(--border);}
.auth-card-head img{width:56px; height:56px; object-fit:contain; margin-bottom:14px; filter:drop-shadow(0 2px 8px rgba(0,0,0,0.6));}
.auth-card-head h2{font-family:var(--font-display); font-size:18px; font-weight:700;}
.auth-card-head p{font-size:12px; color:var(--text-dim); margin-top:6px; line-height:1.5;}
.auth-card-body{padding:24px 28px 8px;}
.auth-card-foot{padding:8px 28px 28px;}
.auth-error{font-size:12px; color:var(--text); background:var(--surface-2); border:1px solid var(--border-light); padding:9px 11px; margin-bottom:14px;}
.auth-error::before{content:'⚠ ';}
.auth-switch{font-size:11.5px; color:var(--text-faint); text-align:center; margin-top:14px; line-height:1.6;}
.btn-block{width:100%; justify-content:center; padding:11px 16px;}

/* ---------- REFERENCE PAGE (gamme, stock plan, standards) ---------- */
.tabbar{display:flex; gap:8px; margin-bottom:22px; flex-wrap:wrap;}
.tab-btn{
  font-family:var(--font-body); font-size:12.5px; font-weight:600;
  padding:8px 14px; border:1px solid var(--border-light);
  background:var(--surface); color:var(--text-dim); cursor:pointer;
  clip-path:polygon(var(--cut-sm) 0, 100% 0, 100% 100%, 0 100%, 0 var(--cut-sm));
  transition:all .15s ease;
}
.tab-btn:hover{color:var(--text); background:var(--surface-2);}
.tab-btn.active{background:var(--white); color:#000; border-color:var(--white);}
.ref-view{display:none; animation:fadein .2s ease;}
.ref-view.active{display:block;}

.section-title{font-family:var(--font-display); font-size:18px; font-weight:600; margin-bottom:14px;}
.pill{font-size:10px; padding:2px 8px; border:1px solid var(--border-light); color:var(--text-dim); text-transform:uppercase; letter-spacing:0.06em; display:inline-block;}
.pill.white{background:var(--white); color:#000; border-color:var(--white);}

.note{
  background:var(--surface); border:1px solid var(--border); padding:18px;
  color:var(--text-dim); font-size:13px; line-height:1.65; margin-top:16px;
  clip-path:polygon(0 0, calc(100% - var(--cut)) 0, 100% var(--cut), 100% 100%, 0 100%);
}
.note b{color:var(--text);}

.cards{display:grid; grid-template-columns:repeat(2, 1fr); gap:16px;}
.model-card{
  background:var(--surface); border:1px solid var(--border); padding:20px;
  clip-path:polygon(0 0, calc(100% - var(--cut)) 0, 100% var(--cut), 100% 100%, 0 100%);
}
.series{font-size:10px; text-transform:uppercase; letter-spacing:0.14em; color:var(--text-faint);}
.model-card h3{font-family:var(--font-display); font-size:20px; font-weight:600; margin:5px 0 14px;}
.spec{display:flex; justify-content:space-between; gap:20px; padding:9px 0; border-bottom:1px solid var(--border); font-size:12.5px;}
.spec span:first-child{color:var(--text-faint);}
.spec span:last-child{text-align:right; font-family:var(--font-mono);}
.price{font-family:var(--font-mono); font-size:22px; font-weight:600; margin-top:16px;}
.price small{display:block; font-family:var(--font-body); font-size:11px; color:var(--text-faint); margin-top:4px; font-weight:400;}

.checklist{display:grid; grid-template-columns:repeat(2, 1fr); gap:12px;}
.check{background:var(--surface); border:1px solid var(--border); padding:16px;}
.check b{display:block; font-family:var(--font-display); font-size:13px; font-weight:600; margin-bottom:5px;}
.check span{font-size:12px; color:var(--text-dim);}

@media (max-width:650px){ .cards, .checklist{grid-template-columns:1fr;} }

@media print{
  body{overflow:visible; background:#fff; color:#000;}
  .sidebar, .topbar-actions, .tabbar, .toast-wrap, .mobile-topbar, .sidebar-overlay{display:none;}
  .main{height:auto;}
  .content{overflow:visible;}
  .panel, .stat-card, .model-card, .table-wrap, .note, .check{background:#fff; color:#000; border-color:#bbb;}
  .topbar{border-color:#bbb;}
  .mini-row .meta, .subtitle, .panel-head .tag, .series, .stat-card .label, .spec span:first-child, .price small, .note, .check span{color:#444 !important;}
}

/* ---------- INVOICES ---------- */
.status-badge{font-size:10px; font-weight:600; padding:3px 9px; border:1px solid var(--border-light); color:var(--text-dim); text-transform:uppercase; letter-spacing:0.06em; display:inline-block;}
.status-badge.envoyee{border-color:var(--text-dim); color:var(--text);}
.status-badge.payee{background:var(--white); color:#000; border-color:var(--white);}

.invoice-form-grid{display:grid; grid-template-columns:1fr 1fr; gap:24px; align-items:start;}
.invoice-form-grid .panel{padding:20px;}

.items-editor{background:var(--surface); border:1px solid var(--border);}
.items-head-row, .item-row{
  display:grid; grid-template-columns:1.6fr 2fr 80px 110px 110px 34px;
  gap:10px; align-items:center; padding:10px 14px;
}
.items-head-row{
  background:var(--surface-2); border-bottom:1px solid var(--border);
  font-size:10.5px; text-transform:uppercase; letter-spacing:0.06em; color:var(--text-faint);
}
.item-row{border-bottom:1px solid var(--border);}
.item-row:last-of-type{border-bottom:none;}
.item-row select, .item-row input{
  width:100%; background:var(--surface-2); border:1px solid var(--border-light);
  color:var(--text); padding:8px 9px; font-size:13px; font-family:var(--font-body); outline:none;
}
.item-row input[type="number"]{font-family:var(--font-mono);}
.item-line-total{font-family:var(--font-mono); font-size:13px; text-align:right; padding-right:4px;}
.items-editor-foot{padding:12px 14px; border-top:1px solid var(--border);}

.totals-box{padding:16px 18px;}
.totals-row{display:flex; justify-content:space-between; padding:8px 0; font-size:13px; border-bottom:1px solid var(--border);}
.totals-row:last-child{border-bottom:none; padding-top:12px;}
.totals-row .t-label{color:var(--text-dim);}
.totals-row .t-value{font-family:var(--font-mono);}
.totals-row.grand-total .t-label, .totals-row.grand-total .t-value{font-size:18px; font-weight:600; color:var(--text);}

@media (max-width:640px){
  .invoice-form-grid{grid-template-columns:1fr;}
  .items-head-row{display:none;}
  .item-row{
    grid-template-columns:1fr 1fr; grid-template-areas:"stock stock" "desc desc" "qty price" "total remove";
    border-bottom:1px solid var(--border); padding:14px;
  }
  .item-row .item-stock-select{grid-area:stock;}
  .item-row .item-desc{grid-area:desc;}
  .item-row .item-qty{grid-area:qty;}
  .item-row .item-price{grid-area:price;}
  .item-row .item-line-total{grid-area:total; text-align:left; padding-top:6px;}
  .item-row .remove-item-row{grid-area:remove; justify-self:end;}
}

/* ---------- TABLET: 641–900px — icon-only rail ---------- */
@media (max-width:900px) and (min-width:641px){
  .stat-grid{grid-template-columns:repeat(2,1fr);}
  .section-row{grid-template-columns:1fr;}
  .sidebar{width:76px; min-width:76px;}
  .brand-text, .nav-item span:not(.count), .nav-label{display:none;}
  .nav-item{justify-content:center;}
  .sidebar-footer{padding:12px 8px;}
  .user-chip .info, .logout-btn span{display:none;}
}

/* ---------- MOBILE TOPBAR + HAMBURGER (phone only) ---------- */
.mobile-topbar{
  display:none; align-items:center; gap:12px;
  padding:14px 16px; border-bottom:1px solid var(--border);
  background:var(--surface); position:sticky; top:0; z-index:150;
}
.mobile-topbar img{width:28px; height:28px; object-fit:contain; flex-shrink:0;}
.mobile-topbar .mt-name{font-family:var(--font-display); font-weight:700; font-size:14px; flex:1;}
.hamburger-btn{
  width:36px; height:36px; display:flex; align-items:center; justify-content:center;
  background:var(--surface-2); border:1px solid var(--border-light); color:var(--text);
  cursor:pointer; flex-shrink:0;
  clip-path:polygon(var(--cut-sm) 0, 100% 0, 100% 100%, 0 100%, 0 var(--cut-sm));
}
.hamburger-btn svg{width:18px; height:18px;}
.sidebar-overlay{display:none; position:fixed; inset:0; background:rgba(0,0,0,0.55); z-index:400;}
.sidebar-overlay.active{display:block;}
.sidebar-close-btn{display:none;}

/* ---------- PHONE: ≤640px — off-canvas drawer nav, stacked tables, single-column forms ---------- */
@media (max-width:640px){
  .mobile-topbar{display:flex;}

  .sidebar{
    position:fixed; top:0; left:-270px; width:250px; min-width:250px; height:100vh;
    z-index:401; transition:left .22s ease; box-shadow:none;
  }
  .sidebar.open{left:0; box-shadow:10px 0 32px rgba(0,0,0,0.55);}
  .sidebar .brand{justify-content:space-between;}
  .sidebar-close-btn{
    display:flex; align-items:center; justify-content:center; width:30px; height:30px;
    background:transparent; border:1px solid var(--border-light); color:var(--text-dim); cursor:pointer;
  }
  .sidebar-close-btn svg{width:15px; height:15px;}

  .main{width:100%;}
  .topbar{padding:16px 16px 14px;}
  .topbar h1{font-size:19px;}
  .content{padding:16px 14px 32px;}

  .topbar-actions{width:100%; flex-direction:column; align-items:stretch;}
  .topbar-actions .search-box{width:100%; min-width:0;}
  .topbar-actions .btn{width:100%;}

  .stat-grid{grid-template-columns:1fr 1fr; gap:10px;}
  .stat-card{padding:14px;}
  .stat-card .value{font-size:21px;}
  .section-row{grid-template-columns:1fr; gap:12px;}

  .field-row{grid-template-columns:1fr;}
  .modal{width:100%;}
  .modal-body{padding:16px;}
  .modal-head{padding:14px 16px;}
  .modal-foot{padding:12px 16px; flex-wrap:wrap;}
  .modal-foot .btn{flex:1;}

  .tabbar{gap:6px; overflow-x:auto; flex-wrap:nowrap; padding-bottom:4px; -webkit-overflow-scrolling:touch;}
  .tab-btn{flex-shrink:0;}

  .cards{grid-template-columns:1fr;}

  /* Tables become stacked cards instead of horizontal-scroll grids */
  .table-wrap{overflow:visible; border-left:none; border-right:none;}
  .table-wrap table{min-width:0;}
  .table-wrap thead{display:none;}
  .table-wrap tbody, .table-wrap tr{display:block; width:100%;}
  .table-wrap tr{border-bottom:1px solid var(--border); padding:14px 4px;}
  .table-wrap tr:last-child{border-bottom:none;}
  .table-wrap td{
    display:flex; justify-content:space-between; align-items:center; gap:10px;
    padding:5px 0; border:none; font-size:13px;
  }
  .table-wrap td:first-child{display:block; padding-bottom:8px;}
  .table-wrap td:first-child .cell-name{font-size:14.5px;}
  .table-wrap td[data-label]::before{
    content:attr(data-label); color:var(--text-faint); font-size:10px;
    text-transform:uppercase; letter-spacing:0.06em; font-weight:600; flex-shrink:0;
  }
  .table-wrap td.row-actions-cell{padding-top:10px; justify-content:flex-end;}

  .auth-card{width:100%;}
  .auth-card-head{padding:26px 20px 18px;}
  .auth-card-body{padding:20px 20px 6px;}
  .auth-card-foot{padding:6px 20px 22px;}
}