/* v1.11: dark minimal appearance selector for the REAL personality test only. */
.st-appearance-overlay{position:fixed;inset:0;z-index:320;display:flex;align-items:center;justify-content:center;padding:max(18px,env(safe-area-inset-top)) 18px max(18px,env(safe-area-inset-bottom));background:rgba(10,10,10,.56);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);animation:stBackdrop .24s ease-out both}
.st-appearance-overlay .st-appearance-dialog{width:min(520px,100%);max-height:calc(100dvh - 36px - env(safe-area-inset-top) - env(safe-area-inset-bottom));overflow-y:auto;overscroll-behavior:contain;border:1px solid #505050;border-radius:15px;background:#2d2d2d;box-shadow:0 24px 80px rgba(0,0,0,.42),inset 0 1px 0 rgba(255,255,255,.03);padding:12px 14px 16px;color:#f5f5f5;animation:stDialogIn .26s cubic-bezier(.22,1,.36,1) both;outline:none}
.st-appearance-overlay .st-appearance-top{display:flex;align-items:center;justify-content:space-between;font-size:11px;letter-spacing:.04em;color:#c6c6c6}
.st-appearance-overlay .st-appearance-close{border:0;background:transparent;font:22px/1 system-ui;color:#bcbcbc;width:28px;height:28px;display:grid;place-items:center;border-radius:50%;transition:background .18s,color .18s}
.st-appearance-overlay .st-appearance-close:hover{background:rgba(255,255,255,.06);color:#fff}
.st-appearance-overlay .st-appearance-dialog h2{font-family:"Microsoft YaHei","PingFang SC","Noto Sans SC",sans-serif;font-size:19px;line-height:1.35;font-weight:700;text-align:center;color:#f5f5f5;margin:8px 0 2px}
.st-appearance-overlay .st-appearance-dialog>p#st-appearance-description{text-align:center;color:#c6c6c6;font-size:12px;margin:0 0 12px;line-height:1.55}
.st-appearance-overlay .st-appearance-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.st-appearance-overlay .st-appearance-choice{padding:0;min-width:0;text-align:center;overflow:hidden;background:#303030;border:1.25px solid #505050;border-radius:13px;transition:border-color .2s,background .2s,transform .2s;box-shadow:none;color:#f5f5f5}
.st-appearance-overlay .st-appearance-choice:hover{border-color:#6a6a6a;transform:translateY(-1px)}
.st-appearance-overlay .st-appearance-choice.is-selected{border-color:#b78378;box-shadow:0 0 0 1px rgba(183,131,120,.22)}
.st-appearance-overlay .st-choice-photo{display:block;overflow:hidden;aspect-ratio:4/5;background:#393939}
.st-appearance-overlay .st-choice-photo img{height:100%;width:100%;object-fit:cover;object-position:50% 24%}
.st-appearance-overlay .st-appearance-choice:nth-child(1) .st-choice-photo img{object-position:50% 24%}
.st-appearance-overlay .st-appearance-choice:nth-child(2) .st-choice-photo img{object-position:50% 23%}
.st-appearance-overlay .st-choice-caption{min-height:40px;display:flex;gap:5px;align-items:center;justify-content:center;font-size:13px;font-weight:500;background:#303030;color:#f3f3f3}
.st-appearance-overlay .st-choice-check{display:inline-block;color:#74d39b;font:700 12px/1 system-ui;opacity:0;transform:translateY(1px);transition:opacity .18s ease,transform .18s ease}
.st-appearance-overlay .is-selected .st-choice-check{opacity:1;transform:translateY(0)}
.st-appearance-overlay .st-appearance-note{font-size:11px;text-align:center;color:#c6c6c6;line-height:1.55;margin:12px 0 12px}
.st-appearance-overlay .st-appearance-primary{display:block;width:100%;min-height:44px;border:0;border-radius:999px;background:#e8e8e8;color:#292929;font-size:14px;font-weight:600;letter-spacing:.01em;transition:background .2s,transform .2s,color .2s}
.st-appearance-overlay .st-appearance-primary:not(:disabled):hover{background:#f3f3f3;transform:translateY(-1px)}
.st-appearance-overlay .st-appearance-primary:disabled{background:#5b5b5b;color:#aaaaaa;opacity:1}
.st-appearance-overlay .st-appearance-skip{display:block;background:transparent;border:0;color:#bcbcbc;font-size:12px;margin:10px auto 0;padding:6px 11px}
.st-appearance-overlay .st-appearance-skip:hover{color:#f0f0f0}
.st-appearance-overlay .st-appearance-choice:focus-visible,.st-appearance-overlay .st-appearance-primary:focus-visible,.st-appearance-overlay .st-appearance-skip:focus-visible,.st-appearance-overlay .st-appearance-close:focus-visible{outline:2px solid #b78378;outline-offset:2px}
@keyframes stBackdrop{from{opacity:0}to{opacity:1}}
@keyframes stDialogIn{from{opacity:0;transform:translateY(8px) scale(.985)}to{opacity:1;transform:translateY(0) scale(1)}}
@media(max-width:480px){.st-appearance-overlay{padding:10px 12px max(10px,env(safe-area-inset-bottom))}.st-appearance-overlay .st-appearance-dialog{width:100%;max-height:calc(100dvh - 20px - env(safe-area-inset-bottom));padding:10px 12px 14px;border-radius:14px}.st-appearance-overlay .st-appearance-top{font-size:10px}.st-appearance-overlay .st-appearance-dialog h2{font-size:17px;margin-top:6px}.st-appearance-overlay .st-appearance-dialog>p#st-appearance-description{font-size:11px;margin-bottom:10px}.st-appearance-overlay .st-appearance-cards{gap:8px}.st-appearance-overlay .st-choice-photo{aspect-ratio:4/5.1}.st-appearance-overlay .st-choice-caption{min-height:38px;font-size:12px}.st-appearance-overlay .st-appearance-note{margin:10px 0 10px;font-size:10.5px}.st-appearance-overlay .st-appearance-primary{min-height:42px;font-size:13px}.st-appearance-overlay .st-appearance-skip{font-size:11.5px}}
@media(max-height:650px){.st-appearance-overlay .st-appearance-dialog{max-height:calc(100dvh - 22px)}.st-appearance-overlay .st-choice-photo{aspect-ratio:4/4.6}}
@media(prefers-reduced-motion:reduce){.st-appearance-overlay,.st-appearance-overlay .st-appearance-dialog{animation:none!important}.st-appearance-overlay .st-appearance-choice,.st-appearance-overlay .st-appearance-choice:hover,.st-appearance-overlay .st-choice-check,.st-appearance-overlay .st-appearance-primary{transition:none!important;transform:none!important}}

body:has(.st-appearance-overlay){overflow:hidden}
