/* ============================================================
   ХУИТО — доска объявлений внутри PokeDraw.
   Всё под .hy: это отдельная площадка со своей светлой темой,
   и она не должна протекать в тёмный интерфейс приложения.
   ============================================================ */
.hy{
  --w:#fff;
  --bg:#f2f1f0;
  --ink:#0f0f0f;
  --ink-2:#5c5c5c;
  --ink-3:#8c8c8c;
  --line:#e7e7e7;
  --line-2:#d6d6d6;
  --blue:#00aaff;
  --blue-d:#0091db;
  --violet:#a169f7;
  --violet-d:#8b4ef0;
  --violet-l:#b18af5;
  --green:#04b45f;
  --red:#ff4053;
  --r:12px; --r-s:8px; --r-l:16px;

  background:#0b0e12;
  padding:12px 12px 34px;
  min-height:100vh;
  color:var(--ink);
  font-family:"Golos Text","Helvetica Neue",Arial,sans-serif;
  line-height:1.35;
}
.hy *{box-sizing:border-box}
.hy button{font:inherit;color:inherit;cursor:pointer;background:none;border:0;padding:0}
.hy input,.hy select,.hy textarea{font:inherit;color:var(--ink);background:var(--w)}
.hy a{color:var(--blue);text-decoration:none;cursor:pointer}
.hy h1,.hy h2,.hy h3{margin:0;font-weight:700;letter-spacing:-.02em}

/* ---------- рамка «браузера» ---------- */
.hy-browser{border-radius:14px;overflow:hidden;box-shadow:0 24px 60px -28px rgba(0,0,0,.9);
  border:1px solid rgba(255,255,255,.08)}
.hy-chrome{display:flex;align-items:center;gap:10px;padding:9px 13px;background:#1b1f26;
  border-bottom:1px solid rgba(255,255,255,.06)}
.hy-dots{display:flex;gap:6px;flex:none}
.hy-dots i{width:11px;height:11px;border-radius:50%;display:block}
.hy-dots i:nth-child(1){background:#ff5f57}
.hy-dots i:nth-child(2){background:#febc2e}
.hy-dots i:nth-child(3){background:#28c840}
.hy-url{flex:1;background:#0e1116;border-radius:7px;padding:5px 12px;color:#9aa7b4;
  font-size:12px;display:flex;align-items:center;gap:7px;min-width:0}
.hy-url b{color:#e6ecf2;font-weight:500}
.hy-url .lock{color:#4fbf82;font-size:11px}
.hy-url .rest{color:#6b7785;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hy-refresh{color:#7d8894;font-size:15px;flex:none;padding:0 4px}
.hy-refresh:hover{color:#e6ecf2}

.hy-page{background:var(--w);min-height:640px;container-type:inline-size}

/* ---------- верхняя микронавигация ---------- */
.hy-top{display:flex;align-items:center;gap:16px;padding:9px 26px;font-size:13px;
  color:var(--ink);flex-wrap:nowrap;border-bottom:1px solid var(--line);white-space:nowrap}
.hy-top button{color:var(--ink)}
.hy-top button:hover{color:var(--blue)}
.hy-top .sp{flex:1}
.hy-top .muted{color:var(--ink-2)}

/* ---------- шапка ---------- */
.hy-head{display:flex;align-items:center;gap:16px;padding:14px 26px 18px;flex-wrap:nowrap}
.hy-logo{display:flex;align-items:center;gap:9px;flex:none}
.hy-logo svg{width:32px;height:32px;flex:none}
.hy-logo b{font-size:26px;font-weight:800;letter-spacing:-.045em}
.hy-cats{background:var(--blue);color:#fff;border-radius:var(--r);padding:12px 18px;
  font-weight:600;font-size:14px;display:flex;align-items:center;gap:9px;flex:none}
.hy-cats:hover{background:var(--blue-d)}
.hy-cats .grid{display:grid;grid-template-columns:repeat(3,3px);gap:2px}
.hy-cats .grid i{width:3px;height:3px;background:#fff;border-radius:50%;display:block}
.hy-search{flex:1;min-width:180px;display:flex;gap:10px}
.hy-search .field{flex:1;position:relative;display:flex;align-items:center}
.hy-search .field svg{position:absolute;left:14px;width:17px;height:17px;color:var(--ink-3);
  fill:none;stroke:currentColor;stroke-width:2}
.hy-search input{width:100%;height:46px;border:1px solid var(--line-2);border-radius:var(--r);
  padding:0 14px 0 40px;font-size:15px;outline:none}
.hy-search input:focus{border-color:var(--blue);box-shadow:0 0 0 2px rgba(0,170,255,.18)}
.hy-find{background:var(--blue);color:#fff;font-weight:600;font-size:15px;
  border-radius:var(--r);padding:0 26px;height:46px;flex:none}
.hy-find:hover{background:var(--blue-d)}
.hy-city{display:flex;align-items:center;gap:6px;font-size:14px;flex:none;color:var(--ink)}
.hy-city:hover{color:var(--blue)}
.hy-icons{display:flex;align-items:center;gap:18px;flex:none}
.hy-ico{position:relative;display:flex;align-items:center;gap:6px;
  font-size:13px;color:var(--ink)}
.hy-ico:hover{color:var(--blue)}
.hy-ico svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.7;
  stroke-linecap:round;stroke-linejoin:round}
.hy-ico.on{color:var(--violet)}
.hy-ico .cnt{position:absolute;top:-6px;left:10px;background:var(--red);color:#fff;
  font-size:10px;font-weight:700;min-width:16px;height:16px;border-radius:9px;
  display:grid;place-items:center;padding:0 4px}
.hy-post{background:var(--violet);color:#fff;font-weight:600;font-size:13px;
  border-radius:9px;padding:8px 14px;flex:none}
.hy-post:hover{background:var(--violet-d)}
.hy-wallet{font-size:12px;color:var(--ink-3);flex:none;display:flex;align-items:center;gap:7px}
.hy-wallet b{font-size:14px;color:var(--ink);background:var(--bg);border-radius:8px;padding:4px 9px}

/* ---------- хлебные крошки и заголовок ---------- */
.hy-body{padding:0 26px 40px}

/* Тесно — прячем то, без чего страница читается: сначала болталогия
   в верхней навигации, потом подписи у иконок. */
@container (max-width:1240px){
  .hy-top > button:nth-child(4), .hy-top > button:nth-child(5){display:none}
}
@container (max-width:1080px){
  .hy-top > button:nth-child(2), .hy-top > button:nth-child(3){display:none}
  .hy-ico{font-size:0;gap:0}
  .hy-ico svg{width:21px;height:21px}
  .hy-ico .cnt{font-size:10px;left:12px}
}
@container (max-width:880px){
  .hy-top > button{display:none}
  .hy-item{grid-template-columns:180px 1fr}
  .hy-right{grid-column:2;flex-direction:row;align-items:center;flex-wrap:wrap}
}
.hy-crumbs{font-size:12.5px;color:var(--ink-3);display:flex;gap:7px;flex-wrap:wrap;
  align-items:center;padding:6px 0 12px}
.hy-crumbs button{color:var(--ink-3)}
.hy-crumbs button:hover{color:var(--blue)}
.hy-h1{font-size:26px;font-weight:700;display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.hy-h1 span{color:var(--ink-3);font-size:19px;font-weight:600}
.hy-sub{color:var(--ink-2);font-size:13px;margin-top:6px}
.hy-sub b{color:var(--ink)}

/* ---------- панель сортировки ---------- */
.hy-bar{display:flex;align-items:center;gap:18px;padding:14px 0 10px;flex-wrap:wrap}
.hy-bar .sp{flex:1}
.hy-modes{display:flex;gap:4px}
.hy-mode{width:32px;height:30px;border-radius:var(--r-s);display:grid;place-items:center;
  color:var(--ink-3)}
.hy-mode svg{width:17px;height:17px;fill:currentColor}
.hy-mode.on{background:var(--bg);color:var(--ink)}
.hy-sort{display:flex;align-items:center;gap:6px;font-size:14px;font-weight:600}
.hy-sort select{border:0;font-weight:600;font-size:14px;outline:none;cursor:pointer}
.hy-toggle{display:flex;align-items:center;gap:9px;font-size:14px;cursor:pointer}
.hy-sw{width:38px;height:22px;border-radius:11px;background:var(--line-2);position:relative;
  transition:background .15s;flex:none}
.hy-sw i{position:absolute;top:2px;left:2px;width:18px;height:18px;border-radius:50%;
  background:#fff;transition:transform .15s;box-shadow:0 1px 3px rgba(0,0,0,.3)}
.hy-toggle.on .hy-sw{background:var(--blue)}
.hy-toggle.on .hy-sw i{transform:translateX(16px)}

/* ---------- сетка: фильтры + лента ---------- */
.hy-cols{display:grid;grid-template-columns:268px minmax(0,1fr);gap:30px;align-items:start}
@media (max-width:900px){ .hy-cols{grid-template-columns:1fr} }

.hy-filters{position:sticky;top:12px}
.hy-fg{padding:16px 0;border-bottom:1px solid var(--line)}
.hy-fg:last-child{border-bottom:0}
.hy-fg h4{font-size:15px;font-weight:700;margin-bottom:11px}
.hy-price{display:flex;gap:8px}
.hy-price input{width:100%;height:40px;border:1px solid var(--line-2);border-radius:var(--r-s);
  padding:0 11px;font-size:14px;outline:none}
.hy-price input:focus{border-color:var(--blue)}
.hy-pills{display:flex;flex-wrap:wrap;gap:6px}
.hy-pill{border:1px solid var(--line-2);border-radius:var(--r-s);padding:8px 13px;
  font-size:13.5px;background:var(--w);white-space:nowrap}
.hy-pill:hover{border-color:var(--ink-3)}
.hy-pill.on{background:var(--ink);color:#fff;border-color:var(--ink)}
.hy-check{display:flex;align-items:center;gap:10px;padding:6px 0;font-size:14px;cursor:pointer}
.hy-box{width:20px;height:20px;border-radius:5px;border:1.6px solid var(--line-2);flex:none;
  display:grid;place-items:center;background:var(--w)}
.hy-check.on .hy-box{background:var(--blue);border-color:var(--blue)}
.hy-box svg{width:12px;height:12px;stroke:#fff;stroke-width:3;fill:none;opacity:0}
.hy-check.on .hy-box svg{opacity:1}
.hy-check .off{color:var(--ink-3)}
.hy-langs{display:flex;flex-direction:column;gap:2px;max-height:268px;overflow:auto}
.hy-lang{display:flex;align-items:center;gap:9px;padding:6px 7px;border-radius:var(--r-s);
  font-size:13.5px;cursor:pointer}
.hy-lang:hover{background:var(--bg)}
.hy-lang.on{background:#eaf6ff}
.hy-lang .fl{font-size:16px;flex:none;line-height:1}
.hy-lang .nm{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hy-lang .n{color:var(--ink-3);font-size:12px;font-variant-numeric:tabular-nums}
.hy-lang.dead{opacity:.45;cursor:default}
.hy-lang.dead:hover{background:none}
.hy-note{font-size:11.5px;color:var(--ink-3);margin-top:9px;line-height:1.4}
.hy-reset{font-size:13.5px;color:var(--blue);padding:12px 0}

/* ---------- лента ---------- */
.hy-list{display:flex;flex-direction:column;gap:2px}
.hy-item{display:grid;grid-template-columns:268px minmax(0,1fr) 250px;gap:22px;padding:16px;
  border-radius:var(--r-l);cursor:pointer;position:relative}
.hy-item:hover{background:#fafafa;box-shadow:0 4px 18px -6px rgba(0,0,0,.14)}
.hy-item.promo{background:#f7f9fb}
.hy-photo{position:relative;border-radius:var(--r);overflow:hidden;background:var(--bg);
  aspect-ratio:4/3;display:grid;place-items:center}
.hy-photo img{width:100%;height:100%;object-fit:contain;padding:8px}
.hy-photo .ph{position:absolute;inset:0;background:linear-gradient(100deg,#eee,#f7f7f7,#eee);
  background-size:200% 100%;animation:hyShim 1.3s linear infinite}
@keyframes hyShim{to{background-position:-200% 0}}
.hy-photo .tag{position:absolute;left:8px;top:8px;background:rgba(0,0,0,.62);color:#fff;
  font-size:11px;font-weight:600;padding:3px 7px;border-radius:6px;backdrop-filter:blur(4px)}
.hy-photo .flag{position:absolute;right:8px;top:8px;background:rgba(255,255,255,.94);
  border-radius:6px;padding:2px 7px;font-size:13px;display:flex;align-items:center;gap:4px;
  box-shadow:0 1px 4px rgba(0,0,0,.18)}
.hy-photo .flag b{font-size:9.5px;letter-spacing:.06em;color:#333;font-weight:700}
.hy-mid{min-width:0;display:flex;flex-direction:column;gap:7px}
.hy-title{font-size:16px;font-weight:600;line-height:1.28;color:var(--ink)}
.hy-item:hover .hy-title{color:var(--blue)}
.hy-orig{font-size:12.5px;color:var(--ink-3)}
.hy-price-b{font-size:19px;font-weight:700;letter-spacing:-.02em}
.hy-badges{display:flex;gap:6px;flex-wrap:wrap}
.hy-badge{font-size:11.5px;font-weight:600;padding:3px 9px;border-radius:7px;
  background:var(--bg);color:var(--ink-2)}
.hy-badge.blue{background:var(--blue);color:#fff}
.hy-badge.soft{background:#eaf6ff;color:#0b7fbe}
.hy-badge.green{background:#e6f7ee;color:#04803f}
.hy-badge.red{background:#ffeaec;color:#d92b3c}
.hy-ship{font-size:12.5px;color:var(--ink-2);display:flex;align-items:center;gap:6px}
.hy-ship svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.6}
.hy-desc{font-size:13px;color:var(--ink-2);display:-webkit-box;-webkit-line-clamp:2;
  -webkit-box-orient:vertical;overflow:hidden}
.hy-meta{font-size:12.5px;color:var(--ink-3)}
.hy-right{display:flex;flex-direction:column;gap:9px;align-items:stretch}
.hy-seller{font-size:14px;font-weight:600}
.hy-stars{display:flex;align-items:center;gap:5px;font-size:12.5px;color:var(--ink-2)}
.hy-stars .st{color:#ffb800;letter-spacing:-1px}
.hy-trust{font-size:11.5px;font-weight:600;background:#eaf6ff;color:#0b7fbe;
  padding:3px 9px;border-radius:7px;align-self:flex-start}
.hy-btn{border-radius:var(--r);padding:11px 16px;font-size:14px;font-weight:600;
  background:var(--bg);text-align:center}
.hy-btn:hover{background:var(--line)}
.hy-btn.violet{background:var(--violet);color:#fff}
.hy-btn.violet:hover{background:var(--violet-d)}
.hy-btn.light{background:var(--violet-l);color:#fff}
.hy-btn.light:hover{background:var(--violet)}
.hy-btn.dark{background:#000;color:#fff}
.hy-btn.dark:hover{background:#222}
.hy-btn.line{background:var(--w);border:1px solid var(--line-2)}
.hy-btn.line:hover{background:var(--bg)}
.hy-btn:disabled{opacity:.45;cursor:default}
.hy-heart{position:absolute;right:16px;top:16px;width:34px;height:34px;border-radius:50%;
  display:grid;place-items:center;color:var(--ink-2);z-index:2}
.hy-heart svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.7}
.hy-heart:hover{color:var(--ink)}
.hy-heart.on{color:var(--red)}
.hy-heart.on svg{fill:currentColor;stroke:currentColor}

/* сетка плиток */
.hy-list.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(214px,1fr));gap:14px}
.hy-list.tiles .hy-item{grid-template-columns:1fr;gap:10px;padding:10px}
.hy-list.tiles .hy-right{display:none}
.hy-list.tiles .hy-desc{display:none}

.hy-pager{display:flex;gap:6px;justify-content:center;padding:24px 0 4px;flex-wrap:wrap}
.hy-pg{min-width:38px;height:38px;border-radius:var(--r-s);display:grid;place-items:center;
  font-size:14px;font-weight:600;padding:0 10px}
.hy-pg:hover{background:var(--bg)}
.hy-pg.on{background:var(--ink);color:#fff}

.hy-empty{padding:60px 20px;text-align:center;color:var(--ink-2)}
.hy-empty b{display:block;font-size:17px;color:var(--ink);margin-bottom:7px}
.hy-load{padding:44px;text-align:center;color:var(--ink-3);font-size:13.5px}

/* ---------- карточка объявления ---------- */
.hy-item-page{display:grid;grid-template-columns:minmax(0,1fr) 420px;gap:44px;align-items:start}
@media (max-width:980px){ .hy-item-page{grid-template-columns:1fr} }
.hy-gal{border-radius:var(--r-l);overflow:hidden;background:var(--bg);position:relative;
  aspect-ratio:4/3;display:grid;place-items:center}
.hy-gal img{max-width:100%;max-height:100%;object-fit:contain;padding:18px}
.hy-thumbs{display:flex;gap:8px;margin-top:10px}
.hy-thumb{width:64px;height:52px;border-radius:var(--r-s);overflow:hidden;background:var(--bg);
  border:2px solid transparent;display:grid;place-items:center}
.hy-thumb img{width:100%;height:100%;object-fit:contain;padding:3px}
.hy-thumb.on{border-color:var(--blue)}
.hy-sec{padding:26px 0;border-top:1px solid var(--line)}
.hy-sec h3{font-size:21px;margin-bottom:14px}
.hy-props{display:grid;gap:9px;font-size:14px;max-width:520px}
.hy-prop{display:flex;gap:10px;align-items:baseline}
.hy-prop .k{color:var(--ink-3);flex:none}
.hy-prop .dots{flex:1;border-bottom:1px dotted var(--line-2);transform:translateY(-3px)}
.hy-text{font-size:14.5px;line-height:1.55;white-space:pre-line;max-width:640px}
.hy-side{position:sticky;top:12px;display:flex;flex-direction:column;gap:16px}
.hy-bigprice{font-size:34px;font-weight:800;letter-spacing:-.03em}
.hy-stockline{font-size:14px;color:var(--ink-2)}
.hy-stockline b{color:var(--green)}
.hy-buys{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.hy-buys .hy-btn{padding:14px 10px;font-size:15px;border-radius:var(--r)}
.hy-deliv{font-size:13.5px;color:var(--ink-2);line-height:1.5}
.hy-card{background:var(--bg);border-radius:var(--r-l);padding:18px}
.hy-card h4{font-size:16px;font-weight:700;margin-bottom:4px}
.hy-inst{display:flex;gap:7px;margin:12px 0}
.hy-inst button{flex:1;background:var(--w);border-radius:var(--r-s);padding:9px 4px;
  font-size:13px;font-weight:600;position:relative}
.hy-inst button.on{background:#000;color:#fff}
.hy-inst .zero{position:absolute;top:-7px;right:-5px;background:var(--red);color:#fff;
  font-size:9.5px;font-weight:700;padding:1px 5px;border-radius:6px}
.hy-instline{display:flex;gap:14px;font-size:12.5px;color:var(--ink-2);margin-bottom:12px}
.hy-instline b{display:block;color:var(--ink);font-size:14px}
.hy-instbar{height:4px;border-radius:2px;background:var(--line-2);margin-bottom:10px;overflow:hidden}
.hy-instbar i{display:block;height:100%;background:var(--green);border-radius:2px}
.hy-sellerbox{display:flex;flex-direction:column;gap:9px}
.hy-sellerbox .nm{font-size:19px;font-weight:700}
.hy-tags{display:flex;flex-wrap:wrap;gap:6px}
.hy-tag{font-size:12px;background:var(--bg);border-radius:8px;padding:5px 10px;
  display:flex;align-items:center;gap:5px;color:var(--ink-2)}
.hy-ask{display:flex;flex-direction:column;gap:10px}
.hy-askbox{background:var(--bg);border-radius:var(--r);padding:14px 16px;font-size:14px;
  color:var(--ink-3);display:flex;justify-content:space-between;align-items:center}
.hy-chips{display:flex;flex-wrap:wrap;gap:8px}
.hy-chip{background:#000;color:#fff;border-radius:20px;padding:8px 15px;font-size:13px}
.hy-chip:hover{background:#333}
.hy-chat{display:flex;flex-direction:column;gap:8px;margin-top:6px}
.hy-msg{max-width:82%;padding:9px 13px;border-radius:14px;font-size:13.5px;line-height:1.4}
.hy-msg.me{align-self:flex-end;background:#eaf6ff;border-bottom-right-radius:5px}
.hy-msg.them{align-self:flex-start;background:var(--bg);border-bottom-left-radius:5px}
.hy-msg .who{display:block;font-size:11px;color:var(--ink-3);margin-bottom:2px}
.hy-num{font-size:12.5px;color:var(--ink-3);padding-top:8px}
.hy-report{background:var(--bg);border-radius:var(--r);padding:11px 17px;font-size:13.5px;
  align-self:flex-start;margin-top:14px}

/* ---------- проверка покупки ---------- */
.hy-veil{position:fixed;inset:0;background:rgba(6,9,12,.72);backdrop-filter:blur(5px);
  z-index:120;display:grid;place-items:center;padding:20px}
/* Модалка носит и класс .hy — значит забирает и его min-height:100vh.
   В CSS min-height сильнее max-height, поэтому окно растягивалось на весь
   экран и уезжало за нижний край. Гасим явно. */
.hy-modal{background:var(--w);border-radius:20px;max-width:460px;width:100%;padding:26px;
  color:var(--ink);min-height:0;max-height:88vh;overflow:auto}
.hy-modal.wide{max-width:780px}
.hy-modal h3{font-size:21px;margin-bottom:8px}
.hy-modal p{font-size:14px;color:var(--ink-2);line-height:1.5;margin:0 0 16px}
.hy-modal .row{display:flex;gap:12px;align-items:center;padding:11px 0;border-top:1px solid var(--line)}
.hy-modal .row img{width:48px;height:60px;object-fit:contain;flex:none}
.hy-modal .row .t{flex:1;min-width:0;font-size:13.5px}
.hy-modal .row .t small{display:block;color:var(--ink-3);font-size:12px}
.hy-spin{width:34px;height:34px;border-radius:50%;border:3px solid var(--line);
  border-top-color:var(--blue);animation:hySpin .8s linear infinite;margin:6px auto 16px}
@keyframes hySpin{to{transform:rotate(360deg)}}
.hy-verdict{display:flex;gap:12px;align-items:flex-start;border-radius:var(--r);padding:14px;
  font-size:13.5px;line-height:1.45;margin-bottom:14px}
.hy-verdict.ok{background:#e6f7ee;color:#04803f}
.hy-verdict.bad{background:#ffeaec;color:#c62232}
.hy-verdict .ic{font-size:19px;flex:none;line-height:1}
.hy-verdict b{display:block;margin-bottom:3px;font-size:15px}

/* ---------- формы: продать / корзина / мои ---------- */
.hy-form{display:grid;gap:18px;max-width:620px}
.hy-field label{display:block;font-size:13px;font-weight:600;margin-bottom:7px}
.hy-field input,.hy-field textarea,.hy-field select{width:100%;border:1px solid var(--line-2);
  border-radius:var(--r-s);padding:11px 13px;font-size:14.5px;outline:none}
.hy-field textarea{min-height:104px;resize:vertical}
.hy-field input:focus,.hy-field textarea:focus{border-color:var(--blue)}
.hy-field .hint{font-size:12px;color:var(--ink-3);margin-top:6px}
.hy-picker{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:9px;
  max-height:290px;overflow:auto;padding:3px}
.hy-pick{border:2px solid transparent;border-radius:var(--r-s);padding:5px;background:var(--bg);
  text-align:center;font-size:11px;color:var(--ink-2)}
.hy-pick img{aspect-ratio:.72;object-fit:contain;width:100%}
.hy-pick.on{border-color:var(--violet);background:#f4edff}
.hy-pick .n{display:block;margin-top:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hy-rows{display:flex;flex-direction:column;gap:2px}
.hy-row{display:grid;grid-template-columns:88px 1fr auto;gap:16px;align-items:center;
  padding:14px 12px;border-radius:var(--r)}
.hy-row:hover{background:#fafafa}
.hy-row img{width:100%;aspect-ratio:4/3;object-fit:contain;background:var(--bg);
  border-radius:var(--r-s);padding:4px}
.hy-row .t{min-width:0}
.hy-row .t b{display:block;font-size:14.5px;font-weight:600;margin-bottom:3px}
.hy-row .t small{color:var(--ink-3);font-size:12.5px}
.hy-row .a{display:flex;gap:8px;align-items:center;flex:none}
.hy-total{display:flex;justify-content:space-between;align-items:center;
  border-top:1px solid var(--line);margin-top:12px;padding-top:16px;font-size:15px}
.hy-total b{font-size:24px;font-weight:800}
.hy-stat{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;color:var(--ink-3)}
.hy-tabs{display:flex;gap:22px;border-bottom:1px solid var(--line);margin-bottom:18px}
.hy-tab{padding:11px 0;font-size:15px;font-weight:600;color:var(--ink-3);
  border-bottom:2px solid transparent;margin-bottom:-1px}
.hy-tab.on{color:var(--ink);border-color:var(--violet)}
.hy-offer{background:#fff8e6;border:1px solid #ffe1a3;border-radius:var(--r);padding:13px 15px;
  font-size:13.5px;display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.hy-offer b{font-weight:700}
.hy-offer .sp{flex:1}

/* ============================================================
   ОСМОТР ЛОТА
   Самовывоз не проверяет ничего: лот отдают на руки, и подделку
   надо разглядеть самому. Каждый класс ниже — один способ,
   которым палится левая печать.
   ============================================================ */
.hy-inspect{display:grid;grid-template-columns:300px 1fr;gap:26px;align-items:start;margin-top:18px}
@media (max-width:660px){ .hy-inspect{grid-template-columns:1fr} }
.hy-inspect .side{display:flex;flex-direction:column;gap:12px}
.hy-inspect h3{font-size:20px}
.hy-inspect .lead{font-size:13.5px;color:var(--ink-2);line-height:1.5}
.hy-inspect .who{font-size:13px;color:var(--ink-3)}
.hy-choice{display:grid;gap:9px;margin-top:4px}
.hy-lens{font-size:12px;color:var(--ink-3);line-height:1.45;background:var(--bg);
  border-radius:var(--r-s);padding:10px 12px}
.hy-lens b{color:var(--ink)}

/* сцена: карта лежит на столе под лампой */
.fk-scene{display:flex;flex-direction:column;gap:8px;min-width:0}
.fk-cap{font-size:11.5px;color:var(--ink-3);text-align:center}
.fk{position:relative;border-radius:10px;overflow:hidden;background:#11141a;
  aspect-ratio:.75;display:grid;place-items:center;isolation:isolate;padding:16px;
  box-shadow:0 18px 40px -18px rgba(0,0,0,.8)}
.fk.pack{aspect-ratio:.8}
/* Карта — свой бокс с обрезкой. Раньше её кромкой служил край кадра: скан
   распирал сцену от края до края, и это читалось как зумленный кроп. Теперь
   вокруг карты есть поля, а перекос и сдвиг печати режутся по её собственному
   обрезу, а не по краю стола. */
.fk-card{position:relative;width:100%;height:100%;overflow:hidden;border-radius:5px}
.fk-card > img{width:100%;height:100%;object-fit:contain;transition:transform .2s}
.fk .lay{position:absolute;inset:0;pointer-events:none}
/* Слой-призрак получает скан фоном и обязан лежать ровно на карте. Без размера
   он рисовал копию в натуральную величину поверх лицевой стороны — карта
   выглядела зумленной и обрезанной снизу у любого лота, даже чистого. */
.fk .lay.ghost{background-size:contain;background-repeat:no-repeat;
  background-position:center;opacity:0}

/* холо-блик: живой у настоящей карты, и его отсутствие тоже улика */
.fk .sheen{position:absolute;inset:0;pointer-events:none;mix-blend-mode:color-dodge;
  background:linear-gradient(115deg,transparent 34%,rgba(255,255,255,.42) 46%,
    rgba(140,220,255,.34) 52%,transparent 66%);
  background-size:260% 260%;animation:fkSheen 3.6s ease-in-out infinite}
@keyframes fkSheen{0%{background-position:120% 0}100%{background-position:-40% 0}}

/* 1. печать сдвинута — рамка перекошена относительно обреза */
.fk-tilt img{transform:rotate(1.7deg) scale(1.06)}
/* 2. обрез не по центру — поля разной ширины */
.fk-crop img{transform:translate(7%,-3.5%) scale(1.1)}
/* 3. кислотные цвета */
.fk-sat img{filter:saturate(2.3) contrast(1.18) hue-rotate(-6deg)}
/* 4. выцветшая печать */
.fk-pale img{filter:saturate(.5) contrast(.82) brightness(1.12)}
/* 5. лишняя чёрная кайма по краю */
.fk-border .fk-card::after{content:"";position:absolute;inset:0;border:7px solid #05070a;
  border-radius:5px;pointer-events:none;z-index:4}
/* 6. мыльная печать: мелкий текст плывёт */
.fk-blur img{filter:blur(1.1px) contrast(1.05)}
/* 7. растровая сетка струйника */
.fk-moire .lay.moire{background:repeating-linear-gradient(48deg,
    rgba(255,255,255,.16) 0 1px, transparent 1px 3px);mix-blend-mode:overlay;opacity:.9;z-index:3}
/* 8. двойная печать: контур-призрак */
.fk-ghost .lay.ghost{transform:translate(2.5px,2px);opacity:.42;mix-blend-mode:screen;z-index:2}
/* 9. картон повело волной */
.fk-warp img{transform:perspective(760px) rotateY(7deg) skewY(-1.3deg) scale(1.02)}
/* 10. фольга-зеркало вместо холо-узора */
.fk-mirror .sheen{animation:none;
  background:linear-gradient(112deg,transparent 40%,rgba(255,255,255,.72) 49%,transparent 58%);
  background-size:100% 100%;mix-blend-mode:screen}
/* 11. фольги нет вовсе */
.fk-noholo .sheen{display:none}
/* 12. опечатка живёт в подписи, а не на сцене */

/* безобидные особенности — встречаются и у оригиналов */
.fk-gloss .lay.gloss{background:linear-gradient(155deg,rgba(255,255,255,.2) 0 22%,transparent 48%);
  z-index:3}
.fk-dust .lay.dust{background:
   radial-gradient(2.5px 2.5px at 32% 61%, rgba(255,255,255,.75), transparent 60%),
   radial-gradient(1.8px 1.8px at 68% 28%, rgba(255,255,255,.6), transparent 60%);z-index:3}
.fk-wear .lay.wear{background:linear-gradient(90deg,rgba(255,255,255,.5) 0 1.5px,transparent 1.5px),
   linear-gradient(0deg,rgba(255,255,255,.35) 0 1.5px,transparent 1.5px);
  background-repeat:no-repeat;background-position:right 12% top 8%, left 9% bottom 14%;z-index:3}

/* разбор после вердикта */
.hy-review{display:grid;gap:8px;margin:14px 0}
.hy-rev{display:flex;gap:10px;align-items:flex-start;font-size:13px;line-height:1.4;
  background:var(--bg);border-radius:var(--r-s);padding:10px 12px}
.hy-rev.bad{background:#ffeaec}
.hy-rev .m{flex:none;font-size:14px}
.hy-rev b{display:block;margin-bottom:2px}
.hy-rev span{color:var(--ink-2)}
.hy-queue{font-size:12px;color:var(--ink-3);text-align:center;padding-top:10px}

/* арт запечатанного пака */
.hy-packart{position:relative;width:100%;height:100%;border-radius:8px;overflow:hidden;
  display:grid;place-items:center;background:linear-gradient(168deg,var(--pt,#5b6cff),#131922 76%)}
.hy-packart img{max-width:74%;max-height:56%;object-fit:contain;filter:drop-shadow(0 3px 8px rgba(0,0,0,.5))}
.hy-packart .crimp{position:absolute;left:0;right:0;height:8px;
  background:repeating-linear-gradient(90deg,rgba(255,255,255,.28) 0 3px,transparent 3px 6px)}
.hy-packart .crimp.t{top:5px} .hy-packart .crimp.b{bottom:5px}
.hy-packart .sub{position:absolute;bottom:13px;font-size:9px;letter-spacing:.22em;
  color:rgba(255,255,255,.82);font-weight:700}
.hy-packart .glyph{font-size:30px;color:rgba(255,255,255,.9)}

/* карты, приехавшие из пака или после осмотра */
.hy-cards{display:grid;grid-template-columns:repeat(5,1fr);gap:7px;margin:12px 0 2px}
.hy-cards figure{margin:0;text-align:center;min-width:0}
.hy-cards img{width:100%;aspect-ratio:.72;object-fit:contain;background:var(--bg);border-radius:6px}
.hy-cards figcaption{font-size:9.5px;color:var(--ink-2);margin-top:3px;line-height:1.25;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hy-cards figcaption small{display:block;color:var(--ink-3);font-size:9px}

/* карта, скана которой у TCGdex нет */
.hy-noscan{display:grid;place-content:center;gap:2px;width:100%;aspect-ratio:.72;
  border-radius:6px;
  background:linear-gradient(160deg,#243044,#161b23);color:rgba(255,255,255,.7);text-align:center}
.hy-noscan b{font-size:13px;font-weight:700}
.hy-noscan i{font-style:normal;font-size:8.5px;opacity:.7}

/* ============ ИСТОРИЯ ЦЕН ============ */
.hy-hist{display:flex;flex-direction:column;gap:14px}
.hy-chart{width:100%;max-width:560px;height:auto;overflow:visible}
.hy-chart .area{fill:rgba(0,170,255,.10)}
.hy-chart .line{fill:none;stroke:var(--blue);stroke-width:2;
  stroke-linejoin:round;stroke-linecap:round}
.hy-chart circle{stroke:var(--w);stroke-width:1.5}
.hy-chart circle.live{fill:var(--blue-d)}
.hy-chart circle.bot{fill:var(--ink-3)}
.hy-chart .ax{fill:var(--ink-3);font-size:10px;font-family:inherit}
.hy-histnums{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
  gap:0 22px;max-width:560px}
@media (max-width:700px){
  .hy-chart{max-width:100%}
}