/* Shared identity surfaces. No dependency on a game or a Career database layout. */
.identity-page { max-width: 1600px; margin: 0 auto; padding: 32px var(--page-gutter) 28px; }
.identity-page [hidden], .identity-login [hidden] { display: none !important; }
.identity-page h1, .identity-login h1 { margin: 6px 0 10px; font-size: clamp(1.8rem,2.8vw,2.8rem); line-height: 1.12; letter-spacing: -.045em; }
.identity-page h2 { font-size: 1.18rem; margin: 0; letter-spacing: -.025em; }
.identity-page h3 { margin: 0; font-size: 1rem; }
.identity-page p, .identity-login p { color: var(--color-muted); line-height: 1.55; margin: 8px 0; }
.identity-heading, .identity-section-heading { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.identity-heading { margin-bottom: 24px; }
.identity-nav { display: flex; gap: 8px; border-bottom: 1px solid var(--panel-border); margin-bottom: 24px; overflow-x: auto; }
.identity-nav a { display: flex; align-items: center; min-height: 48px; padding: 8px 15px 14px; font-weight: 650; font-size: .9rem; text-decoration: none; color: var(--color-muted); border-bottom: 2px solid transparent; white-space: nowrap; transition: color .18s, border-color .18s; }
.identity-nav a[aria-current], .identity-nav a:hover { color: var(--color-text); border-color: var(--color-accent); }
.identity-panel { background: var(--panel-fill); border: 1px solid var(--panel-border); border-radius: var(--radius-panel); box-shadow: var(--panel-shadow); padding: 26px; }
.identity-overview { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1.5fr); gap: 20px; }
.identity-self { display: grid; grid-template-columns: 76px minmax(0,1fr); align-content: start; align-items: center; gap: 12px 18px; }
.identity-self h2 { font-size: 1.6rem; overflow-wrap: anywhere; }
.identity-self .identity-self-bio, .identity-self .identity-actions { grid-column: 1/-1; }
.identity-self-bio { white-space: pre-wrap; overflow-wrap: anywhere; }
.identity-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 6px; }
.identity-tag { display: inline-block; font-size: .7rem; letter-spacing: .06em; text-transform: uppercase; color: var(--color-muted); font-weight: 700; }
.identity-shortcuts { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; }
.identity-shortcut { position: relative; display: grid; grid-template-columns: 36px 1fr; gap: 4px 12px; padding: 22px; border-radius: var(--radius-panel); background: var(--panel-fill); border: 1px solid var(--panel-border); color: var(--color-text); text-decoration: none; overflow: hidden; transition: transform .25s var(--motion-ease), border-color .25s, box-shadow .25s; }
.identity-shortcut::before { content: ''; position: absolute; width: 140px; height: 140px; right: -70px; top: -80px; background: radial-gradient(circle, color-mix(in srgb,var(--color-accent) 14%,transparent),transparent 70%); pointer-events: none; opacity: .4; transition: opacity .25s; }
.identity-shortcut-icon { font-size: 1.8rem; color: var(--color-accent); grid-row: 1/3; }
.identity-shortcut strong { font-size: 1.65rem; line-height: 1; font-variant-numeric: tabular-nums; }
.identity-shortcut p { grid-column: 2; font-size: .82rem; margin: 0; }
.identity-shortcut-arrow { position: absolute; top: 18px; right: 20px; color: var(--color-muted); }
.identity-section-heading { margin: 28px 0 18px; }
.identity-section-heading p { font-size: .88rem; }
.identity-section-heading a { color: var(--color-text); font-size: .88rem; }
.identity-empty { text-align: center; padding: 32px 20px; border: 1px dashed var(--color-border); border-radius: var(--radius-panel); }
.identity-empty p { max-width: 440px; margin: 8px auto 18px; }
.identity-empty-mark { display: inline-block; font-size: 2.5rem; color: var(--color-accent); margin-bottom: 12px; }
.identity-players { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.identity-player { display: flex; align-items: center; min-width: 0; padding: 12px; gap: 10px; background: var(--panel-fill); border: 1px solid var(--panel-border); border-radius: 16px; transition: transform .24s var(--motion-ease),border-color .24s; }
.identity-player-link { flex: 1; display: grid; grid-template-columns: 64px minmax(0,1fr) auto; align-items: center; min-width: 0; gap: 14px; text-decoration: none; color: var(--color-text); }
.identity-player-face { width: 64px; height: 72px; object-fit: contain; object-position: bottom; border-radius: 12px; background: #ffffff06; }
.identity-player-name { min-width: 0; }
.identity-player-name h3 { line-height: 1.35; overflow-wrap: break-word; word-break: normal; }
.identity-player-meta { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin-top: 8px; color: var(--color-muted); font-size: .8rem; }
.identity-player-meta img { object-fit: contain; }
.identity-position { font-size: .76rem; font-weight: 750; padding: 5px; border-radius: 5px; border: 1px solid #ffffff18; color: #b8d8ff; }
.identity-player-ratings { display: flex; gap: 8px; }
.identity-player-ratings > span { display: grid; gap: 4px; text-align: center; }
.identity-player-ratings small { color: var(--color-muted); font-size: .63rem; letter-spacing: .05em; }
.identity-player-ratings .rating-pill { width: 36px; height: 36px; border-radius: 6px; background: var(--rating-bg); color: var(--rating-ink); display: grid; place-items: center; padding: 0; font-size: 1rem; }
.identity-star { display: grid; place-items: center; width: 44px; min-height: 44px; border-radius: 12px; background: transparent; border: 1px solid transparent; color: #f3ce33; font: inherit; font-size: 1.45rem; cursor: pointer; }
.identity-star:hover { background: #ffffff08; border-color: var(--panel-border); }
.identity-pagination { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 16px; max-width: 460px; margin: 26px auto 0; color: var(--color-muted); font-size: .85rem; }
.identity-pagination > :first-child { justify-self: end; }
.identity-pagination > :last-child { justify-self: start; }
.identity-search { display: flex; align-items: center; gap: 12px; padding: 8px 10px 8px 18px; border: 1px solid var(--color-border); border-radius: 15px; background: #111820; margin: 0 0 26px; }
.identity-search > span { font-size: 1.7rem; color: var(--color-muted); }
.identity-search input { flex: 1; width: 0; min-height: 44px; border: 0; background: transparent; color: var(--color-text); font: inherit; }
.identity-search:focus-within { box-shadow: var(--focus-ring); }
.identity-search input:focus-visible { outline: 0; }
.identity-status { position: sticky; bottom: 18px; z-index: 15; width: fit-content; max-width: 100%; margin: 16px auto 0; border-radius: 12px; }
.identity-status:not(:empty) { padding: 12px 18px; background: #202c39; border: 1px solid #ffffff20; box-shadow: 0 8px 30px #0008; }
.identity-status button { border: 0; background: transparent; color: var(--color-accent); padding: 8px; margin-left: 10px; font: inherit; cursor: pointer; text-decoration: underline; min-height: 44px; }
.identity-settings { display: grid; grid-template-columns: minmax(0,1fr) 310px; gap: 24px; align-items: start; }
.identity-settings-fields { display: grid; gap: 18px; min-width: 0; }
.identity-settings .identity-section-heading { margin: 0 0 24px; }
.identity-field-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.identity-settings label:not(.identity-toggle), .identity-login-form label { font-size: .88rem; font-weight: 600; }
.identity-settings input:not([type=checkbox],[type=radio],[type=hidden]), .identity-settings textarea, .identity-login input[type=email] { width: 100%; min-height: 46px; margin-top: 9px; padding: 12px 14px; background: var(--control-fill); color: var(--color-text); border: 1px solid var(--color-border); border-radius: var(--radius-control); font: inherit; }
.identity-settings textarea { min-height: 110px; resize: vertical; display: block; line-height: 1.5; }
.identity-bio-label { display: block; margin-top: 20px; }
.identity-handle-input { display: flex; align-items: center; position: relative; }
.identity-handle-input > span { position: static; flex: 0 0 28px; text-align: center; color: var(--color-muted); }
.identity-settings .identity-handle-input input { min-width: 0; flex: 1; padding-left: 14px; }
.identity-settings label small { display: block; margin-top: 8px; color: var(--color-muted); font-size: .76rem; font-weight: 400; line-height: 1.5; }
.identity-field-hint { font-size: .78rem; }
.identity-avatars { border: 0; padding: 0; margin: 22px 0 0; }
.identity-avatars legend { font-size: .9rem; font-weight: 600; }
.identity-avatars p { font-size: .8rem; }
.identity-avatars > div { display: grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap: 10px; margin-top: 15px; }
.identity-avatars label { cursor: pointer; text-align: center; position: relative; min-width: 0; }
.identity-avatars input, .identity-toggle input { position: absolute; opacity: 0; width: 1px; height: 1px; }
[data-avatar-style=blue] { --avatar:#68b3ff; --avatar-deep:#153e67; }
[data-avatar-style=lime] { --avatar:#d2ff00; --avatar-deep:#344115; }
[data-avatar-style=violet] { --avatar:#c4a0ff; --avatar-deep:#433068; }
[data-avatar-style=coral] { --avatar:#ffafa2; --avatar-deep:#65382f; }
[data-avatar-style=teal] { --avatar:#79e9d0; --avatar-deep:#23483f; }
[data-avatar-style=amber] { --avatar:#ffd78a; --avatar-deep:#61461f; }
.identity-avatar, .identity-avatars label > span { display: grid; place-items: center; border-radius: 26%; background: linear-gradient(145deg,color-mix(in srgb,var(--avatar) 28%,var(--avatar-deep)),var(--avatar-deep)); color: var(--avatar); border: 1px solid color-mix(in srgb,var(--avatar) 35%,transparent); box-shadow: inset 0 1px #ffffff18; }
.identity-avatar { width: 76px; height: 76px; font-size: 1.9rem; font-weight: 800; letter-spacing: -.03em; text-transform: uppercase; flex-shrink: 0; }
.identity-avatars label > span { width: 48px; height: 48px; margin: auto; background: var(--avatar-deep); border: 2px solid var(--avatar); transition: transform .2s,box-shadow .2s; }
.identity-avatars label > span > span { visibility: hidden; }
.identity-avatars input:checked + span { box-shadow: 0 0 0 3px #111820,0 0 0 5px var(--avatar); }
.identity-avatars input:checked + span > span { visibility: visible; }
.identity-avatars input:focus-visible + span { outline: 2px solid white; outline-offset: 5px; }
.identity-toggle { position: relative; display: flex; justify-content: space-between; align-items: center; gap: 24px; cursor: pointer; padding: 18px 0; }
.identity-toggle + .identity-toggle { border-top: 1px solid var(--panel-border); }
.identity-toggle strong { font-size: .9rem; }
.identity-toggle small { display: block; color: var(--color-muted); margin-top: 5px; font-size: .82rem; font-weight: 400; }
.identity-switch { width: 46px; height: 28px; border-radius: 20px; background: #536073; position: relative; flex-shrink: 0; transition: background .2s; }
.identity-switch::after { content:''; width: 22px; height: 22px; position:absolute; left:3px; top:3px; border-radius:50%; background:#f7f9fc; transition:transform .2s var(--motion-ease); }
.identity-toggle input:checked + .identity-switch { background: var(--color-career); }
.identity-toggle input:checked + .identity-switch::after { transform:translateX(18px); }
.identity-toggle input:focus-visible + .identity-switch { outline:2px solid white; outline-offset:4px; }
.identity-preview { position: sticky; top: calc(var(--header-height) + 24px); display:grid; justify-items:center; text-align:center; gap:14px; min-width:0; }
.identity-preview .identity-avatar { width:100px; height:100px; font-size:2.4rem; margin:12px 0; }
.identity-preview h2 { font-size:1.5rem; overflow-wrap:anywhere; max-width:100%; }
.identity-preview p { overflow-wrap:anywhere; white-space:pre-wrap; max-width:100%; }
.identity-preview-handle { margin:0!important; }
.identity-preview-privacy { border:1px solid var(--color-border); border-radius:20px; padding:7px 12px; font-size:.75rem; }
.identity-savebar { position:sticky; bottom:16px; display:flex; align-items:center; justify-content:space-between; gap:18px; padding:14px 18px; border-radius:14px; border:1px solid var(--color-border); background:#17212dfa; z-index:10; box-shadow:0 5px 22px #0004; }
.identity-savebar p { font-size:.8rem; margin:0; }
.identity-savebar .button { flex-shrink:0; }
.identity-notice { padding:14px 18px; border:1px solid var(--color-border); border-radius:12px; margin-bottom:20px; font-size:.9rem; }
.identity-notice--success { background:#18392e; color:#b4f1d0; border-color:#3d775c; }
.identity-notice--error { background:#421f2c; color:#ffd0dc; border-color:#965566; }
.identity-notice a { color:inherit; }
.identity-notice p { color:inherit; }
.identity-creation-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.identity-creation { padding:24px; background:var(--panel-fill); border:1px solid var(--panel-border); border-radius:16px; }
.identity-creation h3 { margin:14px 0; overflow-wrap:anywhere; }
.identity-creation p { white-space:pre-wrap; overflow-wrap:anywhere; }
.identity-creation small { color:var(--color-muted); }
.identity-public-hero { display:grid; grid-template-columns:100px minmax(0,1fr) auto; align-items:start; gap:22px; margin-bottom:20px; }
.identity-public-hero > .identity-avatar { width:100px; height:100px; font-size:2.5rem; }
.identity-public-intro { min-width:0; }
.identity-public-intro h1, .identity-public-intro p { overflow-wrap:anywhere; }
.identity-public-bio { white-space:pre-wrap; }
.identity-public-actions { display:flex; flex-wrap:wrap; gap:10px; }
.identity-public-stats { grid-column:2/-1; display:flex; flex-wrap:wrap; gap:30px; padding-top:18px; border-top:1px solid var(--panel-border); }
.identity-public-stats > span { display:flex; gap:9px; align-items:center; font-size:.85rem; color:var(--color-muted); }
.identity-public-stats b { color:var(--color-text); font-size:1.2rem; }
.identity-login { max-width:1250px; margin:0 auto; padding:clamp(30px,6vw,100px) var(--page-gutter); display:grid; grid-template-columns:1.1fr 1fr; align-items:center; gap:clamp(28px,5vw,80px); }
.identity-login h1 { font-size:clamp(2.2rem,4vw,4rem); max-width:500px; }
.identity-login-story > p { max-width:410px; }
.identity-world-orbs { display:flex; gap:16px; margin:30px 0; }
.identity-world-orbs span { width:90px; height:90px; border-radius:24px; display:grid; place-items:center; background:linear-gradient(135deg,#303821,#11191c); border:1px solid #b9db2b33; color:var(--color-fut); font-size:3rem; transform:rotate(-8deg); }
.identity-world-orbs span+span { transform:rotate(8deg) translateY(10px); background:linear-gradient(135deg,#1e354a,#10191d); border-color:#248cff44; color:var(--color-career); }
.identity-login-benefits { display:flex; flex-wrap:wrap; gap:14px; color:var(--color-muted); font-size:.8rem; }
.identity-login-card { padding:32px; }
.identity-login-card h2 { font-size:1.7rem; letter-spacing:-.035em; margin:18px 0 10px; }
.identity-login-card > p { font-size:.9rem; }
.identity-login-symbol { display:grid; place-items:center; width:46px; height:46px; border-radius:14px; background:color-mix(in srgb,var(--color-accent) 12%,transparent); color:var(--color-accent); font-size:1.8rem; }
.identity-login-form { display:grid; gap:10px; margin:24px 0 20px; }
.identity-login-form input[type=email] { margin:0; }
.identity-login-form .button { margin-top:8px; }
.identity-page [aria-busy=true] { opacity:.65; transition:opacity .18s; }
@media (hover:hover) and (pointer:fine) {
 .identity-shortcut:hover, .identity-player:has(a):hover { transform:translateY(-3px); border-color:color-mix(in srgb,var(--color-accent) 35%,var(--panel-border)); box-shadow:0 12px 26px #0003; }
 .identity-shortcut:hover::before { opacity:1; }
 .identity-avatars label:hover > span { transform:translateY(-3px); }
}
@media (prefers-reduced-motion:no-preference) {
 .identity-heading, .identity-login-story, .identity-public-hero { animation:identity-enter .4s var(--motion-ease) both; }
 .identity-overview, .identity-settings, .identity-login-card { animation:identity-enter .5s var(--motion-ease) .06s both; }
 .identity-player { animation:identity-enter .32s var(--motion-ease) both; }
 @keyframes identity-enter { from { opacity:0; transform:translateY(8px); } to { opacity:1; transform:translateY(0); } }
}
@media (max-width:1100px) {
 .identity-settings { grid-template-columns:minmax(0,1fr) 250px; gap:18px; }
 .identity-players { grid-template-columns:1fr; }
 .identity-overview { grid-template-columns:minmax(0,1fr) minmax(0,1fr); }
 .identity-shortcut { padding:18px; }
 .identity-shortcut p { grid-column:1/-1; margin-top:4px; }
 .identity-public-hero { grid-template-columns:80px minmax(0,1fr); }
 .identity-public-hero > .identity-avatar { width:80px; height:80px; }
 .identity-public-actions { grid-column:2; }
 .identity-avatars > div { grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
}
@media (max-width:767px) {
 .identity-page { padding:24px 16px; }
 .identity-heading { align-items:start; gap:12px; }
 .identity-heading .eyebrow { font-size:.65rem; }
 .identity-heading > form .button { padding:10px; font-size:.8rem; }
 .identity-heading > div { min-width:0; }
 .identity-nav { margin-inline:-16px; padding-inline:16px; }
 .identity-nav a { padding-inline:12px; font-size:.82rem; }
 .identity-overview, .identity-settings { grid-template-columns:1fr; }
 .identity-panel { padding:20px; }
 .identity-shortcuts { gap:10px; }
 .identity-shortcut h2 { font-size:1rem; }
 .identity-preview { display:none; }
 .identity-field-grid { grid-template-columns:1fr; gap:18px; }
 .identity-avatars > div { grid-template-columns:repeat(3,minmax(0,1fr)); }
 .identity-savebar { bottom:12px; padding:12px; gap:10px; }
 .identity-savebar p { max-width:50%; font-size:.75rem; }
 .identity-player { padding:10px; gap:4px; }
 .identity-player-link { grid-template-columns:52px minmax(0,1fr); gap:10px; }
 .identity-player-face { width:52px; height:64px; }
 .identity-player-ratings { grid-column:2; margin-top:4px; }
 .identity-player-ratings > span { display:flex; align-items:center; gap:5px; }
 .identity-player-name h3 { font-size:.95rem; }
 .identity-star { align-self:start; }
 .identity-section-heading { align-items:start; gap:14px; }
 .identity-section-heading > a { flex-shrink:0; font-size:.8rem; }
 .identity-creation-grid { grid-template-columns:1fr; }
 .identity-public-hero { grid-template-columns:64px minmax(0,1fr); gap:16px; }
 .identity-public-hero > .identity-avatar { width:64px; height:64px; font-size:1.8rem; }
 .identity-public-actions, .identity-public-stats { grid-column:1/-1; }
 .identity-public-stats { gap:16px; }
 .identity-login { padding:28px 16px; grid-template-columns:1fr; gap:26px; }
 .identity-login-story h1 { font-size:2.15rem; }
 .identity-login-story > p:not(.eyebrow) { font-size:.9rem; }
 .identity-world-orbs { display:none; }
 .identity-login-benefits { margin-top:16px; gap:10px; }
 .identity-login-card { padding:24px; }
}
@media (prefers-reduced-motion:reduce) {
 .identity-page *, .identity-login * { animation:none!important; transition:none!important; scroll-behavior:auto!important; }
}

.identity-login-email strong { display: block; color: var(--color-text); overflow-wrap: anywhere; }

/* v33.2: explicit local crop, shared by onboarding and account settings. */
.avatar-crop{width:min(440px,calc(100vw - 28px));max-height:calc(100dvh - 28px);margin:auto;padding:24px;border:1px solid #ffffff20;border-radius:26px;background:#131b27;color:#f5f7fb;box-shadow:0 32px 110px #0009;overflow:auto}
.avatar-crop::backdrop{background:#05090eba;backdrop-filter:blur(9px)}
.avatar-crop__head{display:flex;align-items:center;justify-content:space-between;gap:12px}.avatar-crop__head h2{font-size:1.25rem;letter-spacing:-.035em;margin:0}.avatar-crop__head button{border:0;background:#ffffff08;color:#c9d8eb;width:38px;height:38px;border-radius:12px;font-size:24px;cursor:pointer}
.avatar-crop>p{color:#aabace;font-size:.85rem;line-height:1.5}.avatar-crop canvas{display:block;width:min(100%,300px);height:auto;aspect-ratio:1;margin:18px auto;border-radius:18px;box-shadow:0 0 0 1px #ffffff20;touch-action:none;cursor:grab}.avatar-crop canvas:active{cursor:grabbing}.avatar-crop canvas:focus-visible{outline:2px solid #87c4ff;outline-offset:4px}
.avatar-crop__zoom{display:flex;gap:20px;align-items:center;font-size:.85rem}.avatar-crop__zoom input{flex:1;width:0;accent-color:#7bb8ff;min-height:32px}.avatar-crop__actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}.avatar-crop__actions button{flex:1;justify-content:center;white-space:nowrap;padding:11px 12px;font-size:.82rem}.avatar-crop__note{min-height:2.5em}.avatar-upload-preview{object-fit:cover;border-radius:18px!important}
@media(max-width:390px){.avatar-crop{padding:18px}.avatar-crop__actions [data-crop-apply]{flex-basis:100%}.avatar-crop canvas{width:min(100%,260px)}}

.identity-admin-link{color:#8cbfff!important}.identity-rank{font-size:12px;margin-left:8px;border-radius:6px;padding:4px 8px;border:1px solid currentColor;color:var(--rank-color,#91c1ff);white-space:nowrap}

.member-badge{display:inline-flex;align-items:center;gap:5px;vertical-align:middle;font-size:12px;font-weight:750;margin-inline:5px}.member-badge img{width:36px;height:36px;object-fit:contain;flex:none}.member-badge span{line-height:1.2}