/* aplicatie.css — stiluri proprii lecției „Detectivul Matematic” (doar variabile de culoare).
   Toate clasele proprii au prefixul dm- (plus .fr pentru fracții și .an- pentru antrenament). */

/* ---------- fracția stivuită: numărătorul peste numitor ---------- */
.fr{display:inline-flex;flex-direction:column;align-items:center;vertical-align:middle;line-height:1.02;font-weight:800;margin:0 .08em;font-size:.92em}
.fr>b{font-weight:inherit;padding:0 .14em}
.fr>i{font-style:normal;border-top:.11em solid currentColor;padding:.04em .14em 0;align-self:stretch;text-align:center}
.fr .fr-l{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;text-decoration:none}
.fr.mare{font-size:calc(54px * var(--fs));font-family:var(--f-display)}
.fr.mare>b{color:var(--berry)} .fr.mare>i{color:var(--sky)}

/* ---------- elemente comune ale planșelor ---------- */
.plate :is(.dm-cov,.dm-fisa,.dm-pietre,.dm-seifp,.dm-ora,.dm-cit,.dm-urmep,.dm-biletp,.dm-kmp,.dm-trp,.dm-sirp,.dm-susp){
  background:var(--card);color:var(--ink);border-radius:12px;padding:12px 14px;font-weight:800}
.plate svg{display:block}
.dm-eq{margin:6px 0 0;text-align:center;font-size:calc(20px * var(--fs))}
.dm-eq b{color:var(--leaf-deep)}
.dm-mic{margin:6px 0 0;text-align:center;color:var(--muted);font-size:calc(14px * var(--fs));line-height:1.35}
.dm-mic b{color:var(--ink)}
/* ștampila „DOVADĂ” apare pe planșă când stația dă o dovadă */
.view.dm-ok .plate{position:relative}
.view[id="v-s3"].dm-ok .plate::after,.view[id="v-s5"].dm-ok .plate::after,.view[id="v-s6"].dm-ok .plate::after,.view[id="v-s7"].dm-ok .plate::after,
.view[id="v-s9"].dm-ok .plate::after,.view[id="v-s11"].dm-ok .plate::after,.view[id="v-s12"].dm-ok .plate::after{
  content:"DOVADĂ ✓";position:absolute;bottom:8px;right:14px;z-index:2;padding:3px 12px;border:3px solid var(--berry);border-radius:10px;
  color:var(--berry);background:var(--card);font-family:var(--f-display);font-weight:900;font-size:calc(15px * var(--fs));letter-spacing:.06em;
  transform:rotate(-8deg);animation:dm-stampila .5s ease-out both;pointer-events:none}
@keyframes dm-stampila{0%{opacity:0;transform:rotate(-8deg) scale(2.2)}70%{opacity:1;transform:rotate(-8deg) scale(.92)}100%{transform:rotate(-8deg)}}

/* ---------- coperta: sala muzeului (CSS 3D ușor) ---------- */
.dm-cov{padding:12px!important}
.dm-room{position:relative;height:calc(230px * var(--fs));perspective:700px;overflow:hidden;border-radius:10px;background:var(--sky-tint)}
.dm-wall{position:absolute;left:0;right:0;top:0;height:58%;background:linear-gradient(180deg,var(--sky-tint),var(--card))}
.dm-it-ceas{position:absolute!important;left:7%;top:10%}
.dm-it-harta{position:absolute!important;right:6%;top:10%}
.dm-floor{position:absolute;left:0;right:0;bottom:-8%;height:62%;transform:rotateX(62deg);transform-origin:50% 100%;
  background:repeating-linear-gradient(90deg,var(--line) 0 2px,transparent 2px 40px),repeating-linear-gradient(0deg,var(--line) 0 2px,var(--sun-tint) 2px 40px)}
.dm-it{position:relative;transition:transform .45s,filter .45s,opacity .45s;opacity:.55}
.dm-it.on{opacity:1;transform:translateY(-4px) scale(1.06);filter:drop-shadow(0 0 10px var(--sun))}
.dm-cov.static .dm-it{transform:none}
.dm-it-ceas .dm-ceas{width:calc(80px * var(--fs))}
.dm-it-harta svg{width:calc(116px * var(--fs))}
.dm-hm-bg{fill:var(--leaf-tint);stroke:var(--leaf-deep);stroke-width:2}
.dm-hm-drum{fill:none;stroke:var(--berry);stroke-width:3;stroke-dasharray:6 4}
.dm-hm-drum2{fill:none;stroke:var(--muted);stroke-width:2;stroke-dasharray:3 4}
.dm-hm-pt{fill:var(--sky)} .dm-hm-fin{fill:var(--berry)}
.dm-it-seif{position:absolute!important;left:36%;bottom:8%}
.dm-seif{position:relative;display:block;width:calc(92px * var(--fs));height:calc(92px * var(--fs));transform-style:preserve-3d}
.dm-seif-front{position:absolute;inset:0;border-radius:8px;background:var(--muted);border:3px solid var(--ink);display:grid;place-items:center}
.dm-seif-side{position:absolute;top:6px;right:-18px;width:18px;height:100%;background:var(--ink);transform:skewY(-30deg);border-radius:0 6px 6px 0;opacity:.75}
.dm-seif-top{position:absolute;top:-12px;left:8px;width:100%;height:12px;background:var(--line);transform:skewX(-55deg);border-radius:4px 4px 0 0}
.dm-seif-dial{width:46%;aspect-ratio:1;border-radius:50%;background:conic-gradient(var(--sun) 0 10%,var(--card) 10% 50%,var(--line) 50%);border:3px solid var(--ink);
  animation:dm-roteste 7s steps(10) infinite}
.dm-seif-nr{position:absolute;bottom:4px;font-size:calc(11px * var(--fs));color:var(--card);letter-spacing:.1em}
@keyframes dm-roteste{to{transform:rotate(360deg)}}
.dm-ped{position:absolute;right:12%;bottom:8%;display:flex;flex-direction:column;align-items:center}
.dm-ped-glass{width:calc(56px * var(--fs));height:calc(56px * var(--fs));border:3px solid var(--sky);border-radius:8px 8px 2px 2px;background:var(--card);
  display:grid;place-items:center;font-family:var(--f-display);font-size:calc(34px * var(--fs));color:var(--berry);opacity:.9}
.dm-ped-col{width:calc(70px * var(--fs));height:calc(34px * var(--fs));background:var(--line);border:3px solid var(--muted);border-radius:4px}
.dm-cov-list{list-style:none;margin:10px 0 0;padding:0;display:grid;gap:4px}
.dm-cov-list li{display:flex;gap:10px;align-items:center;padding:4px 10px;border-radius:10px;font-size:calc(16px * var(--fs));opacity:.45;transition:opacity .45s,background .45s}
.dm-cov-list li b{min-width:6.6em}
.dm-cov-list li.on{opacity:1;background:var(--sun-tint)}

/* ---------- stația 1: fișa cazului ---------- */
.dm-fisa-h{display:flex;justify-content:space-between;align-items:center;border-bottom:3px dashed var(--line);padding-bottom:6px;margin-bottom:8px;font-family:var(--f-display);font-size:calc(20px * var(--fs))}
.dm-fisa-h span{color:var(--berry);border:2px solid var(--berry);border-radius:8px;padding:0 8px;font-size:calc(13px * var(--fs));transform:rotate(-4deg)}
.dm-fisa-l{margin:4px 0;font-size:calc(16px * var(--fs));color:var(--muted)}
.dm-fisa-l b{color:var(--ink)}
.dm-fisa-r{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:8px;padding:8px 12px;border-radius:10px;font-size:calc(17px * var(--fs))}
.dm-fisa-r span{font-weight:700;color:var(--muted);font-size:calc(15px * var(--fs))}
.dm-r1{background:var(--sky-tint)} .dm-r2{background:var(--berry-tint)} .dm-r3{background:var(--card);border:2px dashed var(--line)}

/* ---------- stația 2: cutiile cu pietre ---------- */
.dm-pietre{display:flex;align-items:center;gap:16px;justify-content:center}
.dm-pietre svg{width:calc(190px * var(--fs));flex:0 0 auto}
.dm-cut{fill:var(--sun-tint);stroke:var(--sun-edge);stroke-width:2}
.dm-cut-n{fill:var(--sun-ink);font-size:12px;font-weight:900;text-anchor:middle}
.dm-gem{fill:var(--sky);stroke:var(--ink);stroke-width:1;animation:dm-sclipeste 2.4s var(--d) infinite}
@keyframes dm-sclipeste{0%,80%,100%{opacity:1}90%{opacity:.4}}
.dm-pietre-t p{margin:4px 0;font-size:calc(18px * var(--fs))}
.dm-pietre-t p b{color:var(--berry)}
.dm-pietre-t .dm-eq{text-align:left;font-size:calc(24px * var(--fs))}
.dm-pietre-t .dm-mic{text-align:left}

/* calcul în coloană: semnul la dreapta primului număr, linia sub al doilea */
.dm-col{--w:1.05em;display:inline-grid;grid-template-columns:repeat(var(--n),var(--w)) var(--w);font-family:var(--f-display);font-size:calc(34px * var(--fs));line-height:1.12;color:var(--ink)}
.dm-col>span{display:flex;align-items:center;justify-content:center;min-width:0}
.dm-col-h{font-size:.42em;font-weight:900;border-radius:6px 6px 0 0}
.dm-col-h.dm-o0{color:var(--leaf-deep);background:var(--leaf-tint)}
.dm-col-h.dm-o1{color:var(--sky);background:var(--sky-tint)}
.dm-col-h.dm-o2{color:var(--berry);background:var(--berry-tint)}
.dm-col .dm-col-h:empty,.dm-col .dm-col-h+.dm-semn{background:none}
.dm-semn{color:var(--berry)}
.dm-col-r{border-top:4px solid var(--ink);color:var(--leaf-deep)}

/* ---------- stația 3: seiful din planșă (se deschide la dovadă) ---------- */
.dm-seifp{display:flex;align-items:center;justify-content:space-around;gap:14px}
.dm-seifp-t{text-align:center}
.dm-seif3d{position:relative;width:calc(130px * var(--fs));height:calc(130px * var(--fs));perspective:500px;flex:0 0 auto}
.dm-s3-side{position:absolute;top:8px;right:-16px;width:16px;height:100%;background:var(--ink);transform:skewY(-30deg);opacity:.7;border-radius:0 6px 6px 0}
.dm-s3-in{position:absolute;inset:0;border-radius:10px;background:var(--sun-tint);border:4px solid var(--ink);display:grid;place-items:center;font-size:calc(44px * var(--fs))}
.dm-s3-usa{position:absolute;inset:0;border-radius:10px;background:var(--muted);border:4px solid var(--ink);display:grid;place-items:center;
  transform-origin:0 50%;transition:transform 1s cubic-bezier(.3,1.4,.5,1);backface-visibility:hidden}
.dm-s3-dial{width:52%;aspect-ratio:1;border-radius:50%;border:4px solid var(--ink);background:conic-gradient(var(--sun) 0 8%,var(--card) 8%)}
.view.dm-ok .dm-s3-usa{transform:rotateY(-78deg)}

/* ---------- stația 4: ora + banda de timp ---------- */
.dm-ora{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:6px 14px}
.dm-ora .dm-tl{width:100%}
.dm-ora-t{grid-column:1/-1;margin:0;text-align:center;font-size:calc(18px * var(--fs))}
.dm-ora-t b{color:var(--berry)}
.dm-ceas-m{width:calc(130px * var(--fs))}
.dm-tl-ax{stroke:var(--ink);stroke-width:3}
.dm-tl-a1,.dm-tl-a2{fill:none;stroke-width:4;stroke-linecap:round}
.dm-tl-a1{stroke:var(--sky)} .dm-tl-a2{stroke:var(--berry)}
.dm-tl-s1,.dm-tl-s2,.dm-tl-o{font-size:17px;font-weight:900;text-anchor:middle}
.dm-tl-s1{fill:var(--sky)} .dm-tl-s2{fill:var(--berry)} .dm-tl-o{fill:var(--ink)}
.dm-tl-p{fill:var(--card);stroke:var(--ink);stroke-width:3}
.dm-tl-fin{fill:var(--leaf);stroke:var(--leaf-deep)} .dm-tl-ofin{fill:var(--leaf-deep)}

/* ceasul analogic */
.dm-ceas{display:block;flex:0 0 auto}
.dm-c-fata{fill:var(--card);stroke:var(--ink);stroke-width:3}
.dm-c-t{stroke:var(--muted);stroke-width:1}
.dm-c-T{stroke:var(--ink);stroke-width:2.4}
.dm-c-n{fill:var(--ink);font-size:13px;font-weight:900;text-anchor:middle;font-family:var(--f-display)}
.dm-c-ora,.dm-c-min{stroke-linecap:round;transform-origin:60px 60px;transition:transform 1.1s ease-in-out}
.dm-c-ora{stroke:var(--berry);stroke-width:5}
.dm-c-min{stroke:var(--sky);stroke-width:3.5}
.dm-c-fan{opacity:.25;transition:none}
.dm-c-ax{fill:var(--ink)}

/* ---------- stația 5: cum citim cadranul ---------- */
.dm-cit{display:flex;align-items:center;gap:16px}
.dm-cit-t p{margin:6px 0;font-size:calc(16px * var(--fs));line-height:1.35;font-weight:700}
.dm-cit-t b{font-weight:900}
.dm-ac{display:inline-block;width:22px;height:5px;border-radius:3px;vertical-align:middle;margin-right:8px}
.dm-ac-o{background:var(--berry)} .dm-ac-m{background:var(--sky);height:3px;width:30px}
.dm-dig{display:inline-block;font-family:var(--f-display);font-size:calc(30px * var(--fs))!important;padding:0 14px!important;border-radius:10px;background:var(--head);color:var(--on-head);letter-spacing:.06em}

/* ---------- stația 6: urmele pe marginea covorului ---------- */
.dm-urmep svg{width:100%;max-width:calc(330px * var(--fs));margin:0 auto}
.dm-covor{fill:var(--berry-tint);stroke:var(--berry);stroke-width:3}
.dm-lat{fill:var(--ink);font-size:20px;font-weight:900;text-anchor:middle}
.dm-lat2{text-anchor:end}
.dm-urma{fill:var(--ink);opacity:1;animation:dm-pas 3.4s var(--d) infinite}
@keyframes dm-pas{0%{opacity:.15}8%{opacity:1}100%{opacity:1}}
.view.dm-ok .dm-urma{fill:var(--leaf-deep)}

/* ---------- stația 7: biletul rupt (bucățile se lipesc la dovadă) ---------- */
.dm-bilet{display:flex;justify-content:center;gap:18px;transition:gap .8s ease-out}
.dm-bilet svg{width:calc(136px * var(--fs))}
.dm-b-st{transform:rotate(-3deg);transition:transform .8s} .dm-b-dr{transform:rotate(3deg) translateY(6px);transition:transform .8s}
.view.dm-ok .dm-bilet{gap:0} .view.dm-ok .dm-b-st,.view.dm-ok .dm-b-dr{transform:none}
.dm-b-col{fill:var(--sun);stroke:var(--ink);stroke-width:2}
.dm-b-gol{fill:var(--card);stroke:var(--ink);stroke-width:2}
.dm-b-rupt{fill:none;stroke:var(--muted);stroke-width:2}
.dm-b-fr{display:flex;align-items:center;justify-content:center;gap:18px;margin-top:10px}
.dm-b-fr p{margin:4px 0;font-size:calc(17px * var(--fs))}
.dm-c1{color:var(--berry)} .dm-c2{color:var(--sky)}

/* ---------- stația 8: un kilometru ---------- */
.dm-kmp svg{width:100%;max-width:calc(420px * var(--fs));margin:0 auto}
.dm-km-s0{fill:var(--sky);stroke:var(--ink);stroke-width:1.5} .dm-km-s1{fill:var(--sky-tint);stroke:var(--ink);stroke-width:1.5}
.dm-km-t{fill:var(--ink);font-size:13px;font-weight:800;text-anchor:middle}
.dm-km-b{fill:var(--berry);font-size:14px;font-weight:900;text-anchor:middle}

/* ---------- stația 9: exemplul de traseu ---------- */
.dm-trp{text-align:center}
.dm-tr-r{margin:0 0 8px;font-size:calc(17px * var(--fs))}
.dm-tr-r span{display:inline-block;background:var(--sun-tint);color:var(--sun-ink);border-radius:999px;padding:0 10px;margin:0 2px;font-size:calc(15px * var(--fs))}

/* ---------- stația 11: șirul ---------- */
.dm-sirp svg{width:100%;max-width:calc(420px * var(--fs));margin:0 auto}
.dm-sir-arc{fill:none;stroke:var(--sky);stroke-width:3}
.dm-sir-d{fill:var(--sky);font-size:15px;font-weight:900;text-anchor:middle}
.dm-sir-ult{stroke:var(--berry)} text.dm-sir-ult{fill:var(--berry);stroke:none}
.dm-sir-b{fill:var(--sun-tint);stroke:var(--sun-edge);stroke-width:2}
.dm-sir-q{fill:var(--berry-tint);stroke:var(--berry);stroke-dasharray:5 3}
.dm-sir-n{fill:var(--ink);font-size:20px;font-weight:900;text-anchor:middle}

/* ---------- stația 12: suspecții și drumul înapoi ---------- */
.dm-su-r{display:flex;justify-content:center;gap:14px}
.dm-su{display:flex;flex-direction:column;align-items:center;width:calc(84px * var(--fs));padding:6px 4px;border:3px solid var(--line);border-radius:12px;background:var(--sky-tint);transition:border-color .5s,background .5s}
.dm-su-om{font-size:calc(34px * var(--fs));line-height:1.1;filter:grayscale(1)}
.dm-su b{font-family:var(--f-display);font-size:calc(20px * var(--fs))}
.dm-su small{color:var(--muted);font-weight:800}
.view.dm-ok .dm-su-hot{border-color:var(--berry);background:var(--berry-tint);animation:dm-pop .5s ease-out}
.dm-inv{margin-top:10px;display:grid;gap:4px;justify-items:center}
.dm-inv p{margin:0;font-size:calc(19px * var(--fs))}
.dm-inv i{font-style:normal;background:var(--sky-tint);color:var(--sky);border-radius:8px;padding:0 8px}
.dm-inv-b i{background:var(--berry-tint);color:var(--berry)}
.dm-q{display:inline-block;min-width:1.4em;text-align:center;border:2px dashed var(--berry);border-radius:8px;color:var(--berry)}
.dm-inv-b>b:first-child{color:var(--leaf-deep)}

/* ---------- Dosarul cazului (sub planșa fiecărei stații) ---------- */
.dm-dosar{background:var(--card);color:var(--ink);border:2px solid var(--line);border-radius:14px;padding:8px 12px;box-shadow:var(--shadow)}
.dm-d-top{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:calc(14px * var(--fs));font-weight:800;color:var(--muted)}
.dm-d-top>b{color:var(--ink)}
.dm-d-nr{color:var(--berry);font-size:1.15em}
.dm-d-sl{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px;margin-top:6px}
.dm-slot{display:flex;flex-direction:column;align-items:center;gap:1px;padding:4px 2px;border:2px dashed var(--line);border-radius:10px;min-width:0}
.dm-slot i{font-style:normal;font-size:calc(20px * var(--fs));line-height:1.15;filter:grayscale(1);opacity:.35}
.dm-slot small{font-size:calc(11px * var(--fs));font-weight:800;color:var(--muted);line-height:1.1;text-align:center;overflow-wrap:anywhere}
.dm-slot.gasit{border-style:solid;border-color:var(--leaf);background:var(--leaf-tint)}
.dm-slot.gasit i{filter:none;opacity:1}
.dm-slot.gasit small{color:var(--leaf-deep)}
.dm-slot.nou{animation:dm-gasit .9s ease-out}
@keyframes dm-gasit{0%{transform:scale(.4) rotate(-20deg)}55%{transform:scale(1.12) rotate(4deg);box-shadow:0 0 0 4px var(--sun)}100%{transform:none}}
.dm-d-su{display:flex;align-items:center;gap:8px;margin-top:6px;flex-wrap:wrap}
.dm-sus{display:inline-flex;align-items:center;gap:4px;padding:2px 8px;border-radius:999px;background:var(--sky-tint);border:2px solid var(--line);font-size:calc(13px * var(--fs))}
.dm-sus i{font-style:normal;filter:grayscale(1)}
.dm-sus-n{display:none}
.dm-d-msg{flex:1 1 180px;margin:0;font-size:calc(12px * var(--fs));color:var(--muted);font-weight:700;line-height:1.25}
.dm-dosar.rezolvat .dm-sus-n{display:inline;font-weight:800}
.dm-dosar.rezolvat .dm-sus{opacity:.55}
.dm-dosar.rezolvat .dm-sus.dm-hot{opacity:1;border-color:var(--berry);background:var(--berry-tint);animation:dm-pop .6s ease-out}
.dm-dosar.rezolvat .dm-d-msg{color:var(--ink);flex-basis:100%;font-size:calc(13px * var(--fs))}
.dm-dosar.rezolvat .dm-d-msg b{color:var(--berry)}
@keyframes dm-pop{0%{transform:scale(.6)}70%{transform:scale(1.12)}100%{transform:none}}

/* ---------- laboratoare: elemente comune ---------- */
.dm-made{display:flex;gap:6px;flex-wrap:wrap;justify-content:center;flex:1}
.dm-gata{background:var(--leaf-tint);color:var(--leaf-deep);border:2px solid var(--leaf);border-radius:999px;padding:0 10px;font-weight:800;font-size:calc(14px * var(--fs));animation:dm-pop .35s ease-out}
.dm-act{display:flex;gap:12px;justify-content:space-between;align-items:center;flex-wrap:wrap;margin-top:6px;padding-top:8px;border-top:2px dashed var(--line)}
.dm-act .verif{margin-left:auto}
.dm-act .verif:disabled{opacity:.45;box-shadow:none;cursor:not-allowed}
@keyframes dm-scutura{0%,100%{transform:none}25%{transform:translateX(-6px)}75%{transform:translateX(6px)}}

/* ---------- laborator: seiful ---------- */
.dm-sf-top,.dm-co-top,.dm-tr-top{display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap;font-weight:800;color:var(--muted);font-size:calc(14px * var(--fs))}
.dm-sf-lac{font-size:calc(20px * var(--fs))}
.dm-sf-row{display:flex;align-items:center;gap:16px;margin-top:4px}
.dm-sf-dw{flex:0 0 auto;width:calc(140px * var(--fs))}
.dm-sf-dw.deschis{animation:dm-pop .6s ease-out}
.dm-sf-dial{width:100%}
.dm-sf-ring{fill:var(--muted);stroke:var(--ink);stroke-width:3}
.dm-sf-rot{transform-origin:80px 80px;transition:transform .35s ease-out}
.dm-sf-c{fill:var(--card);font-size:19px;font-weight:900;text-anchor:middle;font-family:var(--f-display);transform-box:fill-box;transform-origin:center;transition:transform .35s ease-out}
.dm-sf-c.on{fill:var(--sun)}
.dm-sf-tk{stroke:var(--card);stroke-width:2}
.dm-sf-hub{fill:var(--ink);stroke:var(--sun);stroke-width:3}
.dm-sf-hubt{fill:var(--sun);font-size:22px;text-anchor:middle}
.dm-sf-ptr{fill:var(--berry);stroke:var(--card);stroke-width:1.5}
.dm-sf-calc{flex:1;min-width:0;display:grid;gap:6px;justify-items:center}
.dm-sf-eq{margin:0;font-family:var(--f-display);font-size:calc(32px * var(--fs));color:var(--ink);line-height:1.1}
.dm-sf-eq b{color:var(--berry)}
.dm-sf-aj{margin:0;font-size:calc(13px * var(--fs));color:var(--muted);font-weight:800;text-align:center}
.dm-sf-cod{display:flex;gap:8px}
.dm-sf-cod span{width:calc(44px * var(--fs));height:calc(52px * var(--fs));display:flex;align-items:center;justify-content:center;border:3px dashed var(--line);border-radius:10px;
  background:var(--card);font-family:var(--f-display);font-size:calc(30px * var(--fs));color:var(--ink)}
.dm-sf-cod span.urm{border-color:var(--sun-edge);background:var(--sun-tint)}
.dm-sf-cod span.plin{border-style:solid;border-color:var(--sky);animation:dm-pop .3s ease-out}
.dm-sf-cod span.bun{border-color:var(--leaf);background:var(--leaf-tint);color:var(--leaf-deep)}
.dm-sf-cod.rau{animation:dm-scutura .45s}
.dm-sf-ctrl{display:flex;align-items:center;gap:12px}
.dm-sf-ctrl .btn{min-width:calc(56px * var(--fs));min-height:calc(46px * var(--fs));font-size:calc(20px * var(--fs));padding:4px 10px}
.dm-sf-cif{min-width:1.6em;text-align:center;font-family:var(--f-display);font-size:calc(30px * var(--fs));color:var(--sun-ink);background:var(--sun-tint);border-radius:10px}

/* ---------- laborator: ceasul oprit ---------- */
.dm-co-q{margin:4px 0 6px;font-size:calc(16px * var(--fs));font-weight:700;color:var(--ink);line-height:1.35}
.dm-co-q b{color:var(--berry)}
.dm-co-row{display:flex;align-items:center;justify-content:center;gap:22px}
.dm-ceas-lab{width:calc(128px * var(--fs))}
.dm-co-dig{display:flex;align-items:center;gap:6px;padding:8px 12px;border-radius:14px;background:var(--head)}
.dm-co-dig.rau{animation:dm-scutura .45s}
.dm-co-col{display:flex;flex-direction:column;align-items:center;gap:6px}
.dm-co-col small{color:var(--on-head);font-weight:800;font-size:calc(12px * var(--fs));opacity:.8}
.dm-co-v{min-width:2.1em;text-align:center;font-family:var(--f-display);font-size:calc(34px * var(--fs));line-height:1;color:var(--on-head);font-variant-numeric:tabular-nums}
.dm-co-sep{font-family:var(--f-display);font-size:calc(34px * var(--fs));color:var(--on-head);padding-bottom:calc(18px * var(--fs))}
.dm-co-dig .btn{min-width:calc(54px * var(--fs));min-height:calc(32px * var(--fs));padding:0 10px;font-size:calc(15px * var(--fs))}
.dm-co-col{gap:4px!important}

/* ---------- laborator: traseul pe hartă ---------- */
.dm-tr-tinta{color:var(--ink)} .dm-tr-tinta b{color:var(--berry)}
.dm-tr-svg{display:block;width:100%;max-height:calc(196px * var(--fs));margin-top:4px;border-radius:12px;background:var(--leaf-tint)}
.dm-tr-l{stroke:var(--muted);stroke-width:5;stroke-linecap:round;opacity:.55}
.dm-tr-l.ales{stroke:var(--berry);stroke-width:7;opacity:1}
.dm-tr-svg.gata .dm-tr-l.ales{stroke:var(--leaf-deep);stroke-dasharray:420;animation:dm-deseneaza 1s ease-out}
@keyframes dm-deseneaza{from{stroke-dashoffset:420}to{stroke-dashoffset:0}}
.dm-tr-et rect{fill:var(--card);stroke:var(--line);stroke-width:2}
.dm-tr-et text{fill:var(--ink);font-size:13px;font-weight:900;text-anchor:middle}
.dm-tr-et.ales rect{fill:var(--berry-tint);stroke:var(--berry)}
.dm-tr-n{cursor:pointer;outline:none}
.dm-tr-n circle{fill:var(--card);stroke:var(--ink);stroke-width:3;transition:fill .2s}
.dm-tr-n.poate circle{stroke:var(--sun-edge);stroke-width:4;stroke-dasharray:5 3}
.dm-tr-n.ales circle{fill:var(--sun);stroke:var(--sun-edge)}
.dm-tr-n:hover circle,.dm-tr-n:focus-visible circle{stroke:var(--sky);stroke-width:5}
.dm-tr-ic{font-size:18px;text-anchor:middle;pointer-events:none}
.dm-tr-nm{fill:var(--ink);font-size:14px;font-weight:900;text-anchor:middle;paint-order:stroke;stroke:var(--leaf-tint);stroke-width:4px}
.dm-tr-drum{margin:6px 0 0;font-size:calc(15px * var(--fs));color:var(--muted);font-weight:700;text-align:center}
.dm-tr-drum b{color:var(--ink)}

/* ---------- laborator: antrenament rapid ---------- */
.an-top{display:flex;align-items:center;gap:10px;font-weight:800;color:var(--muted);font-size:calc(14px * var(--fs))}
.an-bar{flex:1;height:10px;background:var(--line);border-radius:99px;overflow:hidden}
.an-bar i{display:block;height:100%;background:var(--leaf);transition:width .4s}
.an-serie.aprinsa{color:var(--berry);animation:dm-pop .4s ease-out}
.an-q{font-size:calc(22px * var(--fs));font-weight:800;margin:14px 0;color:var(--ink);text-align:center;line-height:1.35}
.an-var{justify-content:center}
.an-var .chip{font-size:calc(19px * var(--fs));min-width:6em;min-height:calc(52px * var(--fs))}
.an-msg{min-height:2.6em;margin:8px 0 0;text-align:center;font-weight:800;line-height:1.3}
.an-msg.bine{color:var(--leaf-deep)} .an-msg.rau{color:var(--berry)}
.an-final{text-align:center}
.an-scor{font-family:var(--f-display);font-size:calc(54px * var(--fs));color:var(--leaf-deep);animation:dm-pop .5s}

/* stația 1: problema din dosar se citește ca o notă a detectivului */
#v-s1 .task .hint{font-size:calc(17px * var(--fs));color:var(--ink);font-weight:700;background:var(--sun-tint);border-left:5px solid var(--sun-edge);border-radius:8px;padding:6px 10px;line-height:1.35}

/* telefon (pagina se derulează) */
html.flow .dm-d-sl{grid-template-columns:repeat(4,minmax(0,1fr))}
html.flow .dm-sf-row,html.flow .dm-co-row{flex-wrap:wrap;justify-content:center}
html.flow .dm-pietre,html.flow .dm-cit,html.flow .dm-seifp{flex-wrap:wrap}
html.flow .dm-ora{grid-template-columns:1fr;justify-items:center}
html.flow .dm-it-seif{left:20%}

/* mișcare redusă (sistem) și „fără animații”: stare statică completă (toate urmele, pietrele, dovezile se văd) */
@media (prefers-reduced-motion: reduce){
  .dm-seif-dial,.dm-gem,.dm-urma,.dm-slot.nou,.dm-sf-dw.deschis,.dm-gata,.an-scor,.an-serie,.dm-tr-svg.gata .dm-tr-l.ales,.view.dm-ok .plate::after{animation:none!important}
  .dm-c-ora,.dm-c-min,.dm-sf-rot,.dm-sf-c,.dm-s3-usa,.dm-bilet,.dm-b-st,.dm-b-dr,.dm-it{transition:none!important}
}
html.a-still .dm-urma,html.a-still .dm-gem{opacity:1}

/* Butonul „Verifică” din bara de jos este ascuns; verificarea se deschide din cuprins sau după ultima stație. */
.bottom #checkBtn{display:none!important}

/* ===== aliniere comună (lecțiile refăcute): fără suprapuneri de butoane și text ===== */
/* plasă de siguranță: dacă o stație e mai înaltă decât scena, se derulează în interior, nu intră sub bara de jos */
html:not(.flow) .view.on{overflow-y:auto;overflow-x:hidden;scrollbar-width:thin}
/* ordonare: toate cartonașele pe un rând, loc pentru bulina cu numărul, textul rămâne în cartonaș */
.task .order{grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);grid-template-columns:none;gap:10px;margin-top:16px}
.task .order .ocard{min-width:0;padding:10px 6px 8px;overflow-wrap:anywhere;hyphens:auto}
.task .order .oc-emoji{font-size:2.1em;line-height:1.1}
.task .order .ocard .lab{font-size:calc(14px * var(--fs));line-height:1.2}
.task .order .ocard .more{font-size:calc(12px * var(--fs));line-height:1.2;color:var(--muted)}
.task .order .ocard .badge{top:-14px;left:-8px}
html.flow .task .order{grid-auto-flow:row;grid-template-columns:repeat(2,minmax(0,1fr))}
/* perechi: bulina cu numărul stă pe același rând cu textul, deci butonul nu crește după rezolvare */
.perechi .chip{display:flex;align-items:center;gap:8px;min-width:0;overflow-wrap:anywhere}
.perechi .chip[data-p]::after{flex:0 0 22px}
/* rânduri de butoane: se rup pe rândul următor în loc să se calce */
.grp,.chips,.actions{flex-wrap:wrap;row-gap:10px}
.chip,.btn{max-width:100%}
.btn{white-space:normal}