:root{
  --bg:#e4e3de;--paper:#d8d7d1;--ink:#111111;--muted:#5c5c58;--rule:#111111;--hair:#b9b8b2;--blue:#2337e6;--on-blue:#e4e3de;--ok:#1d7a4a;--warn:#b3261e;
  --wide:"Archivo","Helvetica Neue",Arial,sans-serif;
  --kr:"Gothic A1","Apple SD Gothic Neo","Malgun Gothic",sans-serif;
  --mono:"DM Mono",ui-monospace,"SFMono-Regular",monospace;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){--bg:#121212;--paper:#1d1d1c;--ink:#ecebe6;--muted:#9a9a94;--rule:#ecebe6;--hair:#333331;--blue:#6f7dff;--on-blue:#0d0d0d;--ok:#5fc48e;--warn:#ff8a80;color-scheme:dark}}
:root[data-theme="dark"]{--bg:#121212;--paper:#1d1d1c;--ink:#ecebe6;--muted:#9a9a94;--rule:#ecebe6;--hair:#333331;--blue:#6f7dff;--on-blue:#0d0d0d;--ok:#5fc48e;--warn:#ff8a80;color-scheme:dark}
*{box-sizing:border-box}
[hidden]{display:none!important}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--kr);font-size:15px;line-height:1.7;-webkit-font-smoothing:antialiased;word-break:keep-all}
a{color:inherit}
h1,h2,p{margin:0}
.wrap{max-width:1200px;margin:0 auto;padding-left:max(20px,env(safe-area-inset-left,0px));padding-right:max(20px,env(safe-area-inset-right,0px))}
@media (max-width:480px){.wrap{padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}}
.mono{font-family:var(--mono);font-size:11.5px;letter-spacing:.06em;text-transform:uppercase}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--blue);outline-offset:2px}

header{border-bottom:1px solid var(--rule);background:var(--bg)}
.bar{display:flex;justify-content:space-between;align-items:center;gap:16px;padding-block:12px}
.bar .id{display:flex;gap:12px;align-items:baseline;text-decoration:none}
.bar .id b{font-family:var(--wide);font-stretch:125%;font-weight:900;font-size:15px}
.back{text-decoration:none}
.back:hover{color:var(--blue)}

.title{padding-block:clamp(32px,6vw,64px) 24px;display:grid;gap:14px}
.title h1{font-weight:900;font-size:clamp(34px,6vw,64px);line-height:1.05;letter-spacing:-.05em}
.title .meta{display:flex;gap:18px;flex-wrap:wrap;color:var(--muted)}
.notice{border-left:3px solid var(--blue);padding:10px 14px;background:color-mix(in srgb,var(--blue) 7%,transparent);max-width:70ch;white-space:pre-line}

.legend{display:flex;gap:18px;flex-wrap:wrap;align-items:center;padding-block:14px;border-top:1px solid var(--rule)}
.legend span{display:inline-flex;align-items:center;gap:8px}
.sw{width:16px;height:16px;display:inline-block;border:1px solid var(--rule)}
.sw.open,.cell.open{background:var(--bg);border-color:var(--blue);color:var(--blue)}
.sw.booked,.cell.booked{background:var(--ink);border-color:var(--ink);color:var(--bg)}
.sw.off,.cell.off{background:var(--paper);border-color:var(--hair);color:var(--muted);
  background-image:repeating-linear-gradient(135deg,transparent 0 5px,var(--hair) 5px 6px)}

.grid-wrap{overflow-x:auto;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);margin-bottom:32px}
table.sched{border-collapse:separate;border-spacing:4px;min-width:640px;width:100%}
.sched th{font-family:var(--mono);font-size:12px;font-weight:500;letter-spacing:.06em;padding:8px 4px;text-align:center}
.sched th.day.weekend{color:var(--blue)}
.sched th.time{position:sticky;left:0;background:var(--bg);text-align:right;padding-right:10px;width:64px;font-variant-numeric:tabular-nums;color:var(--muted)}
.cell{display:flex;align-items:center;justify-content:center;height:38px;border:1px solid;font-size:12px;font-weight:700;width:100%}
.sched td{padding:0}
.sum{display:flex;gap:28px;flex-wrap:wrap;padding-block:6px 20px}
.sum b{font-family:var(--wide);font-stretch:62%;font-weight:900;font-size:40px;line-height:1;color:var(--blue);font-variant-numeric:tabular-nums}
.sum div{display:grid;gap:4px}
.cta{display:flex;gap:0;flex-wrap:wrap;margin-bottom:56px}
.cta a,.btn{font-family:var(--mono);font-size:12px;letter-spacing:.06em;text-transform:uppercase;text-decoration:none;padding:12px 18px;border:1px solid var(--rule);background:none;color:var(--ink);cursor:pointer}
.cta a + a{border-left:0}
.cta a.on,.btn.on{background:var(--blue);border-color:var(--blue);color:var(--on-blue)}
.empty{padding:40px 0;color:var(--muted)}
footer{border-top:1px solid var(--rule);padding-block:18px;color:var(--muted)}
@media (max-width:600px){
  table.sched{min-width:0;border-spacing:2px}
  .sched th{font-size:11px;padding:6px 0}
  .sched th.time{width:40px;font-size:10px;padding-right:4px}
  .cell{height:30px;font-size:10px;font-weight:700}
}

/* 주차별 표 */
.week{margin-bottom:36px}
.week-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap;padding-block:12px 8px;border-top:2px solid var(--ink)}
.week-head h2{font-weight:900;font-size:clamp(20px,2.4vw,28px);letter-spacing:-.04em}
.week-head .cnt{color:var(--blue)}
.week .grid-wrap{border-top:0;margin-bottom:0}
table.wk{border-collapse:separate;border-spacing:3px;width:100%;min-width:760px;table-layout:fixed}
.wk th{font-family:var(--mono);font-size:11px;font-weight:500;padding:6px 0;text-align:center;color:var(--muted);font-variant-numeric:tabular-nums}
.wk th.d{position:sticky;left:0;background:var(--bg);width:44px;text-align:left;padding-left:2px;color:var(--ink);font-family:var(--kr);font-weight:700;font-size:14px;z-index:1}
.wk td{padding:0}
.wk .cell{height:34px;font-size:11px}
.wk th small{display:block;font-size:9.5px;opacity:.7}
@media (max-width:600px){table.wk{min-width:620px}.wk .cell{height:30px;font-size:10px}}
.week-tools{display:flex;gap:8px;flex-wrap:wrap;align-items:center;padding-block:8px}
.week-tools input{max-width:220px;padding:7px 10px}