/* Candy Club review: visual direction from Research Bento Grid for MatMeg.
   Product data and flow come from the existing festival prototype. */
:root { color-scheme:only light; --closed-photo-tint:rgba(223,49,104,.42); --surface:#ffc8df; --paper:#fff3f8; --ink:#701a42; --muted:#813653; --pink:#df3168; --action:#931647; --action-hover:#751039; --line:#e7a5bf; --control-line:#ae6884; background:var(--surface); color:var(--ink); }
body { background:var(--surface); }
.browse-shell { max-width:480px; }
.browse-header { padding:14px 18px 8px; gap:9px; align-items:center; }
.browse-header .brand { flex:none; min-height:50px; display:flex; align-items:center; }
.browse-header .brand img { width:75px; height:55px; }
.header-date { margin:0 auto 0 2px; font-size:.75rem; line-height:1.4; font-weight:750; letter-spacing:.025em; }
.header-date span { font-size:.6875rem; font-weight:450; letter-spacing:0; }
.browse-header .signin { border:1px solid #bd668a; border-radius:99px; padding:8px 12px; color:var(--ink); background:#fff0f655; white-space:nowrap; }
.browse-main { padding:0 16px 24px; }
.candy-hero { padding-top:8px; }
.candy-hero h1 { font-size:clamp(3.4rem,15vw,4.7rem); font-weight:850; letter-spacing:-.065em; line-height:.94; margin:0; color:#b21957; }
.hero-copy { margin:10px 0 0; max-width:330px; font-size:.9375rem; line-height:1.35; }
.hero-copy strong { font-weight:650; }
.candy-collage { height:250px; position:relative; margin:10px auto 0; max-width:350px; isolation:isolate; }
.food-bubble { position:absolute; display:block; border:5px solid #fff3f8; border-radius:50%; background:#fff3f8; box-shadow:0 8px 18px #a52b6522; }
.food-bubble img { width:100%; height:100%; display:block; object-fit:cover; border-radius:50%; }
.bubble-main { width:218px; height:218px; left:50%; top:0; transform:translateX(-50%); z-index:1; }
.bubble-left { width:98px; height:98px; left:0; top:4px; z-index:2; transform:rotate(-7deg); }
.bubble-right { width:106px; height:106px; right:0; top:131px; z-index:2; transform:rotate(6deg); }
.bubble-price { position:absolute; right:-5px; bottom:-7px; background:#fff3f8; color:var(--ink); border-radius:50px; padding:5px 8px; line-height:1; font-size:1.25rem; font-weight:750; box-shadow:0 3px 6px #701a4210; }
.bubble-main .bubble-price { font-size:1.75rem; right:auto; left:50%; bottom:5px; transform:translateX(-50%); }
.bubble-price small { font-size:.6875rem; font-weight:500; }
.hero-sticker { position:absolute; right:0; top:7px; background:var(--ink); color:#fff3f8; padding:10px 13px; border-radius:30px; font-size:.75rem; transform:rotate(8deg); }
.list-heading { display:flex; align-items:center; flex-wrap:wrap; justify-content:space-between; gap:4px 8px; margin:10px 0 12px; }
.list-heading h2 { margin:0; font-size:1.3rem; font-weight:700; letter-spacing:-.03em; }
.list-heading > span { font-size:.6875rem; color:var(--muted); }
.food-grid { display:grid; grid-template-columns:minmax(0,1fr); gap:10px; }
.food-card { display:grid; grid-template-columns:112px minmax(0,1fr); gap:12px; align-items:center; padding:10px; border:1px solid #fff5facc; border-radius:22px; background:#fff3f8; box-shadow:none; min-height:134px; }
.food-card .photo { width:112px; aspect-ratio:4/3; height:auto; align-self:center; border-radius:15px; overflow:hidden; }
.food-card-body { display:flex; flex-direction:column; align-items:flex-start; padding:0; gap:4px; min-width:0; }
.food-card h3 { font-size:1rem; line-height:1.15; font-weight:650; -webkit-line-clamp:2; }
.card-price { font-size:2.05rem; font-weight:750; letter-spacing:-.045em; order:3; margin-top:1px; align-self:flex-start; }
.card-price small { font-size:.75rem; }
.card-restaurant { font-size:.75rem; line-height:1.25; max-width:100%; color:var(--muted); }
.card-area { display:none; }
.food-card:hover { background:#fff9fc; }
.food-card:focus-visible { outline:3px solid var(--ink); }
.dock { background:#fff0f6f5; border:0; border-radius:22px 22px 0 0; box-shadow:0 -5px 22px #a02b6512; padding:11px 18px max(12px,env(safe-area-inset-bottom)); }
.dock-caption { color:var(--muted); margin-bottom:7px; font-size:.75rem; }
.dock-inner { max-width:430px; }
.dock .button { border-radius:99px; min-height:49px; font-weight:600; }
.with-dock { padding-bottom:calc(var(--dock-height) + env(safe-area-inset-bottom)); }
.button.primary { background:var(--action); border-color:var(--action); }
.button.primary:hover { background:var(--action-hover); }
.screen h1, .branch-heading h1 { font-weight:700; color:var(--ink); }
.question-art,.question-icon { background:#fff3f8; }
.segment { background:#e5a3bf; }
.segment.done { background:var(--action); }
.button, .field input, .phone-row { border-radius:18px; }
.button.secondary { background:#fff3f8a8; }
.review-bar { background:#fff3f8; color:var(--ink); }
.branch-page { padding-top:8px; }
.branch-heading { margin-top:12px; }
.branch-dish { background:#fff3f8; border-radius:22px; overflow:hidden; border-color:transparent; }
.branch-dish .offer-image { border-radius:0; }
.branch-page .offer-price { color:var(--action); font-weight:750; }
.dish-card { min-width:0; position:relative; }
.save-card { position:absolute; top:8px; right:8px; width:44px; height:44px; display:grid; place-items:center; padding:0; background:#fff3f9ed; border:0; border-radius:50%; color:var(--ink); font-size:1.6rem; font-weight:400; line-height:1; }
.save-card[aria-pressed='true'] { color:var(--action); }
body[data-layout='tiles'] .food-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:23px 12px; }
body[data-layout='tiles'] .food-card { display:block; border:0; padding:0; border-radius:0; background:none; min-height:0; }
body[data-layout='tiles'] .food-card .photo { width:100%; aspect-ratio:1/1; border:0; border-radius:19px; }
body[data-layout='tiles'] .food-card-body { padding:9px 2px 0; gap:5px; }
body[data-layout='tiles'] .food-card h3 { min-height:2.3em; }
body[data-layout='tiles'] .card-price { margin-top:1px; }
@media(max-width:350px) {
  .browse-header { padding-inline:12px; gap:6px; }
  .browse-header .brand img { width:62px; }
  .browse-header .signin { padding-inline:10px; font-size:.75rem; }
  .header-date { font-size:.6875rem; margin-left:0; }
  .header-date span { font-size:.625rem; }
  .browse-main { padding-inline:12px; }
  .candy-collage { height:215px; }
  .bubble-main { width:178px; height:178px; top:20px; }
  .bubble-left { width:79px; height:79px; }
  .bubble-right { width:85px; height:85px; top:117px; }
  .hero-sticker { font-size:.6875rem; padding:8px 10px; }
  .food-card { grid-template-columns:96px minmax(0,1fr); gap:10px; padding:9px; }
  .food-card .photo { width:96px; }
  .food-card h3 { font-size:.9375rem; }
}
@media(prefers-reduced-motion:reduce) { * { scroll-behavior:auto!important; } }

/* Real phone preview uses the product screen without desktop review controls. */
body.mobile-preview .review-bar { display:none; }