/* Higher Self · DESIGN DNA v2 (build 1529), stratul global.
   [stated] "I really like how the flow from the rituals look like and how the design from the rituals looks like. And I would like to keep those
   as the main design source ... most of the containers still have stars in places where text is ... Some of the buttons are not consistent".
   Decizii (24.10): butonul primar = crem peste tot (ca la ritual); stelele raman doar pe fundalul paginii; intai stratul global, apoi tool cu tool.
   Specificitate: prefixul cu 6 :not(#id) bate regulile vechi scrise pe ID-uri (css/51 are 4). 
   Sursa unica: DESIGN-DNA.md, §7 (v2). Fisierul asta se incarca ULTIMUL, ca sa bata regulile vechi din fiecare tool. */

:root{
  --dna-pri-bg:#f5efe4; --dna-pri-ink:#141022; --dna-pri-sh:0 10px 24px rgba(0,0,0,.35);
  --dna-sec-bg:rgba(255,255,255,.10); --dna-sec-line:rgba(255,255,255,.28); --dna-sec-ink:#f5efe4;
  --dna-panel:rgba(0,0,0,.22); --dna-line:rgba(255,255,255,.12);
  --dna-opt:rgba(255,255,255,.07); --dna-opt-line:rgba(255,255,255,.16);
}

/* ---------- 1. Butonul PRIMAR: o singura pastila crem, text inchis (ca „Make my own” / „Start my morning”) ---------- */
html body .screen:not(#dna1):not(#dna2):not(#dna3):not(#dna4):not(#dna5):not(#dna6) :is(.cta, .hsBtn, .mkBtn, .faCta, .swCta, .wg5Pri, .rv3Pri, .zlDeepBtn):not(.ghostB):not(.hsOpt):not(.mfRemB):not(.ghost),
html body #pwOver .cta{
  background:var(--dna-pri-bg) !important; background-image:none !important; color:var(--dna-pri-ink) !important;
  border:0 !important; border-radius:999px !important; box-shadow:var(--dna-pri-sh) !important;
  font-family:var(--font-body) !important; font-weight:800 !important; text-shadow:none !important}
html body .screen:not(#dna1):not(#dna2):not(#dna3):not(#dna4):not(#dna5):not(#dna6) :is(.cta, .hsBtn, .mkBtn, .faCta, .swCta, .wg5Pri, .rv3Pri, .zlDeepBtn):not(.ghostB):not(.hsOpt):not(.mfRemB):not(.ghost) *{color:inherit !important}
html body .screen:not(#dna1):not(#dna2):not(#dna3):not(#dna4):not(#dna5):not(#dna6) :is(.cta, .hsBtn, .mkBtn, .faCta, .swCta):disabled{opacity:.45 !important; box-shadow:none !important}

/* ---------- 2. Butonul SECUNDAR: pastila transparenta cu contur fin (ca „Surprise me”) ---------- */
html body .screen:not(#dna1):not(#dna2):not(#dna3):not(#dna4):not(#dna5):not(#dna6) :is(.ghost, .mkGhost, .hsEndLib, .ghostB, .reinf, .zpMoreB, .grSendB){
  background:var(--dna-sec-bg) !important; background-image:none !important; color:var(--dna-sec-ink) !important;
  border:0 !important; border-radius:999px !important; box-shadow:inset 0 0 0 1.5px var(--dna-sec-line) !important;
  font-family:var(--font-body) !important; font-weight:800 !important; text-shadow:none !important}
html body .screen:not(#dna1):not(#dna2):not(#dna3):not(#dna4):not(#dna5):not(#dna6) :is(.ghost, .mkGhost, .hsEndLib, .ghostB, .reinf, .zpMoreB, .grSendB) *{color:inherit !important}

/* ---------- 3. Selectie: segmentul activ = pastila crem, restul text moale (ca Morning / Midday / Evening) ---------- */
html body .screen:not(#dna1):not(#dna2):not(#dna3):not(#dna4):not(#dna5):not(#dna6) :is(.langSw, .mhTabs) > button{background:transparent !important; color:rgba(245,239,228,.74) !important; box-shadow:none !important; border:0 !important}
html body .screen:not(#dna1):not(#dna2):not(#dna3):not(#dna4):not(#dna5):not(#dna6) :is(.langSw) {background:var(--dna-panel) !important; box-shadow:inset 0 0 0 1px var(--dna-line) !important; border:0 !important}
html body .screen:not(#dna1):not(#dna2):not(#dna3):not(#dna4):not(#dna5):not(#dna6) :is(.langSw > button.on, .cTab.mhTab.on){background:var(--dna-pri-bg) !important; color:var(--dna-pri-ink) !important; box-shadow:none !important}

/* ---------- 4. Containerele cu text: fundal plin, fara stele ----------
   Texturile hs-cardbg-soul/mind/body au fost refacute fara stele (gradient + granulatie de fetru), deci toate panourile
   de unealta, cardurile si slide-urile care le folosesc au acum un fundal curat. Aici: quiz-ul alb din Release si Big Goals
   trece pe suprafata inchisa, ca restul aplicatiei. */
html body :is(#s-belief, #s-goals):not(#dna1):not(#dna2):not(#dna3):not(#dna4):not(#dna5):not(#dna6) .hsSq{
  background:linear-gradient(rgba(255,255,255,.06), rgba(255,255,255,.02)), rgba(10,18,44,.55) !important; background-image:none;
  box-shadow:inset 0 0 0 1px var(--dna-line), 0 14px 34px rgba(0,0,0,.28) !important; border:0 !important}
html body :is(#s-belief, #s-goals):not(#dna1):not(#dna2):not(#dna3):not(#dna4):not(#dna5):not(#dna6) .hsSq .hsPlate{background:var(--dna-panel) !important; box-shadow:inset 0 0 0 1px var(--dna-line) !important; border:0 !important}
html body :is(#s-belief, #s-goals):not(#dna1):not(#dna2):not(#dna3):not(#dna4):not(#dna5):not(#dna6) .hsSq :is(.hsQ, .hsStep, .hsIn, .hsIn p, .hsIn label, .hsIn span, .hsIn small){color:#f5efe4 !important; background:none !important; box-shadow:none !important}
html body :is(#s-belief, #s-goals):not(#dna1):not(#dna2):not(#dna3):not(#dna4):not(#dna5):not(#dna6) .hsSq .hsStep{color:rgba(245,239,228,.55) !important}
html body :is(#s-belief, #s-goals):not(#dna1):not(#dna2):not(#dna3):not(#dna4):not(#dna5):not(#dna6) .hsSq :is(textarea, input){background:rgba(0,0,0,.25) !important; color:#f5efe4 !important; border:0 !important; box-shadow:inset 0 0 0 1px var(--dna-line) !important}
html body :is(#s-belief, #s-goals):not(#dna1):not(#dna2):not(#dna3):not(#dna4):not(#dna5):not(#dna6) .hsSq :is(textarea, input)::placeholder{color:rgba(245,239,228,.5) !important}
html body :is(#s-belief, #s-goals):not(#dna1):not(#dna2):not(#dna3):not(#dna4):not(#dna5):not(#dna6) .hsSq .hsOpt{background:var(--dna-opt) !important; background-image:none !important; color:#f5efe4 !important; border:0 !important; box-shadow:inset 0 0 0 1.5px var(--dna-opt-line) !important}
html body :is(#s-belief, #s-goals):not(#dna1):not(#dna2):not(#dna3):not(#dna4):not(#dna5):not(#dna6) .hsSq .hsOpt.on{background:linear-gradient(135deg,#f3d98f,#d6a84a) !important; color:#24174f !important; box-shadow:none !important}
html body :is(#s-belief, #s-goals):not(#dna1):not(#dna2):not(#dna3):not(#dna4):not(#dna5):not(#dna6) .hsDots i{background:rgba(245,239,228,.35) !important}
html body :is(#s-belief, #s-goals):not(#dna1):not(#dna2):not(#dna3):not(#dna4):not(#dna5):not(#dna6) .hsDots i.on{background:#f5efe4 !important}

/* ---------- 5. Profil: cardurile albe (Pricing & credits, Notifications) trec pe panoul inchis ---------- */
html body #s-profile:not(#dna1):not(#dna2):not(#dna3):not(#dna4):not(#dna5):not(#dna6) :is(.subCard, .bigCard, .allItem){
  background:rgba(14,9,34,.62) !important; background-image:none !important; color:#f5efe4 !important;
  border:0 !important; box-shadow:inset 0 0 0 1px var(--dna-line) !important}
html body #s-profile:not(#dna1):not(#dna2):not(#dna3):not(#dna4):not(#dna5):not(#dna6) :is(.subCard, .bigCard, .allItem) :is(b, strong, h3, h4, p, span, small, div, .info){color:inherit !important}
html body #s-profile:not(#dna1):not(#dna2):not(#dna3):not(#dna4):not(#dna5):not(#dna6) :is(.subCard, .bigCard, .allItem) :is(small, .sub, .muted){color:rgba(245,239,228,.62) !important}
html body #s-profile:not(#dna1):not(#dna2):not(#dna3):not(#dna4):not(#dna5):not(#dna6) .allItem .ov{display:none !important}

/* ---------- 6. 1531 [stated]: „stele doar pe fundalul din spate, nu in containere cu text sau in text boxes” +
   „culorile UI/UX mai bright, ca cele din ritualuri” ----------
   - Panoul uneltei (sub poza) nu mai e fetru inchis: e un gradient plin, mai luminos, in nuanta zonei (ca panourile din ritual).
   - Orice container cu text care sta direct pe fundalul cu stele (butoane secundare, campuri, quiz, carduri din Profil) are acum
     fundal PLIN (fara transparenta), deci stelele nu se mai vad prin el. Stelele raman doar pe fundalul paginii. */
body[data-cat="soul"], body:not([data-cat]), body[data-cat=""]{--dna-zv:#7b5bd6}
body[data-cat="mind"]{--dna-zv:#3a6fd0}
body[data-cat="body"]{--dna-zv:#2f9a80}
:root{
  --dna-surf1:color-mix(in srgb, var(--felt, #301a6c) 55%, var(--dna-zv, #7b5bd6));
  --dna-surf2:color-mix(in srgb, var(--felt, #301a6c) 76%, var(--dna-zv, #7b5bd6));
  --dna-solid:color-mix(in srgb, var(--felt, #301a6c) 66%, var(--dna-zv, #7b5bd6));
  --dna-field:color-mix(in srgb, var(--felt, #301a6c) 74%, var(--dna-zv, #7b5bd6));
}
body{
  --dna-surf1:color-mix(in srgb, var(--felt, #301a6c) 55%, var(--dna-zv, #7b5bd6));
  --dna-surf2:color-mix(in srgb, var(--felt, #301a6c) 76%, var(--dna-zv, #7b5bd6));
  --dna-solid:color-mix(in srgb, var(--felt, #301a6c) 66%, var(--dna-zv, #7b5bd6));
  --dna-field:color-mix(in srgb, var(--felt, #301a6c) 74%, var(--dna-zv, #7b5bd6))}

/* 6a. panoul uneltei: plin, luminos, cu o lumina moale sus (ca la ritual) */
html body .screen[id^="s-"]:not(#dna1):not(#dna2):not(#dna3):not(#dna4):not(#dna5):not(#dna6) .thHero + div{
  background:radial-gradient(120% 50% at 50% -6%, rgba(255,255,255,.14), rgba(255,255,255,0) 62%),
    linear-gradient(180deg, var(--dna-surf1) 0%, var(--dna-surf2) 100%) !important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.14), 0 14px 34px rgba(0,0,0,.28) !important; border:0 !important}

/* 6b. containerele cu text care stau pe stele: fundal plin */
html body .screen:not(#dna1):not(#dna2):not(#dna3):not(#dna4):not(#dna5):not(#dna6) :is(.ghost, .mkGhost, .hsEndLib, .ghostB, .reinf, .zpMoreB){
  background:var(--dna-solid) !important; box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.30) !important}
html body :is(#s-belief, #s-goals):not(#dna1):not(#dna2):not(#dna3):not(#dna4):not(#dna5):not(#dna6) .hsSq{
  background:radial-gradient(120% 50% at 50% -6%, rgba(255,255,255,.14), rgba(255,255,255,0) 62%), linear-gradient(180deg, var(--dna-surf1), var(--dna-surf2)) !important}
html body #s-profile:not(#dna1):not(#dna2):not(#dna3):not(#dna4):not(#dna5):not(#dna6) :is(.subCard, .bigCard, .allItem){background:var(--dna-solid) !important}
html body #s-profile:not(#dna1):not(#dna2):not(#dna3):not(#dna4):not(#dna5):not(#dna6) :is(input, select, textarea, .hsTimeB){
  background:var(--dna-field) !important; color:#f5efe4 !important; border:0 !important; box-shadow:inset 0 0 0 1px rgba(255,255,255,.16) !important}
html body #s-revel:not(#dna1):not(#dna2):not(#dna3):not(#dna4):not(#dna5):not(#dna6) .rv3Host,
html body #s-hub:not(#dna1):not(#dna2):not(#dna3):not(#dna4):not(#dna5):not(#dna6) .hp3{background-color:var(--dna-solid) !important}

/* 6c. casetele si campurile din panou: mai deschise, ca randurile din ritual (panoul de dedesubt e plin, deci fara stele) */
html body .screen[id^="s-"]:not(#dna1):not(#dna2):not(#dna3):not(#dna4):not(#dna5):not(#dna6) .thHero + div :is(textarea, input[type="text"], input:not([type])){
  background:rgba(0,0,0,.16) !important; box-shadow:inset 0 0 0 1px rgba(255,255,255,.18) !important; border:0 !important}

/* 6d. casetele interioare care ramasesera fetru inchis (Minte, Small Wins, Manifest, Gratitude) devin randuri luminoase, ca in ritual */
html body .screen[id^="s-"]:not(#dna1):not(#dna2):not(#dna3):not(#dna4):not(#dna5):not(#dna6) .thHero + div :is(.mfSlide, .hsSq.grSq, .faChM, .faRows, .ppRows){
  background:linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.05)) !important; background-color:transparent !important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.14) !important; border:0 !important}
html body .screen[id^="s-"]:not(#dna1):not(#dna2):not(#dna3):not(#dna4):not(#dna5):not(#dna6) .thHero + div .hsPost{background:rgba(255,255,255,.05) !important}
html body :is(#s-belief, #s-goals):not(#dna1):not(#dna2):not(#dna3):not(#dna4):not(#dna5):not(#dna6) .hsSq .hsPlate{background:linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.05)) !important; box-shadow:inset 0 0 0 1px rgba(255,255,255,.14) !important}
html body :is(#s-belief, #s-goals):not(#dna1):not(#dna2):not(#dna3):not(#dna4):not(#dna5):not(#dna6) .hsSq :is(textarea, input){background:rgba(0,0,0,.16) !important; box-shadow:inset 0 0 0 1px rgba(255,255,255,.18) !important}

/* ---------- 7. 1532 [stated]: „go through all of the tools that have inner containers and remove the inner container... Just keep the outer container”
   + Weight partner: „make sure that the container is rounded” ----------
   Un singur container per unealta: panoul mare. Cutiile din interior (Minte: mkPanel, Small Wins: swPanel, Release/Big Goals: hsPlate,
   cadrul cardului din Gratitude) raman doar ca asezare, fara fundal, contur sau umbra. Campul de scris si butonul raman. */
html body .screen[id^="s-"]:not(#dna1):not(#dna2):not(#dna3):not(#dna4):not(#dna5):not(#dna6) .thHero + div{border-radius:30px !important}
html body .screen[id^="s-"]:not(#dna1):not(#dna2):not(#dna3):not(#dna4):not(#dna5):not(#dna6) .thHero + div :is(.mkPanel.mkFelt, .mkPanel, .swPanel.swFelt, .swPanel, .swSet2),
html body :is(#s-belief, #s-goals):not(#dna1):not(#dna2):not(#dna3):not(#dna4):not(#dna5):not(#dna6) .hsSq .hsPlate,
html body #s-grat:not(#dna1):not(#dna2):not(#dna3):not(#dna4):not(#dna5):not(#dna6) .thHero + div .hsPost{
  background:none !important; background-image:none !important; background-color:transparent !important;
  box-shadow:none !important; border:0 !important; padding-left:0 !important; padding-right:0 !important; outline:0 !important}
html body .screen[id^="s-"]:not(#dna1):not(#dna2):not(#dna3):not(#dna4):not(#dna5):not(#dna6) .thHero + div :is(.mkPanel, .swPanel)::before,
html body .screen[id^="s-"]:not(#dna1):not(#dna2):not(#dna3):not(#dna4):not(#dna5):not(#dna6) .thHero + div :is(.mkPanel, .swPanel)::after{display:none !important}
/* doua cutii una dupa alta (Messages: intro + lacat) se despart printr-o linie fina, nu prin doua containere */
html body .screen[id^="s-"]:not(#dna1):not(#dna2):not(#dna3):not(#dna4):not(#dna5):not(#dna6) .thHero + div :is(.mkPanel, .swPanel) + :is(.mkPanel, .swPanel){
  border-top:1px solid rgba(255,255,255,.14) !important; border-radius:0 !important; padding-top:18px !important; margin-top:18px !important}
