:root{
  --ink:#1f2a2a; --deep:#2f5d62; --pine:#427a71; --accent:#c38d56;
  --sage:#dfe8de; --mist:#f4f1eb; --sand:#e7d9bf; --peach:#f3e7dd;
  --line:#d7d1c5; --card:#fffdf8; --white:#fff; --red:#9b2335; --green:#1a7a42; --blue:#2e6ea3; --gold:#c99a3f;
  --muted:#6a7676; --sec:#536060;
  --bg:radial-gradient(circle at top left,rgba(195,141,86,.10),transparent 22%),radial-gradient(circle at bottom right,rgba(66,122,113,.14),transparent 22%),linear-gradient(180deg,#f8f5ef,#f4f0e9);
  --ft:"Noto Serif KR",serif; --fb:"Gowun Dodum","Apple SD Gothic Neo","Malgun Gothic",sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:var(--fb);color:var(--ink);background:var(--bg);line-height:1.6;-webkit-text-size-adjust:100%;min-height:100vh;}

/* 상단바 */
.appbar{position:sticky;top:0;z-index:40;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:11px 14px;backdrop-filter:blur(10px);background:rgba(248,245,239,.9);border-bottom:1px solid rgba(66,122,113,.15);flex-wrap:wrap;}
.brand{display:flex;align-items:center;gap:9px;}
.brand .dot{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:linear-gradient(135deg,var(--deep),var(--pine));color:#fff;font-family:var(--ft);font-size:17px;}
.brand b{font-family:var(--ft);font-size:16px;display:block;line-height:1.15;}
.brand span{font-size:11px;color:var(--muted);}
.acts{display:flex;gap:7px;flex-wrap:wrap;}
.ib{border:1px solid var(--line);background:var(--card);color:var(--sec);border-radius:11px;padding:8px 12px;font-family:var(--fb);font-weight:700;font-size:12.5px;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;gap:5px;}
.ib:hover{background:var(--mist);}
.ib.warm{background:#edf3f1;color:var(--deep);border-color:transparent;}

.wrap{max-width:900px;margin:0 auto;padding:18px 14px 70px;}
.hero{background:linear-gradient(150deg,rgba(66,122,113,.10),rgba(243,231,221,.5)),var(--card);border:1px solid rgba(31,42,42,.07);border-radius:22px;box-shadow:0 14px 34px rgba(37,49,49,.08);padding:20px 22px;margin-bottom:16px;}
.hero h1{font-family:var(--ft);font-size:24px;letter-spacing:-.02em;}
.hero h1 .ac{color:var(--accent);}
.hero p{font-size:13px;color:var(--sec);margin-top:4px;}

/* ── 좌측 메뉴판 + 본문 2단 ── */
.shell{display:grid;grid-template-columns:1fr;gap:16px;align-items:start;transition:grid-template-columns .18s;}
.main{min-width:0;}
.side{position:fixed;top:0;left:0;bottom:0;z-index:60;width:250px;max-width:84vw;max-height:100vh;border-radius:0 16px 16px 0;background:var(--card);padding:12px 10px;overflow:auto;transform:translateX(-105%);transition:transform .22s;box-shadow:0 20px 60px rgba(0,0,0,.3);}
.side.on{transform:none;}
.side-h{font-family:var(--ft);font-size:13px;font-weight:800;color:var(--deep);padding:2px 6px 8px;display:flex;align-items:center;gap:6px;}
.side-h .side-pin{margin-left:auto;border:none;background:var(--mist);color:var(--sec);border-radius:8px;width:26px;height:26px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;flex:0 0 auto;}
.side-h .side-pin.on{background:var(--deep);color:#fff;}
.side-view{display:flex;gap:5px;margin-bottom:8px;background:var(--mist);border-radius:10px;padding:3px;}
.side-view button{flex:1;border:none;background:transparent;border-radius:8px;padding:7px 4px;font-family:var(--fb);font-weight:800;font-size:11.5px;color:var(--sec);cursor:pointer;}
.side-view button.on{background:var(--deep);color:#fff;}
.side-hint{font-size:10.5px;color:var(--muted);padding:0 6px 9px;line-height:1.45;}
.mitem{display:flex;align-items:center;gap:8px;width:100%;border:1px solid transparent;background:transparent;border-radius:10px;padding:9px 9px;font-family:var(--fb);font-weight:700;font-size:13px;color:var(--sec);cursor:pointer;text-align:left;margin-bottom:2px;}
.mitem:hover{background:var(--mist);}
.mitem.on{background:var(--deep);color:#fff;}
.mitem .mi-ico{flex:0 0 auto;display:inline-flex;align-items:center;}
.mitem .mi-label{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.mitem .mi-soon{font-size:9px;background:var(--sand);color:#7a5a1e;border-radius:5px;padding:1px 4px;font-weight:800;flex:0 0 auto;}
.mitem.on .mi-soon{background:rgba(255,255,255,.25);color:#fff;}
.mi-move{display:flex;flex-direction:column;gap:1px;flex:0 0 auto;}
.mi-move button{border:none;background:var(--sage);color:var(--sec);width:20px;height:15px;border-radius:4px;font-size:9px;line-height:1;cursor:pointer;padding:0;}
.mi-move button:hover{background:var(--pine);color:#fff;}
.mi-move button:disabled{opacity:.35;cursor:default;}
.side-reset{width:100%;margin-top:8px;border:none;background:var(--mist);color:var(--sec);border-radius:9px;padding:8px;font-family:var(--fb);font-weight:700;font-size:11.5px;cursor:pointer;}
.side-reset:hover{background:var(--sage);}

/* 좌측 상단 ☰ (모바일 내부 카테고리 열기) */<!--emoji-ok 장식·문구-->
.side-fab-inline{display:inline-flex;border:1px solid var(--line);background:var(--card);border-radius:9px;width:36px;height:34px;font-size:16px;cursor:pointer;color:var(--pine);align-items:center;justify-content:center;flex:0 0 auto;}
.side-backdrop{display:none;position:fixed;inset:0;z-index:55;background:rgba(20,28,26,.35);}
.side-backdrop.on{display:block;}

/* 중앙 외부 이동 메뉴(2중 구조의 중앙) */
.ext-fab{position:fixed;top:10px;left:50%;transform:translateX(-50%);z-index:62;display:flex;align-items:center;gap:6px;background:var(--card);border:1px solid var(--line);border-radius:999px;box-shadow:0 4px 14px rgba(37,49,49,.16);padding:8px 14px;font-family:var(--fb);font-weight:800;font-size:12.5px;color:var(--deep);cursor:pointer;}
.ext-menu{position:fixed;top:56px;left:50%;transform:translateX(-50%) translateY(-8px);z-index:70;background:var(--card);border:1px solid var(--line);border-radius:16px;box-shadow:0 18px 50px rgba(37,49,49,.22);width:min(300px,92vw);padding:8px;opacity:0;visibility:hidden;transition:.16s;}
.ext-menu.on{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0);}
.ext-menu a{display:flex;align-items:center;gap:9px;padding:10px 12px;border-radius:10px;color:var(--sec);text-decoration:none;font-size:14px;font-weight:700;}
.ext-menu a:hover{background:var(--mist);color:var(--deep);}
.ext-menu .sep{height:1px;background:var(--line);margin:5px 8px;}

@media(min-width:881px){
  .shell.pinned{grid-template-columns:212px 1fr;}
  .shell.pinned .side{position:sticky;top:64px;transform:none;width:auto;max-width:none;border-radius:16px;box-shadow:0 8px 20px rgba(37,49,49,.06);border:1px solid var(--line);max-height:calc(100vh - 80px);}
  body.side-pinned .side-fab-inline{display:none;}
}
@media(max-width:880px){
  .appbar .acts .navlink{display:none;}
}

.panel{display:none;}
.panel.on{display:block;animation:fade .2s;}
@keyframes fade{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}

.panel{display:none;}
.panel.on{display:block;animation:fade .2s;}
@keyframes fade{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}

.card{background:var(--card);border:1px solid var(--line);border-radius:18px;box-shadow:0 8px 20px rgba(37,49,49,.06);padding:18px 18px;margin-bottom:14px;}
.card h2{font-family:var(--ft);font-size:18px;color:var(--deep);margin-bottom:4px;display:flex;align-items:center;gap:8px;}
.card .sub{font-size:12.5px;color:var(--muted);margin-bottom:14px;line-height:1.6;}
.btn{border:none;border-radius:11px;padding:10px 16px;font-family:var(--fb);font-weight:800;font-size:13.5px;cursor:pointer;}
.btn.pri{background:var(--pine);color:#fff;} .btn.pri:hover{background:var(--deep);}
.btn.gho{background:var(--mist);color:var(--sec);} .btn.gho:hover{background:var(--sage);}
.btn.sm{padding:7px 12px;font-size:12.5px;border-radius:9px;}
input,select,textarea{font-family:var(--fb);}
.fld{display:flex;flex-direction:column;gap:4px;}
.fld label{font-size:11.5px;font-weight:700;color:var(--sec);}
.fld input,.fld select{border:1px solid var(--line);border-radius:9px;padding:9px 10px;font-size:13.5px;background:var(--white);color:var(--ink);}
.fld input:focus,.fld select:focus{outline:none;border-color:var(--pine);}

/* 복습 */
.rev-form{display:grid;grid-template-columns:1fr 2fr auto;gap:8px;align-items:end;}
@media(max-width:560px){.rev-form{grid-template-columns:1fr;}}
.due-banner{background:linear-gradient(135deg,rgba(201,141,86,.14),rgba(243,231,221,.5));border:1px solid var(--sand);border-left:4px solid var(--accent);border-radius:12px;padding:12px 14px;margin-bottom:14px;font-size:13px;color:var(--sec);}
.due-banner b{color:#8a5a1e;}
.due-list{display:flex;flex-direction:column;gap:5px;margin-top:8px;}
.due-item{display:flex;align-items:center;gap:9px;background:var(--white);border:1px solid var(--line);border-radius:10px;padding:8px 11px;font-size:13px;}
.due-item .chk{width:19px;height:19px;accent-color:var(--pine);flex:0 0 auto;cursor:pointer;}
.due-item .subj{font-size:11px;font-weight:800;color:#fff;background:var(--pine);border-radius:6px;padding:2px 7px;flex:0 0 auto;}
.due-item .stg{margin-left:auto;font-size:11px;color:var(--muted);font-weight:700;flex:0 0 auto;}
.rev-item{border:1px solid var(--line);border-radius:12px;padding:11px 13px;margin-bottom:9px;background:var(--white);}
.rev-item .top{display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.rev-item .subj{font-size:11px;font-weight:800;color:#fff;background:var(--deep);border-radius:6px;padding:2px 8px;}
.rev-item .ttl{font-weight:700;font-size:14px;color:var(--ink);}
.rev-item .date{font-size:11px;color:var(--muted);margin-left:auto;}
.rev-item .del{border:none;background:transparent;color:#c4b6a3;cursor:pointer;font-size:15px;}
.rev-item .del:hover{color:var(--red);}
.stages{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px;}
.stage{display:flex;flex-direction:column;align-items:center;gap:3px;border:1px solid var(--line);border-radius:10px;padding:6px 9px;cursor:pointer;min-width:58px;background:var(--mist);transition:.12s;}
.stage .lbl{font-size:11px;font-weight:800;color:var(--sec);}
.stage .dt{font-size:9.5px;color:var(--muted);}
.stage.done{background:var(--pine);border-color:var(--pine);}
.stage.done .lbl,.stage.done .dt{color:#fff;}
.stage.due{border-color:var(--accent);background:#fbeede;box-shadow:0 0 0 2px rgba(201,141,86,.25);}
.stage.due .lbl{color:#8a5a1e;}
.empty{text-align:center;color:var(--muted);font-size:13px;padding:22px 10px;background:var(--mist);border-radius:12px;}

/* 100일 */
.h100-top{display:flex;gap:10px;flex-wrap:wrap;align-items:end;margin-bottom:14px;}
.h100-stat{display:flex;gap:16px;flex-wrap:wrap;margin-bottom:14px;}
.h100-stat .s{background:var(--mist);border-radius:12px;padding:10px 16px;text-align:center;}
.h100-stat .s .n{font-family:var(--ft);font-size:24px;font-weight:800;color:var(--deep);}
.h100-stat .s .l{font-size:11px;color:var(--muted);}
.h100-grid{display:grid;grid-template-columns:repeat(10,1fr);gap:5px;}
@media(max-width:560px){.h100-grid{grid-template-columns:repeat(10,1fr);gap:3px;}}
.h100-cell{aspect-ratio:1;border:1px solid var(--line);border-radius:7px;background:var(--white);display:flex;align-items:center;justify-content:center;font-size:10px;color:var(--muted);cursor:pointer;user-select:none;transition:.1s;}
.h100-cell:hover{border-color:var(--pine);}
.h100-cell.done{background:var(--pine);color:#fff;border-color:var(--pine);font-weight:800;}
.h100-cell.today{box-shadow:0 0 0 2px var(--accent);font-weight:800;color:var(--accent);}
.h100-cell.today.done{color:#fff;}
.h100-cell.future{opacity:.45;cursor:default;}

/* 내일 */
.tm-date{font-family:var(--ft);font-size:16px;color:var(--deep);font-weight:800;margin-bottom:10px;}
.tm-prio{display:flex;flex-direction:column;gap:8px;margin-bottom:14px;}
.tm-prio .row{display:flex;align-items:center;gap:9px;}
.tm-prio .num{width:26px;height:26px;border-radius:8px;background:var(--accent);color:#fff;display:grid;place-items:center;font-weight:800;font-size:13px;flex:0 0 auto;}
.tm-prio input{flex:1;border:1px solid var(--line);border-radius:9px;padding:9px 11px;font-size:13.5px;background:var(--white);}
.tm-prio input:focus{outline:none;border-color:var(--pine);}
.tm-free{width:100%;min-height:90px;border:1px solid var(--line);border-radius:12px;padding:11px 12px;font-size:13.5px;resize:vertical;background:var(--white);line-height:1.6;}
.tm-free:focus{outline:none;border-color:var(--pine);}

.foot{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:11.5px;color:var(--muted);margin-top:8px;}
.saveflag{font-weight:700;color:var(--green);transition:opacity .3s;}

/* 홈 대시보드 */
.dash-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px;}
.dcard{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:15px 16px;cursor:pointer;box-shadow:0 6px 16px rgba(37,49,49,.06);transition:.14s;text-align:left;font-family:var(--fb);display:block;width:100%;}
.dcard:hover{transform:translateY(-2px);box-shadow:0 12px 24px rgba(37,49,49,.12);border-color:var(--pine);}
.dcard .di{font-size:21px;line-height:1;}
.dcard .dn{font-family:var(--ft);font-size:26px;font-weight:800;color:var(--deep);margin:7px 0 2px;line-height:1.15;word-break:break-all;}
.dcard .dl{font-size:12px;color:var(--sec);font-weight:800;}
.dcard .dx{font-size:11px;color:var(--muted);margin-top:3px;}

/* 목표·꿈·기록 공통 */
.ta{width:100%;min-height:72px;border:1px solid var(--line);border-radius:10px;padding:9px 11px;font-size:13.5px;background:var(--white);resize:vertical;line-height:1.6;font-family:var(--fb);color:var(--ink);}
.ta:focus{outline:none;border-color:var(--pine);}
.fldin{border:1px solid var(--line);border-radius:9px;padding:9px 11px;font-size:13.5px;background:var(--white);color:var(--ink);}
.fldin:focus{outline:none;border-color:var(--pine);}
.addrow{display:flex;gap:7px;margin:8px 0 12px;flex-wrap:wrap;}
.addrow input{flex:1;min-width:120px;border:1px solid var(--line);border-radius:9px;padding:9px 11px;font-size:13.5px;background:var(--white);color:var(--ink);}
.addrow input:focus{outline:none;border-color:var(--pine);}
.litem{display:flex;align-items:center;gap:9px;background:var(--white);border:1px solid var(--line);border-radius:10px;padding:9px 11px;margin-bottom:6px;font-size:13.5px;}
.litem .chk{width:18px;height:18px;accent-color:var(--pine);flex:0 0 auto;cursor:pointer;}
.litem.done .txt{text-decoration:line-through;color:var(--muted);}
.litem .txt{flex:1;min-width:0;word-break:break-all;}
.litem .del{border:none;background:transparent;color:#c4b6a3;cursor:pointer;font-size:15px;flex:0 0 auto;}
.litem .del:hover{color:var(--red);}
.litem .tm{font-size:11px;font-weight:800;color:#fff;background:var(--pine);border-radius:6px;padding:2px 7px;flex:0 0 auto;}
/* 시간표 */
table.tt{border-collapse:collapse;width:100%;min-width:460px;}
table.tt th,table.tt td{border:1px solid var(--line);padding:0;}
table.tt th{background:var(--pine);color:#fff;font-size:12px;font-weight:700;padding:7px 4px;}
table.tt td.per{background:var(--mist);color:var(--sec);font-size:11.5px;font-weight:700;text-align:center;width:40px;}
table.tt td input{width:100%;border:none;padding:8px 5px;font-size:12px;text-align:center;background:transparent;font-family:var(--fb);color:var(--ink);}
table.tt td input:focus{outline:none;background:var(--mist);}
table.tt td.per{padding:4px 2px;}
table.tt td.per b{font-size:12px;color:var(--sec);}
table.tt .pertime{display:block;width:100%;border:none;background:transparent;font-size:9px;text-align:center;color:var(--muted);padding:1px 0;font-family:var(--fb);}
table.tt .pertime:focus{outline:none;background:#fff;}
table.tt td.lunch{background:var(--peach);color:var(--accent);font-weight:800;font-size:11px;text-align:center;padding:5px 4px;}
.tt-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:12px;}
.tt-hint{font-size:11px;color:var(--muted);line-height:1.5;flex:1;min-width:160px;}
.tcls{display:flex;align-items:center;gap:10px;background:var(--white);border:1px solid var(--line);border-radius:10px;padding:9px 12px;margin-bottom:6px;}
.tc-t{font-size:11.5px;font-weight:800;color:#fff;background:var(--pine);border-radius:6px;padding:3px 8px;flex:0 0 auto;}
.tc-s{flex:1;font-weight:700;font-size:14px;min-width:0;word-break:break-all;}
.tc-g{text-decoration:none;font-size:18px;flex:0 0 auto;}
/* 칸반 */
.kb-form{display:grid;grid-template-columns:2fr 1fr 1.1fr 1fr auto;gap:7px;margin-bottom:14px;}
@media(max-width:640px){.kb-form{grid-template-columns:1fr 1fr;}}
.kb-form input,.kb-form select{border:1px solid var(--line);border-radius:9px;padding:8px 9px;font-size:12.5px;background:var(--white);font-family:var(--fb);color:var(--ink);min-width:0;}
.kb-form input:focus,.kb-form select:focus{outline:none;border-color:var(--pine);}
.kanban{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;}
@media(max-width:600px){.kanban{grid-template-columns:1fr;}}
.kcol{background:var(--mist);border-radius:14px;padding:10px;min-height:90px;transition:.12s;}
.kcol.drag-over{outline:2px dashed var(--pine);outline-offset:-4px;background:var(--sage);}
.kcol-h{font-weight:800;font-size:13px;color:var(--deep);text-align:center;padding:4px 0 9px;}
.kcol-h .cnt{font-size:11px;color:var(--muted);margin-left:5px;}
.kcol-body{min-height:30px;}
.kcard{background:var(--white);border:1px solid var(--line);border-left:5px solid var(--pine);border-radius:10px;padding:8px 9px;margin-bottom:7px;font-size:13px;cursor:grab;}
.kcard.dragging{opacity:.4;}
.kcard .ktop{display:flex;align-items:flex-start;gap:6px;}
.kcard .ktxt{flex:1;min-width:0;word-break:break-all;font-weight:600;}
.kcard .kx{border:none;background:transparent;color:#c4b6a3;width:20px;height:20px;border-radius:5px;font-size:12px;cursor:pointer;flex:0 0 auto;line-height:1;}
.kcard .kx:hover{background:var(--red);color:#fff;}
.kcard .kmeta{display:flex;align-items:center;gap:5px;flex-wrap:wrap;margin-top:6px;}
.kcard .kchip{font-size:10px;font-weight:800;border-radius:5px;padding:2px 6px;background:var(--mist);color:var(--sec);}
.kcard .kdue{font-size:10px;font-weight:800;border-radius:5px;padding:2px 6px;background:#eef4ec;color:var(--deep);}
.kcard .kdue.over{background:#fbe3e3;color:var(--red);}
.kcard .kmove{margin-left:auto;display:flex;gap:3px;}
.kcard .kmove button{border:none;background:var(--sage);color:var(--sec);width:22px;height:20px;border-radius:5px;font-size:11px;cursor:pointer;line-height:1;}
.kcard .kmove button:hover{background:var(--pine);color:#fff;}
/* 예시(샘플) 카드 도장 — 내가 미리 만들어 둔 예시임을 표시, 지우기 좋게 */
.kcard.is-sample{background:repeating-linear-gradient(135deg,var(--white),var(--white) 9px,#faf3e7 9px,#faf3e7 18px);}
.sample-tag{flex:0 0 auto;font-size:9.5px;font-weight:800;border-radius:5px;padding:2px 6px;background:#c38d56;color:#fff;letter-spacing:.02em;white-space:nowrap;}
/* 간트차트 */
.gt-form{display:grid;grid-template-columns:2fr 1.1fr 1.1fr .6fr auto;gap:7px;margin-bottom:14px;}
@media(max-width:640px){.gt-form{grid-template-columns:1fr 1fr;}}
.gt-form input,.gt-form select{border:1px solid var(--line);border-radius:9px;padding:8px 9px;font-size:12.5px;background:var(--white);font-family:var(--fb);color:var(--ink);min-width:0;}
.gt-form input:focus,.gt-form select:focus{outline:none;border-color:var(--pine);}
.gt-viewbar{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-bottom:10px;}
.gt-vbtn{border:1px solid var(--line);background:var(--white);color:var(--sec);border-radius:999px;padding:6px 13px;font-size:12px;font-weight:700;cursor:pointer;}
.gt-vbtn:hover{border-color:var(--pine);color:var(--pine);}
.gt-vbtn.on{background:var(--pine);border-color:var(--pine);color:#fff;}
.gt-hint{font-size:11.5px;color:var(--muted);margin-left:2px;}
.gt-wrap{overflow-x:auto;max-width:100%;border:1px solid var(--line);border-radius:12px;-webkit-overflow-scrolling:touch;cursor:grab;}
.gt-head{display:flex;border-bottom:2px solid var(--line);}
.gt-row{display:flex;align-items:stretch;border-bottom:1px solid var(--line);}
.gt-row:last-child{border-bottom:none;}
.gt-name{flex:0 0 120px;width:120px;padding:3px 10px;font-weight:700;font-size:11px;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;border-right:1px solid var(--line);background:var(--mist);position:sticky;left:0;z-index:2;display:flex;align-items:center;}
.gt-head .gt-name{background:var(--pine);color:#fff;display:flex;align-items:center;}
.gt-track{position:relative;flex:0 0 auto;overflow:hidden;}
.gt-row .gt-track{height:20px;}
.gt-head .gt-track{display:flex;}
.gt-tick{flex:0 0 auto;text-align:center;font-size:9px;color:var(--muted);border-right:1px solid var(--line);padding:4px 0;box-sizing:border-box;}
.gt-tick.wkstart{font-weight:800;color:var(--deep);}
.gt-tick.sat{color:#2e6ea3;}
.gt-tick.sun{color:var(--red);}
.gt-bar{position:absolute;top:3px;height:14px;border-radius:5px;display:flex;align-items:center;padding:0 4px;font-size:8.5px;color:#fff;font-weight:800;white-space:nowrap;overflow:hidden;box-shadow:0 2px 6px rgba(0,0,0,.18);cursor:grab;user-select:none;touch-action:none;}
.gt-bar.dragging{cursor:grabbing;opacity:.85;box-shadow:0 4px 14px rgba(0,0,0,.3);z-index:5;}
.gt-bar .gt-del{margin-left:4px;background:rgba(255,255,255,.35);border:none;color:#fff;border-radius:4px;cursor:pointer;font-size:8px;padding:0 3px;line-height:1.3;flex:0 0 auto;}
.gt-bar .gt-handle{position:absolute;top:0;bottom:0;width:8px;cursor:ew-resize;}
.gt-bar .gt-handle-l{left:0;}
.gt-bar .gt-handle-r{right:0;}
.gt-bar .gt-handle::after{content:'';position:absolute;top:50%;left:50%;width:2px;height:7px;background:rgba(255,255,255,.7);border-radius:2px;transform:translate(-50%,-50%);}
.gt-bar.is-sample::after{content:'';position:absolute;inset:0;border-radius:5px;background:repeating-linear-gradient(135deg,rgba(255,255,255,0) 0,rgba(255,255,255,0) 6px,rgba(255,255,255,.32) 6px,rgba(255,255,255,.32) 11px);pointer-events:none;}
.gt-bar .sample-tag{margin-right:4px;font-size:8px;padding:1px 4px;}
.gt-today{position:absolute;top:0;bottom:0;width:2px;background:var(--red);z-index:1;}
.gt-copy-handle{flex:0 0 auto;display:inline-flex;align-items:center;color:rgba(255,255,255,.75);cursor:grab;margin-right:3px;}
.gt-copy-handle:hover{color:#fff;}
.gt-todaybtn{background:var(--accent);border-color:var(--accent);color:#fff;}
.gt-todaybtn:hover{filter:brightness(1.06);color:#fff;}
/* 간트 하단 미니 칸반 — 위 막대를 끌어다 놓으면 복사 */
.gtk-wrap{margin-top:14px;}
.gtk-h{font-size:12px;font-weight:800;color:var(--sec);margin-bottom:6px;display:flex;align-items:center;gap:6px;}
.gtk-h .gtk-goto{margin-left:auto;font-size:11px;font-weight:700;color:var(--pine);background:none;border:none;cursor:pointer;text-decoration:underline;padding:0;}
.gtk-cols{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;}
@media(max-width:640px){.gtk-cols{grid-template-columns:1fr;}}
.gtk-col{background:var(--mist);border:1px dashed var(--line);border-radius:10px;padding:7px;min-height:56px;transition:background .15s,border-color .15s;}
.gtk-col.drag-over{background:#eef4ec;border-color:var(--pine);border-style:solid;}
.gtk-col-h{font-size:11px;font-weight:800;color:var(--sec);margin-bottom:5px;display:flex;align-items:center;gap:5px;}
.gtk-col-h .cnt{margin-left:auto;background:var(--white);border-radius:999px;padding:1px 6px;font-size:9.5px;color:var(--sec);}
.gtk-chip{background:var(--white);border:1px solid var(--line);border-left:4px solid var(--pine);border-radius:7px;padding:5px 7px;margin-bottom:5px;font-size:11px;display:flex;align-items:center;gap:5px;}
.gtk-chip .sample-tag{font-size:8px;}
.gtk-chip-t{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.gtk-empty{font-size:10.5px;color:var(--soft,var(--muted));padding:6px 2px;}
/* 학습지도 */
.mm-form{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:10px;align-items:center;}
.mm-form input{flex:1;min-width:160px;border:1px solid var(--line);border-radius:9px;padding:8px 9px;font-size:12.5px;background:var(--white);font-family:var(--fb);color:var(--ink);}
.mm-form select{border:1px solid var(--line);border-radius:9px;padding:8px 9px;font-size:12.5px;background:var(--white);font-family:var(--fb);color:var(--ink);}
.mm-form input:focus,.mm-form select:focus{outline:none;border-color:var(--pine);}
.mm-filters{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:10px;}
.mm-fbtn{border:1px solid var(--line);background:var(--card);border-radius:999px;padding:5px 11px;font-size:11.5px;font-weight:700;cursor:pointer;color:var(--sec);display:inline-flex;align-items:center;gap:5px;}
.mm-fbtn.on{background:var(--deep);color:#fff;border-color:var(--deep);}
.mm-fbtn .dot{width:9px;height:9px;border-radius:50%;display:inline-block;}
.mm-wrap{border:1px solid var(--line);border-radius:14px;background:radial-gradient(circle at 30% 20%,#2c3d3a,#1d2927);overflow:hidden;}
.mm-wrap svg{width:100%;height:60vh;min-height:380px;display:block;touch-action:none;}
.mm-legend{display:flex;gap:10px;flex-wrap:wrap;margin-top:10px;font-size:11.5px;color:var(--muted);align-items:center;}
.mm-legend .li{display:inline-flex;align-items:center;gap:5px;}
.mm-legend .dot{width:10px;height:10px;border-radius:50%;display:inline-block;}
@media print{ .mm-wrap svg{height:300px;} }
/* 연간 */
.year-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;}
@media(max-width:600px){.year-grid{grid-template-columns:repeat(2,1fr);}}
.ycell{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--white);}
.ycell .ym{background:var(--mist);color:var(--deep);font-weight:800;font-size:12.5px;padding:6px 10px;}
.ycell textarea{width:100%;min-height:66px;border:none;padding:8px 10px;font-size:12px;resize:vertical;background:transparent;font-family:var(--fb);line-height:1.5;color:var(--ink);}
.ycell textarea:focus{outline:none;background:var(--mist);}

/* 창의(그림판) */
.draw-bar{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 14px;border-bottom:1px solid var(--line);flex-wrap:wrap;background:var(--mist);}
.draw-wrap{width:100%;height:70vh;min-height:460px;background:#fff;}
.draw-wrap iframe{width:100%;height:100%;border:0;display:block;}
.allinone-wrap{width:100%;height:85vh;min-height:600px;background:#fff;border-radius:16px;overflow:hidden;border:1px solid var(--line);}
.allinone-wrap iframe{width:100%;height:100%;border:0;display:block;}
.art-title-in{flex:1;min-width:140px;border:1px solid var(--line);border-radius:9px;padding:7px 10px;font-size:13px;background:var(--white);}
.art-title-in:focus{outline:none;border-color:var(--pine);}
.art-day{font-family:var(--ft);font-size:13px;font-weight:800;color:var(--deep);margin:14px 0 8px;}
.art-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(148px,1fr));gap:10px;}
.art-card{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--white);cursor:pointer;position:relative;box-shadow:0 3px 10px rgba(37,49,49,.06);transition:.12s;}
.art-card:hover{transform:translateY(-2px);box-shadow:0 8px 18px rgba(37,49,49,.12);}
.art-card img{width:100%;height:102px;object-fit:contain;display:block;background:#fff;border-bottom:1px solid var(--line);}
.art-card .cap{padding:7px 9px;font-size:12px;color:var(--ink);font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.art-card .cap small{display:block;color:var(--muted);font-weight:400;font-size:10.5px;}
.art-card .x{position:absolute;top:5px;right:5px;width:22px;height:22px;border:none;border-radius:50%;background:rgba(0,0,0,.45);color:#fff;font-size:12px;cursor:pointer;display:grid;place-items:center;line-height:1;}
.art-card .x:hover{background:var(--red);}
.art-lb{position:fixed;inset:0;z-index:300;background:rgba(15,22,20,.84);display:none;align-items:center;justify-content:center;padding:20px;}
.art-lb.on{display:flex;}
.art-lb img{max-width:96vw;max-height:88vh;border-radius:10px;box-shadow:0 20px 60px rgba(0,0,0,.5);background:#fff;}
.art-lb .close{position:fixed;top:14px;right:18px;font-size:30px;color:#fff;cursor:pointer;background:none;border:none;line-height:1;}
@media print{ .art-lb{display:none!important;} }

/* 인쇄 2모드 */
@media print{
  .noprint{display:none!important;}
  body{background:#fff;}
  .panel{display:block!important;}
  .card{box-shadow:none;border:1px solid #ccc;break-inside:avoid;}
  .tab .soon{display:none;}
}
body.eco{background:#fff;}
body.eco .hero,body.eco .card{box-shadow:none!important;background:#fff!important;border:1px solid #ccc;}
body.eco .noprint{display:none!important;}
@media print{ body.eco{font-size:11px;} }