:root{
  --bg:#07111f;
  --bg2:#0b1830;
  --bg3:#0f1d38;
  --card:rgba(255,255,255,.08);
  --card-2:rgba(255,255,255,.11);
  --text:#f5f7fb;
  --muted:#b9c5d8;
  --gold:#d7b166;
  --gold2:#f1cf8d;
  --blue:#4f83ff;
  --border:rgba(255,255,255,.12);
  --shadow:0 24px 80px rgba(0,0,0,.38);
  --radius:26px;
  --radius-sm:18px;
  --container:1280px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:Inter,Arial,Helvetica,sans-serif;
  color:var(--text);
  background:
    radial-gradient(circle at 10% 0%, rgba(79,131,255,.22), transparent 18%),
    radial-gradient(circle at 100% 0%, rgba(215,177,102,.18), transparent 20%),
    radial-gradient(circle at 80% 35%, rgba(79,131,255,.10), transparent 20%),
    linear-gradient(180deg,var(--bg) 0%, var(--bg2) 50%, var(--bg) 100%);
  min-height:100vh;
}
a{text-decoration:none;color:inherit}
.container{width:min(var(--container), calc(100% - 40px));margin:0 auto}
.glass{
  background:var(--card);
  border:1px solid var(--border);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
  box-shadow:var(--shadow);
  border-radius:var(--radius);
}
.eyebrow{
  display:inline-flex;align-items:center;gap:8px;margin-bottom:16px;
  color:var(--gold2);font-size:12px;font-weight:800;letter-spacing:.18em;text-transform:uppercase;
}
.eyebrow::before{
  content:"";width:28px;height:1px;background:linear-gradient(90deg,var(--gold),transparent);
}
h1,h2,h3,h4,p{margin:0}
p{color:var(--muted);line-height:1.75}
section{padding:84px 0}
.btn{
  display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 24px;
  border-radius:999px;border:1px solid transparent;font-weight:800;letter-spacing:.01em;
  transition:.24s ease;cursor:pointer;
}
.btn:hover{transform:translateY(-2px)}
.btn-primary{background:linear-gradient(135deg,var(--gold),var(--gold2));color:#101522;box-shadow:0 10px 30px rgba(215,177,102,.26)}
.btn-outline{background:rgba(255,255,255,.04);color:#fff;border-color:rgba(255,255,255,.16)}
.btn-dark{background:rgba(4,10,18,.82);color:#fff;border-color:rgba(255,255,255,.08)}
.btn-small{min-height:40px;padding:0 16px;font-size:14px}
.header-wrap{
  position:sticky;top:0;z-index:30;padding:18px 0;
  background:linear-gradient(180deg, rgba(7,17,31,.84), rgba(7,17,31,.10));
  backdrop-filter:blur(10px);
}
.header{display:flex;align-items:center;gap:20px;padding:16px 22px}
.brand{display:flex;align-items:center;gap:14px;font-weight:900;letter-spacing:.03em}
.brand-mark{
  width:44px;height:44px;border-radius:14px;display:grid;place-items:center;
  background:linear-gradient(135deg,var(--gold),#fff2cf);color:#101522;font-weight:900;
  box-shadow:0 8px 26px rgba(215,177,102,.24);
}
.nav{display:flex;gap:20px;margin-left:auto}
.nav a{color:var(--muted);font-weight:600}
.nav a:hover{color:#fff}
.header-actions{display:flex;gap:12px}
.page-hero{padding:56px 0 26px}
.hero-box,.card{padding:34px}
.hero-box h1{font-size:clamp(38px,5vw,62px);line-height:1.04;margin-bottom:16px;letter-spacing:-.03em}
.section-head{margin-bottom:30px;max-width:840px}
.section-head h2{font-size:clamp(32px,4vw,52px);line-height:1.08;margin-bottom:14px;letter-spacing:-.02em}
.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:22px}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.card h3{margin-bottom:12px;font-size:24px}
.feature-icon,.square-icon{
  width:54px;height:54px;border-radius:16px;display:grid;place-items:center;margin-bottom:16px;
  background:linear-gradient(135deg, rgba(79,131,255,.18), rgba(215,177,102,.18));
  border:1px solid rgba(255,255,255,.08);font-weight:900;color:var(--gold2)
}
.hero-grid{display:grid;grid-template-columns:1.08fr .92fr;gap:28px;align-items:center}
.hero-copy{padding:42px}
.hero-copy h1{font-size:clamp(42px,6vw,74px);line-height:1.02;margin-bottom:18px;letter-spacing:-.03em}
.hero-copy p{font-size:18px;max-width:720px}
.hero-actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:28px}
.hero-trust{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:32px}
.mini-stat,.stat{padding:18px;border-radius:18px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08)}
.mini-stat strong,.stat strong{display:block;margin-bottom:8px;color:#fff}
.hero-visual{
  min-height:620px;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;
  background:radial-gradient(circle at 20% 15%, rgba(79,131,255,.28), transparent 24%),
             radial-gradient(circle at 80% 70%, rgba(215,177,102,.18), transparent 24%),
             linear-gradient(135deg, rgba(255,255,255,.04), rgba(255,255,255,.02));
}
.orb{position:absolute;border-radius:999px;filter:blur(8px)}
.orb-1{width:320px;height:320px;top:20px;right:10px;background:radial-gradient(circle, rgba(79,131,255,.52), transparent 70%)}
.orb-2{width:250px;height:250px;bottom:15px;left:0;background:radial-gradient(circle, rgba(215,177,102,.34), transparent 70%)}
.hero-panel{
  position:relative;z-index:2;width:88%;max-width:470px;padding:30px;background:rgba(8,16,32,.44);
  border:1px solid rgba(255,255,255,.12);border-radius:26px;backdrop-filter:blur(16px)
}
.hero-panel h3{font-size:32px;margin-bottom:12px}
.badge{
  display:inline-flex;padding:8px 14px;border-radius:999px;background:rgba(215,177,102,.16);
  border:1px solid rgba(215,177,102,.22);color:var(--gold2);font-size:12px;font-weight:800;
  margin-bottom:16px;text-transform:uppercase;letter-spacing:.08em;
}
.featured-tag,.badge-mini{
  display:inline-flex;padding:6px 10px;border-radius:999px;background:rgba(215,177,102,.14);
  color:var(--gold2);font-size:12px;font-weight:800;
}
.platform-block{display:grid;grid-template-columns:1.02fr .98fr;gap:24px;align-items:stretch}
.platform-visual,.visual-block{
  min-height:360px;display:grid;place-items:center;
  background:radial-gradient(circle at 20% 30%, rgba(79,131,255,.26), transparent 24%),
             radial-gradient(circle at 76% 68%, rgba(215,177,102,.18), transparent 22%),
             linear-gradient(135deg, rgba(255,255,255,.04), rgba(255,255,255,.02));
  font-size:18px;color:var(--gold2);letter-spacing:.10em;font-weight:800;
  border-radius:var(--radius);
  border:1px solid var(--border);
}
.platform-list,.mini-list,.product-list,.review-list,.info-list{display:grid;gap:14px;margin-top:18px}
.platform-item,.mini-item,.product-item,.review-item,.info-item{
  padding:18px;border-radius:18px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08)
}
.forum-banner{display:flex;justify-content:space-between;align-items:center;gap:18px;padding:34px}
.register-box{padding:42px;text-align:center;position:relative;overflow:hidden}
.register-box::before{
  content:"";position:absolute;inset:0;
  background:radial-gradient(circle at 10% 20%, rgba(79,131,255,.18), transparent 20%),
             radial-gradient(circle at 90% 20%, rgba(215,177,102,.12), transparent 20%);
  pointer-events:none;
}
.register-box>*{position:relative;z-index:1}
.register-box h2{font-size:clamp(30px,4vw,48px);margin-bottom:14px}
.register-form{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:24px}
input,textarea,select{
  width:100%;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.05);color:#fff;
  border-radius:14px;padding:14px 16px;outline:none;font:inherit;
}
input::placeholder,textarea::placeholder{color:#a9b7cb}
input:focus,textarea:focus,select:focus{border-color:rgba(215,177,102,.55);box-shadow:0 0 0 3px rgba(215,177,102,.08)}
.suppliers-wrap{display:grid;gap:22px}
.suppliers-toolbar{display:flex;justify-content:space-between;align-items:center;gap:16px}
.supplier-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.supplier-card{overflow:hidden}
.supplier-cover{
  height:220px;
  background:radial-gradient(circle at 25% 20%, rgba(79,131,255,.28), transparent 24%),
             radial-gradient(circle at 80% 70%, rgba(215,177,102,.18), transparent 24%),
             linear-gradient(135deg, rgba(255,255,255,.04), rgba(255,255,255,.02));
  display:grid;place-items:center;color:var(--gold2);font-weight:800;letter-spacing:.08em;
}
.supplier-body{padding:22px}
.supplier-head{display:flex;justify-content:space-between;gap:12px;margin-bottom:10px}
.supplier-meta{display:flex;gap:10px;flex-wrap:wrap;color:var(--muted);font-size:14px;margin-bottom:12px}
.card-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}
.reviews{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.review{padding:26px}
.review strong{display:block;margin-top:16px}
.layout-2{display:grid;grid-template-columns:320px 1fr;gap:24px;align-items:start}
.sidebar{position:sticky;top:110px}
.filters,.sidebar-box{padding:24px}
.form-group{margin-bottom:14px}
label{display:block;font-size:14px;font-weight:700;margin-bottom:8px;color:#fff}
.check-row{display:flex;align-items:center;gap:10px;margin:12px 0;color:var(--muted);font-size:14px}
.check-row input{width:18px;height:18px;padding:0}
.toolbar{padding:20px 24px;display:flex;justify-content:space-between;gap:18px;align-items:center}
.save-bar{padding:18px 22px;display:flex;justify-content:space-between;align-items:center;gap:14px}
.pagination{padding:18px;display:flex;justify-content:center;gap:10px;flex-wrap:wrap}
.page-link{
  min-width:42px;height:42px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;
  background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);color:#fff
}
.page-link.active{background:linear-gradient(135deg,var(--gold),var(--gold2));color:#101522;border-color:transparent}
.hero-meta{display:flex;flex-wrap:wrap;gap:10px;margin:18px 0 18px;color:var(--muted)}
.stats-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:16px}
.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.gallery-item{
  min-height:150px;border-radius:18px;background:linear-gradient(135deg, rgba(79,131,255,.16), rgba(215,177,102,.16));
  display:grid;place-items:center;color:var(--gold);font-weight:800
}
.footer{
  margin-top:70px;border-top:1px solid rgba(255,255,255,.08);background:rgba(0,0,0,.18)
}
.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:24px;padding:42px 0}
.footer h4,.footer h3{margin-bottom:12px}
.footer ul{list-style:none;padding:0;margin:0}
.footer li+li{margin-top:10px}
.footer a{color:var(--muted)}
.footer a:hover{color:#fff}
.footer-bottom{border-top:1px solid rgba(255,255,255,.08);padding:18px 0;color:var(--muted);font-size:14px}
.auth-wrap{display:grid;grid-template-columns:.95fr 1.05fr;gap:24px}
.tabs{display:flex;gap:10px;margin-bottom:22px;flex-wrap:wrap}
.tab-btn{
  min-height:42px;padding:0 18px;border-radius:999px;border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.04);color:#fff;cursor:pointer;font-weight:700;
}
.tab-btn.active{background:linear-gradient(135deg,var(--gold),var(--gold2));color:#101522;border-color:transparent}
.tab-panel{display:none}
.tab-panel.active{display:block}
.form-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.full{grid-column:1/-1}
.submit-row{display:flex;justify-content:space-between;gap:14px;align-items:center;margin-top:20px;flex-wrap:wrap}
.dashboard-layout{display:grid;grid-template-columns:280px 1fr;gap:24px}
.menu{display:grid;gap:10px}
.menu a{
  padding:13px 14px;border-radius:14px;color:var(--muted);
  background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.06);
}
.menu a.active,.menu a:hover{color:#fff;background:rgba(255,255,255,.08)}
.user-card{padding:22px;margin-bottom:18px;border-radius:20px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08)}
.avatar{
  width:58px;height:58px;border-radius:16px;display:grid;place-items:center;background:linear-gradient(135deg,var(--gold),#fff0c4);
  color:#101522;font-weight:900;font-size:22px;margin-bottom:14px;
}
.admin-layout{display:grid;grid-template-columns:280px 1fr;min-height:100vh}
.admin-sidebar{padding:24px;border-right:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.03);backdrop-filter:blur(18px)}
.admin-content{padding:24px}
.admin-header{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:22px}
.table-wrap{overflow:auto}
table{width:100%;border-collapse:collapse;min-width:720px}
th,td{text-align:left;padding:14px 12px;border-bottom:1px solid rgba(255,255,255,.08);vertical-align:top}
th{color:var(--gold2);font-size:12px;text-transform:uppercase;letter-spacing:.08em}
@media (max-width:1120px){
  .hero-grid,.platform-block,.grid-3,.supplier-grid,.reviews,.footer-grid,.grid-2,.auth-wrap,.layout-2,.dashboard-layout,.admin-layout{
    grid-template-columns:repeat(2,1fr)
  }
  .register-form,.form-grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:860px){
  .nav,.header-actions{display:none}
  .hero-grid,.platform-block,.grid-3,.supplier-grid,.reviews,.footer-grid,.grid-2,.register-form,.auth-wrap,.layout-2,.dashboard-layout,.admin-layout,.grid-4,.stats-grid,.gallery,.form-grid{
    grid-template-columns:1fr
  }
  .hero-visual{min-height:420px}
  .forum-banner,.suppliers-toolbar,.toolbar,.save-bar,.admin-header{flex-direction:column;align-items:flex-start}
  .hero-trust{grid-template-columns:1fr}
  .sidebar{position:static}
  .full{grid-column:auto}
}


.qr-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.qr-card{
  padding:18px;border-radius:18px;background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.08);text-align:center
}
.qr-card img{
  width:100%;max-width:190px;aspect-ratio:1/1;object-fit:cover;
  margin:0 auto 12px;border-radius:14px;background:#fff;padding:8px
}
.notice-bar{
  padding:16px 20px;border-radius:18px;background:rgba(215,177,102,.12);
  border:1px solid rgba(215,177,102,.18);color:#fff
}
.contact-list{display:grid;gap:12px}
.contact-item{
  padding:16px;border-radius:16px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08)
}
.small-muted{font-size:14px;color:var(--muted)}
.gate-box{max-width:720px;margin:0 auto;text-align:center}
.hidden{display:none !important}
.pagination a.page-link{text-decoration:none}
.pager-note{color:var(--muted);font-size:14px}
.supplier-card .btn,.supplier-card button,.featured-tag{
  justify-content:center;align-items:center;text-align:center;line-height:1.2;
}
@media (max-width:860px){
  .qr-grid{grid-template-columns:1fr}
}


.flash{padding:14px 16px;border-radius:16px;margin:16px auto;max-width:1200px}
.flash.success{background:rgba(82,183,136,.18);border:1px solid rgba(82,183,136,.3)}
.flash.error{background:rgba(220,76,100,.18);border:1px solid rgba(220,76,100,.3)}
.form-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.full{grid-column:1/-1}
.notice-bar{padding:16px 20px;border-radius:18px;background:rgba(215,177,102,.12);border:1px solid rgba(215,177,102,.18);color:#fff}
.qr-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.qr-card{padding:18px;border-radius:18px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);text-align:center}
.qr-card img{width:100%;max-width:190px;aspect-ratio:1/1;object-fit:cover;margin:0 auto 12px;border-radius:14px;background:#fff;padding:8px}
.contact-list{display:grid;gap:12px}
.contact-item{padding:16px;border-radius:16px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08)}
.small-muted{font-size:14px;color:var(--muted)}
.supplier-card .btn,.supplier-card button,.featured-tag{justify-content:center;align-items:center;text-align:center;line-height:1.2}
@media (max-width:860px){.form-grid,.qr-grid{grid-template-columns:1fr}.full{grid-column:auto}}

textarea {
  width: 100%;
  min-height: 140px;
  resize: vertical;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.04);
  color: #fff;
  padding: 14px 16px;
  font: inherit;
}
label {
  display: block;
  margin-bottom: 8px;
  color: #d8e1f0;
  font-size: 14px;
}

/* TRUST products/messages/import additions */
.mini-item .btn-small{display:inline-flex;margin-top:10px}textarea{width:100%;min-height:140px;resize:vertical;border-radius:14px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.04);color:#fff;padding:14px 16px;font:inherit}input[type='file']{width:100%;border-radius:14px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.04);color:#fff;padding:14px 16px}.supplier-cover{display:flex;align-items:center;justify-content:center;text-align:center}


/* TRUST real supplier/product images */
.supplier-cover-img{padding:0;overflow:hidden;min-height:190px;background:rgba(255,255,255,.04)}
.supplier-cover-img img{width:100%;height:100%;min-height:190px;object-fit:cover;display:block;border-radius:inherit}
.supplier-cover-img span{display:flex;align-items:center;justify-content:center;width:100%;height:190px}
.supplier-main-photo{padding:0;overflow:hidden;display:flex;align-items:center;justify-content:center}
.supplier-main-photo img{width:100%;height:100%;min-height:420px;object-fit:cover;display:block}


/* Forum results page */
.forum-results-hero{padding:78px 0 42px;position:relative}
.forum-results-hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:26px;align-items:stretch}
.forum-results-copy{padding:38px}
.forum-results-copy h1{font-size:clamp(34px,5vw,72px);line-height:1.02;margin:12px 0 18px}
.forum-results-copy p{font-size:18px;line-height:1.7;color:rgba(255,255,255,.78)}
.forum-results-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:24px 0}
.forum-results-stats div{border:1px solid rgba(255,255,255,.12);border-radius:18px;padding:16px;background:rgba(255,255,255,.04)}
.forum-results-stats strong{display:block;font-size:30px;color:#f6d37a}
.forum-results-stats span{font-size:13px;color:rgba(255,255,255,.72)}
.forum-results-main-photo{padding:0;overflow:hidden;min-height:460px}
.forum-results-main-photo img{width:100%;height:100%;object-fit:cover;display:block}
.forum-result-highlight{background:linear-gradient(135deg,rgba(253,217,102,.12),rgba(0,189,232,.06))}
.result-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:22px}
.video-placeholder{height:440px;border-radius:24px;border:1px dashed rgba(253,217,102,.55);background:linear-gradient(135deg,rgba(15,25,56,.8),rgba(0,189,232,.08));display:flex;align-items:center;justify-content:center;text-align:center;margin-top:20px}
.video-placeholder strong{display:block;font-size:28px;color:#f6d37a;margin-bottom:8px}
.video-placeholder span{color:rgba(255,255,255,.68)}
.forum-gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.forum-gallery img{width:100%;height:260px;object-fit:cover;border-radius:22px;border:1px solid rgba(255,255,255,.12);box-shadow:0 24px 70px rgba(0,0,0,.28);background:rgba(255,255,255,.04)}
.forum-gallery img:nth-child(1),.forum-gallery img:nth-child(2){grid-column:span 2;height:340px}
.forum-gallery img:nth-child(3){height:340px}
@media(max-width:900px){
  .forum-results-hero-grid,.result-grid{grid-template-columns:1fr}
  .forum-gallery{grid-template-columns:1fr}
  .forum-gallery img,.forum-gallery img:nth-child(1),.forum-gallery img:nth-child(2),.forum-gallery img:nth-child(3){grid-column:auto;height:240px}
  .forum-results-stats{grid-template-columns:1fr}
}

/* RU/ZH language switch */
.lang-switch{display:flex;align-items:center;gap:6px;margin-left:10px}.lang-switch a{display:inline-flex;align-items:center;justify-content:center;height:34px;padding:0 10px;border-radius:999px;border:1px solid rgba(255,255,255,.14);color:rgba(255,255,255,.78);text-decoration:none;font-weight:700;font-size:12px;background:rgba(255,255,255,.04)}.lang-switch a.active{background:linear-gradient(135deg,#fdd966,#c4843d);color:#111827}.forum-gallery{grid-auto-flow:dense}@media(max-width:900px){.lang-switch{margin:10px 0 0}.header,.navbar{flex-wrap:wrap}}


/* Alibaba-style catalog filters */
.catalog-hero .hero-box{position:relative;overflow:hidden}
.catalog-layout-pro{display:grid;grid-template-columns:320px minmax(0,1fr);gap:24px;align-items:start}
.alibaba-filters{position:sticky;top:92px;padding:22px}
.filter-title-row{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:18px}
.filter-title-row h3{margin:0 0 4px}
.filter-title-row p,.filter-help p{margin:0;color:rgba(255,255,255,.62);font-size:13px;line-height:1.55}
.reset-link{font-size:13px;color:#f6d37a;text-decoration:none}
.alibaba-filters form{display:grid;gap:14px}
.alibaba-filters .form-group{margin:0}
.alibaba-filters label{font-weight:700;font-size:13px;color:rgba(255,255,255,.82)}
.alibaba-filters input[type="text"],.alibaba-filters select{height:46px;border-radius:14px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.055);color:#fff;padding:0 14px;width:100%;outline:none}
.alibaba-filters select option{background:#111827;color:#fff}
.filter-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:4px}
.filter-help{margin-top:18px;padding:14px;border-radius:16px;background:rgba(253,217,102,.08);border:1px solid rgba(253,217,102,.16)}
.catalog-main-pro{display:grid;gap:22px}
.catalog-toolbar-pro{padding:22px;display:flex;justify-content:space-between;align-items:flex-start;gap:18px}
.catalog-toolbar-pro h2{margin:6px 0 0;font-size:28px}
.catalog-view-note{display:grid;gap:4px;text-align:right;color:rgba(255,255,255,.7)}
.catalog-view-note strong{color:#fff}
.active-filter-chips{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.active-filter-chips span,.card-tags span{display:inline-flex;align-items:center;min-height:28px;padding:0 10px;border-radius:999px;background:rgba(253,217,102,.10);border:1px solid rgba(253,217,102,.18);color:#f6d37a;font-size:12px;font-weight:700}
.catalog-grid-pro{grid-template-columns:repeat(3,minmax(0,1fr))}
.catalog-card-pro{min-height:100%;display:flex;flex-direction:column}
.catalog-card-pro .supplier-body{display:flex;flex-direction:column;flex:1}
.catalog-card-pro .supplier-body p{flex:1}
.card-tags{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0 4px}
.empty-state{padding:40px;text-align:center}
.empty-state h3{font-size:28px;margin-bottom:10px}
.pagination-pro{display:flex;align-items:center;justify-content:center;gap:8px;padding:14px}
.page-dots{display:inline-flex;align-items:center;justify-content:center;width:34px;color:rgba(255,255,255,.5)}
@media(max-width:1100px){.catalog-layout-pro{grid-template-columns:1fr}.alibaba-filters{position:relative;top:auto}.catalog-grid-pro{grid-template-columns:repeat(2,minmax(0,1fr))}.catalog-toolbar-pro{flex-direction:column}.catalog-view-note{text-align:left}}
@media(max-width:640px){.catalog-grid-pro{grid-template-columns:1fr}.filter-actions{grid-template-columns:1fr}.catalog-toolbar-pro h2{font-size:24px}}


/* RU/ZH language switcher */
.navbar{gap:16px}
.nav-actions{display:flex;align-items:center;gap:10px}
.lang-switch{display:flex;align-items:center;gap:6px}
.lang-switch a{display:inline-flex;align-items:center;justify-content:center;height:34px;padding:0 10px;border-radius:999px;border:1px solid rgba(255,255,255,.14);color:rgba(255,255,255,.78);text-decoration:none;font-weight:700;font-size:12px;background:rgba(255,255,255,.04)}
.lang-switch a.active{background:linear-gradient(135deg,#fdd966,#c4843d);color:#111827;border-color:rgba(253,217,102,.55)}
@media(max-width:900px){.navbar{flex-wrap:wrap}.nav-actions{width:100%;justify-content:flex-start}}


/* Admin and supplier cabinet */
.admin-form-grid .full,.form-grid .full{grid-column:1/-1}
input[type="file"]{width:100%;border-radius:14px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.04);color:#fff;padding:14px 16px}
.supplier-video{width:100%;border-radius:18px;border:1px solid rgba(255,255,255,.12);display:block;background:#000}
.nav-actions{display:flex;align-items:center;gap:10px}
@media(max-width:900px){.nav-actions{width:100%;justify-content:flex-start;flex-wrap:wrap}}

/* Version history badges */
.version-badge{display:inline-flex;padding:4px 9px;border-radius:999px;background:rgba(253,217,102,.1);color:#f6d37a;border:1px solid rgba(253,217,102,.18);font-size:12px;font-weight:700}


/* Supplier tier badges */
.tier-row{margin:12px 0}
.tier-badge{display:inline-flex;align-items:center;justify-content:center;min-height:30px;padding:0 12px;border-radius:999px;font-size:12px;font-weight:800;letter-spacing:.02em;border:1px solid rgba(255,255,255,.16)}
.tier-bronze{background:linear-gradient(135deg,rgba(196,132,61,.2),rgba(196,132,61,.08));color:#f0b77a;border-color:rgba(196,132,61,.34)}
.tier-silver{background:linear-gradient(135deg,rgba(226,232,240,.22),rgba(148,163,184,.08));color:#e5edf7;border-color:rgba(226,232,240,.32)}
.tier-gold{background:linear-gradient(135deg,rgba(253,217,102,.26),rgba(196,132,61,.10));color:#fdd966;border-color:rgba(253,217,102,.45);box-shadow:0 0 28px rgba(253,217,102,.12)}
.role-form{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:10px}
.role-form select{height:40px;border-radius:12px;background:rgba(255,255,255,.06);color:#fff;border:1px solid rgba(255,255,255,.14);padding:0 10px}
.role-form select option{background:#111827;color:#fff}


/* image missing fallback */
.supplier-cover-img.image-missing::after{
  content:"TRUST IMAGE";
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  height:100%;
  min-height:220px;
  color:#f6d37a;
  font-weight:800;
  letter-spacing:.08em;
}


/* TRUST mobile product/supplier card optimization */
.supplier-cover-img{
  overflow:hidden;
  position:relative;
  background:linear-gradient(145deg,rgba(255,255,255,.07),rgba(255,255,255,.025));
}
.supplier-cover-img img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  display:block;
}
.supplier-card{
  min-width:0;
}
.supplier-body h3,
.supplier-card h3{
  overflow-wrap:anywhere;
  word-break:normal;
  hyphens:auto;
}
.supplier-body p{
  overflow-wrap:anywhere;
}
.supplier-profile-grid,
.profile-grid,
.supplier-hero-grid{
  align-items:stretch;
}

@media (max-width: 768px){
  body{
    overflow-x:hidden;
  }

  .container{
    width:min(100% - 28px, 1200px);
  }

  .hero,
  .page-hero,
  section{
    padding-left:0;
    padding-right:0;
  }

  .hero-grid,
  .grid-2,
  .supplier-profile-grid,
  .profile-grid,
  .supplier-hero-grid,
  .catalog-layout-pro{
    grid-template-columns:1fr !important;
    gap:18px;
  }

  .glass,
  .card,
  .hero-copy,
  .hero-visual,
  .supplier-card{
    border-radius:22px;
  }

  .supplier-grid,
  .catalog-grid-pro{
    grid-template-columns:1fr !important;
    gap:18px;
  }

  .supplier-card{
    display:flex;
    flex-direction:column;
    width:100%;
    max-width:100%;
    overflow:hidden;
    padding:0;
  }

  .supplier-cover,
  .supplier-cover-img{
    width:100%;
    height:auto !important;
    min-height:0 !important;
    aspect-ratio:16/10;
    border-radius:20px 20px 0 0;
  }

  .supplier-cover-img img{
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center;
  }

  .supplier-body{
    padding:20px !important;
  }

  .supplier-body h3,
  .supplier-card h3{
    font-size:24px !important;
    line-height:1.18 !important;
    margin-bottom:12px !important;
    letter-spacing:-.02em;
  }

  .supplier-body p{
    font-size:15px !important;
    line-height:1.62 !important;
    margin-bottom:12px;
  }

  .supplier-meta,
  .hero-meta{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin:12px 0 16px;
  }

  .supplier-meta span,
  .hero-meta span{
    font-size:12px;
    line-height:1.2;
    padding:7px 10px;
    border-radius:999px;
    background:rgba(255,255,255,.055);
    border:1px solid rgba(255,255,255,.10);
  }

  .card-actions{
    display:flex;
    flex-direction:column;
    gap:10px;
    margin-top:18px;
  }

  .card-actions .btn,
  .btn-small{
    width:100%;
    min-height:46px;
    display:flex;
    align-items:center;
    justify-content:center;
    text-align:center;
    white-space:normal;
  }

  .page-hero h1,
  .hero-copy h1,
  .hero-box h1{
    font-size:36px !important;
    line-height:1.08 !important;
  }

  .page-hero p,
  .hero-copy p,
  .hero-box p{
    font-size:16px !important;
    line-height:1.62 !important;
  }

  .tier-row{
    margin:10px 0 12px;
  }

  .tier-badge{
    max-width:100%;
    white-space:normal;
    text-align:center;
  }

  .forum-gallery,
  .gallery-grid{
    grid-template-columns:1fr !important;
  }

  .forum-gallery img,
  .gallery-grid img{
    aspect-ratio:16/10;
    object-fit:cover;
  }
}

@media (max-width: 480px){
  .container{
    width:min(100% - 22px, 1200px);
  }

  .supplier-body{
    padding:18px !important;
  }

  .supplier-body h3,
  .supplier-card h3{
    font-size:22px !important;
  }

  .supplier-body p{
    font-size:14.5px !important;
    line-height:1.58 !important;
  }

  .supplier-cover,
  .supplier-cover-img{
    aspect-ratio:4/3;
  }

  .page-hero h1,
  .hero-copy h1,
  .hero-box h1{
    font-size:31px !important;
  }

  .btn{
    min-height:46px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    text-align:center;
  }
}


/* Header redesign: brand left, language + login right */
.site-header{
  position:sticky;
  top:0;
  z-index:100;
  backdrop-filter:blur(18px);
}
.header-top{
  min-height:72px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
}
.header-right{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:12px;
  margin-left:auto;
}
.header-nav-row{
  display:flex;
  justify-content:flex-end;
  padding-bottom:12px;
}
.nav-secondary{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:18px;
  flex-wrap:wrap;
}
.lang-switch-flags{
  display:flex;
  align-items:center;
  gap:8px;
}
.lang-switch-flags a{
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-height:40px;
  padding:0 12px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.05);
  color:rgba(255,255,255,.82);
  text-decoration:none;
  font-weight:800;
  font-size:13px;
}
.lang-switch-flags a.active{
  background:linear-gradient(135deg,#fdd966,#c4843d);
  color:#111827;
  border-color:rgba(253,217,102,.55);
}
.flag-circle{
  width:22px;
  height:22px;
  border-radius:50%;
  display:inline-block;
  box-shadow:0 0 0 2px rgba(255,255,255,.25);
  overflow:hidden;
  flex:0 0 22px;
}
.flag-ru{
  background:linear-gradient(to bottom,#fff 0 33.333%,#1c57a7 33.333% 66.666%,#d52b1e 66.666% 100%);
}
.flag-cn{
  background:#de2910;
  position:relative;
}
.flag-cn::before{
  content:"★";
  position:absolute;
  left:4px;
  top:0px;
  color:#ffde00;
  font-size:12px;
  line-height:22px;
}
.login-top-btn{
  min-width:94px;
}

/* Supplier page ordered blocks */
.supplier-section{
  scroll-margin-top:120px;
}
.supplier-profile-card{
  overflow:hidden;
}
.contacts-messengers-section .contact-list{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}
.qr-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
}
.qr-card{
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.04);
  border-radius:20px;
  padding:16px;
  display:grid;
  gap:10px;
  justify-items:center;
  text-align:center;
}
.qr-card img{
  width:100%;
  max-width:180px;
  aspect-ratio:1/1;
  object-fit:contain;
  border-radius:14px;
  background:#fff;
}

@media(max-width:900px){
  .header-top{
    min-height:66px;
    gap:10px;
  }
  .header-right{
    gap:8px;
  }
  .lang-switch-flags a{
    min-height:36px;
    padding:0 9px;
    font-size:12px;
  }
  .flag-circle{
    width:19px;
    height:19px;
    flex-basis:19px;
  }
  .flag-cn::before{
    font-size:10px;
    line-height:19px;
  }
  .login-top-btn{
    min-width:auto;
    padding-left:14px;
    padding-right:14px;
  }
  .header-nav-row{
    justify-content:flex-start;
    overflow-x:auto;
    padding-bottom:10px;
    -webkit-overflow-scrolling:touch;
  }
  .nav-secondary{
    flex-wrap:nowrap;
    min-width:max-content;
    gap:14px;
  }
  .contacts-messengers-section .contact-list,
  .qr-grid{
    grid-template-columns:1fr;
  }
}

@media(max-width:520px){
  .brand span:last-child{
    font-size:14px;
  }
  .brand-mark{
    width:38px;
    height:38px;
  }
  .header-top{
    align-items:center;
  }
  .header-right{
    gap:6px;
  }
  .lang-switch-flags{
    gap:5px;
  }
  .lang-switch-flags a{
    padding:0 7px;
  }
  .login-top-btn{
    min-height:36px;
    font-size:12px;
  }
}


/* =========================================================
   TRUST FINAL RESPONSIVE FIX
   Modern iPhone / Android / tablets responsive system
   ========================================================= */

:root{
  --container-pad: clamp(12px, 4vw, 32px);
  --section-gap: clamp(36px, 7vw, 92px);
  --card-radius-fluid: clamp(18px, 4vw, 30px);
  --card-pad-fluid: clamp(16px, 4vw, 30px);
  --h1-fluid: clamp(31px, 7vw, 64px);
  --h2-fluid: clamp(25px, 5vw, 44px);
  --h3-fluid: clamp(20px, 4vw, 28px);
  --text-fluid: clamp(14.5px, 2.5vw, 17px);
  --small-fluid: clamp(12px, 2.2vw, 14px);
}

html{-webkit-text-size-adjust:100%;text-size-adjust:100%;}
body{overflow-x:hidden;}
img,video,iframe{max-width:100%;}
.container{width:min(100% - (var(--container-pad) * 2),1200px);margin-inline:auto;}
section{padding-block:var(--section-gap);}

.glass,.card,.hero-copy,.hero-visual,.hero-box,.supplier-card{border-radius:var(--card-radius-fluid);}
.card,.hero-copy,.hero-box{padding:var(--card-pad-fluid);}
h1{font-size:var(--h1-fluid);line-height:1.07;letter-spacing:-.035em;}
h2{font-size:var(--h2-fluid);line-height:1.12;letter-spacing:-.025em;}
h3{font-size:var(--h3-fluid);line-height:1.18;}
p,.supplier-body p,.hero-copy p,.hero-box p{font-size:var(--text-fluid);line-height:1.62;}

.hero-grid,.grid-2,.grid-3,.platform-block,.supplier-profile-card,.catalog-layout-pro,.supplier-hero-grid,.profile-grid{min-width:0;}

.supplier-grid,.catalog-grid-pro{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));
  gap:clamp(16px,3vw,26px);
}
.grid-3{grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));}
.grid-2{grid-template-columns:repeat(auto-fit,minmax(min(100%,360px),1fr));}

.supplier-card{min-width:0;overflow:hidden;display:flex;flex-direction:column;}
.supplier-cover,.supplier-cover-img{
  width:100%;
  height:auto!important;
  min-height:0!important;
  aspect-ratio:16/10;
  overflow:hidden;
  border-radius:var(--card-radius-fluid) var(--card-radius-fluid) 0 0;
  background:linear-gradient(145deg,rgba(255,255,255,.07),rgba(255,255,255,.025));
}
.supplier-cover img,.supplier-cover-img img,.supplier-main-photo img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  display:block;
}
.supplier-main-photo{min-height:clamp(240px,48vw,520px);overflow:hidden;border-radius:var(--card-radius-fluid);}
.supplier-body{padding:clamp(16px,3.5vw,24px)!important;display:flex;flex-direction:column;flex:1;}
.supplier-body h3,.supplier-card h3{overflow-wrap:anywhere;word-break:normal;hyphens:auto;}
.supplier-body p{overflow-wrap:anywhere;}

.supplier-meta,.hero-meta{display:flex;flex-wrap:wrap;gap:8px;}
.supplier-meta span,.hero-meta span{
  font-size:var(--small-fluid);
  line-height:1.2;
  padding:7px 10px;
  border-radius:999px;
  background:rgba(255,255,255,.055);
  border:1px solid rgba(255,255,255,.10);
}

.card-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:auto;}
.card-actions .btn,.btn-small{min-height:42px;display:inline-flex;align-items:center;justify-content:center;text-align:center;}

.site-header{left:0;right:0;}
.header-top{flex-wrap:nowrap;}
.header-right{flex-shrink:0;}
.nav-secondary{overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;}
.nav-secondary::-webkit-scrollbar{display:none;}

@media (max-width:1024px){
  .hero-grid,.platform-block,.supplier-profile-card,.catalog-layout-pro{grid-template-columns:1fr!important;}
  .catalog-layout-pro .sidebar{position:relative;top:auto;}
  .supplier-grid,.catalog-grid-pro{grid-template-columns:repeat(2,minmax(0,1fr));}
}

@media (max-width:820px){
  .header-top{min-height:64px;}
  .header-nav-row{justify-content:flex-start;overflow-x:auto;}
  .nav-secondary{flex-wrap:nowrap;min-width:max-content;gap:14px;}
  .lang-switch-flags a{min-height:36px;padding-inline:9px;font-size:12px;}
  .flag-circle{width:19px;height:19px;flex-basis:19px;}
  .flag-cn::before{font-size:10px;line-height:19px;}
  .login-top-btn{min-height:36px;min-width:auto;padding-inline:14px;}
  .contacts-messengers-section .contact-list,.qr-grid,.forum-gallery,.gallery-grid{grid-template-columns:1fr!important;}
  .supplier-grid,.catalog-grid-pro{grid-template-columns:1fr!important;}
  .supplier-cover,.supplier-cover-img{aspect-ratio:4/3;}
  .supplier-main-photo{min-height:auto;aspect-ratio:4/3;}
  .card-actions{flex-direction:column;}
  .card-actions .btn,.btn-small,.btn{width:100%;min-height:46px;white-space:normal;}
}

@media (max-width:600px){
  :root{--container-pad:clamp(11px,4.2vw,18px);--section-gap:34px;}
  .brand span:last-child{font-size:14px;}
  .brand-mark{width:38px;height:38px;}
  .header-right{gap:6px;}
  .lang-switch-flags{gap:5px;}
  .lang-switch-flags a{padding-inline:7px;}
  .hero-meta span,.supplier-meta span{max-width:100%;}
  .supplier-body{padding:18px!important;}
  .supplier-body h3{font-size:22px!important;line-height:1.18!important;}
  .supplier-body p{font-size:14.5px!important;line-height:1.58!important;}
}

@media (max-width:390px){
  .lang-switch-flags a span:last-child{font-size:11px;}
  .flag-circle{width:18px;height:18px;flex-basis:18px;}
  .brand-mark{width:36px;height:36px;}
  .login-top-btn{padding-inline:11px;}
  h1{letter-spacing:-.04em;}
}

@media (max-width:340px){
  .header-top{gap:6px;}
  .brand span:last-child{display:none;}
  .lang-switch-flags a{padding-inline:6px;gap:5px;}
  .login-top-btn{padding-inline:9px;}
}

@media (max-height:480px) and (orientation:landscape){
  section{padding-block:28px;}
  .page-hero{padding-block:30px;}
  .supplier-profile-card{grid-template-columns:1.1fr .9fr!important;}
  .supplier-main-photo{min-height:260px;}
}

@media (min-width:821px) and (max-width:1180px){
  .supplier-grid,.catalog-grid-pro{grid-template-columns:repeat(2,minmax(0,1fr));}
  .supplier-profile-card{grid-template-columns:1fr 1fr!important;}
}


/* TRUST internal messenger */
.messenger-layout{display:grid;grid-template-columns:1fr;gap:22px}
.messenger-list{display:grid;gap:12px}
.messenger-thread-item{border-left:3px solid rgba(253,217,102,.45)}
.messenger-card{overflow:hidden}
.messenger-messages{display:flex;flex-direction:column;gap:14px;margin:20px 0}
.message-bubble{max-width:82%;padding:16px 18px;border-radius:20px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.045)}
.message-bubble.own{align-self:flex-end;background:linear-gradient(135deg,rgba(0,189,232,.14),rgba(253,217,102,.08));border-color:rgba(0,189,232,.22)}
.message-bubble.other{align-self:flex-start}
.message-meta{display:flex;flex-direction:column;gap:3px;margin-bottom:10px}
.message-meta span{font-size:12px;color:rgba(255,255,255,.55)}
.message-text{white-space:normal;overflow-wrap:anywhere;line-height:1.6}
.translation-box{margin-top:12px;padding:12px;border-radius:14px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.10)}
.translation-box summary{cursor:pointer;color:#f6d37a;font-weight:700}
.translation-pending{margin-top:10px;font-size:12px;color:rgba(255,255,255,.56)}
.message-attachments{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.message-attachments a{font-size:13px;color:#f6d37a;text-decoration:none;border:1px solid rgba(253,217,102,.18);border-radius:999px;padding:6px 10px}
.messenger-send-form{margin-top:22px;padding-top:20px;border-top:1px solid rgba(255,255,255,.10)}
@media(max-width:700px){.message-bubble{max-width:100%}.message-bubble.own,.message-bubble.other{align-self:stretch}}


/* =========================================================
   TRUST MODERN MESSENGER UI
   Telegram/WhatsApp-like interface
   ========================================================= */
.messenger-shell-section{
  padding-block:clamp(22px,4vw,42px);
}
.modern-messenger-shell{
  display:grid;
  grid-template-columns:360px minmax(0,1fr);
  gap:18px;
  min-height:calc(100vh - 170px);
}
.chat-sidebar{
  overflow:hidden;
  display:flex;
  flex-direction:column;
  min-height:620px;
}
.chat-sidebar-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:22px 22px 14px;
  border-bottom:1px solid rgba(255,255,255,.08);
}
.chat-sidebar-head h1{
  font-size:30px;
  margin:4px 0 0;
}
.chat-icon-btn{
  width:42px;
  height:42px;
  border-radius:50%;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.06);
  color:#fff;
  font-size:24px;
  font-weight:700;
  flex:0 0 42px;
}
.chat-icon-btn.primary{
  background:linear-gradient(135deg,#fdd966,#c4843d);
  color:#111827;
  border-color:rgba(253,217,102,.55);
}
.chat-search{
  padding:14px 18px;
}
.chat-search input{
  width:100%;
  height:44px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.055);
  color:#fff;
  padding:0 16px;
  outline:none;
}
.chat-list{
  overflow:auto;
  padding:4px 10px 14px;
  display:flex;
  flex-direction:column;
  gap:4px;
}
.chat-row{
  display:flex;
  gap:12px;
  align-items:center;
  padding:12px;
  border-radius:18px;
  text-decoration:none;
  color:#fff;
  transition:.18s ease;
}
.chat-row:hover,
.chat-row.active{
  background:rgba(255,255,255,.07);
}
.chat-avatar{
  width:48px;
  height:48px;
  border-radius:50%;
  flex:0 0 48px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:linear-gradient(135deg,rgba(0,189,232,.9),rgba(253,217,102,.8));
  color:#0f1938;
  font-weight:900;
  text-transform:uppercase;
  box-shadow:0 12px 28px rgba(0,0,0,.22);
}
.chat-avatar.big{
  width:54px;
  height:54px;
  flex-basis:54px;
}
.chat-row-main{
  min-width:0;
  flex:1;
}
.chat-row-top{
  display:flex;
  justify-content:space-between;
  gap:10px;
  align-items:center;
}
.chat-row-top strong{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:15px;
}
.chat-row-top span{
  font-size:12px;
  color:rgba(255,255,255,.55);
  flex:0 0 auto;
}
.chat-row-subtitle{
  font-size:12px;
  color:rgba(253,217,102,.75);
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  margin-top:2px;
}
.chat-row p{
  margin:3px 0 0;
  color:rgba(255,255,255,.58);
  font-size:13px;
  line-height:1.25;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.chat-empty-panel{
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  text-align:center;
  padding:40px;
  min-height:620px;
}
.chat-empty-illustration{
  width:92px;
  height:92px;
  border-radius:30px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:42px;
  background:rgba(255,255,255,.06);
  margin-bottom:20px;
}
.empty-chat-list{
  padding:28px;
  text-align:center;
  color:rgba(255,255,255,.7);
}
.empty-chat-list p{
  margin-top:8px;
  color:rgba(255,255,255,.55);
}

.chat-window{
  overflow:hidden;
  display:flex;
  flex-direction:column;
  min-height:620px;
}
.chat-window-head{
  display:flex;
  align-items:center;
  gap:14px;
  padding:18px 22px;
  border-bottom:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.025);
}
.chat-window-head h2{
  margin:0;
  font-size:22px;
}
.chat-window-head p{
  margin:4px 0 0;
  font-size:13px;
  color:rgba(255,255,255,.58);
}
.chat-back{
  display:none;
  color:#fff;
  text-decoration:none;
  font-size:24px;
}
.chat-messages{
  flex:1;
  overflow:auto;
  padding:24px;
  display:flex;
  flex-direction:column;
  gap:12px;
  background:
    radial-gradient(circle at 20% 10%,rgba(0,189,232,.08),transparent 32%),
    radial-gradient(circle at 80% 80%,rgba(253,217,102,.06),transparent 34%);
}
.chat-message{
  display:flex;
}
.chat-message.incoming{
  justify-content:flex-start;
}
.chat-message.outgoing{
  justify-content:flex-end;
}
.bubble{
  max-width:min(72%,680px);
  padding:12px 14px 9px;
  border-radius:20px;
  border:1px solid rgba(255,255,255,.10);
  box-shadow:0 12px 28px rgba(0,0,0,.14);
}
.chat-message.incoming .bubble{
  background:rgba(255,255,255,.075);
  border-bottom-left-radius:7px;
}
.chat-message.outgoing .bubble{
  background:linear-gradient(135deg,rgba(0,189,232,.25),rgba(253,217,102,.16));
  border-color:rgba(0,189,232,.22);
  border-bottom-right-radius:7px;
}
.bubble-text{
  color:#fff;
  line-height:1.5;
  overflow-wrap:anywhere;
  white-space:normal;
}
.bubble-actions{
  display:flex;
  justify-content:flex-end;
  gap:8px;
  align-items:center;
  margin-top:7px;
}
.bubble-actions span{
  color:rgba(255,255,255,.52);
  font-size:11px;
}
.translate-btn{
  width:27px;
  height:27px;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.08);
  color:#fff;
  cursor:pointer;
}
.inline-translation{
  display:none;
  margin-top:10px;
  padding-top:10px;
  border-top:1px dashed rgba(255,255,255,.18);
  color:rgba(255,255,255,.78);
  font-size:13px;
}
.inline-translation.show{
  display:block;
}
.inline-translation p{
  margin:0 0 6px;
  font-size:13px;
}
.bubble-attachments{
  margin-top:10px;
  display:flex;
  flex-wrap:wrap;
  gap:7px;
}
.bubble-attachments a{
  text-decoration:none;
  color:#fdd966;
  font-size:12px;
  padding:6px 9px;
  border-radius:999px;
  border:1px solid rgba(253,217,102,.22);
  background:rgba(253,217,102,.08);
}
.chat-compose{
  display:flex;
  align-items:flex-end;
  gap:10px;
  padding:14px 16px;
  border-top:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.025);
}
.attach-btn{
  width:44px;
  height:44px;
  border-radius:50%;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.06);
  color:#fff;
  flex:0 0 44px;
}
.attach-btn input{
  display:none;
}
.chat-compose textarea{
  flex:1;
  min-height:44px;
  max-height:120px;
  resize:none;
  border-radius:22px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.055);
  color:#fff;
  padding:12px 16px;
  outline:none;
  line-height:1.4;
}
.send-btn{
  min-height:44px;
  border:none;
  border-radius:999px;
  padding:0 18px;
  background:linear-gradient(135deg,#fdd966,#c4843d);
  color:#111827;
  font-weight:800;
  cursor:pointer;
  flex:0 0 auto;
}
.message-modal-card{
  max-width:760px;
  margin:0 auto;
  padding:26px;
}
.message-modal-head{
  display:flex;
  justify-content:space-between;
  gap:16px;
  align-items:flex-start;
  margin-bottom:22px;
}
.message-modal-head h1{
  margin:4px 0;
}
.message-modal-form{
  display:grid;
  gap:12px;
}
.message-modal-form input,
.message-modal-form textarea{
  width:100%;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.11);
  background:rgba(255,255,255,.055);
  color:#fff;
  padding:14px 16px;
  outline:none;
}
.message-modal-actions{
  display:flex;
  justify-content:space-between;
  gap:12px;
  align-items:center;
  margin-top:8px;
}
.modal-attach{
  width:auto;
  border-radius:999px;
  padding:0 16px;
  gap:8px;
}
@media(max-width:980px){
  .modern-messenger-shell{
    grid-template-columns:1fr;
  }
  .chat-sidebar{
    min-height:auto;
  }
  .chat-empty-panel{
    display:none;
  }
  .chat-window{
    min-height:calc(100vh - 170px);
  }
  .chat-back{
    display:inline-flex;
  }
  .messenger_shell_thread .chat-sidebar{
    display:none;
  }
}
@media(max-width:720px){
  .messenger-shell-section{
    padding-block:12px;
  }
  .modern-messenger-shell{
    min-height:calc(100vh - 110px);
  }
  .chat-sidebar,
  .chat-window{
    border-radius:20px;
    min-height:calc(100vh - 130px);
  }
  .chat-window-head{
    padding:14px;
  }
  .chat-messages{
    padding:16px 12px;
  }
  .bubble{
    max-width:86%;
  }
  .chat-compose{
    padding:10px;
  }
  .send-btn{
    padding:0 13px;
  }
  .message-modal-card{
    padding:18px;
  }
}


/* =========================================================
   TRUST MESSENGER FINAL RESPONSIVE UI
   Desktop: sidebar + current chat.
   Mobile: list and thread as separate clean screens.
   ========================================================= */

/* remove old messenger conflicts */
.trust-chat-page .modern-messenger-shell,
.trust-chat-page .chat-sidebar,
.trust-chat-page .chat-window,
.trust-chat-page .messenger-card,
.trust-chat-page .message-bubble,
.trust-chat-page .chat-compose{
  all: unset;
}

.trust-chat-page{
  min-height:100vh;
  overflow-x:hidden;
  background:
    radial-gradient(circle at top left, rgba(0,189,232,.12), transparent 34%),
    radial-gradient(circle at bottom right, rgba(253,217,102,.10), transparent 30%),
    #081120;
}

.trust-chat-wrap{
  width:min(100% - 28px, 1240px);
  margin:18px auto 34px;
}

.trust-chat-shell{
  height:calc(100vh - 170px);
  min-height:640px;
  display:grid;
  grid-template-columns:360px minmax(0, 1fr);
  overflow:hidden;
  border:1px solid rgba(255,255,255,.12);
  border-radius:28px;
  background:rgba(11,19,38,.72);
  backdrop-filter:blur(20px);
  box-shadow:0 28px 80px rgba(0,0,0,.35);
}

.trust-chat-sidebar{
  display:flex;
  flex-direction:column;
  min-width:0;
  border-right:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.035);
  overflow:hidden;
}

.trust-chat-sidebar-header{
  min-height:94px;
  padding:22px 20px 14px;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
  border-bottom:1px solid rgba(255,255,255,.08);
}

.trust-chat-sidebar-header h1{
  margin:4px 0 0;
  font-size:32px;
  line-height:1.05;
  letter-spacing:-.03em;
}

.trust-chat-new{
  width:42px;
  height:42px;
  border-radius:14px;
  display:flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
  background:linear-gradient(135deg,#fdd966,#c4843d);
  color:#121827;
  font-size:26px;
  font-weight:900;
  flex:0 0 42px;
}

.trust-chat-search{
  padding:14px 16px;
  border-bottom:1px solid rgba(255,255,255,.06);
}

.trust-chat-search input{
  width:100%;
  height:42px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.11);
  background:rgba(255,255,255,.075);
  color:#fff;
  padding:0 14px;
  outline:none;
  font-size:15px;
}

.trust-chat-search input::placeholder,
.trust-chat-compose textarea::placeholder{
  color:rgba(255,255,255,.45);
}

.trust-chat-list{
  flex:1;
  overflow-y:auto;
  padding:8px;
  display:flex;
  flex-direction:column;
  gap:4px;
}

.trust-chat-item{
  display:flex;
  align-items:center;
  gap:12px;
  min-height:72px;
  padding:11px 10px;
  border-radius:18px;
  text-decoration:none;
  color:#fff;
  transition:.16s ease;
}

.trust-chat-item:hover,
.trust-chat-item.active{
  background:rgba(255,255,255,.08);
}

.trust-avatar{
  width:48px;
  height:48px;
  border-radius:50%;
  flex:0 0 48px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:linear-gradient(135deg,#00bde8,#fdd966);
  color:#101827;
  font-weight:900;
  font-size:18px;
  box-shadow:0 10px 24px rgba(0,0,0,.22);
  overflow:hidden;
}

.trust-avatar-large{
  width:50px;
  height:50px;
  flex-basis:50px;
}

.trust-chat-item-main{
  min-width:0;
  flex:1;
}

.trust-chat-item-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
}

.trust-chat-item-top strong{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:15.5px;
  line-height:1.2;
}

.trust-chat-item-top span{
  color:rgba(255,255,255,.48);
  font-size:12px;
  flex:0 0 auto;
}

.trust-chat-item p{
  margin:5px 0 0;
  color:rgba(255,255,255,.55);
  font-size:13.5px;
  line-height:1.25;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.trust-chat-placeholder{
  display:flex;
  align-items:center;
  justify-content:center;
  min-width:0;
}

.trust-chat-placeholder-inner{
  max-width:430px;
  text-align:center;
  padding:36px;
}

.trust-chat-placeholder-icon{
  width:88px;
  height:88px;
  border-radius:28px;
  background:rgba(255,255,255,.06);
  display:flex;
  align-items:center;
  justify-content:center;
  margin:0 auto 18px;
  font-size:40px;
}

.trust-chat-placeholder h2{
  margin:0 0 10px;
  font-size:30px;
}

.trust-chat-placeholder p,
.trust-chat-empty-small p{
  color:rgba(255,255,255,.58);
  line-height:1.55;
}

.trust-chat-empty-small{
  padding:24px;
  text-align:center;
  color:rgba(255,255,255,.70);
}

.trust-chat-window{
  display:grid;
  grid-template-rows:auto 1fr auto;
  min-width:0;
  min-height:0;
  background:
    radial-gradient(circle at 15% 10%,rgba(0,189,232,.08),transparent 28%),
    radial-gradient(circle at 85% 90%,rgba(253,217,102,.06),transparent 30%);
}

.trust-chat-header{
  min-height:76px;
  display:flex;
  align-items:center;
  gap:12px;
  padding:12px 18px;
  border-bottom:1px solid rgba(255,255,255,.10);
  background:rgba(7,13,27,.55);
  min-width:0;
}

.trust-chat-back{
  width:38px;
  height:38px;
  border-radius:50%;
  display:none;
  align-items:center;
  justify-content:center;
  color:#fff;
  text-decoration:none;
  background:rgba(255,255,255,.065);
  font-size:30px;
  line-height:1;
  flex:0 0 38px;
}

.trust-chat-title{
  min-width:0;
}

.trust-chat-title h2{
  margin:0;
  font-size:21px;
  line-height:1.15;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.trust-chat-title p{
  margin:4px 0 0;
  color:rgba(255,255,255,.55);
  font-size:13px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.trust-chat-messages{
  min-height:0;
  overflow-y:auto;
  padding:22px 22px 18px;
  display:flex;
  flex-direction:column;
  gap:10px;
}

.trust-chat-date{
  align-self:center;
  padding:5px 11px;
  border-radius:999px;
  background:rgba(255,255,255,.10);
  color:rgba(255,255,255,.65);
  font-size:12px;
  margin:6px 0;
}

.trust-message-row{
  display:flex;
  width:100%;
}

.trust-message-row.in{
  justify-content:flex-start;
}

.trust-message-row.out{
  justify-content:flex-end;
}

.trust-message-bubble{
  max-width:min(68%, 680px);
  padding:11px 13px 8px;
  border-radius:19px;
  color:#fff;
  box-shadow:0 10px 28px rgba(0,0,0,.16);
  border:1px solid rgba(255,255,255,.10);
}

.trust-message-row.in .trust-message-bubble{
  background:rgba(255,255,255,.095);
  border-bottom-left-radius:6px;
}

.trust-message-row.out .trust-message-bubble{
  background:linear-gradient(135deg,rgba(0,121,255,.95),rgba(0,189,232,.72));
  border-color:rgba(0,189,232,.20);
  border-bottom-right-radius:6px;
}

.trust-message-author{
  color:#fdd966;
  font-weight:800;
  font-size:13px;
  margin-bottom:4px;
}

.trust-message-text{
  font-size:15.5px;
  line-height:1.45;
  overflow-wrap:anywhere;
  white-space:normal;
}

.trust-message-files{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  margin-top:9px;
}

.trust-message-files a{
  color:#fff;
  text-decoration:none;
  font-size:12px;
  padding:6px 9px;
  border-radius:999px;
  background:rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.13);
}

.trust-message-meta{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:7px;
  margin-top:5px;
  color:rgba(255,255,255,.58);
  font-size:11px;
}

.trust-checks{
  color:rgba(255,255,255,.82);
}

.trust-translate-btn{
  width:25px;
  height:25px;
  border:0;
  border-radius:50%;
  background:rgba(255,255,255,.18);
  color:#fff;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:13px;
}

.trust-translation{
  display:none;
  margin-top:9px;
  padding-top:9px;
  border-top:1px dashed rgba(255,255,255,.24);
  color:rgba(255,255,255,.78);
}

.trust-translation.show{
  display:block;
}

.trust-translation p{
  margin:0 0 6px;
  font-size:13px;
  line-height:1.4;
}

.trust-chat-compose{
  min-height:70px;
  padding:12px 14px;
  display:flex;
  align-items:flex-end;
  gap:10px;
  border-top:1px solid rgba(255,255,255,.10);
  background:rgba(7,13,27,.72);
}

.trust-attach{
  width:44px;
  height:44px;
  flex:0 0 44px;
  border-radius:50%;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.10);
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  font-size:22px;
}

.trust-attach input{
  display:none;
}

.trust-chat-compose textarea{
  flex:1;
  width:auto;
  min-width:0;
  min-height:44px;
  max-height:110px;
  resize:none;
  border:1px solid rgba(255,255,255,.10);
  border-radius:22px;
  background:rgba(255,255,255,.08);
  color:#fff;
  padding:12px 16px;
  outline:none;
  line-height:1.35;
  font-size:15px;
}

.trust-send-btn{
  width:46px;
  height:46px;
  flex:0 0 46px;
  border:0;
  border-radius:50%;
  background:linear-gradient(135deg,#fdd966,#c4843d);
  color:#111827;
  font-size:20px;
  font-weight:900;
  cursor:pointer;
}

/* modal create message */
.message-modal-card{
  width:min(100% - 28px, 720px);
  margin:24px auto;
  border-radius:28px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(11,19,38,.82);
  backdrop-filter:blur(20px);
  padding:24px;
}
.message-modal-head{
  display:flex;
  justify-content:space-between;
  gap:14px;
  margin-bottom:18px;
}
.message-modal-form{
  display:grid;
  gap:12px;
}
.message-modal-form input,
.message-modal-form textarea{
  width:100%;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.11);
  background:rgba(255,255,255,.075);
  color:#fff;
  padding:13px 15px;
  outline:none;
}
.message-modal-actions{
  display:flex;
  justify-content:space-between;
  gap:12px;
  align-items:center;
}
.modal-attach{
  width:auto;
  height:44px;
  border-radius:999px;
  padding:0 16px;
  gap:8px;
}

/* Desktop only */
@media (min-width: 901px){
  .trust-chat-list-page .trust-chat-shell{
    grid-template-columns:360px minmax(0, 1fr);
  }
}

/* Tablet and mobile */
@media (max-width: 900px){
  .trust-chat-wrap{
    width:min(100% - 18px, 760px);
    margin:10px auto 22px;
  }

  .trust-chat-shell{
    height:auto;
    min-height:calc(100vh - 135px);
    display:block;
    border-radius:22px;
  }

  .trust-chat-list-page .trust-chat-placeholder{
    display:none;
  }

  .trust-chat-thread-page .trust-chat-desktop-only{
    display:none;
  }

  .trust-chat-thread-page .trust-chat-shell{
    display:block;
  }

  .trust-chat-window{
    min-height:calc(100vh - 135px);
    height:calc(100vh - 135px);
    display:grid;
    grid-template-rows:auto 1fr auto;
  }

  .trust-chat-sidebar{
    border-right:0;
    min-height:calc(100vh - 135px);
  }

  .trust-chat-back{
    display:flex;
  }
}

/* Phones */
@media (max-width: 600px){
  .trust-chat-wrap{
    width:100%;
    margin:0;
  }

  .trust-chat-shell{
    border-radius:0;
    border-left:0;
    border-right:0;
    min-height:calc(100vh - 116px);
    box-shadow:none;
  }

  .trust-chat-sidebar{
    min-height:calc(100vh - 116px);
  }

  .trust-chat-sidebar-header{
    min-height:74px;
    padding:16px 16px 10px;
  }

  .trust-chat-sidebar-header h1{
    font-size:30px;
  }

  .trust-chat-search{
    padding:10px 14px;
  }

  .trust-chat-list{
    padding:5px 8px 12px;
  }

  .trust-chat-item{
    min-height:68px;
    border-radius:16px;
  }

  .trust-chat-window{
    height:calc(100vh - 116px);
    min-height:calc(100vh - 116px);
  }

  .trust-chat-header{
    min-height:64px;
    padding:8px 10px;
  }

  .trust-avatar{
    width:44px;
    height:44px;
    flex-basis:44px;
  }

  .trust-avatar-large{
    width:42px;
    height:42px;
    flex-basis:42px;
  }

  .trust-chat-title h2{
    font-size:17px;
  }

  .trust-chat-title p{
    font-size:11.5px;
  }

  .trust-chat-messages{
    padding:14px 10px 12px;
    gap:8px;
  }

  .trust-message-bubble{
    max-width:82%;
    padding:10px 12px 7px;
    border-radius:17px;
  }

  .trust-message-text{
    font-size:15px;
  }

  .trust-chat-compose{
    min-height:62px;
    padding:9px 9px calc(9px + env(safe-area-inset-bottom));
    gap:8px;
  }

  .trust-attach{
    width:40px;
    height:40px;
    flex-basis:40px;
  }

  .trust-chat-compose textarea{
    min-height:40px;
    border-radius:20px;
    padding:10px 13px;
    font-size:15px;
  }

  .trust-send-btn{
    width:42px;
    height:42px;
    flex-basis:42px;
  }

  .message-modal-card{
    width:100%;
    min-height:calc(100vh - 116px);
    margin:0;
    border-radius:0;
    border-left:0;
    border-right:0;
  }
}

/* Very small phones */
@media (max-width: 380px){
  .trust-message-bubble{
    max-width:88%;
  }
  .trust-chat-item-top strong{
    font-size:14px;
  }
  .trust-chat-item p{
    font-size:12.5px;
  }
}