/* ONDATIVA 5.20 — Backlight radial, never a solid rectangle. LED hue remains
   consistently vibrant across light and dark vertical parts of the palette. */
.lab-palette-wrap{
 position:relative;isolation:isolate;height:390px;max-width:100%;margin:0 0 20px;
 --lab-rgb:50,221,194;--lab-x:49%;--lab-y:51%;
}
/* Wide elliptical spill: curved diffusion with a fully transparent outer edge. */
.lab-palette-wrap::before{
 content:"";position:absolute;pointer-events:none;z-index:0;
 inset:-84px -94px -100px;border-radius:50%;
 background:radial-gradient(ellipse 74% 75% at 50% 50%,
   rgba(var(--lab-rgb),.93) 0%,
   rgba(var(--lab-rgb),.79) 29%,
   rgba(var(--lab-rgb),.53) 47%,
   rgba(var(--lab-rgb),.25) 66%,
   rgba(var(--lab-rgb),0) 87%);
 filter:blur(28px);opacity:1;
}
/* The close-to-panel spill is ALSO radial, not a solid colored rectangle. */
.lab-palette-wrap::after{
 content:"";position:absolute;pointer-events:none;z-index:1;
 inset:-50px -56px -57px;border-radius:50%;
 background:radial-gradient(ellipse 75% 77% at 50% 50%,
   rgba(var(--lab-rgb),.97) 0%,
   rgba(var(--lab-rgb),.88) 28%,
   rgba(var(--lab-rgb),.61) 48%,
   rgba(var(--lab-rgb),.29) 65%,
   rgba(var(--lab-rgb),0) 86%);
 filter:blur(19px);opacity:1;
}
.lab-palette-surface{
 position:relative;z-index:2;display:block;width:100%;height:100%;overflow:hidden;
 border-radius:18px;isolation:isolate;cursor:crosshair;user-select:none;-webkit-user-select:none;
 border:1px solid rgba(217,255,252,.24);background:#071f2c;touch-action:pan-y;
 /* espessura fisica na base, sombra longa e reflexos metalicos discretos */
 transform:translateY(-12px);
 box-shadow:
  0 5px 0 -1px #0d303b,
  0 12px 0 -3px #031822,
  0 28px 28px -5px rgba(0,9,19,.94),
  0 54px 55px -9px rgba(0,12,22,.75),
  0 84px 90px -14px rgba(0,10,18,.50),
  inset 0 1px 0 rgba(255,255,255,.39),
  inset 0 -18px 24px rgba(0,10,22,.22);
}
.lab-palette-surface:focus-visible{outline:3px solid #a5ffe7;outline-offset:5px;}
.lab-palette-spectrum{position:absolute;inset:0;pointer-events:none;
 background:linear-gradient(to bottom,rgba(255,255,255,.86) 0%,rgba(255,255,255,.26) 26%,transparent 52%,rgba(0,0,0,.34) 84%,rgba(2,15,23,.70) 100%),
 linear-gradient(to right,#ff4053 0%,#ffbb38 14%,#e6eb42 21%,#54f28c 35%,#34dfce 49%,#4aa7ff 63%,#7951f1 77%,#ee53be 90%,#ff4053 100%);
 filter:saturate(1.13);}
.lab-palette-grid{position:absolute;inset:0;pointer-events:none;opacity:.19;
 background:repeating-linear-gradient(to right,rgba(3,14,27,.40) 0 1px,transparent 1px 26px),repeating-linear-gradient(to bottom,rgba(3,14,27,.40) 0 1px,transparent 1px 26px);
 mix-blend-mode:multiply;}
.lab-palette-sheen{position:absolute;inset:0;pointer-events:none;
 background:linear-gradient(135deg,rgba(255,255,255,.14),transparent 24%,transparent 74%,rgba(8,20,29,.16)),radial-gradient(ellipse at 18% 9%,rgba(255,255,255,.20),transparent 38%);}
.lab-palette-selection{position:absolute;pointer-events:none;left:var(--lab-x);top:var(--lab-y);
 width:24px;height:24px;border-radius:50%;transform:translate(-50%,-50%);
 border:2px solid rgba(255,255,255,.94);box-shadow:0 0 0 1px rgba(5,18,25,.52),0 0 0 6px rgba(255,255,255,.13),0 4px 16px rgba(0,0,0,.29);
 background:radial-gradient(circle at 35% 28%,rgba(255,255,255,.34),transparent 47%),var(--lab-led);
 transition:width .18s,height .18s;}
.lab-palette-surface:hover .lab-palette-selection,.lab-palette-surface:focus-visible .lab-palette-selection{width:28px;height:28px;}
@media(max-width:850px){
 .lab-palette-wrap{height:340px}
 .lab-palette-wrap::before{inset:-72px -66px -78px}
 .lab-palette-wrap::after{inset:-39px -43px -44px}
}
@media(max-width:600px){
 .lab-palette-wrap{height:280px;margin-bottom:4px}
 .lab-palette-wrap::before{inset:-50px -38px -55px;filter:blur(20px)}
 .lab-palette-wrap::after{inset:-28px -25px -31px;filter:blur(13px)}
 .lab-palette-surface{border-radius:14px;transform:translateY(-8px);
   box-shadow:0 4px 0 -1px #0d303b,0 9px 0 -3px #031822,0 25px 22px -6px rgba(0,9,19,.9),0 43px 34px -6px rgba(0,12,22,.67),inset 0 1px 0 rgba(255,255,255,.35)}
}
@media(prefers-reduced-motion:reduce){.lab-palette-wrap::before,.lab-palette-selection{transition:none}}