/* Общие стили макетов «Список экспертов» — дизайн-система Кабинета ОСА (osa-lk.ru):
   золото #DC9C00 на чернильном #17181C, фон #F5F6F8, шрифт Lato (латиница/цифры), кириллица — системный.
   Токены и компоненты повторяют cabinet/web/assets/style.css ЛК, чтобы страница читалась как продолжение кабинета. */
@font-face { font-family:'Lato'; font-style:normal; font-weight:400; font-display:swap; src:url('fonts/lato-400-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family:'Lato'; font-style:normal; font-weight:400; font-display:swap; src:url('fonts/lato-400-latin-ext.woff2') format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family:'Lato'; font-style:normal; font-weight:700; font-display:swap; src:url('fonts/lato-700-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family:'Lato'; font-style:normal; font-weight:700; font-display:swap; src:url('fonts/lato-700-latin-ext.woff2') format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family:'Lato'; font-style:normal; font-weight:900; font-display:swap; src:url('fonts/lato-900-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }

:root {
  --gold:#DC9C00; --gold-lt:#F2B62A; --gold-wash:#FDF6E6; --gold-line:#EED9A0;
  --ink:#17181C; --ink-2:#1F2126; --sidebar:#1F2126;
  --page:#F5F6F8; --bg:#F5F6F8; --line:#E6E8EC; --line-soft:#EFF1F4; --line-strong:#DAD9D2;
  --text:#1B1D22; --strong:#17181C; --muted:#6E747F; --muted-2:#9AA0AB; --dim:#6E747F; --label:#3A3E46;
  --red:#B3271B; --red-bg:#FBEAE8; --red-line:#F3D2CE;
  --green:#147D46; --green-bg:#E7F4EC; --green-line:#CFE8D7;
  --warn:#9A6A00; --warn-bg:#FBF3DD;
  --card:#fff; --card-2:#FAFBFC; --hover:#FCFBF7; --field:#fff; --chip:#EEF0F3; --chip-ink:#61666F;
  --pop:#17181C; --pop-ink:#fff; --topbar:rgba(255,255,255,.92);
  --av1:#DFE8F6; --av1-ink:#34558A; --av2:#DDEFE2; --av2-ink:#2C6B44; --av3:#EAE2F3; --av3-ink:#654A8A;
  --av4:#F6E3DC; --av4-ink:#9A4A2E; --av5:#DCEFF0; --av5-ink:#23696E; --av6:#F6E0E6; --av6-ink:#99405A; --av7:#E4E7ED; --av7-ink:#4B5364;
  --r:14px;
  --sh:0 1px 2px rgba(20,22,28,.05), 0 10px 26px -14px rgba(20,22,28,.16);
  --sh-lift:0 2px 4px rgba(20,22,28,.06), 0 16px 34px -16px rgba(20,22,28,.24);
  color-scheme:light;
}
html[data-theme="dark"] {
  --gold-wash:rgba(220,156,0,.14); --gold-line:#55471F;
  --page:#16181C; --bg:#16181C; --line:#2B2D33; --line-soft:#24262B; --line-strong:#3C3F46;
  --text:#E4E2DD; --strong:#F2F0EB; --muted:#9CA1AB; --muted-2:#71767F; --dim:#9CA1AB; --label:#C9CDD4;
  --red:#E4685C; --red-bg:#37211E; --red-line:#55302B; --green:#53C083; --green-bg:#1B2F24; --green-line:#2C4A38;
  --warn:#D9A62E; --warn-bg:#332B18;
  --card:#1C1E22; --card-2:#212328; --hover:#23252B; --field:#16171B; --chip:#2A2C32; --chip-ink:#B9BEC7;
  --pop:#2E3036; --topbar:rgba(22,24,28,.88);
  --av1:#2A3B57; --av1-ink:#B9CFF0; --av2:#24402F; --av2-ink:#A9DDB9; --av3:#3A2F4E; --av3-ink:#CDB9EA;
  --av4:#4A2E25; --av4-ink:#F0BCA9; --av5:#1F3F42; --av5-ink:#A6DCDF; --av6:#472A34; --av6-ink:#F0B6C6; --av7:#33373F; --av7-ink:#C3C8D2;
  --sh:0 1px 2px rgba(0,0,0,.5), 0 10px 26px -14px rgba(0,0,0,.7);
  --sh-lift:0 2px 4px rgba(0,0,0,.5), 0 16px 34px -16px rgba(0,0,0,.8);
  color-scheme:dark;
}

* { box-sizing:border-box; }
html { height:100%; scroll-behavior:smooth; }
body { margin:0; min-height:100%; font-family:'Lato',-apple-system,'Segoe UI',sans-serif; background:var(--page); color:var(--text);
  font-size:15px; line-height:1.55; -webkit-font-smoothing:antialiased; }
a { color:inherit; }
h1,h2,h3,h4 { line-height:1.22; font-weight:400; letter-spacing:-.01em; }
h1 { font-size:30px; margin:0 0 10px; }
h2 { font-size:18px; margin:0 0 12px; }
h3 { font-size:15.5px; margin:0 0 8px; }
p { margin:0 0 .75em; } p:last-child { margin-bottom:0; }
[hidden] { display:none !important; }
.ico { display:inline-flex; align-items:center; justify-content:center; line-height:0; }
.ico svg { width:1em; height:1em; display:block; }
i[data-ic]:not(.ico) { visibility:hidden; }

/* ─── шапка сайта (тёмная, как меню ЛК) ─── */
.site-head { background:var(--ink); color:#fff; position:sticky; top:0; z-index:50; border-bottom:1px solid rgba(255,255,255,.08); }
.site-head .wrap { max-width:1180px; margin:0 auto; padding:0 30px; height:64px; display:flex; align-items:center; gap:18px; }
.site-head .logo { display:flex; align-items:center; gap:12px; text-decoration:none; flex-shrink:0; }
.site-head .logo img { height:34px; width:auto; display:block; }
.site-head nav { display:flex; gap:2px; margin-left:auto; align-items:center; }
.site-head nav a { color:rgba(255,255,255,.72); text-decoration:none; font-size:14px; padding:8px 12px; border-radius:9px; white-space:nowrap; transition:.14s; }
.site-head nav a:hover { background:rgba(255,255,255,.07); color:#fff; }
.site-head nav a.on { background:rgba(220,156,0,.16); color:#fff; }
.site-head nav a.cta { background:var(--gold); color:#fff; margin-left:8px; }
.site-head nav a.cta:hover { background:var(--gold-lt); }
.site-head .burger { display:none; width:40px; height:40px; border-radius:10px; border:1px solid rgba(255,255,255,.18); background:none; color:#fff; font-size:17px; cursor:pointer; margin-left:auto; }
.site-head .lkbtn { display:inline-flex; align-items:center; gap:8px; color:#fff; text-decoration:none; font-size:13px; border:1px solid rgba(255,255,255,.18); border-radius:10px; padding:7px 12px; white-space:nowrap; min-height:38px; }
.site-head .lkbtn .ico { color:var(--gold-lt); font-size:15px; }
.site-head .lkbtn:hover { border-color:rgba(255,255,255,.45); }
@media (max-width:980px) {
  .site-head .wrap { padding:0 14px; gap:10px; }
  .site-head .logo img { height:28px; }
  .site-head nav { display:none; position:absolute; left:0; right:0; top:64px; background:var(--ink); flex-direction:column; align-items:stretch; padding:10px 16px 16px; gap:4px; border-bottom:1px solid rgba(255,255,255,.1); }
  .site-head nav.open { display:flex; }
  .site-head nav a { padding:12px 12px; font-size:15px; }
  .site-head nav a.cta { margin:8px 0 0; text-align:center; }
  .site-head .burger { display:block; }
  .site-head .lkbtn { margin-left:auto; padding:7px 9px; }
  .site-head .lkbtn span { display:none; }
  .site-head .burger { margin-left:0; }
}

/* ─── тело страницы ─── */
.page { max-width:1180px; margin:0 auto; padding:26px 30px 90px; }
.crumbs { margin:0 0 8px; font-size:12px; text-transform:uppercase; letter-spacing:.08em; color:var(--muted-2); }
.crumbs a { color:var(--muted-2); text-decoration:none; } .crumbs a:hover { color:var(--gold); }
.lead { color:var(--muted); font-size:15px; max-width:760px; }
.page-h { display:flex; align-items:flex-end; gap:20px; flex-wrap:wrap; margin-bottom:22px; }
.page-h .grow { flex:1; min-width:260px; }
.stats { display:flex; gap:18px; flex-wrap:wrap; }
.stat { display:flex; flex-direction:column; }
.stat .n { font-size:26px; line-height:1.1; letter-spacing:-.02em; } .stat .n.gold { color:var(--gold); }
.stat .l { font-size:12.5px; color:var(--muted); }
.hint { font-size:12.5px; color:var(--muted); }
.dim { color:var(--muted); font-size:13px; }
.nowrap { white-space:nowrap; }
.mt { margin-top:22px; }

/* ─── карточки ─── */
.card { background:var(--card); border:1px solid var(--line); border-radius:var(--r); padding:20px 22px; box-shadow:var(--sh); }
.cards { display:grid; grid-template-columns:repeat(auto-fill, minmax(320px,1fr)); gap:18px; align-items:start; }
.card-h { display:flex; align-items:center; gap:12px; margin-bottom:14px; }
.card-h h2 { margin:0; }
.card-h .more { margin-left:auto; font-size:13px; color:var(--gold); text-decoration:none; white-space:nowrap; }
.card-h .more:hover { text-decoration:underline; }
a.card { color:inherit; text-decoration:none; transition:.17s; display:block; }
a.card:hover, .card.hover:hover { transform:translateY(-2px); box-shadow:var(--sh-lift); border-color:var(--line-strong); }
/* тёмная визитка (как карточка члена на Главной ЛК) */
.member-card { background:linear-gradient(118deg,#17181C 0%,#24231C 58%,#2E2A18 100%); color:#fff; border-radius:var(--r); padding:24px 26px; position:relative; overflow:hidden; box-shadow:var(--sh); }
.member-card::after { content:''; position:absolute; right:-50px; top:-70px; width:240px; height:240px; border:14px solid rgba(220,156,0,.13); border-radius:50%; }
.member-card::before { content:''; position:absolute; right:60px; bottom:-90px; width:150px; height:150px; border:10px solid rgba(220,156,0,.07); border-radius:50%; }
.member-card > * { position:relative; z-index:1; }
.member-card .k { font-size:10.5px; text-transform:uppercase; letter-spacing:.11em; color:rgba(255,255,255,.45); margin-bottom:3px; }
.member-card .v { font-size:17px; } .member-card .v.gold { color:var(--gold-lt); }

/* ─── формы и фильтры ─── */
label { display:block; margin:0 0 14px; font-size:12.5px; color:var(--label); }
input[type=text], input[type=search], input:not([type]), select, textarea {
  display:block; width:100%; margin-top:6px; padding:10px 13px; border:1px solid var(--line); border-radius:10px;
  font-family:inherit; font-size:14.5px; background:var(--field); color:var(--text); min-height:44px; }
input:focus, select:focus, textarea:focus { outline:3px solid rgba(220,156,0,.18); border-color:var(--gold); }
.filters { display:flex; gap:10px; margin-bottom:16px; align-items:center; flex-wrap:wrap; }
.filters input, .filters select { width:auto; margin-top:0; min-width:0; max-width:100%; }
.filters input[type=search], .filters input[type=text], .filters input:not([type]) { flex:1 1 220px; min-width:0; }
.search { position:relative; flex:1 1 240px; min-width:0; }
.search .ico { position:absolute; left:12px; top:50%; transform:translateY(-50%); color:var(--muted-2); font-size:16px; pointer-events:none; }
.search input { padding-left:36px; width:100%; margin-top:0; }
label.chk { display:flex; gap:9px; align-items:flex-start; font-size:13.5px; color:var(--text); margin:0 0 6px; cursor:pointer; }
label.chk input { width:auto; margin:3px 0 0; accent-color:var(--gold); min-height:0; }
@media (max-width:820px) { .filters select { flex:1 1 100%; } .filters .btn { flex:1 1 auto; } }

/* ─── кнопки ─── */
.btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; background:var(--gold); color:#fff; border:1px solid transparent; cursor:pointer;
  font-family:inherit; font-size:14px; padding:10px 18px; border-radius:10px; text-decoration:none; transition:.15s; white-space:nowrap; min-height:44px; }
.btn:hover { background:var(--pop); }
.btn.ghost { background:var(--card); color:var(--text); border-color:var(--line); }
.btn.ghost:hover { background:var(--card); border-color:var(--strong); color:var(--strong); }
.btn.sm { padding:7px 13px; font-size:13px; border-radius:9px; min-height:36px; }
.btn.wide { width:100%; }
.linkbtn { background:none; border:none; color:inherit; font-family:inherit; font-size:13px; cursor:pointer; text-decoration:underline; padding:2px 4px; }
.linkbtn:hover { color:var(--gold); }
/* пилюли-фильтры (как категории в Магазине ЛК) */
.cats { display:flex; gap:8px; flex-wrap:wrap; margin:0 0 14px; }
.catbtn { border:1px solid var(--line); background:var(--card); color:var(--text); font-family:inherit; font-size:13px; border-radius:999px; padding:7px 13px; cursor:pointer; display:inline-flex; align-items:center; gap:7px; min-height:36px; }
.catbtn:hover { border-color:var(--strong); }
.catbtn.on { background:var(--gold-wash); border-color:var(--gold); }
.catbtn .n { font-size:12px; color:var(--muted); }
.catbtn .ico { font-size:15px; color:var(--gold); }

/* ─── таблицы ─── */
.tbl { width:100%; border-collapse:collapse; background:var(--card); border:1px solid var(--line); border-radius:12px; overflow:hidden; box-shadow:var(--sh); font-size:14px; }
.tbl th { text-align:left; font-size:10.5px; text-transform:uppercase; letter-spacing:.1em; color:var(--muted-2); font-weight:400; padding:11px 16px; border-bottom:1px solid var(--line); background:var(--card-2); }
.tbl th a { color:inherit; text-decoration:none; } .tbl th a:hover { color:var(--gold); }
.tbl td { padding:12px 16px; border-bottom:1px solid var(--line-soft); vertical-align:middle; }
.tbl tr:last-child td { border-bottom:none; }
.tbl tbody tr:hover td { background:var(--hover); }
.tblwrap { overflow-x:auto; border-radius:12px; }
@media (max-width:980px) {
  .tblwrap { overflow:visible; }
  .tbl.stack { display:block; background:none; border:none; box-shadow:none; }
  .tbl.stack thead { display:none; }
  .tbl.stack tbody, .tbl.stack tr, .tbl.stack td { display:block; }
  .tbl.stack tr { background:var(--card); border:1px solid var(--line); border-radius:12px; box-shadow:var(--sh); margin-bottom:10px; padding:6px 14px 10px; }
  .tbl.stack tbody tr:hover td { background:none; }
  .tbl.stack td { display:flex; gap:12px; padding:7px 0; min-width:0; border-bottom:1px solid var(--line-soft); }
  .tbl.stack td:last-child { border-bottom:none; }
  .tbl.stack td > * { min-width:0; flex:1 1 auto; }
  .tbl.stack td::before { content:attr(data-th); font-size:11px; text-transform:uppercase; letter-spacing:.06em; color:var(--muted-2); flex:0 0 96px; padding-top:2px; }
  .tbl.stack td[data-th=""]::before, .tbl.stack td:not([data-th])::before { display:none; }
}

/* ─── бирки и плашки ─── */
.tag { display:inline-flex; align-items:center; gap:6px; background:var(--chip); color:var(--chip-ink); border-radius:20px; padding:2px 10px; font-size:12px; white-space:nowrap; }
.tag::before { content:''; width:6px; height:6px; border-radius:50%; background:currentColor; flex:0 0 6px; }
.tag.red { background:var(--red-bg); color:var(--red); }
.tag.green { background:var(--green-bg); color:var(--green); }
.tag.gold { background:var(--gold-wash); color:var(--gold); }
.tag.warn { background:var(--warn-bg); color:var(--warn); }
.chip { display:inline-flex; align-items:center; gap:6px; font-size:13px; background:var(--gold-wash); border:1px solid var(--line); border-radius:999px; padding:3px 12px; }

/* ─── специализация: бирка с иконкой. .a — «Выездные работы» (золото), .b — «Поддержка и снабжение» (серо-синее) ─── */
.sp { display:inline-flex; align-items:center; gap:7px; font-size:12.5px; line-height:1.3; border-radius:999px; padding:4px 11px 4px 8px;
  border:1px solid var(--line); background:var(--card-2); color:var(--text); white-space:nowrap; max-width:100%; }
.sp .ico { font-size:14px; flex:0 0 auto; }
.sp.a { background:var(--gold-wash); border-color:var(--gold-line); } .sp.a .ico { color:var(--gold); }
.sp.b { background:var(--av1); border-color:transparent; color:var(--av1-ink); } .sp.b .ico { color:var(--av1-ink); }
.sp.on { outline:2px solid var(--gold); outline-offset:1px; }
.sp.wrap { white-space:normal; }
.sps { display:flex; flex-wrap:wrap; gap:6px; }
/* на телефоне бирки всегда переносятся по словам, иначе вылезают за экран */
@media (max-width:820px) { .sp { white-space:normal; } .sps { min-width:0; } }
/* полные названия длинные — в бирках переносим по словам */
.sps.long .sp { white-space:normal; }
.cat-h { font-size:10.5px; text-transform:uppercase; letter-spacing:.11em; color:var(--muted-2); margin:10px 0 6px; }
.cat-h.a { color:var(--gold); } .cat-h.b { color:var(--av1-ink); }
/* значок-квадратик специализации без текста (для компактных вариантов) */
.spi { width:32px; height:32px; border-radius:9px; display:inline-grid; place-items:center; font-size:17px; border:1px solid var(--line); background:var(--card-2); color:var(--muted); }
.spi.a { background:var(--gold-wash); border-color:var(--gold-line); color:var(--gold); }
.spi.b { background:var(--av1); border-color:transparent; color:var(--av1-ink); }
.spi.off { opacity:.28; }

/* ─── аватар-инициалы (семь пар, как в беседах ЛК) ─── */
.ava { width:44px; height:44px; border-radius:12px; display:inline-grid; place-items:center; font-size:15px; letter-spacing:.02em; flex:0 0 44px; }
.ava.lg { width:64px; height:64px; border-radius:16px; font-size:21px; flex-basis:64px; }
.ava.sm { width:34px; height:34px; border-radius:9px; font-size:12.5px; flex-basis:34px; }
.ava.c1 { background:var(--av1); color:var(--av1-ink); } .ava.c2 { background:var(--av2); color:var(--av2-ink); }
.ava.c3 { background:var(--av3); color:var(--av3-ink); } .ava.c4 { background:var(--av4); color:var(--av4-ink); }
.ava.c5 { background:var(--av5); color:var(--av5-ink); } .ava.c6 { background:var(--av6); color:var(--av6-ink); }
.ava.c7 { background:var(--av7); color:var(--av7-ink); }
.ava.gold { background:linear-gradient(140deg,var(--gold-lt),var(--gold)); color:#fff; }

/* ─── ссылки эксперта: VK, Telegram, сайт (личные телефоны не публикуются) ─── */
.socs { display:flex; gap:6px; flex-wrap:wrap; }
.soc { display:inline-flex; align-items:center; gap:6px; height:36px; padding:0 11px; border-radius:9px; border:1px solid var(--line); background:var(--card); color:var(--text); text-decoration:none; font-size:12.5px; white-space:nowrap; transition:.14s; max-width:100%; }
.soc span { overflow:hidden; text-overflow:ellipsis; }
.soc .ico { font-size:15px; color:var(--muted); flex:0 0 auto; }
.soc:hover { border-color:var(--gold); color:var(--gold); } .soc:hover .ico { color:var(--gold); }
.soc.icon-only { width:36px; padding:0; justify-content:center; }
.union-note { display:inline-flex; align-items:center; gap:8px; font-size:13px; color:var(--muted); }
.union-note .ico { color:var(--gold); font-size:15px; }
.union-note b { color:var(--text); font-weight:400; }
.union-note a { color:var(--text); text-decoration:none; } .union-note a:hover { color:var(--gold); }
.reg { font-size:12.5px; color:var(--muted); letter-spacing:.03em; white-space:nowrap; }
.reg b { color:var(--text); font-weight:700; }

/* кнопка «ещё N» в списке бирок */
.more-sp { display:inline-flex; align-items:center; min-height:30px; padding:0 9px; border-radius:999px; border:1px dashed var(--gold-line); background:none; color:var(--gold); font-family:inherit; font-size:12.5px; cursor:pointer; }
.more-sp:hover { background:var(--gold-wash); }
@media (max-width:820px) { .more-sp { min-height:36px; padding:0 12px; } }

/* ─── пустой результат ─── */
.empty { text-align:center; padding:40px 20px; color:var(--muted); }
.empty .ico { font-size:34px; color:var(--muted-2); margin-bottom:8px; }

/* ─── подвал ─── */
.site-foot { background:var(--ink); color:rgba(255,255,255,.7); margin-top:40px; }
.site-foot .wrap { max-width:1180px; margin:0 auto; padding:34px 30px 30px; display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:26px; font-size:13.5px; }
.site-foot img { height:30px; margin-bottom:14px; }
.site-foot b { color:#fff; font-weight:400; display:block; margin-bottom:8px; }
.site-foot a { color:rgba(255,255,255,.8); text-decoration:none; } .site-foot a:hover { color:var(--gold-lt); }
.site-foot .row { display:flex; align-items:center; gap:9px; margin-bottom:7px; }
.site-foot .row .ico { color:var(--gold); font-size:14px; flex:0 0 auto; }
.site-foot .copy { grid-column:1/-1; border-top:1px solid rgba(255,255,255,.09); padding-top:14px; font-size:12px; color:rgba(255,255,255,.4); }
@media (max-width:820px) { .site-foot .wrap { grid-template-columns:1fr; padding:26px 16px; } .site-foot .row { min-height:36px; } .page { padding:18px 14px 100px; } h1 { font-size:24px; } }

/* ─── плашка макета и плавающая панель переключения вариантов ─── */
.maket-note { display:flex; gap:10px; align-items:flex-start; background:var(--warn-bg); color:var(--warn); border:1px solid transparent; border-radius:11px; padding:10px 14px; font-size:13px; margin:0 0 18px; }
.maket-note .ico { font-size:16px; flex:0 0 auto; margin-top:2px; }
.maket-bar { position:fixed; right:16px; bottom:calc(16px + env(safe-area-inset-bottom,0px)); z-index:80; display:flex; align-items:center; gap:6px;
  background:var(--card); border:1px solid var(--line); border-radius:999px; padding:6px 8px 6px 14px; box-shadow:var(--sh-lift); font-size:13px; max-width:calc(100vw - 32px); }
.maket-bar .lbl { color:var(--muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.maket-bar .lbl b { color:var(--text); font-weight:400; }
.maket-bar a, .maket-bar button { display:inline-grid; place-items:center; width:36px; height:36px; border-radius:50%; border:1px solid var(--line); background:var(--card); color:var(--strong); text-decoration:none; cursor:pointer; font-family:inherit; font-size:15px; }
.maket-bar a:hover, .maket-bar button:hover { border-color:var(--gold); color:var(--gold); }
.maket-bar select { margin:0; width:auto; padding:6px 10px; font-size:12.5px; border-radius:999px; min-height:36px; }
.maket-bar .all { width:auto; padding:0 12px; border-radius:999px; font-size:12.5px; white-space:nowrap; }
@media (max-width:820px) { .maket-bar { left:10px; right:10px; max-width:none; justify-content:space-between; padding:6px 8px; } .maket-bar .lbl { display:none; } .maket-bar select { max-width:44vw; } }