/**
 * DUVEO Stream 7.6.3 — Unified Quality System
 * Unifies color, spacing, video sizing and typography across desktop and mobile.
 */

:root {
  --duveo-cyan: #00aeee;
  --duveo-cyan-deep: #007fae;
  --duveo-indigo: #6557f5;
  --duveo-indigo-deep: #5144dc;
  --duveo-canvas: #f6f8fc;
  --duveo-surface: #ffffff;
  --duveo-surface-2: #eef3f9;
  --duveo-ink: #111827;
  --duveo-muted: #657085;
  --duveo-line: rgba(17, 24, 39, .10);
  --duveo-card-radius: 15px;
  --duveo-content-max: 1600px;
  --duveo-watch-sidebar: 310px;
  --duveo-card-gap-x: 16px;
  --duveo-card-gap-y: 24px;
}

html[data-theme="dark"] {
  --duveo-canvas: #07111f;
  --duveo-surface: #0d1929;
  --duveo-surface-2: #122238;
  --duveo-ink: #f7f9fd;
  --duveo-muted: #a2b1c5;
  --duveo-line: rgba(226, 235, 247, .12);
}

body.daar-v7 {
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  font-optical-sizing: auto;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

/* Accessible brand usage: cyan signals activity; indigo carries white text. */
body.daar-v7 .daar-button.is-primary,
body.daar-v7 button.is-primary,
body.daar-v7 a.is-primary,
body.daar-v7 .daar-header-create,
body.daar-v7 .daar-chat-send,
body.daar-v7 .form-submit .submit {
  background: var(--duveo-indigo) !important;
  color: #fff !important;
  border-color: transparent !important;
  box-shadow: 0 10px 26px rgba(101, 87, 245, .24) !important;
}
body.daar-v7 .daar-button.is-primary:hover,
body.daar-v7 button.is-primary:hover,
body.daar-v7 a.is-primary:hover,
body.daar-v7 .daar-header-create:hover {
  background: var(--duveo-indigo-deep) !important;
}
body.daar-v7 .daar-progress-fill,
body.daar-v7 progress,
body.daar-v7 input[type="range"] { accent-color: var(--duveo-cyan-deep); }
body.daar-v7 .daar-verified {
  background: var(--duveo-cyan) !important;
  color: #07111f !important;
}

/* One spacing rhythm across all content areas. */
body.daar-v7 .daar-section,
body.daar-v7 .daar-home-feed,
body.daar-v7 .daar-home-categories,
body.daar-v7 .daar-home-premieres,
body.daar-v7 .daar-home-shorts,
body.daar-v7 .daar-home-momentum,
body.daar-v7 .daar-home-continue {
  padding-block: clamp(22px, 2.8vw, 38px) !important;
}
body.daar-v7 .daar-section-heading,
body.daar-v7 .daar-home-section-heading { margin-bottom: 14px !important; }
body.daar-v7 .daar-section-heading h2,
body.daar-v7 .daar-home-section-heading h2 {
  font-size: clamp(1.35rem, 2.2vw, 2rem) !important;
  line-height: 1.08 !important;
  letter-spacing: -.025em !important;
}

/* Home hero: cinematic, but content appears without excessive scrolling. */
body.daar-v7-home .duveo-premium-hero__stage {
  min-height: clamp(380px, 40vw, 520px) !important;
  max-height: 520px !important;
}
body.daar-v7-home .duveo-premium-hero__content {
  max-width: 760px !important;
  padding-block: clamp(34px, 5vw, 64px) 76px !important;
}
body.daar-v7-home .duveo-premium-hero h1 {
  max-width: 720px !important;
  font-size: clamp(2rem, 4.2vw, 3.75rem) !important;
  line-height: 1.02 !important;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}
body.daar-v7-home .duveo-premium-hero__content > p {
  max-width: 620px !important;
  font-size: 1rem !important;
  line-height: 1.55 !important;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
}

/* Consistent grids and media proportions. */
body.daar-v7 .daar-card-grid,
body.daar-v7 .daar-creator-grid {
  gap: var(--duveo-card-gap-y) var(--duveo-card-gap-x) !important;
}
body.daar-v7 .daar-card__media,
body.daar-v7 .daar-home-media-card__image,
body.daar-v7 .daar-home-premiere-card__media {
  aspect-ratio: 16 / 9 !important;
  border-radius: var(--duveo-card-radius) !important;
}
body.daar-v7 .daar-card__title,
body.daar-v7 .daar-home-media-card h3,
body.daar-v7 .daar-home-media-card__title {
  min-height: 2.55em !important;
  margin-top: 8px !important;
  font-size: 1rem !important;
  font-weight: 700 !important;
  line-height: 1.27 !important;
  letter-spacing: -.012em !important;
  display: -webkit-box !important;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}
body.daar-v7 .daar-card__creator,
body.daar-v7 .daar-home-media-card__channel,
body.daar-v7 .daar-home-media-card__creator {
  font-size: .8125rem !important;
  line-height: 1.3 !important;
}
body.daar-v7 .daar-card__meta,
body.daar-v7 .daar-home-media-card__meta,
body.daar-v7 .daar-home-media-card__details--compact small {
  color: var(--duveo-muted) !important;
  font-size: .75rem !important;
  line-height: 1.3 !important;
}
body.daar-v7 .daar-card__duration,
body.daar-v7 .duveo-card-duration {
  display: inline-flex !important;
  align-items: center;
  min-height: 22px;
  padding: 3px 7px !important;
  font-size: .6875rem !important;
  line-height: 1 !important;
}
body.daar-v7 .daar-card__creator img,
body.daar-v7 .daar-home-media-card__details--compact img {
  width: 34px !important;
  height: 34px !important;
}

@media (min-width: 1280px) {
  body.daar-v7 .daar-card-grid { grid-template-columns: repeat(5, minmax(0, 1fr)) !important; }
  body.daar-v7-home .daar-home-media-rail { grid-auto-columns: minmax(230px, calc((100% - 64px) / 5)) !important; }
}
@media (min-width: 1024px) and (max-width: 1279px) {
  body.daar-v7 .daar-card-grid { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
  body.daar-v7-home .daar-home-media-rail { grid-auto-columns: minmax(225px, calc((100% - 48px) / 4)) !important; }
}
@media (min-width: 768px) and (max-width: 1023px) {
  body.daar-v7 .daar-card-grid { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
}

/* Watch page: use large displays instead of leaving unused side space. */
body.daar-v7-singular .daar-watch-page > .daar-shell,
body.daar-v7-singular .daar-watch-grid {
  width: min(var(--duveo-content-max), calc(100% - 40px)) !important;
  max-width: var(--duveo-content-max) !important;
  margin-inline: auto !important;
}
body.daar-v7-singular .daar-watch-grid.has-related-videos {
  grid-template-columns: minmax(0, 1fr) minmax(290px, var(--duveo-watch-sidebar)) !important;
  gap: clamp(18px, 2vw, 28px) !important;
}
body.daar-v7-singular .daar-watch-grid.has-event-chat {
  grid-template-columns: minmax(0, 1fr) minmax(320px, 360px) !important;
  gap: clamp(18px, 2vw, 28px) !important;
}
body.daar-v7-singular .daar-player {
  width: 100% !important;
  aspect-ratio: 16 / 9 !important;
  max-height: 72vh !important;
  border-radius: 18px !important;
  background: #000 !important;
}
body.daar-v7-singular .daar-player video,
body.daar-v7-singular .daar-player iframe,
body.daar-v7-singular .daar-player__poster {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  background: #000 !important;
}
body.daar-v7-singular .daar-watch-heading { padding-top: 18px !important; }
body.daar-v7-singular .daar-watch-heading h1 {
  max-width: 1120px;
  font-size: clamp(2rem, 3vw, 2.5rem) !important;
  line-height: 1.08 !important;
  letter-spacing: -.035em !important;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}
body.daar-v7-singular .daar-watch-meta {
  color: var(--duveo-muted) !important;
  font-size: .8125rem !important;
}
body.daar-v7-singular .daar-creator-bar__identity strong { font-size: 1rem !important; }
body.daar-v7-singular .daar-creator-bar__identity small { font-size: .8125rem !important; }
body.daar-v7-singular .daar-description__content,
body.daar-v7-singular .daar-description p {
  color: color-mix(in srgb, var(--duveo-ink) 86%, var(--duveo-muted)) !important;
  font-size: 1rem !important;
  line-height: 1.62 !important;
}
body.daar-v7-singular .daar-related-sidebar {
  width: 100% !important;
  max-width: var(--duveo-watch-sidebar) !important;
}

/* Shorts keep a cinematic player but all surrounding UI follows Aurora. */
body.daar-v7 .daar-shorts-explore,
body.daar-v7 .daar-short-viewer-info,
body.daar-v7 .daar-shorts-empty {
  color: var(--duveo-ink) !important;
}
body.daar-v7 .daar-short-explore-card,
body.daar-v7 .daar-short-viewer-info {
  background: var(--duveo-surface) !important;
  border-color: var(--duveo-line) !important;
  color: var(--duveo-ink) !important;
  box-shadow: none !important;
}
body.daar-v7 .daar-short-explore-card:hover {
  border-color: rgba(0, 174, 238, .45) !important;
}
body.daar-v7 .daar-short-explore-card__body h2 { font-size: .9375rem !important; }
body.daar-v7 .daar-short-explore-card__body p,
body.daar-v7 .daar-short-viewer-info p { color: var(--duveo-muted) !important; }
body.daar-v7 .daar-short-card__actions .daar-action.is-active,
body.daar-v7 .daar-actions--inline .daar-action.is-active,
body.daar-v7 .daar-short-card__actions .daar-action[data-daar-like].is-active,
body.daar-v7 .daar-actions--inline .daar-action[data-daar-like].is-active {
  background: rgba(0, 174, 238, .14) !important;
  border-color: rgba(0, 174, 238, .48) !important;
  color: #67dcff !important;
}

/* Premiere pages: the video remains dominant, secondary tools are quieter. */
body.daar-v7 .daar-page-hero.is-premiere,
body.daar-v7 .daar-premiere-manager > article,
body.daar-v7 .daar-event-chat,
body.daar-v7 .daar-premiere-chat,
body.daar-v7 .daar-premiere-panel {
  background: var(--duveo-surface) !important;
  color: var(--duveo-ink) !important;
  border-color: var(--duveo-line) !important;
}
body.daar-v7 .daar-page-hero.is-premiere p,
body.daar-v7 .daar-event-chat small,
body.daar-v7 .daar-premiere-panel small { color: var(--duveo-muted) !important; }
body.daar-v7 .daar-premiere-tabs button {
  background: var(--duveo-surface) !important;
  color: var(--duveo-muted) !important;
  border-color: var(--duveo-line) !important;
  font-size: .75rem !important;
}
body.daar-v7 .daar-premiere-tabs button.is-active,
body.daar-v7 .daar-premiere-tabs button:hover {
  background: rgba(0, 174, 238, .10) !important;
  color: var(--duveo-cyan-deep) !important;
  border-color: rgba(0, 174, 238, .38) !important;
}

/* States use one exact Aurora ring everywhere. */
body.daar-v7 .daar-chat-status-bubble > span,
body.daar-v7 .daar-profile-status-button > span,
body.daar-v7 .duveo-home-statuses__empty > span {
  background: linear-gradient(135deg, var(--duveo-cyan), var(--duveo-indigo)) !important;
}
body.daar-v7 .daar-chat-status-bubble.is-seen > span,
body.daar-v7 .daar-profile-status-button.is-seen > span {
  background: #7c8798 !important;
}

@media (max-width: 1180px) {
  body.daar-v7-singular .daar-watch-grid.has-related-videos,
  body.daar-v7-singular .daar-watch-grid.has-event-chat {
    grid-template-columns: minmax(0, 1fr) minmax(280px, 300px) !important;
  }
}

@media (max-width: 900px) {
  body.daar-v7-singular .daar-watch-grid.has-related-videos,
  body.daar-v7-singular .daar-watch-grid.has-event-chat {
    grid-template-columns: 1fr !important;
  }
  body.daar-v7-singular .daar-related-sidebar { max-width: none !important; }
}

@media (max-width: 767px) {
  :root {
    --duveo-card-gap-x: 9px;
    --duveo-card-gap-y: 18px;
  }
  body.daar-v7-home .duveo-premium-hero__stage {
    min-height: clamp(300px, 88vw, 380px) !important;
    max-height: 380px !important;
    border-radius: 20px !important;
  }
  body.daar-v7-home .duveo-premium-hero__content {
    padding: 110px 16px 72px !important;
  }
  body.daar-v7-home .duveo-premium-hero h1 {
    font-size: clamp(1.85rem, 8vw, 2.55rem) !important;
  }
  body.daar-v7-home .duveo-premium-hero__content > p {
    font-size: .875rem !important;
    -webkit-line-clamp: 2;
  }

  body.daar-v7 .daar-card-grid,
  body.daar-v7 .duveo-mobile-two-column {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: var(--duveo-card-gap-y) var(--duveo-card-gap-x) !important;
  }
  body.daar-v7 .daar-card__media,
  body.daar-v7 .daar-home-media-card__image,
  body.daar-v7 .daar-home-premiere-card__media {
    border-radius: 11px !important;
  }
  body.daar-v7 .daar-card__title,
  body.daar-v7 .duveo-mobile-two-column .daar-card__title,
  body.daar-v7 .daar-home-media-card h3,
  body.daar-v7 .daar-home-media-card__title {
    min-height: 2.55em !important;
    margin-top: 7px !important;
    font-size: .875rem !important;
    line-height: 1.28 !important;
  }
  body.daar-v7 .daar-card__creator,
  body.daar-v7 .daar-home-media-card__channel,
  body.daar-v7 .daar-home-media-card__creator,
  body.daar-v7 .daar-home-media-card__handle {
    font-size: .75rem !important;
  }
  body.daar-v7 .daar-card__meta,
  body.daar-v7 .duveo-mobile-two-column .daar-card__meta,
  body.daar-v7 .daar-home-media-card__meta,
  body.daar-v7 .daar-home-media-card__details--compact small {
    font-size: .6875rem !important;
    line-height: 1.25 !important;
  }
  body.daar-v7 .daar-card__duration,
  body.daar-v7 .duveo-card-duration {
    min-height: 20px !important;
    font-size: .625rem !important;
  }
  body.daar-v7 .daar-card__creator img,
  body.daar-v7 .daar-home-media-card__details--compact img {
    width: 30px !important;
    height: 30px !important;
  }

  body.daar-v7-singular .daar-watch-page { padding-top: 0 !important; }
  body.daar-v7-singular .daar-watch-page > .daar-shell,
  body.daar-v7-singular .daar-watch-grid {
    width: 100% !important;
    max-width: none !important;
  }
  body.daar-v7-singular .daar-player {
    max-height: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
  }
  body.daar-v7-singular .daar-watch-contextbar,
  body.daar-v7-singular .daar-watch-heading,
  body.daar-v7-singular .daar-creator-bar,
  body.daar-v7-singular .daar-actions,
  body.daar-v7-singular .daar-description,
  body.daar-v7-singular .daar-conversation,
  body.daar-v7-singular .daar-related-sidebar {
    margin-inline: 14px !important;
  }
  body.daar-v7-singular .daar-watch-heading h1 {
    font-size: clamp(1.25rem, 5.4vw, 1.375rem) !important;
    line-height: 1.16 !important;
  }
  body.daar-v7-singular .daar-watch-meta { font-size: .71875rem !important; }
  body.daar-v7-singular .daar-creator-bar__identity strong { font-size: .9375rem !important; }
  body.daar-v7-singular .daar-creator-bar__identity small { font-size: .75rem !important; }
  body.daar-v7-singular .daar-description__content,
  body.daar-v7-singular .daar-description p {
    font-size: .9375rem !important;
  }

  body.daar-v7 .daar-short-explore-card__body h2 { font-size: .875rem !important; }
  body.daar-v7 .daar-short-explore-card__body p { font-size: .75rem !important; }
}

@media (max-width: 350px) {
  body.daar-v7 .daar-card__meta > span:nth-child(2),
  body.daar-v7 .daar-card__meta > span:nth-child(3),
  body.daar-v7 .daar-home-media-card__meta > span:nth-child(2),
  body.daar-v7 .daar-home-media-card__meta > span:nth-child(3) {
    display: none !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.daar-v7-home .duveo-premium-hero__media img,
  body.daar-v7 .daar-card__media img { transition: none !important; }
}
