/* One frame for all events, loaded after presentation-specific styles.
   Keep shared geometry here and artwork / conversation animations in each event. */
.game-shell:has(.special-event){height:100dvh;min-height:540px;display:flex;flex-direction:column}
.game-shell:has(.special-event)>.game-header{flex:none;width:100%}
.game-shell>.stage.event-stage{width:100%;flex:1;min-height:0;padding:16px 20px 20px;align-items:center}
.stage>.special-event{--event-card-height:144px;--event-copy-size:13px;--event-action-height:44px;--event-space:12px;height:100%;min-height:0;gap:14px}
.special-event>.event-heading{flex:none;width:100%}
.special-event .event-heading .eyebrow{font-size:10px}
.special-event .event-heading h1{font-size:28px;line-height:1.3;margin:6px 0}
.special-event .event-heading p{font-size:13px;line-height:1.6;min-height:2lh;max-width:440px;margin:0 auto;display:flex;align-items:center;justify-content:center}
.special-event .event-phone{flex:1;width:min(440px,100%);height:auto;min-height:0;max-height:640px;padding:12px 18px 10px;border-radius:30px;overflow:visible}
.special-event .event-phone .event-camera{margin-bottom:9px}
.special-event .event-phone .event-phone-header{position:relative;padding-bottom:9px;font-size:12px;line-height:1.4}
.special-event .event-phone .event-phone-header .icon{width:18px;height:18px}
.special-event .event-phone .event-card{flex:none;height:var(--event-card-height);min-height:0;border-radius:16px;background:#fff8ee;transition:none}
.special-event .event-phone .event-card .portrait{position:absolute;inset:0 0 auto auto;width:58%;height:100%;object-fit:cover;object-position:center top;mask-image:linear-gradient(90deg,transparent,#000 20%);transition:transform 1s ease}
.special-event .event-phone .event-card::after{inset:0;background:linear-gradient(90deg,#393043c4,#39304382 35%,transparent 68%)}
.special-event .event-card-copy{left:15px;bottom:13px}
.special-event .event-card-copy h2{font-size:22px;line-height:1.2;margin:0 0 4px}
.special-event .event-card-copy p{display:block;font-size:11px;line-height:1.4;margin:0}
.event-card-caption{position:absolute;z-index:1;left:13px;top:12px;display:flex;align-items:center;gap:5px;padding:5px 7px;border-radius:8px;background:#39304360;color:#fff;font-size:9px}
.event-card-caption .icon{width:12px;height:12px}
.special-event .event-phone .event-chat{flex:1;min-height:0;gap:var(--event-space);padding:var(--event-space) 0;overflow:visible}
.special-event .event-phone .event-message{max-width:100%}
.special-event .event-phone .event-message p{padding:10px 12px;font-size:var(--event-copy-size);line-height:1.6}
.special-event .event-phone .event-compose{margin-top:0;padding-top:9px}
.special-event .event-phone .event-choices button,.special-event .event-phone .event-continue,.special-event .event-phone .event-status{min-height:var(--event-action-height);font-size:12px;line-height:1.5;padding:8px 7px;border-radius:13px}
.special-event .event-phone .event-home{margin:9px auto 0}
.special-event .event-phone .event-status{margin:0;text-align:center}
.special-event .playlist-body{flex:1;min-height:0;padding-top:var(--event-space)}
.special-event .playlist-choices{flex:1;min-height:0}
.special-event .playlist-cover{flex:1;min-height:0;height:auto;max-height:none}
.special-event .playlist-conversation{flex:1;min-height:0;padding-top:var(--event-space)}
.special-event .movie-selection{padding-top:var(--event-space)}
.special-event .movie-chat .event-compose{margin-top:auto}
.special-event .social-phone .event-workspace{padding-top:var(--event-space)}
.special-event .social-phone>.event-compose{margin-top:9px}
@media(max-width:600px){
 .game-shell>.stage.event-stage{padding:12px 14px 14px}
 .stage>.special-event{--event-card-height:128px;--event-copy-size:12px;gap:12px}
 .special-event .event-heading .eyebrow{font-size:9px}
 .special-event .event-heading h1{font-size:24px}
 .special-event .event-heading p{font-size:11px;max-width:310px}
 .special-event .event-phone{padding:10px 14px 9px;border-radius:27px}
 .special-event .event-card-copy h2{font-size:21px}
 .special-event .event-card-copy p{font-size:10px}
 .special-event .event-phone .event-choices button,.special-event .event-phone .event-continue,.special-event .event-phone .event-status{font-size:11px}
}
@media(max-height:700px){
 .game-shell>.stage.event-stage{padding:8px 12px 10px}
 .stage>.special-event{--event-card-height:96px;--event-space:8px;--event-copy-size:11px;--event-action-height:40px;gap:8px}
 .special-event .event-heading .eyebrow{font-size:8px}
 .special-event .event-heading h1{font-size:22px;margin:3px 0 4px}
 .special-event .event-heading p{font-size:10px;line-height:1.5}
 .special-event .event-phone{padding:8px 12px 7px}
 .special-event .event-phone .event-camera{margin-bottom:6px}
 .special-event .event-phone .event-phone-header{padding-bottom:7px;font-size:11px}
 .special-event .event-card-copy{left:12px;bottom:10px}
 .special-event .event-card-copy h2{font-size:19px;margin-bottom:3px}
 .special-event .event-card-copy p{font-size:9px}
 .special-event .event-phone .event-message p{padding:7px 10px}
 .special-event .event-phone .event-compose{padding-top:6px}
 .special-event .event-phone .event-home{margin-top:7px}
 .event-card-caption{display:none}
}
@media(max-height:600px){
 .stage>.special-event{--event-card-height:72px;--event-space:7px}
 .special-event .event-card-copy h2{font-size:18px}
 .special-event .social-phone .event-response,.special-event .social-phone .reply-copy{min-height:0}
 .special-event .social-phone .art-frame{min-height:60px}
 .special-event .social-phone.is-replied .art-frame{min-height:40px}
 .special-event .incoming-phone .incoming-time{display:none}
 .special-event .playlist-body{gap:6px}
 .special-event .playlist-conversation{gap:7px}
 .special-event .shared-track{padding:7px}
 .special-event .shared-cover{width:40px;height:40px}
 .special-event .mini-record{inset:1px}
}