:root{
  --v21-primary:#2457e6;
  --v21-primary-2:#4a7dff;
  --v21-ink:#142033;
  --v21-muted:#718096;
  --v21-bg:#f5f7fb;
  --v21-line:#e6ebf2;
  --v21-nav:#0a1733;
  --v21-nav-2:#10234d;
  --v21-success:#138a61;
  --v21-danger:#c52e42;
  --v21-shadow:0 12px 38px rgba(24,42,74,.07);
  --v21-radius:16px;
}
html,body{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;letter-spacing:-.01em;background:var(--v21-bg);color:var(--v21-ink)}
body{-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
button,input,select,textarea{font:inherit}
.v21-topbar{height:76px;padding:0 24px;background:rgba(255,255,255,.96);backdrop-filter:blur(12px);box-shadow:0 1px 0 rgba(13,32,65,.04)}
.topbar-left,.topbar-user{display:flex;align-items:center;gap:12px}.v21-brand{gap:11px}.brand-mark{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;background:#f3f6fb;overflow:hidden}.brand-mark img{height:30px;width:auto}.brand-copy{display:flex;flex-direction:column;gap:2px;line-height:1}.brand-copy strong{font-size:15px;letter-spacing:.02em}.brand-copy small{font-size:11px;color:var(--v21-muted);max-width:210px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.icon-btn{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border:1px solid var(--v21-line);border-radius:11px;background:#fff;color:#334155}.icon-btn:hover{border-color:#cbd6e6;background:#f9fbff}.ui-icon{display:block;flex:0 0 auto}
.v21-search{height:42px;max-width:500px;border:1px solid var(--v21-line);border-radius:12px;background:#f8faff;box-shadow:inset 0 1px 0 #fff}.v21-search input{height:40px;background:transparent!important;border:0!important;box-shadow:none!important;padding-left:0!important}.v21-search button{height:32px;padding:0 12px;border:0;border-radius:8px;background:#eaf0ff;color:var(--v21-primary);font-weight:800;cursor:pointer}.v21-search>.ui-icon{margin-left:12px;color:#8190a8}
.user-chip{display:flex;align-items:center;gap:9px}.avatar{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:linear-gradient(135deg,#dbe7ff,#edf3ff);color:#2457e6;font-weight:900;font-size:14px}.user-meta{display:flex;flex-direction:column;gap:2px;min-width:0}.user-meta strong{font-size:13px;max-width:150px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.user-meta small{font-size:11px;color:var(--v21-muted)}
.v21-layout{min-height:calc(100vh - 76px)}.v21-sidebar{width:270px;padding:14px 12px;background:linear-gradient(180deg,var(--v21-nav),var(--v21-nav-2));border-right:1px solid rgba(255,255,255,.04);top:76px;height:calc(100vh - 76px)}.sidebar-inner{height:100%;display:flex;flex-direction:column}.side-heading{padding:10px 12px 8px;color:#87a0cb;font-size:10px;font-weight:900;letter-spacing:.12em;text-transform:uppercase}.v21-nav{display:flex;flex-direction:column;gap:3px}.v21-nav a{display:flex;align-items:center;gap:11px;padding:10px 12px;border-radius:11px;color:#d6e1f7;font-size:13px;font-weight:700;transition:.15s ease}.v21-nav a:hover{background:rgba(255,255,255,.065);color:#fff;transform:translateX(1px)}.v21-nav a.active{background:linear-gradient(90deg,rgba(74,125,255,.22),rgba(74,125,255,.09));box-shadow:inset 3px 0 0 #6e96ff;color:#fff}.nav-icon{width:22px;display:grid;place-items:center;color:#9eb5de}.v21-nav a.active .nav-icon,.v21-nav a:hover .nav-icon{color:#fff}
.subscription-card{margin:16px 8px 8px;padding:13px;border-radius:13px;background:linear-gradient(145deg,rgba(255,255,255,.075),rgba(255,255,255,.035));border:1px solid rgba(255,255,255,.09)}.subscription-kicker{font-size:10px;letter-spacing:.1em;color:#91a9d1;font-weight:900}.subscription-name{color:#fff;font-weight:900;margin-top:6px}.subscription-state{font-size:11px;color:#bed0f1;margin-top:3px}
.v21-content{padding:28px;min-width:0}.content>.page-head{margin-bottom:22px}.content h1{font-size:30px;letter-spacing:-.035em}.content h2{font-size:18px;letter-spacing:-.02em}.content h3{font-size:16px}
.content .card{border:1px solid var(--v21-line);border-radius:var(--v21-radius);box-shadow:var(--v21-shadow)}.content .stat-value{letter-spacing:-.03em}.content .btn{border-radius:11px;min-height:41px}.content .btn-primary{background:linear-gradient(135deg,var(--v21-primary),var(--v21-primary-2));box-shadow:0 6px 16px rgba(36,87,230,.18)}.content .btn-light{border:1px solid #e0e7f0;background:#fff}.content .table th{letter-spacing:.08em}.content .table td{font-size:13px}.content .field input,.content .field select,.content .field textarea{min-height:44px;border-radius:11px;border-color:#dfe6ef}.content .field input:focus,.content .field select:focus,.content .field textarea:focus{border-color:#8eadf8;box-shadow:0 0 0 4px rgba(36,87,230,.09)}
/* Security guard application */
.security-guard-page{min-height:100vh;background:linear-gradient(180deg,#f4f7fb,#edf2f8)}.guard-topbar{height:74px;background:#09152d;color:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 28px;box-shadow:0 8px 26px rgba(7,20,44,.16)}.guard-brand,.guard-top-actions{display:flex;align-items:center}.guard-brand{gap:11px;color:#fff}.guard-brand-mark{display:grid;place-items:center;width:43px;height:43px;border-radius:12px;background:#fff}.guard-brand-mark img{height:30px}.guard-brand span>strong,.guard-brand span>small{display:block}.guard-brand span>strong{font-size:14px}.guard-brand span>small{font-size:11px;color:#a5b8d7;margin-top:2px}.guard-top-actions{gap:12px}.guard-user{display:flex;align-items:center;gap:8px;font-size:12px;color:#cbd8ed}.guard-logout{display:inline-flex;align-items:center;gap:7px;color:#fff;font-weight:800;font-size:12px;padding:9px 12px;border:1px solid rgba(255,255,255,.13);border-radius:10px}.guard-main{max-width:1220px;margin:0 auto;padding:28px}.guard-hero{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;margin-bottom:20px}.guard-hero h1{font-size:31px;letter-spacing:-.04em;margin:8px 0 7px}.guard-hero p{margin:0;color:#6d7b91}.eyebrow,.guard-section-kicker{display:flex;align-items:center;gap:7px;color:#2f5fe3;font-size:10px;font-weight:900;letter-spacing:.13em}.guard-clock-card{min-width:136px;padding:12px 16px;border:1px solid #dfe6ef;background:#fff;border-radius:14px;box-shadow:0 10px 28px rgba(24,42,74,.06);text-align:right}.guard-clock-card span,.guard-clock-card small{display:block;color:#7f8ea5;font-size:9px;letter-spacing:.12em;font-weight:900}.guard-clock-card strong{display:block;font-size:27px;letter-spacing:-.04em;margin:2px 0}.guard-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-bottom:16px}.guard-stat{display:flex;align-items:center;gap:13px;padding:16px;background:#fff;border:1px solid var(--v21-line);border-radius:14px;box-shadow:0 8px 25px rgba(24,42,74,.05)}.guard-stat small,.guard-stat strong{display:block}.guard-stat small{color:#738197;font-size:11px}.guard-stat strong{font-size:26px;margin-top:2px}.guard-stat-icon{width:42px;height:42px;border-radius:12px;display:grid;place-items:center}.guard-stat-icon.blue{background:#eaf0ff;color:#2e61e4}.guard-stat-icon.green{background:#e8f8f1;color:#16865d}.guard-grid{display:grid;grid-template-columns:minmax(0,420px) minmax(0,1fr);gap:16px;align-items:start}.guard-card{background:#fff;border:1px solid var(--v21-line);border-radius:16px;box-shadow:0 10px 28px rgba(24,42,74,.06);padding:20px}.guard-card-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:16px}.guard-card-head h2{font-size:18px;margin:5px 0 0}.guard-badge,.guard-live{display:inline-flex;align-items:center;gap:6px;padding:7px 9px;border-radius:999px;font-size:10px;font-weight:900}.guard-badge{background:#eef3ff;color:#2e5fe1}.guard-live{background:#edf9f4;color:#138a61}.guard-live i{display:block;width:7px;height:7px;border-radius:50%;background:#17a871;box-shadow:0 0 0 4px rgba(23,168,113,.12)}.guard-form{display:grid;gap:11px}.guard-form-row{display:grid;grid-template-columns:1fr 1fr;gap:11px}.guard-field label{font-size:11px;color:#58677e;font-weight:800}.guard-field label span{font-weight:500;color:#8996aa}.guard-field input,.guard-field select,.guard-field textarea{background:#fbfcfe}.guard-submit{display:flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:11px;min-height:46px;background:linear-gradient(135deg,#2457e6,#4a7dff);color:#fff;font-weight:900;cursor:pointer;box-shadow:0 7px 16px rgba(36,87,230,.2)}.guard-submit:hover{filter:brightness(1.03);transform:translateY(-1px)}.guard-live-list{display:grid}.guard-visitor-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 0;border-top:1px solid #edf0f4}.guard-visitor-main{display:flex;align-items:center;gap:10px;min-width:0}.guard-person-icon{display:grid;place-items:center;width:38px;height:38px;border-radius:11px;background:#f1f5fb;color:#52657f;flex:0 0 auto}.guard-visitor-main strong{font-size:13px}.guard-visitor-main p{margin:3px 0 0;color:#78869b;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.guard-exit{border:1px solid #dfe7f0;background:#fff;padding:8px 10px;border-radius:9px;color:#b33543;font-size:11px;font-weight:900;cursor:pointer}.guard-exit:hover{background:#fff3f4}.guard-empty{text-align:center;padding:34px 14px;color:#7c8ba0}.guard-empty span{display:grid;place-items:center;width:48px;height:48px;border-radius:14px;background:#f3f6fb;margin:0 auto 10px}.guard-empty strong,.guard-empty small{display:block}.guard-empty strong{font-size:13px}.guard-empty small{margin-top:4px;font-size:11px}.guard-history-card{margin-top:16px}.status-pill{display:inline-flex;align-items:center;padding:6px 9px;border-radius:999px;font-size:10px;font-weight:900}.status-pill.inside{background:#eaf8f2;color:#14855f}.status-pill.exited{background:#f1f4f7;color:#66758b}
@media(max-width:1000px){.v21-search{max-width:340px}.v21-sidebar{width:238px}.guard-grid{grid-template-columns:1fr}.guard-main{max-width:880px}}
@media(max-width:760px){.v21-topbar{height:66px;padding:0 12px}.v21-layout{min-height:calc(100vh - 66px)}.v21-sidebar{top:66px;height:calc(100vh - 66px);width:280px}.brand-copy small{max-width:120px}.topbar-user .user-meta{display:none}.v21-content{padding:17px}.guard-topbar{height:auto;min-height:68px;padding:10px 13px}.guard-top-actions{gap:7px}.guard-user{display:none}.guard-main{padding:18px 13px}.guard-hero{align-items:stretch}.guard-hero h1{font-size:26px}.guard-clock-card{min-width:108px}.guard-form-row{grid-template-columns:1fr}.guard-stats{gap:10px}.guard-stat{padding:13px}.guard-stat strong{font-size:23px}.guard-card{padding:15px}.guard-table th:nth-child(4),.guard-table td:nth-child(4){display:none}}
.badge-success{display:inline-flex;align-items:center;min-height:34px;padding:0 10px;border-radius:999px;background:#eaf8f2;color:#16865d;font-size:11px;font-weight:900}
.status-pill.inside{background:#eaf8f2;color:#16855f}.status-pill.exited{background:#f1f4f7;color:#66758b}
/* Resident portal polish */
.resident-v21-body{background:linear-gradient(180deg,#f5f8fc,#eef3f8)}.resident-v21-topbar{height:74px;box-shadow:0 4px 22px rgba(17,45,79,.06)}.resident-brand-mark{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;background:#f2f5f9}.resident-brand-mark img{height:29px}.resident-v21-side{background:linear-gradient(180deg,#102b4c,#0c2441);box-shadow:inset -1px 0 rgba(255,255,255,.04)}.resident-v21-side-link{font-weight:750;font-size:12.5px}.resident-v21-side-link.active{background:linear-gradient(90deg,rgba(74,125,255,.23),rgba(74,125,255,.08));box-shadow:inset 3px 0 #72a0ff}.resident-v21-main{max-width:none}.resident-profile-link,.resident-exit-link{display:inline-flex;align-items:center;gap:6px;padding:9px 11px;border:1px solid #dfe7ef;border-radius:10px;background:#fff;color:#40536d;font-size:11px;font-weight:850}.resident-exit-link{color:#a93240}.resident-user-name{display:flex!important;align-items:center;gap:7px!important;color:#3d506a!important}.resident-v21-bottom-nav{backdrop-filter:blur(13px);background:rgba(255,255,255,.94)}
@media(max-width:760px){.resident-v21-topbar{height:66px;padding:0 12px}.resident-profile-link{display:none}.resident-exit-link{padding:8px}.resident-user-name{display:none!important}.resident-brand-mark{width:38px;height:38px}.resident-brand-mark img{height:27px}}
/* Super Admin shared chrome */
.admin-v21-note{font-size:11px;color:#738199}.admin-actions{display:flex;align-items:center;gap:8px}.topbar .brand span{font-size:14px}
