*{margin:0;padding:0;box-sizing:border-box}:root{--kakao-yellow: #fee500;--kakao-brown: #3c1e1e;--kakao-bg: #b2c7da;--kakao-chat-bg: #ffffff;--kakao-my-bubble: #fee500;--kakao-other-bubble: #ffffff;--kakao-text: #000000;--kakao-secondary-text: #666666;--kakao-border: #e5e5e5;--kakao-profile-bg: #f7f7f7;--kakao-shadow: rgba(0, 0, 0, .1)}body{font-family:Apple SD Gothic Neo,Malgun Gothic,맑은 고딕,system-ui,-apple-system,sans-serif;line-height:1.4;color:var(--kakao-text);background:linear-gradient(180deg,var(--kakao-bg) 0%,#9fb8cc 100%);min-height:100vh}section{max-width:400px;margin:0 auto 1rem;padding:0;background:transparent;border-radius:0;box-shadow:none}.chat-room{background:var(--kakao-chat-bg);border-radius:12px;overflow:hidden;box-shadow:0 2px 12px var(--kakao-shadow);margin-bottom:1rem}.chat-header{background:var(--kakao-yellow);padding:12px 16px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--kakao-border)}.chat-title h2{font-size:1.1rem;font-weight:600;color:var(--kakao-brown);margin:0;border-bottom:none;text-align:left}.participant-count{font-size:.9rem;color:var(--kakao-secondary-text);margin-left:8px}.chat-menu-btn{background:none;border:none;font-size:1.2rem;color:var(--kakao-brown);cursor:pointer;padding:4px;border-radius:4px}.chat-menu-btn:hover{background:#3c1e1e1a}.chat-messages{padding:16px;background:var(--kakao-chat-bg);min-height:200px}.chat-message{display:flex;margin-bottom:12px;align-items:flex-start}.chat-message.my-message{flex-direction:row-reverse}.message-profile{margin-right:8px;flex-shrink:0}.chat-message.my-message .message-profile{margin-right:0;margin-left:8px}.profile-image{width:36px;height:36px;border-radius:50%;object-fit:cover;object-position:center 10%}.profile-placeholder{width:36px;height:36px;border-radius:50%;background:var(--kakao-profile-bg);display:flex;align-items:center;justify-content:center;font-size:.9rem;font-weight:600;color:var(--kakao-secondary-text)}.message-content{max-width:70%}.chat-message.my-message .message-content{text-align:right}.message-sender{font-size:.8rem;color:var(--kakao-secondary-text);margin-bottom:4px;font-weight:500}.message-bubble-container{display:flex;align-items:flex-end;gap:4px}.chat-message.my-message .message-bubble-container{flex-direction:row-reverse}.message-bubble{background:var(--kakao-other-bubble);padding:8px 12px;border-radius:16px;max-width:240px;word-wrap:break-word;line-height:1.4;font-size:.9rem;box-shadow:0 1px 2px #0000001a;border:1px solid var(--kakao-border);white-space:pre-line}.chat-message.my-message .message-bubble{background:var(--kakao-my-bubble);color:var(--kakao-brown)}.message-time{font-size:.7rem;color:var(--kakao-secondary-text);white-space:nowrap;align-self:flex-end;margin-bottom:2px}.system-message{text-align:center;margin:16px 0;padding:8px 16px;background:#0000000d;border-radius:16px;font-size:.8rem;color:var(--kakao-secondary-text)}.system-icon{margin-right:6px}.system-text{font-weight:500}.kakao-profile-card{background:var(--kakao-profile-bg);border:1px solid var(--kakao-border);border-radius:12px;padding:12px;margin:8px 0;display:flex;align-items:center;gap:12px;cursor:pointer;transition:all .2s ease}.kakao-profile-card:hover{background:#eee;transform:translateY(-1px);box-shadow:0 2px 8px var(--kakao-shadow)}.kakao-profile-image{flex-shrink:0}.kakao-profile-image img{width:48px;height:48px;border-radius:50%;object-fit:cover;border:2px solid var(--kakao-border);margin-top:12px}.kakao-profile-info{flex:1}.kakao-profile-name{font-size:1rem;font-weight:600;color:var(--kakao-text);margin-bottom:2px}.kakao-profile-role{font-size:.8rem;color:var(--kakao-secondary-text);margin-bottom:4px}.kakao-profile-message{font-size:.85rem;color:var(--kakao-text);font-style:italic;opacity:.8}.kakao-profile-arrow{font-size:1.2rem;color:var(--kakao-secondary-text)}h1,h2,h3{color:#2c3e50;margin-bottom:1rem}h1{font-size:2rem;text-align:center}h2{font-size:1.5rem;border-bottom:2px solid #e8f4f8;padding-bottom:.5rem}h3{font-size:1.2rem;color:#34495e}.intro-section{text-align:center;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.intro-section h1,.intro-section h2,.intro-section h3{color:#fff}.hero-image{margin-bottom:2rem}.hero-image img{width:200px;height:200px;border-radius:50%;object-fit:cover;border:4px solid white;box-shadow:0 4px 12px #0003}.event-title{font-size:2.5rem;margin-bottom:1rem;font-weight:700}.event-details{font-size:1.2rem;margin-bottom:1.5rem;opacity:.9}.greeting{font-size:1.1rem;background:#ffffff1a;padding:1rem;border-radius:8px;margin-top:1rem}.schedule-list{list-style:none;margin-bottom:2rem}.schedule-list li{padding:.8rem 1rem;margin-bottom:.5rem;background:#f8f9fa;border-left:4px solid #667eea;border-radius:4px;position:relative}.schedule-list li:before{content:counter(step-counter);counter-increment:step-counter;position:absolute;left:-1.5rem;top:50%;transform:translateY(-50%);width:1.5rem;height:1.5rem;background:#667eea;color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.8rem;font-weight:700}.schedule-list{counter-reset:step-counter;padding-left:2rem}.addressing-guide{background:#e8f4f8;padding:1.5rem;border-radius:8px;border-left:4px solid #3498db}.family-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.5rem;margin-top:1.5rem}.family-card{background:#f8f9fa;padding:1.5rem;border-radius:8px;border:1px solid #e9ecef;transition:transform .2s,box-shadow .2s;position:relative}.family-card.clickable{cursor:pointer}.family-card.clickable:hover{transform:translateY(-2px);box-shadow:0 4px 12px #00000026}.family-card.clickable:hover .click-hint{opacity:1}.click-hint{position:absolute;bottom:.8rem;left:50%;transform:translate(-50%);background:#000c;color:#fff;padding:.3rem .8rem;border-radius:12px;font-size:.8rem;opacity:0;transition:opacity .2s;pointer-events:none}.member-photo{text-align:center;margin-bottom:1rem}.member-photo img{width:80px;height:80px;border-radius:50%;object-fit:cover;border:3px solid #e9ecef}.member-relationship{font-size:.9rem;color:#6c757d;font-weight:500}.member-name{font-size:1.2rem;font-weight:600;color:#2c3e50;margin:.5rem 0}.member-message{font-style:italic;color:#5a6c7d;font-size:.95rem}.groom-side .family-card{border-left:4px solid #3498db}.bride-side .family-card{border-left:4px solid #e74c3c}.couple-intro{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:2rem;margin-bottom:3rem}.person-intro{background:#f8f9fa;padding:1.5rem;border-radius:8px}.person-intro.groom{border-left:4px solid #3498db}.person-intro.bride{border-left:4px solid #e74c3c}.hobbies{margin-top:1rem;font-size:.95rem;color:#5a6c7d}.shared-values{background:#e8f4f8;padding:1.5rem;border-radius:8px;margin-bottom:2rem}.shared-values ul{list-style:none;padding-left:0}.shared-values li{position:relative;padding:.5rem 0 .5rem 1.5rem}.shared-values li:before{content:"💝";position:absolute;left:0}.timeline{position:relative;padding-left:2rem}.timeline:before{content:"";position:absolute;left:1rem;top:0;bottom:0;width:2px;background:#667eea}.timeline-event{position:relative;margin-bottom:2rem;background:#fff;padding:1.5rem;border-radius:8px;box-shadow:0 2px 4px #0000001a}.timeline-event:before{content:"";position:absolute;left:-2.2rem;top:1.5rem;width:12px;height:12px;background:#667eea;border-radius:50%;border:3px solid white;box-shadow:0 0 0 3px #667eea}.timeline-year{position:absolute;left:-6rem;top:1.2rem;background:#667eea;color:#fff;padding:.3rem .8rem;border-radius:12px;font-size:.9rem;font-weight:600;white-space:nowrap}.timeline-content h4{color:#2c3e50;margin-bottom:.5rem}.timeline-content p{color:#5a6c7d;line-height:1.5}.vows-list{margin-bottom:3rem}.vow-item{display:flex;align-items:flex-start;padding:1rem;margin-bottom:.8rem;background:#f8f9fa;border-radius:8px;border-left:4px solid #27ae60}.vow-number{background:#27ae60;color:#fff;width:2rem;height:2rem;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:600;font-size:.9rem;margin-right:1rem;flex-shrink:0}.vow-text{flex:1;line-height:1.5}.contacts-section{background:#f8f9fa;padding:2rem;border-radius:8px;margin-top:2rem}.contacts-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1.5rem;margin-top:1.5rem}.contact-card{background:#fff;padding:1.5rem;border-radius:8px;border:1px solid #e9ecef;display:flex;justify-content:space-between;align-items:center}.contact-name{font-weight:600;color:#2c3e50;margin-bottom:.3rem}.contact-role{font-size:.9rem;color:#6c757d}.contact-qr{text-align:center}.qr-code{width:60px;height:60px;border-radius:4px}.contact-qr small{display:block;margin-top:.3rem;font-size:.7rem;color:#6c757d}.modal-backdrop{position:fixed;inset:0;background:#0009;display:flex;align-items:center;justify-content:center;z-index:1000;padding:2rem;animation:modalBackdropFadeIn .2s ease-out}.modal-content{background:#fff;border-radius:12px;max-width:600px;width:100%;max-height:90vh;overflow:hidden;box-shadow:0 8px 32px #0000004d;animation:modalContentSlideIn .3s ease-out}.modal-header{display:flex;justify-content:space-between;align-items:center;padding:1.5rem 2rem;border-bottom:1px solid #e9ecef;background:#f8f9fa}.modal-title{margin:0;color:#2c3e50;font-size:1.3rem}.modal-close-button{background:none;border:none;font-size:2rem;color:#6c757d;cursor:pointer;padding:0;width:2rem;height:2rem;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:all .2s}.modal-close-button:hover{background:#e9ecef;color:#495057}.modal-body{padding:2rem;overflow-y:auto;max-height:calc(90vh - 120px)}.member-detail{display:flex;gap:2rem;flex-direction:column}.member-detail-photo{height:200px;text-align:center}.member-detail-photo>img{width:100%;height:100%;border-radius:8px;object-fit:cover;object-position:50% 50%;border:4px solid #e9ecef}.member-basic-info{text-align:center;margin-bottom:2rem;padding-bottom:1rem;border-bottom:2px solid #e9ecef}.member-basic-info h4{font-size:1.5rem;color:#2c3e50;margin-bottom:.5rem}.member-relationship-detail{font-size:1.1rem;color:#6c757d;margin-bottom:.3rem}.member-age{font-size:1rem;color:#495057}.detail-section{margin-bottom:1.5rem;padding:1rem;background:#f8f9fa;border-radius:8px;border-left:4px solid #667eea}.detail-section strong{color:#2c3e50;font-weight:600}.mbti-badge{background:#667eea;color:#fff;padding:.3rem .8rem;border-radius:20px;font-size:.9rem;font-weight:600}.motto{border-left-color:#27ae60}.motto-text{font-style:italic;margin-top:.5rem;padding:.8rem;background:#27ae601a;border-radius:6px;margin-bottom:0}.special-note{border-left-color:#e74c3c}.special-note-text{margin-top:.5rem;line-height:1.6;margin-bottom:0}.member-message-section{background:#e8f4f8;padding:1.5rem;border-radius:8px;border-left:4px solid #3498db;margin-top:1rem}.member-message-detail{font-style:italic;font-size:1.1rem;color:#2c3e50;margin-top:.5rem;margin-bottom:0}.member-detail-simple{text-align:center;padding:2rem}.no-detail-info{color:#6c757d;font-style:italic;margin-top:1rem}@keyframes modalBackdropFadeIn{0%{opacity:0}to{opacity:1}}@keyframes modalContentSlideIn{0%{opacity:0;transform:translateY(-20px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.app{padding:16px;max-width:420px;margin:0 auto}.unified-chat-section .chat-messages{min-height:100vh;padding:16px}.animated-section{opacity:0;transform:translateY(30px);transition:all .6s cubic-bezier(.4,0,.2,1)}.animated-section.visible{opacity:1;transform:translateY(0)}.fade-in-up{opacity:0;transform:translateY(30px);transition:all .8s cubic-bezier(.4,0,.2,1)}.fade-in-up.visible{opacity:1;transform:translateY(0)}.fade-in-left{opacity:0;transform:translate(-30px);transition:all .6s cubic-bezier(.4,0,.2,1)}.fade-in-left.visible{opacity:1;transform:translate(0)}.fade-in-right{opacity:0;transform:translate(30px);transition:all .6s cubic-bezier(.4,0,.2,1)}.fade-in-right.visible{opacity:1;transform:translate(0)}.scale-in{opacity:0;transform:scale(.8);transition:all .5s cubic-bezier(.4,0,.2,1)}.scale-in.visible{opacity:1;transform:scale(1)}.chat-message{opacity:0;transform:translateY(20px);transition:all .6s cubic-bezier(.4,0,.2,1)}.chat-message.visible{opacity:1;transform:translateY(0)}.system-message{opacity:0;transform:scale(.9);transition:all .5s cubic-bezier(.4,0,.2,1)}.system-message.visible{opacity:1;transform:scale(1)}.kakao-profile-card{opacity:0;transform:translateY(15px);transition:all .6s cubic-bezier(.4,0,.2,1)}.kakao-profile-card.visible{opacity:1;transform:translateY(0)}.intro-section:not(.kakao-style),.family-section:not(.kakao-style),.schedule-section:not(.kakao-style){display:none}@media (max-width: 768px){.app{padding:8px}section{max-width:100%;margin:0 0 .5rem}.chat-room{border-radius:8px}.chat-header{padding:10px 12px}.chat-messages{padding:12px}.message-bubble{max-width:200px;font-size:.85rem}.kakao-profile-card{padding:10px;gap:10px}.kakao-profile-image img{width:40px;height:40px}.kakao-profile-name{font-size:.9rem}.kakao-profile-role{font-size:.75rem}.kakao-profile-message{font-size:.8rem}.modal-backdrop{padding:1rem}.modal-content{max-width:100%;margin:0;border-radius:12px 12px 0 0;max-height:80vh}.modal-header{padding:1rem 1.5rem;background:var(--kakao-yellow)}.modal-title,.modal-close-button{color:var(--kakao-brown)}.modal-body{padding:1.5rem}.member-detail{gap:1rem}.member-detail-photo>img{width:100%}}@media (max-width: 480px){.app{padding:4px}.chat-header{padding:8px 10px}.chat-title h2{font-size:1rem}.participant-count{font-size:.8rem}.chat-messages{padding:10px}.message-bubble{max-width:180px;padding:6px 10px;font-size:.8rem}.profile-image,.profile-placeholder{width:32px;height:32px}.kakao-profile-card{padding:8px;gap:8px}.kakao-profile-image img{width:36px;height:36px}}.app{min-height:100vh;padding:2rem 0}html{scroll-behavior:smooth}@media print{.app{padding:0}section{margin-bottom:2rem;box-shadow:none;border:1px solid #ddd;page-break-inside:avoid}.contact-qr{display:none}}
