/* Clean mobile profile matching the supplied Jelly Bean reference layout. */
:root { --pink:#ff008c; --ink:#111827; --sub:#717887; color-scheme:light; }
* { box-sizing:border-box; }
html,body { min-height:100%; margin:0; }
body { font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif; background:#fff; color:var(--ink); }
a,button { -webkit-tap-highlight-color:transparent; font:inherit; }
a:focus-visible,button:focus-visible { outline:3px solid #243f82; outline-offset:3px; }
/* Focus the accessible dialog container without a decorative square around the X. */
.warning:focus { outline:none; }
.page-shell { min-height:100svh; display:block; width:100%; }
.profile { background:#fff; width:100%; max-width:none; min-height:100svh; border-radius:0; box-shadow:none; overflow:visible; }
.pink-band { height:160px; background:var(--pink); }
.content { text-align:center; padding:0 20px 60px; max-width:465px; margin:0 auto; }
.avatar { position:relative; width:204px; height:204px; margin:-100px auto 18px; border:6px solid white; background:#ddd; border-radius:50%; overflow:hidden; box-shadow:0 7px 15px rgba(0,0,0,.17); }
.avatar img { width:100%;height:100%;display:block;object-fit:cover;object-position:center; }
.name-row { display:flex;gap:10px;align-items:center;justify-content:center;min-height:33px; }
h1 { margin:0; font-size:26px; line-height:1.24; letter-spacing:-.65px; font-weight:800; }
.check { width:19px;height:19px; display:inline-flex;align-items:center;justify-content:center;color:#fff;border-radius:50%;background:var(--pink);font-size:13px;font-weight:900;flex-shrink:0; }
.subtitle { font-size:14px;line-height:1.4;margin:6px auto 0;color:var(--sub);font-weight:500; }
.cta { display:flex;align-items:center;justify-content:center;min-height:60px;margin:31px auto 0;width:100%;padding:12px 18px;border-radius:15px;background:var(--pink);color:#fff;font-size:18px;font-weight:800;text-decoration:none;line-height:1.2;box-shadow:0 4px 2px rgba(0,0,0,.09); cursor:pointer; -webkit-touch-callout:default; -webkit-user-select:auto;user-select:auto; }
.subtitle:not([hidden]) + .cta { margin-top:25px; }
.cta:active { transform:translateY(1px); }
[hidden] { display:none !important; }
/* The supplied reference age warning is a blurred, full screen overlay. */
.warning {position:fixed;inset:0;display:grid;place-items:center;padding:22px;background:rgba(22,23,31,.56);backdrop-filter:blur(15px);-webkit-backdrop-filter:blur(15px);z-index:20; color:white;}
.warning-body { position:relative; width:min(100%,365px);text-align:center; padding:42px 10px 22px; }
.warning-close { position:fixed;top:max(30px,env(safe-area-inset-top));right:23px;padding:5px 10px;font-size:31px;font-weight:300;line-height:1;cursor:pointer;border:0;color:white;background:transparent; }
.eye-icon {display:block;margin:0 auto 31px;width:46px;height:46px;stroke:white;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}
.warning h2 { font-size:25px;line-height:1.2;font-weight:800;letter-spacing:-.4px;margin:0 0 20px; }
.warning p { font-size:17px;line-height:1.42;max-width:295px;margin:0 auto 27px;color:rgba(255,255,255,.9);font-weight:500; }
.continue { display:inline-flex;align-items:center;justify-content:center;min-height:53px;min-width:178px;padding:12px 20px;border:0;border-radius:99px;text-decoration:none;background:white;color:var(--ink);font-size:17px;font-weight:800;cursor:pointer; }
.blocked {position:fixed;inset:0;display:grid;place-items:center;background:#16181f;color:white;text-align:center;padding:30px;z-index:30;}
.blocked h2 {font-size:25px;margin:0 0 12px;}
.blocked p {color:#d3d3da;line-height:1.5;}
.blocked button { background:white;border:0;border-radius:99px;padding:13px 25px;font-weight:700;margin-top:10px; }
.toast { position:fixed;z-index:40;bottom:max(26px, env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);max-width:min(90%,390px);background:#242833;color:white;border-radius:11px;padding:12px 15px;text-align:center;font-size:13px;line-height:1.35;box-shadow:0 9px 20px #0003; }
/* Full-bleed at every viewport width. Only the inner content is constrained.
   This avoids the floating app/card look at 500–767px while preserving the
   native hyperlink and the existing two-stage flow. */
@media(max-width:335px){.pink-band{height:150px}.avatar{height:178px;width:178px;margin-top:-89px}h1{font-size:24px}.cta{font-size:17px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

/* Native POST form keeps the Continue control visually unchanged. */
.continue-form { margin:0; display:block; }
