:root{
  --eshraq-green:#147a62;--eshraq-green-deep:#0c5848;--eshraq-green-soft:#e7f4ee;
  --eshraq-gold:#d5a43f;--eshraq-gold-soft:#fff4d8;--eshraq-cream:#f8f3e8;
  --eshraq-ink:#153a32;--eshraq-shadow:0 18px 44px rgba(35,69,57,.13);
  --eshraq-shadow-soft:0 10px 26px rgba(35,69,57,.09);--eshraq-radius:22px
}
html,body{background:
 radial-gradient(circle at 86% 8%,rgba(213,164,63,.13),transparent 25%),
 radial-gradient(circle at 4% 18%,rgba(20,122,98,.08),transparent 22%),
 linear-gradient(180deg,#fbf8f0 0%,#f7f1e5 100%);background-attachment:fixed}
body:before{content:"";position:fixed;inset:0;pointer-events:none;z-index:-1;background-image:linear-gradient(rgba(255,255,255,.28) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.18) 1px,transparent 1px);background-size:48px 48px;mask-image:linear-gradient(to bottom,rgba(0,0,0,.3),transparent 70%)}
.topbar{padding:12px clamp(16px,3vw,42px);background:rgba(255,253,247,.9);border-bottom:1px solid rgba(213,164,63,.25);box-shadow:0 8px 22px rgba(31,67,55,.06)}
.brand-team-logo{width:54px;height:54px;filter:drop-shadow(0 6px 10px rgba(20,122,98,.15))}.brand-lockup b{font-size:16px;color:var(--eshraq-green-deep)}.brand-lockup span{font-size:12px}
.top-actions{gap:10px}.icon-btn,.profile-button,.global-back{box-shadow:0 6px 14px rgba(28,57,48,.08);transition:.2s ease}.icon-btn:hover,.profile-button:hover,.global-back:hover{transform:translateY(-2px);box-shadow:0 10px 18px rgba(28,57,48,.13)}
.global-back{display:inline-flex;align-items:center;gap:7px;border:1px solid #e7dcc6;background:#fffdf8;color:var(--eshraq-green-deep);padding:10px 13px;border-radius:14px;font-weight:800;cursor:pointer}
.pro-nav{position:sticky;top:79px;z-index:18;width:min(1280px,96vw);margin:12px auto 0;display:flex;gap:8px;padding:10px;background:rgba(255,253,247,.88);backdrop-filter:blur(14px);border:1px solid rgba(213,164,63,.22);border-radius:20px;box-shadow:var(--eshraq-shadow-soft);overflow:auto;scrollbar-width:thin}
.pro-nav button{min-width:104px;border:1px solid rgba(20,122,98,.09);background:linear-gradient(180deg,#fff,#fdfaf4);border-radius:16px;padding:9px 10px;color:var(--eshraq-ink);cursor:pointer;display:grid;place-items:center;gap:5px;font-weight:800;transition:.2s ease}
.pro-nav button:hover,.pro-nav button.active{transform:translateY(-2px);border-color:rgba(20,122,98,.28);background:linear-gradient(180deg,#eff9f4,#fff);box-shadow:0 8px 16px rgba(20,122,98,.10)}
.pro-nav .nav3d,.section-3d{font-size:25px;line-height:1;filter:drop-shadow(0 4px 5px rgba(20,70,55,.16))}.pro-nav small{font-size:11px}
.shell{width:min(1280px,96vw);margin-top:18px}.card,.auth-card,.modal-card{border-color:rgba(213,164,63,.22);border-radius:var(--eshraq-radius);box-shadow:var(--eshraq-shadow-soft);background:linear-gradient(145deg,rgba(255,255,255,.98),rgba(255,253,248,.95));position:relative;overflow:hidden}.card:before{content:"";position:absolute;inset:0 0 auto 0;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.95),transparent)}
.card{transition:transform .22s ease,box-shadow .22s ease}.card:hover{transform:translateY(-2px);box-shadow:var(--eshraq-shadow)}
.hero{padding:26px;background:linear-gradient(118deg,#0f644f 0%,#1b8064 58%,#3e9c75 100%);color:#fff;border:none;box-shadow:0 20px 42px rgba(10,83,65,.23)}.hero:after{content:"✦";position:absolute;left:5%;top:12%;font-size:86px;color:rgba(255,220,140,.14);transform:rotate(-12deg)}.hero .muted,.hero .tiny{color:rgba(255,255,255,.77)}.hero-brand{background:rgba(255,255,255,.12);padding:10px 14px;border-radius:18px;border:1px solid rgba(255,255,255,.18);backdrop-filter:blur(8px)}.hero-brand img{filter:drop-shadow(0 7px 12px rgba(0,0,0,.16))}
.metrics{grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.metric{min-height:118px;padding:18px 18px 16px;display:flex;flex-direction:column;justify-content:center}.metric b{font-size:32px;letter-spacing:-1px}.metric:after{position:absolute;left:15px;top:14px;width:44px;height:44px;display:grid;place-items:center;border-radius:15px;font-size:23px;box-shadow:inset 0 1px rgba(255,255,255,.8),0 8px 16px rgba(0,0,0,.07)}.metric:nth-child(1){background:linear-gradient(145deg,#fff,#edf8f3)}.metric:nth-child(1):after{content:"📁";background:#e2f4ea}.metric:nth-child(2){background:linear-gradient(145deg,#fff,#eef6ff)}.metric:nth-child(2):after{content:"🛋️";background:#e4f0ff}.metric:nth-child(3){background:linear-gradient(145deg,#fff,#fff7e6)}.metric:nth-child(3):after{content:"📅";background:#fff0c9}.metric:nth-child(4){background:linear-gradient(145deg,#fff,#fff0f1)}.metric:nth-child(4):after{content:"💬";background:#ffe2e5}.metric span{font-size:13px;font-weight:700}
.quick-grid{gap:11px}.quick-grid .btn{min-height:58px;background:linear-gradient(145deg,#fff,#fbf8f1);border:1px solid rgba(20,122,98,.11);box-shadow:0 6px 14px rgba(34,65,55,.07);display:flex;align-items:center;justify-content:center;gap:8px}.quick-grid .btn:hover{transform:translateY(-2px);border-color:rgba(20,122,98,.3)}
.page-head{padding:5px 2px}.page-head h2{font-size:28px;color:var(--eshraq-green-deep);display:flex;align-items:center;gap:10px}.page-head h2 .section-3d{font-size:30px}.page-head p{font-size:13px}.page-head .btn.primary{box-shadow:0 8px 18px rgba(20,122,98,.2)}
.item{border-color:rgba(213,164,63,.2);background:linear-gradient(145deg,#fff,#fffdf8);box-shadow:0 5px 12px rgba(48,69,61,.04)}.item-button:hover{border-color:rgba(20,122,98,.28);transform:translateY(-1px)}
.empty,.loading-state{border-style:solid;border-color:#eadfc9;background:linear-gradient(145deg,#fffdf9,#fbf7ee);min-height:94px;display:grid;place-items:center}.empty:before{content:"🌿";display:block;font-size:24px;margin-bottom:6px}.error-state{border:1px solid #e8b7b0;background:#fff8f6;box-shadow:inset 5px 0 #ba4638}.error-state:before{content:"⚠️";display:block;font-size:23px;margin-bottom:6px}
.tag{background:linear-gradient(145deg,#e8f6ef,#dff1e8);box-shadow:inset 0 1px rgba(255,255,255,.8)}
.btn{transition:.2s ease}.btn.primary{background:linear-gradient(145deg,#18876c,#0f6b56);box-shadow:0 7px 15px rgba(20,122,98,.18)}.btn.primary:hover{background:linear-gradient(145deg,#147a62,#0c5848);transform:translateY(-1px)}.btn.soft{background:linear-gradient(145deg,#fff,#f3eee4)}
.profile-popover{position:fixed;z-index:80;top:78px;left:22px;width:min(330px,calc(100vw - 30px));padding:16px;border:1px solid rgba(213,164,63,.28);border-radius:22px;background:rgba(255,253,247,.98);box-shadow:0 22px 52px rgba(20,56,47,.22);backdrop-filter:blur(16px)}.profile-popover.hidden{display:none}.profile-popover-head{display:flex;align-items:center;gap:12px;padding-bottom:13px;border-bottom:1px solid #ece2cf}.profile-popover-avatar{width:58px;height:58px;border-radius:50%;object-fit:cover;background:#edf4ef;border:3px solid #fff;box-shadow:0 6px 14px rgba(20,122,98,.16)}.profile-popover-actions{display:grid;gap:8px;margin-top:12px}.profile-popover-actions button{width:100%;border:0;border-radius:13px;background:#fff;padding:11px 12px;text-align:right;cursor:pointer;font-weight:800;color:var(--eshraq-ink)}.profile-popover-actions button:hover{background:#edf8f3}.profile-popover-actions .danger-lite{color:#8b2d27;background:#fff7f5}
.profile-dialog .modal-card{width:min(520px,94vw)}.profile-upload-label{display:grid;place-items:center;gap:9px;padding:20px;border:1px dashed #ccb77f;border-radius:16px;background:#fffaf0;cursor:pointer}.profile-upload-label span:first-child{font-size:34px}
.nav{background:rgba(255,253,247,.97);box-shadow:0 -8px 24px rgba(28,57,48,.08)}.nav button span{filter:drop-shadow(0 4px 4px rgba(20,70,55,.16));font-size:23px}.nav button.active{background:#edf8f3;border-radius:13px}
.auth-card{padding:30px;background:linear-gradient(145deg,#fff,#fffdf7)}.team-logo{filter:drop-shadow(0 8px 12px rgba(20,122,98,.13))}.auth-card:after{content:"";position:absolute;inset:auto -45px -55px auto;width:140px;height:140px;border-radius:50%;background:radial-gradient(circle,rgba(213,164,63,.13),transparent 68%)}
@media(max-width:900px){.pro-nav{top:75px}.metrics{grid-template-columns:repeat(2,1fr)}.global-back .back-label{display:none}.global-back{padding:10px}}
@media(max-width:620px){.pro-nav{display:none}.metrics{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.metric{min-height:100px}.metric b{font-size:27px}.hero{padding:20px}.profile-popover{left:10px;top:70px}.shell{margin-bottom:96px}.quick-grid .btn{min-height:52px}}
@media(max-width:420px){.metrics{grid-template-columns:1fr 1fr}.metric:after{width:38px;height:38px;font-size:20px}.page-head h2{font-size:24px}}