@charset "UTF-8";

/* node_modules/@ionic/angular/css/core.css */
:root {
  --ion-color-primary: #0054e9;
  --ion-color-primary-rgb:
    0,
    84,
    233;
  --ion-color-primary-contrast: #fff;
  --ion-color-primary-contrast-rgb:
    255,
    255,
    255;
  --ion-color-primary-shade: #004acd;
  --ion-color-primary-tint: #1a65eb;
  --ion-color-secondary: #0163aa;
  --ion-color-secondary-rgb:
    1,
    99,
    170;
  --ion-color-secondary-contrast: #fff;
  --ion-color-secondary-contrast-rgb:
    255,
    255,
    255;
  --ion-color-secondary-shade: #015796;
  --ion-color-secondary-tint: #1a73b3;
  --ion-color-tertiary: #6030ff;
  --ion-color-tertiary-rgb:
    96,
    48,
    255;
  --ion-color-tertiary-contrast: #fff;
  --ion-color-tertiary-contrast-rgb:
    255,
    255,
    255;
  --ion-color-tertiary-shade: #542ae0;
  --ion-color-tertiary-tint: #7045ff;
  --ion-color-success: #2dd55b;
  --ion-color-success-rgb:
    45,
    213,
    91;
  --ion-color-success-contrast: #000;
  --ion-color-success-contrast-rgb:
    0,
    0,
    0;
  --ion-color-success-shade: #28bb50;
  --ion-color-success-tint: #42d96b;
  --ion-color-warning: #ffc409;
  --ion-color-warning-rgb:
    255,
    196,
    9;
  --ion-color-warning-contrast: #000;
  --ion-color-warning-contrast-rgb:
    0,
    0,
    0;
  --ion-color-warning-shade: #e0ac08;
  --ion-color-warning-tint: #ffca22;
  --ion-color-danger: #c5000f;
  --ion-color-danger-rgb:
    197,
    0,
    15;
  --ion-color-danger-contrast: #fff;
  --ion-color-danger-contrast-rgb:
    255,
    255,
    255;
  --ion-color-danger-shade: #ad000d;
  --ion-color-danger-tint: #cb1a27;
  --ion-color-light: #f4f5f8;
  --ion-color-light-rgb:
    244,
    245,
    248;
  --ion-color-light-contrast: #000;
  --ion-color-light-contrast-rgb:
    0,
    0,
    0;
  --ion-color-light-shade: #d7d8da;
  --ion-color-light-tint: #f5f6f9;
  --ion-color-medium: #636469;
  --ion-color-medium-rgb:
    99,
    100,
    105;
  --ion-color-medium-contrast: #fff;
  --ion-color-medium-contrast-rgb:
    255,
    255,
    255;
  --ion-color-medium-shade: #57585c;
  --ion-color-medium-tint: #737478;
  --ion-color-dark: #222428;
  --ion-color-dark-rgb:
    34,
    36,
    40;
  --ion-color-dark-contrast: #fff;
  --ion-color-dark-contrast-rgb:
    255,
    255,
    255;
  --ion-color-dark-shade: #1e2023;
  --ion-color-dark-tint: #383a3e;
}
html.ios {
  --ion-default-font:
    -apple-system,
    BlinkMacSystemFont,
    "Helvetica Neue",
    "Roboto",
    sans-serif;
}
html.md {
  --ion-default-font:
    "Roboto",
    "Helvetica Neue",
    sans-serif;
}
html {
  --ion-dynamic-font: -apple-system-body;
  --ion-font-family: var(--ion-default-font);
}
body {
  background: var(--ion-background-color);
  color: var(--ion-text-color);
}
body.backdrop-no-scroll {
  overflow: hidden;
}
html.ios ion-modal.modal-card ion-header ion-toolbar:first-of-type,
html.ios ion-modal.modal-sheet ion-header ion-toolbar:first-of-type,
html.ios ion-modal ion-footer ion-toolbar:first-of-type,
html.ios ion-footer.modal-footer-moving ion-toolbar:first-of-type {
  padding-top: 6px;
}
html.ios ion-modal.modal-card ion-header ion-toolbar:last-of-type,
html.ios ion-modal.modal-sheet ion-header ion-toolbar:last-of-type {
  padding-bottom: 6px;
}
html.ios ion-modal ion-toolbar,
html.ios .modal-footer-moving ion-toolbar {
  padding-right: calc(var(--ion-safe-area-right) + 8px);
  padding-left: calc(var(--ion-safe-area-left) + 8px);
}
@media screen and (min-width: 768px) {
  html.ios ion-modal.modal-card:first-of-type {
    --backdrop-opacity: 0.18;
  }
}
ion-modal.modal-default.show-modal ~ ion-modal.modal-default {
  --backdrop-opacity: 0;
  --box-shadow: none;
}
html.ios ion-modal.modal-card .ion-page {
  border-top-left-radius: var(--border-radius);
}
.ion-color-primary {
  --ion-color-base: var(--ion-color-primary, #0054e9) !important;
  --ion-color-base-rgb: var(--ion-color-primary-rgb, 0, 84, 233) !important;
  --ion-color-contrast: var(--ion-color-primary-contrast, #fff) !important;
  --ion-color-contrast-rgb: var(--ion-color-primary-contrast-rgb, 255, 255, 255) !important;
  --ion-color-shade: var(--ion-color-primary-shade, #004acd) !important;
  --ion-color-tint: var(--ion-color-primary-tint, #1a65eb) !important;
}
.ion-color-secondary {
  --ion-color-base: var(--ion-color-secondary, #0163aa) !important;
  --ion-color-base-rgb: var(--ion-color-secondary-rgb, 1, 99, 170) !important;
  --ion-color-contrast: var(--ion-color-secondary-contrast, #fff) !important;
  --ion-color-contrast-rgb: var(--ion-color-secondary-contrast-rgb, 255, 255, 255) !important;
  --ion-color-shade: var(--ion-color-secondary-shade, #015796) !important;
  --ion-color-tint: var(--ion-color-secondary-tint, #1a73b3) !important;
}
.ion-color-tertiary {
  --ion-color-base: var(--ion-color-tertiary, #6030ff) !important;
  --ion-color-base-rgb: var(--ion-color-tertiary-rgb, 96, 48, 255) !important;
  --ion-color-contrast: var(--ion-color-tertiary-contrast, #fff) !important;
  --ion-color-contrast-rgb: var(--ion-color-tertiary-contrast-rgb, 255, 255, 255) !important;
  --ion-color-shade: var(--ion-color-tertiary-shade, #542ae0) !important;
  --ion-color-tint: var(--ion-color-tertiary-tint, #7045ff) !important;
}
.ion-color-success {
  --ion-color-base: var(--ion-color-success, #2dd55b) !important;
  --ion-color-base-rgb: var(--ion-color-success-rgb, 45, 213, 91) !important;
  --ion-color-contrast: var(--ion-color-success-contrast, #000) !important;
  --ion-color-contrast-rgb: var(--ion-color-success-contrast-rgb, 0, 0, 0) !important;
  --ion-color-shade: var(--ion-color-success-shade, #28bb50) !important;
  --ion-color-tint: var(--ion-color-success-tint, #42d96b) !important;
}
.ion-color-warning {
  --ion-color-base: var(--ion-color-warning, #ffc409) !important;
  --ion-color-base-rgb: var(--ion-color-warning-rgb, 255, 196, 9) !important;
  --ion-color-contrast: var(--ion-color-warning-contrast, #000) !important;
  --ion-color-contrast-rgb: var(--ion-color-warning-contrast-rgb, 0, 0, 0) !important;
  --ion-color-shade: var(--ion-color-warning-shade, #e0ac08) !important;
  --ion-color-tint: var(--ion-color-warning-tint, #ffca22) !important;
}
.ion-color-danger {
  --ion-color-base: var(--ion-color-danger, #c5000f) !important;
  --ion-color-base-rgb: var(--ion-color-danger-rgb, 197, 0, 15) !important;
  --ion-color-contrast: var(--ion-color-danger-contrast, #fff) !important;
  --ion-color-contrast-rgb: var(--ion-color-danger-contrast-rgb, 255, 255, 255) !important;
  --ion-color-shade: var(--ion-color-danger-shade, #ad000d) !important;
  --ion-color-tint: var(--ion-color-danger-tint, #cb1a27) !important;
}
.ion-color-light {
  --ion-color-base: var(--ion-color-light, #f4f5f8) !important;
  --ion-color-base-rgb: var(--ion-color-light-rgb, 244, 245, 248) !important;
  --ion-color-contrast: var(--ion-color-light-contrast, #000) !important;
  --ion-color-contrast-rgb: var(--ion-color-light-contrast-rgb, 0, 0, 0) !important;
  --ion-color-shade: var(--ion-color-light-shade, #d7d8da) !important;
  --ion-color-tint: var(--ion-color-light-tint, #f5f6f9) !important;
}
.ion-color-medium {
  --ion-color-base: var(--ion-color-medium, #636469) !important;
  --ion-color-base-rgb: var(--ion-color-medium-rgb, 99, 100, 105) !important;
  --ion-color-contrast: var(--ion-color-medium-contrast, #fff) !important;
  --ion-color-contrast-rgb: var(--ion-color-medium-contrast-rgb, 255, 255, 255) !important;
  --ion-color-shade: var(--ion-color-medium-shade, #57585c) !important;
  --ion-color-tint: var(--ion-color-medium-tint, #737478) !important;
}
.ion-color-dark {
  --ion-color-base: var(--ion-color-dark, #222428) !important;
  --ion-color-base-rgb: var(--ion-color-dark-rgb, 34, 36, 40) !important;
  --ion-color-contrast: var(--ion-color-dark-contrast, #fff) !important;
  --ion-color-contrast-rgb: var(--ion-color-dark-contrast-rgb, 255, 255, 255) !important;
  --ion-color-shade: var(--ion-color-dark-shade, #1e2023) !important;
  --ion-color-tint: var(--ion-color-dark-tint, #383a3e) !important;
}
.ion-page {
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  display: flex;
  position: absolute;
  flex-direction: column;
  justify-content: space-between;
  contain: layout size style;
  z-index: 0;
}
.ion-page.ion-page-overlay-passthrough {
  pointer-events: none;
}
ion-modal > .ion-page {
  position: relative;
  contain: layout style;
  height: 100%;
}
.split-pane-visible > .ion-page.split-pane-main {
  position: relative;
}
ion-route,
ion-route-redirect,
ion-router,
ion-select-option,
ion-nav-controller,
ion-menu-controller,
ion-action-sheet-controller,
ion-alert-controller,
ion-loading-controller,
ion-modal-controller,
ion-picker-controller,
ion-popover-controller,
ion-toast-controller,
.ion-page-hidden {
  display: none !important;
}
.ion-page-invisible {
  opacity: 0;
}
.can-go-back > ion-header ion-back-button {
  display: block;
}
html.plt-ios.plt-hybrid,
html.plt-ios.plt-pwa {
  --ion-statusbar-padding: 20px;
}
@supports (padding-top: 20px) {
  html {
    --ion-safe-area-top: var(--ion-statusbar-padding);
  }
}
@supports (padding-top: env(safe-area-inset-top)) {
  html {
    --ion-safe-area-top: var(--safe-area-inset-top, env(safe-area-inset-top));
    --ion-safe-area-bottom: var(--safe-area-inset-bottom, env(safe-area-inset-bottom));
    --ion-safe-area-left: var(--safe-area-inset-left, env(safe-area-inset-left));
    --ion-safe-area-right: var(--safe-area-inset-right, env(safe-area-inset-right));
  }
}
ion-card.ion-color .ion-inherit-color,
ion-card-header.ion-color .ion-inherit-color {
  color: inherit;
}
.menu-content {
  transform: translate3d(0, 0, 0);
}
.menu-content-open {
  cursor: pointer;
  touch-action: manipulation;
  pointer-events: none;
  overflow-y: hidden;
}
.menu-content-open ion-content {
  --overflow: hidden;
}
.menu-content-open .ion-content-scroll-host {
  overflow: hidden;
}
.ios .menu-content-reveal {
  box-shadow: -8px 0 42px rgba(0, 0, 0, .08);
}
[dir=rtl].ios .menu-content-reveal {
  box-shadow: 8px 0 42px rgba(0, 0, 0, .08);
}
.md .menu-content-reveal {
  box-shadow: 4px 0px 16px rgba(0, 0, 0, .18);
}
.md .menu-content-push {
  box-shadow: 4px 0px 16px rgba(0, 0, 0, .18);
}
ion-accordion-group.accordion-group-expand-inset > ion-accordion:first-of-type {
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
}
ion-accordion-group.accordion-group-expand-inset > ion-accordion:last-of-type {
  border-bottom-left-radius: 8px;
  border-bottom-right-radius: 8px;
}
ion-accordion-group > ion-accordion:last-of-type ion-item[slot=header] {
  --border-width: 0px;
}
ion-accordion.accordion-animated > [slot=header] .ion-accordion-toggle-icon {
  transition: 300ms transform cubic-bezier(0.25, 0.8, 0.5, 1);
}
@media (prefers-reduced-motion: reduce) {
  ion-accordion .ion-accordion-toggle-icon {
    transition: none !important;
  }
}
ion-accordion.accordion-expanding > [slot=header] .ion-accordion-toggle-icon,
ion-accordion.accordion-expanded > [slot=header] .ion-accordion-toggle-icon {
  transform: rotate(180deg);
}
ion-accordion-group.accordion-group-expand-inset.md > ion-accordion.accordion-previous ion-item[slot=header] {
  --border-width: 0px;
  --inner-border-width: 0px;
}
ion-accordion-group.accordion-group-expand-inset.md > ion-accordion.accordion-expanding:first-of-type,
ion-accordion-group.accordion-group-expand-inset.md > ion-accordion.accordion-expanded:first-of-type {
  margin-top: 0;
}
ion-input input::-webkit-date-and-time-value {
  text-align: start;
}
.ion-datetime-button-overlay {
  --width: fit-content;
  --height: fit-content;
}
.ion-datetime-button-overlay ion-datetime.datetime-grid {
  width: 320px;
  min-height: 320px;
}
[ion-last-focus],
header[tabindex="-1"]:focus,
[role=banner][tabindex="-1"]:focus,
main[tabindex="-1"]:focus,
[role=main][tabindex="-1"]:focus,
h1[tabindex="-1"]:focus,
[role=heading][aria-level="1"][tabindex="-1"]:focus {
  outline: none;
}
.popover-viewport:has(> ion-content) {
  overflow: hidden;
}
@supports not selector(:has(> ion-content)) {
  .popover-viewport {
    overflow: hidden;
  }
}

/* node_modules/@ionic/angular/css/normalize.css */
audio,
canvas,
progress,
video {
  vertical-align: baseline;
}
audio:not([controls]) {
  display: none;
  height: 0;
}
b,
strong {
  font-weight: bold;
}
img {
  max-width: 100%;
}
hr {
  height: 1px;
  border-width: 0;
  box-sizing: content-box;
}
pre {
  overflow: auto;
}
code,
kbd,
pre,
samp {
  font-family: monospace, monospace;
  font-size: 1em;
}
label,
input,
select,
textarea {
  font-family: inherit;
  line-height: normal;
}
textarea {
  overflow: auto;
  height: auto;
  font: inherit;
  color: inherit;
}
textarea::placeholder {
  padding-left: 2px;
}
form,
input,
optgroup,
select {
  margin: 0;
  font: inherit;
  color: inherit;
}
html input[type=button],
input[type=reset],
input[type=submit] {
  cursor: pointer;
  -webkit-appearance: button;
}
a,
a div,
a span,
a ion-icon,
a ion-label,
button,
button div,
button span,
button ion-icon,
button ion-label,
.ion-tappable,
[tappable],
[tappable] div,
[tappable] span,
[tappable] ion-icon,
[tappable] ion-label,
input,
textarea {
  touch-action: manipulation;
}
a ion-label,
button ion-label {
  pointer-events: none;
}
button {
  padding: 0;
  border: 0;
  border-radius: 0;
  font-family: inherit;
  font-style: inherit;
  font-variant: inherit;
  line-height: 1;
  text-transform: none;
  cursor: pointer;
  -webkit-appearance: button;
}
[tappable] {
  cursor: pointer;
}
a[disabled],
button[disabled],
html input[disabled] {
  cursor: default;
}
button::-moz-focus-inner,
input::-moz-focus-inner {
  padding: 0;
  border: 0;
}
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
  height: auto;
}
input[type=search]::-webkit-search-cancel-button,
input[type=search]::-webkit-search-decoration {
  -webkit-appearance: none;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}
td,
th {
  padding: 0;
}

/* node_modules/@ionic/angular/css/structure.css */
* {
  box-sizing: border-box;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
}
html {
  width: 100%;
  height: 100%;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}
html.ion-ce body {
  display: block;
}
html.plt-pwa {
  height: 100vh;
}
body {
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  margin-left: 0;
  margin-right: 0;
  margin-top: 0;
  margin-bottom: 0;
  padding-left: 0;
  padding-right: 0;
  padding-top: 0;
  padding-bottom: 0;
  position: fixed;
  width: 100%;
  max-width: 100%;
  height: 100%;
  max-height: 100%;
  transform: translateZ(0);
  text-rendering: optimizeLegibility;
  overflow: hidden;
  touch-action: manipulation;
  -webkit-user-drag: none;
  -ms-content-zooming: none;
  word-wrap: break-word;
  overscroll-behavior-y: none;
  -webkit-text-size-adjust: none;
  text-size-adjust: none;
}

/* node_modules/@ionic/angular/css/typography.css */
html {
  font-family: var(--ion-font-family);
}
@supports (-webkit-touch-callout: none) {
  html {
    font: var(--ion-dynamic-font, 16px var(--ion-font-family));
  }
}
a {
  background-color: transparent;
  color: var(--ion-color-primary, #0054e9);
}
h1,
h2,
h3,
h4,
h5,
h6 {
  margin-top: 16px;
  margin-bottom: 10px;
  font-weight: 500;
  line-height: 1.2;
}
h1 {
  margin-top: 20px;
  font-size: 1.625rem;
}
h2 {
  margin-top: 18px;
  font-size: 1.5rem;
}
h3 {
  font-size: 1.375rem;
}
h4 {
  font-size: 1.25rem;
}
h5 {
  font-size: 1.125rem;
}
h6 {
  font-size: 1rem;
}
small {
  font-size: 75%;
}
sub,
sup {
  position: relative;
  font-size: 75%;
  line-height: 0;
  vertical-align: baseline;
}
sup {
  top: -0.5em;
}
sub {
  bottom: -0.25em;
}

/* node_modules/@ionic/angular/css/display.css */
.ion-hide {
  display: none !important;
}
.ion-hide-up {
  display: none !important;
}
.ion-hide-down {
  display: none !important;
}
@media (min-width: 576px) {
  .ion-hide-sm-up {
    display: none !important;
  }
}
@media (max-width: 575.98px) {
  .ion-hide-sm-down {
    display: none !important;
  }
}
@media (min-width: 768px) {
  .ion-hide-md-up {
    display: none !important;
  }
}
@media (max-width: 767.98px) {
  .ion-hide-md-down {
    display: none !important;
  }
}
@media (min-width: 992px) {
  .ion-hide-lg-up {
    display: none !important;
  }
}
@media (max-width: 991.98px) {
  .ion-hide-lg-down {
    display: none !important;
  }
}
@media (min-width: 1200px) {
  .ion-hide-xl-up {
    display: none !important;
  }
}
@media (max-width: 1199.98px) {
  .ion-hide-xl-down {
    display: none !important;
  }
}
.ion-display-none {
  display: none !important;
}
@media (min-width: 576px) {
  .ion-display-sm-none {
    display: none !important;
  }
}
@media (min-width: 768px) {
  .ion-display-md-none {
    display: none !important;
  }
}
@media (min-width: 992px) {
  .ion-display-lg-none {
    display: none !important;
  }
}
@media (min-width: 1200px) {
  .ion-display-xl-none {
    display: none !important;
  }
}
.ion-display-inline {
  display: inline !important;
}
@media (min-width: 576px) {
  .ion-display-sm-inline {
    display: inline !important;
  }
}
@media (min-width: 768px) {
  .ion-display-md-inline {
    display: inline !important;
  }
}
@media (min-width: 992px) {
  .ion-display-lg-inline {
    display: inline !important;
  }
}
@media (min-width: 1200px) {
  .ion-display-xl-inline {
    display: inline !important;
  }
}
.ion-display-inline-block {
  display: inline-block !important;
}
@media (min-width: 576px) {
  .ion-display-sm-inline-block {
    display: inline-block !important;
  }
}
@media (min-width: 768px) {
  .ion-display-md-inline-block {
    display: inline-block !important;
  }
}
@media (min-width: 992px) {
  .ion-display-lg-inline-block {
    display: inline-block !important;
  }
}
@media (min-width: 1200px) {
  .ion-display-xl-inline-block {
    display: inline-block !important;
  }
}
.ion-display-block {
  display: block !important;
}
@media (min-width: 576px) {
  .ion-display-sm-block {
    display: block !important;
  }
}
@media (min-width: 768px) {
  .ion-display-md-block {
    display: block !important;
  }
}
@media (min-width: 992px) {
  .ion-display-lg-block {
    display: block !important;
  }
}
@media (min-width: 1200px) {
  .ion-display-xl-block {
    display: block !important;
  }
}
.ion-display-flex {
  display: flex !important;
}
@media (min-width: 576px) {
  .ion-display-sm-flex {
    display: flex !important;
  }
}
@media (min-width: 768px) {
  .ion-display-md-flex {
    display: flex !important;
  }
}
@media (min-width: 992px) {
  .ion-display-lg-flex {
    display: flex !important;
  }
}
@media (min-width: 1200px) {
  .ion-display-xl-flex {
    display: flex !important;
  }
}
.ion-display-inline-flex {
  display: inline-flex !important;
}
@media (min-width: 576px) {
  .ion-display-sm-inline-flex {
    display: inline-flex !important;
  }
}
@media (min-width: 768px) {
  .ion-display-md-inline-flex {
    display: inline-flex !important;
  }
}
@media (min-width: 992px) {
  .ion-display-lg-inline-flex {
    display: inline-flex !important;
  }
}
@media (min-width: 1200px) {
  .ion-display-xl-inline-flex {
    display: inline-flex !important;
  }
}
.ion-display-grid {
  display: grid !important;
}
@media (min-width: 576px) {
  .ion-display-sm-grid {
    display: grid !important;
  }
}
@media (min-width: 768px) {
  .ion-display-md-grid {
    display: grid !important;
  }
}
@media (min-width: 992px) {
  .ion-display-lg-grid {
    display: grid !important;
  }
}
@media (min-width: 1200px) {
  .ion-display-xl-grid {
    display: grid !important;
  }
}
.ion-display-inline-grid {
  display: inline-grid !important;
}
@media (min-width: 576px) {
  .ion-display-sm-inline-grid {
    display: inline-grid !important;
  }
}
@media (min-width: 768px) {
  .ion-display-md-inline-grid {
    display: inline-grid !important;
  }
}
@media (min-width: 992px) {
  .ion-display-lg-inline-grid {
    display: inline-grid !important;
  }
}
@media (min-width: 1200px) {
  .ion-display-xl-inline-grid {
    display: inline-grid !important;
  }
}
.ion-display-table {
  display: table !important;
}
@media (min-width: 576px) {
  .ion-display-sm-table {
    display: table !important;
  }
}
@media (min-width: 768px) {
  .ion-display-md-table {
    display: table !important;
  }
}
@media (min-width: 992px) {
  .ion-display-lg-table {
    display: table !important;
  }
}
@media (min-width: 1200px) {
  .ion-display-xl-table {
    display: table !important;
  }
}
.ion-display-table-cell {
  display: table-cell !important;
}
@media (min-width: 576px) {
  .ion-display-sm-table-cell {
    display: table-cell !important;
  }
}
@media (min-width: 768px) {
  .ion-display-md-table-cell {
    display: table-cell !important;
  }
}
@media (min-width: 992px) {
  .ion-display-lg-table-cell {
    display: table-cell !important;
  }
}
@media (min-width: 1200px) {
  .ion-display-xl-table-cell {
    display: table-cell !important;
  }
}
.ion-display-table-row {
  display: table-row !important;
}
@media (min-width: 576px) {
  .ion-display-sm-table-row {
    display: table-row !important;
  }
}
@media (min-width: 768px) {
  .ion-display-md-table-row {
    display: table-row !important;
  }
}
@media (min-width: 992px) {
  .ion-display-lg-table-row {
    display: table-row !important;
  }
}
@media (min-width: 1200px) {
  .ion-display-xl-table-row {
    display: table-row !important;
  }
}

/* node_modules/@ionic/angular/css/padding.css */
.ion-no-padding {
  --padding-start: 0;
  --padding-end: 0;
  --padding-top: 0;
  --padding-bottom: 0;
  padding-left: 0;
  padding-right: 0;
  padding-top: 0;
  padding-bottom: 0;
}
.ion-padding {
  --padding-start: var(--ion-padding, 16px);
  --padding-end: var(--ion-padding, 16px);
  --padding-top: var(--ion-padding, 16px);
  --padding-bottom: var(--ion-padding, 16px);
  -webkit-padding-start: var(--ion-padding, 16px);
  padding-inline-start: var(--ion-padding, 16px);
  -webkit-padding-end: var(--ion-padding, 16px);
  padding-inline-end: var(--ion-padding, 16px);
  padding-top: var(--ion-padding, 16px);
  padding-bottom: var(--ion-padding, 16px);
}
.ion-padding-top {
  --padding-top: var(--ion-padding, 16px);
  padding-top: var(--ion-padding, 16px);
}
.ion-padding-start {
  --padding-start: var(--ion-padding, 16px);
  -webkit-padding-start: var(--ion-padding, 16px);
  padding-inline-start: var(--ion-padding, 16px);
}
.ion-padding-end {
  --padding-end: var(--ion-padding, 16px);
  -webkit-padding-end: var(--ion-padding, 16px);
  padding-inline-end: var(--ion-padding, 16px);
}
.ion-padding-bottom {
  --padding-bottom: var(--ion-padding, 16px);
  padding-bottom: var(--ion-padding, 16px);
}
.ion-padding-vertical {
  --padding-top: var(--ion-padding, 16px);
  --padding-bottom: var(--ion-padding, 16px);
  padding-top: var(--ion-padding, 16px);
  padding-bottom: var(--ion-padding, 16px);
}
.ion-padding-horizontal {
  --padding-start: var(--ion-padding, 16px);
  --padding-end: var(--ion-padding, 16px);
  -webkit-padding-start: var(--ion-padding, 16px);
  padding-inline-start: var(--ion-padding, 16px);
  -webkit-padding-end: var(--ion-padding, 16px);
  padding-inline-end: var(--ion-padding, 16px);
}
.ion-no-margin {
  --margin-start: 0;
  --margin-end: 0;
  --margin-top: 0;
  --margin-bottom: 0;
  margin-left: 0;
  margin-right: 0;
  margin-top: 0;
  margin-bottom: 0;
}
.ion-margin {
  --margin-start: var(--ion-margin, 16px);
  --margin-end: var(--ion-margin, 16px);
  --margin-top: var(--ion-margin, 16px);
  --margin-bottom: var(--ion-margin, 16px);
  -webkit-margin-start: var(--ion-margin, 16px);
  margin-inline-start: var(--ion-margin, 16px);
  -webkit-margin-end: var(--ion-margin, 16px);
  margin-inline-end: var(--ion-margin, 16px);
  margin-top: var(--ion-margin, 16px);
  margin-bottom: var(--ion-margin, 16px);
}
.ion-margin-top {
  --margin-top: var(--ion-margin, 16px);
  margin-top: var(--ion-margin, 16px);
}
.ion-margin-start {
  --margin-start: var(--ion-margin, 16px);
  -webkit-margin-start: var(--ion-margin, 16px);
  margin-inline-start: var(--ion-margin, 16px);
}
.ion-margin-end {
  --margin-end: var(--ion-margin, 16px);
  -webkit-margin-end: var(--ion-margin, 16px);
  margin-inline-end: var(--ion-margin, 16px);
}
.ion-margin-bottom {
  --margin-bottom: var(--ion-margin, 16px);
  margin-bottom: var(--ion-margin, 16px);
}
.ion-margin-vertical {
  --margin-top: var(--ion-margin, 16px);
  --margin-bottom: var(--ion-margin, 16px);
  margin-top: var(--ion-margin, 16px);
  margin-bottom: var(--ion-margin, 16px);
}
.ion-margin-horizontal {
  --margin-start: var(--ion-margin, 16px);
  --margin-end: var(--ion-margin, 16px);
  -webkit-margin-start: var(--ion-margin, 16px);
  margin-inline-start: var(--ion-margin, 16px);
  -webkit-margin-end: var(--ion-margin, 16px);
  margin-inline-end: var(--ion-margin, 16px);
}

/* node_modules/@ionic/angular/css/float-elements.css */
.ion-float-left {
  float: left !important;
}
.ion-float-right {
  float: right !important;
}
.ion-float-start {
  float: left !important;
}
:host-context([dir=rtl]) .ion-float-start {
  float: right !important;
}
[dir=rtl] .ion-float-start {
  float: right !important;
}
@supports selector(:dir(rtl)) {
  .ion-float-start:dir(rtl) {
    float: right !important;
  }
}
.ion-float-end {
  float: right !important;
}
:host-context([dir=rtl]) .ion-float-end {
  float: left !important;
}
[dir=rtl] .ion-float-end {
  float: left !important;
}
@supports selector(:dir(rtl)) {
  .ion-float-end:dir(rtl) {
    float: left !important;
  }
}
@media (min-width: 576px) {
  .ion-float-sm-left {
    float: left !important;
  }
  .ion-float-sm-right {
    float: right !important;
  }
  .ion-float-sm-start {
    float: left !important;
  }
  :host-context([dir=rtl]) .ion-float-sm-start {
    float: right !important;
  }
  [dir=rtl] .ion-float-sm-start {
    float: right !important;
  }
  @supports selector(:dir(rtl)) {
    .ion-float-sm-start:dir(rtl) {
      float: right !important;
    }
  }
  .ion-float-sm-end {
    float: right !important;
  }
  :host-context([dir=rtl]) .ion-float-sm-end {
    float: left !important;
  }
  [dir=rtl] .ion-float-sm-end {
    float: left !important;
  }
  @supports selector(:dir(rtl)) {
    .ion-float-sm-end:dir(rtl) {
      float: left !important;
    }
  }
}
@media (min-width: 768px) {
  .ion-float-md-left {
    float: left !important;
  }
  .ion-float-md-right {
    float: right !important;
  }
  .ion-float-md-start {
    float: left !important;
  }
  :host-context([dir=rtl]) .ion-float-md-start {
    float: right !important;
  }
  [dir=rtl] .ion-float-md-start {
    float: right !important;
  }
  @supports selector(:dir(rtl)) {
    .ion-float-md-start:dir(rtl) {
      float: right !important;
    }
  }
  .ion-float-md-end {
    float: right !important;
  }
  :host-context([dir=rtl]) .ion-float-md-end {
    float: left !important;
  }
  [dir=rtl] .ion-float-md-end {
    float: left !important;
  }
  @supports selector(:dir(rtl)) {
    .ion-float-md-end:dir(rtl) {
      float: left !important;
    }
  }
}
@media (min-width: 992px) {
  .ion-float-lg-left {
    float: left !important;
  }
  .ion-float-lg-right {
    float: right !important;
  }
  .ion-float-lg-start {
    float: left !important;
  }
  :host-context([dir=rtl]) .ion-float-lg-start {
    float: right !important;
  }
  [dir=rtl] .ion-float-lg-start {
    float: right !important;
  }
  @supports selector(:dir(rtl)) {
    .ion-float-lg-start:dir(rtl) {
      float: right !important;
    }
  }
  .ion-float-lg-end {
    float: right !important;
  }
  :host-context([dir=rtl]) .ion-float-lg-end {
    float: left !important;
  }
  [dir=rtl] .ion-float-lg-end {
    float: left !important;
  }
  @supports selector(:dir(rtl)) {
    .ion-float-lg-end:dir(rtl) {
      float: left !important;
    }
  }
}
@media (min-width: 1200px) {
  .ion-float-xl-left {
    float: left !important;
  }
  .ion-float-xl-right {
    float: right !important;
  }
  .ion-float-xl-start {
    float: left !important;
  }
  :host-context([dir=rtl]) .ion-float-xl-start {
    float: right !important;
  }
  [dir=rtl] .ion-float-xl-start {
    float: right !important;
  }
  @supports selector(:dir(rtl)) {
    .ion-float-xl-start:dir(rtl) {
      float: right !important;
    }
  }
  .ion-float-xl-end {
    float: right !important;
  }
  :host-context([dir=rtl]) .ion-float-xl-end {
    float: left !important;
  }
  [dir=rtl] .ion-float-xl-end {
    float: left !important;
  }
  @supports selector(:dir(rtl)) {
    .ion-float-xl-end:dir(rtl) {
      float: left !important;
    }
  }
}

/* node_modules/@ionic/angular/css/text-alignment.css */
.ion-text-center {
  text-align: center !important;
}
.ion-text-justify {
  text-align: justify !important;
}
.ion-text-start {
  text-align: start !important;
}
.ion-text-end {
  text-align: end !important;
}
.ion-text-left {
  text-align: left !important;
}
.ion-text-right {
  text-align: right !important;
}
.ion-text-nowrap {
  white-space: nowrap !important;
}
.ion-text-wrap {
  white-space: normal !important;
}
@media (min-width: 576px) {
  .ion-text-sm-center {
    text-align: center !important;
  }
  .ion-text-sm-justify {
    text-align: justify !important;
  }
  .ion-text-sm-start {
    text-align: start !important;
  }
  .ion-text-sm-end {
    text-align: end !important;
  }
  .ion-text-sm-left {
    text-align: left !important;
  }
  .ion-text-sm-right {
    text-align: right !important;
  }
  .ion-text-sm-nowrap {
    white-space: nowrap !important;
  }
  .ion-text-sm-wrap {
    white-space: normal !important;
  }
}
@media (min-width: 768px) {
  .ion-text-md-center {
    text-align: center !important;
  }
  .ion-text-md-justify {
    text-align: justify !important;
  }
  .ion-text-md-start {
    text-align: start !important;
  }
  .ion-text-md-end {
    text-align: end !important;
  }
  .ion-text-md-left {
    text-align: left !important;
  }
  .ion-text-md-right {
    text-align: right !important;
  }
  .ion-text-md-nowrap {
    white-space: nowrap !important;
  }
  .ion-text-md-wrap {
    white-space: normal !important;
  }
}
@media (min-width: 992px) {
  .ion-text-lg-center {
    text-align: center !important;
  }
  .ion-text-lg-justify {
    text-align: justify !important;
  }
  .ion-text-lg-start {
    text-align: start !important;
  }
  .ion-text-lg-end {
    text-align: end !important;
  }
  .ion-text-lg-left {
    text-align: left !important;
  }
  .ion-text-lg-right {
    text-align: right !important;
  }
  .ion-text-lg-nowrap {
    white-space: nowrap !important;
  }
  .ion-text-lg-wrap {
    white-space: normal !important;
  }
}
@media (min-width: 1200px) {
  .ion-text-xl-center {
    text-align: center !important;
  }
  .ion-text-xl-justify {
    text-align: justify !important;
  }
  .ion-text-xl-start {
    text-align: start !important;
  }
  .ion-text-xl-end {
    text-align: end !important;
  }
  .ion-text-xl-left {
    text-align: left !important;
  }
  .ion-text-xl-right {
    text-align: right !important;
  }
  .ion-text-xl-nowrap {
    white-space: nowrap !important;
  }
  .ion-text-xl-wrap {
    white-space: normal !important;
  }
}

/* node_modules/@ionic/angular/css/text-transformation.css */
.ion-text-uppercase {
  text-transform: uppercase !important;
}
.ion-text-lowercase {
  text-transform: lowercase !important;
}
.ion-text-capitalize {
  text-transform: capitalize !important;
}
@media (min-width: 576px) {
  .ion-text-sm-uppercase {
    text-transform: uppercase !important;
  }
  .ion-text-sm-lowercase {
    text-transform: lowercase !important;
  }
  .ion-text-sm-capitalize {
    text-transform: capitalize !important;
  }
}
@media (min-width: 768px) {
  .ion-text-md-uppercase {
    text-transform: uppercase !important;
  }
  .ion-text-md-lowercase {
    text-transform: lowercase !important;
  }
  .ion-text-md-capitalize {
    text-transform: capitalize !important;
  }
}
@media (min-width: 992px) {
  .ion-text-lg-uppercase {
    text-transform: uppercase !important;
  }
  .ion-text-lg-lowercase {
    text-transform: lowercase !important;
  }
  .ion-text-lg-capitalize {
    text-transform: capitalize !important;
  }
}
@media (min-width: 1200px) {
  .ion-text-xl-uppercase {
    text-transform: uppercase !important;
  }
  .ion-text-xl-lowercase {
    text-transform: lowercase !important;
  }
  .ion-text-xl-capitalize {
    text-transform: capitalize !important;
  }
}

/* node_modules/@ionic/angular/css/flex-utils.css */
.ion-align-content-start {
  align-content: flex-start !important;
}
.ion-align-content-end {
  align-content: flex-end !important;
}
.ion-align-content-center {
  align-content: center !important;
}
.ion-align-content-between {
  align-content: space-between !important;
}
.ion-align-content-around {
  align-content: space-around !important;
}
.ion-align-content-stretch {
  align-content: stretch !important;
}
@media (min-width: 576px) {
  .ion-align-content-sm-start {
    align-content: flex-start !important;
  }
  .ion-align-content-sm-end {
    align-content: flex-end !important;
  }
  .ion-align-content-sm-center {
    align-content: center !important;
  }
  .ion-align-content-sm-between {
    align-content: space-between !important;
  }
  .ion-align-content-sm-around {
    align-content: space-around !important;
  }
  .ion-align-content-sm-stretch {
    align-content: stretch !important;
  }
}
@media (min-width: 768px) {
  .ion-align-content-md-start {
    align-content: flex-start !important;
  }
  .ion-align-content-md-end {
    align-content: flex-end !important;
  }
  .ion-align-content-md-center {
    align-content: center !important;
  }
  .ion-align-content-md-between {
    align-content: space-between !important;
  }
  .ion-align-content-md-around {
    align-content: space-around !important;
  }
  .ion-align-content-md-stretch {
    align-content: stretch !important;
  }
}
@media (min-width: 992px) {
  .ion-align-content-lg-start {
    align-content: flex-start !important;
  }
  .ion-align-content-lg-end {
    align-content: flex-end !important;
  }
  .ion-align-content-lg-center {
    align-content: center !important;
  }
  .ion-align-content-lg-between {
    align-content: space-between !important;
  }
  .ion-align-content-lg-around {
    align-content: space-around !important;
  }
  .ion-align-content-lg-stretch {
    align-content: stretch !important;
  }
}
@media (min-width: 1200px) {
  .ion-align-content-xl-start {
    align-content: flex-start !important;
  }
  .ion-align-content-xl-end {
    align-content: flex-end !important;
  }
  .ion-align-content-xl-center {
    align-content: center !important;
  }
  .ion-align-content-xl-between {
    align-content: space-between !important;
  }
  .ion-align-content-xl-around {
    align-content: space-around !important;
  }
  .ion-align-content-xl-stretch {
    align-content: stretch !important;
  }
}
.ion-align-items-start {
  align-items: start !important;
}
.ion-align-items-end {
  align-items: end !important;
}
.ion-align-items-center {
  align-items: center !important;
}
.ion-align-items-stretch {
  align-items: stretch !important;
}
.ion-align-items-baseline {
  align-items: baseline !important;
}
@media (min-width: 576px) {
  .ion-align-items-sm-start {
    align-items: start !important;
  }
  .ion-align-items-sm-end {
    align-items: end !important;
  }
  .ion-align-items-sm-center {
    align-items: center !important;
  }
  .ion-align-items-sm-stretch {
    align-items: stretch !important;
  }
  .ion-align-items-sm-baseline {
    align-items: baseline !important;
  }
}
@media (min-width: 768px) {
  .ion-align-items-md-start {
    align-items: start !important;
  }
  .ion-align-items-md-end {
    align-items: end !important;
  }
  .ion-align-items-md-center {
    align-items: center !important;
  }
  .ion-align-items-md-stretch {
    align-items: stretch !important;
  }
  .ion-align-items-md-baseline {
    align-items: baseline !important;
  }
}
@media (min-width: 992px) {
  .ion-align-items-lg-start {
    align-items: start !important;
  }
  .ion-align-items-lg-end {
    align-items: end !important;
  }
  .ion-align-items-lg-center {
    align-items: center !important;
  }
  .ion-align-items-lg-stretch {
    align-items: stretch !important;
  }
  .ion-align-items-lg-baseline {
    align-items: baseline !important;
  }
}
@media (min-width: 1200px) {
  .ion-align-items-xl-start {
    align-items: start !important;
  }
  .ion-align-items-xl-end {
    align-items: end !important;
  }
  .ion-align-items-xl-center {
    align-items: center !important;
  }
  .ion-align-items-xl-stretch {
    align-items: stretch !important;
  }
  .ion-align-items-xl-baseline {
    align-items: baseline !important;
  }
}
.ion-align-self-start {
  align-self: start !important;
}
.ion-align-self-end {
  align-self: end !important;
}
.ion-align-self-center {
  align-self: center !important;
}
.ion-align-self-stretch {
  align-self: stretch !important;
}
.ion-align-self-baseline {
  align-self: baseline !important;
}
.ion-align-self-auto {
  align-self: auto !important;
}
@media (min-width: 576px) {
  .ion-align-self-sm-start {
    align-self: start !important;
  }
  .ion-align-self-sm-end {
    align-self: end !important;
  }
  .ion-align-self-sm-center {
    align-self: center !important;
  }
  .ion-align-self-sm-stretch {
    align-self: stretch !important;
  }
  .ion-align-self-sm-baseline {
    align-self: baseline !important;
  }
  .ion-align-self-sm-auto {
    align-self: auto !important;
  }
}
@media (min-width: 768px) {
  .ion-align-self-md-start {
    align-self: start !important;
  }
  .ion-align-self-md-end {
    align-self: end !important;
  }
  .ion-align-self-md-center {
    align-self: center !important;
  }
  .ion-align-self-md-stretch {
    align-self: stretch !important;
  }
  .ion-align-self-md-baseline {
    align-self: baseline !important;
  }
  .ion-align-self-md-auto {
    align-self: auto !important;
  }
}
@media (min-width: 992px) {
  .ion-align-self-lg-start {
    align-self: start !important;
  }
  .ion-align-self-lg-end {
    align-self: end !important;
  }
  .ion-align-self-lg-center {
    align-self: center !important;
  }
  .ion-align-self-lg-stretch {
    align-self: stretch !important;
  }
  .ion-align-self-lg-baseline {
    align-self: baseline !important;
  }
  .ion-align-self-lg-auto {
    align-self: auto !important;
  }
}
@media (min-width: 1200px) {
  .ion-align-self-xl-start {
    align-self: start !important;
  }
  .ion-align-self-xl-end {
    align-self: end !important;
  }
  .ion-align-self-xl-center {
    align-self: center !important;
  }
  .ion-align-self-xl-stretch {
    align-self: stretch !important;
  }
  .ion-align-self-xl-baseline {
    align-self: baseline !important;
  }
  .ion-align-self-xl-auto {
    align-self: auto !important;
  }
}
.ion-justify-content-start {
  justify-content: flex-start !important;
}
.ion-justify-content-end {
  justify-content: flex-end !important;
}
.ion-justify-content-center {
  justify-content: center !important;
}
.ion-justify-content-between {
  justify-content: space-between !important;
}
.ion-justify-content-around {
  justify-content: space-around !important;
}
.ion-justify-content-evenly {
  justify-content: space-evenly !important;
}
@media (min-width: 576px) {
  .ion-justify-content-sm-start {
    justify-content: flex-start !important;
  }
  .ion-justify-content-sm-end {
    justify-content: flex-end !important;
  }
  .ion-justify-content-sm-center {
    justify-content: center !important;
  }
  .ion-justify-content-sm-between {
    justify-content: space-between !important;
  }
  .ion-justify-content-sm-around {
    justify-content: space-around !important;
  }
  .ion-justify-content-sm-evenly {
    justify-content: space-evenly !important;
  }
}
@media (min-width: 768px) {
  .ion-justify-content-md-start {
    justify-content: flex-start !important;
  }
  .ion-justify-content-md-end {
    justify-content: flex-end !important;
  }
  .ion-justify-content-md-center {
    justify-content: center !important;
  }
  .ion-justify-content-md-between {
    justify-content: space-between !important;
  }
  .ion-justify-content-md-around {
    justify-content: space-around !important;
  }
  .ion-justify-content-md-evenly {
    justify-content: space-evenly !important;
  }
}
@media (min-width: 992px) {
  .ion-justify-content-lg-start {
    justify-content: flex-start !important;
  }
  .ion-justify-content-lg-end {
    justify-content: flex-end !important;
  }
  .ion-justify-content-lg-center {
    justify-content: center !important;
  }
  .ion-justify-content-lg-between {
    justify-content: space-between !important;
  }
  .ion-justify-content-lg-around {
    justify-content: space-around !important;
  }
  .ion-justify-content-lg-evenly {
    justify-content: space-evenly !important;
  }
}
@media (min-width: 1200px) {
  .ion-justify-content-xl-start {
    justify-content: flex-start !important;
  }
  .ion-justify-content-xl-end {
    justify-content: flex-end !important;
  }
  .ion-justify-content-xl-center {
    justify-content: center !important;
  }
  .ion-justify-content-xl-between {
    justify-content: space-between !important;
  }
  .ion-justify-content-xl-around {
    justify-content: space-around !important;
  }
  .ion-justify-content-xl-evenly {
    justify-content: space-evenly !important;
  }
}
.ion-flex-row {
  flex-direction: row !important;
}
.ion-flex-row-reverse {
  flex-direction: row-reverse !important;
}
.ion-flex-column {
  flex-direction: column !important;
}
.ion-flex-column-reverse {
  flex-direction: column-reverse !important;
}
@media (min-width: 576px) {
  .ion-flex-sm-row {
    flex-direction: row !important;
  }
  .ion-flex-sm-row-reverse {
    flex-direction: row-reverse !important;
  }
  .ion-flex-sm-column {
    flex-direction: column !important;
  }
  .ion-flex-sm-column-reverse {
    flex-direction: column-reverse !important;
  }
}
@media (min-width: 768px) {
  .ion-flex-md-row {
    flex-direction: row !important;
  }
  .ion-flex-md-row-reverse {
    flex-direction: row-reverse !important;
  }
  .ion-flex-md-column {
    flex-direction: column !important;
  }
  .ion-flex-md-column-reverse {
    flex-direction: column-reverse !important;
  }
}
@media (min-width: 992px) {
  .ion-flex-lg-row {
    flex-direction: row !important;
  }
  .ion-flex-lg-row-reverse {
    flex-direction: row-reverse !important;
  }
  .ion-flex-lg-column {
    flex-direction: column !important;
  }
  .ion-flex-lg-column-reverse {
    flex-direction: column-reverse !important;
  }
}
@media (min-width: 1200px) {
  .ion-flex-xl-row {
    flex-direction: row !important;
  }
  .ion-flex-xl-row-reverse {
    flex-direction: row-reverse !important;
  }
  .ion-flex-xl-column {
    flex-direction: column !important;
  }
  .ion-flex-xl-column-reverse {
    flex-direction: column-reverse !important;
  }
}
.ion-wrap {
  flex-wrap: wrap !important;
}
.ion-nowrap {
  flex-wrap: nowrap !important;
}
.ion-wrap-reverse {
  flex-wrap: wrap-reverse !important;
}
.ion-flex-wrap {
  flex-wrap: wrap !important;
}
.ion-flex-nowrap {
  flex-wrap: nowrap !important;
}
.ion-flex-wrap-reverse {
  flex-wrap: wrap-reverse !important;
}
@media (min-width: 576px) {
  .ion-flex-sm-wrap {
    flex-wrap: wrap !important;
  }
  .ion-flex-sm-nowrap {
    flex-wrap: nowrap !important;
  }
  .ion-flex-sm-wrap-reverse {
    flex-wrap: wrap-reverse !important;
  }
}
@media (min-width: 768px) {
  .ion-flex-md-wrap {
    flex-wrap: wrap !important;
  }
  .ion-flex-md-nowrap {
    flex-wrap: nowrap !important;
  }
  .ion-flex-md-wrap-reverse {
    flex-wrap: wrap-reverse !important;
  }
}
@media (min-width: 992px) {
  .ion-flex-lg-wrap {
    flex-wrap: wrap !important;
  }
  .ion-flex-lg-nowrap {
    flex-wrap: nowrap !important;
  }
  .ion-flex-lg-wrap-reverse {
    flex-wrap: wrap-reverse !important;
  }
}
@media (min-width: 1200px) {
  .ion-flex-xl-wrap {
    flex-wrap: wrap !important;
  }
  .ion-flex-xl-nowrap {
    flex-wrap: nowrap !important;
  }
  .ion-flex-xl-wrap-reverse {
    flex-wrap: wrap-reverse !important;
  }
}
.ion-flex-1 {
  flex: 1 !important;
}
.ion-flex-auto {
  flex: auto !important;
}
.ion-flex-initial {
  flex: initial !important;
}
.ion-flex-none {
  flex: none !important;
}
@media (min-width: 576px) {
  .ion-flex-sm-1 {
    flex: 1 !important;
  }
  .ion-flex-sm-auto {
    flex: auto !important;
  }
  .ion-flex-sm-initial {
    flex: initial !important;
  }
  .ion-flex-sm-none {
    flex: none !important;
  }
}
@media (min-width: 768px) {
  .ion-flex-md-1 {
    flex: 1 !important;
  }
  .ion-flex-md-auto {
    flex: auto !important;
  }
  .ion-flex-md-initial {
    flex: initial !important;
  }
  .ion-flex-md-none {
    flex: none !important;
  }
}
@media (min-width: 992px) {
  .ion-flex-lg-1 {
    flex: 1 !important;
  }
  .ion-flex-lg-auto {
    flex: auto !important;
  }
  .ion-flex-lg-initial {
    flex: initial !important;
  }
  .ion-flex-lg-none {
    flex: none !important;
  }
}
@media (min-width: 1200px) {
  .ion-flex-xl-1 {
    flex: 1 !important;
  }
  .ion-flex-xl-auto {
    flex: auto !important;
  }
  .ion-flex-xl-initial {
    flex: initial !important;
  }
  .ion-flex-xl-none {
    flex: none !important;
  }
}
.ion-flex-grow-0 {
  flex-grow: 0 !important;
}
.ion-flex-grow-1 {
  flex-grow: 1 !important;
}
.ion-flex-shrink-0 {
  flex-shrink: 0 !important;
}
.ion-flex-shrink-1 {
  flex-shrink: 1 !important;
}
@media (min-width: 576px) {
  .ion-flex-sm-grow-0 {
    flex-grow: 0 !important;
  }
  .ion-flex-sm-grow-1 {
    flex-grow: 1 !important;
  }
  .ion-flex-sm-shrink-0 {
    flex-shrink: 0 !important;
  }
  .ion-flex-sm-shrink-1 {
    flex-shrink: 1 !important;
  }
}
@media (min-width: 768px) {
  .ion-flex-md-grow-0 {
    flex-grow: 0 !important;
  }
  .ion-flex-md-grow-1 {
    flex-grow: 1 !important;
  }
  .ion-flex-md-shrink-0 {
    flex-shrink: 0 !important;
  }
  .ion-flex-md-shrink-1 {
    flex-shrink: 1 !important;
  }
}
@media (min-width: 992px) {
  .ion-flex-lg-grow-0 {
    flex-grow: 0 !important;
  }
  .ion-flex-lg-grow-1 {
    flex-grow: 1 !important;
  }
  .ion-flex-lg-shrink-0 {
    flex-shrink: 0 !important;
  }
  .ion-flex-lg-shrink-1 {
    flex-shrink: 1 !important;
  }
}
@media (min-width: 1200px) {
  .ion-flex-xl-grow-0 {
    flex-grow: 0 !important;
  }
  .ion-flex-xl-grow-1 {
    flex-grow: 1 !important;
  }
  .ion-flex-xl-shrink-0 {
    flex-shrink: 0 !important;
  }
  .ion-flex-xl-shrink-1 {
    flex-shrink: 1 !important;
  }
}
.ion-order-first {
  order: -1 !important;
}
.ion-order-0 {
  order: 0 !important;
}
.ion-order-1 {
  order: 1 !important;
}
.ion-order-2 {
  order: 2 !important;
}
.ion-order-3 {
  order: 3 !important;
}
.ion-order-4 {
  order: 4 !important;
}
.ion-order-5 {
  order: 5 !important;
}
.ion-order-6 {
  order: 6 !important;
}
.ion-order-7 {
  order: 7 !important;
}
.ion-order-8 {
  order: 8 !important;
}
.ion-order-9 {
  order: 9 !important;
}
.ion-order-10 {
  order: 10 !important;
}
.ion-order-11 {
  order: 11 !important;
}
.ion-order-12 {
  order: 12 !important;
}
.ion-order-last {
  order: 13 !important;
}
@media (min-width: 576px) {
  .ion-order-sm-first {
    order: -1 !important;
  }
  .ion-order-sm-0 {
    order: 0 !important;
  }
  .ion-order-sm-1 {
    order: 1 !important;
  }
  .ion-order-sm-2 {
    order: 2 !important;
  }
  .ion-order-sm-3 {
    order: 3 !important;
  }
  .ion-order-sm-4 {
    order: 4 !important;
  }
  .ion-order-sm-5 {
    order: 5 !important;
  }
  .ion-order-sm-6 {
    order: 6 !important;
  }
  .ion-order-sm-7 {
    order: 7 !important;
  }
  .ion-order-sm-8 {
    order: 8 !important;
  }
  .ion-order-sm-9 {
    order: 9 !important;
  }
  .ion-order-sm-10 {
    order: 10 !important;
  }
  .ion-order-sm-11 {
    order: 11 !important;
  }
  .ion-order-sm-12 {
    order: 12 !important;
  }
  .ion-order-sm-last {
    order: 13 !important;
  }
}
@media (min-width: 768px) {
  .ion-order-md-first {
    order: -1 !important;
  }
  .ion-order-md-0 {
    order: 0 !important;
  }
  .ion-order-md-1 {
    order: 1 !important;
  }
  .ion-order-md-2 {
    order: 2 !important;
  }
  .ion-order-md-3 {
    order: 3 !important;
  }
  .ion-order-md-4 {
    order: 4 !important;
  }
  .ion-order-md-5 {
    order: 5 !important;
  }
  .ion-order-md-6 {
    order: 6 !important;
  }
  .ion-order-md-7 {
    order: 7 !important;
  }
  .ion-order-md-8 {
    order: 8 !important;
  }
  .ion-order-md-9 {
    order: 9 !important;
  }
  .ion-order-md-10 {
    order: 10 !important;
  }
  .ion-order-md-11 {
    order: 11 !important;
  }
  .ion-order-md-12 {
    order: 12 !important;
  }
  .ion-order-md-last {
    order: 13 !important;
  }
}
@media (min-width: 992px) {
  .ion-order-lg-first {
    order: -1 !important;
  }
  .ion-order-lg-0 {
    order: 0 !important;
  }
  .ion-order-lg-1 {
    order: 1 !important;
  }
  .ion-order-lg-2 {
    order: 2 !important;
  }
  .ion-order-lg-3 {
    order: 3 !important;
  }
  .ion-order-lg-4 {
    order: 4 !important;
  }
  .ion-order-lg-5 {
    order: 5 !important;
  }
  .ion-order-lg-6 {
    order: 6 !important;
  }
  .ion-order-lg-7 {
    order: 7 !important;
  }
  .ion-order-lg-8 {
    order: 8 !important;
  }
  .ion-order-lg-9 {
    order: 9 !important;
  }
  .ion-order-lg-10 {
    order: 10 !important;
  }
  .ion-order-lg-11 {
    order: 11 !important;
  }
  .ion-order-lg-12 {
    order: 12 !important;
  }
  .ion-order-lg-last {
    order: 13 !important;
  }
}
@media (min-width: 1200px) {
  .ion-order-xl-first {
    order: -1 !important;
  }
  .ion-order-xl-0 {
    order: 0 !important;
  }
  .ion-order-xl-1 {
    order: 1 !important;
  }
  .ion-order-xl-2 {
    order: 2 !important;
  }
  .ion-order-xl-3 {
    order: 3 !important;
  }
  .ion-order-xl-4 {
    order: 4 !important;
  }
  .ion-order-xl-5 {
    order: 5 !important;
  }
  .ion-order-xl-6 {
    order: 6 !important;
  }
  .ion-order-xl-7 {
    order: 7 !important;
  }
  .ion-order-xl-8 {
    order: 8 !important;
  }
  .ion-order-xl-9 {
    order: 9 !important;
  }
  .ion-order-xl-10 {
    order: 10 !important;
  }
  .ion-order-xl-11 {
    order: 11 !important;
  }
  .ion-order-xl-12 {
    order: 12 !important;
  }
  .ion-order-xl-last {
    order: 13 !important;
  }
}

/* src/global.scss */
:root {
  --ion-color-primary: #7a9e63;
  --ion-color-primary-rgb:
    122,
    158,
    99;
  --ion-color-primary-contrast: #fff;
  --ion-color-primary-contrast-rgb:
    255,
    255,
    255;
  --ion-color-primary-shade: #6b8b57;
  --ion-color-primary-tint: #87a873;
  --ion-color-secondary: #4a90e2;
  --ion-color-secondary-rgb:
    74,
    144,
    226;
  --ion-color-secondary-contrast: #fff;
  --ion-color-secondary-contrast-rgb:
    255,
    255,
    255;
  --ion-color-secondary-shade: #3c8dc7;
  --ion-color-secondary-tint: #56a8e5;
  --ion-color-tertiary: #dd6b7e;
  --ion-color-tertiary-rgb:
    221,
    107,
    126;
  --ion-color-tertiary-contrast: #fff;
  --ion-color-tertiary-contrast-rgb:
    255,
    255,
    255;
  --ion-color-tertiary-shade: #b85b6f;
  --ion-color-tertiary-tint: #d6798c;
  --ion-color-success: #7a9e63;
  --ion-color-success-rgb:
    122,
    158,
    99;
  --ion-color-success-contrast: #fff;
  --ion-color-success-contrast-rgb:
    255,
    255,
    255;
  --ion-color-success-shade: #6b8b57;
  --ion-color-success-tint: #87a873;
  --ion-color-warning: #ffd540;
  --ion-color-warning-rgb:
    255,
    213,
    64;
  --ion-color-warning-contrast: #141414;
  --ion-color-warning-contrast-rgb:
    20,
    20,
    20;
  --ion-color-warning-shade: #e0bb38;
  --ion-color-warning-tint: #ffd950;
  --ion-color-danger: #c85a54;
  --ion-color-danger-rgb:
    200,
    90,
    84;
  --ion-color-danger-contrast: #fff;
  --ion-color-danger-contrast-rgb:
    255,
    255,
    255;
  --ion-color-danger-shade: #b14e4a;
  --ion-color-danger-tint: #d06e68;
  --ion-color-dark: #141414;
  --ion-color-dark-rgb:
    20,
    20,
    20;
  --ion-color-dark-contrast: #fff;
  --ion-color-dark-contrast-rgb:
    255,
    255,
    255;
  --ion-color-dark-shade: #121212;
  --ion-color-dark-tint: #2a2a2a;
  --ion-color-medium: #a0a0a0;
  --ion-color-medium-rgb:
    160,
    160,
    160;
  --ion-color-medium-contrast: #fff;
  --ion-color-medium-contrast-rgb:
    255,
    255,
    255;
  --ion-color-medium-shade: #8d8d8d;
  --ion-color-medium-tint: #a9a9a9;
  --ion-color-light: #f5f8f7;
  --ion-color-light-rgb:
    245,
    248,
    247;
  --ion-color-light-contrast: #141414;
  --ion-color-light-contrast-rgb:
    20,
    20,
    20;
  --ion-color-light-shade: #d7d7d9;
  --ion-color-light-tint: #f6f6f8;
  --ion-background-color: #fff;
  --ion-background-color-rgb:
    255,
    255,
    255;
  --ion-text-color: #141414;
  --ion-text-color-rgb:
    20,
    20,
    20;
  --ion-card-background: #fff;
  --ion-item-background: #fff;
  --app-canvas: #fff;
  --app-surface: #fff;
  --app-surface-muted: #f2f2f2;
  --app-surface-raised: #fff;
  --app-text: #141414;
  --app-text-muted: #717171;
  --app-border: #e6e6e6;
  --app-overlay: rgb(20 20 20 / 48%);
  --card-background-rgb:
    255,
    255,
    255;
  --ion-color-step-50: #f2f2f2;
  --ion-color-step-100: #e6e6e6;
  --ion-color-step-150: #d9d9d9;
  --ion-color-step-200: #ccc;
  --ion-color-step-250: #bfbfbf;
  --ion-color-step-300: #b3b3b3;
  --ion-color-step-350: #a6a6a6;
  --ion-color-step-400: #999;
  --ion-color-step-450: #8c8c8c;
  --ion-color-step-500: #808080;
  --ion-color-step-550: #737373;
  --ion-color-step-600: #666;
  --ion-color-step-650: #595959;
  --ion-color-step-700: #4d4d4d;
  --ion-color-step-750: #404040;
  --ion-color-step-800: #333;
  --ion-color-step-850: #262626;
  --ion-color-step-900: #1a1a1a;
  --ion-color-step-950: #0d0d0d;
  --shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.1);
  --shadow-md: 0 4px 4px 0 rgba(0, 0, 0, 0.15);
  --shadow-xs: 0 -3px 4px 0 rgba(0, 0, 0, 0.1);
  --filter-circle-color: #50703d;
  --filter-circle-color-active: #3d5530;
  --filter-circle-color-focus: #6a8a57;
  --ion-color-discount-pink: #e91e63;
  --ion-color-tomorrow-availablity: #8a6a00;
  --article-pullquote-bg: rgba(221, 107, 126, 0.12);
  --article-pullquote-mark: #dd6b7e;
  --article-whisper-text: #b85b6f;
  --article-nick-text: #dd6b7e;
  --article-video-bg: #141414;
  --article-table-bg-odd: rgba(122, 158, 99, 0.06);
  --article-takeaway-pink-bg: rgba(221, 107, 126, 0.1);
  --article-takeaway-pink-border: #dd6b7e;
  --article-heading-border: #dd6b7e;
  --article-byline-bg:
    linear-gradient(
      145deg,
      #fef9f4 0%,
      #f5ede0 100%);
  --article-byline-avatar-author-bg: #e57070;
  --article-byline-avatar-reviewer-bg: #3d7a5e;
  --article-medical-review-bg: rgb(60 152 100 / 8%);
  --article-medical-review-text: #6b8b57;
  --article-title-color: #141414;
  --article-tag-hash-color: #d4637a;
  --article-audio-player-bg: #f8fbf6;
  --article-audio-player-primary: #71975f;
  --article-audio-player-text: #263322;
  --article-audio-player-muted: #687364;
  --article-audio-player-track: #dce8d7;
  --article-audio-player-border: rgb(113 151 95 / 24%);
  --article-audio-player-shadow: 0 12px 32px rgb(49 74 38 / 12%);
}
.ion-palette-dark {
  --ion-color-primary: #9bc381;
  --ion-color-primary-rgb:
    155,
    195,
    129;
  --ion-color-primary-contrast: #000;
  --ion-color-primary-contrast-rgb:
    0,
    0,
    0;
  --ion-color-primary-shade: #88ac72;
  --ion-color-primary-tint: #a5c98e;
  --ion-color-secondary: #6bb5f0;
  --ion-color-secondary-rgb:
    107,
    181,
    240;
  --ion-color-secondary-contrast: #000;
  --ion-color-secondary-contrast-rgb:
    0,
    0,
    0;
  --ion-color-secondary-shade: #5e9fd3;
  --ion-color-secondary-tint: #7abcf2;
  --ion-color-tertiary: #e99aa8;
  --ion-color-tertiary-rgb:
    233,
    154,
    168;
  --ion-color-tertiary-contrast: #000;
  --ion-color-tertiary-contrast-rgb:
    0,
    0,
    0;
  --ion-color-tertiary-shade: #cd8894;
  --ion-color-tertiary-tint: #eba4b1;
  --ion-color-success: #9bc381;
  --ion-color-success-rgb:
    155,
    195,
    129;
  --ion-color-success-contrast: #000;
  --ion-color-success-contrast-rgb:
    0,
    0,
    0;
  --ion-color-success-shade: #88ac72;
  --ion-color-success-tint: #a5c98e;
  --ion-color-warning: #ffd966;
  --ion-color-warning-rgb:
    255,
    217,
    102;
  --ion-color-warning-contrast: #000;
  --ion-color-warning-contrast-rgb:
    0,
    0,
    0;
  --ion-color-warning-shade: #e0bf5a;
  --ion-color-warning-tint: #ffdd75;
  --ion-color-danger: #d87369;
  --ion-color-danger-rgb:
    216,
    115,
    105;
  --ion-color-danger-contrast: #000;
  --ion-color-danger-contrast-rgb:
    0,
    0,
    0;
  --ion-color-danger-shade: #c0655c;
  --ion-color-danger-tint: #dd8379;
  --ion-color-dark: #e8e8e8;
  --ion-color-dark-rgb:
    232,
    232,
    232;
  --ion-color-dark-contrast: #000;
  --ion-color-dark-contrast-rgb:
    0,
    0,
    0;
  --ion-color-dark-shade: #ccc;
  --ion-color-dark-tint: #eaeaea;
  --ion-color-medium: #9e9e9e;
  --ion-color-medium-rgb:
    158,
    158,
    158;
  --ion-color-medium-contrast: #000;
  --ion-color-medium-contrast-rgb:
    0,
    0,
    0;
  --ion-color-medium-shade: #8b8b8b;
  --ion-color-medium-tint: #a8a8a8;
  --ion-color-light: #2c2c2c;
  --ion-color-light-rgb:
    44,
    44,
    44;
  --ion-color-light-contrast: #fff;
  --ion-color-light-contrast-rgb:
    255,
    255,
    255;
  --ion-color-light-shade: #272727;
  --ion-color-light-tint: #414141;
  --ion-background-color: #1a1a1a;
  --ion-background-color-rgb:
    26,
    26,
    26;
  --ion-text-color: #e8e8e8;
  --ion-text-color-rgb:
    232,
    232,
    232;
  --ion-card-background: #242424;
  --ion-item-background: #242424;
  --app-canvas: #1a1a1a;
  --app-surface: #242424;
  --app-surface-muted: #1f1f1f;
  --app-surface-raised: #2a2a2a;
  --app-text: #e8e8e8;
  --app-text-muted: #9e9e9e;
  --app-border: #363636;
  --app-overlay: rgb(0 0 0 / 68%);
  --card-background-rgb:
    20,
    20,
    20;
  --ion-color-step-50: #1f1f1f;
  --ion-color-step-100: #2a2a2a;
  --ion-color-step-150: #363636;
  --ion-color-step-200: #414141;
  --ion-color-step-250: #4d4d4d;
  --ion-color-step-300: #585858;
  --ion-color-step-350: #636363;
  --ion-color-step-400: #6f6f6f;
  --ion-color-step-450: #7a7a7a;
  --ion-color-step-500: #868686;
  --ion-color-step-550: #919191;
  --ion-color-step-600: #9d9d9d;
  --ion-color-step-650: #a8a8a8;
  --ion-color-step-700: #b4b4b4;
  --ion-color-step-750: #bfbfbf;
  --ion-color-step-800: #cacaca;
  --ion-color-step-850: #d6d6d6;
  --ion-color-step-900: #e1e1e1;
  --ion-color-step-950: #ededed;
  --shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 30%);
  --shadow-md: 0 4px 4px 0 rgb(0 0 0 / 40%);
  --shadow-xs: 0 -3px 4px 0 rgba(0, 0, 0, 0.1);
  --filter-circle-color: #50703d;
  --filter-circle-color-active: #3d5530;
  --filter-circle-color-focus: #6a8a57;
  --ion-color-discount-pink: #e91e63;
  --ion-color-tomorrow-availablity: #8a6a00;
  --article-pullquote-bg: rgba(233, 154, 168, 0.15);
  --article-pullquote-mark: #e99aa8;
  --article-whisper-text: #e99aa8;
  --article-nick-text: #e99aa8;
  --article-video-bg: #e8e8e8;
  --article-table-bg-odd: rgba(155, 195, 129, 0.1);
  --article-takeaway-pink-bg: rgba(233, 154, 168, 0.15);
  --article-takeaway-pink-border: #e99aa8;
  --article-heading-border: #e99aa8;
  --article-byline-bg:
    linear-gradient(
      
      145deg,
      rgba(155, 195, 129, 0.1),
      rgba(155, 195, 129, 0.05) );
  --article-byline-avatar-author-bg: #ff8fa8;
  --article-byline-avatar-reviewer-bg: #7fb0a0;
  --article-medical-review-bg: rgba(60, 60, 60, 0.5);
  --article-medical-review-text: #ffd966;
  --article-title-color: #e8e8e8;
  --article-tag-hash-color: #ff8fa8;
  --article-audio-player-bg: rgba(30, 30, 30, 0.95);
  --article-audio-player-primary: #ff8fa8;
  --article-audio-player-text: #e8e8e8;
  --article-audio-player-muted: #9e9e9e;
  --article-audio-player-track: rgba(255, 255, 255, 0.16);
  --article-audio-player-border: rgba(255, 255, 255, 0.12);
  --article-audio-player-shadow: 0 12px 32px rgb(0 0 0 / 30%);
}
ion-app {
  text-rendering: optimizelegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
ion-content {
  line-height: 1.5;
}
@font-face {
  font-family: Gilroy-Regular;
  src: url(/assets/fonts/Gilroy-Regular.ttf) format("truetype");
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: Gilroy-SemiBold;
  src: url(/assets/fonts/Gilroy-SemiBold.ttf) format("truetype");
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: Gilroy-Bold;
  src: url(/assets/fonts/Gilroy-Bold.ttf) format("truetype");
  font-style: normal;
  font-display: swap;
}
:root {
  --font-fallback:
    -apple-system,
    blinkmacsystemfont,
    "Segoe UI",
    roboto,
    "Helvetica Neue",
    arial,
    sans-serif;
  --font-fallback-bengali: "Noto Sans Bengali", var(--font-fallback);
  --font-family-regular: "Gilroy-Regular", var(--font-fallback);
  --font-family-semibold: "Gilroy-SemiBold", var(--font-fallback);
  --font-family-bold: "Gilroy-Bold", var(--font-fallback);
  --font-heading: var(--font-family-bold);
  --font-subheading: var(--font-family-semibold);
  --font-body: var(--font-family-regular);
}
html.locale-bn {
  --font-family-regular: "Noto Sans Bengali", var(--font-fallback);
  --font-family-semibold: "Noto Sans Bengali", var(--font-fallback);
  --font-family-bold: "Noto Sans Bengali", var(--font-fallback);
  --font-heading: var(--font-family-bold);
  --font-subheading: var(--font-family-semibold);
  --font-body: var(--font-family-regular);
}
:root {
  --radius-none: 0;
  --radius-sm: 0.25rem;
  --radius-md: 0.375rem;
  --radius-lg: 0.625rem;
  --radius-xl: 0.75rem;
  --radius-2xl: 1rem;
  --radius-3xl: 1.25rem;
  --radius-full: 9999px;
  --font-weight-light: 300;
  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;
  --font-size-xs: 0.75rem;
  --font-size-sm: 0.875rem;
  --font-size-base: 1rem;
  --font-size-lg: 1.125rem;
  --font-size-xl: 1.25rem;
  --font-size-2xl: 1.5rem;
  --spacing-xs: 0.25rem;
  --spacing-sm: 0.5rem;
  --spacing-md: 1rem;
  --spacing-lg: 1.5rem;
  --spacing-xl: 2rem;
  --spacing-2xl: 2.5rem;
  --input-height: 3.25rem;
  --input-height-sm: 2.5rem;
  --button-height: 3rem;
  --button-height-sm: 2.5rem;
  --toolbar-height: 3.75rem;
  --border-sm: 0.125rem;
  --border-lg: 0.25rem;
  --border-md: 0.1875rem;
}
input[type=date]::-webkit-calendar-picker-indicator {
  opacity: 0 !important;
  appearance: none !important;
  background: transparent !important;
  background-image: none !important;
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  cursor: pointer !important;
}
input[type=date]::-webkit-inner-spin-button,
input[type=date]::-webkit-outer-spin-button {
  display: none !important;
  appearance: none !important;
  margin: 0 !important;
}
input[type=date]::-ms-clear {
  display: none !important;
}
input[type=date]::-webkit-datetime-edit {
  color: transparent;
}
input[type=date]::-webkit-datetime-edit-fields-wrapper {
  color: transparent;
}
input[type=date]::-webkit-datetime-edit-text {
  color: transparent;
  padding: 0;
}
input[type=date]::-webkit-datetime-edit-month-field {
  color: transparent;
}
input[type=date]::-webkit-datetime-edit-day-field {
  color: transparent;
}
input[type=date]::-webkit-datetime-edit-year-field {
  color: transparent;
}
input[type=date]::-webkit-date-and-time-value {
  color: transparent;
}
input[type=date]:focus::-webkit-datetime-edit,
input[type=date]:focus::-webkit-datetime-edit-fields-wrapper,
input[type=date]:focus::-webkit-datetime-edit-text,
input[type=date]:focus::-webkit-datetime-edit-month-field,
input[type=date]:focus::-webkit-datetime-edit-day-field,
input[type=date]:focus::-webkit-datetime-edit-year-field,
input[type=date]:focus::-webkit-date-and-time-value {
  color: var(--ion-text-color) !important;
}
.has-value input[type=date]::-webkit-datetime-edit,
.has-value input[type=date]::-webkit-datetime-edit-fields-wrapper,
.has-value input[type=date]::-webkit-datetime-edit-text,
.has-value input[type=date]::-webkit-datetime-edit-month-field,
.has-value input[type=date]::-webkit-datetime-edit-day-field,
.has-value input[type=date]::-webkit-datetime-edit-year-field,
.has-value input[type=date]::-webkit-date-and-time-value {
  color: var(--ion-text-color) !important;
}
ion-app {
  font-family: var(--font-body);
}
ion-content h1,
ion-content h2,
ion-content h3 {
  font-family: var(--font-heading);
  font-weight: 700;
  line-height: 1.25;
  margin: 0 0 1rem;
}
ion-content h4,
ion-content h5,
ion-content h6 {
  font-family: var(--font-subheading);
  font-weight: 600;
  line-height: 1.25;
  margin: 0 0 0.5rem;
}
ion-content h3 {
  font-size: 1.5rem;
}
ion-content h4 {
  font-size: 1.25rem;
}
ion-content h5 {
  font-size: 1.125rem;
}
ion-content h6 {
  font-size: 1rem;
}
ion-content p {
  margin: 0 0 1rem;
}
ion-content p:last-child {
  margin-bottom: 0;
}
ion-content a {
  color: var(--ion-color-primary);
  text-decoration: none;
}
ion-content a:hover,
ion-content a:active {
  text-decoration: underline;
}
ion-content ul,
ion-content ol {
  margin: 0 0 1rem;
  padding-left: 1.5rem;
}
ion-content ul:last-child,
ion-content ol:last-child {
  margin-bottom: 0;
}
ion-content ul {
  list-style-type: disc;
}
ion-content ol {
  list-style-type: decimal;
}
ion-content blockquote {
  margin: 0 0 1rem;
  padding-left: 1rem;
  border-left: 3px solid var(--ion-color-primary);
  font-style: italic;
}
ion-content code {
  font-family:
    "SF Mono",
    "Fira Code",
    monospace;
  font-size: 0.875rem;
  padding: 2px 6px;
  background-color: var(--ion-color-step-100);
  border-radius: var(--radius-sm);
}
ion-content pre {
  margin: 0 0 1rem;
  padding: 1rem;
  background-color: var(--ion-color-step-100);
  border-radius: var(--radius-md);
  overflow-x: auto;
}
ion-content pre code {
  padding: 0;
  background-color: transparent;
}
.btn-text-fill {
  --background: var(--ion-color-primary);
  --background-hover: var(--ion-color-primary-shade);
  --background-activated: var(--ion-color-primary-shade);
  --color: var(--ion-color-primary-contrast);
  --padding-top: 0.5rem;
  --padding-bottom: 0.5rem;
  --padding-start: 1.5rem;
  --padding-end: 1.5rem;
  --border-radius: var(--radius-full);
  --box-shadow: none;
  font-family: var(--font-heading) !important;
  font-size: var(--font-size-base);
  margin: 0 0 env(safe-area-inset-bottom, 0);
  text-transform: none;
  letter-spacing: 0.5px;
  height: var(--button-height);
}
.btn-text-fill::part(native) {
  border-radius: var(--radius-full);
}
.btn-text-fill.btn-secondary {
  --background: var(--ion-color-warning);
  --background-hover: var(--ion-color-warning-shade);
  --background-activated: var(--ion-color-warning-shade);
  --color: var(--ion-color-warning-contrast);
}
.btn-text-fill.btn-tertiary {
  --background: var(--ion-color-tertiary);
  --background-hover: var(--ion-color-tertiary-shade);
  --background-activated: var(--ion-color-tertiary-shade);
  --color: var(--ion-color-tertiary-contrast);
}
.btn-text-fill.btn-success {
  --background: var(--ion-color-success);
  --background-hover: var(--ion-color-success-shade);
  --background-activated: var(--ion-color-success-shade);
  --color: var(--ion-color-success-contrast);
}
.btn-text-fill.btn-danger {
  --background: var(--ion-color-danger);
  --background-hover: var(--ion-color-danger-shade);
  --background-activated: var(--ion-color-danger-shade);
  --color: var(--ion-color-danger-contrast);
}
.btn-text-fill.btn-light {
  --background: var(--ion-color-light);
  --background-hover: var(--ion-color-light-shade);
  --background-activated: var(--ion-color-light-shade);
  --color: var(--ion-color-light-contrast);
  --border-color: var(--ion-color-light);
}
.btn-text-outline {
  --background: transparent;
  --background-hover: var(--ion-color-primary-tint);
  --background-activated: var(--ion-color-primary-tint);
  --color: var(--ion-color-primary);
  --border-radius: var(--radius-full);
  --border-width: 2px;
  --border-style: solid;
  --border-color: var(--ion-color-primary);
  --padding-top: 0.5rem;
  --padding-bottom: 0.5rem;
  --padding-start: 1.5rem;
  --padding-end: 1.5rem;
  font-family: var(--font-heading) !important;
  font-size: var(--font-size-base);
  margin: 0 0 env(safe-area-inset-bottom, 0);
  text-transform: none;
  letter-spacing: 0.5px;
  height: var(--button-height);
}
.btn-text-outline::part(native) {
  border-radius: var(--radius-full);
}
.btn-text-outline.btn-secondary {
  --color: var(--ion-color-secondary);
  --border-color: var(--ion-color-secondary);
  --background-hover: var(--ion-color-secondary-tint);
  --background-activated: var(--ion-color-secondary-tint);
}
.btn-text-outline.btn-tertiary {
  --color: var(--ion-color-tertiary);
  --border-color: var(--ion-color-tertiary);
  --background-hover: var(--ion-color-tertiary-tint);
  --background-activated: var(--ion-color-tertiary-tint);
}
.btn-text-outline.btn-white {
  --color: var(--ion-text-color);
  --border-color: var(--ion-color-step-300);
  --background-hover: var(--ion-color-step-100);
  --background-activated: var(--ion-color-step-200);
}
.btn-text-outline.btn-light {
  --background: var(--ion-color-primary);
  --background-hover: var(--ion-color-light-shade);
  --background-activated: var(--ion-color-light-shade);
  --color: var(--ion-color-light);
  --border-color: var(--ion-color-light);
}
.btn-text-outline.btn-success {
  --color: var(--ion-color-success);
  --border-color: var(--ion-color-success);
  --background-hover: var(--ion-color-success-tint);
  --background-activated: var(--ion-color-success-tint);
}
.btn-text-outline.btn-danger {
  --color: var(--ion-color-danger);
  --border-color: var(--ion-color-danger);
  --background-hover: var(--ion-color-danger-tint);
  --background-activated: var(--ion-color-danger-tint);
}
.btn-icon-fill {
  --background: var(--ion-color-primary);
  --background-hover: var(--ion-color-primary-shade);
  --background-activated: var(--ion-color-primary-shade);
  --color: var(--ion-color-primary-contrast);
  --border-radius: var(--radius-xl);
  --padding-top: 1rem;
  --padding-bottom: 1rem;
  --padding-start: 1rem;
  --padding-end: 1rem;
  height: var(--button-height);
}
.btn-icon-fill::part(native) {
  border-radius: var(--radius-xl);
}
.btn-icon-fill ion-icon {
  font-size: var(--font-size-2xl);
}
.btn-icon-fill.btn-icon-circle {
  --border-radius: var(--radius-full);
}
.btn-icon-fill.btn-icon-circle::part(native) {
  border-radius: var(--radius-full);
}
.btn-icon-fill.btn-icon-square {
  --border-radius: var(--radius-md);
}
.btn-icon-fill.btn-icon-square::part(native) {
  border-radius: var(--radius-md);
}
.btn-icon-fill.btn-secondary {
  --background: var(--ion-color-secondary);
  --background-hover: var(--ion-color-secondary-shade);
  --background-activated: var(--ion-color-secondary-shade);
  --color: var(--ion-color-secondary-contrast);
}
.btn-icon-fill.btn-tertiary {
  --background: var(--ion-color-tertiary);
  --background-hover: var(--ion-color-tertiary-shade);
  --background-activated: var(--ion-color-tertiary-shade);
  --color: var(--ion-color-tertiary-contrast);
}
.btn-icon-fill.btn-success {
  --background: var(--ion-color-success);
  --background-hover: var(--ion-color-success-shade);
  --background-activated: var(--ion-color-success-shade);
  --color: var(--ion-color-success-contrast);
}
.btn-icon-fill.btn-danger {
  --background: var(--ion-color-danger);
  --background-hover: var(--ion-color-danger-shade);
  --background-activated: var(--ion-color-danger-shade);
  --color: var(--ion-color-danger-contrast);
}
.btn-icon-outline {
  --background: transparent;
  --background-hover: var(--ion-color-primary-tint);
  --background-activated: var(--ion-color-primary-tint);
  --color: var(--ion-color-primary);
  --border-radius: var(--radius-xl);
  --border-width: 2px;
  --border-style: solid;
  --border-color: var(--ion-color-primary);
  --padding-top: 1rem;
  --padding-bottom: 1rem;
  --padding-start: 1rem;
  --padding-end: 1rem;
  height: var(--button-height);
}
.btn-icon-outline::part(native) {
  border-radius: var(--radius-xl);
}
.btn-icon-outline ion-icon {
  font-size: var(--font-size-2xl);
}
.btn-icon-outline.btn-icon-circle {
  --border-radius: var(--radius-full);
}
.btn-icon-outline.btn-icon-circle::part(native) {
  border-radius: var(--radius-full);
}
.btn-icon-outline.btn-icon-square {
  --border-radius: var(--radius-md);
}
.btn-icon-outline.btn-icon-square::part(native) {
  border-radius: var(--radius-md);
}
.btn-icon-outline.btn-secondary {
  --color: var(--ion-color-secondary);
  --border-color: var(--ion-color-secondary);
  --background-hover: var(--ion-color-secondary-tint);
  --background-activated: var(--ion-color-secondary-tint);
}
.btn-icon-outline.btn-tertiary {
  --color: var(--ion-color-tertiary);
  --border-color: var(--ion-color-tertiary);
  --background-hover: var(--ion-color-tertiary-tint);
  --background-activated: var(--ion-color-tertiary-tint);
}
.btn-icon-outline.btn-success {
  --color: var(--ion-color-success);
  --border-color: var(--ion-color-success);
  --background-hover: var(--ion-color-success-tint);
  --background-activated: var(--ion-color-success-tint);
}
.btn-icon-outline.btn-danger {
  --color: var(--ion-color-danger);
  --border-color: var(--ion-color-danger);
  --background-hover: var(--ion-color-danger-tint);
  --background-activated: var(--ion-color-danger-tint);
}
.btn-text-icon-fill {
  --background: var(--ion-color-primary);
  --background-hover: var(--ion-color-primary-shade);
  --background-activated: var(--ion-color-primary-shade);
  --color: var(--ion-color-primary-contrast);
  --padding-top: 0.5rem;
  --padding-bottom: 0.5rem;
  --padding-start: 1.5rem;
  --padding-end: 1.5rem;
  --border-radius: var(--radius-full);
  --box-shadow: none;
  font-family: var(--font-heading) !important;
  font-size: var(--font-size-base);
  margin: 0 0 env(safe-area-inset-bottom, 0);
  text-transform: none;
  letter-spacing: 0.5px;
  height: var(--button-height);
}
.btn-text-icon-fill::part(native) {
  border-radius: var(--radius-full);
}
.btn-text-icon-fill ion-icon {
  font-size: var(--font-size-xl);
}
.btn-text-icon-fill ion-icon[slot=start] {
  margin-inline-end: 0.25rem;
}
.btn-text-icon-fill ion-icon[slot=end] {
  margin-inline-start: 0.25rem;
}
.btn-text-icon-fill.btn-secondary {
  --background: var(--ion-color-warning);
  --background-hover: var(--ion-color-warning-shade);
  --background-activated: var(--ion-color-warning-shade);
  --color: var(--ion-color-warning-contrast);
}
.btn-text-icon-fill.btn-tertiary {
  --background: var(--ion-color-tertiary);
  --background-hover: var(--ion-color-tertiary-shade);
  --background-activated: var(--ion-color-tertiary-shade);
  --color: var(--ion-color-tertiary-contrast);
}
.btn-text-icon-fill.btn-success {
  --background: var(--ion-color-success);
  --background-hover: var(--ion-color-success-shade);
  --background-activated: var(--ion-color-success-shade);
  --color: var(--ion-color-success-contrast);
}
.btn-text-icon-fill.btn-danger {
  --background: var(--ion-color-danger);
  --background-hover: var(--ion-color-danger-shade);
  --background-activated: var(--ion-color-danger-shade);
  --color: var(--ion-color-danger-contrast);
}
.btn-text-icon-fill.btn-light {
  --background: var(--ion-color-light);
  --background-hover: var(--ion-color-light-shade);
  --background-activated: var(--ion-color-light-shade);
  --color: var(--ion-color-light-contrast);
}
.btn-text-icon-outline {
  --background: transparent;
  --background-hover: var(--ion-color-primary-tint);
  --background-activated: var(--ion-color-primary-tint);
  --color: var(--ion-color-primary);
  --border-radius: var(--radius-lg);
  --border-width: 2px;
  --border-style: solid;
  --border-color: var(--ion-color-primary);
  --padding-top: 0.5rem;
  --padding-bottom: 0.5rem;
  --padding-start: 1.5rem;
  --padding-end: 1.5rem;
  font-weight: var(--font-weight-semibold);
  text-transform: none;
  letter-spacing: 0.5px;
  height: var(--button-height);
}
.btn-text-icon-outline::part(native) {
  border-radius: var(--radius-lg);
}
.btn-text-icon-outline ion-icon {
  font-size: var(--font-size-xl);
}
.btn-text-icon-outline ion-icon[slot=start] {
  margin-inline-end: 0.25rem;
}
.btn-text-icon-outline ion-icon[slot=end] {
  margin-inline-start: 0.25rem;
}
.btn-text-icon-outline.btn-secondary {
  --color: var(--ion-color-secondary);
  --border-color: var(--ion-color-secondary);
  --background-hover: var(--ion-color-secondary-tint);
  --background-activated: var(--ion-color-secondary-tint);
}
.btn-text-icon-outline.btn-tertiary {
  --color: var(--ion-color-tertiary);
  --border-color: var(--ion-color-tertiary);
  --background-hover: var(--ion-color-tertiary-tint);
  --background-activated: var(--ion-color-tertiary-tint);
}
.btn-text-icon-outline.btn-success {
  --color: var(--ion-color-success);
  --border-color: var(--ion-color-success);
  --background-hover: var(--ion-color-success-tint);
  --background-activated: var(--ion-color-success-tint);
}
.btn-text-icon-outline.btn-danger {
  --color: var(--ion-color-danger);
  --border-color: var(--ion-color-danger);
  --background-hover: var(--ion-color-danger-tint);
  --background-activated: var(--ion-color-danger-tint);
}
.input-wrapper {
  position: relative;
  display: flex;
  align-items: center;
  background: var(--ion-color-light);
  border: var(--border-sm) solid var(--ion-color-step-200);
  border-radius: var(--radius-lg);
  overflow: hidden;
  transition: all 0.3s ease;
}
.input-wrapper:focus-within {
  border-color: var(--ion-color-primary);
}
.input-wrapper.error {
  border-color: var(--ion-color-danger);
}
.input-wrapper.verified {
  border-color: var(--ion-color-success);
}
.input-wrapper.has-value {
  border-color: var(--ion-color-primary);
}
.input-wrapper-stretch {
  position: relative;
  display: flex;
  align-items: stretch;
  background: var(--ion-color-light);
  border: var(--border-sm) solid var(--ion-color-step-200);
  border-radius: var(--radius-lg);
  overflow: hidden;
  transition: all 0.3s ease;
}
.input-wrapper-stretch:focus-within {
  border-color: var(--ion-color-primary);
}
.input-wrapper-stretch.error {
  border-color: var(--ion-color-danger);
}
.input-wrapper-stretch.verified {
  border-color: var(--ion-color-success);
}
.input-wrapper-stretch.verified {
  align-items: center;
}
.input-wrapper-primary {
  position: relative;
  display: flex;
  align-items: center;
  background: var(--ion-color-light);
  border: var(--border-sm) solid var(--ion-color-step-200);
  border-radius: var(--radius-lg);
  overflow: hidden;
  transition: all 0.3s ease;
}
.input-wrapper-primary:focus-within {
  border-color: var(--ion-color-primary);
}
.input-wrapper-primary.error {
  border-color: var(--ion-color-danger);
}
.input-wrapper-outline {
  position: relative;
  display: flex;
  align-items: center;
  background: var(--ion-color-light);
  border: var(--border-sm) solid var(--ion-color-step-200);
  border-radius: var(--radius-lg);
  overflow: hidden;
  transition: all 0.3s ease;
  border-width: var(--border-sm);
}
.input-wrapper-outline:focus-within {
  border-color: var(--ion-color-primary);
}
.input-wrapper-outline.error {
  border-color: var(--ion-color-danger);
}
.input-field {
  flex: 1;
  height: var(--input-height);
  border: none;
  background: transparent;
  padding: var(--spacing-md);
  padding-left: var(--spacing-sm);
  font-family: var(--font-body);
  font-size: var(--font-size-base);
  color: var(--ion-color-dark);
  outline: none;
  min-width: 0;
}
.input-field::placeholder {
  color: var(--ion-color-medium);
}
.input-field.error {
  color: var(--ion-color-danger);
}
.input-country-selector {
  display: flex;
  align-items: center;
  gap: var(--spacing-xs);
  background: transparent;
  border: none;
  padding: var(--spacing-md);
  padding-right: 0;
  cursor: pointer;
  color: var(--ion-color-dark);
  font-family: var(--font-body);
  font-size: var(--font-size-base);
  transition: background 0.3s ease;
}
.input-country-selector:hover {
  background: var(--ion-color-step-100);
}
.input-country-selector .flag-image {
  width: 28px;
  height: 20px;
  object-fit: cover;
  border-radius: var(--radius-sm);
  display: block;
}
.input-country-selector .flag-wrapper {
  width: 28px;
  height: 20px;
  border-radius: var(--radius-sm);
  overflow: hidden;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.input-country-selector .flag-wrapper ion-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.input-country-selector .country-code {
  font-weight: var(--font-weight-semibold);
  white-space: nowrap;
}
.input-country-selector .dropdown-icon {
  font-size: var(--font-size-base);
  color: var(--ion-color-medium);
}
.input-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 var(--spacing-md);
  color: var(--ion-color-medium);
  font-size: var(--font-size-xl);
  flex-shrink: 0;
}
.input-error-message {
  display: flex;
  align-items: center;
  gap: var(--spacing-xs);
  margin-top: var(--spacing-sm);
  color: var(--ion-color-danger);
  font-family: var(--font-body);
  font-size: var(--font-size-base);
}
.input-error-message .error-icon {
  font-size: var(--font-size-base);
}
.input-otp {
  flex: 1;
  width: 80px;
  height: var(--input-height);
  background: var(--ion-color-light);
  border: var(--border-sm) solid var(--ion-color-step-200);
  border-radius: var(--radius-sm);
  font-family: var(--font-body);
  font-size: var(--font-size-2xl);
  font-weight: var(--font-weight-bold);
  color: var(--ion-color-dark);
  text-align: center;
  outline: none;
  transition: all 0.3s ease;
}
.input-otp:focus {
  border-color: var(--ion-color-primary);
}
.input-otp::placeholder {
  color: var(--ion-color-medium);
}
.input-otp.error {
  border-color: var(--ion-color-danger);
  color: var(--ion-color-danger);
}
.input-otp.success {
  border-color: var(--ion-color-success);
}
.input-otp-container {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: var(--spacing-sm);
  width: 100%;
  max-width: 320px;
}
.input-otp-container.error .input-otp {
  border-color: var(--ion-color-danger);
}
.input-otp-container.success .input-otp {
  border-color: var(--ion-color-success);
}
.select-field {
  width: 100%;
  --highlight-height: 0;
  --border-style: none;
  padding: 0 var(--spacing-md);
  background: var(--ion-color-light);
  border-radius: var(--radius-lg);
  border: var(--border-sm) solid var(--ion-color-step-200);
  min-height: var(--input-height);
  font-family: var(--font-body);
  font-size: var(--font-size-base);
  color: var(--ion-text-color);
  transition: all 0.3s ease;
}
.select-field::part(container) {
  width: 100%;
  max-width: 100%;
  flex: 1;
}
.select-field:focus,
.select-field.ion-focused,
.select-field.select-expanded {
  outline: none !important;
  border-color: var(--ion-color-primary);
  box-shadow: none !important;
}
.select-field::part(icon) {
  position: absolute;
  right: var(--spacing-sm);
  opacity: 1 !important;
  color: var(--ion-color-medium) !important;
  pointer-events: none;
  transition: transform 150ms ease;
}
.select-field::part(text) {
  padding-inline-end: 28px;
}
.select-field.select-expanded::part(icon),
.select-field.ion-focused::part(icon) {
  transform: rotate(180deg);
}
.select-field.has-value {
  border-color: var(--ion-color-primary);
}
.search-input {
  margin-bottom: var(--spacing-sm);
  padding: 0 var(--spacing-md);
}
.search-input ion-searchbar {
  --background: var(--ion-color-step-100);
  --border-radius: var(--radius-lg);
  --box-shadow: none;
  --color: var(--ion-text-color);
  --placeholder-color: var(--ion-color-medium);
  --icon-color: var(--ion-color-medium);
  --clear-button-color: var(--ion-color-medium);
  padding: 0;
}
ion-toolbar[color=primary] .search-input ion-searchbar {
  --background: rgb(255 255 255 / 20%);
  --color: white;
  --placeholder-color: rgb(255 255 255 / 70%);
  --icon-color: white;
  --clear-button-color: white;
}
.image-viewer-modal {
  --background: transparent;
  --backdrop-opacity: 0;
}
.image-viewer-modal::part(content) {
  background: transparent;
}
:root {
  --safe-area-top: env(safe-area-inset-top, 0);
  --safe-area-bottom: env(safe-area-inset-bottom, 0);
  --safe-area-left: env(safe-area-inset-left, 0);
  --safe-area-right: env(safe-area-inset-right, 0);
}
ion-app {
  padding: var(--safe-area-right) var(--safe-area-bottom) var(--safe-area-left);
}
ion-tab-bar {
  padding-bottom: var(--safe-area-bottom) !important;
  height: calc(50px + var(--safe-area-bottom));
}
ion-header.header-ios {
  padding-top: 0;
}
ion-footer {
  padding-bottom: var(--safe-area-bottom);
}
ion-modal {
  --ion-safe-area-top: var(--safe-area-top);
  --ion-safe-area-bottom: var(--safe-area-bottom);
  --ion-safe-area-left: var(--safe-area-left);
  --ion-safe-area-right: var(--safe-area-right);
}
ion-card {
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-md);
}
ion-card-header {
  display: flex;
  flex-direction: column;
}
ion-card-header ion-card-title {
  order: 1;
}
ion-card-header ion-card-subtitle {
  order: 2;
  text-transform: none;
}
ion-button {
  --border-radius: var(--radius-md);
  font-weight: var(--font-weight-semibold);
}
ion-input,
ion-textarea,
ion-searchbar {
  --border-radius: var(--radius-md);
}
ion-chip {
  --border-radius: var(--radius-2xl);
}
ion-modal,
ion-popover {
  --border-radius: var(--radius-xl);
}
ion-title {
  font-weight: var(--font-weight-bold);
}
p,
ion-text {
  font-weight: var(--font-weight-regular);
}
ion-title {
  font-family: var(--font-heading);
}
ion-card-title {
  font-family: var(--font-heading);
}
ion-list-header {
  font-family: var(--font-heading);
}
ion-modal ion-title {
  font-family: var(--font-heading);
}
ion-card-subtitle {
  font-family: var(--font-body);
}
ion-label.label-heading,
ion-label[slot=start].ion-text-wrap {
  font-family: var(--font-subheading);
}
ion-segment-button {
  font-family: var(--font-subheading);
}
ion-chip {
  font-family: var(--font-subheading);
}
ion-badge {
  font-family: var(--font-subheading);
}
ion-text {
  font-family: var(--font-body);
}
ion-label {
  font-family: var(--font-body);
}
ion-button {
  font-family: var(--font-body);
}
ion-item {
  font-family: var(--font-body);
}
ion-input,
ion-textarea,
ion-select {
  font-family: var(--font-body);
}
ion-tab-button {
  font-family: var(--font-body);
}
ion-card-content {
  font-family: var(--font-body);
}
ion-toast {
  font-family: var(--font-body);
}
ion-alert {
  font-family: var(--font-body);
}
.text-heading {
  font-family: var(--font-heading) !important;
}
.text-subheading {
  font-family: var(--font-subheading) !important;
}
.text-body {
  font-family: var(--font-body) !important;
}
body.platform-web {
  --w-sage: #7ba465;
  --w-sage-hover: #678e53;
  --w-lime: #99c787;
  --w-canvas: #f4f7f3;
  --w-card: #fff;
  --w-pink: #e96677;
  --w-pink-strong: #d24d5f;
  --w-gold: #ffc043;
  --w-border: #e4eae3;
  --w-text: #2a2e2b;
  --w-muted: #707a72;
  --w-radius: 24px;
  --w-radius-card: 16px;
  --w-radius-main: 24px;
  --w-radius-sm: 8px;
  --w-max: 1200px;
  --w-surface: #f3f6f2;
  --w-space-1: 4px;
  --w-space-2: 8px;
  --w-space-3: 12px;
  --w-space-4: 16px;
  --w-space-5: 20px;
  --w-space-6: 24px;
  --w-space-7: 32px;
  --w-space-8: 48px;
  --w-shadow-sm: 0 1px 3px rgb(16 24 16 / 6%), 0 2px 6px rgb(16 24 16 / 5%);
  --w-shadow-md: 0 4px 8px rgb(16 24 16 / 6%), 0 8px 20px rgb(16 24 16 / 8%);
  --w-shadow-lg: 0 8px 16px rgb(16 24 16 / 8%), 0 16px 32px rgb(16 24 16 / 10%);
  --w-transition-fast: all 0.2s cubic-bezier(0.25, 0.8, 0.25, 1);
  --w-transition-smooth: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
  --w-transition-bounce: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  --w-font: inherit;
  --w-fs-display: 32px;
  --w-fw-display: 800;
  --w-fs-h1: 30px;
  --w-fw-h1: 800;
  --w-lh-h1: 1.15;
  --w-fs-h2: 19px;
  --w-fw-h2: 700;
  --w-fs-h3: 17px;
  --w-fw-h3: 700;
  --w-fs-body-lg: 15px;
  --w-fw-body-lg: 600;
  --w-fs-body: 14px;
  --w-fs-caption: 12px;
  --w-fw-caption: 800;
}
body.platform-web.dark {
  color-scheme: dark;
  --w-canvas: var(--app-canvas);
  --w-card: var(--app-surface);
  --w-surface: var(--app-surface-muted);
  --w-border: var(--app-border);
  --w-text: var(--app-text);
  --w-muted: var(--app-text-muted);
  --w-shadow-sm: 0 1px 3px rgb(0 0 0 / 24%), 0 2px 6px rgb(0 0 0 / 20%);
  --w-shadow-md: 0 4px 8px rgb(0 0 0 / 24%), 0 8px 20px rgb(0 0 0 / 28%);
  --w-shadow-lg: 0 8px 16px rgb(0 0 0 / 30%), 0 16px 32px rgb(0 0 0 / 34%);
  --shop-dark-canvas: #0b100d;
  --shop-dark-surface: #131a16;
  --shop-dark-surface-raised: #18211b;
  --shop-dark-surface-soft: #1c261f;
  --shop-dark-border: rgb(193 221 198 / 11%);
  --shop-dark-border-strong: rgb(168 207 143 / 30%);
  --shop-dark-text: #f0f5f1;
  --shop-dark-muted: #98a69d;
  --shop-dark-accent: #a8cf8f;
  --shop-dark-shadow: 0 18px 46px rgb(0 0 0 / 30%);
}
body.platform-web.dark app-header-container.shop-header {
  background: var(--shop-dark-canvas);
  border-bottom: 1px solid rgba(193, 221, 198, 0.06);
}
body.platform-web.dark app-header-container.shop-header ion-header {
  background: var(--shop-dark-canvas);
}
body.platform-web.dark app-header-container.shop-header app-header-search .search-container {
  position: relative;
}
body.platform-web.dark app-header-container.shop-header app-header-search ion-searchbar {
  --background: var(--shop-dark-surface);
  --box-shadow: 0 12px 32px rgb(0 0 0 / 22%);
  --color: var(--shop-dark-text);
  --icon-color: var(--shop-dark-accent);
  --placeholder-color: var(--shop-dark-muted);
  border: 1px solid var(--shop-dark-border);
  border-radius: 999px;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
body.platform-web.dark app-header-container.shop-header app-header-search ion-searchbar:hover {
  border-color: rgba(168, 207, 143, 0.24);
  box-shadow: 0 14px 36px rgba(0, 0, 0, 0.28);
}
body.platform-web.dark .shop-content {
  --background: var(--shop-dark-canvas);
  color: var(--shop-dark-text);
}
body.platform-web.dark .shop-content > .ion-padding-horizontal.ion-margin-bottom {
  position: relative;
  padding: 10px;
  background:
    linear-gradient(
      145deg,
      #151d18 0%,
      #101612 100%);
  border: 1px solid var(--shop-dark-border);
  border-radius: 26px;
  box-shadow: var(--shop-dark-shadow);
}
body.platform-web.dark .shop-content > .ion-padding-horizontal.ion-margin-bottom::before {
  position: absolute;
  inset: -1px;
  z-index: 0;
  border-radius: inherit;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03);
  content: "";
  pointer-events: none;
}
body.platform-web.dark .shop-content app-banner-carousel,
body.platform-web.dark .shop-content app-banner-carousel .banner-carousel,
body.platform-web.dark .shop-content app-banner-carousel .carousel-slides,
body.platform-web.dark .shop-content app-banner-carousel .carousel-slide {
  border-radius: 18px;
}
body.platform-web.dark .shop-content app-banner-carousel .carousel-slide {
  background: var(--shop-dark-surface-soft);
}
body.platform-web.dark .shop-content app-banner-carousel .pagination-dot {
  background: rgba(230, 239, 232, 0.36);
}
body.platform-web.dark .shop-content app-banner-carousel .pagination-dot.active {
  background: var(--shop-dark-accent);
  box-shadow: 0 0 12px rgba(168, 207, 143, 0.28);
}
body.platform-web.dark .shop-content .shop-category-heading,
body.platform-web.dark .shop-content .product-section-title,
body.platform-web.dark .shop-content app-product-card .product-card-name {
  color: var(--shop-dark-text);
}
body.platform-web.dark .shop-content .product-section-count,
body.platform-web.dark .shop-content app-product-card .product-card-review-count,
body.platform-web.dark .shop-content app-product-card .product-card-original-price {
  color: var(--shop-dark-muted);
}
body.platform-web.dark .shop-content .shop-category-card {
  background:
    linear-gradient(
      155deg,
      var(--shop-dark-surface-raised),
      var(--shop-dark-surface));
  border-color: var(--shop-dark-border);
  box-shadow: 0 14px 34px rgba(0, 0, 0, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.02);
}
body.platform-web.dark .shop-content .shop-category-card:hover {
  background:
    linear-gradient(
      155deg,
      #1c2820,
      #151d18);
  border-color: var(--shop-dark-border-strong);
  box-shadow: 0 20px 42px rgba(0, 0, 0, 0.3);
}
body.platform-web.dark .shop-content .shop-category-card.is-selected {
  background:
    radial-gradient(
      circle at 50% 0%,
      rgba(168, 207, 143, 0.12),
      transparent 52%),
    linear-gradient(
      155deg,
      #1b281f,
      #141c17);
  border-color: #88b46e;
  box-shadow: 0 18px 42px rgba(0, 0, 0, 0.28), inset 0 0 0 1px rgba(168, 207, 143, 0.08);
}
body.platform-web.dark .shop-content .shop-category-icon {
  background: rgba(168, 207, 143, 0.11);
  color: #a8cf8f;
  border: 1px solid rgba(168, 207, 143, 0.1);
}
body.platform-web.dark .shop-content .shop-category-card:nth-child(2) .shop-category-icon {
  background: rgba(107, 181, 240, 0.11);
  color: #7cc2f3;
  border-color: rgba(107, 181, 240, 0.12);
}
body.platform-web.dark .shop-content .shop-category-card:nth-child(3) .shop-category-icon {
  background: rgba(233, 154, 168, 0.11);
  color: #ed91a3;
  border-color: rgba(233, 154, 168, 0.12);
}
body.platform-web.dark .shop-content .shop-category-card:nth-child(4) .shop-category-icon {
  background: rgba(255, 217, 102, 0.1);
  color: #e9c968;
  border-color: rgba(255, 217, 102, 0.11);
}
body.platform-web.dark .shop-content .product-section-eyebrow,
body.platform-web.dark .shop-content .product-section__link-btn {
  color: var(--shop-dark-accent);
  --color: var(--shop-dark-accent);
}
body.platform-web.dark .shop-content app-product-card .product-card,
body.platform-web.dark .shop-content app-product-card-skeleton .product-card-skeleton {
  background:
    linear-gradient(
      155deg,
      var(--shop-dark-surface-raised),
      var(--shop-dark-surface));
  border-color: var(--shop-dark-border);
  box-shadow: var(--shop-dark-shadow);
}
body.platform-web.dark .shop-content app-product-card .product-card:hover {
  border-color: var(--shop-dark-border-strong);
  box-shadow: 0 24px 54px rgba(0, 0, 0, 0.36), 0 0 0 1px rgba(168, 207, 143, 0.06);
}
body.platform-web.dark .shop-content app-product-card .product-card-image-container,
body.platform-web.dark .shop-content app-product-card .product-card-image,
body.platform-web.dark .shop-content app-product-card .product-card-image .image-error,
body.platform-web.dark .shop-content app-product-card-skeleton .skeleton-image {
  background:
    radial-gradient(
      circle at 50% 38%,
      rgba(168, 207, 143, 0.09),
      transparent 54%),
    var(--shop-dark-surface-soft);
  border: 1px solid rgba(193, 221, 198, 0.07);
}
body.platform-web.dark .shop-content app-product-card-skeleton .skeleton {
  --background: #1c261f;
  --background-rgb:
    28,
    38,
    31;
}
body.platform-web.dark .shop-content .promotional-banner-carousel {
  padding: 8px;
  background: var(--shop-dark-surface);
  border: 1px solid var(--shop-dark-border);
  border-radius: 22px;
  box-shadow: var(--shop-dark-shadow);
}
body.platform-web.dark .shop-content .my-order-btn {
  --background: transparent;
  --background-hover: rgb(168 207 143 / 8%);
  --background-activated: rgb(168 207 143 / 12%);
  --color: var(--shop-dark-accent);
  --border-color: rgb(168 207 143 / 34%);
}
body.platform-web.dark .shop-content .shop-all-products-section {
  background:
    linear-gradient(
      155deg,
      #151d18 0%,
      #101612 100%);
  border: 1px solid var(--shop-dark-border);
  box-shadow: var(--shop-dark-shadow);
}
body.platform-web.dark .shop-content .shop-all-products-section::before {
  background:
    linear-gradient(
      90deg,
      var(--shop-dark-accent),
      rgba(168, 207, 143, 0));
}
body.platform-web.dark .shop-content .shop-all-products-eyebrow {
  color: var(--shop-dark-accent);
}
body.platform-web.dark .shop-content .shop-all-products-title {
  color: var(--shop-dark-text);
}
body.platform-web.dark .shop-content .shop-all-products-count {
  background: rgba(168, 207, 143, 0.12);
  color: var(--shop-dark-accent);
  border: 1px solid rgba(168, 207, 143, 0.18);
}
body.platform-web.dark .shop-content .shop-all-products-empty {
  color: var(--shop-dark-muted);
}
body.platform-web.dark .articles-content--web {
  --background:
    radial-gradient(
      
      circle at 12% 0%,
      color-mix(in srgb, var(--ion-color-primary) 15%, transparent),
      transparent 34rem ),
    radial-gradient(
      
      circle at 12% 0%,
      color-mix(in srgb, var(--ion-color-primary) 15%, transparent),
      transparent 34rem ),
    linear-gradient(
      180deg,
      #111a15 0%,
      #0b100d 56%,
      #080b09 100%);
  --articles-dark-canvas: #0b100d;
  --articles-dark-surface: #0f1612;
  --articles-dark-surface-raised: #0f1612;
  --articles-dark-surface-hover: #121b15;
  --articles-dark-control: #0f1612;
  --articles-dark-border: rgb(226 235 221 / 11%);
  --articles-dark-border-strong: rgb(169 207 138 / 28%);
  --articles-dark-text: #f7f8f4;
  --articles-dark-muted: #abb3ad;
  --articles-dark-subtle: #768079;
  --articles-dark-accent: #acd391;
  --articles-dark-rose: #e78da1;
  color: var(--articles-dark-text);
}
body.platform-web.dark .articles-content--web .books-web-shell {
  position: relative;
  max-width: 1280px;
  padding-top: 22px;
}
body.platform-web.dark .articles-content--web .books-web-shell::before {
  position: absolute;
  inset: 0 24px auto;
  height: 1px;
  background:
    linear-gradient(
      90deg,
      transparent,
      rgba(226, 235, 221, 0.11),
      transparent);
  content: "";
  pointer-events: none;
}
body.platform-web.dark .articles-content--web .books-web-title-wrap h1 {
  color: var(--articles-dark-text);
  font-size: 1.82rem;
  letter-spacing: 0;
}
body.platform-web.dark .articles-content--web .books-web-back {
  --background-hover: rgb(169 207 138 / 9%);
  --color: var(--articles-dark-text);
  border: 1px solid transparent;
  transition:
    background-color 0.2s ease,
    border-color 0.2s ease,
    transform 0.2s ease;
}
body.platform-web.dark .articles-content--web .books-web-back ion-icon {
  color: var(--articles-dark-text);
}
body.platform-web.dark .articles-content--web .books-web-back:hover {
  border-color: var(--articles-dark-border);
  transform: translateX(-2px);
}
body.platform-web.dark .articles-content--web .books-web-search {
  max-width: 1210px;
  padding: 14px 0 18px;
}
body.platform-web.dark .articles-content--web app-header-search.books-collection-search .search-container {
  background:
    linear-gradient(
      180deg,
      rgba(168, 207, 143, 0.05),
      transparent 54%),
    #0f1612 !important;
  border: 1px solid rgba(226, 235, 221, 0.13) !important;
  border-radius: 999px !important;
  padding: 10px !important;
  box-shadow: 0 20px 48px rgba(0, 0, 0, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
}
body.platform-web.dark .articles-content--web app-header-search.books-collection-search ion-searchbar {
  --background: var(--articles-dark-control) !important;
  --box-shadow: none !important;
  --color: var(--articles-dark-text) !important;
  --icon-color: var(--articles-dark-accent) !important;
  --placeholder-color: var(--articles-dark-muted) !important;
  min-height: 44px;
  height: 44px;
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 999px;
}
body.platform-web.dark .articles-content--web app-header-search.books-collection-search ion-searchbar:hover {
  border-color: var(--articles-dark-border);
}
body.platform-web.dark .articles-content--web app-header-search.books-collection-search .filter-content {
  padding-left: 2px;
  background: transparent;
  border: 0;
}
body.platform-web.dark .articles-content--web app-header-search.books-collection-search app-header-filter-button .filter-btn {
  --background:
    linear-gradient(
      180deg,
      #34492f,
      #263722);
  --background-hover:
    linear-gradient(
      180deg,
      #3f5838,
      #2b4027);
  --background-activated: #324c2c;
  --color: var(--articles-dark-text);
  --border-radius: 999px;
  width: 48px;
  height: 48px;
  border: 1px solid rgba(169, 207, 138, 0.24);
  border-radius: 999px;
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.26), inset 0 1px 0 rgba(255, 255, 255, 0.13);
}
body.platform-web.dark .articles-content--web .books-web-section--filters {
  max-width: 1210px;
  margin-top: 4px;
}
body.platform-web.dark .articles-content--web .books-web-section--filters .filter-tabs-nav {
  padding-inline: 0;
}
body.platform-web.dark .articles-content--web .books-web-section {
  background:
    linear-gradient(
      180deg,
      rgba(255, 255, 255, 0.025),
      transparent 38%),
    #0f1612;
  border-color: rgba(205, 226, 210, 0.11);
  box-shadow: 0 18px 46px rgba(0, 0, 0, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.03);
}
body.platform-web.dark .articles-content--web .books-web-section::before {
  background:
    linear-gradient(
      90deg,
      #a8cf8f,
      rgba(168, 207, 143, 0));
}
body.platform-web.dark .articles-content--web .filter-tabs-arrow {
  --background: rgb(21 26 23 / 76%);
  --background-hover: var(--articles-dark-surface-hover);
  --color: var(--articles-dark-accent);
  width: 42px;
  height: 42px;
  border: 1px solid var(--articles-dark-border);
  box-shadow: 0 10px 26px rgba(0, 0, 0, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.05);
}
body.platform-web.dark .articles-content--web .filter-tabs .scrollable-tabs {
  gap: 12px;
  padding-block: 2px;
}
body.platform-web.dark .articles-content--web .filter-tabs .scrollable-tabs-btn {
  --background: #121615;
  --color: var(--articles-dark-muted);
  min-height: 42px;
  border: 1px solid rgba(226, 235, 221, 0.09);
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.14), inset 0 1px 0 rgba(255, 255, 255, 0.04);
  transition:
    border-color 0.2s ease,
    box-shadow 0.2s ease,
    transform 0.2s ease;
}
body.platform-web.dark .articles-content--web .filter-tabs .scrollable-tabs-btn:hover {
  --background: var(--articles-dark-surface-hover);
  --color: var(--articles-dark-text);
  border-color: var(--articles-dark-border);
  transform: translateY(-1px);
}
body.platform-web.dark .articles-content--web .filter-tabs .scrollable-tabs-btn.active {
  --background:
    linear-gradient(
      135deg,
      #f0a0b0 0%,
      #df8297 100%);
  --color: #1b1114;
  border-color: rgba(255, 214, 224, 0.44);
  box-shadow: 0 12px 30px rgba(236, 150, 169, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.24);
}
body.platform-web.dark .articles-content--web .books-web-section--content {
  max-width: 1210px;
  margin-top: 34px;
  padding-bottom: 48px;
}
body.platform-web.dark .articles-content--web .articles-grid--web {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
}
@media (width <= 1024px) {
  body.platform-web.dark .articles-content--web .articles-grid--web {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
  }
}
@media (width <= 768px) {
  body.platform-web.dark .articles-content--web .articles-grid--web {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
  }
}
@media (width <= 480px) {
  body.platform-web.dark .articles-content--web .articles-grid--web {
    grid-template-columns: 1fr;
    gap: 12px;
  }
}
body.platform-web.dark .articles-content--web app-article-card.articles-card--compact .article-card {
  --background: transparent;
  background:
    linear-gradient(
      180deg,
      rgba(168, 207, 143, 0.05),
      transparent 54%),
    #0f1612;
  border: 1px solid var(--articles-dark-border);
  border-radius: 14px;
  box-shadow: 0 14px 34px rgba(0, 0, 0, 0.24), inset 0 1px 0 rgba(255, 255, 255, 0.05);
}
body.platform-web.dark .articles-content--web app-article-card.articles-card--compact .article-card:hover {
  border-color: var(--articles-dark-border-strong);
  box-shadow: 0 20px 46px rgba(0, 0, 0, 0.34), 0 0 0 1px rgba(169, 207, 138, 0.08);
  transform: translateY(-2px);
}
body.platform-web.dark .articles-content--web app-article-card.articles-card--compact .article-card-wrapper {
  padding: 14px 14px 16px;
  gap: 11px;
}
@media (width <= 480px) {
  body.platform-web.dark .articles-content--web app-article-card.articles-card--compact .article-card-wrapper {
    flex-direction: column;
    padding: 12px;
    gap: 10px;
    align-items: stretch;
  }
}
body.platform-web.dark .articles-content--web app-article-card.articles-card--compact .article-card-image {
  height: 146px;
  background: #121b15;
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 10px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05);
}
@media (width <= 480px) {
  body.platform-web.dark .articles-content--web app-article-card.articles-card--compact .article-card-image {
    width: 100%;
    height: 135px;
    min-width: 0;
    flex-shrink: 0;
  }
}
body.platform-web.dark .articles-content--web app-article-card.articles-card--compact .article-card-category {
  --background: rgb(172 211 145 / 13%);
  --color: #d9eccc;
  border: 1px solid rgba(172, 211, 145, 0.16);
  font-weight: 700;
}
body.platform-web.dark .articles-content--web app-article-card.articles-card--compact .price-text {
  color: #ff9a91;
  font-weight: 800;
}
body.platform-web.dark .articles-content--web app-article-card.articles-card--compact .price-text.subscription-text {
  color: var(--articles-dark-accent);
}
@media (width <= 480px) {
  body.platform-web.dark .articles-content--web app-article-card.articles-card--compact .price-text {
    max-width: 100%;
    font-size: 0.78rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
}
body.platform-web.dark .articles-content--web app-article-card.articles-card--compact .article-card-title {
  color: var(--articles-dark-text);
  font-size: 0.98rem;
  letter-spacing: 0;
  line-height: 1.38;
}
@media (width <= 480px) {
  body.platform-web.dark .articles-content--web app-article-card.articles-card--compact .article-card-title {
    font-size: 0.92rem;
    line-height: 1.3;
    margin: 2px 0;
    overflow-wrap: anywhere;
  }
}
body.platform-web.dark .articles-content--web app-article-card.articles-card--compact .article-card-meta {
  color: var(--articles-dark-muted);
}
body.platform-web.dark .articles-content--web app-article-card.articles-card--compact .article-card-meta ion-icon {
  color: var(--articles-dark-subtle);
}
body.platform-web.dark .articles-content--web app-article-card.articles-card--compact .article-card-cta {
  --background: transparent;
  --background-hover: transparent;
  --background-activated: transparent;
  --border-radius: 999px;
  --box-shadow: none;
  --color: #111511;
  --padding-start: 18px;
  --padding-end: 18px;
  min-width: 118px;
  min-height: 0;
  height: 40px;
  margin-top: 14px;
  overflow: visible;
  border-radius: 999px;
  filter: drop-shadow(0 12px 18px rgba(172, 211, 145, 0.12));
  font-weight: 800;
  letter-spacing: 0;
  text-transform: none;
}
@media (width <= 480px) {
  body.platform-web.dark .articles-content--web app-article-card.articles-card--compact .article-card-cta {
    width: 100%;
    min-width: 0;
    max-width: 100%;
    height: 38px;
    margin-top: 8px;
  }
  body.platform-web.dark .articles-content--web app-article-card.articles-card--compact .article-card-cta::part(native) {
    width: 100%;
    min-height: 38px;
    padding: 0 12px;
    justify-content: center;
  }
}
body.platform-web.dark .articles-content--web app-article-card.articles-card--compact .article-card-cta::part(native) {
  min-height: 40px;
  padding: 0 18px;
  overflow: hidden;
  background:
    linear-gradient(
      180deg,
      #b7dc9d 0%,
      #9fcb82 100%);
  border: 1px solid rgba(221, 246, 204, 0.32);
  border-radius: 999px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.32), inset 0 -1px 0 rgba(72, 103, 52, 0.18);
}
body.platform-web.dark .articles-content--web app-article-card.articles-card--compact .article-card-cta:hover::part(native) {
  background:
    linear-gradient(
      180deg,
      #c3e5ac 0%,
      #a8d18b 100%);
  border-color: rgba(226, 250, 211, 0.42);
}
body.platform-web.dark .articles-content--web app-article-card.articles-card--compact .article-card-cta:active::part(native) {
  background:
    linear-gradient(
      180deg,
      #9fca82 0%,
      #8fbd72 100%);
  transform: translateY(1px);
}
body.platform-web.dark .articles-content--web .articles-empty--web {
  background:
    linear-gradient(
      135deg,
      rgba(255, 255, 255, 0.04),
      rgba(255, 255, 255, 0.01)),
    radial-gradient(
      circle at 50% 20%,
      rgba(169, 207, 138, 0.09),
      transparent 18rem),
    var(--articles-dark-surface);
  border-color: var(--articles-dark-border);
  box-shadow: 0 22px 54px rgba(0, 0, 0, 0.24), inset 0 1px 0 rgba(255, 255, 255, 0.05);
}
body.platform-web.dark .articles-content--web .articles-empty--web ion-icon {
  color: var(--articles-dark-accent);
}
body.platform-web.dark .articles-content--web .articles-empty--web h3 {
  color: var(--articles-dark-text);
}
body.platform-web.dark .articles-content--web .articles-empty--web p {
  color: var(--articles-dark-muted);
}
body.platform-web.dark .articles-content--web app-site-footer {
  background: #090d0a;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
}
body.platform-web.dark .article-detail-content--web {
  --background:
    radial-gradient(
      
      circle at 12% 0%,
      color-mix(in srgb, var(--ion-color-primary) 15%, transparent),
      transparent 34rem ),
    linear-gradient(
      180deg,
      #111a15 0%,
      #0b100d 56%,
      #080b09 100%);
  color: var(--articles-dark-text, #f7f8f4);
}
body.platform-web.dark .article-detail-content--web .article-detail-body {
  background:
    linear-gradient(
      180deg,
      rgba(168, 207, 143, 0.04),
      transparent 48%),
    #0f1612;
  border: 1px solid var(--articles-dark-border, rgba(226, 235, 221, 0.11));
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.35);
  color: var(--articles-dark-text, #f7f8f4);
}
body.platform-web.dark .article-detail-content--web .article-detail-title {
  color: var(--articles-dark-text, #f7f8f4);
}
body.platform-web.dark .article-detail-content--web .article-detail-category {
  --background: rgb(172 211 145 / 14%);
  --color: #acd391;
  border: 1px solid rgba(172, 211, 145, 0.22);
  color: #acd391;
}
body.platform-web.dark .article-detail-content--web .article-detail-reading-time {
  color: var(--articles-dark-muted, #abb3ad);
}
body.platform-web.dark .article-detail-content--web .article-detail-reading-time ion-icon {
  color: var(--articles-dark-subtle, #768079);
}
body.platform-web.dark .article-detail-content--web .article-byline {
  background: #121b15;
  border: 1px solid var(--articles-dark-border, rgba(226, 235, 221, 0.11));
}
body.platform-web.dark .article-detail-content--web .article-byline__label,
body.platform-web.dark .article-detail-content--web .article-byline__role {
  color: var(--articles-dark-muted, #abb3ad);
}
body.platform-web.dark .article-detail-content--web .article-byline__name {
  color: var(--articles-dark-text, #f7f8f4);
}
body.platform-web.dark .article-detail-content--web .article-byline__divider {
  background: var(--articles-dark-border, rgba(226, 235, 221, 0.11));
}
body.platform-web.dark .article-detail-content--web .article-detail-content-section {
  color: var(--articles-dark-text, #e2e8e0);
}
body.platform-web.dark .article-detail-content--web .article-detail-content-section p,
body.platform-web.dark .article-detail-content--web .article-detail-content-section li,
body.platform-web.dark .article-detail-content--web .article-detail-content-section span,
body.platform-web.dark .article-detail-content--web .article-detail-content-section div {
  color: var(--articles-dark-text, #e2e8e0);
}
body.platform-web.dark .article-detail-content--web .article-detail-content-section h1,
body.platform-web.dark .article-detail-content--web .article-detail-content-section h2,
body.platform-web.dark .article-detail-content--web .article-detail-content-section h3,
body.platform-web.dark .article-detail-content--web .article-detail-content-section h4,
body.platform-web.dark .article-detail-content--web .article-detail-content-section h5,
body.platform-web.dark .article-detail-content--web .article-detail-content-section h6,
body.platform-web.dark .article-detail-content--web .article-detail-content-section strong,
body.platform-web.dark .article-detail-content--web .article-detail-content-section b {
  color: #fff;
}
body.platform-web.dark .article-detail-content--web .article-detail-content-section a {
  color: var(--articles-dark-accent, #acd391);
}
body.platform-web.dark .article-detail-content--web .article-detail-content-section blockquote {
  border-left: 3px solid var(--articles-dark-accent, #acd391);
  background: rgba(172, 211, 145, 0.08);
  color: var(--articles-dark-text, #e2e8e0);
}
body.platform-web.dark .article-detail-content--web .article-detail-content-section code,
body.platform-web.dark .article-detail-content--web .article-detail-content-section pre {
  background: #121b15;
  color: #acd391;
  border: 1px solid var(--articles-dark-border, rgba(226, 235, 221, 0.11));
}
body.platform-web.dark .article-detail-content--web .article-detail-medical-review,
body.platform-web.dark .article-detail-content--web .article-detail-references {
  background: #121b15;
  border: 1px solid var(--articles-dark-border, rgba(226, 235, 221, 0.11));
  color: var(--articles-dark-text, #f7f8f4);
}
body.platform-web.dark .article-detail-content--web .article-audio-player {
  background: #141f18;
  border: 1px solid var(--articles-dark-border, rgba(226, 235, 221, 0.11));
}
body.platform-web.dark .books-content--web {
  --background:
    radial-gradient(
      
      circle at 12% 0%,
      color-mix(in srgb, var(--ion-color-primary) 15%, transparent),
      transparent 34rem ),
    linear-gradient(
      180deg,
      #111a15 0%,
      #0b100d 56%,
      #080b09 100%);
  --books-dark-canvas: #0b100d;
  --books-dark-surface: #0f1612;
  --books-dark-surface-raised: #0f1612;
  --books-dark-surface-hover: #121b15;
  --books-dark-control: #0f1612;
  --books-dark-border: rgb(213 229 216 / 12%);
  --books-dark-border-strong: rgb(168 207 143 / 34%);
  --books-dark-text: #f2f6f2;
  --books-dark-muted: #9da9a0;
  --books-dark-accent: #acd391;
  color: var(--books-dark-text);
}
body.platform-web.dark .books-content--web .books-web-shell {
  position: relative;
}
body.platform-web.dark .books-content--web .books-web-shell::before {
  position: absolute;
  inset: 0 24px auto;
  height: 1px;
  background:
    linear-gradient(
      90deg,
      transparent,
      var(--books-dark-border),
      transparent);
  content: "";
  pointer-events: none;
}
body.platform-web.dark .books-content--web .books-web-title-wrap h1 {
  color: var(--books-dark-text);
  letter-spacing: 0;
}
body.platform-web.dark .books-content--web .books-web-back {
  --background: var(--books-dark-surface-raised);
  --background-hover: var(--books-dark-surface-hover);
  --background-focused: var(--books-dark-surface-hover);
  --background-activated: var(--books-dark-surface-hover);
  --border-color: var(--books-dark-border);
  --box-shadow: 0 10px 24px rgb(0 0 0 / 28%);
  --color: var(--books-dark-text);
}
body.platform-web.dark .books-content--web app-header-search.books-collection-search .search-container {
  gap: 8px;
  min-height: 62px;
  padding: 5px;
  background:
    linear-gradient(
      180deg,
      rgba(168, 207, 143, 0.05),
      transparent 54%),
    #0f1612 !important;
  border: 1px solid var(--books-dark-border) !important;
  border-radius: 18px;
  box-shadow: 0 14px 34px rgba(0, 0, 0, 0.24), inset 0 1px 0 rgba(255, 255, 255, 0.07) !important;
}
body.platform-web.dark .books-content--web app-header-search.books-collection-search .search-container:focus-within {
  border-color: var(--books-dark-border-strong) !important;
  box-shadow: 0 16px 38px rgba(0, 0, 0, 0.28), 0 0 0 3px rgba(172, 211, 145, 0.08) !important;
}
body.platform-web.dark .books-content--web app-header-search.books-collection-search ion-searchbar {
  --background: transparent !important;
  --box-shadow: none !important;
  --color: var(--books-dark-text) !important;
  --icon-color: var(--books-dark-accent) !important;
  --placeholder-color: var(--books-dark-muted) !important;
  --placeholder-opacity: 1 !important;
  min-height: 50px;
  height: 50px;
  padding-inline: 10px;
  border: 0;
  border-radius: 0;
}
body.platform-web.dark .books-content--web app-header-search.books-collection-search .filter-content {
  background: transparent;
  border: 0;
}
body.platform-web.dark .books-content--web app-header-search.books-collection-search app-header-filter-button .filter-btn.has-label {
  --background: #202c22;
  --background-hover: #28372b;
  --background-focused: #28372b;
  --background-activated: #2d3d30;
  --border-color: rgb(172 211 145 / 20%);
  --border-radius: 12px;
  --border-style: solid;
  --border-width: 1px;
  --box-shadow: inset 0 1px 0 rgb(255 255 255 / 6%);
  --color: var(--books-dark-text);
  --padding-start: 14px;
  --padding-end: 14px;
  width: auto;
  min-width: 96px;
  height: 48px;
}
body.platform-web.dark .books-content--web app-header-search.books-collection-search app-header-filter-button .filter-btn.has-label ion-icon {
  color: var(--books-dark-accent);
}
body.platform-web.dark .books-content--web .books-web-section {
  background:
    linear-gradient(
      180deg,
      rgba(255, 255, 255, 0.025),
      transparent 38%),
    #0f1612;
  border-color: rgba(205, 226, 210, 0.11);
  box-shadow: 0 18px 46px rgba(0, 0, 0, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.03);
}
body.platform-web.dark .books-content--web .books-web-section::before {
  background:
    linear-gradient(
      90deg,
      #a8cf8f,
      rgba(168, 207, 143, 0));
}
body.platform-web.dark .books-content--web app-ebook-category-list .section-title {
  color: var(--books-dark-text);
  letter-spacing: 0.01em;
}
body.platform-web.dark .books-content--web app-ebook-category-card .category-button {
  background:
    linear-gradient(
      180deg,
      rgba(168, 207, 143, 0.05),
      transparent 54%),
    #0f1612;
  border-color: var(--books-dark-border);
  box-shadow: 0 14px 32px rgba(0, 0, 0, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.04);
}
body.platform-web.dark .books-content--web app-ebook-category-card .category-button:hover {
  background: var(--books-dark-surface-hover);
  border-color: var(--books-dark-border-strong);
  box-shadow: 0 20px 42px rgba(0, 0, 0, 0.3);
}
body.platform-web.dark .books-content--web app-ebook-category-card .category-button.active {
  background:
    linear-gradient(
      180deg,
      rgba(172, 211, 145, 0.09),
      transparent),
    var(--books-dark-surface-raised);
  border-color: var(--books-dark-accent);
  box-shadow: 0 16px 36px rgba(0, 0, 0, 0.28), 0 0 0 1px rgba(172, 211, 145, 0.1);
}
body.platform-web.dark .books-content--web app-ebook-category-card .category-button:focus-visible {
  outline: 3px solid rgba(172, 211, 145, 0.24);
  outline-offset: 3px;
}
body.platform-web.dark .books-content--web app-ebook-category-card .category-container {
  background: var(--books-dark-surface-hover);
  border: 1px solid var(--books-dark-border);
}
body.platform-web.dark .books-content--web app-ebook-category-card .category-name {
  color: var(--books-dark-text);
}
body.platform-web.dark .books-content--web app-ebook-category-list .see-more-button {
  --background:
    linear-gradient(
      180deg,
      #b5d99d,
      #96c477);
  --background-hover:
    linear-gradient(
      180deg,
      #c1e2aa,
      #a2cd84);
  --background-activated: #8fbd70;
  --color: #10170f;
  --border-color: rgb(222 245 207 / 28%);
  --box-shadow: 0 14px 28px rgb(0 0 0 / 24%), inset 0 1px 0 rgb(255 255 255 / 28%);
}
body.platform-web.dark .books-content--web app-ebook-category-list .see-more-button .see-more-text,
body.platform-web.dark .books-content--web app-ebook-category-list .see-more-button .see-more-icon {
  color: #10170f;
}
body.platform-web.dark .books-content--web app-books-card .book-card {
  background:
    linear-gradient(
      180deg,
      rgba(168, 207, 143, 0.1),
      transparent 54%),
    #162018;
  border-color: var(--books-dark-border);
  box-shadow: 0 16px 36px rgba(0, 0, 0, 0.24), inset 0 1px 0 rgba(255, 255, 255, 0.04);
}
body.platform-web.dark .books-content--web app-books-card .book-card:hover {
  background:
    linear-gradient(
      180deg,
      rgba(185, 222, 157, 0.12),
      transparent 54%),
    #1a261d;
  border-color: var(--books-dark-border-strong);
  box-shadow: 0 22px 48px rgba(0, 0, 0, 0.34), 0 0 0 3px rgba(172, 211, 145, 0.07);
}
body.platform-web.dark .books-content--web app-books-card .book-card:focus-visible {
  outline: 3px solid rgba(172, 211, 145, 0.24);
  outline-offset: 3px;
}
body.platform-web.dark .books-content--web app-books-card .book-card-cover {
  background:
    radial-gradient(
      circle at 50% 10%,
      rgba(210, 235, 192, 0.18),
      transparent 70%),
    #182219;
  border: 1px solid rgba(216, 239, 205, 0.13);
  box-shadow: inset 0 0 0 1px rgba(14, 20, 16, 0.16), 0 9px 18px rgba(0, 0, 0, 0.2);
}
body.platform-web.dark .books-content--web app-books-card .book-card-title {
  color: var(--books-dark-text);
}
body.platform-web.dark .books-content--web app-books-card .book-card-author {
  color: var(--books-dark-muted);
}
body.platform-web.dark .books-content--web app-books-card .book-card-price--free,
body.platform-web.dark .books-content--web app-books-card .book-card-price--subscription {
  color: var(--books-dark-accent);
  background: rgba(172, 211, 145, 0.11);
}
body.platform-web.dark .books-content--web app-books-card .book-card-price:not(.book-card-price--free, .book-card-price--subscription) {
  background: rgba(255, 121, 132, 0.11);
}
body.platform-web.dark .books-content--web app-books-card .book-card-buy-btn {
  --background:
    linear-gradient(
      180deg,
      #afd694,
      #91bf72);
  --background-hover:
    linear-gradient(
      180deg,
      #bae0a0,
      #9aca7b);
  --color: #10170f;
}
body.platform-web.dark .books-content--web app-book-card-skeleton .book-card-skeleton {
  background: var(--books-dark-surface);
  border-color: var(--books-dark-border);
  box-shadow: 0 16px 36px rgba(0, 0, 0, 0.24);
}
body.platform-web.dark .books-content--web app-book-card-skeleton ion-skeleton-text {
  --background: rgb(213 229 216 / 10%);
  --background-rgb:
    213,
    229,
    216;
}
body.platform-web.dark .books-content--web app-site-footer {
  background: #080b09;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
}
body.platform-web app-tabs-layout {
  display: flex;
  flex-direction: column;
  height: 100%;
}
body.platform-web app-tabs-layout ion-tabs {
  position: relative;
  flex: 1 1 auto;
  min-height: 0;
}
body.platform-web ion-header.home-header {
  display: none;
}
body.platform-web .home-content {
  --background: var(--w-canvas);
}
body.platform-web .home-content .content-wrapper {
  max-width: none;
  padding: 0;
}
@media (width >= 768px) {
  body.platform-web .home-content .content-wrapper > app-quick-links,
  body.platform-web .home-content .content-wrapper > .ion-padding-horizontal,
  body.platform-web .home-content .content-wrapper > .section,
  body.platform-web .home-content .content-wrapper > app-article-section,
  body.platform-web .home-content .content-wrapper > app-featured-videos,
  body.platform-web .home-content .content-wrapper > app-community-highlights,
  body.platform-web .home-content .content-wrapper > app-recommended-products,
  body.platform-web .home-content .content-wrapper > app-invite-card {
    display: block;
    width: 100%;
    max-width: var(--w-max);
    margin: 0 auto 40px;
    padding: 0 24px;
  }
  body.platform-web .home-content .profile-overview-section {
    display: grid;
    grid-template-columns: 1.2fr 1fr;
    gap: 40px;
    align-items: center;
    padding: 40px max(24px, (100vw - var(--w-max)) / 2) 76px;
    border-bottom-left-radius: var(--w-radius);
    border-bottom-right-radius: var(--w-radius);
  }
  body.platform-web .home-content .content-wrapper > app-quick-links {
    position: relative;
    z-index: 2;
    margin-top: -44px;
  }
  body.platform-web .home-content .h-scroll {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
    padding: 0;
    overflow: visible;
  }
  body.platform-web .home-content .course-card,
  body.platform-web .home-content .video-card {
    flex: initial;
    width: auto;
  }
  body.platform-web .home-content .quick-links-card-list {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
  }
  body.platform-web .home-content .article-section__grid ion-row {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
    width: 100%;
  }
  body.platform-web .home-content .recommended-products-section .products-scroll {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    overflow: visible;
  }
}
body.platform-web .home-content .quick-links-card-item {
  background: var(--w-card);
  border: 1px solid var(--w-border);
  border-radius: var(--w-radius-card);
  box-shadow: 0 8px 22px rgba(123, 164, 101, 0.06);
  transition: transform 0.25s ease, border-color 0.25s ease;
}
body.platform-web .home-content .quick-links-card-item:hover {
  transform: translateY(-4px);
  border-color: var(--w-sage);
}
body.platform-web .home-content .section-eyebrow {
  color: var(--w-pink);
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.4px;
}
body.platform-web .home-content .section-title,
body.platform-web .home-content .article-section__title,
body.platform-web .home-content .recommended-products-section .section-title {
  font-size: 19px;
  font-weight: 700;
  color: var(--w-text);
}
body.platform-web .home-content .section-link {
  color: var(--w-muted);
  font-size: 13px;
  font-weight: 600;
}
body.platform-web .home-content .section-link:hover {
  color: var(--w-sage);
}
body.platform-web .home-content .course-card,
body.platform-web .home-content .video-card,
body.platform-web .home-content .embedded-media-display-card {
  background: var(--w-card);
  border: 1px solid var(--w-border);
  border-radius: var(--w-radius-card);
  overflow: hidden;
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.04);
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}
body.platform-web .home-content .course-card:hover,
body.platform-web .home-content .video-card:hover,
body.platform-web .home-content .embedded-media-display-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 14px 30px rgba(0, 0, 0, 0.08);
}
body.platform-web .home-content .banner-strip-section--shop-style app-banner-carousel {
  display: block;
  width: 100%;
}
body.platform-web .home-content .banner-strip-section--shop-style app-banner-carousel .banner-carousel {
  width: 100%;
  max-width: none;
  margin: 0;
}
body.platform-web .home-content .banner-strip-section--shop-style app-banner-carousel .banner-carousel,
body.platform-web .home-content .banner-strip-section--shop-style app-banner-carousel .carousel-slides,
body.platform-web .home-content .banner-strip-section--shop-style app-banner-carousel .carousel-slide {
  border-radius: 15px;
}
body.platform-web .home-content .banner-strip-section--shop-style app-banner-carousel .carousel-slide {
  border: 0;
  background: transparent;
  box-shadow: none;
}
body.platform-web .home-content .banner-strip-section--shop-style app-banner-carousel .pagination-dot {
  border: 1px solid rgba(255, 255, 255, 0.16);
  background: rgba(239, 246, 240, 0.42);
}
body.platform-web .home-content .banner-strip-section--shop-style app-banner-carousel .pagination-dot.active {
  border-color: #acd391;
  background: #acd391;
  box-shadow: 0 0 16px rgba(168, 207, 143, 0.34);
}
body.platform-web .home-content app-banner-carousel .banner-carousel,
body.platform-web .home-content app-banner-carousel .carousel-slides {
  border-radius: var(--w-radius);
  overflow: hidden;
}
body.platform-web .home-content .community-highlights-card,
body.platform-web .home-content .invite-friends-card {
  --background: var(--w-card);
  --border-radius: var(--w-radius);
  border: 1px solid var(--w-border);
  border-radius: var(--w-radius);
}
body.platform-web .home-content .quick-links-see-more-btn,
body.platform-web .home-content .btn-see-more-expand {
  --background: var(--w-lime);
  --background-hover: var(--w-sage);
  --color: #1a1d1a;
  --border-radius: 20px;
}
body.platform-web .home-content .product-card-add-to-cart-btn,
body.platform-web .home-content .product-card-cart-control {
  --background: var(--w-pink);
  --color: #fff;
  background: var(--w-pink);
  color: #fff;
}
body.platform-web .home-content .course-thumb::after {
  background: linear-gradient(transparent 45%, rgba(0, 0, 0, 0.45));
}
body.platform-web .home-content app-article-section.guide-section .article-card {
  background:
    linear-gradient(
      135deg,
      #f4f9f3 0%,
      #eaf3e6 100%);
}
body.platform-web .home-content app-article-card .article-card-cta {
  display: none;
}
body.platform-web .home-content app-article-section.guide-section .article-card-cta {
  display: inline-flex;
}
@media (width >= 768px) {
  body.platform-web .home-content app-article-section.guide-section .article-section__grid ion-row {
    grid-template-columns: 1fr;
  }
  body.platform-web .home-content app-article-section.guide-section ion-col {
    flex: 0 0 100% !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 0;
  }
  body.platform-web .home-content app-article-section.guide-section .article-card {
    width: 100%;
  }
  body.platform-web .home-content app-article-section.guide-section .article-card-wrapper {
    flex-direction: row;
    align-items: center;
    gap: 28px;
    padding: 22px 26px;
  }
  body.platform-web .home-content app-article-section.guide-section .article-card-image {
    width: 220px;
    min-width: 220px;
    height: 150px;
  }
  body.platform-web .home-content app-article-section.guide-section .article-card-content {
    flex: 1;
  }
}
body.platform-web .home-content app-featured-videos .featured-section {
  height: auto;
  padding: 0;
  background: transparent;
}
body.platform-web .home-content app-featured-videos .section-header {
  color: var(--w-text);
}
body.platform-web .home-content app-featured-videos .section-title-white {
  color: var(--w-text);
}
body.platform-web .home-content app-featured-videos .view-all {
  --color: var(--w-muted);
}
body.platform-web .home-content app-featured-videos .video-scroll-container {
  display: flex;
  gap: 16px;
  overflow: auto hidden;
}
body.platform-web .home-content app-featured-videos .video-card {
  flex: 0 0 min(290px, 100vw - 52px) !important;
  width: auto;
  max-width: 100%;
  height: auto;
  border-radius: 18px;
}
body.platform-web .login-web-brand {
  position: relative;
  background: var(--w-sage);
  color: #fff;
  overflow: hidden;
}
body.platform-web .login-web-brand-illustration {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: 0;
}
body.platform-web .login-web-brand-logo {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 24px;
  font-weight: 800;
}
body.platform-web .login-web-brand-mark {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
body.platform-web .login-web-brand-mark ion-img {
  width: 28px;
  height: 28px;
}
body.platform-web .login-web-brand-copy {
  position: relative;
  z-index: 2;
}
body.platform-web .login-web-brand-copy h2 {
  font-size: 30px;
  font-weight: 800;
  line-height: 1.2;
  margin: 0 0 12px;
}
body.platform-web .login-web-brand-copy p {
  font-size: 15px;
  line-height: 1.6;
  opacity: 0.92;
  max-width: 340px;
  margin: 0;
}
body.platform-web .login-web-brand-trust {
  position: relative;
  z-index: 2;
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 14px;
}
body.platform-web .login-web-brand-trust li {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 13.5px;
  font-weight: 600;
}
body.platform-web .login-web-brand-trust ion-icon {
  width: 30px;
  height: 30px;
  padding: 7px;
  font-size: 15px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.18);
  flex-shrink: 0;
}
body.platform-web .login-content {
  --background: var(--w-canvas);
}
body.platform-web .login-content::part(scroll) {
  overflow-y: auto;
}
body.platform-web .login-content .login-container,
body.platform-web .login-content .login-row {
  min-height: 100%;
}
body.platform-web .login-content .login-row {
  min-height: 100dvh;
  align-items: center;
  box-sizing: border-box;
  padding: 40px 24px;
}
body.platform-web .login-content .login-row > ion-col {
  flex: 0 0 auto !important;
  width: 100% !important;
  max-width: 1000px !important;
  background: var(--w-card);
  border: 1px solid var(--w-border);
  border-radius: var(--w-radius);
  box-shadow: 0 24px 60px rgba(123, 164, 101, 0.14);
  overflow: hidden;
}
body.platform-web .login-content .login-content-wrapper {
  min-height: 0;
  justify-content: center;
  padding: 8px 0;
}
body.platform-web .login-content .login-welcome-section {
  padding: 0 0 0 4px !important;
  text-align: left !important;
}
body.platform-web .login-content .login-logo-container,
body.platform-web .login-content .login-welcome-subtitle {
  display: none !important;
}
body.platform-web .login-content .login-welcome-title {
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--w-sage);
}
body.platform-web .login-content .login-signin-card {
  --background: var(--w-card);
  background: var(--w-card);
  box-shadow: none;
  border-radius: 0;
  margin: 0;
}
body.platform-web .login-content .login-signin-card ion-card-content {
  padding: 0 var(--spacing-md) 24px;
}
body.platform-web .login-content .login-signin-card ion-card-title {
  color: var(--w-text) !important;
  font-size: 24px;
  font-weight: 800;
}
body.platform-web .login-content .login-signin-card ion-card-subtitle {
  color: var(--w-muted) !important;
  font-size: 14px;
}
body.platform-web .login-content .login-form-label {
  color: var(--w-text) !important;
}
body.platform-web .login-content .input-wrapper,
body.platform-web .login-content .input-wrapper-stretch {
  border: 1px solid var(--w-border);
  border-radius: var(--w-radius-card);
  overflow: hidden;
}
body.platform-web .login-content .input-wrapper:focus-within,
body.platform-web .login-content .input-wrapper-stretch:focus-within {
  border-color: var(--w-sage);
  box-shadow: 0 0 0 3px rgba(123, 164, 101, 0.12);
}
body.platform-web .login-content .input-country-selector {
  background: #f6f9f5;
  border-right: 1px solid var(--w-border);
}
body.platform-web .login-content .country-selector-field {
  position: relative;
}
body.platform-web .login-content .input-field {
  color: var(--w-text);
}
body.platform-web .login-content .login-next-btn {
  --background: var(--w-lime);
  --background-activated: var(--w-sage-hover);
  --background-hover: var(--w-sage);
  --color: #1a1d1a;
  --border-radius: 30px;
  --box-shadow: none;
  font-weight: 700;
}
body.platform-web .login-content .login-divider::before {
  background: var(--w-border);
  opacity: 1;
}
body.platform-web .login-content .login-divider .divider-text {
  background: var(--w-card);
  color: var(--w-muted);
}
body.platform-web .login-content .login-social-buttons {
  margin-bottom: 0;
}
body.platform-web .login-content .login-social-buttons ion-button {
  --background: var(--w-card);
  --background-hover: #f6f9f5;
  --color: var(--w-text);
  --border-color: var(--w-border);
  --border-width: 1px;
  --border-style: solid;
  --border-radius: var(--w-radius-card);
  --box-shadow: none;
  font-weight: 700;
}
@media (width >= 860px) {
  body.platform-web .login-content .login-row > ion-col {
    display: grid;
    grid-template-columns: 1.05fr 1fr;
  }
  body.platform-web .login-content .login-web-brand {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 28px;
    padding: 48px 44px;
    min-height: 560px;
  }
  body.platform-web .login-content .login-content-wrapper {
    padding: 48px;
  }
  body.platform-web .login-content .login-welcome-section,
  body.platform-web .login-content .login-signin-card {
    width: 100%;
    max-width: 380px;
    margin-right: auto !important;
    margin-left: auto !important;
  }
}
@media (width < 860px) {
  body.platform-web .login-content .login-row {
    min-height: auto;
    padding: 16px 12px calc(32px + env(safe-area-inset-bottom, 0px));
  }
  body.platform-web .login-content .login-row > ion-col {
    max-width: 520px !important;
    overflow: visible;
  }
  body.platform-web .login-content .login-web-brand {
    display: flex;
    flex-direction: column;
    gap: 18px;
    padding: 24px 20px 20px;
  }
  body.platform-web .login-content .login-web-brand .login-web-brand-trust {
    display: none;
  }
  body.platform-web .login-content .login-web-brand .login-web-brand-copy h2 {
    font-size: 22px;
  }
  body.platform-web .login-content .login-content-wrapper {
    padding: 20px 16px calc(28px + env(safe-area-inset-bottom, 0px));
  }
}
body.platform-web .login-email-content {
  --background: var(--w-canvas);
}
body.platform-web .login-email-content::part(scroll) {
  overflow-y: auto;
}
body.platform-web .login-email-content .login-email-container,
body.platform-web .login-email-content .login-email-row {
  min-height: 100%;
}
body.platform-web .login-email-content .login-email-row {
  min-height: 100dvh;
  align-items: center;
  box-sizing: border-box;
  padding: 40px 24px;
}
body.platform-web .login-email-content .login-email-row > ion-col {
  flex: 0 0 auto !important;
  width: 100% !important;
  max-width: 1000px !important;
  background: var(--w-card);
  border: 1px solid var(--w-border);
  border-radius: var(--w-radius);
  box-shadow: 0 24px 60px rgba(123, 164, 101, 0.14);
  overflow: hidden;
}
body.platform-web .login-email-content .login-email-content-wrapper {
  min-height: 0;
  justify-content: center;
  padding: 8px 0;
}
body.platform-web .login-email-content .login-email-welcome-section {
  padding: 0 0 0 4px !important;
  text-align: left !important;
}
body.platform-web .login-email-content .login-email-logo-container,
body.platform-web .login-email-content .login-email-welcome-subtitle {
  display: none !important;
}
body.platform-web .login-email-content .login-email-welcome-title {
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--w-sage);
}
body.platform-web .login-email-content .login-email-signin-card {
  --background: var(--w-card);
  background: var(--w-card);
  box-shadow: none;
  border-radius: 0;
  margin: 0;
}
body.platform-web .login-email-content .login-email-signin-card ion-card-content {
  padding: 0 var(--spacing-md) 24px;
}
body.platform-web .login-email-content .login-email-signin-card ion-card-title {
  color: var(--w-text) !important;
  font-size: 24px;
  font-weight: 800;
}
body.platform-web .login-email-content .login-email-signin-card ion-card-subtitle {
  color: var(--w-muted) !important;
  font-size: 14px;
}
body.platform-web .login-email-content .login-email-form-label {
  color: var(--w-text) !important;
}
body.platform-web .login-email-content .input-wrapper,
body.platform-web .login-email-content .input-wrapper-stretch {
  border: 1px solid var(--w-border);
  border-radius: var(--w-radius-card);
  overflow: hidden;
}
body.platform-web .login-email-content .input-wrapper:focus-within,
body.platform-web .login-email-content .input-wrapper-stretch:focus-within {
  border-color: var(--w-sage);
  box-shadow: 0 0 0 3px rgba(123, 164, 101, 0.12);
}
body.platform-web .login-email-content .input-country-selector {
  background: #f6f9f5;
  border-right: 1px solid var(--w-border);
}
body.platform-web .login-email-content .country-selector-field {
  position: relative;
}
body.platform-web .login-email-content .input-field {
  color: var(--w-text);
}
body.platform-web .login-email-content .login-email-next-btn {
  --background: var(--w-lime);
  --background-activated: var(--w-sage-hover);
  --background-hover: var(--w-sage);
  --color: #1a1d1a;
  --border-radius: 30px;
  --box-shadow: none;
  font-weight: 700;
}
body.platform-web .login-email-content .login-email-divider::before {
  background: var(--w-border);
  opacity: 1;
}
body.platform-web .login-email-content .login-email-divider .divider-text {
  background: var(--w-card);
  color: var(--w-muted);
}
body.platform-web .login-email-content .login-email-social-buttons {
  margin-bottom: 0;
}
body.platform-web .login-email-content .login-email-social-buttons ion-button {
  --background: var(--w-card);
  --background-hover: #f6f9f5;
  --color: var(--w-text);
  --border-color: var(--w-border);
  --border-width: 1px;
  --border-style: solid;
  --border-radius: var(--w-radius-card);
  --box-shadow: none;
  font-weight: 700;
}
@media (width >= 860px) {
  body.platform-web .login-email-content .login-email-row > ion-col {
    display: grid;
    grid-template-columns: 1.05fr 1fr;
  }
  body.platform-web .login-email-content .login-web-brand {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 28px;
    padding: 48px 44px;
    min-height: 560px;
  }
  body.platform-web .login-email-content .login-email-content-wrapper {
    padding: 48px;
  }
  body.platform-web .login-email-content .login-email-welcome-section,
  body.platform-web .login-email-content .login-email-signin-card {
    width: 100%;
    max-width: 380px;
    margin-right: auto !important;
    margin-left: auto !important;
  }
}
@media (width < 860px) {
  body.platform-web .login-email-content .login-email-row {
    min-height: auto;
    padding: 16px 12px calc(32px + env(safe-area-inset-bottom, 0px));
  }
  body.platform-web .login-email-content .login-email-row > ion-col {
    max-width: 520px !important;
    overflow: visible;
  }
  body.platform-web .login-email-content .login-web-brand {
    display: flex;
    flex-direction: column;
    gap: 18px;
    padding: 24px 20px 20px;
  }
  body.platform-web .login-email-content .login-web-brand .login-web-brand-trust {
    display: none;
  }
  body.platform-web .login-email-content .login-web-brand .login-web-brand-copy h2 {
    font-size: 22px;
  }
  body.platform-web .login-email-content .login-email-content-wrapper {
    padding: 20px 16px calc(28px + env(safe-area-inset-bottom, 0px));
  }
}
body.platform-web .user-phone-content {
  --background: var(--w-canvas);
}
body.platform-web .user-phone-content::part(scroll) {
  overflow-y: auto;
}
body.platform-web .user-phone-content .user-phone-container,
body.platform-web .user-phone-content .user-phone-row {
  min-height: 100%;
}
body.platform-web .user-phone-content .user-phone-row {
  min-height: 100dvh;
  align-items: center;
  box-sizing: border-box;
  padding: 40px 24px;
}
body.platform-web .user-phone-content .user-phone-row > ion-col {
  flex: 0 0 auto !important;
  width: 100% !important;
  max-width: 1000px !important;
  background: var(--w-card);
  border: 1px solid var(--w-border);
  border-radius: var(--w-radius);
  box-shadow: 0 24px 60px rgba(123, 164, 101, 0.14);
  overflow: hidden;
}
body.platform-web .user-phone-content .user-phone-content-wrapper {
  min-height: 0;
  justify-content: center;
  padding: 8px 0;
}
body.platform-web .user-phone-content .user-phone-welcome-section {
  padding: 0 0 0 4px !important;
  text-align: left !important;
}
body.platform-web .user-phone-content .user-phone-logo-container,
body.platform-web .user-phone-content .user-phone-welcome-subtitle {
  display: none !important;
}
body.platform-web .user-phone-content .user-phone-welcome-title {
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--w-sage);
}
body.platform-web .user-phone-content .user-phone-signin-card {
  --background: var(--w-card);
  background: var(--w-card);
  box-shadow: none;
  border-radius: 0;
  margin: 0;
}
body.platform-web .user-phone-content .user-phone-signin-card ion-card-content {
  padding: 0 var(--spacing-md) 24px;
}
body.platform-web .user-phone-content .user-phone-signin-card ion-card-title {
  color: var(--w-text) !important;
  font-size: 24px;
  font-weight: 800;
}
body.platform-web .user-phone-content .user-phone-signin-card ion-card-subtitle {
  color: var(--w-muted) !important;
  font-size: 14px;
}
body.platform-web .user-phone-content .user-phone-form-label {
  color: var(--w-text) !important;
}
body.platform-web .user-phone-content .input-wrapper,
body.platform-web .user-phone-content .input-wrapper-stretch {
  border: 1px solid var(--w-border);
  border-radius: var(--w-radius-card);
  overflow: hidden;
}
body.platform-web .user-phone-content .input-wrapper:focus-within,
body.platform-web .user-phone-content .input-wrapper-stretch:focus-within {
  border-color: var(--w-sage);
  box-shadow: 0 0 0 3px rgba(123, 164, 101, 0.12);
}
body.platform-web .user-phone-content .input-country-selector {
  background: #f6f9f5;
  border-right: 1px solid var(--w-border);
}
body.platform-web .user-phone-content .country-selector-field {
  position: relative;
}
body.platform-web .user-phone-content .input-field {
  color: var(--w-text);
}
body.platform-web .user-phone-content .user-phone-next-btn {
  --background: var(--w-lime);
  --background-activated: var(--w-sage-hover);
  --background-hover: var(--w-sage);
  --color: #1a1d1a;
  --border-radius: 30px;
  --box-shadow: none;
  font-weight: 700;
}
body.platform-web .user-phone-content .user-phone-divider::before {
  background: var(--w-border);
  opacity: 1;
}
body.platform-web .user-phone-content .user-phone-divider .divider-text {
  background: var(--w-card);
  color: var(--w-muted);
}
body.platform-web .user-phone-content .user-phone-social-buttons {
  margin-bottom: 0;
}
body.platform-web .user-phone-content .user-phone-social-buttons ion-button {
  --background: var(--w-card);
  --background-hover: #f6f9f5;
  --color: var(--w-text);
  --border-color: var(--w-border);
  --border-width: 1px;
  --border-style: solid;
  --border-radius: var(--w-radius-card);
  --box-shadow: none;
  font-weight: 700;
}
@media (width >= 860px) {
  body.platform-web .user-phone-content .user-phone-row > ion-col {
    display: grid;
    grid-template-columns: 1.05fr 1fr;
  }
  body.platform-web .user-phone-content .login-web-brand {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 28px;
    padding: 48px 44px;
    min-height: 560px;
  }
  body.platform-web .user-phone-content .user-phone-content-wrapper {
    padding: 48px;
  }
  body.platform-web .user-phone-content .user-phone-welcome-section,
  body.platform-web .user-phone-content .user-phone-signin-card {
    width: 100%;
    max-width: 380px;
    margin-right: auto !important;
    margin-left: auto !important;
  }
}
@media (width < 860px) {
  body.platform-web .user-phone-content .user-phone-row {
    min-height: auto;
    padding: 16px 12px calc(32px + env(safe-area-inset-bottom, 0px));
  }
  body.platform-web .user-phone-content .user-phone-row > ion-col {
    max-width: 520px !important;
    overflow: visible;
  }
  body.platform-web .user-phone-content .login-web-brand {
    display: flex;
    flex-direction: column;
    gap: 18px;
    padding: 24px 20px 20px;
  }
  body.platform-web .user-phone-content .login-web-brand .login-web-brand-trust {
    display: none;
  }
  body.platform-web .user-phone-content .login-web-brand .login-web-brand-copy h2 {
    font-size: 22px;
  }
  body.platform-web .user-phone-content .user-phone-content-wrapper {
    padding: 20px 16px calc(28px + env(safe-area-inset-bottom, 0px));
  }
}
body.platform-web .user-name-content {
  --background: var(--w-canvas);
}
body.platform-web .user-name-content::part(scroll) {
  overflow-y: auto;
}
body.platform-web .user-name-content .user-name-container,
body.platform-web .user-name-content .user-name-row {
  min-height: 100%;
}
body.platform-web .user-name-content .user-name-row {
  min-height: 100dvh;
  align-items: center;
  box-sizing: border-box;
  padding: 40px 24px;
}
body.platform-web .user-name-content .user-name-row > ion-col {
  flex: 0 0 auto !important;
  width: 100% !important;
  max-width: 1000px !important;
  background: var(--w-card);
  border: 1px solid var(--w-border);
  border-radius: var(--w-radius);
  box-shadow: 0 24px 60px rgba(123, 164, 101, 0.14);
  overflow: hidden;
}
body.platform-web .user-name-content .user-name-content-wrapper {
  min-height: 0;
  justify-content: center;
  padding: 8px 0;
}
body.platform-web .user-name-content .user-name-welcome-section {
  padding: 0 0 0 4px !important;
  text-align: left !important;
}
body.platform-web .user-name-content .user-name-logo-container,
body.platform-web .user-name-content .user-name-welcome-subtitle {
  display: none !important;
}
body.platform-web .user-name-content .user-name-welcome-title {
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--w-sage);
}
body.platform-web .user-name-content .user-name-signin-card {
  --background: var(--w-card);
  background: var(--w-card);
  box-shadow: none;
  border-radius: 0;
  margin: 0;
}
body.platform-web .user-name-content .user-name-signin-card ion-card-content {
  padding: 0 var(--spacing-md) 24px;
}
body.platform-web .user-name-content .user-name-signin-card ion-card-title {
  color: var(--w-text) !important;
  font-size: 24px;
  font-weight: 800;
}
body.platform-web .user-name-content .user-name-signin-card ion-card-subtitle {
  color: var(--w-muted) !important;
  font-size: 14px;
}
body.platform-web .user-name-content .user-name-form-label {
  color: var(--w-text) !important;
}
body.platform-web .user-name-content .input-wrapper,
body.platform-web .user-name-content .input-wrapper-stretch {
  border: 1px solid var(--w-border);
  border-radius: var(--w-radius-card);
  overflow: hidden;
}
body.platform-web .user-name-content .input-wrapper:focus-within,
body.platform-web .user-name-content .input-wrapper-stretch:focus-within {
  border-color: var(--w-sage);
  box-shadow: 0 0 0 3px rgba(123, 164, 101, 0.12);
}
body.platform-web .user-name-content .input-country-selector {
  background: #f6f9f5;
  border-right: 1px solid var(--w-border);
}
body.platform-web .user-name-content .country-selector-field {
  position: relative;
}
body.platform-web .user-name-content .input-field {
  color: var(--w-text);
}
body.platform-web .user-name-content .user-name-next-btn {
  --background: var(--w-lime);
  --background-activated: var(--w-sage-hover);
  --background-hover: var(--w-sage);
  --color: #1a1d1a;
  --border-radius: 30px;
  --box-shadow: none;
  font-weight: 700;
}
body.platform-web .user-name-content .user-name-divider::before {
  background: var(--w-border);
  opacity: 1;
}
body.platform-web .user-name-content .user-name-divider .divider-text {
  background: var(--w-card);
  color: var(--w-muted);
}
body.platform-web .user-name-content .user-name-social-buttons {
  margin-bottom: 0;
}
body.platform-web .user-name-content .user-name-social-buttons ion-button {
  --background: var(--w-card);
  --background-hover: #f6f9f5;
  --color: var(--w-text);
  --border-color: var(--w-border);
  --border-width: 1px;
  --border-style: solid;
  --border-radius: var(--w-radius-card);
  --box-shadow: none;
  font-weight: 700;
}
@media (width >= 860px) {
  body.platform-web .user-name-content .user-name-row > ion-col {
    display: grid;
    grid-template-columns: 1.05fr 1fr;
  }
  body.platform-web .user-name-content .login-web-brand {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 28px;
    padding: 48px 44px;
    min-height: 560px;
  }
  body.platform-web .user-name-content .user-name-content-wrapper {
    padding: 48px;
  }
  body.platform-web .user-name-content .user-name-welcome-section,
  body.platform-web .user-name-content .user-name-signin-card {
    width: 100%;
    max-width: 380px;
    margin-right: auto !important;
    margin-left: auto !important;
  }
}
@media (width < 860px) {
  body.platform-web .user-name-content .user-name-row {
    min-height: auto;
    padding: 16px 12px calc(32px + env(safe-area-inset-bottom, 0px));
  }
  body.platform-web .user-name-content .user-name-row > ion-col {
    max-width: 520px !important;
    overflow: visible;
  }
  body.platform-web .user-name-content .login-web-brand {
    display: flex;
    flex-direction: column;
    gap: 18px;
    padding: 24px 20px 20px;
  }
  body.platform-web .user-name-content .login-web-brand .login-web-brand-trust {
    display: none;
  }
  body.platform-web .user-name-content .login-web-brand .login-web-brand-copy h2 {
    font-size: 22px;
  }
  body.platform-web .user-name-content .user-name-content-wrapper {
    padding: 20px 16px calc(28px + env(safe-area-inset-bottom, 0px));
  }
}
body.platform-web .profile-select-content {
  --background: var(--w-canvas);
}
body.platform-web .profile-select-content::part(scroll) {
  overflow-y: auto;
}
body.platform-web .profile-select-content .profile-select-container,
body.platform-web .profile-select-content .profile-select-row {
  min-height: 100%;
}
body.platform-web .profile-select-content .profile-select-row {
  min-height: 100dvh;
  align-items: center;
  box-sizing: border-box;
  padding: 40px 24px;
}
body.platform-web .profile-select-content .profile-select-row > ion-col {
  flex: 0 0 auto !important;
  width: 100% !important;
  max-width: 1000px !important;
  background: var(--w-card);
  border: 1px solid var(--w-border);
  border-radius: var(--w-radius);
  box-shadow: 0 24px 60px rgba(123, 164, 101, 0.14);
  overflow: hidden;
}
body.platform-web .profile-select-content .profile-select-content-wrapper {
  min-height: 0;
  justify-content: center;
  padding: 8px 0;
}
body.platform-web .profile-select-content .profile-select-welcome-section {
  padding: 0 0 0 4px !important;
  text-align: left !important;
}
body.platform-web .profile-select-content .profile-select-logo-container,
body.platform-web .profile-select-content .profile-select-welcome-subtitle {
  display: none !important;
}
body.platform-web .profile-select-content .profile-select-welcome-title {
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--w-sage);
}
body.platform-web .profile-select-content .profile-select-signin-card {
  --background: var(--w-card);
  background: var(--w-card);
  box-shadow: none;
  border-radius: 0;
  margin: 0;
}
body.platform-web .profile-select-content .profile-select-signin-card ion-card-content {
  padding: 0 var(--spacing-md) 24px;
}
body.platform-web .profile-select-content .profile-select-signin-card ion-card-title {
  color: var(--w-text) !important;
  font-size: 24px;
  font-weight: 800;
}
body.platform-web .profile-select-content .profile-select-signin-card ion-card-subtitle {
  color: var(--w-muted) !important;
  font-size: 14px;
}
body.platform-web .profile-select-content .profile-select-form-label {
  color: var(--w-text) !important;
}
body.platform-web .profile-select-content .input-wrapper,
body.platform-web .profile-select-content .input-wrapper-stretch {
  border: 1px solid var(--w-border);
  border-radius: var(--w-radius-card);
  overflow: hidden;
}
body.platform-web .profile-select-content .input-wrapper:focus-within,
body.platform-web .profile-select-content .input-wrapper-stretch:focus-within {
  border-color: var(--w-sage);
  box-shadow: 0 0 0 3px rgba(123, 164, 101, 0.12);
}
body.platform-web .profile-select-content .input-country-selector {
  background: #f6f9f5;
  border-right: 1px solid var(--w-border);
}
body.platform-web .profile-select-content .country-selector-field {
  position: relative;
}
body.platform-web .profile-select-content .input-field {
  color: var(--w-text);
}
body.platform-web .profile-select-content .profile-select-next-btn {
  --background: var(--w-lime);
  --background-activated: var(--w-sage-hover);
  --background-hover: var(--w-sage);
  --color: #1a1d1a;
  --border-radius: 30px;
  --box-shadow: none;
  font-weight: 700;
}
body.platform-web .profile-select-content .profile-select-divider::before {
  background: var(--w-border);
  opacity: 1;
}
body.platform-web .profile-select-content .profile-select-divider .divider-text {
  background: var(--w-card);
  color: var(--w-muted);
}
body.platform-web .profile-select-content .profile-select-social-buttons {
  margin-bottom: 0;
}
body.platform-web .profile-select-content .profile-select-social-buttons ion-button {
  --background: var(--w-card);
  --background-hover: #f6f9f5;
  --color: var(--w-text);
  --border-color: var(--w-border);
  --border-width: 1px;
  --border-style: solid;
  --border-radius: var(--w-radius-card);
  --box-shadow: none;
  font-weight: 700;
}
@media (width >= 860px) {
  body.platform-web .profile-select-content .profile-select-row > ion-col {
    display: grid;
    grid-template-columns: 1.05fr 1fr;
  }
  body.platform-web .profile-select-content .login-web-brand {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 28px;
    padding: 48px 44px;
    min-height: 560px;
  }
  body.platform-web .profile-select-content .profile-select-content-wrapper {
    padding: 48px;
  }
  body.platform-web .profile-select-content .profile-select-welcome-section,
  body.platform-web .profile-select-content .profile-select-signin-card {
    width: 100%;
    max-width: 380px;
    margin-right: auto !important;
    margin-left: auto !important;
  }
}
@media (width < 860px) {
  body.platform-web .profile-select-content .profile-select-row {
    min-height: auto;
    padding: 16px 12px calc(32px + env(safe-area-inset-bottom, 0px));
  }
  body.platform-web .profile-select-content .profile-select-row > ion-col {
    max-width: 520px !important;
    overflow: visible;
  }
  body.platform-web .profile-select-content .login-web-brand {
    display: flex;
    flex-direction: column;
    gap: 18px;
    padding: 24px 20px 20px;
  }
  body.platform-web .profile-select-content .login-web-brand .login-web-brand-trust {
    display: none;
  }
  body.platform-web .profile-select-content .login-web-brand .login-web-brand-copy h2 {
    font-size: 22px;
  }
  body.platform-web .profile-select-content .profile-select-content-wrapper {
    padding: 20px 16px calc(28px + env(safe-area-inset-bottom, 0px));
  }
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) {
  --background:
    radial-gradient(
      circle at 12% 18%,
      rgb(111 149 92 / 32%),
      transparent 32%),
    radial-gradient(
      circle at 88% 82%,
      rgb(221 107 126 / 20%),
      transparent 30%),
    radial-gradient(
      circle at 72% 12%,
      rgb(244 192 67 / 18%),
      transparent 24%),
    linear-gradient(
      135deg,
      #dce9d5 0%,
      #f4eee5 52%,
      #e2ecd9 100%);
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) :is(.login-container, .login-email-container, .user-phone-container, .user-name-container, .profile-select-container) {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background:
    radial-gradient(
      circle at 14% 16%,
      rgba(111, 149, 92, 0.28),
      transparent 31%),
    radial-gradient(
      circle at 87% 84%,
      rgba(221, 107, 126, 0.16),
      transparent 28%),
    radial-gradient(
      circle at 72% 10%,
      rgba(244, 192, 67, 0.13),
      transparent 22%),
    linear-gradient(
      135deg,
      #dce9d5 0%,
      #f4eee5 52%,
      #e2ecd9 100%);
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) :is(.login-container, .login-email-container, .user-phone-container, .user-name-container, .profile-select-container)::before,
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) :is(.login-container, .login-email-container, .user-phone-container, .user-name-container, .profile-select-container)::after {
  content: "";
  position: absolute;
  z-index: 0;
  border-radius: 50%;
  pointer-events: none;
  filter: blur(2px);
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) :is(.login-container, .login-email-container, .user-phone-container, .user-name-container, .profile-select-container)::before {
  top: -180px;
  left: -140px;
  width: 440px;
  height: 440px;
  border: 1px solid rgb(var(--ion-color-primary-rgb)/18%);
  box-shadow: 0 0 0 54px rgb(var(--ion-color-primary-rgb)/6%), 0 0 0 108px rgb(var(--ion-color-primary-rgb)/3%);
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) :is(.login-container, .login-email-container, .user-phone-container, .user-name-container, .profile-select-container)::after {
  right: -120px;
  bottom: -180px;
  width: 380px;
  height: 380px;
  background: rgba(229, 126, 145, 0.1);
  box-shadow: 0 0 90px rgba(229, 126, 145, 0.14);
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) :is(.login-row, .login-email-row, .user-phone-row, .user-name-row, .profile-select-row) {
  position: relative;
  z-index: 1;
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) :is(.login-row, .login-email-row, .user-phone-row, .user-name-row, .profile-select-row, .signup-pregnant-row, .signup-mother-row) > ion-col {
  border-color: rgba(65, 88, 54, 0.1);
  border-radius: 24px !important;
  overflow: hidden !important;
  box-shadow: 0 34px 90px rgba(50, 72, 40, 0.14), 0 8px 24px rgba(50, 72, 40, 0.07);
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) .login-web-brand {
  background:
    radial-gradient(
      circle at 82% 20%,
      rgba(255, 255, 255, 0.14),
      transparent 28%),
    linear-gradient(
      145deg,
      #6f955c 0%,
      #82a96c 52%,
      #628451 100%);
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) .login-web-brand::after {
  content: "";
  position: absolute;
  right: -90px;
  bottom: -110px;
  z-index: 1;
  width: 330px;
  height: 330px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 50%;
  box-shadow: 0 0 0 46px rgba(255, 255, 255, 0.03), 0 0 0 92px rgba(255, 255, 255, 0.02);
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) .login-web-brand-logo {
  letter-spacing: -0.02em;
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) .login-web-brand-mark {
  box-shadow: 0 8px 22px rgba(31, 50, 24, 0.18);
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) .login-web-brand-copy h2 {
  max-width: 390px;
  font-size: clamp(30px, 2.3vw, 38px);
  letter-spacing: -0.035em;
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) .login-web-brand-trust li {
  padding: 3px 0;
  text-shadow: 0 1px 1px rgba(35, 54, 26, 0.12);
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) :is(.login-content-wrapper, .login-email-content-wrapper, .user-phone-content-wrapper, .user-name-content-wrapper, .profile-select-content-wrapper) {
  background:
    radial-gradient(
      circle at 100% 0%,
      rgba(111, 149, 92, 0.18),
      transparent 36%),
    radial-gradient(
      circle at 0% 100%,
      rgba(221, 107, 126, 0.1),
      transparent 32%),
    linear-gradient(
      145deg,
      #e7f0e1 0%,
      #eef2e5 48%,
      #f4e7dd 100%);
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) :is(.login-signin-card, .login-email-signin-card, .user-phone-signin-card, .user-name-signin-card, .profile-select-signin-card) {
  --background: transparent;
  background: transparent;
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) :is(.login-signin-card, .login-email-signin-card, .user-phone-signin-card, .user-name-signin-card, .profile-select-signin-card) ion-card-header {
  padding-bottom: 22px;
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) :is(.login-signin-card, .login-email-signin-card, .user-phone-signin-card, .user-name-signin-card, .profile-select-signin-card) ion-card-title {
  color: var(--ion-text-color, #1e281b);
  font-weight: 800;
  letter-spacing: -0.025em;
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) :is(.login-signin-card, .login-email-signin-card, .user-phone-signin-card, .user-name-signin-card, .profile-select-signin-card) ion-card-subtitle {
  color: var(--ion-color-step-600, #4b5847);
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) .user-name-card-eyebrow {
  margin-bottom: 8px;
  color: var(--w-sage);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) .user-phone-card-eyebrow {
  margin-bottom: 8px;
  color: var(--w-sage);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) .user-phone-form-group {
  position: relative;
  margin-bottom: 18px;
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) .user-phone-form-group .country-dropdown {
  top: auto !important;
  bottom: calc(100% + 6px) !important;
  transform-origin: bottom left !important;
  box-shadow: 0 -14px 36px rgba(40, 60, 30, 0.18), 0 -4px 10px rgba(0, 0, 0, 0.08) !important;
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) .user-phone-buttons {
  margin: 10px 0 0;
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) .user-phone-buttons .btn-light {
  --background: #f7faf5;
  --background-hover: #eff5eb;
  --background-activated: #e7f0e2;
  --color: var(--w-text, #1e281b);
  --border-color: var(--w-border);
  --border-radius: 30px;
  --border-style: solid;
  --border-width: 1px;
  --box-shadow: none;
  font-weight: 700;
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) .user-name-form-group {
  padding: 18px;
  border: 1px solid rgba(111, 149, 92, 0.16);
  border-radius: 18px;
  background: rgba(255, 252, 244, 0.58);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.64);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) .user-name-buttons {
  margin: 18px 0 0;
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) .profile-select-card-eyebrow {
  margin-bottom: 8px;
  color: var(--w-sage);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) .profile-select-back {
  display: inline-flex;
  width: 100%;
  max-width: 480px;
  align-items: center;
  gap: 7px;
  padding: 0;
  margin: 0 auto 8px;
  border: 0;
  background: transparent;
  color: var(--w-muted);
  cursor: pointer;
  font-family: inherit;
  font-size: 13px;
  font-weight: 700;
  transition: color 160ms ease;
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) .profile-select-back ion-icon {
  font-size: 17px;
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) .profile-select-back:hover {
  color: var(--w-sage);
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) .profile-select-back:focus-visible {
  border-radius: 6px;
  outline: 3px solid rgba(123, 164, 101, 0.16);
  outline-offset: 4px;
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) .profile-select-content-wrapper {
  height: auto;
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) .profile-select-signin-card ion-card-header {
  padding-top: 16px;
  padding-bottom: 16px;
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) .profile-select-signin-card ion-card-title {
  font-size: 24px;
  line-height: 1.2;
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) .profile-select-signin-card ion-card-subtitle {
  margin-top: 5px;
  color: var(--w-muted) !important;
  font-size: 13px;
  line-height: 1.5;
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) .profile-select-signin-card ion-card-content {
  padding-bottom: 18px;
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) .profile-select-options {
  gap: 9px;
  margin-bottom: 14px;
  overflow: visible;
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) .profile-select-option {
  --background: rgb(255 253 248 / 92%);
  --background-hover: #f2f7ef;
  --background-activated: #edf4e9;
  --padding-start: 0;
  --padding-end: 0;
  --inner-padding-end: 0;
  --ripple-color: rgb(123 164 101 / 12%);
  overflow: visible;
  border-radius: 16px !important;
  background: transparent;
  transition: transform 180ms ease, box-shadow 180ms ease;
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) .profile-select-option::before {
  display: none;
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) .profile-select-option::part(native) {
  min-height: 76px;
  padding: 10px 14px;
  border: 1px solid rgba(111, 149, 92, 0.18);
  border-radius: 16px;
  background: var(--background);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7);
  transition:
    background-color 180ms ease,
    border-color 180ms ease,
    box-shadow 180ms ease;
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) .profile-select-option:hover {
  transform: none;
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) .profile-select-option:hover::part(native) {
  border-color: rgba(111, 149, 92, 0.42);
  background: var(--background-hover);
  box-shadow: 0 10px 24px rgba(68, 97, 54, 0.09), inset 0 1px 0 rgba(255, 255, 255, 0.76);
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) .profile-select-option:focus-within::part(native) {
  border-color: var(--w-sage);
  box-shadow: 0 0 0 3px rgba(123, 164, 101, 0.12);
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) .profile-select-option ion-label.profile-info {
  display: block;
  min-width: 0;
  margin: 0;
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) .profile-select-option .profile-select-option-header {
  gap: 10px;
  margin-bottom: 2px;
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) .profile-select-option .profile-select-option-header .option-icon {
  width: 34px;
  height: 34px;
  padding: 7px;
  border-radius: 10px;
  background: rgba(123, 164, 101, 0.12);
  color: var(--w-sage) !important;
  font-size: 19px;
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) .profile-select-option .profile-select-option-header .option-title {
  color: var(--w-text) !important;
  font-size: 15px;
  font-weight: 700;
  line-height: 20px;
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) .profile-select-option .option-description {
  padding-left: 44px;
  color: var(--w-muted) !important;
  font-size: 12.5px;
  line-height: 1.4;
  opacity: 1 !important;
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) .profile-select-option .check-icon {
  margin-left: 12px;
  color: var(--w-sage) !important;
  font-size: 22px;
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) .profile-select-option.selected {
  --background: #edf5e8;
  background: transparent !important;
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) .profile-select-option.selected::part(native) {
  border-color: var(--w-sage);
  background:
    linear-gradient(
      135deg,
      #edf5e8 0%,
      #f7faf4 100%);
  box-shadow: 0 0 0 2px rgba(123, 164, 101, 0.1), 0 10px 24px rgba(68, 97, 54, 0.08);
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) .profile-select-option.selected ion-label h3,
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) .profile-select-option.selected ion-label p {
  color: inherit !important;
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) .profile-select-option.selected .option-icon {
  background: var(--w-sage);
  color: #fff !important;
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) .profile-select-option.selected .option-title {
  color: var(--w-text) !important;
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) .profile-select-option.selected .option-description {
  color: var(--w-muted) !important;
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) .profile-select-option.selected .check-icon {
  color: var(--w-sage) !important;
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) .profile-select-buttons {
  gap: 0;
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) .profile-select-continue-btn {
  --background: var(--w-lime);
  --background-activated: var(--w-sage-hover);
  --background-hover: var(--w-sage);
  --border-radius: 30px;
  --box-shadow: none;
  --color: #1a1d1a;
  min-height: 48px;
  font-weight: 700;
  transition: transform 180ms ease, box-shadow 180ms ease;
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) .profile-select-continue-btn:not(.button-disabled):hover {
  transform: translateY(-1px);
  box-shadow: 0 10px 24px rgba(68, 97, 54, 0.1);
}
@media (width >= 860px) {
  body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) .profile-select-row > ion-col {
    max-width: 1140px !important;
    grid-template-columns: 0.88fr 1.12fr;
  }
  body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) .profile-select-row {
    padding-block: clamp(18px, 3vh, 28px);
  }
  body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) .profile-select-content-wrapper {
    padding: 24px 44px;
  }
  body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) .profile-select-signin-card {
    max-width: 480px;
  }
  body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content).profile-select-content .login-web-brand {
    min-height: 540px;
    padding: 34px 40px;
    gap: 20px;
  }
  body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content).profile-select-content .login-web-brand-copy h2 {
    font-size: clamp(28px, 2.1vw, 34px);
    margin-bottom: 10px;
  }
  body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content).profile-select-content .login-web-brand-copy p {
    font-size: 14px;
    line-height: 1.5;
  }
  body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content).profile-select-content .login-web-brand-trust {
    gap: 10px;
  }
  body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content).profile-select-content .login-web-brand-trust li {
    padding: 1px 0;
    font-size: 13px;
  }
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) :is(.input-wrapper, .input-wrapper-stretch) {
  background: rgba(255, 252, 244, 0.78);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  transition:
    border-color 180ms ease,
    box-shadow 180ms ease,
    background-color 180ms ease;
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) :is(.input-wrapper, .input-wrapper-stretch):focus-within {
  background: #fffaf1;
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) .country-selector-field {
  position: relative;
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) .country-selector-field.dropdown-open .input-wrapper-stretch {
  border-color: var(--w-sage);
  box-shadow: 0 0 0 3px rgba(123, 164, 101, 0.12);
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) .country-selector-field.dropdown-open .dropdown-icon {
  transform: rotate(180deg);
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) .input-country-selector .dropdown-icon {
  transition: transform 180ms ease;
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) .country-dropdown {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  z-index: 9999 !important;
  width: 100%;
  max-width: 100%;
  overflow: hidden;
  border: 1px solid rgba(111, 149, 92, 0.24);
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 18px 44px rgba(50, 72, 40, 0.18), 0 4px 12px rgba(50, 72, 40, 0.08);
  animation: country-dropdown-enter 160ms ease-out;
  transform-origin: top left;
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) .country-dropdown-header {
  display: flex;
  align-items: center;
  padding: 12px 14px 10px;
  border-bottom: 1px solid rgba(111, 149, 92, 0.14);
  color: var(--w-text);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) .country-dropdown-list {
  max-height: 180px;
  overflow-y: auto;
  padding: 6px;
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) .country-dropdown-option {
  display: flex;
  width: 100%;
  min-height: 58px;
  align-items: center;
  gap: 12px;
  padding: 9px 10px;
  border: 0;
  border-radius: 11px;
  background: transparent;
  color: var(--w-text);
  cursor: pointer;
  text-align: left;
  transition: background-color 160ms ease, color 160ms ease;
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) .country-dropdown-option:hover,
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) .country-dropdown-option:focus-visible {
  background: #edf4e9;
  outline: none;
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) .country-dropdown-option.selected {
  background: rgba(123, 164, 101, 0.16);
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) .country-dropdown-flag {
  display: flex;
  width: 32px;
  height: 24px;
  flex: 0 0 auto;
  overflow: hidden;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(65, 88, 54, 0.1);
  border-radius: 6px;
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) .country-dropdown-flag ion-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) .country-dropdown-copy {
  display: flex;
  min-width: 0;
  flex: 1;
  flex-direction: column;
  gap: 1px;
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) .country-dropdown-copy strong {
  display: block;
  overflow: hidden;
  padding-bottom: 2px;
  font-size: 14px;
  font-weight: 700;
  line-height: 20px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) .country-dropdown-copy small {
  color: var(--w-muted);
  font-size: 12px;
  line-height: 16px;
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) .country-dropdown-check {
  flex: 0 0 auto;
  color: var(--w-sage);
  font-size: 19px;
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) :is(.login-divider, .login-email-divider) .divider-text {
  background: #edf0e5;
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) :is(.login-social-buttons, .login-email-social-buttons) ion-button {
  --background: rgb(255 252 246 / 70%);
  --background-hover: rgb(255 255 255 / 90%);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) :is(.login-next-btn, .login-email-next-btn, .user-name-next-btn),
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) :is(.login-social-buttons, .login-email-social-buttons) ion-button {
  transition: transform 180ms ease, box-shadow 180ms ease;
}
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) :is(.login-next-btn, .login-email-next-btn, .user-name-next-btn):not(.button-disabled):hover,
body.platform-web :is(.login-content, .login-email-content, .user-phone-content, .user-name-content, .profile-select-content) :is(.login-social-buttons, .login-email-social-buttons) ion-button:hover {
  transform: translateY(-1px);
  box-shadow: 0 10px 24px rgba(68, 97, 54, 0.1);
}
@media (width <= 480px) {
  body.platform-web .login-content {
    --overflow: auto;
  }
  body.platform-web .login-content::part(scroll) {
    overflow: hidden auto;
  }
  body.platform-web .login-content .login-container {
    height: auto;
    min-height: 100%;
  }
  body.platform-web .login-content .login-row {
    height: auto;
    min-height: 100dvh;
    align-items: flex-start;
    padding: max(10px, env(safe-area-inset-top, 0px)) max(10px, env(safe-area-inset-right, 0px)) max(10px, env(safe-area-inset-bottom, 0px)) max(10px, env(safe-area-inset-left, 0px));
  }
  body.platform-web .login-content :is(.login-row, .user-name-row) > ion-col {
    min-width: 0;
    border-radius: 20px;
    overflow: hidden;
  }
  body.platform-web .login-content .user-name-content-wrapper {
    border-radius: 0 0 20px 20px;
    overflow: hidden;
  }
  body.platform-web .login-content .user-name-row .login-web-brand {
    border-radius: 20px 20px 0 0;
    overflow: hidden;
  }
  body.platform-web .login-content .login-web-brand {
    gap: 14px;
    padding: 20px 18px 18px;
  }
  body.platform-web .login-content .login-web-brand-logo {
    gap: 8px;
    font-size: 20px;
  }
  body.platform-web .login-content .login-web-brand-mark {
    width: 36px;
    height: 36px;
  }
  body.platform-web .login-content .login-web-brand-mark ion-img {
    width: 25px;
    height: 25px;
  }
  body.platform-web .login-content .login-web-brand-copy h2 {
    margin-bottom: 8px;
    font-size: clamp(20px, 7vw, 23px);
    line-height: 1.2;
  }
  body.platform-web .login-content .login-web-brand-copy p {
    font-size: 13px;
    line-height: 1.5;
  }
  body.platform-web .login-content .login-content-wrapper {
    min-width: 0;
    padding: 18px 14px 22px;
  }
  body.platform-web .login-content .login-welcome-section {
    min-width: 0;
    padding-left: 12px !important;
  }
  body.platform-web .login-content .login-signin-card {
    min-width: 0;
  }
  body.platform-web .login-content .login-signin-card ion-card-header {
    padding: 12px 12px 14px;
  }
  body.platform-web .login-content .login-signin-card ion-card-title {
    font-size: 21px;
  }
  body.platform-web .login-content .login-signin-card ion-card-subtitle {
    font-size: 13px;
    line-height: 1.45;
  }
  body.platform-web .login-content .login-signin-card ion-card-content {
    padding-right: 12px;
    padding-bottom: 18px;
    padding-left: 12px;
  }
  body.platform-web .login-content .login-form-group {
    min-width: 0;
    margin-bottom: 14px;
  }
  body.platform-web .login-content .country-selector-field,
  body.platform-web .login-content .input-wrapper-stretch,
  body.platform-web .login-content .input-field {
    min-width: 0;
  }
  body.platform-web .login-content .input-country-selector {
    flex: 0 0 auto;
    padding-right: 8px;
    padding-left: 8px;
  }
  body.platform-web .login-content .input-field {
    width: 100%;
    padding-right: 10px;
    padding-left: 10px;
  }
  body.platform-web .login-content .country-dropdown {
    width: 100%;
    max-width: 100%;
  }
  body.platform-web .login-content .login-next-btn {
    margin-top: 12px;
    margin-bottom: 14px;
  }
  body.platform-web .login-content .login-divider {
    margin: 14px 0;
  }
  body.platform-web .login-content .login-social-buttons ion-row {
    gap: 8px;
    flex-wrap: nowrap;
  }
  body.platform-web .login-content .login-social-buttons ion-col {
    min-width: 0;
    flex: 1 1 0;
    padding: 0 !important;
  }
  body.platform-web .login-content .login-guest-section {
    padding-bottom: max(12px, env(safe-area-inset-bottom, 0px));
  }
}
@media (width <= 480px) and (height <= 700px) {
  body.platform-web .login-content .login-web-brand {
    gap: 10px;
    padding-top: 16px;
    padding-bottom: 14px;
  }
  body.platform-web .login-content .login-web-brand-copy p {
    display: none;
  }
  body.platform-web .login-content .login-content-wrapper {
    padding-top: 14px;
    padding-bottom: 16px;
  }
  body.platform-web .login-content .login-signin-card ion-card-subtitle {
    font-size: 12px;
    line-height: 1.4;
  }
}
body.platform-web .login-email-header,
body.platform-web .user-name-header,
body.platform-web .signup-mother-header,
body.platform-web .signup-pregnant-header,
body.platform-web .otp-header {
  display: none;
}
body.platform-web .otp-content {
  --background:
    radial-gradient(
      circle at 12% 18%,
      rgb(111 149 92 / 32%),
      transparent 32%),
    radial-gradient(
      circle at 88% 82%,
      rgb(221 107 126 / 20%),
      transparent 30%),
    radial-gradient(
      circle at 72% 12%,
      rgb(244 192 67 / 18%),
      transparent 24%),
    linear-gradient(
      135deg,
      #dce9d5 0%,
      #f4eee5 52%,
      #e2ecd9 100%);
}
body.platform-web .otp-content::part(scroll) {
  overflow-y: auto;
}
body.platform-web .otp-content .otp-container {
  position: relative;
  isolation: isolate;
  height: auto;
  min-height: 100%;
  overflow: hidden;
  background:
    radial-gradient(
      circle at 14% 16%,
      rgba(111, 149, 92, 0.28),
      transparent 31%),
    radial-gradient(
      circle at 87% 84%,
      rgba(221, 107, 126, 0.16),
      transparent 28%),
    radial-gradient(
      circle at 72% 10%,
      rgba(244, 192, 67, 0.13),
      transparent 22%),
    linear-gradient(
      135deg,
      #dce9d5 0%,
      #f4eee5 52%,
      #e2ecd9 100%);
}
body.platform-web .otp-content .otp-container::before,
body.platform-web .otp-content .otp-container::after {
  content: "";
  position: absolute;
  z-index: 0;
  border-radius: 50%;
  pointer-events: none;
  filter: blur(2px);
}
body.platform-web .otp-content .otp-container::before {
  top: -180px;
  left: -140px;
  width: 440px;
  height: 440px;
  border: 1px solid rgb(var(--ion-color-primary-rgb)/18%);
  box-shadow: 0 0 0 54px rgb(var(--ion-color-primary-rgb)/6%), 0 0 0 108px rgb(var(--ion-color-primary-rgb)/3%);
}
body.platform-web .otp-content .otp-container::after {
  right: -120px;
  bottom: -180px;
  width: 380px;
  height: 380px;
  background: rgba(229, 126, 145, 0.1);
  box-shadow: 0 0 90px rgba(229, 126, 145, 0.14);
}
body.platform-web .otp-content .otp-container,
body.platform-web .otp-content .otp-row {
  min-height: 100%;
}
body.platform-web .otp-content .otp-row {
  position: relative;
  z-index: 1;
  height: auto;
  min-height: 100%;
  align-items: center;
  padding: 40px 24px;
}
body.platform-web .otp-content .otp-row > ion-col {
  flex: 0 0 auto !important;
  width: 100% !important;
  max-width: 1000px !important;
  background: var(--w-card);
  border: 1px solid rgba(65, 88, 54, 0.1);
  border-radius: 28px;
  box-shadow: 0 34px 90px rgba(50, 72, 40, 0.14), 0 8px 24px rgba(50, 72, 40, 0.07);
  overflow: hidden;
}
body.platform-web .otp-content .otp-content-wrapper {
  min-height: 0;
  justify-content: center;
  padding: 8px 0;
  background:
    radial-gradient(
      circle at 100% 0%,
      rgba(111, 149, 92, 0.18),
      transparent 36%),
    radial-gradient(
      circle at 0% 100%,
      rgba(221, 107, 126, 0.1),
      transparent 32%),
    linear-gradient(
      145deg,
      #e7f0e1 0%,
      #eef2e5 48%,
      #f4e7dd 100%);
}
body.platform-web .otp-content .otp-welcome-section {
  display: none;
}
body.platform-web .otp-content .otp-web-back {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: none;
  border: none;
  padding: 0;
  width: 100%;
  max-width: 380px;
  margin: 0 auto 14px;
  color: var(--w-muted);
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
}
body.platform-web .otp-content .otp-web-back ion-icon {
  font-size: 16px;
}
body.platform-web .otp-content .otp-web-back:hover {
  color: var(--w-sage);
}
body.platform-web .otp-content .otp-web-back:focus-visible {
  border-radius: 6px;
  outline: 3px solid rgba(123, 164, 101, 0.16);
  outline-offset: 4px;
}
body.platform-web .otp-content .otp-card {
  --background: transparent;
  background: transparent;
  box-shadow: none;
  border-radius: 0;
  margin: 0;
}
body.platform-web .otp-content .otp-card ion-card-header {
  padding-bottom: 20px;
}
body.platform-web .otp-content .otp-card ion-card-title {
  color: var(--w-text) !important;
  font-size: 24px;
  font-weight: 800;
  letter-spacing: -0.025em;
}
body.platform-web .otp-content .otp-card ion-card-subtitle {
  color: var(--w-muted) !important;
  font-size: 14px;
  line-height: 1.55;
}
body.platform-web .otp-content .otp-card ion-card-content {
  padding-bottom: 24px;
}
body.platform-web .otp-content .otp-card-eyebrow {
  margin-bottom: 8px;
  color: var(--w-sage);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
body.platform-web .otp-content .otp-form-group {
  padding: 20px;
  border: 1px solid rgba(111, 149, 92, 0.16);
  border-radius: 18px;
  background: rgba(255, 252, 244, 0.58);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.64);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
}
body.platform-web .otp-content .input-otp-container {
  gap: 12px;
}
body.platform-web .otp-content .input-otp {
  flex: 1 1 0;
  width: auto;
  max-width: 64px;
  height: 60px;
  background: rgba(255, 255, 255, 0.78);
  border: 1px solid rgba(111, 149, 92, 0.22);
  border-radius: var(--w-radius-card);
  color: var(--w-text);
  box-shadow: inset 0 1px 2px rgba(50, 72, 40, 0.04);
  transition:
    border-color 180ms ease,
    background-color 180ms ease,
    box-shadow 180ms ease,
    transform 180ms ease;
}
body.platform-web .otp-content .input-otp:hover:not(:disabled) {
  border-color: rgba(111, 149, 92, 0.38);
  background: #fffdf8;
}
body.platform-web .otp-content .input-otp:focus {
  border-color: var(--w-sage);
  background: #fffdf8;
  box-shadow: 0 0 0 3px rgba(123, 164, 101, 0.12), 0 8px 18px rgba(68, 97, 54, 0.08);
  transform: translateY(-1px);
}
body.platform-web .otp-content .otp-timer {
  color: var(--w-sage);
  font-variant-numeric: tabular-nums;
}
body.platform-web .otp-content .otp-resend-text {
  color: var(--w-muted);
  opacity: 1;
}
body.platform-web .otp-content .otp-resend-link {
  color: var(--w-sage);
}
body.platform-web .otp-content .otp-signin-btn {
  --background: var(--w-lime);
  --background-activated: var(--w-sage-hover);
  --background-hover: var(--w-sage);
  --color: #1a1d1a;
  --border-radius: 30px;
  --box-shadow: none;
  font-weight: 700;
  transition: transform 180ms ease, box-shadow 180ms ease;
}
body.platform-web .otp-content .otp-signin-btn:not(.button-disabled):hover {
  transform: translateY(-1px);
  box-shadow: 0 10px 24px rgba(68, 97, 54, 0.1);
}
@media (width >= 860px) {
  body.platform-web .otp-content .otp-row > ion-col {
    display: grid;
    grid-template-columns: 1.05fr 1fr;
  }
  body.platform-web .otp-content .login-web-brand {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 28px;
    padding: 48px 44px;
    min-height: 560px;
  }
  body.platform-web .otp-content .otp-content-wrapper {
    padding: 48px;
  }
  body.platform-web .otp-content .otp-card {
    width: 100%;
    max-width: 380px;
    margin-right: auto !important;
    margin-left: auto !important;
  }
}
@media (width < 860px) {
  body.platform-web .otp-content .otp-row > ion-col {
    max-width: 520px !important;
  }
  body.platform-web .otp-content .login-web-brand {
    display: flex;
    flex-direction: column;
    gap: 18px;
    padding: 34px 28px 28px;
  }
  body.platform-web .otp-content .login-web-brand .login-web-brand-trust {
    display: none;
  }
  body.platform-web .otp-content .login-web-brand .login-web-brand-copy h2 {
    font-size: 24px;
  }
  body.platform-web .otp-content .otp-content-wrapper {
    padding: 28px 24px 36px;
  }
}
@media (width <= 480px) {
  body.platform-web .otp-content .otp-row {
    align-items: flex-start;
    padding: max(10px, env(safe-area-inset-top, 0px)) max(10px, env(safe-area-inset-right, 0px)) max(10px, env(safe-area-inset-bottom, 0px)) max(10px, env(safe-area-inset-left, 0px));
  }
  body.platform-web .otp-content .otp-row > ion-col {
    min-width: 0;
    border-radius: 20px;
  }
  body.platform-web .otp-content .login-web-brand {
    gap: 14px;
    padding: 20px 18px 18px;
  }
  body.platform-web .otp-content .login-web-brand-logo {
    gap: 8px;
    font-size: 20px;
  }
  body.platform-web .otp-content .login-web-brand-mark {
    width: 36px;
    height: 36px;
  }
  body.platform-web .otp-content .login-web-brand-mark ion-img {
    width: 25px;
    height: 25px;
  }
  body.platform-web .otp-content .login-web-brand-copy h2 {
    margin-bottom: 8px;
    font-size: clamp(20px, 7vw, 23px);
    line-height: 1.2;
  }
  body.platform-web .otp-content .login-web-brand-copy p {
    font-size: 13px;
    line-height: 1.5;
  }
  body.platform-web .otp-content .otp-content-wrapper {
    min-width: 0;
    padding: 18px 14px 22px;
  }
  body.platform-web .otp-content .otp-web-back {
    margin-bottom: 10px;
  }
  body.platform-web .otp-content .otp-card {
    min-width: 0;
  }
  body.platform-web .otp-content .otp-card ion-card-header {
    padding-right: 12px;
    padding-bottom: 14px;
    padding-left: 12px;
  }
  body.platform-web .otp-content .otp-card ion-card-title {
    font-size: 21px;
  }
  body.platform-web .otp-content .otp-card ion-card-content {
    padding-right: 12px;
    padding-bottom: 18px;
    padding-left: 12px;
  }
  body.platform-web .otp-content .otp-form-group {
    min-width: 0;
    padding: 12px 10px;
    border-radius: 15px;
  }
  body.platform-web .otp-content .input-otp-container {
    min-width: 0;
    gap: clamp(6px, 2.2vw, 10px);
  }
  body.platform-web .otp-content .input-otp {
    min-width: 0;
    max-width: 58px;
    height: clamp(48px, 15vw, 56px);
    font-size: clamp(18px, 6vw, 22px);
  }
  body.platform-web .otp-content .otp-signin-btn {
    margin-top: 14px;
    margin-bottom: 4px;
  }
}
@media (width <= 480px) and (height <= 700px) {
  body.platform-web .otp-content .login-web-brand {
    gap: 10px;
    padding-top: 16px;
    padding-bottom: 14px;
  }
  body.platform-web .otp-content .login-web-brand-copy p {
    display: none;
  }
  body.platform-web .otp-content .otp-content-wrapper {
    padding-top: 14px;
    padding-bottom: 16px;
  }
  body.platform-web .otp-content .otp-card ion-card-subtitle {
    font-size: 12px;
    line-height: 1.4;
  }
  body.platform-web .otp-content .otp-form-group {
    margin-bottom: 10px;
  }
  body.platform-web .otp-content .otp-timer-section {
    margin-top: 10px;
  }
}
body.platform-web .signup-mother-content {
  --background:
    radial-gradient(
      circle at 12% 18%,
      rgb(111 149 92 / 32%),
      transparent 32%),
    radial-gradient(
      circle at 88% 82%,
      rgb(221 107 126 / 20%),
      transparent 30%),
    linear-gradient(
      135deg,
      #dce9d5 0%,
      #f4eee5 52%,
      #e2ecd9 100%);
}
body.platform-web .signup-mother-content::part(scroll) {
  overflow-y: auto;
}
body.platform-web .signup-mother-content .signup-mother-container {
  position: relative;
  isolation: isolate;
  min-height: 100%;
  overflow: hidden;
  background:
    radial-gradient(
      circle at 14% 16%,
      rgba(111, 149, 92, 0.28),
      transparent 31%),
    radial-gradient(
      circle at 87% 84%,
      rgba(221, 107, 126, 0.16),
      transparent 28%),
    linear-gradient(
      135deg,
      #dce9d5 0%,
      #f4eee5 52%,
      #e2ecd9 100%);
}
body.platform-web .signup-mother-content .signup-mother-container::before,
body.platform-web .signup-mother-content .signup-mother-container::after {
  content: "";
  position: absolute;
  z-index: 0;
  border-radius: 50%;
  pointer-events: none;
}
body.platform-web .signup-mother-content .signup-mother-container::before {
  top: -190px;
  left: -150px;
  width: 460px;
  height: 460px;
  border: 1px solid rgb(var(--ion-color-primary-rgb)/18%);
  box-shadow: 0 0 0 58px rgb(var(--ion-color-primary-rgb)/6%), 0 0 0 116px rgb(var(--ion-color-primary-rgb)/3%);
}
body.platform-web .signup-mother-content .signup-mother-container::after {
  right: -130px;
  bottom: -190px;
  width: 400px;
  height: 400px;
  background: rgba(229, 126, 145, 0.1);
  box-shadow: 0 0 100px rgba(229, 126, 145, 0.14);
}
body.platform-web .signup-mother-content .signup-mother-row {
  position: relative;
  z-index: 1;
  min-height: 100%;
  align-items: center;
  padding: 28px 24px;
}
body.platform-web .signup-mother-content .signup-mother-row > ion-col {
  flex: 0 0 auto !important;
  width: 100% !important;
  max-width: 1160px !important;
  overflow: hidden;
  border: 1px solid rgba(65, 88, 54, 0.1);
  border-radius: 28px;
  background: var(--w-card);
  box-shadow: 0 34px 90px rgba(50, 72, 40, 0.14), 0 8px 24px rgba(50, 72, 40, 0.07);
}
body.platform-web .signup-mother-content .signup-mother-content-wrapper {
  min-height: 0;
  justify-content: center;
  padding: 28px 42px;
  background:
    radial-gradient(
      circle at 100% 0%,
      rgba(111, 149, 92, 0.18),
      transparent 36%),
    radial-gradient(
      circle at 0% 100%,
      rgba(221, 107, 126, 0.1),
      transparent 32%),
    linear-gradient(
      145deg,
      #e7f0e1 0%,
      #eef2e5 48%,
      #f4e7dd 100%);
}
body.platform-web .signup-mother-content .signup-mother-welcome-section {
  display: none;
}
body.platform-web .signup-mother-content .signup-mother-back {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 0;
  margin: 0 0 12px;
  border: 0;
  background: transparent;
  color: var(--w-muted);
  cursor: pointer;
  font-family: inherit;
  font-size: 13px;
  font-weight: 700;
}
body.platform-web .signup-mother-content .signup-mother-back ion-icon {
  font-size: 17px;
}
body.platform-web .signup-mother-content .signup-mother-back:hover {
  color: var(--w-sage);
}
body.platform-web .signup-mother-content .signup-mother-back:focus-visible {
  border-radius: 6px;
  outline: 3px solid rgba(123, 164, 101, 0.16);
  outline-offset: 4px;
}
body.platform-web .signup-mother-content .signup-mother-web-heading {
  margin-bottom: 18px;
}
body.platform-web .signup-mother-content .signup-mother-web-heading h1 {
  margin: 5px 0 6px;
  color: var(--w-text);
  font-size: 26px;
  font-weight: 800;
  letter-spacing: -0.03em;
  line-height: 1.2;
}
body.platform-web .signup-mother-content .signup-mother-web-heading p {
  max-width: 560px;
  margin: 0;
  color: var(--w-muted);
  font-size: 13.5px;
  line-height: 1.5;
}
body.platform-web .signup-mother-content .signup-mother-web-eyebrow {
  color: var(--w-sage);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
body.platform-web .signup-mother-content .signup-mother-referral-banner {
  --background: rgb(255 252 244 / 76%);
  border: 1px solid rgba(111, 149, 92, 0.18);
  border-radius: 14px;
  box-shadow: none;
}
body.platform-web .signup-mother-content .signup-mother-card {
  --background: transparent;
  overflow: visible;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
body.platform-web .signup-mother-content .signup-mother-card ion-card-content {
  padding: 0;
}
body.platform-web .signup-mother-content .signup-mother-form {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px 16px;
  padding: 20px;
  border: 1px solid rgba(111, 149, 92, 0.16);
  border-radius: 20px;
  background: rgba(255, 252, 244, 0.58);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.66);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
}
body.platform-web .signup-mother-content .signup-mother-required-note {
  grid-column: 1/-1;
  width: fit-content;
  padding: 5px 9px;
  margin: 0;
  border: 0;
  border-radius: 8px;
  background: rgba(210, 77, 95, 0.09);
  color: var(--w-pink-strong);
  font-size: 12px;
}
body.platform-web .signup-mother-content .signup-mother-input-wrapper,
body.platform-web .signup-mother-content .signup-mother-gender-section {
  min-width: 0;
  margin: 0;
}
body.platform-web .signup-mother-content .signup-mother-gender-section,
body.platform-web .signup-mother-content .signup-mother-children-list,
body.platform-web .signup-mother-content .signup-mother-edit-actions,
body.platform-web .signup-mother-content .signup-mother-max-limit-note,
body.platform-web .signup-mother-content .signup-mother-add-more-btn,
body.platform-web .signup-mother-content .signup-mother-next-btn {
  grid-column: 1/-1;
}
body.platform-web .signup-mother-content .signup-mother-label {
  display: block;
  margin-bottom: 7px;
  color: var(--w-text);
  font-size: 13px;
  font-weight: 700;
}
body.platform-web .signup-mother-content .signup-mother-input-wrapper .input-wrapper {
  border: 1px solid var(--w-border);
  border-radius: 13px;
  background: rgba(255, 255, 255, 0.8);
}
body.platform-web .signup-mother-content .signup-mother-input-wrapper .input-wrapper:focus-within {
  border-color: var(--w-sage);
  background: #fffdf8;
  box-shadow: 0 0 0 3px rgba(123, 164, 101, 0.12);
}
body.platform-web .signup-mother-content .signup-mother-gender-toggle {
  gap: 10px;
}
body.platform-web .signup-mother-content .signup-mother-gender-btn {
  min-height: 46px;
  padding: 9px 13px;
  border: 1px solid var(--w-border);
  border-radius: 13px;
  background: rgba(255, 255, 255, 0.76);
  color: var(--w-text);
  font-size: 13px;
}
body.platform-web .signup-mother-content .signup-mother-gender-btn:hover {
  border-color: rgba(111, 149, 92, 0.38);
  background: #f5f9f2;
}
body.platform-web .signup-mother-content .signup-mother-gender-btn:focus-visible {
  outline: 3px solid rgba(123, 164, 101, 0.12);
  outline-offset: 2px;
}
body.platform-web .signup-mother-content .signup-mother-gender-btn.active {
  border-color: var(--w-sage);
  background: #edf5e8;
  box-shadow: 0 0 0 2px rgba(123, 164, 101, 0.08);
}
body.platform-web .signup-mother-content .signup-mother-gender-btn.active .gender-icon {
  color: var(--w-sage);
}
body.platform-web .signup-mother-content .signup-mother-children-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin: 0;
  overflow: visible;
  background: transparent;
}
body.platform-web .signup-mother-content .signup-mother-child-item {
  --background: rgb(255 255 255 / 74%);
  --color: var(--w-text);
  --padding-start: 0;
  --padding-end: 0;
  --inner-padding-end: 0;
  margin: 0;
  border: 1px solid var(--w-border);
  border-radius: 14px;
  background: transparent;
}
body.platform-web .signup-mother-content .signup-mother-child-item::part(native) {
  min-height: 86px;
  padding: 11px 12px;
  border-radius: 14px;
  background: var(--background);
}
body.platform-web .signup-mother-content .signup-mother-child-item.editing {
  border-color: var(--w-pink-strong);
  background: rgba(210, 77, 95, 0.06);
}
body.platform-web .signup-mother-content .signup-mother-child-item .child-info {
  color: var(--w-text);
}
body.platform-web .signup-mother-content .signup-mother-child-item .child-info ion-text {
  --color: var(--w-muted);
  color: var(--w-muted) !important;
}
body.platform-web .signup-mother-content .signup-mother-child-item .child-info ion-text p {
  color: var(--w-muted) !important;
  font-size: 12px;
}
body.platform-web .signup-mother-content .signup-mother-child-item .child-name p {
  color: var(--w-text) !important;
}
body.platform-web .signup-mother-content .signup-mother-child-item .child-actions {
  gap: 2px;
}
body.platform-web .signup-mother-content .signup-mother-child-item .child-actions .action-btn {
  --padding-start: 6px;
  --padding-end: 6px;
  --color: var(--w-sage);
  min-height: 34px;
}
body.platform-web .signup-mother-content .signup-mother-child-item .child-actions .edit-btn {
  --color: var(--w-sage) !important;
  color: var(--w-sage) !important;
}
body.platform-web .signup-mother-content .signup-mother-child-item .child-actions .edit-btn ion-icon {
  color: var(--w-sage) !important;
}
body.platform-web .signup-mother-content .signup-mother-child-item .child-actions .edit-btn:hover {
  --color: var(--w-sage-hover) !important;
  background: rgba(111, 149, 92, 0.09);
}
body.platform-web .signup-mother-content .signup-mother-child-item .child-actions .delete-btn {
  --color: var(--w-pink-strong);
}
body.platform-web .signup-mother-content .signup-mother-edit-actions {
  margin: 0;
}
body.platform-web .signup-mother-content .signup-mother-add-more-btn {
  --border-color: rgb(111 149 92 / 42%);
  --border-radius: 999px;
  --background: rgb(255 255 255 / 52%);
  --color: var(--w-sage);
  min-height: 44px;
  margin: 0;
  font-weight: 700;
}
body.platform-web .signup-mother-content .signup-mother-add-more-btn.button-disabled {
  --background: #edf2e9;
  --border-color: #c8d2c3;
  --color: #5f6d61;
  color: #5f6d61 !important;
  opacity: 1;
}
body.platform-web .signup-mother-content .signup-mother-add-more-btn.button-disabled span {
  color: #5f6d61 !important;
}
body.platform-web .signup-mother-content .signup-mother-next-btn {
  --background: var(--w-lime);
  --background-hover: var(--w-sage);
  --background-activated: var(--w-sage-hover);
  --border-radius: 999px;
  --box-shadow: none;
  --color: #1a1d1a;
  min-height: 48px;
  margin: 0;
  font-weight: 700;
}
body.platform-web .signup-mother-content .signup-mother-next-btn.button-disabled {
  --background: #dce8d5;
  --color: #7a857c;
  opacity: 1;
}
body.platform-web .signup-mother-content .signup-mother-next-btn:not(.button-disabled):hover {
  transform: translateY(-1px);
  box-shadow: 0 10px 24px rgba(68, 97, 54, 0.1);
}
@media (width >= 900px) {
  body.platform-web .signup-mother-content .signup-mother-row > ion-col {
    display: grid;
    grid-template-columns: 0.78fr 1.22fr;
  }
  body.platform-web .signup-mother-content .login-web-brand {
    display: flex;
    min-height: 600px;
    flex-direction: column;
    justify-content: space-between;
    gap: 22px;
    padding: 38px 40px;
  }
}
@media (width < 900px) {
  body.platform-web .signup-mother-content .signup-mother-row {
    min-height: auto;
    padding: 16px 12px calc(32px + env(safe-area-inset-bottom, 0px));
  }
  body.platform-web .signup-mother-content .signup-mother-row > ion-col {
    max-width: 680px !important;
    overflow: visible;
  }
  body.platform-web .signup-mother-content .login-web-brand {
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 24px 20px 20px;
  }
  body.platform-web .signup-mother-content .login-web-brand .login-web-brand-trust {
    display: none;
  }
  body.platform-web .signup-mother-content .signup-mother-content-wrapper {
    padding: 20px 16px calc(28px + env(safe-area-inset-bottom, 0px));
  }
}
@media (width < 620px) {
  body.platform-web .signup-mother-content .signup-mother-form,
  body.platform-web .signup-mother-content .signup-mother-children-list {
    grid-template-columns: 1fr;
  }
  body.platform-web .signup-mother-content .signup-mother-input-wrapper {
    grid-column: 1/-1;
  }
}
body.platform-web .signup-pregnant-content {
  --background:
    radial-gradient(
      circle at 12% 18%,
      rgb(111 149 92 / 32%),
      transparent 32%),
    radial-gradient(
      circle at 88% 82%,
      rgb(221 107 126 / 20%),
      transparent 30%),
    linear-gradient(
      135deg,
      #dce9d5 0%,
      #f4eee5 52%,
      #e2ecd9 100%);
}
body.platform-web .signup-pregnant-content::part(scroll) {
  overflow-y: auto;
}
body.platform-web .signup-pregnant-content .signup-pregnant-container {
  position: relative;
  isolation: isolate;
  min-height: 100%;
  overflow: hidden;
  background:
    radial-gradient(
      circle at 14% 16%,
      rgba(111, 149, 92, 0.28),
      transparent 31%),
    radial-gradient(
      circle at 87% 84%,
      rgba(221, 107, 126, 0.16),
      transparent 28%),
    linear-gradient(
      135deg,
      #dce9d5 0%,
      #f4eee5 52%,
      #e2ecd9 100%);
}
body.platform-web .signup-pregnant-content .signup-pregnant-container::before,
body.platform-web .signup-pregnant-content .signup-pregnant-container::after {
  content: "";
  position: absolute;
  z-index: 0;
  border-radius: 50%;
  pointer-events: none;
}
body.platform-web .signup-pregnant-content .signup-pregnant-container::before {
  top: -190px;
  left: -150px;
  width: 460px;
  height: 460px;
  border: 1px solid rgb(var(--ion-color-primary-rgb)/18%);
  box-shadow: 0 0 0 58px rgb(var(--ion-color-primary-rgb)/6%), 0 0 0 116px rgb(var(--ion-color-primary-rgb)/3%);
}
body.platform-web .signup-pregnant-content .signup-pregnant-container::after {
  right: -130px;
  bottom: -190px;
  width: 400px;
  height: 400px;
  background: rgba(229, 126, 145, 0.1);
  box-shadow: 0 0 100px rgba(229, 126, 145, 0.14);
}
body.platform-web .signup-pregnant-content .signup-pregnant-row {
  position: relative;
  z-index: 1;
  min-height: 100%;
  align-items: center;
  padding: 28px 24px;
}
body.platform-web .signup-pregnant-content .signup-pregnant-row > ion-col {
  flex: 0 0 auto !important;
  width: 100% !important;
  max-width: 1120px !important;
  overflow: hidden;
  border: 1px solid rgba(65, 88, 54, 0.1);
  border-radius: 28px;
  background: var(--w-card);
  box-shadow: 0 34px 90px rgba(50, 72, 40, 0.14), 0 8px 24px rgba(50, 72, 40, 0.07);
}
body.platform-web .signup-pregnant-content .signup-pregnant-content-wrapper {
  min-height: 0;
  justify-content: center;
  padding: 30px 42px 34px;
  background:
    radial-gradient(
      circle at 100% 0%,
      rgba(111, 149, 92, 0.18),
      transparent 36%),
    radial-gradient(
      circle at 0% 100%,
      rgba(221, 107, 126, 0.1),
      transparent 32%),
    linear-gradient(
      145deg,
      #e7f0e1 0%,
      #eef2e5 48%,
      #f4e7dd 100%);
}
body.platform-web .signup-pregnant-content .signup-pregnant-welcome-section {
  display: none;
}
body.platform-web .signup-pregnant-content .signup-pregnant-back {
  display: inline-flex;
  align-items: center;
  align-self: flex-start;
  gap: 7px;
  padding: 0;
  margin: 0 0 12px;
  border: 0;
  background: transparent;
  color: var(--w-muted);
  cursor: pointer;
  font-family: inherit;
  font-size: 13px;
  font-weight: 700;
}
body.platform-web .signup-pregnant-content .signup-pregnant-back ion-icon {
  font-size: 17px;
}
body.platform-web .signup-pregnant-content .signup-pregnant-back:hover {
  color: var(--w-sage);
}
body.platform-web .signup-pregnant-content .signup-pregnant-back:focus-visible {
  border-radius: 6px;
  outline: 3px solid rgba(123, 164, 101, 0.16);
  outline-offset: 4px;
}
body.platform-web .signup-pregnant-content .signup-pregnant-web-heading {
  margin-bottom: 18px;
}
body.platform-web .signup-pregnant-content .signup-pregnant-web-heading h1 {
  margin: 5px 0 6px;
  color: var(--w-text);
  font-size: 27px;
  font-weight: 800;
  letter-spacing: -0.03em;
  line-height: 1.2;
}
body.platform-web .signup-pregnant-content .signup-pregnant-web-heading p {
  max-width: 560px;
  margin: 0;
  color: var(--w-muted);
  font-size: 13.5px;
  line-height: 1.5;
}
body.platform-web .signup-pregnant-content .signup-pregnant-web-eyebrow {
  color: var(--w-sage);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
body.platform-web .signup-pregnant-content .signup-pregnant-referral-banner {
  --background: rgb(255 252 244 / 76%);
  border: 1px solid rgba(111, 149, 92, 0.18);
  border-radius: 14px;
  box-shadow: none;
}
body.platform-web .signup-pregnant-content .signup-pregnant-date-card {
  --background: transparent;
  overflow: visible;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
body.platform-web .signup-pregnant-content .signup-pregnant-date-card ion-card-content {
  padding: 0;
}
body.platform-web .signup-pregnant-content .signup-pregnant-form {
  padding: 18px;
  border: 1px solid rgba(111, 149, 92, 0.16);
  border-radius: 20px;
  background: rgba(255, 252, 244, 0.58);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.66);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
}
body.platform-web .signup-pregnant-content .signup-pregnant-date-type-toggle {
  gap: 10px;
  margin-bottom: 16px;
}
body.platform-web .signup-pregnant-content .signup-pregnant-toggle-btn {
  min-height: 48px;
  padding: 10px 14px;
  border: 1px solid var(--w-border);
  border-radius: 13px;
  background: rgba(255, 255, 255, 0.76);
  color: var(--w-text);
  font-size: 13px;
  font-weight: 700;
  transition:
    border-color 180ms ease,
    background 180ms ease,
    box-shadow 180ms ease;
}
body.platform-web .signup-pregnant-content .signup-pregnant-toggle-btn:hover {
  border-color: rgba(111, 149, 92, 0.38);
  background: #f5f9f2;
}
body.platform-web .signup-pregnant-content .signup-pregnant-toggle-btn:focus-visible {
  outline: 3px solid rgba(123, 164, 101, 0.12);
  outline-offset: 2px;
}
body.platform-web .signup-pregnant-content .signup-pregnant-toggle-btn.active {
  border-color: var(--w-sage);
  background: #edf5e8;
  box-shadow: 0 0 0 2px rgba(123, 164, 101, 0.08);
}
body.platform-web .signup-pregnant-content .signup-pregnant-toggle-btn.active .toggle-icon {
  color: var(--w-sage);
}
body.platform-web .signup-pregnant-content .signup-pregnant-date-heading {
  display: flex;
  flex-direction: column;
  gap: 3px;
  margin: 0 2px 8px;
}
body.platform-web .signup-pregnant-content .signup-pregnant-date-heading span {
  color: var(--w-text);
  font-size: 13px;
  font-weight: 700;
}
body.platform-web .signup-pregnant-content .signup-pregnant-date-heading small {
  color: var(--w-muted);
  font-size: 12px;
  line-height: 1.4;
}
body.platform-web .signup-pregnant-content .signup-pregnant-datetime-wrapper {
  padding: 0;
  margin: 0 0 14px;
  overflow: hidden;
  border: 1px solid var(--w-border);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.74);
}
body.platform-web .signup-pregnant-content .signup-pregnant-datetime-wrapper ion-datetime {
  width: min(100%, 420px) !important;
  max-width: 420px !important;
  --background: transparent;
  --background-rgb:
    255,
    255,
    255;
  --wheel-fade-background-rgb:
    255,
    255,
    255;
  --wheel-highlight-background: rgb(111 149 92 / 10%);
}
body.platform-web .signup-pregnant-content .signup-pregnant-datetime-wrapper ion-datetime::part(wheel-item) {
  color: #68736a;
  font-weight: 600;
  opacity: 0.72;
}
body.platform-web .signup-pregnant-content .signup-pregnant-datetime-wrapper ion-datetime::part(wheel-item-active) {
  color: #202820;
  font-weight: 750;
  opacity: 1;
}
body.platform-web .signup-pregnant-content .signup-pregnant-next-btn {
  --background: var(--w-lime);
  --background-hover: var(--w-sage);
  --background-activated: var(--w-sage-hover);
  --border-radius: 999px;
  --box-shadow: none;
  --color: #1a1d1a;
  min-height: 48px;
  margin: 0;
  font-weight: 700;
}
body.platform-web .signup-pregnant-content .signup-pregnant-next-btn.button-disabled {
  --background: #dce8d5;
  --color: #7a857c;
  opacity: 1;
}
body.platform-web .signup-pregnant-content .signup-pregnant-next-btn:not(.button-disabled):hover {
  transform: translateY(-1px);
  box-shadow: 0 10px 24px rgba(68, 97, 54, 0.1);
}
@media (width >= 900px) {
  body.platform-web .signup-pregnant-content .signup-pregnant-row > ion-col {
    display: grid;
    grid-template-columns: 0.9fr 1.1fr;
  }
  body.platform-web .signup-pregnant-content .login-web-brand {
    display: flex;
    min-height: 660px;
    flex-direction: column;
    justify-content: space-between;
    gap: 22px;
    padding: 38px 40px;
  }
}
@media (width < 900px) {
  body.platform-web .signup-pregnant-content .signup-pregnant-row {
    min-height: auto;
    padding: 16px 12px calc(32px + env(safe-area-inset-bottom, 0px));
  }
  body.platform-web .signup-pregnant-content .signup-pregnant-row > ion-col {
    max-width: 680px !important;
    overflow: visible;
  }
  body.platform-web .signup-pregnant-content .login-web-brand {
    display: flex;
    flex-direction: column;
    gap: 14px;
    padding: 20px 18px 16px;
  }
  body.platform-web .signup-pregnant-content .login-web-brand .login-web-brand-trust {
    display: none;
  }
  body.platform-web .signup-pregnant-content .login-web-brand .login-web-brand-copy h2 {
    font-size: 22px;
  }
  body.platform-web .signup-pregnant-content .signup-pregnant-content-wrapper {
    padding: 18px 16px calc(24px + env(safe-area-inset-bottom, 0px));
  }
}
@media (width <= 480px) {
  body.platform-web .signup-pregnant-content .signup-pregnant-row {
    padding: 8px 6px calc(20px + env(safe-area-inset-bottom, 0px));
  }
  body.platform-web .signup-pregnant-content .signup-pregnant-row > ion-col {
    border-radius: 18px;
  }
  body.platform-web .signup-pregnant-content .login-web-brand {
    gap: 10px;
    padding: 14px 14px 12px;
  }
  body.platform-web .signup-pregnant-content .login-web-brand .login-web-brand-logo {
    gap: 8px;
    font-size: 18px;
  }
  body.platform-web .signup-pregnant-content .login-web-brand .login-web-brand-copy h2 {
    margin-bottom: 2px;
    font-size: 18px;
    line-height: 1.25;
  }
  body.platform-web .signup-pregnant-content .login-web-brand .login-web-brand-copy p {
    font-size: 12px;
    line-height: 1.4;
  }
  body.platform-web .signup-pregnant-content .signup-pregnant-content-wrapper {
    padding: 12px 10px calc(18px + env(safe-area-inset-bottom, 0px));
  }
  body.platform-web .signup-pregnant-content .signup-pregnant-web-heading {
    margin-bottom: 10px;
  }
  body.platform-web .signup-pregnant-content .signup-pregnant-web-heading h1 {
    margin: 2px 0 3px;
    font-size: 19px;
  }
  body.platform-web .signup-pregnant-content .signup-pregnant-web-heading p {
    font-size: 12px;
    line-height: 1.4;
  }
  body.platform-web .signup-pregnant-content .signup-pregnant-form {
    padding: 12px;
    border-radius: 16px;
  }
  body.platform-web .signup-pregnant-content .signup-pregnant-date-type-toggle {
    gap: 8px;
    margin-bottom: 10px;
  }
  body.platform-web .signup-pregnant-content .signup-pregnant-toggle-btn {
    min-height: 42px;
    padding: 8px 10px;
    font-size: 12px;
  }
  body.platform-web .signup-pregnant-content .signup-pregnant-toggle-btn span {
    line-height: 1.3;
  }
  body.platform-web .signup-pregnant-content .signup-pregnant-datetime-wrapper {
    margin-bottom: 10px;
  }
  body.platform-web .signup-pregnant-content .signup-pregnant-datetime-wrapper ion-datetime {
    width: 100% !important;
    max-width: 100% !important;
  }
  body.platform-web .signup-pregnant-content .signup-pregnant-next-btn {
    min-height: 44px;
  }
}
@media (height <= 720px) {
  body.platform-web .signup-pregnant-content .login-web-brand {
    gap: 8px;
    padding-top: 12px;
    padding-bottom: 10px;
  }
  body.platform-web .signup-pregnant-content .login-web-brand .login-web-brand-copy p {
    display: none;
  }
  body.platform-web .signup-pregnant-content .signup-pregnant-content-wrapper {
    padding-top: 10px;
    padding-bottom: 14px;
  }
  body.platform-web .signup-pregnant-content .signup-pregnant-web-heading {
    margin-bottom: 8px;
  }
  body.platform-web .signup-pregnant-content .signup-pregnant-web-heading p {
    display: none;
  }
  body.platform-web .signup-pregnant-content .signup-pregnant-form {
    padding: 10px;
  }
  body.platform-web .signup-pregnant-content .signup-pregnant-datetime-wrapper {
    margin-bottom: 8px;
  }
}
body.platform-web .shop-content {
  --background: var(--w-canvas);
}
@media (width >= 768px) {
  body.platform-web .shop-content .ion-padding-horizontal,
  body.platform-web .shop-content .shop-content-padded {
    width: 100%;
    max-width: var(--w-max);
    margin-right: auto;
    margin-left: auto;
  }
  body.platform-web .shop-content .quick-links-card-list {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
  }
  body.platform-web .shop-content .product-section-scroll {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    overflow: visible;
  }
  body.platform-web .shop-content .product-section-scroll app-product-card {
    flex: initial;
    width: auto;
    max-width: none;
  }
}
@media (width >= 480px) and (width < 768px) {
  body.platform-web .shop-content .product-section-scroll {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
    overflow: visible;
  }
  body.platform-web .shop-content .product-section-scroll app-product-card {
    flex: initial;
    width: auto;
    max-width: none;
  }
}
body.platform-web .shop-content .quick-links-card-item {
  background: var(--w-card);
  border: 1px solid var(--w-border);
  border-radius: var(--w-radius-card);
  box-shadow: 0 8px 22px rgba(123, 164, 101, 0.06);
  transition: transform 0.25s ease, border-color 0.25s ease;
}
body.platform-web .shop-content .quick-links-card-item:hover {
  transform: translateY(-4px);
  border-color: var(--w-sage);
}
body.platform-web .shop-content app-banner-carousel {
  display: block;
  border-radius: var(--w-radius);
  overflow: hidden;
}
body.platform-web .shop-content app-banner-carousel .banner-carousel,
body.platform-web .shop-content app-banner-carousel .carousel-slides {
  width: 100%;
  max-width: none;
  margin-inline: 0;
}
body.platform-web .shop-content app-product-card .product-card {
  background: var(--w-card);
  border: 1px solid var(--w-border);
  border-radius: var(--w-radius-card);
  box-shadow: 0 8px 22px rgba(123, 164, 101, 0.06);
  transition:
    transform 0.25s ease,
    border-color 0.25s ease,
    box-shadow 0.25s ease;
}
body.platform-web .shop-content app-product-card .product-card:hover {
  transform: translateY(-4px);
  border-color: var(--w-sage);
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.06);
}
body.platform-web .shop-content app-product-card .product-card-current-price {
  color: var(--w-pink);
  font-weight: 800;
}
body.platform-web .shop-content app-product-card .product-card-add-to-cart-btn,
body.platform-web .shop-content app-product-card .product-card-cart-control {
  --background: var(--w-pink);
  --color: #fff;
  background: var(--w-pink);
  color: #fff;
}
body.platform-web :is(.shop-content, .category-products-content, .section-products-content, .search-product-content) app-product-card .product-card-current-price {
  color: var(--w-pink-strong);
}
body.platform-web :is(.shop-content, .category-products-content, .section-products-content, .search-product-content) app-product-card .product-card-discount-badge {
  display: none;
}
body.platform-web :is(.shop-content, .category-products-content, .section-products-content, .search-product-content) app-product-card .product-card-image {
  overflow: hidden;
}
body.platform-web :is(.shop-content, .category-products-content, .section-products-content, .search-product-content) app-product-card .product-card-image img {
  transition: transform 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
}
body.platform-web :is(.shop-content, .category-products-content, .section-products-content, .search-product-content) app-product-card .product-card:hover .product-card-image img {
  transform: scale(1.06);
}
body.platform-web :is(.shop-content, .category-products-content, .section-products-content, .search-product-content) app-product-card .product-card-badge {
  position: absolute;
  top: 8px;
  z-index: 4;
  padding: 4px 8px;
  border-radius: 8px;
  font-size: 11px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.2px;
}
body.platform-web :is(.shop-content, .category-products-content, .section-products-content, .search-product-content) app-product-card .product-card-badge-promo {
  left: 8px;
  background: var(--w-sage);
  color: #fff;
}
body.platform-web :is(.shop-content, .category-products-content, .section-products-content, .search-product-content) app-product-card .product-card-badge-oos {
  left: 8px;
  background: #5b6660;
  color: #fff;
}
body.platform-web :is(.shop-content, .category-products-content, .section-products-content, .search-product-content) app-product-card .product-card-badge-disc {
  right: 8px;
  background: var(--w-pink);
  color: #fff;
}
body.platform-web :is(.shop-content, .category-products-content, .section-products-content, .search-product-content) app-product-card .product-card-quickview {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 4;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 14px;
  border: 1px solid var(--w-border);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.95);
  box-shadow: var(--w-shadow-sm);
  color: var(--w-text);
  font-size: 13px;
  font-weight: 700;
  white-space: nowrap;
  cursor: pointer;
  opacity: 0;
  transform: translate(-50%, calc(-50% + 8px));
  transition:
    opacity 0.25s ease,
    transform 0.25s ease,
    color 0.2s ease,
    border-color 0.2s ease;
}
body.platform-web :is(.shop-content, .category-products-content, .section-products-content, .search-product-content) app-product-card .product-card-quickview ion-icon {
  font-size: 16px;
}
body.platform-web :is(.shop-content, .category-products-content, .section-products-content, .search-product-content) app-product-card .product-card-quickview:hover {
  color: var(--w-sage);
  border-color: var(--w-sage);
}
body.platform-web :is(.shop-content, .category-products-content, .section-products-content, .search-product-content) app-product-card .product-card:hover .product-card-quickview,
body.platform-web :is(.shop-content, .category-products-content, .section-products-content, .search-product-content) app-product-card .product-card:focus-within .product-card-quickview {
  opacity: 1;
  transform: translate(-50%, -50%);
}
body.platform-web :is(.shop-content, .category-products-content, .section-products-content, .search-product-content) app-product-card .product-card--oos .product-card-image {
  opacity: 0.5;
}
body.platform-web :is(.shop-content, .category-products-content, .section-products-content, .search-product-content) app-product-card .product-card--oos .product-card-cart-control {
  background: #b9c0b6;
  pointer-events: none;
}
body.platform-web :is(.shop-content, .category-products-content, .section-products-content, .search-product-content) app-product-card .product-card:focus-visible,
body.platform-web :is(.shop-content, .category-products-content, .section-products-content, .search-product-content) app-product-card .product-card-quickview:focus-visible,
body.platform-web :is(.shop-content, .category-products-content, .section-products-content, .search-product-content) app-product-card .product-card-cart-control:focus-visible {
  outline: 3px solid var(--w-sage);
  outline-offset: 2px;
}
body.platform-web .shop-content .my-order-btn {
  --border-color: var(--w-sage);
  --color: var(--w-sage);
  --border-radius: 30px;
  --background: var(--w-card);
  max-width: 320px;
  margin-right: auto;
  margin-left: auto;
  font-weight: 700;
}
body.platform-web .shop-content .shop-hero {
  display: block;
  margin: var(--w-space-5) max(var(--w-space-5), (100% - var(--w-max)) / 2) var(--w-space-6);
  background:
    linear-gradient(
      120deg,
      #eaf3e6 0%,
      #f3f8f0 60%,
      #fdfdfb 100%);
  border: 1px solid var(--w-border);
  border-radius: var(--w-radius-main);
  box-shadow: var(--w-shadow-lg);
  overflow: hidden;
}
body.platform-web .shop-content .shop-hero-copy {
  padding: var(--w-space-7);
  display: flex;
  flex-direction: column;
  gap: var(--w-space-3);
}
body.platform-web .shop-content .shop-hero-eyebrow {
  font-size: var(--w-fs-caption, 13px);
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--w-sage);
}
body.platform-web .shop-content .shop-hero-title {
  margin: 0;
  font-size: var(--w-fs-display, 32px);
  font-weight: 800;
  line-height: 1.1;
  letter-spacing: -0.01em;
  color: var(--w-text);
}
body.platform-web .shop-content .shop-hero-price {
  display: flex;
  align-items: baseline;
  gap: var(--w-space-3);
  margin-top: var(--w-space-1);
}
body.platform-web .shop-content .shop-hero-now {
  font-size: var(--w-fs-h1, 26px);
  font-weight: 800;
  color: var(--w-pink-strong);
}
body.platform-web .shop-content .shop-hero-was {
  font-size: var(--w-fs-body, 15px);
  color: var(--w-muted);
  text-decoration: line-through;
}
body.platform-web .shop-content .shop-hero-cta {
  display: flex;
  gap: var(--w-space-3);
  margin-top: var(--w-space-4);
}
body.platform-web .shop-content .shop-hero-btn {
  border: none;
  border-radius: 999px;
  padding: var(--w-space-3) var(--w-space-5);
  font-size: var(--w-fs-body, 15px);
  font-weight: 700;
  cursor: pointer;
  transition:
    transform 0.25s ease,
    background 0.25s ease,
    color 0.25s ease;
}
body.platform-web .shop-content .shop-hero-btn:focus-visible {
  outline: 3px solid var(--w-sage);
  outline-offset: 2px;
}
body.platform-web .shop-content .shop-hero-btn-primary {
  background: var(--w-lime);
  color: #1a2417;
}
body.platform-web .shop-content .shop-hero-btn-primary:hover {
  background: var(--w-sage);
  color: #fff;
  transform: translateY(-2px);
}
body.platform-web .shop-content .shop-hero-btn-ghost {
  background: transparent;
  color: var(--w-sage);
  border: 2px solid var(--w-sage);
}
body.platform-web .shop-content .shop-hero-btn-ghost:hover {
  background: var(--w-sage);
  color: #fff;
}
body.platform-web .shop-content .shop-hero-media {
  position: relative;
  min-height: 240px;
  padding: var(--w-space-5) var(--w-space-5) var(--w-space-5) 0;
}
body.platform-web .shop-content .shop-hero-media app-image-preview {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 200px;
  border-radius: var(--w-radius-card);
  overflow: hidden;
  background:
    radial-gradient(
      circle at 60% 40%,
      #fff 0%,
      #eef3ec 70%);
}
body.platform-web .shop-content .shop-hero-tag {
  position: absolute;
  top: var(--w-space-5);
  left: 0;
  z-index: 2;
  background: var(--w-pink);
  color: #fff;
  font-size: var(--w-fs-caption, 13px);
  font-weight: 700;
  padding: var(--w-space-1) var(--w-space-3);
  border-radius: 0 999px 999px 0;
}
@media (width >= 768px) {
  body.platform-web .shop-content .shop-hero {
    display: grid;
    grid-template-columns: 1.05fr 0.95fr;
    align-items: center;
  }
}
body.platform-web .shop-content .product-section-eyebrow {
  display: block;
  margin-bottom: var(--w-space-1);
  font-size: var(--w-fs-caption, 13px);
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--w-pink-strong);
}
body.platform-web .shop-content .product-section-count {
  margin-left: var(--w-space-2);
  font-size: var(--w-fs-caption, 13px);
  font-weight: 500;
  color: var(--w-muted);
}
body.platform-web .shop-content app-product-card-skeleton .product-card-skeleton,
body.platform-web .shop-content app-product-card-skeleton .skeleton {
  background:
    linear-gradient(
      90deg,
      #eef2ec 25%,
      #e3e9e1 37%,
      #eef2ec 63%);
  background-size: 400% 100%;
  animation: shop-shimmer 1.4s ease infinite;
}
@keyframes shop-shimmer {
  0% {
    background-position: 100% 0;
  }
  100% {
    background-position: 0 0;
  }
}
body.platform-web .shop-content .product-section-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--w-space-2);
  padding: var(--w-space-7) var(--w-space-4);
  color: var(--w-muted);
  text-align: center;
}
body.platform-web .shop-content .product-section-empty::before {
  content: "";
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: #e7f1e2 url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='26' height='26' viewBox='0 0 24 24' fill='none' stroke='%237ba465' stroke-width='2' stroke-linecap='round'><circle cx='11' cy='11' r='7'/><line x1='21' y1='21' x2='16.65' y2='16.65'/></svg>") no-repeat center;
}
body.platform-web ion-modal.product-quick-view-modal {
  --width: min(920px, calc(100vw - 40px));
  --height: auto;
  --max-height: 88vh;
  --border-radius: 22px;
  --background: transparent;
  --box-shadow: 0 32px 90px rgb(29 42 22 / 28%);
  --backdrop-opacity: 0.5;
}
body.platform-web ion-modal.product-quick-view-modal::part(content) {
  overflow: hidden;
  border: 0;
  border-radius: 22px;
  background: transparent;
}
body.platform-web ion-modal.product-quick-view-modal::part(backdrop) {
  background: rgba(20, 30, 17, 0.72);
  -webkit-backdrop-filter: blur(3px);
  backdrop-filter: blur(3px);
}
body.platform-web.dark ion-modal.product-quick-view-modal {
  --box-shadow: 0 36px 100px rgb(0 0 0 / 58%);
  --backdrop-opacity: 0.68;
}
@media (width < 760px) {
  body.platform-web ion-modal.product-quick-view-modal {
    --width: min(94vw, 560px);
    --max-height: 90vh;
    --border-radius: 18px;
  }
  body.platform-web ion-modal.product-quick-view-modal::part(content) {
    border-radius: 18px;
  }
}
@media (prefers-reduced-motion: reduce) {
  body.platform-web .shop-content app-product-card .product-card,
  body.platform-web .shop-content app-product-card .product-card-image img,
  body.platform-web .shop-content .shop-hero-btn,
  body.platform-web .shop-content app-product-card .product-card-quickview {
    transition: none !important;
    transform: none !important;
  }
}
body.platform-web .category-products-header,
body.platform-web .category-products-header ion-header,
body.platform-web .category-products-header ion-toolbar,
body.platform-web .category-products-header app-header-search,
body.platform-web .section-products-header,
body.platform-web .section-products-header ion-header,
body.platform-web .section-products-header ion-toolbar,
body.platform-web .section-products-header app-header-search,
body.platform-web .search-product-header,
body.platform-web .search-product-header ion-header,
body.platform-web .search-product-header ion-toolbar,
body.platform-web .search-product-header app-header-search {
  --background: var(--w-canvas) !important;
  background: var(--w-canvas) !important;
  box-shadow: none !important;
  --border-width: 0;
}
body.platform-web .category-products-header ion-title,
body.platform-web .section-products-header ion-title,
body.platform-web .search-product-header ion-title {
  color: var(--w-text) !important;
  font-weight: 800;
}
body.platform-web .category-products-header ion-button,
body.platform-web .category-products-header ion-back-button,
body.platform-web .category-products-header ion-buttons ion-icon,
body.platform-web .section-products-header ion-button,
body.platform-web .section-products-header ion-back-button,
body.platform-web .section-products-header ion-buttons ion-icon,
body.platform-web .search-product-header ion-button,
body.platform-web .search-product-header ion-back-button,
body.platform-web .search-product-header ion-buttons ion-icon {
  --color: var(--w-text) !important;
  color: var(--w-text) !important;
}
body.platform-web .category-products-header app-header-shop-actions,
body.platform-web .section-products-header app-header-shop-actions,
body.platform-web .search-product-header app-header-shop-actions {
  display: none;
}
body.platform-web .category-products-header app-header-search,
body.platform-web .search-product-header app-header-search {
  display: block;
  max-width: var(--w-max);
  margin: 0 auto;
  padding: 12px 24px;
}
body.platform-web .category-products-header .search-container,
body.platform-web .search-product-header .search-container {
  background: var(--w-card) !important;
  border: 1px solid var(--w-border);
  border-radius: 30px;
  box-shadow: 0 4px 14px rgba(123, 164, 101, 0.06);
}
body.platform-web .category-products-header .filter-btn,
body.platform-web .search-product-header .filter-btn {
  --box-shadow: none;
}
body.platform-web .search-product-header .filter-btn {
  --background: var(--filter-circle-color);
  --background-activated: var(--filter-circle-color-active);
  --background-focused: var(--filter-circle-color-focus);
  --background-hover: var(--filter-circle-color-active);
  --color: var(--ion-color-light);
  border: 0;
  border-radius: var(--radius-full);
}
body.platform-web .search-product-header .filter-btn ion-icon {
  color: var(--ion-color-light);
}
body.platform-web .category-products-content,
body.platform-web .section-products-content,
body.platform-web .search-product-content {
  --background: var(--w-canvas);
}
@media (width >= 768px) {
  body.platform-web .category-products-content {
    --category-grid-width: calc(5 * 180px + 4 * 12px);
  }
  body.platform-web .category-products-content app-paginated-list,
  body.platform-web .category-products-content app-shop-category-list,
  body.platform-web .category-products-content app-shop-brands-list,
  body.platform-web .section-products-content app-paginated-list,
  body.platform-web .search-product-content .search-results-section,
  body.platform-web .search-product-content .products-section {
    display: block;
    width: 100%;
    max-width: var(--w-max);
    margin-right: auto;
    margin-left: auto;
  }
  body.platform-web .category-products-content app-shop-brands-list {
    width: 100%;
    max-width: var(--category-grid-width);
  }
  body.platform-web .category-products-content .brand-cards-scroll {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    overflow: visible;
    gap: 12px;
    margin-right: 0;
    padding-right: 0;
  }
}
body.platform-web .category-products-content .products-grid,
body.platform-web .section-products-content .products-grid,
body.platform-web .search-product-content .products-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr) !important;
  gap: 16px;
  padding: 0;
  margin-top: 0;
}
@media (width >= 768px) {
  body.platform-web .category-products-content .products-grid {
    grid-template-columns: repeat(5, 180px) !important;
    justify-content: center;
    justify-items: stretch;
    gap: 12px;
  }
  body.platform-web .section-products-content .products-grid,
  body.platform-web .search-product-content .products-grid {
    grid-template-columns: repeat(4, 200px) !important;
    justify-content: center;
    justify-items: stretch;
    gap: 12px;
  }
}
@media (width >= 1200px) {
  body.platform-web .category-products-content {
    --category-grid-width: calc(5 * 190px + 4 * 14px);
  }
  body.platform-web .category-products-content .products-grid {
    grid-template-columns: repeat(5, 190px) !important;
    gap: 14px;
  }
  body.platform-web .category-products-content app-shop-brands-list {
    max-width: var(--category-grid-width);
  }
  body.platform-web .section-products-content .products-grid {
    gap: 14px;
  }
  body.platform-web .search-product-content .products-grid {
    grid-template-columns: repeat(5, 200px) !important;
    justify-content: center;
    justify-items: stretch;
    gap: 12px;
  }
}
body.platform-web .category-products-content app-product-card .product-card,
body.platform-web .section-products-content app-product-card .product-card,
body.platform-web .search-product-content app-product-card .product-card {
  background: var(--w-card);
  border: 1px solid var(--w-border);
  border-radius: var(--w-radius-card);
  box-shadow: 0 8px 22px rgba(123, 164, 101, 0.06);
  transition:
    transform 0.25s ease,
    border-color 0.25s ease,
    box-shadow 0.25s ease;
}
body.platform-web .category-products-content app-product-card .product-card:hover,
body.platform-web .section-products-content app-product-card .product-card:hover,
body.platform-web .search-product-content app-product-card .product-card:hover {
  transform: translateY(-4px);
  border-color: var(--w-sage);
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.06);
}
body.platform-web .category-products-content app-product-card .product-card-current-price,
body.platform-web .section-products-content app-product-card .product-card-current-price,
body.platform-web .search-product-content app-product-card .product-card-current-price {
  color: var(--w-pink-strong);
  font-weight: 800;
}
body.platform-web .category-products-content app-product-card .product-card-add-to-cart-btn,
body.platform-web .category-products-content app-product-card .product-card-cart-control,
body.platform-web .section-products-content app-product-card .product-card-add-to-cart-btn,
body.platform-web .section-products-content app-product-card .product-card-cart-control,
body.platform-web .search-product-content app-product-card .product-card-add-to-cart-btn,
body.platform-web .search-product-content app-product-card .product-card-cart-control {
  --background: var(--w-pink);
  --color: #fff;
  background: var(--w-pink);
  color: #fff;
}
body.platform-web .search-product-content .search-results-section .section-title {
  display: block;
  margin-bottom: 16px;
  font-size: 19px;
  font-weight: 800;
  color: var(--w-text);
}
body.platform-web .category-products-content .empty-state,
body.platform-web .section-products-content .empty-state,
body.platform-web .search-product-content .empty-state,
body.platform-web .search-product-content .no-results {
  max-width: 520px;
  margin: 32px auto;
  padding: 40px 24px;
  background: var(--w-card);
  border: 1px solid var(--w-border);
  border-radius: var(--w-radius-card);
  box-shadow: 0 8px 22px rgba(123, 164, 101, 0.06);
  text-align: center;
  color: var(--w-muted);
}
body.platform-web .category-products-content .empty-state .no-results-icon,
body.platform-web .category-products-content .empty-state .empty-icon,
body.platform-web .section-products-content .empty-state .no-results-icon,
body.platform-web .section-products-content .empty-state .empty-icon,
body.platform-web .search-product-content .empty-state .no-results-icon,
body.platform-web .search-product-content .empty-state .empty-icon,
body.platform-web .search-product-content .no-results .no-results-icon,
body.platform-web .search-product-content .no-results .empty-icon {
  font-size: 40px;
  color: var(--w-sage);
}
body.platform-web .category-products-content .empty-state .no-results-text,
body.platform-web .category-products-content .empty-state .empty-text,
body.platform-web .section-products-content .empty-state .no-results-text,
body.platform-web .section-products-content .empty-state .empty-text,
body.platform-web .search-product-content .empty-state .no-results-text,
body.platform-web .search-product-content .empty-state .empty-text,
body.platform-web .search-product-content .no-results .no-results-text,
body.platform-web .search-product-content .no-results .empty-text {
  display: block;
  margin-top: 12px;
  font-size: 17px;
  font-weight: 700;
  color: var(--w-text);
}
body.platform-web .orders-header,
body.platform-web .orders-header ion-header,
body.platform-web .orders-header ion-toolbar,
body.platform-web .order-details-header,
body.platform-web .order-details-header ion-header,
body.platform-web .order-details-header ion-toolbar {
  --background: var(--w-canvas) !important;
  background: var(--w-canvas) !important;
  box-shadow: none !important;
  --border-width: 0;
}
body.platform-web .orders-header ion-title,
body.platform-web .order-details-header ion-title {
  color: var(--w-text) !important;
  font-weight: 800;
}
body.platform-web .orders-header ion-button,
body.platform-web .orders-header ion-back-button,
body.platform-web .orders-header ion-buttons ion-icon,
body.platform-web .order-details-header ion-button,
body.platform-web .order-details-header ion-back-button,
body.platform-web .order-details-header ion-buttons ion-icon {
  --color: var(--w-text) !important;
  color: var(--w-text) !important;
}
body.platform-web .orders-content {
  --background: var(--w-canvas);
}
@media (width >= 768px) {
  body.platform-web .orders-content .filter-tabs,
  body.platform-web .orders-content .orders-list,
  body.platform-web .orders-content .orders-empty {
    width: 100%;
    max-width: 860px;
    margin-right: auto;
    margin-left: auto;
  }
}
body.platform-web .orders-content .filter-tabs {
  padding-top: 8px;
}
body.platform-web .orders-content .scrollable-tabs-btn {
  --background: var(--w-card);
  background: var(--w-card);
  border: 1px solid var(--w-border);
  color: var(--w-muted);
  font-weight: 600;
}
body.platform-web .orders-content .scrollable-tabs-btn.active {
  --background: var(--w-sage);
  background: var(--w-sage);
  border-color: var(--w-sage);
  color: #fff;
}
body.platform-web .orders-content app-order-card .order-card,
body.platform-web .order-details-content app-order-card .order-card,
body.platform-web .order-details-content app-address-card .address-card,
body.platform-web .order-details-content app-method-card .method-card {
  --background: var(--w-card);
  margin: 0 0 16px;
  background: var(--w-card);
  border: 1px solid var(--w-border);
  border-radius: var(--w-radius-card);
  box-shadow: 0 8px 22px rgba(123, 164, 101, 0.06) !important;
}
body.platform-web .orders-content app-order-card .order-card {
  transition: transform 0.25s ease, border-color 0.25s ease;
}
body.platform-web .orders-content app-order-card .order-card:hover {
  transform: translateY(-3px);
  border-color: var(--w-sage);
}
body.platform-web .orders-content app-order-card .order-card-icon-wrap {
  color: var(--w-sage);
}
body.platform-web .orders-content app-order-card .order-card-total,
body.platform-web .order-details-content app-order-card .order-card-total {
  color: var(--w-pink);
  font-weight: 800;
}
body.platform-web .orders-content .orders-empty {
  max-width: 520px;
  margin: 32px auto;
  padding: 40px 24px;
  background: var(--w-card);
  border: 1px solid var(--w-border);
  border-radius: var(--w-radius-card);
  box-shadow: 0 8px 22px rgba(123, 164, 101, 0.06);
  text-align: center;
  color: var(--w-muted);
  font-weight: 600;
}
body.platform-web .order-details-content {
  --background: var(--w-canvas);
}
body.platform-web .order-details-content .order-details-wrapper {
  width: 100%;
  max-width: 820px;
  margin: 0 auto;
  padding-top: 16px;
}
body.platform-web .order-details-content .order-details-actions {
  display: flex;
  gap: 12px;
  margin-bottom: 20px;
}
body.platform-web .order-details-content .order-action-btn {
  --background: var(--w-card);
  --color: var(--w-sage);
  --border-color: var(--w-sage);
  --border-width: 1px;
  --border-style: solid;
  --box-shadow: none;
  --border-radius: 24px;
  flex: 1;
  font-weight: 700;
}
body.platform-web .order-details-content .order-items {
  background: var(--w-card);
  border: 1px solid var(--w-border);
  border-radius: var(--w-radius-card);
  box-shadow: 0 8px 22px rgba(123, 164, 101, 0.06);
  padding: 8px 18px;
  margin-bottom: 16px;
}
body.platform-web .order-details-content .order-item {
  padding: 14px 0;
}
body.platform-web .order-details-content .item-price {
  color: var(--w-text);
  font-weight: 800;
}
body.platform-web .order-details-content .item-savings {
  color: var(--w-sage);
  font-weight: 700;
}
body.platform-web .order-details-content .price-summary {
  background: var(--w-card);
  border: 1px solid var(--w-border);
  border-radius: var(--w-radius-card);
  box-shadow: 0 8px 22px rgba(123, 164, 101, 0.06);
  padding: 18px 20px;
  margin-bottom: 16px;
}
body.platform-web .order-details-content .total-value {
  color: var(--w-pink);
  font-weight: 800;
}
body.platform-web .order-details-content .product-savings-value {
  color: var(--w-sage);
}
body.platform-web .order-details-content .re-order-btn {
  --background: var(--w-sage);
  --background-hover: var(--w-sage-hover);
  --color: #fff;
  --border-radius: 30px;
  --box-shadow: 0 6px 16px rgb(123 164 101 / 28%);
  font-weight: 700;
}
body.platform-web .checkout-web-header,
body.platform-web .checkout-web-header ion-header,
body.platform-web .checkout-web-header ion-toolbar {
  --background: var(--w-canvas) !important;
  background: var(--w-canvas) !important;
  box-shadow: none !important;
  --border-width: 0;
}
body.platform-web .checkout-web-header ion-title {
  color: var(--w-text) !important;
  font-size: var(--w-fs-h2);
  font-weight: var(--w-fw-h2);
  letter-spacing: -0.01em;
}
body.platform-web .checkout-web-header ion-button,
body.platform-web .checkout-web-header ion-back-button,
body.platform-web .checkout-web-header ion-buttons ion-icon {
  --color: var(--w-text) !important;
  color: var(--w-text) !important;
}
body.platform-web .checkout-content .checkout-title-row {
  display: none;
  margin: 0 0 var(--w-space-5);
}
body.platform-web .checkout-content .checkout-page-title {
  margin: 0;
  font-size: var(--w-fs-h1, 26px);
  font-weight: 800;
  letter-spacing: -0.01em;
  color: var(--w-text);
}
body.platform-web .checkout-content .checkout-back-btn {
  width: 42px;
  height: 42px;
  border: 1px solid var(--w-border);
  border-radius: 50%;
  background: var(--w-card);
  color: var(--w-text);
  box-shadow: var(--w-shadow-sm);
  transition:
    background-color 0.18s ease,
    border-color 0.18s ease,
    transform 0.18s ease,
    box-shadow 0.18s ease;
}
body.platform-web .checkout-content .checkout-back-btn ion-icon {
  font-size: 22px;
}
body.platform-web .checkout-content .checkout-back-btn:hover {
  background: var(--w-hover, #f5f8f2);
  border-color: color-mix(in srgb, var(--w-sage) 45%, var(--w-border));
  box-shadow: var(--w-shadow-md);
  transform: translateX(-2px);
}
body.platform-web .checkout-content {
  --background: var(--w-canvas);
  font-family: var(--w-font);
}
body.platform-web .checkout-content .checkout-wrapper {
  width: 100%;
  max-width: 760px;
  margin: 0 auto;
  padding: var(--w-space-4) var(--w-space-4) var(--w-space-8);
  box-sizing: border-box;
}
@media (width >= 980px) {
  body.platform-web .checkout-content .checkout-wrapper {
    max-width: 1100px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 360px;
    grid-template-areas: "title title" "main summary";
    column-gap: var(--w-space-7);
    align-items: start;
    padding: var(--w-space-6) var(--w-space-6) var(--w-space-8);
  }
  body.platform-web .checkout-content .checkout-title-row {
    display: flex;
    grid-area: title;
    align-items: center;
  }
  body.platform-web .checkout-web-header {
    display: none;
  }
  body.platform-web .checkout-content .checkout-main-col {
    grid-area: main;
    min-width: 0;
  }
  body.platform-web .checkout-content .checkout-summary-col {
    grid-area: summary;
    position: sticky;
    top: 96px;
    overflow: hidden;
    background:
      linear-gradient(
        180deg,
        rgba(255, 255, 255, 0.92),
        rgba(249, 252, 247, 0.88)),
      #fff;
    border: 1px solid rgba(101, 132, 82, 0.13);
    border-radius: 22px;
    box-shadow: 0 16px 42px rgba(61, 84, 48, 0.08), inset 0 1px 0 #fff;
    padding: 24px;
  }
  body.platform-web .checkout-content .checkout-summary-col::before {
    position: absolute;
    top: 0;
    left: 24px;
    width: 88px;
    height: 2px;
    border-radius: 0 0 999px 999px;
    background:
      linear-gradient(
        90deg,
        #7ea563,
        rgba(126, 165, 99, 0));
    content: "";
  }
  body.platform-web .checkout-content .checkout-summary-col .price-summary {
    margin: 0 0 var(--w-space-3);
    padding: 0;
    background: none;
    border: none;
    box-shadow: none;
  }
  body.platform-web .checkout-content .checkout-summary-col .total-row {
    max-width: none;
    margin: 0 0 var(--w-space-4);
    padding: var(--w-space-4) 0 0;
    background: none;
    border: none;
    border-top: 1px solid var(--w-border);
    border-radius: 0;
    box-shadow: none;
  }
}
body.platform-web .checkout-content .delivery-address-section,
body.platform-web .checkout-content .cart-items,
body.platform-web .checkout-content .active-coupon-card,
body.platform-web .checkout-content .input-section,
body.platform-web .checkout-content .price-summary,
body.platform-web .checkout-content .payment-methods {
  position: relative;
  overflow: hidden;
  background:
    linear-gradient(
      180deg,
      rgba(255, 255, 255, 0.92),
      rgba(249, 252, 247, 0.88)),
    #fff;
  border: 1px solid rgba(101, 132, 82, 0.13);
  border-radius: 22px;
  box-shadow: 0 16px 42px rgba(61, 84, 48, 0.08), inset 0 1px 0 #fff;
  padding: 24px;
  margin-bottom: var(--w-space-5);
  transition: var(--w-transition-bounce);
}
body.platform-web .checkout-content .delivery-address-section::before,
body.platform-web .checkout-content .cart-items::before,
body.platform-web .checkout-content .active-coupon-card::before,
body.platform-web .checkout-content .input-section::before,
body.platform-web .checkout-content .price-summary::before,
body.platform-web .checkout-content .payment-methods::before {
  position: absolute;
  top: 0;
  left: 24px;
  width: 88px;
  height: 2px;
  border-radius: 0 0 999px 999px;
  background:
    linear-gradient(
      90deg,
      #7ea563,
      rgba(126, 165, 99, 0));
  content: "";
}
body.platform-web .checkout-content .delivery-address-section:hover,
body.platform-web .checkout-content .cart-items:hover,
body.platform-web .checkout-content .payment-methods:hover {
  transform: translateY(-4px);
  box-shadow: var(--w-shadow-md);
}
body.platform-web .checkout-content .courses-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: var(--w-space-5) var(--w-space-2) var(--w-space-4);
  font-size: var(--w-fs-h2);
  font-weight: var(--w-fw-h2);
  color: var(--w-text);
}
body.platform-web .checkout-content .delivery-address-icon {
  color: var(--w-sage);
}
body.platform-web .checkout-content .delivery-address-edit,
body.platform-web .checkout-content .add-address-btn {
  color: var(--w-sage);
  font-weight: var(--w-fw-body-lg);
  cursor: pointer;
}
body.platform-web .checkout-content .cart-item {
  border-bottom: 1px solid var(--w-border);
  padding: var(--w-space-4) 0;
}
body.platform-web .checkout-content .cart-item:last-child {
  border-bottom: none;
  padding-bottom: 0;
}
body.platform-web .checkout-content .cart-item:first-child {
  padding-top: 0;
}
body.platform-web .checkout-content .item-price {
  color: var(--w-pink);
  font-size: var(--w-fs-body-lg);
  font-weight: var(--w-fw-h1);
}
body.platform-web .checkout-content .item-savings {
  color: var(--w-sage);
  font-weight: var(--w-fw-body-lg);
}
body.platform-web .checkout-content .qty-btn {
  --color: var(--w-sage);
  color: var(--w-sage);
}
body.platform-web .checkout-content .remove-btn {
  --color: var(--w-muted);
  color: var(--w-muted);
  transition: var(--w-transition-smooth);
}
body.platform-web .checkout-content .remove-btn:hover {
  --color: var(--w-pink);
  color: var(--w-pink);
}
body.platform-web .checkout-content .coupon-icon {
  color: var(--w-gold);
  font-size: 24px;
}
body.platform-web .checkout-content .use-coupon-btn,
body.platform-web .checkout-content .apply-button {
  --background: var(--w-sage);
  --background-hover: var(--w-sage-hover);
  --color: #fff;
  --border-radius: var(--w-radius-main);
  --box-shadow: var(--w-shadow-sm);
  font-weight: var(--w-fw-body-lg);
  transition: var(--w-transition-bounce);
}
body.platform-web .checkout-content .use-coupon-btn:hover,
body.platform-web .checkout-content .apply-button:hover {
  transform: translateY(-2px);
  --box-shadow: var(--w-shadow-md);
}
body.platform-web .checkout-content .summary-row {
  font-size: var(--w-fs-body);
  font-weight: var(--w-fw-body-lg);
  color: var(--w-muted);
  padding: var(--w-space-2) 0;
}
body.platform-web .checkout-content .total-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  max-width: 100%;
  margin: var(--w-space-4) 0 var(--w-space-4);
  padding: var(--w-space-5);
  background: var(--w-card);
  border: 1px solid var(--w-border);
  border-radius: var(--w-radius-card);
  box-shadow: var(--w-shadow-sm);
  font-size: var(--w-fs-h2);
  font-weight: var(--w-fw-h2);
  box-sizing: border-box;
}
body.platform-web .checkout-content .total-row .total-label {
  color: var(--w-text);
}
body.platform-web .checkout-content .total-row .total-value {
  font-size: var(--w-fs-display);
  font-weight: var(--w-fw-display);
  color: var(--w-pink);
  letter-spacing: -0.01em;
}
body.platform-web .checkout-content .product-savings-value {
  color: var(--w-sage);
  font-weight: var(--w-fw-body-lg);
}
body.platform-web .checkout-content .payment-title {
  font-size: var(--w-fs-h2);
  font-weight: var(--w-fw-h2);
  color: var(--w-text);
  margin-bottom: var(--w-space-4);
}
body.platform-web .checkout-content .payment-option {
  border: 1px solid var(--w-border);
  border-radius: var(--w-radius-card);
  padding: var(--w-space-4) var(--w-space-5);
  margin-bottom: var(--w-space-3);
  transition: var(--w-transition-smooth);
  background: var(--w-card);
}
body.platform-web .checkout-content .payment-option:last-child {
  margin-bottom: 0;
}
body.platform-web .checkout-content .payment-option.selected,
body.platform-web .checkout-content .payment-option:has(.radio-button.checked) {
  border-color: var(--w-sage);
}
body.platform-web .checkout-content .radio-button {
  border-color: var(--w-border);
}
body.platform-web .checkout-content .payment-option.selected .radio-button,
body.platform-web .checkout-content .payment-option:has(.radio-button.checked) .radio-button {
  border-color: var(--w-sage);
}
body.platform-web .checkout-content .radio-inner {
  background: var(--w-sage);
}
body.platform-web .checkout-content .btn-success {
  --background: var(--w-sage);
  --background-hover: var(--w-sage-hover);
  --color: #fff;
  --border-radius: var(--w-radius-main);
  --box-shadow: var(--w-shadow-md);
  width: 100%;
  max-width: 100%;
  margin: var(--w-space-4) 0 0;
  height: 56px;
  font-size: var(--w-fs-body-lg);
  font-weight: var(--w-fw-h1);
  transition: var(--w-transition-bounce);
  box-sizing: border-box;
}
body.platform-web .checkout-content .btn-success:hover:not(.button-disabled, [disabled]) {
  transform: translateY(-4px);
  --box-shadow: var(--w-shadow-lg);
}
body.platform-web .checkout-content .btn-success.button-disabled,
body.platform-web .checkout-content .btn-success[disabled] {
  --background: #c8d6c3;
  --color: #788a73;
  --box-shadow: none;
  opacity: 0.55;
  cursor: not-allowed;
  pointer-events: none;
  transform: none;
}
body.platform-web.dark .checkout-content .checkout-back-btn {
  background: #0f1612;
  border-color: rgba(205, 226, 210, 0.11);
  color: #f2f6f3;
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.03);
}
body.platform-web.dark .checkout-content .checkout-back-btn:hover {
  background: #18231b;
  border-color: rgba(168, 207, 143, 0.28);
  color: #f2f6f3;
  box-shadow: 0 16px 32px rgba(0, 0, 0, 0.24), inset 0 1px 0 rgba(255, 255, 255, 0.04);
}
body.platform-web.dark .checkout-content .checkout-summary-col,
body.platform-web.dark .checkout-content .delivery-address-section,
body.platform-web.dark .checkout-content .cart-items,
body.platform-web.dark .checkout-content .active-coupon-card,
body.platform-web.dark .checkout-content .input-section,
body.platform-web.dark .checkout-content .payment-methods {
  background:
    linear-gradient(
      180deg,
      rgba(255, 255, 255, 0.025),
      transparent 38%),
    #0f1612;
  border-color: rgba(205, 226, 210, 0.11);
  box-shadow: 0 18px 46px rgba(0, 0, 0, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.03);
}
body.platform-web.dark .checkout-content .checkout-summary-col::before,
body.platform-web.dark .checkout-content .delivery-address-section::before,
body.platform-web.dark .checkout-content .cart-items::before,
body.platform-web.dark .checkout-content .active-coupon-card::before,
body.platform-web.dark .checkout-content .input-section::before,
body.platform-web.dark .checkout-content .payment-methods::before {
  background:
    linear-gradient(
      90deg,
      #a8cf8f,
      rgba(168, 207, 143, 0));
}
body.platform-web.dark .checkout-content .checkout-summary-col .price-summary::before {
  display: none;
}
body.platform-web app-product-details .product-details-content::part(scroll) {
  overflow-x: hidden;
  display: flex;
  flex-direction: column;
  min-height: 100%;
}
body.platform-web app-product-details app-site-footer {
  display: block;
  width: 100vw !important;
  max-width: 100vw !important;
  position: relative !important;
  left: 50% !important;
  right: 50% !important;
  margin-left: -50vw !important;
  margin-right: -50vw !important;
  margin-top: auto;
  box-sizing: border-box;
}
body.platform-web app-product-details app-site-footer .site-footer {
  margin-top: 0;
  width: 100% !important;
  background: #111 !important;
}
body.platform-web app-live-class .live-class-content::part(scroll) {
  display: flex;
  flex-direction: column;
  min-height: 100%;
  overflow-x: hidden;
}
body.platform-web app-live-class .live-class-page {
  flex: 1 0 auto;
}
body.platform-web app-live-class app-site-footer {
  display: block;
  margin-top: auto;
}
body.platform-web app-live-class app-site-footer .site-footer {
  margin-top: 0;
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled app-header-container {
  display: none;
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-content {
  --background: var(--w-canvas);
  --padding-bottom: 120px;
  padding: var(--w-space-5);
  font-family: var(--w-font);
  scroll-behavior: smooth;
}
@media (width >= 980px) {
  body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-content::part(scroll) {
    display: grid !important;
    grid-template-columns: minmax(0, 500px) minmax(0, 1fr);
    grid-template-areas: "crumb crumb" "banner info" "related related" "similar similar" "recent recent";
    gap: 0 var(--w-space-7);
    align-items: start;
    max-width: var(--w-max);
    margin: 0 auto;
    padding: var(--w-space-6) var(--w-space-5) var(--w-space-8);
  }
  body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-breadcrumb {
    grid-area: crumb;
  }
  body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-banner {
    grid-area: banner;
    position: sticky;
    top: 96px;
    margin: 0;
  }
  body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-info {
    grid-area: info;
    margin: 0;
  }
  body.platform-web app-product-details.__legacy-product-details-layout-disabled app-product-section:nth-of-type(1) {
    grid-area: related;
    margin-top: var(--w-space-8);
  }
  body.platform-web app-product-details.__legacy-product-details-layout-disabled app-product-section:nth-of-type(2) {
    grid-area: similar;
    margin-top: var(--w-space-7);
  }
  body.platform-web app-product-details.__legacy-product-details-layout-disabled app-product-section:nth-of-type(3) {
    grid-area: recent;
    margin-top: var(--w-space-7);
  }
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-banner {
  background: var(--w-card);
  border: 1px solid var(--w-border);
  border-radius: var(--w-radius-main);
  box-shadow: var(--w-shadow-md);
  padding: var(--w-space-5);
  transition: var(--w-transition-bounce);
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-banner:hover {
  transform: translateY(-4px);
  box-shadow: var(--w-shadow-lg);
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-slider-track {
  height: 440px;
  border-radius: var(--w-radius-card);
  overflow: hidden;
  background: var(--w-surface);
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-banner app-image-preview img {
  object-fit: contain !important;
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-gallery-thumbnails {
  display: flex;
  gap: var(--w-space-4);
  margin-top: var(--w-space-5);
  overflow-x: auto;
  padding-bottom: var(--w-space-3);
  scrollbar-width: none;
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-gallery-thumbnails::-webkit-scrollbar {
  display: none;
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-gallery-thumb {
  flex: 0 0 60px;
  height: 60px;
  padding: 0;
  border: 2px solid transparent;
  border-radius: var(--w-radius-sm);
  background: var(--w-surface);
  cursor: pointer;
  transition: var(--w-transition-fast);
  opacity: 0.7;
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-gallery-thumb:hover {
  opacity: 1;
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-gallery-thumb.is-active {
  border-color: var(--w-pink);
  opacity: 1;
  transform: scale(1.05);
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-info-name {
  font-size: var(--w-fs-h1);
  font-weight: var(--w-fw-h1);
  line-height: var(--w-lh-h1);
  letter-spacing: -0.01em;
  color: var(--w-text);
  margin-top: 0;
  margin-bottom: var(--w-space-4);
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-info-pricing {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--w-space-4);
  margin-bottom: var(--w-space-6);
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-info-price {
  font-size: var(--w-fs-display);
  font-weight: var(--w-fw-display);
  color: var(--w-pink);
  letter-spacing: -0.01em;
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-info-original {
  font-size: var(--w-fs-h3);
  font-weight: var(--w-fw-h3);
  color: var(--w-muted);
  text-decoration: line-through;
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-info-badge {
  background: rgba(123, 164, 101, 0.14);
  color: var(--w-sage-hover);
  font-size: var(--w-fs-caption);
  font-weight: var(--w-fw-caption);
  letter-spacing: 0.02em;
  padding: var(--w-space-2) var(--w-space-3);
  border-radius: 8px;
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-out-of-stock-badge {
  background: rgba(233, 102, 119, 0.12);
  color: var(--w-pink);
  font-size: var(--w-fs-caption);
  font-weight: var(--w-fw-caption);
  padding: var(--w-space-2) var(--w-space-3);
  border-radius: 8px;
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-variant-options {
  margin-bottom: var(--w-space-7);
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-option-label {
  font-size: var(--w-fs-body);
  font-weight: var(--w-fw-h3);
  margin-bottom: var(--w-space-4);
  display: block;
  color: var(--w-text);
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-option-label .product-details-option-selected-value {
  color: var(--w-pink);
  font-weight: var(--w-fw-h3);
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-option-values {
  display: flex;
  flex-wrap: wrap;
  gap: var(--w-space-4);
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-option-btn {
  padding: var(--w-space-3) var(--w-space-5);
  border: 1px solid var(--w-border);
  border-radius: 100px;
  background: var(--w-card);
  font-size: var(--w-fs-body);
  font-weight: var(--w-fw-body-lg);
  cursor: pointer;
  color: var(--w-text);
  transition: var(--w-transition-bounce);
  box-shadow: var(--w-shadow-sm);
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-option-btn:hover {
  transform: translateY(-2px);
  box-shadow: var(--w-shadow-md);
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-option-btn.is-selected {
  border-color: transparent;
  background: var(--w-sage);
  color: #fff;
  box-shadow: var(--w-shadow-md);
  transform: translateY(-2px);
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-option-btn.is-unavailable {
  color: var(--w-muted);
  border-color: var(--w-border);
  background: var(--w-canvas);
  text-decoration: line-through;
  box-shadow: none;
  transform: none;
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-quantity-section {
  margin-bottom: var(--w-space-6);
  display: flex;
  flex-direction: column;
  gap: var(--w-space-3);
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-quantity-label {
  font-size: var(--w-fs-body-lg);
  font-weight: var(--w-fw-h3);
  display: block;
  color: var(--w-text);
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-quantity-controls {
  display: flex;
  align-items: center;
  gap: var(--w-space-5);
  background: var(--w-surface);
  border-radius: 100px;
  padding: var(--w-space-2) var(--w-space-3);
  width: fit-content;
  border: 1px solid var(--w-border);
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-qty-btn {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: var(--w-card);
  border: 1px solid var(--w-border);
  color: var(--w-text);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: var(--w-transition-fast);
  box-shadow: var(--w-shadow-sm);
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-qty-btn:hover:not([disabled]) {
  background: var(--w-sage);
  color: #fff;
  border-color: transparent;
  transform: translateY(-2px);
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-qty-btn[disabled] {
  opacity: 0.5;
  cursor: not-allowed;
  box-shadow: none;
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-qty-display {
  font-size: var(--w-fs-h3);
  font-weight: var(--w-fw-h2);
  min-width: 24px;
  text-align: center;
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-stock-limit-warning {
  display: block;
  margin-top: var(--w-space-3);
  color: var(--w-pink);
  font-size: var(--w-fs-caption);
  font-weight: var(--w-fw-h3);
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-description-section {
  border-top: 1px solid var(--w-border);
  padding-top: var(--w-space-6);
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-description-section ul {
  list-style: none;
  padding: 0;
  margin: var(--w-space-3) 0 0;
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-description-section li {
  position: relative;
  padding-left: var(--w-space-6);
  margin-bottom: var(--w-space-3);
  font-size: var(--w-fs-body-lg);
  color: var(--w-text);
  line-height: 1.5;
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-description-section li::before {
  content: "\2713";
  position: absolute;
  left: 0;
  color: var(--w-sage);
  font-weight: 800;
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-description-title {
  font-size: var(--w-fs-h2);
  font-weight: var(--w-fw-h2);
  margin-bottom: var(--w-space-4);
  color: var(--w-text);
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-sticky-actions {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(255, 255, 255, 0.97);
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  border-top: 1px solid var(--w-border);
  box-shadow: 0 -6px 24px rgba(16, 24, 16, 0.06);
  z-index: 900;
  padding: var(--w-space-4) max(var(--w-space-5), (100% - var(--w-max)) / 2);
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: var(--w-space-4);
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-sticky-summary {
  display: flex;
  align-items: center;
  gap: var(--w-space-4);
  margin-right: auto;
  min-width: 0;
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-sticky-thumb {
  flex: 0 0 44px;
  width: 44px;
  height: 44px;
  border-radius: 10px;
  overflow: hidden;
  background: var(--w-surface);
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-sticky-meta {
  display: flex;
  flex-direction: column;
  min-width: 0;
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-sticky-name {
  font-size: var(--w-fs-caption);
  font-weight: var(--w-fw-h3);
  color: var(--w-text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 240px;
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-sticky-price {
  font-size: var(--w-fs-h3);
  font-weight: var(--w-fw-display);
  color: var(--w-pink);
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-sticky-btn {
  margin: 0;
  width: auto;
  min-width: 180px;
  height: 48px;
  --border-radius: 100px;
  font-weight: var(--w-fw-h1);
  font-size: var(--w-fs-body-lg);
  transition: var(--w-transition-bounce);
}
@media (width < 768px) {
  body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-sticky-summary {
    display: none;
  }
  body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-sticky-actions {
    justify-content: center;
  }
  body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-sticky-btn {
    flex: 1;
    min-width: 0;
  }
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-sticky-btn-buy-now {
  --background: var(--w-card);
  --color: var(--w-sage);
  --border-color: var(--w-sage);
  --border-style: solid;
  --border-width: 2px;
  --box-shadow: none;
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-sticky-btn-buy-now:hover {
  --background: var(--w-sage);
  --color: #fff;
  transform: translateY(-2px);
  --box-shadow: var(--w-shadow-md);
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-sticky-btn-add-cart {
  --background: var(--w-pink);
  --color: #fff;
  --box-shadow: var(--w-shadow-sm);
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-sticky-btn-add-cart:hover {
  transform: translateY(-2px);
  --box-shadow: var(--w-shadow-md);
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-breadcrumb {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--w-space-2);
  margin-bottom: var(--w-space-6);
  font-size: var(--w-fs-caption);
  color: var(--w-muted);
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-breadcrumb-link {
  padding: 0;
  border: none;
  background: none;
  cursor: pointer;
  color: var(--w-muted);
  font: inherit;
  transition: var(--w-transition-fast);
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-breadcrumb-link:hover {
  color: var(--w-sage);
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-breadcrumb-sep {
  opacity: 0.5;
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-breadcrumb-current {
  color: var(--w-text);
  font-weight: var(--w-fw-h3);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 360px;
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-eyebrow {
  font-size: var(--w-fs-caption);
  font-weight: var(--w-fw-h3);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--w-sage);
  margin-bottom: var(--w-space-3);
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-info {
  display: flex;
  flex-direction: column;
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-info .product-details-eyebrow {
  order: 0;
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-info .product-details-info-name {
  order: 1;
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-info .product-details-info-meta {
  order: 2;
  margin-bottom: var(--w-space-5);
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-info .product-details-info-pricing {
  order: 3;
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-info .product-details-variant-options {
  order: 4;
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-info .product-details-quantity-section {
  order: 5;
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-info .product-details-promotion-badge {
  order: 6;
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-info .product-details-description-section {
  order: 7;
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-info-meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--w-space-3);
  margin-top: var(--w-space-1);
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-rating-row {
  display: flex;
  align-items: center;
  gap: var(--w-space-2);
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-star-icon {
  color: var(--w-border);
  font-size: 16px;
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-star-icon.filled {
  color: var(--w-gold);
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-rating-value {
  font-weight: var(--w-fw-h3);
  color: var(--w-text);
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-rating-sep {
  color: var(--w-border);
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-reviews-link {
  padding: 0;
  border: none;
  background: none;
  cursor: pointer;
  color: var(--w-muted);
  font: inherit;
  transition: var(--w-transition-fast);
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-reviews-link:hover {
  color: var(--w-sage);
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled .product-details-sku {
  color: var(--w-muted);
  font-size: var(--w-fs-caption);
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled app-product-section .product-section-scroll {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--w-space-5);
  overflow: visible;
}
@media (width >= 700px) {
  body.platform-web app-product-details.__legacy-product-details-layout-disabled app-product-section .product-section-scroll {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media (width >= 980px) {
  body.platform-web app-product-details.__legacy-product-details-layout-disabled app-product-section .product-section-scroll {
    grid-template-columns: repeat(4, 1fr);
  }
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled app-product-section app-product-card {
  width: 100%;
  min-width: 0;
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled app-product-section .product-card {
  height: 100%;
  transition: var(--w-transition-bounce);
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled app-product-section .product-card:hover {
  transform: translateY(-4px);
  border-color: var(--w-sage);
  box-shadow: var(--w-shadow-md);
}
body.platform-web app-product-details.__legacy-product-details-layout-disabled app-image-preview img {
  transition: opacity 0.4s ease;
}
body.platform-web app-review-product app-header-container,
body.platform-web app-review-list app-header-container {
  display: none;
}
body.platform-web app-review-product .review-content,
body.platform-web app-review-product .review-list-content,
body.platform-web app-review-list .review-content,
body.platform-web app-review-list .review-list-content {
  --background: var(--w-canvas);
  font-family: var(--w-font);
}
body.platform-web app-review-product .review-wrapper {
  max-width: 760px;
  margin: 0 auto;
  padding: var(--w-space-7) var(--w-space-5) var(--w-space-8);
}
body.platform-web app-review-product .order-label {
  color: var(--w-muted);
  font-size: var(--w-fs-caption);
  font-weight: var(--w-fw-h3);
  margin-bottom: var(--w-space-6);
}
body.platform-web app-review-product .item-section {
  margin-bottom: var(--w-space-7);
}
body.platform-web app-review-product .item-info {
  margin-bottom: var(--w-space-5);
}
body.platform-web app-review-product .item-title {
  font-size: var(--w-fs-h2);
  font-weight: var(--w-fw-h2);
  color: var(--w-text);
  margin: 0 0 var(--w-space-2);
}
body.platform-web app-review-product .item-subtitle {
  color: var(--w-muted);
  font-size: var(--w-fs-caption);
  margin: 0;
}
body.platform-web app-review-product .rating-card,
body.platform-web app-review-product .comments-card {
  --background: var(--w-card);
  margin: 0 0 var(--w-space-5);
  background: var(--w-card);
  border: 1px solid var(--w-border);
  border-radius: var(--w-radius-card);
  box-shadow: var(--w-shadow-sm);
}
body.platform-web app-review-product .card-title {
  font-size: var(--w-fs-h3);
  font-weight: var(--w-fw-h3);
  color: var(--w-text);
}
body.platform-web app-review-product .card-subtitle {
  color: var(--w-muted);
  font-size: var(--w-fs-body-lg);
}
body.platform-web app-review-product .stars-container {
  display: flex;
  gap: var(--w-space-3);
}
body.platform-web app-review-product .star-button {
  background: none;
  border: none;
  cursor: pointer;
  font-size: 28px;
  padding: var(--w-space-1);
  transition: var(--w-transition-bounce);
}
body.platform-web app-review-product .star-button ion-icon {
  color: var(--w-border);
}
body.platform-web app-review-product .star-button.filled ion-icon {
  color: var(--w-gold);
}
body.platform-web app-review-product .star-button:hover {
  transform: scale(1.12);
}
body.platform-web app-review-product .rating-label {
  color: var(--w-sage);
  font-weight: var(--w-fw-h3);
}
body.platform-web app-review-product .textarea-wrapper {
  background: var(--w-surface);
  border: 1px solid var(--w-border);
  border-radius: 12px;
  padding: var(--w-space-2) var(--w-space-4);
  transition: var(--w-transition-fast);
}
body.platform-web app-review-product .textarea-wrapper:focus-within {
  border-color: var(--w-sage);
}
body.platform-web app-review-product .character-count {
  text-align: right;
  color: var(--w-muted);
  font-size: var(--w-fs-caption);
}
body.platform-web app-review-product .error-message {
  background: rgba(233, 102, 119, 0.1);
  border: 1px solid rgba(233, 102, 119, 0.3);
  color: var(--w-pink);
  border-radius: var(--w-radius-card);
  padding: var(--w-space-4);
  margin-bottom: var(--w-space-5);
}
body.platform-web app-review-product ion-button.btn-success {
  --background: var(--w-sage);
  --background-hover: var(--w-sage-hover);
  --background-activated: var(--w-sage-hover);
  --color: #fff;
  --border-radius: 100px;
  --box-shadow: 0 6px 16px rgb(123 164 101 / 28%);
  max-width: 320px;
  margin: var(--w-space-5) auto 0;
  font-weight: var(--w-fw-h1);
}
@media (width >= 768px) {
  body.platform-web app-review-list .review-list-content .review-list-wrapper,
  body.platform-web app-review-list .review-list-content .review-list-count,
  body.platform-web app-review-list .review-list-content .review-list-empty {
    width: 100%;
    max-width: 760px;
    margin-right: auto;
    margin-left: auto;
  }
}
body.platform-web app-review-list .review-list-count {
  font-weight: var(--w-fw-display);
  color: var(--w-text);
  padding-top: var(--w-space-6);
}
body.platform-web app-review-list .review-card {
  background: var(--w-card);
  border: 1px solid var(--w-border);
  border-radius: var(--w-radius-card);
  box-shadow: var(--w-shadow-sm);
  padding: var(--w-space-5);
  margin-bottom: var(--w-space-4);
  transition: var(--w-transition-bounce);
}
body.platform-web app-review-list .review-card:hover {
  transform: translateY(-3px);
  border-color: var(--w-sage);
  box-shadow: var(--w-shadow-md);
}
body.platform-web app-review-list .review-card-avatar {
  width: 44px;
  height: 44px;
}
body.platform-web app-review-list .review-card-username {
  font-weight: var(--w-fw-h3);
  color: var(--w-text);
}
body.platform-web app-review-list .review-star {
  color: var(--w-border);
}
body.platform-web app-review-list .review-star.filled {
  color: var(--w-gold);
}
body.platform-web app-review-list .review-card-meta {
  gap: var(--w-space-2);
}
body.platform-web app-review-list .review-card-date,
body.platform-web app-review-list .review-card-dot {
  color: var(--w-muted);
}
body.platform-web app-review-list .review-card-comment {
  color: var(--w-text);
  line-height: 1.6;
}
body.platform-web app-review-list .review-list-empty {
  max-width: 520px;
  margin: var(--w-space-7) auto;
  padding: var(--w-space-8) var(--w-space-5);
  background: var(--w-card);
  border: 1px solid var(--w-border);
  border-radius: var(--w-radius-card);
  box-shadow: var(--w-shadow-sm);
  text-align: center;
  color: var(--w-muted);
}
body.platform-web .learning-header app-header-toolbar {
  display: none;
}
body.platform-web .learning-header,
body.platform-web .learning-header ion-header,
body.platform-web .learning-header ion-toolbar,
body.platform-web .learning-header app-header-search {
  --background: var(--w-canvas) !important;
  background: var(--w-canvas) !important;
  box-shadow: none !important;
  --border-width: 0;
}
body.platform-web .learning-header app-header-search {
  display: block;
  max-width: var(--w-max);
  margin: 0 auto;
  padding: 12px 24px;
}
body.platform-web .learning-header .search-container {
  background: var(--w-card) !important;
  border: 1px solid var(--w-border);
  border-radius: 30px;
  box-shadow: 0 4px 14px rgba(123, 164, 101, 0.06);
}
body.platform-web .learning-content::part(scroll) {
  display: flex;
  flex-direction: column;
  min-height: 100%;
  overflow-x: hidden;
}
body.platform-web .learning-content {
  --padding-bottom: 0;
}
body.platform-web .learning-content app-site-footer {
  display: block;
  margin-top: auto;
}
body.platform-web .learning-content app-site-footer .site-footer {
  margin-top: 0;
}
@media (width >= 768px) {
  body.platform-web .learning-content app-banner-carousel,
  body.platform-web .learning-content app-category-list,
  body.platform-web .learning-content .learning-sections,
  body.platform-web .learning-content app-paginated-list {
    display: block;
    width: 100%;
    max-width: var(--w-max);
    margin-right: auto;
    margin-left: auto;
  }
}
body.platform-web .learning-content .section-title {
  font-size: 19px;
  font-weight: 700;
  color: var(--w-text);
}
body.platform-web .learning-content app-banner-carousel {
  display: block;
  border-radius: var(--w-radius);
  overflow: hidden;
  box-shadow: 0 10px 28px rgba(16, 24, 16, 0.1);
}
@media (width >= 1200px) {
  body.platform-web .learning-content .category-grid {
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 16px;
  }
}
@media (width >= 1200px) {
  body.platform-web .learning-content app-category-card-skeleton .category-grid-skeleton {
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 16px;
  }
}
body.platform-web .learning-content .category-button {
  max-width: none;
  padding: 16px;
  border: 1px solid var(--w-border);
  box-shadow: 0 8px 22px rgba(123, 164, 101, 0.06);
  transition:
    transform 0.25s ease,
    border-color 0.25s ease,
    box-shadow 0.25s ease;
}
body.platform-web .learning-content .category-button:hover {
  transform: translateY(-4px);
  border-color: var(--w-sage);
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.06);
}
body.platform-web .learning-content .scrollable-tabs {
  overflow: visible;
}
body.platform-web .learning-content .scrollable-tabs-btn {
  --background: var(--w-card);
  --color: var(--w-text);
  border: 1px solid var(--w-border);
}
body.platform-web .learning-content .scrollable-tabs-btn.active {
  --background: var(--w-sage);
  --color: #fff;
  border-color: var(--w-sage);
}
@media (width >= 768px) {
  body.platform-web .learning-content app-last-played-course .last-played-course {
    display: grid;
    grid-template-columns: minmax(260px, 320px) minmax(0, 1fr);
    align-items: stretch;
  }
  body.platform-web .learning-content .last-played-course-media {
    height: 100%;
    min-height: 282px;
  }
  body.platform-web .learning-content .last-played-course-content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 28px 32px;
  }
  body.platform-web .learning-content .last-played-course-content .continue-button {
    width: fit-content;
    --border-radius: 10px;
    padding-right: 0;
  }
}
body.platform-web .learning-content app-last-played-course .last-played-course {
  border: 1px solid var(--w-border);
}
body.platform-web .cd-content {
  --background: var(--w-canvas);
}
body.platform-web .cd-content .cd-web-back-row {
  display: flex;
  padding: 24px 16px 0;
}
body.platform-web .cd-content .cd-web-back-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  padding: 0;
  border: 1px solid var(--w-border);
  border-radius: 50%;
  background: var(--w-card);
  color: var(--w-text);
  box-shadow: var(--w-shadow-sm);
  cursor: pointer;
  transition:
    background-color 0.18s ease,
    border-color 0.18s ease,
    transform 0.18s ease,
    box-shadow 0.18s ease;
}
body.platform-web .cd-content .cd-web-back-btn ion-icon {
  font-size: 22px;
}
body.platform-web .cd-content .cd-web-back-btn:hover {
  border-color: color-mix(in srgb, var(--w-sage) 45%, var(--w-border));
  background: var(--w-hover, #f5f8f2);
  box-shadow: var(--w-shadow-md);
  transform: translateX(-2px);
}
body.platform-web .cd-content .cd-web-back-btn:focus-visible {
  outline: 3px solid rgba(123, 164, 101, 0.22);
  outline-offset: 2px;
}
body.platform-web .lrn-sub-header {
  display: none !important;
}
body.platform-web .quiz-page .quiz-back-button {
  display: inline-flex;
}
body.platform-web .review-page .review-back-button {
  display: inline-flex;
}
@media (width >= 980px) {
  body.platform-web .cd-web-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 380px;
    gap: 18px 40px;
    align-items: start;
    max-width: var(--w-max);
    margin: 0 auto;
    padding: 32px 24px 64px;
  }
  body.platform-web .cd-web-grid > .cd-web-back-row {
    grid-column: 1/-1;
    padding: 0;
  }
  body.platform-web .cd-web-grid > .video-section {
    position: sticky;
    top: 80px;
    padding: 16px;
    overflow: hidden;
    border: 1px solid var(--w-border);
    border-radius: calc(var(--w-radius-hero) + 8px);
    background: var(--w-card);
    box-shadow: 0 22px 60px rgba(35, 54, 26, 0.12);
  }
  body.platform-web .course-video-panel-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 4px 4px 16px;
  }
  body.platform-web .course-video-panel-copy {
    min-width: 0;
  }
  body.platform-web .course-video-panel-copy h2 {
    margin: 5px 0 0;
    overflow: hidden;
    color: var(--w-text);
    font-size: 18px;
    font-weight: 800;
    line-height: 1.25;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  body.platform-web .course-video-eyebrow {
    color: var(--ion-color-primary);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.16em;
    text-transform: uppercase;
  }
  body.platform-web .course-video-status {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 7px;
    padding: 7px 11px;
    border: 1px solid rgb(var(--ion-color-primary-rgb)/16%);
    border-radius: 999px;
    background: rgb(var(--ion-color-primary-rgb)/9%);
    color: var(--ion-color-primary-shade);
    font-size: 11px;
    font-weight: 700;
  }
  body.platform-web .course-video-status-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--ion-color-danger);
    box-shadow: 0 0 0 4px rgb(var(--ion-color-danger-rgb)/12%);
  }
  body.platform-web .cd-web-grid .video-container,
  body.platform-web .cd-web-grid .video-player-container,
  body.platform-web .cd-web-grid .video-player-wrapper {
    border-radius: var(--w-radius-hero) !important;
    overflow: hidden;
    box-shadow: var(--w-shadow-lg);
    height: auto !important;
    aspect-ratio: 16/9;
  }
  body.platform-web .cd-web-grid .video-player-wrapper {
    background: #000;
  }
  body.platform-web .cd-web-grid .course-video {
    width: 100%;
    height: 100% !important;
    min-height: 0;
  }
  body.platform-web .cd-web-grid .course-video-pip-btn {
    top: 14px;
    right: 14px;
    width: 44px;
    height: 44px;
    margin: 0;
    border: 1px solid rgba(255, 255, 255, 0.24);
    border-radius: 12px;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    --background: rgb(10 14 10 / 68%);
    --background-hover: rgb(10 14 10 / 84%);
    --border-radius: 12px;
    --padding-start: 10px;
    --padding-end: 10px;
  }
  body.platform-web .cd-web-grid .video-background::after {
    content: "";
    position: absolute;
    inset: 0;
    background:
      linear-gradient(
        to top,
        rgba(0, 0, 0, 0.4),
        transparent 50%);
    pointer-events: none;
  }
  body.platform-web .cd-web-grid .play-button-container {
    width: 72px !important;
    height: 72px !important;
    background: rgba(255, 255, 255, 0.2) !important;
    -webkit-backdrop-filter: blur(12px) !important;
    backdrop-filter: blur(12px) !important;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.2);
    border: 1px solid rgba(255, 255, 255, 0.3);
    transition: var(--transition-bounce) !important;
    cursor: pointer;
  }
  body.platform-web .cd-web-grid .play-button-container:hover {
    transform: scale(1.1);
    background: rgba(255, 255, 255, 0.3) !important;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
  }
  body.platform-web .cd-web-grid .play-icon .play-vector {
    background: #fff !important;
    border: none !important;
  }
  body.platform-web .cd-web-grid > .course-details-section {
    padding: 0;
  }
  body.platform-web .cd-web-grid .course-title {
    font-size: 24px;
    font-weight: 800;
    color: var(--w-text);
    line-height: 1.25;
    margin-bottom: 8px;
  }
  body.platform-web .cd-web-grid .course-instructor {
    font-size: 14px;
    color: var(--w-muted);
  }
  body.platform-web .cd-web-grid .price-pill {
    font-size: 22px;
    font-weight: 800;
  }
  body.platform-web .cd-web-grid .price-pill.free {
    color: var(--w-sage);
  }
  body.platform-web .cd-web-grid .web-course-actions {
    margin-top: 24px;
    margin-bottom: 24px;
  }
  body.platform-web .cd-web-grid .web-price-row {
    display: flex;
    align-items: baseline;
    gap: 12px;
    margin-bottom: 16px;
  }
  body.platform-web .cd-web-grid .web-price-row .current-price {
    font-size: 24px;
    font-weight: 800;
    color: var(--w-pink-strong);
  }
  body.platform-web .cd-web-grid .web-price-row .original-price {
    font-size: 16px;
    color: var(--w-muted);
    text-decoration: line-through;
  }
  body.platform-web .cd-web-grid .web-price-row .discount-pill {
    background: rgba(233, 102, 119, 0.1);
    color: var(--w-pink-strong);
    padding: 4px 8px;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 700;
  }
  body.platform-web .cd-web-grid .web-enroll-btn {
    --background: var(--w-sage);
    --border-radius: var(--w-radius-sm);
    font-weight: 700;
    font-size: 16px;
    height: 48px;
    margin: 0;
  }
  body.platform-web .cd-web-grid .mentor-card,
  body.platform-web .cd-web-grid .curriculum-card,
  body.platform-web .cd-web-grid .review-card {
    background: var(--w-card);
    border: 1px solid var(--w-border);
    border-radius: var(--w-radius-card);
    box-shadow: var(--w-shadow-sm);
  }
}
body.platform-web .category-content,
body.platform-web .search-content {
  --background: var(--w-canvas);
}
body.platform-web .lrn-listing-header app-header-toolbar {
  display: none !important;
}
body.platform-web .lrn-listing-header,
body.platform-web .lrn-listing-header ion-header,
body.platform-web .lrn-listing-header ion-toolbar,
body.platform-web .lrn-listing-header app-header-search {
  --background: var(--w-canvas) !important;
  background: var(--w-canvas) !important;
  box-shadow: none !important;
}
@media (width >= 768px) {
  body.platform-web .category-content app-virtual-paginated-list,
  body.platform-web .search-content app-virtual-paginated-list,
  body.platform-web .search-content .courses-list-container,
  body.platform-web .search-content .active-filters-section,
  body.platform-web .search-content app-scrollable-tabs,
  body.platform-web .search-content .search-results-title {
    display: block;
    width: 100%;
    max-width: var(--w-max);
    margin: 0 auto;
    padding-left: 24px;
    padding-right: 24px;
  }
  body.platform-web .category-content .courses-grid,
  body.platform-web .search-content .courses-grid {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 24px;
  }
}
@media (width >= 768px) and (width < 900px) {
  body.platform-web .category-content .courses-grid,
  body.platform-web .search-content .courses-grid {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
body.platform-web .quiz-page,
body.platform-web .attempt-page,
body.platform-web .review-page,
body.platform-web .summary-page {
  --background: var(--w-canvas);
}
@media (width >= 768px) {
  body.platform-web .attempt-page .attempt-body,
  body.platform-web .review-page .review-body,
  body.platform-web .summary-page .summary-body {
    max-width: 800px;
    margin: 40px auto 64px;
    padding: 0;
  }
  body.platform-web .quiz-page .quiz-card {
    max-width: 960px;
    margin: 0 auto;
    padding: clamp(24px, 2.2vw, 32px);
    background: var(--w-card);
    border: 1px solid var(--w-border);
    border-radius: var(--w-radius-hero);
    box-shadow: var(--w-shadow-md);
  }
  body.platform-web .summary-page .summary-body {
    background: var(--w-card);
    border-radius: var(--w-radius-hero);
    border: 1px solid var(--w-border);
    box-shadow: var(--w-shadow-md);
    padding: 40px;
  }
  body.platform-web .attempt-page .question-card,
  body.platform-web .attempt-page .option-item,
  body.platform-web .review-page .question-card,
  body.platform-web .review-page .option-row {
    background: var(--w-card);
    border: 1px solid var(--w-border);
    border-radius: var(--w-radius-card);
    box-shadow: var(--w-shadow-sm);
  }
  body.platform-web ion-footer {
    background: var(--w-canvas);
  }
  body.platform-web ion-footer .quiz-actions,
  body.platform-web ion-footer .footer-actions,
  body.platform-web ion-footer .footer-nav {
    max-width: 800px;
    margin: 0 auto;
    padding: 16px 24px;
  }
}
body.platform-web .community-header app-header-toolbar {
  display: none;
}
body.platform-web .community-header,
body.platform-web .community-header ion-header,
body.platform-web .community-header ion-toolbar,
body.platform-web .community-header app-header-search {
  --background: var(--w-canvas) !important;
  background: var(--w-canvas) !important;
  box-shadow: none !important;
  --border-width: 0;
}
body.platform-web .community-header app-header-search {
  display: block;
  max-width: var(--w-max);
  margin: 0 auto;
  padding: 8px 24px 12px;
}
body.platform-web .community-header .search-container {
  background: var(--w-card) !important;
  border: 1px solid var(--w-border);
  border-radius: 30px;
  box-shadow: 0 4px 14px rgba(123, 164, 101, 0.06);
}
body.platform-web .community-content .create-post-section {
  display: none !important;
}
body.platform-web .community-content {
  --community-hero-pill-background: rgb(255 255 255 / 70%);
  --community-stats-background: rgb(255 255 255 / 86%);
  --background: var(--w-canvas);
  color: var(--w-text);
}
body.platform-web .community-content .community-grid,
body.platform-web .community-content .community-hero,
body.platform-web .community-content .composer,
body.platform-web .community-content .filter-tabs {
  max-width: var(--w-max);
  margin-left: auto;
  margin-right: auto;
  padding-left: 24px;
  padding-right: 24px;
}
body.platform-web .community-hero {
  position: relative;
  border: 1px solid rgba(101, 132, 82, 0.13);
  border-radius: 22px;
  overflow: hidden;
  box-shadow: 0 16px 42px rgba(61, 84, 48, 0.08), inset 0 1px 0 #fff;
  margin-top: 20px;
  margin-bottom: 32px;
  display: grid;
  grid-template-columns: 1.35fr 1fr;
  align-items: stretch;
  background:
    linear-gradient(
      180deg,
      rgba(255, 255, 255, 0.92),
      rgba(249, 252, 247, 0.88)),
    #fff;
  padding: 0;
}
body.platform-web .community-hero::before {
  position: absolute;
  z-index: 3;
  top: 0;
  left: 24px;
  width: 88px;
  height: 2px;
  border-radius: 0 0 999px 999px;
  background:
    linear-gradient(
      90deg,
      #7ea563,
      rgba(126, 165, 99, 0));
  content: "";
  pointer-events: none;
}
body.platform-web .community-hero .bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}
body.platform-web .community-hero .hero-text {
  position: relative;
  z-index: 2;
  padding: 40px 44px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  justify-content: center;
}
body.platform-web .community-hero .hero-text .hero-chip {
  align-self: flex-start;
  display: flex;
  align-items: center;
  gap: 7px;
  font-size: 13px;
  font-weight: 700;
  color: var(--w-sage-hover);
  background: var(--community-hero-pill-background);
  border: 1px solid var(--w-border);
  padding: 5px 12px;
  border-radius: 30px;
}
body.platform-web .community-hero .hero-text .eyebrow {
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--w-sage);
}
body.platform-web .community-hero .hero-text h1 {
  font-size: 32px;
  font-weight: 800;
  line-height: 1.1;
  letter-spacing: -0.01em;
  color: var(--w-text);
  margin: 0;
}
body.platform-web .community-hero .hero-text p {
  font-size: 17px;
  color: var(--w-muted);
  font-weight: 500;
  max-width: 30ch;
  line-height: 1.45;
  margin: 0;
}
body.platform-web .community-hero .hero-text .hero-actions {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-top: 8px;
}
body.platform-web .community-hero .hero-text .hero-actions .btn-primary {
  background: var(--w-sage);
  color: var(--ion-color-primary-contrast);
  border: none;
  border-radius: 30px;
  padding: 12px 26px;
  font-size: 15px;
  font-weight: 700;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 8px;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}
body.platform-web .community-hero .hero-text .hero-actions .btn-primary:hover {
  background: var(--w-sage-hover);
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(16, 24, 16, 0.08);
}
body.platform-web .community-hero .hero-text .hero-actions .btn-link {
  background: none;
  border: none;
  color: var(--w-sage-hover);
  font-size: 15px;
  font-weight: 700;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 7px;
}
body.platform-web .community-hero .hero-text .hero-actions .btn-link:hover {
  color: var(--w-sage);
}
body.platform-web .community-hero .hero-stats {
  position: relative;
  z-index: 2;
  place-self: center end;
  margin: 24px 44px 24px 0;
  width: 100%;
  max-width: 260px;
  background: var(--community-stats-background);
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
  border: 1px solid var(--w-border);
  border-radius: var(--w-radius-card);
  padding: 20px 22px;
  box-shadow: 0 4px 20px rgba(16, 24, 16, 0.08);
  display: flex;
  flex-direction: column;
  gap: 12px;
}
body.platform-web .community-hero .hero-stats .stats-title {
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--w-muted);
}
body.platform-web .community-hero .hero-stats .stat-row {
  display: flex;
  align-items: center;
  gap: 12px;
}
body.platform-web .community-hero .hero-stats .stat-row .stat-ic {
  width: 38px;
  height: 38px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  flex-shrink: 0;
}
body.platform-web .community-hero .hero-stats .stat-row .stat-ic.g {
  background: rgba(123, 164, 101, 0.14);
  color: var(--w-sage);
}
body.platform-web .community-hero .hero-stats .stat-row .stat-ic.b {
  background: rgba(74, 166, 226, 0.14);
  color: #4aa6e2;
}
body.platform-web .community-hero .hero-stats .stat-row .stat-ic.p {
  background: rgba(233, 102, 119, 0.14);
  color: var(--w-pink);
}
body.platform-web .community-hero .hero-stats .stat-row b {
  font-size: 17px;
  font-weight: 800;
  display: block;
  line-height: 1.1;
}
body.platform-web .community-hero .hero-stats .stat-row span {
  font-size: 13px;
  color: var(--w-muted);
  font-weight: 600;
}
body.platform-web .community-content .composer {
  position: relative;
  overflow: hidden;
  background:
    linear-gradient(
      180deg,
      rgba(255, 255, 255, 0.92),
      rgba(249, 252, 247, 0.88)),
    #fff;
  border: 1px solid rgba(101, 132, 82, 0.13);
  border-radius: 22px;
  box-shadow: 0 16px 42px rgba(61, 84, 48, 0.08), inset 0 1px 0 #fff;
  padding: 24px;
  margin-bottom: 24px;
  display: flex;
  align-items: center;
  gap: 16px;
}
body.platform-web .community-content .composer::before {
  position: absolute;
  top: 0;
  left: 24px;
  width: 88px;
  height: 2px;
  border-radius: 0 0 999px 999px;
  background:
    linear-gradient(
      90deg,
      #7ea563,
      rgba(126, 165, 99, 0));
  content: "";
}
body.platform-web .community-content .composer .avatar {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-weight: 700;
  flex-shrink: 0;
}
body.platform-web .community-content .composer .composer-input {
  flex: 1;
  background: var(--w-canvas);
  border: 1px solid var(--w-border);
  border-radius: 30px;
  padding: 12px 20px;
  color: var(--w-muted);
  font-size: 15px;
  cursor: text;
}
body.platform-web .community-content .composer .composer-actions {
  display: flex;
  align-items: center;
  gap: 8px;
}
body.platform-web .community-content .composer .composer-actions .composer-btn {
  display: flex;
  align-items: center;
  gap: 8px;
  background: var(--w-card);
  border: 1px solid var(--w-border);
  color: var(--w-text);
  font-size: 13px;
  font-weight: 700;
  padding: 9px 14px;
  border-radius: 30px;
  cursor: pointer;
  transition: transform 0.3s ease, border-color 0.3s ease;
}
body.platform-web .community-content .composer .composer-actions .composer-btn ion-icon {
  color: var(--w-sage);
  font-size: 16px;
}
body.platform-web .community-content .composer .composer-actions .composer-btn:hover {
  border-color: var(--w-sage);
  transform: translateY(-2px);
}
body.platform-web .community-content .composer .composer-actions .composer-btn.voice ion-icon {
  color: var(--w-pink);
}
body.platform-web .community-content .composer .composer-actions .composer-btn.post {
  background: var(--w-sage);
  color: #fff;
  border-color: var(--w-sage);
}
body.platform-web .community-content .composer .composer-actions .composer-btn.post ion-icon {
  color: #fff;
}
body.platform-web .community-content .composer .composer-actions .composer-btn.post:hover {
  background: var(--w-sage-hover);
}
body.platform-web .community-content .filter-tabs {
  margin-bottom: 24px;
}
body.platform-web .community-content .filter-tabs app-scrollable-tabs .scrollable-tabs {
  overflow: visible;
}
body.platform-web .community-content .filter-tabs app-scrollable-tabs .scrollable-tabs-btn {
  --background: var(--w-card);
  --color: var(--w-text);
  border: 1px solid var(--w-border);
  box-shadow: 0 1px 3px rgba(16, 24, 16, 0.04);
  transition: border-color 0.3s ease;
}
body.platform-web .community-content .filter-tabs app-scrollable-tabs .scrollable-tabs-btn:hover {
  border-color: var(--w-sage);
}
body.platform-web .community-content .filter-tabs app-scrollable-tabs .scrollable-tabs-btn.active {
  --background: var(--w-sage);
  --color: #fff;
  border-color: var(--w-sage);
}
@media (width >= 992px) {
  body.platform-web .community-content .community-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 336px;
    gap: 24px;
    align-items: start;
  }
}
@media (width < 992px) {
  body.platform-web .community-content .community-grid {
    display: flex;
    flex-direction: column;
  }
  body.platform-web .community-hero {
    grid-template-columns: 1fr;
  }
  body.platform-web .community-hero .hero-stats {
    place-self: auto;
    place-self: stretch stretch;
    max-width: none;
    width: auto;
    margin: 0 32px 32px;
    box-sizing: border-box;
  }
}
@media (600px <= width < 992px) {
  body.platform-web .community-hero .hero-stats {
    box-sizing: border-box;
    width: auto;
    min-width: 0;
  }
}
@media (width < 600px) {
  body.platform-web .community-content .community-grid,
  body.platform-web .community-content .community-hero,
  body.platform-web .community-content .composer,
  body.platform-web .community-content .filter-tabs {
    padding-left: 16px;
    padding-right: 16px;
  }
  body.platform-web .community-content .composer {
    flex-wrap: wrap;
  }
  body.platform-web .community-content .composer .composer-input {
    flex: 1 1 100%;
    order: -1;
  }
  body.platform-web .community-content .composer .avatar {
    display: none;
  }
  body.platform-web .community-hero .hero-text {
    padding: 24px 18px;
  }
  body.platform-web .community-hero .hero-text h1 {
    font-size: 24px;
  }
  body.platform-web .community-hero .hero-text p {
    font-size: 14px;
    max-width: 100%;
  }
  body.platform-web .community-hero .hero-text .hero-actions {
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
  }
  body.platform-web .community-hero .hero-text .hero-actions .btn-primary,
  body.platform-web .community-hero .hero-text .hero-actions .btn-link {
    justify-content: center;
    width: 100%;
  }
  body.platform-web .community-hero .hero-stats {
    place-self: auto;
    place-self: stretch stretch;
    width: auto;
    max-width: 100%;
    margin: 0 16px 24px;
    box-sizing: border-box;
  }
}
@media (width <= 360px) {
  body.platform-web .community-content .community-grid,
  body.platform-web .community-content .community-hero,
  body.platform-web .community-content .composer,
  body.platform-web .community-content .filter-tabs {
    padding-left: 12px;
    padding-right: 12px;
  }
  body.platform-web .community-hero {
    margin-top: 14px;
    margin-bottom: 20px;
    border-radius: 18px;
  }
  body.platform-web .community-hero .hero-text {
    padding: 20px 14px;
    gap: 10px;
  }
  body.platform-web .community-hero .hero-text .hero-chip {
    font-size: 11px;
    padding: 4px 10px;
  }
  body.platform-web .community-hero .hero-text .hero-chip ion-icon {
    font-size: 14px;
  }
  body.platform-web .community-hero .hero-text .eyebrow {
    font-size: 11px;
  }
  body.platform-web .community-hero .hero-text h1 {
    font-size: 22px;
    line-height: 1.2;
  }
  body.platform-web .community-hero .hero-text p {
    font-size: 13px;
    line-height: 1.4;
    max-width: 100%;
  }
  body.platform-web .community-hero .hero-text .hero-actions {
    flex-direction: column;
    align-items: stretch;
    gap: 8px;
  }
  body.platform-web .community-hero .hero-text .hero-actions .btn-primary {
    padding: 10px 18px;
    font-size: 13px;
    justify-content: center;
    width: 100%;
  }
  body.platform-web .community-hero .hero-text .hero-actions .btn-link {
    font-size: 13px;
    justify-content: center;
    width: 100%;
  }
  body.platform-web .community-hero .hero-stats {
    place-self: auto;
    place-self: stretch stretch;
    width: auto;
    max-width: 100%;
    margin: 0 12px 20px;
    padding: 14px;
    border-radius: 14px;
    box-sizing: border-box;
  }
  body.platform-web .community-hero .hero-stats .stats-title {
    font-size: 11px;
  }
  body.platform-web .community-hero .hero-stats .stat-row {
    gap: 10px;
  }
  body.platform-web .community-hero .hero-stats .stat-row .stat-ic {
    width: 32px;
    height: 32px;
    font-size: 16px;
  }
  body.platform-web .community-hero .hero-stats .stat-row b {
    font-size: 15px;
  }
  body.platform-web .community-hero .hero-stats .stat-row span {
    font-size: 12px;
  }
}
body.platform-web .community-content app-post-card {
  display: block;
  margin-bottom: 24px;
}
body.platform-web .community-content app-post-card .post-card {
  background: var(--w-card);
  border: 1px solid var(--w-border);
  border-radius: var(--w-radius-card);
  box-shadow: 0 4px 16px rgba(16, 24, 16, 0.06);
  transition:
    transform 0.3s ease,
    border-color 0.3s ease,
    box-shadow 0.3s ease;
}
body.platform-web .community-content app-post-card .post-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 32px rgba(16, 24, 16, 0.1);
  border-color: var(--w-sage);
}
body.platform-web .community-content app-post-card .post-title {
  font-size: 19px;
  font-weight: 700;
  color: var(--w-text);
  margin: 16px 0 8px;
}
body.platform-web .community-content app-post-card .post-content {
  font-size: 15px;
  line-height: 1.55;
}
body.platform-web .community-content app-post-card .post-actions {
  border-top: 1px solid var(--w-border);
  padding-top: 16px;
  margin-top: 16px;
}
body.platform-web .community-content app-post-card .post-actions .action-btn {
  margin-right: 16px;
  --color: var(--w-muted);
}
body.platform-web .community-content app-post-card .post-actions .action-btn:hover {
  --color: var(--w-sage);
}
body.platform-web .community-content app-post-card .post-actions .reaction-pill {
  margin-left: auto;
  display: flex;
  align-items: center;
  background: var(--w-canvas);
  border: 1px solid var(--w-border);
  border-radius: 30px;
  overflow: hidden;
}
body.platform-web .community-content app-post-card .post-actions .reaction-pill .reaction-btn {
  padding: 7px 16px;
  --padding-start: 16px;
  --padding-end: 16px;
  color: var(--w-text);
  font-weight: 700;
}
body.platform-web .community-content app-post-card .post-actions .reaction-pill .reaction-btn.reaction-active {
  color: var(--w-sage);
}
body.platform-web .community-content app-post-card .post-actions .reaction-pill .divider {
  width: 1px;
  align-self: stretch;
  background: var(--w-border);
}
body.platform-web .community-content app-post-card app-image-preview {
  display: block;
  margin-top: 16px;
  border-radius: 12px;
  overflow: hidden;
  aspect-ratio: 16/9;
}
body.platform-web .community-content app-post-card app-image-preview .image-preview-container {
  height: 100% !important;
}
body.platform-web .community-content app-post-card app-image-preview ion-img {
  width: 100%;
  height: 100%;
}
body.platform-web .community-content app-post-card app-image-preview ion-img::part(image) {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
body.platform-web .community-content .sidebar {
  display: flex;
  flex-direction: column;
  gap: 24px;
  position: sticky;
  top: 88px;
}
body.platform-web .community-content .sidebar .side-card {
  position: relative;
  overflow: hidden;
  background:
    linear-gradient(
      180deg,
      rgba(255, 255, 255, 0.92),
      rgba(249, 252, 247, 0.88)),
    #fff;
  border: 1px solid rgba(101, 132, 82, 0.13);
  border-radius: 22px;
  box-shadow: 0 16px 42px rgba(61, 84, 48, 0.08), inset 0 1px 0 #fff;
  padding: 24px;
}
body.platform-web .community-content .sidebar .side-card::before {
  position: absolute;
  top: 0;
  left: 24px;
  width: 88px;
  height: 2px;
  border-radius: 0 0 999px 999px;
  background:
    linear-gradient(
      90deg,
      #7ea563,
      rgba(126, 165, 99, 0));
  content: "";
}
body.platform-web .community-content .sidebar .side-card h4 {
  font-size: 19px;
  font-weight: 700;
  margin-top: 0;
  margin-bottom: 16px;
}
body.platform-web .community-content .sidebar .side-card.standing {
  position: relative;
  overflow: hidden;
  border: none;
  color: #fff;
  background:
    linear-gradient(
      135deg,
      #6b9a57 0%,
      #3f6b36 100%);
  padding: 24px;
}
body.platform-web .community-content .sidebar .side-card.standing .glow {
  position: absolute;
  width: 160px;
  height: 160px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.1);
  top: -60px;
  right: -40px;
}
body.platform-web .community-content .sidebar .side-card.standing .eyebrow {
  position: relative;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.85);
}
body.platform-web .community-content .sidebar .side-card.standing .medal-row {
  position: relative;
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 12px 0 16px;
}
body.platform-web .community-content .sidebar .side-card.standing .medal-row .medal {
  width: 54px;
  height: 54px;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.16);
  border: 1px solid rgba(255, 255, 255, 0.35);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  color: var(--w-gold);
  flex-shrink: 0;
}
body.platform-web .community-content .sidebar .side-card.standing .medal-row .badge-name {
  font-size: 22px;
  font-weight: 800;
  line-height: 1.1;
}
body.platform-web .community-content .sidebar .side-card.standing .medal-row .pts {
  font-size: 13px;
  font-weight: 700;
  color: rgba(255, 255, 255, 0.9);
  margin-top: 2px;
}
body.platform-web .community-content .sidebar .side-card.standing .next-meta {
  position: relative;
  display: flex;
  justify-content: space-between;
  font-size: 13px;
  font-weight: 700;
  color: rgba(255, 255, 255, 0.92);
  margin-bottom: 8px;
}
body.platform-web .community-content .sidebar .side-card.standing .track {
  position: relative;
  height: 8px;
  border-radius: 4px;
  background: rgba(255, 255, 255, 0.22);
  overflow: hidden;
}
body.platform-web .community-content .sidebar .side-card.standing .track .fill {
  height: 100%;
  width: 82%;
  border-radius: 4px;
  background:
    linear-gradient(
      90deg,
      var(--w-lime),
      #eaf4df);
}
body.platform-web .community-content .sidebar .side-card.standing .rewards-link {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  margin-top: 16px;
  font-size: 15px;
  font-weight: 700;
  color: #fff;
  text-decoration: none;
}
body.platform-web .community-content .sidebar .side-card.standing .rewards-link ion-icon {
  transition: transform 0.3s ease;
}
body.platform-web .community-content .sidebar .side-card.standing .rewards-link:hover ion-icon {
  transform: translateX(4px);
}
body.platform-web .community-content .sidebar .rule {
  display: flex;
  gap: 12px;
  padding: 10px 0;
  border-bottom: 1px solid var(--w-border);
}
body.platform-web .community-content .sidebar .rule:last-of-type {
  border-bottom: none;
}
body.platform-web .community-content .sidebar .rule ion-icon {
  color: var(--w-sage);
  font-size: 18px;
  margin-top: 2px;
}
body.platform-web .community-content .sidebar .rule b {
  display: block;
  font-size: 15px;
  font-weight: 700;
}
body.platform-web .community-content .sidebar .rule span {
  font-size: 13px;
  color: var(--w-muted);
  line-height: 1.4;
}
body.platform-web .community-content .sidebar .side-link {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  margin-top: 16px;
  font-size: 15px;
  font-weight: 700;
  color: var(--w-sage);
  text-decoration: none;
}
body.platform-web .community-content .sidebar .side-link:hover {
  color: var(--w-sage-hover);
}
body.platform-web .community-content .sidebar .contrib {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 0;
}
body.platform-web .community-content .sidebar .contrib + .contrib {
  border-top: 1px solid var(--w-border);
}
body.platform-web .community-content .sidebar .contrib .rank {
  width: 20px;
  text-align: center;
  font-size: 13px;
  font-weight: 800;
  color: var(--w-muted);
  flex-shrink: 0;
}
body.platform-web .community-content .sidebar .contrib .avatar {
  width: 38px;
  height: 38px;
  font-size: 13px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-weight: 700;
}
body.platform-web .community-content .sidebar .contrib .c-meta {
  flex: 1;
  min-width: 0;
}
body.platform-web .community-content .sidebar .contrib .c-name {
  font-size: 15px;
  font-weight: 700;
}
body.platform-web .community-content .sidebar .contrib .c-badge {
  font-size: 13px;
  color: var(--w-muted);
  font-weight: 600;
}
body.platform-web .community-content .sidebar .contrib .c-pts {
  font-size: 13px;
  font-weight: 800;
  color: var(--w-sage);
  display: flex;
  align-items: center;
  gap: 5px;
}
body.platform-web .community-content .sidebar .topics {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
body.platform-web .community-content .sidebar .topics .topic {
  font-size: 13px;
  font-weight: 700;
  color: var(--w-sage-hover);
  background: var(--w-canvas);
  border: 1px solid var(--w-border);
  padding: 7px 13px;
  border-radius: 30px;
  cursor: pointer;
  transition: transform 0.3s ease, border-color 0.3s ease;
}
body.platform-web .community-content .sidebar .topics .topic:hover {
  border-color: var(--w-sage);
  color: var(--w-sage);
  transform: translateY(-1px);
}
body.platform-web .community-content .sidebar .topics .topic .n {
  color: var(--w-muted);
  font-weight: 600;
  margin-left: 5px;
}
body.platform-web[class~=dark] .community-header,
body.platform-web[class~=dark] .community-content {
  --w-sage: var(--ion-color-primary);
  --w-sage-hover: var(--ion-color-primary-tint);
}
body.platform-web[class~=dark] .community-header,
body.platform-web[class~=dark] .community-header ion-header,
body.platform-web[class~=dark] .community-header ion-toolbar,
body.platform-web[class~=dark] .community-header app-header-search {
  --background:
    radial-gradient(
      
      circle at 12% 0%,
      color-mix(in srgb, var(--ion-color-primary) 15%, transparent),
      transparent 34rem ),
    linear-gradient(
      180deg,
      #111a15 0%,
      #0b100d 56%,
      #080b09 100%) !important;
  background:
    radial-gradient(
      circle at 12% 0%,
      color-mix(in srgb, var(--ion-color-primary) 15%, transparent),
      transparent 34rem),
    linear-gradient(
      180deg,
      #111a15 0%,
      #0b100d 56%,
      #080b09 100%) !important;
}
body.platform-web[class~=dark] .community-header app-header-search .search-container {
  background:
    linear-gradient(
      180deg,
      rgba(168, 207, 143, 0.07),
      transparent 58%),
    #0f1612 !important;
  border-color: rgba(205, 226, 210, 0.12);
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.03);
}
body.platform-web[class~=dark] .community-header app-header-search ion-searchbar {
  --background: var(--app-surface-muted);
  --color: var(--app-text);
  --icon-color: var(--ion-color-primary);
  --placeholder-color: var(--app-text-muted);
}
body.platform-web[class~=dark] .community-header .community-back-btn {
  border-color: var(--app-border);
  background: var(--app-surface);
  color: var(--ion-color-primary);
  box-shadow: var(--w-shadow-sm);
}
body.platform-web[class~=dark] .community-content {
  --community-hero-pill-background: var(--app-surface-raised);
  --community-stats-background: var(--app-surface-raised);
  --background:
    radial-gradient(
      
      circle at 12% 0%,
      color-mix(in srgb, var(--ion-color-primary) 15%, transparent),
      transparent 34rem ),
    linear-gradient(
      180deg,
      #111a15 0%,
      #0b100d 56%,
      #080b09 100%);
  color: var(--app-text);
}
body.platform-web[class~=dark] .community-content::part(scroll) {
  background:
    radial-gradient(
      circle at 12% 0%,
      color-mix(in srgb, var(--ion-color-primary) 15%, transparent),
      transparent 34rem),
    linear-gradient(
      180deg,
      #111a15 0%,
      #0b100d 56%,
      #080b09 100%);
}
body.platform-web[class~=dark] .community-hero {
  background:
    linear-gradient(
      180deg,
      rgba(168, 207, 143, 0.05),
      transparent 54%),
    #0f1612;
  border-color: rgba(205, 226, 210, 0.11);
  box-shadow: 0 18px 46px rgba(0, 0, 0, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.03);
}
body.platform-web[class~=dark] .community-hero::before {
  background:
    linear-gradient(
      90deg,
      #a8cf8f,
      rgba(168, 207, 143, 0));
}
body.platform-web[class~=dark] .community-hero .bg rect {
  fill: #0f1612;
}
body.platform-web[class~=dark] .community-hero .hero-text .hero-chip {
  border-color: var(--app-border);
  background: var(--app-surface-raised);
  color: var(--ion-color-primary-tint);
}
body.platform-web[class~=dark] .community-hero .hero-text .eyebrow {
  color: var(--ion-color-primary);
}
body.platform-web[class~=dark] .community-hero .hero-text h1 {
  color: var(--app-text);
}
body.platform-web[class~=dark] .community-hero .hero-text p {
  color: var(--app-text-muted);
}
body.platform-web[class~=dark] .community-hero .hero-text .hero-actions .btn-primary {
  background: var(--ion-color-primary);
  color: var(--ion-color-primary-contrast);
}
body.platform-web[class~=dark] .community-hero .hero-text .hero-actions .btn-primary:hover {
  background: var(--ion-color-primary-tint);
}
body.platform-web[class~=dark] .community-hero .hero-text .hero-actions .btn-link {
  color: var(--ion-color-primary-tint);
}
body.platform-web[class~=dark] .community-hero .hero-text .hero-actions .btn-link:hover {
  color: var(--ion-color-primary);
}
body.platform-web[class~=dark] .community-hero .hero-stats {
  border-color: rgba(205, 226, 210, 0.11);
  background:
    linear-gradient(
      180deg,
      rgba(168, 207, 143, 0.07),
      transparent 54%),
    #121b15;
  color: var(--app-text);
  box-shadow: var(--w-shadow-md);
}
body.platform-web[class~=dark] .community-hero .hero-stats .stats-title,
body.platform-web[class~=dark] .community-hero .hero-stats .stat-row span {
  color: var(--app-text-muted);
}
body.platform-web[class~=dark] .community-hero .hero-stats .stat-row b {
  color: var(--app-text);
}
body.platform-web[class~=dark] .community-content .composer,
body.platform-web[class~=dark] .community-content .sidebar .side-card:not(.standing) {
  background:
    linear-gradient(
      180deg,
      rgba(168, 207, 143, 0.05),
      transparent 54%),
    #0f1612;
  border-color: rgba(205, 226, 210, 0.11);
  box-shadow: 0 18px 46px rgba(0, 0, 0, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.03);
}
body.platform-web[class~=dark] .community-content .composer::before,
body.platform-web[class~=dark] .community-content .sidebar .side-card:not(.standing)::before {
  background:
    linear-gradient(
      90deg,
      #a8cf8f,
      rgba(168, 207, 143, 0));
}
body.platform-web[class~=dark] .community-content app-post-card .post-card {
  background:
    linear-gradient(
      180deg,
      rgba(168, 207, 143, 0.05),
      transparent 54%),
    #0f1612;
  border-color: rgba(205, 226, 210, 0.11);
  box-shadow: 0 18px 46px rgba(0, 0, 0, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.03);
}
body.platform-web[class~=dark] .community-content .composer .composer-btn.post,
body.platform-web[class~=dark] .community-content .filter-tabs .scrollable-tabs-btn.active {
  background: var(--ion-color-primary);
  color: var(--ion-color-primary-contrast);
  --background: var(--ion-color-primary);
  --color: var(--ion-color-primary-contrast);
}
body.platform-web .profile-header {
  display: none;
}
body.platform-web .profile-content {
  --background: var(--w-canvas);
}
body.platform-web .profile-content .profile-stats-section {
  display: none;
}
body.platform-web .profile-content .profile-web-grid {
  max-width: var(--w-max);
  margin: 0 auto;
  padding: 32px 24px 64px;
}
body.platform-web .profile-content .profile-web-sidebar {
  display: flex;
  flex-direction: column;
  gap: 24px;
  margin-bottom: 24px;
}
body.platform-web .profile-content .profile-web-main {
  display: flex;
  flex-direction: column;
  gap: 24px;
  min-width: 0;
}
@media (width >= 768px) {
  body.platform-web .profile-content .profile-web-grid {
    display: grid;
    grid-template-columns: 320px minmax(0, 1fr);
    column-gap: 48px;
    align-items: start;
  }
  body.platform-web .profile-content .profile-web-sidebar {
    position: sticky;
    top: 24px;
    margin-bottom: 0;
  }
}
body.platform-web .profile-content .profile-web-identity-card {
  position: relative;
  overflow: hidden;
  background:
    linear-gradient(
      180deg,
      rgba(255, 255, 255, 0.92),
      rgba(249, 252, 247, 0.88)),
    #fff;
  border: 1px solid rgba(101, 132, 82, 0.13);
  border-radius: 22px;
  box-shadow: 0 16px 42px rgba(61, 84, 48, 0.08), inset 0 1px 0 #fff;
  padding: 32px 24px;
  text-align: center;
}
body.platform-web .profile-content .profile-web-identity-card::before {
  position: absolute;
  top: 0;
  left: 24px;
  width: 88px;
  height: 2px;
  border-radius: 0 0 999px 999px;
  background:
    linear-gradient(
      90deg,
      #7ea563,
      rgba(126, 165, 99, 0));
  content: "";
}
body.platform-web .profile-content .profile-web-avatar {
  width: 140px;
  height: 140px;
  margin: 0 auto 16px;
  border-radius: 50%;
  overflow: hidden;
  border: 3px solid var(--w-sage);
}
body.platform-web .profile-content .profile-web-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
body.platform-web .profile-content .profile-web-name {
  font-size: 22px;
  font-weight: 700;
  color: var(--w-text);
  margin: 0 0 4px;
}
body.platform-web .profile-content .profile-web-email {
  font-size: 13px;
  color: var(--w-muted);
  margin: 0 0 20px;
  overflow-wrap: break-word;
}
body.platform-web .profile-content .profile-web-edit-btn {
  --background: var(--w-lime);
  --background-hover: var(--w-sage);
  --background-activated: var(--w-sage);
  --color: #1a1d1a;
  --border-radius: 10px;
  --box-shadow: none;
  font-weight: 700;
  margin: 0;
}
body.platform-web .profile-content .profile-web-stats {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}
body.platform-web .profile-content .profile-web-stat {
  display: flex;
  flex-direction: column;
  gap: 6px;
  align-items: center;
  background: var(--w-card);
  border: 1px solid var(--w-border);
  border-radius: var(--w-radius-card);
  box-shadow: 0 1px 3px rgba(16, 24, 16, 0.06);
  padding: 20px 12px;
}
body.platform-web .profile-content .profile-web-stat-number {
  font-size: 32px;
  font-weight: 800;
  line-height: 1;
  color: var(--w-sage);
}
body.platform-web .profile-content .profile-web-stat-label {
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  color: var(--w-muted);
}
body.platform-web .profile-content .profile-card,
body.platform-web .profile-content .profile-premium-card,
body.platform-web .profile-content .profile-referral-card {
  --background:
    linear-gradient(
      180deg,
      rgb(255 255 255 / 92%),
      rgb(249 252 247 / 88%)),
    #fff;
  position: relative;
  overflow: hidden;
  margin: 0;
  background:
    linear-gradient(
      180deg,
      rgba(255, 255, 255, 0.92),
      rgba(249, 252, 247, 0.88)),
    #fff;
  border: 1px solid rgba(101, 132, 82, 0.13);
  border-radius: 22px;
  box-shadow: 0 16px 42px rgba(61, 84, 48, 0.08), inset 0 1px 0 #fff;
}
body.platform-web .profile-content .profile-card::before,
body.platform-web .profile-content .profile-premium-card::before,
body.platform-web .profile-content .profile-referral-card::before {
  position: absolute;
  z-index: 2;
  top: 0;
  left: 24px;
  width: 88px;
  height: 2px;
  border-radius: 0 0 999px 999px;
  background:
    linear-gradient(
      90deg,
      #7ea563,
      rgba(126, 165, 99, 0));
  content: "";
  pointer-events: none;
}
body.platform-web .profile-content .profile-premium-card {
  background:
    linear-gradient(
      180deg,
      rgba(255, 255, 255, 0.92),
      rgba(249, 252, 247, 0.88)),
    #fff !important;
}
body.platform-web .profile-content .profile-premium-card ion-card-title {
  color: var(--w-text);
  font-size: 19px;
  font-weight: 700;
}
body.platform-web .profile-content .profile-premium-card .profile-premium-title ion-icon {
  width: 32px;
  height: 32px;
  padding: 7px;
  border-radius: 8px;
  background: rgba(123, 164, 101, 0.1);
  font-size: 18px;
  color: var(--w-sage) !important;
  opacity: 1;
}
body.platform-web .profile-content .profile-premium-card .profile-premium-date {
  color: var(--w-muted);
  font-size: 14px;
}
body.platform-web .profile-content .profile-premium-card ion-badge {
  --background: var(--w-lime);
  --color: #1a1d1a;
  background: var(--w-lime) !important;
  color: #1a1d1a !important;
  font-weight: 700;
}
body.platform-web .profile-content .profile-premium-card .profile-premium-manage-btn {
  --background: var(--w-lime);
  --background-hover: var(--w-sage);
  --color: #1a1d1a;
  --border-radius: 10px;
  --box-shadow: none;
  font-weight: 700;
}
body.platform-web .profile-content .profile-referral-card .profile-referral-icon {
  color: var(--w-sage);
  background-color: rgba(123, 164, 101, 0.12);
}
body.platform-web .profile-content .profile-referral-card .profile-referral-icon ion-icon,
body.platform-web .profile-content .profile-referral-card .profile-referral-title ion-icon {
  color: var(--w-sage) !important;
  opacity: 1;
}
body.platform-web .profile-content .profile-referral-card ion-card-title {
  color: var(--w-text);
  font-size: 19px;
  font-weight: 700;
}
body.platform-web .profile-content .profile-referral-card .profile-referral-link {
  color: var(--w-muted);
  font-size: 13px;
  font-weight: 600;
}
body.platform-web .profile-content .profile-referral-card .profile-referral-code {
  display: flex;
  flex-direction: column;
  gap: 6px;
  align-items: center;
  padding: 20px;
  margin-bottom: 16px;
  background: var(--w-canvas);
  border: 1px solid var(--w-border);
  border-radius: 12px;
  text-align: center;
}
body.platform-web .profile-content .profile-referral-card .profile-referral-label {
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  color: var(--w-muted);
}
body.platform-web .profile-content .profile-referral-card .profile-referral-value {
  font-family:
    "SF Mono",
    "Cascadia Code",
    "Roboto Mono",
    monospace;
  font-size: 22px;
  font-weight: 700;
  letter-spacing: 2px;
  color: var(--w-sage);
}
body.platform-web .profile-content .profile-menu-list,
body.platform-web .profile-content .profile-notification-list,
body.platform-web .profile-content .profile-actions-list {
  position: relative;
  margin: 0;
  padding: 0;
  background:
    linear-gradient(
      180deg,
      rgba(255, 255, 255, 0.92),
      rgba(249, 252, 247, 0.88)),
    #fff;
  border: 1px solid rgba(101, 132, 82, 0.13);
  border-radius: 22px;
  box-shadow: 0 16px 42px rgba(61, 84, 48, 0.08), inset 0 1px 0 #fff;
  overflow: hidden;
}
body.platform-web .profile-content .profile-menu-list::before,
body.platform-web .profile-content .profile-notification-list::before,
body.platform-web .profile-content .profile-actions-list::before {
  position: absolute;
  z-index: 2;
  top: 0;
  left: 24px;
  width: 88px;
  height: 2px;
  border-radius: 0 0 999px 999px;
  background:
    linear-gradient(
      90deg,
      #7ea563,
      rgba(126, 165, 99, 0));
  content: "";
  pointer-events: none;
}
body.platform-web .profile-content .profile-menu-item,
body.platform-web .profile-content .profile-notification-item,
body.platform-web .profile-content .profile-actions-item {
  --background: transparent;
  --border-color: var(--w-border);
  --padding-start: 20px;
  --inner-padding-end: 20px;
  --min-height: 56px;
}
body.platform-web .profile-content .profile-menu-item:hover,
body.platform-web .profile-content .profile-notification-item:hover,
body.platform-web .profile-content .profile-actions-item:hover {
  --background: var(--w-canvas);
}
body.platform-web .profile-content .profile-menu-item-icon,
body.platform-web .profile-content .profile-actions-icon {
  color: var(--w-sage);
  font-size: 20px;
}
body.platform-web .profile-content .profile-menu-item-arrow,
body.platform-web .profile-content .profile-actions-arrow {
  color: var(--w-muted);
  font-size: 18px;
}
body.platform-web .profile-content .profile-actions-icon--danger,
body.platform-web .profile-content .profile-actions-label--danger,
body.platform-web .profile-content .profile-actions-arrow--danger {
  color: var(--w-pink);
}
body.platform-web .profile-content .profile-switch-btn {
  --background: var(--w-card);
  --background-hover: var(--w-canvas);
  --color: var(--w-sage);
  --border-radius: 10px;
  --box-shadow: none;
  --border-width: 1px;
  --border-style: solid;
  --border-color: var(--w-sage);
  font-weight: 700;
}
body.platform-web .profile-content .profile-version {
  color: var(--w-muted);
  font-size: 13px;
  text-align: center;
}
@media (width < 768px) {
  body.platform-web .profile-content .profile-web-stats {
    max-width: 420px;
    margin: 0 auto;
  }
}
body.platform-web.dark .profile-content {
  --background:
    radial-gradient(
      
      circle at 12% 0%,
      color-mix(in srgb, var(--ion-color-primary) 15%, transparent),
      transparent 34rem ),
    linear-gradient(
      180deg,
      #111a15 0%,
      #0b100d 56%,
      #080b09 100%);
}
body.platform-web.dark .profile-content::part(scroll) {
  background:
    radial-gradient(
      circle at 12% 0%,
      color-mix(in srgb, var(--ion-color-primary) 15%, transparent),
      transparent 34rem),
    linear-gradient(
      180deg,
      #111a15 0%,
      #0b100d 56%,
      #080b09 100%);
}
body.platform-web.dark .profile-content .profile-web-identity-card,
body.platform-web.dark .profile-content .profile-web-stat,
body.platform-web.dark .profile-content .profile-card,
body.platform-web.dark .profile-content .profile-premium-card,
body.platform-web.dark .profile-content .profile-referral-card,
body.platform-web.dark .profile-content .profile-menu-list,
body.platform-web.dark .profile-content .profile-notification-list,
body.platform-web.dark .profile-content .profile-actions-list {
  --background:
    linear-gradient(
      180deg,
      rgb(168 207 143 / 5%),
      transparent 54%),
    #0f1612;
  background:
    linear-gradient(
      180deg,
      rgba(168, 207, 143, 0.05),
      transparent 54%),
    #0f1612 !important;
  border-color: rgba(205, 226, 210, 0.11);
  box-shadow: 0 18px 46px rgba(0, 0, 0, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.03);
}
body.platform-web.dark .profile-content .profile-web-identity-card::before,
body.platform-web.dark .profile-content .profile-web-stat::before,
body.platform-web.dark .profile-content .profile-card::before,
body.platform-web.dark .profile-content .profile-premium-card::before,
body.platform-web.dark .profile-content .profile-referral-card::before,
body.platform-web.dark .profile-content .profile-menu-list::before,
body.platform-web.dark .profile-content .profile-notification-list::before,
body.platform-web.dark .profile-content .profile-actions-list::before {
  background:
    linear-gradient(
      90deg,
      #a8cf8f,
      rgba(168, 207, 143, 0));
}
@media (width >= 980px) {
  body.platform-web app-video-player .hide-on-web {
    display: none !important;
  }
}
@media (width >= 980px) {
  body.platform-web .video-page {
    --background: var(--w-canvas);
  }
  body.platform-web .video-page::part(scroll) {
    display: block;
  }
  body.platform-web .video-page .web-layout-wrapper.is-web {
    max-width: var(--w-max);
    margin: 0 auto;
    padding: 40px 24px;
    display: grid;
    grid-template-columns: 1fr 380px;
    gap: 40px;
    align-items: start;
  }
  body.platform-web .video-page .web-back-bar {
    grid-column: 1/-1;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--w-muted);
    font-weight: 600;
    font-size: 15px;
    margin-bottom: 24px;
    cursor: pointer;
    transition: color 0.2s ease;
  }
  body.platform-web .video-page .web-back-bar:hover {
    color: var(--w-sage);
  }
  body.platform-web .video-page .web-back-bar svg {
    width: 20px;
    height: 20px;
  }
  body.platform-web .video-page .video-section {
    background: transparent !important;
    border-radius: var(--w-radius-main);
    overflow: hidden;
    box-shadow: var(--w-shadow-lg);
    margin-bottom: 0;
  }
  body.platform-web .video-page .video-wrapper {
    aspect-ratio: 16/9;
    height: auto !important;
    background: #000;
  }
  body.platform-web .video-page .video-player {
    object-fit: contain;
    width: 100%;
    height: 100%;
  }
  body.platform-web .video-page .sidebar-section {
    display: flex;
    flex-direction: column;
    gap: 24px;
    position: sticky;
    top: 40px;
  }
  body.platform-web .video-page .content-section {
    padding: 0;
  }
  body.platform-web .video-page .content-card {
    background: var(--w-card);
    border-radius: var(--w-radius-card);
    box-shadow: var(--w-shadow-md);
    padding: 32px;
    border: 1px solid var(--w-border);
    display: flex;
    flex-direction: column;
  }
  body.platform-web .video-page .section-label {
    font-size: 13px;
    font-weight: 600;
    color: var(--w-muted);
    letter-spacing: 1px;
    text-transform: uppercase;
  }
  body.platform-web .video-page .course-title {
    font-size: 26px;
    font-weight: 800;
    color: var(--w-text);
    margin: 8px 0 24px;
    line-height: 1.2;
  }
  body.platform-web .video-page .meta-row {
    gap: 24px;
    margin-bottom: 32px;
  }
  body.platform-web .video-page .meta-item {
    font-size: 15px;
    color: var(--w-muted);
    font-weight: 500;
    gap: 8px;
  }
  body.platform-web .video-page .meta-item svg {
    width: 20px;
    height: 20px;
  }
  body.platform-web .video-page .meta-dot {
    background-color: var(--w-border);
    width: 6px;
    height: 6px;
  }
  body.platform-web .video-page .action-row {
    margin-top: auto;
  }
  body.platform-web .video-page ion-button {
    --border-radius: 8px;
    height: 48px;
    font-weight: 700;
    font-size: 16px;
    transition: var(--transition-bounce);
  }
  body.platform-web .video-page ion-button:hover {
    transform: translateY(-2px);
  }
  body.platform-web .video-page .btn-complete {
    --background: var(--w-muted);
    opacity: 0.8;
  }
  body.platform-web .video-page .btn-incomplete {
    --background: var(--w-sage);
    --box-shadow: 0 4px 12px rgb(123 164 101 / 30%);
  }
  body.platform-web .video-page .btn-incomplete:hover {
    --background: var(--w-sage-hover);
  }
  body.platform-web .video-page .content-divider {
    display: none;
  }
  body.platform-web .video-page app-lesson-navigation {
    width: 100%;
  }
  body.platform-web .video-page app-lesson-navigation ion-footer {
    position: static;
    background: transparent;
    border: none;
  }
  body.platform-web .video-page app-lesson-navigation .footer-nav {
    display: flex;
    gap: 16px;
    padding: 0;
    background: transparent;
  }
  body.platform-web .video-page app-lesson-navigation .footer-nav ion-button {
    flex: 1;
    margin: 0;
    --border-radius: 8px;
    --border-width: 2px;
    --border-color: var(--w-sage);
    --color: var(--w-sage);
    height: 44px;
  }
  body.platform-web .video-page app-lesson-navigation .footer-nav ion-button:disabled {
    --border-color: var(--w-border);
    --color: var(--w-muted);
  }
  body.platform-web .video-page app-lesson-navigation .footer-nav ion-button:not(:disabled):hover {
    --background: rgb(123 164 101 / 5%);
  }
}
@media (width >= 768px) {
  body.platform-web .learning-content app-banner-carousel,
  body.platform-web .learning-content app-category-list,
  body.platform-web .learning-content .learning-sections,
  body.platform-web .learning-content app-paginated-list {
    display: block;
    width: 100%;
    max-width: var(--w-max);
    margin-right: auto;
    margin-left: auto;
    padding-left: 24px;
    padding-right: 24px;
  }
  body.platform-web .learning-content {
    --padding-start: 0;
    --padding-end: 0;
  }
}
body.platform-web .learning-content .courses,
body.platform-web .learning-content .recommended-courses {
  display: grid !important;
  grid-template-columns: repeat(2, 1fr) !important;
  align-items: stretch;
  gap: 16px;
  padding: 0;
}
@media (width >= 980px) {
  body.platform-web .learning-content .courses,
  body.platform-web .learning-content .recommended-courses {
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 24px;
  }
}
body.platform-web .learning-content app-course-card .course-card {
  height: 100%;
  display: flex;
  flex-direction: column;
}
body.platform-web .learning-content app-course-card .course-card .card-wrapper {
  flex-direction: column !important;
  height: 100%;
}
body.platform-web .learning-content app-course-card .course-card .card-image {
  position: relative;
  isolation: isolate;
  width: 100% !important;
  min-width: 0 !important;
  height: auto;
  aspect-ratio: 16/9;
  padding: 0 !important;
  flex-shrink: 0;
  overflow: hidden;
  background: transparent !important;
}
body.platform-web .learning-content app-course-card .course-card .card-image .image-blur-backdrop {
  position: absolute;
  z-index: 0;
  inset: -18px;
  width: calc(100% + 36px);
  height: calc(100% + 36px);
  object-fit: cover !important;
  filter: blur(18px) saturate(1.12);
  opacity: 0.95;
  pointer-events: none;
}
body.platform-web .learning-content app-course-card .course-card .card-image app-image-preview,
body.platform-web .learning-content app-course-card .course-card .card-image .course-image {
  position: relative;
  z-index: 1;
  display: block;
  height: 100%;
  border-radius: 14px !important;
  background: transparent !important;
}
body.platform-web .learning-content app-course-card .course-card .card-image .image-preview-container {
  background: transparent !important;
}
body.platform-web .learning-content app-course-card .course-card .card-image .course-image::part(image) {
  position: relative;
  z-index: 1;
  width: 100%;
  height: 100%;
  object-fit: contain !important;
  --object-fit: contain !important;
  object-position: center center !important;
  border-radius: 14px !important;
  background: transparent !important;
}
body.platform-web .learning-content app-course-card .course-card .card-content {
  gap: 12px;
  padding: 16px !important;
  flex: 1;
  display: flex;
  flex-direction: column;
  min-height: 0;
}
body.platform-web .learning-content app-course-card .course-card .card-content .card-body {
  flex: 1;
}
body.platform-web .learning-content app-course-card .course-card .card-content .content-header {
  min-height: 24px;
}
body.platform-web .learning-content app-course-card .course-card .card-content .course-title {
  min-height: 48px;
}
body.platform-web .learning-content app-course-card .course-card .card-content .course-instructor {
  min-height: 18px;
}
body.platform-web .learning-content app-course-card .course-card .card-content .course-stats {
  min-height: 18px;
}
body.platform-web .learning-content app-course-card .course-card .card-content .card-footer {
  min-height: 74px;
}
body.platform-web .learning-content app-course-card .course-card .card-content .progress-container {
  min-height: 32px;
}
body.platform-web .learning-content app-course-card .course-card .card-content .start-button {
  margin-top: auto;
  width: 100% !important;
}
body.platform-web .learning-content app-course-card {
  display: flex;
  height: 100%;
  min-height: 100%;
}
body.platform-web .learning-content app-course-card .course-card,
body.platform-web .learning-content app-last-played-course .last-played-card {
  background: var(--w-card);
  border: 1px solid var(--w-border);
  border-radius: var(--w-radius-card);
  box-shadow: 0 8px 22px rgba(123, 164, 101, 0.06) !important;
  transition:
    transform 0.25s ease,
    border-color 0.25s ease,
    box-shadow 0.25s ease;
}
body.platform-web .learning-content app-course-card .course-card:hover,
body.platform-web .learning-content app-last-played-course .last-played-card:hover {
  transform: translateY(-4px);
  border-color: var(--w-sage);
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.06) !important;
}
body.platform-web .learning-content app-course-card .current-price {
  color: var(--w-pink-strong);
  font-weight: 800;
}
body.platform-web .learning-content app-course-card .course-card:focus-visible,
body.platform-web .learning-content app-last-played-course .last-played-card:focus-visible {
  outline: 3px solid var(--w-sage);
  outline-offset: 2px;
}
body.platform-web .learning-header,
body.platform-web .lrn-listing-header,
body.platform-web .search-course-header,
body.platform-web .shop-header,
body.platform-web .section-products-header {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  max-width: var(--w-max);
  margin: 24px auto 0;
  padding: 0;
}
@media (width >= 768px) {
  body.platform-web .learning-header,
  body.platform-web .lrn-listing-header,
  body.platform-web .search-course-header,
  body.platform-web .shop-header,
  body.platform-web .section-products-header {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    padding: 0 24px;
    margin-bottom: 24px;
  }
}
body.platform-web .learning-header,
body.platform-web .learning-header ion-header,
body.platform-web .learning-header ion-toolbar,
body.platform-web .learning-header app-header-search,
body.platform-web .lrn-listing-header,
body.platform-web .lrn-listing-header ion-header,
body.platform-web .lrn-listing-header ion-toolbar,
body.platform-web .lrn-listing-header app-header-search,
body.platform-web .search-course-header,
body.platform-web .search-course-header ion-header,
body.platform-web .search-course-header ion-toolbar,
body.platform-web .search-course-header app-header-search,
body.platform-web .shop-header,
body.platform-web .shop-header ion-header,
body.platform-web .shop-header ion-toolbar,
body.platform-web .shop-header app-header-search,
body.platform-web .section-products-header,
body.platform-web .section-products-header ion-header,
body.platform-web .section-products-header ion-toolbar,
body.platform-web .section-products-header app-header-search {
  --background: var(--w-canvas) !important;
  background: var(--w-canvas) !important;
  box-shadow: none !important;
  --border-width: 0;
}
body.platform-web .learning-header ion-header,
body.platform-web .lrn-listing-header ion-header,
body.platform-web .search-course-header ion-header,
body.platform-web .shop-header ion-header,
body.platform-web .section-products-header ion-header {
  position: static !important;
  display: contents !important;
}
body.platform-web .learning-header app-header-toolbar,
body.platform-web .lrn-listing-header app-header-toolbar,
body.platform-web .search-course-header app-header-toolbar,
body.platform-web .shop-header app-header-toolbar,
body.platform-web .section-products-header app-header-toolbar {
  display: block;
  flex: 1;
}
body.platform-web .learning-header app-header-toolbar ion-toolbar,
body.platform-web .lrn-listing-header app-header-toolbar ion-toolbar,
body.platform-web .search-course-header app-header-toolbar ion-toolbar,
body.platform-web .shop-header app-header-toolbar ion-toolbar,
body.platform-web .section-products-header app-header-toolbar ion-toolbar {
  --padding-start: 0;
  --padding-end: 0;
}
body.platform-web .learning-header app-header-toolbar ion-toolbar ion-title,
body.platform-web .lrn-listing-header app-header-toolbar ion-toolbar ion-title,
body.platform-web .search-course-header app-header-toolbar ion-toolbar ion-title,
body.platform-web .shop-header app-header-toolbar ion-toolbar ion-title,
body.platform-web .section-products-header app-header-toolbar ion-toolbar ion-title {
  font-size: 28px !important;
  font-weight: 800 !important;
  color: var(--w-text-dark) !important;
  text-align: left !important;
  padding: 0 24px !important;
}
@media (width >= 768px) {
  body.platform-web .learning-header app-header-toolbar ion-toolbar ion-title,
  body.platform-web .lrn-listing-header app-header-toolbar ion-toolbar ion-title,
  body.platform-web .search-course-header app-header-toolbar ion-toolbar ion-title,
  body.platform-web .shop-header app-header-toolbar ion-toolbar ion-title,
  body.platform-web .section-products-header app-header-toolbar ion-toolbar ion-title {
    padding: 0 !important;
  }
}
body.platform-web .learning-header app-header-toolbar ion-toolbar ion-buttons[slot=start],
body.platform-web .lrn-listing-header app-header-toolbar ion-toolbar ion-buttons[slot=start],
body.platform-web .search-course-header app-header-toolbar ion-toolbar ion-buttons[slot=start],
body.platform-web .shop-header app-header-toolbar ion-toolbar ion-buttons[slot=start],
body.platform-web .section-products-header app-header-toolbar ion-toolbar ion-buttons[slot=start] {
  display: none !important;
}
body.platform-web .learning-header app-header-search,
body.platform-web .lrn-listing-header app-header-search,
body.platform-web .search-course-header app-header-search,
body.platform-web .shop-header app-header-search,
body.platform-web .section-products-header app-header-search {
  display: block;
  width: 100%;
  margin: 0;
  padding: 12px 24px 24px;
  transition: width 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
@media (width >= 768px) {
  body.platform-web .learning-header app-header-search,
  body.platform-web .lrn-listing-header app-header-search,
  body.platform-web .search-course-header app-header-search,
  body.platform-web .shop-header app-header-search,
  body.platform-web .section-products-header app-header-search {
    width: 300px;
    padding: 0;
  }
  body.platform-web .learning-header app-header-search:focus-within,
  body.platform-web .lrn-listing-header app-header-search:focus-within,
  body.platform-web .search-course-header app-header-search:focus-within,
  body.platform-web .shop-header app-header-search:focus-within,
  body.platform-web .section-products-header app-header-search:focus-within {
    width: 380px;
  }
}
body.platform-web .learning-header .search-container,
body.platform-web .lrn-listing-header .search-container,
body.platform-web .search-course-header .search-container,
body.platform-web .shop-header .search-container,
body.platform-web .section-products-header .search-container {
  background: var(--w-card) !important;
  border: 1px solid var(--w-border);
  border-radius: 30px;
  box-shadow: 0 4px 14px rgba(123, 164, 101, 0.06);
  transition: box-shadow 0.3s ease, border-color 0.3s ease;
}
body.platform-web .learning-header .search-container:focus-within,
body.platform-web .lrn-listing-header .search-container:focus-within,
body.platform-web .search-course-header .search-container:focus-within,
body.platform-web .shop-header .search-container:focus-within,
body.platform-web .section-products-header .search-container:focus-within {
  border-color: var(--w-sage);
  box-shadow: 0 6px 20px rgba(123, 164, 101, 0.15);
}
body.platform-web .learning-header .search-container ion-searchbar,
body.platform-web .lrn-listing-header .search-container ion-searchbar,
body.platform-web .search-course-header .search-container ion-searchbar,
body.platform-web .shop-header .search-container ion-searchbar,
body.platform-web .section-products-header .search-container ion-searchbar {
  --background: transparent !important;
  --box-shadow: none !important;
  padding-inline: 8px !important;
}
body.platform-web .category-content {
  --background: var(--w-canvas);
  --padding-start: 0;
  --padding-end: 0;
  --padding-bottom: 0;
}
body.platform-web .category-content::part(scroll) {
  display: flex;
  flex-direction: column;
  min-height: 100%;
  overflow-x: hidden;
}
body.platform-web .category-content app-paginated-list {
  display: block;
  width: 100%;
  max-width: var(--w-max);
  margin-right: auto;
  margin-left: auto;
  padding-left: 24px;
  padding-right: 24px;
}
body.platform-web .category-content .courses-grid {
  display: grid !important;
  grid-template-columns: repeat(2, 1fr) !important;
  gap: 16px;
  padding: 0 0 40px;
}
@media (width >= 980px) {
  body.platform-web .category-content .courses-grid {
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 24px;
  }
}
body.platform-web .category-content app-course-card .course-card {
  height: 100%;
  display: flex;
  flex-direction: column;
  background: var(--w-card);
  border: 1px solid var(--w-border);
  border-radius: var(--w-radius-card);
  box-shadow: 0 8px 22px rgba(123, 164, 101, 0.06) !important;
  transition:
    transform 0.25s ease,
    border-color 0.25s ease,
    box-shadow 0.25s ease;
}
body.platform-web .category-content app-course-card .course-card:hover {
  transform: translateY(-4px);
  border-color: var(--w-sage);
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.06) !important;
}
body.platform-web .category-content app-course-card .course-card .card-wrapper {
  flex-direction: column !important;
  height: 100%;
}
body.platform-web .category-content app-course-card .course-card .card-image {
  width: 100% !important;
  min-width: 0 !important;
  height: auto;
  aspect-ratio: 16/10;
  padding: 0 !important;
  flex-shrink: 0;
}
body.platform-web .category-content app-course-card .course-card .card-image app-image-preview {
  border-radius: var(--w-radius-card) var(--w-radius-card) 0 0 !important;
}
body.platform-web .category-content app-course-card .course-card .card-image .course-image::part(image) {
  border-radius: var(--w-radius-card) var(--w-radius-card) 0 0 !important;
}
body.platform-web .category-content app-course-card .course-card .card-content {
  padding: 16px !important;
  flex: 1;
  display: flex;
  flex-direction: column;
}
body.platform-web .category-content app-course-card .course-card .card-content .start-button {
  margin-top: auto;
  width: 100% !important;
}
body.platform-web .category-content app-course-card .course-card .current-price {
  color: var(--w-pink-strong);
  font-weight: 800;
}
body.platform-web .category-content app-course-card .course-card:focus-visible {
  outline: 3px solid var(--w-sage);
  outline-offset: 2px;
}
body.platform-web .category-content app-site-footer {
  display: block;
  width: 100vw !important;
  max-width: 100vw !important;
  position: relative !important;
  left: 50% !important;
  right: 50% !important;
  margin-left: -50vw !important;
  margin-right: -50vw !important;
  margin-top: auto;
  box-sizing: border-box;
}
body.platform-web .category-content app-site-footer .site-footer {
  margin-top: 0;
  width: 100% !important;
  background: #111 !important;
}
body.platform-web .search-content {
  --background: var(--w-canvas);
}
body.platform-web .search-content app-scrollable-tabs,
body.platform-web .search-content .search-results-title,
body.platform-web .search-content .active-filters-section {
  margin-bottom: 24px;
}
body.platform-web .search-content app-paginated-list {
  display: block;
  width: 100%;
  max-width: var(--w-max);
  margin-right: auto;
  margin-left: auto;
  padding-left: 24px;
  padding-right: 24px;
}
body.platform-web .search-content .courses-grid {
  display: grid !important;
  grid-template-columns: repeat(2, 1fr) !important;
  gap: 16px;
  padding: 0 0 40px;
}
@media (width >= 980px) {
  body.platform-web .search-content .courses-grid {
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 24px;
  }
}
body.platform-web .search-content app-course-card {
  display: flex;
  height: 100%;
  min-height: 100%;
}
body.platform-web .search-content app-course-card .course-card {
  height: 100%;
  display: flex;
  flex-direction: column;
  background: var(--w-card);
  border: 1px solid var(--w-border);
  border-radius: var(--w-radius-card);
  box-shadow: 0 8px 22px rgba(123, 164, 101, 0.06) !important;
  transition:
    transform 0.25s ease,
    border-color 0.25s ease,
    box-shadow 0.25s ease;
}
body.platform-web .search-content app-course-card .course-card:hover {
  transform: translateY(-4px);
  border-color: var(--w-sage);
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.06) !important;
}
body.platform-web .search-content app-course-card .course-card .card-wrapper {
  flex-direction: column !important;
  height: 100%;
}
body.platform-web .search-content app-course-card .course-card .card-image {
  width: 100% !important;
  min-width: 0 !important;
  height: auto;
  aspect-ratio: 16/9;
  padding: 0 !important;
  flex-shrink: 0;
}
body.platform-web .search-content app-course-card .course-card .card-image app-image-preview {
  display: block;
  height: 100%;
  border-radius: var(--w-radius-card) var(--w-radius-card) 0 0 !important;
}
body.platform-web .search-content app-course-card .course-card .card-image .course-image::part(image) {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: var(--w-radius-card) var(--w-radius-card) 0 0 !important;
}
body.platform-web .search-content app-course-card .course-card .card-content {
  gap: 12px;
  padding: 16px !important;
  flex: 1;
  display: flex;
  flex-direction: column;
  min-height: 0;
}
body.platform-web .search-content app-course-card .course-card .card-content .card-body {
  flex: 1;
}
body.platform-web .search-content app-course-card .course-card .card-content .content-header {
  min-height: 24px;
}
body.platform-web .search-content app-course-card .course-card .card-content .course-title {
  min-height: 48px;
}
body.platform-web .search-content app-course-card .course-card .card-content .course-instructor {
  min-height: 18px;
}
body.platform-web .search-content app-course-card .course-card .card-content .course-stats {
  min-height: 18px;
}
body.platform-web .search-content app-course-card .course-card .card-content .card-footer {
  min-height: 74px;
}
body.platform-web .search-content app-course-card .course-card .card-content .progress-container {
  min-height: 32px;
}
body.platform-web .search-content app-course-card .course-card .card-content .start-button {
  margin-top: auto;
  width: 100% !important;
}
body.platform-web .search-content app-course-card .course-card .current-price {
  color: var(--w-pink-strong);
  font-weight: 800;
}
body.platform-web .search-content app-course-card .course-card:focus-visible {
  outline: 3px solid var(--w-sage);
  outline-offset: 2px;
}
body.platform-web .find-doctor-content--web {
  --background: var(--w-canvas);
  --padding-start: 0;
  --padding-end: 0;
  --padding-bottom: 0;
}
body.platform-web .find-doctor-content--web::part(scroll) {
  display: flex;
  flex-direction: column;
  min-height: 100%;
  overflow-x: hidden;
}
body.platform-web .find-doctor-content--web .find-doctor-web-shell {
  display: flex;
  flex-direction: column;
  flex: 1 0 auto;
  width: 100%;
  max-width: var(--w-max);
  margin: 0 auto;
  padding: 18px 24px 0;
}
body.platform-web .find-doctor-content--web .find-doctor-web-top {
  display: grid;
  grid-template-columns: 56px 1fr 56px;
  align-items: center;
  margin-bottom: 18px;
}
body.platform-web .find-doctor-content--web .find-doctor-web-back {
  --background: var(--w-card);
  --background-hover: var(--w-hover, #f5f8f2);
  --background-focused: var(--w-hover, #f5f8f2);
  --background-activated: var(--w-hover, #f5f8f2);
  --border-color: var(--w-border);
  --border-radius: 50%;
  --border-style: solid;
  --border-width: 1px;
  --box-shadow: var(--w-shadow-sm);
  --color: var(--w-text);
  --padding-start: 0;
  --padding-end: 0;
  width: 44px;
  height: 44px;
  min-height: 44px;
  margin: 0;
  justify-self: start;
  transition:
    border-color 180ms ease,
    background 180ms ease,
    transform 180ms ease,
    box-shadow 180ms ease;
}
body.platform-web .find-doctor-content--web .find-doctor-web-back ion-icon {
  color: inherit;
  font-size: 22px;
}
body.platform-web .find-doctor-content--web .find-doctor-web-back:hover {
  --border-color: color-mix(in srgb, var(--w-sage) 45%, var(--w-border));
  --box-shadow: var(--w-shadow-md);
  transform: translateX(-2px);
}
body.platform-web .find-doctor-content--web .find-doctor-web-back:focus-visible {
  outline: 3px solid rgba(123, 164, 101, 0.22);
  outline-offset: 2px;
}
body.platform-web .find-doctor-content--web .find-doctor-web-top-spacer {
  width: 56px;
  height: 40px;
  justify-self: end;
}
body.platform-web .find-doctor-content--web .find-doctor-web-title {
  margin: 0;
  font-family: var(--font-subheading);
  font-size: 28px;
  font-weight: 700;
  line-height: 1.15;
  color: var(--w-text-dark);
  text-align: center;
}
body.platform-web .find-doctor-content--web .find-doctor-web-search {
  background: transparent;
  padding: 0;
  margin-bottom: 22px;
}
body.platform-web .find-doctor-content--web .find-doctor-web-search app-header-search.find-doctor-search {
  display: block;
  width: 100%;
}
body.platform-web .find-doctor-content--web .find-doctor-web-search app-header-search.find-doctor-search .search-container {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  min-height: 62px;
  padding: 6px 8px 6px 10px;
  background: var(--w-card);
  border: 1px solid var(--w-border);
  border-radius: 18px;
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.26);
}
body.platform-web .find-doctor-content--web .find-doctor-web-search app-header-search.find-doctor-search ion-searchbar {
  flex: 1;
  min-height: 48px;
  height: 48px;
  padding: 0;
  --background: var(--w-hover);
  --box-shadow: none;
  --border-radius: 14px;
  --color: var(--w-text);
  --icon-color: var(--w-sage);
  --placeholder-color: var(--w-muted);
  --placeholder-opacity: 1;
}
body.platform-web .find-doctor-content--web .find-doctor-web-search app-header-search.find-doctor-search app-header-filter-button .filter-btn {
  --background: var(--w-hover);
  --background-hover: var(--w-card);
  --background-activated: var(--w-card);
  --border-color: var(--w-border);
  --border-radius: 14px;
  --border-style: solid;
  --border-width: 1px;
  --color: var(--w-text);
  --padding-start: 14px;
  --padding-end: 14px;
  min-width: 102px;
  height: 48px;
  margin: 0;
  box-shadow: none;
}
body.platform-web .find-doctor-content--web .find-doctor-web-search app-header-search.find-doctor-search app-header-filter-button .filter-btn ion-icon {
  color: var(--w-sage);
  margin-right: 7px;
}
body.platform-web .find-doctor-content--web .find-doctor-web-search app-header-search.find-doctor-search app-header-filter-button .filter-btn.has-filters {
  --background: rgb(123 164 101 / 12%);
  --border-color: var(--w-sage);
}
body.platform-web .find-doctor-content--web .find-doctor-web-search .custom-searchbar {
  width: 100%;
  max-width: none;
  height: 56px;
  padding: 0;
  --background: #fff;
  --box-shadow: 0 6px 18px rgb(0 0 0 / 8%);
  --border-radius: 999px;
  --color: var(--w-text);
  --icon-color: var(--w-sage);
  --placeholder-color: var(--w-muted);
}
body.platform-web .find-doctor-content--web .find-doctor-sections--web {
  display: flex;
  flex-direction: column;
  gap: 24px;
}
body.platform-web .find-doctor-content--web .find-doctor-quick-links-skeleton-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, max-content));
  gap: 10px;
  overflow-x: auto;
  padding-bottom: 2px;
  scrollbar-width: none;
}
body.platform-web .find-doctor-content--web .find-doctor-quick-links-skeleton-grid::-webkit-scrollbar {
  display: none;
}
body.platform-web .find-doctor-content--web .find-doctor-quick-links-skeleton-grid app-quick-links-category-skeleton .quick-links-category-skeleton {
  flex-direction: row;
  justify-content: center;
  gap: 10px;
  min-height: 42px;
  min-width: 120px;
  padding: 10px 18px;
  background: var(--w-card);
  border: 1px solid var(--w-border);
  border-radius: 999px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.04);
}
body.platform-web .find-doctor-content--web .find-doctor-quick-links-skeleton-grid app-quick-links-category-skeleton .quick-links-category-skeleton__icon {
  width: 0.95rem;
  height: 0.95rem;
  flex-shrink: 0;
}
body.platform-web .find-doctor-content--web .find-doctor-quick-links-skeleton-grid app-quick-links-category-skeleton .quick-links-category-skeleton__label {
  width: 56px;
  height: 0.75rem;
}
body.platform-web .find-doctor-content--web app-quick-links {
  display: block;
  width: 100%;
}
body.platform-web .find-doctor-content--web app-quick-links .quick-links-card-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: center;
  margin: 0;
  gap: 10px;
  max-height: 48px;
  overflow: hidden;
  padding: 2px;
}
body.platform-web .find-doctor-content--web app-quick-links.quick-links--expanded .quick-links-card-list {
  max-height: none;
  overflow: visible;
}
body.platform-web .find-doctor-content--web app-quick-links .quick-links-card-item {
  width: auto;
  min-height: 44px;
  padding: 12px 20px;
  background: var(--w-card);
  border: 1px solid var(--w-border);
  border-radius: 999px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.04);
  flex: 0 0 auto;
  min-width: fit-content;
  gap: 0;
}
body.platform-web .find-doctor-content--web app-quick-links .quick-links-card-item.active {
  background: #e56a82;
  border-color: #e56a82;
  box-shadow: 0 8px 18px rgba(229, 106, 130, 0.18);
}
body.platform-web .find-doctor-content--web app-quick-links .quick-links-card-icon {
  display: none;
}
body.platform-web .find-doctor-content--web app-quick-links .quick-links-card-label {
  font-size: 14px;
  font-weight: 700;
  color: var(--w-text-dark);
  line-height: 1;
}
body.platform-web .find-doctor-content--web app-quick-links .quick-links-card-item.active .quick-links-card-label {
  color: #fff;
}
body.platform-web .find-doctor-content--web app-quick-links .quick-links-see-more-container {
  margin: 14px 0 0;
  display: flex;
  justify-content: center;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}
body.platform-web .find-doctor-content--web app-quick-links .quick-links-see-more-btn {
  --background: var(--w-sage, #7ba465);
  --background-hover: var(--w-sage-hover, #678e53);
  --background-activated: var(--w-sage-hover, #678e53);
  --color: #fff;
  --border-radius: 999px;
  --border-style: none;
  --border-width: 0;
  --box-shadow: none;
  --padding-start: 22px;
  --padding-end: 22px;
  background: transparent !important;
  border-radius: 999px !important;
  overflow: hidden !important;
  box-shadow: none !important;
  border: none !important;
  outline: none !important;
  min-height: 38px;
  height: 38px;
  font-size: 14px;
  font-weight: 600;
}
body.platform-web .find-doctor-content--web app-quick-links .quick-links-see-more-btn ion-icon {
  font-size: 16px;
  margin-left: 6px;
  color: #fff;
}
body.platform-web .find-doctor-content--web .find-doctor-location-bar--web,
body.platform-web .find-doctor-content--web .find-doctor-results-panel,
body.platform-web .find-doctor-content--web .find-doctor-help-card--web {
  position: relative;
  overflow: hidden;
  padding: 24px;
  border: 1px solid rgba(101, 132, 82, 0.13);
  border-radius: 22px;
  background:
    linear-gradient(
      180deg,
      rgba(255, 255, 255, 0.92),
      rgba(249, 252, 247, 0.88)),
    #fff;
  box-shadow: 0 16px 42px rgba(61, 84, 48, 0.08), inset 0 1px 0 #fff;
}
body.platform-web .find-doctor-content--web .find-doctor-location-bar--web::before,
body.platform-web .find-doctor-content--web .find-doctor-results-panel::before,
body.platform-web .find-doctor-content--web .find-doctor-help-card--web::before {
  position: absolute;
  top: 0;
  left: 24px;
  width: 88px;
  height: 2px;
  border-radius: 0 0 999px 999px;
  background:
    linear-gradient(
      90deg,
      #7ea563,
      rgba(126, 165, 99, 0));
  content: "";
}
body.platform-web .find-doctor-content--web .find-doctor-location-bar--web {
  margin-top: 0;
}
body.platform-web .find-doctor-content--web .find-doctor-location-bar--web .location-icon {
  color: var(--w-sage);
  font-size: 28px;
}
body.platform-web .find-doctor-content--web .find-doctor-location-bar--web .location-title {
  font-size: 18px;
  font-weight: 700;
  color: var(--w-text-dark);
}
body.platform-web .find-doctor-content--web .find-doctor-location-bar--web .location-address {
  color: var(--w-muted);
  font-size: 14px;
}
body.platform-web .find-doctor-content--web app-paginated-list {
  display: block;
  width: 100%;
  max-width: var(--w-max);
  margin-right: auto;
  margin-left: auto;
}
body.platform-web .find-doctor-content--web .find-doctor-results-panel app-paginated-list {
  max-width: none;
  margin: 0;
}
body.platform-web .find-doctor-content--web .doctors-list--web {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
  padding: 0;
}
@media (width >= 768px) and (width <= 1023px) {
  body.platform-web .find-doctor-content--web .doctors-list--web {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (width < 768px) {
  body.platform-web .find-doctor-content--web .find-doctor-web-shell {
    padding-inline: 16px;
  }
  body.platform-web .find-doctor-content--web .doctors-list--web {
    grid-template-columns: minmax(0, 1fr);
    gap: 16px;
  }
}
body.platform-web .find-doctor-content--web app-doctor-card {
  display: block;
  width: 100%;
  height: 100%;
}
body.platform-web .find-doctor-content--web app-doctor-card .doctor-card {
  height: 100%;
  align-items: center;
  padding: 18px 20px;
  gap: 16px;
  background: var(--w-card);
  border: 1px solid var(--w-border);
  border-radius: 20px;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.04);
}
body.platform-web .find-doctor-content--web app-doctor-card .doctor-photo {
  width: 72px;
  height: 72px;
  order: 1;
}
body.platform-web .find-doctor-content--web app-doctor-card .doctor-info {
  order: 2;
  gap: 6px;
  flex: 1 1 0%;
  min-width: 0;
  visibility: visible;
  opacity: 1;
}
body.platform-web .find-doctor-content--web app-doctor-card .doctor-arrow {
  display: none;
}
body.platform-web .find-doctor-content--web app-doctor-card .doctor-name {
  font-size: 18px;
  font-weight: 700;
  word-break: normal;
  overflow-wrap: break-word;
}
body.platform-web .find-doctor-content--web app-doctor-card .doctor-specialty {
  font-size: 14px;
  word-break: normal;
  overflow-wrap: break-word;
}
@media (width < 768px) {
  body.platform-web .find-doctor-content--web .find-doctor-location-bar--web,
  body.platform-web .find-doctor-content--web .find-doctor-results-panel,
  body.platform-web .find-doctor-content--web .find-doctor-help-card--web {
    padding: 14px 12px;
    border-radius: 16px;
  }
  body.platform-web .find-doctor-content--web .find-doctor-web-shell {
    padding-inline: 12px;
  }
  body.platform-web .find-doctor-content--web app-doctor-card {
    height: auto;
    min-width: 0;
  }
  body.platform-web .find-doctor-content--web app-doctor-card .doctor-card {
    display: flex;
    width: 100%;
    min-width: 0;
    min-height: auto;
    height: auto;
    padding: 12px 14px;
    gap: 12px;
    overflow: visible;
    visibility: visible;
    opacity: 1;
  }
  body.platform-web .find-doctor-content--web app-doctor-card .doctor-photo {
    display: flex;
    width: 60px;
    height: 60px;
  }
  body.platform-web .find-doctor-content--web app-doctor-card .doctor-info {
    display: flex;
    flex: 1 1 0%;
    min-width: 0;
  }
}
@media (width <= 360px) {
  body.platform-web .find-doctor-content--web .find-doctor-web-shell {
    padding-inline: 8px;
  }
  body.platform-web .find-doctor-content--web .find-doctor-location-bar--web,
  body.platform-web .find-doctor-content--web .find-doctor-results-panel,
  body.platform-web .find-doctor-content--web .find-doctor-help-card--web {
    padding: 10px 8px;
  }
  body.platform-web .find-doctor-content--web app-doctor-card .doctor-card {
    padding: 10px 8px;
    gap: 10px;
  }
  body.platform-web .find-doctor-content--web app-doctor-card .doctor-photo {
    width: 52px;
    height: 52px;
  }
}
body.platform-web .find-doctor-content--web app-doctor-card .doctor-detail span {
  font-size: 13px;
}
body.platform-web .find-doctor-content--web app-doctor-card .doctor-distance {
  color: var(--w-sage);
  font-size: 14px;
}
body.platform-web .find-doctor-content--web app-doctor-card .availability-badge {
  margin-top: 2px;
  max-width: 100%;
  white-space: normal;
  height: auto;
  text-align: left;
  line-height: 1.35;
}
body.platform-web .find-doctor-content--web app-doctor-card-skeleton {
  display: block;
  width: 100%;
  height: 100%;
}
body.platform-web .find-doctor-content--web app-doctor-card-skeleton .doctor-card-skeleton {
  height: 100%;
  background: var(--w-card);
  border: 1px solid var(--w-border);
  border-radius: 20px;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.04);
}
body.platform-web .find-doctor-content--web app-doctor-card-skeleton .doctor-card-skeleton__content {
  padding: 18px 20px;
}
body.platform-web .find-doctor-content--web .find-doctor-help-card--web {
  margin-top: 0;
}
body.platform-web .find-doctor-content--web .find-doctor-help-card--web .help-card__content {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}
body.platform-web .find-doctor-content--web .find-doctor-help-card--web .help-card__copy {
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-width: 0;
  flex: 1 1 auto;
}
body.platform-web .find-doctor-content--web .find-doctor-help-card--web .help-title {
  margin: 0;
  font-size: 18px;
  line-height: 1.2;
}
body.platform-web .find-doctor-content--web .find-doctor-help-card--web .help-description {
  margin: 0;
  max-width: 640px;
  color: var(--w-muted);
}
body.platform-web .find-doctor-content--web .find-doctor-help-card--web .help-btn {
  --background:
    linear-gradient(
      135deg,
      #ee9aac 0%,
      #df7690 100%);
  --background-hover:
    linear-gradient(
      135deg,
      #f3a8b8 0%,
      #e5869d 100%);
  --background-activated: #d86c86;
  --color: #fff;
  --border-color: rgb(255 255 255 / 42%);
  --border-style: solid;
  --border-width: 1px;
  --border-radius: 999px;
  --padding-start: 24px;
  --padding-end: 24px;
  --padding-top: 0;
  --padding-bottom: 0;
  --box-shadow: 0 12px 24px rgb(223 118 144 / 28%);
  flex: 0 0 auto;
  min-height: 50px;
  min-width: 228px;
  margin: 0;
  font-size: 15px;
  font-weight: 600;
  letter-spacing: 0.01em;
}
body.platform-web .find-doctor-content--web .find-doctor-help-card--web .help-btn span,
body.platform-web .find-doctor-content--web .find-doctor-help-card--web .help-btn ion-icon {
  color: #fff;
}
body.platform-web .find-doctor-content--web .find-doctor-help-card--web .help-btn ion-icon {
  margin-right: 9px;
  font-size: 18px;
}
@media (width < 768px) {
  body.platform-web .find-doctor-content--web .find-doctor-help-card--web {
    padding: 20px;
  }
  body.platform-web .find-doctor-content--web .find-doctor-help-card--web .help-card__content {
    flex-direction: column;
    align-items: stretch;
    gap: 18px;
  }
  body.platform-web .find-doctor-content--web .find-doctor-help-card--web .help-card__copy {
    width: 100%;
    min-width: 0;
  }
  body.platform-web .find-doctor-content--web .find-doctor-help-card--web .help-title,
  body.platform-web .find-doctor-content--web .find-doctor-help-card--web .help-description {
    width: 100%;
    min-width: 0;
    word-break: normal;
    overflow-wrap: break-word;
  }
  body.platform-web .find-doctor-content--web .find-doctor-help-card--web .help-btn {
    width: 100%;
    min-width: 0;
  }
}
body.platform-web .find-doctor-content--web app-site-footer {
  display: block;
  margin-top: auto;
}
body.platform-web .find-doctor-content--web app-site-footer .site-footer {
  margin-top: 0;
}
body.platform-web.dark .find-doctor-content--web {
  --doctor-dark-canvas: #0b100d;
  --doctor-dark-surface: #0f1612;
  --doctor-dark-surface-raised: #0f1612;
  --doctor-dark-surface-hover: #121b15;
  --doctor-dark-border: rgb(194 220 199 / 13%);
  --doctor-dark-border-strong: rgb(168 207 143 / 34%);
  --doctor-dark-text: #eff5f0;
  --doctor-dark-muted: #9ca99f;
  --doctor-dark-accent: #a6ce8e;
  --background:
    radial-gradient(
      
      circle at 12% 0%,
      color-mix(in srgb, var(--ion-color-primary) 15%, transparent),
      transparent 34rem ),
    linear-gradient(
      180deg,
      #111a15 0%,
      #0b100d 56%,
      #080b09 100%);
  color: var(--doctor-dark-text);
}
body.platform-web.dark .find-doctor-content--web::part(scroll) {
  background:
    radial-gradient(
      circle at 12% 0%,
      color-mix(in srgb, var(--ion-color-primary) 15%, transparent),
      transparent 34rem),
    linear-gradient(
      180deg,
      #111a15 0%,
      #0b100d 56%,
      #080b09 100%);
}
body.platform-web.dark .find-doctor-content--web .find-doctor-web-title {
  color: var(--doctor-dark-text);
}
body.platform-web.dark .find-doctor-content--web .find-doctor-web-back {
  --background: var(--doctor-dark-surface-raised);
  --background-hover: var(--doctor-dark-surface-hover);
  --background-focused: var(--doctor-dark-surface-hover);
  --background-activated: var(--doctor-dark-surface-hover);
  --border-color: var(--doctor-dark-border);
  --box-shadow: 0 8px 22px rgb(0 0 0 / 24%);
  --color: var(--doctor-dark-text);
}
body.platform-web.dark .find-doctor-content--web .find-doctor-web-search .custom-searchbar {
  --background: var(--doctor-dark-surface-raised);
  --box-shadow: 0 12px 30px rgb(0 0 0 / 26%);
  --color: var(--doctor-dark-text);
  --icon-color: var(--doctor-dark-accent);
  --placeholder-color: var(--doctor-dark-muted);
  --placeholder-opacity: 1;
  border: 1px solid var(--doctor-dark-border);
  border-radius: 999px;
}
body.platform-web.dark .find-doctor-content--web .find-doctor-web-search app-header-search.find-doctor-search .search-container {
  background:
    linear-gradient(
      180deg,
      rgba(168, 207, 143, 0.05),
      transparent 54%),
    #0f1612;
  border-color: var(--doctor-dark-border);
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.26);
}
body.platform-web.dark .find-doctor-content--web .find-doctor-web-search app-header-search.find-doctor-search ion-searchbar {
  --background: var(--doctor-dark-surface-hover);
  --color: var(--doctor-dark-text);
  --icon-color: var(--doctor-dark-accent);
  --placeholder-color: var(--doctor-dark-muted);
}
body.platform-web.dark .find-doctor-content--web .find-doctor-web-search app-header-search.find-doctor-search app-header-filter-button .filter-btn {
  --background: var(--doctor-dark-surface-hover);
  --background-hover: var(--doctor-dark-surface);
  --background-activated: var(--doctor-dark-surface);
  --border-color: var(--doctor-dark-border-strong);
  --color: var(--doctor-dark-text);
}
body.platform-web.dark .find-doctor-content--web .find-doctor-web-search app-header-search.find-doctor-search app-header-filter-button .filter-btn ion-icon {
  color: var(--doctor-dark-accent);
}
body.platform-web.dark .find-doctor-content--web .find-doctor-web-search app-header-search.find-doctor-search app-header-filter-button .filter-btn.has-filters {
  --background: rgb(172 211 145 / 16%);
  --border-color: var(--doctor-dark-accent);
}
body.platform-web.dark .find-doctor-content--web app-quick-links .quick-links-card-item {
  background:
    linear-gradient(
      180deg,
      rgba(168, 207, 143, 0.05),
      transparent 54%),
    #0f1612;
  border-color: var(--doctor-dark-border);
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.18);
  transition:
    background-color 180ms ease,
    border-color 180ms ease,
    transform 180ms ease;
}
body.platform-web.dark .find-doctor-content--web app-quick-links .quick-links-card-item:hover {
  background: var(--doctor-dark-surface-hover);
  border-color: var(--doctor-dark-border-strong);
  transform: translateY(-1px);
}
body.platform-web.dark .find-doctor-content--web app-quick-links .quick-links-card-label {
  color: var(--doctor-dark-text);
}
body.platform-web.dark .find-doctor-content--web app-quick-links .quick-links-card-item.active {
  background: #d96079;
  border-color: #e77a90;
  box-shadow: 0 10px 24px rgba(217, 96, 121, 0.22);
}
body.platform-web.dark .find-doctor-content--web app-quick-links .quick-links-see-more-btn {
  --background: var(--w-sage, #7ba465);
  --background-hover: var(--w-sage-hover, #678e53);
  --background-activated: var(--w-sage-hover, #678e53);
  --color: #fff;
  --border-style: none;
  --border-width: 0;
  --box-shadow: none;
  background: transparent !important;
  border-radius: 999px !important;
  overflow: hidden !important;
  box-shadow: none !important;
  border: none !important;
  outline: none !important;
}
body.platform-web.dark .find-doctor-content--web app-quick-links .quick-links-see-more-btn ion-icon {
  color: #fff;
}
body.platform-web.dark .find-doctor-content--web .find-doctor-location-bar--web {
  background:
    linear-gradient(
      180deg,
      rgba(168, 207, 143, 0.05),
      transparent 54%),
    #0f1612;
  border-color: rgba(205, 226, 210, 0.11);
  box-shadow: 0 18px 46px rgba(0, 0, 0, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.03);
}
body.platform-web.dark .find-doctor-content--web .find-doctor-location-bar--web::before {
  background:
    linear-gradient(
      90deg,
      #a8cf8f,
      rgba(168, 207, 143, 0));
}
body.platform-web.dark .find-doctor-content--web .find-doctor-location-bar--web .location-icon {
  color: var(--doctor-dark-accent);
}
body.platform-web.dark .find-doctor-content--web .find-doctor-location-bar--web .location-title {
  color: var(--doctor-dark-text);
}
body.platform-web.dark .find-doctor-content--web .find-doctor-location-bar--web .location-address {
  color: var(--doctor-dark-muted);
}
body.platform-web.dark .find-doctor-content--web .find-doctor-location-bar--web .location-edit-btn {
  --background: rgb(166 206 142 / 9%);
  --background-hover: rgb(166 206 142 / 16%);
  --color: var(--doctor-dark-accent);
  border: 1px solid rgba(166, 206, 142, 0.16);
}
body.platform-web.dark .find-doctor-content--web app-doctor-card .doctor-card {
  background:
    linear-gradient(
      180deg,
      rgba(168, 207, 143, 0.05),
      transparent 54%),
    #0f1612;
  border-color: var(--doctor-dark-border);
  box-shadow: 0 14px 32px rgba(0, 0, 0, 0.22);
}
body.platform-web.dark .find-doctor-content--web app-doctor-card .doctor-card:hover {
  background:
    linear-gradient(
      180deg,
      rgba(168, 207, 143, 0.1),
      transparent 54%),
    #121b15;
  border-color: var(--doctor-dark-border-strong);
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.3);
}
body.platform-web.dark .find-doctor-content--web app-doctor-card .doctor-card:focus-visible {
  outline: 3px solid rgba(166, 206, 142, 0.24);
  outline-offset: 2px;
}
body.platform-web.dark .find-doctor-content--web app-doctor-card .doctor-photo {
  background: var(--doctor-dark-surface-hover);
  border: 1px solid var(--doctor-dark-border);
}
body.platform-web.dark .find-doctor-content--web app-doctor-card .doctor-name {
  color: var(--doctor-dark-text);
}
body.platform-web.dark .find-doctor-content--web app-doctor-card .doctor-specialty,
body.platform-web.dark .find-doctor-content--web app-doctor-card .doctor-detail--time ion-icon,
body.platform-web.dark .find-doctor-content--web app-doctor-card .doctor-detail--time .next-available {
  color: #f08a8f;
}
body.platform-web.dark .find-doctor-content--web app-doctor-card .doctor-detail span {
  color: var(--doctor-dark-muted);
}
body.platform-web.dark .find-doctor-content--web app-doctor-card .doctor-detail ion-icon {
  color: #dc7b80;
}
body.platform-web.dark .find-doctor-content--web app-doctor-card .doctor-distance {
  color: var(--doctor-dark-accent);
}
body.platform-web.dark .find-doctor-content--web app-doctor-card .availability-badge.today {
  --background: rgb(143 199 120 / 16%);
  --color: #b9dfa7;
}
body.platform-web.dark .find-doctor-content--web app-doctor-card .availability-badge.tomorrow,
body.platform-web.dark .find-doctor-content--web app-doctor-card .availability-badge.upcoming {
  --background: rgb(224 176 69 / 15%);
  --color: #f0c96f;
}
body.platform-web.dark .find-doctor-content--web .doctors-status-card,
body.platform-web.dark .find-doctor-content--web app-doctor-card-skeleton .doctor-card-skeleton {
  background: var(--doctor-dark-surface);
  border-color: var(--doctor-dark-border);
  box-shadow: 0 14px 32px rgba(0, 0, 0, 0.22);
}
body.platform-web.dark .find-doctor-content--web .doctors-status-text {
  color: var(--doctor-dark-text);
}
body.platform-web.dark .find-doctor-content--web .find-doctor-help-card--web {
  background:
    linear-gradient(
      180deg,
      rgba(168, 207, 143, 0.05),
      transparent 54%),
    #0f1612;
  border-color: rgba(205, 226, 210, 0.11);
  box-shadow: 0 18px 46px rgba(0, 0, 0, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.03);
}
body.platform-web.dark .find-doctor-content--web .find-doctor-help-card--web::before {
  background:
    linear-gradient(
      90deg,
      #a8cf8f,
      rgba(168, 207, 143, 0));
}
body.platform-web.dark .find-doctor-content--web .find-doctor-help-card--web .help-title {
  color: var(--doctor-dark-text);
}
body.platform-web.dark .find-doctor-content--web .find-doctor-help-card--web .help-description {
  color: var(--doctor-dark-muted);
}
body.platform-web.dark .find-doctor-content--web .find-doctor-results-panel {
  background:
    linear-gradient(
      180deg,
      rgba(168, 207, 143, 0.05),
      transparent 54%),
    #0f1612;
  border-color: rgba(205, 226, 210, 0.11);
  box-shadow: 0 18px 46px rgba(0, 0, 0, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.03);
}
body.platform-web.dark .find-doctor-content--web .find-doctor-results-panel::before {
  background:
    linear-gradient(
      90deg,
      #a8cf8f,
      rgba(168, 207, 143, 0));
}
body.platform-web .learning-content app-course-card-skeleton .course-card-skeleton,
body.platform-web .category-content app-course-card-skeleton .course-card-skeleton {
  height: 100%;
  display: flex;
  flex-direction: column;
  background: var(--w-card);
  border: 1px solid var(--w-border);
  border-radius: var(--w-radius-card);
  box-shadow: 0 4px 12px rgba(123, 164, 101, 0.03);
}
body.platform-web .learning-content app-course-card-skeleton .course-card-skeleton .card-wrapper,
body.platform-web .category-content app-course-card-skeleton .course-card-skeleton .card-wrapper {
  flex-direction: column !important;
  height: 100%;
}
body.platform-web .learning-content app-course-card-skeleton .course-card-skeleton .skeleton-image,
body.platform-web .category-content app-course-card-skeleton .course-card-skeleton .skeleton-image {
  width: 100% !important;
  min-width: 0 !important;
  height: auto;
  aspect-ratio: 16/10;
  margin: 0 !important;
}
body.platform-web .learning-content app-course-card-skeleton .course-card-skeleton .skeleton-image ion-skeleton-text,
body.platform-web .category-content app-course-card-skeleton .course-card-skeleton .skeleton-image ion-skeleton-text {
  border-radius: var(--w-radius-card) var(--w-radius-card) 0 0 !important;
}
body.platform-web .learning-content app-course-card-skeleton .course-card-skeleton .skeleton-content,
body.platform-web .category-content app-course-card-skeleton .course-card-skeleton .skeleton-content {
  padding: 16px !important;
  flex: 1;
}
body.platform-web .learning-content app-course-card-skeleton .course-card-skeleton .skeleton-content .skeleton-button,
body.platform-web .category-content app-course-card-skeleton .course-card-skeleton .skeleton-content .skeleton-button {
  margin-top: auto;
  width: 100% !important;
}
body.platform-web app-header-container.shop-header {
  display: block;
  box-sizing: border-box;
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 16px 24px !important;
  background: var(--w-canvas);
}
body.platform-web app-header-container.shop-header app-header-toolbar {
  display: none;
}
body.platform-web app-header-container.shop-header ion-header {
  position: relative;
  z-index: 2;
  overflow: visible;
  padding: 0;
  background: var(--w-canvas);
  border-radius: 0;
}
body.platform-web app-header-container.shop-header .shop-search-control {
  position: relative;
  flex: 1;
  min-width: 0;
}
body.platform-web app-header-container.shop-header .shop-search-row {
  display: flex;
  align-items: center;
  width: 100%;
  max-width: var(--w-max);
  margin: 0 auto;
  gap: 16px;
}
body.platform-web app-header-container.shop-header .shop-web-back {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  padding: 0;
  border: 1px solid var(--w-border);
  border-radius: 50%;
  background: var(--w-card);
  box-shadow: var(--w-shadow-sm);
  color: var(--w-text);
  cursor: pointer;
  transition:
    border-color 180ms ease,
    background 180ms ease,
    transform 180ms ease,
    box-shadow 180ms ease;
}
body.platform-web app-header-container.shop-header .shop-web-back ion-icon {
  color: inherit;
  font-size: 22px;
}
body.platform-web app-header-container.shop-header .shop-web-back:hover {
  border-color: color-mix(in srgb, var(--w-sage) 45%, var(--w-border));
  background: var(--w-hover, #f5f8f2);
  box-shadow: var(--w-shadow-md);
  transform: translateX(-2px);
}
body.platform-web app-header-container.shop-header .shop-web-back:focus-visible {
  outline: 3px solid rgba(123, 164, 101, 0.22);
  outline-offset: 2px;
}
body.platform-web app-header-container.shop-header .shop-search-launcher {
  min-height: 56px;
  gap: 11px;
  padding: 6px 7px;
  border: 1px solid var(--w-border);
  border-radius: 17px;
  background:
    linear-gradient(
      180deg,
      rgba(255, 255, 255, 0.92),
      rgba(249, 251, 247, 0.96)),
    var(--w-card);
  color: var(--w-text);
  box-shadow: 0 12px 30px rgba(64, 88, 49, 0.09), inset 0 1px 0 #fff;
  transition:
    border-color 180ms ease,
    background 180ms ease,
    transform 180ms ease,
    box-shadow 180ms ease;
}
body.platform-web app-header-container.shop-header .shop-search-launcher:hover {
  border-color: color-mix(in srgb, var(--w-sage) 46%, var(--w-border));
  background:
    linear-gradient(
      180deg,
      #fff,
      #f5f9f2),
    var(--w-card);
  box-shadow:
    0 16px 36px rgba(64, 88, 49, 0.14),
    0 0 0 3px rgba(123, 164, 101, 0.07),
    inset 0 1px 0 #fff;
  transform: translateY(-1px);
}
body.platform-web app-header-container.shop-header .shop-search-launcher:focus-visible {
  outline: 3px solid rgba(123, 164, 101, 0.24);
  outline-offset: 3px;
}
body.platform-web app-header-container.shop-header .shop-search-launcher-icon {
  width: 42px;
  height: 42px;
  border: 1px solid rgba(123, 164, 101, 0.16);
  border-radius: 13px;
  background:
    linear-gradient(
      145deg,
      #edf5e8,
      #dfeeda);
  color: #63834f;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8);
}
body.platform-web app-header-container.shop-header .shop-search-launcher-icon ion-icon {
  font-size: 21px;
}
body.platform-web app-header-container.shop-header .shop-search-launcher-copy {
  gap: 2px;
}
body.platform-web app-header-container.shop-header .shop-search-launcher-copy strong {
  color: var(--w-text);
  font-size: 15px;
  font-weight: 800;
  letter-spacing: -0.01em;
}
body.platform-web app-header-container.shop-header .shop-search-launcher-copy > span {
  color: var(--w-muted);
  font-size: 12px;
}
body.platform-web app-header-container.shop-header .shop-search-launcher-action {
  min-height: 38px;
  gap: 9px;
  padding: 0 15px;
  border-radius: 12px;
  background:
    linear-gradient(
      135deg,
      #86aa69,
      #6e9255);
  color: #fff;
  box-shadow: 0 9px 20px rgba(83, 117, 64, 0.22);
  transition:
    background 180ms ease,
    transform 180ms ease,
    box-shadow 180ms ease;
}
body.platform-web app-header-container.shop-header .shop-search-launcher-action ion-icon {
  font-size: 17px;
  transition: transform 180ms ease;
}
body.platform-web app-header-container.shop-header .shop-search-launcher:hover .shop-search-launcher-action {
  background:
    linear-gradient(
      135deg,
      #7da461,
      #62844c);
  box-shadow: 0 11px 24px rgba(83, 117, 64, 0.3);
  transform: translateX(2px);
}
body.platform-web app-header-container.shop-header .shop-search-launcher:hover .shop-search-launcher-action ion-icon {
  transform: translateX(2px);
}
body.platform-web app-web-nav .web-nav-actions {
  gap: 10px;
}
body.platform-web .shop-content {
  --padding-top: 0;
  --padding-bottom: 0;
  --background: var(--w-canvas);
  color: var(--w-text);
}
body.platform-web .shop-content > .ion-padding-horizontal.ion-margin-bottom,
body.platform-web .shop-content .shop-content-padded {
  width: min(100% - 48px, var(--w-max));
  margin-right: auto;
  margin-left: auto;
  padding-inline: 0;
}
body.platform-web .shop-content > .ion-padding-horizontal.ion-margin-bottom {
  margin-top: 24px;
}
body.platform-web .shop-content .shop-hero {
  display: grid;
  grid-template-columns: 1.05fr 0.95fr;
  align-items: stretch;
  min-height: 340px;
  margin-top: 0;
  margin-bottom: 32px;
  background:
    linear-gradient(
      120deg,
      #eaf3e6 0%,
      #f3f8f0 60%,
      #fdfdfb 100%);
  border: 1px solid var(--w-border);
  border-radius: 24px;
  box-shadow: var(--w-shadow-lg);
  overflow: hidden;
}
body.platform-web .shop-content .shop-hero-copy {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 12px;
  padding: 36px 44px;
}
body.platform-web .shop-content .shop-hero-eyebrow {
  color: var(--w-sage);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
body.platform-web .shop-content .shop-hero-title {
  max-width: 18ch;
  margin: 0;
  color: var(--w-text);
  font-size: 32px;
  font-weight: 800;
  line-height: 1.1;
  letter-spacing: 0;
}
body.platform-web .shop-content .shop-hero-description {
  max-width: 42ch;
  margin: 4px 0 0;
  color: var(--w-muted);
  font-size: 16px;
  line-height: 1.45;
}
body.platform-web .shop-content .shop-hero-price {
  display: flex;
  align-items: baseline;
  gap: 12px;
  margin-top: 8px;
}
body.platform-web .shop-content .shop-hero-now {
  color: var(--w-pink-strong);
  font-size: 26px;
  font-weight: 800;
}
body.platform-web .shop-content .shop-hero-was {
  color: var(--w-muted);
  font-size: 15px;
  text-decoration: line-through;
}
body.platform-web .shop-content .shop-hero-cta {
  display: flex;
  gap: 12px;
  margin-top: 12px;
}
body.platform-web .shop-content .shop-hero-btn {
  min-height: 48px;
  padding: 12px 24px;
  border-radius: 999px;
  font-size: 15px;
  font-weight: 700;
}
body.platform-web .shop-content .shop-hero-media {
  position: relative;
  min-height: 340px;
  padding: 18px 20px 18px 0;
}
body.platform-web .shop-content .shop-hero-media app-image-preview,
body.platform-web .shop-content .shop-product-placeholder {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 300px;
  overflow: hidden;
  background:
    radial-gradient(
      circle at 60% 40%,
      #fff 0%,
      #eef3ec 70%);
  border-radius: 16px;
  box-shadow: var(--w-shadow-md);
}
body.platform-web .shop-content .shop-hero-media app-image-preview ion-img::part(image) {
  object-fit: contain;
}
body.platform-web .shop-content .shop-product-placeholder {
  position: relative;
}
body.platform-web .shop-content .shop-product-placeholder::after {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 112px;
  height: 112px;
  background: var(--w-sage);
  content: "";
  mask: url(/svg/medical.svg) no-repeat center/contain;
  opacity: 0.9;
  transform: translate(-50%, -50%);
}
body.platform-web .shop-content .shop-hero-tag {
  position: absolute;
  top: 18px;
  left: 0;
  z-index: 3;
  padding: 4px 12px;
  background: var(--w-pink);
  border-radius: 0 999px 999px 0;
  color: #fff;
  font-size: 13px;
  font-weight: 700;
}
body.platform-web .shop-content .shop-category-section {
  margin-bottom: 48px;
}
body.platform-web .shop-content .shop-category-heading {
  margin: 0 0 18px;
  color: var(--w-text);
  font-size: 18px;
  font-weight: 800;
  line-height: 1.2;
}
body.platform-web .shop-content .shop-category-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 16px;
}
body.platform-web .shop-content .shop-category-grid.is-collapsed {
  max-height: 118px;
  overflow: hidden;
}
@media (width <= 768px) {
  body.platform-web .shop-content .shop-category-grid.is-collapsed {
    max-height: 114px;
  }
}
@media (width <= 560px) {
  body.platform-web .shop-content .shop-category-grid.is-collapsed {
    max-height: 108px;
  }
}
@media (width <= 360px) {
  body.platform-web .shop-content .shop-category-grid.is-collapsed {
    max-height: 100px;
  }
}
body.platform-web .shop-content .shop-category-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 14px;
  min-width: 0;
  min-height: 118px;
  padding: 14px 12px;
  background: var(--w-card);
  border: 1px solid var(--w-border);
  border-radius: 16px;
  box-shadow: var(--w-shadow-sm);
  color: var(--w-text);
  text-align: center;
  cursor: pointer;
  transition:
    transform 0.25s ease,
    border-color 0.25s ease,
    box-shadow 0.25s ease,
    background-color 0.25s ease;
}
body.platform-web .shop-content .shop-category-card:hover {
  border-color: var(--w-sage);
  box-shadow: var(--w-shadow-md);
  transform: none;
}
body.platform-web .shop-content .shop-category-card:focus-visible {
  outline: 3px solid var(--w-sage);
  outline-offset: 2px;
}
body.platform-web .shop-content .shop-category-card.is-selected {
  border-color: var(--w-sage);
  background:
    linear-gradient(
      180deg,
      #f7fbf4 0%,
      #edf6e7 100%);
  box-shadow: 0 12px 24px rgba(123, 164, 101, 0.14);
}
body.platform-web .shop-content .shop-category-icon {
  position: relative;
  display: grid;
  flex: 0 0 56px;
  width: 56px;
  height: 56px;
  place-items: center;
  overflow: hidden;
  background: #e7f1e2;
  border-radius: 999px;
  color: var(--w-sage);
}
body.platform-web .shop-content .shop-category-icon::after {
  width: 24px;
  height: 24px;
  background: currentcolor;
  content: "";
  mask: url(/svg/medkit-outline.svg) no-repeat center/contain;
}
body.platform-web .shop-content .shop-category-icon app-image-preview {
  position: absolute;
  inset: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
  padding: 8px;
  background: inherit;
}
body.platform-web .shop-content .shop-category-card:nth-child(2) .shop-category-icon {
  background: #e7f0f7;
  color: #3f86c4;
}
body.platform-web .shop-content .shop-category-card:nth-child(2) .shop-category-icon::after {
  -webkit-mask-image: url(/svg/happy-outline.svg);
  mask-image: url(/svg/happy-outline.svg);
}
body.platform-web .shop-content .shop-category-card:nth-child(3) .shop-category-icon {
  background: #fce7ea;
  color: var(--w-pink-strong);
}
body.platform-web .shop-content .shop-category-card:nth-child(3) .shop-category-icon::after {
  -webkit-mask-image: url(/svg/heart-outline.svg);
  mask-image: url(/svg/heart-outline.svg);
}
body.platform-web .shop-content .shop-category-card:nth-child(4) .shop-category-icon {
  background: #fdf0d8;
  color: #b5790a;
}
body.platform-web .shop-content .shop-category-card:nth-child(4) .shop-category-icon::after {
  -webkit-mask-image: url(/svg/nutrition-outline.svg);
  mask-image: url(/svg/nutrition-outline.svg);
}
body.platform-web .shop-content .shop-category-copy {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 0;
  align-items: center;
}
body.platform-web .shop-content .shop-category-copy strong {
  overflow: hidden;
  color: var(--w-text);
  font-size: 15px;
  font-weight: 700;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}
body.platform-web .shop-content app-product-section {
  display: block;
  margin-bottom: 48px;
}
body.platform-web .shop-content .product-section {
  padding: 0;
}
body.platform-web .shop-content .product-section__header {
  align-items: flex-end;
  gap: 16px;
  padding: 0;
  margin-bottom: 24px;
}
body.platform-web .shop-content .product-section__heading {
  min-width: 0;
}
body.platform-web .shop-content .product-section-eyebrow {
  display: block;
  margin-bottom: 4px;
  color: var(--w-sage);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
body.platform-web .shop-content .product-section-title {
  margin: 0;
  color: var(--w-text);
  font-size: 22px;
  font-weight: 700;
  line-height: 1.25;
}
body.platform-web .shop-content .product-section-count {
  margin-left: 8px;
  color: var(--w-muted);
  font-size: 13px;
  font-weight: 500;
}
body.platform-web .shop-content .product-section__link-btn {
  min-height: 32px;
  height: 32px;
  margin: 0;
  color: var(--w-sage);
  font-size: 15px;
  font-weight: 600;
  --color: var(--w-sage);
  --padding-start: 8px;
  --padding-end: 0;
}
body.platform-web .shop-content .product-section__link-btn ion-icon {
  margin-left: 6px;
  font-size: 17px;
}
body.platform-web .shop-content .product-section-scroll,
body.platform-web .shop-content app-product-card-skeleton .products-grid-skeleton {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 24px;
  padding: 0;
  margin: 0;
  overflow: visible;
}
body.platform-web .shop-content .product-section-scroll app-product-card {
  display: block;
  width: auto;
  max-width: none;
  height: 100%;
  flex: initial;
}
body.platform-web .shop-content .product-section-scroll app-product-card:nth-child(n+5) {
  display: none;
}
body.platform-web .shop-content app-product-card .product-card {
  display: flex;
  width: 100%;
  min-width: 0;
  max-width: none;
  height: 100%;
  min-height: 370px;
  aspect-ratio: auto;
  flex-direction: column;
  padding: 16px;
  overflow: hidden;
  background: var(--w-card);
  border: 1px solid var(--w-border);
  border-radius: 16px;
  box-shadow: var(--w-shadow-md);
}
body.platform-web .shop-content app-product-card .product-card:hover {
  border-color: var(--w-sage);
  box-shadow: var(--w-shadow-lg);
  transform: translateY(-6px);
}
body.platform-web .shop-content app-product-card .product-card-image-container {
  position: relative;
  top: auto;
  left: auto;
  order: 0;
  width: 100%;
  aspect-ratio: 1/1;
  overflow: visible;
  background: #eef3ec;
  border-radius: 12px;
}
body.platform-web .shop-content app-product-card .product-card-image {
  display: block;
  width: 100%;
  height: 100%;
  overflow: hidden;
  background: #eef3ec;
  border-radius: 12px;
}
body.platform-web .shop-content app-product-card .product-card-image ion-img::part(image) {
  object-fit: contain;
}
body.platform-web .shop-content app-product-card .product-card-image .image-error {
  background: #eef3ec;
}
body.platform-web .shop-content app-product-card .product-card-image .image-error .error-logo {
  display: none;
}
body.platform-web .shop-content app-product-card .product-card-image .image-error::after {
  width: 64px;
  height: 64px;
  background: var(--w-sage);
  content: "";
  mask: url(/svg/medical.svg) no-repeat center/contain;
  opacity: 0.82;
}
body.platform-web .shop-content app-product-card .product-card-badge {
  top: 12px;
  padding: 4px 8px;
  border-radius: 8px;
  font-size: 11px;
}
body.platform-web .shop-content app-product-card .product-card-badge-promo,
body.platform-web .shop-content app-product-card .product-card-badge-oos {
  left: 12px;
}
body.platform-web .shop-content app-product-card .product-card-badge-disc {
  right: 12px;
}
body.platform-web .shop-content app-product-card .product-card-quickview {
  inset: auto 12px 12px;
  justify-content: center;
  width: auto;
  padding: 10px 14px;
  transform: translateY(8px);
}
body.platform-web .shop-content app-product-card .product-card:hover .product-card-quickview,
body.platform-web .shop-content app-product-card .product-card:focus-within .product-card-quickview {
  transform: translateY(0);
}
body.platform-web .shop-content app-product-card .product-card-cart-control {
  right: 20px;
  bottom: -18px;
  width: 36px;
  min-width: 36px;
  height: 36px;
  background: var(--w-pink);
  box-shadow: 0 4px 10px rgba(233, 102, 119, 0.3);
}
body.platform-web .shop-content app-product-card .product-card-info {
  position: static;
  order: 2;
  width: 100%;
  min-height: 39px;
  margin-top: 4px;
}
body.platform-web .shop-content app-product-card .product-card-name {
  color: var(--w-text);
  font-size: 15px;
  font-weight: 700;
  line-height: 1.3;
}
body.platform-web .shop-content app-product-card .product-card-rating {
  position: static;
  order: 1;
  width: 100%;
  height: auto;
  min-height: 16px;
  margin-top: 22px;
  color: #f0a818;
}
body.platform-web .shop-content app-product-card .product-card-rating ion-icon {
  flex: 0 0 13px;
  width: 13px;
  height: 13px;
  font-size: 13px;
}
body.platform-web .shop-content app-product-card .product-card-review-count {
  margin-left: 6px;
  color: var(--w-muted);
  font-size: 12px;
  letter-spacing: 0;
}
body.platform-web .shop-content app-product-card .product-card-pricing {
  position: static;
  order: 3;
  width: 100%;
  height: auto;
  margin-top: auto;
  overflow: visible;
}
body.platform-web .shop-content app-product-card .product-card-pricing-values {
  gap: 8px;
  overflow: visible;
}
body.platform-web .shop-content app-product-card .product-card-current-price {
  order: -1;
  overflow: visible;
  color: var(--w-pink-strong);
  font-size: 17px;
  font-weight: 800;
}
body.platform-web .shop-content app-product-card .product-card-original-price {
  overflow: visible;
  color: var(--w-muted);
  font-size: 13px;
  font-weight: 600;
}
body.platform-web .shop-content app-product-card-skeleton .product-card-skeleton {
  width: 100%;
  min-width: 0;
  max-width: none;
  min-height: 370px;
  aspect-ratio: auto;
  padding: 16px;
  background: var(--w-card);
  border: 1px solid var(--w-border);
  border-radius: 16px;
  box-shadow: var(--w-shadow-md);
}
body.platform-web .shop-content app-product-card-skeleton .skeleton-image {
  aspect-ratio: 1/1;
  margin-bottom: 12px;
  background: #eef3ec;
  border-radius: 12px;
}
body.platform-web .shop-content .shop-promo-strip {
  display: flex;
  align-items: center;
  gap: 16px;
  width: 100%;
  min-height: 80px;
  padding: 24px 32px;
  margin: 0 0 48px;
  background:
    linear-gradient(
      120deg,
      #eaf3e6,
      #f6faf3);
  border: 1px solid var(--w-border);
  border-radius: 24px;
  box-shadow: var(--w-shadow-md);
  color: var(--w-text);
  text-align: left;
  cursor: pointer;
}
body.platform-web .shop-content .shop-promo-icon {
  flex: 0 0 30px;
  width: 30px;
  height: 30px;
  background: var(--w-sage);
  mask: url(/svg/medical-outline.svg) no-repeat center/contain;
}
body.platform-web .shop-content .shop-promo-text {
  display: flex;
  align-items: baseline;
  gap: 8px;
  min-width: 0;
}
body.platform-web .shop-content .shop-promo-text strong {
  color: var(--w-text);
  font-size: 19px;
  font-weight: 800;
}
body.platform-web .shop-content .shop-promo-text span {
  color: var(--w-muted);
  font-size: 15px;
}
body.platform-web .shop-content .shop-state-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
  margin-top: 48px;
}
body.platform-web .shop-content .shop-state-panel,
body.platform-web .shop-content .shop-qv-panel {
  padding: 24px;
  background: #fbfdfa;
  border: 1px dashed var(--w-border);
  border-radius: 16px;
}
body.platform-web .shop-content .shop-state-label {
  display: block;
  margin-bottom: 16px;
  color: var(--w-muted);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
body.platform-web .shop-content .shop-state-skeleton-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}
body.platform-web .shop-content .shop-state-skeleton {
  display: flex;
  flex-direction: column;
  padding: 16px;
  background: var(--w-card);
  border: 1px solid var(--w-border);
  border-radius: 16px;
}
body.platform-web .shop-content .shop-state-skeleton-image,
body.platform-web .shop-content .shop-state-skeleton-line {
  display: block;
  background:
    linear-gradient(
      90deg,
      #eef2ec 25%,
      #e3e9e1 37%,
      #eef2ec 63%);
  background-size: 400% 100%;
  border-radius: 8px;
  animation: shop-shimmer 1.4s ease infinite;
}
body.platform-web .shop-content .shop-state-skeleton-image {
  aspect-ratio: 1/1;
  margin-bottom: 12px;
}
body.platform-web .shop-content .shop-state-skeleton-line {
  width: 100%;
  height: 12px;
  margin-bottom: 8px;
}
body.platform-web .shop-content .shop-state-skeleton-line-short {
  width: 55%;
}
body.platform-web .shop-content .shop-empty-state {
  display: flex;
  min-height: 328px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 24px 0;
  text-align: center;
}
body.platform-web .shop-content .shop-empty-icon {
  width: 64px;
  height: 64px;
  margin-bottom: 16px;
  background: #e7f1e2;
  border-radius: 50%;
}
body.platform-web .shop-content .shop-empty-icon::after {
  display: block;
  width: 28px;
  height: 28px;
  margin: 18px;
  background: var(--w-sage);
  content: "";
  mask: url(/svg/search.svg) no-repeat center/contain;
}
body.platform-web .shop-content .shop-empty-state h3 {
  margin: 0 0 8px;
  color: var(--w-text);
  font-size: 19px;
  font-weight: 800;
}
body.platform-web .shop-content .shop-empty-state p {
  margin: 0 0 16px;
  color: var(--w-muted);
  font-size: 15px;
}
body.platform-web .shop-content .shop-state-action {
  min-height: 44px;
  padding: 10px 24px;
  background: transparent;
  border: 2px solid var(--w-sage);
  border-radius: 999px;
  color: var(--w-sage);
  font-size: 15px;
  font-weight: 700;
  cursor: pointer;
}
body.platform-web .shop-content .shop-qv-panel {
  margin-top: 48px;
}
body.platform-web .shop-content .shop-qv-reference {
  display: block;
  overflow: hidden;
  background: var(--w-card);
  border: 1px solid var(--w-border);
  border-radius: 24px;
  box-shadow: var(--w-shadow-lg);
}
body.platform-web .shop-content .shop-qv-reference .qv {
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  padding: 24px;
}
body.platform-web .shop-content .shop-qv-reference .qv-close {
  display: none;
}
body.platform-web .shop-content .shop-qv-reference .qv-media {
  background: #eef3ec;
  border-radius: 16px;
}
body.platform-web .shop-content .shop-qv-reference .qv-img {
  object-fit: contain;
}
body.platform-web .shop-content .shop-qv-reference .qv-name {
  color: var(--w-text);
  font-size: 19px;
  font-weight: 800;
}
body.platform-web .shop-content .shop-qv-reference .qv-desc {
  color: var(--w-muted);
}
@media (width <= 992px) {
  body.platform-web .shop-content .shop-hero {
    grid-template-columns: 1fr;
  }
  body.platform-web .shop-content .shop-hero-media {
    min-height: 260px;
    padding: 0 24px 24px;
  }
  body.platform-web .shop-content .shop-hero-media app-image-preview,
  body.platform-web .shop-content .shop-product-placeholder {
    min-height: 236px;
  }
  body.platform-web .shop-content .shop-hero-tag {
    top: 0;
    left: 24px;
  }
  body.platform-web .shop-content .shop-category-grid,
  body.platform-web .shop-content .product-section-scroll,
  body.platform-web .shop-content app-product-card-skeleton .products-grid-skeleton {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  body.platform-web .shop-content .shop-state-grid {
    grid-template-columns: 1fr;
  }
}
@media (width < 768px) {
  body.platform-web app-header-container.shop-header {
    padding: 12px 16px !important;
  }
  body.platform-web .shop-content .shop-hero,
  body.platform-web .shop-content .shop-content-padded {
    width: calc(100% - 32px);
  }
  body.platform-web .shop-content .shop-hero-copy {
    padding: 28px 24px;
  }
  body.platform-web .shop-content .shop-hero-title {
    font-size: 26px;
  }
  body.platform-web .shop-content .shop-hero-description {
    font-size: 15px;
  }
  body.platform-web .shop-content .shop-category-card {
    min-height: 108px;
    padding: 14px 10px;
  }
  body.platform-web .shop-content .product-section-scroll,
  body.platform-web .shop-content app-product-card-skeleton .products-grid-skeleton {
    gap: 16px;
  }
  body.platform-web .shop-content app-product-card .product-card,
  body.platform-web .shop-content app-product-card-skeleton .product-card-skeleton {
    min-height: 0;
    padding: 10px;
  }
  body.platform-web .shop-content app-product-card .product-card-name {
    font-size: 14px;
  }
  body.platform-web .shop-content app-product-card .product-card-rating {
    margin-top: 20px;
  }
  body.platform-web .shop-content app-product-card .product-card-cart-control {
    right: 12px;
  }
  body.platform-web .shop-content .shop-promo-strip {
    align-items: flex-start;
    padding: 20px;
    border-radius: 16px;
  }
  body.platform-web .shop-content .shop-promo-text {
    flex-direction: column;
    gap: 4px;
  }
  body.platform-web .shop-content .shop-state-panel,
  body.platform-web .shop-content .shop-qv-panel {
    padding: 16px;
  }
  body.platform-web .shop-content .shop-qv-reference .qv {
    grid-template-columns: 1fr;
    padding: 16px;
  }
}
@media (width < 600px) {
  body.platform-web .shop-content .shop-category-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  body.platform-web .shop-content .shop-category-card {
    gap: 10px;
    text-align: center;
  }
  body.platform-web .shop-content .shop-category-copy strong {
    white-space: normal;
  }
  body.platform-web .shop-content .shop-state-skeleton-grid {
    grid-template-columns: 1fr;
  }
  body.platform-web .shop-content .product-section-title {
    font-size: 19px;
  }
  body.platform-web .shop-content .product-section-count {
    display: block;
    margin: 2px 0 0;
  }
}
body.platform-web.dark ion-modal.add-to-cart-dialog {
  --cart-dialog-surface: #111713;
  --cart-dialog-elevated: #1a231d;
  --cart-dialog-subtle: #161e19;
  --cart-dialog-control: #0e1410;
  --cart-dialog-border: rgb(205 226 210 / 13%);
  --cart-dialog-border-strong: rgb(168 207 143 / 48%);
  --cart-dialog-text: #f2f6f3;
  --cart-dialog-muted: #9da9a1;
  --cart-dialog-accent: #acd391;
  --cart-dialog-header:
    radial-gradient(
      circle at 86% 8%,
      rgb(168 207 143 / 13%),
      transparent 34%),
    linear-gradient(
      135deg,
      #18211b 0%,
      #121914 100%);
  --box-shadow: 0 36px 110px rgb(0 0 0 / 58%), 0 0 0 1px rgb(255 255 255 / 3%);
  --backdrop-opacity: 0.68;
  color: var(--cart-dialog-text);
}
body.platform-web.dark ion-modal.add-to-cart-dialog::part(content) {
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04), 0 0 0 1px rgba(0, 0, 0, 0.28);
}
body.platform-web.dark ion-modal.add-to-cart-dialog::part(backdrop) {
  background: rgba(4, 8, 5, 0.78);
  -webkit-backdrop-filter: blur(12px) saturate(80%);
  backdrop-filter: blur(12px) saturate(80%);
}
body.platform-web.dark ion-modal.add-to-cart-dialog .add-to-cart-modal-heading-icon {
  background: #9fc982;
  color: #0b110d;
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.24);
}
body.platform-web.dark ion-modal.add-to-cart-dialog .add-to-cart-modal-eyebrow {
  color: var(--cart-dialog-accent);
}
body.platform-web.dark ion-modal.add-to-cart-dialog .add-to-cart-modal-close:hover {
  border-color: var(--cart-dialog-border-strong);
  background: #202b23;
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.22);
}
body.platform-web.dark ion-modal.add-to-cart-dialog .add-to-cart-modal-body {
  scrollbar-color: rgba(168, 207, 143, 0.38) transparent;
  scrollbar-width: thin;
}
body.platform-web.dark ion-modal.add-to-cart-dialog .add-to-cart-modal-product,
body.platform-web.dark ion-modal.add-to-cart-dialog .add-to-cart-modal-variant-options,
body.platform-web.dark ion-modal.add-to-cart-dialog .add-to-cart-modal-quantity-row {
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.16), inset 0 1px 0 rgba(255, 255, 255, 0.02);
}
body.platform-web.dark ion-modal.add-to-cart-dialog .add-to-cart-modal-product {
  background:
    radial-gradient(
      circle at 12% 20%,
      rgba(168, 207, 143, 0.07),
      transparent 34%),
    var(--cart-dialog-subtle);
}
body.platform-web.dark ion-modal.add-to-cart-dialog .add-to-cart-modal-image {
  background: #eef3ed;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.22);
}
body.platform-web.dark ion-modal.add-to-cart-dialog .add-to-cart-modal-discount-badge {
  border: 1px solid rgba(168, 207, 143, 0.2);
  background: rgba(168, 207, 143, 0.12);
  color: var(--cart-dialog-accent);
}
body.platform-web.dark ion-modal.add-to-cart-dialog .add-to-cart-modal-option-btn:hover:not(:disabled) {
  border-color: var(--cart-dialog-border-strong);
  background: #1c271f;
}
body.platform-web.dark ion-modal.add-to-cart-dialog .add-to-cart-modal-option-btn.is-selected {
  border-color: #8fba73;
  background: rgba(168, 207, 143, 0.16);
  color: #bee0a7;
  box-shadow: 0 0 0 2px rgba(168, 207, 143, 0.07);
}
body.platform-web.dark ion-modal.add-to-cart-dialog .add-to-cart-modal-quantity {
  box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.32);
}
body.platform-web.dark ion-modal.add-to-cart-dialog .add-to-cart-modal-quantity-btn,
body.platform-web.dark ion-modal.add-to-cart-dialog .add-to-cart-modal-quantity-value {
  color: var(--cart-dialog-text);
}
body.platform-web.dark ion-modal.add-to-cart-dialog .add-to-cart-modal-submit {
  --background: #9fc982;
  --background-hover: #add590;
  --background-activated: #8eb873;
  --box-shadow: 0 12px 28px rgb(0 0 0 / 26%);
  --color: #0b110d;
}
body.platform-web.dark ion-modal.add-to-cart-dialog .add-to-cart-modal-submit[disabled] {
  --background: #344239;
  --box-shadow: none;
  --color: #7f8b83;
}
body.platform-web.dark app-product-details {
  --product-dark-canvas: #0b100d;
  --product-dark-surface: #131a16;
  --product-dark-surface-raised: #18211b;
  --product-dark-surface-soft: #1c261f;
  --product-dark-border: rgb(205 226 210 / 12%);
  --product-dark-border-strong: rgb(168 207 143 / 38%);
  --product-dark-text: #f2f6f3;
  --product-dark-muted: #9ca9a1;
  --product-dark-subtle: #748078;
  --product-dark-accent: #acd391;
  --product-dark-price: #f27a8d;
}
body.platform-web.dark app-product-details .product-details-content {
  --background: var(--product-dark-canvas);
  color: var(--product-dark-text);
}
body.platform-web.dark app-product-details .product-details-content::part(scroll) {
  background:
    radial-gradient(
      circle at 18% 2%,
      rgba(168, 207, 143, 0.07),
      transparent 28rem),
    var(--product-dark-canvas);
}
body.platform-web.dark app-product-details .product-details-page {
  color: var(--product-dark-text);
}
body.platform-web.dark app-product-details .product-details-back-btn {
  border-color: var(--product-dark-border);
  background: var(--product-dark-surface-raised);
  color: var(--product-dark-accent);
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2);
}
body.platform-web.dark app-product-details .product-details-back-btn:hover {
  border-color: var(--product-dark-border-strong);
  background: var(--product-dark-surface-soft);
  color: #c4e4af;
}
body.platform-web.dark app-product-details .product-details-breadcrumb,
body.platform-web.dark app-product-details .product-details-breadcrumb-link,
body.platform-web.dark app-product-details .product-details-reviews-link,
body.platform-web.dark app-product-details .product-details-sku-line,
body.platform-web.dark app-product-details .product-details-stock-status,
body.platform-web.dark app-product-details .product-details-option-selected-value,
body.platform-web.dark app-product-details .product-details-about-copy,
body.platform-web.dark app-product-details .product-details-view-all {
  color: var(--product-dark-muted);
}
body.platform-web.dark app-product-details .product-details-breadcrumb-current,
body.platform-web.dark app-product-details .product-details-rating-value,
body.platform-web.dark app-product-details .product-details-option-label,
body.platform-web.dark app-product-details .product-details-quantity-label,
body.platform-web.dark app-product-details .product-details-section-title {
  color: var(--product-dark-text);
}
body.platform-web.dark app-product-details .product-details-breadcrumb-link:hover,
body.platform-web.dark app-product-details .product-details-reviews-link:hover,
body.platform-web.dark app-product-details .product-details-view-all:hover {
  color: var(--product-dark-accent);
}
body.platform-web.dark app-product-details .product-details-breadcrumb-sep,
body.platform-web.dark app-product-details .product-details-rating-sep,
body.platform-web.dark app-product-details .product-details-sku-sep {
  color: var(--product-dark-subtle);
}
body.platform-web.dark app-product-details .product-details-gallery-card {
  border-color: var(--product-dark-border);
  background:
    radial-gradient(
      circle at 50% 8%,
      rgba(168, 207, 143, 0.08),
      transparent 48%),
    linear-gradient(
      145deg,
      var(--product-dark-surface-raised),
      var(--product-dark-surface));
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.04);
}
body.platform-web.dark app-product-details .product-details-gallery-thumb {
  border-color: var(--product-dark-border);
  background: var(--product-dark-surface-raised);
}
body.platform-web.dark app-product-details .product-details-gallery-thumb:hover,
body.platform-web.dark app-product-details .product-details-gallery-thumb.is-active {
  border-color: var(--product-dark-accent);
  box-shadow: 0 0 0 2px rgba(168, 207, 143, 0.09);
}
body.platform-web.dark app-product-details .product-details-info-column {
  padding: 30px;
  border: 1px solid var(--product-dark-border);
  border-radius: 24px;
  background:
    radial-gradient(
      circle at 100% 0%,
      rgba(168, 207, 143, 0.07),
      transparent 35%),
    linear-gradient(
      145deg,
      var(--product-dark-surface-raised),
      var(--product-dark-surface));
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.24), inset 0 1px 0 rgba(255, 255, 255, 0.03);
}
body.platform-web.dark app-product-details .product-details-eyebrow {
  color: var(--product-dark-accent);
}
body.platform-web.dark app-product-details .product-details-title,
body.platform-web.dark app-product-details .product-details-related-title,
body.platform-web.dark app-product-details .product-details-sticky-name {
  color: var(--product-dark-text);
}
body.platform-web.dark app-product-details .product-details-star-icon,
body.platform-web.dark app-product-details .product-details-related-rating ion-icon:not(.filled) {
  color: #39433c;
}
body.platform-web.dark app-product-details .product-details-current-price,
body.platform-web.dark app-product-details .product-details-related-price,
body.platform-web.dark app-product-details .product-details-sticky-price {
  color: var(--product-dark-price);
}
body.platform-web.dark app-product-details .product-details-original-price {
  color: var(--product-dark-subtle);
}
body.platform-web.dark app-product-details .product-details-discount-badge {
  border: 1px solid rgba(168, 207, 143, 0.18);
  background: rgba(168, 207, 143, 0.11);
  color: var(--product-dark-accent);
}
body.platform-web.dark app-product-details .product-details-stock-status:not(.is-oos) {
  color: var(--product-dark-accent);
}
body.platform-web.dark app-product-details .product-details-option-btn {
  border-color: var(--product-dark-border);
  background: var(--product-dark-surface-soft);
  color: var(--product-dark-text);
}
body.platform-web.dark app-product-details .product-details-option-btn:hover:not(.is-unavailable) {
  border-color: var(--product-dark-border-strong);
  background: #233027;
}
body.platform-web.dark app-product-details .product-details-option-btn.is-selected {
  border-color: var(--product-dark-accent);
  background: var(--product-dark-accent);
  color: #0b110d;
  box-shadow: 0 7px 18px rgba(0, 0, 0, 0.18);
}
body.platform-web.dark app-product-details .product-details-combo-warning {
  border: 1px solid rgba(255, 192, 67, 0.22);
  background: rgba(255, 192, 67, 0.09);
  color: #e7bd68;
}
body.platform-web.dark app-product-details .product-details-divider {
  border-color: var(--product-dark-border);
}
body.platform-web.dark app-product-details .product-details-quantity-controls {
  border-color: var(--product-dark-border);
  background: #0f1611;
  box-shadow: inset 0 2px 6px rgba(0, 0, 0, 0.28);
}
body.platform-web.dark app-product-details .product-details-qty-btn {
  border-color: var(--product-dark-border);
  background: var(--product-dark-surface-soft);
  color: var(--product-dark-text);
}
body.platform-web.dark app-product-details .product-details-qty-btn:hover:not([disabled]) {
  border-color: var(--product-dark-accent);
  background: var(--product-dark-accent);
  color: #0b110d;
}
body.platform-web.dark app-product-details .product-details-qty-display,
body.platform-web.dark app-product-details .product-details-about-copy :where(.rich-text-content li) {
  color: var(--product-dark-text);
}
body.platform-web.dark app-product-details .product-details-related-card {
  border-color: var(--product-dark-border);
  background:
    linear-gradient(
      145deg,
      var(--product-dark-surface-raised),
      var(--product-dark-surface));
  box-shadow: 0 14px 34px rgba(0, 0, 0, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.03);
}
body.platform-web.dark app-product-details .product-details-related-card:hover {
  border-color: var(--product-dark-border-strong);
  box-shadow: 0 22px 42px rgba(0, 0, 0, 0.3);
}
body.platform-web.dark app-product-details .product-details-related-media {
  background: var(--product-dark-surface-soft);
}
body.platform-web.dark app-product-details .product-details-sticky-actions {
  border-color: var(--product-dark-border);
  background: rgba(13, 19, 15, 0.94);
  box-shadow: 0 -18px 50px rgba(0, 0, 0, 0.34), inset 0 1px 0 rgba(255, 255, 255, 0.03);
  -webkit-backdrop-filter: blur(18px) saturate(120%);
  backdrop-filter: blur(18px) saturate(120%);
}
body.platform-web.dark app-product-details .product-details-sticky-thumb {
  border: 1px solid var(--product-dark-border);
  background: #eef3ed;
}
body.platform-web.dark app-product-details .product-details-sticky-btn-buy-now {
  --background: var(--product-dark-surface-soft);
  --background-hover: #253229;
  --background-activated: #2b3a30;
  --border-color: var(--product-dark-accent);
  --color: var(--product-dark-accent);
}
body.platform-web.dark app-product-details .product-details-sticky-btn-add-cart {
  --background: var(--product-dark-price);
  --background-hover: #fc8798;
  --background-activated: #df697b;
  --box-shadow: 0 10px 26px rgb(242 122 141 / 18%);
  --color: #fff;
}
@media (width < 981px) {
  body.platform-web.dark app-product-details .product-details-info-column {
    padding: 24px;
  }
}
@media (width < 640px) {
  body.platform-web.dark app-product-details .product-details-info-column {
    padding: 20px;
    border-radius: 18px;
  }
}
body.platform-web.dark :is(.login-content, .login-email-content, .user-name-content, .profile-select-content) {
  --auth-dark-canvas: #090e0b;
  --auth-dark-panel: #121914;
  --auth-dark-panel-raised: #172019;
  --auth-dark-control: #0d130f;
  --auth-dark-border: rgb(205 226 210 / 13%);
  --auth-dark-border-strong: rgb(168 207 143 / 48%);
  --auth-dark-text: #f2f6f3;
  --auth-dark-muted: #9da9a1;
  --auth-dark-accent: #acd391;
  --background:
    radial-gradient(
      circle at 12% 16%,
      rgb(114 157 91 / 20%),
      transparent 31%),
    radial-gradient(
      circle at 88% 84%,
      rgb(221 107 126 / 10%),
      transparent 28%),
    linear-gradient(
      135deg,
      #08100b 0%,
      #0d1410 52%,
      #101612 100%);
  color: var(--auth-dark-text);
}
body.platform-web.dark :is(.login-content, .login-email-content, .user-name-content, .profile-select-content) :is(.login-container, .login-email-container, .user-name-container, .profile-select-container) {
  background:
    radial-gradient(
      circle at 14% 16%,
      rgba(114, 157, 91, 0.18),
      transparent 31%),
    radial-gradient(
      circle at 87% 84%,
      rgba(221, 107, 126, 0.08),
      transparent 28%),
    radial-gradient(
      circle at 72% 10%,
      rgba(244, 192, 67, 0.05),
      transparent 22%),
    linear-gradient(
      135deg,
      #08100b 0%,
      #0d1410 52%,
      #101612 100%);
}
body.platform-web.dark :is(.login-content, .login-email-content, .user-name-content, .profile-select-content) :is(.login-container, .login-email-container, .user-name-container, .profile-select-container)::before {
  border-color: rgba(168, 207, 143, 0.12);
  box-shadow: 0 0 0 54px rgba(168, 207, 143, 0.04), 0 0 0 108px rgba(168, 207, 143, 0.02);
}
body.platform-web.dark :is(.login-content, .login-email-content, .user-name-content, .profile-select-content) :is(.login-container, .login-email-container, .user-name-container, .profile-select-container)::after {
  background: rgba(229, 126, 145, 0.07);
  box-shadow: 0 0 110px rgba(229, 126, 145, 0.09);
}
body.platform-web.dark :is(.login-content, .login-email-content, .user-name-content, .profile-select-content) :is(.login-row, .login-email-row, .user-name-row, .profile-select-row) > ion-col {
  border-color: var(--auth-dark-border);
  background: var(--auth-dark-panel);
  box-shadow:
    0 42px 110px rgba(0, 0, 0, 0.48),
    0 12px 34px rgba(0, 0, 0, 0.28),
    inset 0 1px 0 rgba(255, 255, 255, 0.04);
}
body.platform-web.dark :is(.login-content, .login-email-content, .user-name-content, .profile-select-content) .login-web-brand {
  border-right: 1px solid rgba(205, 226, 210, 0.09);
  background:
    radial-gradient(
      circle at 82% 20%,
      rgba(255, 255, 255, 0.09),
      transparent 28%),
    linear-gradient(
      145deg,
      #3f6038 0%,
      #527548 52%,
      #304c2c 100%);
}
body.platform-web.dark :is(.login-content, .login-email-content, .user-name-content, .profile-select-content) .login-web-brand::after {
  border-color: rgba(255, 255, 255, 0.08);
  box-shadow: 0 0 0 46px rgba(255, 255, 255, 0.02), 0 0 0 92px rgba(255, 255, 255, 0.01);
}
body.platform-web.dark :is(.login-content, .login-email-content, .user-name-content, .profile-select-content) .login-web-brand-mark {
  background: #f3f7f2;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.26);
}
body.platform-web.dark :is(.login-content, .login-email-content, .user-name-content, .profile-select-content) :is(.login-content-wrapper, .login-email-content-wrapper, .user-name-content-wrapper, .profile-select-content-wrapper) {
  background:
    radial-gradient(
      circle at 100% 0%,
      rgba(168, 207, 143, 0.08),
      transparent 36%),
    radial-gradient(
      circle at 0% 100%,
      rgba(221, 107, 126, 0.04),
      transparent 32%),
    linear-gradient(
      145deg,
      var(--auth-dark-panel-raised),
      var(--auth-dark-panel));
}
body.platform-web.dark :is(.login-content, .login-email-content, .user-name-content, .profile-select-content) :is(.login-welcome-title, .login-email-welcome-title, .user-name-welcome-title) {
  color: var(--auth-dark-accent);
}
body.platform-web.dark :is(.login-content, .login-email-content, .user-name-content, .profile-select-content) :is(.login-signin-card, .login-email-signin-card, .user-name-signin-card, .profile-select-signin-card) {
  --background: transparent;
  background: transparent;
}
body.platform-web.dark :is(.login-content, .login-email-content, .user-name-content, .profile-select-content) :is(.login-signin-card, .login-email-signin-card, .user-name-signin-card, .profile-select-signin-card) ion-card-title {
  color: var(--auth-dark-text) !important;
}
body.platform-web.dark :is(.login-content, .login-email-content, .user-name-content, .profile-select-content) :is(.login-signin-card, .login-email-signin-card, .user-name-signin-card, .profile-select-signin-card) ion-card-subtitle {
  color: var(--auth-dark-muted) !important;
}
body.platform-web.dark :is(.login-content, .login-email-content, .user-name-content, .profile-select-content) :is(.login-form-label, .login-email-form-label, .user-name-form-label) {
  color: var(--auth-dark-text) !important;
}
body.platform-web.dark :is(.login-content, .login-email-content, .user-name-content, .profile-select-content) .user-name-card-eyebrow {
  color: var(--auth-dark-accent);
}
body.platform-web.dark :is(.login-content, .login-email-content, .user-name-content, .profile-select-content) .user-name-form-group {
  border-color: var(--auth-dark-border);
  background: rgba(13, 19, 15, 0.72);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03);
}
body.platform-web.dark :is(.login-content, .login-email-content, .user-name-content, .profile-select-content) .profile-select-card-eyebrow {
  color: var(--auth-dark-accent);
}
body.platform-web.dark :is(.login-content, .login-email-content, .user-name-content, .profile-select-content) .profile-select-back {
  color: var(--auth-dark-muted);
}
body.platform-web.dark :is(.login-content, .login-email-content, .user-name-content, .profile-select-content) .profile-select-back:hover {
  color: var(--auth-dark-accent);
}
body.platform-web.dark :is(.login-content, .login-email-content, .user-name-content, .profile-select-content) .profile-select-option {
  --background: rgb(13 19 15 / 74%);
  --background-hover: #202b23;
  --background-activated: #263329;
}
body.platform-web.dark :is(.login-content, .login-email-content, .user-name-content, .profile-select-content) .profile-select-option::part(native) {
  border-color: var(--auth-dark-border);
  background: var(--background);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03);
}
body.platform-web.dark :is(.login-content, .login-email-content, .user-name-content, .profile-select-content) .profile-select-option:hover::part(native) {
  border-color: var(--auth-dark-border-strong);
  background: var(--background-hover);
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.26), inset 0 1px 0 rgba(255, 255, 255, 0.04);
}
body.platform-web.dark :is(.login-content, .login-email-content, .user-name-content, .profile-select-content) .profile-select-option .profile-select-option-header .option-icon {
  background: rgba(168, 207, 143, 0.11);
  color: var(--auth-dark-accent) !important;
}
body.platform-web.dark :is(.login-content, .login-email-content, .user-name-content, .profile-select-content) .profile-select-option .profile-select-option-header .option-title {
  color: var(--auth-dark-text) !important;
}
body.platform-web.dark :is(.login-content, .login-email-content, .user-name-content, .profile-select-content) .profile-select-option .option-description {
  color: var(--auth-dark-muted) !important;
}
body.platform-web.dark :is(.login-content, .login-email-content, .user-name-content, .profile-select-content) .profile-select-option .check-icon {
  color: var(--auth-dark-accent) !important;
}
body.platform-web.dark :is(.login-content, .login-email-content, .user-name-content, .profile-select-content) .profile-select-option.selected {
  --background: rgb(168 207 143 / 12%);
}
body.platform-web.dark :is(.login-content, .login-email-content, .user-name-content, .profile-select-content) .profile-select-option.selected::part(native) {
  border-color: var(--auth-dark-accent);
  background:
    linear-gradient(
      135deg,
      rgba(168, 207, 143, 0.14),
      rgba(23, 32, 25, 0.96));
  box-shadow: 0 0 0 2px rgba(168, 207, 143, 0.08), 0 12px 28px rgba(0, 0, 0, 0.24);
}
body.platform-web.dark :is(.login-content, .login-email-content, .user-name-content, .profile-select-content) .profile-select-option.selected .option-icon {
  background: var(--auth-dark-accent);
  color: #101612 !important;
}
body.platform-web.dark :is(.login-content, .login-email-content, .user-name-content, .profile-select-content) .profile-select-option.selected .option-title {
  color: var(--auth-dark-text) !important;
}
body.platform-web.dark :is(.login-content, .login-email-content, .user-name-content, .profile-select-content) .profile-select-option.selected .option-description {
  color: var(--auth-dark-muted) !important;
}
body.platform-web.dark :is(.login-content, .login-email-content, .user-name-content, .profile-select-content) .profile-select-option.selected .check-icon {
  color: var(--auth-dark-accent) !important;
}
body.platform-web.dark :is(.login-content, .login-email-content, .user-name-content, .profile-select-content) .profile-select-continue-btn {
  --background: #a5ce89;
  --background-hover: #b3d999;
  --background-activated: #95be7b;
  --color: #0b110d;
}
body.platform-web.dark :is(.login-content, .login-email-content, .user-name-content, .profile-select-content) .profile-select-continue-btn.button-disabled {
  --background: #2a352e;
  --color: #7f8b83;
  opacity: 1;
}
body.platform-web.dark :is(.login-content, .login-email-content, .user-name-content, .profile-select-content) :is(.input-wrapper, .input-wrapper-stretch) {
  border-color: var(--auth-dark-border);
  background: var(--auth-dark-control);
  box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.34);
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}
body.platform-web.dark :is(.login-content, .login-email-content, .user-name-content, .profile-select-content) :is(.input-wrapper, .input-wrapper-stretch):focus-within {
  border-color: var(--auth-dark-border-strong);
  background: #101812;
  box-shadow: 0 0 0 3px rgba(168, 207, 143, 0.1), inset 0 1px 4px rgba(0, 0, 0, 0.3);
}
body.platform-web.dark :is(.login-content, .login-email-content, .user-name-content, .profile-select-content) .country-dropdown {
  border-color: var(--auth-dark-border-strong);
  background: #151d17;
  box-shadow: 0 22px 52px rgba(0, 0, 0, 0.46), 0 6px 16px rgba(0, 0, 0, 0.24);
}
body.platform-web.dark :is(.login-content, .login-email-content, .user-name-content, .profile-select-content) .country-dropdown-header {
  border-color: var(--auth-dark-border);
  color: var(--auth-dark-text);
}
body.platform-web.dark :is(.login-content, .login-email-content, .user-name-content, .profile-select-content) .country-dropdown-option {
  color: var(--auth-dark-text);
}
body.platform-web.dark :is(.login-content, .login-email-content, .user-name-content, .profile-select-content) .country-dropdown-option:hover,
body.platform-web.dark :is(.login-content, .login-email-content, .user-name-content, .profile-select-content) .country-dropdown-option:focus-visible {
  background: #202b23;
}
body.platform-web.dark :is(.login-content, .login-email-content, .user-name-content, .profile-select-content) .country-dropdown-option.selected {
  background: rgba(168, 207, 143, 0.14);
}
body.platform-web.dark :is(.login-content, .login-email-content, .user-name-content, .profile-select-content) .country-dropdown-flag {
  border-color: var(--auth-dark-border);
}
body.platform-web.dark :is(.login-content, .login-email-content, .user-name-content, .profile-select-content) .country-dropdown-copy small {
  color: var(--auth-dark-muted);
}
body.platform-web.dark :is(.login-content, .login-email-content, .user-name-content, .profile-select-content) .country-dropdown-check {
  color: var(--auth-dark-accent);
}
body.platform-web.dark :is(.login-content, .login-email-content, .user-name-content, .profile-select-content) .input-country-selector {
  border-color: var(--auth-dark-border);
  background: var(--auth-dark-panel-raised);
  color: var(--auth-dark-text);
}
body.platform-web.dark :is(.login-content, .login-email-content, .user-name-content, .profile-select-content) .country-code,
body.platform-web.dark :is(.login-content, .login-email-content, .user-name-content, .profile-select-content) .dropdown-icon,
body.platform-web.dark :is(.login-content, .login-email-content, .user-name-content, .profile-select-content) .input-field {
  color: var(--auth-dark-text);
}
body.platform-web.dark :is(.login-content, .login-email-content, .user-name-content, .profile-select-content) .input-field {
  background: transparent;
  caret-color: var(--auth-dark-accent);
}
body.platform-web.dark :is(.login-content, .login-email-content, .user-name-content, .profile-select-content) .input-field::placeholder {
  color: #727f76;
  opacity: 1;
}
body.platform-web.dark :is(.login-content, .login-email-content, .user-name-content, .profile-select-content) :is(.login-next-btn, .login-email-next-btn, .user-name-next-btn) {
  --background: #a5ce89;
  --background-hover: #b3d999;
  --background-activated: #95be7b;
  --box-shadow: 0 12px 28px rgb(0 0 0 / 24%);
  --color: #0b110d;
}
body.platform-web.dark :is(.login-content, .login-email-content, .user-name-content, .profile-select-content) :is(.login-next-btn, .login-email-next-btn, .user-name-next-btn).button-disabled {
  --background: #2a352e;
  --box-shadow: none;
  --color: #7f8b83;
  opacity: 1;
}
body.platform-web.dark :is(.login-content, .login-email-content, .user-name-content, .profile-select-content) :is(.login-divider, .login-email-divider)::before {
  background: var(--auth-dark-border);
}
body.platform-web.dark :is(.login-content, .login-email-content, .user-name-content, .profile-select-content) :is(.login-divider, .login-email-divider) .divider-text {
  background: var(--auth-dark-panel);
  color: var(--auth-dark-muted);
}
body.platform-web.dark :is(.login-content, .login-email-content, .user-name-content, .profile-select-content) :is(.login-social-buttons, .login-email-social-buttons) ion-button {
  --background: var(--auth-dark-panel-raised);
  --background-hover: #202b23;
  --background-activated: #263329;
  --border-color: var(--auth-dark-border);
  --color: var(--auth-dark-text);
  --box-shadow: none;
}
body.platform-web.dark :is(.login-content, .login-email-content, .user-name-content, .profile-select-content) :is(.login-social-buttons, .login-email-social-buttons) ion-button:hover {
  --border-color: var(--auth-dark-border-strong);
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.24);
}
body.platform-web.dark :is(.login-content, .login-email-content, .user-name-content, .profile-select-content) :is(.login-social-buttons, .login-email-social-buttons) ion-button ion-icon {
  color: var(--auth-dark-accent);
}
body.platform-web.dark :is(.login-content, .login-email-content, .user-name-content, .profile-select-content) .input-error-message {
  color: #f28b99;
}
@media (width < 860px) {
  body.platform-web.dark :is(.login-content, .login-email-content, .user-name-content, .profile-select-content) .login-web-brand {
    border-right: 0;
    border-bottom: 1px solid rgba(205, 226, 210, 0.09);
  }
}
body.platform-web.dark .otp-content {
  --auth-dark-canvas: #090e0b;
  --auth-dark-panel: #121914;
  --auth-dark-panel-raised: #172019;
  --auth-dark-control: #0d130f;
  --auth-dark-border: rgb(205 226 210 / 13%);
  --auth-dark-border-strong: rgb(168 207 143 / 48%);
  --auth-dark-text: #f2f6f3;
  --auth-dark-muted: #9da9a1;
  --auth-dark-accent: #acd391;
  --background:
    radial-gradient(
      circle at 12% 16%,
      rgb(114 157 91 / 20%),
      transparent 31%),
    radial-gradient(
      circle at 88% 84%,
      rgb(221 107 126 / 9%),
      transparent 28%),
    linear-gradient(
      135deg,
      #08100b 0%,
      #0d1410 52%,
      #101612 100%);
  color: var(--auth-dark-text);
}
body.platform-web.dark .otp-content .otp-container {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background:
    radial-gradient(
      circle at 14% 16%,
      rgba(114, 157, 91, 0.18),
      transparent 31%),
    radial-gradient(
      circle at 87% 84%,
      rgba(221, 107, 126, 0.07),
      transparent 28%),
    linear-gradient(
      135deg,
      #08100b 0%,
      #0d1410 52%,
      #101612 100%);
}
body.platform-web.dark .otp-content .otp-container::before,
body.platform-web.dark .otp-content .otp-container::after {
  content: "";
  position: absolute;
  z-index: 0;
  border-radius: 50%;
  pointer-events: none;
}
body.platform-web.dark .otp-content .otp-container::before {
  top: -180px;
  left: -140px;
  width: 440px;
  height: 440px;
  border: 1px solid rgba(168, 207, 143, 0.12);
  box-shadow: 0 0 0 54px rgba(168, 207, 143, 0.04), 0 0 0 108px rgba(168, 207, 143, 0.02);
}
body.platform-web.dark .otp-content .otp-container::after {
  right: -120px;
  bottom: -180px;
  width: 380px;
  height: 380px;
  background: rgba(229, 126, 145, 0.07);
  box-shadow: 0 0 110px rgba(229, 126, 145, 0.09);
}
body.platform-web.dark .otp-content .otp-row {
  position: relative;
  z-index: 1;
}
body.platform-web.dark .otp-content .otp-row > ion-col {
  border-color: var(--auth-dark-border);
  background: var(--auth-dark-panel);
  border-radius: 28px;
  box-shadow:
    0 42px 110px rgba(0, 0, 0, 0.48),
    0 12px 34px rgba(0, 0, 0, 0.28),
    inset 0 1px 0 rgba(255, 255, 255, 0.04);
}
body.platform-web.dark .otp-content .login-web-brand {
  border-right: 1px solid rgba(205, 226, 210, 0.09);
  background:
    radial-gradient(
      circle at 82% 20%,
      rgba(255, 255, 255, 0.09),
      transparent 28%),
    linear-gradient(
      145deg,
      #3f6038 0%,
      #527548 52%,
      #304c2c 100%);
}
body.platform-web.dark .otp-content .login-web-brand::after {
  content: "";
  position: absolute;
  right: -90px;
  bottom: -110px;
  z-index: 1;
  width: 330px;
  height: 330px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 50%;
  box-shadow: 0 0 0 46px rgba(255, 255, 255, 0.02), 0 0 0 92px rgba(255, 255, 255, 0.01);
}
body.platform-web.dark .otp-content .login-web-brand-mark {
  background: #f3f7f2;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.26);
}
body.platform-web.dark .otp-content .otp-content-wrapper {
  background:
    radial-gradient(
      circle at 100% 0%,
      rgba(168, 207, 143, 0.08),
      transparent 36%),
    radial-gradient(
      circle at 0% 100%,
      rgba(221, 107, 126, 0.04),
      transparent 32%),
    linear-gradient(
      145deg,
      var(--auth-dark-panel-raised),
      var(--auth-dark-panel));
}
body.platform-web.dark .otp-content .otp-web-back {
  color: var(--auth-dark-muted);
}
body.platform-web.dark .otp-content .otp-web-back:hover {
  color: var(--auth-dark-accent);
}
body.platform-web.dark .otp-content .otp-card {
  --background: transparent;
  background: transparent;
}
body.platform-web.dark .otp-content .otp-card ion-card-title {
  color: var(--auth-dark-text) !important;
}
body.platform-web.dark .otp-content .otp-card ion-card-subtitle {
  color: var(--auth-dark-muted) !important;
}
body.platform-web.dark .otp-content .otp-card-eyebrow {
  color: var(--auth-dark-accent);
}
body.platform-web.dark .otp-content .otp-form-group {
  border-color: var(--auth-dark-border);
  background: rgba(13, 19, 15, 0.72);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
}
body.platform-web.dark .otp-content .input-otp {
  border-color: var(--auth-dark-border);
  background: var(--auth-dark-control);
  color: var(--auth-dark-text);
  caret-color: var(--auth-dark-accent);
  box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.34);
  transition:
    border-color 180ms ease,
    background-color 180ms ease,
    box-shadow 180ms ease,
    transform 180ms ease;
}
body.platform-web.dark .otp-content .input-otp:hover:not(:disabled) {
  border-color: rgba(168, 207, 143, 0.28);
  background: #101812;
}
body.platform-web.dark .otp-content .input-otp:focus {
  border-color: var(--auth-dark-accent);
  background: #111a13;
  box-shadow: 0 0 0 3px rgba(168, 207, 143, 0.11), 0 10px 22px rgba(0, 0, 0, 0.2);
  transform: translateY(-1px);
}
body.platform-web.dark .otp-content .input-otp-container.error .input-otp {
  border-color: #f27f8f !important;
  background: rgba(242, 127, 143, 0.08);
  color: #ff9cab;
}
body.platform-web.dark .otp-content .input-otp-container.blocked .input-otp {
  border-color: var(--auth-dark-border);
  background: #151b17;
  color: #68736c;
  opacity: 0.72;
}
body.platform-web.dark .otp-content .otp-timer {
  color: var(--auth-dark-accent);
  font-variant-numeric: tabular-nums;
}
body.platform-web.dark .otp-content .otp-resend-text {
  color: var(--auth-dark-muted);
}
body.platform-web.dark .otp-content .otp-resend-link {
  color: var(--auth-dark-accent);
  text-decoration-color: rgba(172, 211, 145, 0.45);
}
body.platform-web.dark .otp-content .otp-resend-link:hover:not(:disabled) {
  color: #c2e2ab;
}
body.platform-web.dark .otp-content .otp-resend-link:disabled,
body.platform-web.dark .otp-content .otp-resend-link.disabled {
  color: #68736c;
  opacity: 1;
}
body.platform-web.dark .otp-content .otp-error-message {
  color: #f28b99;
}
body.platform-web.dark .otp-content .otp-signin-btn {
  --background: #a5ce89;
  --background-hover: #b3d999;
  --background-activated: #95be7b;
  --box-shadow: 0 12px 28px rgb(0 0 0 / 24%);
  --color: #0b110d;
}
body.platform-web.dark .otp-content .otp-signin-btn.button-disabled {
  --background: #2a352e;
  --box-shadow: none;
  --color: #7f8b83;
  opacity: 1;
}
body.platform-web.dark .otp-content .otp-signin-btn:not(.button-disabled):hover {
  transform: translateY(-1px);
}
@media (width < 860px) {
  body.platform-web.dark .otp-content .login-web-brand {
    border-right: 0;
    border-bottom: 1px solid rgba(205, 226, 210, 0.09);
  }
}
body.platform-web.dark .signup-mother-content {
  --signup-dark-panel: #121914;
  --signup-dark-raised: #172019;
  --signup-dark-control: #0d130f;
  --signup-dark-border: rgb(205 226 210 / 13%);
  --signup-dark-border-strong: rgb(168 207 143 / 42%);
  --signup-dark-text: #f2f6f3;
  --signup-dark-muted: #9da9a1;
  --signup-dark-accent: #acd391;
  --background:
    radial-gradient(
      circle at 12% 16%,
      rgb(114 157 91 / 20%),
      transparent 31%),
    radial-gradient(
      circle at 88% 84%,
      rgb(221 107 126 / 9%),
      transparent 28%),
    linear-gradient(
      135deg,
      #08100b 0%,
      #0d1410 52%,
      #101612 100%);
}
body.platform-web.dark .signup-mother-content .signup-mother-container {
  background:
    radial-gradient(
      circle at 14% 16%,
      rgba(114, 157, 91, 0.18),
      transparent 31%),
    radial-gradient(
      circle at 87% 84%,
      rgba(221, 107, 126, 0.07),
      transparent 28%),
    linear-gradient(
      135deg,
      #08100b 0%,
      #0d1410 52%,
      #101612 100%);
}
body.platform-web.dark .signup-mother-content .signup-mother-row > ion-col {
  border-color: var(--signup-dark-border);
  background: var(--signup-dark-panel);
  box-shadow:
    0 42px 110px rgba(0, 0, 0, 0.48),
    0 12px 34px rgba(0, 0, 0, 0.28),
    inset 0 1px 0 rgba(255, 255, 255, 0.04);
}
body.platform-web.dark .signup-mother-content .login-web-brand {
  border-right: 1px solid rgba(205, 226, 210, 0.09);
  background:
    radial-gradient(
      circle at 82% 20%,
      rgba(255, 255, 255, 0.09),
      transparent 28%),
    linear-gradient(
      145deg,
      #3f6038 0%,
      #527548 52%,
      #304c2c 100%);
}
body.platform-web.dark .signup-mother-content .signup-mother-content-wrapper {
  background:
    radial-gradient(
      circle at 100% 0%,
      rgba(168, 207, 143, 0.08),
      transparent 36%),
    radial-gradient(
      circle at 0% 100%,
      rgba(221, 107, 126, 0.04),
      transparent 32%),
    linear-gradient(
      145deg,
      var(--signup-dark-raised),
      var(--signup-dark-panel));
}
body.platform-web.dark .signup-mother-content .signup-mother-back,
body.platform-web.dark .signup-mother-content .signup-mother-web-heading p {
  color: var(--signup-dark-muted);
}
body.platform-web.dark .signup-mother-content .signup-mother-back:hover,
body.platform-web.dark .signup-mother-content .signup-mother-web-eyebrow {
  color: var(--signup-dark-accent);
}
body.platform-web.dark .signup-mother-content .signup-mother-web-heading h1,
body.platform-web.dark .signup-mother-content .signup-mother-label {
  color: var(--signup-dark-text);
}
body.platform-web.dark .signup-mother-content .signup-mother-form {
  border-color: var(--signup-dark-border);
  background: rgba(13, 19, 15, 0.72);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03);
}
body.platform-web.dark .signup-mother-content .signup-mother-input-wrapper .input-wrapper {
  border-color: var(--signup-dark-border);
  background: var(--signup-dark-control);
}
body.platform-web.dark .signup-mother-content .signup-mother-input-wrapper .input-wrapper:focus-within {
  border-color: var(--signup-dark-border-strong);
  background: #101812;
  box-shadow: 0 0 0 3px rgba(168, 207, 143, 0.1);
}
body.platform-web.dark .signup-mother-content .signup-mother-input-wrapper .input-field {
  color: var(--signup-dark-text);
}
body.platform-web.dark .signup-mother-content .signup-mother-input-wrapper .input-field::placeholder {
  color: #727f76;
}
body.platform-web.dark .signup-mother-content .signup-mother-gender-btn {
  border-color: var(--signup-dark-border);
  background: var(--signup-dark-control);
  color: var(--signup-dark-text);
}
body.platform-web.dark .signup-mother-content .signup-mother-gender-btn:hover {
  border-color: var(--signup-dark-border-strong);
  background: #202b23;
}
body.platform-web.dark .signup-mother-content .signup-mother-gender-btn.active {
  border-color: var(--signup-dark-accent);
  background: rgba(168, 207, 143, 0.12);
}
body.platform-web.dark .signup-mother-content .signup-mother-gender-btn.active .gender-icon {
  color: var(--signup-dark-accent);
}
body.platform-web.dark .signup-mother-content .signup-mother-child-item {
  --background: var(--signup-dark-raised);
  --color: var(--signup-dark-text);
  border-color: var(--signup-dark-border);
}
body.platform-web.dark .signup-mother-content .signup-mother-child-item .child-info {
  color: var(--signup-dark-text);
}
body.platform-web.dark .signup-mother-content .signup-mother-child-item .child-info ion-text {
  --color: var(--signup-dark-muted);
  color: var(--signup-dark-muted) !important;
}
body.platform-web.dark .signup-mother-content .signup-mother-child-item .child-info ion-text p {
  color: var(--signup-dark-muted) !important;
}
body.platform-web.dark .signup-mother-content .signup-mother-child-item .child-name p {
  color: var(--signup-dark-text) !important;
}
body.platform-web.dark .signup-mother-content .signup-mother-child-item .child-actions .edit-btn {
  --color: var(--signup-dark-accent) !important;
  color: var(--signup-dark-accent) !important;
}
body.platform-web.dark .signup-mother-content .signup-mother-child-item .child-actions .edit-btn ion-icon {
  color: var(--signup-dark-accent) !important;
}
body.platform-web.dark .signup-mother-content .signup-mother-child-item .child-actions .edit-btn:hover {
  --color: #c1e3aa !important;
  background: rgba(168, 207, 143, 0.1);
}
body.platform-web.dark .signup-mother-content .signup-mother-add-more-btn {
  --border-color: var(--signup-dark-border-strong);
  --background: rgb(168 207 143 / 7%);
  --color: var(--signup-dark-accent);
}
body.platform-web.dark .signup-mother-content .signup-mother-add-more-btn.button-disabled {
  --background: #202a23;
  --border-color: #465249;
  --color: #aab5ad;
  color: #aab5ad !important;
}
body.platform-web.dark .signup-mother-content .signup-mother-add-more-btn.button-disabled span {
  color: #aab5ad !important;
}
body.platform-web.dark .signup-mother-content .signup-mother-next-btn {
  --background: #a5ce89;
  --background-hover: #b3d999;
  --background-activated: #95be7b;
  --color: #0b110d;
}
body.platform-web.dark .signup-mother-content .signup-mother-next-btn.button-disabled {
  --background: #2a352e;
  --color: #7f8b83;
}
@media (width < 900px) {
  body.platform-web.dark .signup-mother-content .login-web-brand {
    border-right: 0;
    border-bottom: 1px solid rgba(205, 226, 210, 0.09);
  }
}
body.platform-web.dark .signup-pregnant-content {
  --signup-dark-panel: #121914;
  --signup-dark-raised: #172019;
  --signup-dark-control: #0d130f;
  --signup-dark-border: rgb(205 226 210 / 13%);
  --signup-dark-border-strong: rgb(168 207 143 / 42%);
  --signup-dark-text: #f2f6f3;
  --signup-dark-muted: #9da9a1;
  --signup-dark-accent: #acd391;
  --background:
    radial-gradient(
      circle at 12% 16%,
      rgb(114 157 91 / 20%),
      transparent 31%),
    radial-gradient(
      circle at 88% 84%,
      rgb(221 107 126 / 9%),
      transparent 28%),
    linear-gradient(
      135deg,
      #08100b 0%,
      #0d1410 52%,
      #101612 100%);
}
body.platform-web.dark .signup-pregnant-content .signup-pregnant-container {
  background:
    radial-gradient(
      circle at 14% 16%,
      rgba(114, 157, 91, 0.18),
      transparent 31%),
    radial-gradient(
      circle at 87% 84%,
      rgba(221, 107, 126, 0.07),
      transparent 28%),
    linear-gradient(
      135deg,
      #08100b 0%,
      #0d1410 52%,
      #101612 100%);
}
body.platform-web.dark .signup-pregnant-content .signup-pregnant-row > ion-col {
  border-color: var(--signup-dark-border);
  background: var(--signup-dark-panel);
  box-shadow:
    0 42px 110px rgba(0, 0, 0, 0.48),
    0 12px 34px rgba(0, 0, 0, 0.28),
    inset 0 1px 0 rgba(255, 255, 255, 0.04);
}
body.platform-web.dark .signup-pregnant-content .login-web-brand {
  border-right: 1px solid rgba(205, 226, 210, 0.09);
  background:
    radial-gradient(
      circle at 82% 20%,
      rgba(255, 255, 255, 0.09),
      transparent 28%),
    linear-gradient(
      145deg,
      #3f6038 0%,
      #527548 52%,
      #304c2c 100%);
}
body.platform-web.dark .signup-pregnant-content .signup-pregnant-content-wrapper {
  background:
    radial-gradient(
      circle at 100% 0%,
      rgba(168, 207, 143, 0.08),
      transparent 36%),
    radial-gradient(
      circle at 0% 100%,
      rgba(221, 107, 126, 0.04),
      transparent 32%),
    linear-gradient(
      145deg,
      var(--signup-dark-raised),
      var(--signup-dark-panel));
}
body.platform-web.dark .signup-pregnant-content .signup-pregnant-back,
body.platform-web.dark .signup-pregnant-content .signup-pregnant-web-heading p,
body.platform-web.dark .signup-pregnant-content .signup-pregnant-date-heading small {
  color: var(--signup-dark-muted);
}
body.platform-web.dark .signup-pregnant-content .signup-pregnant-back:hover,
body.platform-web.dark .signup-pregnant-content .signup-pregnant-web-eyebrow {
  color: var(--signup-dark-accent);
}
body.platform-web.dark .signup-pregnant-content .signup-pregnant-web-heading h1,
body.platform-web.dark .signup-pregnant-content .signup-pregnant-date-heading span {
  color: var(--signup-dark-text);
}
body.platform-web.dark .signup-pregnant-content .signup-pregnant-form {
  border-color: var(--signup-dark-border);
  background: rgba(13, 19, 15, 0.72);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03);
}
body.platform-web.dark .signup-pregnant-content .signup-pregnant-toggle-btn {
  border-color: var(--signup-dark-border);
  background: var(--signup-dark-control);
  color: var(--signup-dark-text);
}
body.platform-web.dark .signup-pregnant-content .signup-pregnant-toggle-btn:hover {
  border-color: var(--signup-dark-border-strong);
  background: #202b23;
}
body.platform-web.dark .signup-pregnant-content .signup-pregnant-toggle-btn.active {
  border-color: var(--signup-dark-accent);
  background: rgba(168, 207, 143, 0.12);
}
body.platform-web.dark .signup-pregnant-content .signup-pregnant-toggle-btn.active .toggle-icon {
  color: var(--signup-dark-accent);
}
body.platform-web.dark .signup-pregnant-content .signup-pregnant-datetime-wrapper {
  border-color: var(--signup-dark-border);
  background: var(--signup-dark-control);
}
body.platform-web.dark .signup-pregnant-content .signup-pregnant-datetime-wrapper ion-datetime {
  color: var(--signup-dark-text);
  --background: transparent;
  --background-rgb:
    13,
    19,
    15;
  --wheel-fade-background-rgb:
    13,
    19,
    15;
  --ion-color-step-300: #39443c;
  --ion-color-step-650: #9da9a1;
  --ion-text-color: var(--signup-dark-text);
}
body.platform-web.dark .signup-pregnant-content .signup-pregnant-datetime-wrapper ion-datetime::part(wheel-item) {
  color: #9da9a1;
  opacity: 0.76;
}
body.platform-web.dark .signup-pregnant-content .signup-pregnant-datetime-wrapper ion-datetime::part(wheel-item-active) {
  color: var(--signup-dark-text);
  opacity: 1;
}
body.platform-web.dark .signup-pregnant-content .signup-pregnant-next-btn {
  --background: #a5ce89;
  --background-hover: #b3d999;
  --background-activated: #95be7b;
  --color: #0b110d;
}
body.platform-web.dark .signup-pregnant-content .signup-pregnant-next-btn.button-disabled {
  --background: #2a352e;
  --color: #7f8b83;
}
@media (width < 900px) {
  body.platform-web.dark .signup-pregnant-content .login-web-brand {
    border-right: 0;
    border-bottom: 1px solid rgba(205, 226, 210, 0.09);
  }
}
body.platform-web.dark app-header-container.shop-header {
  --background: transparent !important;
  background:
    radial-gradient(
      circle at 84% 6%,
      rgba(168, 207, 143, 0.07),
      transparent 34rem),
    linear-gradient(
      180deg,
      #0b120e 0%,
      #080d0a 52%,
      #060a07 100%) !important;
  border-bottom-color: rgba(205, 226, 210, 0.09);
  box-shadow: inset 0 -1px 0 rgba(205, 226, 210, 0.04);
}
body.platform-web.dark app-header-container.shop-header ion-header {
  --background: transparent !important;
  background: transparent !important;
}
body.platform-web.dark app-header-container.shop-header .shop-search-row {
  background: transparent !important;
}
body.platform-web.dark app-header-container.shop-header .shop-web-back {
  border-color: rgba(205, 226, 210, 0.14);
  background: #111914;
  box-shadow: 0 10px 26px rgba(0, 0, 0, 0.24);
  color: #acd391;
}
body.platform-web.dark app-header-container.shop-header .shop-web-back:hover {
  border-color: rgba(168, 207, 143, 0.44);
  background: #172019;
  box-shadow: 0 14px 30px rgba(0, 0, 0, 0.3);
}
body.platform-web.dark app-header-container.shop-header .shop-search-launcher {
  min-height: 56px;
  padding: 6px 7px;
  border: 1px solid rgba(205, 226, 210, 0.14);
  border-radius: 17px;
  background:
    linear-gradient(
      180deg,
      rgba(168, 207, 143, 0.04),
      transparent),
    #111914;
  color: #f2f6f3;
  box-shadow: 0 14px 34px rgba(0, 0, 0, 0.24), inset 0 1px 0 rgba(255, 255, 255, 0.04);
}
body.platform-web.dark app-header-container.shop-header .shop-search-launcher:hover {
  border-color: rgba(168, 207, 143, 0.38);
  background:
    linear-gradient(
      180deg,
      rgba(168, 207, 143, 0.07),
      transparent),
    #172019;
  box-shadow:
    0 16px 38px rgba(0, 0, 0, 0.28),
    0 0 0 3px rgba(168, 207, 143, 0.07),
    inset 0 1px 0 rgba(255, 255, 255, 0.05);
  transform: translateY(-1px);
}
body.platform-web.dark app-header-container.shop-header .shop-search-launcher:focus-visible {
  border-color: rgba(168, 207, 143, 0.48);
  outline: 3px solid rgba(168, 207, 143, 0.13);
  outline-offset: 3px;
  box-shadow: 0 16px 38px rgba(0, 0, 0, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.05);
}
body.platform-web.dark app-header-container.shop-header .shop-search-launcher-icon {
  border-color: rgba(168, 207, 143, 0.18);
  background:
    linear-gradient(
      145deg,
      rgba(168, 207, 143, 0.13),
      rgba(168, 207, 143, 0.05)),
    #172019;
  color: #acd391;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), 0 7px 16px rgba(0, 0, 0, 0.18);
}
body.platform-web.dark app-header-container.shop-header .shop-search-launcher-copy strong {
  color: #f2f6f3;
}
body.platform-web.dark app-header-container.shop-header .shop-search-launcher-copy > span {
  color: #9da9a1;
}
body.platform-web.dark app-header-container.shop-header .shop-search-launcher-action {
  background:
    linear-gradient(
      135deg,
      #b3d99a,
      #91bb77);
  color: #0b110d;
  box-shadow: 0 9px 22px rgba(0, 0, 0, 0.25);
}
body.platform-web.dark app-header-container.shop-header .shop-search-launcher:hover .shop-search-launcher-action {
  background:
    linear-gradient(
      135deg,
      #c0e3aa,
      #9fc585);
  box-shadow: 0 11px 26px rgba(0, 0, 0, 0.3), 0 0 0 3px rgba(168, 207, 143, 0.08);
}
body.platform-web.dark .shop-content {
  --background:
    radial-gradient(
      circle at 84% 6%,
      rgb(168 207 143 / 7%),
      transparent 34rem),
    radial-gradient(
      circle at 0% 42%,
      rgb(229 111 135 / 3%),
      transparent 28rem),
    linear-gradient(
      180deg,
      #0b120e 0%,
      #080d0a 52%,
      #060a07 100%);
  color: #f2f6f3;
}
body.platform-web.dark .shop-content::part(scroll) {
  background:
    radial-gradient(
      circle at 84% 6%,
      rgba(168, 207, 143, 0.07),
      transparent 34rem),
    radial-gradient(
      circle at 0% 42%,
      rgba(229, 111, 135, 0.03),
      transparent 28rem),
    linear-gradient(
      180deg,
      #0b120e 0%,
      #080d0a 52%,
      #060a07 100%);
}
body.platform-web.dark .shop-content > .shop-banner-shell {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  margin-top: 12px !important;
  margin-bottom: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 16px;
  background: transparent !important;
  box-shadow: none !important;
}
body.platform-web.dark .shop-content > .shop-banner-shell::before {
  display: none;
}
body.platform-web.dark .shop-content > .shop-banner-shell app-banner-carousel .banner-carousel {
  margin: 0 !important;
}
body.platform-web.dark .shop-content app-banner-carousel .banner-carousel,
body.platform-web.dark .shop-content app-banner-carousel .carousel-slides,
body.platform-web.dark .shop-content app-banner-carousel .carousel-slide {
  border-radius: 15px;
}
body.platform-web.dark .shop-content app-banner-carousel .carousel-slide {
  border: 0;
  background: transparent;
  box-shadow: none;
}
body.platform-web.dark .shop-content app-banner-carousel .carousel-image {
  object-fit: cover;
  --object-fit: cover;
}
body.platform-web.dark .shop-content app-banner-carousel .pagination-dot {
  border: 1px solid rgba(255, 255, 255, 0.16);
  background: rgba(239, 246, 240, 0.42);
}
body.platform-web.dark .shop-content app-banner-carousel .pagination-dot.active {
  border-color: #acd391;
  background: #acd391;
  box-shadow: 0 0 16px rgba(168, 207, 143, 0.34);
}
body.platform-web.dark .shop-content .shop-content-padded {
  padding-top: 2px;
}
body.platform-web.dark .shop-content .shop-category-section,
body.platform-web.dark .shop-content app-product-section {
  display: block;
  position: relative;
  padding: 24px;
  border: 1px solid rgba(205, 226, 210, 0.11);
  border-radius: 22px;
  background:
    linear-gradient(
      180deg,
      rgba(255, 255, 255, 0.025),
      transparent 38%),
    #0f1612;
  box-shadow: 0 18px 46px rgba(0, 0, 0, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.03);
}
body.platform-web.dark .shop-content .shop-category-section::before,
body.platform-web.dark .shop-content app-product-section::before {
  position: absolute;
  top: 0;
  left: 24px;
  width: 88px;
  height: 2px;
  border-radius: 0 0 999px 999px;
  background:
    linear-gradient(
      90deg,
      #a8cf8f,
      rgba(168, 207, 143, 0));
  content: "";
}
body.platform-web.dark .shop-content .shop-category-section {
  margin-block: 12px;
}
body.platform-web.dark .shop-content app-product-section {
  margin-block: 12px;
}
body.platform-web.dark .shop-content .shop-category-heading,
body.platform-web.dark .shop-content .product-section-title {
  color: #f2f6f3;
  letter-spacing: -0.02em;
}
body.platform-web.dark .shop-content .shop-category-heading {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 20px;
}
body.platform-web.dark .shop-content .shop-category-heading::after {
  flex: 1;
  height: 1px;
  background:
    linear-gradient(
      90deg,
      rgba(205, 226, 210, 0.12),
      transparent);
  content: "";
}
body.platform-web.dark .shop-content .product-section-eyebrow {
  color: #acd391;
}
body.platform-web.dark .shop-content .product-section-count,
body.platform-web.dark .shop-content app-product-card .product-card-review-count,
body.platform-web.dark .shop-content app-product-card .product-card-original-price {
  color: #9da9a1;
}
body.platform-web.dark .shop-content .shop-category-card {
  min-height: 108px;
  gap: 10px;
  border-color: rgba(205, 226, 210, 0.12);
  border-radius: 15px;
  background:
    linear-gradient(
      145deg,
      rgba(255, 255, 255, 0.03),
      transparent 48%),
    #151e18;
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.2), inset 0 1px 0 rgba(255, 255, 255, 0.03);
}
body.platform-web.dark .shop-content .shop-category-card:hover {
  border-color: rgba(168, 207, 143, 0.42);
  background:
    radial-gradient(
      circle at 50% 0%,
      rgba(168, 207, 143, 0.1),
      transparent 58%),
    #1a251e;
  box-shadow: 0 16px 34px rgba(0, 0, 0, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.04);
  transform: none;
}
body.platform-web.dark .shop-content .shop-category-card.is-selected {
  border-color: #8fba73;
  background:
    radial-gradient(
      circle at 50% 0%,
      rgba(168, 207, 143, 0.17),
      transparent 58%),
    #18241c;
  box-shadow:
    0 16px 36px rgba(0, 0, 0, 0.28),
    inset 0 0 0 1px rgba(168, 207, 143, 0.1),
    0 0 0 2px rgba(168, 207, 143, 0.05);
}
body.platform-web.dark .shop-content .shop-category-icon {
  flex-basis: 50px;
  width: 50px;
  height: 50px;
  border-radius: 14px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04), 0 8px 18px rgba(0, 0, 0, 0.18);
}
body.platform-web.dark .shop-content .shop-category-toggle {
  border: 1px solid rgba(168, 207, 143, 0.32);
  background:
    linear-gradient(
      180deg,
      rgba(168, 207, 143, 0.12),
      rgba(168, 207, 143, 0.07));
  box-shadow: none;
  color: #acd391;
}
body.platform-web.dark .shop-content .shop-category-toggle:hover {
  border-color: #acd391;
  background: #acd391;
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.22);
  color: #0b110d;
}
body.platform-web.dark .shop-content app-product-card .product-card,
body.platform-web.dark .shop-content app-product-card-skeleton .product-card-skeleton {
  border-color: rgba(205, 226, 210, 0.12);
  background:
    linear-gradient(
      145deg,
      rgba(255, 255, 255, 0.03),
      transparent 50%),
    #141d17;
  box-shadow: 0 14px 34px rgba(0, 0, 0, 0.24), inset 0 1px 0 rgba(255, 255, 255, 0.03);
}
body.platform-web.dark .shop-content app-product-card .product-card:hover {
  border-color: rgba(168, 207, 143, 0.38);
  box-shadow: 0 24px 54px rgba(0, 0, 0, 0.36), 0 0 0 2px rgba(168, 207, 143, 0.05);
}
body.platform-web.dark .shop-content app-product-card .product-card-name {
  color: #f2f6f3;
}
body.platform-web.dark .shop-content app-product-card .product-card-current-price {
  color: #f27a8d;
}
body.platform-web.dark .shop-content .product-section__link-btn {
  --background: rgb(168 207 143 / 7%);
  --background-hover: rgb(168 207 143 / 12%);
  --border-color: rgb(168 207 143 / 22%);
  --border-radius: 12px;
  --border-style: solid;
  --border-width: 1px;
  --color: #acd391;
  --padding-end: 15px;
  --padding-start: 15px;
  min-height: 38px;
  border-radius: 12px;
  color: #acd391;
}
body.platform-web.dark .shop-content .product-section__link-btn:hover {
  --border-color: rgb(168 207 143 / 42%);
}
body.platform-web.dark .shop-content app-product-card .product-card-quickview {
  border-color: rgba(205, 226, 210, 0.16);
  background: rgba(18, 25, 20, 0.94);
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.32);
  color: #f2f6f3;
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
}
body.platform-web.dark .shop-content app-product-card .product-card-quickview:hover {
  border-color: #acd391;
  color: #acd391;
}
body.platform-web.dark .shop-content .promotional-banner-carousel {
  margin-block: 12px !important;
  padding: 0 !important;
  overflow: hidden;
  border: 0 !important;
  border-radius: 16px;
  background: transparent !important;
  box-shadow: none !important;
}
body.platform-web.dark .shop-content .promotional-banner-carousel app-banner-carousel .banner-carousel {
  margin: 0 !important;
}
body.platform-web.dark .shop-content .my-order-btn {
  --background: #172019;
  --background-hover: #202b23;
  --background-activated: #263329;
  --border-color: rgb(168 207 143 / 46%);
  --color: #acd391;
}
@media (width < 768px) {
  body.platform-web.dark .shop-content .shop-content-padded {
    padding-inline: 12px;
  }
  body.platform-web.dark .shop-content .shop-category-section,
  body.platform-web.dark .shop-content app-product-section {
    padding: 14px 12px;
    border-radius: 18px;
  }
  body.platform-web.dark .shop-content .shop-category-section::before,
  body.platform-web.dark .shop-content app-product-section::before {
    left: 14px;
  }
  body.platform-web.dark .shop-content .shop-category-grid {
    gap: 10px;
  }
  body.platform-web.dark .shop-content .shop-category-card {
    min-height: 102px;
    padding: 10px 8px;
    gap: 8px;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.16), inset 0 1px 0 rgba(255, 255, 255, 0.03);
  }
  body.platform-web.dark .shop-content .shop-category-icon {
    width: 44px;
    height: 44px;
    flex: 0 0 44px;
  }
  body.platform-web.dark .shop-content .shop-category-copy strong {
    font-size: 12.5px;
    line-height: 1.25;
  }
}
@media (width <= 360px) {
  body.platform-web.dark .shop-content .shop-content-padded {
    padding-inline: 8px;
  }
  body.platform-web.dark .shop-content .shop-category-section,
  body.platform-web.dark .shop-content app-product-section {
    padding: 12px 8px;
  }
  body.platform-web.dark .shop-content .shop-category-section::before,
  body.platform-web.dark .shop-content app-product-section::before {
    left: 12px;
  }
  body.platform-web.dark .shop-content .shop-category-grid {
    gap: 8px;
  }
  body.platform-web.dark .shop-content .shop-category-card {
    min-height: 96px;
    padding: 8px 6px;
    gap: 6px;
  }
  body.platform-web.dark .shop-content .shop-category-icon {
    width: 40px;
    height: 40px;
    flex: 0 0 40px;
  }
  body.platform-web.dark .shop-content .shop-category-copy strong {
    font-size: 11.5px;
    line-height: 1.2;
  }
}
body.platform-web .category-courses-toolbar {
  display: flex;
  gap: 10px;
  align-items: center;
  width: min(100%, 1140px);
  margin: 0 auto;
}
body.platform-web .category-courses-back {
  display: grid;
  width: 48px;
  height: 48px;
  flex: 0 0 48px;
  place-items: center;
  color: var(--w-sage-hover);
  background: var(--w-card);
  border: 1px solid var(--w-border);
  border-radius: 50%;
  box-shadow: var(--w-shadow-sm);
  cursor: pointer;
}
body.platform-web .category-courses-back ion-icon {
  font-size: 20px;
}
body.platform-web .category-courses-toolbar app-header-search {
  width: 100%;
  max-width: none;
}
body.platform-web .category-content .course-catalog-intro {
  min-height: 158px;
  padding: 24px 22px;
  border-radius: 18px;
  box-shadow: 0 18px 42px rgba(71, 96, 61, 0.1);
  color: var(--w-text);
  background:
    radial-gradient(
      circle at 82% 22%,
      rgba(156, 198, 130, 0.2),
      transparent 35%),
    linear-gradient(
      115deg,
      var(--w-card) 0%,
      #f7faf4 58%,
      #eaf3e4 100%);
  border-color: #dbe6d6;
}
body.platform-web .category-content .course-catalog-intro::after {
  border-color: #648b50;
  box-shadow: 0 0 0 42px rgba(100, 139, 80, 0.04), 0 0 0 84px rgba(100, 139, 80, 0.02);
}
body.platform-web .category-content .course-catalog-intro__eyebrow {
  color: #648b50;
}
body.platform-web .category-content .course-catalog-intro__copy p {
  color: #6c776d;
}
body.platform-web .category-content .course-catalog-intro__feature {
  background: rgba(255, 255, 255, 0.82);
  border-color: #dbe6d6;
}
body.platform-web .category-content .course-catalog-intro__feature-icon {
  background: #eef6e9;
  border-color: #d3e4c9;
}
body.platform-web .category-content .course-catalog-intro__feature-icon ion-icon {
  color: #648b50;
}
body.platform-web .category-content .course-catalog-intro__feature-copy strong {
  color: #20271f;
}
body.platform-web .category-content .course-catalog-intro__feature-copy span {
  color: #788379;
}
body.platform-web .category-content .course-catalog-panel {
  width: min(100% - 48px, var(--w-max));
  margin: 0 auto 48px;
  padding: 24px;
  background: var(--w-card);
  border: 1px solid var(--w-border);
  box-shadow: var(--w-shadow-sm);
}
body.platform-web .category-content .course-catalog-heading {
  width: 100%;
  margin: 0 0 18px;
}
body.platform-web .category-content .course-catalog-panel app-paginated-list {
  width: 100%;
}
@media (width < 768px) {
  body.platform-web .category-courses-toolbar {
    width: 100%;
  }
  body.platform-web .category-courses-back {
    width: 42px;
    height: 42px;
    flex-basis: 42px;
  }
  body.platform-web .category-content .course-catalog-panel {
    width: calc(100% - 32px);
    padding: 18px;
  }
}
body.platform-web.dark .category-content .course-catalog-intro {
  color: var(--w-text);
  background:
    radial-gradient(
      circle at 82% 22%,
      rgba(172, 211, 145, 0.12),
      transparent 35%),
    linear-gradient(
      115deg,
      #151d18 0%,
      #1c2a1f 58%,
      #243725 100%);
  border-color: rgba(205, 226, 210, 0.11);
}
body.platform-web.dark .category-content .course-catalog-intro__feature {
  background: rgba(8, 14, 10, 0.35);
  border-color: rgba(205, 226, 210, 0.11);
}
body.platform-web.dark .category-content .course-catalog-intro__feature-copy strong {
  color: #f2f6f3;
}
body.platform-web.dark .category-content .course-catalog-intro__feature-copy span {
  color: #a6b2aa;
}
body.platform-web:not(.dark) app-header-container.shop-header {
  --background: transparent !important;
  background:
    radial-gradient(
      circle at 84% 4%,
      rgba(123, 164, 101, 0.09),
      transparent 32rem),
    linear-gradient(
      180deg,
      #f5f8f3 0%,
      #f2f6f0 100%) !important;
  border-bottom: 1px solid rgba(96, 128, 77, 0.1);
  box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 0.72);
}
body.platform-web:not(.dark) app-header-container.shop-header ion-header {
  --background: transparent !important;
  background: transparent !important;
}
body.platform-web:not(.dark) .shop-content {
  --background:
    radial-gradient(
      circle at 86% 4%,
      rgb(123 164 101 / 10%),
      transparent 34rem),
    radial-gradient(
      circle at 0% 40%,
      rgb(229 111 135 / 5%),
      transparent 28rem),
    linear-gradient(
      180deg,
      #f6f8f4 0%,
      #f1f5ef 52%,
      #edf2eb 100%);
  color: #202720;
}
body.platform-web:not(.dark) .shop-content::part(scroll) {
  background:
    radial-gradient(
      circle at 86% 4%,
      rgba(123, 164, 101, 0.1),
      transparent 34rem),
    radial-gradient(
      circle at 0% 40%,
      rgba(229, 111, 135, 0.05),
      transparent 28rem),
    linear-gradient(
      180deg,
      #f6f8f4 0%,
      #f1f5ef 52%,
      #edf2eb 100%);
}
body.platform-web:not(.dark) .shop-content app-banner-carousel {
  --banner-fallback-color: #e7ede3;
  --banner-fallback-image:
    linear-gradient(
      135deg,
      #eff4ec 0%,
      #e1e9dd 58%,
      #d7e1d3 100%);
}
body.platform-web:not(.dark) .shop-content > .shop-banner-shell {
  margin-top: 12px !important;
  margin-bottom: 0 !important;
  padding: 0 !important;
  overflow: hidden;
  border: 0 !important;
  border-radius: 16px;
  background: transparent !important;
  box-shadow: none !important;
}
body.platform-web:not(.dark) .shop-content > .shop-banner-shell app-banner-carousel .banner-carousel {
  margin: 0 !important;
}
body.platform-web:not(.dark) .shop-content .shop-content-padded {
  padding-top: 2px;
}
body.platform-web:not(.dark) .shop-content .shop-category-section,
body.platform-web:not(.dark) .shop-content app-product-section {
  position: relative;
  display: block;
  padding: 24px;
  border: 1px solid rgba(101, 132, 82, 0.13);
  border-radius: 22px;
  background:
    linear-gradient(
      180deg,
      rgba(255, 255, 255, 0.92),
      rgba(249, 252, 247, 0.88)),
    #fff;
  box-shadow: 0 16px 42px rgba(61, 84, 48, 0.08), inset 0 1px 0 #fff;
}
body.platform-web:not(.dark) .shop-content .shop-category-section::before,
body.platform-web:not(.dark) .shop-content app-product-section::before {
  position: absolute;
  top: 0;
  left: 24px;
  width: 88px;
  height: 2px;
  border-radius: 0 0 999px 999px;
  background:
    linear-gradient(
      90deg,
      #7ea563,
      rgba(126, 165, 99, 0));
  content: "";
}
body.platform-web:not(.dark) .shop-content .shop-category-section,
body.platform-web:not(.dark) .shop-content app-product-section {
  margin-block: 12px;
}
body.platform-web:not(.dark) .shop-content .shop-category-heading {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 20px;
  color: #202720;
  letter-spacing: -0.02em;
}
body.platform-web:not(.dark) .shop-content .shop-category-heading::after {
  flex: 1;
  height: 1px;
  background:
    linear-gradient(
      90deg,
      rgba(101, 132, 82, 0.14),
      transparent);
  content: "";
}
body.platform-web:not(.dark) .shop-content .product-section-title {
  color: #202720;
  letter-spacing: -0.02em;
}
body.platform-web:not(.dark) .shop-content .product-section-eyebrow {
  color: #6f9557;
}
body.platform-web:not(.dark) .shop-content .product-section-count {
  color: #758075;
}
body.platform-web:not(.dark) .shop-content .shop-category-card {
  min-height: 108px;
  gap: 10px;
  border-color: rgba(101, 132, 82, 0.14);
  border-radius: 15px;
  background:
    linear-gradient(
      145deg,
      #fff,
      #f7faf5);
  box-shadow: 0 9px 22px rgba(61, 84, 48, 0.07), inset 0 1px 0 #fff;
}
body.platform-web:not(.dark) .shop-content .shop-category-card:hover {
  border-color: rgba(111, 149, 87, 0.42);
  background:
    linear-gradient(
      145deg,
      #fff,
      #f0f7ec);
  box-shadow: 0 14px 30px rgba(61, 84, 48, 0.12), 0 0 0 2px rgba(123, 164, 101, 0.05);
  transform: none;
}
body.platform-web:not(.dark) .shop-content .shop-category-card.is-selected {
  border-color: #7da461;
  background:
    radial-gradient(
      circle at 50% 0%,
      rgba(123, 164, 101, 0.15),
      transparent 60%),
    linear-gradient(
      145deg,
      #f9fcf7,
      #edf6e8);
  box-shadow: 0 14px 30px rgba(61, 84, 48, 0.13), inset 0 0 0 1px rgba(123, 164, 101, 0.08);
}
body.platform-web:not(.dark) .shop-content .shop-category-icon {
  flex-basis: 50px;
  width: 50px;
  height: 50px;
  border-radius: 14px;
  box-shadow: 0 7px 16px rgba(61, 84, 48, 0.09), inset 0 1px 0 rgba(255, 255, 255, 0.84);
}
body.platform-web:not(.dark) .shop-content .shop-category-toggle {
  border: 1px solid rgba(111, 149, 87, 0.28);
  background:
    linear-gradient(
      180deg,
      #f4f9f1,
      #ebf4e6);
  color: #63834f;
  box-shadow: 0 7px 16px rgba(61, 84, 48, 0.07);
}
body.platform-web:not(.dark) .shop-content .shop-category-toggle:hover {
  border-color: #7da461;
  background: #7da461;
  color: #fff;
}
body.platform-web:not(.dark) .shop-content app-product-card .product-card,
body.platform-web:not(.dark) .shop-content app-product-card-skeleton .product-card-skeleton {
  border-color: rgba(101, 132, 82, 0.13);
  background:
    linear-gradient(
      145deg,
      #fff,
      #f8faf7);
  box-shadow: 0 11px 28px rgba(61, 84, 48, 0.08), inset 0 1px 0 #fff;
}
body.platform-web:not(.dark) .shop-content app-product-card .product-card:hover {
  border-color: rgba(111, 149, 87, 0.36);
  box-shadow: 0 19px 42px rgba(61, 84, 48, 0.14), 0 0 0 2px rgba(123, 164, 101, 0.04);
}
body.platform-web:not(.dark) .shop-content .product-section__link-btn {
  --background: rgb(123 164 101 / 8%);
  --background-hover: rgb(123 164 101 / 14%);
  --border-color: rgb(111 149 87 / 22%);
  --border-radius: 12px;
  --border-style: solid;
  --border-width: 1px;
  --color: #63834f;
  --padding-end: 15px;
  --padding-start: 15px;
  min-height: 38px;
}
body.platform-web:not(.dark) .shop-content .promotional-banner-carousel {
  margin-block: 12px !important;
  padding: 0 !important;
  overflow: hidden;
  border: 0 !important;
  border-radius: 16px;
  background: transparent !important;
  box-shadow: none !important;
}
body.platform-web:not(.dark) .shop-content .promotional-banner-carousel app-banner-carousel .banner-carousel {
  margin: 0 !important;
}
@media (width < 768px) {
  body.platform-web:not(.dark) .shop-content .shop-category-section,
  body.platform-web:not(.dark) .shop-content app-product-section {
    padding: 20px;
    border-radius: 18px;
  }
}
body.platform-web:not(.dark) .search-product-header {
  background:
    radial-gradient(
      circle at 84% 4%,
      rgba(123, 164, 101, 0.09),
      transparent 32rem),
    linear-gradient(
      180deg,
      #f5f8f3 0%,
      #f2f6f0 100%) !important;
  border-bottom: 1px solid rgba(96, 128, 77, 0.1);
  box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 0.72) !important;
}
body.platform-web:not(.dark) .search-product-header,
body.platform-web:not(.dark) .search-product-header ion-header,
body.platform-web:not(.dark) .search-product-header app-header-search {
  --background: transparent !important;
  background: transparent !important;
}
body.platform-web:not(.dark) .search-product-header .search-product-toolbar {
  padding-block: 10px;
}
body.platform-web:not(.dark) .search-product-header .search-product-back-btn {
  border-color: rgba(101, 132, 82, 0.14);
  background: #fff;
  color: #5f7f4d;
  box-shadow: 0 9px 22px rgba(61, 84, 48, 0.1), inset 0 1px 0 #fff;
}
body.platform-web:not(.dark) .search-product-header .search-product-back-btn:hover {
  border-color: rgba(111, 149, 87, 0.4);
  background: #f1f7ed;
  color: #4f713d;
  box-shadow: 0 13px 28px rgba(61, 84, 48, 0.14);
}
body.platform-web:not(.dark) .search-product-header app-header-search {
  padding-block: 0;
}
body.platform-web:not(.dark) .search-product-header .search-container {
  min-height: 58px;
  gap: 0;
  padding: 5px 6px 5px 10px !important;
  border: 1px solid rgba(87, 121, 67, 0.18);
  border-radius: 18px;
  background:
    linear-gradient(
      135deg,
      rgba(129, 168, 105, 0.05),
      transparent 42%),
    #fff !important;
  box-shadow: 0 10px 28px rgba(61, 84, 48, 0.09), inset 0 1px 0 #fff;
  transition:
    border-color 0.2s ease,
    box-shadow 0.2s ease,
    transform 0.2s ease;
}
body.platform-web:not(.dark) .search-product-header .search-container:hover {
  border-color: rgba(101, 139, 78, 0.3);
  box-shadow: 0 14px 34px rgba(61, 84, 48, 0.12), inset 0 1px 0 #fff;
}
body.platform-web:not(.dark) .search-product-header .search-container:focus-within {
  border-color: #7da662;
  box-shadow: 0 0 0 4px rgba(125, 166, 98, 0.13), 0 16px 38px rgba(61, 84, 48, 0.13);
}
body.platform-web:not(.dark) .search-product-header ion-searchbar {
  --background: transparent;
  --box-shadow: none;
  --color: #202720;
  --icon-color: #65884f;
  --placeholder-color: #727d72;
  --placeholder-opacity: 1;
  min-height: 46px;
  height: 46px;
  border: 0 !important;
  border-radius: 14px;
  box-shadow: none !important;
}
body.platform-web:not(.dark) .search-product-header .filter-content {
  display: flex;
  align-items: center;
  flex: 0 0 auto;
  padding-left: 8px;
  border-left: 1px solid rgba(87, 121, 67, 0.12);
}
body.platform-web:not(.dark) .search-product-header .filter-btn {
  --background: #eaf3e5;
  --background-hover: #dcebd4;
  --background-activated: #d2e4c8;
  --border-color: rgb(93 130 70 / 16%);
  --border-style: solid;
  --border-width: 1px;
  --border-radius: 12px;
  --color: #4f713d;
  --box-shadow: none;
  width: auto;
  min-width: 94px;
  height: 42px;
}
body.platform-web:not(.dark) .search-product-header .filter-btn ion-icon {
  color: #5f8448;
}
body.platform-web:not(.dark) .search-product-content {
  --padding-top: 0;
  --background:
    radial-gradient(
      circle at 86% 4%,
      rgb(123 164 101 / 10%),
      transparent 34rem),
    radial-gradient(
      circle at 0% 40%,
      rgb(229 111 135 / 5%),
      transparent 28rem),
    linear-gradient(
      180deg,
      #f6f8f4 0%,
      #f1f5ef 52%,
      #edf2eb 100%);
  color: #202720;
}
body.platform-web:not(.dark) .search-product-content::part(scroll) {
  background:
    radial-gradient(
      circle at 86% 4%,
      rgba(123, 164, 101, 0.1),
      transparent 34rem),
    radial-gradient(
      circle at 0% 40%,
      rgba(229, 111, 135, 0.05),
      transparent 28rem),
    linear-gradient(
      180deg,
      #f6f8f4 0%,
      #f1f5ef 52%,
      #edf2eb 100%);
}
body.platform-web:not(.dark) .search-product-content .search-product-body {
  width: min(100%, 1248px);
  margin-inline: auto;
  padding: 12px 24px 36px;
}
body.platform-web:not(.dark) .search-product-content .search-catalog-hero {
  min-height: 144px;
  border-color: rgba(101, 132, 82, 0.13);
  background:
    linear-gradient(
      180deg,
      rgba(255, 255, 255, 0.92),
      rgba(249, 252, 247, 0.88)),
    #fff;
  box-shadow: 0 16px 42px rgba(61, 84, 48, 0.08), inset 0 1px 0 #fff;
}
body.platform-web:not(.dark) .search-product-content .search-catalog-hero::after {
  position: absolute;
  top: -72px;
  right: -44px;
  width: 240px;
  height: 240px;
  border: 1px solid rgba(123, 164, 101, 0.12);
  border-radius: 50%;
  content: "";
  box-shadow: 0 0 0 34px rgba(123, 164, 101, 0.04), 0 0 0 68px rgba(123, 164, 101, 0.02);
  pointer-events: none;
}
body.platform-web:not(.dark) .search-product-content .search-catalog-eyebrow,
body.platform-web:not(.dark) .search-product-content .search-catalog-section-eyebrow {
  color: #6f9557;
}
body.platform-web:not(.dark) .search-product-content .search-catalog-hero-copy h1 {
  color: #202720;
}
body.platform-web:not(.dark) .search-product-content .search-catalog-hero-copy p {
  color: #697369;
}
body.platform-web:not(.dark) .search-product-content .search-catalog-hero-feature {
  border-color: rgba(101, 132, 82, 0.14);
  background: rgba(255, 255, 255, 0.76);
  box-shadow: 0 11px 26px rgba(61, 84, 48, 0.1), inset 0 1px 0 #fff;
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
}
body.platform-web:not(.dark) .search-product-content .search-catalog-hero-feature strong {
  color: #202720;
}
body.platform-web:not(.dark) .search-product-content .search-catalog-hero-feature small {
  color: #758075;
}
body.platform-web:not(.dark) .search-product-content .search-catalog-hero-icon {
  border: 1px solid rgba(123, 164, 101, 0.16);
  background:
    linear-gradient(
      145deg,
      #edf5e8,
      #dfeeda);
  color: #63834f;
}
body.platform-web:not(.dark) .search-product-content .search-results-section,
body.platform-web:not(.dark) .search-product-content .products-section {
  padding: 24px;
  border: 1px solid rgba(101, 132, 82, 0.13);
  border-radius: 22px;
  background:
    linear-gradient(
      180deg,
      rgba(255, 255, 255, 0.92),
      rgba(249, 252, 247, 0.88)),
    #fff;
  box-shadow: 0 16px 42px rgba(61, 84, 48, 0.08), inset 0 1px 0 #fff;
}
body.platform-web:not(.dark) .search-product-content .search-catalog-section-heading {
  border-bottom-color: rgba(101, 132, 82, 0.12);
}
body.platform-web:not(.dark) .search-product-content .search-catalog-section-heading .section-title,
body.platform-web:not(.dark) .search-product-content .search-catalog-section-heading h2 {
  padding-bottom: 0;
  border: 0;
  color: #202720;
}
body.platform-web:not(.dark) .search-product-content .search-catalog-count {
  border: 1px solid rgba(111, 149, 87, 0.16);
  background: rgba(123, 164, 101, 0.09);
  color: #63834f;
}
body.platform-web:not(.dark) .search-product-content .products-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 16px !important;
}
body.platform-web:not(.dark) .search-product-content app-product-card .product-card,
body.platform-web:not(.dark) .search-product-content app-product-card-skeleton .product-card-skeleton {
  border-color: rgba(101, 132, 82, 0.13);
  background:
    linear-gradient(
      145deg,
      #fff,
      #f8faf7);
  box-shadow: 0 12px 30px rgba(61, 84, 48, 0.09), inset 0 1px 0 #fff;
}
body.platform-web:not(.dark) .search-product-content app-product-card .product-card {
  display: flex;
  width: 100%;
  min-width: 0;
  max-width: none;
  min-height: 312px;
  height: 100%;
  aspect-ratio: auto;
  flex-direction: column;
  padding: 12px;
  border-radius: 18px;
  overflow: hidden;
}
body.platform-web:not(.dark) .search-product-content app-product-card .product-card:hover {
  border-color: rgba(111, 149, 87, 0.38);
  box-shadow: 0 20px 46px rgba(61, 84, 48, 0.15), 0 0 0 2px rgba(123, 164, 101, 0.04);
  transform: translateY(-5px);
}
body.platform-web:not(.dark) .search-product-content app-product-card .product-card-image-container {
  position: relative;
  top: auto;
  left: auto;
  flex: 0 0 auto;
  width: 100%;
  height: 174px;
  min-height: 174px;
  max-height: 174px;
  aspect-ratio: auto;
  overflow: visible;
  border: 1px solid rgba(101, 132, 82, 0.1);
  border-radius: 14px;
  background:
    radial-gradient(
      circle at 50% 38%,
      #fff,
      #f0f5ed 72%);
}
body.platform-web:not(.dark) .search-product-content app-product-card .product-card-image {
  display: block;
  width: 100%;
  height: 100%;
  overflow: hidden;
  border: 0;
  border-radius: 13px;
}
body.platform-web:not(.dark) .search-product-content app-product-card .product-card-image ion-img::part(image) {
  object-fit: contain;
  object-position: center;
}
body.platform-web:not(.dark) .search-product-content app-product-card .product-card-cart-control {
  right: 10px;
  bottom: 10px;
  width: 38px;
  min-width: 38px;
  height: 38px;
  border: 1px solid rgba(255, 255, 255, 0.72);
  box-shadow: 0 9px 20px rgba(229, 111, 135, 0.26);
}
body.platform-web:not(.dark) .search-product-content app-product-card .product-card-info {
  position: static;
  width: 100%;
  min-height: 0;
  margin-top: auto;
  padding-top: 12px;
  justify-content: flex-end;
}
body.platform-web:not(.dark) .search-product-content app-product-card .product-card-name {
  display: -webkit-box;
  min-height: 0;
  overflow: hidden;
  color: #202720;
  font-size: 15px;
  font-weight: 750;
  line-height: 1.25;
  white-space: normal;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
body.platform-web:not(.dark) .search-product-content app-product-card .product-card-rating,
body.platform-web:not(.dark) .search-product-content app-product-card .product-card-pricing {
  position: static;
  width: 100%;
  height: auto;
}
body.platform-web:not(.dark) .search-product-content app-product-card .product-card-rating {
  gap: 3px;
  min-height: 16px;
  margin-top: 4px;
  padding-top: 0;
}
body.platform-web:not(.dark) .search-product-content app-product-card .product-card-rating ion-icon {
  flex: 0 0 13px;
  width: 13px;
  height: 13px;
  font-size: 13px;
}
body.platform-web:not(.dark) .search-product-content app-product-card .product-card-review-count {
  margin-left: 4px;
  color: #7a857b;
  font-size: 12px;
}
body.platform-web:not(.dark) .search-product-content app-product-card .product-card-pricing {
  margin-top: 8px;
  min-height: 34px;
  padding-top: 11px;
  border-top: 1px solid rgba(101, 132, 82, 0.1);
  overflow: visible;
}
body.platform-web:not(.dark) .search-product-content app-product-card .product-card-pricing-values {
  overflow: visible;
}
body.platform-web:not(.dark) .search-product-content app-product-card .product-card-current-price {
  color: #df5f77;
  font-size: 15px;
  font-weight: 800;
}
body.platform-web:not(.dark) .search-product-content .empty-state,
body.platform-web:not(.dark) .search-product-content .no-results {
  border-color: rgba(101, 132, 82, 0.13);
  background:
    radial-gradient(
      circle at 50% 0%,
      rgba(123, 164, 101, 0.1),
      transparent 60%),
    #fff;
  box-shadow: 0 17px 38px rgba(61, 84, 48, 0.1);
  color: #758075;
}
body.platform-web:not(.dark) .search-product-content .empty-state .no-results-icon,
body.platform-web:not(.dark) .search-product-content .empty-state .empty-icon,
body.platform-web:not(.dark) .search-product-content .no-results .no-results-icon,
body.platform-web:not(.dark) .search-product-content .no-results .empty-icon {
  color: #729659;
}
body.platform-web:not(.dark) .search-product-content .empty-state .no-results-text,
body.platform-web:not(.dark) .search-product-content .empty-state .empty-text,
body.platform-web:not(.dark) .search-product-content .no-results .no-results-text,
body.platform-web:not(.dark) .search-product-content .no-results .empty-text {
  color: #202720;
}
@media (width >= 768px) and (width < 1100px) {
  body.platform-web:not(.dark) .search-product-content .products-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
  body.platform-web:not(.dark) .search-product-content app-product-card .product-card {
    min-height: 292px;
  }
  body.platform-web:not(.dark) .search-product-content app-product-card .product-card-image-container {
    height: 154px;
    min-height: 154px;
    max-height: 154px;
  }
}
@media (width < 768px) {
  body.platform-web:not(.dark) .search-product-content .search-product-body {
    padding: 10px 16px 32px;
  }
  body.platform-web:not(.dark) .search-product-content .search-results-section,
  body.platform-web:not(.dark) .search-product-content .products-section {
    padding: 16px;
    border-radius: 18px;
  }
  body.platform-web:not(.dark) .search-product-content .products-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  body.platform-web:not(.dark) .search-product-content app-product-card .product-card {
    min-height: 262px;
  }
  body.platform-web:not(.dark) .search-product-content app-product-card .product-card-image-container {
    height: 124px;
    min-height: 124px;
    max-height: 124px;
  }
}
body.platform-web app-header-container.category-courses-header {
  display: block !important;
  box-sizing: border-box;
  width: 100%;
  max-width: none;
  margin: 10px 0 !important;
  padding: 0 !important;
}
body.platform-web app-header-container.category-courses-header app-header-toolbar {
  display: none !important;
}
body.platform-web app-header-container.category-courses-header ion-header {
  position: relative !important;
  display: block !important;
  z-index: 2;
  overflow: visible;
  padding: 0;
  background: transparent !important;
  border-radius: 0;
}
body.platform-web app-header-container.category-courses-header .search-course-toolbar {
  display: flex;
  align-items: center;
  gap: var(--spacing-sm);
  width: 100%;
  max-width: 1180px;
  height: 62px;
  margin: 0 auto;
  padding: 0 24px;
}
body.platform-web app-header-container.category-courses-header .search-course-back-btn {
  display: inline-flex;
  width: 48px;
  height: 48px;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  color: var(--w-text);
  background: var(--w-card);
  border: 1px solid var(--w-border);
  border-radius: var(--radius-full);
  box-shadow: 0 4px 14px rgba(123, 164, 101, 0.08);
}
body.platform-web app-header-container.category-courses-header app-header-search.search-course-search {
  display: block;
  min-width: 0;
  flex: 1;
}
body.platform-web app-header-container.category-courses-header app-header-search.search-course-search .search-container {
  height: 62px !important;
  min-height: 62px !important;
  padding: 6px 8px 6px 14px !important;
  box-sizing: border-box;
}
body.platform-web app-header-container.category-courses-header app-header-search.search-course-search ion-searchbar {
  min-height: 48px !important;
  height: 48px !important;
}
body.platform-web app-header-container.category-courses-header app-header-search.search-course-search .filter-content {
  display: flex;
  height: 38px;
  align-items: center;
  align-self: stretch;
  margin-left: 8px;
  padding-left: 8px;
  border-left: 1px solid #dbe6d6;
}
body.platform-web .category-courses-header {
  width: min(100% - 48px, var(--w-max));
  margin: 16px auto 18px;
  background: transparent !important;
}
body.platform-web .category-courses-header .category-courses-toolbar {
  display: flex;
  gap: 10px;
  align-items: center;
  width: min(100%, 1140px);
  margin: 0 auto;
}
body.platform-web .category-courses-header .category-courses-back {
  display: grid;
  width: 48px;
  height: 48px;
  flex: 0 0 48px;
  place-items: center;
  color: var(--w-sage-hover);
  background: var(--w-card);
  border: 1px solid var(--w-border);
  border-radius: 50%;
  box-shadow: var(--w-shadow-sm);
  cursor: pointer;
}
body.platform-web .category-courses-header .category-courses-toolbar app-header-search {
  width: 100%;
  max-width: none;
}
body.platform-web .category-courses-header .category-courses-toolbar .search-container {
  min-height: 48px;
  max-width: none;
  margin: 0 auto;
  background: var(--w-card) !important;
  border: 1px solid var(--w-border);
  border-radius: 14px;
  box-shadow: var(--w-shadow-sm);
}
body.platform-web .category-content .course-catalog-intro__copy h1 {
  color: #20271f;
  font-size: clamp(28px, 3vw, 38px);
  font-weight: 800;
}
body.platform-web.dark .category-courses-header .category-courses-toolbar .search-container {
  background: #172019 !important;
  border-color: rgba(205, 226, 210, 0.12);
}
body.platform-web.dark .category-content .course-catalog-panel {
  background: var(--w-card);
  border-color: var(--w-border);
}
@media (width < 768px) {
  body.platform-web .category-courses-header .category-courses-toolbar {
    width: 100%;
  }
  body.platform-web .category-content .course-catalog-panel {
    width: calc(100% - 32px);
    padding: 18px;
  }
}
body.platform-web {
}
body.platform-web:has(.course-preview-modal-backdrop) {
  overflow: hidden;
}
body.platform-web .cd-load-error {
  display: grid;
  width: min(100% - 48px, 620px);
  min-height: 360px;
  margin: 64px auto;
  padding: 48px;
  place-items: center;
  align-content: center;
  border: 1px solid #dbe6d7;
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.94);
  box-shadow: 0 18px 46px rgba(43, 70, 36, 0.1);
  text-align: center;
}
body.platform-web .cd-load-error-icon {
  display: grid;
  width: 52px;
  height: 52px;
  margin-bottom: 16px;
  place-items: center;
  border: 1px solid #d5e4ce;
  border-radius: 15px;
  background: #edf5e8;
  color: #648b50;
}
body.platform-web .cd-load-error-icon ion-icon {
  font-size: 25px;
}
body.platform-web .cd-load-error > span {
  color: #648b50;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
body.platform-web .cd-load-error h1 {
  margin: 7px 0 8px;
  color: #20281f;
  font-size: 26px;
  font-weight: 780;
}
body.platform-web .cd-load-error > p {
  max-width: 420px;
  margin: 0;
  color: #707b6e;
  font-size: 14px;
  line-height: 1.55;
}
body.platform-web .cd-load-error-actions {
  display: flex;
  justify-content: center;
  gap: 10px;
  margin-top: 22px;
}
body.platform-web .cd-load-error-actions ion-button {
  --border-radius: 10px;
  --color: #557843;
  min-width: 112px;
  margin: 0;
}
body.platform-web .cd-load-error-actions ion-button:last-child {
  --background: #79a25f;
  --color: #fff;
}
body.platform-web .cd-web-grid {
  display: grid;
  grid-template-areas: "command command" "player sidebar" "actions sidebar" "overview sidebar";
  grid-template-columns: minmax(0, 1fr) 410px;
  gap: 16px;
  width: min(100%, 1440px);
  max-width: none;
  margin: 0 auto;
  padding: 24px 24px 56px;
  align-items: start;
}
body.platform-web .cd-web-grid > .cd-web-back-row {
  grid-area: command;
  display: flex;
  align-items: center;
  min-height: 60px;
  margin: 0;
  padding: 8px 12px;
  border: 1px solid #dce7d8;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.92);
  box-shadow: 0 10px 30px rgba(46, 72, 39, 0.08);
  -webkit-backdrop-filter: blur(16px);
  backdrop-filter: blur(16px);
}
body.platform-web .cd-web-back-row .cd-web-back-btn {
  flex: 0 0 42px;
  width: 42px;
  height: 42px;
  min-height: 42px;
  margin: 0 12px 0 0;
  border: 1px solid #d6e2d2;
  border-radius: 12px;
  background: #f4f8f1;
  box-shadow: none;
  color: #37502d;
}
body.platform-web .cd-web-course-identity {
  display: grid;
  flex: 1 1 auto;
  min-width: 0;
  gap: 2px;
  padding-left: 14px;
  border-left: 1px solid #dce7d8;
}
body.platform-web .cd-web-course-identity span,
body.platform-web .cd-course-content-heading span,
body.platform-web .cd-web-overview-eyebrow {
  color: #648b50;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.11em;
  line-height: 1.2;
  text-transform: uppercase;
}
body.platform-web .cd-web-course-identity strong {
  overflow: hidden;
  color: #20281f;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.35;
  text-overflow: ellipsis;
  white-space: nowrap;
}
body.platform-web .cd-web-command-progress {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 10px;
  margin-left: auto;
  padding: 8px 10px 8px 14px;
  color: #6c786a;
  font-size: 12px;
  font-weight: 600;
}
body.platform-web .cd-web-command-progress strong {
  display: grid;
  min-width: 40px;
  min-height: 34px;
  place-items: center;
  border: 1px solid #cfe0c7;
  border-radius: 10px;
  background: #eaf3e5;
  color: #527640;
  font-size: 13px;
}
body.platform-web .cd-web-grid > .video-section {
  grid-area: player;
  position: relative;
  top: auto;
  overflow: hidden;
  margin: 0;
  padding: 0;
  border: 1px solid #26362a;
  border-radius: 18px;
  background: #090d0a;
  box-shadow: 0 18px 46px rgba(28, 49, 24, 0.16);
}
body.platform-web .cd-web-grid > .course-video-actions {
  grid-area: actions;
  width: 100%;
  margin: 0;
}
body.platform-web .cd-web-grid .course-video-panel-header {
  display: none;
}
body.platform-web .cd-web-grid .video-container,
body.platform-web .cd-web-grid .video-player-container,
body.platform-web .cd-web-grid .video-player-wrapper {
  aspect-ratio: 16/9;
  width: 100% !important;
  height: auto !important;
  min-height: 0;
  margin: 0;
  border: 0;
  border-radius: 0 !important;
  background: #080a08;
  box-shadow: none;
  overflow: hidden;
}
body.platform-web .cd-web-grid .video-background,
body.platform-web .cd-web-grid .video-thumbnail,
body.platform-web .cd-web-grid .course-video,
body.platform-web .cd-web-grid .video-container img,
body.platform-web .cd-web-grid .video-container video,
body.platform-web .cd-web-grid .video-container iframe {
  width: 100% !important;
  height: 100% !important;
  max-height: 100% !important;
  min-height: 0 !important;
  object-fit: contain !important;
}
body.platform-web .cd-web-grid > .course-details-section {
  grid-area: sidebar;
  position: sticky;
  top: 16px;
  overflow: hidden auto;
  max-height: calc(100vh - 32px);
  margin: 0;
  padding: 22px;
  border: 1px solid #dbe6d7;
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.94);
  box-shadow: 0 18px 46px rgba(43, 70, 36, 0.11);
  scrollbar-color: #9eba8f transparent;
  scrollbar-width: thin;
}
body.platform-web .cd-is-accessible > .course-details-section {
  padding: 0;
}
body.platform-web .cd-course-content-heading {
  position: sticky;
  z-index: 3;
  top: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 18px 18px 16px;
  border-bottom: 1px solid #dfe8dc;
  background: rgba(255, 255, 255, 0.96);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
}
body.platform-web .cd-course-content-heading h2 {
  margin: 4px 0 0;
  color: #20281f;
  font-size: 18px;
  font-weight: 750;
  line-height: 1.25;
}
body.platform-web .cd-course-content-heading > strong {
  flex: 0 0 auto;
  padding: 7px 10px;
  border: 1px solid #d1e0cb;
  border-radius: 999px;
  background: #f0f6ed;
  color: #5c7f49;
  font-size: 12px;
  font-weight: 700;
}
body.platform-web .cd-is-accessible > .course-details-section > .course-title,
body.platform-web .cd-is-accessible > .course-details-section > .course-instructor,
body.platform-web .cd-is-accessible > .course-details-section > .course-description {
  display: none;
}
body.platform-web .cd-is-accessible > .course-details-section > .progress-section {
  margin: 14px 16px 10px;
  padding: 12px 14px;
  border: 1px solid #dfe9dc;
  border-radius: 12px;
  background: #f6f9f4;
}
body.platform-web .cd-is-accessible > .course-details-section > .review-btn {
  width: auto;
  margin: 0 16px 14px;
}
body.platform-web .cd-is-accessible > .course-details-section > .review-btn ion-button {
  width: 100%;
  margin: 0;
}
body.platform-web .cd-is-accessible .course-details-section > .tab-content {
  margin: 0;
  padding: 0 0 6px;
}
body.platform-web .cd-is-accessible .curriculum-tab {
  display: block;
  margin: 0;
  padding: 0;
}
body.platform-web .cd-is-accessible .curriculum-card {
  overflow: visible;
  margin: 0;
  padding: 0;
  border: 0;
  border-bottom: 1px solid #e0e8dd;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
body.platform-web .cd-is-accessible .curriculum-card:last-child {
  border-bottom: 0;
}
body.platform-web .cd-is-accessible .curriculum-header {
  min-height: 72px;
  padding: 14px 16px;
  transition: background-color 160ms ease;
}
body.platform-web .cd-is-accessible .curriculum-header:hover {
  background: #f3f7f1;
}
body.platform-web .cd-is-accessible .curriculum-card.expanded .curriculum-header {
  background: #eef5ea;
  box-shadow: inset 3px 0 0 #79a663;
}
body.platform-web .cd-section-index {
  display: grid;
  flex: 0 0 30px;
  width: 30px;
  height: 30px;
  place-items: center;
  border: 1px solid #d3e2cd;
  border-radius: 9px;
  background: #f1f6ee;
  color: #5b7d4a;
  font-size: 11px;
  font-weight: 800;
}
body.platform-web .cd-is-accessible .curriculum-thumb {
  display: none;
}
body.platform-web .cd-is-accessible .curriculum-main {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
body.platform-web .cd-is-accessible .curriculum-lessons {
  order: 2;
  color: #71806e;
  font-size: 11px;
  line-height: 1.35;
}
body.platform-web .cd-is-accessible .curriculum-title {
  order: 1;
  color: #273025;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.35;
}
body.platform-web .cd-is-accessible .curriculum-meta {
  order: 3;
  color: #839080;
  font-size: 11px;
}
body.platform-web .cd-is-accessible .curriculum-chevron {
  color: #648b50;
}
body.platform-web .cd-is-accessible .curriculum-details {
  margin: 0;
  padding: 0 16px 14px;
  border: 0;
}
body.platform-web .cd-is-accessible .curriculum-lesson {
  min-height: 42px;
  margin: 0;
  padding: 9px 10px;
  border: 0;
  border-radius: 9px;
  background: #f6f9f4;
}
body.platform-web .cd-is-accessible .curriculum-lesson + .curriculum-lesson {
  margin-top: 6px;
}
body.platform-web .cd-is-accessible .curriculum-tab {
  padding: 2px 0 10px;
}
body.platform-web .cd-is-accessible .curriculum-card,
body.platform-web .cd-is-accessible .curriculum-card:last-child {
  overflow: hidden;
  margin: 8px 10px;
  border: 1px solid #dce7d8;
  border-radius: 13px;
  background: #fbfdf9;
  box-shadow: 0 7px 20px rgba(48, 77, 41, 0.05);
}
body.platform-web .cd-is-accessible .curriculum-header {
  min-height: 68px;
  gap: 11px;
  padding: 12px;
}
body.platform-web .cd-is-accessible .curriculum-card.expanded .curriculum-header {
  box-shadow: inset 3px 0 0 #79a663;
}
body.platform-web .cd-is-accessible .curriculum-chevron {
  display: grid;
  flex: 0 0 30px;
  width: 30px;
  height: 30px;
  place-items: center;
  border: 1px solid #d9e5d5;
  border-radius: 9px;
  background: #f4f8f1;
}
body.platform-web .cd-is-accessible .curriculum-chevron ion-icon {
  font-size: 16px;
}
body.platform-web .cd-is-accessible .curriculum-details {
  padding: 10px;
  border-top: 1px solid #e1e9de;
  background: #f8fbf6;
}
body.platform-web .cd-is-accessible .curriculum-details-top {
  margin: 0 2px 9px;
  padding: 0 2px;
}
body.platform-web .cd-is-accessible .curriculum-details-top .details-label,
body.platform-web .cd-is-accessible .curriculum-details-top .details-action {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.02em;
}
body.platform-web .cd-is-accessible .curriculum-lesson {
  min-height: 56px;
  gap: 10px;
  padding: 10px 9px 10px 12px;
  border: 1px solid #e0e9dd;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 3px 10px rgba(48, 77, 41, 0.03);
  transition:
    border-color 160ms ease,
    background-color 160ms ease,
    transform 160ms ease;
}
body.platform-web .cd-is-accessible .curriculum-lesson:hover {
  transform: translateY(-1px);
  border-color: #bfd4b7;
  background: #f8fbf6;
}
body.platform-web .cd-is-accessible .curriculum-lesson.current-video {
  border-color: #85ae70;
  background: #eef6e9;
  box-shadow: inset 3px 0 0 #79a663, 0 5px 14px rgba(62, 99, 50, 0.08);
}
body.platform-web .cd-is-accessible .curriculum-lesson.completed:not(.current-video) {
  background: #f7faf5;
}
body.platform-web .cd-is-accessible .lesson-text {
  min-width: 0;
  padding-right: 4px;
}
body.platform-web .cd-is-accessible .lesson-text .lesson-title {
  overflow: hidden;
  margin-bottom: 5px;
  color: #283126;
  font-size: 13px;
  font-weight: 650;
  line-height: 1.3;
  text-overflow: ellipsis;
}
body.platform-web .cd-is-accessible .lesson-text .lesson-meta {
  gap: 5px;
  color: #758172;
  font-size: 10.5px;
  line-height: 1.2;
}
body.platform-web .cd-is-accessible .lesson-text .lesson-meta ion-icon {
  color: #72955f;
  font-size: 13px;
}
body.platform-web .cd-is-accessible .lesson-status .lesson-actions {
  gap: 5px;
}
body.platform-web .cd-is-accessible .lesson-status .lesson-actions .completed-icon {
  font-size: 17px;
}
body.platform-web .cd-is-accessible .lesson-status .lesson-actions .play-btn {
  --background: #edf5e9;
  --background-hover: #dfedd8;
  --border-radius: 9px;
  --color: #60834e;
  --padding-start: 5px;
  --padding-end: 5px;
  width: 30px;
  height: 30px;
  min-height: 30px;
}
body.platform-web .cd-is-accessible .lesson-status .lesson-actions .play-btn ion-icon {
  font-size: 19px;
}
body.platform-web .cd-web-overview {
  grid-area: overview;
  overflow: hidden;
  border: 1px solid #dbe6d7;
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.94);
  box-shadow: 0 16px 42px rgba(43, 70, 36, 0.09);
}
body.platform-web .cd-web-overview-tabs {
  display: flex;
  align-items: stretch;
  gap: 4px;
  min-height: 54px;
  padding: 0 18px;
  border-bottom: 1px solid #e0e8dd;
}
body.platform-web .cd-web-overview-tabs button {
  position: relative;
  margin: 0;
  padding: 0 12px;
  border: 0;
  background: transparent;
  color: #707b6e;
  font: inherit;
  font-size: 13px;
  font-weight: 650;
  cursor: pointer;
}
body.platform-web .cd-web-overview-tabs button::after {
  position: absolute;
  right: 12px;
  bottom: -1px;
  left: 12px;
  height: 2px;
  border-radius: 2px 2px 0 0;
  background: transparent;
  content: "";
}
body.platform-web .cd-web-overview-tabs button:hover,
body.platform-web .cd-web-overview-tabs button.active {
  color: #4f733e;
}
body.platform-web .cd-web-overview-tabs button.active::after {
  background: #79a663;
}
body.platform-web .cd-web-overview-content {
  padding: 24px 26px 26px;
}
body.platform-web .cd-web-overview-content h2 {
  margin: 7px 0 8px;
  color: #20281f;
  font-size: clamp(22px, 2vw, 30px);
  font-weight: 760;
  line-height: 1.2;
}
body.platform-web .cd-web-overview-content > p {
  max-width: 760px;
  margin: 0;
  color: #687466;
  font-size: 14px;
  line-height: 1.65;
}
body.platform-web .cd-web-overview-meta {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 150px));
  gap: 10px;
  margin-top: 22px;
}
body.platform-web .cd-web-overview-meta > span {
  display: grid;
  gap: 2px;
  padding: 11px 13px;
  border: 1px solid #dfe8dc;
  border-radius: 11px;
  background: #f5f8f3;
}
body.platform-web .cd-web-overview-meta strong {
  color: #33442d;
  font-size: 14px;
}
body.platform-web .cd-web-overview-meta small {
  color: #7a8677;
  font-size: 10px;
}
body.platform-web .course-preview-modal-backdrop {
  position: fixed;
  z-index: 20000;
  inset: 0;
  display: grid;
  overflow: hidden auto;
  padding: 24px;
  place-items: start center;
  background: rgba(5, 8, 6, 0.78);
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  overscroll-behavior: contain;
}
body.platform-web .course-preview-modal {
  width: min(100%, 860px);
  max-height: calc(100vh - 48px);
  overflow: hidden auto;
  border: 1px solid rgba(205, 226, 210, 0.17);
  border-radius: 20px;
  background: #101512;
  color: #eff4ed;
  box-shadow: 0 32px 90px rgba(0, 0, 0, 0.48);
  scrollbar-color: #607b53 transparent;
  scrollbar-width: thin;
}
body.platform-web .course-preview-modal-header {
  position: sticky;
  z-index: 3;
  top: 0;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
  padding: 20px 24px 18px;
  border-bottom: 1px solid rgba(205, 226, 210, 0.11);
  background: rgba(16, 21, 18, 0.94);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
}
body.platform-web .course-preview-modal-header span {
  color: #acd391;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.11em;
  text-transform: uppercase;
}
body.platform-web .course-preview-modal-header h2 {
  margin: 6px 0 0;
  color: #f3f6f2;
  font-size: clamp(19px, 2vw, 25px);
  font-weight: 760;
  line-height: 1.25;
}
body.platform-web .course-preview-modal-close {
  display: grid;
  flex: 0 0 40px;
  width: 40px;
  height: 40px;
  padding: 0;
  place-items: center;
  border: 1px solid rgba(205, 226, 210, 0.16);
  border-radius: 11px;
  background: #19221b;
  color: #dce7d8;
  cursor: pointer;
  transition:
    border-color 160ms ease,
    background-color 160ms ease,
    transform 160ms ease;
}
body.platform-web .course-preview-modal-close:hover {
  border-color: rgba(172, 211, 145, 0.34);
  background: #202c22;
  transform: scale(1.04);
}
body.platform-web .course-preview-modal-close ion-icon {
  font-size: 21px;
}
body.platform-web .course-preview-modal-player {
  display: grid;
  width: 100%;
  min-height: 420px;
  place-items: center;
  background: #030504;
}
body.platform-web .course-preview-modal-player video {
  display: block;
  width: 100%;
  max-height: min(58vh, 500px);
  aspect-ratio: 16/9;
  background: #000;
  object-fit: contain;
}
body.platform-web .course-preview-modal-empty-player {
  display: grid;
  gap: 12px;
  place-items: center;
  color: #9ca79a;
  font-size: 13px;
}
body.platform-web .course-preview-modal-empty-player ion-icon {
  color: #83aa6b;
  font-size: 48px;
}
body.platform-web .course-preview-modal-library {
  border-top: 1px solid rgba(205, 226, 210, 0.11);
}
body.platform-web .course-preview-modal-library-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 18px 24px 12px;
}
body.platform-web .course-preview-modal-library-heading > div {
  display: flex;
  align-items: baseline;
  gap: 10px;
}
body.platform-web .course-preview-modal-library-heading span {
  color: #f0f4ee;
  font-size: 15px;
  font-weight: 750;
}
body.platform-web .course-preview-modal-library-heading strong {
  padding: 5px 8px;
  border: 1px solid rgba(172, 211, 145, 0.18);
  border-radius: 999px;
  background: rgba(151, 190, 126, 0.09);
  color: #acd391;
  font-size: 10px;
}
body.platform-web .course-preview-modal-library-heading strong span {
  color: inherit;
  font-size: inherit;
  font-weight: inherit;
}
body.platform-web .course-preview-modal-library-heading ion-spinner {
  width: 18px;
  height: 18px;
  color: #acd391;
}
body.platform-web .course-preview-modal-list {
  padding: 0 14px 18px;
}
body.platform-web .course-preview-modal-item {
  display: grid;
  grid-template-columns: 106px minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px;
  width: 100%;
  min-height: 78px;
  padding: 10px;
  border: 1px solid transparent;
  border-bottom-color: rgba(205, 226, 210, 0.09);
  border-radius: 11px;
  background: transparent;
  color: inherit;
  text-align: left;
  cursor: pointer;
  transition: border-color 160ms ease, background-color 160ms ease;
}
body.platform-web .course-preview-modal-item:hover {
  border-color: rgba(172, 211, 145, 0.17);
  background: #172019;
}
body.platform-web .course-preview-modal-item.active {
  border-color: rgba(172, 211, 145, 0.25);
  background: #1b261d;
  box-shadow: inset 3px 0 0 #8db570;
}
body.platform-web .course-preview-modal-thumb {
  position: relative;
  display: block;
  overflow: hidden;
  width: 106px;
  height: 58px;
  border-radius: 8px;
  background: #080b09;
}
body.platform-web .course-preview-modal-thumb img {
  width: 100%;
  height: 100%;
  opacity: 0.82;
  object-fit: cover;
}
body.platform-web .course-preview-modal-thumb ion-icon {
  position: absolute;
  top: 50%;
  left: 50%;
  padding: 6px;
  border-radius: 50%;
  background: rgba(244, 248, 242, 0.88);
  color: #3f6332;
  font-size: 13px;
  transform: translate(-50%, -50%);
}
body.platform-web .course-preview-modal-item-copy {
  display: grid;
  min-width: 0;
  gap: 5px;
}
body.platform-web .course-preview-modal-item-copy strong {
  overflow: hidden;
  color: #eef3ec;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.35;
  text-overflow: ellipsis;
  white-space: nowrap;
}
body.platform-web .course-preview-modal-item-copy small {
  color: #8fa18a;
  font-size: 10px;
}
body.platform-web .course-preview-modal-duration {
  color: #aab6a7;
  font-size: 11px;
  font-variant-numeric: tabular-nums;
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) {
  grid-template-areas: "command command" "details preview";
  grid-template-columns: minmax(0, 1fr) 400px;
  gap: 18px 24px;
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) > .video-section {
  grid-area: preview;
  position: sticky;
  top: 16px;
  overflow: hidden;
  border-color: #d7e3d3;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 20px 50px rgba(41, 66, 34, 0.16);
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) > .video-section .video-container {
  border-bottom: 1px solid #dce6d8;
  background: #0b110d;
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) .video-player-container {
  cursor: pointer;
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) > .course-details-section {
  grid-area: details;
  position: relative;
  top: auto;
  overflow: visible;
  max-height: none;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) .course-details-section > .web-course-actions {
  display: none;
}
body.platform-web .cd-locked-offer {
  padding: 22px;
  background: #fff;
  color: #242c23;
}
body.platform-web .cd-locked-preview-caption {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-height: 40px;
  width: 100%;
  padding: 8px 16px;
  border: 0;
  border-bottom: 1px solid #dce6d8;
  background: #111713;
  color: #edf3eb;
  font-size: 12px;
  font-weight: 750;
  font-family: inherit;
  cursor: pointer;
}
body.platform-web .cd-locked-preview-caption ion-icon {
  color: #acd391;
  font-size: 17px;
}
body.platform-web .cd-locked-offer-heading > span {
  color: #648b50;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
body.platform-web .cd-locked-offer-heading h2 {
  margin: 6px 0 5px;
  color: #202820;
  font-size: 21px;
  font-weight: 760;
  line-height: 1.25;
}
body.platform-web .cd-locked-offer-heading p {
  margin: 0;
  color: #707b6e;
  font-size: 12px;
  line-height: 1.5;
}
body.platform-web .cd-locked-price-row {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 8px;
  margin-top: 18px;
}
body.platform-web .cd-locked-price-row > strong {
  color: #253022;
  font-size: 28px;
  font-weight: 800;
  line-height: 1;
}
body.platform-web .cd-locked-price-row > del {
  color: #8a9488;
  font-size: 13px;
}
body.platform-web .cd-locked-price-row > span {
  padding: 5px 7px;
  border-radius: 7px;
  background: #fff0f3;
  color: #cb536c;
  font-size: 10px;
  font-weight: 800;
}
body.platform-web .cd-locked-includes {
  display: grid;
  gap: 10px;
  margin: 20px 0;
  padding: 16px 0;
  border-block: 1px solid #e3ebe0;
  list-style: none;
}
body.platform-web .cd-locked-includes li {
  display: flex;
  align-items: center;
  gap: 10px;
  color: #667164;
  font-size: 12px;
  line-height: 1.4;
}
body.platform-web .cd-locked-includes ion-icon {
  flex: 0 0 18px;
  color: #648b50;
  font-size: 18px;
}
body.platform-web .cd-locked-includes li > span {
  display: flex;
  gap: 4px;
}
body.platform-web .cd-locked-includes strong {
  color: #293228;
  font-weight: 750;
}
body.platform-web .cd-locked-access-btn {
  --background: #7ca461;
  --background-hover: #6f9656;
  --background-activated: #648a4d;
  --border-radius: 11px;
  --box-shadow: 0 10px 22px rgb(86 125 66 / 20%);
  --color: #fff;
  min-height: 46px;
  margin: 0;
  font-size: 14px;
  font-weight: 760;
  letter-spacing: 0.01em;
}
body.platform-web .cd-locked-access-note {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  margin: 11px 0 0;
  color: #859083;
  font-size: 10px;
  text-align: center;
}
body.platform-web .cd-locked-access-note ion-icon {
  color: #648b50;
  font-size: 14px;
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) .course-meta,
body.platform-web .cd-web-grid:not(.cd-is-accessible) .course-title,
body.platform-web .cd-web-grid:not(.cd-is-accessible) .course-instructor,
body.platform-web .cd-web-grid:not(.cd-is-accessible) .course-meta-row,
body.platform-web .cd-web-grid:not(.cd-is-accessible) .course-description,
body.platform-web .cd-web-grid:not(.cd-is-accessible) .rating-block {
  box-sizing: border-box;
  margin: 0;
  padding-right: 30px;
  padding-left: 30px;
  background: #111713;
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) .course-meta {
  padding-top: 28px;
  padding-bottom: 12px;
  border: 1px solid #29382c;
  border-bottom: 0;
  border-radius: 18px 18px 0 0;
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) .course-meta .price-pill {
  display: none;
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) .course-meta .category-badge {
  border: 1px solid rgba(172, 211, 145, 0.2);
  background: rgba(151, 190, 126, 0.12);
  color: #b8dca1;
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) .course-meta .category-text {
  color: #b8dca1;
  font-weight: 750;
  letter-spacing: 0.08em;
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) .course-title {
  padding-top: 3px;
  padding-bottom: 8px;
  border-inline: 1px solid #29382c;
  color: #f2f5f1;
  font-size: clamp(28px, 3vw, 40px);
  font-weight: 800;
  letter-spacing: -0.025em;
  line-height: 1.15;
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) .course-instructor {
  padding-bottom: 13px;
  border-inline: 1px solid #29382c;
  color: #b3c2b0;
  font-size: 13px;
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) .course-instructor::before {
  margin-right: 5px;
  color: #7fa568;
  content: "Created by";
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) .course-meta-row {
  gap: 16px;
  padding-bottom: 14px;
  border-inline: 1px solid #29382c;
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) .course-meta-row .meta-item {
  color: #c4d0c1;
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) .course-meta-row ion-icon,
body.platform-web .cd-web-grid:not(.cd-is-accessible) .course-meta-row .meta-icon {
  color: #97bd7e;
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) .course-meta-row .meta-text {
  color: #c4d0c1;
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) .course-description {
  max-width: none;
  padding-bottom: 16px;
  border-inline: 1px solid #29382c;
  color: #d4ddd1;
  font-size: 16px;
  line-height: 1.6;
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) .rating-block {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding-top: 16px;
  padding-bottom: 26px;
  border: 1px solid #29382c;
  border-top-color: rgba(205, 226, 210, 0.1);
  border-radius: 0 0 18px 18px;
  color: #c7d2c4;
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) .rating-block p {
  margin: 0;
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) .rating-block .rating-line {
  color: #dbe4d8;
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) .rating-label,
body.platform-web .cd-web-grid:not(.cd-is-accessible) .enrollment-line {
  color: #aab7a7;
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) .rating-value,
body.platform-web .cd-web-grid:not(.cd-is-accessible) .enrollment-count {
  color: #f1f4ef;
  font-weight: 800;
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) .mentor-card,
body.platform-web .cd-web-grid:not(.cd-is-accessible) .course-tabs,
body.platform-web .cd-web-grid:not(.cd-is-accessible) .tab-content {
  border: 1px solid #dce6d8;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.94);
  box-shadow: 0 14px 34px rgba(52, 79, 44, 0.08);
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) .mentor-card {
  margin: 16px 0 0;
  padding: 18px;
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) .course-tabs {
  display: flex;
  gap: 4px;
  margin: 16px 0 0;
  padding: 7px;
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) .course-tabs .tab-chip {
  flex: 1;
  min-height: 40px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: #687467;
  font-size: 12px;
  font-weight: 700;
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) .course-tabs .tab-chip.active {
  background: #eaf3e5;
  color: #557843;
  box-shadow: inset 0 0 0 1px #cfe0c7;
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) .tab-content {
  margin: 12px 0 0;
  padding: 24px;
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) .content-stats {
  gap: 10px;
  margin: 0 0 24px;
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) .content-stat-card {
  border: 1px solid #e0e8dd;
  border-radius: 12px;
  background: #f6f9f4;
  box-shadow: none;
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) .section-block {
  padding: 20px 0;
  border-top: 1px solid #e3eae0;
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) .curriculum-tab {
  display: block;
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) .curriculum-card {
  margin: 0;
  padding: 0;
  border: 0;
  border-bottom: 1px solid #e0e8dd;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) .curriculum-card:last-child {
  border-bottom: 0;
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) .curriculum-header {
  min-height: 66px;
  padding: 13px 4px;
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) .curriculum-thumb {
  display: none;
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) .curriculum-main {
  display: flex;
  flex-direction: column;
  gap: 3px;
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) .curriculum-title {
  order: 1;
  color: #273026;
  font-size: 14px;
  font-weight: 700;
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) .curriculum-lessons {
  order: 2;
  color: #758173;
  font-size: 11px;
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) .curriculum-details {
  margin: 0;
  padding: 0 0 14px;
  border: 0;
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) .curriculum-lesson {
  min-height: 42px;
  margin-top: 6px;
  padding: 9px 10px;
  border-radius: 9px;
  background: #f5f8f3;
}
@media (width < 1100px) {
  body.platform-web .cd-web-grid {
    grid-template-areas: "command" "player" "actions" "sidebar" "overview";
    grid-template-columns: minmax(0, 1fr);
    max-width: 980px;
    padding: 20px 20px 48px;
    gap: 16px;
  }
  body.platform-web .cd-web-grid > .course-details-section {
    position: relative;
    top: auto;
    max-height: none;
  }
  body.platform-web .cd-web-grid:not(.cd-is-accessible) {
    grid-template-areas: "command" "preview" "details";
    grid-template-columns: minmax(0, 1fr);
    max-width: 860px;
  }
  body.platform-web .cd-web-grid:not(.cd-is-accessible) > .video-section {
    position: relative;
    top: auto;
  }
}
@media (width < 840px) {
  body.platform-web .cd-web-grid {
    padding: 16px 16px 40px;
    gap: 14px;
  }
  body.platform-web .cd-web-grid > .cd-web-back-row {
    min-height: 54px;
    padding: 8px 12px;
  }
  body.platform-web .cd-web-course-identity strong {
    font-size: 14px;
  }
  body.platform-web .cd-web-command-progress {
    padding: 6px 8px 6px 12px;
    font-size: 11.5px;
    gap: 8px;
  }
  body.platform-web .cd-web-command-progress strong {
    min-width: 36px;
    min-height: 30px;
    font-size: 12px;
  }
}
@media (width < 640px) {
  body.platform-web .cd-web-grid {
    padding: 12px 12px 32px;
    gap: 12px;
  }
  body.platform-web .cd-web-grid > .cd-web-back-row {
    min-height: 48px;
    padding: 6px 10px;
    border-radius: 12px;
  }
  body.platform-web .cd-web-back-row .cd-web-back-btn {
    flex: 0 0 36px;
    width: 36px;
    height: 36px;
    min-height: 36px;
    margin-right: 8px;
    border-radius: 10px;
  }
  body.platform-web .cd-web-back-row .cd-web-back-btn ion-icon {
    font-size: 18px;
  }
  body.platform-web .cd-web-course-identity {
    padding-left: 10px;
    gap: 1px;
  }
  body.platform-web .cd-web-course-identity span {
    font-size: 9px;
  }
  body.platform-web .cd-web-course-identity strong {
    font-size: 13px;
  }
  body.platform-web .cd-web-command-progress {
    gap: 6px;
    padding: 4px 6px 4px 8px;
  }
  body.platform-web .cd-web-command-progress > span {
    display: none;
  }
  body.platform-web .cd-web-command-progress strong {
    min-width: 34px;
    min-height: 28px;
    font-size: 11.5px;
    border-radius: 8px;
  }
  body.platform-web .cd-web-grid .video-container,
  body.platform-web .cd-web-grid .video-player-container,
  body.platform-web .cd-web-grid .video-player-wrapper {
    aspect-ratio: 16/9 !important;
    height: auto !important;
  }
  body.platform-web .cd-web-grid .video-background,
  body.platform-web .cd-web-grid .video-thumbnail,
  body.platform-web .cd-web-grid .course-video,
  body.platform-web .cd-web-grid .video-container img,
  body.platform-web .cd-web-grid .video-container video,
  body.platform-web .cd-web-grid .video-container iframe {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
  }
  body.platform-web .cd-web-grid .video-player-container .play-button-container {
    width: 52px !important;
    height: 52px !important;
  }
  body.platform-web .cd-web-grid > .course-video-actions {
    display: grid;
    grid-template-areas: "prev status next" "auto auto auto";
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 8px;
    padding: 8px;
    border-radius: 12px;
  }
  body.platform-web .course-video-action {
    min-width: 0;
    height: 38px;
    padding: 0 8px;
    font-size: 11px;
    gap: 4px;
    border-radius: 8px;
  }
  body.platform-web .course-video-action ion-icon {
    font-size: 15px;
  }
  body.platform-web .course-video-action-previous {
    grid-area: prev;
  }
  body.platform-web .course-video-action-next {
    grid-area: next;
  }
  body.platform-web .course-video-action-complete,
  body.platform-web .course-video-completion-status {
    grid-area: status;
    min-width: 0;
    height: 38px;
    padding: 0 6px;
    border-radius: 8px;
  }
  body.platform-web .course-video-action-complete > ion-icon,
  body.platform-web .course-video-completion-status > ion-icon {
    margin-right: 4px;
    font-size: 16px;
  }
  body.platform-web .completion-status-copy strong {
    font-size: 10.5px;
  }
  body.platform-web .completion-status-copy small {
    font-size: 8.5px;
  }
  body.platform-web .course-video-action-autoplay {
    grid-area: auto;
    grid-column: 1/-1;
    justify-self: center;
    width: auto;
    min-width: 140px;
    height: 34px;
    padding: 0 14px;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
  }
  body.platform-web .course-video-action-autoplay .autoplay-toggle-copy {
    display: flex;
    align-items: center;
    gap: 6px;
  }
  body.platform-web .course-video-action-autoplay .autoplay-toggle-copy strong {
    font-size: 11.5px;
  }
  body.platform-web .course-video-action-autoplay .autoplay-toggle-copy small {
    font-size: 10px;
  }
  body.platform-web .course-video-action-autoplay .autoplay-toggle-track {
    order: 2;
    width: 28px;
    height: 16px;
    flex: 0 0 28px;
  }
  body.platform-web .course-video-action-autoplay .autoplay-toggle-track > span {
    width: 10px;
    height: 10px;
    top: 2px;
    left: 2px;
  }
  body.platform-web .course-video-action-autoplay.active .autoplay-toggle-track > span {
    transform: translateX(12px);
  }
  body.platform-web .cd-web-overview-content {
    padding: 16px;
  }
  body.platform-web .cd-web-overview-content h2 {
    font-size: 18px;
  }
  body.platform-web .cd-web-overview-content > p {
    font-size: 13px;
    line-height: 1.5;
  }
  body.platform-web .cd-web-overview-meta {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px;
    margin-top: 14px;
  }
  body.platform-web .cd-web-overview-meta > span {
    padding: 8px 6px;
    border-radius: 8px;
    text-align: center;
  }
  body.platform-web .cd-web-overview-meta strong {
    font-size: 12px;
  }
  body.platform-web .cd-web-overview-meta small {
    font-size: 9px;
  }
  body.platform-web .cd-web-overview .review-card {
    padding: 12px;
    border-radius: 10px;
  }
  body.platform-web .cd-web-overview .review-header {
    grid-template-columns: 36px minmax(0, 1fr) auto;
    gap: 8px;
  }
  body.platform-web .cd-web-overview .reviewer-avatar {
    width: 36px;
    height: 36px;
    font-size: 11px;
  }
  body.platform-web .cd-web-overview .reviewer-name {
    font-size: 12.5px;
  }
  body.platform-web .cd-web-overview .review-comment {
    margin: 8px 0 0;
    font-size: 12px;
    line-height: 1.45;
  }
  body.platform-web .cd-course-content-heading {
    padding: 12px 14px;
  }
  body.platform-web .cd-course-content-heading h2 {
    font-size: 15px;
  }
  body.platform-web .cd-is-accessible .curriculum-card {
    margin: 6px 8px;
    border-radius: 10px;
  }
  body.platform-web .cd-is-accessible .curriculum-header {
    min-height: 56px;
    padding: 10px;
    gap: 8px;
  }
  body.platform-web .cd-is-accessible .curriculum-title {
    font-size: 13px;
  }
  body.platform-web .cd-is-accessible .curriculum-lesson {
    min-height: 48px;
    padding: 8px 8px 8px 10px;
    gap: 8px;
  }
  body.platform-web .cd-is-accessible .lesson-text .lesson-title {
    font-size: 12px;
  }
  body.platform-web .cd-web-grid:not(.cd-is-accessible) .course-meta,
  body.platform-web .cd-web-grid:not(.cd-is-accessible) .course-title,
  body.platform-web .cd-web-grid:not(.cd-is-accessible) .course-instructor,
  body.platform-web .cd-web-grid:not(.cd-is-accessible) .course-meta-row,
  body.platform-web .cd-web-grid:not(.cd-is-accessible) .course-description,
  body.platform-web .cd-web-grid:not(.cd-is-accessible) .rating-block {
    padding-left: 14px;
    padding-right: 14px;
  }
  body.platform-web .cd-web-grid:not(.cd-is-accessible) .course-title {
    font-size: 22px;
  }
  body.platform-web .cd-web-grid:not(.cd-is-accessible) .rating-block {
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
  }
  body.platform-web .cd-locked-offer {
    padding: 16px;
  }
}
@media (width < 400px) {
  body.platform-web .cd-web-grid {
    padding: 8px 8px 24px;
    gap: 8px;
  }
  body.platform-web .cd-web-grid > .cd-web-back-row {
    padding: 4px 8px;
    min-height: 44px;
    border-radius: 10px;
  }
  body.platform-web .cd-web-back-row .cd-web-back-btn {
    flex: 0 0 32px;
    width: 32px;
    height: 32px;
    min-height: 32px;
    margin-right: 6px;
  }
  body.platform-web .cd-web-back-row .cd-web-back-btn ion-icon {
    font-size: 16px;
  }
  body.platform-web .cd-web-course-identity {
    padding-left: 8px;
  }
  body.platform-web .cd-web-course-identity strong {
    font-size: 12px;
  }
  body.platform-web .cd-web-command-progress strong {
    min-width: 30px;
    min-height: 26px;
    font-size: 11px;
  }
  body.platform-web .course-video-action {
    height: 34px;
    padding: 0 4px;
    font-size: 10px;
    gap: 2px;
  }
  body.platform-web .course-video-action ion-icon {
    font-size: 13px;
  }
  body.platform-web .course-video-action-previous span,
  body.platform-web .course-video-action-next span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  body.platform-web .course-video-completion-status {
    height: 34px;
    padding: 0 4px;
  }
  body.platform-web .course-video-completion-status > ion-icon {
    font-size: 14px;
    margin-right: 2px;
  }
  body.platform-web .completion-status-copy strong {
    font-size: 9.5px;
  }
  body.platform-web .completion-status-copy small {
    font-size: 8px;
  }
  body.platform-web .course-video-action-autoplay .autoplay-toggle-track {
    width: 24px;
    height: 14px;
    flex: 0 0 24px;
  }
  body.platform-web .course-video-action-autoplay .autoplay-toggle-track > span {
    width: 8px;
    height: 8px;
    top: 2px;
    left: 2px;
  }
  body.platform-web .course-video-action-autoplay.active .autoplay-toggle-track > span {
    transform: translateX(10px);
  }
}
@media (width < 700px) {
  body.platform-web .course-preview-modal-backdrop {
    padding: 0;
    place-items: stretch;
  }
  body.platform-web .course-preview-modal {
    width: 100%;
    max-height: 100vh;
    min-height: 100vh;
    border: 0;
    border-radius: 0;
  }
  body.platform-web .course-preview-modal-header {
    padding: 16px;
  }
  body.platform-web .course-preview-modal-player {
    min-height: auto;
  }
  body.platform-web .course-preview-modal-library-heading {
    padding-inline: 16px;
  }
  body.platform-web .course-preview-modal-list {
    padding-inline: 8px;
  }
  body.platform-web .course-preview-modal-item {
    grid-template-columns: 84px minmax(0, 1fr) auto;
    gap: 10px;
  }
  body.platform-web .course-preview-modal-thumb {
    width: 84px;
    height: 48px;
  }
}
body.platform-web.dark .cd-load-error,
body.platform-web.ion-palette-dark .cd-load-error {
  border-color: #29392d;
  background: #111713;
  box-shadow: 0 20px 48px rgba(0, 0, 0, 0.28);
}
body.platform-web.dark .cd-load-error-icon,
body.platform-web.ion-palette-dark .cd-load-error-icon {
  border-color: #344a36;
  background: #1d2a1f;
  color: #acd391;
}
body.platform-web.dark .cd-load-error h1,
body.platform-web.ion-palette-dark .cd-load-error h1 {
  color: #f0f4ee;
}
body.platform-web.dark .cd-load-error > p,
body.platform-web.ion-palette-dark .cd-load-error > p {
  color: #98a395;
}
body.platform-web.dark .cd-web-grid > .cd-web-back-row,
body.platform-web.dark .cd-web-grid > .course-details-section,
body.platform-web.dark .cd-web-overview,
body.platform-web.ion-palette-dark .cd-web-grid > .cd-web-back-row,
body.platform-web.ion-palette-dark .cd-web-grid > .course-details-section,
body.platform-web.ion-palette-dark .cd-web-overview {
  border-color: #27372b;
  background: rgba(16, 23, 18, 0.96);
  box-shadow: 0 18px 48px rgba(0, 0, 0, 0.28);
}
body.platform-web.dark .cd-web-back-row .cd-web-back-btn,
body.platform-web.ion-palette-dark .cd-web-back-row .cd-web-back-btn {
  border-color: #304333;
  background: #19231b;
  color: #b7d8a5;
}
body.platform-web.dark .cd-web-course-identity,
body.platform-web.ion-palette-dark .cd-web-course-identity {
  border-left-color: #2a3a2d;
}
body.platform-web.dark .cd-web-course-identity strong,
body.platform-web.dark .cd-course-content-heading h2,
body.platform-web.dark .cd-is-accessible .curriculum-title,
body.platform-web.dark .cd-web-overview-content h2,
body.platform-web.ion-palette-dark .cd-web-course-identity strong,
body.platform-web.ion-palette-dark .cd-course-content-heading h2,
body.platform-web.ion-palette-dark .cd-is-accessible .curriculum-title,
body.platform-web.ion-palette-dark .cd-web-overview-content h2 {
  color: #f0f4ee;
}
body.platform-web.dark .cd-web-command-progress,
body.platform-web.ion-palette-dark .cd-web-command-progress {
  color: #9aa797;
}
body.platform-web.dark .cd-web-command-progress strong,
body.platform-web.dark .cd-course-content-heading > strong,
body.platform-web.ion-palette-dark .cd-web-command-progress strong,
body.platform-web.ion-palette-dark .cd-course-content-heading > strong {
  border-color: #344a36;
  background: #1d2a1f;
  color: #a9d28f;
}
body.platform-web.dark .cd-course-content-heading,
body.platform-web.ion-palette-dark .cd-course-content-heading {
  border-bottom-color: #27372b;
  background: rgba(16, 23, 18, 0.96);
}
body.platform-web.dark .cd-is-accessible > .course-details-section > .progress-section,
body.platform-web.dark .cd-web-overview-meta > span,
body.platform-web.ion-palette-dark .cd-is-accessible > .course-details-section > .progress-section,
body.platform-web.ion-palette-dark .cd-web-overview-meta > span {
  border-color: #293a2d;
  background: #151e17;
}
body.platform-web.dark .cd-is-accessible .curriculum-card,
body.platform-web.dark .cd-web-overview-tabs,
body.platform-web.ion-palette-dark .cd-is-accessible .curriculum-card,
body.platform-web.ion-palette-dark .cd-web-overview-tabs {
  border-color: #27372b;
}
body.platform-web.dark .cd-is-accessible .curriculum-header:hover,
body.platform-web.ion-palette-dark .cd-is-accessible .curriculum-header:hover {
  background: #18221a;
}
body.platform-web.dark .cd-is-accessible .curriculum-card.expanded .curriculum-header,
body.platform-web.ion-palette-dark .cd-is-accessible .curriculum-card.expanded .curriculum-header {
  background: #1b271d;
  box-shadow: inset 3px 0 0 #8db570;
}
body.platform-web.dark .cd-section-index,
body.platform-web.ion-palette-dark .cd-section-index {
  border-color: #344737;
  background: #1d2a1f;
  color: #acd391;
}
body.platform-web.dark .cd-is-accessible .curriculum-lesson,
body.platform-web.ion-palette-dark .cd-is-accessible .curriculum-lesson {
  background: #141d16;
}
body.platform-web.dark .cd-is-accessible .curriculum-lessons,
body.platform-web.dark .cd-web-overview-content > p,
body.platform-web.dark .cd-web-overview-tabs button,
body.platform-web.ion-palette-dark .cd-is-accessible .curriculum-lessons,
body.platform-web.ion-palette-dark .cd-web-overview-content > p,
body.platform-web.ion-palette-dark .cd-web-overview-tabs button {
  color: #98a395;
}
body.platform-web.dark .cd-is-accessible .curriculum-meta,
body.platform-web.dark .cd-web-overview-meta small,
body.platform-web.ion-palette-dark .cd-is-accessible .curriculum-meta,
body.platform-web.ion-palette-dark .cd-web-overview-meta small {
  color: #7f8c7c;
}
body.platform-web.dark .cd-web-overview-meta strong,
body.platform-web.ion-palette-dark .cd-web-overview-meta strong {
  color: #dce8d7;
}
body.platform-web.dark .cd-is-accessible .curriculum-card,
body.platform-web.dark .cd-is-accessible .curriculum-card:last-child,
body.platform-web.ion-palette-dark .cd-is-accessible .curriculum-card,
body.platform-web.ion-palette-dark .cd-is-accessible .curriculum-card:last-child {
  border-color: #293a2d;
  background: #111814;
  box-shadow: 0 9px 24px rgba(0, 0, 0, 0.16);
}
body.platform-web.dark .cd-is-accessible .curriculum-header:hover,
body.platform-web.ion-palette-dark .cd-is-accessible .curriculum-header:hover {
  background: #18221a;
}
body.platform-web.dark .cd-is-accessible .curriculum-card.expanded .curriculum-header,
body.platform-web.ion-palette-dark .cd-is-accessible .curriculum-card.expanded .curriculum-header {
  background: #18231a;
}
body.platform-web.dark .cd-is-accessible .curriculum-chevron,
body.platform-web.ion-palette-dark .cd-is-accessible .curriculum-chevron {
  border-color: #314436;
  background: #1a251c;
  color: #a8cf91;
}
body.platform-web.dark .cd-is-accessible .curriculum-details,
body.platform-web.ion-palette-dark .cd-is-accessible .curriculum-details {
  border-top-color: #263629;
  background: #0e1510;
}
body.platform-web.dark .cd-is-accessible .curriculum-details-top .details-label,
body.platform-web.ion-palette-dark .cd-is-accessible .curriculum-details-top .details-label {
  color: #8f9b91;
}
body.platform-web.dark .cd-is-accessible .curriculum-details-top .details-action,
body.platform-web.ion-palette-dark .cd-is-accessible .curriculum-details-top .details-action {
  color: #a7ce90;
}
body.platform-web.dark .cd-is-accessible .curriculum-lesson,
body.platform-web.dark .cd-is-accessible .curriculum-lesson.completed:not(.current-video),
body.platform-web.ion-palette-dark .cd-is-accessible .curriculum-lesson,
body.platform-web.ion-palette-dark .cd-is-accessible .curriculum-lesson.completed:not(.current-video) {
  border-color: #26372a;
  background: #141d16;
  box-shadow: none;
}
body.platform-web.dark .cd-is-accessible .curriculum-lesson:hover,
body.platform-web.ion-palette-dark .cd-is-accessible .curriculum-lesson:hover {
  border-color: #3c543f;
  background: #19241b;
}
body.platform-web.dark .cd-is-accessible .curriculum-lesson.current-video,
body.platform-web.ion-palette-dark .cd-is-accessible .curriculum-lesson.current-video {
  border-color: #6f995c;
  background: #1b2a1d;
  box-shadow: inset 3px 0 0 #8db570, 0 6px 18px rgba(0, 0, 0, 0.18);
}
body.platform-web.dark .cd-is-accessible .lesson-text .lesson-title,
body.platform-web.ion-palette-dark .cd-is-accessible .lesson-text .lesson-title {
  color: #e5ebe2;
}
body.platform-web.dark .cd-is-accessible .lesson-text .lesson-meta,
body.platform-web.ion-palette-dark .cd-is-accessible .lesson-text .lesson-meta {
  color: #879389;
}
body.platform-web.dark .cd-is-accessible .lesson-text .lesson-meta ion-icon,
body.platform-web.ion-palette-dark .cd-is-accessible .lesson-text .lesson-meta ion-icon {
  color: #92b77c;
}
body.platform-web.dark .cd-is-accessible .lesson-status .lesson-actions .play-btn,
body.platform-web.ion-palette-dark .cd-is-accessible .lesson-status .lesson-actions .play-btn {
  --background: #1d2b20;
  --background-hover: #273a2b;
  --color: #a4cc8b;
}
body.platform-web.dark .cd-is-accessible .lesson-status .locked-icon,
body.platform-web.dark .cd-is-accessible .lesson-status .lesson-actions .play-btn .locked-icon,
body.platform-web.ion-palette-dark .cd-is-accessible .lesson-status .locked-icon,
body.platform-web.ion-palette-dark .cd-is-accessible .lesson-status .lesson-actions .play-btn .locked-icon {
  color: #7f8b81;
}
body.platform-web.dark .cd-web-grid:not(.cd-is-accessible) > .course-details-section,
body.platform-web.ion-palette-dark .cd-web-grid:not(.cd-is-accessible) > .course-details-section {
  border: 0;
  background: transparent;
  box-shadow: none;
}
body.platform-web.dark .cd-web-grid:not(.cd-is-accessible) > .video-section,
body.platform-web.ion-palette-dark .cd-web-grid:not(.cd-is-accessible) > .video-section {
  border-color: #2a3b2e;
  background: #111713;
  box-shadow: 0 22px 52px rgba(0, 0, 0, 0.32);
}
body.platform-web.dark .cd-web-grid:not(.cd-is-accessible) > .video-section .video-container,
body.platform-web.ion-palette-dark .cd-web-grid:not(.cd-is-accessible) > .video-section .video-container {
  border-bottom-color: #2a392d;
}
body.platform-web.dark .cd-locked-preview-caption,
body.platform-web.ion-palette-dark .cd-locked-preview-caption {
  border-bottom-color: #29382c;
}
body.platform-web.dark .cd-locked-offer,
body.platform-web.ion-palette-dark .cd-locked-offer {
  background: #111713;
  color: #eef3ec;
}
body.platform-web.dark .cd-locked-offer-heading h2,
body.platform-web.dark .cd-locked-price-row > strong,
body.platform-web.dark .cd-locked-includes strong,
body.platform-web.ion-palette-dark .cd-locked-offer-heading h2,
body.platform-web.ion-palette-dark .cd-locked-price-row > strong,
body.platform-web.ion-palette-dark .cd-locked-includes strong {
  color: #f1f5ef;
}
body.platform-web.dark .cd-locked-offer-heading p,
body.platform-web.dark .cd-locked-includes li,
body.platform-web.ion-palette-dark .cd-locked-offer-heading p,
body.platform-web.ion-palette-dark .cd-locked-includes li {
  color: #9da99a;
}
body.platform-web.dark .cd-locked-price-row > del,
body.platform-web.dark .cd-locked-access-note,
body.platform-web.ion-palette-dark .cd-locked-price-row > del,
body.platform-web.ion-palette-dark .cd-locked-access-note {
  color: #7f8c7d;
}
body.platform-web.dark .cd-locked-price-row > span,
body.platform-web.ion-palette-dark .cd-locked-price-row > span {
  background: rgba(229, 111, 135, 0.12);
  color: #ef91a5;
}
body.platform-web.dark .cd-locked-includes,
body.platform-web.ion-palette-dark .cd-locked-includes {
  border-color: #29382c;
}
body.platform-web.dark .cd-web-grid:not(.cd-is-accessible) .mentor-card,
body.platform-web.dark .cd-web-grid:not(.cd-is-accessible) .course-tabs,
body.platform-web.dark .cd-web-grid:not(.cd-is-accessible) .tab-content,
body.platform-web.ion-palette-dark .cd-web-grid:not(.cd-is-accessible) .mentor-card,
body.platform-web.ion-palette-dark .cd-web-grid:not(.cd-is-accessible) .course-tabs,
body.platform-web.ion-palette-dark .cd-web-grid:not(.cd-is-accessible) .tab-content {
  border-color: #29392d;
  background: #111713;
  box-shadow: 0 16px 38px rgba(0, 0, 0, 0.24);
}
body.platform-web.dark .cd-web-grid:not(.cd-is-accessible) .course-tabs .tab-chip,
body.platform-web.ion-palette-dark .cd-web-grid:not(.cd-is-accessible) .course-tabs .tab-chip {
  color: #98a595;
}
body.platform-web.dark .cd-web-grid:not(.cd-is-accessible) .course-tabs .tab-chip.active,
body.platform-web.ion-palette-dark .cd-web-grid:not(.cd-is-accessible) .course-tabs .tab-chip.active {
  background: #1d2a1f;
  color: #acd391;
  box-shadow: inset 0 0 0 1px #344a36;
}
body.platform-web.dark .cd-web-grid:not(.cd-is-accessible) .content-stat-card,
body.platform-web.dark .cd-web-grid:not(.cd-is-accessible) .curriculum-lesson,
body.platform-web.ion-palette-dark .cd-web-grid:not(.cd-is-accessible) .content-stat-card,
body.platform-web.ion-palette-dark .cd-web-grid:not(.cd-is-accessible) .curriculum-lesson {
  border-color: #29392d;
  background: #151e17;
}
body.platform-web.dark .cd-web-grid:not(.cd-is-accessible) .section-block,
body.platform-web.dark .cd-web-grid:not(.cd-is-accessible) .curriculum-card,
body.platform-web.ion-palette-dark .cd-web-grid:not(.cd-is-accessible) .section-block,
body.platform-web.ion-palette-dark .cd-web-grid:not(.cd-is-accessible) .curriculum-card {
  border-color: #29382c;
}
body.platform-web.dark .cd-web-grid:not(.cd-is-accessible) .curriculum-title,
body.platform-web.ion-palette-dark .cd-web-grid:not(.cd-is-accessible) .curriculum-title {
  color: #edf3eb;
}
body.platform-web.dark .cd-web-grid:not(.cd-is-accessible) .curriculum-lessons,
body.platform-web.ion-palette-dark .cd-web-grid:not(.cd-is-accessible) .curriculum-lessons {
  color: #899687;
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) > .course-details-section {
  min-width: 0;
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) .course-meta,
body.platform-web .cd-web-grid:not(.cd-is-accessible) .course-title,
body.platform-web .cd-web-grid:not(.cd-is-accessible) .course-instructor,
body.platform-web .cd-web-grid:not(.cd-is-accessible) .course-meta-row,
body.platform-web .cd-web-grid:not(.cd-is-accessible) .course-description,
body.platform-web .cd-web-grid:not(.cd-is-accessible) .rating-block {
  padding-right: 32px;
  padding-left: 32px;
  border-color: #d5e3d1;
  background:
    radial-gradient(
      circle at 94% 8%,
      rgba(137, 177, 111, 0.15),
      transparent 17rem),
    linear-gradient(
      135deg,
      #fff 0%,
      #f8fbf6 58%,
      #eef6e9 100%);
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) .course-meta {
  padding-top: 30px;
  padding-bottom: 14px;
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) .course-meta .category-badge {
  padding: 6px 11px;
  border-color: #cfe0c7;
  background: #eaf3e5;
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) .course-meta .category-text {
  color: #5e824c;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.1em;
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) .course-title {
  color: #202a1f;
  text-wrap: balance;
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) .course-instructor,
body.platform-web .cd-web-grid:not(.cd-is-accessible) .course-instructor::before {
  color: #6a7967;
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) .course-instructor::before {
  font-weight: 600;
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) .course-meta-row .meta-item,
body.platform-web .cd-web-grid:not(.cd-is-accessible) .course-meta-row .meta-text {
  color: #647161;
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) .course-meta-row ion-icon,
body.platform-web .cd-web-grid:not(.cd-is-accessible) .course-meta-row .meta-icon {
  color: #6f985a;
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) .course-description {
  padding-top: 6px;
  padding-bottom: 22px;
  color: #4f5e4d;
  font-size: 15px;
  line-height: 1.72;
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) .rating-block {
  padding-top: 18px;
  padding-bottom: 22px;
  border-top-color: #dce8d8;
  background: #f3f8f0;
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) .rating-block .rating-line,
body.platform-web .cd-web-grid:not(.cd-is-accessible) .rating-value,
body.platform-web .cd-web-grid:not(.cd-is-accessible) .enrollment-count {
  color: #253024;
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) .rating-label,
body.platform-web .cd-web-grid:not(.cd-is-accessible) .enrollment-line {
  color: #697666;
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) .mentor-card,
body.platform-web .cd-web-grid:not(.cd-is-accessible) .course-tabs,
body.platform-web .cd-web-grid:not(.cd-is-accessible) .tab-content {
  border-color: #d8e5d4;
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 16px 38px rgba(50, 78, 41, 0.09);
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) .mentor-card {
  min-height: 92px;
  padding: 16px 18px;
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) .mentor-avatar {
  border: 3px solid #edf5e9;
  box-shadow: 0 0 0 1px #d5e4cf;
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) .mentor-label,
body.platform-web .cd-web-grid:not(.cd-is-accessible) .mentor-title,
body.platform-web .cd-web-grid:not(.cd-is-accessible) .mentor-location {
  color: #697666;
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) .mentor-name {
  color: #253024;
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) .course-tabs {
  gap: 8px;
  padding: 8px;
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) .course-tabs .tab-chip {
  min-height: 42px;
  border: 1px solid transparent;
  color: #647161;
  transition:
    border-color 160ms ease,
    background-color 160ms ease,
    color 160ms ease,
    box-shadow 160ms ease;
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) .course-tabs .tab-chip:hover {
  border-color: #d6e4d1;
  background: #f5f9f2;
  color: #4f7140;
  box-shadow: none;
  transform: none;
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) .course-tabs .tab-chip.active {
  border-color: #71975d;
  background: #7da563;
  color: #fff;
  box-shadow: 0 7px 16px rgba(93, 132, 72, 0.2);
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) .tab-content {
  padding: 26px;
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) .content-stat-card {
  min-height: 92px;
  padding: 14px 8px;
  border-color: #dce7d8;
  background: #f7faf5;
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) .content-stat-value,
body.platform-web .cd-web-grid:not(.cd-is-accessible) .section-title {
  color: #253024;
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) .content-stat-label,
body.platform-web .cd-web-grid:not(.cd-is-accessible) .section-body,
body.platform-web .cd-web-grid:not(.cd-is-accessible) .placeholder-tab {
  color: #697666;
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) > .video-section {
  border-color: #d3e1cf;
  border-radius: 20px;
  box-shadow: 0 24px 56px rgba(45, 72, 36, 0.17);
}
body.platform-web .cd-web-grid:not(.cd-is-accessible) > .video-section .video-container {
  border-bottom-color: #d8e4d4;
}
body.platform-web .cd-locked-preview-caption {
  min-height: 44px;
  border-bottom-color: #dce7d8;
  background: #152018;
  color: #f3f7f1;
  letter-spacing: 0.01em;
}
body.platform-web .cd-locked-preview-caption ion-icon {
  color: #a9d28f;
}
body.platform-web .cd-locked-offer {
  padding: 24px;
}
body.platform-web .cd-locked-offer-heading {
  margin-bottom: 16px;
}
body.platform-web .cd-locked-offer-heading h2 {
  margin-top: 4px;
  color: #253024;
  font-size: 22px;
  letter-spacing: -0.02em;
}
body.platform-web .cd-locked-price-row {
  align-items: baseline;
  padding: 2px 0;
}
body.platform-web .cd-locked-price-row > strong {
  color: #253024;
  font-size: 30px;
}
body.platform-web .cd-locked-includes {
  margin: 18px 0;
}
@media (width < 700px) {
  body.platform-web .cd-web-grid:not(.cd-is-accessible) .course-meta,
  body.platform-web .cd-web-grid:not(.cd-is-accessible) .course-title,
  body.platform-web .cd-web-grid:not(.cd-is-accessible) .course-instructor,
  body.platform-web .cd-web-grid:not(.cd-is-accessible) .course-meta-row,
  body.platform-web .cd-web-grid:not(.cd-is-accessible) .course-description,
  body.platform-web .cd-web-grid:not(.cd-is-accessible) .rating-block {
    padding-right: 20px;
    padding-left: 20px;
  }
  body.platform-web .cd-web-grid:not(.cd-is-accessible) .course-title {
    font-size: clamp(24px, 8vw, 32px);
  }
  body.platform-web .cd-web-grid:not(.cd-is-accessible) .rating-block {
    align-items: flex-start;
    flex-direction: column;
  }
  body.platform-web .cd-web-grid:not(.cd-is-accessible) .tab-content,
  body.platform-web .cd-locked-offer {
    padding: 20px;
  }
}
body.platform-web.dark .cd-web-grid:not(.cd-is-accessible) .course-meta,
body.platform-web.dark .cd-web-grid:not(.cd-is-accessible) .course-title,
body.platform-web.dark .cd-web-grid:not(.cd-is-accessible) .course-instructor,
body.platform-web.dark .cd-web-grid:not(.cd-is-accessible) .course-meta-row,
body.platform-web.dark .cd-web-grid:not(.cd-is-accessible) .course-description,
body.platform-web.dark .cd-web-grid:not(.cd-is-accessible) .rating-block,
body.platform-web.ion-palette-dark .cd-web-grid:not(.cd-is-accessible) .course-meta,
body.platform-web.ion-palette-dark .cd-web-grid:not(.cd-is-accessible) .course-title,
body.platform-web.ion-palette-dark .cd-web-grid:not(.cd-is-accessible) .course-instructor,
body.platform-web.ion-palette-dark .cd-web-grid:not(.cd-is-accessible) .course-meta-row,
body.platform-web.ion-palette-dark .cd-web-grid:not(.cd-is-accessible) .course-description,
body.platform-web.ion-palette-dark .cd-web-grid:not(.cd-is-accessible) .rating-block {
  border-color: #2a3b2e;
  background:
    radial-gradient(
      circle at 94% 8%,
      rgba(129, 173, 101, 0.1),
      transparent 18rem),
    linear-gradient(
      135deg,
      #111814 0%,
      #101713 62%,
      #142018 100%);
}
body.platform-web.dark .cd-web-grid:not(.cd-is-accessible) .course-title,
body.platform-web.dark .cd-web-grid:not(.cd-is-accessible) .rating-block .rating-line,
body.platform-web.dark .cd-web-grid:not(.cd-is-accessible) .rating-value,
body.platform-web.dark .cd-web-grid:not(.cd-is-accessible) .enrollment-count,
body.platform-web.dark .cd-web-grid:not(.cd-is-accessible) .mentor-name,
body.platform-web.dark .cd-web-grid:not(.cd-is-accessible) .content-stat-value,
body.platform-web.dark .cd-web-grid:not(.cd-is-accessible) .section-title,
body.platform-web.ion-palette-dark .cd-web-grid:not(.cd-is-accessible) .course-title,
body.platform-web.ion-palette-dark .cd-web-grid:not(.cd-is-accessible) .rating-block .rating-line,
body.platform-web.ion-palette-dark .cd-web-grid:not(.cd-is-accessible) .rating-value,
body.platform-web.ion-palette-dark .cd-web-grid:not(.cd-is-accessible) .enrollment-count,
body.platform-web.ion-palette-dark .cd-web-grid:not(.cd-is-accessible) .mentor-name,
body.platform-web.ion-palette-dark .cd-web-grid:not(.cd-is-accessible) .content-stat-value,
body.platform-web.ion-palette-dark .cd-web-grid:not(.cd-is-accessible) .section-title {
  color: #eef4ec;
}
body.platform-web.dark .cd-web-grid:not(.cd-is-accessible) .course-instructor,
body.platform-web.dark .cd-web-grid:not(.cd-is-accessible) .course-instructor::before,
body.platform-web.dark .cd-web-grid:not(.cd-is-accessible) .course-meta-row .meta-item,
body.platform-web.dark .cd-web-grid:not(.cd-is-accessible) .course-meta-row .meta-text,
body.platform-web.dark .cd-web-grid:not(.cd-is-accessible) .rating-label,
body.platform-web.dark .cd-web-grid:not(.cd-is-accessible) .enrollment-line,
body.platform-web.dark .cd-web-grid:not(.cd-is-accessible) .mentor-label,
body.platform-web.dark .cd-web-grid:not(.cd-is-accessible) .mentor-title,
body.platform-web.dark .cd-web-grid:not(.cd-is-accessible) .mentor-location,
body.platform-web.dark .cd-web-grid:not(.cd-is-accessible) .content-stat-label,
body.platform-web.dark .cd-web-grid:not(.cd-is-accessible) .section-body,
body.platform-web.dark .cd-web-grid:not(.cd-is-accessible) .placeholder-tab,
body.platform-web.ion-palette-dark .cd-web-grid:not(.cd-is-accessible) .course-instructor,
body.platform-web.ion-palette-dark .cd-web-grid:not(.cd-is-accessible) .course-instructor::before,
body.platform-web.ion-palette-dark .cd-web-grid:not(.cd-is-accessible) .course-meta-row .meta-item,
body.platform-web.ion-palette-dark .cd-web-grid:not(.cd-is-accessible) .course-meta-row .meta-text,
body.platform-web.ion-palette-dark .cd-web-grid:not(.cd-is-accessible) .rating-label,
body.platform-web.ion-palette-dark .cd-web-grid:not(.cd-is-accessible) .enrollment-line,
body.platform-web.ion-palette-dark .cd-web-grid:not(.cd-is-accessible) .mentor-label,
body.platform-web.ion-palette-dark .cd-web-grid:not(.cd-is-accessible) .mentor-title,
body.platform-web.ion-palette-dark .cd-web-grid:not(.cd-is-accessible) .mentor-location,
body.platform-web.ion-palette-dark .cd-web-grid:not(.cd-is-accessible) .content-stat-label,
body.platform-web.ion-palette-dark .cd-web-grid:not(.cd-is-accessible) .section-body,
body.platform-web.ion-palette-dark .cd-web-grid:not(.cd-is-accessible) .placeholder-tab {
  color: #98a696;
}
body.platform-web.dark .cd-web-grid:not(.cd-is-accessible) .course-description,
body.platform-web.ion-palette-dark .cd-web-grid:not(.cd-is-accessible) .course-description {
  color: #c9d4c6;
}
body.platform-web.dark .cd-web-grid:not(.cd-is-accessible) .rating-block,
body.platform-web.ion-palette-dark .cd-web-grid:not(.cd-is-accessible) .rating-block {
  border-top-color: #2b3c2f;
  background: #141d16;
}
body.platform-web.dark .cd-web-grid:not(.cd-is-accessible) .mentor-avatar,
body.platform-web.ion-palette-dark .cd-web-grid:not(.cd-is-accessible) .mentor-avatar {
  border-color: #1c291f;
  box-shadow: 0 0 0 1px #344737;
}
body.platform-web.dark .cd-web-grid:not(.cd-is-accessible) .course-tabs .tab-chip:hover,
body.platform-web.ion-palette-dark .cd-web-grid:not(.cd-is-accessible) .course-tabs .tab-chip:hover {
  border-color: #314436;
  background: #18231a;
  color: #b1d69a;
}
body.platform-web.dark .cd-web-grid:not(.cd-is-accessible) .course-tabs .tab-chip.active,
body.platform-web.ion-palette-dark .cd-web-grid:not(.cd-is-accessible) .course-tabs .tab-chip.active {
  border-color: #83aa6b;
  background: #7da563;
  color: #091008;
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.22);
}
body.platform-web.dark .cd-web-grid:not(.cd-is-accessible) .content-stat-card,
body.platform-web.ion-palette-dark .cd-web-grid:not(.cd-is-accessible) .content-stat-card {
  border-color: #29392d;
  background: #151e17;
}
body.platform-web.dark .cd-locked-preview-caption,
body.platform-web.ion-palette-dark .cd-locked-preview-caption {
  border-bottom-color: #2a392d;
  background: #0d130f;
}
body.platform-web.dark .cd-locked-offer-heading h2,
body.platform-web.dark .cd-locked-price-row > strong,
body.platform-web.ion-palette-dark .cd-locked-offer-heading h2,
body.platform-web.ion-palette-dark .cd-locked-price-row > strong {
  color: #eef4ec;
}
body.platform-web .search-content {
  --background:
    radial-gradient(
      circle at 86% 4%,
      rgb(123 164 101 / 10%),
      transparent 34rem),
    radial-gradient(
      circle at 0% 40%,
      rgb(229 111 135 / 5%),
      transparent 28rem),
    linear-gradient(
      180deg,
      #f6f8f4 0%,
      #f1f5ef 52%,
      #edf2eb 100%);
}
body.platform-web .search-content::part(scroll) {
  background:
    radial-gradient(
      circle at 86% 4%,
      rgba(123, 164, 101, 0.1),
      transparent 34rem),
    radial-gradient(
      circle at 0% 40%,
      rgba(229, 111, 135, 0.05),
      transparent 28rem),
    linear-gradient(
      180deg,
      #f6f8f4 0%,
      #f1f5ef 52%,
      #edf2eb 100%);
}
body.platform-web .search-course-catalog-hero {
  position: relative;
  min-height: 158px;
  padding: 24px 22px;
  overflow: hidden;
  background:
    radial-gradient(
      circle at 82% 22%,
      rgba(156, 198, 130, 0.2),
      transparent 35%),
    linear-gradient(
      115deg,
      #fff 0%,
      #f7faf4 58%,
      #eaf3e4 100%);
  border: 1px solid #dbe6d6;
  box-shadow: 0 18px 42px rgba(71, 96, 61, 0.1);
}
body.platform-web .search-course-catalog-hero::after {
  position: absolute;
  right: -55px;
  bottom: -112px;
  width: 270px;
  height: 270px;
  border: 1px solid #648b50;
  border-radius: 50%;
  content: "";
  opacity: 0.09;
}
body.platform-web .search-course-catalog-copy h1 {
  color: #20271f;
}
body.platform-web .search-course-catalog-copy p {
  color: #6c776d;
}
body.platform-web .search-course-catalog-eyebrow {
  color: #648b50;
}
body.platform-web .search-course-catalog-feature {
  background: rgba(255, 255, 255, 0.82);
  border-color: #dbe6d6;
  box-shadow: 0 12px 28px rgba(71, 96, 61, 0.08);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
}
body.platform-web .search-course-catalog-feature strong {
  color: #20271f;
}
body.platform-web .search-course-catalog-feature small {
  color: #788379;
}
body.platform-web .search-course-catalog-icon {
  background: #eef6e9;
  border: 1px solid #d3e4c9;
  color: #648b50;
}
body.platform-web .search-course-results-panel {
  padding: 24px;
}
body.platform-web .search-course-results-panel > app-scrollable-tabs {
  display: block;
  margin: 0 0 22px;
  padding: 16px 0 0;
}
body.platform-web .search-course-results-panel .active-filters-section {
  margin: 0;
  padding: 16px 0;
  border-color: #e5ebe2;
}
body.platform-web .search-course-results-panel .active-filters-title {
  color: #273027;
  font-weight: 700;
}
body.platform-web .search-course-results-panel .clear-btn {
  --color: #648b50;
}
body.platform-web .learning-content {
  --background:
    radial-gradient(
      circle at 86% 4%,
      rgb(123 164 101 / 10%),
      transparent 34rem),
    radial-gradient(
      circle at 0% 40%,
      rgb(229 111 135 / 5%),
      transparent 28rem),
    linear-gradient(
      180deg,
      #f6f8f4 0%,
      #f1f5ef 52%,
      #edf2eb 100%);
  color: #20271f;
}
body.platform-web .learning-content::part(scroll) {
  background:
    radial-gradient(
      circle at 86% 4%,
      rgba(123, 164, 101, 0.1),
      transparent 34rem),
    radial-gradient(
      circle at 0% 40%,
      rgba(229, 111, 135, 0.05),
      transparent 28rem),
    linear-gradient(
      180deg,
      #f6f8f4 0%,
      #f1f5ef 52%,
      #edf2eb 100%);
}
body.platform-web .learning-catalog-shell {
  color: #20271f;
}
body.platform-web .learning-overview {
  background:
    radial-gradient(
      circle at 82% 22%,
      rgba(156, 198, 130, 0.2),
      transparent 35%),
    linear-gradient(
      115deg,
      #fff 0%,
      #f7faf4 58%,
      #eaf3e4 100%);
  border: 1px solid #dbe6d6;
  box-shadow: 0 18px 42px rgba(71, 96, 61, 0.1);
}
body.platform-web .learning-overview-copy h1,
body.platform-web .learning-panel-heading h2 {
  color: #20271f;
}
body.platform-web .learning-overview-copy p,
body.platform-web .learning-panel-heading p {
  color: #6c776d;
}
body.platform-web .learning-eyebrow {
  color: #648b50;
}
body.platform-web .learning-overview-status {
  background: rgba(255, 255, 255, 0.82);
  border: 1px solid #dbe6d6;
  box-shadow: 0 12px 28px rgba(71, 96, 61, 0.08);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
}
body.platform-web .learning-status-icon {
  position: relative;
  flex: 0 0 auto;
  background: #eef6e9;
  border: 1px solid #d3e4c9;
}
body.platform-web .learning-status-icon::after {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #79a25f;
  content: "";
  transform: translate(-50%, -50%);
}
body.platform-web .learning-status-copy small,
body.platform-web .learning-status-copy > span {
  color: #788379;
}
body.platform-web .learning-status-copy strong {
  color: #20271f;
  font-size: 14px;
}
body.platform-web .learning-catalog-panel {
  position: relative;
  overflow: hidden;
  background:
    linear-gradient(
      180deg,
      rgba(255, 255, 255, 0.92),
      rgba(249, 252, 247, 0.88)),
    #fff;
  border: 1px solid rgba(101, 132, 82, 0.13);
  border-radius: 22px;
  box-shadow: 0 16px 42px rgba(61, 84, 48, 0.08), inset 0 1px 0 #fff;
}
body.platform-web .learning-catalog-panel::before {
  position: absolute;
  top: 0;
  left: 24px;
  width: 88px;
  height: 2px;
  border-radius: 0 0 999px 999px;
  background:
    linear-gradient(
      90deg,
      #7ea563,
      rgba(126, 165, 99, 0));
  content: "";
}
body.platform-web .learning-category-panel {
  padding: 24px;
}
body.platform-web .learning-panel-heading {
  border-bottom: 1px solid #e5ebe2;
}
body.platform-web .learning-result-count {
  color: #648b50;
  background: #f1f7ed;
  border: 1px solid #d7e5d0;
}
body.platform-web .learning-category-panel app-category-list {
  display: block;
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
}
body.platform-web .learning-category-panel .category-list-container > .section-title {
  display: flex;
  align-items: center;
  gap: 14px;
  margin: 0 0 13px;
  color: #20271f;
  font-family: var(--font-family-semibold);
  font-size: 17px;
  font-weight: 700;
}
body.platform-web .learning-category-panel .category-list-container > .section-title::after {
  height: 1px;
  flex: 1;
  background: #e5ebe2;
  content: "";
}
body.platform-web .learning-category-panel .category-grid {
  align-items: stretch;
  gap: 10px;
}
body.platform-web .learning-category-panel .category-button {
  flex-direction: column;
  justify-content: center;
  min-height: 96px;
  gap: 8px;
  padding: 10px;
  background: #f8faf6;
  border: 1px solid #dfe8da;
  border-radius: 13px;
  box-shadow: none;
}
body.platform-web .learning-category-panel .category-button:hover {
  transform: translateY(-2px);
  background: #f3f8ef;
  border-color: #9abc84;
  box-shadow: 0 10px 24px rgba(83, 117, 67, 0.12);
}
body.platform-web .learning-category-panel .category-button:focus-visible {
  outline: 3px solid rgba(123, 164, 101, 0.22);
  outline-offset: 2px;
}
body.platform-web .learning-category-panel .category-container {
  flex: 0 0 48px;
  width: 48px;
  height: 48px;
  border: 1px solid #e0e8dc;
  border-radius: 12px;
  background: #fff;
}
body.platform-web .learning-category-panel .category-container app-image-preview {
  width: 100%;
  height: 100% !important;
}
body.platform-web .learning-category-panel .category-container app-image-preview::part(image) {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
body.platform-web .learning-category-panel .category-name {
  width: 100%;
  min-width: 0;
  margin-top: 0;
  color: #263026;
  font-family: var(--font-family-semibold);
  font-size: 13px;
  font-weight: 650;
  line-height: 1.25;
  text-align: center;
}
body.platform-web .learning-category-panel .see-more-container {
  min-height: 34px;
  margin: 10px 0 0 !important;
}
body.platform-web .learning-category-panel .see-more-container:empty {
  display: none;
}
body.platform-web .learning-category-panel .see-more-button {
  --background: #edf5e8 !important;
  --background-hover: #e4f0dd !important;
  --background-activated: #dbead2 !important;
  --color: #4f743e !important;
  --border-color: #bfd5b3 !important;
  --border-radius: 999px;
  --box-shadow: 0 5px 12px rgb(76 108 61 / 10%) !important;
  min-width: 118px;
  min-height: 36px;
  height: 36px;
  margin: 0;
  border: 1px solid #bfd5b3;
  border-radius: 999px;
  color: #4f743e !important;
  box-shadow: 0 5px 12px rgba(76, 108, 61, 0.1);
}
body.platform-web .learning-category-panel .see-more-button .see-more-text,
body.platform-web .learning-category-panel .see-more-button .see-more-icon {
  color: #4f743e !important;
  font-size: 12px;
  font-weight: 700;
  opacity: 1 !important;
}
body.platform-web .learning-course-panel .learning-sections {
  width: 100%;
  max-width: none;
  margin: 0 0 22px !important;
  padding: 16px 0 0;
}
body.platform-web .learning-banner-shell {
  position: relative;
  isolation: isolate;
  width: 100%;
  overflow: hidden;
  padding: 0;
  border-radius: 16px;
  background: transparent;
  box-shadow: none;
}
body.platform-web .learning-banner-shell app-banner-carousel {
  display: block;
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
}
body.platform-web .learning-banner-shell app-banner-carousel .banner-carousel {
  width: 100%;
  max-width: none;
  margin: 0 !important;
}
body.platform-web .learning-banner-shell app-banner-carousel .banner-carousel,
body.platform-web .learning-banner-shell app-banner-carousel .carousel-slides,
body.platform-web .learning-banner-shell app-banner-carousel .carousel-slide {
  border-radius: 16px;
}
body.platform-web .learning-banner-shell app-banner-carousel .carousel-slide {
  border: 0;
  background: transparent;
  box-shadow: none;
}
body.platform-web .learning-banner-shell app-banner-carousel .pagination-dot {
  border: 1px solid rgba(255, 255, 255, 0.18);
  background: rgba(239, 246, 240, 0.46);
}
body.platform-web .learning-banner-shell app-banner-carousel .pagination-dot.active {
  border-color: #7ba465;
  background: #fff;
  box-shadow: 0 0 14px rgba(123, 164, 101, 0.28);
}
body.platform-web .learning-search-launcher-icon {
  background: #edf5e8;
  border: 1px solid #d5e4cd;
  color: #648b50;
}
body.platform-web .learning-search-launcher-copy > span {
  color: #788379;
}
body.platform-web .learning-search-launcher-action {
  background: #79a25f;
  color: #fff;
}
body.platform-web .learning-course-panel .scrollable-tabs {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  padding: 5px;
  overflow: visible;
  background: #f4f7f2;
  border: 1px solid #e2e9de;
  border-radius: 14px;
}
body.platform-web .learning-course-panel .scrollable-tabs-btn {
  --background: transparent;
  --color: #5e695f;
  justify-content: center;
  min-width: 0;
  min-height: 40px;
  margin: 0;
  padding: 0 14px;
  border: 0;
  border-radius: 10px;
  box-shadow: none;
}
body.platform-web .learning-course-panel .scrollable-tabs-btn.active {
  --background: #79a25f;
  --color: #fff;
  box-shadow: 0 6px 14px rgba(91, 130, 72, 0.22);
}
body.platform-web .learning-course-panel app-paginated-list,
body.platform-web .learning-course-panel .course-section--loading {
  display: block;
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
}
body.platform-web .learning-course-panel .recommended-section {
  margin: 0 0 26px;
  padding-bottom: 26px;
  border-bottom: 1px solid #e5ebe2;
}
body.platform-web .learning-course-panel .course-section {
  padding-bottom: 0;
}
body.platform-web .learning-course-panel .section-title {
  margin: 0 0 14px;
  color: #273027;
  font-family: var(--font-family-semibold);
  font-size: 17px;
  font-weight: 700;
}
body.platform-web .learning-course-panel .courses,
body.platform-web .learning-course-panel .recommended-courses {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 16px;
}
body.platform-web .learning-course-panel app-course-card .course-card {
  overflow: hidden;
  background: #fbfcfa;
  border-color: #dfe7db;
  border-radius: 15px;
  box-shadow: 0 8px 20px rgba(71, 96, 61, 0.07) !important;
}
body.platform-web .learning-course-panel app-course-card .course-card:hover {
  transform: translateY(-2px);
  border-color: #9abc84;
  box-shadow: 0 14px 28px rgba(71, 96, 61, 0.13) !important;
}
body.platform-web .learning-course-panel app-course-card .course-card .card-image,
body.platform-web .learning-course-panel app-course-card .course-card .card-image app-image-preview,
body.platform-web .learning-course-panel app-course-card .course-card .card-image .course-image::part(image) {
  border-radius: 14px !important;
}
body.platform-web .learning-course-panel app-course-card .course-card .card-content {
  padding: 14px !important;
}
body.platform-web .learning-course-panel app-course-card {
  align-self: stretch !important;
  height: 100% !important;
  min-height: 100% !important;
  display: flex !important;
  flex-direction: column !important;
}
body.platform-web .learning-course-panel app-course-card .course-card {
  height: 100% !important;
  min-height: 100% !important;
  display: flex !important;
  flex-direction: column !important;
}
body.platform-web .learning-course-panel app-course-card .course-card .card-wrapper {
  height: 100% !important;
  min-height: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  flex: 1 1 auto !important;
}
body.platform-web .learning-course-panel app-course-card .course-card .card-image {
  width: calc(100% - 20px) !important;
  min-width: 0 !important;
  height: 164px !important;
  min-height: 164px;
  max-height: 164px;
  margin: 10px 10px 0;
  padding: 0 !important;
  overflow: hidden;
  border-radius: 12px !important;
  aspect-ratio: auto;
  background: #eef2eb;
}
body.platform-web .learning-course-panel app-course-card .course-card .card-image app-image-preview,
body.platform-web .learning-course-panel app-course-card .course-card .card-image .course-image,
body.platform-web .learning-course-panel app-course-card .course-card .card-image .course-image::part(image) {
  width: 100%;
  height: 100%;
  border-radius: 12px !important;
  object-fit: contain !important;
  --object-fit: contain;
}
body.platform-web .learning-course-panel app-course-card .course-card .premium-badge {
  top: 10px;
  left: 10px;
  width: 25px;
  height: 25px;
  border: 2px solid rgba(255, 255, 255, 0.86);
  box-shadow: 0 5px 12px rgba(36, 48, 33, 0.18);
}
body.platform-web .learning-course-panel app-course-card .course-card .play-icon-container {
  width: 42px;
  height: 42px;
  border: 1px solid rgba(255, 255, 255, 0.72);
  background: rgba(255, 255, 255, 0.88);
  box-shadow: 0 8px 20px rgba(32, 43, 29, 0.18);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
}
body.platform-web .learning-course-panel app-course-card .course-card .card-content {
  display: flex !important;
  flex-direction: column !important;
  flex: 1 1 auto !important;
  justify-content: space-between !important;
  padding: 16px !important;
}
body.platform-web .learning-course-panel app-course-card .course-card .card-body {
  display: flex;
  flex-direction: column;
  gap: 6px;
  flex: 1 0 auto;
}
body.platform-web .learning-course-panel app-course-card .course-card .content-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 24px;
  gap: 6px;
  flex-wrap: wrap;
}
body.platform-web .learning-course-panel app-course-card .course-card .category-badge {
  --background: #edf5e8;
  --color: #526d44;
  --padding-start: 7px;
  --padding-end: 7px;
  flex: 0 1 auto;
  min-width: 0;
  max-width: 100% !important;
  height: 22px;
  padding: 0 7px !important;
  border: 1px solid #dbe8d4;
  font-size: 10px;
  font-weight: 650;
  letter-spacing: -0.1px;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  display: inline-flex;
  align-items: center;
  box-sizing: border-box;
}
body.platform-web .learning-course-panel app-course-card .course-card .price-text,
body.platform-web .learning-course-panel app-course-card .course-card .price-row {
  flex-shrink: 0 !important;
  margin-left: auto;
}
body.platform-web .learning-course-panel app-course-card .course-card .course-title {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  min-height: 40px;
  height: 40px;
  color: #202820;
  font-size: 15px;
  font-weight: 700;
  line-height: 20px;
  margin: 4px 0 2px;
}
body.platform-web .learning-course-panel app-course-card .course-card .course-instructor {
  display: block;
  min-height: 16px;
  height: 16px;
  color: #788279;
  font-size: 12px;
  font-weight: 400;
  line-height: 16px;
  margin-bottom: 4px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
body.platform-web .learning-course-panel app-course-card .course-card .stat-text,
body.platform-web .learning-course-panel app-course-card .course-card .course-stats ion-icon {
  color: #788279;
}
body.platform-web .learning-course-panel app-course-card .course-card .course-stats {
  display: flex;
  align-items: center;
  gap: 14px;
  min-height: 20px;
  height: 20px;
}
body.platform-web .learning-course-panel app-course-card .course-card .course-stats .stat-item {
  display: flex;
  align-items: center;
  gap: 5px;
}
body.platform-web .learning-course-panel app-course-card .course-card .card-footer {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-top: auto !important;
  padding-top: 12px;
  border-top: 1px solid #e5ebe2;
  flex-shrink: 0;
}
body.platform-web .learning-course-panel app-course-card .course-card .progress-container {
  min-height: 32px !important;
  height: 32px !important;
  display: flex;
  flex-direction: column;
  gap: 4px;
  justify-content: flex-end;
}
body.platform-web .learning-course-panel app-course-card .course-card .progress-container .progress-placeholder {
  display: block !important;
  height: 32px !important;
  width: 100%;
}
body.platform-web .learning-course-panel app-course-card .course-card .progress-container--placeholder {
  visibility: hidden !important;
}
body.platform-web .learning-course-panel app-course-card .course-card .progress-container ion-progress-bar {
  height: 5px;
  --background: #e6ece2;
  --progress-background: #79a25f;
}
body.platform-web .learning-course-panel app-course-card .course-card .start-button {
  --background: #9ac77e;
  --background-hover: #8ebc72;
  --background-activated: #82ae69;
  --color: #14200f;
  --border-radius: 11px;
  --box-shadow: none;
  width: 100%;
  height: 40px;
  min-height: 40px;
  margin: 0;
  font-size: 13px;
  font-weight: 750;
  letter-spacing: 0.01em;
}
@media (width < 980px) {
  body.platform-web .learning-course-panel .courses,
  body.platform-web .learning-course-panel .recommended-courses {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}
@media (width < 768px) {
  body.platform-web .learning-catalog-shell {
    padding: 0 12px 20px;
  }
  body.platform-web .learning-overview,
  body.platform-web .learning-catalog-panel {
    padding: 16px;
  }
  body.platform-web .learning-course-panel .scrollable-tabs {
    display: flex;
    padding: 4px;
    overflow-x: auto;
    gap: 6px;
    width: 100%;
    box-sizing: border-box;
  }
  body.platform-web .learning-course-panel .scrollable-tabs-btn {
    min-width: 110px;
    padding: 0 10px;
    font-size: 13px;
  }
  body.platform-web .learning-course-panel .courses,
  body.platform-web .learning-course-panel .recommended-courses {
    grid-template-columns: 1fr !important;
  }
}
@media (width <= 480px) {
  body.platform-web .learning-catalog-shell {
    padding: 0 8px 16px !important;
  }
  body.platform-web .learning-overview,
  body.platform-web .learning-catalog-panel {
    padding: 12px !important;
    border-radius: 12px !important;
  }
  body.platform-web .learning-course-panel .scrollable-tabs {
    display: flex !important;
    padding: 3px !important;
    overflow-x: auto !important;
    gap: 4px !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }
  body.platform-web .learning-course-panel .scrollable-tabs-btn {
    min-width: 90px !important;
    padding: 0 8px !important;
    font-size: 12px !important;
  }
  body.platform-web .learning-course-panel app-course-card .course-card .card-image {
    height: 145px !important;
    min-height: 145px !important;
    max-height: 145px !important;
  }
  body.platform-web .learning-search-row {
    padding: 0 6px !important;
    gap: 6px !important;
  }
  body.platform-web .learning-search-launcher {
    padding: 6px 8px !important;
    gap: 8px !important;
  }
  body.platform-web .learning-search-launcher-action {
    padding: 0 8px !important;
    font-size: 11px !important;
  }
  body.platform-web .learning-search-launcher-action span {
    display: none !important;
  }
}
@media (width <= 360px) {
  body.platform-web .learning-catalog-shell {
    padding: 0 4px 12px !important;
  }
  body.platform-web .learning-overview,
  body.platform-web .learning-catalog-panel {
    padding: 10px !important;
  }
  body.platform-web .learning-course-panel app-course-card .course-card .card-image {
    height: 135px !important;
    min-height: 135px !important;
    max-height: 135px !important;
    margin: 8px 8px 0 !important;
    width: calc(100% - 16px) !important;
  }
  body.platform-web .learning-course-panel app-course-card .course-card .card-content {
    padding: 10px !important;
  }
  body.platform-web .learning-course-panel app-course-card .course-card .course-title {
    font-size: 13px !important;
    line-height: 17px !important;
    min-height: 34px !important;
    height: 34px !important;
  }
  body.platform-web .learning-search-launcher-copy strong {
    font-size: 13px !important;
  }
  body.platform-web .learning-search-launcher-copy span {
    font-size: 10.5px !important;
  }
}
body.platform-web .learning-course-panel app-course-card .course-card .card-image,
body.platform-web .search-course-results-panel app-course-card .course-card .card-image {
  position: relative !important;
  isolation: isolate !important;
  overflow: hidden !important;
  border-radius: 14px !important;
  background: transparent !important;
}
body.platform-web .learning-course-panel app-course-card .course-card .card-image .image-blur-backdrop,
body.platform-web .search-course-results-panel app-course-card .course-card .card-image .image-blur-backdrop {
  position: absolute !important;
  z-index: 0 !important;
  inset: -18px !important;
  width: calc(100% + 36px) !important;
  height: calc(100% + 36px) !important;
  object-fit: cover !important;
  filter: blur(18px) saturate(1.12) !important;
  opacity: 0.95 !important;
  pointer-events: none !important;
}
body.platform-web .learning-course-panel app-course-card .course-card .card-image app-image-preview,
body.platform-web .learning-course-panel app-course-card .course-card .card-image .course-image,
body.platform-web .search-course-results-panel app-course-card .course-card .card-image app-image-preview,
body.platform-web .search-course-results-panel app-course-card .course-card .card-image .course-image {
  position: relative !important;
  z-index: 1 !important;
  width: 100% !important;
  height: 100% !important;
  background: transparent !important;
}
body.platform-web .learning-course-panel app-course-card .course-card .card-image app-image-preview .image-preview-container,
body.platform-web .learning-course-panel app-course-card .course-card .card-image .course-image .image-preview-container,
body.platform-web .learning-course-panel app-course-card .course-card .card-image .course-image::part(image),
body.platform-web .learning-course-panel app-course-card .course-card .card-image ion-img,
body.platform-web .learning-course-panel app-course-card .course-card .card-image ion-img::part(image),
body.platform-web .learning-course-panel app-course-card .course-card .card-image img,
body.platform-web .search-course-results-panel app-course-card .course-card .card-image app-image-preview .image-preview-container,
body.platform-web .search-course-results-panel app-course-card .course-card .card-image .course-image .image-preview-container,
body.platform-web .search-course-results-panel app-course-card .course-card .card-image .course-image::part(image),
body.platform-web .search-course-results-panel app-course-card .course-card .card-image ion-img,
body.platform-web .search-course-results-panel app-course-card .course-card .card-image ion-img::part(image),
body.platform-web .search-course-results-panel app-course-card .course-card .card-image img {
  position: relative !important;
  z-index: 1 !important;
  width: 100% !important;
  height: 100% !important;
  border-radius: 14px !important;
  object-fit: contain !important;
  --object-fit: contain !important;
  object-position: center center !important;
  background: transparent !important;
}
body.platform-web .learning-course-panel app-course-card .course-card .card-image .premium-badge,
body.platform-web .learning-course-panel app-course-card .course-card .card-image .play-overlay,
body.platform-web .search-course-results-panel app-course-card .course-card .card-image .premium-badge,
body.platform-web .search-course-results-panel app-course-card .course-card .card-image .play-overlay {
  z-index: 2 !important;
}
body.platform-web.dark .search-content {
  --background:
    radial-gradient(
      circle at 84% 6%,
      rgb(168 207 143 / 7%),
      transparent 34rem),
    radial-gradient(
      circle at 0% 42%,
      rgb(229 111 135 / 3%),
      transparent 28rem),
    linear-gradient(
      180deg,
      #0b120e 0%,
      #080d0a 52%,
      #060a07 100%);
}
body.platform-web.dark .search-content::part(scroll) {
  background:
    radial-gradient(
      circle at 84% 6%,
      rgba(168, 207, 143, 0.07),
      transparent 34rem),
    radial-gradient(
      circle at 0% 42%,
      rgba(229, 111, 135, 0.03),
      transparent 28rem),
    linear-gradient(
      180deg,
      #0b120e 0%,
      #080d0a 52%,
      #060a07 100%);
}
body.platform-web.dark .search-course-catalog-hero {
  background:
    radial-gradient(
      circle at 82% 22%,
      rgba(147, 194, 116, 0.12),
      transparent 36%),
    linear-gradient(
      115deg,
      #172019 0%,
      #111813 62%,
      #17221a 100%);
  border-color: rgba(205, 226, 210, 0.13);
  box-shadow: 0 20px 44px rgba(0, 0, 0, 0.3);
}
body.platform-web.dark .search-course-catalog-hero::after {
  border-color: #acd391;
}
body.platform-web.dark .search-course-catalog-copy h1 {
  color: #f1f5f2;
}
body.platform-web.dark .search-course-catalog-copy p {
  color: #9da9a1;
}
body.platform-web.dark .search-course-catalog-eyebrow {
  color: #acd391;
}
body.platform-web.dark .search-course-catalog-feature {
  background: rgba(10, 16, 12, 0.72);
  border-color: rgba(205, 226, 210, 0.13);
  box-shadow: 0 14px 30px rgba(0, 0, 0, 0.22);
}
body.platform-web.dark .search-course-catalog-feature strong {
  color: #f1f5f2;
}
body.platform-web.dark .search-course-catalog-feature small {
  color: #89958d;
}
body.platform-web.dark .search-course-catalog-icon {
  background: rgba(147, 194, 116, 0.1);
  border-color: rgba(172, 211, 145, 0.2);
  color: #acd391;
}
body.platform-web.dark .search-course-results-panel .active-filters-section {
  border-color: rgba(205, 226, 210, 0.1);
}
body.platform-web.dark .search-course-results-panel .active-filters-title {
  color: #eff4f0;
}
body.platform-web.dark .search-course-results-panel .clear-btn {
  --color: #acd391;
}
body.platform-web.dark .learning-content {
  --background:
    radial-gradient(
      circle at 84% 6%,
      rgb(168 207 143 / 7%),
      transparent 34rem),
    radial-gradient(
      circle at 0% 42%,
      rgb(229 111 135 / 3%),
      transparent 28rem),
    linear-gradient(
      180deg,
      #0b120e 0%,
      #080d0a 52%,
      #060a07 100%);
  color: #f1f5f2;
}
body.platform-web.dark .learning-content::part(scroll) {
  background:
    radial-gradient(
      circle at 84% 6%,
      rgba(168, 207, 143, 0.07),
      transparent 34rem),
    radial-gradient(
      circle at 0% 42%,
      rgba(229, 111, 135, 0.03),
      transparent 28rem),
    linear-gradient(
      180deg,
      #0b120e 0%,
      #080d0a 52%,
      #060a07 100%);
}
body.platform-web.dark .learning-catalog-shell {
  color: #f1f5f2;
}
body.platform-web.dark .learning-overview {
  background:
    radial-gradient(
      circle at 82% 22%,
      rgba(147, 194, 116, 0.12),
      transparent 36%),
    linear-gradient(
      115deg,
      #172019 0%,
      #111813 62%,
      #17221a 100%);
  border-color: rgba(205, 226, 210, 0.13);
  box-shadow: 0 20px 44px rgba(0, 0, 0, 0.3);
}
body.platform-web.dark .learning-overview-copy h1,
body.platform-web.dark .learning-panel-heading h2 {
  color: #f1f5f2;
}
body.platform-web.dark .learning-overview-copy p,
body.platform-web.dark .learning-panel-heading p {
  color: #9da9a1;
}
body.platform-web.dark .learning-eyebrow {
  color: #acd391;
}
body.platform-web.dark .learning-overview-status {
  background: rgba(10, 16, 12, 0.72);
  border-color: rgba(205, 226, 210, 0.13);
  box-shadow: 0 14px 30px rgba(0, 0, 0, 0.22);
}
body.platform-web.dark .learning-status-icon {
  background: rgba(147, 194, 116, 0.1);
  border-color: rgba(172, 211, 145, 0.2);
}
body.platform-web.dark .learning-status-icon::after {
  background: #acd391;
}
body.platform-web.dark .learning-status-copy small,
body.platform-web.dark .learning-status-copy > span {
  color: #89958d;
}
body.platform-web.dark .learning-status-copy strong {
  color: #f1f5f2;
}
body.platform-web.dark .learning-catalog-panel {
  background: #111713;
  border-color: rgba(205, 226, 210, 0.12);
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.24);
}
body.platform-web.dark .learning-panel-heading,
body.platform-web.dark .learning-course-panel .recommended-section {
  border-color: rgba(205, 226, 210, 0.1);
}
body.platform-web.dark .learning-result-count {
  color: #acd391;
  background: rgba(147, 194, 116, 0.09);
  border-color: rgba(172, 211, 145, 0.16);
}
body.platform-web.dark .learning-category-panel .category-button {
  background: #162019;
  border-color: rgba(205, 226, 210, 0.12);
}
body.platform-web.dark .learning-category-panel .category-button:hover {
  background: #1b281e;
  border-color: #7fa966;
  box-shadow: 0 12px 26px rgba(0, 0, 0, 0.26);
}
body.platform-web.dark .learning-category-panel .category-list-container > .section-title {
  color: #eff4f0;
}
body.platform-web.dark .learning-category-panel .category-list-container > .section-title::after {
  background: rgba(205, 226, 210, 0.1);
}
body.platform-web.dark .learning-search-launcher {
  border-color: rgba(205, 226, 210, 0.14) !important;
  background:
    linear-gradient(
      180deg,
      rgba(168, 207, 143, 0.04),
      transparent),
    #111914 !important;
  color: #f2f6f3 !important;
  box-shadow: 0 14px 34px rgba(0, 0, 0, 0.24) !important;
}
body.platform-web.dark .learning-search-launcher-icon {
  background: rgba(168, 207, 143, 0.1);
  border-color: rgba(168, 207, 143, 0.18);
  color: #acd391;
}
body.platform-web.dark .learning-search-launcher-copy > span {
  color: #9da9a1;
}
body.platform-web.dark .learning-search-launcher-action {
  background: #8db570;
  color: #0c130e;
}
body.platform-web.dark .learning-category-panel .category-container {
  background: #202a22;
  border-color: rgba(205, 226, 210, 0.11);
}
body.platform-web.dark .learning-category-panel .category-name,
body.platform-web.dark .learning-course-panel .section-title {
  color: #eff4f0;
}
body.platform-web.dark .learning-category-panel .see-more-button {
  --background: rgb(168 207 143 / 12%) !important;
  --background-hover: rgb(168 207 143 / 18%) !important;
  --background-activated: rgb(168 207 143 / 22%) !important;
  --color: #b9dda1 !important;
  --border-color: rgb(172 211 145 / 30%) !important;
  --box-shadow: 0 6px 15px rgb(0 0 0 / 18%) !important;
  border-color: rgba(172, 211, 145, 0.2);
  color: #b9dda1 !important;
  box-shadow: 0 6px 15px rgba(0, 0, 0, 0.18);
}
body.platform-web.dark .learning-category-panel .see-more-button .see-more-text,
body.platform-web.dark .learning-category-panel .see-more-button .see-more-icon {
  color: #b9dda1 !important;
}
body.platform-web.dark .learning-course-panel .scrollable-tabs {
  background: #0d130f;
  border-color: rgba(205, 226, 210, 0.1);
}
body.platform-web.dark .learning-course-panel .scrollable-tabs-btn {
  --color: #9da9a1;
}
body.platform-web.dark .learning-course-panel .scrollable-tabs-btn.active {
  --background: #739b5b;
  --color: #fff;
}
body.platform-web.dark .learning-course-panel app-course-card .course-card {
  background: #172019;
  border-color: rgba(205, 226, 210, 0.12);
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.22) !important;
}
body.platform-web.dark .learning-course-panel app-course-card .course-card:hover {
  border-color: #7fa966;
  box-shadow: 0 16px 30px rgba(0, 0, 0, 0.3) !important;
}
body.platform-web.dark .learning-course-panel app-course-card .course-card .card-image {
  background: #0e1510;
  box-shadow: inset 0 0 0 1px rgba(205, 226, 210, 0.08);
}
body.platform-web.dark .learning-course-panel app-course-card .course-card .premium-badge {
  border-color: rgba(16, 23, 18, 0.78);
  box-shadow: 0 6px 14px rgba(0, 0, 0, 0.28);
}
body.platform-web.dark .learning-course-panel app-course-card .course-card .play-icon-container {
  border-color: rgba(205, 226, 210, 0.18);
  background: rgba(239, 246, 240, 0.88);
  box-shadow: 0 9px 22px rgba(0, 0, 0, 0.28);
}
body.platform-web.dark .learning-course-panel app-course-card .course-card .category-badge {
  --background: rgb(168 207 143 / 11%);
  --color: #b7d99f;
  border-color: rgba(168, 207, 143, 0.16);
}
body.platform-web.dark .learning-course-panel app-course-card .course-card .course-title {
  color: #f1f5f2;
}
body.platform-web.dark .learning-course-panel app-course-card .course-card .course-instructor,
body.platform-web.dark .learning-course-panel app-course-card .course-card .stat-text,
body.platform-web.dark .learning-course-panel app-course-card .course-card .course-stats ion-icon {
  color: #8f9b93;
}
body.platform-web.dark .learning-course-panel app-course-card .course-card .card-footer {
  border-color: rgba(205, 226, 210, 0.09);
}
body.platform-web.dark .learning-course-panel app-course-card .course-card .progress-container ion-progress-bar {
  --background: #263129;
  --progress-background: #acd391;
}
body.platform-web .category-products-header .category-search-toolbar {
  width: min(100%, 1328px);
  max-width: 1328px;
  margin-inline: auto;
  padding: 16px 24px 18px;
}
body.platform-web .category-products-header app-header-search {
  width: auto;
  max-width: none;
  margin: 0;
  padding: 0;
}
body.platform-web .category-products-header app-header-filter-button .filter-btn.has-label {
  --background: #edf5e8;
  --background-hover: #e1eed9;
  --background-activated: #d8e8ce;
  --border-color: rgb(101 132 82 / 18%);
  --border-style: solid;
  --border-width: 1px;
  --border-radius: 12px;
  --color: #587743;
  --padding-start: 14px;
  --padding-end: 12px;
  --box-shadow: none;
  min-width: 112px;
  height: 44px;
}
body.platform-web .category-products-header app-header-filter-button .filter-btn.has-label ion-icon {
  margin-right: 8px;
  color: #64874f;
  font-size: 17px;
}
body.platform-web .category-products-header app-header-filter-button .filter-btn.has-label .filter-label {
  font-size: 13px;
  font-weight: 750;
  letter-spacing: 0;
}
body.platform-web .category-products-header app-header-filter-button .filter-btn.has-label.has-filters .filter-badge {
  position: static;
  min-width: 20px;
  height: 20px;
  margin-left: 8px;
  padding: 0 6px;
  border: 0;
  background: #688d51;
  color: #fff;
  font-size: 10px;
  font-weight: 800;
  line-height: 1;
  transform: none;
  box-shadow: 0 4px 10px rgba(74, 105, 56, 0.2);
}
body.platform-web .category-products-header .category-search-back-btn {
  border-color: rgba(101, 132, 82, 0.17);
  background: #fff;
  color: #587743;
  box-shadow: 0 8px 20px rgba(61, 84, 48, 0.09);
  transition:
    transform 0.2s ease,
    border-color 0.2s ease,
    background-color 0.2s ease,
    box-shadow 0.2s ease;
}
body.platform-web .category-products-header .category-search-back-btn:hover {
  border-color: rgba(101, 132, 82, 0.34);
  background: #edf5e9;
  box-shadow: 0 11px 24px rgba(61, 84, 48, 0.12);
  transform: translateX(-2px);
}
body.platform-web .category-products-header .category-search-back-btn:focus-visible {
  outline: 3px solid rgba(125, 166, 98, 0.22);
  outline-offset: 2px;
}
body.platform-web .category-products-header .category-search-back-btn ion-icon {
  color: currentcolor;
  font-size: 20px;
}
body.platform-web .category-products-header .category-search-context {
  display: flex;
  flex-direction: column;
  gap: 3px;
  line-height: 1;
}
body.platform-web .category-products-header .category-search-context span {
  color: #789766;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 0.13em;
  text-transform: uppercase;
}
body.platform-web .category-products-header .category-search-context strong {
  color: #202720;
  font-size: 15px;
  font-weight: 800;
  line-height: 1.15;
  letter-spacing: -0.015em;
}
body.platform-web .category-products-content {
  --padding-start: 0;
  --padding-end: 0;
  --padding-top: 0;
  --padding-bottom: 0;
  --cc-canvas: #f2f5f0;
  --cc-card: #fff;
  --cc-card-soft: #f7faf5;
  --cc-border: rgb(101 132 82 / 14%);
  --cc-text: #202720;
  --cc-muted: #717c72;
  --cc-accent: #6e9457;
  --cc-shadow: 0 16px 42px rgb(61 84 48 / 9%);
  --background:
    radial-gradient(
      circle at 88% 2%,
      rgb(123 164 101 / 9%),
      transparent 32rem),
    linear-gradient(
      180deg,
      #f6f8f4 0%,
      var(--cc-canvas) 100%);
}
body.platform-web .category-products-content::part(scroll) {
  background:
    radial-gradient(
      circle at 88% 2%,
      rgba(123, 164, 101, 0.09),
      transparent 32rem),
    linear-gradient(
      180deg,
      #f6f8f4 0%,
      var(--cc-canvas) 100%);
}
body.platform-web .category-products-content .category-catalog-shell {
  width: min(100%, 1328px);
  max-width: none;
  padding: 20px 24px 48px;
}
body.platform-web .category-products-content .category-catalog-overview {
  position: relative;
  min-height: 176px;
  overflow: hidden;
  border-color: rgba(101, 132, 82, 0.13);
  background:
    linear-gradient(
      180deg,
      rgba(255, 255, 255, 0.92),
      rgba(249, 252, 247, 0.88)),
    #fff;
  box-shadow: 0 16px 42px rgba(61, 84, 48, 0.08), inset 0 1px 0 #fff;
}
body.platform-web .category-products-content .category-catalog-overview::after {
  position: absolute;
  top: -96px;
  right: -42px;
  width: 260px;
  height: 260px;
  border: 1px solid rgba(123, 164, 101, 0.11);
  border-radius: 50%;
  box-shadow: 0 0 0 36px rgba(123, 164, 101, 0.035), 0 0 0 72px rgba(123, 164, 101, 0.015);
  content: "";
  pointer-events: none;
}
body.platform-web .category-products-content .category-catalog-overview-copy,
body.platform-web .category-products-content .category-catalog-summary {
  position: relative;
  z-index: 1;
}
body.platform-web .category-products-content .category-catalog-overview-copy h1 {
  color: var(--cc-text);
}
body.platform-web .category-products-content .category-catalog-overview-copy p {
  color: var(--cc-muted);
}
body.platform-web .category-products-content .category-catalog-eyebrow,
body.platform-web .category-products-content .category-catalog-section-eyebrow {
  color: var(--cc-accent);
}
body.platform-web .category-products-content .category-catalog-summary {
  border-color: var(--cc-border);
  background: rgba(255, 255, 255, 0.72);
  box-shadow: 0 12px 30px rgba(61, 84, 48, 0.09);
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
}
body.platform-web .category-products-content .category-catalog-summary > div + div {
  border-left-color: var(--cc-border);
}
body.platform-web .category-products-content .category-catalog-summary strong {
  color: var(--cc-text);
}
body.platform-web .category-products-content .category-catalog-summary span {
  color: var(--cc-muted);
}
body.platform-web .category-products-content .category-catalog-panel {
  border-color: rgba(101, 132, 82, 0.13);
  background:
    linear-gradient(
      180deg,
      rgba(255, 255, 255, 0.92),
      rgba(249, 252, 247, 0.88)),
    #fff;
  box-shadow: 0 16px 42px rgba(61, 84, 48, 0.08), inset 0 1px 0 #fff;
}
body.platform-web .category-products-content .category-catalog-section-heading {
  border-bottom-color: var(--cc-border);
}
body.platform-web .category-products-content .category-catalog-section-heading h2 {
  color: var(--cc-text);
}
body.platform-web .category-products-content .category-catalog-section-heading p {
  color: var(--cc-muted);
}
body.platform-web .category-products-content .category-catalog-count {
  border: 1px solid rgba(111, 149, 87, 0.16);
  background: rgba(123, 164, 101, 0.09);
  color: var(--cc-accent);
}
body.platform-web .category-products-content app-shop-category-list .category-grid {
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  justify-content: stretch;
  justify-items: stretch;
  gap: 12px;
  margin: 0;
}
body.platform-web .category-products-content app-shop-category-list app-shop-card .card-category {
  width: 100%;
  height: 82px;
  padding: 13px 14px;
  border: 1px solid var(--cc-border);
  border-radius: 14px;
  background: var(--cc-card-soft);
  box-shadow: 0 7px 18px rgba(61, 84, 48, 0.06);
  flex-direction: row;
  justify-content: flex-start;
  gap: 12px;
  transition:
    transform 0.2s ease,
    border-color 0.2s ease,
    box-shadow 0.2s ease;
}
body.platform-web .category-products-content app-shop-category-list app-shop-card .card-category:hover,
body.platform-web .category-products-content app-shop-category-list app-shop-card .card-category:focus-visible {
  border-color: rgba(111, 149, 87, 0.42);
  box-shadow: 0 12px 26px rgba(61, 84, 48, 0.11);
  transform: translateY(-2px);
}
body.platform-web .category-products-content app-shop-category-list app-shop-card .card-category .card-container {
  width: 46px;
  max-width: 46px;
  height: 46px;
  border: 1px solid var(--cc-border);
  background: var(--cc-card);
}
body.platform-web .category-products-content app-shop-category-list app-shop-card .card-category .card-name {
  width: auto;
  margin: 0;
  padding: 0;
  color: var(--cc-text);
  font-size: 13px;
  font-weight: 700;
  line-height: 1.3;
  text-align: left;
}
body.platform-web .category-products-content app-shop-brands-list .brands-list-container {
  margin: 0;
}
body.platform-web .category-products-content app-shop-brands-list .brands-list-container > .section-title {
  display: none;
}
body.platform-web .category-products-content app-shop-brands-list .brand-cards-scroll {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(112px, 1fr));
  overflow: visible;
  gap: 12px;
  margin: 0;
  padding: 0;
}
body.platform-web .category-products-content app-shop-brands-list app-shop-card .card-brand {
  width: 100%;
  min-height: 94px;
  padding: 12px 10px 9px;
  border: 1px solid var(--cc-border);
  border-radius: 14px;
  background: var(--cc-card-soft);
  box-shadow: 0 7px 18px rgba(61, 84, 48, 0.06);
  transition:
    transform 0.2s ease,
    border-color 0.2s ease,
    box-shadow 0.2s ease;
}
body.platform-web .category-products-content app-shop-brands-list app-shop-card .card-brand:hover,
body.platform-web .category-products-content app-shop-brands-list app-shop-card .card-brand:focus-visible,
body.platform-web .category-products-content app-shop-brands-list app-shop-card .card-brand.active {
  border-color: rgba(111, 149, 87, 0.46);
  background: color-mix(in srgb, var(--cc-accent) 7%, var(--cc-card));
  box-shadow: 0 12px 26px rgba(61, 84, 48, 0.11);
  transform: translateY(-2px);
}
body.platform-web .category-products-content app-shop-brands-list app-shop-card .card-brand .card-name {
  color: var(--cc-text);
  font-size: 12px;
  font-weight: 650;
}
body.platform-web .category-products-content .category-catalog-products .products-grid {
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 14px !important;
  margin: 0;
  padding: 0;
}
body.platform-web .category-products-content .category-catalog-products app-product-card {
  display: block;
  min-width: 0;
  height: 100%;
}
body.platform-web .category-products-content .category-catalog-products app-product-card .product-card {
  display: flex;
  width: 100%;
  min-width: 0;
  max-width: none;
  min-height: 294px;
  height: 100%;
  padding: 12px;
  border: 1px solid var(--cc-border);
  border-radius: 16px;
  background: var(--cc-card-soft);
  box-shadow: 0 10px 26px rgba(61, 84, 48, 0.08);
  aspect-ratio: auto;
  flex-direction: column;
  overflow: hidden;
}
body.platform-web .category-products-content .category-catalog-products app-product-card .product-card:hover {
  border-color: rgba(111, 149, 87, 0.4);
  box-shadow: 0 20px 44px rgba(61, 84, 48, 0.14);
  transform: translateY(-4px);
}
body.platform-web .category-products-content .category-catalog-products app-product-card .product-card-image-container {
  position: relative;
  top: auto;
  left: auto;
  width: 100%;
  height: 154px;
  min-height: 154px;
  max-height: 154px;
  border: 1px solid var(--cc-border);
  border-radius: 12px;
  background: var(--cc-card);
  aspect-ratio: auto;
  overflow: visible;
}
body.platform-web .category-products-content .category-catalog-products app-product-card .product-card-image {
  display: block;
  width: 100%;
  height: 100%;
  overflow: hidden;
  border-radius: 11px;
}
body.platform-web .category-products-content .category-catalog-products app-product-card .product-card-image ion-img::part(image) {
  object-fit: contain;
  object-position: center;
}
body.platform-web .category-products-content .category-catalog-products app-product-card .product-card-info {
  position: static;
  width: 100%;
  min-height: 0;
  margin-top: auto;
  padding-top: 12px;
}
body.platform-web .category-products-content .category-catalog-products app-product-card .product-card-name {
  min-height: 0;
  color: var(--cc-text);
  font-size: 14px;
  font-weight: 750;
  line-height: 1.3;
  white-space: normal;
}
body.platform-web .category-products-content .category-catalog-products app-product-card .product-card-rating,
body.platform-web .category-products-content .category-catalog-products app-product-card .product-card-pricing {
  position: static;
  width: 100%;
  height: auto;
}
body.platform-web .category-products-content .category-catalog-products app-product-card .product-card-rating {
  gap: 3px;
  min-height: 16px;
  margin-top: 5px;
}
body.platform-web .category-products-content .category-catalog-products app-product-card .product-card-rating ion-icon {
  flex: 0 0 12px;
  width: 12px;
  height: 12px;
}
body.platform-web .category-products-content .category-catalog-products app-product-card .product-card-review-count {
  margin-left: 3px;
  color: var(--cc-muted);
  font-size: 11px;
}
body.platform-web .category-products-content .category-catalog-products app-product-card .product-card-pricing {
  min-height: 32px;
  margin-top: 8px;
  padding-top: 10px;
  border-top: 1px solid var(--cc-border);
  overflow: visible;
}
body.platform-web .category-products-content .category-catalog-products app-product-card .product-card-current-price {
  color: #df5f77;
  font-size: 15px;
  font-weight: 800;
}
body.platform-web .category-products-content .category-catalog-products .empty-state {
  min-height: 220px;
  border: 1px dashed var(--cc-border);
  border-radius: 18px;
  background: var(--cc-card-soft);
  color: var(--cc-muted);
}
@media (width >= 768px) and (width < 1100px) {
  body.platform-web .category-products-content .category-catalog-products .products-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}
@media (width >= 1100px) and (width < 1280px) {
  body.platform-web .category-products-content .category-catalog-products .products-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  }
}
@media (width < 768px) {
  body.platform-web .category-products-content .category-catalog-shell {
    padding: 12px 16px 32px;
  }
  body.platform-web .category-products-content .category-catalog-products .products-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  body.platform-web .category-products-content .category-catalog-products app-product-card .product-card {
    min-height: 262px;
  }
  body.platform-web .category-products-content .category-catalog-products app-product-card .product-card-image-container {
    height: 124px;
    min-height: 124px;
    max-height: 124px;
  }
}
body.platform-web.dark .category-products-content {
  --cc-canvas: #090e0b;
  --cc-card: #18211b;
  --cc-card-soft: #141c17;
  --cc-border: rgb(205 226 210 / 11%);
  --cc-text: #f2f6f3;
  --cc-muted: #9ba79f;
  --cc-accent: #acd391;
  --cc-shadow: 0 20px 50px rgb(0 0 0 / 24%);
  --background:
    radial-gradient(
      circle at 88% 2%,
      rgb(168 207 143 / 6%),
      transparent 32rem),
    linear-gradient(
      180deg,
      #0d130f 0%,
      var(--cc-canvas) 100%);
}
body.platform-web.dark .category-products-content::part(scroll) {
  background:
    radial-gradient(
      circle at 88% 2%,
      rgba(168, 207, 143, 0.06),
      transparent 32rem),
    linear-gradient(
      180deg,
      #0d130f 0%,
      var(--cc-canvas) 100%);
}
body.platform-web.dark .category-products-content .category-catalog-overview {
  border-color: rgba(205, 226, 210, 0.11);
  background:
    linear-gradient(
      180deg,
      rgba(255, 255, 255, 0.025),
      transparent 38%),
    #0f1612;
  box-shadow: 0 18px 46px rgba(0, 0, 0, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.03);
}
body.platform-web.dark .category-products-content .category-catalog-overview::before {
  background:
    linear-gradient(
      90deg,
      #a8cf8f,
      rgba(168, 207, 143, 0));
}
body.platform-web.dark .category-products-content .category-catalog-overview::after {
  border-color: rgba(168, 207, 143, 0.09);
  box-shadow: 0 0 0 36px rgba(168, 207, 143, 0.03), 0 0 0 72px rgba(168, 207, 143, 0.015);
}
body.platform-web.dark .category-products-content .category-catalog-summary {
  background: rgba(10, 16, 12, 0.6);
  box-shadow: 0 14px 32px rgba(0, 0, 0, 0.22);
}
body.platform-web.dark .category-products-content .category-catalog-panel {
  border-color: rgba(205, 226, 210, 0.11);
  background:
    linear-gradient(
      180deg,
      rgba(255, 255, 255, 0.025),
      transparent 38%),
    #0f1612;
  box-shadow: 0 18px 46px rgba(0, 0, 0, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.03);
}
body.platform-web.dark .category-products-content .category-catalog-panel::before {
  background:
    linear-gradient(
      90deg,
      #a8cf8f,
      rgba(168, 207, 143, 0));
}
body.platform-web.dark .category-products-content app-shop-category-list app-shop-card .card-category,
body.platform-web.dark .category-products-content app-shop-brands-list app-shop-card .card-brand,
body.platform-web.dark .category-products-content .category-catalog-products app-product-card .product-card {
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.22);
}
body.platform-web.dark .category-products-content app-shop-category-list app-shop-card .card-category:hover,
body.platform-web.dark .category-products-content app-shop-brands-list app-shop-card .card-brand:hover,
body.platform-web.dark .category-products-content .category-catalog-products app-product-card .product-card:hover {
  box-shadow: 0 20px 44px rgba(0, 0, 0, 0.34);
}
body.platform-web.dark .category-products-content .category-catalog-products app-product-card .product-card-image-container {
  background:
    radial-gradient(
      circle at 50% 38%,
      rgba(168, 207, 143, 0.06),
      transparent 62%),
    #202b23;
}
body.platform-web.dark .category-products-content .category-catalog-products app-product-card .product-card-rating ion-icon:not(.filled) {
  color: #465149;
}
body.platform-web.dark .category-products-header .category-search-back-btn {
  border-color: rgba(168, 207, 143, 0.16);
  background: #18211b;
  color: #b5d7a0;
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.24);
}
body.platform-web.dark .category-products-header .category-search-back-btn:hover {
  border-color: rgba(168, 207, 143, 0.34);
  background: #222e25;
  box-shadow: 0 13px 28px rgba(0, 0, 0, 0.3);
}
body.platform-web.dark .category-products-header app-header-filter-button .filter-btn.has-label {
  --background: #202b23;
  --background-hover: #28362b;
  --background-activated: #304034;
  --border-color: rgb(168 207 143 / 17%);
  --color: #c1deaf;
}
body.platform-web.dark .category-products-header app-header-filter-button .filter-btn.has-label ion-icon {
  color: #acd391;
}
body.platform-web.dark .category-products-header app-header-filter-button .filter-btn.has-label.has-filters .filter-badge {
  background: #acd391;
  color: #172019;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.22);
}
body.platform-web.dark .category-products-header .category-search-context span {
  color: #91b47c;
}
body.platform-web.dark .category-products-header .category-search-context strong {
  color: #f2f6f3;
}
body.platform-web:not(.dark) .search-product-header app-header-filter-button .filter-btn.has-label.has-filters .filter-badge {
  background: #688d51;
  color: #fff;
  box-shadow: 0 4px 10px rgba(74, 105, 56, 0.2);
}
body.platform-web.dark .search-product-header app-header-filter-button .filter-btn.has-label.has-filters .filter-badge {
  background: #acd391;
  color: #172019;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.22);
}
body.platform-web .category-courses-header {
  display: block;
  width: min(100% - 48px, var(--w-max));
  margin: 22px auto 18px;
}
body.platform-web .category-courses-header,
body.platform-web .category-courses-header ion-header,
body.platform-web .category-courses-header ion-toolbar,
body.platform-web .category-courses-header app-header-search {
  --background: var(--w-canvas) !important;
  background: var(--w-canvas) !important;
  box-shadow: none !important;
  --border-width: 0;
}
body.platform-web .category-courses-header app-header-toolbar {
  display: none;
}
body.platform-web .category-courses-header ion-toolbar {
  --min-height: 48px;
  --padding-start: 0;
  --padding-end: 0;
}
body.platform-web .category-courses-header ion-toolbar ion-buttons[slot=start] {
  display: none !important;
}
body.platform-web .category-courses-header ion-toolbar ion-title {
  padding: 0 !important;
  color: var(--w-text) !important;
  font-size: 28px !important;
  font-weight: 800 !important;
  line-height: 1.2;
  text-align: left !important;
  letter-spacing: -0.025em;
}
body.platform-web .category-courses-header app-header-search {
  display: block;
  width: min(100%, 620px);
  margin: 0 auto;
}
body.platform-web .category-courses-header .search-container {
  min-height: 52px;
  background: var(--w-card) !important;
  border: 1px solid var(--w-border);
  border-radius: 16px;
  box-shadow: 0 8px 26px rgba(31, 49, 29, 0.07);
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
body.platform-web .category-courses-header .search-container:focus-within {
  border-color: var(--w-sage);
  box-shadow: 0 0 0 3px rgba(123, 164, 101, 0.13), var(--w-shadow-sm);
}
body.platform-web .category-courses-header .search-container ion-searchbar {
  --background: transparent !important;
  --box-shadow: none !important;
  --color: var(--w-text);
  --icon-color: var(--w-sage);
  --placeholder-color: var(--w-muted);
  min-height: 52px;
  padding: 0 8px !important;
}
body.platform-web .category-content {
  --background: var(--w-canvas);
  --padding-start: 0;
  --padding-end: 0;
  --padding-bottom: 0;
}
body.platform-web .category-content::part(scroll) {
  display: flex;
  flex-direction: column;
  min-height: 100%;
  overflow-x: hidden;
}
body.platform-web .category-content .course-catalog-intro {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: min(100% - 48px, var(--w-max));
  min-height: 190px;
  margin: 0 auto 34px;
  padding: 36px 42px;
  overflow: hidden;
  color: #f7fbf5;
  background:
    radial-gradient(
      circle at 84% 22%,
      rgba(255, 255, 255, 0.14),
      transparent 24%),
    linear-gradient(
      125deg,
      #587a47 0%,
      #70985c 52%,
      #84aa70 100%);
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 24px;
  box-shadow: 0 20px 46px rgba(59, 88, 45, 0.18);
}
body.platform-web .category-content .course-catalog-intro::after {
  position: absolute;
  right: -36px;
  bottom: -132px;
  width: 330px;
  height: 330px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 50%;
  box-shadow: 0 0 0 42px rgba(255, 255, 255, 0.04), 0 0 0 84px rgba(255, 255, 255, 0.02);
  content: "";
  pointer-events: none;
}
body.platform-web .category-content .course-catalog-intro__copy {
  position: relative;
  z-index: 1;
  max-width: 680px;
}
body.platform-web .category-content .course-catalog-intro__copy h1 {
  margin: 7px 0 10px;
  color: inherit;
  font-size: clamp(28px, 3vw, 40px);
  font-weight: 800;
  line-height: 1.12;
  letter-spacing: -0.035em;
}
body.platform-web .category-content .course-catalog-intro__copy p {
  margin: 0;
  color: rgba(247, 251, 245, 0.82);
  max-width: 610px;
  font-size: 15px;
  line-height: 1.55;
}
body.platform-web .category-content .course-catalog-intro__eyebrow {
  color: rgba(255, 255, 255, 0.72);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.15em;
  text-transform: uppercase;
}
body.platform-web .category-content .course-catalog-intro__feature {
  position: relative;
  z-index: 1;
  display: flex;
  gap: 14px;
  align-items: center;
  min-width: 250px;
  padding: 18px;
  background: rgba(24, 50, 20, 0.25);
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 16px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
}
body.platform-web .category-content .course-catalog-intro__feature-icon {
  display: grid;
  width: 48px;
  height: 48px;
  flex: 0 0 48px;
  place-items: center;
  background: rgba(255, 255, 255, 0.14);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 13px;
}
body.platform-web .category-content .course-catalog-intro__feature-icon ion-icon {
  color: #fff;
  font-size: 24px;
}
body.platform-web .category-content .course-catalog-intro__feature-copy {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
body.platform-web .category-content .course-catalog-intro__feature-copy strong {
  color: #fff;
  font-size: 14px;
  line-height: 1.25;
}
body.platform-web .category-content .course-catalog-intro__feature-copy span {
  color: rgba(255, 255, 255, 0.65);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.09em;
  text-transform: uppercase;
  white-space: nowrap;
}
body.platform-web .category-content .course-catalog-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  width: min(100% - 48px, var(--w-max));
  margin: 0 auto 18px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--w-border);
}
body.platform-web .category-content .course-catalog-heading h2 {
  margin: 3px 0 0;
  color: var(--w-text);
  font-size: 20px;
  font-weight: 800;
  line-height: 1.2;
  letter-spacing: -0.02em;
}
body.platform-web .category-content .course-catalog-heading__eyebrow {
  color: var(--w-sage);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 0.13em;
  text-transform: uppercase;
}
body.platform-web .category-content .course-catalog-heading__count {
  display: flex;
  gap: 5px;
  align-items: center;
  color: var(--w-muted);
  font-size: 12px;
  font-weight: 600;
}
body.platform-web .category-content .course-catalog-heading__count span {
  display: grid;
  min-width: 25px;
  height: 25px;
  padding: 0 7px;
  place-items: center;
  color: var(--w-sage-hover);
  background: rgba(123, 164, 101, 0.12);
  border-radius: 8px;
  font-size: 11px;
  font-weight: 800;
}
body.platform-web .category-content app-paginated-list {
  display: block;
  width: min(100% - 48px, var(--w-max));
  margin: 0 auto;
}
body.platform-web .category-content .courses-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 20px;
  padding: 0 0 48px;
}
body.platform-web .category-content app-course-card {
  min-width: 0;
}
body.platform-web .category-content app-course-card .course-card {
  display: flex;
  height: 100%;
  min-height: 452px;
  margin: 0;
  overflow: hidden;
  background: var(--w-card);
  border: 1px solid var(--w-border);
  border-radius: 18px;
  box-shadow: var(--w-shadow-sm) !important;
  transition:
    transform 0.22s ease,
    border-color 0.22s ease,
    box-shadow 0.22s ease;
}
body.platform-web .category-content app-course-card .course-card:hover {
  border-color: rgba(123, 164, 101, 0.48);
  box-shadow: var(--w-shadow-md) !important;
  transform: translateY(-4px);
}
body.platform-web .category-content app-course-card .course-card:focus-visible {
  outline: 3px solid rgba(123, 164, 101, 0.3);
  outline-offset: 2px;
}
body.platform-web .category-content app-course-card .course-card .card-wrapper {
  flex-direction: column !important;
  width: 100%;
  height: 100%;
}
body.platform-web .category-content app-course-card .course-card .card-image {
  width: 100% !important;
  min-width: 0 !important;
  height: 236px;
  padding: 12px 12px 0 !important;
  background: var(--w-surface);
  flex-shrink: 0;
}
body.platform-web .category-content app-course-card .course-card .card-image app-image-preview,
body.platform-web .category-content app-course-card .course-card .card-image .course-image::part(image) {
  border-radius: 12px !important;
}
body.platform-web .category-content app-course-card .course-card .card-image .course-image::part(image) {
  object-fit: contain !important;
  background: var(--w-surface);
}
body.platform-web .category-content app-course-card .course-card .card-image .premium-badge {
  top: 20px !important;
  left: 20px !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.14);
}
body.platform-web .category-content app-course-card .course-card .card-content {
  gap: 10px;
  padding: 18px !important;
}
body.platform-web .category-content app-course-card .course-card .card-body {
  gap: 7px;
}
body.platform-web .category-content app-course-card .course-card .content-header {
  min-height: 24px;
}
body.platform-web .category-content app-course-card .course-card .category-badge {
  --background: rgb(123 164 101 / 13%) !important;
  --color: var(--w-sage-hover) !important;
  max-width: 104px !important;
  font-weight: 700 !important;
}
body.platform-web .category-content app-course-card .course-card .course-title {
  min-height: 42px !important;
  color: var(--w-text) !important;
  font-size: 14px !important;
  line-height: 21px !important;
}
body.platform-web .category-content app-course-card .course-card .course-instructor,
body.platform-web .category-content app-course-card .course-card .stat-text,
body.platform-web .category-content app-course-card .course-card .course-stats ion-icon {
  color: var(--w-muted) !important;
}
body.platform-web .category-content app-course-card .course-card .card-footer {
  padding-top: 14px !important;
  border-top: 1px solid var(--w-border);
}
body.platform-web .category-content app-course-card .course-card .progress-container {
  min-height: 25px !important;
}
body.platform-web .category-content app-course-card .course-card .progress-container .progress-placeholder {
  height: 25px !important;
}
body.platform-web .category-content app-course-card .course-card .start-button {
  --background: var(--w-sage);
  --background-hover: var(--w-sage-hover);
  --border-radius: 10px;
  --box-shadow: none;
  height: 40px !important;
  font-weight: 700;
}
body.platform-web .category-content .empty-state {
  width: min(100% - 48px, var(--w-max));
  min-height: 300px;
  margin: 0 auto 48px;
  background: var(--w-card);
  border: 1px dashed var(--w-border);
  border-radius: 18px;
}
body.platform-web .category-content app-site-footer {
  display: block;
  margin-top: auto;
}
@media (width < 1100px) {
  body.platform-web .category-content .courses-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}
@media (width < 768px) {
  body.platform-web .category-courses-header {
    width: calc(100% - 32px);
    margin: 16px auto 18px;
  }
  body.platform-web .category-courses-header ion-toolbar ion-title {
    font-size: 22px !important;
  }
  body.platform-web .category-content .course-catalog-intro {
    align-items: flex-start;
    width: calc(100% - 32px);
    padding: 24px;
  }
  body.platform-web .category-content .course-catalog-intro__feature {
    display: none;
  }
  body.platform-web .category-content .course-catalog-heading {
    width: calc(100% - 32px);
  }
  body.platform-web .category-content app-paginated-list {
    width: calc(100% - 32px);
  }
  body.platform-web .category-content .courses-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 14px;
  }
  body.platform-web .category-content app-course-card .course-card {
    min-height: 400px;
  }
  body.platform-web .category-content app-course-card .course-card .card-image {
    height: 190px;
  }
}
body.platform-web.dark .category-courses-header .search-container {
  background: #172019 !important;
  border-color: rgba(205, 226, 210, 0.12);
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.18);
}
body.platform-web.dark .category-courses-header .search-container:focus-within {
  border-color: rgba(172, 211, 145, 0.55);
  box-shadow: 0 0 0 3px rgba(172, 211, 145, 0.1);
}
body.platform-web.dark .category-content .course-catalog-intro {
  background:
    radial-gradient(
      circle at 84% 22%,
      rgba(172, 211, 145, 0.12),
      transparent 24%),
    linear-gradient(
      125deg,
      #1b2b1f 0%,
      #263b2a 56%,
      #304a34 100%);
  border-color: rgba(205, 226, 210, 0.1);
  box-shadow: 0 18px 42px rgba(0, 0, 0, 0.26);
}
body.platform-web.dark .category-content .course-catalog-intro__feature {
  background: rgba(5, 12, 7, 0.3);
  border-color: rgba(205, 226, 210, 0.1);
}
body.platform-web.dark .category-content app-course-card .course-card {
  background: #151d18;
  border-color: rgba(205, 226, 210, 0.1);
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.18) !important;
}
body.platform-web.dark .category-content app-course-card .course-card:hover {
  border-color: rgba(172, 211, 145, 0.32);
  box-shadow: 0 18px 38px rgba(0, 0, 0, 0.3) !important;
}
body.platform-web.dark .category-content app-course-card .course-card .card-image {
  background: #1d2821;
}
body.platform-web.dark .category-content app-course-card .course-card .card-image .course-image::part(image) {
  background: #1d2821;
}
body.platform-web.dark .category-content app-course-card .course-card .category-badge {
  --background: rgb(172 211 145 / 12%) !important;
  --color: #b9dba4 !important;
}
body.platform-web.dark .category-content app-course-card .course-card .card-footer {
  border-color: rgba(205, 226, 210, 0.09);
}
body.platform-web.dark .category-content app-course-card .course-card .start-button {
  --background: #8db874;
  --background-hover: #9bc783;
  --color: #101710;
}
body.platform-web.dark .category-content .course-catalog-heading__count span {
  color: #b9dba4;
  background: rgba(172, 211, 145, 0.12);
}
body.platform-web:not(.dark) .books-content--web .books-web-search {
  max-width: 1124px;
}
body.platform-web:not(.dark) .books-content--web app-header-search.books-collection-search .search-container {
  min-height: 58px;
  gap: 0;
  padding: 5px 6px 5px 10px !important;
  border: 1px solid rgba(87, 121, 67, 0.18) !important;
  border-radius: 18px;
  background:
    linear-gradient(
      135deg,
      rgba(129, 168, 105, 0.05),
      transparent 42%),
    #fff !important;
  box-shadow: 0 10px 28px rgba(61, 84, 48, 0.09), inset 0 1px 0 #fff !important;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
body.platform-web:not(.dark) .books-content--web app-header-search.books-collection-search .search-container:hover {
  border-color: rgba(101, 139, 78, 0.3) !important;
  box-shadow: 0 14px 34px rgba(61, 84, 48, 0.12), inset 0 1px 0 #fff !important;
}
body.platform-web:not(.dark) .books-content--web app-header-search.books-collection-search .search-container:focus-within {
  border-color: #7da662 !important;
  box-shadow: 0 0 0 4px rgba(125, 166, 98, 0.13), 0 16px 38px rgba(61, 84, 48, 0.13) !important;
}
body.platform-web:not(.dark) .books-content--web app-header-search.books-collection-search ion-searchbar {
  --background: transparent;
  --box-shadow: none;
  --color: #202720;
  --icon-color: #65884f;
  --placeholder-color: #727d72;
  --placeholder-opacity: 1;
  min-height: 46px;
  height: 46px;
  padding-inline: 0;
  border: 0 !important;
  border-radius: 14px;
  box-shadow: none !important;
}
body.platform-web:not(.dark) .books-content--web app-header-search.books-collection-search .filter-content {
  display: flex;
  align-items: center;
  flex: 0 0 auto;
  padding-left: 8px;
  border-left: 1px solid rgba(87, 121, 67, 0.12);
}
body.platform-web:not(.dark) .books-content--web app-header-search.books-collection-search app-header-filter-button .filter-btn.has-label {
  --background: #eaf3e5;
  --background-hover: #dcebd4;
  --background-focused: #dcebd4;
  --background-activated: #d2e4c8;
  --border-color: rgb(93 130 70 / 16%);
  --border-radius: 12px;
  --border-style: solid;
  --border-width: 1px;
  --box-shadow: none;
  --color: #4f713d;
  min-width: 94px;
  height: 42px;
}
body.platform-web:not(.dark) .books-content--web app-header-search.books-collection-search app-header-filter-button .filter-btn.has-label ion-icon {
  color: #5f8448;
}
body.platform-web .section-products-header {
  padding: 0 !important;
  border-bottom: 1px solid rgba(101, 132, 82, 0.09);
}
body.platform-web .section-products-header .section-products-search-row {
  width: min(100%, 1328px);
  max-width: 1328px;
  margin-inline: auto;
  padding: 16px 24px 18px;
}
body.platform-web .section-products-header .section-products-back-btn {
  width: 44px;
  height: 44px;
  flex-basis: 44px;
  border-color: rgba(101, 132, 82, 0.17);
  border-radius: 13px;
  background: #fff;
  color: #587743;
  box-shadow: 0 8px 20px rgba(61, 84, 48, 0.09);
}
body.platform-web .section-products-header .section-products-search-context span {
  color: #789766;
}
body.platform-web .section-products-header .section-products-search-context strong {
  color: #202720;
  font-weight: 800;
}
body.platform-web .section-products-header app-header-search.section-products-search .search-container {
  min-height: 58px;
  gap: 0;
  padding: 5px 8px 5px 10px;
  border: 1px solid rgba(101, 132, 82, 0.17);
  border-radius: 18px;
  background:
    linear-gradient(
      135deg,
      rgba(129, 168, 105, 0.04),
      transparent 42%),
    #fff !important;
  box-shadow: 0 10px 28px rgba(61, 84, 48, 0.09);
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
body.platform-web .section-products-header app-header-search.section-products-search .search-container:hover {
  border-color: rgba(101, 139, 78, 0.29);
  box-shadow: 0 14px 34px rgba(61, 84, 48, 0.12);
}
body.platform-web .section-products-header app-header-search.section-products-search .search-container:focus-within {
  border-color: #7da662;
  box-shadow: 0 0 0 4px rgba(125, 166, 98, 0.12), 0 16px 38px rgba(61, 84, 48, 0.13);
}
body.platform-web .section-products-header app-header-search.section-products-search ion-searchbar {
  --background: transparent !important;
  --color: #202720;
  --icon-color: #71945b;
  --placeholder-color: #6f796f;
  --placeholder-font-style: normal;
  --placeholder-font-weight: 400;
  --placeholder-opacity: 1;
  min-height: 46px;
  height: 46px;
  font-family: var(--font-family-regular);
  font-size: 14px;
  line-height: 1;
  transform: translateY(2px);
}
body.platform-web .section-products-content {
  --padding-top: 0;
  --sp-canvas: #f2f5f0;
  --sp-card: #fff;
  --sp-soft: #f7faf5;
  --sp-border: rgb(101 132 82 / 14%);
  --sp-text: #202720;
  --sp-muted: #717c72;
  --sp-accent: #6e9457;
  --sp-shadow: 0 16px 42px rgb(61 84 48 / 9%);
  --background:
    radial-gradient(
      circle at 86% 2%,
      rgb(123 164 101 / 9%),
      transparent 32rem),
    linear-gradient(
      180deg,
      #f6f8f4 0%,
      var(--sp-canvas) 100%);
}
body.platform-web .section-products-content::part(scroll) {
  background:
    radial-gradient(
      circle at 86% 2%,
      rgba(123, 164, 101, 0.09),
      transparent 32rem),
    linear-gradient(
      180deg,
      #f6f8f4 0%,
      var(--sp-canvas) 100%);
}
body.platform-web .section-products-content .section-products-body {
  width: min(100%, 1328px);
  max-width: none;
  margin-inline: auto;
  padding: 20px 24px 48px;
}
body.platform-web .section-products-content .section-catalog-hero {
  position: relative;
  min-height: 178px;
  overflow: hidden;
  border-color: var(--sp-border);
  background:
    radial-gradient(
      circle at 80% 8%,
      rgba(123, 164, 101, 0.18),
      transparent 34%),
    linear-gradient(
      135deg,
      #fff 0%,
      #f1f7ed 60%,
      #e8f1e3 100%);
  box-shadow: var(--sp-shadow), inset 0 1px 0 rgba(255, 255, 255, 0.9);
}
body.platform-web .section-products-content .section-catalog-hero::after {
  position: absolute;
  top: -88px;
  right: -36px;
  width: 250px;
  height: 250px;
  border: 1px solid rgba(123, 164, 101, 0.11);
  border-radius: 50%;
  box-shadow: 0 0 0 34px rgba(123, 164, 101, 0.035), 0 0 0 68px rgba(123, 164, 101, 0.015);
  content: "";
  pointer-events: none;
}
body.platform-web .section-products-content .section-catalog-hero-copy,
body.platform-web .section-products-content .section-catalog-highlight {
  position: relative;
  z-index: 1;
}
body.platform-web .section-products-content .section-catalog-hero-copy h1 {
  color: var(--sp-text);
}
body.platform-web .section-products-content .section-catalog-hero-copy p {
  color: var(--sp-muted);
}
body.platform-web .section-products-content .section-catalog-eyebrow {
  color: var(--sp-accent);
}
body.platform-web .section-products-content .section-catalog-highlight {
  border-color: var(--sp-border);
  background: rgba(255, 255, 255, 0.74);
  box-shadow: 0 12px 30px rgba(61, 84, 48, 0.09);
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
}
body.platform-web .section-products-content .section-catalog-highlight strong {
  color: var(--sp-text);
}
body.platform-web .section-products-content .section-catalog-highlight small {
  color: var(--sp-muted);
}
body.platform-web .section-products-content .section-catalog-highlight-mark {
  border: 1px solid rgba(123, 164, 101, 0.16);
  background: #e8f2e2;
}
body.platform-web .section-products-content .section-catalog-panel {
  border-color: var(--sp-border);
  background:
    linear-gradient(
      180deg,
      rgba(255, 255, 255, 0.98),
      rgba(250, 252, 249, 0.94));
  box-shadow: var(--sp-shadow), inset 0 1px 0 rgba(255, 255, 255, 0.88);
}
body.platform-web .section-products-content .section-catalog-heading {
  border-bottom-color: var(--sp-border);
}
body.platform-web .section-products-content .section-catalog-heading h2 {
  color: var(--sp-text);
}
body.platform-web .section-products-content .section-catalog-heading p {
  color: var(--sp-muted);
}
body.platform-web .section-products-content .section-catalog-count {
  border: 1px solid rgba(111, 149, 87, 0.16);
  background: rgba(123, 164, 101, 0.09);
  color: var(--sp-accent);
}
body.platform-web .section-products-content .section-catalog-panel .products-grid {
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 14px !important;
  margin: 0;
  padding: 0;
}
body.platform-web .section-products-content .section-catalog-panel app-product-card {
  display: block;
  min-width: 0;
  height: 100%;
}
body.platform-web .section-products-content .section-catalog-panel app-product-card .product-card {
  display: flex;
  width: 100%;
  min-width: 0;
  max-width: none;
  min-height: 294px;
  height: 100%;
  padding: 12px;
  border: 1px solid var(--sp-border);
  border-radius: 16px;
  background: var(--sp-soft);
  box-shadow: 0 10px 26px rgba(61, 84, 48, 0.08);
  aspect-ratio: auto;
  flex-direction: column;
  overflow: hidden;
}
body.platform-web .section-products-content .section-catalog-panel app-product-card .product-card:hover {
  border-color: rgba(111, 149, 87, 0.4);
  box-shadow: 0 20px 44px rgba(61, 84, 48, 0.14);
  transform: translateY(-4px);
}
body.platform-web .section-products-content .section-catalog-panel app-product-card .product-card-image-container {
  position: relative;
  top: auto;
  left: auto;
  width: 100%;
  height: 154px;
  min-height: 154px;
  max-height: 154px;
  border: 1px solid var(--sp-border);
  border-radius: 12px;
  background: var(--sp-card);
  aspect-ratio: auto;
  overflow: visible;
}
body.platform-web .section-products-content .section-catalog-panel app-product-card .product-card-image {
  display: block;
  width: 100%;
  height: 100%;
  overflow: hidden;
  border-radius: 11px;
}
body.platform-web .section-products-content .section-catalog-panel app-product-card .product-card-image ion-img::part(image) {
  object-fit: contain;
  object-position: center;
}
body.platform-web .section-products-content .section-catalog-panel app-product-card .product-card-info {
  position: static;
  width: 100%;
  min-height: 0;
  margin-top: auto;
  padding-top: 12px;
}
body.platform-web .section-products-content .section-catalog-panel app-product-card .product-card-name {
  min-height: 0;
  color: var(--sp-text);
  font-size: 14px;
  font-weight: 750;
  line-height: 1.3;
  white-space: normal;
}
body.platform-web .section-products-content .section-catalog-panel app-product-card .product-card-rating,
body.platform-web .section-products-content .section-catalog-panel app-product-card .product-card-pricing {
  position: static;
  width: 100%;
  height: auto;
}
body.platform-web .section-products-content .section-catalog-panel app-product-card .product-card-rating {
  gap: 3px;
  min-height: 16px;
  margin-top: 5px;
}
body.platform-web .section-products-content .section-catalog-panel app-product-card .product-card-rating ion-icon {
  flex: 0 0 12px;
  width: 12px;
  height: 12px;
}
body.platform-web .section-products-content .section-catalog-panel app-product-card .product-card-review-count {
  margin-left: 3px;
  color: var(--sp-muted);
  font-size: 11px;
}
body.platform-web .section-products-content .section-catalog-panel app-product-card .product-card-pricing {
  min-height: 32px;
  margin-top: 8px;
  padding-top: 10px;
  border-top: 1px solid var(--sp-border);
  overflow: visible;
}
body.platform-web .section-products-content .section-catalog-panel app-product-card .product-card-current-price {
  color: #df5f77;
  font-size: 15px;
  font-weight: 800;
}
body.platform-web .section-products-content .section-catalog-panel .empty-state {
  min-height: 220px;
  border: 1px dashed var(--sp-border);
  border-radius: 18px;
  background: var(--sp-soft);
  color: var(--sp-muted);
}
@media (width >= 768px) and (width < 1100px) {
  body.platform-web .section-products-content .section-catalog-panel .products-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}
@media (width >= 1100px) and (width < 1280px) {
  body.platform-web .section-products-content .section-catalog-panel .products-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  }
}
@media (width < 768px) {
  body.platform-web .section-products-content .section-products-body {
    padding: 12px 16px 32px;
  }
  body.platform-web .section-products-content .section-catalog-panel .products-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  body.platform-web .section-products-content .section-catalog-panel app-product-card .product-card {
    min-height: 262px;
  }
  body.platform-web .section-products-content .section-catalog-panel app-product-card .product-card-image-container {
    height: 124px;
    min-height: 124px;
    max-height: 124px;
  }
}
body.platform-web.dark .section-products-header {
  border-bottom-color: rgba(205, 226, 210, 0.08);
  background:
    linear-gradient(
      180deg,
      #101713 0%,
      #0d130f 100%) !important;
}
body.platform-web.dark .section-products-header .section-products-back-btn {
  border-color: rgba(168, 207, 143, 0.16);
  background: #18211b;
  color: #b5d7a0;
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.24);
}
body.platform-web.dark .section-products-header .section-products-search-context span {
  color: #91b47c;
}
body.platform-web.dark .section-products-header .section-products-search-context strong {
  color: #f2f6f3;
}
body.platform-web.dark .section-products-header app-header-search.section-products-search .search-container {
  border-color: rgba(168, 207, 143, 0.14);
  background:
    radial-gradient(
      circle at 12% 0%,
      rgba(168, 207, 143, 0.07),
      transparent 34rem),
    linear-gradient(
      180deg,
      #152019 0%,
      #101812 100%) !important;
  box-shadow: 0 10px 26px rgba(0, 0, 0, 0.24);
}
body.platform-web.dark .section-products-header app-header-search.section-products-search ion-searchbar {
  --background: transparent !important;
  --color: #f2f6f3;
  --icon-color: #acd391;
  --placeholder-color: #9aa69e;
}
body.platform-web.dark .section-products-content {
  --sp-canvas: #090e0b;
  --sp-card: #18211b;
  --sp-soft: #141c17;
  --sp-border: rgb(205 226 210 / 11%);
  --sp-text: #f2f6f3;
  --sp-muted: #9ba79f;
  --sp-accent: #acd391;
  --sp-shadow: 0 20px 50px rgb(0 0 0 / 24%);
  --background:
    radial-gradient(
      circle at 86% 2%,
      rgb(168 207 143 / 6%),
      transparent 32rem),
    linear-gradient(
      180deg,
      #0d130f 0%,
      var(--sp-canvas) 100%);
}
body.platform-web.dark .section-products-content::part(scroll) {
  background:
    radial-gradient(
      circle at 86% 2%,
      rgba(168, 207, 143, 0.06),
      transparent 32rem),
    linear-gradient(
      180deg,
      #0d130f 0%,
      var(--sp-canvas) 100%);
}
body.platform-web.dark .section-products-content .section-catalog-hero {
  background:
    radial-gradient(
      circle at 80% 8%,
      rgba(168, 207, 143, 0.16),
      transparent 34%),
    linear-gradient(
      135deg,
      #1a281e 0%,
      #121b15 60%,
      #0f1612 100%);
  box-shadow: var(--sp-shadow), inset 0 1px 0 rgba(255, 255, 255, 0.04);
}
body.platform-web.dark .section-products-content .section-catalog-hero::after {
  border-color: rgba(168, 207, 143, 0.09);
  box-shadow: 0 0 0 34px rgba(168, 207, 143, 0.03), 0 0 0 68px rgba(168, 207, 143, 0.015);
}
body.platform-web.dark .section-products-content .section-catalog-highlight {
  background: rgba(10, 16, 12, 0.6);
  box-shadow: 0 14px 32px rgba(0, 0, 0, 0.22);
}
body.platform-web.dark .section-products-content .section-catalog-highlight-mark {
  background: rgba(168, 207, 143, 0.09);
}
body.platform-web.dark .section-products-content .section-catalog-panel {
  background:
    linear-gradient(
      180deg,
      rgba(255, 255, 255, 0.02),
      transparent 38%),
    #111713;
  box-shadow: var(--sp-shadow), inset 0 1px 0 rgba(255, 255, 255, 0.03);
}
body.platform-web.dark .section-products-content .section-catalog-panel app-product-card .product-card {
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.22);
}
body.platform-web.dark .section-products-content .section-catalog-panel app-product-card .product-card:hover {
  box-shadow: 0 20px 44px rgba(0, 0, 0, 0.34);
}
body.platform-web.dark .section-products-content .section-catalog-panel app-product-card .product-card-image-container {
  background:
    radial-gradient(
      circle at 50% 38%,
      rgba(168, 207, 143, 0.06),
      transparent 62%),
    #202b23;
}
body.platform-web.dark .section-products-content .section-catalog-panel app-product-card .product-card-rating ion-icon:not(.filled) {
  color: #465149;
}
@keyframes country-dropdown-enter {
  from {
    opacity: 0;
    transform: translateY(-6px) scale(0.98);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}
body.platform-web.dark app-menu {
  --menu-dark-canvas: #090e0b;
  --menu-dark-surface: #111713;
  --menu-dark-surface-raised: #172019;
  --menu-dark-surface-soft: #1c261f;
  --menu-dark-control: #0e1410;
  --menu-dark-border: rgb(205 226 210 / 12%);
  --menu-dark-border-strong: rgb(168 207 143 / 40%);
  --menu-dark-text: #f2f6f3;
  --menu-dark-muted: #9da9a1;
  --menu-dark-subtle: #748078;
  --menu-dark-accent: #acd391;
}
body.platform-web.dark app-menu .menu-content {
  --background:
    radial-gradient(
      circle at 14% 0%,
      rgb(168 207 143 / 7%),
      transparent 34rem),
    linear-gradient(
      180deg,
      #0d130f 0%,
      var(--menu-dark-canvas) 54%,
      #070b08 100%);
  color: var(--menu-dark-text);
}
body.platform-web.dark app-menu .menu-content::part(scroll) {
  background:
    radial-gradient(
      circle at 14% 0%,
      rgba(168, 207, 143, 0.07),
      transparent 34rem),
    linear-gradient(
      180deg,
      #0d130f 0%,
      var(--menu-dark-canvas) 54%,
      #070b08 100%);
}
body.platform-web.dark app-menu .menu-container {
  color: var(--menu-dark-text);
}
body.platform-web.dark app-menu .menu-intro {
  border-color: rgba(205, 226, 210, 0.11);
  background:
    linear-gradient(
      180deg,
      rgba(255, 255, 255, 0.025),
      transparent 38%),
    #0f1612;
  color: var(--menu-dark-text);
  box-shadow: 0 18px 46px rgba(0, 0, 0, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.03);
}
body.platform-web.dark app-menu .menu-intro::before {
  background:
    linear-gradient(
      90deg,
      #a8cf8f,
      rgba(168, 207, 143, 0));
}
body.platform-web.dark app-menu .menu-intro::after {
  border-color: rgba(255, 255, 255, 0.07);
  box-shadow: 0 0 0 34px rgba(255, 255, 255, 0.02), 0 0 0 68px rgba(255, 255, 255, 0.01);
}
body.platform-web.dark app-menu .menu-intro h1 {
  color: var(--menu-dark-text);
  text-shadow: 0 2px 18px rgba(0, 0, 0, 0.18);
}
body.platform-web.dark app-menu .menu-intro p {
  color: rgba(242, 246, 243, 0.78);
}
body.platform-web.dark app-menu .menu-section {
  background:
    linear-gradient(
      180deg,
      rgba(255, 255, 255, 0.025),
      transparent 38%),
    #0f1612;
  border-color: rgba(205, 226, 210, 0.11);
  box-shadow: 0 18px 46px rgba(0, 0, 0, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.03);
}
body.platform-web.dark app-menu .menu-section::before {
  background:
    linear-gradient(
      90deg,
      #a8cf8f,
      rgba(168, 207, 143, 0));
}
body.platform-web.dark app-menu .menu-eyebrow {
  color: #f1ce70;
}
body.platform-web.dark app-menu .menu-section-heading h2 {
  color: var(--menu-dark-text);
}
body.platform-web.dark app-menu .menu-section-heading p {
  color: var(--menu-dark-muted);
}
body.platform-web.dark app-menu .menu-section-kicker {
  color: var(--menu-dark-accent);
}
body.platform-web.dark app-menu .menu-list {
  background: transparent;
}
body.platform-web.dark app-menu .menu-item {
  --background: var(--menu-dark-surface-raised);
  --background-hover: var(--menu-dark-surface-soft);
  --color: var(--menu-dark-text);
  border-color: var(--menu-dark-border);
  background:
    linear-gradient(
      145deg,
      rgba(255, 255, 255, 0.03),
      transparent 54%),
    var(--menu-dark-surface-raised);
  box-shadow: 0 14px 32px rgba(0, 0, 0, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.03);
}
body.platform-web.dark app-menu .menu-item:hover {
  --background: var(--menu-dark-surface-soft);
  border-color: var(--menu-dark-border-strong);
  background:
    radial-gradient(
      circle at 0% 50%,
      rgba(168, 207, 143, 0.08),
      transparent 42%),
    var(--menu-dark-surface-soft);
  box-shadow: 0 20px 42px rgba(0, 0, 0, 0.32), 0 0 0 2px rgba(168, 207, 143, 0.04);
}
body.platform-web.dark app-menu .menu-item:hover .menu-item-arrow {
  color: var(--menu-dark-accent);
}
body.platform-web.dark app-menu .menu-item:focus-visible {
  outline: 3px solid rgba(168, 207, 143, 0.22);
  outline-offset: 3px;
}
body.platform-web.dark app-menu .menu-item-icon-wrap,
body.platform-web.dark app-menu .menu-setting-icon {
  border: 1px solid rgba(168, 207, 143, 0.1);
  background: rgba(168, 207, 143, 0.1);
  color: var(--menu-dark-accent);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03);
}
body.platform-web.dark app-menu .menu-item-label {
  color: var(--menu-dark-text);
}
body.platform-web.dark app-menu .menu-item-arrow {
  color: var(--menu-dark-subtle);
}
body.platform-web.dark app-menu .menu-theme-card,
body.platform-web.dark app-menu .menu-language-card {
  --background: var(--menu-dark-surface-raised);
  border-color: var(--menu-dark-border);
  background:
    linear-gradient(
      145deg,
      rgba(255, 255, 255, 0.03),
      transparent 54%),
    var(--menu-dark-surface-raised);
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.24), inset 0 1px 0 rgba(255, 255, 255, 0.03);
  transition:
    border-color 180ms ease,
    box-shadow 180ms ease,
    transform 180ms ease;
}
body.platform-web.dark app-menu .menu-theme-card:hover,
body.platform-web.dark app-menu .menu-language-card:hover {
  border-color: rgba(168, 207, 143, 0.24);
  box-shadow: 0 24px 50px rgba(0, 0, 0, 0.32);
  transform: translateY(-2px);
}
body.platform-web.dark app-menu .menu-theme-item {
  --background: transparent;
  --color: var(--menu-dark-text);
}
body.platform-web.dark app-menu .menu-theme-label {
  color: var(--menu-dark-text);
}
body.platform-web.dark app-menu .menu-theme-label small {
  color: var(--menu-dark-muted);
}
body.platform-web.dark app-menu .menu-theme-toggle {
  --background: #303a33;
  --background-checked: #86ad6e;
  --handle-background: #aab3ad;
  --handle-background-checked: #f6faf4;
}
body.platform-web.dark app-menu .menu-language-title {
  color: var(--menu-dark-text);
}
body.platform-web.dark app-menu .menu-language-copy p {
  color: var(--menu-dark-muted);
}
body.platform-web.dark app-menu .menu-language-select {
  --background: var(--menu-dark-control);
  --color: var(--menu-dark-text);
  --placeholder-color: var(--menu-dark-muted);
  --highlight-color-focused: transparent;
  border-color: var(--menu-dark-border);
  background: var(--menu-dark-control);
  color: var(--menu-dark-text);
  box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.32);
  transition:
    border-color 180ms ease,
    box-shadow 180ms ease,
    background-color 180ms ease;
}
body.platform-web.dark app-menu .menu-language-select:hover,
body.platform-web.dark app-menu .menu-language-select:focus,
body.platform-web.dark app-menu .menu-language-select.ion-focused,
body.platform-web.dark app-menu .menu-language-select.select-expanded {
  border-color: var(--menu-dark-border-strong);
  background: #111a13;
  box-shadow: 0 0 0 3px rgba(168, 207, 143, 0.08) ! important, inset 0 1px 4px rgba(0, 0, 0, 0.28) !important;
}
body.platform-web.dark app-menu .menu-language-select::part(text),
body.platform-web.dark app-menu .menu-language-select::part(placeholder) {
  color: var(--menu-dark-text);
}
body.platform-web.dark app-menu .menu-language-select::part(icon) {
  color: var(--menu-dark-accent) !important;
}
@media (width < 900px) {
  body.platform-web.dark app-menu .menu-container {
    background: transparent;
  }
  body.platform-web.dark app-menu .menu-list,
  body.platform-web.dark app-menu .menu-theme-card,
  body.platform-web.dark app-menu .menu-language-card {
    border: 1px solid var(--menu-dark-border);
    background: var(--menu-dark-surface-raised);
  }
}
body.platform-web :is(.login-content, .login-email-content) :is(.login-social-buttons, .login-email-social-buttons) ion-button {
  --background: rgb(255 252 246 / 82%);
  --background-hover: #edf4e9;
  --background-activated: #e4eedf;
  --border-color: rgb(111 149 92 / 24%);
  --color: var(--w-text);
  border-radius: var(--w-radius-card);
  box-shadow: none;
  transition: transform 180ms ease;
}
body.platform-web :is(.login-content, .login-email-content) :is(.login-social-buttons, .login-email-social-buttons) ion-button::part(native) {
  border: 1px solid var(--border-color);
  background: var(--background);
  box-shadow: 0 6px 16px rgba(68, 97, 54, 0.05), inset 0 1px 0 rgba(255, 255, 255, 0.72);
  transition:
    background-color 180ms ease,
    border-color 180ms ease,
    box-shadow 180ms ease,
    color 180ms ease;
}
body.platform-web :is(.login-content, .login-email-content) :is(.login-social-buttons, .login-email-social-buttons) ion-button:hover {
  --border-color: rgb(111 149 92 / 48%);
  box-shadow: none;
  transform: translateY(-2px);
}
body.platform-web :is(.login-content, .login-email-content) :is(.login-social-buttons, .login-email-social-buttons) ion-button:hover::part(native) {
  background: var(--background-hover);
  box-shadow: 0 12px 26px rgba(68, 97, 54, 0.14), inset 0 1px 0 rgba(255, 255, 255, 0.8);
}
body.platform-web :is(.login-content, .login-email-content) :is(.login-social-buttons, .login-email-social-buttons) ion-button:active {
  transform: translateY(0);
}
body.platform-web :is(.login-content, .login-email-content) :is(.login-social-buttons, .login-email-social-buttons) ion-button:active::part(native) {
  background: var(--background-activated);
  box-shadow: 0 4px 10px rgba(68, 97, 54, 0.09), inset 0 1px 2px rgba(68, 97, 54, 0.1);
}
body.platform-web :is(.login-content, .login-email-content) :is(.login-social-buttons, .login-email-social-buttons) ion-button:focus-visible {
  outline: none;
}
body.platform-web :is(.login-content, .login-email-content) :is(.login-social-buttons, .login-email-social-buttons) ion-button:focus-visible::part(native) {
  border-color: #7ba465;
  box-shadow: 0 0 0 3px rgba(123, 164, 101, 0.16), 0 10px 24px rgba(68, 97, 54, 0.12);
}
body.platform-web.dark :is(.login-content, .login-email-content) :is(.login-social-buttons, .login-email-social-buttons) ion-button {
  --background: #18211b;
  --background-hover: #202b23;
  --background-activated: #263329;
  --border-color: rgb(205 226 210 / 13%);
  --color: #f2f6f3;
}
body.platform-web.dark :is(.login-content, .login-email-content) :is(.login-social-buttons, .login-email-social-buttons) ion-button::part(native) {
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.03);
}
body.platform-web.dark :is(.login-content, .login-email-content) :is(.login-social-buttons, .login-email-social-buttons) ion-button:hover {
  --border-color: rgb(168 207 143 / 48%);
}
body.platform-web.dark :is(.login-content, .login-email-content) :is(.login-social-buttons, .login-email-social-buttons) ion-button:hover::part(native) {
  box-shadow: 0 14px 30px rgba(0, 0, 0, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.05);
}
body.platform-web.dark :is(.login-content, .login-email-content) :is(.login-social-buttons, .login-email-social-buttons) ion-button:active::part(native) {
  box-shadow: 0 5px 12px rgba(0, 0, 0, 0.22), inset 0 2px 4px rgba(0, 0, 0, 0.24);
}
body.platform-web.dark :is(.login-content, .login-email-content) :is(.login-social-buttons, .login-email-social-buttons) ion-button:focus-visible::part(native) {
  border-color: #acd391;
  box-shadow: 0 0 0 3px rgba(168, 207, 143, 0.14), 0 12px 28px rgba(0, 0, 0, 0.28);
}
body.platform-web.dark app-live-class {
  --live-dark-canvas: #090e0b;
  --live-dark-surface: #111713;
  --live-dark-surface-raised: #172019;
  --live-dark-surface-soft: #1c261f;
  --live-dark-border: rgb(205 226 210 / 12%);
  --live-dark-border-strong: rgb(168 207 143 / 38%);
  --live-dark-text: #f2f6f3;
  --live-dark-muted: #9da9a1;
  --live-dark-subtle: #748078;
  --live-dark-accent: #acd391;
  --live-dark-danger: #f28b99;
}
body.platform-web.dark app-live-class .live-class-content {
  --background:
    radial-gradient(
      circle at 14% 0%,
      rgb(168 207 143 / 7%),
      transparent 34rem),
    linear-gradient(
      180deg,
      #0d130f 0%,
      var(--live-dark-canvas) 54%,
      #070b08 100%);
  color: var(--live-dark-text);
}
body.platform-web.dark app-live-class .live-class-content::part(scroll) {
  background:
    radial-gradient(
      circle at 14% 0%,
      rgba(168, 207, 143, 0.07),
      transparent 34rem),
    linear-gradient(
      180deg,
      #0d130f 0%,
      var(--live-dark-canvas) 54%,
      #070b08 100%);
}
body.platform-web.dark app-live-class .live-class-page {
  color: var(--live-dark-text);
}
body.platform-web.dark app-live-class .live-class-hero {
  border-color: var(--live-dark-border);
  background:
    radial-gradient(
      circle at 12% 0%,
      rgba(168, 207, 143, 0.12),
      transparent 38%),
    radial-gradient(
      circle at 92% 100%,
      rgba(233, 102, 119, 0.05),
      transparent 32%),
    linear-gradient(
      145deg,
      var(--live-dark-surface-raised),
      var(--live-dark-surface));
  box-shadow: 0 30px 76px rgba(0, 0, 0, 0.34), inset 0 1px 0 rgba(255, 255, 255, 0.04);
}
body.platform-web.dark app-live-class .live-class-back-btn {
  border-color: var(--live-dark-border);
  background: var(--live-dark-surface-soft);
  color: var(--live-dark-accent);
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.24);
}
body.platform-web.dark app-live-class .live-class-back-btn:hover {
  border-color: var(--live-dark-border-strong);
  background: #243027;
  box-shadow: 0 14px 30px rgba(0, 0, 0, 0.3);
}
body.platform-web.dark app-live-class .live-class-hero-copy h1 {
  color: var(--live-dark-text);
  text-shadow: 0 2px 18px rgba(0, 0, 0, 0.18);
}
body.platform-web.dark app-live-class .live-class-hero-copy p {
  color: var(--live-dark-muted);
}
body.platform-web.dark app-live-class .live-class-hero-eyebrow {
  color: var(--live-dark-accent);
}
body.platform-web.dark app-live-class .live-class-hero-action.primary {
  border-color: #a5ce89;
  background: #a5ce89;
  color: #0b110d;
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.25);
}
body.platform-web.dark app-live-class .live-class-hero-action.primary:not(:disabled):hover {
  border-color: #b4d99b;
  background: #b4d99b;
}
body.platform-web.dark app-live-class .live-class-hero-action.secondary {
  border-color: rgba(168, 207, 143, 0.52);
  background: rgba(168, 207, 143, 0.05);
  color: var(--live-dark-accent);
}
body.platform-web.dark app-live-class .live-class-hero-action.secondary:not(:disabled):hover {
  border-color: var(--live-dark-accent);
  background: rgba(168, 207, 143, 0.12);
}
body.platform-web.dark app-live-class .live-class-hero-action:disabled {
  border-color: var(--live-dark-border);
  background: #202923;
  color: #717d75;
  opacity: 1;
}
body.platform-web.dark app-live-class .live-class-stat {
  position: relative;
  overflow: hidden;
  border-color: var(--live-dark-border);
  background:
    linear-gradient(
      145deg,
      rgba(255, 255, 255, 0.03),
      transparent 55%),
    var(--live-dark-surface-soft);
  box-shadow: 0 16px 36px rgba(0, 0, 0, 0.24), inset 0 1px 0 rgba(255, 255, 255, 0.03);
}
body.platform-web.dark app-live-class .live-class-stat::before {
  position: absolute;
  inset: 0 auto 0 0;
  width: 3px;
  background:
    linear-gradient(
      180deg,
      var(--live-dark-accent),
      transparent 86%);
  content: "";
}
body.platform-web.dark app-live-class .live-class-stat .stat-label {
  color: var(--live-dark-muted);
}
body.platform-web.dark app-live-class .live-class-stat strong {
  color: var(--live-dark-text);
}
body.platform-web.dark app-live-class .section-panel {
  border-color: rgba(205, 226, 210, 0.11);
  background:
    linear-gradient(
      180deg,
      rgba(255, 255, 255, 0.025),
      transparent 38%),
    #0f1612;
  box-shadow: 0 18px 46px rgba(0, 0, 0, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.03);
}
body.platform-web.dark app-live-class .section-panel::before {
  background:
    linear-gradient(
      90deg,
      #a8cf8f,
      rgba(168, 207, 143, 0));
}
body.platform-web.dark app-live-class .section-header-row {
  padding-bottom: 18px;
  border-bottom: 1px solid var(--live-dark-border);
}
body.platform-web.dark app-live-class .section .section-title {
  color: var(--live-dark-text);
  letter-spacing: -0.01em;
}
body.platform-web.dark app-live-class .section-subtitle {
  color: var(--live-dark-muted);
}
body.platform-web.dark app-live-class .section-count {
  padding: 6px 10px;
  border: 1px solid rgba(168, 207, 143, 0.16);
  border-radius: 999px;
  background: rgba(168, 207, 143, 0.08);
  color: var(--live-dark-accent);
}
body.platform-web.dark app-live-class .my-classes-scroll {
  scrollbar-color: rgba(168, 207, 143, 0.3) transparent;
  scrollbar-width: thin;
}
body.platform-web.dark app-live-class app-live-class-card .class-card {
  --background: var(--live-dark-surface-raised);
  border-color: var(--live-dark-border);
  background:
    linear-gradient(
      145deg,
      rgba(255, 255, 255, 0.03),
      transparent 52%),
    var(--live-dark-surface-raised);
  box-shadow: 0 14px 34px rgba(0, 0, 0, 0.24), inset 0 1px 0 rgba(255, 255, 255, 0.03);
  transition:
    border-color 180ms ease,
    box-shadow 180ms ease,
    transform 180ms ease;
}
body.platform-web.dark app-live-class app-live-class-card .class-card:hover {
  border-color: var(--live-dark-border-strong);
  box-shadow: 0 22px 46px rgba(0, 0, 0, 0.34), 0 0 0 2px rgba(168, 207, 143, 0.04);
  transform: translateY(-3px);
}
body.platform-web.dark app-live-class app-live-class-card .class-card ion-card-title,
body.platform-web.dark app-live-class app-live-class-card .class-card .detail-item span {
  color: var(--live-dark-text);
}
body.platform-web.dark app-live-class app-live-class-card .class-card ion-card-subtitle,
body.platform-web.dark app-live-class app-live-class-card .class-card .class-description,
body.platform-web.dark app-live-class app-live-class-card .class-card .bundle-belonging span {
  color: var(--live-dark-muted);
}
body.platform-web.dark app-live-class app-live-class-card .class-card .detail-item ion-icon {
  color: var(--live-dark-subtle);
}
body.platform-web.dark app-live-class app-live-class-card .class-card .bundle-belonging span strong {
  color: var(--live-dark-accent);
}
body.platform-web.dark app-live-class app-live-class-card .class-card ion-badge {
  --background: rgb(168 207 143 / 10%) !important;
  --color: var(--live-dark-accent) !important;
  border: 1px solid rgba(168, 207, 143, 0.14) !important;
}
body.platform-web.dark app-live-class app-live-class-card .class-card .card-action-btn::part(native) {
  border-color: rgba(168, 207, 143, 0.48) !important;
  background: rgba(168, 207, 143, 0.07) !important;
  color: var(--live-dark-accent) !important;
}
body.platform-web.dark app-live-class app-live-class-card .class-card .card-action-btn:hover::part(native) {
  border-color: var(--live-dark-accent) !important;
  background: rgba(168, 207, 143, 0.14) !important;
}
body.platform-web.dark app-live-class app-live-class-card .class-card .card-action-btn.button-disabled::part(native) {
  border-color: var(--live-dark-border) !important;
  background: #202923 !important;
  color: #717d75 !important;
  opacity: 1;
}
body.platform-web.dark app-live-class app-live-class-card .class-card .class-status-text {
  color: var(--live-dark-accent);
}
body.platform-web.dark app-live-class app-bundle-card .bundle-card {
  --background: var(--live-dark-surface-raised);
  border: 1px solid var(--live-dark-border);
  background:
    linear-gradient(
      145deg,
      rgba(255, 255, 255, 0.03),
      transparent 52%),
    var(--live-dark-surface-raised);
  box-shadow: 0 14px 34px rgba(0, 0, 0, 0.24), inset 0 1px 0 rgba(255, 255, 255, 0.03);
  transition:
    border-color 180ms ease,
    box-shadow 180ms ease,
    transform 180ms ease;
}
body.platform-web.dark app-live-class app-bundle-card .bundle-card:hover {
  border-color: var(--live-dark-border-strong);
  box-shadow: 0 22px 46px rgba(0, 0, 0, 0.34);
  transform: translateY(-3px);
}
body.platform-web.dark app-live-class app-bundle-card .bundle-card ion-card-title,
body.platform-web.dark app-live-class app-bundle-card .bundle-card .price-tag {
  color: var(--live-dark-text);
}
body.platform-web.dark app-live-class app-bundle-card .bundle-card .bundle-info {
  color: var(--live-dark-muted);
}
body.platform-web.dark app-live-class app-bundle-card .bundle-card .price-tag.free,
body.platform-web.dark app-live-class app-bundle-card .bundle-card .price-tag.subscription {
  color: var(--live-dark-accent);
}
body.platform-web.dark app-live-class app-bundle-card .bundle-card .card-action-btn::part(native) {
  border-color: rgba(168, 207, 143, 0.48) !important;
  background: rgba(168, 207, 143, 0.07) !important;
  color: var(--live-dark-accent) !important;
}
body.platform-web.dark app-live-class app-bundle-card .bundle-card .card-action-btn:hover::part(native) {
  border-color: var(--live-dark-accent) !important;
  background: rgba(168, 207, 143, 0.14) !important;
}
body.platform-web.dark app-live-class app-reminder-card .reminder-card {
  --background: rgb(220 174 83 / 8%);
  border: 1px solid rgba(220, 174, 83, 0.2);
  background: rgba(220, 174, 83, 0.08);
  box-shadow: 0 16px 38px rgba(0, 0, 0, 0.22);
}
body.platform-web.dark app-live-class app-reminder-card .reminder-card .reminder-icon {
  background: rgba(220, 174, 83, 0.12);
}
body.platform-web.dark app-live-class app-reminder-card .reminder-card .reminder-content h4 {
  color: #f2e3bd;
}
body.platform-web.dark app-live-class app-reminder-card .reminder-card .reminder-content p {
  color: var(--live-dark-muted);
}
body.platform-web.dark app-live-class .empty-state,
body.platform-web.dark app-live-class .loading-state,
body.platform-web.dark app-live-class .error-state {
  border: 1px dashed var(--live-dark-border);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.02);
}
body.platform-web.dark app-live-class .empty-state p,
body.platform-web.dark app-live-class .loading-state p {
  color: var(--live-dark-muted);
}
body.platform-web.dark app-live-class .error-state p {
  color: var(--live-dark-danger);
}
@media (width < 768px) {
  body.platform-web.dark app-live-class .section-header-row {
    padding-bottom: 14px;
  }
}
body.platform-web.dark .search-product-header {
  background:
    radial-gradient(
      circle at 84% 6%,
      rgba(168, 207, 143, 0.07),
      transparent 34rem),
    linear-gradient(
      180deg,
      #0b120e 0%,
      #080d0a 52%,
      #060a07 100%) !important;
  border-bottom: 1px solid rgba(205, 226, 210, 0.09);
  box-shadow: inset 0 -1px 0 rgba(205, 226, 210, 0.04) !important;
}
body.platform-web.dark .search-product-header,
body.platform-web.dark .search-product-header ion-header,
body.platform-web.dark .search-product-header app-header-search {
  --background: transparent !important;
  background: transparent !important;
}
body.platform-web.dark .search-product-header .search-product-toolbar {
  padding-block: 10px;
}
body.platform-web.dark .search-product-header .search-product-back-btn {
  border-color: rgba(205, 226, 210, 0.13);
  background: #18211b;
  color: #f2f6f3;
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.24), inset 0 1px 0 rgba(255, 255, 255, 0.04);
}
body.platform-web.dark .search-product-header .search-product-back-btn:hover {
  border-color: rgba(168, 207, 143, 0.44);
  background: #202b23;
  color: #acd391;
  box-shadow: 0 14px 30px rgba(0, 0, 0, 0.3);
}
body.platform-web.dark .search-product-header app-header-search {
  padding-block: 0;
}
body.platform-web.dark .search-product-header .search-container {
  min-height: 58px;
  gap: 0;
  padding: 5px 6px 5px 10px !important;
  border: 1px solid rgba(168, 207, 143, 0.14);
  border-radius: 18px;
  background:
    radial-gradient(
      circle at 12% 0%,
      rgba(168, 207, 143, 0.07),
      transparent 34rem),
    linear-gradient(
      180deg,
      #152019 0%,
      #101812 100%) !important;
  box-shadow: 0 10px 26px rgba(0, 0, 0, 0.24), inset 0 1px 0 rgba(205, 226, 210, 0.05);
  transition:
    border-color 0.2s ease,
    box-shadow 0.2s ease,
    transform 0.2s ease;
}
body.platform-web.dark .search-product-header .search-container:hover {
  border-color: rgba(168, 207, 143, 0.26);
  background:
    radial-gradient(
      circle at 12% 0%,
      rgba(168, 207, 143, 0.1),
      transparent 34rem),
    linear-gradient(
      180deg,
      #1a281e 0%,
      #131d16 100%) !important;
  box-shadow: 0 14px 32px rgba(0, 0, 0, 0.25), inset 0 1px 0 rgba(205, 226, 210, 0.06);
}
body.platform-web.dark .search-product-header .search-container:focus-within {
  border-color: #86ad6e;
  box-shadow: 0 0 0 4px rgba(134, 173, 110, 0.12), 0 18px 42px rgba(0, 0, 0, 0.34);
}
body.platform-web.dark .search-product-header ion-searchbar {
  --background: transparent;
  --box-shadow: none;
  --color: #f2f6f3;
  --icon-color: #acd391;
  --placeholder-color: #9aa69e;
  --placeholder-opacity: 1;
  min-height: 46px;
  height: 46px;
  border: 0 !important;
  border-radius: 14px;
  box-shadow: none !important;
}
body.platform-web.dark .search-product-header .filter-content {
  display: flex;
  align-items: center;
  flex: 0 0 auto;
  padding-left: 8px;
  border-left: 1px solid rgba(205, 226, 210, 0.09);
}
body.platform-web.dark .search-product-header .filter-btn {
  --background: #263028;
  --background-hover: #303d32;
  --background-activated: #354438;
  --border-color: rgb(168 207 143 / 15%);
  --border-style: solid;
  --border-width: 1px;
  --border-radius: 12px;
  --color: #b8d7a5;
  --box-shadow: none;
  width: auto;
  min-width: 94px;
  height: 42px;
}
body.platform-web.dark .search-product-header .filter-btn ion-icon {
  color: #acd391;
}
body.platform-web.dark .search-product-content {
  --padding-top: 0;
  --background:
    radial-gradient(
      circle at 12% 0%,
      rgb(168 207 143 / 6%),
      transparent 32rem),
    linear-gradient(
      180deg,
      #0d130f 0%,
      #090e0b 52%,
      #080c09 100%);
  color: #f2f6f3;
}
body.platform-web.dark .search-product-content::part(scroll) {
  background:
    radial-gradient(
      circle at 12% 0%,
      rgba(168, 207, 143, 0.06),
      transparent 32rem),
    linear-gradient(
      180deg,
      #0d130f 0%,
      #090e0b 52%,
      #080c09 100%);
}
body.platform-web.dark .search-product-content .search-product-body {
  width: min(100%, 1248px);
  margin-inline: auto;
  padding: 12px 24px 36px;
}
body.platform-web.dark .search-product-content .search-catalog-hero {
  min-height: 144px;
  border-color: rgba(205, 226, 210, 0.11);
  background:
    linear-gradient(
      180deg,
      rgba(255, 255, 255, 0.025),
      transparent 38%),
    #0f1612;
  box-shadow: 0 18px 46px rgba(0, 0, 0, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.03);
}
body.platform-web.dark .search-product-content .search-catalog-hero::before {
  background:
    linear-gradient(
      90deg,
      #a8cf8f,
      rgba(168, 207, 143, 0));
}
body.platform-web.dark .search-product-content .search-catalog-hero::after {
  position: absolute;
  top: -72px;
  right: -44px;
  width: 240px;
  height: 240px;
  border: 1px solid rgba(168, 207, 143, 0.09);
  border-radius: 50%;
  content: "";
  box-shadow: 0 0 0 34px rgba(168, 207, 143, 0.03), 0 0 0 68px rgba(168, 207, 143, 0.015);
  pointer-events: none;
}
body.platform-web.dark .search-product-content .search-catalog-eyebrow,
body.platform-web.dark .search-product-content .search-catalog-section-eyebrow {
  color: #acd391;
}
body.platform-web.dark .search-product-content .search-catalog-hero-copy h1 {
  color: #f2f6f3;
  text-shadow: 0 2px 18px rgba(0, 0, 0, 0.18);
}
body.platform-web.dark .search-product-content .search-catalog-hero-copy p {
  color: #a3afa7;
}
body.platform-web.dark .search-product-content .search-catalog-hero-feature {
  border-color: rgba(205, 226, 210, 0.13);
  background: rgba(12, 18, 14, 0.68);
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.04);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
}
body.platform-web.dark .search-product-content .search-catalog-hero-feature strong {
  color: #f2f6f3;
}
body.platform-web.dark .search-product-content .search-catalog-hero-feature small {
  color: #9da9a1;
}
body.platform-web.dark .search-product-content .search-catalog-hero-icon {
  border: 1px solid rgba(168, 207, 143, 0.17);
  background: rgba(168, 207, 143, 0.11);
  color: #acd391;
}
body.platform-web.dark .search-product-content .search-results-section,
body.platform-web.dark .search-product-content .products-section {
  padding: 24px;
  border: 1px solid rgba(205, 226, 210, 0.11);
  border-radius: 22px;
  background:
    linear-gradient(
      180deg,
      rgba(255, 255, 255, 0.025),
      transparent 38%),
    #0f1612;
  box-shadow: 0 18px 46px rgba(0, 0, 0, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.03);
}
body.platform-web.dark .search-product-content .search-results-section::before,
body.platform-web.dark .search-product-content .products-section::before {
  background:
    linear-gradient(
      90deg,
      #a8cf8f,
      rgba(168, 207, 143, 0));
}
body.platform-web.dark .search-product-content .search-results-section .section-title {
  color: #f2f6f3;
  letter-spacing: -0.015em;
}
body.platform-web.dark .search-product-content .search-catalog-section-heading {
  border-bottom-color: rgba(205, 226, 210, 0.1);
}
body.platform-web.dark .search-product-content .search-catalog-section-heading .section-title,
body.platform-web.dark .search-product-content .search-catalog-section-heading h2 {
  padding-bottom: 0;
  border: 0;
  color: #f2f6f3;
}
body.platform-web.dark .search-product-content .search-catalog-count {
  border: 1px solid rgba(168, 207, 143, 0.15);
  background: rgba(168, 207, 143, 0.08);
  color: #acd391;
}
body.platform-web.dark .search-product-content .products-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 16px !important;
}
body.platform-web.dark .search-product-content app-product-card .product-card,
body.platform-web.dark .search-product-content app-product-card-skeleton .product-card-skeleton {
  border-color: rgba(205, 226, 210, 0.12);
  background:
    linear-gradient(
      145deg,
      rgba(255, 255, 255, 0.03),
      transparent 54%),
    #18211b;
  box-shadow: 0 14px 34px rgba(0, 0, 0, 0.25), inset 0 1px 0 rgba(255, 255, 255, 0.03);
}
body.platform-web.dark .search-product-content app-product-card .product-card {
  display: flex;
  width: 100%;
  min-width: 0;
  max-width: none;
  min-height: 312px;
  height: 100%;
  aspect-ratio: auto;
  flex-direction: column;
  padding: 12px;
  border-radius: 18px;
  overflow: hidden;
}
body.platform-web.dark .search-product-content app-product-card .product-card:hover {
  border-color: rgba(168, 207, 143, 0.4);
  box-shadow: 0 24px 54px rgba(0, 0, 0, 0.38), 0 0 0 2px rgba(168, 207, 143, 0.05);
  transform: translateY(-5px);
}
body.platform-web.dark .search-product-content app-product-card .product-card-image-container,
body.platform-web.dark .search-product-content app-product-card .product-card-image,
body.platform-web.dark .search-product-content app-product-card .product-card-image .image-error,
body.platform-web.dark .search-product-content app-product-card-skeleton .skeleton-image {
  border: 1px solid rgba(205, 226, 210, 0.08);
  background:
    radial-gradient(
      circle at 50% 38%,
      rgba(168, 207, 143, 0.07),
      transparent 58%),
    #202b23;
}
body.platform-web.dark .search-product-content app-product-card .product-card-image-container {
  position: relative;
  top: auto;
  left: auto;
  flex: 0 0 auto;
  width: 100%;
  height: 174px;
  min-height: 174px;
  max-height: 174px;
  aspect-ratio: auto;
  overflow: visible;
  border-radius: 14px;
}
body.platform-web.dark .search-product-content app-product-card .product-card-image {
  display: block;
  width: 100%;
  height: 100%;
  overflow: hidden;
  border: 0;
  border-radius: 13px;
}
body.platform-web.dark .search-product-content app-product-card .product-card-image ion-img::part(image) {
  object-fit: contain;
  object-position: center;
}
body.platform-web.dark .search-product-content app-product-card .product-card-cart-control {
  right: 10px;
  bottom: 10px;
  width: 38px;
  min-width: 38px;
  height: 38px;
  border: 1px solid rgba(255, 255, 255, 0.16);
  box-shadow: 0 9px 20px rgba(242, 122, 141, 0.28);
}
body.platform-web.dark .search-product-content app-product-card .product-card-info {
  position: static;
  width: 100%;
  min-height: 0;
  margin-top: auto;
  padding-top: 12px;
  justify-content: flex-end;
}
body.platform-web.dark .search-product-content app-product-card .product-card-name {
  display: -webkit-box;
  min-height: 0;
  overflow: hidden;
  color: #f2f6f3;
  font-size: 15px;
  font-weight: 750;
  line-height: 1.25;
  white-space: normal;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
body.platform-web.dark .search-product-content app-product-card .product-card-rating {
  position: static;
  width: 100%;
  height: auto;
  min-height: 16px;
  gap: 3px;
  margin-top: 4px;
  padding-top: 0;
}
body.platform-web.dark .search-product-content app-product-card .product-card-rating ion-icon {
  flex: 0 0 12px;
  width: 12px;
  height: 12px;
  font-size: 12px;
}
body.platform-web.dark .search-product-content app-product-card .product-card-review-count,
body.platform-web.dark .search-product-content app-product-card .product-card-original-price {
  color: #9da9a1;
}
body.platform-web.dark .search-product-content app-product-card .product-card-review-count {
  margin-left: 4px;
  font-size: 12px;
}
body.platform-web.dark .search-product-content app-product-card .product-card-rating ion-icon:not(.filled) {
  color: #465149;
}
body.platform-web.dark .search-product-content app-product-card .product-card-current-price {
  color: #f27a8d;
  font-size: 15px;
  font-weight: 800;
}
body.platform-web.dark .search-product-content app-product-card .product-card-pricing {
  position: static;
  width: 100%;
  height: auto;
  margin-top: 8px;
  min-height: 34px;
  padding-top: 11px;
  border-top: 1px solid rgba(205, 226, 210, 0.09);
  overflow: visible;
}
body.platform-web.dark .search-product-content app-product-card .product-card-pricing-values {
  overflow: visible;
}
body.platform-web.dark .search-product-content app-product-card .product-card-quickview {
  border-color: rgba(205, 226, 210, 0.16);
  background: rgba(18, 25, 20, 0.94);
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.34);
  color: #f2f6f3;
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
}
body.platform-web.dark .search-product-content app-product-card .product-card-quickview:hover {
  border-color: #acd391;
  color: #acd391;
}
body.platform-web.dark .search-product-content .empty-state,
body.platform-web.dark .search-product-content .no-results {
  border-color: rgba(205, 226, 210, 0.12);
  background:
    radial-gradient(
      circle at 50% 0%,
      rgba(168, 207, 143, 0.08),
      transparent 60%),
    #172019;
  box-shadow: 0 20px 46px rgba(0, 0, 0, 0.26);
  color: #9da9a1;
}
body.platform-web.dark .search-product-content .empty-state .no-results-icon,
body.platform-web.dark .search-product-content .empty-state .empty-icon,
body.platform-web.dark .search-product-content .no-results .no-results-icon,
body.platform-web.dark .search-product-content .no-results .empty-icon {
  color: #acd391;
}
body.platform-web.dark .search-product-content .empty-state .no-results-text,
body.platform-web.dark .search-product-content .empty-state .empty-text,
body.platform-web.dark .search-product-content .no-results .no-results-text,
body.platform-web.dark .search-product-content .no-results .empty-text {
  color: #f2f6f3;
}
body.platform-web.dark .search-product-content ion-infinite-scroll-content {
  color: #9da9a1;
  --color: #acd391;
}
@media (width < 768px) {
  body.platform-web.dark .search-product-content .search-product-body {
    padding: 10px 16px 32px;
  }
  body.platform-web.dark .search-product-content .search-results-section,
  body.platform-web.dark .search-product-content .products-section {
    padding: 16px;
    border-radius: 18px;
  }
}
@media (width >= 768px) and (width < 1100px) {
  body.platform-web.dark .search-product-content .products-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
  body.platform-web.dark .search-product-content app-product-card .product-card {
    min-height: 292px;
  }
  body.platform-web.dark .search-product-content app-product-card .product-card-image-container {
    height: 154px;
    min-height: 154px;
    max-height: 154px;
  }
}
@media (width < 768px) {
  body.platform-web.dark .search-product-content .products-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  body.platform-web.dark .search-product-content app-product-card .product-card {
    min-height: 262px;
  }
  body.platform-web.dark .search-product-content app-product-card .product-card-image-container {
    height: 124px;
    min-height: 124px;
    max-height: 124px;
  }
}
ion-modal.web-dialog-modal {
  --width: min(440px, 92vw) !important;
  --max-width: 440px !important;
  --height: max-content !important;
  --min-height: 280px !important;
  --max-height: 85vh !important;
  --border-radius: 20px !important;
  --box-shadow: 0 28px 70px rgb(0 0 0 / 45%), 0 0 0 1px rgb(255 255 255 / 8%) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}
ion-modal.web-dialog-modal::part(backdrop) {
  background: rgba(5, 10, 6, 0.75) !important;
  -webkit-backdrop-filter: blur(14px) saturate(120%) !important;
  backdrop-filter: blur(14px) saturate(120%) !important;
  opacity: 1 !important;
}
ion-modal.web-dialog-modal::part(handle) {
  display: none !important;
  opacity: 0 !important;
  height: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}
ion-modal.web-dialog-modal::part(content) {
  position: relative !important;
  inset: auto !important;
  border-radius: 20px !important;
  border: 1px solid #dbe3d7 !important;
  background: #fff !important;
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.22) !important;
  overflow: hidden !important;
  max-width: 440px !important;
  width: min(440px, 92vw) !important;
  height: auto !important;
  min-height: 280px !important;
  margin: auto !important;
}
ion-modal.web-dialog-modal ion-content.info-modal-content {
  --background: transparent !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 280px !important;
}
ion-modal.web-dialog-modal .info-modal {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  min-height: 280px !important;
  padding: 32px 26px 28px !important;
  background: transparent !important;
  box-sizing: border-box !important;
}
ion-modal.web-dialog-modal .info-modal .info-modal-icon-wrapper {
  width: 58px !important;
  height: 58px !important;
  margin-bottom: 16px !important;
  border-radius: 50% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
}
ion-modal.web-dialog-modal .info-modal .info-modal-icon-wrapper ion-icon {
  font-size: 32px !important;
}
ion-modal.web-dialog-modal .info-modal .info-modal-icon-wrapper.variant-info,
ion-modal.web-dialog-modal .info-modal .info-modal-icon-wrapper.variant-success {
  background: #edf5e8 !important;
  border: 1px solid #d5e4cd !important;
}
ion-modal.web-dialog-modal .info-modal .info-modal-icon-wrapper.variant-info ion-icon,
ion-modal.web-dialog-modal .info-modal .info-modal-icon-wrapper.variant-success ion-icon {
  color: #588243 !important;
}
ion-modal.web-dialog-modal .info-modal .info-modal-icon-wrapper.variant-warning {
  background: #fdf6e7 !important;
  border: 1px solid #f7e3ba !important;
}
ion-modal.web-dialog-modal .info-modal .info-modal-icon-wrapper.variant-warning ion-icon {
  color: #d97706 !important;
}
ion-modal.web-dialog-modal .info-modal .info-modal-icon-wrapper.variant-error {
  background: #fdf2f2 !important;
  border: 1px solid #f8d7d7 !important;
}
ion-modal.web-dialog-modal .info-modal .info-modal-icon-wrapper.variant-error ion-icon {
  color: #dc2626 !important;
}
ion-modal.web-dialog-modal .info-modal .info-modal-title {
  font-family: var(--font-family-semibold) !important;
  font-size: 21px !important;
  font-weight: 750 !important;
  color: #1f271f !important;
  margin: 0 0 10px !important;
  line-height: 1.25 !important;
  letter-spacing: -0.01em !important;
}
ion-modal.web-dialog-modal .info-modal .info-modal-message {
  font-family: var(--font-family-regular) !important;
  font-size: 14px !important;
  line-height: 1.55 !important;
  color: #546253 !important;
  margin: 0 0 22px !important;
  max-width: 380px !important;
}
ion-modal.web-dialog-modal .info-modal .info-modal-actions {
  display: flex !important;
  gap: 12px !important;
  width: 100% !important;
  justify-content: center !important;
}
ion-modal.web-dialog-modal .info-modal .info-modal-actions ion-button {
  flex: 1 1 0% !important;
  height: 44px !important;
  min-height: 44px !important;
  font-family: var(--font-family-semibold) !important;
  font-size: 14px !important;
  text-transform: none !important;
  border-radius: 12px !important;
}
ion-modal.web-dialog-modal .info-modal .info-modal-actions ion-button.info-modal-cancel-btn {
  --background: transparent !important;
  --color: #455244 !important;
  --border-color: #d2ded0 !important;
  --border-width: 1px !important;
  --border-radius: 12px !important;
  --box-shadow: none !important;
  font-weight: 600 !important;
}
ion-modal.web-dialog-modal .info-modal .info-modal-actions ion-button.info-modal-cancel-btn:hover {
  --background: #f2f7f0 !important;
}
ion-modal.web-dialog-modal .info-modal .info-modal-actions ion-button.info-modal-confirm-btn {
  --background: #79a25f !important;
  --background-hover: #6d9453 !important;
  --color: #fff !important;
  --border-radius: 12px !important;
  --box-shadow: 0 8px 20px rgb(121 162 95 / 28%) !important;
  font-weight: 700 !important;
}
body.platform-web.dark ion-modal.web-dialog-modal::part(content),
body.dark ion-modal.web-dialog-modal::part(content) {
  background: #172019 !important;
  border-color: rgba(205, 226, 210, 0.14) !important;
  box-shadow: 0 32px 80px rgba(0, 0, 0, 0.6), 0 0 0 1px rgba(255, 255, 255, 0.04) !important;
}
body.platform-web.dark ion-modal.web-dialog-modal .info-modal .info-modal-icon-wrapper.variant-info,
body.platform-web.dark ion-modal.web-dialog-modal .info-modal .info-modal-icon-wrapper.variant-success,
body.dark ion-modal.web-dialog-modal .info-modal .info-modal-icon-wrapper.variant-info,
body.dark ion-modal.web-dialog-modal .info-modal .info-modal-icon-wrapper.variant-success {
  background: rgba(121, 162, 95, 0.16) !important;
  border-color: rgba(121, 162, 95, 0.3) !important;
}
body.platform-web.dark ion-modal.web-dialog-modal .info-modal .info-modal-icon-wrapper.variant-info ion-icon,
body.platform-web.dark ion-modal.web-dialog-modal .info-modal .info-modal-icon-wrapper.variant-success ion-icon,
body.dark ion-modal.web-dialog-modal .info-modal .info-modal-icon-wrapper.variant-info ion-icon,
body.dark ion-modal.web-dialog-modal .info-modal .info-modal-icon-wrapper.variant-success ion-icon {
  color: #9ac77e !important;
}
body.platform-web.dark ion-modal.web-dialog-modal .info-modal .info-modal-icon-wrapper.variant-warning,
body.dark ion-modal.web-dialog-modal .info-modal .info-modal-icon-wrapper.variant-warning {
  background: rgba(217, 119, 6, 0.16) !important;
  border-color: rgba(217, 119, 6, 0.3) !important;
}
body.platform-web.dark ion-modal.web-dialog-modal .info-modal .info-modal-icon-wrapper.variant-warning ion-icon,
body.dark ion-modal.web-dialog-modal .info-modal .info-modal-icon-wrapper.variant-warning ion-icon {
  color: #fbbf24 !important;
}
body.platform-web.dark ion-modal.web-dialog-modal .info-modal .info-modal-icon-wrapper.variant-error,
body.dark ion-modal.web-dialog-modal .info-modal .info-modal-icon-wrapper.variant-error {
  background: rgba(220, 38, 38, 0.16) !important;
  border-color: rgba(220, 38, 38, 0.3) !important;
}
body.platform-web.dark ion-modal.web-dialog-modal .info-modal .info-modal-icon-wrapper.variant-error ion-icon,
body.dark ion-modal.web-dialog-modal .info-modal .info-modal-icon-wrapper.variant-error ion-icon {
  color: #f87171 !important;
}
body.platform-web.dark ion-modal.web-dialog-modal .info-modal .info-modal-title,
body.dark ion-modal.web-dialog-modal .info-modal .info-modal-title {
  color: #f2f6f3 !important;
}
body.platform-web.dark ion-modal.web-dialog-modal .info-modal .info-modal-message,
body.dark ion-modal.web-dialog-modal .info-modal .info-modal-message {
  color: #b3c2b1 !important;
}
body.platform-web.dark ion-modal.web-dialog-modal .info-modal .info-modal-actions ion-button.info-modal-cancel-btn,
body.dark ion-modal.web-dialog-modal .info-modal .info-modal-actions ion-button.info-modal-cancel-btn {
  --color: #d5e0d3 !important;
  --border-color: rgb(205 226 210 / 22%) !important;
}
body.platform-web.dark ion-modal.web-dialog-modal .info-modal .info-modal-actions ion-button.info-modal-cancel-btn:hover,
body.dark ion-modal.web-dialog-modal .info-modal .info-modal-actions ion-button.info-modal-cancel-btn:hover {
  --background: rgb(255 255 255 / 6%) !important;
}
body.platform-web.dark ion-modal.web-dialog-modal .info-modal .info-modal-actions ion-button.info-modal-confirm-btn,
body.dark ion-modal.web-dialog-modal .info-modal .info-modal-actions ion-button.info-modal-confirm-btn {
  --background: #9ac77e !important;
  --background-hover: #8ebc72 !important;
  --color: #14200f !important;
  --box-shadow: 0 10px 24px rgb(154 199 126 / 30%) !important;
}
@media (width <= 380px) {
  ion-modal.web-dialog-modal {
    --width: calc(100vw - 20px) !important;
    --max-width: calc(100vw - 20px) !important;
    --min-height: 250px !important;
  }
  ion-modal.web-dialog-modal::part(content) {
    width: calc(100vw - 20px) !important;
    max-width: calc(100vw - 20px) !important;
    min-height: 250px !important;
    border-radius: 16px !important;
  }
  ion-modal.web-dialog-modal ion-content.info-modal-content {
    min-height: 250px !important;
  }
  ion-modal.web-dialog-modal .info-modal {
    min-height: 250px !important;
    padding: 24px 16px 20px !important;
  }
  ion-modal.web-dialog-modal .info-modal .info-modal-icon-wrapper {
    width: 50px !important;
    height: 50px !important;
    margin-bottom: 12px !important;
  }
  ion-modal.web-dialog-modal .info-modal .info-modal-icon-wrapper ion-icon {
    font-size: 28px !important;
  }
  ion-modal.web-dialog-modal .info-modal .info-modal-title {
    font-size: 18px !important;
    margin-bottom: 8px !important;
  }
  ion-modal.web-dialog-modal .info-modal .info-modal-message {
    font-size: 13px !important;
    line-height: 1.45 !important;
    margin-bottom: 18px !important;
  }
  ion-modal.web-dialog-modal .info-modal .info-modal-actions {
    gap: 8px !important;
  }
  ion-modal.web-dialog-modal .info-modal .info-modal-actions ion-button {
    height: 40px !important;
    min-height: 40px !important;
    font-size: 13px !important;
    border-radius: 10px !important;
  }
}
video.video-player,
video.course-video,
video.carousel-video-player,
video.greeting-media,
.video-player-container video {
  -webkit-touch-callout: none !important;
  -webkit-user-select: none !important;
  user-select: none !important;
  -webkit-tap-highlight-color: transparent !important;
}
video::-internal-media-controls-download-button {
  display: none !important;
}
video::-webkit-media-controls-enclosure {
  overflow: hidden !important;
}
body.platform-web.developer-tools-open video,
body.platform-web.developer-tools-open audio {
  pointer-events: none !important;
  filter: blur(24px) !important;
  opacity: 0.2 !important;
  transition: filter 0.3s ease, opacity 0.3s ease !important;
}
:root {
  --green-chip-bg: rgb(122 158 99 / 20%);
}
.filter-modal {
  --width: 100%;
  --height: auto;
  --max-height: 80vh;
  --background: var(--ion-color-light);
}
.filter-modal::part(content) {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  max-height: 85vh;
  border-radius: 20px 20px 0 0;
  padding-bottom: var(--ion-safe-area-bottom);
  overflow-y: auto;
}
.filter-modal::part(backdrop) {
  background: rgb(0, 0, 0);
  -webkit-backdrop-filter: blur(24px);
  backdrop-filter: blur(24px);
}
.filter-modal.report-modal-wrapper {
  --max-height: 95vh;
  --height: auto;
}
.filter-modal.report-modal-wrapper::part(content) {
  display: flex;
  flex-direction: column;
  height: auto;
  max-height: 95vh;
  overflow-y: auto;
}
@media (width >= 768px) {
  ion-modal.filter-modal {
    --width: min(560px, calc(100vw - 48px));
    --height: min(610px, calc(100vh - 80px));
    --max-height: min(610px, calc(100vh - 80px));
    --border-radius: 20px;
    --background: #fff;
    --box-shadow: 0 26px 72px rgb(24 38 27 / 24%);
    align-items: center;
    justify-content: center;
  }
  ion-modal.filter-modal::part(content) {
    position: static;
    inset: auto;
    display: flex;
    height: var(--height);
    max-height: var(--max-height);
    padding: 0;
    overflow: hidden;
    border: 1px solid #dce7d8;
    border-radius: 20px;
    background: #fff;
  }
  ion-modal.filter-modal::part(backdrop) {
    background: rgba(20, 32, 23, 0.48);
    -webkit-backdrop-filter: blur(7px);
    backdrop-filter: blur(7px);
  }
  ion-modal.filter-modal app-category-filter {
    display: block;
    width: 100%;
    height: 100%;
    background: #fff;
    color: #213027;
  }
  ion-modal.filter-modal app-category-filter .filter {
    height: 100%;
    min-height: 0;
    background: #fff;
  }
  ion-modal.filter-modal app-category-filter .filter-header {
    align-items: center;
    padding: 22px 24px 18px;
    border-color: #e3ebe0;
  }
  ion-modal.filter-modal app-category-filter .filter-eyebrow {
    margin-bottom: 3px;
    color: #62884f;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.08em;
  }
  ion-modal.filter-modal app-category-filter .filter-title {
    color: #1f2c22;
    font-size: 23px;
    letter-spacing: -0.02em;
  }
  ion-modal.filter-modal app-category-filter .close-btn {
    --background: #f1f6ef;
    --background-hover: #e6f0e2;
    --background-activated: #dcebd7;
    --color: #597451;
    width: 38px;
    min-width: 38px;
    height: 38px;
  }
  ion-modal.filter-modal app-category-filter .filter-section {
    flex: 1 1 auto;
    min-height: 0;
    padding: 20px 24px;
    overflow: hidden;
  }
  ion-modal.filter-modal app-category-filter .course-filter-section {
    overflow-y: auto;
  }
  ion-modal.filter-modal app-category-filter .course-filters {
    gap: 14px;
  }
  ion-modal.filter-modal app-category-filter .filter-group {
    gap: 12px;
    padding: 15px;
    border: 1px solid #e0eae0;
    border-radius: 14px;
    background: #f9fbf8;
  }
  ion-modal.filter-modal app-category-filter .filter-group-heading p {
    color: #758178;
  }
  ion-modal.filter-modal app-category-filter .filter-choice {
    min-height: 42px;
    border-color: #dce7d8;
    border-radius: 10px;
    background: #fff;
    color: #405044;
  }
  ion-modal.filter-modal app-category-filter .filter-choice:hover {
    border-color: #bcd2b4;
    background: #f5faf2;
  }
  ion-modal.filter-modal app-category-filter .filter-choice.selected {
    border-color: #72995f;
    background: #eef6e9;
    color: #426c34;
    box-shadow: 0 0 0 2px rgba(103, 148, 83, 0.12);
  }
  ion-modal.filter-modal app-category-filter .price-field {
    color: #667467;
  }
  ion-modal.filter-modal app-category-filter .price-field input {
    border-color: #dce7d8;
    background: #fff;
    color: #2d3c30;
  }
  ion-modal.filter-modal app-category-filter .price-field input:focus {
    border-color: #72995f;
    box-shadow: 0 0 0 3px rgba(103, 148, 83, 0.14);
  }
  ion-modal.filter-modal app-category-filter .price-separator {
    color: #829080;
  }
  ion-modal.filter-modal app-category-filter .section-title {
    color: #354538;
    font-size: 14px;
  }
  ion-modal.filter-modal app-category-filter .loading-container,
  ion-modal.filter-modal app-category-filter .category-list {
    flex: 1 1 auto;
    min-height: 0;
    max-height: none;
  }
  ion-modal.filter-modal app-category-filter .category-list {
    gap: 5px;
    padding: 7px;
    border-color: #dce7d8;
    border-radius: 14px;
    background: #f7faf6;
  }
  ion-modal.filter-modal app-category-filter .category-item {
    border-radius: 10px;
  }
  ion-modal.filter-modal app-category-filter .category-item:hover {
    border-color: #cfe0c9;
    background: #fff;
  }
  ion-modal.filter-modal app-category-filter .category-item.selected {
    border-color: #8eaf80;
    background: #edf6e8;
    box-shadow: 0 0 0 2px rgba(103, 148, 83, 0.12);
  }
  ion-modal.filter-modal app-category-filter .category-label {
    min-height: 45px;
    padding: 9px 11px;
  }
  ion-modal.filter-modal app-category-filter .category-checkbox {
    --border-color: #879687;
    --border-color-checked: #6f995a;
    --checkbox-background-checked: #6f995a;
  }
  ion-modal.filter-modal app-category-filter .category-text {
    color: #344238;
  }
  ion-modal.filter-modal app-category-filter .filter-actions {
    flex: 0 0 auto;
    padding: 16px 24px 20px;
    border-color: #e3ebe0;
    background: #fff;
  }
  ion-modal.filter-modal app-category-filter .filter-actions ion-button {
    min-width: 132px;
    height: 42px;
  }
  ion-modal.filter-modal app-category-filter .clear-btn {
    --background: #f0f5ee;
    --background-hover: #e6f0e2;
    --background-activated: #dcebd7;
    --color: #51654f;
  }
  ion-modal.filter-modal app-category-filter .apply-btn {
    --background: #6f995a;
    --background-hover: #60894e;
    --background-activated: #557b45;
    --color: #fff;
  }
  body.dark ion-modal.filter-modal,
  body.ion-palette-dark ion-modal.filter-modal {
    --background: #131c16;
    --box-shadow: 0 28px 80px rgb(0 0 0 / 52%);
  }
  body.dark ion-modal.filter-modal::part(content),
  body.ion-palette-dark ion-modal.filter-modal::part(content) {
    border-color: rgba(185, 212, 180, 0.16);
    background: #131c16;
  }
  body.dark ion-modal.filter-modal::part(backdrop),
  body.ion-palette-dark ion-modal.filter-modal::part(backdrop) {
    background: rgba(0, 0, 0, 0.64);
  }
  body.dark ion-modal.filter-modal app-category-filter,
  body.ion-palette-dark ion-modal.filter-modal app-category-filter {
    background: #131c16;
    color: #eef5ed;
  }
  body.dark ion-modal.filter-modal app-category-filter .filter,
  body.dark ion-modal.filter-modal app-category-filter .filter-header,
  body.dark ion-modal.filter-modal app-category-filter .filter-actions,
  body.ion-palette-dark ion-modal.filter-modal app-category-filter .filter,
  body.ion-palette-dark ion-modal.filter-modal app-category-filter .filter-header,
  body.ion-palette-dark ion-modal.filter-modal app-category-filter .filter-actions {
    background: #131c16;
    border-color: rgba(185, 212, 180, 0.14);
  }
  body.dark ion-modal.filter-modal app-category-filter .filter-title,
  body.dark ion-modal.filter-modal app-category-filter .section-title,
  body.dark ion-modal.filter-modal app-category-filter .category-text,
  body.ion-palette-dark ion-modal.filter-modal app-category-filter .filter-title,
  body.ion-palette-dark ion-modal.filter-modal app-category-filter .section-title,
  body.ion-palette-dark ion-modal.filter-modal app-category-filter .category-text {
    color: #edf4eb;
  }
  body.dark ion-modal.filter-modal app-category-filter .filter-eyebrow,
  body.ion-palette-dark ion-modal.filter-modal app-category-filter .filter-eyebrow {
    color: #a7cc90;
  }
  body.dark ion-modal.filter-modal app-category-filter .close-btn,
  body.ion-palette-dark ion-modal.filter-modal app-category-filter .close-btn {
    --background: #203021;
    --background-hover: #2b412c;
    --background-activated: #354f36;
    --color: #c8ddc2;
  }
  body.dark ion-modal.filter-modal app-category-filter .category-list,
  body.ion-palette-dark ion-modal.filter-modal app-category-filter .category-list {
    border-color: rgba(185, 212, 180, 0.14);
    background: #18241b;
  }
  body.dark ion-modal.filter-modal app-category-filter .filter-group,
  body.ion-palette-dark ion-modal.filter-modal app-category-filter .filter-group {
    border-color: rgba(185, 212, 180, 0.14);
    background: #18241b;
  }
  body.dark ion-modal.filter-modal app-category-filter .filter-group-heading p,
  body.ion-palette-dark ion-modal.filter-modal app-category-filter .filter-group-heading p {
    color: #9cae9b;
  }
  body.dark ion-modal.filter-modal app-category-filter .filter-choice,
  body.ion-palette-dark ion-modal.filter-modal app-category-filter .filter-choice {
    border-color: rgba(185, 212, 180, 0.17);
    background: #1d2a1f;
    color: #dce8d9;
  }
  body.dark ion-modal.filter-modal app-category-filter .filter-choice:hover,
  body.ion-palette-dark ion-modal.filter-modal app-category-filter .filter-choice:hover {
    border-color: rgba(164, 202, 145, 0.36);
    background: #243526;
  }
  body.dark ion-modal.filter-modal app-category-filter .filter-choice.selected,
  body.ion-palette-dark ion-modal.filter-modal app-category-filter .filter-choice.selected {
    border-color: #91bc7b;
    background: rgba(136, 180, 112, 0.18);
    color: #d9edd1;
    box-shadow: 0 0 0 2px rgba(147, 192, 121, 0.12);
  }
  body.dark ion-modal.filter-modal app-category-filter .price-field,
  body.ion-palette-dark ion-modal.filter-modal app-category-filter .price-field {
    color: #a9bba7;
  }
  body.dark ion-modal.filter-modal app-category-filter .price-field input,
  body.ion-palette-dark ion-modal.filter-modal app-category-filter .price-field input {
    border-color: rgba(185, 212, 180, 0.17);
    background: #1d2a1f;
    color: #edf4eb;
  }
  body.dark ion-modal.filter-modal app-category-filter .price-field input:focus,
  body.ion-palette-dark ion-modal.filter-modal app-category-filter .price-field input:focus {
    border-color: #91bc7b;
    box-shadow: 0 0 0 3px rgba(147, 192, 121, 0.16);
  }
  body.dark ion-modal.filter-modal app-category-filter .price-separator,
  body.ion-palette-dark ion-modal.filter-modal app-category-filter .price-separator {
    color: #92a590;
  }
  body.dark ion-modal.filter-modal app-category-filter .category-item:hover,
  body.ion-palette-dark ion-modal.filter-modal app-category-filter .category-item:hover {
    border-color: rgba(164, 202, 145, 0.28);
    background: #202e22;
  }
  body.dark ion-modal.filter-modal app-category-filter .category-item.selected,
  body.ion-palette-dark ion-modal.filter-modal app-category-filter .category-item.selected {
    border-color: #85ae70;
    background: rgba(127, 171, 104, 0.16);
    box-shadow: 0 0 0 2px rgba(147, 192, 121, 0.1);
  }
  body.dark ion-modal.filter-modal app-category-filter .category-checkbox,
  body.ion-palette-dark ion-modal.filter-modal app-category-filter .category-checkbox {
    --border-color: #92a98e;
    --border-color-checked: #9ac580;
    --checkbox-background-checked: #9ac580;
    --checkmark-color: #142016;
  }
  body.dark ion-modal.filter-modal app-category-filter .clear-btn,
  body.ion-palette-dark ion-modal.filter-modal app-category-filter .clear-btn {
    --background: #213023;
    --background-hover: #2b3e2c;
    --background-activated: #344b35;
    --color: #d9e9d5;
  }
  body.dark ion-modal.filter-modal app-category-filter .apply-btn,
  body.ion-palette-dark ion-modal.filter-modal app-category-filter .apply-btn {
    --background: #9ac580;
    --background-hover: #add198;
    --background-activated: #8eb976;
    --color: #132016;
  }
}
.mother-input-modal::part(content) {
  border-radius: var(--radius-2xl) var(--radius-2xl) 0 0;
}
.mother-input-modal::part(handle) {
  background: var(--ion-color-primary-contrast);
  opacity: 0.5;
  width: 40px;
  height: 4px;
  margin-top: var(--spacing-sm);
}
.pregnancy-details-dialog {
  --width: min(620px, calc(100vw - 48px));
  --height: min(610px, calc(100vh - 80px));
  --max-height: calc(100vh - 80px);
  --border-radius: var(--radius-md);
  --box-shadow: 0 28px 72px rgb(24 32 24 / 24%);
}
.pregnancy-details-dialog::part(content) {
  position: static;
  overflow: hidden;
  border: 1px solid var(--w-border, var(--ion-color-light-shade));
  border-radius: var(--radius-md);
  background: var(--w-card, var(--ion-background-color));
}
.pregnancy-details-dialog::part(backdrop) {
  background: rgba(28, 34, 28, 0.48);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
}
.pregnancy-details-dialog::part(handle) {
  display: none;
}
.child-details-dialog {
  --width: min(760px, calc(100vw - 64px));
  --height: min(700px, calc(100vh - 72px));
  --max-height: calc(100vh - 72px);
  --border-radius: 20px;
  --box-shadow: 0 32px 80px rgb(24 32 24 / 28%);
}
.child-details-dialog::part(content) {
  position: static;
  overflow: hidden;
  border: 1px solid var(--w-border, var(--ion-color-light-shade));
  border-radius: 20px;
  background: var(--w-card, var(--ion-background-color));
}
.child-details-dialog::part(backdrop) {
  background: rgba(28, 34, 28, 0.48);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
}
.child-details-dialog::part(handle) {
  display: none;
}
ion-modal.profile-select-dialog {
  --width: min(860px, calc(100vw - 64px));
  --height: min(560px, calc(100vh - 64px));
  --max-height: calc(100vh - 64px);
  --border-radius: 24px;
  --backdrop-opacity: 0.5;
  --box-shadow: 0 32px 90px rgb(24 32 24 / 28%);
}
ion-modal.profile-select-dialog::part(content) {
  position: static;
  overflow: hidden;
  border: 1px solid var(--w-border, var(--ion-color-light-shade));
  border-radius: 24px;
  background: var(--w-card, var(--ion-background-color));
}
ion-modal.profile-select-dialog::part(backdrop) {
  background: rgba(28, 34, 28, 0.48);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
}
ion-modal.profile-select-dialog::part(handle) {
  display: none;
}
ion-modal.community-guidelines-dialog {
  --width: min(620px, calc(100vw - 48px));
  --height: min(340px, calc(100vh - 48px));
  --max-height: min(680px, calc(100vh - 48px));
  --border-radius: 24px;
  --backdrop-opacity: 0.52;
  --box-shadow: 0 34px 90px rgb(24 32 24 / 30%);
}
ion-modal.community-guidelines-dialog::part(content) {
  position: static;
  overflow: auto;
  border: 1px solid var(--w-border, var(--ion-color-light-shade));
  border-radius: 24px;
  background: var(--w-card, var(--ion-background-color));
}
ion-modal.community-guidelines-dialog::part(backdrop) {
  background: rgba(28, 34, 28, 0.52);
  -webkit-backdrop-filter: blur(9px);
  backdrop-filter: blur(9px);
}
ion-modal.community-guidelines-dialog::part(handle) {
  display: none;
}
@media (width < 720px) {
  ion-modal.profile-select-dialog {
    --width: calc(100vw - 32px);
    --height: min(680px, calc(100vh - 32px));
    --max-height: calc(100vh - 32px);
    --border-radius: 20px;
  }
  ion-modal.profile-select-dialog::part(content) {
    border-radius: 20px;
  }
  ion-modal.community-guidelines-dialog {
    --width: calc(100vw - 28px);
    --height: min(480px, calc(100vh - 28px));
    --max-height: calc(100vh - 28px);
    --border-radius: 20px;
  }
  ion-modal.community-guidelines-dialog::part(content) {
    border-radius: 20px;
  }
}
.promotional-video-popup {
  --width: 100%;
  --height: 100%;
  --max-width: 100%;
  --max-height: 100%;
  --border-radius: 0;
  --box-shadow: none;
  --background: transparent;
}
.promotional-video-popup::part(content) {
  background: transparent;
  box-shadow: none;
}
.promotional-video-popup::part(backdrop) {
  background: transparent;
}
.greeting-modal {
  --width: min(92vw, 560px);
  --max-width: 560px;
  --height: auto;
  --max-height: calc(100vh - 48px);
  --border-radius: 22px;
  --background: #f7faf5;
  --box-shadow: 0 28px 80px rgb(24 38 20 / 26%);
}
.greeting-modal::part(content) {
  display: flex;
  flex-direction: column;
  border: 1px solid rgba(118, 151, 99, 0.2);
  border-radius: 22px;
  padding: 0;
  overflow: hidden;
}
.greeting-modal::part(backdrop) {
  background: rgba(12, 18, 13, 0.58);
  -webkit-backdrop-filter: blur(10px) saturate(0.8);
  backdrop-filter: blur(10px) saturate(0.8);
}
.greeting-modal ion-header {
  --background: transparent;
  --border-bottom: none;
  flex-shrink: 0;
}
@media (width < 576px) {
  .greeting-modal {
    --width: calc(100vw - 24px);
    --max-height: calc(100vh - 24px);
    --border-radius: 18px;
  }
  .greeting-modal::part(content) {
    border-radius: 18px;
  }
}
body.dark .greeting-modal,
body.ion-palette-dark .greeting-modal {
  --background: #101713;
  --box-shadow: 0 30px 90px rgb(0 0 0 / 44%);
}
body.dark .greeting-modal::part(content),
body.ion-palette-dark .greeting-modal::part(content) {
  border-color: rgba(205, 226, 210, 0.14);
}
ion-searchbar .searchbar-input-container {
  min-height: var(--input-height-sm) !important;
  height: var(--input-height-sm) !important;
}
ion-searchbar .searchbar-input {
  min-height: var(--input-height-sm) !important;
  height: var(--input-height-sm) !important;
  border-radius: var(--radius-full) !important;
}
.modal-small::part(content),
.modal-half::part(content),
.modal-full::part(content) {
  border-radius: var(--radius-2xl) var(--radius-2xl) 0 0;
}
.modal-small::part(handle),
.modal-half::part(handle),
.modal-full::part(handle) {
  background: var(--ion-color-medium);
  opacity: 0.4;
  width: 40px;
  height: 4px;
  margin-top: var(--spacing-sm);
}
ion-modal.premium-content-modal--web {
  --width: min(520px, calc(100vw - 40px));
  --height: 350px;
  --max-height: calc(100vh - 48px);
  --border-radius: var(--radius-2xl);
  --backdrop-opacity: 0.5;
  --box-shadow: 0 28px 80px rgb(16 24 40 / 22%);
}
ion-modal.premium-content-modal--web::part(content) {
  border-radius: var(--radius-2xl);
  overflow: hidden;
}
ion-modal.doctor-filter-modal {
  --width: min(460px, calc(100vw - 32px));
  --height: min(680px, calc(100vh - 32px));
  --max-height: min(720px, calc(100vh - 32px));
  --border-radius: 24px;
  --background: var(--filter-modal-bg);
  --box-shadow: 0 24px 70px rgb(0 0 0 / 24%);
  --filter-modal-bg: #fff;
  --filter-modal-surface: #f5f7f3;
  --filter-modal-selected-bg: #edf6e8;
  --filter-modal-border: rgb(48 73 55 / 14%);
  --filter-modal-text: #203024;
  --filter-modal-muted: #6c786e;
  --filter-modal-accent: #719c5d;
  --filter-modal-accent-strong: #5c884a;
  --filter-modal-button-text: #fff;
  --filter-modal-icon-bg: #e4efdf;
}
ion-modal.doctor-filter-modal::part(content) {
  background: var(--filter-modal-bg);
  border-radius: 24px;
  overflow: hidden;
}
body.dark ion-modal.doctor-filter-modal,
body.ion-palette-dark ion-modal.doctor-filter-modal {
  --filter-modal-bg: #17211a;
  --filter-modal-surface: #1e2b21;
  --filter-modal-selected-bg: rgb(172 211 145 / 14%);
  --filter-modal-border: rgb(194 220 199 / 16%);
  --filter-modal-text: #f2f7f1;
  --filter-modal-muted: #a8b7aa;
  --filter-modal-accent: #acd391;
  --filter-modal-accent-strong: #91bd78;
  --filter-modal-button-text: #122016;
  --filter-modal-icon-bg: rgb(172 211 145 / 14%);
}
ion-modal.locked-lesson-dialog--web {
  --width: min(520px, calc(100vw - 40px));
  --height: 320px;
  --max-height: calc(100vh - 48px);
  --border-radius: 22px;
  --backdrop-opacity: 0.52;
  --box-shadow: 0 30px 84px rgb(20 31 21 / 28%);
}
ion-modal.locked-lesson-dialog--web::part(content) {
  position: static;
  overflow: hidden;
  border: 1px solid var(--w-border, var(--ion-color-light-shade));
  border-radius: 22px;
  background: var(--w-card, var(--ion-background-color));
}
ion-modal.locked-lesson-dialog--web::part(backdrop) {
  background: rgba(18, 27, 19, 0.54);
  -webkit-backdrop-filter: blur(8px) saturate(0.85);
  backdrop-filter: blur(8px) saturate(0.85);
}
ion-modal.locked-lesson-dialog--web::part(handle) {
  display: none;
}
body.platform-web ion-modal.enrollment-status-dialog {
  --width: min(460px, calc(100vw - 40px));
  --height: min(360px, calc(100vh - 40px));
  --max-height: calc(100vh - 40px);
  --border-radius: 24px;
  --backdrop-opacity: 0.5;
  --box-shadow: 0 28px 80px rgb(20 31 21 / 24%);
}
body.platform-web ion-modal.enrollment-status-dialog::part(content) {
  position: static;
  overflow: hidden;
  border: 1px solid var(--w-border, var(--ion-color-light-shade));
  border-radius: 24px;
  background: var(--w-card, var(--ion-background-color));
}
body.platform-web ion-modal.enrollment-status-dialog::part(backdrop) {
  background: rgba(18, 27, 19, 0.52);
  -webkit-backdrop-filter: blur(8px) saturate(0.9);
  backdrop-filter: blur(8px) saturate(0.9);
}
body.platform-web ion-modal.enrollment-status-dialog::part(handle) {
  display: none;
}
@media (width < 620px) {
  ion-modal.locked-lesson-dialog--web {
    --width: calc(100vw - 28px);
    --height: min(340px, calc(100vh - 28px));
    --border-radius: 18px;
  }
  ion-modal.locked-lesson-dialog--web::part(content) {
    border-radius: 18px;
  }
  body.platform-web ion-modal.enrollment-status-dialog {
    --width: calc(100vw - 28px);
    --height: min(340px, calc(100vh - 28px));
    --max-height: calc(100vh - 28px);
    --border-radius: 20px;
  }
  body.platform-web ion-modal.enrollment-status-dialog::part(content) {
    border-radius: 20px;
  }
}
.comment-modal-sheet::part(content) {
  border-radius: var(--radius-2xl) var(--radius-2xl) 0 0;
  background: var(--app-surface);
}
.comment-modal-sheet::part(backdrop) {
  background: rgba(0, 0, 0, 0.5);
}
.comment-modal-sheet::part(handle) {
  display: none;
}
.ion-palette-dark {
  color-scheme: dark;
}
.ion-palette-dark ion-app,
.ion-palette-dark ion-content,
.ion-palette-dark ion-list,
.ion-palette-dark ion-card,
.ion-palette-dark ion-item,
.ion-palette-dark ion-modal,
.ion-palette-dark ion-popover,
.ion-palette-dark ion-alert,
.ion-palette-dark ion-action-sheet,
.ion-palette-dark ion-datetime,
.ion-palette-dark ion-picker {
  color: var(--app-text);
}
.ion-palette-dark ion-list {
  background: var(--app-canvas);
}
.ion-palette-dark ion-card:not([color]),
.ion-palette-dark ion-item:not([color]) {
  --background: var(--app-surface);
}
.ion-palette-dark ion-toolbar:not([color]),
.ion-palette-dark ion-footer,
.ion-palette-dark ion-tab-bar {
  --background: var(--app-surface);
  --color: var(--app-text);
  --border-color: var(--app-border);
}
.ion-palette-dark ion-searchbar,
.ion-palette-dark ion-input,
.ion-palette-dark ion-textarea,
.ion-palette-dark ion-select {
  --background: var(--app-surface-muted);
  --color: var(--app-text);
  --placeholder-color: var(--app-text-muted);
}
.ion-palette-dark ion-modal::part(content),
.ion-palette-dark ion-popover::part(content) {
  background: var(--app-surface);
  color: var(--app-text);
}
.ion-palette-dark input,
.ion-palette-dark textarea,
.ion-palette-dark select {
  color-scheme: dark;
  color: var(--app-text);
}
.books-filter-dialog {
  --width: min(540px, calc(100vw - 48px));
  --height: auto;
  --max-height: calc(100vh - 80px);
  --border-radius: var(--radius-lg);
  --box-shadow: 0 28px 72px rgb(24 32 24 / 24%);
  --background: var(--w-card, var(--ion-background-color));
}
.books-filter-dialog::part(content) {
  position: static;
  border: 1px solid var(--w-border, var(--ion-color-light-shade));
  border-radius: var(--radius-lg);
  background: var(--w-card, var(--ion-background-color));
  overflow: hidden;
}
.books-filter-dialog::part(backdrop) {
  background: rgba(28, 34, 28, 0.48);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
}
.books-filter-dialog::part(handle) {
  display: none;
}
.article-filter-dialog {
  --width: min(560px, calc(100vw - 48px));
  --height: auto;
  --max-height: calc(100vh - 80px);
  --border-radius: var(--radius-lg);
  --box-shadow: 0 28px 72px rgb(24 32 24 / 24%);
  --background: var(--w-card, var(--ion-background-color));
}
.article-filter-dialog::part(content) {
  position: static;
  border: 1px solid var(--w-border, var(--ion-color-light-shade));
  border-radius: var(--radius-lg);
  background: var(--w-card, var(--ion-background-color));
  overflow: hidden;
}
.article-filter-dialog::part(backdrop) {
  background: rgba(28, 34, 28, 0.48);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
}
.article-filter-dialog::part(handle) {
  display: none;
}
.community-filter-dialog {
  --width: min(760px, calc(100vw - 48px));
  --height: auto;
  --max-height: calc(100vh - 80px);
  --border-radius: var(--radius-lg);
  --box-shadow: 0 28px 72px rgb(24 32 24 / 24%);
  --background: var(--w-card, var(--ion-background-color));
}
.community-filter-dialog::part(content) {
  position: static;
  border: 1px solid var(--w-border, var(--ion-color-light-shade));
  border-radius: var(--radius-lg);
  background: var(--w-card, var(--ion-background-color));
  overflow-y: auto;
}
.community-filter-dialog::part(backdrop) {
  background: rgba(28, 34, 28, 0.48);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
}
.community-filter-dialog::part(handle) {
  display: none;
}
.community-date-picker-dialog,
.child-date-picker-dialog {
  --width: min(460px, calc(100vw - 48px));
  --height: min(610px, calc(100vh - 80px));
  --max-height: min(610px, calc(100vh - 80px));
  --border-radius: var(--radius-lg);
  --box-shadow: 0 28px 72px rgb(24 32 24 / 24%);
  --background: var(--w-card, var(--ion-background-color));
}
.community-date-picker-dialog::part(content),
.child-date-picker-dialog::part(content) {
  position: static;
  border: 1px solid var(--w-border, var(--ion-color-light-shade));
  border-radius: var(--radius-lg);
  background: var(--w-card, var(--ion-background-color));
  overflow: hidden;
}
.community-date-picker-dialog::part(backdrop),
.child-date-picker-dialog::part(backdrop) {
  background: rgba(28, 34, 28, 0.48);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
}
.community-date-picker-dialog::part(handle),
.child-date-picker-dialog::part(handle) {
  display: none;
}
.child-date-picker-dialog {
  --height: min(500px, calc(100vh - 32px));
  --max-height: min(500px, calc(100vh - 32px));
}
.learning-filter-dialog {
  --width: min(620px, calc(100vw - 48px));
  --height: auto;
  --max-height: calc(100vh - 80px);
  --border-radius: var(--radius-lg);
  --box-shadow: 0 28px 72px rgb(24 32 24 / 24%);
  --background: var(--w-card, var(--ion-background-color));
}
.learning-filter-dialog::part(content) {
  position: static;
  border: 1px solid var(--w-border, var(--ion-color-light-shade));
  border-radius: var(--radius-lg);
  background: var(--w-card, var(--ion-background-color));
  overflow: hidden;
}
.learning-filter-dialog::part(backdrop) {
  background: rgba(28, 34, 28, 0.48);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
}
.learning-filter-dialog::part(handle) {
  display: none;
}
.shop-filter-dialog {
  --width: min(720px, calc(100vw - 48px));
  --height: min(720px, calc(100vh - 64px));
  --max-height: calc(100vh - 64px);
  --border-radius: var(--radius-lg);
  --box-shadow: 0 28px 72px rgb(24 32 24 / 24%);
  --background: var(--w-card, var(--ion-background-color));
}
.shop-filter-dialog::part(content) {
  position: static;
  border: 1px solid var(--w-border, var(--ion-color-light-shade));
  border-radius: var(--radius-lg);
  background: var(--w-card, var(--ion-background-color));
  overflow: hidden;
}
.shop-filter-dialog::part(backdrop) {
  background: rgba(28, 34, 28, 0.48);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
}
.shop-filter-dialog::part(handle) {
  display: none;
}
body.platform-web.dark .shop-filter-dialog {
  --border-radius: 20px;
  --box-shadow: 0 32px 90px rgb(0 0 0 / 52%);
  --background: #0f1612;
}
body.platform-web.dark .shop-filter-dialog::part(content) {
  border-color: rgba(205, 226, 210, 0.13);
  border-radius: 20px;
  background: #0f1612;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04), 0 0 0 1px rgba(0, 0, 0, 0.18);
}
body.platform-web.dark .shop-filter-dialog::part(backdrop) {
  background: rgba(3, 8, 5, 0.72);
  -webkit-backdrop-filter: blur(10px) saturate(80%);
  backdrop-filter: blur(10px) saturate(80%);
}
@media (width < 600px) {
  .shop-filter-dialog {
    --width: calc(100vw - 24px);
    --height: calc(100vh - 32px);
    --max-height: calc(100vh - 32px);
  }
}
@media (width >= 768px) {
  .comment-modal-sheet {
    --width: min(640px, calc(100vw - 48px));
    --height: min(510px, calc(100vh - 96px));
    --max-height: min(640px, calc(100vh - 96px));
    --border-radius: var(--radius-lg);
    --box-shadow: 0 24px 70px rgb(0 0 0 / 24%);
  }
  .comment-modal-sheet::part(content) {
    position: static;
    overflow: hidden;
    border: 1px solid var(--w-border, var(--ion-color-light-shade));
    border-radius: var(--radius-lg);
    background: var(--w-card, var(--ion-background-color));
  }
  .comment-modal-sheet::part(backdrop) {
    background: rgba(26, 32, 24, 0.48);
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
  }
}
.tip-popup-modal {
  --width: 90%;
  --max-width: 600px;
  --height: 460px;
  --max-height: 90vh;
  --border-radius: var(--radius-2xl);
  --background: var(--ion-color-light);
  --box-shadow: 0 10px 40px rgb(0 0 0 / 20%);
}
.tip-popup-modal.tip-popup-modal--empty {
  --height: 175px;
}
.tip-popup-modal.support-popup-modal {
  --height: auto;
}
.tip-popup-modal::part(content) {
  display: flex;
  flex-direction: column;
  border-radius: var(--radius-2xl);
  padding: 0;
}
.tip-popup-modal::part(backdrop) {
  background: rgba(0, 0, 0, 0.6);
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
}
body.platform-web .tip-popup-modal {
  --width: min(840px, calc(100vw - 64px));
  --max-width: 840px;
  --height: min(600px, calc(100dvh - 96px));
  --max-height: calc(100dvh - 96px);
  --border-radius: 24px;
  --background: var(--w-card, var(--ion-background-color));
  --box-shadow: 0 32px 90px rgb(25 38 22 / 28%);
}
body.platform-web .tip-popup-modal.tip-popup-modal--empty {
  --height: 240px;
}
body.platform-web .tip-popup-modal.support-popup-modal {
  --width: min(520px, calc(100vw - 64px));
  --height: auto;
}
body.platform-web .tip-popup-modal::part(content) {
  overflow: hidden;
  border: 1px solid var(--w-border, var(--ion-color-light-shade));
  border-radius: 24px;
  background: var(--w-card, var(--ion-background-color));
}
body.platform-web .tip-popup-modal::part(backdrop) {
  background: rgba(18, 27, 17, 0.58);
  -webkit-backdrop-filter: blur(7px);
  backdrop-filter: blur(7px);
}
body.platform-web.dark .tip-popup-modal {
  --background: #101713;
  --box-shadow: 0 38px 110px rgb(0 0 0 / 58%), 0 10px 34px rgb(0 0 0 / 36%);
}
body.platform-web.dark .tip-popup-modal::part(content) {
  border-color: rgba(168, 207, 143, 0.18);
  background: #101713;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03);
}
body.platform-web.dark .tip-popup-modal::part(backdrop) {
  background: rgba(2, 7, 4, 0.76);
  -webkit-backdrop-filter: blur(8px) saturate(80%);
  backdrop-filter: blur(8px) saturate(80%);
}
@media (width < 720px) {
  body.platform-web .tip-popup-modal {
    --width: calc(100vw - 28px);
    --height: min(640px, calc(100dvh - 40px));
    --max-height: calc(100dvh - 40px);
  }
}
ion-toast {
  --border-radius: var(--radius-xl);
  --box-shadow: 0 4px 16px rgb(0 0 0 / 15%);
  --start: 16px;
  --end: 16px;
  --max-width: 100%;
}
ion-toast::part(container) {
  padding: 12px 16px;
}
ion-toast::part(message) {
  font-size: 14px;
  line-height: 1.4;
}
ion-toast::part(button) {
  font-weight: 600;
  text-transform: none;
  font-size: 14px;
}
.report-undo-toast {
  --background: var(--ion-color-dark);
  --color: var(--ion-color-dark-contrast);
}
.report-undo-toast::part(button) {
  color: var(--ion-color-primary);
}
.toast-success {
  --background: var(--ion-color-success);
  --color: var(--ion-color-success-contrast);
}
.toast-danger {
  --background: var(--ion-color-danger);
  --color: var(--ion-color-danger-contrast);
}
.toast-info {
  --background: var(--ion-color-medium);
  --color: var(--ion-color-medium-contrast);
}
body.android-native-pip ion-header,
body.android-native-pip app-header-container,
body.android-native-pip app-lesson-navigation,
body.android-native-pip .content-section,
body.android-native-pip .android-pip-btn {
  display: none !important;
}
body.android-native-pip ion-content.video-page,
body.android-native-pip ion-content {
  --background: #000;
}
body.android-native-pip .video-section {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  z-index: 9999;
}
body.android-native-pip .video-wrapper {
  height: 100%;
  position: static;
}
body.android-native-pip video,
body.android-native-pip .video-player {
  object-fit: contain;
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 10000;
  background: black;
}
.in-app-pip-container {
  position: fixed;
  bottom: 80px;
  right: 16px;
  width: 250px;
  height: 140px;
  z-index: 99999;
  border-radius: 8px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.5);
  background: black;
  overflow: hidden;
  cursor: grab;
  touch-action: none;
}
.in-app-pip-container:active {
  cursor: grabbing;
}
.in-app-pip-container video {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.in-app-pip-close-btn {
  position: absolute;
  top: 4px;
  right: 4px;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.6);
  color: white;
  border: none;
  font-size: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  z-index: 100000;
}
@media (width < 768px) {
  .mobile-touch-target {
    min-width: 44px;
    min-height: 44px;
  }
}

/* angular:styles/global:styles */