@import "https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@300;400;500;600;700&display=swap";:root{--bg-main:#f8fafc;--bg-card:#fff;--bg-header:#0f172a;--bg-input:#fff;--text-main:#334155;--text-title:#0f172a;--text-muted:#64748b;--border-color:#e2e8f0;--border-input:#cbd5e1;--color-primary:#0284c7;--color-primary-hover:#0369a1;--color-success:#10b981;--color-danger:#ef4444;--color-neutral:#94a3b8;--shadow-sm:0 1px 2px #0000000d;--shadow-md:0 4px 6px -1px #00000014}body.dark-mode{--bg-main:#0f172a;--bg-card:#1e293b;--bg-header:#1e293b;--bg-input:#0f172a;--text-main:#f1f5f9;--text-title:#fff;--text-muted:#cbd5e1;--border-color:#334155;--border-input:#475569;--color-primary:#0ea5e9;--color-primary-hover:#38bdf8;--color-danger:#f87171;--color-success:#34d399}body{background-color:var(--bg-main);color:var(--text-main);-webkit-font-smoothing:antialiased;margin:0;font-family:Noto Sans KR,sans-serif}.app-container{flex-direction:column;min-height:100vh;display:flex}.main-content{flex:1;padding:32px 20px}.page-container{width:100%;margin:0 auto;transition:max-width .3s}.layout-standard .page-container{max-width:1300px}.layout-wide .page-container{max-width:98%}.navbar{background-color:var(--bg-header);border-bottom:1px solid var(--border-color);height:64px;box-shadow:var(--shadow-sm);z-index:1000;align-items:center;padding:0 32px;display:flex;position:sticky;top:0}.nav-left-group{flex:1;align-items:center;gap:32px;display:flex}.nav-logo{color:#38bdf8;font-size:20px;font-weight:700;text-decoration:none}.nav-links{gap:6px;display:flex}.nav-link{color:#94a3b8;border-radius:6px;padding:8px 12px;font-size:14px;text-decoration:none}.nav-link:hover{color:#f8fafc;background-color:#ffffff0d}.nav-link.active{color:#0f172a;background-color:#38bdf8;font-weight:700}.nav-right{align-items:center;gap:20px;display:flex}.btn-settings-icon{color:#e2e8f0;cursor:pointer;background:0 0;border:1px solid #475569;border-radius:6px;padding:6px 12px;font-size:13px;font-weight:600;transition:all .2s}.btn-settings-icon:hover{background-color:#334155}.settings-dropdown{background-color:var(--bg-card);border:1px solid var(--border-color);z-index:9999;border-radius:8px;width:220px;padding:16px;position:absolute;top:40px;right:0;box-shadow:0 10px 25px #00000026}.settings-label{color:var(--text-muted);margin-bottom:8px;font-size:12px;font-weight:700;display:block}.settings-btn-group{border:1px solid var(--border-color);border-radius:6px;display:flex;overflow:hidden}.settings-btn{color:var(--text-muted);cursor:pointer;background-color:#0000;border:none;flex:1;padding:6px 0;font-size:12px;transition:all .2s}.settings-btn.active{background-color:var(--color-primary);color:#fff;font-weight:700}.user-info{border-left:1px solid #475569;align-items:center;gap:16px;padding-left:16px;display:flex}.user-greeting{color:#e2e8f0;font-size:14px}.btn-logout{color:#fca5a5;cursor:pointer;background:0 0;border:1px solid #ef4444;border-radius:6px;padding:6px 12px;font-size:13px}.btn-logout:hover{color:#fff;background-color:#ef4444}.page-header{margin-bottom:24px}.page-title{color:var(--text-title);margin:0 0 8px;font-size:22px;font-weight:700}.page-subtitle{color:var(--text-muted);margin:0;font-size:14px}.card{background-color:var(--bg-card);box-shadow:var(--shadow-md);border:1px solid var(--border-color);border-radius:10px;margin-bottom:24px;padding:24px}.card-header{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;margin-bottom:16px;display:flex}.card-title{color:var(--text-title);margin:0;font-size:17px;font-weight:700}.card-toolbar{justify-content:space-between;align-items:center;margin-bottom:20px;display:flex}.dashboard-grid{grid-template-columns:1.5fr 1fr;gap:24px;display:grid}.custom-input{border:1px solid var(--border-input);background-color:var(--bg-input);width:100%;color:var(--text-main);border-radius:6px;outline:none;padding:8px 12px;font-size:13.5px}.custom-input:focus{border-color:var(--color-primary);box-shadow:0 0 0 2px #0284c733}.search-input{width:280px}.policy-form{flex-wrap:wrap;align-items:center;gap:12px;margin-top:12px;display:flex}.policy-input{flex:1;min-width:250px}.policy-btn{min-width:100px;height:36px;padding:8px 16px}.btn-primary,.btn-action{cursor:pointer;white-space:nowrap;border:none;border-radius:6px;justify-content:center;align-items:center;gap:6px;font-weight:600;display:inline-flex}.btn-primary{background-color:var(--color-primary);color:#fff;padding:10px 20px;font-size:14px}.btn-action{padding:6px 12px;font-size:12.5px}.action-btn-group{gap:8px;display:inline-flex}.btn-action-edit{background-color:var(--bg-main);color:var(--text-main);border:1px solid var(--border-input)}.btn-action-save{background-color:var(--color-success);color:#fff}.btn-action-cancel{background-color:var(--color-neutral);color:#fff}.btn-action-reject{color:var(--color-danger);border:1px solid var(--color-danger);background-color:#0000}.btn-action-reject:hover{background-color:var(--color-danger);color:#fff}.table-responsive{border:1px solid var(--border-color);border-radius:8px;width:100%;overflow-x:auto}.custom-table{border-collapse:collapse;text-align:center;width:100%}.custom-table th{background-color:var(--bg-main);color:var(--text-muted);border-bottom:2px solid var(--border-color);white-space:nowrap;padding:12px 14px;font-size:13px;font-weight:600}.custom-table td{border-bottom:1px solid var(--border-color);color:var(--text-main);white-space:nowrap;vertical-align:middle;padding:12px 14px;font-size:13px}.table-empty{color:var(--text-muted);white-space:normal;padding:50px 16px!important}.cell-emp-name{color:var(--text-title);margin-bottom:4px;font-weight:600;display:block}.emp-sub-id{color:var(--text-muted);font-family:monospace;font-size:11px}.cell-time{color:var(--text-muted);font-size:12px}.badge{border-radius:9999px;padding:4px 10px;font-size:11.5px;font-weight:600}.badge-green{color:#166534;background-color:#dcfce7}.badge-blue{color:#0369a1;background-color:#e0f2fe}.badge-gray{color:#475569;background-color:#f1f5f9}.card-count-badge{color:var(--text-muted);background-color:var(--bg-main);border:1px solid var(--border-color);border-radius:20px;padding:4px 12px;font-size:12px;font-weight:700;line-height:1.2;display:inline-block}.badge-danger-tag{color:#b91c1c;background-color:#fee2e2;border-radius:4px;padding:3px 6px;font-family:monospace;font-size:12px;font-weight:600}.ip-badge{background-color:var(--bg-main);border:1px solid var(--border-color);color:var(--text-muted);border-radius:4px;padding:3px 6px;font-family:monospace;font-size:12px}.dark-mode .custom-table th{color:#cbd5e1;background-color:#1e293b}.dark-mode .custom-table tbody tr:hover td{background-color:#334155}.dark-mode .btn-action-edit{color:#f1f5f9;background-color:#334155;border:none}.dark-mode .btn-action-edit:hover{background-color:#475569}.dark-mode .badge-green{color:#6ee7b7;background-color:#10b98126}.dark-mode .badge-blue{color:#7dd3fc;background-color:#0284c726}.dark-mode .badge-gray{color:#cbd5e1;background-color:#334155}.dark-mode .ip-badge{color:#cbd5e1;background-color:#334155;border-color:#475569}.dark-mode .badge-danger-tag{color:#fca5a5;background-color:#ef444426}.dark-mode section[style*="background-color: #ffffff"],.dark-mode section[style*="backgroundColor: rgb(255, 255, 255)"],.dark-mode div[style*="background-color: #ffffff"],.dark-mode div[style*="backgroundColor: white"]{background-color:var(--bg-card)!important;border-color:var(--border-color)!important}*{box-sizing:border-box}body,html,#root{width:100%;margin:0;padding:0;overflow-x:hidden}@media (width<=768px){div{max-width:100%!important}input,button,select{margin-bottom:10px;width:100%!important;max-width:100%!important}form,.login-box,.container,.wrapper{width:100%!important;min-width:100%!important;box-shadow:none!important;margin:0 auto!important;padding:20px!important}table{white-space:nowrap!important;width:100%!important;display:block!important;overflow-x:auto!important}.table-responsive,.custom-table,table{white-space:nowrap!important;-webkit-overflow-scrolling:touch!important;width:100%!important;max-width:100vw!important;display:block!important;overflow-x:auto!important}form{width:100%!important}form>div{flex-direction:column!important;gap:10px!important;width:100%!important;margin-bottom:12px!important;display:flex!important}input,select,button{box-sizing:border-box!important;width:100%!important;max-width:100%!important}header,.top-navbar,nav{flex-wrap:wrap!important;gap:5px!important}header button,header a{padding:8px 10px!important;font-size:13px!important}}body,html,#root{width:100%;overflow-x:hidden}