:root{
  --ink:#15201e;--forest:#14594f;--forest-2:#0f443d;--mint:#dceee8;--canvas:#f2f5f3;
  --line:#dce4e0;--muted:#687570;--danger:#b42318;--amber:#9a6700;--blue:#175cd3;
  --white:#fff;--shadow:0 14px 36px rgba(20,70,62,.07)
}
*{box-sizing:border-box}
html{direction:rtl}
body{margin:0;min-width:320px;background:var(--canvas);color:var(--ink);font-family:Tahoma,"Segoe UI",Arial,sans-serif}
body.dark-mode{--ink:#eef7f4;--forest:#33b49f;--forest-2:#65d7c6;--mint:#143832;--canvas:#071512;--line:#24423b;--muted:#a3bbb4;--white:#0d211d;--shadow:0 18px 42px rgba(0,0,0,.24)}
body.dark-mode .topbar,body.dark-mode .sidebar,body.dark-mode .panel,body.dark-mode .stat,body.dark-mode input,body.dark-mode select,body.dark-mode textarea,body.dark-mode .small-button{background:#0d211d;color:var(--ink)}
body.dark-mode th,body.dark-mode .field-help,body.dark-mode .worker-platform-grid section,body.dark-mode .inline-accounts,body.dark-mode .worker-ops-stats article{background:#102923}
button,input,select,textarea{font:inherit}
button{cursor:pointer}
[hidden]{display:none!important}
.login-view{min-height:100vh;display:grid;grid-template-columns:minmax(390px,.82fr) 1.18fr;background:#fff}
.login-panel{width:100%;min-width:0;min-height:100vh;display:flex;flex-direction:column;justify-content:center;overflow:hidden;padding:48px clamp(28px,7vw,110px);background:#fff}
.login-logo{width:155px;max-width:100%;height:auto;object-fit:contain}
.eyebrow{margin:18px 0 5px;color:var(--forest);font-size:11px;font-weight:900;letter-spacing:0}
.login-panel h1{max-width:500px;margin:8px 0;font-size:clamp(29px,4vw,44px);line-height:1.25;overflow-wrap:anywhere}
.muted{color:var(--muted);line-height:1.7}
.login-panel label,.dialog-form label{display:grid;gap:8px;margin-top:15px;color:#35413e;font-size:12px;font-weight:900}
input,select,textarea{width:100%;border:1px solid #c8d3ce;border-radius:6px;background:#fff;padding:11px;color:var(--ink);outline:none}
input:focus,select:focus,textarea:focus{border-color:var(--forest);box-shadow:0 0 0 3px rgba(20,89,79,.11)}
.login-context{display:flex;flex-direction:column;justify-content:space-between;padding:44px;background:#123f39;color:#fff}
.brand-word{font-size:14px;font-weight:900;letter-spacing:0}
.login-context h2{max-width:780px;margin:10px 0;font-size:clamp(38px,5vw,68px);line-height:1.18}
.button{min-height:40px;display:inline-flex;align-items:center;justify-content:center;border:0;border-radius:6px;padding:0 16px;font-weight:900;text-decoration:none}
.button.primary{background:var(--forest);color:#fff}
.button.primary:hover{background:var(--forest-2)}
.button.secondary{border:1px solid var(--line);background:#fff;color:var(--ink)}
.button.wide{width:100%;margin-top:8px}
.button.compact{min-height:34px;padding:0 11px;font-size:11px}
.danger-button{border:1px solid #f3b7b2;background:#fff;color:var(--danger)}
.form-error{min-height:19px;margin:10px 0;color:var(--danger);font-size:12px;font-weight:900}
.topbar{position:sticky;top:0;z-index:20;height:66px;display:flex;align-items:center;gap:12px;padding:0 20px;border-bottom:1px solid var(--line);background:#fff}
.top-logo{width:96px;height:44px;object-fit:contain}
.top-title strong,.top-title small,.identity strong,.identity small{display:block}
.top-title small,.identity small{margin-top:3px;color:var(--muted);font-size:10px}
.top-actions{margin-right:auto;display:flex;align-items:center;gap:8px}
.identity{text-align:left;font-size:11px}
.icon-button{width:38px;height:38px;display:grid;place-items:center;border:0;background:transparent;color:#53615d;font-size:19px}
.app-layout{display:grid;grid-template-columns:238px minmax(0,1fr)}
.sidebar{position:sticky;top:66px;height:calc(100vh - 66px);padding:14px 11px;border-left:1px solid var(--line);background:#fff;overflow-y:auto}
.role-card{display:grid;gap:4px;padding:13px;margin-bottom:12px;border-radius:6px;background:var(--mint)}
.role-card small,.role-card span{color:var(--forest);font-size:10px;font-weight:800}
.nav-group-label{display:block;margin:15px 11px 5px;color:#8a9692;font-size:9px;font-weight:900}
.nav-button{width:100%;min-height:40px;display:flex;align-items:center;border:0;border-radius:5px;padding:8px 12px;background:transparent;color:#52605c;text-align:right;font-size:12px;font-weight:900}
.nav-button:hover{background:#f0f4f2}
.nav-button.active{background:var(--forest);color:#fff}
.version{margin:20px 10px 0;padding:14px 0;border-top:1px solid var(--line);font-size:11px;font-weight:900}
.version small{display:block;margin-top:4px;color:var(--muted)}
.content{min-width:0;padding:26px}
.view{max-width:1600px;margin:auto}
.page-head{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:20px}
.page-head h1{margin:5px 0;font-size:clamp(25px,3vw,34px)}
.page-head p{margin-top:0}
.head-actions{display:flex;align-items:center;gap:8px}
.search-input{width:220px;min-height:40px}
.stats-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px}
.stat{min-width:0;padding:16px;border:1px solid var(--line);border-radius:6px;background:#fff;box-shadow:var(--shadow)}
.stat small,.stat strong{display:block}
.stat small{min-height:30px;color:var(--muted);font-size:11px;font-weight:800}
.stat strong{margin-top:8px;font-size:27px;overflow-wrap:anywhere}
.stats-grid.advanced{grid-template-columns:repeat(4,minmax(0,1fr))}
.kpi-card{position:relative;overflow:hidden}
.kpi-card::before{content:"";position:absolute;inset:0 0 auto;height:4px;background:linear-gradient(90deg,var(--forest),#2f80ed,#f2b705)}
.dashboard-toolbar{display:grid;grid-template-columns:repeat(6,minmax(140px,1fr)) auto;gap:11px;align-items:end;margin-bottom:14px;padding:14px}
.dashboard-toolbar label{display:grid;gap:7px;color:#35413e;font-size:11px;font-weight:900}
body.dark-mode .dashboard-toolbar label{color:var(--ink)}
.dashboard-actions{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end}
.dashboard-alerts{margin:14px 0}
.alerts-list{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;padding:12px}
.alert-card{min-width:0;display:flex;align-items:center;justify-content:space-between;gap:10px;border:1px solid #ffe2ad;border-right:4px solid var(--amber);border-radius:6px;background:#fffaf0;padding:11px}
.alert-card.high,.alert-card.critical{border-color:#ffcbc6;border-right-color:var(--danger);background:#fff5f4}
.alert-card strong,.alert-card small{display:block}
.alert-card strong{font-size:12px}
.alert-card small{margin-top:5px;color:var(--muted);font-size:10px}
body.dark-mode .alert-card{background:#201b10}
body.dark-mode .alert-card.high,body.dark-mode .alert-card.critical{background:#241514}
.dashboard-charts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:14px}
.chart-panel{min-height:270px}
.chart-panel.wide-chart{grid-column:span 3}
.bar-chart,.weekly-chart{display:grid;gap:10px;padding:14px}
.bar-row,.week-row{display:grid;grid-template-columns:minmax(95px,.9fr) minmax(90px,1.8fr) 48px;align-items:center;gap:10px;font-size:11px}
.bar-row>div,.stack{height:11px;border-radius:20px;background:#edf3f1;overflow:hidden}
.bar-row i,.stack i{display:block;height:100%}
.bar-row i{border-radius:20px;background:linear-gradient(90deg,var(--forest),#2f80ed)}
.stack{display:flex}
.stack .ok{background:#12b76a}.stack .live{background:#2f80ed}.stack .bad{background:#d92d20}
.daily-chart{min-height:190px;display:flex;align-items:end;gap:10px;overflow-x:auto;padding:18px 14px}
.daily-column{min-width:68px;display:grid;justify-items:center;gap:6px;color:var(--muted);font-size:10px}
.daily-column span{width:22px;border-radius:20px 20px 4px 4px;background:linear-gradient(180deg,#2f80ed,var(--forest))}
.daily-column b{color:var(--ink);font-size:11px}
.empty.slim{padding:20px}
.panel{min-width:0;overflow:hidden;border:1px solid var(--line);border-radius:6px;background:#fff;box-shadow:var(--shadow)}
.dashboard-tasks{margin-top:20px}
.panel>header{min-height:58px;display:flex;align-items:center;justify-content:space-between;padding:10px 16px;border-bottom:1px solid var(--line)}
.panel h2{margin:0;font-size:15px}
.panel header p{margin:4px 0 0;color:var(--muted);font-size:10px}
.text-button{border:0;background:transparent;color:var(--forest);font-size:11px;font-weight:900}
.login-help{margin-top:10px;align-self:center}
.task-list{display:grid}
.task-row{display:grid;grid-template-columns:minmax(200px,1.6fr) 1fr 1fr auto;align-items:center;gap:14px;padding:13px 16px;border-bottom:1px solid #edf1ef;font-size:12px}
.task-row:last-child{border:0}
.task-row small{display:block;margin-top:4px;color:var(--muted)}
.table-wrap{overflow:auto}
table{width:100%;min-width:900px;border-collapse:collapse;font-size:12px}
th{position:sticky;top:0;padding:11px 13px;background:#f7f9f8;color:var(--muted);text-align:right;font-size:10px}
td{max-width:320px;padding:12px 13px;border-top:1px solid #edf1ef;vertical-align:top;overflow-wrap:anywhere}
.row-actions{display:flex;flex-wrap:wrap;gap:5px}
.small-button{min-height:28px;border:1px solid var(--line);border-radius:5px;background:#fff;padding:0 8px;color:var(--ink);font-size:10px;font-weight:900}
.small-button.danger{color:var(--danger)}
.small-button.secure{color:var(--blue)}
.badge{display:inline-block;border-radius:4px;padding:4px 7px;background:#e7f6ef;color:#087452;font-size:9px;font-weight:900}
.badge.warning{background:#fff2d6;color:var(--amber)}
.badge.danger{background:#fee9e7;color:var(--danger)}
.badge.info{background:#eaf2ff;color:var(--blue)}
.empty{padding:50px;text-align:center;color:var(--muted)}
.flash{position:fixed;top:80px;left:22px;z-index:100;max-width:400px;border-radius:6px;padding:12px 16px;background:var(--forest);color:#fff;font-size:12px;font-weight:900;box-shadow:0 16px 45px rgba(0,0,0,.18)}
.flash.bad{background:var(--danger)}
dialog{width:min(780px,calc(100% - 24px));max-height:92vh;border:0;border-radius:8px;padding:0;box-shadow:0 28px 90px rgba(0,0,0,.28)}
dialog::backdrop{background:rgba(11,31,28,.48)}
.dialog-form{padding:21px}
.dialog-form>header{display:flex;align-items:start;justify-content:space-between;gap:15px;margin-bottom:15px}
.dialog-form h2{margin:5px 0 0;font-size:21px}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:13px}
.form-grid label{margin:0}
.form-grid .full{grid-column:1/-1}
.dialog-form footer{display:flex;justify-content:flex-end;gap:8px;margin-top:18px}
.field-help,.security-note{padding:10px;border-radius:5px;background:#f4f7f6;color:var(--muted);font-size:10px;line-height:1.6}
.account-summary{display:grid;gap:5px;margin-bottom:16px;padding:13px;border-radius:6px;background:var(--mint)}
.two-factor-box{display:grid;gap:10px;margin:14px 0;padding:12px;border:1px solid var(--line);border-radius:6px;background:#fbfcfc}
.two-factor-box strong,.two-factor-box span{display:block}
.two-factor-box span{margin-top:4px;color:var(--muted);font-size:10px}
.two-factor-box output{min-height:34px;padding:8px;border:1px solid var(--line);border-radius:5px;background:#fff;font-family:Consolas,monospace;word-break:break-all}
.sessions-list{display:grid;gap:7px;margin-top:16px}
.session-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px;border:1px solid var(--line);border-radius:5px;font-size:10px}
.credential-grid{display:grid;gap:10px}
.credential-grid label{margin:0}
.credential-grid output{min-height:42px;display:flex;align-items:center;padding:10px;border:1px solid var(--line);border-radius:5px;background:#f7f9f8;font-family:Consolas,monospace;word-break:break-all}
.link-button{width:max-content}
.inline-accounts{display:grid;gap:10px;margin-top:5px;padding:12px;border:1px solid var(--line);border-radius:6px;background:#f7f9f8}
.inline-accounts header{display:flex;align-items:center;justify-content:space-between;gap:10px}
.inline-accounts strong,.inline-accounts span{display:block}
.inline-accounts strong{font-size:13px}
.inline-accounts span{margin-top:4px;color:var(--muted);font-size:10px;line-height:1.5}
.inline-account-list{display:grid;gap:9px}
.inline-account-row{display:grid;grid-template-columns:1.1fr 1.1fr 1fr 1fr .8fr auto;gap:9px;align-items:end;padding:10px;border:1px solid #e2ebe7;border-radius:6px;background:#fff}
.inline-account-row label{margin:0}
.inline-account-remove{min-height:42px;white-space:nowrap}
.inline-account-existing{min-height:42px;display:flex;align-items:center;justify-content:center;padding:0 10px;border:1px solid #cddbd6;border-radius:5px;background:#eef5f2;color:#37554d;font-size:11px;font-weight:900;white-space:nowrap}
.resource-filters{display:grid;gap:12px;margin-bottom:14px;padding:14px}
.task-analytics{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:10px}
.financial-summary{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:10px}
.task-analytics article,.financial-summary article{min-width:0;padding:11px;border:1px solid var(--line);border-radius:6px;background:#f7f9f8}
.task-analytics small,.task-analytics strong,.financial-summary small,.financial-summary strong{display:block}
.task-analytics small,.financial-summary small{min-height:24px;color:var(--muted);font-size:10px;font-weight:900}
.task-analytics strong,.financial-summary strong{font-size:18px;overflow-wrap:anywhere}
.account-filter-grid{display:grid;grid-template-columns:repeat(7,minmax(120px,1fr));gap:10px}
.account-filter-grid label{display:grid;gap:7px;color:#35413e;font-size:11px;font-weight:900}
.bulk-actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding-top:12px;border-top:1px solid var(--line)}
.bulk-actions strong{margin-left:auto;font-size:12px}
.bulk-actions select{width:160px;min-height:34px;padding:7px;font-size:11px}
.row-selector,#selectAllRows{width:17px;height:17px;padding:0}
body.dark-mode .account-filter-grid label{color:var(--ink)}
body.dark-mode .task-analytics article,body.dark-mode .financial-summary article{background:#102923}
.finance-reports{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.finance-reports section{min-width:0;padding:12px;border:1px solid var(--line);border-radius:6px;background:#fbfcfc}
.finance-reports h3{margin:0 0 10px;font-size:12px}
.finance-report-row{display:grid;gap:4px;padding:8px 0;border-top:1px solid #edf1ef;font-size:11px}
.finance-report-row:first-child{border-top:0}
.finance-report-row strong,.finance-report-row span{display:block}
.finance-report-row span{color:var(--muted);line-height:1.5}
.finance-report-row.danger strong{color:var(--danger)}
body.dark-mode .finance-reports section{background:#102923}
.timeline-list{display:grid;gap:10px;max-height:62vh;overflow:auto}
.timeline-row{padding:12px;border:1px solid var(--line);border-radius:6px;background:#fbfcfc}
.timeline-row strong,.timeline-row small,.timeline-row code{display:block}
.timeline-row small{margin-top:4px;color:var(--muted);font-size:10px}
.timeline-row p{margin:8px 0;color:var(--muted);font-size:11px}
.timeline-row code{padding:8px;border-radius:5px;background:#f1f5f3;white-space:pre-wrap;word-break:break-word;direction:ltr;text-align:left}
body.dark-mode .timeline-row{background:#102923}
body.dark-mode .timeline-row code{background:#071512}
.worker-ops{display:grid;gap:14px;padding:16px}
.worker-ops-toolbar{display:grid;grid-template-columns:minmax(240px,330px) 1fr;gap:14px;align-items:end}
.worker-ops-toolbar label{display:grid;gap:7px;color:#35413e;font-size:12px;font-weight:900}
.worker-ops-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.worker-ops-stats article{min-width:0;padding:12px;border:1px solid var(--line);border-radius:6px;background:#f7f9f8}
.worker-ops-stats small,.worker-ops-stats strong{display:block}
.worker-ops-stats small{min-height:28px;color:var(--muted);font-size:10px;font-weight:900}
.worker-ops-stats strong{font-size:24px}
.worker-ops-list{display:grid;gap:12px}
.worker-platform-card{border:1px solid var(--line);border-radius:6px;background:#fff}
.worker-platform-card>header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;border-bottom:1px solid #edf1ef}
.worker-platform-card h2{margin:0;font-size:17px}
.worker-platform-card p{margin:5px 0 0;color:var(--muted);font-size:11px}
.worker-platform-grid{display:grid;grid-template-columns:1.1fr 1fr 1fr;gap:13px;padding:14px}
.worker-platform-grid section{min-width:0;padding:12px;border:1px solid #edf1ef;border-radius:6px;background:#fbfcfc}
.worker-platform-grid h3{margin:0 0 10px;font-size:12px}
.ops-account,.ops-task{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 0;border-top:1px solid #edf1ef;font-size:11px}
.ops-account:first-of-type,.ops-task:first-of-type{border-top:0}
.ops-account strong,.ops-account small,.ops-task strong,.ops-task small{display:block}
.ops-account small,.ops-task small{margin-top:4px;color:var(--muted)}
.quality-risk{display:grid;gap:14px}
.quality-risk-toolbar{display:grid;grid-template-columns:repeat(5,minmax(120px,1fr)) auto;gap:10px;align-items:end;padding:14px;border:1px solid var(--line);border-radius:6px;background:#fff}
.quality-risk-toolbar label{display:grid;gap:7px;font-size:11px;font-weight:900;color:#35413e}
.quality-risk-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.quality-risk-summary{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:10px}
.quality-risk-summary article{min-width:0;padding:12px;border:1px solid var(--line);border-radius:6px;background:#f7f9f8}
.quality-risk-summary small,.quality-risk-summary strong{display:block}
.quality-risk-summary small{min-height:24px;color:var(--muted);font-size:10px;font-weight:900}
.quality-risk-summary strong{font-size:18px;overflow-wrap:anywhere}
.quality-risk-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.quality-risk-panel{min-width:0;padding:14px;border:1px solid var(--line);border-radius:6px;background:#fff}
.quality-risk-panel.wide{grid-column:1/-1}
.quality-risk-panel h3{margin:0 0 10px;font-size:13px}
.quality-alert,.risk-row,.repeated-row,.trend-row{border:1px solid var(--line);border-radius:6px;background:#fbfcfc}
.quality-alert{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:11px;margin-bottom:8px;border-right:4px solid var(--amber)}
.quality-alert.critical,.quality-alert.high{border-right-color:var(--danger);background:#fff5f4}
.quality-alert strong,.quality-alert small,.risk-row strong,.risk-row small,.risk-row p,.repeated-row strong,.repeated-row span,.repeated-row small{display:block}
.quality-alert small,.risk-row small,.risk-row p,.repeated-row small{margin-top:5px;color:var(--muted);font-size:11px}
.risk-row{display:grid;grid-template-columns:minmax(180px,1fr) minmax(240px,1.2fr) 2fr auto;gap:12px;align-items:center;padding:12px;margin-bottom:9px}
.risk-main{display:grid;gap:5px}
.risk-metrics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
.risk-metrics span{padding:6px 8px;border-radius:5px;background:#eef6f2;font-size:10px;font-weight:900}
.training-rec{color:#176a4f!important}
.trend-row{display:grid;gap:7px;padding:10px;margin-bottom:8px}
.trend-row div{height:8px;border-radius:999px;background:#edf1ef;overflow:hidden}
.trend-row div span{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#1f7a5b,#f5a623)}
.repeated-row{padding:10px;margin-bottom:8px}
body.dark-mode .quality-risk-toolbar,body.dark-mode .quality-risk-panel{background:#0f221e}
body.dark-mode .quality-risk-summary article,body.dark-mode .quality-alert,body.dark-mode .risk-row,body.dark-mode .repeated-row,body.dark-mode .trend-row{background:#102923}
body.dark-mode .quality-alert.critical,body.dark-mode .quality-alert.high{background:#241514}
body.dark-mode .quality-risk-toolbar label{color:var(--ink)}
body.dark-mode .risk-metrics span{background:#16342d}
.daily-supervision{display:grid;gap:14px}
.supervision-toolbar{display:grid;grid-template-columns:repeat(4,minmax(130px,1fr)) auto;gap:10px;align-items:end;padding:14px;border:1px solid var(--line);border-radius:6px;background:#fff}
.supervision-toolbar label{display:grid;gap:7px;font-size:11px;font-weight:900;color:#35413e}
.supervision-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.supervision-summary{display:grid;grid-template-columns:repeat(9,minmax(0,1fr));gap:10px}
.supervision-summary article{min-width:0;padding:12px;border:1px solid var(--line);border-radius:6px;background:#f7f9f8}
.supervision-summary small,.supervision-summary strong{display:block}
.supervision-summary small{min-height:24px;color:var(--muted);font-size:10px;font-weight:900}
.supervision-summary strong{font-size:18px;overflow-wrap:anywhere}
.supervision-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.supervision-panel{min-width:0;padding:14px;border:1px solid var(--line);border-radius:6px;background:#fff}
.supervision-panel.wide{grid-column:1/-1}
.supervision-panel h3{margin:0 0 10px;font-size:13px}
.supervision-row,.supervision-comment,.supervision-mini{border:1px solid var(--line);border-radius:6px;background:#fbfcfc}
.supervision-row{display:grid;grid-template-columns:minmax(220px,1.2fr) minmax(180px,.8fr) 2fr;gap:12px;align-items:center;padding:12px;margin-bottom:9px}
.supervision-row strong,.supervision-row small,.supervision-row p,.supervision-comment strong,.supervision-comment small,.supervision-comment p,.supervision-mini strong,.supervision-mini span{display:block}
.supervision-row small,.supervision-row p,.supervision-comment small,.supervision-comment p,.supervision-mini span{margin-top:5px;color:var(--muted);font-size:11px;line-height:1.5}
.supervision-score{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
.supervision-score span{padding:6px 8px;border-radius:5px;background:#eef6f2;font-size:10px;font-weight:900}
.problem-note{color:var(--danger)!important}
.supervision-mini,.supervision-comment{padding:10px;margin-bottom:8px}
body.dark-mode .supervision-toolbar,body.dark-mode .supervision-panel{background:#0f221e}
body.dark-mode .supervision-summary article,body.dark-mode .supervision-row,body.dark-mode .supervision-comment,body.dark-mode .supervision-mini{background:#102923}
body.dark-mode .supervision-toolbar label{color:var(--ink)}
body.dark-mode .supervision-score span{background:#16342d}
.training-library{display:grid;gap:14px}
.training-toolbar{display:grid;grid-template-columns:2fr repeat(3,minmax(135px,1fr)) auto;gap:10px;align-items:end;padding:14px;border:1px solid var(--line);border-radius:6px;background:#fff}
.training-toolbar label{display:grid;gap:7px;font-size:11px;font-weight:900;color:#35413e}
.training-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.training-tags{display:flex;gap:7px;flex-wrap:wrap}
.training-tags .active,.training-platform.active{border-color:var(--forest);background:var(--forest);color:#fff}
.training-layout{display:grid;grid-template-columns:230px minmax(280px,.85fr) minmax(420px,1.35fr);gap:14px}
.training-layout>aside,.training-layout>section,.training-details{min-width:0;padding:14px;border:1px solid var(--line);border-radius:6px;background:#fff}
.training-layout h3{margin:0 0 10px;font-size:13px}
.training-platforms,.training-guides{display:grid;gap:8px}
.training-platform{width:100%;display:grid;gap:4px;border:1px solid var(--line);border-radius:6px;background:#fbfcfc;padding:10px;text-align:right;color:var(--ink)}
.training-platform strong,.training-platform span{display:block}
.training-platform span{color:var(--muted);font-size:10px}
.training-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-bottom:10px}
.training-summary article{min-width:0;padding:11px;border:1px solid var(--line);border-radius:6px;background:#f7f9f8}
.training-summary small,.training-summary strong{display:block}
.training-summary small{min-height:24px;color:var(--muted);font-size:10px;font-weight:900}
.training-summary strong{font-size:18px;overflow-wrap:anywhere}
.training-guide{display:grid;gap:8px;border:1px solid var(--line);border-radius:6px;background:#fbfcfc;padding:12px;cursor:pointer}
.training-guide.active{border-color:var(--forest);box-shadow:0 0 0 3px rgba(20,89,79,.08)}
.training-guide strong,.training-guide small,.training-guide p{display:block}
.training-guide small,.training-guide p{margin:0;color:var(--muted);font-size:11px;line-height:1.5}
.training-guide-meta{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.training-guide-meta span:not(.badge){border-radius:4px;background:#eef6f2;padding:4px 7px;font-size:9px;font-weight:900;color:#176a4f}
.training-details>header{display:flex;align-items:start;justify-content:space-between;gap:12px;margin-bottom:10px}
.training-details h2{margin:4px 0;font-size:20px;line-height:1.35}
.training-details header small{display:block;color:var(--muted);font-size:10px}
.training-description{color:var(--muted);line-height:1.7}
.training-detail-tags{display:flex;flex-wrap:wrap;gap:7px;margin:10px 0}
.training-detail-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.training-detail-grid section,.attachment-list{min-width:0;padding:11px;border:1px solid #edf1ef;border-radius:6px;background:#fbfcfc}
.training-detail-grid h4,.attachment-list h4{margin:0 0 8px;font-size:12px}
.training-detail-grid p{margin:0;color:var(--muted);font-size:11px;line-height:1.7;white-space:pre-wrap}
.attachment-list{margin-top:12px}
.attachment-row{display:grid;grid-template-columns:auto 1fr;gap:7px 10px;align-items:center;padding:9px 0;border-top:1px solid #edf1ef;color:var(--ink);text-decoration:none}
.attachment-row:first-of-type{border-top:0}
.attachment-row strong,.attachment-row small{display:block}
.attachment-row small{grid-column:2;color:var(--muted);font-size:10px}
body.dark-mode .training-toolbar,body.dark-mode .training-layout>aside,body.dark-mode .training-layout>section,body.dark-mode .training-details{background:#0f221e}
body.dark-mode .training-toolbar label{color:var(--ink)}
body.dark-mode .training-platform,body.dark-mode .training-summary article,body.dark-mode .training-guide,body.dark-mode .training-detail-grid section,body.dark-mode .attachment-list{background:#102923}
body.dark-mode .training-guide-meta span:not(.badge){background:#16342d}
.reports-engine{display:grid;gap:14px}
.reports-toolbar{display:grid;grid-template-columns:repeat(6,minmax(120px,1fr)) auto;gap:10px;align-items:end;padding:14px;border:1px solid var(--line);border-radius:6px;background:#fff}
.reports-toolbar label{display:grid;gap:7px;font-size:11px;font-weight:900;color:#35413e}
.reports-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.reports-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.reports-kpis article{min-width:0;padding:13px;border:1px solid var(--line);border-radius:6px;background:#f7f9f8}
.reports-kpis small,.reports-kpis strong{display:block}
.reports-kpis small{min-height:24px;color:var(--muted);font-size:10px;font-weight:900}
.reports-kpis strong{font-size:22px;overflow-wrap:anywhere}
.reports-layout{display:grid;grid-template-columns:minmax(280px,.8fr) minmax(500px,1.6fr);gap:14px}
.reports-chart-panel,.reports-table-panel{min-width:0;padding:14px;border:1px solid var(--line);border-radius:6px;background:#fff}
.reports-chart-panel h3,.reports-table-panel h2{margin:0 0 10px;font-size:14px}
.report-bar{display:grid;grid-template-columns:minmax(105px,.9fr) minmax(120px,1.5fr) 54px;gap:9px;align-items:center;margin-bottom:9px;font-size:11px}
.report-bar span{overflow-wrap:anywhere}
.report-bar i{display:block;height:12px;border-radius:999px;background:linear-gradient(90deg,var(--forest),#2f80ed)}
.report-bar b{text-align:left}
body.dark-mode .reports-toolbar,body.dark-mode .reports-chart-panel,body.dark-mode .reports-table-panel{background:#0f221e}
body.dark-mode .reports-kpis article{background:#102923}
body.dark-mode .reports-toolbar label{color:var(--ink)}
.security-center{display:grid;gap:14px}
.security-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end;padding:14px;border:1px solid var(--line);border-radius:6px;background:#fff}
.security-checks{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.security-checks article{min-width:0;padding:14px;border:1px solid var(--line);border-radius:6px;background:#f7f9f8;border-right:4px solid var(--forest)}
.security-checks article.failed{border-right-color:var(--danger);background:#fff5f4}
.security-checks small,.security-checks strong,.security-checks p{display:block}
.security-checks small{min-height:24px;color:var(--muted);font-size:10px;font-weight:900}
.security-checks strong{font-size:20px}
.security-checks p{margin:7px 0 0;color:var(--muted);font-size:11px;line-height:1.5}
.security-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.security-grid section{min-width:0;padding:14px;border:1px solid var(--line);border-radius:6px;background:#fff}
.security-grid h3{margin:0 0 10px;font-size:13px}
.security-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 0;border-top:1px solid #edf1ef;font-size:11px}
.security-row:first-child{border-top:0}
.security-row strong,.security-row span{display:block}
.security-row span{color:var(--muted)}
body.dark-mode .security-actions,body.dark-mode .security-grid section{background:#0f221e}
body.dark-mode .security-checks article{background:#102923}
body.dark-mode .security-checks article.failed{background:#241514}
.mobile-only{display:none}
.mobile-side-head{align-items:center;justify-content:space-between}
@media(max-width:1250px){.stats-grid,.stats-grid.advanced{grid-template-columns:repeat(3,1fr)}.dashboard-toolbar,.account-filter-grid,.task-analytics,.financial-summary,.finance-reports,.quality-risk-toolbar,.quality-risk-summary,.supervision-toolbar,.supervision-summary,.training-toolbar,.reports-toolbar,.reports-kpis,.security-checks,.security-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.dashboard-charts,.quality-risk-grid,.supervision-grid,.reports-layout{grid-template-columns:repeat(2,minmax(0,1fr))}.training-layout{grid-template-columns:1fr 1fr}.training-details{grid-column:1/-1}.chart-panel.wide-chart{grid-column:span 2}.alerts-list{grid-template-columns:repeat(2,minmax(0,1fr))}.risk-row,.supervision-row{grid-template-columns:1fr 1fr}.risk-row button{justify-self:start}}
@media(max-width:820px){
  .mobile-only{display:grid}.topbar{padding:0 9px}.top-title small,.identity,.accountButton{display:none}
  .top-title strong{max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px}
  .app-layout{display:block}.sidebar{position:fixed;top:0;right:0;z-index:60;width:285px;height:100vh;transform:translateX(100%);transition:transform .2s}
  .sidebar.open{transform:none}.overlay{position:fixed;inset:0;z-index:50;border:0;background:rgba(0,0,0,.35)}
  .content{padding:18px 11px}.page-head{align-items:start}.head-actions{width:100%}.search-input{flex:1;width:auto}
  .worker-ops-toolbar,.worker-platform-grid,.dashboard-toolbar,.dashboard-charts,.alerts-list,.account-filter-grid,.task-analytics,.financial-summary,.finance-reports,.quality-risk-toolbar,.quality-risk-summary,.quality-risk-grid,.risk-row,.supervision-toolbar,.supervision-summary,.supervision-grid,.supervision-row,.training-toolbar,.training-layout,.training-summary,.training-detail-grid,.reports-toolbar,.reports-kpis,.reports-layout,.report-bar,.security-checks,.security-grid{grid-template-columns:1fr}.worker-ops-stats{grid-template-columns:1fr 1fr}
  .bulk-actions{display:grid}.bulk-actions strong{margin:0}.bulk-actions select{width:100%}
  .chart-panel.wide-chart{grid-column:span 1}.dashboard-actions{justify-content:stretch}.dashboard-actions .button{flex:1}.bar-row,.week-row{grid-template-columns:1fr;gap:6px}
  .worker-platform-card>header{align-items:start;display:grid}
  .inline-account-row{grid-template-columns:1fr}
  .task-row{grid-template-columns:1fr auto}.task-row>*:nth-child(2),.task-row>*:nth-child(3){grid-column:1/-1}
}
@media(max-width:560px){
  .login-view{display:block;width:100%;overflow:hidden}.login-context{display:none}.login-panel{width:100%;min-height:100vh;padding:28px 20px}
  .page-head{display:grid}.stats-grid,.stats-grid.advanced{grid-template-columns:1fr 1fr}.form-grid{grid-template-columns:1fr}.form-grid .full{grid-column:auto}
}
@media(max-width:380px){.stats-grid,.stats-grid.advanced{grid-template-columns:1fr}}

/* V24 UI/UX layer */
:root{
  --surface:#ffffff;
  --surface-soft:#f7faf9;
  --accent:#0f766e;
  --accent-2:#2563eb;
  --accent-3:#d97706;
  --success:#0f8a5f;
  --radius:8px;
  --focus:0 0 0 3px rgba(15,118,110,.16);
}

body{
  background:linear-gradient(180deg,rgba(255,255,255,.88),rgba(242,245,243,.96) 260px),var(--canvas);
}

body.dark-mode{
  --surface:#0d211d;
  --surface-soft:#102923;
  --accent:#35bda8;
  --accent-2:#60a5fa;
  --accent-3:#f5b544;
  --success:#43d18e;
  background:linear-gradient(180deg,rgba(18,45,39,.9),rgba(7,21,18,.98) 280px),var(--canvas);
}

body,.topbar,.sidebar,.panel,.stat,.nav-button,.button,.small-button,.icon-button,input,select,textarea,tr,.badge{
  transition:background-color .18s ease,border-color .18s ease,color .18s ease,box-shadow .18s ease,transform .18s ease;
}

.topbar{
  height:70px;
  background:rgba(255,255,255,.88);
  backdrop-filter:blur(16px);
  box-shadow:0 10px 28px rgba(15,55,48,.06);
}

body.dark-mode .topbar{background:rgba(13,33,29,.86)}
.top-logo{width:88px;border-radius:6px}
.top-title strong{font-size:14px;line-height:1.3}
.top-title small{font-size:11px}

.top-select{
  width:66px;
  min-height:36px;
  border-radius:6px;
  padding:7px 8px;
  font-size:11px;
  font-weight:900;
}

.notification-trigger{position:relative;color:var(--accent)}
.notification-trigger b{
  position:absolute;
  top:3px;
  right:2px;
  min-width:18px;
  height:18px;
  display:grid;
  place-items:center;
  border:2px solid var(--surface);
  border-radius:999px;
  background:var(--danger);
  color:#fff;
  font-size:9px;
  line-height:1;
}

body.ltr .notification-trigger b{right:auto;left:2px}
.icon-button{border-radius:6px}
.icon-button:hover,.small-button:hover,.button.secondary:hover{background:var(--surface-soft);box-shadow:0 8px 18px rgba(15,55,48,.08)}
.button.primary{background:linear-gradient(135deg,var(--accent),#0b5f56);box-shadow:0 10px 22px rgba(15,118,110,.18)}
.button.primary:hover{transform:translateY(-1px);box-shadow:0 14px 26px rgba(15,118,110,.24)}

.app-layout{grid-template-columns:260px minmax(0,1fr)}
.sidebar{
  top:70px;
  height:calc(100vh - 70px);
  padding:16px 12px;
  background:rgba(255,255,255,.86);
  backdrop-filter:blur(14px);
}
body.dark-mode .sidebar{background:rgba(13,33,29,.9)}

.role-card{
  border:1px solid rgba(15,118,110,.15);
  background:linear-gradient(135deg,rgba(15,118,110,.12),rgba(37,99,235,.08));
}

.nav-group-label{margin-top:18px;color:var(--muted);text-transform:uppercase}
.nav-button{
  min-height:42px;
  gap:8px;
  border:1px solid transparent;
  border-radius:7px;
  color:var(--ink);
  opacity:.78;
}
.nav-button:hover{opacity:1;border-color:var(--line);background:var(--surface-soft);transform:translateX(-2px)}
body.ltr .nav-button:hover{transform:translateX(2px)}
.nav-button.active{opacity:1;background:linear-gradient(135deg,var(--accent),#115e59);color:#fff;box-shadow:0 10px 22px rgba(15,118,110,.2)}

.content{padding:30px}
.view{animation:v24Fade .2s ease both}
@keyframes v24Fade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.page-head{align-items:center}
.page-head h1{font-size:clamp(25px,2.5vw,36px);letter-spacing:0}

.panel,.stat{border-radius:var(--radius);background:var(--surface);box-shadow:0 14px 34px rgba(21,32,30,.07)}
body.dark-mode .panel,body.dark-mode .stat{background:var(--surface);box-shadow:0 16px 34px rgba(0,0,0,.22)}
.stat{position:relative;border-color:rgba(15,118,110,.13)}
.stat:hover{transform:translateY(-2px);box-shadow:0 18px 38px rgba(21,32,30,.1)}
.kpi-card::before{height:3px;background:linear-gradient(90deg,var(--accent),var(--accent-2),var(--accent-3))}

.head-actions{flex-wrap:wrap;justify-content:flex-end}
.table-meta{
  min-height:34px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid var(--line);
  border-radius:6px;
  padding:0 10px;
  background:var(--surface-soft);
  color:var(--muted);
  font-size:11px;
  font-weight:900;
}

.table-wrap{max-height:68vh;border-radius:var(--radius)}
table{border-collapse:separate;border-spacing:0}
th{
  top:0;
  z-index:2;
  background:var(--surface-soft);
  color:var(--muted);
  border-bottom:1px solid var(--line);
  text-transform:none;
}
td{border-top:1px solid rgba(220,228,224,.72)}
tbody tr:nth-child(even){background:rgba(15,118,110,.025)}
tbody tr:hover{background:rgba(37,99,235,.055)}
body.dark-mode tbody tr:nth-child(even){background:rgba(255,255,255,.018)}
body.dark-mode tbody tr:hover{background:rgba(96,165,250,.08)}
body.compact-tables td,body.compact-tables th{padding:8px 10px}
body.compact-tables table{font-size:11px}

.badge{
  border:1px solid rgba(15,138,95,.18);
  border-radius:999px;
  background:rgba(15,138,95,.12);
  color:var(--success);
}
.badge.info{border-color:rgba(37,99,235,.18);background:rgba(37,99,235,.12);color:var(--accent-2)}
.badge.warning{border-color:rgba(217,119,6,.22);background:rgba(217,119,6,.13);color:var(--accent-3)}
.badge.danger{border-color:rgba(180,35,24,.18);background:rgba(180,35,24,.12);color:var(--danger)}

.dashboard-toolbar,.resource-filters{border-color:rgba(15,118,110,.14)}
input:focus,select:focus,textarea:focus,.icon-button:focus-visible,.button:focus-visible,.small-button:focus-visible{outline:none;box-shadow:var(--focus)}

.notification-panel{width:min(620px,calc(100vw - 24px))}
.notification-list{display:grid;gap:10px;max-height:58vh;overflow:auto}
.notification-item{
  display:grid;
  gap:8px;
  border:1px solid var(--line);
  border-radius:8px;
  padding:12px;
  background:var(--surface-soft);
}
.notification-item.unread{border-color:rgba(37,99,235,.3);box-shadow:inset 4px 0 0 var(--accent-2)}
body.ltr .notification-item.unread{box-shadow:inset -4px 0 0 var(--accent-2)}
.notification-item header,.notification-item footer{display:flex;align-items:center;justify-content:space-between;gap:10px}
.notification-item p{margin:0;color:var(--muted);line-height:1.7;font-size:12px}
.notification-item small{color:var(--muted);font-size:10px}

body.ltr{direction:ltr;text-align:left}
body.ltr .top-actions{margin-right:0;margin-left:auto}
body.ltr .sidebar{border-left:0;border-right:1px solid var(--line)}
body.ltr .nav-button,body.ltr th,body.ltr td{text-align:left}
body.ltr .identity{text-align:right}
body.ltr .flash{left:auto;right:22px}
body.ltr .alert-card,body.ltr .quality-alert{border-right-width:1px;border-left-width:4px}

@media(max-width:1100px){
  .stats-grid.advanced{grid-template-columns:repeat(2,minmax(0,1fr))}
  .dashboard-toolbar{grid-template-columns:repeat(2,minmax(140px,1fr))}
  .dashboard-actions{justify-content:flex-start}
}

@media(max-width:900px){
  .topbar{height:auto;min-height:70px;flex-wrap:wrap;padding:10px 14px}
  .top-actions{width:100%;margin:0;justify-content:flex-start;order:4}
  body.ltr .top-actions{margin:0}
  .sidebar{top:70px;height:calc(100vh - 70px)}
  body.ltr .sidebar{inset:70px auto 0 0;transform:translateX(-105%)}
  body.ltr .sidebar.open{transform:none}
  .content{padding:18px 14px}
  .page-head{align-items:start}
  .head-actions{justify-content:stretch}
  .head-actions .button,.head-actions .table-meta{flex:1 1 auto}
  .table-wrap{max-height:none}
}

@media(max-width:640px){
  .stats-grid.advanced,.stats-grid{grid-template-columns:1fr}
  .dashboard-toolbar{grid-template-columns:1fr}
  table{min-width:0}
  thead{display:none}
  tbody,tr,td{display:block;width:100%}
  tr{margin:10px;border:1px solid var(--line);border-radius:8px;overflow:hidden;background:var(--surface)}
  td{
    max-width:none;
    display:grid;
    grid-template-columns:116px minmax(0,1fr);
    gap:10px;
    border-top:1px solid var(--line);
  }
  td::before{content:attr(data-label);color:var(--muted);font-size:10px;font-weight:900}
  td:first-child{border-top:0}
  .row-actions{justify-content:flex-start}
}
/* V27 Gen Z 3D visual refresh */
:root{
  --ink:#15201e;
  --forest:#08a88a;
  --forest-2:#087b71;
  --mint:#dffcf3;
  --canvas:#f7f8fd;
  --line:#dce2eb;
  --muted:#667085;
  --danger:#d92d20;
  --amber:#f79009;
  --blue:#2563eb;
  --white:#fff;
  --pink:#ff4f87;
  --lime:#b7f34a;
  --sun:#ffd23f;
  --violet:#8057ff;
  --cyan:#26d9d0;
  --panel-shadow:0 22px 0 rgba(18,32,43,.05),0 30px 70px rgba(22,31,55,.12);
  --button-shadow:0 7px 0 #083d38,0 16px 28px rgba(8,61,56,.22);
  --button-shadow-soft:0 6px 0 #cad4e2,0 14px 26px rgba(42,52,74,.15);
  --shadow:var(--panel-shadow);
}

body{
  background:
    linear-gradient(135deg,rgba(255,210,63,.13),transparent 26%),
    linear-gradient(225deg,rgba(38,217,208,.14),transparent 28%),
    linear-gradient(180deg,#fbfcff 0%,var(--canvas) 52%,#eefaf6 100%);
}

body::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background-image:
    linear-gradient(90deg,rgba(8,168,138,.08) 1px,transparent 1px),
    linear-gradient(0deg,rgba(255,79,135,.06) 1px,transparent 1px);
  background-size:34px 34px;
  mask-image:linear-gradient(to bottom,rgba(0,0,0,.82),rgba(0,0,0,.1));
}

body.dark-mode{
  --ink:#f6fbff;
  --forest:#19d3b3;
  --forest-2:#7af5de;
  --mint:#11342e;
  --canvas:#07110f;
  --line:#25443f;
  --muted:#a9bbb7;
  --white:#0c1b18;
  --panel-shadow:0 8px 0 rgba(0,0,0,.38),0 28px 62px rgba(0,0,0,.44);
  --button-shadow:0 7px 0 #052925,0 18px 30px rgba(0,0,0,.38);
  --button-shadow-soft:0 6px 0 #20352f,0 16px 28px rgba(0,0,0,.34);
}

.login-view{
  background:linear-gradient(145deg,#fff 0%,#f8fbff 44%,#eefcf8 100%);
}

.login-panel{
  position:relative;
  isolation:isolate;
  background:
    linear-gradient(180deg,rgba(255,255,255,.95),rgba(255,255,255,.88)),
    repeating-linear-gradient(-45deg,rgba(8,168,138,.06) 0 10px,transparent 10px 22px);
}

.login-panel::after{
  content:"";
  position:absolute;
  inset:auto 9% 8% auto;
  width:160px;
  height:160px;
  z-index:-1;
  background:linear-gradient(135deg,var(--sun),var(--pink));
  clip-path:polygon(50% 0,62% 34%,98% 35%,69% 56%,79% 91%,50% 70%,21% 91%,31% 56%,2% 35%,38% 34%);
  opacity:.14;
  transform:rotate(-10deg);
}

.login-context{
  position:relative;
  overflow:hidden;
  background:linear-gradient(135deg,rgba(8,168,138,.96),rgba(18,64,58,.98) 46%,rgba(255,79,135,.88) 150%);
}

.login-context::before{
  content:"";
  position:absolute;
  inset:28px;
  border:1px solid rgba(255,255,255,.18);
  border-radius:8px;
  pointer-events:none;
}

.login-context::after{
  content:"AITEAM";
  position:absolute;
  inset:auto -18px 48px auto;
  color:rgba(255,255,255,.075);
  font-size:120px;
  font-weight:900;
  letter-spacing:0;
  transform:rotate(-8deg);
}

.login-logo,.top-logo{filter:drop-shadow(0 10px 16px rgba(20,45,42,.18))}
.eyebrow{color:var(--forest);text-transform:uppercase}
.login-panel h1,.page-head h1,.login-context h2{letter-spacing:0}

.panel,.stat,.worker-platform-card,.quality-risk-panel,.timeline-row,.inline-accounts,.finance-reports section,.two-factor-box,.account-summary,.role-card{
  border-color:rgba(130,151,174,.32);
  border-radius:8px;
  background:rgba(255,255,255,.86);
  box-shadow:var(--panel-shadow);
  backdrop-filter:blur(12px);
}

body.dark-mode .panel,body.dark-mode .stat,body.dark-mode .worker-platform-card,body.dark-mode .quality-risk-panel,body.dark-mode .timeline-row,body.dark-mode .inline-accounts,body.dark-mode .finance-reports section,body.dark-mode .two-factor-box,body.dark-mode .account-summary,body.dark-mode .role-card{background:rgba(12,27,24,.88)}

.topbar{
  height:72px;
  border-bottom:1px solid rgba(130,151,174,.35);
  background:rgba(255,255,255,.82);
  box-shadow:0 12px 34px rgba(31,45,61,.08);
  backdrop-filter:blur(16px);
}

.sidebar{
  top:72px;
  height:calc(100vh - 72px);
  background:rgba(255,255,255,.78);
  box-shadow:-12px 0 34px rgba(31,45,61,.07);
  backdrop-filter:blur(18px);
}

body.dark-mode .topbar,body.dark-mode .sidebar{background:rgba(8,20,17,.86)}

.nav-button{
  position:relative;
  min-height:42px;
  border:1px solid transparent;
  border-radius:8px;
  transition:transform .16s ease,box-shadow .16s ease,background .16s ease,color .16s ease;
}

.nav-button:hover{
  background:#fff;
  color:#15201e;
  transform:translateY(-2px);
  box-shadow:0 5px 0 #d6e0eb,0 14px 22px rgba(31,45,61,.12);
}

.nav-button.active{
  background:linear-gradient(135deg,var(--forest),#11bea0 52%,#2f80ed);
  color:#fff;
  box-shadow:0 6px 0 #075249,0 16px 28px rgba(8,82,73,.25);
  transform:translateY(-1px);
}

.button,.small-button,.icon-button,.text-button,.link-button{
  position:relative;
  transform:translateY(0);
  transition:transform .14s ease,box-shadow .14s ease,filter .14s ease,background .14s ease,border-color .14s ease;
  will-change:transform;
}

.button{
  min-height:42px;
  border-radius:10px;
  border:1px solid rgba(255,255,255,.38);
  box-shadow:var(--button-shadow-soft);
  background:linear-gradient(180deg,#fff,#eef4f6);
}

.button.primary{
  color:#fff;
  background:linear-gradient(135deg,#08a88a 0%,#12c2a3 48%,#2f80ed 100%);
  box-shadow:var(--button-shadow);
}

.button.secondary{
  border:1px solid rgba(143,160,181,.55);
  background:linear-gradient(180deg,#fff,#f0f4ff);
  color:#17202a;
}

.danger-button,.button.danger-button{
  color:#fff;
  border-color:rgba(255,255,255,.35);
  background:linear-gradient(135deg,#ff4f87,#d92d20);
  box-shadow:0 7px 0 #7a1212,0 16px 28px rgba(217,45,32,.22);
}

.small-button{
  border-radius:8px;
  border:1px solid rgba(143,160,181,.52);
  background:linear-gradient(180deg,#fff,#edf4f8);
  box-shadow:0 4px 0 #cbd5df,0 10px 17px rgba(31,45,61,.12);
}

.small-button.secure{
  color:#fff;
  border-color:rgba(255,255,255,.35);
  background:linear-gradient(135deg,#2563eb,#26d9d0);
  box-shadow:0 4px 0 #164092,0 11px 18px rgba(37,99,235,.18);
}

.small-button.danger{
  color:#fff;
  border-color:rgba(255,255,255,.35);
  background:linear-gradient(135deg,#ff4f87,#d92d20);
  box-shadow:0 4px 0 #8f1414,0 11px 18px rgba(217,45,32,.16);
}

.icon-button{
  border-radius:10px;
  border:1px solid rgba(143,160,181,.35);
  background:linear-gradient(180deg,#fff,#edf3f7);
  box-shadow:0 5px 0 #cad4df,0 12px 19px rgba(31,45,61,.11);
}

.text-button{
  min-height:30px;
  border-radius:8px;
  padding:0 10px;
  background:linear-gradient(180deg,#f9fffd,#e9fff8);
  box-shadow:0 4px 0 #b9e1d7,0 10px 16px rgba(8,168,138,.1);
}

.button:hover,.small-button:hover,.icon-button:hover,.text-button:hover,.nav-button:hover{
  transform:translateY(-3px);
  filter:saturate(1.08);
}

.button:active,.small-button:active,.icon-button:active,.text-button:active,.nav-button:active{
  transform:translateY(3px);
  box-shadow:0 2px 0 rgba(31,45,61,.22),0 5px 10px rgba(31,45,61,.14);
}

body.dark-mode .button.secondary,body.dark-mode .small-button,body.dark-mode .icon-button,body.dark-mode .text-button{
  color:var(--ink);
  background:linear-gradient(180deg,#17352f,#0f2521);
  box-shadow:var(--button-shadow-soft);
}

input,select,textarea{
  border-radius:10px;
  border:1px solid rgba(143,160,181,.48);
  background:linear-gradient(180deg,#fff,#f8fbff);
  box-shadow:inset 0 2px 0 rgba(255,255,255,.8),0 5px 0 rgba(202,213,226,.45);
}

input:focus,select:focus,textarea:focus{
  border-color:var(--forest);
  box-shadow:0 0 0 3px rgba(8,168,138,.16),0 6px 0 rgba(8,168,138,.16);
}

.kpi-card::before{
  height:5px;
  background:linear-gradient(90deg,var(--pink),var(--sun),var(--forest),var(--blue));
}

.stat{position:relative;overflow:hidden}
.stat::after{
  content:"";
  position:absolute;
  inset:auto 14px 12px auto;
  width:42px;
  height:42px;
  background:linear-gradient(135deg,var(--sun),var(--pink));
  clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%);
  opacity:.16;
}

.badge{border-radius:8px;box-shadow:0 3px 0 rgba(8,116,82,.18)}
.badge.warning{box-shadow:0 3px 0 rgba(247,144,9,.2)}
.badge.danger{box-shadow:0 3px 0 rgba(217,45,32,.2)}
.badge.info{box-shadow:0 3px 0 rgba(37,99,235,.18)}
th{background:linear-gradient(180deg,#fff,#eef6f4)}
tr:hover td{background:rgba(8,168,138,.045)}

.flash{
  border-radius:10px;
  background:linear-gradient(135deg,var(--forest),#2f80ed);
  box-shadow:0 7px 0 #075249,0 24px 45px rgba(8,82,73,.25);
}

.flash.bad{
  background:linear-gradient(135deg,#ff4f87,#d92d20);
  box-shadow:0 7px 0 #7a1212,0 24px 45px rgba(217,45,32,.25);
}

dialog{
  border-radius:12px;
  box-shadow:0 10px 0 rgba(31,45,61,.14),0 32px 90px rgba(0,0,0,.28);
}

.task-row,.inline-account-row,.ops-account,.ops-task,.quality-alert,.risk-row,.repeated-row,.trend-row,.session-row,.notification-item{
  transition:transform .14s ease,box-shadow .14s ease,background .14s ease;
}

.task-row:hover,.inline-account-row:hover,.ops-account:hover,.ops-task:hover,.quality-alert:hover,.risk-row:hover,.repeated-row:hover,.trend-row:hover,.session-row:hover,.notification-item:hover{
  transform:translateY(-2px);
}

.version{
  border-top:0;
  border-radius:8px;
  padding:13px 12px;
  background:linear-gradient(135deg,rgba(255,210,63,.24),rgba(8,168,138,.18),rgba(255,79,135,.16));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55);
}

@media(max-width:900px){
  .topbar{height:66px}
  .sidebar{top:66px;height:calc(100vh - 66px)}
  .button,.small-button,.icon-button{box-shadow:0 4px 0 rgba(31,45,61,.16),0 10px 18px rgba(31,45,61,.12)}
}