/* Slopclip r4 "windows on arrival": sign-in and create-account dialogs, the age check, the 18+ prompt and the
   analytics choice. Presentation only: one white card style, orange top rule, navy actions. No wording, field or
   consent logic lives here. Loaded last on the app and on every static page that shows the analytics choice. */

/* ---- analytics choice (static pages): a quiet inline strip, two equal buttons, never a popup ---- */
.cd-consent{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;padding:12px 14px;margin:24px 0;background:#fff;border:1px solid #e3e8f0;border-left:4px solid #1d4a8f;border-radius:6px;font-size:13px;line-height:1.45;color:#14223b}
.cd-consent p{flex:1 1 100%;margin:0}
.cd-consent button,.cd-consent a{margin:0}
.cd-consent button,.cd-consent button.button{min-height:40px;padding:0 14px;border-radius:6px;font:800 14px/1 Barlow,Arial,sans-serif;cursor:pointer;border:2px solid #1d4a8f;background:#fff;color:#1d4a8f;box-shadow:none}
.cd-consent button[data-creator-analytics-choice="deny"]{color:#1d4a8f!important;background:#fff!important}
.cd-consent button[data-creator-analytics-choice="allow"]{background:#1d4a8f!important;color:#fff!important}
.cd-consent button:focus-visible{outline:3px solid #ffb59c;outline-offset:2px}
.cd-consent a{margin-left:auto;font-size:13px;color:#1d4a8f;text-decoration:underline}
@media(max-width:480px){.cd-consent button,.cd-consent button.button{flex:1 1 0;padding:0 8px}.cd-consent a{flex:1 1 100%;margin:2px 0 0}}

/* ---- sign in, create account, first-run and security dialogs ---- */
dialog.auth-dialog{width:min(420px,calc(100% - 24px));max-height:calc(100dvh - 24px);padding:20px 22px 18px;border:1px solid #d5dce8;border-top:5px solid #f0531f;border-radius:10px;background:#fff;color:#14223b;box-shadow:0 18px 60px #0b1a3355}
dialog.auth-dialog::backdrop{background:#0b1a33b8;-webkit-backdrop-filter:none;backdrop-filter:none}
dialog.auth-dialog .auth-mascot{float:left;margin:0 10px 0 0}
dialog.auth-dialog .auth-mascot svg{width:50px;height:40px;margin:0;display:block}
dialog.auth-dialog .eyebrow{display:block;padding-top:2px}
dialog.auth-dialog .auth-intro{clear:both;padding-top:8px}
dialog.auth-dialog .auth-text-link{margin-top:6px;min-height:30px;font-size:13px}
dialog.auth-dialog .auth-footnote{font-size:12px;line-height:1.45;margin:8px 0 0;text-align:left;color:#4a566b}
dialog.auth-dialog h2{font-size:24px;line-height:1.15;letter-spacing:-.5px;margin:4px 0 6px}
dialog.auth-dialog .auth-intro{font-size:14px;line-height:1.45;margin:0 0 4px;color:#4a566b}
dialog.auth-dialog .auth-tabs{margin:14px 0 12px;border-bottom:0}
dialog.auth-dialog .auth-tabs button{min-height:42px}
dialog.auth-dialog form{gap:10px}
dialog.auth-dialog label{gap:6px;margin-bottom:0}
dialog.auth-dialog input:not([type=checkbox]){height:44px;background:#fff;border-color:#cfd6e4;border-radius:6px;font-size:16px}
dialog.auth-dialog select{padding:11px;border-color:#cfd6e4;border-radius:6px;font-size:16px}
dialog.auth-dialog .consent-row{margin:8px 0;line-height:1.45}
dialog.auth-dialog .consent-row input{accent-color:#1d4a8f}
dialog.auth-dialog .auth-divider{margin:14px 0 10px;color:#4a566b}
dialog.auth-dialog .auth-divider:before,dialog.auth-dialog .auth-divider:after{background:#e3e8f0}
dialog.auth-dialog .oauth-buttons{gap:8px}
dialog.auth-dialog .oauth-button{min-height:44px;padding:10px 16px;border-radius:6px;border-color:#cfd6e4}
dialog.auth-dialog .oauth-apple{border-color:#111}
dialog.auth-dialog .oauth-disclosure,dialog.auth-dialog .oauth-check>p{margin:10px 0 0;line-height:1.45;color:#4a566b}
dialog.auth-dialog .oauth-check{margin-top:14px;padding-top:14px;border-top-color:#e3e8f0}
@media(max-width:480px){
  dialog.auth-dialog{padding:16px 16px 14px}
  dialog.auth-dialog h2{font-size:22px}
}

/* ---- age check and 18+ prompt: a small centred card, not a stretched form ---- */
.app .play-access{max-width:480px;margin:8px auto 0;padding:18px 22px;background:#fff;border:1px solid #d5dce8;border-top:5px solid #f0531f;border-radius:10px}
.app .play-access .back-link{margin:0 0 10px}
.app .play-access .eyebrow{font-size:11px;letter-spacing:.06em}
.app .play-access h2{font-size:24px;line-height:1.15;margin:6px 0 4px}
.app .play-access p{margin:8px 0;line-height:1.5;color:#4a566b}
.app .play-access select{min-height:46px;margin:6px 0 10px;border-color:#cfd6e4;border-radius:6px;font-size:16px}
.app .play-access .consent-row{margin:10px 0;line-height:1.45}
.app .play-access .consent-row input{accent-color:#1d4a8f}
.app .play-access .play-content-note{margin:10px 0;padding:10px 12px;background:#fff;border:1px solid #e3e8f0;border-left:4px solid #f0531f;border-radius:6px;font-size:13px;color:#14223b}
.app .play-access button.button{width:100%;min-height:46px;margin-top:6px;justify-content:center}
.app .play-access .field-hint{font-size:12px;line-height:1.45}
@media(max-width:480px){.app .play-access{padding:16px}}
dialog.auth-dialog form>.button,dialog.auth-dialog form>button.button{width:100%;min-height:44px;justify-content:center}