:root{
  --bg:#f4f6fa; --panel:#ffffff; --line:#dde3ec; --txt:#1f2937; --mut:#6b7280;
  --acc:#2563eb; --acc2:#1d4ed8; --ok:#16a34a; --warn:#d97706; --bad:#dc2626;
  --prefer:#bfdbfe; --avoid:#fde68a; --ban:#fecaca; --lock:#e9d5ff;
  --cellok:#bbf7d0; --cellswap:#fef08a; --cellbad:#fecaca; --sel:#93c5fd;
}
*{box-sizing:border-box}
body{margin:0;font-family:'Malgun Gothic','Apple SD Gothic Neo',sans-serif;background:var(--bg);color:var(--txt);font-size:14px}
button{font-family:inherit;font-size:13px;padding:6px 12px;border:1px solid var(--line);border-radius:6px;background:var(--panel);cursor:pointer;color:var(--txt)}
button:hover{background:#eef2ff;border-color:var(--acc)}
button.primary{background:var(--acc);border-color:var(--acc);color:#fff;font-weight:600}
button.primary:hover{background:var(--acc2)}
button.danger{color:var(--bad)}
button.danger:hover{background:#fef2f2;border-color:var(--bad)}
button:disabled{opacity:.45;cursor:not-allowed}
input,select,textarea{font-family:inherit;font-size:13px;padding:6px 8px;border:1px solid var(--line);border-radius:6px;background:var(--panel);color:var(--txt)}
input:focus,select:focus,textarea:focus{outline:2px solid #bfdbfe}
input[type=number]{width:70px}
label{font-size:13px}

#topbar{display:flex;align-items:center;justify-content:space-between;background:var(--panel);border-bottom:1px solid var(--line);padding:10px 18px;position:sticky;top:0;z-index:50;flex-wrap:wrap;gap:8px}
.brand{font-size:18px;font-weight:700}
.brand .sub{font-size:12px;color:var(--mut);font-weight:400;margin-left:6px}
.topbtns{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.sep{width:1px;height:20px;background:var(--line);margin:0 4px}

#tabs{display:flex;gap:2px;background:var(--panel);border-bottom:2px solid var(--line);padding:0 14px;overflow-x:auto;position:sticky;top:53px;z-index:49}
#tabs button{border:none;border-radius:8px 8px 0 0;padding:10px 16px;background:transparent;font-size:14px;white-space:nowrap}
#tabs button.active{background:var(--acc);color:#fff;font-weight:700}
#tabs button:hover:not(.active){background:#e0e7ff}

#main{padding:18px;max-width:1500px;margin:0 auto}
.panel{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:16px;margin-bottom:16px}
.panel h2{margin:0 0 12px;font-size:16px;border-left:4px solid var(--acc);padding-left:8px}
.panel h3{margin:14px 0 8px;font-size:14px;color:var(--acc2)}
.hint{font-size:12px;color:var(--mut);margin:6px 0;line-height:1.6}
.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:8px 0}
.row label{display:flex;gap:6px;align-items:center}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media(max-width:900px){.grid2{grid-template-columns:1fr}}

table.list{border-collapse:collapse;width:100%;font-size:13px}
table.list th,table.list td{border:1px solid var(--line);padding:5px 8px;text-align:center}
table.list th{background:#f1f5f9}
table.list tr.sel{background:#dbeafe}
table.list tr:hover{background:#f0f6ff;cursor:pointer}
table.list td.l{text-align:left}
.tag{display:inline-block;padding:1px 7px;border-radius:10px;font-size:11px;background:#e0e7ff;color:#3730a3;margin:1px}
.tag.warn{background:#fef3c7;color:#92400e}
.tag.bad{background:#fee2e2;color:#991b1b}
.tag.ok{background:#dcfce7;color:#166534}

/* time grids */
table.tg{border-collapse:collapse;font-size:12px}
table.tg th,table.tg td{border:1px solid var(--line);padding:0;text-align:center}
table.tg th{background:#f1f5f9;padding:4px 8px;font-weight:600}
table.tg td{min-width:46px;height:30px;cursor:pointer;user-select:none}
table.tg td:hover{outline:2px solid var(--acc);outline-offset:-2px}
td.st-P{background:var(--prefer)}
td.st-A{background:var(--avoid)}
td.st-X{background:var(--ban);color:#991b1b;font-weight:700}
td.st-O{background:var(--cellok);color:#166534;font-weight:700}
.legend{display:flex;gap:12px;font-size:12px;margin:6px 0;flex-wrap:wrap}
.legend span{display:flex;align-items:center;gap:4px}
.swatch{width:14px;height:14px;border:1px solid var(--line);border-radius:3px;display:inline-block}

/* schedule sheet (장판지) */
.sheetwrap{overflow:auto;max-height:72vh;border:1px solid var(--line);border-radius:8px}
table.sheet{border-collapse:collapse;font-size:11px}
table.sheet th,table.sheet td{border:1px solid #cbd5e1;padding:2px 3px;text-align:center;white-space:nowrap}
table.sheet thead th{background:#1e3a5f;color:#fff;position:sticky;top:0;z-index:3}
table.sheet thead th.day0{border-left:3px solid #1e3a5f}
table.sheet tbody th{background:#f1f5f9;position:sticky;left:0;z-index:2;padding:2px 8px;min-width:64px}
table.sheet td{min-width:48px;height:30px;cursor:pointer}
table.sheet td.day0{border-left:3px solid #94a3b8}
table.sheet td .s1{font-weight:700}
table.sheet td .s2{color:var(--mut);font-size:10px}
td.u-sel{background:var(--sel) !important;outline:2px solid var(--acc);outline-offset:-2px}
td.u-ok{background:var(--cellok) !important}
td.u-swap{background:var(--cellswap) !important}
td.u-bad{background:var(--cellbad) !important}
td.u-lock{box-shadow:inset 0 0 0 2px #a855f7}
td.u-conflict{background:#fda4af !important;font-weight:700}
td.u-manual{box-shadow:inset 3px 0 0 #f97316}

/* big single grid */
table.big{border-collapse:collapse;font-size:13px;width:100%}
table.big th,table.big td{border:1px solid var(--line);padding:4px;text-align:center}
table.big th{background:#f1f5f9}
table.big td{height:48px;min-width:80px;cursor:pointer}

/* solver */
.progressbar{height:18px;background:#e5e7eb;border-radius:9px;overflow:hidden;margin:8px 0}
.progressbar>div{height:100%;background:linear-gradient(90deg,#3b82f6,#06b6d4);width:0%;transition:width .15s}
.scorecards{display:flex;gap:10px;flex-wrap:wrap;margin:10px 0}
.scorecard{background:#f8fafc;border:1px solid var(--line);border-radius:8px;padding:10px 16px;text-align:center;min-width:110px}
.scorecard .v{font-size:22px;font-weight:700;color:var(--acc2)}
.scorecard .k{font-size:11px;color:var(--mut)}
.scorecard.bad .v{color:var(--bad)}
.scorecard.ok .v{color:var(--ok)}

.unassigned{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0}
.unassigned .chip{padding:4px 10px;border:1px solid #fca5a5;background:#fff1f2;border-radius:14px;font-size:12px;cursor:pointer}
.unassigned .chip:hover,.unassigned .chip.sel{background:#fecdd3;outline:2px solid var(--bad)}

.selbar{display:flex;gap:8px;align-items:center;background:#eff6ff;border:1px solid #bfdbfe;border-radius:8px;padding:8px 12px;margin:8px 0;flex-wrap:wrap}
.selbar .info{font-weight:700;color:var(--acc2)}

#toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:#111827;color:#fff;padding:10px 20px;border-radius:8px;font-size:13px;opacity:0;pointer-events:none;transition:opacity .25s;z-index:99;max-width:80vw}
#toast.show{opacity:.95}

#modalWrap{position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:90;display:flex;align-items:center;justify-content:center}
#modalWrap.hidden{display:none}
#modalBox{background:#fff;border-radius:12px;padding:20px;max-width:720px;max-height:85vh;overflow:auto;min-width:340px}

.kbd{background:#f1f5f9;border:1px solid var(--line);border-radius:4px;padding:0 5px;font-size:11px;font-family:Consolas,monospace}

@media print{ body *{visibility:hidden} }

/* ---------- 다크 모드 ---------- */
body.dark{
  --bg:#0f172a; --panel:#1e293b; --line:#334155; --txt:#e2e8f0; --mut:#94a3b8;
  --acc:#3b82f6; --acc2:#60a5fa;
  --prefer:#1e3a8a; --avoid:#713f12; --ban:#7f1d1d; --lock:#581c87;
  --cellok:#14532d; --cellswap:#854d0e; --cellbad:#7f1d1d; --sel:#1d4ed8;
}
body.dark button:hover{background:#293a52;border-color:var(--acc)}
body.dark button.primary{background:var(--acc);color:#fff}
body.dark button.primary:hover{background:#2563eb}
body.dark #tabs button:hover:not(.active){background:#293a52}
body.dark table.list th{background:#26344a}
body.dark table.list tr:hover{background:#243047}
body.dark table.list tr.sel{background:#1e3a8a}
body.dark table.tg th{background:#26344a}
body.dark td.st-P{color:#bfdbfe}
body.dark td.st-A{color:#fde68a}
body.dark td.st-X{color:#fca5a5}
body.dark td.st-O{color:#86efac}
body.dark table.sheet th,body.dark table.sheet td{border-color:#46586f}
body.dark table.sheet tbody th{background:#26344a}
body.dark table.big th{background:#26344a}
body.dark .scorecard{background:#26344a}
body.dark .progressbar{background:#334155}
body.dark .selbar{background:#172554;border-color:#1e40af}
body.dark .selbar .info{color:#93c5fd}
body.dark .unassigned .chip{background:#3b1d26;border-color:#9f1239;color:#fda4af}
body.dark .unassigned .chip:hover,body.dark .unassigned .chip.sel{background:#4c0519}
body.dark .kbd{background:#26344a}
body.dark #modalBox{background:var(--panel)}
body.dark .tag{background:#312e81;color:#c7d2fe}
body.dark .tag.warn{background:#451a03;color:#fcd34d}
body.dark .tag.bad{background:#450a0a;color:#fca5a5}
body.dark .tag.ok{background:#052e16;color:#86efac}
body.dark td.u-conflict{background:#9f1239 !important}
body.dark .hint{color:#94a3b8}
body.dark #toast{background:#e2e8f0;color:#0f172a}
