/* ==========================================================================
   ES-PRO V59.41 — translation-safe layout fixes
   Loaded last. Keeps the existing design; only prevents long translated text
   from being clipped and fixes product gallery overflow on phones.
   ========================================================================== */

/* 1. Detail heroes (resources, projects, services, news): long Russian/Malay/
      Vietnamese titles used to be cut off by a fixed 400px banner height.
      The banner now keeps its minimum height but grows with the title. */
.page-hero.page-hero--image.detail{
  height:auto!important;
  min-height:400px!important;
  max-height:none!important;
}
.page-hero.page-hero--image.detail .page-content{
  height:auto!important;
  min-height:400px!important;
  justify-content:center;
}
.page-hero.detail h1{
  overflow-wrap:break-word;
  hyphens:auto;
  text-wrap:balance;
}
.page-hero.detail h1.detail-hero__title--long{
  max-width:820px!important;
  font-size:clamp(2.15rem,3.05vw,3rem)!important;
  line-height:1.1!important;
}
.page-hero.detail h1.detail-hero__title--very-long{
  max-width:900px!important;
  font-size:clamp(1.85rem,2.45vw,2.5rem)!important;
  line-height:1.14!important;
}
.page-hero.detail .page-content > p{
  max-width:760px;
}
.page-hero.detail .breadcrumb{
  max-width:100%;
}
.page-hero.detail .breadcrumb > span:last-child{
  display:inline-block;
  max-width:min(60ch,100%);
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  vertical-align:bottom;
}

@media (max-width:760px){
  .page-hero.page-hero--image.detail,
  .page-hero.page-hero--image.detail .page-content{
    min-height:360px!important;
  }
  .page-hero.detail h1.detail-hero__title--long{
    font-size:clamp(1.75rem,7.4vw,2.2rem)!important;
  }
  .page-hero.detail h1.detail-hero__title--very-long{
    font-size:clamp(1.5rem,6.3vw,1.85rem)!important;
    line-height:1.16!important;
  }
  .page-hero.detail .breadcrumb > span:last-child{
    max-width:100%;
  }
}

/* 2. Product page on phones: the gallery column could become wider than the
      screen (grid items default to min-width:auto), pushing the main image
      and the summary off-centre. */
.catalog-detail__top > *{
  min-width:0;
}
@media (max-width:1100px){
  .catalog-detail__top{
    grid-template-columns:minmax(0,1fr)!important;
  }
}
.catalog-gallery,
.catalog-gallery__stage,
.catalog-gallery__thumbs{
  max-width:100%;
}
.catalog-gallery__stage{
  grid-template-columns:minmax(0,1fr)!important;
}
.catalog-gallery__open{
  min-width:0;
  max-width:100%;
}
.catalog-gallery__open img{
  max-width:100%;
}

/* 3. Long words in translated headings, buttons and cards wrap instead of
      overflowing their boxes. */
main h1,main h2,main h3,
.button,.card h3,.service-card h3,.listing-card h3,.resource-card h3,
.catalog-product-card h3,.catalog-summary h1{
  overflow-wrap:break-word;
}

/* 4. Tablet widths (≈700–1050px): two narrow cards side by side, each with its
      own image|text split, left only ~130px for text and broke words letter by
      letter (most visible in Malay and Russian). Use one card per row instead. */
@media (min-width:761px) and (max-width:1050px){
  .page-about .advantage-grid{grid-template-columns:minmax(0,1fr)!important}
}
@media (min-width:701px) and (max-width:920px){
  .product-family-grid{grid-template-columns:minmax(0,1fr)!important}
}

/* 5. Language-specific typography. */
:lang(ko) body{word-break:keep-all;overflow-wrap:break-word}
:lang(ru) main h1,:lang(ru) main h2,:lang(ru) main h3,
:lang(ms) main h1,:lang(ms) main h2,:lang(ms) main h3{hyphens:auto}

/* 6. Call-to-action band: longer translations (Malay, Russian) filled the whole
      240px band and the last line was clipped. Keep breathing room above/below. */
@media (min-width:821px){
  .cta-band__inner{padding-top:32px;padding-bottom:32px;box-sizing:border-box}
}

/* 7. Product catalogue toolbar: the family filter had a fixed 270px minimum
      inside a 190px column, so on laptops/tablets it ran off the right edge. */
.catalog-tools > *{min-width:0}
.catalog-filter select{min-width:0!important;width:100%;max-width:100%;text-overflow:ellipsis}
@media (min-width:761px) and (max-width:1180px){
  .catalog-tools{grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important}
}

/* 8. Chat launcher on landscape phones and tablets (681–900px): an older rule
      switched the button to the icon-only grid while the label stayed visible,
      so "Trao đổi với ES-PRO" dropped below the icon and out of the button.
      Use the same horizontal pill as on desktop. */
@media (min-width:681px) and (max-width:900px){
  .espro-chat__launcher{
    display:flex!important;
    flex-direction:row!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:11px!important;
    width:auto!important;
    min-width:214px!important;
    max-width:calc(100vw - 28px)!important;
    height:58px!important;
    padding:7px 17px 7px 7px!important;
  }
  .espro-chat__launcher-icon{flex:0 0 44px!important;width:44px!important;height:44px!important;margin:0!important}
  .espro-chat__launcher-copy{display:flex!important;flex-direction:column!important;align-items:flex-start!important;min-width:0!important;text-align:left!important}
  .espro-chat__launcher-copy > *{white-space:nowrap!important}
}

/* 9. Technical sales chat: file upload button, quick replies, short bubbles. */
.espro-chat__composer{grid-template-columns:40px minmax(0,1fr) 43px!important;align-items:end}
.espro-chat__attach{display:grid!important;width:40px;height:44px;place-items:center;color:var(--theme-primary,#0b4c9c);background:#f1f5fa;border:1px solid #d9e3ee;border-radius:12px;cursor:pointer;transition:background .2s,border-color .2s,color .2s}
.espro-chat__attach:hover{background:#e6eef8;border-color:#b9cde3}
.espro-chat__attach.is-requested{color:#fff;background:var(--theme-primary,#0b4c9c);border-color:var(--theme-primary,#0b4c9c);animation:espro-attach-pulse 1.6s ease-in-out 3}
.espro-chat__attach.is-busy{opacity:.55;pointer-events:none}
@keyframes espro-attach-pulse{0%,100%{box-shadow:0 0 0 0 rgba(11,76,156,.35)}50%{box-shadow:0 0 0 7px rgba(11,76,156,0)}}
.espro-chat__suggestions button{white-space:normal;text-align:left;line-height:1.3}
/* Quick replies are short answers now ("Yes", "Rack", "Nickel"): show them as a
   wrapping row of pills under the question instead of full-width blocks. */
.espro-chat .espro-chat__messages>.espro-chat__suggestions,
.espro-chat .espro-chat__suggestions{flex-direction:row!important;flex-wrap:wrap!important;align-items:flex-start!important;gap:7px!important}
.espro-chat .espro-chat__suggestions button{width:auto!important;max-width:100%!important;padding:8px 14px!important;border-radius:999px!important;font-size:12.5px!important;line-height:1.3!important;font-weight:700}
@media(max-width:480px){.espro-chat .espro-chat__messages>.espro-chat__suggestions{padding-left:36px!important}}

/* 10. Composer placeholder: long translated hints ("Mô tả quy trình, công suất hoặc vấn đề của bạn…",
       "Опишите процесс…") wrapped to a second line inside the one-line box and were cut off.
       Keep the hint on one line with an ellipsis; typed text still wraps and the box grows. */
.espro-chat .espro-chat__composer textarea::placeholder{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#7a8a99;opacity:1}
.espro-chat .espro-chat__composer textarea:placeholder-shown{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* 11. Chat attachments (V59.42): tray of pending files above the input, files inside message bubbles,
       drag-and-drop overlay and the "related products" label above product cards. */
.espro-chat .espro-chat__composer{grid-template-rows:auto auto}
.espro-chat__tray{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:8px;padding:2px 0 4px}
.espro-chat__tray[hidden]{display:none!important}
.espro-chat__chip{position:relative;display:flex;align-items:center;gap:8px;max-width:220px;height:52px;padding:6px 30px 6px 6px;background:#f3f7fb;border:1px solid #d6e2ee;border-radius:12px;box-sizing:border-box}
.espro-chat__chip.is-image{width:64px;height:64px;padding:0;overflow:hidden;border-radius:12px}
.espro-chat__chip.is-image img{width:100%;height:100%;object-fit:cover;display:block}
.espro-chat__chip.is-image .espro-chat__chip-name{display:none}
.espro-chat__chip-name{font-size:12px;line-height:1.3;color:#173450;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.espro-chat .espro-chat__composer .espro-chat__chip button{position:absolute!important;top:4px!important;right:4px!important;left:auto!important;bottom:auto!important;display:block!important;width:20px!important;height:20px!important;min-width:0!important;min-height:0!important;padding:0!important;margin:0!important;border:0!important;border-radius:50%!important;background:rgba(15,34,56,.72)!important;color:#fff!important;font:600 14px/20px system-ui,sans-serif!important;text-align:center!important;box-shadow:none!important;cursor:pointer;grid-column:auto!important}
.espro-chat .espro-chat__composer .espro-chat__chip button:hover{background:#c62828!important}
.chat-attachment__ext{flex:0 0 auto;display:grid;place-items:center;width:38px;height:38px;border-radius:9px;background:var(--theme-primary,#0b4c9c);color:#fff;font:700 10px/1 system-ui,sans-serif;letter-spacing:.03em}
.chat-attachments{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:6px;margin:0 0 6px}
.chat-attachment{display:flex;align-items:center;gap:8px;text-decoration:none;color:inherit;border-radius:12px;overflow:hidden}
.chat-attachment--image{width:120px;height:120px;border:1px solid #d6e2ee;background:#eef3f8}
.chat-attachment--image img{width:100%;height:100%;object-fit:cover;display:block}
.chat-attachments:has(.chat-attachment--image:only-child) .chat-attachment--image{width:200px;height:auto;max-height:220px}
.chat-attachments:has(.chat-attachment--image:only-child) .chat-attachment--image img{height:auto;max-height:220px;object-fit:contain}
.chat-attachment--file{max-width:240px;padding:7px 12px 7px 7px;background:#fff;border:1px solid #d6e2ee;color:#173450}
.chat-attachment__name{font-size:12.5px;line-height:1.3;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.chat-message--user.chat-message--has-files .chat-message__content{display:flex;flex-direction:column;align-items:flex-end}
.chat-message--user.chat-message--has-files .chat-message__content > p{margin-top:0}
.chat-message.is-failed .chat-attachments{opacity:.55}
.espro-chat__dropzone{position:absolute;inset:0;z-index:30;display:grid;place-items:center;background:rgba(11,76,156,.10);border:2px dashed var(--theme-primary,#0b4c9c);border-radius:inherit;backdrop-filter:blur(2px);pointer-events:none}
.espro-chat__dropzone[hidden]{display:none}
.espro-chat__dropzone > div{display:flex;flex-direction:column;align-items:center;gap:8px;padding:18px 22px;background:#fff;border-radius:14px;color:var(--theme-primary,#0b4c9c);box-shadow:0 10px 30px rgba(6,29,56,.15);font-size:14px}
.chat-cards__label{display:block;margin:2px 0 6px;font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:#5f7488}
@media (max-width:480px){.chat-attachment--image{width:96px;height:96px}.espro-chat__chip{max-width:170px}}

/* 12. Image viewer for chat pictures: opens over the page with a dimmed, blurred background. */
.espro-lightbox{position:fixed;inset:0;z-index:2147483000;display:flex;align-items:center;justify-content:center;padding:56px 64px;background:rgba(9,20,35,.62);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);opacity:0;transition:opacity .16s ease;box-sizing:border-box}
.espro-lightbox[hidden]{display:none}
.espro-lightbox.is-open{opacity:1}
.espro-lightbox figure{display:flex;align-items:center;justify-content:center;width:100%;height:100%;margin:0}
.espro-lightbox img{max-width:min(1200px,100%);max-height:100%;object-fit:contain;border-radius:12px;background:#fff;box-shadow:0 24px 70px rgba(0,0,0,.45);transform:scale(.97);transition:transform .16s ease}
.espro-lightbox.is-open img{transform:none}
.espro-lightbox button{position:absolute;display:grid;place-items:center;width:44px;height:44px;padding:0;border:0;border-radius:50%;background:rgba(255,255,255,.92);color:#0f2238;font:400 28px/1 system-ui,sans-serif;cursor:pointer;box-shadow:0 6px 18px rgba(0,0,0,.25)}
.espro-lightbox button:hover{background:#fff}
.espro-lightbox button[hidden]{display:none}
.espro-lightbox__close{top:16px;right:16px}
.espro-lightbox__nav.is-prev{left:14px;top:50%;transform:translateY(-50%)}
.espro-lightbox__nav.is-next{right:14px;top:50%;transform:translateY(-50%)}
.espro-lightbox__count{position:absolute;bottom:18px;left:50%;transform:translateX(-50%);padding:4px 12px;border-radius:999px;background:rgba(0,0,0,.45);color:#fff;font:600 12px/1.4 system-ui,sans-serif}
.espro-lightbox__count:empty{display:none}
html.espro-lightbox-open,html.espro-lightbox-open body{overflow:hidden}
.chat-attachment--image,.espro-chat__chip.is-image img{cursor:zoom-in}
@media (max-width:640px){.espro-lightbox{padding:60px 10px}.espro-lightbox__nav.is-prev{left:6px}.espro-lightbox__nav.is-next{right:6px}}

/* 13. v60: links inside assistant answers (same-site pages and e-mail only) */
.espro-chat .chat-message__body a.chat-link{color:#0b63c5;text-decoration:underline;text-underline-offset:2px;word-break:break-all;font-weight:600}
.espro-chat .chat-message__body a.chat-link:hover{color:#07366d}

/* 14. v60b: balanced FAQ card (homepage) */
.geo-visibility-grid{align-items:stretch}
.geo-answer-card{display:flex;flex-direction:column}
.geo-answer-card .geo-facts{margin-top:auto;padding-top:24px}
.geo-faq-list.is-collapsed .is-more{display:none}
.geo-faq-toggle{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;margin-top:12px;padding:12px 14px;border:1px dashed #b9cfd8;border-radius:12px;background:#fff;color:var(--theme-primary,#0b4c9c);font-size:.82rem;font-weight:800;cursor:pointer;transition:background .18s,border-color .18s}
.geo-faq-toggle:hover{background:#f2f8fa;border-color:var(--theme-primary,#0b4c9c)}
.geo-faq-toggle svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;transition:transform .2s}
.geo-faq-toggle.is-open svg{transform:rotate(180deg)}
.geo-faq-card:only-child{grid-column:1/-1}
.geo-faq-card:only-child .geo-faq-list{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}
@media(max-width:760px){.geo-faq-card:only-child .geo-faq-list{grid-template-columns:1fr}}

/* 15. v62 — mobile menu: the "Request a quote" button was 40px wider than the drawer, so a quick sideways
   swipe could scroll the whole menu to the left (cut-off text, header bar not reaching the edge). */
.mobile-nav,.site-header.scrolled .mobile-nav{overflow-x:hidden!important;overscroll-behavior:contain;touch-action:pan-y}
.mobile-nav__quote{box-sizing:border-box!important;width:auto!important;max-width:calc(100% - 40px)!important;align-self:stretch;margin-left:20px!important;margin-right:20px!important}
.mobile-nav__head,.mobile-nav__links{box-sizing:border-box;max-width:100%}

/* 16. v64 — mobile menu: "Products" / "Services" (expandable rows) use exactly the same type as the other items. */
.mobile-catalog>summary>a,.mobile-services>summary>a{font-size:.85rem!important;font-weight:800!important;letter-spacing:.035em!important;text-transform:uppercase!important;color:#13293d!important}
.mobile-catalog>summary,.mobile-services>summary{min-height:50px!important}
.mobile-catalog>summary>a.is-current,.mobile-services>summary>a.is-current,.mobile-catalog[data-current]>summary>a{color:var(--theme-primary,#0b4c9c)!important}
.mobile-catalog>summary,.mobile-services>summary{padding:0!important}
.mobile-catalog>summary>a,.mobile-services>summary>a{min-height:50px;padding:14px 4px!important;border-bottom:0!important;background:none!important}

/* 17. v64 — header: below 1281px the menu button replaces the text menu (never both, never overlapping the logo). */
@media (max-width:1280px){.desktop-nav{display:none!important}.mobile-toggle{display:grid!important}}
@media (max-width:1520px){html[lang="ru"] .desktop-nav{display:none!important}html[lang="ru"] .mobile-toggle{display:grid!important}}

/* 18. v65 — News "Featured story": the card keeps one size; a long title or summary ends with "…" (full text inside the article). */
.news-featured__body h2{display:-webkit-box;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow-wrap:anywhere}
.news-featured__body p{display:-webkit-box!important;overflow:hidden!important;-webkit-box-orient:vertical!important;-webkit-line-clamp:3!important}
@media (min-width:1051px){
  .news-featured{height:380px}
  .news-featured__media{height:100%;min-height:0!important}
  .news-featured__body{min-height:0;overflow:hidden;padding-block:32px}
  .news-featured__body h2{font-size:clamp(1.6rem,2.3vw,2.3rem)}
}
@media (max-width:1050px){.news-featured__media{aspect-ratio:16/9;min-height:0!important;height:auto}}

/* 19. v69 — News article: "Share to" bar and Like button under the story. */
.news-share{position:relative;display:flex;align-items:center;justify-content:space-between;gap:16px 24px;flex-wrap:wrap;margin:40px 0 0;padding:18px 0;border-top:1px solid #e0e8eb;border-bottom:1px solid #e0e8eb}
.news-share+.news-article__back{margin-top:22px;padding-top:0;border-top:0}
.news-share__group{position:relative;display:flex;align-items:center;flex-wrap:wrap;gap:10px 14px;min-width:0}
.news-share__label{color:#7d8e9b;font-size:.86rem;font-weight:600;white-space:nowrap}
.news-share__list{display:flex;flex-wrap:wrap;align-items:center;gap:9px;margin:0!important;padding:0!important;list-style:none!important}
.news-share__list li{margin:0!important;padding:0!important}
.news-share__list li::before,.news-share__list li::marker{content:none!important}
.news-content .news-share__btn,.news-share__btn{position:relative;display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;padding:0;border:1px solid #cfd8de;border-radius:50%;background:#fff;color:var(--share,#5c6f7d);text-decoration:none;cursor:pointer;transition:background .2s,border-color .2s,color .2s,transform .2s,box-shadow .2s;-webkit-tap-highlight-color:transparent}
.news-share__btn svg{display:block;width:17px;height:17px}
.news-share__btn svg.is-stroke{fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.news-share__btn--x{--share:#1d9bf0}.news-share__btn--x svg{width:15px;height:15px}
.news-share__btn--facebook{--share:#3b5998}
.news-share__btn--tumblr{--share:#35465c}
.news-share__btn--pinterest{--share:#e60023}
.news-share__btn--vk{--share:#4a76a8}.news-share__btn--vk svg{width:20px;height:20px}
.news-share__btn--linkedin{--share:#0a66c2}.news-share__btn--linkedin svg{width:16px;height:16px}
.news-share__btn--link,.news-share__btn--more{--share:#7d8e9b;--share-bg:var(--theme-primary,#0b4c9c)}
.news-share__btn--x{--share-bg:#0f1419}
.news-content .news-share__btn:hover,.news-share__btn:hover,.news-share__btn:focus-visible{border-color:var(--share-bg,var(--share));background:var(--share-bg,var(--share));color:#fff;transform:translateY(-2px);box-shadow:0 8px 16px -8px rgba(8,35,62,.45);outline:none}
.news-share__btn:focus-visible{box-shadow:0 0 0 3px rgba(25,189,197,.45)}
.news-share__swap{position:relative;display:block;width:17px;height:17px}
.news-share__swap svg{position:absolute;inset:0;transition:opacity .2s,transform .2s}
.news-share__swap svg+svg{opacity:0;transform:scale(.5)}
.news-share .news-share__btn--link.is-copied,.news-content .news-share .news-share__btn--link.is-copied{border-color:#13a36e;background:#13a36e;color:#fff}
.news-share__btn--link.is-copied .news-share__swap svg:first-child{opacity:0;transform:scale(.5)}
.news-share__btn--link.is-copied .news-share__swap svg+svg{opacity:1;transform:none}
.news-share__toast{position:absolute;left:0;top:calc(100% + 10px);z-index:5;padding:7px 12px;border-radius:8px;background:#0f2d44;color:#fff;font-size:.78rem;font-weight:600;line-height:1.2;white-space:nowrap;opacity:0;transform:translateY(-4px);transition:opacity .2s,transform .2s;pointer-events:none}
.news-share__toast.is-visible{opacity:1;transform:none}
.news-like{display:inline-flex;align-items:center;gap:8px;min-width:82px;height:38px;justify-content:center;padding:0 18px;border:1px solid #cfd8de;border-radius:999px;background:#fff;color:#7d8e9b;font:inherit;font-size:1.02rem;font-weight:600;line-height:1;cursor:pointer;transition:background .2s,border-color .2s,color .2s,box-shadow .2s;-webkit-tap-highlight-color:transparent}
.news-like svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:fill .2s}
.news-like:hover{border-color:var(--theme-primary,#0b4c9c);color:var(--theme-primary,#0b4c9c)}
.news-like:focus-visible{outline:3px solid rgba(25,189,197,.6);outline-offset:2px}
.news-like.is-liked{border-color:var(--theme-primary,#0b4c9c);background:var(--theme-primary,#0b4c9c);color:#fff;box-shadow:0 8px 18px -8px rgba(11,76,156,.6)}
.news-like.is-liked svg{fill:rgba(255,255,255,.28)}
.news-like.is-popping svg{animation:news-like-pop .45s cubic-bezier(.2,.9,.3,1.4)}
@keyframes news-like-pop{0%{transform:scale(1)}35%{transform:scale(1.35) rotate(-12deg)}100%{transform:scale(1)}}
.news-like__count{min-width:1ch;font-variant-numeric:tabular-nums}
@media (max-width:640px){
  .news-share{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:12px 10px;margin-top:32px;padding:14px 0 16px}
  .news-share__group{display:contents}
  .news-share__label{grid-column:1;grid-row:1}
  .news-like{grid-column:2;grid-row:1;min-width:72px;height:36px;padding:0 14px;font-size:.95rem}
  .news-share__list{grid-column:1/-1;grid-row:2;gap:8px}
  .news-content .news-share__btn,.news-share__btn{width:40px;height:40px}
  .news-share__toast{left:auto;right:0}
}
@media (max-width:400px){.news-share__list{gap:6px}.news-content .news-share__btn,.news-share__btn{width:37px;height:37px}}
@media (prefers-reduced-motion:reduce){.news-share__btn,.news-like,.news-like svg{transition:none}.news-like.is-popping svg{animation:none}}

/* 20. v70 — Country field: searchable list (type to filter) instead of scrolling through 250 countries. */
.cpick{position:relative;display:block;width:100%}
.cpick>select{width:100%}
.cpick__hit{position:absolute;inset:0;z-index:1;cursor:pointer;border-radius:9px}
.cpick.is-open>select{border-color:var(--theme-primary,#0b4c9c)!important;box-shadow:0 0 0 4px rgba(11,76,156,.1)!important}
.cpick__panel{position:fixed;z-index:2147483100;display:flex;flex-direction:column;overflow:hidden;border:1px solid #d3dee6;border-radius:12px;background:#fff;box-shadow:0 18px 44px -12px rgba(8,35,62,.32),0 2px 6px rgba(8,35,62,.08);font-family:inherit;animation:cpick-in .14s ease-out}
.cpick__panel[hidden]{display:none!important}
.cpick__panel.is-sheet{border-radius:16px;box-shadow:0 0 0 100vmax rgba(5,20,36,.45),0 18px 44px rgba(0,0,0,.25)}
@keyframes cpick-in{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
.cpick__search{position:relative;flex:0 0 auto;padding:10px;border-bottom:1px solid #e6edf2;background:#f8fafb}
.cpick__search svg{position:absolute;left:22px;top:50%;width:17px;height:17px;transform:translateY(-50%);fill:none;stroke:#7d8e9b;stroke-width:2.2;stroke-linecap:round;pointer-events:none}
.cpick__search input{display:block;width:100%;height:42px;margin:0;padding:0 12px 0 38px!important;border:1px solid #cfdbe4!important;border-radius:9px!important;background:#fff!important;color:var(--ink,#08233e);font:inherit;font-size:16px;line-height:1;outline:0;box-shadow:none!important}
.cpick__search input:focus{border-color:var(--theme-primary,#0b4c9c)!important;box-shadow:0 0 0 3px rgba(11,76,156,.12)!important}
.cpick__list{flex:1 1 auto;min-height:0;margin:0;padding:6px;overflow-y:auto;overscroll-behavior:contain;list-style:none;-webkit-overflow-scrolling:touch}
.cpick__item{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0;padding:9px 12px;border-radius:8px;color:var(--ink,#08233e);font-size:.95rem;line-height:1.3;cursor:pointer;user-select:none}
.cpick__item::before,.cpick__item::marker{content:none}
.cpick__item mark{padding:0;background:none;color:var(--theme-primary,#0b4c9c);font-weight:800}
.cpick__item svg{flex:0 0 16px;width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round;opacity:0}
.cpick__item.is-active{background:#edf3f9}
.cpick__item.is-selected{color:var(--theme-primary,#0b4c9c);font-weight:700}
.cpick__item.is-selected svg{opacity:1}
.cpick__empty{margin:0;padding:22px 16px;color:#7d8e9b;font-size:.9rem;text-align:center}
.cpick__panel.is-sheet .cpick__item{padding:12px 12px;font-size:1rem}