/*
 * T43 · Responsive Layout Stability & Premium Glass Continuity
 *
 * This layer is intentionally imported after Architectural Glass Luxury UI 1.3.
 * It does not redesign the approved interface. It fixes the concrete T42
 * screenshot defects: internal-view scroll retention, clipped card copy,
 * overlapping archive metrics, hard minimum column widths and unstable text
 * wrapping at zoom / large-text sizes.
 */

:root {
  --t43-card-pad: clamp(1rem, 2.1vw, 1.55rem);
  --t43-card-gap: clamp(.75rem, 1.5vw, 1rem);
  --t43-reading-width: 68ch;
}

/* Browser-height and horizontal-overflow fallbacks. */
.dhw-app-shell {
  height: 100vh;
  height: 100dvh;
}

.dhw-app-shell__main {
  overflow-x: hidden;
  overflow-x: clip;
}

/* Dense archive/form views must not be pulled to arbitrary snap points. */
.dhw-app-shell[data-screen='library'] .dhw-app-shell__main {
  scroll-snap-type: none;
}

@media (min-width: 64rem) {
  .dhw-app-shell--workspace .screen {
    padding-bottom: clamp(2rem, 4vw, 4rem);
  }
}

/* Safe text behaviour across browser fonts, zoom and translations. */
:is(
  .capture-intro-card,
  .life-archive-screen,
  .life-archive-principle,
  .life-archive-overview,
  .life-archive-biography-card,
  .gm-today-panel,
  .gm-focus-card
) {
  min-width: 0;
}

:is(
  .capture-intro-card,
  .life-archive-principle,
  .life-archive-biography-card,
  .gm-today-panel,
  .gm-focus-card
) :is(h1, h2, h3, p, small, strong, span, label, summary) {
  max-width: 100%;
  overflow-wrap: break-word;
  word-break: normal;
}

:is(.capture-intro-card, .life-archive-screen, .gm-today-panel) :is(h1, h2, h3) {
  text-wrap: balance;
  hyphens: auto;
}

/* -------------------------------------------------------------------------- */
/* Screenshot 1 · first capture intro                                         */
/* -------------------------------------------------------------------------- */

.capture-first-visit {
  display: grid;
  align-content: start;
  gap: clamp(1rem, 2.4vw, 1.6rem);
}

.capture-first-visit .gm-capture-topline,
.capture-first-visit .capture-intro-card {
  width: min(100%, 48rem);
  margin-inline: auto;
}

.capture-first-visit .gm-capture-topline {
  margin-bottom: 0;
}

.capture-intro-card {
  max-width: none;
  padding: clamp(1.25rem, 3vw, 2.15rem);
  gap: clamp(.8rem, 1.7vw, 1.05rem);
}

.capture-intro-card h1 {
  margin: 0;
  font-size: clamp(2.35rem, 5vw, 4.2rem);
  line-height: 1.02;
}

.capture-intro-card p {
  max-width: var(--t43-reading-width);
  margin: 0;
  line-height: 1.62;
}

.capture-intro-card .primary-button {
  width: 100%;
  min-height: 3.35rem;
  justify-content: center;
}

/* -------------------------------------------------------------------------- */
/* Screenshot 2 · life archive                                                */
/* -------------------------------------------------------------------------- */

.life-archive-screen {
  gap: clamp(1rem, 2.1vw, 1.5rem);
}

.life-archive-story-map,
.life-archive-principle,
.life-archive-overview,
.life-archive-biographies,
.life-archive-biography-card {
  min-width: 0;
  max-width: 100%;
}

.life-archive-principle,
.life-archive-biography-card {
  padding: var(--t43-card-pad);
}

.life-archive-principle {
  grid-template-columns: 2rem minmax(0, 1fr);
  gap: var(--t43-card-gap);
}

.life-archive-principle > svg {
  margin-top: .1rem;
}

.life-archive-principle h2,
.life-archive-biography-card h2 {
  line-height: 1.1;
}

/* T42 used a decorative negative margin that visibly overlapped the principle
   card and caused unstable snap positions. T43 keeps the premium layering via
   shadow and glass, not by covering neighbouring content. */
.life-archive-overview {
  margin-top: 0;
  padding-inline: 0;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: clamp(.7rem, 1.4vw, 1rem);
}

.life-archive-overview span {
  min-width: 0;
  min-height: clamp(6.4rem, 9vw, 7.2rem);
  padding: clamp(.85rem, 1.7vw, 1.15rem);
}

.life-archive-overview small {
  line-height: 1.3;
}

.life-archive-biographies {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(.85rem, 1.6vw, 1.15rem);
}

.life-archive-biography-card {
  gap: .7rem;
  overflow: hidden;
}

.life-archive-biography-card .section-label {
  margin: 0;
  line-height: 1.25;
}

.life-archive-biography-card h2 {
  margin: 0;
  font-size: clamp(1.5rem, 2.4vw, 2.25rem);
}

.life-archive-biography-card p {
  max-width: 58ch;
  line-height: 1.55;
}

.life-decision-quick-form,
.life-decision-quick-form :is(input, button) {
  width: 100%;
  min-width: 0;
}

@media (max-width: 72rem) {
  .life-archive-overview {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 56rem) {
  .life-archive-biographies {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 34rem) {
  .life-archive-overview {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* -------------------------------------------------------------------------- */
/* Screenshot 3 · My Day / focus disclosure                                   */
/* -------------------------------------------------------------------------- */

.gm-today-layout {
  grid-template-columns: minmax(0, .96fr) minmax(0, 1.04fr);
}

.gm-today-panel,
.gm-today-landscape {
  min-width: 0;
}

.gm-focus-card {
  width: min(100%, 22rem);
  max-width: 100%;
  padding: clamp(1rem, 2vw, 1.35rem);
}

.gm-focus-card > summary {
  min-height: 2.75rem;
  display: flex;
  align-items: center;
  gap: .55rem;
  margin: 0;
  padding: 0;
  color: #14213a;
  font-size: clamp(.95rem, 1.25vw, 1.08rem);
  font-weight: 700;
  line-height: 1.35;
  list-style: none;
  cursor: pointer;
}

.gm-focus-card > summary::-webkit-details-marker {
  display: none;
}

.gm-focus-card > summary::before {
  content: '';
  flex: 0 0 auto;
  width: 0;
  height: 0;
  border-top: .3rem solid transparent;
  border-bottom: .3rem solid transparent;
  border-left: .46rem solid currentColor;
  transform-origin: 35% 50%;
  transition: transform 160ms ease;
}

.gm-focus-card[open] > summary::before {
  transform: rotate(90deg);
}

.gm-focus-card > summary:focus-visible {
  outline: 3px solid color-mix(in srgb, var(--gold) 72%, white);
  outline-offset: .3rem;
  border-radius: .35rem;
}

.gm-focus-card ul {
  min-width: 0;
}

.gm-focus-card li {
  grid-template-columns: 1.5rem minmax(0, 1fr);
}

/* The previous 820px cutoff was too late for workspace mode, tablet split view
   and enlarged browser text. The optional landscape is hidden before it can
   force horizontal scrolling. */
@media (max-width: 70rem) {
  .gm-today-layout {
    grid-template-columns: minmax(0, 1fr);
    min-height: auto;
  }

  .gm-today-panel {
    margin: 0;
  }

  .gm-today-landscape {
    display: none;
  }
}

/* Touch devices do not need a hover tooltip beside the companion button. */
@media (hover: none), (pointer: coarse) {
  .companion-floating-button span {
    display: none;
  }
}

/* -------------------------------------------------------------------------- */
/* Premium glass fallback                                                     */
/* -------------------------------------------------------------------------- */

@supports not ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
  .dhw-topbar,
  .dhw-bottom-nav,
  .dhw-side-rail {
    background:
      linear-gradient(145deg, rgb(255 253 248 / 99%), rgb(229 237 243 / 98%)) !important;
    box-shadow: 0 18px 48px rgb(11 25 48 / 13%), inset 0 1px 0 #fff !important;
  }

  :is(.gm-editorial-panel, .scene-card, .gm-focus-card) {
    background:
      linear-gradient(145deg, rgb(255 253 248 / 99%), rgb(239 244 247 / 97%)) !important;
    border-color: rgb(113 132 151 / 24%) !important;
    box-shadow: 0 18px 44px rgb(11 25 48 / 12%), inset 0 1px 0 #fff !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .gm-focus-card > summary::before {
    transition: none;
  }
}

@media (forced-colors: active) {
  .life-archive-overview span,
  .life-archive-principle,
  .life-archive-biography-card,
  .capture-intro-card,
  .gm-focus-card {
    border: 1px solid CanvasText !important;
    background: Canvas !important;
    box-shadow: none !important;
  }
}