:root{
  --bg:#eee7dd;
  --bg2:#f7f1e8;
  --paper:#eee7dd;
  --paper2:#e5ded4;
  --paper3:#fbf5ec;
  --ink:#4a3f37;
  --muted:#8d8176;
  --line:rgba(255,255,255,.58);
  --gold:#c9a45f;
  --gold2:#ead29a;
  --gold-ring:rgba(201,164,95,.44);
  --gold-ring-soft:rgba(234,210,154,.26);
  --green:#7da08a;
  --accent:#c99178;
  --icon:#6f6158;
  --icon-soft:#a79282;
  --shadow:16px 16px 34px rgba(153,133,114,.34), -16px -16px 34px rgba(255,255,255,.82);
  --softShadow:9px 9px 20px rgba(153,133,114,.24), -9px -9px 20px rgba(255,255,255,.78);
  --pressed:inset 7px 7px 16px rgba(153,133,114,.28), inset -7px -7px 16px rgba(255,255,255,.86);
  --inner:inset 1px 1px 0 rgba(255,255,255,.88), inset -1px -1px 0 rgba(143,120,105,.12);
  --max:1180px;
  --backdrop:rgba(238,231,221,.76);
}
body.dark{
  --bg:#211c18;
  --bg2:#16130f;
  --paper:#211c18;
  --paper2:#191511;
  --paper3:#2a241e;
  --ink:#f1e7db;
  --muted:#b8a99d;
  --line:rgba(255,255,255,.08);
  --gold:#d7b66d;
  --gold2:#f0d79a;
  --gold-ring:rgba(215,182,109,.52);
  --gold-ring-soft:rgba(240,215,154,.18);
  --green:#91b49a;
  --accent:#c28d72;
  --icon:#eadfd2;
  --icon-soft:#c6ad98;
  --shadow:14px 14px 30px rgba(5,4,3,.46), -12px -12px 26px rgba(65,55,48,.20);
  --softShadow:8px 8px 18px rgba(5,4,3,.40), -8px -8px 18px rgba(65,55,48,.14);
  --pressed:inset 7px 7px 16px rgba(5,4,3,.46), inset -7px -7px 16px rgba(65,55,48,.16);
  --inner:inset 1px 1px 0 rgba(255,255,255,.045), inset -1px -1px 0 rgba(0,0,0,.22);
  --backdrop:rgba(33,28,24,.76);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;overflow-x:hidden}
body{margin:0;min-height:100vh;color:var(--ink);font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:radial-gradient(circle at 16% 8%,rgba(234,210,154,.34),transparent 24%),radial-gradient(circle at 82% 10%,rgba(125,160,138,.22),transparent 24%),linear-gradient(135deg,var(--bg),var(--bg2) 52%,#e4d9cc);background-attachment:fixed;overflow-x:hidden;touch-action:pan-y;display:flex;justify-content:center}
body.dark{background:radial-gradient(circle at 16% 8%,rgba(215,182,109,.12),transparent 24%),radial-gradient(circle at 84% 12%,rgba(145,180,154,.10),transparent 25%),linear-gradient(135deg,var(--bg),var(--bg2) 52%,#0f0d0b);background-attachment:fixed}
body.modal-open{overflow:hidden}
body:before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.24;background-image:linear-gradient(rgba(255,255,255,.7) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.55) 1px,transparent 1px);background-size:92px 92px;mask-image:linear-gradient(to bottom,rgba(0,0,0,.34),transparent 68%)}
button,input,select,textarea{font:inherit}button{cursor:pointer;border:0}textarea,input{outline:none}
.topbar{position:sticky;top:0;z-index:30;backdrop-filter:blur(18px);background:var(--backdrop);border-bottom:1px solid var(--line)}
.topbar-inner{max-width:var(--max);margin:auto;padding:14px 18px;display:grid;grid-template-columns:64px 1fr auto;align-items:center;gap:16px;position:relative}
.brand{display:grid;place-items:center;width:56px;height:56px;padding:0;background:transparent;color:var(--ink);min-width:56px;justify-self:start;position:relative;z-index:2}
.brand-title{display:none}
.brand-mark{width:54px;height:54px;border-radius:19px;display:grid;place-items:center;color:var(--icon);background:linear-gradient(145deg,rgba(255,255,255,.42),rgba(228,220,209,.82));box-shadow:inset 9px 9px 18px rgba(255,255,255,.72),inset -10px -10px 18px rgba(163,142,122,.22),0 1px 0 rgba(255,255,255,.6);border:1px solid rgba(255,255,255,.42);flex:0 0 auto;position:relative;overflow:hidden}
body.dark .brand-mark{background:linear-gradient(145deg,rgba(54,47,41,.94),rgba(31,27,23,.94));box-shadow:inset 9px 9px 18px rgba(75,66,58,.20),inset -10px -10px 18px rgba(8,7,6,.58),0 1px 0 rgba(255,255,255,.05);border-color:rgba(255,255,255,.06)}
.brand-mark:before,.theme-btn:before,.tab-icon:before,.cat-icon:before,.dish-icon:before,.cemoji:before,.arrow:before,.leaf:before,.close:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 28% 25%,rgba(255,255,255,.32),transparent 26%),linear-gradient(145deg,rgba(255,255,255,.14),transparent 62%);pointer-events:none}
.brand-mark .line-icon{width:24px;height:24px;stroke-width:1.65;filter:drop-shadow(0 1px 0 rgba(255,255,255,.4))}

.brand-app-icon{width:100%;height:100%;display:block;object-fit:cover;border-radius:inherit;position:relative;z-index:1;transform:scale(1.035);filter:drop-shadow(0 1px 1px rgba(255,255,255,.28)) drop-shadow(0 5px 10px rgba(139,108,63,.12))}
body.dark .brand-app-icon{filter:drop-shadow(0 5px 10px rgba(0,0,0,.24)) saturate(.92) brightness(.96)}
.brand-mark:has(.brand-app-icon){padding:0;background:linear-gradient(145deg,rgba(255,255,255,.45),rgba(228,220,209,.74));box-shadow:inset 8px 8px 16px rgba(255,255,255,.68),inset -8px -8px 16px rgba(163,142,122,.22),0 8px 18px rgba(143,118,91,.10)}
body.dark .brand-mark:has(.brand-app-icon){background:linear-gradient(145deg,rgba(62,56,50,.78),rgba(20,18,16,.92));box-shadow:inset 8px 8px 16px rgba(79,70,61,.18),inset -8px -8px 16px rgba(0,0,0,.52),0 8px 18px rgba(0,0,0,.24)}
.site-title{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);text-align:center;font:400 clamp(28px,3.8vw,40px)/1 Georgia,"Times New Roman",serif;letter-spacing:.08em;color:var(--ink);white-space:nowrap;max-width:min(52vw,520px);padding:0 12px;pointer-events:none;text-shadow:0 1px 0 rgba(255,255,255,.4);z-index:0}
body.dark .site-title{text-shadow:0 1px 0 rgba(0,0,0,.3)}
.theme-btn{width:46px;height:46px;border-radius:18px;background:var(--paper);color:var(--ink);display:grid;place-items:center;font-size:18px;box-shadow:var(--softShadow),var(--inner);transition:transform .14s ease,box-shadow .14s ease;position:relative;overflow:hidden}
.theme-btn:active,.theme-btn.tapped{box-shadow:var(--pressed);transform:scale(.96)}
.shell{width:100%;min-height:100vh;display:flex;flex-direction:column;align-items:center}.topbar{width:100%}.page{width:100%;max-width:var(--max);margin:0 auto;padding:28px 18px 76px;position:relative}
.view{display:none;opacity:0;transform:translateX(14px)}.view.active{display:block;opacity:1;transform:none}.view.anim-in{animation:fadeIn .44s cubic-bezier(.2,.8,.2,1)}.view.page-enter{animation:pageEnter .62s cubic-bezier(.22,.75,.18,1)}.view.page-leave{animation:pageLeave .62s cubic-bezier(.22,.75,.18,1)}
@keyframes fadeIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}@keyframes pageLeave{0%{opacity:1;transform:perspective(1400px) rotateY(0deg) translateX(0);transform-origin:left center;filter:brightness(1)}100%{opacity:0;transform:perspective(1400px) rotateY(-24deg) translateX(-8%);transform-origin:left center;filter:brightness(.92)}}@keyframes pageEnter{0%{opacity:0;transform:perspective(1400px) rotateY(24deg) translateX(8%);transform-origin:left center;filter:brightness(.92)}100%{opacity:1;transform:perspective(1400px) rotateY(0deg) translateX(0);transform-origin:left center;filter:brightness(1)}}
.hero,.country-card,.tab-card,.cat-tile,.recipe-card,.panel,.dialog,.country-head,.custom-head,.stat,.my-item{background:var(--paper);border:1px solid var(--line);box-shadow:var(--shadow),var(--inner)}
.hero{min-height:260px;display:grid;align-items:end;border-radius:34px;padding:36px;position:relative;overflow:hidden}
.hero:before{content:"";position:absolute;inset:24px;border-radius:30px;background:linear-gradient(145deg,rgba(255,255,255,.32),transparent 52%);box-shadow:inset 7px 7px 18px rgba(153,166,180,.12),inset -8px -8px 20px rgba(255,255,255,.68);pointer-events:none}.hero:after{content:"";position:absolute;right:34px;top:34px;width:118px;height:118px;border-radius:40px;background:linear-gradient(145deg,#f2f6f9,#e2eaf1);box-shadow:var(--softShadow),var(--inner);transform:rotate(8deg)}body.dark .hero:after{background:linear-gradient(145deg,#28303a,#1a2026)}
.kicker{color:var(--accent);letter-spacing:.18em;text-transform:uppercase;font-size:11px;font-weight:800;margin-bottom:12px;position:relative;z-index:1}h1,h2,h3,p{margin-top:0}.hero h1{font:400 clamp(38px,7vw,68px)/.92 Georgia,"Times New Roman",serif;letter-spacing:-.05em;max-width:760px;margin:0 0 14px;position:relative;z-index:1}.lead{color:var(--muted);font-size:16px;line-height:1.6;max-width:620px;margin:0;position:relative;z-index:1}.stats{display:flex;flex-wrap:wrap;gap:12px;margin-top:22px;position:relative;z-index:1}.stat{min-width:106px;padding:12px 14px;border-radius:22px}.stat b{display:block;font-size:20px}.stat span{font-size:12px;color:var(--muted)}
.section-title{display:flex;align-items:end;justify-content:center;gap:18px;margin:28px 0 14px;text-align:center}.section-title>div{display:flex;flex-direction:column;align-items:center;justify-content:center}.section-title h2,.cat-line h2{font:400 30px/1.05 Georgia,"Times New Roman",serif;letter-spacing:-.03em;margin:0}.section-title p{margin:0;color:var(--muted);line-height:1.45;font-size:14px;text-align:center}
.country-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.country-card{min-height:214px;padding:22px;border-radius:34px;color:var(--ink);position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:space-between;align-items:center;text-align:center;transition:transform .34s cubic-bezier(.2,.8,.2,1),box-shadow .34s ease}.country-card:active,.recipe-card:active,.cat-tile:active,.tab-card:active{transform:scale(.985);box-shadow:var(--pressed)}.country-card:before{content:"";position:absolute;right:20px;top:18px;width:78px;height:78px;border-radius:28px;background:var(--paper);box-shadow:var(--pressed);opacity:.5}.country-card:after{content:"";position:absolute;right:-42px;bottom:-42px;width:160px;height:160px;border-radius:50px;background:var(--paper);box-shadow:var(--softShadow);opacity:.55}.cemoji{width:72px;height:72px;display:grid;place-items:center;font-size:38px;border-radius:28px;background:var(--paper);box-shadow:var(--softShadow),var(--inner);position:relative;overflow:hidden}.country-card h3{font:400 30px/1.03 Georgia,"Times New Roman",serif;letter-spacing:-.03em;margin:18px 0 8px;position:relative;z-index:1;text-align:center}.country-card p{line-height:1.42;color:var(--muted);margin-bottom:16px;font-size:14px;position:relative;z-index:1;text-align:center}.country-bottom{display:flex;justify-content:center;align-items:center;gap:12px;font-size:13px;font-weight:800;position:relative;z-index:1;width:100%;text-align:center;flex-wrap:wrap}.arrow{width:40px;height:40px;border-radius:18px;display:grid;place-items:center;background:var(--paper);box-shadow:var(--softShadow),var(--inner);position:relative;overflow:hidden}
.tab-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:12px}.tab-card{min-height:118px;padding:16px;border-radius:30px;display:flex;flex-direction:column;justify-content:space-between;text-align:left;color:var(--ink);position:relative;overflow:hidden}.tab-card:after,.cat-tile:before,.recipe-card:after{content:"";position:absolute;border-radius:40px;background:var(--paper);box-shadow:var(--pressed);opacity:.42}.tab-card:after{right:-20px;top:-20px;width:72px;height:72px}.tab-card b{font-size:16px;position:relative;z-index:1}.tab-card span{font-size:12px;color:var(--muted);font-weight:700;position:relative;z-index:1}.tab-icon,.cat-icon,.dish-icon{position:relative;overflow:hidden}.tab-icon{width:48px;height:48px;border-radius:20px;display:grid;place-items:center;color:#fff;font-size:24px;z-index:1;background:linear-gradient(145deg,#f5ca74,#eaa985);box-shadow:var(--softShadow),var(--inner)}
#myRecipesCard{justify-content:flex-start;gap:6px;min-height:104px}#myRecipesCard div:last-child{display:grid;gap:1px}#myRecipesCard b{margin:0}#myRecipesCard span{line-height:1.05}
.country-head,.custom-head{display:grid;grid-template-columns:1fr;gap:18px;justify-items:center;align-items:center;text-align:center;padding:24px;border-radius:34px;color:var(--ink);position:relative;overflow:hidden;margin-bottom:18px}.country-head:before,.custom-head:before{content:"";position:absolute;inset:22px;border-radius:28px;box-shadow:var(--pressed);opacity:.32}.back-btn{background:var(--paper);color:var(--ink);border-radius:999px;padding:10px 14px;display:inline-flex;align-items:center;justify-content:center;gap:8px;font-weight:700;box-shadow:var(--softShadow),var(--inner);position:relative;z-index:1;justify-self:center}.country-head h1,.custom-head h1{font:400 clamp(38px,6vw,62px)/.92 Georgia,"Times New Roman",serif;color:var(--ink);margin:16px 0 10px;letter-spacing:-.05em;position:relative;z-index:1;text-align:center}.country-head p,.custom-head p{margin:0 auto;color:var(--muted);line-height:1.5;max-width:700px;font-size:14px;position:relative;z-index:1;text-align:center}.country-meta{display:flex;gap:14px;flex-wrap:wrap;justify-content:center;align-items:center;width:100%;position:relative;z-index:1}.pill{display:flex;align-items:center;justify-content:center;text-align:center;min-height:86px;min-width:170px;padding:14px 18px;border-radius:30px;background:var(--paper);font-size:clamp(20px,2vw,24px);font-weight:800;line-height:1.15;box-shadow:var(--softShadow),var(--inner)}
.category-choice{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:minmax(108px,auto);gap:12px;margin:0 0 20px}.cat-tile{border-radius:30px;padding:14px;display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;gap:12px;text-decoration:none;color:var(--ink);position:relative;overflow:hidden;transition:transform .28s cubic-bezier(.2,.8,.2,1),box-shadow .28s ease}.cat-tile:before{right:-24px;top:-24px;width:76px;height:76px}.cat-tile.active{box-shadow:var(--pressed);transform:translateY(1px)}.cat-tile.dim{opacity:.50}.cat-tile strong{display:block;font-size:15px;margin-bottom:3px;position:relative;z-index:1}.cat-tile span{font-size:12px;color:var(--muted);font-weight:800;position:relative;z-index:1}.cat-icon{width:52px;height:52px;border-radius:22px;display:grid;place-items:center;color:#fff;font-size:24px;flex:0 0 auto;box-shadow:var(--softShadow),var(--inner);z-index:1}.cat-control{display:flex;justify-content:flex-end;margin:-6px 0 16px}.clear-filter{padding:9px 13px;border-radius:999px;background:var(--paper);color:var(--muted);font-weight:800;box-shadow:var(--softShadow),var(--inner)}
.cat-section{margin:22px 0 30px;scroll-margin-top:90px}.cat-line{display:flex;align-items:center;justify-content:center;gap:12px;margin-bottom:12px;text-align:center}.cat-line:before,.cat-line:after{content:"";height:1px;background:linear-gradient(90deg,transparent,rgba(141,154,168,.22),transparent);flex:1}.recipe-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.recipe-card{padding:16px;min-height:198px;display:flex;flex-direction:column;align-items:center;text-align:center;position:relative;overflow:hidden;color:var(--ink);border-radius:32px;transform:translateZ(0)}.recipe-card:after{width:106px;height:106px;right:-34px;top:-34px}.recipe-top{display:flex;align-items:center;justify-content:center;gap:12px;position:relative;z-index:1;width:100%}.dish-icon{width:70px;height:70px;border-radius:28px;display:grid;place-items:center;font-size:35px;color:#fff;background:linear-gradient(145deg,#f7d58d,#eaa985);box-shadow:var(--softShadow),var(--inner);position:relative;overflow:hidden}.dish-icon span,.cat-icon,.tab-icon,.cemoji{filter:drop-shadow(0 3px 3px rgba(93,102,112,.14))}.dish-icon:after,.cat-icon:after,.tab-icon:after,.cemoji:after{content:"";position:absolute;width:44%;height:22%;left:18%;top:16%;border-radius:999px;background:rgba(255,255,255,.32);filter:blur(2px);transform:rotate(-20deg);pointer-events:none}.leaf{display:inline-grid;place-items:center;width:34px;height:34px;border-radius:18px;background:var(--paper);color:#5fa077;box-shadow:var(--softShadow),var(--inner);position:relative;overflow:hidden}.recipe-card h3{margin:16px 0 10px;font-size:19px;line-height:1.18;position:relative;z-index:1;text-align:center;width:100%}.recipe-meta{margin-top:auto;display:flex;gap:6px;flex-wrap:wrap;justify-content:center;color:var(--muted);font-size:12px;font-weight:700;position:relative;z-index:1;width:100%}.recipe-meta span{padding:7px 10px;border-radius:999px;background:var(--paper);box-shadow:var(--pressed)}
.empty-box{border-radius:28px;padding:26px;text-align:center;color:var(--muted);background:var(--paper);box-shadow:var(--pressed)}.form-layout{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr);gap:24px;align-items:start}.panel{border-radius:30px;padding:20px}.panel h3{font:400 24px/1.05 Georgia,"Times New Roman",serif;margin:0 0 16px}.field-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.kbju-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(145px,1fr));gap:12px;margin-top:14px}.kbju-grid-readable{align-items:stretch}.field-label{display:grid;gap:7px;min-width:0}.field-label span,.block-label{font-size:11px;letter-spacing:.08em;text-transform:uppercase;font-weight:650;color:var(--muted);text-align:left;padding-left:4px}.field-label .input{min-height:48px;text-align:left}.input,.textarea,.select{width:100%;border:0;background:var(--paper);color:var(--ink);border-radius:18px;padding:13px 15px;box-shadow:var(--pressed);line-height:1.35}.textarea{min-height:122px;resize:vertical}.wide-field{width:100%;margin-top:16px;display:grid;gap:8px}.recipe-textarea{display:block;width:100%;max-width:none;min-height:150px;line-height:1.55}.recipe-textarea.tall{min-height:190px}.actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}.btn{padding:11px 14px;border-radius:18px;background:var(--paper);color:var(--ink);font-weight:650;box-shadow:var(--softShadow),var(--inner)}.btn:active{box-shadow:var(--pressed);transform:scale(.98)}.btn.primary{background:linear-gradient(145deg,#f3d383,#e9b56d);color:#5c4a33}.btn.ghost{background:var(--paper);color:var(--muted)}.my-list{display:grid;gap:12px}.my-item{border-radius:24px;padding:14px}.my-item-top{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}.my-item h4{margin:0 0 6px;font-size:18px}.mini-meta{display:flex;gap:6px;flex-wrap:wrap;font-size:12px;color:var(--muted)}.mini-meta span{padding:6px 9px;border-radius:999px;background:var(--paper);box-shadow:var(--pressed)}.row-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}.kbju-preview{font-size:12px;color:var(--muted);margin-top:8px;padding:10px 12px;border-radius:18px;background:var(--paper);box-shadow:var(--pressed)}

.my-item-main{min-width:0;flex:1}.mini-kbju{display:grid;grid-template-columns:repeat(auto-fit,minmax(112px,1fr));gap:8px;margin-top:12px}.mini-kbju span,.kbju-preview-grid span{display:grid;gap:2px;padding:10px 11px;border-radius:16px;background:var(--paper);box-shadow:var(--pressed);text-align:left}.mini-kbju b,.kbju-preview-grid b{font-size:15px;font-weight:750;color:var(--ink);line-height:1.1}.mini-kbju em,.kbju-preview-grid em{font-size:11px;font-style:normal;color:var(--muted);line-height:1.2}.kbju-preview{font-size:12px;color:var(--muted);margin-top:10px;padding:12px;border-radius:20px;background:var(--paper);box-shadow:var(--pressed)}.kbju-preview-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(124px,1fr));gap:8px}.kbju-per-serving{margin-top:10px;line-height:1.45;color:var(--muted)}.kbju-muted{display:block;line-height:1.45;text-align:left}.form-layout .panel:first-child{min-width:0}.form-layout .panel:first-child .input::placeholder,.form-layout .panel:first-child .textarea::placeholder{color:color-mix(in srgb,var(--muted) 72%,transparent)}
@media(max-width:980px){.form-layout{grid-template-columns:1fr}.my-item-top{flex-direction:column}.row-actions{width:100%}.row-actions .btn{flex:1 1 auto}.recipe-textarea.tall{min-height:170px}}
@media(min-width:981px){.form-layout .panel:first-child{padding:22px}.my-list{gap:14px}}

.modal{position:fixed;inset:0;z-index:50;display:none;align-items:center;justify-content:center;padding:18px;background:rgba(95,111,126,.20);backdrop-filter:blur(12px)}.modal.open{display:flex}.dialog{width:min(940px,100%);max-height:min(90vh,760px);overflow:auto;border-radius:36px;overscroll-behavior:contain;position:relative;will-change:transform;transition:transform .30s cubic-bezier(.18,.86,.24,1),box-shadow .24s ease,filter .24s ease;touch-action:pan-y}.dialog.closing-up{animation:closeUp .36s cubic-bezier(.25,.85,.25,1) forwards}@keyframes closeUp{0%{opacity:1;transform:translateY(0) scale(1)}100%{opacity:0;transform:translateY(92px) scale(.972)}}.dialog.dragging{transition:none!important;cursor:grabbing;filter:saturate(1.03)}.dialog::before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(255,255,255,.24),transparent 28%);border-radius:inherit}.dialog-head{position:sticky;top:0;z-index:1;padding:10px 22px 22px;background:linear-gradient(180deg,var(--paper) 0%, var(--paper2) 100%);border-bottom:1px solid var(--line);cursor:grab;touch-action:none;user-select:none;box-shadow:0 8px 18px rgba(0,0,0,.05)}.dialog-head::before{content:"";display:block;width:76px;height:8px;border-radius:999px;margin:0 auto 12px;background:var(--paper);box-shadow:var(--pressed)}.dialog-title{display:flex;justify-content:space-between;align-items:flex-start;gap:18px}.dialog-title h2{font:400 clamp(28px,4vw,34px)/1.05 Georgia,"Times New Roman",serif;margin:10px 0 0;letter-spacing:-.03em;max-width:100%;word-break:break-word}.tags{display:flex;gap:8px;flex-wrap:wrap}.tag{display:inline-flex;align-items:center;gap:6px;padding:7px 10px;border-radius:999px;font-size:12px;font-weight:800;background:var(--paper);color:var(--muted);box-shadow:var(--pressed)}.tag.green{color:#57976f}.close{width:42px;height:42px;border-radius:18px;background:var(--paper);color:var(--ink);font-size:24px;display:grid;place-items:center;flex:0 0 auto;box-shadow:var(--softShadow),var(--inner)}.close:active{box-shadow:var(--pressed);transform:scale(.96)}.dialog-body{padding:20px}.recipe-cols{display:grid;grid-template-columns:minmax(0,320px) minmax(0,1fr);gap:18px;align-items:start;max-width:100%}.portion-box{display:grid;gap:10px;margin-bottom:14px}.portion-label{font-size:11px;color:var(--muted);font-weight:800;letter-spacing:.05em;text-transform:uppercase}.stepper{display:grid;grid-template-columns:42px minmax(0,1fr) 42px;gap:8px}.stepper button,.stepper input{height:42px;border-radius:16px;border:0;background:var(--paper);color:var(--ink);text-align:center;box-shadow:var(--pressed)}.stepper input{font-weight:800;font-size:18px;min-width:0}.ingredients{padding:0;margin:0;list-style:none;display:grid;gap:8px}.ingredients li{display:flex;justify-content:space-between;gap:8px;padding:10px 12px;border-radius:18px;background:var(--paper);line-height:1.34;overflow-wrap:anywhere;box-shadow:var(--pressed)}.scale{font-size:12px;font-weight:800;color:var(--accent);white-space:nowrap}.nutrition{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:14px}.ncard{background:var(--paper);border-radius:18px;padding:11px;min-width:0;box-shadow:var(--pressed)}.ncard strong{display:block;font-size:18px;overflow-wrap:anywhere}.ncard span{font-size:12px;color:var(--muted)}.nnote{font-size:12px;color:var(--muted);line-height:1.45;margin-top:12px}.progress{margin:0 0 12px;color:var(--muted);font-size:13px;font-weight:800}.steps{counter-reset:step;display:grid;gap:10px}.step{display:grid;grid-template-columns:auto minmax(0,1fr);gap:12px;align-items:start;padding:14px;border-radius:22px;background:var(--paper);min-width:0;box-shadow:var(--pressed)}.step:before{counter-increment:step;content:counter(step);width:34px;height:34px;border-radius:16px;display:grid;place-items:center;background:var(--paper);color:var(--ink);font-weight:800;box-shadow:var(--softShadow),var(--inner)}.checkline{display:flex;gap:10px;align-items:flex-start;line-height:1.5;min-width:0}.checkline input{margin-top:5px;accent-color:var(--gold);width:18px;height:18px;flex:0 0 auto}.checkline span{min-width:0;overflow-wrap:anywhere}.checkline span.done{text-decoration:line-through;color:var(--muted)}.tip{margin-top:16px;background:var(--paper);border-radius:18px;padding:14px;line-height:1.5;box-shadow:var(--pressed)}.swipe-close{margin-top:12px;font-size:12px;color:var(--muted);display:flex;align-items:center;gap:8px;padding:10px 12px;border-radius:16px;background:var(--paper);box-shadow:var(--pressed)}.swipe-cue{position:fixed;left:14px;top:50%;transform:translateY(-50%) translateX(-120%);background:var(--paper);color:var(--ink);padding:12px 14px;border-radius:20px;display:flex;align-items:center;gap:10px;box-shadow:var(--shadow),var(--inner);z-index:60;pointer-events:none;transition:transform .22s ease,opacity .22s ease;opacity:0}.swipe-cue.show{transform:translateY(-50%) translateX(0);opacity:1}.swipe-cue span{width:32px;height:32px;border-radius:16px;display:grid;place-items:center;background:var(--paper);box-shadow:var(--pressed)}.country-card:hover,.recipe-card:hover,.cat-tile:hover,.tab-card:hover,.btn:hover{transform:translateY(-2px)}.recipe-card,.cat-tile,.tab-card,.btn,.panel,.stat{backface-visibility:hidden}.theme-btn:hover,.close:hover{transform:translateY(-1px)}

/* final centered layout + unified neumorphic icon style */
.shell{display:flex;flex-direction:column;align-items:center;width:100%}
.topbar{width:100%}
.page{width:min(100%,var(--max));margin-left:auto!important;margin-right:auto!important}
#home,#country,#myview,#mealview{width:100%}
.country-grid,.recipe-grid,.category-choice,.tab-grid{justify-content:center}
.country-card,.recipe-card,.cat-tile,.tab-card{margin-left:auto;margin-right:auto;width:100%}
.cemoji,.tab-icon,.cat-icon,.dish-icon,.arrow,.leaf,.brand-mark,.theme-btn,.close{
  transform:translateZ(0);
}
.cemoji,.tab-icon,.cat-icon,.dish-icon{
  background:var(--paper) !important;
  color:var(--ink);
  text-shadow:0 2px 5px rgba(150,102,74,.16);
  border:1px solid rgba(255,255,255,.58);
  box-shadow:
    10px 10px 22px rgba(178,128,96,.18),
    -10px -10px 22px rgba(255,255,255,.78),
    inset 2px 2px 5px rgba(255,255,255,.82),
    inset -6px -6px 12px rgba(214,176,153,.20) !important;
}
body.dark .cemoji,body.dark .tab-icon,body.dark .cat-icon,body.dark .dish-icon{
  border-color:rgba(255,255,255,.08);
  box-shadow:
    10px 10px 22px rgba(0,0,0,.28),
    -8px -8px 18px rgba(255,255,255,.025),
    inset 2px 2px 5px rgba(255,255,255,.035),
    inset -7px -7px 14px rgba(0,0,0,.20) !important;
}
.cemoji::before,.tab-icon::before,.cat-icon::before,.dish-icon::before{
  content:"";
  position:absolute;
  inset:7px;
  border-radius:inherit;
  background:
    radial-gradient(circle at 28% 24%,rgba(255,255,255,.78),transparent 27%),
    radial-gradient(circle at 70% 76%,rgba(232,185,150,.24),transparent 34%);
  pointer-events:none;
}
.cemoji::after,.tab-icon::after,.cat-icon::after,.dish-icon::after{
  content:"";
  position:absolute;
  right:9px;
  bottom:8px;
  width:34%;
  height:20%;
  border-radius:999px;
  background:rgba(174,119,86,.12);
  filter:blur(6px);
  pointer-events:none;
}
.dish-icon span,.tab-icon,.cat-icon,.cemoji{position:relative;z-index:1}
.dish-icon span{filter:drop-shadow(0 5px 5px rgba(129,81,58,.18));transform:translateY(-1px)}
.country-card{
  background:linear-gradient(145deg,rgba(255,250,243,.96),rgba(244,224,208,.88)) !important;
  color:var(--ink) !important;
}
.country-card::before{
  background:
    var(--country-bg, linear-gradient(135deg,#f2d4c3,#cde6df)),
    radial-gradient(circle at 16% 18%,rgba(255,255,255,.55),transparent 24%) !important;
  opacity:.28;
}
.country-card h3,.country-card p,.country-bottom{color:var(--ink) !important}
.country-card p,.country-bottom span:first-child{color:var(--muted) !important}
.country-head{
  background:linear-gradient(145deg,rgba(255,250,243,.96),rgba(244,224,208,.88)) !important;
  color:var(--ink) !important;
}
.country-head::after{
  content:"";
  position:absolute;
  inset:0;
  background:var(--head-bg, linear-gradient(135deg,#f2d4c3,#cde6df));
  opacity:.20;
  pointer-events:none;
}
.country-head>*{position:relative;z-index:1}
.country-head h1,.country-head p{color:var(--ink) !important}
.country-head p{color:var(--muted) !important}
.country-head .pill,.country-head .back-btn{
  color:var(--ink) !important;
  background:var(--paper) !important;
  border-color:rgba(255,255,255,.45);
  box-shadow:var(--softShadow),var(--inner);
}
.dialog-head{touch-action:none}
.dialog.dragging .dialog-head::before{
  box-shadow:
    inset 4px 4px 8px rgba(182,133,104,.22),
    inset -4px -4px 9px rgba(255,255,255,.74) !important;
}


.line-icon{width:30px;height:30px;display:block;stroke:var(--icon);fill:none;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;position:relative;z-index:2;filter:drop-shadow(0 3px 5px rgba(120,95,75,.16))}
.brand-mark .line-icon,.theme-btn .line-icon{width:22px;height:22px}.cemoji .line-icon{width:36px;height:36px}.dish-icon .line-icon{width:34px;height:34px}.cat-icon .line-icon,.tab-icon .line-icon{width:28px;height:28px}.tag .line-icon{width:15px;height:15px;display:inline-block;vertical-align:-3px}.leaf .line-icon{width:18px;height:18px}.arrow .line-icon{width:18px;height:18px}
.cemoji,.tab-icon,.cat-icon,.dish-icon{background:var(--paper)!important;color:var(--icon);border:1px solid rgba(255,255,255,.58);box-shadow:var(--softShadow),var(--inner),var(--pressed)}
body.dark .cemoji,body.dark .tab-icon,body.dark .cat-icon,body.dark .dish-icon{border-color:rgba(255,255,255,.08)}
.cemoji::before,.tab-icon::before,.cat-icon::before,.dish-icon::before{content:"";position:absolute;inset:8px;border-radius:inherit;background:linear-gradient(145deg,rgba(255,255,255,.52),transparent 50%);pointer-events:none;z-index:1}
.cemoji::after,.tab-icon::after,.cat-icon::after,.dish-icon::after{content:"";position:absolute;right:8px;bottom:8px;width:36%;height:20%;border-radius:999px;background:rgba(120,95,75,.12);filter:blur(5px);pointer-events:none;z-index:1}
.country-card{background:linear-gradient(145deg,var(--paper3),var(--paper))!important;color:var(--ink)}
.country-card::before{background:var(--country-bg,linear-gradient(135deg,#ead29a,#a9c9b2))!important;opacity:.18}
.country-card h3,.country-card p,.country-bottom{color:var(--ink)}
.country-head{background:linear-gradient(145deg,var(--paper3),var(--paper))!important;color:var(--ink)}
.country-head::after{content:"";position:absolute;inset:0;background:var(--head-bg,linear-gradient(135deg,#ead29a,#a9c9b2));opacity:.16;pointer-events:none}.country-head>*{position:relative;z-index:1}.country-head h1,.country-head p{color:var(--ink)}
.country-head .pill,.country-head .back-btn{color:var(--ink);background:var(--paper);border-color:rgba(255,255,255,.45);box-shadow:var(--softShadow),var(--inner)}


/* centered button labels + thin gold inner accents */
button,.btn,.back-btn,.clear-filter,.theme-btn,.country-card,.tab-card,.cat-tile,.recipe-card{
  text-align:center;
}
.country-card,.tab-card,.cat-tile,.recipe-card{
  align-items:center;
}
.country-card>div:first-child,.tab-card>div:last-child,.cat-tile>div:last-child{
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
}
.country-bottom,.recipe-meta,.recipe-top,.row-actions,.actions{
  justify-content:center;
  text-align:center;
}
.back-btn,.clear-filter,.btn,.pill,.theme-btn{
  justify-content:center;
  text-align:center;
}
.country-card,.tab-card,.cat-tile,.recipe-card,.btn,.back-btn,.clear-filter,.theme-btn,.pill,.close{
  box-shadow:
    inset 0 0 0 1px var(--gold-ring),
    inset 0 0 0 3px var(--gold-ring-soft),
    var(--softShadow),
    var(--inner);
}
.country-card,.tab-card,.cat-tile,.recipe-card{
  box-shadow:
    inset 0 0 0 1px var(--gold-ring),
    inset 0 0 0 3px var(--gold-ring-soft),
    var(--shadow),
    var(--inner);
}
.btn.primary{
  box-shadow:
    inset 0 0 0 1px rgba(255,245,206,.55),
    inset 0 0 0 3px rgba(143,105,45,.16),
    var(--softShadow),
    var(--inner);
}
.country-card:active,.recipe-card:active,.cat-tile:active,.tab-card:active,.btn:active,.theme-btn:active,.theme-btn.tapped{
  box-shadow:
    inset 0 0 0 1px var(--gold-ring),
    inset 0 0 0 3px var(--gold-ring-soft),
    var(--pressed);
}

@media(max-width:1060px){.country-grid,.recipe-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.tab-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.kbju-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:860px){.country-head,.custom-head{grid-template-columns:1fr}.country-meta{justify-content:flex-start}.form-layout,.recipe-cols{grid-template-columns:1fr}}
@media(max-width:760px){.category-choice{grid-template-columns:repeat(2,minmax(0,1fr))}.section-title{display:block}}
@media(max-width:620px){.page{padding:22px 14px 68px}.pill{min-width:130px;min-height:72px;font-size:18px}.country-bottom{flex-direction:column}.back-btn{justify-self:center}.hero{padding:24px;border-radius:28px;min-height:220px}.country-grid,.recipe-grid,.tab-grid{grid-template-columns:1fr}.kbju-grid,.field-grid{grid-template-columns:1fr}.country-head,.custom-head{padding:20px;border-radius:28px}.brand-title strong{font-size:18px}.dialog{width:100%;max-height:92vh;border-radius:28px}.dialog-body{padding:16px}.recipe-cols{grid-template-columns:1fr;max-width:100%}.ingredients li{display:block}.scale{display:inline-block;margin-top:6px}.swipe-cue{left:10px}}

/* centered country and recipe cards + thin golden inner accents */
.country-card,
.recipe-card{
  text-align:center !important;
  align-items:center !important;
  box-shadow:
    var(--shadow),
    var(--inner),
    inset 0 0 0 1px rgba(201,164,95,.42),
    inset 0 0 0 5px rgba(201,164,95,.055) !important;
}
body.dark .country-card,
body.dark .recipe-card{
  box-shadow:
    var(--shadow),
    var(--inner),
    inset 0 0 0 1px rgba(215,182,109,.38),
    inset 0 0 0 5px rgba(215,182,109,.065) !important;
}
.country-card > div:first-child{
  width:100%;
  display:flex;
  flex-direction:column;
  align-items:center;
}
.country-card h3,
.country-card p{
  text-align:center;
  width:100%;
}
.country-bottom{
  width:100%;
  justify-content:center !important;
  text-align:center;
  flex-wrap:wrap;
}
.recipe-card .recipe-top{
  width:100%;
  justify-content:center !important;
}
.recipe-card .leaf{
  position:absolute;
  top:16px;
  right:16px;
}
.recipe-card h3{
  width:100%;
  text-align:center;
}
.recipe-card .recipe-meta{
  width:100%;
  justify-content:center !important;
  text-align:center;
}
.recipe-card .recipe-meta span{
  text-align:center;
}


/* harmonic theme refresh */
:root{
  --bg:#ffffff;
  --bg2:#fff7f2;
  --bg3:#ffd9c7;
  --paper:#fffdfb;
  --paper2:#fff7f1;
  --paper3:#fff2e9;
  --ink:#3e342f;
  --muted:#8f837c;
  --line:rgba(210,167,125,.36);
  --gold:#d1a057;
  --gold2:#f0d09a;
  --gold-ring:rgba(209,160,87,.48);
  --gold-ring-soft:rgba(209,160,87,.18);
  --icon:#5d4f47;
  --icon-soft:#a78d79;
  --shadow:16px 16px 34px rgba(215,193,176,.34), -14px -14px 28px rgba(255,255,255,.92);
  --softShadow:10px 10px 22px rgba(215,193,176,.26), -10px -10px 22px rgba(255,255,255,.88);
  --pressed:inset 8px 8px 16px rgba(221,201,185,.36), inset -8px -8px 16px rgba(255,255,255,.94);
  --inner:inset 1px 1px 0 rgba(255,255,255,.92), inset -1px -1px 0 rgba(207,173,144,.14);
  --backdrop:rgba(255,255,255,.76);
  --panelGlow:0 0 0 1px rgba(209,160,87,.26), 0 0 22px rgba(209,160,87,.10);
  --themeGlow:0 0 0 1px rgba(209,160,87,.36), 0 0 24px rgba(209,160,87,.28), 0 0 40px rgba(240,208,154,.20);
}
body.dark{
  --bg:#05070b;
  --bg2:#0a0d14;
  --bg3:#163b90;
  --paper:#0d1017;
  --paper2:#111520;
  --paper3:#171d2b;
  --ink:#eef2ff;
  --muted:#9ca8c9;
  --line:rgba(67,114,235,.44);
  --gold:#5d86ff;
  --gold2:#84a5ff;
  --gold-ring:rgba(67,114,235,.58);
  --gold-ring-soft:rgba(67,114,235,.24);
  --icon:#d9e4ff;
  --icon-soft:#8ea8f2;
  --shadow:18px 18px 38px rgba(0,0,0,.58), -12px -12px 28px rgba(48,72,134,.12);
  --softShadow:12px 12px 26px rgba(0,0,0,.44), -10px -10px 22px rgba(54,81,150,.10);
  --pressed:inset 8px 8px 18px rgba(0,0,0,.60), inset -8px -8px 18px rgba(52,79,149,.14);
  --inner:inset 1px 1px 0 rgba(146,176,255,.05), inset -1px -1px 0 rgba(0,0,0,.28);
  --backdrop:rgba(8,10,16,.78);
  --panelGlow:0 0 0 1px rgba(67,114,235,.36), 0 0 24px rgba(67,114,235,.18);
  --themeGlow:0 0 0 1px rgba(67,114,235,.46), 0 0 24px rgba(67,114,235,.34), 0 0 42px rgba(67,114,235,.20);
}
body{
  background:
    radial-gradient(circle at 16% 10%, rgba(255,255,255,.92), transparent 24%),
    radial-gradient(circle at 84% 12%, rgba(255,217,199,.58), transparent 28%),
    linear-gradient(145deg,var(--bg) 0%, var(--bg2) 58%, var(--bg3) 100%) !important;
  background-attachment:fixed;
}
body.dark{
  background:
    radial-gradient(circle at 18% 10%, rgba(80,119,230,.12), transparent 24%),
    radial-gradient(circle at 82% 12%, rgba(46,86,190,.16), transparent 28%),
    linear-gradient(145deg,var(--bg) 0%, var(--bg2) 55%, var(--bg3) 100%) !important;
  background-attachment:fixed;
}
body:before{background-image:none !important;opacity:0 !important}
.topbar{background:var(--backdrop) !important;border-bottom:1px solid var(--line) !important;box-shadow:0 10px 30px rgba(0,0,0,.04)}
body.dark .topbar{box-shadow:0 10px 30px rgba(0,0,0,.24)}
.hero,.country-card,.tab-card,.cat-tile,.recipe-card,.panel,.dialog,.country-head,.custom-head,.stat,.my-item,.pill,.btn,.back-btn,.clear-filter,.theme-btn,.close{
  border:1px solid var(--line) !important;
  box-shadow:var(--shadow),var(--inner),var(--panelGlow) !important;
}
.hero,.country-card,.tab-card,.cat-tile,.recipe-card,.panel,.dialog,.country-head,.custom-head,.stat,.my-item{
  background:linear-gradient(145deg, rgba(255,255,255,.98), rgba(255,245,237,.96)) !important;
}
body.dark .hero,body.dark .country-card,body.dark .tab-card,body.dark .cat-tile,body.dark .recipe-card,body.dark .panel,body.dark .dialog,body.dark .country-head,body.dark .custom-head,body.dark .stat,body.dark .my-item{
  background:linear-gradient(145deg, rgba(17,20,30,.96), rgba(10,13,20,.98)) !important;
}
.hero:before,.country-head:before,.custom-head:before{opacity:.18 !important}
.country-card::before{opacity:.18 !important;filter:saturate(.8)}
.country-head::after{opacity:.14 !important;filter:saturate(.85)}
.btn,.back-btn,.clear-filter,.pill{background:linear-gradient(145deg, rgba(255,255,255,.98), rgba(255,244,235,.96)) !important}
body.dark .btn,body.dark .back-btn,body.dark .clear-filter,body.dark .pill{background:linear-gradient(145deg, rgba(18,22,33,.98), rgba(12,15,23,.98)) !important}
.theme-btn{
  background:linear-gradient(145deg, rgba(255,255,255,.99), rgba(255,242,232,.96)) !important;
  box-shadow:var(--softShadow),var(--inner),var(--themeGlow) !important;
}
body.dark .theme-btn{
  background:linear-gradient(145deg, rgba(18,22,33,.99), rgba(10,13,22,.98)) !important;
  box-shadow:var(--softShadow),var(--inner),var(--themeGlow) !important;
}
.theme-btn:hover{transform:translateY(-1px) scale(1.01);box-shadow:var(--softShadow),var(--inner),var(--themeGlow) !important}
.theme-btn:active,.theme-btn.tapped{box-shadow:var(--pressed),var(--themeGlow) !important;transform:scale(.96)}
.cemoji,.tab-icon,.cat-icon,.dish-icon,.arrow,.leaf,.brand-mark,.close{
  border:1px solid var(--line) !important;
  box-shadow:var(--softShadow),var(--inner),var(--panelGlow) !important;
}
.cemoji,.tab-icon,.cat-icon,.dish-icon,.arrow,.leaf,.brand-mark{
  background:linear-gradient(145deg, rgba(255,255,255,.98), rgba(255,242,231,.96)) !important;
}
body.dark .cemoji,body.dark .tab-icon,body.dark .cat-icon,body.dark .dish-icon,body.dark .arrow,body.dark .leaf,body.dark .brand-mark{
  background:linear-gradient(145deg, rgba(20,24,35,.98), rgba(10,14,22,.98)) !important;
}
.line-icon{stroke:var(--icon) !important;filter:drop-shadow(0 2px 6px rgba(255,255,255,.18))}
body.dark .line-icon{filter:drop-shadow(0 0 8px rgba(67,114,235,.20))}
.brand-mark{box-shadow:var(--softShadow),var(--inner),var(--themeGlow) !important}
.dialog-head{background:linear-gradient(180deg,var(--paper) 0%, var(--paper2) 100%) !important;border-bottom:1px solid var(--line) !important;box-shadow:0 10px 24px rgba(0,0,0,.06)}
.tag{border:1px solid var(--line) !important;background:var(--paper2) !important;box-shadow:var(--softShadow),var(--inner)}
.input,.textarea,.select,.stepper button,.stepper input,.ingredients li,.ncard,.step,.swipe-close,.tip{border:1px solid var(--line) !important}
.input,.textarea,.select,.stepper button,.stepper input,.ingredients li,.ncard,.step,.swipe-close,.tip{background:var(--paper2) !important;box-shadow:var(--softShadow),var(--inner)}
body.dark .input,body.dark .textarea,body.dark .select,body.dark .stepper button,body.dark .stepper input,body.dark .ingredients li,body.dark .ncard,body.dark .step,body.dark .swipe-close,body.dark .tip{background:var(--paper2) !important}


/* floating blocks + cleaner cards */
.line-icon{stroke-width:1.45 !important}
.brand-mark .line-icon,.theme-btn .line-icon{width:21px;height:21px}
.cemoji .line-icon{width:34px;height:34px}.dish-icon .line-icon{width:32px;height:32px}.cat-icon .line-icon,.tab-icon .line-icon{width:26px;height:26px}
.country-card,.recipe-card{
  box-shadow:
    0 22px 42px rgba(34,20,10,.09),
    0 8px 18px rgba(34,20,10,.05),
    inset 0 1px 0 rgba(255,255,255,.95),
    0 0 0 1px var(--line) !important;
}
body.dark .country-card,body.dark .recipe-card{
  box-shadow:
    0 24px 46px rgba(0,0,0,.42),
    0 10px 22px rgba(0,0,0,.24),
    inset 0 1px 0 rgba(255,255,255,.05),
    0 0 0 1px var(--line) !important;
}
.country-card:before,.country-card:after,.recipe-card:after{display:none !important;content:none !important}
.country-card,.recipe-card{overflow:visible}
.country-card > *, .recipe-card > *{position:relative;z-index:1}
.cemoji,.dish-icon,.cat-icon,.tab-icon{
  box-shadow:
    0 10px 18px rgba(34,20,10,.08),
    inset 0 1px 0 rgba(255,255,255,.9),
    var(--pressed) !important;
}
body.dark .cemoji,body.dark .dish-icon,body.dark .cat-icon,body.dark .tab-icon{
  box-shadow:
    0 12px 20px rgba(0,0,0,.30),
    inset 0 1px 0 rgba(255,255,255,.05),
    var(--pressed) !important;
}
.dish-icon{background:var(--paper) !important;color:var(--icon) !important}
.country-card .arrow{box-shadow:0 8px 16px rgba(34,20,10,.08), var(--pressed) !important}
body.dark .country-card .arrow{box-shadow:0 10px 18px rgba(0,0,0,.28), var(--pressed) !important}


/* 2026-07 neumorphism refresh */
:root{
  --bg:#ffffff;
  --bg2:#fff8f4;
  --bg3:#f9e6db;
  --paper:#ecf0f3;
  --paper2:#f4f6f8;
  --paper3:#f0f3f6;
  --ink:#433a35;
  --muted:#978b83;
  --line:rgba(255,255,255,.92);
  --shadow:18px 18px 30px #d1d9e6, -18px -18px 30px #ffffff;
  --softShadow:12px 12px 22px rgba(209,217,230,.92), -12px -12px 22px rgba(255,255,255,.98);
  --pressed:inset 10px 10px 18px rgba(209,217,230,.90), inset -10px -10px 18px rgba(255,255,255,.98);
  --inner:inset 1px 1px 0 rgba(255,255,255,.92), inset -1px -1px 0 rgba(215,224,233,.75);
  --panelGlow:0 10px 18px rgba(255,255,255,.20);
  --backdrop:rgba(255,255,255,.78);
}
body.dark{
  --bg:#02040a;
  --bg2:#070c18;
  --bg3:#1843a6;
  --paper:#0c1018;
  --paper2:#111727;
  --paper3:#0f1421;
  --ink:#edf3ff;
  --muted:#98a6c9;
  --line:rgba(77,122,255,.42);
  --shadow:18px 18px 30px rgba(0,0,0,.62), -18px -18px 30px rgba(49,82,180,.12);
  --softShadow:12px 12px 24px rgba(0,0,0,.48), -12px -12px 24px rgba(49,82,180,.10);
  --pressed:inset 10px 10px 20px rgba(0,0,0,.62), inset -10px -10px 20px rgba(44,72,160,.14);
  --inner:inset 1px 1px 0 rgba(255,255,255,.05), inset -1px -1px 0 rgba(0,0,0,.26);
  --panelGlow:0 0 18px rgba(77,122,255,.16);
  --backdrop:rgba(2,4,10,.76);
}
body{background:linear-gradient(180deg,var(--bg) 0%, var(--bg2) 56%, var(--bg3) 100%) !important;background-attachment:fixed;color:var(--ink)}
body.dark{background:linear-gradient(180deg,var(--bg) 0%, var(--bg2) 54%, var(--bg3) 100%) !important;background-attachment:fixed}
body:before{display:none !important}
.topbar{background:var(--backdrop) !important;border-bottom:0 !important;box-shadow:var(--softShadow)}
.hero,.country-card,.tab-card,.cat-tile,.recipe-card,.panel,.dialog,.country-head,.custom-head,.stat,.my-item,.pill,.btn,.back-btn,.clear-filter,.theme-btn,.close,.input,.textarea,.select,.ingredients li,.ncard,.step,.tip,.swipe-close,.stepper button,.stepper input{
  border:0 !important;
  background:var(--paper) !important;
  box-shadow:var(--shadow), var(--inner) !important;
}
body.dark .hero,body.dark .country-card,body.dark .tab-card,body.dark .cat-tile,body.dark .recipe-card,body.dark .panel,body.dark .dialog,body.dark .country-head,body.dark .custom-head,body.dark .stat,body.dark .my-item,body.dark .pill,body.dark .btn,body.dark .back-btn,body.dark .clear-filter,body.dark .theme-btn,body.dark .close,body.dark .input,body.dark .textarea,body.dark .select,body.dark .ingredients li,body.dark .ncard,body.dark .step,body.dark .tip,body.dark .swipe-close,body.dark .stepper button,body.dark .stepper input{background:var(--paper) !important}
.country-card:before,.country-card:after,.tab-card:after,.cat-tile:before,.recipe-card:after,.country-head:before,.country-head:after,.custom-head:before{display:none !important;content:none !important}
.hero,.country-head,.custom-head{background:var(--paper) !important}
.theme-btn{box-shadow:var(--softShadow),var(--inner),0 0 18px rgba(255,210,140,.25) !important}
body.dark .theme-btn{box-shadow:var(--softShadow),var(--inner),0 0 18px rgba(77,122,255,.24) !important}
.theme-btn:active,.theme-btn.tapped{box-shadow:var(--pressed),0 0 12px rgba(255,210,140,.18) !important}
body.dark .theme-btn:active,body.dark .theme-btn.tapped{box-shadow:var(--pressed),0 0 12px rgba(77,122,255,.18) !important}
.brand-mark,.cemoji,.dish-icon,.arrow,.leaf,.tab-icon,.cat-icon{background:var(--paper) !important;box-shadow:var(--shadow),var(--inner) !important}
body.dark .brand-mark,body.dark .cemoji,body.dark .dish-icon,body.dark .arrow,body.dark .leaf,body.dark .tab-icon,body.dark .cat-icon{background:var(--paper) !important}
.line-icon{stroke-width:1.35 !important;stroke:var(--icon) !important;filter:none !important}
.cemoji:before,.cemoji:after,.dish-icon:before,.dish-icon:after,.cat-icon:before,.cat-icon:after,.tab-icon:before,.tab-icon:after,.brand-mark:before,.arrow:before{display:none !important}
.country-card,.recipe-card,.cat-tile,.tab-card{overflow:visible}
.country-card,.recipe-card,.cat-tile,.tab-card,.panel,.hero,.country-head,.custom-head{transform:none !important}
.country-card:active,.recipe-card:active,.cat-tile:active,.tab-card:active,.btn:active,.back-btn:active,.clear-filter:active,.theme-btn:active{box-shadow:var(--pressed) !important;transform:translateY(1px) scale(.995)}
.country-card{align-items:center;text-align:center;gap:10px;padding:24px 22px 22px}
.country-card h3,.country-card p,.country-bottom,.country-bottom span{position:relative;z-index:1}
.country-bottom{display:flex;flex-direction:column;gap:12px}
.country-bottom .arrow{margin-inline:auto}
.recipe-card{padding:18px 16px 16px}
.recipe-top{justify-content:center}
.section-title,.section-title>div,.cat-line{justify-content:center;text-align:center}
.cat-line:before,.cat-line:after{display:none !important}
.country-meta{justify-content:center;gap:18px}
.pill{min-height:92px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:4px;padding:16px 20px}
.pill .line-icon{width:16px;height:16px}
.country-head,.custom-head{justify-items:center;text-align:center}
.country-head p,.custom-head p,.lead,.section-title p{max-width:620px;margin-inline:auto}
.cat-tile{align-items:center;justify-content:center;text-align:center;min-height:108px;padding:16px 12px}
.cat-tile strong,.cat-tile span{width:100%;text-align:center}
.cat-icon{display:none !important}
.tab-card{align-items:center;text-align:center}
.clear-filter{box-shadow:var(--softShadow),var(--inner) !important}
.flag-badge{padding:0;display:grid;place-items:center}
.flag-icon{width:40px;height:40px;display:block}
.flag-icon .outline{fill:none;stroke:rgba(70,70,78,.26);stroke-width:1.2}
body.dark .flag-icon .outline{stroke:rgba(205,220,255,.24)}
.flag-icon .soft-fill{opacity:.88}
.flag-icon .soft-stroke{fill:none;stroke:rgba(72,70,68,.42);stroke-width:1.05;stroke-linecap:round;stroke-linejoin:round}
body.dark .flag-icon .soft-stroke{stroke:rgba(228,236,255,.42)}
.dish-icon{width:66px;height:66px;border-radius:24px}
.leaf{display:none}
@media(max-width:760px){.cat-tile{min-height:94px}.country-bottom{gap:10px}.pill{min-height:76px;padding:12px 14px}}


/* cobalt dark theme + flag readability */
body.dark{
  --bg:#08142f;
  --bg2:#0d2461;
  --bg3:#1641a3;
  --paper:#ecf0f3;
  --paper2:#f4f6f8;
  --paper3:#eef2f6;
  --ink:#17233d;
  --muted:#66718a;
  --icon:#24314f;
  --line:rgba(255,255,255,.92);
  --shadow:18px 18px 30px rgba(5,19,55,.28), -18px -18px 30px rgba(255,255,255,.38);
  --softShadow:12px 12px 22px rgba(5,19,55,.22), -12px -12px 22px rgba(255,255,255,.42);
  --pressed:inset 10px 10px 18px rgba(5,19,55,.24), inset -10px -10px 18px rgba(255,255,255,.50);
  --inner:inset 1px 1px 0 rgba(255,255,255,.82), inset -1px -1px 0 rgba(76,100,145,.18);
  --backdrop:rgba(12,32,82,.72);
}
body.dark{
  background:linear-gradient(180deg,#030711 0%, #0a1e55 56%, #1641a3 100%) !important;
  background-attachment:fixed;
}
body.dark .topbar{background:rgba(4,10,24,.42) !important;backdrop-filter:blur(18px);box-shadow:0 12px 32px rgba(0,0,0,.18) !important}
body.dark .hero,body.dark .country-card,body.dark .tab-card,body.dark .cat-tile,body.dark .recipe-card,body.dark .panel,body.dark .dialog,body.dark .country-head,body.dark .custom-head,body.dark .stat,body.dark .my-item,body.dark .pill,body.dark .btn,body.dark .back-btn,body.dark .clear-filter,body.dark .theme-btn,body.dark .close,body.dark .input,body.dark .textarea,body.dark .select,body.dark .ingredients li,body.dark .ncard,body.dark .step,body.dark .tip,body.dark .swipe-close,body.dark .stepper button,body.dark .stepper input{
  color:var(--ink) !important;
  background:var(--paper) !important;
  box-shadow:var(--shadow),var(--inner) !important;
}
body.dark .country-card,body.dark .recipe-card,body.dark .cat-tile,body.dark .panel,body.dark .hero,body.dark .country-head,body.dark .custom-head{
  border:0 !important;
}
body.dark .theme-btn{box-shadow:var(--softShadow),var(--inner),0 0 24px rgba(95,139,255,.42) !important}
body.dark .brand-title strong{color:#f5f7ff !important;text-shadow:0 2px 12px rgba(20,60,160,.28)}
body.dark .brand{color:#f5f7ff !important}
/* white flag backing and button-fit scale */
.cemoji{
  width:86px !important;
  height:86px !important;
  border-radius:30px !important;
  padding:12px !important;
}
.flag-icon{
  width:100% !important;
  height:100% !important;
  display:block;
}
body.dark .cemoji{
  background:#f8fbff !important;
  box-shadow:12px 12px 22px rgba(5,19,55,.22), -10px -10px 20px rgba(255,255,255,.36), inset 1px 1px 0 rgba(255,255,255,.9), inset -1px -1px 0 rgba(160,175,210,.20) !important;
}
body.dark .flag-icon .outline{stroke:rgba(40,54,90,.28) !important}
body.dark .flag-icon .soft-stroke{stroke:rgba(36,49,79,.48) !important}
/* leaf only inside recipe cards */
.leaf{display:none !important}
.recipe-card .leaf{
  display:inline-grid !important;
  place-items:center;
  width:34px;height:34px;border-radius:18px;
  background:var(--paper) !important;
  color:#5fa077;
  box-shadow:var(--softShadow),var(--inner) !important;
}
body.dark .recipe-card .leaf{background:var(--paper) !important;color:#5a8d6f !important}
.recipe-card .leaf .line-icon{width:18px;height:18px}
.country-meta .pill{min-width:190px}
@media(max-width:760px){.cemoji{width:78px!important;height:78px!important;padding:11px!important}.country-meta .pill{min-width:140px}}


/* final cobalt dark theme + hero ambient ornament */
body.dark{
  --bg:#061027;
  --bg2:#0b1a43;
  --bg3:#214ea8;
  --paper:#10204d;
  --paper2:#12265a;
  --paper3:#17316f;
  --ink:#eef4ff;
  --muted:#bed0f2;
  --line:rgba(141,179,255,.28);
  --gold:#8cb2ff;
  --gold2:#d6e4ff;
  --gold-ring:rgba(114,159,255,.40);
  --gold-ring-soft:rgba(114,159,255,.18);
  --icon:#eef4ff;
  --icon-soft:#a9c2ff;
  --shadow:18px 18px 30px rgba(3,9,26,.54), -18px -18px 30px rgba(46,87,189,.20);
  --softShadow:12px 12px 22px rgba(3,9,26,.42), -12px -12px 22px rgba(54,97,208,.16);
  --pressed:inset 10px 10px 18px rgba(3,9,26,.56), inset -10px -10px 18px rgba(58,102,214,.18);
  --inner:inset 1px 1px 0 rgba(255,255,255,.06), inset -1px -1px 0 rgba(3,9,26,.22);
  --backdrop:rgba(9,18,45,.80);
}
body.dark{background:linear-gradient(180deg,var(--bg) 0%, var(--bg2) 56%, var(--bg3) 100%) !important;background-attachment:fixed}
body.dark .hero, body.dark .country-card, body.dark .tab-card, body.dark .cat-tile, body.dark .recipe-card, body.dark .panel, body.dark .dialog, body.dark .country-head, body.dark .custom-head, body.dark .stat, body.dark .my-item, body.dark .pill, body.dark .btn, body.dark .back-btn, body.dark .clear-filter, body.dark .theme-btn, body.dark .close, body.dark .input, body.dark .textarea, body.dark .select, body.dark .ingredients li, body.dark .ncard, body.dark .step, body.dark .tip, body.dark .swipe-close, body.dark .stepper button, body.dark .stepper input{
  background:linear-gradient(180deg, rgba(18,38,90,.98), rgba(16,32,77,.98)) !important;
  color:var(--ink);
}
body.dark .hero:before{background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.01)) !important;box-shadow:inset 10px 10px 24px rgba(4,9,27,.34), inset -10px -10px 24px rgba(88,132,255,.10) !important}
.hero{overflow:hidden}
.hero:after{display:none !important}
.hero-ambient{position:absolute;right:34px;top:34px;width:152px;height:152px;border-radius:42px;background:var(--paper);box-shadow:var(--pressed), inset 0 1px 0 rgba(255,255,255,.72), 0 18px 34px rgba(179,195,218,.18);display:grid;place-items:center;overflow:hidden;z-index:0;transform:rotate(8deg)}
.hero-ambient:before{content:"";position:absolute;inset:14px;border-radius:34px;background:linear-gradient(145deg, rgba(255,255,255,.16), rgba(255,255,255,0));box-shadow:inset 8px 8px 18px rgba(184,198,219,.18), inset -10px -10px 18px rgba(255,255,255,.58);pointer-events:none}
.hero-ambient:after{content:"";position:absolute;inset:auto 20px 18px 20px;height:34px;border-radius:50%;background:radial-gradient(circle, rgba(255,255,255,.28), transparent 70%);filter:blur(8px);opacity:.55;pointer-events:none}
body.dark .hero-ambient{background:linear-gradient(180deg, rgba(19,38,91,.98), rgba(14,31,77,.98));box-shadow:var(--pressed), inset 0 1px 0 rgba(255,255,255,.05), 0 18px 36px rgba(2,9,25,.26)}
body.dark .hero-ambient:before{background:linear-gradient(145deg, rgba(255,255,255,.05), rgba(255,255,255,0));box-shadow:inset 10px 10px 18px rgba(4,9,27,.34), inset -10px -10px 20px rgba(88,132,255,.12)}
body.dark .hero-ambient:after{background:radial-gradient(circle, rgba(136,173,255,.22), transparent 70%);opacity:.44}
.ambient-svg{width:70px;height:70px;position:relative;z-index:1;filter:drop-shadow(0 2px 5px rgba(255,255,255,.18))}
body.dark .ambient-svg{filter:drop-shadow(0 0 14px rgba(138,173,255,.24))}
.hero > div:first-child{position:relative;z-index:1}
body.dark .cemoji{background:#f9fbff !important;box-shadow:12px 12px 24px rgba(3,9,26,.38), -10px -10px 22px rgba(74,118,229,.08), inset 1px 1px 0 rgba(255,255,255,.98) !important}
body.dark .cemoji .outline{stroke:rgba(68,80,108,.26) !important}
.flag-icon{width:54px;height:54px;display:block}
.cemoji{width:92px;height:92px;border-radius:30px;display:grid;place-items:center}
body.dark .flag-icon{filter:none}


/* compact hero ornament + no recipe/dish icons */
.hero-ambient{width:86px !important;height:86px !important;border-radius:28px !important;right:26px !important;top:26px !important;opacity:.62 !important;transform:rotate(7deg) !important;pointer-events:none !important}
.hero-ambient:before{inset:9px !important;border-radius:22px !important;box-shadow:inset 5px 5px 12px rgba(184,198,219,.16), inset -6px -6px 12px rgba(255,255,255,.45) !important}
.hero-ambient:after{height:18px !important;left:16px !important;right:16px !important;bottom:10px !important;filter:blur(6px) !important;opacity:.36 !important}
.ambient-svg{width:38px !important;height:38px !important;opacity:.62 !important}
body.dark .ambient-svg{opacity:.70 !important;filter:drop-shadow(0 0 9px rgba(138,173,255,.16)) !important}
.recipe-card{justify-content:center !important;gap:14px !important;min-height:150px !important;padding:18px 16px !important}
.recipe-top,.dish-icon,.leaf{display:none !important}
.recipe-badge{display:inline-flex;align-items:center;justify-content:center;align-self:center;padding:7px 12px;border-radius:999px;background:var(--paper);color:var(--muted);font-size:12px;font-weight:800;box-shadow:var(--pressed);margin-bottom:2px}
.recipe-card h3{margin:0 0 4px !important}
.tag .line-icon{display:none !important}
@media(max-width:760px){.hero-ambient{width:68px !important;height:68px !important;right:18px !important;top:18px !important;border-radius:22px !important;opacity:.46 !important}.ambient-svg{width:30px !important;height:30px !important}.hero h1{max-width:72%}.lead{max-width:72%}}


/* stronger ambient glow for sun/moon icon */
.hero-ambient{opacity:.78 !important}
.hero-ambient:after{height:24px !important;left:12px !important;right:12px !important;bottom:9px !important;filter:blur(12px) !important;opacity:.52 !important;background:radial-gradient(circle, rgba(255,214,144,.30), transparent 72%) !important}
body.dark .hero-ambient:after{background:radial-gradient(circle, rgba(149,186,255,.32), transparent 72%) !important;opacity:.54 !important}
.ambient-svg{width:44px !important;height:44px !important;opacity:1 !important;overflow:visible;filter:drop-shadow(0 0 10px rgba(255,210,125,.24)) drop-shadow(0 0 18px rgba(255,225,170,.16)) !important}
body.dark .ambient-svg{width:44px !important;height:44px !important;opacity:1 !important;filter:drop-shadow(0 0 12px rgba(170,205,255,.26)) drop-shadow(0 0 20px rgba(132,174,255,.18)) !important}
.ambient-sun{transform:translateY(1px)}
.ambient-moon{transform:translateY(1px)}
body.dark .ambient-moon{filter:drop-shadow(0 0 10px rgba(180,214,255,.38))}
@media(max-width:760px){.ambient-svg{width:34px !important;height:34px !important}.hero-ambient{opacity:.7 !important}}


/* local diffuse glow around sun / moon pictograms */
.ambient-svg{width:46px !important;height:46px !important;opacity:1 !important;overflow:visible;filter:none !important}
.ambient-sun{filter:drop-shadow(0 0 6px rgba(255,214,120,.55)) drop-shadow(0 0 12px rgba(255,214,120,.34)) drop-shadow(0 0 22px rgba(255,214,120,.18)) !important}
.ambient-moon{filter:drop-shadow(0 0 6px rgba(188,219,255,.56)) drop-shadow(0 0 12px rgba(188,219,255,.34)) drop-shadow(0 0 22px rgba(188,219,255,.18)) !important}
body.dark .ambient-moon{filter:drop-shadow(0 0 8px rgba(194,223,255,.62)) drop-shadow(0 0 16px rgba(160,198,255,.34)) drop-shadow(0 0 28px rgba(132,174,255,.18)) !important}
.hero-ambient:after{opacity:.24 !important;filter:blur(10px) !important}
body.dark .hero-ambient:after{opacity:.26 !important;filter:blur(10px) !important}
@media(max-width:760px){.ambient-svg{width:36px !important;height:36px !important}}


/* move ambient icon to theme button and center hero */
.hero{display:flex !important;align-items:center !important;justify-content:center !important;min-height:260px !important;padding:36px 30px !important;text-align:center !important}
.hero > div:first-child{width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}
.hero h1{max-width:none !important;text-align:center !important;margin-left:auto !important;margin-right:auto !important}
.hero .lead{max-width:680px !important;text-align:center !important;margin-left:auto !important;margin-right:auto !important}
.hero .kicker{align-self:center;text-align:center}
.hero .stats{justify-content:center !important}
.hero:after,.hero-ambient{display:none !important}
.theme-btn{width:56px !important;height:56px !important;border-radius:20px !important;overflow:visible !important;position:relative;isolation:isolate}
.theme-btn:before{content:"";position:absolute;inset:4px auto auto 6px;width:58%;height:34%;border-radius:999px;background:linear-gradient(180deg, rgba(255,255,255,.58), rgba(255,255,255,0));pointer-events:none;filter:blur(1px);opacity:.62;z-index:0}
body.dark .theme-btn:before{background:linear-gradient(180deg, rgba(255,255,255,.12), rgba(255,255,255,0));opacity:.42}
.theme-btn .ambient-svg{width:30px !important;height:30px !important;position:relative;z-index:1;overflow:visible;opacity:1 !important}
.theme-btn .ambient-sun{filter:drop-shadow(0 0 7px rgba(255,214,120,.62)) drop-shadow(0 0 14px rgba(255,214,120,.38)) drop-shadow(0 0 24px rgba(255,214,120,.22)) !important}
.theme-btn .ambient-moon{filter:drop-shadow(0 0 7px rgba(194,223,255,.64)) drop-shadow(0 0 14px rgba(194,223,255,.40)) drop-shadow(0 0 24px rgba(194,223,255,.22)) !important}
body.dark .theme-btn .ambient-moon{filter:drop-shadow(0 0 9px rgba(201,228,255,.70)) drop-shadow(0 0 18px rgba(160,198,255,.42)) drop-shadow(0 0 28px rgba(132,174,255,.24)) !important}
.theme-btn .ambient-sun circle:last-of-type,.theme-btn .ambient-moon path{vector-effect:non-scaling-stroke}
@media(max-width:760px){.hero{padding:30px 20px !important}.theme-btn{width:50px !important;height:50px !important}.theme-btn .ambient-svg{width:26px !important;height:26px !important}}


/* country cards centered and tidier */
.country-grid{align-items:stretch;justify-items:stretch}
.country-card{justify-content:center !important;align-items:center !important;text-align:center !important;gap:18px !important;padding:26px 22px !important;min-height:240px !important}
.country-main{width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:14px;position:relative;z-index:1}
.country-copy{width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}
.country-card h3{width:100%;margin:0 !important;text-align:center !important;font-size:clamp(32px,4vw,48px) !important;line-height:1.02 !important;letter-spacing:-.045em !important;word-break:normal;hyphens:auto}
.country-card p{width:100%;max-width:290px;margin:0 auto !important;text-align:center !important;font-size:15px !important;line-height:1.45 !important}
.country-bottom{width:100%;display:flex !important;flex-direction:column !important;align-items:center !important;justify-content:center !important;gap:12px !important;text-align:center !important;margin-top:2px !important}
.country-bottom span:first-child{display:block;width:100%;text-align:center;font-size:14px;line-height:1.25;color:var(--muted)}
.country-bottom .arrow{margin:0 auto !important;width:42px !important;height:42px !important;border-radius:18px !important}
.cemoji{margin:0 auto !important;flex:0 0 auto}
@media(max-width:760px){.country-card{min-height:230px !important;padding:24px 18px !important;gap:16px !important}.country-card h3{font-size:clamp(34px,9vw,48px) !important}.country-card p{font-size:15px !important}.country-bottom span:first-child{font-size:14px}}


/* theme button sun/moon morph animation */
.theme-btn{display:grid !important;place-items:center !important;overflow:visible !important}
.theme-btn .ambient-svg{width:34px !important;height:34px !important;position:absolute !important;left:50% !important;top:50% !important;transform:translate(-50%,-50%) rotate(0deg) scale(1) !important;transform-origin:center !important;overflow:visible !important;opacity:1 !important}
.theme-btn .ambient-sun,.theme-btn .ambient-moon{transform:translate(-50%,-50%) rotate(0deg) scale(1) !important}
.theme-btn.theme-morph .ambient-svg{animation:themeIconMorph .44s cubic-bezier(.2,.85,.2,1) both}
@keyframes themeIconMorph{0%{opacity:.18;transform:translate(-50%,-50%) rotate(-110deg) scale(.58)}52%{opacity:1;transform:translate(-50%,-50%) rotate(18deg) scale(1.18)}100%{opacity:1;transform:translate(-50%,-50%) rotate(0deg) scale(1)}}
.theme-btn .ambient-sun{filter:drop-shadow(0 0 7px rgba(255,214,120,.62)) drop-shadow(0 0 14px rgba(255,214,120,.38)) drop-shadow(0 0 24px rgba(255,214,120,.22)) !important}
.theme-btn .ambient-moon{filter:drop-shadow(0 0 7px rgba(194,223,255,.64)) drop-shadow(0 0 14px rgba(194,223,255,.40)) drop-shadow(0 0 24px rgba(194,223,255,.22)) !important}
body.dark .theme-btn .ambient-moon{filter:drop-shadow(0 0 9px rgba(201,228,255,.70)) drop-shadow(0 0 18px rgba(160,198,255,.42)) drop-shadow(0 0 28px rgba(132,174,255,.24)) !important}
@media(max-width:760px){.theme-btn .ambient-svg{width:30px !important;height:30px !important}}


/* Mediterranean origin labels */
.recipe-origin{font-size:12px;line-height:1.35;color:var(--muted);font-weight:800;text-align:center;margin:-2px 0 10px;letter-spacing:.01em}
.dialog-title h2 small{display:block;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-size:13px;line-height:1.35;font-weight:800;color:var(--muted);letter-spacing:0;margin-top:8px}
.dialog-title h2 span{display:block}


/* local saving / backup controls */
.backup-box{margin-top:18px;padding:16px;border-radius:26px;background:var(--paper);box-shadow:var(--softShadow),var(--inner);text-align:center}
.backup-box h4{margin:0 0 6px;font:400 20px/1.15 Georgia,"Times New Roman",serif;letter-spacing:-.02em}
.backup-box p{margin:0 auto 12px;color:var(--muted);font-size:13px;line-height:1.45;max-width:520px}
.backup-actions{justify-content:center;margin-top:8px}
.backup-note{margin-top:10px;color:var(--muted);font-size:12px;font-weight:800}
body.dark .backup-box{background:linear-gradient(180deg, rgba(18,38,90,.98), rgba(16,32,77,.98)) !important}


/* Supabase cloud sync */
.cloud-box{margin-top:16px;padding-top:16px;border-top:1px solid var(--line)}
.cloud-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:12px 0 2px}
.cloud-box h4{margin-top:0}
.cloud-box .btn:disabled{opacity:.45;cursor:not-allowed;filter:saturate(.55)}
@media(max-width:760px){.cloud-fields{grid-template-columns:1fr}}


/* top authentication buttons */
.topbar-actions{display:flex;align-items:center;justify-self:end;gap:10px;position:relative;z-index:2}
.top-auth{display:flex;align-items:center;gap:8px;position:relative}
.top-auth-status{max-width:180px;padding:10px 12px;border-radius:999px;background:var(--paper);box-shadow:var(--pressed);color:var(--muted);font-size:12px;font-weight:850;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.auth-chip{height:42px;padding:0 14px;border-radius:16px;background:var(--paper);color:var(--ink);font-size:13px;font-weight:850;letter-spacing:.01em;box-shadow:var(--softShadow),var(--inner);transition:transform .16s ease,box-shadow .16s ease,opacity .16s ease}
.auth-chip-primary{background:linear-gradient(145deg,var(--paper2),var(--paper)) !important;color:var(--ink)}
.auth-chip.ghost{color:var(--muted)}
.auth-chip:active{box-shadow:var(--pressed);transform:translateY(1px) scale(.98)}
body.dark .auth-chip,body.dark .top-auth-status{background:linear-gradient(180deg, rgba(18,38,90,.98), rgba(16,32,77,.98)) !important;color:var(--ink)}
.auth-popover{position:absolute;right:0;top:calc(100% + 12px);z-index:60;width:min(340px,calc(100vw - 28px));padding:16px;border-radius:28px;background:var(--paper);box-shadow:var(--shadow),var(--inner);border:0;color:var(--ink)}
body.dark .auth-popover{background:linear-gradient(180deg, rgba(18,38,90,.98), rgba(16,32,77,.98)) !important}
.auth-popover:before{content:"";position:absolute;right:72px;top:-7px;width:16px;height:16px;transform:rotate(45deg);background:var(--paper);box-shadow:-5px -5px 12px rgba(255,255,255,.34)}
body.dark .auth-popover:before{background:#12265a;box-shadow:-5px -5px 12px rgba(78,121,255,.10)}
.auth-popover-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:6px}
.auth-popover-head strong{font:400 23px/1 Georgia,"Times New Roman",serif;letter-spacing:-.03em}
.auth-popover p{margin:0 0 12px;color:var(--muted);font-size:13px;line-height:1.45}
.auth-popover .input{width:100%;margin:8px 0 0}
.auth-close{width:34px;height:34px;border-radius:13px;background:var(--paper);color:var(--muted);box-shadow:var(--softShadow),var(--inner);font-size:20px;line-height:1}
body.dark .auth-close{background:linear-gradient(180deg, rgba(18,38,90,.98), rgba(16,32,77,.98)) !important}
.auth-popover-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}.auth-popover-actions .btn{flex:1;min-width:120px}
@media(max-width:820px){.top-auth-status{display:inline-flex;align-items:center;justify-content:center;height:34px;max-width:86px;padding:0 10px;border-radius:999px;font-size:11px;letter-spacing:.01em;line-height:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.auth-chip{height:38px;padding:0 10px;font-size:12px;border-radius:14px}.topbar-inner{grid-template-columns:56px 1fr auto;gap:10px;padding:12px 14px}.topbar-actions{gap:8px}.site-title{font-size:clamp(24px,6vw,34px);letter-spacing:.06em}.theme-btn{width:44px !important;height:44px !important;border-radius:16px}}
@media(max-width:560px){.topbar-inner{grid-template-columns:46px 1fr auto;gap:6px;padding:9px 10px}.brand{width:46px;height:46px;min-width:46px}.brand-mark{width:44px;height:44px;border-radius:15px}.brand-mark .line-icon{width:20px;height:20px}.topbar-actions{gap:5px}.top-auth{gap:5px}.top-auth-status{height:30px;max-width:58px;padding:0 7px;font-size:10px;border-radius:999px}.auth-chip{height:32px;padding:0 8px;font-size:11px;border-radius:12px}.auth-chip-primary{max-width:94px}.site-title{font-size:clamp(19px,5.6vw,27px);letter-spacing:.05em;white-space:normal;line-height:1.05;max-width:38vw}.theme-btn{width:38px !important;height:38px !important;border-radius:14px}.auth-popover{right:-48px;top:calc(100% + 10px)}.auth-popover:before{right:70px}}


/* live portion weights + cooking step timers */
.ingredients li{align-items:center}
.ingredients li span:first-child{flex:1;text-align:left}
.step-timer{grid-column:2;display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:10px;padding:10px 12px;border-radius:18px;background:var(--paper);box-shadow:var(--pressed);min-width:0}
.timer-readout{display:flex;flex-direction:column;gap:1px;min-width:0}.timer-readout strong{font-size:18px;letter-spacing:.02em}.timer-readout span{font-size:11px;color:var(--muted);font-weight:800;text-transform:uppercase;letter-spacing:.08em}.timer-actions{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}.timer-actions button{border:0;border-radius:999px;padding:8px 10px;background:var(--paper);color:var(--ink);font-weight:800;font-size:12px;box-shadow:var(--softShadow),var(--inner)}.timer-actions button:disabled{opacity:.45;cursor:default}.step-timer.running .timer-readout strong{color:var(--accent)}.step-timer.finished{box-shadow:var(--softShadow),var(--inner)}.step-timer.finished .timer-readout strong{color:#5fa077}body.dark .step-timer.finished .timer-readout strong{color:#b7d3ff}@media(max-width:760px){.step-timer{grid-column:1 / -1;flex-direction:column;align-items:stretch}.timer-actions{justify-content:stretch}.timer-actions button{flex:1}.timer-readout{text-align:center}}


/* auto step timer: compact clock + floating mini window */
.step{grid-template-columns:auto minmax(0,1fr) auto !important;align-items:center !important}
.step .checkline{grid-column:2;min-width:0}
.step-timer.timer-chip{grid-column:3 !important;align-self:start;justify-self:end;display:inline-flex !important;align-items:center;justify-content:center;gap:6px;margin:0 !important;padding:9px 11px !important;min-width:86px;width:auto;border-radius:999px;border:0;background:var(--paper) !important;color:var(--ink);box-shadow:var(--softShadow),var(--inner) !important;font-weight:900;line-height:1;white-space:nowrap;transition:transform .18s ease,box-shadow .18s ease,opacity .18s ease}
.step-timer.timer-chip:hover{transform:translateY(-1px)}
.step-timer.timer-chip .timer-clock{font-size:16px;line-height:1;opacity:.78}
.step-timer.timer-chip strong{font-size:13px;letter-spacing:.02em;font-variant-numeric:tabular-nums}
.step-timer.timer-chip.running{color:var(--accent);box-shadow:var(--pressed),0 0 16px rgba(201,164,95,.18) !important}
body.dark .step-timer.timer-chip.running{box-shadow:var(--pressed),0 0 16px rgba(142,178,255,.18) !important}
.step-timer.timer-chip.finished{color:#57976f}
body.dark .step-timer.timer-chip.finished{color:#c6dcff}
.step-timer.timer-chip.paused{opacity:.82}
.floating-timer{position:fixed;right:18px;bottom:18px;z-index:90;width:min(318px,calc(100vw - 32px));border-radius:28px;background:var(--paper);color:var(--ink);box-shadow:var(--shadow),var(--inner);padding:14px;overflow:hidden;backdrop-filter:blur(18px);animation:timerPop .24s cubic-bezier(.2,.8,.2,1)}
@keyframes timerPop{from{opacity:0;transform:translateY(12px) scale(.96)}to{opacity:1;transform:none}}
.floating-timer:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 18% 14%,rgba(255,255,255,.42),transparent 31%),linear-gradient(145deg,rgba(255,255,255,.14),transparent 62%);pointer-events:none}
body.dark .floating-timer{background:linear-gradient(180deg,rgba(18,38,90,.98),rgba(16,32,77,.98));box-shadow:18px 18px 30px rgba(3,9,26,.50),-12px -12px 24px rgba(54,97,208,.14),var(--inner)}
.float-timer-top{position:relative;z-index:1;display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:12px}.float-kicker{display:block;font-size:10px;letter-spacing:.12em;text-transform:uppercase;font-weight:900;color:var(--muted);margin-bottom:2px}.float-timer-top strong{font-size:16px}.float-timer-top button,.float-actions button{border:0;border-radius:999px;background:var(--paper);color:var(--ink);box-shadow:var(--softShadow),var(--inner);font-weight:900}.float-timer-top button{width:34px;height:34px;line-height:1}.float-timer-body{position:relative;z-index:1;display:grid;gap:10px}.float-time{font-size:38px;line-height:1;font-weight:900;letter-spacing:.03em;text-align:center;font-variant-numeric:tabular-nums}.float-note{text-align:center;color:var(--muted);font-size:12px;font-weight:800}.float-actions{display:flex;gap:8px}.float-actions button{flex:1;padding:10px 8px;font-size:12px}.floating-timer.running .float-time{color:var(--accent)}.floating-timer.finished .float-time{color:#57976f}body.dark .floating-timer.finished .float-time{color:#c6dcff}.float-mini-main{display:none;position:relative;z-index:1;border:0;border-radius:999px;background:var(--paper);color:var(--ink);box-shadow:var(--pressed);font-weight:900;align-items:center;gap:8px;padding:10px 14px}.floating-timer.minimized{width:auto;min-width:132px;border-radius:999px;padding:8px}.floating-timer.minimized .float-timer-top,.floating-timer.minimized .float-timer-body{display:none}.floating-timer.minimized .float-mini-main{display:flex}.float-mini-main strong{font-variant-numeric:tabular-nums}.floating-timer.minimized.running .float-mini-main strong{color:var(--accent)}
@media(max-width:760px){.step{grid-template-columns:auto minmax(0,1fr) !important}.step-timer.timer-chip{grid-column:2 !important;justify-self:start;margin-top:8px !important;min-width:78px;padding:8px 10px !important}.floating-timer{left:14px;right:14px;bottom:14px;width:auto}.floating-timer.minimized{left:auto;width:auto}.float-time{font-size:32px}}


/* timer close button instead of collapse */
.floating-timer .float-mini-main{display:none !important}
.floating-timer.minimized{width:min(318px,calc(100vw - 32px)) !important;border-radius:28px !important;padding:14px !important}
.floating-timer.minimized .float-timer-top,.floating-timer.minimized .float-timer-body{display:flex !important}
.floating-timer .float-timer-body{display:grid !important}
.float-close{font-size:18px !important;display:grid !important;place-items:center !important}
.float-close:hover{transform:translateY(-1px)}


/* personal account cabinet in top bar */
.top-auth-status{border:0;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;text-align:center}
.top-auth-status[hidden]{display:none !important}
.top-auth-status:hover,.auth-chip:hover{transform:translateY(-1px)}
.account-panel{display:grid;gap:12px}
.account-hint{margin:0;color:var(--muted);font-size:13px;line-height:1.45;text-align:center}
.account-email{border:0;width:100%;padding:12px 14px;border-radius:18px;background:var(--paper);color:var(--ink);font-weight:850;box-shadow:var(--pressed);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:pointer}
.account-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:2px}
.account-actions .btn{min-width:0;width:100%}
body.dark .account-email{background:linear-gradient(180deg, rgba(18,38,90,.98), rgba(16,32,77,.98)) !important;color:var(--ink)}
#cloudStatus,#backupStatus{text-align:center;line-height:1.35}
@media(max-width:820px){.top-auth-status{display:inline-flex;max-width:154px;height:38px;padding:0 10px;font-size:12px;border-radius:14px}.auth-popover{width:min(360px,calc(100vw - 22px))}}
@media(max-width:560px){.top-auth-status{max-width:120px}.account-actions{grid-template-columns:1fr}.auth-popover{right:-62px}.topbar-actions{gap:7px}.auth-chip{max-width:106px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}}


/* nickname profile settings */
.account-actions .account-wide{grid-column:1 / -1}
.account-settings{display:grid;gap:12px}
.account-info{display:grid;gap:4px;padding:12px 14px;border-radius:18px;background:var(--paper);box-shadow:var(--pressed);text-align:left;min-width:0}
.account-info span,.account-label{color:var(--muted);font-size:12px;font-weight:850;letter-spacing:.01em}
.account-info b{font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--ink)}
.account-label{display:block;text-align:left;margin-bottom:-6px;padding-left:4px}
body.dark .account-info{background:linear-gradient(180deg, rgba(18,38,90,.98), rgba(16,32,77,.98)) !important;color:var(--ink)}
#topCloudNickname[hidden]{display:none !important}
.top-auth-status{max-width:170px;text-decoration:none}
@media(max-width:560px){.top-auth-status{max-width:96px}.account-info b{font-size:12px}.account-actions .account-wide{grid-column:auto}}


/* cleaner auth / cabinet layout */
.auth-form-clean{display:grid;gap:10px}
.auth-form-clean[hidden]{display:none !important}
.auth-mini-hint[hidden]{display:none !important}
.auth-popover-actions.auth-single-action{grid-template-columns:1fr !important;margin-top:4px}
.auth-popover-actions.auth-single-action .btn{width:100%}
.account-settings-card{width:100%;border:0;border-radius:22px;padding:14px 16px;background:var(--paper);box-shadow:var(--pressed);color:var(--ink);display:grid;gap:4px;text-align:left;cursor:pointer;transition:transform .16s ease,box-shadow .16s ease}
.account-settings-card span{color:var(--muted);font-size:12px;font-weight:850;letter-spacing:.01em}
.account-settings-card b{font-size:16px;line-height:1.15;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.account-settings-card small{font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.account-settings-card:active{box-shadow:var(--pressed);transform:translateY(1px) scale(.99)}
body.dark .account-settings-card{background:linear-gradient(180deg, rgba(18,38,90,.98), rgba(16,32,77,.98)) !important;color:var(--ink)}
.account-actions-main{grid-template-columns:1fr !important}
.account-actions-main .btn{min-height:42px}
#cabinetHome{display:grid;gap:12px}
#topAuthForm .input{margin-bottom:0 !important}
@media(max-width:560px){.auth-popover{right:-54px}.account-settings-card b{font-size:15px}}


/* minimal auth forms: only required fields and one submit button */
#topAuthForm{display:grid;gap:10px}
#topAuthForm .auth-popover-actions{margin-top:2px}
#topAuthForm[hidden]{display:none !important}
#topCabinet[hidden]{display:none !important}
#topAuthPanel[data-mode="login"] #topCloudNickname{display:none !important}
#topAuthPanel[data-mode="login"] #topPanelSignUp{display:none !important}
#topAuthPanel[data-mode="register"] #topPanelSignIn{display:none !important}
#topAuthPanel[data-mode="register"] #topCloudNickname{display:block !important}


/* auth error plaques */
.auth-inline-alert{margin-top:10px;padding:10px 12px;border-radius:18px;background:rgba(214,70,70,.10);color:#a83d3d;font-size:12.5px;line-height:1.35;font-weight:850;box-shadow:var(--pressed);text-align:center;animation:authAlertIn .22s ease}
.auth-inline-alert[hidden]{display:none !important}
.auth-inline-alert.success{background:rgba(91,151,105,.12);color:#4e8b63}
body.dark .auth-inline-alert{background:rgba(255,119,119,.13);color:#ffc5c5;box-shadow:inset 7px 7px 14px rgba(0,0,0,.28), inset -7px -7px 14px rgba(67,107,220,.10)}
body.dark .auth-inline-alert.success{background:rgba(119,210,157,.13);color:#c9f5d8}
@keyframes authAlertIn{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}


/* email confirmation resend button */
.auth-resend-btn{width:100%;margin-top:10px;padding:11px 12px;border-radius:16px;background:var(--paper);color:var(--ink);font-size:13px;font-weight:850;box-shadow:var(--softShadow),var(--inner);transition:transform .16s ease,box-shadow .16s ease}
.auth-resend-btn:active{box-shadow:var(--pressed);transform:translateY(1px) scale(.99)}
.auth-resend-btn[hidden]{display:none !important}
body.dark .auth-resend-btn{background:linear-gradient(180deg, rgba(18,38,90,.98), rgba(16,32,77,.98)) !important}



/* meal calendar planner */
.home-planner-row{display:grid;grid-template-columns:minmax(220px,.82fr) minmax(360px,1.18fr);gap:14px;margin-top:12px;align-items:stretch;justify-content:center}
.home-my-card{min-height:344px !important;height:100%;justify-content:center !important;align-items:center;text-align:center;gap:14px;border-radius:34px}
.home-my-card .tab-icon{width:64px;height:64px;border-radius:26px}
.home-my-card b{font:400 28px/1.05 Georgia,"Times New Roman",serif;letter-spacing:-.03em;margin:0;text-align:center}
.home-my-card span{text-align:center;font-size:13px}
.home-calendar-card{min-height:344px;border-radius:34px;padding:18px;display:grid;align-content:start;gap:10px;overflow:hidden}
.home-calendar-top{display:flex;align-items:center;justify-content:space-between;gap:12px;text-align:left}
.home-calendar-top>div:first-child{display:grid;gap:2px;min-width:0}
.home-calendar-top b{font-size:16px;line-height:1.1}.home-calendar-top span{font-size:12px;color:var(--muted);font-weight:800}
.home-calendar-nav{display:flex;gap:8px;flex:0 0 auto}.home-month-btn{width:36px;height:36px;border-radius:15px;font-size:20px}
.home-calendar-card h3{margin:0;font:400 23px/1.05 Georgia,"Times New Roman",serif;letter-spacing:-.03em;text-align:center}
.home-meal-weekdays,.home-meal-grid{gap:5px}.home-meal-weekdays{margin-bottom:0;font-size:10px}.home-meal-grid .meal-day{min-height:36px;border-radius:13px;padding:5px;gap:2px;align-items:center;text-align:center}.home-meal-grid .meal-day-number{font-size:12px}.home-meal-grid .meal-day-dots{width:100%;gap:2px}.home-meal-grid .meal-chip{font-size:0;padding:0;width:6px;height:6px;border-radius:999px;margin:0 auto}.home-meal-grid .meal-more{font-size:9px;padding:0;text-align:center}
.meal-layout{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(320px,.95fr);gap:18px;align-items:start}
.meal-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}
.meal-toolbar h3{margin:0;font:400 27px/1.05 Georgia,"Times New Roman",serif;letter-spacing:-.03em;text-align:center}
.meal-month-btn{width:42px;height:42px;border-radius:17px;background:var(--paper);color:var(--ink);box-shadow:var(--softShadow),var(--inner);font-size:22px;font-weight:800;display:grid;place-items:center;transition:transform .15s ease,box-shadow .15s ease}
.meal-month-btn:active{box-shadow:var(--pressed);transform:scale(.96)}
.meal-weekdays,.meal-calendar-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px}
.meal-weekdays{margin-bottom:8px;color:var(--muted);font-size:12px;font-weight:900;text-align:center;text-transform:uppercase;letter-spacing:.04em}
.meal-day{min-height:92px;border-radius:20px;padding:9px;background:var(--paper);box-shadow:var(--softShadow),var(--inner);color:var(--ink);text-align:left;display:flex;flex-direction:column;gap:6px;position:relative;overflow:hidden;transition:transform .16s ease,box-shadow .16s ease,opacity .16s ease}
.meal-day:active{box-shadow:var(--pressed);transform:translateY(1px) scale(.99)}
.meal-day.other-month{opacity:.42}
.meal-day.today{outline:2px solid var(--gold-ring)}
.meal-day.selected{box-shadow:var(--pressed);outline:2px solid var(--gold)}
.meal-day-number{font-size:14px;font-weight:950;position:relative;z-index:1}
.meal-day-dots{display:grid;gap:4px;position:relative;z-index:1;min-width:0}
.meal-chip{display:block;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;border-radius:999px;padding:4px 7px;background:rgba(201,164,95,.16);color:var(--ink);font-size:10.5px;font-weight:850;line-height:1.1}
.meal-more{color:var(--muted);font-size:10.5px;font-weight:850;padding-left:3px}
.meal-day-panel{display:grid;gap:12px}
.meal-day-panel[hidden]{display:none !important}
.meal-day-sub{margin:-4px 0 2px;color:var(--muted);font-size:13px;line-height:1.4;text-align:center}
.meal-slot{border-radius:22px;background:var(--paper);box-shadow:var(--pressed);padding:12px;display:grid;gap:10px}
.meal-slot-head{display:flex;justify-content:space-between;align-items:center;gap:10px}
.meal-slot-head h4{margin:0;font-size:15px}.meal-slot-head span{font-size:12px;color:var(--muted);font-weight:850}
.meal-picker{display:grid;gap:9px}.meal-search{width:100%;min-height:42px;border:0;border-radius:16px;padding:10px 12px;background:var(--paper);color:var(--ink);box-shadow:var(--pressed);font-size:13px;font-weight:800;outline:none}.meal-pick-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;max-height:254px;overflow:auto;padding:2px 3px 4px;scrollbar-width:thin}.meal-pick-card{min-height:74px;border-radius:18px;padding:10px 11px;background:var(--paper);box-shadow:var(--softShadow),var(--inner);color:var(--ink);display:grid;gap:4px;text-align:left;align-content:start;transition:transform .15s ease,box-shadow .15s ease}.meal-pick-card b{font-size:12.5px;line-height:1.18;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.meal-pick-card span{font-size:10.5px;color:var(--muted);font-weight:850;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.meal-pick-card:active{box-shadow:var(--pressed);transform:translateY(1px) scale(.99)}.meal-picker-note{margin:0;color:var(--muted);font-size:11.5px;line-height:1.35;text-align:center;font-weight:800}.meal-dishes{display:grid;gap:8px}
.meal-dish-row{display:grid;grid-template-columns:minmax(0,1fr) 38px;gap:8px;align-items:center}
.meal-dish-open{min-width:0;border-radius:16px;padding:10px 12px;background:var(--paper);box-shadow:var(--softShadow),var(--inner);color:var(--ink);font-weight:850;text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.meal-dish-open.missing{opacity:.55}
.meal-remove{height:38px;border-radius:15px;background:var(--paper);box-shadow:var(--softShadow),var(--inner);color:var(--muted);font-weight:950;font-size:18px}
.meal-remove:active,.meal-dish-open:active{box-shadow:var(--pressed);transform:translateY(1px)}
.meal-empty{padding:10px 12px;border-radius:16px;color:var(--muted);font-size:12.5px;font-weight:800;background:rgba(255,255,255,.22);text-align:center}
.meal-day-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:2px}
.meal-status{min-height:18px;text-align:center;color:var(--muted);font-size:12px;font-weight:800;line-height:1.35}
body.dark .meal-day,body.dark .meal-month-btn,body.dark .meal-dish-open,body.dark .meal-remove,body.dark .meal-search,body.dark .meal-pick-card{background:linear-gradient(180deg, rgba(33,28,24,.98), rgba(25,21,17,.98))}
body.dark .meal-chip{background:rgba(215,182,109,.16)}
@media(max-width:900px){.home-planner-row{grid-template-columns:1fr;max-width:560px;margin-left:auto;margin-right:auto}.home-my-card{min-height:138px !important}.meal-layout{grid-template-columns:1fr}.meal-day{min-height:78px}.meal-weekdays,.meal-calendar-grid{gap:6px}}
@media(max-width:560px){.home-calendar-card{padding:14px;border-radius:28px}.home-meal-grid .meal-day{min-height:31px;border-radius:11px;padding:4px}.home-my-card b{font-size:24px}.meal-weekdays{font-size:10px}.meal-day{min-height:64px;border-radius:16px;padding:7px}.meal-chip{font-size:9.5px;padding:3px 5px}.meal-more{font-size:9.5px}.meal-toolbar h3{font-size:23px}.meal-pick-grid{grid-template-columns:1fr;max-height:300px}.meal-day-actions{grid-template-columns:1fr}}


/* meal calendar home alignment + type-first dish picker */
.home-planner-row{grid-template-columns:repeat(2,minmax(320px,1fr)) !important;max-width:980px;margin-left:auto!important;margin-right:auto!important;align-items:stretch!important;justify-items:stretch!important}
.home-my-card,.home-calendar-card{min-height:360px!important;height:100%!important;width:100%!important;box-sizing:border-box}
.home-my-card{display:flex!important;flex-direction:column!important;justify-content:center!important}
.home-calendar-card{display:grid!important;grid-template-rows:auto auto auto 1fr;justify-content:stretch!important;text-align:center}
.home-calendar-top{justify-content:space-between;text-align:center}.home-calendar-top>div:first-child{align-items:center;text-align:center}.home-calendar-nav{justify-content:center}
.meal-type-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.meal-type-card{min-height:68px;border-radius:18px;padding:11px 12px;background:var(--paper);box-shadow:var(--softShadow),var(--inner);color:var(--ink);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:4px;transition:transform .15s ease,box-shadow .15s ease}
.meal-type-card b{font-size:13.5px;line-height:1.15}.meal-type-card span{font-size:11px;color:var(--muted);font-weight:850}.meal-type-card:active{box-shadow:var(--pressed);transform:translateY(1px) scale(.99)}
.meal-picker-modal{position:fixed;inset:0;z-index:70;display:grid;place-items:center;padding:18px;background:rgba(35,25,20,.22);backdrop-filter:blur(10px);animation:mealPickerFade .18s ease}
.meal-picker-modal[hidden]{display:none!important}
.meal-picker-dialog{width:min(680px,calc(100vw - 28px));max-height:min(78vh,760px);border-radius:32px;background:var(--paper);box-shadow:var(--shadow),var(--inner);display:grid;grid-template-rows:auto minmax(0,1fr);overflow:hidden;color:var(--ink)}
.meal-picker-head{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:18px 18px 14px;border-bottom:1px solid rgba(255,255,255,.32)}
.meal-picker-head span{display:block;font-size:12px;color:var(--muted);font-weight:900;text-align:left}.meal-picker-head h3{margin:2px 0 0;font:400 28px/1.05 Georgia,"Times New Roman",serif;letter-spacing:-.03em;text-align:left}
.meal-picker-body{min-height:0;display:grid;grid-template-rows:auto minmax(0,1fr) auto;gap:10px;padding:14px 16px 16px}.meal-pick-grid-modal{max-height:none;min-height:0;padding:4px;grid-template-columns:repeat(2,minmax(0,1fr))}.meal-pick-grid-modal .meal-pick-card{min-height:82px}
body.dark .meal-picker-modal{background:rgba(3,10,28,.42)}body.dark .meal-picker-dialog,body.dark .meal-type-card{background:linear-gradient(180deg, rgba(18,38,90,.98), rgba(16,32,77,.98))!important}
@keyframes mealPickerFade{from{opacity:0}to{opacity:1}}
@media(max-width:900px){.home-planner-row{grid-template-columns:1fr!important;max-width:620px}.home-my-card,.home-calendar-card{min-height:180px!important}.home-calendar-card{min-height:360px!important}}
@media(max-width:560px){.home-planner-row{grid-template-columns:1fr!important}.meal-type-grid,.meal-pick-grid-modal{grid-template-columns:1fr}.meal-picker-dialog{border-radius:28px;max-height:82vh}.meal-picker-head h3{font-size:24px}}


/* meal calendar country-first picker and edit mode */
.meal-day-actions{grid-template-columns:repeat(3,minmax(0,1fr))!important}
.meal-edit-zone[hidden]{display:none!important}
.meal-dish-row.view{grid-template-columns:minmax(0,1fr)!important}
.meal-saved-list{display:grid;gap:7px;margin-top:1px}
.meal-saved-link{width:100%;min-width:0;border-radius:16px;padding:10px 12px;background:var(--paper);box-shadow:var(--softShadow),var(--inner);color:var(--ink);font-weight:900;text-align:left;display:grid;gap:2px;line-height:1.2;transition:transform .15s ease,box-shadow .15s ease}
.meal-saved-link span{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.meal-saved-link small{display:block;color:var(--muted);font-size:10.5px;font-weight:850;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.meal-saved-link:active{box-shadow:var(--pressed);transform:translateY(1px)}
.meal-saved-link.missing{opacity:.55;pointer-events:none}
body.dark .meal-saved-link{background:linear-gradient(180deg, rgba(33,28,24,.98), rgba(25,21,17,.98))}

.meal-country-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;overflow:auto;padding:4px;scrollbar-width:thin}
.meal-country-card{min-height:72px;border-radius:19px;padding:12px;background:var(--paper);box-shadow:var(--softShadow),var(--inner);color:var(--ink);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;text-align:center;transition:transform .15s ease,box-shadow .15s ease}
.meal-country-card b{font-size:14px;line-height:1.15}.meal-country-card span{font-size:11px;color:var(--muted);font-weight:850}.meal-country-card:active{box-shadow:var(--pressed);transform:translateY(1px) scale(.99)}
.meal-picker-back{justify-self:start;border:0;border-radius:16px;padding:10px 13px;background:var(--paper);box-shadow:var(--softShadow),var(--inner);color:var(--ink);font-size:12px;font-weight:900}.meal-picker-back:active{box-shadow:var(--pressed);transform:translateY(1px)}.meal-picker-back[hidden],.meal-search[hidden]{display:none!important}
body.dark .meal-country-card,body.dark .meal-picker-back{background:linear-gradient(180deg, rgba(18,38,90,.98), rgba(16,32,77,.98))!important}
@media(max-width:560px){.meal-day-actions{grid-template-columns:1fr!important}.meal-country-grid{grid-template-columns:1fr}}


/* desktop readability polish: unified font, centered UI text, safe wrapping */
:root{--ui-font:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif}
body,button,input,select,textarea,
.brand-title strong,.hero h1,.section-title h2,.cat-line h2,
.country-card h3,.country-head h1,.custom-head h1,
.meal-toolbar h3,.dialog h2,.panel h3,.recipe-card h3,.my-item h3{
  font-family:var(--ui-font) !important;
  letter-spacing:-.015em;
}
body{font-weight:500;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}
#home,#country,#myview,#mealview,
.hero,.section-title,.country-head,.custom-head,.country-meta,
.country-card,.tab-card,.cat-tile,.recipe-card,.panel,.stat,.my-item,
.meal-toolbar,.meal-day-panel,.meal-slot,.meal-slot-head,
.auth-popover,.account-panel,.account-settings,.dialog-title,
.empty-box,.kbju-preview,.meal-status,.cloud-status{
  text-align:center;
}
.hero,.hero h1,.lead,.kicker,
.section-title h2,.section-title p,.cat-line h2,
.country-card h3,.country-card p,.country-bottom,
.tab-card b,.tab-card span,.cat-tile b,.cat-tile span,
.recipe-card h3,.recipe-card p,.recipe-card .tags,
.country-head h1,.country-head p,.custom-head h1,.custom-head p,
.panel h3,.my-item h3,.meal-toolbar h3,.meal-day-sub,
.meal-chip,.meal-more,.pill,.btn,.back-btn,.auth-chip,.top-auth-status,
.meal-dish-open,.meal-picker-card,.meal-step-card,.meal-country-card,.meal-recipe-card{
  overflow-wrap:anywhere;
  word-break:normal;
  hyphens:auto;
  white-space:normal;
}
.hero{place-items:center;align-items:center;justify-items:center}
.hero h1,.lead{max-width:860px;margin-left:auto;margin-right:auto;text-align:center}
.stats{justify-content:center}.stat{display:grid;place-items:center;align-content:center}
.country-grid,.tab-grid,.category-choice,.recipe-grid,.my-list,.meal-picker-grid,.meal-country-grid,.meal-recipe-grid{justify-items:stretch}
.country-card,.tab-card,.cat-tile,.recipe-card,.my-item{
  align-items:center;
  justify-content:center;
}
.tab-card{gap:10px;text-align:center}.tab-card>div:last-child{justify-items:center;align-items:center;width:100%}
.tab-card b,.tab-card span,.cat-tile b,.cat-tile span,.recipe-card h3,.recipe-card p{display:block;width:100%;text-align:center}
.cat-tile{align-items:center;text-align:center}.cat-icon,.tab-icon,.cemoji,.dish-icon{margin-left:auto;margin-right:auto}
.recipe-card{display:flex;flex-direction:column;text-align:center}.recipe-card .tags{justify-content:center}.recipe-card .recipe-bottom,.recipe-card .recipe-meta{justify-content:center;text-align:center;flex-wrap:wrap}
.panel{display:grid;justify-items:center}.panel>*{max-width:100%}.field-grid,.kbju-grid,.form-layout{width:100%}
.meal-day{align-items:center;text-align:center}.meal-day-dots{width:100%;justify-items:center}.meal-chip{max-width:100%;text-align:center}
.meal-slot{justify-items:center}.meal-slot-head{justify-content:center;flex-direction:column}.meal-dishes{width:100%}.meal-dish-row{width:100%}.meal-dish-open{text-align:center}
.dialog-title{justify-content:center}.dialog-title>div{display:grid;justify-items:center;width:100%}
.dialog-body h3,.dialog-body h4,.dialog-body p,.dialog-body .tags{text-align:center;justify-content:center}
.dialog-body ul,.dialog-body ol,.dialog-body li{text-align:left;overflow-wrap:anywhere;hyphens:auto}
.input,.select,textarea{text-align:center}
@media(min-width:821px){
  .page{padding-left:28px;padding-right:28px}
  .country-card,.tab-card,.cat-tile,.recipe-card{min-width:0}
  .country-card h3{font-size:clamp(22px,2.1vw,30px);line-height:1.12}
  .recipe-card h3{font-size:clamp(18px,1.45vw,22px);line-height:1.22}
  .tab-card b,.cat-tile b{font-size:clamp(15px,1.15vw,18px);line-height:1.22}
  .tab-card span,.cat-tile span,.recipe-card p,.country-card p{line-height:1.45}
  .country-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .tab-grid{grid-template-columns:repeat(2,minmax(220px,360px));justify-content:center;align-items:stretch}
  #myRecipesCard,#mealCalendarCard{min-height:128px;height:100%;justify-content:center;align-items:center;padding:18px}
  .category-choice{grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media(max-width:820px){
  .tab-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:560px){
  .tab-grid{grid-template-columns:1fr}
  .hero h1,.country-head h1,.custom-head h1{text-align:center}
}



/* refined desktop spacing + elegant liquid glass finish */
:root{
  --liquid-border:rgba(201,164,95,.38);
  --liquid-border-soft:rgba(234,210,154,.24);
  --liquid-bg:linear-gradient(145deg,rgba(255,255,255,.42),rgba(255,248,238,.18) 46%,rgba(235,224,210,.34));
  --liquid-glow:0 22px 46px rgba(143,118,91,.16), inset 0 1px 0 rgba(255,255,255,.72), inset 0 -1px 0 rgba(181,139,92,.08);
  --ui-font:"Avenir Next","Optima","Segoe UI",system-ui,-apple-system,BlinkMacSystemFont,sans-serif;
  --title-font:"Georgia","Times New Roman",serif;
}
body.dark{
  --liquid-border:rgba(224,229,236,.32);
  --liquid-border-soft:rgba(255,255,255,.12);
  --liquid-bg:linear-gradient(145deg,rgba(255,255,255,.075),rgba(31,35,42,.36) 48%,rgba(8,10,13,.38));
  --liquid-glow:0 22px 46px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.12), inset 0 -1px 0 rgba(255,255,255,.035);
}
body,button,input,select,textarea{
  font-family:var(--ui-font) !important;
  font-weight:360;
  letter-spacing:.005em;
  -webkit-font-smoothing:antialiased;
  text-rendering:geometricPrecision;
}
body{line-height:1.55;color:var(--ink)}
h1,h2,h3,.site-title,.hero h1,.section-title h2,.cat-line h2,.country-head h1,.custom-head h1,#mealDayTitle,#mealMonthTitle,#homeMealMonthTitle{
  font-family:var(--title-font) !important;
  font-weight:400 !important;
  letter-spacing:.015em;
}
strong,b,.btn,.auth-chip,.pill,.meal-chip,.recipe-card h3,.country-card b,.tab-card b,.cat-tile b{font-weight:600 !important}
p,.lead,.section-title p,.country-card p,.recipe-card p,.custom-head p,.country-head p,.meal-day-sub{font-weight:340;letter-spacing:.01em}
.page{padding-top:34px;padding-bottom:88px}
.view.active{display:block}
.hero,.country-head,.custom-head{margin-bottom:34px}
.section-title{margin:42px 0 22px}
.country-grid,.recipe-grid,.category-choice,.tab-grid,.my-list,.meal-type-grid,.meal-country-grid,.meal-dish-grid{gap:22px !important}
.home-planner-row,.form-layout,.meal-layout{gap:26px !important;margin-top:10px}
.cat-line{margin:34px 0 18px}
.hero,.country-card,.tab-card,.cat-tile,.recipe-card,.panel,.dialog,.country-head,.custom-head,.stat,.my-item,.meal-day,.meal-slot,.account-settings-card,.auth-popover,.account-info,.input,.select,textarea,.btn,.auth-chip,.theme-btn,.meal-month-btn,.meal-dish-open,.meal-remove{
  border:1px solid var(--liquid-border) !important;
  background:var(--liquid-bg),var(--paper) !important;
  box-shadow:var(--liquid-glow),var(--softShadow) !important;
  backdrop-filter:blur(22px) saturate(1.22);
  -webkit-backdrop-filter:blur(22px) saturate(1.22);
}
.topbar{
  background:linear-gradient(135deg,rgba(255,255,255,.42),rgba(255,245,232,.18)),var(--backdrop) !important;
  border-bottom:1px solid var(--liquid-border) !important;
  box-shadow:0 14px 34px rgba(132,105,72,.10),inset 0 -1px 0 var(--liquid-border-soft);
  backdrop-filter:blur(24px) saturate(1.32);
  -webkit-backdrop-filter:blur(24px) saturate(1.32);
}
body.dark .topbar{background:linear-gradient(135deg,rgba(255,255,255,.08),rgba(12,14,18,.38)),var(--backdrop) !important;box-shadow:0 14px 34px rgba(0,0,0,.28),inset 0 -1px 0 var(--liquid-border-soft)}
.topbar-inner{padding-top:12px;padding-bottom:12px}
.site-title{letter-spacing:.075em;font-size:clamp(30px,3.4vw,42px);color:var(--ink)}
.hero{min-height:232px;padding:34px;border-radius:32px}
.hero:before{inset:18px;border-radius:26px;opacity:.78}
.hero h1{font-size:clamp(38px,5.8vw,62px);line-height:.96;max-width:none;text-align:center;margin-left:auto;margin-right:auto}
.hero .lead,.hero .kicker{text-align:center;margin-left:auto;margin-right:auto}
.stats{justify-content:center;gap:16px;margin-top:24px}
.stat{min-width:98px;padding:10px 14px;border-radius:19px;text-align:center}
.country-card,.recipe-card,.cat-tile,.tab-card,.my-item{border-radius:24px;padding:18px;text-align:center;align-items:center;justify-content:center}
.country-card{min-height:178px}
.recipe-card{min-height:0;padding:18px 16px}
.recipe-card h3,.country-card b,.cat-tile b,.tab-card b{line-height:1.22;text-wrap:balance;overflow-wrap:anywhere;hyphens:auto;text-align:center}
.recipe-card p,.country-card p,.cat-tile span,.tab-card span{text-align:center;text-wrap:pretty;overflow-wrap:anywhere;hyphens:auto}
.panel{border-radius:28px;padding:22px}
.home-calendar-card{padding:22px !important}
.meal-day{min-height:82px;border-radius:18px;padding:8px;text-align:center;align-items:center}
.meal-chip{max-width:100%;text-align:center}
.meal-slot{border-radius:21px;padding:13px}
.meal-day-actions{gap:14px;margin-top:8px}
.btn{min-height:42px;border-radius:17px;padding:10px 16px;letter-spacing:.02em}
.input,.select,textarea{border-radius:18px;font-weight:360;line-height:1.45}
.dialog{border-radius:32px}
.dialog-body{font-weight:360;line-height:1.62}
.ingredients li,.steps li{text-align:left;line-height:1.6}
@media(min-width:900px){
  .page{padding-left:24px;padding-right:24px}
  .country-grid{grid-template-columns:repeat(3,minmax(220px,1fr));gap:24px !important}
  .recipe-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px !important}
  .category-choice{gap:20px !important}
  .home-planner-row{align-items:start}
}
@media(max-width:820px){
  .page{padding-top:24px}
  .section-title{margin:32px 0 18px}
  .hero,.country-head,.custom-head{margin-bottom:24px}
  .country-grid,.recipe-grid,.category-choice,.tab-grid,.home-planner-row,.form-layout,.meal-layout{gap:16px !important}
  .panel{padding:18px}
  .site-title{font-size:clamp(24px,6vw,34px)}
}
@media(max-width:560px){
  .page{padding-left:14px;padding-right:14px}
  .hero{padding:26px 18px;min-height:210px}
  .country-card,.recipe-card,.cat-tile,.tab-card,.my-item{padding:16px}
  .site-title{max-width:42vw}
}



/* recipe checklist readability: left aligned text with checkbox indent */
.dialog-body .steps,.dialog-body .step{text-align:left}
.dialog-body .checkline{display:grid;grid-template-columns:22px minmax(0,1fr);gap:0 14px;align-items:start;text-align:left}
.dialog-body .checkline input{margin:4px 0 0 0;justify-self:start}
.dialog-body .checkline span{display:block;text-align:left;line-height:1.58;overflow-wrap:anywhere;word-break:normal}
.dialog-body .step-timer{grid-column:2;text-align:left}
.dialog-body .ingredients li{text-align:left;align-items:flex-start}
.dialog-body .ingredients li span:first-child{text-align:left}


/* recipe step left alignment patch */
.step{text-align:left}
.checkline{justify-content:flex-start;text-align:left;align-items:flex-start;gap:12px}
.checkline input{margin-top:4px;flex:0 0 18px}
.checkline span{display:block;text-align:left;padding-left:2px;line-height:1.58;overflow-wrap:anywhere;word-break:normal}



/* compact My Recipes list layout */
#custom .my-list{
  width:100%;
  display:grid;
  gap:10px !important;
  justify-items:stretch;
}
#custom .my-item{
  width:100%;
  min-height:0 !important;
  padding:11px 12px !important;
  border-radius:18px !important;
  text-align:left !important;
}
#custom .my-item-top{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:start;
  gap:10px 12px;
  width:100%;
}
#custom .my-item-main{
  min-width:0;
  width:100%;
}
#custom .my-item h4{
  margin:0 0 6px !important;
  font-size:clamp(15px,1.2vw,17px) !important;
  line-height:1.2 !important;
  letter-spacing:.01em;
  text-align:left !important;
  overflow-wrap:anywhere;
  text-wrap:balance;
}
#custom .mini-meta{
  display:flex;
  gap:5px;
  flex-wrap:wrap;
  align-items:center;
  font-size:11px !important;
  line-height:1.15;
  color:var(--muted);
  text-align:left;
}
#custom .mini-meta span{
  padding:4px 7px !important;
  border-radius:999px !important;
  box-shadow:var(--pressed) !important;
  max-width:100%;
}
#custom .mini-kbju{
  display:flex !important;
  flex-wrap:wrap;
  gap:6px !important;
  margin-top:8px !important;
  align-items:stretch;
}
#custom .mini-kbju span{
  min-width:78px;
  flex:0 1 auto;
  padding:6px 8px !important;
  border-radius:13px !important;
  text-align:left !important;
  gap:1px !important;
}
#custom .mini-kbju b{
  font-size:13px !important;
  line-height:1.05 !important;
  font-weight:650 !important;
}
#custom .mini-kbju em{
  font-size:10px !important;
  line-height:1.1 !important;
}
#custom .row-actions{
  margin:0 !important;
  display:flex !important;
  flex-wrap:nowrap;
  gap:5px !important;
  align-items:center;
  justify-content:flex-end;
  align-self:start;
  max-width:100%;
}
#custom .row-actions .btn{
  min-height:30px !important;
  height:30px;
  padding:0 9px !important;
  border-radius:12px !important;
  font-size:11px !important;
  line-height:1 !important;
  font-weight:560 !important;
  letter-spacing:.01em;
  white-space:nowrap;
  box-shadow:inset 1px 1px 0 rgba(255,255,255,.45), 4px 4px 10px rgba(153,133,114,.12), -4px -4px 10px rgba(255,255,255,.42) !important;
}
body.dark #custom .row-actions .btn{
  box-shadow:inset 1px 1px 0 rgba(255,255,255,.08), 4px 4px 10px rgba(0,0,0,.24), -4px -4px 10px rgba(65,55,48,.08) !important;
}
#custom .row-actions .btn.ghost{
  color:var(--muted);
}
@media(max-width:760px){
  #custom .my-item-top{grid-template-columns:1fr;gap:8px}
  #custom .row-actions{justify-content:flex-start;flex-wrap:wrap}
  #custom .row-actions .btn{height:30px;min-height:30px;flex:0 0 auto}
}

/* top frame real app icon + compact account button */
.brand-mark .brand-app-icon{width:100%;height:100%;object-fit:cover;border-radius:inherit;display:block;position:relative;z-index:1}
@media(max-width:820px){.top-auth-status{display:inline-flex !important;align-items:center !important;justify-content:center !important;height:34px !important;max-width:86px !important;padding:0 10px !important;border-radius:999px !important;font-size:11px !important;line-height:1 !important;white-space:nowrap !important;overflow:hidden !important;text-overflow:ellipsis !important}}
@media(max-width:560px){.top-auth-status{height:30px !important;max-width:58px !important;padding:0 7px !important;font-size:10px !important}.topbar-actions{gap:5px !important}.top-auth{gap:5px !important}.auth-chip{height:32px !important;padding:0 8px !important;font-size:11px !important}.theme-btn{width:38px !important;height:38px !important}.site-title{max-width:38vw !important}}



/* calendar side navigation refinement */
.meal-layout>.panel:first-child{
  position:relative;
  min-height:560px;
  padding:28px 72px 30px !important;
  overflow:hidden;
}
.meal-layout>.panel:first-child .meal-toolbar{
  display:grid;
  grid-template-columns:1fr;
  justify-items:center;
  align-items:center;
  margin:0 0 20px;
  min-height:48px;
}
.meal-layout>.panel:first-child .meal-toolbar h3{
  font-size:clamp(28px,3vw,38px);
  letter-spacing:.035em;
  text-align:center;
}
.meal-layout>.panel:first-child .meal-month-btn,
.home-calendar-card .home-month-btn{
  border:1px solid var(--liquid-border) !important;
  background:linear-gradient(145deg,rgba(255,255,255,.48),rgba(255,248,238,.18)),var(--paper) !important;
  color:var(--ink);
  box-shadow:inset 1px 1px 0 rgba(255,255,255,.72),0 12px 26px rgba(143,118,91,.16) !important;
  font-family:Georgia,"Times New Roman",serif !important;
  font-weight:400 !important;
  line-height:1;
}
body.dark .meal-layout>.panel:first-child .meal-month-btn,
body.dark .home-calendar-card .home-month-btn{
  border-color:rgba(224,229,236,.34) !important;
  background:linear-gradient(145deg,rgba(255,255,255,.08),rgba(18,21,27,.46)),var(--paper) !important;
  box-shadow:inset 1px 1px 0 rgba(255,255,255,.12),0 12px 26px rgba(0,0,0,.34) !important;
}
.meal-layout>.panel:first-child #mealPrevMonth,
.meal-layout>.panel:first-child #mealNextMonth{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  width:52px;
  height:86px;
  border-radius:26px;
  font-size:34px;
  z-index:3;
}
.meal-layout>.panel:first-child #mealPrevMonth{left:14px}
.meal-layout>.panel:first-child #mealNextMonth{right:14px}
.meal-layout>.panel:first-child #mealPrevMonth:active,
.meal-layout>.panel:first-child #mealNextMonth:active{
  transform:translateY(-50%) scale(.96);
}
.meal-layout>.panel:first-child .meal-weekdays,
.meal-layout>.panel:first-child .meal-calendar-grid{
  gap:10px;
}
.meal-layout>.panel:first-child .meal-day{
  min-height:92px;
  border-radius:22px;
  padding:10px;
}
.home-calendar-card{
  position:relative;
  min-height:420px !important;
  padding:24px 58px 26px !important;
}
.home-calendar-card .home-calendar-top{
  justify-content:center;
  min-height:42px;
}
.home-calendar-card .home-calendar-nav{
  position:absolute;
  left:14px;
  right:14px;
  top:50%;
  transform:translateY(-50%);
  display:flex;
  justify-content:space-between;
  pointer-events:none;
  z-index:3;
}
.home-calendar-card .home-month-btn{
  pointer-events:auto;
  width:42px;
  height:72px;
  border-radius:22px;
  font-size:28px;
}
.home-calendar-card h3{
  font-size:clamp(25px,2.4vw,32px) !important;
  margin-bottom:4px !important;
}
.home-meal-grid .meal-day{
  min-height:46px;
  border-radius:14px;
  padding:5px;
}
.home-meal-weekdays,.home-meal-grid{
  gap:7px !important;
}
@media(max-width:900px){
  .meal-layout>.panel:first-child{min-height:500px;padding:24px 54px 26px !important}
  .meal-layout>.panel:first-child #mealPrevMonth,.meal-layout>.panel:first-child #mealNextMonth{width:42px;height:74px;border-radius:22px;font-size:30px}
  .meal-layout>.panel:first-child #mealPrevMonth{left:8px}.meal-layout>.panel:first-child #mealNextMonth{right:8px}
  .meal-layout>.panel:first-child .meal-day{min-height:78px}
  .home-calendar-card{padding-left:48px !important;padding-right:48px !important}
}
@media(max-width:560px){
  .meal-layout>.panel:first-child{min-height:420px;padding:20px 38px 22px !important}
  .meal-layout>.panel:first-child .meal-toolbar h3{font-size:24px}
  .meal-layout>.panel:first-child #mealPrevMonth,.meal-layout>.panel:first-child #mealNextMonth{width:32px;height:60px;border-radius:17px;font-size:24px}
  .meal-layout>.panel:first-child #mealPrevMonth{left:4px}.meal-layout>.panel:first-child #mealNextMonth{right:4px}
  .meal-layout>.panel:first-child .meal-weekdays,.meal-layout>.panel:first-child .meal-calendar-grid{gap:5px}
  .meal-layout>.panel:first-child .meal-day{min-height:58px;border-radius:15px;padding:6px}
  .home-calendar-card{min-height:380px !important;padding:18px 38px 20px !important}
  .home-calendar-card .home-calendar-nav{left:6px;right:6px}
  .home-calendar-card .home-month-btn{width:32px;height:58px;border-radius:17px;font-size:23px}
  .home-meal-grid .meal-day{min-height:38px;border-radius:12px;padding:4px}
}


/* calendar layout stability patch: no sagging/jank while switching months */
.meal-layout>.panel:first-child,
.home-calendar-card{
  contain:layout paint;
  isolation:isolate;
  will-change:auto;
}
.meal-layout>.panel:first-child{
  display:grid !important;
  grid-template-rows:auto auto minmax(0,1fr) !important;
  align-content:start !important;
}
.meal-layout>.panel:first-child .meal-toolbar,
.home-calendar-card .home-calendar-top,
.home-calendar-card h3{
  flex-shrink:0;
}
.meal-layout>.panel:first-child .meal-calendar-grid{
  grid-template-rows:repeat(6,minmax(92px,1fr)) !important;
  min-height:602px;
  align-self:stretch;
}
.home-calendar-card{
  grid-template-rows:42px auto auto minmax(311px,1fr) !important;
  align-content:start !important;
}
.home-meal-grid{
  grid-template-rows:repeat(6,46px) !important;
  min-height:311px;
  align-self:stretch;
}
.meal-calendar-grid,
.home-meal-grid{
  contain:layout paint;
  transform:translateZ(0);
  backface-visibility:hidden;
}
.meal-calendar-grid .meal-day,
.home-meal-grid .meal-day{
  height:100%;
  min-height:0 !important;
  transform:translateZ(0);
  backface-visibility:hidden;
}
.meal-calendar-switching .meal-calendar-grid,
.meal-calendar-switching .home-meal-grid{
  pointer-events:none;
}
.meal-calendar-switching .meal-day{
  transition:none !important;
}
.home-calendar-card .home-month-btn,
.meal-layout>.panel:first-child .meal-month-btn{
  -webkit-tap-highlight-color:transparent;
}
@media(max-width:900px){
  .meal-layout>.panel:first-child .meal-calendar-grid{grid-template-rows:repeat(6,78px) !important;min-height:498px}
  .home-calendar-card{grid-template-rows:42px auto auto minmax(311px,1fr) !important;min-height:420px !important}
  .home-meal-grid{grid-template-rows:repeat(6,46px) !important;min-height:311px}
}
@media(max-width:560px){
  .meal-layout>.panel:first-child{min-height:438px !important}
  .meal-layout>.panel:first-child .meal-calendar-grid{grid-template-rows:repeat(6,58px) !important;min-height:373px}
  .home-calendar-card{grid-template-rows:38px auto auto minmax(258px,1fr) !important;min-height:372px !important}
  .home-meal-grid{grid-template-rows:repeat(6,38px) !important;min-height:258px}
}




/* compact and lightweight meal calendar */
.home-planner-row{
  max-width:900px !important;
  grid-template-columns:minmax(250px,.88fr) minmax(320px,.92fr) !important;
  align-items:center !important;
  justify-content:center !important;
}
.home-calendar-card{
  width:min(100%,430px) !important;
  min-height:318px !important;
  height:auto !important;
  justify-self:center !important;
  align-self:center !important;
  padding:18px 44px 20px !important;
  grid-template-rows:34px auto auto auto !important;
  gap:7px !important;
  contain:layout paint style;
}
.home-my-card{min-height:318px !important;height:auto !important;align-self:center !important}
.home-calendar-card .home-calendar-top{min-height:32px !important;justify-content:center !important}
.home-calendar-card h3{font-size:clamp(22px,2.1vw,28px) !important;margin:0 !important;line-height:1.08 !important}
.home-meal-weekdays,.home-meal-grid{gap:4px !important;width:100%;max-width:320px;margin-left:auto;margin-right:auto}
.home-meal-weekdays{font-size:9.5px !important;letter-spacing:.03em !important}
.home-meal-grid{grid-template-rows:repeat(6,34px) !important;min-height:224px !important;align-self:center !important}
.home-meal-grid .meal-day{min-height:0 !important;height:34px !important;border-radius:11px !important;padding:3px !important;gap:1px !important;box-shadow:inset 1px 1px 0 rgba(255,255,255,.44),0 5px 11px rgba(143,118,91,.10) !important}
.home-meal-grid .meal-day-number{font-size:11px !important;line-height:1.05 !important}
.home-meal-grid .meal-day-dots{gap:1px !important;min-height:6px}
.home-meal-grid .meal-chip{width:5px !important;height:5px !important;padding:0 !important;box-shadow:none !important}
.home-meal-grid .meal-more{font-size:8.5px !important;line-height:1 !important}
.home-calendar-card .home-calendar-nav{left:9px !important;right:9px !important}
.home-calendar-card .home-month-btn{width:30px !important;height:52px !important;border-radius:16px !important;font-size:22px !important}
.meal-calendar-grid,.home-meal-grid{content-visibility:auto;contain-intrinsic-size:320px 224px}
.meal-calendar-switching .meal-day{transition:none !important;animation:none !important}
@media(max-width:900px){
  .home-planner-row{max-width:520px !important;grid-template-columns:1fr !important}
  .home-my-card{min-height:152px !important}
  .home-calendar-card{width:min(100%,410px) !important;min-height:304px !important;padding:16px 38px 18px !important}
  .home-meal-grid{grid-template-rows:repeat(6,32px) !important;min-height:212px !important;max-width:300px}
  .home-meal-grid .meal-day{height:32px !important}
}
@media(max-width:560px){
  .home-calendar-card{width:100% !important;min-height:286px !important;padding:14px 34px 16px !important;border-radius:24px !important}
  .home-meal-weekdays,.home-meal-grid{max-width:280px;gap:3px !important}
  .home-meal-grid{grid-template-rows:repeat(6,29px) !important;min-height:191px !important}
  .home-meal-grid .meal-day{height:29px !important;border-radius:10px !important;padding:2px !important}
  .home-meal-grid .meal-day-number{font-size:10px !important}
  .home-calendar-card .home-month-btn{width:27px !important;height:46px !important;border-radius:14px !important;font-size:20px !important}
  .home-calendar-card .home-calendar-nav{left:5px !important;right:5px !important}
}


/* account cabinet: automatic sync only */
.account-actions-auto{justify-content:center !important}
.account-actions-auto .account-wide{width:100%;max-width:220px;margin:0 auto}
#cloudStatus{line-height:1.45}



/* My recipes 2.0: category library + compact editor */
:root{--app-font-size:15px;--app-line:1.52;--app-small:12.5px;--app-title-size:clamp(28px,3.2vw,42px)}
body,button,input,select,textarea{font-size:var(--app-font-size);line-height:var(--app-line)}
p,.lead,.section-title p,.country-card p,.recipe-card p,.custom-head p,.country-head p,.meal-day-sub,.mini-meta,.kbju-per-serving{font-size:13.5px;line-height:1.5}
.btn,.auth-chip,.pill,.top-auth-status{font-size:13px;line-height:1.15}
h1,.hero h1,.country-head h1,.custom-head h1{font-size:var(--app-title-size) !important;line-height:1.03 !important;letter-spacing:.01em !important}
h2,.section-title h2,.cat-line h2{font-size:clamp(24px,2.35vw,32px) !important;line-height:1.08 !important}
h3,.panel h3{font-size:clamp(20px,1.55vw,24px);line-height:1.15}
.my-library{display:grid;gap:18px}.my-section-title{margin-top:16px}.my-category-choice{margin-top:4px}.my-cat-control{margin:8px 0 4px}.my-create-btn{min-width:128px}.my-editor-wrap{display:block;max-width:980px;margin:0 auto}.my-editor-panel{width:100%;justify-items:stretch !important}.my-editor-head{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;margin-bottom:18px;text-align:left}.my-editor-head h3{margin:0 0 6px}.my-editor-head p{margin:0;color:var(--muted);font-size:13px}.my-editor-close{flex:0 0 auto}.product-calc{display:grid;gap:12px;margin-top:18px;padding:16px;border-radius:22px;border:1px solid var(--liquid-border);background:var(--liquid-bg),var(--paper);box-shadow:var(--liquid-glow),var(--pressed)}.product-calc-head{display:flex;justify-content:space-between;gap:14px;align-items:flex-start;text-align:left}.product-calc h4{margin:0 0 4px;font-size:18px;font-weight:600}.product-calc p{margin:0;color:var(--muted);font-size:12.8px}.compact-btn{min-height:36px;padding:8px 12px;border-radius:14px}.product-head,.product-row{display:grid;grid-template-columns:minmax(150px,1.25fr) minmax(160px,.95fr) .68fr .55fr .55fr .55fr 34px;gap:8px;align-items:center}.product-head{font-size:10px;text-transform:uppercase;letter-spacing:.055em;color:var(--muted);padding:0 8px}.product-row .input,.product-row .select{min-height:38px;padding:9px 10px;border-radius:14px;text-align:center}.product-row [data-prod="name"]{text-align:left}.product-quantity{display:grid;grid-template-columns:minmax(62px,1fr) minmax(72px,.9fr);gap:6px;align-items:center}.product-quantity small{grid-column:1 / -1;min-height:14px;font-size:10.5px;line-height:1.25;color:var(--muted);text-align:center}.product-quantity small.missing{color:#a46458}.product-remove{width:34px;height:34px;border-radius:13px;background:var(--paper);color:var(--muted);box-shadow:var(--softShadow),var(--inner);font-size:18px;line-height:1}.manual-kbju{margin-top:14px;border-radius:20px;background:var(--paper);box-shadow:var(--pressed);padding:12px 14px}.manual-kbju summary{cursor:pointer;color:var(--muted);font-size:13px;font-weight:600;text-align:center}.manual-kbju[open] summary{margin-bottom:12px}.kbju-source{font-size:12px;color:var(--muted);margin-bottom:8px;text-align:center}.my-list-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px}.my-item-compact{padding:13px !important;border-radius:20px !important;min-height:0}.my-item-compact .my-item-top{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:start}.my-item-compact h4{font-size:17px;line-height:1.2;margin:0 0 8px;text-align:left;overflow-wrap:anywhere}.my-item-compact .mini-meta{gap:5px}.my-item-compact .mini-meta span{padding:5px 8px;border-radius:999px;font-size:11.5px}.compact-kbju{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin-top:10px}.compact-kbju span{padding:7px 8px;border-radius:14px;text-align:center}.compact-kbju b{font-size:13px}.compact-kbju em{font-size:10.5px}.compact-actions{margin-top:0;display:grid;grid-template-columns:1fr;gap:6px;min-width:84px}.compact-actions .btn{min-height:30px;padding:7px 9px;border-radius:12px;font-size:11.5px;white-space:nowrap}.danger-btn{opacity:.82}.empty-box{width:100%;text-align:center;padding:22px;border-radius:24px;background:var(--liquid-bg),var(--paper);border:1px solid var(--liquid-border);box-shadow:var(--liquid-glow),var(--softShadow);color:var(--muted)}
.finished-weight-field{display:grid;grid-template-columns:minmax(0,1fr) minmax(150px,220px);gap:14px;align-items:center;padding:12px 14px;border-radius:18px;background:var(--paper);box-shadow:var(--pressed);text-align:left}.finished-weight-field>span{display:grid;gap:3px}.finished-weight-field b{font-size:13px;font-weight:600;color:var(--ink)}.finished-weight-field small{font-size:11.5px;line-height:1.35;color:var(--muted)}.finished-weight-field .input{min-height:42px;text-align:center}.kbju-summary-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.kbju-summary-section{display:grid;gap:5px;padding:10px 11px;border-radius:16px;background:var(--paper);box-shadow:var(--pressed);text-align:left}.kbju-summary-section strong{font-size:11px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.06em}.kbju-summary-section span{font-size:12px;line-height:1.45;color:var(--muted)}.kbju-summary-section b{font-weight:600;color:var(--ink)}
.nutrition-total-label{margin-top:14px;font-size:11px;line-height:1.35;letter-spacing:.055em;text-transform:uppercase;color:var(--muted);text-align:center}.product-breakdown{width:100%;margin-top:14px;padding:11px 12px;border-radius:18px;background:var(--paper);box-shadow:var(--pressed);text-align:left}.product-breakdown summary{cursor:pointer;color:var(--ink);font-size:13px;font-weight:600;text-align:left}.product-breakdown[open] summary{margin-bottom:10px}.product-breakdown-list{display:grid;gap:8px}.product-breakdown-row{display:grid;gap:7px;padding:10px;border-radius:14px;border:1px solid color-mix(in srgb,var(--line) 72%,transparent);background:color-mix(in srgb,var(--paper2) 66%,transparent)}.product-breakdown-name,.product-breakdown-values{display:grid;gap:3px;min-width:0}.product-breakdown-name b{font-size:12.5px;font-weight:600;color:var(--ink);overflow-wrap:anywhere}.product-breakdown-name span,.product-breakdown-values span,.product-breakdown-values small,.product-breakdown p{font-size:11px;line-height:1.42;color:var(--muted);overflow-wrap:anywhere}.product-breakdown-values span{color:var(--ink)}.product-breakdown p{margin:9px 0 0}.product-quantity small{overflow-wrap:anywhere}
@media(min-width:900px){.my-category-choice{grid-template-columns:repeat(4,minmax(0,1fr))}.my-list-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.my-editor-wrap .field-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:760px){:root{--app-font-size:14px;--app-small:12px}.custom-head .country-meta{gap:8px}.my-create-btn{min-width:auto;padding:9px 12px}.my-editor-head,.product-calc-head{display:grid;justify-items:center;text-align:center}.product-head{display:none}.product-row{grid-template-columns:1fr minmax(160px,.9fr) 74px 58px 58px 58px 34px;gap:6px;overflow-x:auto}.product-row .input{min-width:0}.finished-weight-field{grid-template-columns:1fr;text-align:center}.finished-weight-field .input{max-width:220px;justify-self:center}.kbju-summary-grid{grid-template-columns:1fr}.my-item-compact .my-item-top{grid-template-columns:1fr}.compact-actions{grid-template-columns:repeat(3,minmax(0,1fr));min-width:0}.compact-actions .btn{white-space:normal}.my-list-grid{grid-template-columns:1fr}.compact-kbju{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:520px){.product-calc{padding:12px}.product-row{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;overflow:visible}.product-row [data-prod="name"],.product-quantity{grid-column:1 / -1}.product-remove{grid-column:2;justify-self:end}.product-row{align-items:start}.product-row .input,.product-row .select{font-size:12px;padding:8px}.compact-actions{gap:5px}.compact-actions .btn{font-size:11px;padding:7px 6px}.country-meta .my-create-btn{height:38px}}


/* My recipes: creation form is available only from the Creation button */
.my-editor-wrap[hidden],#myRecipeEditor[hidden],#myLibrary[hidden]{display:none !important}


/* my recipes folder-only cleanup */
.my-cat-control{display:none !important}
.my-library{gap:16px !important}
.my-category-choice{margin-top:0 !important}
.my-cat-tile{min-height:112px !important;padding:16px !important}
.my-cat-tile.active{outline:1px solid var(--liquid-border);box-shadow:var(--liquid-glow),var(--pressed) !important}
.my-folder-title{grid-column:1/-1;display:flex;align-items:center;justify-content:center;gap:10px;text-align:center;margin:2px 0 4px}
.my-folder-title h3{margin:0;font-size:clamp(21px,1.6vw,26px);line-height:1.1}
.my-folder-title span{font-size:12px;color:var(--muted);padding:7px 11px;border-radius:999px;background:var(--paper);box-shadow:var(--pressed)}
#myRecipesList:empty{display:none}
#myEmpty{max-width:680px;margin:0 auto}



/* compact full meal calendar view */
#mealview .custom-head{margin-bottom:20px;padding:22px 24px;border-radius:28px}
#mealview .custom-head h1{font-size:clamp(30px,4vw,46px);line-height:1.02;margin-bottom:8px}
#mealview .custom-head p{font-size:14px;line-height:1.45;margin:0}
#mealview .meal-layout{grid-template-columns:minmax(280px,500px) minmax(280px,420px);justify-content:center;align-items:start;gap:22px !important;margin-top:8px}
#mealview .meal-layout>.panel{width:100%;max-width:500px;padding:18px !important;border-radius:28px;justify-self:center;align-content:start}
#mealview .meal-day-panel{max-width:420px;gap:10px !important;padding:18px !important;align-self:start}
#mealview .meal-toolbar{width:100%;max-width:452px;margin:0 auto 10px;display:grid;grid-template-columns:38px minmax(0,1fr) 38px;align-items:center;gap:10px}
#mealview .meal-toolbar h3{font-size:clamp(21px,2.5vw,25px);line-height:1.05;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#mealview .meal-month-btn{width:38px;height:38px;border-radius:15px;font-size:20px;font-weight:500;border:1px solid var(--liquid-border) !important;background:var(--liquid-bg),var(--paper) !important;box-shadow:var(--liquid-glow),var(--softShadow) !important;color:var(--ink)}
#mealview .meal-weekdays,#mealview .meal-calendar-grid{width:100%;max-width:452px;margin-left:auto;margin-right:auto;gap:5px}
#mealview .meal-weekdays{margin-bottom:5px;font-size:10px;letter-spacing:.035em;font-weight:700}
#mealview .meal-calendar-grid{min-height:0;contain:layout paint;content-visibility:auto}
#mealview .meal-day{min-height:46px;border-radius:14px;padding:5px 4px;gap:2px;align-items:center;justify-content:center;text-align:center;box-shadow:var(--liquid-glow),var(--softShadow) !important;contain:layout paint;will-change:auto}
#mealview .meal-day-number{font-size:12px;line-height:1;font-weight:750}
#mealview .meal-day-dots{width:100%;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:2px;min-height:8px}
#mealview .meal-chip{font-size:0;line-height:0;padding:0;width:6px;height:6px;min-width:6px;border-radius:999px;margin:0;background:rgba(201,164,95,.42);box-shadow:inset 0 1px 0 rgba(255,255,255,.35)}
body.dark #mealview .meal-chip{background:rgba(226,232,240,.42)}
#mealview .meal-more{font-size:8.5px;line-height:1;color:var(--muted);padding:0;font-weight:750}
#mealview #mealDayTitle{font-size:clamp(21px,2.4vw,25px);line-height:1.08;text-align:center;margin:0}
#mealview .meal-day-sub{font-size:12px;line-height:1.35;margin:0 auto 2px;max-width:330px}
#mealview #mealDayEditor{display:grid;gap:9px;width:100%}
#mealview .meal-slot{border-radius:18px;padding:10px;gap:8px;box-shadow:var(--pressed) !important}
#mealview .meal-slot-head{gap:6px;align-items:center}
#mealview .meal-slot-head h4{font-size:13.5px;line-height:1.15}
#mealview .meal-slot-head span{font-size:10.5px;line-height:1.15}
#mealview .meal-dishes{gap:6px}
#mealview .meal-dish-row{grid-template-columns:minmax(0,1fr) 32px;gap:6px}
#mealview .meal-dish-open{min-height:34px;border-radius:14px;padding:8px 10px;font-size:12px;line-height:1.2}
#mealview .meal-remove{height:34px;border-radius:13px;font-size:15px}
#mealview .meal-empty{padding:8px 10px;border-radius:14px;font-size:11.5px;line-height:1.3;text-align:center}
#mealview .meal-add-row{gap:6px;justify-content:center;flex-wrap:wrap}
#mealview .meal-add-row .btn,#mealview .meal-day-actions .btn{min-height:36px;border-radius:14px;padding:8px 12px;font-size:12px;line-height:1.15}
#mealview .meal-day-actions{gap:8px;margin-top:4px;display:flex;flex-wrap:wrap;justify-content:center;width:100%}
#mealview .meal-status{font-size:11.5px;line-height:1.35;text-align:center;min-height:0}
#mealview .meal-picker{gap:7px}
#mealview .meal-search{min-height:36px;border-radius:14px;padding:8px 10px;font-size:12px}
#mealview .meal-pick-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;max-height:210px;padding:2px;overscroll-behavior:contain}
#mealview .meal-pick-card{min-height:58px;border-radius:15px;padding:8px;gap:3px}
#mealview .meal-pick-card b{font-size:11.5px;line-height:1.15;-webkit-line-clamp:2}
#mealview .meal-pick-card span{font-size:9.5px}
#mealview .meal-picker-note{font-size:10.5px;line-height:1.25;margin:0}
@media(max-width:980px){
  #mealview .meal-layout{grid-template-columns:minmax(280px,560px);gap:16px !important}
  #mealview .meal-layout>.panel,#mealview .meal-day-panel{max-width:560px}
  #mealview .meal-weekdays,#mealview .meal-calendar-grid,#mealview .meal-toolbar{max-width:500px}
}
@media(max-width:560px){
  #mealview .custom-head{padding:18px 16px;border-radius:24px;margin-bottom:16px}
  #mealview .meal-layout{gap:14px !important;margin-top:0}
  #mealview .meal-layout>.panel,#mealview .meal-day-panel{padding:14px !important;border-radius:24px}
  #mealview .meal-toolbar{grid-template-columns:34px minmax(0,1fr) 34px;gap:8px;margin-bottom:8px}
  #mealview .meal-month-btn{width:34px;height:34px;border-radius:13px;font-size:18px}
  #mealview .meal-weekdays,#mealview .meal-calendar-grid{gap:4px;max-width:100%}
  #mealview .meal-day{min-height:40px;border-radius:12px;padding:4px 3px}
  #mealview .meal-day-number{font-size:11px}
  #mealview .meal-chip{width:5px;height:5px;min-width:5px}
  #mealview .meal-slot{padding:9px;border-radius:16px}
}


/* swipe-only meal calendars: centered, no arrow controls */
.home-calendar-nav,.meal-month-btn#mealPrevMonth,.meal-month-btn#mealNextMonth{display:none !important}
.home-calendar-card,.meal-calendar-panel{cursor:grab;touch-action:pan-y;user-select:none;-webkit-user-select:none}
.home-calendar-card:active,.meal-calendar-panel:active{cursor:grabbing}
.home-calendar-card{padding-left:18px !important;padding-right:18px !important;justify-items:center !important;text-align:center !important}
.home-calendar-card .home-calendar-top{justify-content:center !important;text-align:center !important}
.home-calendar-card .home-calendar-top>div:first-child{justify-items:center !important;text-align:center !important}
.meal-layout{justify-content:center !important;align-items:start !important}
.meal-calendar-panel{width:min(100%,560px) !important;max-width:560px !important;justify-self:center !important;margin-inline:auto !important;padding:20px 22px 22px !important;min-height:auto !important;display:grid !important;justify-items:center !important;text-align:center !important}
.meal-calendar-panel .meal-toolbar{display:grid !important;grid-template-columns:1fr !important;justify-items:center !important;margin:0 0 12px !important;min-height:auto !important;width:100% !important}
.meal-calendar-panel .meal-toolbar h3{font-size:clamp(23px,2.4vw,31px) !important;line-height:1.08 !important;text-align:center !important;margin:0 !important;letter-spacing:.035em !important}
.meal-calendar-panel .meal-weekdays,.meal-calendar-panel .meal-calendar-grid{width:100% !important;max-width:500px !important;margin-left:auto !important;margin-right:auto !important;gap:6px !important}
.meal-calendar-panel .meal-weekdays{margin-bottom:6px !important;text-align:center !important;font-size:10.5px !important}
.meal-calendar-panel .meal-calendar-grid{grid-template-rows:repeat(6,54px) !important;min-height:354px !important;align-self:center !important}
.meal-calendar-panel .meal-day{height:54px !important;min-height:0 !important;border-radius:15px !important;padding:5px !important;gap:2px !important;text-align:center !important;align-items:center !important;box-shadow:inset 1px 1px 0 rgba(255,255,255,.42),0 7px 14px rgba(143,118,91,.10) !important}
.meal-calendar-panel .meal-day-number{font-size:12px !important;line-height:1.05 !important}
.meal-calendar-panel .meal-day-dots{width:100% !important;gap:2px !important;justify-items:center !important}
.meal-calendar-panel .meal-chip{max-width:100% !important;font-size:8.5px !important;padding:2px 5px !important;line-height:1.05 !important;text-align:center !important}
.meal-calendar-panel .meal-more{font-size:8.5px !important;line-height:1 !important;text-align:center !important}
.meal-layout:has(.meal-day-panel[hidden]){grid-template-columns:minmax(0,560px) !important;justify-content:center !important}
@media(max-width:900px){
  .meal-calendar-panel{width:min(100%,440px) !important;max-width:440px !important;padding:18px 18px 20px !important}
  .meal-calendar-panel .meal-calendar-grid{grid-template-rows:repeat(6,45px) !important;min-height:300px !important;max-width:410px !important}
  .meal-calendar-panel .meal-weekdays{max-width:410px !important}
  .meal-calendar-panel .meal-day{height:45px !important;border-radius:13px !important}
  .home-calendar-card{padding-left:16px !important;padding-right:16px !important}
}
@media(max-width:560px){
  .meal-calendar-panel{width:100% !important;padding:16px 12px 18px !important;border-radius:24px !important}
  .meal-calendar-panel .meal-calendar-grid{grid-template-rows:repeat(6,38px) !important;min-height:252px !important;gap:4px !important;max-width:330px !important}
  .meal-calendar-panel .meal-weekdays{max-width:330px !important;gap:4px !important;font-size:9.5px !important}
  .meal-calendar-panel .meal-day{height:38px !important;border-radius:11px !important;padding:3px !important}
  .meal-calendar-panel .meal-day-number{font-size:11px !important}
  .meal-calendar-panel .meal-chip{font-size:0 !important;width:5px !important;height:5px !important;padding:0 !important;box-shadow:none !important}
  .home-calendar-card{padding-left:14px !important;padding-right:14px !important}
}


/* meal planner simplified slot logic */
.meal-day-panel #mealDayEditor{width:100%;display:grid;gap:10px}
.meal-slot{display:grid;gap:9px}
.meal-slot-head{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:10px!important;text-align:left!important}
.meal-slot-title{display:grid;gap:1px;text-align:left;min-width:0}
.meal-slot-title h4{margin:0;text-align:left;font-size:clamp(14px,1.2vw,16px);line-height:1.15}
.meal-slot-title span{font-size:11px;color:var(--muted);font-weight:650;line-height:1.1}
.meal-add-btn{width:38px;height:38px;min-width:38px;border-radius:15px;background:var(--liquid-bg),var(--paper);border:1px solid var(--liquid-border);box-shadow:var(--liquid-glow),var(--softShadow);color:var(--ink);font-size:24px;line-height:1;font-weight:320;display:grid;place-items:center;transition:transform .15s ease,box-shadow .15s ease}
.meal-add-btn span{display:none}
.meal-add-btn:active{transform:scale(.96);box-shadow:var(--pressed)}
.meal-dish-open{display:grid!important;gap:2px!important;white-space:normal!important;text-overflow:clip!important;line-height:1.2!important}
.meal-dish-open span{display:block;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:left}
.meal-dish-open small{display:block;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--muted);font-size:10.5px;font-weight:520;text-align:left}
.meal-type-grid-modal{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.meal-picker-back{min-height:36px;border-radius:15px;padding:8px 12px}
@media(max-width:560px){.meal-type-grid-modal{grid-template-columns:1fr}.meal-add-btn{width:34px;height:34px;min-width:34px;border-radius:13px;font-size:22px}.meal-slot{gap:8px}.meal-dish-open span{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}}


/* meal day picker: no search, clearer bottom spacing and explicit day actions */
.meal-picker-body{padding-bottom:28px !important;gap:12px !important}
.meal-pick-grid-modal{padding-bottom:22px !important;margin-bottom:6px}
.meal-country-grid,.meal-type-grid-modal{padding-bottom:20px !important;margin-bottom:6px}
.meal-slot{padding-bottom:18px !important}
.meal-day-panel .meal-day-actions-active{display:grid !important;grid-template-columns:1fr 1fr !important;gap:10px !important;width:100%;margin-top:8px;padding-top:2px}
.meal-day-panel .meal-status{display:block !important;min-height:18px;margin-top:2px;text-align:center;color:var(--muted);font-size:12px;font-weight:800;line-height:1.35}
.meal-picker-dialog{max-height:min(80vh,760px)}
@media(max-width:560px){.meal-day-panel .meal-day-actions-active{grid-template-columns:1fr !important}.meal-picker-body{padding-bottom:24px !important}.meal-pick-grid-modal{padding-bottom:18px !important}}



/* meal planner clean user wording + centered plus controls */
#mealview .meal-account-reminder{
  width:min(100%,640px);
  margin:0 auto 16px;
  padding:11px 14px;
  border-radius:18px;
  text-align:center;
  color:var(--muted);
  font-size:12.5px;
  line-height:1.45;
  font-weight:650;
  background:var(--liquid-bg),var(--paper);
  border:1px solid var(--liquid-border);
  box-shadow:var(--liquid-glow),var(--softShadow);
}
#mealview .meal-slot-head,
.meal-day-panel .meal-slot-head{
  display:grid!important;
  grid-template-columns:1fr!important;
  justify-items:center!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
  text-align:center!important;
}
#mealview .meal-slot-title,
.meal-day-panel .meal-slot-title{
  justify-items:center!important;
  text-align:center!important;
  width:100%;
}
#mealview .meal-slot-title h4,
#mealview .meal-slot-title span,
.meal-day-panel .meal-slot-title h4,
.meal-day-panel .meal-slot-title span{
  text-align:center!important;
}
#mealview .meal-add-btn,
.meal-day-panel .meal-add-btn{
  margin:0 auto!important;
  place-self:center!important;
}
#mealview .meal-empty,
.meal-day-panel .meal-empty{
  text-align:center!important;
}
.meal-picker-note:empty{display:none!important}



/* main page calendar scroll performance patch */
#homeMealCalendarCard{
  touch-action:pan-y !important;
  cursor:default !important;
  user-select:auto !important;
  -webkit-user-select:auto !important;
  contain:layout paint style !important;
  content-visibility:auto;
  contain-intrinsic-size:420px;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}
#homeMealCalendarCard:active{cursor:default !important}
#homeMealCalendarGrid,
#homeMealCalendarGrid .meal-day,
#homeMealCalendarGrid .meal-chip,
#homeMealCalendarGrid .meal-more{
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
  transform:none !important;
  backface-visibility:visible !important;
  transition:none !important;
  will-change:auto !important;
}
#homeMealCalendarGrid{
  contain:layout paint style !important;
  content-visibility:auto;
  touch-action:pan-y !important;
}
#homeMealCalendarGrid .meal-day{
  box-shadow:inset 1px 1px 0 rgba(255,255,255,.44),0 2px 7px rgba(143,118,91,.08) !important;
  background:rgba(255,255,255,.18) !important;
  border:1px solid rgba(201,164,95,.18) !important;
  outline-offset:-1px;
}
body.dark #homeMealCalendarGrid .meal-day{
  background:rgba(255,255,255,.045) !important;
  border-color:rgba(224,229,236,.12) !important;
  box-shadow:inset 1px 1px 0 rgba(255,255,255,.08),0 2px 7px rgba(0,0,0,.16) !important;
}
#homeMealCalendarGrid .meal-day:active{
  transform:none !important;
  box-shadow:inset 1px 1px 0 rgba(255,255,255,.44),0 2px 7px rgba(143,118,91,.08) !important;
}
#homeMealCalendarGrid .meal-chip{
  background:rgba(201,164,95,.44) !important;
  box-shadow:none !important;
}
body.dark #homeMealCalendarGrid .meal-chip{background:rgba(226,232,240,.42) !important}


/* lightweight home menu card: no calendar grid on the main page */
.home-menu-card{
  min-height:184px !important;
  height:100%;
  justify-content:center !important;
  align-items:center !important;
  text-align:center !important;
  gap:14px !important;
  border-radius:34px;
}
.home-menu-card .tab-icon{width:64px;height:64px;border-radius:26px;margin:0 auto}
.home-menu-card b{font:400 28px/1.05 var(--title-font);letter-spacing:.01em;text-align:center;margin:0}
.home-menu-card span{display:block;margin-top:8px;max-width:270px;text-align:center;color:var(--muted);font-size:14px;line-height:1.45;text-wrap:balance}
.home-menu-card small{display:inline-flex;justify-content:center;align-items:center;margin-top:12px;min-height:26px;padding:5px 11px;border-radius:999px;color:var(--ink);font-size:12px;font-weight:600;background:rgba(255,255,255,.18);border:1px solid var(--liquid-border-soft)}
body.dark .home-menu-card small{background:rgba(255,255,255,.055)}
.home-menu-card:active{transform:scale(.985);box-shadow:var(--pressed)!important}
#homeMealCalendarGrid,.home-meal-weekdays,#homeMealMonthTitle,.home-calendar-top{display:none!important}
@media(min-width:821px){
  .home-planner-row{grid-template-columns:repeat(2,minmax(240px,360px));align-items:stretch;justify-content:center}
  .home-my-card,.home-menu-card{min-height:190px!important}
}
@media(max-width:820px){.home-menu-card{min-height:150px!important}.home-menu-card span{font-size:13px}}



/* cleaner inner meal calendar and matte paper dark texture */
body.dark:before{
  opacity:.20 !important;
  background-image:
    radial-gradient(circle at 25% 35%,rgba(255,255,255,.12) 0 1px,transparent 1.25px),
    radial-gradient(circle at 70% 70%,rgba(255,255,255,.07) 0 .8px,transparent 1.15px),
    linear-gradient(135deg,rgba(255,255,255,.025),rgba(0,0,0,.06));
  background-size:4px 4px,7px 7px,100% 100% !important;
  mask-image:none !important;
}
#mealview .meal-calendar-panel{
  background:rgba(255,255,255,.16) !important;
  border:1px solid var(--liquid-border-soft) !important;
  box-shadow:0 10px 26px rgba(143,118,91,.08),inset 0 1px 0 rgba(255,255,255,.42) !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}
body.dark #mealview .meal-calendar-panel{
  background:rgba(255,255,255,.045) !important;
  border-color:rgba(230,232,238,.14) !important;
  box-shadow:0 8px 22px rgba(0,0,0,.20),inset 0 1px 0 rgba(255,255,255,.055) !important;
}
#mealview .meal-day{
  background:rgba(255,255,255,.22) !important;
  border:1px solid rgba(201,164,95,.16) !important;
  box-shadow:none !important;
  outline-offset:-1px !important;
  transition:background .12s ease,border-color .12s ease,opacity .12s ease !important;
}
body.dark #mealview .meal-day{
  background:rgba(255,255,255,.038) !important;
  border-color:rgba(230,232,238,.10) !important;
  box-shadow:none !important;
}
#mealview .meal-day:active,#mealview .meal-day.selected{
  transform:none !important;
  box-shadow:none !important;
}
#mealview .meal-day.selected{background:rgba(201,164,95,.18) !important;border-color:var(--liquid-border) !important}
body.dark #mealview .meal-day.selected{background:rgba(226,232,240,.11) !important;border-color:rgba(226,232,240,.28) !important}
#mealview .meal-day.today{outline:1px solid var(--liquid-border) !important}
#mealview .meal-chip{box-shadow:none !important}
#mealview .meal-toolbar h3{letter-spacing:.015em !important}
#mealview .meal-weekdays{font-weight:560 !important;color:var(--muted) !important}

/* country cards floral line art */
.country-card .cemoji{
  background:#050505 !important;
  border:1px solid rgba(255,255,255,.10) !important;
  box-shadow:inset 1px 1px 0 rgba(255,255,255,.08),0 12px 24px rgba(0,0,0,.18) !important;
}
.country-card .cemoji:before{display:none !important}
.flower-icon{width:56px;height:56px;display:block;overflow:visible}
.flower-icon path,.flower-icon circle:not(.flower-bg){fill:none;stroke:rgba(255,255,255,.76);stroke-width:1.35;stroke-linecap:round;stroke-linejoin:round}
.flower-icon .flower-bg{fill:#050505;stroke:rgba(234,210,154,.28);stroke-width:.8}
body.dark .flower-icon path,body.dark .flower-icon circle:not(.flower-bg){stroke:rgba(246,246,246,.72)}
body.dark .flower-icon .flower-bg{stroke:rgba(226,232,240,.22)}



/* uniform country cards with uploaded cuisine illustrations */
.country-card-uniform,
.country-card{
  display:grid !important;
  grid-template-rows:auto 1fr auto !important;
  justify-items:center !important;
  align-items:stretch !important;
  text-align:center !important;
  gap:14px !important;
  min-height:380px !important;
  padding:20px 18px 18px !important;
  overflow:hidden !important;
}
.country-card-uniform::before,.country-card-uniform::after{display:none!important;content:none!important}
.country-card-uniform .country-main{
  width:100% !important;
  display:grid !important;
  grid-template-rows:auto auto !important;
  justify-items:center !important;
  align-items:start !important;
  gap:14px !important;
  min-height:0 !important;
}
.country-art-frame{
  width:min(100%,190px) !important;
  aspect-ratio:1/1 !important;
  border-radius:999px !important;
  display:grid !important;
  place-items:center !important;
  overflow:hidden !important;
  background:#111 !important;
  border:1px solid rgba(201,164,95,.38) !important;
  box-shadow:0 10px 22px rgba(90,65,38,.12) !important;
  margin:0 auto !important;
}
body.dark .country-art-frame{border-color:rgba(230,235,242,.28)!important;box-shadow:0 10px 22px rgba(0,0,0,.22)!important;background:#080808!important}
.country-art{
  width:100% !important;
  height:100% !important;
  display:block !important;
  object-fit:cover !important;
  border-radius:inherit !important;
}
.country-card-uniform .country-copy{
  width:100% !important;
  min-height:120px !important;
  display:grid !important;
  grid-template-rows:auto 1fr !important;
  align-items:start !important;
  justify-items:center !important;
  gap:8px !important;
  text-align:center !important;
}
.country-card-uniform h3{
  width:100% !important;
  min-height:48px !important;
  margin:0 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  text-align:center !important;
  font-size:clamp(25px,2.7vw,34px) !important;
  line-height:1.03 !important;
  letter-spacing:-.025em !important;
  overflow-wrap:anywhere !important;
  hyphens:auto !important;
}
.country-card-uniform p{
  width:100% !important;
  max-width:300px !important;
  min-height:42px !important;
  margin:0 auto !important;
  display:flex !important;
  align-items:flex-start !important;
  justify-content:center !important;
  text-align:center !important;
  font-size:13.5px !important;
  line-height:1.42 !important;
  color:var(--muted) !important;
}
.country-card-uniform .country-bottom{
  width:100% !important;
  min-height:74px !important;
  display:grid !important;
  grid-template-rows:auto auto !important;
  justify-items:center !important;
  align-items:center !important;
  gap:10px !important;
  margin:0 !important;
  text-align:center !important;
}
.country-card-uniform .country-bottom span:first-child{
  width:100% !important;
  display:block !important;
  min-height:18px !important;
  text-align:center !important;
  font-size:13px !important;
  line-height:1.25 !important;
  color:var(--muted) !important;
}
.country-card-uniform .country-open-arrow{
  width:38px !important;
  height:38px !important;
  border-radius:16px !important;
  margin:0 auto !important;
}
.country-card-uniform .cemoji{display:none!important}
@media(min-width:900px){
  .country-grid{grid-template-columns:repeat(3,minmax(230px,1fr)) !important;align-items:stretch !important}
  .country-card-uniform{height:100% !important}
}
@media(max-width:760px){
  .country-card-uniform{min-height:350px !important;padding:18px 16px !important;gap:12px !important}
  .country-art-frame{width:min(100%,170px) !important}
  .country-card-uniform h3{font-size:clamp(26px,8vw,36px) !important;min-height:46px !important}
  .country-card-uniform .country-copy{min-height:112px !important}
  .country-card-uniform p{font-size:13.5px !important;min-height:40px !important}
}

/* small country illustrations in meal picker */
.meal-country-card-art{min-height:128px!important;gap:7px!important;padding:12px!important}
.meal-country-thumb{width:54px;height:54px;border-radius:999px;overflow:hidden;display:grid;place-items:center;background:#111;border:1px solid var(--liquid-border);box-shadow:none;margin:0 auto 2px}
.meal-country-img{width:100%;height:100%;display:block;object-fit:cover;border-radius:inherit}
.meal-country-card-art b{min-height:18px;display:flex;align-items:center;justify-content:center;text-align:center}



/* global matte paper finish: soft shadows, no heavy volume */
:root{
  --shadow:0 12px 28px rgba(118,96,74,.13), 0 2px 8px rgba(118,96,74,.08), inset 0 1px 0 rgba(255,255,255,.46);
  --softShadow:0 7px 18px rgba(118,96,74,.11), 0 1px 5px rgba(118,96,74,.07), inset 0 1px 0 rgba(255,255,255,.40);
  --pressed:inset 0 2px 7px rgba(118,96,74,.15), inset 0 -1px 0 rgba(255,255,255,.48);
  --inner:inset 0 1px 0 rgba(255,255,255,.34);
  --liquid-glow:0 10px 24px rgba(126,103,80,.10), 0 2px 8px rgba(126,103,80,.06), inset 0 1px 0 rgba(255,255,255,.44) !important;
  --backdrop:rgba(238,231,221,.86);
  --paper:#efe7dc;
  --paper2:#e9dfd2;
  --paper3:#f8f0e4;
  --line:rgba(170,138,94,.24);
}
body.dark{
  --shadow:0 12px 28px rgba(0,0,0,.23), 0 2px 8px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.035);
  --softShadow:0 7px 18px rgba(0,0,0,.20), 0 1px 5px rgba(0,0,0,.16), inset 0 1px 0 rgba(255,255,255,.03);
  --pressed:inset 0 2px 7px rgba(0,0,0,.33), inset 0 -1px 0 rgba(255,255,255,.025);
  --inner:inset 0 1px 0 rgba(255,255,255,.025);
  --liquid-glow:0 10px 24px rgba(0,0,0,.24), 0 2px 8px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.045) !important;
  --backdrop:rgba(27,24,21,.88);
  --paper:#211d19;
  --paper2:#1b1714;
  --paper3:#29231e;
  --line:rgba(224,229,236,.18);
}
body{
  background:
    radial-gradient(circle at 18% 10%,rgba(234,210,154,.24),transparent 25%),
    radial-gradient(circle at 84% 8%,rgba(125,160,138,.15),transparent 24%),
    linear-gradient(135deg,#efe7dc,#f5eee5 52%,#e7dccf) !important;
}
body.dark{
  background:
    radial-gradient(circle at 16% 8%,rgba(215,182,109,.08),transparent 24%),
    radial-gradient(circle at 84% 12%,rgba(145,180,154,.055),transparent 25%),
    linear-gradient(135deg,#201c18,#171411 54%,#0f0d0b) !important;
}
body:before{
  content:"" !important;
  position:fixed !important;
  inset:0 !important;
  z-index:-1 !important;
  pointer-events:none !important;
  opacity:.30 !important;
  background-image:
    radial-gradient(circle at 12% 18%,rgba(92,72,54,.18) 0 1px,transparent 1.4px),
    radial-gradient(circle at 76% 30%,rgba(255,255,255,.38) 0 .8px,transparent 1.3px),
    radial-gradient(circle at 42% 70%,rgba(142,111,75,.13) 0 1.1px,transparent 1.6px) !important;
  background-size:18px 18px,24px 24px,29px 29px !important;
  mask-image:none !important;
  mix-blend-mode:multiply;
}
body.dark:before{
  opacity:.34 !important;
  background-image:
    radial-gradient(circle at 16% 20%,rgba(255,255,255,.105) 0 1px,transparent 1.55px),
    radial-gradient(circle at 74% 36%,rgba(0,0,0,.38) 0 1px,transparent 1.8px),
    radial-gradient(circle at 42% 72%,rgba(255,255,255,.06) 0 1px,transparent 1.7px) !important;
  background-size:19px 19px,26px 26px,31px 31px !important;
  mix-blend-mode:screen;
}
.hero,.country-card,.tab-card,.cat-tile,.recipe-card,.panel,.dialog,.country-head,.custom-head,.stat,.my-item,.meal-day,.meal-slot,.account-settings-card,.auth-popover,.account-info,.input,.select,textarea,.btn,.auth-chip,.theme-btn,.meal-month-btn,.meal-dish-open,.meal-remove,.country-art,.cemoji,.tab-icon,.cat-icon,.dish-icon,.brand-mark,.meal-picker-card,.meal-step-card,.meal-country-card,.meal-recipe-card{
  box-shadow:var(--softShadow) !important;
}
.hero,.country-card,.tab-card,.cat-tile,.recipe-card,.panel,.dialog,.country-head,.custom-head,.my-item,.home-menu-card,.home-calendar-card{
  background:linear-gradient(145deg,rgba(255,255,255,.30),rgba(238,229,216,.30)),var(--paper) !important;
  border-color:var(--line) !important;
}
body.dark .hero,body.dark .country-card,body.dark .tab-card,body.dark .cat-tile,body.dark .recipe-card,body.dark .panel,body.dark .dialog,body.dark .country-head,body.dark .custom-head,body.dark .my-item,body.dark .home-menu-card,body.dark .home-calendar-card{
  background:linear-gradient(145deg,rgba(255,255,255,.035),rgba(0,0,0,.10)),var(--paper) !important;
  border-color:var(--line) !important;
}
.topbar{
  box-shadow:0 8px 20px rgba(117,93,68,.09), inset 0 -1px 0 var(--line) !important;
  backdrop-filter:blur(12px) saturate(1.02) !important;
  -webkit-backdrop-filter:blur(12px) saturate(1.02) !important;
}
body.dark .topbar{box-shadow:0 8px 20px rgba(0,0,0,.20), inset 0 -1px 0 var(--line) !important}
.hero:before,.hero:after,.country-card:before,.country-card:after,.brand-mark:before,.theme-btn:before,.tab-icon:before,.cat-icon:before,.dish-icon:before,.cemoji:before,.arrow:before,.leaf:before,.close:before{
  opacity:.34 !important;
}
.country-card:active,.recipe-card:active,.cat-tile:active,.tab-card:active,.theme-btn:active,.theme-btn.tapped,.btn:active,.meal-dish-open:active{
  transform:scale(.992) !important;
  box-shadow:var(--pressed) !important;
}
button,.btn,.auth-chip,.theme-btn,.meal-month-btn,.meal-dish-open,.meal-remove{
  filter:none !important;
}



/* iPhone-like page swipe back */
.view.active.swipe-back-dragging{
  transition:none !important;
  will-change:transform,opacity,filter;
  transform:translate3d(var(--swipe-x,0px),0,0) scale(calc(1 - var(--swipe-p,0)*.015)) !important;
  opacity:calc(1 - var(--swipe-p,0)*.12);
  filter:brightness(calc(1 - var(--swipe-p,0)*.035));
  border-radius:calc(var(--swipe-p,0)*22px);
  box-shadow:-18px 0 36px rgba(0,0,0,.08);
}
.view.active.swipe-back-finish{
  transition:transform .34s cubic-bezier(.20,.82,.20,1),opacity .30s ease,filter .30s ease,border-radius .30s ease !important;
  transform:translate3d(102vw,0,0) scale(.985) !important;
  opacity:.72;
  filter:brightness(.96);
  border-radius:22px;
}
.view.active.swipe-back-return{
  transition:transform .30s cubic-bezier(.22,.78,.24,1),opacity .24s ease,filter .24s ease,border-radius .24s ease !important;
  transform:translate3d(0,0,0) scale(1) !important;
  opacity:1;
  filter:none;
  border-radius:0;
}
body.page-swipe-active{overflow:hidden;overscroll-behavior:none}
body.page-swipe-active .topbar{transform:translateZ(0)}
.swipe-cue{font-size:13px;font-weight:650;letter-spacing:.01em}
.swipe-cue span{font-size:24px;line-height:1}


/* performance + matte paper finish: final override */
:root{
  --shadow:0 10px 24px rgba(105,83,57,.095),0 2px 7px rgba(105,83,57,.055) !important;
  --softShadow:0 7px 16px rgba(105,83,57,.075),0 1px 4px rgba(105,83,57,.045) !important;
  --pressed:inset 0 1px 2px rgba(120,98,70,.12),inset 0 -1px 0 rgba(255,255,255,.42) !important;
  --liquid-glow:0 8px 20px rgba(105,83,57,.075),inset 0 1px 0 rgba(255,255,255,.36) !important;
  --paper-grain-a:rgba(93,70,44,.105);
  --paper-grain-b:rgba(255,255,255,.18);
}
body.dark{
  --shadow:0 10px 24px rgba(0,0,0,.18),0 2px 7px rgba(0,0,0,.14) !important;
  --softShadow:0 7px 16px rgba(0,0,0,.15),0 1px 4px rgba(0,0,0,.12) !important;
  --pressed:inset 0 1px 2px rgba(0,0,0,.35),inset 0 -1px 0 rgba(255,255,255,.045) !important;
  --liquid-glow:0 8px 20px rgba(0,0,0,.16),inset 0 1px 0 rgba(255,255,255,.055) !important;
  --paper-grain-a:rgba(255,255,255,.105);
  --paper-grain-b:rgba(0,0,0,.24);
}
body{
  background:
    radial-gradient(circle at 16% 8%,rgba(234,210,154,.18),transparent 25%),
    radial-gradient(circle at 82% 10%,rgba(125,160,138,.12),transparent 25%),
    linear-gradient(135deg,#eee7dd,#f0e7da 48%,#e0d3c2) !important;
  background-attachment:fixed !important;
}
body.dark{
  background:
    radial-gradient(circle at 16% 8%,rgba(215,182,109,.06),transparent 25%),
    radial-gradient(circle at 84% 12%,rgba(145,180,154,.045),transparent 25%),
    linear-gradient(135deg,#1b1713,#15120f 54%,#0f0d0b) !important;
  background-attachment:fixed !important;
}
body:before{
  opacity:.46 !important;
  mask-image:none !important;
  mix-blend-mode:multiply;
  background-image:
    radial-gradient(circle at 20% 30%,var(--paper-grain-a) 0 .72px,transparent .82px),
    radial-gradient(circle at 70% 60%,var(--paper-grain-b) 0 .58px,transparent .72px),
    radial-gradient(circle at 45% 80%,rgba(110,87,58,.075) 0 .9px,transparent 1.05px),
    linear-gradient(135deg,rgba(255,255,255,.055),rgba(0,0,0,.035)) !important;
  background-size:3px 3px,5px 5px,9px 9px,100% 100% !important;
}
body.dark:before{
  opacity:.34 !important;
  mix-blend-mode:screen;
  background-image:
    radial-gradient(circle at 20% 30%,rgba(255,255,255,.13) 0 .65px,transparent .78px),
    radial-gradient(circle at 70% 60%,rgba(0,0,0,.30) 0 .72px,transparent .9px),
    radial-gradient(circle at 45% 80%,rgba(255,255,255,.07) 0 .9px,transparent 1.05px),
    linear-gradient(135deg,rgba(255,255,255,.035),rgba(0,0,0,.09)) !important;
  background-size:3px 3px,5px 5px,9px 9px,100% 100% !important;
}
.hero,.country-card,.tab-card,.cat-tile,.recipe-card,.panel,.dialog,.country-head,.custom-head,.stat,.my-item,.btn,.input,.select,textarea,.auth-chip,.theme-btn,.back-btn,.pill{
  box-shadow:var(--softShadow) !important;
}
#mealview .meal-calendar-panel{
  contain:layout paint style !important;
  content-visibility:auto !important;
  contain-intrinsic-size:560px 360px !important;
  background:rgba(250,246,238,.62) !important;
  border:1px solid rgba(201,164,95,.18) !important;
  box-shadow:0 6px 16px rgba(105,83,57,.055) !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
  transform:none !important;
  will-change:auto !important;
}
body.dark #mealview .meal-calendar-panel{
  background:rgba(255,255,255,.032) !important;
  border-color:rgba(230,232,238,.10) !important;
  box-shadow:0 6px 16px rgba(0,0,0,.14) !important;
}
#mealview .meal-calendar-grid{
  contain:layout paint style !important;
  content-visibility:auto !important;
  contain-intrinsic-size:500px 324px !important;
  transform:none !important;
  will-change:auto !important;
  backface-visibility:visible !important;
}
#mealview .meal-day{
  contain:layout paint style !important;
  background:rgba(255,255,255,.24) !important;
  border:1px solid rgba(201,164,95,.12) !important;
  box-shadow:none !important;
  transform:none !important;
  transition:none !important;
  will-change:auto !important;
  -webkit-tap-highlight-color:transparent;
}
body.dark #mealview .meal-day{
  background:rgba(255,255,255,.030) !important;
  border-color:rgba(230,232,238,.075) !important;
}
#mealview .meal-day-empty{
  visibility:hidden !important;
  pointer-events:none !important;
  user-select:none !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}
#mealview .meal-day.selected{
  background:rgba(201,164,95,.17) !important;
  border-color:rgba(201,164,95,.38) !important;
}
body.dark #mealview .meal-day.selected{
  background:rgba(226,232,240,.10) !important;
  border-color:rgba(226,232,240,.24) !important;
}
#mealview .meal-day.today{outline:1px solid rgba(201,164,95,.30) !important;outline-offset:-2px !important}
body.dark #mealview .meal-day.today{outline-color:rgba(226,232,240,.22) !important}
#mealview .meal-chip,#mealview .meal-more{box-shadow:none !important;filter:none !important}
.meal-calendar-switching .meal-calendar-grid,.meal-calendar-switching .meal-day{transition:none !important;animation:none !important;pointer-events:none !important}
.view:not(.active){content-visibility:hidden;contain:layout paint style}

/* premium business-card theme: pastel ivory and cinder-blue matte paper */
:root{
  --bg:#ffffff;
  --bg2:#FAF4E6;
  --paper:#fffaf1;
  --paper2:#FAF4E6;
  --paper3:#fffdf8;
  --ink:#463f3a;
  --muted:#8a7f78;
  --line:rgba(203,161,82,.34);
  --gold:#c9a45f;
  --gold2:#ead29a;
  --gold-ring:rgba(203,161,82,.42);
  --gold-ring-soft:rgba(234,210,154,.28);
  --green:#9ab4aa;
  --accent:#c99178;
  --icon:#6f6158;
  --icon-soft:#a79282;
  --backdrop:rgba(255,250,241,.82);
  --shadow:0 14px 32px rgba(146,118,82,.085),0 2px 8px rgba(146,118,82,.055) !important;
  --softShadow:0 9px 24px rgba(146,118,82,.072),0 1px 5px rgba(146,118,82,.052) !important;
  --pressed:inset 0 1px 3px rgba(146,118,82,.13),inset 0 -1px 0 rgba(255,255,255,.65) !important;
  --inner:inset 0 1px 0 rgba(255,255,255,.64) !important;
  --liquid-border:rgba(203,161,82,.34);
  --liquid-border-soft:rgba(234,210,154,.34);
  --liquid-bg:linear-gradient(145deg,rgba(255,255,255,.58),rgba(250,244,230,.74) 58%,rgba(245,215,205,.20));
  --liquid-glow:0 10px 26px rgba(146,118,82,.072),inset 0 1px 0 rgba(255,255,255,.62) !important;
  --theme-border:rgba(203,161,82,.38);
  --paper-grain-a:rgba(117,91,52,.115);
  --paper-grain-b:rgba(255,255,255,.46);
}
body.dark{
  --bg:#bdc7ce;
  --bg2:#24292e;
  --paper:#4a5156;
  --paper2:#434b50;
  --paper3:#555d62;
  --ink:#eef3f4;
  --muted:#cbd3d7;
  --line:rgba(0,0,0,.44);
  --gold:#bdc7ce;
  --gold2:#d8e0e4;
  --gold-ring:rgba(0,0,0,.52);
  --gold-ring-soft:rgba(189,199,206,.22);
  --green:#bdc7ce;
  --accent:#d0d9dd;
  --icon:#eff4f5;
  --icon-soft:#c5ced3;
  --backdrop:rgba(45,52,58,.76);
  --shadow:0 16px 34px rgba(0,0,0,.18),0 2px 8px rgba(0,0,0,.12) !important;
  --softShadow:0 9px 24px rgba(0,0,0,.15),0 1px 5px rgba(0,0,0,.10) !important;
  --pressed:inset 0 1px 3px rgba(0,0,0,.30),inset 0 -1px 0 rgba(255,255,255,.055) !important;
  --inner:inset 0 1px 0 rgba(255,255,255,.070) !important;
  --liquid-border:rgba(0,0,0,.58);
  --liquid-border-soft:rgba(189,199,206,.13);
  --liquid-bg:linear-gradient(145deg,rgba(255,255,255,.075),rgba(74,81,86,.88) 58%,rgba(36,41,46,.28));
  --liquid-glow:0 12px 28px rgba(0,0,0,.16),inset 0 1px 0 rgba(255,255,255,.075) !important;
  --theme-border:rgba(0,0,0,.62);
  --paper-grain-a:rgba(255,255,255,.135);
  --paper-grain-b:rgba(0,0,0,.30);
}
body{
  background:
    radial-gradient(circle at 18% 8%,rgba(249,250,234,.74),transparent 30%),
    radial-gradient(circle at 88% 0%,rgba(221,232,228,.38),transparent 34%),
    radial-gradient(circle at 8% 92%,rgba(245,215,205,.28),transparent 38%),
    linear-gradient(145deg,#ffffff 0%,#fffdf8 32%,#FAF4E6 100%) !important;
  background-attachment:fixed !important;
}
body.dark{
  background:
    radial-gradient(circle at 22% 0%,rgba(189,199,206,.86),transparent 34%),
    radial-gradient(circle at 76% 18%,rgba(128,138,146,.20),transparent 34%),
    linear-gradient(180deg,#bdc7ce 0%,#808a92 34%,#4a5156 62%,#24292e 100%) !important;
  background-attachment:fixed !important;
}
body:before{
  content:"" !important;
  position:fixed !important;
  inset:0 !important;
  z-index:-1 !important;
  pointer-events:none !important;
  opacity:.54 !important;
  mix-blend-mode:multiply !important;
  mask-image:none !important;
  background-image:
    radial-gradient(circle at 22% 32%,var(--paper-grain-a) 0 .78px,transparent .92px),
    radial-gradient(circle at 68% 58%,var(--paper-grain-b) 0 .62px,transparent .8px),
    radial-gradient(circle at 42% 84%,rgba(164,130,83,.11) 0 .92px,transparent 1.1px),
    linear-gradient(135deg,rgba(255,255,255,.09),rgba(0,0,0,.028)) !important;
  background-size:4px 4px,6px 6px,10px 10px,100% 100% !important;
}
body.dark:before{
  opacity:.38 !important;
  mix-blend-mode:overlay !important;
  background-image:
    radial-gradient(circle at 22% 32%,rgba(255,255,255,.18) 0 .75px,transparent .92px),
    radial-gradient(circle at 68% 58%,rgba(0,0,0,.36) 0 .72px,transparent .9px),
    radial-gradient(circle at 42% 84%,rgba(255,255,255,.075) 0 .92px,transparent 1.1px),
    linear-gradient(135deg,rgba(255,255,255,.04),rgba(0,0,0,.13)) !important;
  background-size:4px 4px,6px 6px,10px 10px,100% 100% !important;
}
.topbar{
  background:linear-gradient(145deg,rgba(255,255,255,.68),rgba(250,244,230,.76)) !important;
  border-bottom:1px solid var(--theme-border) !important;
  box-shadow:0 10px 26px rgba(146,118,82,.07),inset 0 -1px 0 rgba(255,255,255,.42) !important;
  backdrop-filter:blur(14px) saturate(1.02) !important;
  -webkit-backdrop-filter:blur(14px) saturate(1.02) !important;
}
body.dark .topbar{
  background:linear-gradient(145deg,rgba(74,81,86,.82),rgba(36,41,46,.78)) !important;
  border-bottom-color:var(--theme-border) !important;
  box-shadow:0 10px 26px rgba(0,0,0,.16),inset 0 -1px 0 rgba(189,199,206,.06) !important;
}
.hero,.country-card,.tab-card,.cat-tile,.recipe-card,.panel,.dialog,.country-head,.custom-head,.stat,.my-item,.home-menu-card,.home-calendar-card,.meal-day,.meal-slot,.account-settings-card,.auth-popover,.account-info,.meal-picker-card,.meal-step-card,.meal-country-card,.meal-recipe-card{
  background:var(--liquid-bg),var(--paper) !important;
  border:1px solid var(--theme-border) !important;
  box-shadow:var(--softShadow) !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}
body.dark .hero,body.dark .country-card,body.dark .tab-card,body.dark .cat-tile,body.dark .recipe-card,body.dark .panel,body.dark .dialog,body.dark .country-head,body.dark .custom-head,body.dark .stat,body.dark .my-item,body.dark .home-menu-card,body.dark .home-calendar-card,body.dark .meal-day,body.dark .meal-slot,body.dark .account-settings-card,body.dark .auth-popover,body.dark .account-info,body.dark .meal-picker-card,body.dark .meal-step-card,body.dark .meal-country-card,body.dark .meal-recipe-card{
  background:var(--liquid-bg),var(--paper) !important;
  border-color:var(--theme-border) !important;
}
.input,.select,textarea,.btn,.auth-chip,.theme-btn,.back-btn,.pill,.close,.tag,.stepper button,.stepper input,.ingredients li,.ncard,.step,.tip,.swipe-close,.meal-dish-open,.meal-remove,.meal-chip{
  background:linear-gradient(145deg,rgba(255,255,255,.42),rgba(250,244,230,.72)),var(--paper2) !important;
  border:1px solid var(--theme-border) !important;
  box-shadow:0 7px 16px rgba(146,118,82,.062),0 1px 4px rgba(146,118,82,.045) !important;
}
body.dark .input,body.dark .select,body.dark textarea,body.dark .btn,body.dark .auth-chip,body.dark .theme-btn,body.dark .back-btn,body.dark .pill,body.dark .close,body.dark .tag,body.dark .stepper button,body.dark .stepper input,body.dark .ingredients li,body.dark .ncard,body.dark .step,body.dark .tip,body.dark .swipe-close,body.dark .meal-dish-open,body.dark .meal-remove,body.dark .meal-chip{
  background:linear-gradient(145deg,rgba(255,255,255,.052),rgba(36,41,46,.10)),var(--paper2) !important;
  border-color:var(--theme-border) !important;
  box-shadow:0 7px 16px rgba(0,0,0,.13),0 1px 4px rgba(0,0,0,.09) !important;
}
.hero:before,.hero:after,.country-card:before,.country-card:after{display:none !important}
.site-title,.hero h1,.section-title h2,.cat-line h2,.country-card h3,.country-head h1,.custom-head h1,.dialog-title h2{
  letter-spacing:.025em !important;
  text-shadow:none !important;
}
.lead,.section-title p,.country-card p,.recipe-card p,.tab-card span,.cat-tile span,.meal-day-sub,.backup-note{
  color:var(--muted) !important;
}
.country-card:hover,.recipe-card:hover,.cat-tile:hover,.tab-card:hover,.btn:hover{transform:translateY(-1px) !important}
.country-card:active,.recipe-card:active,.cat-tile:active,.tab-card:active,.theme-btn:active,.theme-btn.tapped,.btn:active,.meal-dish-open:active{
  transform:scale(.995) !important;
  box-shadow:var(--pressed) !important;
}
.country-art-frame,.country-art,.meal-country-thumb,.brand-mark,.cemoji,.tab-icon,.cat-icon,.dish-icon{
  border-color:var(--theme-border) !important;
  box-shadow:0 8px 18px rgba(146,118,82,.065) !important;
}
body.dark .country-art-frame,body.dark .country-art,body.dark .meal-country-thumb,body.dark .brand-mark,body.dark .cemoji,body.dark .tab-icon,body.dark .cat-icon,body.dark .dish-icon{
  border-color:var(--theme-border) !important;
  box-shadow:0 8px 18px rgba(0,0,0,.15) !important;
}
#mealview .meal-calendar-panel,#mealview .meal-calendar-grid,#mealview .meal-day{
  box-shadow:none !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}
#mealview .meal-day{
  background:rgba(255,255,255,.30) !important;
  border-color:rgba(203,161,82,.20) !important;
}
body.dark #mealview .meal-day{
  background:rgba(74,81,86,.72) !important;
  border-color:rgba(0,0,0,.45) !important;
}


/* final alignment: home cards + dark controls palette cleanup */
.home-planner-row{
  grid-template-columns:repeat(2,minmax(260px,380px)) !important;
  max-width:820px !important;
  gap:22px !important;
  align-items:stretch !important;
  justify-content:center !important;
  justify-items:stretch !important;
  margin:18px auto 0 !important;
}
.home-my-card,.home-menu-card{
  min-height:206px !important;
  height:100% !important;
  width:100% !important;
  padding:22px 20px !important;
  display:grid !important;
  grid-template-rows:auto 1fr !important;
  place-items:center !important;
  align-content:center !important;
  justify-content:center !important;
  text-align:center !important;
  gap:14px !important;
  border-radius:30px !important;
}
.home-my-card .tab-icon,.home-menu-card .tab-icon{
  width:64px !important;
  height:64px !important;
  border-radius:24px !important;
  margin:0 auto !important;
}
.home-card-copy,.home-my-card>div:last-child,.home-menu-card>div:last-child{
  min-height:92px !important;
  display:grid !important;
  grid-template-rows:auto 1fr auto !important;
  justify-items:center !important;
  align-items:center !important;
  gap:8px !important;
  width:100% !important;
}
.home-my-card b,.home-menu-card b{
  font:400 27px/1.08 var(--title-font) !important;
  letter-spacing:.01em !important;
  text-align:center !important;
  margin:0 !important;
}
.home-my-card span,.home-menu-card span{
  display:block !important;
  max-width:280px !important;
  min-height:40px !important;
  margin:0 auto !important;
  text-align:center !important;
  color:var(--muted) !important;
  font-size:13.5px !important;
  line-height:1.45 !important;
  text-wrap:balance !important;
}
.home-my-card small,.home-menu-card small{
  display:inline-flex !important;
  justify-content:center !important;
  align-items:center !important;
  min-height:27px !important;
  min-width:72px !important;
  margin:0 auto !important;
  padding:5px 12px !important;
  border-radius:999px !important;
  color:var(--ink) !important;
  font-size:12px !important;
  font-weight:600 !important;
  background:rgba(255,255,255,.22) !important;
  border:1px solid var(--theme-border) !important;
  box-shadow:none !important;
}
body.dark .home-my-card small,body.dark .home-menu-card small{background:rgba(255,255,255,.055) !important}
.meal-country-card-art{justify-content:center !important;text-align:center !important}
.meal-country-thumb{background:transparent !important;border-color:var(--theme-border) !important}
.meal-country-img{width:100% !important;height:100% !important;object-fit:cover !important;display:block !important;border-radius:inherit !important}
body.dark .top-auth-status,
body.dark .auth-chip,
body.dark .auth-chip-primary,
body.dark .auth-close,
body.dark .auth-resend-btn,
body.dark .clear-filter,
body.dark .btn,
body.dark .btn.primary,
body.dark .btn.ghost,
body.dark .back-btn,
body.dark .close,
body.dark .theme-btn,
body.dark .pill,
body.dark .account-settings-card,
body.dark .account-info,
body.dark .meal-remove,
body.dark .meal-dish-open{
  background:linear-gradient(145deg,rgba(255,255,255,.055),rgba(36,41,46,.12)),var(--paper2) !important;
  border:1px solid var(--theme-border) !important;
  color:var(--ink) !important;
  box-shadow:0 7px 16px rgba(0,0,0,.13),0 1px 4px rgba(0,0,0,.09) !important;
}
body.dark .top-auth-status:hover,
body.dark .auth-chip:hover,
body.dark .auth-close:hover,
body.dark .clear-filter:hover,
body.dark .close:hover,
body.dark .btn:hover{
  background:linear-gradient(145deg,rgba(255,255,255,.07),rgba(36,41,46,.16)),var(--paper3) !important;
}
body.dark .auth-close,
body.dark .close{color:var(--ink) !important}
body.dark .clear-filter{color:var(--muted) !important}
body.dark #clearCat{background:linear-gradient(145deg,rgba(255,255,255,.055),rgba(36,41,46,.12)),var(--paper2) !important}
@media(max-width:900px){
  .home-planner-row{grid-template-columns:1fr !important;max-width:520px !important;gap:16px !important}
  .home-my-card,.home-menu-card{min-height:172px !important;padding:20px 18px !important}
  .home-card-copy,.home-my-card>div:last-child,.home-menu-card>div:last-child{min-height:84px !important}
}
@media(max-width:560px){
  .home-my-card,.home-menu-card{min-height:160px !important;border-radius:26px !important}
  .home-my-card .tab-icon,.home-menu-card .tab-icon{width:56px !important;height:56px !important;border-radius:21px !important}
  .home-my-card b,.home-menu-card b{font-size:24px !important}
  .home-my-card span,.home-menu-card span{font-size:12.5px !important;min-height:34px !important}
}


/* final rough paper texture override for both themes */
:root{
  --rough-dot-a:rgba(105,84,58,.050);
  --rough-dot-b:rgba(255,255,255,.12);
}
body.dark{
  --rough-dot-a:rgba(255,255,255,.050);
  --rough-dot-b:rgba(0,0,0,.18);
}
body::after{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:-1;
  opacity:.38;
  mix-blend-mode:multiply;
  background-image:
    radial-gradient(circle at 25% 20%,var(--rough-dot-a) 0 .8px,transparent 1.1px),
    radial-gradient(circle at 70% 75%,var(--rough-dot-b) 0 .7px,transparent 1.0px);
  background-size:8px 8px,10px 10px;
}
body.dark::after{
  opacity:.24;
  mix-blend-mode:screen;
}

.hero,.country-card,.tab-card,.cat-tile,.recipe-card,.panel,.dialog,.country-head,.custom-head,.stat,.my-item,
.btn,.input,.select,textarea,.auth-chip,.theme-btn,.back-btn,.pill,.topbar,.meal-picker-dialog,
.meal-type-card,.meal-saved-link,.meal-country-card,.meal-picker-back,.meal-calendar-panel,.meal-day,
.home-menu-card,.my-folder-card,.my-item-compact,.product-calc,.manual-kbju,.empty-box,
.brand-mark,.arrow,.tab-icon,.cat-icon,.dish-icon,.cemoji,.close,.meal-add-btn,.meal-save-btn,.meal-clear-btn{
  background-image:linear-gradient(180deg,rgba(255,255,255,.10),rgba(255,255,255,.02)) !important;
  background-size:auto !important;
  background-blend-mode:soft-light !important;
}
body.dark .hero,body.dark .country-card,body.dark .tab-card,body.dark .cat-tile,body.dark .recipe-card,
body.dark .panel,body.dark .dialog,body.dark .country-head,body.dark .custom-head,body.dark .stat,
body.dark .my-item,body.dark .btn,body.dark .input,body.dark .select,body.dark textarea,
body.dark .auth-chip,body.dark .theme-btn,body.dark .back-btn,body.dark .pill,body.dark .topbar,
body.dark .meal-picker-dialog,body.dark .meal-type-card,body.dark .meal-saved-link,
body.dark .meal-country-card,body.dark .meal-picker-back,body.dark .meal-calendar-panel,
body.dark .meal-day,body.dark .home-menu-card,body.dark .my-folder-card,body.dark .my-item-compact,
body.dark .product-calc,body.dark .manual-kbju,body.dark .empty-box,body.dark .brand-mark,
body.dark .arrow,body.dark .tab-icon,body.dark .cat-icon,body.dark .dish-icon,body.dark .cemoji,
body.dark .close,body.dark .meal-add-btn,body.dark .meal-save-btn,body.dark .meal-clear-btn{
  background-image:linear-gradient(180deg,rgba(255,255,255,.04),rgba(0,0,0,.10)) !important;
  background-size:auto !important;
  background-blend-mode:screen !important;
}

/* --- rough paper theme refinement --- */
:root{
  --texture-image:url('../assets/textures/paper-light-canvas.webp');
  --texture-opacity:.30;
  --surface-texture-opacity:.16;
  --surface-grad-1:rgba(255,255,255,.70);
  --surface-grad-2:rgba(250,244,230,.78);
  --surface-grad-3:rgba(245,215,205,.18);
}
body.dark{
  --texture-image:url('../assets/textures/paper-dark-canvas.webp');
  --texture-opacity:.20;
  --surface-texture-opacity:.12;
  --surface-grad-1:rgba(74,81,86,.82);
  --surface-grad-2:rgba(36,41,46,.92);
  --surface-grad-3:rgba(189,199,206,.05);
}

body{
  background:
    linear-gradient(180deg,#ffffff 0%, #faf4e6 100%) !important;
  background-attachment:fixed !important;
}
body.dark{
  background:
    linear-gradient(180deg,#bdc7ce 0%, #24292e 100%) !important;
  background-attachment:fixed !important;
}
body:before{
  content:"";
  position:fixed;
  inset:0;
  z-index:-1;
  pointer-events:none;
  opacity:var(--texture-opacity) !important;
  background-image:var(--texture-image) !important;
  background-repeat:repeat !important;
  background-size:420px auto !important;
  mix-blend-mode:multiply;
  mask-image:none !important;
}
body.dark:before{mix-blend-mode:screen}
body:after{
  content:"";
  position:fixed;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background:
    radial-gradient(circle at 18% 12%, rgba(245,215,205,.24), transparent 28%),
    radial-gradient(circle at 82% 12%, rgba(221,232,228,.18), transparent 26%),
    linear-gradient(180deg, rgba(255,255,255,.08), transparent 40%);
}
body.dark:after{
  background:
    radial-gradient(circle at 16% 10%, rgba(189,199,206,.10), transparent 26%),
    radial-gradient(circle at 84% 12%, rgba(74,81,86,.14), transparent 28%),
    linear-gradient(180deg, rgba(255,255,255,.02), transparent 38%);
}

.topbar,
.hero,.country-card,.tab-card,.cat-tile,.recipe-card,.panel,.dialog,.country-head,.custom-head,.stat,.my-item,
.btn,.back-btn,.theme-btn,.pill,.close,.clear-filter,
.field,input,textarea,select,.calendar-day,.meal-slot,.recipe-chip,.user-chip,.timer-mini,.day-saved-list a,.day-saved-list button{
  background-color:var(--paper) !important;
  background-image:
    linear-gradient(180deg, var(--surface-grad-1), var(--surface-grad-2) 72%, var(--surface-grad-3)),
    var(--texture-image) !important;
  background-repeat:no-repeat, repeat !important;
  background-size:auto, 320px auto !important;
  background-position:center, center !important;
  background-blend-mode:normal, multiply !important;
}
body.dark .topbar,
body.dark .hero,body.dark .country-card,body.dark .tab-card,body.dark .cat-tile,body.dark .recipe-card,body.dark .panel,body.dark .dialog,body.dark .country-head,body.dark .custom-head,body.dark .stat,body.dark .my-item,
body.dark .btn,body.dark .back-btn,body.dark .theme-btn,body.dark .pill,body.dark .close,body.dark .clear-filter,
body.dark .field,body.dark input,body.dark textarea,body.dark select,body.dark .calendar-day,body.dark .meal-slot,body.dark .recipe-chip,body.dark .user-chip,body.dark .timer-mini,body.dark .day-saved-list a,body.dark .day-saved-list button{
  background-blend-mode:normal, screen !important;
}

.hero,.country-card,.tab-card,.cat-tile,.recipe-card,.panel,.dialog,.country-head,.custom-head,.stat,.my-item,
.btn,.back-btn,.theme-btn,.pill,.close,.clear-filter,.field,input,textarea,select{
  box-shadow:
    0 12px 28px rgba(95,82,68,.08),
    0 2px 8px rgba(95,82,68,.05),
    inset 0 0 0 1px var(--gold-ring),
    inset 0 0 0 3px var(--gold-ring-soft),
    var(--inner) !important;
}
body.dark .hero,body.dark .country-card,body.dark .tab-card,body.dark .cat-tile,body.dark .recipe-card,body.dark .panel,body.dark .dialog,body.dark .country-head,body.dark .custom-head,body.dark .stat,body.dark .my-item,
body.dark .btn,body.dark .back-btn,body.dark .theme-btn,body.dark .pill,body.dark .close,body.dark .clear-filter,body.dark .field,body.dark input,body.dark textarea,body.dark select{
  box-shadow:
    0 14px 30px rgba(0,0,0,.20),
    0 2px 10px rgba(0,0,0,.18),
    inset 0 0 0 1px rgba(0,0,0,.42),
    inset 0 0 0 2px rgba(255,255,255,.04),
    inset 0 1px 0 rgba(255,255,255,.03) !important;
}

button:hover,.btn:hover,.back-btn:hover,.theme-btn:hover,.close:hover,.clear-filter:hover,
.country-card:hover,.tab-card:hover,.cat-tile:hover,.recipe-card:hover{
  transform:translateY(-1px);
}

/* --- final rough paper + crisp frame pass --- */
:root{
  --rough-paper-opacity:.58;
  --rough-paper-surface:.28;
  --frame-main:rgba(187,142,72,.66);
  --frame-soft:rgba(222,194,142,.38);
  --frame-inner:rgba(255,255,255,.56);
  --frame-shadow:rgba(113,89,61,.11);
}
body.dark{
  --rough-paper-opacity:.46;
  --rough-paper-surface:.24;
  --frame-main:rgba(5,5,5,.76);
  --frame-soft:rgba(189,199,206,.16);
  --frame-inner:rgba(255,255,255,.055);
  --frame-shadow:rgba(0,0,0,.42);
}
body:before{
  opacity:var(--rough-paper-opacity) !important;
  background-image:var(--texture-image) !important;
  background-size:360px auto !important;
  background-blend-mode:multiply !important;
  filter:contrast(1.18) saturate(.82) !important;
}
body.dark:before{
  background-image:var(--texture-image) !important;
  background-size:360px auto !important;
  background-blend-mode:screen !important;
  filter:contrast(1.26) saturate(.74) !important;
}
body:after{
  opacity:.92;
  background:
    radial-gradient(circle at 16% 10%, rgba(245,215,205,.20), transparent 30%),
    radial-gradient(circle at 84% 12%, rgba(221,232,228,.16), transparent 28%),
    linear-gradient(135deg, rgba(255,255,255,.20), transparent 38%, rgba(250,244,230,.12) 100%);
}
body.dark:after{
  opacity:.95;
  background:
    radial-gradient(circle at 18% 12%, rgba(189,199,206,.10), transparent 30%),
    radial-gradient(circle at 82% 14%, rgba(74,81,86,.12), transparent 28%),
    linear-gradient(135deg, rgba(189,199,206,.07), transparent 42%, rgba(36,41,46,.18) 100%);
}

.topbar,
.hero,.country-card,.tab-card,.cat-tile,.recipe-card,.panel,.dialog,.country-head,.custom-head,.stat,.my-item,
.btn,.back-btn,.theme-btn,.pill,.close,.clear-filter,.auth-chip,.top-auth-status,
.input,.textarea,.select,input,textarea,select,.meal-day,.meal-slot,.meal-calendar-panel,
.home-menu-card,.my-folder-card,.my-item-compact,.meal-type-card,.meal-country-card,.meal-picker-card,.meal-saved-link,
.account-settings-card,.account-info,.product-calc,.manual-kbju,.empty-box,.brand-mark{
  border:1px solid var(--frame-main) !important;
  outline:1px solid var(--frame-soft);
  outline-offset:-4px;
  box-shadow:
    0 11px 24px var(--frame-shadow),
    0 2px 7px rgba(91,72,52,.05),
    inset 0 1px 0 var(--frame-inner),
    inset 0 -1px 0 rgba(122,91,48,.08) !important;
  background-image:
    linear-gradient(180deg, var(--surface-grad-1), var(--surface-grad-2) 72%, var(--surface-grad-3)),
    var(--texture-image) !important;
  background-size:auto,260px auto !important;
  background-blend-mode:normal,multiply !important;
}
body.dark .topbar,
body.dark .hero,body.dark .country-card,body.dark .tab-card,body.dark .cat-tile,body.dark .recipe-card,body.dark .panel,body.dark .dialog,body.dark .country-head,body.dark .custom-head,body.dark .stat,body.dark .my-item,
body.dark .btn,body.dark .back-btn,body.dark .theme-btn,body.dark .pill,body.dark .close,body.dark .clear-filter,body.dark .auth-chip,body.dark .top-auth-status,
body.dark .input,body.dark .textarea,body.dark .select,body.dark input,body.dark textarea,body.dark select,body.dark .meal-day,body.dark .meal-slot,body.dark .meal-calendar-panel,
body.dark .home-menu-card,body.dark .my-folder-card,body.dark .my-item-compact,body.dark .meal-type-card,body.dark .meal-country-card,body.dark .meal-picker-card,body.dark .meal-saved-link,
body.dark .account-settings-card,body.dark .account-info,body.dark .product-calc,body.dark .manual-kbju,body.dark .empty-box,body.dark .brand-mark{
  border-color:var(--frame-main) !important;
  outline-color:var(--frame-soft);
  box-shadow:
    0 12px 26px var(--frame-shadow),
    0 2px 9px rgba(0,0,0,.24),
    inset 0 1px 0 var(--frame-inner),
    inset 0 -1px 0 rgba(0,0,0,.38) !important;
  background-blend-mode:normal,screen,screen,multiply !important;
}

.country-card,.recipe-card,.tab-card,.cat-tile,.panel,.hero,.dialog,.country-head,.custom-head{outline-offset:-5px}
.btn,.back-btn,.theme-btn,.close,.auth-chip,.top-auth-status{outline-offset:-3px}
.meal-day.empty,.meal-day.outside{box-shadow:none !important;outline-color:transparent !important;border-color:rgba(187,142,72,.24) !important;background-image:none !important;background:transparent !important}
body.dark .meal-day.empty,body.dark .meal-day.outside{border-color:rgba(5,5,5,.36) !important;background:transparent !important}

/* --- seamless matte paper texture override --- */
:root{
  --seamless-paper-opacity:.44;
  --seamless-surface-opacity:.14;
}
body.dark{
  --seamless-paper-opacity:.34;
  --seamless-surface-opacity:.12;
}
body:before{
  opacity:var(--seamless-paper-opacity) !important;
  background-image:
    radial-gradient(circle at 18% 16%, rgba(255,255,255,.18), transparent 28%),
    radial-gradient(circle at 84% 10%, rgba(245,215,205,.14), transparent 24%),
    radial-gradient(circle at 62% 74%, rgba(221,232,228,.12), transparent 26%),
    var(--texture-image) !important;
  background-size:auto,auto,auto,cover !important;
  background-position:center center,center center,center center,center center !important;
  background-repeat:no-repeat,no-repeat,no-repeat,no-repeat !important;
  background-blend-mode:screen,normal,normal,multiply !important;
  filter:contrast(1.03) saturate(.78) !important;
}
body.dark:before{
  background-image:
    radial-gradient(circle at 20% 15%, rgba(189,199,206,.10), transparent 28%),
    radial-gradient(circle at 80% 14%, rgba(74,81,86,.12), transparent 24%),
    radial-gradient(circle at 56% 72%, rgba(0,0,0,.16), transparent 26%),
    var(--texture-image) !important;
  background-size:auto,auto,auto,cover !important;
  background-position:center center,center center,center center,center center !important;
  background-repeat:no-repeat,no-repeat,no-repeat,no-repeat !important;
  background-blend-mode:screen,normal,multiply,screen !important;
  filter:contrast(1.06) saturate(.7) !important;
}

.topbar,
.hero,.country-card,.tab-card,.cat-tile,.recipe-card,.panel,.dialog,.country-head,.custom-head,.stat,.my-item,
.btn,.back-btn,.theme-btn,.pill,.close,.clear-filter,.auth-chip,.top-auth-status,
.input,.textarea,.select,input,textarea,select,.meal-day,.meal-slot,.meal-calendar-panel,
.home-menu-card,.my-folder-card,.my-item-compact,.meal-type-card,.meal-country-card,.meal-picker-card,.meal-saved-link,
.account-settings-card,.account-info,.product-calc,.manual-kbju,.empty-box,.brand-mark{
  background-image:
    linear-gradient(180deg, var(--surface-grad-1), var(--surface-grad-2) 72%, var(--surface-grad-3)),
    linear-gradient(180deg, rgba(255,255,255,var(--seamless-surface-opacity)), rgba(255,255,255,0)),
    var(--texture-image) !important;
  background-size:auto,auto,cover !important;
  background-position:center center,center center,center center !important;
  background-repeat:no-repeat,no-repeat,no-repeat !important;
  background-blend-mode:normal,screen,multiply !important;
}
body.dark .topbar,
body.dark .hero,body.dark .country-card,body.dark .tab-card,body.dark .cat-tile,body.dark .recipe-card,body.dark .panel,body.dark .dialog,body.dark .country-head,body.dark .custom-head,body.dark .stat,body.dark .my-item,
body.dark .btn,body.dark .back-btn,body.dark .theme-btn,body.dark .pill,body.dark .close,body.dark .clear-filter,body.dark .auth-chip,body.dark .top-auth-status,
body.dark .input,body.dark .textarea,body.dark .select,body.dark input,body.dark textarea,body.dark select,body.dark .meal-day,body.dark .meal-slot,body.dark .meal-calendar-panel,
body.dark .home-menu-card,body.dark .my-folder-card,body.dark .my-item-compact,body.dark .meal-type-card,body.dark .meal-country-card,body.dark .meal-picker-card,body.dark .meal-saved-link,
body.dark .account-settings-card,body.dark .account-info,body.dark .product-calc,body.dark .manual-kbju,body.dark .empty-box,body.dark .brand-mark{
  background-image:
    linear-gradient(180deg, var(--surface-grad-1), var(--surface-grad-2) 72%, var(--surface-grad-3)),
    linear-gradient(180deg, rgba(255,255,255,.035), rgba(0,0,0,.04)),
    var(--texture-image) !important;
  background-size:auto,auto,cover !important;
  background-position:center center,center center,center center !important;
  background-repeat:no-repeat,no-repeat,no-repeat !important;
  background-blend-mode:normal,screen,screen !important;
}

.meal-day.empty,.meal-day.outside{
  background-image:none !important;
}


/* --- final seamless rough paper canvas + dark country image mat --- */
:root{
  --texture-image:url('../assets/textures/paper-light-canvas.webp');
  --seamless-paper-opacity:.72;
  --seamless-surface-opacity:.10;
  --paper-canvas-blend:multiply;
}
body.dark{
  --texture-image:url('../assets/textures/paper-dark-canvas.webp');
  --seamless-paper-opacity:.76;
  --seamless-surface-opacity:.045;
  --paper-canvas-blend:screen;
}
body:before{
  opacity:var(--seamless-paper-opacity) !important;
  background-image:var(--texture-image) !important;
  background-size:cover !important;
  background-position:center center !important;
  background-repeat:no-repeat !important;
  background-attachment:fixed !important;
  background-blend-mode:normal !important;
  filter:contrast(1.12) saturate(.82) !important;
  mask-image:none !important;
}
body.dark:before{
  background-image:var(--texture-image) !important;
  background-size:cover !important;
  background-repeat:no-repeat !important;
  background-attachment:fixed !important;
  filter:contrast(1.18) saturate(.76) !important;
}
body:after{
  opacity:.72 !important;
  background:
    radial-gradient(circle at 18% 12%, rgba(255,255,255,.22), transparent 30%),
    radial-gradient(circle at 82% 18%, rgba(245,215,205,.13), transparent 28%),
    linear-gradient(135deg, rgba(255,255,255,.14), transparent 46%, rgba(250,244,230,.08)) !important;
}
body.dark:after{
  opacity:.62 !important;
  background:
    radial-gradient(circle at 22% 14%, rgba(189,199,206,.08), transparent 30%),
    radial-gradient(circle at 80% 20%, rgba(0,0,0,.12), transparent 30%),
    linear-gradient(135deg, rgba(189,199,206,.045), transparent 46%, rgba(0,0,0,.16)) !important;
}
.topbar,
.hero,.country-card,.tab-card,.cat-tile,.recipe-card,.panel,.dialog,.country-head,.custom-head,.stat,.my-item,
.btn,.back-btn,.theme-btn,.pill,.close,.clear-filter,.auth-chip,.top-auth-status,
.input,.textarea,.select,input,textarea,select,.meal-day,.meal-slot,.meal-calendar-panel,
.home-menu-card,.my-folder-card,.my-item-compact,.meal-type-card,.meal-country-card,.meal-picker-card,.meal-saved-link,
.account-settings-card,.account-info,.product-calc,.manual-kbju,.empty-box,.brand-mark{
  background-image:
    linear-gradient(180deg, var(--surface-grad-1), var(--surface-grad-2) 72%, var(--surface-grad-3)),
    linear-gradient(180deg, rgba(255,255,255,var(--seamless-surface-opacity)), rgba(255,255,255,0)) !important;
  background-size:auto,auto !important;
  background-position:center center,center center !important;
  background-repeat:no-repeat,no-repeat !important;
  background-blend-mode:normal,screen !important;
}
body.dark .topbar,
body.dark .hero,body.dark .country-card,body.dark .tab-card,body.dark .cat-tile,body.dark .recipe-card,body.dark .panel,body.dark .dialog,body.dark .country-head,body.dark .custom-head,body.dark .stat,body.dark .my-item,
body.dark .btn,body.dark .back-btn,body.dark .theme-btn,body.dark .pill,body.dark .close,body.dark .clear-filter,body.dark .auth-chip,body.dark .top-auth-status,
body.dark .input,body.dark .textarea,body.dark .select,body.dark input,body.dark textarea,body.dark select,body.dark .meal-day,body.dark .meal-slot,body.dark .meal-calendar-panel,
body.dark .home-menu-card,body.dark .my-folder-card,body.dark .my-item-compact,body.dark .meal-type-card,body.dark .meal-country-card,body.dark .meal-picker-card,body.dark .meal-saved-link,
body.dark .account-settings-card,body.dark .account-info,body.dark .product-calc,body.dark .manual-kbju,body.dark .empty-box,body.dark .brand-mark{
  background-image:
    linear-gradient(180deg, var(--surface-grad-1), var(--surface-grad-2) 72%, var(--surface-grad-3)),
    linear-gradient(180deg, rgba(255,255,255,.035), rgba(0,0,0,.055)) !important;
  background-blend-mode:normal,screen !important;
}
.country-img-dark{display:none !important}
body.dark .country-img-light{display:none !important}
body.dark .country-img-dark{display:block !important}
body.dark .country-art-frame,
body.dark .meal-country-thumb{
  background:#000 !important;
  border-color:rgba(0,0,0,.82) !important;
  outline:1px solid rgba(189,199,206,.12) !important;
  box-shadow:0 8px 18px rgba(0,0,0,.18), inset 0 0 0 1px rgba(255,255,255,.035) !important;
}
body.dark .country-art,
body.dark .meal-country-img{
  background:#000 !important;
}

/* --- patch: seamless one-canvas paper texture + dark country icon mats --- */
:root{
  --texture-image:url('../assets/textures/paper-light-canvas.webp');
  --texture-opacity:.62;
  --paper-haze-1:rgba(255,255,255,.34);
  --paper-haze-2:rgba(250,244,230,.18);
}
body.dark{
  --texture-image:url('../assets/textures/paper-dark-canvas.webp');
  --texture-opacity:.56;
  --paper-haze-1:rgba(189,199,206,.06);
  --paper-haze-2:rgba(0,0,0,.18);
}
body{
  background:
    linear-gradient(180deg,#ffffff 0%, #faf4e6 100%) !important;
}
body.dark{
  background:
    linear-gradient(180deg,#bdc7ce 0%, #24292e 100%) !important;
}
body:before{
  content:"" !important;
  position:fixed !important;
  inset:0 !important;
  z-index:-2 !important;
  pointer-events:none !important;
  opacity:var(--texture-opacity) !important;
  background-image:var(--texture-image) !important;
  background-repeat:no-repeat !important;
  background-size:cover !important;
  background-position:center center !important;
  background-attachment:fixed !important;
  mix-blend-mode:multiply !important;
  filter:contrast(1.06) saturate(.88) !important;
  mask-image:none !important;
}
body.dark:before{
  mix-blend-mode:screen !important;
  filter:contrast(1.08) saturate(.82) brightness(.96) !important;
}
body:after{
  content:"" !important;
  position:fixed !important;
  inset:0 !important;
  z-index:-1 !important;
  pointer-events:none !important;
  background:
    radial-gradient(circle at 16% 10%, var(--paper-haze-1), transparent 28%),
    radial-gradient(circle at 82% 14%, var(--paper-haze-2), transparent 26%),
    linear-gradient(180deg, rgba(255,255,255,.06), transparent 32%, rgba(255,255,255,.03) 72%, transparent) !important;
  opacity:.92 !important;
}
/* remove remaining patterned striping from surfaces */
.hero,.country-card,.tab-card,.cat-tile,.recipe-card,.panel,.dialog,.country-head,.custom-head,.stat,.my-item,
.home-menu-card,.home-calendar-card,.meal-day,.meal-slot,.meal-calendar-panel,.meal-picker-card,.meal-step-card,.meal-country-card,.meal-recipe-card,
.account-settings-card,.auth-popover,.account-info,.my-folder-card,.my-item-compact,.product-calc,.manual-kbju,.empty-box,
.btn,.input,.select,textarea,.theme-btn,.back-btn,.pill,.close,.clear-filter,.auth-chip,.topbar,.brand-mark,.arrow,.tab-icon,.cat-icon,.dish-icon,.cemoji,
.meal-add-btn,.meal-save-btn,.meal-clear-btn{
  background-blend-mode:normal,screen !important;
  background-size:auto,auto !important;
}
body.dark .country-art-frame,
body.dark .meal-country-thumb,
body.dark .country-card .cemoji{
  background:#050505 !important;
  border-color:rgba(189,199,206,.18) !important;
  box-shadow:0 8px 18px rgba(0,0,0,.18) !important;
}

/* --- final rough paper theme refinement --- */
:root{
  --texture-image:url('../assets/textures/paper-light-canvas.webp') !important;
  --texture-opacity:.82;
  --paper-frame-main:rgba(184,137,61,.72);
  --paper-frame-soft:rgba(218,180,109,.52);
  --paper-frame-inner:rgba(255,255,255,.70);
  --paper-frame-shadow:rgba(142,112,68,.10);
  --surface-grad-1:rgba(255,255,255,.78);
  --surface-grad-2:rgba(250,244,230,.88);
  --surface-grad-3:rgba(247,237,220,.82);
}
body.dark{
  --texture-image:url('../assets/textures/paper-dark-canvas.webp') !important;
  --texture-opacity:.72;
  --paper-frame-main:rgba(5,5,5,.86);
  --paper-frame-soft:rgba(189,199,206,.18);
  --paper-frame-inner:rgba(189,199,206,.075);
  --paper-frame-shadow:rgba(0,0,0,.28);
  --surface-grad-1:rgba(74,81,86,.94);
  --surface-grad-2:rgba(68,75,80,.96);
  --surface-grad-3:rgba(58,64,69,.96);
}
body{
  background:linear-gradient(180deg,#ffffff 0%,#faf4e6 100%) !important;
}
body.dark{
  background:linear-gradient(180deg,#bdc7ce 0%,#24292e 100%) !important;
}
body:before{
  content:"" !important;
  position:fixed !important;
  inset:0 !important;
  z-index:-2 !important;
  pointer-events:none !important;
  opacity:var(--texture-opacity) !important;
  background-image:var(--texture-image) !important;
  background-size:cover !important;
  background-position:center center !important;
  background-repeat:no-repeat !important;
  background-attachment:fixed !important;
  mix-blend-mode:multiply !important;
  filter:contrast(1.18) saturate(.78) !important;
  mask-image:none !important;
}
body.dark:before{
  mix-blend-mode:screen !important;
  filter:contrast(1.22) saturate(.72) brightness(.92) !important;
}
body:after{
  content:"" !important;
  position:fixed !important;
  inset:0 !important;
  z-index:-1 !important;
  pointer-events:none !important;
  opacity:.88 !important;
  background:
    radial-gradient(circle at 18% 10%,rgba(255,255,255,.30),transparent 30%),
    radial-gradient(circle at 84% 15%,rgba(245,215,205,.16),transparent 28%),
    linear-gradient(180deg,rgba(255,255,255,.08),transparent 38%,rgba(250,244,230,.07)) !important;
}
body.dark:after{
  opacity:.48 !important;
  background:
    radial-gradient(circle at 20% 13%,rgba(189,199,206,.08),transparent 32%),
    radial-gradient(circle at 80% 16%,rgba(0,0,0,.24),transparent 30%),
    linear-gradient(180deg,rgba(189,199,206,.04),transparent 38%,rgba(0,0,0,.18)) !important;
}
.topbar,
.hero,.country-card,.tab-card,.cat-tile,.recipe-card,.panel,.dialog,.country-head,.custom-head,.stat,.my-item,
.home-menu-card,.home-calendar-card,.meal-day,.meal-slot,.meal-calendar-panel,.meal-picker-card,.meal-step-card,.meal-country-card,.meal-recipe-card,
.account-settings-card,.auth-popover,.account-info,.my-folder-card,.my-item-compact,.product-calc,.manual-kbju,.empty-box,
.btn,.input,.select,textarea,.theme-btn,.back-btn,.pill,.close,.clear-filter,.auth-chip,.top-auth-status,.brand-mark,.arrow,.tab-icon,.cat-icon,.dish-icon,.cemoji,
.meal-add-btn,.meal-save-btn,.meal-clear-btn,.meal-dish-open,.meal-remove,.meal-picker-back,.meal-saved-link{
  border:1px solid var(--paper-frame-main) !important;
  outline:1px solid var(--paper-frame-soft) !important;
  outline-offset:-4px !important;
  background-image:
    linear-gradient(180deg,var(--surface-grad-1),var(--surface-grad-2) 70%,var(--surface-grad-3)) !important;
  background-blend-mode:normal !important;
  box-shadow:
    0 8px 18px var(--paper-frame-shadow),
    inset 0 1px 0 var(--paper-frame-inner),
    inset 0 -1px 0 rgba(118,84,36,.08) !important;
}
body.dark .topbar,
body.dark .hero,body.dark .country-card,body.dark .tab-card,body.dark .cat-tile,body.dark .recipe-card,body.dark .panel,body.dark .dialog,body.dark .country-head,body.dark .custom-head,body.dark .stat,body.dark .my-item,
body.dark .home-menu-card,body.dark .home-calendar-card,body.dark .meal-day,body.dark .meal-slot,body.dark .meal-calendar-panel,body.dark .meal-picker-card,body.dark .meal-step-card,body.dark .meal-country-card,body.dark .meal-recipe-card,
body.dark .account-settings-card,body.dark .auth-popover,body.dark .account-info,body.dark .my-folder-card,body.dark .my-item-compact,body.dark .product-calc,body.dark .manual-kbju,body.dark .empty-box,
body.dark .btn,body.dark .input,body.dark .select,body.dark textarea,body.dark .theme-btn,body.dark .back-btn,body.dark .pill,body.dark .close,body.dark .clear-filter,body.dark .auth-chip,body.dark .top-auth-status,body.dark .brand-mark,body.dark .arrow,body.dark .tab-icon,body.dark .cat-icon,body.dark .dish-icon,body.dark .cemoji,
body.dark .meal-add-btn,body.dark .meal-save-btn,body.dark .meal-clear-btn,body.dark .meal-dish-open,body.dark .meal-remove,body.dark .meal-picker-back,body.dark .meal-saved-link{
  border-color:var(--paper-frame-main) !important;
  outline-color:var(--paper-frame-soft) !important;
  box-shadow:
    0 8px 18px var(--paper-frame-shadow),
    inset 0 1px 0 var(--paper-frame-inner),
    inset 0 -1px 0 rgba(0,0,0,.42) !important;
}
.btn,.back-btn,.theme-btn,.close,.auth-chip,.top-auth-status,.meal-add-btn,.meal-save-btn,.meal-clear-btn,.meal-picker-back{
  outline-offset:-3px !important;
}
.meal-day.empty,.meal-day.outside{
  border-color:rgba(184,137,61,.22) !important;
  outline-color:transparent !important;
  background:transparent !important;
  box-shadow:none !important;
}
body.dark .meal-day.empty,body.dark .meal-day.outside{
  border-color:rgba(5,5,5,.28) !important;
  outline-color:transparent !important;
  background:transparent !important;
  box-shadow:none !important;
}
body.dark .country-art-frame,
body.dark .meal-country-thumb,
body.dark .country-card .cemoji{
  background:#1f2428 !important;
  border-color:rgba(5,5,5,.88) !important;
  outline:1px solid rgba(189,199,206,.16) !important;
  box-shadow:0 6px 14px rgba(0,0,0,.22), inset 0 0 0 1px rgba(255,255,255,.035) !important;
}
body.dark .country-art,
body.dark .meal-country-img{
  background:#1f2428 !important;
}


/* --- FINAL THEME FIX: luxury rough paper + clean controls + dark country art --- */
:root{
  --texture-image:url('../assets/textures/paper-light-canvas.webp') !important;
  --texture-opacity:.92 !important;
  --bg:#ffffff !important;
  --bg2:#FAF4E6 !important;
  --paper:#fff9ee !important;
  --paper2:#FAF4E6 !important;
  --paper3:#fffdf8 !important;
  --ink:#3f3934 !important;
  --muted:#847971 !important;
  --theme-border:rgba(177,128,48,.78) !important;
  --paper-frame-main:rgba(177,128,48,.78) !important;
  --paper-frame-soft:rgba(225,194,132,.55) !important;
  --paper-frame-inner:rgba(255,255,255,.72) !important;
  --surface-grad-1:rgba(255,255,255,.82) !important;
  --surface-grad-2:rgba(250,244,230,.94) !important;
  --surface-grad-3:rgba(247,237,220,.88) !important;
  --control-bg:linear-gradient(180deg,rgba(255,255,255,.86),rgba(250,244,230,.94)) !important;
  --surface-shadow:0 10px 22px rgba(116,89,47,.10),0 2px 7px rgba(116,89,47,.065) !important;
}
body.dark{
  --texture-image:url('../assets/textures/paper-dark-canvas.webp') !important;
  --texture-opacity:.84 !important;
  --bg:#bdc7ce !important;
  --bg2:#24292e !important;
  --paper:#4a5156 !important;
  --paper2:#42494e !important;
  --paper3:#555e64 !important;
  --ink:#eef3f4 !important;
  --muted:#c7d0d4 !important;
  --theme-border:rgba(0,0,0,.86) !important;
  --paper-frame-main:rgba(0,0,0,.86) !important;
  --paper-frame-soft:rgba(189,199,206,.24) !important;
  --paper-frame-inner:rgba(255,255,255,.075) !important;
  --surface-grad-1:rgba(74,81,86,.98) !important;
  --surface-grad-2:rgba(66,73,78,.98) !important;
  --surface-grad-3:rgba(58,64,69,.98) !important;
  --control-bg:linear-gradient(180deg,rgba(83,91,96,.98),rgba(66,73,78,.98)) !important;
  --surface-shadow:0 10px 22px rgba(0,0,0,.26),0 2px 8px rgba(0,0,0,.20) !important;
}
body{
  background:linear-gradient(180deg,#ffffff 0%,#FAF4E6 100%) !important;
  background-attachment:fixed !important;
}
body.dark{
  background:linear-gradient(180deg,#bdc7ce 0%,#808a92 28%,#4a5156 58%,#24292e 100%) !important;
  background-attachment:fixed !important;
}
body:before{
  content:"" !important;
  position:fixed !important;
  inset:0 !important;
  z-index:-2 !important;
  pointer-events:none !important;
  opacity:var(--texture-opacity) !important;
  background-image:var(--texture-image) !important;
  background-repeat:no-repeat !important;
  background-size:cover !important;
  background-position:center center !important;
  background-attachment:fixed !important;
  mix-blend-mode:multiply !important;
  filter:contrast(1.16) saturate(.82) !important;
  mask-image:none !important;
}
body.dark:before{
  mix-blend-mode:screen !important;
  filter:contrast(1.16) saturate(.72) brightness(.86) !important;
}
body:after{
  content:"" !important;
  position:fixed !important;
  inset:0 !important;
  z-index:-1 !important;
  pointer-events:none !important;
  opacity:.72 !important;
  background:linear-gradient(180deg,rgba(255,255,255,.18),transparent 36%,rgba(250,244,230,.08)) !important;
}
body.dark:after{
  opacity:.52 !important;
  background:linear-gradient(180deg,rgba(189,199,206,.08),transparent 35%,rgba(0,0,0,.16)) !important;
}
/* surfaces keep matte paper color, but no visible repeated pattern on buttons */
.topbar,
.hero,.country-card,.tab-card,.cat-tile,.recipe-card,.panel,.dialog,.country-head,.custom-head,.stat,.my-item,
.home-menu-card,.home-calendar-card,.meal-day,.meal-slot,.meal-calendar-panel,.meal-picker-card,.meal-step-card,.meal-country-card,.meal-recipe-card,
.account-settings-card,.auth-popover,.account-info,.my-folder-card,.my-item-compact,.product-calc,.manual-kbju,.empty-box{
  border:1px solid var(--paper-frame-main) !important;
  outline:1px solid var(--paper-frame-soft) !important;
  outline-offset:-4px !important;
  background-color:var(--paper) !important;
  background-image:linear-gradient(180deg,var(--surface-grad-1),var(--surface-grad-2) 68%,var(--surface-grad-3)) !important;
  background-blend-mode:normal !important;
  box-shadow:var(--surface-shadow),inset 0 1px 0 var(--paper-frame-inner) !important;
}
.btn,.input,.select,textarea,input,select,.theme-btn,.back-btn,.pill,.close,.clear-filter,.auth-chip,.top-auth-status,.brand-mark,.arrow,.tab-icon,.cat-icon,.dish-icon,.cemoji,
.meal-add-btn,.meal-save-btn,.meal-clear-btn,.meal-dish-open,.meal-remove,.meal-picker-back,.meal-saved-link,.auth-close,.auth-resend-btn,.compact-btn,.product-remove{
  border:1px solid var(--paper-frame-main) !important;
  outline:1px solid var(--paper-frame-soft) !important;
  outline-offset:-3px !important;
  background-color:var(--paper2) !important;
  background-image:var(--control-bg) !important;
  background-blend-mode:normal !important;
  box-shadow:0 6px 14px rgba(116,89,47,.075),inset 0 1px 0 var(--paper-frame-inner) !important;
  filter:none !important;
}
body.dark .btn,body.dark .input,body.dark .select,body.dark textarea,body.dark input,body.dark select,body.dark .theme-btn,body.dark .back-btn,body.dark .pill,body.dark .close,body.dark .clear-filter,body.dark .auth-chip,body.dark .top-auth-status,body.dark .brand-mark,body.dark .arrow,body.dark .tab-icon,body.dark .cat-icon,body.dark .dish-icon,body.dark .cemoji,
body.dark .meal-add-btn,body.dark .meal-save-btn,body.dark .meal-clear-btn,body.dark .meal-dish-open,body.dark .meal-remove,body.dark .meal-picker-back,body.dark .meal-saved-link,body.dark .auth-close,body.dark .auth-resend-btn,body.dark .compact-btn,body.dark .product-remove{
  box-shadow:0 6px 14px rgba(0,0,0,.22),inset 0 1px 0 var(--paper-frame-inner) !important;
  color:var(--ink) !important;
}
button:before,.btn:before,.auth-chip:before,.top-auth-status:before,.close:before,.clear-filter:before,.theme-btn:before,.back-btn:before,.meal-add-btn:before,.meal-save-btn:before,.meal-clear-btn:before{
  background-image:none !important;
  background:none !important;
  opacity:0 !important;
}
/* The country artwork now has separate clean day/night variants */
.country-img-dark{display:none !important;visibility:hidden !important}
.country-img-light{display:block !important;visibility:visible !important}
body.dark .country-img-light{display:none !important;visibility:hidden !important}
body.dark .country-img-dark{display:block !important;visibility:visible !important}
.country-art-frame,
.meal-country-thumb{
  background:#f4eadb !important;
  border:1px solid var(--paper-frame-main) !important;
  outline:1px solid var(--paper-frame-soft) !important;
  outline-offset:-4px !important;
  box-shadow:0 8px 18px rgba(116,89,47,.10) !important;
}
body.dark .country-art-frame,
body.dark .meal-country-thumb,
body.dark .country-card .cemoji{
  background:#24292e !important;
  border-color:rgba(0,0,0,.86) !important;
  outline-color:rgba(189,199,206,.18) !important;
  box-shadow:0 8px 18px rgba(0,0,0,.22) !important;
}
.country-art,.meal-country-img{
  background:transparent !important;
  display:block !important;
}
body.dark .country-art,body.dark .meal-country-img{
  background:transparent !important;
}
/* keep empty calendar cells free from any texture, data look or hit area */
.meal-day.empty,.meal-day.outside,.meal-day-empty{
  background:transparent !important;
  background-image:none !important;
  border-color:transparent !important;
  outline-color:transparent !important;
  box-shadow:none !important;
  pointer-events:none !important;
}


/* --- NIGHT KITCHEN THEME REWORK: book-frame hero, warm top light, dark icon assets --- */
:root{
  --bg:#ffffff !important;
  --bg2:#FAF4E6 !important;
  --paper:#fff9ee !important;
  --paper2:#FAF4E6 !important;
  --paper3:#F5EADF !important;
  --ink:#3e352e !important;
  --muted:#86786d !important;
  --gold:#c9a25b !important;
  --gold2:#e3c483 !important;
  --paper-frame-main:rgba(197,152,76,.72) !important;
  --paper-frame-soft:rgba(240,220,181,.82) !important;
  --surface-grad-1:rgba(255,255,255,.90) !important;
  --surface-grad-2:rgba(250,244,230,.96) !important;
  --surface-grad-3:rgba(245,234,223,.74) !important;
  --surface-shadow:0 12px 26px rgba(143,111,73,.10),0 4px 12px rgba(143,111,73,.07) !important;
  --control-bg:linear-gradient(180deg,rgba(255,255,255,.92),rgba(250,244,230,.98)) !important;
}
body.dark{
  --bg:#0c1a33 !important;
  --bg2:#204b93 !important;
  --paper:#182c50 !important;
  --paper2:#1d3560 !important;
  --paper3:#214173 !important;
  --ink:#f6ead0 !important;
  --muted:#c4d0e2 !important;
  --gold:#e2bb71 !important;
  --gold2:#f0d79a !important;
  --paper-frame-main:rgba(231,195,124,.56) !important;
  --paper-frame-soft:rgba(112,146,212,.26) !important;
  --paper-frame-inner:rgba(255,239,203,.10) !important;
  --theme-border:rgba(231,195,124,.46) !important;
  --surface-grad-1:rgba(34,60,104,.94) !important;
  --surface-grad-2:rgba(24,44,80,.97) !important;
  --surface-grad-3:rgba(15,31,61,.99) !important;
  --control-bg:linear-gradient(180deg,rgba(43,73,124,.96),rgba(19,39,78,.99)) !important;
  --surface-shadow:0 14px 28px rgba(0,0,0,.30),0 4px 14px rgba(0,0,0,.22) !important;
  --backdrop:rgba(11,23,46,.86) !important;
}
body.dark{
  background:
    radial-gradient(ellipse at 50% -4%,rgba(255,197,107,.12) 0%,rgba(255,197,107,.05) 18%,transparent 42%),
    linear-gradient(180deg,#8fa8ca 0%, #1f4b93 0.01%, #102445 36%, #0b1730 100%) !important;
  background-attachment:fixed !important;
}
body.dark:after{
  opacity:.52 !important;
  background:
    radial-gradient(ellipse at 50% 8%,rgba(255,204,124,.18) 0%,rgba(255,204,124,.08) 18%,transparent 42%),
    linear-gradient(180deg,rgba(255,236,193,.03),transparent 34%,rgba(0,0,0,.16)) !important;
}
.topbar{
  border-radius:0 !important;
  overflow:visible !important;
  background:linear-gradient(180deg,rgba(255,255,255,.82),rgba(250,244,230,.74)),var(--backdrop) !important;
  border-bottom:1px solid var(--paper-frame-main) !important;
  box-shadow:0 8px 18px rgba(143,111,73,.09),inset 0 -1px 0 var(--paper-frame-soft) !important;
}
body.dark .topbar{
  background:linear-gradient(180deg,rgba(27,48,88,.98),rgba(12,26,51,.98)) !important;
  border-bottom:1px solid rgba(231,195,124,.34) !important;
  box-shadow:0 12px 24px rgba(0,0,0,.24),inset 0 -1px 0 rgba(231,195,124,.12) !important;
}
.page{padding-top:72px !important}
.hero{
  margin-top:62px !important;
  min-height:248px !important;
  border-radius:36px !important;
  position:relative !important;
  overflow:visible !important;
}
.hero::before{
  content:"" !important;
  position:absolute !important;
  left:50% !important;
  top:-50px !important;
  width:min(88%,840px) !important;
  height:92px !important;
  transform:translateX(-50%) !important;
  border:1.5px solid rgba(197,152,76,.68) !important;
  border-bottom:none !important;
  border-radius:84px 84px 22px 22px / 72px 72px 0 0 !important;
  background:
    linear-gradient(90deg,transparent 49.2%,rgba(197,152,76,.34) 49.5%,rgba(197,152,76,.34) 50.5%,transparent 50.8%),
    linear-gradient(180deg,rgba(255,255,255,.28),rgba(255,255,255,0) 76%) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.58),0 -1px 0 rgba(255,255,255,.30) !important;
  pointer-events:none !important;
  z-index:2 !important;
}
.hero::after{
  content:"" !important;
  position:absolute !important;
  left:50% !important;
  top:-42px !important;
  width:min(92%,920px) !important;
  height:156px !important;
  transform:translateX(-50%) !important;
  background:
    radial-gradient(ellipse at 50% 0%,rgba(255,214,148,.48) 0%,rgba(255,214,148,.20) 26%,rgba(255,214,148,0) 64%) !important;
  filter:blur(2px) !important;
  pointer-events:none !important;
  z-index:1 !important;
}
.hero .stats .stat{background-image:var(--control-bg) !important}
body.dark .hero{
  background:linear-gradient(180deg,rgba(28,50,92,.98),rgba(19,35,66,.98)) !important;
  box-shadow:0 18px 34px rgba(0,0,0,.30),inset 0 1px 0 rgba(255,239,201,.06) !important;
}
body.dark .hero::before{
  border-color:rgba(231,195,124,.78) !important;
  background:
    linear-gradient(90deg,transparent 49.1%,rgba(231,195,124,.42) 49.5%,rgba(231,195,124,.42) 50.5%,transparent 50.9%),
    linear-gradient(180deg,rgba(70,108,176,.16),rgba(70,108,176,0) 74%) !important;
  box-shadow:inset 0 1px 0 rgba(255,229,170,.18),0 0 0 1px rgba(255,223,164,.04) !important;
}
body.dark .hero::after{
  background:
    radial-gradient(ellipse at 50% 0%,rgba(255,208,118,.58) 0%,rgba(255,208,118,.24) 24%,rgba(255,208,118,.08) 42%,rgba(255,208,118,0) 68%) !important;
  filter:blur(4px) !important;
}
.hero > div:first-child{position:relative;z-index:3 !important}
.section-title p{font-size:15px !important;letter-spacing:.015em !important}
body.dark .section-title h2, body.dark .hero h1, body.dark .site-title{color:#f4e7c8 !important;text-shadow:0 0 12px rgba(255,202,110,.08) !important}

/* Room switch theme button */
.theme-btn{
  width:74px !important;
  height:46px !important;
  border-radius:14px !important;
  padding:0 !important;
  overflow:visible !important;
  background-image:linear-gradient(180deg,rgba(255,255,255,.88),rgba(244,233,210,.96)) !important;
  border:1px solid var(--paper-frame-main) !important;
  outline:1px solid var(--paper-frame-soft) !important;
  box-shadow:0 7px 14px rgba(105,78,45,.13),inset 0 1px 0 rgba(255,255,255,.7) !important;
}
body.dark .theme-btn{
  background-image:linear-gradient(180deg,rgba(40,67,114,.98),rgba(16,33,63,.99)) !important;
  border-color:rgba(231,195,124,.55) !important;
  outline-color:rgba(255,226,169,.16) !important;
  box-shadow:0 0 18px rgba(239,188,99,.15),0 8px 18px rgba(0,0,0,.30),inset 0 1px 0 rgba(255,236,196,.10) !important;
}
.theme-btn:before{display:none !important}
.room-switch{display:grid;place-items:center;width:100%;height:100%;position:relative;z-index:1}
.switch-plate{width:60px;height:31px;border-radius:10px;position:relative;display:block;background:linear-gradient(180deg,rgba(238,228,206,.98),rgba(215,202,178,.95));box-shadow:inset 0 2px 4px rgba(255,255,255,.70),inset 0 -3px 8px rgba(92,70,47,.18),0 1px 0 rgba(255,255,255,.45);border:1px solid rgba(139,107,63,.34)}
.switch-rocker{position:absolute;left:6px;top:5px;width:24px;height:21px;border-radius:7px;background:linear-gradient(180deg,#fffaf0,#d8c7a8);box-shadow:inset 0 1px 0 rgba(255,255,255,.88),0 3px 7px rgba(84,62,40,.22);transition:left .22s cubic-bezier(.2,.85,.2,1),background .22s ease,box-shadow .22s ease}
.switch-glow{position:absolute;inset:-12px -10px;border-radius:20px;background:radial-gradient(circle at 78% 45%,rgba(255,202,111,.0),transparent 66%);opacity:0;filter:blur(4px);transition:opacity .22s ease;background-repeat:no-repeat}
.room-switch.is-on .switch-plate{background:linear-gradient(180deg,rgba(23,47,88,.98),rgba(9,25,55,.98));border-color:rgba(241,199,111,.55);box-shadow:inset 0 2px 5px rgba(255,238,199,.10),inset 0 -3px 10px rgba(0,0,0,.45),0 0 0 1px rgba(241,199,111,.12)}
.room-switch.is-on .switch-rocker{left:30px;background:linear-gradient(180deg,#ffe7a9,#efb85f);box-shadow:0 0 12px rgba(255,196,99,.62),0 0 24px rgba(255,196,99,.20),inset 0 1px 0 rgba(255,255,255,.75)}
.room-switch.is-on .switch-glow{opacity:1;background:radial-gradient(circle at 78% 45%,rgba(255,200,104,.52),rgba(255,200,104,.16) 36%,transparent 70%)}

/* dark icon treatment */
body.dark .brand-mark{position:relative !important;overflow:hidden !important;background:linear-gradient(180deg,rgba(28,52,97,.98),rgba(12,28,58,.98)) !important;border-color:rgba(231,195,124,.54) !important;box-shadow:0 0 18px rgba(239,188,99,.10),0 6px 14px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,236,196,.10) !important}
body.dark .brand-app-icon{opacity:0 !important}
body.dark .brand-mark:after{
  content:"" !important;
  position:absolute !important;
  inset:5px !important;
  border-radius:14px !important;
  background-image:url('../assets/icons/icon-dark-192.png') !important;
  background-size:cover !important;
  background-position:center !important;
  opacity:1 !important;
  filter:drop-shadow(0 0 7px rgba(239,188,99,.18)) !important;
  z-index:2 !important;
  pointer-events:none !important;
}
body:not(.dark) .brand-mark:after{content:none !important}
@media(min-width:821px){
  .page{padding-top:78px !important}
  .hero{margin-top:76px !important}
}
@media(max-width:760px){
  .theme-btn{width:58px !important;height:38px !important;border-radius:13px !important}
  .switch-plate{width:48px;height:27px;border-radius:9px}
  .switch-rocker{width:19px;height:18px;left:5px;top:4px;border-radius:6px}
  .room-switch.is-on .switch-rocker{left:24px}
  .page{padding-top:42px !important}
  .hero{margin-top:44px !important}
  .hero::before{top:-34px !important;height:64px !important;width:min(94%,96vw) !important;border-radius:48px 48px 18px 18px / 48px 48px 0 0 !important}
  .hero::after{top:-28px !important;height:116px !important;width:min(96%,100vw) !important}
}


/* --- final hero refinement: straight frame + falling diffuse light --- */
.hero{
  margin-top:72px !important;
  border-radius:34px !important;
  overflow:visible !important;
  position:relative !important;
  isolation:isolate !important;
}

/* A straight, delicate upper frame line */
.hero::before{
  content:"" !important;
  display:block !important;
  position:absolute !important;
  left:50% !important;
  top:-54px !important;
  width:min(88%,860px) !important;
  height:15px !important;
  transform:translateX(-50%) !important;
  border-radius:999px !important;
  background:
    linear-gradient(90deg,
      rgba(255,255,255,0) 0%,
      rgba(222,178,96,.22) 11%,
      rgba(255,225,160,.94) 49%,
      rgba(255,225,160,.94) 51%,
      rgba(222,178,96,.22) 89%,
      rgba(255,255,255,0) 100%) !important;
  border:1px solid rgba(218,176,93,.66) !important;
  box-shadow:
    0 0 10px rgba(255,211,128,.34),
    0 0 26px rgba(255,196,95,.20),
    inset 0 1px 0 rgba(255,246,224,.74) !important;
  pointer-events:none !important;
  z-index:4 !important;
  filter:none !important;
}

/* Soft light falling from the frame onto the recipe card */
.hero::after{
  content:"" !important;
  display:block !important;
  position:absolute !important;
  left:50% !important;
  top:-52px !important;
  width:min(112%,1100px) !important;
  height:245px !important;
  transform:translateX(-50%) !important;
  border-radius:0 0 48% 48% / 0 0 100% 100% !important;
  background:
    radial-gradient(ellipse at 50% 0%,
      rgba(255,226,163,.56) 0%,
      rgba(255,214,136,.34) 19%,
      rgba(255,204,116,.17) 42%,
      rgba(255,204,116,.055) 62%,
      transparent 82%) !important;
  filter:blur(10px) !important;
  opacity:.88 !important;
  pointer-events:none !important;
  z-index:1 !important;
}

.hero > div:first-child{
  position:relative !important;
  z-index:3 !important;
}

body.dark .hero{
  background:
    linear-gradient(180deg,rgba(31,56,102,.98),rgba(19,36,68,.985)) !important;
  border-color:rgba(231,195,124,.44) !important;
  box-shadow:
    0 18px 34px rgba(0,0,0,.30),
    inset 0 1px 0 rgba(255,239,201,.06) !important;
}

body.dark .hero::before{
  background:
    linear-gradient(90deg,
      rgba(255,207,117,0) 0%,
      rgba(255,204,119,.24) 12%,
      rgba(255,222,150,.98) 49%,
      rgba(255,222,150,.98) 51%,
      rgba(255,204,119,.24) 88%,
      rgba(255,207,117,0) 100%) !important;
  border-color:rgba(255,218,146,.72) !important;
  box-shadow:
    0 0 14px rgba(255,205,111,.42),
    0 0 42px rgba(255,188,83,.24),
    inset 0 1px 0 rgba(255,247,224,.62) !important;
}

body.dark .hero::after{
  background:
    radial-gradient(ellipse at 50% 0%,
      rgba(255,214,136,.64) 0%,
      rgba(255,198,101,.38) 18%,
      rgba(255,185,78,.18) 42%,
      rgba(255,185,78,.06) 64%,
      transparent 84%) !important;
  filter:blur(12px) !important;
  opacity:.92 !important;
}

@media(min-width:821px){
  .page{padding-top:80px !important}
  .hero{margin-top:78px !important}
}

@media(max-width:760px){
  .hero{margin-top:52px !important}
  .hero::before{
    top:-34px !important;
    width:min(82%,420px) !important;
    height:12px !important;
  }
  .hero::after{
    top:-34px !important;
    width:min(110%,520px) !important;
    height:170px !important;
    filter:blur(8px) !important;
  }
}


/* --- positioning fix: light frame closer to hero and aligned with card --- */
.hero{
  margin-top:46px !important;
  padding-top:34px !important;
}
.hero::before{
  top:-24px !important;
  width:min(72%,720px) !important;
  height:12px !important;
  border-radius:999px !important;
  z-index:4 !important;
}
.hero::after{
  top:-28px !important;
  width:min(92%,900px) !important;
  height:156px !important;
  border-radius:0 0 50% 50% / 0 0 100% 100% !important;
  filter:blur(12px) !important;
  opacity:.78 !important;
  z-index:1 !important;
}
body.dark .hero::after{
  opacity:.82 !important;
  filter:blur(13px) !important;
}
.hero > div:first-child{position:relative !important;z-index:3 !important}
@media(min-width:821px){
  .page{padding-top:58px !important}
  .hero{margin-top:54px !important; padding-top:36px !important}
}
@media(max-width:760px){
  .hero{margin-top:34px !important; padding-top:28px !important}
  .hero::before{top:-18px !important;width:min(74%,360px) !important;height:10px !important}
  .hero::after{top:-20px !important;width:min(96%,460px) !important;height:132px !important;filter:blur(10px) !important}
}


/* --- final correction: raise light bar to top panel and keep light in both themes --- */
.hero{
  margin-top:86px !important;
  position:relative !important;
  overflow:visible !important;
  isolation:isolate !important;
}

/* Light source close to the upper navigation panel */
.hero::before{
  content:"" !important;
  display:block !important;
  position:absolute !important;
  left:50% !important;
  top:-132px !important;
  width:min(72%,760px) !important;
  height:14px !important;
  transform:translateX(-50%) !important;
  border-radius:999px !important;
  background:
    linear-gradient(90deg,
      rgba(255,255,255,0) 0%,
      rgba(211,167,82,.18) 10%,
      rgba(255,228,164,.96) 48%,
      rgba(255,228,164,.96) 52%,
      rgba(211,167,82,.18) 90%,
      rgba(255,255,255,0) 100%) !important;
  border:1px solid rgba(218,176,93,.62) !important;
  box-shadow:
    0 0 12px rgba(255,214,132,.34),
    0 0 32px rgba(255,196,95,.22),
    inset 0 1px 0 rgba(255,248,226,.80) !important;
  pointer-events:none !important;
  z-index:4 !important;
  filter:none !important;
}

/* Falling diffuse beam from the raised source onto the hero card */
.hero::after{
  content:"" !important;
  display:block !important;
  position:absolute !important;
  left:50% !important;
  top:-132px !important;
  width:min(114%,1160px) !important;
  height:360px !important;
  transform:translateX(-50%) !important;
  border-radius:0 0 48% 48% / 0 0 100% 100% !important;
  background:
    radial-gradient(ellipse at 50% 0%,
      rgba(255,232,176,.62) 0%,
      rgba(255,218,145,.39) 18%,
      rgba(255,205,120,.20) 40%,
      rgba(255,205,120,.075) 62%,
      transparent 86%) !important;
  filter:blur(11px) !important;
  opacity:.94 !important;
  pointer-events:none !important;
  z-index:1 !important;
}

body:not(.dark) .hero::before{
  background:
    linear-gradient(90deg,
      rgba(255,255,255,0) 0%,
      rgba(199,151,62,.16) 10%,
      rgba(255,221,151,.92) 48%,
      rgba(255,221,151,.92) 52%,
      rgba(199,151,62,.16) 90%,
      rgba(255,255,255,0) 100%) !important;
  border-color:rgba(200,151,68,.52) !important;
  box-shadow:
    0 0 10px rgba(255,214,132,.28),
    0 0 28px rgba(226,176,86,.18),
    inset 0 1px 0 rgba(255,249,230,.86) !important;
}

body:not(.dark) .hero::after{
  background:
    radial-gradient(ellipse at 50% 0%,
      rgba(255,228,166,.54) 0%,
      rgba(255,216,144,.36) 18%,
      rgba(255,203,124,.20) 40%,
      rgba(255,203,124,.08) 64%,
      transparent 88%) !important;
  opacity:.90 !important;
  filter:blur(10px) !important;
}

body.dark .hero::before{
  background:
    linear-gradient(90deg,
      rgba(255,207,117,0) 0%,
      rgba(255,204,119,.26) 10%,
      rgba(255,224,153,.98) 48%,
      rgba(255,224,153,.98) 52%,
      rgba(255,204,119,.26) 90%,
      rgba(255,207,117,0) 100%) !important;
  border-color:rgba(255,218,146,.72) !important;
  box-shadow:
    0 0 14px rgba(255,205,111,.42),
    0 0 46px rgba(255,188,83,.25),
    inset 0 1px 0 rgba(255,247,224,.62) !important;
}

body.dark .hero::after{
  background:
    radial-gradient(ellipse at 50% 0%,
      rgba(255,214,136,.66) 0%,
      rgba(255,198,101,.40) 18%,
      rgba(255,185,78,.20) 42%,
      rgba(255,185,78,.075) 66%,
      transparent 88%) !important;
  filter:blur(12px) !important;
  opacity:.94 !important;
}

.hero > div:first-child{
  position:relative !important;
  z-index:3 !important;
}

@media(max-width:760px){
  .hero{margin-top:64px !important}
  .hero::before{
    top:-74px !important;
    width:min(76%,360px) !important;
    height:11px !important;
  }
  .hero::after{
    top:-74px !important;
    width:min(112%,520px) !important;
    height:230px !important;
    filter:blur(8px) !important;
  }
}


/* --- light theme: no light beam from top frame; dark theme keeps warm light --- */
body:not(.dark) .hero::after{
  display:none !important;
  content:none !important;
  opacity:0 !important;
  background:none !important;
  filter:none !important;
}

body:not(.dark) .hero::before{
  top:-72px !important;
  height:10px !important;
  background:
    linear-gradient(90deg,
      rgba(255,255,255,0) 0%,
      rgba(200,151,68,.18) 13%,
      rgba(212,170,91,.56) 48%,
      rgba(212,170,91,.56) 52%,
      rgba(200,151,68,.18) 87%,
      rgba(255,255,255,0) 100%) !important;
  border-color:rgba(200,151,68,.40) !important;
  box-shadow:
    0 1px 6px rgba(180,135,70,.12),
    inset 0 1px 0 rgba(255,249,230,.72) !important;
}

body.dark .hero::after{
  display:block !important;
  content:"" !important;
}

@media(max-width:760px){
  body:not(.dark) .hero::after{
    display:none !important;
    content:none !important;
  }
  body:not(.dark) .hero::before{
    top:-48px !important;
  }
}


/* --- final: light bar closer to Table book + smoother theme switch animation --- */
.hero{
  margin-top:94px !important;
}
.hero::before{
  top:-178px !important;
  width:min(64%,720px) !important;
  height:13px !important;
  transform:translateX(-50%) scaleX(1) !important;
  transition:top .46s cubic-bezier(.22,.9,.2,1),box-shadow .46s ease,background .46s ease,border-color .46s ease !important;
}
body.dark .hero::after{
  top:-178px !important;
  height:410px !important;
  opacity:.96 !important;
  transition:top .46s cubic-bezier(.22,.9,.2,1),opacity .46s ease,filter .46s ease,background .46s ease !important;
}
body:not(.dark) .hero::after{
  display:none !important;
  content:none !important;
  opacity:0 !important;
  background:none !important;
  filter:none !important;
}
body:not(.dark) .hero::before{
  top:-150px !important;
  width:min(62%,690px) !important;
  background:linear-gradient(90deg,rgba(255,255,255,0) 0%,rgba(200,151,68,.14) 14%,rgba(212,170,91,.46) 48%,rgba(212,170,91,.46) 52%,rgba(200,151,68,.14) 86%,rgba(255,255,255,0) 100%) !important;
  border-color:rgba(200,151,68,.36) !important;
  box-shadow:0 1px 5px rgba(180,135,70,.10),inset 0 1px 0 rgba(255,249,230,.70) !important;
}
.theme-btn{
  transition:transform .22s cubic-bezier(.2,.9,.2,1),box-shadow .34s ease,border-color .34s ease,background .34s ease !important;
  will-change:transform;
}
.theme-btn.theme-morph{
  animation:themeSwitchPress .46s cubic-bezier(.22,.9,.2,1);
}
@keyframes themeSwitchPress{
  0%{transform:scale(1)}
  32%{transform:scale(.965)}
  68%{transform:scale(1.025)}
  100%{transform:scale(1)}
}
.switch-plate{
  transition:background .42s ease,border-color .42s ease,box-shadow .42s ease,filter .42s ease !important;
}
.switch-rocker{
  transition:left .42s cubic-bezier(.2,.92,.18,1),transform .42s cubic-bezier(.2,.92,.18,1),background .42s ease,box-shadow .42s ease !important;
  will-change:left,transform;
}
.switch-glow{
  transition:opacity .42s ease,background .42s ease,filter .42s ease !important;
}
.room-switch.is-off .switch-rocker{transform:translateX(0) rotate(-1deg)}
.room-switch.is-on .switch-rocker{transform:translateX(0) rotate(1deg)}
.theme-btn.theme-morph .switch-rocker{transform:scale(.92)}
body.dark .theme-btn.theme-morph .switch-rocker{transform:scale(1.04)}
.room-switch.is-on .switch-glow{
  opacity:1 !important;
  filter:blur(5px) !important;
}
body.dark .theme-btn.theme-morph::after{
  content:"" !important;
  position:absolute !important;
  inset:-18px -22px !important;
  border-radius:26px !important;
  background:radial-gradient(circle at 72% 48%,rgba(255,202,111,.48),rgba(255,202,111,.14) 38%,transparent 72%) !important;
  pointer-events:none !important;
  animation:switchGlowPulse .58s ease both;
}
@keyframes switchGlowPulse{
  0%{opacity:0;transform:scale(.84)}
  45%{opacity:1;transform:scale(1)}
  100%{opacity:0;transform:scale(1.16)}
}
@media(max-width:760px){
  .hero{margin-top:72px !important}
  .hero::before{top:-92px !important;width:min(70%,360px) !important}
  body.dark .hero::after{top:-92px !important;height:260px !important}
  body:not(.dark) .hero::before{top:-74px !important}
}


/* --- mobile header alignment: light bar near Table book, title closer to icon --- */
@media(max-width:760px){
  .topbar-inner{
    grid-template-columns:48px minmax(0,1fr) auto !important;
    gap:10px !important;
  }
  .brand{
    justify-self:start !important;
  }
  .site-title{
    position:relative !important;
    left:auto !important;
    top:auto !important;
    transform:none !important;
    justify-self:start !important;
    text-align:left !important;
    padding-left:2px !important;
    max-width:42vw !important;
    font-size:clamp(21px,6.1vw,28px) !important;
    letter-spacing:.045em !important;
    white-space:nowrap !important;
    z-index:2 !important;
  }
  .topbar-actions{
    justify-self:end !important;
  }
  .page{
    padding-top:34px !important;
  }
  .hero{
    margin-top:54px !important;
  }
  .hero::before{
    top:-110px !important;
    width:min(58%,300px) !important;
    height:10px !important;
    left:50% !important;
    transform:translateX(-50%) !important;
  }
  body.dark .hero::after{
    top:-110px !important;
    height:245px !important;
    width:min(112%,520px) !important;
  }
  body:not(.dark) .hero::before{
    top:-94px !important;
    width:min(54%,290px) !important;
  }
  body:not(.dark) .hero::after{
    display:none !important;
    content:none !important;
  }
}

@media(max-width:430px){
  .topbar-inner{
    grid-template-columns:44px minmax(0,1fr) auto !important;
    gap:8px !important;
  }
  .brand,
  .brand-mark{
    width:42px !important;
    height:42px !important;
    min-width:42px !important;
  }
  .site-title{
    font-size:clamp(20px,6vw,25px) !important;
    max-width:38vw !important;
    letter-spacing:.035em !important;
  }
  .auth-chip-primary{
    max-width:88px !important;
  }
  .theme-btn{
    width:52px !important;
    height:36px !important;
  }
  .hero::before{
    top:-104px !important;
    width:min(56%,250px) !important;
  }
  body.dark .hero::after{
    top:-104px !important;
    height:228px !important;
  }
  body:not(.dark) .hero::before{
    top:-88px !important;
  }
}

/* Final home, favorites and encyclopedia fixes */
#home .stats,
#home .stats-hidden {
  display: none !important;
}

#home.view.active {
  padding-top: 0 !important;
}

main.page {
  padding-top: clamp(8px, 1.1vw, 16px) !important;
}

#home .hero {
  margin-top: clamp(8px, 1.2vw, 16px) !important;
  margin-bottom: 10px !important;
  min-height: 174px !important;
  padding: clamp(22px, 3vw, 34px) !important;
}

#home .home-planner-row {
  margin-top: 8px !important;
}

.home-tools-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(260px, 1fr));
  gap: 18px;
  max-width: 980px;
  margin: 16px auto 30px;
}

.home-tools-row .tab-card {
  min-height: 128px;
}

.liked-tab-icon,
.encyclopedia-tab-icon {
  display: grid !important;
  place-items: center;
  font-size: 32px;
  line-height: 1;
}

.cuisine-title {
  margin-top: 26px !important;
}

.cuisine-carousel-shell {
  display: grid;
  grid-template-columns: 46px minmax(0, 1fr) 46px;
  align-items: center;
  gap: 10px;
  width: 100%;
  margin: 0 auto 22px;
}

#countryGrid.cuisine-carousel {
  display: grid !important;
  grid-auto-flow: column;
  grid-auto-columns: minmax(260px, 340px);
  grid-template-columns: none !important;
  justify-content: start;
  gap: 18px !important;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  scroll-snap-type: x mandatory;
  padding: 10px 4px 18px !important;
  scrollbar-width: none;
}

#countryGrid.cuisine-carousel::-webkit-scrollbar {
  display: none;
}

.country-slide {
  scroll-snap-align: center;
}

.cuisine-carousel-arrow {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border: 1px solid var(--line);
  border-radius: 50%;
  background: var(--paper);
  color: var(--ink);
  box-shadow: var(--softShadow), var(--inner);
  font: 400 32px/1 Arial, sans-serif;
  cursor: pointer;
}

.recipe-card-with-like {
  position: relative;
  display: grid !important;
  padding: 0 !important;
  overflow: hidden !important;
}

.recipe-open-card {
  width: 100%;
  min-height: 100%;
  padding: 20px 54px 18px 18px;
  border: 0;
  background: transparent;
  color: inherit;
  text-align: center;
  display: grid;
  gap: 10px;
}

.recipe-open-card h3 {
  margin: 0 !important;
}

.like-btn {
  display: inline-grid;
  grid-auto-flow: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  width: 38px;
  height: 38px;
  border: 1px solid rgba(185,104,104,.30);
  border-radius: 999px;
  background: var(--paper);
  color: #ad6a6a;
  box-shadow: var(--softShadow), var(--inner);
  cursor: pointer;
}

.recipe-card .like-btn {
  position: absolute;
  top: 10px;
  right: 10px;
  z-index: 4;
}

.like-btn .line-icon {
  width: 18px;
  height: 18px;
  fill: none;
}

.like-btn span {
  display: none;
}

.like-btn.active {
  color: #b4515b;
  border-color: rgba(180,81,91,.50);
  background: color-mix(in srgb, #f7d7db 68%, var(--paper));
}

.like-btn.active .line-icon {
  fill: currentColor;
}

#modalTags .like-btn {
  width: 34px;
  height: 34px;
}

.liked-recipes-grid {
  margin-top: 18px;
}

.encyclopedia-filters {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
  margin: 18px 0 22px;
}

.encyclopedia-filter {
  min-height: 42px;
  padding: 10px 16px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--paper);
  color: var(--ink);
  box-shadow: var(--softShadow), var(--inner);
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}

.encyclopedia-filter.active {
  box-shadow: var(--pressed);
}

.encyclopedia-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: 16px;
}

.encyclopedia-card {
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 24px;
  background: var(--paper);
  box-shadow: var(--shadow), var(--inner);
}

.encyclopedia-card small {
  display: inline-block;
  margin-bottom: 8px;
  color: var(--accent);
  font-size: 12px;
  font-weight: 800;
}

.encyclopedia-card h3 {
  margin: 0 0 8px;
  font-size: 20px;
}

.encyclopedia-card p {
  margin: 0;
  color: var(--muted);
}

@media(max-width:760px) {
  main.page {
    padding-top: 6px !important;
  }

  #home .hero {
    margin-top: 6px !important;
    min-height: 150px !important;
    padding: 20px 18px !important;
  }

  .home-tools-row {
    grid-template-columns: 1fr;
    max-width: 620px;
    gap: 12px;
  }

  .cuisine-carousel-shell {
    grid-template-columns: 38px minmax(0, 1fr) 38px;
    gap: 4px;
  }

  #countryGrid.cuisine-carousel {
    grid-auto-columns: minmax(240px, 78vw);
  }

  .cuisine-carousel-arrow {
    width: 38px;
    height: 38px;
    font-size: 28px;
  }
}

/* Compact premium home action cards */
#home .home-planner-row,
#home .home-tools-row {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 12px !important;
  width: min(100%, 760px) !important;
  max-width: 760px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  align-items: stretch !important;
  justify-items: stretch !important;
}

#home .home-planner-row {
  margin-top: 10px !important;
}

#home .home-tools-row {
  margin-top: 12px !important;
  margin-bottom: 22px !important;
}

#home .home-planner-row .tab-card,
#home .home-tools-row .tab-card {
  width: 100% !important;
  min-height: 124px !important;
  height: 124px !important;
  padding: 14px 16px !important;
  border-radius: 26px !important;
  display: grid !important;
  grid-template-columns: 54px minmax(0, 1fr) !important;
  grid-template-rows: 1fr !important;
  align-items: center !important;
  justify-content: start !important;
  justify-items: stretch !important;
  gap: 14px !important;
  text-align: left !important;
}

#home .home-planner-row .tab-card::after,
#home .home-tools-row .tab-card::after {
  width: 54px !important;
  height: 54px !important;
  right: -14px !important;
  top: -16px !important;
  opacity: .24 !important;
}

#home .home-planner-row .tab-icon,
#home .home-tools-row .tab-icon,
#home .home-my-card .tab-icon,
#home .home-menu-card .tab-icon {
  width: 54px !important;
  height: 54px !important;
  min-width: 54px !important;
  border-radius: 21px !important;
  margin: 0 !important;
  display: grid !important;
  place-items: center !important;
  align-self: center !important;
  justify-self: center !important;
  color: #7f6236 !important;
  background:
    radial-gradient(circle at 30% 22%, rgba(255,255,255,.95), rgba(255,255,255,.18) 32%, transparent 58%),
    linear-gradient(145deg, #fff7e4 0%, #ead19b 46%, #c49a52 100%) !important;
  border: 1px solid rgba(255,255,255,.72) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.92),
    inset 0 -10px 18px rgba(132,94,44,.14),
    0 14px 28px rgba(92,74,48,.14),
    0 2px 0 rgba(255,255,255,.60) !important;
}

body.dark #home .home-planner-row .tab-icon,
body.dark #home .home-tools-row .tab-icon {
  color: #efd79c !important;
  background:
    radial-gradient(circle at 30% 22%, rgba(255,255,255,.20), transparent 42%),
    linear-gradient(145deg, #283149 0%, #7d6336 58%, #b8924f 100%) !important;
  border-color: rgba(239,215,156,.24) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.16),
    inset 0 -10px 18px rgba(0,0,0,.24),
    0 14px 28px rgba(0,0,0,.26) !important;
}

#home .home-planner-row .tab-icon .line-icon,
#home .home-tools-row .tab-icon .line-icon {
  width: 29px !important;
  height: 29px !important;
  stroke-width: 1.75 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
  display: block !important;
}

#home .home-card-copy {
  min-width: 0 !important;
  display: grid !important;
  align-content: center !important;
  justify-items: start !important;
  gap: 4px !important;
  position: relative !important;
  z-index: 1 !important;
}

#home .home-card-copy b,
#home .home-card-copy span,
#home .home-card-copy small {
  max-width: 100% !important;
  text-align: left !important;
}

#home .home-card-copy b {
  font-size: clamp(14px, 1.7vw, 16px) !important;
  line-height: 1.12 !important;
  letter-spacing: -.01em !important;
}

#home .home-card-copy span {
  font-size: 11.5px !important;
  line-height: 1.25 !important;
  font-weight: 650 !important;
  opacity: .86 !important;
}

#home .home-card-copy small {
  font-size: 11px !important;
  line-height: 1.15 !important;
  color: var(--accent) !important;
  font-weight: 800 !important;
}

#home .home-planner-row .tab-card:hover,
#home .home-tools-row .tab-card:hover {
  transform: translateY(-1px) !important;
}

.cuisine-carousel-arrow,
.country-open-arrow,
.arrow {
  display: grid !important;
  place-items: center !important;
  align-items: center !important;
  justify-content: center !important;
}

.cuisine-carousel-arrow .line-icon,
.country-open-arrow .line-icon,
.arrow .line-icon {
  display: block !important;
  margin: auto !important;
}

@media(max-width: 620px) {
  #home .home-planner-row,
  #home .home-tools-row {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    width: 100% !important;
    gap: 10px !important;
  }

  #home .home-planner-row .tab-card,
  #home .home-tools-row .tab-card {
    min-height: 118px !important;
    height: 118px !important;
    padding: 13px 11px !important;
    grid-template-columns: 1fr !important;
    grid-template-rows: 46px 1fr !important;
    gap: 8px !important;
    text-align: center !important;
    align-content: center !important;
    justify-items: center !important;
  }

  #home .home-planner-row .tab-icon,
  #home .home-tools-row .tab-icon,
  #home .home-my-card .tab-icon,
  #home .home-menu-card .tab-icon {
    width: 46px !important;
    height: 46px !important;
    min-width: 46px !important;
    border-radius: 18px !important;
  }

  #home .home-planner-row .tab-icon .line-icon,
  #home .home-tools-row .tab-icon .line-icon {
    width: 25px !important;
    height: 25px !important;
  }

  #home .home-card-copy {
    justify-items: center !important;
    gap: 3px !important;
  }

  #home .home-card-copy b,
  #home .home-card-copy span,
  #home .home-card-copy small {
    text-align: center !important;
  }

  #home .home-card-copy span {
    display: none !important;
  }
}

@media(max-width: 360px) {
  #home .home-planner-row .tab-card,
  #home .home-tools-row .tab-card {
    min-height: 108px !important;
    height: 108px !important;
    padding-left: 8px !important;
    padding-right: 8px !important;
  }

  #home .home-card-copy b {
    font-size: 13px !important;
  }
}

/* Final PNG home action icons + mobile alignment guard */
#home .home-planner-row .tab-card,
#home .home-tools-row .tab-card {
  grid-template-columns: 62px minmax(0, 1fr) !important;
  overflow: hidden !important;
}

#home .home-planner-row .tab-icon,
#home .home-tools-row .tab-icon,
#home .home-my-card .tab-icon,
#home .home-menu-card .tab-icon {
  width: 62px !important;
  height: 62px !important;
  min-width: 62px !important;
  border-radius: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  filter: none !important;
  overflow: visible !important;
  isolation: isolate !important;
}

#home .home-planner-row .tab-icon::before,
#home .home-planner-row .tab-icon::after,
#home .home-tools-row .tab-icon::before,
#home .home-tools-row .tab-icon::after {
  display: none !important;
}

.home-action-icon {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  object-position: center !important;
  pointer-events: none !important;
  user-select: none !important;
}

.home-action-icon-dark {
  display: none !important;
}

body.dark .home-action-icon-light {
  display: none !important;
}

body.dark .home-action-icon-dark {
  display: block !important;
}

#home .home-card-copy {
  align-self: center !important;
}

@media(max-width: 620px) {
  #home .home-planner-row,
  #home .home-tools-row {
    gap: 10px !important;
  }

  #home .home-planner-row .tab-card,
  #home .home-tools-row .tab-card {
    grid-template-columns: 1fr !important;
    grid-template-rows: 58px minmax(0, 1fr) !important;
    min-height: 130px !important;
    height: 130px !important;
    padding: 12px 10px 11px !important;
    align-items: center !important;
    justify-items: center !important;
    align-content: center !important;
    gap: 7px !important;
  }

  #home .home-planner-row .tab-icon,
  #home .home-tools-row .tab-icon,
  #home .home-my-card .tab-icon,
  #home .home-menu-card .tab-icon {
    width: 58px !important;
    height: 58px !important;
    min-width: 58px !important;
    align-self: center !important;
    justify-self: center !important;
  }

  #home .home-card-copy {
    width: 100% !important;
    min-height: 0 !important;
    align-content: start !important;
    justify-items: center !important;
  }

  #home .home-card-copy b {
    display: block !important;
    max-width: 100% !important;
    font-size: clamp(12px, 3.6vw, 14px) !important;
    line-height: 1.08 !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
  }

  #home .home-card-copy small {
    max-width: 100% !important;
    font-size: 10.5px !important;
    line-height: 1.05 !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
  }
}

@media(max-width: 380px) {
  #home .home-planner-row .tab-card,
  #home .home-tools-row .tab-card {
    grid-template-rows: 52px minmax(0, 1fr) !important;
    min-height: 122px !important;
    height: 122px !important;
    padding: 10px 8px !important;
  }

  #home .home-planner-row .tab-icon,
  #home .home-tools-row .tab-icon,
  #home .home-my-card .tab-icon,
  #home .home-menu-card .tab-icon {
    width: 52px !important;
    height: 52px !important;
    min-width: 52px !important;
  }
}

/* Final icon box polish + swipe-only cuisine carousel */
#home .home-planner-row .tab-icon,
#home .home-tools-row .tab-icon,
#home .home-my-card .tab-icon,
#home .home-menu-card .tab-icon {
  border-radius: 22px !important;
  background: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
  overflow: hidden !important;
  clip-path: inset(0 round 22px) !important;
  contain: paint !important;
}

#home .home-planner-row .tab-icon .home-action-icon,
#home .home-tools-row .tab-icon .home-action-icon {
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  max-height: none !important;
  object-fit: cover !important;
  object-position: center !important;
  border-radius: inherit !important;
  display: block !important;
}

body.dark #home .home-planner-row .tab-icon,
body.dark #home .home-tools-row .tab-icon {
  background: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

.cuisine-carousel-shell {
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 0 !important;
  position: relative !important;
  overflow: hidden !important;
  border-radius: 34px !important;
  padding-inline: 0 !important;
}

.cuisine-carousel-arrow {
  display: none !important;
}

#countryGrid.cuisine-carousel {
  padding: 12px clamp(18px, 5vw, 52px) 20px !important;
  scroll-padding-inline: clamp(18px, 5vw, 52px) !important;
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 clamp(34px, 8vw, 96px), #000 calc(100% - clamp(34px, 8vw, 96px)), transparent 100%) !important;
  mask-image: linear-gradient(90deg, transparent 0, #000 clamp(34px, 8vw, 96px), #000 calc(100% - clamp(34px, 8vw, 96px)), transparent 100%) !important;
}

/* Unified matte navigation controls */
:root {
  --nav-matte-bg: #f7f0e5;
  --nav-matte-bg-hover: #fffaf2;
  --nav-matte-border: rgba(176, 128, 54, .46);
  --nav-matte-icon: #705532;
  --nav-matte-shadow: 0 5px 13px rgba(91, 64, 31, .09);
}

body.dark {
  --nav-matte-bg: #172f5a;
  --nav-matte-bg-hover: #1c396b;
  --nav-matte-border: rgba(201, 177, 125, .38);
  --nav-matte-icon: #ead9b7;
  --nav-matte-shadow: 0 5px 14px rgba(0, 0, 0, .22);
}

.arrow,
.country-open-arrow,
.cuisine-carousel-arrow,
.back-btn,
.meal-picker-back,
.swipe-cue .nav-arrow-icon {
  background: var(--nav-matte-bg) !important;
  background-color: var(--nav-matte-bg) !important;
  background-image: none !important;
  background-blend-mode: normal !important;
  border: 1px solid var(--nav-matte-border) !important;
  outline: 0 !important;
  box-shadow: var(--nav-matte-shadow) !important;
  filter: none !important;
}

body .country-card-uniform .arrow.country-open-arrow,
body.dark .country-card-uniform .arrow.country-open-arrow,
body.dark .arrow,
body.dark .country-open-arrow,
body.dark .cuisine-carousel-arrow {
  background: var(--nav-matte-bg) !important;
  background-color: var(--nav-matte-bg) !important;
  background-image: none !important;
  background-size: auto !important;
  background-repeat: no-repeat !important;
  background-blend-mode: normal !important;
  background-clip: padding-box !important;
  -webkit-mask-image: none !important;
  mask-image: none !important;
  border-radius: 50% !important;
  outline: 0 !important;
  box-shadow: var(--nav-matte-shadow) !important;
  filter: none !important;
  isolation: isolate !important;
  contain: paint !important;
}

body .country-card-uniform .arrow.country-open-arrow::before,
body .country-card-uniform .arrow.country-open-arrow::after,
body.dark .arrow::before,
body.dark .arrow::after,
body.dark .country-open-arrow::before,
body.dark .country-open-arrow::after {
  content: none !important;
  display: none !important;
  opacity: 0 !important;
  background: none !important;
  background-image: none !important;
}

.arrow::before,
.arrow::after,
.country-open-arrow::before,
.country-open-arrow::after,
.cuisine-carousel-arrow::before,
.cuisine-carousel-arrow::after,
.back-btn::before,
.back-btn::after,
.meal-picker-back::before,
.meal-picker-back::after,
.swipe-cue .nav-arrow-icon::before,
.swipe-cue .nav-arrow-icon::after {
  content: none !important;
  display: none !important;
  background: none !important;
  background-image: none !important;
}

.arrow,
.country-open-arrow,
.cuisine-carousel-arrow {
  width: 38px !important;
  height: 38px !important;
  min-width: 38px !important;
  min-height: 38px !important;
  padding: 0 !important;
  border-radius: 50% !important;
  display: grid !important;
  place-items: center !important;
  color: var(--nav-matte-icon) !important;
  transition: transform .2s ease, background-color .2s ease, border-color .2s ease, box-shadow .2s ease !important;
}

.arrow .line-icon,
.country-open-arrow .line-icon,
.cuisine-carousel-arrow .line-icon {
  width: 20px !important;
  height: 20px !important;
  margin: 0 !important;
  stroke: currentColor !important;
  stroke-width: 2 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
  filter: none !important;
  transform: translateX(1px);
}

.country-card:hover .country-open-arrow,
.arrow:hover,
.cuisine-carousel-arrow:hover {
  background: var(--nav-matte-bg-hover) !important;
  border-color: var(--gold) !important;
  box-shadow: 0 9px 20px rgba(91, 64, 31, .14) !important;
  transform: translateY(-1px) !important;
}

body.dark .country-card:hover .country-open-arrow,
body.dark .arrow:hover,
body.dark .cuisine-carousel-arrow:hover {
  box-shadow: 0 9px 22px rgba(0, 0, 0, .34) !important;
}

.country-card:active .country-open-arrow,
.arrow:active,
.cuisine-carousel-arrow:active {
  transform: translateY(0) scale(.95) !important;
  box-shadow: 0 3px 9px rgba(91, 64, 31, .12) !important;
}

.back-btn,
.meal-picker-back {
  min-height: 42px !important;
  padding: 7px 14px 7px 8px !important;
  border-radius: 999px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 9px !important;
  color: var(--ink) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: .01em !important;
  transition: transform .2s ease, background-color .2s ease, border-color .2s ease, box-shadow .2s ease !important;
}

.nav-arrow-icon {
  width: 27px;
  height: 27px;
  flex: 0 0 27px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  color: var(--nav-matte-icon);
  background: rgba(176, 128, 54, .08);
  border: 1px solid rgba(176, 128, 54, .22);
}

body.dark .nav-arrow-icon {
  background: rgba(234, 217, 183, .06);
  border-color: rgba(234, 217, 183, .16);
}

.nav-arrow-icon .line-icon {
  width: 16px !important;
  height: 16px !important;
  stroke: currentColor !important;
  stroke-width: 1.75 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
  filter: none !important;
  transform: translateX(-.35px);
}

.back-btn:hover,
.meal-picker-back:hover {
  background: var(--nav-matte-bg-hover) !important;
  border-color: var(--gold) !important;
  transform: translateY(-1px) !important;
}

.back-btn:active,
.meal-picker-back:active {
  transform: translateY(0) scale(.98) !important;
  box-shadow: 0 3px 9px rgba(91, 64, 31, .11) !important;
}

.back-btn:focus-visible,
.meal-picker-back:focus-visible,
.cuisine-carousel-arrow:focus-visible {
  outline: 2px solid var(--gold) !important;
  outline-offset: 3px !important;
}

.swipe-cue .nav-arrow-icon {
  width: 32px !important;
  height: 32px !important;
  flex-basis: 32px !important;
  border-radius: 50% !important;
  padding: 0 !important;
}

.swipe-cue .nav-arrow-icon .line-icon {
  width: 18px !important;
  height: 18px !important;
}

@media (prefers-reduced-motion: reduce) {
  .arrow,
  .country-open-arrow,
  .cuisine-carousel-arrow,
  .back-btn,
  .meal-picker-back {
    transition: none !important;
  }
}

.cuisine-carousel-shell::before,
.cuisine-carousel-shell::after {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  bottom: 0 !important;
  width: clamp(46px, 10vw, 120px) !important;
  z-index: 3 !important;
  pointer-events: none !important;
  backdrop-filter: blur(1.5px) !important;
}

.cuisine-carousel-shell::before {
  left: 0 !important;
  background: linear-gradient(90deg, var(--bg) 0%, color-mix(in srgb, var(--bg) 70%, transparent) 45%, transparent 100%) !important;
}

.cuisine-carousel-shell::after {
  right: 0 !important;
  background: linear-gradient(270deg, var(--bg) 0%, color-mix(in srgb, var(--bg) 70%, transparent) 45%, transparent 100%) !important;
}

body.dark .cuisine-carousel-shell::before {
  background: linear-gradient(90deg, var(--bg) 0%, color-mix(in srgb, var(--bg) 74%, transparent) 48%, transparent 100%) !important;
}

body.dark .cuisine-carousel-shell::after {
  background: linear-gradient(270deg, var(--bg) 0%, color-mix(in srgb, var(--bg) 74%, transparent) 48%, transparent 100%) !important;
}

@media(max-width: 760px) {
  .cuisine-carousel-shell {
    border-radius: 28px !important;
  }

  #countryGrid.cuisine-carousel {
    padding-inline: 20px !important;
    scroll-padding-inline: 20px !important;
    -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 34px, #000 calc(100% - 34px), transparent 100%) !important;
    mask-image: linear-gradient(90deg, transparent 0, #000 34px, #000 calc(100% - 34px), transparent 100%) !important;
  }

  .cuisine-carousel-shell::before,
  .cuisine-carousel-shell::after {
    width: 48px !important;
  }

  #home .home-planner-row .tab-icon,
  #home .home-tools-row .tab-icon,
  #home .home-my-card .tab-icon,
  #home .home-menu-card .tab-icon {
    border-radius: 20px !important;
    clip-path: inset(0 round 20px) !important;
  }
}

@media(max-width: 380px) {
  #home .home-planner-row .tab-icon,
  #home .home-tools-row .tab-icon,
  #home .home-my-card .tab-icon,
  #home .home-menu-card .tab-icon {
    border-radius: 18px !important;
    clip-path: inset(0 round 18px) !important;
  }
}

/* Final typography polish + centered recipe titles */
:root {
  --ui-font: "Aptos", "Segoe UI Variable Text", "Segoe UI", system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
  --title-font: "Cambria", "Georgia", "Times New Roman", serif;
  --recipe-title-font: "Cambria", "Georgia", "Times New Roman", serif;
}

body,
button,
input,
select,
textarea {
  font-family: var(--ui-font) !important;
  font-feature-settings: "kern" 1, "liga" 1, "calt" 1;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

.site-title,
.hero h1,
.section-title h2,
.cat-line h2,
.country-card h3,
.country-head h1,
.custom-head h1,
.dialog-title h2,
.panel h3,
.home-menu-card b,
.tab-card b,
.cat-tile b,
.encyclopedia-card h3,
#mealDayTitle,
#mealMonthTitle,
#homeMealMonthTitle {
  font-family: var(--title-font) !important;
  letter-spacing: -0.01em !important;
}

.recipe-card h3,
.recipe-open-card h3,
.recipe-card-with-like h3,
.liked-recipes-grid .recipe-card h3,
#countryRecipes .recipe-card h3,
#likedRecipesList .recipe-card h3,
#modalTitle,
#modalTitle span,
.my-item h4,
.my-item-compact h4,
.meal-recipe-card h4,
.meal-dish-title,
.meal-saved-link,
.meal-saved-link span {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  font-family: var(--recipe-title-font) !important;
  text-align: center !important;
  letter-spacing: -0.006em !important;
  text-wrap: balance;
  overflow-wrap: anywhere;
}

.recipe-open-card,
.recipe-card .recipe-open-card,
.my-item-main {
  text-align: center !important;
  justify-items: center !important;
}

.recipe-origin,
.recipe-meta,
.mini-meta {
  text-align: center !important;
  justify-content: center !important;
}

.dialog-title > div {
  flex: 1 1 auto;
  min-width: 0;
  text-align: center;
}

.dialog-title .tags {
  justify-content: center;
}

/* Final card alignment + softer country carousel fade */
.cat-section .recipe-grid,
.liked-recipes-grid {
  align-items: stretch !important;
  grid-auto-rows: 1fr !important;
}

.recipe-card-with-like {
  min-height: 154px !important;
  height: 100% !important;
  display: grid !important;
  grid-template-rows: 1fr !important;
  align-items: stretch !important;
}

.recipe-card-with-like .recipe-open-card {
  min-height: 154px !important;
  height: 100% !important;
  padding: 50px 18px 18px !important;
  display: grid !important;
  grid-template-rows: minmax(42px, 1fr) auto !important;
  align-items: center !important;
  justify-items: center !important;
  align-content: stretch !important;
  gap: 12px !important;
}

.recipe-card-with-like .recipe-badge {
  position: absolute !important;
  top: 10px !important;
  left: 50% !important;
  width: min(68%, 250px) !important;
  min-height: 30px !important;
  margin: 0 !important;
  transform: translateX(-50%) !important;
  z-index: 3 !important;
}

.recipe-card-with-like .recipe-open-card h3 {
  min-height: 42px !important;
  margin: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.recipe-card-with-like .recipe-meta {
  min-height: 34px !important;
  align-self: end !important;
}

.recipe-card-with-like .like-btn {
  top: 10px !important;
  right: 10px !important;
}

.cuisine-carousel-shell {
  isolation: isolate !important;
  background: transparent !important;
}

#countryGrid.cuisine-carousel {
  -webkit-mask-image: linear-gradient(
    90deg,
    transparent 0,
    rgba(0, 0, 0, .16) 26px,
    #000 clamp(86px, 15vw, 184px),
    #000 calc(100% - clamp(86px, 15vw, 184px)),
    rgba(0, 0, 0, .16) calc(100% - 26px),
    transparent 100%
  ) !important;
  mask-image: linear-gradient(
    90deg,
    transparent 0,
    rgba(0, 0, 0, .16) 26px,
    #000 clamp(86px, 15vw, 184px),
    #000 calc(100% - clamp(86px, 15vw, 184px)),
    rgba(0, 0, 0, .16) calc(100% - 26px),
    transparent 100%
  ) !important;
}

.cuisine-carousel-shell::before,
.cuisine-carousel-shell::after {
  width: clamp(76px, 14vw, 172px) !important;
  z-index: 5 !important;
  backdrop-filter: blur(8px) saturate(1.08) !important;
  -webkit-backdrop-filter: blur(8px) saturate(1.08) !important;
}

.cuisine-carousel-shell::before {
  background: linear-gradient(
    90deg,
    var(--bg) 0%,
    color-mix(in srgb, var(--bg) 84%, transparent) 34%,
    color-mix(in srgb, var(--bg) 30%, transparent) 72%,
    transparent 100%
  ) !important;
}

.cuisine-carousel-shell::after {
  background: linear-gradient(
    270deg,
    var(--bg) 0%,
    color-mix(in srgb, var(--bg) 84%, transparent) 34%,
    color-mix(in srgb, var(--bg) 30%, transparent) 72%,
    transparent 100%
  ) !important;
}

body.dark .cuisine-carousel-shell::before {
  background: linear-gradient(
    90deg,
    var(--bg) 0%,
    color-mix(in srgb, var(--bg) 88%, transparent) 34%,
    color-mix(in srgb, var(--bg) 36%, transparent) 74%,
    transparent 100%
  ) !important;
}

body.dark .cuisine-carousel-shell::after {
  background: linear-gradient(
    270deg,
    var(--bg) 0%,
    color-mix(in srgb, var(--bg) 88%, transparent) 34%,
    color-mix(in srgb, var(--bg) 36%, transparent) 74%,
    transparent 100%
  ) !important;
}

@media(max-width: 760px) {
  .recipe-card-with-like,
  .recipe-card-with-like .recipe-open-card {
    min-height: 148px !important;
  }

  .recipe-card-with-like .recipe-open-card {
    padding: 48px 16px 17px !important;
  }

  .cuisine-carousel-shell::before,
  .cuisine-carousel-shell::after {
    width: 64px !important;
    backdrop-filter: blur(7px) saturate(1.06) !important;
    -webkit-backdrop-filter: blur(7px) saturate(1.06) !important;
  }

  #countryGrid.cuisine-carousel {
    -webkit-mask-image: linear-gradient(90deg, transparent 0, rgba(0, 0, 0, .18) 18px, #000 64px, #000 calc(100% - 64px), rgba(0, 0, 0, .18) calc(100% - 18px), transparent 100%) !important;
    mask-image: linear-gradient(90deg, transparent 0, rgba(0, 0, 0, .18) 18px, #000 64px, #000 calc(100% - 64px), rgba(0, 0, 0, .18) calc(100% - 18px), transparent 100%) !important;
  }
}

/* Pinterest-style focused country slider */
.cuisine-carousel-shell {
  margin-top: 6px !important;
  perspective: 1100px !important;
  overflow: hidden visible !important;
}

#countryGrid.cuisine-carousel {
  --country-slide-width: clamp(250px, 28vw, 360px);
  grid-auto-columns: var(--country-slide-width) !important;
  gap: clamp(16px, 2.4vw, 30px) !important;
  padding: 38px max(24px, calc((100% - var(--country-slide-width)) / 2)) 42px !important;
  scroll-padding-inline: max(24px, calc((100% - var(--country-slide-width)) / 2)) !important;
  align-items: center !important;
  overflow-y: visible !important;
  scroll-snap-stop: always;
}

#countryGrid.cuisine-carousel .country-slide {
  scroll-snap-align: center !important;
  transform: translateY(14px) scale(.84) rotateY(0deg) !important;
  transform-origin: center center !important;
  opacity: .44 !important;
  filter: blur(2px) saturate(.72) brightness(.78) !important;
  z-index: 1 !important;
  transition:
    transform .36s cubic-bezier(.2,.85,.22,1),
    opacity .36s ease,
    filter .36s ease,
    box-shadow .36s ease !important;
  will-change: transform, opacity, filter !important;
}

#countryGrid.cuisine-carousel .country-slide.is-near {
  transform: translateY(8px) scale(.92) !important;
  opacity: .72 !important;
  filter: blur(.7px) saturate(.9) brightness(.9) !important;
  z-index: 2 !important;
}

#countryGrid.cuisine-carousel .country-slide.is-active {
  transform: translateY(0) scale(1) !important;
  opacity: 1 !important;
  filter: none !important;
  z-index: 4 !important;
  box-shadow:
    0 26px 60px color-mix(in srgb, var(--ink) 16%, transparent),
    var(--liquid-glow),
    var(--softShadow) !important;
}

#countryGrid.cuisine-carousel .country-slide.is-active .country-art-frame {
  transform: scale(1.035);
  box-shadow:
    0 16px 34px rgba(0,0,0,.14),
    0 0 0 8px color-mix(in srgb, var(--paper) 42%, transparent) !important;
}

#countryGrid.cuisine-carousel .country-slide .country-art-frame {
  transition: transform .36s cubic-bezier(.2,.85,.22,1), box-shadow .36s ease !important;
}

body.dark #countryGrid.cuisine-carousel .country-slide {
  filter: blur(2px) saturate(.68) brightness(.62) !important;
}

body.dark #countryGrid.cuisine-carousel .country-slide.is-near {
  filter: blur(.8px) saturate(.86) brightness(.82) !important;
}

body.dark #countryGrid.cuisine-carousel .country-slide.is-active {
  filter: none !important;
  box-shadow:
    0 30px 68px rgba(0,0,0,.46),
    0 0 44px rgba(76,124,198,.18),
    var(--liquid-glow),
    var(--softShadow) !important;
}

@media(max-width: 760px) {
  #countryGrid.cuisine-carousel {
    --country-slide-width: min(78vw, 320px);
    padding-top: 28px !important;
    padding-bottom: 34px !important;
  }

  #countryGrid.cuisine-carousel .country-slide {
    transform: translateY(10px) scale(.88) !important;
  }

  #countryGrid.cuisine-carousel .country-slide.is-near {
    transform: translateY(6px) scale(.94) !important;
  }

  #countryGrid.cuisine-carousel .country-slide.is-active {
    transform: translateY(0) scale(1) !important;
  }
}

/* Final country photo crop + theme-safe visibility */
.country-art-frame,
.meal-country-thumb {
  overflow: hidden !important;
  background: color-mix(in srgb, var(--paper) 86%, var(--bg)) !important;
}

.country-art,
.meal-country-img {
  width: 108% !important;
  height: 108% !important;
  max-width: none !important;
  max-height: none !important;
  object-fit: cover !important;
  object-position: center !important;
  transform: scale(1.035) !important;
  transform-origin: center !important;
}

.country-img-light {
  display: block !important;
  visibility: visible !important;
}

.country-img-dark {
  display: none !important;
  visibility: hidden !important;
}

body.dark .country-img-light {
  display: none !important;
  visibility: hidden !important;
}

body.dark .country-img-dark {
  display: block !important;
  visibility: visible !important;
}

body.dark .country-art-frame,
body.dark .meal-country-thumb {
  background: color-mix(in srgb, var(--paper) 84%, var(--bg)) !important;
}

/* Clear carousel edges and show every round country illustration in full */
#countryGrid.cuisine-carousel {
  -webkit-mask-image: none !important;
  mask-image: none !important;
}

.cuisine-carousel-shell::before,
.cuisine-carousel-shell::after {
  content: none !important;
  display: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

#countryGrid.cuisine-carousel .country-slide,
body.dark #countryGrid.cuisine-carousel .country-slide {
  filter: saturate(.82) brightness(.86) !important;
}

#countryGrid.cuisine-carousel .country-slide.is-near,
body.dark #countryGrid.cuisine-carousel .country-slide.is-near {
  filter: saturate(.94) brightness(.94) !important;
}

#countryGrid.cuisine-carousel .country-slide.is-active,
body.dark #countryGrid.cuisine-carousel .country-slide.is-active {
  filter: none !important;
}

.country-art,
.meal-country-img {
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  max-height: 100% !important;
  object-fit: contain !important;
  object-position: center !important;
  transform: none !important;
}

/* Keep the category menu steady while its recipe list is refreshed */
#categoryChoice,
#catControl,
#countryRecipes {
  overflow-anchor: none;
}

/* Lightweight country carousel: native momentum without repaint-heavy filters */
.cuisine-carousel-shell {
  perspective: none !important;
}

#countryGrid.cuisine-carousel {
  scroll-snap-stop: normal !important;
  touch-action: pan-x pinch-zoom !important;
  contain: layout style !important;
}

#countryGrid.cuisine-carousel .country-slide,
body.dark #countryGrid.cuisine-carousel .country-slide {
  scroll-snap-stop: normal !important;
  transform: translate3d(0,12px,0) scale(.88) !important;
  opacity: .58 !important;
  filter: none !important;
  transition: transform .22s cubic-bezier(.2,.8,.2,1), opacity .18s ease !important;
  will-change: transform !important;
  contain: layout paint style !important;
  backface-visibility: hidden !important;
}

#countryGrid.cuisine-carousel .country-slide.is-near,
body.dark #countryGrid.cuisine-carousel .country-slide.is-near {
  transform: translate3d(0,6px,0) scale(.94) !important;
  opacity: .82 !important;
  filter: none !important;
}

#countryGrid.cuisine-carousel .country-slide.is-active,
body.dark #countryGrid.cuisine-carousel .country-slide.is-active {
  transform: translate3d(0,0,0) scale(1) !important;
  opacity: 1 !important;
  filter: none !important;
  box-shadow: 0 18px 42px color-mix(in srgb, var(--ink) 14%, transparent), var(--softShadow) !important;
}

#countryGrid.cuisine-carousel .country-slide .country-art-frame,
#countryGrid.cuisine-carousel .country-slide.is-active .country-art-frame {
  transform: none !important;
  transition: box-shadow .18s ease !important;
}

/* Night artwork follows the same centred round frame and rim as the day set */
.country-art-frame,
.meal-country-thumb,
body.dark .country-art-frame,
body.dark .meal-country-thumb {
  box-sizing: border-box !important;
  border: 1px solid var(--paper-frame-main) !important;
  outline: 1px solid var(--paper-frame-soft) !important;
  outline-offset: -4px !important;
}

body.dark .country-art-frame,
body.dark .meal-country-thumb {
  background: color-mix(in srgb, var(--paper) 84%, var(--bg)) !important;
  box-shadow: 0 8px 18px rgba(0,0,0,.22) !important;
}

.country-art-frame > .country-art,
.meal-country-thumb > .meal-country-img {
  grid-area: 1 / 1 !important;
  place-self: center !important;
}

@media(max-width:760px) {
  #countryGrid.cuisine-carousel .country-slide,
  body.dark #countryGrid.cuisine-carousel .country-slide {
    transform: translate3d(0,8px,0) scale(.90) !important;
  }

  #countryGrid.cuisine-carousel .country-slide.is-near,
  body.dark #countryGrid.cuisine-carousel .country-slide.is-near {
    transform: translate3d(0,4px,0) scale(.95) !important;
  }

  #countryGrid.cuisine-carousel .country-slide.is-active,
  body.dark #countryGrid.cuisine-carousel .country-slide.is-active {
    transform: translate3d(0,0,0) scale(1) !important;
  }
}

/* Balanced grids, calm typography and two-axis carousel gestures */
:root {
  --ui-font: "Aptos", "Segoe UI Variable Text", "Segoe UI", system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
  --title-font: "Cambria", "Georgia", "Times New Roman", serif;
  --content-width: 1180px;
}

body,
button,
input,
select,
textarea {
  font-family: var(--ui-font) !important;
  font-weight: 400;
  font-style: normal;
}

body b,
body strong,
button b,
button strong {
  font-weight: 500 !important;
}

.btn,
.auth-chip,
.pill,
.meal-chip,
.recipe-card h3,
.country-card b,
.tab-card b,
.cat-tile b,
#custom .mini-kbju b {
  font-weight: 500 !important;
}

.home-my-card small,
.home-menu-card small,
#home .home-card-copy span,
#home .home-card-copy small {
  font-weight: 400 !important;
}

body em,
body i {
  font-style: normal !important;
}

h1,
h2,
h3,
h4,
h5,
h6,
.site-title,
.dialog-title h2,
.panel h3 {
  font-weight: 400 !important;
  font-style: normal !important;
}

.kicker,
.country-bottom,
.recipe-meta,
.recipe-badge,
.tag,
.field-label span,
.block-label,
.encyclopedia-filter,
.encyclopedia-card small,
.portion-label,
.progress,
.scale {
  font-weight: 450 !important;
  font-style: normal !important;
}

main.page,
.view,
.country-head,
.custom-head,
.cat-section,
.panel,
.tab-card,
.recipe-card,
.encyclopedia-card {
  box-sizing: border-box;
  min-width: 0;
}

main.page {
  width: min(100%, var(--content-width)) !important;
}

#home .home-planner-row,
#home .home-tools-row {
  width: min(100%, 820px) !important;
  max-width: 820px !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  grid-auto-rows: 1fr !important;
  gap: 14px !important;
  align-items: stretch !important;
}

#home .home-planner-row .tab-card,
#home .home-tools-row .tab-card {
  width: 100% !important;
  min-height: 116px !important;
  height: 100% !important;
}

.category-choice {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  grid-auto-rows: minmax(108px, 1fr) !important;
  align-items: stretch !important;
}

.category-choice .cat-tile {
  width: 100%;
  height: 100%;
}

.recipe-grid,
.liked-recipes-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  grid-auto-rows: 1fr !important;
  align-items: stretch !important;
}

.recipe-card,
.recipe-card-with-like,
.recipe-card-with-like .recipe-open-card {
  width: 100% !important;
  height: 100% !important;
}

.encyclopedia-filters {
  justify-content: center !important;
  align-items: center !important;
}

.encyclopedia-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  grid-auto-rows: 1fr !important;
  align-items: stretch !important;
  gap: 16px !important;
}

.encyclopedia-card {
  height: 100%;
  display: grid !important;
  grid-template-rows: auto auto 1fr;
  align-content: start;
}

.cuisine-carousel-shell {
  touch-action: pan-y pinch-zoom !important;
  overscroll-behavior-y: auto !important;
}

#countryGrid.cuisine-carousel {
  touch-action: pan-x pan-y pinch-zoom !important;
  overscroll-behavior-x: contain !important;
  overscroll-behavior-y: auto !important;
}

@media(max-width: 980px) {
  .category-choice {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .recipe-grid,
  .liked-recipes-grid,
  .encyclopedia-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media(max-width: 620px) {
  main.page {
    width: 100% !important;
    padding-inline: 12px !important;
  }

  #home .home-planner-row,
  #home .home-tools-row {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }

  #home .home-planner-row .tab-card,
  #home .home-tools-row .tab-card {
    min-height: 104px !important;
  }

  .category-choice {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    grid-auto-rows: minmax(96px, 1fr) !important;
    gap: 10px !important;
  }

  .recipe-grid,
  .liked-recipes-grid,
  .encyclopedia-grid {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }

  .recipe-card-with-like,
  .recipe-card-with-like .recipe-open-card {
    min-height: 142px !important;
  }

  .encyclopedia-card {
    min-height: 0 !important;
  }
}

@media(max-width: 360px) {
  .category-choice {
    grid-template-columns: 1fr !important;
  }
}

/* Keep the interactive header below native status bars and display cutouts. */
.topbar {
  padding-top: env(safe-area-inset-top, 0px) !important;
  box-sizing: border-box;
}

/* Matte theme surfaces: a single soft grain layer without woven/grid patterns. */
:root {
  --texture-image: url('../assets/textures/paper-light-canvas.webp') !important;
  --texture-opacity: .16 !important;
}

body.dark {
  --texture-image: url('../assets/textures/paper-dark-canvas.webp') !important;
  --texture-opacity: .14 !important;
}

body::before,
body.dark::before {
  background-image: var(--texture-image) !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: cover !important;
  background-attachment: fixed !important;
  opacity: var(--texture-opacity) !important;
  mix-blend-mode: soft-light !important;
  filter: none !important;
}

body::after,
body.dark::after {
  background-image: linear-gradient(180deg, rgba(255,255,255,.025), rgba(0,0,0,.018)) !important;
  background-size: auto !important;
  opacity: 1 !important;
}

.meal-picker-dialog,
.meal-picker-head,
.meal-picker-body,
.meal-type-card,
.meal-pick-card,
.meal-picker-card,
.meal-country-card,
.meal-recipe-card,
.meal-day,
.meal-slot {
  background-color: var(--paper) !important;
  background-image: linear-gradient(180deg, var(--surface-grad-1), var(--surface-grad-2) 72%, var(--surface-grad-3)) !important;
  background-size: auto !important;
  background-repeat: no-repeat !important;
  background-blend-mode: normal !important;
  filter: none !important;
}

body.dark .meal-picker-dialog,
body.dark .meal-picker-head,
body.dark .meal-picker-body,
body.dark .meal-type-card,
body.dark .meal-pick-card,
body.dark .meal-picker-card,
body.dark .meal-country-card,
body.dark .meal-recipe-card,
body.dark .meal-day,
body.dark .meal-slot {
  background-color: var(--paper) !important;
  background-image: linear-gradient(180deg, var(--surface-grad-1), var(--surface-grad-2) 72%, var(--surface-grad-3)) !important;
  background-size: auto !important;
  background-repeat: no-repeat !important;
  background-blend-mode: normal !important;
  filter: none !important;
}

/* Animated theme switch. The persistent thumb moves left-to-right instead of being redrawn. */
.theme-btn,
body.dark .theme-btn {
  width: 72px !important;
  height: 40px !important;
  min-width: 72px !important;
  padding: 0 !important;
  border: 0 !important;
  outline: 0 !important;
  border-radius: 999px !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}

.theme-btn:hover {
  transform: translateY(-1px) !important;
  box-shadow: none !important;
}

.theme-btn:active,
.theme-btn.tapped {
  transform: scale(.97) !important;
  box-shadow: none !important;
}

.room-switch {
  position: absolute !important;
  inset: 0 !important;
  width: auto !important;
  height: auto !important;
  display: block !important;
  border-radius: 999px !important;
}

.switch-plate {
  box-sizing: border-box !important;
  position: absolute !important;
  inset: 0 !important;
  width: auto !important;
  height: auto !important;
  border-radius: 999px !important;
  border: 1px solid rgba(186,140,67,.62) !important;
  background: linear-gradient(180deg, rgba(255,252,244,.98), rgba(234,219,189,.96)) !important;
  box-shadow: inset 0 1px 2px rgba(255,255,255,.9), inset 0 -2px 5px rgba(111,83,43,.14), 0 5px 13px rgba(93,69,39,.12) !important;
  transition: background .42s ease, border-color .42s ease, box-shadow .42s ease !important;
}

.switch-rocker {
  box-sizing: border-box !important;
  left: 4px !important;
  top: 4px !important;
  width: 32px !important;
  height: 32px !important;
  border-radius: 50% !important;
  border: 1px solid rgba(197,151,76,.48) !important;
  background: radial-gradient(circle at 34% 30%, #fffdf7 0 18%, #f9e7b8 58%, #d9ac5d 100%) !important;
  box-shadow: 0 3px 8px rgba(90,62,27,.2), 0 0 12px rgba(255,211,126,.32), inset 0 1px 1px rgba(255,255,255,.9) !important;
  transform: translate3d(0,0,0) !important;
  transition: transform .44s cubic-bezier(.2,.9,.18,1), background .4s ease, border-color .4s ease, box-shadow .4s ease !important;
  will-change: transform !important;
}

.room-switch.is-on .switch-plate {
  border-color: rgba(235,195,117,.66) !important;
  background: linear-gradient(180deg, #203f72, #0d2245) !important;
  box-shadow: inset 0 2px 5px rgba(255,239,201,.08), inset 0 -3px 8px rgba(0,0,0,.36), 0 0 15px rgba(112,157,235,.18) !important;
}

.room-switch.is-on .switch-rocker {
  left: 4px !important;
  transform: translate3d(32px,0,0) !important;
  border-color: rgba(224,238,255,.62) !important;
  background: radial-gradient(circle at 35% 30%, #f8fbff 0 16%, #b9d2f4 55%, #739bd5 100%) !important;
  box-shadow: 0 0 11px rgba(186,217,255,.78), 0 0 22px rgba(106,160,238,.36), 0 4px 8px rgba(0,0,0,.25) !important;
}

.theme-btn.theme-morph .switch-rocker,
body.dark .theme-btn.theme-morph .switch-rocker {
  animation: themeThumbPulse .48s ease both !important;
}

@keyframes themeThumbPulse {
  0%,100% { filter: brightness(1); }
  48% { filter: brightness(1.18); }
}

@media (prefers-reduced-motion: reduce) {
  .switch-rocker,
  .switch-plate,
  .switch-glow {
    transition-duration: .01ms !important;
    animation: none !important;
  }
}

/* Keep the page fixed while the meal picker is active and make every category reachable. */
body.meal-picker-open {
  overflow: hidden !important;
  overscroll-behavior: none !important;
}

.meal-picker-modal {
  box-sizing: border-box !important;
  padding: max(12px, env(safe-area-inset-top, 0px)) 12px max(12px, env(safe-area-inset-bottom, 0px)) !important;
  overscroll-behavior: contain !important;
}

.meal-picker-dialog {
  width: min(680px, calc(100vw - 24px)) !important;
  max-height: min(760px, calc(100dvh - max(24px, env(safe-area-inset-top, 0px)) - max(24px, env(safe-area-inset-bottom, 0px)))) !important;
}

.meal-picker-body {
  min-height: 0 !important;
  overflow: hidden !important;
  padding: 12px 14px max(18px, env(safe-area-inset-bottom, 0px)) !important;
}

.meal-type-grid-modal,
.meal-pick-grid-modal {
  min-height: 0 !important;
  max-height: 100% !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior: contain !important;
  -webkit-overflow-scrolling: touch !important;
  scrollbar-gutter: stable !important;
  padding: 3px 5px 12px 3px !important;
  margin: 0 !important;
}

@media(max-width: 560px) {
  .theme-btn,
  body.dark .theme-btn {
    width: 62px !important;
    min-width: 62px !important;
    height: 34px !important;
  }

  .switch-rocker {
    width: 26px !important;
    height: 26px !important;
  }

  .room-switch.is-on .switch-rocker {
    transform: translate3d(28px,0,0) !important;
  }

  .meal-picker-dialog {
    width: calc(100vw - 16px) !important;
    max-height: calc(100dvh - max(16px, env(safe-area-inset-top, 0px)) - max(16px, env(safe-area-inset-bottom, 0px))) !important;
    border-radius: 24px !important;
  }

  .meal-picker-head {
    padding: 12px 14px 10px !important;
  }

  .meal-picker-head h3 {
    font-size: clamp(22px, 7vw, 28px) !important;
  }

  .meal-type-grid-modal {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    grid-auto-rows: minmax(58px, auto) !important;
    gap: 8px !important;
  }

  .meal-type-grid-modal .meal-type-card {
    min-width: 0 !important;
    min-height: 58px !important;
    padding: 8px 6px !important;
  }
}

@media(max-width: 340px) {
  .meal-type-grid-modal {
    grid-template-columns: 1fr !important;
  }
}

/* Recipe actions: one balanced matte control family for like and share. */
#modalTags {
  align-items: center;
}

.like-btn,
.share-btn {
  box-sizing: border-box;
  min-height: 40px;
  border: 1px solid color-mix(in srgb, var(--gold) 56%, var(--line));
  border-radius: 999px;
  background-color: var(--paper);
  background-image: linear-gradient(180deg, rgba(255,255,255,.10), rgba(0,0,0,.025));
  color: var(--ink);
  box-shadow: 0 5px 13px rgba(68,52,37,.10), inset 0 1px 0 rgba(255,255,255,.24);
  cursor: pointer;
  transition: transform .16s ease, border-color .2s ease, background-color .2s ease, color .2s ease, box-shadow .2s ease;
}

.like-btn {
  width: 40px;
  height: 40px;
  display: inline-grid;
  place-items: center;
  padding: 0;
  color: color-mix(in srgb, #a65a62 78%, var(--ink));
}

.like-btn .line-icon,
.share-btn .line-icon {
  width: 19px;
  height: 19px;
  stroke-width: 1.65;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.like-btn .line-icon {
  fill: transparent;
}

.like-btn.active {
  color: #b34f5a;
  border-color: color-mix(in srgb, #b34f5a 58%, var(--gold));
  background-color: color-mix(in srgb, #f3d9dc 54%, var(--paper));
  background-image: none;
}

.like-btn.active .line-icon {
  fill: currentColor;
}

.share-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  height: 40px;
  padding: 0 14px;
  font: inherit;
  font-size: 12px;
  letter-spacing: .01em;
}

.share-btn:hover,
.like-btn:hover {
  transform: translateY(-1px);
  border-color: var(--gold);
}

.share-btn:active,
.like-btn:active {
  transform: translateY(1px) scale(.98);
  box-shadow: inset 0 2px 5px rgba(41,31,23,.14);
}

.share-btn:focus-visible,
.like-btn:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--gold) 72%, transparent);
  outline-offset: 3px;
}

.revoke-share-btn[hidden] {
  display: none !important;
}

.revoke-share-btn {
  color: color-mix(in srgb, #a65a62 72%, var(--ink));
}

#modalTags .like-btn {
  width: 40px;
  height: 40px;
}

body.dark .like-btn,
body.dark .share-btn {
  background-color: var(--paper);
  background-image: linear-gradient(180deg, rgba(255,255,255,.045), rgba(0,0,0,.08));
  box-shadow: 0 6px 15px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.07);
}

body.dark .like-btn.active {
  color: #ef9ca5;
  background-color: color-mix(in srgb, #7d3440 35%, var(--paper));
  background-image: none;
}

.meal-type-card-personal {
  border: 1px solid color-mix(in srgb, var(--gold) 66%, var(--line)) !important;
  box-shadow: 0 8px 20px rgba(122,91,44,.13), inset 0 1px 0 rgba(255,255,255,.22) !important;
}

/* Stable document background: no fixed layers that can split while the viewport scrolls. */
html {
  min-height: 100%;
  background-color: #faf4e6;
}

html.dark {
  background-color: #0b1730;
}

body,
body.dark {
  position: relative;
  isolation: isolate;
  min-height: 100vh;
  min-height: 100dvh;
  background-attachment: scroll !important;
  background-repeat: no-repeat !important;
  background-position: top center !important;
  background-size: 100% 100% !important;
}

body {
  background-image: linear-gradient(180deg, #ffffff 0%, #faf4e6 100%) !important;
}

body.dark {
  background-image:
    radial-gradient(ellipse at 50% -4%, rgba(255,197,107,.12) 0%, rgba(255,197,107,.05) 18%, transparent 42%),
    linear-gradient(180deg, #1f4b93 0%, #102445 36%, #0b1730 100%) !important;
}

body::before,
body.dark::before {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  inset: 0 !important;
  min-height: 100% !important;
  z-index: -1 !important;
  background-image: var(--texture-image) !important;
  background-attachment: scroll !important;
  background-repeat: repeat-y !important;
  background-position: top center !important;
  background-size: 100% auto !important;
  opacity: var(--texture-opacity) !important;
  mix-blend-mode: soft-light !important;
  filter: none !important;
  transform: none !important;
}

body::after,
body.dark::after {
  content: none !important;
  display: none !important;
}

/* Compact recipe header controls with one visual size. */
#modalTags {
  gap: 7px;
}

#modalTags .tag,
#modalTags .like-btn,
#modalTags .share-btn,
#dialog .close {
  box-sizing: border-box;
  min-height: 40px;
  height: 40px;
}

#modalTags .tag {
  padding: 0 12px;
  font-size: 12px;
  font-weight: 600;
  white-space: nowrap;
}

#modalTags .like-btn,
#modalTags .share-btn,
#dialog .close {
  width: 40px;
  min-width: 40px;
  padding: 0;
  border-radius: 50%;
}

#modalTags .share-btn {
  gap: 0;
}

#modalTags .share-btn span {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

#dialog .close {
  font-size: 22px;
}

@media(max-width: 480px) {
  .dialog-head {
    padding-inline: 14px;
  }

  .dialog-title {
    gap: 8px;
  }

  #modalTags {
    justify-content: center;
  }

  #modalTags .tag {
    padding-inline: 10px;
  }
}

/* Account recipe versions and complete country category lists. */
#categoryChoice {
  grid-auto-flow: row !important;
}

.recipe-version-actions {
  margin-top: 18px;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 22px;
  background: var(--paper);
  box-shadow: var(--softShadow), var(--inner);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
}

.recipe-version-actions strong {
  display: block;
  margin-bottom: 5px;
  font-weight: 600;
}

.recipe-version-actions p,
.base-editor-status {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.45;
}

.recipe-version-buttons,
.base-editor-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  flex-wrap: wrap;
}

.recipe-version-buttons .btn {
  min-height: 42px;
  padding: 0 15px;
  border-radius: 15px;
  white-space: nowrap;
}

.recipe-reset-btn:disabled {
  opacity: .42;
  cursor: default;
  transform: none !important;
}

.base-recipe-editor {
  display: grid;
  gap: 16px;
}

.base-editor-grid,
.base-editor-nutrition {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.base-editor-nutrition {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.base-recipe-editor label {
  min-width: 0;
  display: grid;
  gap: 7px;
}

.base-recipe-editor label > span {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.3;
}

.base-editor-wide textarea {
  width: 100%;
  min-height: 132px;
  resize: vertical;
  line-height: 1.5;
}

.base-editor-wide:nth-of-type(2) textarea {
  min-height: 180px;
}

.base-editor-country .input[readonly] {
  opacity: .72;
}

.base-editor-actions {
  padding-top: 4px;
}

.base-editor-actions .btn {
  min-height: 44px;
  padding-inline: 18px;
}

/* The dark header icon uses the same replaced element and geometry as light. */
body.dark .brand-app-icon {
  opacity: 1 !important;
  width: 100% !important;
  height: 100% !important;
  transform: scale(1.035) !important;
  object-fit: cover !important;
}

body.dark .brand-mark::after {
  content: none !important;
  display: none !important;
}

/* Prevent Android/WebView from drawing a blue tap or text-selection rectangle. */
.theme-btn,
.theme-btn *,
.room-switch,
.switch-plate,
.switch-rocker,
.switch-glow {
  -webkit-tap-highlight-color: transparent !important;
  -webkit-touch-callout: none !important;
  -webkit-user-select: none !important;
  user-select: none !important;
}

.theme-btn {
  appearance: none !important;
  -webkit-appearance: none !important;
  touch-action: manipulation !important;
}

.theme-btn:focus,
.theme-btn:focus-visible {
  outline: 0 !important;
  box-shadow: none !important;
}

@media(max-width: 720px) {
  .recipe-version-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .recipe-version-buttons,
  .base-editor-actions {
    display: grid;
    grid-template-columns: 1fr;
  }

  .recipe-version-buttons .btn,
  .base-editor-actions .btn {
    width: 100%;
  }

  .base-editor-grid,
  .base-editor-nutrition {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Keep touch feedback matte and replace browser/WebView blue focus boxes. */
body :is(button, a, [role="button"], summary) {
  -webkit-tap-highlight-color: transparent !important;
  -webkit-touch-callout: none !important;
  -webkit-user-select: none !important;
  user-select: none !important;
  outline: 0 !important;
  outline-offset: 0 !important;
}

body :is(button, a, [role="button"], summary):focus {
  outline: 0 !important;
}

body :is(button, a, [role="button"], summary):focus-visible {
  outline: 2px solid color-mix(in srgb, var(--gold) 72%, transparent) !important;
  outline-offset: 2px !important;
}

body :is(.back-btn, .meal-picker-back, .close, .cuisine-carousel-arrow) {
  appearance: none !important;
  -webkit-appearance: none !important;
}

button::-moz-focus-inner {
  border: 0;
}

@media(max-width: 420px) {
  .base-editor-grid,
  .base-editor-nutrition {
    grid-template-columns: 1fr;
  }
}

/* Ingredient-led sections keep every cuisine category easy to scan. */
.ingredient-group-block {
  display: grid;
  gap: 13px;
  width: 100%;
  margin: 0;
}

.cat-section > .ingredient-group-block + .ingredient-group-block {
  margin-top: 28px;
}

.ingredient-group-head {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 36px;
  text-align: center;
}

.ingredient-group-head::before,
.ingredient-group-head::after {
  content: "";
  flex: 1 1 70px;
  max-width: 150px;
  height: 1px;
  background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--line) 72%, transparent));
}

.ingredient-group-head::after {
  background: linear-gradient(90deg, color-mix(in srgb, var(--line) 72%, transparent), transparent);
}

.ingredient-group-head h3 {
  margin: 0;
  font-size: clamp(18px, 1.45vw, 23px);
  line-height: 1.15;
  font-weight: 500;
  color: var(--ink);
}

.ingredient-group-head span {
  flex: 0 0 auto;
  padding: 6px 9px;
  border-radius: 999px;
  color: var(--muted);
  background: var(--paper);
  box-shadow: var(--pressed);
  font-size: 11px;
  line-height: 1;
}

.my-ingredient-group {
  grid-column: 1 / -1;
}

.my-ingredient-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

@media(max-width: 720px) {
  .cat-section > .ingredient-group-block + .ingredient-group-block {
    margin-top: 22px;
  }

  .ingredient-group-head::before,
  .ingredient-group-head::after {
    max-width: 42px;
  }

  .ingredient-group-head {
    gap: 7px;
  }

  .ingredient-group-head span {
    font-size: 10px;
  }

  .my-ingredient-grid {
    grid-template-columns: 1fr;
  }
}