:root {
  --ink:#171916; --muted:#73776f; --paper:#f4f1e9; --card:#fffefa;
  --dark:#11130f; --lime:#FFDF00; --amber:#FFDF00; --peach:#ffcab4;
  --lilac:#d8d0ff; --blue:#b8dfff; --line:#e4e0d7; --green:#376b42;
  --protein:#FFDF00; --carbs:#aa9cff; --fats:#ffad70;
  --shadow:0 20px 60px rgba(26,28,22,.13);
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:#272924;color:var(--ink);font-family:"DM Sans",sans-serif}body.sheet-open{overflow:hidden}
button,input{font:inherit}
button{border:0;cursor:pointer;color:inherit}
body{background:
  radial-gradient(circle at 20% 10%,rgba(217,255,67,.15),transparent 28%),
  radial-gradient(circle at 85% 80%,rgba(255,174,69,.12),transparent 25%),#23251f}
.app-shell{min-height:100vh;display:grid;place-items:center;padding:24px}
.phone{position:relative;width:min(100%,430px);height:min(900px,calc(100vh - 48px));background:#12130f url("assets/flash-fitness-background.webp") center/cover no-repeat;border-radius:36px;overflow:hidden;box-shadow:0 40px 100px rgba(0,0,0,.4);border:1px solid rgba(255,194,43,.28)}
.topbar{height:70px;display:flex;align-items:center;justify-content:space-between;padding:15px 20px 10px;background:linear-gradient(rgba(8,9,7,.84) 68%,rgba(8,9,7,.56) 86%,rgba(8,9,7,0));position:absolute;inset:0 0 auto;z-index:15;backdrop-filter:blur(7px)}
.brand{background:none;color:#fff;display:flex;align-items:center;gap:9px;font:800 12px/1 "Manrope";letter-spacing:1.5px}
.brand-mark{width:31px;height:31px;display:grid;place-items:center;border-radius:9px;background:#FFDF00;color:#111;font-size:14px;box-shadow:0 0 22px rgba(245,185,28,.28)}.brand-mark span{color:#111}
.top-actions{display:flex;align-items:center;gap:10px}.icon-button{position:relative;width:38px;height:38px;display:grid;place-items:center;background:#ebe8df;border-radius:50%}.icon-button.dark{background:#e8e4db}.icon-button.small{width:30px;height:30px;background:rgba(17,19,15,.08)}.notification-dot{position:absolute;right:6px;top:6px;width:7px;height:7px;border-radius:50%;background:#f36b4b;border:2px solid var(--paper)}
.topbar .icon-button{background:rgba(255,255,255,.12);color:#fff;border:1px solid rgba(255,255,255,.12)}.notification-dot{border-color:#171811}.avatar{width:38px;height:38px;border-radius:50%;background:#FFDF00;font-weight:800;font-size:12px;border:2px solid rgba(255,255,255,.72)}
.icon{width:20px;height:20px;display:inline-grid;place-items:center}.icon svg{width:100%;height:100%;stroke:currentColor;fill:none;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}.icon.mini{width:14px;height:14px}.icon.large{width:43px;height:43px}
.screen-stack{height:100%;overflow:hidden}.screen{position:relative;height:100%;overflow-y:auto;padding:79px 18px 105px;display:none;scrollbar-width:none;background:transparent;color:#fff;text-shadow:0 2px 12px rgba(0,0,0,.45)}.screen:before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(5,6,5,.03),rgba(5,6,5,.18) 50%,rgba(5,6,5,.42));pointer-events:none}.screen>*{position:relative}.screen::-webkit-scrollbar{display:none}.screen.active{display:block;animation:screenIn .28s ease both}
@keyframes screenIn{from{opacity:.35;transform:translateY(8px)}to{opacity:1;transform:none}}
.greeting-row,.page-title,.section-heading{display:flex;justify-content:space-between;align-items:flex-end}.greeting-row h1,.page-title h1{font:800 28px/1.1 "Manrope";letter-spacing:-1.2px;margin:4px 0 0}.eyebrow{font:800 10px/1.2 "Manrope";letter-spacing:1.5px;margin:0;color:#7a7d75}.eyebrow.light{color:rgba(255,255,255,.55)}
.streak{display:flex;align-items:center;gap:3px;background:#fff0e5;border-radius:99px;padding:8px 11px;color:#e86e34}.streak .icon{width:16px}.streak strong{color:var(--ink)}
.macro-card{margin-top:20px;background:var(--dark);color:#fff;border-radius:25px;padding:22px;box-shadow:var(--shadow);position:relative;overflow:hidden}.macro-card:after{content:"";position:absolute;width:150px;height:150px;border-radius:50%;background:rgba(217,255,67,.08);right:-60px;top:-70px}.macro-card-head{display:flex;justify-content:space-between;align-items:flex-start;position:relative;z-index:1}.calorie-line{margin-top:6px}.calorie-line strong{font:800 35px/1 "Manrope";letter-spacing:-2px}.calorie-line span{font-size:12px;color:#aeb1aa;margin-left:7px}.text-button{background:none;color:#555a52;font-size:12px;font-weight:700;display:flex;align-items:center;gap:2px}.macro-card .text-button{color:var(--lime)}
.energy-track{height:6px;border-radius:10px;background:#33362f;margin:20px 0 18px;overflow:hidden}.energy-track span{display:block;height:100%;background:var(--lime);border-radius:10px}
.macro-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.macro-grid>div{position:relative;padding-left:13px}.macro-grid p{font-size:10px;color:#8f938b;margin:0 0 3px}.macro-grid strong{font:700 13px "Manrope"}.macro-grid em{font-style:normal;font:400 9px "DM Sans";color:#8f938b}.macro-dot{position:absolute;left:0;top:3px;width:5px;height:27px;border-radius:4px}.macro-dot.protein{background:var(--protein)}.macro-dot.carbs{background:var(--carbs)}.macro-dot.fats{background:var(--fats)}
.quote-card{margin-top:12px;background:rgba(12,13,11,.72);border:1px solid rgba(245,185,28,.22);backdrop-filter:blur(12px);border-radius:18px;padding:13px 14px;display:flex;align-items:center;gap:10px}.quote-mark{font:800 33px/1 Georgia;color:#FFDF00}.quote-card>div{flex:1}.quote-card p{font:600 12px/1.35 "Manrope";margin:0}.quote-card div span{font-size:9px;color:rgba(255,255,255,.55)}.section-heading{margin:25px 2px 12px}.section-heading h2{font:800 18px/1.2 "Manrope";margin:3px 0 0;letter-spacing:-.5px}.compact-heading{margin-top:23px}
.next-card{height:278px;border-radius:24px;position:relative;overflow:hidden;color:#fff;box-shadow:var(--shadow)}.next-card>img{width:100%;height:100%;object-fit:cover}.image-shade{position:absolute;inset:0;background:linear-gradient(transparent 22%,rgba(11,12,10,.12) 45%,rgba(11,12,10,.92) 100%)}.next-card-content{position:absolute;inset:auto 18px 18px}.time-pill,.tag{display:inline-flex;font:800 9px/1 "Manrope";letter-spacing:1px;border-radius:99px;padding:7px 9px;background:rgba(255,255,255,.16);backdrop-filter:blur(10px)}.next-card h3{font:800 21px/1.15 "Manrope";margin:10px 0 5px;letter-spacing:-.6px}.next-card p{margin:0;color:#d6d8d1;font-size:11px}.next-card p span{padding:0 4px}.card-actions{display:flex;gap:8px;margin-top:14px}
.primary{background:var(--lime);color:var(--dark);border-radius:14px;padding:13px 17px;font:800 12px "Manrope";display:inline-flex;justify-content:center;align-items:center;gap:7px}.primary[hidden]{display:none}.primary.compact{padding:10px 13px}.primary.full,.secondary.full{width:100%;margin-top:14px}.primary .icon{width:16px}.glass-button{padding:10px 13px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.2);color:#fff;border-radius:12px;font-weight:700;font-size:11px;backdrop-filter:blur(12px)}
.page-title{align-items:center;margin-bottom:18px}.search-box{height:48px;background:var(--card);border:1px solid var(--line);border-radius:15px;display:flex;align-items:center;padding:0 13px;gap:9px}.search-box .icon{color:#777b73}.search-box input{border:0;outline:0;background:transparent;flex:1;min-width:0}.search-box button{background:none;display:grid;place-items:center}
.quick-actions{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:13px 0 18px}.quick-actions button{background:var(--card);border:1px solid var(--line);border-radius:17px;padding:12px 8px;text-align:left;display:flex;flex-direction:column;gap:8px}.quick-icon{width:34px;height:34px;border-radius:11px;display:grid;place-items:center}.quick-icon .icon{width:17px}.lime{background:var(--lime)}.lilac{background:var(--lilac)}.peach{background:var(--peach)}.blue{background:var(--blue)}.quick-actions strong{font:700 10px "Manrope";display:block}.quick-actions small{font-size:8px;color:var(--muted);display:block;margin-top:2px}
.focus-row{display:flex;gap:7px;overflow-x:auto;scrollbar-width:none}.filter-chip{white-space:nowrap;border-radius:99px;padding:8px 12px;background:#e7e3da;color:#6c7068;font-size:10px;font-weight:700}.filter-chip.active{background:var(--dark);color:#fff}.match-badge,.status-good{font:800 9px "Manrope";color:#386c3f;background:#deeed8;padding:7px 9px;border-radius:99px}.status-bad{font:800 9px "Manrope";color:#b96012;background:#fff0dc;padding:7px 9px;border-radius:99px}
.recipe-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.recipe-card{background:var(--card);border-radius:19px;overflow:hidden;box-shadow:0 8px 24px rgba(28,30,24,.06)}.recipe-image{height:143px;position:relative;overflow:hidden}.recipe-image>img{width:100%;height:100%;object-fit:cover}.save-button{position:absolute;right:8px;top:8px;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:rgba(20,22,18,.56);color:#fff;backdrop-filter:blur(8px)}.save-button .icon{width:15px}.save-button.saved{background:var(--lime);color:var(--dark)}.image-tag{position:absolute;left:8px;bottom:8px;background:rgba(16,18,14,.74);color:#fff;border-radius:7px;padding:5px 6px;font:700 7px "Manrope";letter-spacing:.7px}.food-art{height:100%;display:grid;place-items:center;font-size:57px}.food-art.frenchtoast{background:linear-gradient(140deg,#ffe9b3,#e2a552)}.food-art.burger{background:linear-gradient(140deg,#e8b98a,#a8622f)}.food-art.jello{background:linear-gradient(140deg,#ffc2d1,#e8607e)}.food-art.nicecream{background:linear-gradient(140deg,#ffe3ee,#ff8aa8)}.food-art.eggcup{background:linear-gradient(140deg,#ffd9a0,#e08a3c)}.recipe-body{padding:11px}.recipe-body h3{font:800 12px/1.25 "Manrope";margin:0}.recipe-body p{font-size:9px;color:var(--muted);margin:5px 0 9px}.recipe-body>div{display:flex;justify-content:space-between;align-items:center;font-size:9px;color:#7c8077}.add-plan{width:27px;height:27px;border-radius:9px;background:#eeebe3;display:grid;place-items:center}.add-plan .icon{width:14px}
.week-score{background:var(--dark);color:#fff;border-radius:22px;padding:18px;display:flex;align-items:center;gap:15px}.score-ring{width:66px;height:66px;border-radius:50%;display:grid;place-items:center;position:relative;background:conic-gradient(var(--lime) 87%,#34372f 0)}.score-ring:after{content:"";position:absolute;inset:6px;background:var(--dark);border-radius:50%}.score-ring strong,.score-ring span{position:absolute;z-index:1}.score-ring strong{font:800 20px "Manrope";transform:translateX(-3px)}.score-ring span{font-size:9px;transform:translate(16px,3px);color:#8d9188}.week-score>div:last-child{flex:1}.week-score h3{font:800 16px "Manrope";margin:4px 0}.week-score>div:last-child>p:last-child{font-size:9px;color:#a3a69e;margin:0}
.focus-control{margin:12px 0;background:#e8e4da;padding:7px 7px 7px 12px;border-radius:15px;display:flex;align-items:center;justify-content:space-between}.focus-control>span{font:700 10px "Manrope";display:flex;align-items:center;gap:6px}.focus-control .icon{width:15px}.segmented{display:flex;background:#d9d5ca;border-radius:11px;padding:3px}.segmented button{font-size:8px;font-weight:700;background:transparent;border-radius:8px;padding:7px 8px}.segmented button.active{background:var(--card);box-shadow:0 2px 5px rgba(0,0,0,.09)}
.date-strip{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;margin:18px 0 13px}.date-strip button{background:none;border-radius:14px;padding:7px 3px;display:flex;flex-direction:column;align-items:center;gap:5px}.date-strip span{font-size:8px;color:#92958e}.date-strip strong{font:700 12px "Manrope"}.date-strip i{width:4px;height:4px;border-radius:50%;background:#b6b8b1}.date-strip button.selected{background:var(--dark);color:#fff}.date-strip button.selected span{color:#aaa}.date-strip button.selected i{background:var(--lime)}
.day-summary{background:var(--card);border:1px solid var(--line);padding:11px 12px;border-radius:15px;display:flex;align-items:center;gap:14px}.day-summary>div strong{font:800 12px "Manrope";display:block}.day-summary>div span{font-size:8px;color:var(--muted)}.day-summary>.status-good,.day-summary>.status-bad{margin-left:auto}
.meal-timeline{margin:17px 0}.meal-timeline article{display:grid;grid-template-columns:39px 14px 1fr;gap:8px;min-height:72px}.meal-time{text-align:right;padding-top:4px}.meal-time span{font:700 9px "Manrope";display:block}.meal-time small{font-size:7px;color:var(--muted)}.timeline-line{position:relative}.timeline-line:after{content:"";position:absolute;top:12px;bottom:-3px;left:6px;width:1px;background:#d1cec5}.meal-timeline article:last-child .timeline-line:after{display:none}.timeline-line i{display:block;width:7px;height:7px;border:2px solid var(--dark);border-radius:50%;margin:7px 0 0 3px;background:var(--paper);position:relative;z-index:1}.planned-meal{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:10px;margin-bottom:8px}.meal-label{font:800 7px "Manrope";color:#8a8e85;letter-spacing:1px}.planned-meal h3{font:800 11px "Manrope";margin:3px 0}.planned-meal p{font-size:8px;color:var(--muted);margin:0}.planned-meal.featured{display:flex;gap:9px}.planned-meal.featured img{width:48px;height:48px;border-radius:10px;object-fit:cover}.empty-meal{display:flex;align-items:center;gap:10px;border:1px dashed #c5c2b9;background:transparent;border-radius:14px;padding:10px;text-align:left;margin-bottom:8px}.empty-meal>.icon{width:30px;height:30px;background:#e5e1d8;border-radius:9px;padding:7px}.empty-meal strong{font:700 10px "Manrope";display:block}.empty-meal small{font-size:8px;color:var(--muted)}
.prep-banner{width:100%;background:#dfe8cf;border-radius:17px;padding:12px;display:flex;align-items:center;text-align:left;gap:10px}.prep-icon{width:38px;height:38px;background:var(--lime);display:grid;place-items:center;border-radius:12px}.prep-banner>span:nth-child(2){flex:1}.prep-banner strong{display:block;font:800 11px "Manrope"}.prep-banner small{font-size:8px;color:#6d7465}.prep-banner>.icon{width:16px}
.period-button{background:#e6e2d8;border-radius:99px;padding:8px 10px;font-size:9px;font-weight:700;display:flex;align-items:center;gap:4px}.period-button .icon{width:13px}.consistency-card{background:var(--dark);color:#fff;border-radius:24px;padding:20px}.consistency-main{display:flex;align-items:baseline;margin-top:5px}.consistency-main strong{font:800 48px/1 "Manrope";letter-spacing:-3px}.consistency-main span{font-size:14px;color:#7e8279}.consistency-main i{font-style:normal;font:700 9px "Manrope";color:#527f4e;background:#dfffc7;border-radius:99px;padding:5px 7px;margin-left:auto}.consistency-card>p:nth-of-type(2){font-size:10px;color:#a4a79f}.week-dots{display:grid;grid-template-columns:repeat(7,1fr);gap:8px;margin-top:17px}.week-dots span{aspect-ratio:1;border-radius:50%;display:grid;place-items:center;font:700 8px "Manrope";background:#2e312b}.week-dots .done{background:var(--lime);color:var(--dark)}.week-dots .today-dot{border:1px solid var(--lime);color:var(--lime)}
.metric-pair{display:grid;grid-template-columns:1fr 1fr;gap:11px;margin:12px 0}.metric-pair article{background:var(--card);border-radius:20px;padding:14px}.metric-icon{width:32px;height:32px;border-radius:10px;display:grid;place-items:center}.metric-icon .icon{width:16px}.metric-pair p{font-size:9px;color:var(--muted);margin:12px 0 2px}.metric-pair strong{font:800 22px "Manrope";display:block}.metric-pair small{font-size:8px;color:var(--muted)}
.chart-card{background:var(--card);border-radius:21px;padding:16px}.chart-head{display:flex;justify-content:space-between}.chart-head h3{font:800 16px "Manrope";margin:3px 0}.bar-chart{height:150px;display:flex;align-items:flex-end;gap:13px;padding-top:20px;position:relative}.bar-chart>div{height:100%;flex:1;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:6px}.bar-chart i{width:100%;max-width:20px;border-radius:6px 6px 2px 2px;background:#d9d6cd;display:block}.bar-chart i.today-bar{background:var(--lime);border:1px solid var(--dark)}.bar-chart span{font-size:8px;color:var(--muted)}.goal-line{position:absolute;top:29px;left:0;right:0;border-top:1px dashed #b2b5ad;font:400 7px "DM Sans";color:#92968d;text-align:right;padding-top:2px}
.insight-card{margin-top:12px;background:#e5dfef;border-radius:19px;padding:15px;display:flex;gap:12px}.insight-card>.icon{color:#7258a7}.insight-card h3{font:800 13px "Manrope";margin:3px 0}.insight-card div p:last-child{font-size:9px;line-height:1.45;color:#66616e;margin:0}
.bottom-nav{position:absolute;z-index:20;inset:auto 0 0;height:82px;background:rgba(8,9,7,.84);backdrop-filter:blur(20px);border-top:1px solid rgba(245,185,28,.2);display:grid;grid-template-columns:1fr 1fr 62px 1fr 1fr;align-items:center;padding:5px 9px 12px}.bottom-nav button{background:none;color:#9d9e98;display:flex;flex-direction:column;align-items:center;gap:3px;font:700 8px "Manrope"}.bottom-nav button.active{color:#fff}.bottom-nav button.active .icon{background:#FFDF00;color:#111;border-radius:9px;padding:5px;width:30px;height:30px}.nav-main-action{position:absolute;left:50%;top:5px;width:56px!important;height:56px;border-radius:17px!important;background:#FFDF00!important;color:#111!important;display:grid!important;place-items:center;padding:0!important;gap:0;transform:translate(-50%,-11px);box-shadow:0 8px 24px rgba(245,185,28,.28)}.nav-main-action .icon{width:25px;height:25px}.nav-main-action .nav-logo-mark{width:31px;height:31px;padding:0}.nav-main-action .nav-logo-mark svg{display:block;fill:currentColor;stroke:none}.bottom-nav button[data-go="today"]{grid-column:1}.bottom-nav button[data-go="food"]{grid-column:2}.bottom-nav button[data-go="cookbook"]{grid-column:4}.bottom-nav button[data-go="progress"]{grid-column:5}
.modal-backdrop{position:fixed;inset:0;background:rgba(8,9,7,.62);backdrop-filter:blur(4px);opacity:0;pointer-events:none;transition:.25s;z-index:50}.modal-backdrop.open{opacity:1;pointer-events:auto}.bottom-sheet{position:fixed;z-index:60;left:50%;bottom:0;width:min(430px,100%);transform:translate(-50%,105%);background:var(--paper);border-radius:27px 27px 0 0;padding:12px 18px 25px;transition:transform .32s cubic-bezier(.2,.8,.2,1);box-shadow:0 -20px 70px rgba(0,0,0,.2)}.bottom-sheet:focus{outline:0}.bottom-sheet.open{transform:translate(-50%,0)}.sheet-handle{width:42px;height:4px;background:#c9c5bc;border-radius:10px;margin:0 auto 16px}.sheet-title{display:flex;align-items:center;justify-content:space-between}.sheet-title h2{font:800 21px "Manrope";margin:3px 0 0}.action-list{display:grid;gap:8px;margin-top:18px}.action-list>button,.reminder-item{display:flex;align-items:center;gap:11px;background:var(--card);border:1px solid var(--line);border-radius:16px;padding:11px;text-align:left}.action-list>button>span:nth-child(2),.reminder-item>div{flex:1}.action-list strong,.reminder-item strong{display:block;font:700 11px "Manrope"}.action-list small,.reminder-item small{display:block;font-size:8px;color:var(--muted);margin-top:2px}.action-list>button>.icon{width:15px}.secondary{background:transparent;border:1px solid var(--line);border-radius:14px;padding:13px;font-weight:700}
.scanner-sheet{height:100%;max-height:900px;border-radius:36px 36px 0 0;background:#0b0c0a;padding:0;color:#fff;overflow:hidden}.scanner-view{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;background:radial-gradient(circle at center,#383b34 0,#11130f 55%,#080907 100%);padding:24px}.scanner-top{position:absolute;top:24px;left:20px;right:20px;display:flex;align-items:center;justify-content:space-between;font-weight:700}.circle-button{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.12);color:#fff}.scan-frame{width:270px;height:190px;position:relative;display:grid;place-items:center}.scan-frame>i{position:absolute;width:32px;height:32px}.scan-frame>i:nth-child(1){left:0;top:0;border-left:3px solid var(--lime);border-top:3px solid var(--lime);border-radius:9px 0 0}.scan-frame>i:nth-child(2){right:0;top:0;border-right:3px solid var(--lime);border-top:3px solid var(--lime);border-radius:0 9px 0 0}.scan-frame>i:nth-child(3){left:0;bottom:0;border-left:3px solid var(--lime);border-bottom:3px solid var(--lime);border-radius:0 0 0 9px}.scan-frame>i:nth-child(4){right:0;bottom:0;border-right:3px solid var(--lime);border-bottom:3px solid var(--lime);border-radius:0 0 9px}.scan-line{position:absolute;left:12px;right:12px;height:2px;background:var(--lime);box-shadow:0 0 12px var(--lime);animation:scannerLine 2s infinite alternate ease-in-out}@keyframes scannerLine{from{top:15px}to{top:173px}}.fake-barcode{font:26px monospace;letter-spacing:-4px;padding:15px;background:#f5f3ee;color:#111;transform:rotate(-3deg)}.scanner-view>p{font-size:11px;color:#a4a69f;margin:22px 0}.light-button{background:#fff}
.verified-row{display:flex;align-items:center;gap:7px;color:#4a7d4c;font-size:10px;font-weight:700}.verified-check{width:20px;height:20px;border-radius:50%;display:grid;place-items:center;background:#d9efcf}.verified-check .icon{width:12px}.verified-row.manual{color:#8a6d2f}.verified-row.manual .verified-check{background:#f3e6c8}.bottom-sheet>h2{font:800 22px "Manrope";margin:10px 0 3px}.muted{font-size:10px;color:var(--muted);margin:0}.serving-select{display:flex;justify-content:space-between;align-items:center;margin-top:18px;padding:12px;background:var(--card);border-radius:14px;font-size:10px}.serving-select button{background:none;font-weight:700;display:flex;align-items:center;gap:4px}.serving-select .icon{width:13px}.result-macros{display:grid;grid-template-columns:repeat(4,1fr);margin-top:12px;background:var(--dark);color:#fff;border-radius:16px;padding:14px}.result-macros div{text-align:center;border-right:1px solid #35382f}.result-macros div:last-child{border:0}.result-macros strong,.result-macros span{display:block}.result-macros strong{font:800 14px "Manrope"}.result-macros span{font-size:7px;color:#8f938a}
.reminder-item{margin-top:9px}.switch{position:relative}.switch input{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}.switch i{display:block;width:39px;height:23px;border-radius:99px;background:#ccc8be;position:relative;transition:.2s}.switch i:after{content:"";position:absolute;width:17px;height:17px;left:3px;top:3px;border-radius:50%;background:#fff;transition:.2s}.switch input:checked+i{background:var(--dark)}.switch input:checked+i:after{left:19px;background:var(--lime)}
.settings-sheet{max-height:min(760px,88vh);overflow-y:auto}.settings-profile{display:flex;align-items:center;gap:11px;margin:17px 0;background:var(--dark);color:#fff;border-radius:17px;padding:12px}.settings-avatar{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:#FFDF00;color:#111;font:800 12px "Manrope"}.settings-profile>div{flex:1}.settings-profile strong,.settings-profile small{display:block}.settings-profile strong{font:800 12px "Manrope"}.settings-profile small{font-size:8px;color:#a9aca4;margin-top:2px}.settings-profile button{background:none;color:#FFDF00;font-size:8px;font-weight:700}.settings-list{display:grid;gap:8px}.settings-list>button{display:flex;align-items:center;gap:11px;background:var(--card);border:1px solid var(--line);border-radius:16px;padding:10px;text-align:left}.settings-list>button>span:nth-child(2){flex:1}.settings-list strong,.settings-list small{display:block}.settings-list strong{font:700 11px "Manrope"}.settings-list small{font-size:8px;color:var(--muted);margin-top:2px}.settings-list>button>.icon{width:15px}
.account-sheet{max-height:min(760px,88vh);overflow-y:auto}.account-hero{display:flex;align-items:center;gap:12px;margin-top:16px;background:var(--dark);color:#fff;padding:15px;border-radius:19px}.account-avatar{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;background:#FFDF00;color:#111;font:800 14px "Manrope"}.account-hero>div{flex:1}.account-hero h3{font:800 14px "Manrope";margin:0}.account-hero p{font-size:8px;color:#a9aca4;margin:3px 0 0}.account-hero>button{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:rgba(255,255,255,.1);color:#FFDF00}.account-hero>button .icon{width:16px}.account-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:10px 0 18px}.account-stats>div{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:11px;text-align:center}.account-stats strong,.account-stats span{display:block}.account-stats strong{font:800 14px "Manrope"}.account-stats span{font-size:7px;color:var(--muted);margin-top:2px}.account-section-label{font:800 9px "Manrope";letter-spacing:1.4px;color:var(--muted);margin:0 0 8px}
.interactive-card{cursor:pointer;transition:transform .18s,border-color .18s}.interactive-card:active{transform:scale(.985)}.interactive-card:focus-visible{outline:2px solid #FFDF00;outline-offset:3px}.goals-sheet{max-height:min(720px,90vh);overflow-y:auto}.goals-intro{font-size:10px;line-height:1.45;color:var(--muted);margin:13px 0 16px}.goal-field{background:var(--card);border:1px solid var(--line);border-radius:15px;padding:11px}.goal-field label{display:block;font:700 9px "Manrope";color:var(--muted);margin-bottom:6px}.goal-field>div{display:flex;align-items:baseline}.goal-field input{width:100%;min-width:0;border:0;outline:0;background:transparent;font:800 20px "Manrope";color:var(--ink)}.goal-field span{font-size:9px;color:var(--muted)}.featured-goal{border-left:4px solid #FFDF00}.goal-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:9px 0 15px}.protein-goal{border-top:3px solid #FFDF00}.carbs-goal{border-top:3px solid #fff}.fats-goal{border-top:3px solid #8b6b28}.goal-option{display:flex;align-items:center;gap:12px;padding:12px 2px;border-bottom:1px solid var(--line)}.goal-option>div{flex:1}.goal-option strong,.goal-option small{display:block}.goal-option strong{font:700 10px "Manrope"}.goal-option small{font-size:8px;color:var(--muted);margin-top:2px}.goal-option select{max-width:120px;border:1px solid var(--line);border-radius:10px;background:var(--card);padding:8px;font-size:9px;font-weight:700;outline:0}
.food-item-form{display:grid;gap:10px;margin-top:4px}.food-item-form .goal-grid{margin:0}
.macro-math{background:#171913;color:#fff;border:1px solid #34372f;border-radius:17px;padding:13px;margin-bottom:10px}.macro-math-head,.macro-total{display:flex;justify-content:space-between;align-items:center}.macro-math-head>span{font:800 8px "Manrope";letter-spacing:1.1px;color:#9da097}.macro-math-head>strong{font:800 8px "Manrope";color:#111;background:#FFDF00;border-radius:99px;padding:5px 7px}.macro-equation{display:flex;align-items:center;justify-content:space-between;margin:14px 0 12px}.macro-equation>span{text-align:center}.macro-equation b,.macro-equation small{display:block}.macro-equation b{font:800 15px "Manrope"}.macro-equation small{font-size:7px;color:#8f938a;margin-top:2px}.macro-equation i{font-style:normal;color:#62665e}.macro-total span{font-size:8px;color:#9da097}.macro-total strong{font:700 9px "Manrope"}.macro-allocation-track{height:6px;border-radius:10px;background:#35382f;overflow:hidden;margin:9px 0}.macro-allocation-track span{display:block;height:100%;border-radius:10px;background:#FFDF00;transition:width .2s}.macro-math>p{font-size:8px;color:#c7cac2;margin:0}.macro-math.invalid .macro-math-head>strong{background:#ffbd6d}.macro-math.over .macro-math-head>strong{background:#ff806d}.macro-math.invalid .macro-allocation-track span{background:#ffbd6d}.macro-math.over .macro-allocation-track span{background:#ff806d}.balance-button{width:100%;margin-top:11px;padding:10px;border-radius:11px;background:rgba(255,223,0,.1);border:1px solid rgba(255,223,0,.3);color:#FFDF00;font:700 9px "Manrope";display:flex;align-items:center;justify-content:center;gap:6px}.balance-button .icon{width:14px}.calorie-note{font-size:7px;line-height:1.45;color:var(--muted);margin:10px 2px 0}.primary:disabled{opacity:.42;cursor:not-allowed;filter:grayscale(.4)}
.units-sheet{max-height:min(780px,92vh);overflow-y:auto}.units-list{display:grid;gap:7px}.unit-row{display:flex;align-items:center;justify-content:space-between;gap:10px;background:var(--card);border:1px solid var(--line);border-radius:15px;padding:10px}.unit-row>div{display:flex;align-items:center;gap:9px;min-width:0}.unit-icon{width:32px;height:32px;flex:0 0 32px;border-radius:10px;display:grid;place-items:center;background:#FFDF00;color:#111}.unit-icon .icon{width:16px}.unit-row strong,.unit-row small{display:block}.unit-row strong{font:700 10px "Manrope"}.unit-row small{font-size:7px;color:var(--muted);margin-top:2px}.unit-row select{max-width:127px;border:1px solid var(--line);border-radius:9px;background:#f4f1e9;padding:7px 5px;font-size:8px;font-weight:700;outline:0}
.food-mode-switch{display:grid;grid-template-columns:1fr 1fr;gap:4px;background:rgba(6,7,5,.7);border:1px solid rgba(255,255,255,.12);border-radius:15px;padding:4px;margin:4px 0 14px;backdrop-filter:blur(12px)}.food-mode-switch button{height:36px;border-radius:11px;background:transparent;color:rgba(255,255,255,.58);font:700 10px "Manrope";display:flex;align-items:center;justify-content:center;gap:6px}.food-mode-switch button .icon{width:15px}.food-mode-switch button.active{background:#FFDF00;color:#111}.meal-builder-panel[hidden],#discoverPanel[hidden]{display:none}.builder-summary{background:rgba(6,7,5,.82);border:1px solid rgba(255,223,0,.3);border-radius:21px;padding:16px;backdrop-filter:blur(14px);text-shadow:none}.builder-summary-head{display:flex;align-items:flex-start;justify-content:space-between}.builder-summary h2{font:800 16px "Manrope";color:#fff;margin:3px 0}.builder-summary-head>span{font:800 8px "Manrope";background:#FFDF00;color:#111;padding:6px 8px;border-radius:99px}.builder-energy{height:6px;background:rgba(255,255,255,.13);border-radius:10px;overflow:hidden;margin:14px 0}.builder-energy span{display:block;height:100%;background:#FFDF00;border-radius:10px;transition:width .25s}.builder-totals{display:grid;grid-template-columns:repeat(4,1fr);gap:5px}.builder-totals>div{padding-left:8px;border-left:2px solid rgba(255,223,0,.45)}.builder-totals strong,.builder-totals span{display:block}.builder-totals strong{font:800 11px "Manrope";color:#fff}.builder-totals span{font-size:6.5px;color:rgba(255,255,255,.52);margin-top:2px}.builder-meals{display:grid;gap:10px;margin-top:12px}.builder-meal{background:rgba(6,7,5,.7);border:1px solid rgba(255,255,255,.12);border-radius:19px;padding:13px;backdrop-filter:blur(12px);text-shadow:none}.builder-meal-head,.builder-meal-head>div{display:flex;align-items:center}.builder-meal-head{justify-content:space-between}.builder-meal-head>div{gap:9px}.meal-symbol{width:31px;height:31px;border-radius:10px;background:#FFDF00;color:#111;display:grid;place-items:center;font-size:14px}.builder-meal-head strong,.builder-meal-head small{display:block}.builder-meal-head strong{font:800 11px "Manrope";color:#fff}.builder-meal-head small{font-size:7px;color:rgba(255,255,255,.48);margin-top:2px}.meal-macro-total{font-size:12px!important;color:#FFDF00!important}
.meal-macro-breakdown{display:flex;gap:16px;margin-top:10px}.meal-macro-breakdown[hidden]{display:none}.meal-macro-breakdown strong{font:800 16px "Manrope";display:block;color:#fff}.meal-macro-breakdown small{font-size:8px;color:rgba(255,255,255,.5);display:block;margin-top:1px}.meal-macro-breakdown span:nth-child(1) strong{color:var(--protein)}.meal-macro-breakdown span:nth-child(2) strong{color:var(--carbs)}.meal-macro-breakdown span:nth-child(3) strong{color:var(--fats)}.builder-recipes{display:grid;gap:6px;margin-top:10px}.builder-recipe{display:flex;align-items:center;gap:9px;padding:8px;background:rgba(255,255,255,.07);border-radius:12px}.builder-recipe-info{display:flex;align-items:center;gap:9px;flex:1;min-width:0;background:none;border:0;padding:0;margin:0;font:inherit;text-align:left;cursor:pointer}.builder-recipe img,.builder-recipe-art{width:36px;height:36px;flex:0 0 36px;border-radius:9px;object-fit:cover}.builder-recipe-art{display:grid;place-items:center;background:rgba(255,223,0,.16);font-size:18px}.builder-recipe-text{flex:1;min-width:0}.builder-recipe strong,.builder-recipe small{display:block}.builder-recipe strong{font:700 13px "Manrope";color:#fff}.builder-recipe small{font-size:10px;color:rgba(255,255,255,.52);margin-top:2px}.builder-recipe.logged small{font-size:12px}.builder-recipe>button[data-remove-recipe],.builder-recipe>button[data-remove-food-index]{width:26px;height:26px;border-radius:8px;background:rgba(255,255,255,.08);color:#b9bbb5;display:grid;place-items:center}.builder-recipe>button .icon{width:12px}.add-recipe-meal{width:100%;height:34px;margin-top:9px;border:1px dashed rgba(255,223,0,.42);border-radius:11px;background:rgba(255,223,0,.06);color:#FFDF00;font:700 9px "Manrope";display:flex;align-items:center;justify-content:center;gap:5px}.add-recipe-meal .icon{width:14px}.logged-food-note{display:flex;gap:9px;margin-top:10px;padding:11px;border-radius:14px;background:rgba(6,7,5,.58);border:1px solid rgba(255,255,255,.1);backdrop-filter:blur(10px)}.logged-food-note>.icon{flex:0 0 17px;color:#FFDF00}.logged-food-note p{font-size:7.5px;line-height:1.45;color:rgba(255,255,255,.58);margin:0}.logged-food-note strong{color:#fff}.recipe-picker-sheet{max-height:min(650px,86vh);overflow-y:auto}.picker-recipes{display:grid;gap:8px}.picker-recipes>button{display:flex;align-items:center;gap:10px;padding:9px;background:var(--card);border:1px solid var(--line);border-radius:15px;text-align:left}.picker-recipes>button>img,.picker-art{width:45px;height:45px;flex:0 0 45px;border-radius:11px;object-fit:cover}.picker-art{display:grid;place-items:center;font-size:22px}.picker-art.toast{background:#ffe9b3}.picker-art.burger{background:#e8b98a}.picker-art.jello{background:#ffc2d1}.picker-art.nicecream{background:#ffe3ee}.picker-art.eggcup{background:#ffd9a0}.picker-recipes>button>span:nth-child(2){flex:1}.picker-recipes strong,.picker-recipes small{display:block}.picker-recipes strong{font:700 14px "Manrope"}.picker-recipes small{font-size:11px;color:var(--muted);margin-top:3px}.recipe-fit{font:800 9px "Manrope";color:#111;background:#FFDF00;padding:5px 6px;border-radius:99px}.picker-section-heading{font:800 10px "Manrope";letter-spacing:1px;text-transform:uppercase;color:var(--muted);margin-top:6px}.picker-section-heading:first-child{margin-top:0}
.toast{position:fixed;z-index:100;left:50%;bottom:28px;transform:translate(-50%,30px);background:var(--dark);color:#fff;padding:11px 16px;border-radius:99px;display:flex;align-items:center;gap:8px;font-size:10px;font-weight:700;opacity:0;pointer-events:none;transition:.3s}.toast .icon{width:16px;color:var(--lime)}.toast.show{opacity:1;transform:translate(-50%,0)}
.cal-block{margin:2px 0 16px}.cal-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:9px}.cal-head strong{font:800 12px "Manrope";letter-spacing:.2px;color:#fff}.cal-today-btn{font:800 8px "Manrope";letter-spacing:.6px;color:var(--lime);background:rgba(255,223,0,.12);border:1px solid rgba(255,223,0,.3);border-radius:99px;padding:5px 9px}.cal-strip{display:grid;grid-template-columns:repeat(9,1fr);gap:3px}.cal-cell{border-radius:13px;padding:7px 2px 8px;display:flex;flex-direction:column;align-items:center;gap:5px;background:none;transition:background .15s}.cal-cell span{font-size:8px;color:#93968d;text-shadow:none}.cal-cell strong{font:700 12px "Manrope";color:#fff}.cal-cell .cal-dot{width:4px;height:4px;border-radius:50%;background:transparent}.cal-cell .cal-dot.logged{background:var(--lime)}.cal-cell .cal-dot.planned{background:var(--blue)}.cal-cell .cal-dot.missed{border:1px solid rgba(255,255,255,.32)}.cal-cell.selected{background:var(--dark)}.cal-cell.selected span{color:#a7a9a1}.cal-legend{display:flex;gap:12px;margin-top:9px;flex-wrap:wrap}.cal-legend span{display:inline-flex;align-items:center;gap:5px;font-size:8px;color:rgba(255,255,255,.55);text-shadow:none}.cal-legend .cal-dot{width:6px;height:6px}.cal-legend .cal-dot.logged{background:var(--lime)}.cal-legend .cal-dot.planned{background:var(--blue)}.cal-legend .cal-dot.missed{border:1px solid rgba(255,255,255,.4)}
.builder-summary.future{border-color:rgba(184,223,255,.4)}.builder-summary.future .builder-totals>div{border-left-color:rgba(184,223,255,.5)}.builder-summary.future .builder-energy span{background:var(--blue)}.builder-summary-head>span.blue{background:var(--blue);color:#0e2233}.builder-summary-head>span.muted{background:rgba(255,255,255,.16);color:rgba(255,255,255,.7)}.builder-meal.future .meal-symbol{background:var(--blue)}.builder-meal.future .meal-macro-total{color:var(--blue)!important}.builder-meal.future .add-recipe-meal{border-color:rgba(184,223,255,.4);color:var(--blue);background:rgba(184,223,255,.08)}.logged-food-note.future{border-color:rgba(184,223,255,.3)}.logged-food-note.future>.icon{color:var(--blue)}

/* Keep pale content cards readable while the app canvas stays fully transparent. */
.screen .recipe-card,.screen .quick-actions button,
.screen .search-box,.screen .day-summary,.screen .planned-meal,
.screen .metric-pair article,.screen .chart-card,
.screen .prep-banner,.screen .empty-meal,.screen .focus-control{
  color:var(--ink);text-shadow:none;
}
.screen .text-button{color:#FFDF00;text-shadow:0 2px 8px rgba(0,0,0,.55)}
.screen .filter-chip{color:#d8dad3;background:rgba(15,16,13,.72);border:1px solid rgba(255,255,255,.12);backdrop-filter:blur(10px)}
.screen .filter-chip.active{color:#111;background:#FFDF00;border-color:#FFDF00}
.screen .match-badge,.screen .status-good,.screen .status-bad{text-shadow:none}
.screen .page-title .icon-button.dark{background:rgba(10,11,9,.7);color:#fff;border:1px solid rgba(255,255,255,.14);backdrop-filter:blur(10px)}

/* Black + gold wallpaper layout */
.phone{background-position:center top}
.screen{padding-left:20px;padding-right:20px}
.screen:before{background:linear-gradient(180deg,rgba(3,4,3,.02) 0,rgba(3,4,3,.08) 18%,rgba(3,4,3,.44) 58%,rgba(3,4,3,.7) 100%)}
.greeting-row,.page-title{min-height:112px;align-items:flex-end;padding-bottom:14px}
.greeting-row h1,.page-title h1{font-size:30px;max-width:310px;text-shadow:0 3px 18px rgba(0,0,0,.9)}
.page-title{margin-bottom:8px}
.streak{background:rgba(8,9,7,.62);color:#FFDF00;border:1px solid rgba(255,194,28,.4);backdrop-filter:blur(12px)}
.streak strong{color:#fff}

.macro-card{margin-top:8px;background:rgba(8,9,7,.72);border:1px solid rgba(255,194,28,.24);backdrop-filter:blur(16px);box-shadow:0 18px 50px rgba(0,0,0,.22);padding:20px}
.macro-card:after{background:rgba(255,194,28,.08)}
.energy-track{background:rgba(255,255,255,.12)}
.energy-track span{background:linear-gradient(90deg,#FFDF00,#FFDF00)}
.macro-grid{padding-top:2px}
.macro-dot.carbs{background:#fff}.macro-dot.fats{background:#ae8331}
.quote-card{background:rgba(8,9,7,.52);border-color:rgba(255,255,255,.12);padding:11px 14px}
.quote-mark{font-size:26px}
.section-heading{margin-top:22px}
.section-heading .eyebrow{color:#FFDF00}

.next-card{height:245px;border:1px solid rgba(255,255,255,.14);box-shadow:0 18px 45px rgba(0,0,0,.3)}
.next-card-content{inset:auto 16px 16px}.next-card h3{font-size:19px}

.search-box{background:rgba(8,9,7,.72)!important;color:#fff!important;border-color:rgba(255,255,255,.15);backdrop-filter:blur(14px)}
.search-box input{color:#fff}.search-box input::placeholder{color:rgba(255,255,255,.5)}
.search-box .icon{color:#FFDF00}
.quick-actions{gap:9px;margin-top:10px}
.quick-actions button{background:rgba(8,9,7,.66)!important;color:#fff!important;border-color:rgba(255,255,255,.12);backdrop-filter:blur(12px);align-items:center;text-align:center}
.quick-actions small{color:rgba(255,255,255,.5)}
.quick-icon{background:#FFDF00!important;color:#111}
.focus-row{margin-top:4px}

.recipe-card{background:rgba(8,9,7,.76)!important;color:#fff!important;border:1px solid rgba(255,255,255,.11);backdrop-filter:blur(14px);box-shadow:0 12px 32px rgba(0,0,0,.22)}
.recipe-body p,.recipe-body>div{color:rgba(255,255,255,.57)}
.add-plan{background:#FFDF00;color:#111}
.save-button.saved{background:#FFDF00}
.image-tag{background:rgba(0,0,0,.72);color:#FFDF00}

.week-score,.consistency-card{background:rgba(8,9,7,.76);border:1px solid rgba(255,194,28,.24);backdrop-filter:blur(16px)}
.focus-control,.day-summary,.planned-meal,.empty-meal,.prep-banner{
  background:rgba(8,9,7,.7)!important;color:#fff!important;border-color:rgba(255,255,255,.12)!important;backdrop-filter:blur(13px);
}
.focus-control>span,.day-summary strong,.planned-meal h3,.empty-meal strong,.prep-banner strong{color:#fff}
.day-summary>div span,.planned-meal p,.empty-meal small,.prep-banner small{color:rgba(255,255,255,.55)}
.segmented{background:rgba(255,255,255,.1)}
.segmented button{color:rgba(255,255,255,.62)}
.segmented button.active{background:#FFDF00;color:#111}
.date-strip button{color:#fff}.date-strip span{color:rgba(255,255,255,.55)}
.date-strip button.selected{background:#FFDF00;color:#111}.date-strip button.selected span{color:#5b4500}.date-strip button.selected i{background:#111}
.timeline-line:after{background:rgba(255,255,255,.2)}.timeline-line i{background:#111;border-color:#FFDF00}
.prep-icon{background:#FFDF00;color:#111}


.metric-pair article,.chart-card{background:rgba(8,9,7,.72)!important;color:#fff!important;border:1px solid rgba(255,255,255,.11);backdrop-filter:blur(14px)}
.metric-pair p,.metric-pair small{color:rgba(255,255,255,.56)}
.bar-chart i{background:rgba(255,255,255,.18)}.bar-chart i.today-bar{background:#FFDF00;border-color:#FFDF00}
.bar-chart span,.goal-line{color:rgba(255,255,255,.55)}
.insight-card{background:rgba(255,194,28,.86);color:#111;text-shadow:none}
.insight-card>.icon{color:#111}.insight-card div p:last-child{color:#423200}
.score-ring{background:conic-gradient(#FFDF00 87%,rgba(255,255,255,.12) 0)}

.primary{background:#FFDF00}.match-badge,.status-good{background:#FFDF00;color:#111}
.status-bad{background:rgba(255,194,28,.16);color:#FFDF00;border:1px solid rgba(255,194,28,.25)}

/* Give the wallpaper a real stage before the interface begins. */
.screen{padding-top:318px;background:transparent!important}
.screen:before{display:none}
.greeting-row,.page-title{min-height:0;padding:16px 16px 14px;margin:0 -4px 10px;background:rgba(5,6,5,.44);border:1px solid rgba(255,255,255,.12);border-radius:20px;backdrop-filter:blur(10px)}
.macro-card,.quote-card,.recipe-card,.quick-actions button,.search-box,
.week-score,.focus-control,.day-summary,.planned-meal,.empty-meal,.prep-banner,
.consistency-card,.metric-pair article,.chart-card{
  background-color:rgba(7,8,6,.48)!important;
  backdrop-filter:blur(10px);
}
.phone:after{content:"";position:absolute;z-index:-1;left:0;right:0;top:68px;height:250px;background:linear-gradient(180deg,rgba(0,0,0,.08),transparent 55%,rgba(0,0,0,.12));pointer-events:none}
.topbar,.bottom-nav{z-index:30}

@media(max-width:480px){.app-shell{padding:0}.phone{height:100vh;border-radius:0}.scanner-sheet{max-height:none;border-radius:0}.topbar{padding-top:max(15px,env(safe-area-inset-top))}.screen{padding-top:max(300px,calc(env(safe-area-inset-top) + 286px))}.bottom-nav{padding-bottom:max(12px,env(safe-area-inset-bottom));height:calc(82px + env(safe-area-inset-bottom))}}

/* --- meal log toggles (justin-jarvis/upgrades) --- */
.meal-head-right{display:flex;align-items:center;gap:8px}
.meal-log-toggle{padding:6px 12px;border-radius:99px;background:rgba(255,255,255,.1);border:1px solid rgba(255,223,0,.35);color:#fff;font:700 10px/1 "Manrope";letter-spacing:.6px;cursor:pointer}
.meal-log-toggle.on{background:#FFDF00;color:#111;border-color:#FFDF00}

/* --- live camera region (scanner) --- */
#cameraRegion{width:290px;max-width:86%;border-radius:18px;overflow:hidden;margin:0 auto}
#cameraRegion video{width:100%;display:block}

/* --- grocery list sheet --- */
.grocery-sheet{max-height:min(720px,88vh);overflow-y:auto}
.grocery-days{display:flex;gap:6px;flex-wrap:wrap;margin:4px 0 14px}
.grocery-days button{padding:8px 12px;border-radius:99px;background:rgba(17,19,15,.06);font:700 11px/1 "Manrope";color:var(--ink)}
.grocery-days button.selected{background:#FFDF00;color:#111}
.grocery-aisle{font:800 10px/1.2 "Manrope";letter-spacing:1.5px;color:#7a7d75;margin:16px 0 8px}
.grocery-item{display:flex;align-items:center;gap:12px;background:var(--card);border:1px solid var(--line);border-radius:16px;padding:11px 13px;margin-bottom:8px;cursor:pointer}
.grocery-item input{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}.grocery-item:focus-within{outline:2px solid #FFDF00;outline-offset:2px}
.grocery-item i{flex:none;width:20px;height:20px;border-radius:7px;border:2px solid #c9c5ba;position:relative;transition:all .15s}
.grocery-item input:checked+i{background:#FFDF00;border-color:#FFDF00}
.grocery-item input:checked+i:after{content:"";position:absolute;left:5px;top:1px;width:5px;height:10px;border:solid #111;border-width:0 2.5px 2.5px 0;transform:rotate(42deg)}
.grocery-item strong{display:block;font:700 13px "DM Sans";color:var(--ink)}
.grocery-item small{color:var(--muted);font-size:11px}
.grocery-item input:checked~span strong{text-decoration:line-through;color:var(--muted)}
.grocery-empty{background:var(--card);border:1px dashed var(--line);border-radius:16px;padding:18px;color:var(--muted);font-size:13px;text-align:center}
.ingredient-row{display:flex;align-items:center;justify-content:space-between;gap:10px;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:10px 13px;margin-bottom:7px}.ingredient-row strong{font:700 12px "DM Sans";color:var(--ink)}.ingredient-row span{color:var(--muted);font-size:10px;white-space:nowrap;flex:none}

/* --- TDEE onboarding (issue #36) --- */
.tdee-sheet{max-height:min(720px,90vh);overflow-y:auto}
.tdee-entry{width:100%;display:flex;align-items:center;gap:11px;background:var(--card);border:1px solid var(--line);border-radius:16px;padding:11px;text-align:left;margin-bottom:13px}
.tdee-entry>span:nth-child(2){flex:1}
.tdee-entry strong{display:block;font:700 11px "Manrope"}
.tdee-entry small{display:block;font-size:8px;color:var(--muted);margin-top:2px}
.tdee-entry>.icon{width:15px}
.tdee-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:9px 0}
.tdee-result{margin-top:14px}
.tdee-note{font-size:10px;line-height:1.5;color:var(--muted);margin:10px 2px}

/* --- allergy warnings (issue #8) --- */
.allergy-sheet{max-height:min(680px,88vh);overflow-y:auto}
.allergy-add{display:flex;gap:8px;margin:2px 0 14px}
.allergy-add input{flex:1;min-width:0;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:12px 13px;outline:0;font-size:13px;color:var(--ink)}
.allergy-add input:focus{border-color:#FFDF00}
.allergy-add .primary{margin:0;padding:12px 18px}
.allergy-chips{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:16px}
.allergy-chip{display:inline-flex;align-items:center;gap:8px;background:var(--dark);color:#fff;border-radius:99px;padding:8px 8px 8px 14px;font:700 11px "Manrope"}
.allergy-chip button{width:20px;height:20px;border-radius:50%;background:rgba(255,255,255,.16);color:#fff;display:grid;place-items:center;flex:none}
.allergy-chip button .icon{width:11px;height:11px}
.allergy-empty{background:var(--card);border:1px dashed var(--line);border-radius:16px;padding:16px;color:var(--muted);font-size:12px;text-align:center;width:100%;margin:0}
.allergy-suggestions{display:flex;flex-wrap:wrap;gap:7px}
.allergy-suggest{padding:9px 12px;border-radius:99px;background:rgba(17,19,15,.06);border:1px dashed #c9c5ba;font:700 10px "Manrope";color:var(--ink)}
.result-allergens{margin-top:12px;border-radius:16px;padding:12px 14px;background:var(--card);border:1px solid var(--line)}
.result-allergens strong{display:flex;align-items:center;gap:8px;font:800 12px "Manrope";color:var(--ink)}
.result-allergens strong .icon{width:16px;flex:none}
.result-allergens p{margin:6px 0 0;font-size:10px;line-height:1.5;color:var(--muted)}
.result-allergens.contains{background:#2d100b;border-color:#8a3b2b}
.result-allergens.contains strong{color:#ff9c8a}
.result-allergens.contains p{color:#d8a99f}
.result-allergens.may-contain{background:#2c230a;border-color:#8a6f2b}
.result-allergens.may-contain strong{color:#ffd66b}
.result-allergens.may-contain p{color:#cdb98a}

/* --- live activity card + devices sheet --- */
.activity-card{margin-top:12px;background:rgba(8,9,7,.72);border:1px solid rgba(255,223,0,.24);backdrop-filter:blur(16px);border-radius:22px;padding:14px 18px;cursor:pointer;width:100%;text-align:left;display:block}
.activity-head{display:flex;align-items:center;gap:8px}
.live-dot{width:7px;height:7px;border-radius:50%;background:#39d353;box-shadow:0 0 8px #39d353;animation:livePulse 1.6s ease-in-out infinite;flex:none}
@keyframes livePulse{0%,100%{opacity:1}50%{opacity:.35}}
.activity-stats{display:flex;gap:26px;margin-top:9px}
.activity-stats strong{font:800 20px/1 "Manrope";color:#fff;letter-spacing:-.5px}
.activity-stats span{display:block;font-size:10px;color:rgba(255,255,255,.55);margin-top:3px}
.activity-stats div:first-child strong{color:#FFDF00}
.active-bonus{margin:8px 0 0;font-size:11px;color:#FFDF00}
.devices-sheet{max-height:min(760px,90vh);overflow-y:auto}
.device-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin:15px 0 10px}
.device-summary>div{background:var(--dark);color:#fff;border-radius:15px;padding:11px 9px}
.device-summary span,.device-feed span{display:block;font-size:7px;color:#8f938a;margin-bottom:4px}
.device-summary strong{display:block;font:800 12px "Manrope";color:#FFDF00}
.device-feed{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin-bottom:12px}
.device-feed>div{background:#ebe7dd;border:1px solid var(--line);border-radius:14px;padding:10px 8px}
.device-feed .icon{width:15px;height:15px;color:#171916;margin-bottom:7px}
.device-feed strong{display:block;font:800 10px "Manrope";color:var(--ink)}
.device-connect{background:#171916;color:#fff;border-radius:99px;padding:8px 14px;font:700 11px "Manrope";flex:none}
.device-connect:disabled{opacity:.58;cursor:default}
.device-note{font-size:11px;color:var(--muted);margin-top:12px;line-height:1.5}
.meal-section{margin:22px 0 4px}.meal-section h2{font:800 15px "Manrope";letter-spacing:-.2px;margin:0 0 12px;color:#fff}.meal-section .count{font:700 10px "Manrope";color:rgba(255,255,255,.45);margin-left:6px}
.recipe-spread{background:var(--card);border-radius:22px;overflow:hidden;margin-bottom:16px;box-shadow:0 14px 34px rgba(15,16,12,.35);color:var(--ink);text-shadow:none}
.spread-hero{height:150px;position:relative;display:grid;place-items:center;font-size:56px}
.spread-hero.frenchtoast{background:linear-gradient(140deg,#ffe9b3,#e2a552)}.spread-hero.burger{background:linear-gradient(140deg,#e8b98a,#a8622f)}.spread-hero.jello{background:linear-gradient(140deg,#ffc2d1,#e8607e)}.spread-hero.nicecream{background:linear-gradient(140deg,#ffe3ee,#ff8aa8)}.spread-hero.eggcup{background:linear-gradient(140deg,#ffd9a0,#e08a3c)}
.spread-hero.has-photo{background:#111;font-size:0}.spread-hero.has-photo img{width:100%;height:100%;object-fit:cover}
.spread-tag{position:absolute;left:10px;top:10px;font:800 8px "Manrope";letter-spacing:.6px;background:rgba(17,19,15,.72);color:#FFDF00;padding:6px 8px;border-radius:99px}
.photo-pending{position:absolute;right:10px;bottom:10px;display:flex;align-items:center;gap:5px;background:rgba(17,19,15,.72);color:#fff;font:700 8px "Manrope";letter-spacing:.4px;padding:6px 9px;border-radius:99px;backdrop-filter:blur(6px)}.photo-pending .icon{width:11px}
.spread-body{padding:16px}.spread-body h3{font:800 18px "Manrope";margin:0 0 6px;letter-spacing:-.3px}
.spread-desc{font-size:12px;line-height:1.55;color:var(--muted);margin:0 0 14px}
.spread-stats{display:grid;grid-template-columns:repeat(4,1fr);background:var(--dark);color:#fff;border-radius:14px;padding:12px 4px;margin-bottom:16px}.spread-stats div{text-align:center;border-right:1px solid rgba(255,255,255,.12)}.spread-stats div:last-child{border:0}.spread-stats strong{display:block;font:800 13px "Manrope"}.spread-stats span{display:block;font-size:7px;color:rgba(255,255,255,.5);margin-top:2px;letter-spacing:.3px}
.spread-ingredients h4{font:800 9px "Manrope";letter-spacing:1.2px;color:var(--muted);margin:0 0 9px}.spread-ingredients ul{list-style:none;margin:0;padding:0;display:grid;gap:6px}.spread-ingredients li{display:flex;justify-content:space-between;gap:10px;font-size:11.5px;background:var(--paper);border-radius:10px;padding:8px 11px}.spread-ingredients li b{font-weight:700;color:var(--ink)}.spread-ingredients li span{color:var(--muted);white-space:nowrap;flex:none}
.cookbook-empty{background:rgba(255,255,255,.06);border:1px dashed rgba(255,255,255,.25);border-radius:16px;padding:18px;color:rgba(255,255,255,.6);font-size:12px;text-align:center;margin-top:8px}

/* --- account entry + auth seam (card-039) --- */
.auth-phone{position:relative;width:min(100%,430px);height:min(900px,calc(100vh - 48px));display:flex;flex-direction:column;overflow:hidden;background:#12130f url("assets/flash-fitness-background.webp") center top/cover no-repeat;border-radius:36px;border:1px solid rgba(255,194,43,.28);box-shadow:0 40px 100px rgba(0,0,0,.4);color:#fff}
.auth-phone:before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(5,6,5,.2),rgba(5,6,5,.15) 40%,rgba(5,6,5,.82) 72%,#080907);pointer-events:none}
.auth-phone[hidden],.phone[hidden]{display:none}
.auth-brand{position:relative;z-index:1;display:flex;align-items:center;gap:9px;padding:20px;font:800 12px/1 "Manrope";letter-spacing:1.5px}
.auth-promise{position:relative;z-index:1;flex:1;display:flex;flex-direction:column;justify-content:flex-end;padding:24px 22px 20px;text-shadow:0 3px 14px rgba(0,0,0,.6)}
.auth-promise>p:last-child{margin:7px 0 0;font:800 30px/1.08 "Manrope";letter-spacing:-1.2px}
.auth-panel{position:relative;z-index:1;background:var(--paper);color:var(--ink);border-radius:28px 28px 0 0;padding:22px 20px max(26px,env(safe-area-inset-bottom));box-shadow:0 -20px 60px rgba(0,0,0,.3)}
.auth-panel h1{font:800 24px/1.12 "Manrope";letter-spacing:-.8px;margin:5px 0 0}
.auth-intro{font-size:11px;line-height:1.5;color:var(--muted);margin:8px 0 16px}
.auth-field{background:var(--card);border:1px solid var(--line);border-radius:15px;padding:10px 12px;margin-top:9px;transition:border-color .15s,box-shadow .15s}
.auth-field:focus-within{border-color:#FFDF00;box-shadow:0 0 0 2px rgba(255,223,0,.2)}
.auth-field label{display:block;font:700 9px "Manrope";color:var(--muted);margin-bottom:5px}
.auth-field input{width:100%;border:0;outline:0;background:transparent;color:var(--ink);font:700 13px "DM Sans"}
.auth-field input::placeholder{color:#a09d95;font-weight:500}
.auth-message,.account-auth-error{border-radius:12px;padding:9px 11px;margin:10px 0 0;background:#fee5df;border:1px solid #efb7aa;color:#8a2e20;font-size:10px;line-height:1.4}
.auth-message.info{background:#fff4bd;border-color:#e8d36f;color:#5c4a00}
.auth-actions{margin-top:2px}.auth-actions .primary,.auth-actions .secondary{min-height:44px}
.auth-actions button:focus-visible,.auth-field input:focus-visible,.account-sign-out:focus-visible{outline:2px solid #FFDF00;outline-offset:2px}
.auth-actions button[aria-busy="true"]{cursor:wait}
.account-sign-out{color:#7c251b;border-color:#d6aaa2}.account-auth-error{margin-top:12px}
/* The pre-session screen. It reuses .auth-phone so restoring a session looks like
   one continuous screen rather than a flash of something else, and it is rendered
   by the HTML itself so there is never a blank frame before scripts run. */
.boot-status{position:relative;z-index:1;margin:auto;padding:0 28px;text-align:center;font-size:12px;letter-spacing:.4px;color:var(--muted)}
.boot-status:before{content:"";display:block;width:26px;height:26px;margin:0 auto 14px;border-radius:50%;border:2px solid rgba(255,194,43,.25);border-top-color:#ffc22b;animation:boot-spin .9s linear infinite}
@keyframes boot-spin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.boot-status:before{animation-duration:2.4s}}
@media(max-width:480px){.auth-phone{height:100vh;border-radius:0}.auth-brand{padding-top:max(20px,env(safe-area-inset-top))}}
/* --- Progress screen (screens/progress.js) --- */
/* The shell's flex/grid display rules would otherwise beat the hidden attribute. */
#progress [hidden]{display:none!important}
.consistency-card .progress-empty-headline{font:800 20px/1.2 "Manrope";margin:6px 0 4px}
.week-dots .future{background:none;border:1px dashed rgba(255,255,255,.18);color:rgba(255,255,255,.35)}
.week-dots .done.today-dot{color:var(--dark)}
.metric-pair.single{grid-template-columns:1fr}
/* Bars and the goal line share one scale: the column reserves the label space
   below, so a bar's height% and the line's bottom both measure the same area. */
.bar-chart>div{position:relative;padding-bottom:18px;box-sizing:border-box}
.bar-chart>div>span{position:absolute;bottom:0}
.bar-chart>div>i{flex:none;min-height:2px}
.bar-chart>div.future>i{opacity:.35}
.bar-chart .goal-line{top:auto;bottom:calc(18px + (100% - 20px - 18px) * var(--goal-pct, 0) / 100)}
/* --- Today + Plan screens (card-041): drawn from state by screens/today.js and screens/plan.js --- */
.next-card.plain{background:linear-gradient(160deg,#1c1d19,#0b0c0a)}
.next-card>.food-art{position:absolute;inset:0;font-size:96px}
.next-card .card-actions .primary.compact .icon{width:14px}
.score-ring{background:conic-gradient(var(--lime) var(--score,0%),#34372f 0)}
.week-score.no-ring{gap:0}
.date-strip i.planned{background:rgba(255,223,0,.45)}
.date-strip i.logged{background:#FFDF00}
.date-strip button.selected i.planned{background:rgba(17,17,17,.45)}
.date-strip button.selected i.logged{background:#111}
.timeline-line i.done{background:#FFDF00;border-color:#FFDF00}
.streak[hidden],.score-ring[hidden]{display:none}

/* --- card-044: readability over the background artwork --- */
/* The scrim used to live on .screen:before. .screen is the scroll container, so that
   pseudo-element sized to one viewport and scrolled away with the content: on a 1590px
   screen only the first 842px were ever covered, and everything below scrolled onto raw
   photograph. Moving it onto .phone pins it to the viewport, so every scroll position
   gets the same protection. */
.screen:before{background:none}
.phone:before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(180deg,rgba(3,4,3,.10) 0,rgba(3,4,3,.28) 30%,rgba(3,4,3,.52) 62%,rgba(3,4,3,.72) 100%)}
.screen-stack{position:relative;z-index:2}

/* The calendar block and the date strip were the only content drawn straight onto the
   photograph with no panel of their own, which is why their weekday letters and dots
   washed out over the bright part of the artwork. Same panel the cards already use. */
.screen .cal-block,.screen .date-strip{background:rgba(8,9,7,.72);border:1px solid rgba(255,255,255,.11);
  border-radius:19px;backdrop-filter:blur(14px)}
.screen .cal-block{padding:12px;margin:2px 0 16px}
.screen .date-strip{padding:9px 6px}
.screen .cal-cell span,.screen .cal-legend span{color:rgba(255,255,255,.68)}

/* .activity-card sets display:block, which outranks the [hidden] UA rule, so
   `card.hidden = true` in renderActivityCard never actually hid it. Latent for as
   long as the watch defaulted to connected and the card was always drawn. */
.activity-card[hidden]{display:none}