/* Report request modal shared by the home hero and /geo-report (markup built by js/geo-request.js) */
.gr-modal { position: fixed; inset: 0; z-index: 40; display: grid; place-items: center; padding: 16px; }
.gr-modal[hidden] { display: none; }
.gr-modal-back { position: absolute; inset: 0; background: rgba(0,0,0,.72); backdrop-filter: blur(2px); }
.gr-modal-card { position: relative; width: min(560px, 100%); padding: 32px 32px 28px; border: 1px solid var(--line); border-radius: 16px; background: #0b0b0c; box-shadow: 0 40px 120px rgba(0,0,0,.7); animation: grPop .35s cubic-bezier(.19,1,.22,1); }
@keyframes grPop { from { opacity: 0; transform: translateY(12px) scale(.98); } }
.gr-modal-x { position: absolute; top: 14px; right: 16px; width: 32px; height: 32px; border-radius: 50%; background: none; color: var(--fg-3); font-size: 22px; line-height: 1; }
.gr-modal-x:hover { color: var(--fg); background: var(--bg-3); }
.gr-modal-card h2 { font-size: 20px; font-weight: 500; letter-spacing: -0.02em; padding-right: 32px; }
.gr-modal-sub { margin-top: 6px; font-size: 14px; color: var(--fg-3); }
.gr-modal-form { margin-top: 24px; display: grid; gap: 12px; }
.gr-field { display: grid; gap: 2px; padding: 10px 14px 11px; border: 1px solid var(--line); border-radius: 10px; background: #0f0f10; transition: border-color .2s; }
.gr-field:focus-within { border-color: rgba(255,255,255,.4); }
.gr-field.bad { border-color: #ff5d5d; }
.gr-field span { font-size: 11.5px; color: var(--fg-3); }
.gr-field span b { color: #ff7d7d; font-weight: 400; margin-left: 1px; }
.gr-field input { width: 100%; background: none; border: 0; outline: none; color: var(--fg); font: inherit; font-size: 15px; padding: 0; }
.gr-field input::placeholder { color: var(--fg-4); }
.gr-result { font-size: 13.5px; color: var(--fg-2); min-height: 0; }
.gr-result:empty { display: none; }
.gr-result.ok { color: var(--fg); }
.gr-result.err { color: #ff7d7d; }
.gr-result a { color: var(--fg); text-decoration: underline; text-underline-offset: 3px; }
.gr-modal-foot { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 8px; }
.gr-modal-foot small { font-size: 12px; color: var(--fg-4); max-width: 300px; }
.gr-modal-foot button { padding: 11px 18px; border-radius: 9px; background: var(--fg); color: #000; font-weight: 500; font-size: 14px; white-space: nowrap; }
.gr-modal-foot button:disabled { opacity: .55; cursor: default; }
@media (max-width: 560px) { .gr-modal-card { padding: 24px 20px 20px; } .gr-modal-foot { flex-direction: column; align-items: stretch; } .gr-modal-foot small { max-width: none; } }

/* ---------- Modal: confirmation view ---------- */
.gr-view[hidden] { display: none; }
.gr-done { text-align: center; padding: 20px 0 8px; }
.gr-done-art { display: flex; justify-content: center; align-items: center; gap: 18px; margin-bottom: 30px; }
.gr-done-art i { position: relative; display: grid; align-content: start; gap: 7px; width: 72px; height: 100px; padding: 14px 12px; border: 1px solid var(--line); border-radius: 8px; background: #0e0e0f; opacity: .45; transform: scale(.9); }
.gr-done-art i b { display: block; height: 4px; border-radius: 2px; background: #3a3a3d; }
.gr-done-art i b:nth-child(odd) { width: 70%; }
.gr-done-art i.mid { width: 84px; height: 110px; opacity: 1; transform: none; border-color: rgba(255,255,255,.22); background: linear-gradient(180deg, #151517, #0d0d0e); box-shadow: 0 20px 50px rgba(0,0,0,.6); }
.gr-done-art i.mid svg { width: 14px; height: 14px; color: var(--fg-2); margin-bottom: 4px; }
.gr-done-art i.mid b { background: #dfe4e8; opacity: .55; }
.gr-done h2 { font-size: 22px; font-weight: 500; letter-spacing: -0.02em; padding: 0; }
.gr-done p { margin: 12px auto 0; max-width: 340px; font-size: 14.5px; line-height: 1.5; color: var(--fg-3); }
.gr-done-btn { margin-top: 26px; padding: 11px 22px; border-radius: 9px; background: var(--fg); color: #000; font-weight: 500; font-size: 14px; }