/* 이루다 IEP 오늘의 수업(시간표) v1 — 113-v8-timetable.js 짝 스타일(2026-09-24). v8 토큰(iepro-v8.css) 위에서만 쓴다.
 * 교시 카드: docs/design/home_desktop_v8.html "오늘의 수업" 값(높이 84px, 둥글기 14px, 1px 선 / 지금=검정 / 준비하기=점선 / 점심=급식 옅은 바탕).
 * 대비: 작은 흐린 글자 #767676(흰 바탕 4.5:1), 준비됨 #1F6B4F, 급식 라벨 #8A5E00(옅은 바탕 위 5:1 이상), 알레르기 #8A3A1E. 색만으로 구분하지 않도록 글자(준비됨·지금·준비하기·알레르기 n)를 같이 쓴다. */
.v8 .v8-tt .v8-block-head{flex-wrap:wrap;row-gap:0}
.v8 .v8-tt .v8-block-title{white-space:nowrap}
.v8 .v8-tt-headacts{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.v8 .v8-tt-sum{display:inline-flex;align-items:center;gap:4px;min-height:44px;padding:0 6px;border:0;background:none;font:inherit;font-size:13px;color:var(--v8-ink-2);cursor:pointer;border-radius:var(--v8-r-btn-sm)}
.v8 .v8-tt-sum:hover{color:var(--v8-ink)}
.v8 .v8-tt-sum svg{width:14px;height:14px;transition:transform var(--v8-dur) var(--v8-ease)}
.v8 .v8-tt-sum[aria-expanded="true"] svg{transform:rotate(180deg)}
.v8 .v8-tt-body{display:flex;flex-direction:column;gap:12px;min-width:0}
.v8 .v8-tt-cards{display:grid;grid-template-columns:repeat(var(--n,6),minmax(0,1fr));gap:8px}
.v8 .v8-tt-card{height:84px;box-sizing:border-box;border-radius:14px;border:1px solid var(--v8-line-2);background:#fff;color:var(--v8-ink);padding:10px 12px;display:flex;flex-direction:column;justify-content:space-between;align-items:flex-start;text-align:left;font:inherit;cursor:pointer;min-width:0;transition:border-color var(--v8-dur) var(--v8-ease),transform var(--v8-dur) var(--v8-ease)}
.v8 .v8-tt-card:hover{border-color:#BDBDBD}
.v8 .v8-tt-card-top{font-size:11px;color:var(--v8-ink-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.v8 .v8-tt-card-subj{font-size:15px;font-weight:600;line-height:1.25;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.v8 .v8-tt-card-state{font-size:11px;font-weight:600;display:inline-flex;align-items:center;gap:3px;white-space:nowrap}
.v8 .v8-tt-card-state svg{width:12px;height:12px;stroke-width:2.4}
.v8 .v8-tt-card-state.is-ok{color:var(--fx-iep)}
.v8 .v8-tt-card.is-todo{border:1.5px dashed #D2D2D2}
.v8 .v8-tt-card.is-past .v8-tt-card-state{color:var(--v8-ink-3);font-weight:500}
.v8 .v8-tt-card.is-now{background:#111;border-color:#111;color:#fff}
.v8 .v8-tt-card.is-now .v8-tt-card-top{color:#BDBDBD}
.v8 .v8-tt-card.is-lunch{background:var(--fx-meal-bg);border-color:transparent}
.v8 .v8-tt-card.is-lunch .v8-tt-card-top{color:var(--fx-meal)}
.v8 .v8-tt-card.is-lunch .v8-tt-card-state{color:var(--fx-meal)}
.v8 .v8-tt-card-state.is-warn,.v8 .v8-tt-card.is-lunch .v8-tt-card-state.is-warn{color:#8A3A1E}
.v8 .v8-tt-card-state.is-warn svg{stroke-width:2.2}
@media (max-width:767px){
  .v8 .v8-tt-cards{display:flex;overflow-x:auto;gap:8px;margin:0 -16px;padding:0 16px 4px;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch}
  .v8 .v8-tt-card{width:96px;flex:0 0 96px;scroll-snap-align:start}
}
@media (min-width:768px) and (max-width:1100px){.v8 .v8-tt-cards{grid-template-columns:repeat(auto-fill,minmax(96px,1fr))}}
.v8 .v8-tt-note,.v8 .v8-tt-flash,.v8 .v8-tt-neis{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:14px;border:1px solid var(--v8-line-2);border-radius:14px;padding:10px 14px}
.v8 .v8-tt-note svg{width:18px;height:18px;color:#8A3A1E;flex:none}
.v8 .v8-tt-note span,.v8 .v8-tt-flash span{flex:1;min-width:180px}
.v8 .v8-tt-neis{border-style:dashed;font-size:13px;color:var(--fx-ppt);padding:6px 10px}
.v8 .v8-tt-list{display:flex;flex-direction:column;border-top:1px solid var(--v8-line)}
.v8 .v8-tt-list[hidden]{display:none}
.v8 .v8-tt-item{display:grid;grid-template-columns:92px minmax(0,1fr);gap:14px;padding:14px 0;border-bottom:1px solid var(--v8-line);scroll-margin:80px}
.v8 .v8-tt-item.is-focus{background:linear-gradient(90deg,#F7F7F5,transparent 60%)}
.v8 .v8-tt-item-time{display:flex;flex-direction:column;gap:2px;font-size:13px;color:var(--v8-ink-3)}
.v8 .v8-tt-item-time b{font-size:15px;color:var(--v8-ink)}
.v8 .v8-tt-item.is-now .v8-tt-item-time b::after{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:#111;margin-left:6px;vertical-align:middle}
.v8 .v8-tt-item-main{display:flex;flex-direction:column;gap:8px;min-width:0}
.v8 .v8-tt-item-title{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:17px;font-weight:600}
.v8 .v8-tt-badge-now{background:#111;color:#fff;border-color:#111}
.v8 .v8-tt-item-meta{display:flex;flex-direction:column;gap:4px;font-size:13px;color:var(--v8-ink-2);min-width:0;overflow-wrap:anywhere}
.v8 .v8-tt-mat{color:var(--v8-ink)}
.v8 .v8-tt-mat .v8-fx-label{color:var(--fx-ppt);font-weight:600}
.v8 .v8-tt-acts{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.v8 .v8-tt-acts .v8-btn--sm{min-height:44px}
.v8 .v8-tt-who{display:flex;flex-wrap:wrap;gap:6px}
.v8 .v8-tt-who .v8-chip{min-height:40px}
.v8 .v8-tt-menu{margin:0;padding:0;list-style:none;display:flex;flex-wrap:wrap;gap:6px 12px;font-size:14px}
.v8 .v8-tt-allergy{display:flex;flex-direction:column;gap:4px;font-size:13px;color:#8A3A1E;border:1px solid #F0D2C8;border-radius:12px;padding:10px 12px}
.v8 .v8-tt-allergy .v8-small{color:var(--v8-ink-3)}
@media (max-width:599px){.v8 .v8-tt-item{grid-template-columns:1fr;gap:6px}.v8 .v8-tt-item-time{flex-direction:row;gap:8px;align-items:baseline}}

/* ── 시간표 설정 화면 ── */
.v8 .v8-tt-main{gap:28px}
.v8 .v8-tt-editor{display:flex;flex-direction:column;gap:18px;min-width:0;max-width:980px}
.v8 .v8-tt-boardbar{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.v8 .v8-tt-info{margin:0}
.v8 .v8-tt-tools{display:flex;flex-wrap:wrap;gap:8px;align-items:center;position:sticky;top:0;z-index:5;background:#fff;padding:8px 0;border-bottom:1px solid var(--v8-line)}
.v8 .v8-tt-tools .v8-btn--sm{min-height:44px}
.v8 .v8-tt-tools .v8-tt-save{margin-left:auto}
.v8 .v8-tt-msg{margin:0;min-height:20px;font-size:14px;color:var(--v8-ink-2)}
.v8 .v8-tt-msg.is-bad,.v8 .v8-tt-err{color:var(--v8-danger)}
.v8 .v8-tt-err{margin:0;font-size:14px}
.v8 .v8-tt-err:empty{display:none}
.v8 .v8-tt-pastebar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;background:#111;color:#fff;border-radius:14px;padding:8px 8px 8px 16px;font-size:14px}
.v8 .v8-tt-pastebar .v8-btn{background:#fff;color:#111;border-color:#fff}
.v8 .v8-tt-gridwrap{overflow-x:auto;min-width:0}
.v8 .v8-tt-grid{width:100%;border-collapse:separate;border-spacing:6px;table-layout:fixed;margin:0 -6px}
.v8 .v8-tt-grid th{font-size:13px;font-weight:600;color:var(--v8-ink-2);text-align:center;padding:2px}
.v8 .v8-tt-grid thead th:first-child,.v8 .v8-tt-grid tbody th{width:78px;text-align:left}
.v8 .v8-tt-grid tbody th{display:table-cell;vertical-align:middle}
.v8 .v8-tt-grid tbody th small{display:block;font-size:11px;font-weight:500;color:var(--v8-ink-3)}
.v8 .v8-tt-rowlabel{display:block;color:var(--v8-ink);word-break:keep-all;overflow-wrap:anywhere}
.v8 .v8-tt-dayhead{width:100%;min-height:44px;border:0;border-radius:10px;background:none;font:inherit;font-weight:700;font-size:15px;color:var(--v8-ink);cursor:pointer}
.v8 .v8-tt-dayhead:hover{background:var(--v8-soft)}
.v8 .v8-tt-cell{width:100%;min-height:56px;border:1px solid var(--v8-line-2);border-radius:12px;background:#fff;color:var(--v8-ink);font:inherit;font-size:14px;font-weight:600;line-height:1.25;padding:6px 4px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;cursor:pointer;word-break:keep-all;overflow-wrap:anywhere;text-align:center;transition:border-color var(--v8-dur) var(--v8-ease),background var(--v8-dur) var(--v8-ease)}
.v8 .v8-tt-cell:hover{border-color:#9A9A9A}
.v8 .v8-tt-cell.is-empty{border-style:dashed;border-color:#D2D2D2;color:var(--v8-ink-3)}
.v8 .v8-tt-cell.is-file{border:1.5px dashed var(--fx-ws);background:var(--fx-ws-bg)}
.v8 .v8-tt-tag{font-size:10.5px;font-weight:600;line-height:1;color:var(--v8-ink-3);white-space:nowrap}
.v8 .v8-tt-tag.is-neis{color:var(--fx-ppt)}
.v8 .v8-tt-tag.is-file{color:var(--fx-ws)}
.v8 .v8-tt-tag.is-stu{color:var(--fx-gibu)}
.v8 .v8-tt-tag.is-warn{color:#8A3A1E}
.v8 .v8-tt-lunchrow{background:var(--fx-meal-bg);color:var(--fx-meal) !important;border-radius:10px;font-size:13px;padding:8px 10px !important;text-align:left}
.v8 .v8-tt-legend{margin:6px 0 0}
.v8 .v8-tt-pick[aria-pressed="true"]{background:#111;border-color:#111;color:#fff}
.v8 .v8-tt-pick[aria-pressed="true"] .v8-tt-tag{color:#E6E6E6}
.v8 .v8-tt-pick[aria-pressed="true"] .v8-tt-tag.is-warn{color:#FFD2C4}
.v8 .v8-tt-grid--read td{border:1px solid var(--v8-line-2);border-radius:10px;padding:8px 4px;text-align:center;font-size:13px;font-weight:600;word-break:keep-all;overflow-wrap:anywhere}
.v8 .v8-tt-periods{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:15px;font-weight:600}
.v8 .v8-tt-round{width:44px;min-height:44px;padding:0;border-radius:9999px}
.v8 .v8-tt-round svg{margin:0}
.v8 .v8-tt-lunchsel{width:auto;min-width:160px;margin-left:12px}
.v8 .v8-tt-sec{border-top:1px solid var(--v8-line);padding-top:18px;display:flex;flex-direction:column;gap:10px}
.v8 .v8-tt-sec>.v8-btn{align-self:flex-start}
.v8 details.v8-tt-sec>summary{cursor:pointer;min-height:44px;display:flex;align-items:center;list-style:none}
.v8 details.v8-tt-sec>summary::-webkit-details-marker{display:none}
.v8 details.v8-tt-sec>summary::after{content:"";width:8px;height:8px;border-right:1.7px solid currentColor;border-bottom:1.7px solid currentColor;transform:rotate(45deg);margin-left:10px;margin-top:-4px;transition:transform var(--v8-dur) var(--v8-ease)}
.v8 details.v8-tt-sec[open]>summary::after{transform:rotate(225deg);margin-top:4px}
.v8 .v8-tt-bells{display:flex;flex-direction:column;gap:8px}
.v8 .v8-tt-bellrow{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.v8 .v8-tt-bellrow .v8-input:not(.v8-tt-time){flex:1;min-width:140px;max-width:260px}
.v8 .v8-tt-bellname{width:52px;font-weight:600;font-size:14px}
.v8 .v8-tt-time{width:128px;min-height:44px}
.v8 .v8-tt-lunchchk{display:inline-flex;align-items:center;gap:6px;min-height:44px;font-size:14px}
.v8 .v8-tt-lunchchk input{width:20px;height:20px}
.v8 .v8-tt-quick{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end;background:var(--v8-soft-2);border-radius:14px;padding:12px}
.v8 .v8-tt-quickf{display:flex;flex-direction:column;gap:4px}
.v8 .v8-tt-quick input[type="number"]{width:92px}
.v8 .v8-tt-chips{display:flex;flex-wrap:wrap;gap:8px}
.v8 .v8-tt-chips .v8-chip{min-height:44px}
.v8 .v8-tt-stulist{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.v8 .v8-tt-sturow{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:10px 0;border-top:1px solid var(--v8-line);font-size:14px}
.v8 .v8-tt-date{max-width:220px}
.v8 .v8-tt-daylist{display:flex;flex-direction:column}
.v8 .v8-tt-dayrow{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:6px 0;border-top:1px solid var(--v8-line);font-size:14px}
.v8 .v8-tt-dayrow b{width:88px}
.v8 .v8-tt-dayval{flex:1;min-width:80px}
.v8 .v8-tt-dayval.is-over{font-weight:600}
.v8 .v8-tt-setup{display:flex;flex-direction:column;gap:14px}
.v8 .v8-tt-kinds{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.v8 .v8-tt-kind{display:flex;flex-direction:column;align-items:flex-start;gap:6px;text-align:left;border:1px solid var(--v8-line-2);border-radius:16px;background:#fff;padding:14px;font:inherit;cursor:pointer;min-height:44px;color:var(--v8-ink)}
.v8 .v8-tt-kind:hover{border-color:#9A9A9A}
.v8 .v8-tt-kind[aria-checked="true"]{border:1.5px solid #111;box-shadow:inset 0 0 0 1px #111}
.v8 .v8-tt-kind-name{font-size:16px;font-weight:700}
.v8 .v8-tt-step{display:flex;flex-direction:column;gap:12px;max-width:520px}
@media (max-width:767px){
  .v8 .v8-tt-kinds{grid-template-columns:1fr}
  .v8 .v8-tt-grid{border-spacing:3px;margin:0 -3px}
  .v8 .v8-tt-grid thead th:first-child,.v8 .v8-tt-grid tbody th{width:46px;font-size:12px}
  .v8 .v8-tt-grid tbody th small{display:none}
  .v8 .v8-tt-cell{min-height:52px;font-size:12.5px;padding:4px 2px;border-radius:10px}
  .v8 .v8-tt-tag{font-size:9.5px}
  .v8 .v8-tt-tools .v8-tt-save{margin-left:0}
  .v8 .v8-tt-lunchsel{margin-left:0}
}
/* 창(과목 고르기·자료 연결·파일 읽기) — 폰에서는 아래에서 올라오는 시트 */
dialog.v8-tt-dialog{box-sizing:border-box;width:min(600px,94vw);max-height:88vh;border:1px solid #E2E2E2;border-radius:22px;padding:20px;box-shadow:0 16px 40px rgba(0,0,0,.12);background:#fff;color:#111;font-family:Pretendard,-apple-system,BlinkMacSystemFont,'Apple SD Gothic Neo','Malgun Gothic',sans-serif;overflow-y:auto}
dialog.v8-tt-dialog::backdrop{background:rgba(17,17,17,.35)}
.v8.v8-tt-dialog[open]{display:flex;flex-direction:column;gap:14px}
.v8 .v8-tt-dlg-head{display:flex;justify-content:space-between;align-items:center;gap:12px}
.v8 .v8-tt-dlg-body{display:flex;flex-direction:column;gap:12px}
.v8 .v8-tt-free{display:flex;gap:8px}
.v8 .v8-tt-free .v8-input{flex:1}
.v8 .v8-tt-matlist{border:0;margin:0;padding:0;display:flex;flex-direction:column;max-height:50vh;overflow-y:auto}
.v8 .v8-tt-matrow{display:flex;gap:12px;align-items:flex-start;padding:10px 4px;border-top:1px solid var(--v8-line);cursor:pointer;min-height:44px}
.v8 .v8-tt-matrow input{width:20px;height:20px;margin-top:2px;flex:none}
.v8 .v8-tt-matrow>span{display:flex;flex-direction:column;gap:2px;min-width:0}
.v8 .v8-tt-matname{font-weight:600;overflow-wrap:anywhere}
.v8 .v8-tt-hc{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;font-size:14px}
@media (max-width:599px){
  dialog.v8-tt-dialog{width:100vw;max-width:100vw;margin:auto 0 0;border-radius:22px 22px 0 0;max-height:90vh;padding:16px 16px calc(20px + env(safe-area-inset-bottom))}
}
@media (prefers-reduced-motion:reduce){.v8 .v8-tt-card,.v8 .v8-tt-cell,.v8 .v8-tt-sum svg,.v8 details.v8-tt-sec>summary::after{transition:none}}

/* 2026-09-24 점심 시작·끝 시각을 교시 수 옆에 바로 보이게 */
.v8-tt-lunchtime{display:inline-flex;align-items:center;gap:6px;flex-wrap:wrap}
.v8-tt-lunchtime .v8-tt-time{width:auto;min-width:110px}

/* 2026-09-24 전담: 전담 선생님 수업은 흐리게(옅은 바탕·보통 굵기) 하되 글자 대비 4.5:1 이상(#6E6E73·#555 on #F7F7F5/#F4F4F2), 글자("전담")로도 구분 */
.v8 .v8-tt-card.is-spec{background:var(--v8-soft-2);border:1px solid var(--v8-line-2)}
.v8 .v8-tt-card.is-spec .v8-tt-card-top,.v8 .v8-tt-card.is-spec .v8-tt-card-state{color:var(--v8-ink-2);font-weight:500}
.v8 .v8-tt-card.is-spec .v8-tt-card-subj{color:#555;font-weight:500}
.v8 .v8-tt-item.is-spec .v8-tt-item-title{color:var(--v8-ink-2);font-weight:500}
.v8 .v8-tt-cell.is-spec{background:var(--v8-soft);border-color:var(--v8-line-2);color:#555;font-weight:500}
.v8 .v8-tt-tag.is-spec{color:var(--v8-ink-2)}
.v8 .v8-tt-cell-sub{font-size:11px;font-weight:500;color:var(--v8-ink-2);line-height:1.1}
.v8 .v8-tt-grid--read td.is-warn{border-color:#E7B9A9;color:#8A3A1E}
.v8 .v8-tt-speclist{display:flex;flex-direction:column}
.v8 .v8-tt-specrow{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:8px 0;border-top:1px solid var(--v8-line);font-size:14px}
.v8 .v8-tt-specrow b{min-width:72px}
.v8 .v8-tt-specrow .v8-input{flex:1;min-width:160px;max-width:260px;min-height:44px;box-sizing:border-box}
.v8 .v8-tt-infobar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:14px;font-weight:600}
.v8 .v8-tt-infobar .v8-btn--sm{min-height:44px}
.v8 .v8-tt-clsgroup{border:0;margin:0;padding:0;display:flex;flex-direction:column;gap:6px;min-width:0}
.v8 .v8-tt-clsgroup legend{font-size:13px;font-weight:600;color:var(--v8-ink-2);padding:0;margin-bottom:4px}
.v8 .v8-tt-kinds{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}
@media (max-width:767px){.v8 .v8-tt-kinds{grid-template-columns:1fr}.v8 .v8-tt-cell-sub{font-size:10px}}