/* Exact live portfolio corner thread and Wooster preview/gallery rules.
   Sources: site.css2611–2697, folder-navigation-v22.css56–57,
   wooster-street-interactions-v21_A.css1–25. */
.imsg{
  position:fixed;z-index:820;right:18px;bottom:18px;left:auto;top:auto;
  width:304px;
  display:flex;flex-direction:column;align-items:flex-start;gap:6px;
  transform:scale(.6);transform-origin:100% 100%;
  opacity:0;visibility:hidden;pointer-events:none;
  transition:opacity .26s ease,visibility 0s linear .26s;
}
.imsg.on{opacity:1;visibility:visible;pointer-events:auto;transition:opacity .26s ease,visibility 0s}
.imsg-b{
  max-width:100%;background:#0b93f6;color:#fff;
  font-family:-apple-system,BlinkMacSystemFont,'Helvetica Neue',Helvetica,Arial,sans-serif;
  font-size:16px;line-height:1.32;letter-spacing:-.011em;
  padding:9px 14px 10px;border-radius:18px;
  box-shadow:0 1px 2px rgba(0,0,0,.28);
  /* the pop: iOS scales a new bubble up from its own bottom-left */
  transform:scale(.82);transform-origin:0 100%;opacity:0;
  transition:transform .3s cubic-bezier(.2,1.5,.4,1),opacity .2s ease;
}
.imsg-b.in{transform:none;opacity:1}
.imsg-b.tail{border-bottom-left-radius:5px}
/* what you send back reads as the other side of the thread */
.imsg-b.mine{background:#3b3b3d;align-self:flex-end;transform-origin:100% 100%}
.imsg-b.mine.tail{border-bottom-left-radius:18px;border-bottom-right-radius:5px}
.imsg-b.bad{background:#e0304a}
/* a link inside a bubble: an address, or a headline worth reading */
.imsg-b a{color:#fff;text-decoration:underline;text-underline-offset:.18em;
  text-decoration-thickness:1px;overflow-wrap:anywhere}
.imsg-b a:hover{color:#fff;opacity:.86}
.imsg-b .imsg-src{display:block;opacity:.72;font-size:.8em;margin-top:3px;letter-spacing:.02em}
/* the three dots, while the next one is "being typed" */
.imsg-typing{
  display:flex;gap:4px;align-items:center;background:#3b3b3d;
  padding:11px 13px;border-radius:18px;border-bottom-left-radius:5px;
  transform:scale(.82);transform-origin:0 100%;opacity:0;
  transition:transform .3s cubic-bezier(.2,1.5,.4,1),opacity .2s ease;
}
.imsg-typing.in{transform:none;opacity:1}
.imsg-typing i{width:7px;height:7px;border-radius:50%;background:#9a9a9e;animation:imsgdot 1.25s infinite}
.imsg-typing i:nth-child(2){animation-delay:.18s}
.imsg-typing i:nth-child(3){animation-delay:.36s}
@keyframes imsgdot{0%,60%,100%{opacity:.38;transform:translateY(0)}30%{opacity:1;transform:translateY(-2.5px)}}
/* the field and the Send, as one pill row */
.imsg-row{
  display:flex;align-items:flex-end;gap:7px;width:100%;margin-top:2px;
  opacity:0;transform:translateY(4px);transition:opacity .24s ease,transform .24s ease;
}
.imsg-row.in{opacity:1;transform:none}
.imsg-row.off{display:none}
.imsg-row form{display:flex;align-items:center;gap:7px;width:100%}
.imsg-row input{
  flex:1;min-width:0;background:#1c1c1e;color:#fff;
  border:1px solid #48484a;border-radius:17px;padding:8px 13px;
  font-family:-apple-system,BlinkMacSystemFont,'Helvetica Neue',Helvetica,Arial,sans-serif;
  font-size:16px;letter-spacing:-.011em;
  /* 16px, and the thread is scaled rather than re-specified, so iOS never
     zooms the page on focus — see the note at the top */
}
.imsg-row input:focus{outline:none;border-color:#0b93f6}
.imsg-row input::placeholder{color:#8e8e93}
.imsg-send{
  flex:0 0 auto;width:30px;height:30px;border:0;border-radius:50%;
  background:#0b93f6;color:#fff;cursor:pointer;display:grid;place-items:center;
  transition:background .15s ease,transform .12s ease,opacity .15s ease;
}
.imsg-send:hover{background:#3aa9ff}
.imsg-send:active{transform:scale(.9)}
.imsg-send:disabled{background:#48484a;cursor:default}
.imsg-send svg{width:15px;height:15px;display:block;fill:currentColor}
/* the dismiss, top right of the thread — a note with no field needs a way out
   that is not the Escape key */
.imsg-x{
  position:absolute;top:-9px;right:-9px;width:22px;height:22px;border:0;
  border-radius:50%;background:#3b3b3d;color:#fff;cursor:pointer;
  font:600 15px/1 -apple-system,BlinkMacSystemFont,Helvetica,Arial,sans-serif;
  display:grid;place-items:center;padding:0 0 2px;opacity:0;
  transition:opacity .2s ease,background .15s ease;
}
.imsg:hover .imsg-x,.imsg-x:focus{opacity:1}
.imsg-x:hover{background:#5a5a5e}
/* the folder a locked thread belongs to keeps a hairline key while it is shut */
.pfold.locked .lab::after{content:' \1F512';font-size:.85em;opacity:.75}

@media(max-width:760px){
  /* the same corner, a little tighter into it */
  .imsg{right:10px;bottom:10px}
}
body .imsg-row:has(.imsg-password-hint){flex-direction:column;align-items:stretch}
body .imsg-password-hint{margin:4px 0 0;padding:3px 7px;background:#000;color:#b8b5ae;font:400 16px/1.45 var(--body,'Courier New',monospace);letter-spacing:0}
/* Wooster Street — image previews and measured-plan callouts. */
.wsi-popup{position:fixed;z-index:910;width:min(480px,calc(100vw - 24px));max-height:calc(100dvh - 24px);overflow:auto;border:1px solid #494640;background:#0d0d0d;color:#e9e7e2;box-shadow:0 12px 34px rgba(0,0,0,.62)}
.wsi-popup[hidden],.wsi-popup [hidden]{display:none!important}
.wsi-popup--note{width:min(300px,calc(100vw - 24px))}
.wsi-preview-media{background:#080808;line-height:0;min-height:100px}
.wsi-preview-media img{display:block;width:100%;height:auto;max-height:min(340px,55dvh);object-fit:contain;filter:none}
.wsi-popup-body{padding:12px 14px}
.wsi-popup-title,.wsi-popup-note{margin:0;font-family:var(--body,'Courier New',monospace);font-size:11px;line-height:1.5;font-weight:400;letter-spacing:.045em}
.wsi-popup-title{text-transform:uppercase}
.wsi-popup-note{margin-top:5px;color:#aaa69e}
.wsi-popup-actions{display:flex;gap:24px;align-items:center;justify-content:space-between;margin-top:8px}
.wsi-popup button,.wsi-gallery button{appearance:none;background:transparent;color:#e9e7e2;border:0;border-radius:0;min-height:40px;padding:6px 0;font-family:var(--body,'Courier New',monospace);font-size:11px;line-height:1.4;font-weight:400;letter-spacing:.045em;text-transform:uppercase;cursor:pointer}
.wsi-popup button:hover,.wsi-gallery button:hover{color:#fff;text-decoration:underline;text-underline-offset:4px}
.wsi-popup button:focus-visible,.wsi-gallery button:focus-visible,[data-ws-render]:focus-visible,[data-ws-hotspot]:focus-visible{outline:2px solid #b1bded;outline-offset:4px}
.wsi-gallery{color:#e9e7e2;background:#0a0a0a;border:1px solid #494640;padding:0;width:min(1320px,calc(100vw - 32px));max-width:none;max-height:calc(100dvh - 32px);overflow:auto;box-shadow:0 15px 70px #000}
.wsi-gallery::backdrop{background:rgba(0,0,0,.88)}
.wsi-gallery-bar,.wsi-gallery-foot{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:10px 18px}
.wsi-gallery-bar{border-bottom:1px solid #34312d}
.wsi-gallery-bar h2{margin:0;font-family:var(--body,'Courier New',monospace);font-size:12px;line-height:1.5;font-weight:400;letter-spacing:.06em;text-transform:uppercase}
.wsi-gallery-bar button{flex:none}
.wsi-gallery-stage{height:min(70dvh,820px);display:grid;place-items:center;min-height:180px;background:#050505}
.wsi-gallery-image{display:block;max-width:100%;max-height:100%;width:100%;height:100%;object-fit:contain;filter:none}
.wsi-gallery-foot{border-top:1px solid #34312d}
.wsi-gallery-count{font-family:var(--body,'Courier New',monospace);font-size:11px;color:#aaa69e;white-space:nowrap}
@media(max-width:600px){.wsi-popup{width:min(360px,calc(100vw - 24px))}.wsi-popup--note{width:min(300px,calc(100vw - 24px))}.wsi-preview-media img{max-height:45dvh}.wsi-gallery{width:calc(100vw - 20px);max-height:calc(100dvh - 20px)}.wsi-gallery-bar,.wsi-gallery-foot{padding:8px 12px;gap:10px}.wsi-gallery-stage{height:65dvh}.wsi-gallery-bar h2{font-size:11px}}

/* Local/a11y safeguards; no visual respecification. */
body[data-protected]:not(.gate-ready)>:not(noscript){visibility:hidden}
.qe-popup-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
[data-cat].hide,.gsec.hide{display:none!important}
.imsg .imsg-x:focus-visible,.imsg-send:focus-visible{outline:2px solid #b1bded;outline-offset:4px}
@media(prefers-reduced-motion:reduce){.imsg,.imsg-b,.imsg-row,.imsg-typing,.imsg-typing i{transition:none!important;animation:none!important}}