/* Optical material is isolated beneath content, never filtering the text. */
body.product-yogaspace-current #sequence-recommendations .ys-home-glass-filters { position:absolute; pointer-events:none; }
body.product-yogaspace-current #sequence-recommendations :is(.ys-home-resume,.ys-home-find)::before { content:none; }
body.product-yogaspace-current #sequence-recommendations .ys-home-discovery { gap:24px; }
body.product-yogaspace-current #sequence-recommendations .ys-home-find { gap:12px; }
body.product-yogaspace-current #sequence-recommendations .ys-home-flow {
  --flow-tint:146,119,194;
  --flow-ink:#624687;
  position:relative;
  isolation:isolate;
  overflow:visible;
  border:0;
  border-radius:21px;
  background:transparent;
  box-shadow:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
body.product-yogaspace-current #sequence-recommendations .ys-home-flow[data-flow-tone="beginner"] { --flow-tint:208,153,66; --flow-ink:#85591e; }
body.product-yogaspace-current #sequence-recommendations .ys-home-flow[data-flow-tone="back"] { --flow-tint:65,160,155; --flow-ink:#256861; }
/* A textured colour lens replaces the flat organic shape behind each flow. */
body.product-yogaspace-current #sequence-recommendations .ys-home-flow::before {
  content:"";
  position:absolute;
  z-index:-2;
  inset:12px 8px -4px 12px;
  border-radius:27px 40px 26px 35px;
  transform:rotate(-2deg);
  border:1px solid rgba(255,255,255,.7);
  background:
    url("ys-flow-grain.svg"),
    radial-gradient(ellipse at 8% 0%,rgba(255,255,255,.75),transparent 53%),
    radial-gradient(ellipse at 92% 95%,rgba(var(--flow-tint),.72),transparent 65%),
    linear-gradient(135deg,rgba(var(--flow-tint),.4),rgba(var(--flow-tint),.16));
  box-shadow:inset 0 2px 2px rgba(255,255,255,.9),inset -2px -3px 7px rgba(var(--flow-tint),.24),0 6px 16px rgba(var(--flow-tint),.13);
}
/* Clear central material, luminous rim, and a soft reflected underside. */
body.product-yogaspace-current #sequence-recommendations .ys-home-flow::after {
  content:"";
  position:absolute;
  z-index:-1;
  inset:0;
  border-radius:inherit;
  border:1px solid rgba(255,255,255,.86);
  background:
    url("ys-flow-grain.svg"),
    linear-gradient(115deg,rgba(255,255,255,.7),rgba(255,255,255,.16) 38%,rgba(255,255,255,.28) 75%,rgba(255,255,255,.72)),
    linear-gradient(180deg,rgba(255,255,255,.24),rgba(255,255,255,.08));
  box-shadow:inset 0 2px 1px rgba(255,255,255,.95),inset 1px 0 1px rgba(255,255,255,.75),inset 0 -2px 1px rgba(255,255,255,.75),inset -1px 0 3px rgba(var(--flow-tint),.16),0 5px 15px rgba(37,63,48,.07);
  backdrop-filter:blur(6px) saturate(145%);
  -webkit-backdrop-filter:blur(6px) saturate(145%);
  pointer-events:none;
}
@supports (backdrop-filter:url("#ys-flow-refraction")) {
  body.product-yogaspace-current #sequence-recommendations .ys-home-flow::after { backdrop-filter:url("#ys-flow-refraction"); }
}
body.product-yogaspace-current #sequence-recommendations .ys-home-flow summary { padding:13px 12px; gap:13px; border-radius:inherit; position:relative; }
body.product-yogaspace-current #sequence-recommendations .ys-home-flow__icon {
  display:grid;
  place-items:center;
  flex:none;
  width:53px;
  height:56px;
  border-radius:16px;
  color:var(--flow-ink);
  background:radial-gradient(ellipse at 20% 0%,rgba(255,255,255,.82),transparent 60%),linear-gradient(145deg,rgba(var(--flow-tint),.18),rgba(var(--flow-tint),.29));
  border:1px solid rgba(255,255,255,.8);
  box-shadow:inset 0 1px 1px white,inset 0 -1px 2px rgba(var(--flow-tint),.13),0 3px 6px rgba(var(--flow-tint),.09);
}
body.product-yogaspace-current #sequence-recommendations .ys-home-flow__icon svg { width:37px; height:37px; }
body.product-yogaspace-current #sequence-recommendations .ys-home-flow__arrow { color:var(--flow-ink); }
body.product-yogaspace-current #sequence-recommendations .ys-home-flow__copy h3 { font-size:15px; color:#263d32; }
body.product-yogaspace-current #sequence-recommendations .ys-home-flow__copy > span { color:#3b5447; }
body.product-yogaspace-current #sequence-recommendations .ys-home-flow__preview { padding:0 16px 16px 78px; }
body.product-yogaspace-current #sequence-recommendations .ys-home-flow__preview ul { color:#3b5447; }
body.product-yogaspace-current #sequence-recommendations .ys-home-flow summary:hover { background:rgba(255,255,255,.18); }
body.product-yogaspace-current #sequence-recommendations .ys-home-flow[open]::after { background-color:rgba(255,255,255,.35); }
@media(max-width:360px) {
  body.product-yogaspace-current #sequence-recommendations .ys-home-flow summary { padding:11px 10px; gap:10px; }
  body.product-yogaspace-current #sequence-recommendations .ys-home-flow__icon { width:44px; height:50px; border-radius:14px; }
  body.product-yogaspace-current #sequence-recommendations .ys-home-flow__icon svg { width:32px; height:32px; }
  body.product-yogaspace-current #sequence-recommendations .ys-home-flow__copy h3 { font-size:13px; }
  body.product-yogaspace-current #sequence-recommendations .ys-home-flow__preview { padding-left:65px; }
}
@media(prefers-reduced-transparency:reduce) {
  body.product-yogaspace-current #sequence-recommendations .ys-home-flow::after { background:#f6f8f5; backdrop-filter:none; -webkit-backdrop-filter:none; }
}
@supports not (backdrop-filter:blur(1px)) {
  body.product-yogaspace-current #sequence-recommendations .ys-home-flow::after { background:rgba(255,255,255,.9); }
}

/* A complete Home screen, at the same portrait scale as the nearby phone. */
body.product-yogaspace-current #sequence-recommendations .ys-sequence-filmstrips__panel {
  --ys-sequence-panel-inset: 20px;
  width: min(100%, 320px);
  min-height: 650px !important;
  gap: 8px;
  padding: 22px var(--ys-sequence-panel-inset) 0;
}
body.product-yogaspace-current #sequence-recommendations .ys-home-welcome { margin-bottom: 7px; }
body.product-yogaspace-current #sequence-recommendations .ys-home-card-heading {
  display: flex;
  align-items: center;
  min-height: 0;
  gap: 12px;
  padding: 12px;
}
body.product-yogaspace-current #sequence-recommendations .ys-sequence-filmstrips__title > h3 {
  margin: 0;
  color: #294535;
  font: 500 16px/1.28 Centra, sans-serif;
  letter-spacing: -.35px;
}
body.product-yogaspace-current #sequence-recommendations .ys-sequence-filmstrips__details { margin-top: 6px; }
body.product-yogaspace-current #sequence-recommendations .ys-sequence-filmstrips__energy-flow { display: block; }
body.product-yogaspace-current #sequence-recommendations .ys-sequence-filmstrips__rail {
  height: auto;
  overflow: visible;
  gap: 1px;
}
body.product-yogaspace-current #sequence-recommendations .ys-sequence-filmstrips__rail > figure {
  flex: 0 0 calc((100% - 3px) / 4);
  width: calc((100% - 3px) / 4);
}
body.product-yogaspace-current #sequence-recommendations .ys-home-discovery { gap: 16px; margin-top: 7px; }
body.product-yogaspace-current #sequence-recommendations :is(.ys-home-resume, .ys-home-find) { gap: 8px; }
body.product-yogaspace-current #sequence-recommendations .ys-home-flow .ys-home-card-heading {
  padding: 8px 10px;
  gap: 10px;
  border-radius: inherit;
}
body.product-yogaspace-current #sequence-recommendations .ys-home-flow__icon { width: 40px; height: 40px; border-radius: 12px; }
body.product-yogaspace-current #sequence-recommendations .ys-home-flow__icon svg { width: 30px; height: 30px; }
body.product-yogaspace-current #sequence-recommendations .ys-home-flow__copy h3 { font-size: 14px; }
body.product-yogaspace-current #sequence-recommendations .ys-home-flow__copy > span { margin-top: 3px; }
body.product-yogaspace-current #sequence-recommendations .ys-home-shortcuts { gap: 6px; margin: 0 0 4px; }
body.product-yogaspace-current #sequence-recommendations .ys-home-shortcuts button { min-height: 44px; padding: 7px 10px; }
body.product-yogaspace-current #sequence-recommendations .ysb-app-nav {
  flex: none;
  height: 56px !important;
  margin-top: auto;
  padding-top: 5px;
  padding-bottom: 7px;
}
@media (max-width: 360px) {
  body.product-yogaspace-current #sequence-recommendations .ys-sequence-filmstrips__panel {
    --ys-sequence-panel-inset: 16px;
    width: min(100%, 300px);
    min-height: 580px !important;
    gap: 6px;
    padding-top: 18px;
  }
  body.product-yogaspace-current #sequence-recommendations .ys-home-welcome__sun { width: 24px; height: 24px; }
  body.product-yogaspace-current #sequence-recommendations .ys-home-welcome { margin-bottom: 5px; }
  body.product-yogaspace-current #sequence-recommendations .ys-home-discovery { gap: 12px; margin-top: 5px; }
  body.product-yogaspace-current #sequence-recommendations :is(.ys-home-resume, .ys-home-find) { gap: 6px; }
  body.product-yogaspace-current #sequence-recommendations .ys-home-flow .ys-home-card-heading { padding-block: 6px; }
  body.product-yogaspace-current #sequence-recommendations .ys-home-flow__icon { width: 36px; height: 36px; }
}
