/* MyDesk extras (2026-11-13): «Качество», offline mode, 3D scenes, Home statistics widgets. Uses the theme tokens of app.css. */

/* ---------- «Качество» ---------- */
.qad .acts{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-top:12px}
.qad .g2-1{display:grid;grid-template-columns:2fr 1fr;gap:18px}
.qad .kpi .v.warn{color:var(--maybe)}
.qa-hero{display:flex;gap:16px;align-items:center}
.qa-legend{display:flex;gap:14px;flex-wrap:wrap;font-size:12.5px;color:var(--muted);margin-top:8px}
.qa-legend.col{flex-direction:column;gap:6px;margin-top:14px}
.qa-legend i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:6px;vertical-align:-1px}
.qa-files,.qa-slow{display:grid;gap:9px}
.qa-file,.qa-sl{display:grid;grid-template-columns:minmax(0,1.3fr) 2fr auto;gap:12px;align-items:center;font-size:13.5px}
.qa-fn,.qa-sl span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.qa-bar{height:8px;border-radius:99px;background:var(--chip);overflow:hidden}
.qa-bar i{display:block;height:100%;border-radius:99px;background:var(--accent);transition:width .8s cubic-bezier(.2,.8,.2,1)}
.qa-sl b,.qa-file b{font-variant-numeric:tabular-nums;font-size:12.5px;color:var(--muted)}
.qa-tip{font-size:12.5px;margin:12px 0 0;line-height:1.6}.qa-tip .ic{vertical-align:-2px;margin-right:4px}
.qa-ci-strip a::after,.qa-rh a::after{content:none!important}
.qad code,.qa-err{font:12px ui-monospace,Consolas,monospace;background:var(--chip);padding:1px 6px;border-radius:6px}
.qa-err{display:block;white-space:pre-wrap;padding:10px 12px;margin:8px 0 0;max-height:220px;overflow:auto;color:var(--text)}
.qa-ci-strip{display:flex;gap:4px;flex-wrap:wrap}
.qa-ci-strip a{width:18px;height:26px;border-radius:5px;background:var(--c);opacity:.85;transition:transform .15s}
.qa-ci-strip a:hover{transform:scaleY(1.15);opacity:1}
.qa-runs{display:grid;gap:8px}
.qa-run{border:1px solid var(--line);border-radius:14px;overflow:hidden}
.qa-run.open{border-color:var(--accent)}
.qa-rh{all:unset;box-sizing:border-box;display:flex;gap:12px;align-items:center;width:100%;padding:12px 14px;cursor:pointer}
.qa-rh .t,.qa-t .t{display:grid;gap:2px;flex:1;min-width:0}
.qa-rh .t span,.qa-t .t span{font-size:12.5px;color:var(--muted)}
.qa-rh>.ic{transition:transform .2s;color:var(--muted)}.qa-run.open .qa-rh>.ic{transform:rotate(180deg)}
.qa-rb{padding:4px 14px 14px;display:grid;gap:8px}
.qa-rb details{margin-top:6px}.qa-rb summary{cursor:pointer;padding:6px 0}
.qa-t{display:flex;gap:10px;align-items:flex-start;padding:6px 0;border-top:1px dashed var(--line)}
.qa-search{max-width:220px;padding:6px 10px;border-radius:9px;border:1px solid var(--line);background:var(--chip);color:var(--text);font:500 13px Onest,sans-serif}
.qa-matrix{display:grid;gap:3px;max-height:560px;overflow:auto}
.qa-mr{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:center;font-size:13px;padding:2px 0}
.qa-mt{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.qa-cells{display:flex;gap:3px}
.qa-cells i{width:14px;height:14px;border-radius:4px;background:var(--c)}
.qa-cells i.none{outline:1px dashed var(--line);outline-offset:-1px}
.qa-empty{text-align:center;padding:40px 24px;display:grid;justify-items:center;gap:10px}
.qa-empty-ic{width:76px;height:76px;border-radius:24px;display:grid;place-items:center;background:color-mix(in srgb,var(--accent) 18%,transparent);color:var(--accent);animation:qaFloat 3.2s ease-in-out infinite}
@keyframes qaFloat{50%{transform:translateY(-6px) rotate(-4deg)}}
.qa-steps{text-align:left;display:grid;gap:6px;margin:6px 0 10px;color:var(--muted)}
.qa-key{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.qa-key code{word-break:break-all}
.qa-how{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.qa-how>div{display:grid;gap:4px;padding:12px;border-radius:12px;background:var(--chip)}.qa-how span{font-size:13px;color:var(--muted)}
@media (max-width:900px){.qad .g2-1,.qa-how{grid-template-columns:1fr}.qa-file,.qa-sl{grid-template-columns:1fr 1fr auto}}

/* ---------- offline ---------- */
.netpill{display:none;align-items:center;gap:6px;font-size:12.5px;font-weight:700;padding:5px 11px;border-radius:999px;background:color-mix(in srgb,var(--maybe) 20%,transparent);color:var(--text);margin-right:8px;white-space:nowrap}
body.offline .netpill,body.pending .netpill{display:inline-flex}
body.offline .netpill .ic{color:var(--maybe)}
.offline-card{max-width:520px;margin:12vh auto;text-align:center;display:grid;gap:12px;justify-items:center}

/* ---------- 3D scenes ---------- */
.scene3d{position:relative;height:260px;margin-bottom:18px;padding:0;overflow:hidden;border-radius:22px}
.scene3d canvas{display:block;width:100%!important;height:100%!important}
.scene3d .s3-cap{position:absolute;left:20px;bottom:16px;display:grid;gap:2px;pointer-events:none;text-shadow:0 1px 8px rgba(0,0,0,.55);color:#fff}
.scene3d .s3-cap b{font-size:20px;letter-spacing:-.02em}.scene3d .s3-cap span{font-size:13px;opacity:.85}
.scene3d .s3-off{position:absolute;right:12px;top:12px;opacity:.55}.scene3d:hover .s3-off{opacity:1}
.const3d{position:relative;height:520px;padding:0;overflow:hidden;border-radius:18px;background:radial-gradient(ellipse at 50% 40%,#1b1f3a,#07080f 70%)}
.const3d .c3-legend{position:absolute;left:14px;bottom:12px;display:flex;gap:12px;flex-wrap:wrap;font-size:12px;color:#cbd5e1;pointer-events:none}
.const3d .c3-legend i{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:5px}
.const3d .c3-info{position:absolute;right:14px;top:14px;max-width:280px;padding:12px 14px;border-radius:14px;background:rgba(15,18,32,.82);backdrop-filter:blur(8px);color:#e2e8f0;font-size:13px;display:none}
.const3d .c3-info.show{display:grid;gap:6px}

/* ---------- Home statistics widgets ---------- */
.wgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px;margin-bottom:18px}
.wgt{position:relative;display:grid;gap:8px;align-content:start;min-height:150px;text-decoration:none;color:inherit}
.wgt h4{margin:0;font-size:12px;text-transform:uppercase;letter-spacing:.07em;color:var(--muted);display:flex;align-items:center;gap:7px}
.wgt .wv{font-size:30px;font-weight:800;letter-spacing:-.03em;font-variant-numeric:tabular-nums;line-height:1.1}
.wgt .ws{font-size:12.5px;color:var(--muted)}
.wgt .grip{position:absolute;right:10px;top:10px;color:var(--muted);cursor:grab;opacity:0;transition:opacity .2s}
.wgt:hover .grip{opacity:.7}
.wgt.sortable-ghost{opacity:.35}.wgt.sortable-chosen{box-shadow:0 18px 40px rgba(0,0,0,.35)}
.spark{width:100%;height:46px;display:block}
.spark path.a{fill:color-mix(in srgb,var(--c,var(--accent)) 22%,transparent)}
.spark path.l{fill:none;stroke:var(--c,var(--accent));stroke-width:2.2;stroke-linejoin:round;stroke-linecap:round;stroke-dasharray:600;stroke-dashoffset:600;animation:sparkIn 1.2s ease forwards}
@keyframes sparkIn{to{stroke-dashoffset:0}}
.mbars{display:flex;align-items:flex-end;gap:4px;height:46px}
.mbars i{flex:1;border-radius:4px 4px 2px 2px;background:var(--c,var(--accent));min-height:3px;transform-origin:bottom;animation:barIn .7s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--i)*30ms)}
.mbars i.z{opacity:.25}
@keyframes barIn{from{transform:scaleY(0)}}
.wedit{display:flex;gap:6px;flex-wrap:wrap;margin:-6px 0 14px}
.wedit button{font-size:12.5px}
.wedit button.off{opacity:.5;text-decoration:line-through}
@media (prefers-reduced-motion:reduce){.spark path.l,.mbars i,.qa-empty-ic{animation:none;stroke-dashoffset:0}}
