/* 봉수 인트라넷 공통 모양 (2026-10-22) — 버디 업무·인사현황·통합 관제실·③·⑤ 화면이 같이 쓴다. ① 할 일과 같은 검정판 */
:root{--bg:#000;--card:#0b0b0b;--card2:#141414;--ink:#f2f2f0;--sub:#9b9ea6;--line:#262626;--acc:#ffa028;--red:#ff3b3b;--ok:#3ecf8e;--go:#5ab0ff}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font-family:"Pretendard","Malgun Gothic","Noto Sans KR",sans-serif;font-size:14px}
header{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;padding:10px 16px;border-bottom:1px solid var(--line);position:sticky;top:0;background:#000;z-index:5}
header h1{font-size:17px;margin:0}header p{margin:2px 0 0;font-size:12px;color:var(--sub)}
header .seal{width:40px;height:40px;flex:0 0 auto}
.secret{color:var(--red);font-weight:800;border:1px solid var(--red);border-radius:4px;padding:1px 6px;font-size:12px}
nav.tabs{display:flex;gap:6px;margin-left:auto;flex-wrap:wrap;align-items:center}
nav.tabs a{padding:5px 10px;border:1px solid var(--line);border-radius:6px;background:var(--card2);color:#ddd;text-decoration:none;font-size:12px}
nav.tabs a.on{background:var(--acc);color:#000;border-color:var(--acc);font-weight:700}
main{max-width:1200px;margin:0 auto;padding:14px 16px 60px}
.authbar{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:8px 12px;margin-bottom:12px;font-size:13px;color:var(--sub)}
.authbar a{color:var(--acc)}
.tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin-bottom:14px}
.tile{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:10px 12px;cursor:pointer}
.tile b{display:block;font-size:24px}.tile span{color:var(--sub);font-size:12px}.tile i{display:block;font-style:normal;color:var(--acc);font-size:12px;margin-top:2px}
.tile.on{border-color:var(--acc)}.tile.warn b{color:var(--red)}
.bar{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:8px 0 12px}
.bar button,.btn{padding:5px 10px;border:1px solid var(--line);background:var(--card2);color:#ddd;border-radius:6px;cursor:pointer;font-size:12px;font-family:inherit}
.bar button.on{background:var(--acc);color:#000;border-color:var(--acc);font-weight:700}
.bar input[type=text],.bar input:not([type]){background:var(--card2);border:1px solid var(--line);color:#eee;border-radius:6px;padding:6px 10px;min-width:200px;font-family:inherit}
.bar label{color:var(--sub);font-size:12px;white-space:nowrap}
input[type=checkbox]{vertical-align:middle}
h2{font-size:15px;color:var(--acc);margin:18px 0 6px}
.box{background:var(--card);border:1px solid var(--line);border-radius:10px;overflow:auto;margin-bottom:10px}
table{width:100%;border-collapse:collapse}
td,th{border-top:1px solid var(--line);padding:7px 9px;text-align:left;vertical-align:top}
th{color:var(--sub);font-weight:500;font-size:12px;white-space:nowrap}
td.n{text-align:right;white-space:nowrap}
.pill{display:inline-block;border-radius:999px;padding:1px 8px;font-size:12px;font-weight:700;white-space:nowrap}
.p-대기{background:#2a2a2a;color:#ddd}.p-진행{background:#0d2a44;color:var(--go)}.p-완료{background:#0b2a1d;color:var(--ok)}.p-승인대기{background:#2a2410;color:#ffd166}
.note{color:var(--sub);font-size:12px}.late{color:var(--red);font-weight:700}
.ck{width:20px;height:20px;cursor:pointer;accent-color:var(--ok);margin:0}td.cb{width:30px;text-align:center}tr.isdone td:not(.cb){opacity:.55}
select.sel{background:var(--card2);border:1px solid var(--line);color:#eee;border-radius:5px;padding:3px 6px;font-family:inherit}
.empty{color:var(--sub);padding:20px;text-align:center}
.foot{color:var(--sub);font-size:12px;margin-top:22px;border-top:1px solid var(--line);padding-top:8px}
.toast{position:fixed;bottom:16px;left:50%;transform:translateX(-50%);background:#222;border:1px solid var(--line);padding:8px 14px;border-radius:8px;font-size:13px;display:none;z-index:9}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:12px}@media(max-width:800px){.grid2{grid-template-columns:1fr}}
@media(max-width:700px){td.hide,th.hide{display:none}.bar input{min-width:0;flex:1}}

/* 2026-11-05 대표 요청(09:52): 보라·파란 기본 링크가 검정 바탕에서 잘 안 보임 → 호박색. 단추·탭 등 따로 색을 정한 링크는 그대로(이 규칙이 가장 약함) */
a{color:var(--acc)}a:visited{color:#e8b860}a:hover{color:#ffd08a}
