:root{--bg:#F4F7FB;--surface:#fff;--surface-2:#F8FAFD;--text:#15203B;--muted:#718096;--line:#E5EAF2;--primary:#155EEF;--primary2:#0D47C7;--accent:#0EA5A8;--success:#0E9F6E;--danger:#D92D4A;--warning:#D97706;--info:#386789;--sidebar:#0B1638;--sidebar2:#101F4C;--shadow:0 12px 35px rgba(21,38,78,.08);--shadow-lg:0 30px 90px rgba(11,22,56,.18);--radius:18px;--radius-sm:12px}*{box-sizing:border-box}html{font-family:Tahoma,Arial,sans-serif;background:var(--bg);color:var(--text)}body{margin:0;background:var(--bg);min-height:100vh}a{color:var(--primary);text-decoration:none}button,input,select,textarea{font:inherit}button{cursor:pointer}.app-shell{display:grid;grid-template-columns:270px minmax(0,1fr);min-height:100vh}.sidebar{background:var(--sidebar);color:#eaf0ff;padding:22px 16px;position:fixed;right:0;top:0;bottom:0;width:270px;display:flex;flex-direction:column;z-index:50}.brand{display:flex;gap:12px;align-items:center;padding:4px 8px 24px;border-bottom:1px solid rgba(255,255,255,.08)}.brand-mark{width:42px;height:42px;border-radius:14px;background:linear-gradient(145deg,#5571ff,#2447d8);display:grid;place-items:center;color:#fff;font-weight:800;font-size:22px;box-shadow:0 8px 22px rgba(56,82,224,.3)}.brand strong,.brand small{display:block}.brand small{color:#8590aa;font-size:11px;margin-top:4px}.sidebar nav{display:flex;flex-direction:column;gap:5px;margin-top:22px;overflow:auto}.sidebar nav a{color:#aeb8ce;padding:12px 14px;border-radius:12px;display:flex;gap:12px;align-items:center;transition:.18s}.sidebar nav a:hover{color:#fff;background:rgba(255,255,255,.07)}.counter{margin-right:auto;background:#eb4960;color:#fff;border-radius:999px;padding:1px 7px;font-size:11px}.sidebar-user{margin-top:auto;border-top:1px solid rgba(255,255,255,.08);padding:18px 8px 0;display:flex;gap:10px;align-items:center}.sidebar-user strong,.sidebar-user small{display:block}.sidebar-user small{color:#8490aa;margin-top:3px}.avatar{width:36px;height:36px;border-radius:50%;background:#dfe6ff;color:var(--primary);display:grid;place-items:center;font-weight:800}.avatar.large{width:48px;height:48px}.main-wrap{grid-column:2;min-width:0}.topbar{height:82px;background:rgba(255,255,255,.92);backdrop-filter:blur(10px);border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 30px;position:sticky;top:0;z-index:30}.topbar h1{font-size:21px;margin:0}.topbar p{color:var(--muted);font-size:12px;margin:4px 0 0}.top-actions{display:flex;align-items:center;gap:10px}.top-actions form{margin:0}.icon-btn{border:1px solid var(--line);background:#fff;border-radius:12px;min-width:42px;height:42px;display:grid;place-items:center;color:var(--text);position:relative}.icon-btn span{position:absolute;top:-6px;left:-5px;background:var(--danger);color:#fff;font-size:10px;border-radius:99px;padding:2px 5px}.content{padding:28px 30px 50px;max-width:1600px;margin:auto}.section-head,.panel-head{display:flex;align-items:center;justify-content:space-between;gap:15px;margin:2px 0 16px}.section-head h2,.panel-head h2,.panel h2{margin:0;font-size:18px}.section-head p,.panel-head p{color:var(--muted);margin:5px 0 0;font-size:13px}.actions,.quick-actions{display:flex;gap:10px;flex-wrap:wrap}.btn{border:0;border-radius:11px;padding:10px 15px;font-weight:700;display:inline-flex;justify-content:center;align-items:center;gap:7px}.btn-primary{background:var(--primary);color:#fff}.btn-primary:hover{background:var(--primary2)}.btn-success{background:var(--success);color:#fff}.btn-danger{background:var(--danger);color:#fff}.btn-ghost{background:#fff;color:var(--text);border:1px solid var(--line)}.btn-lg{padding:13px 18px}.full-btn{width:100%}.kpi-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:22px}.kpi{background:var(--surface);border:1px solid var(--line);box-shadow:var(--shadow);border-radius:var(--radius);padding:18px;min-height:116px}.kpi span{font-size:13px;color:var(--muted);display:block}.kpi strong{font-size:27px;display:block;margin:10px 0 4px}.kpi strong.small{font-size:15px}.kpi small{color:var(--muted)}.kpi.danger{border-top:3px solid var(--danger)}.kpi.warning{border-top:3px solid var(--warning)}.kpi.success{border-top:3px solid var(--success)}.financial .kpi{min-height:105px}.panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:20px;box-shadow:var(--shadow);margin-bottom:20px}.two-col{display:grid;grid-template-columns:1fr 1fr;gap:20px}.list{display:flex;flex-direction:column}.list-row{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:13px 0;border-bottom:1px solid var(--line);color:var(--text)}.list-row:last-child{border-bottom:0}.list-row strong,.list-row small{display:block}.list-row small{color:var(--muted);margin-top:4px}.row-end{text-align:left}.badge{display:inline-flex;align-items:center;justify-content:center;padding:5px 9px;border-radius:999px;font-size:11px;font-weight:800;background:#eef1f8;color:#4d5871;white-space:nowrap}.badge.success{background:#e8f6f0;color:#0e7754}.badge.danger{background:#feecee;color:#ae3042}.badge.warning{background:#fff4df;color:#986018}.badge.info{background:#edf3f8;color:#315b79}.task-priority-list,.task-cards{display:flex;flex-direction:column;gap:10px}.task-priority,.task-card{display:flex;align-items:center;gap:14px;border:1px solid var(--line);border-radius:14px;padding:14px;color:var(--text);background:#fff}.task-card{display:block}.task-priority:hover,.task-card:hover{border-color:#c8d1ec;box-shadow:0 8px 20px rgba(43,58,100,.06)}.rank{width:40px;height:40px;background:#eef1ff;color:var(--primary);border-radius:12px;display:grid;place-items:center;font-weight:800}.grow{flex:1;min-width:0}.task-priority strong,.task-priority small,.task-card strong,.task-card small{display:block}.task-priority small,.task-card small{color:var(--muted);margin-top:4px}.task-card-top,.task-meta{display:flex;justify-content:space-between;gap:12px;align-items:center}.task-meta{justify-content:flex-start;flex-wrap:wrap;margin-top:12px;color:var(--muted);font-size:12px}.filter-bar{display:flex;gap:9px;flex-wrap:wrap;background:#fff;padding:12px;border:1px solid var(--line);border-radius:14px;margin-bottom:16px}.filter-bar input,.filter-bar select{min-width:150px;flex:1}.table-panel{padding:0;overflow:hidden}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;min-width:760px}th,td{text-align:right;padding:14px 16px;border-bottom:1px solid var(--line);font-size:13px;vertical-align:middle}th{background:#f8f9fc;color:#69748a;font-size:12px;position:sticky;top:0}td strong,td small{display:block}td small{color:var(--muted);margin-top:4px}.table-link{font-weight:700;margin-left:8px}.text-danger,.field-error{color:var(--danger)!important}.form-panel{max-width:1100px}.form-panel.narrow,.narrow{max-width:650px;margin-left:auto;margin-right:auto}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.form-grid.compact{gap:12px}.stack{display:flex;flex-direction:column;gap:14px}label{display:flex;flex-direction:column;gap:7px;font-weight:700;font-size:13px}label small{font-weight:400;color:var(--muted)}input,select,textarea{border:1px solid #dce2ec;background:#fff;border-radius:10px;padding:11px 12px;outline:none;color:var(--text);width:100%}input:focus,select:focus,textarea:focus{border-color:#8799e6;box-shadow:0 0 0 3px rgba(36,71,216,.08)}textarea{resize:vertical}.full{grid-column:1/-1}.form-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:5px}.details{display:grid;grid-template-columns:1fr 1fr;gap:15px;margin:15px 0 0}.details div{border-bottom:1px solid var(--line);padding-bottom:12px}.details dt{font-size:11px;color:var(--muted);margin-bottom:5px}.details dd{margin:0;line-height:1.7}.file-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:15px}.file-card{border:1px solid var(--line);border-radius:13px;padding:13px;display:flex;flex-direction:column;gap:10px}.file-card strong,.file-card small{display:block;word-break:break-word}.file-card small{color:var(--muted);margin-top:4px}.file-actions{display:flex;gap:10px;flex-wrap:wrap;font-size:12px}.file-list{margin-top:15px}.file-list>div{display:flex;justify-content:space-between;border-top:1px solid var(--line);padding:10px 0}.inline-upload{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.inline-upload select,.inline-upload input[type=file]{width:auto;flex:1}.workflow-actions{display:flex;flex-direction:column;gap:12px}.workflow-actions form{margin:0}.task-status-strip{display:flex;flex-wrap:wrap;gap:10px;align-items:center;background:#fff;border:1px solid var(--line);padding:12px 16px;border-radius:14px;margin-bottom:20px;font-size:13px}.timeline{margin-top:16px}.timeline-item{display:grid;grid-template-columns:14px 1fr;gap:12px;padding-bottom:18px;position:relative}.timeline-item>span{width:10px;height:10px;background:var(--primary);border-radius:50%;margin-top:5px;position:relative}.timeline-item>span:after{content:"";position:absolute;width:2px;background:var(--line);right:4px;top:12px;height:calc(100% + 9px)}.timeline-item:last-child>span:after{display:none}.timeline-item strong,.timeline-item small{display:block}.timeline-item small{color:var(--muted);margin-top:4px}.timeline-item p{margin:6px 0 0}.employee-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}.employee-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:17px;box-shadow:var(--shadow)}.employee-head{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center}.employee-head strong,.employee-head small{display:block}.employee-head small{color:var(--muted);margin-top:4px}.mini-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:16px 0}.mini-kpis div{background:#f7f8fb;border-radius:10px;padding:9px;text-align:center}.mini-kpis span,.mini-kpis b{display:block;font-size:11px}.mini-kpis b{font-size:13px;margin-top:4px}.notification-list{display:flex;flex-direction:column}.notification{display:flex;align-items:center;gap:12px;padding:14px;border-bottom:1px solid var(--line)}.notification.unread{background:#f7f8ff}.notification-dot{width:8px;height:8px;background:#c8d0df;border-radius:50%}.notification.unread .notification-dot{background:var(--primary)}.notification p{margin:5px 0;color:#4c5870}.notification small{color:var(--muted)}.pagination{display:flex;gap:5px;margin-top:15px}.pagination a{padding:7px 10px;background:#fff;border:1px solid var(--line);border-radius:8px}.pagination a.active{background:var(--primary);color:#fff}.alert{padding:12px 14px;border-radius:12px;margin-bottom:15px}.alert.success{background:#e9f7f1;color:#126d50}.alert.danger{background:#feecee;color:#9e3040}.empty,.empty-state{text-align:center;padding:35px;color:var(--muted)}.empty-state{background:#fff;border-radius:20px;margin:80px auto;max-width:600px}.big-code{font-size:80px;font-weight:900;color:#d9dfeb}.muted{color:var(--muted)}code{background:#f0f2f7;padding:3px 6px;border-radius:6px}.link-btn{border:0;background:transparent;color:var(--primary);padding:0;font-size:12px}.hidden{display:none!important}dialog{border:0;border-radius:18px;padding:0;box-shadow:0 24px 80px rgba(11,20,50,.22);width:min(560px,calc(100% - 24px))}dialog::backdrop{background:rgba(11,18,34,.55)}.dialog-card{padding:20px;display:flex;flex-direction:column;gap:12px}.dialog-head{display:flex;justify-content:space-between;align-items:center}.dialog-head h2{margin:0}.dialog-head button{border:0;background:#f2f3f7;border-radius:50%;width:34px;height:34px;font-size:20px}.guest-body{background:linear-gradient(140deg,#eef2ff,#f8f9fc)}.guest-shell{min-height:100vh;display:grid;place-items:center;padding:20px}.auth-card{width:min(430px,100%);background:#fff;border:1px solid var(--line);border-radius:24px;padding:30px;box-shadow:0 25px 70px rgba(28,40,83,.12)}.auth-brand{text-align:center;margin-bottom:24px}.auth-brand .brand-mark{margin:auto}.auth-brand h1{font-size:23px;margin:15px 0 7px}.auth-brand p{color:var(--muted);font-size:13px;line-height:1.7}.auth-card>small{display:block;text-align:center;color:var(--muted);margin-top:16px}.mobile-only{display:none}.quick-actions{margin-top:20px}
@media(max-width:1100px){.kpi-grid{grid-template-columns:repeat(2,1fr)}.two-col{grid-template-columns:1fr}.employee-grid{grid-template-columns:repeat(2,1fr)}.file-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:800px){.app-shell{display:block}.sidebar{transform:translateX(110%);transition:.2s}.sidebar.open{transform:translateX(0)}.main-wrap{width:100%}.mobile-only{display:grid}.topbar{padding:0 14px;height:72px}.topbar p{display:none}.content{padding:18px 12px 40px}.kpi-grid{grid-template-columns:1fr 1fr}.form-grid,.details{grid-template-columns:1fr}.full{grid-column:1}.employee-grid,.file-grid{grid-template-columns:1fr}.filter-bar{display:grid;grid-template-columns:1fr 1fr}.filter-bar input,.filter-bar select{min-width:0}.task-priority{align-items:flex-start;flex-wrap:wrap}.task-priority .grow{min-width:60%}.top-actions .btn-ghost{font-size:0;padding:10px}.top-actions .btn-ghost:after{content:'↪';font-size:18px}.section-head{align-items:flex-start}.section-head .actions{justify-content:flex-end}.inline-upload{align-items:stretch}.inline-upload select,.inline-upload input[type=file]{width:100%;flex-basis:100%}}
@media(max-width:520px){.kpi-grid{grid-template-columns:1fr}.filter-bar{grid-template-columns:1fr}.topbar h1{font-size:17px}.content{padding:14px 9px 35px}.panel{padding:15px}.section-head{flex-direction:column}.section-head>.btn,.section-head>.actions{width:100%}.section-head>.btn{justify-content:center}.actions .btn{flex:1}.task-card-top{align-items:flex-start}.employee-grid{grid-template-columns:1fr}}

.inline-form{display:inline}.select-search{margin-bottom:5px}


/* ===== Visual Identity V2 ===== */
body{background:radial-gradient(circle at 15% 0%,rgba(21,94,239,.05),transparent 28%),var(--bg)}
.app-shell{grid-template-columns:288px minmax(0,1fr)}.sidebar{width:288px;padding:20px 15px;background:linear-gradient(180deg,var(--sidebar) 0%,#091229 100%);box-shadow:-12px 0 40px rgba(8,20,54,.12)}.main-wrap{grid-column:2}
.brand{padding:2px 7px 20px;gap:11px}.brand-mark-img{width:46px;height:46px;filter:drop-shadow(0 8px 18px rgba(14,165,168,.18))}.brand strong{font-size:15px;line-height:1.5}.brand small{color:#7F91BC;font-size:10px;letter-spacing:.2px}.nav-label{color:#6174A4;font-size:10px;font-weight:800;padding:14px 14px 5px}.sidebar nav{gap:3px;margin-top:8px}.sidebar nav a{padding:11px 12px;color:#AAB8D8;border:1px solid transparent}.sidebar nav a i{width:25px;height:25px;border-radius:8px;background:rgba(255,255,255,.055);display:grid;place-items:center;font-style:normal;color:#C8D5F0}.sidebar nav a:hover{background:rgba(255,255,255,.065);border-color:rgba(255,255,255,.055)}.sidebar nav a.active{background:linear-gradient(100deg,rgba(21,94,239,.30),rgba(14,165,168,.12));color:#fff;border-color:rgba(93,145,255,.24);box-shadow:inset -3px 0 0 #4D8DFF}.sidebar nav a.active i{background:#1D63E9;color:#fff}.sidebar-user{padding:14px 8px 0}.sidebar-logout{border:0;background:rgba(255,255,255,.07);color:#AFC1E6;border-radius:9px;width:34px;height:34px;cursor:pointer}.sidebar-logout:hover{background:rgba(217,45,74,.2);color:#fff}
.topbar{height:76px;padding:0 30px;background:rgba(255,255,255,.86);box-shadow:0 4px 25px rgba(24,40,78,.03)}.topbar-start{display:flex;align-items:center;gap:12px}.topbar h1{font-size:19px}.profile-chip{display:flex;align-items:center;gap:9px;background:#fff;border:1px solid var(--line);border-radius:14px;padding:6px 9px 6px 12px;color:var(--text)}.profile-chip b,.profile-chip small{display:block}.profile-chip b{font-size:12px}.profile-chip small{font-size:10px;color:var(--muted);margin-top:2px}.avatar{background:linear-gradient(135deg,#E6EEFF,#E5FAF7);color:#1458D8}
.content{padding:26px 30px 54px}.eyebrow{display:inline-flex;color:var(--primary);font-size:11px;font-weight:900;letter-spacing:.25px;margin-bottom:6px}.eyebrow.light{color:#9EC3FF}.page-intro{display:flex;justify-content:space-between;gap:20px;align-items:center;margin-bottom:18px}.page-intro h2{margin:0;font-size:25px;letter-spacing:-.3px}.page-intro p{margin:7px 0 0;color:var(--muted);font-size:13px}.info-pill{background:#EEF4FF;color:#2154B9;border:1px solid #DCE8FF;padding:9px 12px;border-radius:999px;font-size:11px;font-weight:800}
.dashboard-hero{background:linear-gradient(115deg,#103C9E 0%,#155EEF 55%,#0EA5A8 135%);color:#fff;border-radius:24px;padding:25px 28px;margin-bottom:20px;display:flex;justify-content:space-between;align-items:center;gap:18px;box-shadow:0 18px 45px rgba(21,94,239,.18);overflow:hidden;position:relative}.dashboard-hero:after{content:"";position:absolute;width:240px;height:240px;border:50px solid rgba(255,255,255,.06);border-radius:50%;left:-70px;top:-100px}.dashboard-hero h2{font-size:28px;margin:0 0 7px}.dashboard-hero p{margin:0;color:#DDE8FF}.hero-actions{display:flex;gap:9px;z-index:2}.btn-light{background:#fff;color:#164EBE}.btn-glass{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.26);color:#fff}.kpi{position:relative;overflow:hidden}.kpi-icon{padding-right:64px}.kpi-icon i{position:absolute;right:16px;top:17px;width:36px;height:36px;border-radius:11px;background:#EEF4FF;color:var(--primary);display:grid;place-items:center;font-style:normal;font-weight:900}.kpi strong{letter-spacing:-.3px}.panel{border-color:#E7EBF3;box-shadow:0 8px 26px rgba(27,45,88,.055)}
.currency-summary{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:22px}.currency-summary.mini{margin-bottom:20px}.currency-card{background:#fff;border:1px solid var(--line);border-radius:20px;padding:17px;display:grid;grid-template-columns:auto minmax(130px,1.2fr) repeat(6,minmax(100px,1fr));gap:12px;align-items:center;box-shadow:var(--shadow)}.currency-summary.mini .currency-card{grid-template-columns:auto minmax(120px,1.2fr) repeat(3,1fr)}.currency-flag{font-size:26px}.currency-title strong,.currency-title span,.currency-card small,.currency-card b{display:block}.currency-title span,.currency-card small{color:var(--muted);font-size:10px}.currency-card b{font-size:13px;margin-top:4px}.text-success{color:var(--success)!important}.text-danger{color:var(--danger)!important}
.academic-kpis{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin-bottom:18px}.academic-kpis.compact{grid-template-columns:repeat(3,1fr);margin:0}.academic-kpis>div{background:#fff;border:1px solid var(--line);border-radius:15px;padding:14px;text-align:center}.academic-kpis b{display:block;font-size:24px;color:var(--primary)}.academic-kpis span{font-size:11px;color:var(--muted)}.academic-forms{align-items:start}.entity-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.entity-card{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;border:1px solid var(--line);border-radius:14px;padding:11px}.entity-icon{width:36px;height:36px;border-radius:10px;background:#EEF4FF;display:grid;place-items:center}.entity-card strong,.entity-card small{display:block}.entity-card small{font-size:10px;color:var(--muted);margin-top:3px}.table-search{max-width:240px}.currency-support{display:grid;grid-template-columns:1fr 1fr;gap:10px}.currency-support>div{border:1px solid var(--line);border-radius:14px;padding:14px;display:grid;grid-template-columns:auto 1fr auto;gap:8px}.currency-support span{color:var(--muted)}
/* Authentication */
.guest-body{background:#F3F6FB}.guest-shell{min-height:100vh;padding:0;display:block}.auth-layout{min-height:100vh;display:grid;grid-template-columns:minmax(420px,1.08fr) minmax(400px,.92fr)}.auth-showcase{background:linear-gradient(145deg,#091A48 0%,#103C9E 58%,#0A8D91 130%);padding:46px clamp(34px,6vw,90px);color:#fff;display:flex;flex-direction:column;justify-content:space-between;position:relative;overflow:hidden}.auth-showcase:before,.auth-showcase:after{content:"";position:absolute;border-radius:50%;border:70px solid rgba(255,255,255,.045)}.auth-showcase:before{width:420px;height:420px;left:-180px;top:-220px}.auth-showcase:after{width:280px;height:280px;right:-160px;bottom:-150px}.auth-logo{display:flex;align-items:center;gap:12px;z-index:2}.auth-logo img{width:52px;height:52px}.auth-logo b,.auth-logo span{display:block}.auth-logo span{font-size:10px;color:#AFC7EE;margin-top:3px}.auth-copy{z-index:2;max-width:680px}.auth-copy h1{font-size:clamp(32px,4.2vw,56px);line-height:1.27;margin:7px 0 16px;letter-spacing:-1px}.auth-copy p{font-size:15px;line-height:2;color:#D9E6FF;max-width:620px}.auth-features{display:flex;gap:8px;flex-wrap:wrap;z-index:2}.auth-features span{font-size:11px;background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.14);padding:8px 10px;border-radius:999px}.auth-card{width:auto;max-width:460px;margin:auto;padding:34px;box-shadow:none;border:0;background:transparent}.auth-card-head{text-align:right;margin-bottom:26px}.auth-card-head img{width:54px;height:54px;margin-bottom:22px;display:none}.auth-card-head h2{font-size:30px;margin:2px 0 7px}.auth-card-head p{color:var(--muted);margin:0}.auth-card>small{color:var(--muted);margin-top:14px}
/* Browser setup */
.setup-shell{min-height:100vh;display:grid;grid-template-columns:380px 1fr;background:#F5F7FB}.setup-hero{background:linear-gradient(150deg,#091A48,#155EEF 75%,#0EA5A8 135%);color:#fff;padding:48px 34px;display:flex;flex-direction:column;justify-content:center;position:relative;overflow:hidden}.setup-hero:after{content:"";position:absolute;width:350px;height:350px;border:55px solid rgba(255,255,255,.05);border-radius:50%;bottom:-180px;right:-180px}.setup-logo{width:72px;height:72px;margin-bottom:32px}.setup-hero h1{font-size:34px;line-height:1.4;margin:5px 0 10px}.setup-hero p{color:#D7E5FF;line-height:1.9}.setup-steps{margin-top:35px;display:flex;flex-direction:column;gap:9px}.setup-steps span{border-right:3px solid rgba(255,255,255,.13);padding:9px 12px;color:#95ADD8;font-size:12px}.setup-steps span.active{border-color:#6FE4D9;color:#fff}.setup-card{padding:42px clamp(25px,5vw,70px);max-width:980px;width:100%;margin:auto}.setup-card h2{margin:22px 0 12px}.requirement-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.requirement{display:flex;gap:9px;align-items:center;padding:11px;border-radius:12px;background:#fff;border:1px solid var(--line)}.requirement b{width:24px;height:24px;border-radius:50%;display:grid;place-items:center}.requirement.ok b{background:#E8F8F2;color:var(--success)}.requirement.bad b{background:#FEEBED;color:var(--danger)}.setup-form{background:#fff;border:1px solid var(--line);border-radius:20px;padding:20px;box-shadow:var(--shadow)}.setup-ready{display:flex;align-items:center;gap:14px;background:#ECFDF7;border:1px solid #CFF4E4;padding:16px;border-radius:16px}.ready-icon{width:44px;height:44px;border-radius:50%;background:var(--success);color:#fff;display:grid;place-items:center;font-size:22px}.setup-ready h2{margin:0}.setup-ready p{margin:5px 0 0;color:#527068}.setup-choice{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:16px}.choice-card{width:100%;height:100%;text-align:right;border:1px solid var(--line);border-radius:16px;padding:18px;background:#fff;display:flex;flex-direction:column;gap:6px;cursor:pointer;color:var(--text)}.choice-card.recommended{border-color:#AFC8FF;box-shadow:0 10px 30px rgba(21,94,239,.08)}.choice-card b{font-size:15px}.choice-card span{color:var(--muted);line-height:1.7}.choice-card em{font-style:normal;color:var(--primary);font-size:10px;font-weight:800}
@media(max-width:1200px){.currency-card{grid-template-columns:auto 1fr repeat(3,1fr)}.currency-card>div:nth-child(n+6){display:none}.entity-grid{grid-template-columns:1fr 1fr}}
@media(max-width:900px){.auth-layout{grid-template-columns:1fr}.auth-showcase{display:none}.auth-card{background:#fff;border:1px solid var(--line);border-radius:22px;box-shadow:var(--shadow-lg);margin:40px auto}.auth-card-head img{display:block}.setup-shell{grid-template-columns:1fr}.setup-hero{min-height:auto;padding:28px}.setup-steps{display:none}.setup-logo{width:55px;height:55px;margin-bottom:12px}.setup-hero h1{font-size:24px}.currency-summary{grid-template-columns:1fr}.academic-kpis{grid-template-columns:repeat(3,1fr)}}
@media(max-width:800px){.app-shell{display:block}.sidebar{width:288px}.main-wrap{width:100%}.profile-chip div:not(.avatar){display:none}.page-intro{align-items:flex-start;flex-direction:column}.currency-card,.currency-summary.mini .currency-card{grid-template-columns:auto 1fr 1fr}.currency-card>div:nth-child(n+4){display:none}.entity-grid{grid-template-columns:1fr}.setup-card{padding:25px 14px}.requirement-grid,.setup-choice{grid-template-columns:1fr}}
.danger-option{display:flex!important;flex-direction:row!important;align-items:flex-start;gap:10px;background:#FFF7F7;border:1px solid #FBD4D9;padding:12px;border-radius:12px}.danger-option input{width:auto;margin-top:4px}.danger-option span,.danger-option small{display:block}.danger-option small{color:#A05763;margin-top:3px}

/* ========================================================================
   Production UX V3 — responsive system + modal-first create/edit experience
   ======================================================================== */
:root{--content-max:1640px;--tap:44px;--ease:cubic-bezier(.2,.8,.2,1)}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;text-rendering:optimizeLegibility}
body{overflow-x:hidden}
img,svg{max-width:100%}
button,.btn,a,input,select,textarea{-webkit-tap-highlight-color:transparent}
button,.btn,.icon-btn,.profile-chip{min-height:var(--tap)}
.content{width:100%;max-width:var(--content-max)}
.panel,.kpi,.employee-card,.task-card,.currency-card{transition:transform .18s var(--ease),box-shadow .18s var(--ease),border-color .18s var(--ease)}
@media (hover:hover){.kpi:hover,.employee-card:hover{transform:translateY(-2px);box-shadow:0 14px 36px rgba(27,45,88,.09)}}

/* Overlay used by the tablet/mobile off-canvas navigation */
.sidebar-overlay{position:fixed;inset:0;background:rgba(4,11,31,.48);backdrop-filter:blur(2px);opacity:0;visibility:hidden;transition:.2s;z-index:45}
.sidebar-overlay.open{opacity:1;visibility:visible}
body.nav-open{overflow:hidden}

/* Unified modal */
#app-modal{width:min(920px,calc(100vw - 32px));max-height:min(90vh,920px);overflow:hidden;border-radius:22px;background:#fff;box-shadow:0 34px 100px rgba(5,17,48,.28)}
#app-modal::backdrop{background:rgba(5,14,39,.58);backdrop-filter:blur(4px)}
.app-modal-shell{display:flex;flex-direction:column;max-height:min(90vh,920px)}
.app-modal-head{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:17px 20px;border-bottom:1px solid var(--line);background:linear-gradient(180deg,#fff,#FBFCFF);flex:0 0 auto}
.app-modal-head>div{min-width:0}.app-modal-head h2{margin:0;font-size:18px}.app-modal-head p{margin:4px 0 0;color:var(--muted);font-size:11px}
.app-modal-close{width:40px;height:40px;border:1px solid var(--line);background:#F7F9FC;color:var(--text);border-radius:12px;font-size:22px;line-height:1;flex:0 0 auto}
.app-modal-close:hover{background:#EEF3FB}
.app-modal-body{overflow:auto;padding:20px;overscroll-behavior:contain}
.app-modal-body>.panel,.app-modal-body>.form-panel{margin:0;max-width:none;box-shadow:none;border:0;padding:0;background:transparent}
.app-modal-body .page-intro{display:none}
.app-modal-body .form-actions{position:sticky;bottom:-20px;background:linear-gradient(180deg,rgba(255,255,255,.75),#fff 28%);padding:16px 0 2px;margin-top:10px;z-index:3}
.app-modal-body .form-actions .btn{min-width:120px}
.modal-loading,.modal-error{min-height:260px;display:grid;place-items:center;align-content:center;gap:12px;text-align:center;color:var(--muted)}
.modal-loading span{width:38px;height:38px;border:3px solid #DCE6FA;border-top-color:var(--primary);border-radius:50%;animation:modalSpin .8s linear infinite}
.modal-error b{color:var(--danger);font-size:16px}.modal-error p{margin:0 0 8px}
@keyframes modalSpin{to{transform:rotate(360deg)}}

/* Native dialogs (payments and academic quick-add) use the same language */
dialog:not(#app-modal){width:min(680px,calc(100vw - 28px));max-height:90vh;overflow:auto;border-radius:20px}
dialog:not(#app-modal) .dialog-card{padding:0;gap:0}
.dialog-head{position:sticky;top:0;background:#fff;z-index:4;padding:16px 18px;border-bottom:1px solid var(--line);margin:0 0 16px}
dialog:not(#app-modal) .dialog-card>label,dialog:not(#app-modal) .dialog-card>.btn,dialog:not(#app-modal) .dialog-card>.form-grid,dialog:not(#app-modal) .dialog-card>.dialog-section{margin-left:18px;margin-right:18px}
dialog:not(#app-modal) .dialog-card>.btn{margin-bottom:18px;margin-top:6px}
.dialog-card.form-grid{display:grid}

/* Academic management: overview first, forms only on demand */
.academic-actionbar{display:flex;flex-wrap:wrap;gap:9px;margin-bottom:18px;background:#fff;border:1px solid var(--line);border-radius:17px;padding:12px;box-shadow:var(--shadow)}
.academic-actionbar .btn{flex:0 0 auto}
.academic-section-title{display:flex;justify-content:space-between;align-items:center;gap:12px}
.academic-section-title .btn{white-space:nowrap}

/* Better form rhythm */
.form-grid{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:18px;row-gap:15px}
.form-grid label,.stack label{min-width:0}
input,select,textarea{min-height:44px;line-height:1.4}
textarea{min-height:96px}
input[type=file]{padding:8px}
.search-select-wrap{display:grid;gap:6px}.search-select-wrap .select-search{margin:0;min-height:40px;background:#F8FAFD}
.form-hint{background:#F4F8FF;border:1px solid #DFE9FF;border-radius:12px;padding:10px 12px;color:#4C648B;font-size:11px;line-height:1.8}

/* Tables stay rich on desktop and become readable cards on phones */
.table-wrap{scrollbar-width:thin;scrollbar-color:#CBD5E6 transparent}
table th{white-space:nowrap}
td{overflow-wrap:anywhere}
.table-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.table-link{display:inline-flex;align-items:center;min-height:36px;padding:5px 8px;border-radius:8px;margin:0}
.table-link:hover{background:#EEF4FF}

/* Filters */
.mobile-filter-toggle{display:none;border:1px solid var(--line);background:#fff;color:var(--text);border-radius:12px;padding:10px 14px;font-weight:800;margin-bottom:10px;width:100%}
.filter-bar{align-items:end}.filter-bar .btn{align-self:stretch}

/* Small empty states */
.task-cards:empty:after,.employee-grid:empty:after{content:'لا توجد بيانات مطابقة حاليًا';display:block;background:#fff;border:1px dashed #D8DFEB;border-radius:16px;padding:34px;text-align:center;color:var(--muted)}

/* Laptop / small desktop */
@media(max-width:1280px){
 .app-shell{grid-template-columns:250px minmax(0,1fr)}.sidebar{width:250px}.content{padding:24px 22px 48px}
 .currency-card{gap:9px;padding:14px}.kpi-grid{gap:12px}.employee-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .academic-kpis{grid-template-columns:repeat(5,minmax(0,1fr))}
}

/* Tablet landscape + iPad: navigation becomes off-canvas to preserve content width */
@media(max-width:1024px){
 .app-shell{display:block}.main-wrap{width:100%;min-width:0}.sidebar{width:min(320px,86vw);transform:translateX(110%);transition:transform .24s var(--ease);box-shadow:-20px 0 70px rgba(0,0,0,.22)}.sidebar.open{transform:translateX(0)}
 .mobile-only{display:grid}.topbar{padding:0 18px}.content{padding:22px 18px 44px}
 .two-col{grid-template-columns:1fr}.kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.file-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .currency-summary{grid-template-columns:1fr}.dashboard-hero{padding:22px}.dashboard-hero h2{font-size:24px}
 .academic-kpis{grid-template-columns:repeat(5,minmax(90px,1fr));overflow:auto;padding-bottom:3px}
}

/* Tablet portrait / large mobile */
@media(max-width:768px){
 .topbar{height:68px;padding:0 12px}.topbar h1{font-size:17px;max-width:46vw;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.topbar p{display:none}.profile-chip{padding:5px}.profile-chip>div:not(.avatar){display:none}
 .content{padding:16px 11px 38px}.panel{padding:16px;border-radius:16px}.section-head,.panel-head{align-items:flex-start}.page-intro{align-items:flex-start;flex-direction:column}.page-intro h2{font-size:22px}
 .dashboard-hero{align-items:flex-start;flex-direction:column;border-radius:19px}.hero-actions{width:100%;display:grid;grid-template-columns:1fr 1fr}.hero-actions .btn{width:100%}
 .form-grid,.details{grid-template-columns:1fr}.full{grid-column:1}.form-actions{display:grid;grid-template-columns:1fr 1fr}.form-actions .btn{width:100%}
 .filter-advanced:not(.expanded)>:not(button):nth-child(n+4){display:none}.mobile-filter-toggle{display:block}.filter-bar{grid-template-columns:1fr 1fr;padding:10px}.filter-bar.expanded{display:grid}.filter-bar input,.filter-bar select{min-width:0}
 .employee-grid,.file-grid,.entity-grid{grid-template-columns:1fr}.task-card{padding:13px}.task-card-top{align-items:flex-start}.task-meta{gap:7px}
 .currency-card,.currency-summary.mini .currency-card{grid-template-columns:auto minmax(0,1fr) minmax(92px,auto)}.currency-card>div:nth-child(n+4){display:none}
 .academic-actionbar{display:grid;grid-template-columns:1fr 1fr}.academic-actionbar .btn{width:100%}.academic-kpis{grid-template-columns:repeat(3,minmax(92px,1fr))}
 #app-modal{width:calc(100vw - 18px);max-height:94dvh;border-radius:18px}.app-modal-shell{max-height:94dvh}.app-modal-body{padding:16px}.app-modal-body .form-actions{bottom:-16px}
 dialog:not(#app-modal){width:calc(100vw - 18px);max-height:94dvh}
}

/* Phone: tables turn into cards, no horizontal scrolling needed */
@media(max-width:600px){
 .kpi-grid{grid-template-columns:1fr}.kpi{min-height:100px}.section-head{flex-direction:column}.section-head>.btn,.section-head>.actions{width:100%}.section-head>.btn{justify-content:center}.actions{display:grid;grid-template-columns:1fr 1fr;width:100%}.actions .btn{width:100%;padding-inline:9px}
 .filter-bar{grid-template-columns:1fr}.filter-bar>*{width:100%}
 .table-panel{background:transparent;border:0;box-shadow:none;overflow:visible}.table-panel .panel-head{background:#fff;border:1px solid var(--line);border-radius:14px;padding:12px;margin-bottom:10px}.table-wrap{overflow:visible}
 table{min-width:0;display:block}thead{display:none}tbody{display:grid;gap:10px}tr{display:block;background:#fff;border:1px solid var(--line);border-radius:15px;padding:8px 12px;box-shadow:0 5px 18px rgba(27,45,88,.045)}td{display:grid;grid-template-columns:minmax(88px,34%) minmax(0,1fr);gap:10px;align-items:start;border-bottom:1px dashed #E8ECF3;padding:9px 0;font-size:12px;text-align:right}td:last-child{border-bottom:0}td:before{content:attr(data-label);font-size:10px;font-weight:800;color:var(--muted);padding-top:2px}td:empty{display:none}td small{line-height:1.7}.table-link{min-height:32px;padding:3px 7px}
 .employee-card{padding:14px}.mini-kpis{grid-template-columns:1fr 1fr 1fr;gap:5px}.mini-kpis div{padding:8px 4px}
 .academic-actionbar{grid-template-columns:1fr}.academic-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.info-pill{border-radius:12px;width:100%}
 .currency-card,.currency-summary.mini .currency-card{grid-template-columns:auto 1fr}.currency-card>div:nth-child(n+3){display:none}
 .quick-actions{display:grid;grid-template-columns:1fr 1fr}.quick-actions .btn{width:100%}
 .task-card-top{display:grid;grid-template-columns:1fr auto}.task-card-top small{line-height:1.6}.task-meta span{font-size:10px}
 .file-list>div{align-items:flex-start;gap:8px;flex-direction:column}.inline-upload{display:grid;grid-template-columns:1fr}.inline-upload select,.inline-upload input[type=file]{width:100%}
 .auth-card{padding:24px 18px;margin:18px auto}.auth-card-head h2{font-size:25px}
}

/* Very small phones */
@media(max-width:390px){
 .content{padding-inline:8px}.topbar{padding-inline:8px}.top-actions{gap:5px}.icon-btn{min-width:40px;width:40px}.profile-chip{border:0;background:transparent}
 .panel{padding:13px}.dashboard-hero{padding:18px 15px}.dashboard-hero h2{font-size:21px}.hero-actions,.quick-actions,.actions,.form-actions{grid-template-columns:1fr}
 .academic-kpis{grid-template-columns:1fr 1fr}.academic-kpis>div{padding:11px}.academic-kpis b{font-size:20px}
 .app-modal-head{padding:13px 14px}.app-modal-body{padding:13px}td{grid-template-columns:82px minmax(0,1fr)}
}

/* Motion accessibility */
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important;animation:none!important}}

/* ========================================================================
   Production UX V3.2 — full responsive pass (desktop / laptop / tablet / phone)
   ======================================================================== */
:root{
  --sidebar-width:272px;
  --page-gutter:clamp(14px,2.1vw,34px);
  --section-gap:clamp(14px,1.4vw,22px);
  --card-pad:clamp(15px,1.25vw,22px);
  --ui-font:clamp(14px,.18vw + 13px,16px);
}
html{font-size:var(--ui-font)}
body{min-width:0;min-height:100dvh}
.app-shell{grid-template-columns:var(--sidebar-width) minmax(0,1fr)}
.sidebar{width:var(--sidebar-width);padding:18px 14px;overflow:hidden}
.sidebar nav{min-height:0;padding-bottom:8px;overscroll-behavior:contain;scrollbar-width:thin}
.sidebar nav a{min-width:0;font-size:.9rem}
.sidebar nav a span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.brand{min-width:0}.brand>div{min-width:0}.brand strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sidebar-user{min-width:0}.sidebar-user .grow{overflow:hidden}.sidebar-user strong,.sidebar-user small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.main-wrap{grid-column:2;width:100%;min-width:0;max-width:none}
.topbar{height:74px;padding-inline:var(--page-gutter);gap:16px}
.topbar-start,.top-actions{min-width:0}.topbar-start>div{min-width:0}.topbar h1{font-size:clamp(17px,1.15vw,21px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.topbar p{font-size:.74rem}
.profile-chip{max-width:min(330px,32vw)}.profile-chip>div:not(.avatar){min-width:0}.profile-chip b,.profile-chip small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.content{width:100%;max-width:none;margin:0;padding:clamp(18px,2vw,30px) var(--page-gutter) clamp(42px,4vw,66px)}
.content>*{min-width:0}
.panel{padding:var(--card-pad);margin-bottom:var(--section-gap)}
.section-head,.panel-head{gap:12px}.section-head>div,.panel-head>div{min-width:0}
.section-head h2,.panel-head h2,.panel h2{font-size:clamp(16px,1vw,19px)}
.section-head p,.panel-head p{line-height:1.75}

/* Fluid dashboard/layout grids: use the available screen instead of a fixed narrow canvas. */
.kpi-grid{grid-template-columns:repeat(auto-fit,minmax(min(220px,100%),1fr));gap:clamp(10px,1vw,15px);margin-bottom:var(--section-gap)}
.kpi{padding:clamp(15px,1.2vw,20px);min-height:108px}.kpi strong{font-size:clamp(24px,2vw,30px)}
.two-col{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--section-gap)}
.employee-grid{grid-template-columns:repeat(auto-fit,minmax(min(285px,100%),1fr));gap:var(--section-gap)}
.file-grid{grid-template-columns:repeat(auto-fit,minmax(min(260px,100%),1fr));gap:12px}
.entity-grid{grid-template-columns:repeat(auto-fit,minmax(min(260px,100%),1fr));gap:12px}
.academic-kpis{grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:10px}
.academic-kpis.compact{grid-template-columns:repeat(3,minmax(0,1fr))}
.currency-summary{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--section-gap)}
.dashboard-hero{width:100%;padding:clamp(20px,2vw,30px);gap:20px;margin-bottom:var(--section-gap)}
.dashboard-hero>div:first-child{min-width:0;max-width:72ch}.dashboard-hero h2{font-size:clamp(24px,2vw,32px)}.dashboard-hero p{line-height:1.8}
.hero-actions{flex:0 0 auto}
.quick-actions{margin-top:clamp(14px,1.5vw,22px)}

/* Financial cards keep every currency readable without overflowing. */
.currency-card{min-width:0;grid-template-columns:auto minmax(125px,1.2fr) repeat(6,minmax(82px,1fr));gap:clamp(8px,.8vw,12px);padding:clamp(14px,1.2vw,19px)}
.currency-card>div{display:block}
.currency-summary.mini .currency-card{grid-template-columns:auto minmax(120px,1.25fr) repeat(3,minmax(90px,1fr))}
.currency-title,.currency-card>div{min-width:0}.currency-card b,.currency-card small{overflow-wrap:anywhere}.currency-card b{font-size:clamp(12px,.8vw,14px)}

/* Lists and task cards must wrap safely in Arabic. */
.list-row,.task-priority,.task-card-top,.employee-head{min-width:0}
.list-row>*,.task-priority>*,.task-card-top>*,.employee-head>*{min-width:0}
.list-row strong,.list-row small,.task-priority strong,.task-priority small,.task-card strong,.task-card small{overflow-wrap:anywhere}
.row-end{flex:0 0 auto}

/* Forms: fluid fields, predictable touch targets and no viewport overflow. */
.form-panel{width:100%;max-width:1180px}.form-panel.narrow,.narrow{width:min(100%,720px)}
.form-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:15px 18px}
.form-grid>*,.stack>*,label,.search-select-wrap{min-width:0}
input,select,textarea{max-width:100%;min-width:0;font-size:1rem}
input[type=date],input[type=datetime-local],input[type=time],input[type=number]{min-width:0}
select{background-position:left 12px center}
.form-actions{flex-wrap:wrap}.form-actions .btn{min-width:112px}
.inline-upload{display:grid;grid-template-columns:minmax(150px,.45fr) minmax(220px,1fr) auto;align-items:end;width:100%}
.inline-upload select,.inline-upload input[type=file]{width:100%;min-width:0}
.details{grid-template-columns:repeat(2,minmax(0,1fr))}
.details dd{overflow-wrap:anywhere}

/* Tables: desktop table, tablet scroll, mobile semantic cards (labels injected by app.js). */
.table-panel{width:100%;min-width:0}.table-wrap{width:100%;max-width:100%;overflow:auto;overscroll-behavior-inline:contain;-webkit-overflow-scrolling:touch}
table{min-width:760px}.table-panel table{width:100%}
th,td{padding:13px 14px;line-height:1.55}.table-actions{min-width:max-content}
.table-search{width:min(300px,100%);max-width:100%}
.pagination{flex-wrap:wrap}

/* Modal-first UX: usable with keyboard, iPad and small phones. */
#app-modal{width:min(960px,calc(100vw - 32px));max-width:960px;max-height:calc(100dvh - 28px)}
.app-modal-shell{max-height:calc(100dvh - 28px)}
.app-modal-body{min-width:0;padding:clamp(14px,1.5vw,22px)}
.app-modal-body .form-panel{width:100%}.app-modal-body .form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.app-modal-head h2{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
dialog:not(#app-modal){max-width:760px;max-height:calc(100dvh - 28px)}

/* Setup / authentication also scale cleanly. */
.auth-layout{grid-template-columns:minmax(360px,1.05fr) minmax(360px,.95fr)}
.auth-card{width:min(100%,480px);padding:clamp(24px,3vw,38px)}
.setup-shell{grid-template-columns:minmax(300px,360px) minmax(0,1fr)}
.setup-card{max-width:1120px;width:100%;padding:clamp(24px,4vw,64px)}
.requirement-grid,.setup-choice{grid-template-columns:repeat(2,minmax(0,1fr))}

/* Large/standard laptops. The sidebar gets slimmer before content becomes cramped. */
@media(max-width:1440px){
 :root{--sidebar-width:238px;--page-gutter:clamp(14px,1.8vw,25px)}
 .sidebar{padding-inline:12px}.brand strong{font-size:14px}.sidebar nav a{padding:10px 11px;gap:9px}.sidebar nav a i{width:23px;height:23px}
 .currency-summary{grid-template-columns:1fr}.currency-card{grid-template-columns:auto minmax(125px,1.15fr) repeat(6,minmax(86px,1fr))}.currency-card>div{display:block}
 .two-col{gap:16px}
}

/* Compact laptops / landscape tablets: free the whole canvas by moving navigation off-canvas. */
@media(max-width:1180px){
 :root{--sidebar-width:300px}
 .app-shell{display:block}.main-wrap{width:100%;max-width:none}
 .sidebar{width:min(var(--sidebar-width),88vw);transform:translateX(110%);transition:transform .24s var(--ease);box-shadow:-22px 0 75px rgba(0,0,0,.24)}.sidebar.open{transform:translateX(0)}
 .mobile-only{display:grid}.content{padding-inline:clamp(14px,2.2vw,24px)}
 .topbar{padding-inline:clamp(12px,2vw,22px)}
 .employee-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .currency-summary{grid-template-columns:1fr}.currency-card{grid-template-columns:auto minmax(125px,1.2fr) repeat(6,minmax(80px,1fr))}.currency-card>div{display:block}
 .auth-layout{grid-template-columns:1fr}.auth-showcase{display:none}.auth-card{background:#fff;border:1px solid var(--line);border-radius:22px;box-shadow:var(--shadow-lg);margin:40px auto}.auth-card-head img{display:block}
 .setup-shell{grid-template-columns:1fr}.setup-hero{min-height:auto;padding:28px}.setup-steps{display:none}
}

/* iPad / tablet portrait. */
@media(max-width:900px){
 .topbar{height:68px}.topbar p{display:none}.profile-chip>div:not(.avatar){display:none}.profile-chip{padding:5px;max-width:none}
 .content{padding-top:18px}
 .dashboard-hero{flex-direction:column;align-items:stretch}.hero-actions{width:100%;display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.hero-actions .btn{width:100%}
 .kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .two-col{grid-template-columns:1fr}.employee-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .currency-card,.currency-summary.mini .currency-card{grid-template-columns:auto minmax(110px,1.2fr) repeat(3,minmax(80px,1fr))}.currency-card>div{display:block}.currency-card>div:nth-child(n+6){display:none}
 .page-intro{align-items:flex-start;flex-direction:column}.page-intro>.actions,.page-intro>.btn{width:100%}
 .form-grid,.app-modal-body .form-grid,.details{grid-template-columns:1fr}.full{grid-column:1}.form-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%}.form-actions .btn{width:100%;min-width:0}
 .inline-upload{grid-template-columns:1fr 1fr}.inline-upload .btn{grid-column:1/-1}
 .file-grid,.entity-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .academic-actionbar{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.academic-actionbar .btn{width:100%}
 .requirement-grid,.setup-choice{grid-template-columns:1fr}
}

/* Large phones and narrow tablets. */
@media(max-width:700px){
 :root{--page-gutter:11px}
 .topbar{padding-inline:10px;gap:8px}.topbar h1{max-width:52vw;font-size:16px}.top-actions{gap:6px}.icon-btn{width:42px;min-width:42px}.avatar{width:34px;height:34px}
 .content{padding:14px var(--page-gutter) calc(34px + env(safe-area-inset-bottom))}
 .panel{padding:15px;border-radius:16px}.section-head,.panel-head{align-items:flex-start}.section-head{flex-direction:column}.section-head>.actions,.section-head>.btn{width:100%}
 .actions,.quick-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%}.actions .btn,.quick-actions .btn{width:100%;min-width:0}
 .dashboard-hero{padding:19px 16px;border-radius:18px}.dashboard-hero h2{font-size:22px}.dashboard-hero p{font-size:.85rem}.hero-actions{grid-template-columns:1fr 1fr}
 .kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.kpi{min-height:96px;padding:14px}.kpi-icon{padding-right:54px}.kpi-icon i{right:13px;top:14px;width:33px;height:33px}.kpi span{font-size:.78rem}.kpi strong{font-size:23px;margin-top:8px}
 .employee-grid,.file-grid,.entity-grid{grid-template-columns:1fr}
 .currency-card,.currency-summary.mini .currency-card{grid-template-columns:auto minmax(0,1fr) repeat(2,minmax(86px,.8fr))}.currency-card>div{display:none}.currency-card>div:nth-child(1),.currency-card>div:nth-child(2),.currency-card>div:nth-child(3),.currency-card>div:nth-child(5){display:block}
 .academic-kpis,.academic-kpis.compact{grid-template-columns:repeat(2,minmax(0,1fr))}
 .filter-bar{display:grid;grid-template-columns:1fr 1fr;padding:10px}.filter-bar>*{min-width:0}.mobile-filter-toggle{display:block}
 .filter-advanced:not(.expanded)>:not(button):nth-child(n+4){display:none}
 #app-modal{width:calc(100vw - 12px);max-width:none;max-height:calc(100dvh - 12px);border-radius:16px}.app-modal-shell{max-height:calc(100dvh - 12px)}.app-modal-head{padding:13px 14px}.app-modal-body{padding:13px}
 dialog:not(#app-modal){width:calc(100vw - 12px);max-width:none;max-height:calc(100dvh - 12px);border-radius:16px}
 .inline-upload{grid-template-columns:1fr}.inline-upload .btn{grid-column:auto}
 .file-list>div{flex-direction:column;align-items:flex-start;gap:8px}
}

/* Phones: transform all data tables into labelled cards. */
@media(max-width:600px){
 .table-panel{background:transparent;border:0;box-shadow:none;overflow:visible;padding:0}.table-panel>.panel-head{background:#fff;border:1px solid var(--line);border-radius:14px;padding:12px;margin-bottom:10px}.table-wrap{overflow:visible}
 table{display:block;min-width:0;width:100%}thead{display:none}tbody{display:grid;gap:10px;width:100%}tr{display:block;width:100%;background:#fff;border:1px solid var(--line);border-radius:15px;padding:7px 12px;box-shadow:0 6px 20px rgba(27,45,88,.05)}
 td{display:grid;grid-template-columns:minmax(92px,34%) minmax(0,1fr);gap:9px;align-items:start;width:100%;border-bottom:1px dashed #E8ECF3;padding:9px 0;font-size:.82rem;text-align:right;white-space:normal}
 td:last-child{border-bottom:0}td:before{content:attr(data-label);font-size:.72rem;font-weight:800;color:var(--muted);padding-top:2px}td:empty{display:none}
 td>*,td strong,td small{max-width:100%;overflow-wrap:anywhere}.table-actions{min-width:0;display:flex;flex-wrap:wrap}.table-link{min-height:34px}
 .table-search{width:100%}
 .list-row{align-items:flex-start}.row-end{text-align:right}
 .task-card-top{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:start}.task-meta{gap:6px}
 .form-actions{grid-template-columns:1fr 1fr}
 .page-intro h2{font-size:21px}
 .notification{padding:13px}.notification p{overflow-wrap:anywhere}
}

/* Small phones. */
@media(max-width:440px){
 .topbar h1{max-width:45vw}.profile-chip{border:0;background:transparent}.top-actions{gap:4px}
 .dashboard-hero{padding:17px 14px}.hero-actions,.actions,.quick-actions,.form-actions{grid-template-columns:1fr}
 .kpi-grid{grid-template-columns:1fr}.kpi{min-height:90px}
 .currency-card,.currency-summary.mini .currency-card{grid-template-columns:auto minmax(0,1fr) repeat(2,minmax(0,1fr))}.currency-card>div{display:none}.currency-card>div:nth-child(1),.currency-card>div:nth-child(2),.currency-card>div:nth-child(3),.currency-card>div:nth-child(5){display:block}.currency-card>div:nth-child(3),.currency-card>div:nth-child(5){margin-top:8px}
 .academic-actionbar{grid-template-columns:1fr}.academic-kpis,.academic-kpis.compact{grid-template-columns:repeat(2,minmax(0,1fr))}
 .filter-bar{grid-template-columns:1fr}.filter-bar>*{width:100%}
 .task-status-strip{padding:10px;gap:7px}.badge{white-space:normal;text-align:center}
 td{grid-template-columns:84px minmax(0,1fr);gap:7px}
 .dialog-head{padding:13px 14px}dialog:not(#app-modal) .dialog-card>label,dialog:not(#app-modal) .dialog-card>.btn,dialog:not(#app-modal) .dialog-card>.form-grid,dialog:not(#app-modal) .dialog-card>.dialog-section{margin-inline:13px}
}

/* Tiny phones / accessibility zoom. */
@media(max-width:360px){
 .content{padding-inline:7px}.panel{padding:12px}.topbar{padding-inline:7px}.topbar h1{max-width:40vw}
 .academic-kpis,.academic-kpis.compact{grid-template-columns:1fr}
 td{grid-template-columns:1fr;gap:3px}td:before{padding-top:0}
 #app-modal{width:100vw;height:100dvh;max-height:100dvh;border-radius:0}.app-modal-shell{height:100dvh;max-height:100dvh}
 dialog:not(#app-modal){width:100vw;max-height:100dvh;border-radius:0}
}

/* Safe areas for notched devices. */
@supports(padding:max(0px)){
 .sidebar{padding-top:max(18px,env(safe-area-inset-top));padding-bottom:max(14px,env(safe-area-inset-bottom))}
 @media(max-width:1180px){.sidebar{padding-right:max(14px,env(safe-area-inset-right))}}
}

/* =========================================================
   V3.3 — Polished file management & action system
   ========================================================= */
:root{
 --soft-primary:#EEF4FF;
 --soft-success:#ECFDF3;
 --soft-danger:#FFF0F2;
 --soft-accent:#ECFEFF;
 --file-border:#DCE5F2;
}

/* Give interactive controls a consistent, production-grade feel. */
.btn,.file-action,.mini-action,.file-picker-button{transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease,background .16s ease,color .16s ease}
.btn:hover,.file-action:hover,.mini-action:hover,.file-picker-button:hover{transform:translateY(-1px)}
.btn:active,.file-action:active,.mini-action:active,.file-picker-button:active{transform:translateY(0)}
.btn:focus-visible,.file-action:focus-visible,.mini-action:focus-visible,.file-picker-button:focus-visible{outline:3px solid rgba(21,94,239,.18);outline-offset:2px}

.file-manager-panel{overflow:hidden}
.file-manager-head{padding-bottom:2px}
.file-manager-head .eyebrow{display:block;color:var(--primary);font-size:11px;font-weight:800;margin-bottom:4px}
.file-count-badge{display:inline-flex;align-items:center;justify-content:center;min-height:34px;padding:6px 12px;border-radius:999px;background:var(--soft-primary);color:var(--primary);font-size:12px;font-weight:800;border:1px solid #D9E6FF;white-space:nowrap}

.file-upload-bar{display:grid;grid-template-columns:minmax(170px,.72fr) minmax(280px,1.75fr) auto;gap:12px;align-items:end;padding:14px;border:1px solid var(--file-border);border-radius:15px;background:linear-gradient(180deg,#FAFCFF,#F7FAFE);margin:14px 0 18px}
.upload-field{min-width:0;gap:6px}.upload-field>span{font-size:11px;color:var(--muted);font-weight:800}
.upload-actions{display:flex;align-items:center;gap:8px;min-height:44px}.upload-actions .btn{min-height:44px;white-space:nowrap}
.btn-upload svg,.file-action svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:0 0 auto}

/* Custom file input: removes the browser's inconsistent "Choose File" UI. */
.file-picker{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:11px;min-height:46px;padding:5px 7px;border:1px solid #DCE2EC;border-radius:11px;background:#fff;cursor:pointer;overflow:hidden}
.file-picker:hover{border-color:#BFCBE0;box-shadow:0 5px 18px rgba(31,55,104,.05)}
.file-picker.has-file{border-color:#B7D0FF;background:#FBFDFF}
.file-picker-input{position:absolute!important;width:1px!important;height:1px!important;opacity:0!important;pointer-events:none!important;padding:0!important;border:0!important}
.file-picker-button{border:0;border-radius:9px;min-height:34px;padding:7px 11px;background:var(--soft-primary);color:var(--primary);display:inline-flex;align-items:center;gap:6px;font-weight:800;white-space:nowrap}
.file-picker-button span{font-size:17px;line-height:1}.file-picker-copy{min-width:0;display:flex;flex-direction:column;gap:2px}.file-picker-copy strong{font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.file-picker-copy small{font-size:10px;color:var(--muted);font-weight:400;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

.file-grid-polished{gap:13px}
.file-card-pro{padding:0;gap:0;overflow:hidden;border-color:var(--file-border);background:linear-gradient(180deg,#fff,#FCFDFF);box-shadow:0 7px 22px rgba(25,46,92,.045)}
.file-card-pro:hover{border-color:#C7D6EB;box-shadow:0 13px 32px rgba(25,46,92,.08);transform:translateY(-1px)}
.file-card-main{display:grid;grid-template-columns:52px minmax(0,1fr);gap:12px;align-items:start;padding:15px}
.file-type-icon{width:52px;height:56px;border-radius:13px;background:linear-gradient(145deg,#EFF5FF,#E5EEFF);border:1px solid #D7E4FF;display:grid;place-items:center;position:relative;color:var(--primary);box-shadow:inset 0 1px #fff}
.file-type-icon:before{content:"";position:absolute;top:0;left:0;width:15px;height:15px;border-bottom-right-radius:8px;background:#D4E3FF}
.file-type-icon span{font-size:10px;font-weight:900;letter-spacing:.2px;max-width:42px;overflow:hidden;text-overflow:ellipsis}
.file-card-copy{min-width:0}.file-name{font-size:13px;line-height:1.55;display:block;overflow-wrap:anywhere;color:var(--text)}
.file-meta-row{display:flex;flex-wrap:wrap;gap:6px;margin-top:9px}
.file-meta-pill{display:inline-flex;align-items:center;min-height:24px;padding:3px 8px;border-radius:999px;background:#F4F7FB;border:1px solid #E4EAF2;color:#5D6B82;font-size:10px;font-weight:700;white-space:nowrap}
.file-uploader{display:block;margin-top:8px!important;color:var(--muted);font-size:10px!important}
.file-actions-pro{display:grid;grid-template-columns:1fr 1fr 1fr;gap:7px;padding:10px;border-top:1px solid #EAF0F6;background:#FAFCFF;font-size:11px}
.file-action{min-height:38px;border-radius:9px;border:1px solid transparent;padding:7px 9px;display:flex;align-items:center;justify-content:center;gap:6px;font-weight:800;white-space:nowrap;cursor:pointer;font:inherit}
.file-action-preview{background:#fff;border-color:#DCE5F2;color:#334A6B}.file-action-preview:hover{border-color:#BFCDE1;background:#F8FBFF}
.file-action-download{background:var(--primary);color:#fff;box-shadow:0 5px 14px rgba(21,94,239,.18)}.file-action-download:hover{background:var(--primary2);color:#fff}
.file-action-version{background:var(--soft-accent);color:#087B80;border-color:#CFF1F2}.file-action-version:hover{background:#DFF8F9;color:#056D72}
.file-empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-height:170px;border:1px dashed #CAD6E6;border-radius:15px;background:#FBFCFE}.file-empty-state strong{font-size:13px}.file-empty-state small{color:var(--muted);font-size:11px;text-align:center}.empty-file-icon{width:42px;height:42px;border-radius:13px;background:var(--soft-primary);color:var(--primary);display:grid;place-items:center;font-size:24px}

/* Compact actions used in file repository and receipt cells. */
.file-table-actions{gap:6px!important;min-width:0!important}
.mini-action{display:inline-flex;align-items:center;justify-content:center;min-height:32px;padding:5px 9px;border-radius:8px;border:1px solid #DCE5F2;background:#fff;color:#41536D;font-size:11px;font-weight:800;white-space:nowrap;line-height:1.2}
button.mini-action{font:inherit;cursor:pointer}.mini-action-preview:hover{background:#F6F9FE;border-color:#C6D3E5}.mini-action-download{background:var(--soft-primary);color:var(--primary);border-color:#D7E5FF}.mini-action-download:hover{background:#E4EEFF}.mini-action-danger{background:var(--soft-danger);color:var(--danger);border-color:#FFD6DD}.mini-action-danger:hover{background:#FFE4E8}
.receipt-actions{display:flex;gap:5px;flex-wrap:wrap}

/* Generic file lists in project/client details use the same card language. */
.file-list-polished{display:flex;flex-direction:column;gap:8px;margin-top:13px}
.file-list-item{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:center;padding:11px 12px;border:1px solid var(--file-border);border-radius:12px;background:#fff}
.file-list-item-main{min-width:0;display:flex;align-items:center;gap:10px}.file-list-icon{width:36px;height:36px;border-radius:10px;background:var(--soft-primary);color:var(--primary);display:grid;place-items:center;font-size:12px;font-weight:900;flex:0 0 auto}.file-list-copy{min-width:0}.file-list-copy strong,.file-list-copy small{display:block}.file-list-copy strong{font-size:12px;overflow-wrap:anywhere}.file-list-copy small{font-size:10px;color:var(--muted);margin-top:3px}.file-list-actions{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}

@media(max-width:900px){
 .file-upload-bar{grid-template-columns:1fr 1.5fr}.upload-actions{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr}.upload-actions .btn{width:100%}
 .file-actions-pro{grid-template-columns:1fr 1fr}.file-action-version{grid-column:1/-1}
}
@media(max-width:600px){
 .file-manager-head{align-items:flex-start}.file-count-badge{min-height:30px;padding:5px 9px}
 .file-upload-bar{grid-template-columns:1fr;padding:11px}.upload-actions{grid-column:auto;grid-template-columns:1fr}.upload-actions .btn{min-height:42px}
 .file-card-main{grid-template-columns:44px minmax(0,1fr);padding:13px}.file-type-icon{width:44px;height:48px;border-radius:11px}
 .file-actions-pro{grid-template-columns:1fr 1fr;padding:8px}.file-action{min-height:40px}.file-action-version{grid-column:1/-1}
 .file-list-item{grid-template-columns:1fr;align-items:start}.file-list-actions{justify-content:stretch;display:grid;grid-template-columns:1fr 1fr}.file-list-actions .mini-action{width:100%}
 .file-picker{grid-template-columns:auto minmax(0,1fr)}.file-picker-copy small{white-space:normal;line-height:1.35}
}
@media(max-width:380px){
 .file-actions-pro{grid-template-columns:1fr}.file-action-version{grid-column:auto}.file-action{width:100%}
 .file-picker{grid-template-columns:1fr}.file-picker-button{width:100%;justify-content:center}.file-picker-copy{text-align:center;padding-bottom:4px}
}
.file-actions-two{grid-template-columns:1fr 1fr}
@media(max-width:380px){.file-actions-two{grid-template-columns:1fr}}

/* V3.4 - simplified delivery/review workflow + operational analytics */
.smart-workflow-panel{overflow:hidden}.workflow-stepper{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:16px 0 18px;position:relative}.workflow-step{display:flex;align-items:center;gap:8px;padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:#fbfcff;color:var(--muted);min-width:0}.workflow-step b{display:grid;place-items:center;flex:0 0 28px;width:28px;height:28px;border-radius:50%;background:#eef2f8;color:#66738f;font-size:12px}.workflow-step span{font-size:.78rem;font-weight:800;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.workflow-step.active{border-color:#9bc3ff;background:#f3f8ff;color:var(--primary)}.workflow-step.active b{background:var(--primary);color:#fff}.workflow-step.done{border-color:#bce7d8;background:#f3fcf8;color:#087a54}.workflow-step.done b{background:#0f9f6e;color:#fff}.workflow-actions.smart{display:grid;gap:14px}.action-callout{display:flex;justify-content:space-between;gap:12px;padding:14px 16px;border:1px solid #c7dbff;border-radius:14px;background:#f5f9ff}.action-callout.revision{border-color:#f1d7a4;background:#fffaf0}.action-callout.success{border-color:#bee8d7;background:#f3fbf7}.action-callout strong{display:block;margin-bottom:3px}.action-callout p,.action-state p,.decision-card p{margin:0;color:var(--muted);font-size:.82rem}.smart-submit-form{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;align-items:end;gap:12px}.smart-submit-form.compact{grid-template-columns:minmax(0,1fr) auto}.smart-submit-form label{display:grid;gap:6px;font-weight:800;font-size:.82rem}.btn-lg{min-height:46px;padding:11px 18px}.secondary-action{border-top:1px dashed var(--line);padding-top:10px}.secondary-action summary{cursor:pointer;color:var(--muted);font-size:.78rem}.secondary-action form{margin-top:9px}.action-state{display:flex;align-items:flex-start;gap:12px;padding:16px;border:1px solid var(--line);border-radius:14px;background:#fbfcff}.action-state>b{display:grid;place-items:center;flex:0 0 38px;width:38px;height:38px;border-radius:50%;background:#eef2f8;color:#53617b}.action-state.waiting{border-color:#f2dcaa;background:#fffaf2}.action-state.waiting>b{background:#fff0cc;color:#9c6600}.action-state.success{border-color:#bee8d7;background:#f4fcf8}.action-state.success>b{background:#d9f5e9;color:#087a54}.review-file-highlight{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px;border:1px solid #cadcfb;border-radius:14px;background:#f7faff}.review-file-highlight strong,.review-file-highlight small{display:block}.review-file-highlight small{color:var(--muted);margin-top:3px}.review-decision-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.decision-card{display:grid;grid-template-columns:46px minmax(0,1fr);gap:10px;border:1px solid var(--line);border-radius:16px;padding:16px;background:#fff}.decision-card textarea,.decision-card .btn{grid-column:1/-1}.decision-card.approve{border-color:#bfe7d8;background:linear-gradient(180deg,#fbfffd,#f4fbf7)}.decision-card.revision{border-color:#f1c7c7;background:linear-gradient(180deg,#fffdfd,#fff7f7)}.decision-icon{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;background:#eaf8f2;color:#07845b;font-weight:900;font-size:20px}.decision-card.revision .decision-icon{background:#fff0f0;color:#c43838}

.analytics-ribbon{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:12px 0 18px}.analytics-ribbon>div{background:#fff;border:1px solid var(--line);border-radius:13px;padding:11px 13px;box-shadow:0 6px 18px rgba(30,47,83,.04)}.analytics-ribbon small{display:block;color:var(--muted);font-size:.7rem}.analytics-ribbon strong{display:block;color:var(--navy);font-size:1.05rem;margin-top:2px}.dashboard-analytics-grid{margin-bottom:18px}.insight-list{display:grid;gap:9px}.insight-card{display:flex;align-items:flex-start;gap:10px;padding:11px 12px;border:1px solid var(--line);border-radius:12px;background:#fbfcff;color:inherit;text-decoration:none}.insight-card i{display:grid;place-items:center;flex:0 0 30px;width:30px;height:30px;border-radius:9px;background:#eaf2ff;color:#1767e8;font-style:normal;font-weight:900}.insight-card strong{font-size:.84rem}.insight-card p{margin:2px 0 0;color:var(--muted);font-size:.74rem;line-height:1.55}.insight-card.danger{border-color:#f0c4c4;background:#fff8f8}.insight-card.danger i{background:#ffe8e8;color:#c93434}.insight-card.warning{border-color:#f0d8a7;background:#fffaf0}.insight-card.warning i{background:#fff0c9;color:#9d6700}.insight-card.success{border-color:#bde5d5;background:#f5fcf8}.insight-card.success i{background:#dff5eb;color:#087a54}.bar-chart{display:grid;gap:10px}.bar-chart.compact{gap:8px}.bar-row{display:grid;grid-template-columns:minmax(92px,130px) minmax(0,1fr) 34px;align-items:center;gap:9px;font-size:.76rem}.bar-row>span{font-weight:800;color:#53617b}.bar-track{height:10px;border-radius:20px;background:#edf1f7;overflow:hidden}.bar-track i{display:block;height:100%;border-radius:20px;background:linear-gradient(90deg,#1767e8,#12a6d8);min-width:3px}.bar-row>b{text-align:center;font-size:.78rem}.column-chart{height:220px;display:flex;align-items:flex-end;justify-content:space-around;gap:10px;padding:20px 8px 0;border-bottom:1px solid var(--line)}.column{height:100%;flex:1;max-width:74px;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:5px}.column i{width:min(70%,42px);background:linear-gradient(180deg,#17a6db,#1767e8);border-radius:8px 8px 2px 2px;min-height:8px}.column b{font-size:.72rem}.column span{font-size:.65rem;color:var(--muted);direction:ltr}.smart-filter-panel{margin-bottom:16px}.report-filter-grid{grid-template-columns:repeat(4,minmax(140px,1fr)) auto;align-items:end}.report-filter-grid label{display:grid;gap:5px;font-size:.72rem;font-weight:800}.report-scope-line{display:flex;gap:7px;flex-wrap:wrap;margin-top:11px;color:var(--muted);font-size:.72rem}.report-scope-line span{padding:5px 8px;background:#f3f6fa;border-radius:999px}.analytics-kpis{grid-template-columns:repeat(6,minmax(0,1fr))}.analytics-grid{align-items:stretch}.currency-analysis-list{display:grid;gap:10px}.currency-analysis{border:1px solid var(--line);border-radius:13px;padding:12px}.currency-analysis>div:first-child{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.currency-analysis>div:first-child small{color:var(--muted)}.currency-analysis dl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:0}.currency-analysis dl>div{background:#f7f9fc;border-radius:9px;padding:8px}.currency-analysis dt{font-size:.68rem;color:var(--muted)}.currency-analysis dd{margin:2px 0 0;font-size:.78rem;font-weight:800}.official-report-cta{display:flex;align-items:center;justify-content:space-between;gap:18px;border-color:#a9caff;background:linear-gradient(135deg,#f5f9ff,#fff)}.official-report-cta h2{margin:2px 0}.official-report-cta p{max-width:760px;color:var(--muted);font-size:.8rem}.report-task-details td small{display:block;color:var(--muted);margin-top:2px}

@media(max-width:1100px){.analytics-kpis{grid-template-columns:repeat(3,minmax(0,1fr))}.report-filter-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.smart-submit-form{grid-template-columns:1fr 1fr}.smart-submit-form .btn{grid-column:1/-1}.official-report-cta{align-items:flex-start;flex-direction:column}}
@media(max-width:800px){.workflow-stepper{grid-template-columns:repeat(2,minmax(0,1fr))}.review-decision-grid{grid-template-columns:1fr}.analytics-ribbon{grid-template-columns:repeat(2,minmax(0,1fr))}.report-filter-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.analytics-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.smart-submit-form,.smart-submit-form.compact{grid-template-columns:1fr}.smart-submit-form .btn{grid-column:auto}.review-file-highlight{align-items:flex-start;flex-direction:column}.review-file-highlight .actions{width:100%}}
@media(max-width:520px){.workflow-stepper{grid-template-columns:1fr}.workflow-step{padding:8px 10px}.analytics-ribbon,.report-filter-grid,.analytics-kpis{grid-template-columns:1fr}.currency-analysis dl{grid-template-columns:1fr}.review-decision-grid{gap:10px}.decision-card{grid-template-columns:38px minmax(0,1fr);padding:13px}.decision-icon{width:36px;height:36px}.bar-row{grid-template-columns:88px minmax(0,1fr) 28px}.official-report-cta form,.official-report-cta .btn{width:100%}}

:root{--navy:#0B1638}
.employee-card-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}.employee-card-actions .btn{width:100%}
@media(max-width:440px){.employee-card-actions{grid-template-columns:1fr}}
/* V3.4 official report archive */
.issued-report-list{display:grid;gap:9px}.issued-report-item{display:grid;grid-template-columns:42px minmax(0,1fr) auto;gap:12px;align-items:center;padding:12px 14px;border:1px solid var(--line);border-radius:14px;background:linear-gradient(180deg,#fff,#fbfdff);color:inherit;text-decoration:none;transition:.18s ease}.issued-report-item:hover{border-color:#b8cff5;box-shadow:0 8px 22px rgba(32,75,145,.08);transform:translateY(-1px)}.issued-report-seal{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:#e9f8f1;color:#13845c;font-weight:900}.issued-report-item strong{display:block}.issued-report-item small{display:block;color:var(--muted);margin-top:2px}.issued-report-meta{text-align:left}.issued-report-meta b{display:block;font-size:12px}.issued-report-meta small{font-size:10px}@media(max-width:640px){.issued-report-item{grid-template-columns:38px minmax(0,1fr)}.issued-report-meta{grid-column:2;text-align:right}}

/* V3.5 official report issuance */
.official-issue-form{display:flex;align-items:end;gap:10px;flex-wrap:wrap}.official-issue-form label{min-width:230px;display:grid;gap:6px;color:var(--text-muted,#64748b);font-size:12px}.official-issue-form select{min-height:44px}@media(max-width:700px){.official-issue-form,.official-issue-form label,.official-issue-form .btn{width:100%}}

/* === BCC DASHBOARD CLEAN V36 START === */

/* ===================================================
   Dashboard scope
   =================================================== */

.bcc-admin-dashboard {
    width: 100%;
    min-width: 0;

    display: block;

    direction: rtl;
}

.bcc-admin-dashboard > * {
    min-width: 0;
}


/* ===================================================
   Hero
   =================================================== */

.bcc-admin-dashboard .dashboard-hero {
    position: relative !important;

    inset: auto !important;

    width: 100% !important;
    min-height: 150px !important;

    margin:
        0
        0
        18px
        !important;

    padding:
        28px
        clamp(24px, 3vw, 38px)
        !important;

    display: flex !important;

    align-items: center !important;
    justify-content: space-between !important;

    gap: 24px !important;

    transform: none !important;

    overflow: hidden !important;

    border-radius:
        22px
        !important;
}

.bcc-admin-dashboard
.dashboard-hero > div:first-child {

    min-width: 0;

    max-width: 720px;
}

.bcc-admin-dashboard
.dashboard-hero h2 {

    margin:
        0
        0
        7px
        !important;

    font-size:
        clamp(25px, 2.2vw, 33px)
        !important;

    line-height: 1.3;
}

.bcc-admin-dashboard
.dashboard-hero p {

    margin: 0 !important;

    line-height: 1.8;
}

.bcc-admin-dashboard
.hero-actions {

    position: relative !important;

    inset: auto !important;

    flex: 0 0 auto;

    display: flex !important;

    align-items: center !important;

    gap: 10px !important;

    flex-wrap: wrap;
}


/* ===================================================
   MAIN KPI CARDS
   =================================================== */

.bcc-admin-dashboard
.kpi-grid {

    position: static !important;

    inset: auto !important;

    width: 100% !important;

    display: grid !important;

    grid-template-columns:
        repeat(4, minmax(0, 1fr))
        !important;

    gap: 14px !important;

    margin:
        0
        0
        14px
        !important;

    padding: 0 !important;

    transform: none !important;
}


/* Card */

.bcc-admin-dashboard
.kpi {

    position: relative !important;

    inset: auto !important;

    width: auto !important;
    min-width: 0 !important;
    min-height: 118px !important;

    margin: 0 !important;

    padding:
        18px
        68px
        16px
        18px
        !important;

    display: flex !important;

    flex-direction: column !important;

    justify-content: center !important;
    align-items: flex-start !important;

    transform: none !important;

    overflow: hidden !important;

    border-radius:
        18px
        !important;

    background:
        #ffffff
        !important;
}


/* Icon — now a REAL icon element */

.bcc-admin-dashboard
.kpi .kpi-symbol {

    position: absolute !important;

    right: 18px !important;
    top: 18px !important;

    left: auto !important;
    bottom: auto !important;

    width: 38px !important;
    height: 38px !important;

    margin: 0 !important;
    padding: 0 !important;

    display: grid !important;

    place-items: center !important;

    border-radius:
        12px
        !important;

    background:
        #eef4ff
        !important;

    color:
        var(--primary)
        !important;

    font-style: normal !important;
    font-weight: 900 !important;

    transform: none !important;
}


/* Danger icon */

.bcc-admin-dashboard
.kpi.danger .kpi-symbol {

    background:
        #fff0f2
        !important;

    color:
        var(--danger)
        !important;
}


/* Warning icon */

.bcc-admin-dashboard
.kpi.warning .kpi-symbol {

    background:
        #fff6e8
        !important;

    color:
        var(--warning)
        !important;
}


/* KPI title */

.bcc-admin-dashboard
.kpi > span {

    margin: 0 !important;

    display: block !important;

    color:
        var(--muted)
        !important;

    font-size:
        12px
        !important;

    font-weight: 700;

    line-height: 1.5;
}


/* KPI value */

.bcc-admin-dashboard
.kpi > strong {

    margin:
        7px
        0
        4px
        !important;

    display: block !important;

    font-size:
        29px
        !important;

    font-weight: 900 !important;

    line-height: 1 !important;

    color:
        var(--text)
        !important;
}


/* KPI description */

.bcc-admin-dashboard
.kpi > small {

    margin: 0 !important;

    display: block !important;

    font-size:
        11px
        !important;

    line-height: 1.5 !important;

    color:
        var(--muted)
        !important;
}


/* ===================================================
   ANALYTICS RIBBON
   =================================================== */

.bcc-admin-dashboard
.analytics-ribbon {

    width: 100% !important;

    display: grid !important;

    grid-template-columns:
        repeat(4, minmax(0, 1fr))
        !important;

    gap: 12px !important;

    margin:
        0
        0
        18px
        !important;
}

.bcc-admin-dashboard
.analytics-ribbon > div {

    min-width: 0;
    min-height: 74px;

    padding:
        12px
        14px
        !important;

    display: flex !important;

    flex-direction: column !important;

    align-items: flex-start !important;
    justify-content: center !important;

    border-radius:
        14px
        !important;
}

.bcc-admin-dashboard
.analytics-ribbon small {

    margin: 0;

    font-size:
        11px
        !important;

    line-height: 1.5;
}

.bcc-admin-dashboard
.analytics-ribbon strong {

    margin:
        4px
        0
        0
        !important;

    font-size:
        17px
        !important;

    line-height: 1.2;
}


/* ===================================================
   Two-column dashboard sections
   =================================================== */

.bcc-admin-dashboard
.two-col {

    width: 100% !important;

    display: grid !important;

    grid-template-columns:
        repeat(2, minmax(0, 1fr))
        !important;

    align-items: stretch !important;

    gap: 18px !important;

    margin:
        0
        0
        18px
        !important;
}

.bcc-admin-dashboard
.two-col > .panel {

    width: 100% !important;
    height: 100% !important;

    min-width: 0 !important;

    margin: 0 !important;

    padding:
        20px
        !important;

    border-radius:
        18px
        !important;
}


/* Dashboard panel headers */

.bcc-admin-dashboard
.panel-head {

    margin:
        0
        0
        15px
        !important;

    align-items: flex-start !important;
}

.bcc-admin-dashboard
.panel-head h2 {

    font-size:
        17px
        !important;
}

.bcc-admin-dashboard
.panel-head p {

    font-size:
        12px
        !important;

    line-height: 1.7;
}


/* Empty panels */

.bcc-admin-dashboard
.empty {

    min-height:
        84px
        !important;

    display: grid !important;

    place-items: center !important;

    padding: 16px;

    text-align: center;

    color:
        var(--muted)
        !important;
}


/* ===================================================
   Business insight cards
   =================================================== */

.bcc-admin-dashboard
.insight-list {

    display: grid;

    gap: 10px;
}

.bcc-admin-dashboard
.insight-card {

    min-width: 0;

    border-radius:
        13px;
}


/* ===================================================
   Financial title
   =================================================== */

.bcc-admin-dashboard
> .section-head {

    margin:
        4px
        0
        14px
        !important;

    align-items:
        flex-end
        !important;
}


/* ===================================================
   CURRENCY CARDS
   =================================================== */

.bcc-admin-dashboard
.currency-summary {

    width: 100% !important;

    display: grid !important;

    grid-template-columns:
        1fr
        !important;

    gap: 12px !important;

    margin:
        0
        0
        18px
        !important;
}


.bcc-admin-dashboard
.currency-card {

    position: relative !important;

    width: 100% !important;
    min-width: 0 !important;

    margin: 0 !important;

    padding:
        18px
        20px
        !important;

    display: grid !important;

    /*
       Currency identity on right
       + 3 financial metrics per row.
    */

    grid-template-columns:
        44px
        minmax(145px, 1.25fr)
        repeat(3, minmax(110px, 1fr))
        !important;

    grid-template-rows:
        auto
        auto
        !important;

    align-items: center !important;

    gap:
        11px
        16px
        !important;

    overflow: hidden !important;

    border-radius:
        18px
        !important;
}


/* Override old mobile hide rules */

.bcc-admin-dashboard
.currency-card > div {

    display: block !important;

    min-width: 0 !important;
}


/* Flag */

.bcc-admin-dashboard
.currency-card
.currency-flag {

    grid-column: 1;

    grid-row:
        1 / span 2;

    align-self: center;

    font-size:
        27px
        !important;
}


/* Currency name */

.bcc-admin-dashboard
.currency-card
.currency-title {

    grid-column: 2;

    grid-row:
        1 / span 2;

    align-self: center;
}


/* First row */

.bcc-admin-dashboard
.currency-card > div:nth-child(3) {

    grid-column: 3;
    grid-row: 1;
}

.bcc-admin-dashboard
.currency-card > div:nth-child(4) {

    grid-column: 4;
    grid-row: 1;
}

.bcc-admin-dashboard
.currency-card > div:nth-child(5) {

    grid-column: 5;
    grid-row: 1;
}


/* Second row */

.bcc-admin-dashboard
.currency-card > div:nth-child(6) {

    grid-column: 3;
    grid-row: 2;
}

.bcc-admin-dashboard
.currency-card > div:nth-child(7) {

    grid-column: 4;
    grid-row: 2;
}

.bcc-admin-dashboard
.currency-card > div:nth-child(8) {

    grid-column: 5;
    grid-row: 2;
}


.bcc-admin-dashboard
.currency-card small {

    margin:
        0
        0
        3px;

    font-size:
        10px
        !important;
}


.bcc-admin-dashboard
.currency-card b {

    margin: 0 !important;

    font-size:
        13px
        !important;

    white-space:
        nowrap;
}


.bcc-admin-dashboard
.currency-title strong {

    font-size:
        15px;
}


/* ===================================================
   Academic widget
   =================================================== */

.bcc-admin-dashboard
.academic-kpis.compact {

    display: grid !important;

    grid-template-columns:
        repeat(3, minmax(0, 1fr))
        !important;

    gap: 8px !important;
}


/* ===================================================
   Bottom actions
   =================================================== */

.bcc-admin-dashboard
.quick-actions {

    width: 100% !important;

    margin:
        18px
        0
        0
        !important;

    padding: 0 !important;

    display: flex !important;

    align-items: center !important;
    justify-content: flex-start !important;

    gap: 10px !important;

    flex-wrap: wrap !important;
}


/* ===================================================
   Medium screens
   =================================================== */

@media (max-width: 1100px) {

    .bcc-admin-dashboard
    .kpi-grid {

        grid-template-columns:
            repeat(2, minmax(0, 1fr))
            !important;
    }

    .bcc-admin-dashboard
    .two-col {

        grid-template-columns:
            1fr
            !important;
    }

    .bcc-admin-dashboard
    .currency-card {

        grid-template-columns:
            42px
            minmax(130px, 1fr)
            repeat(2, minmax(90px, 1fr))
            !important;

        grid-template-rows:
            auto
            auto
            auto
            !important;
    }

    .bcc-admin-dashboard
    .currency-card
    .currency-flag {

        grid-column: 1;

        grid-row:
            1 / span 3;
    }

    .bcc-admin-dashboard
    .currency-card
    .currency-title {

        grid-column: 2;

        grid-row:
            1 / span 3;
    }

    .bcc-admin-dashboard
    .currency-card > div:nth-child(3) {

        grid-column: 3;
        grid-row: 1;
    }

    .bcc-admin-dashboard
    .currency-card > div:nth-child(4) {

        grid-column: 4;
        grid-row: 1;
    }

    .bcc-admin-dashboard
    .currency-card > div:nth-child(5) {

        grid-column: 3;
        grid-row: 2;
    }

    .bcc-admin-dashboard
    .currency-card > div:nth-child(6) {

        grid-column: 4;
        grid-row: 2;
    }

    .bcc-admin-dashboard
    .currency-card > div:nth-child(7) {

        grid-column: 3;
        grid-row: 3;
    }

    .bcc-admin-dashboard
    .currency-card > div:nth-child(8) {

        grid-column: 4;
        grid-row: 3;
    }
}


/* ===================================================
   Tablet
   =================================================== */

@media (max-width: 900px) {

    .bcc-admin-dashboard
    .analytics-ribbon {

        grid-template-columns:
            repeat(2, minmax(0, 1fr))
            !important;
    }

    .bcc-admin-dashboard
    .dashboard-hero {

        min-height: auto !important;

        flex-direction: column !important;

        align-items: stretch !important;

        padding:
            21px
            18px
            !important;

        border-radius:
            18px
            !important;
    }

    .bcc-admin-dashboard
    .hero-actions {

        width: 100%;

        display: grid !important;

        grid-template-columns:
            repeat(2, minmax(0, 1fr))
            !important;
    }

    .bcc-admin-dashboard
    .hero-actions .btn {

        width: 100%;
    }
}


/* ===================================================
   Mobile
   =================================================== */

@media (max-width: 700px) {

    .bcc-admin-dashboard
    .kpi-grid {

        gap:
            10px
            !important;
    }

    .bcc-admin-dashboard
    .kpi {

        min-height:
            106px
            !important;

        padding:
            15px
            58px
            14px
            14px
            !important;
    }

    .bcc-admin-dashboard
    .kpi .kpi-symbol {

        right:
            14px
            !important;

        top:
            14px
            !important;

        width:
            34px
            !important;

        height:
            34px
            !important;
    }

    .bcc-admin-dashboard
    > .section-head {

        flex-direction:
            column
            !important;

        align-items:
            flex-start
            !important;
    }

    .bcc-admin-dashboard
    > .section-head
    > .btn {

        width:
            100%;
    }

    .bcc-admin-dashboard
    .currency-card {

        padding:
            15px
            14px
            !important;
    }

    .bcc-admin-dashboard
    .quick-actions {

        display: grid !important;

        grid-template-columns:
            repeat(2, minmax(0, 1fr))
            !important;
    }

    .bcc-admin-dashboard
    .quick-actions .btn {

        width: 100%;
    }
}


/* ===================================================
   Small mobile
   =================================================== */

@media (max-width: 480px) {

    .bcc-admin-dashboard
    .kpi-grid,

    .bcc-admin-dashboard
    .analytics-ribbon {

        grid-template-columns:
            1fr
            !important;
    }

    .bcc-admin-dashboard
    .hero-actions,

    .bcc-admin-dashboard
    .quick-actions {

        grid-template-columns:
            1fr
            !important;
    }

    .bcc-admin-dashboard
    .currency-card {

        grid-template-columns:
            36px
            minmax(0, 1fr)
            minmax(92px, 1fr)
            !important;

        grid-template-rows:
            repeat(3, auto)
            !important;
    }

    .bcc-admin-dashboard
    .currency-card
    .currency-flag {

        grid-column: 1;

        grid-row:
            1 / span 3;
    }

    .bcc-admin-dashboard
    .currency-card
    .currency-title {

        grid-column: 2;

        grid-row:
            1 / span 3;
    }

    .bcc-admin-dashboard
    .currency-card > div:nth-child(3) {

        grid-column: 3;
        grid-row: 1;
    }

    .bcc-admin-dashboard
    .currency-card > div:nth-child(4) {

        grid-column: 3;
        grid-row: 2;
    }

    .bcc-admin-dashboard
    .currency-card > div:nth-child(6) {

        grid-column: 3;
        grid-row: 3;
    }

    .bcc-admin-dashboard
    .currency-card > div:nth-child(5),

    .bcc-admin-dashboard
    .currency-card > div:nth-child(7),

    .bcc-admin-dashboard
    .currency-card > div:nth-child(8) {

        display: none !important;
    }
}

/* === BCC DASHBOARD CLEAN V36 END === */

