.cpc-shell{border:1px solid var(--cpc-line);border-radius:8px;background:var(--cpc-panel);overflow:hidden}.cpc-body{display:grid;grid-template-columns:minmax(0,1fr)}.cpc-viewer{position:relative;min-height:290px;padding:16px;background:linear-gradient(180deg,#e2e8ee 0%,#d2dbe3 100%)}.cpc-canvas-wrap{position:relative;min-height:258px;height:clamp(258px,42vw,420px);border-radius:8px;overflow:hidden;background:linear-gradient(180deg,rgba(255,255,255,.6),rgba(255,255,255,0) 44%),#ced8e0}.cpc-canvas-wrap canvas{display:block;width:100%!important;height:100%!important}.cpc-preview-caption{position:absolute;left:28px;right:28px;bottom:26px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:9px 12px;border:1px solid rgba(31,36,36,.09);border-radius:6px;background:rgba(255,255,255,.74);backdrop-filter:blur(8px);color:var(--cpc-muted);font-size:13px}.cpc-preview-caption strong{color:var(--cpc-ink)}.cpc-controls{padding:18px}.cpc-panel{padding:16px 0;border-top:1px solid var(--cpc-line)}.cpc-panel:first-child{padding-top:0;border-top:0}.cpc-panel-head{display:grid;grid-template-columns:30px minmax(0,1fr);gap:10px;margin-bottom:12px}.cpc-panel-head>span{display:inline-flex;width:30px;height:30px;align-items:center;justify-content:center;border-radius:50%;background:var(--cpc-ink);color:#fff;font-weight:700}.cpc-panel h4{font-size:16px}.cpc-panel p{margin:3px 0 0;color:var(--cpc-muted);font-size:13px}.cpc-slider-block{display:grid;gap:8px}.cpc-slider-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px;align-items:center}.cpc-slider-value{min-width:86px;padding:7px 10px;border:1px solid var(--cpc-line);border-radius:6px;background:var(--cpc-soft);text-align:center;font-size:13px;font-weight:700}.cpc-range{width:100%;accent-color:var(--cpc-accent)}.cpc-range-marks{display:flex;justify-content:space-between;gap:8px;color:var(--cpc-muted);font-size:11px}.cpc-range-marks span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.cpc-group-note{color:var(--cpc-muted);font-size:12px}.cpc-option-block{margin-top:12px}.cpc-option-block h5{margin-bottom:8px;font-size:13px;color:var(--cpc-muted)}@media (min-width:1025px){.cpc-body{grid-template-columns:minmax(0,1.05fr) minmax(360px,.95fr)}.cpc-viewer{min-height:520px;border-right:1px solid var(--cpc-line)}.cpc-canvas-wrap{height:488px}}@media (max-width:768px){.cpc-preview-caption{left:22px;right:22px}.cpc-slider-value{margin-top:8px;text-align:left}}