/* Gesty – UI v2 (ORIAWELD premium/chłodny): podgląd jako pływający moduł w rogu, sterowanie jako kompaktowy dok */
#view{position:relative}
#gestUI{--g-top:58px;--g-bg:rgba(11,13,20,.78);--g-line:rgba(148,163,184,.22);--g-cy:#22d3ee;--g-vi:#8b5cf6;--g-tx:#e3e8ef;--g-mu:#8a94a6;
 position:absolute;inset:0;z-index:30;pointer-events:none;font:500 12px/1.2 system-ui,-apple-system,"Segoe UI",sans-serif;color:var(--g-tx)}
#gestUI>*{pointer-events:auto}
/* dok: przycisk dłoni + kamera + stan */
#gestDock{position:absolute;left:8px;bottom:8px;display:flex;align-items:center;gap:6px;padding:0;pointer-events:none}
#gestDock>*{pointer-events:auto}
#gestUI .gbtn{position:relative;width:44px;height:44px;min-height:44px;padding:0;border-radius:12px;border:1px solid var(--g-line);
 background:linear-gradient(180deg,rgba(30,36,50,.86),rgba(11,13,20,.86));color:transparent;font-size:0;overflow:hidden;cursor:pointer;
 box-shadow:0 1px 0 rgba(255,255,255,.05) inset,0 6px 18px rgba(0,0,0,.45);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
 transition:border-color .2s,box-shadow .2s,transform .15s}
#gestUI .gbtn:active{transform:scale(.96)}
#gestUI .gbtn::after{content:"";position:absolute;inset:11px;background:var(--g-tx);-webkit-mask:var(--ic) center/contain no-repeat;mask:var(--ic) center/contain no-repeat}
#gestBtn{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 12V5.5a1.5 1.5 0 0 1 3 0V11M11 10.5V4a1.5 1.5 0 0 1 3 0v7M14 10.5V5.5a1.5 1.5 0 0 1 3 0V13M8 12l-1.6-1.8a1.5 1.5 0 0 0-2.3 1.9L7.5 17a6 6 0 0 0 5 3h.5a5 5 0 0 0 5-5v-4.5a1.5 1.5 0 0 0-3 0'/%3E%3C/svg%3E")}
#gestCam{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 8h3l1.5-2h7L17 8h3v11H4z'/%3E%3Cpath d='M9 13a3 3 0 0 1 5.2-2M15 13a3 3 0 0 1-5.2 2M14.2 9.2v1.8h-1.8M9.8 16.8V15h1.8'/%3E%3C/svg%3E")}
#gestUI .gbtn.on{border-color:rgba(34,211,238,.7);box-shadow:0 0 0 1px rgba(34,211,238,.25) inset,0 6px 18px rgba(0,0,0,.45)}
#gestUI .gbtn.on::after{background:var(--g-cy)}
#gestUI .gbtn.on::before{content:"";position:absolute;right:6px;top:6px;width:5px;height:5px;border-radius:50%;background:var(--g-cy)}
/* wskaźnik stanu gestu */
#gestChip{display:flex;align-items:center;gap:6px;height:28px;padding:0 10px 0 8px;border-radius:14px;border:1px solid var(--g-line);background:var(--g-bg);
 backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:0 6px 18px rgba(0,0,0,.4);white-space:nowrap;font-size:11px;letter-spacing:.02em}
#gestChip[hidden]{display:none}
#gestChip i{width:14px;height:14px;background:var(--g-cy);-webkit-mask:var(--ic) center/contain no-repeat;mask:var(--ic) center/contain no-repeat}
#gestChip[data-g=fist] i{background:#f0a3a3}#gestChip[data-g=pinch] i{background:#a78bfa}#gestChip[data-g=lost] i,#gestChip[data-g=load] i{background:var(--g-mu)}
#gestChip[data-g=lost],#gestChip[data-g=load]{color:var(--g-mu)}
/* pływający podgląd */
#gestPv{position:absolute;width:112px;height:84px;border-radius:14px;overflow:hidden;border:1px solid rgba(148,163,184,.28);background:#05070c;
 box-shadow:0 1px 0 rgba(255,255,255,.06) inset,0 10px 28px rgba(0,0,0,.55),0 2px 6px rgba(0,0,0,.4);touch-action:none;cursor:grab;
 transition:left .22s cubic-bezier(.2,.8,.2,1),top .22s cubic-bezier(.2,.8,.2,1),width .2s,height .2s,border-radius .2s}
#gestPv[hidden]{display:none}
#gestPv.drag{transition:none;cursor:grabbing;box-shadow:0 16px 40px rgba(0,0,0,.6);border-color:rgba(34,211,238,.5)}
#gestPv video,#gestPv canvas{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
#gestPv video{opacity:.5;filter:grayscale(.4) contrast(1.05)}
#gestS{position:absolute;left:0;right:0;bottom:0;padding:3px 6px;font:10px/1.2 ui-monospace,"SF Mono",Menlo,monospace;color:#c9d2de;
 background:linear-gradient(0deg,rgba(5,7,12,.85),rgba(5,7,12,0));font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#gestMin{position:absolute;right:0;top:0;width:44px;height:44px;border:0;background:none;padding:0;cursor:pointer}
#gestMin::after{content:"";position:absolute;right:6px;top:6px;width:20px;height:20px;border-radius:7px;background:rgba(11,13,20,.7) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%23e3e8ef' stroke-width='1.4' stroke-linecap='round'%3E%3Cpath d='M6 10h8'/%3E%3C/svg%3E") center/14px no-repeat;border:1px solid rgba(148,163,184,.25)}
#gestPv.min{width:44px;height:44px;border-radius:12px;background:linear-gradient(180deg,rgba(30,36,50,.9),rgba(11,13,20,.9))}
#gestPv.min video,#gestPv.min canvas,#gestPv.min #gestS{opacity:0;visibility:hidden}
#gestPv.min #gestMin::after{inset:0;right:auto;top:auto;width:44px;height:44px;border:0;border-radius:12px;background:none}
#gestPv.min::after{content:"";position:absolute;inset:11px;pointer-events:none;background:#22d3ee;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.4' stroke-linejoin='round'%3E%3Crect x='3' y='6' width='13' height='12' rx='2'/%3E%3Cpath d='M16 10l5-3v10l-5-3z'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.4' stroke-linejoin='round'%3E%3Crect x='3' y='6' width='13' height='12' rx='2'/%3E%3Cpath d='M16 10l5-3v10l-5-3z'/%3E%3C/svg%3E") center/contain no-repeat}
@media (prefers-reduced-motion:reduce){#gestPv,#gestUI .gbtn{transition:none}}

/* BETA (v95) */
#gestBtn{position:relative}
#gestBtn .gestBeta{position:absolute;top:2px;right:2px;font:700 8px/1 system-ui,sans-serif;letter-spacing:.04em;padding:2px 3px;border-radius:6px;background:#ffb020;color:#1a1200;pointer-events:none;box-shadow:0 0 0 1.5px #0b0d14}
#gestNote{font:500 11px/1.3 system-ui,sans-serif;color:#ffd38a;background:rgba(11,13,20,.82);border:1px solid rgba(255,176,32,.45);border-radius:8px;padding:4px 8px;max-width:220px}
#gestNote[hidden]{display:none}
#gestDock #gestNote{position:absolute;left:0;bottom:calc(100% + 6px);width:max-content;max-width:min(240px,70vw);pointer-events:none;display:block}
#gestDock #gestNote[hidden]{display:none}
#view:has(#gestNote:not([hidden]))>.gest{display:none!important}