/* Video previews preserve the source image proportions and keep controls clear. */
.video-overlay{padding:18px;background:#08040dc9;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.video-modal{
  box-sizing:border-box;width:min(100%,500px);max-height:calc(100dvh - 36px);
  overflow:auto;border:1px solid #9b789b;border-radius:24px;
  background:radial-gradient(circle at 90% 0,#58405b,#211922 55%,#1a1520);
  box-shadow:0 30px 85px #09030cc2,inset 0 1px 0 #ffffff2e;color:#f7f0f7;
  scrollbar-width:none;
}
.video-modal::-webkit-scrollbar{display:none}
.video-preview-head{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:19px 22px 17px}
.video-preview-heading{display:flex;flex-direction:column;gap:5px;min-width:0}
.video-preview-heading>span{color:#d6b8d8;font-size:10px;font-weight:800;letter-spacing:.16em;line-height:1.2}
.video-preview-heading>strong{color:#fff;font-size:19px;font-weight:780;line-height:1.3;overflow-wrap:anywhere}
.video-preview-close{
  display:grid;place-items:center;flex:none;width:46px;height:46px;min-width:46px;padding:0;
  border:1px solid #d9b6d796;border-radius:15px;
  background:linear-gradient(145deg,#ffffff30,#c092bf21);color:#f8eaf8;
  box-shadow:inset 0 1px 0 #ffffff50,0 8px 19px #0b061c4d;
  -webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);
  transition:transform .18s ease,background .18s ease,border-color .18s ease;
}
.video-preview-close:hover{transform:translateY(-1px);border-color:#f2d9ec;background:linear-gradient(145deg,#ffffff4b,#d9a8d441)}
.video-preview-close:active{transform:translateY(1px)}
.video-preview-close:focus-visible{outline:3px solid #e9c9f4;outline-offset:3px}
.video-preview-close .icon{width:20px;height:20px;color:currentColor;filter:none}
.video-preview-media{margin:0 20px;overflow:hidden;border:1px solid #c89bca8a;border-radius:19px;background:#120e18;box-shadow:inset 0 1px 0 #ffffff2b}
.video-preview-media>.photo{display:block;width:100%;height:auto!important;max-height:none;aspect-ratio:1/1;border-radius:0;background-size:200% 200%;filter:none}
.video-preview-media>.video-scene{display:block;width:100%;height:auto!important;aspect-ratio:4/3;background-size:contain;background-color:#120e18}
.video-preview-media>.video-scene-8{aspect-ratio:16/9}
.video-modal .video-actions{padding:19px 22px 22px;color:#eadce9;font-size:13px;font-weight:650}
.video-modal .video-actions .row{gap:12px}
.video-modal .video-actions .row span:last-child{font-variant-numeric:tabular-nums;color:#f7edf6;white-space:nowrap}
.video-modal .progress{height:6px;margin:13px 0 17px;overflow:hidden;border-radius:999px;background:#ffffff2b}
.video-modal .progress span{background:linear-gradient(90deg,#b98cd0,#f1c2d6)}
.video-modal .video-actions .primary{min-height:52px;border:1px solid #ead1e5!important;border-radius:15px;background:linear-gradient(145deg,#ffffff3b,#d8a8d147)!important;color:#fff!important;box-shadow:inset 0 1px 0 #ffffff78,0 9px 21px #0d06163d!important;font-size:14px}
.video-modal .video-actions .primary:hover{background:linear-gradient(145deg,#ffffff51,#e2b5db5c)!important}
.video-card{font:inherit;color:inherit;text-align:left}
.video-card:focus-visible{outline:3px solid #b7a7ff;outline-offset:3px}
.video-info{min-width:0}
.video-info strong{overflow-wrap:anywhere}
.video-meta{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:5px 12px;min-width:0;font-size:12px;line-height:1.4}
.video-meta span{display:inline-flex;align-items:center;gap:4px;min-width:0}
.video-availability{color:#b7c5fc;font-weight:700}
.video-card.cover-only .play-circle{background:#211a30c9;border-color:#ffffffb3}
.video-preview-media{position:relative}
.video-preview-media video{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#100c15;opacity:0;pointer-events:none}
.video-preview-media.has-started video{opacity:1}
.video-media-play{position:absolute;left:50%;top:50%;z-index:2;display:flex;align-items:center;gap:8px;max-width:calc(100% - 20px);transform:translate(-50%,-50%);padding:12px 17px;border:1px solid #ffffffb3;border-radius:999px;background:#1a1029d9;color:white;font:inherit;font-size:14px;font-weight:750;white-space:nowrap;box-shadow:0 10px 30px #0007;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
.video-media-play .icon{width:21px;height:21px}
.video-preview-media.is-playing .video-media-play{opacity:0;pointer-events:none}
.video-media-play:focus-visible,.video-control-button:focus-visible{outline:3px solid #efcef4;outline-offset:3px}
.video-control-button{display:flex;align-items:center;justify-content:center;gap:9px}
.video-control-button .icon{width:18px;height:18px}
.video-player-status{min-height:0;margin:9px 0 0;color:#e9cee9;font-size:12px;text-align:center}
.video-player-status:empty{display:none}
.profile-uploaded-photo{background-size:cover!important;background-position:center!important;background-repeat:no-repeat!important;background-color:#161723}
.detail-photo .profile-uploaded-photo{background-size:contain!important}
.album .profile-uploaded-photo{background-size:cover!important}
.profile-facts-section{min-width:0}
.profile-facts-table{width:100%;border-collapse:collapse;border:1px solid #e6dce5;border-radius:13px;overflow:hidden;background:#ffffff0d;text-align:left}
.profile-facts-table tr:not(:last-child){border-bottom:1px solid #e6dce5}
.profile-facts-table th,.profile-facts-table td{padding:11px 14px;font-size:13px;line-height:1.45}
.profile-facts-table th{width:35%;color:#8a7786;font-weight:650;background:#b88aaa0c}
.profile-facts-table td{color:inherit;font-weight:700;overflow-wrap:anywhere}
@media(max-width:600px){.profile-facts-table th,.profile-facts-table td{padding:10px 12px;font-size:13px}}
.video-unavailable{display:flex;align-items:center;gap:13px;margin:19px 20px 22px;padding:15px 17px;border:1px solid #c89bca63;border-radius:16px;background:#ffffff12}
.video-unavailable>.icon{flex:none;width:25px;height:25px;color:#ddb7dc}
.video-unavailable strong{display:block;font-size:14px;color:#fff}
.video-unavailable p{margin:4px 0 0;font-size:12px;color:#d7c2d5}

/* The conversation and composer form one continuous chat panel. */
.support-chat-page{gap:0}
.support-hero{margin-bottom:16px}
.support-chat-page .support-conversation{flex:none;min-height:0;border-radius:23px;overflow:hidden}
.support-chat-page .support-chat-list{flex:none;min-height:130px;max-height:360px;padding:22px 24px;scrollbar-gutter:stable}
.support-chat-page .support-conversation.is-empty .support-chat-list{min-height:205px}
.support-chat-page .support-composer{
  position:static;bottom:auto;margin:0;padding:15px 18px 17px;
  border:0;border-top:1px solid #899dc02c;border-radius:0;
  background:linear-gradient(145deg,#ffffff10,#ffffff07);box-shadow:none;
}
.support-chat-page .support-composer textarea{min-height:48px;resize:vertical}
.support-chat-page .support-composer button{min-width:90px;border-radius:13px}
@media(min-width:900px){
  .support-chat-page{min-height:0!important;padding-bottom:44px}
  .support-chat-page .support-composer{border-top-color:#e8ddec;background:#fbf8fc;box-shadow:none}
  .support-chat-page .support-chat-list{min-height:120px}
  .support-chat-page .support-conversation.is-empty .support-chat-list{min-height:205px}
}
@media(max-width:899px){
  .video-card{display:block;width:100%;padding:0}
  .video-info{padding:12px 12px 14px}
  .video-info strong{font-size:14px;line-height:1.4;min-height:0;margin-bottom:9px}
  .video-meta{display:grid;grid-template-columns:1fr;gap:4px;font-size:11px}
  .video-views .icon{width:13px;height:13px}
  .video-availability{font-size:11px}
  .video-overlay{padding:12px}
  .video-modal{width:min(100%,480px);max-height:calc(100dvh - 24px);border-radius:22px}
  .video-preview-head{padding:16px 17px 15px}
  .video-preview-heading>strong{font-size:17px}
  .video-preview-media{margin:0 16px;border-radius:16px}
  .video-modal .video-actions{padding:16px 17px 18px}
  .video-unavailable{margin:16px 16px 18px}
  .support-chat-page .support-conversation{display:flex;flex:1;min-height:300px;flex-direction:column}
  .support-chat-page .support-chat-list,.support-chat-page .support-conversation.is-empty .support-chat-list{flex:1;min-height:190px;max-height:none;padding:18px}
  .support-chat-page .support-composer{position:relative;flex:none;padding:12px;border-top-color:#899dc02c}
}
@media(prefers-reduced-motion:reduce){.video-preview-close{transition:none}}

/* Keep new messages near the composer and show each day's date only once. */
.support-chat-history{display:flex;flex-direction:column;gap:10px;width:100%;margin-top:auto}
.support-chat-page .support-day{display:flex;align-items:center;gap:12px;margin:5px 0;color:#9eadca;font-size:11px;font-weight:650;text-align:center;white-space:nowrap}
.support-chat-page .support-day::before,.support-chat-page .support-day::after{content:'';height:1px;flex:1;background:#93a9d13a}
.support-chat-page .chat-line small{margin-top:4px;font-variant-numeric:tabular-nums}

@media(max-width:899px){
  .route-guest-support,.route-customer-service{display:flex;flex-direction:column;height:100dvh;min-height:0;padding-bottom:0;overflow:hidden}
  .route-guest-support>.page-header,.route-customer-service>.page-header{flex:none;position:relative}
  .route-guest-support .support-chat-page,.route-customer-service .support-chat-page{flex:1;height:auto;min-height:0!important;overflow:hidden;padding-top:12px!important;padding-bottom:12px!important}
  .support-chat-page .support-hero{flex:none;margin-bottom:12px}
  .support-chat-page .support-conversation{flex:1;min-height:0}
  .support-chat-page .support-chat-list,.support-chat-page .support-conversation.is-empty .support-chat-list{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain}
  .support-chat-page .support-composer textarea{resize:none}
  .keyboard-open .route-guest-support,.keyboard-open .route-customer-service{position:fixed;top:var(--visible-viewport-top,0px);left:50%;z-index:60;width:min(100%,600px);height:var(--visible-viewport-height,100dvh);transform:translateX(-50%)}
  .keyboard-open .support-chat-page{padding-top:8px!important;padding-bottom:8px!important}
  .keyboard-open .support-chat-page .support-hero{display:none}
  .keyboard-open .support-chat-page .support-conversation{min-height:0}
  .keyboard-open .support-chat-page .support-conversation-head{padding:10px 15px}
  .keyboard-open .support-chat-page .support-chat-list{padding:12px 15px}
  .keyboard-open .support-chat-page .support-composer{padding:8px 10px}
  .keyboard-open .support-chat-page .support-name{margin-bottom:6px}
}
@media(max-width:899px) and (max-height:650px){
  .support-chat-page .support-hero{display:none}
}