/* Release 4.00.015 — isolated Home-screen device profiles. */

/* iPadOS: never inherit the oversized desktop branding block. */
.dkn-device-ipad .home-screen {
  height: var(--dkn-visible-height, 100dvh);
  min-height: 0;
  padding: 0 .85rem max(4rem, env(safe-area-inset-bottom));
  overflow: hidden;
}
.dkn-device-ipad .home-hero {
  width: min(920px, 100%);
  align-content: center;
  gap: clamp(.58rem, 1.35vh, .82rem);
  padding: clamp(3.5rem, 6vh, 4.4rem) 0 .55rem;
}
.dkn-device-ipad .home-branding { width: 100%; gap: .3rem; }
.dkn-device-ipad .home-figure { height: clamp(120px, 15vh, 165px); }
.dkn-device-ipad .home-wordmark { width: 100%; font-size: clamp(2.85rem, 5.8vw, 4.35rem); letter-spacing: -.06em; }
.dkn-device-ipad .home-tagline { font-size: clamp(1.1rem, 2.35vw, 1.7rem); }
.dkn-device-ipad .home-divider { height: 8px; }
.dkn-device-ipad .home-divider > b { width: 9px; height: 9px; }
.dkn-device-ipad .home-actions { width: min(810px, 92%); gap: .62rem; }
.dkn-device-ipad .domino-action { min-height: 64px; padding: .45rem .6rem; font-size: clamp(.78rem, 1.75vw, 1.05rem); }
.dkn-device-ipad .domino-action svg { width: 30px; height: 30px; }
.dkn-device-ipad .home-features span { min-height: 46px; gap: .18rem; font-size: .64rem; }
.dkn-device-ipad .home-features svg { width: 25px; height: 25px; }
.dkn-device-ipad .home-music-promo { gap: .2rem; font-size: .66rem; }
.dkn-device-ipad .home-music-promo img { width: 48px; height: 48px; border-radius: 12px; }
.dkn-device-ipad .home-screen > footer { min-height: 38px; padding: .3rem .75rem !important; font-size: .57rem; }

/* iPhone/iPod: dedicated iOS phone sizing and safe-area spacing. */
.dkn-device-ios-phone .home-screen {
  height: var(--dkn-visible-height, 100dvh);
  min-height: 0;
  padding-bottom: max(3.25rem, env(safe-area-inset-bottom));
}
.dkn-device-ios-phone .home-hero { align-content: center; gap: clamp(.38rem, 1vh, .58rem); padding: max(3.35rem, env(safe-area-inset-top)) 0 .3rem; }
.dkn-device-ios-phone .home-branding { width: 100%; gap: .25rem; }
.dkn-device-ios-phone .home-figure { height: clamp(90px, 14.5vh, 120px); }
.dkn-device-ios-phone .home-wordmark { width: 100%; font-size: clamp(1.8rem, 8.6vw, 2.85rem); letter-spacing: -.07em; }
.dkn-device-ios-phone .home-tagline { font-size: clamp(.8rem, 3.9vw, 1.08rem); }
.dkn-device-ios-phone .home-divider { height: 7px; }
.dkn-device-ios-phone .home-divider > b { width: 7px; height: 7px; }
.dkn-device-ios-phone .home-actions { width: 94%; gap: .3rem; }
.dkn-device-ios-phone .domino-action { min-height: 56px; padding: .36rem .2rem; font-size: clamp(.54rem, 2.65vw, .78rem); }
.dkn-device-ios-phone .domino-action svg { width: 24px; height: 24px; }
.dkn-device-ios-phone .home-features span { min-height: 44px; font-size: .56rem; }
.dkn-device-ios-phone .home-features svg { width: 23px; height: 23px; }
.dkn-device-ios-phone .home-music-promo { gap: .18rem; font-size: .61rem; }
.dkn-device-ios-phone .home-music-promo img { width: 44px; height: 44px; border-radius: 11px; }
.dkn-device-ios-phone .home-screen > footer { min-height: 34px; padding: .25rem .55rem !important; font-size: .5rem; }

/* Android phones: independent from iOS and tablet dimensions. */
.dkn-device-android-phone .home-screen {
  height: var(--dkn-visible-height, 100dvh);
  min-height: 0;
  padding-bottom: 3.2rem;
}
.dkn-device-android-phone .home-hero { align-content: center; gap: clamp(.36rem, .95vh, .55rem); padding: 3.2rem 0 .28rem; }
.dkn-device-android-phone .home-branding { width: 100%; gap: .24rem; }
.dkn-device-android-phone .home-figure { height: clamp(86px, 14vh, 116px); }
.dkn-device-android-phone .home-wordmark { width: 100%; font-size: clamp(1.78rem, 8.5vw, 2.8rem); letter-spacing: -.07em; }
.dkn-device-android-phone .home-tagline { font-size: clamp(.78rem, 3.8vw, 1.05rem); }
.dkn-device-android-phone .home-divider { height: 7px; }
.dkn-device-android-phone .home-divider > b { width: 7px; height: 7px; }
.dkn-device-android-phone .home-actions { width: 94%; gap: .3rem; }
.dkn-device-android-phone .domino-action { min-height: 55px; padding: .34rem .2rem; font-size: clamp(.53rem, 2.6vw, .76rem); }
.dkn-device-android-phone .domino-action svg { width: 23px; height: 23px; }
.dkn-device-android-phone .home-features span { min-height: 43px; font-size: .55rem; }
.dkn-device-android-phone .home-features svg { width: 22px; height: 22px; }
.dkn-device-android-phone .home-music-promo { gap: .16rem; font-size: .6rem; }
.dkn-device-android-phone .home-music-promo img { width: 43px; height: 43px; border-radius: 10px; }
.dkn-device-android-phone .home-screen > footer { min-height: 33px; padding: .24rem .5rem !important; font-size: .49rem; }

/* Android tablets are deliberately separate from iPadOS. */
.dkn-device-android-tablet .home-screen { height: var(--dkn-visible-height, 100dvh); min-height: 0; }
.dkn-device-android-tablet .home-hero { gap: clamp(.55rem, 1.25vh, .9rem); padding: 4rem 0 .8rem; }
.dkn-device-android-tablet .home-figure { height: clamp(130px, 17vh, 185px); }

/* Desktop retains the approved full-size composition. */
.dkn-device-desktop .home-screen { height: 100dvh; }

@media (orientation: landscape) {
  .dkn-device-ipad .home-hero { gap: .46rem; padding-top: 3.25rem; padding-bottom: .3rem; }
  .dkn-device-ipad .home-figure { height: clamp(100px, 13.5vh, 128px); }
  .dkn-device-ipad .home-wordmark { font-size: clamp(2.7rem, 5vw, 3.9rem); }
  .dkn-device-ipad .home-tagline { font-size: clamp(1rem, 2.05vw, 1.45rem); }
  .dkn-device-ipad .domino-action { min-height: 60px; }
  .dkn-device-ipad .home-features span { min-height: 42px; }
  .dkn-device-ipad .home-music-promo img { width: 42px; height: 42px; }
}

/* Release 4.00.015 — stable non-desktop vertical rhythm. Desktop is
   intentionally excluded and retains its prior approved layout. */
.dkn-device-ipad .home-screen {
  --home-profile-top: clamp(3.65rem, 6vh, 4.5rem);
  --home-profile-gap: clamp(.55rem, 1.35vh, .9rem);
  --home-profile-figure: clamp(130px, 16vh, 170px);
  --home-profile-wordmark: clamp(2.9rem, 5.7vw, 4.3rem);
  --home-profile-tagline: clamp(1.12rem, 2.3vw, 1.65rem);
  --home-profile-action: 66px;
  --home-profile-feature: 50px;
  --home-profile-music: 50px;
  --home-profile-footer: 38px;
}

.dkn-device-ios-phone .home-screen {
  --home-profile-top: max(3.45rem, env(safe-area-inset-top));
  --home-profile-gap: clamp(.45rem, 1.15vh, .72rem);
  --home-profile-figure: clamp(96px, 15vh, 122px);
  --home-profile-wordmark: clamp(1.82rem, 8.55vw, 2.82rem);
  --home-profile-tagline: clamp(.82rem, 3.85vw, 1.06rem);
  --home-profile-action: 58px;
  --home-profile-feature: 46px;
  --home-profile-music: 45px;
  --home-profile-footer: 35px;
}

.dkn-device-android-phone .home-screen {
  --home-profile-top: 3.3rem;
  --home-profile-gap: clamp(.43rem, 1.1vh, .7rem);
  --home-profile-figure: clamp(92px, 14.5vh, 118px);
  --home-profile-wordmark: clamp(1.8rem, 8.45vw, 2.78rem);
  --home-profile-tagline: clamp(.8rem, 3.8vw, 1.04rem);
  --home-profile-action: 57px;
  --home-profile-feature: 45px;
  --home-profile-music: 44px;
  --home-profile-footer: 34px;
}

.dkn-device-android-tablet .home-screen {
  --home-profile-top: clamp(3.6rem, 6vh, 4.4rem);
  --home-profile-gap: clamp(.54rem, 1.3vh, .86rem);
  --home-profile-figure: clamp(126px, 15.5vh, 166px);
  --home-profile-wordmark: clamp(2.85rem, 5.6vw, 4.2rem);
  --home-profile-tagline: clamp(1.1rem, 2.25vw, 1.6rem);
  --home-profile-action: 65px;
  --home-profile-feature: 49px;
  --home-profile-music: 49px;
  --home-profile-footer: 38px;
}

.dkn-device-ipad .home-screen,
.dkn-device-ios-phone .home-screen,
.dkn-device-android-phone .home-screen,
.dkn-device-android-tablet .home-screen {
  height: var(--dkn-visible-height, 100dvh);
  min-height: 0;
  grid-template-rows: minmax(0, 1fr) auto;
  padding: 0 .5rem max(.25rem, env(safe-area-inset-bottom));
  overflow: hidden;
}

.dkn-device-ipad .home-hero,
.dkn-device-ios-phone .home-hero,
.dkn-device-android-phone .home-hero,
.dkn-device-android-tablet .home-hero {
  width: min(920px, 100%);
  height: 100%;
  min-height: 0;
  align-content: space-evenly;
  gap: var(--home-profile-gap);
  padding: var(--home-profile-top) 0 .35rem;
}

.dkn-device-ipad .home-branding,
.dkn-device-ios-phone .home-branding,
.dkn-device-android-phone .home-branding,
.dkn-device-android-tablet .home-branding { width: 100%; gap: .28rem; }

.dkn-device-ipad .home-figure,
.dkn-device-ios-phone .home-figure,
.dkn-device-android-phone .home-figure,
.dkn-device-android-tablet .home-figure { height: var(--home-profile-figure); }

.dkn-device-ipad .home-wordmark,
.dkn-device-ios-phone .home-wordmark,
.dkn-device-android-phone .home-wordmark,
.dkn-device-android-tablet .home-wordmark {
  width: 100%;
  max-width: 100%;
  font-size: var(--home-profile-wordmark);
  letter-spacing: -.07em;
  line-height: .94;
}

.dkn-device-ipad .home-tagline,
.dkn-device-ios-phone .home-tagline,
.dkn-device-android-phone .home-tagline,
.dkn-device-android-tablet .home-tagline { font-size: var(--home-profile-tagline); }

.dkn-device-ipad .home-divider,
.dkn-device-ios-phone .home-divider,
.dkn-device-android-phone .home-divider,
.dkn-device-android-tablet .home-divider { height: 8px; margin: 0; }

.dkn-device-ipad .home-divider > b,
.dkn-device-ios-phone .home-divider > b,
.dkn-device-android-phone .home-divider > b,
.dkn-device-android-tablet .home-divider > b { width: 8px; height: 8px; }

.dkn-device-ipad .home-actions,
.dkn-device-ios-phone .home-actions,
.dkn-device-android-phone .home-actions,
.dkn-device-android-tablet .home-actions { width: min(850px, 95%); gap: clamp(.32rem, 1.15vw, .7rem); margin: 0; }

.dkn-device-ipad .domino-action,
.dkn-device-ios-phone .domino-action,
.dkn-device-android-phone .domino-action,
.dkn-device-android-tablet .domino-action { min-height: var(--home-profile-action); padding-block: .4rem; }

.dkn-device-ipad .home-features,
.dkn-device-ios-phone .home-features,
.dkn-device-android-phone .home-features,
.dkn-device-android-tablet .home-features { margin: 0; }

.dkn-device-ipad .home-features span,
.dkn-device-ios-phone .home-features span,
.dkn-device-android-phone .home-features span,
.dkn-device-android-tablet .home-features span { min-height: var(--home-profile-feature); }

.dkn-device-ipad .home-music-promo,
.dkn-device-ios-phone .home-music-promo,
.dkn-device-android-phone .home-music-promo,
.dkn-device-android-tablet .home-music-promo { margin: 0; gap: .22rem; }

.dkn-device-ipad .home-music-promo img,
.dkn-device-ios-phone .home-music-promo img,
.dkn-device-android-phone .home-music-promo img,
.dkn-device-android-tablet .home-music-promo img { width: var(--home-profile-music); height: var(--home-profile-music); }

.dkn-device-ipad .home-screen > footer,
.dkn-device-ios-phone .home-screen > footer,
.dkn-device-android-phone .home-screen > footer,
.dkn-device-android-tablet .home-screen > footer {
  position: relative !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  width: calc(100% - .4rem) !important;
  min-height: var(--home-profile-footer);
  justify-self: center;
  flex-direction: row;
  margin: 0 auto;
  padding: .28rem .65rem !important;
}

@media (orientation: landscape) {
  .dkn-device-ipad .home-screen {
    --home-profile-top: 3.25rem;
    --home-profile-gap: .45rem;
    --home-profile-figure: clamp(104px, 13.5vh, 132px);
    --home-profile-wordmark: clamp(2.7rem, 4.9vw, 3.9rem);
    --home-profile-tagline: clamp(1rem, 2vw, 1.42rem);
    --home-profile-action: 60px;
    --home-profile-feature: 43px;
    --home-profile-music: 43px;
    --home-profile-footer: 34px;
  }
  .dkn-device-android-tablet .home-screen {
    --home-profile-top: 3.2rem;
    --home-profile-gap: .44rem;
    --home-profile-figure: clamp(102px, 13.25vh, 130px);
    --home-profile-action: 59px;
    --home-profile-feature: 42px;
    --home-profile-music: 42px;
    --home-profile-footer: 34px;
  }
}
