/* HYCU 교안 스튜디오 v2 — 교수자 중심 */
:root{--fs-xs:11px;--fs-sm:12px;--fs-md:13px;--fs-base:14px;--fs-lg:15px;--fs-h3:17px;--fs-h1:24px;/* 글자 크기 단계 — 새 화면은 이 값만 씀 */--v-bg:#F5F6F7;--v-panel:#FFFFFF;--v-line:#E6E7E9;--v-line2:#DDDDDD;--v-ink:#0E1116;--v-ink2:#3F4753;--v-mute:#5F6775;--v-faint:#6B7280;--v-blue:#2459D8;--v-blue-d:#2459D8;--v-blue-dd:#1A3A9C;--v-blue-s:#EDF3FF;--v-blue-ss:#F5F8FF;--v-hycu:#009DE8;--v-navy:#13235A;--v-orange:#FFA952;--v-orange-d:#C46A12;--v-orange-s:#FFF4E8;--v-green:#22A06B;--v-green-s:#E6F5EE;--v-red:#D9363E;--v-red-s:#FDECEC}
a{color:var(--v-blue-d);text-decoration:none}a:hover{color:var(--v-blue-dd);text-decoration:underline}
.v-app{display:grid;grid-template-columns:232px minmax(0,1fr);min-height:100vh;background:var(--v-bg);color:var(--v-ink);font-size:14px}
.v-side{position:sticky;top:0;height:100vh;background:#fff;border-right:1px solid var(--v-line);display:flex;flex-direction:column;padding:20px 14px}
.v-brand{display:flex;align-items:center;gap:10px;padding:2px 8px 22px}
.v-brand img{width:44px;height:44px}
.v-brand b{display:block;font-size:16px;font-weight:700;letter-spacing:-0.02em}
.v-brand span{display:block;font-size:12px;color:var(--v-mute);margin-top:1px}
.v-nav{display:flex;flex-direction:column;gap:2px}
.v-nav-sec{font-size:11px;font-weight:600;color:var(--v-faint);padding:16px 10px 6px}
.v-nav button{display:flex;align-items:center;gap:10px;height:40px;padding:0 10px;border:0;border-radius:8px;background:transparent;color:var(--v-ink2);font-size:14px;font-weight:500;text-align:left}
.v-nav button:hover{background:var(--v-bg)}
.v-nav button.on{background:var(--v-blue-s);color:var(--v-blue-dd);font-weight:600}
.v-nav .cnt{margin-left:auto;min-width:22px;height:20px;padding:0 6px;border-radius:10px;background:var(--v-orange);color:#3A2410;font-size:11px;font-weight:700;display:grid;place-items:center}
.v-side-foot{margin-top:auto;display:flex;flex-direction:column;gap:10px}
.v-role{display:grid;grid-template-columns:1fr 1fr;background:var(--v-bg);border-radius:8px;padding:3px}
.v-role button{height:30px;border:0;border-radius:6px;background:transparent;font-size:12px;font-weight:600;color:var(--v-mute)}
.v-role button.on{background:#fff;color:var(--v-ink);box-shadow:0 1px 2px rgba(0,0,0,.08)}
.v-me{display:flex;align-items:center;gap:10px;padding:8px}
.v-me .av{width:32px;height:32px;border-radius:50%;background:var(--v-blue);color:#fff;display:grid;place-items:center;font-size:12px;font-weight:700}
.v-me b{display:block;font-size:13px;font-weight:600}.v-me span{display:block;font-size:11px;color:var(--v-mute)}
.v-me button{margin-left:auto;border:0;background:transparent;color:var(--v-faint);padding:6px;border-radius:6px}
.v-me button:hover{background:var(--v-bg);color:var(--v-ink)}
.v-main{min-width:0;display:flex;flex-direction:column}
.v-page{width:100%;max-width:1240px;margin:0 auto;padding:36px 40px 80px}
.v-head{display:flex;align-items:flex-end;gap:16px;margin-bottom:24px;flex-wrap:wrap}
.v-head h1{margin:0;font-size:24px;font-weight:700;letter-spacing:-0.02em}
.v-head p{margin:6px 0 0;color:var(--v-mute);font-size:14px}
.v-head .sp{flex:1}
/* 편집창 서식 도구줄: 휴대폰에서는 옆으로 숨기지 않고 줄바꿈(오른쪽 도구가 잘려 보이지 않게) */
@media (max-width:640px){.tb-wrap .tb{flex-wrap:wrap;overflow-x:visible;border-radius:16px;row-gap:2px}}
/* 과목 화면 단계 칸: 넓으면 한 줄, 휴대폰은 2×2 */
.cs-steps{grid-template-columns:repeat(var(--n,4),minmax(0,1fr))}
@media (max-width:640px){.cs-steps{grid-template-columns:repeat(2,minmax(0,1fr))}.cs-steps>button{padding:12px!important;gap:10px!important}}
/* 편집창 머리: 제목 줄 아래에 상태·버튼 줄을 따로 둠(버튼이 두 줄로 흩어지지 않게). 상태는 왼쪽, 버튼은 오른쪽.
   '돌아가기'는 위 경로 표시와 같아 두지 않음 */
.ed-head{gap:8px 10px;align-items:center}.ed-head-t{flex:1 1 100%}
/* 1200px보다 좁으면 버튼을 작게 */
@media (max-width:1199px){.ed-head .v-btn{height:34px;padding:0 12px;font-size:13px}}
/* 휴대폰: 버튼을 두 개씩 가지런히 */
@media (max-width:640px){.ed-head .v-btn{flex:1 1 calc(50% - 5px);min-width:0;padding:0 8px}.ed-head .sp{flex-basis:100%;height:0}}
.v-crumb{display:flex;gap:6px;align-items:center;font-size:13px;color:var(--v-mute);margin-bottom:10px}
.v-crumb button{border:0;background:none;padding:0;color:var(--v-mute);font-size:13px}.v-crumb button:hover{color:var(--v-ink)}
.v-card{background:var(--v-panel);border:1px solid var(--v-line);border-radius:12px}
.v-sec-t{display:flex;align-items:center;gap:10px;margin:0 0 14px}
.v-sec-t h2{margin:0;font-size:16px;font-weight:700;letter-spacing:-0.01em}
.v-sec-t .n{width:22px;height:22px;border-radius:50%;background:var(--v-ink);color:#fff;font-size:12px;font-weight:700;display:grid;place-items:center}
.v-sec-t .sp{flex:1}
.v-btn{display:inline-flex;align-items:center;justify-content:center;gap:0;height:40px;padding:0 16px;border-radius:8px;border:1px solid var(--v-line2);background:#fff;color:var(--v-ink);font-size:14px;font-weight:600;white-space:nowrap}
.v-btn:hover{background:var(--v-bg)}
.v-btn.pri{background:var(--v-blue);border-color:var(--v-blue);color:#fff}.v-btn.pri:hover{background:var(--v-blue-d);border-color:var(--v-blue-d)}
.v-btn.ink{background:var(--v-ink);border-color:var(--v-ink);color:#fff}.v-btn.ink:hover{background:#000}
.v-btn.lg{height:52px;padding:0 22px;font-size:15px;border-radius:10px}
.v-btn.sm{height:32px;padding:0 12px;font-size:13px}
.v-btn.txt{border-color:transparent;background:transparent;color:var(--v-blue-d)}.v-btn.txt:hover{background:var(--v-blue-ss)}
.v-btn:disabled{opacity:.45;cursor:default}
.v-tag{display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 9px;border-radius:6px;font-size:12px;font-weight:600;background:var(--v-bg);color:var(--v-ink2);white-space:nowrap}
.v-tag i{width:6px;height:6px;border-radius:50%;background:currentColor;font-style:normal}
.v-tag.blue{background:var(--v-blue-s);color:var(--v-blue-dd)}
.v-tag.orange{background:var(--v-orange-s);color:#8A4A0C}
.v-tag.green{background:var(--v-green-s);color:#166B4A}
.v-tag.red{background:var(--v-red-s);color:#A8232A}
.v-tag.gray{background:#EEF0F2;color:var(--v-mute)}
.v-toggle{position:relative;width:40px;height:24px;border-radius:12px;background:#CDD1D6;border:0;flex-shrink:0;transition:background .15s}
.v-toggle::after{content:'';position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.2);transition:left .15s}
.v-toggle.on{background:var(--v-blue)}.v-toggle.on::after{left:19px}
.v-input{width:100%;height:40px;border:1px solid var(--v-line2);border-radius:8px;padding:0 12px;font:inherit;font-size:14px;background:#fff;color:var(--v-ink)}
.v-input:focus{outline:none;border-color:var(--v-blue);box-shadow:0 0 0 3px var(--v-blue-s)}
.v-chk{width:20px;height:20px;border-radius:5px;border:1.5px solid #B8BEC6;background:#fff;display:grid;place-items:center;color:#fff;flex-shrink:0}
.v-chk.on{background:var(--v-blue);border-color:var(--v-blue)}
/* Home agent */
.v-hero{max-width:760px;margin:48px auto 0;text-align:center}
.v-hero h1{font-size:30px;font-weight:700;letter-spacing:-0.03em;margin:0}
.v-hero p{margin:10px 0 28px;color:var(--v-mute);font-size:15px}
.v-ask{background:#fff;border:1px solid var(--v-line2);border-radius:16px;padding:16px 16px 12px;text-align:left;box-shadow:0 8px 28px -12px rgba(14,17,22,.12)}
.v-ask:focus-within{border-color:var(--v-blue);box-shadow:0 0 0 4px var(--v-blue-s),0 8px 28px -12px rgba(14,17,22,.12)}
.v-ask textarea{width:100%;border:0;resize:none;font:inherit;font-size:16px;line-height:1.5;min-height:52px;outline:none;color:var(--v-ink);background:transparent}
.v-ask-bar{display:flex;align-items:center;gap:8px;margin-top:6px}
.v-ask-bar .sp{flex:1}
.v-send{width:40px;height:40px;border-radius:10px;border:0;background:var(--v-blue);color:#fff;display:grid;place-items:center}
.v-send:disabled{background:#CDD1D6}
.v-sugg{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin-top:16px}
.v-sugg button{height:34px;padding:0 14px;border-radius:17px;border:1px solid var(--v-line2);background:#fff;font-size:13px;color:var(--v-ink2)}
.v-sugg button:hover{border-color:var(--v-blue);color:var(--v-blue-dd)}
.v-reply{margin-top:20px;text-align:left;display:flex;gap:12px}
.v-reply .ai{width:32px;height:32px;border-radius:50%;background:var(--v-ink);color:#fff;display:grid;place-items:center;flex-shrink:0}
.v-tasks{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px;margin-top:56px}
.v-task{padding:18px 20px;display:flex;flex-direction:column;gap:10px;text-align:left;cursor:pointer;transition:border-color .12s}
.v-task:hover{border-color:var(--v-blue)}
.v-task .k{font-size:12px;font-weight:600;color:var(--v-mute)}
.v-task b{font-size:16px;font-weight:700}
.v-bar{height:6px;border-radius:3px;background:#ECEEF0;overflow:hidden}
.v-bar>div{height:100%;background:var(--v-blue);border-radius:3px;transition:width .4s}
/* Course setup */
.v-setup{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:24px;align-items:start}
.v-sticky{position:sticky;top:24px}
.v-weeks{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:10px}
.v-week{padding:12px 14px;border:1px solid var(--v-line);border-radius:10px;background:#fff}
.v-week .h{display:flex;align-items:center;gap:8px;margin-bottom:8px}
.v-week .h b{font-size:12px;color:var(--v-blue-d);font-weight:700}
.v-week .h span{font-size:14px;font-weight:600}
.v-week ol{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:4px}
.v-week li{display:flex;gap:8px;font-size:13px;color:var(--v-ink2);line-height:1.4}
.v-week li em{font-style:normal;color:var(--v-faint);font-size:12px;width:38px;white-space:nowrap;flex-shrink:0;padding-top:1px}
.v-tpls{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.v-tpl{border:1.5px solid var(--v-line);border-radius:12px;background:#fff;padding:10px;text-align:left;display:flex;flex-direction:column;gap:10px;cursor:pointer;position:relative}
.v-tpl:hover{border-color:#B8D9EE}
.v-tpl.on{border-color:var(--v-blue);box-shadow:0 0 0 3px var(--v-blue-s)}
.v-tpl .nm{font-size:14px;font-weight:700;padding:0 4px}
.v-tpl .why{font-size:12px;color:var(--v-mute);line-height:1.45;padding:0 4px 4px}
.v-tpl .pick{position:absolute;top:20px;right:20px;width:26px;height:26px;box-sizing:border-box;border:2px solid #fff;border-radius:50%;background:var(--v-blue);color:#fff;display:grid;place-items:center;box-shadow:0 2px 6px rgba(15,30,60,.25);z-index:1}
.v-drop{border:1.5px dashed #C6CCD3;border-radius:12px;padding:20px;display:flex;align-items:center;gap:14px;background:#FAFBFC;cursor:pointer}
.v-drop:hover{border-color:var(--v-blue);background:var(--v-blue-ss)}
.v-file{display:flex;align-items:center;gap:12px;padding:12px 14px;border:1px solid var(--v-line);border-radius:10px;background:#fff}
.v-file .ic{width:36px;height:36px;border-radius:8px;background:var(--v-bg);display:grid;place-items:center;color:var(--v-mute);flex-shrink:0}
.v-file b{display:block;font-size:13px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.v-file span{font-size:12px;color:var(--v-mute)}
.v-row{display:flex;align-items:center;gap:12px;padding:14px 0;border-top:1px solid var(--v-line)}
.v-row:first-child{border-top:0}
.v-row .t{flex:1;min-width:0}
/* 설정 줄: 휴대폰에서 제목 칸이 눌리지 않게 최소 폭을 주고, 조절 버튼이 옆에 안 들어가면 아랫줄로 */
@media (max-width:640px){.v-row{flex-wrap:wrap}.v-row .t{flex:1 1 180px}}.v-row .t b{display:block;font-size:14px;font-weight:600}.v-row .t span{font-size:12px;color:var(--v-mute)}
.v-sum dl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:10px 16px;font-size:13px}
.v-sum dt{color:var(--v-mute)}.v-sum dd{margin:0;font-weight:600;text-align:right}
/* Modal */
.v-scrim{position:fixed;inset:0;background:rgba(14,17,22,.4);z-index:100;display:grid;place-items:center;padding:24px}
.v-modal{background:#fff;border-radius:16px;width:min(1000px,100%);max-height:calc(100vh - 48px);display:flex;flex-direction:column;overflow:hidden}
.v-modal-h{display:flex;align-items:center;gap:12px;padding:20px 24px;border-bottom:1px solid var(--v-line)}
.v-modal-h h3{margin:0;font-size:18px;font-weight:700}
.v-modal-b{padding:20px 24px;overflow:auto}
.v-seg{display:inline-flex;background:var(--v-bg);border-radius:8px;padding:3px;gap:2px}
.v-seg button{height:30px;padding:0 12px;border:0;border-radius:6px;background:transparent;font-size:13px;font-weight:600;color:var(--v-mute)}
.v-seg button.on{background:#fff;color:var(--v-ink);box-shadow:0 1px 2px rgba(0,0,0,.08)}
/* Agent */
.v-agent{display:grid;grid-template-columns:360px minmax(0,1fr);gap:24px;align-items:start}
.v-tl{list-style:none;margin:0;padding:0}
.v-tl li{display:flex;gap:14px;position:relative;padding-bottom:22px}
.v-tl li:last-child{padding-bottom:0}
.v-tl li::before{content:'';position:absolute;left:11px;top:26px;bottom:2px;width:2px;background:var(--v-line)}
.v-tl li:last-child::before{display:none}
.v-tl li.done::before{background:var(--v-blue)}
.v-tl .dot{width:24px;height:24px;border-radius:50%;border:2px solid #CDD1D6;background:#fff;flex-shrink:0;display:grid;place-items:center;color:#fff;position:relative;z-index:1}
.v-tl li.done .dot{background:var(--v-blue);border-color:var(--v-blue)}
.v-tl li.run .dot{border-color:var(--v-blue)}
.v-tl li.run .dot::after{content:'';width:8px;height:8px;border-radius:50%;background:var(--v-blue);animation:vpulse 1.2s ease-in-out infinite}
@keyframes vpulse{50%{transform:scale(.5);opacity:.5}}
.v-tl b{display:block;font-size:14px;font-weight:600;line-height:24px}
.v-tl span{display:block;font-size:12px;color:var(--v-mute);margin-top:2px}
.v-tl li.wait b{color:var(--v-faint)}
.v-grid39{display:grid;grid-template-columns:56px repeat(3,minmax(0,1fr));gap:6px;align-items:center}
.v-grid39 .wk{font-size:12px;font-weight:600;color:var(--v-mute)}
.v-cell{height:30px;border-radius:6px;background:#EEF0F2;font-size:12px;color:var(--v-faint);display:flex;align-items:center;padding:0 10px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;transition:background .3s,color .3s}
.v-cell.run{background:var(--v-blue-s);color:var(--v-blue-dd);box-shadow:inset 0 0 0 1.5px var(--v-blue)}
.v-cell.done{background:var(--v-blue);color:#fff}
/* Review */
.v-rev{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:24px;align-items:start}
.v-issue{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:14px;padding:16px 20px;border-top:1px solid var(--v-line);align-items:start}
.v-issue:first-child{border-top:0}
.v-issue.ok{background:#FAFBFC}
.v-issue.ok .ttl{color:var(--v-mute)}
.v-issue .ttl{font-size:14px;font-weight:600;margin:4px 0 8px}
/* 검수 항목: 휴대폰 폭에서는 버튼을 제목 아래 줄로 내려 제목 칸이 눌리지 않게 */
@media (max-width:640px){.v-issue{grid-template-columns:auto minmax(0,1fr);gap:10px 12px;padding:14px 16px}.v-issue-act{grid-column:1/-1;flex-wrap:wrap;justify-content:flex-end}}
.v-diff{display:grid;gap:4px;font-size:13px;line-height:1.5}
.v-diff div{display:flex;gap:8px}
.v-diff s{color:#A8232A;text-decoration-color:rgba(168,35,42,.4)}
.v-diff ins{text-decoration:none;color:#166B4A}
.v-diff em{font-style:normal;font-size:11px;font-weight:700;width:28px;flex-shrink:0;padding-top:2px;color:var(--v-faint)}
.v-filter{display:flex;gap:6px;flex-wrap:wrap}
.v-filter button{height:32px;padding:0 12px;border-radius:16px;border:1px solid var(--v-line2);background:#fff;font-size:13px;color:var(--v-ink2);font-weight:500}
.v-filter button.on{background:var(--v-ink);border-color:var(--v-ink);color:#fff}
/* Editor */
.v-ed{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:20px;align-items:start}
.v-stage{background:#E9EBEE;border-radius:12px;padding:20px;display:grid;place-items:center}
.v-stage [contenteditable="true"]:focus{outline:none}
.v-stage .slide-canvas *[data-ed]{cursor:text}
.v-thumbs{display:flex;gap:8px;overflow-x:auto;padding:12px 2px 4px}
.v-thumb{flex-shrink:0;border:2px solid transparent;border-radius:6px;padding:0;background:none;position:relative}
.v-thumb.on{border-color:var(--v-blue)}
.v-thumb .flag{position:absolute;top:4px;right:4px;width:8px;height:8px;border-radius:50%;background:var(--v-orange);box-shadow:0 0 0 2px #fff}
.v-thumb .no{position:absolute;left:4px;bottom:4px;font-size:11px;font-weight:700;background:rgba(14,17,22,.7);color:#fff;border-radius:3px;padding:0 4px}
.v-aibox{padding:16px}
.v-aibox textarea{width:100%;min-height:72px;border:1px solid var(--v-line2);border-radius:8px;padding:10px 12px;font:inherit;font-size:13px;resize:none}
.v-aibox textarea:focus{outline:none;border-color:var(--v-blue)}
/* 요구분석: 질문지가 없을 때(준비 중·실패) */
.nq-empty{display:flex;flex-wrap:wrap;align-items:center;gap:12px 14px;padding:20px 22px}
.nq-empty>svg{flex:none;color:var(--v-blue)}
.nq-empty>div{flex:1;min-width:200px;display:grid;gap:3px}
.nq-empty b{font-size:14px}
.nq-empty span{font-size:13px;color:var(--v-mute);word-break:keep-all}
.nq-empty .v-btn{display:flex;align-items:center;gap:5px}
/* 주차 상세(교시 배분 고치기) */
.v-modal.wd{width:min(760px,100%)}
.wd-h{align-items:flex-start;padding:22px 24px 18px}
.wd-h .v-tag{margin-top:3px;flex:none}
.wd-ttl{flex:1;min-width:0}
.wd-ttl h3{font-size:20px;letter-spacing:-.02em;line-height:1.35;word-break:keep-all}
.wd-meta{display:flex;flex-wrap:wrap;gap:6px 0;margin-top:6px;font-size:13px;color:var(--v-mute)}
.wd-meta span+span:before{content:'·';margin:0 7px;color:var(--v-faint)}
.wd-x{flex:none;width:36px;height:36px;border:0;border-radius:10px;background:transparent;color:var(--v-mute);display:grid;place-items:center;cursor:pointer;margin:-4px -6px 0 0}
.wd-x:hover{background:var(--v-bg);color:var(--v-ink)}
.wd-b{display:grid;gap:24px;padding:22px 24px 8px}
.wd-sec{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;margin-bottom:10px}
.wd-sec b{font-size:14px}
.wd-sec span{font-size:13px;color:var(--v-mute);word-break:keep-all}
.wd-sec .wd-src{font-size:11.5px;font-weight:600;color:var(--v-mute);background:var(--v-bg);border-radius:999px;padding:2px 9px}
.wd-acts{margin:0;padding:12px 16px 12px 34px;background:var(--v-bg);border-radius:12px;font-size:14px;line-height:1.75;color:var(--v-ink2)}
.wd-acts li::marker{color:var(--v-faint)}
.wd-none{padding:12px 16px;background:var(--v-bg);border-radius:12px;font-size:13px;color:var(--v-mute)}
.wd-list{display:grid;gap:10px}
.wd-ses{display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:14px;align-items:start;padding:14px 16px;border:1px solid var(--v-line);border-radius:12px;background:#fff;transition:border-color .15s,background .15s}
.wd-ses.on{border-color:var(--v-blue);background:var(--v-blue-ss)}
.wd-no{display:grid;justify-items:center;gap:2px;padding-top:20px}
.wd-no b{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:var(--v-blue-s);color:var(--v-blue-dd);font-size:14px}
.wd-no span{font-size:11px;color:var(--v-mute)}
.wd-fields{display:grid;gap:10px;min-width:0}
.wd-f{display:grid;gap:5px}
.wd-f>span{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:600;color:var(--v-mute)}
.wd-f input.v-input{height:38px;font-weight:600;font-size:14px}
.wd-f textarea.v-input{height:auto;min-height:58px;padding:9px 12px;font:inherit;font-size:13.5px;line-height:1.5;resize:vertical}
.wd-chg{font-style:normal;font-size:11px;font-weight:700;color:var(--v-blue-dd);background:var(--v-blue-s);border-radius:999px;padding:1px 7px}
.v-input.wd-err{border-color:var(--v-red)}
.wd-errt{font-size:12px;color:var(--v-red)}
.wd-note{display:flex;gap:6px;align-items:flex-start;font-size:12.5px;line-height:1.5;color:#8A4A0C;background:var(--v-orange-s);border-radius:8px;padding:8px 10px;word-break:keep-all}
.wd-note svg{flex:none;margin-top:2px}
.wd-regen{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;font-size:12.5px;line-height:1.5;color:var(--v-blue-dd);background:var(--v-blue-s);border-radius:8px;padding:8px 8px 8px 10px;word-break:keep-all}
.wd-regen>span{flex:1;min-width:180px;display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.wd-regen svg{flex:none}
.wd-regen .v-btn{display:flex;align-items:center;gap:5px;flex:none}
.wd-regen.q{color:var(--v-ink2);background:var(--v-bg)}
.wd-regen-all{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;margin-bottom:10px;padding:10px 12px;border-radius:10px;background:var(--v-blue-s);color:var(--v-blue-dd);font-size:13px;font-weight:600}
.wd-regen-all span{flex:1;min-width:180px}
.wd-st{display:grid;gap:8px;justify-items:end;padding-top:20px}
.wd-st .v-btn{display:flex;align-items:center;gap:5px}
.wd-foot{display:flex;align-items:center;gap:12px;padding:14px 24px;border-top:1px solid var(--v-line);background:#fff}
.wd-state{flex:1;display:flex;align-items:center;gap:7px;font-size:13px;font-weight:600;color:var(--v-green, #1E8E5A);min-width:0}
.wd-state i{width:8px;height:8px;border-radius:50%;background:var(--v-orange, #E08A1E);flex:none}
.wd-state i.err{background:var(--v-red)}
.wd-state.dirty{color:var(--v-ink2)}
.wd-hint{font-weight:400;color:var(--v-faint)}
.wd-btns{display:flex;gap:8px;flex:none}
@media (max-width:640px){
  .wd-ses{grid-template-columns:minmax(0,1fr);gap:10px}
  .wd-no{display:flex;align-items:center;gap:6px;padding-top:0}
  .wd-no b{width:26px;height:26px;font-size:13px}
  .wd-st{display:flex;justify-content:flex-start;padding-top:0}
  .wd-foot{flex-wrap:wrap;padding:12px 16px}
  .wd-btns{width:100%;justify-content:flex-end}
  .wd-hint{display:none}
}
.ed-plan-chg{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;padding:10px 12px 10px 14px;border-radius:10px;background:var(--v-blue-s);color:var(--v-blue-dd);font-size:13px;line-height:1.5;margin-bottom:14px;word-break:keep-all}
.ed-plan-chg>span{flex:1;min-width:220px}
.ed-plan-chg svg{flex:none}
.ed-plan-chg .v-btn{display:flex;align-items:center;gap:5px}
/* AI 요청 진행 중: 상태 + 멈추기 */
.ed-run{display:flex;align-items:center;gap:8px;height:36px;padding:0 4px 0 12px;border-radius:8px;background:var(--v-blue-s)}
.ed-run-t{flex:1;display:flex;align-items:center;gap:8px;font-size:13px;font-weight:600;color:var(--v-blue-dd)}
.ed-run .ed-stop{height:28px;padding:0 10px;background:#fff;border:1px solid var(--v-line2);color:#C0392B;font-weight:600;display:flex;align-items:center;gap:4px}
.ed-run .ed-stop:hover{background:#FDECEA;border-color:#E6B0AA}
.ed-spin{width:12px;height:12px;border-radius:50%;border:2px solid currentColor;border-right-color:transparent;display:inline-block;animation:ed-spin .8s linear infinite;flex:none}
@keyframes ed-spin{to{transform:rotate(360deg)}}
.v-float button.ed-stop{color:#FFB4AB;font-weight:600}
.tb-redesign.ed-stop-tb b{color:#C0392B}
/* 편집기 한 장 AI 작업(SPEC-MOTION-001 M5): 장 위 얇은 꼬리표(장 넓이 25% 이하, 내용을 덮지 않음)·축소판 꼬리표, 끝난 뒤 바뀐 곳 강조(한 번, 1.5초 뒤 지움) */
.ed-onslide{position:absolute;top:8px;left:8px;z-index:6;max-width:25%;display:flex;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;background:rgba(14,17,22,.78);color:#fff;font-size:12px;font-weight:600;line-height:1.4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;pointer-events:none}
.v-thumb .th-busy{position:absolute;left:3px;top:3px;display:flex;align-items:center;gap:3px;padding:2px 5px;border-radius:4px;background:var(--v-blue);color:#fff;font-size:10px;font-weight:700;line-height:1.2;white-space:nowrap;pointer-events:none}
.v-thumb .th-busy .ed-spin{width:8px;height:8px;border-width:1.5px}
.ed-hl{outline:3px solid #2FB4F5;outline-offset:2px;border-radius:4px;animation:edHl 1.5s ease-out 1 forwards}
[data-field].ed-hl{outline-width:7px;outline-offset:3px} /* 슬라이드 안 칸은 축소되어 그려지므로 두껍게(1920 기준) */
@keyframes edHl{0%,60%{outline-color:#2FB4F5}100%{outline-color:rgba(47,180,245,0)}}
@media (prefers-reduced-motion:reduce){.ed-hl{animation:none}} /* 서서히 사라지지 않고 멈춘 테두리로 보였다가 같은 시간에 지워짐 */
/* 동작 줄이기(B-5): 편집기 작업 돌림표는 멈춘 점선 고리(곁의 'AI가 … 중' 낱말과 함께), 분석 화면 스캔 줄은 숨김(멈춘 줄이 글을 가리지 않게) */
@media (prefers-reduced-motion:reduce){.ed-spin{border-style:dotted;border-right-color:currentColor}.az-scan{display:none}}
.v-quick{display:flex;flex-wrap:wrap;gap:6px}
.v-quick button{height:30px;padding:0 10px;border-radius:6px;border:1px solid var(--v-line2);background:#fff;font-size:12px;font-weight:500;color:var(--v-ink2)}
.v-quick button:hover{border-color:var(--v-blue);color:var(--v-blue-dd);background:var(--v-blue-ss)}
.v-float{position:fixed;z-index:60;display:flex;gap:2px;background:var(--v-ink);border-radius:8px;padding:4px;box-shadow:0 8px 24px rgba(0,0,0,.25)}
.v-float button{height:30px;padding:0 10px;border:0;border-radius:5px;background:transparent;color:#fff;font-size:12px;font-weight:500;display:flex;align-items:center;gap:6px}
.v-float button:hover{background:rgba(255,255,255,.12)}
/* Table */
.v-table{width:100%;border-collapse:collapse;font-size:13px}
.v-table th{text-align:left;font-weight:600;color:var(--v-mute);font-size:12px;padding:12px 16px;border-bottom:1px solid var(--v-line);background:#FAFBFC}
.v-table td{padding:14px 16px;border-bottom:1px solid var(--v-line);vertical-align:middle}
.v-table tr:last-child td{border-bottom:0}
/* 알림 묶음(app-shell Toasts, 사용자 2026-11-05: 아래 가운데 검은 상자가 거슬려서) — 화면 오른쪽 위, 흰 바탕·옅은 테두리, 종류별 왼쪽 색 띠(성공 초록·안내 파랑·오류 빨강).
   가장 최근 3개까지 쌓임. 알림 묶음 빈 곳은 누르기가 통과(뒤 단추를 막지 않음). 좁은 화면은 위 막대(52px) 아래 가로 꽉 차게, 작게 */
.v-toasts{position:fixed;top:16px;right:16px;z-index:130;display:flex;flex-direction:column;align-items:flex-end;gap:0;width:min(360px,calc(100vw - 32px));pointer-events:none}
.v-toasts-g{display:flex;flex-direction:column;align-items:stretch;gap:8px;width:100%}.v-toasts-g:not(:empty)+.v-toasts-g:not(:empty){margin-top:8px} /* 두 읽기 영역은 늘 그려 둠(감추면 새 알림을 안 읽는 화면 읽기 프로그램이 있음) */
.v-toast{pointer-events:auto;display:flex;align-items:center;gap:10px;box-sizing:border-box;width:100%;padding:10px 10px 10px 12px;background:#fff;color:var(--v-ink);border:1px solid var(--v-line);border-left:4px solid var(--v-green);border-radius:10px;box-shadow:0 6px 18px rgba(16,24,40,.08);font-size:13.5px;line-height:1.45;word-break:keep-all;overflow-wrap:anywhere;animation:vtoast .16s ease-out}
.v-toast.ok{border-left-color:var(--v-green)}.v-toast.info{border-left-color:var(--v-blue)}.v-toast.err{border-left-color:var(--v-red)}
.v-toast-i{flex:none;width:18px;height:18px;border-radius:50%;display:grid;place-items:center;color:#fff;background:var(--v-green)}.v-toast.info .v-toast-i{background:var(--v-blue)}.v-toast.err .v-toast-i{background:var(--v-red)}
.v-toast-m{flex:1;min-width:0}.v-toast .v-btn{flex:none}
.v-toast-x{flex:none;border:0;background:transparent;color:var(--v-mute);padding:4px;border-radius:6px;display:grid;place-items:center;cursor:pointer}.v-toast-x:hover{background:var(--v-bg);color:var(--v-ink)}
/* 살짝 흐린 유리(글래스모피즘) — 흐림을 지원할 때만. 투명도 줄이기 설정이면 꽉 찬 흰 카드로 돌아감 */
@supports ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){.v-toast{background:rgba(255,255,255,.78);-webkit-backdrop-filter:blur(14px) saturate(160%);backdrop-filter:blur(14px) saturate(160%);border-color:rgba(255,255,255,.65);box-shadow:0 8px 24px rgba(16,24,40,.12),inset 0 1px 0 rgba(255,255,255,.75)}}
@media (prefers-reduced-transparency:reduce){.v-toast{background:#fff;-webkit-backdrop-filter:none;backdrop-filter:none;border-color:var(--v-line);box-shadow:0 6px 18px rgba(16,24,40,.08)}}
@keyframes vtoast{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.v-toast{animation:none}}
@media (max-width:640px){.v-toasts{left:12px;right:12px;top:calc(60px + env(safe-area-inset-top));width:auto;align-items:stretch}.v-toast{padding:8px 8px 8px 10px;font-size:13px}}
/* 더 보기 메뉴(app-shell MoreMenu, 점검 U7) */
.v-more{position:relative;display:inline-flex}.v-more-m{position:fixed;z-index:160;min-width:140px;display:grid;gap:2px;padding:4px;background:#fff;border:1px solid var(--v-line);border-radius:10px;box-shadow:0 12px 32px rgba(0,0,0,.14)}.v-more-m .v-btn{justify-content:flex-start;white-space:nowrap}.v-more-m .v-btn.dg{color:var(--v-red)}
.v-mini-tpl{aspect-ratio:16/9;border-radius:7px;overflow:hidden;position:relative;border:1px solid rgba(0,0,0,.06)}
@media (max-width:1199px){.v-setup,.v-rev,.v-ed,.v-agent{grid-template-columns:minmax(0,1fr)}.v-sticky{position:static}.v-tpls{grid-template-columns:repeat(2,minmax(0,1fr))}}

.v-btn>.v-tag{margin-left:8px}.v-tag{gap:0}.v-tag>i,.v-tag>svg{margin-right:6px}.v-nav button{gap:0}.v-nav button>svg{margin-right:10px}

.v-btn{display:inline-block;line-height:38px;text-align:center;vertical-align:middle}.v-btn.sm{line-height:30px}.v-btn.lg{line-height:50px}.v-btn>svg{vertical-align:-3px;margin-right:6px}.v-btn>.v-tag{vertical-align:1px}.v-side{align-self:start}

.v-plan{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:20px;align-items:start}.v-plan>aside{position:sticky;top:24px}@media (max-width:1199px){.v-plan{grid-template-columns:minmax(0,1fr)}.v-plan>aside{position:static;order:-1;display:grid!important;grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}}

.az-doc{position:relative;height:300px;overflow:hidden;border-radius:10px;background:#161A21;padding:14px 14px;font-size:11px;line-height:1.75;color:#5A6473;mask-image:linear-gradient(180deg,#000 75%,transparent)}.az-line{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;opacity:0;animation:azIn .4s ease forwards}.az-line:nth-child(3n){color:#9AD8F7}@keyframes azIn{to{opacity:1}}.az-scan{position:absolute;left:0;right:0;height:46px;top:-46px;background:linear-gradient(180deg,transparent,rgba(0,157,232,.35),transparent);animation:azScan 2.4s linear infinite}@keyframes azScan{to{top:100%}}.az-res{display:grid;gap:8px;padding:14px 16px;border-radius:12px;background:var(--v-blue-ss);border:1px solid #CDE8F8}.az-res>div{display:grid;grid-template-columns:76px minmax(0,1fr);gap:10px;font-size:13px}.az-res span{color:var(--v-mute)}.az-res em{font-style:normal;color:var(--v-blue-d);margin-left:6px;font-weight:600}.v-week-click{cursor:pointer;transition:border-color .12s,box-shadow .12s}.v-week-click:hover{border-color:var(--v-blue);box-shadow:0 4px 14px -6px rgba(36,89,216,.35)}
@media (max-width:900px){.v-modal[style*="300px minmax"]{grid-template-columns:1fr!important}}

.pd{position:fixed;right:20px;bottom:20px;z-index:120;width:min(340px,calc(100vw - 40px));background:#0E1116;color:#fff;border-radius:16px;box-shadow:0 18px 50px -12px rgba(0,0,0,.45);overflow:hidden;animation:pdIn .3s cubic-bezier(.2,.8,.2,1)}@keyframes pdIn{from{transform:translateY(16px);opacity:0}}
.pd-h{display:flex;align-items:center;gap:10px;padding:12px 16px;cursor:pointer;font-size:13px;white-space:nowrap}.pd-pulse{width:8px;height:8px;border-radius:50%;background:#2FB4F5;box-shadow:0 0 0 0 rgba(47,180,245,.6);animation:pdP 1.6s infinite;flex-shrink:0;display:inline-block}@keyframes pdP{70%{box-shadow:0 0 0 8px rgba(47,180,245,0)}100%{box-shadow:0 0 0 0 rgba(47,180,245,0)}}
.pd-b{display:grid;gap:8px;padding:0 10px 10px;max-height:50vh;overflow:auto}.pd-t{display:grid;gap:8px;padding:12px;border-radius:12px;background:#1A1F27;text-align:left;color:#fff;border:0;width:100%}.pd-t.done{background:#12352A}.pd-t.err{background:#3A1A1A}
.pd-row{display:flex;justify-content:space-between;gap:8px;font-size:13px}.pd-row span{color:#9AD8F7;font-variant-numeric:tabular-nums}.pd-bar{height:4px;border-radius:2px;background:#2A313C;overflow:hidden}.pd-bar i{display:block;height:100%;background:linear-gradient(90deg,#2FB4F5,#7DD3FC);transition:width .6s ease}
.pd-steps{display:flex;flex-wrap:wrap;gap:4px 10px;font-size:11px;color:#5A6473}.pd-steps .done{color:#7CD8B0}.pd-steps .run{color:#fff;font-weight:600}.pd-sub{font-size:11px;color:#7A8390}
.pd-grid{display:grid;grid-template-columns:repeat(13,1fr);gap:3px}.pd-grid i{height:8px;border-radius:2px;background:#2A313C}@keyframes pdB{to{opacity:.4}}
/* 진행 패널 교시 칸 모양(SPEC-MOTION-001 REQ-MO-013, Motion.cell): 작업 중·완료 채움 / 사람 대기 테두리 / 느림·멈춤 회색 빗금 / 실패 × / 순서 대기 옅은 채움 — 깜박임은 loop(work + 자료 새로움)일 때만 */
.pd-grid i.sh-fill{background:#2FB4F5}.pd-grid i.k-done{background:#34C38F}.pd-grid i.loop{animation:pdB 1s infinite alternate}
.pd-grid i.sh-outline{background:transparent;box-shadow:inset 0 0 0 1.5px #F5B544}.pd-grid i.sh-hatch{background:repeating-linear-gradient(135deg,#7A8390 0 2px,#2A313C 2px 4px)}
.pd-grid i.sh-cross{background:linear-gradient(45deg,transparent 40%,#FFE1DE 40% 60%,transparent 60%),linear-gradient(-45deg,transparent 40%,#FFE1DE 40% 60%,transparent 60%),#F04438}.pd-grid i.sh-pale{background:rgba(47,180,245,.28)}
.pd-tag{display:inline-flex;align-items:center;gap:4px}.pd-tag svg{flex-shrink:0}
.pd-note{display:flex;align-items:flex-start;gap:6px;font-size:11px;line-height:1.45;color:#CBD5E1;word-break:keep-all}.pd-note svg{flex-shrink:0;margin-top:1px}.pd-err{font-style:normal;font-weight:600;color:#FF8A80}
/* 느림·멈춤·자료 오래됨: 회색 차분한 카드(움직임 없음) */.pd-t.calm{background:#23272E}.pd-t.calm .pd-row span{color:#CBD5E1}.pd-dot.g{background:#94A3B8}
.pd.min .pd-h{padding:10px 14px}
/* 진행 패널: 1200px보다 좁으면 접힌 패널을 글자 길이만큼의 알약으로(본문을 덜 가림), 휴대폰에서는 펼쳐도 양옆 여백만 둠 */
@media (max-width:1199px){.pd.min{width:auto;max-width:calc(100vw - 40px);border-radius:999px}.pd.min .pd-h{gap:8px}}
@media (max-width:640px){.pd{right:12px;bottom:12px;width:calc(100vw - 24px)}.pd.min{width:auto;max-width:calc(100vw - 24px)}.pd.min .pd-h{padding:9px 14px;font-size:12.5px}}
/* 진행 패널: 사람 확인 대기·일시 정지 */.pd-dot{width:8px;height:8px;border-radius:50%;background:#F5B544;flex-shrink:0}.pd-t.wait,.pd-t.hold{background:#2E2614}.pd-t.wait .pd-row span,.pd-t.hold .pd-row span{color:#F5C46B}.pd-t.wait .pd-sub{color:#F5D9A3}/* 일시 정지는 대기 색이 아닌 회색(REQ-MO-008) */.pd-t.hold{background:#23272E}.pd-t.hold .pd-row span{color:#CBD5E1}
.sg{position:fixed;inset:0;z-index:150;display:grid;place-items:center;background:rgba(10,14,20,.28);backdrop-filter:blur(2px);animation:sgIn .25s ease}@keyframes sgIn{from{opacity:0}}
.sg-card{display:grid;justify-items:center;gap:8px;padding:28px 36px;background:#fff;border-radius:20px;box-shadow:0 24px 60px -16px rgba(0,0,0,.35);animation:sgPop .4s cubic-bezier(.2,.9,.3,1.2)}@keyframes sgPop{from{transform:scale(.92);opacity:0}}
.sg-card b{font-size:20px;letter-spacing:-.02em;margin-top:10px}.sg-card>span{font-size:13px;color:var(--v-mute)}
.sg-flow{display:flex;align-items:center}.sg-node{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;font-size:12px;font-weight:700;background:#EEF0F2;color:var(--v-mute)}.sg-node.done{background:var(--v-blue);color:#fff}.sg-node.on{background:#fff;color:var(--v-blue);box-shadow:0 0 0 2px var(--v-blue),0 0 0 7px rgba(36,89,216,.18);animation:sgOn 1s infinite alternate}@keyframes sgOn{to{box-shadow:0 0 0 2px var(--v-blue),0 0 0 11px rgba(36,89,216,.06)}}
.sg-arr{width:34px;height:2px;background:linear-gradient(90deg,var(--v-blue) 50%,#E1E4E8 50%);background-size:200% 100%;animation:sgA 1.2s ease forwards}@keyframes sgA{from{background-position:100% 0}to{background-position:0 0}}
.nq-gen{display:grid;gap:12px}.nq-sk{display:grid;gap:6px;opacity:0;animation:azIn .4s ease forwards}.nq-sk span,.nq-sk i{display:block;border-radius:6px;background:linear-gradient(90deg,#EEF0F2 25%,#F7F8FA 50%,#EEF0F2 75%);background-size:200% 100%;animation:sk 1.4s infinite}.nq-sk span{height:16px;width:70%}.nq-sk i{height:56px}@keyframes sk{to{background-position:-200% 0}}
.nq-cap{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--v-blue-dd)}
/* 요구분석 — 교수 확인형 질문 */
.nq-lead{display:flex;align-items:center;gap:8px;padding:12px 16px;border-radius:12px;background:#EDF3FF;color:var(--v-blue-dd);font-size:13px}.nq-lead svg{flex:none}
.nq-item{display:grid;gap:8px;padding:14px 16px;border:1px solid #E5E9EF;border-radius:12px;background:#fff}.nq-item.ok{border-color:#CDEBDC;background:#FAFDFB}
.nq-q{display:flex;align-items:flex-start;gap:10px;font-size:14px;font-weight:600;line-height:1.5}.nq-q>span{flex:1}
.nq-done{display:inline-flex;align-items:center;gap:3px;flex:none;font-style:normal;font-size:12px;font-weight:600;color:#166B4A;background:var(--v-green-s);border-radius:999px;padding:2px 8px}
.nq-acts{display:flex;align-items:center;gap:10px;font-size:12px;color:var(--v-mute)}
/* 교수님만 아는 질문 — AI가 채우지 못한 부분을 짚어 줌 */
.nq-unk{border-color:#FFD9A8}.nq-unk .v-sec-t .n{background:#FFF1DE;color:#A65A00}
.nq-gap{display:grid;gap:2px;padding:8px 12px;border-radius:8px;background:#FFF7EC;font-size:13px;color:#7A4A00;line-height:1.5}.nq-gap b{font-size:12px;color:#A65A00}
.nq-so{display:flex;align-items:center;gap:8px;padding:12px 14px;border:1px solid #E5E9EF;border-radius:12px;background:#FAFBFD;font-size:13px;color:var(--v-ink2);line-height:1.5}.nq-so>span{flex:1}.nq-so svg{flex:none;color:var(--v-blue)}
.nq-photos{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}
.nq-photos button{font:inherit;display:grid;gap:6px;padding:6px;border:1.5px solid #E1E6ED;border-radius:10px;background:#fff;cursor:pointer;text-align:left;font-size:12px;font-weight:600;color:var(--v-ink)}
.nq-photos button img{width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:6px;background:#EEF1F5}
.nq-photos button.on{border-color:var(--v-blue);box-shadow:0 0 0 3px #DCE7FF}.nq-photos button.nq-txt{align-content:center;min-height:60px;text-align:center}
.nq-more{font:inherit;font-size:12px;border:1.5px dashed #C9D2DE;border-radius:10px;background:none;color:var(--v-mute);cursor:pointer;min-height:60px}
.nq-prog{height:8px;border-radius:999px;background:#EEF1F5;overflow:hidden}.nq-prog i{display:block;height:100%;background:var(--v-blue);border-radius:inherit;transition:width .3s}
.nq-state{font-size:13px;line-height:1.6;color:var(--v-ink);background:#F5F7FA;border-radius:10px;padding:10px 12px}

/* 템플릿 파일을 받는 동안의 슬라이드 자리 표시 */
.pp-wait{display:grid;place-items:center;background:linear-gradient(90deg,#EEF0F2 25%,#F7F8FA 50%,#EEF0F2 75%);background-size:200% 100%;animation:ppw 1.4s linear infinite;color:#6B7280;font-size:12px;word-break:keep-all}@keyframes ppw{to{background-position:-200% 0}}@media (prefers-reduced-motion:reduce){.pp-wait{animation:none}}

/* 홈 — 인사 · 지금 할 일(교수님 차례만) · 처음 화면 */
.hm-hero{display:flex;align-items:flex-end;gap:20px;flex-wrap:wrap;margin:4px 0 24px}
.hm-hero .t{flex:1 1 260px;min-width:0}
.hm-eb{font-size:13.5px;font-weight:650;color:var(--v-blue-d)}
.hm-hero h1{font-size:30px;font-weight:750;letter-spacing:-.035em;margin:4px 0 0;line-height:1.25;text-wrap:balance}
.hm-hero p{margin:6px 0 0;color:var(--v-ink2);font-size:16px}
.hm-hero mark{background:transparent;color:var(--v-orange-d);font-weight:700}
.v-btn.hm-new{height:42px;padding:0 18px;border-radius:11px;background:var(--v-ink);border-color:var(--v-ink);color:#fff;font-size:14.5px}
.v-btn.hm-new:hover{background:#262C36}
.v-btn.hm-new>svg{margin-right:6px}
.hm-welcome{background:#fff;border:1px solid #E5E9EF;border-radius:22px;padding:26px;display:flex;flex-direction:column;gap:18px;box-shadow:0 1px 3px rgba(16,24,40,.06),0 18px 40px -18px rgba(16,24,40,.2)}
.hm-welcome h2{margin:0;font-size:22px;letter-spacing:-.03em}
.hm-welcome p{margin:4px 0 0;color:var(--v-ink2);font-size:15px}
.hm-flow{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.hm-flow div{border-radius:14px;background:#F7F9FB;border:1px solid #E7EAF0;padding:12px 14px;font-size:14px;color:var(--v-mute)}
.hm-flow div b{display:block;color:var(--v-ink);font-size:15px;margin-bottom:2px}
.hm-flow div.you{background:var(--v-orange-s);border-color:transparent}.hm-flow div.you b{color:var(--v-orange-d)}

.ht-sec{margin-bottom:8px}
.ht-h{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin-bottom:12px}
.ht-h h2{font-size:18px;margin:0;letter-spacing:-.025em}
.ht-h span{font-size:14px;color:var(--v-mute)}
.ht{background:#fff;border:1px solid #E5E9EF;border-radius:20px;overflow:hidden;box-shadow:0 1px 3px rgba(16,24,40,.06),0 18px 40px -18px rgba(16,24,40,.2)}
.ht-row{border-bottom:1px solid #EEF1F5}
.ht-rh{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:16px;align-items:center;padding:16px 20px}
.ht-ic{width:42px;height:42px;border-radius:13px;display:grid;place-items:center;flex-shrink:0}
.ht-ic.o{background:var(--v-orange-s);color:var(--v-orange-d)}.ht-ic.b{background:var(--v-blue-s);color:var(--v-blue-dd)}.ht-ic.g{background:var(--v-green-s);color:#15803D}.ht-ic.r{background:var(--v-red-s);color:#B91C1C}.ht-ic.n{background:#F7F9FB;color:var(--v-mute);box-shadow:inset 0 0 0 1px #E7EAF0}
.ht-tt{min-width:0}
.ht-tt b{display:block;font-size:16.5px;letter-spacing:-.02em}
.ht-tt .w{display:block;font-size:15px;color:var(--v-ink2);margin-top:1px}
.ht-tt .m{display:block;font-size:14px;color:var(--v-mute);margin-top:1px}
.ht-act{display:flex;gap:6px;align-items:center;flex-wrap:wrap;justify-content:flex-end}
.ht-act .v-btn:not(.sm){height:40px;padding:0 16px;font-size:14.5px;border-radius:11px}
.ht-mute{color:var(--v-mute)!important}
.ht-det{padding:0 20px 18px 78px;display:flex;flex-direction:column;gap:14px}
.ht-mgr{display:flex;align-items:center;gap:8px;font-size:14.5px;color:var(--v-ink2)}
.ht-mgr>svg{color:var(--v-blue);flex-shrink:0}
.ht-mgr b{color:var(--v-blue-dd)}
.ht-grp{display:flex;flex-direction:column;gap:8px}
.ht-gh{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:14px;color:var(--v-mute)}
.ht-item{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px;align-items:center;padding:13px 15px;background:#F7F9FB;border:1px solid #E7EAF0;border-radius:14px}
.ht-where{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:13.5px;color:var(--v-mute);margin-bottom:4px}
.ht-bef{font-size:14.5px;color:var(--v-mute);text-decoration:line-through;text-decoration-color:#A0A7B3;word-break:keep-all}
.ht-aft{font-size:15px;font-weight:650;margin-top:2px;word-break:keep-all}
.ht-aft::before{content:"→ ";color:var(--v-blue-d)}
.ht-chk{font-size:13.5px;color:#9A4A06;margin-top:4px}
.ht-ia{display:flex;gap:4px;align-items:center;flex-wrap:wrap;justify-content:flex-end}
.ht-routes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.ht-route{display:flex;flex-direction:column;gap:3px;align-items:flex-start;text-align:left;padding:15px;border:1px solid #DCE1E8;border-radius:14px;background:#fff;position:relative;min-width:0;cursor:pointer;transition:border-color .15s,box-shadow .15s,transform .15s}
.ht-route:hover,.ht-route.on{border-color:var(--v-blue);box-shadow:0 12px 28px -16px rgba(26,58,156,.35);transform:translateY(-1px)}
.ht-route:disabled{opacity:.6;cursor:default}
.ht-route b{font-size:15.5px}
.ht-route>span:not(.ri){font-size:14px;color:var(--v-mute);word-break:keep-all}
.ht-route em{position:absolute;top:13px;right:13px;font-style:normal;font-size:12px;font-weight:700;color:#15803D;background:var(--v-green-s);border-radius:999px;padding:1px 8px}
.ht-route .ri{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;margin-bottom:6px}
.ht-route .ri.g{background:var(--v-green-s);color:#15803D}.ht-route .ri.b{background:var(--v-blue-s);color:var(--v-blue-dd)}.ht-route .ri.n{background:#F7F9FB;color:var(--v-mute);box-shadow:inset 0 0 0 1px #E7EAF0}
.ht-lms{display:flex;align-items:center;gap:8px;font-size:14px;color:var(--v-mute)}
.ht-calm{display:flex;gap:14px;align-items:center;padding:18px 20px;border-bottom:1px solid #EEF1F5}
.ht-calm b{display:block;font-size:16.5px}.ht-calm span{color:var(--v-mute);font-size:15px}
.ht-foot{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:8px 16px;background:#F7F9FB;font-size:14px;color:var(--v-mute)}
.ht-lbl{display:inline-flex;align-items:center;gap:6px}
.ht-lbl>svg{color:var(--v-blue)}
.ht-ask{display:flex;align-items:center;gap:8px;flex:1 1 320px;max-width:520px;background:#fff;border:1px solid #DCE1E8;border-radius:12px;padding:4px 4px 4px 14px}
.ht-ask:focus-within{border-color:var(--v-blue);box-shadow:0 0 0 4px var(--v-blue-s)}
.ht-ask input{flex:1;min-width:0;border:0;outline:none;font:inherit;font-size:14.5px;background:transparent}
.hc-stuck{color:var(--v-orange-d);font-weight:600;font-size:12px}
@media (max-width:900px){.ht-rh{grid-template-columns:auto minmax(0,1fr)}.ht-act{grid-column:1/-1;justify-content:flex-start}.ht-det{padding:0 20px 18px}.ht-routes,.hm-flow{grid-template-columns:minmax(0,1fr)}}
@media (max-width:640px){.ht-item{grid-template-columns:minmax(0,1fr)}.ht-ia{justify-content:flex-start}.ht-lbl{display:none}.hm-hero h1{font-size:24px}}

/* ---------- 재개발 (app-refresh.jsx) ---------- */
.rf-card{padding:18px 22px;display:flex;flex-direction:column;gap:12px}
.rf-h{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.rf-h>div:nth-child(2){display:flex;flex-direction:column;gap:2px;min-width:0}.rf-h b{font-size:16px}.rf-h>div:nth-child(2)>span{font-size:13px;color:var(--v-mute);word-break:keep-all}.rf-h .sp{flex:1}
.rf-nums{display:flex;gap:6px 18px;flex-wrap:wrap;font-size:13.5px;color:var(--v-mute);padding:10px 14px;background:#F7F9FB;border-radius:12px}.rf-nums b{color:var(--v-ink);font-weight:700}.rf-nums b.o{color:var(--v-orange-d)}.rf-nums b.b{color:var(--v-blue-dd)}
.rf-lnk{font:inherit;border:0;background:none;color:var(--v-blue-dd);cursor:pointer;padding:0;text-decoration:underline;text-underline-offset:2px}
.rf-oks{display:flex;flex-direction:column;gap:8px}.rf-ok{display:flex;flex-direction:column;gap:2px;padding:10px 12px;background:#F7F9FB;border:1px solid #E7EAF0;border-radius:12px}.rf-ok .w{display:flex;align-items:center;gap:6px;font-size:12.5px;color:var(--v-mute)}.rf-ok .t{font-size:14px;word-break:keep-all}
.rf-card .ht-det{padding:0}
.rf-done{display:flex;align-items:center;gap:8px;font-size:14px;color:#15803D}
.rf-done.rf-fail{color:#B45309;align-items:flex-start;line-height:1.5;word-break:keep-all}
.rf-src{display:flex;align-items:center;gap:6px;flex-wrap:wrap;font-size:12.5px;color:var(--v-mute);margin-top:6px}.rf-src a{color:var(--v-blue-dd);font-weight:600;text-decoration:underline;text-underline-offset:2px}.rf-src.mute{color:var(--v-orange-d)}
.rf-empty{display:flex;flex-direction:column;align-items:center;gap:6px;padding:28px;color:var(--v-mute);text-align:center}.rf-empty b{color:var(--v-ink);font-size:15px}
.rf-pick{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:8px;max-height:220px;overflow:auto;padding:2px}
.rf-course{display:flex;flex-direction:column;gap:3px;align-items:flex-start;text-align:left;padding:12px 14px;border:1px solid #DCE1E8;border-radius:12px;background:#fff;cursor:pointer;min-width:0}.rf-course.on{border-color:var(--v-blue);background:var(--v-blue-ss)}.rf-course b{font-size:14.5px}.rf-course span{font-size:12.5px;color:var(--v-mute)}
.rf-go{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.rf-go .m{flex:1;font-size:12.5px;color:var(--v-mute);min-width:200px;word-break:keep-all}

/* 편집기: 끌어서 순서 바꾸기 · 다른 교시로 복사 */
.v-thumb.drag{opacity:.45}
.ed-copy{position:absolute;top:calc(100% + 6px);left:0;z-index:30;min-width:260px;max-height:300px;overflow:auto;background:#fff;border:1px solid var(--v-line);border-radius:12px;box-shadow:0 14px 34px -16px rgba(0,0,0,.25);padding:6px;display:flex;flex-direction:column}
.ed-copy button{border:0;background:none;text-align:left;padding:8px 10px;border-radius:8px;font:inherit;font-size:13px;cursor:pointer}.ed-copy button:hover:not(:disabled){background:#F3F6F9}.ed-copy button:disabled{color:var(--v-faint);cursor:default}

/* 저장된 내용으로 먼저 보여 주는 동안(서버 최신 내용 받는 중) 화면 잠금 + 위쪽 안내 */
.sync-veil{position:fixed;inset:0;z-index:9999;cursor:progress;background:rgba(244,246,250,.55);backdrop-filter:saturate(.6);-webkit-backdrop-filter:saturate(.6);animation:syncIn .25s ease-out}
.sync-veil span{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background:rgba(20,26,38,.9);color:#fff;font-size:14px;font-weight:600;padding:10px 18px;border-radius:999px;box-shadow:0 10px 26px -10px rgba(0,0,0,.45);white-space:nowrap;max-width:calc(100vw - 32px);overflow:hidden;text-overflow:ellipsis}
.sync-veil.nudge span{animation:syncNudge .45s ease-out}
@keyframes syncIn{from{opacity:0}to{opacity:1}}
@keyframes syncNudge{0%{transform:translate(-50%,-50%) scale(1)}35%{transform:translate(-50%,-50%) scale(1.08)}100%{transform:translate(-50%,-50%) scale(1)}}
@media (prefers-reduced-motion:reduce){.sync-veil,.sync-veil.nudge span{animation:none}}

/* 교과목기획서 시작 줄(교과목명만 넣고 AI로 채우기) · AI 추정 칸 · 확인할 곳 */
.pl-start{padding:24px}
.pl-lead{margin:0 0 14px;font-size:14px;color:var(--v-ink2);line-height:1.6}
.pl-row{display:flex;gap:10px;flex-wrap:wrap}
.pl-name{flex:1;min-width:220px;height:46px;font-size:16px}
.pl-go{height:46px;padding:0 18px;font-size:15px}
.pl-more{margin-top:10px}
.pl-memo{display:grid;gap:6px;margin-top:12px;font-size:13px;font-weight:600;color:var(--v-ink2)}
.pl-memo textarea{height:auto;padding:10px;font-size:13px;line-height:1.5}
.pl-prog{margin-top:14px;display:grid;gap:8px;font-size:13px;color:var(--v-mute)}
.pl-bar{height:6px;border-radius:99px;background:#EEF1F5;overflow:hidden}.pl-bar i{display:block;height:100%;background:var(--v-blue,#009DE8);transition:width 1s linear}
.pl-alt{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:18px;padding-top:14px;border-top:1px solid var(--v-line)}
.pl-alt>span{font-size:12px;color:var(--v-mute)}.pl-sep{margin-left:8px}
.pl-chk{display:inline-flex;align-items:center;gap:4px}.pl-chk .v-tag{height:18px;font-size:11px;padding:0 6px}
.pl-ok{border:1px solid #F0B36A;background:#fff;color:#A15C07;border-radius:99px;font:inherit;font-size:11px;font-weight:600;height:18px;padding:0 7px;cursor:pointer}.pl-ok:hover{background:#FFF1DE}
.pl-todo{padding:16px;border-color:#F0B36A}
.pl-next{padding:16px;display:grid;gap:8px;border-color:#B9CCF5}.pl-next-t{font-size:13px;font-weight:700}.pl-next-s{font-size:12px;color:var(--v-mute);line-height:1.5}
/* 검수: 같은 수정 요청의 수정안 묶음 · AI 처리 중 · 바뀐 것 요약 / 편집기: 방금 AI가 바꾼 곳 */
.rv-grp{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:10px 14px;margin-top:6px;border-radius:10px;background:#EDF3FF;color:var(--v-blue-dd);font-size:13px}.rv-grp>span{flex:1;min-width:180px}.rv-grp svg{flex:none}
.rv-ai{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-top:4px;font-size:12px;color:var(--v-blue-dd)}
.rv-chg{margin-top:4px;font-size:12px;color:var(--v-ink2);display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.ed-aichg{margin-top:12px;padding:12px;border:1px solid #CFDDF8;border-radius:10px;background:#F7FAFF;display:grid;gap:6px}.ed-aichg-h{display:flex;align-items:center;gap:8px;font-size:13px}.ed-aichg-h span{flex:1;min-width:0;color:var(--v-mute);font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pl-fold{border-top:1px solid var(--v-line);padding:10px 0}.pl-fold>summary{cursor:pointer;font-size:13px;color:var(--v-mute);padding:4px 0}.pl-fold[open]>summary{margin-bottom:6px}
.pl-todo-h{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:14px}
.pl-todo-s{font-size:12px;color:var(--v-mute);margin:4px 0 10px;line-height:1.5}
.pl-todo-i{display:flex;justify-content:space-between;gap:8px;width:100%;border:0;background:#FFF8EE;border-radius:8px;padding:8px 10px;margin-top:6px;font:inherit;font-size:13px;text-align:left;cursor:pointer}
.pl-todo-i:hover{background:#FFEFD9}.pl-todo-i em{font-style:normal;color:var(--v-mute);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:55%}

/* 교과목기획서 '방향 잡기' 문답 카드 */
.pl-ask{padding:16px;border-color:#B9DDF3}
.pl-ask-h{display:grid;gap:2px;margin-bottom:10px}.pl-ask-h b{font-size:14px}.pl-ask-h span{font-size:12px;color:var(--v-mute)}
.pl-q{display:grid;gap:6px;margin-top:10px}.pl-q em{font-style:normal;font-size:12px;font-weight:700;color:var(--v-ink2)}.pl-q>div{display:flex;flex-wrap:wrap;gap:5px}
.pl-opt{border:1px solid #E1E6ED;background:#fff;border-radius:99px;padding:4px 10px;font:inherit;font-size:12px;cursor:pointer;color:var(--v-ink2);display:inline-flex;align-items:center;gap:4px}
.pl-opt.on{border-color:var(--v-blue);background:var(--v-blue-s);color:var(--v-blue-dd);font-weight:700}.pl-opt i{font-style:normal;font-size:10px;color:#8A93A3;font-weight:500}
.pl-add{border:1px dashed #C9D2DD;border-radius:99px;padding:4px 10px;font:inherit;font-size:12px;width:110px;outline:none}.pl-add:focus{border-color:var(--v-blue)}
.pl-ask-f{display:flex;gap:6px;margin-top:12px}.pl-wait{font-size:12px;color:var(--v-mute)}

/* 교과목기획서 참고자료(초안 근거) */
.pl-refs{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:8px}
.pl-ref{display:inline-flex;align-items:center;gap:5px;border:1px solid var(--v-line);background:#F7F9FB;border-radius:99px;padding:3px 6px 3px 10px;font-size:12px;max-width:100%}
.pl-ref em{font-style:normal;color:var(--v-mute)}.pl-ref button{border:0;background:none;cursor:pointer;color:var(--v-mute);font-size:11px;padding:0 4px}
.pl-refs-on{margin-top:8px;font-size:12px;color:var(--v-mute)}
.pl-src{font-size:12px;color:var(--v-ink2);background:#F3F6F9;border-radius:8px;padding:6px 8px;margin:-6px 0 12px;line-height:1.5}

/* 창(모달)이 좁은 화면 밖으로 넘치지 않게 — 배경 그리드 칸·본문 항목이 내용의 최소 폭보다 줄어들 수 있게 */
.v-scrim{grid-template-columns:minmax(0,1fr)}
.v-modal{min-width:0}
.v-modal-b>*{min-width:0}
@media (max-width:640px){
  .v-scrim{padding:12px}
  .v-modal-h{flex-wrap:wrap;row-gap:0;padding:16px}
  .v-modal-h:has(>.v-seg)::before{content:'';order:4;flex-basis:100%;height:0} /* 전환(신규 개발/재개발 등)은 제목 아래 줄로, 제목·닫기는 첫 줄에 */
  .v-modal-h>.v-seg{order:5;margin:10px 0 0!important}
  .v-modal-b{padding:16px}
  .ac-lms{flex-wrap:wrap}
  .ac-lms b{flex-wrap:wrap;gap:6px 0}
  .ac-lms>.v-btn{margin-left:58px}
}

/* 홈 'AI 교안 매니저' 카드 — 지금 할 일 옆(좁으면 아래) */
.ht-two{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:20px;align-items:stretch}
@media (max-width:1199px){.ht-two{grid-template-columns:minmax(0,1fr)}}
@media (min-width:1200px){.ht-two>.ht-col+.ht-col{contain:size;min-height:330px}} /* 2열이면 카드 높이는 왼쪽 목록을 따름(긴 답이 목록을 늘리지 않게) */
@media (min-width:1200px){.ht-two>.ht-col+.ht-col.pin{align-self:start;height:var(--mgh);min-height:0;position:sticky;top:16px}} /* 왼쪽을 펼친 동안: 카드는 펼치기 전 크기 그대로, 스크롤하면 따라옴 */
.ht-col{display:flex;flex-direction:column;min-width:0}
.ht-col>.ht{flex:1}
.mg{display:flex;flex-direction:column;padding:18px 18px 16px;gap:12px}
.mg-top{display:flex;gap:12px;align-items:flex-start;flex:1;min-height:0}
.mg-stage{width:96px;aspect-ratio:240/250;position:relative;flex:none;cursor:pointer;border-radius:22px;background:radial-gradient(circle at 50% 58%,#E3F2FD 0,#EEF7FE 52%,rgba(238,247,254,0) 72%)}
.mg-fig{position:absolute;inset:0;transform-origin:50% 96%}
.mg-fig img{position:absolute;inset:0;width:100%;height:100%;visibility:hidden;user-select:none;-webkit-user-drag:none}
.mg-fig img.on{visibility:visible}
.mg-say{flex:1;min-width:0;padding-top:4px;display:flex;flex-direction:column;align-self:stretch;min-height:0}
.mg-bub{background:#F3F7FB;border:1px solid #E3EAF2;border-radius:14px;border-top-left-radius:4px;padding:10px 12px;font-size:14px;line-height:1.5;color:var(--v-ink2);word-break:keep-all;min-height:62px;white-space:pre-line;overflow-y:auto;flex:0 1 auto}
.mg-st{display:flex;flex:none;align-items:center;gap:6px;font-size:12.5px;color:var(--v-mute);margin-top:7px}
.mg-st i{width:7px;height:7px;border-radius:50%;background:#22C55E;box-shadow:0 0 0 3px rgba(34,197,94,.15)}
.mg-st.think i{background:var(--v-blue);box-shadow:0 0 0 3px rgba(36,89,216,.15);animation:mgp 1s infinite}
@keyframes mgp{50%{opacity:.3}}
.mg-chips{display:flex;flex-wrap:wrap;gap:6px}
.mg-go{flex:none;display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 12px;border-radius:999px;font-size:13px;font-weight:600;color:#fff;background:var(--v-blue);border:0;cursor:pointer;box-shadow:0 4px 10px -4px rgba(36,89,216,.6)} /* 답을 읽고 나서 누르는 다음 동작 */
.mg-go:hover{filter:brightness(1.08)}.mg-go:focus-visible{outline:2px solid var(--v-blue);outline-offset:2px}
/* 떠 있는 말풍선: 캐릭터 왼쪽으로, 답 길이만큼(최대 화면 60%) — 꼬리는 캐릭터 쪽 */
.mg-pop{position:absolute;top:52px;right:calc(100% + 18px);z-index:6;width:min(420px,44vw);max-height:min(60vh,540px);display:flex;flex-direction:column;background:#fff;border:1px solid #D6E2F5;border-radius:18px;padding:16px 18px 14px;box-shadow:0 24px 50px -18px rgba(20,40,110,.4),0 2px 6px rgba(20,40,110,.06);animation:mgpop .18s ease-out}
.mg-pop::after{content:'';position:absolute;top:30px;right:-9px;width:16px;height:16px;background:#fff;border-top:1px solid #D6E2F5;border-right:1px solid #D6E2F5;transform:rotate(45deg);border-top-right-radius:3px}
.mg-pop-b{flex:1 1 auto;min-height:0;overflow-y:auto;padding-right:22px}
.mg-pop-q{display:inline-block;max-width:100%;font-size:12.5px;color:var(--v-blue-dd);background:var(--v-blue-s);border-radius:10px;padding:3px 10px;margin-bottom:8px}
.mg-pop-t{font-size:15px;line-height:1.65;color:var(--v-ink);white-space:pre-line;word-break:keep-all}
.mg-pop-x{position:absolute;top:10px;right:10px;width:28px;height:28px;display:grid;place-items:center;border:0;border-radius:8px;background:transparent;color:var(--v-mute);cursor:pointer}
.mg-pop-x:hover{background:#F1F4F9;color:var(--v-ink)}.mg-pop-x:focus-visible{outline:2px solid var(--v-blue)}
.mg-pop-a{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px;flex:none}
@keyframes mgpop{from{opacity:0;transform:translateX(8px) scale(.98)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.mg-pop{animation:none}}
@media (max-width:1199px){.mg-pop{display:none}}
.mg-stage{transition:transform .28s cubic-bezier(.2,.8,.2,1)} /* 말풍선이 뜰 때 캐릭터가 카드 오른쪽으로 미끄러져 감 */
.mg-pop[style*='--tail-b']::after{top:auto;bottom:min(var(--tail-b),calc(100% - 34px))} /* 위로 자라는 말풍선: 꼬리는 아래에서 잰 캐릭터 머리 높이(짧은 답이면 말풍선 안쪽으로 제한) */
.mg-moved .mg-stage{z-index:2} /* 캐릭터가 (투명해진) 답 칸 위로 지나감 — 답 칸은 읽어 주기(aria-live) 때문에 없애지 않음 */
@media (prefers-reduced-motion:reduce){.mg-stage{transition:none}}
/* 말풍선이 떠 있는 동안 카드 안 답 칸은 감춤(같은 답이 두 번 보이지 않게). 읽어 주기(aria-live)는 남도록 없애지 않고 투명하게만 */
.mg-say.popped .mg-me,.mg-say.popped .mg-bub{opacity:0;pointer-events:none}
.mg-say.shrunk .mg-bub{display:none}.mg-note{display:flex;align-items:center;flex-wrap:wrap;gap:4px;font-size:13px;line-height:1.5;color:var(--v-ink2);background:rgba(255,255,255,.7);border:1px solid rgba(255,255,255,.85);border-radius:12px;border-top-left-radius:4px;padding:8px 10px;word-break:keep-all} /* 말풍선을 닫은 뒤 작은 칸: 한 줄 안내 + 다시 보기 */.mg-say .mg-me,.mg-say .mg-bub{transition:opacity .15s}
/* 말풍선도 카드와 같은 유리 재질 — 뒤에 할 일 목록 글자가 있어 카드보다 조금 덜 투명하게 */
.mg-pop{background:linear-gradient(140deg,rgba(255,255,255,.84),rgba(255,255,255,.62));-webkit-backdrop-filter:blur(24px) saturate(180%);backdrop-filter:blur(24px) saturate(180%);border-color:rgba(255,255,255,.75);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.95),inset 0 0 22px rgba(255,255,255,.35),0 26px 52px -20px rgba(20,50,150,.42),0 2px 6px -2px rgba(0,40,90,.08)}
.mg-pop::after{top:28px;right:-11px;width:12px;height:22px;transform:none;border:0;border-radius:0;clip-path:polygon(0 0,100% 50%,0 100%);background:rgba(255,255,255,.66);-webkit-backdrop-filter:blur(24px) saturate(180%);backdrop-filter:blur(24px) saturate(180%)} /* 꼬리는 말풍선 밖으로만(반투명이 겹쳐 진해지지 않게) */
.mg-pop .mg-chip{color:var(--v-blue-dd);background:linear-gradient(180deg,rgba(255,255,255,.92),rgba(226,236,255,.6));border-color:rgba(255,255,255,.95);box-shadow:inset 0 1px 0 #fff,inset 0 -1px 0 rgba(36,89,216,.12),0 0 0 1px rgba(36,89,216,.16),0 5px 12px -8px rgba(36,89,216,.45)}
.mg-pop .mg-pop-q{background:rgba(232,240,255,.8)}
@media (prefers-reduced-transparency:reduce){.mg-pop,.mg-pop::after{-webkit-backdrop-filter:none;backdrop-filter:none;background:#fff;border-color:#D6E2F5}}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.mg-pop,.mg-pop::after{background:#fff;border-color:#D6E2F5}}
.fx-lite .mg-pop,.fx-lite .mg-pop::after{-webkit-backdrop-filter:none;backdrop-filter:none;background:#fff;border-color:#D6E2F5}
.mg-chip:disabled{opacity:.5;cursor:default}
.mg-chip{border:1px solid #DCE1E8;background:#fff;border-radius:999px;padding:6px 11px;font:inherit;font-size:13px;color:var(--v-ink2);cursor:pointer;transition:border-color .15s,color .15s}
.mg-chip:hover{border-color:var(--v-blue);color:var(--v-blue-dd)}
.mg-in{display:flex;align-items:center;gap:6px;border:1px solid #DCE1E8;border-radius:12px;padding:5px 5px 5px 12px;background:#fff;transition:border-color .15s,box-shadow .15s}
.mg-in:focus-within{border-color:var(--v-blue);box-shadow:0 0 0 3px rgba(36,89,216,.12)}
.mg-in input{flex:1;min-width:0;border:0;outline:0;font:inherit;font-size:14px;background:transparent;color:var(--v-ink)}
.mg-in button{width:34px;height:34px;border-radius:9px;border:0;background:var(--v-blue);color:#fff;display:grid;place-items:center;cursor:pointer;flex:none}
.mg-in button:disabled{background:#E5E9EF;color:#A0A7B3;cursor:default}
@media (prefers-reduced-motion:reduce){.mg-fig{transform:none!important}.mg-st.think i{animation:none}}

/* ---- 아바타 블루 (2026-10) ----
   흰 글씨가 올라가는 버튼·링크·선택 = 아바타 몸통 코발트(--v-blue), 페이지 '만들기' = 얼굴 남색(--v-navy).
   학교 전용색 #009DE8(--v-hycu)은 로고·로그인·생성 진행 표시처럼 글씨가 올라가지 않는 곳에 그대로 씀 */
.v-btn.hm-new{background:linear-gradient(180deg,#1C3272,var(--v-navy));border-color:#101E4E;box-shadow:0 8px 18px -10px rgba(19,35,90,.7),inset 0 1px 0 rgba(255,255,255,.12)}
.v-btn.hm-new:hover:not(:disabled){background:linear-gradient(180deg,#22397F,#18295F);border-color:#101E4E;color:#fff}
/* 홈 할 일: 가장 급한 첫 줄만 꽉 찬 버튼, 나머지는 연한 버튼 → 무엇부터 할지 바로 보이게 */
.ht-row:not(:first-child) .ht-act .v-btn.pri{background:var(--v-blue-s);color:var(--v-blue-dd);border-color:#D3E0FC;box-shadow:none}
.ht-row:not(:first-child) .ht-act .v-btn.pri:hover:not(:disabled){background:#E2EBFE;border-color:#C2D3FA;color:var(--v-blue-dd);box-shadow:none}
/* 키보드로 움직일 때 지금 위치(주 버튼은 polish.css의 둥근 테두리) */
:where(button:not(.v-btn),a,summary,[role=button],[tabindex]:not(input):not(textarea)):focus-visible{outline:2px solid var(--v-blue);outline-offset:2px}

/* ---- 빈 화면 공통(EmptyState): 마스코트 + 상황·이유 + 다음 행동 ---- */
.es{display:flex;gap:22px;align-items:center;justify-content:center;padding:36px 28px;text-align:left}
.es-bot{width:104px;aspect-ratio:240/250;flex:none;border-radius:26px;background:radial-gradient(circle at 50% 58%,#E6EEFE 0,#F0F5FF 52%,rgba(240,245,255,0) 72%)}
.es-bot img{width:100%;height:100%;display:block;user-select:none;-webkit-user-drag:none}
.es-t{max-width:440px;min-width:0}
.es-t>b{display:block;font-size:17px;letter-spacing:-.02em;color:var(--v-ink);word-break:keep-all}
.es-t>p{margin:6px 0 0;font-size:14.5px;line-height:1.6;color:var(--v-ink2);word-break:keep-all}
.es-act{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px}
.es-err{margin-top:12px;font-size:12.5px;color:var(--v-mute);word-break:break-all}.es-err summary{cursor:pointer;color:var(--v-blue-d);font-weight:600}
.es.es-sm{padding:24px 18px;gap:16px}.es.es-sm .es-bot{width:76px;border-radius:20px}.es.es-sm .es-t>b{font-size:15.5px}.es.es-sm .es-t>p{font-size:13.5px}.es.es-sm .es-act{margin-top:12px}
@media (max-width:640px){.es{flex-direction:column;text-align:center;padding:28px 18px}.es-act{justify-content:center}}
/* 홈 '할 일 없음': 상자를 채우는 안심 화면 + AI 진행 */
.es-calm{flex:1;padding:28px 24px;min-height:100%}
.ht:has(>.es-calm){display:flex}
.es-jobs{display:grid;gap:8px;margin-top:14px}
.es-job{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 10px;align-items:center;text-align:left;border:1px solid var(--v-line);background:#fff;border-radius:12px;padding:10px 12px;font:inherit;cursor:pointer;transition:border-color .15s}
.es-job:hover{border-color:#C2D3FA}
.es-job span{font-size:13.5px;color:var(--v-ink2);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.es-job b{color:var(--v-ink)}
.es-job em{font-style:normal;font-size:12.5px;color:var(--v-mute);font-variant-numeric:tabular-nums}
.es-job i{grid-column:1/-1;height:5px;border-radius:5px;background:#EEF1F5;overflow:hidden}.es-job s{display:block;height:100%;border-radius:5px;background:var(--v-hycu)}

/* ---- 광택 버튼: 한 화면에 1~2개만(가장 급한 주 버튼 · 페이지 '만들기' · 큰 주 버튼) ----
   아바타 재질처럼 위쪽 빛 반사(버튼 위 30%까지만 → 글자에 걸리지 않아 흰 글씨 대비 4.5 이상) + 아래쪽 청록 빛 + 밝은 테두리 */
.ht-row:first-child .ht-act .v-btn.pri,.v-btn.pri.lg{text-shadow:0 1px 1px rgba(10,30,100,.3);border-color:rgba(18,44,140,.6);
  background:linear-gradient(180deg,rgba(255,255,255,.28) 0%,rgba(255,255,255,.05) 24%,rgba(255,255,255,0) 30%),radial-gradient(120% 90% at 50% 125%,rgba(127,246,255,.5),rgba(127,246,255,0) 58%),linear-gradient(180deg,#2F67E8,#2148C4);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55),inset 0 -2px 6px rgba(8,28,110,.3),0 1px 2px rgba(20,40,120,.3),0 10px 20px -10px rgba(36,80,204,.75)}
.ht-row:first-child .ht-act .v-btn.pri:hover:not(:disabled),.v-btn.pri.lg:hover:not(:disabled){filter:brightness(1.06) saturate(1.05);background:linear-gradient(180deg,rgba(255,255,255,.28) 0%,rgba(255,255,255,.05) 24%,rgba(255,255,255,0) 30%),radial-gradient(120% 90% at 50% 125%,rgba(127,246,255,.5),rgba(127,246,255,0) 58%),linear-gradient(180deg,#2F67E8,#2148C4)}
.ht-row:first-child .ht-act .v-btn.pri:active:not(:disabled),.v-btn.pri.lg:active:not(:disabled){filter:brightness(.97);box-shadow:inset 0 2px 4px rgba(8,28,110,.35),0 1px 2px rgba(20,40,120,.3)}
.v-btn.hm-new{border-color:rgba(127,246,255,.35);
  background:linear-gradient(180deg,rgba(255,255,255,.16) 0%,rgba(255,255,255,0) 50%),radial-gradient(110% 80% at 50% 130%,rgba(127,246,255,.36),transparent 60%),linear-gradient(180deg,#1E3577,#121F52);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.26),0 0 0 1px rgba(10,20,60,.5),0 10px 22px -10px rgba(19,35,90,.8),0 0 16px -6px rgba(63,211,251,.5)}
.v-btn.hm-new:hover:not(:disabled){filter:brightness(1.1);background:linear-gradient(180deg,rgba(255,255,255,.16) 0%,rgba(255,255,255,0) 50%),radial-gradient(110% 80% at 50% 130%,rgba(127,246,255,.36),transparent 60%),linear-gradient(180deg,#1E3577,#121F52)}

/* ---- AI 교안 매니저 카드만 리퀴드 글래스: 뒤에 옅은 코발트·하늘 빛을 깔아 유리가 보이게 ---- */
.ht-two>.ht-col+.ht-col{position:relative;isolation:isolate}
.ht-two>.ht-col+.ht-col::before{content:'';position:absolute;inset:-36px -28px -24px -40px;z-index:-1;pointer-events:none;filter:blur(28px);
  background:radial-gradient(48% 46% at 70% 30%,rgba(36,89,216,.22),transparent 70%),radial-gradient(44% 44% at 30% 62%,rgba(33,163,251,.22),transparent 70%)}
.mg{background:linear-gradient(140deg,rgba(255,255,255,.7),rgba(255,255,255,.42));-webkit-backdrop-filter:blur(22px) saturate(180%);backdrop-filter:blur(22px) saturate(180%);border:1px solid rgba(255,255,255,.65);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.95),inset 0 0 22px rgba(255,255,255,.3),0 22px 44px -24px rgba(20,50,150,.4),0 2px 6px -2px rgba(0,40,90,.08)}
.mg .mg-bub{background:rgba(255,255,255,.7);border-color:rgba(255,255,255,.85)}
.mg .mg-st span{color:var(--v-ink2)}
.mg .mg-st i{background:#2CC6F5;box-shadow:0 0 0 3px rgba(63,211,251,.22),0 0 8px rgba(127,246,255,.9)}
.mg .mg-stage{background:radial-gradient(circle at 50% 58%,rgba(255,255,255,.9) 0,rgba(255,255,255,.35) 55%,rgba(255,255,255,0) 72%)}
.mg .mg-chip{color:var(--v-blue-dd);background:linear-gradient(180deg,rgba(255,255,255,.92),rgba(226,236,255,.6));-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-color:rgba(255,255,255,.95);
  box-shadow:inset 0 1px 0 #fff,inset 0 -1px 0 rgba(36,89,216,.12),0 0 0 1px rgba(36,89,216,.16),0 5px 12px -8px rgba(36,89,216,.45)}
.mg .mg-in{background:rgba(255,255,255,.78);border-color:rgba(255,255,255,.95)}
.mg .mg-in button:not(:disabled){background:linear-gradient(180deg,rgba(255,255,255,.32) 0%,rgba(255,255,255,0) 50%),linear-gradient(180deg,#2F67E8,#2148C4);box-shadow:inset 0 1px 0 rgba(255,255,255,.55),0 6px 12px -6px rgba(36,80,204,.7)}
.mg .mg-in button:disabled{background:rgba(255,255,255,.65);color:#8A93A3;box-shadow:inset 0 1px 0 #fff,0 0 0 1px rgba(36,89,216,.12)}
/* 투명도 줄이기 설정이거나 흐림을 못 쓰는 브라우저면 단단한 흰 판 */
@media (prefers-reduced-transparency:reduce){.mg,.mg .mg-chip{-webkit-backdrop-filter:none;backdrop-filter:none;background:#fff}.ht-two>.ht-col+.ht-col::before{display:none}}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.mg{background:#fff}}
/* 유리 끄기(localStorage hycu-fx=lite → html.fx-lite, app-manager.jsx): 유리 대신 흰 판 */
.fx-lite .mg,.fx-lite .mg .mg-chip{-webkit-backdrop-filter:none;backdrop-filter:none}.fx-lite .mg{background:#fff;border-color:var(--v-line)}.fx-lite .mg .mg-chip{background:#fff}.fx-lite .ht-two>.ht-col+.ht-col::before{display:none}
/* AI 교안 매니저: 방금 교수님이 한 말(한 줄) */
.mg-me{align-self:flex-end;max-width:100%;font-size:12.5px;color:var(--v-blue-dd);background:var(--v-blue-s);border-radius:10px 10px 4px 10px;padding:4px 10px;margin-bottom:6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:none}
/* AI 교안 매니저: 지난 대화(카드 위에 겹쳐 열림) */
.mg{position:relative}
.mg-st{min-width:0}.mg-st>span{flex:1;min-width:0}
.mg-log-btn{border:0;background:none;font:inherit;font-size:12px;font-weight:600;color:var(--v-blue-d);cursor:pointer;padding:2px 4px;border-radius:6px;white-space:nowrap}
.mg-log-btn:hover{background:var(--v-blue-ss)}
.mg-log{position:absolute;inset:0;z-index:5;display:flex;flex-direction:column;background:#fff;border-radius:inherit;box-shadow:0 18px 40px -16px rgba(20,40,110,.35);overflow:hidden}
.mg-log-h{display:flex;align-items:center;gap:8px;padding:12px 12px 10px 16px;border-bottom:1px solid var(--v-line);flex:none}
.mg-log-h b{font-size:14.5px}.mg-log-h span{flex:1;min-width:0;font-size:12px;color:var(--v-mute);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mg-log-x{width:30px;height:30px;border:0;background:none;border-radius:8px;display:grid;place-items:center;color:var(--v-mute);cursor:pointer}.mg-log-x:hover{background:#F2F4F7;color:var(--v-ink)}
.mg-log-b{flex:1;min-height:0;overflow-y:auto;padding:12px 14px 14px;display:flex;flex-direction:column;gap:12px}
.mg-log-p{display:flex;flex-direction:column;gap:6px}
.mg-log-q{align-self:flex-end;max-width:88%;font-size:13px;color:var(--v-blue-dd);background:var(--v-blue-s);border-radius:12px 12px 4px 12px;padding:6px 10px;word-break:keep-all}
.mg-log-a{align-self:flex-start;max-width:94%;font-size:13px;line-height:1.55;color:var(--v-ink2);background:#F3F6FA;border-radius:4px 12px 12px 12px;padding:8px 10px;white-space:pre-line;word-break:keep-all}
/* ── AI 교안 매니저 답 글(MgRich): 요지 · 목록 칸 · 강조 ── */
.mg-bub,.mg-pop-t,.mg-log-a{white-space:normal}
.mg-rich{display:grid;gap:8px;font-size:14px;line-height:1.6;color:var(--v-ink2);word-break:keep-all;overflow-wrap:anywhere}
.mg-rich p{margin:0}
.mg-rich p.lead{color:var(--v-ink);font-weight:600;letter-spacing:-0.01em}
.mg-rich ul,.mg-rich ol{list-style:none;margin:0;padding:0;display:grid;gap:6px;counter-reset:mg}
.mg-rich li{position:relative;padding:7px 10px 7px 27px;border-radius:10px;background:linear-gradient(180deg,rgba(255,255,255,.85),rgba(240,245,255,.7));border:1px solid rgba(36,89,216,.12);box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 3px 8px -6px rgba(36,89,216,.35)}
.mg-rich ul>li::before{content:'';position:absolute;left:11px;top:15px;width:7px;height:7px;border-radius:50%;background:linear-gradient(135deg,#5B8EF8,#2459D8);box-shadow:0 0 0 3px rgba(36,89,216,.13)}
.mg-rich ol>li{counter-increment:mg}
.mg-rich ol>li::before{content:counter(mg);position:absolute;left:7px;top:9px;width:16px;height:16px;border-radius:50%;display:grid;place-items:center;font-size:10.5px;font-weight:700;color:#fff;background:linear-gradient(135deg,#5B8EF8,#2459D8)}
.mg-rich li .h{display:block;color:var(--v-ink);font-weight:600}
.mg-rich li .s{display:block;font-size:12.5px;line-height:1.5;color:#5B6576;margin-top:1px}
.mg-num{font-weight:700;color:var(--v-blue-dd);font-variant-numeric:tabular-nums}
.mg-q{quotes:none;display:inline-block;padding:0 5px;margin:0 1px 0 0;border-radius:6px;background:#E9F0FF;color:#1E48B8;font-weight:600;line-height:1.55;box-shadow:inset 0 0 0 1px rgba(36,89,216,.14)}
.mg-rich b{font-weight:700;color:var(--v-ink)}
/* 줄마다 차례로 살짝 떠오름 */
.mg-rich>p,.mg-rich li{animation:mgIn .34s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(min(var(--i,0),8) * 55ms)}
@keyframes mgIn{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
/* 생각하는 중: 통통 튀는 점 세 개 */
.mg-dots{display:inline-flex;align-items:center;gap:5px;height:22px;padding:0 2px}
.mg-dots i{width:7px;height:7px;border-radius:50%;background:linear-gradient(135deg,#5B8EF8,#2459D8);animation:mgDot 1.1s infinite ease-in-out}
.mg-dots i:nth-child(2){animation-delay:.14s}.mg-dots i:nth-child(3){animation-delay:.28s}
@keyframes mgDot{0%,70%,100%{transform:translateY(0);opacity:.35}35%{transform:translateY(-5px);opacity:1}}
@media (prefers-reduced-motion:reduce){.mg-rich>p,.mg-rich li{animation:none}.mg-dots i{animation:none;opacity:.6}}
/* 카드 안 답 칸: 흰 유리 판에 파란 테 — 말하는 쪽(캐릭터) 모서리만 각지게 */
.mg .mg-bub{background:linear-gradient(180deg,rgba(255,255,255,.92),rgba(246,249,255,.82));border:1px solid rgba(36,89,216,.14);border-radius:16px;border-top-left-radius:5px;padding:11px 13px;box-shadow:inset 0 1px 0 #fff,0 8px 18px -12px rgba(36,89,216,.45);scrollbar-width:thin}
.mg .mg-bub .mg-rich{font-size:13.5px;gap:6px}.mg .mg-bub .mg-rich li{padding:5px 8px 5px 23px}.mg .mg-bub .mg-rich ul>li::before{left:9px;top:12px;width:6px;height:6px}
.mg-me{box-shadow:0 4px 10px -8px rgba(36,89,216,.6)}
/* 떠 있는 말풍선: 머리줄(누가·무엇을 물었는지) + 넉넉한 글 */
.mg-pop-h{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding-right:30px;margin-bottom:10px;flex:none}
.mg-pop-who{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:700;letter-spacing:.01em;color:#1E48B8}.mg-pop-who svg{color:#4F86F7}
.mg-pop-h .mg-pop-q{margin:0;max-width:62%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-radius:10px 10px 4px 10px;padding:3px 10px;margin-left:auto}
.mg-pop .mg-rich{font-size:15px;line-height:1.65;gap:10px}.mg-pop .mg-rich li{padding:9px 12px 9px 30px}.mg-pop .mg-rich ul>li::before{left:13px;top:18px}.mg-pop .mg-rich ol>li::before{left:9px;top:12px}
.mg-pop .mg-rich li .s{font-size:13.5px}
.mg-pop-b{padding-right:6px;scrollbar-width:thin}
.mg-log-a .mg-rich{font-size:13px;gap:5px}.mg-log-a .mg-rich li{padding:4px 8px 4px 22px;background:#fff}.mg-log-a .mg-rich ul>li::before{left:9px;top:11px;width:5px;height:5px}
.mg-log-a .mg-rich>p,.mg-log-a .mg-rich li{animation:none}
/* 좁은 화면: 사이드바를 서랍으로(위쪽 막대의 메뉴 버튼으로 엶) */
.v-mbar,.v-side-scrim{display:none}
@media (max-width:900px){
  .v-app{grid-template-columns:minmax(0,1fr)}
  .v-mbar{display:flex;align-items:center;gap:10px;position:sticky;top:0;z-index:60;height:52px;padding:0 12px;background:#fff;border-bottom:1px solid var(--v-line)}
  .v-mbar b{font-size:15px;font-weight:700;letter-spacing:-0.02em}
  .v-mbar-btn{width:40px;height:40px;display:grid;place-items:center;border:0;border-radius:8px;background:transparent;color:var(--v-ink)}
  .v-mbar-btn:hover{background:var(--v-bg)}
  .v-side{position:fixed;left:0;top:0;z-index:90;width:min(280px,86vw);overflow-y:auto;transform:translateX(-100%);transition:transform .2s ease;box-shadow:none}
  .v-side.open{transform:none;box-shadow:0 12px 40px rgba(14,17,22,.24)}
  .v-side-scrim{display:block;position:fixed;inset:0;z-index:85;background:rgba(14,17,22,.36)}
  .v-page{padding:24px 16px 72px}
  .v-main{overflow-x:clip} /* 장식용 빛·그림자가 화면 밖으로 나가 가로 스크롤이 생기지 않게 */
}
@media (max-width:900px) and (prefers-reduced-motion:reduce){.v-side{transition:none}}
/* 개발 현황판: 누르면 이동하는 표시 */.bd-chip{border:0;cursor:pointer;font:inherit;font-size:12px}.bd-chip:hover{filter:brightness(.95);text-decoration:underline}
/* 자동 저장 표시 */.saved-note{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--v-mute);transition:color .2s}.saved-note.on{color:var(--v-green)}
.th-m.memo{background:#2459D8} /* 메모 남긴 장 */
/* 편집창: 양식 장의 도식은 눌러서 고치기 */.v-stage [data-dg]{cursor:pointer;border-radius:8px;transition:box-shadow .15s}.v-stage [data-dg]:hover{box-shadow:0 0 0 2px var(--v-blue)}
/* 과목 정보(이름·학기·학수번호·분반) */
.ci-b{display:grid;gap:14px}
.ci-f{display:grid;gap:6px;font-size:13px;color:var(--v-ink2);min-width:0}
.ci-f>span{font-weight:600}
.ci-two{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px}
.ci-warn{font-style:normal;font-size:12px;color:var(--v-red)}
.ci-note{margin:0;font-size:12.5px;color:var(--v-mute)}
@media (max-width:639px){.ci-two{grid-template-columns:minmax(0,1fr)}}
/* 교과목기획서 서버 작업(PlanJob) — 진행 카드 · 최신성 검토 제안 · 지난 기획서 이어 쓰기 */
.pl-lock{border:0;padding:0;margin:0;min-width:0;display:contents}
.pl-job{padding:16px 18px;display:grid;gap:10px;border-color:#B9DDF3}.pl-job.err{border-color:#F3B7B1;background:#FFF8F7}
.pl-job-h{display:flex;align-items:center;gap:8px;font-size:14px}.pl-job-h em{margin-left:auto;font-style:normal;font-size:12px;color:var(--v-mute)}
.pl-spin{width:14px;height:14px;border-radius:50%;border:2px solid var(--v-blue-s);border-top-color:var(--v-blue,#009DE8);animation:pl-spin 1s linear infinite;flex:none}
@keyframes pl-spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.pl-spin{animation:none}}
.pl-job-s{display:flex;flex-wrap:wrap;gap:6px;margin:0;padding:0;list-style:none}.pl-job-s li{font-size:12px;border-radius:99px;padding:3px 10px;background:#F2F4F7;color:var(--v-mute)}
.pl-job-s li.done{background:var(--v-green-s);color:#166B4A}.pl-job-s li.run{background:var(--v-blue-s);color:var(--v-blue-dd);font-weight:700}
.pl-job-n{font-size:12px;color:var(--v-mute);line-height:1.5}.pl-job-b{display:flex;gap:6px}
.pl-rv{padding:16px 18px;display:grid;gap:10px;border-color:#B9DDF3}
.pl-rv-h{display:flex;align-items:flex-start;gap:10px}.pl-rv-h>div{flex:1;display:grid;gap:2px}.pl-rv-h b{font-size:15px}.pl-rv-h span{font-size:12px;color:var(--v-mute);line-height:1.5}
.pl-rv-i{border:1px solid var(--v-line);border-radius:10px;padding:12px;display:grid;gap:6px}
.pl-rv-t{display:flex;align-items:center;gap:6px;flex-wrap:wrap;font-size:13px}.pl-rv-t em{font-style:normal;font-size:11px;color:#8A4A0C}
.pl-rv-w{font-size:12.5px;color:var(--v-ink2);line-height:1.5}
.pl-rv-d{display:grid;gap:4px;font-size:13px;line-height:1.55;white-space:pre-line}
.pl-rv-d del{color:#9B2C2C;background:#FFF1F0;text-decoration:line-through;border-radius:6px;padding:4px 8px}
.pl-rv-d ins{color:#14532D;background:#EEFAF2;text-decoration:none;border-radius:6px;padding:4px 8px}
.pl-rv-s{font-size:12px;color:var(--v-blue-d);word-break:break-all}
.pl-rv-b{display:flex;gap:6px}
.pl-rv-done{font-size:12px;color:var(--v-mute);line-height:1.5}
.pl-prev{display:grid;gap:8px;margin:0 0 16px;padding:12px 14px;border-radius:10px;background:var(--v-blue-ss);border:1px solid #CDE8F8}
.pl-prev>div:first-child{display:grid;gap:2px}.pl-prev b{font-size:14px}.pl-prev span{font-size:12.5px;color:var(--v-ink2);line-height:1.5}
.pl-prev-i{display:flex;align-items:center;justify-content:space-between;gap:10px;background:#fff;border-radius:8px;padding:8px 10px;font-size:13px}
.pl-prev>em{font-style:normal;font-size:12px;color:var(--v-mute)}
@media (max-width:640px){.pl-prev-i{flex-direction:column;align-items:flex-start}.pl-rv-h{flex-direction:column}}
/* 홈 카드 링 가운데 이름표(교시 완료·교시 확정) — % 대신 실제 교시 수(SPEC-MOTION-001 M7b) */
.hc-ring b{text-align:center;line-height:1.1}.hc-ring b em{display:block;font-style:normal;font-size:9px;font-weight:600;color:#6B7280;letter-spacing:-.02em;white-space:nowrap}
