:root{
    --amber:#E8A33D; --amber-dk:#C9832A;
    --teal:#3FA796; --teal-dk:#2C8577;
    --flame:#C1432A;
    --ink:#0B1F1A; --ink-2:#17332A;
    --paper:#F6F1E4; --paper-2:#FBF8EF; --line:#E4DCC8;
  }
  *{-webkit-tap-highlight-color:transparent;}
  #lm-customer-app{background:var(--paper); color:var(--ink); font-family:'Inter',sans-serif; overscroll-behavior:none;}
  .disp{font-family:'Space Grotesk',sans-serif;}
  .safe-b{padding-bottom:env(safe-area-inset-bottom);}
  .safe-t{padding-top:env(safe-area-inset-top);}
  .scrollbar-none::-webkit-scrollbar{display:none;}
  .scrollbar-none{-ms-overflow-style:none; scrollbar-width:none;}
  .view{display:none;}
  .view.active{display:block;}
  .cat-tab{position:relative; color:#7A7261; font-weight:600; font-size:14px; padding:6px 2px 12px 2px; white-space:nowrap;}
  .cat-tab.on{color:var(--ink);}
  .cat-tab.on::after{content:'';position:absolute; left:0; right:0; bottom:0; height:3px; background:var(--amber); border-radius:2px;}
  .store-row{border-bottom:1px solid var(--line);}
  .pin-digit{width:44px; height:56px; border:2px solid var(--ink); border-radius:10px; display:flex; align-items:center; justify-content:center; font-family:'Space Grotesk'; font-weight:700; font-size:26px; background:var(--paper-2);}
  .step-dot{width:10px; height:10px; border-radius:999px; background:var(--line); flex-shrink:0;}
  .step-dot.done{background:var(--teal);}
  .step-dot.now{background:var(--amber); box-shadow:0 0 0 4px rgba(232,163,61,.25);}
  .step-line{flex:1; height:2px; background:var(--line);}
  .step-line.done{background:var(--teal);}
  .sheet{position:fixed; left:0; right:0; bottom:0; background:var(--paper-2); border-radius:22px 22px 0 0; box-shadow:0 -12px 40px rgba(11,31,26,.18); transform:translateY(105%); transition:transform .32s cubic-bezier(.2,.8,.2,1); z-index:60; max-height:86vh; overflow:auto;}
  .sheet.open{transform:translateY(0);}
  .overlay{position:fixed; inset:0; background:rgba(11,31,26,.45); opacity:0; pointer-events:none; transition:opacity .25s; z-index:55;}
  .overlay.open{opacity:1; pointer-events:auto;}
  .btn-primary{background:var(--ink); color:var(--paper-2); font-weight:600; border-radius:14px;}
  .btn-primary:active{background:var(--ink-2);}
  .btn-amber{background:var(--amber); color:var(--ink); font-weight:700; border-radius:14px;}
  .btn-amber:active{background:var(--amber-dk);}
  .nav-item{color:#9C9482;}
  .nav-item.on{color:var(--ink);}
  .card-store{border:1px solid var(--line); border-radius:18px; background:var(--paper-2);}
  .toast{position:fixed; left:50%; top:14px; transform:translate(-50%,-140%); background:var(--ink); color:var(--paper-2); padding:12px 18px; border-radius:12px; font-size:13.5px; z-index:80; transition:transform .35s cubic-bezier(.2,.8,.2,1); max-width:88%; text-align:center;}
  .toast.show{transform:translate(-50%,0);}
  .desktop-link{color:#7A7261; font-weight:600; font-size:14px; padding-bottom:4px; border-bottom:2px solid transparent; cursor:pointer;}
  .desktop-link.on{color:var(--ink); border-color:var(--amber);}
  .desktop-nav{display:none;}
  /* Desktop: a real reflowed site layout, not a phone pinned to the middle of the screen */
  @media (min-width:900px){
    .content-wrap{max-width:1180px; margin:0 auto; padding-left:32px; padding-right:32px;}
    #storeList{display:grid; grid-template-columns:repeat(3,1fr); gap:16px;}
    .mobile-bottom-nav{display:none;}
    .desktop-nav{display:flex;}
    .sheet{left:auto; right:24px; bottom:24px; width:380px; border-radius:20px; box-shadow:0 20px 60px rgba(11,31,26,.25);}
    main.view{padding-bottom:48px !important;}
  }
.ptab-btn{font-size:12.5px; font-weight:600; padding:7px 14px; border-radius:999px; color:#8A8272; border:1px solid var(--line); white-space:nowrap; cursor:pointer;}
.ptab-btn.on{background:var(--ink); color:#fff; border-color:var(--ink);}
