/* =====================================================================
 * KMS 공통 레이아웃 CSS (좌측 사이드바형)
 *   구조: .kms-header(상단) / .kms-main[ .kms-sidebar | .kms-content ] / .kms-footer
 *   ※ 화면별 인라인 <style> 금지 — 공통 스타일은 이 파일로 누적(프런트 CSS 공통화 방침).
 * ===================================================================== */

* { box-sizing: border-box; }

html, body { height: 100%; }

body.kms-layout {
    margin: 0;
    font-family: "Malgun Gothic", "맑은 고딕", system-ui, sans-serif;
    font-size: 14px;
    color: #222;
    background: #f5f6f8;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

.kms-user-avatar img,.kms-room-avatar img,.kms-chat-member-avatar img{width:100%;height:100%;object-fit:cover;border-radius:50%;display:block}
.kms-profile-image-manager{margin:0 0 20px;padding:16px;border:1px solid var(--kms-border,#d8dee9);border-radius:10px}
.kms-profile-current{width:96px;height:96px;margin:10px 0;border-radius:50%;overflow:hidden;background:#eef2f7;display:flex;align-items:center;justify-content:center;font-size:42px}
.kms-profile-current img{width:100%;height:100%;object-fit:cover}
.kms-profile-image-manager details{margin-top:12px}.kms-profile-history{display:flex;flex-wrap:wrap;gap:10px;margin-top:10px}
.kms-profile-history-item{position:relative;width:76px}.kms-profile-history-item>button:first-child{border:2px solid transparent;background:none;padding:0;cursor:pointer}
.kms-profile-history-item.current>button:first-child{border-color:#2563eb}.kms-profile-history-item img{width:72px;height:72px;object-fit:cover;display:block}
.kms-profile-history-item small{display:block}.kms-profile-delete{width:72px;margin-top:4px;border:0;background:none;color:#c43b3b;cursor:pointer}

/* Menu management tree */
.menu-page-head { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; margin-bottom:16px; }
.menu-page-head .page-title { margin-bottom:6px; }
.menu-page-head .page-desc { margin:0; }
.menu-page-actions { display:flex; gap:8px; flex-shrink:0; }
.menu-toolbar { display:flex; align-items:center; gap:10px; margin-bottom:16px; padding:14px 18px; }
.menu-toolbar label { color:#4b5563; font-size:13px; font-weight:700; }
.menu-toolbar select { min-width:240px; text-align:left; }
.menu-toolbar-count { margin-left:auto; color:#6b7280; font-size:13px; }
.menu-manager-grid { display:grid; grid-template-columns:minmax(280px, .9fr) minmax(360px, 1.1fr); gap:16px; min-height:570px; align-items:stretch; }
.menu-tree-card,.menu-detail-card { min-width:0; margin:0; padding:0; overflow:hidden; }
.menu-panel-head { min-height:66px; padding:15px 18px; border-bottom:1px solid #e7ebf0; display:flex; justify-content:space-between; align-items:center; gap:12px; }
.menu-panel-head strong { display:block; color:#18202d; font-size:15px; }
.menu-panel-head span { display:block; margin-top:4px; color:#7b8492; font-size:12px; }
.menu-tree-head-actions { display:flex; align-items:center; gap:7px; flex-shrink:0; }
.menu-tree { padding:10px; max-height:650px; overflow:auto; }
.menu-tree-empty { min-height:210px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:7px; color:#8b94a3; text-align:center; font-size:13px; }
.menu-tree-empty strong { color:#4d5868; font-size:14px; }
.menu-tree-row { --tree-depth:0; display:flex; align-items:center; min-height:40px; padding:3px 8px 3px calc(8px + var(--tree-depth) * 24px); border-radius:7px; color:#354052; transition:background .15s ease; }
.menu-tree-row:hover { background:#f4f7fb; }
.menu-tree-row.selected { background:#eaf1ff; color:#174ea6; }
.menu-tree-toggle { width:22px; height:28px; padding:0; border:0; background:transparent; color:#697386; cursor:pointer; font-size:14px; }
.menu-tree-toggle:disabled { cursor:default; }
.menu-tree-icon { display:inline-flex; align-items:center; justify-content:center; width:26px; margin-right:3px; color:#667085; font-size:14px; }
.menu-tree-icon.directory { color:#d18a18; }
.menu-tree-icon.program { color:#3973c8; }
.menu-tree-name { flex:1; min-width:0; padding:6px 4px; border:0; background:transparent; color:inherit; text-align:left; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; cursor:pointer; font-weight:600; }
.menu-tree-badge { margin-left:6px; padding:2px 6px; border-radius:10px; background:#eef0f3; color:#8a929e; font-size:10px; }
.menu-tree-add { visibility:hidden; width:28px; height:28px; border:0; border-radius:5px; background:transparent; color:#3973c8; cursor:pointer; font-size:18px; }
.menu-tree-row:hover .menu-tree-add,.menu-tree-row.selected .menu-tree-add { visibility:visible; }
.menu-detail-empty { min-height:520px; display:flex; flex-direction:column; align-items:center; justify-content:center; color:#87909d; text-align:center; }
.menu-detail-empty[hidden],.menu-detail-form[hidden],#programField[hidden] { display:none !important; }
.menu-detail-empty-icon { width:52px; height:52px; margin-bottom:14px; border-radius:15px; background:#f0f4fa; color:#7890ae; display:flex; align-items:center; justify-content:center; font-size:23px; }
.menu-detail-empty strong { color:#3e4857; font-size:16px; }
.menu-detail-empty p { margin:8px 0 0; font-size:13px; }
.menu-detail-form { min-height:520px; }
.menu-detail-head { background:#fbfcfe; }
.menu-detail-actions { display:flex; gap:6px; }
.menu-danger { color:#c93b3b !important; border-color:#e5b8b8 !important; }
.menu-form-grid { display:grid; grid-template-columns:1fr 1fr; gap:18px 16px; padding:24px; }
.menu-field { min-width:0; }
.menu-field-full { grid-column:1 / -1; }
.menu-field label { display:block; margin-bottom:7px; color:#414b59; font-size:13px; font-weight:700; }
.menu-field label em { color:#d14343; font-style:normal; }
.menu-field input,.menu-field select { width:100%; height:40px; padding:0 11px; border:1px solid #d9dee7; border-radius:6px; background:#fff; color:#232b37; }
.menu-field small { display:block; margin-top:6px; color:#8a929e; font-size:11px; }
.menu-form-foot { display:flex; justify-content:flex-end; gap:8px; padding:18px 24px; border-top:1px solid #e7ebf0; }
.menu-import-modal { width:min(720px, calc(100vw - 32px)); max-height:calc(100vh - 48px); }
.menu-import-guide { margin:0 0 18px; color:#5f6978; font-size:13px; }
.menu-import-warning { margin-bottom:14px; padding:10px 12px; border-radius:6px; background:#fff1f0; color:#bd3535; font-size:12px; }
.menu-import-preview-head { display:flex; justify-content:space-between; align-items:center; margin:18px 0 8px; color:#394250; font-size:13px; }
.menu-import-preview-head span { color:#7e8794; }
.menu-import-preview { min-height:210px; max-height:320px; overflow:auto; padding:8px; border:1px solid #e2e6ec; border-radius:7px; background:#fafbfd; }
.preset-master-head { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:12px; }
.preset-master-head h2 { margin:0; font-size:15px; }
.preset-layout { display:grid; grid-template-columns:minmax(270px, 42%) minmax(360px, 58%); min-height:560px; overflow:hidden; align-items:stretch; }
.preset-tree-panel { min-width:0; padding:20px; border-right:1px solid #e3e8ef; background:#fff; }
.preset-tree-head { display:flex; align-items:center; justify-content:space-between; gap:8px; padding-bottom:14px; border-bottom:1px solid #e8ecf1; }
.preset-tree-head strong { font-size:15px; }
.preset-tree { max-height:500px; overflow:auto; padding:10px 0; }
.preset-tree-row { display:flex; align-items:center; gap:8px; width:100%; min-height:38px; padding:7px 10px; border:0; border-radius:6px; background:transparent; color:#263244; text-align:left; cursor:pointer; }
.preset-tree-row:hover { background:#f3f6fa; }
.preset-tree-row.active { background:#e8f1ff; color:#1456a0; font-weight:600; }
.preset-tree-row .preset-code { margin-left:auto; color:#8a94a3; font-size:11px; font-weight:400; }
.preset-detail-panel { min-width:0; padding:20px 24px; background:#fbfcfe; }
.preset-detail-empty { display:flex; min-height:480px; align-items:center; justify-content:center; color:#8a94a3; text-align:center; }
.preset-detail-form { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.preset-detail-form .wide { grid-column:1 / -1; }
.preset-detail-form label { display:block; margin-bottom:6px; color:#344054; font-size:12px; font-weight:600; }
.preset-detail-form input,.preset-detail-form select,.preset-detail-form textarea { width:100%; box-sizing:border-box; }
.preset-detail-actions { display:flex; justify-content:flex-end; gap:8px; margin-top:22px; padding-top:16px; border-top:1px solid #e3e8ef; }
.preset-badge { display:inline-block; padding:2px 7px; border-radius:10px; background:#e8f1ff; color:#1763b5; font-size:11px; font-weight:600; }
.kms-btn-danger { border-color:#f0b7b7; color:#c43b3b; background:#fff; }
.kms-btn-danger:hover { border-color:#df7777; background:#fff5f5; }
.common-code-grid { display:grid; grid-template-columns:minmax(420px, .9fr) minmax(560px, 1.1fr); gap:16px; align-items:start; }
.common-code-panel { margin:0; overflow:hidden; }
.common-code-head { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:12px; }
.common-code-head h2 { margin:0; font-size:15px; }
.common-code-tools { display:flex; align-items:center; gap:7px; flex-wrap:wrap; }
.common-code-search { width:190px; height:34px; box-sizing:border-box; }
.common-code-row { cursor:pointer; }
.common-code-row:hover td { background:#f6f9fc; }
.common-code-row.selected td { background:#eaf2ff; color:#174f92; }
.system-log-search { display:grid; grid-template-columns:repeat(4,minmax(150px,1fr)); gap:12px; align-items:end; }
.system-log-search label { display:flex; flex-direction:column; gap:5px; color:#555; font-size:12px; }
.system-log-search input,.system-log-search select { width:100%; height:38px; box-sizing:border-box; }
.system-log-search-actions { display:flex; gap:7px; align-items:center; }
.system-log-row { cursor:pointer; }
.system-log-row:hover td,.system-log-row[aria-expanded="true"] td { background:#f3f7fc; }
.system-log-preview { max-width:280px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.system-log-detail { padding:16px 18px; background:#f8fafc; color:#344054; }
.system-log-detail-grid { display:grid; grid-template-columns:repeat(3,minmax(180px,1fr)); gap:12px; margin-bottom:14px; }
.system-log-detail-grid strong { display:block; margin-bottom:4px; color:#667085; font-size:11px; }
.system-log-detail pre { max-height:260px; margin:0; padding:12px; overflow:auto; border:1px solid #e4e9ef; border-radius:6px; background:#fff; white-space:pre-wrap; word-break:break-all; }
@media (max-width:1180px) { .common-code-grid { grid-template-columns:1fr; } }
@media (max-width:900px) { .system-log-search { grid-template-columns:1fr 1fr; } .system-log-detail-grid { grid-template-columns:1fr; } }
@media (max-width:820px) { .preset-layout { grid-template-columns:1fr; } .preset-tree-panel { border-right:0; border-bottom:1px solid #e3e8ef; } }
.menu-preview-row { --tree-depth:0; display:flex; align-items:center; gap:8px; min-height:32px; padding-left:calc(8px + var(--tree-depth) * 22px); color:#475264; font-size:13px; }
@media (max-width:820px) { .menu-manager-grid { grid-template-columns:1fr; } .menu-tree { max-height:420px; } }
@media (max-width:700px) { .menu-page-head { flex-direction:column; } .menu-page-actions { width:100%; } .menu-toolbar { flex-wrap:wrap; } .menu-toolbar select { min-width:0; flex:1; } .menu-form-grid { grid-template-columns:1fr; } .menu-field-full { grid-column:auto; } }

/* =====================================================================
 * 프로젝트 메신저: 모든 인증 화면 우측 하단 플로팅 버튼 + 반응형 패널
 * ===================================================================== */
.kms-messenger-launch { position:fixed; right:22px; bottom:22px; z-index:1100; display:flex; align-items:center; justify-content:center; width:58px; height:58px; padding:0; border:0; border-radius:50%; background:var(--kms-primary,#2563eb); color:#fff; box-shadow:0 10px 28px rgba(30,64,175,.35); cursor:pointer; transition:transform .18s ease,box-shadow .18s ease; }
.kms-messenger-launch:hover { transform:translateY(-2px); box-shadow:0 13px 32px rgba(30,64,175,.43); }
.kms-messenger-launch svg { width:29px; height:29px; fill:currentColor; }
.kms-messenger-badge { position:absolute; top:-4px; right:-3px; min-width:21px; height:21px; padding:0 6px; border:2px solid #fff; border-radius:12px; background:#e11d48; color:#fff; font:700 11px/17px system-ui,sans-serif; text-align:center; }
.kms-messenger-badge[hidden] { display:none; }
.kms-messenger-panel { position:fixed; right:22px; bottom:92px; z-index:1090; display:none; flex-direction:column; width:min(430px,calc(100vw - 28px)); height:min(680px,calc(100vh - 125px)); overflow:hidden; border:1px solid #d7dee8; border-radius:18px; background:#fff; color:#1f2937; box-shadow:0 22px 55px rgba(15,23,42,.24); }
.kms-messenger-panel.open { display:flex; }
.kms-messenger-main { min-height:0; flex:1; display:flex; flex-direction:column; }
.kms-messenger-head { flex:0 0 auto; display:flex; align-items:center; gap:9px; min-height:62px; padding:12px 14px; background:#172b4d; color:#fff; }
.kms-messenger-head strong { flex:0 0 auto; font-size:16px; }
.kms-messenger-project { min-width:0; flex:1; height:34px; padding:0 8px; border:1px solid rgba(255,255,255,.22); border-radius:7px; background:#223d67; color:#fff; font:inherit; font-size:12px; }
.kms-messenger-close,.kms-chat-back,.kms-chat-members-toggle { flex:0 0 auto; height:34px; padding:0; border:0; border-radius:8px; background:rgba(255,255,255,.1); color:#fff; font-size:22px; cursor:pointer; }
.kms-messenger-close,.kms-chat-members-toggle { width:34px; }
.kms-messenger-tabs { flex:0 0 auto; display:grid; grid-template-columns:1fr 1fr; border-bottom:1px solid #e5e9ef; background:#fff; }
.kms-messenger-tab { height:46px; border:0; border-bottom:3px solid transparent; background:#fff; color:#667085; font:inherit; font-size:13px; font-weight:600; cursor:pointer; }
.kms-messenger-tab.active { border-bottom-color:var(--kms-primary,#2563eb); color:var(--kms-primary,#1d4ed8); }
.kms-messenger-view { min-height:0; flex:1; overflow-y:auto; background:#f7f9fc; }
.kms-messenger-empty { margin:22px 14px; padding:25px 12px; border:1px dashed #cbd5e1; border-radius:11px; background:#fff; color:#7b8794; text-align:center; font-size:13px; }
.kms-room-toolbar { position:sticky; top:0; z-index:2; display:flex; justify-content:flex-end; padding:10px 12px; border-bottom:1px solid #e5e9ef; background:#fff; }
.kms-room-list,.kms-user-list { display:grid; gap:1px; }
.kms-room-item { display:grid; grid-template-columns:44px minmax(0,1fr) auto; gap:10px; align-items:center; width:100%; padding:13px 14px; border:0; border-bottom:1px solid #edf0f4; background:#fff; color:inherit; text-align:left; cursor:pointer; }
.kms-room-item:hover { background:#f2f6fc; }
.kms-room-avatar { display:flex; align-items:center; justify-content:center; width:44px; height:44px; border-radius:15px; background:#e8effb; color:#2856a6; font-size:19px; }
.kms-room-copy { min-width:0; }
.kms-room-copy strong,.kms-room-copy span { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.kms-room-copy strong { margin-bottom:5px; font-size:13px; }
.kms-room-copy span { color:#7b8794; font-size:12px; }
.kms-room-meta { display:grid; justify-items:end; gap:6px; color:#98a2b3; font-size:10px; }
.kms-room-unread { min-width:20px; height:20px; padding:0 6px; border-radius:10px; background:#e11d48; color:#fff; font:700 11px/20px system-ui,sans-serif; text-align:center; }
.kms-user-toolbar { position:sticky; top:0; z-index:2; display:grid; gap:8px; padding:11px 12px; border-bottom:1px solid #e5e9ef; background:#fff; }
.kms-user-toolbar input { width:100%; height:36px; padding:0 10px; border:1px solid #d0d7e2; border-radius:7px; font:inherit; }
.kms-user-toolbar-row { display:flex; gap:8px; }
.kms-user-toolbar-row .kms-btn { flex:1; }
.kms-user-item { display:grid; grid-template-columns:auto 38px minmax(0,1fr); gap:10px; align-items:center; padding:11px 14px; border-bottom:1px solid #edf0f4; background:#fff; cursor:pointer; }
.kms-user-item input { width:17px; height:17px; }
.kms-user-item .kms-room-avatar { width:38px; height:38px; border-radius:50%; font-size:16px; }
.kms-user-copy { min-width:0; }
.kms-user-copy strong,.kms-user-copy small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.kms-user-copy small { margin-top:3px; color:#8a94a3; font-size:10px; }
.kms-manager-label { display:inline-block; margin-left:5px; padding:2px 5px; border-radius:7px; background:#e8f0ff; color:#2856a6; font-size:9px; }
.kms-chat { position:relative; min-height:0; flex:1; display:none; flex-direction:column; overflow:hidden; background:#eaf0f7; }
.kms-chat.open { display:flex; }
.kms-chat-head { flex:0 0 auto; display:flex; align-items:center; gap:9px; min-height:52px; padding:8px 11px; background:#213b63; color:#fff; }
.kms-chat-head strong { min-width:0; flex:1; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:14px; }
.kms-chat-back { display:inline-flex; align-items:center; gap:5px; width:auto; padding:0 9px; font-size:17px; }
.kms-chat-back-label { font-size:11px; font-weight:700; }
.kms-chat-members-toggle { display:inline-flex; align-items:center; justify-content:center; font-size:19px; }
.kms-chat-messages { min-height:0; flex:1; overflow-y:auto; overscroll-behavior-y:contain; -webkit-overflow-scrolling:touch; padding:14px 12px; }
body.kms-messenger-open { overscroll-behavior-y:none; }
.kms-chat-history { display:flex; flex-direction:column; align-items:center; gap:5px; margin:0 0 14px; color:#718096; font-size:10px; }
.kms-chat-history button { min-height:34px; padding:7px 14px; border:1px solid #cbd5e1; border-radius:18px; background:rgba(255,255,255,.92); color:#334155; font-family:inherit; font-size:11px; font-weight:700; line-height:1.2; cursor:pointer; box-shadow:0 1px 2px rgba(15,23,42,.06); }
.kms-chat-history button:hover { border-color:var(--kms-primary,#2563eb); color:var(--kms-primary,#2563eb); }
.kms-chat-history button:disabled { opacity:.65; cursor:wait; }
.kms-chat-history.is-start { flex-direction:row; justify-content:center; }
.kms-chat-date-separator { display:flex; align-items:center; gap:9px; margin:16px 0 10px; color:#64748b; font-size:10px; font-weight:700; text-align:center; }
.kms-chat-date-separator::before,.kms-chat-date-separator::after { content:""; height:1px; flex:1; background:rgba(100,116,139,.24); }
.kms-chat-date-separator span { flex:0 0 auto; padding:4px 9px; border-radius:12px; background:rgba(255,255,255,.72); }
.kms-chat-row { display:flex; align-items:flex-end; gap:5px; margin:8px 0; }
.kms-chat-row.mine { justify-content:flex-end; }
.kms-chat-row.other { justify-content:flex-start; }
.kms-chat-author { margin:0 0 4px 3px; color:#64748b; font-size:10px; }
.kms-chat-bubble { max-width:76%; padding:9px 11px; border-radius:13px; background:#fff; box-shadow:0 1px 1px rgba(15,23,42,.08); white-space:pre-wrap; overflow-wrap:anywhere; font-size:13px; line-height:1.45; }
.kms-chat-row.mine .kms-chat-bubble { border-bottom-right-radius:4px; background:#fee500; }
.kms-chat-row.other .kms-chat-bubble { border-bottom-left-radius:4px; }
.kms-chat-message-meta { display:grid; gap:2px; color:#7d8895; font-size:9px; }
.kms-chat-row.mine .kms-chat-message-meta { text-align:right; }
.kms-chat-unread { color:#c28300; font-weight:700; }
.kms-chat-compose { flex:0 0 auto; display:flex; align-items:flex-end; gap:8px; padding:10px; border-top:1px solid #dce3eb; background:#fff; }
.kms-chat-compose textarea { min-height:40px; max-height:90px; flex:1; resize:none; padding:9px 10px; border:1px solid #ccd5df; border-radius:9px; font:inherit; font-size:13px; line-height:1.4; }
.kms-chat-compose > button { flex:0 0 auto; align-self:stretch; width:64px; min-height:40px; border:0; border-radius:9px; background:var(--kms-primary,#2563eb); color:#fff; font-weight:700; cursor:pointer; }
/* 첨부(+) 버튼과 이미지·파일 선택 메뉴 */
.kms-chat-attach { position:relative; flex:0 0 auto; align-self:center; }
.kms-chat-attach-btn { width:36px; height:36px; border:1px solid #ccd5df; border-radius:50%; background:#f4f7fb; color:#334155; font-size:20px; line-height:1; cursor:pointer; }
.kms-chat-attach-btn:hover { background:#e8f0ff; }
.kms-chat-attach-menu { position:absolute; bottom:44px; left:0; z-index:5; background:#fff; border:1px solid #dce3eb; border-radius:10px; box-shadow:0 6px 18px rgba(15,23,42,.16); padding:6px; display:flex; flex-direction:column; gap:2px; min-width:130px; }
.kms-chat-attach-menu button { border:0; background:none; text-align:left; padding:8px 10px; border-radius:7px; cursor:pointer; font-size:13px; color:#1e2532; }
.kms-chat-attach-menu button:hover { background:#f1f5f9; }
/* 이미지·파일 메시지 버블 */
.kms-chat-image-wrap { position:relative; display:inline-block; max-width:76%; }
.kms-chat-image { display:block; max-width:100%; padding:0; border:0; border-radius:12px; background:transparent; cursor:zoom-in; }
.kms-chat-image img { max-width:100%; max-height:260px; border-radius:12px; display:block; box-shadow:0 1px 2px rgba(15,23,42,.12); }
.kms-chat-row.mine .kms-chat-image-wrap { align-self:flex-end; }
.kms-chat-image:focus-visible { outline:3px solid var(--kms-primary,#2563eb); outline-offset:3px; }
.kms-chat-image-download { position:absolute; right:7px; bottom:7px; padding:5px 8px; border-radius:7px; background:rgba(15,23,42,.76); color:#fff; font-size:10px; text-decoration:none; }
.kms-chat-preview[hidden] { display:none; }
.kms-chat-preview { position:fixed; inset:0; z-index:3000; display:flex; align-items:center; justify-content:center; padding:20px; }
.kms-chat-preview-backdrop { position:absolute; inset:0; width:100%; height:100%; padding:0; border:0; background:rgba(15,23,42,.82); cursor:zoom-out; }
.kms-chat-preview-dialog { position:relative; z-index:1; display:flex; flex-direction:column; width:min(1100px,96vw); height:min(820px,94vh); overflow:hidden; border-radius:14px; background:#111827; box-shadow:0 24px 70px rgba(0,0,0,.42); }
.kms-chat-preview-dialog>header { flex:0 0 auto; display:flex; align-items:center; gap:10px; min-height:50px; padding:8px 10px 8px 16px; background:#fff; color:#1f2937; }
.kms-chat-preview-dialog>header strong { min-width:0; flex:1; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:14px; }
.kms-chat-preview-dialog>header button { width:36px; height:36px; padding:0; border:0; border-radius:8px; background:#eef2f7; color:#334155; font-size:24px; cursor:pointer; }
.kms-chat-preview-download { padding:7px 10px; border-radius:7px; background:var(--kms-primary,#2563eb); color:#fff; font-size:12px; text-decoration:none; }
.kms-chat-preview-body { min-height:0; flex:1; display:flex; align-items:center; justify-content:center; overflow:auto; padding:12px; }
.kms-chat-preview-body img { display:block; max-width:100%; max-height:100%; object-fit:contain; }
.kms-chat-preview-body iframe { width:100%; height:100%; border:0; border-radius:6px; background:#fff; }
.kms-chat-preview-body pre { align-self:stretch; width:100%; margin:0; overflow:auto; padding:18px; border-radius:6px; background:#fff; color:#111827; white-space:pre-wrap; overflow-wrap:anywhere; font:13px/1.6 ui-monospace,SFMono-Regular,Consolas,monospace; }
.kms-chat-preview-body p { color:#fff; }
body.kms-chat-preview-open { overflow:hidden; }
.kms-chat-file { display:flex; align-items:center; gap:9px; max-width:76%; padding:9px 12px; border-radius:13px; background:#fff; box-shadow:0 1px 1px rgba(15,23,42,.08); text-decoration:none; color:#1e2532; }
.kms-chat-row.mine .kms-chat-file { background:#fee500; }
.kms-chat-file-ico { font-size:20px; }
.kms-chat-file-info { display:flex; flex-direction:column; min-width:0; }
.kms-chat-file-info b { font-size:13px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.kms-chat-file-info small { color:#64748b; font-size:11px; }
.kms-chat-file-actions { display:flex; flex:0 0 auto; gap:5px; }
.kms-chat-file-actions button,.kms-chat-file-actions a { padding:5px 7px; border:0; border-radius:6px; background:#e8eef7; color:#334155; font:inherit; font-size:10px; text-decoration:none; cursor:pointer; }
/* 드래그&드롭 표시 */
.kms-chat-messages.kms-chat-drop { outline:2px dashed var(--kms-primary,#2563eb); outline-offset:-6px; background:#f0f6ff; }
.kms-chat-members-backdrop { position:absolute; inset:0; z-index:4; width:100%; height:100%; padding:0; border:0; background:rgba(15,23,42,.24); cursor:pointer; }
.kms-chat-members-backdrop[hidden] { display:none; }
.kms-chat-members { position:absolute; top:0; right:0; bottom:0; z-index:5; display:flex; flex-direction:column; width:min(310px,88%); overflow:hidden; background:#fff; box-shadow:-12px 0 30px rgba(15,23,42,.2); transform:translateX(105%); visibility:hidden; transition:transform .2s ease,visibility .2s; }
.kms-chat.members-open .kms-chat-members { transform:translateX(0); visibility:visible; }
.kms-chat-members > header { flex:0 0 auto; display:flex; align-items:center; gap:8px; min-height:52px; padding:8px 12px; background:#213b63; color:#fff; }
.kms-chat-members > header strong { flex:1; font-size:14px; }
.kms-chat-members > header button { width:34px; height:34px; padding:0; border:0; border-radius:8px; background:rgba(255,255,255,.1); color:#fff; font-size:21px; cursor:pointer; }
.kms-chat-members-content { min-height:0; flex:1; display:flex; flex-direction:column; overflow-y:auto; background:#f7f9fc; }
.kms-chat-member-list,.kms-chat-invite-list { min-height:0; flex:1; overflow-y:auto; }
.kms-chat-member-item,.kms-chat-invite-list label { display:grid; grid-template-columns:38px minmax(0,1fr); gap:10px; align-items:center; padding:11px 13px; border-bottom:1px solid #edf0f4; background:#fff; }
.kms-chat-member-avatar { display:flex; align-items:center; justify-content:center; width:38px; height:38px; border-radius:50%; background:#e8effb; color:#2856a6; font-size:13px; font-weight:800; }
.kms-chat-member-item > span:last-child,.kms-chat-invite-list label > span { min-width:0; }
.kms-chat-member-item strong,.kms-chat-member-item small,.kms-chat-invite-list strong,.kms-chat-invite-list small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.kms-chat-member-item strong,.kms-chat-invite-list strong { font-size:12px; }
.kms-chat-member-item small,.kms-chat-invite-list small { margin-top:3px; color:#8a94a3; font-size:10px; }
.kms-chat-member-item em { display:inline-block; margin-left:5px; padding:1px 5px; border-radius:7px; background:#e8f0ff; color:#2856a6; font-size:9px; font-style:normal; }
.kms-chat-member-actions { flex:0 0 auto; padding:11px 12px max(11px,env(safe-area-inset-bottom)); border-top:1px solid #e5e9ef; background:#fff; }
.kms-chat-member-actions .kms-btn { width:100%; }
.kms-chat-member-actions.is-split { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:8px; }
.kms-chat-members-empty { margin:14px; padding:22px 10px; border:1px dashed #cbd5e1; border-radius:10px; background:#fff; color:#7b8794; text-align:center; font-size:12px; }
.kms-chat-invite-head { flex:0 0 auto; display:flex; align-items:center; gap:9px; padding:10px 12px; border-bottom:1px solid #e5e9ef; background:#fff; }
.kms-chat-invite-head button { padding:6px 8px; border:0; border-radius:7px; background:#eef2f7; color:#334155; cursor:pointer; }
.kms-chat-invite-head strong { font-size:13px; }
.kms-chat-invite-search { flex:0 0 auto; padding:10px 12px; background:#fff; }
.kms-chat-invite-search input { width:100%; height:36px; padding:0 10px; border:1px solid #d0d7e2; border-radius:8px; font:inherit; font-size:12px; }
.kms-chat-invite-list label { grid-template-columns:auto minmax(0,1fr); cursor:pointer; }
.kms-chat-invite-list input { width:17px; height:17px; }
.kms-chat-invite-list label[hidden] { display:none; }

@media (max-width:768px) {
    .kms-messenger-launch { right:15px; bottom:15px; width:54px; height:54px; }
    .kms-messenger-panel { right:0; bottom:0; width:100vw; height:100dvh; max-height:none; border:0; border-radius:0; }
    body.kms-messenger-open { overflow:hidden; }
    body.kms-messenger-open .kms-messenger-launch,
    body.kms-messenger-open .kms-mytodo-launch { display:none; }
    .kms-messenger-head { padding-top:max(12px,env(safe-area-inset-top)); }
    .kms-chat-head { padding-top:max(8px,env(safe-area-inset-top)); }
    .kms-chat-members { width:min(330px,90vw); }
    .kms-chat-compose { padding-bottom:max(10px,env(safe-area-inset-bottom)); }
    .kms-chat-compose > button { min-height:44px; }
}

/* =====================================================================
 * 나의할일 뱃지 : Microsoft To Do 풍 플로팅 위젯 + 팝업
 *  - 원형 체크박스 / 카드형 행 / 날짜 칩 / 낙관적 UI / 드래그 순서변경
 * ===================================================================== */
.kms-mytodo-launch { position:fixed; right:92px; bottom:22px; z-index:1100; display:flex; align-items:center; justify-content:center; width:58px; height:58px; padding:0; border:0; border-radius:50%; background:linear-gradient(145deg,#0f9c8e,#0d7d70); color:#fff; box-shadow:0 10px 28px rgba(13,116,104,.35); cursor:pointer; transition:transform .18s ease,box-shadow .18s ease; }
.kms-mytodo-launch:hover { transform:translateY(-2px); box-shadow:0 14px 34px rgba(13,116,104,.45); }
.kms-mytodo-launch:active { transform:scale(.95); }
.kms-mytodo-launch svg { width:27px; height:27px; fill:currentColor; }

.kms-mytodo-panel { position:fixed; right:92px; bottom:92px; z-index:1089; display:none; flex-direction:column; width:min(430px,calc(100vw - 28px)); height:min(680px,calc(100vh - 125px)); overflow:hidden; border:1px solid #dbe2ea; border-radius:18px; background:#fff; color:#1f2937; box-shadow:0 24px 60px rgba(15,23,42,.26); transform-origin:bottom right; }
.kms-mytodo-panel.open { display:flex; animation:kmsMyTodoPop .24s cubic-bezier(.2,.85,.3,1); }
@keyframes kmsMyTodoPop { from { opacity:0; transform:translateY(14px) scale(.96); } to { opacity:1; transform:none; } }

.kms-mytodo-head { flex:0 0 auto; display:flex; align-items:center; gap:9px; min-height:60px; padding:12px 14px; background:linear-gradient(135deg,#115e59,#0d9488); color:#fff; }
.kms-mytodo-head strong { flex:0 0 auto; font-size:16px; letter-spacing:.2px; }
.kms-mytodo-head-actions { min-width:0; flex:1; display:flex; align-items:center; justify-content:flex-end; gap:6px; }
.kms-mytodo-head-actions button { height:30px; padding:0 12px; border:0; border-radius:15px; background:rgba(255,255,255,.16); color:#fff; font:inherit; font-size:12px; font-weight:600; cursor:pointer; transition:background .15s ease; }
.kms-mytodo-head-actions button:hover { background:rgba(255,255,255,.3); }
.kms-mytodo-head-divider { display:none; }
.kms-mytodo-close { flex:0 0 auto; width:34px; height:34px; padding:0; border:0; border-radius:50%; background:rgba(255,255,255,.12); color:#fff; font-size:22px; line-height:1; cursor:pointer; transition:background .15s ease,transform .2s ease; }
.kms-mytodo-close:hover { background:rgba(255,255,255,.26); transform:rotate(90deg); }

.kms-mytodo-body { min-height:0; flex:1; overflow-y:auto; overscroll-behavior:contain; padding:10px 12px 18px; background:#f5f7f9; }
.kms-mytodo-empty { margin:26px 6px; padding:28px 14px; border:1px dashed #cdd6e0; border-radius:14px; background:#fff; color:#7b8794; text-align:center; font-size:13px; line-height:1.7; }

.kms-mytodo-group { margin-top:12px; padding:6px 8px 9px; border:1px solid #cfe3df; border-radius:14px; background:rgba(13,148,136,.045); }
.kms-mytodo-group-head { display:flex; align-items:center; gap:8px; min-height:34px; padding:5px 10px; border-radius:10px; background:rgba(13,148,136,.1); color:#0f5c54; }
.kms-mytodo-group-head .kms-mytodo-name { min-width:0; flex:1; overflow-wrap:anywhere; font-size:13px; font-weight:700; cursor:text; }
.kms-mytodo-add-sub { flex:0 0 auto; padding:3px 10px; border:0; border-radius:12px; background:transparent; color:#0d9488; font:inherit; font-size:12px; font-weight:600; cursor:pointer; transition:background .15s ease; }
.kms-mytodo-add-sub:hover { background:rgba(13,148,136,.14); }

.kms-mytodo-row { display:flex; align-items:flex-start; gap:10px; margin-top:8px; padding:11px 12px; border:1px solid #eaeef3; border-radius:12px; background:#fff; box-shadow:0 1px 2px rgba(15,23,42,.04); transition:box-shadow .16s ease,transform .16s ease,border-color .16s ease,opacity .2s ease; }
.kms-mytodo-row:hover { border-color:#d7dee7; box-shadow:0 4px 12px rgba(15,23,42,.08); }
.kms-mytodo-row.sub, .kms-mytodo-editor.sub { margin-left:0; }
/* 열릴 때만 순차 등장 애니메이션(중간 갱신에서는 즉시 반영) */
.kms-mytodo-panel.kms-anim .kms-mytodo-row { animation:kmsRowIn .28s ease both; }
.kms-mytodo-panel.kms-anim .kms-mytodo-row:nth-child(2) { animation-delay:.03s; }
.kms-mytodo-panel.kms-anim .kms-mytodo-row:nth-child(3) { animation-delay:.06s; }
.kms-mytodo-panel.kms-anim .kms-mytodo-row:nth-child(4) { animation-delay:.09s; }
.kms-mytodo-panel.kms-anim .kms-mytodo-row:nth-child(n+5) { animation-delay:.12s; }
@keyframes kmsRowIn { from { opacity:0; transform:translateY(8px); } to { opacity:1; transform:none; } }
.kms-mytodo-row.just-added { animation:kmsRowPop .3s cubic-bezier(.2,.85,.3,1) both; }
@keyframes kmsRowPop { from { opacity:0; transform:translateY(-6px) scale(.98); } to { opacity:1; transform:none; } }
.kms-mytodo-row.completing { opacity:0 !important; transform:translateX(16px); }

/* 원형 체크박스 (MS To Do 스타일) */
.kms-mytodo-row input[type="checkbox"] { flex:0 0 auto; -webkit-appearance:none; appearance:none; position:relative; width:21px; height:21px; margin:1px 0 0; border:2px solid #b9c2ce; border-radius:50%; background:#fff; cursor:pointer; transition:border-color .15s ease,background .15s ease; }
.kms-mytodo-row input[type="checkbox"]:hover { border-color:#0d9488; }
.kms-mytodo-row input[type="checkbox"]::after { content:""; position:absolute; left:6px; top:2px; width:5px; height:10px; border:solid #fff; border-width:0 2px 2px 0; transform:rotate(45deg) scale(0); opacity:0; transition:transform .16s ease,opacity .16s ease; }
.kms-mytodo-row input[type="checkbox"]:checked { border-color:#0d9488; background:#0d9488; }
.kms-mytodo-row input[type="checkbox"]:checked::after { transform:rotate(45deg) scale(1); opacity:1; }

.kms-mytodo-text { min-width:0; flex:1; font-size:13.5px; cursor:text; }
.kms-mytodo-text b { display:block; font-weight:600; line-height:1.45; white-space:pre-wrap; overflow-wrap:anywhere; }
.kms-mytodo-text small { display:block; margin-top:3px; color:#8a94a2; font-size:12px; white-space:pre-wrap; overflow-wrap:anywhere; }

.kms-mytodo-due { flex:0 0 auto; display:inline-flex; align-items:center; gap:3px; margin-top:1px; padding:2px 8px; border-radius:11px; background:#eef1f5; color:#5b6675; font-size:11px; font-weight:600; white-space:nowrap; }
.kms-mytodo-due svg { width:11px; height:11px; fill:currentColor; opacity:.85; }
.kms-mytodo-due.overdue { background:#fdeaea; color:#dc2626; }

/* 드래그 핸들 : hover 시 노출(모바일은 항상) */
.kms-mytodo-drag { flex:0 0 auto; align-self:center; display:inline-flex; width:16px; margin:0 -3px 0 -5px; color:#c2cad4; cursor:grab; touch-action:none; visibility:hidden; opacity:0; transition:opacity .15s ease,color .15s ease; }
.kms-mytodo-drag svg { width:16px; height:16px; fill:currentColor; }
.kms-mytodo-row:hover .kms-mytodo-drag, .kms-mytodo-group-head:hover .kms-mytodo-drag { visibility:visible; opacity:1; }
.kms-mytodo-drag:active { cursor:grabbing; color:#0d9488; }

/* 삭제 컨트롤 : hover 시 노출 */
.kms-mytodo-ctl { display:inline-flex; flex:0 0 auto; gap:3px; margin-top:1px; visibility:hidden; opacity:0; pointer-events:none; transition:opacity .15s ease; }
.kms-mytodo-row:hover .kms-mytodo-ctl, .kms-mytodo-row:focus-within .kms-mytodo-ctl,
.kms-mytodo-group-head:hover .kms-mytodo-ctl, .kms-mytodo-group-head:focus-within .kms-mytodo-ctl { visibility:visible; opacity:1; pointer-events:auto; }
.kms-mytodo-ctl button { width:24px; height:24px; padding:0; border:1px solid #dce2ea; border-radius:8px; background:#fff; color:#5b6675; font-size:12px; line-height:1; cursor:pointer; transition:border-color .15s ease,color .15s ease,background .15s ease; }
.kms-mytodo-ctl button:hover { border-color:#e11d48; color:#e11d48; background:rgba(225,29,72,.07); }

/* 드래그 중 */
.kms-mytodo-row.drag-source, .kms-mytodo-group.drag-source { opacity:.32; }
.kms-mytodo-drag-ghost { position:fixed; z-index:2000; margin:0 !important; pointer-events:none; box-shadow:0 16px 38px rgba(15,23,42,.3); transform:rotate(1.5deg); }
body.kms-mytodo-dragging { cursor:grabbing; user-select:none; }

/* 편집기 : 부드럽게 펼쳐짐 */
.kms-mytodo-editor { display:grid; gap:8px; margin-top:8px; padding:11px 12px; border:1px solid #b7ddd8; border-radius:12px; background:#fff; box-shadow:0 8px 22px rgba(13,148,136,.14); transform-origin:top center; animation:kmsEditorIn .2s cubic-bezier(.2,.85,.3,1) both; }
@keyframes kmsEditorIn { from { opacity:0; transform:translateY(-6px) scaleY(.94); } to { opacity:1; transform:none; } }
.kms-mytodo-editor textarea { min-height:82px; resize:vertical; padding:9px 10px; border:1px solid #d5dbe3; border-radius:9px; font:inherit; font-size:13.5px; line-height:1.45; outline:none; transition:border-color .15s ease,box-shadow .15s ease; }
.kms-mytodo-editor textarea:focus { border-color:#0d9488; box-shadow:0 0 0 3px rgba(13,148,136,.14); }
.kms-mytodo-editor input[type="text"] { height:34px; padding:0 10px; border:1px solid #d5dbe3; border-radius:9px; font:inherit; font-size:13.5px; outline:none; transition:border-color .15s ease,box-shadow .15s ease; }
.kms-mytodo-editor input[type="text"]:focus { border-color:#0d9488; box-shadow:0 0 0 3px rgba(13,148,136,.14); }
.kms-mytodo-editor-tools { display:flex; align-items:center; gap:8px; }
.kms-mytodo-editor-spacer { flex:1; }
/* 날짜 : 네이티브 date 입력을 알약(pill) 모양으로 스타일링(자체 달력 아이콘 사용, 오버레이 제거) */
.kms-mytodo-datewrap { display:inline-flex; min-width:0; }
.kms-mytodo-datefield { box-sizing:border-box; height:30px; padding:0 8px 0 12px; border:1px solid #d5dbe3; border-radius:15px; background:#f5f7f9; color:#41505f; font:inherit; font-size:12.5px; font-weight:600; line-height:normal; white-space:nowrap; cursor:pointer; transition:border-color .15s ease,background .15s ease,color .15s ease; }
.kms-mytodo-datefield:hover { border-color:#0d9488; color:#0d7d70; background:rgba(13,148,136,.08); }
.kms-mytodo-datefield:focus { outline:none; border-color:#0d9488; box-shadow:0 0 0 3px rgba(13,148,136,.14); }
.kms-mytodo-datefield::-webkit-datetime-edit { padding:0; }
.kms-mytodo-datefield::-webkit-calendar-picker-indicator { margin-left:6px; padding:2px; opacity:.65; cursor:pointer; transition:opacity .15s ease; }
.kms-mytodo-datefield:hover::-webkit-calendar-picker-indicator { opacity:1; }
.kms-mytodo-editor-save { height:30px; padding:0 16px; border:0; border-radius:15px; background:#0d9488; color:#fff; font:inherit; font-size:12.5px; font-weight:700; cursor:pointer; transition:background .15s ease; }
.kms-mytodo-editor-save:hover { background:#0b7d71; }
.kms-mytodo-editor-hint { color:#98a2b0; font-size:11px; }

/* 완료됨 */
.kms-mytodo-done { margin-top:18px; }
.kms-mytodo-done summary { display:flex; align-items:center; gap:6px; padding:8px 6px; color:#5b6675; font-size:12.5px; font-weight:700; cursor:pointer; list-style:none; border-radius:8px; transition:background .15s ease; }
.kms-mytodo-done summary::-webkit-details-marker { display:none; }
.kms-mytodo-done summary::before { content:"▸"; display:inline-block; color:#98a2b0; transition:transform .18s ease; }
.kms-mytodo-done[open] summary::before { transform:rotate(90deg); }
.kms-mytodo-done summary:hover { background:#eef1f5; }
.kms-mytodo-done .kms-mytodo-row { background:#f3f5f8; box-shadow:none; }
.kms-mytodo-done .kms-mytodo-text b { color:#9aa4b1; text-decoration:line-through; }
/* 완료됨 안에서도 그룹은 활성처럼 박스로(단, 완료 상태라 톤을 낮춰 개별 낱줄과 구분) */
.kms-mytodo-done .kms-mytodo-group { margin-top:10px; border-color:#e2e7ee; background:#f2f5f8; }
.kms-mytodo-done .kms-mytodo-group-head { min-height:30px; background:#e7ecf1; color:#6b7684; }
.kms-mytodo-done .kms-mytodo-group-head .kms-mytodo-name { cursor:default; }
.kms-mytodo-done-tally { flex:0 0 auto; padding:1px 8px; border-radius:10px; background:#fff; color:#8a94a2; font-size:11px; font-weight:700; }
.kms-mytodo-restore { display:none; flex:0 0 auto; height:26px; padding:0 10px; border:1px solid #10b981; border-radius:13px; background:#ecfdf5; color:#047857; font-size:11px; font-weight:600; cursor:pointer; }
.kms-mytodo-row.restore-armed .kms-mytodo-restore { display:inline-block; }

@media (max-width:768px) {
    .kms-mytodo-launch { right:81px; bottom:15px; width:54px; height:54px; }
    .kms-mytodo-panel { right:0; bottom:0; width:100vw; height:100dvh; max-height:none; border:0; border-radius:0; }
    .kms-mytodo-panel.open { animation:kmsMyTodoSlide .26s cubic-bezier(.2,.85,.3,1); }
    @keyframes kmsMyTodoSlide { from { transform:translateY(100%); } to { transform:none; } }
    body.kms-mytodo-open { overflow:hidden; }
    body.kms-mytodo-open .kms-mytodo-launch, body.kms-mytodo-open .kms-messenger-launch { display:none; }
    .kms-mytodo-head { padding-top:max(12px,env(safe-area-inset-top)); }
    .kms-mytodo-drag, .kms-mytodo-ctl { visibility:visible; opacity:1; pointer-events:auto; }
}

.kms-notification-list { display: grid; gap: 10px; }
.kms-notification-item { width: 100%; display: grid; gap: 5px; text-align: left; padding: 14px; border: 1px solid var(--kms-border, #dbe1e8); border-radius: 10px; background: var(--kms-card-bg, #fff); color: inherit; cursor: pointer; }
.kms-notification-item.unread { border-left: 4px solid var(--kms-primary, #2563eb); background: var(--kms-primary-soft, #eff6ff); }
.kms-notification-item span, .kms-notification-item small { color: var(--kms-muted, #64748b); }
.kms-answer-list { display: grid; gap: 12px; margin: 20px 0; }
.kms-answer-list article { padding: 16px; border-left: 4px solid var(--kms-primary, #2563eb); background: var(--kms-primary-soft, #eff6ff); border-radius: 8px; }

/* 빈 목록/그리드 공통 표기 (업무 화면 레이아웃은 preview.css + project-workspace.css 담당) */
.kms-empty { min-height:110px; border:1px dashed #d6dee8; border-radius:8px; background:#fafbfd; color:#8a96a5; font-size:13px; }
.kms-empty:not(td):not(th) { display:flex; align-items:center; justify-content:center; }
td.kms-empty,
th.kms-empty { display:table-cell; height:110px; min-height:0; vertical-align:middle; }
.kms-table-scroll { overflow-x:auto; }

/* 공통 화면 전환 효과: layout.js가 클래스와 지연값을 적용한다. */
@keyframes kms-content-enter {
    from { opacity: 0; transform: translateY(8px); }
    to { opacity: 1; transform: translateY(0); }
}
.kms-animate-in { animation: kms-content-enter .28s ease-out both; animation-delay: var(--kms-animation-delay, 0ms); }
@media (prefers-reduced-motion: reduce) {
    .kms-animate-in { animation: none; }
}

/* 프로젝트별 레이아웃 마스터가 덮어쓰는 공통 CSS 변수 */
body.kms-project-page {
    --kms-page-bg: #f5f6f8;
    --kms-top-bg: #1f2d3d;
    --kms-top-text: #ffffff;
    --kms-menu-bg: #1f2d3d;
    --kms-menu-text: #d8e1eb;
    --kms-menu-active-bg: #2c3e50;
    --kms-menu-active-text: #ffffff;
    --kms-content-bg: #f4f7fb;
    --kms-card-bg: #ffffff;
    --kms-primary: #2563eb;
    --kms-bg-image: none;
    --kms-bg-size: cover;
    background-color: var(--kms-page-bg);
    background-image: var(--kms-bg-image);
    background-size: var(--kms-bg-size);
    background-position: center top;
    background-repeat: no-repeat;
    background-attachment: fixed;
}

/* 레이아웃 설정: 갤러리, 내장 배경 선택, 실시간 미리보기 */
.kms-layout-gallery-card { overflow:hidden; }
.kms-layout-gallery-card .kms-grid-head > div { display:grid; gap:3px; }
.kms-layout-gallery-card .kms-grid-head small { color:#64748b; font-size:12px; font-weight:400; }
.kms-layout-list { display:grid; grid-template-columns:repeat(auto-fill,minmax(310px,1fr)); gap:16px; padding:16px; }
.kms-layout-empty { grid-column:1/-1; display:grid; min-height:180px; place-items:center; color:#64748b; text-align:center; }
.kms-layout-item { display:flex; min-width:0; flex-direction:column; overflow:hidden; border:1px solid #dfe5ec; border-radius:12px; background:#fff; box-shadow:0 5px 18px rgba(15,23,42,.05); transition:border-color .16s ease,box-shadow .16s ease,transform .16s ease; }
.kms-layout-item.is-default { border-color:#9db9f1; box-shadow:0 5px 18px rgba(37,99,235,.10); }
.kms-layout-item:hover { border-color:#b8c8dc; box-shadow:0 10px 26px rgba(15,23,42,.10); transform:translateY(-2px); }
.kms-layout-thumbnail { position:relative; aspect-ratio:16/9; overflow:hidden; border-bottom:1px solid #e2e8f0; background-position:center; }
.kms-layout-thumbnail::after { position:absolute; inset:0; background:linear-gradient(180deg,rgba(15,23,42,.04),rgba(15,23,42,.14)); content:""; pointer-events:none; }
.kms-layout-type { position:absolute; top:10px; right:10px; z-index:2; padding:4px 8px; border:1px solid rgba(255,255,255,.75); border-radius:999px; background:rgba(15,23,42,.72); color:#fff; font-size:11px; backdrop-filter:blur(5px); }
.kms-layout-mini-screen { position:absolute; left:50%; bottom:15px; z-index:1; width:70%; height:64%; overflow:hidden; border:1px solid rgba(255,255,255,.72); border-radius:7px; background:#fff; box-shadow:0 10px 28px rgba(15,23,42,.24); transform:translateX(-50%); }
.kms-layout-mini-top { height:22%; padding:5px 7px; font-size:8px; font-weight:700; }
.kms-layout-mini-body { display:grid; grid-template-columns:26% 1fr; height:78%; }
.kms-layout-mini-menu { padding:7px 5px; }
.kms-layout-mini-menu span { display:block; height:10px; border-radius:3px; }
.kms-layout-mini-content { padding:8px; }
.kms-layout-mini-content span { display:block; height:72%; border-top:3px solid; border-radius:4px; box-shadow:0 3px 8px rgba(15,23,42,.08); }
.kms-layout-info { display:grid; min-width:0; gap:8px; padding:14px 14px 8px; }
.kms-layout-item h2 { overflow:hidden; margin:0; color:#1e293b; font-size:15px; text-overflow:ellipsis; white-space:nowrap; }
.kms-layout-meta { display:flex; min-width:0; align-items:center; gap:5px; }
.kms-layout-color-chip { width:16px; height:16px; flex:0 0 16px; border:1px solid rgba(15,23,42,.16); border-radius:50%; background:var(--chip-color,#cbd5e1); }
.kms-layout-path { overflow:hidden; margin-left:3px; color:#64748b; font-size:11px; text-overflow:ellipsis; white-space:nowrap; }
.kms-layout-actions { display:flex; gap:6px; margin-top:auto; padding:8px 14px 14px; }
.kms-layout-actions .kms-btn { flex:1; justify-content:center; }
.kms-layout-protected { display:flex; min-height:34px; flex:1; align-items:center; justify-content:center; border:1px solid #c9d8f4; border-radius:6px; background:#eff4ff; color:#315ca8; font-size:12px; font-weight:700; }
.kms-layout-delete { color:#b42318; }

.kms-modal.kms-layout-modal { width:min(980px,100%); }
.kms-layout-modal .kms-modal-head > div { display:grid; gap:2px; }
.kms-layout-modal .kms-modal-head small { color:#64748b; font-size:11px; font-weight:400; }
.kms-layout-editor-shell { display:grid; grid-template-columns:minmax(0,1.35fr) minmax(300px,.85fr); gap:20px; padding:14px 0; }
.kms-layout-editor-fields { display:grid; gap:14px; }
.kms-layout-editor-section { display:grid; gap:9px; margin:0; padding:15px; border:1px solid #e2e8f0; border-radius:10px; background:#fff; }
.kms-layout-editor-section h2,.kms-layout-preview-panel h2 { margin:0; color:#1e293b; font-size:14px; }
.kms-layout-editor-section > label,.kms-layout-form-grid label { display:block; margin:0 0 5px; color:#475569; font-size:12px; font-weight:600; }
.kms-layout-editor-section > input[type=text] { width:100%; }
.kms-layout-section-head { display:flex; align-items:flex-start; justify-content:space-between; gap:10px; }
.kms-layout-section-head > div { display:grid; gap:4px; }
.kms-layout-section-head p { margin:0; color:#64748b; font-size:11px; line-height:1.45; }
.kms-required { color:#dc2626; font-size:11px; font-weight:500; }
.kms-layout-form-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px 14px; }
.kms-layout-form-grid .kms-span-all { grid-column:1/-1; }
.kms-layout-form-grid input[type=color] { width:100%; height:40px; padding:3px; border:1px solid #cfd6de; border-radius:6px; background:#fff; cursor:pointer; }
.kms-layout-background-options { margin-top:2px; }
.kms-layout-asset-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
.kms-layout-asset { display:grid; min-width:0; gap:6px; padding:5px; border:1px solid #dbe3ee; border-radius:8px; background:#fff; color:inherit; text-align:left; cursor:pointer; transition:border-color .15s ease,box-shadow .15s ease,transform .15s ease; }
.kms-layout-asset:hover { border-color:#94a3b8; transform:translateY(-1px); }
.kms-layout-asset:focus-visible { outline:2px solid #2563eb; outline-offset:2px; }
.kms-layout-asset.is-selected { border-color:var(--kms-primary,#2563eb); box-shadow:0 0 0 2px color-mix(in srgb,var(--kms-primary,#2563eb) 20%,transparent); }
.kms-layout-asset-image { display:grid; width:100%; aspect-ratio:16/9; overflow:hidden; place-items:center; border-radius:5px; background-color:#eef2f7; color:#64748b; font-size:11px; background-position:center; }
.kms-layout-asset-image.is-none { background-image:linear-gradient(135deg,#f8fafc 25%,#eef2f7 25%,#eef2f7 50%,#f8fafc 50%,#f8fafc 75%,#eef2f7 75%); background-size:14px 14px!important; }
.kms-layout-asset-text { display:grid; min-width:0; gap:1px; padding:0 2px 2px; }
.kms-layout-asset-text strong,.kms-layout-asset-text small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.kms-layout-asset-text strong { color:#334155; font-size:11px; }
.kms-layout-asset-text small { color:#64748b; font-size:10px; }

.kms-layout-preview-panel { position:sticky; top:0; align-self:start; padding:15px; border:1px solid #dbe3ee; border-radius:10px; background:#f8fafc; }
.kms-layout-preview { overflow:hidden; min-height:340px; margin:12px 0 0; border:1px solid #cbd5e1; border-radius:10px; background:#f5f6f8 center/cover no-repeat; box-shadow:0 8px 24px rgba(15,23,42,.11); }
.kms-layout-preview-top { display:flex; min-height:48px; align-items:center; justify-content:space-between; gap:8px; padding:10px 12px; background:#1f2d3d; color:#fff; font-size:10px; }
.kms-layout-preview-top strong { font-size:11px; }.kms-layout-preview-top span { opacity:.78; }
.kms-layout-preview-body { display:grid; grid-template-columns:92px 1fr; min-height:290px; }
.kms-layout-preview-menu { padding:15px 8px; background:#1f2d3d; color:#d8e1eb; font-size:10px; }
.kms-layout-preview-menu strong { display:block; margin-bottom:14px; font-size:10px; }
.kms-layout-preview-menu span,.kms-layout-preview-menu em { display:block; margin-top:7px; padding:7px 6px; border-radius:4px; font-style:normal; }
.kms-layout-preview-menu span { background:#2c3e50; color:#fff; }
.kms-layout-preview-menu em { opacity:.8; }
.kms-layout-preview-content { display:grid; grid-template-columns:1fr 1fr; align-content:start; gap:9px; padding:14px; background:#f4f7fb; }
.kms-layout-preview-heading { grid-column:1/-1; margin-bottom:1px; color:#334155; font-size:12px; font-weight:700; }
.kms-layout-preview-card { min-height:106px; padding:11px; border-top:3px solid #2563eb; border-radius:7px; background:#fff; box-shadow:0 5px 14px rgba(15,23,42,.08); }
.kms-layout-preview-card strong { display:block; margin-bottom:12px; color:#334155; font-size:10px; }
.kms-layout-preview-card i { display:block; height:6px; margin-top:7px; border-radius:999px; background:#dbeafe; }
.kms-layout-preview-card i:nth-of-type(2) { width:78%; }.kms-layout-preview-card i:nth-of-type(3) { width:58%; }
.kms-layout-preview-card-small { min-height:82px; }
.kms-layout-preview-note { margin:10px 0 0; color:#64748b; font-size:10px; line-height:1.5; }

@media (max-width:900px) {
    .kms-layout-editor-shell { grid-template-columns:1fr; }
    .kms-layout-preview-panel { position:static; }
}
@media (max-width:640px) {
    .kms-layout-list { grid-template-columns:1fr; padding:12px; }
    .kms-layout-gallery-card .kms-grid-head small { display:none; }
    .kms-layout-asset-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .kms-layout-form-grid { grid-template-columns:1fr; }
    .kms-layout-preview-body { grid-template-columns:78px 1fr; }
    .kms-layout-preview-content { grid-template-columns:1fr; }
    .kms-layout-preview-card-small { display:none; }
}

/* 공통 게시판 및 자체 텍스트 에디터 */
.kms-board-actions{display:flex;justify-content:flex-end;gap:8px;margin-bottom:12px}.kms-editor{border:1px solid #cfd6de;border-radius:7px;overflow:hidden}.kms-editor-toolbar{display:flex;gap:5px;padding:8px;background:#f4f6f9;border-bottom:1px solid #dfe4ea}.kms-editor-toolbar button{min-width:32px;height:30px;border:1px solid #cbd3dc;border-radius:4px;background:#fff;cursor:pointer}.kms-editor textarea{display:block;width:100%;min-height:300px;padding:14px;border:0;resize:vertical;font:14px/1.7 inherit}.kms-board-form>label{display:block;margin:13px 0 5px;color:#4f5d6b;font-size:13px}.kms-board-form>input[type=text]{width:100%;height:40px;padding:0 10px;border:1px solid #cfd6de;border-radius:5px}.kms-file-policy-info{padding:10px 12px;border-radius:6px;background:#f0f6fc;color:#4a6076;font-size:12px}.kms-board-content{min-height:220px;line-height:1.8;overflow-wrap:anywhere}.kms-board-content blockquote{margin:12px 0;padding:10px 14px;border-left:4px solid var(--kms-primary,#2563eb);background:#f5f7fa}.kms-attachment-list{margin-top:20px;padding:14px;border:1px solid #dfe4ea;border-radius:7px}.kms-attachment-list a{display:block;margin:6px 0;color:#2869a5}


.kms-toolbar { display: flex; gap: 8px; margin-bottom: 12px; }
.kms-inline-field { display: flex; align-items: center; gap: 8px; }
.kms-inline-field input { flex: 1; }
.kms-membership-end-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); display: grid; }
.kms-project-checks {
    display: grid; grid-template-columns: 1fr 1fr; gap: 7px; max-height: 150px;
    padding: 10px; overflow-y: auto; border: 1px solid #cfd6de; border-radius: 5px; background: #fafbfc;
}
.kms-project-checks label { display: flex !important; align-items: center; gap: 6px; margin: 0 !important; }
.kms-project-assignment { display: grid; grid-template-columns: minmax(130px, 1fr) minmax(130px, 1fr); gap: 8px; align-items: center; }
.kms-project-assignment .project-nickname { width: 100%; min-width: 0; }
.kms-status { display: inline-block; padding: 2px 7px; border-radius: 12px; font-size: 12px; }
.kms-status-01 { color: #237b3b; background: #e7f6eb; }
.kms-status-02 { color: #6b7280; background: #eef0f3; }
.kms-status-03 { color: #b52d2d; background: #fdeaea; }

/* 표·버튼·모달 골격은 preview.css(시안 공통)와 preview-app.css가 담당한다. */
.kms-project-manage-table .kms-project-row { cursor: pointer; }
.kms-project-manage-table .kms-project-row:focus { outline: 2px solid #4a90d9; outline-offset: -2px; background: #f3f8fd; }

/* ---------- 공통 비차단 알림 토스트 ---------- */
.kms-toast-region {
    position: fixed; right: 22px; bottom: 92px; z-index: 3300;
    display: flex; flex-direction: column; align-items: flex-end; gap: 10px;
    width: min(390px, calc(100vw - 32px)); pointer-events: none;
}
.kms-toast {
    display: grid; grid-template-columns: 34px minmax(0, 1fr) 30px; gap: 10px; align-items: start;
    box-sizing: border-box; width: 100%; padding: 13px 12px;
    border: 1px solid #dce3ec; border-left: 4px solid #3b82f6; border-radius: 12px;
    background: #fff; color: #1f2937; box-shadow: 0 16px 40px rgba(15, 23, 42, .2);
    opacity: 0; pointer-events: auto; transform: translateY(14px);
    transition: opacity .2s ease, transform .2s ease;
}
.kms-toast.is-visible { opacity: 1; transform: translateY(0); }
.kms-toast.is-leaving { opacity: 0; transform: translateY(8px); }
.kms-toast.is-success { border-left-color: #16a34a; }
.kms-toast.is-warning { border-left-color: #d97706; }
.kms-toast.is-error { border-left-color: #dc2626; }
.kms-toast.is-message { border-left-color: var(--kms-primary, #2563eb); }
.kms-toast-icon {
    display: inline-flex; align-items: center; justify-content: center;
    width: 30px; height: 30px; border-radius: 50%;
    background: #eff6ff; color: #2563eb; font-size: 15px; font-weight: 800;
}
.kms-toast.is-success .kms-toast-icon { background: #ecfdf3; color: #15803d; }
.kms-toast.is-warning .kms-toast-icon { background: #fff7ed; color: #b45309; }
.kms-toast.is-error .kms-toast-icon { background: #fef2f2; color: #b91c1c; }
.kms-toast.is-message .kms-toast-icon { background: #eef2ff; color: var(--kms-primary, #2563eb); }
.kms-toast-content { min-width: 0; line-height: 1.45; }
.kms-toast-title { display: block; margin: 0 0 3px; font-size: 13px; font-weight: 800; }
.kms-toast-message {
    display: block; color: #526071; font-size: 12px;
    white-space: pre-wrap; overflow-wrap: anywhere;
}
.kms-toast-close {
    display: inline-flex; align-items: center; justify-content: center;
    width: 28px; height: 28px; padding: 0; border: 0; border-radius: 7px;
    background: transparent; color: #7b8794; font: 20px/1 sans-serif; cursor: pointer;
}
.kms-toast-close:hover { background: #f1f5f9; color: #334155; }
.kms-toast-close:focus-visible { outline: 2px solid var(--kms-primary, #2563eb); outline-offset: 1px; }

/* 네이티브 앱은 화면 폭과 무관하게 상단 안전영역 아래에 표시한다. */
.kms-toast-region.is-app {
    top: calc(env(safe-area-inset-top, 0px) + 12px);
    right: 16px; bottom: auto;
}

/* 메신저가 열린 데스크톱에서는 입력창을 가리지 않도록 패널 왼쪽에 붙인다. */
@media (min-width: 900px) {
    body.kms-messenger-open .kms-toast-region:not(.is-app) {
        right: 470px; bottom: 22px;
    }
}
@media (min-width: 769px) and (max-width: 899px) {
    body.kms-messenger-open .kms-toast-region:not(.is-app) {
        top: 12px; right: 16px; bottom: auto;
    }
}

/* ---------- 삭제 등 명시적 동의가 필요한 공통 확인 레이어 ---------- */
.kms-notice-layer {
    display: none; position: fixed; inset: 0; z-index: 3100;
    align-items: center; justify-content: center; padding: 20px;
    background: rgba(0, 0, 0, .45);
}
.kms-notice-layer.open { display: flex; }
.kms-notice-box {
    width: 420px; max-width: 100%; background: #fff; border-radius: 10px;
    box-shadow: 0 12px 40px rgba(0,0,0,.3); overflow: hidden;
}
.kms-notice-title { padding: 15px 18px; border-bottom: 1px solid #eceff3; font-size: 16px; font-weight: 700; }
.kms-notice-message { padding: 22px 18px; line-height: 1.6; white-space: pre-wrap; overflow-wrap: anywhere; }
.kms-notice-actions { display: flex; justify-content: flex-end; gap: 8px; padding: 12px 18px; background: #fafbfc; }
/* 확인창(취소/확인 2버튼)은 notice 레이어보다 위에 뜬다 */
.kms-confirm-layer { z-index: 3200; }

@media (max-width: 768px) {
    .kms-toast-region,
    .kms-toast-region.is-app {
        top: calc(env(safe-area-inset-top, 0px) + 10px);
        right: 12px; bottom: auto; left: 12px; width: auto;
        align-items: stretch;
    }
    .kms-toast { transform: translateY(-12px); }
    .kms-toast.is-visible { transform: translateY(0); }
    .kms-toast.is-leaving { transform: translateY(-8px); }
}

@media (prefers-reduced-motion: reduce) {
    .kms-toast { transition: none; }
}

/* ---------- 오류조회 ---------- */
.kms-error-search { display: grid; grid-template-columns: repeat(4, minmax(150px, 1fr)) auto; gap: 12px; align-items: end; }
.kms-error-search label { display: flex; flex-direction: column; gap: 5px; color: #555; font-size: 12px; }
.kms-error-search input, .kms-error-search select {
    width: 100%; height: 36px; padding: 0 9px; border: 1px solid #cfd6de; border-radius: 5px;
    background: #fff; font: inherit;
}
.kms-error-search-actions { display: flex; gap: 6px; }
.kms-error-row { cursor: pointer; }
.kms-error-row[aria-expanded="true"] { background: #eef5fc; }
.kms-error-row:focus { outline: 2px solid #4a90d9; outline-offset: -2px; }
.kms-error-type { display: inline-block; padding: 3px 7px; color: #a93434; background: #fdeaea; border-radius: 12px; white-space: nowrap; }
.kms-error-class { display: block; margin-top: 5px; max-width: 210px; color: #737e89; overflow-wrap: anywhere; }
.kms-error-preview { min-width: 180px; max-width: 320px; overflow-wrap: anywhere; color: #59636f; }
.kms-error-detail-row:hover { background: transparent !important; }
.kms-error-detail-row > td { padding: 0 !important; background: #f8fafc; }
.kms-error-detail { padding: 20px; border-left: 4px solid #4a90d9; }
.kms-error-detail-head { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px; margin-bottom: 18px; }
.kms-error-detail-head span { color: #66717d; overflow-wrap: anywhere; }
.kms-error-section { margin-top: 16px; }
.kms-error-section h2 { margin: 0 0 8px; font-size: 14px; color: #3f4b58; }
.kms-error-section pre {
    margin: 0; padding: 12px; max-height: 260px; overflow: auto; border: 1px solid #dfe4ea;
    border-radius: 6px; background: #fff; white-space: pre-wrap; overflow-wrap: anywhere; font: 12px/1.55 Consolas, monospace;
}
.kms-stack-trace { color: #7c2d2d; }
.kms-json-tree { padding: 10px 12px; border: 1px solid #dfe4ea; border-radius: 6px; background: #fff; font: 13px/1.6 Consolas, monospace; }
.kms-json-tree details { margin-left: 14px; }
.kms-json-tree > details { margin-left: 0; }
.kms-json-tree summary { cursor: pointer; user-select: none; }
.kms-json-children { padding-left: 12px; border-left: 1px dashed #cfd6de; }
.kms-json-leaf, .kms-json-empty { padding-left: 18px; overflow-wrap: anywhere; }
.kms-json-key { color: #175a9c; font-weight: 600; }
.kms-json-type { color: #7a8490; }
.kms-json-string { color: #247238; }
.kms-json-number { color: #9a4c00; }
.kms-json-boolean, .kms-json-null { color: #7b3fb0; }


/* ---------- 로그인 화면 (사이드바 없는 단독 레이아웃) ---------- */
body.kms-login {
    display: flex; align-items: center; justify-content: center;
    min-height: 100vh; background: #1f2d3d; margin: 0;
    font-family: "Malgun Gothic", "맑은 고딕", system-ui, sans-serif;
}
.kms-login-box {
    width: 340px; max-width: 90vw;
    background: #fff; border-radius: 10px; padding: 32px 28px;
    box-shadow: 0 8px 30px rgba(0,0,0,.25);
}
.kms-login-box h1 { margin: 0 0 4px; font-size: 22px; text-align: center; }
.kms-login-box .sub { margin: 0 0 22px; text-align: center; color: #888; font-size: 13px; }
.kms-login-box label { display: block; margin: 12px 0 4px; font-size: 13px; color: #555; }
.kms-login-box input[type=text],
.kms-login-box input[type=password],
.kms-login-box input[type=email],
.kms-login-box input[type=tel],
.kms-login-box select {
    width: 100%; height: 38px; padding: 0 10px;
    border: 1px solid #cfd6de; border-radius: 5px; font-size: 14px;
    background: #fff;
}
.kms-login-box textarea {
    width: 100%; min-height: 96px; padding: 9px 10px; resize: vertical;
    border: 1px solid #cfd6de; border-radius: 5px; font: inherit; background: #fff;
}
.kms-login-box .remember { margin: 14px 0; font-size: 13px; color: #555; }
.kms-login-box .kms-btn-primary { width: 100%; height: 40px; font-size: 15px; margin-top: 6px; }
.kms-login-msg { margin-top: 12px; min-height: 18px; color: #d23; font-size: 13px; text-align: center; }
.kms-project-badge {
    width: fit-content; margin: 0 auto 10px; padding: 3px 9px; border-radius: 12px;
    background: #e8f1fb; color: #326da8; font-size: 12px; font-weight: 700;
}
.kms-check-label { display: inline !important; }
.kms-login-link { display: block; margin-top: 14px; color: #326da8; text-align: center; text-decoration: none; font-size: 13px; }
.kms-login-link:hover { text-decoration: underline; }
.kms-login-link-muted { margin-top: 8px; color: #7a8490; }
.kms-join-box { width: 420px; margin: 28px 0; }
.kms-join-box form > label { margin-top: 11px; }
.kms-join-submit { width: 100%; height: 40px; margin-top: 20px; }
.kms-form-error, .kms-form-info { padding: 11px 12px; border-radius: 6px; font-size: 13px; line-height: 1.5; }
.kms-form-error { margin-bottom: 12px; border: 1px solid #f0b7b7; background: #fff0f0; color: #b52d2d; }
.kms-form-info { margin: 12px 0; border: 1px solid #cdddeb; background: #f0f6fc; color: #45596e; }
.kms-project-home { text-align: center; }
.kms-project-home .kms-btn { width: 100%; height: 40px; }
.kms-project-description { min-height: 24px; color: #66717d; line-height: 1.6; }
.kms-selected-project { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 16px; padding: 12px; border: 1px solid #dbe4ee; border-radius: 7px; background: #f7faff; }
.kms-policy-badge { flex: 0 0 auto; padding: 3px 8px; border-radius: 12px; color: #8a5515; background: #fff1d6; font-size: 12px; }
.kms-policy-badge.immediate { color: #237b3b; background: #e7f6eb; }
.kms-policy-description { margin: 8px 0 14px; color: #66717d; font-size: 13px; line-height: 1.5; }
.kms-project-select-box { width: 460px; }
.kms-project-choice-list { display: grid; gap: 9px; }
.kms-project-choice-list a { display: flex; flex-direction: column; gap: 4px; padding: 13px 14px; border: 1px solid #dbe4ee; border-radius: 7px; color: #25384b; text-decoration: none; }
.kms-project-choice-list a:hover { border-color: #4a90d9; background: #f4f8fd; }
.kms-project-choice-list span { color: #778391; font-size: 12px; }
.kms-project-choice-list strong > .kms-status-badge { display: inline-flex; margin-left: 5px; padding: 2px 7px; border-radius: 999px; color: #b42318; background: #fee4e2; font-size: 11px; line-height: 1.3; vertical-align: 1px; }
.kms-select-logout { margin-top: 18px; text-align: center; }

.kms-project-content { max-width: 900px; margin: 0 auto; padding: 28px 20px; }
.kms-project-card { padding: 24px; border: 1px solid #e3e7ec; border-radius: 9px; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.04); }
.kms-project-card h1 { margin: 0 0 5px; font-size: 23px; }
.kms-project-sub { margin: 0 0 20px; color: #778391; }
.kms-my-info-card { max-width: 620px; margin: 0 auto; }
.kms-my-info-form { display: grid; gap: 6px; }
.kms-my-info-form label { margin-top: 9px; color: #4f5d6b; font-size: 13px; }
.kms-my-info-form input { width: 100%; height: 39px; padding: 0 10px; border: 1px solid #cfd6de; border-radius: 5px; font: inherit; }
.kms-my-info-form input[readonly] { background: #f0f2f5; color: #687482; }
.kms-my-info-form fieldset { margin: 20px 0 12px; padding: 14px; border: 1px solid #dbe1e8; border-radius: 7px; }
.kms-my-info-form legend { padding: 0 7px; color: #354557; font-weight: 700; }
.kms-my-info-form .kms-btn { height: 42px; }
.kms-account-info-card { margin: 0; }

.kms-main > .kms-project-content { max-width:none; margin:0; }
.kms-main > .kms-project-content .kms-project-card { max-width:900px; margin:0 auto; }

/* 시스템 관리자 대시보드 */
.kms-dashboard-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; }
.kms-btn-link { display:inline-flex; align-items:center; justify-content:center; text-decoration:none; white-space:nowrap; }
.kms-admin-metrics { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; margin-bottom:18px; }
.kms-admin-metric { padding:18px 20px; border:1px solid #dfe5ec; border-top:4px solid #64748b; border-radius:9px; background:#fff; box-shadow:0 2px 8px rgba(31,45,61,.05); }
.kms-admin-metric span,.kms-admin-metric small { display:block; color:#738091; }
.kms-admin-metric strong { display:block; margin:7px 0 4px; color:#1f2937; font-size:30px; line-height:1; }
.kms-admin-metric small { font-size:11px; }
.kms-admin-metric-active { border-top-color:#2d9b61; }
.kms-admin-metric-scheduled { border-top-color:#3b82f6; }
.kms-admin-metric-inactive { border-top-color:#94a3b8; }
.kms-dashboard-section-title { display:flex; justify-content:space-between; gap:16px; margin-bottom:14px; }
.kms-dashboard-section-title h2 { margin:0 0 4px; font-size:16px; }
.kms-dashboard-section-title p { margin:0; color:#7a8490; font-size:12px; }
.kms-dashboard-code { display:block; margin-top:3px; color:#8994a3; font-size:11px; }
.kms-project-state { display:inline-block; min-width:62px; padding:4px 8px; border-radius:14px; text-align:center; font-size:11px; font-weight:700; }
.kms-project-state-active { background:#e7f7ee; color:#237a4c; }
.kms-project-state-scheduled { background:#eaf2ff; color:#2f66b3; }
.kms-project-state-inactive { background:#eef1f4; color:#697586; }
.kms-dashboard-link { color:#326da8; text-decoration:none; font-weight:600; font-size:12px; }
.kms-dashboard-link:hover { text-decoration:underline; }
@media (max-width:1000px) { .kms-admin-metrics { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:600px) { .kms-admin-metrics { grid-template-columns:1fr; } .kms-dashboard-heading { align-items:stretch; flex-direction:column; } }

/* =====================================================================
 * 반응형 (모바일/태블릿) — 폭 768px 이하
 *   · 햄버거(석삼) 버튼 노출
 *   · 좌측 사이드바를 화면 밖(왼쪽)으로 숨김 → 햄버거 클릭 시 슬라이드 인 + 배경 오버레이
 *   · 햄버거는 body.kms-sidebar-open 토글(layout.js)
 * ===================================================================== */
@media (max-width: 768px) {

    .kms-error-search { grid-template-columns: 1fr 1fr; }
    .kms-error-search-actions { grid-column: 1 / -1; }
    .kms-error-search-actions .kms-btn { flex: 1; }
    .kms-error-table thead { display: none; }
    .kms-error-table, .kms-error-table tbody, .kms-error-table tr, .kms-error-table td { display: block; width: 100%; }
    .kms-error-table .kms-error-row { margin-bottom: 12px; padding: 8px; border: 1px solid #e0e5eb; border-radius: 8px; background: #fff; }
    .kms-error-table .kms-error-row td { display: grid; grid-template-columns: 105px 1fr; gap: 8px; padding: 6px 8px; border: 0; }
    .kms-error-table .kms-error-row td::before { content: attr(data-label); color: #73808c; font-size: 12px; }
    .kms-error-preview { min-width: 0; max-width: none; }
    .kms-error-detail-row { margin: -8px 0 14px; }
    .kms-error-detail { padding: 14px; }
    .kms-json-tree details { margin-left: 8px; }
}
.kms-pagination{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:16px}
.kms-check-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:9px 14px}.kms-check-grid label{display:flex;align-items:center;gap:7px;min-height:38px;padding:8px 10px;border:1px solid #e1e6ed;border-radius:7px;background:#fff}.kms-check-grid small{margin-left:auto;color:#8490a0}.kms-role-menu-tree{display:flex;flex-direction:column;gap:3px;min-height:70px;padding:12px;border:1px solid #e1e6ed;border-radius:8px;background:#fafbfd}.kms-role-menu-tree label{display:block;min-height:34px;padding-top:7px;padding-bottom:7px;border-radius:5px}.kms-role-menu-tree label:hover{background:#eef4fb}
.kms-check-grid > .kms-help:only-child { grid-column:1 / -1; display:flex; align-items:center; justify-content:center; min-height:110px; margin:0; }
/* 그리드 카드 본문에 직접 놓인 체크그리드(프로젝트별 권한관리 등)는 카드 안쪽 여백 확보 */
.kms-grid-card .kms-check-grid { padding: 14px 16px; }
#projectRolesBox.kms-check-grid { grid-template-columns: minmax(0, 1fr); }
.kms-role-menu-tree.kms-tree { padding-right: 0; }
.kms-role-menu-legend,.kms-role-menu-tree .kms-role-menu-permission{display:grid;grid-template-columns:minmax(0,1fr) 84px 180px 84px 84px;align-items:center;gap:8px}
.kms-role-menu-legend{padding:9px 16px;border-bottom:1px solid #e5eaf0;color:#64748b;font-size:12px;text-align:center}
.kms-role-menu-legend span{text-align:left}.kms-role-menu-tree .kms-role-menu-permission{min-height:38px;padding:5px 0 5px 3px;border-radius:5px}.kms-role-menu-tree .kms-role-menu-permission:hover{background:#eef4fb}
.kms-role-menu-permission>.kms-role-menu-name{display:flex;min-width:0;align-items:center;gap:7px;padding-left:calc(var(--tree-depth,0) * 22px)}.kms-role-menu-name .kms-tree-ico{flex:0 0 20px;padding-left:0}.kms-role-menu-permission input{width:18px;height:18px;justify-self:center}
.kms-project-role-item{display:grid!important;grid-template-columns:auto minmax(0,1fr) auto!important}.kms-project-role-item>span{display:flex;min-width:0;align-items:center;gap:7px}.kms-project-role-order{font-size:11px;color:#64748b}.kms-project-role-order input{width:76px!important;min-height:30px!important}.kms-project-role-item>small{margin-left:0}
.kms-table td.pmw-empty,.kms-table td.kms-empty,.kms-table td.kms-empty-cell{text-align:center!important;vertical-align:middle!important}
@media(max-width:700px){.kms-role-menu-legend,.kms-role-menu-tree .kms-role-menu-permission{grid-template-columns:minmax(0,1fr) 52px 96px 52px 52px}.kms-project-role-item{grid-template-columns:auto minmax(0,1fr)!important}.kms-project-role-order{grid-column:2}}
/* 그리드 카드 헤더: 좁은 화면에서 select+버튼이 카드 밖으로 넘치지 않게 줄바꿈 허용 */
.kms-grid-head { flex-wrap: wrap; }
.kms-grid-head .kms-page-actions { flex-wrap: wrap; justify-content: flex-end; min-width: 0; }
.kms-grid-head .kms-page-actions select { min-width: 0; max-width: 100%; }
@media (max-width: 768px) {
    .kms-grid-head .kms-page-actions { width: 100%; }
    .kms-grid-head .kms-page-actions select { flex: 1 1 160px; width: auto; }
}

/* =====================================================================
 * 통합 관리 화면 테마
 * dashboard-wireframe.html의 시각 언어를 기존 KMS DOM/JS 계약에 매핑한다.
 * 기존 id, data-* 속성, .open 상태 클래스와 API 동작은 변경하지 않는다.
 * ===================================================================== */
:root {
    --kms-ui-bg: #f4f7fb;
    --kms-ui-panel: #ffffff;
    --kms-ui-line: #dfe5ef;
    --kms-ui-text: #1f2937;
    --kms-ui-muted: #6b7280;
    --kms-ui-primary: #2563eb;
    --kms-ui-primary-soft: #eaf1ff;
    --kms-ui-nav: #111827;
    --kms-ui-nav-soft: #1f2937;
    --kms-ui-success: #16a34a;
    --kms-ui-warning: #f59e0b;
    --kms-ui-danger: #dc2626;
    --kms-ui-purple: #7c3aed;
    --kms-ui-shadow: 0 8px 24px rgba(15, 23, 42, .08);
    --kms-ui-radius: 14px;
}

.kms-business-card,
.kms-project-card,
.kms-admin-metric,
.kms-layout-item {
    border: 1px solid var(--kms-ui-line);
    border-radius: var(--kms-ui-radius);
    background: var(--kms-ui-panel);
    box-shadow: var(--kms-ui-shadow);
}
.kms-section-title,
.kms-dashboard-section-title,
.common-code-head,
.preset-master-head {
    align-items: center;
    margin-bottom: 13px;
}
.kms-section-title h2,
.kms-dashboard-section-title h2,
.common-code-head h2,
.preset-master-head h2 { color: var(--kms-ui-text); font-size: 16px; }
.kms-section-title p,
.kms-dashboard-section-title p { color: var(--kms-ui-muted); font-size: 12px; }

/* 검색·도구 모음과 폼 요소 */
.kms-toolbar {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 12px;
}
.kms-section-title .kms-toolbar { margin-bottom: 0; }
.kms-inline-field { align-items: center; gap: 8px; }
.kms-inline-field > div { min-width: 0; flex: 1; }
.kms-password-policy-card { max-width: 720px; }
.kms-policy-fieldset { margin: 0 0 18px; padding: 14px 16px; border: 1px solid #dbe3ed; border-radius: 8px; }
.kms-policy-fieldset legend { padding: 0 6px; font-weight: 700; }
.kms-policy-fieldset .kms-choice { display: block; margin: 9px 0; cursor: pointer; }
.kms-policy-fieldset input { margin-right: 7px; }
.kms-required { color: #d23; }


.kms-empty,
.kms-empty-cell { color: var(--kms-ui-muted) !important; text-align: center !important; }
.kms-status,
.kms-project-state { border-radius: 999px; font-size: 11px; font-weight: 700; }
.kms-success { color: var(--kms-ui-success) !important; }
.kms-error { color: var(--kms-ui-danger) !important; }


/* 브라우저 기본 달력 대신 아이콘을 기준으로 여는 공통 날짜 선택기 */
.kms-date-field { position: relative; display: block; width: 100%; min-width: 0; }
.kms-inline-field > .kms-date-field { flex: 1; }
.kms-date-field > input { width: 100%; padding-right: 43px !important; }
.kms-date-field > input::-webkit-calendar-picker-indicator { opacity: 0; pointer-events: none; }
.kms-date-trigger {
    position: absolute;
    top: 1px;
    right: 1px;
    bottom: 1px;
    width: 40px;
    padding: 0;
    border: 0;
    border-left: 1px solid #e2e8f0;
    border-radius: 0 7px 7px 0;
    background: #fff;
    color: #475569;
    cursor: pointer;
    font-size: 16px;
}
.kms-date-trigger:hover,
.kms-date-trigger:focus-visible { background: #f4f7fb; color: #174ea6; }
.kms-date-popover {
    position: fixed;
    z-index: 2000;
    width: 292px;
    padding: 12px;
    border: 1px solid #cfd7e3;
    border-radius: 11px;
    background: #fff;
    box-shadow: 0 14px 38px rgba(15, 23, 42, .2);
}
.kms-date-popover[hidden] { display: none; }
.kms-date-head { display: grid; grid-template-columns: 34px 1fr 34px; gap: 6px; align-items: center; margin-bottom: 8px; }
.kms-date-head strong { text-align: center; color: #243244; font-size: 14px; }
.kms-date-nav { width: 34px; height: 34px; padding: 0; border: 0; border-radius: 7px; background: transparent; color: #526172; cursor: pointer; font-size: 20px; }
.kms-date-nav:hover { background: #f0f4f8; }
.kms-date-weekdays,
.kms-date-days { display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px; }
.kms-date-weekdays span { padding: 5px 0; color: #7b8794; text-align: center; font-size: 11px; font-weight: 700; }
.kms-date-day { height: 34px; padding: 0; border: 0; border-radius: 7px; background: transparent; color: #263445; cursor: pointer; font: inherit; font-size: 12px; }
.kms-date-day:hover { background: #edf3fb; }
.kms-date-day.outside { color: #b5bdc8; }
.kms-date-day.today { box-shadow: inset 0 0 0 1px #7aa7dc; }
.kms-date-day.selected { background: #2563eb; color: #fff; font-weight: 700; box-shadow: none; }
.kms-date-foot { display: flex; justify-content: space-between; gap: 8px; margin-top: 9px; padding-top: 9px; border-top: 1px solid #e8edf3; }
.kms-date-foot button { padding: 5px 8px; border: 0; border-radius: 6px; background: transparent; color: #2563eb; cursor: pointer; font: inherit; font-size: 12px; font-weight: 700; }
.kms-date-foot button:hover { background: #eef4ff; }

@media (max-width: 700px) {
    .kms-date-popover { width: min(292px, calc(100vw - 16px)); }
}

/* 메신저 통신 방식 도움말: 프로젝트 설정과 시스템 프로젝트관리에서 공통 사용 */
.kms-help-modal { z-index: 700; }
.kms-transport-guide { color: #1f2937; line-height: 1.65; }
.kms-transport-hero { padding: 22px 24px; border-radius: 14px; background: linear-gradient(135deg,#172b4d,#234b7c); color: #fff; }
.kms-transport-hero h2 { margin: 0 0 7px; color: inherit; font-size: 22px; }
.kms-transport-hero p,
.kms-transport-summary p { margin: 0; }
.kms-transport-summary { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 14px; }
.kms-transport-summary article,
.kms-transport-section { padding: 18px; border: 1px solid #dbe4ef; border-radius: 12px; background: #fff; }
.kms-transport-summary strong { display: block; margin-bottom: 6px; color: #2563eb; font-size: 16px; }
.kms-transport-section { margin-top: 14px; }
.kms-transport-section h3 { margin: 0 0 10px; color: #172b4d; font-size: 17px; }
.kms-transport-section ol,
.kms-transport-section ul { margin: 0; padding-left: 21px; }
.kms-transport-table-wrap { overflow-x: auto; }
.kms-transport-section table { width: 100%; min-width: 650px; border-collapse: collapse; }
.kms-transport-section th,
.kms-transport-section td { padding: 10px 11px; border: 1px solid #dbe4ef; text-align: left; vertical-align: top; }
.kms-transport-section thead th { background: #f8fafc; }
.kms-transport-section code { padding: 2px 5px; border-radius: 4px; background: #eef2f7; color: #183153; }
.kms-transport-note { margin: 13px 0 0; padding: 12px 14px; border-radius: 9px; background: #eef6ff; color: #244a78; }
body.kms-help-modal-open { overflow: hidden; }

@media (max-width: 700px) {
    .kms-help-modal .kms-modal-body { padding: 12px; }
    .kms-transport-summary { grid-template-columns: 1fr; }
    .kms-transport-hero { padding: 18px; }
    .kms-transport-hero h2 { font-size: 19px; }
}

/* 관리자 안내 흐름 */
.kms-setup-steps {
    gap: 7px;
    margin: 0 0 18px;
    padding: 10px;
    overflow-x: auto;
    border: 1px solid var(--kms-ui-line);
    border-radius: 12px;
    background: #fff;
    color: #94a3b8;
    box-shadow: 0 3px 12px rgba(15, 23, 42, .04);
    white-space: nowrap;
}
.kms-setup-steps a {
    display: inline-flex;
    min-height: 30px;
    align-items: center;
    padding: 5px 9px;
    border-radius: 8px;
    color: #475569;
    font-weight: 700;
}
.kms-setup-steps a:hover { background: var(--kms-ui-primary-soft); color: var(--kms-ui-primary); text-decoration: none; }

/* 관리자 대시보드 */
.kms-admin-metrics { gap: 12px; margin-bottom: 18px; }
.kms-admin-metric { padding: 17px; border-top-width: 4px; }
.kms-admin-metric span,
.kms-admin-metric small { color: var(--kms-ui-muted); }
.kms-admin-metric strong { margin: 10px 0 4px; color: var(--kms-ui-text); font-size: 28px; font-weight: 800; }
.kms-admin-metric-active { border-top-color: var(--kms-ui-success); }
.kms-admin-metric-scheduled { border-top-color: var(--kms-ui-primary); }
.kms-admin-metric-inactive { border-top-color: #94a3b8; }



@media (max-width: 1100px) {
    .kms-error-search,
    .system-log-search { grid-template-columns: repeat(2, minmax(150px, 1fr)); }
    .kms-error-search-actions,
    .system-log-search-actions { grid-column: 1 / -1; }
}

@media (max-width: 780px) {
    .kms-toolbar { align-items: stretch; }
    .kms-toolbar input[type="search"] { width: 100%; flex: 1 1 100%; }
    .kms-inline-field { align-items: stretch; flex-wrap: wrap; }
    .kms-inline-field > input,
    .kms-inline-field > select { flex: 1 1 180px; }
    .kms-setup-steps { flex-wrap: nowrap; }
}

@media (max-width: 560px) {
    .kms-error-search,
    .system-log-search { grid-template-columns: 1fr; }
    .kms-btn { padding-right: 10px; padding-left: 10px; }
    .kms-admin-metrics { grid-template-columns: 1fr; }
    .kms-dashboard-heading { align-items: stretch; flex-direction: column; }
    .kms-project-checks,
    .kms-project-assignment { grid-template-columns: 1fr; }
}

/* 파일 정책 미설정 안내는 첨부 입력 영역의 중앙에 고정한다. */
.kms-file-policy-info { display: flex; align-items: center; justify-content: center; min-height: 48px; margin: 0; padding: 8px 12px; line-height: 1.45; text-align: center; }

/* 제한형 공통 텍스트 에디터: 게시판 6종, Q&A 답변, 이슈 관리 */
.kms-rich-editor{position:relative;width:100%;border:1px solid #cbd5e1;border-radius:10px;background:#fff;overflow:hidden}
.kms-rich-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:6px;padding:7px 9px;border-bottom:1px solid #e2e8f0;background:#f8fafc}
.kms-rich-group{display:inline-flex;flex:0 1 auto;flex-wrap:wrap;align-items:center;gap:4px;min-width:0}
.kms-rich-toolbar button{min-width:32px;height:30px;padding:0 8px;border:1px solid #cbd5e1;border-radius:6px;background:#fff;color:#334155;cursor:pointer}
.kms-rich-toolbar button:hover,.kms-rich-toolbar button:focus-visible{border-color:#2563eb;color:#1d4ed8;background:#eff6ff}
.kms-rich-surface{min-height:260px;padding:14px 16px;line-height:1.7;outline:0;overflow-wrap:anywhere}
.kms-rich-surface:empty::before{content:attr(data-placeholder);color:#94a3b8;pointer-events:none}
.kms-rich-surface.is-dragover{background:#eff6ff;box-shadow:inset 0 0 0 2px #3b82f6}
/* 본문 이미지: 기본은 가운데 블록, 정렬 클래스로 좌/우 흐름(글이 옆으로 감) */
.kms-rich-surface img,.kms-board-view-body img{display:block;max-width:100%;height:auto;margin:12px auto;border-radius:8px}
.kms-rich-surface img{border:1px solid #cbd5e1;cursor:pointer}                       /* 등록/수정: 크기 보이도록 테두리 */
.kms-rich-surface img.is-selected{outline:2px solid #2563eb;outline-offset:2px;border-color:#2563eb;touch-action:none}
/* 이미지는 한 줄(블록)로 배치 → 옆에 글이 붙지 않음. 정렬은 블록 위치(좌/가운데/우)로만 */
.kms-rich-surface img.align-left,.kms-board-view-body img.align-left{margin-left:0;margin-right:auto}
.kms-rich-surface img.align-right,.kms-board-view-body img.align-right{margin-left:auto;margin-right:0}
.kms-rich-surface img.align-center,.kms-board-view-body img.align-center{margin-left:auto;margin-right:auto}
/* 이미지 리사이즈 핸들(선택 시 우하단 표시, 끌어서 크기 조절) */
.kms-rich-img-handle{position:absolute;z-index:6;width:14px;height:14px;margin:0;box-sizing:border-box;border:2px solid #2563eb;border-radius:3px;background:#fff;cursor:nwse-resize;touch-action:none}
.kms-rich-img-handle[hidden]{display:none}
.kms-rich-surface blockquote,.kms-board-view-body blockquote{margin:12px 0;padding:10px 14px;border-left:4px solid #93c5fd;background:#f8fafc;color:#475569}
.kms-rich-editor>.kms-help{display:block;padding:7px 10px;border-top:1px solid #e2e8f0;background:#f8fafc}
/* 활성(적용중) 버튼 표시 + 편집중 에디터 강조 */
.kms-rich-toolbar button.is-active{border-color:#2563eb;color:#1d4ed8;background:#dbeafe}
.kms-rich-editor.is-focused{border-color:#2563eb;box-shadow:0 0 0 3px rgba(37,99,235,.15)}
.kms-rich-sep{flex:0 0 1px;align-self:center;width:1px;height:20px;margin:0 2px;background:#cbd5e1}
.kms-rich-toolbar .kms-rich-select{width:auto;min-width:78px;height:30px;padding:0 6px;border:1px solid #cbd5e1;border-radius:6px;background:#fff;color:#334155;font-size:12px;cursor:pointer}
.kms-rich-color{display:inline-flex;align-items:center;gap:4px;height:30px;padding:0 7px;border:1px solid #cbd5e1;border-radius:6px;background:#fff;color:#334155;font-size:11px;cursor:pointer}
.kms-rich-color input[type=color]{width:20px;height:20px;padding:0;border:0;border-radius:4px;background:none;cursor:pointer}
/* 이미지 편집용 보조 툴바(이미지 선택 시 노출) */
.kms-rich-img-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:5px;padding:6px 9px;border-bottom:1px solid #e2e8f0;background:#eff6ff}
.kms-rich-img-toolbar[hidden]{display:none}
.kms-rich-img-label{font-size:12px;font-weight:700;color:#1d4ed8}
.kms-rich-img-toolbar button{min-width:30px;height:28px;padding:0 9px;border:1px solid #93c5fd;border-radius:6px;background:#fff;color:#1d4ed8;font-size:12px;cursor:pointer}
.kms-rich-img-toolbar button:hover{background:#dbeafe}
.kms-rich-img-toolbar .kms-rich-img-del{border-color:#fca5a5;color:#dc2626}
.kms-rich-img-toolbar .kms-rich-img-del:hover{background:#fee2e2}
.kms-rich-img-range{width:110px}
.kms-rich-img-hint{margin-left:auto;font-size:11px;color:#64748b}
.kms-board-answer .kms-board-view-files{margin:12px 0 0}
@media(max-width:720px){.kms-rich-surface{min-height:210px;padding:12px}.kms-rich-toolbar{align-items:flex-start}.kms-rich-toolbar button{font-size:12px}.kms-rich-sep{display:none}.kms-rich-group{flex-basis:100%}}
.kms-file-input-native{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.kms-file-manager{display:grid;gap:8px;width:100%}
.kms-file-toolbar{display:flex;align-items:center;gap:10px;min-height:32px}
.kms-file-summary{margin-left:auto;color:#64748b;font-size:12px}
.kms-file-drop{display:grid;width:100%;min-height:88px;place-content:center;grid-template-columns:auto auto;align-items:center;gap:2px 7px;padding:15px;border:1px solid #d7dde7;border-radius:8px;background:#fff;color:#44516a;text-align:center;cursor:pointer;transition:border-color .15s,background .15s,transform .15s}
.kms-file-drop:hover,.kms-file-drop:focus-visible,.kms-file-drop.is-dragover{border-color:var(--kms-primary,#2563eb);background:#eef4ff;outline:none}
.kms-file-drop.is-dragover{transform:scale(1.005)}
.kms-file-drop-icon{grid-row:1/span 2;color:#7b8796;font-size:20px;line-height:1}
.kms-file-drop strong{font-size:13px;color:#586579}.kms-file-drop small{grid-column:2;max-width:min(680px,80vw);overflow:hidden;color:#8a94a3;text-overflow:ellipsis;white-space:nowrap;font-size:11px}
.kms-file-list{overflow:hidden;border:1px solid #dfe4eb;border-radius:8px;background:#fff}
.kms-file-list-head,.kms-file-row{display:grid;grid-template-columns:36px 42px minmax(0,1fr) 110px 92px;align-items:center;min-height:34px}
.kms-file-list-head{border-bottom:1px solid #e5e9ef;background:#f7f8fa;color:#667085;font-size:11px}
.kms-file-list-head>span{text-align:center}.kms-file-list-head .kms-file-name-head{grid-column:2/4;text-align:left}
.kms-file-list-body{max-height:238px;overflow-y:auto}
.kms-file-row{border-bottom:1px solid #edf0f4;color:#334155;font-size:12px}.kms-file-row:last-child{border-bottom:0}
.kms-file-row>*{min-width:0}.kms-file-remove{width:26px;height:26px;margin:auto;padding:0;border:0;background:transparent;color:#7b8492;font-size:18px;line-height:1;cursor:pointer}
.kms-file-remove:hover,.kms-file-remove:focus-visible{border-radius:5px;background:#fee2e2;color:#dc2626;outline:none}
.kms-file-type{display:inline-flex;width:30px;height:24px;align-items:center;justify-content:center;overflow:hidden;border-radius:4px;background:#64748b;color:#fff;font-size:8px;font-weight:800;text-transform:uppercase}
.kms-file-type[data-extension="pdf"]{background:#dc2626}.kms-file-type[data-extension="doc"],.kms-file-type[data-extension="docx"]{background:#2563eb}.kms-file-type[data-extension="ppt"],.kms-file-type[data-extension="pptx"]{background:#ea580c}.kms-file-type[data-extension="xls"],.kms-file-type[data-extension="xlsx"]{background:#16803a}
.kms-file-name{overflow:hidden;padding-right:10px;color:#1f2937;text-overflow:ellipsis;white-space:nowrap;text-decoration:none}.kms-file-name:hover{text-decoration:underline}
.kms-file-status{color:#64748b;text-align:center}.kms-file-size{padding-right:10px;color:#475569;text-align:right}
.kms-file-existing-fallback{display:grid;gap:5px;margin-bottom:8px}.kms-file-existing-title{font-size:12px}.kms-file-existing-fallback .kms-file-row{border:1px solid #e5e9ef;border-radius:6px}
@media(max-width:640px){.kms-file-list-head,.kms-file-row{grid-template-columns:34px 36px minmax(0,1fr) 76px}.kms-file-list-head>span:nth-last-child(2),.kms-file-status{display:none}.kms-file-list-head>span:last-child{grid-column:4}.kms-file-size{grid-column:4}.kms-file-summary{max-width:65%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}}

/* 회원가입·최초 진입 개인정보 동의 */
.kms-consent-fieldset{display:grid;gap:10px;margin:18px 0 4px;padding:14px;border:1px solid #cbd5e1;border-radius:10px;background:#f8fafc}
.kms-consent-fieldset legend{padding:0 6px;color:#0f172a;font-size:14px;font-weight:800}
.kms-consent-item{overflow:hidden;border:1px solid #dbe3ee;border-radius:8px;background:#fff}
.kms-consent-check{display:flex!important;align-items:center;gap:8px;margin:0!important;padding:11px 12px;color:#1e293b}
.kms-consent-check input{flex:0 0 auto;width:18px!important;height:18px;margin:0}
.kms-consent-item details{border-top:1px solid #edf2f7}
.kms-consent-item summary{padding:9px 12px;color:#475569;font-size:12px;cursor:pointer}
.kms-consent-content{max-height:240px;overflow:auto;padding:12px;border-top:1px solid #edf2f7;color:#334155;font-size:12px;line-height:1.65;white-space:pre-line}
@media(max-width:640px){.kms-consent-fieldset{padding:10px}.kms-consent-content{max-height:200px}}