/* Mobile presentation only. Original catalogue remains the desktop/fallback UI. */
#mobile-coffee-catalog { display:none; }
body.atelier dialog.mobile-coffee-sheet:not([open]) { display:none; }
@media (max-width:760px) {
  body.atelier.mcc-modal-open { overflow:hidden; }
  main.coffee-catalog > #mobile-coffee-catalog[data-ready="true"]:not([hidden]) { display:block; }
  #mobile-coffee-catalog[data-ready="true"]:not([hidden]) ~ .coffee-shell { display:none; }
  #mobile-coffee-catalog {
    --mcc-ink:#17372e; --mcc-paper:#f0ede4; --mcc-muted:#61705f;
    color:var(--mcc-ink); padding:0 20px 26px; font:400 14px/1.6 var(--abika-typeface,Manrope,Arial,sans-serif);
  }
  #mobile-coffee-catalog :is(h1,h2,p,ul) { margin:0; }
  #mobile-coffee-catalog [hidden], dialog.mobile-coffee-sheet [hidden] { display:none!important; }
  #mobile-coffee-catalog .mcc-heading { display:flex; align-items:baseline; justify-content:space-between; gap:15px; }
  #mobile-coffee-catalog .mcc-heading h1 { font:400 27px/1.2 var(--abika-typeface,Manrope,Arial,sans-serif); letter-spacing:-.045em; }
  #mobile-coffee-catalog .mcc-result-count { flex:0 0 auto; color:var(--mcc-muted); font-size:10px; }
  #mobile-coffee-catalog .mcc-search { display:flex; align-items:center; gap:10px; min-height:47px; border-bottom:1px solid #17372e45; margin-top:14px; }
  #mobile-coffee-catalog .mcc-search>svg { flex:0 0 19px; }
  #mobile-coffee-catalog .mcc-search input { min-width:0; width:100%; min-height:46px; padding:8px 0; border:0; border-radius:0; background:transparent; color:var(--mcc-ink); font-size:16px; color-scheme:light; }
  #mobile-coffee-catalog .mcc-search input::placeholder { color:var(--mcc-muted); font-size:13px; opacity:1; }
  #mobile-coffee-catalog .mcc-categories { display:flex; gap:7px; margin:17px -20px 0; padding:0 20px 5px; overflow-x:auto; overscroll-behavior-x:contain; scrollbar-width:none; }
  #mobile-coffee-catalog .mcc-categories::-webkit-scrollbar { display:none; }
  #mobile-coffee-catalog .mcc-categories button { flex:0 0 auto; min-height:44px; padding:9px 13px; border:1px solid #17372e35; border-radius:24px; background:transparent; color:var(--mcc-ink); font-size:11px; white-space:nowrap; }
  #mobile-coffee-catalog .mcc-categories [aria-pressed="true"] { background:var(--mcc-ink); border-color:var(--mcc-ink); color:var(--mcc-paper); }
  #mobile-coffee-catalog .mcc-filter-toolbar { display:flex; align-items:start; justify-content:space-between; gap:15px; margin:4px 0 12px; }
  #mobile-coffee-catalog .mcc-filters { flex:1; min-width:0; }
  #mobile-coffee-catalog .mcc-filters summary { display:flex; align-items:center; gap:9px; width:max-content; max-width:100%; min-height:44px; color:#49614e; font-size:11px; cursor:pointer; list-style:none; }
  #mobile-coffee-catalog .mcc-filters summary::-webkit-details-marker { display:none; }
  #mobile-coffee-catalog .mcc-filters summary::after { content:'+'; font-size:17px; }
  #mobile-coffee-catalog .mcc-filters[open] summary::after { content:'−'; }
  #mobile-coffee-catalog .mcc-filter-fields { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:14px; padding:0 0 18px; }
  #mobile-coffee-catalog .mcc-field { display:flex; flex-direction:column; min-width:0; gap:7px; color:#49614e; font-size:10px; }
  #mobile-coffee-catalog .mcc-field select { width:100%; min-width:0; min-height:44px; padding:8px; border:1px solid #17372e35; border-radius:5px; color:var(--mcc-ink); background:transparent; font-size:16px; color-scheme:light; }
  #mobile-coffee-catalog .mcc-reset { min-height:44px; padding:8px 0; border:0; border-bottom:1px solid transparent; background:transparent; color:#49614e; text-decoration:underline; text-underline-offset:4px; font-size:10px; }
  #mobile-coffee-catalog .mcc-product-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px 14px; padding:0; list-style:none; scroll-margin-top:100px; }
  #mobile-coffee-catalog .mcc-product { min-width:0; }
  #mobile-coffee-catalog .mcc-product-button { display:flex; flex-direction:column; width:100%; padding:0; border:0; background:transparent; color:var(--mcc-ink); text-align:left; }
  #mobile-coffee-catalog .mcc-product-image { position:relative; display:block; width:100%; height:clamp(150px,43vw,195px); overflow:hidden; background:#e0d4c5; border-radius:8px; }
  #mobile-coffee-catalog .mcc-product-image img { display:block; width:100%; height:100%; object-fit:contain; }
  #mobile-coffee-catalog .mcc-card-plus { position:absolute; right:8px; bottom:8px; display:grid; place-items:center; width:28px; height:28px; border:1px solid #17372e28; border-radius:50%; background:#f0ede4f0; }
  #mobile-coffee-catalog .mcc-product-name { display:block; margin-top:10px; font:400 15px/1.35 var(--abika-typeface,Manrope,Arial,sans-serif); letter-spacing:-.025em; overflow-wrap:anywhere; }
  #mobile-coffee-catalog .mcc-product-meta { display:block; margin-top:5px; font-size:10px; color:var(--mcc-muted); }
  #mobile-coffee-catalog .mcc-empty { padding:35px 0; font-size:14px; }
  #mobile-coffee-catalog .mcc-empty button { min-height:44px; margin-top:12px; padding:10px 15px; border:1px solid var(--mcc-ink); border-radius:5px; background:var(--mcc-ink); color:var(--mcc-paper); font-size:12px; }
  #mobile-coffee-catalog .mcc-pagination { display:flex; justify-content:space-between; align-items:center; gap:15px; margin-top:19px; }
  #mobile-coffee-catalog .mcc-pagination button { display:flex; align-items:center; gap:8px; min-height:44px; padding:8px 0; border:0; background:transparent; color:var(--mcc-ink); font-size:11px; }
  #mobile-coffee-catalog .mcc-pagination button:disabled { opacity:.3; cursor:default; }
  #mobile-coffee-catalog .mcc-page-previous svg { transform:rotate(180deg); }
  #mobile-coffee-catalog .mcc-page-count { font-size:11px; font-variant-numeric:tabular-nums; color:var(--mcc-muted); }
  #mobile-coffee-catalog .mcc-blend-link { display:flex; align-items:center; gap:12px; min-height:64px; margin-top:24px; border-top:1px solid #17372e2b; border-bottom:1px solid #17372e2b; font-size:10px; }
  #mobile-coffee-catalog .mcc-blend-link>span:nth-child(2) { margin-left:auto; font-size:11px; }
  #mobile-coffee-catalog .mcc-blend-link>svg { flex:0 0 17px; }
  #mobile-coffee-catalog .mcc-support { padding-top:26px; scroll-margin-top:100px; }
  #mobile-coffee-catalog .mcc-support h2 { margin-bottom:15px; font:400 22px/1.25 var(--abika-typeface,Manrope,Arial,sans-serif); letter-spacing:-.035em; }
  #mobile-coffee-catalog .mcc-support-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; }
  #mobile-coffee-catalog .mcc-support button { display:flex; align-items:center; justify-content:space-between; gap:8px; min-height:53px; padding:12px; border:1px solid #17372e30; border-radius:5px; background:transparent; color:var(--mcc-ink); font-size:11px; text-align:left; scroll-margin-top:110px; }
  #mobile-coffee-catalog .mcc-support button svg { flex:0 0 16px; }
  #mobile-coffee-catalog .mcc-private-label { margin-top:25px; padding:18px 0 0; border-top:1px solid #17372e2b; }
  #mobile-coffee-catalog .mcc-private-label strong { display:block; font-size:12px; font-weight:500; }
  #mobile-coffee-catalog .mcc-private-label p { margin-top:7px; max-width:55ch; font-size:11px; line-height:1.85; color:var(--mcc-muted); }
  #mobile-coffee-catalog .mcc-photography-note { margin-top:17px; font-size:10px; line-height:1.8; color:var(--mcc-muted); }
  #mobile-coffee-catalog :is(button,a,input,select,summary):focus-visible { outline:2px solid #698570; outline-offset:3px; }

  body.atelier dialog.mobile-coffee-sheet {
    position:fixed; inset:auto 0 0; width:100%; max-width:760px;
    max-height:calc(100vh - 22px); max-height:calc(100dvh - 22px);
    margin:0 auto; padding:12px 23px max(25px,env(safe-area-inset-bottom));
    overflow-x:hidden; overflow-y:auto; overscroll-behavior:contain;
    border:0; border-radius:22px 22px 0 0; background:#f0ede4; color:#17372e;
    font:400 14px/1.6 var(--abika-typeface,Manrope,Arial,sans-serif); color-scheme:light;
  }
  body.atelier dialog.mobile-coffee-sheet::backdrop { background:#07130ed1; backdrop-filter:blur(3px); }
  .mobile-coffee-sheet .mcc-sheet-grip { width:35px; height:3px; margin:0 auto 9px; border-radius:2px; background:#17372e4d; }
  .mobile-coffee-sheet .mcc-sheet-header { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-bottom:11px; }
  .mobile-coffee-sheet .mcc-sheet-header>span { color:#61705f; font-size:9px; letter-spacing:.11em; }
  .mobile-coffee-sheet .mcc-sheet-close { display:grid; place-items:center; flex:0 0 44px; width:44px; min-height:44px; padding:0; border:1px solid #17372e2b; border-radius:50%; background:transparent; color:#17372e; }
  .mobile-coffee-sheet .mcc-sheet-product { display:grid; grid-template-columns:84px minmax(0,1fr); align-items:center; gap:19px; margin:0 0 20px; }
  .mobile-coffee-sheet .mcc-sheet-product>img { display:block; width:84px; height:108px; object-fit:contain; border-radius:5px; background:#dfd0bf; }
  body.atelier .mobile-coffee-sheet .mcc-sheet-product h2 { margin:0; font:400 25px/1.16 var(--abika-typeface,Manrope,Arial,sans-serif); letter-spacing:-.035em; overflow-wrap:anywhere; }
  .mobile-coffee-sheet .mcc-sheet-product p { margin:10px 0 0; font-size:10px; color:#61705f; }
  .mobile-coffee-sheet .mcc-sheet-forms { min-width:0; margin:0; padding:16px 0; border:0; border-top:1px solid #17372e28; }
  .mobile-coffee-sheet .mcc-sheet-forms legend { float:left; width:100%; padding:0; margin-bottom:11px; font-size:11px; }
  .mobile-coffee-sheet .mcc-form-options { display:flex; clear:both; gap:9px; }
  .mobile-coffee-sheet .mcc-form-option { position:relative; display:flex; min-width:0; flex:1; }
  .mobile-coffee-sheet .mcc-form-option input { position:absolute; width:1px; height:1px; opacity:0; }
  .mobile-coffee-sheet .mcc-form-option span { display:flex; align-items:center; justify-content:center; width:100%; min-height:44px; padding:8px 13px; border:1px solid #17372e38; border-radius:5px; background:transparent; color:#17372e; font-size:12px; }
  .mobile-coffee-sheet .mcc-form-option input:checked+span { background:#17372e; border-color:#17372e; color:#f0ede4; }
  .mobile-coffee-sheet .mcc-form-option input:focus-visible+span { outline:2px solid #698570; outline-offset:3px; }
  .mobile-coffee-sheet .mcc-form-hint { clear:both; margin:10px 0 0; font-size:10px; color:#61705f; }
  .mobile-coffee-sheet .mcc-sheet-controls { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:22px; margin-top:2px; }
  .mobile-coffee-sheet :is(.mcc-field,.mcc-quantity-field) { display:flex; flex-direction:column; gap:9px; min-width:0; font-size:11px; }
  .mobile-coffee-sheet .mcc-field select { width:100%; min-width:0; min-height:46px; border:1px solid #17372e38; border-radius:5px; background:transparent; color:#17372e; padding:10px; font-size:16px; }
  .mobile-coffee-sheet .mcc-stepper { display:grid; grid-template-columns:44px minmax(0,1fr) 44px; min-width:0; border:1px solid #17372e38; border-radius:5px; }
  .mobile-coffee-sheet .mcc-stepper :is(button,input) { width:100%; min-width:0; min-height:44px; margin:0; border:0; border-radius:0; padding:0; background:transparent; text-align:center; color:#17372e; font-size:16px; }
  .mobile-coffee-sheet .mcc-stepper button { display:grid; place-items:center; }
  .mobile-coffee-sheet .mcc-stepper button:disabled { opacity:.35; }
  .mobile-coffee-sheet .mcc-stepper input { appearance:textfield; font-variant-numeric:tabular-nums; }
  .mobile-coffee-sheet .mcc-stepper input::-webkit-inner-spin-button,.mobile-coffee-sheet .mcc-stepper input::-webkit-outer-spin-button { -webkit-appearance:none; margin:0; }
  .mobile-coffee-sheet .mcc-total-row { display:flex; align-items:baseline; justify-content:space-between; gap:20px; border-bottom:1px solid #17372e28; padding:19px 0 14px; font-size:11px; }
  .mobile-coffee-sheet .mcc-total-row output { font-size:23px; font-variant-numeric:tabular-nums; letter-spacing:-.035em; }
  .mobile-coffee-sheet .mcc-line-error { margin:7px 0 0; font-size:11px; line-height:1.6; color:#963c2b; }
  .mobile-coffee-sheet .mcc-line-error:empty { display:none; }
  .mobile-coffee-sheet .mcc-sheet-note { margin:10px 0 0; color:#61705f; font-size:10px; line-height:1.75; }
  .mobile-coffee-sheet .mcc-sheet-actions { margin-top:18px; }
  .mobile-coffee-sheet .mcc-sheet-add { display:flex; align-items:center; justify-content:space-between; gap:15px; width:100%; min-height:54px; border:1px solid #17372e; border-radius:5px; background:#17372e; color:#f0ede4; padding:14px 17px; font-size:13px; }
  .mobile-coffee-sheet .mcc-sheet-add:disabled { opacity:.4; cursor:not-allowed; }
  .mobile-coffee-sheet .mcc-sheet-message { margin:10px 0 0; font-size:11px; line-height:1.75; color:#385c3f; }
  .mobile-coffee-sheet .mcc-sheet-message:empty { display:none; }
  .mobile-coffee-sheet .mcc-sheet-message.is-error { color:#963c2b; }
  .mobile-coffee-sheet :is(.mcc-sheet-list,.mcc-sheet-blend) { display:flex; align-items:center; justify-content:space-between; gap:15px; width:100%; min-height:44px; padding:10px 0; border:0; background:transparent; color:#17372e; font-size:11px; text-align:left; }
  .mobile-coffee-sheet .mcc-sheet-blend { border-top:1px solid #17372e28; }
  .mobile-coffee-sheet :is(button,a,input,select):focus-visible { outline:2px solid #698570; outline-offset:3px; }
}
@media (max-width:360px) {
  #mobile-coffee-catalog { padding-inline:16px; }
  #mobile-coffee-catalog .mcc-categories { margin-inline:-16px; padding-inline:16px; }
  #mobile-coffee-catalog .mcc-heading h1 { font-size:25px; }
  #mobile-coffee-catalog .mcc-product-grid { gap:20px 12px; }
  #mobile-coffee-catalog .mcc-product-name { font-size:14px; }
  body.atelier dialog.mobile-coffee-sheet { padding-inline:18px; }
  body.atelier .mobile-coffee-sheet .mcc-sheet-product h2 { font-size:23px; }
  .mobile-coffee-sheet .mcc-sheet-controls { gap:14px; }
}
@media (prefers-reduced-motion:reduce) {
  #mobile-coffee-catalog *, .mobile-coffee-sheet * { scroll-behavior:auto!important; }
}
