.pn-workspace{gap:var(--space-4);width:100%;margin-bottom:var(--space-8);flex-direction:column;display:flex}.pn-features-grid{gap:var(--space-4);margin-top:var(--space-6);text-align:left;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));display:grid}.pn-feature-item{background:var(--color-surface-subtle);padding:var(--space-3);border-radius:var(--radius-sm);border:1px solid var(--color-border)}.pn-feature-title{font-weight:600;font-size:var(--text-sm);color:var(--color-text);margin-bottom:var(--space-1);align-items:center;gap:6px;display:flex}.pn-feature-desc{font-size:var(--text-xs);color:var(--color-text-muted);line-height:1.45}.pn-workspace-grid{gap:var(--space-6);grid-template-columns:360px minmax(0,1fr);align-items:start;display:grid}.pn-controls-pane{gap:var(--space-4);flex-direction:column;display:flex}.pn-doc-bar{padding:var(--space-3);justify-content:space-between;align-items:center;gap:var(--space-3);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);box-shadow:var(--shadow-sm);flex-wrap:wrap;display:flex}.pn-doc-title{font-size:var(--text-sm);color:var(--color-text);text-overflow:ellipsis;white-space:nowrap;max-width:240px;font-weight:600;display:block;overflow:hidden}.pn-doc-meta{font-size:var(--text-xs);color:var(--color-text-muted)}.pn-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-4)}.pn-section-title{margin-bottom:var(--space-3);color:var(--color-text);font-weight:600}.pn-position-matrix{gap:var(--space-2);border:2px dashed var(--color-border-strong);padding:var(--space-3);border-radius:var(--radius-sm);background:var(--color-surface-subtle);grid-template-columns:repeat(3,1fr);display:grid}.pn-position-btn{text-align:center;border-radius:var(--radius-sm);border:1px solid var(--color-border);background:var(--color-surface);min-height:38px;color:var(--color-text);cursor:pointer;justify-content:center;align-items:center;padding:6px 4px;font-size:11px;font-weight:500;transition:all .15s;display:flex}.pn-position-btn:hover{border-color:var(--color-brand);background:rgba(var(--color-brand-rgb), .05)}.pn-position-btn.active{background:var(--color-brand);color:#fff;border-color:var(--color-brand);font-weight:600}.pn-field-label{font-size:var(--text-xs);color:var(--color-text);margin-bottom:4px;font-weight:500;display:block}.pn-row-2col{gap:var(--space-3);margin-bottom:var(--space-3);grid-template-columns:1fr 1fr;display:grid}.pn-color-swatches{align-items:center;gap:var(--space-2);flex-wrap:wrap;display:flex}.pn-color-circle{cursor:pointer;border:2px solid #0000;border-radius:50%;width:26px;height:26px;transition:transform .15s,box-shadow .15s}.pn-color-circle:hover{transform:scale(1.12)}.pn-color-circle.active{box-shadow:0 0 0 2px var(--color-brand);border-color:#fff}.pn-slider-header{justify-content:space-between;align-items:center;margin-bottom:4px;display:flex}.pn-slider-val{font-size:var(--text-xs);color:var(--color-brand);font-variant-numeric:tabular-nums;font-weight:600}.pn-success-card{padding:var(--space-3) var(--space-4);background:var(--color-success-bg);border:1px solid var(--color-success-border);border-radius:var(--radius-md);justify-content:space-between;align-items:center;gap:var(--space-2);flex-wrap:wrap;display:flex}.pn-preview-pane{gap:var(--space-3);flex-direction:column;display:flex}.pn-preview-toolbar{padding:var(--space-2) var(--space-3);justify-content:space-between;align-items:center;gap:var(--space-2);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);flex-wrap:wrap;display:flex}.pn-canvas-area{padding:var(--space-4);border-radius:var(--radius-md);border:1px solid var(--color-border);background:#e2e8f0;justify-content:center;min-height:520px;display:flex;overflow-x:auto}.pn-page-wrap{background:#fff;max-width:100%;display:inline-block;position:relative;box-shadow:0 4px 16px #00000026}.pn-page-canvas{max-width:100%;height:auto;display:block}.pn-rendering-overlay{font-size:var(--text-sm);color:var(--color-brand-strong);background:#ffffffbf;justify-content:center;align-items:center;font-weight:600;display:flex;position:absolute;inset:0}@media (width<=899px){.pn-workspace-grid{grid-template-columns:1fr}.pn-doc-title{max-width:100%}}@media (width<=480px){.pn-features-grid,.pn-row-2col{grid-template-columns:1fr}.pn-position-matrix{padding:var(--space-2);gap:6px}.pn-position-btn{min-height:38px;padding:6px 3px;font-size:11px}}@media (width<=360px){.pn-position-matrix{padding:var(--space-2);gap:4px}.pn-position-btn{min-height:36px;padding:4px 2px;font-size:11px}}
