/* 가자워크 화면 — 시안(mockup/style.css)의 색 · 여백을 그대로 쓴다. 흰 바탕 · 초록은 강조에만 · 빨강은 늦은 것에만. */
:root{
  --g:#3B7D3F; --g-d:#336A36; --g-dd:#27512A; --g-l:#EAF2EA;
  --ink:#1C211C; --ink2:#3C443C; --muted:#69736A; --faint:#98A199;
  --line:#E2E6E2; --line2:#EFF1EF; --side:#F7F8F7; --hover:#F1F3F1;
  --red:#C0392B; --amber:#B7791F; --amber-bg:#FDF6E7;
  --focus:0 0 0 3px rgba(59,125,63,.16);
}
*{box-sizing:border-box}
body{margin:0;background:var(--side);color:var(--ink);
     font:14px/1.55 'Malgun Gothic','맑은 고딕',-apple-system,BlinkMacSystemFont,'Segoe UI',system-ui,sans-serif;-webkit-font-smoothing:antialiased}
button,input,textarea{font:inherit;color:inherit}
h1,h2,h3{margin:0}
.sp{flex:1}
.muted{color:var(--muted)} .small{font-size:12.5px} .hint{color:var(--faint)}
[hidden]{display:none !important}

.btn{border:1px solid var(--line);background:#fff;border-radius:8px;padding:6px 12px;font-size:13px;cursor:pointer;color:var(--ink2)}
.btn:hover{background:var(--hover)}
.btn.pri{background:var(--g);border-color:var(--g);color:#fff}
.btn.pri:hover{background:var(--g-d)}
.btn.ghost{background:transparent;border-color:transparent;color:var(--muted)}
.btn.wide{width:100%;padding:10px;font-size:14px;margin-top:6px}
.icon{border:0;background:none;cursor:pointer;color:var(--muted);padding:4px 7px;border-radius:7px;font-size:15px;line-height:1}
.icon:hover{background:var(--hover);color:var(--ink)}
.link{border:0;background:none;color:var(--g-d);cursor:pointer;padding:0;font-size:12.5px;text-decoration:underline;text-underline-offset:2px}
.mark{display:grid;place-items:center;width:44px;height:44px;border-radius:12px;background:var(--g);color:#fff;font-size:12px;letter-spacing:.02em;margin:0 auto 14px}
.mark.sm{width:26px;height:26px;border-radius:7px;font-size:9px;margin:0}

/* 로그인 */
.gate{min-height:100vh;display:grid;place-items:center;padding:24px}
.gate-box{width:min(360px,100%);background:#fff;border:1px solid var(--line);border-radius:14px;padding:28px 26px 22px;text-align:center;box-shadow:0 1px 3px rgba(0,0,0,.04)}
.gate-box h1{font-size:19px;margin-bottom:4px}
.gate-box > p{margin:0 0 18px;font-size:12.5px}
.gate-box label{display:block;text-align:left;font-size:12.5px;color:var(--muted);margin-bottom:12px}
.gate-box input{display:block;width:100%;margin-top:5px;padding:9px 11px;border:1px solid var(--line);border-radius:9px;outline:0;background:#fff}
.gate-box input:focus{border-color:var(--g);box-shadow:var(--focus)}
.err{background:#FDEEEC;color:var(--red);border-radius:8px;padding:8px 10px;font-size:12.5px;margin-bottom:10px;text-align:left}

/* 뼈대 */
.stage{display:grid;grid-template-columns:236px minmax(0,1fr);grid-template-rows:46px minmax(0,1fr);height:100vh;height:100dvh;background:#fff}
.gh{grid-column:1 / -1;display:flex;align-items:center;gap:10px;padding:0 14px;background:var(--g-dd);color:#fff}
.wordmark{font-size:14px}
.who{font-size:12.5px;color:#D7E3D7;margin-right:6px}
.gh .btn.ghost{color:#D7E3D7}
.gh .btn.ghost:hover{background:rgba(255,255,255,.12)}
.sidebar{background:var(--side);border-right:1px solid var(--line);display:flex;flex-direction:column;min-height:0;overflow:hidden}
.snav{flex:1;min-height:0;overflow:auto;padding:12px 8px}
.sidebar h4{margin:14px 8px 6px;font-size:11.5px;color:var(--faint);font-weight:600}
.ni{display:flex;align-items:center;gap:8px;width:100%;height:32px;border:0;background:none;color:var(--ink2);
    padding:0 10px;border-radius:7px;cursor:pointer;text-align:left;font-size:13.5px}
.ni:hover{background:var(--hover)}
.ni.on{background:var(--g-l);color:var(--g-dd);font-weight:600}
.ni .ic{width:16px;color:var(--faint);flex:none;text-align:center}
.ni .n{margin-left:auto;font-size:11px;background:var(--g);color:#fff;border-radius:9px;padding:0 6px}
.ni.notmem{opacity:.55}
.main{display:flex;flex-direction:column;min-width:0;min-height:0}
.top{display:flex;align-items:center;gap:10px;padding:10px 24px;border-bottom:1px solid var(--line)}
.top-t{display:flex;align-items:baseline;gap:12px;min-width:0}
.top h2{font-size:17px}
.desc{font-size:12.5px;color:var(--faint);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.burger{display:none}
.membtn{margin-left:auto;border:1px solid var(--line);background:#fff;border-radius:7px;padding:3px 9px;font-size:12.5px;color:var(--muted);cursor:pointer;white-space:nowrap}
.view{flex:1;overflow:auto;padding:8px 0 14px}
.thread{position:fixed;top:46px;right:0;bottom:0;width:min(420px,100%);background:#fff;border-left:1px solid var(--line);display:flex;flex-direction:column;box-shadow:-8px 0 24px rgba(0,0,0,.06)}
.th-head{display:flex;align-items:center;gap:8px;padding:12px 16px;border-bottom:1px solid var(--line)}
.th-body{flex:1;overflow:auto;padding:8px 0}
.th-sep{font-size:12px;color:var(--faint);padding:6px 24px;border-bottom:1px solid var(--line2)}
.scrim{display:none}

/* 메시지 */
.msg{display:flex;gap:10px;padding:8px 24px;position:relative}
.msg:hover{background:#FCFDFC}
.msg.hl{background:#F3F8F3;box-shadow:inset 3px 0 0 var(--g)}
.avatar{width:34px;height:34px;border-radius:50%;flex:none;display:grid;place-items:center;color:#fff;font-weight:700;font-size:14px}
.m-main{min-width:0;flex:1}
.m-head{display:flex;align-items:baseline;gap:6px;flex-wrap:wrap}
.m-name{font-weight:700;font-size:13.5px}
.m-time{font-size:11.5px;color:var(--faint)}
.tag{font-size:10.5px;border-radius:4px;padding:0 5px;font-weight:600;background:#EDEFED;color:var(--muted)}
.tag.bot{background:var(--g-l);color:var(--g-dd)}
.m-body{white-space:pre-wrap;word-break:break-word;font-size:13.5px;margin-top:1px}
.mention{color:var(--g);font-weight:600}
.mnote{font-size:12px;color:var(--muted);margin-top:3px}
.m-replies{margin-top:4px;border:0;background:none;color:var(--g-d);font-size:12.5px;cursor:pointer;padding:0}
.m-tools{position:absolute;right:20px;top:-10px;display:none;background:#fff;border:1px solid var(--line);border-radius:8px;padding:2px}
.msg:hover .m-tools{display:flex}
.file{display:flex;gap:10px;align-items:center;border:1px solid var(--line);border-radius:9px;padding:8px 10px;margin-top:6px;max-width:420px}
.fi{font-size:10.5px;font-weight:700;color:#fff;background:var(--g);border-radius:5px;padding:2px 6px}
.file small{display:block;color:var(--faint);font-size:11.5px}
.day{text-align:center;font-size:11.5px;color:var(--faint);margin:14px 0 6px}
.empty{padding:40px 24px;color:var(--faint);text-align:center}

/* 입력 */
.composer{padding:10px 24px 16px;background:#fff}
.cbox{border:1px solid #D8DCD8;border-radius:10px;overflow:hidden}
.cbox:focus-within{border-color:var(--g);box-shadow:var(--focus)}
.cbox textarea{width:100%;border:0;outline:0;resize:none;padding:10px 12px;min-height:44px;display:block;background:transparent}
.cbar{display:flex;align-items:center;gap:6px;padding:6px 8px;border-top:1px solid var(--line2)}
.hintline{font-size:12.5px;color:var(--ink2);background:var(--side);border-radius:8px;padding:6px 10px;margin-bottom:6px}
.ro{padding:10px 12px;border-radius:8px;background:var(--side);color:var(--muted);font-size:13px}
.fileon{display:inline-flex;gap:4px;align-items:center;max-width:50%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:var(--ink2)}

.modal-bg{position:fixed;inset:0;background:rgba(20,26,20,.35);display:grid;place-items:center;padding:20px;z-index:40}
.modal{width:min(460px,100%);max-height:calc(100vh - 60px);overflow:auto;background:#fff;border-radius:14px;padding:22px 24px;box-shadow:0 12px 40px rgba(0,0,0,.18)}
.modal h3{font-size:17px;margin-bottom:4px}
.modal .sec{margin:22px 0 8px;font-size:12.5px;font-weight:700;color:var(--ink2);border-top:1px solid var(--line2);padding-top:16px}
.fl{display:block;margin-top:14px;font-size:12.5px;color:var(--muted)}
.fl input{display:block;width:100%;margin-top:5px;padding:8px 11px;border:1px solid var(--line);border-radius:9px;outline:0;background:#fff}
.fl input:focus{border-color:var(--g);box-shadow:var(--focus)}
.modal-act{display:flex;align-items:center;gap:8px;margin-top:18px}
.who{border:0;background:none;cursor:pointer;font-size:12.5px;color:#D7E3D7;padding:4px 8px;border-radius:7px}
.who:hover{background:rgba(255,255,255,.12)}
.devlist{display:flex;flex-direction:column;gap:6px;font-size:12.5px;color:var(--muted);margin-bottom:10px}
.devlist b{color:var(--ink2);font-weight:600}
.toast{position:fixed;left:50%;bottom:26px;transform:translateX(-50%);background:var(--ink);color:#fff;
       padding:9px 16px;border-radius:9px;font-size:13px;z-index:50;max-width:80vw}

@media (max-width:760px){
  .stage{grid-template-columns:minmax(0,1fr)}
  .sidebar{position:fixed;top:46px;bottom:0;left:0;width:250px;z-index:30;transform:translateX(-100%);transition:transform .18s}
  .stage.drawer .sidebar{transform:none}
  .stage.drawer .scrim{display:block;position:fixed;inset:46px 0 0;background:rgba(0,0,0,.25);z-index:20}
  .burger{display:block}
  .top,.composer,.msg{padding-left:14px;padding-right:14px}
  .thread{top:46px;width:100%}
}

/* ---- 화면들 (홈 · 결재 · 휴가 · 드라이브 · 할 일 · 검색) ---- */
.ghsearch{margin-left:12px;width:min(280px,32vw);border:0;border-radius:8px;padding:5px 10px;font-size:12.5px;background:rgba(255,255,255,.14);color:#fff}
.ghsearch::placeholder{color:#B9CCB9}
.ghsearch:focus{outline:0;background:rgba(255,255,255,.22)}
.pxme{display:inline-flex;align-items:center;gap:6px;border:1px solid rgba(255,255,255,.25);background:transparent;color:#D7E3D7;
      border-radius:14px;padding:3px 10px;font-size:12px;cursor:pointer;white-space:nowrap}
.pxme:hover{background:rgba(255,255,255,.12)}
.pxd{display:inline-block;width:8px;height:8px;border-radius:50%;background:#8FBF92}
.px-work{background:#7FC08A} .px-call{background:#E9A13B} .px-out{background:#6AA6E0} .px-away,.px-off{background:#fff;border:1.5px solid #A6ADA6} .px-leave{background:#C3CAC3}
.tag.px{background:var(--g-l);color:var(--g-dd);font-weight:500}
.ni .ph{margin-left:auto;font-size:10.5px;color:var(--faint)}

.pane{padding:18px 24px 28px;max-width:1000px}
.pane.form{max-width:720px}
.sec{margin:20px 0 8px;font-size:12.5px;font-weight:700;color:var(--ink2)}
.sec:first-child{margin-top:0}
.filters{display:flex;gap:8px;align-items:center;margin-bottom:14px;flex-wrap:wrap}
.hkpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px;margin-bottom:18px}
.hk{border:1px solid var(--line);border-radius:10px;background:#fff;padding:12px 14px;text-align:left;cursor:pointer}
.hk b{display:block;font-size:20px} .hk small{color:var(--muted);font-size:12px}
.hk.alert b{color:var(--red)}
.cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:16px;align-items:start}
.card{border:1px solid var(--line);border-radius:10px;background:#fff;margin-bottom:16px;overflow:hidden}
.card-h{padding:11px 16px;border-bottom:1px solid var(--line2);font-weight:700;font-size:13.5px}
.card-b{padding:4px 16px 10px}
.todo{display:flex;gap:10px;align-items:center;padding:9px 0;border-bottom:1px solid var(--line2);font-size:13.5px}
.todo:last-child{border-bottom:0}
.tw{flex:1;min-width:0}
.late{color:var(--red)}
.row{display:flex;gap:10px;align-items:center;border:1px solid var(--line);border-radius:10px;padding:11px 14px;margin-bottom:8px;background:#fff}
.row-act{display:flex;gap:6px;flex:none}
.badge{font-size:10.5px;border:1px solid var(--line);border-radius:4px;padding:0 5px;color:var(--muted);margin-left:6px}
.warn{color:var(--amber);font-weight:600}
.tbl{width:100%;border-collapse:collapse;background:#fff}
.tbl th{text-align:left;font-size:12px;color:var(--faint);font-weight:600;padding:8px 10px;border-bottom:1px solid var(--line)}
.tbl td{padding:10px;border-bottom:1px solid var(--line2);vertical-align:top;font-size:13px}
.tbl tr[data-doc]:hover td{background:var(--hover);cursor:pointer}
.st{font-size:12px;font-weight:600;color:var(--amber);white-space:nowrap}
.st.approved{color:var(--g)} .st.rejected{color:var(--red)} .st.recalled{color:var(--faint)}
.bar{display:flex;height:8px;border-radius:4px;background:var(--line2);overflow:hidden}
.bar i{display:block;background:var(--g)}
.fsec{margin:18px 0 8px;font-size:12.5px;font-weight:700;color:var(--ink2)}
.chips{display:flex;gap:6px;flex-wrap:wrap}
.chip{border:1px solid var(--line);background:#fff;border-radius:16px;padding:5px 12px;font-size:12.5px;cursor:pointer;color:var(--ink2)}
.chip.on{background:var(--g-l);border-color:var(--g);color:var(--g-dd);font-weight:600}
.frow{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px}
.fl select,.fl input[type=date]{display:block;width:100%;margin-top:5px;padding:8px 11px;border:1px solid var(--line);border-radius:9px;background:#fff;outline:0}
.gyul{display:inline-grid;grid-auto-flow:column;border:1px solid var(--line);border-radius:6px;overflow:hidden;background:#fff;margin:14px 0 4px}
.gyul .gc{width:78px;text-align:center;border-left:1px solid var(--line2)}
.gyul .gc:first-child{border-left:0}
.gyul .gh{font-size:11px;background:var(--side);border-bottom:1px solid var(--line2);padding:2px 0;color:var(--muted)}
.gyul .gb{min-height:56px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;padding:4px}
.gyul .gb small{font-size:10.5px;color:var(--faint)}
.stamp{width:34px;height:34px;border:2px solid #C62F22;border-radius:50%;color:#C62F22;font-weight:800;font-size:10px;display:grid;place-items:center;transform:rotate(-8deg)}
.stamp.rej{border-color:var(--gray,#8A928A);color:#8A928A}
.stamp.dg{border-color:#3A77C2;color:#3A77C2}
.dgl{font-size:10px;color:#3A77C2;font-weight:600}
.wt{color:var(--amber);font-weight:600;font-size:12px}
.apmeta{display:grid;grid-template-columns:78px 1fr;gap:6px 10px;font-size:13px;margin:12px 0 4px}
.apmeta > span:nth-child(odd){color:var(--faint)}
.calhead{display:flex;align-items:center;gap:8px;margin-bottom:10px}
.cal{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));border-top:1px solid var(--line);border-left:1px solid var(--line)}
.cw{font-size:12px;color:var(--faint);padding:6px 8px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--side)}
.cd{min-height:84px;padding:4px 6px 6px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;flex-direction:column;gap:3px;min-width:0}
.cd.we{background:#FAFBFA} .cd.out{opacity:.45} .cd.busy{background:var(--amber-bg)}
.cn{font-size:12px;color:var(--muted);display:flex;gap:6px;align-items:center}
.cnt{font-size:10.5px;color:var(--amber);font-weight:700}
.lvchip{background:var(--g-l);color:var(--g-dd);border:1px solid transparent;border-radius:5px;padding:1px 6px;font-size:11.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lvchip.pend{background:#fff;border:1px dashed var(--g)}
.lvchip span{color:var(--muted)}
.mlist{display:flex;flex-direction:column;gap:2px;margin:12px 0;max-height:50vh;overflow:auto}
.mrow{display:flex;align-items:center;gap:8px;padding:5px 6px;border-radius:7px;font-size:13.5px}
.mrow .avatar{width:24px;height:24px;font-size:11px}
@media (max-width:760px){
  .ghsearch{display:none}
  .pane{padding:14px}
  .tbl thead{display:none}
  .tbl,.tbl tbody{display:block}
  .tbl tr{display:block;border:1px solid var(--line);border-radius:10px;margin-bottom:8px;padding:6px 0}
  .tbl td{display:block;border:0;padding:3px 12px}
  .cd{min-height:62px;padding:3px}
  .lvchip span{display:none}
}

.tbl tr.off td{opacity:.55}
.nowrap{white-space:nowrap}
.tempbox{border:1px solid var(--line);border-radius:10px;background:var(--side);padding:14px 16px;margin:14px 0}
.tempbox b{font-size:15px}
.tempbox b.temp{font-family:Consolas,monospace;font-size:18px;letter-spacing:.04em;color:var(--g-dd)}
.modal .mrow input[type=checkbox]{width:auto;margin:0}
.fl input[type=checkbox]{width:auto;margin-right:6px;vertical-align:-1px}

/* 계정별 권한 (docs/12) */
.tag.own{background:#FFF4DB;color:#8A5A00}
.pg{font-size:11.5px;font-weight:700;color:var(--faint);margin:12px 0 2px}
.prow{display:flex;gap:9px;align-items:flex-start;padding:6px 8px;border-radius:8px;font-size:13px;cursor:pointer}
.prow:hover{background:var(--hover)}
.prow input{margin-top:3px;flex:none}
.prow small{display:block;color:var(--muted);font-size:12px;margin-top:1px;line-height:1.45}
.prow.dis{opacity:.55;cursor:default}
.prow.own{border:1px dashed var(--line);margin-top:12px}
.pmx-wrap{overflow-x:auto;border:1px solid var(--line2);border-radius:10px}
.pmx th.pmx-u{text-align:center;white-space:nowrap;min-width:72px}
.pmx td.pmx-c{text-align:center;color:var(--g);font-size:14px;vertical-align:middle}
.pmx tr.pmx-g td{background:var(--line2);font-size:11.5px;font-weight:700;color:var(--muted);padding:5px 10px}
.pmx td:first-child{min-width:230px}
.ulink{background:none;border:0;padding:0;color:var(--g-dd);font-weight:600;cursor:pointer;font-size:13px}
.ulink:disabled{color:var(--muted);cursor:default}
.pmx-rules{margin:4px 0 12px 18px;padding:0;line-height:1.8}

/* 조직도 (docs/13) */
.pane.org{max-width:none}
.oc-wrap{overflow-x:auto;padding:4px 0 18px}
.oc,.oc ul{display:flex;margin:0;padding:0;list-style:none;position:relative}
.oc{width:max-content;margin:0 auto}
.oc ul{justify-content:center;padding-top:18px}
.oc ul::before{content:'';position:absolute;top:0;left:50%;height:18px;border-left:1px solid var(--line)}
.oc li{display:flex;flex-direction:column;align-items:center;position:relative;padding:18px 6px 0}
.oc li::before,.oc li::after{content:'';position:absolute;top:0;right:50%;width:50%;height:18px;border-top:1px solid var(--line)}
.oc li::after{right:auto;left:50%;border-left:1px solid var(--line)}
.oc li:only-child::before,.oc li:only-child::after{display:none}
.oc li:only-child{padding-top:0}
.oc li:first-child::before,.oc li:last-child::after{border:0}
.oc li:last-child::before{border-right:1px solid var(--line);border-radius:0 6px 0 0}
.oc li:first-child::after{border-radius:6px 0 0 0}
.oc>li{padding-top:0}
.oc>li::before,.oc>li::after{display:none}
.oc-box{background:#fff;border:1px solid var(--line);border-radius:10px;min-width:160px;max-width:230px;padding:8px 8px 6px;text-align:left}
.oc-box.over,.oc-loose.over{border-color:var(--g);box-shadow:var(--focus)}
.oc-h{display:flex;align-items:center;gap:6px;padding:0 2px 6px;border-bottom:1px solid var(--line2);margin-bottom:4px;font-size:13px;white-space:nowrap}
.oc-tools{margin-left:auto;display:flex}
.oc-tools .icon{border:0;background:none;cursor:pointer;color:var(--muted);font-size:13px;padding:0 4px;border-radius:5px}
.oc-tools .icon:hover{background:var(--hover);color:var(--ink2)}
.oc-p{display:flex;align-items:center;gap:7px;padding:4px;border-radius:7px;font-size:12.5px}
.oc-p .avatar{width:24px;height:24px;font-size:11px;flex:none}
.oc-p span{display:flex;flex-direction:column;line-height:1.3;min-width:0}
.oc-p b{font-weight:600;white-space:nowrap}
.oc-p em{font-style:normal;font-size:10.5px;color:var(--g-dd);background:var(--g-l);border-radius:4px;padding:0 4px;margin-left:5px}
.oc-p small{color:var(--muted);font-size:11.5px}
.oc-p.drag{cursor:grab}
.oc-p.drag:hover{background:var(--hover)}
.oc-p.dragging{opacity:.4}
.oc-empty{font-size:12px;color:var(--faint);padding:6px 4px}
.oc-loose{border:1px dashed var(--line);border-radius:10px;padding:8px 10px;margin-bottom:16px;background:#fff}
.oc-row{display:flex;flex-wrap:wrap;gap:2px 12px}
.btn.danger{color:var(--red)}
#modal-box.wide{width:min(960px,94vw);max-width:94vw;max-height:90vh;overflow-y:auto}
.imp-help{margin:6px 0 10px 18px;padding:0;line-height:1.7}
.imp-text{display:block;width:100%;box-sizing:border-box;font-family:ui-monospace,Consolas,monospace;font-size:12.5px;border:1px solid var(--line);border-radius:9px;padding:8px 10px;resize:vertical;outline:0}
.imp-text:focus{border-color:var(--g);box-shadow:var(--focus)}
.imp-sum{margin:14px 0 6px;font-size:13px}
.imp-sum .red{color:var(--red)}
.imp-wrap{overflow:auto;max-height:42vh;border:1px solid var(--line2);border-radius:8px}
.tbl tr.bad td{background:#FDEEEC;color:var(--red)}
@media print{body *{visibility:hidden}#modal-box,#modal-box *{visibility:visible}#modal-box{position:absolute;left:0;top:0;width:100%;max-height:none;overflow:visible;box-shadow:none}#modal-box .modal-act{display:none}}

/* 결재 첨부 · 엑셀 미리 보기 (docs/14) */
.dfiles{margin:14px 0 4px;border-top:1px solid var(--line2);padding-top:10px}
.dfh{font-size:12px;color:var(--faint);margin-bottom:4px}
.dfile{display:flex;align-items:center;gap:8px;padding:6px 0;border-bottom:1px solid var(--line2)}
.dfile .dfn{flex:1;min-width:0}
.dfile .dfn b{display:block;font-size:13px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dfile small{color:var(--faint);font-size:11.5px}
.dfile .btn{padding:4px 9px;font-size:12px;white-space:nowrap}
.dfadd{display:inline-block;margin-top:8px}
.sh-top{display:flex;align-items:center;gap:8px}
.sh-top h3{margin:0;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sh-tabs{display:flex;gap:2px;margin-top:12px;flex-wrap:wrap}
.sh-tabs:empty{margin-top:10px}
.sh-tab{border:1px solid var(--line);border-bottom:0;background:var(--side);border-radius:7px 7px 0 0;padding:4px 12px;font-size:12.5px;cursor:pointer;color:var(--muted)}
.sh-tab.on{background:#fff;color:var(--ink2);font-weight:600}
.sh-grid{overflow:auto;max-height:64vh;border:1px solid var(--line);background:#fff}
table.sheet{border-collapse:collapse;table-layout:fixed;width:max-content;font-size:12.5px}
table.sheet th,table.sheet td{border:1px solid #E3E6E2;padding:3px 6px;height:22px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:middle}
table.sheet thead th{position:sticky;top:0;background:#F3F4F2;color:var(--muted);font-weight:500;font-size:11.5px;text-align:center;z-index:2}
table.sheet th.rn{position:sticky;left:0;background:#F3F4F2;color:var(--muted);font-weight:500;font-size:11px;text-align:center;z-index:1}
table.sheet thead th.rn{z-index:3}
table.sheet td.num{text-align:right;font-variant-numeric:tabular-nums}
.sh-note{margin-top:8px}

/* 관리자 페이지 (docs/15) */
.adm-mode .ghsearch{visibility:hidden}
a.ni{text-decoration:none;color:inherit}
.ni .ext{margin-left:auto;color:var(--faint);font-size:12px}
.admhelp{background:var(--g-l);border-radius:10px;padding:10px 14px;font-size:13px;line-height:1.65;margin-bottom:14px;color:var(--ink2);max-width:860px}
.steps{display:flex;flex-direction:column;gap:8px;max-width:860px}
.step{display:flex;align-items:flex-start;gap:12px;background:#fff;border:1px solid var(--line);border-radius:10px;padding:12px 14px}
.step.done{opacity:.7}
.step .sb{flex:1;min-width:0}
.step .sb .small{margin-top:3px}
.ck{flex:none;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;font-weight:800;font-size:13px}
.ck.ok{background:var(--g-l);color:var(--g-dd)}
.ck.todo{background:#FFF1D6;color:#8A5A00}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:10px;margin-top:16px;max-width:860px}
.card{background:#fff;border:1px solid var(--line);border-radius:10px;padding:12px 14px;font-size:13px}
.card b.t{display:block;margin-bottom:6px}
.card code,.guide code{background:var(--side);padding:1px 6px;border-radius:5px;font-size:12.5px}
.baltbl td{vertical-align:middle}
.baltbl input.numin{width:64px;padding:5px 7px;border:1px solid var(--line);border-radius:7px;text-align:right}
.baltbl input.notein{width:100%;min-width:100px;padding:5px 7px;border:1px solid var(--line);border-radius:7px}
.baltbl td.num{text-align:right}
.holist{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0}
.hol{display:inline-flex;align-items:center;gap:4px;background:#fff;border:1px solid var(--line);border-radius:14px;padding:2px 4px 2px 10px;font-size:12.5px}
.hol .icon{border:0;background:none;cursor:pointer;color:var(--faint);font-size:11px;padding:2px 5px}
.guide{max-width:860px;font-size:13.5px;line-height:1.7}
.guide h3{margin:22px 0 6px;font-size:15px}
.guide h3:first-child{margin-top:0}
.guide ol,.guide ul{margin:4px 0 8px 20px;padding:0}
.guide .tbl{margin:6px 0 10px}

/* 채널 권한 (docs/16) */
.ni.add{color:var(--muted)}
.mchk{display:flex;align-items:center;gap:8px;flex:1;min-width:0;cursor:pointer}
.mrow select{padding:3px 6px;border:1px solid var(--line);border-radius:6px;font-size:12.5px;background:#fff}
.mrow.gone{opacity:.35;text-decoration:line-through}
.selfull{display:block;width:100%;padding:8px 11px;border:1px solid var(--line);border-radius:9px;background:#fff;font-size:13px}

/* 1:1 메시지 · 알림 · 사진 (docs/17) */
[data-dm]{cursor:pointer}
.m-name[data-dm]:hover{text-decoration:underline;text-underline-offset:2px}
.dmp{flex:none;max-height:44%;display:flex;flex-direction:column;border-top:1px solid var(--line);background:var(--side)}
.dmp-h{display:flex;align-items:center;gap:6px;padding:8px 8px 4px 16px;font-size:11.5px;color:var(--faint)}
.dmp-h b{font-weight:600}
.dmp-h .n,.dmr-m .n{font-size:10.5px;font-weight:700;background:var(--red);color:#fff;border-radius:9px;padding:0 6px;line-height:16px}
.dmp-h .icon{font-size:13px;padding:3px 6px}
.dmp-ask{margin:2px 8px 6px;border:1px dashed var(--g);background:var(--g-l);color:var(--g-dd);border-radius:8px;padding:6px 8px;font-size:12px;cursor:pointer;text-align:left}
.dmp-list{overflow:auto;padding:0 8px 10px;min-height:0}
.dmp-empty{font-size:12px;color:var(--faint);padding:4px 8px 8px}
.dmr{display:flex;align-items:center;gap:9px;width:100%;border:0;background:none;padding:5px 8px;border-radius:8px;cursor:pointer;text-align:left;color:var(--ink2)}
.dmr:hover{background:var(--hover)}
.dmr.on{background:var(--g-l)}
.dmr.gone{opacity:.6}
.dmr-a{position:relative;flex:none;display:block}
.dmr-a .avatar{width:30px;height:30px;font-size:12.5px}
.dmr-a .pxd{position:absolute;right:-1px;bottom:-1px;box-shadow:0 0 0 2px var(--side)}
.dmr-t{flex:1;min-width:0;display:flex;flex-direction:column;line-height:1.3}
.dmr-t b{font-size:13px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dmr-t small{font-size:11.5px;color:var(--faint);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dmr.unread .dmr-t b{font-weight:700;color:var(--ink)}
.dmr.unread .dmr-t small{color:var(--ink2)}
.dmr-m{flex:none;display:flex;flex-direction:column;align-items:flex-end;gap:2px}
.dmr-m small{font-size:10.5px;color:var(--faint)}
.dmpick{width:100%;border:0;background:none;cursor:pointer;text-align:left}
.dmpick:hover{background:var(--hover)}

.dmpops{position:fixed;right:16px;bottom:0;z-index:35;display:flex;flex-direction:row-reverse;align-items:flex-end;gap:12px;pointer-events:none}
body:has(#thread:not([hidden])) .dmpops{right:436px}
.dmpop{pointer-events:auto;width:340px;height:min(500px,calc(100vh - 64px));display:flex;flex-direction:column;background:#fff;border:1px solid #D5DBD5;border-bottom:0;border-radius:12px 12px 0 0;box-shadow:0 10px 36px rgba(0,0,0,.2);overflow:hidden}
.dmpop.dropping,.main.dropping{outline:2px dashed var(--g);outline-offset:-6px}
.dp-h{display:flex;align-items:center;gap:9px;padding:8px 8px 8px 12px;background:var(--g-dd);color:#fff}
.dmpop.flash .dp-h{animation:dpflash .8s ease-in-out 3}
@keyframes dpflash{50%{background:var(--g)}}
.dp-h .avatar{width:30px;height:30px;font-size:12.5px;box-shadow:0 0 0 2px rgba(255,255,255,.25)}
.dp-t{display:flex;flex-direction:column;min-width:0;line-height:1.25}
.dp-t b{font-size:13.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dp-t small{font-size:11.5px;color:#C5D6C5;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dp-h .icon{color:#D7E3D7}
.dp-h .icon:hover{background:rgba(255,255,255,.14);color:#fff}
.dp-b{flex:1;min-height:0;overflow:auto;padding:6px 12px 12px;background:#F3F5F3}
.dp-b .day{margin:12px 0 4px}
.dp-empty{padding:40px 16px;text-align:center;color:var(--faint);font-size:12.5px}
.bw{display:flex;gap:8px;margin-top:3px;align-items:flex-start}
.bw.head{margin-top:10px}
.bw.me{justify-content:flex-end}
.bw .avatar{width:30px;height:30px;font-size:12.5px}
.av-sp{width:30px;flex:none}
.bc{min-width:0;max-width:88%;display:flex;flex-direction:column}
.bw.me .bc{align-items:flex-end}
.bn{font-size:12px;color:var(--muted);margin:0 0 3px 2px}
.brow{display:flex;align-items:flex-end;gap:5px;min-width:0}
.bub{min-width:0;background:#fff;border:1px solid #E1E5E1;border-radius:3px 14px 14px 14px;padding:6px 10px;font-size:13.5px;line-height:1.5}
.bw.me .bub{background:#DDEEDB;border-color:#CCE2C9;border-radius:14px 3px 14px 14px}
.bub.pic,.bw.me .bub.pic{padding:3px;background:#fff;border-color:#E1E5E1}
.bt{white-space:pre-wrap;word-break:break-word}
.bt a{color:var(--g-d)}
.bmeta{flex:none;display:flex;flex-direction:column;align-items:flex-end;line-height:1.15}
.bw.them .bmeta{align-items:flex-start}
.bmeta small{font-size:10.5px;color:var(--faint);white-space:nowrap}
.rd{font-style:normal;font-size:11px;font-weight:700;color:#C98A12}
.bdel{display:none;flex:none;align-self:center;border:0;background:none;padding:0 2px;font-size:11px;color:var(--faint);cursor:pointer}
.bdel:hover{color:var(--red)}
.bw.me:hover .bdel{display:block}
.bimg{display:block;border:0;padding:0;background:none;cursor:zoom-in;border-radius:10px;overflow:hidden}
.bimg img{display:block;max-width:220px;max-height:240px;min-width:48px;min-height:48px;object-fit:cover;background:var(--line2)}
.bimg + .bimg,.bt + .bimg,.bt + .bfile,.bfile + .bfile{margin-top:5px}
.bfile{display:flex;align-items:center;gap:6px;font-size:12.5px;min-width:0}
.bfile b{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0;max-width:150px}
.dp-f{border-top:1px solid var(--line);padding:8px;background:#fff}
.dp-file{display:flex;align-items:center;gap:6px;font-size:12.5px;margin:0 2px 6px;min-width:0}
.dp-file img{height:44px;max-width:80px;object-fit:cover;border-radius:6px}
.dp-file b{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.dp-in{display:flex;align-items:flex-end;gap:4px}
.dp-in textarea{flex:1;min-width:0;border:1px solid var(--line);border-radius:9px;padding:7px 10px;resize:none;outline:0;height:36px;max-height:110px;line-height:1.45;background:#fff}
.dp-in textarea:focus{border-color:var(--g);box-shadow:var(--focus)}
.dp-in .btn{padding:7px 12px}
.dp-in .icon{padding:8px 6px}
.dp-ro{border-top:1px solid var(--line);padding:10px 12px;font-size:12.5px;color:var(--muted);background:var(--side)}

.notes{position:fixed;right:16px;bottom:16px;z-index:45;display:flex;flex-direction:column-reverse;gap:8px;width:min(330px,calc(100vw - 32px));pointer-events:none}
body:has(.dmpop) .notes{bottom:auto;top:58px;flex-direction:column}
.note{pointer-events:auto;display:flex;align-items:flex-start;gap:10px;background:#fff;border:1px solid var(--line);border-left:4px solid var(--g);border-radius:10px;padding:10px 8px 10px 12px;box-shadow:0 10px 30px rgba(0,0,0,.16);cursor:pointer;animation:notein .2s ease-out}
@keyframes notein{from{transform:translateY(10px);opacity:0}}
.note .avatar{width:34px;height:34px;font-size:13.5px}
.note-ic{width:34px;height:34px;border-radius:50%;background:var(--g-l);display:grid;place-items:center;flex:none}
.note-t{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
.note-t b{font-size:13px}
.note-t small{font-size:12.5px;color:var(--ink2);white-space:pre-wrap;word-break:break-word;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.note-x{font-size:11px;padding:3px 5px;flex:none}

.mpic{margin-top:6px;display:flex;flex-direction:column;align-items:flex-start;gap:3px;max-width:100%}
.mimg{display:block;max-width:100%;border:1px solid var(--line);padding:0;background:var(--line2);border-radius:10px;overflow:hidden;cursor:zoom-in}
.mimg img{display:block;max-width:min(360px,100%);max-height:300px;min-width:60px;min-height:48px;object-fit:contain}
.mpic small{font-size:11.5px;color:var(--faint)}
.fthumb{height:34px;max-width:60px;object-fit:cover;border-radius:5px;vertical-align:middle}
.lb{display:grid;place-items:center;margin-top:12px;background:#1C211C;border-radius:10px;overflow:auto;max-height:78vh}
.lb img{display:block;max-width:100%;max-height:78vh;object-fit:contain}
.dthumb{float:left;margin-right:10px;border:1px solid var(--line);padding:0;border-radius:6px;overflow:hidden;background:var(--line2);cursor:zoom-in}
.dthumb img{display:block;width:44px;height:44px;object-fit:cover}
@media (max-width:760px){
  .dmpops{left:0;right:0;top:46px;gap:0;align-items:stretch}
  body:has(#thread:not([hidden])) .dmpops{right:0}
  .dmpop{width:100%;height:auto;border-radius:0;border:0}
  .dmpop:not(:first-child){display:none}
  .notes,body:has(.dmpop) .notes{top:54px;bottom:auto;flex-direction:column}
}

/* 권한 관리 (docs/12) */
.pmx-bar{position:sticky;top:0;z-index:4;display:flex;flex-wrap:wrap;align-items:center;gap:8px;background:#fff;border:1px solid var(--line);border-radius:10px;padding:8px 12px;margin-bottom:10px;font-size:13px}
.pmx-bar.dirty{background:#FFF6DD;border-color:#EBCF8C}
.pmx-err{flex-basis:100%;margin:4px 0 0}
.pmx td.pmx-c input{width:16px;height:16px;margin:0;cursor:pointer;accent-color:var(--g);vertical-align:middle}
.pmx td.pmx-c input:disabled{cursor:not-allowed;opacity:.55}
.pmx td.pmx-c.chg{background:#FFEDB8}
.pmx tr.pmx-own td{background:#FFFBEF}
.pmx th:first-child,.pmx td:first-child{position:sticky;left:0;z-index:1;background:#fff}
.pmx tr.pmx-g td,.pmx tr.pmx-own td:first-child{z-index:1}
.pmx-pre{display:block;margin:4px auto 0;font-size:11.5px;padding:1px 4px;border:1px solid var(--line);border-radius:6px;background:#fff;max-width:88px;color:var(--ink2)}
.pmx-roles th.pmx-u{min-width:90px}
.pmx-alone{background:var(--g-l);border-radius:10px;padding:12px 14px;margin-bottom:12px;font-size:13px;line-height:1.6;color:var(--ink2)}
.pmx-rules-box{margin-top:20px}
.pmx-rules-box summary{cursor:pointer;color:var(--muted)}

/* 휴대폰 (docs/18) — 아래 탭 · 큰 누름 영역 · 키보드 · 홈 화면 앱 */
.msearch,.mback,.mtabs{display:none}
.inst{display:flex;align-items:center;gap:10px;background:var(--g-l);border:1px solid #CFE2CF;border-radius:10px;padding:10px 8px 10px 12px;margin-bottom:14px;font-size:13px;line-height:1.5;color:var(--ink2)}
.inst-i{font-size:20px}
.inst-t{flex:1;min-width:0}
.inst-t b{color:var(--g-dd)}
.mpage{padding:4px 12px 12px}
.mrowlink{display:flex;align-items:center;gap:10px;width:100%;border:0;border-bottom:1px solid var(--line2);background:none;padding:12px 4px;text-align:left;color:var(--ink2);cursor:pointer}
.mrowlink .ic{width:24px;flex:none;text-align:center;color:var(--faint);font-size:17px}
.mrowlink .t{flex:1;min-width:0;display:flex;flex-direction:column;line-height:1.35}
.mrowlink .t b{font-size:15px;font-weight:600}
.mrowlink .t small{font-size:12.5px;color:var(--faint);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mrowlink .n{flex:none;font-size:11px;background:var(--g);color:#fff;border-radius:9px;padding:0 7px}
.mrowlink .ph{flex:none;font-size:11px;color:var(--faint)}
.mrowlink.notmem{opacity:.6}
.mrowlink.add{color:var(--muted)}
.dmlist-page .dmp-list{padding:0;overflow:visible}
.dmlist-page .dmr{padding:10px 4px;border-bottom:1px solid var(--line2);border-radius:0}
.dmlist-page .dmr-a .avatar{width:42px;height:42px;font-size:16px}
.dmlist-page .dmr-a .pxd{box-shadow:0 0 0 2px #fff}
.dmlist-page .dmr-t b{font-size:15px}
.dmlist-page .dmr-t small{font-size:13px}
@media (max-width:760px){
  .gh{position:relative;gap:6px;padding:0 10px}
  .wordmark,#logout{display:none}
  .msearch{display:block;color:#D7E3D7;font-size:16px;padding:6px}
  .gh.searching .ghsearch{display:block;position:absolute;left:10px;right:10px;top:7px;width:auto;height:32px;margin:0;background:#fff;color:var(--ink);z-index:2}
  .pxme{max-width:118px;overflow:hidden}
  .who{max-width:96px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-right:0}
  .top{padding:8px 12px;gap:6px;min-height:46px}
  .top-t{flex:1;min-width:0}
  .top h2{font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .desc{display:none}
  .ni{height:42px;font-size:15px}
  input,select,textarea,.ghsearch{font-size:16px !important}     /* 16px보다 작으면 아이폰이 입력칸을 확대해 버린다 */
  .mtabs{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:25;background:#fff;border-top:1px solid var(--line);padding-bottom:env(safe-area-inset-bottom)}
  .stage.in-chat .mtabs,.adm-mode .mtabs{display:none}
  .stage:not(.in-chat) .view{padding-bottom:calc(64px + env(safe-area-inset-bottom))}
  .mt{flex:1;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;height:56px;border:0;background:none;color:var(--muted);font-size:11px;cursor:pointer}
  .mt .mi{font-size:19px;line-height:1.15}
  .mt.on{color:var(--g-dd);font-weight:700}
  .mt .n{position:absolute;top:5px;left:calc(50% + 6px);font-size:10px;font-weight:700;background:var(--red);color:#fff;border-radius:9px;padding:0 5px;line-height:15px}
  .stage.in-chat .burger{display:none}
  .mback{display:block;font-size:20px;padding:4px 8px;color:var(--ink2)}
  .composer{padding:8px 10px calc(10px + env(safe-area-inset-bottom))}
  .composer .hint{display:none}
  .thread{z-index:26}
  .thread .composer{padding-bottom:calc(10px + env(safe-area-inset-bottom))}
  #dmp{display:none !important}
  .dp-f{padding-bottom:calc(8px + env(safe-area-inset-bottom))}
  .dp-h [data-dpclose]{font-size:18px;padding:6px 10px}
  .modal-bg{padding:10px}
  .modal{padding:18px 16px}
}
@media (hover:none){
  .msg:hover .m-tools{display:none}
  .msg.act{background:#F6F9F6;flex-wrap:wrap}
  .msg.act .m-tools{display:flex;position:static;flex-basis:100%;justify-content:flex-end;gap:6px;border:0;background:none;padding:6px 0 0}
  .msg.act .m-tools .icon{font-size:13px;padding:8px 12px;border:1px solid var(--line);border-radius:8px;background:#fff;color:var(--ink2)}
  .bw.me:hover .bdel{display:none}
  .bw.me.act .bdel{display:block;font-size:12px;padding:6px}
}

/* 엑셀 결재 양식 (docs/19) */
.xs-wrap{overflow:auto;margin:12px 0;border:1px solid var(--line2);border-radius:8px;background:#fff;padding:14px}
table.xs{border-collapse:collapse;table-layout:fixed;font-size:13px;color:#111;margin:0 auto;font-family:'Malgun Gothic','맑은 고딕',sans-serif;line-height:1.25}
table.xs td{padding:1px 3px;border:0;vertical-align:middle;white-space:pre-wrap;word-break:break-all;overflow:hidden}
table.xs td.bl{border-left:1px solid #555}
table.xs td.br{border-right:1px solid #555}
table.xs td.bt{border-top:1px solid #555}
table.xs td.bb{border-bottom:1px solid #555}
table.xs .xin{min-height:1.25em;outline:0;white-space:pre-wrap}
table.xs td.fx{color:#1D4ED8}
table.xs-fill td.ed,table.xs-design td.ed{background:#FFFBDD !important}
table.xs-fill td.ed{cursor:text}
table.xs-fill td.ed:focus-within{box-shadow:inset 0 0 0 2px var(--g)}
table.xs-design td{cursor:pointer}
table.xs-design td.lk:not([style*="background"]){background:#EEF1F4}
table.xs-design td:hover{box-shadow:inset 0 0 0 1px #93C5FD}
table.xs-design td.sel{box-shadow:inset 0 0 0 2px #2563EB}
.xs-legend{display:flex;align-items:center;gap:14px;flex-wrap:wrap;font-size:12px;color:var(--muted);margin-bottom:6px}
.xs-legend i{display:inline-block;width:12px;height:12px;border:1px solid var(--line);vertical-align:-2px;margin-right:4px;background:#fff}
.xs-legend i.lg-ed{background:#FFFBDD}
.xs-legend i.lg-lk{background:#EEF1F4}
.xs-legend i.lg-fx{background:#DBEAFE}
.xs-mini{max-height:320px}
.fm-sheet{border:1px solid var(--line);border-radius:10px;padding:8px 12px 10px;margin-top:10px}
.cell-ed{position:sticky;bottom:-22px;z-index:2;display:flex;align-items:center;flex-wrap:wrap;gap:8px;background:#fff;border-top:1px solid var(--line);padding:10px 0}
.cell-ed textarea{flex:1;min-width:200px;border:1px solid var(--line);border-radius:8px;padding:6px 8px;font:inherit;font-size:13px;resize:vertical}
.pane.form:has(#f-sheet:not([hidden])){max-width:1040px}
@media print{.xs-wrap{border:0;padding:0;overflow:visible}table.xs-fill td.ed{background:none !important}}
table.xs td.sg{text-align:center;vertical-align:middle}
table.xs td.sg .stamp{margin:2px auto 1px}
table.xs td.sg small{display:block;font-size:10px;color:var(--faint);line-height:1.2}
table.xs .sg-note{font-size:10.5px;color:var(--faint);line-height:1.3}
table.xs .sg-jeon{font-size:12px;font-weight:700;color:var(--muted)}
table.xs-design td.sg{background:#F3E8FF !important}
.xs-legend i.lg-sg{background:#F3E8FF}
.fl textarea{display:block;width:100%;margin-top:5px;padding:8px 11px;border:1px solid var(--line);border-radius:9px;outline:0;background:#fff;font:inherit;resize:vertical}
.fl textarea:focus{border-color:var(--g);box-shadow:var(--focus)}

/* 결재 문서 — 종이 모양 (기본 양식) */
.paper{max-width:760px;margin:12px auto 4px;background:#fff;border:1px solid var(--line);border-radius:6px;padding:26px 30px 20px;box-shadow:0 1px 3px rgba(0,0,0,.05);color:#111}
.pp-head{display:flex;align-items:flex-start;gap:16px;margin-bottom:16px}
.pp-title{flex:1;min-width:0;padding-top:12px;text-align:center}
.pp-title h2{font-size:24px;letter-spacing:.12em;margin-bottom:6px}
.paper .gyul{margin:0;flex:none}
.pp-tbl{width:100%;border-collapse:collapse;table-layout:fixed;font-size:13.5px}
.pp-tbl th,.pp-tbl td{border:1px solid #777;padding:9px 10px;vertical-align:middle;white-space:pre-wrap;word-break:break-word}
.pp-tbl th{background:#F2F2F2;font-weight:600;text-align:center;color:#222}
.pp-tbl tr.tall td{height:130px;vertical-align:top}
.pp-foot,.pp-date{text-align:center;margin:18px 0 4px;font-size:14px}
.pp-date{margin-top:8px}
.pp-sig{text-align:right;margin:10px 4px 0;font-size:14px}
@media (max-width:760px){.paper{padding:16px 12px}.pp-head{flex-direction:column;align-items:stretch}.pp-title{padding-top:0}.pp-tbl{font-size:12.5px}.pp-tbl th,.pp-tbl td{padding:7px 6px}}
@media print{.paper{border:0;box-shadow:none;padding:0;max-width:none}}

/* 미리 보기 — 엑셀 모양 그대로 · PDF · 한글 (docs/20) */
.xs-prev{max-height:66vh;padding:0;margin-top:0;border-radius:0 0 8px 8px}
table.xs-grid{margin:0}
table.xs-grid td{border:1px solid #E3E6E2}
table.xs-grid tr.xh th{position:sticky;top:0;z-index:2;height:22px;background:#F3F4F2;border:1px solid #D9DCD8;color:var(--muted);font-weight:500;font-size:11.5px}
table.xs-grid th.xr{position:sticky;left:0;z-index:1;background:#F3F4F2;border:1px solid #D9DCD8;color:var(--muted);font-weight:500;font-size:11px;text-align:center}
.pdfv{display:block;width:100%;height:72vh;margin-top:12px;border:1px solid var(--line);border-radius:8px;background:#525659}
.hwp-doc{max-height:68vh;overflow:auto;margin-top:12px;border:1px solid var(--line2);border-radius:8px;background:#fff;padding:28px 34px;font-size:14px;line-height:1.7;color:#111}
.hwp-doc p{margin:0;min-height:1.7em;white-space:pre-wrap;word-break:break-word}
.hwp-doc table.hw{width:100%;margin:8px 0;border-collapse:collapse;font-size:13px}
.hwp-doc table.hw td{border:1px solid #777;padding:6px 8px;vertical-align:middle;white-space:pre-wrap;word-break:break-word}
.hwp-img{margin-top:10px}
.hwp-img img{display:block;max-width:100%;margin-top:8px;border:1px solid var(--line)}
@media (max-width:760px){.hwp-doc{padding:14px}}

/* 자동 로그인 · 채널 안 검색 · 1:1 대화 검색 (docs/21) */
.gate-box label.keep{display:flex;align-items:center;gap:7px;margin:-2px 0 14px;color:var(--ink2);cursor:pointer;font-size:13px}
.gate-box label.keep input{display:inline-block;width:15px;height:15px;margin:0;padding:0;accent-color:var(--g)}
.gate-box label.keep .small{font-size:11.5px}
.chsearch{flex:none;font-size:14px;padding:3px 8px}
#th-back{padding:3px 8px;font-size:12.5px}
body:has(#finder:not([hidden])) .dmpops{right:436px}
.fd-q{padding:10px 14px;border-bottom:1px solid var(--line)}
.fd-q input{display:block;width:100%;padding:8px 11px;border:1px solid var(--line);border-radius:9px;outline:0;background:#fff}
.fd-q input:focus{border-color:var(--g);box-shadow:var(--focus)}
.fd-row{display:flex;gap:10px;align-items:flex-start;width:100%;text-align:left;background:none;border:0;border-bottom:1px solid var(--line2);padding:10px 16px;cursor:pointer;font:inherit;color:inherit}
.fd-row:hover{background:#F6F8F6}
.fd-row .fi{flex:none;margin-top:3px}
.fd-t{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}
.fd-h{display:flex;align-items:center;gap:6px;min-width:0}
.fd-h b{font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fd-h small{margin-left:auto;color:var(--faint);white-space:nowrap;font-size:11.5px}
.fd-s{font-size:12.5px;color:var(--ink2);word-break:break-word;line-height:1.45}
.fd-empty{padding:28px 16px;text-align:center;color:var(--faint);font-size:12.5px}
mark{background:#FFE58A;color:inherit;border-radius:2px;padding:0 1px}
.msg.flash{animation:hitflash 1.8s ease-out}
@keyframes hitflash{0%,45%{background:#FFF3BF}100%{background:transparent}}
.backnow{position:sticky;bottom:10px;display:flex;justify-content:center;padding-top:8px;pointer-events:none}
.backnow .btn{pointer-events:auto;background:#fff;box-shadow:0 4px 14px rgba(0,0,0,.14)}
.dp-find{display:flex;align-items:center;gap:3px;padding:6px 6px 6px 10px;background:#fff;border-bottom:1px solid var(--line)}
.dp-find input{flex:1;min-width:0;padding:6px 9px;border:1px solid var(--line);border-radius:8px;outline:0;font-size:13px}
.dp-find input:focus{border-color:var(--g)}
.dp-fn{min-width:38px;text-align:center;white-space:nowrap;font-size:11.5px;color:var(--faint)}
.dp-find .icon{font-size:10.5px;padding:4px 6px;color:var(--muted)}
.bw.flash .bub{animation:bubflash 1.8s ease-out}
@keyframes bubflash{0%,45%{box-shadow:0 0 0 3px #F2C94C}100%{box-shadow:0 0 0 0 transparent}}
.dp-now{position:sticky;bottom:6px;display:flex;justify-content:center;padding-top:6px;pointer-events:none}
.dp-now .btn{pointer-events:auto;font-size:12px;padding:4px 11px;background:#fff;box-shadow:0 3px 10px rgba(0,0,0,.16)}
.dmf-out{max-height:56vh;overflow:auto;margin:10px -6px 0}
.dmf-out .sec{margin:10px 10px 4px}
@media (max-width:760px){
  body:has(#finder:not([hidden])) .dmpops{right:0}
  .finder{z-index:26}
  .fd-q input,.dp-find input{font-size:16px}
}

/* 채널 삭제 (docs/22) */
.btn.danger{background:var(--red);border-color:var(--red);color:#fff}
.btn.danger:disabled{opacity:.45;cursor:not-allowed}
.danger-t{color:var(--red)}

/* 오른쪽 1:1 메시지 · 접속 중 (docs/23) */
body:has(#ppl:not([hidden])) .stage{grid-template-columns:236px minmax(0,1fr) 272px}
.ppl{grid-row:2;grid-column:3;min-height:0;                     /* 줄만 정하면 격자가 먼저 첫 칸에 놓아 버린다 — 칸까지 정한다 */display:flex;flex-direction:column;background:var(--side);border-left:1px solid var(--line)}
.ppl .dmp{flex:1;max-height:none;min-height:0;border-top:0}
.ppl .dmp-h{padding:10px 8px 6px 14px;font-size:12.5px;color:var(--ink2)}
.ppl .dmp-list{flex:1}
.ppl-q{padding:2px 12px 6px}
.ppl-q input{display:block;width:100%;padding:6px 10px;border:1px solid var(--line);border-radius:8px;outline:0;background:#fff;font-size:12.5px}
.ppl-q input:focus{border-color:var(--g);box-shadow:var(--focus)}
.ppl-sec{display:flex;align-items:center;gap:6px;margin:12px 8px 4px;font-size:11.5px;font-weight:600;color:var(--faint)}
.ond{display:inline-block;flex:none;width:9px;height:9px;border-radius:50%;background:#C5CBC5}
.ond.on{background:#2FAE4E}
.dmr-a .ond{position:absolute;right:-1px;bottom:-1px;width:10px;height:10px;box-shadow:0 0 0 2px var(--side)}
.ppl-r.away .avatar{opacity:.55;filter:grayscale(.5)}
.ppl-r.away .dmr-t b{color:var(--muted)}
.pplbtn{white-space:nowrap}
.pplbtn.on{background:rgba(255,255,255,.16)}
.pplbtn .n{margin-left:5px;font-size:10.5px;font-weight:700;background:var(--red);color:#fff;border-radius:9px;padding:0 6px;line-height:16px}
body:has(#ppl:not([hidden])) .dmpops,body:has(#ppl:not([hidden])) .notes{right:288px}
body:has(#ppl:not([hidden])) .thread{right:272px}
body:has(#ppl:not([hidden])):has(#thread:not([hidden])) .dmpops,body:has(#ppl:not([hidden])):has(#finder:not([hidden])) .dmpops{right:708px}
.dmlist-page .dmr-a .ond{width:12px;height:12px;box-shadow:0 0 0 2px #fff}
.dmlist-page .ppl-sec{margin:16px 4px 4px;font-size:12.5px}
@media (max-width:760px){
  .ppl,.pplbtn{display:none !important}
  body:has(#ppl:not([hidden])) .stage{grid-template-columns:minmax(0,1fr)}
  body:has(#ppl:not([hidden])) .thread{right:0}
  body:has(#ppl:not([hidden])) .dmpops,body:has(#ppl:not([hidden])):has(#thread:not([hidden])) .dmpops,body:has(#ppl:not([hidden])):has(#finder:not([hidden])) .dmpops{right:0}
  body:has(#ppl:not([hidden])) .notes{right:16px}
}

/* 결재선 직접 정하기 (docs/24) */
.lineed{border:1px solid var(--line);border-radius:10px;background:#fff;overflow:hidden}
.le-row{display:flex;align-items:center;gap:8px;padding:6px 8px 6px 10px;border-bottom:1px solid var(--line2)}
.le-no{flex:none;width:18px;text-align:center;font-size:12px;font-weight:700;color:var(--faint)}
.le-row .avatar{width:26px;height:26px;font-size:11.5px}
.le-row b{font-size:13.5px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.le-row .icon{padding:3px 8px}
.le-row .icon:disabled{opacity:.3;cursor:default}
.le-add{display:flex;align-items:center;flex-wrap:wrap;gap:10px;padding:8px 10px}
.le-add select{max-width:100%;padding:6px 9px;border:1px solid var(--line);border-radius:8px;background:#fff;font-size:13px}

/* 채팅 아래 답글 (docs/25) */
.m-reps{margin-top:6px;padding:2px 0 2px 10px;border-left:2px solid var(--line);display:flex;flex-direction:column;align-items:flex-start;gap:5px}
.rep{display:flex;gap:7px;align-items:flex-start;width:100%;border-radius:6px}
.rep .avatar{width:22px;height:22px;font-size:10px;margin-top:1px}
.rep-main{min-width:0;flex:1}
.rep-name{margin-right:6px;font-size:12.5px;font-weight:700;color:var(--ink2)}
.rep-body{white-space:pre-wrap;word-break:break-word;font-size:13px;line-height:1.5;color:var(--ink2)}
.rep.flash{animation:hitflash 1.8s ease-out}
.m-reps-link{border:0;background:none;padding:0;color:var(--g-d);font-size:12px;cursor:pointer}
.m-reps-link:hover{text-decoration:underline}

/* 엑셀 양식 칸 종류 · 필수 (docs/27) */
table.xs .xin-in{display:block;width:100%;min-height:1.25em;border:0;padding:0;margin:0;background:transparent;font:inherit;color:inherit;text-align:inherit;outline:0}
table.xs select.xin-in{cursor:pointer}
table.xs-fill td.rq,table.xs-design td.rq{position:relative}
table.xs-fill td.rq::after,table.xs-design td.rq::after{content:'';position:absolute;top:0;right:0;border-top:7px solid #E5484D;border-left:7px solid transparent}
table.xs-fill td.miss{box-shadow:inset 0 0 0 2px #E5484D !important}
table.xs .xk{font-style:normal;font-size:10px;color:#2563EB;margin-left:3px;white-space:nowrap}
table.xs .xk.xrq{color:#E5484D}
.fe-type{display:inline-flex;align-items:center;gap:8px;flex-wrap:wrap}
.fe-type select,.fe-type input[type=text],.fe-type #fe-opt{border:1px solid var(--line);border-radius:8px;padding:5px 8px;font-size:13px}
.fe-type #fe-opt{min-width:220px}
@media print{table.xs-fill td.rq::after{display:none}}