.employee-admin-cols { align-items: start; grid-template-columns: minmax(0, 1.35fr) minmax(320px, .75fr); }
.employee-list-head { align-items: center; gap: 12px; flex-wrap: wrap; }
.employee-list-head h3 { display: flex; align-items: center; gap: 9px; }
.employee-count { min-width: 25px; padding: 2px 7px; border: 1px solid #2b374c; border-radius: 7px; font-size: 12px; font-weight: 500; color: #b6c9eb; }
.employee-password-mode { margin: 5px 0 0; font-size: 12px; color: #96a4b9; }
.employee-list-head .btn { padding: 8px 11px; font-size: 12px; }
.employee-list-result { margin-bottom: 12px; font-size: 12px; color: #92d9b3; }
.employee-list-result:empty { display: none; }
.employee-card { min-width: 0; border: 1px solid #28303d; border-radius: 15px; padding: 15px; background: #0c1016; }
.employee-card-top { display: flex; align-items: center; gap: 12px; }
.employee-avatar, .employee-avatar-preview, .employee-mini-avatar { display: flex; flex: 0 0 auto; align-items: center; justify-content: center; overflow: hidden; border: 1px solid #334560; background: linear-gradient(145deg, #243b60, #14223c); color: #c5d9ff; font-size: 18px; font-weight: 650; }
.employee-avatar { width: 56px; height: 56px; padding: 0; border-radius: 15px; cursor: pointer; }
.employee-avatar:hover { border-color: #668dd5; }
.employee-avatar img, .employee-avatar-preview img, .employee-mini-avatar img { display: block; width: 100%; height: 100%; object-fit: cover; }
.employee-identity { flex: 1; min-width: 0; display: grid; gap: 3px; }
.employee-identity strong { font-size: 15px; overflow-wrap: anywhere; }
.employee-position { color: #b5c9e8; font-size: 12px; overflow-wrap: anywhere; }
.employee-position.is-empty { color: #8993a3; }
.employee-email { color: #929dad; overflow-wrap: anywhere; }
.employee-edit-button { padding: 7px 10px; font-size: 12px; flex-shrink: 0; }
.employee-credentials { margin-top: 15px; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); gap: 10px; }
.employee-credentials label { min-width: 0; font-size: 11px; color: #9da8b9; gap: 5px; }
.employee-value { display: flex; align-items: center; min-width: 0; border: 1px solid #232e3f; background: #111822; border-radius: 9px; }
.employee-value input { min-width: 0; padding: 9px 10px; background: transparent; border: 0; border-radius: 8px; font-size: 12px; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; color: #e5edfa; }
.employee-value input::placeholder { color: #8290a5; font-family: Inter, Segoe UI, Arial, sans-serif; font-size: 11px; }
.employee-copy, .employee-password-set { flex: 0 0 auto; border: 0; padding: 8px; margin-right: 3px; color: #9fbcec; background: transparent; cursor: pointer; border-radius: 7px; }
.employee-copy { display: grid; place-items: center; }
.employee-copy:hover, .employee-password-set:hover { background: #233451; color: #fff; }
.employee-password-set { font-size: 11px; }
.employee-card-footer { display: flex; justify-content: space-between; align-items: center; gap: 8px; margin-top: 12px; min-height: 22px; flex-wrap: wrap; }
.employee-access { display: flex; gap: 5px; align-items: center; flex-wrap: wrap; }
.employee-copy-status { font-size: 11px; color: #9cdbb8; }
.employee-inactive { font-size: 10px; color: #f2b978; }
.employee-empty { display: grid; justify-items: start; gap: 12px; padding: 20px 0; color: #9ba9bf; font-size: 13px; }
.employee-avatar-upload { display: flex; align-items: center; gap: 14px; }
.employee-avatar-preview { width: 74px; height: 74px; border-radius: 19px; font-size: 23px; }
.employee-avatar-actions { min-width: 0; display: flex; align-items: center; gap: 7px; flex-wrap: wrap; }
.employee-avatar-actions .btn { padding: 8px 11px; font-size: 12px; }
.employee-avatar-actions small { flex-basis: 100%; color: #8c9aad; font-size: 11px; }
.employee-upload-label { display: inline-flex; position: relative; align-items: center; justify-content: center; cursor: pointer; }
.employee-upload-label input { position: absolute; inset: 0; opacity: 0; cursor: pointer; width: 100%; padding: 0; }
.employee-upload-label:focus-within { outline: 2px solid #7ba7ff; outline-offset: 2px; }
.employee-form-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 14px; }
.employee-form-wide { grid-column: 1 / -1; }
.employee-password-input { display: flex; align-items: stretch; gap: 7px; min-width: 0; }
.employee-password-input input { min-width: 0; flex: 1; }
.employee-password-input .btn { padding: 8px 10px; font-size: 11px; flex: 0 0 auto; }
.employee-field-help { color: #929fb1; font-size: 11px; line-height: 1.5; }
.employee-create-panel .stack { margin-top: 18px; }
.employee-create-panel .secure-note { margin-top: 0; line-height: 1.5; }
.employee-create-panel .secure-note:empty { display: none; }
.employee-feedback { color: #9ac8ad; font-size: 12px; line-height: 1.5; }
.employee-feedback:empty { display: none; }
.employee-feedback.is-error, .employee-empty.is-error, .employee-copy-status.is-error, .employee-create-panel .secure-note.is-error { color: #ffaca8; }
.employee-dialog { width: min(590px, calc(100vw - 24px)); max-height: calc(100dvh - 28px); overflow-y: auto; border: 1px solid #2d394b; }
.employee-dialog .dialog-card { gap: 18px; padding: 25px; }
.employee-dialog .panel-head { margin-bottom: 0; align-items: center; }
.employee-dialog .panel-head h3 { margin: 2px 0 0; font-size: 22px; }
.employee-dialog input[readonly] { color: #9fb0c9; background: #121a27; }
.employee-dialog .dialog-actions { margin-top: 0; }
.employee-dialog button:disabled, .employee-create-panel button:disabled { opacity: .6; cursor: wait; transform: none; }
.employee-mini { display: flex; align-items: center; gap: 9px; min-width: 0; }
.employee-mini-avatar { width: 34px; height: 34px; border-radius: 10px; font-size: 12px; }
.employee-mini-text { min-width: 0; }
.employee-mini-text strong, .employee-mini-text small { overflow-wrap: anywhere; }
@media (max-width: 1350px) { .employee-admin-cols { grid-template-columns: 1fr; } .employee-create-panel .stack { grid-template-columns: repeat(2, minmax(0, 1fr)); } .employee-create-panel .employee-avatar-upload, .employee-create-panel .employee-create-submit, .employee-create-panel .secure-note { grid-column: 1 / -1; } }
@media (max-width: 560px) { .employee-card { padding: 12px; } .employee-card-top { gap: 9px; flex-wrap: wrap; } .employee-avatar { width: 44px; height: 44px; border-radius: 12px; font-size: 15px; } .employee-identity strong { font-size: 14px; } .employee-edit-button { padding: 7px 8px; font-size: 11px; } .employee-credentials, .employee-form-grid, .employee-create-panel .stack { grid-template-columns: 1fr; } .employee-dialog .dialog-card { padding: 18px; } .employee-password-input { flex-wrap: wrap; } .employee-password-input input { flex-basis: 180px; } .employee-list-head .btn { width: 100%; } }


/* === EMPLOYEE PS5 HUB 2026-10-11 === */
.employee-hub-section{
  --eh-bg:#060a11;--eh-panel:#0b121e;--eh-panel-2:#101a29;--eh-line:#22344d;
  --eh-text:#f5f8fd;--eh-muted:#8497b2;--eh-blue:#3f83f8;--eh-blue-soft:#78aaff;--eh-good:#55d99a;
  position:relative;overflow:hidden;min-height:calc(100dvh - 110px);padding-bottom:38px
}
.employee-hub-section:before,.employee-hub-section:after{content:"";position:absolute;pointer-events:none;border-radius:50%}
.employee-hub-section:before{width:640px;height:640px;right:-270px;top:-280px;background:radial-gradient(circle,rgba(55,121,234,.19),rgba(31,74,151,.055) 43%,transparent 70%)}
.employee-hub-section:after{width:480px;height:480px;left:-240px;bottom:40px;background:radial-gradient(circle,rgba(66,110,205,.09),transparent 69%)}
.employee-hub-hero{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1.25fr) 320px;align-items:center;gap:34px;min-height:250px;margin-bottom:23px;padding:32px 38px;border:1px solid #20324d;border-radius:28px;background:linear-gradient(135deg,rgba(12,20,34,.96),rgba(8,14,24,.92) 55%,rgba(13,30,59,.94));box-shadow:0 28px 72px rgba(0,0,0,.23),inset 0 1px 0 rgba(255,255,255,.025)}
.employee-hub-kicker{display:block;margin-bottom:10px;color:#76a8ff;font-size:10px;font-weight:800;letter-spacing:.16em}
.employee-hub-hero h3{margin:0;color:#fff;font-size:46px;line-height:1;letter-spacing:-.05em}
.employee-hub-hero p{max-width:720px;margin:14px 0 0;color:#9aacc5;font-size:13px;line-height:1.6}
.employee-hub-stats{display:flex;gap:10px;flex-wrap:wrap;margin-top:24px}
.employee-hub-stats>span{min-width:104px;padding:10px 13px;border:1px solid #263a58;border-radius:14px;background:rgba(12,23,39,.66);box-shadow:inset 0 1px 0 rgba(255,255,255,.025)}
.employee-hub-stats b{display:block;color:#f6f9ff;font-size:20px;line-height:1;font-variant-numeric:tabular-nums}
.employee-hub-stats small{display:block;margin-top:4px;color:#7086a4;font-size:8.5px;text-transform:uppercase;letter-spacing:.09em}
.employee-hub-symbol{position:relative;justify-self:center;width:245px;height:200px}
.employee-symbol-orbit{position:absolute;inset:0}
.employee-symbol-orbit:before,.employee-symbol-orbit:after{content:"";position:absolute;border:1px solid rgba(88,143,231,.26);border-radius:50%}
.employee-symbol-orbit:before{inset:10px 0;transform:rotate(-12deg)}.employee-symbol-orbit:after{inset:40px 34px;transform:rotate(28deg);border-color:rgba(255,255,255,.08)}
.employee-symbol-orbit i{position:absolute;width:8px;height:8px;border-radius:50%;background:#68a0ff;box-shadow:0 0 18px rgba(88,151,255,.9)}
.employee-symbol-orbit i:nth-child(1){left:34px;top:48px}.employee-symbol-orbit i:nth-child(2){right:16px;top:101px}.employee-symbol-orbit i:nth-child(3){left:116px;bottom:10px}
.employee-symbol-core{position:absolute;left:50%;top:50%;width:126px;height:104px;transform:translate(-50%,-50%);display:grid;place-content:center;text-align:center;border:1px solid #426bb0;border-radius:32px 16px 32px 16px;background:linear-gradient(145deg,#142e58,#0b1729 60%,#0d203d);box-shadow:0 18px 46px rgba(0,0,0,.34),0 0 52px rgba(53,119,235,.13),inset 0 1px 0 rgba(255,255,255,.08)}
.employee-symbol-core span{color:#fff;font-size:22px;font-weight:850;letter-spacing:.06em}.employee-symbol-core small{margin-top:5px;color:#79a9fb;font-size:8px;letter-spacing:.2em}
.employee-hub-toolbar{position:relative;z-index:1;display:flex;align-items:end;justify-content:space-between;gap:18px;margin:0 4px 12px}
.employee-hub-toolbar h4{margin:4px 0 0;color:#eef5ff;font-size:20px;letter-spacing:-.025em}
.employee-hub-toolbar p{margin:5px 0 0;color:#7e90aa;font-size:11px}
.employee-hub-toolbar-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:flex-end}
.employee-ps-toggle{border-color:#34527e!important;background:#101b2b!important;color:#cfe1ff!important}
.employee-stage{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1.8fr) minmax(330px,.72fr);gap:15px;align-items:start}
.employee-team-stage{min-width:0;padding:14px;border:1px solid #20324b;border-radius:22px;background:linear-gradient(155deg,rgba(12,19,31,.95),rgba(8,13,22,.96));box-shadow:0 12px 38px rgba(0,0,0,.18),inset 0 1px 0 rgba(255,255,255,.018)}
.employee-mosaic{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-flow:dense;gap:12px!important}
.employee-card{--employee-pointer-x:50%;--employee-pointer-y:50%;position:relative;isolation:isolate;overflow:hidden;min-width:0!important;min-height:248px;padding:16px!important;border:1px solid #263952!important;border-radius:19px!important;background:linear-gradient(150deg,#111b2a,#0b121d 66%)!important;box-shadow:0 9px 28px rgba(0,0,0,.17),inset 0 1px 0 rgba(255,255,255,.025)!important;transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease}
.employee-card:before{content:"";position:absolute;z-index:-1;inset:0;opacity:0;background:radial-gradient(circle at var(--employee-pointer-x) var(--employee-pointer-y),rgba(68,137,255,.22),transparent 36%);transition:opacity .2s ease}
.employee-card:hover{transform:translateY(-4px) scale(1.006);border-color:#41699f!important;box-shadow:0 18px 42px rgba(0,0,0,.25),0 0 0 1px rgba(70,135,236,.04) inset!important}
.employee-card:hover:before{opacity:1}
.employee-card-featured{grid-column:span 2;min-height:286px;background:linear-gradient(140deg,#14294c,#0d1726 58%,#0a111b)!important;border-color:#315b96!important}
.employee-card-wide{grid-column:span 2}
.employee-card-tall{min-height:288px}
.employee-card.is-disabled{filter:saturate(.7);opacity:.78}
.employee-card-aura{position:absolute;z-index:-2;width:210px;height:210px;right:-80px;bottom:-90px;border-radius:50%;background:radial-gradient(circle,rgba(59,126,242,.17),transparent 68%);pointer-events:none}
.employee-card-featured .employee-card-aura{width:320px;height:320px;right:-90px;bottom:-160px;background:radial-gradient(circle,rgba(61,137,255,.23),transparent 70%)}
.employee-card-headline{display:flex;align-items:center;justify-content:space-between;min-height:22px;margin-bottom:13px}
.employee-card-status{display:flex;align-items:center;gap:7px;color:#8497b2;font-size:9px;text-transform:uppercase;letter-spacing:.08em}
.employee-card-status i{width:7px;height:7px;border-radius:50%;background:#66768a}.employee-card-status i.is-online{background:#55d99a;box-shadow:0 0 9px rgba(85,217,154,.62)}.employee-card-status i.is-offline{background:#dc7a72}
.employee-you{padding:4px 7px;border:1px solid rgba(84,142,234,.35);border-radius:999px;color:#8dbbff;background:rgba(42,91,170,.16);font-size:8px;font-weight:800;letter-spacing:.12em}
.employee-card-top{position:relative;display:grid!important;grid-template-columns:auto minmax(0,1fr) auto;align-items:center!important;gap:13px!important}
.employee-avatar{width:76px!important;height:76px!important;border-radius:20px!important;border:1px solid #3c5b87!important;background:linear-gradient(145deg,#274f85,#142945)!important;color:#dceaff!important;font-size:22px!important;box-shadow:0 10px 28px rgba(0,0,0,.2),inset 0 1px 0 rgba(255,255,255,.07);transition:transform .18s ease,border-color .18s ease}
.employee-card-featured .employee-avatar{width:104px!important;height:104px!important;border-radius:27px!important;font-size:28px!important}
.employee-avatar:hover{transform:scale(1.035);border-color:#78a6ec!important}
.employee-identity{gap:4px!important}.employee-identity strong{color:#f5f8fd;font-size:17px!important;line-height:1.15;letter-spacing:-.02em}.employee-card-featured .employee-identity strong{font-size:23px!important}
.employee-position{color:#afc6e9!important;font-size:11.5px!important}.employee-last-login{color:#6f87a7;font-size:9.5px}.employee-email{color:#7e90a9!important;font-size:9.5px}
.employee-edit-button{align-self:start;display:flex;align-items:center;gap:7px;padding:7px 9px;border:1px solid #2d4568;border-radius:10px;color:#9fc0f5;background:rgba(14,28,48,.72);font-size:9px;cursor:pointer;transition:.16s ease}.employee-edit-button b{font-size:11px}.employee-edit-button:hover{color:#fff;border-color:#4d75ad;background:#172a45;transform:translateY(-1px)}
.employee-card-console{margin-top:15px;padding-top:13px;border-top:1px solid rgba(56,75,103,.58)}
.employee-credentials{margin-top:0!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:9px!important}
.employee-credentials label{gap:5px!important;color:#7f91aa!important;font-size:9px!important;text-transform:uppercase;letter-spacing:.055em}
.employee-value{border-color:#24354f!important;background:rgba(11,20,33,.84)!important;border-radius:10px!important}.employee-value input{color:#e8f0fc!important;font-size:11px!important;padding:8px 9px!important}
.employee-copy,.employee-password-set{color:#84aaf0!important}.employee-copy:hover,.employee-password-set:hover{background:#1a3153!important;color:#fff!important}
.employee-card-footer{margin-top:10px!important;min-height:24px!important}.employee-access{gap:4px!important}.role-pill{border-color:#2c4261!important;background:#111f32!important;color:#9db9e5!important;font-size:8.5px!important}
.role-pill.is-muted{opacity:.65}.employee-copy-status{color:#75dca9!important;font-size:9px!important}
.employee-empty-ps{min-height:320px!important;place-content:center;justify-items:center!important;text-align:center!important}.employee-empty-ps span{color:#406aab;font-size:24px;font-weight:850;letter-spacing:.14em}.employee-empty-ps b{color:#eaf2ff;font-size:17px}.employee-empty-ps p{margin:0;color:#798da9}
.employee-join-card{position:sticky;top:12px;overflow:hidden;padding:19px!important;border:1px solid #29405f!important;border-radius:22px!important;background:linear-gradient(155deg,#111d2e,#0c141f 72%)!important;box-shadow:0 12px 38px rgba(0,0,0,.19),inset 0 1px 0 rgba(255,255,255,.025)}
.employee-join-card:after{content:"";position:absolute;right:-80px;top:-95px;width:220px;height:220px;border-radius:50%;background:radial-gradient(circle,rgba(55,125,241,.16),transparent 68%);pointer-events:none}
.employee-join-head{position:relative;z-index:1;display:flex;align-items:center;gap:12px;margin-bottom:18px}.employee-join-head h3{margin:3px 0 0;color:#f2f6fc;font-size:18px}.employee-join-head p{margin:5px 0 0;color:#8193ad;font-size:9.5px;line-height:1.45}
.employee-join-mark{width:48px;height:48px;flex:0 0 48px;display:grid;place-items:center;border:1px solid #3865a5;border-radius:15px;color:#d9e8ff;background:linear-gradient(145deg,#255cae,#17386c);font-size:25px;box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 8px 18px rgba(0,0,0,.18)}
.employee-create-form{position:relative;z-index:1;margin-top:0!important}.employee-create-form label{color:#8fa0b6;font-size:10px}.employee-create-form input,.employee-create-form select{background:#0b1320;border-color:#2a3b57}.employee-create-form input:focus,.employee-create-form select:focus{border-color:#4779be;box-shadow:0 0 0 3px rgba(63,131,248,.1)}
.employee-avatar-preview{width:82px!important;height:82px!important;border-radius:22px!important;border-color:#3d5f8f!important;background:linear-gradient(145deg,#295384,#152b48)!important}
.employee-create-submit{min-height:43px;background:linear-gradient(135deg,#347ff0,#235bb6)!important;border-color:#4d8ef6!important;box-shadow:0 10px 24px rgba(37,94,188,.2)}
.employee-dialog{border-color:#33517a!important;background:#09111c!important;box-shadow:0 30px 90px rgba(0,0,0,.46)}
.employee-dialog .dialog-card{background:linear-gradient(150deg,#111d2e,#0b131f)!important}
.employee-mini-avatar{border-color:#3a5a85!important;background:linear-gradient(145deg,#28517f,#152a47)!important}
@media(max-width:1380px){.employee-stage{grid-template-columns:1fr}.employee-join-card{position:relative;top:auto}.employee-create-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.employee-create-form .employee-avatar-upload,.employee-create-form .employee-create-submit,.employee-create-form .secure-note{grid-column:1/-1}}
@media(max-width:980px){.employee-hub-hero{grid-template-columns:1fr;padding:27px}.employee-hub-symbol{display:none}.employee-mosaic{grid-template-columns:1fr!important}.employee-card-featured,.employee-card-wide{grid-column:auto}.employee-card-featured .employee-avatar{width:82px!important;height:82px!important}.employee-card-featured .employee-identity strong{font-size:19px!important}}
@media(max-width:620px){.employee-hub-hero{padding:21px;border-radius:20px}.employee-hub-hero h3{font-size:36px}.employee-hub-toolbar{align-items:flex-start;flex-direction:column}.employee-hub-toolbar-actions{width:100%;justify-content:space-between}.employee-team-stage{padding:9px}.employee-card{padding:13px!important;min-height:0}.employee-card-top{grid-template-columns:auto 1fr}.employee-edit-button{grid-column:1/-1;justify-self:end}.employee-credentials{grid-template-columns:1fr!important}.employee-create-form{grid-template-columns:1fr}.employee-create-form .employee-avatar-upload,.employee-create-form .employee-create-submit,.employee-create-form .secure-note{grid-column:auto}.employee-avatar{width:62px!important;height:62px!important;border-radius:17px!important}}
