/* Shared responsive action layout: controls keep their own space at every viewport. */
:root {
  --dsk-action-edge: max(16px, env(safe-area-inset-right));
  --dsk-action-bottom: max(16px, env(safe-area-inset-bottom));
  --dsk-action-gap: 10px;
}

/* Fixed learning utilities occupy a deliberate rail instead of competing for one spot. */
#dausoko-library-launcher,
.deeper-study-launcher,
#optionalExitButton,
.dng-help {
  max-width: calc(100vw - (2 * var(--dsk-action-edge)));
  min-height: 44px;
  box-sizing: border-box;
}

#dausoko-library-launcher {
  right: var(--dsk-action-edge) !important;
  bottom: var(--dsk-action-bottom) !important;
  white-space: normal;
  text-align: center;
}

.deeper-study-launcher {
  right: calc(var(--dsk-action-edge) + min(190px, 40vw)) !important;
  bottom: var(--dsk-action-bottom) !important;
}

#optionalExitButton {
  right: calc(var(--dsk-action-edge) + min(370px, 78vw)) !important;
  bottom: var(--dsk-action-bottom) !important;
}

.dng-help {
  right: calc(var(--dsk-action-edge) + min(446px, 93vw)) !important;
  bottom: var(--dsk-action-bottom) !important;
}

.deeper-study-panel,
.dng-coach {
  right: var(--dsk-action-edge) !important;
  bottom: calc(var(--dsk-action-bottom) + 58px) !important;
  max-width: calc(100vw - (2 * var(--dsk-action-edge)));
}

/* Real content actions may wrap; controls never shrink into illegible fragments. */
.actions,
.question-actions,
.result-actions,
.teaching-actions,
.header-actions,
.top-actions,
.settings,
.dng-actions,
.dsk-toolbar,
.dws-toolbar {
  min-width: 0;
}

.actions,
.question-actions,
.result-actions,
.teaching-actions,
.header-actions,
.top-actions,
.dng-actions {
  flex-wrap: wrap;
  row-gap: 10px;
}

.actions > *,
.question-actions > *,
.result-actions > *,
.teaching-actions > *,
.header-actions > *,
.top-actions > *,
.dng-actions > * {
  min-width: 0;
}

@media (max-width: 900px) {
  .deeper-study-launcher {
    right: var(--dsk-action-edge) !important;
    bottom: calc(var(--dsk-action-bottom) + 54px) !important;
  }

  #optionalExitButton {
    right: var(--dsk-action-edge) !important;
    bottom: calc(var(--dsk-action-bottom) + 108px) !important;
  }

  .dng-help {
    right: calc(var(--dsk-action-edge) + 56px) !important;
    bottom: calc(var(--dsk-action-bottom) + 108px) !important;
  }

  .deeper-study-panel,
  .dng-coach {
    bottom: calc(var(--dsk-action-bottom) + 108px) !important;
  }

  body {
    padding-bottom: 190px;
  }
}

@media (max-width: 600px) {
  :root {
    --dsk-action-edge: max(10px, env(safe-area-inset-right));
    --dsk-action-bottom: max(10px, env(safe-area-inset-bottom));
  }

  #dausoko-library-launcher,
  .deeper-study-launcher,
  #optionalExitButton {
    width: calc(100vw - (2 * var(--dsk-action-edge)));
    padding: 10px 14px !important;
    font-size: 14px !important;
  }

  #dausoko-library-launcher { bottom: var(--dsk-action-bottom) !important; }
  .deeper-study-launcher { bottom: calc(var(--dsk-action-bottom) + 54px) !important; }
  #optionalExitButton { bottom: calc(var(--dsk-action-bottom) + 108px) !important; }
  .dng-help { right: var(--dsk-action-edge) !important; bottom: calc(var(--dsk-action-bottom) + 162px) !important; }

  .deeper-study-panel,
  .dng-coach {
    bottom: calc(var(--dsk-action-bottom) + 108px) !important;
    width: calc(100vw - (2 * var(--dsk-action-edge))) !important;
  }

  .site-header,
  .topbar,
  .top,
  .settings,
  .header-actions,
  .top-actions {
    min-width: 0;
  }

  .settings,
  .header-actions,
  .top-actions,
  .actions,
  .question-actions,
  .result-actions,
  .teaching-actions,
  .dng-actions {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    width: 100%;
  }

  .settings > *,
  .header-actions > *,
  .top-actions > *,
  .actions > *,
  .question-actions > *,
  .result-actions > *,
  .teaching-actions > *,
  .dng-actions > * {
    width: 100%;
    min-height: 44px;
  }

  body { padding-bottom: 238px; }
}

@media (max-width: 390px) {
  .dng-help { bottom: calc(var(--dsk-action-bottom) + 166px) !important; }
  .deeper-study-panel,
  .dng-coach { bottom: calc(var(--dsk-action-bottom) + 112px) !important; }
}
