*{box-sizing:border-box}body{margin:0;font-family:system-ui,-apple-system,"Noto Sans KR",sans-serif;background:#eef3f8;color:#172033}button,input{font:inherit}.hidden{display:none!important}
.login{min-height:100vh;display:grid;place-items:center;background:linear-gradient(135deg,#083b70,#1268d9)}.login-card{width:min(430px,92vw);background:#fff;border-radius:22px;padding:34px;box-shadow:0 20px 60px #0004}.brand{font-size:21px;color:#1268d9;display:flex;gap:10px;align-items:center}.brand span{color:#536273;font-weight:500}.login h1{font-size:25px;margin:38px 0 20px}.login input{display:block;width:100%;padding:14px;margin:10px 0;border:1px solid #d7dee8;border-radius:11px}.login button{width:100%;padding:14px;border:0;border-radius:11px;background:#1268d9;color:#fff;font-weight:700}.hint{font-size:12px;color:#8a95a5;margin-top:14px}
.app{height:100vh;display:flex;flex-direction:column;background:#fff}.app header{height:68px;display:flex;align-items:center;padding:0 22px;border-bottom:1px solid #e4e9f0;gap:20px}.app header .brand{flex:1}.me{font-size:14px;color:#536273}.icon{border:0;background:transparent;font-size:20px}
.layout{min-height:0;flex:1;display:grid;grid-template-columns:320px minmax(0,1fr);overflow:hidden}.layout aside{border-right:1px solid #e4e9f0;padding:14px;display:flex;flex-direction:column;min-height:0}.search input{width:100%;padding:12px 14px;border:1px solid #dce3ec;border-radius:12px;background:#f6f8fb}.search{margin-bottom:8px}#rooms{overflow:auto;flex:1}.room{display:flex;gap:12px;align-items:center;padding:13px 10px;border-radius:12px;cursor:pointer}.room:hover,.room.active{background:#edf5ff}.avatar{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:#dcecff;color:#1268d9;font-weight:700}.roomtext{min-width:0;flex:1}.roomname{font-weight:700}.preview{font-size:13px;color:#758196;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:3px}.newroom{border:0;background:#1268d9;color:#fff;border-radius:11px;padding:13px;font-weight:700}
main{display:flex;flex-direction:column;min-width:0;min-height:0;height:100%}.chathead{height:72px;border-bottom:1px solid #e7ebf0;display:flex;align-items:center;padding:0 24px;gap:14px}.chathead h2{font-size:18px;margin:0}.chathead small{color:#7a8797}.head-actions{margin-left:auto}.back{display:none;border:0;background:none;font-size:32px}.messages{flex:1;min-height:0;overflow:auto;padding:24px 7%;background:#f8fafc}.msgrow{display:flex;margin:9px 0}.msgrow.mine{justify-content:flex-end}.bubble{max-width:min(70%,600px);background:#fff;border:1px solid #e4e9f0;border-radius:15px;padding:10px 13px;box-shadow:0 1px 2px #0000000a}.mine .bubble{background:#1268d9;color:#fff;border:0}.sender{font-size:12px;font-weight:700;margin-bottom:4px}.time{font-size:10px;opacity:.65;margin-top:5px}.filecard{display:block;margin-top:8px;padding:9px;border-radius:10px;background:#ffffff22;border:1px solid #ffffff55}.empty{text-align:center;color:#98a3b3;margin-top:20vh}.composer{display:flex;gap:8px;padding:12px 18px;border-top:1px solid #e7ebf0}.composer input[type=text],.composer input:not([type]){flex:1}.composer input{border:1px solid #dce3ec;border-radius:13px;padding:12px}.composer button{width:46px;border:0;border-radius:12px;background:#1268d9;color:#fff;font-size:19px}.composer button:first-child{background:#eef4fb;color:#1268d9}.drawer{position:fixed;right:0;top:68px;width:320px;height:calc(100% - 68px);background:#fff;border-left:1px solid #ddd;box-shadow:-10px 0 30px #0001;padding:24px;z-index:10}.drawer button{padding:11px 16px;border:0;border-radius:9px;background:#eaf1f9}
@media(max-width:700px){.app header{height:58px;padding:0 14px}.brand{font-size:17px}.layout{grid-template-columns:1fr}.layout aside{display:flex}.layout main{display:none}.app.mobile-chat aside{display:none}.app.mobile-chat main{display:flex}.back{display:block}.messages{padding:16px 12px}.bubble{max-width:85%}.head-actions{display:none}.drawer{top:58px;height:calc(100% - 58px)}}
.modal{position:fixed;inset:0;background:#0007;display:grid;place-items:center;z-index:30;padding:20px}.modal-card{width:min(420px,92vw);background:#fff;border-radius:20px;padding:24px;box-shadow:0 20px 70px #0005}.modal-card h2{margin-top:0}.modal-card li{margin:12px 0}.modal-card button{width:100%;padding:13px;border:0;border-radius:11px;background:#1268d9;color:#fff;font-weight:700;margin-top:8px}.modal-card .secondary{background:#edf2f7;color:#26364a}
@media(max-width:700px){body{background:#fff}.app header .brand span{display:none}.app header{padding-top:env(safe-area-inset-top);height:calc(58px + env(safe-area-inset-top))}.layout aside{padding:10px}.room{padding:14px 10px}.newroom{margin-bottom:env(safe-area-inset-bottom)}.composer{padding-bottom:calc(12px + env(safe-area-inset-bottom));padding-left:10px;padding-right:10px}.composer input{min-width:0}.login-card{padding:28px}.modal-card{padding-bottom:calc(24px + env(safe-area-inset-bottom))}}

/* v1.1 모바일 입력창 안정화 */
.composer{position:relative;z-index:20;background:#fff;flex-shrink:0;pointer-events:auto}
.composer .message-input{display:block!important;flex:1 1 auto!important;min-width:0!important;width:auto!important;height:46px!important;background:#fff!important;color:#172033!important;opacity:1!important;pointer-events:auto!important;touch-action:manipulation!important;-webkit-user-select:text!important;user-select:text!important;-webkit-appearance:none!important;appearance:none!important}
.composer .message-input:focus{outline:2px solid #1268d9;outline-offset:-2px}
@media(max-width:700px){
  .composer{position:sticky;bottom:0;z-index:50}
  .composer .message-input{font-size:16px!important;height:46px!important}
  main{position:relative}
}

/* v1.2 사진/파일 미리보기 */
.image-preview{display:block;text-decoration:none;margin-top:8px;max-width:280px}
.image-preview img{display:block;width:100%;max-width:280px;max-height:280px;object-fit:cover;border-radius:12px;border:1px solid #d9e0ea}
.image-preview span{display:block;font-size:12px;color:#657184;margin-top:4px;word-break:break-all}
.filecard{display:block;text-decoration:none;color:#1268d9;margin-top:7px;padding:8px 10px;border-radius:9px;background:#f1f5fa;word-break:break-all}
.quick{display:flex;gap:7px;margin-bottom:8px}.quick button{flex:1;border:1px solid #dce3ec;background:#f6f8fb;color:#24354b;border-radius:10px;padding:9px;font-weight:700}.badge{float:right;min-width:22px;padding:2px 6px;border-radius:12px;background:#1268d9;color:#fff;font-size:11px;text-align:center}.erp-link{display:block;margin-top:8px;padding:9px;border-radius:9px;background:#edf5ff;color:#1268d9;text-decoration:none;font-weight:700}.setting-state{font-size:12px;color:#758196}.modal-input{width:100%;padding:12px;border:1px solid #dce3ec;border-radius:10px;margin-bottom:10px}.member-list{max-height:330px;overflow:auto;border:1px solid #e2e7ee;border-radius:10px;margin-bottom:10px}.member{display:flex;align-items:center;gap:10px;padding:11px;border-bottom:1px solid #edf0f4}.member:last-child{border-bottom:0}.member span{display:flex;flex-direction:column}.member small{color:#7a8797;margin-top:2px}.member input{accent-color:#1268d9}.drawer button{display:block;width:100%;margin:8px 0;text-align:left}