.link-page {
  --tb-orange: #ff8a00;
  --tb-orange-deep: #ff6200;
  --tb-yellow: #ffb300;
  --tb-gold: #ffce3d;
  --tb-card: #ffffff;
  --tb-border: #d9d9d9;
  --tb-border-focus: #ffb65f;
  --tb-text: #24272e;
  --tb-muted: #8b8b8b;
  min-height: 100vh !important;
  min-height: 100dvh !important;
  justify-content: center !important;
  padding: 38px 20px 42px !important;
  background:
    radial-gradient(circle at 0% -12%, rgba(255, 207, 95, .32) 0 26%, transparent 26.4%),
    radial-gradient(circle at 100% 112%, rgba(255, 206, 61, .22) 0 28%, transparent 28.4%),
    linear-gradient(180deg, #ffad31 0%, var(--tb-orange) 48%, #ff7600 100%) !important;
  color: var(--tb-text);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC",
    "Microsoft YaHei", Arial, sans-serif;
}

html:has(.link-page),
body:has(.link-page),
body:has(.link-page) #q-app,
body:has(.link-page) .q-layout,
body:has(.link-page) .q-page-container,
body:has(.link-page) .q-page {
  background: var(--tb-orange) !important;
}

.link-page::before,
.link-page::after {
  z-index: 0 !important;
  border-radius: 50% !important;
  background: rgba(255, 255, 255, .08) !important;
  animation: none !important;
  pointer-events: none;
}

.link-page::before {
  top: -255px !important;
  right: auto !important;
  left: -210px !important;
  width: 560px !important;
  height: 560px !important;
}

.link-page::after {
  right: -220px !important;
  bottom: -265px !important;
  left: auto !important;
  width: 560px !important;
  height: 560px !important;
}

.link-page .form-card {
  width: min(100%, 500px) !important;
  max-width: 500px !important;
  z-index: 1 !important;
}

.link-page .main-card {
  overflow: hidden !important;
  border: 0 !important;
  border-radius: 28px !important;
  background: var(--tb-card) !important;
  box-shadow: 0 18px 42px rgba(166, 78, 0, .16) !important;
}

.link-page .main-card .card-header {
  padding: 48px 30px 12px !important;
  background: transparent !important;
  text-align: center !important;
}

.link-page .main-card .card-header .header-content {
  gap: 22px !important;
}

.link-page .main-card .card-header .header-content .icon-wrapper {
  width: 74px !important;
  height: 74px !important;
  border-radius: 50% !important;
  background: linear-gradient(180deg, var(--tb-orange) 0%, var(--tb-orange-deep) 100%) !important;
  box-shadow: 0 10px 22px rgba(255, 106, 0, .22) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

.link-page .main-card .card-header .header-content .icon-wrapper .q-icon,
.link-page .main-card .card-header .header-content .icon-wrapper .text-primary {
  color: #ffffff !important;
}

.link-page .main-card .card-header .header-content h2 {
  margin: 0 !important;
  color: var(--tb-text) !important;
  font-size: 30px !important;
  font-weight: 800 !important;
  line-height: 1.25 !important;
  letter-spacing: 0 !important;
}

.link-page .main-card .card-body {
  padding: 32px 34px 20px !important;
  background: var(--tb-card) !important;
}

.link-page .form-content {
  gap: 0 !important;
}

.link-page .q-field {
  margin-bottom: 28px !important;
}

.link-page .q-field__control {
  min-height: 58px !important;
  border-radius: 8px !important;
  color: var(--tb-orange) !important;
  background: #ffffff !important;
}

.link-page .q-field--outlined .q-field__control::before {
  border: 1px solid var(--tb-border) !important;
  border-radius: 8px !important;
}

.link-page .q-field--outlined.q-field--focused .q-field__control::after {
  border: 2px solid var(--tb-border-focus) !important;
  border-radius: 8px !important;
}

.link-page .q-field__native,
.link-page .q-field__input {
  color: var(--tb-text) !important;
  font-size: 18px !important;
  font-weight: 400 !important;
}

.link-page .q-field__native::placeholder,
.link-page .q-field__input::placeholder {
  color: var(--tb-muted) !important;
  opacity: 1 !important;
}

.link-page .q-field__prepend,
.link-page .q-field__marginal,
.link-page .q-field .q-icon,
.link-page .q-field .text-primary {
  color: var(--tb-orange-deep) !important;
}

.link-page .q-field__bottom {
  padding-top: 6px !important;
  color: var(--tb-orange-deep) !important;
}

.link-page .submit-btn.q-btn {
  width: 100% !important;
  min-height: 58px !important;
  margin-top: 6px !important;
  border-radius: 999px !important;
  background: linear-gradient(180deg, var(--tb-orange) 0%, var(--tb-orange-deep) 100%) !important;
  color: #ffffff !important;
  font-size: 20px !important;
  font-weight: 800 !important;
  letter-spacing: 0 !important;
  box-shadow: 0 10px 18px rgba(255, 106, 0, .24) !important;
}

.link-page .submit-btn.q-btn::before {
  box-shadow: none !important;
}

.link-page .submit-btn.q-btn:hover:not(:disabled) {
  transform: translateY(-1px) !important;
  box-shadow: 0 12px 20px rgba(255, 106, 0, .28) !important;
}

.link-page .submit-btn.q-btn:active:not(:disabled) {
  transform: translateY(0) !important;
}

.link-page .main-card .card-footer {
  border-top: 0 !important;
  background: var(--tb-card) !important;
  padding: 18px 34px 46px !important;
}

.link-page .main-card .card-footer .footer-content {
  justify-content: flex-start !important;
  gap: 10px !important;
  color: var(--tb-muted) !important;
  font-size: 14px !important;
  line-height: 1.55 !important;
  text-align: left !important;
}

.link-page .main-card .card-footer .footer-content .q-icon {
  color: var(--tb-orange-deep) !important;
  align-self: flex-start;
  margin-top: 1px;
}

.link-page .result-section .result-title {
  color: var(--tb-text) !important;
  font-size: 24px !important;
  font-weight: 800 !important;
}

.link-page .result-section .url-container {
  border: 1px solid #ffe1ad !important;
  border-radius: 10px !important;
  background: #fff8e8 !important;
}

.link-page .result-section .url-container .url-text {
  color: var(--tb-orange-deep) !important;
}

.link-page .result-section .url-container .q-btn.bg-primary,
.link-page .result-section .url-container .q-btn.text-primary {
  border-radius: 999px !important;
  background: linear-gradient(180deg, var(--tb-orange) 0%, var(--tb-orange-deep) 100%) !important;
  color: #ffffff !important;
}

.link-page button:focus-visible,
.link-page input:focus-visible,
.link-page [role="button"]:focus-visible {
  outline: 2px solid var(--tb-border-focus);
  outline-offset: 2px;
}

@media (max-width: 480px) {
  .link-page {
    padding: 28px 16px 34px !important;
  }

  .link-page .main-card {
    border-radius: 24px !important;
  }

  .link-page .main-card .card-header {
    padding: 42px 24px 10px !important;
  }

  .link-page .main-card .card-header .header-content .icon-wrapper {
    width: 70px !important;
    height: 70px !important;
  }

  .link-page .main-card .card-header .header-content h2 {
    font-size: 26px !important;
  }

  .link-page .main-card .card-body {
    padding: 30px 22px 16px !important;
  }

  .link-page .main-card .card-footer {
    padding: 16px 22px 38px !important;
  }

  .link-page .q-field__native,
  .link-page .q-field__input {
    font-size: 17px !important;
  }
}

@media (max-height: 700px) {
  .link-page {
    justify-content: flex-start !important;
  }
}