/* 사진 도구에만 적용한다. 기존 제작 폼·광고·전역 배치는 변경하지 않는다. */.sbr{padding-block:32px 64px}.sbr-intro{margin-bottom:24px}.sbr-title-row{display:flex;align-items:center;gap:12px;margin-bottom:10px}.sbr-intro h1{margin:0;font-size:clamp(26px, 3vw, 36px)}.sbr-intro > p{color:var(--muted);line-height:1.7;text-wrap:pretty;font-size:15px}.sbr-resources{--section-width:860px;padding-bottom:var(--space-section)}.sbr-resources .sbr-tips{margin-top:0}.sbr-trust{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--muted)}.sbr-trust .icon{flex-shrink:0;width:16px;height:16px}.sbr-steps{display:flex;gap:24px;list-style:none;padding:0;margin:0;font-size:12px;color:var(--muted)}.sbr-steps li{display:flex;align-items:center;gap:8px}.sbr-steps li > span{color:var(--red);font-weight:700}.sbr-upload{border:1px solid var(--color-border-panel);background:var(--surface);border-radius:var(--radius);overflow:hidden}.sbr-upload[hidden]{display:none}.sbr-workspace-bar{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:16px 24px;border-bottom:1px solid var(--border)}.sbr-workspace-bar h2{font-size:14px;margin:0}.sbr-empty-canvas{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;width:calc(100% - 32px);min-height:330px;margin:16px;padding:32px 20px;border:1px dashed var(--color-border-interactive);border-radius:6px;color:var(--color-heading);font:inherit;text-align:center;cursor:pointer;background:conic-gradient(var(--surface) 25%, var(--soft) 0 50%, var(--surface) 0 75%, var(--soft) 0) 0 0/24px 24px}.sbr-empty-canvas:hover,.sbr.dragover .sbr-empty-canvas{border-color:var(--red)}.sbr.dragover .sbr-empty-canvas{outline:3px solid var(--red);outline-offset:-3px}.sbr.dragover #sbr-editor{outline:3px solid var(--red);outline-offset:4px}.sbr-empty-icon{display:flex;align-items:center;justify-content:center;position:relative;width:64px;height:64px;margin-bottom:6px;background:var(--surface);border:1px solid var(--color-border-panel);border-radius:12px;color:var(--muted)}.sbr-empty-icon > .icon{width:30px;height:30px}.sbr-empty-icon > span{position:absolute;right:-6px;bottom:-4px;width:24px;height:24px;background:var(--red);border-radius:50%;color:var(--color-on-action);font-size:18px;line-height:24px}.sbr-empty-canvas > strong{font-size:22px;line-height:1.5}.sbr-empty-description{color:var(--muted);font-size:14px;line-height:1.7;word-break:keep-all;text-wrap:balance}.sbr-pick-label{display:inline-flex;align-items:center;gap:16px;padding:12px 24px;margin-top:6px;min-height:48px;color:var(--color-on-action);background:var(--red);border-radius:6px;font-size:15px;font-weight:700}.sbr-paste-hint{color:var(--muted);font-size:12px;line-height:1.7}.sbr-mobile-copy{display:none}.sbr-upload-footer{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:0 24px 16px}.sbr-upload-footer > p{text-align:right}.sbr-actions{display:flex;flex-wrap:wrap;gap:20px}.sbr-workspace-footer{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:16px 24px;border-top:1px solid var(--border)}.sbr-hint{color:var(--muted);font-size:13px;line-height:1.8}.sbr-text-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;background:transparent;padding:10px 0;min-height:44px;color:var(--red);font-size:13px}.sbr-status{margin:16px 0 24px;font-size:14px;line-height:1.8;color:var(--muted)}.sbr-status:empty{margin:0}.sbr-status.error{color:var(--red)}.sbr-editor-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:20px}.sbr-editor-heading h2{font-size:20px}.sbr-editor-actions{display:flex;align-items:center;gap:16px;flex-shrink:0}.sbr :is(button,a,input,select,summary,[tabindex]):focus-visible{outline:3px solid var(--red);outline-offset:4px}#sbr-editor-title{scroll-margin-top:100px}.sbr-panels{display:grid;grid-template-columns:repeat(2, minmax(0, 1fr));gap:16px 24px}/* 제목·안내·이미지 행을 공유해 체크박스나 줄바꿈이 생겨도 두 캔버스가 정렬된다. */.sbr-panel{min-width:0;border:1px solid var(--color-border-panel);border-radius:var(--radius);background:var(--surface);padding:24px;display:grid;gap:16px;grid-template-rows:subgrid;grid-row:span 4}.sbr-panel-controls{min-width:0;display:grid;gap:16px;align-content:start}.sbr-crop-suggestion{display:flex;flex-wrap:wrap;gap:8px}.sbr-crop-suggestion p{flex-basis:100%}.sbr-preview-options{display:flex;align-items:center}.sbr-panel-heading{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap}.sbr-panel-heading h3{font-size:16px}.sbr-panel-heading h3 > span{color:var(--red);margin-right:8px}.sbr-panel > p + p{margin-top:0}.sbr-canvas-frame{position:relative;display:flex;justify-content:center;align-items:center;height:320px;background:var(--soft);border:1px solid var(--border);border-radius:6px;overflow:hidden;padding:12px}.sbr-canvas-frame canvas{display:block;max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain}.sbr-source-frame canvas.selecting{cursor:crosshair;touch-action:none}.sbr-source-options{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:4px 12px}.sbr-source-options .sbr-checkbox{flex-shrink:0}.sbr-result-frame{background:conic-gradient(var(--color-checker-dark) 25%, var(--color-checker-light) 0 50%, var(--color-checker-dark) 0 75%, var(--color-checker-light) 0) 0 0/20px 20px}.sbr-result-frame.white{background:var(--color-checker-light)}.sbr-result-frame.dark{background:var(--color-heading)}.sbr-result-frame.paper{background:var(--soft)}.sbr-result-frame > .result-loader{position:absolute}.sbr-result-frame:not(.result-pending) .result-loader::before{animation:none}.sbr-result-frame p{position:absolute;max-width:calc(100% - 32px);font-size:14px;text-align:center;color:var(--muted);padding:16px;background:var(--surface);border:1px solid var(--border);border-radius:6px}.sbr-toolbar{display:grid;grid-template-columns:repeat(3, minmax(0, 1fr));gap:8px}.sbr-toolbar button{font-size:13px;padding:8px}.sbr-toolbar [aria-pressed="true"]{background:var(--tint);border-color:var(--red);color:var(--red)}.sbr-rotation{border-top:1px solid var(--border);padding-top:12px}.sbr-rotation-heading{display:flex;align-items:center;gap:10px;font-size:13px;flex-wrap:wrap}.sbr-rotation-heading > span{display:inline-flex;align-items:center;gap:4px}.sbr-rotation-heading input{width:80px;min-width:0;padding:8px;font-variant-numeric:tabular-nums}.sbr-rotation-heading button{margin-left:auto}.sbr-rotation input[type="range"]{width:100%;min-height:36px;margin:4px 0;accent-color:var(--red)}/* 사진 위에 고정된 수평·수직 안내선. Canvas 픽셀과 분리하고 범위 선택을 가로막지 않는다. */.sbr-source-frame::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background-image:linear-gradient(rgb(255 255 255 / .5) 1px, rgb(30 30 30 / .25) 1px 2px, transparent 2px),linear-gradient(90deg, rgb(255 255 255 / .5) 1px, rgb(30 30 30 / .25) 1px 2px, transparent 2px);background-size:24px 24px;background-position:center}.sbr-source-frame.grid-hidden::after{display:none}.sbr-source-frame canvas.perspective{cursor:crosshair;touch-action:none}.sbr-corner-values{border:0;padding:0;margin:12px 0 16px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.sbr-corner-values legend{font-size:12px;color:var(--muted);margin-bottom:8px}.sbr-corner-values label{display:grid;gap:6px;font-size:13px}.sbr-corner-values input{width:100%;min-width:0;padding:8px}#sbr-perspective-controls > .sbr-hint:first-child{margin-bottom:12px}.sbr-details{border-top:1px solid var(--border);padding-top:12px}.sbr-details summary{display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:14px;padding-block:8px}.sbr-details summary::after{content:"+";color:var(--muted);font-size:18px}.sbr-details[open] summary::after{content:"−"}.sbr-crop-values{border:0;margin:16px 0 0;padding:0;display:grid;grid-template-columns:repeat(4, minmax(0, 1fr));gap:8px}.sbr-crop-values legend{font-size:12px;color:var(--muted);margin-bottom:10px}.sbr-crop-values label{font-size:12px;display:grid;gap:6px}.sbr-crop-values input{width:100%;min-width:0;padding:8px}.sbr-mode,.sbr-background{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:13px}.sbr-mode select,.sbr-background select{min-width:0;max-width:60%;font-size:13px}.sbr-choice{min-width:0;margin:0;padding:0;border:0}.sbr-choice legend{padding:0;margin-bottom:8px;font-size:13px}.sbr-choice > .sbr-hint{margin-top:8px}.sbr-choice .segmented{grid-auto-flow:row;grid-template-columns:repeat(auto-fit, minmax(min(100%, 110px), 1fr))}.sbr-settings{display:grid;gap:16px;margin-top:16px}.sbr-settings > label:not(.sbr-checkbox){display:grid;grid-template-columns:1fr auto;gap:8px;font-size:14px}.sbr-settings output{color:var(--red);font-variant-numeric:tabular-nums}.sbr-settings input[type="range"]{grid-column:1/-1;width:100%;margin:0;min-height:36px;accent-color:var(--red)}.sbr-checkbox{display:flex;gap:8px;align-items:center;font-size:13px;min-height:44px}.sbr-checkbox input{width:18px;height:18px;accent-color:var(--red)}.sbr-export-actions{display:grid;gap:10px}#sbr-vault-status:empty{display:none}.sbr-color-settings{min-width:0;margin:0;padding:16px 0 0;border:0;border-top:1px solid var(--border)}.sbr-color-settings legend{padding:0 8px 0 0;font-size:14px;font-weight:700}.sbr-color-picker{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:16px 0 8px;font-size:13px}.sbr-color-picker > span{display:flex;align-items:center;gap:10px}.sbr-color-picker output{font-variant-numeric:tabular-nums;color:var(--muted)}.sbr-color-picker input[type="color"]{width:52px;height:44px;padding:4px;cursor:pointer;border:1px solid var(--border);border-radius:6px;background:var(--surface)}.sbr-export-actions:has(> [hidden]):not(:has(> :not([hidden]))){display:none}.sbr-quality-note{color:var(--muted);font-size:13px;line-height:1.8;padding-top:16px;border-top:1px solid var(--border)}.sbr-tips{margin-top:64px;padding-top:32px;border-top:1px solid var(--border)}.sbr-tips h2{font-size:22px;margin-bottom:24px}.sbr-tip-grid{display:grid;grid-template-columns:repeat(3, minmax(0, 1fr));gap:32px;margin-bottom:24px}.sbr-tip-grid h3{font-size:16px;margin-bottom:10px}.sbr-tip-grid p{font-size:14px;color:var(--muted);line-height:1.85}@media (max-width: 800px){.sbr{padding-block:24px 40px}.sbr-intro{margin-bottom:20px}.sbr-intro > p{font-size:14px}.sbr-steps{justify-content:space-between;gap:8px;width:100%}.sbr-steps li{gap:5px}.sbr-workspace-bar{padding:12px 16px}.sbr-workspace-bar > span{font-size:12px}.sbr-empty-canvas{width:calc(100% - 24px);min-height:280px;margin:12px;padding:24px 12px;gap:10px}.sbr-empty-canvas > strong{font-size:20px}.sbr-empty-description{font-size:13px;max-width:240px}.sbr-paste-hint,.sbr-desktop-copy{display:none}.sbr-mobile-copy{display:inline}.sbr-upload-footer{flex-direction:column;align-items:stretch;gap:8px;padding:0 16px 16px}.sbr-upload-footer > p{text-align:center;font-size:12px}.sbr-actions{justify-content:center;gap:16px}.sbr-workspace-footer{flex-direction:column;padding:16px;gap:12px}.sbr-editor-heading{flex-direction:column;align-items:flex-start}.sbr-editor-actions{width:100%;justify-content:space-between}.sbr-panels{grid-template-columns:minmax(0, 1fr);gap:20px}.sbr-panel{padding:18px;grid-template-rows:none;grid-row:auto}.sbr-canvas-frame{height:280px}.sbr-editor-heading h2,.sbr-tips h2{font-size:20px}.sbr-tips{margin-top:40px}.sbr-tip-grid{grid-template-columns:1fr;gap:24px}}