/* Canonical glass component layer for v0.60.1.
   All shared values live in design-tokens-v0601.css. Stable liquid class
   names remain as the public component API so business modules need no visual
   knowledge and existing user-approved behavior stays unchanged. */

html.dailyone-glass-v0601 body {
  background: radial-gradient(circle at 86% 4%,rgba(218,237,232,.74),transparent 31rem),linear-gradient(180deg,var(--dailyone-color-canvas-top) 0%,var(--dailyone-color-canvas-glass) 68%,var(--dailyone-color-canvas-bottom) 100%)!important;
}

html.dailyone-glass-v0601 .main { position:relative; }

html.dailyone-glass-v0601 .menu-btn {
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.86)!important;
  border-radius: var(--dailyone-radius-control-large)!important;
  background: linear-gradient(145deg,rgba(255,255,255,.78),rgba(216,233,228,.5))!important;
  box-shadow: 0 12px 30px rgba(38,57,51,.12),inset 0 1px 0 #fff,inset 0 -2px 4px rgba(90,122,112,.08)!important;
  backdrop-filter: blur(var(--dailyone-blur-control-strong)) saturate(1.4);
  -webkit-backdrop-filter: blur(var(--dailyone-blur-control-strong)) saturate(1.4);
  transition: transform var(--dailyone-duration-fast) var(--liquid-ease),box-shadow var(--dailyone-duration-fast) ease!important;
}

html.dailyone-glass-v0601 .menu-btn:active { transform:scale(.92)!important;box-shadow:0 5px 15px rgba(38,57,51,.1),inset 0 3px 7px rgba(80,111,101,.13)!important; }

html.dailyone-glass-v0601 .sidebar {
  border-right: 1px solid rgba(255,255,255,.82)!important;
  background: linear-gradient(155deg,rgba(251,252,250,.91),rgba(231,241,237,.86))!important;
  box-shadow: 24px 0 58px rgba(42,58,52,.11),inset -1px 0 0 rgba(255,255,255,.7)!important;
  backdrop-filter: blur(var(--dailyone-blur-panel)) saturate(1.28);
  -webkit-backdrop-filter: blur(var(--dailyone-blur-panel)) saturate(1.28);
}

html.dailyone-glass-v0601 .sidebar .nav {
  position: relative;
  overflow: hidden;
  border: 1px solid transparent!important;
  border-radius: var(--dailyone-radius-control)!important;
  background: transparent!important;
  transition: transform .2s var(--liquid-ease),background .22s ease,border-color .22s ease,box-shadow .22s ease!important;
}

html.dailyone-glass-v0601 .sidebar .nav.active {
  border-color: rgba(255,255,255,.84)!important;
  background: linear-gradient(135deg,rgba(255,255,255,.79),rgba(213,233,227,.58))!important;
  box-shadow: 0 9px 24px rgba(47,70,62,.11),inset 0 1px 0 #fff,inset 0 -1px 0 rgba(87,118,108,.09)!important;
}

html.dailyone-glass-v0601 .sidebar .nav:active { transform:scale(.975); }

html.dailyone-glass-v0601 .dailyone-version-badge {
  display: inline-flex;
  width: max-content;
  margin: 16px 0 4px;
  padding: 7px 10px;
  border: 1px solid rgba(255,255,255,.88);
  border-radius: var(--dailyone-radius-pill);
  background: rgba(255,255,255,.52);
  color: #6d7874;
  box-shadow: inset 0 1px 0 #fff;
  font-size: 10px;
  font-weight: 650;
  letter-spacing: .04em;
}

html.dailyone-glass-v0601 .hero h1 { color:var(--liquid-ink)!important;letter-spacing:-.046em!important; }
html.dailyone-glass-v0601 .hero p { color:var(--liquid-muted)!important; }

html.dailyone-glass-v0601 :where(.card,.shared-home-widget,.home-cooking-learning,.c516-recipe-card,.course-v53-unit,.period-care-card,.quant-simple-card).dailyone-liquid-card {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.88)!important;
  background: linear-gradient(145deg,rgba(255,255,255,.87),rgba(235,242,239,.69))!important;
  box-shadow: var(--dailyone-shadow-card)!important;
  transform-origin: var(--liquid-origin-x,50%) var(--liquid-origin-y,50%);
  transition: transform var(--dailyone-duration-normal) var(--liquid-ease),box-shadow var(--dailyone-duration-normal) ease,border-color var(--dailyone-duration-normal) ease,background var(--dailyone-duration-normal) ease!important;
}

html.dailyone-glass-v0601 #morningBrief.dailyone-liquid-card {
  background: radial-gradient(circle at 89% 12%,rgba(191,224,216,.68),transparent 34%),linear-gradient(145deg,rgba(255,255,255,.94),rgba(226,239,235,.76))!important;
  box-shadow: 0 22px 52px rgba(47,67,60,.095),inset 0 1px 0 #fff!important;
}

html.dailyone-glass-v0601 .dailyone-liquid-card.dailyone-liquid-interactive:hover {
  border-color: rgba(255,255,255,.98)!important;
  box-shadow: 0 22px 52px rgba(47,67,60,.105),inset 0 1px 0 #fff!important;
}

@media(hover:hover) and (pointer:fine){
  html.dailyone-glass-v0601 .dailyone-liquid-card.dailyone-liquid-interactive:hover { transform:translateY(-2px); }
  html.dailyone-glass-v0601 .dailyone-liquid-card.dailyone-liquid-interactive:active { transform:translateY(1px) scale(.988); }
}

html.dailyone-glass-v0601 .dailyone-liquid-control {
  --liquid-x: 50%;
  --liquid-y: 50%;
  position: relative;
  isolation: isolate;
  overflow: hidden;
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
  transition: transform var(--dailyone-duration-press) var(--liquid-ease),box-shadow var(--dailyone-duration-fast) ease,border-color var(--dailyone-duration-fast) ease,background var(--dailyone-duration-fast) ease!important;
}

/* The menu trigger is a viewport control. Keep the generic liquid-control
   positioning rule from turning it back into a document-flow element. */
html.dailyone-glass-v0601 .menu-btn.dailyone-liquid-control { position:fixed; }

html.dailyone-glass-v0601 .dailyone-liquid-control::after {
  content: "";
  position: absolute;
  z-index: -1;
  width: 130px;
  height: 130px;
  left: var(--liquid-x);
  top: var(--liquid-y);
  border-radius: 50%;
  background: radial-gradient(circle,rgba(255,255,255,.78) 0,rgba(206,232,225,.36) 38%,transparent 70%);
  opacity: 0;
  transform: translate(-50%,-50%) scale(.35);
  transition: opacity .2s ease,transform .42s var(--liquid-ease);
  pointer-events: none;
}

html.dailyone-glass-v0601 .dailyone-liquid-control.is-liquid-pressed::after { opacity:1;transform:translate(-50%,-50%) scale(1); }
html.dailyone-glass-v0601 .dailyone-liquid-control.is-liquid-pressed { transform:scale(.965); }

html.dailyone-glass-v0601 .dailyone-liquid-tier-2 {
  border: 1px solid rgba(255,255,255,.84)!important;
  color: var(--liquid-action-ink)!important;
  background: var(--liquid-action-soft)!important;
  box-shadow: var(--dailyone-shadow-control-soft)!important;
  backdrop-filter: blur(var(--dailyone-blur-control)) saturate(1.3);
  -webkit-backdrop-filter: blur(var(--dailyone-blur-control)) saturate(1.3);
  text-shadow: none!important;
}

html.dailyone-glass-v0601 .dailyone-liquid-tier-2:hover { box-shadow:0 11px 28px rgba(38,57,51,.13),inset 0 1px 0 #fff!important; }

html.dailyone-glass-v0601 .dailyone-liquid-primary:not(.done):not(.danger) {
  border: 1px solid rgba(255,255,255,.9)!important;
  color: var(--liquid-action-ink)!important;
  background: var(--liquid-action-surface)!important;
  box-shadow: var(--dailyone-shadow-control)!important;
  backdrop-filter: blur(19px) saturate(1.28);
  -webkit-backdrop-filter: blur(19px) saturate(1.28);
  text-shadow: none!important;
}

html.dailyone-glass-v0601 .dailyone-liquid-primary:not(.done):not(.danger) small {
  color: var(--liquid-action-muted)!important;
}

html.dailyone-glass-v0601 .dailyone-liquid-primary:not(.done):not(.danger):hover {
  border-color: rgba(255,255,255,.98)!important;
  box-shadow: 0 13px 31px rgba(49,76,67,.13),inset 0 1px 0 #fff!important;
}

html.dailyone-glass-v0601 .dailyone-liquid-choice.active {
  border-color: rgba(255,255,255,.9)!important;
  color: var(--liquid-action-ink)!important;
  background: linear-gradient(135deg,rgba(248,252,250,.84),rgba(210,230,224,.68))!important;
  box-shadow: 0 7px 18px rgba(58,78,71,.085),inset 0 1px 0 rgba(255,255,255,.96),inset 0 0 0 .5px rgba(131,166,155,.1)!important;
  text-shadow: none!important;
}

html.dailyone-glass-v0601 .dailyone-liquid-choice.active small {
  color: var(--liquid-action-muted)!important;
}

html.dailyone-glass-v0601 .dailyone-liquid-segment {
  position: relative!important;
  isolation: isolate;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.8)!important;
  border-radius: var(--dailyone-radius-control-large)!important;
  background: rgba(241,244,241,.68)!important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.95),0 9px 24px rgba(49,70,62,.055)!important;
  backdrop-filter: blur(17px) saturate(1.2);
  -webkit-backdrop-filter: blur(17px) saturate(1.2);
}

html.dailyone-glass-v0601 .dailyone-liquid-segment > button {
  position: relative;
  z-index: 2;
  color: #3d4542!important;
  font-family: var(--dailyone-font-sans)!important;
  font-weight: 560!important;
  letter-spacing: -.08px!important;
  -webkit-font-smoothing: antialiased;
  background: transparent!important;
  box-shadow: none!important;
  border-color: transparent!important;
  text-shadow: none!important;
  filter: none!important;
  opacity: 1!important;
}

html.dailyone-glass-v0601 .dailyone-liquid-segment > button small {
  color: #7b837f!important;
  font-family: inherit!important;
  font-weight: 450!important;
  letter-spacing: .06px!important;
  opacity: 1!important;
}

html.dailyone-glass-v0601 .dailyone-liquid-segment > button.active,
html.dailyone-glass-v0601 .dailyone-liquid-segment > button[aria-selected="true"],
html.dailyone-glass-v0601 .dailyone-liquid-segment > button[aria-pressed="true"] {
  color: #2c3432!important;
  font-weight: 610!important;
  text-shadow: 0 1px 0 rgba(255,255,255,.6)!important;
}

html.dailyone-glass-v0601 .dailyone-liquid-segment > button.active small,
html.dailyone-glass-v0601 .dailyone-liquid-segment > button[aria-selected="true"] small,
html.dailyone-glass-v0601 .dailyone-liquid-segment > button[aria-pressed="true"] small {
  color: #687570!important;
}

html.dailyone-glass-v0601 .dailyone-liquid-lens {
  position: absolute;
  z-index: 1;
  top: var(--lens-top,4px);
  left: var(--lens-left,4px);
  width: var(--lens-width,80px);
  height: var(--lens-height,calc(100% - 8px));
  border: 1px solid rgba(255,255,255,.86);
  border-radius: 16px;
  background: linear-gradient(135deg,rgba(248,252,250,.86),rgba(210,230,224,.7));
  box-shadow: 0 7px 18px rgba(58,78,71,.09),inset 0 1px 0 rgba(255,255,255,.96),inset 0 0 0 .5px rgba(131,166,155,.12);
  transition: left .38s cubic-bezier(.2,.88,.2,1),width .34s var(--liquid-ease),height .34s var(--liquid-ease),top .34s var(--liquid-ease);
  pointer-events: none;
}

html.dailyone-glass-v0601 .view.dailyone-liquid-view-enter { animation:dailyoneLiquidViewIn .58s var(--liquid-ease) both!important;transform-origin:var(--liquid-page-origin-x,50%) var(--liquid-page-origin-y,36%); }
html.dailyone-glass-v0601.liquid-page-switching .main { filter:saturate(.96); }

@keyframes dailyoneLiquidViewIn {
  from { opacity:.18;transform:translateY(10px) scale(.975);filter:blur(7px); }
  to { opacity:1;transform:none;filter:none; }
}

html.dailyone-glass-v0601 .cxw-modal.show,
html.dailyone-glass-v0601 .component-picker.show,
html.dailyone-glass-v0601 .period-choice-layer.show {
  backdrop-filter: blur(15px) saturate(1.12);
  -webkit-backdrop-filter: blur(15px) saturate(1.12);
}

html.dailyone-glass-v0601 :focus-visible { outline:2px solid rgba(83,133,120,.52)!important;outline-offset:3px; }

@media(max-width:720px){
  html.dailyone-glass-v0601 body { background:radial-gradient(circle at 92% 2%,rgba(218,237,232,.72),transparent 25rem),linear-gradient(180deg,#fafaf8,#f2f1ed)!important; }
  html.dailyone-glass-v0601 .main { padding-left:14px!important;padding-right:14px!important; }
  html.dailyone-glass-v0601 .grid { gap:11px!important; }
  html.dailyone-glass-v0601 :where(.card,.shared-home-widget,.home-cooking-learning,.c516-recipe-card,.course-v53-unit).dailyone-liquid-card {
    border-radius:24px!important;
    box-shadow:0 12px 30px rgba(47,67,60,.065),inset 0 1px 0 #fff!important;
  }
  html.dailyone-glass-v0601 .dailyone-liquid-control.is-liquid-pressed { transform:none!important;filter:brightness(.985); }
  html.dailyone-glass-v0601 .sidebar { background:linear-gradient(155deg,rgba(251,252,250,.97),rgba(231,241,237,.94))!important; }
}

@media(prefers-reduced-motion:reduce){
  html.dailyone-glass-v0601 .dailyone-liquid-control,
  html.dailyone-glass-v0601 .dailyone-liquid-card,
  html.dailyone-glass-v0601 .dailyone-liquid-lens,
  html.dailyone-glass-v0601 .view.dailyone-liquid-view-enter { animation:none!important;transition:none!important; }
}
