/* Space Gate NOVA+ — R11C4 NOVA Clips. Visual-only clip cards + one lazy fullscreen iframe. */
:root.nova-clips-open,
body.nova-clips-open { overflow: hidden !important; overscroll-behavior: none !important; }
body.nova-clips-open #nova-global-header,
body.nova-clips-open #nova-bottom-nav-host,
body.nova-clips-open #nova-web-original-refresh { opacity: 0 !important; pointer-events: none !important; }

.nova-web-details-scope .nova-clips-section {
    margin-top: 1.55rem !important;
    padding-top: 1.15rem !important;
    border-top: 1px solid rgba(255,255,255,.075) !important;
    min-width: 0 !important;
}
.nova-web-details-scope .nova-clips-heading {
    margin: 0 0 .9rem !important;
    display: flex !important;
    align-items: flex-end !important;
    justify-content: space-between !important;
    gap: 14px !important;
}
.nova-web-details-scope .nova-clips-heading > div { min-width: 0 !important; }
.nova-web-details-scope .nova-clips-kicker {
    display: block !important;
    margin-bottom: 3px !important;
    color: #60dcff !important;
    font-size: .58rem !important;
    font-weight: 900 !important;
    letter-spacing: .15em !important;
    direction: ltr !important;
}
.nova-web-details-scope .nova-clips-heading h3 {
    margin: 0 !important;
    color: #fff !important;
    font-size: clamp(.95rem,1.4vw,1.08rem) !important;
    font-weight: 900 !important;
}
.nova-web-details-scope .nova-clips-heading p {
    margin: 0 !important;
    color: rgba(255,255,255,.56) !important;
    font-size: .68rem !important;
    white-space: nowrap !important;
}
.nova-web-details-scope .nova-clips-count {
    min-width: 32px !important;
    height: 24px !important;
    padding: 0 8px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border: 1px solid rgba(255,255,255,.12) !important;
    border-radius: 999px !important;
    background: rgba(255,255,255,.045) !important;
    color: rgba(255,255,255,.76) !important;
    font-size: .62rem !important;
    font-weight: 800 !important;
}
.nova-web-details-scope .nova-clips-rail {
    display: grid !important;
    grid-auto-flow: column !important;
    grid-auto-columns: clamp(132px, 15vw, 162px) !important;
    gap: 11px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    padding: 2px 1px 8px !important;
    scroll-snap-type: inline proximity !important;
    overscroll-behavior-inline: contain !important;
    scrollbar-width: none !important;
    -webkit-overflow-scrolling: touch !important;
}
.nova-web-details-scope .nova-clips-rail::-webkit-scrollbar { display: none !important; }
.nova-web-details-scope .nova-clip-card {
    appearance: none !important;
    width: 100% !important;
    min-width: 0 !important;
    padding: 0 !important;
    display: block !important;
    border: 0 !important;
    background: transparent !important;
    color: #fff !important;
    text-align: start !important;
    cursor: pointer !important;
    scroll-snap-align: start !important;
}
.nova-web-details-scope .nova-clip-art {
    position: relative !important;
    display: block !important;
    width: 100% !important;
    aspect-ratio: 9 / 16 !important;
    overflow: hidden !important;
    border: 1px solid rgba(255,255,255,.085) !important;
    border-radius: 14px !important;
    background: #08090d !important;
    box-shadow: 0 10px 24px rgba(0,0,0,.22) !important;
    transform: translateZ(0) !important;
}
.nova-web-details-scope .nova-clip-art img {
    width: 100% !important;
    height: 100% !important;
    display: block !important;
    object-fit: cover !important;
    object-position: center !important;
    transform: scale(1.035) !important;
    transition: transform .24s ease, filter .24s ease !important;
}
.nova-web-details-scope .nova-clip-art::after {
    content: '' !important;
    position: absolute !important;
    inset: 0 !important;
    background: linear-gradient(180deg,rgba(0,0,0,.02) 46%,rgba(0,0,0,.78) 100%) !important;
    pointer-events: none !important;
}
.nova-web-details-scope .nova-clip-card:active .nova-clip-art img { transform: scale(1.075) !important; }
@media (hover:hover) {
    .nova-web-details-scope .nova-clip-card:hover .nova-clip-art img { transform: scale(1.07) !important; filter: saturate(1.08) !important; }
    .nova-web-details-scope .nova-clip-card:hover .nova-clip-art { border-color: rgba(105,143,255,.48) !important; box-shadow: 0 13px 28px rgba(0,0,0,.34),0 0 0 1px rgba(158,83,255,.1) !important; }
}
.nova-web-details-scope .nova-clip-badge {
    position: absolute !important;
    z-index: 2 !important;
    top: 8px !important;
    right: 8px !important;
    max-width: calc(100% - 16px) !important;
    padding: 4px 7px !important;
    overflow: hidden !important;
    border: 1px solid rgba(255,255,255,.13) !important;
    border-radius: 999px !important;
    background: rgba(0,0,0,.55) !important;
    color: #fff !important;
    font-size: .54rem !important;
    font-weight: 850 !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    backdrop-filter: blur(8px) !important;
}
.nova-web-details-scope .nova-clip-play {
    position: absolute !important;
    z-index: 3 !important;
    inset: 50% auto auto 50% !important;
    width: 42px !important;
    height: 42px !important;
    display: grid !important;
    place-items: center !important;
    border: 1px solid rgba(255,255,255,.2) !important;
    border-radius: 999px !important;
    background: linear-gradient(135deg,rgba(84,102,255,.94),rgba(178,54,255,.92)) !important;
    color: #fff !important;
    transform: translate(-50%,-50%) !important;
    box-shadow: 0 8px 28px rgba(79,54,255,.32) !important;
}
.nova-web-details-scope .nova-clip-play svg { width: 18px !important; height: 18px !important; margin-left: 2px !important; }
.nova-web-details-scope .nova-clip-official {
    position: absolute !important;
    z-index: 3 !important;
    right: 8px !important;
    bottom: 8px !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
    color: rgba(255,255,255,.82) !important;
    font-size: .52rem !important;
    font-weight: 800 !important;
}
.nova-web-details-scope .nova-clip-official::before { content:'' !important; width: 5px !important; height: 5px !important; border-radius: 50% !important; background:#55dfff !important; box-shadow:0 0 8px #55dfff !important; }
.nova-web-details-scope .nova-clip-card strong,
.nova-web-details-scope .nova-clip-card small {
    display: block !important;
    min-width: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}
.nova-web-details-scope .nova-clip-card strong { margin-top: 7px !important; font-size: .7rem !important; font-weight: 850 !important; }
.nova-web-details-scope .nova-clip-card small { margin-top: 2px !important; color: rgba(255,255,255,.5) !important; font-size: .56rem !important; }

.nova-clips-viewer {
    position: fixed !important;
    z-index: 2147483000 !important;
    inset: 0 !important;
    width: 100dvw !important;
    height: 100dvh !important;
    overflow: hidden !important;
    direction: rtl !important;
    background: #000 !important;
    color: #fff !important;
    isolation: isolate !important;
    touch-action: none !important;
    overscroll-behavior: none !important;
    animation: nova-clips-open .2s ease-out both !important;
}
.nova-clips-backdrop {
    position: absolute !important;
    z-index: -3 !important;
    inset: -9% !important;
    background-position: center !important;
    background-size: cover !important;
    filter: blur(34px) brightness(.34) saturate(1.14) !important;
    transform: scale(1.16) !important;
    opacity: .82 !important;
    transition: background-image .18s linear !important;
}
.nova-clips-shade {
    position: absolute !important;
    z-index: -2 !important;
    inset: 0 !important;
    background: radial-gradient(circle at 50% 42%,rgba(16,18,33,.08) 0,rgba(0,0,0,.26) 46%,rgba(0,0,0,.78) 100%),linear-gradient(180deg,rgba(0,0,0,.55),transparent 22%,transparent 68%,rgba(0,0,0,.86)) !important;
}
.nova-clips-topbar {
    position: absolute !important;
    z-index: 20 !important;
    top: calc(env(safe-area-inset-top,0px) + 12px) !important;
    right: 14px !important;
    left: 14px !important;
    display: grid !important;
    grid-template-columns: 42px 1fr 42px !important;
    align-items: center !important;
    gap: 10px !important;
}
.nova-clips-icon-button {
    width: 42px !important;
    height: 42px !important;
    display: grid !important;
    place-items: center !important;
    border: 1px solid rgba(255,255,255,.15) !important;
    border-radius: 999px !important;
    background: rgba(0,0,0,.42) !important;
    color: #fff !important;
    backdrop-filter: blur(12px) saturate(1.1) !important;
}
.nova-clips-icon-button svg { width: 20px !important; height: 20px !important; }
.nova-clips-brand { min-width:0 !important; text-align:center !important; direction:ltr !important; }
.nova-clips-brand span { display:block !important; color:#7de7ff !important; font-size:.58rem !important; font-weight:950 !important; letter-spacing:.18em !important; }
.nova-clips-brand strong { display:block !important; margin-top:2px !important; color:rgba(255,255,255,.72) !important; font-size:.62rem !important; font-weight:800 !important; }

.nova-clips-stage {
    position: absolute !important;
    z-index: 4 !important;
    inset: 0 !important;
    display: grid !important;
    place-items: center !important;
    padding: calc(env(safe-area-inset-top,0px) + 64px) clamp(68px,8vw,124px) calc(env(safe-area-inset-bottom,0px) + 142px) clamp(18px,4vw,56px) !important;
    outline: none !important;
}
.nova-clips-video-shell {
    position: relative !important;
    width: min(78vw, 1120px) !important;
    max-height: 65dvh !important;
    aspect-ratio: 16 / 9 !important;
    overflow: hidden !important;
    border: 1px solid rgba(255,255,255,.12) !important;
    border-radius: clamp(12px,1.8vw,22px) !important;
    background: #000 !important;
    box-shadow: 0 28px 80px rgba(0,0,0,.58),0 0 0 1px rgba(106,95,255,.06) !important;
    transition: opacity .15s ease,transform .18s ease !important;
}
.nova-clips-video-shell.is-portrait { width:min(44vw,430px) !important; max-height:78dvh !important; aspect-ratio:9 / 16 !important; }
.nova-clips-video-shell.slide-next { animation:nova-clips-next .2s ease-out both !important; }
.nova-clips-video-shell.slide-prev { animation:nova-clips-prev .2s ease-out both !important; }
.nova-clips-video-shell iframe {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    border: 0 !important;
    background: #000 !important;
    pointer-events: none !important;
}
.nova-clips-tap-layer { position:absolute !important; z-index:3 !important; inset:0 !important; width:100% !important; height:100% !important; border:0 !important; background:transparent !important; }
.nova-clips-state-flash {
    position:absolute !important; z-index:5 !important; inset:50% auto auto 50% !important; width:68px !important; height:68px !important; display:grid !important; place-items:center !important; border-radius:999px !important; background:rgba(0,0,0,.55) !important; color:#fff !important; transform:translate(-50%,-50%) scale(.78) !important; opacity:0 !important; pointer-events:none !important; backdrop-filter:blur(10px) !important;
}
.nova-clips-state-flash.show { animation:nova-clips-flash .5s ease both !important; }
.nova-clips-state-flash svg { width:28px !important; height:28px !important; }

.nova-clips-actions {
    position: absolute !important;
    z-index: 18 !important;
    right: max(14px, env(safe-area-inset-right,0px)) !important;
    bottom: calc(env(safe-area-inset-bottom,0px) + 92px) !important;
    display: grid !important;
    gap: 12px !important;
}
.nova-clips-actions button {
    width: 50px !important;
    min-height: 50px !important;
    padding: 7px 3px !important;
    display: grid !important;
    place-items: center !important;
    gap: 3px !important;
    border: 1px solid rgba(255,255,255,.13) !important;
    border-radius: 16px !important;
    background: rgba(0,0,0,.36) !important;
    color: #fff !important;
    backdrop-filter: blur(12px) !important;
}
.nova-clips-actions button svg { width:21px !important; height:21px !important; }
.nova-clips-actions button small { font-size:.48rem !important; font-weight:800 !important; color:rgba(255,255,255,.72) !important; }

.nova-clips-copy {
    position: absolute !important;
    z-index: 16 !important;
    right: clamp(78px,9vw,128px) !important;
    left: clamp(18px,4vw,56px) !important;
    bottom: calc(env(safe-area-inset-bottom,0px) + 22px) !important;
    max-width: min(760px,72vw) !important;
}
.nova-clips-type-row { display:flex !important; align-items:center !important; gap:7px !important; }
.nova-clips-type-row span { color:#7de7ff !important; font-size:.63rem !important; font-weight:900 !important; }
.nova-clips-type-row i { padding:2px 6px !important; border:1px solid rgba(125,231,255,.28) !important; border-radius:999px !important; background:rgba(39,175,255,.09) !important; color:#a8efff !important; font-size:.5rem !important; font-style:normal !important; font-weight:850 !important; }
.nova-clips-copy h2 { margin:5px 0 0 !important; max-width:100% !important; overflow:hidden !important; color:#fff !important; font-size:clamp(1rem,2.2vw,1.55rem) !important; font-weight:950 !important; line-height:1.25 !important; text-overflow:ellipsis !important; white-space:nowrap !important; }
.nova-clips-copy p { margin:4px 0 0 !important; overflow:hidden !important; color:rgba(255,255,255,.61) !important; font-size:.7rem !important; font-weight:700 !important; text-overflow:ellipsis !important; white-space:nowrap !important; }
.nova-clips-return { margin-top:10px !important; min-height:34px !important; padding:0 12px !important; border:1px solid rgba(255,255,255,.13) !important; border-radius:999px !important; background:rgba(255,255,255,.075) !important; color:#fff !important; font-size:.62rem !important; font-weight:850 !important; }
.nova-clips-gesture-hint { position:absolute !important; z-index:12 !important; left:50% !important; top:calc(env(safe-area-inset-top,0px) + 72px) !important; display:flex !important; align-items:center !important; gap:5px !important; color:rgba(255,255,255,.45) !important; transform:translateX(-50%) !important; animation:nova-clips-hint 3.2s ease forwards !important; pointer-events:none !important; }
.nova-clips-gesture-hint svg { width:14px !important; height:14px !important; }
.nova-clips-gesture-hint b { font-size:.54rem !important; font-weight:750 !important; }
.nova-clips-toast { position:absolute !important; z-index:30 !important; left:50% !important; bottom:calc(env(safe-area-inset-bottom,0px) + 148px) !important; max-width:80vw !important; padding:8px 12px !important; border:1px solid rgba(255,255,255,.12) !important; border-radius:999px !important; background:rgba(0,0,0,.72) !important; color:#fff !important; font-size:.64rem !important; font-weight:800 !important; opacity:0 !important; transform:translate(-50%,8px) !important; transition:.18s ease !important; backdrop-filter:blur(10px) !important; }
.nova-clips-toast.show { opacity:1 !important; transform:translate(-50%,0) !important; }

@media (max-width:720px) {
    .nova-web-details-scope .nova-clips-heading { align-items:flex-start !important; }
    .nova-web-details-scope .nova-clips-heading p { margin-top:3px !important; white-space:normal !important; font-size:.6rem !important; }
    .nova-web-details-scope .nova-clips-rail { grid-auto-columns: minmax(132px, 39vw) !important; gap:9px !important; }
    .nova-clips-stage { padding:calc(env(safe-area-inset-top,0px) + 70px) 0 calc(env(safe-area-inset-bottom,0px) + 178px) 0 !important; }
    .nova-clips-video-shell { width:100vw !important; max-height:58dvh !important; border-right:0 !important; border-left:0 !important; border-radius:0 !important; box-shadow:0 20px 58px rgba(0,0,0,.5) !important; }
    .nova-clips-video-shell.is-portrait { width:min(82vw,430px) !important; max-height:72dvh !important; border:1px solid rgba(255,255,255,.12) !important; border-radius:18px !important; }
    .nova-clips-actions { right:max(10px,env(safe-area-inset-right,0px)) !important; bottom:calc(env(safe-area-inset-bottom,0px) + 112px) !important; gap:8px !important; }
    .nova-clips-actions button { width:46px !important; min-height:46px !important; border-radius:14px !important; }
    .nova-clips-actions [data-nova-clips-prev], .nova-clips-actions [data-nova-clips-next] { display:none !important; }
    .nova-clips-copy { right:68px !important; left:14px !important; bottom:calc(env(safe-area-inset-bottom,0px) + 24px) !important; max-width:none !important; }
    .nova-clips-copy h2 { font-size:1rem !important; }
    .nova-clips-return { display:none !important; }
    .nova-clips-gesture-hint { top:calc(env(safe-area-inset-top,0px) + 66px) !important; }
}
@media (max-height:560px) and (orientation:landscape) {
    .nova-clips-stage { padding:54px 80px 52px 20px !important; }
    .nova-clips-video-shell { width:min(72vw,880px) !important; max-height:74dvh !important; }
    .nova-clips-copy { bottom:10px !important; right:78px !important; }
    .nova-clips-copy p,.nova-clips-return,.nova-clips-gesture-hint { display:none !important; }
    .nova-clips-actions { bottom:18px !important; }
}
@media (prefers-reduced-motion:reduce) {
    .nova-clips-viewer,.nova-clips-video-shell,.nova-clips-state-flash,.nova-clips-gesture-hint { animation:none !important; transition:none !important; }
}
@keyframes nova-clips-open { from{opacity:0} to{opacity:1} }
@keyframes nova-clips-next { from{opacity:.3;transform:translateY(24px) scale(.99)} to{opacity:1;transform:none} }
@keyframes nova-clips-prev { from{opacity:.3;transform:translateY(-24px) scale(.99)} to{opacity:1;transform:none} }
@keyframes nova-clips-flash { 0%{opacity:0;transform:translate(-50%,-50%) scale(.72)} 30%{opacity:1;transform:translate(-50%,-50%) scale(1)} 100%{opacity:0;transform:translate(-50%,-50%) scale(1.08)} }
@keyframes nova-clips-hint { 0%,55%{opacity:.7} 100%{opacity:0} }

/* NOVA R11C4R1 — IMMERSIVE FULLSCREEN CLIPS
   The clip is the canvas. Landscape YouTube trailers are center-cropped like a
   short-form feed instead of being boxed inside a 16:9 card. */
.nova-clips-viewer {
    --nova-clips-top-safe: max(env(safe-area-inset-top,0px), 8px);
    --nova-clips-bottom-safe: max(env(safe-area-inset-bottom,0px), 8px);
    background:#000 !important;
    overflow:hidden !important;
    isolation:isolate !important;
}
.nova-clips-backdrop {
    inset:-10% !important;
    background-position:center !important;
    background-size:cover !important;
    filter:blur(34px) saturate(1.18) brightness(.42) !important;
    opacity:.75 !important;
    transform:scale(1.14) !important;
}
.nova-clips-shade {
    z-index:7 !important;
    background:
      linear-gradient(180deg,rgba(0,0,0,.70) 0%,rgba(0,0,0,.18) 14%,rgba(0,0,0,0) 34%,rgba(0,0,0,0) 57%,rgba(0,0,0,.22) 72%,rgba(0,0,0,.82) 100%) !important;
    pointer-events:none !important;
}
.nova-clips-stage,
.nova-clips-stage.nova-clips-stage-immersive {
    z-index:4 !important;
    inset:0 !important;
    width:100% !important;
    height:100% !important;
    padding:0 !important;
    display:block !important;
    overflow:hidden !important;
    background:#000 !important;
}
.nova-clips-video-shell,
.nova-clips-video-shell.is-portrait {
    position:absolute !important;
    inset:0 !important;
    width:100% !important;
    height:100% !important;
    max-width:none !important;
    max-height:none !important;
    aspect-ratio:auto !important;
    border:0 !important;
    border-radius:0 !important;
    box-shadow:none !important;
    overflow:hidden !important;
    background:#000 !important;
    transform:none !important;
}
/* Landscape 16:9 sources become a true vertical-cover canvas. The iframe is
   deliberately oversized and clipped by the viewport, matching Reels/TikTok. */
.nova-clips-video-shell:not(.is-portrait) iframe {
    position:absolute !important;
    left:50% !important;
    top:50% !important;
    width:max(100vw,177.7778dvh) !important;
    height:max(100dvh,56.25vw) !important;
    min-width:100vw !important;
    min-height:100dvh !important;
    transform:translate(-50%,-50%) !important;
    transform-origin:center center !important;
    border:0 !important;
    background:#000 !important;
    pointer-events:none !important;
}
/* Native portrait clips can fill 9:16 without landscape-cover math. */
.nova-clips-video-shell.is-portrait iframe {
    position:absolute !important;
    inset:0 !important;
    width:100% !important;
    height:100% !important;
    min-width:100% !important;
    min-height:100% !important;
    transform:none !important;
    border:0 !important;
    background:#000 !important;
    pointer-events:none !important;
}
.nova-clips-tap-layer {
    z-index:9 !important;
    inset:0 !important;
}
/* A subtle center vignette integrates cropped cinematic sources into the
   vertical surface without presenting them as an embedded player. */
.nova-clips-video-shell::after {
    content:"" !important;
    position:absolute !important;
    z-index:8 !important;
    inset:0 !important;
    pointer-events:none !important;
    background:linear-gradient(90deg,rgba(0,0,0,.10),transparent 18%,transparent 82%,rgba(0,0,0,.10)) !important;
}
.nova-clips-topbar {
    z-index:22 !important;
    top:var(--nova-clips-top-safe) !important;
    padding:8px 14px !important;
    grid-template-columns:46px 1fr 46px !important;
    background:transparent !important;
}
.nova-clips-icon-button {
    width:44px !important;
    height:44px !important;
    border:0 !important;
    background:rgba(0,0,0,.24) !important;
    box-shadow:0 1px 0 rgba(255,255,255,.07) inset !important;
    backdrop-filter:blur(14px) saturate(1.25) !important;
}
.nova-clips-brand span {
    font-size:.63rem !important;
    letter-spacing:.22em !important;
    text-shadow:0 2px 12px rgba(0,0,0,.75) !important;
}
.nova-clips-brand strong {
    color:rgba(255,255,255,.82) !important;
    text-shadow:0 2px 10px rgba(0,0,0,.8) !important;
}
.nova-clips-actions {
    z-index:24 !important;
    right:max(10px,env(safe-area-inset-right,0px)) !important;
    bottom:calc(var(--nova-clips-bottom-safe) + 132px) !important;
    gap:12px !important;
}
.nova-clips-actions button {
    width:48px !important;
    min-height:48px !important;
    border:0 !important;
    border-radius:999px !important;
    background:rgba(0,0,0,.24) !important;
    box-shadow:0 1px 0 rgba(255,255,255,.08) inset,0 8px 24px rgba(0,0,0,.18) !important;
    backdrop-filter:blur(14px) saturate(1.2) !important;
}
.nova-clips-actions button small { display:none !important; }
.nova-clips-copy {
    z-index:23 !important;
    right:70px !important;
    left:16px !important;
    bottom:calc(var(--nova-clips-bottom-safe) + 22px) !important;
    max-width:min(760px,calc(100vw - 96px)) !important;
    filter:drop-shadow(0 2px 12px rgba(0,0,0,.75)) !important;
}
.nova-clips-type-row span {
    font-size:.67rem !important;
    color:#82e9ff !important;
}
.nova-clips-type-row i {
    background:rgba(0,0,0,.22) !important;
    backdrop-filter:blur(8px) !important;
}
.nova-clips-copy h2 {
    margin-top:7px !important;
    font-size:clamp(1.05rem,4.4vw,1.45rem) !important;
    line-height:1.32 !important;
    white-space:normal !important;
    display:-webkit-box !important;
    -webkit-box-orient:vertical !important;
    -webkit-line-clamp:2 !important;
    text-shadow:0 2px 14px rgba(0,0,0,.85) !important;
}
.nova-clips-copy p {
    font-size:.72rem !important;
    color:rgba(255,255,255,.74) !important;
    text-shadow:0 2px 10px rgba(0,0,0,.85) !important;
}
.nova-clips-return { display:none !important; }
.nova-clips-gesture-hint {
    z-index:21 !important;
    top:auto !important;
    bottom:calc(var(--nova-clips-bottom-safe) + 94px) !important;
    color:rgba(255,255,255,.62) !important;
    text-shadow:0 2px 8px rgba(0,0,0,.8) !important;
}
.nova-clips-state-flash {
    z-index:20 !important;
    width:66px !important;
    height:66px !important;
    border:1px solid rgba(255,255,255,.12) !important;
    background:rgba(0,0,0,.30) !important;
}
.nova-clips-toast {
    z-index:30 !important;
    bottom:calc(var(--nova-clips-bottom-safe) + 154px) !important;
}
/* The mobile layout remains fully immersive — no media query may restore the
   old boxed 16:9 player. */
@media (max-width:720px) {
    .nova-clips-stage { padding:0 !important; }
    .nova-clips-video-shell,
    .nova-clips-video-shell.is-portrait {
        width:100% !important;
        height:100% !important;
        max-height:none !important;
        border:0 !important;
        border-radius:0 !important;
        box-shadow:none !important;
    }
    .nova-clips-actions { bottom:calc(var(--nova-clips-bottom-safe) + 126px) !important; }
    .nova-clips-copy { right:68px !important; left:14px !important; bottom:calc(var(--nova-clips-bottom-safe) + 22px) !important; }
    .nova-clips-gesture-hint { bottom:calc(var(--nova-clips-bottom-safe) + 88px) !important; }
}
@media (max-height:560px) and (orientation:landscape) {
    .nova-clips-stage { padding:0 !important; }
    .nova-clips-video-shell,
    .nova-clips-video-shell.is-portrait { width:100% !important; height:100% !important; max-height:none !important; }
    .nova-clips-copy { bottom:calc(var(--nova-clips-bottom-safe) + 10px) !important; right:70px !important; }
    .nova-clips-actions { bottom:calc(var(--nova-clips-bottom-safe) + 18px) !important; }
}


/* NOVA R11C4R2 — RENDER-SAFE IMMERSIVE COVER
   Never transform or oversize the cross-origin YouTube iframe itself. Chromium
   and Android WebView can keep audio alive while dropping video pixels when a
   hardware-decoded iframe surface is transformed/oversized. The 16:9 media
   wrapper owns the cover geometry; the iframe stays a plain 100% surface. */
.nova-clips-video-shell { contain:layout paint !important; transform:none !important; }
.nova-clips-media-cover {
    position:absolute !important; z-index:2 !important; left:50% !important; top:50% !important;
    width:max(100vw,177.7778dvh) !important; height:max(100dvh,56.25vw) !important;
    min-width:100vw !important; min-height:100dvh !important;
    transform:translate3d(-50%,-50%,0) !important; transform-origin:center center !important;
    overflow:hidden !important; background:#000 !important; pointer-events:none !important;
}
.nova-clips-video-shell.is-portrait .nova-clips-media-cover {
    left:0 !important; top:0 !important; width:100% !important; height:100% !important;
    min-width:100% !important; min-height:100% !important; transform:none !important;
}
.nova-clips-video-shell iframe,
.nova-clips-video-shell:not(.is-portrait) iframe,
.nova-clips-video-shell.is-portrait iframe {
    position:absolute !important; z-index:1 !important; inset:0 !important; left:0 !important; top:0 !important;
    width:100% !important; height:100% !important; min-width:0 !important; min-height:0 !important;
    transform:none !important; transform-origin:center !important; border:0 !important;
    opacity:1 !important; visibility:visible !important; background:#000 !important; pointer-events:none !important;
}
.nova-clips-video-shell::after { z-index:8 !important; }
.nova-clips-tap-layer { z-index:9 !important; }
@media (max-width:720px) {
  .nova-clips-media-cover { width:max(100vw,177.7778dvh) !important; height:max(100dvh,56.25vw) !important; }
  .nova-clips-video-shell.is-portrait .nova-clips-media-cover { width:100% !important; height:100% !important; }
}

/* NOVA R11C4R3 — CINEMATIC SAFE CLIPS
   YouTube 16:9 is never oversized or transformed. The live iframe stays at a
   render-safe viewport-sized 16:9 surface. A full-screen cinematic thumbnail
   backdrop visually fills the portrait screen around it. */
.nova-clips-viewer { background:#000 !important; }
.nova-clips-backdrop {
  inset:-7% !important;
  background-position:center center !important;
  background-size:cover !important;
  filter:blur(30px) saturate(1.22) brightness(.42) !important;
  transform:scale(1.14) !important;
  opacity:.98 !important;
}
.nova-clips-shade {
  background:
    linear-gradient(180deg,rgba(0,0,0,.62) 0%,rgba(0,0,0,.12) 21%,rgba(0,0,0,.06) 54%,rgba(0,0,0,.72) 100%),
    radial-gradient(circle at 50% 47%,rgba(0,0,0,0) 0%,rgba(0,0,0,.10) 44%,rgba(0,0,0,.38) 100%) !important;
}
.nova-clips-stage.nova-clips-stage-immersive,
.nova-clips-video-shell,
.nova-clips-video-shell.is-portrait {
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  max-width:none !important;
  max-height:none !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
  transform:none !important;
  overflow:hidden !important;
  background:transparent !important;
}
.nova-clips-media-cover {
  position:absolute !important;
  z-index:2 !important;
  left:0 !important;
  top:50% !important;
  width:100vw !important;
  height:56.25vw !important;
  min-width:0 !important;
  min-height:0 !important;
  max-width:100vw !important;
  max-height:56.25vw !important;
  transform:translateY(-50%) !important;
  transform-origin:center center !important;
  overflow:hidden !important;
  background-position:center center !important;
  background-size:cover !important;
  background-repeat:no-repeat !important;
  box-shadow:0 0 64px rgba(0,0,0,.35) !important;
  pointer-events:none !important;
  contain:layout paint !important;
}
.nova-clips-video-shell.is-portrait .nova-clips-media-cover {
  left:50% !important;
  top:0 !important;
  width:min(100vw,56.25dvh) !important;
  height:100dvh !important;
  max-width:min(100vw,56.25dvh) !important;
  max-height:100dvh !important;
  transform:translateX(-50%) !important;
}
.nova-clips-video-shell iframe,
.nova-clips-video-shell:not(.is-portrait) iframe,
.nova-clips-video-shell.is-portrait iframe {
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  min-width:0 !important;
  min-height:0 !important;
  max-width:100% !important;
  max-height:100% !important;
  transform:none !important;
  filter:none !important;
  opacity:1 !important;
  visibility:visible !important;
  border:0 !important;
  background:#000 !important;
}
.nova-clips-video-shell::before {
  content:"" !important;
  position:absolute !important;
  z-index:1 !important;
  left:0 !important;
  right:0 !important;
  top:50% !important;
  height:62vw !important;
  max-height:46dvh !important;
  transform:translateY(-50%) !important;
  background:rgba(0,0,0,.12) !important;
  box-shadow:0 -32px 64px rgba(0,0,0,.18),0 32px 64px rgba(0,0,0,.28) !important;
  pointer-events:none !important;
}
.nova-clips-topbar,.nova-clips-actions,.nova-clips-copy,.nova-clips-gesture-hint { z-index:20 !important; }
.nova-clips-tap-layer { z-index:12 !important; }
.nova-clips-copy { max-width:min(86vw,620px) !important; }
@media (max-width:720px){
  .nova-clips-media-cover { width:100vw !important; height:56.25vw !important; max-width:100vw !important; max-height:56.25vw !important; }
  .nova-clips-video-shell.is-portrait .nova-clips-media-cover { width:min(100vw,56.25dvh) !important; height:100dvh !important; max-width:min(100vw,56.25dvh) !important; max-height:100dvh !important; }
}


/* NOVA R11C5 — NATIVE-LOOK VIEWER
   Keep the proven render-safe YouTube 16:9 surface from R11C4R3. This layer
   only refines NOVA chrome, spacing, actions and transitions. */
:root { --nova-clips-r11c5: 1; }
.nova-clips-topbar {
  top:calc(env(safe-area-inset-top,0px) + 8px) !important;
  right:12px !important; left:12px !important;
  grid-template-columns:44px 1fr 44px !important;
  padding:4px 0 !important;
}
.nova-clips-top-spacer{width:44px!important;height:44px!important;display:block!important;}
.nova-clips-icon-button{width:42px!important;height:42px!important;background:rgba(0,0,0,.20)!important;border:0!important;box-shadow:none!important;}
.nova-clips-brand span{font-size:.59rem!important;letter-spacing:.2em!important;}
.nova-clips-brand strong{font-size:.57rem!important;margin-top:1px!important;}
.nova-clips-sequence{
  position:absolute!important;z-index:26!important;
  top:calc(env(safe-area-inset-top,0px) + 58px)!important;
  right:14px!important;left:14px!important;height:3px!important;
  display:flex!important;gap:3px!important;direction:ltr!important;pointer-events:none!important;
}
.nova-clips-sequence i{height:2px!important;flex:1 1 0!important;border-radius:99px!important;background:rgba(255,255,255,.22)!important;overflow:hidden!important;}
.nova-clips-sequence i.done{background:rgba(255,255,255,.74)!important;}
.nova-clips-sequence i.active{background:linear-gradient(90deg,#63e6ff,#8b72ff,#d84cff)!important;box-shadow:0 0 8px rgba(103,206,255,.28)!important;}
.nova-clips-actions{
  right:max(10px,env(safe-area-inset-right,0px))!important;
  bottom:calc(env(safe-area-inset-bottom,0px) + 118px)!important;
  gap:10px!important;
}
.nova-clips-actions button{width:45px!important;min-height:45px!important;border-radius:999px!important;background:rgba(7,7,10,.32)!important;box-shadow:0 8px 22px rgba(0,0,0,.20)!important;}
.nova-clips-actions button svg{width:22px!important;height:22px!important;}
.nova-clips-actions button.is-liked{color:#ff5b87!important;background:rgba(64,8,25,.48)!important;}
.nova-clips-actions [data-nova-clips-prev],.nova-clips-actions [data-nova-clips-next]{display:none!important;}
.nova-clips-copy{
  right:18px!important;left:72px!important;
  bottom:calc(env(safe-area-inset-bottom,0px) + 18px)!important;
  max-width:none!important;filter:none!important;
  text-shadow:0 2px 13px rgba(0,0,0,.82)!important;
}
.nova-clips-type-row{gap:7px!important;}
.nova-clips-type-row span{font-size:.61rem!important;font-weight:850!important;}
.nova-clips-type-row i{font-size:.49rem!important;padding:3px 7px!important;}
.nova-clips-copy h2{
  max-width:min(82vw,620px)!important;margin:6px 0 0!important;
  font-size:clamp(.95rem,4vw,1.22rem)!important;line-height:1.28!important;font-weight:900!important;
  -webkit-line-clamp:2!important;
}
.nova-clips-copy p{margin-top:3px!important;font-size:.66rem!important;color:rgba(255,255,255,.68)!important;}
.nova-clips-watch{
  margin-top:9px!important;height:34px!important;padding:0 12px!important;
  display:inline-flex!important;align-items:center!important;gap:7px!important;
  border:1px solid rgba(255,255,255,.17)!important;border-radius:999px!important;
  background:rgba(255,255,255,.10)!important;color:#fff!important;font-size:.61rem!important;font-weight:850!important;
  backdrop-filter:blur(10px)!important;
}
.nova-clips-watch svg{width:15px!important;height:15px!important;}
.nova-clips-gesture-hint{display:none!important;}
.nova-clips-heart-burst{
  position:absolute!important;z-index:40!important;left:50%!important;top:50%!important;
  width:98px!important;height:98px!important;display:grid!important;place-items:center!important;
  color:#ff4f83!important;opacity:0!important;transform:translate(-50%,-50%) scale(.42)!important;pointer-events:none!important;
  filter:drop-shadow(0 8px 26px rgba(255,48,110,.34))!important;
}
.nova-clips-heart-burst svg{width:82px!important;height:82px!important;fill:currentColor!important;stroke:currentColor!important;}
.nova-clips-heart-burst.show{animation:nova-clips-heart-pop .68s cubic-bezier(.16,.84,.32,1) both!important;}
.nova-clips-video-shell.slide-next .nova-clips-media-cover{animation:nova-clips-r11c5-next .18s ease-out both!important;}
.nova-clips-video-shell.slide-prev .nova-clips-media-cover{animation:nova-clips-r11c5-prev .18s ease-out both!important;}
.nova-clips-shade{background:linear-gradient(180deg,rgba(0,0,0,.52) 0,rgba(0,0,0,.04) 25%,rgba(0,0,0,.04) 58%,rgba(0,0,0,.82) 100%)!important;}
@keyframes nova-clips-heart-pop{0%{opacity:0;transform:translate(-50%,-50%) scale(.42)}38%{opacity:1;transform:translate(-50%,-50%) scale(1.08)}72%{opacity:1;transform:translate(-50%,-50%) scale(.96)}100%{opacity:0;transform:translate(-50%,-54%) scale(1.02)}}
@keyframes nova-clips-r11c5-next{0%{opacity:.5;transform:translateY(10px)}100%{opacity:1;transform:translateY(0)}}
@keyframes nova-clips-r11c5-prev{0%{opacity:.5;transform:translateY(-10px)}100%{opacity:1;transform:translateY(0)}}
@media(max-width:720px){
 .nova-clips-copy{right:14px!important;left:66px!important;bottom:calc(env(safe-area-inset-bottom,0px) + 18px)!important;}
 .nova-clips-actions{bottom:calc(env(safe-area-inset-bottom,0px) + 112px)!important;}
 .nova-clips-copy h2{font-size:.98rem!important;}
 .nova-clips-watch{height:32px!important;}
}

/* NOVA R11C5R1 — MOBILE NOVA SHIELD
   The cross-origin YouTube surface remains render-safe and non-interactive.
   NOVA owns touch, paused/loading/buffering/offline/error states, and mobile
   edge masks so third-party chrome never becomes the primary UI. */
:root { --nova-clips-r11c5r1-mobile-shield: 1; }

.nova-clips-video-shell iframe,
.nova-clips-video-shell:not(.is-portrait) iframe,
.nova-clips-video-shell.is-portrait iframe {
  pointer-events:none !important;
  user-select:none !important;
  -webkit-user-select:none !important;
}

.nova-clips-mobile-shield {
  position:absolute !important;
  z-index:14 !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  opacity:1 !important;
  pointer-events:auto !important;
  touch-action:none !important;
  -webkit-tap-highlight-color:transparent !important;
}

.nova-clips-media-state {
  position:absolute !important;
  z-index:16 !important;
  inset:0 !important;
  display:grid !important;
  place-items:center !important;
  padding:calc(env(safe-area-inset-top,0px) + 82px) 26px calc(env(safe-area-inset-bottom,0px) + 150px) !important;
  background-position:center center !important;
  background-size:cover !important;
  background-repeat:no-repeat !important;
  opacity:1 !important;
  visibility:visible !important;
  pointer-events:none !important;
  transition:opacity .18s ease,visibility .18s ease !important;
  isolation:isolate !important;
}
.nova-clips-media-state::before {
  content:"" !important;
  position:absolute !important;
  z-index:-1 !important;
  inset:-3% !important;
  background:inherit !important;
  background-position:center !important;
  background-size:cover !important;
  filter:blur(18px) brightness(.42) saturate(1.08) !important;
  transform:scale(1.08) !important;
}
.nova-clips-media-state::after {
  content:"" !important;
  position:absolute !important;
  z-index:-1 !important;
  inset:0 !important;
  background:
    radial-gradient(circle at 50% 43%,rgba(5,8,14,.18),rgba(0,0,0,.62) 72%),
    linear-gradient(180deg,rgba(0,0,0,.34),rgba(0,0,0,.64)) !important;
}
.nova-clips-viewer[data-media-state="playing"] .nova-clips-media-state {
  opacity:0 !important;
  visibility:hidden !important;
}
.nova-clips-viewer:not([data-media-state="playing"]) .nova-clips-media-cover iframe {
  opacity:0 !important;
  visibility:hidden !important;
}
.nova-clips-viewer[data-media-state="playing"] .nova-clips-media-cover iframe {
  opacity:1 !important;
  visibility:visible !important;
}

.nova-clips-media-state-inner {
  width:min(84vw,360px) !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  text-align:center !important;
  color:#fff !important;
  text-shadow:0 2px 18px rgba(0,0,0,.88) !important;
}
.nova-clips-media-state-icon {
  width:58px !important;
  height:58px !important;
  display:grid !important;
  place-items:center !important;
  margin-bottom:14px !important;
  border:1px solid rgba(255,255,255,.17) !important;
  border-radius:999px !important;
  background:rgba(5,7,11,.42) !important;
  box-shadow:0 12px 30px rgba(0,0,0,.28) !important;
}
.nova-clips-media-state-icon svg { width:26px !important; height:26px !important; }
.nova-clips-media-state-icon.is-spinner::before {
  content:"" !important;
  width:25px !important;
  height:25px !important;
  border:2px solid rgba(255,255,255,.24) !important;
  border-top-color:#67dfff !important;
  border-radius:50% !important;
  animation:nova-clips-r11c5r1-spin .82s linear infinite !important;
}
.nova-clips-media-state-inner strong {
  display:block !important;
  font-size:.92rem !important;
  line-height:1.35 !important;
  font-weight:900 !important;
}
.nova-clips-media-state-inner p {
  max-width:290px !important;
  margin:6px 0 0 !important;
  color:rgba(255,255,255,.68) !important;
  font-size:.66rem !important;
  line-height:1.55 !important;
  font-weight:650 !important;
}
.nova-clips-media-state-actions {
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:8px !important;
  margin-top:16px !important;
  pointer-events:auto !important;
}
.nova-clips-media-state-actions button {
  min-height:36px !important;
  padding:0 13px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:7px !important;
  border:1px solid rgba(255,255,255,.16) !important;
  border-radius:999px !important;
  background:rgba(0,0,0,.38) !important;
  color:#fff !important;
  font-size:.59rem !important;
  font-weight:850 !important;
  box-shadow:0 8px 22px rgba(0,0,0,.22) !important;
  -webkit-tap-highlight-color:transparent !important;
}
.nova-clips-media-state-actions button svg { width:16px !important; height:16px !important; }
.nova-clips-media-state-actions button[hidden] { display:none !important; }

.nova-clips-viewer[data-media-state="paused"] .nova-clips-media-state-inner p { color:rgba(255,255,255,.76) !important; }
.nova-clips-viewer[data-media-state="paused"] .nova-clips-media-state-icon {
  width:66px !important;
  height:66px !important;
  background:rgba(0,0,0,.48) !important;
}
.nova-clips-viewer[data-media-state="paused"] .nova-clips-media-state-icon svg { width:31px !important; height:31px !important; margin-left:3px !important; }

.nova-clips-yt-mask {
  display:none !important;
  position:absolute !important;
  z-index:5 !important;
  pointer-events:none !important;
}

@media (max-width:720px) {
  .nova-clips-yt-mask { display:block !important; }
  .nova-clips-yt-mask-top {
    top:0 !important;
    right:0 !important;
    left:0 !important;
    height:18% !important;
    background:linear-gradient(180deg,rgba(0,0,0,.96) 0%,rgba(0,0,0,.82) 48%,rgba(0,0,0,0) 100%) !important;
  }
  .nova-clips-yt-mask-left {
    left:0 !important;
    bottom:0 !important;
    width:38% !important;
    height:18% !important;
    background:linear-gradient(20deg,rgba(0,0,0,.94),rgba(0,0,0,.64) 54%,rgba(0,0,0,0) 100%) !important;
  }
  .nova-clips-yt-mask-right {
    right:0 !important;
    bottom:0 !important;
    width:28% !important;
    height:18% !important;
    background:linear-gradient(340deg,rgba(0,0,0,.94),rgba(0,0,0,.64) 54%,rgba(0,0,0,0) 100%) !important;
  }
  .nova-clips-media-state {
    padding-top:calc(env(safe-area-inset-top,0px) + 78px) !important;
    padding-bottom:calc(env(safe-area-inset-bottom,0px) + 140px) !important;
  }
}

@media (hover:hover) and (pointer:fine) {
  /* Desktop already has the desired native-look presentation. Keep the mobile
     edge masks and hard touch shield out of pointer/fine layouts. */
  .nova-clips-yt-mask { display:none !important; }
}

@media (prefers-reduced-motion:reduce) {
  .nova-clips-media-state,
  .nova-clips-media-state-icon.is-spinner::before { transition:none !important; animation:none !important; }
}

@keyframes nova-clips-r11c5r1-spin { to { transform:rotate(360deg); } }


/* NOVA R11C5R2 — MAUI GRACE + LEFT MOBILE ACTIONS
   Server-only Android MAUI compatibility. The stable 16:9 iframe surface is
   untouched; this layer only prevents false watchdog failure and refines NOVA UI. */
:root { --nova-clips-r11c5r2-maui-grace-left-actions: 1; }

/* Professional glass action controls. */
.nova-clips-actions button {
  border:1px solid rgba(255,255,255,.13) !important;
  background:linear-gradient(145deg,rgba(18,20,28,.54),rgba(3,5,10,.36)) !important;
  color:rgba(255,255,255,.96) !important;
  box-shadow:0 10px 28px rgba(0,0,0,.27),inset 0 1px 0 rgba(255,255,255,.05) !important;
  backdrop-filter:blur(14px) saturate(1.18) !important;
  -webkit-backdrop-filter:blur(14px) saturate(1.18) !important;
  transition:transform .14s ease,background .14s ease,border-color .14s ease,color .14s ease !important;
}
.nova-clips-actions button:active {
  transform:scale(.91) !important;
  background:rgba(255,255,255,.16) !important;
}
.nova-clips-actions button svg {
  width:22px !important;
  height:22px !important;
  filter:drop-shadow(0 2px 5px rgba(0,0,0,.38)) !important;
}
.nova-clips-actions button.is-liked {
  color:#ff5d8f !important;
  border-color:rgba(255,93,143,.34) !important;
  background:linear-gradient(145deg,rgba(94,16,47,.66),rgba(35,4,18,.50)) !important;
}
.nova-clips-actions button.is-liked svg path { fill:currentColor !important; }

@media (max-width:720px) {
  /* User-requested mobile layout: sound / like / share live on the LEFT edge. */
  .nova-clips-actions {
    left:max(12px,env(safe-area-inset-left,0px)) !important;
    right:auto !important;
    bottom:calc(env(safe-area-inset-bottom,0px) + 116px) !important;
    gap:11px !important;
    align-items:center !important;
  }
  .nova-clips-actions button {
    width:48px !important;
    height:48px !important;
    min-height:48px !important;
    padding:0 !important;
    border-radius:999px !important;
  }
  .nova-clips-actions button svg { width:23px !important; height:23px !important; }
  .nova-clips-actions button small { display:none !important; }

  /* Reserve the left action rail; copy remains clean and RTL on the opposite side. */
  .nova-clips-copy {
    left:76px !important;
    right:14px !important;
    text-align:right !important;
  }

  /* Cleaner status surface for MAUI/Android without competing with left actions. */
  .nova-clips-media-state-inner {
    width:min(78vw,330px) !important;
  }
  .nova-clips-media-state-icon {
    width:54px !important;
    height:54px !important;
    background:rgba(5,7,12,.34) !important;
    border-color:rgba(255,255,255,.13) !important;
  }
  .nova-clips-media-state-inner strong { font-size:.9rem !important; }
  .nova-clips-media-state-inner p { font-size:.64rem !important; }
  .nova-clips-media-state-actions button {
    min-height:38px !important;
    padding:0 15px !important;
    background:rgba(8,10,15,.48) !important;
    border-color:rgba(255,255,255,.14) !important;
  }
}

/* A MAUI-loaded frame is allowed to become visible after its grace window even
   when Android WebView withholds YT onStateChange messages. Explicit YT errors
   and browser offline events still keep the NOVA state cover in charge. */
.nova-clips-viewer[data-native-host="maui-android"][data-media-state="playing"] .nova-clips-media-cover iframe {
  opacity:1 !important;
  visibility:visible !important;
}

@media (prefers-reduced-motion:reduce) {
  .nova-clips-actions button { transition:none !important; }
}

/* NOVA R12 — vertical native advertisement player.
   The iframe is never transformed: its 16:9 surface is centered with physical
   geometry and clipped by the portrait viewport. YouTube edge chrome remains
   outside the visible crop while NOVA owns every interactive layer. */
:root{--nova-clips-r12-native-vertical:1}
.nova-clips-viewer{
  width:100vw!important;
  width:100dvw!important;
  height:100vh!important;
  height:100dvh!important;
  background:#000!important;
}
.nova-clips-stage.nova-clips-stage-immersive,
.nova-clips-video-shell,
.nova-clips-video-shell.is-portrait{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  max-height:none!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:#000!important;
  overflow:hidden!important;
  contain:layout paint!important;
}
.nova-clips-media-cover,
.nova-clips-video-shell.is-portrait .nova-clips-media-cover{
  position:absolute!important;
  z-index:2!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  min-width:100%!important;
  min-height:100%!important;
  max-width:none!important;
  max-height:none!important;
  transform:none!important;
  overflow:hidden!important;
  background-position:center!important;
  background-size:cover!important;
  contain:layout paint!important;
}
/* Landscape ads cover the portrait screen. Centering uses left+margin instead
   of transform, avoiding the Android WebView transformed-video surface bug. */
.nova-clips-video-shell:not(.is-portrait) .nova-clips-media-cover iframe{
  position:absolute!important;
  z-index:1!important;
  top:0!important;
  bottom:auto!important;
  left:50%!important;
  right:auto!important;
  width:177.777778dvh!important;
  height:100dvh!important;
  min-width:177.777778dvh!important;
  min-height:100dvh!important;
  max-width:none!important;
  max-height:none!important;
  margin-left:-88.888889dvh!important;
  transform:none!important;
  border:0!important;
  background:#000!important;
  pointer-events:none!important;
}
.nova-clips-video-shell.is-portrait .nova-clips-media-cover iframe{
  position:absolute!important;
  z-index:1!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  min-width:100%!important;
  min-height:100%!important;
  max-width:none!important;
  max-height:none!important;
  margin:0!important;
  transform:none!important;
  border:0!important;
  pointer-events:none!important;
}
/* No third-party-looking bars: these masks are visual-only and sit below all
   NOVA controls. The wide crop already moves YouTube edge controls offscreen. */
.nova-clips-media-cover:before,
.nova-clips-media-cover:after{
  content:""!important;
  position:absolute!important;
  z-index:6!important;
  right:0!important;
  left:0!important;
  height:17dvh!important;
  pointer-events:none!important;
}
.nova-clips-media-cover:before{top:0!important;background:linear-gradient(180deg,rgba(0,0,0,.64),rgba(0,0,0,.14) 58%,transparent)!important}
.nova-clips-media-cover:after{bottom:0!important;background:linear-gradient(0deg,rgba(0,0,0,.86),rgba(0,0,0,.18) 66%,transparent)!important}
.nova-clips-yt-mask{display:none!important}
.nova-clips-video-shell:before{display:none!important}
.nova-clips-video-shell:after{
  z-index:8!important;
  background:radial-gradient(circle at 50% 44%,transparent 34%,rgba(0,0,0,.08) 72%,rgba(0,0,0,.30) 100%)!important;
}
.nova-clips-mobile-shield{z-index:14!important;pointer-events:auto!important}
.nova-clips-topbar{z-index:28!important}
.nova-clips-sequence{z-index:29!important}
.nova-clips-actions{z-index:27!important}
.nova-clips-copy{z-index:26!important}
.nova-clips-media-state{z-index:20!important}
.nova-clips-state-flash{z-index:24!important}

@media (min-width:900px){
  /* Desktop keeps the portrait reel centred and lets the surrounding canvas act
     as a two-column composition: video/copy plus the action rail. */
  .nova-clips-video-shell:not(.is-portrait) .nova-clips-media-cover iframe{
    width:max(100vw,177.777778dvh)!important;
    min-width:max(100vw,177.777778dvh)!important;
    left:50%!important;
    margin-left:0!important;
    transform:translateX(-50%)!important;
  }
  .nova-clips-copy{right:max(30px,calc((100vw - 1180px)/2))!important;max-width:min(720px,60vw)!important}
  .nova-clips-actions{left:max(24px,calc((100vw - 1180px)/2))!important;right:auto!important}
}
@media (orientation:landscape) and (max-height:560px){
  .nova-clips-video-shell:not(.is-portrait) .nova-clips-media-cover iframe{
    width:100vw!important;height:56.25vw!important;min-width:100vw!important;min-height:56.25vw!important;
    top:50%!important;left:0!important;margin-left:0!important;margin-top:-28.125vw!important;
  }
}

/* NOVA R12P1 — premium interaction polish.
   This final layer changes NOVA chrome only; iframe geometry and playback stay
   identical to the proven R12 Android build. */
:root{--nova-clips-r12p1-premium:1}
.nova-clips-viewer{
  --clips-cyan:#25d7ff;
  --clips-blue:#3984ff;
  --clips-indigo:#6557ff;
  --clips-violet:#a64cff;
  --clips-magenta:#ee42cc;
  font-synthesis:none!important;
  -webkit-font-smoothing:antialiased!important;
}
.nova-clips-shade{
  background:
    radial-gradient(circle at 50% 38%,transparent 26%,rgba(0,0,0,.08) 60%,rgba(0,0,0,.34) 100%),
    linear-gradient(180deg,rgba(0,0,0,.58) 0%,rgba(0,0,0,.04) 23%,rgba(0,0,0,.02) 55%,rgba(0,0,0,.88) 100%)!important;
}
.nova-clips-topbar{
  top:calc(env(safe-area-inset-top,0px) + 7px)!important;
  right:11px!important;
  left:11px!important;
  grid-template-columns:42px 1fr 42px!important;
}
.nova-clips-icon-button{
  width:40px!important;
  height:40px!important;
  border:1px solid rgba(255,255,255,.12)!important;
  background:linear-gradient(145deg,rgba(20,22,31,.54),rgba(4,5,9,.30))!important;
  box-shadow:0 8px 26px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.07)!important;
  backdrop-filter:blur(16px) saturate(1.2)!important;
  -webkit-backdrop-filter:blur(16px) saturate(1.2)!important;
  transition:transform .14s ease,background-color .14s ease,border-color .14s ease!important;
  -webkit-tap-highlight-color:transparent!important;
}
.nova-clips-icon-button:active{transform:scale(.9)!important;border-color:rgba(101,111,255,.54)!important}
.nova-clips-brand{
  justify-self:center!important;
  min-width:108px!important;
  padding:5px 12px 4px!important;
  border:1px solid rgba(255,255,255,.08)!important;
  border-radius:999px!important;
  background:rgba(3,4,8,.24)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035)!important;
  backdrop-filter:blur(12px)!important;
  -webkit-backdrop-filter:blur(12px)!important;
}
.nova-clips-brand span{
  color:#c9f5ff!important;
  font-size:.55rem!important;
  letter-spacing:.22em!important;
  text-shadow:0 0 16px rgba(37,215,255,.34)!important;
}
.nova-clips-brand strong{margin-top:1px!important;color:rgba(255,255,255,.78)!important;font-variant-numeric:tabular-nums!important}
.nova-clips-sequence{
  top:calc(env(safe-area-inset-top,0px) + 57px)!important;
  right:13px!important;
  left:13px!important;
  gap:4px!important;
}
.nova-clips-sequence i{
  height:3px!important;
  background:rgba(255,255,255,.20)!important;
  box-shadow:0 1px 4px rgba(0,0,0,.18)!important;
}
.nova-clips-sequence i.done{background:rgba(255,255,255,.68)!important}
.nova-clips-sequence i.active{
  position:relative!important;
  background:linear-gradient(90deg,var(--clips-cyan),var(--clips-indigo) 46%,var(--clips-violet) 74%,var(--clips-magenta))!important;
  box-shadow:0 0 12px rgba(83,116,255,.52)!important;
}
.nova-clips-actions{
  gap:10px!important;
  filter:drop-shadow(0 10px 24px rgba(0,0,0,.18))!important;
}
.nova-clips-actions button{
  position:relative!important;
  width:47px!important;
  height:47px!important;
  min-height:47px!important;
  overflow:hidden!important;
  border:1px solid rgba(255,255,255,.14)!important;
  background:linear-gradient(145deg,rgba(22,24,34,.58),rgba(3,4,8,.34))!important;
  box-shadow:0 10px 28px rgba(0,0,0,.25),inset 0 1px 0 rgba(255,255,255,.075)!important;
  backdrop-filter:blur(17px) saturate(1.22)!important;
  -webkit-backdrop-filter:blur(17px) saturate(1.22)!important;
  transition:transform .14s cubic-bezier(.2,.8,.2,1),border-color .14s ease,box-shadow .14s ease,color .14s ease!important;
  -webkit-tap-highlight-color:transparent!important;
}
.nova-clips-actions button::after{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  border-radius:inherit!important;
  background:linear-gradient(135deg,rgba(37,215,255,.14),transparent 40%,rgba(166,76,255,.10))!important;
  opacity:0!important;
  transition:opacity .14s ease!important;
  pointer-events:none!important;
}
.nova-clips-actions button:active{transform:scale(.88)!important;border-color:rgba(91,117,255,.48)!important;box-shadow:0 5px 15px rgba(0,0,0,.22)!important}
.nova-clips-actions button:active::after{opacity:1!important}
.nova-clips-viewer[data-sound="audible"] [data-nova-clips-mute]{
  color:#89ecff!important;
  border-color:rgba(37,215,255,.40)!important;
  box-shadow:0 10px 28px rgba(0,0,0,.25),0 0 18px rgba(37,215,255,.10),inset 0 1px 0 rgba(255,255,255,.08)!important;
}
.nova-clips-actions button.is-liked{
  color:#ff5f9e!important;
  border-color:rgba(255,86,149,.38)!important;
  background:linear-gradient(145deg,rgba(104,16,55,.66),rgba(31,3,16,.44))!important;
  box-shadow:0 10px 28px rgba(0,0,0,.25),0 0 20px rgba(255,65,141,.12)!important;
}
.nova-clips-copy{
  right:15px!important;
  left:70px!important;
  bottom:calc(env(safe-area-inset-bottom,0px) + 16px)!important;
  padding:18px 2px 2px!important;
  text-shadow:0 2px 15px rgba(0,0,0,.96),0 1px 3px rgba(0,0,0,.9)!important;
}
.nova-clips-type-row span{color:#82eaff!important;letter-spacing:.015em!important}
.nova-clips-type-row i{
  border-color:rgba(80,198,255,.30)!important;
  background:linear-gradient(135deg,rgba(31,169,255,.16),rgba(146,73,255,.14))!important;
  color:#c7f5ff!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05)!important;
}
.nova-clips-copy h2{
  display:-webkit-box!important;
  overflow:hidden!important;
  max-width:min(84vw,660px)!important;
  white-space:normal!important;
  text-overflow:ellipsis!important;
  -webkit-box-orient:vertical!important;
  -webkit-line-clamp:2!important;
  line-clamp:2!important;
  letter-spacing:-.012em!important;
}
.nova-clips-copy p{color:rgba(255,255,255,.70)!important;text-shadow:0 2px 9px #000!important}
.nova-clips-watch{
  position:relative!important;
  height:35px!important;
  margin-top:10px!important;
  padding:0 13px!important;
  overflow:hidden!important;
  border:1px solid rgba(255,255,255,.18)!important;
  background:linear-gradient(135deg,rgba(38,41,55,.68),rgba(5,6,10,.46))!important;
  box-shadow:0 8px 22px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.08)!important;
  transition:transform .14s ease,border-color .14s ease!important;
  -webkit-tap-highlight-color:transparent!important;
}
.nova-clips-watch::before{
  content:""!important;
  position:absolute!important;
  top:0!important;
  bottom:0!important;
  right:0!important;
  width:3px!important;
  background:linear-gradient(180deg,var(--clips-cyan),var(--clips-indigo),var(--clips-violet))!important;
  box-shadow:0 0 12px rgba(71,120,255,.7)!important;
}
.nova-clips-watch:active{transform:scale(.95)!important;border-color:rgba(93,128,255,.48)!important}
.nova-clips-toast{
  padding:9px 14px!important;
  border-color:rgba(255,255,255,.10)!important;
  background:rgba(5,6,10,.72)!important;
  box-shadow:0 12px 34px rgba(0,0,0,.28)!important;
  backdrop-filter:blur(18px) saturate(1.2)!important;
  -webkit-backdrop-filter:blur(18px) saturate(1.2)!important;
}
.nova-clips-state-flash{
  width:64px!important;
  height:64px!important;
  border:1px solid rgba(255,255,255,.12)!important;
  background:linear-gradient(145deg,rgba(13,15,22,.62),rgba(0,0,0,.46))!important;
  box-shadow:0 12px 36px rgba(0,0,0,.3),0 0 22px rgba(94,83,255,.10)!important;
  backdrop-filter:blur(16px)!important;
  -webkit-backdrop-filter:blur(16px)!important;
}
.nova-clips-media-state-icon.is-spinner::before{
  border-color:rgba(255,255,255,.16)!important;
  border-top-color:var(--clips-cyan)!important;
  border-right-color:var(--clips-violet)!important;
  box-shadow:0 0 14px rgba(66,131,255,.18)!important;
}
.nova-clips-media-state-actions button:first-child{
  border-color:rgba(94,102,255,.34)!important;
  background:linear-gradient(135deg,rgba(44,92,255,.28),rgba(139,67,255,.24))!important;
}
@media (max-width:420px){
  .nova-clips-brand{min-width:100px!important;padding-inline:10px!important}
  .nova-clips-actions{left:max(10px,env(safe-area-inset-left,0px))!important;gap:9px!important}
  .nova-clips-actions button{width:45px!important;height:45px!important;min-height:45px!important}
  .nova-clips-copy{right:13px!important;left:63px!important}
  .nova-clips-copy h2{font-size:.94rem!important}
  .nova-clips-copy p{max-width:76vw!important}
}
@media (hover:hover) and (pointer:fine){
  .nova-clips-icon-button:hover,.nova-clips-actions button:hover,.nova-clips-watch:hover{
    border-color:rgba(102,126,255,.44)!important;
    transform:translateY(-1px)!important;
  }
}
@media (prefers-reduced-motion:reduce){
  .nova-clips-icon-button,.nova-clips-actions button,.nova-clips-actions button::after,.nova-clips-watch{transition:none!important}
}