/* DAYSTY Live: vertical live feed */
.d-lives { position: fixed; z-index: 1; left: 0; right: 0; top: 0; bottom: var(--rtab); overflow-y: auto; overflow-x: hidden; scroll-snap-type: y mandatory; overscroll-behavior-y: contain; scrollbar-width: none; background: #000; -webkit-overflow-scrolling: touch; }
.d-lives::-webkit-scrollbar { display: none; }
.d-lv { position: relative; height: 100%; min-height: 100%; scroll-snap-align: start; scroll-snap-stop: always; display: flex; justify-content: center; overflow: hidden; background: #000; }
.d-lv__stage { position: relative; height: 100%; width: 100%; background: #0B0B0E; overflow: hidden; }
@media (min-width: 1025px) { .d-lv { width: calc(100vh * 9 / 16); max-width: 100%; margin: 0 auto; } }
@media (min-width: 1025px) { @supports (height: 100dvh) { .d-lv { width: calc(100dvh * 9 / 16); } } }
.d-lives { }
.d-lv__poster { position: absolute; inset: -20px; background: #1B1B22 center / cover no-repeat; filter: blur(18px) saturate(1.1); transform: scale(1.06); opacity: .85; }
.d-lv__video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; background: #000; }
.d-lv__video[hidden] { display: none; }
.d-lv__shade { position: absolute; inset: 0; pointer-events: none; background: linear-gradient(to bottom, rgba(0,0,0,.55) 0, rgba(0,0,0,0) 22%, rgba(0,0,0,0) 48%, rgba(0,0,0,.75) 100%); }
.d-lv__tap { position: absolute; inset: 0; width: 100%; border: 0; background: transparent; cursor: pointer; -webkit-tap-highlight-color: transparent; touch-action: manipulation; }
.d-lv__floats { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
.d-fh { position: absolute; width: 28px; height: 28px; margin: -14px 0 0 -14px; opacity: 0; background: hsl(var(--hue, 345) 90% 58%); -webkit-mask: var(--heart) center / contain no-repeat; mask: var(--heart) center / contain no-repeat; animation: dFloat 1.7s ease-out forwards; --heart: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 21s-7.5-4.6-9.6-9.2C.9 8.5 2.6 5 6 5c2 0 3.4 1.1 4.2 2.5h3.6C14.6 6.1 16 5 18 5c3.4 0 5.1 3.500 3.600 6.800C19.500 16.400 12 21 12 21z'/%3E%3C/svg%3E"); }
@keyframes dFloat { 0% { opacity: 0; transform: translate(0, 0) scale(.4); } 12% { opacity: 1; transform: translate(0, -16px) scale(1.1); } 100% { opacity: 0; transform: translate(var(--dx, 0), -260px) scale(1.5); } }

.d-lv__state { position: absolute; inset: 0; z-index: 4; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; padding: 24px; text-align: center; color: #fff; background: rgba(0,0,0,.35); }
.d-lv__state[hidden] { display: none; }
.d-lv__state p { margin: 0; max-width: 28ch; font: 600 15px/1.4 var(--d-font-body); }
.d-lv__stateacts { display: flex; gap: 8px; flex-wrap: wrap; justify-content: center; }
.d-lv__stateacts[hidden] { display: none; }
.d-lv__spin { width: 30px; height: 30px; border-radius: 50%; border: 3px solid rgba(255,255,255,.25); border-top-color: #fff; animation: dSpin .8s linear infinite; }
.d-lv__state.is-quiet .d-lv__spin { display: none; }
@keyframes dSpin { to { transform: rotate(360deg); } }

.d-lv__top { position: absolute; z-index: 5; left: 0; right: 0; top: calc(env(safe-area-inset-top) + 58px); display: flex; justify-content: space-between; align-items: flex-start; gap: 8px; padding: 0 12px; pointer-events: none; }
.d-lv__top > * { pointer-events: auto; }
.d-lv__host { display: flex; align-items: center; gap: 8px; min-width: 0; padding: 4px 4px 4px 4px; border-radius: 999px; background: rgba(0,0,0,.42); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
.d-lv__av { flex: none; width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center; background: #2A2A33 center / cover no-repeat; border: 2px solid #E11D48; color: #fff; font: 800 15px var(--d-font-head, var(--d-font-body)); text-decoration: none; overflow: hidden; }
.d-lv__who { min-width: 0; display: flex; flex-direction: column; line-height: 1.15; }
.d-lv__who b { max-width: 24vw; font: 700 14px var(--d-font-body); color: #fff; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.d-lv__who small { font-size: 11px; color: rgba(255,255,255,.72); }
.d-lv__follow { flex: none; padding: 6px 12px; border: 0; border-radius: 999px; background: #E11D48; color: #fff; font: 800 12px var(--d-font-body); cursor: pointer; }
.d-lv__follow[aria-pressed="true"] { background: rgba(255,255,255,.2); }
.d-lv__meta { display: flex; align-items: center; gap: 6px; }
.d-lv__badge { padding: 5px 9px; border-radius: 6px; background: #E11D48; color: #fff; font: 800 11px var(--d-font-body); letter-spacing: .08em; display: inline-flex; align-items: center; gap: 6px; }
.d-lv__badge::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: #fff; animation: dPulse 1.4s ease-in-out infinite; }
@keyframes dPulse { 50% { opacity: .35; transform: scale(.7); } }
.d-lv__viewers { display: inline-flex; align-items: center; gap: 4px; padding: 5px 9px; border-radius: 999px; background: rgba(0,0,0,.45); color: #fff; font: 700 12px var(--d-font-body); }
.d-lv__viewers svg { width: 14px; height: 14px; }
.d-lv__title { position: absolute; z-index: 5; left: 12px; right: 12px; top: calc(env(safe-area-inset-top) + 108px); margin: 0; font: 600 13px/1.35 var(--d-font-body); color: #fff; text-shadow: 0 1px 4px rgba(0,0,0,.7); pointer-events: none; max-width: 70%; }
.d-lv__likes { position: absolute; z-index: 5; left: 12px; top: calc(env(safe-area-inset-top) + 130px); margin: 0; display: none; }
.d-lv__title ~ .d-lv__likes { top: calc(env(safe-area-inset-top) + 150px); }
.d-lv__likes { display: inline-flex; align-items: center; gap: 5px; padding: 4px 9px; border-radius: 999px; background: rgba(0,0,0,.42); color: #fff; font: 600 12px var(--d-font-body); pointer-events: none; }
.d-lv__likes svg { width: 13px; height: 13px; color: #FB7185; }

.d-lv__banners { position: absolute; z-index: 6; left: 12px; bottom: calc(var(--lvbar, 74px) + min(34%, 260px) + 14px); display: flex; flex-direction: column; gap: 6px; pointer-events: none; }
.d-lv__gb { display: flex; flex-direction: column; padding: 7px 14px 7px 12px; border-radius: 12px; color: #fff; font: 600 12px var(--d-font-body); background: linear-gradient(90deg, var(--g1, #B5122E), var(--g2, #7C3AED)); animation: dBan 3.6s ease both; box-shadow: 0 6px 18px rgba(0,0,0,.4); }
.d-lv__gb b { font-size: 13px; }
@keyframes dBan { 0% { opacity: 0; transform: translateX(-30px); } 10%, 85% { opacity: 1; transform: none; } 100% { opacity: 0; transform: translateY(-14px); } }

.d-lv__chat { position: absolute; z-index: 5; left: 0; bottom: calc(var(--lvbar, 74px) + 6px); width: min(78%, 360px); height: min(34%, 260px); margin: 0; padding: 0 0 0 12px; list-style: none; overflow-y: auto; overscroll-behavior: contain; display: flex; flex-direction: column; gap: 5px; scrollbar-width: none; -webkit-mask-image: linear-gradient(to bottom, transparent 0, #000 28%); mask-image: linear-gradient(to bottom, transparent 0, #000 28%); }
.d-lv__chat::before { content: ""; flex: 1 1 auto; }
.d-lv__chat::-webkit-scrollbar { display: none; }
.d-lv__msg, .d-lv__sys { flex: none; align-self: flex-start; max-width: 100%; padding: 5px 11px; border-radius: 14px; background: rgba(0,0,0,.42); color: #fff; font: 400 14px/1.35 var(--d-font-body); overflow-wrap: anywhere; text-shadow: 0 1px 2px rgba(0,0,0,.5); }
.d-lv__msg b { font-weight: 700; color: #C4B5FD; margin-right: 3px; }
.d-lv__msg.is-mine b { color: #FDA4AF; }
.d-lv__msg b i { font: 800 9px var(--d-font-body); font-style: normal; letter-spacing: .06em; padding: 1px 5px; margin-left: 3px; border-radius: 4px; background: #E11D48; color: #fff; vertical-align: 1px; }
.d-lv__sys { background: transparent; padding: 3px 4px; color: rgba(255,255,255,.7); font-size: 12px; }

.d-lv__bar { position: absolute; z-index: 6; left: 0; right: 0; bottom: 0; display: flex; align-items: center; gap: 8px; padding: 8px 10px calc(10px + env(safe-area-inset-bottom)); }
@media (max-width: 1024px) { .d-lv__bar { padding-bottom: 10px; } }
.d-lv__form { flex: 1; min-width: 0; display: flex; align-items: center; height: 44px; border-radius: 22px; background: rgba(0,0,0,.5); border: 1px solid rgba(255,255,255,.22); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); color: rgba(255,255,255,.8); text-decoration: none; font: 500 14px var(--d-font-body); }
.d-lv__form input { flex: 1; min-width: 0; height: 100%; padding: 0 6px 0 16px; border: 0; background: transparent; color: #fff; font-size: 16px; outline: none; }
.d-lv__form input::placeholder { color: rgba(255,255,255,.65); }
.d-lv__form:focus-within { border-color: #8B5CF6; }
.d-lv__form--off { padding: 0 16px; justify-content: center; }
.d-lv__send { flex: none; width: 40px; height: 40px; margin-right: 2px; border: 0; border-radius: 50%; display: grid; place-items: center; background: #E11D48; color: #fff; cursor: pointer; }
.d-lv__send svg { width: 18px; height: 18px; }
.d-lv__btn { flex: none; width: 44px; height: 44px; border: 0; border-radius: 50%; display: grid; place-items: center; background: rgba(0,0,0,.5); color: #fff; cursor: pointer; -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); -webkit-tap-highlight-color: transparent; }
.d-lv__btn svg { width: 22px; height: 22px; }
.d-lv__btn--heart { background: linear-gradient(135deg, #E11D48, #7C3AED); }
.d-lv__btn--heart:active { transform: scale(.9); }
.d-lv__btn--gift { background: rgba(124,58,237,.7); }
.d-lv__btn--sound .d-snd--on, .d-lv__btn--sound.is-on .d-snd--off { display: none; }
.d-lv__btn--sound.is-on .d-snd--on { display: block; }
.d-lv.is-ended .d-lv__bar, .d-lv.is-ended .d-lv__chat, .d-lv.is-ended .d-lv__banners { opacity: .35; pointer-events: none; }
.d-lv button:focus-visible, .d-lv a:focus-visible, .d-lv input:focus-visible { outline: 2px solid #8B5CF6; outline-offset: 2px; }

/* gift sheet */
.d-gsheet { position: fixed; z-index: 90; left: 0; right: 0; bottom: 0; display: flex; justify-content: center; }
.d-gsheet[hidden], .d-rscrim[hidden] { display: none; }
.d-gsheet__panel { width: min(520px, 100%); padding: 14px 16px calc(16px + env(safe-area-inset-bottom)); background: #16161C; color: #F4EFE9; border: 1px solid rgba(255,255,255,.1); border-radius: 18px 18px 0 0; }
.d-gsheet__panel header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; }
.d-gsheet__panel h2 { margin: 0; font: 800 17px var(--d-font-body); }
.d-gsheet__grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(92px, 1fr)); gap: 8px; }
.d-gift { width: 100%; display: flex; flex-direction: column; align-items: center; gap: 3px; padding: 12px 6px; border: 1px solid rgba(255,255,255,.1); border-radius: 14px; background: #1F1F27; color: #fff; cursor: pointer; font: 600 13px var(--d-font-body); }
.d-gift:hover, .d-gift:focus-visible { border-color: #8B5CF6; }
.d-gift small { color: rgba(255,255,255,.6); font-size: 11px; }
.d-gift__ico { width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; background: linear-gradient(135deg, var(--g1, #B5122E), var(--g2, #7C3AED)); }
.d-gift__ico svg { width: 22px; height: 22px; }
.d-gift--spark { --g1: #F59E0B; --g2: #EF4444; } .d-gift--rose { --g1: #F43F5E; --g2: #BE123C; } .d-gift--drum { --g1: #10B981; --g2: #0D9488; } .d-gift--crown { --g1: #FBBF24; --g2: #D97706; } .d-gift--rocket { --g1: #8B5CF6; --g2: #E11D48; }
.d-gsheet__bal { margin: 12px 0 0; font-size: 13px; color: rgba(255,255,255,.7); }
.d-gsheet__bal a { margin-left: 8px; color: #C4B5FD; }
.d-gsheet__note { margin: 8px 0 0; padding: 9px 12px; border-radius: 10px; background: rgba(225,29,72,.14); color: #FDA4AF; font-size: 13px; }
.d-gsheet__note[hidden] { display: none; }
.d-gsheet__note a { color: #fff; margin-left: 6px; }

.d-rtab .d-mtab__n { position: absolute; top: 5px; left: 54%; min-width: 17px; height: 17px; padding: 0 5px; box-sizing: border-box; display: grid; place-items: center; border-radius: 999px; background: #E11D48; color: #fff; font: 800 10px var(--d-font-body); font-style: normal; }
.d-rtab .d-mtab__n[hidden] { display: none; }
.d-rtab a { position: relative; }
@media (max-width: 380px) { .d-lv__who b { max-width: 20vw; } .d-lv__btn { width: 40px; height: 40px; } .d-lv__bar { gap: 6px; } }
@media (prefers-reduced-motion: reduce) { .d-fh, .d-lv__gb, .d-lv__badge::before { animation-duration: .01s; } }