/* Design tokens: keep Render-style light SaaS values centralized here. */
:root{
  --bg:#fff;
  --surface:#fff;
  --surface-soft:#f8f8f8;
  --surface-muted:#f2f2f2;
  --border:#e5e5e5;
  --border-strong:#d4d4d4;
  --text:#111;
  --text-muted:#6f6f6f;
  --text-soft:#9a9a9a;
  --accent:#7c3cff;
  --accent-soft:#f1eaff;
  --accent-rgb:124 60 255;
  --success:#2fa66a;
  --success-soft:#e9f8f1;
  --warning:#a16018;
  --warning-soft:#fff4e8;
  --danger:#dc3545;
  --danger-soft:#fdecef;
  --radius-sm:6px;
  --radius-md:10px;
  --radius-lg:14px;
  --shadow-card:0 1px 2px rgba(0,0,0,.04);
  --shadow-popout:0 24px 60px rgba(0,0,0,.14);
  --sidebar-w:260px;
  --topbar-h:72px;
  --font:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --mono:"SFMono-Regular","Cascadia Code","Roboto Mono",Consolas,monospace;
  --brand:var(--accent);
  --brand-2:var(--accent);
  --brand-3:var(--accent);
  --brand-rgb:124 60 255;
  --line:var(--border);
  --line-strong:var(--border-strong);
  --muted:var(--text-muted);
  --muted-2:var(--text-soft);
  --text-2:#2a2a2a;
}

*{box-sizing:border-box}
html{
  color-scheme:light;
  background:var(--bg);
  -webkit-text-size-adjust:100%;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
body{
  margin:0;
  min-height:100vh;
  background:var(--bg);
  color:var(--text);
  font:400 14px/1.5 var(--font);
  overflow-x:hidden;
}
body::before,
body::after{display:none!important}
img,svg{display:block;max-width:100%}
svg{width:18px;height:18px;stroke:currentColor;stroke-width:1.8;fill:none;stroke-linecap:round;stroke-linejoin:round}
a{color:inherit}
button,input,select,textarea{font:inherit}
button{cursor:pointer}
body,
button,
input,
select,
textarea{
  word-break:normal;
  overflow-wrap:break-word;
}
::selection{background:var(--accent-soft);color:var(--accent)}

.sidebar{
  position:fixed;
  inset:0 auto 0 0;
  z-index:40;
  width:var(--sidebar-w);
  display:flex;
  flex-direction:column;
  gap:22px;
  padding:24px 16px;
  border-right:1px solid var(--border);
  background:#fbfbfb;
  overflow:auto;
}
.sidebar::before{display:none}
.brand,
.brand.logo-brand{
  min-height:40px;
  display:flex;
  align-items:center;
  gap:10px;
  color:var(--text);
  text-decoration:none;
  font-weight:700;
}
.brand.logo-brand img{
  width:138px;
  height:auto;
  object-fit:contain;
}
.brand.logo-brand span{
  display:none;
}
.sidebar nav{
  display:grid;
  gap:2px;
}
.sidebar nav::before{
  content:"Main";
  margin:12px 12px 8px;
  color:var(--text-soft);
  font:600 11px/1 var(--mono);
  letter-spacing:.14em;
  text-transform:uppercase;
}
.nav{
  min-height:40px;
  display:flex;
  align-items:center;
  gap:10px;
  padding:0 12px;
  border-radius:var(--radius-sm);
  color:var(--text);
  text-decoration:none;
  font-size:14px;
  font-weight:500;
  border:1px solid transparent;
  transition:background .15s ease,color .15s ease,border-color .15s ease;
}
.nav:hover{background:var(--surface-soft)}
.nav.active{
  background:var(--accent-soft);
  color:var(--accent);
}
.nav span,
.mobile-menu-links span{
  width:18px;
  height:18px;
  display:grid;
  place-items:center;
  flex:0 0 18px;
  color:currentColor;
  font-size:0;
  filter:none;
  position:relative;
}
.nav .icon,
.mobile-menu-links .icon,
.avatar-menu-icon .icon,
.button-icon,
.search-icon,
.search-result-icon .icon,
.vs-list-icon .icon{
  width:18px;
  height:18px;
  color:currentColor;
}
.nav.active span,
.mobile-menu-links a.active span{color:var(--accent);filter:none}
.nav span::before,
.mobile-menu-links span::before{
  content:none;
}
.nav span::after,
.mobile-menu-links span::after{
  content:none;
}
.nav em,
.mobile-menu-links em{
  margin-left:auto;
  min-width:18px;
  height:18px;
  padding:0 6px;
  border-radius:999px;
  display:inline-grid;
  place-items:center;
  background:var(--danger);
  color:#fff;
  font-size:11px;
  font-style:normal;
  font-weight:700;
}
.sidefoot{
  margin-top:auto;
  padding:14px 12px;
  border:1px solid var(--border);
  border-radius:var(--radius-md);
  background:var(--surface);
  box-shadow:var(--shadow-card);
}
.sidefoot div{font-weight:650;color:var(--text)}
.sidefoot small{display:block;color:var(--text-muted);font-size:12px}

/* Temporary public landing page. Scoped so the logged-in app stays untouched. */
.marketing-simple{
  min-height:100vh;
  background:#fff;
  color:var(--text);
}
.marketing-simple-header{
  position:sticky;
  top:0;
  z-index:20;
  min-height:72px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  padding:16px clamp(18px,4vw,56px);
  border-bottom:1px solid var(--border);
  background:rgba(255,255,255,.92);
  backdrop-filter:blur(12px);
}
.marketing-simple-brand{
  display:flex;
  align-items:center;
  min-width:0;
}
.marketing-simple-brand img{
  width:154px;
  height:auto;
  object-fit:contain;
}
.marketing-simple-nav,
.marketing-simple-actions,
.marketing-simple-footer nav{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}
.marketing-simple-nav a:not(.btn),
.marketing-simple-footer a{
  color:var(--text);
  text-decoration:none;
  font-weight:600;
}
.marketing-simple-nav a:not(.btn):hover,
.marketing-simple-footer a:hover{color:var(--accent)}
.marketing-simple-main{
  width:min(1120px,calc(100vw - 36px));
  margin:0 auto;
}
.marketing-simple-hero{
  min-height:clamp(440px,68vh,620px);
  display:grid;
  align-items:center;
  padding:72px 0 38px;
}
.marketing-simple-copy{
  max-width:820px;
}
.marketing-simple h1{
  margin:0;
  max-width:780px;
  color:var(--text);
  font-size:clamp(42px,6vw,76px);
  line-height:.98;
  letter-spacing:0;
}
.marketing-simple-copy > p{
  margin:22px 0 0;
  max-width:760px;
  color:var(--text-muted);
  font-size:clamp(18px,2.3vw,24px);
  line-height:1.45;
}
.marketing-simple-actions{
  margin-top:30px;
}
.marketing-simple-note{
  width:max-content;
  max-width:100%;
  margin-top:22px;
  padding:10px 12px;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  background:var(--surface-soft);
  color:var(--text-muted);
  font-weight:600;
}
.marketing-simple-features{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
  padding:24px 0 52px;
}
.marketing-simple-features article{
  min-width:0;
  padding:22px;
  border:1px solid var(--border);
  border-radius:var(--radius-md);
  background:#fff;
  box-shadow:var(--shadow-card);
}
.marketing-simple-features span{
  display:block;
  margin-bottom:16px;
  color:var(--accent);
  font:700 12px/1 var(--mono);
}
.marketing-simple-features h2{
  margin:0;
  font-size:20px;
  line-height:1.25;
}
.marketing-simple-demo{
  display:grid;
  grid-template-columns:minmax(0,.9fr) minmax(320px,1.1fr);
  gap:28px;
  align-items:start;
  padding:52px 0 72px;
  border-top:1px solid var(--border);
}
.marketing-simple-form-copy h2{
  margin:8px 0 10px;
  font-size:32px;
  line-height:1.15;
}
.marketing-simple-form-copy p:not(.eyebrow){
  margin:0;
  color:var(--text-muted);
  font-size:17px;
}
.marketing-simple .demo-form{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
  padding:22px;
  border:1px solid var(--border);
  border-radius:var(--radius-md);
  background:#fff;
  box-shadow:var(--shadow-card);
}
.marketing-simple .demo-form .full,
.marketing-simple .demo-form .notice{grid-column:1/-1}
.marketing-simple .hp-field{
  position:absolute;
  left:-9999px;
  width:1px;
  height:1px;
  overflow:hidden;
}
.marketing-simple-footer{
  min-height:86px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  padding:22px clamp(18px,4vw,56px);
  border-top:1px solid var(--border);
  color:var(--text-muted);
}
.marketing-simple-footer strong{color:var(--text)}

.main{
  min-height:100vh;
  margin-left:var(--sidebar-w);
  background:var(--bg);
}
.main.guest{
  margin-left:0;
  display:grid;
  place-items:center;
  padding:32px;
}
.top{
  position:sticky;
  top:0;
  z-index:30;
  min-height:var(--topbar-h);
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:20px;
  padding:0 32px;
  border-bottom:1px solid var(--border);
  background:rgba(255,255,255,.86);
  backdrop-filter:blur(12px);
}
.top h1{
  margin:0;
  font-size:16px;
  line-height:1.2;
  font-weight:650;
  letter-spacing:0;
}
.top p{
  margin:3px 0 0;
  color:var(--text-muted);
  font-size:12px;
}
.top-actions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:12px;
  min-width:0;
}
.mobile-menu-trigger{display:none}
.global-search{position:relative}
.global-search-box{
  height:40px;
  min-width:320px;
  display:flex;
  align-items:center;
  gap:10px;
  padding:0 10px;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  background:var(--surface);
}
.global-search-box span{color:var(--text-soft)}
.global-search-box input{
  min-width:0;
  flex:1;
  border:0;
  outline:0;
  background:transparent;
  color:var(--text);
  font-size:13px;
}
.global-search-box input::placeholder{color:var(--text-soft)}
kbd{
  min-width:32px;
  height:22px;
  display:inline-grid;
  place-items:center;
  border:1px solid var(--border);
  border-radius:4px;
  background:var(--surface-soft);
  color:var(--text-muted);
  font:600 11px/1 var(--mono);
}
.global-search-results,
.notif-dropdown,
.avatar-menu,
.export-dropdown{
  position:absolute;
  top:calc(100% + 8px);
  right:0;
  z-index:3000;
  min-width:280px;
  max-width:min(420px,calc(100vw - 24px));
  border:1px solid var(--border);
  border-radius:var(--radius-md);
  background:var(--surface);
  box-shadow:var(--shadow-popout);
}
.global-search-results[hidden]{display:none}
.global-search-results a,
.notif-item,
.avatar-menu a,
.avatar-menu button,
.export-dropdown a{
  display:block;
  width:100%;
  padding:11px 14px;
  color:var(--text);
  text-align:left;
  text-decoration:none;
  border:0;
  background:transparent;
}
.global-search-results a:hover,
.global-search-result.active,
.notif-item:hover,
.avatar-menu a:hover,
.avatar-menu button:hover,
.export-dropdown a:hover{background:var(--surface-soft)}
.global-search-result{
  display:grid!important;
  grid-template-columns:28px minmax(0,1fr);
  gap:10px;
  align-items:center;
}
.global-search-result b,
.global-search-result small{display:block;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.global-search-result small{margin-top:2px;color:var(--text-muted);font-size:12px}
.global-search-more{
  border-top:1px solid var(--border)!important;
  color:var(--accent)!important;
  font-weight:700;
}
.bell-wrap,.avatar-wrap,.dropdown-wrap{position:relative}
.avatar-wrap{
  display:flex;
  align-items:center;
  gap:4px;
}
.bell,
.avatar-btn,
.icon-btn,
.loc-icon-btn,
.mini-btn,
.vs-action,
.mobile-menu-trigger{
  width:40px;
  height:40px;
  display:inline-grid;
  place-items:center;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  background:var(--surface);
  color:var(--text);
  box-shadow:none;
  text-decoration:none;
  transition:background .15s ease,border-color .15s ease,color .15s ease;
}
.bell:hover,
.avatar-btn:hover,
.icon-btn:hover,
.loc-icon-btn:hover,
.mini-btn:hover,
.vs-action:hover,
.mobile-menu-trigger:hover{background:var(--surface-soft)}
.icon-btn.danger{
  border-color:var(--danger-soft);
  background:var(--danger-soft);
  color:var(--danger);
}
.bell{position:relative;font-size:0}
.bell::before{
  content:"";
  width:15px;
  height:15px;
  border:1.7px solid currentColor;
  border-bottom-width:2.2px;
  border-radius:10px 10px 7px 7px;
  box-sizing:border-box;
}
.bell::after{
  content:"";
  position:absolute;
  top:25px;
  width:5px;
  height:2px;
  border-radius:999px;
  background:currentColor;
}
.bell b{
  position:absolute;
  top:-5px;
  right:-5px;
  min-width:16px;
  height:16px;
  display:grid;
  place-items:center;
  border-radius:999px;
  background:var(--danger);
  color:#fff;
  font-size:10px;
}
.avatar-btn{
  overflow:hidden;
  border-radius:999px;
  background:var(--accent-soft);
}
.avatar-btn img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center;
}
.avatar-btn span{
  color:var(--accent);
  font-weight:700;
}
.avatar-menu-trigger{
  width:28px;
  height:40px;
  display:inline-grid;
  place-items:center;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  background:var(--surface);
  color:var(--text-muted);
  transition:background .15s ease,border-color .15s ease,color .15s ease;
}
.avatar-menu-trigger:hover{
  background:var(--surface-soft);
  color:var(--text);
}
.avatar-menu-trigger::before{
  content:"";
  width:7px;
  height:7px;
  margin-top:-4px;
  border-right:1.6px solid currentColor;
  border-bottom:1.6px solid currentColor;
  transform:rotate(45deg);
}
.notif-dropdown,
.avatar-menu,
.export-dropdown{display:none}
.bell-wrap.open .notif-dropdown,
.avatar-wrap.open .avatar-menu,
.dropdown-wrap.open .export-dropdown,
.notif-dropdown.open,
.avatar-menu.open,
.export-dropdown.open{display:block}
.notif-head{
  padding:14px;
  border-bottom:1px solid var(--border);
}
.notif-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}
.notif-head a,
.link-accent{color:var(--accent);text-decoration:none;font-weight:500}
.notif-item span{display:block;font-weight:600}
.notif-item,
.avatar-menu a,
.avatar-menu button,
.export-dropdown a{white-space:normal}
.notif-item small,
.empty-note{display:block;color:var(--text-muted);font-size:12px}
.notif-item.unread{background:var(--accent-soft)}
.avatar-menu form{margin:0}
.avatar-menu{
  width:286px;
  min-width:286px;
  padding:6px;
  overflow:hidden;
  font-size:13px;
  line-height:1.25;
}
.avatar-menu-head{
  display:flex;
  align-items:center;
  gap:10px;
  min-width:0;
  padding:8px 8px 10px;
  border-bottom:1px solid var(--border);
}
.avatar-menu-head > div{min-width:0}
.avatar-menu-head b,
.avatar-menu-links b,
.avatar-menu-logout b{
  display:block;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:13px;
  line-height:1.2;
  font-weight:650;
}
.avatar-menu-head small{
  display:block;
  margin-top:2px;
  color:var(--text-muted);
  font-size:12px;
  line-height:1.3;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.avatar-menu-thumb{
  width:38px;
  height:38px;
  flex:0 0 38px;
  display:grid;
  place-items:center;
  border-radius:999px;
  overflow:hidden;
  background:var(--accent-soft);
  color:var(--accent);
  font-weight:800;
}
.avatar-menu-thumb img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center;
}
.avatar-menu-links{
  display:grid;
  gap:2px;
  padding:6px 0;
  border-bottom:1px solid var(--border);
}
.avatar-menu-links a,
.avatar-menu-links button,
.avatar-menu-logout{
  display:flex;
  align-items:center;
  gap:10px;
  min-height:38px;
  padding:9px 8px;
  border-radius:var(--radius-sm);
  font-size:13px;
  line-height:1.2;
}
.avatar-menu-links form{display:block}
.avatar-menu-links button{
  font:inherit;
  cursor:pointer;
}
.avatar-menu-icon{
  width:22px;
  height:22px;
  flex:0 0 22px;
  display:grid;
  place-items:center;
  border:1px solid var(--border);
  border-radius:6px;
  color:var(--text-muted);
  font:700 12px/1 var(--font);
  line-height:1;
}
.avatar-menu-icon .icon{
  width:14px;
  height:14px;
}
.sr-only{
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0;
}
.avatar-menu-version{
  display:block;
  padding:9px 8px 7px;
  color:var(--text-muted);
  font-size:11px;
  border-bottom:1px solid var(--border);
}
.avatar-menu-logout{
  margin-top:6px;
  color:var(--danger)!important;
  text-decoration:none;
}
.visually-hidden-file{
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0 0 0 0);
  white-space:nowrap;
  border:0;
}
.danger-link{color:var(--danger)!important}
.test-version-banner{
  grid-column:1/-1;
  margin:0 -32px;
  padding:10px 32px;
  border-top:1px solid #f0dfcf;
  background:#fbefe4;
  color:#6b421f;
  text-align:center;
  font-weight:650;
}

.flashwrap{
  position:fixed;
  z-index:360;
  left:50%;
  top:calc(env(safe-area-inset-top, 0px) + 18px);
  width:min(560px, calc(100vw - 32px));
  display:grid;
  gap:10px;
  padding:0;
  pointer-events:none;
  transform:translateX(-50%);
}
.has-session .flashwrap{
  top:calc(env(safe-area-inset-top, 0px) + var(--topbar-h) + 52px);
}
.flash{
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:12px;
  min-height:52px;
  padding:11px 12px 11px 14px;
  border:1px solid var(--border);
  border-radius:14px;
  background:var(--surface);
  color:var(--text);
  box-shadow:var(--shadow-card);
  pointer-events:auto;
  animation:flashSlideIn .18s ease-out;
}
.flash-icon{
  width:30px;
  height:30px;
  display:grid;
  place-items:center;
  border-radius:999px;
  background:var(--accent-soft);
  color:var(--accent);
}
.flash-icon .icon{width:17px;height:17px}
.flash-message{
  min-width:0;
  color:var(--text);
  font-size:14px;
  line-height:1.35;
  font-weight:650;
  overflow-wrap:anywhere;
}
.flash-close{
  width:30px;
  height:30px;
  display:grid;
  place-items:center;
  border:1px solid transparent;
  border-radius:10px;
  background:transparent;
  color:var(--text-muted);
  cursor:pointer;
  transition:background .15s ease,color .15s ease,border-color .15s ease;
}
.flash-close:hover{
  border-color:var(--border);
  background:var(--surface-soft);
  color:var(--text);
}
.flash-close .icon{width:16px;height:16px}
.flash.success{border-color:var(--success-soft)}
.flash.success .flash-icon{background:var(--success-soft);color:var(--success)}
.flash.warning{border-color:var(--warning-soft)}
.flash.warning .flash-icon{background:var(--warning-soft);color:var(--warning)}
.flash.danger{border-color:var(--danger-soft)}
.flash.danger .flash-icon{background:var(--danger-soft);color:var(--danger)}
.flash.info{border-color:var(--accent-soft)}
.flash.info .flash-icon{background:var(--accent-soft);color:var(--accent)}
.flash.is-dismissing{
  opacity:0;
  transform:translateY(-8px);
  transition:opacity .2s ease, transform .2s ease;
}
@keyframes flashSlideIn{
  from{opacity:0;transform:translateY(-8px)}
  to{opacity:1;transform:translateY(0)}
}
@media (max-width:720px){
  .flashwrap{
    top:calc(env(safe-area-inset-top, 0px) + 12px);
    width:calc(100vw - 20px);
  }
  .has-session .flashwrap{
    top:calc(env(safe-area-inset-top, 0px) + var(--topbar-h) + 46px);
  }
  .flash{
    grid-template-columns:auto minmax(0,1fr) auto;
    min-height:48px;
    padding:10px;
    border-radius:12px;
  }
  .flash-message{font-size:13px}
}

.page,
.vs-page,
.employees-page,
.locations-page,
.access-users-page{
  width:100%;
  max-width:1280px;
  margin:0 auto;
  padding:32px;
}
.narrow{
  width:100%;
  max-width:720px;
  margin-left:auto;
  margin-right:auto;
}
.card.narrow,
section.narrow{
  margin:32px auto 0;
}
.prose{
  max-width:820px;
  line-height:1.7;
}
.prose h1,
.prose h2,
.prose h3{
  margin-top:0;
  line-height:1.2;
}
.prose p,
.prose ul,
.prose ol{
  margin:0 0 14px;
}
.prose :last-child{margin-bottom:0}
.settings-form-narrow{
  width:100%;
  max-width:560px;
}
.settings-page .settings-layout{
  display:grid;
  grid-template-columns:minmax(190px,260px) minmax(0,1fr);
  gap:22px;
  align-items:start;
}
.settings-page .settings-nav{
  position:sticky;
  top:92px;
  display:grid;
  gap:4px;
  padding:10px;
  align-self:start;
}
.settings-page .settings-nav a{
  min-height:42px;
  display:flex;
  align-items:center;
  padding:0 14px;
  border-radius:var(--radius-sm);
  color:var(--text-muted);
  text-decoration:none;
  font-weight:650;
}
.settings-page .settings-nav a:hover,
.settings-page .settings-nav a:focus-visible{
  background:var(--surface-soft);
  color:var(--text);
}
.settings-page .settings-nav a:target,
.settings-page .settings-nav a.active{
  background:var(--accent-soft);
  color:var(--accent);
}
.settings-page .settings-content{
  grid-template-columns:1fr;
  gap:18px;
  min-width:0;
}
.settings-page .settings-card{
  min-width:0;
  overflow:hidden;
}
.settings-page .settings-card .section-head{
  align-items:flex-start;
}
.settings-page .settings-form-narrow{
  max-width:520px;
}
.settings-page label.password-field{
  position:relative;
  display:grid;
  gap:8px;
}
.settings-page label.password-field input{
  padding-right:48px;
}
.settings-page label.password-field .password-eye{
  right:8px;
  bottom:8px;
}
.main > .card,
.main > .page-head,
.main > .settings-page,
.main > .changelog-timeline,
.main > .mobile-agenda,
.main > .mobile-month-toggle,
.main > .calendar-card,
.main > .schedule-draft-panel{
  width:calc(100% - 64px);
  max-width:1280px;
  margin:32px auto 0;
}
.main > .changelog-timeline{margin-top:18px}
.main > .calendar-card{margin-top:18px}
.main > .card.narrow,
.main > section.narrow{
  width:min(720px,calc(100% - 64px));
  max-width:720px;
}
.main > .card.prose{
  width:min(820px,calc(100% - 64px));
  max-width:820px;
}
.page-head,
.vs-page-header,
.section-head,
.locations-header,
.employee-editor-head,
.employee-profile-hero,
.panel-head,
.vs-card-header,
.employee-profile-section-head,
.card-header{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:18px;
}
.page-title,
.vs-page-header h1,
.page-head h1,
.page-head h2,
.locations-title h1,
.employee-profile-hero h1,
.employee-editor-head h1{
  margin:0 0 8px;
  color:var(--text);
  font-size:32px;
  line-height:1.1;
  font-weight:720;
  letter-spacing:0;
}
h1,h2,h3,p{
  overflow-wrap:break-word;
  word-break:normal;
}
h1{font-size:32px;line-height:1.1;letter-spacing:0}
h2{font-size:20px;line-height:1.25;letter-spacing:0}
h3{font-size:16px;line-height:1.3;letter-spacing:0}
.page-subtitle,
.vs-page-header p,
.page-head p,
.section-head p,
.locations-title p,
.panel-head p,
.vs-card-header p,
.employee-profile-section-head p{
  margin:0;
  color:var(--text-muted);
}

.card,
.vs-card,
.page-card,
.table-card,
.calendar-card,
.metric,
.stat,
.panel,
.request-card,
.notification-card,
.loc-stat,
.loc-access-card,
.locations-table-card,
.users-create-card,
.setting-row,
.setting-mini,
.settings-nav,
.form-section,
.employee-profile-section,
.employee-profile-hero,
.employee-editor-section,
.plan-info-card,
.payment-public-card,
.invoice-view,
.invoice-paper,
.ops-task-card,
.schedule-draft-panel,
.vs-kpi-card,
.vs-kpi,
.mobile-day-card{
  position:relative;
  width:100%;
  min-width:0;
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  background:var(--surface);
  box-shadow:var(--shadow-card);
}
.card,
.vs-card,
.page-card,
.table-card,
.calendar-card,
.panel,
.locations-table-card,
.loc-access-card,
.employee-profile-section,
.employee-profile-hero,
.employee-editor-section,
.payment-public-card,
.invoice-view,
.invoice-paper,
.schedule-draft-panel{padding:22px}
.card + .card,
.vs-card + .vs-card,
.page-card + .page-card,
.table-card + .table-card{margin-top:18px}
.card-header,
.vs-card-header{
  margin:-22px -22px 22px;
  padding:18px 22px;
  border-bottom:1px solid var(--border);
}
.card-body{padding:22px}
.vs-card-footer,
.card-footer,
.modal-actions,
.form-actions,
.actions{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:10px;
  min-width:0;
}
.actions > *,
.row-actions > *,
.loc-actions > *,
.doc-actions > *{min-width:0}
.vs-card-footer,
.card-footer{
  margin:22px -22px -22px;
  padding:16px 22px;
  border-top:1px solid var(--border);
}

.vs-grid,
.dashboard-main-grid,
.dashboard-secondary-grid,
.grid,
.settings-grid,
.settings-content,
.cards,
.ops-card-list{
  display:grid;
  gap:16px;
}
.dashboard-main-grid,
.vs-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.dashboard-secondary-grid{grid-template-columns:1.25fr .9fr}
.grid2,
.loc-form-grid,
.request-detail-grid,
.payment-summary{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.grid3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.grid4,.super-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.full,.vs-field-full{grid-column:1/-1}
.vs-grid > *,
.dashboard-main-grid > *,
.dashboard-secondary-grid > *,
.grid > *,
.grid2 > *,
.grid3 > *,
.grid4 > *,
.settings-grid > *,
.settings-content > *,
.cards > *,
.ops-card-list > *,
.stats-grid > *,
.vs-kpi-grid > *,
.stats > *,
.loc-stats > *,
.employee-profile-stats > *,
.attendance-confirm-grid > *,
.ops-stats > *,
.vs-req-kpis > *{min-width:0}

.stats-grid,
.vs-kpi-grid,
.stats,
.loc-stats,
.employee-profile-stats,
.attendance-confirm-grid,
.ops-stats,
.vs-req-kpis{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:16px;
}
.vs-kpi-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
.vs-kpi-grid > :last-child:nth-child(5){grid-column:1/-1}
/* KPI standard: prefer .vs-kpi-card for new cards; legacy .stat/.metric/.loc-stat/.vs-kpi remain for existing pages. */
.vs-kpi-card,
.vs-kpi,
.metric,
.stat,
.loc-stat{
  min-height:118px;
  padding:20px;
}
.stat-label,
.vs-kpi-card span,
.vs-kpi span,
.metric span,
.stat span,
.loc-stat span{
  display:block;
  color:var(--text-muted);
  font-size:14px;
  font-weight:500;
}
.stat-value,
.vs-kpi-card strong,
.vs-kpi strong,
.metric b,
.stat strong,
.loc-stat strong{
  display:block;
  margin-top:8px;
  color:var(--text);
  font-size:28px;
  line-height:1.05;
  font-weight:720;
  letter-spacing:0;
}
.vs-kpi-card small,
.vs-kpi small,
.metric small,
.stat small,
.loc-stat small{
  display:block;
  margin-top:10px;
  color:var(--success);
  font-size:13px;
}

/* Button system: use .btn with .primary/.secondary/.danger/.small modifiers. */
.btn,
.add-btn,
.loc-add-btn,
.mini-btn,
.page-btn,
.loc-page-btn,
.user-page-btn,
button.btn,
a.btn{
  min-height:40px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:0 16px;
  border:1px solid var(--border-strong);
  border-radius:var(--radius-sm);
  background:#fff;
  color:var(--text);
  box-shadow:none;
  text-decoration:none;
  font-weight:500;
  line-height:1;
  white-space:nowrap;
  transition:background .15s ease,border-color .15s ease,color .15s ease,box-shadow .15s ease;
}
.btn:hover,
.add-btn:hover,
.loc-add-btn:hover,
.page-btn:hover,
.loc-page-btn:hover,
.user-page-btn:hover{background:var(--surface-soft)}
.btn.primary,
.add-btn,
.loc-add-btn{
  border-color:var(--accent);
  background:var(--accent);
  color:#fff;
}
.btn.primary:hover,
.add-btn:hover,
.loc-add-btn:hover{background:#6829f0;border-color:#6829f0}
.btn.secondary{background:#fff;color:var(--text)}
.btn.danger,
.mini-btn.reset{
  border-color:var(--danger);
  background:var(--danger);
  color:#fff;
}
.btn.danger:hover,
.mini-btn.reset:hover{background:#c62d3b}
.btn.small,
.mini-btn{
  min-height:32px;
  padding:0 10px;
  font-size:12px;
}
.page-btn,
.loc-page-btn,
.user-page-btn{
  min-width:36px;
  width:36px;
  padding:0;
}
.page-btn.active,
.loc-page-btn.active,
.user-page-btn.active{
  border-color:var(--accent);
  background:var(--accent-soft);
  color:var(--accent);
}
.icon-btn svg,
.loc-icon-btn svg,
.mini-btn svg{width:17px;height:17px}

.badge,
.status,
.loc-status,
.priority-high,
.priority-medium,
.priority-low,
.priority-urgent,
.status-pending,
.status-approved,
.status-rejected,
.status-paid,
.status-unpaid,
.status-archived,
.status-active,
.status-inactive{
  min-height:24px;
  display:inline-flex;
  align-items:center;
  width:max-content;
  max-width:100%;
  padding:0 9px;
  border-radius:6px;
  border:0;
  background:var(--surface-soft);
  color:var(--text-muted);
  font-size:12px;
  font-weight:500;
  line-height:1;
  white-space:nowrap;
}
.badge.work,
.badge.success,
.badge-success,
.status-active,
.status-approved,
.status-paid,
.loc-status-active,
.approved,
.paid{background:var(--success-soft);color:var(--success)}
.badge.off,
.badge-accent,
.status-pending,
.status-new,
.priority-medium,
.pending{background:var(--accent-soft);color:var(--accent)}
.status-rejected,
.status-cancelled,
.badge.danger,
.danger-badge,
.priority-urgent,
.rejected,
.unpaid{background:var(--danger-soft);color:var(--danger)}
.status-inactive,
.status-archived,
.status-disabled,
.archived{background:var(--surface-soft);color:var(--text-muted)}
.priority-high,
.loc-status-paused{background:var(--warning-soft);color:var(--warning)}
.badge.soft{background:var(--surface-soft);color:var(--text-muted)}

form{margin:0}
.form,
.vs-form,
.employee-editor-form,
.appearance-form,
.settings-form-narrow,
.notification-settings-form{
  display:grid;
  gap:16px;
}
.vs-form-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:16px;
}
.vs-form-footer{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  flex-wrap:wrap;
  gap:10px;
  margin-top:6px;
}
.vs-inline-form{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:10px;
  margin-top:14px;
}
.vs-notice{
  margin:0;
  padding:12px 14px;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  background:var(--surface-soft);
  color:var(--text-muted);
}
.vs-link-list{
  display:grid;
  gap:8px;
}
.vs-link-list a{
  min-height:42px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:0 12px;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  color:var(--text);
  text-decoration:none;
  background:#fff;
}
.vs-link-list a:hover,
.vs-link-list a:focus-visible{
  border-color:var(--accent);
  background:var(--accent-soft);
  color:var(--accent);
}
label,
.field,
.vs-field,
.setting-control{
  display:grid;
  gap:7px;
  color:var(--text);
  font-weight:600;
}
label span,
.label,
.vs-label{
  color:var(--text-muted);
  font-size:13px;
  font-weight:500;
}
input,
select,
textarea,
.input,
.vs-control input,
.vs-control select,
.vs-field input,
.vs-field select,
.vs-field textarea,
.form input,
.form select,
.form textarea,
.employee-editor-form input,
.employee-editor-form select,
.employee-editor-form textarea{
  width:100%;
  min-height:42px;
  border:1px solid var(--border-strong);
  border-radius:var(--radius-sm);
  padding:0 12px;
  color:var(--text);
  background:#fff;
  box-shadow:none;
  outline:0;
}
textarea{
  min-height:108px;
  padding:10px 12px;
  resize:vertical;
}
input::placeholder,
textarea::placeholder{color:var(--text-soft)}
input:focus,
select:focus,
textarea:focus,
.input:focus-within{
  border-color:var(--accent);
  outline:0;
  box-shadow:0 0 0 3px rgb(var(--accent-rgb) / .16);
}
input[type="checkbox"],
input[type="radio"]{
  width:18px;
  min-width:18px;
  height:18px;
  min-height:18px;
  padding:0;
  accent-color:var(--accent);
}
select{
  appearance:none;
  background-image:linear-gradient(45deg,transparent 50%,var(--text-muted) 50%),linear-gradient(135deg,var(--text-muted) 50%,transparent 50%);
  background-position:calc(100% - 18px) 18px,calc(100% - 12px) 18px;
  background-size:6px 6px;
  background-repeat:no-repeat;
  padding-right:34px;
}
.input{
  display:flex;
  align-items:center;
  gap:8px;
}
.input svg{flex:0 0 18px;color:var(--text-muted)}
.input input{
  min-height:0;
  padding:0;
  border:0;
  outline:0;
  background:transparent;
}
.form-section{
  padding:18px;
  display:grid;
  gap:14px;
}
.segmented,
.tabs,
.checks.inline,
.shift-presets,
.choice-row,
.choice-cards,
.mode-grid,
.theme-grid,
.vs-choice-grid,
.vs-choice-row{
  display:flex;
  flex-wrap:wrap;
  gap:0;
}
.choice-row,
.choice-cards,
.mode-grid,
.theme-grid,
.vs-choice-grid,
.vs-choice-row{
  gap:10px;
}
.segmented,
.tabs{
  width:max-content;
  max-width:100%;
  border:1px solid var(--border);
  border-radius:0;
  overflow:hidden;
}
.segmented label,
.tab,
.tabs a{
  min-height:40px;
  display:flex;
  align-items:center;
  gap:8px;
  padding:0 16px;
  border-right:1px solid var(--border);
  color:var(--text-muted);
  background:#fff;
  text-decoration:none;
  font-weight:500;
}
.segmented label:last-child,
.tab:last-child,
.tabs a:last-child{border-right:0}
.segmented label:has(input:checked),
.tab.active,
.tabs a.active{
  background:var(--accent-soft);
  color:var(--accent);
}
.checks,
.employee-pick{
  display:grid;
  gap:10px;
}
.check,
.employee-pick label,
.vs-choice{
  display:flex;
  align-items:flex-start;
  gap:10px;
  min-width:0;
  padding:12px;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  background:#fff;
}
.employee-pick{
  grid-template-columns:repeat(3,minmax(0,1fr));
  max-height:360px;
  overflow:auto;
  overflow-x:hidden;
}
.employee-pick small,
.check small{display:block;color:var(--text-muted);font-weight:400}
.employee-pick-main{
  min-width:0;
  display:grid;
  gap:3px;
  line-height:1.35;
}
.employee-pick-main b,
.employee-pick-main small{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.table,
table{
  width:100%;
  border-collapse:collapse;
  table-layout:auto;
}
.table-card{overflow:hidden}
.table-card table{min-width:720px}
th,
.thead>div,
.table .th{
  text-align:left;
  color:var(--text-soft);
  font:600 12px/1.2 var(--mono);
  letter-spacing:.12em;
  text-transform:uppercase;
  padding:14px 18px;
  border-bottom:1px solid var(--border);
}
td,
.row>div,
.table .td{
  min-width:0;
  padding:18px;
  border-bottom:1px solid var(--border);
  font-size:14px;
}
tr:last-child td,
.row:last-child>div{border-bottom:0}
.thead,
.row{
  display:grid;
  align-items:center;
}
.employees-page .thead,
.employees-page .row{grid-template-columns:1.55fr 1.1fr 1.1fr 1fr .8fr auto}
.access-users-page .thead,
.access-users-page .access-user-row{grid-template-columns:1.4fr 1fr .8fr .8fr auto}
.locations-table-card .loc-thead,
.locations-table-card .loc-row{
  display:grid;
  grid-template-columns:minmax(180px,1.3fr) minmax(160px,1fr) minmax(92px,.65fr) minmax(92px,.65fr) minmax(150px,.9fr) minmax(104px,.6fr) auto;
  align-items:center;
}
.person,
.vs-list-main,
.loc-main{
  display:flex;
  align-items:center;
  gap:12px;
  min-width:0;
}
/* Avatar system: initials use accent-soft/accent; image avatars fill the same shell. */
.avatar,
.mini-avatar{
  width:36px;
  height:36px;
  display:grid;
  place-items:center;
  flex:0 0 36px;
  border-radius:999px;
  background:var(--accent-soft);
  color:var(--accent);
  font-weight:700;
  overflow:hidden;
}
.avatar img,
.mini-avatar img{width:100%;height:100%;object-fit:cover}
.loc-thead{
  padding:0 18px;
  border-bottom:1px solid var(--border);
}
.loc-thead > div{
  padding:14px 0;
  color:var(--text-soft);
  font:600 12px/1.2 var(--mono);
  letter-spacing:.12em;
  text-transform:uppercase;
}
.loc-main-cell,
.loc-owner,
.user-cell,
.employee-link{
  min-width:0;
  display:flex;
  align-items:center;
  gap:12px;
}
.loc-main-cell > div:last-child,
.loc-owner > div:last-child,
.user-cell > div:last-child,
.employee-link > div:last-child{min-width:0}
.loc-thumb,
.loc-owner-avatar{
  width:36px;
  height:36px;
  flex:0 0 36px;
  display:grid;
  place-items:center;
  overflow:hidden;
  border-radius:999px;
  background:var(--accent-soft);
  color:var(--accent);
  font-weight:700;
}
.loc-thumb img{width:100%;height:100%;object-fit:cover}
.person strong,
.role strong,
.site strong,
.vs-list-main h3,
.loc-main-cell strong,
.loc-address strong,
.loc-owner strong,
.user-cell strong,
.employee-link strong,
.loc-main strong{
  min-width:0;
  display:block;
  color:var(--text);
  font-weight:650;
}
.person span,
.role span,
.site span,
.shift span,
.vs-list-main p,
.loc-main-cell span,
.user-cell span,
.employee-link span,
.loc-main span{
  min-width:0;
  display:block;
  color:var(--text-muted);
  font-size:13px;
}
.loc-type{
  display:inline-flex;
  align-items:center;
  min-height:24px;
  width:max-content;
  max-width:100%;
  padding:0 9px;
  border-radius:6px;
  background:var(--surface-soft);
  color:var(--text-muted);
  font-size:12px;
  font-weight:500;
  white-space:nowrap;
}
.loc-empty{padding:36px 22px;color:var(--text-muted);text-align:center}
.loc-control{width:auto;min-width:150px}
.pagination,
.loc-pagination,
.user-pagination,
.vs-pagination,
.list-pagination{
  min-height:56px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:14px 18px;
  border-top:1px solid var(--border);
}
.pages,
.loc-page-buttons,
.user-page-buttons,
.list-page-buttons{display:flex;align-items:center;gap:6px}
.list-page-btn{
  min-width:34px;
  min-height:34px;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  background:#fff;
  color:var(--text);
  font-weight:600;
}
.list-page-btn.active{
  border-color:var(--accent);
  background:var(--accent-soft);
  color:var(--accent);
}
.list-page-ellipsis{
  min-width:34px;
  min-height:34px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:var(--text-muted);
  font-weight:700;
  white-space:nowrap;
}
nav.list-pagination{
  justify-content:center;
  gap:8px;
}
.document-pagination,
.audit-pagination{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto minmax(130px,max-content);
  align-items:center;
  gap:14px;
}
.document-pagination>span,
.audit-pagination>span{
  justify-self:start;
}
.document-pagination .list-page-buttons,
.audit-pagination .list-page-buttons{
  justify-self:center;
}
.document-pagination .list-rows-select,
.audit-pagination .list-rows-select{
  justify-self:end;
}
.leave-register-card{
  overflow:visible;
  padding:22px;
}
.leave-register-table{
  width:100%;
  min-width:0;
  display:grid;
  border:1px solid var(--border);
  border-radius:10px;
  overflow-x:auto;
  overflow-y:hidden;
  -webkit-overflow-scrolling:touch;
  background:var(--surface);
  scrollbar-gutter:stable;
  isolation:isolate;
}
.leave-register-row{
  min-width:1660px;
  display:grid;
  grid-template-columns:96px 250px 165px 126px 126px 136px 178px 210px 185px 276px 112px;
  align-items:center;
  border-bottom:1px solid var(--border);
}
.leave-register-row:last-child{
  border-bottom:0;
}
.leave-register-head{
  background:var(--surface-soft);
}
.leave-register-head>div{
  padding:14px 12px;
  color:var(--text-soft);
  font:600 11px/1.2 var(--mono);
  letter-spacing:.08em;
  text-transform:uppercase;
}
.leave-register-cell{
  min-width:0;
  padding:14px 12px;
  font-size:13px;
  line-height:1.35;
  color:var(--text);
}
.leave-register-row:not(.leave-register-head):hover{
  background:color-mix(in srgb, var(--surface-soft) 62%, transparent);
}
.leave-register-cell small,
.leave-register-cell .muted{
  display:block;
  color:var(--text-muted);
}
.leave-register-cell strong,
.leave-register-cell small,
.creator-cell,
.type-cell,
.document-cell{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
}
.leave-register-cell strong,
.creator-cell,
.type-cell,
.document-cell{
  white-space:nowrap;
}
.mono-cell,
.date-cell{
  color:var(--text-muted);
  font-family:var(--mono);
  font-size:12px;
}
.id-cell{
  min-width:max-content;
  overflow:visible;
  text-overflow:clip;
  white-space:nowrap;
  font-variant-numeric:tabular-nums;
}
.comment-cell{
  color:var(--text-soft);
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  white-space:normal;
  overflow:hidden;
  text-overflow:ellipsis;
}
.comment-cell[data-open-context]{
  cursor:pointer;
}
.comment-cell[data-open-context]:hover{
  color:var(--text);
}
.actions-cell{
  display:flex;
  justify-content:center;
  align-items:center;
}
.actions-cell .btn{
  white-space:nowrap;
}
.leave-register-row>div:last-child,
.document-register-row>div:last-child,
.audit-register-row>div:last-child{
  position:sticky;
  right:0;
  z-index:2;
  background-color:var(--surface);
  background-clip:padding-box;
  border-left:1px solid var(--border-strong);
  box-shadow:-18px 0 24px -18px rgb(15 23 42 / .55);
}
.leave-register-head>div:last-child,
.document-register-head>div:last-child,
.audit-register-head>div:last-child{
  z-index:3;
  background-color:var(--surface-soft);
}
.leave-register-row:not(.leave-register-head):hover>div:last-child,
.document-register-row:not(.document-register-head):hover>div:last-child,
.audit-register-row:not(.audit-register-head):hover>div:last-child{
  background-color:color-mix(in srgb, var(--surface-soft) 62%, white);
}
.badge.leave-status-approved{background:var(--success-soft);color:var(--success)}
.badge.leave-status-pending{background:var(--warning-soft);color:var(--warning)}
.badge.leave-status-rejected{background:var(--danger-soft);color:var(--danger)}
.badge.leave-status-cancelled{background:var(--surface-soft);color:var(--text-soft)}
.badge.leave-status-archived{background:color-mix(in srgb, var(--surface-soft) 72%, white);color:var(--text-muted)}
.document-register-card,
.audit-register-card{
  overflow:visible;
  padding:22px;
}
.document-register-table,
.audit-register-table{
  width:100%;
  min-width:0;
  display:grid;
  border:1px solid var(--border);
  border-radius:10px;
  overflow-x:auto;
  overflow-y:hidden;
  -webkit-overflow-scrolling:touch;
  background:var(--surface);
  scrollbar-gutter:stable;
  isolation:isolate;
}
.document-register-row,
.audit-register-row{
  display:grid;
  align-items:center;
  border-bottom:1px solid var(--border);
}
.document-register-row{
  min-width:1720px;
  grid-template-columns:96px 292px 210px 150px 145px 138px 180px 220px 220px 116px;
}
.audit-register-row{
  min-width:1585px;
  grid-template-columns:166px 220px 118px 128px 235px 140px 190px 272px 116px;
}
.document-register-row:last-child,
.audit-register-row:last-child{
  border-bottom:0;
}
.document-register-head,
.audit-register-head{
  background:var(--surface-soft);
}
.document-register-head>div,
.audit-register-head>div{
  padding:14px 12px;
  color:var(--text-soft);
  font:600 11px/1.2 var(--mono);
  letter-spacing:.08em;
  text-transform:uppercase;
}
.document-register-cell,
.audit-register-cell{
  min-width:0;
  padding:14px 12px;
  font-size:13px;
  line-height:1.35;
  color:var(--text);
}
.document-register-row:not(.document-register-head):hover,
.audit-register-row:not(.audit-register-head):hover{
  background:color-mix(in srgb, var(--surface-soft) 62%, transparent);
}
.document-name-cell{
  display:flex;
  align-items:center;
  gap:10px;
}
.document-name-cell>div{
  min-width:0;
}
.document-name-cell strong,
.document-name-cell small,
.audit-register-cell strong,
.user-cell,
.action-cell,
.object-cell,
.details-cell{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
}
.document-name-cell strong,
.audit-register-cell strong,
.user-cell,
.action-cell,
.object-cell,
.details-cell{
  white-space:nowrap;
}
.document-name-cell small{
  display:block;
  color:var(--text-muted);
}
.details-cell{
  color:var(--text-soft);
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  white-space:normal;
  overflow:hidden;
}
.badge.doc-status-signed{background:var(--success-soft);color:var(--success)}
.badge.doc-status-draft{background:var(--warning-soft);color:var(--warning)}
.badge.doc-status-revoked{background:var(--danger-soft);color:var(--danger)}
.badge.doc-status-archived{background:var(--surface-soft);color:var(--text-muted)}
.badge.audit-module-badge{
  background:var(--accent-soft);
  color:var(--accent);
}
.leave-register-table::-webkit-scrollbar,
.document-register-table::-webkit-scrollbar,
.audit-register-table::-webkit-scrollbar{height:10px}
.leave-register-table::-webkit-scrollbar-track,
.document-register-table::-webkit-scrollbar-track,
.audit-register-table::-webkit-scrollbar-track{background:var(--surface-soft)}
.leave-register-table::-webkit-scrollbar-thumb,
.document-register-table::-webkit-scrollbar-thumb,
.audit-register-table::-webkit-scrollbar-thumb{background:var(--border-strong);border-radius:999px}
.rows-select,
.loc-rows-select,
.user-rows-select,
.list-rows-select{width:auto;min-width:130px}
.empty,
.vs-empty-state,
.empty-state{
  padding:36px 22px;
  border:1px dashed var(--border-strong);
  border-radius:var(--radius-md);
  color:var(--text-muted);
  text-align:center;
}
.muted{color:var(--text-muted)}
.context-section{
  margin-top:16px;
  padding-top:14px;
  border-top:1px solid var(--border);
}
.context-section h3{
  margin:0 0 10px;
  color:var(--text-soft);
  font-size:13px;
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase;
}
.context-section p{
  margin:4px 0 0;
  color:var(--text-muted);
}
.audit-entry-detail,
.document-signature-summary,
.document-audit-list{
  min-width:0;
}
.mini-list{
  display:grid;
  gap:8px;
}
.mini-list > *{
  min-width:0;
}

.vs-list,
.activity-list{display:grid;min-width:0}
.compact-filters{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(160px,1fr));
  gap:10px;
  align-items:end;
}
.list-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:14px;
  align-items:center;
  padding:14px 0;
  border-bottom:1px solid var(--border);
  min-width:0;
}
.list-row:last-child{border-bottom:0}
.list-main{min-width:0}
.list-title-line{display:flex;align-items:center;gap:8px;flex-wrap:wrap;min-width:0}
.list-title-line .person-link{max-width:100%;text-align:left}
.list-main p,
.list-main small{margin:3px 0 0;color:var(--text-muted);word-break:normal;overflow-wrap:break-word}
.badge.signed{background:var(--accent-soft);color:var(--accent)}
.activity-item,
.notif-row,
.request-row{
  display:grid;
  grid-template-columns:36px 1fr auto;
  gap:16px;
  align-items:center;
  padding:20px 22px;
  border-bottom:1px solid var(--border);
  color:var(--text);
  text-decoration:none;
}
.vs-list-item{
  width:100%;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:16px;
  align-items:center;
  padding:20px 22px;
  border:0;
  border-bottom:1px solid var(--border);
  background:#fff;
  color:var(--text);
  text-align:left;
  text-decoration:none;
}
.vs-list-item:last-child,
.activity-item:last-child{border-bottom:0}
.vs-list-main{
  display:grid;
  grid-template-columns:36px minmax(0,1fr);
  align-items:center;
  gap:12px;
}
.vs-list-main > div:last-child{min-width:0}
.vs-list-main h3,
.vs-list-main p,
.vs-list-main small{
  margin:0;
  min-width:0;
  white-space:normal;
  word-break:normal;
  overflow-wrap:break-word;
}
.vs-list-main small{display:block;color:var(--text-muted);font-size:12px}
.vs-list-meta{
  min-width:max-content;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  flex-wrap:wrap;
  gap:8px;
  color:var(--text-muted);
  font-size:13px;
}
.vs-list-icon,
.activity-icon{
  width:28px;
  height:28px;
  display:grid;
  place-items:center;
  border-radius:999px;
  background:var(--accent-soft);
  color:var(--accent);
}
.notification-item.unread{background:var(--accent-soft)}

.vs-requests-page,
.requests-page{
  max-width:1280px;
  margin:0 auto;
  padding:32px;
  display:grid;
  gap:18px;
}
.vs-req-toolbar,
.users-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:16px;
}
.vs-req-toolbar p{margin:0;color:var(--text-muted)}
.vs-req-actions,
.toolbar{display:flex;align-items:center;flex-wrap:wrap;gap:10px}
.vs-panel{
  min-width:0;
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  background:#fff;
  box-shadow:var(--shadow-card);
  overflow:hidden;
}
.vs-tabs{
  display:flex;
  flex-wrap:wrap;
  gap:0;
  padding:18px 18px 0;
}
.vs-tab{
  min-height:40px;
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:0 14px;
  border:1px solid var(--border);
  border-right:0;
  background:#fff;
  color:var(--text-muted);
  font-weight:500;
}
.vs-tab:first-child{border-radius:var(--radius-sm) 0 0 var(--radius-sm)}
.vs-tab:last-child{border-right:1px solid var(--border);border-radius:0 var(--radius-sm) var(--radius-sm) 0}
.vs-tab.active{background:var(--accent-soft);color:var(--accent)}
.vs-tabs a.vs-tab{text-decoration:none}
.vs-tabs button.vs-tab{
  font:inherit;
  cursor:pointer;
}
.vs-count{
  display:inline-flex;
  align-items:center;
  min-height:22px;
  padding:0 7px;
  border-radius:5px;
  background:var(--surface-soft);
  color:inherit;
  font-size:12px;
}
.vs-filters{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
  padding:18px;
}
.vs-control{min-width:0}
.vs-req-list{display:grid;border-top:1px solid var(--border)}
.vs-request-card{
  min-width:0;
  display:grid;
  grid-template-columns:minmax(240px,1.25fr) minmax(220px,1fr) minmax(220px,1fr) auto;
  gap:16px;
  align-items:start;
  padding:18px;
  border-bottom:1px solid var(--border);
}
.vs-request-card:last-child{border-bottom:0}
.vs-person,
.vs-info-box{
  min-width:0;
  display:flex;
  align-items:flex-start;
  gap:12px;
}
.vs-person > div:last-child,
.vs-info-box > div:last-child{min-width:0}
.vs-person h3{
  margin:0;
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:8px;
}
.person-link{
  padding:0;
  border:0;
  background:transparent;
  color:inherit;
  font-weight:650;
  text-align:left;
}
.vs-person p,
.vs-person small,
.vs-info-box span,
.vs-conflicts p{
  margin:2px 0 0;
  color:var(--text-muted);
}
.vs-info-box span{
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.vs-conflicts{
  min-width:0;
  display:grid;
  gap:4px;
}
.vs-actions{
  min-width:0;
  display:flex;
  justify-content:flex-end;
  flex-wrap:wrap;
  gap:8px;
}
.vs-action.approve{border-color:var(--success);color:var(--success)}
.vs-action.reject{border-color:var(--danger);color:var(--danger)}
.vs-action.text-action{
  width:auto;
  min-width:0;
  padding:0 12px;
  white-space:nowrap;
  font-size:12px;
}
.choice-card{
  min-width:150px;
  flex:1 1 160px;
  display:flex;
  align-items:center;
  gap:10px;
  padding:12px;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  background:#fff;
}
.notice,
.form-preview{
  min-width:0;
  padding:14px;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  background:var(--surface-soft);
  color:var(--text-muted);
}
.mini-form.stacked{display:grid;gap:12px;padding:18px 22px 22px}
.check-line{
  display:flex;
  align-items:flex-start;
  gap:10px;
  color:var(--text-muted);
  font-size:13px;
  line-height:1.35;
}
.check-line input{margin-top:1px;flex:0 0 18px}
.task-assignee-full-list{display:grid;gap:0;padding:0 22px}
.task-assignee-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:14px 0;
  border-bottom:1px solid var(--border);
}
.tasks-register-page,
.task-workspace-page{
  max-width:1280px;
  margin:0 auto;
  padding:32px;
  display:grid;
  gap:18px;
}
.tasks-register-head,
.task-workspace-hero{
  min-width:0;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:16px;
  padding:22px;
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  background:var(--surface);
  box-shadow:var(--shadow-card);
}
.tasks-register-head h2,
.task-workspace-title h2{
  margin:0;
  font-size:30px;
  line-height:1.1;
}
.tasks-register-head p{margin:6px 0 0;color:var(--text-muted)}
.task-register-stats{margin:0}
.task-register-tabs{
  display:flex;
  align-items:center;
  gap:8px;
  padding:6px;
  border:1px solid var(--border);
  border-radius:var(--radius-md);
  background:var(--surface);
  box-shadow:var(--shadow-card);
  width:max-content;
  max-width:100%;
}
.task-register-tabs a{
  display:inline-flex;
  align-items:center;
  min-height:36px;
  padding:0 14px;
  border-radius:var(--radius-sm);
  color:var(--text-muted);
  text-decoration:none;
  font-weight:700;
  white-space:nowrap;
}
.task-register-tabs a.active{
  background:var(--surface-soft);
  color:var(--text);
  box-shadow:inset 0 0 0 1px var(--border);
}
.tasks-register-panel,
.task-workspace-card{
  min-width:0;
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  background:var(--surface);
  box-shadow:var(--shadow-card);
}
.tasks-register-table-wrap{min-width:0;overflow:auto}
.tasks-register-table{
  width:100%;
  min-width:1180px;
  border-collapse:collapse;
}
.tasks-register-table th,
.tasks-register-table td{
  padding:13px 14px;
  border-bottom:1px solid var(--border);
  text-align:left;
  vertical-align:middle;
}
.tasks-register-table th{
  background:var(--surface-soft);
  color:var(--text-soft);
  font:700 12px/1 var(--mono);
  letter-spacing:.08em;
  text-transform:uppercase;
}
.tasks-register-table tbody tr{
  cursor:pointer;
  transition:background .15s ease;
}
.tasks-register-table tbody tr:hover{background:var(--surface-soft)}
.tasks-register-table td small{display:block;margin-top:3px;color:var(--text-muted)}
.task-register-title{
  min-width:0;
  display:grid;
  gap:6px;
}
.task-register-title p{
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
  margin:0;
  color:var(--text-muted);
}
.task-register-assignees{
  min-width:0;
  display:flex;
  flex-wrap:wrap;
  gap:6px;
}
.task-register-assignees span{
  display:inline-flex;
  align-items:center;
  gap:5px;
  padding:4px 7px;
  border:1px solid var(--border);
  border-radius:999px;
  background:var(--surface-soft);
  font-size:12px;
}
.task-register-assignees em{font-style:normal;color:var(--text-muted)}
.task-register-actions{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
}
.task-register-actions form{margin:0}
.task-register-actions .btn{white-space:nowrap}
.task-register-progress{
  min-width:110px;
  display:grid;
  gap:5px;
}
.task-progress-track{
  width:100%;
  height:8px;
  display:block;
  overflow:hidden;
  border-radius:999px;
  background:var(--surface-muted);
}
.task-progress-track i{
  height:100%;
  display:block;
  border-radius:inherit;
  background:var(--success);
}
.task-workspace-hero{align-items:stretch}
.task-workspace-title{
  min-width:0;
  display:flex;
  align-items:flex-start;
  gap:16px;
}
.task-workspace-title > div{min-width:0}
.task-eyebrow{
  display:block;
  margin-bottom:8px;
  color:var(--text-soft);
  font:700 12px/1 var(--mono);
  letter-spacing:.12em;
  text-transform:uppercase;
}
.task-hero-badges{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:12px;
}
.task-hero-meta{
  min-width:min(100%,420px);
  margin:0;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
}
.task-hero-meta div{
  min-width:0;
  padding:10px;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  background:var(--surface-soft);
}
.task-hero-meta dt{color:var(--text-soft);font-size:12px}
.task-hero-meta dd{margin:3px 0 0;font-weight:700}
.task-workspace-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(300px,380px);
  gap:18px;
  align-items:start;
}
.task-workspace-main,
.task-workspace-side{
  min-width:0;
  display:grid;
  gap:16px;
}
.task-workspace-card{padding:22px}
.task-card-head{
  min-width:0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:14px;
}
.task-card-head h3{margin:0;font-size:17px}
.task-description{margin:0;color:var(--text);white-space:pre-wrap}
.task-progress-large{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:14px;
}
.task-progress-large span{
  height:14px;
  display:block;
  overflow:hidden;
  border-radius:999px;
  background:var(--surface-muted);
}
.task-progress-large i{
  height:100%;
  display:block;
  border-radius:inherit;
  background:linear-gradient(90deg,var(--success),var(--accent));
}
.checklist-progress{margin-bottom:14px}
.task-checklist,
.task-comments{
  display:grid;
  gap:10px;
}
.task-checklist-item{
  min-width:0;
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:10px;
  margin:0;
  padding:10px;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  background:var(--surface-soft);
}
.task-checklist-item button{
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  border:1px solid var(--border);
  border-radius:999px;
  background:var(--surface);
  color:var(--text);
  cursor:pointer;
}
.task-checklist-item button:disabled{opacity:.55;cursor:not-allowed}
.task-checklist-item.checked span{
  color:var(--text-muted);
  text-decoration:line-through;
}
.task-checklist-item small{color:var(--text-soft);font-size:12px}
.task-inline-form{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:10px;
  margin-top:12px;
}
.task-inline-form input,
.task-comment-form textarea{
  width:100%;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  background:var(--surface);
  color:var(--text);
}
.task-inline-form input{min-height:42px;padding:0 12px}
.task-comment{
  min-width:0;
  padding:12px;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  background:var(--surface-soft);
}
.task-comment div{
  display:flex;
  justify-content:space-between;
  gap:10px;
  flex-wrap:wrap;
}
.task-comment time{color:var(--text-soft);font-size:12px}
.task-comment p{margin:8px 0 0;color:var(--text);white-space:pre-wrap}
.task-comment-form{
  display:grid;
  gap:10px;
  margin-top:12px;
}
.task-comment-form textarea{
  min-height:92px;
  padding:12px;
  resize:vertical;
}
.task-full-page{
  display:grid;
  gap:18px;
}
.task-full-header{
  min-width:0;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:18px;
  align-items:start;
  padding:22px;
  border:1px solid var(--border);
  border-radius:var(--radius);
  background:var(--surface);
  box-shadow:var(--shadow-sm);
}
.task-full-header h2{
  margin:6px 0 0;
  font-size:clamp(26px,3vw,40px);
  line-height:1.08;
}
.task-full-badges{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:14px;
}
.task-full-actions{
  display:flex;
  align-items:flex-start;
  justify-content:flex-end;
  gap:10px;
  flex-wrap:wrap;
}
.task-full-actions form{margin:0}
.back-link{
  display:inline-flex;
  align-items:center;
  gap:6px;
  color:var(--text-muted);
  font-weight:700;
  text-decoration:none;
}
.back-link:hover{color:var(--text)}
.task-full-card{
  min-width:0;
  padding:22px;
  border:1px solid var(--border);
  border-radius:var(--radius);
  background:var(--surface);
  box-shadow:var(--shadow-sm);
}
.task-card-title{
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:16px;
}
.task-card-title > span{
  width:38px;
  height:38px;
  display:grid;
  place-items:center;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  background:var(--surface-soft);
  color:var(--accent);
  flex:0 0 auto;
}
.task-card-title h3{margin:0;font-size:17px}
.task-card-title p{margin:3px 0 0;color:var(--text-muted)}
.task-history-list{
  display:grid;
  gap:12px;
}
.task-history-list article{
  display:grid;
  grid-template-columns:18px minmax(0,1fr);
  gap:10px;
}
.task-history-list article > span{
  width:10px;
  height:10px;
  margin-top:5px;
  border-radius:999px;
  background:var(--accent);
  box-shadow:0 0 0 4px var(--accent-soft);
}
.task-history-list strong{display:block}
.task-history-list small{display:block;margin-top:3px;color:var(--text-soft)}
.task-history-list p{margin:7px 0 0;color:var(--text-muted);white-space:pre-wrap}
.task-recipient-list{display:grid;gap:10px}
.task-recipient-row{
  min-width:0;
  display:grid;
  grid-template-columns:38px minmax(0,1fr) auto;
  gap:12px;
  align-items:center;
  padding:10px;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  background:var(--surface-soft);
}
.task-recipient-row div{min-width:0}
.task-recipient-row small{display:block;color:var(--text-muted)}
.task-timeline{display:grid;gap:0}
.task-timeline-item{
  min-width:0;
  padding:12px 0 12px 16px;
  border-left:2px solid var(--border);
}
.task-timeline-item time{display:block;color:var(--text-soft);font-size:12px}
.task-timeline-item strong{display:block;margin-top:2px}
.task-timeline-item small{
  display:block;
  margin-top:2px;
  color:var(--text-muted);
  overflow-wrap:anywhere;
}
.task-action-grid{display:grid;gap:10px}
.task-action-grid form,
.task-action-grid .btn{width:100%}
.task-action-grid .btn[disabled]{opacity:.55;cursor:not-allowed}
.task-notification-stats{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
}
.task-notification-stats div{
  padding:12px;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  background:var(--surface-soft);
}
.task-notification-stats strong{display:block;font-size:24px}
.task-notification-stats span{color:var(--text-muted)}
.task-notification-list,
.task-related-list{
  display:grid;
  gap:8px;
  margin-top:12px;
}
.task-notification-list span,
.task-related-list a{
  min-width:0;
  display:flex;
  align-items:center;
  gap:8px;
  padding:9px 10px;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  background:var(--surface-soft);
  text-decoration:none;
}
.task-context-preview{
  min-width:0;
  display:grid;
  gap:12px;
}
.task-context-head{display:flex;flex-wrap:wrap;gap:8px}
.task-context-preview h3,
.task-context-preview p{margin:0}
.task-context-preview p{color:var(--text-muted)}
.task-context-progress{display:grid;gap:8px}
.task-context-progress > div{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}

.calendar-actions{justify-content:flex-end}
.calendar-filter{display:flex;align-items:center;flex-wrap:wrap;gap:10px;min-width:0}
.calendar-filter select{width:auto;min-width:180px;max-width:100%}
.calendar-nav-row,
.calendar-edit-row{display:contents}
@media (min-width:901px) and (max-width:1100px){
  .calendar-actions{
    align-items:flex-start;
    gap:10px;
  }
  .calendar-nav-row,
  .calendar-edit-row{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:8px;
  }
}
.schedule-draft-panel{
  margin:12px auto 14px;
  padding:10px 12px;
  max-width:1280px;
}
.schedule-draft-bar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  min-width:0;
}
.schedule-draft-copy{
  display:flex;
  align-items:center;
  gap:12px;
  min-width:0;
  flex:1;
}
.schedule-draft-copy strong{
  flex:0 0 auto;
  color:var(--text);
  font-size:14px;
  line-height:1.2;
  white-space:nowrap;
}
.schedule-draft-preview{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:6px;
  min-width:0;
}
.schedule-draft-preview span,
.schedule-draft-preview b{
  max-width:220px;
  padding:5px 8px;
  border:1px solid var(--border);
  border-radius:999px;
  background:var(--surface-soft);
  color:var(--text-muted);
  font-size:12px;
  line-height:1.15;
  font-weight:700;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.schedule-draft-preview b{
  background:var(--accent-soft);
  color:var(--accent);
  border-color:rgb(var(--accent-rgb) / .18);
}
.schedule-draft-list{
  display:grid;
  gap:8px;
  min-height:0;
  overflow:auto;
  padding:16px;
}
.schedule-draft-item{
  display:flex;
  align-items:center;
  gap:10px;
  min-width:0;
  padding:10px;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  background:var(--surface);
}
.schedule-draft-item-main{
  display:grid;
  gap:2px;
  min-width:0;
  flex:1;
}
.schedule-draft-item-main strong,
.schedule-draft-item-main span{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.schedule-draft-item-main span{
  color:var(--text-muted);
  font-size:13px;
}
.schedule-draft-check{
  display:flex;
  align-items:center;
  justify-content:center;
  flex:0 0 auto;
}
.schedule-draft-actions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:8px;
  margin:0;
  flex:0 0 auto;
}
.schedule-draft-hidden-save,
.schedule-draft-chip{
  display:none;
}
.schedule-draft-drawer{
  position:fixed;
  inset:0;
  z-index:5580;
  pointer-events:none;
}
.schedule-draft-drawer.open{
  pointer-events:auto;
}
.schedule-draft-backdrop{
  position:absolute;
  inset:0;
  background:rgb(17 17 17 / .22);
  opacity:0;
  transition:opacity .18s ease;
}
.schedule-draft-drawer.open .schedule-draft-backdrop{
  opacity:1;
}
.schedule-draft-sheet{
  position:absolute;
  inset:0 0 0 auto;
  width:min(500px,100vw);
  display:grid;
  grid-template-rows:auto auto minmax(0,1fr) auto;
  min-width:0;
  border-left:1px solid var(--border);
  background:var(--surface);
  box-shadow:var(--shadow-popout);
  transform:translateX(100%);
  transition:transform .2s ease;
  outline:0;
}
.schedule-draft-drawer.open .schedule-draft-sheet{
  transform:translateX(0);
}
.schedule-draft-open{
  overflow:hidden;
}
.schedule-draft-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  min-width:0;
  padding:18px 20px;
  border-bottom:1px solid var(--border);
}
.schedule-draft-head span{
  color:var(--text-soft);
  font:700 11px/1 var(--mono);
  letter-spacing:.12em;
  text-transform:uppercase;
}
.schedule-draft-head h2{
  margin:6px 0 2px;
  font-size:22px;
  line-height:1.15;
}
.schedule-draft-head p{
  margin:0;
  color:var(--text-muted);
}
.schedule-draft-head button{
  width:36px;
  height:36px;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  background:var(--surface);
  color:var(--text);
  font-size:22px;
  line-height:1;
}
.schedule-draft-selectbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:12px 16px;
  border-bottom:1px solid var(--border);
  background:var(--surface-soft);
}
.schedule-draft-selectbar .actions{
  margin:0;
}
.schedule-draft-footer{
  display:flex;
  justify-content:flex-end;
  gap:8px;
  padding:14px 16px;
  border-top:1px solid var(--border);
  background:var(--surface);
}
.calendar-card{padding:0;overflow:hidden}
.weekdays,
.calendar-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));min-width:0}
.weekdays b{
  padding:14px;
  border-bottom:1px solid var(--border);
  color:var(--text-soft);
  font:600 12px/1 var(--mono);
  letter-spacing:.12em;
  text-transform:uppercase;
}
.day{
  min-height:132px;
  display:block;
  width:100%;
  min-width:0;
  padding:10px;
  border:0;
  border-right:1px solid var(--border);
  border-bottom:1px solid var(--border);
  background:#fff;
  color:var(--text);
  text-align:left;
}
.day:nth-child(7n){border-right:0}
.day.empty{background:var(--surface-soft)}
.day.weekend{
  background:#fff8f1;
}
.day.empty.weekend{
  background:#fbf1e6;
}
.day:hover{background:#fcfcfc}
.calendar-grid .day.weekend:hover{
  background:#fff3e6;
}
.day.today{box-shadow:inset 0 0 0 2px var(--accent)}
.day strong{display:block;margin-bottom:8px;font-weight:650}
.day small{max-width:100%;white-space:normal}
.today-badge,
.holiday-name{display:inline-block;margin-bottom:6px;color:var(--text-muted);font-size:11px}
.chip{
  max-width:100%;
  display:block;
  margin-top:4px;
  padding:4px 6px;
  border-radius:4px;
  background:var(--accent-soft);
  color:var(--accent);
  font-size:11px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.chip.leave{background:var(--warning-soft);color:var(--warning)}
.chip.sick{background:var(--danger-soft);color:var(--danger)}
.chip.notice{background:#eef4ff;color:#3158a8}
.chip.manager-duty{background:#dbeafe;color:#1d4ed8}
.chip.admin-duty{background:#f3e8ff;color:#7e22ce}
.mobile-agenda{display:none}
.mobile-month-toggle{display:none}
.schedule-day-drawer{
  position:fixed;
  inset:0;
  z-index:5700;
  pointer-events:none;
}
.schedule-day-drawer.open{pointer-events:auto}
.schedule-day-backdrop{
  position:absolute;
  inset:0;
  background:rgb(15 23 42 / .28);
  opacity:0;
  transition:opacity .18s ease;
}
.schedule-day-drawer.open .schedule-day-backdrop{opacity:1}
.schedule-day-sheet{
  position:absolute;
  inset:0 0 0 auto;
  width:min(560px,calc(100vw - 44px));
  max-width:100%;
  display:flex;
  flex-direction:column;
  border-left:1px solid var(--border);
  background:var(--surface);
  color:var(--text);
  box-shadow:var(--shadow-popout);
  transform:translateX(102%);
  transition:transform .22s ease;
  outline:0;
}
.schedule-day-drawer.open .schedule-day-sheet{transform:translateX(0)}
.schedule-day-head{
  flex:0 0 auto;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  padding:22px;
  border-bottom:1px solid var(--border);
}
.schedule-day-head > div{min-width:0}
.schedule-day-head span{
  display:block;
  color:var(--text-soft);
  font:700 12px/1 var(--mono);
  letter-spacing:.12em;
  text-transform:uppercase;
}
.schedule-day-head h2{
  margin:8px 0 0;
  font-size:26px;
  line-height:1.1;
}
.schedule-day-head p{
  margin:6px 0 0;
  color:var(--text-muted);
}
.schedule-day-head button{
  width:38px;
  height:38px;
  display:grid;
  place-items:center;
  flex:0 0 auto;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  background:var(--surface);
  color:var(--text);
  font-size:24px;
  line-height:1;
}
.schedule-day-body{
  flex:1 1 auto;
  min-height:0;
  overflow:auto;
  padding:20px 22px;
}
.schedule-day-template,
.schedule-day-group,
.schedule-day-rows{min-width:0}
.schedule-day-template{
  display:grid;
  gap:16px;
}
.schedule-day-holiday{
  display:grid;
  gap:2px;
  margin:0;
  padding:12px;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  background:var(--surface-soft);
}
.schedule-day-holiday span{color:var(--text-muted)}
.schedule-day-group{
  display:grid;
  gap:10px;
}
.schedule-day-group h3{
  margin:0;
  font-size:15px;
}
.schedule-day-rows{
  display:grid;
  gap:8px;
}
.schedule-day-row{
  min-width:0;
  display:grid;
  grid-template-columns:36px minmax(0,1fr);
  gap:12px;
  align-items:flex-start;
  padding:12px;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  background:var(--surface);
}
.schedule-day-row.selectable{grid-template-columns:auto 36px minmax(0,1fr)}
.schedule-day-check{
  display:grid;
  place-items:center;
  min-height:36px;
}
.schedule-day-row-main{
  min-width:0;
  display:grid;
  gap:6px;
}
.schedule-day-row-top{
  min-width:0;
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:8px;
}
.schedule-day-row-top .person-link{
  min-width:0;
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.schedule-day-row-meta{
  min-width:0;
  display:flex;
  flex-wrap:wrap;
  gap:6px 10px;
  color:var(--text-muted);
  font-size:13px;
}
.schedule-day-row-main small{
  min-width:0;
  color:var(--text-muted);
}
.schedule-day-type{
  display:inline-flex;
  align-items:center;
  min-height:24px;
  padding:0 8px;
  border:1px solid currentColor;
  border-radius:999px;
  font-size:12px;
  font-weight:700;
  background:var(--surface-soft);
}
.schedule-day-type-work-shift,
.schedule-day-type-work{color:var(--success);background:var(--success-soft)}
.schedule-day-type-replacement{color:#1d4ed8;background:#dbeafe}
.schedule-day-type-manager-duty{color:var(--accent);background:var(--accent-soft)}
.schedule-day-type-admin-duty{color:#5b21b6;background:#ede9fe}
.schedule-day-type-paid-leave{color:var(--success);background:#dcfce7}
.schedule-day-type-unpaid-leave{color:var(--warning);background:var(--warning-soft)}
.schedule-day-type-sick-leave{color:var(--danger);background:var(--danger-soft)}
.schedule-day-type-no-show{color:var(--text);background:var(--surface-muted)}
.schedule-day-actions{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.schedule-day-empty,
.schedule-day-empty-state{
  margin:0;
  padding:12px;
  border:1px dashed var(--border);
  border-radius:var(--radius-sm);
  color:var(--text-muted);
  background:var(--surface-soft);
}
.schedule-day-empty-state{
  display:grid;
  gap:4px;
  text-align:left;
}
.schedule-day-empty-state h3,
.schedule-day-empty-state p{margin:0}
.schedule-day-footer{
  flex:0 0 auto;
  display:flex;
  justify-content:flex-end;
  gap:10px;
  padding:14px 22px calc(14px + env(safe-area-inset-bottom));
  border-top:1px solid var(--border);
  background:var(--surface);
}
.schedule-day-delete-form{
  display:grid;
  gap:16px;
}
.schedule-day-bulk-actions{
  position:sticky;
  top:0;
  margin:-20px -22px 0;
  border-top:0;
}
.event-row{
  display:grid;
  grid-template-columns:36px minmax(0,1fr);
  gap:12px;
  align-items:flex-start;
  padding:14px 0;
  border-bottom:1px solid var(--border);
}
.event-row.selectable{grid-template-columns:auto 36px minmax(0,1fr)}
.event-row:last-child{border-bottom:0}
.event-info{min-width:0}
.event-info b,
.event-info p,
.event-info small{
  min-width:0;
  white-space:normal;
  word-break:normal;
  overflow-wrap:break-word;
}
.event-info p{margin:2px 0;color:var(--text-muted)}
.event-info small{color:var(--text-muted)}
.doc-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}

/* Modal system: all app dialogs use dialog.modal plus modal-head/modal-actions. */
dialog.modal{
  width:min(720px,calc(100vw - 48px));
  max-width:calc(100vw - 48px);
  max-height:min(86dvh,860px);
  margin:auto;
  padding:0;
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  background:#fff;
  color:var(--text);
  box-shadow:var(--shadow-popout);
  overflow-y:auto;
  overflow-x:hidden;
  overscroll-behavior:contain;
  scrollbar-gutter:stable;
  z-index:5600;
}
dialog.modal:not([open]){display:none}
dialog.modal > *{min-width:0}
.builder-modal,
.task-modal,
.request-modal{width:min(900px,calc(100vw - 48px))}
.day-modal,
.release-notes-modal,
.task-assignee-dialog{width:min(860px,calc(100vw - 48px))}
dialog.modal::backdrop{
  background:rgb(15 23 42 / .36);
  backdrop-filter:blur(10px);
}
.modal-head{
  position:sticky;
  top:0;
  z-index:2;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  padding:20px 22px;
  border-bottom:1px solid var(--border);
  background:#fff;
}
.modal-head h3{margin:0;font-size:20px}
.modal-head p{margin:4px 0 0;color:var(--text-muted)}
.modal-head button,
.modal-head [data-close],
.modal-head [data-dismiss-release-notes],
[data-close-mobile-menu]{
  width:36px;
  height:36px;
  display:grid;
  place-items:center;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  background:#fff;
  color:var(--text);
  font-size:20px;
}
.modal .form,
.modal .credential-box,
.modal .release-notes-body,
.modal .loc-view-body,
.modal .loc-edit-form,
.modal .task-modal-body,
.modal-body{
  min-width:0;
  overflow-x:hidden;
  padding:22px;
}
.builder-modal[open]{
  display:flex;
  flex-direction:column;
  overflow:hidden;
  width:min(920px,calc(100vw - 48px));
  max-height:min(88dvh,880px);
}
.builder-modal .modal-head{
  flex:0 0 auto;
}
.builder-modal .form.builder{
  flex:1 1 auto;
  overflow-y:auto;
  overflow-x:hidden;
  max-height:calc(min(88dvh,880px) - 82px);
  padding-bottom:0;
}
.modal .segmented,
.builder-modal .segmented{
  width:100%;
  max-width:100%;
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(160px,1fr));
  gap:8px;
  overflow:visible;
  border:0;
  background:transparent;
}
.modal .segmented label,
.builder-modal .segmented label{
  min-width:0;
  min-height:44px;
  justify-content:flex-start;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  white-space:normal;
  overflow:visible;
  line-height:1.2;
}
.modal .segmented label:last-child,
.builder-modal .segmented label:last-child{
  border-right:1px solid var(--border);
}
.modal .segmented label.is-selected{
  background:var(--accent-soft);
  color:var(--accent);
  border-color:rgb(var(--accent-rgb) / .28);
}
.builder-modal .form.builder > .actions,
.schedule-edit-form > .actions{
  position:sticky;
  bottom:0;
  z-index:3;
  margin:8px -22px 0;
  padding:14px 22px;
  border-top:1px solid var(--border);
  background:#fff;
  justify-content:flex-end;
}
.day-modal[open]{
  display:flex;
  flex-direction:column;
  overflow:hidden;
}
.day-modal-body{
  flex:1 1 auto;
  overflow-y:auto;
  overflow-x:hidden;
  max-height:calc(min(86dvh,860px) - 78px);
}
.day-modal-body > p{
  margin:0;
  color:var(--text-muted);
}
.bulk-delete-form{
  min-width:0;
}
.bulk-actions{
  position:sticky;
  top:0;
  z-index:2;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  flex-wrap:wrap;
  gap:8px;
  margin:0 -22px 4px;
  padding:12px 22px;
  border-bottom:1px solid var(--border);
  background:#fff;
}
.modal-actions{justify-content:flex-end;padding:16px 22px;border-top:1px solid var(--border)}
.vs-info-block{
  min-width:0;
  display:grid;
  gap:6px;
  padding:14px;
  border:1px solid var(--border);
  border-radius:var(--radius-md);
  background:var(--surface-soft);
}
.vs-info-block p{margin:0;color:var(--text-muted)}
.vs-info-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}
.vs-info-grid article{
  min-width:0;
  padding:14px;
  border:1px solid var(--border);
  border-radius:var(--radius-md);
  background:#fff;
}
.vs-info-grid span{display:block;color:var(--text-muted);font-size:13px}
.notification-summary-list{margin:8px 0 0;padding-left:18px;color:var(--text)}
.notification-summary-list li{margin:3px 0}

.search-results-page{display:grid;gap:18px}
.search-results-list{display:grid;gap:10px}
.search-result-row{
  display:grid;
  grid-template-columns:40px minmax(0,1fr) auto;
  gap:12px;
  align-items:center;
  padding:14px;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  background:#fff;
  color:var(--text);
  text-decoration:none;
}
.search-result-row:hover{background:var(--surface-soft)}
.search-result-icon{
  width:40px;
  height:40px;
  display:grid;
  place-items:center;
  border-radius:var(--radius-sm);
  background:var(--accent-soft);
  color:var(--accent);
  font-weight:700;
}
.search-result-icon .icon{width:20px;height:20px}
.search-result-main{min-width:0}
.search-result-main b,
.search-result-main small{display:block;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.search-result-main small{margin-top:3px;color:var(--text-muted)}
.search-pagination{margin-top:12px}

.plan-change-modal{width:min(760px,calc(100vw - 32px))}
.plan-choice-list{display:grid;gap:10px}
.plan-choice-card{
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  gap:12px;
  align-items:start;
  padding:14px;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  background:#fff;
}
.plan-choice-card.active{
  border-color:var(--accent);
  background:var(--accent-soft);
}
.plan-choice-card input{margin-top:4px}
.plan-choice-card b,
.plan-choice-card small{display:block}
.plan-choice-card small{margin-top:3px;color:var(--text-muted)}
.plan-choice-card > strong{white-space:nowrap}
.plan-choice-meta{
  grid-column:2 / -1;
  display:flex;
  flex-wrap:wrap;
  gap:6px;
}
.plan-choice-meta em{
  padding:4px 8px;
  border:1px solid var(--border);
  border-radius:999px;
  background:#fff;
  color:var(--text-muted);
  font-style:normal;
  font-size:12px;
}

.mobile-nav-menu{
  position:fixed;
  inset:0 auto 0 0;
  z-index:100;
  width:min(78vw,360px);
  padding:20px 16px;
  border-right:1px solid var(--border);
  background:#fbfbfb;
  box-shadow:var(--shadow-popout);
  display:none;
  overflow:auto;
}
.mobile-nav-menu.open{display:block}
.mobile-menu-head,
.mobile-menu-user{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:12px;
}
.mobile-menu-user{
  display:grid;
  justify-content:start;
  border:1px solid var(--border);
  border-radius:var(--radius-md);
  background:#fff;
}
.mobile-menu-user small{color:var(--text-muted)}
.mobile-menu-links{display:grid;gap:2px;margin-top:14px}
.mobile-menu-links a{
  min-height:42px;
  display:flex;
  align-items:center;
  gap:10px;
  padding:0 12px;
  border-radius:var(--radius-sm);
  text-decoration:none;
}
.mobile-menu-links a:hover{background:var(--surface-soft)}
.mobile-menu-links a.active{background:var(--accent-soft);color:var(--accent)}
.mobile-menu-links hr{width:100%;border:0;border-top:1px solid var(--border);margin:10px 0}
.mobile-app-version{padding:12px;color:var(--text-muted)}

.release-note-list{margin:0;padding:0;list-style:none;display:grid;gap:10px}
.release-note-list li{display:grid;grid-template-columns:24px 1fr;gap:12px}
.release-note-hero{
  margin-bottom:14px;
  padding:14px;
  border:1px solid var(--border);
  border-radius:var(--radius-md);
  background:var(--surface-soft);
}
.release-note-hero span{display:block;color:var(--text-muted)}
.release-note-actions{display:flex;justify-content:flex-end;flex-wrap:wrap;gap:10px;margin-top:18px}

.toast{
  position:fixed;
  right:22px;
  bottom:22px;
  z-index:120;
}
.hidden,
[hidden],
.is-hidden{display:none!important}

.input select,
.input textarea,
.password-inline input{
  min-height:40px;
  border:0;
  outline:0;
  box-shadow:none;
  background-color:transparent;
}
.input select:focus,
.input textarea:focus,
.password-inline input:focus{
  border-color:transparent;
  box-shadow:none;
}
.input:has(select),
.input:has(textarea){
  padding-right:0;
}
.vs-control,
.input,
.password-inline{
  min-width:0;
}

.vs-request-card{
  grid-template-columns:minmax(230px,1.15fr) minmax(190px,.9fr) minmax(220px,1fr) minmax(124px,auto);
}
.vs-conflicts{
  align-content:start;
}
.vs-conflict-preview{
  min-width:0;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.vs-conflict-preview p{
  white-space:normal;
}
.vs-link-button{
  width:max-content;
  max-width:100%;
  min-height:30px;
  margin-top:4px;
  padding:0;
  border:0;
  background:transparent;
  color:var(--accent);
  font-weight:600;
  text-align:left;
}
.vs-link-button:hover{text-decoration:underline}
.request-conflicts-list{
  display:grid;
  gap:10px;
  padding:0 22px 22px;
}
.request-conflict-row{
  min-width:0;
  padding:12px;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  background:var(--surface-soft);
}
.request-conflict-row strong{display:block;margin-bottom:4px}
.request-conflict-row p{
  margin:0;
  color:var(--text-muted);
  white-space:normal;
  overflow-wrap:break-word;
}
.request-conflicts-list.compact{
  padding:0;
}
.ticket-filter-form{
  align-items:end;
  border-top:1px solid var(--border);
}
.ticket-search-control{
  grid-column:span 2;
}
.ticket-filter-actions{
  grid-column:span 2;
  min-width:0;
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:10px;
}
.ticket-filter-actions .btn{
  min-width:0;
}
.ticket-pagination .page-btn{
  text-decoration:none;
}
.requests-register-page{
  gap:16px;
}
.requests-register-toolbar{
  align-items:center;
}
.requests-register-kpis{
  grid-template-columns:repeat(4,minmax(0,1fr));
}
.ticket-register-form{
  padding:16px 18px;
  border-top:1px solid var(--border);
}
.ticket-register-search{
  display:grid;
  grid-template-columns:minmax(220px,1fr) auto auto;
  gap:10px;
  align-items:start;
}
.ticket-register-search > label{
  min-width:0;
}
.ticket-register-search input,
.ticket-filter-grid input,
.ticket-filter-grid select{
  width:100%;
}
.ticket-filter-details{
  position:relative;
}
.ticket-filter-details summary{
  list-style:none;
}
.ticket-filter-details summary::-webkit-details-marker{display:none}
.ticket-filter-grid{
  position:absolute;
  z-index:50;
  top:calc(100% + 8px);
  right:0;
  width:min(780px,calc(100vw - 72px));
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
  padding:16px;
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  background:var(--surface);
  box-shadow:var(--shadow-popout);
}
.requests-register-wrap{
  min-width:0;
  overflow:auto;
  border-top:1px solid var(--border);
}
.requests-register-table{
  width:100%;
  border-collapse:collapse;
  min-width:980px;
}
.requests-register-table th,
.requests-register-table td{
  padding:12px 14px;
  border-bottom:1px solid var(--border);
  text-align:left;
  vertical-align:middle;
}
.requests-register-table th{
  color:var(--text-soft);
  font:700 12px/1 var(--mono);
  letter-spacing:.08em;
  text-transform:uppercase;
  background:var(--surface-soft);
}
.requests-register-table tbody tr{
  cursor:pointer;
  transition:background .15s ease;
}
.requests-register-table tbody tr:hover{
  background:var(--surface-soft);
}
.requests-register-table td{
  color:var(--text);
}
.requests-register-table td small{
  display:block;
  margin-top:3px;
  color:var(--text-muted);
}
.request-register-comment{
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
  margin:4px 0 0;
  color:var(--text-muted);
  font-size:13px;
}
.requests-register-actions{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  flex-wrap:wrap;
  gap:6px;
}
.requests-register-actions form{
  margin:0;
}
.ticket-detail-open-full{
  display:flex;
  justify-content:flex-start;
}
.ticket-full-page{
  max-width:1280px;
  margin:0 auto;
  padding:32px;
  display:grid;
  gap:18px;
}
.ticket-full-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:16px;
  padding:20px;
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  background:var(--surface);
  box-shadow:var(--shadow-card);
}
.ticket-full-title{
  min-width:0;
  display:flex;
  align-items:flex-start;
  gap:16px;
}
.ticket-full-title > div{
  min-width:0;
}
.ticket-full-title h2{
  margin:8px 0 4px;
  font-size:28px;
  line-height:1.12;
}
.ticket-full-title p{
  margin:0;
  color:var(--text-muted);
}
.ticket-full-actions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  flex-wrap:wrap;
  gap:8px;
}
.ticket-full-actions form{
  margin:0;
}
.ticket-full-layout{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(280px,360px);
  gap:18px;
  align-items:start;
}
.ticket-full-main,
.ticket-full-card{
  min-width:0;
  padding:22px;
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  background:var(--surface);
  box-shadow:var(--shadow-card);
}
.ticket-full-side{
  min-width:0;
  display:grid;
  gap:14px;
}
.ticket-full-card h3{
  margin:0 0 12px;
  font-size:16px;
}
.ticket-full-timeline{
  display:grid;
  gap:10px;
}
.ticket-full-timeline > div{
  min-width:0;
  padding:10px 0 10px 14px;
  border-left:2px solid var(--border);
}
.ticket-full-timeline time{
  display:block;
  color:var(--text-soft);
  font-size:12px;
}
.ticket-full-timeline b{
  display:block;
  margin-top:2px;
}
.ticket-full-timeline small{
  display:block;
  margin-top:2px;
  color:var(--text-muted);
  overflow-wrap:anywhere;
}
.ticket-detail-fragment{
  min-width:0;
  display:grid;
  gap:16px;
}
.ticket-detail-actions{
  justify-content:flex-start;
}
.ticket-status-form{
  margin:0 -22px -22px;
  border-top:1px solid var(--border);
  background:var(--surface);
}
.ticket-skeleton{
  display:grid;
  gap:10px;
}
.ticket-skeleton span{
  display:block;
  height:48px;
  border-radius:var(--radius-sm);
  background:linear-gradient(90deg,var(--surface-soft),#fff,var(--surface-soft));
  background-size:220% 100%;
  animation:ticketSkeleton 1.1s ease-in-out infinite;
}
@keyframes ticketSkeleton{
  0%{background-position:100% 0}
  100%{background-position:-100% 0}
}

.notifications-page .vs-card{
  overflow:hidden;
}
.notification-tabs{
  padding-bottom:12px;
}
.notifications-page .vs-list-item{
  min-height:76px;
  padding:14px 18px;
  gap:14px;
}
.notifications-page .vs-list-main{
  grid-template-columns:32px minmax(0,1fr);
}
.notifications-page .vs-list-main h3{
  font-size:15px;
}
.notifications-page .vs-list-main p{
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
  color:var(--text-muted);
}
.notification-pagination{
  min-width:0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:12px;
  padding:14px 18px;
  border-top:1px solid var(--border);
  background:#fff;
}
.notification-pagination > span{
  color:var(--text-muted);
  font-weight:500;
}
.notification-page-buttons{
  display:flex;
  align-items:center;
  justify-content:center;
  flex-wrap:wrap;
  gap:6px;
}
.notification-page-btn{
  min-width:34px;
  min-height:34px;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  background:#fff;
  color:var(--text);
  font-weight:600;
}
.notification-page-btn.active{
  border-color:var(--accent);
  background:var(--accent-soft);
  color:var(--accent);
}
.notification-page-size{
  width:auto;
  display:flex;
  grid-template-columns:none;
  align-items:center;
  gap:8px;
  color:var(--text-muted);
}
.notification-page-size select{
  width:auto;
  min-width:88px;
}

.employee-profile-page{
  width:100%;
  max-width:1280px;
  margin:0 auto;
  padding:32px;
  display:grid;
  gap:18px;
}
.employee-profile-hero.card{
  padding:22px;
}
.employee-profile-hero .employee-profile-main{
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:18px;
}
.employee-profile-avatar-wrap{
  display:grid;
  justify-items:center;
  gap:10px;
}
.employee-profile-avatar{
  width:74px;
  height:74px;
  display:grid;
  place-items:center;
  border:1px solid var(--border);
  border-radius:999px;
  overflow:hidden;
  background:var(--accent-soft);
  color:var(--accent);
  font-size:22px;
  font-weight:800;
}
.employee-profile-avatar img{
  width:100%;
  height:100%;
  object-fit:cover;
}
.employee-avatar-upload .btn{
  min-height:32px;
  padding:0 10px;
  font-size:12px;
}
.employee-profile-title,
.employee-profile-title h2,
.employee-profile-title p,
.employee-profile-contact,
.employee-profile-contact span{
  min-width:0;
}
.employee-profile-title h2{
  margin:4px 0 2px;
  font-size:30px;
  line-height:1.1;
  letter-spacing:0;
}
.employee-profile-title p{
  margin:0;
  color:var(--text-muted);
}
.employee-profile-contact span{
  color:var(--text-muted);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.employee-profile-tabs{
  margin-top:18px;
  padding-top:14px;
  border-top:1px solid var(--border);
}
.employee-profile-stats{
  grid-template-columns:repeat(5,minmax(0,1fr));
}
.employee-profile-layout{
  align-items:start;
}
.employee-profile-layout > div,
.employee-profile-layout aside{
  min-width:0;
  display:grid;
  gap:18px;
}
.employee-profile-section{
  margin:0;
}
.employee-profile-grid,
.employee-leave-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}
.employee-profile-grid > div,
.employee-leave-grid > div{
  min-width:0;
  padding:12px;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  background:var(--surface-soft);
}
.employee-profile-grid span,
.employee-leave-grid span{
  display:block;
  color:var(--text-muted);
  font-size:12px;
}
.employee-profile-grid b,
.employee-leave-grid b{
  display:block;
  margin-top:4px;
  color:var(--text);
  overflow-wrap:break-word;
}
.employee-profile-note{
  margin:0;
  color:var(--text-muted);
}
.employee-inventory-list{
  display:grid;
  gap:8px;
}
.employee-inventory-row{
  min-width:0;
  display:grid;
  grid-template-columns:minmax(160px,1.3fr) minmax(96px,.7fr) minmax(112px,.75fr) minmax(120px,.8fr) auto;
  gap:10px;
  align-items:center;
  padding:10px 12px;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  background:var(--surface-soft);
}
.employee-inventory-head{
  padding:0 12px;
  border:0;
  background:transparent;
  color:var(--text-soft);
  font-size:12px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.04em;
}
.employee-inventory-row span{
  min-width:0;
  color:var(--text-muted);
}
.employee-inventory-row b{
  display:block;
  color:var(--text);
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.employee-inventory-row small{
  display:block;
  color:var(--text-soft);
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.login{
  width:100%;
  min-height:100dvh;
  display:grid;
  place-items:center;
  padding:32px 18px;
  background:var(--bg);
}
.main.guest{
  min-height:100dvh;
  padding:0;
}
.login-card{
  width:min(520px,100%);
  min-width:0;
  padding:34px;
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  background:#fff;
  box-shadow:var(--shadow-popout);
  overflow:hidden;
}
.login-logo{
  width:min(260px,76%);
  max-height:120px;
  object-fit:contain;
  margin:18px auto 24px;
}
.login-form{
  gap:16px;
}
.login-card p{color:var(--text-muted)}
.login-back-link,
.login-links a{color:var(--accent);text-decoration:none;font-weight:500}
.login-links{margin-top:18px}
.mobile-install-card{
  width:100%;
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:8px;
  margin-top:14px;
  padding:14px;
  border:1px solid var(--border);
  border-radius:var(--radius-md);
  background:var(--surface-soft);
}
.login-card,
.login-card p,
.login-card a,
.login-card b,
.login-card label,
.login-card .mobile-install-card,
.login-card .mobile-install-card *{
  min-width:0;
  max-width:100%;
  white-space:normal;
  word-break:normal;
  overflow-wrap:break-word;
  writing-mode:horizontal-tb;
  text-orientation:mixed;
}
.mobile-install-card b,
.mobile-install-card p{
  display:block;
  width:100%;
  min-width:0;
  max-width:none;
  margin:0;
  line-height:1.35;
  white-space:normal;
  word-break:normal;
  overflow-wrap:normal;
  writing-mode:horizontal-tb;
  text-orientation:mixed;
}
.mobile-install-card b{
  color:var(--text);
  font-size:15px;
  font-weight:700;
}
.mobile-install-card p{
  color:var(--text-muted);
  font-size:14px;
}
.password-inline{
  position:relative;
  display:block;
  width:100%;
  min-height:42px;
  border:1px solid var(--border-strong);
  border-radius:var(--radius-sm);
  background:#fff;
}
.password-inline input{
  width:100%;
  padding:0 48px 0 12px;
}
.password-eye,
.password-eye-inline{
  position:absolute;
  right:5px;
  bottom:5px;
  width:32px;
  height:32px;
  min-height:32px;
  display:grid;
  place-items:center;
  padding:0;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  background:var(--surface-soft);
  color:var(--text);
  line-height:1;
}
.password-inline:focus-within{
  border-color:var(--accent);
  box-shadow:0 0 0 3px rgb(var(--accent-rgb) / .16);
}

/* v4.0.8.9.6 final9 polish: keep Render-style UI, tighten layouts */
.vs-kpi-card,
.vs-kpi,
.metric,
.stat,
.loc-stat,
.employee-profile-stats .card{
  min-height:84px;
  padding:13px 15px;
}
.stat-value,
.vs-kpi-card strong,
.vs-kpi strong,
.metric b,
.stat strong,
.loc-stat strong,
.employee-profile-stats .card b{
  margin-top:4px;
  font-size:22px;
}
.vs-kpi-card small,
.vs-kpi small,
.metric small,
.stat small,
.loc-stat small,
.employee-profile-stats .card small{margin-top:5px}
.page-ellipsis{
  min-width:28px;
  min-height:34px;
  display:inline-grid;
  place-items:center;
  color:var(--text-muted);
  font-weight:700;
}
.highlight-static{
  outline:2px solid var(--accent-soft);
  background:var(--accent-soft);
}
.highlight-pulse{
  animation:highlightPulse 1.3s ease-in-out 3;
}
@keyframes highlightPulse{
  0%,100%{box-shadow:0 0 0 0 rgba(116,64,255,0)}
  45%{box-shadow:0 0 0 6px rgba(116,64,255,.14)}
}
.notif-dropdown{
  width:min(360px,calc(100vw - 24px));
  overflow:hidden;
}
.notif-item span,
.notif-item small{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.notif-more{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:40px;
  padding:0 14px;
  border-top:1px solid var(--border);
  color:var(--accent);
  text-decoration:none;
  font-weight:600;
}

.chip{
  margin-top:3px;
  padding:3px 5px;
  font-size:10.5px;
  line-height:1.25;
}
.chip.work{background:var(--accent-soft);color:var(--accent)}
.chip.manager-duty{background:#dbeafe;color:#1d4ed8}
.chip.admin-duty{background:#f3e8ff;color:#7e22ce}
.chip.paid-leave{background:#e8f8ef;color:#0f7a53}
.chip.unpaid-leave{background:#fff1df;color:#a75810}
.chip.sick-leave{background:#fee9ec;color:#b83342}
.chip.no-show{background:#eef2f7;color:#475569}
.chip.notice{background:#eef4ff;color:#3158a8}

.employee-editor-page{
  width:100%;
  max-width:1440px;
  margin:0 auto;
  padding:28px 32px 32px;
  display:grid;
  gap:16px;
}
.employee-editor-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:18px;
  padding:0;
  border:0;
  background:transparent;
  box-shadow:none;
}
.employee-editor-head-actions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
  flex-wrap:wrap;
}
.employee-editor-back{
  color:var(--accent);
  text-decoration:none;
  font-weight:600;
}
.employee-editor-head h2{
  margin:10px 0 4px;
  font-size:32px;
  line-height:1.08;
  letter-spacing:0;
}
.employee-editor-head p{margin:0;color:var(--text-muted)}
.employee-editor-shell{
  display:grid;
  grid-template-columns:minmax(210px,260px) minmax(0,1fr);
  gap:16px;
  align-items:start;
}
.employee-editor-aside{
  position:sticky;
  top:92px;
  min-width:0;
  display:grid;
  gap:16px;
  padding:20px;
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  background:var(--surface);
  box-shadow:var(--shadow-card);
}
.employee-editor-kicker{
  color:var(--text-soft);
  font:700 12px/1 var(--mono);
  letter-spacing:.12em;
  text-transform:uppercase;
}
.employee-editor-aside h3{margin:8px 0 6px;font-size:22px;line-height:1.15}
.employee-editor-aside p{margin:0;color:var(--text-muted)}
.employee-editor-number{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:6px 10px;
  align-items:center;
  padding:12px;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  background:var(--surface-soft);
}
.employee-editor-number span{grid-column:1/-1;color:var(--text-muted);font-size:12px}
.employee-editor-number strong{min-width:0;overflow-wrap:anywhere}
.employee-editor-number button{
  width:32px;
  height:32px;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  background:#fff;
}
.employee-editor-hints{display:grid;gap:8px}
.employee-editor-hints div{display:flex;align-items:center;gap:10px;min-width:0;color:var(--text-muted)}
.employee-editor-hints b{
  width:26px;
  height:26px;
  display:grid;
  place-items:center;
  border-radius:999px;
  background:var(--accent-soft);
  color:var(--accent);
}
.employee-editor-section{display:grid;gap:18px}
.employee-editor-section-title{
  display:grid;
  grid-template-columns:34px minmax(0,1fr);
  gap:12px;
  align-items:start;
}
.employee-editor-section-title > span{
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  border-radius:999px;
  background:var(--accent-soft);
  color:var(--accent);
  font-weight:700;
}
.employee-editor-section-title h3{margin:0;font-size:20px}
.employee-editor-section-title p{margin:4px 0 0;color:var(--text-muted)}
.employee-editor-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.employee-editor-quick{display:flex;align-items:end;gap:8px;flex-wrap:wrap}
.employee-editor-notes textarea{min-height:130px}
.employee-editor-actions{display:flex;justify-content:flex-end;gap:10px;padding:18px 0 0}

.employee-profile-tabs button,
.employee-profile-tabs a{
  min-height:38px;
  display:flex;
  align-items:center;
  padding:0 12px;
  border:0;
  border-radius:var(--radius-sm);
  background:transparent;
  color:var(--text-muted);
  font-weight:500;
  text-decoration:none;
}
.employee-profile-tabs button:hover,
.employee-profile-tabs a:hover{background:var(--surface-soft);color:var(--text)}
.employee-profile-modal{
  width:min(760px,calc(100vw - 48px));
  max-height:min(720px,calc(100dvh - 48px));
  overflow:auto;
}
.employee-profile-modal .modal-grid,
.employee-profile-modal .modal-list{padding:22px}

.expense-board{overflow:hidden}
.expense-kpis .vs-kpi-card strong{font-size:clamp(22px,2vw,30px)}
.expense-register-head{align-items:flex-start}
.expense-filters{display:flex;align-items:center;justify-content:flex-end;gap:10px;flex-wrap:wrap}
.expense-filters select{width:auto;min-width:170px}
.expense-register-wrap{min-width:0;overflow:auto}
.expense-register-table{
  width:100%;
  min-width:1040px;
  border-collapse:separate;
  border-spacing:0;
}
.expense-register-table th,
.expense-register-table td{
  padding:12px 14px;
  border-bottom:1px solid var(--border);
  text-align:left;
  vertical-align:middle;
}
.expense-register-table th{
  color:var(--text-soft);
  font-size:12px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.08em;
  background:var(--surface-soft);
  white-space:nowrap;
}
.expense-register-table tbody tr{transition:background .16s ease}
.expense-register-table tbody tr:hover{background:var(--surface-soft)}
.expense-register-table td{font-size:14px;color:var(--text)}
.expense-register-table td small{display:block;margin-top:3px;color:var(--text-soft)}
.expense-register-table td[data-label="Сума"]{white-space:nowrap}
.expense-register-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap}
.expense-register-actions .btn{white-space:nowrap}
.expense-pagination{
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:12px;
  padding:14px 18px;
  border-top:1px solid var(--border);
}
.expense-page-buttons{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.expense-modal{width:min(720px,calc(100vw - 48px))}
.expense-detail-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(320px,.72fr);
  gap:18px;
}
.expense-summary-card{grid-row:span 2}
.inventory-register-toolbar{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:16px;
  padding:18px;
  border-bottom:1px solid var(--border);
}
.inventory-register-toolbar h3{margin:0}
.inventory-register-toolbar p{margin:4px 0 0;color:var(--text-muted)}
.inventory-filters{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  flex-wrap:wrap;
  gap:10px;
  max-width:980px;
}
.inventory-filters input,
.inventory-filters select{
  width:auto;
  min-width:150px;
}
.inventory-filters input[type="search"]{min-width:240px}
.inventory-register-table{min-width:1180px}
.inventory-item-title{
  min-width:0;
  display:grid;
  gap:4px;
}
.inventory-item-title strong{
  max-width:280px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.inventory-qty-status{
  display:grid;
  gap:6px;
  align-items:start;
}
.inventory-register-actions{
  justify-content:flex-end;
}
.inventory-subnav{
  margin:0 0 16px;
}
.inventory-modal{width:min(860px,calc(100vw - 48px))}
.inventory-detail-hero{
  min-width:0;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:18px;
  padding:22px;
  border:1px solid var(--border);
  border-radius:var(--radius);
  background:var(--surface);
  box-shadow:var(--shadow-card);
}
.inventory-detail-title{
  min-width:0;
  display:grid;
  gap:8px;
}
.inventory-detail-title h2{
  margin:0;
  font-size:32px;
  line-height:1.08;
  overflow:hidden;
  text-overflow:ellipsis;
}
.inventory-detail-meta{
  min-width:0;
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:8px;
  color:var(--text-muted);
  font-weight:750;
}
.inventory-detail-meta > span:not(.badge){
  min-width:0;
  max-width:320px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.inventory-more-menu{
  position:relative;
}
.inventory-more-menu summary{
  list-style:none;
  cursor:pointer;
}
.inventory-more-menu summary::-webkit-details-marker{display:none}
.inventory-more-panel{
  position:absolute;
  right:0;
  z-index:20;
  min-width:170px;
  margin-top:8px;
  padding:8px;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  background:var(--surface);
  box-shadow:var(--shadow-popout);
}
.inventory-more-panel form,
.inventory-more-panel button{
  width:100%;
}
.inventory-more-panel button{
  border:0;
  background:transparent;
  text-align:left;
  padding:9px 10px;
  border-radius:var(--radius-xs);
  font-weight:800;
  cursor:pointer;
}
.inventory-more-panel button:hover{
  background:var(--danger-soft);
}
.inventory-kpi-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
  margin:16px 0 18px;
}
.inventory-kpi-grid article{
  min-width:0;
  padding:16px;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  background:var(--surface);
  box-shadow:var(--shadow-card);
}
.inventory-kpi-grid span{
  display:block;
  color:var(--text-soft);
  font-size:12px;
  font-weight:850;
  letter-spacing:.06em;
  text-transform:uppercase;
}
.inventory-kpi-grid b{
  display:block;
  margin-top:7px;
  color:var(--text);
  font-size:18px;
  line-height:1.2;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.inventory-detail-main-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(360px,.72fr);
  gap:18px;
  align-items:start;
}
.inventory-info-card,
.inventory-movement-card,
.inventory-history-card,
.inventory-label-card{padding:22px}
.inventory-detail-list{
  margin:0;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
}
.inventory-detail-list div{
  min-width:0;
  padding:13px;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  background:var(--surface-soft);
}
.inventory-detail-list div.full{
  grid-column:1/-1;
}
.inventory-detail-list dt{
  margin:0;
  color:var(--text-soft);
  font-size:12px;
  font-weight:850;
  letter-spacing:.06em;
  text-transform:uppercase;
}
.inventory-detail-list dd{
  margin:6px 0 0;
  color:var(--text);
  font-weight:750;
  line-height:1.35;
  overflow-wrap:anywhere;
}
.inventory-code-stack{
  display:grid;
  gap:14px;
}
.inventory-code-section{
  min-width:0;
  padding:14px;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  background:var(--surface-soft);
}
.inventory-code-section-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:10px;
  margin-bottom:12px;
}
.inventory-code-section-head span{
  color:var(--text);
  font-weight:850;
}
.inventory-verify-grid{
  display:grid;
  grid-template-columns:minmax(320px,.72fr) minmax(0,1fr);
  gap:18px;
}
.inventory-scan-card,
.inventory-result-card{
  padding:22px;
}
.inventory-manual-form{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:end;
  gap:10px;
}
.inventory-manual-form label{
  min-width:0;
  display:grid;
  gap:6px;
}
.inventory-manual-form label span{
  color:var(--text-soft);
  font-size:12px;
  font-weight:800;
  letter-spacing:.06em;
  text-transform:uppercase;
}
.inventory-manual-form input{
  width:100%;
  font-family:var(--mono);
}
.inventory-scan-shell{
  position:relative;
  overflow:hidden;
  min-height:270px;
  margin-top:16px;
  border:1px solid var(--border);
  border-radius:var(--radius);
  background:#111827;
}
.inventory-scan-shell video{
  display:block;
  width:100%;
  min-height:270px;
  object-fit:cover;
}
.inventory-scanner-status{
  margin:12px 0 0;
  color:var(--text-muted);
  font-weight:700;
}
.inventory-scan-actions{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:10px;
  margin-top:14px;
}
.inventory-result-main{
  display:grid;
  gap:7px;
  margin-bottom:16px;
}
.inventory-result-main h3{
  margin:0;
  font-size:24px;
  line-height:1.15;
}
.inventory-result-main p{
  margin:0;
  color:var(--text-muted);
  font-weight:700;
}
.inventory-result-main .badge{
  justify-self:start;
}
.inventory-result-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
}
.inventory-result-grid div{
  min-width:0;
  padding:13px;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  background:var(--surface-soft);
}
.inventory-result-grid span{
  display:block;
  color:var(--text-soft);
  font-size:12px;
  font-weight:800;
  letter-spacing:.06em;
  text-transform:uppercase;
}
.inventory-result-grid b{
  display:block;
  margin-top:5px;
  overflow-wrap:anywhere;
}
.inventory-result-actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:16px;
}
.inventory-detail-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(360px,.78fr);
  gap:18px;
}
.inventory-summary-card,
.inventory-edit-card,
.inventory-movement-card,
.inventory-history-card,
.inventory-label-card{padding:22px}
.inventory-detail-actions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  flex-wrap:wrap;
  gap:10px;
}
.inventory-detail-notes{
  margin-top:18px;
  padding-top:16px;
  border-top:1px solid var(--border);
  display:grid;
  gap:8px;
  color:var(--text-muted);
}
.inventory-detail-notes p{margin:0}
.inventory-stock-warning{
  margin-top:16px;
  padding:12px 14px;
  border:1px solid var(--warning-soft);
  border-radius:var(--radius-sm);
  background:var(--warning-soft);
  color:var(--warning);
  display:grid;
  gap:2px;
}
.inventory-stock-warning span{color:var(--text-muted)}
.inventory-code-grid{
  display:grid;
  grid-template-columns:minmax(150px,.72fr) minmax(220px,1.3fr) minmax(150px,.82fr);
  gap:12px;
}
.inventory-code-panel{
  min-width:0;
  padding:14px;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  background:var(--surface-soft);
  display:grid;
  align-content:start;
  gap:10px;
}
.inventory-code-panel > span{
  color:var(--text-soft);
  font-size:12px;
  font-weight:800;
  letter-spacing:.06em;
  text-transform:uppercase;
}
.inventory-code-number b{
  font:800 20px/1.2 var(--mono);
  overflow-wrap:anywhere;
}
.inventory-barcode-img,
.inventory-qr-img{
  display:block;
  max-width:100%;
  object-fit:contain;
  border:1px solid var(--border);
  border-radius:var(--radius-xs);
  background:#fff;
}
.inventory-barcode-img{
  width:100%;
  height:108px;
  padding:10px;
}
.inventory-qr-img{
  width:138px;
  height:138px;
  padding:8px;
}
.inventory-qr-img.large{
  width:160px;
  height:160px;
}
.inventory-label-actions{
  margin-top:14px;
  justify-content:flex-start;
  gap:8px;
}
.inventory-action-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}
.inventory-action-card{
  min-width:0;
  display:grid;
  gap:10px;
  padding:14px;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  background:var(--surface-soft);
}
.inventory-action-card h4{
  margin:0;
  font-size:15px;
}
.inventory-action-card label{
  min-width:0;
  display:grid;
  gap:5px;
}
.inventory-action-card label span{
  color:var(--text-soft);
  font-size:12px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.06em;
}
.inventory-action-card input,
.inventory-action-card select{
  width:100%;
}
.inventory-action-card .btn{
  justify-self:start;
}
.inventory-history-list{
  display:grid;
  gap:0;
}
.inventory-history-row{
  display:grid;
  grid-template-columns:120px 18px minmax(0,1fr);
  gap:14px;
  padding:0 0 22px;
  position:relative;
}
.inventory-history-row:not(:last-child)::before{
  content:"";
  position:absolute;
  left:127px;
  top:14px;
  bottom:0;
  width:1px;
  background:var(--border);
}
.inventory-history-date{
  min-width:0;
  text-align:right;
}
.inventory-history-date time{
  display:block;
  color:var(--text);
  font-weight:850;
}
.inventory-history-date span{
  display:block;
  margin-top:3px;
  color:var(--text-soft);
  font-size:12px;
  font-weight:700;
}
.inventory-history-dot{
  width:11px;
  height:11px;
  margin-top:4px;
  border-radius:999px;
  background:var(--accent);
  box-shadow:0 0 0 4px var(--accent-soft);
}
.inventory-history-content{
  min-width:0;
  padding:0 0 0 2px;
}
.inventory-history-title{
  font-weight:800;
  color:var(--text);
}
.inventory-history-row p{
  margin:3px 0 0;
  color:var(--text-muted);
}
.inventory-history-row small{
  display:block;
  margin-top:5px;
  color:var(--text-soft);
  font-weight:700;
}
.expense-detail-list{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
  margin:0;
}
.expense-detail-list div{
  min-width:0;
  padding:12px;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  background:var(--surface-soft);
}
.expense-detail-list dt{margin:0;color:var(--text-soft);font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.06em}
.expense-detail-list dd{margin:5px 0 0;color:var(--text);font-weight:700;overflow-wrap:anywhere}
.expense-note p{margin:0;color:var(--text-muted)}
.expense-note p+p{margin-top:10px}
.expense-receipt-preview{
  display:block;
  overflow:hidden;
  border:1px solid var(--border);
  border-radius:var(--radius);
  background:var(--surface-soft);
}
.expense-receipt-preview img{
  display:block;
  width:100%;
  max-height:420px;
  object-fit:contain;
}
.expense-receipt-frame{
  width:100%;
  min-height:420px;
  border:1px solid var(--border);
  border-radius:var(--radius);
  background:var(--surface-soft);
}
.expense-context-preview h3{margin:12px 0 6px}
.expense-context-preview p{margin:0 0 12px;color:var(--text-muted)}

.invoice-real{padding:28px}
.invoice-paper-head{align-items:flex-start;gap:18px}
.invoice-title-block{margin-left:auto;text-align:right}
.invoice-title-block span{color:var(--text-soft);font:700 12px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase}
.invoice-title-block b{display:block;margin-top:8px;font-size:28px;line-height:1.1}
.invoice-title-block small{display:block;margin-top:6px;color:var(--text-muted)}
.invoice-meta-grid,
.invoice-party-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:22px}
.invoice-party-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.invoice-meta-grid article,
.invoice-party{min-width:0;padding:14px;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface-soft)}
.invoice-meta-grid span{color:var(--text-muted);font-size:12px}
.invoice-meta-grid strong{display:block;margin-top:4px;overflow-wrap:anywhere}
.invoice-party h3{margin:0 0 12px}
.invoice-party p{margin:6px 0;color:var(--text-muted)}
.invoice-table{margin-top:24px;border:1px solid var(--border)}
.invoice-table th,.invoice-table td{padding:14px 16px}
.invoice-totals{width:min(380px,100%);margin:22px 0 0 auto;display:grid;border:1px solid var(--border);border-radius:var(--radius-sm);overflow:hidden}
.invoice-totals div{display:flex;justify-content:space-between;gap:16px;padding:12px 14px;border-bottom:1px solid var(--border)}
.invoice-totals div:last-child{border-bottom:0}
.invoice-totals span{color:var(--text-muted)}
.invoice-grand-total{background:var(--accent-soft);color:var(--accent)}
.invoice-note{margin-top:22px}

.print-body{background:#f7f7f8;padding:28px}
.print-actions{max-width:920px;margin:0 auto 16px;display:flex;gap:8px;flex-wrap:wrap}
.print-page{max-width:980px;margin:0 auto;padding:0}
.inventory-label-print-page{
  max-width:560px;
}
.inventory-label-sheet{
  width:min(100%,420px);
  margin:0 auto;
  padding:20px;
  border:1px solid var(--border-strong);
  border-radius:var(--radius);
  background:#fff;
  color:#111827;
  box-shadow:var(--shadow-card);
}
.inventory-label-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding-bottom:10px;
  border-bottom:1px solid #e5e7eb;
}
.inventory-label-head span{
  color:#2563eb;
  font-weight:900;
  letter-spacing:.02em;
}
.inventory-label-head strong{
  color:#111827;
  font-size:12px;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.inventory-label-title{
  margin-top:14px;
}
.inventory-label-title h1{
  margin:0;
  font-size:20px;
  line-height:1.18;
}
.inventory-label-title p{
  margin:5px 0 0;
  color:#4b5563;
  font-weight:700;
}
.inventory-label-number{
  margin-top:16px;
  padding:12px;
  border:1px solid #d1d5db;
  border-radius:10px;
  background:#f9fafb;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}
.inventory-label-number span,
.inventory-label-meta span,
.inventory-label-foot span{
  color:#6b7280;
  font-size:11px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.inventory-label-number b{
  font:900 20px/1.1 var(--mono);
  overflow-wrap:anywhere;
}
.inventory-label-barcode{
  display:block;
  width:100%;
  height:104px;
  margin-top:14px;
  padding:8px;
  border:1px solid #d1d5db;
  border-radius:10px;
  object-fit:contain;
  background:#fff;
}
.inventory-label-meta{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px;
  margin-top:12px;
}
.inventory-label-meta div{
  min-width:0;
  padding:10px;
  border:1px solid #e5e7eb;
  border-radius:10px;
  background:#f9fafb;
}
.inventory-label-meta b{
  display:block;
  margin-top:5px;
  font-size:12px;
  color:#111827;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.inventory-label-foot{
  display:grid;
  grid-template-columns:86px minmax(0,1fr);
  gap:12px;
  align-items:center;
  margin-top:14px;
}
.inventory-label-foot.qr-only{
  grid-template-columns:128px minmax(0,1fr);
}
.inventory-label-foot.qr-only img{
  width:128px;
  height:128px;
}
.inventory-label-foot img{
  width:86px;
  height:86px;
  padding:6px;
  border:1px solid #d1d5db;
  border-radius:10px;
  background:#fff;
}
.inventory-label-foot code{
  display:block;
  margin-top:5px;
  color:#374151;
  font-size:10px;
  line-height:1.35;
  overflow-wrap:anywhere;
}
.leave-doc{max-width:820px;min-height:1120px;margin:0 auto;padding:62px 70px;border:1px solid var(--border);border-radius:var(--radius-sm);background:#fff;box-shadow:var(--shadow-card)}
.print-page img,
.leave-doc img,
.doc-brand img{max-width:240px;height:auto}
.leave-doc{color:#111;font:400 16px/1.7 Georgia,"Times New Roman",serif;overflow-wrap:break-word}
.document-text{white-space:normal}
.doc-addressee{width:min(310px,100%);margin:0 0 36px auto;text-align:right;font-size:15px;line-height:1.55}
.leave-doc h1{margin:0 0 34px;text-align:center;font:700 22px/1.3 Georgia,"Times New Roman",serif;letter-spacing:0;text-transform:uppercase}
.doc-subtitle{text-align:center;margin-top:-24px}
.doc-body-text p{margin:0 0 8px}
.doc-gap{height:12px}
.doc-date{margin-top:18px;font-weight:700}
.doc-sign-label{text-align:right;margin-top:20px}
.doc-sign{text-align:right}
.document-signature-stamp{width:min(330px,100%);margin:36px 0 0 auto;padding:16px;border:1px solid var(--accent);border-radius:var(--radius-sm);background:var(--accent-soft);font-family:Inter,ui-sans-serif,system-ui,sans-serif;font-size:13px;line-height:1.45;color:var(--text)}
.document-signature-stamp{display:grid;grid-template-columns:minmax(0,1fr) 88px;gap:14px;align-items:start}
.document-signature-stamp > strong{display:inline-flex;margin-bottom:6px;color:var(--accent);font-size:12px;letter-spacing:.04em}
.document-signature-stamp > div > strong{display:inline-flex;margin-bottom:6px;color:var(--accent);font-size:12px;letter-spacing:.04em}
.document-signature-stamp p{margin:0 0 10px}
.document-signature-stamp dl{display:grid;gap:6px;margin:0}
.document-signature-stamp dl div{display:grid;grid-template-columns:92px minmax(0,1fr);gap:8px}
.document-signature-stamp dt{color:var(--text-muted)}
.document-signature-stamp dd{margin:0;font-weight:600;overflow-wrap:anywhere}
.document-verify-qr{width:88px;height:88px;border:1px solid var(--border);border-radius:8px;background:#fff}
.document-verify-footer{display:grid;grid-template-columns:auto minmax(0,1fr);gap:10px;margin-top:14px;padding-top:10px;border-top:1px solid var(--border);font-family:Inter,ui-sans-serif,system-ui,sans-serif;font-size:12px;color:var(--text-muted)}
.doc-footer{margin-top:32px;padding-top:18px;border-top:1px solid var(--border);color:var(--text-muted)}
.public-policy-page{min-height:100vh;background:var(--surface-soft);padding:48px 20px}
.verify-document-page{padding:28px;border:1px solid var(--border);border-radius:var(--radius-lg);background:#fff;box-shadow:var(--shadow-card)}
.verify-status{display:inline-flex;align-items:center;min-height:30px;margin:0 0 18px;padding:0 12px;border-radius:999px;background:var(--surface-soft);color:var(--text-muted);font-weight:700}
.verify-status.valid{background:var(--success-soft);color:var(--success)}
.verify-status.revoked,
.verify-status.changed{background:var(--danger-soft);color:var(--danger)}
.settings-panel{margin:18px 0;padding:0}
.verify-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:0}
.verify-grid div{padding:12px;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface-soft)}
.verify-grid dt{color:var(--text-muted);font-size:12px}
.verify-grid dd{margin:4px 0 0;font-weight:700;overflow-wrap:anywhere}

.documents-page{display:grid;gap:18px}
.document-tabs{margin:0}
.documents-filter-card{padding:18px}
.document-filters{align-items:end}
.document-list{display:grid;gap:10px}
.document-row{
  display:grid;
  grid-template-columns:minmax(260px,1.2fr) minmax(220px,.9fr) auto;
  gap:14px;
  align-items:center;
  padding:14px;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  background:#fff;
}
.document-row-main{display:flex;align-items:center;gap:12px;min-width:0}
.document-row-main h3{margin:0;font-size:15px}
.document-row-main p,
.document-row-main small{display:block;margin:2px 0 0;color:var(--text-muted);overflow-wrap:anywhere}
.document-row-meta{display:grid;gap:5px;min-width:0;color:var(--text-muted);font-size:13px}
.document-row-meta > span:not(.badge){font-weight:700;color:var(--text);overflow-wrap:anywhere}
.document-row-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:7px}
.document-audit-list .mini-list{display:grid;gap:8px}
.document-audit-list .mini-list div{padding:10px;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface-soft)}
.document-audit-list .mini-list small{display:block;margin-top:3px;color:var(--text-muted);overflow-wrap:anywhere}

/* Context drawer system: desktop side drawer, mobile bottom sheet via mobile.css. */
.context-drawer{
  position:fixed;
  inset:0;
  z-index:5600;
  pointer-events:none;
}
.context-drawer.open{pointer-events:auto}
.context-drawer-backdrop{
  position:absolute;
  inset:0;
  background:rgb(17 17 17 / .22);
  opacity:0;
  transition:opacity .18s ease;
}
.context-drawer.open .context-drawer-backdrop{opacity:1}
.context-drawer-panel{
  position:absolute;
  inset:0 0 0 auto;
  width:min(520px,100vw);
  display:grid;
  grid-template-rows:auto minmax(0,1fr);
  border-left:1px solid var(--border);
  background:#fff;
  box-shadow:var(--shadow-popout);
  transform:translateX(100%);
  transition:transform .2s ease;
  outline:0;
}
.context-drawer.open .context-drawer-panel{transform:translateX(0)}
.drawer-open{overflow:hidden}
.context-drawer-head{
  min-width:0;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  padding:18px 20px;
  border-bottom:1px solid var(--border);
}
.context-drawer-head span{
  color:var(--text-soft);
  font:700 11px/1 var(--mono);
  letter-spacing:.12em;
  text-transform:uppercase;
}
.context-drawer-head h2{
  margin:6px 0 2px;
  font-size:22px;
  line-height:1.15;
  letter-spacing:0;
}
.context-drawer-head p{margin:0;color:var(--text-muted)}
.context-drawer-head button{
  width:36px;
  height:36px;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  background:#fff;
  color:var(--text);
  font-size:22px;
  line-height:1;
}
.context-drawer-body{
  min-width:0;
  min-height:0;
  overflow:auto;
  padding:20px;
}
.cookie-banner{
  position:fixed;
  left:18px;
  right:18px;
  bottom:18px;
  z-index:6200;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  max-width:980px;
  margin:0 auto;
  padding:14px 16px;
  border:1px solid var(--border);
  border-radius:var(--radius-md);
  background:#fff;
  box-shadow:var(--shadow-popout);
}
.cookie-banner p,
.privacy-note p{margin:4px 0 0;color:var(--text-muted)}
.cookie-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.cookie-actions a{color:var(--accent);font-weight:700;text-decoration:none}
.cookie-settings-body{display:grid;gap:12px;padding:0 22px 18px}
.choice-card.muted{opacity:.72}
.privacy-note{
  padding:14px;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  background:var(--surface-soft);
}
.danger-zone-form{margin-top:14px}
.inline-note-input{
  width:min(160px,32vw);
  min-height:32px;
  padding:0 10px;
  font-size:12px;
}
.deletion-requests-panel .employee-profile-list>div{align-items:center}
.policy-page{display:grid;gap:16px}
.policy-list{display:grid;gap:12px}
.policy-list>div{
  padding:14px;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  background:var(--surface-soft);
}
.policy-list p{margin:4px 0 0;color:var(--text-muted)}
.context-detail,
.ticket-detail-fragment{
  display:grid;
  gap:14px;
}
.context-detail-grid,
.request-detail-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
}
.context-detail-grid>div,
.request-detail-grid>div{
  min-width:0;
  padding:12px;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  background:var(--surface-soft);
}
.context-detail-grid .full,
.request-detail-grid .full{grid-column:1/-1}
.context-detail-grid span,
.request-detail-grid span{
  display:block;
  color:var(--text-muted);
  font-size:12px;
}
.context-detail-grid b,
.request-detail-grid b{
  display:block;
  margin-top:3px;
  overflow-wrap:anywhere;
}
.context-detail-grid small,
.request-detail-grid small{
  display:block;
  margin-top:3px;
  color:var(--text-soft);
}
.context-person-head{
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  gap:12px;
  align-items:center;
}
.context-avatar{
  width:48px;
  height:48px;
  border-radius:999px;
  display:grid;
  place-items:center;
  border:1px solid var(--border);
  background:var(--accent-soft);
  color:var(--accent);
  font-weight:800;
  overflow:hidden;
}
.context-avatar img{width:100%;height:100%;object-fit:cover}
.context-person-head b{display:block;font-size:16px}
.context-person-head span{color:var(--text-muted)}
.context-list{
  display:grid;
  gap:8px;
}
.context-list button,
.attendance-exception-row{
  width:100%;
  min-width:0;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:12px;
  align-items:center;
  padding:10px 12px;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  background:#fff;
  text-align:left;
}
.context-list button:hover,
.attendance-exception-row:hover{border-color:var(--border-strong);background:var(--surface-soft)}
.context-list span,
.attendance-exception-row small{color:var(--text-muted);font-size:12px}
.context-list b,
.attendance-exception-row b{overflow-wrap:anywhere}
.context-inventory-list{
  display:grid;
  gap:8px;
}
.context-inventory-row{
  min-width:0;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:12px;
  align-items:center;
  padding:10px 12px;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  background:#fff;
  color:inherit;
  text-decoration:none;
}
.context-inventory-row:hover{
  border-color:var(--border-strong);
  background:var(--surface-soft);
}
.context-inventory-row span{min-width:0}
.context-inventory-row b{
  display:block;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.context-inventory-row small{
  display:block;
  color:var(--text-muted);
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.dashboard-context-detail{
  display:grid;
  gap:14px;
}
.dashboard-context-count{
  display:flex;
  align-items:baseline;
  gap:8px;
  padding:12px 14px;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  background:var(--surface-soft);
}
.dashboard-context-count strong{font-size:24px;line-height:1}
.dashboard-context-count span{color:var(--text-muted)}
.dashboard-context-list{
  display:grid;
  gap:10px;
}
.dashboard-context-row{
  min-width:0;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:12px;
  align-items:center;
  padding:12px;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  background:#fff;
}
.dashboard-context-main{
  min-width:0;
  display:grid;
  grid-template-columns:40px minmax(0,1fr);
  gap:10px;
  align-items:center;
}
.dashboard-context-main .context-avatar{
  width:40px;
  height:40px;
}
.dashboard-context-main b,
.dashboard-context-main span,
.dashboard-context-main small{
  display:block;
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.dashboard-context-main span,
.dashboard-context-main small{color:var(--text-muted);font-size:12px}
.dashboard-context-meta{
  display:grid;
  justify-items:end;
  gap:8px;
}
.context-actions{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
}
.context-actions form{display:inline-flex}
.qr-card-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  flex-wrap:wrap;
}
.qr-card img,
.attendance-pass-preview img,
.qr-result-preview img{
  width:150px;
  max-width:100%;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  background:#fff;
}
.qr-link-box,
.qr-pin-box{
  display:grid;
  gap:5px;
  min-width:0;
  padding:10px 12px;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  background:var(--surface-soft);
}
.qr-link-box span,
.qr-pin-box span{
  color:var(--text-muted);
  font-size:12px;
  font-weight:700;
}
.qr-link-box code,
.qr-pin-box code{
  display:block;
  min-width:0;
  overflow-wrap:anywhere;
  font:600 12px/1.45 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  color:var(--text);
}
.qr-result-modal{width:min(520px,calc(100vw - 32px))}
.qr-result-body{
  display:grid;
  gap:14px;
  padding:18px;
}
.qr-result-status{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:10px 12px;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  background:#fff;
}
.qr-result-status span{color:var(--text-muted);font-size:12px;font-weight:700}
.qr-result-status b.success{color:var(--success)}
.qr-result-status b.danger{color:var(--danger)}
.qr-result-preview{
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  align-items:center;
  gap:14px;
}
.qr-result-preview b,
.qr-result-preview small{display:block}
.qr-result-preview small{color:var(--text-muted)}
.qr-scan-page{
  width:100%;
  max-width:520px;
  margin:0 auto;
  padding:32px;
}
.qr-scan-card{display:grid;gap:16px}
.avatar-upload-preview{
  width:52px;
  height:52px;
  padding:0;
  border:1px solid var(--border);
  border-radius:999px;
  display:grid;
  place-items:center;
  overflow:hidden;
  background:var(--accent-soft);
  color:var(--accent);
  font-weight:800;
}
.avatar-upload-preview img{width:100%;height:100%;object-fit:cover}
.avatar-upload-modal{width:min(420px,calc(100vw - 32px))}
.avatar-upload-modal-form{
  display:grid;
  justify-items:center;
  gap:16px;
  padding:20px;
}
.avatar-upload-modal-preview{
  width:96px;
  height:96px;
  font-size:28px;
}
.employee-avatar-upload{
  display:grid;
  justify-items:center;
  gap:10px;
}
.employee-avatar-upload .avatar-upload-large{
  padding:0;
  border:0;
  border-radius:999px;
  background:transparent;
}
.workplace-access-form{
  display:grid;
  gap:12px;
}
.workplace-access-list{
  display:grid;
  gap:8px;
}
.workplace-access-row{
  grid-template-columns:auto minmax(0,1fr);
  align-items:center;
  gap:10px;
  padding:10px 12px;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  background:#fff;
}
.workplace-access-row span{display:block}
.workplace-access-row small{display:block;color:var(--text-muted)}
.compact-search{
  width:min(260px,100%);
  min-height:36px;
}
.attendance-pass-preview{
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  gap:12px;
  align-items:center;
}
.attendance-pass-preview b,
.attendance-pass-preview small,
.attendance-pass-preview a{display:block}
.attendance-pass-preview small{color:var(--text-muted)}
.attendance-page{
  display:grid;
  gap:18px;
  min-width:0;
}
.attendance-hero{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:18px;
  padding:22px;
}
.attendance-hero-main{
  min-width:0;
  display:grid;
  gap:4px;
}
.attendance-hero-main h2{
  margin:0;
  font-size:clamp(26px,3vw,36px);
  line-height:1.05;
}
.attendance-hero-main p{
  margin:0;
  color:var(--text-muted);
}
.attendance-hero-actions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:8px;
  flex-wrap:wrap;
}
.attendance-export-menu{
  position:relative;
}
.attendance-export-menu summary{
  list-style:none;
}
.attendance-export-menu summary::-webkit-details-marker{display:none}
.attendance-export-panel{
  position:absolute;
  right:0;
  top:calc(100% + 8px);
  z-index:12;
  min-width:190px;
  display:grid;
  gap:4px;
  padding:8px;
  border:1px solid var(--border);
  border-radius:var(--radius-md);
  background:var(--surface);
  box-shadow:var(--shadow-popout);
}
.attendance-export-panel a{
  padding:9px 10px;
  border-radius:var(--radius-sm);
  color:var(--text);
  text-decoration:none;
  font-weight:650;
}
.attendance-export-panel a:hover{
  background:var(--surface-soft);
}
.attendance-toolbar-card{
  padding:16px;
}
.attendance-filter{
  display:grid;
  grid-template-columns:repeat(4,minmax(150px,max-content));
  align-items:center;
  justify-content:start;
  gap:10px;
}
.attendance-filter label{
  min-width:0;
  display:grid;
  gap:6px;
  color:var(--text-soft);
  font-size:12px;
  font-weight:700;
}
.attendance-filter input,
.attendance-filter select{
  width:100%;
  min-width:160px;
}
.attendance-export-actions{
  margin-top:14px;
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}
.attendance-kpi-grid{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:12px;
}
.attendance-kpi-card{
  min-width:0;
  display:grid;
  gap:8px;
  padding:16px;
  border:1px solid var(--border);
  border-radius:var(--radius-md);
  background:var(--surface);
  box-shadow:var(--shadow-card);
}
.attendance-kpi-card span{
  color:var(--text-muted);
  font-size:12px;
  font-weight:750;
  text-transform:uppercase;
  letter-spacing:.04em;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.attendance-kpi-card strong{
  font-size:28px;
  line-height:1;
  font-variant-numeric:tabular-nums;
}
.attendance-object-card,
.attendance-register-card{
  padding:20px;
  overflow:hidden;
}
.attendance-object-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(170px,1fr));
  gap:10px;
}
.attendance-object-tile{
  min-width:0;
  display:grid;
  gap:4px;
  padding:14px;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  background:var(--surface-soft);
}
.attendance-object-tile b,
.attendance-object-tile span{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.attendance-object-tile span{
  color:var(--text-muted);
  font-size:13px;
  font-weight:650;
}
.attendance-register-wrap{
  min-width:0;
  overflow:auto;
  border:1px solid var(--border);
  border-radius:10px;
  background:var(--surface);
  -webkit-overflow-scrolling:touch;
  scrollbar-gutter:stable;
}
.attendance-register-table{
  width:100%;
  min-width:1180px;
  border-collapse:separate;
  border-spacing:0;
}
.attendance-register-table th,
.attendance-register-table td{
  padding:12px 14px;
  border-bottom:1px solid var(--border);
  text-align:left;
  vertical-align:middle;
}
.attendance-register-table tr:last-child td{
  border-bottom:0;
}
.attendance-register-table th{
  background:var(--surface-soft);
  color:var(--text-soft);
  font-size:12px;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
  white-space:nowrap;
}
.attendance-register-table tbody tr{
  transition:background .16s ease;
}
.attendance-register-table tbody tr:hover{
  background:var(--surface-soft);
}
.attendance-register-table td{
  min-width:0;
  color:var(--text);
  font-size:14px;
}
.attendance-register-table td:not(:first-child){
  white-space:nowrap;
}
.attendance-employee-cell{
  min-width:0;
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  align-items:center;
  gap:10px;
}
.attendance-employee-cell b,
.attendance-employee-cell small{
  display:block;
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.attendance-employee-cell small{
  margin-top:2px;
  color:var(--text-muted);
}
.attendance-avatar{
  flex:0 0 auto;
}
.attendance-status{
  border:1px solid transparent;
  white-space:nowrap;
}
.attendance-status-working{
  background:var(--success-soft);
  color:var(--success);
  border-color:color-mix(in srgb,var(--success) 22%,transparent);
}
.attendance-status-done{
  background:var(--accent-soft);
  color:var(--accent);
  border-color:color-mix(in srgb,var(--accent) 22%,transparent);
}
.attendance-status-late{
  background:var(--warning-soft);
  color:var(--warning);
  border-color:color-mix(in srgb,var(--warning) 22%,transparent);
}
.attendance-status-noshow{
  background:var(--danger-soft);
  color:var(--danger);
  border-color:color-mix(in srgb,var(--danger) 22%,transparent);
}
.attendance-status-missing{
  background:color-mix(in srgb,var(--warning-soft) 75%,var(--surface));
  color:var(--warning);
  border-color:color-mix(in srgb,var(--warning) 18%,transparent);
}
.attendance-status-exception{
  background:var(--accent-soft);
  color:var(--accent);
  border-color:color-mix(in srgb,var(--accent) 22%,transparent);
}
.attendance-status-pending{
  background:var(--surface-soft);
  color:var(--text-muted);
  border-color:var(--border);
}
.attendance-register-wrap::-webkit-scrollbar{height:10px}
.attendance-register-wrap::-webkit-scrollbar-track{background:var(--surface-soft)}
.attendance-register-wrap::-webkit-scrollbar-thumb{background:var(--border-strong);border-radius:999px}
.qr-scanner-page{
  max-width:720px;
  margin:0 auto;
  min-width:0;
}
.qr-scanner-card{
  display:grid;
  gap:16px;
}
.qr-camera-shell{
  position:relative;
  overflow:hidden;
  display:grid;
  place-items:center;
  aspect-ratio:4/3;
  min-height:0;
  max-height:60vh;
  border:1px solid var(--border);
  border-radius:var(--radius-md);
  background:#0f172a;
}
.qr-camera-shell video{
  width:100%;
  height:100%;
  min-width:0;
  min-height:0;
  display:block;
  object-fit:contain;
  background:#0f172a;
}
.qr-scan-frame{
  position:absolute;
  inset:18%;
  border:2px solid rgb(255 255 255 / .9);
  border-radius:18px;
  box-shadow:0 0 0 999px rgb(15 23 42 / .34);
}
.qr-scanner-status{
  position:absolute;
  left:14px;
  right:14px;
  bottom:14px;
  margin:0;
  padding:10px 12px;
  border-radius:var(--radius-sm);
  background:rgb(255 255 255 / .92);
  color:var(--text);
  font-weight:650;
}
.qr-manual-form{
  padding-top:4px;
}
.qr-scanner-actions{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  align-items:stretch;
}
.qr-scanner-actions .btn{
  width:100%;
  min-height:42px;
  justify-content:center;
}
.qr-file-button input{display:none}
.qr-scanner-help{
  margin:0;
  color:var(--text-muted);
  font-size:13px;
}
.mobile-qr-fab{display:none}
body.qr-scanner-active .mobile-qr-fab{display:none!important}
.notification-item .vs-list-main p,
.notif-item small{
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.notification-expanded-content{display:grid;gap:12px}
.notification-section h4{margin:0 0 8px;font-size:14px}
.notification-section ul{margin:0;padding-left:18px;color:var(--text)}
.notification-section li{margin:4px 0}
.attendance-exceptions-card{margin-top:18px}
.attendance-exception-list{
  display:grid;
  gap:8px;
}
.attendance-exception-row{
  grid-template-columns:minmax(180px,1fr) minmax(140px,.8fr) auto;
}
@media(max-width:1100px){
  .attendance-kpi-grid{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
}
@media(max-width:760px){
  .attendance-page{
    gap:14px;
  }
  .attendance-hero{
    grid-template-columns:1fr;
    align-items:start;
    padding:18px;
  }
  .attendance-hero-actions{
    width:100%;
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .attendance-hero-actions .btn,
  .attendance-export-menu,
  .attendance-export-menu summary{
    width:100%;
  }
  .attendance-export-panel{
    position:fixed;
    left:14px;
    right:14px;
    top:auto;
    bottom:calc(16px + env(safe-area-inset-bottom));
  }
  .attendance-toolbar-card,
  .attendance-object-card,
  .attendance-register-card{
    padding:14px;
  }
  .attendance-filter{
    grid-template-columns:1fr;
  }
  .attendance-kpi-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
  }
  .attendance-kpi-card{
    min-height:92px;
    padding:14px;
  }
  .attendance-kpi-card strong{
    font-size:24px;
  }
  .attendance-object-grid{
    grid-template-columns:1fr;
  }
  .attendance-register-wrap{
    overflow:visible;
    border:0;
    border-radius:0;
    background:transparent;
  }
  .attendance-register-table{
    min-width:0;
    display:block;
  }
  .attendance-register-table thead{
    display:none;
  }
  .attendance-register-table tbody{
    display:grid;
    gap:10px;
  }
  .attendance-register-table tr{
    display:grid;
    gap:0;
    border:1px solid var(--border);
    border-radius:var(--radius-md);
    background:var(--surface);
    box-shadow:var(--shadow-card);
    overflow:hidden;
  }
  .attendance-register-table td{
    display:grid;
    grid-template-columns:minmax(112px,.42fr) minmax(0,1fr);
    gap:12px;
    align-items:center;
    padding:10px 12px;
    border-bottom:1px solid var(--border);
    white-space:normal!important;
  }
  .attendance-register-table td::before{
    content:attr(data-label);
    min-width:0;
    color:var(--text-soft);
    font-size:11px;
    font-weight:800;
    letter-spacing:.06em;
    text-transform:uppercase;
  }
  .attendance-register-table td:last-child{
    border-bottom:0;
  }
  .attendance-register-table td[colspan]{
    display:block;
  }
  .attendance-register-table td[colspan]::before{
    content:"";
    display:none;
  }
  .attendance-register-table td .btn{
    justify-self:start;
  }
  .attendance-employee-cell{
    min-width:0;
  }
}
.loc-access-list.compact{
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
}
select,
.rows-select,
.loc-control,
.list-rows-select{
  background-color:#fff;
  border-color:var(--border-strong);
}
.dropdown-wrap{position:relative}
.export-dropdown,
.notif-dropdown,
.avatar-menu,
.global-search-results{
  z-index:5450;
}

@media(max-width:900px){
  .leave-register-card,
  .document-register-card,
  .audit-register-card{
    overflow:visible;
  }
  .leave-register-table,
  .document-register-table,
  .audit-register-table{
    border:0;
    border-radius:0;
    background:transparent;
    gap:10px;
    overflow:visible;
  }
  .leave-register-head,
  .document-register-head,
  .audit-register-head{
    display:none;
  }
  .leave-register-row,
  .document-register-row,
  .audit-register-row{
    min-width:0;
    grid-template-columns:1fr 1fr;
    gap:8px 14px;
    padding:12px;
    border:1px solid var(--border);
    border-radius:10px;
    background:var(--surface);
  }
  .leave-register-row>div:last-child,
  .document-register-row>div:last-child,
  .audit-register-row>div:last-child{
    position:static;
    box-shadow:none;
    background:transparent;
    border-left:0;
  }
  .leave-register-cell,
  .document-register-cell,
  .audit-register-cell{
    padding:0;
    display:grid;
    gap:3px;
    font-size:13px;
  }
  .leave-register-cell::before,
  .document-register-cell::before,
  .audit-register-cell::before{
    content:attr(data-label);
    color:var(--text-soft);
    font:600 10px/1.2 var(--mono);
    letter-spacing:.08em;
    text-transform:uppercase;
  }
  .name-cell,
  .document-name-cell,
  .user-cell,
  .action-cell,
  .details-cell,
  .comment-cell,
  .actions-cell{
    grid-column:1/-1;
  }
  .leave-register-cell strong,
  .document-name-cell strong,
  .audit-register-cell strong,
  .user-cell,
  .action-cell,
  .object-cell,
  .details-cell,
  .creator-cell,
  .type-cell,
  .document-cell,
  .comment-cell{
    white-space:normal;
  }
  .comment-cell,
  .details-cell{
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
  }
  .actions-cell{
    justify-content:stretch;
  }
  .actions-cell .btn{
    width:100%;
    justify-content:center;
  }
}

@media(max-width:720px){
  .vs-form-grid{grid-template-columns:1fr}
  .vs-form-footer,
  .vs-inline-form{
    align-items:stretch;
    justify-content:stretch;
  }
  .vs-form-footer .btn,
  .vs-inline-form .btn{width:100%;justify-content:center}
}

@media print{
  @page{size:A4;margin:16mm}
  .sidebar,.top,.print-actions,.actions{display:none!important}
  .main{margin:0!important;padding:0!important}
  .print-body{background:#fff;padding:0}
  .print-page,.leave-doc,.invoice-paper{max-width:none;border:0;box-shadow:none;border-radius:0;padding:0}
  .inventory-label-print-page{max-width:none}
  .inventory-label-sheet{
    width:92mm;
    margin:0 auto;
    padding:6mm;
    border:1px solid #000;
    border-radius:4mm;
    box-shadow:none;
    break-inside:avoid;
  }
  .leave-doc{min-height:0;font-size:11.5pt;line-height:1.45}
  .doc-addressee{margin-bottom:22px}
  .leave-doc h1{margin-bottom:22px;font-size:16pt}
  .doc-gap{height:7px}
  .document-signature-stamp,
  .document-verify-footer{break-inside:avoid;page-break-inside:avoid}
  .document-signature-stamp{margin-top:20px;padding:10px;grid-template-columns:minmax(0,1fr) 76px;font-size:9pt}
  .document-verify-qr{width:76px;height:76px}
  .notice{display:none}
}