.dpMsg p{margin:0}
.histT{font-family:'Fraunces','Cormorant Garamond',serif; font-size:19px; font-weight:600;
  color:var(--catB); margin:26px 0 10px}
.histDay{display:flex; align-items:baseline; gap:9px; margin:18px 0 7px}
.histDay b{font-family:'Fraunces','Cormorant Garamond',serif; font-size:16px; color:var(--catB)}
.histDay i{font-style:normal; font-size:11.5px; opacity:.5}
.histItem{background:rgba(255,255,255,.045); border:1px solid rgba(255,255,255,.1); border-radius:14px;
  padding:12px 14px; margin-bottom:8px; cursor:pointer; transition:border-color .25s, background .25s}
.histItem.on{border-color:color-mix(in srgb, var(--catA) 45%, transparent);
  background:color-mix(in srgb, var(--catA) 7%, transparent)}
.histHead{display:flex; align-items:center; gap:9px}
.histHead span{flex:1; min-width:0; font-size:14.5px; line-height:1.45;
  overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical}
.histHead i{font-style:normal; font-size:11.5px; opacity:.5; flex:0 0 auto; white-space:nowrap}
.histHead svg{opacity:.5; flex:0 0 auto; transition:transform .25s}
.histItem.on .histHead svg{transform:rotate(180deg)}
.histBody{margin-top:11px; padding-top:11px; border-top:1px solid rgba(255,255,255,.09)}
.histBody b{display:block; font-size:10.5px; letter-spacing:.14em; text-transform:uppercase;
  color:var(--catA); margin-bottom:5px}
.histBody p{margin:0; line-height:1.65}

.dciRow{padding:9px 0}
.dciRow+.dciRow{border-top:1px solid rgba(255,255,255,.06)}
.dciTop{display:flex; align-items:baseline; justify-content:space-between; gap:10px; margin-bottom:7px}
.dciTop span{font-size:14.5px; font-weight:400}
.dciTop b{font-size:17px; color:var(--catB); font-variant-numeric:tabular-nums; min-width:22px; text-align:right}
.dciSl,.mtDciSl{-webkit-appearance:none; appearance:none; width:100%; height:3px; border-radius:99px; outline:none;
  background:linear-gradient(90deg, color-mix(in srgb, var(--catA) 45%, transparent), rgba(255,255,255,.12))}
.dciSl::-webkit-slider-thumb,.mtDciSl::-webkit-slider-thumb{-webkit-appearance:none; width:15px; height:15px; border-radius:50%;
  background:var(--catA); border:none; box-shadow:0 0 0 3px color-mix(in srgb, var(--catA) 22%, transparent); cursor:pointer}
.dciSl::-moz-range-thumb,.mtDciSl::-moz-range-thumb{width:15px; height:15px; border-radius:50%; background:var(--catA);
  border:none; box-shadow:0 0 0 3px color-mix(in srgb, var(--catA) 22%, transparent); cursor:pointer}
.dciSlW{position:relative; margin:12px 0 26px}
.dciSlW input{display:block}
.dciBub{position:absolute; top:13px; left:8px; transform:translateX(-50%); font-size:11.5px; color:var(--catB); font-variant-numeric:tabular-nums; pointer-events:none}
.dciHead{display:flex; align-items:center; gap:8px; margin:14px 0 4px; opacity:.55; font-size:11px;
  letter-spacing:.08em; text-transform:uppercase}
.dciHead span{flex:1}
.dciHead b,.dciHead i{min-width:52px; text-align:right; font-style:normal; font-weight:400; white-space:nowrap}
.dciLine{display:flex; align-items:center; gap:8px; padding:7px 0; font-size:14.5px}
.dciLine+.dciLine{border-top:1px solid rgba(255,255,255,.06)}
.dciLine span{flex:1}
.dciLine b{width:52px; text-align:right; color:var(--catB); font-variant-numeric:tabular-nums}
.dciLine i{width:52px; text-align:right; font-style:normal; opacity:.6; font-variant-numeric:tabular-nums}
.dciIdea{margin-top:10px; padding:11px 13px; border-radius:14px;
  background:color-mix(in srgb, var(--catA) 9%, transparent);
  border:1px solid color-mix(in srgb, var(--catA) 32%, transparent)}
.dciIdea b{display:block; color:var(--catB); font-size:13.5px; margin-bottom:3px}
.dciIdea span{font-size:14.5px}
/* ---- meniul cu trei puncte din coltul fiecarei unelte ---- */
.tmHost{position:absolute; top:0; right:0; z-index:5}
.tool .tmBtn{top:8px; right:8px; width:30px; height:30px; background:rgba(10,9,22,.42)}
.tool .tmMenu{top:42px; right:8px; min-width:158px}
.tmBtn{position:absolute; top:12px; right:12px; z-index:60; width:34px; height:34px; border-radius:50%;
  border:1px solid rgba(255,255,255,.16); background:rgba(12,10,26,.55); backdrop-filter:blur(7px);
  color:var(--catB); cursor:pointer; display:flex; align-items:center; justify-content:center; gap:3px;
  padding:0; -webkit-tap-highlight-color:transparent}
.tmBtn i{width:3px; height:3px; border-radius:50%; background:currentColor; display:block}
.tmMenu{position:absolute; top:52px; right:12px; z-index:61; min-width:172px; border-radius:14px; overflow:hidden;
  border:1px solid rgba(255,255,255,.14); background:rgba(16,13,32,.96); backdrop-filter:blur(10px);
  box-shadow:0 14px 40px rgba(0,0,0,.5)}
.tmMenu button{display:flex; align-items:center; gap:9px; width:100%; padding:12px 14px; background:none;
  border:0; border-bottom:1px solid rgba(255,255,255,.07); color:inherit; font-family:inherit; font-size:14px;
  text-align:left; cursor:pointer}
.tmMenu button:last-child{border-bottom:0}
/* optiunile din randul prins sus, in flux, nu ca dropdown */
.tmInline{display:flex; gap:8px; margin-top:10px; flex-wrap:wrap}
.tmInline button{flex:1 1 auto; min-width:104px; padding:9px 12px; border-radius:11px; cursor:pointer;
  border:1px solid color-mix(in srgb, var(--catA) 45%, transparent);
  background:color-mix(in srgb, var(--catA) 14%, transparent); color:inherit; font-family:inherit; text-align:center}
.tmInline button b{color:var(--catB); font-weight:600; font-size:13.5px}
.tmMenu button b{color:var(--catB); font-weight:600; font-size:14px}
/* ---- foaia de Info, pe tot ecranul ---- */
.tiOv{position:fixed; inset:0; z-index:400; background:rgba(8,7,18,.72); backdrop-filter:blur(6px);
  display:none; opacity:0; transition:opacity .22s ease}
.tiOv.on{display:block; opacity:1}
.tiSheet{position:absolute; inset:auto 0 0 0; margin:0 auto; width:calc(100% - 44px); max-width:386px; max-height:92vh; overflow-y:auto; border-radius:26px 26px 0 0;
  background:linear-gradient(180deg, color-mix(in srgb, var(--catC) 92%, transparent), #0b0a16 60%);
  border-top:1px solid color-mix(in srgb, var(--catA) 45%, transparent); padding:20px 20px 34px;
  transform:translateY(22px); transition:transform .3s cubic-bezier(.22,.7,.3,1)}
.tiOv.on .tiSheet{transform:translateY(0)}
.tiGrip{width:42px; height:4px; border-radius:99px; background:rgba(255,255,255,.22); margin:0 auto 16px}
.tiH{font-family:'Cormorant Garamond',serif; font-style:italic; font-weight:700; font-size:27px;
  line-height:1.15; color:var(--catB)}
.tiLbl{font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--catA);
  font-weight:600; margin:22px 0 8px}
.tiSheet ul{list-style:none; padding:0; margin:0}
.tiSheet li{position:relative; padding-left:18px; margin-bottom:9px; font-size:14.5px; line-height:1.6}
.tiSheet li:before{content:''; position:absolute; left:0; top:9px; width:6px; height:6px; border-radius:50%;
  background:var(--catA)}
.tiClose{width:100%; margin-top:26px; padding:13px; border-radius:99px; font-family:inherit; font-size:14px;
  font-weight:600; cursor:pointer; color:#0b0a16; border:0;
  background:linear-gradient(135deg, var(--catB), var(--catA))}
/* ---- unealta prinsa in capul paginii ---- */
.pinRow{position:relative; margin:12px 0 4px; border-radius:18px; overflow:hidden; cursor:pointer;
  min-height:76px; display:flex; align-items:stretch; background-size:cover; background-position:center 30%;
  border:1px solid color-mix(in srgb, var(--catA) 40%, transparent)}
.pinRow .pOv{position:absolute; inset:0; background:linear-gradient(90deg, rgba(10,9,22,.88) 40%, rgba(10,9,22,.35))}
.pinRow .pIn{position:relative; padding:14px 16px; width:100%; align-self:center}
.pinRow .pT{font-size:15.5px; font-weight:600; color:var(--catB)}
.pinRow .pS{font-size:13px; opacity:.8; margin-top:2px}
.deepSep{display:flex; align-items:center; gap:12px; margin:30px 0 4px}
#pinSep,#pinSep+#pinBox+.deepSep{margin:22px 0 8px}
.deepSep i{flex:1; height:1px; background:linear-gradient(90deg, transparent, color-mix(in srgb, var(--cat) 45%, transparent), transparent)}
.deepSep b{font-family:'Playfair Display','Fraunces',serif; font-size:16px; font-weight:700; letter-spacing:.18em; text-transform:uppercase;
  text-transform:uppercase; color:var(--cat); white-space:nowrap; transition:color .45s ease}
/* cardul de resurse printabile urmeaza culoarea categoriei alese */
.prCard{margin-top:16px; border-radius:18px; padding:16px 17px; cursor:pointer;
  background:color-mix(in srgb, var(--cat) 9%, transparent);
  border:1px solid color-mix(in srgb, var(--cat) 42%, transparent);
  transition:background .45s ease, border-color .45s ease}
.prCard b{font-size:15px; color:var(--cat); transition:color .45s ease}
.cTab{flex:1; padding:10px 6px; border-radius:999px;
  font-family:'Playfair Display',Georgia,serif; font-size:15px; font-weight:600;
  color:rgba(240,236,255,.62); background:rgba(255,255,255,.05);
  border:1px solid rgba(240,236,255,.20);
  cursor:pointer; transition:all .28s ease; -webkit-tap-highlight-color:transparent}
.cTab.on{background:#F4EFE2; border-color:transparent; color:#171327;
  box-shadow:0 0 22px -4px rgba(226,192,121,.7)}
#fvSky{display:none; position:fixed; inset:0; z-index:0; pointer-events:none; opacity:0;
  background-size:cover; background-position:top center;
  transition:opacity .5s ease, background-image .3s ease}
#fvSky.on{opacity:.55}
/* Tot blocul hero urca cu 20% din inaltimea lui, iar marginea de jos negativa
   trage dupa el si restul paginii, ca sa nu ramana gol. */
#fvHero{position:relative; z-index:0; width:calc(100% + 96px); margin:-14px -48px -17.2% -48px;
  transform:translateY(-10%);
  aspect-ratio:4/5.45; background-size:auto 120%; background-position:center bottom;
  /* singura masca ramasa: doar baza, ca imaginea sa intre in fetru fara linie */
  -webkit-mask-image:linear-gradient(to bottom,#000 0,#000 84%,rgba(0,0,0,.62) 92%,transparent 100%);
  mask-image:linear-gradient(to bottom,#000 0,#000 84%,rgba(0,0,0,.62) 92%,transparent 100%);
  transition:background-image .3s ease}
#fvHero.off{display:none}
/* Nicio masca si niciun val peste hero. Imaginea se vede curata, intreaga. */
#fvHero .fvHeroTxt{position:absolute; left:0; right:0; top:0; z-index:2;
  padding:0 40px; text-align:center}
#fvHero .verse .vLine{display:block; white-space:nowrap}
/* Mesajul zilei se asaza cuvant cu cuvant: fiecare cuvant iese din ceata,
   urca un pic si se limpezeste. Decalajul mic le leaga intr-o singura respiratie. */
#fvHero .verse .vch{animation:none; opacity:1; filter:none}
@keyframes vsWord{
  0%{opacity:0; filter:blur(12px); transform:translateY(9px) scale(.985); letter-spacing:.06em}
  60%{opacity:1; filter:blur(1.5px)}
  100%{opacity:1; filter:blur(0); transform:none; letter-spacing:0}
}
#fvHero .verse .vw2{display:inline-block; opacity:0; will-change:filter,transform;
  animation:vsWord 2.2s cubic-bezier(.17,.66,.22,1) both}
#fvHero .fvHeroTxt .greetHub{margin:0}
#fvHero .fvHeroTxt .verse{margin:0; padding:0 !important; font-family:'Playfair Display',serif;
  font-weight:700; color:#fff; font-size:var(--vSize,23px); line-height:1.36;
  letter-spacing:0; max-width:none}

/* ===== SALUTUL DE LA INTRARE =====
   Apare o singura data pe sesiune: 2s intra din blur, 3s sta, 2s iese in blur,
   apoi la secunda 7 apare mesajul zilei. La orice revenire pe home in aceeasi
   sesiune, salutul nu mai apare deloc si mesajul zilei e acolo din prima. */
@keyframes fvBlurIn{from{opacity:0; filter:blur(16px)} to{opacity:1; filter:blur(0)}}
@keyframes fvBlurOut{from{opacity:1; filter:blur(0)} to{opacity:0; filter:blur(16px)}}
#fvHero:not(.wlc) .greetHub, #fvHero.wlcDone .greetHub{display:none}
#fvHero.wlc .greetHub{animation:fvBlurIn 2s ease both, fvBlurOut 2s ease 5s both}
#fvHero.wlc:not(.wlcDone) .verse{display:none}
#fvHero.wlcDone .verse{opacity:1}
/* Cat timp popupul zilnic e pe ecran, mesajul zilei asteapta. Apare abia dupa Collect. */
#fvHero.hpHold .verse{display:none}
#s-hub .lpChip{width:100%; justify-content:center; margin:12px 0 0; padding:14px 18px; border-radius:18px}

/* ===== FELT UI: doua bannere din setul de fetru cusut =====
   Amandoua sunt puse ca border-image cu 9 felii, deci colturile si tivul auriu
   raman la marimea lor reala oricat s-ar intinde banda pe latime. */
:root{
  --fvCard:url(../img/fv-card.webp);
  --fvFillMind:url(../img/fv-fill-mind.webp);
  --fvFillBody:url(../img/fv-fill-body.webp);
  --fvFillSoul:url(../img/fv-fill-soul.webp);
  --fvPr:url(../img/x-fv-pr.webp);
  --fvShop:url(../img/x-fv-shop.webp);
  --fvCream:url(../img/fv-cream.webp);
  --fvOut:url(../img/fv-out.webp);
  --fvFill:var(--fvFillSoul);
  --fvFlame:url(../img/fv-flame.webp);
  --fvPill:url(../img/fv-pill.webp);
}
#hsStreakRow{display:none !important}
#hsStreakRow, #hsStreakRow *{color:#1b1730}
#hsStreakRow .st b{font-family:'Playfair Display',Georgia,serif; font-weight:700; font-size:13.5px}
#hsStreakRow .nx{color:rgba(27,23,48,.58) !important; opacity:1}
#hsStreakRow .nx *{color:#1b1730 !important; font-weight:700}
#hsStreakRow .st .bar{background:rgba(27,23,48,.14)}
#hsStreakRow .fl svg{stroke:#1b1730; color:#1b1730}
/* Life Path, varianta D: pastila mica in culoarea zonei, centrata pe rand,
   ca sa nu mai aiba aceeasi greutate ca banda de streak de deasupra. */
#s-hub .lpChip{background:none !important; box-shadow:none !important;
  border-radius:0 !important; padding:0 !important; margin:16px 0 0 !important;
  width:100% !important; min-height:20px; align-items:center; justify-content:center;
  color:#1b1730 !important;
  font-family:'Playfair Display',Georgia,serif; font-weight:700; font-size:18px; letter-spacing:0;
  border-style:solid !important; border-color:transparent !important; border-width:22px 30px !important;
  border-image-source:var(--fvCream); border-image-slice:64 fill; border-image-repeat:stretch; border-image-width:1}
#s-hub .lpChip::after{display:none}
#s-hub .lpChip{animation:none !important}
#s-hub .lpChip, #s-hub .lpChip *{color:#1b1730 !important; text-shadow:none}

/* pastila de fetru pe categorie, aleasa din data-cat de pe body */
body[data-cat="mind"]{--catFelt:#c3dcef; --fvFill:var(--fvFillMind)}
body[data-cat="body"]{--catFelt:#c8e2d4; --fvFill:var(--fvFillBody)}
body[data-cat="soul"]{--catFelt:#d5cef0; --fvFill:var(--fvFillSoul)}
.fvBtn, #s-hub .lpChip{white-space:nowrap}
.fvBtn{border-style:solid !important; border-color:transparent !important;
  border-width:22px 34px !important; border-radius:0 !important;
  background:none !important; box-shadow:none !important; padding:0 !important;
  border-image-slice:64 fill; border-image-repeat:stretch; border-image-width:1;
  font-family:'Playfair Display',Georgia,serif; font-weight:700;
  display:flex; align-items:center; justify-content:center; text-align:center;
  min-height:20px; cursor:pointer; -webkit-tap-highlight-color:transparent}
.fvBtn.fill{border-image-source:var(--fvFill); color:#1b1730}
.fvBtn.out{border-image-source:var(--fvOut); color:#efe9dc}
/* cele trei taburi Minte / Corp / Suflet */
.cTab{flex:1; border:0; background:none; padding:0; min-width:0}
.cTab, .cTab.on{border-style:solid !important; border-color:transparent !important;
  border-radius:0 !important; background:none !important; box-shadow:none !important; padding:0 !important;
  border-image-repeat:stretch; border-image-width:1;
  font-family:'Playfair Display',Georgia,serif; font-size:18px; font-weight:700;
  display:flex; align-items:center; justify-content:center; min-height:14px}
/* neselectat: cardul crem plin, aceeasi greutate ca activul, doar fara culoare */
.cTab{border-width:16px 21px !important; border-image-source:var(--fvCream); border-image-slice:64 fill;
  color:rgba(27,23,48,.55)}
.cTab.on{border-width:16px 21px !important; border-image-source:var(--fvFill); border-image-slice:64 fill;
  color:#1b1730}
/* butonul de ritual, sub imaginea hero */
/* Buton mic de fetru pentru a trimite mesajul zilei ca imagine */
/* Randul de sub mesaj: ritualul, mai ingust, si cele trei puncte alaturi. */
.ritRow{display:flex; align-items:center; gap:8px; margin:-10px 0 14px}
.ritRow #ritBtn{flex:1 1 auto; min-width:0; margin:0 !important}
/* Disc de fetru desenat special pentru butonul rotund, nu o pastila intinsa. */
.fvDots{flex:0 0 auto; width:72px; height:72px; align-self:center;
  display:flex; align-items:center; justify-content:center; gap:5px;
  padding:0; border:0; border-radius:50%; cursor:pointer;
  background-image:url(../img/css-fv-dots.webp); background-size:100% 100%;
  background-repeat:no-repeat; background-position:center; background-color:transparent;
  -webkit-tap-highlight-color:transparent}
.fvDots span{width:6px; height:6px; border-radius:50%; background:rgba(27,23,48,.7); flex:0 0 auto}
.fvDots:active{transform:scale(.96)}
/* Foaia cu optiuni, din aceeasi lume de fetru */
#fvMore{position:fixed; inset:0; z-index:120; display:none; align-items:flex-end; justify-content:center;
  padding:18px; background:rgba(8,7,18,.6); -webkit-backdrop-filter:blur(4px); backdrop-filter:blur(4px);
  opacity:0; transition:opacity .3s ease}
#fvMore.on{display:flex}
#fvMore.show{opacity:1}
#fvMore .fmCard{width:100%; max-width:390px; padding:4px 2px 2px; color:#1b1730;
  border-style:solid; border-color:transparent; border-width:36px 36px;
  border-image-source:var(--fvCard); border-image-slice:70 fill; border-image-repeat:stretch; border-image-width:1;
  transform:translateY(26px); opacity:0;
  transition:transform .45s cubic-bezier(.2,.8,.25,1), opacity .35s ease}
#fvMore.show .fmCard{transform:none; opacity:1}
#fvMore .fmRow{display:flex; align-items:center; justify-content:center; width:100%; cursor:pointer; white-space:nowrap;
  padding:0; background:none; border-style:solid; border-color:transparent; border-radius:0;
  border-width:19px 20px; min-height:16px; margin-bottom:9px;
  border-image-source:var(--fvCream); border-image-slice:64 fill; border-image-repeat:stretch; border-image-width:1;
  font-family:'Playfair Display',Georgia,serif; font-weight:700; font-size:15px; color:#1b1730; text-align:center;
  -webkit-tap-highlight-color:transparent}
#fvMore .fmRow span{display:block; width:100%; text-align:center}
#fvMore .fmRow:active{transform:scale(.985)}

#fvMore .fmRow.busy{opacity:.55; pointer-events:none}
#fvMore .fmClose{display:block; margin:2px auto 0; padding:8px 10px; background:none; border:0; cursor:pointer;
  font-size:12.5px; color:rgba(27,23,48,.55)}
#ritBtn{width:100%; margin:-10px 0 14px; font-size:25px; line-height:1;
  border-width:26px 30px !important; min-height:14px; align-items:center}
/* ---- Streak varianta C: flacara de fetru + traseu segmentat pe saptamana ---- */
#hsStreakRow .fl{width:30px; height:34px; flex:0 0 auto;
  background-size:contain; background-repeat:no-repeat; background-position:center}
#hsStreakRow .fl.dim{filter:saturate(.15) opacity(.45)}
#hsStreakRow .st{flex:1; min-width:0}
#hsStreakRow .st b{display:block; font-family:'Playfair Display',Georgia,serif; font-weight:700; font-size:13px; margin-bottom:6px}
#hsStreakRow .seg{display:flex; gap:5px; min-width:0}
#hsStreakRow .seg i{flex:1; height:13px; border-radius:4px; background:rgba(27,23,48,.13);
  transform:scaleX(.2); transform-origin:left center; opacity:.35;
  transition:transform .42s cubic-bezier(.22,.7,.3,1), background .42s ease, opacity .42s ease}
#hsStreakRow.go .seg i{transform:scaleX(1); opacity:1}
#hsStreakRow.go .seg i.on{background:var(--catA,#34d399)}
#hsStreakRow .pts{font-family:'Playfair Display',Georgia,serif; font-weight:900; font-size:16px;
  color:#1b1730; flex:0 0 auto; opacity:0; transform:translateY(6px) scale(.9);
  transition:opacity .5s ease, transform .5s cubic-bezier(.22,.7,.3,1)}
#hsStreakRow .hsX{flex:0 0 auto; width:26px; height:26px; margin-left:2px; border:0; padding:0;
  background:none; cursor:pointer; color:rgba(27,23,48,.5); display:none;
  align-items:center; justify-content:center; -webkit-tap-highlight-color:transparent}
#hsStreakRow.go .hsX{display:flex}
#hsStreakRow .hsX:active{transform:scale(.9)}
#hsStreakRow.go .pts{opacity:1; transform:none}