#quoteFramePreview { background:var(--quote-wall-colour,#e7e5e4); }
.quote-wall-controls { display:flex; align-items:center; flex-wrap:wrap; gap:8px 12px; margin:0 0 10px; padding:9px 11px; border:1px solid var(--line,#e5e7eb); border-radius:10px; background:#fafaf9; color:var(--ink,#172033); font-size:12px; }
.quote-wall-controls strong { white-space:nowrap; }
.quote-wall-swatches { display:flex; flex-wrap:wrap; align-items:center; gap:7px; }
.quote-wall-swatches button { width:26px; height:26px; border:1px solid #94a3b8; border-radius:50%; padding:0; background:var(--wall-swatch); cursor:pointer; }
.quote-wall-swatches button[aria-pressed="true"] { outline:2px solid var(--brand,#b45309); outline-offset:2px; }
.quote-wall-custom { display:flex; align-items:center; gap:6px; margin:0; }
.quote-wall-custom span { margin:0; font-size:12px; }
#quoteWallColour { display:block; width:40px; height:30px; padding:2px; border:1px solid #94a3b8; border-radius:6px; background:#fff; cursor:pointer; }
.quote-wall-action { padding:6px 9px; border:1px solid #cbd5e1; border-radius:7px; background:white; color:var(--ink,#172033); font:inherit; cursor:pointer; }
#quoteWallColourValue { color:var(--muted,#667085); font-size:11px; }
.quote-wall-controls button:focus-visible,.quote-wall-controls input:focus-visible { outline:3px solid #2563eb; outline-offset:3px; }
#quoteWallPhotoDialog { width:min(760px,calc(100% - 24px)); max-height:90vh; overflow-y:auto; padding:16px; border:1px solid #cbd5e1; border-radius:14px; color:#172033; background:white; box-shadow:0 20px 60px #0004; }
#quoteWallPhotoDialog::backdrop { background:#17203399; }
#quoteWallPhotoDialog header { display:flex; justify-content:space-between; align-items:center; gap:12px; }
#quoteWallPhotoDialog h2 { margin:0; font-size:18px; }
#quoteWallPhotoClose { padding:7px 10px; border:1px solid #cbd5e1; border-radius:7px; background:white; color:#172033; cursor:pointer; }
#quoteWallPhotoStatus,.quote-wall-photo-help { margin:10px 0; font-size:13px; line-height:1.4; color:#475569; }
.quote-wall-photo-area { overflow:auto; border-radius:8px; background:#f1f5f9; }
#quoteWallPhotoCanvas { display:block; width:auto; height:auto; max-width:100%; margin:auto; cursor:crosshair; touch-action:manipulation; }
#quoteWallPhotoCanvas[hidden] { display:none; }
#quoteWallPhotoCanvas:focus-visible { outline:3px solid #2563eb; outline-offset:-3px; }
.quote-wall-controls .quote-wall-view-launch { border-color:var(--brand,#b45309); color:var(--brand,#b45309); font-weight:700; }
#quoteWallViewDialog { width:min(1100px,calc(100% - 24px)); max-height:94vh; overflow-y:auto; padding:16px; border:1px solid #cbd5e1; border-radius:14px; color:#172033; background:white; box-shadow:0 20px 60px #0004; }
#quoteWallViewDialog::backdrop { background:#172033aa; }
#quoteWallViewDialog header { display:flex; justify-content:space-between; align-items:flex-start; gap:12px; }
#quoteWallViewDialog h2 { margin:0; font-size:19px; }
#quoteWallViewDialog header p { margin:5px 0 0; font-size:13px; color:#475569; }
#quoteWallViewDialog button { padding:8px 11px; border:1px solid #cbd5e1; border-radius:7px; background:white; color:#172033; font:inherit; font-size:13px; cursor:pointer; }
#quoteWallViewDialog button:disabled { opacity:.45; cursor:default; }
#quoteWallViewDialog #quoteWallViewSave { background:var(--brand,#b45309); border-color:var(--brand,#b45309); color:white; font-weight:700; }
.quote-wall-view-tools { display:flex; flex-wrap:wrap; align-items:center; gap:8px 12px; margin:14px 0 8px; }
.quote-wall-view-tools label { display:flex; align-items:center; gap:8px; margin:0 0 0 auto; font-size:13px; }
#quoteWallViewScale { width:140px; padding:0; accent-color:var(--brand,#b45309); }
#quoteWallViewScaleValue { min-width:32px; font-size:12px; color:#475569; }
#quoteWallViewStatus,.quote-wall-view-help { margin:10px 0; font-size:13px; line-height:1.4; color:#475569; }
#quoteWallViewStage { position:relative; width:100%; overflow:hidden; border-radius:8px; background:#e7e5e4; isolation:isolate; }
#quoteWallViewStage[hidden],#quoteWallViewFrame[hidden] { display:none; }
#quoteWallViewPhoto { display:block; width:100%; height:auto; }
#quoteWallViewFrame { display:block; position:absolute; left:50%; top:50%; width:35%; height:auto; transform:translate(-50%,-50%); cursor:grab; touch-action:none; user-select:none; }
#quoteWallViewFrame.dragging { cursor:grabbing; }
#quoteWallViewFrame:focus-visible { outline:2px dashed #2563eb; outline-offset:3px; }
@media (max-width:480px) {
    .quote-wall-controls { gap:10px; padding:10px; }
    .quote-wall-swatches { gap:8px; }
    .quote-wall-swatches button { width:30px; height:30px; }
    .quote-wall-action { min-height:36px; }
    #quoteWallPhotoButton { margin-right:auto; }
    #quoteWallPhotoDialog { padding:12px; }
    #quoteWallViewDialog { padding:12px; }
    .quote-wall-view-tools label { margin-left:0; }
    #quoteWallViewScale { width:120px; }
}