/* ── STYLE BLOCK 1 ── */

*{box-sizing:border-box;margin:0;padding:0;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation}
/* PERMANENT FIX: All buttons must have touch-action manipulation */
button, a, [onclick] {
  touch-action: manipulation !important;
}

input,textarea,select{-webkit-user-select:text;user-select:text;touch-action:manipulation;caret-color:auto}
@media(min-width:900px){*{touch-action:auto}input,textarea,select{touch-action:manipulation}}
#replit-badge-container,.__replit-badge,[id*="replit"],[class*="replit"]{display:none!important;visibility:hidden!important;opacity:0!important;pointer-events:none!important}
body{background:#0a0a0f;font-family:'Segoe UI',sans-serif;color:#e8e8f0;min-height:100vh;overflow-x:hidden;-webkit-text-size-adjust:100%;text-size-adjust:100%;overscroll-behavior-y:none}
::-webkit-scrollbar{width:5px}
::-webkit-scrollbar-thumb{background:#1e1e2a;border-radius:3px}

/* MEAL TOOLS X GRID - Separated Triangles with 3D effect + SVG borders */
.xt-wrap{padding:0 4px;margin-bottom:4px}
.xt-grid{
  position:relative;
  width:100%;
  padding-bottom:85%;
  background:#0d0d14;
  overflow:visible;
}

/* SVG border layer - sits on top of all triangles */
.xt-borders{
  position:absolute;inset:0;
  width:100%;height:100%;
  pointer-events:none;z-index:5;
  overflow:visible;
}

/* each triangle cell */
.xt-cell{
  position:absolute;
  display:flex;flex-direction:column;
  align-items:center;justify-content:center;
  text-align:center;
  cursor:pointer;z-index:2;
  transition:transform .2s, filter .2s;
  -webkit-tap-highlight-color:transparent;
  filter: drop-shadow(0 4px 8px rgba(0,0,0,0.6));
}
.xt-cell:active{filter:brightness(1.3) drop-shadow(0 6px 12px rgba(0,0,0,0.8));transform:scale(1.03)}

/* TOP triangle - red/pink */
.xt-top{
  top:0;left:3%;right:3%;height:47%;
  clip-path:polygon(0% 0%, 100% 0%, 55% 95%, 50% 100%, 45% 95%);
  padding:8px 28% 18px;
  background:linear-gradient(160deg,#1a0a10 0%,#120008 100%);
}
.xt-top:hover{background:linear-gradient(160deg,#2a0f18 0%,#1a000f 100%);transform:translateY(-2px)}

/* BOTTOM triangle - green */
.xt-bottom{
  bottom:0;left:3%;right:3%;height:47%;
  clip-path:polygon(50% 0%, 55% 5%, 100% 100%, 0% 100%, 45% 5%);
  padding:18px 28% 8px;
  background:linear-gradient(200deg,#001a12 0%,#000d09 100%);
}
.xt-bottom:hover{background:linear-gradient(200deg,#002a1c 0%,#001510 100%);transform:translateY(2px)}

/* LEFT triangle - blue */
.xt-left{
  top:3%;left:0;width:47%;height:94%;
  clip-path:polygon(0% 0%, 95% 45%, 100% 50%, 95% 55%, 0% 100%);
  padding:28% 14px 28% 6px;
  align-items:flex-start;
  text-align:left;
  background:linear-gradient(110deg,#050a1a 0%,#02060f 100%);
}
.xt-left:hover{background:linear-gradient(110deg,#081528 0%,#040c1a 100%);transform:translateX(-2px)}

/* RIGHT triangle - orange/amber */
.xt-right{
  top:3%;right:0;width:47%;height:94%;
  clip-path:polygon(100% 0%, 100% 100%, 5% 55%, 0% 50%, 5% 45%);
  padding:28% 6px 28% 14px;
  align-items:flex-end;
  text-align:right;
  background:linear-gradient(250deg,#1a0f00 0%,#0f0900 100%);
}
.xt-right:hover{background:linear-gradient(250deg,#2a1800 0%,#1a0f00 100%);transform:translateX(2px)}

.xt-badge{font-size:8px;font-weight:800;padding:2px 7px;border-radius:20px;letter-spacing:.8px;margin-bottom:4px;white-space:nowrap}
.xt-icon{font-size:20px;margin-bottom:3px;line-height:1}
.xt-name{font-size:10px;font-weight:800;line-height:1.3;margin-bottom:2px}
.xt-desc{font-size:8.5px;color:#a0a0b8;line-height:1.4}

/* HEALTH NEWS */
.hn-card{border-bottom:1px solid #1e1e2a;padding:12px 0;cursor:pointer;transition:background .2s}
.hn-card:last-child{border-bottom:none}
.hn-card:active{background:rgba(255,255,255,.03)}
.hn-badge{display:inline-block;font-size:9px;font-weight:700;padding:2px 8px;border-radius:20px;margin-bottom:7px;letter-spacing:.5px}
.hn-headline{font-size:13px;font-weight:700;line-height:1.5;color:#e8e8f0;margin-bottom:5px}
.hn-meta{font-size:10px;color:#a0a0b8}
.hn-load-more{width:100%;padding:10px;border-radius:12px;border:1px solid #1e1e2a;background:transparent;color:#a0a0b8;font-size:12px;font-weight:700;cursor:pointer;font-family:inherit;margin-top:10px;transition:all .2s}
.hn-load-more:hover{border-color:#e879f9;color:#e879f9}
.hn-error{text-align:center;padding:20px 0;color:#a0a0b8;font-size:12px;line-height:1.6}
@keyframes spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}
/* WIKI KNOWLEDGE */
.wk-topic-pill{display:inline-flex;align-items:center;gap:4px;padding:5px 12px;border-radius:20px;font-size:11px;font-weight:700;cursor:pointer;border:1px solid transparent;transition:all .2s;white-space:nowrap;flex-shrink:0}
.wk-topic-pill:active{transform:scale(.96)}
.wk-article-body{font-size:13px;line-height:1.9;color:#c8c8d8}
.wk-article-body p{margin-bottom:12px}
.wk-article-body b,.wk-article-body strong{color:#e8e8f0}
.wk-section-title{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:1px;color:#a0a0b8;margin:16px 0 6px}
.wk-read-more{display:inline-flex;align-items:center;gap:6px;margin-top:8px;padding:8px 16px;border-radius:20px;background:rgba(232,121,249,.1);border:1px solid rgba(232,121,249,.3);color:#e879f9;font-size:11px;font-weight:700;cursor:pointer;text-decoration:none}


/* WIZARD */
#wizard{display:none;align-items:center;justify-content:center;min-height:100vh;padding:20px;position:relative;z-index:10}
#auth-screen{display:block}
.wpanel{width:100%;max-width:480px}
.progress{display:flex;gap:6px;margin-bottom:28px;align-items:center}
.pbar{flex:1;height:4px;border-radius:99px;background:#1e1e2a;transition:all .4s cubic-bezier(.4,0,.2,1)}
.pbar.done{background:rgba(0,229,160,.5)}
.pbar.active{background:linear-gradient(90deg,#00e5a0,#00c8ff);box-shadow:0 0 8px rgba(0,229,160,.4)}
.wcard{background:linear-gradient(145deg,#111118,#0e0e16);border:1px solid #1e1e2a;border-radius:24px;padding:32px 24px;box-shadow:0 20px 60px rgba(0,0,0,.5)}
.step-label{font-size:9px;color:#00e5a0;letter-spacing:3px;text-transform:uppercase;margin-bottom:10px;font-weight:700;opacity:0.9;display:flex;align-items:center;gap:6px}
.step-label::before{content:'';display:inline-block;width:6px;height:6px;border-radius:50%;background:#00e5a0;box-shadow:0 0 6px #00e5a0}
.step-title{font-size:26px;font-weight:800;margin-bottom:6px;line-height:1.2}
.step-sub{font-size:13px;color:#a0a0b8;margin-bottom:22px;line-height:1.5}
.choices{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:24px}
.choice{border:2px solid #1e1e2a;border-radius:18px;padding:20px 12px;text-align:center;cursor:pointer;transition:all .22s;background:rgba(255,255,255,.02)}
.choice:active{transform:scale(0.96)}
.choice.sg{border-color:#00e5a0;background:rgba(0,229,160,.07);box-shadow:0 0 20px rgba(0,229,160,.15)}
.choice.so{border-color:#ff9f35;background:rgba(255,159,53,.07);box-shadow:0 0 20px rgba(255,159,53,.15)}
.choice.sr{border-color:#ff4d6d;background:rgba(255,77,109,.07);box-shadow:0 0 20px rgba(255,77,109,.15)}
.choice.sb{border-color:#4a9eff;background:rgba(74,158,255,.07);box-shadow:0 0 20px rgba(74,158,255,.15)}
.choice-icon{font-size:30px;margin-bottom:8px}
.choice-title{font-weight:700;font-size:13px}
.choice-sub{font-size:11px;color:#a0a0b8;margin-top:3px}
.inp-label{font-size:10px;color:#a0a0b8;text-transform:uppercase;letter-spacing:1.5px;margin-bottom:8px;font-weight:600}
input[type=number],input[type=text],select{width:100%;background:rgba(255,255,255,.03);border:2px solid #1e1e2a;border-radius:14px;padding:13px 18px;font-size:22px;font-weight:700;color:#e8e8f0;outline:none;margin-bottom:14px;font-family:inherit;transition:border-color .2s}
input[type=number]:focus,input[type=text]:focus{border-color:rgba(0,229,160,.4)}
input[type=text]{width:70%;}
input[type=text]::placeholder{color:#404058;font-weight:500}
select{font-size:16px;cursor:pointer;appearance:none}
select option{background:#111118;color:#e8e8f0}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.row2 input{font-size:20px}
.btn{width:100%;padding:16px;border-radius:14px;border:none;background:linear-gradient(135deg,#00e5a0,#00c8ff);color:#0a0a0f;font-size:15px;font-weight:800;cursor:pointer;font-family:inherit;margin-top:6px;letter-spacing:.3px;transition:all .2s;box-shadow:0 4px 20px rgba(0,229,160,.2)}
.btn:disabled{background:#111118;color:#00e5a0;cursor:not-allowed;border:1.5px solid rgba(0,229,160,0.45);box-shadow:0 0 18px rgba(0,229,160,0.12),0 4px 12px rgba(0,0,0,0.30);transform:translateY(-2px);font-weight:800;letter-spacing:.3px}
.btn:not(:disabled):active{transform:scale(0.98);box-shadow:0 2px 10px rgba(0,229,160,.15)}
.btn-back{width:100%;padding:11px;border-radius:14px;border:1px solid rgba(255,255,255,0.08);background:rgba(255,255,255,0.03);color:#a0a0b8;font-size:13px;cursor:pointer;margin-top:8px;font-family:inherit;transition:all .18s}
.err-box{background:rgba(255,77,109,.1);border:1px solid rgba(255,77,109,.3);border-radius:12px;padding:12px 16px;font-size:13px;color:#ff4d6d;margin-bottom:14px;line-height:1.6}
.act-list{display:flex;flex-direction:column;gap:8px;margin-bottom:20px}
.act-item{border:2px solid #1e1e2a;border-radius:16px;padding:14px 18px;cursor:pointer;transition:all .22s;background:rgba(255,255,255,.02);display:flex;align-items:center;gap:14px}
.act-item.sg{border-color:#00e5a0;background:rgba(0,229,160,.07);box-shadow:0 0 16px rgba(0,229,160,.1)}
.act-item-emoji{font-size:20px;flex-shrink:0;width:32px;text-align:center}
.act-item-text{flex:1}
.act-item-title{font-weight:700;font-size:13px;color:#e8e8f0}
.act-item-sub{font-size:11px;color:#a0a0b8;margin-top:2px}
.act-item-badge{font-size:11px;font-weight:700;color:#5a5a70;flex-shrink:0;transition:color .22s}
.act-item.sg .act-item-badge{color:#00e5a0}
.sec-divider{height:1px;background:#1e1e2a;margin:20px 0}
.target-fields{margin-top:16px;padding-top:16px;border-top:1px solid #1e1e2a;animation:fadeIn .25s ease}
@keyframes fadeIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}

/* PLAN */
#plan{display:none;background:#0a0a0f;padding-bottom:80px;width:100%;box-sizing:border-box}
.pi{max-width:560px;margin-left:auto;margin-right:auto;width:100%;box-sizing:border-box}
#pi-progress{-webkit-text-size-adjust:none;text-size-adjust:none}
#pi-progress .hero-title{font-size:34px!important}
#pi-progress .sh-t{font-size:16px!important}
#pi-progress .overline{font-size:10px!important}
.sec{padding:24px 20px 0}
#meal-schedule-sec{padding-left:0;padding-right:0}
#meal-schedule-sec .sh{padding:0 20px}
#meal-schedule-sec .meal-progress{padding:0 20px 12px}
#meal-schedule-sec .mth{padding:8px 12px}
#meal-schedule-sec .meal-row{padding:14px 12px;margin:0}
#meal-schedule-sec .mtot{padding:12px 12px;border-radius:0 0 0 0}
#meal-schedule-sec .macro-adjuster{margin:0}
.hero{padding:40px 20px 0}
.overline{font-size:10px;color:#a0a0b8;letter-spacing:3px;text-transform:uppercase;margin-bottom:10px}
.hero-title{font-size:46px;font-weight:900;line-height:1;margin-bottom:16px}
.hero-sub{font-size:13px;color:#a0a0b8;line-height:1.7}
.sg4{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.sg5{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}
.scard{background:#111118;border:1px solid #1e1e2a;border-radius:12px;padding:14px 8px;text-align:center}
.sv{font-size:16px;font-weight:800}
.sl{font-size:9px;color:#a0a0b8;text-transform:uppercase;letter-spacing:.5px;margin-top:4px}
.cal-card{background:#111118;border:1px solid #1e1e2a;border-radius:16px;padding:24px}
.cal-title{font-size:10px;color:#a0a0b8;text-transform:uppercase;letter-spacing:2px;margin-bottom:8px}
.cal-big{font-size:52px;font-weight:900;line-height:1}
.cal-unit{font-size:12px;color:#a0a0b8;margin-top:4px;margin-bottom:18px}
.cal-row{display:flex;justify-content:space-between;font-size:13px;margin-bottom:8px}
.mbar{height:8px;border-radius:999px;overflow:hidden;display:flex;gap:2px;margin-top:16px}
.mleg{display:flex;gap:16px;margin-top:8px;flex-wrap:wrap}

/* MACRO SPLIT ADJUSTER */
.macro-adjuster{background:#111118;border:1px solid #1e1e2a;border-radius:16px;padding:20px;margin-top:8px}
.macro-adj-title{font-size:10px;color:#a0a0b8;text-transform:uppercase;letter-spacing:2px;font-weight:700;margin-bottom:4px}
.macro-adj-sub{font-size:11px;color:#a0a0b8;margin-bottom:18px;line-height:1.5}
.macro-slider-row{margin-bottom:16px}
.macro-slider-row:last-of-type{margin-bottom:0}
.macro-slider-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
.macro-slider-label{display:flex;align-items:center;gap:7px;font-size:12px;font-weight:700}
.macro-slider-dot{width:9px;height:9px;border-radius:50%;flex-shrink:0}
.macro-slider-pct{font-size:18px;font-weight:900;min-width:44px;text-align:right}
.macro-slider-grams{font-size:11px;color:#a0a0b8;text-align:right;margin-top:1px}
.macro-slider-right{text-align:right}
.macro-slider-wrap{position:relative}
input[type=range].macro-range{-webkit-appearance:none;appearance:none;width:100%;height:6px;border-radius:999px;outline:none;cursor:pointer;border:none;background:#1e1e2a;margin:0;padding:0}
input[type=range].macro-range::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:20px;height:20px;border-radius:50%;cursor:pointer;border:3px solid #0a0a0f;box-shadow:0 2px 8px rgba(0,0,0,.4);transition:transform .15s}
input[type=range].macro-range::-webkit-slider-thumb:hover{transform:scale(1.2)}
input[type=range].macro-range::-moz-range-thumb{width:20px;height:20px;border-radius:50%;cursor:pointer;border:3px solid #0a0a0f;box-shadow:0 2px 8px rgba(0,0,0,.4)}
.macro-range.prot::-webkit-slider-thumb{background:#00e5a0}
.macro-range.carb::-webkit-slider-thumb{background:#4a9eff}
.macro-range.fat::-webkit-slider-thumb{background:#ff9f35}
.macro-range.prot::-moz-range-thumb{background:#00e5a0}
.macro-range.carb::-moz-range-thumb{background:#4a9eff}
.macro-range.fat::-moz-range-thumb{background:#ff9f35}
.macro-adj-bar{height:10px;border-radius:999px;overflow:hidden;display:flex;gap:2px;margin-top:16px;margin-bottom:6px}
.macro-adj-bar-seg{height:100%;transition:width .2s}
.macro-adj-legend{display:flex;justify-content:space-between;font-size:10px;color:#a0a0b8}
.macro-adj-total{display:flex;align-items:center;justify-content:space-between;padding:10px 12px;border-radius:10px;border:1px solid #1e1e2a;margin-top:14px;background:rgba(255,255,255,.02)}
.macro-adj-total-label{font-size:11px;color:#a0a0b8;font-weight:600}
.macro-adj-total-val{font-size:14px;font-weight:900}
.macro-adj-reset{padding:8px 16px;border-radius:10px;border:1px solid #1e1e2a;background:transparent;color:#a0a0b8;font-size:11px;font-weight:700;cursor:pointer;font-family:inherit;transition:all .2s;letter-spacing:.5px}
.macro-adj-reset:hover{border-color:#00e5a0;color:#00e5a0}
/* MACRO FLIP CARD */
.macro-flip-scene{perspective:1000px;margin-top:0}
.macro-flip-inner{position:relative;transition:transform .55s cubic-bezier(.4,0,.2,1);transform-style:preserve-3d;will-change:transform;min-height:160px}
.macro-flip-inner.flipped{transform:rotateY(180deg)}
.macro-flip-front,.macro-flip-back{backface-visibility:hidden;-webkit-backface-visibility:hidden}
.macro-flip-back{position:absolute;top:0;left:0;width:100%;transform:rotateY(180deg)}
.macro-flip-btn{display:inline-flex;align-items:center;gap:5px;padding:5px 12px;border-radius:20px;border:1px solid #1e1e2a;background:transparent;color:#a0a0b8;font-size:10px;font-weight:700;cursor:pointer;font-family:inherit;transition:all .2s;letter-spacing:.5px;margin-left:auto}
.macro-flip-btn:hover,.macro-flip-btn:active{border-color:#00e5a0;color:#00e5a0}
.macro-flip-back-btn{display:inline-flex;align-items:center;gap:5px;padding:5px 12px;border-radius:20px;border:1px solid #1e1e2a;background:transparent;color:#a0a0b8;font-size:10px;font-weight:700;cursor:pointer;font-family:inherit;transition:all .2s;letter-spacing:.5px}
.macro-flip-back-btn:hover,.macro-flip-back-btn:active{border-color:#00e5a0;color:#00e5a0}
body.light .macro-flip-btn,body.light .macro-flip-back-btn{border-color:#d0d0e0;color:#666}
body.light .macro-flip-btn:hover,body.light .macro-flip-back-btn:hover{border-color:#00b87a;color:#00b87a}
.dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}
.li{display:flex;align-items:center;gap:5px;font-size:11px;color:#a0a0b8}
.sh{display:flex;align-items:center;gap:12px;margin-bottom:16px}
.sh-t{font-size:20px;font-weight:900;line-height:1.3}
.tag{font-size:10px;font-weight:700;padding:4px 10px;border-radius:6px;letter-spacing:1px;text-align:center}
.mcard{border-radius:14px;padding:20px;margin-bottom:12px;border:1px solid #1e1e2a}
.mi{font-size:22px;margin-bottom:8px}
.mn{font-size:10px;color:#a0a0b8;text-transform:uppercase;letter-spacing:2px;margin-bottom:4px}
.mv{font-size:42px;font-weight:900;line-height:1}
.mv span{font-size:18px}
.mnote{font-size:12px;color:#a0a0b8;margin-top:6px}
.mth{display:grid;grid-template-columns:48px 95px 1fr 50px;gap:6px;padding:8px 10px;border-bottom:1px solid #1e1e2a}
.mch{font-size:12px;color:#a0a0b8;text-transform:uppercase;letter-spacing:1px;font-weight:700}
.mch-time{text-align:left}
.mch-meal{text-align:left;padding-left:4px}
.mch-food{text-align:center;padding-left:0px}
.mch-cal{text-align:right}
.mrow-time{color:#00e5a0;font-weight:700}
.mrow-meal{}
.mrow-food{}
.mrow-cal{display:flex;flex-direction:column;align-items:flex-end;gap:6px}
.mch:last-child{text-align:right}
.meal-row{display:grid;grid-template-columns:48px 95px 1fr 50px;gap:6px;padding:14px 10px;border-bottom:1px solid #1e1e2a;align-items:start;transition:background .2s}
.meal-row.ticked{background:rgba(0,229,160,.04)}
.mt{color:#00e5a0;font-weight:700;font-size:11px}
.mname{font-weight:700;font-size:13px}
.msub{font-size:10px;color:#a0a0b8;margin-top:2px;line-height:1.4}
.mf{font-size:12px;color:#a0a0b8;line-height:1.6;min-width:0;word-break:break-word;padding-top:6px}
.meal-row>div:nth-child(2){min-width:0}
.meal-row>div:nth-child(3){min-width:0}
.pill{font-size:10px;font-weight:700;padding:2px 6px;border-radius:5px;display:block;margin-bottom:3px}
.mcal-wrap{display:flex;flex-direction:column;align-items:flex-end;gap:6px}
.mmacro-cal-cell{display:flex;flex-direction:column;align-items:flex-end}
.mcal{font-size:17px;font-weight:800}
.tick-btn{width:28px;height:28px;border-radius:50%;border:2px solid #1e1e2a;background:transparent;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:14px;transition:all .2s;flex-shrink:0}
.tick-btn.done{border-color:#00e5a0;background:#00e5a0;color:#0a0a0f}
.mtot{display:grid;grid-template-columns:48px 95px 1fr 50px;gap:6px;padding:12px 10px;background:rgba(0,229,160,.05);border-radius:0 0 14px 14px;align-items:center}
.meal-progress{margin-top:12px}
.mp-bar{height:6px;border-radius:999px;background:#1e1e2a;overflow:hidden}
.mp-fill{height:100%;background:#00e5a0;border-radius:999px;transition:width .4s}
.mp-label{font-size:11px;color:#a0a0b8;margin-top:6px;display:flex;justify-content:space-between}
.wg4{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:8px}
.wg3{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.wcard2{background:#111118;border:1px solid #1e1e2a;border-radius:12px;padding:12px 8px;text-align:center}
.wc{font-size:14px;font-weight:800}
.wd{font-size:9px;color:#a0a0b8;margin-top:2px}
.wl{font-size:9px;color:#a0a0b8}
.ccard{background:#111118;border:1px solid #1e1e2a;border-radius:16px;padding:16px}
.clabel{font-size:9px;color:#a0a0b8;text-transform:uppercase;letter-spacing:2px;margin-bottom:12px}

/* WATER TRACKER */
.water-card{background:#111118;border:1px solid #1e1e2a;border-radius:16px;padding:20px}
.water-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}
.water-title{font-size:14px;font-weight:700}
.water-count{font-size:28px;font-weight:900;color:#4a9eff}
.water-unit{font-size:11px;color:#a0a0b8;margin-top:2px}
.water-glasses{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px}
.glass{width:36px;height:44px;border-radius:4px 4px 8px 8px;border:2px solid #1e1e2a;background:transparent;cursor:pointer;display:flex;align-items:flex-end;overflow:hidden;transition:all .2s;position:relative}
.glass.filled{border-color:#4a9eff}
.glass-fill{width:100%;background:#4a9eff;transition:height .3s}
.glass-icon{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:16px}
.water-bar-wrap{height:8px;border-radius:999px;background:#1e1e2a;overflow:hidden}
.water-bar{height:100%;background:#4a9eff;border-radius:999px;transition:width .4s}
.water-info{display:flex;justify-content:space-between;font-size:11px;color:#a0a0b8;margin-top:6px}
.water-btns{display:flex;gap:8px;margin-top:12px}
.wbtn{flex:1;padding:10px;border-radius:10px;border:1px solid #1e1e2a;background:transparent;color:#e8e8f0;font-size:13px;font-weight:600;cursor:pointer;font-family:inherit;transition:all .2s}
.wbtn:hover{background:#4a9eff22;border-color:#4a9eff}

/* GROCERY */
.grocery-card{background:#111118;border:1px solid #1e1e2a;border-radius:16px;padding:20px}
.gcats{display:flex;flex-direction:column;gap:16px}
/* Grocery week tabs */
.grocery-week-tabs{display:flex;gap:6px;margin-bottom:16px}
.gwtab{flex:1;padding:9px 6px;border-radius:10px;border:1px solid #1e1e2a;background:transparent;color:#a0a0b8;font-size:12px;font-weight:700;cursor:pointer;font-family:inherit;transition:all .2s;text-align:center}
.gwtab.active{border-color:#ff9f35;background:rgba(255,159,53,.12);color:#ff9f35}
.gwtab:hover:not(.active){border-color:#ff9f3566;color:#e8e8f0}
.gcat-title{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:1px;margin-bottom:10px;padding-bottom:6px;border-bottom:1px solid #1e1e2a}
.gitem{display:flex;align-items:center;gap:10px;padding:6px 0;font-size:13px;color:#a0a0b8;cursor:pointer;transition:color .2s}
.gitem:hover{color:#e8e8f0}
.gitem.checked{color:#2a2a3a;text-decoration:line-through}
.gbox{width:18px;height:18px;border-radius:5px;border:2px solid #1e1e2a;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:11px;transition:all .2s}
.gitem.checked .gbox{background:#00e5a0;border-color:#00e5a0;color:#0a0a0f}
.grocery-progress{margin-top:16px;padding-top:16px;border-top:1px solid #1e1e2a}
.gp-bar{height:6px;border-radius:999px;background:#1e1e2a;overflow:hidden}
.gp-fill{height:100%;background:#00e5a0;border-radius:999px;transition:width .4s}
.gp-label{font-size:11px;color:#a0a0b8;margin-top:6px;display:flex;justify-content:space-between}

/* SLEEP TRACKER */
.sleep-card{background:#111118;border:1px solid #1e1e2a;border-radius:16px;padding:20px}
.sleep-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}
.sleep-title{font-size:14px;font-weight:700}
.sleep-score{font-size:28px;font-weight:900;color:#a78bfa}
.sleep-unit{font-size:11px;color:#a0a0b8;margin-top:2px;text-align:right}
.sleep-beds{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:14px}
.sleep-bed{width:38px;height:38px;border-radius:10px;border:2px solid #1e1e2a;background:transparent;cursor:pointer;font-size:18px;display:flex;align-items:center;justify-content:center;transition:all .2s}
.sleep-bed.filled{border-color:#a78bfa;background:rgba(167,139,250,.15)}
.sleep-bar-wrap{height:8px;border-radius:999px;background:#1e1e2a;overflow:hidden}
.sleep-bar{height:100%;background:#a78bfa;border-radius:999px;transition:width .4s}
.sleep-info{display:flex;justify-content:space-between;font-size:11px;color:#a0a0b8;margin-top:6px}
.sleep-btns{display:flex;gap:8px;margin-top:12px}
.slbtn{flex:1;padding:10px;border-radius:10px;border:1px solid #1e1e2a;background:transparent;color:#e8e8f0;font-size:13px;font-weight:600;cursor:pointer;font-family:inherit;transition:all .2s}
.slbtn:hover{background:#a78bfa22;border-color:#a78bfa}
.sleep-quality{display:flex;gap:6px;margin-top:10px;flex-wrap:wrap}
.sq-btn{flex:1;padding:8px 6px;border-radius:9px;border:1px solid #1e1e2a;background:transparent;color:#a0a0b8;font-size:11px;font-weight:600;cursor:pointer;font-family:inherit;transition:all .2s;text-align:center;min-width:60px}
.sq-btn.active{border-color:#a78bfa;background:rgba(167,139,250,.12);color:#a78bfa}
/* STEP / CARDIO TRACKER */
.cardio-card{background:#111118;border:1px solid #1e1e2a;border-radius:16px;padding:20px}
.cardio-top{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:14px}
.cardio-title{font-size:14px;font-weight:700}
.cardio-count{font-size:28px;font-weight:900;color:#34d399}
.cardio-unit{font-size:11px;color:#a0a0b8;margin-top:2px;text-align:right}
.cardio-tabs{display:flex;gap:6px;margin-bottom:14px}
.ctab{flex:1;padding:8px;border-radius:9px;border:1px solid #1e1e2a;background:transparent;color:#a0a0b8;font-size:12px;font-weight:600;cursor:pointer;font-family:inherit;transition:all .2s;text-align:center}
.ctab.active{border-color:#34d399;background:rgba(52,211,153,.1);color:#34d399}
.cardio-input-row{display:flex;gap:8px;margin-bottom:12px;align-items:flex-end}
.cardio-input-row input{margin-bottom:0;font-size:18px;padding:10px 14px;flex:1;border:2px solid #1e1e2a;border-radius:12px;background:rgba(255,255,255,.03);color:#e8e8f0;outline:none;font-family:inherit}
.cadd-btn{padding:10px 16px;border-radius:12px;border:none;background:#34d399;color:#0a0a0f;font-size:13px;font-weight:700;cursor:pointer;white-space:nowrap;font-family:inherit;flex-shrink:0}
.cardio-bar-wrap{height:8px;border-radius:999px;background:#1e1e2a;overflow:hidden}
.cardio-bar{height:100%;background:#34d399;border-radius:999px;transition:width .4s}
.cardio-info{display:flex;justify-content:space-between;font-size:11px;color:#a0a0b8;margin-top:6px}
.cardio-log{display:flex;flex-direction:column;gap:6px;margin-top:12px;max-height:160px;overflow-y:auto}
.cardio-entry{display:flex;justify-content:space-between;align-items:center;padding:8px 12px;background:rgba(255,255,255,.02);border-radius:9px;border:1px solid #1e1e2a;font-size:12px}
.cardio-del{background:transparent;border:none;color:#a0a0b8;cursor:pointer;font-size:14px;padding:0 2px;font-family:inherit}
.cardio-del:hover{color:#ff4d6d}
/* PROGRESS PHOTOS LOG */
.photo-card{background:#111118;border:1px solid #1e1e2a;border-radius:16px;padding:20px}
.photo-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:14px}
.photo-slot{aspect-ratio:3/4;border-radius:12px;border:2px dashed #1e1e2a;display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;transition:all .2s;position:relative;overflow:hidden;background:rgba(255,255,255,.02)}
.photo-slot:hover{border-color:#00e5a0;background:rgba(0,229,160,.04)}
.photo-slot.has-photo{border-style:solid;border-color:#1e1e2a}
.photo-slot img{width:100%;height:100%;object-fit:cover;border-radius:10px}
.photo-slot-label{font-size:10px;color:#a0a0b8;text-align:center;margin-top:6px;font-weight:600;letter-spacing:.5px;text-transform:uppercase}
.photo-slot-icon{font-size:22px;margin-bottom:4px}
.photo-slot-add{font-size:9px;color:#a0a0b8;margin-top:2px}
.photo-delete{position:absolute;top:4px;right:4px;background:rgba(255,77,109,.8);border:none;border-radius:50%;width:20px;height:20px;color:white;font-size:11px;cursor:pointer;display:flex;align-items:center;justify-content:center;font-family:inherit}
.photo-note{font-size:12px;color:#a0a0b8;line-height:1.6;padding:10px 14px;background:rgba(255,255,255,.02);border-radius:10px;border:1px solid #1e1e2a}
.photo-weeks{display:flex;gap:6px;margin-bottom:14px;overflow-x:auto;padding-bottom:4px}
.pw-btn{flex-shrink:0;padding:6px 14px;border-radius:8px;border:1px solid #1e1e2a;background:transparent;color:#a0a0b8;font-size:11px;font-weight:600;cursor:pointer;font-family:inherit;transition:all .2s;white-space:nowrap}
.pw-btn.active{border-color:#00e5a0;background:rgba(0,229,160,.1);color:#00e5a0}
/* MEAL PREP TIMES */
.prep-table{border-radius:14px;overflow:hidden;border:1px solid #1e1e2a}
.prep-row{display:grid;grid-template-columns:1fr 80px 90px;gap:4px;padding:12px 14px;border-bottom:1px solid #1e1e2a;align-items:center}
.prep-row:last-child{border-bottom:none}
.prep-row.header{background:rgba(255,255,255,.02);padding:8px 14px}
.prep-meal{font-size:12px;font-weight:700}
.prep-foods{font-size:10px;color:#a0a0b8;margin-top:2px;line-height:1.4}
.prep-time{font-size:13px;font-weight:800;color:#ff9f35;text-align:center}
.prep-tip{font-size:10px;color:#a0a0b8;text-align:center}
.prep-total{display:flex;justify-content:space-between;align-items:center;padding:12px 14px;background:rgba(255,159,53,.06);border-top:1px solid rgba(255,159,53,.2)}
.prep-tip-box{background:rgba(0,229,160,.06);border:1px solid rgba(0,229,160,.2);border-radius:12px;padding:14px 16px;margin-top:12px}
.prep-tip-title{font-size:11px;font-weight:700;color:#00e5a0;margin-bottom:8px;text-transform:uppercase;letter-spacing:1px}
.prep-tip-item{font-size:12px;color:#a0a0b8;padding:3px 0;line-height:1.5}
/* print button removed */

/* WEIGH-IN LOG */
.weighin-card{background:#111118;border:1px solid #1e1e2a;border-radius:16px;padding:20px}
.weighin-input-row{display:flex;gap:8px;margin-bottom:16px;align-items:flex-end}
.weighin-input-row input{margin-bottom:0;font-size:18px;padding:12px 14px;flex:1}
.wi-add-btn{padding:12px 18px;border-radius:12px;border:none;background:#00e5a0;color:#0a0a0f;font-size:14px;font-weight:700;cursor:pointer;white-space:nowrap;font-family:inherit;flex-shrink:0}
.wi-entries{display:flex;flex-direction:column;gap:6px;margin-bottom:16px;max-height:220px;overflow-y:auto}
.wi-entry{display:flex;justify-content:space-between;align-items:center;padding:10px 14px;background:rgba(255,255,255,.02);border-radius:10px;border:1px solid #1e1e2a}
.wi-week{font-size:11px;color:#a0a0b8}
.wi-weight{font-size:16px;font-weight:800}
.wi-change{font-size:11px;font-weight:600;padding:2px 8px;border-radius:20px}
.wi-del{background:transparent;border:none;color:#a0a0b8;cursor:pointer;font-size:16px;padding:0 4px;font-family:inherit}
.wi-del:hover{color:#ff4d6d}
.wi-empty{font-size:13px;color:#a0a0b8;text-align:center;padding:20px 0}
.wi-chart-wrap{margin-top:4px}
.wi-stats{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;margin-top:12px}
.wi-stat{background:rgba(255,255,255,.02);border-radius:10px;padding:10px;text-align:center;border:1px solid #1e1e2a}
.wi-stat-val{font-size:16px;font-weight:800}
.wi-stat-label{font-size:9px;color:#a0a0b8;text-transform:uppercase;letter-spacing:.5px;margin-top:3px}

/* MEAL SWAP */
.swap-btn{background:transparent;border:1px solid #1e1e2a;border-radius:8px;color:#a0a0b8;font-size:10px;font-weight:600;cursor:pointer;padding:3px 8px;margin-top:4px;font-family:inherit;transition:all .2s;display:block}
.swap-btn:hover{border-color:#ff9f35;color:#ff9f35}
.swap-modal{display:none;position:fixed;inset:0;background:rgba(0,0,0,.7);z-index:100;align-items:center;justify-content:center;padding:20px}
.swap-modal.open{display:flex}
.swap-box{background:#111118;border:1px solid #1e1e2a;border-radius:20px;padding:24px;width:100%;max-width:460px;max-height:80vh;overflow-y:auto}
.swap-title{font-size:16px;font-weight:800;margin-bottom:4px}
.swap-sub{font-size:12px;color:#a0a0b8;margin-bottom:16px}
.swap-option{border:1px solid #1e1e2a;border-radius:12px;padding:14px;margin-bottom:10px;cursor:pointer;transition:all .2s}
.swap-option:hover{border-color:#00e5a0;background:rgba(0,229,160,.05)}
.swap-opt-name{font-size:13px;font-weight:700;margin-bottom:4px}
.swap-opt-foods{font-size:11px;color:#a0a0b8;line-height:1.5;margin-bottom:6px}
.swap-opt-macros{display:flex;gap:8px}
.swap-close{width:100%;padding:12px;border-radius:12px;border:1px solid #1e1e2a;background:transparent;color:#a0a0b8;font-size:13px;cursor:pointer;margin-top:4px;font-family:inherit}

/* RECALCULATOR */
.recalc-card{background:#111118;border:1px solid #1e1e2a;border-radius:16px;padding:20px}
.recalc-row{display:flex;gap:8px;align-items:flex-end;margin-bottom:16px}
.recalc-row input{margin-bottom:0;font-size:20px;padding:12px 16px;flex:1}
.rc-btn{padding:12px 18px;border-radius:12px;border:none;background:#ff9f35;color:#0a0a0f;font-size:14px;font-weight:700;cursor:pointer;white-space:nowrap;font-family:inherit;flex-shrink:0}
.rc-result{background:rgba(255,159,53,.07);border:1px solid rgba(255,159,53,.25);border-radius:12px;padding:16px;display:none}
.rc-result.show{display:block}
.rc-result-big{font-size:36px;font-weight:900;color:#ff9f35;line-height:1}
.rc-result-rows{margin-top:12px;display:flex;flex-direction:column;gap:6px}
.rc-result-row{display:flex;justify-content:space-between;font-size:13px}
.rc-note{font-size:11px;color:#a0a0b8;margin-top:10px;line-height:1.5}

/* DIET BY CONDITION */
.dbc-btn{width:100%;padding:16px 20px;border-radius:16px;border:2px solid #e879f955;background:linear-gradient(135deg,rgba(232,121,249,.08),rgba(167,139,250,.08));color:#e8e8f0;font-size:15px;font-weight:700;cursor:pointer;font-family:inherit;display:flex;align-items:center;justify-content:space-between;gap:12px;transition:all .3s;margin-top:8px}
.dbc-btn:hover{border-color:#e879f9;background:linear-gradient(135deg,rgba(232,121,249,.14),rgba(167,139,250,.14));transform:translateY(-1px)}
.dbc-btn-left{display:flex;align-items:center;gap:12px}
.dbc-btn-icon{font-size:24px;flex-shrink:0}
.dbc-btn-text{text-align:left}
.dbc-btn-title{font-size:15px;font-weight:800;color:#e8e8f0}
.dbc-btn-sub{font-size:11px;color:#a0a0b8;margin-top:2px}
.dbc-btn-arrow{font-size:18px;color:#e879f9;flex-shrink:0}

/* DIGITAL PHYSIOTHERAPIST */
.physio-btn{width:100%;padding:16px 20px;border-radius:16px;border:2px solid rgba(56,189,248,.5);background:linear-gradient(135deg,rgba(56,189,248,.09),rgba(34,211,238,.07));color:#e8e8f0;font-size:15px;font-weight:700;cursor:pointer;font-family:inherit;display:flex;align-items:center;justify-content:space-between;gap:12px;transition:all .3s;margin-top:10px}
.physio-btn:hover{border-color:#38bdf8;background:linear-gradient(135deg,rgba(56,189,248,.16),rgba(34,211,238,.12));transform:translateY(-1px)}
.physio-btn-left{display:flex;align-items:center;gap:12px;flex:1;min-width:0}
.physio-btn-text{text-align:left;min-width:0}
.physio-btn-icon{font-size:24px;flex-shrink:0}
.physio-btn-title{font-size:15px;font-weight:800;color:#e8e8f0}
.physio-btn-sub{font-size:11px;color:#a0a0b8;margin-top:2px}
.physio-btn-chevron{font-size:22px;color:#38bdf8;flex-shrink:0;line-height:1;font-weight:300}

/* PHYSIO SUBPAGE */
.sp-physio .sp-body{padding-bottom:40px}

/* MEDICAL REPORT CHECKER */
.sp-medreport .sp-body{padding-bottom:40px}
.med-disclaimer{background:rgba(239,68,68,.08);border:1px solid rgba(239,68,68,.3);border-radius:14px;padding:14px 16px;margin-bottom:18px;font-size:12px;color:#fca5a5;line-height:1.7}
.med-disclaimer strong{color:#ef4444;display:block;margin-bottom:4px;font-size:13px}
.med-search-wrap{position:relative;margin-bottom:14px}
.med-search-icon{position:absolute;left:14px;top:50%;transform:translateY(-50%);font-size:16px;pointer-events:none}
.med-search-input{width:100%;background:rgba(239,68,68,.06);border:2px solid rgba(239,68,68,.25);border-radius:14px;padding:13px 18px 13px 44px;font-size:15px;color:#e8e8f0;outline:none;font-family:inherit;transition:border-color .2s}
.med-search-input:focus{border-color:rgba(239,68,68,.5)}
.med-cat-row{display:flex;gap:8px;overflow-x:auto;padding-bottom:10px;margin-bottom:16px;-ms-overflow-style:none;scrollbar-width:none}
.med-cat-row::-webkit-scrollbar{display:none}
.med-cat-tag{font-size:10px;font-weight:700;padding:6px 14px;border-radius:20px;cursor:pointer;border:1px solid #1e1e2a;background:#111118;color:#a0a0b8;transition:all .2s;white-space:nowrap;flex-shrink:0}
.med-cat-tag.active{background:rgba(239,68,68,.12);border-color:rgba(239,68,68,.4);color:#ef4444}
.med-report-card{background:#111118;border:1px solid rgba(239,68,68,.2);border-radius:16px;padding:18px;margin-bottom:12px;animation:fadeInUp .3s ease}
.med-report-name{font-size:16px;font-weight:800;color:#e8e8f0;margin-bottom:4px}
.med-report-cat{display:inline-block;font-size:9px;font-weight:800;padding:3px 9px;border-radius:6px;letter-spacing:1.5px;text-transform:uppercase;margin-bottom:12px;background:rgba(239,68,68,.12);border:1px solid rgba(239,68,68,.3);color:#ef4444}
.med-test-row{display:flex;align-items:flex-start;gap:10px;padding:10px 12px;background:rgba(255,255,255,.02);border-radius:10px;border:1px solid #1e1e2a;margin-bottom:8px;cursor:pointer;transition:all .2s}
.med-test-row:hover{border-color:rgba(239,68,68,.35);background:rgba(239,68,68,.04)}
.med-test-icon{font-size:18px;flex-shrink:0;margin-top:1px}
.med-test-name{font-size:13px;font-weight:700;color:#e8e8f0}
.med-test-sub{font-size:11px;color:#a0a0b8;margin-top:2px;line-height:1.4}
.med-test-arrow{margin-left:auto;color:#a0a0b8;font-size:16px;flex-shrink:0;margin-top:2px}
.med-no-result{text-align:center;padding:40px 20px;color:#a0a0b8}
.med-no-result-icon{font-size:36px;margin-bottom:10px}
.med-no-result-text{font-size:15px;font-weight:700;color:#e8e8f0;margin-bottom:6px}
.med-no-result-sub{font-size:12px;line-height:1.5}
/* Medical test detail modal */
.med-detail-overlay{position:fixed;inset:0;background:rgba(0,0,0,.75);z-index:9999;display:none;align-items:flex-end;justify-content:center}
.med-detail-overlay.visible{display:flex}
.med-detail-sheet{background:#111118;border-radius:24px 24px 0 0;width:100%;max-width:560px;max-height:90vh;overflow-y:auto;padding:24px 20px 40px}
.med-detail-handle{width:36px;height:4px;background:#1e1e2a;border-radius:2px;margin:0 auto 18px}
.med-detail-name{font-size:20px;font-weight:900;color:#e8e8f0;margin-bottom:4px}
.med-detail-full{font-size:12px;color:#a0a0b8;margin-bottom:16px}
.med-range-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:16px}
.med-range-box{background:rgba(255,255,255,.03);border:1px solid #1e1e2a;border-radius:12px;padding:12px;text-align:center}
.med-range-label{font-size:9px;color:#a0a0b8;text-transform:uppercase;letter-spacing:1px;margin-bottom:6px;font-weight:700}
.med-range-val{font-size:14px;font-weight:800;line-height:1.3}
.med-section-title{font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:1.5px;padding:6px 12px;border-radius:8px;display:inline-block;margin-bottom:8px;margin-top:6px}
/* CSS: Medical report detail sheet — list items, close button */
.med-detail-list{display:flex;flex-direction:column;gap:6px;margin-bottom:14px}
.med-detail-list li{display:flex;align-items:flex-start;gap:8px;font-size:13px;color:#c8c8d4;line-height:1.5;list-style:none;padding:6px 10px;background:rgba(255,255,255,.02);border-radius:8px;border:1px solid #1e1e2a}
.med-detail-close{width:100%;padding:13px;border-radius:14px;border:none;background:rgba(239,68,68,.15);color:#ef4444;font-size:14px;font-weight:700;cursor:pointer;font-family:inherit;border:1px solid rgba(239,68,68,.3);margin-top:16px;transition:all .2s}
.med-detail-close:hover{background:rgba(239,68,68,.25)}
/* CSS: Physiotherapy subpage — search input, result cards, machine tags, nutrient grid */
.physio-search-wrap{position:relative;margin-bottom:20px}
.physio-search-input{width:100%;background:rgba(56,189,248,.06);border:2px solid rgba(56,189,248,.25);border-radius:14px;padding:13px 18px 13px 44px;font-size:15px;color:#e8e8f0;outline:none;font-family:inherit;transition:border-color .2s}
.physio-search-input:focus{border-color:#38bdf8}
.physio-search-icon{position:absolute;left:15px;top:50%;transform:translateY(-50%);font-size:18px;pointer-events:none}
.physio-result-card{background:#111118;border:1px solid rgba(56,189,248,.2);border-radius:16px;padding:18px;margin-bottom:12px;animation:fadeInUp .3s ease}
@keyframes fadeInUp{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
.physio-condition-badge{display:inline-block;font-size:9px;font-weight:800;padding:3px 9px;border-radius:6px;letter-spacing:1.5px;text-transform:uppercase;margin-bottom:10px;background:rgba(56,189,248,.12);border:1px solid rgba(56,189,248,.3);color:#38bdf8}
.physio-disease-name{font-size:18px;font-weight:900;color:#e8e8f0;margin-bottom:4px}
.physio-machines-label{font-size:9px;color:#a0a0b8;text-transform:uppercase;letter-spacing:1.5px;margin:10px 0 6px;font-weight:700}
.physio-machine-tags{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:4px}
.physio-machine-tag{font-size:11px;font-weight:700;padding:6px 12px;border-radius:8px;background:rgba(34,211,238,.1);border:1px solid rgba(34,211,238,.3);color:#22d3ee;cursor:pointer;transition:all .2s}
.physio-machine-tag:hover,.physio-machine-tag:active{background:rgba(34,211,238,.2);border-color:#22d3ee;transform:scale(1.04)}
.physio-nutrient-label{font-size:9px;color:#a0a0b8;text-transform:uppercase;letter-spacing:1.5px;margin:12px 0 6px;font-weight:700}
.physio-nutrient-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px}
.physio-nutrient-item{background:rgba(255,255,255,.03);border:1px solid #1e1e2a;border-radius:10px;padding:10px 12px}
.physio-nutrient-name{font-size:10px;font-weight:700;color:#00e5a0;margin-bottom:2px}
.physio-nutrient-val{font-size:13px;font-weight:800;color:#e8e8f0}
.physio-nutrient-note{font-size:9px;color:#a0a0b8;margin-top:2px;line-height:1.4}
.physio-no-result{text-align:center;padding:40px 20px;color:#a0a0b8}
.physio-no-result-icon{font-size:40px;margin-bottom:10px}
.physio-no-result-text{font-size:14px;font-weight:700}
.physio-no-result-sub{font-size:12px;margin-top:4px}

/* CSS: Physiotherapy machine info modal (bottom sheet) — overlay, modal body, list */
.machine-modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,.75);z-index:9999;display:none;align-items:flex-end;justify-content:center}
.machine-modal-overlay.visible{animation:fadeIn .2s ease}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
.machine-modal{background:#111118;border:1px solid rgba(56,189,248,.3);border-radius:24px 24px 0 0;padding:28px 20px 40px;max-width:560px;width:100%;max-height:90vh;overflow-y:auto;animation:slideUp .25s ease}
@keyframes slideUp{from{transform:translateY(40px);opacity:0}to{transform:translateY(0);opacity:1}}
.machine-modal-handle{width:36px;height:4px;background:#2e2e3e;border-radius:99px;margin:0 auto 20px;display:block}
.machine-modal-name{font-size:22px;font-weight:900;color:#22d3ee;margin-bottom:4px}
.machine-modal-full{font-size:12px;color:#a0a0b8;margin-bottom:18px}
.machine-modal-section{margin-bottom:16px}
.machine-modal-section-title{font-size:9px;font-weight:800;letter-spacing:2px;text-transform:uppercase;padding:4px 10px;border-radius:6px;display:inline-block;margin-bottom:8px}
.machine-modal-list{list-style:none;padding:0;margin:0}
.machine-modal-list li{font-size:12px;color:#a0a0b8;padding:5px 0;border-bottom:1px solid #1a1a24;display:flex;gap:8px;align-items:flex-start;line-height:1.5}
.machine-modal-list li:last-child{border-bottom:none}
.machine-modal-close{width:100%;margin-top:16px;padding:13px;border-radius:12px;border:1px solid #1e1e2a;background:transparent;color:#a0a0b8;font-size:13px;font-weight:700;cursor:pointer;font-family:inherit}
/* CSS: Physio category filter pill row (horizontal scroll) */
.physio-tag-row{display:flex;flex-wrap:nowrap;gap:7px;margin-bottom:16px;overflow-x:auto;-webkit-overflow-scrolling:touch;padding-bottom:4px;scrollbar-width:none}
.physio-tag-row::-webkit-scrollbar{display:none}
.physio-category-tag{font-size:10px;font-weight:700;padding:6px 14px;border-radius:20px;cursor:pointer;border:1px solid #1e1e2a;background:#111118;color:#a0a0b8;transition:all .2s;white-space:nowrap;flex-shrink:0}
.physio-category-tag.active{background:rgba(56,189,248,.12);border-color:rgba(56,189,248,.4);color:#38bdf8}
/* CSS: Diet-By-Condition (DBC) subpage — search, disease buttons, macro chart, micro grid, avoid list */
/* Subpage */
.sp-dbc .sp-body{padding-bottom:40px}
.dbc-search-wrap{position:relative;margin-bottom:16px}
.dbc-search{width:100%;background:rgba(255,255,255,.04);border:2px solid #1e1e2a;border-radius:14px;padding:13px 18px 13px 44px;font-size:15px;color:#e8e8f0;outline:none;font-family:inherit;transition:border-color .2s}
.dbc-search:focus{border-color:#e879f9}
.dbc-search-icon{position:absolute;left:15px;top:50%;transform:translateY(-50%);font-size:16px;pointer-events:none}
.dbc-cats{display:flex;flex-direction:column;gap:10px}
.dbc-cat-label{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:1.5px;margin-bottom:6px;padding-left:2px}
.dbc-diseases{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:4px}
.dbc-disease-btn{padding:8px 14px;border-radius:10px;border:1px solid #1e1e2a;background:rgba(255,255,255,.02);color:#a0a0b8;font-size:12px;font-weight:600;cursor:pointer;font-family:inherit;transition:all .2s;white-space:nowrap}
.dbc-disease-btn:hover{border-color:#e879f9;color:#e8e8f0;background:rgba(232,121,249,.08)}
.dbc-disease-btn.selected{border-color:#e879f9;background:rgba(232,121,249,.15);color:#e879f9;font-weight:700}
/* Result panel */
.dbc-result{display:none;margin-top:16px}
.dbc-result.show{display:block}
.dbc-result-header{background:linear-gradient(135deg,rgba(232,121,249,.1),rgba(167,139,250,.08));border:1px solid rgba(232,121,249,.3);border-radius:16px;padding:20px;margin-bottom:14px}
.dbc-disease-name{font-size:22px;font-weight:900;color:#e879f9;margin-bottom:4px}
.dbc-disease-sub{font-size:12px;color:#a0a0b8;line-height:1.6}
.dbc-macro-chart{background:#111118;border:1px solid #1e1e2a;border-radius:16px;padding:18px;margin-bottom:12px}
.dbc-chart-title{font-size:10px;color:#a0a0b8;text-transform:uppercase;letter-spacing:2px;font-weight:700;margin-bottom:14px}
.dbc-macro-rows{display:flex;flex-direction:column;gap:10px}
.dbc-macro-row{display:flex;flex-direction:column;gap:6px}
.dbc-macro-top{display:flex;justify-content:space-between;align-items:center}
.dbc-macro-name{font-size:13px;font-weight:700;display:flex;align-items:center;gap:7px}
.dbc-macro-dot{width:9px;height:9px;border-radius:50%;flex-shrink:0}
.dbc-macro-val{font-size:13px;font-weight:800}
.dbc-macro-bar-bg{height:8px;border-radius:999px;background:#1e1e2a;overflow:hidden}
.dbc-macro-bar-fill{height:100%;border-radius:999px;transition:width .6s}
.dbc-micro-card{background:#111118;border:1px solid #1e1e2a;border-radius:16px;padding:18px;margin-bottom:12px}
.dbc-micro-title{font-size:10px;color:#a0a0b8;text-transform:uppercase;letter-spacing:2px;font-weight:700;margin-bottom:12px}
.dbc-micro-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.dbc-micro-item{background:rgba(255,255,255,.02);border:1px solid #1e1e2a;border-radius:10px;padding:10px}
.dbc-micro-name{font-size:10px;color:#a0a0b8;text-transform:uppercase;letter-spacing:.5px;font-weight:700;margin-bottom:3px}
.dbc-micro-amount{font-size:14px;font-weight:800}
.dbc-micro-note{font-size:10px;color:#a0a0b8;margin-top:2px;line-height:1.4}
.dbc-avoid-card{background:rgba(255,77,109,.05);border:1px solid rgba(255,77,109,.25);border-radius:16px;padding:18px;margin-bottom:12px}
.dbc-avoid-title{font-size:10px;color:#ff4d6d;text-transform:uppercase;letter-spacing:2px;font-weight:700;margin-bottom:12px}
.dbc-avoid-list{display:flex;flex-direction:column;gap:6px}
.dbc-avoid-item{display:flex;align-items:flex-start;gap:8px;font-size:12px;color:#a0a0b8;line-height:1.5}
.dbc-avoid-icon{font-size:13px;flex-shrink:0;margin-top:1px}
.dbc-cal-note{background:rgba(0,229,160,.05);border:1px solid rgba(0,229,160,.2);border-radius:14px;padding:16px;margin-bottom:12px}
.dbc-cal-note-title{font-size:11px;color:#00e5a0;text-transform:uppercase;letter-spacing:1px;font-weight:700;margin-bottom:8px}
.dbc-cal-note-text{font-size:13px;color:#a0a0b8;line-height:1.7}
.dbc-no-results{text-align:center;padding:30px 20px;color:#a0a0b8;font-size:13px}

/* CSS: Supplement Encyclopedia cards (.supp) and Nutrition Rules cards (.rule) */
/* SUPPLEMENTS & RULES */
.supp{background:#111118;border:1px solid #1e1e2a;border-radius:14px;padding:18px;margin-bottom:10px}
.si{display:flex;gap:14px;align-items:flex-start}
.sico{font-size:24px;flex-shrink:0}
.sn{font-weight:700;font-size:15px}
.sd{color:#00e5a0;font-weight:600;font-size:12px;margin-top:2px}
.sdesc{color:#a0a0b8;font-size:12px;margin-top:6px;line-height:1.5}
.rule{background:#111118;border:1px solid #1e1e2a;border-radius:14px;padding:18px;margin-bottom:10px}
.ri{display:flex;gap:14px}
.rn{color:#00e5a0;font-weight:900;font-size:18px;flex-shrink:0;min-width:28px}
.rt{font-size:13px;line-height:1.6;color:#a0a0b8}
.btn-rs{width:100%;padding:16px;border-radius:14px;border:1px solid #1e1e2a;background:transparent;color:#a0a0b8;font-size:14px;font-weight:700;cursor:pointer;letter-spacing:1px;font-family:inherit}

/* CSS: Responsive breakpoints — small screen (max 380px) and print styles */
@media(max-width:380px){
  .mth,.meal-row,.mtot{grid-template-columns:48px 64px 1fr 88px}
  .hero-title{font-size:36px}
  .cal-big{font-size:42px}
  .sg4{grid-template-columns:repeat(2,1fr)}
  .sg5{grid-template-columns:repeat(3,1fr)}
}
@media print{
  #plan{display:block!important}
  #wizard{display:none!important}
  
  .water-card,.grocery-card{display:none}
  body{background:white;color:black}
  .hero-title,.sh-t,.cal-big,.mv{color:black!important}
  .cal-card,.mcard,.supp,.rule,.scard,.wcard2,.ccard{background:white!important;border-color:#ddd!important}
  .hero-sub,.sl,.cal-unit,.msub,.mf,.mnote,.sdesc,.rt,.clabel{color:#555!important}
  .mth{border-color:#ddd!important}
  .meal-row{border-color:#eee!important}
  .mtot{background:#f5f5f5!important}
}

/* CSS: Workout Day Selector — day type buttons (Push/Pull/Legs/Rest), weekly mini-grid, exercise list panel */
/* ── WORKOUT DAY SELECTOR ── */
.wday-selector{background:#111118;border:1px solid #1e1e2a;border-radius:16px;padding:16px;margin-bottom:12px}
.wday-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.wday-header-hidden{display:none!important;margin:0!important;padding:0!important;height:0!important;overflow:hidden!important}
.wday-name{display:none!important}
.wday-date{font-size:10px;color:#a0a0b8;text-transform:uppercase;letter-spacing:1px}
.wday-types{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-bottom:10px}
.wtype-btn{border-radius:10px;border:2px solid #1e1e2a;background:transparent;color:#a0a0b8;font-size:11px;font-weight:700;cursor:pointer;font-family:inherit;padding:8px 4px;text-align:center;transition:all .2s;display:flex;flex-direction:column;align-items:center;gap:3px}
.wtype-btn:hover{border-color:#00e5a044;color:#e8e8f0}
.wtype-btn.active{border-color:#00e5a0;background:rgba(0,229,160,.1);color:#00e5a0}
.wtype-btn.rest-active{border-color:#a0a0b8;background:rgba(90,90,112,.12);color:#a0a0b8}
.wtype-icon{font-size:16px;display:flex;align-items:center;justify-content:center;line-height:1}.wtype-icon svg{width:22px;height:22px;display:block}
body.light .wtype-icon svg [stroke='#e8e8f0']{stroke:#22223b!important}
body.light .wtype-icon svg [fill='#e8e8f0']{fill:#22223b!important}
body.light .wtype-icon svg [fill='#c8c8d8']{fill:#44446a!important}
body.light .wtype-icon svg [stroke='#e8c890']{stroke:#44446a!important}
body.light .wtype-icon svg [fill='#ffd6b0']{fill:#44446a!important}
body.light .wtype-icon svg [stroke='#ffd6b0']{stroke:#44446a!important}
body.light .wtype-icon svg line[stroke='#e8e8f0'],body.light .wtype-icon svg path[stroke='#e8e8f0'],body.light .wtype-icon svg circle[fill='#e8e8f0'],body.light .wtype-icon svg polyline[stroke='#e8e8f0']{stroke:#1a1a2e;fill:none}
body.light .wtype-icon svg circle[fill='#e8e8f0']{fill:#1a1a2e;stroke:none}
.wtype-label{font-size:9px;letter-spacing:.5px;text-transform:uppercase;font-weight:700}
.wday-exercises{margin-top:10px;border-top:1px solid #1e1e2a;padding-top:10px;display:none}
.wday-exercises.open{display:block}
.wex-title{font-size:10px;color:#00e5a0;text-transform:uppercase;letter-spacing:1.5px;font-weight:700;margin-bottom:8px}
.wex-list{display:flex;flex-direction:column;gap:5px}
.wex-item{display:flex;align-items:flex-start;gap:8px;padding:8px 10px;background:rgba(255,255,255,.02);border-radius:9px;border:1px solid #1e1e2a;font-size:12px}
.wex-num{font-size:10px;font-weight:800;color:#a0a0b8;min-width:18px;padding-top:1px}
.wex-info{}
.wex-name{font-weight:700;color:#e8e8f0;font-size:12px}
.wex-detail{font-size:10px;color:#a0a0b8;margin-top:2px;line-height:1.4}
.wday-weekly-card{background:#111118;border:1px solid #1e1e2a;border-radius:16px;overflow:hidden}
.wday-week-grid{display:grid;grid-template-columns:repeat(7,1fr)}
.wday-mini{padding:10px 4px;text-align:center;cursor:pointer;border-right:1px solid #1e1e2a;transition:all .2s;border-bottom:2px solid transparent}
.wday-mini:last-child{border-right:none}
.wday-mini.active{border-bottom-color:#00e5a0;background:rgba(0,229,160,.05)}
.wday-mini-name{font-size:9.5px;color:#e8e8f0;text-transform:uppercase;font-weight:800;margin-bottom:4px}body.light .wday-mini-name{color:#111118}
.wday-mini-icon{font-size:14px;margin-bottom:2px}body.light .wday-mini-icon svg [stroke='#e8e8f0']{stroke:#1a1a2e!important}body.light .wday-mini-icon svg [fill='#e8e8f0']{fill:#1a1a2e!important}
.wday-mini-type{font-size:7px;color:#a0a0b8;text-transform:uppercase;letter-spacing:.3px;font-weight:600;line-height:1.2}
.wday-mini.has-workout .wday-mini-type{color:#00e5a0}
.wday-mini.has-rest .wday-mini-type{color:#a0a0b8}
.wday-detail-panel{padding:16px;border-top:1px solid #1e1e2a}

/* CSS: Section Dashboard — 2-col grid of feature buttons (used in Tools tab and sub-dashboards) */
/* ── SECTION DASHBOARD (reusable for all 3 new dashboards) ── */
.section-dashboard{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:0 4px}
.section-btn{background:#111118;border:1px solid #1e1e2a;border-radius:16px;padding:18px 14px;cursor:pointer;text-align:center;transition:all .25s;position:relative;overflow:hidden}
.section-btn:active{transform:scale(.97)}
.section-btn-icon{font-size:28px;margin-bottom:8px}
.section-btn-name{font-size:13px;font-weight:800}
.section-btn-desc{font-size:10px;color:#a0a0b8;margin-top:3px;line-height:1.4}
.section-btn-badge{position:absolute;top:10px;right:10px;font-size:9px;font-weight:700;padding:2px 7px;border-radius:20px}

/* CSS: BMI + Body Fat card — stat boxes, gradient bar needle, input fields, calculate button */
/* ── BMI + BODY FAT CARD ── */
.bfc-card{background:#111118;border:1px solid #1e1e2a;border-radius:16px;padding:20px}
.bfc-top{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:18px}
.bfc-stat{background:rgba(255,255,255,.02);border:1px solid #1e1e2a;border-radius:12px;padding:14px;text-align:center}
.bfc-val{font-size:32px;font-weight:900;line-height:1}
.bfc-label{font-size:9px;color:#a0a0b8;text-transform:uppercase;letter-spacing:1.5px;margin-top:5px;font-weight:700}
.bfc-cat{font-size:10px;font-weight:700;padding:2px 8px;border-radius:20px;display:inline-block;margin-top:5px;letter-spacing:.5px}
.bfc-bar-wrap{position:relative;height:10px;border-radius:999px;overflow:hidden;margin:10px 0 4px;background:linear-gradient(to right,#4a9eff 0%,#00e5a0 25%,#ff9f35 60%,#ff4d6d 85%,#a00 100%)}
.bfc-bar-needle{position:absolute;top:-3px;width:4px;height:16px;background:#fff;border-radius:2px;transform:translateX(-50%);box-shadow:0 0 6px rgba(0,0,0,.6);transition:left .5s}
.bfc-bar-labels{display:flex;justify-content:space-between;font-size:9px;color:#a0a0b8;margin-bottom:14px}
.bfc-inputs{display:grid;gap:8px;margin-top:4px}
.bfc-inp-row{display:grid;gap:8px}
.bfc-inp-block{background:rgba(255,255,255,.02);border:1px solid #1e1e2a;border-radius:10px;padding:10px 12px}
.bfc-inp-label{font-size:9px;color:#a0a0b8;text-transform:uppercase;letter-spacing:1px;margin-bottom:6px;font-weight:700}
.bfc-inp{width:100%;background:transparent;border:none;border-bottom:1px solid #1e1e2a;padding:3px 0;font-size:20px;font-weight:800;color:#e8e8f0;outline:none;font-family:inherit}
.bfc-calc-btn{width:100%;padding:11px;border-radius:10px;border:none;background:rgba(0,229,160,.15);color:#00e5a0;font-size:13px;font-weight:700;cursor:pointer;font-family:inherit;border:1px solid rgba(0,229,160,.3);margin-top:10px;transition:all .2s}
.bfc-calc-btn:hover{background:rgba(0,229,160,.25)}
.bfc-result{margin-top:14px;padding:14px;background:rgba(255,255,255,.02);border-radius:12px;border:1px solid #1e1e2a;display:none}
.bfc-note{font-size:11px;color:#a0a0b8;line-height:1.6;margin-top:10px}
.bfc-err{font-size:11px;color:#ff4d6d;margin-top:8px;display:none;line-height:1.5}

/* CSS: Bio-metric Orb Button — SVG circular button showing BMI + body fat %, tap to open detail */
/* ── BIO-METRIC ORB BUTTON ── */
.bmo-wrap{display:flex;flex-direction:column;align-items:center;padding:10px 16px 18px;cursor:pointer;-webkit-tap-highlight-color:transparent}
.bmo-orb{position:relative;width:210px;height:210px;cursor:pointer;transition:transform .3s ease}
.bmo-orb:active{transform:scale(0.96)}
.bmo-orb svg{width:100%;height:100%;overflow:visible;filter:drop-shadow(0 0 18px rgba(100,80,220,0.45))}
.bmo-orb:hover svg{filter:drop-shadow(0 0 28px rgba(120,100,255,0.65))}
.bmo-orb:hover .bmo-base{transform:scale(1.06)}
.bmo-base{transition:transform .35s cubic-bezier(.34,1.56,.64,1);transform-origin:center}
.bmo-center{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;pointer-events:none;gap:2px}
.bmo-bmi-val{font-size:30px;font-weight:900;line-height:1;color:#fff;letter-spacing:-1px}
.bmo-bmi-lbl{font-size:8px;color:rgba(255,255,255,.5);text-transform:uppercase;letter-spacing:2px;font-weight:700}
.bmo-divider{width:36px;height:1px;background:rgba(255,255,255,.18);margin:5px 0}
.bmo-bf-val{font-size:22px;font-weight:900;line-height:1;color:#fff;letter-spacing:-0.5px}
.bmo-bf-lbl{font-size:8px;color:rgba(255,255,255,.5);text-transform:uppercase;letter-spacing:2px;font-weight:700}
.bmo-tap-hint{font-size:10px;color:#a0a0b8;letter-spacing:1.5px;text-transform:uppercase;margin-top:14px;font-weight:600;text-align:center}
.bmo-legend{display:flex;gap:20px;margin-top:10px;justify-content:center}
.bmo-leg-item{display:flex;align-items:center;gap:5px;font-size:10px;color:#a0a0b8;font-weight:600}
.bmo-leg-dot{width:8px;height:8px;border-radius:50%}

/* CSS: Radial Wheel Button — SVG pie-slice wheel for Tools tab navigation (center tap = open) */
/* ── RADIAL WHEEL BUTTON ── */
.radial-wheel-wrap{display:flex;flex-direction:column;align-items:center;padding:8px 20px 0;margin-top:4px}
.radial-wheel-label{font-size:9px;color:#a0a0b8;text-transform:uppercase;letter-spacing:2px;font-weight:700;margin-bottom:16px;text-align:center}
.radial-wheel{position:relative;width:240px;height:240px;cursor:pointer;flex-shrink:0;overflow:visible;transform:translateZ(0);-webkit-transform:translateZ(0)}
.radial-wheel svg{width:100%;height:100%;overflow:visible}
.rw-slice{transition:opacity .18s,filter .18s;cursor:pointer}
.rw-slice:hover .rw-path{opacity:1;filter:brightness(1.25)}
.rw-path{transition:all .2s}
.rw-center-circle{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:64px;height:64px;border-radius:50%;background:#111118;border:2px solid #00e5a0;display:flex;flex-direction:column;align-items:center;justify-content:center;pointer-events:all;z-index:2;cursor:pointer;transition:all .2s;box-shadow:0 0 12px rgba(0,229,160,.18)}
.rw-center-circle:active{transform:translate(-50%,-50%) scale(.92);box-shadow:0 0 20px rgba(0,229,160,.35)}
.rw-center-icon{font-size:20px;line-height:1}
.rw-center-text{font-size:6.5px;color:#00e5a0;text-transform:uppercase;letter-spacing:.5px;font-weight:700;margin-top:2px;text-align:center}
.rw-hint{font-size:11px;color:#a0a0b8;margin-top:14px;text-align:center}

/* CSS: Intermittent Fasting (IF) Timer — pattern buttons, clock SVG, phase badge, log entries, tip box */
/* ── IF TIMER ── */
.if-patterns{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:20px}
.if-pat-btn{border-radius:12px;border:2px solid #1e1e2a;background:transparent;color:#a0a0b8;font-size:11px;font-weight:700;cursor:pointer;font-family:inherit;padding:10px 4px;text-align:center;transition:all .2s}
.if-pat-btn:hover{border-color:#f472b644;color:#e8e8f0}
.if-pat-btn.active{border-color:#f472b6;background:rgba(244,114,182,.1);color:#f472b6}
.if-pat-name{font-size:13px;font-weight:900;margin-bottom:3px}
.if-pat-sub{font-size:9px;color:inherit;opacity:.7;letter-spacing:.3px}
.if-clock-wrap{display:flex;flex-direction:column;align-items:center;margin:4px 0 20px}
.if-clock-svg{width:210px;height:210px}
.if-clock-inner{position:relative;width:210px;height:210px;flex-shrink:0}
.if-clock-center{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center;pointer-events:none}
.if-phase-badge{font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:1.5px;padding:3px 10px;border-radius:20px;margin-bottom:6px;display:inline-block}
.if-countdown{font-size:38px;font-weight:900;line-height:1;font-variant-numeric:tabular-nums}
.if-countdown-lbl{font-size:10px;color:#a0a0b8;text-transform:uppercase;letter-spacing:1px;margin-top:4px;font-weight:700}
.if-window-row{display:flex;align-items:center;gap:10px;margin-bottom:12px}
.if-window-label{font-size:10px;color:#a0a0b8;text-transform:uppercase;letter-spacing:1px;font-weight:700;min-width:90px}
.if-time-input{flex:1;background:rgba(255,255,255,.03);border:2px solid #1e1e2a;border-radius:10px;padding:9px 12px;font-size:16px;font-weight:700;color:#e8e8f0;outline:none;font-family:inherit}
.if-time-input:focus{border-color:#f472b6}
.if-start-btn{width:100%;padding:14px;border-radius:14px;border:none;font-size:15px;font-weight:700;cursor:pointer;font-family:inherit;transition:all .2s;margin-top:4px}
.if-start-btn.start{background:#f472b6;color:#0a0a0f}
.if-start-btn.stop{background:rgba(255,77,109,.15);color:#ff4d6d;border:2px solid rgba(255,77,109,.3)}
.if-stats-row{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:16px}
.if-stat{background:rgba(255,255,255,.02);border:1px solid #1e1e2a;border-radius:12px;padding:12px 8px;text-align:center}
.if-stat-val{font-size:18px;font-weight:900}
.if-stat-lbl{font-size:9px;color:#a0a0b8;text-transform:uppercase;letter-spacing:.5px;margin-top:4px;font-weight:700}
.if-log{margin-top:16px;display:flex;flex-direction:column;gap:6px;max-height:180px;overflow-y:auto}
.if-log-entry{display:flex;justify-content:space-between;align-items:center;padding:9px 12px;background:rgba(255,255,255,.02);border-radius:9px;border:1px solid #1e1e2a;font-size:12px}
.if-log-del{background:transparent;border:none;color:#a0a0b8;cursor:pointer;font-size:14px;padding:0 2px;font-family:inherit}
.if-log-del:hover{color:#ff4d6d}
.if-tip-box{background:rgba(244,114,182,.06);border:1px solid rgba(244,114,182,.2);border-radius:12px;padding:14px;margin-top:16px}

/* CSS: Body Measurements subpage — input grid (chest/waist/hips etc.), log entries, change chips */
/* ── BODY MEASUREMENTS ── */
.meas-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:14px}
.meas-input-block{background:rgba(255,255,255,.02);border:1px solid #1e1e2a;border-radius:12px;padding:12px}
.meas-label{font-size:9px;color:#a0a0b8;text-transform:uppercase;letter-spacing:1px;margin-bottom:6px;font-weight:700}
.meas-inp{width:100%;background:transparent;border:none;border-bottom:1px solid #1e1e2a;padding:4px 0;font-size:18px;font-weight:800;color:#e8e8f0;outline:none;font-family:inherit}
.meas-unit{font-size:9px;color:#a0a0b8;margin-top:2px}
.meas-log{margin-top:12px;display:flex;flex-direction:column;gap:6px;max-height:220px;overflow-y:auto}
.meas-entry{background:rgba(255,255,255,.02);border:1px solid #1e1e2a;border-radius:10px;padding:10px 12px}
.meas-entry-week{font-size:10px;color:#a0a0b8;font-weight:600;margin-bottom:6px}
.meas-entry-vals{display:grid;grid-template-columns:repeat(3,1fr);gap:4px}
.meas-val-chip{text-align:center}
.meas-val-num{font-size:13px;font-weight:800}
.meas-val-lbl{font-size:8px;color:#a0a0b8;text-transform:uppercase}
.meas-change{font-size:10px;font-weight:700;padding:1px 6px;border-radius:20px;margin-left:auto}

/* CSS: Streak Counter — big number, week dot row, stat chips (current/best/total) */
/* ── STREAK COUNTER ── */
.streak-big{font-size:72px;font-weight:900;line-height:1;text-align:center;margin:10px 0 4px}
.streak-sub{font-size:13px;color:#a0a0b8;text-align:center;margin-bottom:20px}
.streak-week{display:flex;gap:6px;justify-content:center;margin-bottom:20px;flex-wrap:wrap}
.streak-day{width:38px;height:38px;border-radius:10px;border:2px solid #1e1e2a;display:flex;align-items:center;justify-content:center;font-size:16px;cursor:pointer;transition:all .2s}
.streak-day.done{border-color:#ff9f35;background:rgba(255,159,53,.15)}
.streak-day.today{border-color:#ff9f35;box-shadow:0 0 10px rgba(255,159,53,.3)}
.streak-stat-row{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px}
.streak-stat{background:rgba(255,255,255,.02);border:1px solid #1e1e2a;border-radius:12px;padding:12px;text-align:center}
.streak-stat-val{font-size:22px;font-weight:900}
.streak-stat-lbl{font-size:9px;color:#a0a0b8;text-transform:uppercase;letter-spacing:.5px;margin-top:3px}

/* CSS: Supplement Reminder cards — icon, name, dose, time badge, taken/skip buttons */
/* ── SUPPLEMENT REMINDER ── */
.supp-rem-card{background:#111118;border:1px solid #1e1e2a;border-radius:14px;padding:14px;margin-bottom:10px}
.supp-rem-top{display:flex;align-items:center;gap:12px}
.supp-rem-icon{font-size:24px;flex-shrink:0}
.supp-rem-name{font-size:14px;font-weight:700}
.supp-rem-dose{font-size:11px;color:#a0a0b8;margin-top:1px}
.supp-rem-time{font-size:10px;font-weight:700;padding:2px 8px;border-radius:20px;margin-left:auto;white-space:nowrap}
.supp-check-row{display:flex;gap:6px;margin-top:10px;flex-wrap:wrap}
.supp-check-btn{flex:1;padding:8px;border-radius:9px;border:1px solid #1e1e2a;background:transparent;color:#a0a0b8;font-size:11px;font-weight:600;cursor:pointer;font-family:inherit;transition:all .2s;text-align:center;min-width:60px}
.supp-check-btn.taken{border-color:#00e5a0;background:rgba(0,229,160,.12);color:#00e5a0}

/* CSS: Cheat Meal Planner — calorie budget card, macro row, meal log entries, add form */
/* ── CHEAT MEAL PLANNER ── */
.cheat-budget{background:rgba(255,77,109,.06);border:1px solid rgba(255,77,109,.2);border-radius:14px;padding:16px;margin-bottom:14px}
.cheat-budget-big{font-size:42px;font-weight:900;color:#ff4d6d;line-height:1}
.cheat-macro-row{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:12px}
.cheat-m{background:rgba(255,255,255,.03);border-radius:9px;padding:8px;text-align:center}
.cheat-m-val{font-size:16px;font-weight:800}
.cheat-m-lbl{font-size:9px;color:#a0a0b8;text-transform:uppercase;margin-top:2px}
.cheat-meal-log{display:flex;flex-direction:column;gap:8px;margin-top:12px}
.cheat-entry{background:rgba(255,255,255,.02);border:1px solid #1e1e2a;border-radius:10px;padding:10px 12px;display:flex;justify-content:space-between;align-items:center}
.cheat-inp-row{display:flex;flex-direction:column;gap:10px;margin-bottom:12px}
.cheat-inp{width:100%;background:rgba(255,255,255,.03);border:2px solid #1e1e2a;border-radius:12px;padding:12px 14px;font-size:15px;font-weight:600;color:#e8e8f0;outline:none;font-family:inherit}
.cheat-add-btn{padding:13px;border-radius:12px;border:none;background:#ff4d6d;color:#fff;font-size:14px;font-weight:700;cursor:pointer;font-family:inherit;width:100%}

/* CSS: Macro Calculator — food search input, result chip grid (protein/carbs/fat/cal), log list, total bar */
/* ── MACRO CALCULATOR ── */
.macro-calc-form{background:#111118;border:1px solid #1e1e2a;border-radius:14px;padding:16px;margin-bottom:12px}
.macro-food-search{width:100%;background:rgba(255,255,255,.03);border:2px solid #1e1e2a;border-radius:12px;padding:10px 14px;font-size:14px;color:#e8e8f0;outline:none;font-family:inherit;margin-bottom:10px}
.macro-food-search:focus{border-color:#4a9eff}
.macro-result{background:rgba(74,158,255,.06);border:1px solid rgba(74,158,255,.2);border-radius:14px;padding:16px;display:none}
.macro-result.show{display:block}
.macro-result-name{font-size:16px;font-weight:800;margin-bottom:12px}
.macro-result-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}
.macro-chip{background:rgba(255,255,255,.03);border-radius:10px;padding:10px;text-align:center}
.macro-chip-val{font-size:20px;font-weight:900}
.macro-chip-lbl{font-size:9px;color:#a0a0b8;text-transform:uppercase;margin-top:2px}
.macro-log-list{display:flex;flex-direction:column;gap:6px;margin-top:12px;max-height:200px;overflow-y:auto}
.macro-log-entry{background:rgba(255,255,255,.02);border:1px solid #1e1e2a;border-radius:9px;padding:8px 12px;display:flex;justify-content:space-between;align-items:center;font-size:12px}
.macro-total-bar{background:rgba(255,255,255,.02);border:1px solid #1e1e2a;border-radius:12px;padding:14px;margin-top:10px}
.macro-total-title{font-size:10px;color:#a0a0b8;text-transform:uppercase;letter-spacing:1px;margin-bottom:10px;font-weight:700}
.macro-total-row{display:flex;justify-content:space-between;font-size:13px;margin-bottom:6px}

/* CSS: Custom Meal Builder — name/macro inputs, add button, saved meal entry cards */
/* ── CUSTOM MEAL BUILDER ── */
.meal-builder-form{background:#111118;border:1px solid #1e1e2a;border-radius:14px;padding:16px;margin-bottom:12px}
.mb-inp{width:100%;background:rgba(255,255,255,.03);border:2px solid #1e1e2a;border-radius:12px;padding:10px 14px;font-size:14px;color:#e8e8f0;outline:none;font-family:inherit;margin-bottom:8px}
.mb-inp:focus{border-color:#00e5a0}
.mb-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:8px}
.mb-add-btn{width:100%;padding:12px;border-radius:12px;border:none;background:#00e5a0;color:#0a0a0f;font-size:14px;font-weight:700;cursor:pointer;font-family:inherit}
.custom-meal-entry{background:#111118;border:1px solid #1e1e2a;border-radius:12px;padding:14px;margin-bottom:8px}
.cm-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:8px}
.cm-name{font-size:14px;font-weight:700}
.cm-del{background:transparent;border:none;color:#a0a0b8;cursor:pointer;font-size:16px;font-family:inherit}
.cm-del:hover{color:#ff4d6d}
.cm-macros{display:flex;gap:6px;flex-wrap:wrap}
.cm-foods{font-size:11px;color:#a0a0b8;margin-top:4px;line-height:1.5}

/* CSS: Workout Log — session cards, exercise rows, set input grid (weight/reps/done), start form */
/* ── WORKOUT LOG ── */
.wl-session{background:#111118;border:1px solid #1e1e2a;border-radius:14px;padding:16px;margin-bottom:10px}
.wl-session-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}
.wl-session-name{font-size:15px;font-weight:800}
.wl-session-date{font-size:10px;color:#a0a0b8}
.wl-exercise{background:rgba(255,255,255,.02);border-radius:10px;padding:10px;margin-bottom:8px}
.wl-ex-name{font-size:12px;font-weight:700;margin-bottom:8px;color:#e8e8f0}
.wl-sets-header{display:grid;grid-template-columns:30px 1fr 1fr 1fr 28px;gap:4px;padding:0 4px;margin-bottom:4px}
.wl-sh{font-size:9px;color:#a0a0b8;text-transform:uppercase;letter-spacing:.5px;font-weight:700;text-align:center}
.wl-set-row{display:grid;grid-template-columns:30px 1fr 1fr 1fr 28px;gap:4px;margin-bottom:4px;align-items:center}
.wl-set-num{font-size:11px;color:#a0a0b8;text-align:center;font-weight:700}
.wl-set-inp{background:rgba(255,255,255,.04);border:1px solid #1e1e2a;border-radius:8px;padding:6px 4px;font-size:13px;font-weight:700;color:#e8e8f0;text-align:center;font-family:inherit;width:100%;outline:none}
.wl-set-inp:focus{border-color:#0ea5e9}
.wl-done-btn{width:24px;height:24px;border-radius:50%;border:2px solid #1e1e2a;background:transparent;cursor:pointer;font-size:11px;display:flex;align-items:center;justify-content:center;transition:all .2s;flex-shrink:0}
.wl-done-btn.done{border-color:#0ea5e9;background:#0ea5e9;color:#0a0a0f}
.wl-add-ex-btn{width:100%;padding:9px;border-radius:10px;border:1px dashed #1e1e2a;background:transparent;color:#a0a0b8;font-size:12px;font-weight:600;cursor:pointer;font-family:inherit;margin-top:4px;transition:all .2s}
.wl-add-ex-btn:hover{border-color:#0ea5e9;color:#0ea5e9}
.wl-form{background:rgba(255,255,255,.02);border:1px solid #1e1e2a;border-radius:12px;padding:14px;margin-bottom:12px}
.wl-inp{width:100%;background:rgba(255,255,255,.03);border:2px solid #1e1e2a;border-radius:10px;padding:9px 12px;font-size:13px;color:#e8e8f0;outline:none;font-family:inherit;margin-bottom:8px}
.wl-inp:focus{border-color:#0ea5e9}
.wl-start-btn{width:100%;padding:12px;border-radius:12px;border:none;background:#0ea5e9;color:#0a0a0f;font-size:14px;font-weight:700;cursor:pointer;font-family:inherit}
.wl-empty{font-size:13px;color:#a0a0b8;text-align:center;padding:30px 0}

/* CSS: 1-Rep Max (ORM) Calculator — weight/reps input, result big number, percentage grid */
/* ── 1RM CALCULATOR ── */
.orm-form{background:#111118;border:1px solid #1e1e2a;border-radius:14px;padding:16px;margin-bottom:12px}
.orm-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:10px}
.orm-inp-block label{font-size:9px;color:#a0a0b8;text-transform:uppercase;letter-spacing:1px;font-weight:700;display:block;margin-bottom:5px}
.orm-inp{width:100%;background:rgba(255,255,255,.03);border:2px solid #1e1e2a;border-radius:10px;padding:10px 12px;font-size:18px;font-weight:800;color:#e8e8f0;outline:none;font-family:inherit}
.orm-inp:focus{border-color:#34d399}
.orm-calc-btn{width:100%;padding:12px;border-radius:12px;border:none;background:#34d399;color:#0a0a0f;font-size:14px;font-weight:700;cursor:pointer;font-family:inherit;margin-bottom:12px}
.orm-result{background:rgba(52,211,153,.07);border:1px solid rgba(52,211,153,.25);border-radius:14px;padding:16px;display:none}
.orm-result.show{display:block}
.orm-result-big{font-size:52px;font-weight:900;color:#34d399;line-height:1}
.orm-pct-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-top:14px}
.orm-pct{background:rgba(255,255,255,.03);border-radius:9px;padding:8px;text-align:center;border:1px solid #1e1e2a}
.orm-pct-val{font-size:14px;font-weight:800}
.orm-pct-lbl{font-size:9px;color:#a0a0b8;text-transform:uppercase;margin-top:2px}

/* CSS: Deload Planner — week cards, 7-day grid, timer input, next deload countdown */
/* ── DELOAD PLANNER ── */
.deload-card{background:#111118;border:1px solid #1e1e2a;border-radius:14px;padding:16px;margin-bottom:10px}
.deload-badge{display:inline-block;font-size:9px;font-weight:700;padding:3px 9px;border-radius:20px;margin-bottom:8px;letter-spacing:1px;text-transform:uppercase}
.deload-week-title{font-size:15px;font-weight:800;margin-bottom:4px}
.deload-week-sub{font-size:11px;color:#a0a0b8;margin-bottom:12px;line-height:1.5}
.deload-day-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}
.deload-day{border-radius:8px;padding:8px 4px;text-align:center;border:1px solid #1e1e2a}
.deload-day-name{font-size:8px;color:#a0a0b8;text-transform:uppercase;font-weight:700}
.deload-day-icon{font-size:16px;margin:3px 0}
.deload-day-act{font-size:8px;color:#a0a0b8;line-height:1.3}
.deload-timer{display:flex;gap:8px;align-items:flex-end;margin-bottom:10px}
.deload-timer input{flex:1;margin-bottom:0}
.deload-set-btn{padding:12px 16px;border-radius:12px;border:none;background:#a78bfa;color:#fff;font-size:13px;font-weight:700;cursor:pointer;font-family:inherit;white-space:nowrap}
.deload-next{background:rgba(167,139,250,.08);border:1px solid rgba(167,139,250,.25);border-radius:12px;padding:14px;margin-top:10px;text-align:center}
.deload-next-label{font-size:10px;color:#a0a0b8;text-transform:uppercase;letter-spacing:1px;margin-bottom:4px;font-weight:600}
.deload-next-val{font-size:22px;font-weight:900;color:#a78bfa}

/* CSS: Progress Orbit Dashboard — SVG orbit ring, center % circle, satellite nodes (weight/water/streak etc.) */
/* ── PROGRESS DASHBOARD (smart feature) ── */
/* ── PROGRESS ORBIT DASHBOARD ── */
.pd-orbit-outer{width:100%;display:flex;justify-content:center;align-items:flex-start;overflow:hidden}
.pd-orbit-wrap{position:relative;width:300px;height:300px;flex-shrink:0;transform-origin:top center;--pd-scale:1;transform:scale(var(--pd-scale));font-size:16px;-webkit-text-size-adjust:none;text-size-adjust:none}
.pd-orbit-svg{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none}
.pd-center{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:88px;height:88px;border-radius:50%;background:#111118;border:2px solid #1e1e2a;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;z-index:2}
.pd-center-pct{font-size:24px;font-weight:900;line-height:1}
.pd-center-lbl{font-size:8px;color:#a0a0b8;text-transform:uppercase;letter-spacing:.8px;margin-top:3px;font-weight:700}
.pd-node{position:absolute;transform:translate(-50%,-50%);width:62px;height:62px;border-radius:50%;background:#111118;border:2px solid #1e1e2a;display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;transition:transform .2s;z-index:3;text-align:center;font-size:0;-webkit-text-size-adjust:none;text-size-adjust:none}
.pd-node:hover{transform:translate(-50%,-50%) scale(1.1)}
.pd-node-icon{font-size:16px;line-height:1}
.pd-node-val{font-size:11px;font-weight:900;line-height:1;margin-top:2px}
.pd-node-lbl{font-size:7px;color:#a0a0b8;text-transform:uppercase;letter-spacing:.4px;margin-top:1px;font-weight:700}
.pd-legend{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-top:14px;font-size:16px}
.pd-leg-item{display:flex;align-items:center;gap:5px;font-size:10px;color:#a0a0b8}
.pd-leg-dot{width:7px;height:7px;border-radius:50%;flex-shrink:0}

/* CSS: Progress Graphs — donut, bar chart, radial, heatmap, line chart, mini stats, today column chart */
/* ── ALL PROGRESS GRAPHS ── */
.pg-outer{padding:0 10px;margin-top:14px;display:flex;flex-direction:column;gap:10px}
.pg-card{background:#111118;border:1px solid #1e1e2a;border-radius:16px;padding:16px}
.pg-card-hdr{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:12px}
.pg-title{font-size:12px;font-weight:900}
.pg-badge{font-size:9px;padding:3px 9px;border-radius:20px;background:rgba(0,229,160,.08);border:1px solid rgba(0,229,160,.2);color:#00e5a0;font-weight:700;letter-spacing:.5px}
.pg-sub{font-size:10px;color:#a0a0b8;margin-top:1px}
/* Donut */
.pg-donut-row{display:flex;align-items:center;gap:14px}
.pg-donut-leg{flex:1;display:flex;flex-direction:column;gap:7px}
.pg-donut-item{display:flex;align-items:center;justify-content:space-between}
.pg-donut-label{display:flex;align-items:center;gap:5px;font-size:11px;color:#a0a0b8}
.pg-donut-dot{width:8px;height:8px;border-radius:50%}
.pg-donut-pct{font-size:12px;font-weight:900}
/* Bar chart */
.pg-bar-chart{display:flex;align-items:flex-end;gap:5px;height:80px;margin-bottom:6px}
.pg-bar-col{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px}
.pg-bar-outer{width:100%;flex:1;background:#1e1e2a;border-radius:4px 4px 0 0;position:relative;overflow:hidden;min-height:4px}
.pg-bar-fill{position:absolute;bottom:0;left:0;right:0;border-radius:4px 4px 0 0;transition:height .5s}
.pg-bar-day{font-size:8px;color:#a0a0b8;font-weight:700;text-transform:uppercase}
/* Radials */
.pg-radial-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.pg-radial-item{display:flex;flex-direction:column;align-items:center;gap:3px}
.pg-radial-val{font-size:11px;font-weight:900;text-align:center}
.pg-radial-lbl{font-size:8px;color:#a0a0b8;text-transform:uppercase;letter-spacing:.4px;font-weight:700;text-align:center}
/* Heatmap */
.pg-heat-row{display:flex;gap:5px}
.pg-heat-cell{flex:1;aspect-ratio:1;border-radius:7px;display:flex;align-items:center;justify-content:center}
.pg-heat-labels{display:flex;gap:5px;margin-top:5px}
.pg-heat-lbl{flex:1;font-size:7px;color:#8888a8;font-weight:700;text-transform:uppercase;text-align:center}
/* Line chart */
.pg-line-svg{width:100%;overflow:visible;display:block}
.pg-xaxis{display:flex;justify-content:space-between;margin-top:4px}
.pg-xlbl{font-size:8px;color:#8888a8;font-weight:700;text-transform:uppercase;flex:1;text-align:center}
/* Mini stats */
.pg-mini-row{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.pg-mini-stat{background:rgba(255,255,255,.03);border:1px solid #1e1e2a;border-radius:10px;padding:9px 6px;text-align:center}
.pg-mini-val{font-size:14px;font-weight:900}
.pg-mini-lbl{font-size:8px;color:#a0a0b8;text-transform:uppercase;letter-spacing:.5px;margin-top:2px;font-weight:700}
/* Column chart (today) */
.tcc-legend{display:flex;gap:12px;margin-bottom:12px}
.tcc-leg{display:flex;align-items:center;gap:5px;font-size:10px;color:#9090a0}
.tcc-leg-box{width:10px;height:10px;border-radius:3px}
.tcc-chart{display:flex;align-items:flex-end;gap:8px;height:150px;padding:0 2px;position:relative}
.tcc-col{flex:1;display:flex;flex-direction:column;align-items:center}
.tcc-bars{display:flex;gap:3px;align-items:flex-end;height:130px;width:100%}
.tcc-bar-wrap{flex:1;height:130px;border-radius:6px 6px 0 0;position:relative;overflow:hidden;background:#0d0d16}
.tcc-bar-fill{position:absolute;bottom:0;left:0;right:0;border-radius:6px 6px 0 0;transition:height .6s cubic-bezier(.4,0,.2,1)}
.tcc-bar-pct{position:absolute;top:-16px;left:50%;transform:translateX(-50%);font-size:8px;font-weight:800;white-space:nowrap}
.tcc-emoji{font-size:13px;margin-top:5px}
.tcc-lbl{font-size:8px;color:#a0a0b8;font-weight:700;text-transform:uppercase;letter-spacing:.3px;margin-top:1px}
.tcc-summary{display:grid;grid-template-columns:repeat(5,1fr);gap:4px;margin-top:12px;padding-top:12px;border-top:1px solid #1e1e2a}
.tcc-sum{text-align:center}
.tcc-sum-pct{font-size:13px;font-weight:900}
.tcc-sum-rem{font-size:9px;color:#a0a0b8;margin-top:1px;line-height:1.3}
.tcc-sum-lbl{font-size:7px;color:#8888a8;text-transform:uppercase;letter-spacing:.3px;margin-top:2px;font-weight:700}

/* CSS: Community Tab — tabs, post cards, comments, compose box, leaderboard, challenges, gallery grid, FAB, new post modal */
/* ── COMMUNITY PAGE ── */
.comm-tabs{display:flex;gap:0;border-bottom:2px solid #1e1e2a;margin-bottom:16px;overflow-x:auto;scrollbar-width:none}
.comm-tabs::-webkit-scrollbar{display:none}
.comm-tab{flex-shrink:0;padding:12px 16px;font-size:12px;font-weight:700;color:#a0a0b8;border:none;background:transparent;cursor:pointer;font-family:inherit;border-bottom:2px solid transparent;margin-bottom:-2px;transition:all .2s;white-space:nowrap}
.comm-tab.active{color:#4a9eff;border-bottom-color:#4a9eff}
.comm-tab-content{display:none}.comm-tab-content.active{display:block}
/* Post card */
.post-card{background:#111118;border:1px solid #1e1e2a;border-radius:16px;padding:16px;margin-bottom:12px}
.post-header{display:flex;align-items:center;gap:10px;margin-bottom:12px}
.post-avatar{width:38px;height:38px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:16px;flex-shrink:0;font-weight:700}
.post-meta{flex:1}
.post-name{font-size:13px;font-weight:700}
.post-time{font-size:10px;color:#a0a0b8;margin-top:1px}
.post-badge{font-size:9px;font-weight:700;padding:2px 7px;border-radius:20px;margin-left:6px;vertical-align:middle}
.post-category{font-size:10px;font-weight:700;padding:3px 9px;border-radius:6px;margin-bottom:8px;display:inline-block}
.post-text{font-size:13px;line-height:1.7;color:#c8c8d8;margin-bottom:12px}
.post-img{width:100%;border-radius:12px;margin-bottom:12px;aspect-ratio:16/9;object-fit:cover;background:#1e1e2a;display:flex;align-items:center;justify-content:center;font-size:40px}
.post-actions{display:flex;gap:8px;align-items:center}
.post-btn{display:flex;align-items:center;gap:5px;padding:7px 12px;border-radius:9px;border:1px solid #1e1e2a;background:transparent;color:#a0a0b8;font-size:12px;font-weight:600;cursor:pointer;font-family:inherit;transition:all .2s}
.post-btn.liked{border-color:#ff4d6d44;color:#ff4d6d;background:rgba(255,77,109,.06)}
.post-btn:hover{border-color:#333345;color:#e8e8f0}
.post-btn-share{margin-left:auto}
/* Comments */
.comm-comment{display:flex;gap:10px;padding:10px 0;border-top:1px solid #1e1e2a}
.comm-comment-avatar{width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:12px;flex-shrink:0}
.comm-comment-body{flex:1}
.comm-comment-name{font-size:11px;font-weight:700;margin-bottom:2px}
.comm-comment-text{font-size:12px;color:#9898a8;line-height:1.5}
.comm-comment-time{font-size:10px;color:#a0a0b8;margin-top:3px}
/* Compose */
.comm-compose{background:#111118;border:1px solid #1e1e2a;border-radius:14px;padding:14px;margin-bottom:16px;display:flex;gap:10px;align-items:flex-start}
.comm-compose-avatar{width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,#00e5a0,#4a9eff);display:flex;align-items:center;justify-content:center;font-size:16px;flex-shrink:0}
.comm-compose-input{flex:1;background:rgba(255,255,255,.04);border:1px solid #1e1e2a;border-radius:10px;padding:10px 12px;font-size:13px;color:#e8e8f0;outline:none;font-family:inherit;resize:none;min-height:40px}
.comm-compose-input::placeholder{color:#a0a0b8}
.comm-compose-input:focus{border-color:#4a9eff}
.comm-post-btn{padding:9px 16px;border-radius:10px;border:none;background:#4a9eff;color:#fff;font-size:12px;font-weight:700;cursor:pointer;font-family:inherit;margin-top:4px;width:100%}
/* Leaderboard */
.lb-row{display:flex;align-items:center;gap:12px;padding:13px 16px;background:#111118;border:1px solid #1e1e2a;border-radius:14px;margin-bottom:8px}
.lb-rank{width:28px;text-align:center;font-size:16px;font-weight:900;flex-shrink:0}
.lb-rank.gold{color:#fbbf24}.lb-rank.silver{color:#d1d5db}.lb-rank.bronze{color:#f97316}
.lb-avatar{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:18px;flex-shrink:0}
.lb-info{flex:1}
.lb-name{font-size:13px;font-weight:700}
.lb-stat{font-size:10px;color:#a0a0b8;margin-top:2px}
.lb-pts{font-size:15px;font-weight:900;color:#00e5a0}
/* Challenge */
.challenge-card{border:1px solid #1e1e2a;border-radius:16px;padding:18px;margin-bottom:12px;position:relative;overflow:hidden}
.challenge-label{font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:1.5px;margin-bottom:6px}
.challenge-title{font-size:16px;font-weight:900;margin-bottom:4px}
.challenge-desc{font-size:12px;color:#a0a0b8;line-height:1.6;margin-bottom:14px}
.challenge-prog-bar{height:7px;border-radius:999px;background:#1e1e2a;overflow:hidden;margin-bottom:6px}
.challenge-prog-fill{height:100%;border-radius:999px;transition:width .4s}
.challenge-prog-info{display:flex;justify-content:space-between;font-size:10px;color:#a0a0b8;margin-bottom:12px}
.challenge-join-btn{padding:10px 20px;border-radius:11px;border:none;font-size:13px;font-weight:700;cursor:pointer;font-family:inherit;transition:all .2s}
.challenge-join-btn.joined{background:rgba(0,229,160,.12);color:#00e5a0;border:1px solid rgba(0,229,160,.3)}
.challenge-join-btn.join{background:#00e5a0;color:#0a0a0f}
.challenge-participants{font-size:10px;color:#a0a0b8;margin-top:8px}
/* Gallery */
.gallery-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-bottom:16px}
.gallery-item{aspect-ratio:1;border-radius:10px;background:#111118;border:1px solid #1e1e2a;display:flex;align-items:center;justify-content:center;font-size:28px;cursor:pointer;position:relative;overflow:hidden;transition:transform .2s}
.gallery-item:active{transform:scale(.95)}
.gallery-item-label{position:absolute;bottom:0;left:0;right:0;background:rgba(0,0,0,.7);font-size:9px;font-weight:700;padding:4px 6px;color:#fff;text-align:center}
/* Search bar */
.comm-search{width:100%;background:rgba(255,255,255,.04);border:1px solid #1e1e2a;border-radius:12px;padding:11px 16px;font-size:13px;color:#e8e8f0;outline:none;font-family:inherit;margin-bottom:16px}
.comm-search::placeholder{color:#a0a0b8}
.comm-search:focus{border-color:#4a9eff}
/* Section header */
.comm-sec-head{font-size:10px;color:#a0a0b8;text-transform:uppercase;letter-spacing:2px;font-weight:700;margin:16px 0 10px}
/* Floating action button */
.comm-fab{position:fixed;bottom:24px;right:20px;z-index:300;width:52px;height:52px;border-radius:50%;background:#4a9eff;border:none;color:#fff;font-size:24px;cursor:pointer;box-shadow:0 4px 20px rgba(74,158,255,.4);display:flex;align-items:center;justify-content:center;transition:all .2s}
.comm-fab.open{background:#333345;transform:rotate(45deg)}
.comm-fab-menu{position:fixed;bottom:84px;right:20px;z-index:300;display:flex;flex-direction:column;gap:10px;align-items:flex-end}
.comm-fab-item{display:flex;align-items:center;gap:10px;opacity:0;transform:translateY(10px);transition:all .2s;pointer-events:none}
.comm-fab-item.show{opacity:1;transform:translateY(0);pointer-events:auto}
.comm-fab-item-label{background:#fff;color:#0a0a0f;font-size:13px;font-weight:700;padding:8px 14px;border-radius:20px;box-shadow:0 2px 12px rgba(0,0,0,.3);white-space:nowrap}
.comm-fab-item-icon{width:42px;height:42px;border-radius:50%;background:#fff;display:flex;align-items:center;justify-content:center;font-size:18px;box-shadow:0 2px 12px rgba(0,0,0,.3)}
/* New post modal */
.comm-modal-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.7);z-index:400;align-items:flex-end;justify-content:center}
.comm-modal-overlay.open{display:flex}
.comm-modal{background:#111118;border-radius:24px 24px 0 0;padding:24px 20px;width:100%;max-width:560px;max-height:80vh;overflow-y:auto}
.comm-modal-title{font-size:18px;font-weight:900;margin-bottom:16px;display:flex;justify-content:space-between;align-items:center}
.comm-modal-close{background:transparent;border:none;color:#a0a0b8;font-size:22px;cursor:pointer;font-family:inherit}
.comm-cat-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:14px}
.comm-cat-btn{padding:10px;border-radius:12px;border:1px solid #1e1e2a;background:transparent;color:#a0a0b8;font-size:12px;font-weight:600;cursor:pointer;font-family:inherit;transition:all .2s;text-align:center}
.comm-cat-btn.active{border-color:#4a9eff;color:#4a9eff;background:rgba(74,158,255,.08)}
.comm-modal-inp{width:100%;background:rgba(255,255,255,.04);border:1px solid #1e1e2a;border-radius:12px;padding:12px 14px;font-size:14px;color:#e8e8f0;outline:none;font-family:inherit;resize:none;margin-bottom:10px}
.comm-modal-inp::placeholder{color:#a0a0b8}
.comm-modal-inp:focus{border-color:#4a9eff}
.comm-submit-btn{width:100%;padding:14px;border-radius:14px;border:none;background:#4a9eff;color:#fff;font-size:15px;font-weight:700;cursor:pointer;font-family:inherit}
/* Tags */
.comm-tag{font-size:10px;font-weight:700;padding:3px 9px;border-radius:20px;display:inline-block;margin:2px}
/* Popular tags */
.comm-tags-wrap{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:16px}
/* CSS: Goals Page — section headers, row layout, macro bar segments, pro tag badge */
/* ── GOALS PAGE ── */
.goals-section-header{background:#1a1a24;padding:12px 20px;font-size:12px;font-weight:800;color:#e8e8f0;letter-spacing:.5px;border-top:1px solid #1e1e2a;border-bottom:1px solid #1e1e2a;margin:0 -20px}
.goals-row{display:flex;align-items:center;justify-content:space-between;padding:16px 0;border-bottom:1px solid #1e1e2a}
.goals-row:last-child{border-bottom:none}
.goals-row-label{font-size:14px;color:#e8e8f0}
.goals-row-value{font-size:14px;font-weight:700;color:#00e5a0;text-align:right}
.goals-row-value.blue{color:#4a9eff}
.goals-row-sub{font-size:11px;color:#a0a0b8;margin-top:2px}
.goals-row-right{text-align:right}
.goals-macro-bar{height:8px;border-radius:999px;overflow:hidden;display:flex;gap:2px;margin-top:10px}
.goals-macro-seg{height:100%;border-radius:2px}
.goals-info-row{display:flex;justify-content:space-between;font-size:11px;color:#a0a0b8;margin-top:6px}
.goals-pro-tag{font-size:9px;font-weight:700;padding:2px 8px;border-radius:20px;background:rgba(251,191,36,.15);color:#fbbf24;border:1px solid rgba(251,191,36,.3);margin-left:8px;vertical-align:middle}
/* CSS: More Tab menu — profile card, section labels, menu rows (slide-in animation), upgrade card */
/* ── MORE MENU ── */
.more-menu-wrap{padding:0 20px;padding-bottom:40px}
.more-profile-card{background:#111118;border:1px solid #1e1e2a;border-radius:20px;padding:20px;margin-bottom:24px;display:flex;align-items:center;gap:16px}
.more-avatar{width:56px;height:56px;border-radius:50%;background:linear-gradient(135deg,#00e5a0,#4a9eff);display:flex;align-items:center;justify-content:center;font-size:24px;flex-shrink:0}
.more-profile-name{font-size:18px;font-weight:900}
.more-profile-sub{font-size:12px;color:#a0a0b8;margin-top:3px}
.more-section-label{font-size:10px;color:#a0a0b8;text-transform:uppercase;letter-spacing:2px;font-weight:700;margin:20px 0 10px}
.more-row{display:flex;align-items:center;gap:14px;padding:15px 18px;background:#111118;border:1px solid #1e1e2a;border-radius:16px;cursor:pointer;transition:all .2s;margin-bottom:8px;opacity:0;transform:translateX(-24px)}
.more-row.slide-in{opacity:1;transform:translateX(0);transition:opacity .35s ease,transform .35s ease}
.more-row:active{transform:scale(.98)}
.more-row:hover{border-color:#333345}
.more-row-icon{width:40px;height:40px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:20px;flex-shrink:0}
.more-row-text{flex:1}
.more-row-title{font-size:14px;font-weight:700}
.more-row-sub{font-size:11px;color:#a0a0b8;margin-top:2px}
.more-row-arrow{font-size:13px;color:#8888a8}
.more-upgrade-card{background:linear-gradient(135deg,rgba(0,229,160,.12),rgba(74,158,255,.12));border:1px solid rgba(0,229,160,.25);border-radius:20px;padding:20px;margin-bottom:8px;cursor:pointer;transition:all .2s;opacity:0;transform:translateX(-24px)}
.more-upgrade-card.slide-in{opacity:1;transform:translateX(0);transition:opacity .35s ease,transform .35s ease}
.more-upgrade-title{font-size:16px;font-weight:900;color:#00e5a0;margin-bottom:4px}
.more-upgrade-sub{font-size:12px;color:#a0a0b8;line-height:1.6}
.more-upgrade-btn{display:inline-block;margin-top:12px;padding:8px 20px;border-radius:10px;background:#00e5a0;color:#0a0a0f;font-size:12px;font-weight:800;letter-spacing:.5px}
/* CSS: Convenience Panel buttons (Print/Export etc.) and Light/Dark Theme toggle row */
/* ── CONVENIENCE PANEL ── */
.conv-btn{width:100%;padding:14px 18px;border-radius:14px;border:1px solid #1e1e2a;background:#111118;color:#e8e8f0;font-size:14px;font-weight:700;cursor:pointer;font-family:inherit;display:flex;align-items:center;gap:12px;transition:all .2s;margin-bottom:10px;text-align:left}
.conv-btn:hover{border-color:#00e5a0;color:#00e5a0}
.conv-btn-icon{font-size:20px;flex-shrink:0}
.conv-btn-text{flex:1}
.conv-btn-title{font-size:14px;font-weight:700}
.conv-btn-sub{font-size:11px;color:#a0a0b8;margin-top:2px;font-weight:400}
.theme-toggle-row{display:flex;justify-content:space-between;align-items:center;padding:14px 16px;background:#111118;border:1px solid #1e1e2a;border-radius:14px;margin-bottom:10px;cursor:pointer}
.theme-toggle-switch{width:44px;height:24px;border-radius:12px;background:#1e1e2a;position:relative;transition:background .3s;flex-shrink:0}
.theme-toggle-switch.on{background:#00e5a0}
.theme-toggle-thumb{width:20px;height:20px;border-radius:50%;background:#fff;position:absolute;top:2px;left:2px;transition:left .3s}
.theme-toggle-switch.on .theme-toggle-thumb{left:22px}

/* CSS: Top Navigation Bar — fixed 5-tab nav (Home/Tools/Progress/More/Insight), active bubble highlight, SVG icons on/off states */
/* ── TOP NAV BAR ── */
#plan{padding-top:68px}
.top-nav{position:fixed;top:0;left:0;right:0;z-index:500;background:rgba(10,10,15,0.92);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-bottom:1px solid #1e1e2a;display:flex;align-items:center;justify-content:space-around;height:60px;padding:0 8px;gap:4px}
.tnav-btn{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;background:transparent;border:none;cursor:pointer;padding:6px 2px 5px;border-radius:14px;transition:all .2s;font-family:inherit;position:relative}
.tnav-icon{width:26px;height:26px;display:flex;align-items:center;justify-content:center;position:relative;z-index:1}
.tnav-bubble{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:56px;height:30px;background:transparent;border-radius:20px;z-index:0;transition:background .2s;pointer-events:none}
.tnav-btn.active .tnav-bubble{background:rgba(0,229,160,0.22);box-shadow:0 0 0 1px rgba(0,229,160,0.18)}
.tnav-icon svg{width:22px;height:22px;transition:all .2s;position:relative;z-index:1}
/* inactive: outline */
.tnav-svg-off{stroke:#9090a8;fill:none;display:block}
.tnav-svg-on{display:none}
/* active: filled */
.tnav-btn.active .tnav-svg-off{display:none}
.tnav-btn.active .tnav-svg-on{display:block;fill:#e8e8f0;stroke:#e8e8f0}
/* Tools & Insight active: bold stroke only, no fill */
#tnav-1.active .tnav-svg-on{fill:none;stroke:#e8e8f0}
#tnav-4.active .tnav-svg-on{fill:none;stroke:#e8e8f0}
.tnav-label{font-size:10px;font-weight:600;letter-spacing:.3px;text-transform:uppercase;color:#9090a8;transition:all .2s}
.tnav-btn.active .tnav-label{font-weight:900;color:#e8e8f0}
.tab-page{display:none;background:#0a0a0f;min-height:100vh;padding-bottom:40px;overflow-x:hidden}
.tab-page.active{display:block}

/* CSS: Light Theme — body.light overrides for nav, cards, inputs, text colors, borders */
/* ── LIGHT THEME ── */
body.light{background:#f5f5f7;color:#111118}
body.light .top-nav{background:rgba(245,245,247,0.95);border-color:#e0e0e8}
body.light .tnav-svg-off{stroke:#555;fill:none}
body.light .tnav-btn.active .tnav-svg-on{fill:#111;stroke:#111}
body.light #tnav-1.active .tnav-svg-on{fill:none;stroke:#111}
body.light #tnav-4.active .tnav-svg-on{fill:none;stroke:#111}
body.light .tnav-btn.active .tnav-label{color:#111}
body.light .tab-page{background:#f5f5f7}
body.light #plan{background:#f5f5f7}
body.light .wcard,body.light .cal-card,body.light .mcard,body.light .supp,body.light .rule,
body.light .scard,body.light .wcard2,body.light .ccard,body.light .weighin-card,
body.light .recalc-card,body.light .prep-table,body.light .section-btn,
body.light .subpage,body.light .sp-header,body.light .water-card,body.light .grocery-card,
body.light .sleep-card,body.light .cardio-card,body.light .photo-card,
body.light .wday-weekly-card,body.light .wex-item,body.light .wtype-btn{background:#fff;border-color:#e0e0e8}
body.light .subpage{background:#f5f5f7}
body.light .sp-header{background:#f5f5f7;border-color:#e0e0e8}
body.light input,body.light select{background:rgba(0,0,0,.03);border-color:#e0e0e8;color:#111118}
body.light .goal-tf-card{background:#f0f0f5;border-color:#dcdce8;}
body.light .goal-tf-card input[type=range]{accent-color:#00b87d;}
/* Step 4 - light mode green visibility fix */

/* Light mode: only green slider elements darker, red untouched */
body.light .goal-tf-card #goal-mo-min-label,
body.light .goal-tf-card #goal-mo-max-label{color:#777}
body.light .goal-tf-card b[style*="color:#00e5a0"]{color:#007a52!important}
body.light .goal-cur-wt-box{color:#007a52!important;background:rgba(0,122,82,.07)!important;border-color:rgba(0,122,82,.25)!important}
/* Light mode — goal detected card green text */
body.light #goal-detected [style*="color:#00e5a0"]{color:#007a52!important}
/* Light mode — age group + protein green darker */
body.light .age-grp-val[style*="#00e5a0"]{color:#007a52!important}
body.light .age-grp-val[style*="#26d97f"]{color:#1a7a4a!important}
/* age-grp-btn light mode: only override when green — done via age-grp-val */
/* Light mode — carbs blue + fats orange darker */
body.light .macro-c-lbl{color:#1a5fa8!important}
body.light .macro-c-val-el{color:#1a5fa8!important}
body.light .macro-f-lbl{color:#b85e00!important}
body.light .macro-f-val-el{color:#b85e00!important}
/* Age insight subpage — ONLY green text darker in light mode */
body.light #sp-age-insight-body [style*="color:#00e5a0"]{color:#007a52!important}
body.light #sp-age-insight-body [style*="color:#26d97f"]{color:#1a7a4a!important}
body.light .macro-p-lbl{color:#007a52!important}
body.light .macro-p-val-el{color:#007a52!important}



body.light .step-sub,body.light .hero-sub,body.light .sl,body.light .cal-unit,
body.light .msub,body.light .mf,body.light .mnote,body.light .sdesc,body.light .rt,
body.light .clabel,body.light .meas-label,body.light .meas-unit{color:#888}
body.light .hero-title,body.light .sh-t,body.light .cal-big,body.light .mv,
body.light .step-title{color:#111118}
body.light .mth,body.light .meal-row,body.light .prep-row{border-color:#e0e0e8}
body.light .pbar{background:#e0e0e8}
body.light ::-webkit-scrollbar-thumb{background:#e0e0e8}

/* CSS: Comprehensive Light Mode Fix v2 — nuclear catch-all for white text, dark backgrounds, inline styles */
/* ── COMPREHENSIVE LIGHT MODE FIX v2 ── */
/* All white/near-white text → dark */
body.light{color:#111118}
body.light *{color:inherit}

/* Main text colors that were white (#e8e8f0 etc) → dark */
body.light .hn-headline,
body.light .mname,
body.light .sh-t,
body.light .wc,
body.light .sv,
body.light .wi-weight,
body.light .wi-stat-val,
body.light .rc-result-big,
body.light .swap-title,
body.light .swap-opt-name,
body.light .step-title,
body.light .hero-title,
body.light .cal-big,
body.light .mv,
body.light .macro-slider-pct,
body.light .macro-adj-total-val,
body.light .water-title,
body.light .prep-meal,
body.light .wk-article-body b,
body.light .wk-article-body strong,
body.light .tracker-btn-name,
body.light .dbc-btn-title,
body.light .physio-btn-title,
body.light .btn-back,
body.light .swap-close,
body.light .macro-adj-reset,
body.light .pw-btn,
body.light .hn-load-more,
body.light .wtype-btn,
body.light .choice-title,
body.light .mcal,
body.light .overline,
body.light .tag{color:#111118}

/* Secondary/muted text → medium gray */
body.light .step-sub,
body.light .hero-sub,
body.light .sl,
body.light .cal-unit,
body.light .msub,
body.light .mf,
body.light .mnote,
body.light .sdesc,
body.light .rt,
body.light .clabel,
body.light .meas-label,
body.light .meas-unit,
body.light .xt-desc,
body.light .hn-meta,
body.light .macro-adj-sub,
body.light .macro-slider-grams,
body.light .macro-adj-legend,
body.light .macro-adj-total-label,
body.light .water-unit,
body.light .prep-tip,
body.light .prep-foods,
body.light .wk-section-title,
body.light .li,
body.light .tracker-btn-desc,
body.light .dbc-btn-sub,
body.light .swap-sub,
body.light .swap-opt-foods,
body.light .wi-week,
body.light .wi-stat-label,
body.light .wi-empty,
body.light .rc-note,
body.light .photo-slot-label,
body.light .photo-slot-add,
body.light .photo-note,
body.light .choice-sub,
body.light .mp-label,
body.light .wl,
body.light .wd,
body.light .mch,
body.light .mn,
body.light .inp-label,
body.light .step-label{color:#666}

/* Dark backgrounds → white/light */
body.light .wcard,
body.light .cal-card,
body.light .mcard,
body.light .scard,
body.light .wcard2,
body.light .ccard,
body.light .weighin-card,
body.light .recalc-card,
body.light .water-card,
body.light .sleep-card,
body.light .cardio-card,
body.light .photo-card,
body.light .grocery-card,
body.light .macro-adjuster,
body.light .swap-box,
body.light .wi-entry,
body.light .wi-stat,
body.light .macro-adj-total,
body.light .rc-result,
body.light .wex-item,
body.light .wday-weekly-card{background:#fff;border-color:#e0e0e8}

/* Very dark backgrounds used as section/row backgrounds */
body.light .xt-grid,
body.light .xt-top,
body.light .xt-bottom,
body.light .xt-left,
body.light .xt-right{filter:invert(1) hue-rotate(180deg)}

/* Borders that are dark */
body.light .mth,
body.light .meal-row,
body.light .prep-row,
body.light .mcard,
body.light .wi-entry,
body.light .wi-stat,
body.light .swap-option,
body.light .macro-adj-total,
body.light .photo-slot,
body.light .hn-card{border-color:#e0e0e8}

/* Subpages and modals */
body.light .subpage,
body.light .sp-header{background:#f5f5f7;border-color:#e0e0e8}
body.light .swap-modal{background:rgba(0,0,0,.4)}

/* Prep table rows */
body.light .prep-row.header,
body.light .meal-row.ticked{background:rgba(0,0,0,.02)}

/* Scrollable entry lists */
body.light .wi-entries .wi-entry,
body.light .photo-slot{background:rgba(0,0,0,.02)}

/* Wiki article body */
body.light .wk-article-body{color:#333}

/* Inline style overrides — catch any remaining white text */
body.light [style*="color:#e8e8f0"],
body.light [style*="color: #e8e8f0"],
body.light [style*="color:#c8c8d4"],
body.light [style*="color:#c8c8d8"],
body.light [style*="color: #c8c8d4"],
body.light [style*="color: #c8c8d8"]{color:#222 !important}

/* Background inline styles that are dark */
body.light [style*="background:#111118"],
body.light [style*="background: #111118"],
body.light [style*="background:#0d0d14"],
body.light [style*="background:#0a0a0f"]{background:#fff !important}

/* Borders that are dark inline */
body.light [style*="border-color:#1e1e2a"]{border-color:#e0e0e8 !important}

/* Progress bars bg */
body.light .mp-bar,
body.light input[type=range].macro-range{background:#e0e0e8}

/* Tracker carousel dots */
body.light .tc-dot{background:#ccc}

/* section nav buttons */
body.light .section-btn,
body.light .wtype-btn{background:#fff;border-color:#e0e0e8;color:#111118}
body.light .pw-btn.active{border-color:#00b87d;background:rgba(0,184,125,.1);color:#00b87d}

/* CBC result cards in light mode */
body.light .cbc-result-wrap [style*="color:#c8c8d4"],
body.light .cbc-result-wrap [style*="color:#a0a0b8"]{color:#555 !important}

/* Slider thumb border in light mode */
body.light input[type=range].macro-range::-webkit-slider-thumb{border-color:#f5f5f7}
body.light input[type=range].macro-range::-moz-range-thumb{border-color:#f5f5f7}

/* ── SUBSCRIPTION / UPGRADE SECTION LIGHT MODE ── */
body.light #auth-screen{background:#f5f5f7}
body.light .auth-nf-screen{background:#f5f5f7}
body.light .sub-wrap{background:#f5f5f7}
body.light .sub-subtitle{color:#666}
body.light .plan-card{background:#fff;border-color:#e0e0e8}
body.light .plan-card:hover{border-color:#ccc}
body.light .plan-card.selected{border-color:#00b87d;background:rgba(0,184,125,.05)}
body.light .plan-card.free-plan{background:#f9f9fb}
body.light .plan-name{color:#111118}
body.light .plan-period{color:#888}
body.light .plan-original{color:#aaa}
body.light .plan-feat{color:#555}
body.light .plan-radio{border-color:#ccc}
body.light .plan-popular-tag{background:#00b87d;color:#fff}
body.light .sub-guarantee{color:#888}
body.light .sub-feats-title{color:#888}
body.light .sfi-title{color:#111118}
body.light .sfi-sub{color:#666}
body.light .sub-feat-item{background:#fff;border-color:#e0e0e8}
/* Auth panel inside the flow */
body.light .auth-nf-panel{background:#fff;border-color:#e0e0e8}
body.light .auth-head-title{color:#111118}
body.light .auth-head-sub{color:#666}
body.light .auth-card{background:#f9f9fb;border-color:#e0e0e8}
body.light .auth-field label{color:#555}
body.light .auth-back-row{color:#888}
body.light .wl-card.secondary{background:#fff;border-color:#e0e0e8}
body.light .wl-card-title{color:#111118}
body.light .wl-tagline{color:#888}
body.light .success-panel{background:#fff}
body.light .success-title{color:#111118}
body.light .success-sub{color:#666}
/* Inline dark bg overrides in auth screens */
body.light #auth-screen [style*="background:#111118"],
body.light #auth-screen [style*="background: #111118"],
body.light #auth-screen [style*="background:#0d0d14"],
body.light #auth-screen [style*="background:#0a0a0f"]{background:#fff !important}
body.light #auth-screen [style*="color:#e8e8f0"],
body.light #auth-screen [style*="color: #e8e8f0"],
body.light #auth-screen [style*="color:#c8c8d4"]{color:#111118 !important}
body.light #auth-screen [style*="color:#a0a0b8"],
body.light #auth-screen [style*="color: #5a5a70"]{color:#666 !important}
body.light #auth-screen [style*="color:#8888a8"]{color:#999 !important}
body.light #auth-screen [style*="border-color:#1e1e2a"],
body.light #auth-screen [style*="border: 2px solid #1e1e2a"],
body.light #auth-screen [style*="border:2px solid #1e1e2a"]{border-color:#e0e0e8 !important}
body.light #auth-screen [style*="border:1px solid #1e1e2a"],
body.light #auth-screen [style*="border: 1px solid #1e1e2a"]{border-color:#e0e0e8 !important}

/* Insight sub-tab panels */
.insight-panel{display:none}
.insight-panel.active-panel{display:block}
.insight-coming{text-align:center;padding:60px 20px;color:#e8e8f0}
#insight-subnav::-webkit-scrollbar{display:none}
.isnav-btn{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:8px 2px 6px;background:transparent;border:none;cursor:pointer;font-family:inherit;transition:all .2s;position:relative}
.isnav-bubble{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:56px;height:30px;background:transparent;border-radius:20px;transition:background .2s;pointer-events:none}
.isnav-btn.active .isnav-bubble{background:rgba(0,229,160,0.22);box-shadow:0 0 0 1px rgba(0,229,160,0.18)}
.isnav-icon{width:26px;height:26px;display:flex;align-items:center;justify-content:center;position:relative;z-index:1}
.isnav-icon svg{width:22px;height:22px;stroke:#9090a8;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;transition:all .2s}
.isnav-btn.active .isnav-icon svg{stroke:#e8e8f0;fill:none}
.isnav-label{font-size:10px;font-weight:600;letter-spacing:.3px;text-transform:uppercase;color:#9090a8;transition:all .2s}
.isnav-btn.active .isnav-label{font-weight:900;color:#e8e8f0}
body.light .isnav-icon svg{stroke:#555}
body.light .isnav-label{color:#555}
body.light .isnav-btn.active .isnav-bubble{background:rgba(0,160,110,0.18);box-shadow:0 0 0 1px rgba(0,160,110,0.25)}
body.light .tnav-btn.active .tnav-bubble{background:rgba(0,160,110,0.18);box-shadow:0 0 0 1px rgba(0,160,110,0.25)}
body.light .isnav-btn.active .isnav-icon svg{stroke:#111;fill:none}
body.light .isnav-btn.active .isnav-label{color:#111}

/* Insight light mode */
body.light #insight-subnav{background:rgba(255,255,255,0.96) !important;border-color:#e0e0e8 !important}
body.light .isnav-btn .isnav-label{color:#1a1a2e}
body.light .isnav-btn.active .isnav-icon .bubble{background:rgba(0,184,125,0.15)}
body.light .isnav-btn.active .isnav-label{color:#1a1a2e}
body.light .insight-coming{color:#111118}
body.light .insight-coming [style*="color:#8888a8"]{color:#888 !important}
body.light .age-grp-lbl{color:#111118 !important}

/* Insight tab cards light mode */
body.light #pi-insight [style*="background:linear-gradient(145deg,#111118"]{background:#fff !important;border-color:#e0e0e8 !important;box-shadow:0 4px 20px rgba(0,0,0,.07) !important}
body.light #pi-insight [style*="color:#e8e8f0"]{color:#111118 !important}
body.light #pi-insight [style*="color:#8888a8"]{color:#888 !important}
body.light #pi-insight [style*="color:#a0a0b8"]{color:#666 !important}

/* ══════════════════════════════════════════════════════
   LIGHT MODE — WELCOME SCREEN & QUIZ CARD FIXES
   ══════════════════════════════════════════════════════ */

/* Welcome screen background */
body.light #nf-welcome{background:linear-gradient(160deg,#eafaf4 0%,#f0f8ff 100%)}
body.light .wl-glow{background:radial-gradient(circle,rgba(0,185,125,.13) 0%,transparent 70%)}
body.light .wl-tagline{color:#555}

/* OR separator line in welcome screen */
body.light #nf-welcome [style*="background:#1e1e2a"]{background:#d0d0e0 !important}
body.light #nf-welcome [style*="color:#8888a8"]{color:#888 !important}
body.light #nf-welcome [style*="color:#a0a0b8"]{color:#555 !important}

/* "Explore without account" button */
body.light #nf-welcome [style*="border:1px solid #2a2a3a"],
body.light #nf-welcome [style*="border: 1px solid #2a2a3a"]{border-color:#ccc !important;color:#555 !important}

/* Auth terms links */
body.light .auth-terms a[style*="color:#a0a0b8"]{color:#666 !important}

/* ── FEATURE MAP (landing page) ── */
.fm-wrap{margin-top:28px;padding-top:22px;border-top:1px solid #1e1e2a}
.fm-heading{font-size:14px;font-weight:700;color:#e8e8f0;margin-bottom:6px}
.fm-sub{font-size:11px;color:#5a5a70;margin-bottom:16px;line-height:1.5}
.fm-section{margin-bottom:20px}
.fm-sec-label{display:flex;align-items:center;gap:7px;font-size:10px;font-weight:800;letter-spacing:1.2px;text-transform:uppercase;margin-bottom:8px;padding:7px 10px;border-radius:8px}
.fm-sec-label.myplan {background:rgba(74,158,255,.1);color:#4a9eff}
.fm-sec-label.tools  {background:rgba(255,107,107,.1);color:#ff6b6b}
.fm-sec-label.progress{background:rgba(52,211,153,.1);color:#34d399}
.fm-sec-label.insight{background:rgba(167,139,250,.1);color:#a78bfa}
.fm-sec-label.more   {background:rgba(94,234,212,.1);color:#5eead4}
.fm-chips{display:flex;flex-wrap:wrap;gap:6px}
.fm-chip{font-size:11px;font-weight:600;padding:5px 10px;border-radius:20px;line-height:1.3}
.fm-chip.blue  {background:rgba(74,158,255,.08);color:#7ab8ff;border:1px solid rgba(74,158,255,.2)}
.fm-chip.red   {background:rgba(255,107,107,.08);color:#ff9090;border:1px solid rgba(255,107,107,.2)}
.fm-chip.green {background:rgba(52,211,153,.08);color:#6ee7b7;border:1px solid rgba(52,211,153,.2)}
.fm-chip.indigo{background:rgba(167,139,250,.08);color:#c4b5fd;border:1px solid rgba(167,139,250,.2)}
.fm-chip.teal  {background:rgba(94,234,212,.08);color:#5eead4;border:1px solid rgba(94,234,212,.2)}
.fm-total{display:flex;align-items:center;justify-content:center;gap:10px;margin-top:10px;padding:12px 16px;border-radius:10px;background:rgba(255,255,255,.03);border:1px solid #1e1e2a}
.fm-total-num{font-size:28px;font-weight:900;color:#4a9eff;line-height:1}
.fm-total-lbl{font-size:11px;color:#5a5a70;line-height:1.5}
/* light mode */
body.light .fm-wrap{border-top-color:#e0e0e8}
body.light .fm-heading{color:#111118}
body.light .fm-sub{color:#888}
body.light .fm-chip.blue  {background:rgba(74,158,255,.07);color:#2a7ae4;border-color:rgba(74,158,255,.25)}
body.light .fm-chip.red   {background:rgba(255,107,107,.07);color:#d94040;border-color:rgba(255,107,107,.25)}
body.light .fm-chip.green {background:rgba(0,185,125,.07);color:#009a6a;border-color:rgba(0,185,125,.25)}
body.light .fm-chip.indigo{background:rgba(124,58,237,.07);color:#7c3aed;border-color:rgba(124,58,237,.25)}
body.light .fm-chip.teal  {background:rgba(13,148,136,.07);color:#0d9488;border-color:rgba(13,148,136,.25)}
body.light .fm-sec-label.myplan {background:rgba(74,158,255,.08);color:#1d6fd1}
body.light .fm-sec-label.tools  {background:rgba(255,107,107,.08);color:#c0392b}
body.light .fm-sec-label.progress{background:rgba(0,185,125,.08);color:#007a56}
body.light .fm-sec-label.insight{background:rgba(124,58,237,.08);color:#6d28d9}
body.light .fm-sec-label.more   {background:rgba(13,148,136,.08);color:#0f766e}
body.light .fm-total{background:#f5f5f7;border-color:#e0e0e8}
body.light .fm-total-num{color:#1d6fd1}
body.light .fm-total-lbl{color:#888}

/* Quiz card (wcard) — white bg with proper shadow */
body.light .wcard{background:#fff !important;border-color:#e0e0e8 !important;box-shadow:0 8px 32px rgba(0,0,0,.08) !important}

/* Quiz step separator line inside wcard */
body.light .wcard [style*="background:#1e1e2a"],
body.light .wcard [style*="border-top:1px solid #1e1e2a"],
body.light .sec-divider{border-color:#e0e0e8 !important;background:#e0e0e8 !important}

/* Activity items in quiz */
body.light .act-item{background:#f8f8fb;border-color:#e0e0e8}
body.light .act-item.sg{background:rgba(0,184,125,.06);border-color:#00b87d}
body.light .act-item-title{color:#111118}
body.light .act-item-sub{color:#888}
body.light .act-item-badge{color:#aaa}
body.light .act-item.sg .act-item-badge{color:#00b87d}

/* Choice cards in quiz */
body.light .choice{background:#f8f8fb;border-color:#e0e0e8}
body.light .choice.sg{background:rgba(0,184,125,.06);border-color:#00b87d}
body.light .choice.so{background:rgba(255,100,60,.05);border-color:#ff6b35}
body.light .choice-sub{color:#888}

/* Continue btn — green gradient when active */
body.light .btn{color:#0a0a0f}
body.light .btn:disabled{background:#ffffff !important;color:#00a86b !important;border:1.5px solid rgba(0,184,125,0.45) !important;box-shadow:0 0 16px rgba(0,184,125,0.14),0 4px 12px rgba(0,0,0,0.07) !important;transform:translateY(-2px) !important;font-weight:800 !important}

/* Back button in quiz */
body.light .btn-back{border-color:#d8d8e0 !important;color:#888 !important;background:#f0f0f4 !important}

/* Input fields in quiz */
body.light .wcard input,body.light .wcard select{background:#f5f5f7;border-color:#e0e0e8;color:#111118}

/* Logout/switch account buttons inside quiz */
body.light .wcard [style*="border:1px solid rgba(255,77,109"]{background:rgba(255,77,109,.04) !important}
body.light .wcard [style*="border:1px solid #1e1e2a"]{border-color:#e0e0e8 !important;color:#666 !important}

/* Barcode modal fallback panel dark mode fix */
body.light #bc-fallback,
body.light #bc-upload-hint,
body.light #bc-result{background:#fff !important;border-color:#e0e0e8 !important}

/* ══════════════════════════════════════════════════════
   LIGHT MODE — FULL DARK→LIGHT BACKGROUND FIX
   Every class that had background:#111118 or #0d0d14
   ══════════════════════════════════════════════════════ */

/* ── NUCLEAR APPROACH: All dark backgrounds → white ── */
/* This catches EVERY card/panel/button with dark bg */
body.light .conv-btn,
body.light .sync-btn,
body.light .sync-cloud-card,
body.light .sync-confirm-box,
body.light .sync-last-backup,
body.light .more-row,
body.light .more-profile-card,
body.light .section-btn,
body.light .supp,
body.light .rule,
body.light .supp-rem-card,
body.light .wday-selector,
body.light .wday-weekly-card,
body.light .bfc-card,
body.light .pg-card,
body.light .post-card,
body.light .comm-compose,
body.light .lb-row,
body.light .gallery-item,
body.light .macro-calc-form,
body.light .meal-builder-form,
body.light .custom-meal-entry,
body.light .wl-session,
body.light .orm-form,
body.light .deload-card,
body.light .dbc-macro-chart,
body.light .dbc-micro-card,
body.light .med-report-card,
body.light .physio-result-card,
body.light .physio-nutrient-item,
body.light .streak-stat,
body.light .wex-item,
body.light .wtype-btn,
body.light .theme-toggle-row,
body.light .swap-option,
body.light .help-btn,
body.light .help-faq-wrap,
body.light .help-form-wrap,
body.light .help-video-card,
body.light .priv-nav-btn,
body.light .priv-doc-card,
body.light .priv-data-card,
body.light .cheat-entry,
body.light .goals-section-header{background:#fff;border-color:#e0e0e8}

/* Goals section header slightly tinted */
body.light .goals-section-header{background:#f0f0f6;color:#111118}

/* ── Tracker cards: light mode pastel backgrounds (like Body & Food Tools cards) ── */
body.light .tracker-btn{box-shadow:0 2px 12px rgba(0,0,0,0.10)!important;border-width:1.5px!important}
/* Water – blue pastel lighter */
body.light .tracker-btn[style*="#4a9eff"]{background:#deeeff!important;border-color:#4a9eff55!important}
/* Grocery – orange pastel lighter */
body.light .tracker-btn[style*="#ff9f35"]{background:#ffefd4!important;border-color:#ff9f3555!important}
/* Sleep – purple pastel lighter */
body.light .tracker-btn[style*="#a78bfa"]{background:#ede8ff!important;border-color:#a78bfa55!important}
/* Cardio – green pastel lighter */
body.light .tracker-btn[style*="#34d399"]{background:#d8f7ed!important;border-color:#34d39955!important}
/* IF Timer – pink pastel lighter */
body.light .tracker-btn[style*="#f472b6"]{background:#fde0f1!important;border-color:#f472b655!important}
/* Progress Photos – teal pastel lighter */
body.light .tracker-btn[style*="#00e5a0"]{background:#d4f7ed!important;border-color:#00e5a055!important}
/* tracker-btn-desc light mode readable */
body.light .tracker-btn-desc{color:#666!important}


/* ── Text colors in all those cards ── */
body.light .conv-btn,
body.light .conv-btn-title,
body.light .sync-btn,
body.light .sync-btn-title,
body.light .sync-cloud-title,
body.light .help-btn,
body.light .help-btn-title,
body.light .help-faq-q,
body.light .help-form-title,
body.light .help-video-title,
body.light .priv-nav-btn,
body.light .priv-nav-label,
body.light .priv-doc-body h4,
body.light .priv-doc-body strong,
body.light .priv-data-title,
body.light .goals-row-label,
body.light .more-row-title,
body.light .more-profile-name,
body.light .tracker-btn-name,
body.light .streak-stat-val,
body.light .physio-disease-name,
body.light .sp-title,
body.light .sp-back,
body.light .streak-big,
body.light .cheat-m-val,
body.light .dbc-btn-title{color:#111118}
body.light .section-btn-name{color:#111118 !important}
body.light .ws-title{fill:#111118 !important}
body.light .ws-desc{fill:#555 !important}
body.light .ws-badge-pink{fill:#e879f922 !important;stroke:#c026d3 !important}
body.light .ws-badge-orange{fill:#ff9f3522 !important;stroke:#ea580c !important}
body.light .ws-badge-green{fill:#00e5a022 !important;stroke:#059669 !important}
body.light .ws-badge-blue{fill:#38bdf822 !important;stroke:#0284c7 !important}
body.light .ws-badge-yellow{fill:#facc1522 !important;stroke:#ca8a04 !important}
body.light .ws-badge-violet{fill:#a78bfa22 !important;stroke:#7c3aed !important}
body.light .ws-badge-text-pink{fill:#c026d3 !important}
body.light .ws-badge-text-orange{fill:#ea580c !important}
body.light .ws-badge-text-green{fill:#059669 !important}
body.light .ws-badge-text-blue{fill:#0284c7 !important}
body.light .ws-badge-text-yellow{fill:#ca8a04 !important}
body.light .ws-badge-text-violet{fill:#7c3aed !important}

body.light .conv-btn-sub,
body.light .sync-btn-sub,
body.light .sync-cloud-status,
body.light .sync-last-backup-label,
body.light .sync-section-label,
body.light .help-btn-sub,
body.light .help-btn-arrow,
body.light .help-section-label,
body.light .help-faq-chevron,
body.light .help-faq-a,
body.light .help-form-sub,
body.light .help-video-sub,
body.light .priv-doc-body,
body.light .priv-doc-date,
body.light .priv-data-sub,
body.light .priv-section-label,
body.light .goals-info-row,
body.light .goals-row-sub,
body.light .section-btn-desc,
body.light .tracker-btn-desc,
body.light .more-profile-sub,
body.light .more-section-label,
body.light .streak-sub,
body.light .streak-stat-lbl,
body.light .physio-machines-label,
body.light .physio-nutrient-label,
body.light .physio-nutrient-note,
body.light .cheat-m-lbl,
body.light .dbc-btn-sub{color:#777}

/* ── Search inputs ── */
body.light .help-input,
body.light .help-select,
body.light .help-textarea,
body.light .physio-search-input,
body.light .dbc-search,
body.light .sync-input,
body.light .cheat-inp,
body.light input[type=text],
body.light input[type=email],
body.light input[type=password],
body.light input[type=search],
body.light textarea{background:rgba(0,0,0,.04);border-color:#d0d0dc;color:#111118}

body.light .help-input::placeholder,
body.light .help-textarea::placeholder,
body.light .physio-search-input::placeholder,
body.light .dbc-search::placeholder,
body.light .sync-input::placeholder,
body.light .cheat-inp::placeholder,
body.light input::placeholder,
body.light textarea::placeholder{color:#aaa}

body.light .help-select option,
body.light select option{background:#fff;color:#111118}

/* ── Filter/category pills ── */
body.light .physio-category-tag,
body.light .med-cat-tag,
body.light .wk-topic-pill,
body.light .dbc-disease-btn{background:#f0f0f5;border-color:#d0d0dc;color:#444}

body.light .physio-category-tag.active{background:rgba(56,189,248,.12);border-color:rgba(56,189,248,.4);color:#0097c7}
body.light .med-cat-tag.active{background:rgba(0,200,130,.1);border-color:rgba(0,200,130,.4);color:#009965}
body.light .dbc-disease-btn.selected{border-color:#e879f9;background:rgba(232,121,249,.1);color:#c026d3}
body.light .wk-topic-pill.active{background:rgba(0,200,130,.1);border-color:rgba(0,200,130,.4);color:#009965}

/* ── Supplement card text ── */
body.light .supp .sv,
body.light .supp .sh-t{color:#111118}

/* ── Subpages ── */
body.light .subpage{background:#f5f5f7}
body.light .sp-header{background:#f5f5f7;border-color:#e0e0e8}
body.light .sp-back{border-color:#d0d0dc;color:#333}
body.light .more-row:hover{border-color:#c0c0cc}

/* ── Progress ring centers ── */
body.light .pd-center,
body.light .pd-node{background:#fff;border-color:#d0d0dc}
body.light .rw-center-circle{background:#fff}

/* ── Streak ── */
body.light .streak-day{border-color:#d0d0dc}
body.light .supp-check-btn{border-color:#d0d0dc;color:#777;background:#f8f8fc}
body.light .supp-check-btn.taken{border-color:#00b87d;background:rgba(0,184,125,.1);color:#009965}

/* ── Modals ── */
body.light .comm-modal,
body.light .med-detail-sheet,
body.light .machine-modal{background:#fff}

/* ── Wiki ── */
body.light .wk-article-body{color:#333}
body.light .wk-read-more{background:rgba(150,100,200,.08);border-color:rgba(150,100,200,.25);color:#8b5cf6}

/* ── Privacy nav buttons ── */
body.light .priv-nav-btn.active{border-color:#f472b6;background:rgba(244,114,182,.08)}
body.light .priv-nav-btn:hover{border-color:#f472b6;background:rgba(244,114,182,.04)}

/* ── DBC macro bar background ── */
body.light .dbc-macro-bar-bg{background:#e8e8f0}
body.light .dbc-micro-item{background:rgba(0,0,0,.03);border-color:#e0e0e8}

/* ── Cheat meal ── */
body.light .cheat-m{background:rgba(0,0,0,.03)}

/* ── Physio nutrient ── */
body.light .physio-nutrient-val{color:#111118}

/* ── Grocery ── */
body.light .grocery-card{background:#fff;border-color:#e0e0e8}

/* ── Deload/session card text ── */
body.light .wl-session,
body.light .deload-card,
body.light .orm-form{color:#111118}

/* ── INLINE STYLE OVERRIDES (nuclear catch-all) ── */
/* Dark backgrounds in inline styles */
body.light [style*="background:#111118"]{background:#fff !important}
body.light [style*="background: #111118"]{background:#fff !important}
body.light [style*="background:#0d0d14"]{background:#f5f5f7 !important}
body.light [style*="background:#0a0a0f"]{background:#f5f5f7 !important}
body.light [style*="background:#1a1a24"]{background:#f0f0f5 !important}
body.light [style*="background:#12121"]{background:#fff !important}
body.light [style*="background:#13131"]{background:#fff !important}
body.light [style*="background:#14141"]{background:#fff !important}

/* Transparent overlay cards used as wrappers */
body.light [style*="background:rgba(255,255,255,.02)"],
body.light [style*="background:rgba(255,255,255,.03)"],
body.light [style*="background:rgba(255,255,255,.04)"],
body.light [style*="background: rgba(255,255,255,.02)"],
body.light [style*="background: rgba(255,255,255,.03)"],
body.light [style*="background: rgba(255,255,255,.04)"]{background:rgba(0,0,0,.03) !important}

/* White text inline → dark */
body.light [style*="color:#e8e8f0"],
body.light [style*="color: #e8e8f0"],
body.light [style*="color:#c8c8d4"],
body.light [style*="color:#c8c8d8"],
body.light [style*="color: #c8c8d4"],
body.light [style*="color: #c8c8d8"]{color:#222 !important}

/* Near-white gray text → readable dark gray */
body.light [style*="color:#9a9ab0"]{color:#555 !important}
body.light [style*="color:#8888a0"]{color:#555 !important}

/* Dark borders inline */
body.light [style*="border-color:#1e1e2a"],
body.light [style*="border:1px solid #1e1e2a"],
body.light [style*="border: 1px solid #1e1e2a"]{border-color:#e0e0e8 !important}

/* ── Misc bar/track backgrounds ── */
body.light .mp-bar,
body.light input[type=range].macro-range{background:#e0e0e8}
body.light .tc-dot{background:#ccc}
body.light .tc-dot.active{background:#00b87d}

/* ── Nav buttons ── */
body.light .section-btn,
body.light .wtype-btn{background:#fff;border-color:#e0e0e8;color:#111118}
body.light .pw-btn{background:#fff;border-color:#d0d0dc;color:#555}
body.light .pw-btn.active{border-color:#00b87d;background:rgba(0,184,125,.1);color:#009965}
body.light .hn-load-more{border-color:#d0d0dc;color:#777}

/* ── Slider thumbs ── */
body.light input[type=range].macro-range::-webkit-slider-thumb{border-color:#f5f5f7}
body.light input[type=range].macro-range::-moz-range-thumb{border-color:#f5f5f7}

/* ── select option ── */
body.light select option{background:#fff;color:#111118}

/* ── Auth / Settings / Goals cards ── */
body.light .auth-card,
body.light .settings-row,
body.light .settings-value-badge{background:#fff;border-color:#e0e0e8}

body.light .settings-row-title{color:#111118}
body.light .settings-row-sub{color:#777}
body.light .settings-section-label{color:#888}
body.light .settings-toggle{background:#d0d0dc}
body.light .settings-toggle.on{background:#00b87d}
body.light .settings-select{background:#f0f0f5;border-color:#d0d0dc;color:#111118}body.light .settings-edit-inp{background:#f0f0f5;border-color:#d0d0dc;color:#111118}
body.light .settings-value-badge{color:#555;border-color:#d0d0dc}

body.light .goals-row{border-color:#e0e0e8}
body.light .goals-row-label{color:#111118}
body.light .goals-section-header{background:#f0f0f6;color:#111118;border-color:#e0e0e8}

/* ── XT Grid (Meal Tools triangle grid) ── */
body.light .xt-grid{background:#e8e8f0}
body.light .xt-top{background:linear-gradient(160deg,#fce4ec,#f8bbd0) !important}
body.light .xt-bottom{background:linear-gradient(200deg,#e8f5e9,#c8e6c9) !important}
body.light .xt-left{background:linear-gradient(110deg,#e3f2fd,#bbdefb) !important}
body.light .xt-right{background:linear-gradient(250deg,#fff8e1,#ffe0b2) !important}
body.light .xt-name{color:#111118 !important}
body.light .xt-desc{color:#555 !important}

/* ── CBC result wrapper ── */
body.light .cbc-result-wrap [style*="color:#c8c8d4"],
body.light .cbc-result-wrap [style*="color:#a0a0b8"]{color:#555 !important}

/* ── PRO LOCK OVERLAY (light mode) ── */
body.light .pro-lock-badge{background:rgba(245,245,247,.88);backdrop-filter:blur(3px)}
body.light .plb-title{color:#111118}
body.light .plb-sub{color:#666}
body.light .plb-icon{color:#111118}

/* ── MORE TAB — Upgrade card ── */
body.light .more-upgrade-card{background:linear-gradient(135deg,rgba(0,184,125,.1),rgba(74,158,255,.1));border-color:rgba(0,184,125,.3)}
body.light .more-upgrade-title{color:#009965}
body.light .more-upgrade-sub{color:#555}

/* ── PROFILE EDIT ── */
body.light .profile-edit-card{background:#fff;border-color:#e0e0e8}
body.light .profile-edit-name{color:#009965}
body.light .profile-edit-email{color:#777}
body.light .profile-inp-label{color:#888}
body.light .profile-inp{background:rgba(0,0,0,.03);border-color:#d0d0dc;color:#111118}
body.light .profile-inp:focus{border-color:#00b87d}

/* ── AUTH TOAST ── */
body.light .auth-toast{background:#fff;border-color:#d0d0dc;color:#333}
body.light .auth-toast.green{border-color:rgba(0,184,125,.4);color:#009965}

/* ── AUTH USER GREETING ── */
body.light .auth-user-greeting{background:rgba(0,184,125,.06);border-color:rgba(0,184,125,.2)}
body.light .auth-user-name{color:#009965}
body.light .auth-user-email{color:#777}

/* ── Top nav ── */
body.light .top-nav{background:rgba(245,245,247,0.97);border-color:#e0e0e8}

/* CSS: Tracker Dashboard Carousel — horizontal scroll snap, dots, tracker button cards (Water/Grocery/Sleep/Cardio/IF/Photos) */
/* ── TRACKER DASHBOARD CAROUSEL ── */
.tracker-carousel-wrap{position:relative;margin:0 -20px}
.tracker-carousel{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;padding:8px 20px 12px;scrollbar-width:none}
.tracker-carousel::-webkit-scrollbar{display:none}
.tracker-carousel-dots{display:flex;justify-content:center;gap:6px;margin-top:4px;padding-bottom:4px}
.tc-dot{width:6px;height:6px;border-radius:50%;background:#1e1e2a;transition:all .3s;cursor:pointer}
.tc-dot.active{background:#00e5a0;width:18px;border-radius:3px}
.tracker-btn{
  border-radius:18px;
  padding:18px 14px;
  cursor:pointer;
  text-align:center;
  transition:all .25s;
  position:relative;
  overflow:hidden;
  flex-shrink:0;
  width:150px;
  height:150px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  scroll-snap-align:start;
  box-shadow:0 4px 18px rgba(0,0,0,0.35);
  color:#e8e8f0;
}
.tracker-btn::before,.tracker-btn::after{display:none!important}
.tracker-btn:active{transform:scale(.96)}
.tracker-btn-icon{font-size:30px;margin-bottom:8px;visibility:visible!important;display:block!important}
.tracker-btn-name{font-size:13px;font-weight:800;letter-spacing:.3px}
.tracker-btn-desc{font-size:10px;color:#a8a8c0;margin-top:3px;line-height:1.4}
.tracker-btn-badge{position:absolute;top:10px;right:10px;font-size:9px;font-weight:700;padding:2px 7px;border-radius:20px}
body.light .tracker-btn-desc{color:#666!important}

/* CSS: Sub-Page Panels — fixed overlay (.subpage), sticky header (.sp-header), back button, title, body padding */
/* ── SUB-PAGE PANELS ── */
.subpage{display:none;position:fixed;top:60px;left:0;right:0;bottom:0;z-index:200;background:#0a0a0f;overflow-y:auto;overscroll-behavior:contain;animation:spIn .22s ease}
.subpage.open{display:block}
@keyframes spIn{from{opacity:0}to{opacity:1}}
@keyframes spIn{from{opacity:0}to{opacity:1}}
to{transform:translateY(0);opacity:1}}
.sp-header{position:sticky;top:0;z-index:10;background:#0a0a0f;border-bottom:1px solid #1e1e2a;padding:16px 20px;display:flex;align-items:center;gap:14px}
.sp-back{width:36px;height:36px;border-radius:50%;border:1px solid #1e1e2a;background:transparent;color:#e8e8f0;font-size:18px;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-family:inherit}
.sp-back:hover{border-color:#00e5a0;color:#00e5a0}
.sp-title{font-size:18px;font-weight:900}
.sp-tag{font-size:9px;font-weight:700;padding:3px 9px;border-radius:6px;letter-spacing:1px;margin-left:auto;white-space:nowrap}
.sp-body{padding:20px;max-width:560px;margin:0 auto;padding-bottom:60px}
body.large-font .sp-back{width:32px;height:32px;font-size:15px}
body.large-font .sp-title{font-size:16px}

/* CSS: Sync & Backup subpage — hero card, section labels, action buttons, cloud card, input, status cards, delete confirm overlay */
/* ── SYNC & BACKUP ── */
.sync-hero{background:linear-gradient(135deg,#a78bfa18,#7c3aed10);border:1px solid #a78bfa33;border-radius:18px;padding:24px;text-align:center;margin-bottom:20px}
.sync-hero-icon{font-size:44px;margin-bottom:10px}
.sync-hero-title{font-size:20px;font-weight:900;margin-bottom:6px}
.sync-hero-sub{font-size:12px;color:#a0a0b8;line-height:1.7}
.sync-section-label{font-size:10px;color:#a0a0b8;text-transform:uppercase;letter-spacing:2px;font-weight:700;margin:20px 0 10px}
.sync-btn{width:100%;display:flex;align-items:center;gap:14px;background:#111118;border:1px solid #1e1e2a;border-radius:14px;padding:16px 18px;cursor:pointer;font-family:inherit;color:#e8e8f0;transition:all .2s;margin-bottom:10px;text-align:left}
.sync-btn:hover{border-color:#a78bfa;background:rgba(167,139,250,.06)}
.sync-btn:active{transform:scale(.98)}
.sync-btn-icon{font-size:24px;width:42px;height:42px;border-radius:12px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.sync-btn-text{flex:1}
.sync-btn-title{font-size:14px;font-weight:800;margin-bottom:2px}
.sync-btn-sub{font-size:11px;color:#a0a0b8;line-height:1.4}
.sync-btn-arrow{font-size:18px;color:#a0a0b8}
.sync-btn.danger{border-color:#ff4d6d33}
.sync-btn.danger:hover{border-color:#ff4d6d;background:rgba(255,77,109,.06)}
.sync-cloud-card{background:#111118;border:1px solid #1e1e2a;border-radius:16px;padding:20px;margin-bottom:10px}
.sync-cloud-header{display:flex;align-items:center;gap:12px;margin-bottom:16px}
.sync-cloud-icon{font-size:28px;width:48px;height:48px;background:rgba(74,158,255,.1);border-radius:14px;display:flex;align-items:center;justify-content:center}
.sync-cloud-info{flex:1}
.sync-cloud-title{font-size:15px;font-weight:800}
.sync-cloud-status{font-size:11px;margin-top:2px}
.sync-input{width:100%;background:rgba(255,255,255,.03);border:2px solid #1e1e2a;border-radius:12px;padding:12px 16px;font-size:14px;color:#e8e8f0;outline:none;font-family:inherit;margin-bottom:10px;transition:border-color .2s}
.sync-input:focus{border-color:#a78bfa}
.sync-input::placeholder{color:#a0a0b8}
.sync-primary-btn{width:100%;padding:13px;border-radius:12px;border:none;background:#a78bfa;color:#0a0a0f;font-size:14px;font-weight:800;cursor:pointer;font-family:inherit;letter-spacing:.3px;transition:all .2s}
.sync-primary-btn:hover{background:#c4b5fd;transform:translateY(-1px)}
.sync-primary-btn:disabled{background:#2a2a2a;color:#a0a0b8;cursor:not-allowed;transform:none}
.sync-status-card{border-radius:12px;padding:12px 16px;font-size:12px;font-weight:600;line-height:1.6;margin-top:10px;display:none}
.sync-status-card.success{background:rgba(0,229,160,.08);border:1px solid rgba(0,229,160,.25);color:#00e5a0;display:block}
.sync-status-card.error{background:rgba(255,77,109,.08);border:1px solid rgba(255,77,109,.25);color:#ff4d6d;display:block}
.sync-status-card.info{background:rgba(74,158,255,.08);border:1px solid rgba(74,158,255,.25);color:#4a9eff;display:block}
.sync-divider{height:1px;background:#1e1e2a;margin:6px 0 16px}
.sync-last-backup{display:flex;justify-content:space-between;align-items:center;padding:10px 14px;background:rgba(255,255,255,.02);border:1px solid #1e1e2a;border-radius:10px;margin-bottom:10px}
.sync-last-backup-label{font-size:11px;color:#a0a0b8}
.sync-last-backup-val{font-size:12px;font-weight:700;color:#a78bfa}
.sync-spinner{display:inline-block;width:14px;height:14px;border:2px solid rgba(10,10,15,.3);border-top-color:#0a0a0f;border-radius:50%;animation:spin .7s linear infinite;vertical-align:middle;margin-right:6px}
@keyframes spin{to{transform:rotate(360deg)}}
.sync-confirm-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.7);z-index:999;align-items:center;justify-content:center}
.sync-confirm-overlay.open{display:flex}
.sync-confirm-box{background:#111118;border:1px solid #ff4d6d44;border-radius:20px;padding:28px 24px;max-width:320px;width:90%;text-align:center}
.sync-confirm-icon{font-size:40px;margin-bottom:12px}
.sync-confirm-title{font-size:18px;font-weight:900;margin-bottom:8px}
.sync-confirm-sub{font-size:12px;color:#a0a0b8;line-height:1.7;margin-bottom:20px}
.sync-confirm-btns{display:flex;gap:10px}
.sync-confirm-cancel{flex:1;padding:12px;border-radius:12px;border:1px solid #1e1e2a;background:transparent;color:#a0a0b8;font-size:14px;font-weight:700;cursor:pointer;font-family:inherit}
.sync-confirm-delete{flex:1;padding:12px;border-radius:12px;border:none;background:#ff4d6d;color:#fff;font-size:14px;font-weight:700;cursor:pointer;font-family:inherit}

/* CSS: Help & Support subpage — hero, action buttons, FAQ accordion, contact form, video cards, status messages */
/* ── HELP & SUPPORT ── */
.help-hero{background:linear-gradient(135deg,#34d39918,#00e5a010);border:1px solid #34d39933;border-radius:18px;padding:22px;text-align:center;margin-bottom:20px}
.help-hero-icon{font-size:42px;margin-bottom:8px}
.help-hero-title{font-size:19px;font-weight:900;margin-bottom:5px}
.help-hero-sub{font-size:12px;color:#a0a0b8;line-height:1.7}
.help-section-label{font-size:10px;color:#a0a0b8;text-transform:uppercase;letter-spacing:2px;font-weight:700;margin:18px 0 10px}
.help-btn{width:100%;display:flex;align-items:center;gap:14px;background:#111118;border:1px solid #1e1e2a;border-radius:14px;padding:15px 18px;cursor:pointer;font-family:inherit;color:#e8e8f0;transition:all .2s;margin-bottom:10px;text-align:left;text-decoration:none}
.help-btn:hover{border-color:#34d399;background:rgba(52,211,153,.06);transform:translateX(2px)}
.help-btn:active{transform:scale(.98)}
.help-btn-icon{font-size:22px;width:42px;height:42px;border-radius:12px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.help-btn-text{flex:1}
.help-btn-title{font-size:14px;font-weight:800;margin-bottom:2px}
.help-btn-sub{font-size:11px;color:#a0a0b8;line-height:1.4}
.help-btn-arrow{font-size:18px;color:#a0a0b8}
.help-faq-wrap{background:#111118;border:1px solid #1e1e2a;border-radius:16px;overflow:hidden;margin-bottom:10px}
.help-faq-item{border-bottom:1px solid #1e1e2a}
.help-faq-item:last-child{border-bottom:none}
.help-faq-q{width:100%;display:flex;align-items:center;justify-content:space-between;padding:16px 18px;background:transparent;border:none;color:#e8e8f0;font-family:inherit;font-size:13px;font-weight:700;cursor:pointer;text-align:left;gap:10px}
.help-faq-q:hover{background:rgba(255,255,255,.02)}
.help-faq-chevron{font-size:12px;color:#a0a0b8;transition:transform .2s;flex-shrink:0}
.help-faq-chevron.open{transform:rotate(180deg)}
.help-faq-a{display:none;padding:0 18px 16px;font-size:12px;color:#a0a0b8;line-height:1.8}
.help-faq-a.open{display:block}
.help-form-wrap{background:#111118;border:1px solid #1e1e2a;border-radius:16px;padding:18px;margin-bottom:10px}
.help-form-title{font-size:13px;font-weight:800;margin-bottom:4px}
.help-form-sub{font-size:11px;color:#a0a0b8;margin-bottom:14px;line-height:1.6}
.help-input{width:100%;background:rgba(255,255,255,.03);border:2px solid #1e1e2a;border-radius:12px;padding:11px 15px;font-size:13px;color:#e8e8f0;outline:none;font-family:inherit;margin-bottom:10px;transition:border-color .2s}
.help-input:focus{border-color:#34d399}
.help-input::placeholder{color:#a0a0b8}
.help-textarea{height:100px;resize:none;line-height:1.6}
.help-select{cursor:pointer;appearance:none;background:rgba(255,255,255,.03);border:2px solid #1e1e2a;border-radius:12px;padding:11px 15px;font-size:13px;color:#e8e8f0;outline:none;font-family:inherit;margin-bottom:10px;width:100%;transition:border-color .2s}
.help-select:focus{border-color:#34d399}
.help-select option{background:#111118}
.help-submit-btn{width:100%;padding:13px;border-radius:12px;border:none;background:#34d399;color:#0a0a0f;font-size:14px;font-weight:800;cursor:pointer;font-family:inherit;letter-spacing:.3px;transition:all .2s}
.help-submit-btn:hover{background:#6ee7b7;transform:translateY(-1px)}
.help-submit-btn:disabled{background:#2a2a2a;color:#a0a0b8;cursor:not-allowed;transform:none}
.help-status{border-radius:12px;padding:12px 16px;font-size:12px;font-weight:600;line-height:1.6;margin-top:10px;display:none}
.help-status.success{background:rgba(52,211,153,.08);border:1px solid rgba(52,211,153,.3);color:#34d399;display:block}
.help-status.error{background:rgba(255,77,109,.08);border:1px solid rgba(255,77,109,.3);color:#ff4d6d;display:block}
.help-status.info{background:rgba(74,158,255,.08);border:1px solid rgba(74,158,255,.3);color:#4a9eff;display:block}
.help-video-card{background:#111118;border:1px solid #1e1e2a;border-radius:16px;overflow:hidden;margin-bottom:10px}
.help-video-thumb{width:100%;height:160px;background:linear-gradient(135deg,#1e1e2a,#111118);display:flex;align-items:center;justify-content:center;position:relative;cursor:pointer}
.help-video-play{width:56px;height:56px;background:#34d399;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:22px;transition:transform .2s}
.help-video-thumb:hover .help-video-play{transform:scale(1.1)}
.help-video-info{padding:14px 16px}
.help-video-title{font-size:13px;font-weight:800;margin-bottom:4px}
.help-video-sub{font-size:11px;color:#a0a0b8}
.help-wa-btn{width:100%;display:flex;align-items:center;gap:14px;background:linear-gradient(135deg,rgba(37,211,102,.12),rgba(37,211,102,.06));border:1px solid rgba(37,211,102,.3);border-radius:14px;padding:16px 18px;cursor:pointer;font-family:inherit;color:#e8e8f0;transition:all .2s;margin-bottom:10px;text-decoration:none}
.help-wa-btn:hover{border-color:rgba(37,211,102,.7);background:linear-gradient(135deg,rgba(37,211,102,.18),rgba(37,211,102,.1));transform:translateY(-1px)}
.help-wa-icon{width:46px;height:46px;background:#25d366;border-radius:14px;display:flex;align-items:center;justify-content:center;font-size:24px;flex-shrink:0}

/* CSS: Auth Screen — multi-screen system (Welcome/Login/Register/Forgot), Google sign-in button, form fields, password strength, error messages */
/* ── AUTH SCREEN ── */
/* ── AUTH MULTI-SCREEN SYSTEM ── */
#auth-screen{position:fixed;inset:0;z-index:1000;background:#0a0a0f;overflow-y:auto}
.auth-nf-screen{display:none;min-height:100vh;align-items:center;justify-content:center;padding:24px 20px;flex-direction:column}
.auth-nf-screen.active{display:flex}
/* Welcome */
.wl-glow{position:absolute;top:-100px;left:50%;transform:translateX(-50%);width:340px;height:340px;background:radial-gradient(circle,rgba(0,229,160,.11) 0%,transparent 70%);pointer-events:none}
.wl-logo{font-size:36px;text-align:center;margin-bottom:6px}
.wl-brand{font-size:26px;font-weight:900;text-align:center;margin-bottom:4px;background:linear-gradient(135deg,#00e5a0,#4a9eff);-webkit-background-clip:text;-webkit-text-fill-color:transparent}
.wl-tagline{font-size:12px;color:#a0a0b8;text-align:center;margin-bottom:36px;line-height:1.6}
.wl-panel{width:100%;max-width:400px;position:relative}
.wl-cards{display:flex;flex-direction:column;gap:12px;margin-bottom:20px}
.wl-card{border-radius:18px;padding:18px 20px;display:flex;align-items:center;gap:14px;cursor:pointer;transition:all .25s;border:2px solid transparent}
.wl-card.primary{background:linear-gradient(135deg,rgba(0,229,160,.11),rgba(74,158,255,.07));border-color:rgba(0,229,160,.3)}
.wl-card.primary:hover{border-color:#00e5a0;transform:translateY(-2px)}
.wl-card.secondary{background:#111118;border-color:#1e1e2a}
.wl-card.secondary:hover{border-color:#2e2e3a;transform:translateY(-2px)}
.wl-card-icon{width:42px;height:42px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:20px;flex-shrink:0}
.wl-card.primary .wl-card-icon{background:rgba(0,229,160,.13)}
.wl-card.secondary .wl-card-icon{background:rgba(255,255,255,.05)}
.wl-card-body{flex:1}
.wl-card-title{font-size:14px;font-weight:800;margin-bottom:2px}
.wl-card-sub{font-size:11px;color:#a0a0b8;line-height:1.4}
.google-signin-btn{width:100%;display:flex;align-items:center;justify-content:center;gap:12px;padding:14px 20px;border-radius:14px;border:2px solid #e0e0e8;background:#fff;color:#111118;font-size:15px;font-weight:700;cursor:pointer;font-family:inherit;transition:all .25s;margin-top:4px;box-shadow:0 2px 12px rgba(0,0,0,.08)}
.google-signin-btn:hover{border-color:#4285f4;background:#f8f8ff;transform:translateY(-1px);box-shadow:0 4px 18px rgba(66,133,244,.15)}
.google-signin-btn:active{transform:scale(.98)}
.google-signin-btn:disabled{opacity:.5;cursor:not-allowed;transform:none}
.wl-card-arrow{font-size:18px;color:#8888a8}
.wl-card.primary .wl-card-arrow{color:#00e5a0}
.wl-divider{display:flex;align-items:center;gap:10px;margin-bottom:16px}
.wl-divider::before,.wl-divider::after{content:'';flex:1;height:1px;background:#1e1e2a}
.wl-divider span{font-size:11px;color:#8888a8;white-space:nowrap}
.guest-btn{width:100%;padding:12px;border-radius:13px;border:1px solid #1e1e2a;background:transparent;color:#a0a0b8;font-size:13px;font-weight:600;cursor:pointer;font-family:inherit;transition:all .2s;display:flex;align-items:center;justify-content:center;gap:8px}
.guest-btn:hover{border-color:#2e2e3a;color:#8888a0}
/* Form screens */
.auth-nf-panel{width:100%;max-width:400px;margin:0 auto}
.auth-back-row{display:flex;align-items:center;gap:8px;color:#a0a0b8;font-size:13px;cursor:pointer;margin-bottom:26px;transition:color .2s;width:fit-content}
.auth-back-row:hover{color:#e8e8f0}
.auth-head-title{font-size:26px;font-weight:900;margin-bottom:6px}
.auth-head-sub{font-size:12px;color:#a0a0b8;line-height:1.6;margin-bottom:24px}
.auth-card{background:#111118;border:1px solid #1e1e2a;border-radius:20px;padding:26px 22px}
.auth-field{margin-bottom:16px}
.auth-field-label{font-size:10px;color:#a0a0b8;text-transform:uppercase;letter-spacing:1.5px;font-weight:700;margin-bottom:7px;display:block}
.auth-field-wrap{position:relative}
.auth-field-icon{position:absolute;left:13px;top:50%;transform:translateY(-50%);font-size:15px;color:#8888a8;pointer-events:none}
.auth-inp{width:100%;background:rgba(255,255,255,.03);border:2px solid #1e1e2a;border-radius:12px;padding:12px 15px 12px 40px;font-size:15px;color:#e8e8f0;outline:none;font-family:inherit;transition:all .2s}
.auth-inp:focus{border-color:rgba(0,229,160,.4);background:rgba(0,229,160,.02);box-shadow:0 0 0 4px rgba(0,229,160,.05)}
.auth-inp::placeholder{color:#8888a8}
.pw-toggle{position:absolute;right:13px;top:50%;transform:translateY(-50%);background:none;border:none;color:#a0a0b8;cursor:pointer;font-size:15px;padding:4px;transition:color .2s}
.pw-toggle:hover{color:#e8e8f0}
.pw-strength{margin-top:7px;display:none}
.pw-strength.show{display:block}
.ps-bars{display:flex;gap:4px;margin-bottom:4px}
.ps-bar{flex:1;height:3px;border-radius:999px;background:#1e1e2a;transition:background .3s}
.ps-bar.weak{background:#ff4d6d}
.ps-bar.medium{background:#ff9f35}
.ps-bar.strong{background:#00e5a0}
.ps-label{font-size:10px;color:#a0a0b8}
.auth-err{background:rgba(255,77,109,.1);border:1px solid rgba(255,77,109,.25);border-radius:10px;padding:10px 14px;font-size:12px;color:#ff4d6d;margin-bottom:14px;line-height:1.5;display:none}
.auth-err.show{display:block}
.auth-submit{width:100%;padding:13px;border-radius:13px;border:none;background:linear-gradient(135deg,#00e5a0,#00c887);color:#0a0a0f;font-size:15px;font-weight:800;cursor:pointer;font-family:inherit;margin-top:4px;transition:all .2s;letter-spacing:.3px}
.auth-submit:hover{transform:translateY(-1px);box-shadow:0 8px 24px rgba(0,229,160,.25)}
.auth-submit:disabled{background:#2a2a2a;color:#a0a0b8;cursor:not-allowed;transform:none;box-shadow:none}
.auth-switch{text-align:center;margin-top:18px;font-size:13px;color:#a0a0b8}
.auth-switch a{color:#00e5a0;text-decoration:none;font-weight:600;cursor:pointer}
.auth-switch a:hover{text-decoration:underline}
.auth-terms{font-size:10px;color:#8888a8;text-align:center;margin-top:12px;line-height:1.6}
/* CSS: Subscription Screen — plan cards (Free/Pro Monthly/Pro Annual), radio select, price, features list, pay button */
/* Subscription screen */
.sub-wrap{width:100%;max-width:480px;padding:0 0 60px;margin:0 auto}
.sub-hero{text-align:center;margin-bottom:28px}
.sub-badge{display:inline-flex;align-items:center;gap:6px;background:rgba(255,159,53,.1);border:1px solid rgba(255,159,53,.28);border-radius:999px;padding:5px 14px;font-size:10px;font-weight:700;color:#ff9f35;letter-spacing:1px;text-transform:uppercase;margin-bottom:14px}
.sub-title{font-size:28px;font-weight:900;line-height:1.2;margin-bottom:8px}
.sub-title span{background:linear-gradient(135deg,#00e5a0,#4a9eff);-webkit-background-clip:text;-webkit-text-fill-color:transparent}
.sub-subtitle{font-size:12px;color:#a0a0b8;line-height:1.6}
.sub-plans{display:flex;flex-direction:column;gap:10px;margin-bottom:20px}
.plan-card{border:2px solid #1e1e2a;border-radius:16px;padding:18px;cursor:pointer;transition:all .25s;position:relative;overflow:hidden}
.plan-card:hover{border-color:#2a2a3a;transform:translateY(-1px)}
.plan-card.selected{border-color:#00e5a0;background:rgba(0,229,160,.04)}
.plan-popular-tag{position:absolute;top:0;right:18px;background:#00e5a0;color:#0a0a0f;font-size:9px;font-weight:900;letter-spacing:1.5px;text-transform:uppercase;padding:3px 9px;border-radius:0 0 7px 7px}
.plan-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}
.plan-radio-wrap{display:flex;align-items:center;gap:10px}
.plan-radio{width:18px;height:18px;border-radius:50%;border:2px solid #1e1e2a;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .2s}
.plan-card.selected .plan-radio{border-color:#00e5a0;background:#00e5a0}
.plan-radio-dot{width:7px;height:7px;border-radius:50%;background:#0a0a0f;opacity:0;transform:scale(0);transition:all .2s}
.plan-card.selected .plan-radio-dot{opacity:1;transform:scale(1)}
.plan-name{font-size:15px;font-weight:800}
.plan-price-wrap{text-align:right}
.plan-price{font-size:22px;font-weight:900;color:#00e5a0}
.plan-period{font-size:11px;color:#a0a0b8;margin-top:1px}
.plan-original{font-size:11px;color:#8888a8;text-decoration:line-through;margin-top:1px}
.plan-feats{display:flex;flex-direction:column;gap:6px}
.plan-feat{display:flex;align-items:center;gap:7px;font-size:12px;color:#8888a0}
.plan-feat .feat-check{color:#00e5a0;font-size:12px;flex-shrink:0}
.plan-save-tag{display:inline-block;background:rgba(255,159,53,.1);color:#ff9f35;font-size:10px;font-weight:700;padding:2px 7px;border-radius:5px;margin-left:5px}
.plan-card.free-plan{background:#111118}
.plan-card.free-plan .plan-price{color:#e8e8f0}
.sub-cta-btn{width:100%;padding:15px;border-radius:14px;border:none;background:linear-gradient(135deg,#00e5a0,#00c887);color:#0a0a0f;font-size:15px;font-weight:900;cursor:pointer;font-family:inherit;transition:all .2s;letter-spacing:.3px;margin-bottom:12px}
.sub-cta-btn:hover{transform:translateY(-2px);box-shadow:0 10px 28px rgba(0,229,160,.28)}
.sub-guarantee{display:flex;align-items:center;justify-content:center;gap:6px;font-size:11px;color:#a0a0b8;margin-bottom:18px}
.sub-feats-title{font-size:10px;color:#a0a0b8;text-transform:uppercase;letter-spacing:2px;font-weight:700;text-align:center;margin-bottom:14px}
.sub-feat-list{display:flex;flex-direction:column;gap:8px}
.sub-feat-item{display:flex;align-items:flex-start;gap:10px;padding:12px 14px;background:#111118;border:1px solid #1e1e2a;border-radius:12px}
.sfi-icon{font-size:18px;flex-shrink:0;margin-top:1px}
.sfi-title{font-size:13px;font-weight:700;margin-bottom:2px}
.sfi-sub{font-size:11px;color:#a0a0b8;line-height:1.4}
/* CSS: Auth Success screen (pulse ring animation), Pro Lock overlay (blur + badge + upgrade button), Toast notification, Spinner */
/* Success screen */
.success-panel{width:100%;max-width:340px;text-align:center}
.success-ring{width:84px;height:84px;border-radius:50%;background:rgba(0,229,160,.1);border:2px solid rgba(0,229,160,.28);display:flex;align-items:center;justify-content:center;font-size:36px;margin:0 auto 20px;animation:pulseRing 2s ease-in-out infinite}
@keyframes pulseRing{0%,100%{box-shadow:0 0 0 0 rgba(0,229,160,.28)}50%{box-shadow:0 0 0 14px rgba(0,229,160,.0)}}
.success-title{font-size:26px;font-weight:900;margin-bottom:6px}
.success-sub{font-size:13px;color:#a0a0b8;line-height:1.6;margin-bottom:24px}
.success-badge{display:inline-block;background:rgba(0,229,160,.1);border:1px solid rgba(0,229,160,.28);border-radius:10px;padding:7px 16px;font-size:14px;font-weight:700;color:#00e5a0;margin-bottom:24px}
.success-start{width:100%;padding:14px;border-radius:13px;border:none;background:linear-gradient(135deg,#00e5a0,#00c887);color:#0a0a0f;font-size:15px;font-weight:800;cursor:pointer;font-family:inherit;transition:all .2s}
.success-start:hover{transform:translateY(-1px);box-shadow:0 8px 20px rgba(0,229,160,.25)}
/* Pro lock overlay */
.pro-lock-wrap{position:relative;border-radius:16px;overflow:hidden}
.pro-lock-blur{filter:blur(5px);pointer-events:none;user-select:none}
.pro-lock-badge{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(10,10,15,.78);backdrop-filter:blur(2px);border-radius:16px;z-index:10}
/* PRO tag shown on locked buttons */
.pro-tag{position:absolute;top:7px;right:7px;background:linear-gradient(135deg,#00e5a0,#4a9eff);color:#0a0a0f;font-size:8px;font-weight:900;letter-spacing:1px;padding:2px 6px;border-radius:5px;text-transform:uppercase;pointer-events:none}
.tracker-btn{position:relative}
.section-btn{position:relative}
.plb-inner{text-align:center;padding:20px}
.plb-icon{font-size:30px;margin-bottom:8px}
.plb-title{font-size:15px;font-weight:800;margin-bottom:5px}
.plb-sub{font-size:11px;color:#a0a0b8;margin-bottom:14px;line-height:1.5}
.plb-btn{padding:10px 22px;border-radius:10px;border:none;background:linear-gradient(135deg,#00e5a0,#00c887);color:#0a0a0f;font-size:13px;font-weight:800;cursor:pointer;font-family:inherit;transition:all .2s}
.plb-btn:hover{transform:translateY(-1px);box-shadow:0 6px 16px rgba(0,229,160,.28)}
/* Toast */
.auth-toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%) translateY(20px);background:#1e1e2a;border:1px solid #2a2a3a;border-radius:12px;padding:12px 20px;font-size:13px;font-weight:600;color:#e8e8f0;z-index:9999;opacity:0;transition:all .35s;pointer-events:none;white-space:nowrap}
.auth-toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
.auth-toast.green{border-color:rgba(0,229,160,.4);color:#00e5a0}
/* Spinner */
.auth-spinner{width:18px;height:18px;border:2px solid rgba(10,10,15,.3);border-top-color:#0a0a0f;border-radius:50%;animation:spin .6s linear infinite;display:inline-block;vertical-align:middle;margin-right:6px}
/* Auth user greeting (for settings panel) */
.auth-user-greeting{display:flex;align-items:center;gap:10px;padding:12px 14px;background:rgba(0,229,160,.06);border:1px solid rgba(0,229,160,.2);border-radius:12px;margin-bottom:16px}
.auth-user-avatar{font-size:28px}
.auth-user-info{flex:1}
.auth-user-name{font-size:14px;font-weight:800;color:#00e5a0}
.auth-user-email{font-size:11px;color:#a0a0b8;margin-top:2px}

/* CSS: Settings Subpage — section labels, toggle rows, value badges, select/input, font-size control, danger/logout buttons, profile edit card */
/* ── SETTINGS SUBPAGE ── */
.settings-section-label{font-size:10px;color:#a0a0b8;text-transform:uppercase;letter-spacing:2px;font-weight:700;margin:20px 0 10px}
.settings-row{display:flex;align-items:center;gap:14px;padding:15px 18px;background:#111118;border:1px solid #1e1e2a;border-radius:14px;margin-bottom:8px;transition:all .2s}
.settings-row:hover{border-color:#333345}
.settings-row-icon{width:38px;height:38px;border-radius:11px;display:flex;align-items:center;justify-content:center;font-size:18px;flex-shrink:0}
.settings-row-text{flex:1}
.settings-row-title{font-size:14px;font-weight:700}
.settings-row-sub{font-size:11px;color:#a0a0b8;margin-top:2px}
.settings-row-right{display:flex;align-items:center;gap:8px}
.settings-toggle{width:42px;height:24px;border-radius:12px;background:#1e1e2a;position:relative;cursor:pointer;transition:background .3s;flex-shrink:0;border:none;padding:0}
.settings-toggle.on{background:#00e5a0}
.settings-toggle-thumb{width:18px;height:18px;border-radius:50%;background:#fff;position:absolute;top:3px;left:3px;transition:left .3s;pointer-events:none}
.settings-toggle.on .settings-toggle-thumb{left:21px}
.settings-value-badge{font-size:12px;font-weight:700;color:#a0a0b8;background:rgba(255,255,255,.04);border:1px solid #1e1e2a;padding:4px 10px;border-radius:8px}
.settings-select{background:rgba(255,255,255,.04);border:1px solid #1e1e2a;border-radius:9px;padding:6px 10px;font-size:12px;font-weight:700;color:#e8e8f0;outline:none;font-family:inherit;cursor:pointer;appearance:none}
.settings-select option{background:#111118}
.settings-edit-inp{background:rgba(255,255,255,.04);border:1px solid #1e1e2a;border-radius:9px;padding:6px 10px;font-size:13px;font-weight:600;color:#e8e8f0;outline:none;font-family:inherit;width:120px;transition:border-color .2s}
.settings-edit-inp:focus{border-color:#00e5a0}
/* FONT SIZE CONTROL */
.font-size-control{display:flex;align-items:center;gap:6px;background:rgba(255,255,255,.03);border:1px solid #1e1e2a;border-radius:12px;padding:6px}
.fs-btn{flex:1;padding:8px 4px;border-radius:9px;border:none;background:transparent;color:#a0a0b8;font-family:inherit;font-weight:700;cursor:pointer;transition:all .2s;line-height:1}
.fs-btn.active{background:rgba(0,229,160,.15);color:#00e5a0;border:1px solid rgba(0,229,160,.35)}
.fs-btn:active{transform:scale(.95)}
.settings-danger-btn{width:100%;padding:14px;border-radius:13px;border:1px solid #ff4d6d44;background:rgba(255,77,109,.06);color:#ff4d6d;font-size:14px;font-weight:700;cursor:pointer;font-family:inherit;margin-bottom:10px;transition:all .2s}
.settings-danger-btn:hover{background:rgba(255,77,109,.12);border-color:#ff4d6d88}
.settings-logout-btn{width:100%;padding:14px;border-radius:13px;border:1px solid #ff4d6d;background:#ff4d6d;color:#fff;font-size:14px;font-weight:800;cursor:pointer;font-family:inherit;transition:all .2s;letter-spacing:.3px}
.settings-logout-btn:hover{background:#ff2255;transform:translateY(-1px)}
.profile-edit-card{background:#111118;border:1px solid #1e1e2a;border-radius:16px;padding:20px;margin-bottom:16px}
.profile-edit-avatar-row{display:flex;align-items:center;gap:16px;margin-bottom:18px}
.profile-edit-avatar{font-size:52px;width:72px;height:72px;border-radius:50%;background:rgba(0,229,160,.1);border:2px solid rgba(0,229,160,.3);display:flex;align-items:center;justify-content:center}
.profile-edit-info{flex:1}
.profile-edit-name{font-size:18px;font-weight:900;color:#00e5a0}
.profile-edit-email{font-size:12px;color:#a0a0b8;margin-top:3px}
.profile-inp-label{font-size:10px;color:#a0a0b8;text-transform:uppercase;letter-spacing:1px;font-weight:700;margin-bottom:6px}
.profile-inp{width:100%;background:rgba(255,255,255,.03);border:2px solid #1e1e2a;border-radius:12px;padding:12px 16px;font-size:14px;color:#e8e8f0;outline:none;font-family:inherit;margin-bottom:12px;transition:border-color .2s}
.profile-inp:focus{border-color:#00e5a0}
.profile-save-btn{width:100%;padding:13px;border-radius:12px;border:none;background:#00e5a0;color:#0a0a0f;font-size:14px;font-weight:800;cursor:pointer;font-family:inherit;transition:all .2s}
.profile-save-btn:hover{background:#00ffb3}

/* CSS: Guest Signup Modal (#guest-signup-modal) — shown when guest tries to access Pro feature, Google + continue-as-guest buttons */
/* ── GUEST SIGNUP MODAL ── */
#guest-signup-modal{
  display:none;position:fixed;inset:0;z-index:99999;
  background:rgba(0,0,0,.7);backdrop-filter:blur(4px);
  align-items:center;justify-content:center;padding:20px;
}
#guest-signup-modal.show{display:flex;}
.gsm-box{
  background:#111118;border:1px solid #1e1e2a;border-radius:20px;
  padding:28px 22px;max-width:340px;width:100%;text-align:center;
  animation:gsmIn .25s ease;
}
@keyframes gsmIn{from{transform:scale(.88);opacity:0}to{transform:scale(1);opacity:1}}
.gsm-icon{font-size:38px;margin-bottom:10px;}
.gsm-title{font-size:18px;font-weight:800;color:#e8e8f0;margin-bottom:6px;}
.gsm-sub{font-size:13px;color:#a0a0b8;line-height:1.5;margin-bottom:22px;}
.gsm-google-btn{
  width:100%;display:flex;align-items:center;justify-content:center;gap:10px;
  padding:13px 18px;border-radius:13px;border:2px solid #e0e0e8;
  background:#fff;color:#111118;font-size:14px;font-weight:700;
  cursor:pointer;font-family:inherit;transition:all .2s;margin-bottom:12px;
}
.gsm-google-btn:hover{border-color:#4285f4;transform:translateY(-1px);}
.gsm-cancel{
  font-size:12px;color:#5a5a70;cursor:pointer;padding:6px;
  display:inline-block;transition:color .2s;
}
.gsm-btn-row{display:flex;gap:8px;margin-bottom:12px;}.gsm-google-btn{
  flex:1;display:flex;align-items:center;justify-content:center;gap:7px;
  padding:12px 10px;border-radius:13px;border:2px solid #e0e0e8;
  background:#fff;color:#111118;font-size:13px;font-weight:700;
  cursor:pointer;font-family:inherit;transition:all .2s;margin-bottom:0;
}
.gsm-google-btn:hover{border-color:#4285f4;transform:translateY(-1px);}
.gsm-guest-btn{
  flex:1;padding:12px 10px;border-radius:13px;
  border:1px solid #2e2e3a;background:transparent;
  color:#a0a0b8;font-size:13px;font-weight:600;
  cursor:pointer;font-family:inherit;transition:all .2s;
  display:flex;align-items:center;justify-content:center;gap:6px;
  margin-bottom:0;
}
.gsm-guest-btn:hover{border-color:#4a4a5a;color:#c0c0d0;}
body.light .gsm-guest-btn{border-color:#ddd;color:#555;}
body.light .gsm-guest-btn:hover{border-color:#aaa;color:#333;}
.gsm-close-btn{
  position:absolute;top:12px;right:14px;
  background:rgba(255,255,255,.06);border:none;border-radius:50%;
  width:30px;height:30px;display:flex;align-items:center;justify-content:center;
  cursor:pointer;font-size:16px;color:#a0a0b8;line-height:1;
  transition:background .2s,color .2s;font-family:inherit;
}
.gsm-close-btn:hover{background:rgba(255,255,255,.12);color:#e8e8f0;}
.gsm-box{position:relative;}
.gsm-timer-bar{height:3px;background:rgba(74,158,255,.15);border-radius:0 0 20px 20px;margin:-28px -22px 22px;overflow:hidden;}
.gsm-timer-fill{height:100%;background:#4a9eff;border-radius:0 0 20px 20px;width:100%;transition:width linear;}
.fm-chip{cursor:pointer;}
body.light .gsm-close-btn{background:rgba(0,0,0,.06);color:#666;}
body.light .gsm-close-btn:hover{background:rgba(0,0,0,.12);color:#111;}
body.light .gsm-box{background:#fff;border-color:#e0e0e8;}
body.light .gsm-title{color:#111118;}
body.light .gsm-sub{color:#666;}
.step-explain-card{margin-top:18px;padding:16px;border-radius:14px;background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.08);font-size:13px;line-height:1.7;color:#d0d0e0;}
body.light .step-explain-card{background:rgba(0,0,0,0.04);border-color:rgba(0,0,0,0.10);color:#222;}

/* CSS: Desktop Layout (min-width 900px) — nav becomes horizontal row, subpages centered, auth panels get card treatment, wider content max-width */
/* ════════════════════════════════════════════════════
   DESKTOP LAYOUT  ≥ 900px
   ════════════════════════════════════════════════════ */
@media (min-width: 900px) {

  body { overflow-x: hidden; }

  .auth-nf-screen { padding: 40px 20px; }
  #nf-welcome { padding: 40px 20px; }
  #nf-login .auth-nf-panel,
  #nf-signup .auth-nf-panel,
  #nf-pro-login .auth-nf-panel,
  #nf-forgot .auth-nf-panel {
    max-width: 440px; width: 100%;
    background: #111118; border: 1px solid #1e1e2a;
    border-radius: 24px; padding: 36px 32px;
    box-shadow: 0 24px 80px rgba(0,0,0,.6);
  }
  .sub-wrap { max-width: 640px; padding: 0 0 60px; }

  #wizard { padding: 60px 20px; }
  .wpanel { max-width: 580px; width: 100%; }
  .wcard { padding: 44px 40px; border-radius: 28px; }

  #plan { padding-top: 72px; }

  .top-nav {
    max-width: 900px; left: 50%; right: auto;
    transform: translateX(-50%); width: 900px;
    border-left: 1px solid #1e1e2a; border-right: 1px solid #1e1e2a;
    border-radius: 0 0 16px 16px; height: 72px;
    padding: 0 24px; gap: 4px; justify-content: center;
  }
  .tnav-btn {
    flex-direction: row; gap: 8px; padding: 10px 22px;
    border-radius: 12px; flex: unset;
  }
  .tnav-btn:hover { background: rgba(255,255,255,0.05); color: #e8e8f0; }
  .tnav-btn:hover .tnav-icon svg { stroke: #e8e8f0; }
  input, textarea, select { caret-color: auto !important; }
  .tnav-icon { width: 24px; height: 24px; font-size: 22px; }
  .tnav-icon svg { width: 24px; height: 24px; }
  .tnav-label { font-size: 13px; letter-spacing: 0.2px; text-transform: none; font-weight: 700; }
  .tnav-btn.active::after { bottom: -2px; width: 36px; }

  .pi {
    max-width: 900px; margin-left: auto; margin-right: auto;
    padding-left: 32px; padding-right: 32px; box-sizing: border-box;
  }

  .subpage {
    left: 50% !important; right: auto !important;
    width: 760px !important; transform: translateX(-50%);
    border-left: 1px solid #1e1e2a; border-right: 1px solid #1e1e2a;
  }
  .subpage.open { transform: translateX(-50%); }

  #insight-subnav {
    left: 50% !important; right: auto !important;
    width: 900px !important; transform: translateX(-50%);
  }

  .swap-box, .gsm-box, .sync-confirm-box { max-width: 520px; margin: 0 auto; }

  body.light .auth-nf-panel {
    background: #fff; border-color: #e0e0e8;
    box-shadow: 0 8px 40px rgba(0,0,0,.1);
  }
}

/* ════ END OF CSS — style tag closes below ════ */

/* ── STYLE BLOCK 2 ── */

  .ns-lp-reviews{padding:28px 20px 8px;max-width:480px;margin:0 auto;width:100%;box-sizing:border-box}
  .ns-lp-heading{font-size:18px;font-weight:900;color:#e8e8f0;margin-bottom:4px;letter-spacing:-.3px}
  body.light .ns-lp-heading{color:#111118}
  .ns-lp-meta{font-size:12px;color:#a0a0b8;margin-bottom:18px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
  .ns-lp-stars-big{color:#f5a623;font-size:16px;letter-spacing:1px}
  .ns-lp-grid{display:flex;flex-direction:column;gap:10px;margin-bottom:24px}
  .ns-lp-card{background:#111118;border:1px solid #1e1e2a;border-radius:14px;padding:16px}
  body.light .ns-lp-card{background:#fff;border-color:#e0e0ea}
  .ns-lp-card-header{display:flex;align-items:center;gap:10px;margin-bottom:10px}
  .ns-lp-avatar{width:34px;height:34px;border-radius:50%;background:#1e1e2a;border:1px solid #2a2a3a;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;color:#a0a0b8;flex-shrink:0}
  body.light .ns-lp-avatar{background:#f0f0f5;border-color:#ddd;color:#666}
  .ns-lp-name{font-size:13px;font-weight:700;color:#e8e8f0;line-height:1.2}
  body.light .ns-lp-name{color:#111118}
  .ns-lp-date{font-size:10px;color:#5a5a70;margin-top:1px}
  .ns-lp-card-stars{color:#f5a623;font-size:11px;letter-spacing:.5px;margin-left:auto;flex-shrink:0}
  .ns-lp-body{font-size:12px;color:#a0a0b8;line-height:1.7}
  body.light .ns-lp-body{color:#505068}
  .ns-lp-no-reviews{font-size:13px;color:#5a5a70;text-align:center;padding:16px 0}
  /* Form */
  .ns-lp-form{background:#111118;border:1px solid #1e1e2a;border-radius:14px;padding:18px}
  body.light .ns-lp-form{background:#fff;border-color:#e0e0ea}
  .ns-lp-form-title{font-size:13px;font-weight:700;color:#e8e8f0;margin-bottom:14px}
  body.light .ns-lp-form-title{color:#111118}
  .ns-lp-flabel{font-size:10px;font-weight:700;color:#5a5a70;letter-spacing:1.5px;text-transform:uppercase;margin-bottom:5px;display:block}
  .ns-lp-finput{background:#16161f;border:1px solid #1e1e2a;border-radius:10px;padding:10px 12px;color:#e8e8f0;font-size:13px;font-family:inherit;outline:none;width:100%;box-sizing:border-box;transition:border-color .2s}
  body.light .ns-lp-finput{background:#f5f5f7;border-color:#e0e0ea;color:#111118}
  .ns-lp-finput:focus{border-color:#2a2a3a}
  textarea.ns-lp-finput{resize:vertical;min-height:72px}
  .ns-lp-frow{margin-bottom:12px}
  .ns-lp-star-row{display:flex;gap:5px;margin-top:4px}
  .ns-lp-star-btn{font-size:22px;color:#2a2a3a;cursor:pointer;transition:color .15s;background:none;border:none;padding:0;line-height:1}
  .ns-lp-star-btn.active{color:#f5a623}
  .ns-lp-submit{width:100%;padding:11px;background:#00e5a0;border:none;border-radius:10px;color:#000;font-size:13px;font-weight:800;font-family:inherit;cursor:pointer;margin-top:4px;transition:opacity .2s}
  .ns-lp-submit:hover{opacity:.9}
  .ns-lp-submit:disabled{opacity:.5;cursor:not-allowed}
  .ns-lp-msg{font-size:12px;margin-top:8px;text-align:center;min-height:16px}
  .ns-lp-msg.success{color:#00e5a0}
  .ns-lp-msg.error{color:#ff4d6d}
  
/* ── STYLE BLOCK 3 ── */

  .cube3d-wrap{width:100%;display:flex;flex-direction:column;align-items:center;margin-bottom:4px;user-select:none;overflow:visible}
  .cube3d{position:relative;width:92%;max-width:360px;transform:translateZ(0);-webkit-transform:translateZ(0)}
  .cube3d svg{width:100%;height:auto;display:block;filter:drop-shadow(0 12px 36px rgba(0,0,0,.6))}
  .cube3d-left-hit,.cube3d-right-hit{cursor:pointer;transition:opacity .15s}
  .cube3d-left-hit:active,.cube3d-right-hit:active{opacity:.8}
  
/* ── STYLE BLOCK 4 ── */

    .wheel-wrap{position:relative;width:100%;display:flex;flex-direction:column;align-items:center;gap:0;margin:0 0 8px}
    .wheel-svg-wrap{position:relative;width:min(370px,96vw);height:min(370px,96vw)}
    .wheel-svg-wrap svg{width:100%;height:100%;overflow:visible}
    .ws{cursor:pointer;transition:filter .2s,transform .18s;transform-origin:190px 190px}
    .ws:active{filter:brightness(1.5) drop-shadow(0 0 12px rgba(255,255,255,.4))}
    .wheel-divider{display:flex;align-items:center;gap:8px;width:min(370px,96vw);margin:6px 0}
    .wheel-divider-line{flex:1;height:1px;background:currentColor;opacity:.2}
    .wheel-divider-text{font-size:9px;font-weight:800;letter-spacing:1px;opacity:.5;white-space:nowrap}
  
/* ── STYLE BLOCK 5 ── */

.bdg-section{background:#161b27;border:1px solid #2a3045;border-radius:16px;padding:20px;margin-bottom:14px}
.bdg-title{font-size:10px;color:#5a5a70;text-transform:uppercase;letter-spacing:2px;font-weight:700;margin-bottom:14px}
.bdg-currency-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:4px}
.bdg-cur-btn{background:#1a1f2e;border:2px solid #2a3045;border-radius:12px;padding:10px 6px;text-align:center;cursor:pointer;transition:all .2s;font-size:18px;color:#e8e8f0}
.bdg-cur-btn.sel{border-color:#f59e0b;background:rgba(245,158,11,.1)}
.bdg-cur-label{font-size:9px;color:#5a5a70;margin-top:3px;line-height:1.3}
.bdg-amount-row{display:flex;align-items:center;gap:10px;margin-top:14px}
.bdg-sym{font-size:28px;font-weight:900;color:#f59e0b;min-width:30px}
.bdg-amt-inp{flex:1;background:#1a1f2e;border:2px solid #2a3045;border-radius:14px;padding:12px 16px;font-size:22px;font-weight:700;color:#e8e8f0;outline:none;font-family:inherit}
.bdg-amt-inp:focus{border-color:#f59e0b}
.bdg-macro-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.bdg-macro-btn{background:#1a1f2e;border:2px solid #2a3045;border-radius:12px;padding:12px;cursor:pointer;transition:all .2s;text-align:center}
.bdg-macro-btn.sel{border-color:var(--mc);background:rgba(var(--mcr),.12)}
.bdg-macro-icon{font-size:22px;margin-bottom:4px}
.bdg-macro-name{font-size:12px;font-weight:700}
.bdg-macro-desc{font-size:10px;color:#5a5a70;margin-top:2px;line-height:1.3}
.bdg-diet-badge{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:20px;font-size:12px;font-weight:700;background:rgba(255,159,53,.1);border:1px solid rgba(255,159,53,.3);color:#ff9f35;margin-bottom:14px}
.bdg-result-food{background:#1a1f2e;border:1px solid #2a3045;border-radius:12px;padding:14px;margin-bottom:8px}
.bdg-rf-name{font-size:13px;font-weight:800;color:#e8e8f0;margin-bottom:6px}
.bdg-rf-qty{font-size:11px;color:#f59e0b;margin-bottom:6px}
.bdg-rf-macros{display:flex;gap:8px;flex-wrap:wrap}
.bdg-rf-m{font-size:10px;padding:2px 8px;border-radius:99px;font-weight:700}
.bdg-total-bar{background:#161b27;border:1px solid #2a3045;border-radius:14px;padding:16px;margin-top:12px}
.bdg-total-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;font-size:13px;color:#e8e8f0}
.bdg-total-row:last-child{margin-bottom:0}
.bdg-total-val{font-weight:800}
.bdg-tip{background:rgba(245,158,11,.08);border:1px solid rgba(245,158,11,.2);border-radius:12px;padding:12px 14px;font-size:12px;color:#f59e0b;line-height:1.6;margin-top:12px}

/* ── STYLE BLOCK 6 ── */

/* ── PRIVACY & POLICY ── */
.priv-hero{background:linear-gradient(135deg,#f472b618,#ec489910);border:1px solid #f472b633;border-radius:18px;padding:22px;text-align:center;margin-bottom:20px}
.priv-hero-icon{font-size:42px;margin-bottom:8px}
.priv-hero-title{font-size:19px;font-weight:900;margin-bottom:5px}
.priv-hero-sub{font-size:12px;color:#a0a0b8;line-height:1.7}
.priv-nav{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:20px}
.priv-nav-btn{display:flex;flex-direction:column;align-items:center;gap:6px;background:#111118;border:1px solid #1e1e2a;border-radius:14px;padding:16px 10px;cursor:pointer;font-family:inherit;color:#e8e8f0;transition:all .2s;text-align:center}
.priv-nav-btn:hover{border-color:#f472b6;background:rgba(244,114,182,.06)}
.priv-nav-btn.active{border-color:#f472b6;background:rgba(244,114,182,.08)}
.priv-nav-icon{font-size:22px}
.priv-nav-label{font-size:11px;font-weight:800;letter-spacing:.3px}
.priv-section{display:none}
.priv-section.active{display:block}
.priv-doc-card{background:#111118;border:1px solid #1e1e2a;border-radius:16px;padding:20px;margin-bottom:12px}
.priv-doc-heading{font-size:15px;font-weight:900;margin-bottom:4px;color:#f472b6}
.priv-doc-date{font-size:10px;color:#a0a0b8;margin-bottom:14px;text-transform:uppercase;letter-spacing:1px}
.priv-doc-body{font-size:12px;color:#9a9ab0;line-height:1.9}
.priv-doc-body h4{font-size:12px;font-weight:800;color:#e8e8f0;margin:14px 0 4px}
.priv-doc-body p{margin-bottom:10px}
.priv-doc-body ul{padding-left:16px;margin-bottom:10px}
.priv-doc-body li{margin-bottom:5px}
.priv-doc-body strong{color:#e8e8f0}
.priv-highlight{background:rgba(244,114,182,.07);border:1px solid #f472b633;border-radius:10px;padding:12px 14px;margin:12px 0;font-size:12px;color:#f472b6;line-height:1.7}
.priv-section-label{font-size:10px;color:#a0a0b8;text-transform:uppercase;letter-spacing:2px;font-weight:700;margin:18px 0 10px}
.priv-data-card{background:#111118;border:1px solid #1e1e2a;border-radius:16px;overflow:hidden;margin-bottom:12px}
.priv-data-row{display:flex;align-items:center;gap:14px;padding:14px 16px;border-bottom:1px solid #1e1e2a}
.priv-data-row:last-child{border-bottom:none}
.priv-data-icon{font-size:20px;width:38px;text-align:center;flex-shrink:0}
.priv-data-info{flex:1}
.priv-data-title{font-size:12px;font-weight:700;margin-bottom:2px}
.priv-data-sub{font-size:11px;color:#a0a0b8;line-height:1.4}
.priv-data-badge{font-size:9px;font-weight:800;padding:3px 8px;border-radius:6px;letter-spacing:.5px;flex-shrink:0}
.badge-local{background:rgba(0,229,160,.1);color:#00e5a0;border:1px solid rgba(0,229,160,.2)}
.badge-cloud{background:rgba(74,158,255,.1);color:#4a9eff;border:1px solid rgba(74,158,255,.2)}
.badge-none{background:rgba(90,90,112,.1);color:#a0a0b8;border:1px solid #2a2a2a}
.priv-delete-btn{width:100%;display:flex;align-items:center;gap:14px;background:rgba(255,77,109,.05);border:1px solid #ff4d6d33;border-radius:14px;padding:16px 18px;cursor:pointer;font-family:inherit;color:#e8e8f0;transition:all .2s;margin-bottom:10px;text-align:left}
.priv-delete-btn:hover{border-color:#ff4d6d;background:rgba(255,77,109,.1)}
.priv-contact-input{width:100%;background:rgba(255,255,255,.03);border:2px solid #1e1e2a;border-radius:12px;padding:11px 15px;font-size:13px;color:#e8e8f0;outline:none;font-family:inherit;margin-bottom:10px;transition:border-color .2s}
.priv-contact-input:focus{border-color:#f472b6}
.priv-contact-input::placeholder{color:#a0a0b8}
.priv-contact-textarea{height:90px;resize:none;line-height:1.6}
.priv-submit-btn{width:100%;padding:13px;border-radius:12px;border:none;background:#f472b6;color:#0a0a0f;font-size:14px;font-weight:800;cursor:pointer;font-family:inherit;letter-spacing:.3px;transition:all .2s}
.priv-submit-btn:hover{background:#f9a8d4;transform:translateY(-1px)}
.priv-submit-btn:disabled{background:#2a2a2a;color:#a0a0b8;cursor:not-allowed;transform:none}
.priv-status{border-radius:12px;padding:12px 16px;font-size:12px;font-weight:600;line-height:1.6;margin-top:10px;display:none}
.priv-status.success{background:rgba(0,229,160,.08);border:1px solid rgba(0,229,160,.3);color:#00e5a0;display:block}
.priv-status.error{background:rgba(255,77,109,.08);border:1px solid rgba(255,77,109,.3);color:#ff4d6d;display:block}
.priv-status.info{background:rgba(74,158,255,.08);border:1px solid rgba(74,158,255,.3);color:#4a9eff;display:block}
.priv-tabs{display:flex;gap:6px;margin-bottom:16px;overflow-x:auto;padding-bottom:2px}
.priv-tab{padding:7px 14px;border-radius:8px;border:1px solid #1e1e2a;background:transparent;color:#a0a0b8;font-size:11px;font-weight:700;cursor:pointer;font-family:inherit;white-space:nowrap;transition:all .2s}
.priv-tab.active{background:#f472b6;border-color:#f472b6;color:#0a0a0f}

/* ── STYLE BLOCK 7 ── */

      @keyframes esrBlink { 0%,100%{opacity:1} 50%{opacity:.45} }
    
/* ── STYLE BLOCK 8 ── */

.cbc-back-btn{display:flex;align-items:center;gap:8px;background:transparent;border:1px solid #1e1e2a;border-radius:10px;color:#a0a0b8;font-size:13px;font-weight:700;padding:8px 14px;cursor:pointer;font-family:inherit;margin-bottom:18px;transition:all .2s;width:fit-content}
.cbc-back-btn:hover{border-color:#ef4444;color:#ef4444}
.cbc-plan-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:18px}
.cbc-plan-chip{background:#111118;border:1px solid #1e1e2a;border-radius:10px;padding:10px 8px;text-align:center}
.cbc-plan-chip-val{font-size:13px;font-weight:800;color:#e8e8f0}
.cbc-plan-chip-lbl{font-size:9px;color:#a0a0b8;text-transform:uppercase;letter-spacing:.5px;margin-top:3px}
.cbc-gender-row{display:flex;gap:8px;margin-bottom:20px}
.cbc-gender-btn{flex:1;padding:11px;border-radius:12px;border:2px solid #1e1e2a;background:transparent;color:#a0a0b8;font-size:14px;font-weight:700;cursor:pointer;font-family:inherit;transition:all .2s}
.cbc-gender-btn.act{border-color:#ef4444;background:rgba(239,68,68,.12);color:#ef4444}
.cbc-sec-lbl{font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:2px;margin:20px 0 10px;display:flex;align-items:center;gap:8px}
.cbc-sec-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}
.cbc-field{background:#111118;border:1px solid #1e1e2a;border-radius:14px;padding:12px 14px;margin-bottom:8px}
.cbc-field-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
.cbc-field-name{font-size:13px;font-weight:700}
.cbc-field-unit{font-size:10px;color:#a0a0b8;font-weight:600;background:rgba(255,255,255,.04);padding:2px 8px;border-radius:6px}
.cbc-refs{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-bottom:8px}
.cbc-ref{text-align:center;padding:6px 4px;border-radius:8px;border:1px solid rgba(255,255,255,.06);background:rgba(255,255,255,.02)}
.cbc-ref-lbl{font-size:8px;color:#a0a0b8;margin-bottom:2px;text-transform:uppercase;letter-spacing:.5px}
.cbc-ref-val{font-size:11px;font-weight:800}
.cbc-inp-wrap{position:relative}
.cbc-inp{width:100%;background:rgba(255,255,255,.03);border:2px solid #1e1e2a;border-radius:10px;padding:10px 60px 10px 14px;font-size:18px;font-weight:800;color:#e8e8f0;outline:none;font-family:inherit;transition:border-color .2s;box-sizing:border-box}
.cbc-inp:focus{border-color:#ef4444}
.cbc-inp.low{border-color:#4a9eff!important;background:rgba(74,158,255,.06)!important}
.cbc-inp.high{border-color:#ef4444!important;background:rgba(239,68,68,.06)!important}
.cbc-inp.ok{border-color:#00e5a0!important;background:rgba(0,229,160,.05)!important}
.cbc-tag{position:absolute;right:10px;top:50%;transform:translateY(-50%);font-size:9px;font-weight:700;padding:3px 7px;border-radius:6px;pointer-events:none;white-space:nowrap}
.cbc-analyze-btn{width:100%;padding:16px;border-radius:16px;border:none;background:linear-gradient(135deg,#ef4444,#dc2626);color:#fff;font-size:16px;font-weight:800;cursor:pointer;font-family:inherit;margin-top:22px;transition:all .2s;letter-spacing:.3px}
.cbc-analyze-btn:hover{transform:translateY(-1px);box-shadow:0 8px 24px rgba(239,68,68,.3)}
.cbc-result-wrap{margin-top:22px;animation:fadeInUp .35s ease}
.cbc-summary-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:18px}
.cbc-sum-chip{text-align:center;padding:14px 8px;border-radius:12px;border:1px solid}
.cbc-sum-num{font-size:30px;font-weight:900;line-height:1}
.cbc-sum-lbl{font-size:9px;text-transform:uppercase;letter-spacing:.5px;margin-top:4px;font-weight:700}
.cbc-res-card{background:#111118;border-radius:14px;padding:16px;margin-bottom:12px;border:1px solid #1e1e2a}
.cbc-res-title{font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:1.5px;margin-bottom:12px;display:flex;align-items:center;gap:6px}
.cbc-finding-row{display:flex;align-items:flex-start;gap:10px;padding:9px 10px;border-radius:9px;margin-bottom:6px;line-height:1.6}
.cbc-finding-row:last-child{margin-bottom:0}
.cbc-nutri-row{display:flex;align-items:flex-start;gap:8px;padding:7px 0;border-bottom:1px solid rgba(255,255,255,.04);font-size:12px;color:#c8c8d4;line-height:1.55}
.cbc-nutri-row:last-child{border-bottom:none}
.cbc-food-chip{display:inline-flex;align-items:center;gap:5px;padding:6px 10px;border-radius:8px;font-size:11px;font-weight:600;margin:3px 3px 3px 0;border:1px solid;line-height:1.4}
.cbc-macro-table{width:100%;border-collapse:collapse}
.cbc-macro-table td{padding:9px 10px;font-size:12px;border-bottom:1px solid rgba(255,255,255,.04)}
.cbc-macro-table tr:last-child td{border-bottom:none}
.cbc-mt-label{color:#a0a0b8;font-weight:600}
.cbc-mt-val{font-weight:800;text-align:right}
.cbc-disclaimer-final{font-size:11px;color:#a0a0b8;text-align:center;line-height:1.6;margin-top:14px;padding:12px;background:rgba(255,255,255,.02);border-radius:10px;border:1px solid #1e1e2a}

/* Budget Diet Planner — Light Mode */
body.light .bdg-section{background:#fff;border-color:#e0e0e8}
body.light .bdg-cur-btn{background:#f5f5f7;border-color:#e0e0e8;color:#111118}
body.light .bdg-cur-btn.sel{border-color:#f59e0b!important;background:rgba(245,158,11,.15)!important}
body.light .bdg-macro-btn.sel{border-color:var(--mc)!important;background:rgba(var(--mcr),.15)!important}
body.light .bdg-cur-label{color:#666}
body.light .bdg-amt-inp{background:#f5f5f7;border-color:#e0e0e8;color:#111118}
body.light .bdg-macro-btn{background:#f5f5f7;border-color:#d0d0d8}
body.light .bdg-macro-desc{color:#666}
body.light .bdg-diet-badge{background:rgba(255,159,53,.1);border-color:rgba(255,159,53,.3);color:#ff9f35}
body.light .bdg-result-food{background:#f8f8fc;border-color:#e0e0e8}
body.light .bdg-rf-name{color:#111118}
body.light .bdg-total-bar{background:#fff;border-color:#e0e0e8}
body.light .bdg-total-row{color:#111118}
body.light .bdg-title{color:#888}