:root{
  --navy:#08254f;
  --navy2:#0e376f;
  --gold:#c99a3d;
  --gold2:#e8c879;
  --bg:#f5f7fa;
  --surface:#ffffff;
  --text:#10233f;
  --muted:#748095;
  --line:#e6e9ef;
  --shadow:0 14px 34px rgba(8,37,79,.09);
}
*{box-sizing:border-box}
html{direction:rtl}
body{
  margin:0;
  font-family:"Tajawal","Segoe UI",Tahoma,Arial,sans-serif;
  color:var(--text);
  background:
    radial-gradient(circle at 12% 5%,rgba(201,154,61,.10),transparent 22%),
    linear-gradient(180deg,#ffffff 0%,var(--bg) 100%);
}
a{text-decoration:none;color:inherit}
button{font:inherit}
.home-topbar{
  min-height:86px;
  padding:12px 34px;
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  gap:20px;
  background:linear-gradient(90deg,var(--navy2),var(--navy));
  color:#fff;
  box-shadow:0 6px 22px rgba(8,37,79,.17);
}
.home-brand{display:flex;align-items:center;gap:14px;justify-self:end}
.home-logo{
  width:66px;height:66px;border-radius:16px;background:#fff;
  border:2px solid rgba(201,154,61,.75);padding:5px;object-fit:contain;
}
.home-brand h1{margin:0;color:var(--gold2);font-size:24px}
.home-brand p{margin:4px 0 0;color:#d8e1ed;font-size:13px}
.system-name{text-align:center}
.system-name strong{display:block;font-size:24px}
.system-name small{display:block;color:#d8e1ed;margin-top:4px}
.home-user{
  justify-self:start;display:flex;align-items:center;gap:10px;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.17);
  border-radius:14px;padding:10px 14px
}
.home-avatar{
  width:42px;height:42px;border-radius:50%;display:grid;place-items:center;
  background:var(--gold);color:var(--navy);font-weight:900
}
.home-user small{display:block;color:#d7dfeb;margin-top:3px}
.home-hero{
  position:relative;overflow:hidden;
  min-height:240px;padding:44px 5vw 34px;
  display:flex;align-items:center;justify-content:space-between;gap:24px;
  background:
    linear-gradient(90deg,rgba(255,255,255,.98),rgba(255,255,255,.91)),
    linear-gradient(135deg,rgba(201,154,61,.05),rgba(8,37,79,.04));
  border-bottom:1px solid var(--line)
}
.home-hero:before{
  content:"";position:absolute;inset:auto 0 0 0;height:155px;opacity:.10;
  background:
    linear-gradient(to top,var(--navy) 0 45%,transparent 45%) 4% 100%/36px 95px no-repeat,
    linear-gradient(to top,var(--navy) 0 62%,transparent 62%) 14% 100%/52px 145px no-repeat,
    linear-gradient(to top,var(--navy) 0 52%,transparent 52%) 27% 100%/42px 118px no-repeat,
    linear-gradient(to top,var(--navy) 0 70%,transparent 70%) 43% 100%/56px 155px no-repeat,
    linear-gradient(to top,var(--navy) 0 48%,transparent 48%) 61% 100%/44px 110px no-repeat,
    linear-gradient(to top,var(--navy) 0 58%,transparent 58%) 78% 100%/48px 135px no-repeat,
    linear-gradient(to top,var(--navy) 0 42%,transparent 42%) 93% 100%/38px 90px no-repeat;
}
.home-hero-copy{position:relative;z-index:1;max-width:760px}
.home-hero h2{font-size:42px;margin:0 0 12px;color:var(--navy)}
.home-hero h2 span{color:var(--gold)}
.home-hero h3{font-size:22px;margin:0 0 10px}
.home-hero p{font-size:17px;line-height:1.85;color:var(--muted);margin:0}
.home-wrap{padding:28px 2vw 42px}
.home-grid{
  max-width:1500px;margin:0 auto;
  display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:18px
}
.home-card{
  background:var(--surface);border:1px solid var(--line);
  border-top:3px solid var(--gold);border-radius:18px;
  box-shadow:var(--shadow);padding:18px;
  min-height:430px;display:flex;flex-direction:column;
  transition:.22s ease
}
.home-card:hover{transform:translateY(-4px);box-shadow:0 20px 42px rgba(8,37,79,.14)}
.home-card-icon{
  width:70px;height:70px;margin:0 auto 16px;border-radius:50%;
  display:grid;place-items:center;
  background:linear-gradient(145deg,var(--navy2),var(--navy));
  color:var(--gold2);font-size:30px;border:2px solid rgba(201,154,61,.52)
}
.home-card h3{text-align:center;margin:0;color:var(--navy);font-size:21px}
.home-card .desc{
  text-align:center;color:var(--muted);line-height:1.65;
  margin:10px 0 15px;min-height:66px
}
.home-list{border:1px solid var(--line);border-radius:12px;overflow:hidden;margin-bottom:17px}
.home-row{
  min-height:42px;padding:9px 12px;
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  border-bottom:1px solid var(--line);font-size:13px
}
.home-row:last-child{border-bottom:0}
.home-row b{color:var(--gold);font-weight:900}
.home-enter{
  margin-top:auto;min-height:45px;border-radius:10px;
  display:flex;align-items:center;justify-content:center;
  background:linear-gradient(90deg,var(--navy),var(--navy2));
  color:#fff;border:1px solid var(--gold);font-weight:900
}
.home-enter:hover{background:linear-gradient(90deg,#0b3268,#164985)}
.home-overview{
  max-width:1500px;margin:28px auto 0;
  display:grid;grid-template-columns:1.3fr repeat(4,1fr);
  background:#fff;border:1px solid var(--line);
  border-radius:16px;box-shadow:var(--shadow);overflow:hidden
}
.overview-item{padding:17px;text-align:center;border-left:1px solid var(--line)}
.overview-item:first-child{text-align:right}
.overview-item strong{display:block;color:var(--navy);font-size:22px;margin-top:5px}
.overview-item small{color:var(--muted)}
.status-dot{display:inline-block;width:9px;height:9px;border-radius:50%;background:#2d9a66;margin-left:7px}
.home-footer{text-align:center;color:#7a8495;padding:16px 10px 28px}
@media(max-width:1200px){
  .home-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .home-overview{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:760px){
  .home-topbar{
    min-height:auto;padding:12px 14px;
    grid-template-columns:auto 1fr auto
  }
  .home-brand h1,.home-brand p{display:none}
  .home-logo{width:54px;height:54px}
  .system-name strong{font-size:19px}
  .system-name small{font-size:11px}
  .home-user{padding:7px 9px}
  .home-user div:not(.home-avatar){display:none}
  .home-avatar{width:38px;height:38px}
  .home-hero{padding:34px 20px;min-height:220px}
  .home-hero h2{font-size:31px}
  .home-hero h3{font-size:18px}
  .home-hero p{font-size:15px}
  .home-wrap{padding:18px 14px 34px}
  .home-grid{grid-template-columns:1fr}
  .home-card{min-height:auto;padding:17px}
  .home-card .desc{min-height:auto}
  .home-overview{grid-template-columns:1fr}
  .overview-item{border-left:0;border-bottom:1px solid var(--line)}
}

/* ===== MRIS v5: mobile-first + real-estate visual layer ===== */

body{
  overflow-x:hidden;
  background:
    radial-gradient(circle at 88% 8%,rgba(201,154,61,.11),transparent 23%),
    radial-gradient(circle at 8% 16%,rgba(8,37,79,.08),transparent 27%),
    linear-gradient(180deg,#ffffff 0%,#f4f6f9 100%);
}

.home-topbar{
  position:sticky;
  top:0;
  z-index:80;
  border-bottom:1px solid rgba(201,154,61,.45);
  backdrop-filter:blur(14px);
}

.home-logo{
  width:72px;
  height:72px;
  box-shadow:0 8px 22px rgba(0,0,0,.16);
}

.home-avatar{
  background:linear-gradient(145deg,var(--gold2),var(--gold));
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.45);
}

.home-hero{
  min-height:320px;
  isolation:isolate;
  background:
    linear-gradient(90deg,rgba(255,255,255,.96) 0%,rgba(255,255,255,.86) 55%,rgba(255,255,255,.70) 100%),
    radial-gradient(circle at 74% 36%,rgba(201,154,61,.13),transparent 24%),
    linear-gradient(135deg,#fdfdfd 0%,#eef2f7 100%);
}

.home-hero:before{
  height:230px;
  opacity:.20;
  filter:drop-shadow(0 8px 6px rgba(8,37,79,.05));
  background:
    linear-gradient(to top,var(--navy) 0 45%,transparent 45%) 1% 100%/32px 112px no-repeat,
    linear-gradient(to top,var(--navy) 0 70%,transparent 70%) 8% 100%/48px 184px no-repeat,
    linear-gradient(to top,var(--navy) 0 55%,transparent 55%) 18% 100%/38px 142px no-repeat,
    linear-gradient(to top,var(--navy) 0 82%,transparent 82%) 28% 100%/58px 218px no-repeat,
    linear-gradient(to top,var(--navy) 0 64%,transparent 64%) 41% 100%/44px 166px no-repeat,
    linear-gradient(to top,var(--navy) 0 90%,transparent 90%) 54% 100%/64px 230px no-repeat,
    linear-gradient(to top,var(--navy) 0 61%,transparent 61%) 68% 100%/46px 158px no-repeat,
    linear-gradient(to top,var(--navy) 0 75%,transparent 75%) 81% 100%/54px 198px no-repeat,
    linear-gradient(to top,var(--navy) 0 52%,transparent 52%) 93% 100%/34px 130px no-repeat;
  border-bottom:3px solid rgba(201,154,61,.35);
}

.home-hero:after{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  opacity:.17;
  pointer-events:none;
  background:
    linear-gradient(30deg,transparent 48%,rgba(201,154,61,.35) 49%,transparent 50%) 0 0/90px 90px,
    linear-gradient(150deg,transparent 48%,rgba(8,37,79,.18) 49%,transparent 50%) 0 0/120px 120px;
  mask-image:linear-gradient(to left,#000,transparent 62%);
}

.home-hero-copy{
  max-width:820px;
  margin-inline-start:auto;
}

.home-hero h2{
  font-size:clamp(34px,4.2vw,56px);
  line-height:1.25;
  letter-spacing:-.5px;
}

.home-hero h3{
  font-size:clamp(19px,2vw,27px);
}

.home-hero p{
  max-width:780px;
  font-size:clamp(15px,1.4vw,19px);
}

.home-card{
  position:relative;
  overflow:hidden;
  backdrop-filter:blur(10px);
  border-top-width:4px;
}

.home-card:after{
  content:"";
  position:absolute;
  width:150px;
  height:150px;
  left:-70px;
  bottom:-70px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(201,154,61,.10),transparent 68%);
  pointer-events:none;
}

.home-card-icon{
  box-shadow:0 10px 24px rgba(8,37,79,.16);
}

.home-enter{
  min-height:50px;
  box-shadow:0 8px 18px rgba(8,37,79,.14);
}

.home-row b{
  max-width:48%;
  text-align:left;
  font-size:12px;
}

@media(max-width:760px){
  body{
    background:
      radial-gradient(circle at 90% 4%,rgba(201,154,61,.12),transparent 22%),
      linear-gradient(180deg,#fff 0%,#f5f7fa 100%);
  }

  .home-topbar{
    min-height:76px;
    padding:10px 12px;
    grid-template-columns:58px 1fr 46px;
    gap:8px;
  }

  .home-brand{
    justify-self:end;
  }

  .home-logo{
    width:56px;
    height:56px;
    border-radius:14px;
  }

  .system-name{
    min-width:0;
  }

  .system-name strong{
    font-size:20px;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }

  .system-name small{
    font-size:11px;
  }

  .home-user{
    justify-self:start;
    padding:0;
    border:0;
    background:transparent;
  }

  .home-avatar{
    width:42px;
    height:42px;
    font-size:15px;
  }

  .home-hero{
    min-height:300px;
    padding:34px 20px 100px;
    align-items:flex-start;
  }

  .home-hero:before{
    height:125px;
    opacity:.24;
    background:
      linear-gradient(to top,var(--navy) 0 48%,transparent 48%) 3% 100%/26px 74px no-repeat,
      linear-gradient(to top,var(--navy) 0 72%,transparent 72%) 14% 100%/36px 112px no-repeat,
      linear-gradient(to top,var(--navy) 0 60%,transparent 60%) 28% 100%/30px 92px no-repeat,
      linear-gradient(to top,var(--navy) 0 84%,transparent 84%) 45% 100%/42px 124px no-repeat,
      linear-gradient(to top,var(--navy) 0 65%,transparent 65%) 64% 100%/34px 98px no-repeat,
      linear-gradient(to top,var(--navy) 0 75%,transparent 75%) 81% 100%/38px 115px no-repeat,
      linear-gradient(to top,var(--navy) 0 55%,transparent 55%) 96% 100%/26px 80px no-repeat;
  }

  .home-hero:after{
    opacity:.11;
    mask-image:linear-gradient(to bottom,#000,transparent 75%);
  }

  .home-hero h2{
    font-size:32px;
    margin-bottom:14px;
  }

  .home-hero h3{
    font-size:18px;
    line-height:1.6;
  }

  .home-hero p{
    font-size:15px;
    line-height:1.8;
  }

  .home-wrap{
    padding:16px 12px 28px;
  }

  .home-grid{
    gap:14px;
  }

  .home-card{
    border-radius:16px;
    padding:15px;
    min-height:auto;
  }

  .home-card-icon{
    width:60px;
    height:60px;
    margin-bottom:12px;
    font-size:25px;
  }

  .home-card h3{
    font-size:20px;
  }

  .home-card .desc{
    font-size:14px;
    margin:8px 0 12px;
    line-height:1.55;
  }

  .home-row{
    min-height:39px;
    padding:8px 10px;
  }

  .home-row span{
    font-size:13px;
  }

  .home-enter{
    min-height:48px;
    font-size:16px;
  }

  .home-overview{
    margin-top:16px;
    border-radius:14px;
  }

  .overview-item{
    padding:14px;
  }
}

@media(min-width:761px) and (max-width:1200px){
  .home-hero{
    min-height:285px;
  }

  .home-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media(min-width:1400px){
  .home-wrap{
    padding-inline:3vw;
  }

  .home-grid{
    gap:22px;
  }

  .home-card{
    min-height:450px;
  }
}

/* ===== MRIS v6: account and navigation side drawer ===== */
.home-user{
  border:1px solid rgba(255,255,255,.18);
  cursor:pointer;
  text-align:right;
}
.home-user:hover{background:rgba(255,255,255,.14)}
.account-drawer-overlay{
  position:fixed;inset:0;z-index:119;
  background:rgba(3,16,36,.56);backdrop-filter:blur(3px);
  opacity:0;visibility:hidden;transition:.22s ease;
}
.account-drawer{
  position:fixed;top:0;right:0;z-index:120;
  width:min(88vw,390px);height:100dvh;
  display:flex;flex-direction:column;color:#fff;
  background:
    radial-gradient(circle at 82% 8%,rgba(201,154,61,.16),transparent 24%),
    linear-gradient(180deg,#092957 0%,#061a38 100%);
  box-shadow:-18px 0 42px rgba(0,0,0,.30);
  transform:translateX(105%);
  transition:.26s cubic-bezier(.2,.8,.2,1);
  overflow:hidden;
}
.account-drawer-open .account-drawer{transform:translateX(0)}
.account-drawer-open .account-drawer-overlay{opacity:1;visibility:visible}
.account-drawer-head{
  position:relative;padding:30px 24px 24px;text-align:center;
  border-bottom:1px solid rgba(255,255,255,.12);
}
.account-close{
  position:absolute;top:16px;left:16px;width:42px;height:42px;
  border:0;border-radius:50%;background:rgba(255,255,255,.10);
  color:#fff;font-size:30px;cursor:pointer;
}
.account-photo{
  width:92px;height:92px;margin:0 auto 14px;display:grid;place-items:center;
  border-radius:50%;background:linear-gradient(145deg,var(--gold2),var(--gold));
  color:var(--navy);font-size:32px;font-weight:900;
  border:4px solid rgba(255,255,255,.22);
  box-shadow:0 10px 26px rgba(0,0,0,.20);
}
.account-info strong{display:block;font-size:23px}
.account-info small{display:block;color:#cad5e4;margin-top:5px}
.account-nav{flex:1;overflow-y:auto;padding:18px 16px}
.account-nav-title{color:var(--gold2);font-weight:900;font-size:14px;padding:8px 12px}
.account-nav a{
  min-height:50px;padding:11px 13px;margin:4px 0;border-radius:12px;
  display:flex;align-items:center;gap:13px;color:#edf2f8;transition:.18s ease;
}
.account-nav a span{
  width:34px;height:34px;display:grid;place-items:center;border-radius:10px;
  color:var(--gold2);background:rgba(255,255,255,.08);
}
.account-nav a:hover{background:rgba(255,255,255,.09)}
.account-nav-separator{height:1px;background:rgba(255,255,255,.12);margin:14px 4px}
.account-logout{
  min-height:66px;padding:0 24px;display:flex;align-items:center;
  justify-content:center;gap:12px;color:#ff7b7b;font-size:18px;font-weight:900;
  background:rgba(0,0,0,.16);border-top:1px solid rgba(255,255,255,.10);
}
body.account-drawer-open{overflow:hidden}

@media(min-width:1000px){
  .account-drawer{width:370px}
}
@media(max-width:760px){
  .home-user{width:44px;height:44px;display:grid;place-items:center}
  .home-avatar{width:38px;height:38px}
  .account-drawer{width:min(90vw,360px)}
  .account-drawer-head{padding-top:34px}
}