/* Shared AareDate colours, aligned with the reviewed landing page. */
:root {--ui-bg:#0f141c;--ui-surface:#212121;--ui-raised:#292929;--ui-text:#dfdfdf;--ui-muted:#b5b5b5;--ui-line:#424242;--ui-accent:#26a69a;--ui-blue:#3778b7;--ui-bar:56px;--ui-sidebar-width:280px; color-scheme:dark;}
.ui-eyebrow {font-size:11px;font-weight:750;letter-spacing:.14em;text-transform:uppercase;color:var(--ui-accent);margin:0 0 14px;}
.ui-button {box-sizing:border-box;text-align:center;white-space:normal;height:auto;display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:12px 23px;border:1px solid transparent;border-radius:100px;background:var(--ui-accent);color:#f4f4f4 !important;font:650 15px/1.3 system-ui,sans-serif;text-decoration:none;cursor:pointer;box-shadow:none;}
.ui-button:hover {background:#3eb9ad;}
.ui-button-secondary {background:transparent;color:var(--ui-text) !important;border-color:var(--ui-line);}
.ui-button-secondary:hover {background:var(--ui-raised);}
.ui-button:disabled {opacity:.6;cursor:wait;}
.ui-button-danger {background:#c0392b;}
.ui-button-danger:hover {background:#d64b3c;}
.ui-language {position:relative;font-size:14px;}
.ui-language summary {padding:12px 0;cursor:pointer;}
.ui-language ul {position:absolute;right:0;top:100%;z-index:1100;min-width:170px;list-style:none;background:var(--ui-surface);border:1px solid var(--ui-line);border-radius:12px;padding:8px;margin:4px 0;box-shadow:0 12px 32px #0005;}
.ui-language a {display:block;padding:8px 12px;border-radius:6px;text-decoration:none;color:var(--ui-text);}
.ui-language a:hover,.ui-language a[aria-current] {background:#26a69a20;}
.member-auth :focus-visible,.member-app :focus-visible {outline:2px solid var(--ui-accent) !important;outline-offset:4px;}
.member-app {background:var(--ui-bg);color:var(--ui-text);font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-size:15px;padding-top:var(--ui-bar);min-height:100dvh;height:auto;}
.member-app.front-rand-bg {background-color:var(--ui-bg);background-image:linear-gradient(145deg,#0c0c0cd9 0%,#101214cc 45%,#0e0e0ee6 100%),radial-gradient(circle at 12% 20%,#3581a329 0%,#3581a300 42%),var(--app-bg-image);background-repeat:no-repeat;background-size:cover;background-position:center;background-attachment:fixed;}
@media(max-width:991px) {.member-app.front-rand-bg {background-attachment:scroll;}}
@media(max-width:800px) {.member-app.front-rand-bg {background-image:linear-gradient(145deg,#0c0c0cd9 0%,#101214cc 45%,#0e0e0ee6 100%),var(--app-bg-image-small);}}
html:has(body.member-app) {scroll-behavior:auto;scroll-padding-top:calc(var(--ui-bar) + 16px);}
.member-app {scroll-behavior:auto;}
.member-app #container {display:flow-root;min-width:0;}
.member-app h1, .member-app h2, .member-app h3, .member-app h4, .member-app h5, .member-app .to_sidebar {font-family:inherit;}
.member-app #nav-logged-in {position:fixed;top:0;left:0;width:100%;height:var(--ui-bar);line-height:normal;background:var(--ui-surface);box-shadow:none;border-bottom:1px solid var(--ui-line);z-index:100;}
.member-app #nav-logged-in .nav-wrapper {height:var(--ui-bar);background:var(--ui-surface);padding:0 26px;}
.member-app #nav-logged-in .header_logo img {width:146px;max-height:38px;object-fit:contain;}
.member-app #nav-logged-in .header_home_link>li>a,.member-app #nav-logged-in .header_user>a {color:var(--ui-text);min-height:40px;display:flex;align-items:center;gap:8px;}
.member-app #nav-logged-in .header_home_link {margin-left:32px;}
.member-app #nav-logged-in #notificationbtn {display:flex;align-items:center;gap:8px;position:relative;min-height:44px;height:55px;margin:0 10px;padding:0 10px;border:0;border-radius:0;background:transparent;color:var(--ui-text);font-family:inherit;font-size:15px;font-weight:500;line-height:1.4;cursor:pointer;}
.member-app #nav-logged-in #notificationbtn:hover,.member-app #nav-logged-in #notificationbtn.active {color:var(--ui-accent);box-shadow:inset 0 -2px var(--ui-accent);}
.member-app #nav-logged-in #notificationbtn svg {flex-shrink:0;width:21px;height:21px;margin:0;}
/* Notifications have their own bounded panel, independent of page and navigation styles. */
#notif_dropdown {box-sizing:border-box;display:flex;flex-direction:column;position:fixed;z-index:101;width:min(380px, calc(100vw - 24px));max-height:min(480px, calc(100dvh - 144px));margin:0;padding:0;overflow:hidden;border:1px solid var(--ui-line);border-radius:12px;background:var(--ui-surface);color:var(--ui-text);box-shadow:0 12px 36px #0006;font:400 14px/1.5 system-ui,sans-serif;}
#notif_dropdown[hidden] {display:none;}
#notif_dropdown:focus-visible {outline-offset:-2px;}
#notif_dropdown .ui-notifications-heading {display:flex;align-items:center;justify-content:space-between;gap:12px;flex-shrink:0;padding:6px 8px 6px 16px;border-bottom:1px solid var(--ui-line);}
#notif_dropdown h2 {margin:0;font-size:16px;line-height:1.4;font-weight:600;}
#notif_dropdown [data-close-notifications] {display:flex;align-items:center;justify-content:center;width:44px;height:44px;flex-shrink:0;margin:0;padding:0;border:0;border-radius:8px;background:transparent;color:var(--ui-muted);font-size:24px;cursor:pointer;}
#notif_dropdown [data-close-notifications]:hover {background:var(--ui-raised);color:var(--ui-text);}
#notif_dropdown .dt_notifis_prnt {min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:6px;scrollbar-width:thin;scrollbar-color:var(--ui-muted) var(--ui-surface);}
#notif_dropdown .dt_notifs a {display:flex;align-items:flex-start;gap:12px;min-height:64px;margin:0;padding:12px 10px;border-radius:8px;color:var(--ui-text);text-decoration:none;}
#notif_dropdown .dt_notifs a:hover {background:var(--ui-raised);}
#notif_dropdown .dt_notifs a:focus-visible {outline-offset:-2px;}
#notif_dropdown .dt_notifs.noti_not_seen a {background:#26a69a15;}
#notif_dropdown .avatar {flex:0 0 40px;width:40px;height:40px;overflow:hidden;border-radius:50%;}
#notif_dropdown .avatar img {display:block;width:100%;height:100%;object-fit:cover;}
#notif_dropdown .n_detail {min-width:0;overflow-wrap:anywhere;}
#notif_dropdown .n_detail p {margin:0 0 4px;font-size:14px;line-height:1.5;}
#notif_dropdown .n_detail b {font-weight:650;}
#notif_dropdown .time {color:var(--ui-muted);font-size:12px;line-height:1.4;}
#notif_dropdown .empty_state,#notif_dropdown .ui-notifications-status {margin:0;padding:24px 16px;color:var(--ui-muted);font-size:14px;line-height:1.5;text-align:center;}
#notif_dropdown .empty_state svg {display:block;width:32px;height:32px;margin:0 auto 12px;}
.member-app .header_user>a {border-radius:50%;}
.member-app .to_sidebar {position:fixed;width:var(--ui-sidebar-width);top:var(--ui-bar);bottom:0;left:0;right:auto;padding:10px 0;height:auto;transform:none;z-index:90;background:var(--ui-surface);border-right:1px solid var(--ui-line);box-shadow:none;}
.member-app .to_sidebar .home_usr_sct {border-color:var(--ui-line);}
.member-app .to_sidebar .home_usr_sct h3 a {color:var(--ui-text);}
.member-app .to_sidebar .to_side_menus {height:auto;min-height:100%;display:flex;flex-direction:column;}
/* Same inline padding as the other rows (style.css: 25px, 0 below 676px), or the settings icon sits out of line. */
.member-app .to_sidebar .home_usr_link li.set {margin:16px 0 0;padding:16px 25px 5px;border-color:var(--ui-line);}
@media(max-width:675px) {.member-app .to_sidebar .home_usr_link li.set {padding:16px 0 4px;}}
.member-app .to_main_cont.to_side_present {margin-left:var(--ui-sidebar-width);}
/* Production's own breakpoints: 900px from 1215px up, 1000px from 1500px (style.css). */
.member-app #container>.container {width:min(calc(100% - 64px), 900px);margin:30px auto;}
@media(min-width:1500px) {.member-app #container>.container {width:min(calc(100% - 64px), 1000px);}}
.member-app .to_page_title {margin-bottom:28px;gap:16px;}
.member-app .dt_sett_footer {display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:16px;margin:24px 0 0;padding:20px 0 0;border-top:1px solid var(--ui-line);text-align:right;}
.member-app .to_page_title>.btn {display:inline-flex;align-items:center;justify-content:center;gap:6px;line-height:1.4;}
.member-app .to_page_title>.btn svg {margin:0;flex-shrink:0;}
.member-app .modal:not(.dt_msg_box):not(.to_side_filters) {border-radius:7px;background:var(--ui-surface);color:var(--ui-text);max-width:calc(100vw - 24px);}
.member-app .modal:not(.dt_msg_box) .modal-footer {background:var(--ui-surface);}
/* One look for every menu in the member area. Select dropdowns are excluded: Materialize renders those
   with the same class and they are lists of values, not actions. */
.member-app .dropdown-content:not(.select-dropdown) {min-width:200px;padding:6px;background:var(--ui-raised);border:1px solid var(--ui-line);border-radius:8px;box-shadow:0 14px 42px #0006;}
/* Dividers are list items too: leave them out, or Materialize's 1px rule loses to the row height. */
.member-app .dropdown-content:not(.select-dropdown) li:not(.divider) {min-height:44px;border-radius:6px;}
.member-app .dropdown-content:not(.select-dropdown) li.divider {min-height:0;height:1px;margin:6px 4px;border-radius:0;background:var(--ui-line);}
.member-app .dropdown-content:not(.select-dropdown) li>a,.member-app .dropdown-content:not(.select-dropdown) li>span {display:flex;align-items:center;gap:10px;min-height:44px;padding:10px 12px;font-family:inherit;font-size:14px;line-height:1.4;}
.member-app .dropdown-content:not(.select-dropdown) li>a svg,.member-app .dropdown-content:not(.select-dropdown) li>a img {flex-shrink:0;width:20px;height:20px;margin:0;}
.member-app .dropdown-content:not(.select-dropdown) hr {margin:6px 4px;border:0;border-top:1px solid var(--ui-line);}
/* style.css sizes this one menu for the old light theme (140px wide, 4px radius) from a selector
   specific enough to beat the rule above, so it has to be answered at the same level. */
.member-app .dt_user_info .info .combo.dt_othr_ur_info .dropdown-content {min-width:200px;padding:6px;border-radius:8px;}
.member-app .dropdown-content li>a,.member-app .dropdown-content li>span {color:var(--ui-text);}
.member-app .dropdown-content li:not(.divider):hover {background:#26a69a18;}
.member-app .dt_home_match_user {margin-bottom:20px;}
.member-app .dt_home_match_user .usr_thumb {border-radius:13px;}
.member-app .random_users {gap:18px;}
.member-app .dt_slide_menu {cursor:pointer;display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;padding:0;border:0;background:transparent;color:inherit;border-radius:8px;}
.member-app .dt_slide_menu:hover {background:#ffffff12;}
/* One profile editor; the same navigation is reused by all account screens. */
.ui-settings-heading {display:flex;justify-content:space-between;align-items:center;gap:24px;margin-bottom:30px;}
.ui-settings-heading h1 {font-weight:650;font-size:clamp(27px,3vw,36px);letter-spacing:-.035em;line-height:1.15;margin:0 0 12px;color:var(--ui-text);}
.ui-settings-heading p {color:var(--ui-muted);margin:0;max-width:54ch;}
.ui-settings-grid {display:grid;grid-template-columns:200px minmax(0,1fr);gap:28px;align-items:start;}
.ui-settings-nav {background:var(--ui-surface) !important;border:1px solid var(--ui-line);border-radius:7px;padding:8px;position:sticky;top:calc(var(--ui-bar) + 24px);display:block;height:auto;line-height:1.5;box-shadow:none;color:var(--ui-text);}
.ui-settings-nav ul {display:block;float:none;margin:0;padding:0;list-style:none;background:transparent;}
.ui-settings-nav li {float:none;display:block;background:transparent;}
.ui-settings-nav li a {display:flex;align-items:center;min-height:44px;padding:11px 10px;border-radius:10px;color:var(--ui-muted);word-break:normal;overflow-wrap:normal;font-size:14px;line-height:1.4;}
.ui-settings-nav li.active>a {color:var(--ui-accent);background:#26a69a16;font-weight:650;}
.ui-settings-nav li a:hover {background:var(--ui-raised);color:var(--ui-text);}
.ui-settings-nav .ui-nav-group {font-size:10px;font-weight:750;letter-spacing:.12em;text-transform:uppercase;color:#8b8b8b;padding:24px 14px 8px;}
.ui-settings-nav .ui-nav-group:first-child {padding-top:4px;}
.ui-settings-nav .ui-danger {color:#ffaeaa;}
.ui-profile-summary {display:flex;align-items:center;gap:20px;padding:22px 26px;margin-bottom:24px;border:1px solid var(--ui-line);border-radius:7px;background:var(--ui-surface);}
.ui-profile-summary img {width:72px;height:72px;object-fit:cover;border-radius:50%;}
.ui-profile-summary h2 {font-size:19px;margin:0 0 6px;}
.ui-profile-summary a {color:var(--ui-accent);font-size:14px;}
.ui-card {container-type:inline-size;background:var(--ui-surface);border:1px solid var(--ui-line);border-radius:7px;padding:28px;margin:0 0 20px;scroll-margin-top:calc(var(--ui-bar) + 24px);}
.ui-card h2 {font-size:21px;line-height:1.3;letter-spacing:-.015em;margin:0 0 10px;font-weight:650;}
.ui-card>p,.ui-section-hint {color:var(--ui-muted);margin:0 0 24px;font-size:14px;line-height:1.6;}
.ui-fields {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;}
.ui-field {min-width:0;}
.ui-field-wide {grid-column:1/-1;}
.ui-field label {display:block;position:static;transform:none;font-size:14px;line-height:1.4;font-weight:550;color:var(--ui-text);margin-bottom:9px;}
.ui-required {margin-inline-start:.25em;color:var(--ui-accent);font-weight:650;}
.ui-required[hidden] {display:none !important;}
.ui-card .ui-required-hint,.ui-required-hint {color:var(--ui-muted);font-size:13px;line-height:1.5;margin:0 0 20px;}
.ui-otp-label {display:block;color:var(--ui-text);font-size:14px;line-height:1.4;margin:16px 0 8px;}
.ui-field input:not([type=hidden]),.ui-field select.browser-default,.ui-field textarea {display:block;box-sizing:border-box;width:100%;max-width:100%;font-family:inherit;font-size:16px;color:var(--ui-text);background:var(--ui-bg);border:1px solid var(--ui-line);border-radius:10px;box-shadow:none;min-height:49px;height:auto;margin:0;padding:12px 14px;}
.ui-field textarea {min-height:128px;resize:vertical;line-height:1.6;}
.ui-field input:focus,.ui-field select:focus,.ui-field textarea:focus {border-color:var(--ui-accent) !important;box-shadow:none !important;}
/* Keep keyboard focus inside the control so it cannot be clipped by a card or scroller. */
.member-app .ui-field input:focus-visible,.member-app .ui-field select:focus-visible,.member-app .ui-field textarea:focus-visible {outline-offset:-2px;}
.ui-birthday-parts {display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.35fr) minmax(0,1.1fr);gap:8px;}
.ui-birthday-parts>div {min-width:0;}
.ui-field .ui-birthday-parts label {font-size:12px;color:var(--ui-muted);margin-bottom:6px;}
.ui-field .ui-birthday-parts select {padding-inline:10px;}
.ui-field small {display:block;color:var(--ui-muted);font-size:12px;line-height:1.6;margin-top:8px;}
.ui-optional>summary {font-size:18px;font-weight:600;cursor:pointer;padding:4px 0;}
.ui-optional>summary small {display:block;font-weight:400;font-size:12px;color:var(--ui-muted);margin:8px 0 0 18px;}
.ui-optional[open]>summary {margin-bottom:24px;}
.ui-savebar {position:sticky;top:calc(var(--ui-bar) + 16px);bottom:auto;z-index:5;background:#296185;border:1px solid #ffffff;border-radius:7px;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 18px;margin:0 0 20px;box-shadow:0 4px 12px #0002;}
.ui-form-status {font-size:13px;color:var(--ui-muted);line-height:1.5;}
.ui-form-status.is-error {color:#ffaeaa;}
.ui-form-status.is-saved {color:#72d6c9;}
.ui-form-status[hidden] {display:none;}
.ui-savebar>.ui-form-status {color:#fff;}
.ui-account-actions {display:flex;gap:12px;flex-wrap:wrap;margin-top:24px;}
/* Onboarding panels grow with their content, including wrapped mobile labels. */
.member-app.steps-page #container>.container {max-width:760px;}
.member-app.steps-page #container {margin-left:0;}
.ui-onboarding-heading {text-align:center;margin:38px 0 28px;}
.ui-onboarding-heading h1 {font-size:clamp(27px,3vw,37px);letter-spacing:-.03em;line-height:1.15;margin:0 0 14px;}
.ui-onboarding-heading p {color:var(--ui-muted);margin:0 auto;max-width:48ch;}
.member-app .dt_signup_steps {box-shadow:none;}
.member-app .to_step_innr {background:var(--ui-surface);border:1px solid var(--ui-line);border-radius:7px;padding:24px;}
.member-app .slider-ctr {width:100%;height:auto;min-height:0;overflow:visible;}
.member-app .slider-ctr .slider {width:100%;height:auto;min-height:0;overflow:visible;transform:none !important;}
.member-app .slider-form {position:static;float:none;width:100%;height:auto;padding:8px 0;display:none;transform:none !important;opacity:1 !important;visibility:visible !important;}
.member-app .slider-zero-active #verification_on_signup,.member-app .slider-one-active #profile_image_upload,.member-app .slider-two-active .slider-two,.member-app .slider-three-active .slider-three {display:block;}
.member-app .slider_container .line {max-width:420px;margin:0 auto;}
.member-app .slider_container .steps {display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.5fr) minmax(0,1fr);gap:8px;max-width:600px;height:auto;margin:14px auto 28px;font-size:14px;}
.member-app .slider_container .steps>div {position:static;height:auto;transform:none;clip:auto;font-size:inherit;line-height:1.4;overflow-wrap:anywhere;}
.member-app .slider-form .step_footer {position:static;height:auto;margin:24px 0 0;padding:20px 0 0;border-top:1px solid var(--ui-line);text-align:right;}
.member-app .slider-form .step_footer .btn {height:auto;min-height:48px;max-width:100%;white-space:normal;line-height:1.4;padding:14px 25px;}
.member-app .choose_photo {margin-top:0;}
.member-app .choose_photo>p:last-of-type {margin:20px 0 0;}
.member-app .dt_selct_avatar {cursor:pointer;}
.ui-photo-title {font-size:23px;line-height:1.25;margin:6px 0 12px;}
.ui-photo-hint {color:var(--ui-muted);max-width:44ch;margin:0 auto 24px;}
.member-app .slider-two .ui-fields {text-align:left;}
.member-app .slider-two .ui-optional {text-align:left;margin:24px 0 0;background:var(--ui-bg);padding:18px;}
.member-app .slider-three #otp_check_email {font-size:26px;letter-spacing:.35em;max-width:100%;text-align:center;}
.member-app .to_sidebar_mini {display:none;}
@media(min-width:992px) {.member-app.side_open {overflow-y:auto !important;} .member-app .sidenav_overlay {display:none !important;} .member-app.side_open .to_main_cont.to_side_present {margin-left:0;} .member-app.side_open .to_sidebar {transform:translateX(-100%);}}
@media(max-width:1199px) {.ui-settings-grid {grid-template-columns:176px minmax(0,1fr);gap:24px;} .member-app #container>.container {width:calc(100% - 40px);} .ui-card {padding:24px;}}
@media(max-width:991px) {
 .member-app #nav-logged-in .nav-wrapper {padding-inline:16px;}
 .member-app #nav-logged-in .nav-wrapper>.valign-wrapper {flex:1 1 auto;}
 .member-app #nav-logged-in .header_home_link {margin-left:auto;}
 .member-app .to_sidebar {width:var(--ui-sidebar-width);max-width:calc(100vw - 36px);bottom:0;height:auto;transform:translateX(-100%);z-index:90;}
 .member-app.side_open .to_sidebar {transform:translateX(0);box-shadow:24px 0 60px #0008;}
 .member-app .sidenav_overlay {display:block;top:var(--ui-bar);bottom:0;height:auto;z-index:80;}
 .member-app.side_open .sidenav_overlay {display:block;visibility:visible;opacity:1;}
 .member-app .to_main_cont.to_side_present {margin-left:0;}
 .member-app .ui-savebar {top:calc(var(--ui-bar) + 12px);bottom:auto;}
 .ui-settings-grid {grid-template-columns:190px minmax(0,1fr);}
}
/* Icon-only header from style.css's 860px breakpoint: the bell is a <button>, which style.css's
   "nav .header_home_link li a" rule does not reach, so 801-860px showed Chat as an icon but the bell with its label. */
@media(max-width:860px) {
 .member-app #nav-logged-in .header_home_link>li>a {font-size:0;gap:0;padding-inline:12px;}
 .member-app #nav-logged-in .header_home_link>li>a svg {width:23px;height:23px;margin:0;}
 .member-app #nav-logged-in #notificationbtn {font-size:0;gap:0;padding-inline:12px;}
 .member-app #nav-logged-in #notificationbtn svg {width:23px;height:23px;}
}
@media(max-width:800px) {
 .member-app #container>.container {width:calc(100% - 32px);margin:24px auto;}
 .member-app #nav-logged-in .header_logo img {width:124px;}
 .member-app #nav-logged-in .header_user>a {padding:0;margin-right:4px;}
 .member-app .to_page_title {margin-bottom:24px;}
 /* A 28px control is production's desktop size; on a phone it has to stay tappable. */
 .member-app .to_page_title>.btn {min-height:40px;height:auto;padding:9px 14px;}
 .ui-settings-heading {display:block;margin-bottom:20px;}
 .ui-settings-heading .ui-eyebrow {display:none;}
 .ui-settings-heading p {font-size:14px;line-height:1.5;}
 .ui-settings-heading>.ui-button {margin-top:14px;min-height:38px;padding:9px 16px;font-size:14px;}
 .ui-settings-grid {display:block;}
 .ui-settings-nav {background:transparent !important;border:0;border-radius:0;padding:0;position:static;margin-bottom:20px;overflow-x:auto;overscroll-behavior-inline:contain;scrollbar-width:thin;}

 .ui-settings-nav ul {display:flex;width:max-content;gap:6px;padding-bottom:8px;}
 .ui-settings-nav li {flex:0 0 auto;}
 .ui-settings-nav .ui-nav-group {display:none;}
 .ui-settings-nav li a {border:1px solid var(--ui-line);border-radius:100px;min-height:42px;padding:10px 15px;background:var(--ui-surface);}
 .ui-settings-nav li.active>a {border-color:#26a69a70;}
 .ui-card {padding:22px 18px;border-radius:7px;}
 .ui-fields {gap:20px;grid-template-columns:1fr;}
 .ui-profile-summary {padding:16px;gap:16px;}
 .ui-profile-summary img {width:56px;height:56px;}
 .ui-profile-summary h2 {font-size:18px;}
 .ui-savebar {padding:10px 12px;gap:12px;border-radius:7px;}
 .ui-savebar .ui-button {padding:11px 18px;flex-shrink:0;font-size:14px;}
 .ui-savebar .ui-form-status {font-size:12px;}
 .member-app .modal:not(.dt_msg_box):not(.to_side_filters) {width:calc(100vw - 24px);max-height:calc(100dvh - 40px);}
 .member-app .to_step_innr {padding:20px 16px;}
 .member-app .slider-form .row .col {width:100%;}
 .member-app .wow_creads_minstp {margin:0 0 24px;}
 .member-app .slider_container .steps {font-size:12px;}
 .member-app .slider-form .step_footer .btn {width:100%;}
}
@media(max-width:675px) {
 .member-app {padding-bottom:calc(58px + env(safe-area-inset-bottom));}
 .member-app #nav-logged-in .dt_slide_menu {display:none;}
 .member-app .to_sidebar_mini {display:block;position:fixed;bottom:0;left:0;right:0;width:100%;height:calc(58px + env(safe-area-inset-bottom));padding-bottom:env(safe-area-inset-bottom);background:#1d1d27;z-index:100;}
 .member-app #mobile-aare-menu {height:58px;}
 .member-app .menu__border {bottom:calc(54px + env(safe-area-inset-bottom));}
 .member-app.steps-page .to_sidebar_mini {display:none;}
 .member-app .to_sidebar {width:100%;max-width:none;left:0;right:0;border-right:0;bottom:calc(58px + env(safe-area-inset-bottom));transform:translateY(calc(100% + 60px));}
 .member-app.side_open .to_sidebar {transform:translate(0);box-shadow:none;}
 .member-app .sidenav_overlay {bottom:calc(58px + env(safe-area-inset-bottom));}
}
@media(prefers-reduced-motion:reduce) {.member-app * {scroll-behavior:auto !important;transition:none !important;} .member-app .menu__item.active .icon {animation:none;}}

.member-app .to_main_cont {transition:none;}
@container (max-width:500px) {.ui-fields {grid-template-columns:1fr;}}
.member-app .dt_user_profile {font-family:inherit;background:var(--ui-surface);border:1px solid var(--ui-line);box-shadow:none;border-radius:7px;padding:20px;}
.member-app .to_user_media .avatar {border-radius:13px;overflow:hidden;}
.member-app .dt_cp_photos_list {scroll-margin-top:90px;}
.member-app .to_small_usr {font-family:inherit;border-radius:8px;box-shadow:none;}
.member-app .to_small_usr .card-image {background-color:var(--ui-raised);}
.member-app .to_small_usr .card-content {padding:30px 10px 10px;background:linear-gradient(180deg,#0000 0%,#00000080 100%);}
.member-app .to_small_usr .card-content-info h3 {font-size:21px;font-weight:400;}
.member-app .to_small_usr .to_small_not {width:34px;min-width:34px;height:34px;backdrop-filter:none;}
.member-app .to_small_usr .to_small_yes {width:38px;min-width:38px;height:38px;backdrop-filter:none;}
@media(max-width:800px) {
 .member-app .dt_home_match_user {padding-top:4px;padding-bottom:0;max-width:370px;}
 .member-app .dt_home_match_user .mtc_usr_details {height:calc(clamp(300px,52dvh,430px) + 104px);}
 .member-app .match_usr_img_slidr .carousel-cell {height:clamp(300px,52dvh,430px);}
 .member-app .dt_user_profile {padding:20px 16px;}
}
/* Two per row only below 601px, which is where the markup's own s6/m4 columns switch as well. */
@media(max-width:600px) {
 .member-app #random_users_container>.random_user_item {width:50%;padding-inline:6px;}
 .member-app #random_users_container {margin-inline:-6px;}
 .member-app .to_small_usr {border-radius:8px;margin-bottom:12px;}
 .member-app .to_small_usr .card-image {padding-bottom:130%;}
 .member-app .to_small_usr .card-content {padding:30px 10px 48px;}
 .member-app .to_small_usr .card-content-info h3 {font-size:17px;}
 .member-app .to_small_usr .card-content-info>div {font-size:11px;line-height:1.35;}
 .member-app .to_small_usr .to_small_yes {position:absolute;bottom:9px;right:9px;}
}

.member-app .ui-card .blocked_users {margin:0 !important;}
.member-app .ui-card .info_select_radio_btn {margin:0 0 30px;}
.member-app .info_select_radio_btn .to_mat_input_switch {padding:16px 0;border-color:var(--ui-line);}
.member-app .ui-card .switch label .lever {margin:0 0 0 auto;background:#565656;}
.member-app .ui-card .switch label input[type=checkbox]:checked+.lever {background:var(--ui-accent);}
.member-app .ui-card .switch label .lever:after {background:#fff;}
.member-app .to_mat_input_switch .lever {flex-shrink:0;}

.member-app .ui-option-hint {display:block;margin-top:10px;font-size:12px;line-height:1.5;color:var(--ui-muted);}

.member-app .ui-settings-options>.switch:last-child {border-bottom:0;}

.member-app .dt_sett_footer .ui-form-status {flex:1 1 180px;text-align:left;}
.ui-field input,.ui-field select,.ui-field textarea {scroll-margin-block:180px 110px;}

/* Keep the settings shell steady as only its selected page/panel changes. */
html:has(body.member-app) {scrollbar-gutter:stable;}
.ui-settings-nav li a,.ui-settings-nav li.active>a {font-weight:550;}
.ui-settings [data-settings-pane][hidden],.ui-autosave-status [hidden] {display:none !important;}
.ui-autosave-status {display:flex;align-items:center;flex-wrap:wrap;gap:12px;min-height:48px;margin-top:24px;padding-top:18px;border-top:1px solid var(--ui-line);}
.ui-autosave-status .ui-form-status {flex:1 1 180px;}
.ui-autosave-status .ui-button {font-size:14px;min-height:40px;padding:8px 16px;}
/* Keep the settings shell stable while only the selected panel is loading. */
[data-settings-content][aria-busy="true"] {cursor:progress;}
.ui-settings-load-error {display:flex;align-items:center;flex-wrap:wrap;gap:14px;margin-bottom:20px;padding:16px;border:1px solid var(--ui-line);border-radius:12px;}
.member-app .ui-session {display:flex;align-items:center;justify-content:space-between;gap:20px;padding:22px 0;border-bottom:1px solid var(--ui-line);}
.member-app .ui-session:last-child {border-bottom:0;}
.member-app .ui-session h3 {margin:0 0 7px;font-size:17px;line-height:1.4;font-weight:650;}
.member-app .ui-session p {margin:3px 0;color:var(--ui-muted);font-size:14px;line-height:1.5;}
.ui-session-current {flex-shrink:0;padding:7px 12px;border-radius:20px;background:#26a69a20;color:#63cec2;font-size:13px;}
.member-app .ui-session .ui-button {flex-shrink:0;}
/* Native controls, roomy touch targets and a scrollable body with visible actions. */
.member-app #filtr_slide_out.ui-match-filters {box-sizing:border-box;position:fixed;inset:6vh 0 auto !important;width:min(560px,calc(100% - 32px));min-width:0;height:auto;min-height:0;max-height:88vh;max-height:88dvh;margin:0 auto;border:1px solid var(--ui-line);border-radius:7px;background:var(--ui-surface) !important;color:var(--ui-text);overflow:hidden;pointer-events:auto;box-shadow:0 24px 80px #0008;}
.ui-match-filters .ui-filter-header {flex-shrink:0;display:flex;align-items:center;justify-content:space-between;gap:18px;padding:22px 24px 14px;}
.ui-match-filters h2 {font-size:23px;line-height:1.25;font-weight:650;letter-spacing:-.025em;margin:0;}
.ui-filter-close {display:grid;place-items:center;flex-shrink:0;width:44px;height:44px;background:transparent;color:var(--ui-text);font:28px/1 system-ui;border:1px solid var(--ui-line);border-radius:50%;cursor:pointer;}
.ui-filter-close:hover {background:var(--ui-raised);}
.ui-match-filters form {display:flex;flex-direction:column;min-height:0;margin:0;}
.member-app #filtr_slide_out.ui-match-filters[data-filter-open] {display:flex !important;flex-direction:column;}
.ui-filter-body {flex:1 1 auto;min-height:0;padding:0 24px 22px;overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:stable;}
.ui-match-filters .ui-hint {font-size:13px;line-height:1.55;color:var(--ui-muted);margin:8px 0 16px;}
.ui-match-filters label,.ui-match-filters legend {display:block;color:var(--ui-text);font-size:14px;font-weight:550;line-height:1.5;}
.ui-filter-group {margin:24px 0 8px;padding:0;border:0;min-width:0;}
.ui-filter-group legend {margin-bottom:10px;}
.ui-filter-genders {display:flex;gap:8px;flex-wrap:wrap;}
.ui-filter-genders label {position:relative;cursor:pointer;}
.ui-filter-genders input[type=checkbox] {position:absolute;opacity:0;pointer-events:none;}
.ui-match-filters .ui-filter-genders input+span {display:flex;align-items:center;justify-content:center;height:auto;min-height:46px;padding:10px 18px;border:1px solid var(--ui-line);border-radius:24px;font:500 14px/1.4 system-ui;}
.ui-match-filters .ui-filter-genders input+span:before,.ui-match-filters .ui-filter-genders input+span:after {display:none;}
.ui-filter-genders input:checked+span {background:#26a69a25;border-color:var(--ui-accent);color:#79dfd4;}
.ui-filter-genders input:focus-visible+span {outline:2px solid var(--ui-accent);outline-offset:3px;}
.ui-filter-ages {display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:22px;}
.ui-match-filters select.browser-default,.ui-match-filters input[type=number] {box-sizing:border-box;width:100%;height:48px;min-height:48px;margin:8px 0 0;padding:10px 12px;border:1px solid var(--ui-line);border-radius:10px;background:var(--ui-bg);color:var(--ui-text);font:400 16px/1.4 system-ui;box-shadow:none;}
.ui-filter-distance {margin-top:24px;}
.ui-filter-distance-heading {display:flex;align-items:center;justify-content:space-between;gap:16px;}
.ui-match-filters #filter-radius-number {width:90px;margin:0;}
.ui-filter-distance-heading label span {color:var(--ui-muted);}
.ui-match-filters #_located {appearance:none;-webkit-appearance:none;box-sizing:border-box;display:block;width:100%;height:48px;min-height:48px;margin:6px 0 0;padding:0;border:0;background:transparent;cursor:pointer;touch-action:pan-y;}
.ui-match-filters #_located::-webkit-slider-runnable-track {height:6px;border:0;border-radius:6px;background:linear-gradient(to right,var(--ui-accent) var(--range-progress,33%),var(--ui-line) var(--range-progress,33%));}
.ui-match-filters #_located::-webkit-slider-thumb {appearance:none;-webkit-appearance:none;width:28px;height:28px;margin-top:-11px;border:3px solid var(--ui-surface);border-radius:50%;background:#63cec2;box-shadow:0 0 0 1px var(--ui-accent);}
.ui-match-filters #_located::-moz-range-track {height:6px;border:0;border-radius:6px;background:var(--ui-line);}
.ui-match-filters #_located::-moz-range-progress {height:6px;border-radius:6px;background:var(--ui-accent);}
.ui-match-filters #_located::-moz-range-thumb {width:22px;height:22px;border:3px solid var(--ui-surface);border-radius:50%;background:#63cec2;box-shadow:0 0 0 1px var(--ui-accent);}
.ui-match-filters #_located:disabled,.ui-match-filters input:disabled {opacity:.45;cursor:not-allowed;}
.ui-match-filters .thumb {display:none;}
.ui-filter-range-limits {display:flex;justify-content:space-between;color:var(--ui-muted);font-size:12px;}
.ui-match-filters .to_side_filters_innrlist {display:block;margin:20px 0 0;padding:0;}
.ui-match-filters .to_side_filters_innrlist h5 {width:auto;min-width:0;max-width:none;margin:0;}
.ui-match-filters .to_side_filters_innrlist>div {width:auto;min-width:0;margin:0;}
.ui-filter-actions {flex-shrink:0;display:flex;justify-content:space-between;gap:12px;padding:16px 24px max(16px,env(safe-area-inset-bottom));border-top:1px solid var(--ui-line);background:var(--ui-surface);}
.ui-filter-actions .ui-button {min-height:48px;padding-inline:20px;}
@media(max-width:600px) {
 .member-app .ui-session {align-items:flex-start;flex-wrap:wrap;gap:12px;}
 .member-app #filtr_slide_out.ui-match-filters {inset:auto 0 0 !important;width:100%;max-height:92vh;max-height:92dvh;border-radius:7px 7px 0 0;border-bottom:0;}
 .ui-match-filters .ui-filter-header {padding:16px 20px 12px;}
 .ui-match-filters h2 {font-size:21px;}
 .ui-filter-body {padding-inline:20px;}
 .ui-filter-actions {padding-inline:20px;}
 .ui-filter-actions .ui-button {flex:1;font-size:14px;padding-inline:12px;}
}

.member-app .ui-settings-nav li.active>a {color:var(--ui-accent) !important;background:#26a69a16 !important;}

/* Interest picker: a searchable cloud of pills. The box is visually hidden, the pill shows the state. */
.ui-interest-picker {margin:22px 0 0;padding:0;border:0;min-width:0;}
.ui-interest-picker legend {padding:0;margin:0 0 8px;color:var(--ui-text);font-size:14px;font-weight:550;line-height:1.5;}
.ui-interest-search {box-sizing:border-box;width:100%;height:44px;margin:0 0 10px;padding:10px 12px;border:1px solid var(--ui-line);border-radius:10px;background:var(--ui-bg);color:var(--ui-text);font:inherit;font-size:16px;}
.ui-interest-search:focus {border-color:var(--ui-accent);outline:none;}
.ui-interest-options {display:flex;flex-wrap:wrap;gap:8px;max-height:176px;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;touch-action:pan-y;padding:6px;scrollbar-gutter:stable;scrollbar-width:auto;scrollbar-color:var(--ui-muted) var(--ui-bg);border:1px solid var(--ui-line);border-radius:10px;background:var(--ui-bg);}
.ui-interest-options::-webkit-scrollbar {width:10px;}
.ui-interest-options::-webkit-scrollbar-track {background:var(--ui-bg);border-radius:10px;}
.ui-interest-options::-webkit-scrollbar-thumb {background:var(--ui-muted);border:2px solid var(--ui-bg);border-radius:10px;}
.ui-interest-options:focus-visible {outline-offset:-2px;}
/* The visible track is independent of auto-hiding OS and mobile scrollbars. */
.ui-interest-scroller {position:relative;padding-right:24px;}
.ui-interest-scroller .ui-interest-options {scrollbar-width:none;scrollbar-gutter:auto;}
.ui-interest-scroller .ui-interest-options::-webkit-scrollbar {display:none;width:0;}
.ui-interest-scrollbar {position:absolute;top:2px;right:0;bottom:2px;width:20px;border-radius:10px;cursor:pointer;touch-action:none;user-select:none;}
.ui-interest-scrollbar::before {content:'';position:absolute;inset:0 5px;border-radius:10px;background:var(--ui-line);}
.ui-interest-scrollbar>span {position:absolute;top:0;left:3px;right:3px;min-height:32px;border-radius:10px;background:var(--ui-accent);}
.ui-interest-scrollbar:hover>span,.ui-interest-scrollbar:focus-visible>span {background:#79dfd4;}
.ui-interest-scrollbar[hidden] {display:none;}
/* position:relative keeps the visually hidden checkbox inside its pill. Without it the absolutely positioned
   boxes escaped the scrolling cloud and stretched the filter panel and the Interessen page by ~2000px of blank space. */
.ui-interest-options {position:relative;}
.ui-interest-picker .ui-interest-option {position:relative;display:inline-flex;max-width:100%;margin:0;cursor:pointer;}
.ui-interest-option[hidden] {display:none;}
.ui-interest-picker .ui-interest-option input[type=checkbox] {position:absolute;inset:0;width:1px;height:1px;min-height:0;margin:0;padding:0;border:0;clip-path:inset(50%);opacity:0;pointer-events:none;scroll-margin:0;}
/* Materialize draws its own checkbox on span::before and pads the span for it - both have to go. */
.ui-interest-picker .ui-interest-option input+span {display:inline-flex;align-items:center;max-width:100%;height:auto;min-height:36px;padding:6px 13px;border:1px solid var(--ui-line);border-radius:100px;background:var(--ui-surface);color:var(--ui-muted);font:500 14px/1.3 system-ui,sans-serif;white-space:normal;overflow-wrap:anywhere;}
.ui-interest-picker .ui-interest-option input+span:before,.ui-interest-picker .ui-interest-option input+span:after {display:none;}
.ui-interest-picker .ui-interest-option:hover input+span {color:var(--ui-text);border-color:#5a5a5a;}
.ui-interest-picker .ui-interest-option input:checked+span {background:#26a69a26;border-color:var(--ui-accent);color:#79dfd4;}
.ui-interest-picker .ui-interest-option input:focus-visible+span {outline:2px solid var(--ui-accent);outline-offset:2px;}

/* Interessen page */
.ui-interests-intro {margin:-14px 0 20px;color:var(--ui-muted);font-size:14px;line-height:1.5;}
.ui-interests-controls {padding:20px;}
.ui-interests-controls .ui-interest-picker {margin-top:0;}
/* The picker is this page's main control, so it gets real height (the search panel keeps its compact 176px). */
.ui-interests-controls .ui-interest-options {max-height:min(46vh,360px);}
.ui-interests-friendship {display:flex;align-items:center;gap:10px;margin:16px 0 0;cursor:pointer;color:var(--ui-text);font-size:14px;line-height:1.4;}
.ui-interests-friendship input[type=checkbox] {position:static;flex:0 0 auto;opacity:1;pointer-events:auto;width:18px;height:18px;margin:0;accent-color:var(--ui-accent);}
/* Same specificity as Materialize's [type=checkbox]+span:not(.lever), which adds a 35px gap for its own box. */
.ui-interests-friendship input[type=checkbox]+span {padding:0;height:auto;line-height:1.4;font-size:14px;color:var(--ui-text);}
.ui-interests-friendship input[type=checkbox]+span:before,.ui-interests-friendship input[type=checkbox]+span:after {display:none;}
@media(max-width:600px) {
 .ui-interests-controls {padding:16px 14px;}
 .ui-interests-controls .ui-interest-options {max-height:40vh;max-height:40dvh;}
}
.ui-interests-note {margin:8px 0 22px;padding:16px 18px;border:1px dashed var(--ui-line);border-radius:7px;color:var(--ui-muted);font-size:14px;line-height:1.5;text-align:center;}
.ui-interests-note[hidden] {display:none;}
.ui-interests-locked p {margin:0 0 10px;}
.ui-interests-locked .ui-button {margin-top:8px;}
#interests_results[aria-busy=true] {opacity:.55;transition:opacity .15s;}
#btn_load_more_interests[hidden] {display:none;}
/* Cards differ in height (tag count), so floated columns snagged on a taller card and started the next row
   in the second column. A wrapping flex row keeps the grid and makes each row's cards equally tall. */
#interests_results {display:flex;flex-wrap:wrap;}
#interests_results::before,#interests_results::after {display:none;}
#interests_results>.ui-interest-member {float:none;display:flex;}
.member-app .ui-interest-card {display:flex;flex-direction:column;width:100%;}
.ui-interest-card-tags {flex:1;padding:10px 10px 12px;background:var(--ui-surface);}
.ui-interest-shared {margin:0 0 8px;color:var(--ui-accent);font-size:12px;font-weight:650;letter-spacing:.01em;}
.ui-interest-card-tags ul {display:flex;flex-wrap:wrap;gap:5px;margin:0;padding:0;list-style:none;}
.ui-interest-card-tags li {padding:3px 9px;border:1px solid var(--ui-line);border-radius:100px;color:var(--ui-muted);font-size:12px;line-height:1.4;}
.ui-interest-card-tags li.is-shared {border-color:var(--ui-accent);background:#26a69a26;color:#79dfd4;font-weight:600;}
/* Offscreen navigation must also leave the focus order and full-page layout. */
@media(max-width:991px) {.member-app:not(.side_open) .to_sidebar {visibility:hidden;pointer-events:none;}}
@media(min-width:992px) {.member-app.side_open .to_sidebar {visibility:hidden;pointer-events:none;}}

/* Exhausted lists must not leave a clickable or auto-loading action behind. */
.member-app .load_more[hidden] {display:none !important;}
/* Settings > Verification: the camera and the taken selfie share one frame. */
.ui-selfie-frame {max-width:420px;aspect-ratio:4/3;border-radius:10px;overflow:hidden;background:#000;margin:0 0 16px;}
.ui-selfie [hidden] {display:none !important;}
.ui-selfie-frame video,.ui-selfie-frame img {width:100%;height:100%;object-fit:cover;display:block;transform:scaleX(-1);}
.ui-selfie-frame img {transform:none;}
.ui-verification-state {padding:12px 16px;border-radius:8px;background:var(--ui-raised);color:var(--ui-text);}
.ui-verification-state.is-approved {border-left:4px solid #2196f3;}
.ui-verification-state.is-rejected {border-left:4px solid #e18805;}
.usr_verified_badge {display:inline-flex;vertical-align:middle;}
/* Own profile: changing the photo order. */
.ui-photo-order-bar {display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin:0 0 12px;}
[data-photo-order].is-ordering [data-photo-id] {position:relative;cursor:grab;touch-action:none;user-select:none;}
[data-photo-order].is-ordering img {-webkit-user-drag:none;pointer-events:none;}
[data-photo-order].is-ordering [data-photo-id].is-dragging {opacity:.6;cursor:grabbing;}
[data-photo-order].is-ordering .dt_cp_bar_add_photos {display:none;}
.ui-photo-move {position:absolute;bottom:6px;width:36px;height:36px;border:0;border-radius:50%;background:#000a;color:#fff;font-size:22px;line-height:1;cursor:pointer;z-index:2;}
.ui-photo-move-earlier {left:6px;}
.ui-photo-move-later {right:6px;}
[data-photo-order]:not(.is-ordering) .ui-photo-move {display:none;}
/* Find matches: asks members without sexuality / "looking for" to complete their profile. */
.member-app .ui-match-profile-notice {display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;margin:0 0 16px;padding:14px 16px;}
.member-app .ui-match-profile-notice p {margin:0;flex:1 1 240px;}
