/* Public request flow shares the login screen's violet, ink and cyan palette. */
.request-page {
  --request-ink: #211d3b;
  --request-muted: #77758d;
  --request-violet: #6049b7;
  --request-violet-dark: #4d3aa3;
  --request-cyan: #76d9db;
  min-height: 100vh;
  color: var(--request-ink);
  background:
    radial-gradient(circle at 84% 8%, rgba(221, 215, 255, .72), transparent 28rem),
    radial-gradient(circle at 8% 82%, rgba(213, 230, 250, .72), transparent 30rem),
    #f5f5f9;
}
.request-page main { max-width: 720px; padding-top: 34px; padding-bottom: 56px; }
.request-page main > a { display: inline-flex; align-items: center; gap: 7px; margin-bottom: 18px; color: #7165a7; font-size: 12px; transition: color .2s, transform .2s; }
.request-page main > a:hover { color: var(--request-violet-dark); transform: translateX(2px); }
.request-page header { position: relative; overflow: hidden; margin-bottom: 18px; padding: 30px 24px 28px; border: 1px solid rgba(255,255,255,.85); border-radius: 24px; background: radial-gradient(circle at 82% 0, rgba(151,132,229,.18), transparent 37%), linear-gradient(135deg,#fff,#f7f6ff); box-shadow: 0 16px 42px rgba(34,28,86,.07); }
.request-page header::after { position: absolute; top: -93px; left: -40px; width: 190px; height: 190px; border: 1px solid rgba(114,88,197,.12); border-radius: 50%; box-shadow: 0 0 0 30px rgba(114,88,197,.035),0 0 0 60px rgba(114,88,197,.025); content: ""; pointer-events: none; }
.request-page header > div { position: relative; z-index: 1; width: 60px; height: 60px; border: 1px solid #eae7f6; border-radius: 17px; box-shadow: 0 8px 20px rgba(58,42,124,.09); }
.request-page header h1 { position: relative; z-index: 1; margin-top: 15px; color: var(--request-ink); font-size: 23px; letter-spacing: -.025em; }
.request-page header p { position: relative; z-index: 1; color: var(--request-muted); }
.request-page .card { border: 1px solid #e9e6f2; border-radius: 21px; background: rgba(255,255,255,.96); box-shadow: 0 12px 34px rgba(34,28,86,.075); }
.request-page .tab { min-height: 48px; border-radius: 13px; color: #77758d; transition: color .2s, background .2s, box-shadow .2s, transform .2s; }
.request-page .tab:hover { color: var(--request-violet); }
.request-page .tab.bg-green-700 { background: linear-gradient(105deg,var(--request-violet-dark),#735bc5); color: white; box-shadow: 0 9px 20px rgba(88,64,170,.18); }
.request-page #submit, .request-page #track, .request-page #blocked-access { padding: clamp(20px,4vw,32px); }
.request-page form.space-y-5 > :not([hidden]) ~ :not([hidden]), .request-page form.space-y-4 > :not([hidden]) ~ :not([hidden]) { margin-top: 21px; }
.request-page .field { width: 100%; min-height: 51px; padding: 12px 15px; border: 1px solid #e4e2ef; border-radius: 13px; outline: 0; background: #fafafe; color: #292642; transition: border-color .2s, background .2s, box-shadow .2s; }
.request-page textarea.field { min-height: 96px; line-height: 1.8; }
.request-page textarea#description { min-height: 128px; }
.request-page .field::placeholder { color: #a09db3; opacity: 1; }
.request-page .field:focus { border-color: #8875d8; background: #fff; box-shadow: 0 0 0 4px rgba(107,84,194,.11); }
.request-page label.text-sm { color: #38364e; font-size: 12px; font-weight: 800; }
.request-page #map { border: 1px solid #e4e2ef; background: #f0eff8; }
.request-page #map-toggle { border-color: #fff; box-shadow: 0 5px 13px rgba(38,31,82,.13); }
.request-page #importance-row { gap: 10px; }
.request-page .imp-opt { display: grid; min-height: 68px; align-content: center; border: 1px solid #e8e5f2; border-radius: 13px; background: #fbfaff; color: #68657e; transition: border-color .2s, background .2s, color .2s, box-shadow .2s, transform .2s; }
.request-page .imp-opt:hover { transform: translateY(-1px); border-color: #b9a9eb; }
.request-page .imp-opt:has(:checked) { border-color: #816bcf; background: #f1edff; color: #4f3aa5; box-shadow: 0 0 0 2px rgba(129,107,207,.1); }
.request-page #file-picker { border: 1px dashed #b8addf; border-radius: 13px; background: #f6f3ff; color: #5845a7; transition: background .2s, border-color .2s; }
.request-page #file-picker:hover { border-color: #806bc9; background: #f0ecff; }
.request-page #moderation-consent { accent-color: var(--request-violet); }
.request-page #upload-progress { border-color: #dfdaf1; background: #f5f2ff; }
.request-page #upload-progress > div:first-child { color: #4f3aa5; }
.request-page #upload-progress-bar { background: linear-gradient(90deg,var(--request-violet-dark),#735bc5,var(--request-cyan)); }
.request-page #submit-button, .request-page #track-form button, .request-page #captcha-submit { border-radius: 13px; background: linear-gradient(105deg,var(--request-violet-dark),#735bc5); box-shadow: 0 10px 22px rgba(88,64,170,.18); transition: transform .2s, box-shadow .2s, filter .2s; }
.request-page #submit-button:hover, .request-page #track-form button:hover, .request-page #captcha-submit:hover { transform: translateY(-1px); box-shadow: 0 14px 26px rgba(88,64,170,.24); filter: brightness(1.04); }
.request-page #success .material-symbols-rounded, .request-page #tracking-code { color: var(--request-violet); }
.request-page #captcha-overlay { background: rgba(24,22,58,.56); backdrop-filter: blur(8px); }
.request-page #captcha-overlay > .card { width: min(100%,370px); border-color: rgba(255,255,255,.8); border-radius: 22px; box-shadow: 0 25px 70px rgba(18,15,59,.25); }
.request-page #captcha-cancel { border: 1px solid #e9e6f2; background: #f5f4f9; color: #625e77; }
.request-page #blocked-access .bg-red-50 { background: #f1edff; color: #6049b7; }
.request-page #appeal-form button { border-radius: 12px; background: linear-gradient(105deg,var(--request-violet-dark),#735bc5); }
.request-page #appeal-success { border: 1px solid #dfdaf1; background: #f5f2ff; color: #4f3aa5; }

@media (max-width: 600px) {
  .request-page main { padding-top: 18px; padding-bottom: 30px; }
  .request-page header { padding: 25px 18px 23px; border-radius: 19px; }
  .request-page header h1 { font-size: 20px; }
  .request-page .card { border-radius: 17px; }
  .request-page #submit, .request-page #track, .request-page #blocked-access { padding: 19px 16px; }
  .request-page .imp-opt { padding: 10px 5px; font-size: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  .request-page *, .request-page *::before, .request-page *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; }
}