@import url('/assets/brand/brand-tokens.css');
@keyframes aalamWave{0%,100%{transform:translate3d(-3%,0,0) rotate(0deg)}50%{transform:translate3d(4%,-2%,0) rotate(2deg)}}
@keyframes aalamShine{0%{transform:translateX(-180%) skewX(-18deg)}100%{transform:translateX(300%) skewX(-18deg)}}
@keyframes aalamPulse{0%,100%{box-shadow:0 0 0 0 rgba(249,11,241,.20)}50%{box-shadow:0 0 0 8px rgba(249,11,241,0)}}
html,body{height:100%;margin:0}
body{overflow:hidden!important;background:var(--aalam-bg)!important;color:var(--aalam-ink)!important}
.wrap{direction:ltr!important;width:100%!important;max-width:none!important;height:100dvh!important;margin:0!important;padding:14px!important;box-sizing:border-box!important;display:grid!important;grid-template-columns:minmax(0,1fr) 306px!important;grid-template-rows:auto auto auto minmax(0,1fr)!important;grid-template-areas:"top sidebar" "stage sidebar" "metrics sidebar" "content sidebar"!important;gap:12px!important;overflow:hidden!important;position:relative!important;background:radial-gradient(circle at 7% 0%,rgba(29,118,254,.13),transparent 29%),radial-gradient(circle at 80% 6%,rgba(249,11,241,.12),transparent 27%),radial-gradient(circle at 45% 100%,rgba(164,49,246,.08),transparent 30%),#F7F9FF!important}
.wrap:before,.wrap:after{content:"";position:absolute;pointer-events:none;z-index:0;border-radius:48% 52% 54% 46%;filter:blur(5px);opacity:.52;animation:aalamWave 14s ease-in-out infinite}
.wrap:before{width:560px;height:190px;left:2%;top:-125px;background:linear-gradient(120deg,rgba(29,118,254,.24),rgba(164,49,246,.18),rgba(249,11,241,.20))}
.wrap:after{width:440px;height:165px;right:17%;bottom:-118px;background:linear-gradient(120deg,rgba(249,11,241,.18),rgba(91,156,254,.18),rgba(100,216,255,.14));animation-delay:-6s}
.wrap>*{direction:rtl;min-width:0;position:relative;z-index:1}
.top{grid-area:top!important;position:relative!important;top:auto!important;margin:0!important;min-height:112px!important;padding:18px 22px!important;border-radius:24px!important;border:1px solid transparent!important;background:linear-gradient(#ffffffef,#ffffffef) padding-box,var(--aalam-grad) border-box!important;box-shadow:var(--aalam-glow)!important;overflow:visible!important;backdrop-filter:blur(16px)}
.top:before{content:"";position:absolute;right:0;top:0;width:200px;height:100%;border-radius:0 24px 24px 0;background:radial-gradient(circle at 92% 15%,rgba(249,11,241,.17),transparent 45%),linear-gradient(130deg,rgba(29,118,254,.09),transparent 72%);pointer-events:none}
.top:after{content:"";position:absolute;left:5%;right:40%;bottom:-1px;height:3px;border-radius:99px;background:var(--aalam-grad);box-shadow:0 0 16px rgba(164,49,246,.40)}
.top h1{color:var(--aalam-blue-deep)!important;font-size:26px!important;margin:0 0 3px!important;text-shadow:0 1px 0 #fff}
.top-eyebrow{color:var(--aalam-pink)!important;font-weight:900!important}.top-subtitle,.session-meta{color:var(--aalam-muted)!important}
.live-dot{background:var(--aalam-blue)!important;box-shadow:0 0 0 4px rgba(29,118,254,.12),0 0 16px rgba(249,11,241,.25)!important;animation:aalamPulse 2.6s ease-in-out infinite}
.top-tools{gap:9px!important}
.top-action{position:relative!important;overflow:hidden!important;border:1px solid #DCE6F8!important;background:#fff!important;color:var(--aalam-blue-deep)!important;box-shadow:0 8px 18px rgba(29,118,254,.07)!important}
.top-action:after,.primary:after{content:"";position:absolute;top:-25%;bottom:-25%;width:34%;left:-48%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.72),transparent);animation:aalamShine 5.2s ease-in-out infinite}
.top-action-primary{background:var(--aalam-grad)!important;color:#fff!important;border-color:transparent!important;box-shadow:0 11px 25px rgba(104,74,255,.22),0 0 18px rgba(249,11,241,.12)!important}
.top-action>span{background:linear-gradient(145deg,rgba(29,118,254,.10),rgba(249,11,241,.11))!important;color:var(--aalam-violet)!important}
.top-action-primary>span{background:rgba(255,255,255,.18)!important;color:#fff!important}
.role-badge{background:linear-gradient(120deg,rgba(29,118,254,.12),rgba(164,49,246,.10),rgba(249,11,241,.11))!important;color:var(--aalam-blue-deep)!important;border:1px solid rgba(91,156,254,.25)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.8)}
.top-menu{border:1px solid transparent!important;background:linear-gradient(#fffffffa,#fffffffa) padding-box,var(--aalam-grad) border-box!important;box-shadow:0 24px 60px rgba(77,64,190,.18)!important}
.top-menu a>span,.top-menu button>span{background:var(--aalam-grad-soft)!important;color:var(--aalam-violet)!important}
.staging-ribbon{grid-area:stage!important;margin:0!important;border-radius:13px!important;background:linear-gradient(90deg,#FFFDF3,#FFF7FE)!important;border:1px solid rgba(249,11,241,.16)!important;color:#75506E!important;box-shadow:0 5px 16px rgba(164,49,246,.05)!important}
.metrics{grid-area:metrics!important;display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:12px!important;margin:0!important}
.metric{min-height:96px!important;margin:0!important;border-radius:20px!important;border:1px solid transparent!important;background:linear-gradient(#fff,#fff) padding-box,linear-gradient(135deg,rgba(29,118,254,.24),rgba(249,11,241,.20)) border-box!important;box-shadow:0 10px 28px rgba(43,78,160,.07)!important;padding:15px 16px!important;overflow:hidden!important}
.metric:before{content:"";position:absolute;inset:auto -30px -40px auto;width:110px;height:110px;border-radius:50%;background:radial-gradient(circle,rgba(249,11,241,.10),transparent 68%)}
.metric:nth-child(odd):before{background:radial-gradient(circle,rgba(29,118,254,.12),transparent 68%)}
.metric b{color:var(--aalam-blue-deep)!important;font-size:27px!important}
.metric small{color:var(--aalam-muted)!important}
.metric-icon{background:var(--aalam-grad-soft)!important;color:var(--aalam-violet)!important;border:1px solid rgba(91,156,254,.18)!important;box-shadow:inset 0 1px 0 #fff}
#tabs.admin-groups{grid-area:sidebar!important;position:relative!important;inset:auto!important;width:auto!important;height:100%!important;max-height:none!important;margin:0!important;padding:15px 12px 17px!important;box-sizing:border-box!important;overflow-y:auto!important;overflow-x:hidden!important;border-radius:26px!important;background:radial-gradient(circle at 90% 0%,rgba(249,11,241,.36),transparent 25%),radial-gradient(circle at 8% 100%,rgba(29,118,254,.30),transparent 28%),linear-gradient(180deg,#113E95 0%,#182C74 48%,#241D63 100%)!important;box-shadow:0 22px 50px rgba(41,35,111,.25),inset 0 1px 0 rgba(255,255,255,.09)!important;border:1px solid rgba(255,255,255,.12)!important}
#tabs.admin-groups:before{content:"";position:absolute;inset:0;border-radius:26px;pointer-events:none;background:linear-gradient(135deg,rgba(255,255,255,.04),transparent 35%,rgba(249,11,241,.05) 75%,rgba(100,216,255,.04))}
.sidebar-brand{margin:0 0 10px!important;padding:5px 5px 15px!important;border-bottom:1px solid rgba(255,255,255,.14)!important}
.sidebar-brand img{width:94px!important;height:82px!important;object-fit:contain!important;border-radius:17px!important;padding:5px!important;background:#fff!important;box-shadow:0 10px 26px rgba(0,0,0,.20),0 0 20px rgba(249,11,241,.14)!important}
.sidebar-brand strong{font-size:15px!important;color:#fff!important}.sidebar-brand small{font-size:9.5px!important;color:rgba(255,255,255,.74)!important}
.sidebar-kicker{color:rgba(255,255,255,.52)!important}
.admin-group{background:rgba(255,255,255,.035)!important;border:1px solid rgba(255,255,255,.05)!important;border-radius:14px!important;overflow:hidden!important}
.admin-group.open{background:linear-gradient(135deg,rgba(29,118,254,.10),rgba(249,11,241,.08))!important;border-color:rgba(255,255,255,.11)!important}
.admin-group-head{transition:.2s ease!important}.admin-group-head:hover{background:rgba(255,255,255,.07)!important}
.admin-group-head:after{color:rgba(255,255,255,.62)!important}
.admin-group-title{color:#fff!important}.admin-group-desc{color:rgba(255,255,255,.48)!important}
.group-tabs .tab,#tabs a.tab{position:relative!important;color:rgba(255,255,255,.78)!important;border-radius:10px!important;overflow:hidden!important}
.group-tabs .tab:hover,#tabs a.tab:hover{background:rgba(255,255,255,.09)!important;color:#fff!important}
.group-tabs .tab.active,#tabs a.tab.active{background:var(--aalam-grad)!important;color:#fff!important;border-color:rgba(255,255,255,.18)!important;box-shadow:0 9px 22px rgba(99,65,255,.28),0 0 16px rgba(249,11,241,.14)!important}
.group-tabs .tab.active:after,#tabs a.tab.active:after{content:"";position:absolute;top:-20%;bottom:-20%;width:35%;left:-40%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.32),transparent);animation:aalamShine 5.7s ease-in-out infinite}
#tabs .nav-icon{background:rgba(255,255,255,.11)!important;color:#fff!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.08)!important}
#tabs .tab.active .nav-icon{background:rgba(255,255,255,.20)!important}
section.card{grid-area:content!important;min-height:0!important;height:100%!important;margin:0!important;padding:20px 21px 24px!important;overflow:auto!important;overscroll-behavior:contain!important;border-radius:24px!important;border:1px solid transparent!important;background:linear-gradient(rgba(255,255,255,.98),rgba(255,255,255,.98)) padding-box,linear-gradient(140deg,rgba(29,118,254,.20),rgba(164,49,246,.14),rgba(249,11,241,.18)) border-box!important;box-shadow:0 12px 34px rgba(58,68,151,.09)!important;scrollbar-width:thin;scrollbar-color:#BFCBF0 transparent}
section.card::-webkit-scrollbar{width:7px}section.card::-webkit-scrollbar-thumb{background:linear-gradient(var(--aalam-blue),var(--aalam-pink));border-radius:8px}
section.card h2{color:var(--aalam-blue-deep)!important;font-weight:900!important}
section.card>.toolbar:first-child{position:sticky!important;top:-20px!important;z-index:6!important;margin:-20px -21px 16px!important;padding:17px 21px 14px!important;background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(255,255,255,.94))!important;backdrop-filter:blur(13px)!important;border-bottom:1px solid rgba(91,156,254,.13)!important}
.primary{position:relative!important;overflow:hidden!important;background:var(--aalam-grad)!important;color:#fff!important;border-color:transparent!important;box-shadow:0 10px 24px rgba(99,65,255,.20),0 0 13px rgba(249,11,241,.10)!important}
.primary:hover{transform:translateY(-1px)!important;filter:saturate(1.07)!important}
.secondary{background:linear-gradient(135deg,#EEF5FF,#FFF1FD)!important;color:var(--aalam-blue-deep)!important;border-color:#D7E5FA!important}
button,.btn,.tab,input,select,textarea{transition:.18s ease}
input,select,textarea{background:#FBFCFF!important;border:1px solid #D9E4F3!important;color:var(--aalam-ink)!important}
input:focus,select:focus,textarea:focus{border-color:#8F7CF7!important;box-shadow:0 0 0 3px rgba(164,49,246,.10),0 0 13px rgba(29,118,254,.07)!important;background:#fff!important}
th{background:linear-gradient(180deg,#F7F9FF,#F2F6FF)!important;color:#536985!important;border-bottom:1px solid #E4EAF6!important}
tr:hover td{background:linear-gradient(90deg,rgba(29,118,254,.025),rgba(249,11,241,.022))!important}
.notice{background:linear-gradient(90deg,#FFFDF1,#FFF7FD)!important;border-color:rgba(249,11,241,.14)!important;color:#73516C!important}
.ok{background:linear-gradient(90deg,#F1FFF8,#F1FBFF)!important}.error{background:linear-gradient(90deg,#FFF2F5,#FFF3FC)!important}
.login-overlay{background:radial-gradient(circle at 80% 12%,rgba(249,11,241,.19),transparent 26%),radial-gradient(circle at 14% 85%,rgba(29,118,254,.20),transparent 32%),radial-gradient(circle at 48% 50%,rgba(164,49,246,.08),transparent 30%),linear-gradient(135deg,#F6F9FF,#FFF7FE)!important;overflow:hidden!important}
.login-overlay:before,.login-overlay:after{content:"";position:absolute;pointer-events:none;border-radius:48% 52% 46% 54%;filter:blur(3px);opacity:.65;animation:aalamWave 13s ease-in-out infinite}
.login-overlay:before{width:640px;height:210px;left:-100px;top:-135px;background:linear-gradient(115deg,rgba(29,118,254,.32),rgba(164,49,246,.20),rgba(249,11,241,.28))}
.login-overlay:after{width:520px;height:180px;right:-70px;bottom:-120px;background:linear-gradient(115deg,rgba(249,11,241,.25),rgba(164,49,246,.18),rgba(100,216,255,.20));animation-delay:-5s}
.login{position:relative!important;z-index:2!important;max-width:500px!important;border-radius:30px!important;border:1px solid transparent!important;background:linear-gradient(rgba(255,255,255,.96),rgba(255,255,255,.96)) padding-box,var(--aalam-grad) border-box!important;box-shadow:0 35px 90px rgba(67,54,171,.19),0 0 36px rgba(249,11,241,.10)!important;backdrop-filter:blur(18px)!important;padding:27px!important;overflow:hidden!important}
.login:before{content:"";position:absolute;inset:auto -80px -80px auto;width:220px;height:220px;border-radius:50%;background:radial-gradient(circle,rgba(249,11,241,.10),transparent 68%);pointer-events:none}
.login-brand{position:relative!important;align-items:center!important;padding-bottom:18px!important;border-bottom:0!important}
.login-brand:after{content:"";position:absolute;right:8%;left:8%;bottom:0;height:3px;border-radius:99px;background:var(--aalam-grad);box-shadow:0 0 15px rgba(164,49,246,.34)}
.login-brand img{width:138px!important;height:112px!important;object-fit:contain!important;border-radius:18px!important;padding:5px!important;background:#fff!important;box-shadow:0 12px 30px rgba(57,74,158,.12),0 0 18px rgba(249,11,241,.09)!important}
.login-brand h2{color:var(--aalam-blue-deep)!important;font-size:22px!important;margin-top:10px!important}
.login-brand p,.login .small,.login-security span{color:var(--aalam-muted)!important}
.login-security span{background:linear-gradient(135deg,#F3F8FF,#FFF2FE)!important;border-color:#E1E8F5!important}
.forgot-link{color:var(--aalam-pink)!important;font-weight:800!important}
.login .primary{min-height:50px!important;font-size:15px!important}
.auth-gate{border:1px solid transparent!important;background:linear-gradient(#fff,#fff) padding-box,var(--aalam-grad) border-box!important;box-shadow:var(--aalam-glow)!important}
.spinner{border-color:rgba(29,118,254,.16)!important;border-top-color:var(--aalam-pink)!important}
.aalam-icon{width:22px;height:22px;display:inline-flex;align-items:center;justify-content:center;flex:0 0 22px}
.aalam-icon svg{width:100%;height:100%;display:block}
@media(max-width:1180px){.wrap{grid-template-columns:minmax(0,1fr) 270px!important;padding:10px!important;gap:9px!important}.top{padding:15px 17px!important;min-height:104px!important}.top h1{font-size:23px!important}.metrics{gap:9px!important}#tabs.admin-groups{padding:12px 10px 14px!important}}
@media(max-width:900px){html,body{height:auto}body{overflow:auto!important}.wrap{direction:rtl!important;height:auto!important;min-height:100vh!important;overflow:visible!important;display:flex!important;flex-direction:column!important;padding:10px!important;gap:10px!important}.wrap:before,.wrap:after{display:none}.top{order:1!important;position:relative!important}.staging-ribbon{order:2!important}.metrics{order:3!important;grid-template-columns:1fr 1fr!important}#tabs.admin-groups{order:4!important;position:relative!important;width:100%!important;height:auto!important;max-height:none!important;overflow:visible!important}section.card{order:5!important;height:auto!important;min-height:420px!important;overflow:visible!important}.top-tools{width:100%!important;justify-content:flex-start!important;flex-wrap:wrap!important}.top-menu{right:0!important;left:auto!important}.sidebar-brand img{width:112px!important;height:84px!important}}
@media(max-width:600px){.metrics{grid-template-columns:1fr!important}.top-tools{display:grid!important;grid-template-columns:1fr 1fr 1fr!important;width:100%!important}.top-action{min-width:0!important;padding-inline:8px!important}.top-action b{font-size:10px!important}.top-action>span{display:none!important}section.card{padding:16px 13px 20px!important}.login{margin:10px!important;padding:21px!important}.login-brand img{width:122px!important;height:98px!important}}
@media(prefers-reduced-motion:reduce){.wrap:before,.wrap:after,.login-overlay:before,.login-overlay:after,.top-action:after,.primary:after,.group-tabs .tab.active:after{animation:none!important}}
