.app-cctp-shell,
.app-cctp-shell * { box-sizing: border-box; }
.app-cctp-shell {
  position: fixed;
  inset: 0;
  width: 100%;
  height: var(--app-cctp-viewport-height,100vh);
  min-height: 100vh;
  overflow: hidden;
  color: #fff;
  font-family: system-ui,-apple-system,"Segoe UI",sans-serif;
  background: #101724;
  isolation: isolate;
  --app-cctp-home-icon-size: 80px;
}
@supports (height: 100dvh) { .app-cctp-shell { height: var(--app-cctp-viewport-height,100dvh); min-height: 100dvh; } }
.app-cctp-screen-stack { position: absolute; inset: 0; overflow: hidden; }
.app-cctp-screen {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  transform: translate3d(0,0,0);
  transition: transform var(--app-cctp-panel-duration) var(--app-cctp-panel-easing);
}
.app-cctp-home-screen {
  z-index: var(--app-cctp-layer-home);
  background-color: #151923;
  background-image: url("../../images/v3/app-cctp-wallpaper.jpg");
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center 35%;
}
.app-cctp-shell[data-app-cctp-animating="true"] .app-cctp-screen { will-change: transform; }
.app-cctp-shell[data-app-cctp-menu-open="true"] .app-cctp-home-screen {
  transform: translate3d(calc(100% - var(--app-cctp-menu-visible-rail)),0,0);
}
.app-cctp-shell[data-app-cctp-full-open="true"] .app-cctp-home-screen { transform: translate3d(100%,0,0); }
.app-cctp-home-main {
  position: absolute;
  inset: calc(var(--app-cctp-header-height) + var(--app-cctp-safe-top)) 0 calc(var(--app-cctp-footer-height) + var(--app-cctp-safe-bottom));
  overflow: hidden;
}
.app-cctp-shell button,
.app-cctp-shell a { -webkit-tap-highlight-color: transparent; }
.app-cctp-shell button:focus-visible,
.app-cctp-shell a:focus-visible { outline: 3px solid var(--app-cctp-focus); outline-offset: -3px; }
.app-cctp-visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  white-space: nowrap;
  border: 0;
}

/* One shared Home app-icon grid: every Home icon uses the same 4-column grid and row gap. */
.app-cctp-home-icon-grid {
  position: absolute;
  z-index: 2;
  top: 50px;
  left: 0;
  right: 0;
  width: 100%;
  display: grid;
  grid-template-columns: repeat(4,minmax(0,1fr));
  grid-auto-rows: 100px;
  grid-auto-flow: row;
  row-gap: 10px;
  align-items: start;
  justify-items: center;
  padding-inline: 6px;
  pointer-events: auto;
}
.app-cctp-home-icon-control {
  width: min(88px,100%);
  height: 100px;
  min-width: 0;
  display: grid;
  grid-template-rows: var(--app-cctp-home-icon-size) auto;
  align-content: start;
  justify-items: center;
  row-gap: 5px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 18px;
  background: transparent;
  color: inherit;
  font: inherit;
  text-decoration: none;
  cursor: pointer;
  touch-action: manipulation;
}
.app-cctp-home-icon-image {
  display: block;
  width: var(--app-cctp-home-icon-size);
  height: var(--app-cctp-home-icon-size);
  max-width: var(--app-cctp-home-icon-size);
  max-height: var(--app-cctp-home-icon-size);
  aspect-ratio: 1;
  object-fit: cover;
  border-radius: 22%;
  filter: drop-shadow(0 5px 7px rgba(0,0,0,.34));
  user-select: none;
  -webkit-user-drag: none;
}
.app-cctp-home-icon-label {
  display: block;
  max-width: 100%;
  color: #fff;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 13px;
  line-height: 1.1;
  font-weight: 600;
  letter-spacing: .02em;
  text-align: center;
  white-space: nowrap;
  text-shadow: 0 1px 3px rgba(0,0,0,.75);
  user-select: none;
}
.app-cctp-home-grid-spacer {
  width: min(88px,100%);
  height: 100px;
  pointer-events: none;
}
.app-cctp-home-icon-control:active .app-cctp-home-icon-image { transform: translateY(1px); }
@media (prefers-reduced-motion: reduce) {
  .app-cctp-home-icon-control:active .app-cctp-home-icon-image { transform: none; }
}

/* PATCH 59 — iPhone Safari Home viewport guard.
   Keep Home inside the smallest visible viewport while Safari chrome is shown,
   without changing Push Panel viewport/scroll behaviour. */
@supports (-webkit-touch-callout: none) and (height: 100svh) {
  @media (max-width: 430px) {
    .app-cctp-shell:not([data-app-cctp-menu-open="true"]):not([data-app-cctp-full-open="true"]) {
      height: 100svh;
      min-height: 100svh;
      max-height: 100svh;
    }
  }
}