/* Inherit Shotlist's round dock, glass surfaces and UI typography. */
body { --collab-surface:#151922; --collab-text:#e2e8f0; --collab-muted:#cbd5e1; --collab-border:rgba(255,255,255,.22); --collab-focus:#f8fafc; }
body.mode-light { --collab-surface:#f8fafc; --collab-text:#0f172a; --collab-muted:#475569; --collab-border:rgba(15,23,42,.24); --collab-focus:#0f172a; }
.collab-dialog { width:min(500px,calc(100vw - 32px)); max-height:calc(100dvh - 32px); margin:auto; padding:24px; border:1px solid var(--collab-border); border-radius:24px; background:var(--collab-surface); color:var(--collab-text); box-shadow:0 24px 80px rgba(0,0,0,.3); overflow:auto; overscroll-behavior:contain; font:400 14px/1.6 var(--font-ui); }
.collab-dialog.hidden,.collab-dialog:not([open]),.collab-dialog [hidden],.annotation-layer[hidden],.collab-note[hidden],.dock-presence[hidden],.presence-expansion[hidden],.remote-cursor[hidden],#dock-annotations-button[hidden],#orb-presence-identity[hidden],.annotation-pin-status[hidden],.collab-service-status[hidden] { display:none!important; }
.collab-dialog::backdrop { background:rgba(10,12,16,.55); }
.collab-dialog .surface-card { background:transparent; border:0; box-shadow:none; padding:0; width:100%; max-height:none; }
body .collab-dialog.sbgp-modal { width:min(500px,calc(100vw - 32px)); max-height:calc(100dvh - 32px); padding:0; background:transparent; border:0; overflow:visible; }
body .collab-dialog.sbgp-modal > .surface-card { width:100%; max-height:inherit; padding:24px; overflow:auto; overscroll-behavior:contain; border-radius:24px; border:1px solid var(--glass-edge,var(--collab-border)); background:var(--collab-surface); color:var(--collab-text); box-shadow:0 24px 52px -22px var(--glass-shadow,rgba(0,0,0,.45)),inset 0 1px 1px rgba(255,255,255,.15); }
.collab-dialog h2 { font:800 20px/1.2 var(--font-ui); }
.share-heading,.share-link-heading,.note-list-heading,.note-list-footer,.note-actions,.note-header-actions { display:flex; align-items:center; gap:8px; }
.share-heading,.share-link-heading,.note-list-heading { justify-content:space-between; }
.share-heading { position:sticky; top:-24px; padding-block:4px; background:var(--collab-surface); z-index:1; }
.share-link-section { margin-top:24px; }
.share-link-section h3 { font:700 14px/1.5 var(--font-ui); }
.share-subtitle,.share-expiration,.share-message,.note-status,.collab-service-status { font:400 13px/1.6 var(--font-ui); color:var(--collab-muted); margin-top:8px; overflow-wrap:anywhere; }
.share-expiration:empty,.share-message:empty { display:none; }
.collab-dialog button,.collab-text-action { cursor:pointer; color:var(--collab-text); background:rgba(148,163,184,.12); border:1px solid var(--collab-border); border-radius:999px; font-family:var(--font-ui); transition:transform 140ms cubic-bezier(.2,0,0,1),opacity 90ms ease; }
.collab-dialog button:disabled { opacity:.6; cursor:wait; }
.collab-dialog :is(button,input,textarea,a):focus-visible,.collab-note:focus-visible,.presence-more:focus-visible,.is-pinning-note tr:focus-visible { outline:2px solid var(--collab-focus); outline-offset:2px; }
.collab-dialog button:active:not(:disabled),.collab-note:active,.presence-more:active { scale:.96; }
.share-icon-action,.note-icon-action,.cloud-close-button { display:inline-flex; align-items:center; justify-content:center; min-width:40px; height:40px; padding:0; flex:none; }
.collab-dialog svg,.collab-note svg { width:18px; height:18px; flex:none; pointer-events:none; }
.collab-text-action { display:inline-flex; align-items:center; min-height:40px; padding:8px 16px; margin-top:16px; margin-inline-end:8px; text-decoration:underline; text-underline-offset:3px; }
.share-switch { position:relative; width:60px; height:38px; padding:0; flex:none; }
.share-switch-thumb { position:absolute; top:10px; left:9px; width:17px; height:17px; border-radius:50%; background:var(--color-accent); opacity:.45; transform:translate3d(0,0,0); pointer-events:none; transition:transform 320ms cubic-bezier(.34,1.36,.64,1),opacity 150ms ease; }
.share-switch[aria-checked="true"] .share-switch-thumb { transform:translate3d(25px,0,0); opacity:1; }
.share-switch[aria-checked="true"] { border-color:var(--color-accent); }
.share-url-row { display:flex; align-items:center; gap:4px; margin-top:10px; min-width:0; }
.share-link-section[data-enabled="false"] .share-url-row { display:none; }
.share-url { width:0; min-width:0; flex:1; height:40px; padding:8px; border:1px solid var(--collab-border); border-radius:12px; background:transparent; color:var(--collab-text); font:400 14px/1.5 var(--font-ui); }
.dock-presence { display:flex; align-items:center; flex-wrap:wrap; gap:6px; max-width:100%; }
.presence-avatar { width:30px; height:30px; object-fit:cover; border-radius:50%; outline:1px solid rgba(255,255,255,.1); outline-offset:-1px; flex:none; }
body.mode-light .presence-avatar { outline-color:rgba(0,0,0,.1); }
.presence-more { min-height:var(--dock-control-height); padding-inline:10px; font:500 12px/1.5 var(--font-ui); max-width:100%; white-space:normal; }
.presence-expansion { display:flex; flex-wrap:wrap; align-items:center; gap:6px; }
.collab-header-identity { display:flex; align-items:center; gap:8px; min-width:0; max-width:calc(100% - 32px); margin-bottom:8px; }
.header-self { display:flex; align-items:center; gap:6px; min-width:0; }
.presence-name { max-width:200px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; font:600 12px/1.5 var(--font-ui); }
.header-presence-summary { font:400 12px/1.5 var(--font-ui); white-space:nowrap; }
.remote-cursor-layer,.annotation-layer { position:fixed; inset:0; pointer-events:none; z-index:65; }
.remote-cursor { position:absolute; inset:0 auto auto 0; display:flex; gap:4px; align-items:center; pointer-events:none; color:var(--color-accent); }
.cursor-arrow { width:25px; height:25px; flex:none; }
.cursor-tag { display:flex; align-items:center; gap:5px; max-width:220px; padding:4px 8px; border-radius:12px; background:var(--collab-surface); color:var(--collab-text); border:1px solid var(--collab-border); font:500 12px/1.4 var(--font-ui); }
.cursor-tag .presence-avatar { width:20px; height:20px; }
.cursor-tag > span { overflow-wrap:anywhere; }
body[data-collab-modal="true"] .remote-cursor-layer { visibility:hidden; }
.annotation-layer { z-index:64; }
.collab-note { position:absolute; left:0; top:0; width:30px; min-height:30px; display:grid; place-items:center; padding:4px; pointer-events:auto; border:1px solid var(--collab-border); border-radius:50%; background:var(--collab-surface); color:var(--collab-text); cursor:pointer; }
.collab-note[data-resolved="true"] { border-style:dashed; }
.collab-note.note-bubble { width:min(240px,calc(100vw - 32px)); min-height:56px; max-height:40dvh; height:auto; overflow-y:auto; display:flex; flex-direction:column; align-items:stretch; gap:6px; padding:12px; text-align:start; user-select:text; border-radius:16px; box-shadow:0 4px 16px rgba(0,0,0,.18); }
.note-bubble-author { font:700 12px/1.5 var(--font-ui); overflow-wrap:anywhere; }
.note-bubble-text,.note-text { font:400 14px/1.6 var(--font-ui); white-space:pre-wrap; overflow-wrap:anywhere; }
.note-list { display:grid; gap:16px; margin-top:24px; }
.note-list-card { padding:12px; border-radius:16px; border:1px solid var(--collab-border); background:var(--collab-surface); }
.note-list-heading { align-items:flex-start; flex-wrap:wrap; }
.note-author { font:600 13px/1.5 var(--font-ui); overflow-wrap:anywhere; }
.note-actions { margin-inline-start:auto; flex-wrap:wrap; }
.note-text { margin-block:10px; }
.note-list-footer { justify-content:space-between; }
.note-status { margin-top:0; }
.note-field-label { display:block; font:600 14px/1.5 var(--font-ui); margin-block:20px 8px; }
.note-editor textarea { width:100%; padding:12px; border:1px solid var(--collab-border); border-radius:12px; background:var(--collab-surface); color:var(--collab-text); font:400 14px/1.6 var(--font-ui); resize:vertical; }
#collab-note-save { display:flex; margin-top:12px; margin-inline-start:auto; }
#dock-annotations-button { flex:none; }
.annotation-pin-status { position:fixed; inset:auto 16px calc(var(--workspace-toolbar-height,60px) + 40px); z-index:90; width:fit-content; max-width:calc(100vw - 32px); margin-inline:auto; padding:10px 16px; border:1px solid var(--collab-border); border-radius:16px; background:var(--collab-surface); color:var(--collab-text); font:500 13px/1.6 var(--font-ui); pointer-events:none; }
.is-pinning-note #shotlist-tbody tr,.is-pinning-note #shotlist-tbody tr * { cursor:crosshair!important; }
body[data-share-loading="true"] #shotlist-workspace { visibility:hidden; }
body[data-shared-permission] .save-status-lamp,body[data-shared-permission] .dock-account-transfer { display:none!important; }
body[data-shared-permission] #shotlist-tbody .glass-checkbox { pointer-events:none!important; }
@media (max-width:420px) { .collab-dialog { padding:16px; } .share-heading { top:-16px; } .share-url,.note-editor textarea { font-size:16px; } .presence-name { max-width:96px; } .header-presence-summary { font-size:12px; } }
@media (max-width:420px) { body .collab-dialog.sbgp-modal > .surface-card { padding:16px; } }
@media (pointer:coarse) { .collab-dialog button,.share-url { min-height:44px; } .share-switch { height:44px; } .share-icon-action,.note-icon-action,.cloud-close-button { min-width:44px; } }
@media (prefers-reduced-motion:reduce) { .collab-dialog button,.share-switch-thumb,.collab-note,.presence-more { transition:none!important; } .collab-dialog button:active,.collab-note:active,.presence-more:active { scale:1!important; } body .collab-dialog.sbgp-modal > .surface-card { transition:none!important; transform:none!important; opacity:1; } }
@media (forced-colors:active) { .collab-dialog :focus-visible,.collab-note:focus-visible { outline-color:Highlight; } }
@media print { .collab-dialog,.annotation-layer,.remote-cursor-layer,.annotation-pin-status,.dock-presence,.collab-header-identity,.collab-service-status { display:none!important; } }