:root{--phone-bubble-business-bg:#e0cdb8;--phone-bubble-business-tail:#e0cdb8;--phone-bubble-user-bg:var(--brand-primary,#c47832);--phone-bubble-user-tail:var(--brand-primary,#c47832)}.phone-container{display:flex;justify-content:center;align-items:center;perspective:1000px;padding:40px 20px}.phone-frame{position:relative;width:390px;height:844px;background:var(--color-sk-black);border-radius:55px;padding:12px;box-shadow:0 0 0 12px var(--color-sk-charcoal),0 0 0 14px var(--color-sk-dark),0 30px 60px rgba(0,0,0,.4);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:var(--color-sk-cream);border-radius:43px;overflow:hidden}.phone-dynamic-island{position:absolute;top:12px;left:50%;transform:translateX(-50%);width:160px;height:30px;background:var(--color-sk-black);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:var(--color-sk-dark);border-radius:50%;border:1px solid var(--color-sk-surface)}.phone-dynamic-island:after{content:"";width:60px;height:6px;background:var(--color-sk-dark);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:var(--color-sk-charcoal);font-size:15px;font-weight:600}.phone-status-left,.phone-status-right{display:flex;align-items:center;gap:4px;font-size:14px}.phone-status-center{position:absolute;left:50%;transform:translateX(-50%);font-weight:700;font-size:16px}.phone-battery{width:24px;height:12px;border:1px solid var(--color-sk-text-muted);border-radius:2px;position:relative}.phone-battery:after{content:"";position:absolute;right:-3px;top:2px;width:2px;height:8px;background:var(--color-sk-text-muted);border-radius:0 1px 1px 0}.phone-battery-fill{position:absolute;top:1px;left:1px;height:8px;background:var(--brand-primary,var(--color-sk-copper));border-radius:1px;width:85%}.phone-messages-container{position:absolute;top:44px;left:0;right:0;bottom:80px;background:var(--color-sk-cream);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:var(--color-sk-text-muted);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:var(--color-sk-border);z-index:1}.phone-date-separator span{background:var(--color-sk-cream);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 rgba(0,0,0,.08);text-align:left}.phone-message-bubble.user{background:var(--phone-bubble-user-bg);color:var(--color-sk-cream);border-radius:18px;border-bottom-right-radius: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 var(--phone-bubble-user-tail);border-top:6px solid transparent;border-bottom:6px solid transparent;z-index:1}.phone-message-bubble.business{background:var(--phone-bubble-business-bg);color:var(--color-sk-charcoal);border-radius:18px;border-bottom-left-radius: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 var(--phone-bubble-business-tail);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:var(--color-sk-cream-dark);border-top:1px solid var(--color-sk-border);display:flex;align-items:center;padding:12px 16px;gap:8px}.phone-input-field{flex:1;height:36px;background:var(--color-sk-cream);border:1px solid var(--color-sk-border);border-radius:18px;padding:0 16px;font-size:15px;color:var(--color-sk-charcoal);outline:none;box-shadow:0 1px 2px rgba(0,0,0,.05);transition:all .2s ease}.phone-input-field:focus{border-color:var(--brand-primary,var(--color-sk-copper));box-shadow:0 0 0 2px color-mix(in srgb,var(--brand-primary,var(--color-sk-copper)) 30%,transparent)}.phone-input-field::placeholder{color:var(--color-sk-text-muted)}.phone-send-button{width:36px;height:36px;background:var(--brand-primary,var(--color-sk-copper));border:none;border-radius:18px;color:var(--color-sk-cream);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 rgba(0,0,0,.15)}.phone-send-button:hover:not(:disabled){filter:brightness(1.1);transform:scale(1.05)}.phone-send-button:disabled{background:var(--color-sk-border);color:var(--color-sk-text-muted);cursor:not-allowed;transform:none}.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{animation:none;transform:rotateY(-12deg) rotateX(3deg) rotate(-1deg)}}