/* styles for area releve */
.rel-ell{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}

/* summary + progress ring */
.rel-sum{display:flex;flex-direction:column;gap:14px}
.rel-sumrow{display:flex;align-items:center;gap:14px;min-width:0}
.rel-sumtx{flex:1;min-width:0}
.rel-sumtx .sub{margin-top:2px}
.rel-ring{position:relative;flex:none;display:grid;place-items:center;border-radius:50%}
.rel-ring > svg{position:absolute;inset:0;transform:rotate(-90deg)}
.rel-ring circle{fill:none;stroke-width:6}
.rel-ring .tr{stroke:rgba(74,31,230,.1)}
.rel-ring .pr{stroke:var(--accent);stroke-linecap:round;transition:stroke-dashoffset .9s var(--spring),stroke .4s}
.rel-ring.full .pr{stroke:var(--ok)}
.rel-ring.full .tr{stroke:rgba(7,138,94,.12)}
.rel-ring b{position:relative;font-size:16px;font-weight:700;letter-spacing:-.04em}
.rel-ring b small{font-size:11px;color:var(--faint);letter-spacing:0}
.rel-ring.full b{color:var(--ok);display:grid;place-items:center}
.rel-ring.full b .ico{width:24px;height:24px;stroke-width:2.6}
.rel-sum.full{background:linear-gradient(135deg,rgba(255,255,255,.82),rgba(214,246,232,.78))}
.rel-sum.celeb{animation:relCeleb .9s var(--spring)}
.rel-sum.celeb .rel-ring{animation:relPulse 1.2s var(--ease) .2s}
@keyframes relCeleb{0%{transform:scale(.96)}45%{transform:scale(1.025)}100%{transform:none}}
@keyframes relPulse{0%{box-shadow:0 0 0 0 rgba(7,138,94,.45)}100%{box-shadow:0 0 0 22px rgba(7,138,94,0)}}
.rel-all .ico{color:var(--accent)}

/* fridge cards */
.fr.done{cursor:pointer;transition:transform .2s var(--ease),box-shadow .3s,background .3s}
.fr.done:hover{background:var(--glass-hi)}
.fr.done:active{transform:scale(.985)}
.fr .who{min-width:0}
.fr .who .pill{flex:none}
.fr.rel-in{animation:relIn .5s var(--spring)}
@keyframes relIn{from{transform:scale(.97)}to{transform:none}}
.fr.sealing .pend{border:0;background:var(--ok);animation:pop .5s var(--spring);box-shadow:0 6px 14px -6px rgba(7,138,94,.6)}
.rel-fx{padding:2px 8px 2px 6px;font-size:10.5px;gap:4px}
.rel-fx .ico{width:11px;height:11px;stroke-width:2.2}
.rel-vw{display:flex;flex-direction:column;align-items:center;gap:8px;min-width:0}
.rel-st{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:800;padding:3px 10px;border-radius:999px;white-space:nowrap}
.rel-st .ico{width:13px;height:13px;stroke-width:2.4}
.rel-st.ok{color:var(--ok);background:rgba(7,138,94,.1)}
.rel-st.bad{color:var(--bad);background:rgba(212,42,72,.1)}
@media (max-width:380px){.rel-st.bad{font-size:11px}}

/* edit sheet */
.rel-eh{display:flex;align-items:center;gap:12px}
.rel-ev{font-size:34px;font-weight:700;letter-spacing:-.06em}
.rel-warn{display:flex;align-items:center;gap:8px;padding:10px 12px;border-radius:14px;background:rgba(212,42,72,.08);color:var(--bad);font-weight:700;font-size:13px}
.rel-warn .ico{width:16px;height:16px;flex:none}
.rel-opts{display:flex;flex-direction:column;gap:8px}
.rel-opt{all:unset;box-sizing:border-box;cursor:pointer;display:flex;align-items:center;gap:12px;min-height:64px;padding:10px 14px;border-radius:18px;background:var(--glass-hi);box-shadow:0 0 0 1px var(--line) inset;transition:transform .16s var(--ease),background .2s}
.rel-opt:hover{background:#fff}
.rel-opt:active{transform:scale(.98)}
.rel-opt:focus-visible{outline:2.5px solid var(--accent);outline-offset:2px}
.rel-opt .tx{flex:1;min-width:0}
.rel-opt .tx b{display:block;font-weight:800;font-size:15px;letter-spacing:-.015em}
.rel-opt .tx em{display:block;font-style:normal;font-size:12.5px;color:var(--muted);font-weight:600;margin-top:1px}
.rel-opt > .ico{width:18px;height:18px;color:var(--faint);flex:none}
.rel-opt.bad .tx b{color:var(--bad)}
.rel-opt[disabled]{opacity:.45;pointer-events:none}
.rel-hist{margin-top:8px;display:flex;flex-direction:column}
.rel-hv{display:flex;gap:12px;position:relative;padding:0 0 12px}
.rel-hv:not(:last-child)::before{content:"";position:absolute;left:5px;top:14px;bottom:0;width:2px;background:var(--line)}
.rel-hdot{width:12px;height:12px;border-radius:50%;margin-top:4px;flex:none;background:#fff;box-shadow:0 0 0 2px rgba(14,19,48,.18) inset}
.rel-hv.cur .rel-hdot{background:var(--accent);box-shadow:0 0 0 3px rgba(74,31,230,.16)}
.rel-hv .tx b{display:block;font-size:14px;font-weight:750}
.rel-hv .tx em{display:block;font-style:normal;font-size:12.5px;color:var(--muted);font-weight:600}
.rel-fixdz{display:flex;flex-direction:column;gap:16px;padding:4px 0}
.rel-bulk{display:flex;flex-direction:column;max-height:46vh;overflow-y:auto}
.rel-v{font-weight:700;font-size:17px;letter-spacing:-.04em;flex:none}

/* frigos list */
.rel-fcard{cursor:pointer;transition:transform .2s var(--ease),background .3s}
.rel-fcard:hover{background:var(--glass-hi)}
.rel-fcard:active{transform:scale(.985)}
.rel-meta{display:flex;align-items:center;gap:6px;font-size:12.5px;color:var(--muted);font-weight:650;margin-top:2px;white-space:nowrap}
.rel-sep{color:var(--faint)}
.rel-dot{width:8px;height:8px;border-radius:50%;flex:none;background:#B7BCD3}
.rel-dot.ok{background:var(--ok);box-shadow:0 0 0 3px rgba(7,138,94,.15)}
.rel-dot.late{background:var(--warn);box-shadow:0 0 0 3px rgba(184,108,0,.15)}
.rel-dot.bad{background:var(--bad);animation:beat 1.6s ease-in-out infinite}
.rel-ft{font-size:24px;font-weight:700;letter-spacing:-.05em;line-height:1.1}
.rel-next{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:12px;padding-top:10px;border-top:1px solid var(--line);font-size:12.5px;color:var(--muted);font-weight:600}
.rel-next b{color:var(--ink);font-weight:750}

/* frigo detail: chart */
.rel-chart{position:relative;margin-top:12px;min-height:190px}
.rel-chart svg{display:block;overflow:visible;touch-action:pan-y}
.rel-chart .col{fill:rgba(14,19,48,.025)}
.rel-chart .gl{stroke:rgba(14,19,48,.07);stroke-width:1}
.rel-chart .yl,.rel-chart .xd{font-family:var(--mono);font-size:10.5px;fill:var(--faint)}
.rel-chart .xl{font-size:11px;font-weight:700;fill:var(--muted)}
.rel-chart .t{fill:var(--accent);font-weight:800}
.rel-chart .band{fill:rgba(7,138,94,.1)}
.rel-chart .th{stroke:rgba(7,138,94,.55);stroke-width:1.2;stroke-dasharray:4 4}
.rel-chart .cross{stroke:rgba(14,19,48,.25);stroke-width:1;stroke-dasharray:3 3}
.rel-ln{fill:none;stroke:var(--accent);stroke-width:2;stroke-linejoin:round;stroke-linecap:round;opacity:.85}
.rel-pt{stroke-width:2;transition:r .2s var(--spring)}
.rel-pt.midi{fill:var(--accent);stroke:#fff}
.rel-pt.soir{fill:#fff;stroke:var(--accent)}
.rel-pt.bad.midi{fill:var(--bad);stroke:#fff}
.rel-pt.bad.soir{fill:#fff;stroke:var(--bad);stroke-width:2.5}
.rel-pt.hi{r:7}
.rel-chart svg.anim .rel-ln{stroke-dasharray:1;stroke-dashoffset:1;animation:relDraw 1.2s .15s var(--ease) forwards}
.rel-chart svg.anim .rel-pt{opacity:0;transform-box:fill-box;transform-origin:center;animation:popin .45s var(--spring) forwards;animation-delay:calc(var(--d) + 300ms)}
@keyframes relDraw{to{stroke-dashoffset:0}}
.rel-tip{position:absolute;left:0;top:0;pointer-events:none;display:flex;flex-direction:column;gap:1px;padding:7px 11px;border-radius:12px;background:rgba(14,19,48,.92);color:#fff;font-size:11.5px;font-weight:650;white-space:nowrap;opacity:0;transform:translateY(4px);transition:opacity .15s,transform .2s var(--ease);box-shadow:0 10px 24px -10px rgba(14,19,48,.6)}
.rel-tip.on{opacity:1;transform:none}
.rel-tip b{font-size:14px}
.rel-tip span{color:rgba(255,255,255,.75)}
.rel-nodata{position:absolute;left:30px;right:8px;top:40%;text-align:center;font-size:13px;font-weight:700;color:var(--muted)}
.rel-legend{display:flex;flex-wrap:wrap;gap:6px 14px;margin-top:10px;font-size:11.5px;font-weight:700;color:var(--muted)}
.rel-legend span{display:inline-flex;align-items:center;gap:6px}
.rel-legend i{display:inline-block;width:10px;height:10px;border-radius:50%}
.rel-legend i.m{background:var(--accent)}
.rel-legend i.s{background:#fff;box-shadow:0 0 0 2px var(--accent) inset}
.rel-legend i.b{width:16px;height:10px;border-radius:3px;background:rgba(7,138,94,.14);box-shadow:0 0 0 1px rgba(7,138,94,.5) inset}
.rel-legend i.x{background:var(--bad)}

/* frigo detail: readings by day */
.rel-day{margin-top:8px}
.rel-day + .rel-day{margin-top:14px}
.rel-dayh{display:flex;justify-content:space-between;font-size:12px;font-weight:800;color:var(--ink);padding:4px 0 2px;letter-spacing:-.005em}
.rel-dayh span:last-child{font-family:var(--mono);font-weight:600;color:var(--faint);font-size:11px}
.rel-row{gap:10px}
.rel-row .tx b{display:flex;align-items:center;gap:6px}
.rel-slot{flex:none;width:44px;text-align:center;font-size:11px;font-weight:800;padding:4px 0;border-radius:9px;background:rgba(74,31,230,.09);color:var(--accent)}
.rel-slot.soir{background:rgba(14,19,48,.07);color:var(--ink)}
.rel-chev{display:grid;place-items:center;flex:none;color:var(--faint)}
.rel-chev .ico{width:16px;height:16px}
@media (max-width:420px){.rel-row .rel-fx{display:none}}

/* equipment types */
.rel-nm{display:flex;align-items:center;gap:8px;min-width:0}
.rel-nm .pill{flex:none}
.rel-st.warn{color:var(--warn);background:rgba(184,108,0,.12)}
#toastTx [data-act=relUndo]{white-space:nowrap}
.rel-types{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.rel-type{all:unset;box-sizing:border-box;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-height:78px;padding:10px 6px;border-radius:18px;background:var(--glass-hi);box-shadow:0 0 0 1px var(--line) inset;text-align:center;transition:transform .2s var(--spring),background .25s,box-shadow .25s,color .25s;color:var(--muted)}
.rel-type .ico{width:26px;height:26px}
.rel-type b{font-size:12px;font-weight:800;line-height:1.15;letter-spacing:-.01em}
.rel-type:active{transform:scale(.95)}
.rel-type:focus-visible{outline:2.5px solid var(--accent);outline-offset:2px}
.rel-type.on{background:linear-gradient(150deg,rgba(122,77,255,.16),rgba(74,31,230,.08));box-shadow:0 0 0 2px var(--accent) inset;color:var(--accent)}
.rel-type.on b{color:var(--ink)}
.rel-type.on .ico{animation:pop .45s var(--spring)}
.rel-grp{display:flex;flex-direction:column;gap:10px}
.rel-grph{display:flex;align-items:center;gap:8px;padding:2px 4px 0;font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--faint)}
.rel-grph .ico{width:16px;height:16px;color:var(--accent)}
.rel-grph em{font-style:normal;font-family:var(--mono);font-weight:600;letter-spacing:0;padding:1px 7px;border-radius:999px;background:rgba(14,19,48,.06)}
.rel-ordl{display:flex;flex-direction:column}
.rel-ord{gap:8px}
.rel-ord .iconbtn{width:44px;height:44px}
.rel-ord .iconbtn[disabled]{opacity:.3;pointer-events:none}
.rel-ord .iconbtn .ico{width:18px;height:18px}
.rel-moved{animation:relIn .45s var(--spring);background:rgba(74,31,230,.06);border-radius:14px}
@media (max-width:380px){.rel-ord .ic{display:none}}
.rel-sl{position:relative;height:14px;display:block}
.rel-sl span{position:absolute;top:0;white-space:nowrap}
.rel-sl span.c{transform:translateX(-50%);color:var(--ok);font-weight:700}

/* QA pass: corrective actions, sign toggle, moves */
.rel-bigic{width:56px;height:56px;border-radius:20px;margin:0 auto}
.rel-acts{display:flex;flex-direction:column;gap:8px}
.rel-act{all:unset;box-sizing:border-box;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:50px;padding:12px 14px 12px 16px;border-radius:16px;background:var(--glass-hi);box-shadow:0 0 0 1px var(--line) inset;font-weight:750;font-size:14.5px;letter-spacing:-.01em;color:var(--ink);transition:transform .16s var(--ease),background .2s}
.rel-act .ico{width:16px;height:16px;color:var(--faint);flex:none}
.rel-act:hover{background:#fff}
.rel-act:active{transform:scale(.98)}
.rel-act:focus-visible{outline:2.5px solid var(--accent);outline-offset:2px}
.rel-other{display:flex;gap:8px}
.rel-other .input{flex:1;min-width:0}
.rel-other .btn{flex:none;width:52px;padding:0}
.rel-num{position:relative;display:block}
.rel-num .input{width:100%;padding-right:52px}
.rel-sign{all:unset;box-sizing:border-box;cursor:pointer;position:absolute;right:4px;top:50%;transform:translateY(-50%);width:44px;height:44px;border-radius:14px;display:grid;place-items:center;font-family:var(--mono);font-size:18px;font-weight:700;color:var(--accent);transition:background .2s,transform .14s var(--ease)}
.rel-sign:hover{background:rgba(74,31,230,.08)}
.rel-sign:active{transform:translateY(-50%) scale(.9)}
.rel-why,.rel-mv{display:flex;flex-wrap:wrap;gap:7px}
.rel-skip{opacity:.75}
.fr .head:focus-visible,.rel-fcard:focus-visible{outline:2.5px solid var(--accent);outline-offset:2px;border-radius:14px}
.rel-ord .tx{min-width:0}
@media (prefers-reduced-motion:reduce){.rel-sum.celeb,.rel-sum.celeb .rel-ring,.fr.rel-in,.rel-moved,.rel-type.on .ico{animation:none}.rel-chart svg.anim .rel-ln{animation:none;stroke-dashoffset:0}.rel-chart svg.anim .rel-pt{animation:none;opacity:1}}
.rel-mv .chip{max-width:100%;overflow:hidden;text-overflow:ellipsis;display:inline-block;line-height:24px}
.rel-mv{max-height:34vh;overflow-y:auto;padding:2px}

/* final pass: relevé page layout (one column on phone, two-column fridge grid on wide screens) */
.rel-grid{display:flex;flex-direction:column;gap:14px;min-width:0}
.rel-page{max-width:640px}
@media (min-width:960px){
  .inner.rel-page{max-width:1080px}
  .rel-page > .seg{max-width:420px;width:100%;align-self:center}
  .rel-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}
  .rel-grid .fr .dial .dz{padding-top:18px}
  .rel-page > .note{max-width:640px;align-self:center}
}
@media (min-width:1600px){.inner.rel-page{max-width:1240px}}
/* corrected readings: always say it in words, the pencil alone is not enough */
.rel-fxt{white-space:nowrap}
/* frigos list: cards of a row keep the same height, the product line sits at the bottom */
.rel-next.none{color:var(--faint)}
@media (max-width:959px){.rel-next.none{display:none}}
@media (min-width:960px){.rel-fcard{display:flex;flex-direction:column}.rel-fcard > .row{margin-bottom:12px}.rel-fcard > .rel-next{margin-top:auto}}
.li.tap[data-act=lot]:focus-visible{outline:2.5px solid var(--accent);outline-offset:-2px}
.rel-allw:empty{display:none}
.rel-pop{animation:relIn .45s var(--spring)}
@media (prefers-reduced-motion:reduce){.rel-pop{animation:none}}
/* « corrigé » sits next to the name on wide cards, on the signature line on phones so the name keeps its room */
.rel-fx-m{display:none}
@media (max-width:520px){.fr .rel-nm .rel-fx{display:none}.fr .who .rel-fx-m{display:inline-flex}}
@media (min-width:960px){.rel-fcard > .rel-next{min-height:33px;box-sizing:border-box}}

/* ───────────── service context, peaks ───────────── */
.rel-ctxw{display:flex;flex-direction:column;gap:6px;margin-top:4px}
.rel-ctx button{display:inline-flex;align-items:center;justify-content:center;gap:6px;font-size:13px;min-height:24px}
.rel-ctx button .ico{width:15px;height:15px}
.rel-ctx button.on:last-of-type{color:#9A5A00}
.rel-ctxn{margin:0;text-align:center;font-size:11.5px;font-weight:600;color:var(--faint)}
.rel-pt.pk.midi{fill:#E58A16;stroke:#fff}
.rel-pt.pk.soir{fill:#fff;stroke:#E58A16;stroke-width:2.5}
.rel-legend i.p{background:#E58A16}
.rel-warn.pk{background:rgba(184,108,0,.09);color:var(--warn)}
.rel-svcopt{background:linear-gradient(150deg,rgba(255,170,60,.16),rgba(255,140,40,.06));box-shadow:0 0 0 1.5px rgba(229,138,22,.5) inset}
.rel-svcopt .tx{display:flex;flex-direction:column;gap:2px;min-width:0}
.rel-svcopt .tx b{font-weight:800;color:#8A5000}
.rel-svcopt .tx em{font-style:normal;font-size:12.5px;font-weight:600;color:var(--muted);line-height:1.3}
.rel-next.svc{color:#9A5A00}
.rel-next.svc .pill .ico{width:12px;height:12px}
/* frigos banner */
.rel-svcb .sub{line-height:1.35}
.rel-svcb.warn{box-shadow:var(--sh),0 0 0 1.5px rgba(184,108,0,.35) inset}
.rel-svcb.bad{box-shadow:var(--sh),0 0 0 1.5px rgba(212,42,72,.35) inset}
.rel-svcb .btn .ico,.rel-svcc .btn .ico,.rel-mepb .ico{width:19px;height:19px}
.rel-mepb .ico{color:#E58A16}
/* contents rows with a one-tap move */
.rel-lrow{gap:10px}
.rel-mv1{width:42px;height:42px}
.rel-mv1 .ico{width:19px;height:19px}
.rel-lrow .svc-dw{flex:none}
/* service screen */
.rel-svc{display:flex;flex-direction:column;gap:14px}
.rel-svcseg button{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:26px}
.rel-svcseg .ico{width:17px;height:17px}
.rel-svcn{font-style:normal;font-family:var(--mono);font-size:11.5px;padding:1px 7px;border-radius:999px;background:#2F7FE0;color:#fff}
.rel-svcg .ic.sm{width:32px;height:32px;border-radius:11px}
.rel-svcg .ic.sm .ico{width:18px;height:18px}
.rel-svcg > .row{margin-bottom:4px}
.rel-svcin{all:unset;box-sizing:border-box;cursor:pointer;display:flex;align-items:center;justify-content:space-between;width:100%;margin-top:12px;padding:11px 14px;border-radius:14px;background:rgba(47,127,224,.08);font-size:13px;font-weight:700;color:#1C5DB0}
.rel-svcin .ico{width:16px;height:16px}
.rel-svcf{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:0 4px;font-size:13.5px;color:var(--muted)}
.rel-svcf b{color:var(--ink)}
.rel-mrow{min-height:56px}
.rel-go{width:40px;height:40px;border-radius:14px;display:grid;place-items:center;flex:none;background:rgba(229,138,22,.12);color:#C27400;transition:transform .25s var(--spring)}
.rel-go .ico{width:19px;height:19px}
.rel-mrow:hover .rel-go,.rel-mrow:active .rel-go{transform:translateX(3px)}
.rel-svcsum .sub{line-height:1.4}
.rel-svcbig{width:64px;height:64px;border-radius:22px;flex:none;display:flex;flex-direction:column;align-items:center;justify-content:center;background:rgba(7,138,94,.1);color:var(--ok)}
.rel-svcbig.warn{background:rgba(184,108,0,.12);color:var(--warn)}
.rel-svcbig.bad{background:rgba(212,42,72,.1);color:var(--bad)}
.rel-svcbig b{font-size:26px;line-height:1;letter-spacing:-.05em}
.rel-svcbig small{font-size:10.5px;font-weight:800}
.rel-svct{font-size:16px;font-weight:700;display:flex;align-items:baseline;gap:6px}
.rel-svct small{font-family:Manrope,system-ui,sans-serif;font-size:11.5px;color:var(--muted);font-weight:600;white-space:nowrap;letter-spacing:0}
.rel-srow{padding:12px 0;display:flex;flex-direction:column;gap:10px;transition:opacity .3s,transform .3s var(--ease)}
.rel-srow + .rel-srow{border-top:1px solid var(--line)}
.rel-srow.svc-gone{opacity:0;transform:translateX(-24px)}
.rel-srh{display:flex;align-items:center;gap:10px;cursor:pointer;min-width:0}
.rel-srh .tx{flex:1;min-width:0}
.rel-srh .tx b{display:block;font-weight:750;font-size:15px;letter-spacing:-.015em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rel-srh .tx em{display:block;font-style:normal;font-size:12.5px;color:var(--muted);margin-top:1px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rel-srb{display:flex;align-items:center;gap:10px}
.rel-left{flex:1;min-width:0;display:flex;align-items:center;gap:6px}
.rel-left .step{width:46px;height:46px;border-radius:15px}
.rel-left .step .ico{width:20px;height:20px}
.rel-left label{flex:1;min-width:0;display:flex;flex-direction:column;align-items:center}
.rel-left input{all:unset;width:100%;text-align:center;font-size:24px;font-weight:700;letter-spacing:-.04em;line-height:1.1}
.rel-left input.bump{animation:bump .35s var(--spring)}
.rel-left small{font-size:11px;font-weight:700;color:var(--faint);white-space:nowrap}
.rel-sback{flex:none;min-width:118px}
.rel-sback .ico{width:18px;height:18px}

/* ───────────── frigo detail: Contenu / Historique ───────────── */
.rel-fbig{font-size:46px;font-weight:700;letter-spacing:-.07em;line-height:1.05;margin-top:2px}
.rel-fbig span{font-size:20px;color:var(--faint)}
.rel-fmain,.rel-fside{display:flex;flex-direction:column;gap:14px;min-width:0}
.rel-ftab button{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:28px;font-size:14px}
.rel-ftab .ico{width:17px;height:17px}
.rel-ftab em{font-style:normal;font-family:var(--mono);font-size:11.5px;padding:1px 7px;border-radius:999px;background:rgba(14,19,48,.07)}
.rel-ftab button.on em{background:var(--ink);color:#fff}
.rel-fbody{display:flex;flex-direction:column;gap:12px}
.rel-find{position:relative}
.rel-find > .ico{position:absolute;left:15px;top:50%;transform:translateY(-50%);width:18px;height:18px;color:var(--faint);pointer-events:none}
.rel-find .input{padding-left:42px}
.rel-alerts{display:flex;flex-wrap:wrap;gap:6px}
.rel-alerts .pill{white-space:normal}
.rel-alerts .pill .ico{width:13px;height:13px;flex:none}
.rel-grpc{gap:8px}
.rel-tg{display:flex;flex-direction:column;gap:8px}
.rel-tg[hidden],.rel-tile[hidden]{display:none}
.rel-tgh{display:flex;align-items:center;gap:8px;padding:4px 4px 0;font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--faint)}
.rel-tgh::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--faint)}
.rel-tgh.bad{color:var(--bad)}.rel-tgh.bad::before{background:var(--bad)}
.rel-tgh.warn{color:var(--warn)}.rel-tgh.warn::before{background:var(--warn)}
.rel-tgh.ok::before{background:var(--ok)}
.rel-tgh.al{color:#7A4DFF}.rel-tgh.al::before{background:#7A4DFF}
.rel-tgh em{font-style:normal;font-family:var(--mono);font-weight:600;letter-spacing:0;padding:1px 7px;border-radius:999px;background:rgba(14,19,48,.06);color:var(--muted)}
.rel-tiles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
@media (min-width:700px){.rel-tiles{grid-template-columns:repeat(auto-fill,minmax(190px,1fr))}}
.rel-tile{position:relative;display:flex;flex-direction:column;gap:8px;padding:14px 12px 10px;border-radius:22px;background:var(--glass);border:1px solid var(--edge);box-shadow:var(--sh);cursor:pointer;overflow:hidden;transition:transform .2s var(--spring),background .25s}
.view:not(.nost) .rel-tile{animation:lbIn .45s var(--spring) both}
.rel-tile::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--faint);opacity:.5}
.rel-tile.u-ok::before{background:var(--ok);opacity:.8}
.rel-tile.u-warn::before{background:var(--warn);opacity:1}
.rel-tile.u-bad::before{background:var(--bad);opacity:1}
.rel-tile.u-bad{background:linear-gradient(160deg,rgba(212,42,72,.08),var(--glass) 60%)}
.rel-tile:hover{background:var(--glass-hi)}
.rel-tile:active{transform:scale(.97)}
.rel-tile:focus-visible{outline:2.5px solid var(--accent);outline-offset:2px}
.rel-tt{display:flex;flex-direction:column;gap:2px;min-width:0}
.rel-tt b{font-size:15px;font-weight:800;letter-spacing:-.02em;line-height:1.2;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.rel-tt .mono{font-size:22px;font-weight:700;letter-spacing:-.04em;line-height:1.1}
.rel-tt .mono small{font-family:Manrope,system-ui,sans-serif;font-size:12px;font-weight:700;color:var(--muted);letter-spacing:0;margin-left:4px}
.rel-tm{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.rel-dl{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:800;color:var(--muted)}
.rel-dl i{width:8px;height:8px;border-radius:50%;background:var(--faint)}
.rel-dl.ok{color:var(--ok)}.rel-dl.ok i{background:var(--ok)}
.rel-dl.warn{color:var(--warn)}.rel-dl.warn i{background:var(--warn)}
.rel-dl.bad{color:var(--bad)}.rel-dl.bad i{background:var(--bad);animation:beat 1.6s ease-in-out infinite}
.rel-op{font-size:11px;font-weight:800;padding:2px 8px;border-radius:999px;background:rgba(184,108,0,.12);color:var(--warn)}
.rel-tm .svc-dw{padding:2px 8px;font-size:11px}
.rel-tal{display:flex;flex-wrap:wrap;gap:4px}
.rel-tal span{font-size:10.5px;font-weight:800;padding:2px 7px;border-radius:7px;background:rgba(122,77,255,.1);color:#5B32E0}
.rel-tas{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;margin-top:auto;padding-top:6px;border-top:1px solid var(--line)}
.rel-ta{all:unset;box-sizing:border-box;cursor:pointer;min-height:46px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;border-radius:12px;font-size:10.5px;font-weight:800;color:var(--muted);transition:background .2s,transform .15s var(--spring)}
.rel-ta .ico{width:18px;height:18px;color:var(--accent)}
.rel-ta:hover{background:rgba(74,31,230,.07)}
.rel-ta:active{transform:scale(.9)}
.rel-ta:focus-visible{outline:2.5px solid var(--accent)}
.rel-ta.bad .ico{color:var(--bad)}
.rel-nofind{text-align:center;color:var(--muted);font-size:14px;margin:8px 0}
.rel-hf{flex-wrap:wrap;gap:8px}
.rel-hf .chip em{font-style:normal;font-family:var(--mono);font-size:11px;margin-left:7px;opacity:.7}
.rel-hev{gap:12px}
.rel-evi{width:36px;height:36px;border-radius:12px;display:grid;place-items:center;flex:none;background:rgba(14,19,48,.06);color:var(--muted)}
.rel-evi .ico{width:17px;height:17px}
.rel-evi.ok{background:rgba(7,138,94,.1);color:var(--ok)}
.rel-evi.warn{background:rgba(184,108,0,.12);color:var(--warn)}
.rel-evi.bad{background:rgba(212,42,72,.1);color:var(--bad)}
.rel-evi.svc{background:rgba(229,138,22,.13);color:#C27400}
.rel-evi.cold{background:rgba(47,127,224,.12);color:#2F7FE0}
.rel-evt{font-size:12px;color:var(--faint);flex:none}
/* frigos overview */
.rel-ovh{display:flex;align-items:baseline;justify-content:space-between;gap:10px;padding:4px 4px 0;flex-wrap:wrap}
.rel-top{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px;padding-top:10px;border-top:1px solid var(--line)}
.rel-tc{display:inline-flex;align-items:center;gap:6px;max-width:100%;padding:5px 10px;border-radius:999px;background:rgba(14,19,48,.05);font-size:12px;font-weight:750;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rel-tc i{width:7px;height:7px;border-radius:50%;flex:none;background:var(--faint)}
.rel-tc.ok i{background:var(--ok)}.rel-tc.warn i{background:var(--warn)}.rel-tc.bad i{background:var(--bad)}
.rel-tc.bad{background:rgba(212,42,72,.08)}
.rel-tc em{font-style:normal;font-size:11px;color:var(--muted);font-weight:600}
.rel-tc.more{color:var(--muted)}
.rel-falert{margin-top:8px}
.rel-grpc .chip em{font-style:normal;font-family:var(--mono);font-size:11px;margin-left:7px;padding:0 6px;border-radius:999px;background:rgba(122,77,255,.15);color:#5B32E0}
.rel-grpc .chip.on em{background:rgba(255,255,255,.2);color:#fff}
.rel-alnote{display:flex;gap:8px;align-items:flex-start;margin:0;padding:10px 12px;border-radius:14px;background:rgba(122,77,255,.07);font-size:12.5px;font-weight:600;color:#4A2BB8;line-height:1.35}
.rel-alnote .ico{width:16px;height:16px;flex:none;margin-top:1px}
.rel-fmini{all:unset;box-sizing:border-box;cursor:pointer;display:flex;align-items:center;gap:12px;padding:10px 10px 10px 16px;border-radius:20px;background:var(--glass);border:1px solid var(--edge);box-shadow:var(--sh);transition:transform .2s var(--spring)}
.rel-fmini:active{transform:scale(.98)}
.rel-fmini > .mono{font-size:28px;font-weight:700;letter-spacing:-.06em;flex:none}
.rel-fmini .tx{flex:1;min-width:0;display:flex;flex-direction:column}
.rel-fmini .tx b{font-size:14px;font-weight:800}
.rel-fmini .tx em{font-style:normal;font-size:12px;color:var(--muted);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rel-fmb{display:inline-flex;align-items:center;gap:6px;height:44px;padding:0 14px;border-radius:14px;background:var(--glass-hi);box-shadow:0 0 0 1px var(--line) inset;font-weight:800;font-size:13.5px;flex:none}
.rel-fmb .ico{width:17px;height:17px;color:var(--accent)}
@media (min-width:960px){.rel-fmini{display:none}}
@media (max-width:959px){.rel-fhead{display:none}}