.pic-wrap{--pic-color-primary:#2271b1;--pic-color-primary-hover:#135e96;--pic-color-button-text:#ffffff;--pic-color-text:#1d2327;--pic-color-muted:#50575e;--pic-color-border:#dcdcde;--pic-color-panel-bg:#ffffff;--pic-color-soft-bg:#f6f7f7;--pic-radius:8px;--pic-radius-sm:4px;--pic-gap:32px;--pic-pad:20px;max-width:1400px;box-sizing:border-box;font-family:inherit;color:var(--pic-color-text);line-height:1.5}.pic-wrap *,.pic-wrap *::before,.pic-wrap *::after{box-sizing:border-box;font-family:inherit}.pic-context-frontend{margin:24px auto;padding:0 16px}.pic-heading{font-size:1.6em;margin:0 0 12px;color:var(--pic-color-text);font-family:inherit}.pic-intro{font-size:.95em;color:var(--pic-color-muted);margin:0 0 24px;max-width:820px}.pic-default-notice{font-size:.9em;color:var(--pic-color-muted);background:color-mix(in srgb,var(--pic-color-primary) 8%,transparent);border-left:3px solid var(--pic-color-primary);padding:8px 12px;margin:0 0 16px}.pic-layout{display:grid;grid-template-columns:360px 1fr;gap:var(--pic-gap);align-items:start}.pic-controls{background:var(--pic-color-panel-bg);border:1px solid var(--pic-color-border);border-radius:var(--pic-radius);padding:var(--pic-pad);box-shadow:0 1px 2px rgba(0,0,0,.04);min-width:0}.pic-step{padding:14px 0;border-bottom:1px solid var(--pic-color-border)}.pic-step:first-child{padding-top:0}.pic-step:last-child{padding-bottom:0;border-bottom:none}.pic-label{display:flex;align-items:center;font-weight:600;font-size:.9em;margin-bottom:10px;color:var(--pic-color-text);gap:10px}.pic-step-num{flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;background:var(--pic-color-primary);color:var(--pic-color-button-text);border-radius:50%;font-size:.85em;font-weight:700;line-height:1}.pic-step-text{flex:1;min-width:0}.pic-step input[type="file"]{width:100%;font:inherit;font-size:.9em;color:var(--pic-color-muted)}.pic-slider-row{display:grid;grid-template-columns:70px 1fr 50px;align-items:center;gap:10px;margin-bottom:10px;font-size:.9em}.pic-slider-row label{color:var(--pic-color-muted)}.pic-slider-row input[type="range"]{width:100%;margin:0;accent-color:var(--pic-color-primary)}.pic-slider-row span{text-align:right;color:var(--pic-color-muted);font-variant-numeric:tabular-nums}.pic-hint{font-size:.8em;color:var(--pic-color-muted);margin:8px 0 12px;line-height:1.5}.pic-format-row{display:flex;gap:16px;margin-bottom:12px;font-size:.9em;flex-wrap:wrap}.pic-format-row label{display:inline-flex;align-items:center;gap:6px}.pic-format-row input[type="radio"]{accent-color:var(--pic-color-primary)}.pic-btn{appearance:none;-webkit-appearance:none;display:inline-block;padding:8px 16px;border:1px solid var(--pic-color-primary);background:transparent;color:var(--pic-color-primary);border-radius:var(--pic-radius-sm);font:inherit;font-size:.9em;font-weight:500;cursor:pointer;text-decoration:none;line-height:1.4;transition:background 0.15s ease,color 0.15s ease,border-color 0.15s ease}.pic-btn:hover:not(:disabled){background:color-mix(in srgb,var(--pic-color-primary) 10%,transparent)}.pic-btn:focus-visible{outline:2px solid var(--pic-color-primary);outline-offset:2px}.pic-btn-primary{background:var(--pic-color-primary);color:var(--pic-color-button-text);width:100%;padding:12px 16px;font-size:1em;font-weight:600}.pic-btn-primary:hover:not(:disabled){background:var(--pic-color-primary-hover);border-color:var(--pic-color-primary-hover)}.pic-btn:disabled{opacity:.5;cursor:not-allowed}.pic-preview-wrap{position:sticky;top:50px;min-width:0}.pic-preview{position:relative;width:100%;aspect-ratio:1080 / 1340;background:repeating-conic-gradient(var(--pic-color-soft-bg) 0 25%,var(--pic-color-panel-bg) 0 50%) 50% / 24px 24px;border:1px solid var(--pic-color-border);border-radius:var(--pic-radius);overflow:hidden;cursor:grab;user-select:none;touch-action:none}.pic-preview.is-dragging{cursor:grabbing}#pic-canvas{width:100%;height:100%;display:block}.pic-empty{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:var(--pic-color-muted);font-size:.95em;pointer-events:none;text-align:center;padding:16px}.pic-empty.is-hidden{display:none}.pic-canvas-info{text-align:center;color:var(--pic-color-muted);font-size:.8em;margin:8px 0 0}@media (max-width:1100px){.pic-layout{grid-template-columns:1fr;gap:20px}.pic-preview-wrap{position:static;max-width:720px;margin:0 auto;width:100%}}@media (max-width:600px){.pic-wrap{--pic-pad:14px}.pic-context-frontend{margin:16px auto;padding:0 12px}.pic-heading{font-size:1.35em}.pic-intro{font-size:.9em;margin-bottom:16px}.pic-controls{padding:var(--pic-pad)}.pic-step{padding:12px 0}.pic-step:first-child{padding-top:0}.pic-step:last-child{padding-bottom:0}.pic-step-num{width:22px;height:22px;font-size:.8em}.pic-slider-row{grid-template-columns:60px 1fr 44px;gap:8px;font-size:.85em}.pic-format-row{gap:14px}.pic-btn-primary{padding:14px 16px}}@media (max-width:360px){.pic-slider-row{grid-template-columns:1fr;gap:4px}.pic-slider-row label,.pic-slider-row span{text-align:left}}.pic-context-admin .pic-heading{display:none}