
:root{
  --maroon:#741c35;--maroon2:#8c2947;--gold:#c59a4a;--cream:#f8f4ed;
  --ink:#2f2a2c;--muted:#756d70;--line:#eadfd2;--white:#fff;
  --ok:#26845f;--bad:#b64343;--blue:#2d74a8;
}
*{box-sizing:border-box}
body{margin:0;font-family:Tahoma,Arial,sans-serif;background:var(--cream);color:var(--ink);direction:rtl}
a{text-decoration:none;color:inherit}
.topbar{height:78px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 28px;position:sticky;top:0;z-index:10}
.brand{font-size:25px;font-weight:800;color:var(--maroon)}
.brand small{display:block;font-size:12px;color:var(--muted);font-weight:400;margin-top:4px}
.layout{display:grid;grid-template-columns:250px 1fr;min-height:calc(100vh - 78px)}
.sidebar{background:linear-gradient(180deg,var(--maroon),#551126);color:#fff;padding:24px 15px}
.side-title{font-size:13px;opacity:.7;margin:8px 12px 15px}
.nav a{display:block;padding:13px 14px;border-radius:12px;margin:5px 0}
.nav a.active,.nav a:hover{background:rgba(255,255,255,.14)}
.main{padding:28px}
.page-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:22px}
h1{margin:0;color:var(--maroon);font-size:27px}
.sub{color:var(--muted);font-size:13px;margin-top:6px}
.btn{border:0;border-radius:10px;padding:10px 17px;font:inherit;cursor:pointer}
.btn-primary{background:var(--maroon);color:#fff}
.btn-gold{background:var(--gold);color:#fff}
.btn-light{background:#fff;border:1px solid var(--line)}
.card{background:#fff;border:1px solid var(--line);border-radius:17px;box-shadow:0 7px 22px rgba(60,30,25,.05)}
.table-wrap{overflow:auto}
table{width:100%;border-collapse:collapse}
th,td{padding:14px 12px;border-bottom:1px solid #f0e9e1;text-align:right;vertical-align:middle}
th{background:#fbf8f4;color:var(--maroon);font-size:13px}
.avatar{width:46px;height:46px;border-radius:50%;object-fit:cover;background:#eee}
.emp{display:flex;align-items:center;gap:10px}
.badge{display:inline-block;padding:5px 9px;border-radius:999px;font-size:12px;background:#f3eee7}
.badge.ok{background:#e7f4ed;color:var(--ok)}
.stars{direction:ltr;display:inline-block;color:var(--gold);letter-spacing:1px;font-size:17px;white-space:nowrap}
.score{font-size:12px;color:var(--muted);margin-right:5px}
.profile-grid{display:grid;grid-template-columns:310px 1fr;gap:20px}
.profile-card{padding:24px;text-align:center}
.profile-photo{width:135px;height:135px;border-radius:50%;object-fit:cover;background:#eee;border:5px solid #f6efe7}
.emp-name{font-size:22px;font-weight:800;color:var(--maroon);margin-top:13px}
.emp-code{color:var(--muted);font-size:13px;margin-top:5px}
.grade-box{margin:16px 0;background:#fbf7f1;border:1px solid var(--line);border-radius:12px;padding:12px}
.rating-box{border-top:1px solid var(--line);padding-top:15px;margin-top:14px}
.rating-row{display:flex;justify-content:space-between;align-items:center;margin:10px 0}
.info-card{padding:22px}
.info-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.info-item{background:#fbf8f4;border-radius:12px;padding:13px}
.info-item span{display:block;color:var(--muted);font-size:12px;margin-bottom:5px}
.tabs{display:flex;gap:8px;margin:20px 0 12px;flex-wrap:wrap}
.tab{padding:10px 14px;border-radius:10px;background:#fff;border:1px solid var(--line);cursor:pointer}
.tab.active{background:var(--maroon);color:#fff}
.eval-panel{padding:20px;margin-top:14px}
.eval-row{display:grid;grid-template-columns:1fr 110px 120px 1fr;gap:10px;align-items:center;padding:10px 0;border-bottom:1px solid #f0e9e1}
.eval-head{font-weight:700;color:var(--maroon)}
.small{font-size:12px;color:var(--muted)}
input[type=text],input[type=date],textarea,select{width:100%;border:1px solid #d8cbbf;border-radius:9px;padding:9px;font:inherit;background:#fff}
.checkline{display:flex;gap:12px;align-items:center}
.result{background:#fbf7f1;border-radius:14px;padding:15px;margin-top:15px;display:flex;justify-content:space-between;align-items:center}
.notice{display:none;padding:12px;border-radius:10px;margin-top:12px}
.notice.ok{display:block;background:#e7f4ed;color:var(--ok)}
.notice.err{display:block;background:#fae9e9;color:var(--bad)}
@media(max-width:900px){
 .layout{grid-template-columns:1fr}.sidebar{display:none}.main{padding:15px}
 .profile-grid{grid-template-columns:1fr}.info-grid{grid-template-columns:1fr 1fr}
 .eval-row{grid-template-columns:1fr}
}

.platform-title{font-size:21px;font-weight:800;color:var(--maroon)}
.platform-title small{display:block;color:#a1263e;font-size:11px;letter-spacing:.9px;margin-top:3px}
.top-actions{display:flex;gap:9px;align-items:center}.icon-btn{position:relative;background:#fff;border:1px solid var(--line);border-radius:11px;padding:9px 12px}.count{position:absolute;top:-7px;left:-7px;background:#c8314b;color:#fff;border-radius:999px;min-width:19px;height:19px;font-size:11px;display:flex;align-items:center;justify-content:center}.hero{background:linear-gradient(135deg,#fff,#f5eee5);border:1px solid var(--line);border-radius:20px;padding:24px;display:flex;justify-content:space-between;align-items:center;gap:18px}.hero h2{margin:0;color:var(--maroon);font-size:27px}.hero p{margin:8px 0 0;color:var(--muted)}.module-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:18px}.module-card{background:#fff;border:1px solid var(--line);border-radius:16px;padding:18px;min-height:118px;transition:.2s;position:relative}.module-card:hover{transform:translateY(-2px);box-shadow:0 10px 26px rgba(70,35,25,.08)}.module-card .ico{font-size:26px}.module-card h3{margin:10px 0 4px;color:var(--maroon);font-size:16px}.module-card p{margin:0;color:var(--muted);font-size:12px;line-height:1.6}.kpis{display:grid;grid-template-columns:repeat(6,1fr);gap:12px;margin-top:18px}.kpi{background:#fff;border:1px solid var(--line);border-radius:15px;padding:15px}.kpi b{display:block;font-size:25px;color:var(--maroon);margin-top:6px}.muted-banner{background:#fff9e9;border:1px solid #ead9a7;color:#755d2b;padding:11px 14px;border-radius:12px;margin-top:14px;font-size:13px}.split{display:grid;grid-template-columns:1.4fr 1fr;gap:16px;margin-top:18px}.list-row{padding:12px 0;border-bottom:1px solid #f0e9e1;display:flex;justify-content:space-between;gap:12px}.login-page{min-height:100vh;background:radial-gradient(circle at 20% 15%,#fff 0,#f9f2e9 40%,#efe2d1 100%);display:flex;align-items:center;justify-content:center;padding:24px}.login-shell{width:min(1080px,100%);display:grid;grid-template-columns:1.15fr .85fr;background:rgba(255,255,255,.96);border:1px solid #eadfd2;border-radius:28px;overflow:hidden;box-shadow:0 30px 80px rgba(74,30,38,.14)}.login-brand{padding:48px;background:linear-gradient(145deg,#731c35,#4c1024);color:#fff;position:relative}.login-brand h1{color:#fff;font-size:31px;line-height:1.5}.login-brand .mas{color:#ff9eaa;font-size:13px;font-weight:800;letter-spacing:1.5px}.login-brand p{line-height:1.9;color:#f1dfe4}.login-card{padding:48px}.login-card h2{color:var(--maroon);font-size:27px;margin-top:0}.field{margin:15px 0}.field label{display:block;font-size:13px;color:var(--muted);margin-bottom:7px}.field input{padding:13px}.login-btn{width:100%;padding:13px;margin-top:8px;background:var(--maroon);color:#fff;border:0;border-radius:11px;font:inherit;font-weight:700}.login-meta{display:flex;justify-content:space-between;color:var(--muted);font-size:12px;margin-top:18px}@media(max-width:1100px){.module-grid{grid-template-columns:repeat(3,1fr)}.kpis{grid-template-columns:repeat(3,1fr)}}@media(max-width:760px){.module-grid{grid-template-columns:1fr 1fr}.kpis{grid-template-columns:1fr 1fr}.split{grid-template-columns:1fr}.login-shell{grid-template-columns:1fr}.login-brand{display:none}}

/* V3 operational UI */
.notification-row{display:flex;justify-content:space-between;gap:18px;padding:16px 6px;border-bottom:1px solid #f0e9e1;align-items:center}.notification-row.unread{background:#fff8e8;border-radius:12px;padding:16px}.row-title{font-weight:800;color:var(--maroon);margin-bottom:6px}.empty-state{text-align:center;padding:24px;color:var(--muted)}.announcement-card{border-bottom:1px solid #f0e9e1;padding:18px 0}.announcement-card:last-child{border-bottom:0}.announcement-card h3{color:var(--maroon);margin:9px 0}.announcement-card p{white-space:pre-line;line-height:1.9}.announcement-meta{display:flex;gap:10px;align-items:center;color:var(--muted);font-size:12px}.comm-layout{display:grid;grid-template-columns:320px 1fr;gap:16px}.conversation-item{width:100%;text-align:right;background:#fff;border:0;border-bottom:1px solid #f0e9e1;padding:13px;cursor:pointer;position:relative}.conversation-item b,.conversation-item span{display:block}.conversation-item span{color:var(--muted);font-size:12px;margin-top:5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.conversation-item em{position:absolute;left:10px;top:12px;background:var(--maroon);color:#fff;border-radius:999px;padding:2px 7px;font-style:normal;font-size:11px}.messages-box{height:420px;overflow:auto;background:#fbf8f4;border-radius:14px;padding:14px;margin:14px 0}.message-bubble{max-width:75%;background:#fff;border:1px solid var(--line);padding:10px 12px;border-radius:14px;margin:9px auto 9px 0}.message-bubble.mine{margin:9px 0 9px auto;background:#f5e8ed}.message-bubble b{display:block;font-size:11px;color:var(--maroon);margin-bottom:5px}.message-bubble span{display:block;font-size:10px;color:var(--muted);margin-top:6px}.message-compose{display:grid;grid-template-columns:1fr auto;gap:9px;align-items:end}.soft-panel{background:#fbf8f4;border:1px dashed #dbcab9;border-radius:14px;padding:16px;margin-bottom:14px}.camera-item{padding:8px 0;border-bottom:1px solid #f0e9e1}.camera-item b,.camera-item span{display:block}.camera-item span{font-size:12px;color:var(--muted);margin-top:3px}input[readonly]{background:#f3efe9;color:#6f6966}@media(max-width:900px){.comm-layout{grid-template-columns:1fr}.messages-box{height:340px}}


/* V4 integrated beneficiary context */
.context-banner{margin:-6px 0 18px;background:linear-gradient(135deg,#fff,#fbf4e9);border:1px solid var(--line);border-right:5px solid var(--gold);border-radius:16px;padding:14px 16px;display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap}.context-person{display:flex;align-items:center;gap:11px}.context-avatar{width:44px;height:44px;border-radius:50%;background:#f2e7db;display:flex;align-items:center;justify-content:center;font-size:22px}.context-person b,.context-person span{display:block}.context-person b{color:var(--maroon);font-size:16px}.context-person span{font-size:12px;color:var(--muted);margin-top:4px}.context-links{display:flex;gap:7px;flex-wrap:wrap}.context-links a{background:#fff;border:1px solid var(--line);border-radius:9px;padding:7px 10px;font-size:12px}.hub-head{display:grid;grid-template-columns:150px 1fr;gap:20px;align-items:center}.hub-photo{width:135px;height:135px;border-radius:22px;object-fit:cover;background:#eee}.hub-identity h2{margin:0;color:var(--maroon);font-size:26px}.hub-identity .code{color:var(--muted);margin-top:5px}.hub-kpis{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin-top:15px}.hub-kpis .mini{background:#fbf8f4;border-radius:12px;padding:11px}.hub-kpis .mini span{display:block;color:var(--muted);font-size:11px}.hub-kpis .mini b{display:block;margin-top:5px}.hub-section{margin-top:16px;padding:20px}.hub-section h2{font-size:19px;color:var(--maroon);margin:0 0 12px}.hub-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}.hub-actions a{background:#fff;border:1px solid var(--line);border-radius:9px;padding:8px 11px;font-size:12px}.timeline{border-right:2px solid #ead9ca;margin-right:10px;padding-right:20px}.timeline-item{position:relative;padding:0 0 18px}.timeline-item:before{content:'';position:absolute;right:-27px;top:4px;width:12px;height:12px;border-radius:50%;background:var(--gold);border:3px solid #fff}.timeline-item b{display:block;color:var(--maroon)}.timeline-item span{display:block;color:var(--muted);font-size:11px;margin:4px 0}.integration-status{display:inline-block;padding:4px 8px;border-radius:999px;background:#e7f4ed;color:var(--ok);font-size:11px}@media(max-width:900px){.hub-head{grid-template-columns:1fr;text-align:center}.hub-photo{margin:auto}.hub-kpis{grid-template-columns:1fr 1fr}.context-banner{align-items:flex-start}}

[data-permission]{visibility:hidden} body.permissions-ready [data-permission]{visibility:visible} label{display:block;margin:8px 0}label input,label select{display:block;width:100%} #goals input[type=checkbox],#fields input[type=checkbox]{display:inline;width:auto} .print-header{font-weight:bold;text-align:center;margin:15px} @media print{.topbar,.sidebar,.no-print,.btn{display:none!important}.layout{display:block}.main{padding:0}.card{box-shadow:none;border:0}table{width:100%;border-collapse:collapse}th,td{border:1px solid #777;padding:6px}thead{display:table-header-group}}
/* Platform display identity: ATHR with MAS SYSTEM below. SQL catalog is unchanged. */
.platform-title{font-size:18px;line-height:1.5;overflow-wrap:break-word}.platform-title small{font-size:11px;line-height:1.4;letter-spacing:1.6px;color:#a8874f;margin-top:4px;text-align:inherit}.topbar{gap:18px}.login-brand h1{font-size:29px;line-height:1.7;margin-bottom:10px}.login-brand .mas{font-size:12px;letter-spacing:2px;color:#dcc18e;margin-bottom:24px;text-align:right}
@media(max-width:760px){.topbar>.platform-title{font-size:13px;max-width:58%}.topbar>.platform-title small{font-size:9px}}

/* V4.15: keep the approved V4 design and center the platform identity. */
.login-brand{text-align:center}.login-brand .mas{text-align:center!important;color:#ff9eaa!important}.login-brand p{max-width:650px;margin-inline:auto}.platform-title{text-align:center}.platform-title small{color:#c2263e!important}
.inactive-row{color:#91878c;background:#f6f4f3}.inactive-row b{color:#80747a}.inactive-row .btn{opacity:.85}

/* Compact beneficiary data-entry form. */
.beneficiary-manage-page #editor{padding:16px}
.beneficiary-manage-page #fields{
  grid-template-columns:repeat(4,minmax(160px,1fr));
  gap:9px 12px;
  align-items:end;
}
.beneficiary-manage-page #fields>.beneficiary-field{
  min-width:0;
  margin:0;
  font-size:12px;
  color:var(--muted);
}
.beneficiary-manage-page #fields>.beneficiary-field-wide{grid-column:span 2}
.beneficiary-manage-page #fields>.beneficiary-field-full{grid-column:1/-1}
.beneficiary-manage-page #fields>.beneficiary-field input:not([type=checkbox]),
.beneficiary-manage-page #fields>.beneficiary-field select{
  min-height:36px;
  height:36px;
  padding:6px 8px;
  margin-top:4px;
  font-size:13px;
}
.beneficiary-manage-page #fields>.beneficiary-field textarea{
  min-height:70px;
  padding:7px 9px;
  margin-top:4px;
  font-size:13px;
  resize:vertical;
}
.beneficiary-manage-page #fields .athr-date-parts{gap:4px!important}
.beneficiary-manage-page #fields .athr-date-parts select{padding-inline:4px}
.beneficiary-manage-page .beneficiary-file-tools{grid-column:1/-1;margin-top:4px}
.form-section-title{grid-column:1/-1;border-bottom:1px solid var(--line);padding:8px 2px 6px;margin-top:8px}.form-section-title h2{margin:0;color:var(--maroon);font-size:17px}
.profile-photo-editor{grid-column:1/-1;display:flex;align-items:center;gap:16px;padding:14px;background:linear-gradient(135deg,#fff,#fbf5e9);border:1px solid var(--line);border-radius:14px}.profile-photo-editor h2{margin:0 0 5px;color:var(--maroon);font-size:18px}.profile-photo-editor p{margin:0 0 8px}.profile-photo-editor input[type=file]{display:block;margin:7px 0;max-width:100%}.profile-photo-preview img{width:112px;height:112px;border-radius:18px;object-fit:cover;background:#eee;border:4px solid #fff;box-shadow:0 5px 16px #6030441c}
.beneficiary-onboarding{grid-column:1/-1;border-top:1px solid var(--line);margin-top:8px;padding-top:14px}
.beneficiary-onboarding h2{margin:0 0 12px;color:var(--maroon);font-size:18px}
.beneficiary-onboarding-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px;align-items:start}
.beneficiary-onboarding fieldset{border:1px solid var(--line);border-radius:12px;padding:10px 12px;margin:0;min-width:0;background:#fbf8f4}
.beneficiary-onboarding legend{padding:0 7px;color:var(--maroon);font-weight:700;font-size:13px}
.beneficiary-onboarding label{font-size:12px;color:var(--muted);margin:6px 0}
.beneficiary-onboarding input,.beneficiary-onboarding select{height:36px;min-height:36px;padding:6px 8px;margin-top:4px;font-size:13px}
@media(max-width:1250px){
  .beneficiary-manage-page #fields{grid-template-columns:repeat(3,minmax(160px,1fr))}
  .beneficiary-onboarding-grid{grid-template-columns:1fr 1fr}.beneficiary-onboarding .transport-onboarding{grid-column:1/-1}
}
@media(max-width:900px){
  .beneficiary-manage-page #fields{grid-template-columns:repeat(2,minmax(145px,1fr))}
  .beneficiary-onboarding-grid{grid-template-columns:1fr}.beneficiary-onboarding .transport-onboarding{grid-column:auto}
}
@media(max-width:560px){
  .beneficiary-manage-page #fields{grid-template-columns:1fr}
  .beneficiary-manage-page #fields>.beneficiary-field-wide,
  .beneficiary-manage-page #fields>.beneficiary-field-full{grid-column:auto}
}

/* V4.16 login artwork and polished interactions. */
.login-page{padding:28px;background:radial-gradient(circle at 12% 12%,#fff 0,#faf4ec 34%,#efe2d3 100%)}
.login-shell{min-height:650px;grid-template-columns:minmax(0,1.12fr) minmax(360px,.88fr);box-shadow:0 34px 90px rgba(74,30,38,.18)}
.login-brand{display:flex;flex-direction:column;align-items:center;isolation:isolate;overflow:hidden;padding:44px 48px 24px;background:linear-gradient(150deg,#7d2340 0,#5b162e 58%,#3f0d20 100%)}
.login-brand:before{content:'';position:absolute;width:460px;height:460px;border-radius:50%;background:radial-gradient(circle,#c9a96922 0,transparent 68%);left:-170px;top:-170px;z-index:-1}
.login-brand h1{max-width:700px;font-size:clamp(24px,2.2vw,32px);text-shadow:0 2px 13px #2c071655}
.login-brand p{max-width:640px;font-size:13px;margin-bottom:4px}
.login-visual{position:relative;width:min(420px,95%);height:330px;margin-top:auto;display:flex;align-items:flex-end;justify-content:center}
.login-visual:after{content:'';position:absolute;bottom:5px;width:82%;height:34px;border-radius:50%;background:#25061155;filter:blur(17px);z-index:-1}
.login-visual img{display:block;max-width:100%;height:345px;object-fit:contain;object-position:center bottom;filter:drop-shadow(0 16px 20px #27081342);transition:transform .35s ease}
.login-visual:hover img{transform:translateY(-4px) scale(1.015)}
.login-visual-ring{position:absolute;border:1px solid #e4c78c2e;border-radius:50%;z-index:-1}.login-visual-ring.ring-a{width:290px;height:290px;top:15px}.login-visual-ring.ring-b{width:225px;height:225px;top:47px;border-color:#fff2}
.login-security{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:2px;font-size:12px;color:#f3dce4;background:#ffffff0c;border:1px solid #ffffff18;border-radius:999px;padding:8px 15px}
.login-card{align-self:center;padding:54px}.login-card h2{font-size:31px}.login-btn{transition:transform .2s ease,box-shadow .2s ease,background .2s ease}.login-btn:hover{transform:translateY(-2px);box-shadow:0 10px 24px #741c3530;background:#862541}.login-btn:active{transform:translateY(0) scale(.99)}
.startup-error{max-width:680px;margin:70px auto;padding:38px;text-align:center}.startup-error-icon{width:58px;height:58px;margin:0 auto 18px;border-radius:50%;display:grid;place-items:center;background:#fae9e9;color:var(--bad);font:bold 30px Arial}.startup-error h1{margin-bottom:13px}.startup-error p{color:var(--muted);line-height:1.9;margin:0 auto 24px;max-width:550px}
@media(max-width:760px){.login-page{padding:12px}.login-shell{grid-template-columns:1fr;min-height:0}.login-brand{display:flex;padding:27px 22px 0;min-height:360px}.login-brand h1{font-size:20px}.login-brand p{font-size:11px;line-height:1.7}.login-visual{height:190px;width:260px}.login-visual img{height:205px}.login-visual-ring.ring-a{width:180px;height:180px}.login-visual-ring.ring-b{width:140px;height:140px}.login-security{display:none}.login-card{padding:30px 24px}.login-card h2{font-size:25px}}
@media(prefers-reduced-motion:reduce){.login-visual img,.login-btn{transition:none}.login-visual:hover img,.login-btn:hover{transform:none}}

/* V4.17 platform-wide language and music controls. */
.language-btn{border:1px solid #dcc6cf;background:#fff;color:var(--maroon);border-radius:10px;padding:9px 13px;font:700 12px Tahoma,Arial,sans-serif;cursor:pointer;min-width:76px;transition:transform .2s ease,box-shadow .2s ease,background .2s ease}.language-btn:hover{background:#f8f0f3;transform:translateY(-2px);box-shadow:0 7px 15px #5b21330f}
.music-toggle{font-size:17px;line-height:1;height:40px;min-width:42px;display:inline-grid;place-items:center;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease}.music-toggle:hover{transform:translateY(-2px) scale(1.04);box-shadow:0 7px 16px #5b213313}.music-toggle.needs-interaction{animation:athrMusicHint 1.8s ease-in-out infinite}
@keyframes athrMusicHint{0%,100%{box-shadow:0 0 0 0 #c59a4a00}50%{box-shadow:0 0 0 6px #c59a4a24}}
body[data-language=en]{direction:ltr}body[data-language=en] th,body[data-language=en] td{text-align:left}body[data-language=en] .sidebar{direction:ltr}body[data-language=en] .nav a{text-align:left}body[data-language=en] .top-actions{direction:ltr}body[data-language=en] .platform-title{text-align:center}body[data-language=en] .login-meta{direction:ltr}body[data-language=en] .login-card{text-align:left}body[data-language=en] .field label{text-align:left}body[data-language=en] .timeline{border-right:0;border-left:2px solid #ead9ca;margin-right:0;margin-left:10px;padding-right:0;padding-left:20px}body[data-language=en] .timeline-item:before{right:auto;left:-27px}
@media(max-width:760px){.language-btn{font-size:10px;min-width:62px;padding:8px}.music-toggle{height:34px;min-width:36px;font-size:15px}}
@media(prefers-reduced-motion:reduce){.language-btn,.music-toggle{transition:none}.music-toggle.needs-interaction{animation:none}.language-btn:hover,.music-toggle:hover{transform:none}}

/* V4.18 platform identity, employee code, profile evaluation and permission checkboxes. */
.platform-title>span{display:block;font-size:20px;font-weight:900}.platform-title small{letter-spacing:.2px!important}.platform-title small.mas{font-size:9px;letter-spacing:1.8px!important;color:var(--gold)!important}
.platform-full-name{font:800 15px/1.5 Arial,sans-serif;color:#f8e8ec}.platform-ar-name{font-size:14px;font-weight:700;color:#f4dce4;margin-top:3px}.login-brand .mas{margin:7px 0 16px!important;font-size:10px!important}
.employee-code-strong{display:inline-block;margin:7px 0;padding:6px 12px;border-radius:999px;background:#f5e8ed;color:var(--maroon);font:900 14px/1.2 Arial,sans-serif;letter-spacing:1px;direction:ltr}
.profile-evaluation{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}.profile-evaluation>div{padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:#fbf8f4}.profile-evaluation>div>span:first-child{display:block;color:var(--muted);font-size:11px;margin-bottom:5px}
.permissions-rule{margin-top:16px;border-right:5px solid var(--gold)}.permissions-rule p{margin:7px 0 0;color:var(--muted);line-height:1.8}.permission-checklist{max-height:650px;overflow:auto}.permission-row{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid #f0e9e1}.permission-row label,.role-check{display:flex!important;align-items:flex-start;gap:10px}.permission-row input,.role-check input{width:auto!important;margin-top:3px}.permission-row span,.role-check span{display:block}.permission-row button:disabled{opacity:.45;cursor:not-allowed}
@media(max-width:760px){.platform-title>span{font-size:14px}.platform-title small{font-size:8px!important}.profile-evaluation{grid-template-columns:1fr}.permission-row{align-items:flex-start;flex-direction:column}}

/* Compact, permission-aware record actions used in beneficiary and staff lists. */
.actions-cell{min-width:310px}.row-actions{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.btn-xs{padding:7px 10px;border-radius:8px;font-size:12px;white-space:nowrap}.btn-view{background:#f5f0e9;border:1px solid var(--line);color:var(--maroon)}.btn-edit{background:#eaf3fb;border:1px solid #c9dfef;color:#245f8a}.btn-print{background:#edf7f1;border:1px solid #cce7d7;color:#246f50}.btn-archive{background:#fff5dc;border:1px solid #ead49d;color:#80601c}.btn-delete{background:#fae9e9;border:1px solid #efcaca;color:var(--bad)}
@media(max-width:760px){.actions-cell{min-width:230px}.btn-xs{padding:7px 8px}}

/* V4.12 universal actions and professional A4 printing. */
.section-tools{display:flex;align-items:center;justify-content:flex-end;gap:7px;flex-wrap:wrap;margin:0 0 14px}.section-tools>span{margin-inline-end:auto;color:var(--muted);font-size:12px}.btn-pdf{background:#f1eafb;border:1px solid #d9c9ef;color:#69438b}.btn-upload{background:#e9f6f7;border:1px solid #c8e4e7;color:#256d73}.record-print-sheet,.print-only{display:none}.official-print-head{text-align:center;border-bottom:2px solid var(--maroon);padding:0 0 8px;margin:0 0 14px}.official-print-head b,.official-print-head span,.official-print-head small{display:block}.official-print-head b{font-size:18px;color:var(--maroon)}.official-print-head span{font-size:11px;margin-top:3px}.official-print-head small{font-size:9px;color:#555;margin-top:3px}.official-print-foot{text-align:center;border-top:1px solid #aaa;margin-top:14px;padding-top:6px;font-size:9px}.print-fields{display:grid;grid-template-columns:repeat(2,1fr);gap:7px}.print-fields>div{border:1px solid #bbb;border-radius:5px;padding:7px;break-inside:avoid}.print-fields span{display:block;color:#666;font-size:9px;margin-bottom:3px}.print-fields b{font-size:11px;white-space:pre-wrap}.print-hint{font-size:12px;color:var(--muted)}
.file-drop{display:block;margin:15px 0;padding:18px;border:2px dashed #d8c3ad;border-radius:14px;background:#fcf8f2}.file-drop input{margin:9px 0}.file-drop span{display:block}
.beneficiary-file-tools{grid-column:1/-1;display:flex;align-items:center;gap:8px;flex-wrap:wrap;background:#fbf5e9;border:1px dashed #d9c39d;border-radius:12px;padding:12px}.beneficiary-file-tools>span:first-child{font-weight:700;color:var(--maroon);margin-inline-end:auto}
.hub-kpis{grid-template-columns:repeat(auto-fit,minmax(125px,1fr))}
@page{size:A4 portrait;margin:9mm}
@media print{
 html,body{background:#fff!important;width:210mm;min-height:297mm;margin:0 auto!important;color:#111!important;-webkit-print-color-adjust:exact;print-color-adjust:exact}
 body{font-family:Tahoma,Arial,sans-serif!important}.print-only{display:block!important}.main{width:100%!important;max-width:190mm!important;margin:0 auto!important;padding:0!important}.page-head{margin-bottom:10px}h1{font-size:18px!important;text-align:center}.sub{font-size:9px!important;text-align:center}.card{break-inside:avoid;margin:6px auto!important;padding:8px!important}.table-wrap{overflow:visible!important}table{font-size:9px!important;table-layout:auto}th,td{padding:4px!important}.info-grid{gap:5px!important}.info-item{padding:6px!important}.hub-section{padding:8px!important;margin-top:6px!important}.hub-kpis{gap:4px!important}.hub-kpis .mini{padding:5px!important}
 body.athr-print-page .main{zoom:var(--print-scale,1)}
 body.record-printing .main>*:not(.record-print-sheet){display:none!important}body.record-printing .record-print-sheet{display:block!important;width:100%;margin:0 auto}.record-print-sheet h1{text-align:center;margin:8px 0 12px}.record-print-sheet .print-fields{grid-template-columns:repeat(2,1fr)}
}

/* V4.19: unified Saudi decorative header and balanced ATHR identity. */
.topbar{
 height:132px;
 min-height:132px;
 padding:14px 28px;
 gap:18px;
 overflow:hidden;
 background-color:#fffaf2;
 background-image:url('../athr-header-decor.png');
 background-repeat:no-repeat;
 background-position:center;
 background-size:100% 100%;
 border-bottom:2px solid #c59a4a;
 box-shadow:0 6px 20px rgba(89,36,48,.10)
}
.topbar>*{position:relative;z-index:1}
.topbar .platform-title{
 flex:0 1 560px;
 width:min(560px,48vw);
 max-width:560px;
 padding:9px 24px 8px;
 margin-inline:auto;
 border:1px solid rgba(197,154,74,.62);
 border-radius:16px;
 background:rgba(255,252,246,.90);
 box-shadow:0 8px 25px rgba(91,30,52,.10);
 backdrop-filter:blur(3px);
 -webkit-backdrop-filter:blur(3px);
 line-height:1.25;
 text-align:center
}
.topbar .platform-title>span{font-size:22px;line-height:1.2;color:#741c35}
.topbar .platform-title small{margin-top:2px!important;line-height:1.25;color:#9b2944!important}
.topbar .platform-title small[lang="en"]:not(.mas){font:700 12px/1.25 Arial,Tahoma,sans-serif;letter-spacing:0!important}
.topbar .platform-title small:not([lang="en"]){font-size:12px;font-weight:700}
.topbar .platform-title small.mas{margin-top:3px!important;font-size:9px!important;line-height:1.2;letter-spacing:2px!important;color:#aa7b2f!important}
.topbar .top-actions{
 flex-shrink:0;
 padding:6px;
 border:1px solid rgba(197,154,74,.34);
 border-radius:14px;
 background:rgba(255,255,255,.86);
 box-shadow:0 6px 18px rgba(81,29,46,.08);
 backdrop-filter:blur(3px);
 -webkit-backdrop-filter:blur(3px)
}
.layout{min-height:calc(100vh - 132px)}
@media(max-width:900px){
 .topbar{padding-inline:16px}
 .topbar .platform-title{width:min(520px,62vw)}
}
@media(max-width:760px){
 .topbar{height:auto;min-height:174px;padding:10px 12px;align-content:center;flex-wrap:wrap;gap:7px;background-size:auto 100%}
 .topbar>.platform-title{flex:1 0 100%;width:100%;max-width:none;margin:0;padding:7px 14px}
 .topbar .platform-title>span{font-size:17px}
 .topbar .platform-title small[lang="en"]:not(.mas){font-size:10px!important}
 .topbar .platform-title small:not([lang="en"]){font-size:10px!important}
 .topbar .top-actions{width:100%;justify-content:center;padding:5px;gap:6px}
 .layout{min-height:calc(100vh - 174px)}
}

/* V4.20: proportional banner crop, page-integrated identity and server clock. */
.topbar{
 height:106px;
 min-height:106px;
 padding:9px 24px;
 overflow:hidden;
 isolation:isolate;
 background-color:#fffaf2;
 background-position:center 53%;
 background-size:100% auto;
 border-bottom:2px solid #b8893c;
 box-shadow:0 5px 18px rgba(75,30,42,.09)
}
.topbar:before{
 content:'';
 position:absolute;
 inset:0;
 z-index:0;
 background:linear-gradient(90deg,rgba(255,251,244,.80),rgba(255,251,244,.18) 38%,rgba(255,251,244,.10) 62%,rgba(255,251,244,.76));
 pointer-events:none
}
.topbar .platform-title{
 flex:0 1 530px;
 width:min(530px,43vw);
 max-width:530px;
 margin-inline:0;
 padding:0 12px;
 border:0;
 border-radius:0;
 background:none;
 box-shadow:none;
 backdrop-filter:none;
 -webkit-backdrop-filter:none;
 text-shadow:0 1px 0 rgba(255,255,255,.95),0 2px 10px rgba(255,255,255,.90)
}
.topbar .platform-title>span{font-size:21px;line-height:1.15}
.topbar .platform-title small{margin-top:1px!important;line-height:1.18}
.topbar .platform-title small[lang="en"]:not(.mas){font-size:11px}
.topbar .platform-title small:not([lang="en"]){font-size:11px}
.topbar .platform-title small.mas{margin-top:2px!important;font-size:8px!important}
.athr-datetime{
 min-width:182px;
 display:grid;
 grid-template-columns:auto 1fr;
 grid-template-areas:'label time' 'date date' 'hijri hijri';
 align-items:center;
 gap:2px 10px;
 padding:3px 15px;
 border-inline:1px solid rgba(116,28,53,.22);
 color:#5f2539;
 text-align:start;
 white-space:nowrap;
 text-shadow:0 1px 5px rgba(255,255,255,.95)
}
.athr-clock-label{grid-area:label;color:#8a6a43;font-size:9px;font-weight:700}
.athr-clock-time{grid-area:time;color:#741c35;font:800 18px/1.1 Arial,Tahoma,sans-serif;text-align:end}
.athr-clock-date{grid-area:date;font-size:10px;font-weight:700}
.athr-clock-hijri{grid-area:hijri;color:#916f3b;font-size:9px}
.topbar .top-actions{padding:5px;background:rgba(255,255,255,.78)}
.layout{min-height:calc(100vh - 106px)}
.login-meta .athr-datetime{min-width:250px;border-inline:0;padding:0;white-space:normal;gap:3px 10px}
.login-meta .athr-clock-time{font-size:16px}.login-meta .athr-clock-date,.login-meta .athr-clock-hijri{font-size:9px}
@media(max-width:1180px){
 .topbar{padding-inline:16px}
 .topbar .platform-title{width:min(440px,38vw)}
 .athr-datetime{min-width:155px;padding-inline:9px}.athr-clock-label{display:none}.athr-clock-time{grid-column:1/-1;text-align:center}.athr-clock-date,.athr-clock-hijri{text-align:center}
}
@media(max-width:760px){
 .topbar{height:auto;min-height:174px;padding:8px 11px;gap:5px;background-position:center 52%;background-size:auto 100%}
 .topbar:before{background:rgba(255,251,244,.60)}
 .topbar>.platform-title{flex:1 0 100%;width:100%;max-width:none;padding:0 8px}
 .topbar .platform-title>span{font-size:17px}
 .topbar .platform-title small[lang="en"]:not(.mas),.topbar .platform-title small:not([lang="en"]){font-size:9px!important}
 .athr-datetime{order:2;min-width:0;flex:1;padding:2px 8px;border-inline:0}.athr-clock-time{font-size:15px}.athr-clock-hijri{display:none}
 .topbar .top-actions{order:3;width:auto;flex:1;justify-content:center;overflow-x:auto}
 .layout{min-height:calc(100vh - 174px)}
}

/* V4.21: clean white ATHR header created without the supplied banner artwork. */
.topbar{
 height:100px;
 min-height:100px;
 padding:10px 24px;
 gap:16px;
 overflow:hidden;
 background:#fff;
 background-image:none;
 border-bottom:1px solid #e7ded9;
 box-shadow:0 5px 16px rgba(73,35,48,.07)
}
.topbar:before{
 content:'';
 position:absolute;
 inset:auto 0 0;
 height:4px;
 z-index:0;
 background:linear-gradient(90deg,#741c35 0 34%,#c59a4a 50%,#741c35 66% 100%);
 opacity:.92
}
.topbar:after{
 content:'';
 position:absolute;
 width:260px;
 height:260px;
 inset:-160px auto auto -70px;
 border:1px solid rgba(197,154,74,.15);
 border-radius:50%;
 box-shadow:0 0 0 38px rgba(116,28,53,.025),0 0 0 78px rgba(197,154,74,.025);
 pointer-events:none
}
.topbar .platform-title{
 flex:0 1 390px;
 width:min(390px,34vw);
 max-width:390px;
 margin:0;
 padding:0;
 background:none;
 border:0;
 box-shadow:none;
 text-shadow:none;
 text-align:center
}
.platform-heading{display:flex;align-items:baseline;justify-content:center;gap:8px;line-height:1}
.platform-heading span{color:#75666d;font-size:12px;font-weight:700}
.platform-heading strong{color:#741c35;font:900 34px/.95 Arial,Tahoma,sans-serif;letter-spacing:1.4px}
.topbar .platform-title small{color:#5f5258!important;line-height:1.2;margin-top:2px!important;text-shadow:none}
.topbar .platform-title small[lang="en"]:not(.mas){font-size:10px!important;font-weight:700}
.topbar .platform-title small:not([lang="en"]){font-size:10px!important}
.topbar .platform-title small.mas{color:#a57c3d!important;font-size:8px!important;letter-spacing:2.2px!important}
.topbar .athr-datetime{
 flex:0 0 188px;
 min-width:188px;
 padding:8px 12px;
 gap:3px 8px;
 border:1px solid #eadfd7;
 border-radius:12px;
 background:#faf7f3;
 color:#4f3d45;
 text-shadow:none;
 box-shadow:inset 0 1px 0 #fff
}
.topbar .athr-clock-label{font-size:8px;color:#9a7a49}
.topbar .athr-clock-time{font-size:17px;color:#741c35}
.topbar .athr-clock-date{font-size:9px}.topbar .athr-clock-hijri{font-size:8px;color:#866a42}
.topbar .top-actions{padding:5px;border-color:#ece4df;background:#fff;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none}
.layout{min-height:calc(100vh - 100px)}
.login-meta{
 display:grid;
 grid-template-columns:minmax(0,1fr) auto;
 align-items:center;
 gap:14px;
 margin-top:20px;
 padding-top:16px;
 border-top:1px solid #eee5df
}
.login-meta>span:not(.athr-datetime){display:none}
.login-meta .athr-datetime{
 grid-column:1;
 grid-row:1;
 width:100%;
 min-width:0;
 padding:9px 12px;
 border:1px solid #eadfd7;
 border-radius:12px;
 background:#faf7f3;
 white-space:nowrap;
 text-shadow:none
}
.login-meta .platform-language{grid-column:2;grid-row:1;min-width:92px;height:100%;margin:0}
.login-meta .athr-clock-label{display:block}.login-meta .athr-clock-time{text-align:end}
@media(max-width:1180px){
 .topbar{padding-inline:16px;gap:10px}
 .topbar .platform-title{width:min(330px,30vw)}
 .platform-heading strong{font-size:30px}
 .topbar .athr-datetime{flex-basis:165px;min-width:165px;padding-inline:9px}
}
@media(max-width:760px){
 .topbar{height:auto;min-height:184px;padding:9px 11px;align-content:center;flex-wrap:wrap;background:#fff}
 .topbar>.platform-title{flex:1 0 100%;width:100%;max-width:none}
 .platform-heading strong{font-size:27px}.platform-heading span{font-size:10px}
 .topbar .athr-datetime{order:2;flex:1 1 150px;min-width:145px;padding:6px 8px}
 .topbar .top-actions{order:3;flex:1 1 210px;width:auto;justify-content:center;overflow-x:auto}
 .layout{min-height:calc(100vh - 184px)}
 .login-meta{grid-template-columns:1fr;gap:9px}
 .login-meta .athr-datetime,.login-meta .platform-language{grid-column:1;width:100%}
 .login-meta .athr-datetime{grid-row:1}.login-meta .platform-language{grid-row:2;height:auto}
}


/* Global date direction fix */
input[type='date'],input[type='datetime-local'],input[type='month']{direction:ltr!important;text-align:right!important;unicode-bidi:plaintext;}

/* V4.22: consistent dimensions for form controls in Arabic and English. */
input:not([type='checkbox']):not([type='radio']):not([type='hidden']):not([type='file']):not([type='button']):not([type='submit']):not([type='reset']),select,textarea{
 width:100%;min-height:42px;box-sizing:border-box;border:1px solid #d8cbbf;border-radius:9px;padding:9px 11px;font:inherit;background:#fff
}
textarea{min-height:96px;resize:vertical}
input[type='number'],input[type='time'],input[type='date'],input[type='datetime-local'],input[type='month'],input[type='email'],input[type='tel']{height:42px}

/* HR evaluation criteria overview. */
.hr-criteria-panel{margin-top:20px;padding:24px;border:1px solid #ddcfc7;background:linear-gradient(145deg,#fff,#f6f0ea);box-shadow:0 12px 28px rgba(68,34,46,.09)}
.hr-criteria-head{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:18px}.hr-criteria-head h2{margin:4px 0 6px;color:#5d1f37}.hr-criteria-head p{margin:0;color:#76616b;font-size:12px}.hr-criteria-kicker{color:#a0783c;font-size:11px;font-weight:800}.hr-criteria-total{padding:11px 16px;border-radius:12px;background:#741c35;color:#fff;font-weight:800;white-space:nowrap}
.hr-criteria-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.hr-criterion{display:grid;grid-template-columns:36px 1fr auto;align-items:center;gap:11px;min-height:76px;padding:13px;border:1px solid #e5d9d2;border-radius:14px;background:#fff}.hr-criterion-number{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:#174853;color:#fff;font-weight:800}.hr-criterion b{display:block;color:#47313b;font-size:12px;line-height:1.6}.hr-criterion small{display:block;margin-top:4px;color:#9a8790;font-size:9px}.hr-criterion strong{color:#a0783c;font-size:15px}
@media(max-width:1050px){.hr-criteria-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:650px){.hr-criteria-panel{padding:17px}.hr-criteria-head{align-items:flex-start}.hr-criteria-grid{grid-template-columns:1fr}}

/* V4.27 contact directory */
.directory-page{background:linear-gradient(180deg,#faf8f5 0,#fff 240px)}
.directory-search{width:min(380px,100%)}.directory-search input{border:1px solid #ddcfc6!important;border-radius:14px!important;background:#fff!important;box-shadow:0 8px 22px rgba(78,40,51,.06)}
.directory-summary{display:grid;grid-template-columns:repeat(7,minmax(110px,1fr));gap:10px;margin:18px 0}
.directory-stat{display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;align-items:center;gap:2px 9px;min-height:82px;padding:13px;border:1px solid #e6d9d1;border-radius:16px;background:#fff;color:#51343e;text-align:right;cursor:pointer;box-shadow:0 8px 20px rgba(66,37,47,.05)}
.directory-stat span{grid-row:1/3;font-size:25px}.directory-stat b{font-size:20px;color:#741c35}.directory-stat small{font-size:10px;color:#7e6c73}.directory-stat.active{border-color:#741c35;background:linear-gradient(145deg,#741c35,#4e192c);color:#fff;transform:translateY(-2px)}.directory-stat.active b,.directory-stat.active small{color:#fff}
.directory-panel{padding:22px}.directory-panel-head{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:18px}.directory-panel-head h2{margin:3px 0;color:#542035}.directory-kicker{color:#a0783c;font-size:10px;font-weight:900}
.directory-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.directory-card{display:grid;grid-template-columns:50px 1fr minmax(150px,auto);align-items:center;gap:13px;min-height:98px;padding:15px;border:1px solid #e7dcd5;border-radius:16px;background:#fff;box-shadow:0 7px 19px rgba(67,37,48,.05)}.directory-card.inactive{opacity:.56;background:#f3f0ee}
.directory-avatar{display:grid;place-items:center;width:48px;height:48px;border-radius:15px;background:linear-gradient(145deg,#174853,#247181);color:#fff;font-size:20px;font-weight:900}.directory-avatar.guardian{background:linear-gradient(145deg,#8b6a31,#c59a4a)}.directory-avatar.external{background:linear-gradient(145deg,#741c35,#a23b59)}
.directory-main h3{margin:0 0 5px;color:#432834;font-size:14px}.directory-main h3 em{display:inline-block;padding:2px 6px;border-radius:8px;background:#f1e7d5;color:#8a642d;font-size:9px;font-style:normal}.directory-main p{margin:0 0 4px;color:#78646c;font-size:11px}.directory-main small{display:block;color:#9b8990;font-size:9px;line-height:1.5}.directory-actions{display:flex;flex-direction:column;align-items:flex-start;gap:7px;direction:ltr}.directory-actions a{color:#174853;font-size:11px;font-weight:800;text-decoration:none}.directory-phone{padding:7px 10px;border-radius:9px;background:#edf5f5}.directory-actions span{display:flex;gap:5px}
.directory-editor{margin-top:18px;padding:22px;border:1px solid #d9c9c0;background:linear-gradient(145deg,#fff,#faf5ef)}.directory-editor .directory-notes{grid-column:1/-1}
@media(max-width:1250px){.directory-summary{grid-template-columns:repeat(4,1fr)}}@media(max-width:900px){.directory-cards{grid-template-columns:1fr}.directory-summary{grid-template-columns:repeat(3,1fr)}}@media(max-width:600px){.directory-summary{grid-template-columns:repeat(2,1fr)}.directory-card{grid-template-columns:45px 1fr}.directory-actions{grid-column:1/-1;flex-direction:row;flex-wrap:wrap}.directory-panel-head{align-items:flex-start}}

/* Beneficiary search, period/status filters, and calculated age. */
.beneficiary-filters{grid-template-columns:minmax(240px,2fr) repeat(3,minmax(150px,1fr)) auto;align-items:end}
.beneficiary-filter-actions{display:flex;gap:8px;align-items:end;flex-wrap:wrap}
.beneficiary-result-count{margin-top:12px;color:var(--maroon);font-weight:700}
@media(max-width:1100px){.beneficiary-filters{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:650px){.beneficiary-filters{grid-template-columns:1fr}.beneficiary-filter-actions .btn{flex:1}}

/* ATHR_SIDEBAR_CARD_MENU_20260924 */
@media (min-width:901px){
 .layout{grid-template-columns:320px minmax(0,1fr)}
 .sidebar{padding:15px 12px;background:#f7f8fa;border-left:1px solid #e3e6eb;scrollbar-color:#cbd2db transparent}
 .side-title{margin:3px 8px 12px;padding-bottom:9px;border-bottom:1px solid #dce1e7;color:#463545;font-size:18px;font-weight:800;opacity:1;white-space:nowrap}
 .nav{display:grid;gap:6px}
 .nav a{position:relative;display:flex;align-items:center;justify-content:center;min-width:0;width:100%;min-height:43px;margin:0;padding:6px 34px;border:1px solid #e2e4e8;border-radius:10px;color:#302632;background:var(--nav-card);box-shadow:0 2px 5px rgba(35,43,55,.045);font-size:16px;font-weight:800;line-height:1.2;white-space:nowrap;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;transform-origin:center}
 .nav a .nav-icon{position:absolute;right:10px;top:50%;transform:translateY(-50%);display:inline-flex;align-items:center;justify-content:center;width:23px;font-size:19px;line-height:1}
 .nav a .nav-label{display:block;min-width:0;width:100%;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
 .nav a:hover,.nav a:focus-visible{background:var(--nav-card);transform:scale(1.018);border-color:#b5a6ae;box-shadow:0 5px 11px rgba(35,43,55,.11);outline:none;z-index:1}
 .nav a.active{background:var(--nav-card);border:2px solid #8d6173;box-shadow:inset 0 0 0 1px #fff,0 3px 9px rgba(35,43,55,.09)}
 body[data-language=en] .nav a .nav-label{text-align:center}
 body[data-language=en] .nav a .nav-icon{right:auto;left:13px}
}
@media (prefers-reduced-motion:reduce){.nav a{transition:none!important}.nav a:hover,.nav a:focus-visible{transform:none!important}}
@media (min-width:901px){.nav a:nth-child(1){--nav-card:hsl(322 34% 91%)}}
@media (min-width:901px){.nav a:nth-child(2){--nav-card:hsl(9 34% 91%)}}
@media (min-width:901px){.nav a:nth-child(3){--nav-card:hsl(56 34% 91%)}}
@media (min-width:901px){.nav a:nth-child(4){--nav-card:hsl(103 34% 91%)}}
@media (min-width:901px){.nav a:nth-child(5){--nav-card:hsl(150 34% 91%)}}
@media (min-width:901px){.nav a:nth-child(6){--nav-card:hsl(197 34% 91%)}}
@media (min-width:901px){.nav a:nth-child(7){--nav-card:hsl(244 34% 91%)}}
@media (min-width:901px){.nav a:nth-child(8){--nav-card:hsl(291 34% 91%)}}
@media (min-width:901px){.nav a:nth-child(9){--nav-card:hsl(338 34% 91%)}}
@media (min-width:901px){.nav a:nth-child(10){--nav-card:hsl(25 34% 91%)}}
@media (min-width:901px){.nav a:nth-child(11){--nav-card:hsl(72 34% 91%)}}
@media (min-width:901px){.nav a:nth-child(12){--nav-card:hsl(119 34% 91%)}}
@media (min-width:901px){.nav a:nth-child(13){--nav-card:hsl(166 34% 91%)}}
@media (min-width:901px){.nav a:nth-child(14){--nav-card:hsl(213 34% 91%)}}
@media (min-width:901px){.nav a:nth-child(15){--nav-card:hsl(260 34% 91%)}}
@media (min-width:901px){.nav a:nth-child(16){--nav-card:hsl(307 34% 91%)}}
@media (min-width:901px){.nav a:nth-child(17){--nav-card:hsl(354 34% 91%)}}
@media (min-width:901px){.nav a:nth-child(18){--nav-card:hsl(41 34% 91%)}}
@media (min-width:901px){.nav a:nth-child(19){--nav-card:hsl(88 34% 91%)}}
@media (min-width:901px){.nav a:nth-child(20){--nav-card:hsl(135 34% 91%)}}
@media (min-width:901px){.nav a:nth-child(21){--nav-card:hsl(182 34% 91%)}}
@media (min-width:901px){.nav a:nth-child(22){--nav-card:hsl(229 34% 91%)}}
@media (min-width:901px){.nav a:nth-child(23){--nav-card:hsl(276 34% 91%)}}
@media (min-width:901px){.nav a:nth-child(24){--nav-card:hsl(323 34% 91%)}}
@media (min-width:901px){.nav a:nth-child(25){--nav-card:hsl(10 34% 91%)}}
@media (min-width:901px){.nav a:nth-child(26){--nav-card:hsl(57 34% 91%)}}
@media (min-width:901px){.nav a:nth-child(27){--nav-card:hsl(104 34% 91%)}}
@media (min-width:901px){.nav a:nth-child(28){--nav-card:hsl(151 34% 91%)}}
@media (min-width:901px){.nav a:nth-child(29){--nav-card:hsl(198 34% 91%)}}
@media (min-width:901px){.nav a:nth-child(30){--nav-card:hsl(245 34% 91%)}}
@media (min-width:901px){.nav a:nth-child(31){--nav-card:hsl(292 34% 91%)}}
@media (min-width:901px){.nav a:nth-child(32){--nav-card:hsl(339 34% 91%)}}
@media (min-width:901px){.nav a:nth-child(33){--nav-card:hsl(26 34% 91%)}}

/* ATHR header ECG: restrained animation, driven by real application requests. */
.topbar{position:sticky}.athr-ecg{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:flex;align-items:center;gap:8px;width:clamp(140px,19vw,245px);height:38px;padding:5px 10px;border:1px solid #e9dfe2;border-radius:11px;background:#fff;box-shadow:0 2px 12px #6e20380a;color:#83465c;pointer-events:none;direction:ltr;z-index:0}.athr-ecg svg{height:28px;flex:1;min-width:0;overflow:visible}.athr-ecg-grid{fill:none;stroke:#e9dfe2;stroke-width:1}.athr-ecg-line{fill:none;stroke:#9d5a70;stroke-width:2.3;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:260;stroke-dashoffset:0;animation:athr-ecg-flow 3.3s linear infinite}.athr-ecg-dot{width:7px;height:7px;flex:none;border-radius:50%;background:#9d5a70}.athr-ecg-label{font:10px Tahoma,Arial,sans-serif;white-space:nowrap;direction:rtl}.athr-ecg[data-state=request] .athr-ecg-line{stroke:#bd964c;animation-duration:1s}.athr-ecg[data-state=save] .athr-ecg-line,.athr-ecg[data-state=success] .athr-ecg-line{stroke:#329273;animation-duration:1.4s}.athr-ecg[data-state=error] .athr-ecg-line{stroke:#c15454;animation-duration:.9s}.athr-ecg[data-state=error] .athr-ecg-dot{background:#c15454}@keyframes athr-ecg-flow{to{stroke-dashoffset:-520}}.topbar>.top-actions,.topbar>.top-brand,.topbar>.platform-title{position:relative;z-index:1}@media(max-width:1080px){.athr-ecg{width:118px}.athr-ecg-label{display:none}}@media(max-width:720px){.athr-ecg{display:none}}@media(prefers-reduced-motion:reduce){.athr-ecg-line{animation:none}}

/* Keep the existing server clock visible beside the centered ECG. */
@media(min-width:1181px){.topbar>.athr-datetime{position:absolute;left:calc(50% - 325px);top:50%;transform:translateY(-50%);z-index:1}.topbar>.athr-ecg{width:240px;z-index:2}}
@media(min-width:761px) and (max-width:1180px){.topbar>.athr-ecg{display:none}}
/* Visible ECG motion even while no request is in flight. */
.athr-ecg{overflow:hidden;isolation:isolate}
.athr-ecg .athr-ecg-line{stroke-dasharray:20 9;stroke-dashoffset:0;animation:athr-ecg-trace 1.8s linear infinite;filter:drop-shadow(0 0 2px #9d5a7070)}
.athr-ecg::after{content:"";position:absolute;top:4px;left:0;width:28px;height:30px;background:linear-gradient(90deg,transparent,#ffffffb3 47%,#d69aae7a 53%,transparent);opacity:.8;animation:athr-ecg-scan 2.7s linear infinite;pointer-events:none}
.athr-ecg-dot{animation:athr-ecg-beat 1.8s ease-in-out infinite}
.athr-ecg[data-state=request] .athr-ecg-line,.athr-ecg[data-state=save] .athr-ecg-line,.athr-ecg[data-state=error] .athr-ecg-line{animation-duration:.65s}
.athr-ecg[data-state=request]::after,.athr-ecg[data-state=save]::after,.athr-ecg[data-state=error]::after{animation-duration:1.1s}
@keyframes athr-ecg-trace{to{stroke-dashoffset:-58}}
@keyframes athr-ecg-scan{from{left:-30px}to{left:calc(100% + 5px)}}
@keyframes athr-ecg-beat{0%,45%,100%{transform:scale(.8);opacity:.65}12%,60%{transform:scale(1.35);opacity:1}}
@media(prefers-reduced-motion:reduce){.athr-ecg .athr-ecg-line,.athr-ecg::after,.athr-ecg-dot{animation:none}}
/* Move the ECG slightly left of the header midpoint while keeping the clock separate. */
@media(min-width:1181px){.topbar>.athr-datetime{left:calc(50% - 390px)}.topbar>.athr-ecg{left:calc(50% - 85px)}}
/* Dark ECG monitor with green live signal and clear spacing from the clock. */
.topbar>.athr-ecg{background:#322821;border:1px solid #745a43;box-shadow:inset 0 1px 0 #9a785533,0 4px 13px #241b1850;color:#e9ddcc}
.topbar>.athr-ecg .athr-ecg-grid{stroke:#6a5946;opacity:.5}
.topbar>.athr-ecg .athr-ecg-line,
.topbar>.athr-ecg[data-state=request] .athr-ecg-line,
.topbar>.athr-ecg[data-state=save] .athr-ecg-line,
.topbar>.athr-ecg[data-state=success] .athr-ecg-line,
.topbar>.athr-ecg[data-state=error] .athr-ecg-line{stroke:#51df8d;stroke-dasharray:none;filter:drop-shadow(0 0 3px #45ec8b9c);animation:athr-ecg-glow 1.8s ease-in-out infinite}
.topbar>.athr-ecg .athr-ecg-dot{background:#51df8d;box-shadow:0 0 7px #51df8d}
.topbar>.athr-ecg::after{background:linear-gradient(90deg,transparent,#52e89b13 30%,#52e89b88 51%,transparent 75%);mix-blend-mode:screen}
@keyframes athr-ecg-glow{0%,100%{opacity:.68}35%{opacity:1}65%{opacity:.82}}
@media(min-width:1181px){.topbar>.athr-datetime{left:calc(50% - 465px)}.topbar>.athr-ecg{left:calc(50% - 120px)}}
@media(prefers-reduced-motion:reduce){.topbar>.athr-ecg .athr-ecg-line{animation:none}}
/* Restore the server clock to the center of the header. */
@media(min-width:1181px){.topbar>.athr-datetime{left:50%;transform:translate(-50%,-50%)}.topbar>.athr-ecg{left:calc(50% - 255px)}}
