.vsb-directory-header { margin-bottom: var(--space-8, 32px); }
.vsb-directory-filters { display: grid; grid-template-columns: minmax(180px, 2fr) repeat(2, minmax(150px, 1fr)) auto; gap: 12px; margin-bottom: 32px; }
.vsb-directory-filters input, .vsb-directory-filters select, .vsb-verify-form input { min-height: 46px; width: 100%; padding: 10px 12px; border: 1px solid var(--border, #596168); border-radius: 2px; background: var(--surface, #2e3338); color: var(--fg, #fff); }
.vsb-directory-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.vsb-directory-card { display: flex; flex-direction: column; gap: 16px; }
.vsb-directory-card h2 { color: var(--fg, #fff); font-size: 24px; }
.vsb-directory-card p { margin: 0; color: var(--fg-2, #d0d4d6); }
.vsb-directory-card .btn { margin-top: auto; align-self: flex-start; }
.vsb-badge { display: inline-flex; width: max-content; padding: 5px 9px; border: 1px solid var(--border, #596168); color: var(--muted, #8a9094); font: 600 11px/1.2 var(--font-mono, monospace); letter-spacing: .08em; text-transform: uppercase; }
.vsb-badge--approved { border-color: var(--accent, #c8a55a); color: var(--accent, #c8a55a); }
.vsb-profile { display: grid; grid-template-columns: minmax(0, 2fr) minmax(260px, 1fr); gap: 48px; }
.vsb-profile-meta, .vsb-verification { padding: 28px; border: 1px solid var(--border, #596168); background: var(--surface, #2e3338); }
.vsb-profile-meta dl, .vsb-verification dl { margin: 0; }
.vsb-profile-meta dl div, .vsb-verification dl div { padding-block: 12px; border-bottom: 1px solid var(--border-soft, #41484e); }
.vsb-profile-meta dt, .vsb-verification dt { color: var(--muted, #8a9094); font-size: 12px; text-transform: uppercase; }
.vsb-profile-meta dd, .vsb-verification dd { margin: 4px 0 0; overflow-wrap: anywhere; }
.vsb-verify-form { max-width: 680px; margin-bottom: 32px; }
.vsb-verify-form > div { display: grid; grid-template-columns: 1fr auto; gap: 12px; margin-top: 8px; }
.vsb-verification { max-width: 760px; border-left: 4px solid var(--border, #596168); }
.vsb-verification--approved { border-left-color: var(--success, #72a67d); }
.vsb-verification--suspended, .vsb-verification--expired, .vsb-verification--invalid { border-left-color: var(--danger, #c77474); }
.vsb-empty { padding: 32px; border: 1px solid var(--border, #596168); color: var(--fg-2, #d0d4d6); }
@media (max-width: 850px) { .vsb-directory-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .vsb-directory-filters { grid-template-columns: 1fr 1fr; } .vsb-profile { grid-template-columns: 1fr; } }
@media (max-width: 560px) { .vsb-directory-grid, .vsb-directory-filters { grid-template-columns: 1fr; } .vsb-verify-form > div { grid-template-columns: 1fr; } }


.vsb-directory-card-image { display: block; aspect-ratio: 4 / 3; overflow: hidden; border: 1px solid var(--border, #596168); background: var(--surface, #2e3338); }
.vsb-directory-card-image img { display: block; width: 100%; height: 100%; object-fit: cover; }
.vsb-profile-image { margin: 0 0 24px; }
.vsb-profile-image img { display: block; width: 100%; max-width: 760px; aspect-ratio: 4 / 3; object-fit: cover; border: 1px solid var(--border, #596168); }

.vsb-complaints{max-width:780px;margin-inline:auto}.vsb-complaints-header{margin-bottom:32px}.vsb-complaints-form{padding:28px;border:1px solid var(--border,#596168);background:var(--surface,#2e3338)}.vsb-complaints-form p{margin:0 0 18px}.vsb-complaints-form label{display:block;margin-bottom:7px;font-weight:600}.vsb-complaints-form input,.vsb-complaints-form select,.vsb-complaints-form textarea{width:100%;padding:10px 12px;border:1px solid var(--border,#596168);background:var(--bg,#171b1e);color:var(--fg,#fff)}.vsb-complaints-form input[type=checkbox]{width:auto;margin-right:8px}.vsb-notice{margin:0 0 20px;padding:16px 18px;border-left:4px solid var(--accent,#c8a55a);background:var(--surface,#2e3338)}.vsb-notice--success{border-left-color:var(--success,#72a67d)}.vsb-notice--error{border-left-color:var(--danger,#c77474)}


/* Complaints and appeals: independent, compact form layout. */
.vsb-complaints { max-width: 940px; margin: 0 auto; padding: clamp(32px, 5vw, 72px) 0; }
.vsb-complaints-header { max-width: 720px; margin: 0 auto 36px; text-align: left; }
.vsb-complaints-header h1 { margin: 0 0 18px; font-size: clamp(2.5rem, 5vw, 4.5rem) !important; line-height: .98 !important; letter-spacing: -.045em; }
.vsb-complaints-header .lead { max-width: 680px; font-size: clamp(1.05rem, 1.8vw, 1.3rem); line-height: 1.55; }
.vsb-complaints-form { max-width: 760px; margin: 0 auto; padding: clamp(24px, 4vw, 42px); border: 1px solid var(--border, #596168); border-radius: 8px; background: var(--surface, #2e3338); box-shadow: 0 18px 50px rgba(0,0,0,.16); }
.vsb-complaints-form .grid-2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.vsb-complaints-form p { display: flex; flex-direction: column; gap: 8px; margin: 0 0 22px; }
.vsb-complaints-form .grid-2 p { margin: 0 0 22px; }
.vsb-complaints-form label { display: block; margin: 0; color: var(--fg, #fff); font-size: .93rem; font-weight: 650; }
.vsb-complaints-form input, .vsb-complaints-form select, .vsb-complaints-form textarea { box-sizing: border-box; min-height: 48px; border: 1px solid var(--border, #596168); border-radius: 4px; background: #171b1e; color: #fff; font: inherit; line-height: 1.4; }
.vsb-complaints-form textarea { min-height: 170px; resize: vertical; }
.vsb-complaints-form input:focus, .vsb-complaints-form select:focus, .vsb-complaints-form textarea:focus { outline: 3px solid rgba(200,165,90,.3); outline-offset: 2px; border-color: var(--accent, #c8a55a); }
.vsb-complaints-form p:has(input[type=checkbox]) { display: block; margin: 4px 0 24px; }
.vsb-complaints-form p:has(input[type=checkbox]) label { display: flex; align-items: flex-start; gap: 10px; color: var(--fg-2, #d0d4d6); font-weight: 400; line-height: 1.45; }
.vsb-complaints-form input[type=checkbox] { width: 18px; min-height: 18px; margin: 2px 0 0; accent-color: var(--accent, #c8a55a); }
.vsb-complaints-form .btn { align-self: flex-start; min-height: 48px; padding-inline: 24px; }
.vsb-notice { max-width: 760px; margin: 0 auto 24px; padding: 16px 18px; border-radius: 4px; }
@media (max-width: 640px) { .vsb-complaints { padding-inline: 18px; } .vsb-complaints-form .grid-2 { grid-template-columns: 1fr; gap: 0; } }
