/* Лекота — accessible, mobile-first. Base text 18px. Contrast ≥ 4.5:1 for text. */
:root{
  --green:#2F6B4F; --green-d:#234F3B; --green-l:#EAF2ED; --cream:#fff; --sand:#EFF2EF; --ink:#1E2A24;
  --muted:#4F5D55; --accent:#BF5420; --accent-d:#9E4519; --line:#DCE1DD; --white:#fff; --err:#A1201A; --ok:#1F6B45;
  --focus:#1D4ED8; --r:16px; --edge:#DEE3DF;
  --shadow:0 1px 3px rgba(30,42,36,.08),0 6px 20px rgba(30,42,36,.08);
  --head:"Geologica","Manrope",system-ui,sans-serif;
}
*{box-sizing:border-box}
html{font-size:112.5%}               /* 18px */
html,body{margin:0}
html{touch-action:manipulation;-webkit-text-size-adjust:100%}
button,label,input,a{touch-action:manipulation}
/* iOS Safari: no grey box over a tapped card; the cards show their own press and ✓ */
.opt,.seg label,.lk-btn,.lk-skip,.btn{-webkit-tap-highlight-color:transparent}
body{font-family:"Manrope",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:var(--ink);background:var(--cream);
  line-height:1.55;-webkit-font-smoothing:antialiased}
a{color:var(--green-d);text-underline-offset:3px}
img{max-width:100%}
:focus-visible{outline:3px solid var(--focus);outline-offset:3px;border-radius:6px}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-999px;top:8px;background:#fff;padding:10px 14px;border-radius:8px;z-index:99}
.skip:focus{left:8px}
.wrap{max-width:1080px;margin:0 auto;padding:0 16px}
.narrow{max-width:620px;margin:0 auto;padding:0 16px}

/* header */
.top{background:#fff;border-bottom:1px solid #EEE;position:sticky;top:0;z-index:20}
.top .wrap{display:flex;align-items:center;justify-content:space-between;min-height:62px;gap:10px}
.logo{display:flex;align-items:center;gap:8px;font-weight:700;font-size:1.15rem;color:var(--ink);text-decoration:none}
.logo-mark{width:28px;height:28px;border-radius:50%;background:var(--green);position:relative;flex:none}
.logo-mark:after{content:"";position:absolute;inset:7px 9px 7px 7px;border-radius:0 60% 0 60%;background:var(--cream)}
.top nav{display:flex;align-items:center;gap:14px}
.top nav a{text-decoration:none;color:var(--ink);font-weight:700;font-size:.95rem}
.top nav .hide-sm{display:none}
@media(min-width:760px){.top nav .hide-sm{display:inline}}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:14px;
  background:var(--accent);color:#fff;font-weight:700;font-size:1.05rem;font-family:inherit;padding:16px 28px;cursor:pointer;
  text-decoration:none;min-height:56px;line-height:1.2;text-align:center}
.btn:hover{background:var(--accent-d)}
.btn{transition:background .15s,transform .1s}
.btn:active{transform:scale(.97)}
.btn.block{width:100%}
.btn.ghost{background:#fff;color:var(--ink);border:1.5px solid var(--line)}
.btn.ghost:hover{background:var(--sand)}
.btn.green{background:var(--green)} .btn.green:hover{background:var(--green-d)}
.btn[disabled]{opacity:.5;cursor:not-allowed}

/* typography */
h1,h2,h3{font-family:var(--head);font-weight:600}
h1,h2{font-weight:700}
h1{font-size:clamp(1.8rem,5.5vw,2.8rem);line-height:1.15;letter-spacing:-.015em;margin:14px 0}
h2{font-size:clamp(1.4rem,4vw,1.9rem);line-height:1.25;margin:0 0 12px}
h3{font-size:1.1rem;margin:0 0 6px}
.lead{font-size:1.1rem;color:var(--muted);max-width:36em;margin:0 0 22px}
.eyebrow{display:block;color:var(--green-d);font-weight:700;font-size:.82rem;text-transform:uppercase;letter-spacing:.06em}
.muted{color:var(--muted)}
.small{font-size:.88rem}

/* hero / landing */
.hero{padding:34px 0 18px}
.hero .wrap{display:grid;gap:28px;align-items:center}
@media(min-width:880px){.hero .wrap{grid-template-columns:1.1fr .9fr}}
.hero-note{font-size:.9rem;color:var(--muted);margin-top:12px}
@media(max-width:879px){.hero .btn{display:flex;width:max-content;max-width:100%;margin:0 auto}}
/* home: every second band is lightly tinted so the white cards stand out */
.homepage section:nth-of-type(even){background:#F2F5F3}
.homepage section:nth-of-type(even)+section{padding-top:40px}
.hero-side{position:relative}
.home-photo{display:block;width:100%;height:auto;aspect-ratio:25/16;object-fit:cover;border-radius:20px}
.hero-side .paper{position:relative;margin:-56px 14px 0}
@media(max-width:879px){.hero{text-align:center}.hero .paper{text-align:left}.hero .ticks{text-align:left;display:inline-block;max-width:36em}.hero .lead{margin-left:auto;margin-right:auto}}
.paper{background:var(--white);border-radius:20px;border:1px solid var(--edge);padding:22px;box-shadow:0 6px 24px rgba(30,42,36,.10)}
.meal-row{display:flex;justify-content:space-between;gap:10px;padding:9px 0;border-bottom:1px solid #EEF0EE;font-size:.95rem}
.meal-row span:first-child{color:var(--muted);width:92px;flex:none}
.meal-row span:nth-child(2){flex:1;font-weight:700}
.meal-row span:last-child{color:var(--muted);white-space:nowrap}
section{padding:34px 0}
.cards{display:grid;gap:14px}
@media(min-width:760px){.cards{grid-template-columns:repeat(3,1fr)}}
.card{background:var(--white);border-radius:var(--r);padding:22px;border:1px solid var(--edge)}
.card p{margin:0;color:var(--muted)}
.steps{display:grid;gap:12px;padding:0;margin:0;counter-reset:s}
@media(min-width:760px){.steps{grid-template-columns:repeat(4,1fr)}}
.steps li{list-style:none;background:var(--white);border-radius:var(--r);border:1px solid var(--edge);padding:18px;counter-increment:s}
.steps li:before{content:counter(s);display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--green);color:#fff;font-weight:700;margin-bottom:10px}
.band{background:var(--green);color:#fff;border-radius:20px;padding:32px 22px;text-align:center}
.band p{color:#E3EFE8}
details{background:var(--white);border-radius:14px;border:1px solid var(--edge);box-shadow:var(--shadow);padding:16px 18px;margin-bottom:10px}
summary{font-weight:700;cursor:pointer;min-height:32px}
details p{color:var(--muted);margin:10px 0 0}
footer{border-top:1px solid var(--line);margin-top:40px;padding:28px 0 40px;font-size:.72rem;color:#9FA8A2}
footer .links a{margin:0 14px 0 0;color:#9FA8A2;text-decoration:none;display:inline-block;padding:4px 0}
footer p{margin:0 0 .25em}

/* soft cards everywhere (same look as the quiz) */
.card,.steps li,.panel,.stat,.day,.recipe,.info-card{box-shadow:var(--shadow)}
.miles li{border-radius:12px}
.chips li{background:var(--green-l);color:var(--green-d)}

/* quiz */
.quiz{padding-top:14px;padding-bottom:40px}
.qbar{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:48px}
.back{background:none;border:0;font-weight:700;font-size:1rem;font-family:inherit;color:var(--ink);cursor:pointer;padding:10px 4px;min-height:48px}
.qcount{color:var(--muted);font-weight:700;font-size:.92rem}
.progress{height:10px;background:var(--sand);border-radius:99px;overflow:hidden;margin:4px 0 22px}
.progress i{display:block;height:100%;width:0;background:var(--green);transition:width .3s}
.section-name{font-size:.85rem;font-weight:700;color:var(--green-d);text-transform:uppercase;letter-spacing:.06em}
fieldset{border:0;margin:0;padding:0;min-width:0}
legend{padding:0;width:100%}
.q h1{font-size:clamp(1.45rem,5vw,1.9rem);margin:6px 0 6px;outline:none}
.q .sub{color:var(--muted);margin:0 0 18px}
.q legend,.panel>legend{float:left;width:100%;margin-bottom:14px}
.q legend+*,.panel>legend+*{clear:both}
.q .opts{clear:both;padding-top:6px}
.opts{display:grid;gap:10px}
.opt{display:flex;align-items:center;gap:14px;width:100%;background:var(--white);border:2px solid var(--line);
  border-radius:10px;padding:14px 16px;cursor:pointer;min-height:62px;font-weight:600;position:relative}
/* hover only with a mouse: a phone keeps :hover after a tap, and the next step's option under the finger looked chosen */
@media (hover:hover){.opt:hover{border-color:var(--green)}}
.opt input{width:24px;height:24px;flex:none;accent-color:var(--green);margin:0;position:static}
.opt:has(input:checked){border-color:var(--green);background:var(--green-l)}
.opt:has(input:focus-visible){outline:3px solid var(--focus);outline-offset:2px}
.opt .txt small{display:block;font-weight:500;color:var(--muted);font-size:.88rem}
.field{display:block;margin-bottom:16px}
.field>span,.field>label{display:block;font-weight:700;margin-bottom:6px}
.input,select.input{width:100%;font-weight:600;font-size:1.1rem;font-family:inherit;padding:14px;border:1.5px solid var(--line);
  border-radius:12px;background:#fff;color:var(--ink);min-height:56px}
.input:focus{border-color:var(--green)}
.stepper{display:flex;align-items:center;gap:6px;max-width:380px;padding:6px;background:#fff;border:1.5px solid var(--line);border-radius:16px}
.stepper:focus-within{border-color:var(--green)}
.stepper .input:focus-visible{outline:none}
.stepper:has(.input:focus-visible){outline:3px solid var(--focus);outline-offset:2px}
.stepper button{flex:none;width:52px;height:52px;border:0;background:var(--green-l);border-radius:10px;font-weight:700;font-size:1.6rem;
  line-height:1;font-family:inherit;cursor:pointer;color:var(--green-d)}
.stepper button:hover{background:#D6E6DC}
.stepper button:active{transform:scale(.96)}
.stepper .unitwrap{position:relative;flex:1;min-width:0}
.stepper .unitwrap .input{border:0;min-height:52px;padding:6px 44px;text-align:center;font-size:1.6rem;font-weight:700;
  background:transparent;font-variant-numeric:tabular-nums}
.stepper .unitwrap .input::placeholder{color:#A7AFA9;font-weight:600}
/* a small "напр." next to the big example number in the placeholder, shown only while the box is empty */
.stepper .unitwrap .ph-hint{display:none;position:absolute;right:calc(50% + 1.5rem);top:50%;transform:translateY(-50%);
  font-size:.8rem;font-weight:600;color:#A7AFA9;pointer-events:none}
.stepper .unitwrap .input:placeholder-shown~.ph-hint{display:block}
.stepper .unitwrap em{position:absolute;right:8px;top:50%;transform:translateY(-50%);font-style:normal;color:var(--muted);font-weight:700;pointer-events:none}
.hint{background:#fff;border-radius:12px;box-shadow:var(--shadow);padding:14px 22px;margin:12px 0;border-left:5px solid var(--green)}
.hint.warn{border-left-color:#B7791F}
.hint.high{border-left-color:#B3261E}
.hint b{display:block}
.bmi-row{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;margin:10px 0 6px}
.bmi-chip{font-size:.85rem;font-weight:700;padding:6px 18px;border-radius:99px;line-height:1.35;color:#1E2A24}
.bmi-chip.ok{background:#CFE8D5}.bmi-chip.mid{background:#F6DF9B}.bmi-chip.high{background:#F2B8AE}
.check{display:flex;gap:12px;align-items:flex-start;margin:12px 0;cursor:pointer}
.check input{width:24px;height:24px;flex:none;margin-top:2px;accent-color:var(--green)}
.err{background:#FDECEA;color:var(--err);border-radius:12px;padding:12px 14px;margin:12px 0;font-weight:700}
.err:empty{display:none}
.nav-cta{position:sticky;bottom:0;padding:14px 0 calc(14px + env(safe-area-inset-bottom));background:linear-gradient(transparent,var(--cream) 25%);margin-top:10px}
.nav-cta.flow{position:static;background:none}  /* consent step: a sticky bar over the checkboxes takes their taps on iOS */
.seg{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.seg label{display:flex;align-items:center;justify-content:center;gap:6px;border:1.5px solid var(--line);border-radius:10px;
  padding:10px 4px;min-height:48px;cursor:pointer;font-weight:700;font-size:.92rem;text-align:center}
.seg input{position:absolute;opacity:0;width:1px;height:1px}
.seg label:has(input:checked){background:var(--green);border-color:var(--green);color:#fff}
.seg label:has(input:focus-visible){outline:3px solid var(--focus);outline-offset:2px}
.info-card{background:#fff;border-radius:var(--r);padding:20px;border:1px solid var(--edge)}
.big-num{font-size:2.2rem;font-weight:700;letter-spacing:-.02em;color:var(--green-d)}
.loading{text-align:center;padding:60px 0}
.spinner{width:48px;height:48px;border:5px solid var(--sand);border-top-color:var(--green);border-radius:50%;animation:spin 1s linear infinite;margin:0 auto 18px}
@keyframes spin{to{transform:rotate(360deg)}}
/* quiz page look (body.quizpage): white, centered, soft cards with photos; other pages keep the cream style */
body.quizpage{background:#fff}
.quizpage .top{background:#fff;border-bottom-color:#EEE}
.quizpage .narrow{max-width:540px}
.quizpage .progress{height:6px;background:#EEF0EE;margin:2px 0 20px}
.quizpage .progress i{border-radius:99px}
.quizpage .q{animation:qin .32s cubic-bezier(.2,.7,.3,1)}
@keyframes qin{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
/* the answered question fades out before the next one comes in (quiz.html wire()) */
.quizpage .q.q-out{opacity:0;transform:translateY(-6px);transition:opacity .18s ease-in,transform .18s ease-in}
.quizpage .q legend,.quizpage .q h1,.quizpage .q .sub{text-align:center}
.quizpage .q h1{font-weight:700;font-size:clamp(1.5rem,5.4vw,2rem);line-height:1.2;letter-spacing:-.01em}
.quizpage .section-name{display:table;margin:0 auto 4px;background:var(--green-l);border-radius:99px;padding:3px 12px;font-size:.75rem}
.quizpage .opts{gap:12px}
.quizpage .opt{border:1.5px solid #E4E7E4;border-radius:14px;padding:14px 52px 14px 18px;background:#fff;
  box-shadow:0 1px 2px rgba(30,42,36,.05),0 2px 8px rgba(30,42,36,.04);
  transition:border-color .2s,background-color .2s,box-shadow .2s,transform .15s;will-change:transform}
@media (hover:hover){.quizpage .opt:hover{border-color:var(--green);box-shadow:0 4px 14px rgba(30,42,36,.08)}}
.quizpage .opt:active{transform:scale(.99)}
/* chosen with a tap: sinks a little and comes back up as the ✓ pops. The animations move only transform, which the
   phone's graphics chip handles without redrawing; the green fill comes from the transition above */
.quizpage .opt.press{animation:optpress .38s cubic-bezier(.3,.7,.4,1)}
.quizpage .opt.press::after{animation:tickpop .38s cubic-bezier(.3,.7,.4,1)}
@keyframes optpress{0%{transform:scale(1)}35%{transform:scale(.96)}100%{transform:scale(1)}}
@keyframes tickpop{0%{transform:scale(1)}30%{transform:scale(.8)}70%{transform:scale(1.15)}100%{transform:scale(1)}}
.quizpage .opt input{position:absolute;opacity:0;width:1px;height:1px;margin:0}
.quizpage .opt::after{content:"";position:absolute;right:16px;top:50%;width:24px;height:24px;margin-top:-12px;border-radius:50%;
  border:2px solid #C9CFCA;background:#fff center/14px no-repeat;box-sizing:border-box;will-change:transform}
.quizpage .opt:has(input[type=checkbox])::after{border-radius:7px}
.quizpage .opt:has(input:checked){border-color:var(--green);background:var(--green-l);box-shadow:0 0 0 1px var(--green) inset}
.quizpage .opt:has(input:checked)::after{border-color:var(--green);background-color:var(--green);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3 8.5l3 3 7-7' fill='none' stroke='%23fff' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
.quizpage .opt.has-img{padding-left:10px;gap:14px}
.quizpage .opt.has-img img{width:64px;height:64px;border-radius:10px;object-fit:cover;flex:none}
.quizpage .info-card{border:0;border-radius:16px;box-shadow:0 2px 12px rgba(30,42,36,.08);overflow:hidden}
.quizpage .nav-cta{background:linear-gradient(rgba(255,255,255,0),#fff 25%)}
.quizpage .card-img{display:block;width:calc(100% + 40px);max-width:none;height:auto;aspect-ratio:5/2;object-fit:cover;margin:-20px -20px 16px}
/* „Колко обичате тези ястия?“: one dish photo at a time, the next cards peek out behind it */
.lk{max-width:440px;margin:0 auto}
.lk-count{text-align:center;color:var(--muted);font-weight:700;font-size:.85rem;margin:0 0 10px}
.lk-stack{position:relative;isolation:isolate;width:84%;margin:0 auto 22px}
.lk-stack.more::before,.lk-stack.more::after{content:"";position:absolute;left:6%;right:6%;bottom:-8px;height:40px;border-radius:18px;
  background:#E9EDEA;z-index:0}
.lk-stack.more::after{left:12%;right:12%;bottom:-15px;background:#F2F4F2;z-index:-1}
.lk-card{position:relative;z-index:1;background:#fff;border-radius:18px;overflow:hidden;box-shadow:0 6px 22px rgba(30,42,36,.13);
  animation:lkin .22s ease-out;transition:transform .28s ease-in,opacity .28s ease-in}
/* photo + name + buttons fit a phone screen without scrolling */
.lk-card img{display:block;width:100%;height:auto;aspect-ratio:4/3;max-height:max(190px,calc(100svh - 450px));object-fit:cover}
.lk-name{position:absolute;left:0;right:0;bottom:0;margin:0;padding:40px 16px 14px;text-align:center;font-size:1.2rem;line-height:1.25;
  color:#fff;background:linear-gradient(transparent,rgba(0,0,0,.72));text-shadow:0 1px 3px rgba(0,0,0,.4);outline:none}
.quizpage .q:has(.lk) .section-name{display:none}
.lk-sub{text-align:center;margin:14px 0 0}
@keyframes lkin{from{opacity:0;transform:scale(.94)}to{opacity:1;transform:none}}
.lk-card.out-love{transform:translateX(115%) rotate(10deg);opacity:0}
.lk-card.out-dislike{transform:translateX(-115%) rotate(-10deg);opacity:0}
.lk-card.out-neutral{transform:translateY(40px) scale(.9);opacity:0}
.lk-btns{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.lk-btn{display:flex;flex-direction:column;align-items:center;gap:4px;min-height:72px;padding:10px 4px;border:1.5px solid #E4E7E4;border-radius:14px;
  background:#fff;font:inherit;font-weight:700;font-size:.92rem;color:var(--ink);cursor:pointer;box-shadow:0 1px 2px rgba(30,42,36,.05);
  transition:border-color .15s,background .15s,transform .1s}
.lk-btn span{font-size:1.5rem;line-height:1}
@media (hover:hover){.lk-btn:hover{border-color:var(--green)}}
.lk-btn:active{transform:scale(.96)}
.lk-btn.press{animation:lkpress .3s ease-out}
.lk-btn.press span{animation:tickpop .3s ease-out}
@keyframes lkpress{0%{transform:scale(1)}40%{transform:scale(.92)}100%{transform:scale(1)}}
.lk-btn[aria-pressed=true]{border-color:var(--green);background:var(--green-l);box-shadow:0 0 0 1px var(--green) inset}
.lk-love[aria-pressed=true]{border-color:#C2410C;background:#FFF1E8;box-shadow:0 0 0 1px #C2410C inset}
.lk-skip{display:block;margin:4px auto 0;background:none;border:0;padding:10px;min-height:44px;font:inherit;font-size:.9rem;
  color:var(--muted);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.quizpage .seg label{border-width:1.5px;border-radius:10px}
.quizpage .stepper{border-radius:16px;border-width:1.5px;margin:0 auto}
.quizpage .field>label{text-align:center}
/* first screen */
.hero-q h1{margin-top:4px}
.hero-img{display:block;width:100%;height:auto;aspect-ratio:25/16;object-fit:cover;border-radius:20px;margin:4px 0 18px}
.sex-cards{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.quizpage .opt.sex-card{flex-direction:column;justify-content:center;gap:10px;padding:16px 10px 14px;text-align:center;font-size:1.05rem;font-weight:700}
.quizpage .opt.sex-card::after{top:12px;right:12px;margin-top:0}
.sex-card img{width:96px;height:96px;border-radius:50%;object-fit:cover}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}
  .spinner{animation:spin 2s linear infinite!important}}  /* still show that work is in progress, just slower */

/* result */
.stats{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:18px 0}
.stat{background:var(--white);border-radius:var(--r);border:1px solid var(--edge);padding:14px}
.stat small{display:block;color:var(--muted);font-size:.85rem;font-weight:700}
.stat b{font-size:1.4rem}
.bmi-scale{display:flex;height:14px;border-radius:99px;overflow:hidden;margin:10px 0 4px}
.bmi-scale i{flex:1}
.bmi-labels{display:flex;justify-content:space-between;font-size:.78rem;color:var(--muted)}
.panel{background:var(--white);border-radius:var(--r);padding:18px;border:1px solid var(--edge);margin:14px 0}
.panel h2,.panel h3{margin-bottom:10px}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0 0;padding:0;list-style:none}
.chips li{background:var(--sand);border-radius:999px;padding:6px 12px;font-weight:700;font-size:.88rem}
ul.ticks{padding:0;margin:12px 0 0;list-style:none}
ul.ticks li{padding:5px 0 5px 30px;position:relative}
ul.ticks li:before{content:"✓";position:absolute;left:4px;color:var(--green);font-weight:700}
.plans{display:grid;gap:12px}
.plan-opt{position:relative;display:block;background:#fff;border:1.5px solid #E4E7E4;border-radius:var(--r);padding:18px;cursor:pointer;
  box-shadow:var(--shadow);transition:border-color .15s,box-shadow .15s}
.plan-opt:hover{border-color:var(--green)}
.plan-opt:has(input:checked){border-color:var(--green);background:var(--green-l);box-shadow:0 0 0 2px var(--green) inset}
.plan-opt input{position:absolute;opacity:0}
.plan-opt:has(input:focus-visible){outline:3px solid var(--focus);outline-offset:2px}
.plan-opt .top-line{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.plan-opt .pname{font-family:var(--head);font-weight:600;font-size:1.2rem}
.plan-opt .perday{color:var(--muted);font-weight:700;font-size:.9rem}
.badge{display:inline-block;background:var(--accent);color:#fff;font-size:.75rem;font-weight:700;padding:4px 10px;border-radius:6px;margin-bottom:6px}
.plan-opt.soon{opacity:.6;cursor:not-allowed;background:#F4F6F4}
.badge.soon{background:var(--muted)}
.chart{width:100%;height:auto;display:block}
.miles{display:flex;gap:8px;list-style:none;margin:12px 0 8px;padding:0}
.miles li{flex:1;min-width:0;background:var(--green-l);border-radius:var(--r);padding:8px;font-size:.85rem;text-align:center}
.miles b{display:block;font-size:1.1rem}

/* checkout */
.co{display:grid;gap:18px;padding:18px 0 40px}
@media(min-width:900px){.co{grid-template-columns:1.3fr .7fr;align-items:start}.summary{position:sticky;top:80px}}
.row2{display:grid;grid-template-columns:1fr;gap:0 12px}
@media(min-width:520px){.row2{grid-template-columns:1fr 1fr}}
.choice{display:flex;align-items:center;gap:12px;border:1.5px solid #E4E7E4;border-radius:14px;padding:14px;margin-bottom:10px;cursor:pointer;background:#fff;
  box-shadow:0 1px 2px rgba(30,42,36,.05);transition:border-color .15s}
.choice:hover{border-color:var(--green)}
.choice input{accent-color:var(--green);width:24px;height:24px;flex:none;margin:0}
.choice .c-main{flex:1}
.choice .c-main b{display:block}
.badge.inline{margin:0 0 0 6px;padding:2px 8px;vertical-align:1px}
/* single-column checkout (one payment method → no side summary) */
.co1{padding:14px 0 40px}
.co1 .back-link{display:inline-block;font-weight:700}
.co1 h1{font-size:1.8rem;margin:12px 0 4px}
.co1 .sub{margin:0 0 18px}
.co1 .panel h2{font-size:1.15rem;margin:0 0 10px}
.plan-line{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:14px 16px;margin:0 0 18px}
.pay-box .btn{font-size:1.15rem;min-height:58px;margin-top:6px}
.pay-box .secure{text-align:center;color:var(--muted);margin:10px 0 0}
.choice .c-main small{color:var(--muted)}
.choice .c-price{font-weight:700;white-space:nowrap}
.choice:has(input:checked){border-color:var(--green);background:var(--green-l);box-shadow:0 0 0 1px var(--green) inset}
.picker{margin:4px 0 12px;display:none}
.picker.on{display:block}
.point-list{max-height:300px;overflow:auto;border:1.5px solid var(--line);border-radius:12px;margin-top:8px;background:#fff}
.point{display:block;width:100%;text-align:left;padding:12px 14px;border:0;border-bottom:1px solid #EEF0EE;background:#fff;font:inherit;cursor:pointer;min-height:56px}
.point:hover{background:#F4F6F4}
.point[aria-pressed=true]{background:var(--green-l)}
.point b{display:block}.point small{color:var(--muted)}
.chosen{color:var(--ok);font-weight:700;margin-top:8px}
.chosen:not(:empty){background:var(--green-l);padding:10px 12px;border-radius:8px;margin:0 0 12px}
.sum-line{display:flex;justify-content:space-between;align-items:baseline;gap:10px;padding:7px 0}
.sum-line>span:first-child{flex:0 0 auto;max-width:45%;white-space:pre-line}
.sum-line>span:last-child{flex:1 1 0;min-width:0;margin-left:auto;white-space:normal;overflow-wrap:anywhere;text-align:right;font-variant-numeric:tabular-nums}
.sum-line.total{border-top:1px solid var(--line);margin-top:6px;padding-top:12px;font-weight:700;font-size:1.2rem}
.trust{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-top:12px;font-size:.82rem;color:var(--muted)}
.demo-flag{background:#FFF7E0;border:1px dashed #B7791F;color:#6B4E12;border-radius:10px;padding:10px 12px;font-size:.88rem;margin:10px 0}
.note{background:var(--green-l);border-radius:12px;padding:12px 14px;margin:10px 0}
.promo-box{background:#FDF1EA;border:1px solid #F1C9B2;border-left:4px solid var(--accent);border-radius:12px;padding:12px 14px;margin:14px 0 0}
.promo-title{display:block;color:var(--accent-d);font-weight:800;font-size:1.02rem;margin-bottom:4px}
.promo-left{display:inline-block;background:var(--accent);color:#fff;font-weight:700;border-radius:999px;padding:1px 9px;margin:4px 4px 0 0}
.hidden{display:none!important}

/* plan view */
.day{background:var(--white);border-radius:var(--r);border:1px solid var(--edge);padding:16px;margin-bottom:12px}
.day h2{display:flex;justify-content:space-between;font-size:1.25rem}
.day h2 small{color:var(--muted);font-weight:700;font-size:.9rem}
.dm{padding:12px 0;border-top:1px solid #EEF0EE}
.dm .lbl{font-size:.8rem;font-weight:700;color:var(--green-d);text-transform:uppercase;letter-spacing:.05em}
.dm .ing{font-size:.92rem;color:var(--muted)}
.dm .swap{font-size:.9rem;margin-top:6px}
.tabs{display:flex;gap:8px;overflow:auto;padding:4px 2px 12px}
.tabs button{flex:none;border:1.5px solid var(--line);background:#fff;border-radius:99px;padding:10px 16px;font-weight:700;font-size:.95rem;font-family:inherit;color:var(--ink);cursor:pointer;min-height:48px}
.tabs button[aria-selected=true]{background:var(--green);color:#fff;border-color:var(--green)}
.day-meal{padding:0;margin-bottom:8px}
.day-meal summary{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 10px;padding:12px 14px;cursor:pointer}
.day-meal .dm-label{width:100%;color:var(--muted);font-size:.85rem}
.day-meal .dm-name{flex:1;font-weight:700}
.day-meal .dm-kcal{color:var(--muted);font-size:.9rem;white-space:nowrap}
.day-meal summary{display:grid;grid-template-columns:1fr auto;gap:6px 10px;align-items:center}
.day-meal .dm-label{width:auto}
.day-meal .dm-name{grid-column:1/-1}
.day-meal .dm-kcal{grid-column:1/-1}
.day-meal .dm-open{grid-row:1;grid-column:2;font-size:.8rem;font-weight:700;color:var(--green,#2E7D5B);border:1px solid currentColor;border-radius:999px;padding:2px 10px;white-space:nowrap}
.day-meal .dm-open::after{content:"Виж рецептата ▾"}
.day-meal[open] .dm-open::after{content:"Затвори ▴"}
.day-meal>:not(summary){margin-left:14px;margin-right:14px}
.day-meal h3{font-size:.95rem;margin-top:14px;margin-bottom:6px}
.day-meal ol{padding-left:22px}
.day-meal li{margin-bottom:6px}
.day-meal>:last-child{margin-bottom:14px}
.day-meal p.note{color:var(--ink)}
.dm-ing{list-style:none;padding:0}
.dm-ing li{display:flex;justify-content:space-between;gap:12px;margin:0;padding:4px 0;border-bottom:1px solid #EEF0EE}
.recipe{background:#fff;border-radius:var(--r);border:1px solid var(--edge);padding:16px;margin-bottom:12px}
.recipe ol{padding-left:22px}

/* admin */
table.adm{width:100%;border-collapse:collapse;background:#fff;border-radius:12px;overflow:hidden;font-size:.9rem}
table.adm th,table.adm td{padding:10px;border-bottom:1px solid #eee;text-align:left;vertical-align:top}
table.adm th{background:var(--sand);font-size:.78rem;text-transform:uppercase;letter-spacing:.04em}
.pill{display:inline-block;padding:3px 9px;border-radius:99px;font-size:.78rem;font-weight:700;background:var(--sand)}
.pill.new{background:#FFF1E6;color:#9A3412}.pill.shipped{background:#E8F0FF;color:#1D4ED8}.pill.delivered,.pill.digital_sent{background:#E8F7EE;color:#11804A}
.adm-wrap{overflow-x:auto}
.legal h3{margin-top:22px}
/* iOS Safari hardening for checkout lists */
.choice{position:relative;min-height:64px}
.picker.on{margin:4px 0 18px}
.point-list{position:relative;z-index:0;-webkit-overflow-scrolling:touch}
.point{position:relative;display:block}
fieldset.panel{min-inline-size:0}
.meal-row.shop span:first-child{width:auto;flex:1;color:var(--ink);font-weight:600}
.meal-row.shop span:nth-child(2){display:none}
#pazaruvane .cards>div:first-child{grid-column:auto}
@media(min-width:760px){#pazaruvane .cards{grid-template-columns:1.6fr 1fr}#pazaruvane .cards>div:first-child{grid-column:auto}}

/* cookie banner (static/track.js) */
#bf-consent{position:fixed;z-index:50;font-size:.9rem}
#bf-consent.bar{left:0;right:0;bottom:0;background:#fff;border-top:1px solid #EEE;box-shadow:0 -4px 20px rgba(30,42,36,.08);padding:14px 16px calc(14px + env(safe-area-inset-bottom))}
#bf-consent.bar .bf-box{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:center}
#bf-consent.lock::before{content:"";position:fixed;inset:0;z-index:-1;background:rgba(30,42,36,.55)}
/* the dimming layer paints over the bar's own background, so repaint the bar above it (still under the text) */
#bf-consent.lock::after{content:"";position:absolute;inset:-2px 0 0;z-index:-1;background:#fff;border-top:2px solid var(--line)}
#bf-consent p{margin:0;max-width:640px}
#bf-consent .bf-btns{display:flex;gap:8px}
#bf-consent .btn{min-height:44px;padding:0 20px}
footer .links .linklike{background:none;border:0;padding:4px 0;font:inherit;color:#9FA8A2;cursor:pointer;text-decoration:none}

.req{color:#C0392B;text-decoration:none;font-weight:700;border:0}

.pick-mode{display:flex;gap:8px;margin:0 0 12px}
.pick-mode .btn{flex:1;padding:10px 8px;font-size:.95rem}
.pick-mode .btn[aria-pressed=true]{background:var(--ink);color:#fff;border-color:var(--ink)}