/* [app.css 분할 6/10 · winmodes.css] 창 모드(컴팩트·상주·메신저) · 레일 · 아이콘 · 화면 설정
   2026-08-23 리팩터 — 옛 app.css 를 원본 순서 그대로 10조각으로 나눴다.
   캐스케이드가 곧 계약이라 로드 순서를 바꾸면 안 된다:
   app.css → studio.css → rooms.css → orgwork.css → overlays.css → winmodes.css → plus.css → chrome.css → msgx.css → profile.css
   로드 지점: web/index.html, tests/harness/*.html */
/* ── 컴팩트 채팅 모드 (카톡식 골격, 2026-07-27 개편) ──
   body.view-chat: 채팅 컬럼만 전폭으로 남기고 AI 스튜디오(#side/#main)를 감춘다.
   .closed 는 무시(조직도 배타 등으로 닫혀도 컴팩트에선 항상 보인다 — 빈 창 방지). */
body.view-chat #side,body.view-chat #main{display:none}
body.view-chat #coCol,body.view-chat #coCol.closed{
  width:auto!important;min-width:0!important;flex:1;border-left:0}
/* 컴팩트/메신저 창은 바깥이 창 전폭(auto)이므로 안쪽(.co-inner)도 같이 늘어나야
   한다 — 고정폭(--co-w)을 두면 저장된 폭(최대 560)이 창보다 넓을 때 오른쪽이
   잘린다(통합검색 버튼 짤림, 2026-07-29 보스 리포트). 항상 보이는 모드라
   .closed 의 밀어내기 transform/visibility 도 함께 끈다(빈 창 방지). */
body.view-chat #coCol .co-inner{width:auto;flex:1;transform:none!important;visibility:visible!important}
body.view-chat #coDrag,body.view-chat #coWide{display:none}
#coClose{display:none}   /* 새 골격: 채팅 컬럼은 항상 열림(닫기 폐지) */

/* ── 상주창 모드 (PC 앱 본창, 창 분리 개편 2026-07-28) ──
   body.view-resident: AI 대화(#main)만 420px 컬럼으로 남긴다. 사내대화는
   별도 메신저 창(/?msn=1)이 담당하므로 채팅 컬럼·조직도·그룹웨어·작업 패널을
   전부 감춘다. 헤더의 '메신저' 버튼(#btnMsn)은 이 모드에서만 보인다. */
body.view-resident #side,body.view-resident #coCol,body.view-resident #coCol.closed,
body.view-resident #orgPop,body.view-resident #gwPop,body.view-resident #work{display:none}
#btnMsn{display:none;align-items:center;gap:5px}
body.view-resident #btnMsn{display:inline-flex}
/* 상주창 전용 '스튜디오 확대' — 확대 진입점(coOrb·btnAI)이 전부 숨은 채팅 컬럼에
   있어서 상주 모드엔 확대 수단이 없었다(2026-07-28 버그). 헤더에 별도 버튼. */
#btnFull{display:none}
body.view-resident #btnFull{display:inline-flex}
/* 스튜디오 전용 '축소' — btnFull 의 짝. full 모드(view-* 클래스 없음)에서만 뜨고,
   축소 진입점이 단축키(Alt+Space 뒤 Alt+←)뿐이던 걸 헤더 버튼으로 보강한다.
   팝업 창(메신저=view-chat, 조직도=orgwin, 방=popout)에선 뜨지 않는다. */
#btnCompact{display:none}
body:not(.view-chat):not(.view-resident):not(.orgwin):not(.popout) #btnCompact{display:inline-flex}

/* ── 메신저 창 (/?msn=1) — view-chat 골격에서 AI 진입 요소만 숨긴다.
   조직도 버튼은 남긴다: 누르면 옆 컬럼 창(/?org=1)으로 열린다(msn.js). ── */
body.msn #coOrb,body.msn #btnAI,body.msn #btnWork{display:none}

/* ── 카톡식 좌측 레일 (#coRail) — 메신저 창 전용 (2026-07-29 보스 지시).
   #coCol 이 flex row 라 rail 이 왼쪽 고정 컬럼, .co-inner 가 나머지를 채운다.
   상단 3(조직도·채팅·더보기)/하단 2(알림·설정), 배선은 msn.js railInit. ── */
#coRail{display:none}
body.msn #coRail{display:flex;flex-direction:column;justify-content:space-between;align-items:center;
  width:64px;flex:none;padding:16px 0 14px;background:#f4f2fb;border-right:1px solid var(--line)}
.rail-grp{display:flex;flex-direction:column;align-items:center;gap:6px}
.rail-it{width:42px;height:42px;border:0;border-radius:13px;background:transparent;
  display:grid;place-items:center;font-size:19px;color:#8a8fa5;position:relative;
  transition:background var(--motion-dur-micro) var(--motion-ease-out)}
.rail-it:hover{background:#e9e5f7}
.rail-it.is-on{background:#e4defa;color:var(--accent-deep, #4b3fd4)}
.rail-it.is-off{opacity:.55}

/* ── 아이콘 단일 출처 (.ico 마스크 — 애플식 얇은 라인, 2026-07-29 보스 지시
   "이모지 대신 심플하게"). currentColor 를 따르므로 색은 부모가 정한다
   (#btnEmo 마스크 선례). 새 아이콘은 여기에만 추가하고 마크업/JS 에서
   <i class="ico ico-이름"></i> 로 쓴다 — 이모지를 직접 쓰지 말 것. ── */
.ico{display:inline-block;width:18px;height:18px;flex:none;background:currentColor;vertical-align:-4px;
  -webkit-mask:var(--ico) center/contain no-repeat;mask:var(--ico) center/contain no-repeat}
.ico-search{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='10.8' cy='10.8' r='6.3'/%3E%3Cpath d='M15.5 15.5 20 20'/%3E%3C/svg%3E")}
.ico-people{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='8.4' r='3.3'/%3E%3Cpath d='M3.6 19.6c.5-3.3 2.6-5.2 5.4-5.2s4.9 1.9 5.4 5.2M15.4 5.3a3.3 3.3 0 0 1 .2 6.4M17 14.6c2.2.5 3.4 2.2 3.7 5'/%3E%3C/svg%3E")}
.ico-bubble{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 4.6c4.6 0 8.4 2.9 8.4 6.7s-3.8 6.7-8.4 6.7c-.8 0-1.6-.1-2.4-.3L6.2 19.6l.7-2.9c-1.9-1.2-3.3-3.1-3.3-5.4 0-3.8 3.8-6.7 8.4-6.7Z'/%3E%3C/svg%3E")}
.ico-more{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Ccircle cx='5' cy='12' r='1.7'/%3E%3Ccircle cx='12' cy='12' r='1.7'/%3E%3Ccircle cx='19' cy='12' r='1.7'/%3E%3C/svg%3E")}
.ico-bell{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 4.3c3 0 5.1 2.2 5.1 5.2v3.1l1.7 3H5.2l1.7-3V9.5c0-3 2.1-5.2 5.1-5.2ZM10 18.6a2 2 0 0 0 4 0'/%3E%3C/svg%3E")}
.ico-bellslash{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 4.3c3 0 5.1 2.2 5.1 5.2v3.1l1.7 3H5.2l1.7-3V9.5c0-3 2.1-5.2 5.1-5.2ZM10 18.6a2 2 0 0 0 4 0M4.6 4.6 19.4 19.4'/%3E%3C/svg%3E")}
.ico-gear{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='3.1'/%3E%3Cpath d='M12 3.4v2.2M12 18.4v2.2M3.4 12h2.2M18.4 12h2.2M5.9 5.9l1.6 1.6M16.5 16.5l1.6 1.6M18.1 5.9l-1.6 1.6M7.5 16.5l-1.6 1.6'/%3E%3C/svg%3E")}
.ico-pin{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9.3 3.6h5.4M10.3 3.6v4.5L7.6 11h8.8l-2.7-2.9V3.6M12 11v8.6'/%3E%3C/svg%3E")}
.ico-photo{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3.6' y='5' width='16.8' height='14' rx='2.4'/%3E%3Ccircle cx='8.4' cy='9.4' r='1.4'/%3E%3Cpath d='M6.2 18.4 10.8 13.3l3.2 3.3 2.4-2.5 3.4 4.2'/%3E%3C/svg%3E")}
.ico-copy{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='9' y='9' width='11.4' height='11.4' rx='2.2'/%3E%3Cpath d='M5.8 15V6a2.3 2.3 0 0 1 2.3-2.3H15'/%3E%3C/svg%3E")}
.ico-leave{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M13.5 4.5H7A2.5 2.5 0 0 0 4.5 7v10A2.5 2.5 0 0 0 7 19.5h6.5M10.5 12h9M16.6 8.6 20 12l-3.4 3.4'/%3E%3C/svg%3E")}
.ico-lock{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round'%3E%3Crect x='5.6' y='10.6' width='12.8' height='8.8' rx='2.2'/%3E%3Cpath d='M8.6 10.6V8.1a3.4 3.4 0 0 1 6.8 0v2.5'/%3E%3C/svg%3E")}
.ico-cloud{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7.6 18.4a3.8 3.8 0 0 1-.5-7.6 5.3 5.3 0 0 1 10.2-1.2 3.7 3.7 0 0 1-.5 8.8Z'/%3E%3C/svg%3E")}
.ico-power{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round'%3E%3Cpath d='M12 3.6v7M7.4 6.6a6.9 6.9 0 1 0 9.2 0'/%3E%3C/svg%3E")}
.ico-x{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round'%3E%3Cpath d='m6 6 12 12M18 6 6 18'/%3E%3C/svg%3E")}
.ico-spark{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linejoin='round'%3E%3Cpath d='M12 3.8l1.9 5.6 5.7 1.9-5.7 1.9-1.9 5.6-1.9-5.6-5.7-1.9 5.7-1.9z'/%3E%3C/svg%3E")}
.ico-pencil{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m4.6 19.4 1-4L16.4 4.6a1.9 1.9 0 0 1 2.7 0l.3.3a1.9 1.9 0 0 1 0 2.7L8.6 18.4l-4 1ZM14.6 6.4l3 3'/%3E%3C/svg%3E")}
.ico-folder{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linejoin='round'%3E%3Cpath d='M3.6 7.2a2 2 0 0 1 2-2h3.9l2 2.4h6.9a2 2 0 0 1 2 2v7.9a2 2 0 0 1-2 2H5.6a2 2 0 0 1-2-2Z'/%3E%3C/svg%3E")}
.ico-trash{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 7h14M9.6 7V5.6A1.6 1.6 0 0 1 11.2 4h1.6a1.6 1.6 0 0 1 1.6 1.6V7M6.6 7l.8 10.9a2 2 0 0 0 2 1.9h5.2a2 2 0 0 0 2-1.9L17.4 7M10.2 10.8v4.8M13.8 10.8v4.8'/%3E%3C/svg%3E")}
.ico-speaker{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4.6 10v4h2.9l4.4 3.9V6.1L7.5 10ZM15.8 9.6a3.9 3.9 0 0 1 0 4.8M18.2 7.6a7 7 0 0 1 0 8.8'/%3E%3C/svg%3E")}
.ico-check{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12.6 4.4 4.4L19 7.4'/%3E%3C/svg%3E")}
.ico-link{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10.2 13.8a3.6 3.6 0 0 0 5.1 0l3-3a3.6 3.6 0 0 0-5.1-5.1L11.6 7.3M13.8 10.2a3.6 3.6 0 0 0-5.1 0l-3 3a3.6 3.6 0 0 0 5.1 5.1l1.6-1.6'/%3E%3C/svg%3E")}
.ico-building{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5.4' y='3.6' width='10' height='16.8' rx='1.6'/%3E%3Cpath d='M8.4 7.2h1.4M11.6 7.2H13M8.4 10.6h1.4M11.6 10.6H13M8.4 14h1.4M11.6 14H13M10.7 20.4v-3.1M3.6 20.4h16.8'/%3E%3C/svg%3E")}
.ico-compass{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='8.2'/%3E%3Cpath d='m15.2 8.8-1.7 4.7-4.7 1.7 1.7-4.7z'/%3E%3C/svg%3E")}
.ico-map{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 4.6 3.9 6.4v13L9 17.6l6 1.8 5.1-1.8v-13L15 6.4 9 4.6ZM9 4.6v13M15 6.4v13'/%3E%3C/svg%3E")}
.ico-person{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round'%3E%3Ccircle cx='12' cy='8' r='3.6'/%3E%3Cpath d='M4.9 19.8c.6-3.7 3-5.8 7.1-5.8s6.5 2.1 7.1 5.8'/%3E%3C/svg%3E")}
.ico-mic{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round'%3E%3Crect x='9.4' y='3.4' width='5.2' height='9.6' rx='2.6'/%3E%3Cpath d='M6.4 11.4a5.6 5.6 0 0 0 11.2 0M12 17v3.2M9.2 20.2h5.6'/%3E%3C/svg%3E")}
.ico-film{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linejoin='round'%3E%3Crect x='3.6' y='5' width='16.8' height='14' rx='2'/%3E%3Cpath d='M7.6 5v14M16.4 5v14M3.6 9.2h4M3.6 14.8h4M16.4 9.2h4M16.4 14.8h4'/%3E%3C/svg%3E")}
.ico-window{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linejoin='round'%3E%3Crect x='4' y='4.6' width='16' height='14.8' rx='2'/%3E%3Cpath d='M4 9.2h16'/%3E%3C/svg%3E")}
.ico-megaphone{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4.6 10.2v3.6l2.9.8 10 3.4V6L7.5 9.4ZM9.2 15.2l.7 3a1.6 1.6 0 0 0 1.6 1.2M20.4 10.4a2.6 2.6 0 0 1 0 3.2'/%3E%3C/svg%3E")}
.ico-sun{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='3.5'/%3E%3Cpath d='M12 3.4v2M12 18.6v2M3.4 12h2M18.6 12h2M6 6l1.4 1.4M16.6 16.6 18 18M18 6l-1.4 1.4M7.4 16.6 6 18'/%3E%3C/svg%3E")}
.ico-moon{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M19.4 14.2A7.7 7.7 0 1 1 9.8 4.6a6.2 6.2 0 0 0 9.6 9.6Z'/%3E%3C/svg%3E")}
.ico-doc{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6.4 3.6h7.2l4 4v12.8H6.4Z'/%3E%3Cpath d='M13.6 3.6v4h4'/%3E%3C/svg%3E")}
.ico-down{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3.8v11M7.4 10.4l4.6 4.6 4.6-4.6'/%3E%3Cpath d='M4.6 19.6h14.8'/%3E%3C/svg%3E")}
.ico-code{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8.5 8 4.5 12l4 4M15.5 8l4 4-4 4'/%3E%3C/svg%3E")}
.ico-wrench{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14.7 3.9a4.7 4.7 0 0 0-4.5 6.1L4 16.2a2.1 2.1 0 0 0 3 3l6.2-6.2a4.7 4.7 0 0 0 6.1-4.5l-3 3-2.7-.9-.9-2.7Z'/%3E%3C/svg%3E")}
.ico-send{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.4 3.6 3.9 10.3l6.1 2.4 2.4 6.1ZM10 12.7l10.4-9.1'/%3E%3C/svg%3E")}
.ico-image{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3.6' y='4.6' width='16.8' height='14.8' rx='2'/%3E%3Ccircle cx='9' cy='9.4' r='1.6'/%3E%3Cpath d='m4.4 17.6 4.8-4.4 3.2 2.8 3.2-3.2 4 3.6'/%3E%3C/svg%3E")}
/* 쓰임새별 크기 (기본 18px) */
.rail-it .ico{width:21px;height:21px}
.menu-it .ico{width:17px;height:17px}
.m-tab .ico{width:14px;height:14px;vertical-align:-2px}
.gw-btn .ico,.gw-del .ico{width:14px;height:14px;vertical-align:-2px}
.say-btn .ico{width:15px;height:15px}
.it-pin .ico{width:11px;height:11px;vertical-align:-1px}
.msg-via .ico{width:12px;height:12px;vertical-align:-2px}
.tag-head .ico,#tagHint .ico,.dc-head .ico{width:13px;height:13px;vertical-align:-2px}
.cs-ico .ico{width:14px;height:14px;vertical-align:-2px}
.ctx-it .ico{width:15px;height:15px}
.rm-it .ico{width:16px;height:16px}
.rm-fbtn .ico{width:17px;height:17px;vertical-align:-3px}
.r-pin .ico,.r-mute .ico{width:11px;height:11px;vertical-align:-1px}

/* ── 조직도 창 (/?org=1) — 조직도 패널이 창의 전부 (좁은 폭에선 아래 미디어
   쿼리의 전면 시트 규칙이 그대로 적용돼 자연스럽게 꽉 찬다) ── */
body.orgwin #side,body.orgwin #main,body.orgwin #coCol,body.orgwin #coCol.closed,
body.orgwin #gwPop,body.orgwin #work{display:none}
body.orgwin #orgPop{width:auto;min-width:0;flex:1;border-left:0}
body.orgwin #orgWide{display:none}

/* 아호비 오브 — 채팅 헤더 상주 캐릭터 버튼(확장/축소 토글) */
#coOrb{display:inline-flex;align-items:center;justify-content:center;margin-right:4px;position:relative;
  height:26px;padding:0 10px;border:1px solid #d9d2ff;border-radius:999px;
  background:radial-gradient(circle at 50% 40%,#fff 0 45%,#efeaff 100%);
  font-size:11.5px;font-weight:800;letter-spacing:-.06em;color:#10162d;cursor:pointer;
  box-shadow:0 4px 14px rgba(var(--accent-rgb),.13);transition:transform var(--motion-dur-micro) var(--motion-ease-out)}
/* 호버 그림자는 ::after opacity 로 (§4.5) */
#coOrb::after{content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:-1;
  box-shadow:0 6px 18px rgba(var(--accent-rgb),.24);opacity:0;transition:opacity var(--motion-dur-micro) var(--motion-ease-out)}
#coOrb b{color:var(--accent)}
#coOrb:hover{transform:translateY(-1px)}
#coOrb:hover::after{opacity:1}

/* 사내 채팅 진한 톤 차별화 — AI 화면(화이트)보다 한 단계 깊은 라벤더 */
.co-head{background:linear-gradient(180deg,#ece7fd,#f6f4ff);border-bottom:1px solid #ddd4f6}
.cm-head{background:linear-gradient(180deg,#e9e3fc,#f4f1ff)}
#popRoom .co-input,#popRoom .co-attach{background:#f3f0fc}
.co-input button{background:linear-gradient(135deg,#6a58f0,#4534c9)}

/* 시큐어 전환 블룸 */
#secureBloom{position:fixed;inset:0;z-index:120;pointer-events:none;opacity:0;background:#fff}

/* ── 화면 설정: 글자 크기(작게/보통/크게) · 채팅 폭 ── */
body[data-fs="s"] .msg .bubble{font-size:13px}
body[data-fs="s"] #input{font-size:13px}
body[data-fs="l"] .msg .bubble{font-size:16px}
body[data-fs="l"] #input{font-size:16px}
body[data-wide="1"] #chat{max-width:1100px}
#secureBloom.go{animation:.72s cubic-bezier(.3,0,.2,1) both white-bloom}

@media (width<=760px){
  :root{--side-w:240px}
  #side{position:fixed;left:0;top:0;bottom:0;z-index:70;box-shadow:20px 0 60px #27225d22}
  /* 접힘 = 폭 0. §5.5 짝 규칙: 바깥 폭을 푸는 모드에선 안쪽 고정 여백도 같이 푼다.
     .side-scroll 은 border-box 라도 자기 좌우 패딩(8+8) 아래로는 못 줄어들어 폭 0인
     레일 안에 16px 를 남긴다 → 폭 100% 인 .sec-head 가 클리핑 조상(.side-scroll)
     밖으로 8px 삐져나온다(2026-08-02 보스 리포트, §5.5 짤림 감사. 접힘 페이드가
     끝나기 전 스냅샷이면 .side-it/.conn-dot 도 같이 걸린다).
     남는 잔여 폭은 visibility 로 페인트·히트테스트까지 끊는다(MOTION_SPEC §4.3
     "닫힘 상태 visibility:hidden"). 폭 0·border 0 인데도 홀로 남아 본문 위에
     번지던 box-shadow(20px 오프셋) 도 이걸로 함께 사라진다. */
  body.side-closed #side{width:0;min-width:0;border:0;visibility:hidden}
  body.side-closed .side-scroll{padding:0}
  #chat{padding:10px 14px 24px}
  /* 조직도 패널: 좁은 화면에선 전체 화면 시트(오버레이 서랍, §4.3) — 이 폭에서는
     #orgPop 자신이 서랍이라 .org-inner 의 transform 은 꺼둔다(이중 이동 방지) */
  #orgPop{position:fixed;inset:0;z-index:75;width:100vw;min-width:100vw;border-left:0;
    transform:translate3d(0,0,0);visibility:visible;
    transition:transform var(--motion-dur-drawer) var(--motion-ease-out),visibility 0s}
  #orgPop.closed{width:100vw;min-width:100vw;transform:translate3d(102%,0,0);visibility:hidden;
    pointer-events:none;   /* 타임라인 멈춤 시에도 전면 시트가 클릭을 먹지 않게 (§4.1) */
    transition:transform var(--motion-dur-exit-drawer) var(--motion-ease-in),
               visibility 0s linear var(--motion-dur-exit-drawer)}
  /* 시트가 100vw 이므로 안쪽 고정폭(--org-w 380px)도 푼다 — 380px 보다 좁은
     화면에서 오른쪽 짤림, 넓은 화면에서 여백 뜨는 것 방지 */
  .org-inner{transform:none!important;width:auto;flex:1}
}