/* Platform and phone layout. Preserve text selection, zoom and desktop structure. */
.admin-menu-toggle,
.admin-mobile-actions,
.mobile-action-label,
.mobile-nav-report,
.bank-edit-label {
  display: none;
}
.admin-sidebar-head {
  margin-bottom: 28px;
  min-width: 0;
}
.admin-sidebar-head .brand {
  margin-bottom: 0;
}
.bank-edit-field {
  min-width: 0;
  display: grid;
  gap: 7px;
}
button,
.btn,
.icon-btn,
.filter,
.nav a,
.admin-nav a {
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}
.btn,
.icon-btn,
.filter,
.nav a,
.admin-nav a {
  -webkit-user-select: none;
  user-select: none;
}
@media (pointer: coarse) {
  input:not([type="checkbox"]):not([type="radio"]):not([type="color"]),
  textarea,
  select {
    font-size: 16px !important;
  }
  .icon-btn {
    min-width: 44px;
    min-height: 44px;
  }
}
@media (max-width: 850px) {
  .admin-shell {
    min-height: 100dvh;
  }
  .admin-sidebar {
    position: sticky;
    top: 0;
    z-index: 45;
    display: block;
    padding: calc(12px + env(safe-area-inset-top, 0px))
      max(16px, env(safe-area-inset-right, 0px)) 12px
      max(16px, env(safe-area-inset-left, 0px));
    height: auto;
    background: #fff;
  }
  .admin-sidebar-head {
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
  }
  .admin-sidebar-head .brand {
    padding: 0;
    max-width: calc(100% - 96px);
  }
  .admin-sidebar .brand-name {
    max-width: 100%;
    font-size: 24px;
  }
  .admin-sidebar .brand small {
    font-size: 10px;
  }
  .admin-menu-toggle {
    display: inline-flex;
    min-height: 44px;
    gap: 8px;
    padding: 10px 12px;
    flex-shrink: 0;
  }
  .admin-menu-panel {
    display: none;
    position: absolute;
    left: max(12px, env(safe-area-inset-left, 0px));
    right: max(12px, env(safe-area-inset-right, 0px));
    top: calc(100% + 6px);
    max-height: min(75dvh, 600px);
    overflow-y: auto;
    overscroll-behavior: contain;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 14px;
    box-shadow: 0 14px 36px #152d4320;
    padding: 10px;
  }
  .admin-sidebar.mobile-open .admin-menu-panel {
    display: block;
  }
  .admin-menu-panel .admin-nav {
    display: grid;
    grid-template-columns: 1fr;
    gap: 3px;
    overflow: visible;
  }
  .admin-menu-panel .admin-nav a {
    min-height: 47px;
    font-size: 14px;
    padding: 11px 12px;
    white-space: normal;
  }
  .admin-menu-panel .admin-nav a.active {
    background: var(--pale);
    color: var(--blue);
  }
  .admin-menu-panel .admin-nav a svg {
    width: 19px;
    height: 19px;
  }
  .admin-menu-panel .admin-nav .badge {
    display: inline-flex;
    min-width: 24px;
    margin-left: auto;
    justify-content: center;
  }
  .admin-mobile-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    margin-top: 10px;
    padding: 14px 4px 4px;
    border-top: 1px solid var(--line);
  }
  .admin-mobile-actions > span {
    grid-column: 1/-1;
    font-size: 12px;
    color: var(--muted);
    overflow-wrap: anywhere;
    margin-bottom: 4px;
  }
  .admin-mobile-actions .btn {
    min-height: 44px;
    font-size: 12px;
    padding: 9px;
  }
  .admin-user {
    display: none;
  }
  .admin-main {
    padding: 24px max(16px, env(safe-area-inset-right, 0px))
      calc(28px + env(safe-area-inset-bottom, 0px))
      max(16px, env(safe-area-inset-left, 0px));
  }
  .admin-bottom-logout {
    min-height: 44px;
  }
  .admin-two {
    grid-template-columns: 1fr;
    gap: 16px;
  }
}
@media (max-width: 640px) {
  html {
    scroll-padding-top: 90px;
  }
  body {
    font-size: 14px;
    line-height: 1.65;
  }
  .wrap,
  .wrap.narrow {
    width: 100%;
    padding-left: max(16px, env(safe-area-inset-left, 0px));
    padding-right: max(16px, env(safe-area-inset-right, 0px));
  }
  .site-header {
    padding-top: env(safe-area-inset-top, 0px);
  }
  .header-inner {
    min-height: 64px;
    height: auto;
    gap: 12px;
    padding-top: 9px;
    padding-bottom: 9px;
  }
  .brand {
    min-width: 0;
  }
  .header-inner .brand {
    max-width: calc(100% - 54px);
  }
  .brand-name {
    font-size: 25px;
  }
  .brand small {
    font-size: 10px;
  }
  .menu-toggle {
    display: flex;
    min-width: 44px;
    min-height: 44px;
  }
  .header-cta {
    display: none;
  }
  .nav {
    display: none;
    position: absolute;
    inset: 100% 0 auto;
    background: #fff;
    padding: 10px 16px 16px;
    border-bottom: 1px solid var(--line);
    max-height: 75dvh;
    overflow-y: auto;
    overscroll-behavior: contain;
    gap: 4px;
  }
  .nav.open {
    display: grid;
  }
  .nav a {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 46px;
    padding: 11px 14px;
    border-radius: 8px;
    font-size: 14px;
  }
  .nav a.active {
    background: var(--pale);
    color: var(--blue);
  }
  .nav a.active::after,
  .nav-indicator {
    display: none !important;
  }
  .nav .mobile-nav-report {
    display: flex;
    background: var(--pale);
    color: var(--blue);
    margin-top: 4px;
  }
  .btn {
    min-height: 46px;
    font-size: 13px;
    padding: 11px 15px;
  }
  .btn.tiny,
  .icon-btn {
    min-height: 44px;
  }
  .icon-btn {
    min-width: 44px;
  }
  .hero {
    padding: 32px 0 28px;
  }
  .hero h1 {
    font-size: clamp(31px, 8.5vw, 38px);
    line-height: 1.3;
    letter-spacing: -1.1px;
  }
  .hero > p {
    font-size: 14px;
    line-height: 1.75;
    max-width: 100%;
  }
  .hero-subnav {
    gap: 10px;
    flex-wrap: wrap;
  }
  .hero-subnav a {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    font-size: 12px;
  }
  .page-head {
    padding: 28px 0 22px;
  }
  .page-head h1 {
    font-size: 27px;
    line-height: 1.35;
  }
  .page-head p {
    font-size: 14px;
    line-height: 1.7;
  }
  .searchbox {
    padding: 6px;
    gap: 7px;
    max-width: 100%;
  }
  .searchbox input {
    font-size: 16px !important;
    min-height: 46px;
    min-width: 0;
  }
  .searchbox > .btn {
    min-height: 44px;
    font-size: 13px;
    padding: 10px 13px;
  }
  .searchbox > svg {
    width: 18px;
    height: 18px;
    margin-left: 5px;
  }
  .directory-toolbar {
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
  }
  .filters {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
  }
  .filter {
    min-height: 44px;
    font-size: 12px;
    padding: 10px 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
  .result-count {
    align-self: flex-end;
    font-size: 12px;
  }
  .trader-grid {
    gap: 12px;
  }
  .trader-card {
    padding: 19px 10px 15px;
  }
  .trader-card h3 {
    font-size: 14px;
    line-height: 1.45;
  }
  .trader-card .avatar {
    width: 58px;
    height: 58px;
  }
  .trader-card .deposit strong {
    font-size: 18px;
  }
  .trader-card .status {
    font-size: 10px;
    white-space: normal;
    line-height: 1.5;
  }
  .report-grid {
    gap: 14px;
  }
  .report-card {
    padding: 20px;
  }
  .report-card h3 {
    font-size: 17px;
    overflow-wrap: anywhere;
  }
  .report-card p {
    font-size: 14px;
    line-height: 1.7;
  }
  .panel {
    padding: 21px 18px;
  }
  .panel h2,
  .form-section h2 {
    font-size: 18px;
  }
  .form-grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 18px;
  }
  .field.full {
    grid-column: auto;
  }
  .field {
    gap: 8px;
    font-size: 13px;
  }
  .field > span {
    line-height: 1.5;
  }
  .field input:not([type="checkbox"]):not([type="radio"]):not([type="color"]),
  .field select,
  .field textarea,
  .bank-edit-row input {
    font-size: 16px !important;
    min-height: 48px;
    padding: 12px;
    max-width: 100%;
  }
  .field textarea {
    min-height: 132px;
  }
  .field input[type="file"] {
    padding: 6px;
    font-size: 13px !important;
  }
  input[type="file"]::file-selector-button {
    min-height: 36px;
    font-size: 13px;
    margin-right: 8px;
  }
  input[type="checkbox"],
  input[type="radio"] {
    width: 20px;
    height: 20px;
    flex-shrink: 0;
  }
  .checkbox,
  .consent {
    font-size: 13px;
    line-height: 1.7;
    gap: 10px;
  }
  .checkbox input,
  .consent input {
    margin-top: 3px;
  }
  .field input,
  .field textarea,
  .field select {
    scroll-margin-top: 100px;
    scroll-margin-bottom: 100px;
  }
  .image-field {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px;
    width: 100%;
    align-items: center;
  }
  .image-field > img {
    grid-column: 1/-1;
    width: 56px;
    height: 56px;
  }
  .image-field > input[type="file"] {
    grid-column: 1;
    min-width: 0;
  }
  .image-field > .btn {
    grid-column: 2;
    min-height: 44px;
  }
  .form-actions {
    flex-wrap: wrap;
    gap: 10px;
  }
  .form-actions .btn {
    flex: 1 1 130px;
  }
  .form-error {
    font-size: 13px;
    overflow-wrap: anywhere;
  }
  .form-section > p,
  .side-note,
  .prose {
    overflow-wrap: anywhere;
  }
  .upload-zone {
    padding: 22px 14px;
  }
  .upload-zone strong {
    font-size: 14px;
  }
  .upload-zone small {
    font-size: 12px;
    line-height: 1.6;
  }
  .upload-zone input[type="file"] {
    max-width: 100%;
    font-size: 13px;
  }
  .alert {
    font-size: 13px;
    line-height: 1.7;
    gap: 10px;
  }
  .notice-line {
    font-size: 12px;
    line-height: 1.7;
  }
  .empty p {
    display: block;
    font-size: 13px;
    line-height: 1.7;
  }
  .login-wrap {
    padding: 28px 16px;
    min-height: 0;
  }
  .login-wrap form {
    width: 100%;
    max-width: 440px;
  }
  .profile-v2 .pv-hero {
    padding: 24px 0;
  }
  .profile-v2 .pv-hero h1 {
    font-size: 27px;
    line-height: 1.4;
  }
  .pv-insurance-amount {
    font-size: clamp(25px, 7.3vw, 32px);
  }
  .pv-insurance-details span {
    font-size: 12px;
  }
  .pv-insurance-details b {
    font-size: 12px;
  }
  .profile-v2 .pv-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    width: 100%;
  }
  .pv-actions > .btn {
    min-height: 46px;
    font-size: 12px;
    width: 100%;
    padding: 11px 9px;
  }
  .pv-actions > :last-child:nth-child(3) {
    grid-column: 1/-1;
  }
  .pv-panel {
    padding: 21px 17px;
  }
  .pv-section-description {
    font-size: 13px !important;
  }
  .pv-section-heading > span {
    font-size: 11px;
    flex-shrink: 0;
  }
  .pv-bank {
    padding: 16px 14px;
  }
  .pv-bank-number {
    gap: 12px;
  }
  .pv-bank-number b {
    font-size: 20px;
    line-height: 1.4;
  }
  .pv-bank-number .btn {
    min-height: 44px;
    font-size: 12px;
    padding: 9px 12px;
  }
  .pv-bank-owner strong {
    font-size: 13px;
  }
  .pv-bank-note,
  .pv-safety {
    font-size: 12px;
    line-height: 1.7;
  }
  .pv-reviews .reviews-header {
    flex-wrap: wrap;
  }
  .pv-reviews .reviews-header .btn {
    min-height: 44px;
    font-size: 12px;
  }
  .review-card p,
  .pv-review-card p {
    font-size: 14px;
    line-height: 1.75;
  }
  .pv-reviews .prose,
  .pv-panel .prose {
    font-size: 14px;
    line-height: 1.75;
  }
  .detail-facts dd {
    min-width: 0;
    overflow-wrap: anywhere;
  }
  .detail-facts dd .icon-btn {
    flex-shrink: 0;
  }
  .report-detail h1 {
    font-size: 25px;
    overflow-wrap: anywhere;
  }
  .report-detail .prose {
    font-size: 15px;
    line-height: 1.8;
  }
  .evidence-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }
  .evidence-grid img {
    height: 145px;
  }
  .site-footer {
    padding-bottom: calc(18px + env(safe-area-inset-bottom, 0px));
  }
  .footer-about p {
    font-size: 13px;
    line-height: 1.75;
  }
  .footer-links a,
  .footer-links button {
    font-size: 13px;
    min-height: 36px;
    display: inline-flex;
    align-items: center;
  }
  .footer-bottom {
    font-size: 12px;
    line-height: 1.7;
  }
  .toast {
    bottom: calc(16px + env(safe-area-inset-bottom, 0px));
    padding: 13px 17px;
    font-size: 13px;
    max-width: calc(100% - 32px);
    line-height: 1.6;
    text-align: center;
  }
  dialog {
    width: calc(100% - 24px);
    max-width: 600px;
    max-height: calc(var(--visible-height, 100dvh) - 24px);
    position: fixed;
    left: 0;
    right: 0;
    top: calc(var(--viewport-top, 0px) + 12px);
    bottom: auto;
    margin: 0 auto;
    overscroll-behavior: contain;
    border-radius: 14px;
  }
  dialog.modal-wide,
  dialog.image-gallery {
    width: calc(100% - 24px);
  }
  .modal-inner,
  .image-gallery .modal-inner {
    padding: 18px;
  }
  .modal-head {
    position: sticky;
    top: 0;
    z-index: 4;
    background: #fff;
    margin-top: -4px;
    margin-bottom: 18px;
    padding: 8px 0 12px;
    gap: 12px;
    border-bottom: 1px solid var(--line);
  }
  .modal-head h2 {
    font-size: 20px;
    line-height: 1.4;
  }
  .modal-head > .icon-btn {
    flex-shrink: 0;
  }
  #modal .form-actions {
    position: sticky;
    bottom: 0;
    z-index: 3;
    background: #fff;
    padding: 14px 0 calc(14px + env(safe-area-inset-bottom, 0px));
    border-top: 1px solid var(--line);
    margin-bottom: -18px;
  }
  .bank-edit-row {
    grid-template-columns: minmax(0, 1fr) 44px;
    gap: 12px 8px;
    align-items: start;
    background: var(--ground);
    border: 1px solid var(--line);
    border-radius: 10px;
    padding: 14px;
    margin-bottom: 14px;
  }
  .bank-edit-field {
    grid-column: 1;
  }
  .bank-edit-label {
    display: block;
    font-size: 12px;
    font-weight: 500;
  }
  .bank-edit-row > button {
    grid-column: 2;
    grid-row: 1;
    min-width: 44px;
    min-height: 44px;
    align-self: end;
  }
  .bank-edit-row .bank-edit-field:nth-child(n + 2) {
    grid-column: 1/-1;
  }
  .gallery-stage {
    height: min(55dvh, calc(var(--visible-height, 100dvh) - 180px));
    min-height: 150px;
  }
  .gallery-controls .btn {
    min-width: 46px;
  }
  .admin-title {
    flex-direction: column;
    align-items: stretch;
    gap: 16px;
    margin-bottom: 22px;
  }
  .admin-title h1 {
    font-size: 25px;
  }
  .admin-title p {
    font-size: 13px;
    line-height: 1.7;
  }
  .admin-title > .btn {
    min-height: 46px;
    width: 100%;
    font-size: 13px;
  }
  .stats-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-bottom: 20px;
  }
  .stats-strip > div {
    padding: 18px 14px;
  }
  .stats-strip span {
    font-size: 12px;
    line-height: 1.65;
  }
  .stats-strip b {
    font-size: 27px;
  }
  .stats-strip > div:nth-child(2) {
    border-right: 0;
  }
  .stats-strip > div:nth-child(-n + 2) {
    border-bottom: 1px solid var(--line);
  }
  .contact-row {
    min-width: 0;
    gap: 12px;
    align-items: flex-start;
    flex-wrap: wrap;
  }
  .contact-row > * {
    min-width: 0;
    overflow-wrap: anywhere;
  }
  .contact-row small {
    font-size: 11px;
  }
  .admin-table-wrap {
    overflow: visible;
    background: transparent;
    border: 0;
  }
  .admin-table {
    display: block;
    white-space: normal;
    width: 100%;
  }
  .admin-table thead {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
  }
  .admin-table tbody {
    display: grid;
    gap: 12px;
  }
  .admin-table tr {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px 10px;
    padding: 16px;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 12px;
  }
  .admin-table td {
    display: block;
    padding: 0;
    border: 0;
    min-width: 0;
    max-width: 100%;
    overflow-wrap: anywhere;
    font-size: 13px;
  }
  .admin-table .person {
    min-width: 0;
    gap: 10px;
  }
  .admin-table .person > div {
    min-width: 0;
  }
  .admin-table .avatar {
    width: 40px;
    height: 40px;
    flex-shrink: 0;
  }
  .admin-table .person b {
    font-size: 14px;
    line-height: 1.45;
  }
  .admin-table .person small {
    font-size: 12px;
  }
  .traders-table td:nth-child(1) {
    grid-column: 2;
    grid-row: 1;
    justify-self: end;
    color: var(--muted);
    font-size: 12px;
  }
  .traders-table td:nth-child(1)::before {
    content: "#";
  }
  .traders-table td:nth-child(2) {
    grid-column: 1;
    grid-row: 1;
  }
  .traders-table td:nth-child(3) {
    grid-column: 1;
    grid-row: 2;
    text-align: left;
    font-size: 16px;
    font-weight: 600;
  }
  .traders-table td:nth-child(3)::before {
    content: attr(data-label);
    display: block;
    font-size: 11px;
    font-weight: 400;
    color: var(--muted);
    margin-bottom: 3px;
  }
  .traders-table td:nth-child(4) {
    grid-column: 1/-1;
    grid-row: 3;
  }
  .traders-table td:nth-child(4) .status {
    font-size: 12px;
  }
  .traders-table td:nth-child(5) {
    grid-column: 2;
    grid-row: 2;
    align-self: center;
  }
  .row-actions {
    gap: 6px;
  }
  .row-actions .icon-btn {
    min-width: 44px;
    min-height: 44px;
    background: var(--ground);
    border-radius: 8px;
  }
  .accounts-table td:nth-child(1) {
    grid-column: 1;
    grid-row: 1;
    font-size: 15px;
    font-weight: 600;
  }
  .accounts-table td:nth-child(2) {
    grid-column: 1;
    grid-row: 2;
  }
  .accounts-table td:nth-child(3) {
    grid-column: 1;
    grid-row: 3;
    font-size: 12px;
    color: var(--muted);
  }
  .accounts-table td:last-child {
    grid-column: 2;
    grid-row: 1/4;
    align-self: center;
  }
  .accounts-table td:nth-child(2)::before,
  .accounts-table td:nth-child(3)::before {
    content: attr(data-label) ": ";
    font-size: 12px;
    color: var(--muted);
    font-weight: 400;
  }
  .admin-table td[colspan] {
    grid-column: 1/-1 !important;
    grid-row: auto !important;
    line-height: 1.7;
  }
  .admin-table td[colspan]::before {
    display: none;
  }
  .admin-tabs {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    overflow: visible;
  }
  .admin-tabs .filter {
    min-height: 44px;
    white-space: normal;
    font-size: 12px;
  }
  .moderation {
    padding: 18px 16px;
  }
  .moderation-head {
    gap: 10px;
  }
  .moderation-head h3 {
    font-size: 16px;
    overflow-wrap: anywhere;
  }
  .moderation .prose {
    font-size: 14px;
    line-height: 1.8;
    overflow-wrap: anywhere;
  }
  .moderation-private {
    font-size: 12px;
    line-height: 1.7;
    overflow-wrap: anywhere;
  }
  .moderation-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }
  .moderation-actions > .btn {
    min-height: 46px;
    white-space: normal;
    font-size: 12px;
    padding: 10px 8px;
  }
  .moderation-actions > .btn:last-child:nth-child(3) {
    grid-column: 1/-1;
  }
  .settings-grid {
    gap: 14px;
  }
  .settings-grid > div > p {
    font-size: 13px;
    line-height: 1.7;
  }
  .settings-grid > div > h3 {
    font-size: 17px;
  }
  .settings-grid + .settings-grid {
    margin-top: 26px;
    padding-top: 26px;
  }
  .data-tools .data-tool p {
    font-size: 13px;
  }
  .system-check {
    flex-wrap: wrap;
    padding: 18px;
    gap: 10px;
  }
  .system-check h3 {
    font-size: 15px;
  }
  .system-check p {
    font-size: 13px;
    overflow-wrap: anywhere;
  }
  .system-check > .badge {
    margin-top: 0;
  }
  .share-settings-preview {
    padding: 15px;
  }
  .share-settings-preview img {
    width: min(100%, 220px);
  }
  .share-settings-preview p {
    font-size: 13px;
  }
  .setup-wrap {
    padding-bottom: calc(20px + env(safe-area-inset-bottom, 0px));
  }
  .setup-steps {
    gap: 6px;
  }
  .setup-checks li {
    font-size: 13px;
  }
  .setup-checks b {
    flex-shrink: 0;
  }
  .setup-checks span {
    min-width: 0;
    overflow-wrap: anywhere;
  }
}
@media (max-width: 360px) {
  .searchbox {
    display: grid;
    grid-template-columns: 20px minmax(0, 1fr);
    padding: 8px;
    gap: 8px;
  }
  .searchbox > svg {
    margin-left: 0;
  }
  .searchbox > .btn {
    grid-column: 1/-1;
  }
  .filters {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .trader-card .deposit strong {
    font-size: 16px;
  }
  .trader-card h3 {
    font-size: 13px;
  }
  .pv-bank-number {
    flex-direction: column;
    align-items: flex-start;
  }
  .pv-bank-number .btn {
    width: 100%;
  }
  .traders-table tr {
    grid-template-columns: minmax(0, 1fr) 90px;
  }
  .admin-table .person {
    gap: 8px;
  }
  .admin-table .person b {
    font-size: 13px;
  }
  .admin-table .avatar {
    width: 34px;
    height: 34px;
  }
  .traders-table td:nth-child(3) {
    font-size: 14px;
  }
}