/* Optional details use the same open form rhythm as nickname and bio. */
.crab-h5 .profile-demographics {margin:18px 0 0;}
.crab-h5 .profile-age-field .form-label {margin:0 0 8px;}
.crab-h5 .profile-age-value {position:relative;display:block;}
.crab-h5 .profile-age-value > span {position:absolute;top:50%;right:14px;transform:translateY(-50%);color:#898183;font:400 13px/1.5 var(--sans);pointer-events:none;}
.crab-h5 .profile-age-input {display:block;width:100%;min-width:0;min-height:48px;padding:12px 48px 12px 13px;border:1px solid #d6d1c9;border-radius:10px;background:#fffefb;color:var(--ink);font:400 16px/1.55 var(--sans);box-shadow:none;}
.crab-h5 .profile-gender-field {min-width:0;margin:18px 0 0;padding:0;border:0;}
.crab-h5 .profile-gender-field legend {padding:0;margin:0 0 7px;font:700 13px/1.6 var(--sans);}
.crab-h5 .profile-gender-options {display:flex;flex-wrap:wrap;gap:8px 24px;}
.crab-h5 .profile-gender-options button {display:inline-flex;align-items:center;justify-content:flex-start;gap:8px;min-width:52px;min-height:44px;padding:8px 4px;border:0;border-radius:5px;background:transparent;color:#81777c;font:400 14px/1.6 var(--sans);cursor:pointer;box-shadow:none;}
.crab-h5 .profile-gender-options button::before {content:'';flex:none;width:13px;height:13px;border:1px solid #bdb4ad;border-radius:50%;background:#fffefb;box-sizing:border-box;}
.crab-h5 .profile-gender-options button[aria-pressed=true] {color:var(--ink);}
.crab-h5 .profile-gender-options button[aria-pressed=true]::before {border-color:#dc7864;background:#e98772;box-shadow:inset 0 0 0 3px #fffefb;}
.crab-h5 .profile-gender-options button:focus-visible {outline:2px solid #417cb0;outline-offset:2px;}
.crab-h5 .profile-gender-options button:disabled {opacity:.5;cursor:default;}
.crab-h5 .profile-demographics > p {margin:7px 0 0;color:#898183;font:400 12px/1.7 var(--sans);}
.crab-h5 .onboarding-avatar-presets {padding-top:14px;}
.crab-h5 .onboarding-avatar-presets h2 {margin:0 0 10px;font:600 13px/1.6 var(--sans);}
.crab-h5 .profile-cove .profile-demographic-meta {display:flex;flex-wrap:wrap;align-items:center;gap:3px 6px;max-width:100%;margin:5px 0 0;padding:0;color:#526774;font:500 12px/1.6 var(--sans);font-variant-numeric:tabular-nums;overflow-wrap:anywhere;}
.crab-h5 .profile-demographic-item {display:inline-flex;align-items:center;gap:6px;min-width:0;}
.crab-h5 .profile-demographic-separator {flex:none;width:2px;height:2px;border-radius:50%;background:currentColor;opacity:.55;}
.crab-h5 .profile-theme-simple .profile-cove .profile-demographic-meta {color:#fff9ef;}
.crab-h5 .onboarding-actions .primary-button {width:100%;min-height:50px;margin-top:18px;}
.crab-h5 .onboarding-skip {display:block;min-height:44px;margin:6px auto 0;padding:10px 14px;border:0;border-radius:8px;background:transparent;color:#4b6480;font:600 14px/1.5 var(--sans);cursor:pointer;}
.crab-h5 .onboarding-skip:hover {background:#ede5d6;}
.crab-h5 .onboarding-skip:focus-visible {outline:3px solid #417cb0;outline-offset:2px;}
.crab-h5 .onboarding-error {margin:8px 0;color:#a43c30;font-size:13px;line-height:1.6;}
.crab-h5 .onboarding-error:empty {display:none;}
/* A dedicated saved-photo prompt inside the existing profile-edit route. */
.crab-h5 .onboarding-photo-page .mobile-header {margin-bottom:12px;}
.crab-h5 .photo-setup-body {max-width:520px;margin:0 auto;padding:0 18px 26px;}
.crab-h5 .photo-setup-panel {padding:30px 24px 20px;border:1px solid #e1dbd0;border-radius:20px;background:#fffefb;}
.crab-h5 .photo-setup-portrait {display:flex;justify-content:center;margin:0 0 26px;}
.crab-h5 .onboarding-photo-page .photo-setup-avatar {display:block;width:144px;height:144px;border:1px solid #e4ded2;border-radius:24px;object-fit:cover;box-shadow:none;}
.crab-h5 .photo-setup-panel h1 {margin:0;color:var(--ink);font:800 25px/1.4 var(--sans);letter-spacing:-.5px;}
.crab-h5 .photo-setup-description {margin:10px 0 24px;color:#81757a;font:400 14px/1.8 var(--sans);}
.crab-h5 .photo-setup-panel .photo-verification-entry {border:0;}
.crab-h5 .photo-setup-panel .photo-verification-entry > button {width:100%;gap:10px;min-height:54px;padding:13px 15px;border:1px solid #d87360;border-radius:12px;background:#ff806b;box-shadow:none;}
.crab-h5 .photo-setup-panel .photo-verification-entry > button:disabled {border-color:#ddd7ce;background:#efebe3;opacity:1;}
.crab-h5 .photo-setup-panel .photo-entry-symbol {width:24px;height:24px;color:#593e39;}
.crab-h5 .photo-setup-panel .photo-verification-entry strong {font-size:15px;}
.crab-h5 .photo-setup-panel .photo-verification-entry small {color:#66534f;font-size:12px;}
.crab-h5 .photo-setup-panel .photo-entry-tools {justify-content:flex-start;margin-top:9px;}
.crab-h5 .photo-setup-panel .photo-entry-tools button {min-height:44px;}
.crab-h5 .photo-setup-actions {margin-top:9px;}
.crab-h5 .photo-setup-actions > .primary-button {width:100%;min-height:48px;border:1px solid #d87360;border-radius:12px;background:#ff806b;box-shadow:none;}
.crab-h5 .photo-setup-actions .onboarding-skip {color:#81757a;font-weight:500;}
/* One illustrated photo card, with a real account avatar in the print. */
.crab-h5 .mobile-app.photo-setup-missing {background:#f6efdf;}
.crab-h5 .photo-setup-missing > .mobile-scroll {width:100%;max-width:940px;margin-inline:auto;}
.crab-h5 .photo-setup-missing .mobile-header {margin-bottom:17px;}
.crab-h5 .photo-setup-missing .photo-setup-body {width:100%;max-width:470px;margin:0 auto;padding:0 0 28px;}
.crab-h5 .photo-setup-missing .photo-setup-panel {
 margin:0;padding:0;border:1.3px solid #443b38;border-radius:17px;
 background:#fffdf7;box-shadow:0 3px 0 #d6c8b1;
}
.crab-h5 .photo-studio {
 position:relative;display:grid;place-items:center;min-width:0;
 height:clamp(176px,50vw,208px);overflow:hidden;cursor:pointer;
 border-bottom:1px solid #7d9da6;border-radius:15px 15px 0 0;
 background:#a9d7ee url('/h5/assets/photo-upload-desk.svg') right center/cover no-repeat;
}
.crab-h5 .photo-print {
 position:relative;display:block;transform:translateX(-15%) rotate(-6deg);
 padding:7px 7px 18px;border:1.35px solid #393138;border-radius:2px;
 background:#fffdf3;box-shadow:3px 4px 0 #47687b3b;
}
.crab-h5 .photo-print::before {
 content:'';position:absolute;z-index:1;top:-7px;left:30%;width:40%;height:14px;
 transform:rotate(3deg);background:#f5d67c;
 clip-path:polygon(1% 4%,99% 0,96% 24%,100% 48%,97% 73%,99% 95%,1% 100%,4% 75%,0 52%,4% 26%);
}
.crab-h5 .photo-setup-missing .photo-print .photo-setup-avatar {
 display:block;width:clamp(104px,30vw,132px);height:auto;aspect-ratio:1;
 border:1px solid #7b7469;border-radius:1px;box-shadow:none;object-fit:cover;
}
.crab-h5 .photo-sheet-copy {min-width:0;padding:24px 24px 20px;}
.crab-h5 .photo-setup-missing .photo-sheet-copy h1 {
 margin:0;font:800 clamp(25px,7.2vw,29px)/1.35 var(--sans);letter-spacing:-.6px;
 text-wrap:balance;overflow-wrap:anywhere;
}
.crab-h5 .photo-setup-missing .photo-setup-description {
 margin:11px 0 22px;color:#6b6265;font:400 14px/1.8 var(--sans);
}
.crab-h5 .photo-setup-description > span {display:block;text-wrap:pretty;}
.crab-h5 .photo-sheet-buttons {
 display:grid;grid-template-columns:minmax(0,1.45fr) minmax(0,1fr);gap:11px;align-items:stretch;
}
.crab-h5 .photo-setup-upload,.crab-h5 .photo-sheet-buttons .onboarding-skip {
 position:relative;display:flex;align-items:center;justify-content:center;
 min-width:0;min-height:48px;margin:0;padding:10px 12px;border-radius:11px;
 text-align:center;overflow-wrap:anywhere;cursor:pointer;
}
.crab-h5 .photo-setup-upload {
 border:1.4px solid #393138;background:var(--coral);box-shadow:0 2px 0 #393138;
 color:var(--ink);font:750 15px/1.55 var(--sans);
}
.crab-h5 .photo-setup-upload:hover {background:#ff715a;}
.crab-h5 .photo-setup-upload:active {transform:translateY(1px);box-shadow:0 1px 0 #393138;}
.crab-h5 .photo-setup-upload input {position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer;}
.crab-h5 .photo-setup-upload:focus-within {outline:3px solid #417cb0;outline-offset:3px;}
.crab-h5 .photo-setup-panel:has(#photo-setup-file:focus-visible) .photo-print {outline:2px solid #417cb0;outline-offset:4px;}
.crab-h5 .photo-sheet-buttons .onboarding-skip {
 border:1px solid #dbd1c2;background:transparent;color:#6b6265;font:500 14px/1.55 var(--sans);
}
.crab-h5 .photo-sheet-buttons .onboarding-skip:hover {background:#f5eedf;}
.crab-h5 .photo-setup-panel:has(#photo-setup-file:disabled) .photo-studio {cursor:default;}
.crab-h5 .photo-setup-upload:has(input:disabled),.crab-h5 .photo-sheet-buttons button:disabled {opacity:.55;cursor:default;}
.crab-h5 .photo-setup-upload input:disabled {cursor:default;}
.crab-h5 .photo-setup-hint {margin:13px 0 0;color:#7b7173;font:400 12px/1.65 var(--sans);overflow-wrap:anywhere;}
.crab-h5 .photo-setup-panel .avatar-status {margin:8px 0 0;font:400 13px/1.7 var(--sans);}
.crab-h5 .photo-setup-panel .avatar-status:empty {display:none;}
/* First-post invitation: compact, left-aligned and free of a decorative scene. */
.crab-h5 .onboarding-publish-dialog {position:fixed;inset:0;width:min(392px,calc(100% - 36px));max-height:calc(100dvh - 40px);margin:auto;padding:26px 24px 24px;overflow:auto;border:1px solid #ded6c9;border-radius:19px;background:#fffefb;color:var(--ink);box-shadow:0 16px 55px #201c2224;}
.crab-h5 .onboarding-publish-dialog:focus {outline:none;}
.crab-h5 .onboarding-publish-dialog::backdrop {background:#302c297a;backdrop-filter:blur(2px);}
.crab-h5 .publish-invite-copy {text-align:left;}
.crab-h5 .publish-invite-copy h2 {margin:0;font:800 25px/1.4 var(--sans);letter-spacing:-.5px;}
.crab-h5 .publish-invite-copy > p:not(.onboarding-error) {margin:10px 0 0;color:#81757a;font:400 14px/1.85 var(--sans);}
.crab-h5 .publish-invite-actions {display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:26px;}
.crab-h5 .publish-invite-actions button {min-width:0;min-height:46px;padding:10px 12px;border:1px solid transparent;border-radius:11px;font:600 14px/1.6 var(--sans);white-space:normal;overflow-wrap:anywhere;cursor:pointer;box-shadow:none;}
.crab-h5 .publish-invite-primary {border-color:#e17d68!important;background:#ff806b;color:#302326;}
.crab-h5 .publish-invite-later {background:#f2eee6;color:#75696f;font-weight:500!important;}
.crab-h5 .publish-invite-later:hover {background:#e9e3d8;}
.crab-h5 .publish-invite-actions button:focus-visible {outline:3px solid #417cb0;outline-offset:3px;}
.crab-h5 .publish-invite-actions button:disabled {opacity:.55;cursor:default;}
@media(max-width:360px) {
 .crab-h5 .onboarding-publish-dialog {width:calc(100% - 28px);padding:24px 20px 20px;}
 .crab-h5 .publish-invite-copy h2 {font-size:23px;}
 .crab-h5 .photo-setup-panel {padding:25px 20px 16px;}
 .crab-h5 .onboarding-photo-page .photo-setup-avatar {width:128px;height:128px;}
}
@media(min-width:768px) {
 .crab-h5 .onboarding-photo-page .photo-setup-body {padding-top:16px;}
 .crab-h5 .onboarding-photo-page .photo-setup-panel {padding:34px 32px 22px;}
}

@media(max-width:360px) {
 .crab-h5 .photo-sheet-copy {padding:21px 18px 18px;}
 .crab-h5 .photo-sheet-buttons {gap:9px;}
}
@media(min-width:768px) {
 .crab-h5 .photo-setup-missing .photo-setup-body {max-width:820px;padding:0;}
 .crab-h5 .photo-setup-missing .photo-setup-panel {display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1fr);padding:0;}
 .crab-h5 .photo-studio {
  height:auto;min-height:260px;border:0;border-right:1px solid #7d9da6;
  border-radius:15px 0 0 15px;background-position:right center;
 }
 .crab-h5 .photo-sheet-copy {align-self:center;padding:28px;}
}