/* ============================================================
   PRIZMA panel  -  neutral chrome, independent of project tokens.
   Floating, draggable, resizable, minimisable. Own light/dark.
   ============================================================ */
.prizma,.prizma *{box-sizing:border-box}
.prizma{
  --pz-bg:#ffffff;--pz-fg:#1a1c20;--pz-muted:#6b7280;--pz-faint:#9aa0a8;
  --pz-line:#e8e9ec;--pz-soft:#f5f6f7;--pz-soft2:#eceef0;--pz-accent:#1a1c20;
  --pz-accent-fg:#ffffff;--pz-shadow:0 24px 70px rgba(15,17,21,.28);
  position:fixed;z-index:2147483000;width:380px;height:74vh;min-width:320px;min-height:340px;
  max-width:96vw;max-height:94vh;right:22px;bottom:88px;
  background:var(--pz-bg);color:var(--pz-fg);
  border:1px solid var(--pz-line);border-radius:18px;
  box-shadow:var(--pz-shadow);
  display:flex;flex-direction:column;overflow:hidden;resize:both;
  font-family:"Google Sans Flex","Inter",system-ui,sans-serif;font-size:13px;
  opacity:0;transform:translateY(8px) scale(.99);pointer-events:none;
  transition:opacity .22s ease,transform .22s cubic-bezier(.4,0,.2,1);
}
.prizma.open{opacity:1;transform:none;pointer-events:auto}
.prizma.dark{--pz-bg:#141418;--pz-fg:#f4f4f5;--pz-muted:#9ca3af;--pz-faint:#6b7280;--pz-line:#2a2a31;--pz-soft:#1d1d22;--pz-soft2:#26262c;--pz-accent:#f4f4f5;--pz-accent-fg:#141418}
.prizma.min{height:auto!important;min-height:0;resize:none}
.prizma.min .pz-body,.prizma.min .pz-foot,.prizma.min .pz-menu{display:none}

/* header (drag handle) */
.pz-head{display:flex;align-items:center;gap:10px;padding:13px 14px;cursor:grab;user-select:none;border-bottom:1px solid var(--pz-line)}
.pz-head:active{cursor:grabbing}
.pz-logo{width:26px;height:26px;border-radius:7px;flex:none;display:grid;place-items:center;background:var(--pz-accent)}
.pz-logo svg{width:15px;height:15px;color:var(--pz-accent-fg)}
.pz-title{font-weight:700;letter-spacing:.16em;font-size:14px}
.pz-count{font-size:12px;color:var(--pz-faint);font-weight:600;margin-left:2px}
.pz-tools{display:flex;gap:2px;margin-left:auto}
.pz-tool{width:30px;height:30px;border-radius:8px;border:1px solid transparent;background:none;color:var(--pz-muted);display:grid;place-items:center;cursor:pointer;transition:background .15s ease,color .15s ease,border-color .15s ease}
.pz-tool:hover{background:var(--pz-soft);color:var(--pz-fg);border-color:var(--pz-line)}
.pz-tool.act{background:var(--pz-soft);color:var(--pz-fg)}
.pz-tool svg{width:16px;height:16px}

/* mini-menu */
.pz-menu{display:flex;gap:4px;padding:10px 12px 0;flex-wrap:wrap}
.pz-mi{display:inline-flex;align-items:center;gap:6px;padding:7px 11px;border-radius:9px;font-size:12.5px;font-weight:500;color:var(--pz-muted);cursor:pointer;border:1px solid transparent;transition:background .15s ease,color .15s ease}
.pz-mi svg{width:14px;height:14px}
.pz-mi:hover{background:var(--pz-soft)}
.pz-mi.act{background:var(--pz-soft2);color:var(--pz-fg)}

.pz-body{flex:1;overflow-y:auto;padding:12px 14px 22px}
.pz-seg{display:flex;background:var(--pz-soft);border-radius:10px;padding:3px;gap:3px;margin-bottom:12px}
.pz-seg button{flex:1;border:0;background:none;padding:8px;border-radius:7px;cursor:pointer;font:inherit;font-size:12.5px;font-weight:600;color:var(--pz-muted);transition:background .15s ease,color .15s ease}
.pz-seg button.on{background:var(--pz-bg);color:var(--pz-fg);box-shadow:0 1px 3px rgba(0,0,0,.12)}
.prizma.dark .pz-seg button.on{box-shadow:0 1px 3px rgba(0,0,0,.4)}

.pz-grp{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--pz-faint);font-weight:700;margin:14px 0 8px}
.pz-grp:first-child{margin-top:2px}
.pz-empty{color:var(--pz-faint);font-size:12.5px;padding:18px 4px;text-align:center;line-height:1.5}

/* color/token row */
.pz-var{display:flex;align-items:center;gap:11px;padding:6px 0}
.pz-sw{width:34px;height:34px;border-radius:9px;border:1px solid var(--pz-line);flex:none;cursor:pointer;position:relative;overflow:hidden;background-image:linear-gradient(45deg,#0001 25%,transparent 25%,transparent 75%,#0001 75%),linear-gradient(45deg,#0001 25%,transparent 25%,transparent 75%,#0001 75%);background-size:10px 10px;background-position:0 0,5px 5px}
.pz-sw i{position:absolute;inset:0}
.pz-sw input{position:absolute;inset:-6px;width:160%;height:160%;cursor:pointer;opacity:0}
.pz-meta{flex:1;min-width:0}
.pz-name{font-size:13px;font-weight:500;font-family:ui-monospace,monospace;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pz-val{font-size:11px;color:var(--pz-faint);font-family:ui-monospace,monospace}
.pz-badge{display:inline-block;font-size:10px;font-weight:600;padding:1px 6px;border-radius:5px;border:1px solid var(--pz-line);color:var(--pz-muted);margin-top:3px}
.pz-op{width:74px;flex:none}
.pz-op input{width:100%;accent-color:var(--pz-accent)}
.pz-rev{width:24px;height:24px;border:0;background:none;color:var(--pz-faint);cursor:pointer;border-radius:6px;flex:none;display:grid;place-items:center;transition:background .15s ease,color .15s ease}
.pz-rev:hover{background:var(--pz-soft);color:var(--pz-fg)}
.pz-rev svg{width:13px;height:13px}

/* quick chips / presets */
.pz-chips{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:6px}
.pz-chip{padding:7px 12px;border-radius:9px;border:1px solid var(--pz-line);background:var(--pz-bg);color:var(--pz-fg);font:inherit;font-size:12.5px;font-weight:500;cursor:pointer;transition:background .15s ease,border-color .15s ease,transform .12s ease}
.pz-chip:hover{background:var(--pz-soft);transform:translateY(-1px)}
.pz-chip.on{border-color:var(--pz-accent);background:var(--pz-soft2)}
.pz-grads{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:10px}
.pz-grad{height:38px;flex:1;min-width:70px;border-radius:9px;border:1px solid var(--pz-line);cursor:pointer;transition:transform .12s ease,box-shadow .15s ease}
.pz-grad:hover{transform:translateY(-1px);box-shadow:0 5px 14px rgba(0,0,0,.16)}
.pz-field{margin:12px 0}
.pz-field label{font-size:12px;font-weight:600;display:flex;justify-content:space-between;color:var(--pz-muted)}
.pz-field input[type=range]{width:100%;accent-color:var(--pz-accent);margin-top:7px}
.pz-note{font-size:12px;color:var(--pz-faint);line-height:1.5;margin-top:10px}

/* preview row */
.pz-prev{display:flex;gap:7px;margin-top:6px}
.pz-prev button{flex:1;border:1px solid var(--x-border,var(--pz-line));border-radius:9px;padding:9px;font:inherit;font-size:12.5px;font-weight:600;cursor:pointer;transition:filter .15s ease}
.pz-prev .pp{background:var(--x-accent,#1a1c20);color:var(--x-accent-fg,#fff);border-color:transparent}
.pz-prev .ps{background:var(--x-fg,#1a1c20);color:var(--x-bg,#fff);border-color:transparent}
.pz-prev .pg{background:transparent;color:var(--x-fg,#1a1c20)}
.pz-prev button:hover{filter:brightness(1.06)}

.pz-out{width:100%;height:300px;font-family:ui-monospace,monospace;font-size:11px;line-height:1.55;background:var(--pz-soft);color:var(--pz-fg);border:1px solid var(--pz-line);border-radius:11px;padding:12px;resize:none;white-space:pre;overflow:auto}

.pz-foot{display:flex;gap:8px;padding:11px 14px;border-top:1px solid var(--pz-line)}
.pz-foot button{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:7px;padding:11px;border-radius:11px;font:inherit;font-size:13px;font-weight:600;cursor:pointer;border:1px solid var(--pz-line);transition:background .15s ease,transform .12s ease}
.pz-foot button:active{transform:translateY(1px)}
.pz-foot .pz-copy{background:var(--pz-accent);color:var(--pz-accent-fg);border-color:transparent}
.pz-foot .pz-reset{background:var(--pz-bg);color:var(--pz-fg)}
.pz-foot .pz-reset:hover{background:var(--pz-soft)}
.pz-foot button svg{width:15px;height:15px}

/* resize affordance */
.prizma::after{content:"";position:absolute;right:3px;bottom:3px;width:12px;height:12px;pointer-events:none;
  background:linear-gradient(135deg,transparent 45%,var(--pz-faint) 45%,var(--pz-faint) 55%,transparent 55%,transparent 70%,var(--pz-faint) 70%,var(--pz-faint) 80%,transparent 80%);opacity:.7}

/* FAB */
.pz-fab{position:fixed;right:22px;bottom:22px;z-index:2147482000;width:54px;height:54px;border-radius:16px;border:0;cursor:pointer;display:grid;place-items:center;background:conic-gradient(from 210deg,#ff5d8f,#ffb35d,#5dffb3,#5db3ff,#9b5dff,#ff5d8f);box-shadow:0 10px 30px rgba(0,0,0,.28);transition:transform .18s ease,box-shadow .18s ease}
.pz-fab:hover{transform:translateY(-2px) rotate(-4deg);box-shadow:0 14px 36px rgba(0,0,0,.34)}
.pz-fab svg{width:24px;height:24px;color:#fff;filter:drop-shadow(0 1px 2px rgba(0,0,0,.32))}

.pz-toast{position:fixed;left:50%;bottom:26px;transform:translateX(-50%) translateY(12px);z-index:2147483600;background:#1a1c20;color:#fff;padding:10px 16px;border-radius:11px;font-size:13px;font-weight:500;font-family:"Google Sans Flex","Inter",sans-serif;box-shadow:0 12px 30px rgba(0,0,0,.3);opacity:0;pointer-events:none;transition:opacity .2s ease,transform .2s ease}
.pz-toast.show{opacity:1;transform:translateX(-50%)}

.pz-back{position:fixed;left:14px;bottom:14px;z-index:30;display:inline-flex;align-items:center;gap:7px;padding:8px 13px;border-radius:10px;background:var(--x-panel,#fff);border:1px solid var(--x-border,#e5e7eb);color:var(--x-muted-fg,#6b7280);text-decoration:none;font-size:13px;font-weight:500;font-family:"Google Sans Flex","Inter",sans-serif;transition:background .18s ease,color .18s ease}
.pz-back:hover{background:var(--x-soft,#f4f4f5);color:var(--x-fg,#111)}
.pz-back svg{width:15px;height:15px}
@media(max-width:760px){.prizma{width:94vw;height:80vh;right:3vw;left:3vw;bottom:84px}.pz-back{display:none}}

/* ---- object picker ---- */
.pz-pick-overlay{position:fixed;z-index:2147483646;pointer-events:none;border:2px solid var(--pz-accent,#7c5cff);background:color-mix(in srgb,var(--pz-accent,#7c5cff) 12%,transparent);border-radius:3px;box-shadow:0 0 0 1px rgba(255,255,255,.45);transition:left .05s linear,top .05s linear,width .05s linear,height .05s linear}
.pz-pick-overlay.sel{background:color-mix(in srgb,var(--pz-accent,#7c5cff) 8%,transparent);box-shadow:0 0 0 1px rgba(255,255,255,.45),0 6px 20px rgba(0,0,0,.18)}
html.pz-picking,html.pz-picking *{cursor:crosshair !important}
html.pz-picking #pz-root,html.pz-picking #pz-root *{cursor:default !important}
.pz-objhead{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:2px 0 8px;font-size:12px}
.pz-objhead b{font-size:12px}
.pz-objcls{color:var(--pz-muted);font-size:11px;word-break:break-all}
.pz-objclear{background:transparent;border:1px solid var(--pz-line);color:var(--pz-muted);border-radius:7px;padding:4px 9px;font-size:11px;cursor:pointer;white-space:nowrap;transition:border-color .15s ease,color .15s ease}
.pz-objclear:hover{color:var(--pz-fg);border-color:var(--pz-fg)}
.pz-tokchip{display:inline-block;background:var(--pz-soft);border:1px solid var(--pz-line);border-radius:5px;padding:0 6px;font-size:10px;line-height:16px;cursor:pointer;color:var(--pz-muted);transition:color .15s ease,border-color .15s ease}
.pz-tokchip:hover{color:var(--pz-fg);border-color:var(--pz-fg)}
.pz-var.pz-flash{animation:pzflash 1.1s ease}
@keyframes pzflash{0%,100%{background:transparent}30%{background:color-mix(in srgb,var(--pz-accent,#7c5cff) 18%,transparent)}}

/* ---- undo + history ---- */
.pz-tool.dis{opacity:.32;pointer-events:none}
.pz-hist{display:flex;align-items:center;gap:10px;padding:8px 9px;border:1px solid var(--pz-line);border-radius:9px;margin-bottom:6px;cursor:pointer;transition:border-color .15s ease,background .15s ease}
.pz-hist:hover{border-color:var(--pz-accent,#7c5cff);background:var(--pz-soft)}
.pz-hi-dot{width:7px;height:7px;border-radius:50%;background:var(--pz-accent,#7c5cff);flex:none}
.pz-hi-meta{flex:1;min-width:0}
.pz-hi-label{font-size:12px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pz-hi-sub{font-size:10px;color:var(--pz-muted)}
.pz-hi-rev{display:flex;color:var(--pz-muted)}
.pz-hi-rev svg{width:14px;height:14px}