:root{--navy:#1f2a44;--or:#f7931e;--line:#e3e6ec;--bg:#f5f6f9;--tx:#222b3a;--mut:#7a8496;--ok:#1e9e62;--wait:#2f6fdb;--bad:#d9453c}
*{box-sizing:border-box}
body{margin:0;font-family:"Pretendard","Malgun Gothic",system-ui,sans-serif;color:var(--tx);background:var(--bg);font-size:15px}
[hidden]{display:none!important}
a{color:var(--wait)}

/* 틀 — 왼쪽 메뉴 + 본문. 메뉴는 줄이면 아이콘만(60px), 줄인 상태는 common.js 가 기억한다. 배경은 학원 남색(로고타입 규약) */
.wrap{display:grid;grid-template-columns:auto minmax(0,1fr);min-height:100vh}
aside{width:210px;background:#142C56;color:#e1eafa;display:flex;flex-direction:column;padding:10px 8px;transition:width .15s;position:sticky;top:0;height:100vh;overflow-y:auto;overflow-x:hidden;align-self:start}
aside.min{width:60px}
aside svg{flex:none;width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
/* 왼쪽 메뉴 — 머리줄 + 구분선 · 지금 화면은 옅은 바탕 + 왼쪽 주황 줄 · 계정은 한 칸(원장님 「권장대로」 2026-10-14) */
aside .head{flex:none;display:flex;align-items:center;gap:6px;padding:4px 2px 12px 4px;margin-bottom:8px;border-bottom:1px solid rgba(255,255,255,.12)}
aside .tg{background:none;border:0;color:#c3d4ee;cursor:pointer;width:30px;height:30px;border-radius:8px;display:grid;place-items:center;flex:none;text-decoration:none}
aside .tg:hover{background:#26407a;color:#fff}
aside .tg.on{color:var(--or)}
aside .logo{flex:1;min-width:0;display:flex;align-items:center;gap:10px;color:#fff;font-weight:800;font-size:15.5px;letter-spacing:-.02em;padding:4px;border-radius:8px;text-decoration:none;white-space:nowrap}
aside .logo img{width:30px;height:30px;flex:none;border-radius:8px;box-shadow:0 0 0 1px rgba(255,255,255,.22)}
aside .mi{position:relative;display:flex;align-items:center;gap:12px;padding:9px 10px;border-radius:8px;color:#e1eafa;text-decoration:none;font-size:14px;cursor:pointer;white-space:nowrap}
aside .mi:hover{background:#26407a}
aside .mi.on{background:rgba(255,255,255,.1);color:#fff;font-weight:700}
aside .mi.on::before{content:"";position:absolute;left:-8px;top:7px;bottom:7px;width:3px;border-radius:0 3px 3px 0;background:var(--or)}
aside .mi.on svg{color:var(--or)}
aside .mi.dis{color:#8fabd6;cursor:default}
aside .mi.dis:hover{background:none}
aside .mi small{font-size:10px;background:#2f4a85;border-radius:4px;padding:0 5px;margin-left:auto}
aside .mg{flex:none;display:flex;align-items:center;gap:8px;font-size:11px;letter-spacing:.04em;color:#7f9bc8;padding:16px 10px 6px;white-space:nowrap;cursor:default;overflow:hidden}
aside .mg::after{content:"";flex:1;height:1px;background:rgba(255,255,255,.1)}
aside .mg.fold{cursor:pointer}
aside .mg.fold:hover{color:#fff}
aside .mold{display:none}
aside .mold.open{display:block}
aside .fill{flex:1;min-height:10px}
aside .acct{flex:none;display:flex;align-items:center;gap:6px;padding:7px 4px 7px 8px;background:rgba(255,255,255,.06);border-radius:10px}
aside .acct .av{width:30px;height:30px;border-radius:50%;background:var(--or);color:#fff;display:grid;place-items:center;font-weight:800;font-size:13px;flex:none;margin-right:4px}
aside .acct .who{flex:1;min-width:0;line-height:1.2;overflow:hidden}
aside .acct .who b{display:block;color:#fff;font-size:13.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
aside .acct .who small{display:block;color:#8fabd6;font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
aside .acct .tg svg{width:18px;height:18px}
aside .brand{margin:16px 0 6px;padding:14px 2px 4px;text-align:center;white-space:nowrap;line-height:1.3;border-top:1px solid #2c4272}
aside .brand .lt{font-size:36px;display:inline-flex;align-items:baseline;justify-content:center;letter-spacing:-.01em;color:#FBAE40;white-space:nowrap;font-family:Pretendard,"Malgun Gothic",sans-serif}
aside .brand .lt b{font-weight:900;font-size:1em;line-height:1}
aside .brand .lt i{font-style:normal;font-weight:400;font-size:.6em;margin:0 .08em}
aside .brand .lt-name{display:block;margin-top:4px;color:#fff;font-weight:900;font-size:25.9px;line-height:1.1;letter-spacing:-.02em;font-family:Pretendard,"Malgun Gothic",sans-serif}
/* 화면이 낮은 노트북 — 메뉴가 넘쳐 스크롤이 생기지 않게 높이에 따라 촘촘하게 줄인다(2026-10-14) */
aside{scrollbar-width:thin}
@media (max-height:920px){
  aside .head{padding-bottom:8px;margin-bottom:4px}
  aside .mi{padding:6px 10px}aside .mg{padding:10px 10px 3px}
  aside .brand{margin:10px 0 4px;padding:10px 2px 2px}aside .brand .lt{font-size:30px}aside .brand .lt-name{font-size:21.5px}
}
@media (max-height:780px){
  aside{padding:6px 8px}aside .mi{padding:4px 10px;font-size:13px}aside .mg{padding:6px 10px 2px}
  aside .acct{padding:4px 4px 4px 6px}
  aside .brand{margin:6px 0 2px;padding:8px 2px 0}aside .brand .lt{font-size:24px}aside .brand .lt-name{font-size:17px}
}
/* 줄였을 때 — 아이콘만. 머리의 줄이기 단추는 아이콘 아래로, 계정 단추는 세로로 */
aside.min .lbl,aside.min .mg span,aside.min .mi small,aside.min .brand{display:none}
aside.min .head{flex-direction:column;gap:6px;padding:4px 0 10px}
aside.min .logo{flex:none;padding:0}
aside.min .mi{justify-content:center;padding:9px 0}
aside.min .mg{justify-content:center;padding:10px 0 2px}
aside.min .mg::after{content:"···";flex:none;height:auto;background:none}
aside.min .acct{flex-direction:column;padding:6px 0;gap:4px}
aside.min .acct .av{margin:0}
main{padding:22px 26px 60px;min-width:0}

h1{font-size:22px;margin:0 0 4px}
h2{font-size:16px;margin:18px 0 8px}
.sub{color:var(--mut);margin:0 0 16px;font-size:14px}
.head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;flex-wrap:wrap}
.acts{display:flex;gap:8px;flex-wrap:wrap}
.note{color:var(--mut);font-size:13px;margin-top:12px;line-height:1.6}
.err{color:var(--bad);font-size:14px;margin:8px 0 0;min-height:1.2em}
/* 학교별 과목 정보: 상담에 쓰는 표 위, 자료 확인 · 관리는 아래 */
.ssbox{position:relative;background:#fff;border:1px solid var(--line,#e3e8f0);border-top:4px solid #142C56;border-radius:14px;box-shadow:0 4px 16px rgba(20,44,86,.08);padding:16px 18px 10px;margin-top:6px}
.ssbox .ssbar{padding-right:110px;margin-bottom:10px}
.ssbox .tscroll{margin:0 -6px}
.ssfs{position:absolute;top:14px;right:16px;font:inherit;font-size:12.5px;padding:5px 10px;border:1px solid var(--line,#e3e8f0);border-radius:8px;background:#fff;color:var(--mut);cursor:pointer}
.ssfs:hover{color:var(--tx);border-color:var(--mut)}
.ssbox:fullscreen{overflow:auto;border:0;border-radius:0;box-shadow:none;padding:16px 28px}
.ssbox:fullscreen .ssfs{top:16px;right:28px}
.ssbox:fullscreen .tscroll{margin:0;overflow-x:hidden}
.chips{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 12px}.chips:empty{display:none}
.chip{background:#f1f4fa;border-radius:999px;padding:5px 12px;font-size:13px;color:#33415c}.chip b{color:#142C56}
.ssbox .sstab thead th{background:#e6ecf7;color:#142C56}
.ssbox .sstab th.bh{text-align:left}
.sstab td.bcell{text-align:left}
.ssbox .sstab td.nm{white-space:nowrap}
.sstab .bc{display:flex;align-items:center;gap:10px}
.sstab .bc .v{flex:0 0 38px;text-align:right}
.sstab .bc .trk{flex:1 1 80px;min-width:80px;height:8px;background:#eef1f7;border-radius:4px;overflow:hidden}
.sstab .bc .fil{display:block;height:100%;border-radius:4px}
/* A · E 는 굵고 진하게(상담에서 짚는 곳), B · C · D 는 가늘고 연하게 */
.sstab .bc:has(.gA) .trk,.sstab .bc:has(.gE) .trk{height:14px;border-radius:7px}
.sstab .bc:has(.gA) .fil,.sstab .bc:has(.gE) .fil{border-radius:7px}
.sstab .fil.gA{background:#142C56}.sstab .fil.gE{background:#5B6F96}
.sstab .fil.gB,.sstab .fil.gC,.sstab .fil.gD{background:#C3CDE0}
.sstab td.top .v{font-weight:800}.sstab td.top .fil{background:var(--or)}
.sstab .dot{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:8px;vertical-align:1px;background:#c5ccd9}
.sstab .dot.ac-국어{background:#e0685d}.sstab .dot.ac-수학{background:#4f86e0}.sstab .dot.ac-영어{background:#3fb27f}.sstab .dot.ac-한국사{background:#e0a23a}.sstab .dot.ac-사회{background:#9a6fd6}.sstab .dot.ac-과학{background:#3aa6b5}
.ssmanage{margin-top:48px;padding:14px 22px;background:#f4f6fa;border:1px dashed #c9d3e3;border-radius:14px}
.ssmanage[open]{padding-bottom:24px}
.ssmanage>summary{cursor:pointer;list-style:none;font-size:16px;font-weight:700;color:var(--tx);user-select:none}
.ssmanage>summary::-webkit-details-marker{display:none}
.ssmanage>summary small{font-size:12.5px;font-weight:400;color:var(--mut);margin-left:8px}
.ssmanage .ssarw{display:inline-block;width:1em;transition:transform .15s}
.ssmanage[open] .ssarw{transform:rotate(90deg)}
/* 로그인 화면: 아이디 저장 · 자동 로그인 */
.opts{display:flex;gap:18px;margin:2px 0 4px;font-size:14px;color:var(--mut)}
.opts label{display:inline-flex;align-items:center;gap:6px;cursor:pointer}
.opts input{width:auto;margin:0}
.center .hint{color:var(--mut);font-size:12.5px;margin:4px 0 0}
.warn{background:#fff7e8;border:1px solid #f3d49a;color:#8a5a00;border-radius:8px;padding:8px 12px;font-size:13.5px;margin-bottom:12px;line-height:1.6}

.btn{font:inherit;border:1px solid var(--line);background:#fff;border-radius:8px;padding:9px 14px;cursor:pointer;color:var(--tx);white-space:nowrap}
.btn:disabled{opacity:.5;cursor:default}
.btn.pri{background:var(--navy);border-color:var(--navy);color:#fff;font-weight:700}
.btn.or{background:var(--or);border-color:var(--or);color:#fff;font-weight:700}
.btn.sm{padding:4px 9px;font-size:12.5px;color:var(--mut)}
.chip{border:1px solid var(--line);background:#fff;border-radius:999px;padding:7px 14px;cursor:pointer;font:inherit;color:var(--tx)}
.chip.on{background:var(--navy);border-color:var(--navy);color:#fff;font-weight:700}
select,input[type=search],input[type=text],input[type=password],input[type=tel],input[type=date],textarea{font:inherit;padding:8px 10px;border:1px solid var(--line);border-radius:8px;background:#fff;color:var(--tx)}
input[type=search]{min-width:200px}
textarea{width:100%;min-height:74px;resize:vertical}

.box{background:#fff;border:1px solid var(--line);border-radius:12px;padding:16px 18px;margin-bottom:14px}
.step{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:10px}
.step:last-child{margin-bottom:0}
.step b.n{flex:none;width:52px;font-size:13px;color:var(--mut)}
.sum{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-bottom:14px}
.sum>div{background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px 14px}
.sum span{display:block;font-size:12.5px;color:var(--mut)}
.sum span.u{display:inline}
.sum b{font-size:22px}

table.list{width:100%;border-collapse:collapse;background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden}
table.list th,table.list td{padding:10px 12px;border-bottom:1px solid var(--line);text-align:left;vertical-align:middle}
table.list th{background:#f0f2f7;font-size:13px;color:#566078;white-space:nowrap}
table.list tr:last-child td{border-bottom:0}
table.list tbody tr[data-id]{cursor:pointer}
table.list tbody tr[data-id]:hover{background:#fafbfd}
td.no{width:36px;color:var(--mut);text-align:center}
td.nm b{font-size:15.5px}
td small{display:block;color:var(--mut);font-size:12.5px}
td.empty{text-align:center;color:var(--mut);padding:30px}
.tag{display:inline-block;background:#eef1f7;color:#3d4a66;border-radius:6px;padding:3px 8px;font-size:12.5px;margin:2px 4px 2px 0;white-space:nowrap}
.tag.solo{background:#fff1d9;color:#a86400}
.st{display:inline-block;border-radius:999px;padding:3px 10px;font-size:12.5px;font-weight:700;white-space:nowrap}
.st.in{background:#dff5ea;color:var(--ok)}.st.rest{background:#fff1d9;color:#a86400}.st.out{background:#eef0f4;color:#7a8496}
.st.new{background:#e4edfd;color:var(--wait)}.st.chg{background:#fff1d9;color:#a86400}.st.ask{background:#eef0f4;color:#566078}

/* 옆에서 열리는 학생 정보 · 가운데 뜨는 창 */
.dim{position:fixed;inset:0;background:rgba(20,28,48,.45);z-index:5}
.drawer{position:fixed;top:0;right:0;bottom:0;width:min(480px,100vw);background:#fff;z-index:6;overflow-y:auto;padding:20px 22px 40px;box-shadow:-8px 0 24px rgba(0,0,0,.12)}
.modal{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);width:min(680px,94vw);max-height:90vh;overflow-y:auto;background:#fff;border-radius:14px;z-index:8;padding:20px 22px;box-shadow:0 12px 40px rgba(0,0,0,.25)}
.modal.narrow{width:min(460px,94vw)}
.dim.top{z-index:7}
.x{float:right;border:0;background:none;font-size:22px;cursor:pointer;color:var(--mut);line-height:1}
dl.info{display:grid;grid-template-columns:96px minmax(0,1fr);gap:8px 10px;margin:0}
dl.info dt{color:var(--mut);font-size:13px;padding-top:2px}
dl.info dd{margin:0}
dl.info small{color:var(--mut);font-size:12.5px;display:block}
.gd{border:1px solid var(--line);border-radius:10px;padding:10px 12px;margin-bottom:8px;display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.gd label{font-size:13.5px;white-space:nowrap;cursor:pointer}
.gd .r{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.foot{display:flex;justify-content:flex-end;gap:8px;margin-top:16px;flex-wrap:wrap}
.field{display:block;margin-bottom:10px}
.field>span{display:block;font-size:13px;color:var(--mut);margin-bottom:4px}
.field input,.field select{width:100%}
.checks label{display:block;padding:5px 0;cursor:pointer}
.chgrow{display:flex;gap:10px;align-items:flex-start;padding:10px 0;border-bottom:1px solid var(--line)}
.chgrow:last-child{border-bottom:0}
.chgrow input{margin-top:4px}
.chgrow .w{flex:1;min-width:0;font-size:13.5px;line-height:1.5}
.chgrow .w b{font-size:15px}
.hist{font-size:13px;line-height:1.6;color:#4a556b;margin:0;padding:0;list-style:none}
.hist li{padding:6px 0;border-bottom:1px solid var(--line)}
.hist li:last-child{border-bottom:0}
.hist time{color:var(--mut);font-size:12px;display:block}
.toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);background:var(--navy);color:#fff;padding:12px 18px;border-radius:10px;font-size:14px;opacity:0;transition:.25s;pointer-events:none;max-width:90vw;z-index:9}
.toast.on{opacity:1}

/* 로그인 · 처음 설정 · 비밀번호 */
.center{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px}
.card{background:#fff;border:1px solid var(--line);border-radius:14px;padding:26px 26px 22px;width:min(380px,100%)}
.card h1{margin-bottom:2px}
.card .btn{width:100%;margin-top:6px;padding:11px}

@media (max-width:820px){
  main{padding:14px 12px 60px} .sum{grid-template-columns:repeat(2,minmax(0,1fr))}
  input[type=search]{min-width:0;flex:1}
  table.list,table.list tbody,table.list tr,table.list td{display:block;width:100%} table.list thead{display:none}
  table.list tr{border-bottom:8px solid var(--bg);padding:8px 4px} table.list td{border:0;padding:4px 10px}
  table.list td.no{display:none} td[data-l]::before{content:attr(data-l);display:block;font-size:12px;color:var(--mut);margin-bottom:2px}
}

/* 자료 올리기 */
.drop{border:2px dashed #c5cbd8;border-radius:12px;padding:16px;text-align:center;color:var(--mut);background:#fbfcfe;cursor:pointer;margin-bottom:12px;line-height:1.6}
.drop.over{border-color:var(--or);background:#fff7e8;color:#8a5a00}
.drop b{color:var(--tx);font-size:16px}
.tools{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;margin:4px 0 10px}
.tools label{font-size:14px;color:var(--mut);cursor:pointer}
.sum .bar{height:6px;background:#eceef3;border-radius:3px;margin-top:8px;overflow:hidden}
.sum .bar i{display:block;height:100%;background:var(--or)}
.cell{display:flex;align-items:center;gap:8px;min-height:44px;border:1.5px dashed #cdd3df;border-radius:10px;padding:6px 10px;cursor:pointer;color:var(--mut);background:#fbfcfe}
.cell:hover,.cell.over{border-color:var(--or);background:#fff7e8}
.cell.has{border-style:solid;border-color:var(--line);background:#fff;color:var(--tx)}
.cell.busy{opacity:.6;pointer-events:none}
.cell .t{flex:1;min-width:0;font-size:13.5px;line-height:1.3}
.cell .t small{display:block;color:var(--mut);font-size:12px}
.thumb{flex:none;width:30px;height:38px;border-radius:4px;background:linear-gradient(#e9edf5,#d6dceb);border:1px solid #c5cbd8;position:relative}
.thumb::after{content:"";position:absolute;left:5px;right:5px;top:8px;height:2px;background:#aab3c7;box-shadow:0 6px #aab3c7,0 12px #aab3c7,0 18px #aab3c7}
.st.none{background:#eef0f4;color:#7a8496}.st.uploaded,.st.reading{background:#fff1d9;color:#a86400}.st.wait{background:#e4edfd;color:var(--wait)}
.st.ok{background:#dff5ea;color:var(--ok)}.st.bad{background:#fde6e4;color:var(--bad)}
input.sc{width:64px;font:inherit;padding:7px 8px;border:1px solid var(--line);border-radius:8px;text-align:right}
.pre{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.pre span{display:flex;align-items:center;gap:4px;white-space:nowrap}
.pre input{margin:0;box-sizing:border-box;height:36px}
td.nm small{white-space:nowrap}
.pre input.sub{width:104px;font:inherit;padding:7px 8px;border:1px solid var(--line);border-radius:8px}
.flist{list-style:none;margin:0;padding:0}
.flist li{display:flex;align-items:center;gap:10px;padding:9px 0;border-bottom:1px solid var(--line)}
.flist li:last-child{border-bottom:0}
.flist .nm{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.flist small{color:var(--mut)}

/* 확인하기 — 왼쪽 원본, 오른쪽 성적 */
.work{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px;align-items:start}
.viewer{position:sticky;top:10px;background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden;display:flex;flex-direction:column;height:calc(100vh - 20px)}
.viewer .bar{display:flex;gap:6px;align-items:center;flex-wrap:wrap;padding:8px 10px;border-bottom:1px solid var(--line);background:#f7f8fb}
.viewer .bar .sp{flex:1}
.viewer .pg{border:1px solid var(--line);background:#fff;border-radius:6px;padding:4px 9px;cursor:pointer;font:inherit;font-size:13px}
.viewer .pg.on{background:var(--navy);border-color:var(--navy);color:#fff;font-weight:700}
.viewer .pg.paper{border-style:dashed}
.viewer .pg.analysis{border-style:dashed;border-color:#e0a24a}
.viewer .view{flex:1;overflow:auto;background:#eef0f4;text-align:center}
.viewer .view img{max-width:none;transform-origin:top left;display:block}
.viewer .view iframe{width:100%;height:100%;border:0;display:block}
.viewer .view p{color:var(--mut);padding:40px 20px}
.subj{background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px 14px;margin-bottom:10px}
.subj.done{background:#fbfcfe}
.grid{display:grid;gap:8px;margin-bottom:8px}
.grid.g1{grid-template-columns:minmax(0,3fr) 64px minmax(0,1.2fr) minmax(0,1.6fr) auto}
.grid.g2{grid-template-columns:repeat(5,minmax(0,1fr))}
.grid.g3{grid-template-columns:repeat(8,minmax(0,1fr))}
.grid.g4{grid-template-columns:repeat(4,minmax(0,1fr))}
.grid label{display:block;min-width:0}
.grid label span{display:block;font-size:11.5px;color:var(--mut);margin-bottom:2px;white-space:nowrap}
.grid input,.grid select,.items input,.items select{width:100%;padding:6px 7px;font-size:14px;min-width:0}
.grid input.n,.items input.n{text-align:right}
.subj details{margin:2px 0 8px}
.subj summary{cursor:pointer;font-size:13px;color:var(--mut);margin-bottom:6px}
table.items{width:100%;border-collapse:collapse;margin-top:4px}
table.items th{font-size:11.5px;color:var(--mut);font-weight:400;text-align:left;padding:0 3px 2px}
table.items td{padding:2px 3px}
table.items td:first-child{width:92px} table.items td.w{width:64px} table.items td.x{width:28px}
table.items.gd td:first-child{width:56px;font-size:12px;color:var(--mut)} table.items.gd th{text-align:center} table.items.gd input{padding:5px 3px;font-size:13px}
.xbtn{border:0;background:none;color:var(--mut);cursor:pointer;font-size:17px;line-height:1;padding:4px}
.xbtn:hover{color:var(--bad)}
.savebar{position:sticky;bottom:0;background:rgba(245,246,249,.96);padding:10px 0;display:flex;gap:8px;justify-content:flex-end;flex-wrap:wrap;border-top:1px solid var(--line);margin-top:10px}
.savebar .sp{flex:1}
@media (max-width:1000px){ .work{grid-template-columns:1fr} .viewer{position:static;height:70vh} .grid.g3{grid-template-columns:repeat(4,minmax(0,1fr))} }
@media (max-width:820px){ .grid.g1{grid-template-columns:1fr 1fr} .grid.g2{grid-template-columns:repeat(3,minmax(0,1fr))} }
p.chk{margin:5px 0 0;font-size:13px;line-height:1.5;min-height:0}
p.chk .ok{color:var(--ok);font-weight:600} p.chk .bad{color:var(--bad);font-weight:600} p.chk .hint{color:#8a5a00;background:#fff7e8;border-radius:4px;padding:1px 6px}
p.chk .peer{color:#8a5a00;font-weight:600}
p.chk .info{color:var(--mut)}

/* 분류 전 자료함 — 폴더째 올리기 창의 고르기 줄, 누구의 자료인지 고르는 칸 */
.drop .more{font-size:13px}
.pick{background:#fbfcfe;margin-bottom:10px}
.pick>div{display:flex;flex-wrap:wrap;gap:6px 14px;align-items:baseline;margin-bottom:8px}
.pick>div:last-child{margin-bottom:0}
.pick b{flex:none;width:76px;font-size:13px;color:var(--mut)}
.pick label{cursor:pointer}
.pick .col{display:flex;flex-direction:column;gap:5px;flex:1;min-width:0}
.pick small{color:var(--mut)}
.opt{display:block;border:1.5px solid var(--line);border-radius:10px;padding:10px 12px;margin-bottom:8px;cursor:pointer}
.opt.on{border-color:var(--navy);background:#f7f9fd}
.opt.off{opacity:.55;cursor:default}
.opt>b{font-size:15px}
.opt .hint{display:block;color:var(--mut);font-size:12.5px;margin:2px 0 0 22px}
.opt .in{margin:8px 0 0 22px;display:grid;gap:8px}
.opt .in.g3{grid-template-columns:minmax(0,1fr) minmax(0,1.5fr) 110px}
.opt .in label span{display:block;font-size:11.5px;color:var(--mut);margin-bottom:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.opt .in input,.opt .in select{width:100%}
@media (max-width:820px){ .opt .in.g3{grid-template-columns:1fr} }
.allbar{display:flex;align-items:center;gap:6px;margin:4px 0 2px}
.allbar .sub{margin:0 0 0 6px;font-size:13px}

/* 학생 성적 — 다섯 화면을 고르는 줄 · 등급 표시 · 시험 고르는 줄 */
.back{color:var(--mut);font-size:13.5px;text-decoration:none}
.sthead{margin:6px 0 12px}
.infobar{display:flex;gap:22px;flex-wrap:wrap;font-size:14px;margin-top:4px}
.infobar span{color:var(--mut);display:block;font-size:12.5px}
.views{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin-bottom:14px}
.views button{font:inherit;text-align:left;border:1px solid var(--line);background:#fff;border-radius:10px;padding:10px 12px;cursor:pointer;color:var(--tx)}
.views button b{display:block;font-size:14.5px}
.views button span{font-size:12px;color:var(--mut)}
.views button i{font-style:normal;display:inline-block;width:20px;height:20px;line-height:20px;text-align:center;border-radius:50%;background:#eef0f4;font-size:12px;margin-right:6px;font-weight:700}
.views button.on{background:var(--navy);border-color:var(--navy);color:#fff}
.views button.on span{color:#c6cee0}.views button.on i{background:var(--or);color:#fff}
.views button:disabled{opacity:.5;cursor:default}
@media (max-width:1000px){.views{grid-template-columns:repeat(2,minmax(0,1fr))}}
.sel{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:12px}
.sel .lbl{font-size:12.5px;color:var(--mut)}
.sel .chip{padding:5px 12px;font-size:14px}
.sel .grp{font-size:11.5px;background:#eef1f7;color:#566078;border-radius:5px;padding:2px 7px}
.sel .grp.gap{margin-left:10px}
.sv2{display:grid;grid-template-columns:clamp(480px,58%,1150px) minmax(0,1fr);gap:14px;align-items:start}   /* 성적 쪽은 1150px 까지 늘고(글자도 칸 폭에 비례해 커진다), 그 뒤는 원본이 늘어난다 */
.sv2>div:first-child{order:2}     /* 성적은 왼쪽, 원본은 오른쪽 */
.sv2 .viewer{height:calc(100vh - 150px);min-height:420px}
@media (max-width:1000px){.sv2{grid-template-columns:1fr}.sv2 .viewer{position:static;height:70vh}}
.tb{width:100%;border-collapse:collapse}
.tb th,.tb td{padding:9px 8px;border-bottom:1px solid var(--line);text-align:center;vertical-align:middle;white-space:nowrap}
.tb th{background:#f0f2f7;font-size:13px;color:#566078}
.tb th:first-child,.tb td:first-child{text-align:left}
.tb tr:last-child td{border-bottom:0}
.tbw{overflow-x:auto}
.ar{display:inline-block;border-radius:6px;padding:2px 8px;font-size:12px;font-weight:700;margin-right:6px;background:#eef0f4;color:#566078}
.ar-국어{background:#fde8e6;color:#b6372f}.ar-수학{background:#e4edfd;color:#2557b8}.ar-영어{background:#dff5ea;color:#17784b}.ar-한국사{background:#fff1d9;color:#a86400}.ar-사회{background:#efe6fb;color:#6b3fb0}.ar-과학{background:#e0f3f6;color:#16727f}
.gb{display:inline-block;min-width:26px;border-radius:6px;padding:2px 6px;font-weight:800}
.gb1{background:#d6f0e2;color:#14683f}.gb2{background:#e6f5d6;color:#4a7a12}.gb3{background:#f6f0cf;color:#7b6a0c}.gb4{background:#fbe9cf;color:#9a5a08}.gb5{background:#fbdcd8;color:#a8342b}
.gb.n9{background:#fff;box-shadow:inset 0 0 0 1.5px currentColor}
.est{font-size:10px;color:#8a5a00;background:#fff1d9;border-radius:4px;padding:0 4px;margin-left:2px;font-style:normal;vertical-align:1px}
.pcv{font-size:16px;color:var(--navy)}
.up{color:var(--ok)}.down{color:var(--bad)}
.itx{margin:5px 0 0;font-size:12.5px;color:var(--mut);line-height:1.6;white-space:normal;text-align:left}
.itx i{font-style:normal;background:#eef1f7;color:#3d4a66;border-radius:5px;padding:1px 6px;margin-right:4px;white-space:nowrap}
.mutx{color:var(--mut)}
.sum span.tag{display:inline;font-size:11px;margin:0 0 0 4px}
.sum em{font-style:normal;font-size:12.5px;margin-left:4px}

/* 학생 성적 — 학생 이름 칸이 곧 학생 찾기 */
.swap{position:relative;display:inline-flex;align-items:center;gap:4px}
.swap input[type=search]{min-width:0;font:inherit;font-size:24px;font-weight:700;color:inherit;border:0;border-bottom:2px dashed transparent;background:transparent;padding:0 2px;margin:0;outline:0;width:auto;box-sizing:content-box;box-shadow:none;border-radius:0;max-width:100%;cursor:pointer;-webkit-appearance:none;appearance:none}
.swap input[type=search]::-webkit-search-cancel-button{display:none}
.swap input[type=search]:hover,.swap input[type=search]:focus{border-bottom-color:var(--mut,#9aa3b2)}
.swap input[type=search]:focus{cursor:text}
.swap input[type=search]::placeholder{color:var(--mut,#9aa3b2);font-weight:700}
.swcaret{color:var(--mut,#9aa3b2);font-size:14px;pointer-events:none}
.swlist{position:absolute;left:0;top:100%;margin-top:6px;width:340px;max-width:92vw;background:#fff;border:1px solid var(--line,#d5d9e0);border-radius:10px;box-shadow:0 8px 24px rgba(20,30,60,.14);z-index:20;overflow:hidden}
.swlist>div{display:flex;gap:8px;align-items:baseline;padding:8px 12px;cursor:pointer;font-size:14px}
.swlist>div.on,.swlist>div:hover{background:#eef2fb}
.swlist span{color:var(--mut,#6b7280);font-size:12.5px;flex:1}
.swlist em{font-style:normal;font-size:12px;color:var(--mut,#6b7280)}
.swlist .none{color:var(--mut,#6b7280);cursor:default}

/* 학생 성적 — 위쪽 숫자 칸: 평균 백분위가 가장 크게, 누적은 작게 */
.sum .cum{display:block;font-size:12px;font-weight:400;color:var(--mut);margin-top:2px}
.sum .cum b{font-size:13px;color:var(--tx);font-weight:700}
.sum>div.key{border-color:var(--or,#f59e0b);box-shadow:0 0 0 1px var(--or,#f59e0b) inset}
.sum>div.key b{font-size:26px}

/* 학생 성적 — 항목 이름을 눌러 칸 접기 */
table.tb.cols thead th:not(:first-child){cursor:pointer;user-select:none}
table.tb.cols thead th:not(:first-child):hover{color:var(--tx);text-decoration:underline dotted}
table.tb.o2 th:nth-child(2){color:#b6bcc8;text-decoration:line-through;font-weight:400;font-size:11.5px}
table.tb.o2 td:nth-child(2){visibility:hidden;width:0;max-width:0;padding-left:2px;padding-right:2px;font-size:0}
table.tb.o2 td:nth-child(2) *{display:none}
table.tb.o3 th:nth-child(3){color:#b6bcc8;text-decoration:line-through;font-weight:400;font-size:11.5px}
table.tb.o3 td:nth-child(3){visibility:hidden;width:0;max-width:0;padding-left:2px;padding-right:2px;font-size:0}
table.tb.o3 td:nth-child(3) *{display:none}
table.tb.o4 th:nth-child(4){color:#b6bcc8;text-decoration:line-through;font-weight:400;font-size:11.5px}
table.tb.o4 td:nth-child(4){visibility:hidden;width:0;max-width:0;padding-left:2px;padding-right:2px;font-size:0}
table.tb.o4 td:nth-child(4) *{display:none}
table.tb.o5 th:nth-child(5){color:#b6bcc8;text-decoration:line-through;font-weight:400;font-size:11.5px}
table.tb.o5 td:nth-child(5){visibility:hidden;width:0;max-width:0;padding-left:2px;padding-right:2px;font-size:0}
table.tb.o5 td:nth-child(5) *{display:none}
table.tb.o6 th:nth-child(6){color:#b6bcc8;text-decoration:line-through;font-weight:400;font-size:11.5px}
table.tb.o6 td:nth-child(6){visibility:hidden;width:0;max-width:0;padding-left:2px;padding-right:2px;font-size:0}
table.tb.o6 td:nth-child(6) *{display:none}
table.tb.o7 th:nth-child(7){color:#b6bcc8;text-decoration:line-through;font-weight:400;font-size:11.5px}
table.tb.o7 td:nth-child(7){visibility:hidden;width:0;max-width:0;padding-left:2px;padding-right:2px;font-size:0}
table.tb.o7 td:nth-child(7) *{display:none}
table.tb.o8 th:nth-child(8){color:#b6bcc8;text-decoration:line-through;font-weight:400;font-size:11.5px}
table.tb.o8 td:nth-child(8){visibility:hidden;width:0;max-width:0;padding-left:2px;padding-right:2px;font-size:0}
table.tb.o8 td:nth-child(8) *{display:none}
table.tb.o9 th:nth-child(9){color:#b6bcc8;text-decoration:line-through;font-weight:400;font-size:11.5px}
table.tb.o9 td:nth-child(9){visibility:hidden;width:0;max-width:0;padding-left:2px;padding-right:2px;font-size:0}
table.tb.o9 td:nth-child(9) *{display:none}

/* 학생 성적 — 표 칸 전체화면 */
.fsbox{position:relative}
.fsbtn{position:absolute;top:12px;right:14px;font:inherit;font-size:12.5px;padding:5px 10px;border:1px solid var(--line);border-radius:8px;background:#fff;color:var(--mut);cursor:pointer}
.fsbtn:hover{color:var(--tx);border-color:var(--mut)}
.fsbox:fullscreen{background:#fff;overflow:auto;padding:28px 48px;border-radius:0;border:0;margin:0}
.fsbox:fullscreen h2{font-size:24px}
.fsbox:fullscreen{padding:2vh 3vw;display:flex;flex-direction:column}
.fsbox:fullscreen .tbw{flex:1;overflow:visible}
.fsbox:fullscreen table.tb th{font-size:.72em;padding:.5em .6em}
.fsbox:fullscreen table.tb td{padding:.55em .6em}
.fsbox:fullscreen table.tb .ar,.fsbox:fullscreen table.tb .gb{font-size:.75em}
.fsbox:fullscreen .note{font-size:15px}
.fsbox:fullscreen .fsbtn{top:22px;right:28px;font-size:14px}
.fsbox:fullscreen .pcv{font-size:1.05em}

/* 학생 성적 — 석차: 「/」를 기준선으로 석차는 오른쪽 맞춤, 전체 인원은 왼쪽 맞춤(숫자 폭 고정) */
.rk{display:inline-flex;align-items:baseline;font-variant-numeric:tabular-nums}
.rk b{display:inline-block;width:2.6ch;text-align:right;font-size:1.06em;color:#1f2a44}
.rk i{display:inline-block;width:5ch;text-align:left;font-style:normal;font-size:.82em;color:#9aa3b2;margin-left:.45em}

/* 학생 성적 — 표 칸이 넓어지면 글자도 칸 폭에 비례해 커진다(12.5px ~ 23px). 전체화면은 따로(글자를 스크립트로 맞춤) */
.fsbox{container-type:inline-size}
.fsbox:not(:fullscreen) table.tb{font-size:clamp(12.5px,2.2cqw,23px)}
.fsbox:not(:fullscreen) table.tb th,.fsbox:not(:fullscreen) table.tb td{padding:.64em .5em}
.fsbox:not(:fullscreen) table.tb th{font-size:.93em}
.fsbox:not(:fullscreen) table.tb .ar{font-size:.86em}
.fsbox:not(:fullscreen) table.tb .pcv{font-size:1.15em}
.fsbox:not(:fullscreen) table.tb .itx{font-size:.9em}
.fsbox:not(:fullscreen) h2{font-size:clamp(17px,2.4cqw,24px)}

.tip{cursor:help}

/* 학생 성적 — 백분위 증감 말풍선(화면 맨 위에 그림) */
.bubble{position:fixed;z-index:9999;pointer-events:none;opacity:0;white-space:pre-line;text-align:center;max-width:min(92vw,520px);
  background:#1f2a44;color:#fff;font-size:16px;font-weight:500;line-height:1.55;padding:10px 16px;border-radius:10px;box-shadow:0 8px 24px rgba(20,30,60,.3);transition:opacity .08s}
.bubble.on{opacity:1}

/* 학생 성적 — 원본 창 닫기: 닫으면 왼쪽 표가 가로로 넓어지고, 표 칸 오른쪽 위에 「원본 보기」가 나온다 */
.sv2.voff{grid-template-columns:minmax(0,1fr)}
.sv2.voff>div:first-child{display:none}
.fsbtn2{right:128px}
.sv2:not(.voff) .fsbtn2{display:none}
.fsbox:fullscreen .fsbtn2{display:none}

/* 학생 성적 — 세부영역: 영역마다 색 테두리로 묶어 눈에 띄게 */
.tb tr.ga{--ac:#9aa3b2}
.tb tr.ac-국어{--ac:#e0685d}.tb tr.ac-수학{--ac:#4f86e0}.tb tr.ac-영어{--ac:#3fb27f}.tb tr.ac-한국사{--ac:#e0a23a}.tb tr.ac-사회{--ac:#9a6fd6}.tb tr.ac-과학{--ac:#3aa6b5}
.tb tr.ga td:first-child{border-left:3px solid var(--ac)}
.tb tr.ga td:last-child{border-right:3px solid var(--ac)}
.tb tr.ga.gs td{border-top:3px solid var(--ac)}
.tb tr.ga.ge td{border-bottom:3px solid var(--ac)}
.tb tr.gap td{height:8px;padding:0;border:0}

/* 자료 올리기 — 주소로 지정된 학생 줄 */
tr.want td{background:#fff7e0 !important;box-shadow:inset 0 0 0 1px #f59e0b}

/* 학생 성적 — 시험 목록의 빠진 칸(점선) */
.chip.miss{background:#fff;border:1.5px dashed #c4cad6;color:#9aa3b2}
.chip.miss i{font-style:normal;color:#d9534a;margin-left:5px;font-size:11.5px;font-weight:700}
.chip.miss i.pe{color:#b7791f}
.chip.miss:hover:not(:disabled){border-color:#7b8aa6;color:#3d4a66}
.chip.miss.off{cursor:default}

/* 확인하기 — 학생 성적 안에 끼워 넣을 때: 사이드 메뉴 · 제목을 감추고, 왼쪽 직접 입력 · 오른쪽 원본(없으면 올리기 칸) */
html.embed aside{display:none}
html.embed .wrap{display:block;min-height:0}
html.embed main{padding:0 !important}
html.embed body{background:transparent}
html.embed #vWork>.head{display:none}
html.embed .work{align-items:start}
html.embed .work>#form{order:-1}
.dz{display:flex;flex-direction:column;gap:6px;align-items:center;justify-content:center;min-height:260px;margin:14px;border:2px dashed #b9c2d4;border-radius:12px;color:#6b7280;text-align:center;padding:20px;cursor:pointer;background:#fbfcfe}
.dz b{font-size:18px;color:#3d4a66}.dz:hover,.dz.over{border-color:var(--or,#f59e0b);background:#fff8e8}

/* 학생 성적 — 끼워 넣은 입력 화면 */
iframe.entry{display:block;width:100%;height:calc(100vh - 230px);min-height:680px;border:1px solid var(--line);border-radius:12px;background:#fff}
.chip.miss.on{border-style:solid;border-color:#1f2a44;color:#1f2a44;background:#eef1f8}

/* 확인하기 — 성적표 사진 없이 빠르게 입력하는 표 */
.qg{padding:12px}.qgt input{width:100%}.qgt td.w{width:78px}.qgt td.w input.n{text-align:right}

.qgt input::placeholder{color:#b8bfcc;font-weight:400}

.qgt td.off{color:#c4cad6;text-align:center}

.fsbtn3{right:128px}
.fsbtn2{right:190px}
.fsbox:fullscreen .fsbtn3{display:none}

/* 분류 전 자료함 — 읽은 결과 확인(자동 분류). 묶음 카드 안에 조각 한 줄씩 */
.sortbar{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:4px 0 6px}
.sortbar .sp,.grp .hd .sp{flex:1}
.nt{display:inline-block;border-radius:6px;padding:2px 8px;font-size:12.5px;line-height:1.5;margin:2px 4px 2px 0}
.nt.ok{background:#dff5ea;color:var(--ok)}.nt.ask{background:#fff1d9;color:#a86400}.nt.bad{background:#fde6e4;color:var(--bad)}.nt.memo{background:#eef1f7;color:#566078}
.grp{background:#fff;border:2px solid var(--wait);border-radius:12px;padding:10px 14px 4px;margin-bottom:12px}
.grp.ask{border-color:#e0a030}.grp.bad{border-color:var(--bad)}
.grp .hd{display:flex;gap:10px;align-items:baseline;flex-wrap:wrap;padding-bottom:8px}
.grp .hd .sub{margin:0;font-size:13px}
.pc{display:grid;grid-template-columns:150px minmax(0,1fr) minmax(0,1.3fr) minmax(0,1fr);gap:6px 14px;align-items:center;padding:10px 0;border-top:1px solid var(--line)}
.pc small{display:block;font-size:11.5px;color:var(--mut)}
.pc select{width:100%}
.pc .a b{display:block;font-size:14px;margin-top:3px}
.pc .e{grid-column:1 / 4}.pc .f{grid-column:4;display:flex;gap:5px;flex-wrap:wrap;justify-content:flex-end}
.pc .f .btn.go{background:var(--navy);border-color:var(--navy);color:#fff;font-weight:700}
.pc.bad .f,.pc.ask .f{grid-column:1 / -1;justify-content:flex-start}.pc.bad .e,.pc.ask .e{grid-column:1 / -1}
.kd{display:inline-block;border-radius:999px;padding:2px 10px;font-size:12px;font-weight:700;background:#eef0f4;color:#566078}
.kd.report{background:#ece6fb;color:#5b3fb5}.kd.paper{background:#e2f1f4;color:#1b6f80}.kd.analysis{background:#fdf0dc;color:#9a5a00}
@media (max-width:820px){ .pc{grid-template-columns:1fr} .pc .e,.pc .f{grid-column:1} }

/* 확인하기 — 사람이 볼 칸만 눈에 띄게. 확인된 칸은 흐리게, 볼 칸은 주황 박스, 어긋난 칸은 빨강 박스 */
.lookbar{display:flex;flex-wrap:wrap;gap:6px 10px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:12px;padding:10px 14px;margin-bottom:10px;font-size:14px;position:sticky;top:0;z-index:3}
.lookbar small{flex-basis:100%;color:var(--mut);font-size:12.5px;line-height:1.5}
.lookbar label{cursor:pointer;font-size:13px}
.lk{border-radius:6px;padding:2px 9px;font-size:13px;font-weight:700}
.lk.look{background:#fff1d9;color:#a86400;border:2px solid #f0a020}.lk.bad{background:#fde6e4;color:var(--bad);border:2px solid var(--bad)}.lk.ok{background:#f3f5f8;color:#8a93a3}
.subj input.v-ok,.subj select.v-ok{color:#9aa3b2;background:#f6f8fa;border-color:#e8ebf0}
.subj input.v-look{border:2px solid #f0a020;background:#fff8e8;font-weight:700;color:var(--tx)}
.subj input.v-bad{border:2px solid var(--bad);background:#fdeceb;font-weight:700;color:var(--tx)}
.subj.fold{padding:6px 14px;cursor:pointer;background:#fafbfd}
.subj.fold>:not(.g1){display:none}
.subj.fold .g1{margin:0;grid-template-columns:minmax(0,1fr) auto}
.subj.fold .g1>:not(:first-child){display:none}
.subj.fold .g1 label span{display:none}
.subj.fold .g1 input{border:0;background:transparent;padding:2px 0;font-weight:700;color:#7a8496;pointer-events:none}
.subj.fold .g1::after{content:"확인됨 — 볼 칸 없음 · 눌러서 펴기";color:var(--ok);font-size:12.5px;align-self:center}

/* ───────── ③ 추이 (2026-10-13) ───────── */
.trend .trbar{display:flex;gap:18px;flex-wrap:wrap;align-items:center;margin-bottom:12px}
.trend .trgrp{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.trend .lbl{font-size:12.5px;color:var(--mut);margin-right:2px}
.trend .chip{padding:6px 13px;font-size:14px}
.trend .seg{display:inline-flex;border:1px solid var(--line);border-radius:8px;overflow:hidden;background:#fff}
.trend .seg button{font:inherit;font-size:14px;border:0;background:#fff;padding:7px 14px;cursor:pointer;color:var(--tx)}
.trend .seg button.on{background:var(--navy);color:#fff;font-weight:700}
.trend .box h2{font-size:15.5px;margin:0 0 10px}.trend .box h2 .hint{font-size:12.5px;font-weight:400;color:var(--mut);margin-left:6px}
.trend .sum small{display:block;font-size:12.5px;color:var(--mut);margin-top:2px}
.trend svg{width:100%;height:auto;display:block}
.trend .legend{display:flex;gap:16px;flex-wrap:wrap;font-size:13px;color:var(--mut);margin-top:6px}
.trend .legend i{display:inline-block;width:22px;height:0;border-top:3px solid;vertical-align:middle;margin-right:5px}
.trend .sub2{background:#f7f9fd;border:1px dashed #b9c2d6;border-radius:10px;padding:10px 12px;font-size:13px;line-height:1.6;color:#44506a;margin-top:10px}
.trend .two{display:grid;grid-template-columns:1fr 1fr;gap:14px;align-items:start}
@media (max-width:1000px){.trend .two{grid-template-columns:1fr}}
.trend .mini{margin:0 0 16px}.trend .mini h3{font-size:13.5px;margin:0 0 6px;color:#44506a}.trend .mini .cap{font-size:12px;color:var(--mut);margin-top:4px;line-height:1.5}
.trend th.l,.trend td.l{text-align:left}
.trend .trtag{display:inline-block;border-radius:5px;padding:1px 7px;font-size:12px;border:1px solid}
.trend .trtag.t1{color:var(--blue,#2f6fdb);border-color:#b8cdf3;background:#eef3fd}.trend .trtag.t2{color:#c9740a;border-color:#f6d3a0;background:#fff6e8}
.trtip{position:fixed;pointer-events:none;background:#222b3a;color:#fff;border-radius:8px;padding:7px 10px;font-size:13px;line-height:1.5;display:none;z-index:99;max-width:280px}

.trend tr.trsel td{background:#fafbfd;font-size:13px}

.trend .rd{background:#fff;border:1px solid var(--line);border-left:5px solid var(--ac,#1f2a44);border-radius:10px;padding:18px 20px 22px;margin:0 0 22px}
.trend .rd:last-child{margin-bottom:0}
.trend .rd h3{font-size:15px;margin:0 0 14px;color:var(--ac,#1f2a44);display:flex;align-items:center;gap:8px}
.trend .rd h3::before{content:"";width:9px;height:9px;border-radius:50%;background:var(--ac,#1f2a44)}
.trend .rd svg{display:block;margin:0 auto}

.trend .trfs{position:relative}
.trend .trfsb{position:absolute;top:12px;right:14px;font:inherit;font-size:12.5px;padding:5px 10px;border:1px solid var(--line);border-radius:8px;background:#fff;color:var(--mut);cursor:pointer;z-index:2}
.trend .trfsb:hover{color:var(--tx);border-color:var(--mut)}
.trend .trfs:fullscreen{background:#fff;overflow:auto;padding:3vh 4vw;border:0;border-radius:0;margin:0;font-size:18px}
.trend .trfs:fullscreen h2{font-size:24px}
.trend .trfs:fullscreen .trfsb{top:22px;right:28px;font-size:14px}
.trend .trfs:fullscreen #trChart svg{max-height:none}
.trend .trfs:fullscreen .tbw{max-height:none!important;overflow:visible!important}
.trend .trfs:fullscreen table.tb{font-size:1.15em}
.trend .trfs:fullscreen .rd{padding:24px 28px 28px}
.trend .trfs:fullscreen .rd svg{max-width:760px!important}
.trend .trfs:fullscreen .legend,.trend .trfs:fullscreen .sub2{font-size:15px}

/* 자료관리(/data) — 탭 4개: 업로드 · 대기자료 · 컴펌 · 휴지통 */
.dtabs{display:flex;gap:4px;border-bottom:2px solid var(--line);margin-bottom:16px;flex-wrap:wrap}
.dtab{padding:11px 20px;font-size:16px;border:0;background:none;font:inherit;font-weight:700;color:var(--mut);cursor:pointer;border-bottom:3px solid transparent;margin-bottom:-2px;text-align:left}
.dtab.on{color:#142C56;border-color:var(--or)}
.dtab i{font-style:normal;background:var(--or);color:#fff;border-radius:9px;padding:0 7px;font-size:12px;margin-left:5px}
.drop.big{padding:34px 16px;border-radius:10px;background:#fff;min-height:44vh;display:flex;flex-direction:column;justify-content:center;gap:4px;font-size:16px}
.drop.big b{font-size:20px}
.drop.big .btn.sm{font-size:15px;padding:9px 22px;color:var(--tx)}
.drop.big:hover{border-color:var(--or);background:#fffaf2}
.dbar{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:10px}
.dbar .sp{flex:1}
.mutc{color:var(--mut)}
.data td{font-size:14px}
.data td.wacts{white-space:nowrap;text-align:right}
.data td.wacts .btn{margin-left:4px}
.data td select{max-width:210px;padding:5px 8px}
.data select.mini{padding:2px 4px;font-size:12.5px;border-radius:6px}
.data table.list tr.hasn td{border-bottom:0;padding-bottom:4px}
.data table.list tr.wn td{padding-top:0}
.data .wkind{white-space:nowrap}
.data td select[data-st]{width:100%}
.data tr.lv-bad td:first-child{box-shadow:inset 3px 0 var(--bad)}
.data tr.lv-ask td:first-child{box-shadow:inset 3px 0 #e28a00}
.data tr.lv-ok td:first-child{box-shadow:inset 3px 0 var(--wait)}
.cfchips{max-height:112px;overflow-y:auto;align-items:center}
.cfchips .chip{padding:5px 12px;font-size:13.5px}
.cfchips .chip small{font-size:11px;opacity:.75}
.cfframe{display:block;width:100%;height:calc(100vh - 24px);min-height:560px;border:0;background:transparent}
.modal.framebox{width:min(1280px,97vw);height:92vh;max-height:92vh;padding:14px 16px;overflow:hidden;display:flex;flex-direction:column}
.modal.framebox .x{align-self:flex-end;float:none}
.modal.framebox iframe{flex:1;width:100%;border:0}
/* 자료관리 안에 끼워 넣은 예전 화면(확인하기 · 자료함의 한 건) — 제목과 단추는 보이고, 원본이 왼쪽 · 성적이 오른쪽(학생 성적에 끼울 때와 반대) */
html.in-data #vWork>.head{display:flex}
html.in-data #back,html.in-data .head a[href="/inbox"]{display:none}
html.in-data .work>#form{order:0}
html.in-data .viewer{height:calc(100vh - 12px);top:6px}

/* ───────── 학교별 과목 정보 — 확인하기의 견주기 줄 · 고르는 칸, /subjects 화면 ───────── */
p.chk .ssb{color:#2f6fdb;font-weight:600} p.chk .sso{color:#8a5a00;font-weight:600}
.ssq{display:block;border:2px solid #e28a00;background:#fffaf0;border-radius:10px;padding:10px 12px;margin:6px 0;color:#222b3a;font-weight:400}
.ssq .h{display:block;color:var(--bad);margin-bottom:4px}.ssq .h a{font-weight:400;font-size:12.5px;margin-left:8px}
.ssq .d{display:block;margin:2px 0}.ssq .d b{color:var(--bad)}
.ssq label{display:flex;gap:9px;align-items:flex-start;border:1px solid #c5ccda;background:#fff;border-radius:8px;padding:8px 10px;margin-top:6px;cursor:pointer}
.ssq label.on{border:2px solid #142C56;background:#f3f6fc;padding:7px 9px}.ssq label input{margin-top:4px;width:auto;flex:none}
.ssq label b{display:block}.ssq label small{color:var(--mut);font-size:12.5px}
.warn.ssre .ssq{margin-top:8px}
.ssbar{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:12px}.ssbar .sp{flex:1}.ssbar select{padding:5px 8px}.ssbar a.btn{text-decoration:none;color:inherit}
.sstab td.n,.sstab th.n{text-align:right;white-space:nowrap}.sstab .sssubj{cursor:pointer}.sstab .sssubj:hover{text-decoration:underline}
.sstab .ssitems{font-size:12.5px;color:#4a5568;margin-top:4px;line-height:1.6}.sstab .ssbasis{font-size:12.5px;line-height:1.6}.sstab .ssbad{color:var(--bad)}
.tscroll{overflow-x:auto}

/* 성적 빠른 입력 — 학교별 과목 정보에서 미리 채운 줄(2026-10-14) */
.qg tr.dflt input,.qg tr.dflt select{background:#eaf2ff !important}
.qg tr.dflt input.n{background:#eaf2ff !important}
.warn.dfbar{margin:0 0 10px}
.warn.dfbar.ok{background:#e9f6ef;color:#1f7a4d;border-color:#bfe3cf}

/* 빠른 입력 표 — 열이 많은 학기말에서도 과목명이 보이게(2026-10-14): 과목명 칸에 최소 폭, 숫자 칸은 좁게, 사진이 없을 때는 입력 쪽을 더 넓게 */
.qgt td:first-child{min-width:150px}
.qgt td.w{width:62px}
.qgt td.w input,.qgt td.w select{padding-left:5px;padding-right:5px}
.qgt td.w select{font-size:13px}
@media (min-width:1001px){html.embed .work:has(.qg){grid-template-columns:minmax(0,2.2fr) minmax(0,1fr)}html:not(.embed) .work:has(.qg){grid-template-columns:minmax(0,1fr) minmax(0,2.2fr)}}

/* 학생 성적 첫 화면 — 큰 검색창 · 최근 본 학생 · 오른쪽 학생 목록 패널(2026-10-14) */
.home{max-width:620px;margin:6vh auto 0;text-align:center}
.home h1{margin:0 0 4px}
.bigq{position:relative;margin:14px 0 0;text-align:left}
.bigq input{width:100%;font-size:19px;padding:13px 16px;border:2px solid var(--navy,#142C56);border-radius:12px;background:#fff;box-sizing:border-box}
.bigq .swlist{width:100%;max-width:none;top:100%}
.recent{margin:22px 0 0;text-align:left}
.recent .chip{display:inline-block;margin:8px 8px 0 0;padding:7px 14px;font-size:15px;color:inherit;text-decoration:none;border:1px solid var(--line,#dfe3ec);border-radius:99px;background:#fff}
.recent .chip:hover{border-color:var(--navy,#142C56)}
.recent .chip small{color:var(--mut,#6b7488);font-size:12.5px;margin-left:4px}
.sdrawer{position:fixed;right:0;top:0;bottom:0;width:390px;max-width:92vw;background:#fff;border-left:1px solid var(--line,#dfe3ec);box-shadow:-10px 0 28px rgba(20,44,86,.16);z-index:40;display:flex;flex-direction:column;padding:16px 16px 10px}
.sdrawer[hidden]{display:none}
.sdrawer .dh{display:flex;align-items:center;margin-bottom:10px}
.sdrawer .dh b{font-size:17px;color:var(--navy,#142C56)}
.sdrawer .dx{margin-left:auto;border:0;background:none;font-size:24px;line-height:1;color:#8a92a6;cursor:pointer}
.sdrawer .dg{display:flex;gap:4px;flex-wrap:nowrap;margin-bottom:8px}
.sdrawer .dg .chip{flex:1 1 0;min-width:0;text-align:center;border:1px solid var(--line,#dfe3ec);background:#fff;border-radius:99px;padding:5px 0;font-size:13.5px;cursor:pointer}
.sdrawer .dg .chip.on{background:var(--navy,#142C56);border-color:var(--navy,#142C56);color:#fff}
.sdrawer .dopt{font-size:13px;color:var(--mut,#6b7488);margin:2px 0 8px;cursor:pointer}
.sdrawer .dl{list-style:none;margin:0;padding:0;overflow-y:auto;border-top:1px solid var(--line,#dfe3ec);flex:1}
.sdrawer .dl li{display:flex;align-items:baseline;gap:8px;padding:9px 6px;border-bottom:1px solid #eef0f6;cursor:pointer;font-size:14px}
.sdrawer .dl li:hover{background:#eef3ff}
.sdrawer .dl li.on{background:#e6edff}
.sdrawer .dl li.out b{color:#8a92a6}
.sdrawer .dl li b{font-size:15px}
.sdrawer .dl li span{color:var(--mut,#6b7488);font-size:12.5px}
.sdrawer .dl li em{margin-left:auto;font-style:normal;color:var(--mut,#6b7488);font-size:12px}
.sdrawer .dl li.none{cursor:default;color:var(--mut,#6b7488);justify-content:center}

/* 학생 성적 화면 오른쪽에 끼워 넣는 학생 정보 패널(2026-10-14) */
html.sonly main{display:none}
html.sonly body{background:#fff}
html.sonly .drawer{width:100vw;box-shadow:none}
.spanel{position:fixed;right:0;top:0;bottom:0;width:min(500px,100vw);background:#fff;border-left:1px solid var(--line,#dfe3ec);box-shadow:-10px 0 28px rgba(20,44,86,.18);z-index:50}
.spanel[hidden]{display:none}
.spanel iframe{width:100%;height:100%;border:0;display:block}

/* 학생 성적 머리 — 이름 옆에 학교 · 학년 · 반을 붙여 세로를 줄인다(2026-10-14) */
.sthead>div:first-child{display:flex;align-items:baseline;gap:6px 22px;flex-wrap:wrap}
.sthead .infobar{margin-top:0;align-items:baseline}

/* 학생 정보 패널 — 정보 고치기 · 반 바꾸기는 맨 아래에 붙여 둔다(내용이 길어도 항상 보임, 2026-10-14) */
.drawer .dfoot{position:sticky;bottom:-40px;margin:18px -22px -40px;padding:12px 22px 14px;background:#fff;border-top:1px solid var(--line,#dfe3ec);display:flex;gap:8px;z-index:1}

/* 시험 단추를 촘촘하게 — 고1 · 고2 가 한 줄에 들어오도록(2026-10-14) */
.sel .chip{padding:4px 9px;font-size:13.5px}
.sel{gap:6px}
.chip.miss i{margin-left:3px;font-size:10.5px}
.sel .grp.gap{margin-left:8px}
.chip.miss i.dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:#d9534a;margin-left:4px;vertical-align:1px;font-size:0}
.chip.miss i.dot.pe{background:#e0a030}

/* ───────── ④ 상세 (2026-10-14) — 틀(교과 단추 · 상자 · 표)은 ③ 추이의 .trend 를 함께 쓴다 ───────── */
.detail .dtfs{position:relative}
.detail .box h2{padding-right:96px;display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 6px}
.detail .dtseg{margin-left:auto}
.detail .dtseg button{font-size:12.5px;padding:4px 11px}
.detail .trtag.t3{color:#44506a;border-color:#8d97a8;background:#fff;font-weight:700}
.detail .dtbig{display:flex;gap:10px 30px;align-items:flex-end;flex-wrap:wrap;margin-bottom:6px}
.detail .dtbig>div>span{display:block;font-size:12.5px;color:var(--mut)}
.detail .dtbig b{font-size:28px;line-height:1.15}
.detail .dtbig b small{font-size:14px;color:var(--mut);font-weight:500}
.detail .dtbw{position:relative;margin-top:30px}
.detail .dtblk+.dtblk{margin-top:18px;padding-top:14px;border-top:1px dashed var(--line)}
.detail .dtsysh{display:inline-block;font-size:12.5px;font-weight:700;color:#fff;background:var(--navy);border-radius:6px;padding:2px 9px}
.detail .dtsay .dtsys{font-style:normal;font-size:11.5px;font-weight:700;border:1px solid currentColor;border-radius:5px;padding:0 5px;margin-right:2px;opacity:.8}
.detail .dtband{height:34px;border-radius:7px;display:flex;overflow:hidden}
.detail .dtband span{display:grid;place-items:center;font-size:12px;font-weight:700;color:#fff;white-space:nowrap;overflow:hidden}
.detail .dtcuts{position:relative;height:18px;font-size:11px;color:var(--mut);margin-top:2px}
.detail .dtcuts em{position:absolute;font-style:normal;transform:translateX(-50%);white-space:nowrap}
.detail .dtmk{position:absolute;top:-24px;height:60px;width:0;border-left:3px solid #111;z-index:2}
.detail .dtmk em{position:absolute;top:0;font-style:normal;font-size:12px;font-weight:700;white-space:nowrap;line-height:1.5}
.detail .dtbw.dtstk{margin-top:50px}
.detail .dtmk.hi{top:-44px;height:80px}
.detail .dtmk.l em{right:6px}.detail .dtmk.r em{left:4px}
.detail .dtmk.old{border-left:2px dashed #8b93a3;z-index:1}.detail .dtmk.old em{color:#8b93a3;font-weight:500}
.detail .dtsay{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}
.detail .dtsay>div{flex:1;min-width:210px;border-radius:9px;padding:9px 12px;font-size:13.5px;line-height:1.55}
.detail .dtsay .u{background:#eaf6ef;color:#12683f}.detail .dtsay .d{background:#fdf1e3;color:#8a5200}.detail .dtsay .m{background:#eef3fc;color:#234a94}
.detail .dtsay b{font-size:17px}
.detail .dtsay .up,.detail .dtsay .down{color:inherit}
.detail tr.dton td{background:#f3f7ff}
.detail .tb .dtg2{border-left:1px solid var(--line)}
.detail tr.dton td:first-child{box-shadow:inset 3px 0 0 #2f6fdb}
.detail .dtdist{display:flex;height:12px;border-radius:3px;position:relative;min-width:130px}
.detail .dtdist i{display:block;height:100%}
.detail .dtdist.plain i{background:#d3d9e6;border-radius:3px}
.detail .dtdist u{position:absolute;top:-4px;width:3px;height:20px;margin-left:-1.5px;background:#111;border-radius:2px}
.detail .dthb{height:10px;background:#eceef3;border-radius:5px;position:relative;min-width:110px;overflow:hidden}
.detail .dthb i{position:absolute;left:0;top:0;bottom:0;border-radius:5px;background:#2f6fdb}.detail .dthb i.o{background:var(--or)}
.detail .dtpick{display:flex;gap:6px;flex-wrap:wrap;margin:0 0 10px}
.detail .dtpick .chip{padding:3px 10px;font-size:12.5px}
.detail .dtpick .chip.none{border-style:dashed;color:#a3abba;background:#fafbfd;font-weight:400}
.detail .dtpick .chip.none.on{background:#8d97a8;border-color:#8d97a8;border-style:solid;color:#fff;font-weight:700}
.detail .dtnone{background:#f7f9fd;border:1px dashed #b9c2d6;border-radius:10px;padding:14px 16px;font-size:13.5px;line-height:1.65;color:#44506a}
.detail .dtnone b{color:var(--tx);font-size:14.5px}
.detail .dtnone div{margin-top:10px}
.detail .dtch{max-width:760px;margin:0 auto}
.detail .dtfiles{display:flex;gap:8px;flex-wrap:wrap}
.detail .dtfiles button,.detail .dtunk button.p{border:1px solid #c5ccda;background:#fff;border-radius:7px;padding:6px 12px;font:inherit;cursor:pointer;color:var(--tx)}
.detail .dtfiles button:hover,.detail .dtunk button.p:hover{border-color:var(--navy)}
.detail .dtfiles button.p,.detail .dtunk button.p{border-style:dashed}
.detail .dtfiles small,.detail .dtunk small{color:var(--mut);font-size:11.5px;margin-left:4px}
.detail .dtfiles small.w{color:#b7791f}
.detail .dtfiles button.an{border-style:dashed;border-color:#e0a24a}
.detail .dtunk{margin-top:14px;padding-top:12px;border-top:1px dashed var(--line);font-size:13.5px}
.detail .dtunk .row{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:8px}
.detail .dtunk input{font:inherit;padding:5px 9px;border:1px solid #c5ccda;border-radius:7px;width:150px}
.detail .dtunk button.p small{display:inline-block;max-width:220px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:bottom}
/* 전체화면 — 속(.dtin)에 zoom 을 걸어 글자 · 표 · 단추가 같은 비율로 커진다(detail.js 의 fit). 여백은 px 로 */
.detail .dtfs.fson{position:fixed;inset:0;z-index:60;background:#fff;overflow:auto;padding:30px 46px;border:0;border-radius:0;margin:0}
.detail .dtfs.fson .trfsb{top:18px;right:24px;font-size:14px}
.detail .dtfs.fson .tbw{overflow:visible}
/* 오른쪽 원본 창 */
.dtview{position:fixed;right:0;top:0;bottom:0;width:min(780px,62vw);background:#fff;border-left:1px solid var(--line);box-shadow:-10px 0 28px rgba(20,44,86,.18);z-index:45;display:flex;flex-direction:column}
.dtview[hidden]{display:none}
.dtview .dth{padding:8px 14px;font-weight:700;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:10px}
.dtview .dth span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dtview .dtfull{font:inherit;font-size:13px;font-weight:500;padding:5px 11px;border:1px solid var(--line);border-radius:8px;background:#fff;color:var(--tx);cursor:pointer;white-space:nowrap}
.dtview .dtfull:hover{border-color:var(--navy)}
.dtview.full{left:0;width:100vw;border-left:0}
.dtview .viewer{position:static;flex:1;height:auto;min-height:0;border:0;border-radius:0}
@media (max-width:900px){.dtview{width:100vw}}
/* ───────── ⑤ 분석 (2026-10-14) — 틀 · 전체화면은 ④ 상세의 .detail 을 함께 쓴다 ───────── */
.analysis .anbar{height:12px;background:#eceef3;border-radius:6px;position:relative;min-width:120px;flex:1}
.analysis .anbar i{position:absolute;left:0;top:0;bottom:0;border-radius:6px;background:#2f6fdb}
.analysis .anbar i.r{background:#e58b84}.analysis .anbar i.o{background:var(--or)}
.analysis .anbar u{position:absolute;top:-4px;width:2px;height:20px;margin-left:-1px;background:#111;border-radius:1px}
.analysis .anrow{display:flex;gap:10px;align-items:center}
.analysis .anrow>b{min-width:42px;text-align:right}
.analysis .anpc{min-width:50px;text-align:right;font-size:13px}
.analysis .anpair .anbar{height:8px;min-width:150px}.analysis .anpair .anbar+.anbar{margin-top:4px}
.analysis .ancnt{font-style:normal;font-size:11.5px;color:var(--mut);margin-left:5px;font-weight:400}
.analysis .anread{font-size:13px;color:#44506a}.analysis .anread b{color:var(--tx)}
.analysis a.ansub{color:inherit;font-weight:700;text-decoration:underline dotted #9aa3b2;text-underline-offset:3px}
.analysis a.ansub:hover{color:#2f6fdb;text-decoration-color:#2f6fdb}
.analysis .antag{display:inline-block;border-radius:5px;padding:1px 8px;font-size:12px;font-weight:700}
.analysis .antag.s{background:#dff5ea;color:#17784b}.analysis .antag.w{background:#fde8e6;color:#b6372f}
.analysis .antag.b{background:#e4edfd;color:#2557b8}.analysis .antag.o{background:#fff1d9;color:#a86400}
.analysis .tb td{vertical-align:middle}
.analysis .anband{display:flex;height:14px;position:relative;min-width:150px;flex:1}
.analysis .anband i{display:block;height:100%}.analysis .anband i:first-child{border-radius:4px 0 0 4px}.analysis .anband i:last-of-type{border-radius:0 4px 4px 0}
.analysis .anband u{position:absolute;top:-5px;width:3px;height:24px;margin-left:-1.5px;background:#111;border-radius:2px;box-shadow:0 0 0 1.5px #fff}
.analysis .anband s{position:absolute;top:-4px;height:22px;width:0;border-left:2px dashed #2b3550;margin-left:-1px}
.analysis .antrk{height:12px;background:#d3d9e6;border-radius:3px;position:relative;min-width:170px}
.analysis .antrk u{position:absolute;top:-5px;width:4px;height:22px;margin-left:-2px;border-radius:2px;background:#2f6fdb;box-shadow:0 0 0 1.5px #fff}.analysis .antrk u.o{background:var(--or)}
/* ⑤ 분석 — 나. 목표 다짐 · 다. 지난 목표는 지켰나 (2026-10-14) */
.analysis .anbar i.g{background:#1e9e62}
.analysis .angoal{border:2px solid var(--or)}
.analysis .angoal h2{padding-right:214px}
.analysis .trfsb.angimg{right:112px;color:#8a5200;border-color:#f0c98c;background:#fffaf0;font-weight:700}
.analysis .trfsb.angimg:hover{border-color:var(--or);color:#6b3f00}
.analysis .dtfs.fson .trfsb.angimg{right:124px}
.analysis .angtg{align-items:center}.analysis .angtg .lbl{font-size:12.5px;color:var(--mut);margin-right:2px}
.analysis .angrow{display:grid;grid-template-columns:118px minmax(150px,1fr) 30px minmax(210px,1.3fr) minmax(170px,1.05fr);gap:12px;align-items:stretch;padding:13px 0;border-top:1px solid var(--line)}
.analysis .anglist .angrow:first-child{border-top:0;padding-top:4px}
.analysis .angs{display:flex;flex-direction:column;justify-content:center;gap:4px;font-size:15px;position:relative;padding-right:22px;min-width:0}
.analysis .angs a.ansub{overflow-wrap:anywhere}
.analysis .angx{position:absolute;top:0;right:0;border:0;background:none;color:#a3abba;font-size:17px;line-height:1;cursor:pointer;padding:2px 5px;border-radius:5px}
.analysis .angx:hover{background:#fde8e6;color:#b6372f}
.analysis .angbox{background:#f6f7fa;border-radius:10px;padding:10px 13px;min-width:0}
.analysis .angbox.t{background:#fff8ea;border:1px solid #f3d7a5}
.analysis .angbox h4{margin:0 0 4px;font-size:12px;color:var(--mut);font-weight:600}
.analysis .angbox .v{font-size:23px;font-weight:800;line-height:1.25}
.analysis .angbox .v small{font-size:13px;font-weight:500;color:var(--mut);margin-left:3px}
.analysis .angbox .d{font-size:12.5px;color:#4d586b;margin-top:3px}
.analysis .angbox input{width:82px;font:inherit;font-size:20px;font-weight:800;padding:2px 6px;border:2px solid var(--or);border-radius:7px;text-align:right;background:#fff;color:var(--tx)}
.analysis .angarr{display:grid;place-items:center;font-size:22px;color:var(--or);font-weight:800}
.analysis .angbtn{display:flex;gap:5px;align-items:center;flex-wrap:wrap;margin-bottom:6px;min-height:24px}
.analysis .angbtn button{border:1px solid #d9b877;background:#fff;border-radius:6px;padding:2px 9px;font:inherit;font-size:12.5px;cursor:pointer;color:var(--tx)}
.analysis .angbtn button.on{background:var(--or);color:#fff;border-color:var(--or);font-weight:700}
.analysis .angbtn span{font-size:11.5px;color:var(--mut)}
.analysis .angwin{background:var(--navy);color:#fff;border-radius:10px;padding:10px 14px;display:flex;flex-direction:column;justify-content:center;min-width:0}
.analysis .angwin b{font-size:26px;color:#FBAE40;line-height:1.2}.analysis .angwin span{font-size:13px}.analysis .angwin small{opacity:.82;font-size:12px;margin-top:3px}
.analysis .angfoot{display:flex;gap:10px 14px;align-items:center;flex-wrap:wrap;margin-top:6px;padding-top:12px;border-top:1px solid var(--line);font-size:13.5px}
.analysis .angfoot select{font:inherit;font-size:13.5px;padding:7px 10px;border:1px solid var(--line);border-radius:8px;background:#fff;color:var(--tx);cursor:pointer}
.analysis .angcl input{width:54px;font:inherit;font-weight:700;padding:4px 6px;border:1px solid #c5ccda;border-radius:7px;text-align:right}
.analysis .angcl input:placeholder-shown{border:2px solid var(--or);background:#fffaf0}
.analysis .angst{font-size:12.5px}.analysis .angst.ok{color:#17784b}.analysis .angst.warn{color:#a86400}.analysis .angst.bad{color:#b6372f;font-weight:700}
.analysis .anpast+.anold,.analysis .anold .anpast+.anpast{margin-top:14px}
.analysis .anph{font-size:13.5px;margin-bottom:6px}.analysis .anph b{font-size:14.5px}
.analysis .anold>summary{cursor:pointer;font-size:13.5px;color:#2557b8;user-select:none;margin-bottom:10px}
.analysis .anpast .anrow>span{white-space:nowrap;font-size:13.5px}
@media (max-width:900px){.analysis .angrow{grid-template-columns:1fr}.analysis .angarr{transform:rotate(90deg)}.analysis .angoal h2{padding-right:0;padding-top:34px}}

/* ───────── 학생정보 화면 개편(2026-10-14) — 위 찾기 · 왼쪽 아래 목록 · 오른쪽 아래 상세 / 학생 성적 안의 패널(/studentpanel) ───────── */
.stp{max-width:1500px;display:flex;flex-direction:column;height:100vh;min-height:560px}      /* 화면 높이에 맞추고, 목록 · 상세는 남은 높이를 정확히 채운다(위 줄이 몇 줄이든) */
.sthd{display:flex;align-items:center;gap:10px;margin-bottom:10px;flex-wrap:wrap}
.sthd h1{margin:0}.sthd .acts{margin-left:auto;display:flex;gap:8px}
.stfind{display:flex;align-items:center;gap:10px 12px;flex-wrap:wrap;background:#fff;border:1px solid var(--line);border-radius:12px;padding:10px 14px;margin-bottom:12px}
.stfind .gl{display:flex;gap:6px;flex-wrap:wrap}
.stfind .chip{padding:5px 12px;font-size:13.5px}.stfind .chip small{color:var(--mut);margin-left:3px;font-weight:400}.stfind .chip.on small{color:#fff}
.stfind select{padding:6px 8px;max-width:220px}
.stfind input[type=search]{flex:1;min-width:150px}
.stfind .inc{display:flex;gap:5px;align-items:center;cursor:pointer;white-space:nowrap}
.stsplit{display:grid;grid-template-columns:minmax(340px,5fr) minmax(0,7fr);grid-template-rows:minmax(0,1fr);gap:12px;align-items:stretch;flex:1;min-height:0}
.stlist{background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden;display:flex;flex-direction:column;min-height:0}
.stlist .hd{padding:9px 12px;background:#f0f2f7;font-size:12.5px;color:#566078;display:flex;justify-content:space-between}
.stlist .colh,.stlist li{display:grid;grid-template-columns:minmax(80px,1.3fr) 1fr 44px minmax(90px,1.6fr);gap:8px;align-items:center}
.stlist .colh{padding:6px 12px;font-size:12px;color:var(--mut);border-bottom:1px solid var(--line)}
.stlist ul{list-style:none;margin:0;padding:0;overflow-y:auto;flex:1;background-image:repeating-linear-gradient(to bottom,transparent 0,transparent 38px,var(--line) 38px,var(--line) 39px)}
.stlist li{height:39px;padding:0 12px;box-sizing:border-box;background:#fff;cursor:pointer;white-space:nowrap;border-bottom:1px solid var(--line)}
.stlist li:hover{background:#fafbfd}
.stlist li.on{background:#fff4e5;box-shadow:inset 3px 0 0 var(--or)}
.stlist li.inact b{color:var(--mut)}
.stlist li>span{overflow:hidden;text-overflow:ellipsis}
.stlist li .cl{overflow:hidden}.stlist li .cl .tag{margin:0 4px 0 0;padding:2px 7px;font-size:12px}
.stlist li b{font-size:15px}
.stlist li.empty{display:block;height:auto;padding:26px 14px;text-align:center;color:var(--mut);white-space:normal;cursor:default;background:#fff}
.tg{font-size:11.5px;border-radius:5px;padding:1px 6px;margin-left:4px}
.tg.rest{background:#fff1d9;color:#a86400}.tg.out{background:#eef0f4;color:#7a8496}
.stlist .ft{padding:8px 12px;border-top:1px solid var(--line);background:#f0f2f7;font-size:12.5px;color:#566078;display:flex;justify-content:space-between}
.stdet{background:#fff;border:1px solid var(--line);border-radius:12px;display:flex;flex-direction:column;min-width:0;min-height:0;overflow:hidden}
.stdet #detBox{display:flex;flex-direction:column;min-height:0;flex:1}
.stdet #detBox[hidden]{display:none}
.stdet .body{overflow-y:auto;flex:1;padding:16px 20px 12px}
.stdet-home{text-align:center;padding:80px 20px 20px}
.stdet-home .big{font-size:18px;font-weight:700;margin:0 0 6px}
.stdet-home .rcn{margin-top:28px}.stdet-home .rcn>div{margin-top:8px;display:flex;gap:8px;justify-content:center;flex-wrap:wrap}
.stdet-home .chip small{color:var(--mut);margin-left:3px}
.stdet h1,.spbody2 h1{font-size:22px;margin:0}.stdet h1 .sx,.spbody2 h1 .sx{font-size:15px;font-weight:400;color:var(--mut)}
.stdet h2,.spbody2 h2{font-size:14px;margin:18px 0 6px;color:#566078}
.hint{font-weight:400;font-size:12.5px;margin-left:6px}
.bad{color:var(--bad)}
a.tel{color:inherit;text-decoration:none;border-bottom:1px dotted var(--mut)}a.tel:hover{color:var(--wait)}
a.ctl{font-size:12.5px}
dl.ct{grid-template-columns:minmax(120px,max-content) minmax(0,1fr)}
.dfoot{display:flex;gap:8px;padding:10px 20px;border-top:1px solid var(--line);background:#fff;flex-wrap:wrap}
.mback{display:none;border:0;background:none;color:var(--wait);font:inherit;font-weight:700;padding:0 0 8px;cursor:pointer}
/* 상담 기록 */
.nw textarea{height:68px}
.nwf{display:flex;align-items:center;gap:10px;margin:6px 0 12px;flex-wrap:wrap}.nwf input{border:1px solid var(--line);border-radius:6px;padding:3px 6px}
.cs{border:1px solid var(--line);border-radius:8px;padding:8px 10px;margin-bottom:8px}
.cs .ch{display:flex;gap:6px;margin-bottom:3px;color:var(--mut);align-items:center;flex-wrap:wrap}.cs .ch b{color:var(--tx)}
.cs .cb{margin-left:auto;font-size:12.5px}.cs .ed{font-size:11.5px;background:#eef0f4;border-radius:5px;padding:0 5px}
.cs .cbody{white-space:pre-wrap;word-break:break-word}.cs textarea.nedit{height:90px}
.cs.gone{background:#fafafa;opacity:.75}
.ntrash,.aud{margin-top:14px;font-size:13px;color:var(--mut)}.ntrash summary,.aud summary{cursor:pointer}
/* 학생 성적 안의 패널 */
.spbody{background:#fff;margin:0}
.spwrap{height:100vh;overflow-y:auto;position:relative}
.spbody2{padding:20px 22px 14px}
.spwrap .dfoot{position:sticky;bottom:0;padding:10px 22px}
/* 좁은 화면 — 급할 때 쓰는 용도: 검색창 하나, 고르면 자세한 정보가 화면 가득 */
@media (max-width:900px){
  .stfind .gl,.stfind select,.stfind .inc,.sthd .acts{display:none}
  .stfind input[type=search]{font-size:16px;padding:11px 12px}
  .stp{display:block;height:auto;min-height:0}
  .stsplit{grid-template-columns:1fr;grid-template-rows:none;display:grid}
  .stlist,.stdet{height:auto;min-height:0}
  .stlist .colh{display:none}.stlist li{grid-template-columns:1fr auto;height:auto;min-height:48px;padding:6px 12px;white-space:normal}
  .stlist li .cl,.stlist li>span:nth-child(3){display:none}
  .stlist ul{max-height:none;background-image:none}
  .stdet .body{overflow:visible}.stdet #detBox{display:block}
  .mback{display:block}
  .stdet .dfoot{display:none}      /* 좁은 화면에서는 보기만 — 고치기는 PC 에서(학생 성적 안의 패널은 그대로 둔다) */
}
/* 홈의 「공사중」 안내 — 개발 기간 동안(2026-10-14) */
.uc{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;min-height:calc(100vh - 220px);text-align:center}
.uc svg{width:min(200px,40vw);height:auto}
.uc b{font-size:20px;color:#142C56;letter-spacing:-.01em}
.ucm{width:240px;background:#142C56;border-radius:14px;padding:8px;text-align:left;box-shadow:0 6px 18px rgba(20,44,86,.18)}
.ucs{margin:-8px 0 0;color:#5a6478;font-size:15px}
.ucm .mi{display:flex;align-items:center;gap:12px;padding:10px;border-radius:8px;color:#e1eafa;text-decoration:none;font-size:14.5px;font-weight:700}
.ucm .mi:hover{background:rgba(255,255,255,.1);color:#fff}.ucm .mi:hover svg{color:var(--or)}
.ucm svg{flex:none;width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.mkbox{display:flex;align-items:center;gap:16px;justify-content:space-between;flex-wrap:wrap}