/* ── 다크 모드 (기본) ── */
:root{
  --bg:#0a0e1a;--bg2:#111827;--bg3:#1a2235;--surface:#1e2d45;--surface2:#243352;
  --border:#2a3a55;--accent:#3b82f6;--accent2:#06b6d4;--accent3:#8b5cf6;
  --success:#10b981;--warning:#f59e0b;--danger:#ef4444;
  --text:#e2e8f0;--text2:#94a3b8;--text3:#64748b;
  --radius:12px;--shadow:0 4px 24px rgba(0,0,0,0.4);
}
/* ── 라이트 모드 ── */
body.light-mode{
  --bg:#f0f4f8;--bg2:#ffffff;--bg3:#f8fafc;--surface:#eef2f7;--surface2:#e2e8f0;
  --border:#cbd5e1;--accent:#2563eb;--accent2:#0891b2;--accent3:#7c3aed;
  --success:#059669;--warning:#d97706;--danger:#dc2626;
  --text:#1e293b;--text2:#475569;--text3:#94a3b8;
  --shadow:0 4px 24px rgba(0,0,0,0.08);
}
body.light-mode .login-box{box-shadow:0 8px 40px rgba(0,0,0,.12);}
body.light-mode .loading-spinner{border-color:#cbd5e1;border-top-color:var(--accent);}
body.light-mode .graph-container{background:#f8fafc;}
body.light-mode .rule-editor{background:#f1f5f9;color:#1e293b;}
body.light-mode .clock-time{color:var(--accent);}
body.light-mode .stat-num{} /* 상속됨 */
body.light-mode th{background:#f1f5f9;}
body.light-mode tr:hover td{background:rgba(0,0,0,.02);}
body.light-mode .msg.received .msg-bubble{background:#e2e8f0;}
body.light-mode .msg.sent .msg-bubble{background:var(--accent);}
body.light-mode .conv-item:hover{background:#f1f5f9;}
body.light-mode .conv-item.active{background:rgba(37,99,235,.08);}
body.light-mode .nav-item:hover{background:#f1f5f9;}
body.light-mode .nav-item.active{background:rgba(37,99,235,.1);}
body.light-mode .todo-item{background:#f8fafc;}
body.light-mode .notice-item{background:#f8fafc;}
body.light-mode .leave-item{background:#f8fafc;}
body.light-mode ::-webkit-scrollbar-thumb{background:#cbd5e1;}
body.light-mode .att-cal-cell{background:#f8fafc;}
body.light-mode .company-cal-cell{background:#f8fafc;}
body.light-mode .kw-tag{} /* 색상은 JS에서 설정 */
body.light-mode .admin-tab.active{background:#e2e8f0;}
body.light-mode .msg-textarea{background:#f8fafc;color:#1e293b;}
body.light-mode .search-input,.form-input,.form-select,.date-input,.time-input,.todo-input,.recipient-input{background:#f8fafc;}
body.light-mode .recipient-dropdown{background:#fff;}
body.light-mode .mobile-overlay{background:rgba(0,0,0,.3);}
body.light-mode .sidebar{box-shadow:2px 0 16px rgba(0,0,0,.08);}
/* 라이트 모드 로그인 화면 */
body.light-mode #loginScreen{background:#f0f4f8;}
body.light-mode .login-input{background:#fff;color:#1e293b;}
body.light-mode .toast{background:#fff;color:#1e293b;}

/* ── 업무지시 카드 ── */
.task-card{padding:12px 14px;cursor:pointer;border-bottom:1px solid var(--border);transition:background .1s;}
.task-card:hover{background:var(--bg3);}
.task-card.active{background:rgba(59,130,246,.1);border-right:3px solid var(--accent);}
.task-title{font-size:13px;font-weight:600;color:var(--text);margin-bottom:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.task-meta{font-size:11px;color:var(--text3);display:flex;align-items:center;gap:6px;flex-wrap:wrap;}
.task-preview{font-size:12px;color:var(--text2);margin:4px 0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.task-status-badge{font-size:10px;padding:2px 8px;border-radius:10px;font-weight:600;white-space:nowrap;}
/* 업무지시 상세 */
.task-detail-header{padding:16px 20px;border-bottom:1px solid var(--border);background:var(--bg2);}
.task-detail-title{font-size:16px;font-weight:700;color:var(--text);margin-bottom:8px;}
.task-detail-body{padding:16px 20px;border-bottom:1px solid var(--border);background:var(--bg3);font-size:14px;color:var(--text2);line-height:1.7;white-space:pre-wrap;}
.task-detail-meta{padding:10px 20px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:10px;flex-wrap:wrap;background:var(--bg2);}
/* 댓글 영역 */
.comments-wrap{flex:1;overflow-y:auto;padding:14px 20px;display:flex;flex-direction:column;gap:10px;}
.comment-item{display:flex;gap:10px;align-items:flex-start;}
.comment-bubble{background:var(--surface);border-radius:10px;padding:9px 13px;flex:1;font-size:13px;line-height:1.5;}
.comment-bubble.mine{background:rgba(59,130,246,.15);border:1px solid rgba(59,130,246,.2);}
.comment-input-area{padding:12px 16px;border-top:1px solid var(--border);background:var(--bg2);display:flex;gap:8px;align-items:flex-end;}
.task-unread-dot{width:8px;height:8px;border-radius:50%;background:var(--accent);display:inline-block;margin-left:4px;flex-shrink:0;}
body.light-mode .task-card:hover{background:#f1f5f9;}
body.light-mode .task-card.active{background:rgba(37,99,235,.07);}
body.light-mode .comment-bubble{background:#f1f5f9;}
body.light-mode .comment-bubble.mine{background:rgba(37,99,235,.08);}
.sidebar,.topbar,.card,.modal,.conv-item,.todo-item,.notice-item,.leave-item,.att-cal-cell,.company-cal-cell{transition:background .25s,border-color .25s,color .25s;}

/* ── 테마 토글 버튼 ── */
.theme-toggle{display:flex;align-items:center;gap:10px;padding:10px 14px;border-radius:10px;background:var(--bg3);border:1px solid var(--border);cursor:pointer;width:100%;font-family:'Pretendard',sans-serif;}
.theme-track{width:44px;height:24px;border-radius:12px;background:var(--border);position:relative;transition:background .2s;flex-shrink:0;}
.theme-track.on{background:var(--accent);}
.theme-thumb{width:18px;height:18px;border-radius:50%;background:#fff;position:absolute;top:3px;left:3px;transition:left .2s;box-shadow:0 1px 4px rgba(0,0,0,.2);}
.theme-track.on .theme-thumb{left:23px;}
.theme-label{font-size:13px;font-weight:600;color:var(--text);flex:1;}
.theme-icon{font-size:16px;}
*{box-sizing:border-box;margin:0;padding:0;}
body{font-family:'Pretendard',sans-serif;background:var(--bg);color:var(--text);min-height:100vh;overflow-x:hidden;}
#loadingOverlay{position:fixed;inset:0;background:var(--bg);display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:99999;gap:16px;}
.loading-spinner{width:40px;height:40px;border:3px solid var(--border);border-top-color:var(--accent);border-radius:50%;animation:spin .8s linear infinite;}
@keyframes spin{to{transform:rotate(360deg)}}
.loading-text{font-size:13px;color:var(--text3);}
#loginScreen{position:fixed;inset:0;background:var(--bg);display:none;align-items:center;justify-content:center;z-index:9999;}
.login-box{background:var(--bg2);border:1px solid var(--border);border-radius:20px;padding:40px 36px;width:400px;box-shadow:var(--shadow);}
.login-logo{font-size:28px;font-weight:700;background:linear-gradient(135deg,var(--accent),var(--accent2));-webkit-background-clip:text;-webkit-text-fill-color:transparent;margin-bottom:4px;}
.login-sub{font-size:12px;color:var(--text3);margin-bottom:28px;}
.login-field{margin-bottom:14px;}
.login-label{font-size:12px;font-weight:600;color:var(--text2);margin-bottom:6px;display:block;}
.login-input{width:100%;background:var(--bg3);border:1px solid var(--border);border-radius:8px;padding:10px 14px;color:var(--text);font-size:14px;outline:none;font-family:'Pretendard',sans-serif;}
.login-input:focus{border-color:var(--accent);}
.login-btn{width:100%;padding:11px;border-radius:10px;border:none;background:var(--accent);color:#fff;font-size:14px;font-weight:700;cursor:pointer;margin-top:8px;font-family:'Pretendard',sans-serif;transition:background .15s;}
.login-btn:hover{background:#2563eb;}
.login-btn:disabled{opacity:.6;cursor:not-allowed;}
.login-error{color:var(--danger);font-size:12px;margin-top:8px;display:none;}
.login-status{margin-top:14px;padding:10px 14px;border-radius:8px;font-size:12px;line-height:1.7;border:1px solid var(--border);background:var(--bg3);display:none;}
.login-status.ok{border-color:rgba(16,185,129,.4);background:rgba(16,185,129,.07);color:#6ee7b7;}
.login-status.fail{border-color:rgba(239,68,68,.4);background:rgba(239,68,68,.07);color:#fca5a5;}
.login-status.info{border-color:var(--border);color:var(--text2);}
.seed-btn{width:100%;padding:9px;border-radius:8px;border:1px solid rgba(245,158,11,.4);background:rgba(245,158,11,.1);color:var(--warning);font-size:12px;font-weight:600;cursor:pointer;margin-top:8px;font-family:'Pretendard',sans-serif;}
.seed-btn:hover{background:rgba(245,158,11,.2);}
.seed-btn:disabled{opacity:.5;cursor:not-allowed;}
.fb-status{position:fixed;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--accent),var(--accent2));z-index:8888;transform:scaleX(0);transform-origin:left;transition:transform .3s;}
.fb-status.loading{animation:fbLoad 1.5s ease-in-out infinite;}
@keyframes fbLoad{0%{transform:scaleX(0)}50%{transform:scaleX(.7)}100%{transform:scaleX(0)}}
.fb-status.done{transform:scaleX(1);}
.sync-dot{width:7px;height:7px;border-radius:50%;background:var(--success);display:inline-block;margin-left:4px;}
.sync-dot.syncing{background:var(--warning);animation:pulse 1s infinite;}
.sync-dot.error{background:var(--danger);}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.4}}
.app{display:flex;height:100vh;}
.sidebar{width:240px;background:var(--bg2);border-right:1px solid var(--border);display:flex;flex-direction:column;flex-shrink:0;}
.main{flex:1;display:flex;flex-direction:column;overflow:hidden;}
.sidebar-logo{padding:20px;border-bottom:1px solid var(--border);}
.logo-text{font-size:20px;font-weight:700;background:linear-gradient(135deg,var(--accent),var(--accent2));-webkit-background-clip:text;-webkit-text-fill-color:transparent;}
.logo-sub{font-size:11px;color:var(--text3);margin-top:2px;}
.sidebar-user{padding:16px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:10px;cursor:pointer;}
.avatar{width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:600;flex-shrink:0;}
.user-info .name{font-size:13px;font-weight:600;}
.user-info .role{font-size:11px;color:var(--text3);}
.nav{padding:12px 8px;flex:1;overflow-y:auto;}
.nav-section{margin-bottom:18px;}
.nav-label{font-size:10px;font-weight:600;color:var(--text3);text-transform:uppercase;letter-spacing:1px;padding:0 8px;margin-bottom:6px;}
.nav-item{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:8px;cursor:pointer;color:var(--text2);font-size:13px;font-weight:500;transition:all .15s;position:relative;text-decoration:none;}
.nav-item:hover{background:var(--bg3);color:var(--text);}
.nav-item.active{background:rgba(59,130,246,.15);color:var(--accent);}
.nav-item .icon{font-size:15px;width:20px;text-align:center;}
.nav-badge{margin-left:auto;background:var(--danger);color:#fff;font-size:10px;font-weight:700;padding:1px 6px;border-radius:20px;min-width:18px;text-align:center;}
.sidebar-clock{padding:12px 16px;border-top:1px solid var(--border);}
.clock-time{font-family:'DM Mono',monospace;font-size:22px;font-weight:500;color:var(--accent2);}
.clock-date{font-size:11px;color:var(--text3);margin-top:2px;}
.checkin-btns{display:flex;gap:6px;margin-top:10px;}
.btn-sm{flex:1;padding:6px;border:none;border-radius:6px;font-size:11px;font-weight:600;cursor:pointer;transition:all .15s;font-family:'Pretendard',sans-serif;}
.btn-in{background:rgba(16,185,129,.15);color:var(--success);border:1px solid rgba(16,185,129,.3);}
.btn-in:hover{background:rgba(16,185,129,.25);}
.btn-out{background:rgba(239,68,68,.15);color:var(--danger);border:1px solid rgba(239,68,68,.3);}
.btn-out:hover{background:rgba(239,68,68,.25);}
.btn-sm:disabled{opacity:.4;cursor:not-allowed;}
.attendance-status{font-size:10px;color:var(--text3);margin-top:6px;line-height:1.4;}
.topbar{padding:14px 24px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:12px;background:var(--bg2);}
.topbar-title{font-size:16px;font-weight:700;}
.topbar-sub{font-size:12px;color:var(--text3);}
.topbar-actions{margin-left:auto;display:flex;gap:8px;align-items:center;}
.btn{padding:7px 14px;border-radius:8px;border:none;cursor:pointer;font-size:12px;font-weight:600;transition:all .15s;font-family:'Pretendard',sans-serif;}
.btn-primary{background:var(--accent);color:#fff;}
.btn-primary:hover{background:#2563eb;}
.btn-secondary{background:var(--surface);color:var(--text2);border:1px solid var(--border);}
.btn-secondary:hover{background:var(--surface2);color:var(--text);}
.btn-danger{background:rgba(239,68,68,.15);color:var(--danger);border:1px solid rgba(239,68,68,.3);}
.btn-success{background:rgba(16,185,129,.15);color:var(--success);border:1px solid rgba(16,185,129,.3);}
.btn-success:hover{background:rgba(16,185,129,.25);}
.btn-warning{background:rgba(245,158,11,.15);color:var(--warning);border:1px solid rgba(245,158,11,.3);}
.content{flex:1;overflow-y:auto;padding:24px;}
.panel{display:none;height:100%;}
.panel.active{display:flex;flex-direction:column;gap:20px;}
.card{background:var(--bg2);border:1px solid var(--border);border-radius:var(--radius);padding:20px;}
.card-title{font-size:14px;font-weight:600;color:var(--text);margin-bottom:16px;display:flex;align-items:center;gap:8px;}
.card-title .dot{width:6px;height:6px;border-radius:50%;}
/* recipient */
.recipient-wrap{position:relative;}
.recipient-input,.search-input{width:100%;background:var(--bg3);border:1px solid var(--border);border-radius:8px;padding:8px 12px;color:var(--text);font-size:13px;outline:none;font-family:'Pretendard',sans-serif;}
.recipient-input:focus,.search-input:focus{border-color:var(--accent);}
.recipient-dropdown{position:absolute;top:calc(100% + 4px);left:0;right:0;background:var(--bg2);border:1px solid var(--border);border-radius:8px;max-height:220px;overflow-y:auto;z-index:300;box-shadow:var(--shadow);}
.recipient-item{padding:9px 12px;cursor:pointer;display:flex;align-items:center;gap:8px;font-size:13px;transition:background .1s;}
.recipient-item:hover{background:rgba(59,130,246,.15);}
.ri-dept{font-size:10px;color:var(--text3);margin-left:auto;}
.recipient-chosen{display:flex;align-items:center;gap:8px;padding:6px 10px;background:rgba(59,130,246,.1);border:1px solid rgba(59,130,246,.3);border-radius:6px;font-size:12px;margin-top:6px;}
.rc-remove{cursor:pointer;color:var(--text3);margin-left:auto;}
.rc-remove:hover{color:var(--danger);}
/* messages */
.messages-layout{display:grid;grid-template-columns:280px 1fr;gap:0;height:100%;min-height:0;}
.conv-list{border-right:1px solid var(--border);display:flex;flex-direction:column;overflow:hidden;}
.conv-search{padding:12px;border-bottom:1px solid var(--border);}
.conv-items{flex:1;overflow-y:auto;}
.conv-item{padding:12px 14px;cursor:pointer;border-bottom:1px solid var(--border);transition:background .1s;display:flex;align-items:center;gap:10px;}
.conv-item:hover{background:var(--bg3);}
.conv-item.active{background:rgba(59,130,246,.1);border-right:2px solid var(--accent);}
.conv-info{flex:1;min-width:0;}
.conv-name{font-size:13px;font-weight:600;}
.conv-preview{font-size:11px;color:var(--text3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:2px;}
.conv-meta{text-align:right;}
.conv-time{font-size:10px;color:var(--text3);}
.conv-unread{background:var(--accent);color:#fff;font-size:10px;font-weight:700;padding:1px 5px;border-radius:10px;margin-top:4px;display:inline-block;}
.chat-area{display:flex;flex-direction:column;overflow:hidden;}
.chat-header{padding:14px 20px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:12px;}
.chat-name{font-size:14px;font-weight:600;}
.chat-status{font-size:11px;color:var(--text3);}
.online-dot{width:8px;height:8px;border-radius:50%;background:var(--success);display:inline-block;}
.chat-messages{flex:1;overflow-y:auto;padding:20px;display:flex;flex-direction:column;gap:16px;}
.msg{display:flex;gap:10px;max-width:78%;}
.msg.sent{flex-direction:row-reverse;align-self:flex-end;}
.msg-bubble{padding:10px 14px;border-radius:12px;font-size:13px;line-height:1.6;word-break:break-word;}
.msg.received .msg-bubble{background:var(--surface);border-radius:4px 12px 12px 12px;}
.msg.sent .msg-bubble{background:var(--accent);color:#fff;border-radius:12px 4px 12px 12px;}
.msg-lang-tag{display:inline-flex;align-items:center;font-size:10px;padding:2px 7px;border-radius:10px;background:rgba(6,182,212,.15);color:var(--accent2);border:1px solid rgba(6,182,212,.25);margin-bottom:5px;}
.msg-orig{font-size:13px;line-height:1.6;}
.msg-divider{height:1px;background:rgba(255,255,255,.12);margin:6px 0;}
.msg-tr{font-size:12px;color:rgba(230,240,255,.75);line-height:1.5;}
.msg.received .msg-tr{color:var(--text2);}
.msg-time{font-size:10px;color:var(--text3);margin-top:4px;}
.msg.sent .msg-time{text-align:right;}
.msg-file{display:flex;align-items:center;gap:8px;padding:7px 11px;background:rgba(255,255,255,.08);border-radius:7px;margin-top:6px;font-size:12px;}
.msg-img{max-width:200px;border-radius:8px;margin-top:6px;display:block;}
.chat-input-area{padding:12px 20px 16px;border-top:1px solid var(--border);}
.chat-input-tools{display:flex;gap:6px;margin-bottom:8px;}
.tool-btn{background:var(--surface);border:1px solid var(--border);border-radius:6px;padding:5px 10px;color:var(--text2);font-size:12px;cursor:pointer;transition:all .15s;}
.tool-btn:hover{background:var(--surface2);color:var(--text);}
.chat-input-row{display:flex;gap:10px;align-items:flex-end;}
.msg-textarea{flex:1;background:var(--bg3);border:1px solid var(--border);border-radius:10px;padding:10px 14px;color:var(--text);font-size:13px;resize:none;outline:none;font-family:'Pretendard',sans-serif;min-height:42px;max-height:120px;}
.msg-textarea:focus{border-color:var(--accent);}
.send-btn{background:var(--accent);color:#fff;border:none;border-radius:10px;padding:10px 16px;cursor:pointer;font-size:16px;}
.send-btn:hover{background:#2563eb;}
.file-preview{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:8px;}
.file-chip{background:var(--surface);border:1px solid var(--border);border-radius:6px;padding:4px 10px;font-size:11px;display:flex;align-items:center;gap:6px;}
.file-chip .remove{cursor:pointer;color:var(--text3);}
/* todo */
.todo-layout{display:grid;grid-template-columns:1fr 1fr;gap:20px;}
.todo-view-btns,.gv-btns,.tv-btns{display:flex;gap:6px;margin-bottom:12px;}
.tv-btn,.gv-btn{padding:5px 12px;border-radius:6px;font-size:11px;font-weight:600;cursor:pointer;border:1px solid var(--border);background:var(--surface);color:var(--text2);transition:all .15s;}
.tv-btn.active,.gv-btn.active{font-weight:700;background:rgba(59,130,246,.15);color:var(--accent);border-color:rgba(59,130,246,.4);}
.net-tab-btn{transition:color .15s,border-color .15s;}
.net-tab-btn:hover{color:var(--text) !important;}
.net-panel{animation:netFadeIn .2s ease;}
@keyframes netFadeIn{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
.todo-input-row{display:flex;gap:8px;margin-bottom:16px;flex-wrap:wrap;}
.todo-input{flex:1;background:var(--bg3);border:1px solid var(--border);border-radius:8px;padding:8px 12px;color:var(--text);font-size:13px;outline:none;font-family:'Pretendard',sans-serif;min-width:100px;}
.todo-input:focus{border-color:var(--accent);}
.todo-items{display:flex;flex-direction:column;gap:8px;}
.todo-item{display:flex;align-items:center;gap:10px;padding:10px 12px;background:var(--bg3);border-radius:8px;border:1px solid var(--border);}
.todo-item.done{opacity:.5;}
.todo-check{width:18px;height:18px;border-radius:50%;border:2px solid var(--border);cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .15s;}
.todo-check.checked{background:var(--success);border-color:var(--success);}
.todo-text{flex:1;font-size:13px;}
.todo-item.done .todo-text{text-decoration:line-through;color:var(--text3);}
.todo-due{font-size:10px;color:var(--text3);white-space:nowrap;}
.todo-due.overdue{color:var(--danger);}
.todo-due.today-due{color:var(--warning);}
.todo-del{color:var(--text3);cursor:pointer;font-size:12px;padding:2px 6px;border-radius:4px;}
.todo-del:hover{color:var(--danger);background:rgba(239,68,68,.1);}
.priority-badge{font-size:10px;padding:2px 9px;border-radius:4px;font-weight:600;white-space:nowrap;}
.p-high{background:rgba(239,68,68,.15);color:var(--danger);}
.p-mid{background:rgba(245,158,11,.15);color:var(--warning);}
.p-low{background:rgba(16,185,129,.15);color:var(--success);}
.msg-inbox{display:flex;flex-direction:column;gap:8px;}
.inbox-item{padding:12px;background:var(--bg3);border-radius:8px;border:1px solid var(--border);cursor:pointer;transition:border-color .15s;}
.inbox-item:hover{border-color:var(--accent);}
.inbox-item.unread{border-left:3px solid var(--accent);}
.inbox-sender{font-size:12px;font-weight:600;color:var(--accent2);}
.inbox-text{font-size:13px;margin-top:4px;}
.inbox-time{font-size:10px;color:var(--text3);margin-top:4px;}
.inbox-actions{display:flex;gap:6px;margin-top:8px;}
/* calendar */
.cal-wrap{user-select:none;}
.cal-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;}
.cal-nav{background:var(--surface);border:1px solid var(--border);border-radius:6px;width:28px;height:28px;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:14px;color:var(--text2);}
.cal-nav:hover{background:var(--surface2);}
.cal-month-label{font-size:14px;font-weight:700;}
.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;}
.cal-day-header{text-align:center;font-size:13px;font-weight:600;color:var(--text3);padding:6px 0;}
.cal-cell{min-height:52px;padding:4px;border-radius:7px;border:1px solid transparent;cursor:pointer;transition:background .1s;position:relative;}
.cal-cell:hover{background:var(--bg3);border-color:var(--border);}
.cal-cell.today-cell{border-color:var(--accent);background:rgba(59,130,246,.08);}
.cal-cell.other-month .cal-day-num{color:var(--text3);opacity:.4;}
.cal-day-num{font-size:14px;font-weight:700;text-align:center;line-height:1;}
.cal-cell.today-cell .cal-day-num{color:var(--accent);font-weight:700;}
.cal-dots{display:flex;flex-wrap:wrap;gap:2px;justify-content:center;margin-top:3px;}
.cal-dot{width:6px;height:6px;border-radius:50%;}
.cal-count{font-size:11px;font-weight:700;text-align:center;margin-top:2px;color:var(--accent);}
/* attendance calendar */
.att-cal-wrap{overflow-x:auto;}
.att-cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:5px;min-width:560px;}
.att-cal-cell{min-height:96px;padding:8px;border-radius:8px;border:1px solid var(--border);background:var(--bg3);font-size:12px;}
.att-cal-cell.today-cell{border-color:var(--accent);}
.att-cal-cell.other-month{opacity:.35;}
.att-cal-cell .ac-day{font-size:14px;font-weight:700;color:var(--text3);margin-bottom:5px;}
.att-cal-cell.today-cell .ac-day{color:var(--accent);}
.att-in{color:var(--success);font-size:12px;font-weight:600;}
.att-out{color:var(--danger);font-size:12px;}
.att-wh{font-size:11px;color:var(--text3);}
/* status badges */
.status-badge{font-size:11px;padding:2px 7px;border-radius:10px;font-weight:600;}
.s-normal{background:rgba(16,185,129,.15);color:var(--success);}
.s-late{background:rgba(245,158,11,.15);color:var(--warning);}
.s-earlyout{background:rgba(239,68,68,.15);color:var(--danger);}
.s-overtime{background:rgba(139,92,246,.15);color:var(--accent3);}
.s-special{background:rgba(6,182,212,.15);color:var(--accent2);}
.s-absent{background:rgba(100,116,139,.15);color:var(--text3);}
.s-annual{background:rgba(236,72,153,.15);color:#ec4899;}
.s-sick{background:rgba(245,158,11,.15);color:var(--warning);}
.s-half{background:rgba(59,130,246,.15);color:var(--accent);}
.s-inactive{background:rgba(100,116,139,.15);color:var(--text3);}
.s-present{background:rgba(16,185,129,.15);color:var(--success);}
/* admin tabs */
.admin-tabs{display:flex;gap:4px;margin-bottom:20px;background:var(--bg2);border-radius:10px;padding:4px;border:1px solid var(--border);flex-wrap:wrap;}
.admin-tab{flex:1;min-width:80px;padding:7px 10px;border-radius:7px;cursor:pointer;font-size:11px;font-weight:600;color:var(--text2);text-align:center;transition:all .15s;white-space:nowrap;}
.admin-tab.active{background:var(--surface);color:var(--text);}
.location-tag{display:inline-flex;align-items:center;gap:4px;font-size:11px;padding:3px 8px;border-radius:20px;background:rgba(16,185,129,.1);color:var(--success);border:1px solid rgba(16,185,129,.25);cursor:pointer;text-decoration:none;}
.att-filters{display:flex;gap:10px;margin-bottom:16px;align-items:center;flex-wrap:wrap;}
.date-input,.form-input,.form-select{background:var(--bg3);border:1px solid var(--border);border-radius:8px;padding:7px 12px;color:var(--text);font-size:12px;outline:none;font-family:'Pretendard',sans-serif;}
.date-input:focus,.form-input:focus,.form-select:focus{border-color:var(--accent);}
.form-input{font-size:13px;padding:9px 12px;}
.form-select option{background:var(--bg3);}
.table-wrap{overflow-x:auto;}
table{width:100%;border-collapse:collapse;font-size:13px;}
th{background:var(--bg3);padding:9px 12px;text-align:left;font-size:11px;font-weight:600;color:var(--text3);text-transform:uppercase;letter-spacing:.5px;border-bottom:1px solid var(--border);}
td{padding:9px 12px;border-bottom:1px solid var(--border);vertical-align:middle;}
tr:hover td{background:rgba(255,255,255,.02);}
.graph-container{position:relative;background:var(--bg3);border-radius:var(--radius);border:1px solid var(--border);overflow:hidden;}
#networkGraph,#sankeyGraph{width:100%;display:block;}
.graph-legend{display:flex;gap:14px;flex-wrap:wrap;margin-top:12px;}
.legend-item{display:flex;align-items:center;gap:6px;font-size:11px;color:var(--text2);}
.legend-dot{width:10px;height:10px;border-radius:50%;}
.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:20px;}
.stat-card{background:var(--bg2);border:1px solid var(--border);border-radius:var(--radius);padding:18px;}
.stat-num{font-size:28px;font-weight:700;font-family:'DM Mono',monospace;}
.stat-label{font-size:11px;color:var(--text3);margin-top:4px;text-transform:uppercase;letter-spacing:.5px;}
.stat-change{font-size:11px;margin-top:8px;}
.up{color:var(--success);}
.keyword-cloud{display:flex;flex-wrap:wrap;gap:8px;}
.kw-tag{padding:5px 12px;border-radius:20px;font-size:12px;font-weight:600;cursor:default;}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.form-group{display:flex;flex-direction:column;gap:6px;}
.form-label{font-size:12px;font-weight:600;color:var(--text2);}
.emp-table-actions{display:flex;gap:8px;margin-bottom:16px;justify-content:space-between;align-items:center;}
.modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,.6);display:flex;align-items:center;justify-content:center;z-index:1000;backdrop-filter:blur(4px);}
.modal{background:var(--bg2);border:1px solid var(--border);border-radius:16px;padding:24px;width:90%;max-width:560px;max-height:92vh;overflow-y:auto;box-shadow:var(--shadow);}
.modal-lg{max-width:720px;}
.modal-title{font-size:16px;font-weight:700;margin-bottom:20px;display:flex;justify-content:space-between;align-items:center;}
.modal-close{cursor:pointer;color:var(--text3);font-size:18px;}
.modal-close:hover{color:var(--text);}
.map-modal{background:var(--bg2);border:1px solid var(--border);border-radius:16px;padding:0;width:92%;max-width:720px;overflow:hidden;box-shadow:var(--shadow);}
.map-modal-header{padding:16px 20px;border-bottom:1px solid var(--border);display:flex;justify-content:space-between;align-items:center;}
#gmap-frame{width:100%;height:400px;border:none;display:block;}
.map-info-bar{padding:10px 20px;background:var(--bg3);font-size:12px;color:var(--text2);display:flex;gap:14px;align-items:center;flex-wrap:wrap;border-bottom:1px solid var(--border);}
.toast{position:fixed;bottom:24px;right:24px;background:var(--surface2);border:1px solid var(--border);border-radius:10px;padding:12px 18px;font-size:13px;font-weight:500;z-index:2000;animation:slideIn .3s ease;box-shadow:var(--shadow);display:flex;align-items:center;gap:8px;max-width:380px;}
.toast.success{border-left:3px solid var(--success);}
.toast.info{border-left:3px solid var(--accent);}
.toast.error{border-left:3px solid var(--danger);}
@keyframes slideIn{from{transform:translateY(20px);opacity:0;}to{transform:translateY(0);opacity:1;}}
::-webkit-scrollbar{width:5px;height:5px;}
::-webkit-scrollbar-track{background:transparent;}
::-webkit-scrollbar-thumb{background:var(--border);border-radius:10px;}

/* ── COMPANY CALENDAR ── */
.company-cal-cell{min-height:110px;padding:8px;border-radius:8px;border:1px solid var(--border);background:var(--bg3);cursor:pointer;transition:border-color .15s;}
.company-cal-cell:hover{border-color:var(--accent);}
.company-cal-cell.today-cell{border-color:var(--accent);background:rgba(59,130,246,.06);}
.company-cal-cell.other-month{opacity:.4;}
.company-cal-cell.holiday-cell{background:rgba(239,68,68,.05);border-color:rgba(239,68,68,.3);}
.event-pill{font-size:10px;padding:2px 6px;border-radius:4px;margin-bottom:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:pointer;}
.ev-color-chip{display:inline-block;width:20px;height:20px;border-radius:50%;cursor:pointer;border:2px solid transparent;transition:transform .1s,border-color .1s;}
.ev-color-chip:hover{transform:scale(1.2);border-color:var(--text);}
.att-count-row{display:flex;gap:6px;margin-top:4px;flex-wrap:wrap;}
.att-count-pill{font-size:9px;padding:1px 5px;border-radius:3px;font-weight:600;}
/* NOTICE */
.notice-item{padding:14px;background:var(--bg3);border-radius:10px;border:1px solid var(--border);margin-bottom:10px;}
.notice-title{font-size:14px;font-weight:700;margin-bottom:6px;}
.notice-meta{font-size:11px;color:var(--text3);display:flex;gap:12px;align-items:center;margin-bottom:8px;}
.notice-body{font-size:13px;color:var(--text2);line-height:1.7;white-space:pre-wrap;}
.notice-confirm-bar{margin-top:10px;padding-top:10px;border-top:1px solid var(--border);display:flex;justify-content:space-between;align-items:center;}
.confirm-progress{height:6px;background:var(--bg);border-radius:3px;overflow:hidden;flex:1;margin:0 10px;}
.confirm-fill{height:100%;background:var(--success);border-radius:3px;transition:width .3s;}
/* LEAVE REQUEST */
.leave-item{padding:12px 14px;background:var(--bg3);border-radius:8px;border:1px solid var(--border);margin-bottom:8px;display:flex;align-items:center;gap:12px;}
.leave-info{flex:1;}
.leave-type{font-size:11px;font-weight:700;padding:2px 8px;border-radius:10px;}
.lt-annual{background:rgba(236,72,153,.15);color:#ec4899;}
.lt-sick{background:rgba(245,158,11,.15);color:var(--warning);}
.lt-half{background:rgba(59,130,246,.15);color:var(--accent);}
.lt-special{background:rgba(6,182,212,.15);color:var(--accent2);}
/* WORK SETTINGS */
.work-setting-row{display:flex;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid var(--border);}
.work-setting-label{font-size:13px;font-weight:600;flex:1;}
.work-setting-val{font-size:13px;color:var(--accent2);font-family:'DM Mono',monospace;}
.time-input{background:var(--bg3);border:1px solid var(--border);border-radius:6px;padding:5px 10px;color:var(--text);font-size:13px;outline:none;font-family:'DM Mono',monospace;width:90px;}
.time-input:focus{border-color:var(--accent);}
/* EXCEL EXPORT */
.export-btn{background:rgba(16,185,129,.15);color:var(--success);border:1px solid rgba(16,185,129,.3);padding:7px 14px;border-radius:8px;font-size:12px;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:6px;font-family:'Pretendard',sans-serif;}
.export-btn:hover{background:rgba(16,185,129,.25);}
/* SPECIAL DAY BADGE */
.special-day{background:rgba(139,92,246,.15);border-color:rgba(139,92,246,.3);}
.special-day .ac-day{color:var(--accent3);}
.mobile-menu-btn{display:none;align-items:center;justify-content:center;background:none;border:none;color:var(--text);font-size:22px;cursor:pointer;padding:6px 8px;border-radius:8px;line-height:1;}
.mobile-menu-btn:active{background:var(--surface);}
.mobile-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:499;}
.mobile-overlay.active{display:block;}

/* ── MOBILE ── */
@media(max-width:768px){
  /* sidebar slide-in */
  .sidebar{position:fixed;left:-260px;top:0;height:100%;z-index:500;transition:left .28s cubic-bezier(.4,0,.2,1);width:260px;box-shadow:4px 0 24px rgba(0,0,0,.4);}
  .sidebar.open{left:0;}
  .mobile-menu-btn{display:flex;}

  /* topbar tighter */
  .topbar{padding:10px 14px;}
  .topbar-title{font-size:15px;}
  .topbar-sub{display:none;}
  .topbar-actions .btn{font-size:11px;padding:6px 10px;}

  /* content padding */
  .content{padding:14px 12px;}

  /* grids → single col */
  .stats-grid{grid-template-columns:1fr 1fr;gap:10px;margin-bottom:14px;}
  .stat-card{padding:14px;}
  .stat-num{font-size:22px;}
  .todo-layout{grid-template-columns:1fr;}
  .form-grid{grid-template-columns:1fr;}

  /* admin tabs wrap */
  .admin-tabs{flex-wrap:wrap;gap:4px;}
  .admin-tab{min-width:calc(50% - 4px);font-size:11px;padding:6px 8px;}

  /* messages: show conv list only until a conv is opened */
  .messages-layout{grid-template-columns:1fr;position:relative;}
  .conv-list{display:flex;}
  .chat-area{display:none;position:absolute;inset:0;background:var(--bg);z-index:10;}
  .chat-area.mobile-open{display:flex;}

  /* cards */
  .card{padding:14px;}
  .card-title{font-size:13px;margin-bottom:12px;}

  /* tables scroll */
  .table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;}
  table{min-width:600px;}

  /* att calendar cells smaller */
  .att-cal-cell{min-height:70px;padding:4px;}
  .company-cal-cell{min-height:60px;padding:3px;}
  .att-cal-grid{gap:3px;}
  .cal-grid{gap:2px;}

  /* modals full-width */
  .modal{width:96%;max-width:96%;padding:18px 16px;max-height:88vh;}
  .modal-lg{max-width:96%;}
  .map-modal{width:96%;}
  #gmap-frame{height:280px;}

  /* chat input */
  .chat-input-area{padding:10px 12px 14px;}
  .chat-messages{padding:14px 12px;}

  /* leave layout */
  #panel-leave .todo-layout{grid-template-columns:1fr;}

  /* work settings grid */
  #panel-work-settings > div{grid-template-columns:1fr !important;}

  /* home grid */
  #panel-home > div:nth-child(2),
  #panel-home > div:nth-child(3){grid-template-columns:1fr !important;}

  /* notice detail grid */
  .modal [style*="grid-template-columns:1fr 1fr"]{display:flex !important;flex-direction:column !important;}

  /* toast */
  .toast{bottom:12px;right:12px;left:12px;max-width:none;}

  /* att filters wrap */
  .att-filters{flex-wrap:wrap;gap:8px;}

  /* export btn */
  .export-btn{font-size:11px;padding:6px 10px;}
}
.chart-wrap{position:relative;height:250px;}
.select-msg{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;color:var(--text3);gap:12px;font-size:14px;}
.select-msg .icon-big{font-size:48px;}

/* ── 수정요청 ── */
.fb-thumb{width:100%;max-height:240px;object-fit:contain;border-radius:8px;border:1px solid var(--border);cursor:pointer;background:#0a0e1a;}
.anno-tool-btn{padding:4px 10px;border-radius:7px;border:1px solid var(--border);background:var(--bg3);color:var(--text2);font-size:12px;cursor:pointer;font-family:inherit;transition:all .15s;}
.anno-tool-btn:hover{background:var(--surface);}
.anno-tool-btn.active{background:var(--accent);color:#fff;border-color:var(--accent);}
body.light-mode .fb-thumb{background:#f8fafc;}
body.light-mode .anno-tool-btn{background:#f1f5f9;}