/* canvas.css — LensWave infinite canvas skeleton (dark, dot grid) */
.cw{height:100vh;display:flex;flex-direction:column;overflow:hidden;
  background:#1B1E28;color:#E8EBF2;font-family:Inter,system-ui,-apple-system,sans-serif;}

/* ---------- top bar (Figma standard: 48px) ---------- */
.cw-topbar{height:48px;flex:0 0 48px;display:flex;align-items:center;justify-content:space-between;
  padding:0 12px;background:#1E1E1E;border-bottom:1px solid #2C2C2C;z-index:30;}
.cw-tb-left,.cw-tb-right{display:flex;align-items:center;gap:8px;}
.cw-tb-right{margin-left:auto;}
.cw-brand{display:flex;align-items:center;gap:8px;font-weight:800;font-size:15px;}
.cw-brand-ico{width:22px;height:22px;border-radius:6px;display:grid;place-items:center;font-size:13px;color:#fff;
  background:linear-gradient(135deg,#4B7DFF,#7DD3FC);}
.cw-title{height:30px;min-width:90px;padding:0 12px;display:inline-flex;align-items:center;
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);border-radius:8px;
  font-size:13.5px;font-weight:600;outline:none;cursor:text;}
.cw-title:focus{border-color:#4B7DFF;background:rgba(75,125,255,.08);}
.cw-canvas-sel{display:inline-flex;align-items:center;gap:5px;height:30px;padding:0 10px;
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);border-radius:8px;font-size:12.5px;color:#9AA3B5;}
.cw-tb-iconbtn{width:32px;height:32px;display:inline-grid;place-items:center;border-radius:8px;cursor:pointer;
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);color:#C7CDDB;}
.cw-tb-iconbtn:hover{background:rgba(255,255,255,.11);}
.cw-tb-plus{background:#4B7DFF;border-color:transparent;color:#fff;}
.cw-credits{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 11px;border-radius:999px;
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);color:#E8EBF2;
  font-size:12.5px;font-weight:700;cursor:pointer;}
.cw-upgrade{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 12px;border-radius:999px;
  background:linear-gradient(135deg,#4B7DFF,#7DD3FC);border:0;color:#fff;
  font-size:12.5px;font-weight:800;cursor:pointer;}
.cw-avatar{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;font-size:11px;font-weight:700;
  color:#fff;background:linear-gradient(135deg,#7c8cff,#5b6cff);}

/* ---------- stage / world ---------- */
.cw-body{flex:1;display:flex;min-height:0;}
.cw-stage{flex:1;position:relative;overflow:hidden;cursor:grab;
  background-color:#1E1E1E;
  background-image:radial-gradient(rgba(255,255,255,.08) 1px, transparent 1px);
  background-size:16px 16px;}
.cw-stage.dragging{cursor:grabbing;}
.cw-world{position:absolute;left:0;top:0;transform-origin:0 0;}
.cw-wires{position:absolute;left:0;top:0;overflow:visible;pointer-events:none;}
.cw-empty-hint{position:absolute;left:50%;top:46%;transform:translate(-50%,-50%);
  color:#9AA3B5;font-size:14px;pointer-events:none;letter-spacing:.2px;}
.cw-stage.has-nodes .cw-empty-hint{display:none;}

/* ---------- node cards ---------- */
.cw-node{position:absolute;width:300px;cursor:pointer;}
.cw-node .n-title{display:flex;align-items:center;gap:6px;font-size:12px;color:#9AA3B5;padding:0 4px 6px;}
.cw-node .n-title .n-t-ico{color:#6B7385;}
.cw-node .n-card{background:#2A2E3A;border:1px solid rgba(255,255,255,.08);border-radius:8px;
  box-shadow:0 4px 12px rgba(0,0,0,.25);overflow:hidden;transition:box-shadow .15s,border-color .15s;}
.cw-node.selected .n-card{border-color:rgba(255,255,255,.95);
  box-shadow:0 0 0 1px rgba(255,255,255,.9),0 4px 12px rgba(0,0,0,.25);} /* R4-K: white outline per drawing c1 */
.cw-node .n-preview{height:120px;display:grid;place-items:center;color:#6B7385;background:#20242f;position:relative;}
.cw-node .n-preview svg{width:46px;height:46px;}
.cw-node .n-try{padding:10px 14px 12px;}
.cw-node .n-try-label{font-size:12px;color:#6B7385;margin-bottom:8px;}
.cw-node .n-try-item{display:flex;align-items:center;gap:9px;font-size:13px;color:#E8EBF2;padding:5px 0;}
.cw-node .n-try-item .n-t-ico{width:18px;text-align:center;color:#9AA3B5;font-size:13px;}
.cw-node .n-tools{display:flex;gap:6px;padding:0 12px 12px;flex-wrap:wrap;}
.cw-node .n-tool{font-size:11px;color:#9AA3B5;background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.07);border-radius:7px;padding:4px 9px;cursor:pointer;}
.cw-node .n-tool:hover{background:rgba(255,255,255,.12);}
.cw-node .port{position:absolute;top:50%;width:18px;height:18px;border-radius:50%;
  background:#2A2E3A;border:1.5px solid rgba(255,255,255,.35);color:#9AA3B5;
  display:grid;place-items:center;font-size:13px;line-height:1;transform:translateY(-50%);z-index:2;}
.cw-node .port-in{left:-9px;} .cw-node .port-out{right:-9px;}
.cw-node .port:hover{border-color:#7DD3FC;color:#7DD3FC;}
/* R141 P0-1: per-type handle color (uses --tc set on node) — B8-2 9-color data-type palette */
.cw-node .port{border-color:var(--tc,#7DD3FC);color:var(--tc,#7DD3FC);background:#1a1d26;}
.cw-node[data-type="text"] .port{--tc:#7c4dff;}
.cw-node[data-type="image"] .port{--tc:#A855F7;}   /* IMAGE 紫 */
.cw-node[data-type="video"] .port{--tc:#F97316;}   /* VIDEO 橙 */
.cw-node[data-type="audio"] .port{--tc:#22C55E;}   /* AUDIO 绿 */
.cw-node[data-type="script"] .port{--tc:#06B6D4;}  /* script 青 */
.cw-node[data-type="director"] .port{--tc:#6366F1;} /* director 靛 */
.cw-node[data-type="smartedit"] .port{--tc:#EC4899;} /* smartedit 粉 */
/* B8-6: model chip in node header */
.n-model-chip{display:inline-flex;align-items:center;gap:4px;margin-left:8px;padding:1px 7px;border-radius:6px;
  font-size:10px;font-weight:700;letter-spacing:.3px;background:rgba(75,125,255,.15);color:#7DD3FC;
  border:1px solid rgba(125,211,252,.25);max-width:140px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
/* Figma/tldraw standard: ports fade in on node hover/select, no "+" glyph */
.cw-node .port{font-size:0;opacity:0;transition:opacity .15s ease,transform .15s ease;transform:translateY(-50%) scale(.8);}
.cw-node:hover .port,.cw-node.selected .port{opacity:1;transform:translateY(-50%) scale(1);}
.cw-node .port:hover{opacity:1;}

/* ---------- right params drawer ---------- */
.cw-params[hidden]{display:none;}
.cw-params{position:fixed;top:56px;right:12px;bottom:48px;width:280px;z-index:40;
  background:rgba(34,38,51,.96);backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.08);
  border-radius:14px;box-shadow:0 18px 50px rgba(0,0,0,.5);padding:14px;
  display:flex;flex-direction:column;gap:10px;overflow:auto;}
.cw-p-head{display:flex;align-items:center;justify-content:space-between;}
.cw-p-title{font-size:13px;font-weight:700;}
.cw-p-close{background:none;border:0;color:#9AA3B5;font-size:18px;cursor:pointer;}
.cw-field{display:flex;flex-direction:column;gap:5px;margin-bottom:8px;}
.cw-field label{font-size:11px;color:#9AA3B5;}
.cw-field select,.cw-field textarea{background:#20242f;border:1px solid rgba(255,255,255,.08);
  color:#E8EBF2;border-radius:8px;padding:8px 10px;font-size:12.5px;font-family:inherit;}
.cw-field textarea{min-height:64px;resize:vertical;}
.cw-p-cost{font-size:11.5px;color:#7DD3FC;background:rgba(75,125,255,.08);
  border:1px solid rgba(75,125,255,.2);padding:7px 10px;border-radius:8px;}
.cw-btn{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);color:#E8EBF2;
  border-radius:8px;padding:8px 12px;font-size:12.5px;cursor:pointer;}
.cw-btn-primary{background:#4B7DFF;border-color:transparent;color:#fff;font-weight:800;}
.cw-p-gen{padding:11px;font-size:13.5px;}

/* ---------- bottom bar (Figma standard: 36px) ---------- */
/* R764: floating capsule instead of full-width static bar */
.cw-bottom{
  position:fixed; bottom:16px; left:50%; transform:translateX(-50%);
  width:auto; max-width:min(480px, 30vw); overflow-x:auto; overflow-y:hidden;
  height:44px; display:flex; align-items:center; justify-content:space-between;
  padding:0 16px; background:rgba(30,30,30,0.92); backdrop-filter:blur(8px);
  border:1px solid rgba(255,255,255,.08); border-radius:12px;
  box-shadow:0 4px 20px rgba(0,0,0,.4);
  z-index:100;}
.cw-b-left,.cw-b-right{display:flex;align-items:center;gap:10px;}
.cw-asset-mgr{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;color:#9AA3B5;}
.cw-b-ico{width:28px;height:28px;display:grid;place-items:center;border-radius:7px;color:#9AA3B5;cursor:pointer;}
.cw-b-ico:hover{background:rgba(255,255,255,.08);}
.cw-zoom{display:inline-flex;align-items:center;gap:4px;margin-left:4px;}
.cw-zbtn{width:24px;height:24px;border-radius:6px;border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.05);color:#E8EBF2;cursor:pointer;}
.cw-zval{font-size:12px;min-width:42px;text-align:center;color:#E8EBF2;}
.cw-b-center{position:absolute;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:4px;
  padding:6px 10px;border-radius:14px;background:rgba(34,38,51,.96);
  border:1px solid rgba(255,255,255,.08);box-shadow:0 10px 30px rgba(0,0,0,.45);}
.cw-tool{width:34px;height:34px;display:grid;place-items:center;border-radius:10px;color:#9AA3B5;cursor:pointer;}
.cw-tool:hover{background:rgba(255,255,255,.08);color:#E8EBF2;}
.cw-tool.on{background:#fff;color:#1B1E28;}
.cw-tvdir{display:inline-flex;align-items:center;gap:7px;font-weight:800;font-size:13px;}
.cw-tvdir-orb{width:22px;height:22px;border-radius:50%;background:linear-gradient(135deg,#7DD3FC,#7c8cff);}
.cw-tvdir-input{width:230px;height:38px;padding:0 12px;border-radius:12px;background:rgba(34,38,51,.96);
  border:1px solid rgba(255,255,255,.08);color:#E8EBF2;font-size:12.5px;outline:none;}
.cw-tvdir-input::placeholder{color:#6B7385;}

/* ---------- popups (add-node menu / Try context menu) ---------- */
.cw-menu{position:fixed;z-index:5000;min-width:230px;padding:6px;border-radius:14px;
  background:rgba(34,38,51,.97);backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.08);
  box-shadow:0 18px 50px rgba(0,0,0,.55);color:#E8EBF2;}
.cw-menu-sec{font-size:11px;letter-spacing:.8px;text-transform:uppercase;color:#6B7385;font-weight:700;padding:8px 12px 4px;}
.cw-menu-item{display:flex;align-items:center;gap:10px;width:100%;padding:9px 12px;border:0;border-radius:9px;
  background:transparent;color:#E8EBF2;font-size:13.5px;cursor:pointer;text-align:left;}
.cw-menu-item:hover{background:rgba(75,125,255,.12);}
.cw-menu-ico{width:26px;height:26px;border-radius:8px;display:grid;place-items:center;font-size:11px;
  background:rgba(255,255,255,.07);}
.cw-menu-tag{margin-left:auto;font-size:9.5px;font-weight:800;color:#7DD3FC;}
.cw-menu-tag.beta{color:#9AA3B5;}
.cw-menu-key{margin-left:auto;font-size:11px;color:#6B7385;}
.cw-menu-sep{height:1px;background:rgba(255,255,255,.07);margin:5px 8px;}
.cw-menu-check{width:16px;height:16px;border-radius:5px;flex:none;display:grid;place-items:center;
  border:1.5px solid #6B7385;font-size:11px;color:#fff;}
.cw-menu-item.checked .cw-menu-check{background:#4B7DFF;border-color:#4B7DFF;}
.cw-menu-item.disabled{opacity:.38;cursor:default;}
.cw-menu-item.disabled:hover{background:transparent;}
.cw-menu-rating{display:flex;align-items:center;gap:10px;padding:9px 12px;font-size:13px;color:#e5e7eb;}
.cw-menu-rating-label{font-weight:600;}
.cw-menu-stars{margin-left:auto;font-size:13px;color:#6B7385;letter-spacing:2px;}

/* ---------- Mode1: floating param bar below selected node ---------- */
.cw-node-bar{position:absolute;width:660px;max-width:80vw;background:rgba(34,38,51,.97);
  backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.1);border-radius:12px;
  box-shadow:0 14px 40px rgba(0,0,0,.5);padding:10px 12px;z-index:5;}
.cw-node-bar.collapsed .cw-nb-row{display:none;}
.cw-nb-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.cw-nb-btn{display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 12px;border-radius:8px;
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);color:#E8EBF2;
  font-size:12.5px;cursor:pointer;}
.cw-nb-btn:hover{background:rgba(255,255,255,.12);}
.cw-nb-btn.at::before{content:"@";color:#7DD3FC;font-weight:800;}
.cw-nb-more{margin-left:auto;color:#7DD3FC;font-size:12px;background:none;border:none;cursor:pointer;}
.cw-nb-toggle{width:100%;text-align:right;font-size:11px;color:#6B7385;background:none;border:none;cursor:pointer;padding:2px 2px 0;}

/* ---------- Mode2: double-click expanded node ---------- */
.cw-node.expanded{width:1244px;max-width:90vw;z-index:6;}
.cw-node.expanded .n-preview{height:280px;}
.cw-node.expanded .n-headline{font-size:24px;font-weight:700;color:#E8EBF2;padding:14px 16px 6px;}
.cw-node.expanded .n-try{display:none;}
.cw-expand-controls{display:none;padding:4px 16px 16px;flex-direction:column;gap:10px;}
.cw-node.expanded .cw-expand-controls{display:flex;}
.cw-ec-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.cw-ec-btn{height:34px;padding:0 14px;border-radius:9px;background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.1);color:#E8EBF2;font-size:12.5px;cursor:pointer;}
.cw-ec-btn.accent{background:#4B7DFF;border-color:transparent;color:#fff;font-weight:700;}
.cw-ec-sep{flex:1;}

/* ---------- Mode3: empty viewport + side plus buttons ---------- */
.cw-empty-view{position:absolute;left:50%;bottom:88px;transform:translateX(-50%);z-index:20;
  display:none;align-items:center;gap:10px;padding:9px 14px;pointer-events:auto;
  background:rgba(34,38,51,.96);border:1px solid rgba(255,255,255,.1);border-radius:12px;
  box-shadow:0 10px 30px rgba(0,0,0,.45);}
.cw-empty-view.show{display:flex;}
.cw-empty-view .ev-msg{font-size:13px;color:#C7CDDB;}
.cw-empty-view .ev-btn{height:30px;padding:0 14px;border-radius:8px;background:rgba(255,255,255,.1);
  border:1px solid rgba(255,255,255,.12);color:#E8EBF2;font-weight:600;font-size:12.5px;cursor:pointer;}
.cw-empty-view .ev-close{width:26px;height:26px;border-radius:8px;display:grid;place-items:center;
  background:none;border:0;color:#9AA3B5;font-size:16px;cursor:pointer;}
.cw-empty-view .ev-close:hover{background:rgba(255,255,255,.1);color:#E8EBF2;}
.cw-side-plus{position:absolute;top:50%;transform:translateY(-50%);z-index:15;width:40px;height:40px;
  border-radius:50%;display:grid;place-items:center;cursor:pointer;
  background:rgba(34,38,51,.95);border:1px solid rgba(255,255,255,.14);color:#E8EBF2;
  box-shadow:0 6px 18px rgba(0,0,0,.4);font-size:20px;line-height:1;}
.cw-side-plus:hover{border-color:#7DD3FC;color:#7DD3FC;}
.cw-side-plus.left{left:14px;} .cw-side-plus.right{right:14px;}

/* inline param bar model row (replaces right drawer) */
.cw-nb-select{height:32px;background:#20242f;border:1px solid rgba(255,255,255,.1);color:#E8EBF2;
  border-radius:8px;padding:0 8px;font-size:12.5px;}
.cw-nb-cost{font-size:11.5px;color:#7DD3FC;}
.cw-nb-gen{height:32px;padding:0 16px;border-radius:8px;border:0;background:#4B7DFF;color:#fff;font-weight:800;cursor:pointer;}

/* g4: rich param bar (3-row dark panel below node) */
.cw-node-bar{width:660px;max-width:86vw;padding:12px;display:flex;flex-direction:column;gap:10px;}
.cw-zb-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.cw-zb-pill{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 11px;border-radius:8px;
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);color:#C7CDDB;font-size:12.5px;cursor:pointer;}
.cw-zb-pill:hover{background:rgba(255,255,255,.12);}
.cw-zb-desc{width:100%;min-height:34px;background:transparent;border:0;outline:none;color:#9AA3B5;
  font-size:13px;font-family:inherit;resize:none;}
.cw-zb-desc::placeholder{color:#6B7385;}
.cw-zb-select{height:30px;background:#20242f;border:1px solid rgba(255,255,255,.1);color:#E8EBF2;
  border-radius:8px;padding:0 8px;font-size:12.5px;}
.cw-zb-chip{height:30px;display:inline-flex;align-items:center;gap:5px;padding:0 10px;border-radius:8px;
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);color:#C7CDDB;font-size:12px;}
.cw-zb-sep{width:1px;height:20px;background:rgba(255,255,255,.1);}
.cw-zb-send{margin-left:auto;width:34px;height:34px;border-radius:10px;border:0;background:#4B7DFF;color:#fff;
  font-size:16px;cursor:pointer;display:grid;place-items:center;}

/* g2: zoom popup menu */
.cw-zoom-menu{position:fixed;z-index:5000;width:220px;padding:8px;border-radius:14px;
  background:rgba(34,38,51,.97);backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.1);
  box-shadow:0 18px 50px rgba(0,0,0,.55);color:#E8EBF2;}
.cw-zoom-head{display:flex;align-items:baseline;gap:6px;padding:6px 10px 10px;
  background:rgba(255,255,255,.06);border-radius:8px;margin-bottom:6px;font-size:20px;font-weight:700;}
.cw-zoom-head small{margin-left:auto;font-size:12px;color:#6B7385;font-weight:400;}
.cw-zoom-item{display:flex;align-items:center;width:100%;padding:9px 10px;border:0;border-radius:8px;
  background:transparent;color:#E8EBF2;font-size:13.5px;cursor:pointer;}
.cw-zoom-item:hover{background:rgba(75,125,255,.12);}
.cw-zoom-key{margin-left:auto;font-size:11px;color:#6B7385;}
#cwZoomVal{cursor:pointer;}

/* ===== 9-feature extras: modal system ===== */
.cw-mask{position:fixed;inset:0;z-index:6000;background:rgba(6,8,14,.6);backdrop-filter:blur(3px);display:none;}
.cw-mask.show{display:block;}
.cw-modal{position:fixed;z-index:6001;left:50%;top:50%;transform:translate(-50%,-50%);
  background:#1E222D;border:1px solid rgba(255,255,255,.08);border-radius:16px;color:#E8EBF2;
  box-shadow:0 30px 80px rgba(0,0,0,.6);display:none;flex-direction:column;max-height:84vh;}
.cw-modal.show{display:flex;}
.cw-m-head{display:flex;align-items:center;gap:10px;padding:14px 18px;border-bottom:1px solid rgba(255,255,255,.07);}
.cw-m-head h3{margin:0;font-size:15px;font-weight:700;}
.cw-m-search{margin-left:auto;height:30px;width:200px;background:#161A23;border:1px solid rgba(255,255,255,.1);
  border-radius:8px;color:#E8EBF2;padding:0 10px;font-size:12.5px;}
.cw-m-x{width:30px;height:30px;border-radius:8px;border:0;background:none;color:#9AA3B5;font-size:18px;cursor:pointer;}
.cw-m-x:hover{background:rgba(255,255,255,.08);color:#E8EBF2;}
.cw-m-body{padding:18px;overflow:auto;}
.cw-sec{font-size:12px;color:#6B7385;margin:14px 0 8px;letter-spacing:.4px;}
.cw-fgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;}
.cw-fbtn{display:flex;align-items:center;gap:9px;padding:10px 12px;border-radius:10px;
  background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.06);cursor:pointer;font-size:13px;color:#DDE2EE;}
.cw-fbtn:hover{background:rgba(75,125,255,.1);border-color:rgba(75,125,255,.3);}
.cw-fico{width:28px;height:28px;border-radius:7px;background:rgba(255,255,255,.07);display:grid;place-items:center;
  font-size:12px;color:#9AA3B5;flex:0 0 auto;}
.cw-kgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;}
.cw-kcol h4{margin:0 0 10px;font-size:13px;color:#7DD3FC;}
.cw-krow{display:flex;align-items:center;gap:8px;padding:6px 0;font-size:13px;color:#C7CDDB;}
.cw-keys{margin-left:auto;display:flex;gap:4px;}
.cw-key{height:22px;min-width:22px;padding:0 6px;display:grid;place-items:center;border-radius:5px;
  background:#2A2E3A;border:1px solid rgba(255,255,255,.1);font-size:11px;color:#C7CDDB;}
.cw-empty{padding:36px;text-align:center;color:#6B7385;font-size:13.5px;}
.cw-tabs{display:flex;gap:6px;margin-bottom:12px;}
.cw-tab{height:30px;padding:0 13px;border-radius:8px;border:1px solid rgba(255,255,255,.1);
  background:transparent;color:#C7CDDB;font-size:12.5px;cursor:pointer;}
.cw-tab.active{background:#4B7DFF;color:#fff;border-color:#4B7DFF;font-weight:700;}
.cw-form{display:flex;flex-direction:column;gap:11px;}
.cw-form label{font-size:12px;color:#9AA3B5;}
.cw-form input,.cw-form textarea,.cw-form select{background:#161A23;border:1px solid rgba(255,255,255,.1);
  border-radius:9px;color:#E8EBF2;padding:10px 12px;font-size:13px;font-family:inherit;}
.cw-form .req{color:#FF5D7A;}
.cw-rowbtns{display:flex;gap:8px;margin-top:6px;}
.cw-pbtn{height:38px;padding:0 18px;border-radius:10px;border:0;font-weight:700;font-size:13px;cursor:pointer;}
.cw-pbtn.primary{background:#4B7DFF;color:#fff;}
.cw-pbtn.ghost{background:rgba(255,255,255,.08);color:#E8EBF2;}
.cw-toggle{display:flex;align-items:center;gap:8px;font-size:13px;color:#C7CDDB;}

/* video player preview (tpl_video_player_preview) */
.n-player{display:flex;align-items:center;gap:8px;padding:6px 10px;}
.np-time{font-size:10.5px;color:#9AA3B5;min-width:26px;}
.np-bar{flex:1;height:4px;-webkit-appearance:none;appearance:none;background:rgba(255,255,255,.18);border-radius:2px;outline:none;cursor:pointer;}
.np-bar::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:11px;height:11px;border-radius:50%;background:#7DD3FC;cursor:pointer;}

/* node info label (P2-1) */
.n-info{display:flex;align-items:center;gap:7px;padding:7px 12px 0;font-size:10.5px;color:#9AA3B5;}
.n-info-dot{width:5px;height:5px;border-radius:50%;background:#7DD3FC;}

/* empty-state 5 quick-create buttons (cb_empty) */
.cw-empty-btns{display:none !important;gap:15px;justify-content:center;margin-top:22px;pointer-events:auto;} /* v1.1-04 #2: parent hint has pointer-events:none → buttons were unclickable */
.cw-empty-btns button{height:38px;padding:0 20px;border-radius:10px;border:1px solid rgba(255,255,255,.14);
  background:rgba(42,46,58,.7);color:#DDE2EE;font-size:13.5px;cursor:pointer;transition:all .15s;}
.cw-empty-btns button:hover{background:rgba(17,183,205,.15);border-color:#7DD3FC;color:#7DD3FC;}

/* super-canvas P0 node bodies */
.n-tl{padding:10px;}
.n-tl-head{display:flex;align-items:center;gap:8px;font-size:10.5px;color:#9AA3B5;margin-bottom:6px;}
.n-tl-head span{flex:1;}
.n-tl-btn{width:24px;height:24px;border-radius:6px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.05);color:#C7CDDB;cursor:pointer;}
.n-tl-ruler{height:14px;background:repeating-linear-gradient(90deg,rgba(255,255,255,.15) 0 1px,transparent 1px 40px);border-radius:3px;margin-bottom:6px;}
.n-tl-track{height:26px;background:rgba(255,255,255,.04);border-radius:6px;margin-bottom:8px;}
.n-tl-clip{display:inline-block;height:20px;margin:3px;padding:0 10px;border-radius:4px;background:#4B7DFF;color:#fff;font-size:10.5px;line-height:20px;}
.n-tl-add{width:100%;height:28px;border-radius:6px;border:1px dashed rgba(255,255,255,.2);background:transparent;color:#9AA3B5;font-size:12px;cursor:pointer;}
.n-subj{padding:12px;text-align:center;}
.n-subj-ava{width:48px;height:48px;margin:0 auto 8px;border-radius:50%;background:rgba(75,125,255,.12);border:1px solid rgba(75,125,255,.3);display:grid;place-items:center;font-size:22px;color:#7DD3FC;}
.n-subj-txt{font-size:11.5px;color:#9AA3B5;margin-bottom:8px;}
.n-subj-ref{height:40px;border-radius:6px;background:rgba(255,255,255,.05);border:1px dashed rgba(255,255,255,.15);display:grid;place-items:center;font-size:11px;color:#6B7385;}
.n-tbx{padding:10px;display:flex;flex-direction:column;gap:8px;}
.n-tbx-row{display:flex;flex-direction:column;gap:3px;padding:8px;border-radius:7px;background:rgba(255,255,255,.04);}
.n-tbx-row b{font-size:12px;color:#E8EBF2;}
.n-tbx-row span{font-size:11px;color:#9AA3B5;}

/* P2c keyframe / storyboard card rows */
.n-kf,.n-sb{margin:6px 0;display:flex;flex-direction:column;gap:4px}
.n-kf-row,.n-sb-row{display:flex;justify-content:space-between;align-items:center;padding:5px 8px;border-radius:7px;background:rgba(255,255,255,.04);font-size:11.5px}
.n-kf-row b,.n-sb-row b{font-weight:600;color:#C7CDDB}
.n-kf-val,.n-sb-st{color:#6B7385;font-size:11px}

/* P3a Extend / Effect rows */
.n-p3{margin:6px 0;display:flex;flex-direction:column;gap:4px}
.n-p3-row{display:flex;justify-content:space-between;align-items:center;padding:5px 8px;border-radius:7px;background:rgba(255,255,255,.04);font-size:11.5px;cursor:pointer}
.n-p3-row b{font-weight:600;color:#C7CDDB}
.n-p3-val{color:#6B7385;font-size:11px}

#cwWorld.cw-board-view{background-image:radial-gradient(rgba(75,125,255,.25) 1px,transparent 1px);background-size:40px 40px}

/* [G1] More dropdown: collapsed tool row */
.cw-more-wrap{position:relative;margin-left:12px}
.cw-more-btn{background:none;border:1px solid rgba(255,255,255,.14);color:rgba(247,247,247,.8);border-radius:8px;padding:4px 10px;font-size:12px;cursor:pointer}
.cw-more-btn:hover{background:rgba(255,255,255,.06)}
.cw-more-menu{display:none;position:absolute;top:calc(100% + 6px);right:0;min-width:190px;background:#1b2030;border:1px solid rgba(255,255,255,.1);border-radius:10px;box-shadow:0 16px 40px rgba(0,0,0,.5);padding:5px;z-index:200}
.cw-more-menu.open{display:block}
.cw-more-menu button{display:block;width:100%;text-align:left;background:none;border:0;color:#E8EBF2;padding:8px 10px;border-radius:7px;font-size:13px;cursor:pointer}
.cw-more-menu button:hover{background:rgba(17,183,205,.14)}
/* canvas switcher dropdown (real project list) */
.cw-canvas-menu{position:fixed;z-index:250;min-width:220px;max-width:300px;background:#1b2030;border:1px solid rgba(255,255,255,.1);border-radius:10px;box-shadow:0 16px 40px rgba(0,0,0,.5);padding:5px;display:flex;flex-direction:column;gap:2px}
.cw-cm-head{padding:6px 10px;font-size:11px;color:#6B7385;text-transform:uppercase;letter-spacing:.5px}
.cw-cm-list{display:flex;flex-direction:column;gap:2px;max-height:260px;overflow:auto}
.cw-cm-item{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 10px;border-radius:7px;font-size:13px;color:#E8EBF2;cursor:pointer}
.cw-cm-item:hover{background:rgba(17,183,205,.14)}
.cw-cm-item.cur{background:rgba(17,183,205,.18)}
.cw-cm-name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cw-cm-check{color:#4B7DFF;font-size:12px;font-weight:700;flex-shrink:0}
.cw-cm-new{margin-top:4px;padding:8px 10px;background:transparent;border:0;border-top:1px solid rgba(255,255,255,.08);color:#4B7DFF;font-size:13px;font-weight:600;text-align:left;cursor:pointer;border-radius:7px}
.cw-cm-new:hover{background:rgba(17,183,205,.1)}
/* [G3] empty capsule icons */
.cw-empty-btns button{display:inline-flex;align-items:center;gap:9px;padding:12px 20px}
.cw-empty-btns button svg{opacity:.85}

/* [G6] calmer dot grid (match cb_empty breathing room) */
.cw-stage{background-image:radial-gradient(rgba(255,255,255,.032) 1px, transparent 1px);}
/* [G4] declutter bottom bar: hide secondary icon row + status text */
.cw-b-left .cw-b-ico{display:none;}
.cw-b-left > span[style*="margin-left:12px;font-size:12px"]{display:none;}
.cw-b-left > span[style*="Seedance"]{display:none;}
/* [G7] keep only one side add button (left) */
.cw-side-plus.right{display:none;}
/* [G5] TV Director input collapsed until activated */
.cw-b-right .cw-tvdir-input{display:none;}
.cw-b-right.open .cw-tvdir-input{display:inline-block;width:320px;}
.cw-b-right{cursor:pointer;}
/* [G4b] R593: bottom bar rebuilt as SVG icon+text groups; kill list removed (buttons now styled by .cw-b-act) */
.cw-b-left > span:last-of-type{display:none !important;}
/* keep center tool row tight: hide beyond first 4 tools */
.cw-b-center .cw-tool:nth-child(n+5){display:none;}

/* R574/R622/R623: bottom asset bar — SVG linear icons + labels, grouped (LibTV-style) */
.cw-b-actions{display:flex;align-items:center;gap:10px;margin-left:8px;font-size:12px;color:rgba(232,235,242,.75);}
.cw-b-group{display:flex;align-items:center;gap:4px;}
.cw-b-sep{width:1px;height:18px;background:rgba(255,255,255,.1);margin:0 2px;}
.cw-b-act{display:inline-flex;align-items:center;gap:5px;padding:5px 9px;background:transparent;border:0;border-radius:7px;color:rgba(232,235,242,.7);cursor:pointer;font-size:12px;transition:background .12s,color .12s;}
.cw-b-act:hover{background:rgba(255,255,255,.06);color:#E8EBF2;}
.cw-b-act svg{flex:0 0 auto;}
@media(max-width:1100px){.cw-b-act span{display:none;}.cw-b-act{padding:5px;}}
/* right cluster: hide extra icons before TV Director */
.cw-b-right ~ *, .cw-bottom .cw-b-right{/* tv dir stays */}

/* R141 P1-1: character library cards */
.cw-chars{display:flex;flex-direction:column;gap:8px;margin:10px 0;max-height:60vh;overflow:auto;}
.cw-char-card{display:flex;align-items:center;gap:10px;padding:10px;border:1px solid rgba(255,255,255,.12);border-radius:10px;cursor:grab;background:rgba(255,255,255,.03);}
.cw-char-card:active{cursor:grabbing;}
.cw-char-card:hover{border-color:#7DD3FC;background:rgba(75,125,255,.06);}
.cw-char-avatar{width:32px;height:32px;border-radius:50%;background:linear-gradient(135deg,#4B7DFF,#7c4dff);display:flex;align-items:center;justify-content:center;font-size:14px;color:#fff;font-weight:600;}
.cw-char-name{flex:1;font-size:13px;color:#E8EBF2;}
.cw-char-del{background:none;border:none;color:#ff6b6b;cursor:pointer;font-size:14px;}
.cw-chars-add{display:flex;gap:6px;margin-top:8px;}
.cw-chars-add input{flex:1;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);color:#E8EBF2;padding:6px 10px;border-radius:8px;font-size:12px;}
.cw-chars-add button{background:#4B7DFF;color:#fff;border:none;padding:6px 12px;border-radius:8px;font-size:12px;cursor:pointer;}
.cw-batch{margin-top:10px;padding:10px;border:1px dashed rgba(75,125,255,.4);border-radius:10px;font-size:12px;color:#cfd3dc;}
.cw-batch-row{display:flex;justify-content:space-between;margin:4px 0;}
.cw-batch-total{color:#7DD3FC;font-weight:600;}

/* R141 P1-4: keyframe timeline */
.cw-timeline{height:74px;background:#13151c;border-top:1px solid rgba(255,255,255,.08);padding:8px 14px;font-size:12px;color:#cfd3dc;}
.cw-tl-head{display:flex;align-items:center;gap:10px;margin-bottom:6px;}
.cw-tl-head button{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);color:#E8EBF2;border-radius:6px;padding:3px 10px;cursor:pointer;font-size:11px;}
.cw-tl-head button:hover{background:#4B7DFF;}
.cw-tl-track{position:relative;height:28px;background:rgba(255,255,255,.03);border-radius:6px;cursor:pointer;}
.cw-tl-playhead{position:absolute;left:0;top:0;bottom:0;width:2px;background:#7DD3FC;box-shadow:0 0 8px #7DD3FC;}
.cw-kf{position:absolute;top:50%;transform:translate(-50%,-50%);width:12px;height:12px;background:#7c4dff;border:2px solid #fff;border-radius:50%;cursor:grab;}
.cw-kf:hover{background:#7DD3FC;}
/* R141 P1-5: marquee + NL edit */
.cw-marquee{position:absolute;border:1px dashed #7DD3FC;background:rgba(75,125,255,.08);pointer-events:none;z-index:50;}
.cw-nl-edit{position:fixed;bottom:100px;left:50%;transform:translateX(-50%);background:rgba(34,38,51,.98);border:1px solid #7DD3FC;border-radius:12px;padding:12px 14px;z-index:9998;width:420px;box-shadow:0 12px 40px rgba(0,0,0,.6);}
.cw-nl-edit h4{margin:0 0 6px;font-size:13px;color:#7DD3FC;}
.cw-nl-edit ul{margin:0 0 8px;padding-left:18px;font-size:11px;color:#9AA3B5;max-height:60px;overflow:auto;}
.cw-nl-edit input{width:100%;box-sizing:border-box;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.15);color:#E8EBF2;padding:7px 10px;border-radius:8px;font-size:12px;}
.cw-nl-edit .cw-nl-btns{display:flex;gap:6px;margin-top:8px;justify-content:flex-end;}
.cw-nl-edit button{background:#4B7DFF;color:#fff;border:none;padding:5px 12px;border-radius:6px;font-size:11px;cursor:pointer;}
.cw-nl-edit button.sec{background:rgba(255,255,255,.08);}

/* ============================================================
   Density upgrade v1 — 2026-11-04
   Boss feedback "too small" → match Figma comfortable density.
   Scope: node card internals, floating param bar, bottom toolbar,
   left drawer. Pure CSS override; no JS/HTML DOM touched.
   ============================================================ */

/* ---------- 1. Node card internal density (Try / Extend / Effect rows) ---------- */
.cw-node .n-try{padding:14px 16px 16px;line-height:1.6;}
.cw-node .n-try-label{font-size:13px;color:#9AA3B5;margin-bottom:10px;letter-spacing:.2px;}
.cw-node .n-try-item{font-size:14px;gap:10px;padding:7px 0;line-height:1.6;}
.cw-node .n-try-item .n-t-ico{width:20px;font-size:14px;color:#9AA3B5;}
.cw-node .n-title{font-size:13px;padding:0 4px 8px;line-height:1.5;}
.cw-node .n-tools{gap:8px;padding:0 14px 14px;}
.cw-node .n-tool{font-size:12.5px;padding:6px 12px;border-radius:8px;min-height:30px;
  display:inline-flex;align-items:center;line-height:1.4;}

/* P3 Extend / Effect rows (首帧/尾帧/续写/Effect) */
.n-p3{margin:10px 0;display:flex;flex-direction:column;gap:6px;}
.n-p3-row{padding:9px 12px;font-size:13px;line-height:1.6;border-radius:8px;}
.n-p3-row b{font-size:13px;font-weight:600;}
.n-p3-val{font-size:12px;}

/* Keyframe / storyboard rows */
.n-kf,.n-sb{margin:10px 0;display:flex;flex-direction:column;gap:6px;}
.n-kf-row,.n-sb-row{padding:9px 12px;font-size:13px;line-height:1.6;border-radius:8px;}
.n-kf-row b,.n-sb-row b{font-size:13px;font-weight:600;}
.n-kf-val,.n-sb-st{font-size:12px;}

/* node info label */
.n-info{padding:8px 14px 4px;font-size:12px;gap:8px;}

/* ---------- 2. Floating param bar (cw-node-bar / g4 rich param bar) ---------- */
.cw-node-bar{padding:16px !important;gap:12px !important;line-height:1.6;border-radius:14px;}
.cw-nb-row{gap:10px !important;}
.cw-nb-btn{height:36px !important;padding:0 14px !important;font-size:13px !important;
  gap:8px !important;border-radius:9px;line-height:1.4;}
.cw-nb-select{height:36px !important;font-size:13px !important;padding:0 12px !important;
  border-radius:9px;}
.cw-nb-cost{font-size:12.5px !important;}
.cw-nb-gen{height:36px !important;padding:0 18px !important;font-size:13px !important;border-radius:9px;}
.cw-nb-more{font-size:13px !important;}
.cw-nb-toggle{font-size:12px !important;padding:4px 2px 0;}

/* g4 rich param bar pills / chips / selects */
.cw-zb-row{gap:10px !important;}
.cw-zb-pill{height:36px !important;padding:0 14px !important;font-size:13px !important;
  gap:8px !important;border-radius:9px;line-height:1.4;}
.cw-zb-select{height:36px !important;font-size:13px !important;padding:0 12px !important;
  border-radius:9px;}
.cw-zb-chip{height:36px !important;padding:0 12px !important;font-size:13px !important;
  gap:6px !important;border-radius:9px;}
.cw-zb-desc{font-size:14px;min-height:40px;line-height:1.6;padding:4px 0;}
.cw-zb-send{width:36px !important;height:36px !important;font-size:18px !important;border-radius:11px;}
.cw-zb-sep{height:22px;}

/* Right params drawer (legacy fallback, if shown) */
.cw-params{padding:16px !important;gap:12px !important;line-height:1.6;width:300px !important;}
.cw-p-title{font-size:14px !important;}
.cw-field{gap:6px !important;margin-bottom:12px !important;}
.cw-field label{font-size:13px !important;}
.cw-field select,.cw-field textarea{font-size:13px !important;padding:10px 12px !important;
  border-radius:9px;line-height:1.6;}
.cw-field textarea{min-height:72px !important;}
.cw-btn{min-height:36px !important;padding:10px 14px !important;font-size:13px !important;
  border-radius:9px;line-height:1.4;}
.cw-p-gen{padding:12px 16px !important;font-size:14px !important;min-height:38px !important;}
.cw-p-cost{font-size:12.5px !important;padding:9px 12px !important;line-height:1.6;}

/* ---------- 3. Bottom toolbar density ---------- */
.cw-bottom{height:64px !important;flex:0 0 64px !important;padding:0 18px !important;}
.cw-b-left,.cw-b-right{gap:12px !important;}
.cw-b-ico{width:36px !important;height:36px !important;border-radius:9px;}
.cw-b-ico svg{width:18px !important;height:18px !important;}
.cw-tool{width:36px !important;height:36px !important;border-radius:10px;}
.cw-tool svg{width:18px !important;height:18px !important;}
.cw-zbtn{width:30px !important;height:30px !important;border-radius:7px;}
.cw-zval{font-size:13px !important;min-width:46px;}
.cw-b-center{gap:8px !important;padding:8px 12px !important;border-radius:16px;}
.cw-asset-mgr{font-size:13px !important;gap:8px !important;}
.cw-zoom{gap:6px !important;margin-left:6px !important;}

/* ---------- 4. Left drawer density (cwAssetDrawer) ---------- */
/* C-6: widen 360->400px; dock between topbar(54) and bottombar(64) so it never overlaps the chrome */
.cw-drawer{width:400px !important;left:-420px !important;top:54px !important;bottom:64px !important;height:auto !important;padding:20px !important;line-height:1.6;}
.cw-drawer h3{font-size:16px !important;margin:0 0 16px !important;}
.cw-drawer .cw-dd-x{top:16px !important;right:16px !important;font-size:20px !important;}
.cw-drawer input{padding:10px 12px !important;font-size:13.5px !important;
  margin-bottom:12px !important;border-radius:9px;line-height:1.5;}
.cw-drawer .cw-dd-tabs{gap:8px !important;margin-bottom:14px !important;}
.cw-drawer .cw-dd-tab{font-size:13px !important;padding:7px 12px !important;border-radius:8px;
  line-height:1.4;}
.cw-drawer .cw-dd-empty{font-size:14px !important;margin-top:48px !important;line-height:1.6;}

/* Right dirpanel (chat side) — same density pass */
.cw-dirpanel{padding:20px !important;width:360px !important;right:-380px !important;line-height:1.6;}
.cw-dirpanel h3{font-size:16px !important;margin:0 0 6px !important;}
.cw-dirpanel .cw-dp-sub{font-size:13px !important;margin-bottom:14px !important;}
.cw-dirpanel .cw-dp-msgs{gap:10px !important;font-size:13.5px !important;}
.cw-dirpanel .cw-dp-b,.cw-dirpanel .cw-dp-a{padding:10px 12px !important;border-radius:9px;
  line-height:1.6;}
.cw-dirpanel input{margin-top:12px !important;padding:10px 12px !important;border-radius:9px;}
.cw-dirpanel button{margin-top:8px !important;padding:10px !important;border-radius:9px;
  font-size:13px !important;}
.cw-dirpanel .cw-dp-x{top:16px !important;right:16px !important;font-size:20px !important;}

/* ---------- 5. Hide on-canvas agent purple floating box (dead-command experiment) ----------
   JS creates .cw-agent-box with inline purple style; user confused.
   Hide entirely until productized as Figma-AI-style FAB. */
.cw-agent-box{display:none !important;}

/* P0-E: right dirpanel responsive shrink + left panels dock above bottom bar */
@media(max-width:960px){
  .cw-dirpanel{width:min(360px, calc(100vw - 16px)) !important; right:calc(-1 * min(380px, calc(100vw - 16px + 20px))) !important;}
}
#cwCharPanel{bottom:64px !important;}
#cwLayers{bottom:64px !important;}

/* ============================================================
   BENCHMARK-CLEANUP batch 1 — 2026-11-04
   Align to tldraw / Excalidraw / Figma density and restraint.
   ============================================================ */

/* Top bar: slimmer, less visual weight */
.cw-topbar{height:50px!important;flex:0 0 50px!important;padding:0 16px!important;}
.cw-brand{font-size:14px!important;}
.cw-brand-ico{width:20px!important;height:20px!important;font-size:12px!important;}
.cw-title{height:28px!important;font-size:13px!important;}
.cw-canvas-sel{height:28px!important;font-size:12px!important;}
.cw-tb-iconbtn{width:30px!important;height:30px!important;}
.cw-upgrade{height:28px!important;font-size:12px!important;padding:0 12px!important;}

/* Stage: dot grid a touch softer, more breathing room */
.cw-stage{background-image:radial-gradient(rgba(255,255,255,.028) 1px, transparent 1px)!important;}

/* Bottom bar: slimmer, cleaner */
.cw-bottom{height:56px!important;flex:0 0 56px!important;padding:0 16px!important;}
.cw-b-center{padding:6px 10px!important;gap:6px!important;}
.cw-tool{width:32px!important;height:32px!important;}
.cw-zbtn{width:26px!important;height:26px!important;}
.cw-zval{font-size:12px!important;}

/* Timeline: slimmer, cleaner */
.cw-timeline{height:60px!important;flex:0 0 60px!important;padding:6px 14px!important;}

/* Node cards: tighter radius, softer shadow — Figma-style */
.cw-node .n-card{border-radius:10px!important;box-shadow:0 2px 8px rgba(0,0,0,.2)!important;}
.cw-node.selected .n-card{box-shadow:0 0 0 1.5px rgba(125,211,252,.9),0 4px 16px rgba(0,0,0,.3)!important;}

/* Ports: smaller, cleaner */
.cw-node .port{width:14px!important;height:14px!important;border-width:1.5px!important;}

/* Wires: Figma-style clean bezier */
.cw-wires path{stroke-width:1.5px!important;}
.cw-wires path.wire-active{stroke-width:2px!important;}

/* Empty state: larger breathing room, fewer buttons */
.cw-empty-hint{font-size:15px!important;letter-spacing:.3px!important;}
.cw-empty-btns{gap:10px!important;}
.cw-empty-btns button{height:36px!important;padding:0 16px!important;font-size:13px!important;border-radius:9px!important;}

/* Menu: cleaner, tighter */
.cw-menu{border-radius:12px!important;padding:5px!important;}
.cw-menu-item{padding:8px 10px!important;font-size:13px!important;border-radius:8px!important;}

/* Drawers: cleaner radius */
.cw-drawer,.cw-dirpanel{border-radius:0!important;}

/* Item 6: smoother node drag (GPU hint) */
.cw-node{will-change:left,top;}

/* Item 1: generation progress bar on node card */
.n-prog{padding:8px 14px 12px;display:flex;flex-direction:column;gap:5px;}
.n-prog-track{height:4px;border-radius:2px;background:rgba(255,255,255,.08);overflow:hidden;}
.n-prog-fill{height:100%;width:0%;border-radius:2px;background:linear-gradient(90deg,#4B7DFF,#7DD3FC);transition:width .3s ease;}
.n-prog-label{font-size:10.5px;color:#7DD3FC;letter-spacing:.3px;}

/* B8-1: folded subgraph badge */
.n-fold-badge{display:inline-flex;align-items:center;margin-left:8px;padding:1px 8px;border-radius:6px;
  font-size:10px;font-weight:700;background:rgba(168,85,247,.18);color:#C084FC;border:1px solid rgba(168,85,247,.3);}
.cw-node.folded .n-card{border-color:rgba(168,85,247,.5);}

/* B8-3: run queue badge in bottom bar */
.cw-run-badge{display:inline-flex;align-items:center;gap:6px;margin-left:10px;padding:3px 9px;border-radius:8px;
  font-size:11px;color:#7DD3FC;background:rgba(75,125,255,.1);border:1px solid rgba(125,211,252,.2);}
.cw-run-dot{width:7px;height:7px;border-radius:50%;background:#F97316;animation:cw-pulse 1.2s infinite;}
@keyframes cw-pulse{0%,100%{opacity:1;}50%{opacity:.3;}}
.cw-run-int{background:none;border:0;color:#F97316;cursor:pointer;font-size:11px;padding:0 2px;}

/* failure state + retry (Runway/Pika standard) */
.n-fail{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 14px;margin:0 0 10px;
  background:rgba(239,68,68,.1);border:1px solid rgba(239,68,68,.3);border-radius:8px;}
.n-fail-msg{font-size:11.5px;color:#FCA5A5;flex:1;}
.n-retry{background:rgba(239,68,68,.15);border:1px solid rgba(239,68,68,.4);color:#FCA5A5;
  border-radius:6px;padding:3px 10px;font-size:11px;cursor:pointer;font-weight:600;}
.n-retry:hover{background:rgba(239,68,68,.25);}

/* result echo thumbnail */
.n-result{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;width:100%;height:100%;}
.n-result-thumb{width:42px;height:42px;border-radius:10px;background:rgba(34,197,94,.15);color:#34D399;
  display:grid;place-items:center;font-size:20px;border:1px solid rgba(52,211,153,.3);}
.n-result-cap{font-size:10.5px;color:#6B7385;}

/* param panel: error grouping + 4 chip states (ComfyUI/Figma standard) */
.cw-p-errors{margin-top:10px;padding:8px 10px;border-radius:8px;background:rgba(239,68,68,.08);
  border:1px solid rgba(239,68,68,.25);font-size:11.5px;color:#FCA5A5;}
.cw-p-errors b{display:block;margin-bottom:4px;font-size:10.5px;text-transform:uppercase;letter-spacing:.5px;}
.cw-chip{display:inline-flex;align-items:center;padding:4px 10px;border-radius:6px;font-size:11.5px;
  border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.05);color:#C4CAD6;cursor:pointer;
  transition:background .12s,border-color .12s,color .12s;}
.cw-chip:hover{background:rgba(255,255,255,.1);color:#E8EBF2;}
.cw-chip.on{background:#4B7DFF;border-color:#4B7DFF;color:#fff;font-weight:600;}
.cw-chip:disabled,.cw-chip.disabled{opacity:.35;cursor:not-allowed;text-decoration:line-through;}

/* pixel polish: menu fade-in + node shadow + zoom controls (Figma/Linear) */
.cw-menu{animation:cw-menu-in .12s ease-out;transform-origin:top left;}
@keyframes cw-menu-in{from{opacity:0;transform:scale(.96) translateY(-4px);}to{opacity:1;transform:scale(1) translateY(0);}}
.cw-node .n-card{box-shadow:0 1px 2px rgba(0,0,0,.2),0 4px 16px rgba(0,0,0,.18)!important;}
.cw-node:hover .n-card{box-shadow:0 2px 4px rgba(0,0,0,.25),0 8px 24px rgba(0,0,0,.25)!important;}
.cw-node.selected .n-card{box-shadow:0 0 0 1.5px rgba(125,211,252,.9),0 8px 28px rgba(0,0,0,.35)!important;}
.cw-zoom{padding:3px;border-radius:8px;background:rgba(34,38,51,.85);backdrop-filter:blur(10px);
  border:1px solid rgba(255,255,255,.08);gap:2px;}
.cw-zbtn{width:26px;height:26px!important;border-radius:6px!important;transition:background .12s;}
.cw-zbtn:hover{background:rgba(255,255,255,.12);}
.cw-zval{font-size:12px!important;font-weight:600;min-width:46px!important;color:#E8EBF2;}
.cw-tool{transition:background .12s,color .12s,transform .12s;}
.cw-tool:hover{transform:scale(1.05);}
.cw-tool.on{box-shadow:0 0 0 2px rgba(125,211,252,.4);}

/* active wire flow animation (即梦/ComfyUI energy stream) */
.cw-wires path{transition:stroke .15s,stroke-width .15s;}
.cw-wires path[style*="7DD3FC"]{stroke-dasharray:6 4;animation:cw-flow .8s linear infinite;}
@keyframes cw-flow{to{stroke-dashoffset:-20;}}

/* node title typography refinement (Figma/Linear) */
.cw-node .n-title{font-size:12.5px!important;font-weight:600!important;letter-spacing:.1px;color:#C4CAD6!important;}
.cw-node .n-title .n-t-ico{width:18px!important;height:18px!important;border-radius:5px!important;font-size:9px!important;
  display:grid;place-items:center;color:#fff!important;font-weight:700;}
.cw-node .n-tag{font-size:9px!important;font-weight:800!important;letter-spacing:.5px;text-transform:uppercase;
  padding:1px 5px;border-radius:4px;background:rgba(125,211,252,.15);color:#7DD3FC!important;}

/* empty state breathing (Figma) */
.cw-empty-msg{font-size:15px!important;font-weight:500;letter-spacing:.3px;}
.cw-empty-btns button{transition:transform .12s,box-shadow .12s;}
.cw-empty-btns button:hover{transform:translateY(-1px);box-shadow:0 6px 16px rgba(75,125,255,.25);}

/* alignment polish: consistent internal spacing + focus rings */
.cw-node .n-card{padding-bottom:4px;}
.cw-node .n-kf,.cw-node .n-p3,.cw-node .n-sb{padding:6px 14px;}
.cw-node .n-kf-row,.cw-node .n-p3-row,.cw-node .n-sb-row{display:flex;justify-content:space-between;align-items:center;
  padding:5px 0;font-size:12px;color:#C4CAD6;}
.cw-node .n-kf-row b,.cw-node .n-p3-row b,.cw-node .n-sb-row b{font-weight:500;color:#9AA3B5;}
.cw-node .n-kf-val,.cw-node .n-p3-val,.cw-node .n-sb-st{font-size:11px;color:#6B7385;}
.cw-node .n-tools{margin-top:8px;}
.cw-b-left{gap:12px!important;}
.cw-asset-mgr{gap:6px;}
/* accessible focus ring for all canvas buttons */
.cw-menu-item:focus-visible,.cw-tool:focus-visible,.cw-zbtn:focus-visible{outline:2px solid #4B7DFF;outline-offset:1px;}
/* port hover: ring + glow */
.cw-node .port:hover{box-shadow:0 0 0 3px rgba(125,211,252,.2);transform:translateY(-50%) scale(1.2);}
/* consistent node preview height */
.cw-node .n-preview{min-height:100px;}

/* P0-8: rubber band box-select + multi-select highlight (Figma) */
.cw-rubber{position:absolute;border:1px solid #4B7DFF;background:rgba(75,125,255,.12);pointer-events:none;z-index:999;}
.cw-node.sel-extra .n-card{box-shadow:0 0 0 1.5px rgba(75,125,255,.7),0 8px 24px rgba(0,0,0,.3)!important;}

/* P0-12: Director plan review modal (LibTV v1.5) */
.cw-dirplan{position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:9999;display:grid;place-items:center;}
.cw-dirplan-card{background:#1F2230;border:1px solid rgba(255,255,255,.1);border-radius:14px;padding:22px;
  width:380px;box-shadow:0 20px 60px rgba(0,0,0,.5);}
.cw-dirplan-h{font-size:14px;font-weight:700;margin-bottom:12px;color:#E8EBF2;}
.cw-dirplan-prompt{font-size:12.5px;color:#9AA3B5;margin-bottom:14px;padding:10px;background:rgba(255,255,255,.04);
  border-radius:8px;font-style:italic;}
.cw-dirplan-steps{font-size:12.5px;color:#C4CAD6;line-height:1.8;margin-bottom:18px;}
.cw-dirplan-btns{display:flex;gap:10px;justify-content:flex-end;}
.cw-dirplan-btns button{padding:7px 16px;border-radius:8px;font-size:12.5px;cursor:pointer;border:0;}
.cw-dirplan-cancel{background:rgba(255,255,255,.08);color:#C4CAD6;}
.cw-dirplan-cancel:hover{background:rgba(255,255,255,.14);}
.cw-dirplan-ok{background:#4B7DFF;color:#fff;font-weight:600;}
.cw-dirplan-ok:hover{background:#5B8DFF;}

/* R573: model chip sits right next to account avatar (top-right cluster) */
.cw-model-chip{margin-left:6px;padding:4px 10px;border-radius:8px;background:rgba(75,125,255,.12);
  border:1px solid rgba(75,125,255,.3);color:#7DD3FC;font-size:12px;font-weight:600;cursor:pointer;
  transition:background .12s,border-color .12s;display:inline-flex;align-items:center;}
.cw-model-chip:hover{background:rgba(75,125,255,.2);border-color:rgba(125,211,252,.5);}

/* P1-24: radial menu (ComfyUI/Figma radial) */
.cw-radial{position:fixed;z-index:9998;width:0;height:0;pointer-events:none;}
.cw-radial-item{position:absolute;transform:translate(-50%,-50%);padding:6px 10px;border-radius:8px;
  background:rgba(34,38,51,.96);border:1px solid rgba(255,255,255,.12);color:#E8EBF2;font-size:11.5px;
  cursor:pointer;pointer-events:auto;white-space:nowrap;transition:background .12s,transform .12s;}
.cw-radial-item:hover{background:#4B7DFF;transform:translate(-50%,-50%) scale(1.08);}


/* P2-17: mobile 480px breakpoint */
@media(max-width:480px){
  .cw-node{width:260px;}
  .cw-bottom{padding:0 8px;}
  .cw-b-left{gap:6px!important;}
  .cw-b-center{gap:4px;}
  .cw-b-right{display:none;}
  .cw-model-chip{font-size:10px;padding:3px 8px;}
  .cw-run-badge{font-size:10px;}
  .cw-dirplan-card{width:90vw;}
}

/* P2-43: node card bottom run/stop/cost bar */
.cw-node .n-footer{display:flex;align-items:center;justify-content:space-between;
  padding:8px 14px;border-top:1px solid rgba(255,255,255,.06);margin-top:8px;}
.cw-node .n-run{padding:4px 12px;border-radius:6px;background:#4B7DFF;color:#fff;
  border:0;font-size:11.5px;font-weight:600;cursor:pointer;}
.cw-node .n-run:hover{background:#5B8DFF;}
.cw-node .n-run.running{background:#F97316;}
.cw-node .n-cost{font-size:10.5px;color:#6B7385;}

/* P1-94: reject wire shake animation */
@keyframes cwShake {
  0%,100% { transform: translateX(0); }
  25% { transform: translateX(-4px); }
  75% { transform: translateX(4px); }
}
.cw-node.reject { animation: cwShake .25s 2; border-color: #EF4444 !important; }

/* P1-94: minimap */
.cw-minimap{position:fixed;right:16px;bottom:56px;width:180px;height:120px;
  background:rgba(20,22,28,.85);border:1px solid rgba(255,255,255,.1);border-radius:8px;
  z-index:50;pointer-events:none;overflow:hidden;}
.cw-minimap .mm-node{position:absolute;width:8px;height:6px;border-radius:1px;background:#4B7DFF;}
.cw-minimap .mm-view{position:absolute;border:1px solid #7DD3FC;background:rgba(125,211,252,.1);}

/* R593: Figma/LibTV left rail — 40px SVG icon strip */
.cw-rail{position:fixed;left:0;top:54px;bottom:0;width:40px;
  background:rgba(15,17,23,.97);border-right:1px solid rgba(255,255,255,.06);
  display:flex;flex-direction:column;align-items:center;padding:10px 0;gap:6px;z-index:25;}
.cw-rail-btn{width:32px;height:32px;border-radius:8px;background:none;border:0;
  color:#9AA3B5;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .12s,color .12s;}
.cw-rail-btn:hover{background:rgba(255,255,255,.07);color:#E8EBF2;}
.cw-rail-btn.active{background:rgba(75,125,255,.18);color:#7DD3FC;}

/* R593: four side panels — unified 280px, slide in from rail */
.cw-side-panel{position:fixed;left:40px;top:54px;bottom:60px;width:280px;
  background:rgba(20,22,29,.97);border-right:1px solid rgba(255,255,255,.08);
  z-index:24;display:flex;flex-direction:column;overflow:hidden;
  transform:translateX(-105%);transition:transform .22s ease;box-shadow:8px 0 24px rgba(0,0,0,.3);}
.cw-side-panel.open{transform:translateX(0);}
.cw-sp-head{flex:0 0 auto;padding:12px 14px 8px;border-bottom:1px solid rgba(255,255,255,.06);}
.cw-sp-title{font-size:12px;font-weight:600;color:#E8EBF2;text-transform:uppercase;letter-spacing:.6px;}
.cw-sp-sub{font-size:11px;color:#6B7385;margin-top:3px;}
.cw-sp-search{margin:8px 12px 4px;}
.cw-sp-search input{width:100%;box-sizing:border-box;padding:6px 10px;border-radius:7px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.04);color:#E8EBF2;font-size:12px;outline:none;}
.cw-sp-search input:focus{border-color:#4B7DFF;}
.cw-sp-body{flex:1;overflow:auto;padding:8px 12px;}
.cw-sp-empty{color:#6B7385;font-size:12px;text-align:center;margin-top:36px;line-height:1.6;}

/* P-benchmark: offset stage for left rail */
.cw-stage{left:40px !important;}

/* P2-42: node 9 states (color-blind distinguishable) */
.cw-node{transition:box-shadow .15s, border-color .15s;}
.cw-node[data-state="paused"]{border-color:#FBBF24 !important;}
.cw-node[data-state="draft"]{border-color:#6B7385 !important;border-style:dashed;}
.cw-node[data-state="queued"]{border-color:#7DD3FC !important;}
.cw-node[data-state="running"]{border-color:#4B7DFF !important;box-shadow:0 0 0 2px rgba(75,125,255,.3);}
.cw-node[data-state="done"]{border-color:#22C55E !important;}
.cw-node[data-state="error"]{border-color:#EF4444 !important;}
.cw-node[data-state="selected"]{border-color:#7DD3FC !important;box-shadow:0 0 0 2px rgba(125,211,252,.4);}

/* P2-42: drag ghost effect */
.cw-node.dragging{opacity:.6;transform:scale(1.02);z-index:100;}
.cw-node.dragging .n-card{box-shadow:0 8px 24px rgba(0,0,0,.4);}

/* P2-42: type icon letter (color-blind: shape + color, not just color) */
.n-t-ico{display:inline-flex;align-items:center;justify-content:center;
  width:18px;height:18px;border-radius:4px;color:#fff;
  font-size:9px;font-weight:700;line-height:1;}

/* P1-83: S4 aesthetics — font hierarchy + 8px grid */
.cw-node .n-title{font-size:13px;font-weight:600;letter-spacing:-.01em;}
.cw-node .n-card{padding:12px;}
.cw-node .n-try-label{font-size:11px;font-weight:500;text-transform:uppercase;letter-spacing:.04em;}
.cw-node .n-tools{padding:0 12px 8px;gap:8px;}
.cw-topbar{padding:0 16px;gap:12px;}
.cw-bottom{padding:0 16px;gap:12px;}

/* P1-83: modal scroll lock */
.cw-modal-open{overflow:hidden;}

/* P1-83: Neon glow on selected/running nodes */
.cw-node[data-state="running"] .n-card{box-shadow:0 0 20px rgba(75,125,255,.3), 0 0 40px rgba(75,125,255,.1);}
.cw-node[data-state="done"] .n-card{box-shadow:0 0 16px rgba(34,197,94,.25);}
.cw-node[data-state="error"] .n-card{box-shadow:0 0 16px rgba(239,68,68,.3);}

/* P1-83: unified icon stroke width (1.8px = Figma standard) */
.cw-node svg{stroke-width:1.8;}
.cw-topbar svg{stroke-width:1.8;}
.cw-bottom svg{stroke-width:1.8;}

/* P1-83: state color palette (color-blind safe) */
.cw-node[data-state="queued"] .n-title{color:#7DD3FC;}
.cw-node[data-state="running"] .n-title{color:#4B7DFF;}
.cw-node[data-state="done"] .n-title{color:#22C55E;}
.cw-node[data-state="error"] .n-title{color:#EF4444;}

/* ---------- left toolbar (Figma standard: 48px) ---------- */
.cw-left-rail{position:fixed;left:0;top:48px;bottom:36px;width:48px;background:#1E1E1E;
  border-right:1px solid #2C2C2C;display:flex;flex-direction:column;align-items:center;padding-top:8px;gap:4px;z-index:25;
  overflow-x:hidden;overflow-y:auto;}
.cw-rail-btn{width:36px;height:36px;border-radius:8px;display:grid;place-items:center;cursor:pointer;
  color:#9AA3B5;font-size:18px;transition:all .15s;}
.cw-rail-btn:hover{background:#2C2C2C;color:#fff;}
.cw-rail-btn.active{background:#4B7DFF;color:#fff;}

/* R765: Left rail grouping — separator between canvas tools and panels */
.cw-rail-sep{width:28px;height:1px;background:rgba(255,255,255,.12);margin:6px 0;}

/* R765: Right-side universal parameter panel (ComfyUI-style) */
.cw-param-panel{
  position:fixed; right:0; top:48px; bottom:0; width:340px;
  background:rgba(22,24,32,.97); backdrop-filter:blur(12px);
  border-left:1px solid rgba(255,255,255,.08);
  z-index:200; display:flex; flex-direction:column;
  transform:translateX(100%); transition:transform .25s ease;
}
.cw-param-panel.open{transform:translateX(0);}
.cw-pp-header{display:flex;align-items:center;justify-content:space-between;
  padding:12px 16px;border-bottom:1px solid rgba(255,255,255,.08);}
.cw-pp-title{font-size:14px;font-weight:600;color:#E8EBF2;}
.cw-pp-close{width:24px;height:24px;border-radius:6px;border:none;background:rgba(255,255,255,.06);
  color:#9AA3B5;cursor:pointer;display:grid;place-items:center;font-size:14px;}
.cw-pp-close:hover{background:rgba(255,255,255,.12);color:#fff;}
.cw-pp-tabs{display:flex;gap:0;border-bottom:1px solid rgba(255,255,255,.08);}
.cw-pp-tab{flex:1;padding:10px;text-align:center;font-size:12px;color:#9AA3B5;cursor:pointer;
  border-bottom:2px solid transparent;}
.cw-pp-tab.active{color:#4B7DFF;border-bottom-color:#4B7DFF;}
.cw-pp-search{padding:10px 16px;border-bottom:1px solid rgba(255,255,255,.08);}
.cw-pp-search input{width:100%;padding:6px 10px;border-radius:6px;border:1px solid rgba(255,255,255,.1);
  background:rgba(255,255,255,.04);color:#E8EBF2;font-size:12px;outline:none;}
.cw-pp-body{flex:1;overflow-y:auto;padding:16px;}
.cw-pp-field{margin-bottom:14px;}
.cw-pp-label{font-size:11px;color:#9AA3B5;margin-bottom:4px;text-transform:uppercase;letter-spacing:.05em;}
.cw-pp-value{font-size:13px;color:#E8EBF2;}

/* R765: Floating bottom bar groups (left + right) */
.cw-float-left, .cw-float-right{
  position:fixed; bottom:16px; display:flex; align-items:center; gap:6px;
  padding:8px 12px; background:rgba(30,30,30,0.92); backdrop-filter:blur(8px);
  border:1px solid rgba(255,255,255,.08); border-radius:12px;
  box-shadow:0 4px 20px rgba(0,0,0,.4); z-index:100;}
.cw-float-left{left:16px;}
.cw-float-right{right:16px;}
.cw-float-btn{width:32px;height:32px;border-radius:8px;display:grid;place-items:center;
  color:#9AA3B5;cursor:pointer;font-size:16px;background:transparent;border:none;}
.cw-float-btn:hover{background:rgba(255,255,255,.08);color:#fff;}

/* R769: 底栏宽度锁定 —— 老板实测 w=1196（= calc(100%-360px)=1240 减 padding），
   要求 ≤ 画布宽 30%（1600 视口 ≤480px）。改为 min(480px,30vw) + 横向滚动。
   对标 comfyui/docs文档站_拆解.md:28-33：ComfyUI 底部无横贯全宽实心条，只有左右两组小图标贴角。 */

/* R765-A: #canvasStats 与 .cw-float-left 重叠 —— 把状态栏抬到浮层正上方 */
#canvasStats{
  bottom:76px !important; left:16px !important; right:auto !important;
  z-index:101;
}

/* R765-B: #cwMinimap 与 .cw-float-right 重叠 —— 把 minimap 抬到浮层正上方 */
#cwMinimap{
  bottom:76px !important; right:16px !important;
  z-index:101;
}

/* R765-C: .g4-guest-bar 与居中的 .cw-bottom 撞在画布正中（17460 px²）。
   访客条抬到浮层上方，与底栏分离。 */
.g4-guest-bar{
  bottom:76px !important;
}

/* R772-fix: 1366 及以下视口，底栏左栏按视口收缩重新分配（1600 配比直接套用会溢 46px）
   实测 1366: .cw-b-left ow=376 sw=422 → gap 10px×5 + cw-asset-mgr 74 + cw-zoom 118 是主因 */
@media (max-width:1500px){
  .cw-b-left,.cw-b-right{gap:6px!important;}
  .cw-asset-mgr{font-size:11px!important;}
  .cw-asset-mgr .cw-am-text{display:none!important;}
  .cw-zoom{gap:2px!important;margin-left:2px!important;}
  .cw-zoom .cw-zoom-btn{width:18px!important;height:18px!important;padding:0!important;}
  .cw-b-left button{width:22px!important;height:22px!important;}
}
@media (max-width:1400px){
  .cw-b-left,.cw-b-right{gap:4px!important;}
  .cw-asset-mgr{font-size:10.5px!important;}
  .cw-zoom{gap:1px!important;}
  .cw-zoom .cw-zoom-btn{width:16px!important;height:16px!important;}
  .cw-b-left button{width:20px!important;height:20px!important;}
}

/* ===== R1872: 参数面板 — 13 项比例（形状示意 + 5 组）/ 画质 5 档 / 生成数量 / 透明背景 ===== */
.cw-asp-wrap{display:flex;flex-direction:column;gap:8px;margin-bottom:10px;}
.cw-asp-grp{border-top:1px solid rgba(255,255,255,.06);padding-top:6px;}
.cw-asp-grp:first-child{border-top:0;padding-top:0;}
.cw-asp-grp-t{color:#6B7385;font-size:11px;margin-bottom:5px;letter-spacing:.02em;}
.cw-asp-row{display:flex;flex-wrap:wrap;gap:6px;}
.cw-asp-btn{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:6px 7px;min-width:46px;
  border-radius:9px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.02);cursor:pointer;
  transition:border-color .15s,background .15s;}
.cw-asp-btn:hover{border-color:rgba(125,211,252,.55);background:rgba(125,211,252,.08);}
.cw-asp-btn.on{border-color:#4B7DFF;background:rgba(75,125,255,.18);}
.cw-asp-btn.off{opacity:.38;cursor:not-allowed;}
.cw-asp-shape{display:block;border:1px solid rgba(232,235,242,.55);border-radius:2px;background:rgba(232,235,242,.08);}
.cw-asp-btn.on .cw-asp-shape{border-color:#9DB6FF;background:rgba(75,125,255,.28);}
.cw-asp-lb{font-size:10px;color:#C7CDDB;line-height:1;}
.cw-q-row{margin:0 0 10px;}
.cw-q-btns{display:flex;flex-wrap:wrap;gap:5px;}
.cw-q-btn{height:26px;padding:0 9px;border-radius:7px;border:1px solid rgba(255,255,255,.1);
  background:transparent;color:#C7CDDB;font-size:11.5px;cursor:pointer;transition:.15s;}
.cw-q-btn:hover{border-color:rgba(125,211,252,.55);}
.cw-q-btn.on{border-color:#4B7DFF;background:#4B7DFF;color:#fff;}
.cw-q-btn.off{color:#4a5060;opacity:.45;cursor:not-allowed;text-decoration:line-through;}
.cw-cnt-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;
  border-top:1px solid rgba(255,255,255,.06);padding-top:8px;}
.cw-cnt-ctl{display:flex;align-items:center;gap:6px;}
.cw-cnt-b{width:26px;height:26px;border-radius:7px;border:1px solid rgba(255,255,255,.12);background:transparent;
  color:#C7CDDB;font-size:14px;line-height:1;cursor:pointer;}
.cw-cnt-b:hover{border-color:rgba(125,211,252,.55);color:#fff;}
.cw-cnt-v{min-width:22px;text-align:center;font-size:12px;color:#E8EBF2;}