/* 2단계: 시대 재현 · 최소한의 설명 · 인터랙티브 메시지 */
body{background:#f0e8eb}
.page-frame{gap:0}
.page-heading,.page-note,.home-top-text{display:none!important}
.home-view{padding-top:50px}
.apps-grid{row-gap:24px}
.screen{background:#e2c9dc}
.setup-box{border-radius:17px}
.setup-heart{font-size:26px}
.setup-box h1{font-size:23px}
.setup-box p{margin-bottom:21px}
/* 일반 앱 뒤로 버튼 */
.app-nav-right{position:absolute;right:10px;display:flex;align-items:center}
.nav-icon{border:0;background:none;color:#4a555b;font-size:21px;line-height:1;padding:8px}
/* 당시 카카오톡의 채팅 탭과 입력창 */
.kakao-list{background:#fff;padding-bottom:0}
.kakao-list .app-nav{background:#fff;border-bottom:1px solid #e6e6e6}
.kakao-conversation{height:100%;display:flex;flex-direction:column;min-height:0;padding-bottom:0;background:#b4c6d2}
.kakao-conversation .app-nav{flex:0 0 49px;position:relative}
.kakao-thread{flex:1;overflow-y:auto;overscroll-behavior:contain;padding:0 0 18px;scrollbar-width:thin}
.kakao-composer{display:flex;align-items:center;gap:8px;background:#fff;min-height:59px;flex:0 0 auto;padding:8px 9px;box-shadow:0 -1px 0 #0001}
.composer-plus{font-size:23px;color:#91979a;flex:0 0 20px;text-align:center}
.composer-text{font-size:12px;color:#343738;background:#fff;border:1px solid #dddddd;min-height:35px;padding:8px 9px;border-radius:5px;flex:1;white-space:normal;line-height:1.3}
.composer-text.disabled{color:#aab2ba}
.composer-send{flex:0 0 42px;padding:9px 2px;border:0;border-radius:5px;background:#ffe05a;color:#423d29;font-weight:600;font-size:12px}
.composer-send:disabled{background:#ece8d5;color:#a49c80}
.kakao-thread .chat-date{margin-top:19px;font-size:11px}
.kakao-thread .message-line{padding-left:11px;padding-right:11px;margin:0 0 9px}
.kakao-thread .message-line .message-bubble{max-width:78%;font-size:13px}
.kakao-list .contact-row{padding-top:15px;padding-bottom:15px}
.contact-avatar.bunny{background:#e8e7df}
.typing-hint{background:#fff9;color:#6a6e74;display:block;margin:8px 20px 6px auto;width:48px;text-align:center;padding:6px;border-radius:10px}
.scene-link{display:block;width:calc(100% - 24px);margin:0 auto 10px;padding:12px 15px;border:1px solid #fff7;background:#f8f8f7c9;border-radius:7px;color:#3f4448;font-size:13px}
.scene-link span{margin-left:8px}
/* Facebook iOS 2017: 파란 상단 바 · 탭 · 실제와 유사한 피드 리듬 */
.facebook-app{min-height:100%;background:#e9ebee;color:#1d2129;padding:0 0 30px;font-family:-apple-system,BlinkMacSystemFont,'Apple SD Gothic Neo',Arial,sans-serif}
.fb2017-head{height:44px;display:flex;align-items:center;background:#3b5998;color:white;padding:2px 12px;gap:8px;position:sticky;top:0;z-index:4}
.fb2017-back{font-size:27px;color:#fff;background:none;border:0;line-height:1}
.fb2017-search{height:30px;background:#2c467d;color:#bbcae5;border-radius:4px;flex:1;padding:6px 9px;font-size:13px;letter-spacing:-.02em}
.fb2017-head-icon{font-size:17px}
.fb2017-tabs{height:43px;background:white;border-bottom:1px solid #d8dce4;display:flex;justify-content:space-around;align-items:stretch;position:sticky;top:44px;z-index:3}
.fb2017-tabs button{background:transparent;border:0;color:#878e9b;font-size:24px;flex:1;position:relative}
.fb2017-tabs button.sel{color:#4267b2}
.fb2017-tabs button.sel:after{content:"";height:3px;background:#4267b2;position:absolute;left:12px;right:12px;bottom:0}
.fb-compose{margin:7px 0 0;padding:12px 14px;color:#8b8d93;font-size:12px}
.fb-compose-actions{display:flex;justify-content:space-around;background:white;border-top:1px solid #eeeff1;padding:9px;color:#6d727a;font-weight:600;font-size:11px;margin-bottom:7px}
.fb-avatar{width:35px;height:35px;border-radius:50%;background:#dfc4d5;color:#755671;font-weight:700}
.fb-post{margin:0 0 9px;background:white;padding:12px 0 0;font-size:13px;line-height:1.6}
.fb-post-header{padding:0 12px;gap:9px;align-items:center}
.fb-post-meta{flex:1}
.fb-post-meta b{color:#365899}
.fb-post-meta small{display:block;font-size:10px;line-height:1.7;color:#989ba1}
.fb-post-more{border:0;background:transparent;color:#90949c;font-size:20px;align-self:flex-start}
.fb-body{margin:12px 0 10px;padding:0 13px;line-height:1.7;white-space:pre-line;word-break:keep-all}
.fb-engage{display:flex;justify-content:space-between;padding:7px 13px 9px;color:#8f929a;border-bottom:1px solid #e5e7ed;margin:0 12px}
.thumb-marker{background:#4267b2;padding:2px;border-radius:50%;font-size:9px}
.fb-buttons{font-size:11px;justify-content:space-around;margin:0 12px;padding:1px 0}
.fb-buttons button{border:0;background:none;font-weight:600;color:#737985;white-space:nowrap;font-size:11px;padding:9px 1px}
.fb-buttons button.liked{color:#4267b2}
.fb-comments{background:#fff;padding:7px 13px 12px}
.fb-comment{display:flex;gap:7px;margin:0 0 7px;align-items:flex-start}
.fb-avatar.mini{width:25px;height:25px;font-size:10px}
.comment-pill{border-radius:13px;background:#eff1f4;padding:6px 9px;font-size:11px;line-height:1.6;flex:1}
.comment-pill b{color:#385898}
.fb-profile{background:white;text-align:center;padding:0 0 14px;margin-bottom:9px;position:relative}
.fb-profile-cover{height:115px;background:linear-gradient(115deg,#7b96b0,#e8b4ba,#dbc2a1)}
.fb-profile-avatar{height:68px;width:68px;border-radius:50%;display:grid;place-items:center;border:4px solid white;background:#dfc4d5;color:#755671;font-size:28px;position:relative;margin:-35px auto 0}
.fb-profile strong{display:block;font-size:20px;margin:3px}
.fb-profile>span{display:block;font-size:12px;color:#748092;margin-top:12px}
.fb2017-simple{padding:18px;background:white;min-height:220px;color:#444}
.fb2017-simple button{background:none;border:0;color:#4267b2}
/* Facebook Messenger 2017: 흰 상단 메뉴, 메시지·활동 중·그룹, 사람 목록, 파란 채팅 말풍선 */
.messenger-2017{background:#fff;min-height:100%;color:#222;display:flex;flex-direction:column;font-family:-apple-system,BlinkMacSystemFont,'Apple SD Gothic Neo',sans-serif}
.ms-main-nav{height:46px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #f0f0f0;padding:0 13px;background:#fff;position:sticky;top:0;z-index:5}
.ms-main-nav b{font-size:18px;font-weight:650}
.ms-main-nav button{color:#0084ff;border:0;background:none;font-size:25px;padding:5px}
.ms-search{margin:9px 14px 7px;padding:8px;border-radius:8px;background:#f0f1f3;color:#92969b;font-size:12px}
.ms-tab-nav{display:flex;justify-content:space-around;border-bottom:1px solid #eaecef;min-height:37px}
.ms-tab-nav button{font-size:12px;font-weight:650;color:#92999e;background:none;border:0;flex:1;position:relative}
.ms-tab-nav button.selected{color:#0084ff}
.ms-tab-nav button.selected:after{content:"";position:absolute;bottom:0;left:25%;right:25%;height:2px;background:#0084ff}
.ms-day{display:flex;gap:10px;padding:11px 12px 9px;overflow:auto;border-bottom:1px solid #f0f1f3;flex:none;scrollbar-width:none}
.ms-day-item{flex:0 0 58px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:3px}
.ms-day-circle{border:2px solid #238afd;border-radius:50%;height:44px;width:44px;display:grid;place-items:center;color:#515b66;font-size:16px}
.ms-day-circle.mine{color:#2489ff;border:2px dashed #72a7d9}
.ms-day-item span{font-size:10px;color:#7e848f}
.ms-list{flex:1}
.ms-conversation-row{border:0;background:white;text-align:left;width:100%;display:flex;align-items:center;gap:10px;padding:11px 13px}
.ms-avatar{height:49px;width:49px;flex:none;border-radius:50%;display:grid;place-items:center;color:#52525f;font-weight:700;position:relative}
.ms-avatar i{height:12px;width:12px;background:#41c45a;border-radius:50%;position:absolute;right:0;bottom:0;border:2px solid white}
.ms-description{display:flex;flex-direction:column;gap:4px;flex:1;min-width:0}
.ms-description b{font-size:14px}
.ms-description small{color:#9ba0aa;font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ms-conversation-row time{align-self:flex-start;color:#aeb4ba;font-size:10px;margin-top:5px}
.ms-bottom{margin-top:auto;height:52px;display:flex;justify-content:space-around;align-items:center;border-top:1px solid #eee;background:#fff;position:sticky;bottom:0;z-index:3}
.ms-bottom button{color:#9da6ae;border:0;background:none;min-width:42px;font-size:9px;display:flex;flex-direction:column;align-items:center;gap:1px}
.ms-bottom button span{font-size:20px}
.ms-bottom button.selected{color:#0084ff}
.ms-bottom .ms-camera{border-radius:50%;background:#0084ff;color:white;height:36px;width:36px;font-size:22px;display:grid;place-items:center}
.ms-active-list{flex:1}.ms-person{display:flex;align-items:center;gap:10px;padding:13px;border-bottom:1px solid #eee;font-size:13px}.ms-person small{color:#43bd66;margin-left:auto}
.ms-empty{color:#a1a8ac;text-align:center;padding-top:65px;font-size:13px;flex:1}
.ms-chat-app{height:100%;background:white;display:flex;flex-direction:column;min-height:0}
.ms-chat-head{height:50px;flex:0 0 50px;display:flex;justify-content:space-between;align-items:center;padding:0 10px;border-bottom:1px solid #eee;color:#0084ff}
.ms-chat-head button{background:none;color:#0084ff;border:0;font-size:25px;white-space:nowrap}
.ms-chat-head button span{font-size:12px;vertical-align:3px}
.ms-chat-person{text-align:center;display:flex;flex-direction:column;gap:2px;transform:translateX(14px)}
.ms-chat-person b{font-size:14px;color:#242b34}.ms-chat-person small{font-size:10px;color:#929aa5}
.ms-chat-head>span{font-size:20px}
.ms-chat-contents{flex:1;overflow-y:auto;padding:14px 11px}
.ms-chat-date{text-align:center;color:#bbc0c5;font-size:11px;margin:12px 0 21px}
.ms-bubble-line{display:flex;align-items:flex-end;gap:5px;margin:9px 0}
.ms-bubble-line.out{justify-content:flex-end}
.ms-bubble-line>div{border-radius:16px;font-size:13px;line-height:1.45;padding:9px 13px;max-width:75%;background:#eee;color:#1f2529;word-break:keep-all}
.ms-bubble-line.out>div{background:#0084ff;color:#fff}
.ms-mini-avatar{border-radius:50%;width:23px;height:23px;flex:none;display:grid;place-items:center;font-size:10px}
.ms-chat-composer{height:54px;display:flex;align-items:center;gap:11px;color:#0084ff;font-size:20px;padding:8px 10px;border-top:1px solid #eee}
.ms-chat-composer .ms-input{flex:1;border:1px solid #ddd;border-radius:16px;color:#9ea6ae;padding:7px 10px;font-size:12px}
/* 대학생 메모 및 사진 */
.notes-app{min-height:100%;background:#fff4ce}.notes-sheet{padding:22px;font-size:13px;line-height:2.2;color:#474444}
.photos-app{min-height:100%;background:#fff}.photo-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;padding-top:10px}
.photo-tile{border:0;height:98px;background:#d7cad7;color:white;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:4px}
.photo-tile span{font-size:35px}.photo-tile small{font-size:10px}.photo-tile.t1{background:#b0c6d4}.photo-tile.t2{background:#efcbb1}.photo-tile.t3{background:#d0b4c6}.photo-tile.t4{background:#bdc9b5}.photo-tile.t5{background:#a9b4cc}
.recent-phone{background:white;min-height:100%}.generic-app{background:#fff;min-height:100%;}.generic-icon{text-align:center;padding-top:140px;color:#c9ccd1;font-size:35px}
.settings-save.muted{background:#9297a1}
/* 전화: 안내문과 상자 완전 제거, 자막만 중앙에 조용히 표시 */
.call-view{background:linear-gradient(160deg,#454a56,#181c28 78%);padding:62px 23px 21px}
.call-live{position:relative;margin-top:73px;width:100%;min-height:172px;background:none!important;border:0!important;backdrop-filter:none!important;box-shadow:none!important;padding:7px 8px;display:flex;flex-direction:column;align-items:center;text-align:center;justify-content:center}
.call-bubble-name{color:#d6d4de;letter-spacing:.17em;font-size:11px;margin:0 0 12px;font-weight:400}
.call-dialogue{color:#fff;font-weight:350;line-height:1.7;min-height:0;font-size:21px;text-shadow:0 1px 9px #0006;letter-spacing:-.025em}
.call-dialogue.just-changed{animation:captionRise .35s ease}
@keyframes captionRise{from{opacity:.25;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
.call-connected-actions{position:absolute;bottom:40px;left:0;right:0;gap:32px}
.next-dialogue{font-size:12px;color:#e5e7eb99;background:transparent;border:0;padding:5px}
.next-dialogue span{font-size:22px;vertical-align:-2px}
.end-call{width:64px;min-width:64px;height:64px;background:#eb4a54;font-size:27px;border-radius:50%;transform:none;display:grid;place-items:center}
.end-call svg{transform:rotate(135deg)}
/* 엔딩 초안은 검은 화면에 순수 텍스트로, 사진은 최종 확정 시 삽입 */
.ending-view{background:#0a0a0b;overflow-y:auto;color:#efeff0;flex-direction:column;z-index:10;padding:92px 29px 35px;align-items:stretch}
.ending-story{min-height:100%;display:flex;flex-direction:column;justify-content:center}
.ending-copy{font-size:14px;font-weight:400;line-height:2.25;letter-spacing:-.02em;word-break:keep-all}
.ending-copy p{margin:0 0 22px}.ending-copy .ending-gap{margin-top:42px}
.ending-placeholder{color:#dad0d4;letter-spacing:2em;font-size:25px;text-align:center;margin:40px 0 42px}
.ending-replay{color:#aaa6a9;border:0;background:none;font-size:11px;padding:13px}
/* 화면의 날짜 외에 연도를 설명하는 문구를 표시하지 않음 */
@media(max-width:430px){.home-view{padding-top:54px}.call-live{margin-top:80px}.ending-view{padding:92px 30px 28px}}

/* 3단계: 독립된 iOS 10 스타일 문자(SMS) 앱 */
.app-square.sms{background:#55c85e;color:#fff;font-size:28px;font-weight:700;text-shadow:none;position:relative}
.app-square.sms::before{content:"";width:33px;height:24px;display:block;position:absolute;left:12px;top:13px;background:#fff;border-radius:48% 48% 48% 48%}
.app-square.sms::after{content:"";position:absolute;left:16px;top:33px;width:10px;height:9px;clip-path:polygon(0 0,100% 0,0 100%);background:#fff}
.app-square.sms{font-size:0}
.sms-app{min-height:100%;height:100%;background:#fff;color:#24272e;font-family:-apple-system,BlinkMacSystemFont,'Apple SD Gothic Neo',sans-serif}
.sms-head{background:#f8f8fa;border-bottom:1px solid #d9d9df;min-height:49px;display:flex;align-items:center;justify-content:space-between;padding:0 11px;position:sticky;top:0;z-index:5}
.sms-head b{font-size:17px;font-weight:600}
.sms-text-button{font-size:15px;color:#1687ef;background:transparent;border:0;padding:9px 1px;min-width:60px;text-align:left}
.sms-edit{font-size:14px;color:#1687ef;min-width:60px;text-align:right}
.sms-list-app{display:flex;flex-direction:column}
.sms-search{margin:10px 12px 8px;border-radius:9px;background:#e8e8ec;color:#8c8c94;padding:9px 13px;font-size:13px}
.sms-search span{color:#8e8f96;font-size:17px}
.sms-threads{flex:1}
.sms-thread-row{width:100%;display:flex;align-items:center;gap:12px;text-align:left;border:0;background:#fff;padding:13px 15px 13px 12px;position:relative;min-height:76px}
.sms-thread-row::after{content:"";height:1px;position:absolute;bottom:0;right:0;left:67px;background:#ededf0}
.sms-contact-icon{width:45px;height:45px;border-radius:50%;flex:none;background:#bec1c9;color:#fff;font-size:17px;display:grid;place-items:center}
.sms-row-content{min-width:0;flex:1;display:flex;flex-direction:column;gap:5px}
.sms-row-title{display:flex;align-items:center;justify-content:space-between;gap:4px;line-height:1.1}
.sms-row-title b{font-weight:600;font-size:15px}
.sms-row-title small{font-size:11px;color:#b2b3b8;white-space:nowrap}
.sms-preview{color:#898d95;font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sms-unread{height:8px;width:8px;position:absolute;left:3px;top:35px;background:#1687ef;border-radius:50%}
.sms-compose-bar{height:46px;border-top:1px solid #e5e5e8;color:#1687ef;display:flex;align-items:center;justify-content:center;gap:9px;font-size:12px}
.sms-compose-bar span:first-child{font-size:21px}
.sms-chat-app{display:flex;flex-direction:column;min-height:0}
.sms-info{color:#1687ef;font-size:22px;min-width:40px;text-align:right}
.sms-chat-scroll{flex:1;min-height:0;overflow-y:auto;padding:11px 12px 20px}
.sms-recipient{display:flex;flex-direction:column;align-items:center;gap:6px;color:#22252a;margin:13px 0 23px}
.sms-person-icon{width:58px;height:58px;border-radius:50%;background:#bac0c6;color:#fff;display:grid;place-items:center;font-size:22px}
.sms-recipient strong{font-size:14px}.sms-recipient small{color:#aeb3b9;font-size:11px}
.sms-stamp{text-align:center;font-size:11px;color:#aeb3b9;margin:0 0 22px}
.sms-message-row{display:flex;margin:9px 0;align-items:flex-end}.sms-message-row.out{justify-content:flex-end}.sms-message-row.in{justify-content:flex-start}
.sms-message{display:block;max-width:78%;padding:10px 13px;font-size:14px;line-height:1.5;border-radius:18px;word-break:keep-all;white-space:pre-wrap;background:#e8e9ed;color:#191b20}
.sms-message-row.out .sms-message{background:#4fc45a;color:#fff;border-bottom-right-radius:6px}
.sms-message-row.in .sms-message{border-bottom-left-radius:6px}
.sms-bottom-input{min-height:54px;background:#fbfbfd;border-top:1px solid #e9e9ec;padding:7px 10px;display:flex;align-items:center;gap:9px}
.sms-plus{font-size:23px;color:#acadb3}
.sms-bottom-input>div{border:1px solid #dddddf;border-radius:17px;padding:8px 11px;color:#a8abb2;font-size:13px;flex:1}
.sms-send-arrow{width:27px;height:27px;background:#cbced3;color:#fff;display:grid;place-items:center;border-radius:50%;font-size:19px}
/* 페이지 출처와 사람들 목록: 연도를 설명하는 장식 문구는 추가하지 않음 */
.fb-context{padding:8px 12px 0;background:#fff;color:#737b86;font-size:11px;border-bottom:1px solid #f1f1f3}
.fb-page-label{font-size:10px;color:#87919e;background:#f2f3f5;border-radius:3px;margin-left:6px;padding:1px 4px}
.fb-friend{display:flex;align-items:center;gap:12px;font-size:14px;padding:10px 0;border-bottom:1px solid #eee}
.fb-friend .fb-avatar{display:grid;place-items:center}
/* Step04 — 피드의 사진/태그/댓글 답글과 더 길어진 친구 목록 */
.fb-photo-wrap{width:100%;margin:3px 0 0;background:#e3e6ed;min-height:215px;position:relative;overflow:hidden}
.fb-photo-wrap img{width:100%;height:auto;max-height:320px;object-fit:cover;display:block}
.fb-photo-fallback{display:none;min-height:215px;align-items:center;justify-content:center;flex-direction:column;color:#636d7c;font-size:13px;gap:8px;background:linear-gradient(140deg,#cdd2df,#e3d2d3)}
.fb-photo-fallback small{font-size:11px;color:#798292}
.fb-photo-wrap.photo-failed img{display:none}.fb-photo-wrap.photo-failed .fb-photo-fallback{display:flex}
.fb-mention{color:#3561a0;font-weight:600}
.fb-comment-unit{margin:0 0 6px}
.fb-replies{margin:3px 0 0 29px;padding-left:9px;border-left:1px solid #e3e5e8}
.fb-reply .fb-avatar.mini{transform:scale(.83)}
.fb-friend>div{display:flex;flex-direction:column;gap:4px}
.fb-friend b{font-size:13px;font-weight:600}
.fb-friend small{font-size:11px;color:#8b94a2}
.fb-friend-total{font-weight:400;font-size:12px;color:#999}
/* 페메 채팅 대화가 많아져도 대화창에서 스크롤 */
.ms-chat-contents{overflow-y:auto;min-height:0}
.kakao-thread{overflow-y:auto;min-height:0}

/* STEP 06: 2017년 처음부터 날짜별로 쌓인 채팅, 묶음 말풍선 */
.kakao-conversation .date-jumpbar{background:#b4c6d2;display:flex;align-items:center;justify-content:space-between;gap:8px;flex:0 0 34px;border-bottom:1px solid #a4b9c8;color:#536673;padding:0 11px;font-size:10px}
.date-jumpbar button{background:transparent;color:#465e6b;border:0;font-size:11px;padding:5px 6px}
.kakao-thread .chat-date{font-size:10.5px;letter-spacing:.012em;color:#59717f;background:#ffffff28;border-radius:14px;padding:5px 11px;width:max-content;max-width:90%;margin:22px auto 17px}
.kakao-thread .message-line.grouped{margin-top:-7px}
.kakao-thread .message-line.grouped .message-avatar{visibility:hidden}
.kakao-thread .message-bubble{font-size:13px;line-height:1.55;word-break:break-word}
.kakao-thread .message-time{color:#627987;font-size:9px;flex:none;padding-bottom:2px;min-width:28px}
.kakao-thread .message-line.me .message-time{order:0}
.kakao-thread .message-line.me .message-bubble{order:1}
.kakao-thread .message-line.them .message-time{order:2}
.kakao-thread .message-line.archive-group{margin-bottom:3px}
.ms-chat-contents .ms-chat-date{margin:17px auto 17px;color:#a9b1bd;font-size:11px}
.ms-bubble-line.grouped{margin-top:-5px}
.ms-bubble-line.grouped .ms-mini-avatar{visibility:hidden}
.ms-bubble-line .ms-time{align-self:flex-end;color:#9ba2ab;font-size:9px;white-space:nowrap}
.ms-bubble-line.out .ms-time{order:0}
.ms-bubble-line.out>div:not(.ms-time){order:1}
.ms-bubble-line.in .ms-time{order:2}
.kakao-list .contact-row time{font-size:10px}
/* STEP 07: 단톡 참여자별 카카오톡 프로필, 옛날 셀카는 이미지 실패 시 이니셜 표시 */
.portrait-avatar{position:relative;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0}
.portrait-avatar>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:inherit;z-index:1}
.portrait-avatar>span{position:relative;z-index:0}
.contact-avatar.portrait-avatar{font-size:13px}
.group-person{align-items:flex-end}
.group-person .message-avatar{margin-bottom:1px}
.group-message-content{display:flex;flex-direction:column;align-items:flex-start;max-width:77%;gap:4px}
.group-message-content .message-bubble{max-width:100%!important}
.group-sender{font-size:11px;color:#3f5160;line-height:1.2;margin-left:2px}
.kakao-thread .group-person.grouped{margin-top:-5px}
.kakao-thread .group-person.grouped .message-avatar{visibility:hidden}
.ms-avatar.portrait-avatar{font-size:16px}
.ms-mini-avatar.portrait-avatar{font-size:10px}
.ms-day-circle{position:relative;overflow:hidden}
/* Facebook 새 글 실시간 도착 */
.fb-live-new{padding:9px 12px;background:#e7edf8;color:#3b5c91;font-size:11px;display:flex;align-items:center;justify-content:center;gap:7px;border-bottom:1px solid #d5dfeb;animation:feedPulse .65s ease}
.fb-live-dot{width:7px;height:7px;background:#4267b2;border-radius:50%}
@keyframes feedPulse {from{transform:translateY(-7px);opacity:0}to{transform:translateY(0);opacity:1}}
/* iOS 스타일 페이스북 메신저 알림: 누르면 해당 대화방 진입 */
.live-messenger-notice{position:absolute;top:33px;left:8px;right:8px;z-index:40;display:flex;align-items:center;gap:9px;min-height:64px;text-align:left;border:1px solid #eceff7;border-radius:13px;background:rgba(249,251,255,.97);box-shadow:0 6px 22px #0003;padding:9px;opacity:0;transform:translateY(-115px);pointer-events:none;transition:opacity .25s ease,transform .3s ease;color:#202738}
.live-messenger-notice.visible{opacity:1;transform:translateY(0);pointer-events:auto}
.live-ms-symbol{background:#0887ff;color:white;height:36px;width:36px;border-radius:9px;display:grid;place-items:center;font-size:28px}
.live-messenger-notice>span:nth-child(2){display:flex;flex-direction:column;gap:4px;flex:1;min-width:0}
.live-messenger-notice b{font-size:11px;font-weight:600}.live-messenger-notice small{font-size:12px;color:#4c5361}
.live-ms-now{font-size:10px;color:#8a929f;align-self:flex-start}
/* 엔딩의 사탕은 사진을 확정하기 전 임시 실루엣. */
.ending-sweets{height:180px;display:flex;align-items:center;justify-content:center;gap:42px;position:relative;margin:13px auto 40px;width:100%;max-width:270px;border-radius:10px;background:radial-gradient(circle at 50% 40%,#19191e,#0d0d10)}
.ending-sweets .lolli{position:relative;width:49px;height:49px;border-radius:50%;background:radial-gradient(circle at 30% 24%,#ffeacf,#ff9f99 48%,#c34d69 100%);transform:rotate(-22deg);box-shadow:inset -5px -7px 11px #0003,0 5px 14px #0004}
.ending-sweets .lolli::after{content:'';position:absolute;top:45px;left:23px;width:4px;height:69px;background:#ddd4ce;border-radius:3px;transform:rotate(-3deg)}
.ending-sweets .lolli.two{background:radial-gradient(circle at 30% 24%,#fff6b5,#a4d6ea 55%,#4b85ac);transform:rotate(30deg)}
.ending-sweets .sweet-label{position:absolute;top:18px;font-size:15px;color:#8e8790}