:root{
  --org:#E8500A;--org-lt:#F26A22;--org-dim:rgba(232,80,10,.1);
  --dark:#1A1A1A;--mid:#3D3D3D;--gray:#6B6B6B;
  --border:#E2E2E2;--bg:#F5F5F3;--white:#FFFFFF;
  --g-bg:#DCFCE7;--g-tx:#16A34A;
  --a-bg:#FEF3C7;--a-tx:#D97706;
  --b-bg:#DBEAFE;--b-tx:#1D4ED8;
  --r-bg:#FEE2E2;--r-tx:#DC2626;
  --p-bg:#F3E8FF;--p-tx:#9333EA; 
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html,body{height:100%;font-family:'Noto Sans KR','Barlow',sans-serif;background:var(--bg);color:var(--dark);font-size:14px;}

/* ── PAGES ── */
.page{display:none;min-height:100vh;}
.page.active{display:flex;flex-direction:column;}

/* ══════════════════ LOGIN ══════════════════ */
#pg-login{background:#EEEDE9;align-items:center;justify-content:center;position:relative;overflow:hidden;}
#pg-login::after{content:'';position:absolute;inset:0;background-image:linear-gradient(rgba(232,80,10,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(232,80,10,.03) 1px,transparent 1px);background-size:36px 36px;pointer-events:none;}
.login-box{background:#fff;width:400px;max-width:92vw;box-shadow:0 8px 40px rgba(0,0,0,.14);position:relative;z-index:1;}
.login-top{height:4px;background:linear-gradient(90deg,var(--org),var(--org-lt));}
.login-inner{padding:40px 36px 36px;}
.login-brand{text-align:center;margin-bottom:32px;}
.login-logo{display:inline-flex;align-items:center;justify-content:center;width:52px;height:52px;background:var(--org);margin-bottom:14px;clip-path:polygon(0 0,78% 0,100% 22%,100% 100%,22% 100%,0 78%);}
.login-logo span{font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:20px;color:#fff;letter-spacing:.05em;}
.login-title{font-family:'Barlow',sans-serif;font-size:22px;font-weight:800;color:var(--dark);letter-spacing:.01em;}
.login-sub{font-size:13px;color:var(--gray);margin-top:5px;}
.lf-group{margin-bottom:16px;}
.lf-label{display:block;font-size:12px;font-weight:600;color:var(--mid);margin-bottom:5px;letter-spacing:.04em;text-transform:uppercase;}
.lf-input{width:100%;border:1.5px solid var(--border);padding:12px 14px;font-family:'Noto Sans KR',sans-serif;font-size:14px;color:var(--dark);outline:none;background:var(--bg);transition:border-color .15s;}
.lf-input:focus{border-color:var(--org);background:#fff;}
.lf-btn{width:100%;padding:14px;background:var(--dark);border:none;color:#fff;font-family:'Barlow',sans-serif;font-size:15px;font-weight:700;letter-spacing:.06em;cursor:pointer;transition:background .15s;margin-top:4px;}
.lf-btn:hover{background:var(--org);}
.lf-btn:disabled{opacity:0.7;cursor:not-allowed;}
.lf-err{display:none;margin-top:12px;padding:10px 14px;background:var(--r-bg);color:var(--r-tx);font-size:13px;text-align:center;}

/* ══════════════════ TOPBAR ══════════════════ */
.topbar{background:#fff;border-bottom:1px solid var(--border);height:54px;display:flex;align-items:center;padding:0 20px;gap:12px;position:sticky;top:0;z-index:100;flex-shrink:0;}
.tb-logo{display:flex;align-items:center;gap:9px;text-decoration:none;}
.tb-icon{width:28px;height:28px;background:var(--org);display:flex;align-items:center;justify-content:center;clip-path:polygon(0 0,78% 0,100% 22%,100% 100%,22% 100%,0 78%);flex-shrink:0;}
.tb-icon span{font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:12px;color:#fff;}
.tb-name{font-family:'Barlow',sans-serif;font-size:15px;font-weight:800;color:var(--dark);letter-spacing:.02em;}
.tb-sep{width:1px;height:26px;background:var(--border);}
.tb-nav{display:flex;gap:0;}
.nav-btn{padding:6px 13px;background:none;border:none;border-bottom:2px solid transparent;font-family:'Barlow',sans-serif;font-size:13px;font-weight:600;letter-spacing:.03em;color:var(--gray);cursor:pointer;transition:all .12s;white-space:nowrap;}
.nav-btn:hover{color:var(--dark);}
.nav-btn.active{color:var(--org);border-bottom-color:var(--org);}
.tb-right{margin-left:auto;display:flex;align-items:center;gap:10px;}
.tb-user{display:flex;align-items:center;gap:7px;font-size:13px;color:var(--mid);}
.tb-avatar{width:26px;height:26px;background:var(--org-dim);border:1.5px solid var(--org);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;color:var(--org);}
.tb-api-dot{width:7px;height:7px;border-radius:50%;background:#9CA3AF;}
.tb-api-dot.ok{background:var(--g-tx);box-shadow:0 0 0 2px rgba(22,163,74,.2);}
.tb-api-dot.err{background:var(--r-tx);}
.tb-btn{padding:5px 11px;border:1px solid var(--border);background:none;font-family:'Barlow',sans-serif;font-size:12px;font-weight:600;color:var(--gray);cursor:pointer;transition:all .12s; border-radius:4px;}
.tb-btn:hover{border-color:var(--org);color:var(--org);}
.tb-btn:disabled{opacity:0.5;cursor:not-allowed;}

/* ══════════════════ VIEWS ══════════════════ */
.view{display:none;flex:1;overflow-y:auto;}
.view.active{display:block;}
.vi{padding:22px 24px;max-width:100%;margin:0 auto;}
.sec-title{font-family:'Barlow',sans-serif;font-size:17px;font-weight:800;color:var(--dark);margin-bottom:16px;display:flex;align-items:center;gap:8px;}
.sec-title::before{content:'';display:inline-block;width:3px;height:17px;background:var(--org);flex-shrink:0;}

/* ══════════════════ METRICS ══════════════════ */
.metrics{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;}
.mc{background:#fff;border:1px solid var(--border);padding:16px 18px;position:relative; transition:transform 0.15s, box-shadow 0.15s;}
.mc.clickable { cursor:pointer; }
.mc.clickable:hover { transform:translateY(-2px); box-shadow:0 4px 12px rgba(0,0,0,0.06); }
.mc::after{content:'';position:absolute;bottom:0;left:0;right:0;height:2px;}
.mc.org::after{background:var(--org);}
.mc.grn::after{background:var(--g-tx);}
.mc.blu::after{background:var(--b-tx);}
.mc.amb::after{background:var(--a-tx);}
.mc.gry::after{background:#9CA3AF;}
.mc-lbl{font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.07em;color:var(--gray);margin-bottom:7px;}
.mc-val{font-family:'Barlow',sans-serif;font-size:28px;font-weight:800;line-height:1;}
.mc-val.org{color:var(--org);}
.mc-val.grn{color:var(--g-tx);}
.mc-val.blu{color:var(--b-tx);}
.mc-val.amb{color:var(--a-tx);}

/* ══════════════════ TABLE ══════════════════ */
.tbl-card{background:#fff;border:1px solid var(--border);}
.tbl-bar{padding:12px 16px;display:flex;align-items:center;gap:10px;border-bottom:1px solid var(--border);flex-wrap:wrap;}
.search-wrap{display:flex;align-items:center;gap:7px;border:1px solid var(--border);padding:7px 11px;background:var(--bg);flex:1;min-width:180px;max-width:260px;}
.search-wrap input{border:none;background:transparent;outline:none;font-size:13px;font-family:'Noto Sans KR',sans-serif;width:100%;}
.fl-sel{border:1px solid var(--border);padding:7px 10px;background:var(--bg);font-size:13px;font-family:'Noto Sans KR',sans-serif;color:var(--mid);outline:none;cursor:pointer;}
.fl-sel:focus{border-color:var(--org);}
.add-btn{margin-left:auto;padding:7px 15px;background:var(--org);border:none;color:#fff;font-family:'Barlow',sans-serif;font-size:13px;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:5px;white-space:nowrap;}
.add-btn:hover{background:#C94008;}
.sum-badge{padding:7px 15px;background:#F8F8F6;border:1px solid var(--border);font-family:'Barlow',sans-serif;font-size:14px;font-weight:700;color:var(--dark);}
.tbl-wrap{overflow-x:auto;}
table.pt{width:100%;border-collapse:collapse;font-size:12px;}
table.pt th{padding:8px 6px;text-align:left;background:#F8F8F6;border-bottom:1.5px solid var(--border);font-family:'Barlow',sans-serif;font-weight:600;font-size:10px;color:var(--gray);letter-spacing:.03em;text-transform:uppercase;white-space:nowrap;cursor:pointer;user-select:none;}
table.pt th:hover{color:var(--org);}
table.pt td{padding:8px 6px;border-bottom:1px solid var(--border);vertical-align:middle;white-space:nowrap;}
table.pt td.wrap-cell{white-space:normal; min-width:150px; line-height:1.3;}
table.pt tr:hover td{background:#FAFAF8;}
.pcode{font-family:'Barlow Condensed',sans-serif;font-size:13px;font-weight:700;color:var(--org);}
.bdg{display:inline-block;padding:3px 7px;font-size:11px;font-weight:600;letter-spacing:.03em;font-family:'Barlow',sans-serif;border-radius:3px;}
.bdg-g{background:var(--g-bg);color:var(--g-tx);}
.bdg-a{background:var(--a-bg);color:var(--a-tx);}
.bdg-b{background:var(--b-bg);color:var(--b-tx);}
.bdg-r{background:var(--r-bg);color:var(--r-tx);}
.bdg-o{background:var(--org-dim);color:var(--org);}
.bdg-p{background:var(--p-bg);color:var(--p-tx);}
.bdg-gray{background:#F3F4F6;color:#6B7280;}

/* Progress Bar */
.prog-wrap{display:flex;align-items:center;gap:10px;min-width:130px;}
.prog-bar{flex:1;height:8px;background:var(--border);border-radius:4px;overflow:hidden;position:relative;}
.prog-fill{height:100%;position:absolute;left:0;top:0;transition:width 0.3s;}
.prog-expected{position:absolute;height:100%;background:#D1D5DB;top:0;left:0;z-index:1;border-right:2px solid rgba(0,0,0,0.1);}
.prog-texts{display:flex;flex-direction:column;min-width:48px;text-align:right;}
.prog-exp-txt{font-size:10px;color:var(--gray);font-family:'Barlow',sans-serif;font-weight:600;}
.prog-act-txt{font-size:12px;font-weight:800;font-family:'Barlow',sans-serif;line-height:1.1;}

.act-btn{padding:4px 9px;border:1px solid var(--border);background:none;font-size:11px;font-family:'Barlow',sans-serif;font-weight:600;cursor:pointer;color:var(--gray);border-radius:3px;}
.act-btn:hover{border-color:var(--org);color:var(--org);}

/* ══════════════════ EVALUATORS ══════════════════ */
.eval-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:16px;}
.eval-card{background:#fff;border:1px solid var(--border);padding:20px;position:relative;overflow:hidden;}
.eval-name-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:4px;}
.eval-name{font-family:'Barlow',sans-serif;font-size:18px;font-weight:800;}
.eval-warn{font-size:11px;background:var(--r-bg);color:var(--r-tx);padding:2px 6px;border-radius:4px;font-weight:600;display:flex;align-items:center;gap:4px;}
.eval-role{font-size:12px;color:var(--gray);margin-bottom:14px;}
.eval-stats{display:flex;gap:18px;margin-bottom:12px;}
.es-val{font-family:'Barlow',sans-serif;font-size:22px;font-weight:800;line-height:1;}
.es-lbl{font-size:9px;text-transform:uppercase;letter-spacing:.06em;color:var(--gray);margin-top:3px;}
.ec-chart-wrap{margin-bottom:14px;}
.ec-chart-bar{width:100%;height:8px;background:var(--border);border-radius:4px;display:flex;overflow:hidden;margin-bottom:4px;}
.ec-c-done{background:var(--b-tx);height:100%;}
.ec-c-prog{background:var(--g-tx);height:100%;}
.ec-c-delay{background:var(--r-tx);height:100%;}
.ec-chart-leg{display:flex;gap:10px;font-size:10px;color:var(--gray);}
.ec-leg-item{display:flex;align-items:center;gap:4px;}
.ec-dot{width:8px;height:8px;border-radius:50%;}
.eval-projs{border-top:1px solid var(--border);padding-top:12px;display:flex;flex-direction:column;gap:10px;}
.ep-row{display:flex;align-items:flex-start;justify-content:space-between;font-size:12px;}
.ep-code{font-family:'Barlow Condensed',sans-serif;font-size:12px;font-weight:700;color:var(--org); margin-top:2px;}

/* ══════════════════ SCHEDULER ══════════════════ */
.sch-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;background:#fff;padding:12px 16px;border:1px solid var(--border);}
.sch-nav{display:flex;gap:8px;}
.sch-nav button{padding:6px 12px;font-size:12px;}
.sch-title{font-family:'Barlow',sans-serif;font-size:16px;font-weight:700;color:var(--dark);}
.sch-grid{border:1px solid var(--border);background:#fff;border-radius:4px;overflow-x:auto; margin-bottom:40px;}
.sch-row{display:flex;border-bottom:1px solid var(--border);min-width:800px;}
.sch-row:last-child{border-bottom:none;}
.sch-head-row{background:#F8F8F6;}
.sch-col-ev{width:160px;padding:12px;border-right:1px solid var(--border);flex-shrink:0;display:flex;align-items:center;font-weight:700;font-size:13px;}
.sch-head-row .sch-col-ev{font-size:11px;color:var(--gray);text-transform:uppercase;letter-spacing:0.05em;}
.sch-col-days{flex:1;display:grid;grid-template-columns:repeat(7,1fr);position:relative;}
.sch-day-cell{border-right:1px dashed var(--border);padding:8px;min-height:60px;}
.sch-day-cell:last-child{border-right:none;}
.sch-day-header{text-align:center;padding:10px 0;border-right:1px solid var(--border);font-family:'Barlow',sans-serif;font-size:12px;font-weight:600;}
.sch-day-header:last-child{border-right:none;}
.sch-day-header.today{color:var(--org);font-weight:800;background:var(--org-dim);}
.sch-bar-container{position:absolute;top:0;left:0;right:0;bottom:0;pointer-events:none;padding-top:10px;}
.sch-bar{position:absolute;height:22px;border-radius:3px;display:flex;align-items:center;padding:0 8px;color:#fff;font-size:11px;font-family:'Barlow',sans-serif;font-weight:600;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;pointer-events:auto;cursor:pointer;box-shadow:0 2px 4px rgba(0,0,0,0.1);transition:filter 0.15s;}
.sch-bar:hover{filter:brightness(1.15);}

.month-grid { border: 1px solid var(--border); background: #fff; border-radius: 4px; display: flex; flex-direction: column; overflow:hidden;}
.month-row { display: flex; position: relative; border-bottom: 1px solid var(--border); }
.month-row:last-child { border-bottom: none; }
.month-head-row { background: #F8F8F6; font-family: 'Barlow', sans-serif; font-size: 12px; font-weight: 600; }
.month-day-header { flex: 1; text-align: center; padding: 10px 0; border-right: 1px solid var(--border); color:var(--gray);}
.month-day-header:last-child { border-right: none; }
.month-bg-grid { display: flex; width: 100%; position: absolute; top: 0; bottom: 0; left: 0; pointer-events: none; }
.month-cell { flex: 1; border-right: 1px solid var(--border); padding: 6px; box-sizing: border-box; display:flex; flex-direction:column; align-items:flex-end; }
.month-cell:last-child { border-right: none; }
.month-cell.other-month { background: #fafafa; }
.month-cell.today { background: var(--org-dim); }
.month-date-num { font-size: 11.5px; font-family: 'Barlow', sans-serif; font-weight: 600; color: var(--gray); width: 22px; height: 22px; display:flex; align-items:center; justify-content:center; border-radius:50%; }
.month-date-num.today-num { background: var(--org); color: #fff; }
.month-bar-container { position: absolute; top: 0; left: 0; right: 0; bottom: 0; pointer-events: none; overflow: hidden; }
.month-bar { position: absolute; height: 22px; display: flex; align-items: center; padding: 0 6px; color: #fff; font-size: 11px; font-family: 'Barlow', sans-serif; font-weight: 600; overflow: hidden; pointer-events: auto; cursor: pointer; box-shadow: 0 1px 3px rgba(0,0,0,0.15); transition: filter 0.15s; }
.month-bar:hover { filter: brightness(1.15); z-index:10; }
.m-bar-txt { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: flex; align-items: center; }

/* ══════════════════ STATISTICS DASHBOARD ══════════════════ */
.stat-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; margin-bottom: 20px; }
.stat-card { background: #fff; border: 1px solid var(--border); padding: 20px; border-radius: 4px; box-shadow: 0 2px 10px rgba(0,0,0,0.02); }
.stat-card.full { grid-column: span 2; }
.stat-header { font-family: 'Barlow', sans-serif; font-size: 16px; font-weight: 700; color: var(--dark); margin-bottom: 16px; display: flex; align-items: center; gap: 8px; }
.chart-container { position: relative; width: 100%; }

/* ══════════════════ AI RECOMMENDATION UI ══════════════════ */
.ai-recommend-wrap { margin-top: 8px; border: 1px solid var(--g-tx); border-radius: 4px; overflow: hidden; display: none; background: #fff;}
.ai-recommend-wrap.show { display: block; animation: slideDown 0.2s ease-out; }
.ai-recommend-header { background: var(--g-bg); padding: 8px 12px; font-size: 12px; font-weight: 600; color: var(--g-tx); display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid rgba(22, 163, 74, 0.2); }
.ai-recommend-list { padding: 0; margin: 0; list-style: none; }
.ai-rec-item { padding: 10px 12px; border-bottom: 1px solid var(--border); display: flex; align-items: center; justify-content: space-between; font-size: 12px; transition: background 0.15s; }
.ai-rec-item:last-child { border-bottom: none; }
.ai-rec-item:hover { background: #FAFAF8; }
.ai-rec-info { flex: 1; }
.ai-rec-name { font-weight: 700; margin-right: 8px; font-size: 13px;}
.ai-rec-score { font-family: 'Barlow', sans-serif; font-weight: 700; color: var(--g-tx); }
.ai-rec-tags { margin-top: 4px; display: flex; gap: 4px; flex-wrap: wrap; }
.ai-tag { font-size: 10px; padding: 2px 6px; border-radius: 10px; background: #F3F4F6; color: var(--gray); font-weight: 500; }
.ai-tag.good { background: var(--g-bg); color: var(--g-tx); }
.ai-tag.warn { background: var(--r-bg); color: var(--r-tx); }
.ai-sel-btn { padding: 4px 10px; background: var(--dark); color: #fff; border: none; border-radius: 3px; font-size: 11px; font-weight: 600; cursor: pointer; transition: background 0.15s; }
.ai-sel-btn:hover { background: var(--g-tx); }
.ai-trigger-btn { background: none; border: 1px solid var(--g-tx); color: var(--g-tx); font-size: 11px; padding: 2px 6px; border-radius: 3px; cursor: pointer; margin-left: 6px; font-weight: 600; transition: all 0.15s;}
.ai-trigger-btn:hover { background: var(--g-bg); }
@keyframes slideDown { from { opacity: 0; transform: translateY(-5px); } to { opacity: 1; transform: translateY(0); } }

/* ══════════════════ MODAL ══════════════════ */
.mbk{position:fixed;inset:0;background:rgba(0,0,0,.48);z-index:200;display:none;align-items:center;justify-content:center;}
.mbk.open{display:flex;}
.mdl{background:#fff;width:600px;max-width:95vw;max-height:92vh;overflow-y:auto;box-shadow:0 20px 60px rgba(0,0,0,.22);}
.mdl-head{padding:18px 22px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;background:#fff;z-index:1;}
.mdl-head::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:var(--org);}
.mdl-title{font-family:'Barlow',sans-serif;font-size:15px;font-weight:800;}
.mdl-x{background:none;border:none;font-size:20px;cursor:pointer;color:var(--gray);line-height:1;padding:0 3px;}
.mdl-body{padding:22px;}
.mdl-foot{padding:14px 22px;border-top:1px solid var(--border);display:flex;gap:8px;justify-content:flex-end;}
.mf{display:flex;flex-direction:column;gap:4px;margin-bottom:14px;}
.ml{font-size:11px;font-weight:600;color:var(--mid);text-transform:uppercase;letter-spacing:.04em;display:flex;align-items:center;}
.lbl-btn{background:none;border:none;font-size:12px;cursor:pointer;color:var(--gray);margin-left:6px;padding:2px;display:inline-flex;align-items:center;justify-content:center;}
.lbl-btn:hover{color:var(--org);transform:scale(1.1);}
.mi,.ms,.mta{border:1.5px solid var(--border);padding:9px 11px;font-family:'Noto Sans KR',sans-serif;font-size:13px;color:var(--dark);outline:none;background:#fff;width:100%;}
.mi:focus,.ms:focus,.mta:focus{border-color:var(--org);}
.mta{resize:vertical;min-height:76px;}
.m2{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
.btn-del{padding:9px 18px;border:1px solid var(--r-tx);background:none;color:var(--r-tx);font-family:'Barlow',sans-serif;font-size:13px;font-weight:600;cursor:pointer;margin-right:auto;}
.btn-cancel{padding:9px 18px;border:1px solid var(--border);background:none;font-family:'Barlow',sans-serif;font-size:13px;font-weight:600;cursor:pointer;color:var(--gray);}
.btn-save{padding:9px 22px;border:none;background:var(--org);color:#fff;font-family:'Barlow',sans-serif;font-size:13px;font-weight:600;cursor:pointer;}
.btn-save:disabled{background:#C0BDB8;cursor:not-allowed;}

/* Manager List */
.em-list{border:1px solid var(--border);max-height:300px;overflow-y:auto;margin-bottom:14px;}
.em-item{display:flex;align-items:center;justify-content:space-between;padding:10px 14px;border-bottom:1px solid var(--border);}
.em-item:last-child{border-bottom:none;}
.color-picker { width:26px; height:26px; padding:0; border:1px solid var(--border); border-radius:4px; cursor:pointer; background:none; }

/* ══════════════════ LOADING & TOAST ══════════════════ */
.ldo{position:fixed;inset:0;background:rgba(245,245,243,.8);z-index:300;display:none;align-items:center;justify-content:center;flex-direction:column;gap:14px;}
.ldo.on{display:flex;}
.ld-spin{width:36px;height:36px;border:3px solid var(--border);border-top-color:var(--org);border-radius:50%;animation:spin .7s linear infinite;}
@keyframes spin{to{transform:rotate(360deg)}}
.ld-txt{font-family:'Barlow',sans-serif;font-size:13px;font-weight:600;color:var(--org);}
.tw{position:fixed;bottom:22px;right:22px;z-index:400;display:flex;flex-direction:column;gap:7px;}
.toast{padding:10px 16px;background:var(--dark);color:#fff;font-size:13px;font-family:'Barlow',sans-serif;font-weight:500;display:flex;align-items:center;gap:8px;box-shadow:0 4px 20px rgba(0,0,0,.22);animation:tin .2s ease;}
.toast.ok{border-left:3px solid var(--g-tx);}
.toast.ng{border-left:3px solid var(--r-tx);}
@keyframes tin{from{opacity:0;transform:translateX(14px)}to{opacity:1;transform:translateX(0)}}

/* ══════════════════ RESPONSIVE (MOBILE OPTIMIZATION) ══════════════════ */
@media (max-width: 1024px) {
  .metrics { grid-template-columns: repeat(3, 1fr); }
  .stat-grid { grid-template-columns: 1fr; }
  .stat-card.full { grid-column: auto; }
}

@media (max-width: 768px) {
  .topbar { height: auto; padding: 10px; flex-direction: column; align-items: flex-start; gap: 8px; }
  .tb-nav { width: 100%; overflow-x: auto; padding-bottom: 5px; -webkit-overflow-scrolling: touch; display: flex; }
  .tb-right { width: 100%; justify-content: space-between; margin-left: 0; padding-top: 5px; border-top: 1px solid var(--border); }
  .tb-sep { display: none; }
  
  .vi { padding: 15px; }
  .metrics { grid-template-columns: repeat(2, 1fr); gap: 8px; }
  .mc-val { font-size: 22px; }
  
  .tbl-bar { flex-direction: column; align-items: stretch; }
  .search-wrap { max-width: none; width: 100%; }
  .add-btn { justify-content: center; width: 100%; margin-left: 0; margin-top: 5px; }
  
  .eval-grid { grid-template-columns: 1fr; }
  
  .mdl { width: 95vw; }
  .m2 { grid-template-columns: 1fr; gap: 0; }
  
  .sch-header { flex-direction: column; gap: 10px; align-items: stretch; text-align: center; }
  .sch-nav { justify-content: center; }
  
  /* Table Responsiveness */
  .tbl-wrap { border: none; }
  table.pt { display: block; overflow-x: auto; }
}

@media (max-width: 480px) {
  .metrics { grid-template-columns: 1fr; }
  .login-inner { padding: 30px 20px; }
  .tb-name { font-size: 13px; }
  .nav-btn { padding: 6px 10px; font-size: 12px; }
}