* { box-sizing: border-box; }
body { margin:0; font-family:"맑은 고딕","Malgun Gothic",sans-serif; background:#f4f6fb; color:#222; }
a { color:#5a2f6b; }
header { background:#5a2f6b; color:#fff; padding:12px 20px; display:flex; align-items:center; gap:14px; }
header h1 { font-size:18px; margin:0; }
header .who { margin-left:auto; font-size:13px; opacity:.9; }
header .who a { color:#ffd9ff; }
main { padding:18px 20px 40px; }
.yearbar { background:#fff; border:1px solid #dfe3ee; border-radius:8px; padding:10px 14px;
            margin-bottom:12px; }
.yearbar form { display:flex; gap:10px; align-items:center; flex-wrap:wrap; }
.yearbar label { font-size:14px; }
.yearbar input[type=text] { width:80px; text-align:center; font-size:14px; }
.cards { display:flex; gap:10px; flex-wrap:wrap; margin-bottom:14px; }
.card { background:#fff; border:1px solid #dfe3ee; border-radius:8px; padding:10px 16px; min-width:120px; }
.card b { display:block; font-size:22px; }
.card.warn b { color:#aa2222; }
.tabs { display:flex; gap:6px; flex-wrap:wrap; margin-bottom:10px; align-items:center; }
.tabs a { padding:6px 12px; border:1px solid #dfe3ee; border-radius:16px; background:#fff;
          text-decoration:none; font-size:13px; }
.tabs a.on { background:#5a2f6b; color:#fff; border-color:#5a2f6b; }
.tabs form { margin-left:auto; }
.wrap { overflow-x:auto; }
table { width:100%; border-collapse:collapse; background:#fff; font-size:13px; }
th, td { border:1px solid #e3e7f0; padding:7px 8px; text-align:left; vertical-align:top; }
th { background:#eef1f7; white-space:nowrap; }
tr.pending { background:#fff8e5; }
tr.rejected { background:#fdeeee; }
tr.suspended { background:#f2f2f2; }
.badge { display:inline-block; padding:2px 8px; border-radius:10px; font-size:12px; white-space:nowrap; }
.b-approved { background:#dff0d8; color:#1a7a1a; }
.b-pending { background:#fdf0c8; color:#8a5a00; }
.b-rejected { background:#f8d7da; color:#a02020; }
.b-suspended { background:#e4e4e4; color:#555; }
.b-paid { background:#dff0d8; color:#1a7a1a; }
.b-unpaid { background:#f8d7da; color:#a02020; }
/* 날짜·학년도 칸은 줄바꿈하지 않는다 — '2026학년 도' 처럼 쪼개지면 읽기 나쁘다 */
td.day, td.day .small { white-space:nowrap; }
.b-using { background:#dde8f8; color:#1a4a8a; }
.b-soon { background:#fdf0c8; color:#8a5a00; }
.b-ended { background:#e4e4e4; color:#555; }
tr.ended td:first-child { border-left:3px solid #999; }
button { font-family:inherit; font-size:12px; padding:4px 9px; border-radius:5px;
         border:1px solid #c3c9d8; background:#fff; cursor:pointer; }
button.go { background:#1a7a1a; color:#fff; border-color:#1a7a1a; }
button.no { background:#fff; }
button.del { color:#a02020; }
form.inline { display:inline; }
input[type=text], input[type=password] { font-family:inherit; font-size:13px; padding:5px 7px;
         border:1px solid #c3c9d8; border-radius:5px; }
.login { max-width:340px; margin:60px auto; background:#fff; border:1px solid #dfe3ee;
         border-radius:10px; padding:22px; }
.login h2 { margin:0 0 14px; font-size:17px; color:#5a2f6b; }
.login label { display:block; margin:10px 0 4px; font-size:13px; }
.login input { width:100%; }
.login button { width:100%; margin-top:16px; padding:9px; font-size:14px; }
.msg { padding:9px 12px; border-radius:6px; margin-bottom:12px; font-size:13px; }
.msg.ok { background:#dff0d8; color:#1a6b1a; }
.msg.bad { background:#f8d7da; color:#a02020; }
.hint { color:#888; font-size:12px; }
.small { font-size:12px; color:#666; }
form.period { background:#fff; border:1px solid #dfe3ee; border-radius:8px; padding:12px;
              display:flex; gap:14px; flex-wrap:wrap; align-items:flex-end; }
form.period label { font-size:13px; display:flex; flex-direction:column; gap:4px; }
input[type=date] { font-family:inherit; font-size:13px; padding:4px 6px;
                   border:1px solid #c3c9d8; border-radius:5px; }