/* Use the two approved boards unchanged. Only the chosen circular portrait is visible. */
#app .avatar.avatar-anonymous-choice, #modal .avatar.avatar-anonymous-choice, .avatar-carousel .avatar.avatar-anonymous-choice {
  background-color: #f8e4d2; background-repeat: no-repeat;
  background-image: var(--anonymous-board); background-size: 307.352941% 307.352941%;
  background-position: var(--anonymous-x) var(--anonymous-y);
  border-radius: 50%; border: 0; box-shadow: none; display: inline-block; flex-shrink: 0;
}
.anon-avatar-M01 { --anonymous-board: url("assets/anonymous/male-board.png?v=0.45"); --anonymous-x: 2.009456%; --anonymous-y: 23.758865%; }
.anon-avatar-M02 { --anonymous-board: url("assets/anonymous/male-board.png?v=0.45"); --anonymous-x: 50.000000%; --anonymous-y: 23.758865%; }
.anon-avatar-M03 { --anonymous-board: url("assets/anonymous/male-board.png?v=0.45"); --anonymous-x: 98.108747%; --anonymous-y: 23.758865%; }
.anon-avatar-M04 { --anonymous-board: url("assets/anonymous/male-board.png?v=0.45"); --anonymous-x: 2.009456%; --anonymous-y: 81.205674%; }
.anon-avatar-M05 { --anonymous-board: url("assets/anonymous/male-board.png?v=0.45"); --anonymous-x: 50.000000%; --anonymous-y: 81.205674%; }
.anon-avatar-M06 { --anonymous-board: url("assets/anonymous/male-board.png?v=0.45"); --anonymous-x: 98.108747%; --anonymous-y: 81.205674%; }
.anon-avatar-F01 { --anonymous-board: url("assets/anonymous/female-board.png?v=0.45"); --anonymous-x: 2.009456%; --anonymous-y: 21.158392%; }
.anon-avatar-F02 { --anonymous-board: url("assets/anonymous/female-board.png?v=0.45"); --anonymous-x: 50.000000%; --anonymous-y: 21.158392%; }
.anon-avatar-F03 { --anonymous-board: url("assets/anonymous/female-board.png?v=0.45"); --anonymous-x: 98.108747%; --anonymous-y: 21.158392%; }
.anon-avatar-F04 { --anonymous-board: url("assets/anonymous/female-board.png?v=0.45"); --anonymous-x: 2.009456%; --anonymous-y: 80.732861%; }
.anon-avatar-F05 { --anonymous-board: url("assets/anonymous/female-board.png?v=0.45"); --anonymous-x: 50.000000%; --anonymous-y: 80.732861%; }
.anon-avatar-F06 { --anonymous-board: url("assets/anonymous/female-board.png?v=0.45"); --anonymous-x: 98.108747%; --anonymous-y: 80.732861%; }

/* Avatar wheel: every choice is still a real radio in the identity form. */
.avatar-carousel { min-width: 0; margin: 0 0 13px; }
.avatar-carousel-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; color: #796b75; font-size: 12px; }
.avatar-carousel-groups { display: flex; padding: 3px; gap: 2px; background: #f7f3f5; border-radius: 20px; }
.avatar-carousel-groups button { min-width: 47px; min-height: 31px; border: 0; border-radius: 16px; padding: 5px 11px; background: transparent; font: inherit; color: #9b8c94; cursor: pointer; transition: color .2s, background-color .2s, box-shadow .2s; }
.avatar-carousel-groups button[aria-pressed="true"] { background: white; color: #b3577b; box-shadow: 0 2px 5px #6c335b0c; }
.avatar-carousel-stage { position: relative; height: 138px; overflow: hidden; touch-action: pan-y; -webkit-user-select: none; user-select: none; cursor: grab; isolation: isolate; overscroll-behavior-x: contain; }
.avatar-carousel-stage::before, .avatar-carousel-stage::after { content: ''; position: absolute; top: 0; bottom: 0; width: 25px; z-index: 30; pointer-events: none; }
.avatar-carousel-stage::before { left: 0; background: linear-gradient(90deg,#fff, #ffffff00); }
.avatar-carousel-stage::after { right: 0; background: linear-gradient(-90deg,#fff, #ffffff00); }
.avatar-carousel.is-dragging .avatar-carousel-stage { cursor: grabbing; }
#modal .avatar-carousel-option, .avatar-carousel .avatar-carousel-option { position: absolute; left: calc(50% - 48px); top: 21px; width: 96px; height: 96px; min-width: 0; padding: 0; margin: 0; display: block; cursor: pointer; transform-origin: center; will-change: transform; -webkit-tap-highlight-color: transparent; }
#modal .avatar-carousel-option input, .avatar-carousel-option input[type="radio"] { position: absolute; top: 48px; left: 48px; width: 1px; height: 1px; padding: 0; margin: 0; opacity: 0; pointer-events: none; }
.avatar-carousel .anonymous-avatar-option-face { display: block; position: relative; width: 96px; height: 96px; box-sizing: border-box; padding: 4px; border-radius: 50%; background: transparent; box-shadow: 0 0 0 1px transparent; transition: background-color .16s, box-shadow .16s; }
#modal .avatar-carousel .anonymous-avatar-option-face .avatar, .avatar-carousel .anonymous-avatar-option-face .avatar { display: block; width: 88px; height: 88px; margin: 0; }
.avatar-carousel input:checked + .anonymous-avatar-option-face { background: #fff; box-shadow: 0 0 0 1.5px #e99bb4, 0 8px 19px #d6739121; }
.avatar-carousel input:focus-visible + .anonymous-avatar-option-face { outline: 2px solid #ac678e; outline-offset: 4px; }
.avatar-carousel .anonymous-avatar-check { position: absolute; right: 3px; bottom: 3px; display: grid; place-items: center; width: 22px; height: 22px; box-sizing: border-box; border-radius: 50%; border: 2px solid #fff; color: white; background: #d97899; opacity: 0; transform: scale(.5); transition: transform .18s, opacity .18s; }
.avatar-carousel .anonymous-avatar-check svg { width: 13px; height: 13px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.avatar-carousel input:checked + .anonymous-avatar-option-face .anonymous-avatar-check { opacity: 1; transform: scale(1); }
.avatar-carousel-caption { min-height: 18px; display: flex; align-items: center; justify-content: center; gap: 9px; color: #7b6270; font-size: 12px; line-height: 1.5; }
.avatar-carousel-caption [data-avatar-count] { color: #b5a6ae; font-size: 11px; font-variant-numeric: tabular-nums; }
.avatar-carousel-dots { display: flex; height: 17px; align-items: center; justify-content: center; gap: 4px; }
.avatar-carousel-dots i { display: block; width: 3px; height: 3px; background: #e5d9df; border-radius: 4px; transition: width .18s,background-color .18s; }
.avatar-carousel-dots i.is-selected { width: 12px; background: #d791aa; }
.avatar-carousel-hint { display: flex; gap: 8px; align-items: center; justify-content: center; color: #b4a6af; font-size: 11px; line-height: 1.6; }
.avatar-carousel-hint span { color: #c5b4bf; font-size: 17px; line-height: 1; }
.anonymous-avatar-form { gap: 13px; }
.anonymous-avatar-fixed-name { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 13px 15px; border: 1px solid #eee7ed; border-radius: 14px; font-size: 15px; color: #715b69; background: #fcfafb; }
.anonymous-avatar-fixed-name > span { display: grid; gap: 6px; min-width: 0; }
.anonymous-avatar-fixed-name b { overflow-wrap: anywhere; font-weight: 600; }
.anonymous-avatar-fixed-name small { color: #a0919a; font-size: 11px; }
.anonymous-avatar-change { display: block; margin: 0 0 14px auto; padding: 7px 10px; color: #ae5478; font-size: 13px; min-height: 44px; }
.anonymous-avatar-profile-button { display: inline-flex; align-items: center; flex-direction: column; gap: 6px; padding: 0; min-width: 62px; }
.anonymous-avatar-profile-button small { color: #a16d87; font-size: 11px; }
.reply-author > .avatar { width: 24px; height: 24px; flex: 0 0 24px; vertical-align: middle; margin-right: 6px; }
@media(max-width:359px) { .avatar-carousel-heading { font-size: 11px; }.avatar-carousel-stage { height: 130px; } }
@media(prefers-reduced-motion:reduce) { .avatar-carousel *, .avatar-carousel *::before, .avatar-carousel *::after { transition: none !important; animation: none !important; } }

/* v0.45: the approved refined preview, scoped to the real identity dialog. */
#modal.anonymous-identity-modal { max-width: 420px; border-radius: 30px 30px 0 0; color: #40353e; }
#modal.anonymous-identity-modal::before { background: #eae5e8; }
#modal.anonymous-identity-modal .modalhead { padding: 15px 24px 0; border-bottom: 0; }
#modal.anonymous-identity-modal .modalhead h3 { font-size: 21px; line-height: 1.4; letter-spacing: -.4px; }
#modal.anonymous-identity-modal .modalhead .iconbtn { background: transparent; color: #a79aa3; }
#modal.anonymous-identity-modal .modalbody { padding: 0 24px calc(20px + env(safe-area-inset-bottom)); }
#modal.anonymous-identity-modal .form { gap: 0; }
#modal.anonymous-identity-modal .anonymous-identity-subtitle { margin: 0 0 24px; color: #998b94; font-size: 12px; line-height: 1.6; }
.avatar-carousel { margin-bottom: 25px; }
.avatar-carousel-heading { color: #7d6e77; font-size: 12px; }
.avatar-carousel-groups { position: relative; gap: 0; padding: 3px; background: #f6f3f5; border-radius: 24px; isolation: isolate; }
.avatar-carousel-groups::before { content: ''; position: absolute; z-index: -1; left: 3px; top: 3px; bottom: 3px; width: calc(50% - 3px); background: #fff; border-radius: 20px; box-shadow: 0 2px 6px #6243530d; transition: transform 280ms cubic-bezier(.2,.7,.2,1); }
.avatar-carousel[data-avatar-theme="女生"] .avatar-carousel-groups::before { transform: translateX(100%); }
.avatar-carousel-groups button { min-width: 53px; min-height: 36px; padding: 5px 13px; color: #9d8f98; background: transparent; box-shadow: none; }
.avatar-carousel-groups button[aria-pressed="true"] { color: #af5275; background: transparent; box-shadow: none; }
.avatar-carousel-stage { height: 155px; margin: 3px -10px 0; }
.avatar-carousel-stage::before, .avatar-carousel-stage::after { width: 20px; }
#modal .avatar-carousel-option, .avatar-carousel .avatar-carousel-option { width: 104px; height: 104px; left: calc(50% - 52px); top: 23px; }
#modal .avatar-carousel-option input, .avatar-carousel-option input[type="radio"] { top: 52px; left: 52px; border: 0; }
.avatar-carousel .anonymous-avatar-option-face { width: 104px; height: 104px; padding: 4px; background: #fff; box-shadow: 0 3px 9px #76564c08; transition: box-shadow 220ms; }
#modal .avatar-carousel .anonymous-avatar-option-face .avatar, .avatar-carousel .anonymous-avatar-option-face .avatar { width: 96px; height: 96px; }
.avatar-carousel input:checked + .anonymous-avatar-option-face { background: #fff; box-shadow: 0 0 0 1.5px #e6a7bb, 0 9px 21px #ba6e8622; }
.avatar-carousel .anonymous-avatar-check { width: 20px; height: 20px; right: 4px; bottom: 4px; border-width: 3px; background: #ce7896; }
.avatar-carousel .anonymous-avatar-check svg { width: 11px; height: 11px; }
.avatar-carousel.is-dragging input:checked + .anonymous-avatar-option-face .anonymous-avatar-check { opacity: 0; transform: scale(.7); }
.avatar-carousel-caption { font-size: 12px; min-height: 20px; color: #7c6472; letter-spacing: .2px; }
.avatar-carousel-caption [data-avatar-count], .avatar-carousel-hint { display: none; }
.avatar-carousel-dots { height: 22px; gap: 5px; }
.avatar-carousel-dots i { width: 3px; height: 3px; background: #e7dfe3; }
.avatar-carousel-dots i.is-selected { width: 13px; background: #cd829e; }
#modal.anonymous-identity-modal .anonymous-name-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 10px; }
#modal.anonymous-identity-modal .anonymous-name-heading label { margin: 0; font-size: 13px; font-weight: 500; color: #72616d; }
#modal.anonymous-identity-modal #anonymous-name-count { color: #aa9ba4; font-size: 11px; font-variant-numeric: tabular-nums; }
#modal.anonymous-identity-modal #anonymous-name-count.over-limit { color: #b22d52; }
#modal.anonymous-identity-modal #anonymous-name-input { min-height: 51px; padding: 14px 15px; background: #faf8f9; border-color: #f1eaee; border-radius: 15px; color: #50414f; font-size: 16px; transition: background-color .18s, border-color .18s; }
#modal.anonymous-identity-modal #anonymous-name-input:focus { background: #fff; border-color: #deb1c3; }
#modal.anonymous-identity-modal #anonymous-name-input[aria-invalid="true"] { border-color: #c73560; }
#modal.anonymous-identity-modal #anonymous-name-input::placeholder { color: #b5a7b0; font-size: 14px; }
#modal.anonymous-identity-modal .anonymous-name-meta { min-height: 0; margin: 0; }
#modal.anonymous-identity-modal #anonymous-name-error:not([hidden]) { display: block; margin-top: 8px; }
#modal.anonymous-identity-modal .anonymous-name-note { margin: 11px 0 24px; padding: 0; border-radius: 0; background: transparent; color: #a18e99; font-size: 11px; line-height: 1.7; }
#modal.anonymous-identity-modal .anonymous-avatar-fixed-name { padding: 13px 15px; background: #faf8f9; border-color: #f1eaee; border-radius: 15px; }
#modal.anonymous-identity-modal .primary { min-height: 48px; border-radius: 16px; font-size: 14px; letter-spacing: .5px; background: #cd7293; box-shadow: 0 5px 12px #cd72931c; transition: transform .18s, background-color .18s, box-shadow .18s; }
#modal.anonymous-identity-modal .primary:active { transform: scale(.98); background: #be6485; box-shadow: 0 2px 4px #cd729315; }
#modal.anonymous-identity-modal .anonymous-name-back { margin-top: 8px; min-height: 44px; font-size: 12px; color: #9e8d98; }
@media (pointer:coarse) { .avatar-carousel-groups button { min-height: 44px; } }
@media (max-width:359px) { #modal.anonymous-identity-modal .modalhead, #modal.anonymous-identity-modal .modalbody { padding-right: 20px; padding-left: 20px; } #modal.anonymous-identity-modal .modalhead h3 { font-size: 20px; } }
@media (prefers-reduced-motion:reduce) { #modal.anonymous-identity-modal *, #modal.anonymous-identity-modal *::before, .avatar-carousel-groups::before { transition: none !important; animation: none !important; } }

/* v065 compact identity chooser */
dialog.identity-choice-modal { height:auto; min-height:0; max-height:75dvh; border-radius:20px 20px 0 0; }
.identity-choice-modal .modalhead { padding:10px 18px 4px; }
.identity-choice-modal .modalhead h3 { font-size:17px; line-height:24px; }
.identity-choice-modal .modalhead .iconbtn { background:transparent; border:0; box-shadow:none; width:30px; min-width:30px; height:30px; }
.identity-choice-modal .modalhead .iconbtn svg { width:16px; height:16px; }
.identity-choice-modal .modalbody { padding:4px 18px calc(16px + env(safe-area-inset-bottom)); }
.identity-choice-modal .modalbody>p { font-size:11px; line-height:16px; margin:0 0 8px; }
.identity-choice-modal .identity-choice { margin-top:8px; padding:10px 12px; gap:10px; border-radius:12px; }
.identity-choice-modal .identity-choice .avatar { width:32px; height:32px; flex-shrink:0; }
.identity-choice-modal .identity-choice b { font-size:13px; line-height:18px; }
.identity-choice-modal .identity-choice small { margin-top:2px; font-size:11px; line-height:16px; }
.discovery-card .discovery-arrow { display:flex; align-items:center; gap:7px; width:auto; height:auto; padding:0; flex-shrink:0; background:none; border:0; box-shadow:none; border-radius:0; font-size:11px; font-weight:400; color:#888; }
.discovery-arrow i { width:6px; height:6px; border-top:1px solid currentColor; border-right:1px solid currentColor; transform:rotate(45deg); }
.discovery-card .discovery-copy { min-width:0; }
@media(max-width:359px) { .discovery-card .discovery-arrow { font-size:10px; gap:4px; } .discovery-card .discovery-copy strong { font-size:15px; } }