/* yourZone Liquid Glass · 28.10.2026
   Presentation-only overrides. Original photo layers, banners, charts and export art are untouched. */
html[data-yz-glass]{--yzg-alpha:.318;--yzg-darkness:.388;--yzg-tint:26,31,30;--yzg-edge:rgba(255,255,255,.26);--yzg-glint:rgba(255,255,255,.3);--yzg-inner:rgba(255,255,255,.045);--yzg-ink:#f9fbfa;--yzg-muted:#d0d9d6;--yzg-accent:#8fdfdc;--yzg-shadow:0 12px 32px rgba(0,0,0,.16);--yzg-blur:18px;--glass-panel:rgba(var(--yzg-tint),var(--yzg-alpha));--glass-nav:rgba(24,32,31,.63);--glass-dialog:rgba(24,31,30,calc(.48 + var(--yzg-alpha)*.3));--glass-input:rgba(10,20,19,.43);--glass-line:var(--yzg-edge);--glass-ink:var(--yzg-ink);--glass-muted:var(--yzg-muted);--glass-link:var(--yzg-accent)}
html[data-yz-glass][data-yz-theme=light],html[data-yz-glass]:has(body.light){--yzg-tint:250,253,251;--yzg-edge:rgba(255,255,255,.68);--yzg-glint:rgba(255,255,255,.85);--yzg-inner:rgba(255,255,255,.2);--yzg-ink:#152d2e;--yzg-muted:#354e4f;--yzg-accent:#176268;--yzg-shadow:0 12px 32px rgba(31,43,40,.1);--glass-nav:rgba(242,249,246,.76);--glass-dialog:rgba(242,249,246,.94);--glass-input:rgba(255,255,255,.6)}
html[data-yz-glass] body{position:relative;isolation:isolate;min-height:100dvh;color:var(--yzg-ink);background-color:#111917!important}
html[data-yz-glass] .yzg-backdrop{position:fixed;inset:0;z-index:-1;pointer-events:none;background-image:linear-gradient(rgba(6,13,12,var(--yzg-darkness)),rgba(6,13,12,var(--yzg-darkness))),var(--yzg-scene);background-size:cover;background-position:var(--yzg-position,50% 50%);background-repeat:no-repeat}
html[data-yz-glass][data-yz-theme=light] .yzg-backdrop,html[data-yz-glass]:has(body.light) .yzg-backdrop{background-image:linear-gradient(rgba(235,244,237,.66),rgba(235,244,237,.66)),linear-gradient(rgba(6,13,12,var(--yzg-darkness)),rgba(6,13,12,var(--yzg-darkness))),var(--yzg-scene)}
html[data-yz-glass][data-yz-glass-scene=original] .yzg-backdrop{background-color:#111917}
html[data-yz-glass][data-yz-theme=light][data-yz-glass-scene=original] .yzg-backdrop{background-color:#eaf1ee}
html[data-yz-glass] :is(#yz-portal,.yz-login,.app,#food-app,.app-layout){background-color:transparent!important}
html[data-yz-glass] :is(#yz-portal,#yz-time-concept,#yz-live-app,.app,#yzgym,#food-app,body){--yz-ink:var(--yzg-ink);--yz-muted:var(--yzg-muted);--yz-line:var(--yzg-edge);--yz-soft:var(--yzg-accent);--sub:var(--yzg-muted);--muted:var(--yzg-muted);--panel:var(--glass-panel);--line:var(--yzg-edge);--f-panel:var(--glass-panel);--f-field:var(--glass-input);--f-line:var(--yzg-edge);--f-ink:var(--yzg-ink);--f-muted:var(--yzg-muted);--f-bg:transparent}
/* Main surfaces: no geometry changes and no image selectors. */
html[data-yz-glass] #yz-portal :is(.yz-panel,.yz-card,.yz-diary-entry,.yz-coach-hint,.yz-step-week,.yz-profile-card,.yz-listfile,.yz-hero,.yz-hrv-card,.yz-hrv-feedback,.yz-metric-chart,.yz-nutrition,.yz-customer-quick,.yz-setting,.yz-notification-empty,.yz-cb-selected,.yz-ws-bar,.yz-ws-picker,.yz-ws-action-drawer,.yz-ws-global),
html[data-yz-glass] :is(.yz-login-card,.app .routine-card,.app .custom-card,.app .stat,.app .activity,.app .empty,.app .next,.app .editor-summary,#yzgym .stats,#yzgym .exercise,#yzgym .rest-bar,#yzgym .history,.tool-card,.panel,.workspace,.summary,.coach,.overview,.meal,.water-card,.note-card){background-color:var(--glass-panel)!important;background-image:none!important;border-color:var(--yzg-edge)!important;box-shadow:inset 0 1px 0 var(--yzg-glint),inset 0 -1px 0 rgba(255,255,255,.04),var(--yzg-shadow)!important;backdrop-filter:blur(var(--yzg-blur)) saturate(130%);-webkit-backdrop-filter:blur(var(--yzg-blur)) saturate(130%);color:var(--yzg-ink)}
/* Sub-surfaces remain light to avoid stacked blur and heavy rendering. */
html[data-yz-glass] #yz-portal :is(.yz-panel .yz-coach-hint,.yz-panel .yz-diary-entry,.yz-panel .yz-step-week,.yz-panel .yz-setting,.yz-panel .yz-listfile,.yz-cb-selected .yz-ws-bar),
html[data-yz-glass] :is(.meal-entry,.food-row,.activity-row,.app .editor-summary .stat){background-color:var(--yzg-inner)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.12)!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
html[data-yz-glass] #yz-portal :is(.yz-header,.yz-nav,.yz-ws-tabs,.yz-cb-tabs),html[data-yz-glass] :is(.yz-appearance-bar,.app .nav,#yz-time-concept aside,#yz-time-concept .tabs,#yz-live-app .toolbar,.side-nav,.food-tabs){background:var(--glass-nav)!important;border-color:var(--yzg-edge)!important;backdrop-filter:blur(24px) saturate(135%);-webkit-backdrop-filter:blur(24px) saturate(135%);box-shadow:inset 0 1px 0 var(--yzg-glint),0 8px 30px rgba(0,0,0,.12)!important}
/* Original hero, exercise, HRV and live-pulse imagery retains its own layers. */
html[data-yz-glass] :is(dialog:not(.yz-welcome-panel),.yz-modal,.cz-dialog){background-color:var(--glass-dialog)!important;border-color:var(--yzg-edge)!important;box-shadow:inset 0 1px 0 var(--yzg-glint),0 24px 80px rgba(0,0,0,.32)!important;backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px)}
html[data-yz-glass] dialog:not(.yz-welcome-panel)::backdrop{background:rgba(5,12,12,.42);backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px)}
html[data-yz-glass] :is(#yz-portal,.app,#yzgym,#food-app,.shell) :is(input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]),textarea,select){background-color:var(--glass-input)!important;border-color:var(--yzg-edge)!important}
html[data-yz-glass] :is(button,a,input,textarea,select,summary):focus-visible{outline:3px solid #59bfc1;outline-offset:3px}
html[data-yz-glass] #yz-portal .yz-action:not(.yz-primary):not([disabled]),html[data-yz-glass] :is(.app .secondary,.app .icon-btn){box-shadow:inset 0 1px 0 rgba(255,255,255,.12)}
html[data-yz-glass] :is(#yz-portal .yz-primary,.app .primary,#yzgym button.primary){box-shadow:inset 0 1px 0 rgba(255,255,255,.32),0 4px 14px rgba(12,54,53,.15)!important}
/* An unobtrusive control extends the existing appearance toolbar. */
html[data-yz-glass] .yz-appearance-bar{gap:10px}
html[data-yz-glass] button.yzg-open{display:inline-flex!important;align-items:center;justify-content:center;gap:8px;flex:none;min-height:44px!important;height:44px!important;width:auto!important;min-width:44px;padding:8px 12px!important;border:1px solid var(--yzg-edge)!important;border-radius:14px!important;background:rgba(255,255,255,.065)!important;color:var(--yzg-ink)!important;-webkit-text-fill-color:var(--yzg-ink)!important;font:600 12px/18px Manrope,sans-serif!important;cursor:pointer;white-space:nowrap}
.yzg-open svg{flex:none;width:18px;height:18px}
.yzg-own-bar{position:fixed;top:max(12px,env(safe-area-inset-top));right:16px;z-index:1000;display:flex;background:var(--glass-nav);border:1px solid var(--yzg-edge);border-radius:14px;backdrop-filter:blur(18px)}
html[data-yz-glass] #yz-glass-settings{box-sizing:border-box;width:calc(100% - 32px);max-width:540px;max-height:calc(100dvh - 32px);overflow:auto;padding:28px;margin:auto;border:1px solid var(--yzg-edge);border-radius:28px;color:var(--yzg-ink);font:400 14px/1.6 Manrope,sans-serif;overscroll-behavior:contain}
html[data-yz-glass] #yz-glass-settings[data-yz-theme-dialog]{padding-top:88px!important}
#yz-glass-settings *{box-sizing:border-box}
#yz-glass-settings .yzg-heading{display:flex;justify-content:space-between;align-items:start;gap:16px}
#yz-glass-settings .yzg-eyebrow{font:700 10px/1.5 Manrope,sans-serif;letter-spacing:2px;color:var(--yzg-accent);margin:0 0 8px}
#yz-glass-settings h2{font:600 clamp(28px,6vw,36px)/1.1 'Barlow Condensed',sans-serif;letter-spacing:0;margin:0 0 12px;color:var(--yzg-ink)}
#yz-glass-settings .yzg-intro{color:var(--yzg-muted);margin:0 0 24px;font:400 14px/1.6 Manrope,sans-serif}
html[data-yz-glass] #yz-glass-settings button{font:600 14px/1.45 Manrope,sans-serif;color:var(--yzg-ink);-webkit-text-fill-color:var(--yzg-ink);border:1px solid var(--yzg-edge);border-radius:12px;min-height:48px;padding:12px 16px;background:var(--yzg-inner);cursor:pointer;box-shadow:none}
html[data-yz-glass] #yz-glass-settings .yzg-close{width:44px;min-width:44px;height:44px;min-height:44px;padding:0;font-size:26px;line-height:44px;flex:none}
#yz-glass-settings fieldset{padding:0;margin:0 0 24px;border:0;min-width:0}
#yz-glass-settings legend{font-weight:600;margin:0 0 12px;padding:0}
#yz-glass-settings .yzg-scenes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
html[data-yz-glass] #yz-glass-settings [data-scene]{min-width:0;padding:4px 4px 8px;font-size:12px;display:flex;flex-direction:column;gap:8px;align-items:stretch}
#yz-glass-settings .yzg-swatch{display:block;width:100%;height:72px;object-fit:cover;background-size:cover;background-position:center;border-radius:8px}
.yzg-original{background:linear-gradient(145deg,#2d3836,#101918)}
html[data-yz-glass] #yz-glass-settings [data-scene][aria-pressed=true]{border-color:#59bfc1;outline:1px solid #59bfc1;background:rgba(89,191,193,.15)}
#yz-glass-settings .yzg-control{margin-bottom:24px}
#yz-glass-settings label{display:flex;align-items:center;justify-content:space-between;gap:12px;font:600 14px/1.5 Manrope,sans-serif;margin-bottom:4px}
#yz-glass-settings output{font-weight:600;color:var(--yzg-accent);font-variant-numeric:tabular-nums;white-space:nowrap}
#yz-glass-settings input[type=range]{display:block;width:100%;height:40px;min-height:40px;padding:0;margin:0;accent-color:#59bfc1;background:transparent;border:0;cursor:pointer;touch-action:pan-y}
#yz-glass-settings .yzg-scale{display:flex;justify-content:space-between;gap:12px;color:var(--yzg-muted);font-size:11px}
#yz-glass-settings .yzg-note{font-size:12px;line-height:1.6;color:var(--yzg-muted);margin:0 0 20px}
#yz-glass-settings .yzg-actions{display:flex;gap:12px}
#yz-glass-settings .yzg-actions button{flex:1;min-width:0}
html[data-yz-glass] #yz-glass-settings .yzg-done{background:#59bfc1;border-color:#59bfc1;color:#10292b;-webkit-text-fill-color:#10292b}
#yz-glass-settings .yz-appearance-bar .yzg-open{display:none!important}
@media(max-width:430px){html[data-yz-glass] #yz-glass-settings{padding:20px;border-radius:24px}.yzg-open span{font-size:11px}html[data-yz-glass] .yz-appearance-bar{gap:8px}#yz-glass-settings .yzg-swatch{height:60px}#yz-glass-settings .yzg-scenes{gap:6px}}
@media(prefers-reduced-transparency:reduce){html[data-yz-glass]{--yzg-alpha:.96!important;--glass-nav:#1b2623;--glass-dialog:#1b2623}html[data-yz-glass][data-yz-theme=light]{--glass-nav:#f0f7f2;--glass-dialog:#f0f7f2}}
@media(prefers-reduced-motion:reduce){#yz-glass-settings *,button.yzg-open{transition:none!important;animation:none!important}}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){html[data-yz-glass]{--glass-panel:rgba(24,32,30,.94);--glass-nav:#1b2623;--glass-dialog:#1b2623}html[data-yz-glass][data-yz-theme=light]{--glass-panel:rgba(248,252,249,.96);--glass-nav:#f0f7f2;--glass-dialog:#f0f7f2}}

/* Match the actual light canvas so the existing contrast engine chooses dark type. */
html[data-yz-glass][data-yz-theme=light] body,html[data-yz-glass] body.light{background-color:#eaf1ee!important}
html[data-yz-glass] #yz-portal .yz-demo{background:var(--glass-nav)!important;color:var(--yzg-ink)!important;border-color:var(--yzg-edge)!important;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}

html[data-yz-glass-ownbar] body{padding-top:62px!important}
html[data-yz-glass] .yzg-own-bar{inset:0 0 auto;height:62px;align-items:center;justify-content:flex-end;padding:8px 16px;border-radius:0;border-width:0 0 1px}
html[data-yz-glass] :is(#yz-time-concept,#yz-time-concept .main){background-color:transparent!important}

/* Liquid Glass 1.2: coach hints follow the actual glass theme, including
   expanded/read/empty states and email-linked hints. Keep a local contrast
   floor so bright photos remain readable at 100% transparency. */
html[data-yz-glass][data-yz-theme] #yz-portal .yz-coach-hints{
  --yzg-hint-alpha:max(.78,var(--yzg-alpha));
  background:rgba(var(--yzg-tint),var(--yzg-hint-alpha))!important;
  color:var(--yzg-ink)!important;border-color:var(--yzg-edge)!important;
}
html[data-yz-glass][data-yz-theme=light] #yz-portal .yz-coach-hints{--yzg-hint-alpha:max(.86,var(--yzg-alpha))}
html[data-yz-glass][data-yz-theme] #yz-portal .yz-coach-hints .yz-coach-hint{
  background:var(--yzg-inner)!important;color:var(--yzg-ink)!important;border-color:var(--yzg-edge)!important;
}
html[data-yz-glass][data-yz-theme] #yz-portal .yz-coach-hints :is(.yz-hints-heading,.yz-hints-empty,.yz-hint-body,.yz-hint-status,details,summary,h2,h3,p,strong,small,label){
  color:var(--yzg-ink)!important;-webkit-text-fill-color:var(--yzg-ink)!important;
}
html[data-yz-glass][data-yz-theme] #yz-portal .yz-coach-hints :is(.yz-hints-intro,.yz-hints-empty,.yz-hint-status,.yz-hint-status small){
  color:var(--yzg-muted)!important;-webkit-text-fill-color:var(--yzg-muted)!important;
}
html[data-yz-glass][data-yz-theme] #yz-portal .yz-coach-hints a{
  color:var(--yzg-accent)!important;-webkit-text-fill-color:var(--yzg-accent)!important;text-decoration:underline;text-underline-offset:3px;
}
html[data-yz-glass][data-yz-theme] #yz-portal .yz-coach-hints .yz-action:not(.yz-primary){
  background:transparent!important;color:var(--yzg-ink)!important;-webkit-text-fill-color:var(--yzg-ink)!important;border-color:var(--yzg-edge)!important;
}
