.welcome-art {
  display: block;
  width: 100%;
  height: 210px;
  margin: 0 0 18px;
  object-fit: cover;
  object-position: center;
  border: 1px solid var(--line);
  border-radius: 22px;
  box-shadow: 0 18px 44px rgba(0, 0, 0, .22);
}

.topic-list button > img {
  width: 58px;
  height: 58px;
  flex: 0 0 58px;
  object-fit: cover;
  border: 1px solid #31547e;
  border-radius: 16px;
  box-shadow: 0 8px 22px rgba(20, 214, 207, .12);
}

.practice {
  isolation: isolate;
}

.practice::before {
  position: fixed;
  z-index: -1;
  inset: 70px 0 105px;
  content: "";
  pointer-events: none;
  background: linear-gradient(rgba(7, 22, 47, .92), rgba(7, 22, 47, .96)), url('/assets/voice-lesson.jpeg') center 22% / min(76vw, 430px) auto no-repeat;
}

@media (max-width: 420px) {
  .welcome-art { height: 180px; }
  .topic-list button > img { width: 52px; height: 52px; flex-basis: 52px; border-radius: 14px; }
}

.permission-dialog {
  width: min(420px, calc(100% - 28px));
  padding: 28px 22px 20px;
  border: 1px solid var(--line);
  border-radius: 24px;
  background: linear-gradient(145deg, #122e54, #081b37);
  color: var(--text);
  box-shadow: 0 24px 80px rgba(0, 0, 0, .55);
}

.permission-dialog::backdrop { background: rgba(1, 8, 21, .78); backdrop-filter: blur(4px); }
.permission-dialog h2 { margin: 8px 0 10px; text-align: center; }
.permission-dialog p { margin: 0 0 14px; }
.permission-dialog ol { padding-left: 22px; color: #d8e5f5; line-height: 1.55; }
.permission-dialog li + li { margin-top: 7px; }
.permission-icon { font-size: 38px; text-align: center; }
.dialog-close { position: absolute; top: 10px; right: 12px; border: 0; background: transparent; color: var(--muted); font-size: 28px; }
.text-button { display: block; width: 100%; margin-top: 8px; padding: 11px; border: 0; background: transparent; color: var(--cyan); }
.secondary-button { display: block; width: 100%; margin-top: 9px; padding: 13px; border: 1px solid var(--line); border-radius: 14px; background: #17375e; color: var(--text); font-weight: 800; }
.diagnostic-code { display: block; margin: 0 0 14px; padding: 8px 10px; border-radius: 10px; background: #071a36; color: var(--muted); font: 11px/1.4 ui-monospace, Consolas, monospace; overflow-wrap: anywhere; }