:root{
          --bg:#0b0f12;
          --card:#10171c;
          --text:#e9f1f6;
          --muted:#b4c3cd;
          --line:#20303a;
          --accent:#ffe36e;     /* yellow */
          --accent2:#6ef0ff;    /* cyan */
          --danger:#ff6e6e;
          --ok:#7dff9a;
          --shadow: 0 12px 30px rgba(0,0,0,.35);
          --radius: 18px;
          --font: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial, "Noto Sans", "Apple Color Emoji","Segoe UI Emoji";
        }
        *{ box-sizing:border-box; }
        body{
          margin:0;
          font-family:var(--font);
          background: radial-gradient(1200px 600px at 15% 10%, rgba(255,227,110,.12), transparent 60%),
                      radial-gradient(900px 500px at 90% 20%, rgba(110,240,255,.10), transparent 55%),
                      var(--bg);
          color:var(--text);
        }
        .wrap{
          max-width: 980px;
          margin: 0 auto;
          padding: 18px 14px 30px;
        }
        header{
          display:flex;
          align-items:center;
          justify-content:space-between;
          gap:12px;
          padding: 10px 6px 16px;
        }
        .title{
          display:flex;
          flex-direction:column;
          gap:4px;
        }
        h1{
          margin:0;
          font-size: 22px;
          letter-spacing:.2px;
        }
        .sub{
          margin:0;
          font-size: 13px;
          color:var(--muted);
          line-height:1.3;
        }
        .back{
          text-decoration:none;
          color:var(--text);
          border:1px solid var(--line);
          padding:10px 12px;
          border-radius: 12px;
          background: rgba(16,23,28,.55);
          box-shadow: var(--shadow);
          display:flex;
          align-items:center;
          gap:8px;
          white-space:nowrap;
        }
        .back .dot{
          width:10px;height:10px;border-radius:999px;background:var(--accent);
          box-shadow: 0 0 18px rgba(255,227,110,.35);
        }

        .grid{
          display:grid;
          grid-template-columns: 1.1fr .9fr;
          gap:14px;
        }
        @media (max-width: 860px){
          .grid{ grid-template-columns: 1fr; }
          header{ flex-direction:column; align-items:flex-start; }
          .back{ align-self:flex-end; }
        }

        .card{
          background: linear-gradient(180deg, rgba(16,23,28,.86), rgba(16,23,28,.62));
          border: 1px solid rgba(32,48,58,.9);
          border-radius: var(--radius);
          box-shadow: var(--shadow);
          padding: 16px;
        }
        .card h2{
          margin:0 0 10px;
          font-size: 16px;
          color: var(--accent);
          letter-spacing:.2px;
        }

        .timerBox{
          display:flex;
          flex-direction:column;
          gap:12px;
        }
        .bigTime{
          font-size: 56px;
          font-weight: 700;
          letter-spacing: 1px;
          line-height:1;
          margin: 2px 0 0;
        }
        .statusRow{
          display:flex;
          align-items:center;
          justify-content:space-between;
          gap:10px;
          padding-top:6px;
          border-top:1px solid rgba(32,48,58,.7);
          flex-wrap:wrap;
        }
        .pill{
          display:inline-flex;
          align-items:center;
          gap:8px;
          padding:8px 10px;
          border-radius: 999px;
          border:1px solid rgba(32,48,58,.9);
          background: rgba(0,0,0,.18);
          color: var(--muted);
          font-size: 12px;
          white-space:nowrap;
        }
        .pill .lamp{
          width:10px;height:10px;border-radius:999px;background:#666;
          box-shadow:none;
        }
        .pill.live .lamp{
          background: var(--ok);
          box-shadow: 0 0 18px rgba(125,255,154,.35);
        }
        .pill.pause .lamp{
          background: var(--accent);
          box-shadow: 0 0 18px rgba(255,227,110,.25);
        }
        .pill.cycle .lamp{
          background: var(--accent2);
          box-shadow: 0 0 18px rgba(110,240,255,.25);
        }

        .btnRow{
          display:flex;
          gap:10px;
          flex-wrap:wrap;
          margin-top: 8px;
        }
        button{
          border:1px solid rgba(32,48,58,.95);
          background: rgba(0,0,0,.18);
          color: var(--text);
          padding: 12px 14px;
          border-radius: 14px;
          cursor:pointer;
          font-weight: 650;
          letter-spacing:.2px;
          transition: transform .05s ease, border-color .15s ease, background .15s ease;
        }
        button:active{ transform: translateY(1px); }
        button.primary{
          border-color: rgba(255,227,110,.65);
          background: rgba(255,227,110,.12);
          box-shadow: 0 0 0 1px rgba(255,227,110,.18) inset;
        }
        button.danger{
          border-color: rgba(255,110,110,.6);
          background: rgba(255,110,110,.10);
        }
        button:disabled{
          opacity:.45;
          cursor:not-allowed;
        }

        .row{
          display:grid;
          grid-template-columns: 1fr 1fr;
          gap:10px;
        }
        @media (max-width: 560px){
          .row{ grid-template-columns: 1fr; }
          .bigTime{ font-size: 50px; }
        }
        label{
          display:flex;
          flex-direction:column;
          gap:6px;
          font-size: 12px;
          color: var(--muted);
        }
        select, input[type="number"], input[type="range"]{
          width:100%;
          border-radius: 12px;
          border:1px solid rgba(32,48,58,.95);
          background: rgba(0,0,0,.16);
          color: var(--text);
          padding: 10px 12px;
          outline:none;
        }
        input[type="range"]{ padding: 10px 0; }
        .hint{
          margin: 10px 0 0;
          font-size: 12px;
          color: var(--muted);
          line-height:1.45;
        }

        /* Full Guide formatting */
        .guide{
          display:flex;
          flex-direction:column;
          gap:10px;
        }
        details{
          border:1px solid rgba(32,48,58,.8);
          border-radius: 14px;
          background: rgba(0,0,0,.14);
          overflow:hidden;
        }
        summary{
          cursor:pointer;
          padding: 12px 12px;
          list-style:none;
          font-weight: 800;
          color: var(--accent2);
          display:flex;
          align-items:center;
          justify-content:space-between;
          gap:10px;
        }
        summary::-webkit-details-marker{ display:none; }
        .chev{
          color: var(--muted);
          font-size: 12px;
          font-weight: 700;
        }
        .content{
          padding: 0 12px 12px;
          color: var(--text);
          line-height:1.55;
          font-size: 14px;
        }
        .content p{ margin: 10px 0; }
        .content .muted{
          color: var(--muted);
          font-size: 12px;
          margin-top: 8px;
        }
        .content ul, .content ol{
          margin: 8px 0 10px 18px;
          padding:0;
        }
        .content li{ margin: 6px 0; }
        .tag{
          display:inline-block;
          padding: 6px 10px;
          border-radius: 999px;
          border:1px solid rgba(32,48,58,.9);
          background: rgba(0,0,0,.18);
          color: var(--muted);
          font-size: 12px;
        }

        .footer{
          margin-top: 14px;
          font-size: 12px;
          color: var(--muted);
          text-align:center;
          opacity:.9;
        }

        /* Force dropdown (select + options) to be white on black (DARK THEME ONLY) */
    body:not([data-theme]) select,
    body[data-theme="original"] select{
      background: #000 !important;
      color: #fff !important;
      border-color: rgba(255,255,255,.25) !important;
    }
    body:not([data-theme]) select option,
    body:not([data-theme]) select optgroup,
    body[data-theme="original"] select option,
    body[data-theme="original"] select optgroup{
      background: #000 !important;
      color: #fff !important;
    }

    /* Light themes dropdown: match theme colors */
    body[data-theme="heavenBlue"] select{
      background: linear-gradient(180deg,#eaf6ff,#d7efff) !important;
      color:#000 !important;
      border-color: rgba(120,170,220,.60) !important;
    }
    body[data-theme="heavenBlue"] select option,
    body[data-theme="heavenBlue"] select optgroup{
      background:#eef8ff !important;
      color:#000 !important;
    }

    /* Pink + Blue mix */
    body[data-theme="skyPink"] select{
      background: linear-gradient(90deg,#eaf6ff,#ffe6f3) !important;
      color:#000 !important;
      border-color: rgba(190,150,220,.55) !important;
    }
    body[data-theme="skyPink"] select option,
    body[data-theme="skyPink"] select optgroup{
      background:#fff0f8 !important;
      color:#000 !important;
    }

    /* Lavender */
    body[data-theme="softLavender"] select{
      background: linear-gradient(180deg,#f3eaff,#eaf6ff) !important;
      color:#000 !important;
      border-color: rgba(165,145,230,.55) !important;
    }
    body[data-theme="softLavender"] select option,
    body[data-theme="softLavender"] select optgroup{
      background:#fbf6ff !important;
      color:#000 !important;
    }

    /* Breath pacer */
        .pacerWrap{
          display:flex;
          align-items:center;
          justify-content:center;
          padding: 10px 0 4px;
        }
        .pacer{
          width: 170px;
          height: 170px;
          border-radius: 999px;
          border: 1px solid rgba(32,48,58,.95);
          background:
            radial-gradient(circle at 30% 30%, rgba(232, 225, 13, 0.97), transparent 55%),
            radial-gradient(circle at 70% 70%, rgba(255, 206, 10, 0.475), transparent 55%),
            radial-gradient(circle at 50% 50%, rgba(212, 14, 176, 0.591), transparent 62%),
            rgba(255,255,255,.04);
          box-shadow: 0 0 0 1px rgba(245, 200, 20, 0.751) inset, 0 0 26px rgba(6, 208, 67, 0.295), 0 0 22px rgba(255,227,110,.10), var(--shadow);
          position:relative;
          overflow:hidden;
          transform: scale(0.95);
          transition: transform 1200ms linear;
        }
        .pacer::after{
          content:"";
          position:absolute;
          inset:14px;
          border-radius:999px;
          border:1px dashed rgba(110,240,255,.55);
          opacity:.7;
        }
        .pacerLabel{
          text-align:center;
          font-size: 12px;
          color: var(--muted);
          margin-top: 6px;
        }
        .cycleText{
          font-weight: 800;
          color: var(--text);
        }

        /* Prerecorded guide audio buttons */
        .btn-green {
          border-color: rgba(125,255,154,.7);
          background: rgba(125,255,154,.12);
          box-shadow: 0 0 0 1px rgba(125,255,154,.18) inset, 0 0 18px rgba(125,255,154,.10);
          color: var(--text);
        }
        .btn-red {
          border-color: rgba(255,110,110,.7);
          background: rgba(255,110,110,.12);
          box-shadow: 0 0 0 1px rgba(255,110,110,.18) inset, 0 0 18px rgba(255,110,110,.10);
          color: var(--text);
        }
        .ttsRow {
          display:flex;
          gap:10px;
          flex-wrap:wrap;
          align-items:flex-end;
          margin-top: 10px;
        }
        .ttsRow label { flex: 1 1 320px; }
        .ttsNote {
          margin-top: 10px;
          font-size: 12px;
          color: var(--muted);
          line-height: 1.45;
        }


        /* THEME OVERRIDES (ADDITIVE ONLY) */

        body[data-theme="heavenBlue"]{
          --bg:#eaf7ff;
          --card:rgba(255,255,255,0.92);
          --text:#13253d;
          --muted:#4c6b8b;
          --line:rgba(120,170,220,.38);
          --accent:#4fb0ff;
          --accent2:#b79cff;
          --danger:#ff6e6e;
          --ok:#2bd4a3;
          --shadow: 0 12px 30px rgba(90,140,200,.18);
          background:
            radial-gradient(1200px 700px at 18% 8%, rgba(79,176,255,.38), transparent 60%),
            radial-gradient(900px 600px at 82% 18%, rgba(183,156,255,.22), transparent 55%),
            radial-gradient(900px 650px at 50% 95%, rgba(255,255,255,.55), transparent 62%),
            linear-gradient(180deg,#eaf7ff 0%, #ffffff 55%, #f4ecff 100%) !important;
          color: var(--text);
        }


        body[data-theme="skyPink"]{
          --bg:#fff4fb;
          --card:rgba(255,255,255,0.92);
          --text:#14243a;
          --muted:#5a6f8a;
          --line:rgba(150,160,220,.34);
          --accent:#ff6fb6;     /* pink */
          --accent2:#4fb0ff;    /* sky */
          --danger:#ff6e6e;
          --ok:#2bd4a3;
          --shadow: 0 12px 30px rgba(120,120,200,.16);
          background:
            radial-gradient(1200px 700px at 16% 10%, rgba(79,176,255,.30), transparent 60%),
            radial-gradient(950px 650px at 84% 22%, rgba(255,111,182,.34), transparent 55%),
            radial-gradient(900px 650px at 50% 95%, rgba(255,255,255,.55), transparent 62%),
            linear-gradient(180deg,#f7fbff 0%, #fff0f8 60%, #ffe6f3 100%) !important;
          color: var(--text);
        }


        body[data-theme="softLavender"]{
          --bg:#fbf6ff;
          --card:rgba(255,255,255,0.92);
          --text:#17263f;
          --muted:#566d8a;
          --line:rgba(165,145,230,.30);
          --accent:#b48cff;     /* lavender */
          --accent2:#4fb0ff;    /* sky */
          --danger:#ff6e6e;
          --ok:#2bd4a3;
          --shadow: 0 12px 30px rgba(120,120,200,.14);
          background:
            radial-gradient(1200px 700px at 18% 10%, rgba(180,140,255,.34), transparent 60%),
            radial-gradient(950px 650px at 84% 22%, rgba(79,176,255,.24), transparent 55%),
            radial-gradient(900px 650px at 50% 95%, rgba(255,255,255,.55), transparent 62%),
            linear-gradient(180deg,#fbf6ff 0%, #f0fbff 58%, #fff0f8 100%) !important;
          color: var(--text);
        }

        /* Light themes: remove any harsh/dark shadows and dark glass */
        body[data-theme="heavenBlue"] .card,
        body[data-theme="skyPink"] .card,
        body[data-theme="softLavender"] .card,
        body[data-theme="heavenBlue"] details,
        body[data-theme="skyPink"] details,
        body[data-theme="softLavender"] details,
        body[data-theme="heavenBlue"] .back,
        body[data-theme="skyPink"] .back,
        body[data-theme="softLavender"] .back{
          box-shadow: var(--shadow) !important;
          background: linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,255,255,.74)) !important;
          border-color: var(--line) !important;
        }

        body[data-theme="heavenBlue"] h1,
        body[data-theme="skyPink"] h1,
        body[data-theme="softLavender"] h1{
          color: #172a42 !important;
        }

        body[data-theme="heavenBlue"] .sub,
        body[data-theme="skyPink"] .sub,
        body[data-theme="softLavender"] .sub,
        body[data-theme="heavenBlue"] label,
        body[data-theme="skyPink"] label,
        body[data-theme="softLavender"] label{
          color: var(--muted) !important;
        }

        body[data-theme="heavenBlue"] .pill,
        body[data-theme="skyPink"] .pill,
        body[data-theme="softLavender"] .pill{
          background: rgba(255,255,255,.80) !important;
          color: var(--muted) !important;
          border-color: var(--line) !important;
        }

        body[data-theme="heavenBlue"] button,
        body[data-theme="skyPink"] button,
        body[data-theme="softLavender"] button{
          background: linear-gradient(180deg, rgba(255,255,255,.96), rgba(239,248,255,.86)) !important;
          color: var(--text) !important;
          box-shadow: 0 8px 18px rgba(90,140,200,.14) !important;
        }
        body[data-theme="heavenBlue"] button.primary,
        body[data-theme="skyPink"] button.primary,
        body[data-theme="softLavender"] button.primary{
          border-color: rgba(99,179,255,.55) !important;
          background: rgba(99,179,255,.14) !important;
          box-shadow: 0 0 0 1px rgba(99,179,255,.16) inset !important;
        }

/* Guide audio controls: visible SVG buttons in every browser and theme */
.guide-audio-icon-btn {
  width: 54px;
  height: 46px;
  min-width: 54px;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  flex: 0 0 54px;
  border-width: 2px !important;
  border-style: solid !important;
  border-radius: 14px;
  line-height: 1;
}

.guide-audio-icon-btn .audio-control-icon {
  width: 28px;
  height: 28px;
  display: block;
  fill: currentColor;
  pointer-events: none;
}

button.guide-audio-icon-btn.btn-green,
body[data-theme="heavenBlue"] button.guide-audio-icon-btn.btn-green,
body[data-theme="skyPink"] button.guide-audio-icon-btn.btn-green,
body[data-theme="softLavender"] button.guide-audio-icon-btn.btn-green,
body[data-theme="original"] button.guide-audio-icon-btn.btn-green {
  color: #ffffff !important;
  background: #168a45 !important;
  border-color: #0c6430 !important;
  box-shadow: 0 5px 14px rgba(22,138,69,.28) !important;
}

button.guide-audio-icon-btn.btn-red,
body[data-theme="heavenBlue"] button.guide-audio-icon-btn.btn-red,
body[data-theme="skyPink"] button.guide-audio-icon-btn.btn-red,
body[data-theme="softLavender"] button.guide-audio-icon-btn.btn-red,
body[data-theme="original"] button.guide-audio-icon-btn.btn-red {
  color: #ffffff !important;
  background: #c93838 !important;
  border-color: #922525 !important;
  box-shadow: 0 5px 14px rgba(201,56,56,.26) !important;
}

.guide-audio-icon-btn:hover:not(:disabled) {
  filter: brightness(1.08);
}

.guide-audio-icon-btn:focus-visible {
  outline: 3px solid var(--accent2);
  outline-offset: 3px;
}

.guide-audio-icon-btn:disabled {
  opacity: .42 !important;
  filter: grayscale(.15);
}


/* Guide audio layout: dropdown first, controls below */
.ttsRow {
  align-items: flex-start !important;
}
.ttsRow > label {
  flex: 1 0 100% !important;
  width: 100%;
}
.ttsRow > .guide-audio-icon-btn {
  margin-top: 2px;
}

/* Custom theme selector: no native radio-circle popup */
.theme-native-select-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
  opacity: 0 !important;
  pointer-events: none !important;
}
.custom-theme-select {
  position: relative;
  width: 100%;
}
.custom-theme-trigger {
  width: 100%;
  min-height: 44px;
  padding: 10px 42px 10px 12px !important;
  border: 1px solid var(--line) !important;
  border-radius: 12px !important;
  color: var(--text) !important;
  background: var(--card) !important;
  text-align: start;
  font: inherit;
  font-weight: 700;
  box-shadow: none !important;
  position: relative;
}
.custom-theme-trigger::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 14px;
  width: 9px;
  height: 9px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: translateY(-70%) rotate(45deg);
}
[dir="rtl"] .custom-theme-trigger {
  padding: 10px 12px 10px 42px !important;
}
[dir="rtl"] .custom-theme-trigger::after {
  right: auto;
  left: 14px;
}
.custom-theme-menu {
  display: none;
  position: absolute;
  z-index: 1000;
  top: calc(100% + 7px);
  left: 0;
  right: 0;
  padding: 7px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--card);
  box-shadow: 0 14px 30px rgba(0,0,0,.22);
}
.custom-theme-select.open .custom-theme-menu {
  display: grid;
  gap: 6px;
}
.custom-theme-option {
  width: 100%;
  min-height: 42px;
  padding: 10px 12px !important;
  border: 2px solid transparent !important;
  border-radius: 10px !important;
  text-align: start;
  font: inherit;
  font-weight: 750;
  box-shadow: none !important;
}
.custom-theme-option[aria-selected="true"] {
  border-color: currentColor !important;
  outline: 2px solid rgba(255,255,255,.72);
  outline-offset: -5px;
}
.custom-theme-option[data-value="heavenBlue"],
.custom-theme-trigger[data-value="heavenBlue"] {
  background: linear-gradient(90deg,#d7efff,#f4ecff) !important;
  color: #173a63 !important;
}
.custom-theme-option[data-value="skyPink"],
.custom-theme-trigger[data-value="skyPink"] {
  background: linear-gradient(90deg,#dff3ff,#ffe2f1) !important;
  color: #60304c !important;
}
.custom-theme-option[data-value="softLavender"],
.custom-theme-trigger[data-value="softLavender"] {
  background: linear-gradient(90deg,#eee2ff,#e1f5ff) !important;
  color: #493675 !important;
}
.custom-theme-option[data-value="original"],
.custom-theme-trigger[data-value="original"] {
  background: linear-gradient(180deg,#172127,#090d10) !important;
  color: #ffffff !important;
  border-color: rgba(255,255,255,.28) !important;
}
.custom-theme-option:hover,
.custom-theme-option:focus-visible {
  filter: brightness(1.04);
}


/* Custom app dropdowns: consistent in browser and Android WebView */
.app-native-select-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
  opacity: 0 !important;
  pointer-events: none !important;
}
.custom-app-select {
  position: relative;
  width: 100%;
}
.custom-app-trigger {
  width: 100%;
  min-height: 44px;
  padding: 10px 42px 10px 12px !important;
  border: 1px solid var(--line) !important;
  border-radius: 12px !important;
  background: color-mix(in srgb, var(--card) 92%, var(--accent) 8%) !important;
  color: var(--text) !important;
  text-align: start;
  font: inherit;
  font-weight: 700;
  box-shadow: none !important;
  position: relative;
}
.custom-app-trigger::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 14px;
  width: 9px;
  height: 9px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: translateY(-70%) rotate(45deg);
}
[dir="rtl"] .custom-app-trigger {
  padding: 10px 12px 10px 42px !important;
}
[dir="rtl"] .custom-app-trigger::after {
  right: auto;
  left: 14px;
}
.custom-app-menu {
  display: none;
  position: absolute;
  z-index: 3000;
  top: calc(100% + 7px);
  left: 0;
  right: 0;
  max-height: 280px;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 7px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--card);
  box-shadow: 0 14px 30px rgba(0,0,0,.24);
}
.custom-app-select.open .custom-app-menu {
  display: grid;
  gap: 6px;
}
.custom-app-option {
  width: 100%;
  min-height: 42px;
  padding: 10px 12px !important;
  border: 1px solid transparent !important;
  border-radius: 10px !important;
  color: var(--text) !important;
  text-align: start;
  font: inherit;
  font-weight: 700;
  box-shadow: none !important;
}
.custom-app-option[data-option-index="0"] { background: color-mix(in srgb, var(--accent) 17%, var(--card) 83%) !important; }
.custom-app-option[data-option-index="1"] { background: color-mix(in srgb, var(--accent2) 17%, var(--card) 83%) !important; }
.custom-app-option[data-option-index="2"] { background: color-mix(in srgb, var(--ok) 13%, var(--card) 87%) !important; }
.custom-app-option[data-option-index="3"] { background: color-mix(in srgb, var(--danger) 11%, var(--card) 89%) !important; }
.custom-app-option[aria-selected="true"] {
  border-color: var(--accent) !important;
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--accent) 35%, transparent) inset !important;
}
.custom-app-option:hover,
.custom-app-option:focus-visible {
  filter: brightness(1.05);
  border-color: var(--accent2) !important;
}
/* Theme choices keep their own recognizable colors */
.is-theme-select .custom-app-option[data-value="heavenBlue"],
.is-theme-select .custom-app-trigger[data-value="heavenBlue"] {
  background: linear-gradient(90deg,#d7efff,#f4ecff) !important;
  color:#173a63 !important;
}
.is-theme-select .custom-app-option[data-value="skyPink"],
.is-theme-select .custom-app-trigger[data-value="skyPink"] {
  background: linear-gradient(90deg,#dff3ff,#ffe2f1) !important;
  color:#60304c !important;
}
.is-theme-select .custom-app-option[data-value="softLavender"],
.is-theme-select .custom-app-trigger[data-value="softLavender"] {
  background: linear-gradient(90deg,#eee2ff,#e1f5ff) !important;
  color:#493675 !important;
}
.is-theme-select .custom-app-option[data-value="original"],
.is-theme-select .custom-app-trigger[data-value="original"] {
  background: linear-gradient(180deg,#172127,#090d10) !important;
  color:#fff !important;
  border-color:rgba(255,255,255,.28) !important;
}


/* Breathing-phase countdown placed directly inside the original sphere */
.pacerCountdown{
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  z-index:3;
  display:block;
  padding:0;
  margin:0;
  background:transparent !important;
  border:0 !important;
  border-radius:0;
  color:#fff !important;
  font-size:64px;
  line-height:1;
  font-weight:900;
  font-variant-numeric:tabular-nums;
  letter-spacing:-2px;
  text-shadow:0 3px 5px rgba(0,0,0,.98), 0 0 12px rgba(0,0,0,.95);
  -webkit-text-stroke:1px rgba(0,0,0,.72);
  pointer-events:none;
  user-select:none;
}
.pacer::after{ z-index:2; }
body[data-theme="heavenBlue"] .pacerCountdown,
body[data-theme="skyPink"] .pacerCountdown,
body[data-theme="softLavender"] .pacerCountdown,
body[data-theme="original"] .pacerCountdown{
  background:transparent !important;
  border:0 !important;
  color:#fff !important;
}
@media (max-width:560px){
  .pacerCountdown{ font-size:58px; }
}