@layer legacy{/* The collapsed control lives in the canvas corner; opening it creates a temporary inspection surface. */
.reference-dock{position:absolute;z-index:42;right:8px;bottom:38px;display:flex;align-items:flex-end;gap:8px;pointer-events:none;color:var(--iw-text-1);font-family:"DM Sans",sans-serif}.reference-dock-rail,.reference-dock-panel{pointer-events:auto;background:var(--iw-surface-2);border:1px solid var(--iw-accent-line);box-shadow:0 10px 35px #20345820}.reference-dock-rail{width:min(205px,calc(100vw - 20px));min-height:50px;padding:6px 8px;border-radius:10px;display:flex;align-items:center;gap:8px;color:var(--iw-accent-text);cursor:pointer;font:600 11px/1.2 "DM Sans",sans-serif;text-align:left}.reference-dock-rail[hidden]{display:none}.reference-dock-rail-copy{min-width:0;display:flex;flex:1;flex-direction:column;gap:3px;color:var(--iw-text-2)}.reference-dock-rail-copy b{font-size:10px;color:var(--iw-text-1)}.reference-dock-rail-copy small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:9px;color:var(--iw-text-3);font-weight:400}.reference-dock-rail-count{font-size:11px;font-weight:700;background:var(--iw-accent-soft);border-radius:10px;padding:3px 6px;min-width:19px;text-align:center}.reference-dock-rail-thumb{flex:0 0 32px;width:32px;height:40px;border:1px solid var(--iw-line-3);border-radius:4px;overflow:hidden;background:var(--iw-surface-3)}.reference-dock-rail-thumb img{width:100%;height:100%;object-fit:cover}.reference-dock-rail-thumb img.is-unavailable,.reference-dock-pages img.is-unavailable,.reference-dock-compare img.is-unavailable{object-fit:contain;background:var(--iw-surface-3);color:var(--iw-text-3);font-size:10px}.reference-dock-panel{position:fixed;right:calc(var(--inspector-width,242px) + 12px);top:112px;bottom:54px;width:min(390px,calc(100vw - var(--inspector-width,242px) - 24px));max-height:none;display:flex;flex-direction:column;border-radius:12px;overflow:hidden}.reference-dock-panel[hidden]{display:none}.reference-dock-panel>header{padding:15px 16px 12px;display:flex;align-items:flex-start;justify-content:space-between;gap:12px;border-bottom:1px solid var(--iw-line-2);background:var(--iw-surface-3)}.reference-dock-panel h2{margin:0;color:var(--iw-text-1);font-size:16px;line-height:1.3;font-weight:700}.reference-dock-panel header p{margin:4px 0 0;color:var(--iw-text-3);font-size:11px;line-height:1.4}.reference-dock-close{width:30px;height:30px;border:1px solid var(--iw-accent-line);border-radius:7px;background:var(--iw-surface-2);color:var(--iw-text-3);font-size:22px;line-height:1;cursor:pointer}.reference-dock-content{overflow:auto;padding:13px 14px 16px;overscroll-behavior:contain}.reference-dock-content:focus-visible{outline:3px solid color-mix(in oklab, var(--iw-success) 45%, transparent);outline-offset:-3px}.reference-dock-empty,.reference-dock-pages-empty{margin:0;padding:15px;border:1px solid var(--iw-accent-line);border-radius:8px;background:var(--iw-surface-3);color:var(--iw-text-3);font-size:12px;line-height:1.55}.reference-dock-pages{display:flex;gap:8px;overflow-x:auto;padding:1px 1px 10px;scrollbar-width:thin}.reference-dock-pages button{flex:0 0 62px;width:62px;padding:3px;border:1px solid var(--iw-accent-line);border-radius:7px;background:var(--iw-surface-2);color:var(--iw-text-3);cursor:pointer;text-align:center}.reference-dock-pages button.is-selected{border:2px solid var(--iw-accent-line);padding:2px;color:var(--iw-accent-text)}.reference-dock-pages button:focus-visible,.reference-dock button:focus-visible,.reference-dock a:focus-visible{outline:3px solid color-mix(in oklab, var(--iw-success) 45%, transparent);outline-offset:2px}.reference-dock-pages img{display:block;width:100%;height:70px;object-fit:cover;background:var(--iw-surface-3);border-radius:3px}.reference-dock-pages button>span{display:block;padding:4px 0 1px;font-size:10px;font-weight:700}.reference-dock-pages button>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.reference-dock-compare{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin:2px 0 9px}.reference-dock-compare figure{min-width:0;margin:0;border:1px solid var(--iw-accent-line);border-radius:7px;overflow:hidden;background:var(--iw-surface-3)}.reference-dock-compare figure>img,.reference-dock-compare figure>canvas,.reference-dock-enlarge img{display:block;width:100%;height:164px;object-fit:contain;background:var(--iw-surface-3)}.reference-dock-enlarge{position:relative;display:block;width:100%;padding:0;border:0;background:transparent;cursor:zoom-in}.reference-dock-enlarge>span{position:absolute;right:6px;bottom:6px;padding:4px 7px;border-radius:5px;background:#202B47dc;color:white;font-size:10px}.reference-dock-compare figcaption{display:flex;flex-direction:column;gap:4px;padding:7px 8px;min-height:65px;font-size:10px;line-height:1.4;overflow-wrap:anywhere}.reference-dock-compare figcaption b{color:var(--iw-text-1);font-size:10px}.reference-dock-compare figcaption span{color:var(--iw-text-3)}.reference-dock-compare figcaption a,.reference-dock-links a,.reference-dock-link-list a{color:var(--iw-accent-text);font-weight:600;text-decoration:underline;text-underline-offset:2px}.reference-dock-compare figcaption small{font-size:9px;color:var(--iw-text-3);overflow-wrap:anywhere}.reference-dock-map{display:block;margin:0 0 12px;padding:7px 9px;border-radius:6px;background:var(--iw-surface-3);color:var(--iw-text-3);font-size:10px;line-height:1.4}.reference-dock-map.is-mapped{background:var(--iw-surface-3);color:var(--iw-success)}.reference-dock-map.is-manual{background:var(--iw-surface-4);color:var(--iw-warning)}.reference-dock-compare-empty{min-height:96px;padding:15px;border:1px dashed var(--iw-line-3);border-radius:7px;display:flex;flex-direction:column;gap:5px;color:var(--iw-text-2);font-size:11px;line-height:1.45}.reference-dock-compare-empty span,.reference-dock-muted,.reference-dock-origin-count{color:var(--iw-text-3);font-size:10px;line-height:1.5}.reference-dock-origin-count{margin:8px 1px}.reference-dock-render-state{margin:0 0 10px;color:var(--iw-text-3);font-size:9px;line-height:1.45;overflow-wrap:anywhere}.reference-dock-links{margin-top:12px;padding-top:10px;border-top:1px solid var(--iw-line-2)}.reference-dock-links h3{margin:0 0 7px;font-size:12px;color:var(--iw-text-2)}.reference-dock-links ul,.reference-dock-link-list,.reference-dock-blueprint ul{list-style:none;padding:0;margin:0;display:grid;gap:8px}.reference-dock-links li,.reference-dock-link-list li{display:grid;gap:3px;padding:8px 9px;border:1px solid var(--iw-accent-line);border-radius:7px;font-size:10px;color:var(--iw-text-3);overflow-wrap:anywhere}.reference-dock-links li>span,.reference-dock-link-list li>span{font-weight:700;color:var(--iw-text-2)}.reference-dock-links li>small,.reference-dock-link-list li>small{font-size:10px;line-height:1.4;color:var(--iw-text-2)}.reference-dock-blueprint{margin-top:12px;padding-top:10px;border-top:1px solid var(--iw-line-2);color:var(--iw-text-2);font-size:10px}.reference-dock-blueprint summary{cursor:pointer;font-weight:700}.reference-dock-blueprint ul{margin-top:8px;gap:5px}.reference-dock-blueprint li{padding:6px 8px;background:var(--iw-surface-3);border-radius:5px;line-height:1.4}.reference-preview[hidden]{display:none}.reference-preview{position:fixed;inset:0;z-index:100;background:#131b2bdc;display:grid;place-items:center;padding:20px;pointer-events:auto}.reference-preview>section{width:min(1100px,100%);height:min(850px,100%);display:flex;flex-direction:column;border-radius:12px;overflow:hidden;background:var(--iw-surface-2);box-shadow:0 20px 60px #0005}.reference-preview header{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;border-bottom:1px solid var(--iw-line-2)}.reference-preview h2{margin:0;font-size:15px;color:var(--iw-text-1)}.reference-preview header p{margin:3px 0 0;font-size:11px;color:var(--iw-text-3)}.reference-preview header button,.reference-preview-controls button{min-height:34px;padding:5px 10px;border:1px solid var(--iw-accent-line);border-radius:7px;background:var(--iw-surface-2);color:var(--iw-text-2);cursor:pointer}.reference-preview header button{font-size:20px}.reference-preview-controls{display:flex;align-items:center;justify-content:center;gap:8px;padding:8px;border-bottom:1px solid var(--iw-line-1)}.reference-preview-controls span{min-width:45px;text-align:center;font-size:11px;color:var(--iw-text-2)}.reference-preview-stage{flex:1;min-height:0;overflow:auto;background:var(--iw-surface-3);padding:20px}.reference-preview-stage img{display:block;margin:0 auto;object-fit:contain;box-shadow:0 4px 18px #20345826}
@media(max-width:650px){.reference-dock{right:7px;bottom:35px;gap:5px}.reference-dock-rail{width:min(196px,calc(100vw - 14px));min-height:45px;padding:5px 7px}.reference-dock-rail-thumb{flex-basis:30px;width:30px;height:37px}.reference-dock-panel{right:7px;top:auto;bottom:60px;width:min(390px,calc(100vw - 14px));height:min(54dvh,450px);max-height:calc(100dvh - 120px)}.reference-dock-panel>header{padding:11px 12px 9px}.reference-dock-content{padding:10px}.reference-dock-compare{gap:6px}.reference-dock-compare figure>img,.reference-dock-compare figure>canvas,.reference-dock-enlarge img{height:122px}.reference-preview{padding:8px}.reference-preview>section{height:100%;border-radius:8px}.reference-preview-stage{padding:8px}
}
@media(max-width:1000px){.reference-dock-panel{right:12px;width:min(390px,calc(100vw - 24px))}.editor-workspace:has(>.inspector.mobile-open) .reference-dock-panel{right:calc(260px + 12px);width:min(390px,calc(100vw - 284px))}}
@media(min-width:1001px){.reference-dock-panel{right:calc(var(--inspector-width,242px) + 12px);width:min(390px,calc(100vw - var(--inspector-width,242px) - 24px))}}
@media(max-width:650px){/* Reference comparison is a full-width bottom sheet above the mobile inspector. */
  .editor-workspace:has(>.inspector.mobile-open) .reference-dock-panel{left:8px;right:8px;top:auto;bottom:60px;width:auto;height:min(54dvh,450px);max-width:none;max-height:calc(100dvh - 120px);z-index:50}.reference-dock{position:relative;right:auto;bottom:auto;flex:0 0 auto;width:100%;height:0;min-height:0;padding:0;box-sizing:border-box;align-items:center;justify-content:flex-end;overflow:visible}.reference-dock:has(.reference-dock-rail:not([hidden])){height:52px;min-height:52px;padding:3px 7px;border-top:1px solid var(--iw-accent-line);background:var(--iw-surface-3)}
}

@media(max-width:650px) and (min-height:651px){/* When chat overlays the lower workspace{position:absolute;top:8px;right:7px;bottom:min(68%,520px);left:7px;z-index:31;display:flex;flex-direction:column;align-items:flex-end;justify-content:flex-start;width:auto;height:auto;min-height:0;padding:0;overflow:visible;border:0;background:transparent}
}}}
