/* Touch-friendly additions; the original visual identity lives in family-menu.html. */
html { -webkit-text-size-adjust:100%; scroll-padding-top:22px; }
body { padding-left:env(safe-area-inset-left); padding-right:env(safe-area-inset-right); }
button,a,input,summary { -webkit-tap-highlight-color:transparent; touch-action:manipulation; }
button:focus-visible,a:focus-visible,summary:focus-visible,input:focus-visible { outline:3px solid #b45e3c; outline-offset:3px; }
.search { font-size:16px; min-height:46px; }
.lang-toggle,.order-jump,.tab,.action,.clear { min-height:44px; }
.add,.x { width:44px; height:44px; flex-shrink:0; }
.chip { padding:3px 4px 3px 12px; max-width:100%; }
.chip button { width:44px; height:44px; flex-shrink:0; font-size:20px; }
.card { border-radius:12px; display:flex; flex-direction:column; }
.cardbody { flex:1; display:flex; flex-direction:column; min-width:0; }
.cover { width:100%; border:0; padding:0; text-align:left; display:block; }
.dishname { border:0; padding:0; text-align:left; background:none; color:var(--ink); min-height:44px; overflow-wrap:anywhere; }
.dishen { font-size:11px; min-height:34px; }
.card-video { display:flex; align-items:center; justify-content:center; gap:7px; min-height:44px; margin-top:12px; padding:9px 6px; border-radius:7px; background:var(--soft); color:var(--green); text-decoration:none; font-size:13px; font-weight:600; text-align:center; }
.cardfoot { margin-top:auto; padding-top:10px; }
.card-video + .cardfoot { margin-top:10px; }
.tutorial-actions { display:grid; grid-template-columns:1fr 1fr; gap:9px; margin-top:12px; }
.tutorial-actions a { display:flex; align-items:center; justify-content:center; min-height:48px; text-align:center; }
.tutorial-section { border-top:1px solid var(--line); padding-top:17px; margin-top:18px; }
.tutorial-section h3 { margin:0; font-size:17px; }
.tutorial-section p { font-size:12px; color:#70736a; line-height:1.7; margin:6px 0; }
.secondary-action { margin-top:8px; width:100%; }
.qr-disclosure { margin-top:12px; border-top:1px solid var(--line); }
.qr-disclosure summary { cursor:pointer; min-height:44px; padding:12px 0; font-size:12px; color:var(--green); }
.qrline { margin-top:0; align-items:flex-start; }
.qrline img { width:132px; height:132px; flex-shrink:0; }
.qrline span { font-size:12px; }
.qr-status { color:#a4432b; }
.results-line { display:flex; justify-content:space-between; align-items:center; gap:10px; margin:0 0 14px; color:#70736a; font-size:12px; }
.results-line a { color:var(--green); min-height:44px; display:inline-flex; align-items:center; }
.load-more { display:block; margin:24px auto 0; min-width:180px; min-height:48px; font-size:14px; }
.load-more[hidden], [hidden] { display:none !important; }
.provider-row { display:flex; align-items:center; gap:8px; margin:-4px 0 16px; color:var(--green); }
.provider-row select { font:14px -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; max-width:100%; }
.dialog { border-radius:16px; max-height:calc(100vh - 40px); max-height:calc(100dvh - 40px); overscroll-behavior:contain; }
.dlgcontent { max-height:none; overflow:visible; min-width:0; }
.dlgvisual > img { width:100%; height:100%; object-fit:cover; position:absolute; inset:0; }
.dlgcontent h2 { overflow-wrap:anywhere; }
.modal { padding:20px; padding-top:max(20px,env(safe-area-inset-top)); padding-bottom:max(20px,env(safe-area-inset-bottom)); }
.x { background:#fffefa; box-shadow:0 2px 12px #0002; color:var(--ink); }
.actions > * { min-height:46px; }
.boxhead { gap:12px; }
.cart-actions { gap:10px; flex-wrap:wrap; }
.menu-actions { display:flex; gap:8px; flex-wrap:wrap; }
.mobile-dock { display:none; }
.toast { max-width:calc(100% - 32px); width:max-content; text-align:center; white-space:pre-line; }
.copy-panel { border:1px solid var(--line); padding:12px; background:#fffefa; margin-top:12px; }
.copy-panel label { display:block; font-size:13px; margin-bottom:8px; }
.copy-panel textarea { display:block; width:100%; min-height:150px; font:16px/1.6 sans-serif; padding:10px; border:1px solid #ced6ca; border-radius:6px; }
@media (min-width:651px) and (max-width:1100px) {
  .grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .topright { gap:12px; }
  .hero { gap:24px; }
  .hero h1 { font-size:48px; }
  .dialog { width:min(900px,100%); grid-template-columns:42% 58%; }
}
@media (hover:none) { .card:hover { transform:none; box-shadow:none; } .card:hover .cover img { transform:none; } }
@media (max-width:650px) {
  body { padding-bottom:calc(88px + env(safe-area-inset-bottom)); }
  .wrap { width:calc(100% - 28px); }
  .top { min-height:70px; height:auto; gap:10px; padding:10px 0; }
  .brand { gap:7px; }
  .brandtext { font-size:16px; letter-spacing:1px; }
  .brandtext small { font-size:8px; letter-spacing:1px; }
  .topright { gap:6px; }
  .order-jump { display:none; }
  .hero { padding:20px 0 24px; gap:16px; }
  .hero-pic { height:164px; border-radius:12px 42px 12px 12px; }
  .hero h1 { font-size:38px; margin:10px 0; }
  .hero p { font-size:13px; line-height:1.7; margin:10px 0; }
  .stats { margin-top:16px; }
  .hero-caption b { font-size:21px; }
  .toolbar { padding-top:20px; }
  .section-title h2 { font-size:25px; }
  .region-tabs { gap:7px; -webkit-overflow-scrolling:touch; }
  .tab { padding:10px 14px; font-size:13px; }
  .grid { gap:11px; }
  .cover { height:136px; }
  .dishname { font-size:16px; line-height:1.4; }
  .dishen { font-size:11px; line-height:1.45; }
  .card-video { font-size:12px; }
  .cardbody { padding:10px; }
  .region { left:8px; top:8px; padding:4px 7px; }
  .modal { padding:12px; padding-top:max(12px,env(safe-area-inset-top)); padding-bottom:max(12px,env(safe-area-inset-bottom)); }
  .dialog { max-height:calc(100vh - 24px); max-height:calc(100dvh - 24px - env(safe-area-inset-top) - env(safe-area-inset-bottom)); grid-template-columns:1fr; }
  .dlgvisual { min-height:200px; height:200px; }
  .dlgcontent { padding:20px 18px 24px; }
  .dlgcontent h2 { font-size:25px; }
  .note { margin-top:12px; padding-top:12px; }
  .recipebox { font-size:14px; }
  .box { padding:17px; border-radius:12px; }
  .boxhead { align-items:flex-start; }
  .mobile-dock { display:flex; position:fixed; z-index:5; bottom:0; left:0; right:0; gap:10px; align-items:center; justify-content:space-between; background:#fffefaf5; border-top:1px solid var(--line); padding:10px max(14px,env(safe-area-inset-right)) calc(10px + env(safe-area-inset-bottom)) max(14px,env(safe-area-inset-left)); box-shadow:0 -4px 24px #282a2608; }
  .mobile-dock a { display:flex; align-items:center; justify-content:center; flex:1; min-height:46px; border-radius:8px; color:var(--green); text-decoration:none; font-size:14px; }
  .mobile-dock .dock-cart { background:var(--green); color:white; flex:1.5; }
  .dock-cart span { padding-left:6px; font-weight:700; }
  .toast { bottom:calc(90px + env(safe-area-inset-bottom)); }
}
@media (max-width:359px) { .grid { gap:8px; } .cover { height:112px; } .cardbody { padding:8px; } .dishname { font-size:14px; } .qrline { flex-direction:column; } .tutorial-actions { grid-template-columns:1fr; } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*::before,*::after { transition:none !important; animation:none !important; } }
