.phone-container{display:flex;justify-content:center;align-items:center;perspective:1000px;padding:40px 20px}.phone-frame{position:relative;width:390px;height:844px;background:#000;border-radius:55px;padding:12px;box-shadow:0 0 0 12px #1f1f1f,0 0 0 14px #2d2d2d,0 30px 60px #0006;transform:rotateY(-15deg) rotateX(5deg) rotate(-2deg);transition:transform .3s ease;overflow:hidden}.phone-frame:hover{transform:rotateY(-12deg) rotateX(3deg) rotate(-1deg)}.phone-screen{position:relative;width:100%;height:100%;background:#fff;border-radius:43px;overflow:hidden}.phone-dynamic-island{position:absolute;top:12px;left:50%;transform:translate(-50%);width:160px;height:30px;background:#000;border-radius:0 0 20px 20px;z-index:20;display:flex;align-items:center;justify-content:center;gap:8px}.phone-dynamic-island:before{content:"";width:12px;height:12px;background:#0a1a2a;border-radius:50%;border:1px solid #1a2a3a}.phone-dynamic-island:after{content:"";width:60px;height:6px;background:#0a1a2a;border-radius:3px}.phone-status-bar{position:absolute;top:12px;left:12px;right:12px;height:44px;display:flex;align-items:center;justify-content:space-between;padding:0 20px;z-index:15;color:#000;font-size:15px;font-weight:600}.phone-status-left{display:flex;align-items:center;gap:4px;font-size:16px}.phone-status-center{position:absolute;left:50%;transform:translate(-50%);font-weight:700;font-size:16px}.phone-status-right{display:flex;align-items:center;gap:4px;font-size:14px}.phone-battery{width:24px;height:12px;border:1px solid white;border-radius:2px;position:relative}.phone-battery:after{content:"";position:absolute;right:-3px;top:2px;width:2px;height:8px;background:#fff;border-radius:0 1px 1px 0}.phone-battery-fill{position:absolute;top:1px;left:1px;height:8px;background:#4ade80;border-radius:1px;width:85%}.phone-messages-container{position:absolute;inset:44px 0 80px;background:#fff;overflow-y:auto;overflow-x:hidden;padding:0}.phone-messages-container::-webkit-scrollbar{display:none}.phone-messages{display:flex;flex-direction:column;gap:0;min-height:100%;padding:12px 16px 20px}.phone-date-separator{text-align:center;font-size:13px;color:#8e8e93;margin:8px 0 16px;font-weight:500;position:relative}.phone-date-separator:before{content:"";position:absolute;top:50%;left:0;right:0;height:1px;background:#d1d1d6;z-index:1}.phone-date-separator span{background:#fff;padding:0 12px;position:relative;z-index:2}.phone-message{display:flex;margin-bottom:4px;position:relative}.phone-message.user{justify-content:flex-end}.phone-message.business{justify-content:flex-start}.phone-message-bubble{position:relative;max-width:75%;padding:8px 12px;font-size:15px;line-height:1.4;word-wrap:break-word;word-break:break-word;border-radius:18px;box-shadow:0 1px 2px #0000001a;text-align:left}.phone-message-bubble.user{background:#007aff;color:#fff;border-radius:18px 18px 4px;margin-left:auto;position:relative}.phone-message-bubble.user:before{content:"";position:absolute;bottom:0;right:-6px;width:0;height:0;border-left:6px solid #007aff;border-top:6px solid transparent;border-bottom:6px solid transparent;z-index:1}.phone-message-bubble.business{background:#e5e5ea;color:#000;border-radius:18px 18px 18px 4px;margin-right:auto;position:relative}.phone-message-bubble.business:before{content:"";position:absolute;bottom:0;left:-6px;width:0;height:0;border-right:6px solid #e5e5ea;border-top:6px solid transparent;border-bottom:6px solid transparent;z-index:1}.phone-message-sender{font-size:11px;font-weight:600;opacity:.8;margin-bottom:2px;color:inherit}.phone-input-container{position:absolute;bottom:0;left:0;right:0;height:80px;background:#f2f2f7;border-top:1px solid #d1d1d6;display:flex;align-items:center;padding:12px 16px;gap:8px}.phone-input-field{flex:1;height:36px;background:#fff;border:none;border-radius:18px;padding:0 16px;font-size:15px;color:#000;outline:none;box-shadow:0 1px 3px #0000001a;transition:all .2s ease}.phone-input-field:focus{box-shadow:0 0 0 2px #007aff}.phone-input-field::-moz-placeholder{color:#8e8e93}.phone-input-field::placeholder{color:#8e8e93}.phone-send-button{width:36px;height:36px;background:#007aff;border:none;border-radius:18px;color:#fff;font-size:18px;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s ease;box-shadow:0 1px 3px #0003}.phone-send-button:hover:not(:disabled){background:#0056b3;transform:scale(1.05)}.phone-send-button:disabled{background:#c7c7cc;cursor:not-allowed;transform:none}@media (max-width: 768px){.phone-frame{transform:scale(.8) rotateY(-10deg) rotateX(3deg) rotate(-1deg)}}@media (max-width: 640px){.phone-frame{transform:scale(.7) rotateY(-8deg) rotateX(2deg) rotate(-1deg)}}@media (max-width: 480px){.phone-frame{transform:scale(.6) rotateY(-5deg) rotateX(1deg) rotate(0)}}.phone-message{animation:messageSlideIn .3s ease-out}@keyframes messageSlideIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.phone-frame{animation:phoneFloat 6s ease-in-out infinite}@keyframes phoneFloat{0%,to{transform:rotateY(-15deg) rotateX(5deg) rotate(-2deg) translateY(0)}50%{transform:rotateY(-12deg) rotateX(3deg) rotate(-1deg) translateY(-5px)}}@media (prefers-reduced-motion: reduce){.phone-frame,.phone-message{animation:none}}@media (prefers-contrast: high){.phone-message-bubble.user{background:#06c;border:2px solid #004499}.phone-message-bubble.business{background:#f0f0f0;border:2px solid #666666}}.phone-hidden{display:none!important}.phone-fade-in{animation:fadeIn .5s ease-in}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.phone-slide-up{animation:slideUp .3s ease-out}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}