/* ponytail: a few small additions the live theme doesn't already provide, kept intentionally tiny */
/* full-bleed like mnogoknig.lv: the theme pins .container-fluid to 1400px, nothing else
   constrains width. Desktop only -- under 992px the theme's own responsive rules take over.
   ponytail: no upper cap; add max-width:2200px here if the grid ever looks too stretched. */
@media (min-width:992px){
  .container-fluid{max-width:none}
  .lv-seo-block .container{width:auto;max-width:none} /* the one fixed-width block */
  /* Card width is the whole ballgame: the theme caps .img-responsive at max-width:250px and
     sizes .image_reflow by a padding-bottom ratio (1.248 x width). Let a card grow past 250px
     and you get side gutters AND a 1.25x-tall empty image box that shoves name/price off the
     fold -- exactly what the 21:9 screenshots show. So: 8 per row, never wider than 250px.
     The /8.5 leaves half of card 9 peeking, so it reads as scrollable.
     ponytail: past ~2150px the 250px cap wins and you simply get more than 8 per row.
     Raise the cap only if the image feed ever serves art wider than 250. */
  .ModuleFeatured .swiper-slide{width:min(calc(100%/8.5),250px)}
  /* A wrapping grid always leaves a ragged last row once the row count varies with viewport
     width -- 24 items tile cleanly at 12/row but leave a stub of 4 at 10/row. Live only avoids
     this because its container is a fixed 1400px = exactly 6. So don't wrap: one scrolling row,
     same card width as the featured carousels, always full width at any viewport.
     ponytail: native overflow scroll, no swiper markup, so no arrows. Add swiper if arrows matter. */
  .moduleLatest{flex-wrap:nowrap;overflow-x:auto}
  .moduleLatest .product-layout{flex:0 0 auto;width:min(calc(100%/8.5),250px)}
  /* same 250px story, different caps: blog covers are 480px sources and review cards are
     text. Left uncapped, full-bleed upscaled the covers to 638px (visibly soft) and
     stretched review lines to 850px. */
  .swiper-slide.azon-blog-slide{width:min(calc(100%/4.2),480px)} /* .col-sm-3's 25% ties on specificity, so two classes */
  [data-module-id="latest-reviews"] .swiper-slide{width:min(calc(100%/3.2),620px)}
  /* .social img is percentage-sized, so full-bleed grew the footer icons to 177px; live is 64 */
  .social img{width:64px;height:64px}
}
@media (min-width:768px) and (max-width:991px){.ModuleFeatured .swiper-slide{width:calc(100%/4.5)}}
@media (max-width:767px){.ModuleFeatured .swiper-slide{width:calc(100%/2.5)}}
.preview-banner{background:#2fb1ff;color:#fff;text-align:center;padding:6px 10px;font-size:13px}
.preview-banner a{color:#fff;text-decoration:underline}
.lv-home-section{margin:30px 0}
.lv-footer{border-top:1px solid #eee;margin-top:40px;padding:20px 0;color:#777;font-size:13px}
.lv-breadcrumb{margin:14px 0;color:#888}
.lv-pagination{display:flex;justify-content:space-between;margin:24px 0}
/* ponytail: the hotlinked stylesheet.css (non-min) globally hides span.price-diff in its "SV"
   product-page section; the live homepage's min bundle doesn't. Re-enable, same as live. */
.caption span.price-diff{display:block!important}
.banner-product .product-thumb>span.price-diff{display:flex!important}
/* am-box (authors/publishers) -- copied verbatim from the live homepage's inline <style>,
   which is why the hotlinked stylesheet.css alone left our boxes unstyled */
.am-box{background:#f5f5f5;border:1px solid #e6e6e6;border-radius:3px;margin:0 0 20px;overflow:hidden}
.am-box-title{margin:0;background:#2fb1ff;color:#fff;font-size:18px;font-weight:500;line-height:1.2;padding:7px 15px;display:flex;align-items:center;gap:9px;text-shadow:1px 1px 2px rgba(0,0,0,.15)}
.am-box-title::before{content:"\f0c0";font-family:"Font Awesome 5 Free";font-weight:900;font-size:15px}
.am-box-title a{color:inherit;text-decoration:none}
.am-box-tags{display:flex;flex-direction:column;padding-top:8px;max-height:320px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:transparent transparent;transition:scrollbar-color .2s}
.am-box-tags:hover{scrollbar-color:#2fb1ff transparent}
.am-box-tags::-webkit-scrollbar{width:6px}
.am-box-tags::-webkit-scrollbar-track{background:transparent}
.am-box-tags::-webkit-scrollbar-thumb{background:transparent;border-radius:3px;transition:background .2s}
.am-box-tags:hover::-webkit-scrollbar-thumb{background:#2fb1ff}
.am-box .am-tag{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:4px 15px;background:transparent;color:#556270;font-size:13px;line-height:1.3;text-decoration:none;transition:.15s}
.am-box .am-tag::after{content:"\f105";font-family:"Font Awesome 5 Free";font-weight:900;font-size:14px;color:#888;flex:none}
.am-box .am-tag:hover{background:#ddd;color:#444}
.am-box .am-tag:hover::after{color:#555}

/* --- redesigned header (Figma "Azon.market Redesign") --- */
/* old purple promo bar (live .kiber: #B760E6, white 700 14px/40px) with yellow arrow tags */
.rd-promo{background:#B760E6;position:relative;text-align:center;font-size:14px;font-weight:700;line-height:40px;padding:0 10px}
.rd-promo a,.rd-promo a:hover{color:#fff;text-decoration:none}
.rd-flag{position:absolute;top:50%;background:#FFB929;color:#000;font-size:13px;font-weight:800;line-height:1;text-transform:uppercase;white-space:nowrap}
.rd-flag-l{left:20%;transform:translateY(-50%) rotate(-3deg);padding:7px 20px 7px 12px;clip-path:polygon(0 0,calc(100% - 10px) 0,100% 50%,calc(100% - 10px) 100%,0 100%)}
.rd-flag-r{right:20%;transform:translateY(-50%) rotate(3deg);padding:7px 12px 7px 20px;clip-path:polygon(10px 0,100% 0,100% 100%,10px 100%,0 50%)}
.rd-topline{background:#fff;font-size:12px;color:#4D4D4D;position:relative;z-index:1060} /* above the sticky .rd-header (1050) so topline dropdowns aren't hidden under it */
.rd-topline .container-fluid{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:6px 20px;padding-top:7px;padding-bottom:7px}
.rd-topline a{color:#4D4D4D}
.rd-topline a:hover,.rd-topline a:focus{color:#070707;text-decoration:none}
.rd-topline .fa{font-size:13px;margin-right:5px;color:#070707}
.rd-tl-left,.rd-tl-right{display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.rd-tl-sep{width:1px;height:20px;background:#ddd}
.rd-caret{font-size:9px;margin-left:2px;color:#070707}
.rd-topline .dropdown{position:relative}
.rd-topline .dropdown-menu{font-size:12px}
/* LV/RU/EN switcher (static/i18n.js): pill toggle + floating card menu */
.rd-lang .dropdown-toggle{display:inline-flex;align-items:center;gap:4px;padding:3px 9px 3px 8px;border:1px solid #e2e2e2;border-radius:999px;line-height:16px;transition:border-color .15s,background-color .15s}
.rd-lang .dropdown-toggle .fa{margin:0}
.rd-lang .dropdown-toggle:hover,.rd-lang.open .dropdown-toggle{border-color:#070707;background:#f7f7f7}
.rd-lang.open .rd-caret{transform:rotate(180deg)}
.rd-lang .rd-caret{transition:transform .15s}
.rd-lang-cur{font-weight:700;letter-spacing:.04em;color:#070707}
.rd-topline .rd-lang-menu{min-width:180px;margin-top:8px;padding:6px;border:0;border-radius:12px;box-shadow:0 10px 30px rgba(0,0,0,.14),0 1px 3px rgba(0,0,0,.08);font-size:13px}
.rd-lang-menu>li>a{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:8px;color:#070707;transition:background-color .12s}
.rd-lang-menu>li>a:hover,.rd-lang-menu>li>a:focus{background:#f2f2f2;color:#070707}
.rd-lang-code{flex:none;width:28px;padding:3px 0;border-radius:5px;background:#eee;font-size:11px;font-weight:700;letter-spacing:.04em;text-align:center;color:#4D4D4D}
.rd-lang-name{flex:1}
.rd-topline .rd-lang-check{margin:0;font-size:11px;opacity:0;color:#24BD15}
.rd-lang-menu>li>a.active{font-weight:600}
.rd-lang-menu>li>a.active .rd-lang-code{background:#FFB929;color:#000}
.rd-lang-menu>li>a.active .rd-lang-check{opacity:1}
html.i18n-wait body{visibility:hidden}

.rd-header{background:#EEEEEE;position:sticky;top:0;z-index:1050;padding-bottom:0} /* live css puts 5px on header */
.rd-header .container-fluid{display:flex;align-items:center;gap:7px;padding-top:6px;padding-bottom:6px;flex-wrap:wrap}
.rd-logo{margin-right:26px;flex:none}
.rd-logo img{height:36px;width:auto;display:block}
.rd-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:48px;padding:0 26px;border:0;border-radius:4px;font-size:15px;font-weight:bold;color:#fff;white-space:nowrap;box-shadow:0 2px 3px rgba(0,0,0,0.1);cursor:pointer;flex:none}
.rd-btn:hover,.rd-btn:focus{color:#fff;box-shadow:0 4px 12px rgba(0,0,0,0.2)}
.rd-catalog-btn{background:#23a1d1}
.rd-cart-btn{background:#24BD15}
.rd-search{flex:1 1 220px;position:relative;min-width:220px;margin:0}
.rd-search input[type=text]{width:100%;height:48px;border:0;border-radius:4px;background:#fff;padding:0 48px 0 16px;font-size:14px;color:#070707}
.rd-search input[type=text]:focus{outline:none}
.rd-search button{position:absolute;right:0;top:0;height:48px;width:48px;border:0;background:none;color:#4D4D4D;font-size:16px;cursor:pointer}
.rd-search button:hover{color:#070707}

/* hover-only catalog menu (old megamenu content) */
.rd-catalog{position:relative}
.rd-menu{display:none;position:absolute;left:0;top:100%;z-index:1100}
.rd-catalog:hover .rd-menu{display:block}
.rd-menu-panel{position:relative;width:381px;height:70vh;min-height:420px;background:#EEEEEE;border-radius:0 8px 8px 8px;box-shadow:0 10px 40px rgba(0,0,0,0.6)}
.rd-menu-scroll{height:100%;overflow-y:auto;padding:24px 30px}
.rd-menu h4{color:#24BD15;font-size:22px;font-weight:normal;margin:0 0 9px;text-transform:capitalize}
.rd-menu section+section{margin-top:20px}
.rd-menu ul{list-style:none;margin:0;padding:0}
.rd-menu li>a{display:flex;align-items:center;height:36px;padding:0 10px;font-size:15px;color:#070707;border-radius:4px;text-decoration:none}
.rd-menu li>a .rd-cat-ico{width:22px;margin-right:6px;text-align:center;color:#070707}
.rd-menu li>a .rd-arrow{margin-left:auto;padding-left:8px;color:#4D4D4D}
.rd-menu li.active>a,.rd-menu li:hover>a{background:#40bdff;color:#fff;box-shadow:0 4px 12px rgba(0,0,0,0.2)}
.rd-menu li.active>a .rd-cat-ico,.rd-menu li.active>a .rd-arrow,
.rd-menu li:hover>a .rd-cat-ico,.rd-menu li:hover>a .rd-arrow{color:#fff}
/* subcategories flyout: absolute against .rd-menu-panel (scroll wrapper is static, so no clipping) */
.rd-flyout{display:none;position:absolute;left:362px;top:6px;width:771px;max-width:calc(100vw - 430px);background:#EEEEEE;border-radius:8px;box-shadow:0 10px 40px rgba(0,0,0,0.6);padding:22px 45px 26px}
.rd-menu li.active>.rd-flyout{display:block}
.rd-flyout::before{content:"";position:absolute;left:-15px;top:24px;border:15px solid transparent;border-right-color:#EEEEEE;border-left:0}
.rd-flyout h5{color:#24BD15;font-size:18px;font-weight:normal;margin:0 0 10px;text-transform:capitalize}
.rd-flyout ul{columns:2;column-gap:45px}
.rd-flyout li{break-inside:avoid}
.rd-flyout li>a,.rd-flyout li:hover>a{display:block;height:auto;min-height:40px;padding:11px 0;font-size:14px;color:#070707;background:none;box-shadow:none;border-radius:0}
.rd-flyout li:hover>a{text-decoration:underline}
@media (max-width:991px){.rd-flyout{display:none !important}.rd-menu-panel{width:320px}}
/* --- mobile (Figma "Mobile" canvas 1:2) --- */
.rd-burger,.rd-account,.rd-menu-close,.rd-mnav,.rd-msearch{display:none}
@media (max-width:767px){
  .rd-topline,.rd-pills,.rd-catalog-btn,.rd-search,.rd-cart-btn{display:none}
  .rd-promo{font-size:11px;line-height:1.4;padding:6px 10px}
  .rd-header .container-fluid{padding-top:8px;padding-bottom:8px}
  .rd-logo{margin:0 auto}
  .rd-logo img{height:30px}
  .rd-burger,.rd-account{display:flex;align-items:center;justify-content:center;width:40px;height:36px;border:0;background:none;color:#4D4D4D;font-size:20px;flex:none}
  /* burger/nav open the catalog menu as a full-screen drawer (Figma 1982:7229) */
  /* ponytail: !important pair -- tap inside the drawer sets sticky :hover on .rd-catalog,
     whose desktop :hover rule (0-3-0) outguns body.rd-drawer-open (0-2-1) and reopens/holds
     the menu; on mobile visibility is the body class, full stop */
  .rd-menu{display:none !important}
  body.rd-drawer-open .rd-menu{display:block !important;position:fixed;left:0;top:0;right:0;bottom:0;z-index:1300}
  body.rd-drawer-open{overflow:hidden}
  .rd-menu-panel{width:100%;height:100%;min-height:0;border-radius:0;box-shadow:none}
  .rd-menu-close{display:flex;align-items:center;justify-content:center;position:absolute;right:8px;top:8px;width:40px;height:40px;border:0;background:none;color:#070707;font-size:22px;z-index:2}
  .rd-menu-scroll{padding:40px 20px 70px}
  /* fixed bottom nav (Figma Footer 1982:8681) */
  body{padding-bottom:50px}
  .rd-mnav{display:flex;position:fixed;left:0;right:0;bottom:0;height:50px;background:#4D4D4D;z-index:1400}
  .rd-mnav a,.rd-mnav button{flex:1;display:flex;align-items:center;justify-content:center;border:0;background:none;color:#fff;font-size:20px}
  .rd-mnav a:hover,.rd-mnav a:focus{color:#fff}
  /* search bar above the nav (Figma Search overlay 1931:7787) */
  body.rd-msearch-open .rd-msearch{display:block;position:fixed;left:0;right:0;bottom:50px;background:#fff;padding:10px 12px;z-index:1400;box-shadow:0 -2px 10px rgba(0,0,0,0.15)}
  .rd-msearch input[type=text]{width:100%;height:44px;border:0;font-size:16px;color:#070707;padding:0 44px 0 4px}
  .rd-msearch input[type=text]:focus{outline:none}
  .rd-msearch button{position:absolute;right:12px;top:10px;height:44px;width:44px;border:0;background:none;color:#4D4D4D;font-size:18px}
  /* cards: cover + name + price only (Figma sections in Frame 1919:12597) */
  .product-thumb .rating,.product-thumb .button-group{display:none}
  .product-thumb .image img{border-radius:8px}
}

/* --- thematic pills row (Figma node 3856:5121) --- */
.rd-pills{background:#fff}
.rd-pills .container-fluid{display:flex;align-items:center;flex-wrap:wrap;padding-top:4px;padding-bottom:4px}
.rd-pill{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:4px;font-size:14px;line-height:1.4;color:#4D4D4D;text-transform:capitalize;white-space:nowrap}
.rd-pill:hover,.rd-pill:focus{background:#40bdff;color:#fff;text-decoration:none;box-shadow:0 4px 12px rgba(0,0,0,0.2)}
.rd-pill-ico{width:16px;height:16px}
.rd-pill-sale{color:#FF001A}
.rd-pill-sale:hover,.rd-pill-sale:focus{background:#FF001A;color:#fff}
.rd-pill-sale:hover .rd-pill-ico{filter:brightness(0) invert(1)}

/* --- hero banner + product of the day (Figma nodes 3852:4265..4269) --- */
/* Figma: banner flexible (~1120px) / pod fixed 234px, both exactly 250px tall */
.rd-hero{display:flex;align-items:stretch}
.rd-hero>.col-sm-9{flex:1 1 0;width:auto;float:none;min-width:0} /* basis 0, not auto: auto lets the container size its own width from content and collapse */
.rd-hero>.col-sm-3{flex:0 0 264px;width:264px;float:none} /* 234 + 2x15px col padding */
/* Banner scales to full slot width and the overflow crops top/bottom. 0.327 = the art's
   329/1005 ratio, x0.75 = the same ~25% crop live shows in its 1400px container, so a wide
   screen crops no harder than live does. The old 380px ceiling was hit at 1460px and turned
   into a 50% crop by 2600 -- that was the ultrawide breakage.
   Height must stay a definite length: with height:auto Swiper mis-measures and collapses.
   The 38vh ceiling is what keeps it off the fold, and it's a ceiling in the right unit --
   a fixed px cap turns into extra crop on short-and-wide 21:9 panels. */
.rd-hero .slideshow .swiper-container{border-radius:4px;overflow:hidden;width:100%;
  height:clamp(250px, min((100vw - 294px) * 0.245, 38vh), 900px)}
.rd-hero .swiper-slide{height:clamp(250px, min((100vw - 294px) * 0.245, 38vh), 900px)}
.rd-hero .swiper-slide img{width:100%;height:100%;object-fit:cover;display:block}
.rd-hero .swiper-banner-button{display:none} /* ponytail: design shows no arrows; autoplay + dots remain */
.rd-pod{position:relative;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#EEEEEE;border-radius:4px;padding:12px 16px 8px}
.rd-badge{position:absolute;top:-5px;padding:6px 12px;border-radius:4px;font-size:14px;font-weight:bold;line-height:normal;box-shadow:0 4px 6px rgba(0,0,0,0.2);z-index:2;white-space:nowrap}
.rd-badge-red{left:-9px;background:#FF001A;color:#fff}
.rd-badge-red:hover,.rd-badge-red:focus{color:#fff;text-decoration:none}
.rd-badge-yellow{right:-4px;background:#FFE178;color:#070707}
.rd-pod-img{position:relative;display:block;width:153px;height:180px;border-radius:4px;overflow:hidden;flex:none}
.rd-pod-img .rd-pod-blur{position:absolute;left:0;top:0;width:100%;height:100%;object-fit:cover;filter:blur(5px);opacity:.5}
/* ponytail: source is a 320x250 white-padded thumb (originals 403 for this feed); cover-crop
   eats the padding -- swap back to contain if the feed ever serves real portrait covers */
.rd-pod-img img:last-child{position:relative;width:100%;height:100%;object-fit:cover}
.rd-pod-name{display:block;margin-top:4px;max-width:200px;font-size:13px;color:#4D4D4D;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rd-pod-name:hover{color:#070707;text-decoration:none}
.rd-pod-price{font-size:18px;color:#070707;margin-top:3px}

/* ── Meilisearch autocomplete (ported from azon.market/msearch/new.html; ids -> classes so
   desktop .rd-search and mobile .rd-msearch can both carry it). JS: static/msearch.js ── */
.ac-wrap{position:relative}
.ac-hint{display:none;position:absolute;bottom:calc(100% + 8px);left:0;z-index:10000;background:#1a1a2e;color:#ccd6f6;font-size:13px;padding:5px 12px;border-radius:6px;white-space:nowrap;pointer-events:none}
.ac-hint::after{content:'';position:absolute;top:100%;left:18px;border:6px solid transparent;border-top-color:#1a1a2e}
.ac-hint span{color:#7dd3fc;font-weight:600}
.ac-dropdown{display:none;position:absolute;top:100%;left:0;right:0;z-index:9999;background:#fff;border:1px solid #dde3ec;border-top:none;border-radius:0 0 10px 10px;box-shadow:0 8px 32px rgba(0,0,0,.14);max-height:560px;overflow-y:auto;text-align:left}
.ac-dropdown.open{display:block}
.rd-search.ac-open input[type=text]{border-radius:4px 4px 0 0}
.ac-msg{padding:18px 14px;color:#8a96a8;font-size:14px}
.ac-msg.ac-err{color:#c0392b}
.ac-section-title{padding:8px 16px 5px;font-size:11px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:#8a96a8;background:#f8f9fb;border-bottom:1px solid #eef0f4}
.ac-book{display:flex;align-items:center;gap:14px;padding:10px 16px;cursor:pointer;border-bottom:1px solid #f2f4f8;text-decoration:none;color:inherit;transition:background .1s;outline:none}
.ac-book:last-child{border-bottom:none}
.ac-book:hover,.ac-book:focus,.ac-book.active{background:#f0f5ff;text-decoration:none;color:inherit}
.ac-book-img{flex:0 0 46px;width:46px;height:62px;object-fit:cover;border-radius:3px;background:#eef0f6}
.ac-book-img-placeholder{flex:0 0 46px;width:46px;height:62px;border-radius:3px;background:#eef0f6;display:flex;align-items:center;justify-content:center;font-size:1.4rem;color:#c0cce0}
.ac-book-body{flex:1;min-width:0}
.ac-book-name{font-size:15px;font-weight:600;line-height:1.35;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#1a1a2e}
.ac-book-name mark,.ac-book-meta mark{background:#fff3a3;border-radius:2px;padding:0 2px;font-style:normal}
.ac-book-meta{font-size:13px;color:#6b7a99;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:3px}
.ac-book-right{text-align:right;flex-shrink:0;padding-left:8px}
.ac-book-price{font-size:15px;font-weight:700;color:#1a7f4b;white-space:nowrap}
.ac-book-stock-out{font-size:12px;color:#c0392b;margin-top:2px}
.ac-pod-badge{display:inline-block;background:#8e44ad;color:#fff;font-size:10px;font-weight:700;padding:1px 6px;border-radius:3px;letter-spacing:.04em;vertical-align:middle;margin-left:5px}
.ac-authors{display:flex;flex-wrap:wrap;gap:8px;padding:10px 16px;border-bottom:1px solid #f2f4f8}
.ac-author-chip{display:inline-block;background:#eef2ff;color:#3a5ad9;border-radius:20px;padding:5px 15px;font-size:14px;cursor:pointer;transition:background .12s;white-space:nowrap}
.ac-author-chip:hover,.ac-author-chip.active{background:#d5dcff}
.ac-author-chip mark{background:transparent;font-style:normal;font-weight:700;color:#1a3ab8;padding:0}
.ac-filter-bar{padding:8px 16px;border-bottom:1px solid #eef0f4;background:#f8f9fb;position:sticky;top:0;z-index:1}
.ac-avail-toggle{display:flex;align-items:center;gap:7px;cursor:pointer;user-select:none;font-size:13px;color:#6b7a99;margin:0;font-weight:normal}
.ac-avail-toggle input{display:none}
.ac-toggle-track{width:28px;height:16px;border-radius:8px;background:#dde3ec;transition:background .18s;flex:0 0 28px;position:relative}
.ac-avail-toggle input:checked + .ac-toggle-track{background:#3a5ad9}
.ac-toggle-track::after{content:'';position:absolute;top:2px;left:2px;width:12px;height:12px;border-radius:50%;background:#fff;transition:transform .18s;box-shadow:0 1px 2px rgba(0,0,0,.18)}
.ac-avail-toggle input:checked + .ac-toggle-track::after{transform:translateX(12px)}
.ac-footer{position:sticky;bottom:0;z-index:1;display:flex;align-items:center;justify-content:space-between;padding:11px 16px;background:#f8f9fb;border-top:1px solid #eef0f4}
.ac-footer-count{font-size:13px;color:#8a96a8}
.ac-footer-all{font-size:14px;font-weight:600;color:#3a5ad9;text-decoration:none}
.ac-footer-all:hover{text-decoration:underline}
.ac-skeleton{padding:10px 16px}
.ac-skel-row{display:flex;gap:14px;margin-bottom:12px;align-items:center}
.ac-skel-img{width:46px;height:62px;border-radius:3px;background:#e8eaf0;flex-shrink:0;animation:ac-skel-pulse 1.2s ease-in-out infinite}
.ac-skel-body{flex:1}
.ac-skel-line{height:13px;border-radius:4px;background:#e8eaf0;margin-bottom:8px;animation:ac-skel-pulse 1.2s ease-in-out infinite}
.ac-skel-line.short{width:60%}
@keyframes ac-skel-pulse{0%,100%{opacity:1}50%{opacity:.5}}
/* mobile: search bar is pinned above the bottom nav, so the list opens UPWARD; the
   floating hint would sit on top of it, so it's dropped there */
@media (max-width:767px){
  .rd-msearch .ac-dropdown{top:auto;bottom:100%;border:1px solid #dde3ec;border-bottom:none;border-radius:10px 10px 0 0;max-height:calc(100vh - 180px);box-shadow:0 -8px 24px rgba(0,0,0,.14)}
  .rd-msearch .ac-hint{display:none !important}
  .ac-book{gap:10px;padding:8px 12px}
  .ac-book-name{font-size:14px}
}