/* Collect's board layout and media detail surface.
   Reads the shared tool colour, spacing and motion tokens.
   Styles only Collect; selection, dialogs, settings and rails use shared components. */
.collect-side{width:var(--sk-panel-w,var(--panel-w));min-width:var(--sk-panel-w,var(--panel-w));padding:var(--sp-2);display:flex;flex-direction:column;overflow:hidden;}
.side-row{position:relative;display:flex;align-items:center;min-height:var(--ctl-h);gap:var(--sp-1);margin-inline:calc(var(--sp-1) * -1);padding-left:calc(var(--depth,0) * 16px);}   /* a list row runs 4–244 (the panel's grid, /system/guide/) */
.side-row .side-pick{flex:1;min-width:0;display:flex;align-items:center;gap:var(--sp-2);height:var(--ctl-h);border:0;outline:0;background:transparent;border-radius:var(--radius);color:var(--text);text-align:left;font:inherit;cursor:pointer;padding:0 var(--sp-2) 0 var(--sp-1);}   /* its icon in the icon column (8–24), its name from 32 */
.side-row .side-pick:hover{background:var(--bg-hover);}
.side-row.active .side-pick{background:var(--bg-selected);color:var(--accent);}
.side-row .side-pick:focus-visible{outline:2px solid var(--accent);outline-offset:-2px;}
.side-row.sk-g-over{outline:0;background:transparent;}
.side-row:is(.sk-g-over,.is-folder-dragging) .side-pick{background:var(--bg-selected);color:var(--accent);}
.side-name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.side-count,.count{color:var(--muted);font-size:var(--ctl-font-sm);font-variant-numeric:tabular-nums;}
.tree-symbol{display:inline-flex;width:16px;height:16px;flex:none;}
.side-row .tree-toggle{position:absolute;left:calc(var(--depth,0) * 16px);z-index:1;}
.side-row .icon-btn{width:24px;height:24px;}
@media (hover:hover){.side-row > [data-board-menu]{position:absolute;inset-inline-end:var(--sp-1);}.side-row:has(> [data-board-menu]):is(:hover,:focus-within) .side-count{visibility:hidden;}}   /* every count ends on one line (All, Inbox, boards); the board menu takes the count's place on hover */
:where(.side-row,.column-title,.lane-heading,.collect-card:not(.collect-row) .card-meta) > [data-board-menu],:where(.lane-heading,.collect-card:not(.collect-row) .card-meta) > [data-more]{opacity:0;}   /* low specificity, so hover below shows them */
:is(.side-row,.column-title,.lane-heading,.collect-card):is(:hover,:focus-within) :is([data-board-menu],[data-more]){opacity:1;}
@media (hover:none){:is(.side-row,.column-title,.lane-heading,.collect-card) :is([data-board-menu],[data-more]){opacity:1;}}
.side-row svg,.side-pick svg{width:16px;height:16px;flex:none;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;}
.side-heading{display:flex;align-items:center;justify-content:space-between;min-height:var(--ctl-h);margin-top:var(--sp-3);padding:0;color:var(--text-secondary);font-size:var(--ctl-font-sm);font-weight:var(--title-weight);letter-spacing:.2px;}   /* a section title like the other tools' panels: icon in the icon column (8–24), word on the names' line (32), + flush right */
.side-title{display:flex;align-items:center;gap:var(--sp-2);min-width:0;}
.side-title > [data-icon]{display:inline-flex;width:16px;height:16px;flex:none;color:var(--muted);}
.side-title svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;}
.side-title > .side-chev{width:10px;height:10px;margin-inline-start:calc(var(--sp-1) - var(--sp-2));opacity:.7;transition:transform var(--duration-press);}
.side-title > .side-chev svg{width:10px;height:10px;stroke-width:2.4;}
#tags-section:not([open]) .side-chev{transform:rotate(-90deg);}
#board-tree{flex:none;}
.side-search{display:flex;align-items:center;gap:var(--sp-2);height:28px;margin:var(--sp-1) 0 var(--sp-2);padding:0 var(--sp-2) 0 0;flex:none;}   /* the icon in the icon column, the field 32–232 */
.side-search > span{width:16px;height:16px;flex:none;color:var(--muted);}
.side-search svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;}
.side-search #search{height:28px;min-width:0;width:100%;padding:0 var(--sp-2);--control-line:var(--border-strong);}
.collect-main{flex:1;min-width:0;position:relative;display:flex;flex-direction:column;overflow:hidden;}
.collect-scroll{flex:1;min-height:0;overflow:auto;padding:20px 20px 90px;}
.collect-heading{display:flex;gap:var(--sp-2);align-items:center;min-height:40px;margin-bottom:20px;flex-wrap:wrap;}
.collect-heading h1{font-size:15px;font-weight:var(--title-weight);margin:0;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.crumbs{display:flex;align-items:center;gap:var(--sp-1);min-width:0;}
.collect-place{display:flex;align-items:center;gap:var(--sp-1);position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);max-width:min(40vw,520px);z-index:1;}
.collect-place h1{font-size:var(--ctl-font);margin:0;}
.collect-place .icon-btn{width:24px;height:24px;flex:none;}
@media (max-width:1180px){.page-header .sub{display:none;}}
.heading-path > .collect-place{position:static;transform:none;max-width:100%;}
.crumbs button{border:0;background:transparent;color:var(--muted);font:inherit;padding:0;cursor:pointer;max-width:180px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.crumbs button:last-child{color:var(--text);}
.heading-path{display:flex;gap:var(--sp-2);align-items:center;min-width:0;}
.head-acts{margin-left:auto;display:flex;align-items:center;gap:var(--sp-1);min-width:0;}
.head-acts .btn,.head-select{flex:none;width:auto;height:var(--ctl-h-sm);padding:0 var(--sp-3);font-size:var(--ctl-font-sm);gap:var(--sp-1);}
.collect-main .btn.quiet{background:transparent;border:0;color:var(--muted);}
.collect-main .btn.quiet:hover{background:var(--bg-hover);color:var(--text);}
.head-acts svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;}
.head-select{display:flex;align-items:center;position:relative;margin:0;color:var(--muted);padding:0;border-radius:var(--radius);}
.head-select select{appearance:none;height:100%;min-width:0;padding:0 calc(var(--sp-3) + 14px + var(--sp-1)) 0 var(--sp-3);background:transparent;border:0;color:inherit;font:inherit;cursor:pointer;}
.head-select option{background:var(--panel);color:var(--text);}
.head-select:hover{background:var(--bg-hover);color:var(--text);}
.head-select > span{position:absolute;right:var(--sp-3);width:14px;height:14px;pointer-events:none;}
.head-view{position:relative;}
.head-view.is-filtered::after{content:"";position:absolute;top:5px;inset-inline-end:5px;width:6px;height:6px;border-radius:50%;background:var(--accent);}
.head-add,.collect-main .head-view{width:var(--ctl-h-sm);height:var(--ctl-h-sm);color:var(--text);}
.head-view svg{width:16px;height:16px;}
.head-add svg{width:16px;height:16px;}
.collect-menu:focus{outline:0;}
.collect-menu.view-menu{width:auto;padding:var(--sp-2);display:grid;grid-template-columns:auto auto;gap:var(--sp-2) var(--sp-3);align-items:center;}
.view-option{display:contents;font-size:var(--ctl-font-sm);color:var(--muted);}
.view-option > span{white-space:nowrap;}
.view-seg{display:flex;gap:2px;padding:2px;border-radius:var(--radius);background:var(--bg-input);}
.collect-menu .view-seg button{flex:1;width:auto;min-width:32px;height:26px;justify-content:center;padding:0 var(--sp-2);border-radius:calc(var(--radius) - 2px);color:var(--muted);font-size:var(--ctl-font-sm);white-space:nowrap;}
.collect-menu .view-seg button[aria-checked="true"]{background:var(--bg-selected);color:var(--text);}
.collect-menu .view-seg button:disabled{opacity:.4;cursor:default;background:transparent;}
.collect-menu .view-seg button:focus-visible{outline:2px solid var(--accent);outline-offset:-2px;}
.view-option:has(select:disabled) > span{opacity:.5;}
.detail-info select{height:var(--ctl-h);border:1px solid var(--control-line);border-radius:var(--radius);background:var(--bg-input);color:var(--text);font:inherit;padding:0 var(--sp-2);min-width:0;}
.collect-cards{--card-w:208px;--card-gap:var(--sp-4);position:relative;min-height:1px;}
.collect-card{position:absolute;min-width:0;border-radius:var(--radius-lg);content-visibility:auto;}
.collect-card .card-open{display:block;width:100%;border:0;padding:0;background:var(--panel-2);border-radius:var(--radius-lg);overflow:hidden;cursor:pointer;}
.collect-card .card-open:focus-visible{outline:2px solid var(--accent);outline-offset:2px;}
/* A folder has one frame around its picture AND name, for focus, dragging and receiving media. */
.collect-card[data-board] .card-open:focus{outline:0;}
.collect-card[data-board]:is(:has(> .card-open:focus-visible),.is-selected,.sk-g-over,.is-folder-dragging,.drop-inside){outline:2px solid var(--accent);outline-offset:2px;border-radius:var(--radius-lg);background:transparent;}
.collect-row[data-board]:is(:has(> .card-open:focus-visible),.is-selected,.sk-g-over,.is-folder-dragging,.drop-inside){outline:0;background:var(--bg-selected);border-radius:0;}
.collect-card img{width:100%;height:100%;object-fit:cover;border-radius:inherit;display:block;opacity:0;transition:opacity var(--duration-fast) var(--ease-out-strong);}
.collect-card img.loaded{opacity:1;}
.card-meta{display:flex;gap:var(--sp-1);padding-top:var(--sp-2);min-width:0;}
.card-meta-text{flex:1;min-width:0;}
.card-name{display:block;color:var(--text);font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.card-description,.card-date{display:block;color:var(--muted);font-size:var(--ctl-font-sm);line-height:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.card-meta .icon-btn{opacity:0;}
.collect-card:hover .card-meta .icon-btn,.collect-card:focus-within .card-meta .icon-btn{opacity:1;}
@media (hover:none){.card-meta .icon-btn{opacity:1;}}
.collect-card .card-open.board-preview{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;background:var(--panel-2);gap:2px;}
.board-preview img{object-fit:cover;min-width:0;min-height:0;pointer-events:none;}
.board-preview svg{align-self:center;justify-self:center;width:28px;height:28px;color:var(--muted);fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;}
.video-badge{position:absolute;right:8px;top:8px;border-radius:var(--radius);padding:2px 6px;background:var(--panel);color:var(--text);font-size:var(--ctl-font-sm);pointer-events:none;}
.collect-empty{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:min(360px,calc(100% - 40px));text-align:center;}
.empty-mark{display:block;width:40px;height:40px;margin:0 auto var(--sp-4);color:var(--muted);}
.empty-mark svg{width:40px;height:40px;}
.collect-empty h2{font-size:14px;font-weight:var(--title-weight);}
.collect-empty p{font-size:var(--ctl-font);line-height:20px;color:var(--muted);}
.collect-empty .btn{width:auto;}
.detail-error{color:var(--danger-ink);}
#toast{max-width:calc(100vw - 32px);}
.collect-links.sk-dialog{width:min(560px,calc(100vw - 32px)) !important;}
.links-actions{display:flex;align-items:center;gap:var(--sp-3);margin:var(--sp-2) 0;}
.links-actions .btn{width:auto;}
#links-progress{color:var(--muted);}
.collect-links .fail-list{margin:var(--sp-2) 0 0;}
.collect-links .fail-links-how{color:var(--muted);}
.collect-links .fail-open-all{width:auto;}
.link-candidate-group{margin-top:var(--sp-4);}
.link-candidate-source{display:block;color:var(--muted);overflow-wrap:anywhere;margin-bottom:var(--sp-2);}
.link-candidate-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:var(--sp-2);}
.link-candidate{display:flex;flex-direction:column;gap:var(--sp-1);min-width:0;padding:var(--sp-2);border-radius:var(--radius);background:var(--panel-2);}
.link-candidate img{width:100%;height:80px;object-fit:contain;}
.link-candidate span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.collect-scroll.is-dropping{outline:2px solid var(--accent);outline-offset:-2px;background-color:var(--bg-selected);}
.collect-menu{position:fixed;width:180px;padding:var(--sp-1);z-index:80;}
.collect-menu button{width:100%;height:var(--ctl-h);display:flex;align-items:center;gap:var(--sp-2);border:0;border-radius:var(--radius);padding:0 var(--sp-2);background:transparent;color:var(--text);font:inherit;text-align:left;cursor:pointer;}
.collect-menu button:hover{background:var(--bg-hover);}
.collect-menu button.danger{color:var(--danger-ink);}
.collect-menu button.armed{background:var(--danger);color:var(--on-danger);}
.collect-menu button svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;}
/* "Open in" (right-click on a reference): one item with a chevron; its menu of tools opens beside it (main.js openSub) */
.collect-menu button.has-sub.open{background:var(--bg-hover);}
.collect-menu .sub-chevron{display:flex;margin-inline-start:auto;color:var(--muted);}
[dir="rtl"] .collect-menu .sub-chevron svg{transform:scaleX(-1);}
.collect-menu .collect-submenu{position:absolute;width:168px;padding:var(--sp-1);z-index:1;}
.collect-submenu .submenu-title{padding:var(--sp-1) var(--sp-2) 2px;color:var(--muted);font-size:var(--ctl-font-sm);}
.collect-submenu .logo{display:block;width:16px;height:16px;flex:none;color:var(--text);}
.action-title{margin:0 24px var(--sp-4) 0;font-size:14px;font-weight:var(--title-weight);}
.action-buttons{display:flex;justify-content:flex-end;gap:var(--sp-2);margin-top:var(--sp-4);}
.action-buttons .btn{width:auto;}
.action-select{width:100%;height:var(--ctl-h);color:var(--text);background:var(--bg-input);border:1px solid var(--control-line);border-radius:var(--radius);font:inherit;}
.action-error{color:var(--danger-ink);}
/* Detail: a full-window page (Swoopface's ad view): source on the left, the media in the middle, board/tags/actions on the right */
.collect-detail.sk-dialog{width:min(1000px,calc(100vw - 32px)) !important;overflow:hidden;}
.detail-top{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:var(--sp-3);margin:0 32px var(--sp-3) 0;min-height:var(--ctl-h);}
.detail-title{display:flex;align-items:center;gap:var(--sp-2);min-width:0;font-weight:var(--title-weight);}
.detail-avatar{flex:none;display:grid;place-items:center;width:28px;height:28px;border-radius:var(--radius);background:var(--panel-2);border:1px solid var(--border);color:var(--text);font-size:var(--ctl-font-sm);overflow:hidden;}
.detail-avatar img{width:100%;height:100%;object-fit:cover;border-radius:inherit;}
.detail-from-plain{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.detail-navigation{display:flex;align-items:center;gap:var(--sp-2);color:var(--muted);}
.detail-body{display:grid;grid-template-columns:minmax(0,1fr) 220px;gap:var(--sp-4);}
.detail-body:has(> .detail-from:not([hidden])){grid-template-columns:240px minmax(0,1fr) 220px;}
.detail-media{min-width:0;min-height:0;display:flex;flex-direction:column;align-items:center;justify-content:center;}
.detail-stage{width:100%;max-width:100%;flex:none;position:relative;overflow:hidden;border-radius:var(--radius);background:transparent;display:flex;align-items:center;justify-content:center;touch-action:none;cursor:zoom-in;}
.detail-stage img{position:absolute;max-width:none;object-fit:fill;pointer-events:none;user-select:none;}
.detail-stage img[hidden],.detail-stage video[hidden]{display:none;}
.detail-stage video{width:100%;height:100%;object-fit:contain;}
.detail-stage:has(video:not([hidden])){touch-action:auto;}
.detail-stage #detail-wait{color:var(--muted);}
.detail-info{display:flex;flex-direction:column;gap:var(--sp-2);min-width:0;min-height:0;overflow:auto;}
.detail-info label{margin:0;}
.detail-label{margin:var(--sp-2) 0 0;color:var(--muted);font-size:var(--ctl-font-sm);font-weight:var(--title-weight);text-transform:uppercase;letter-spacing:.04em;}
.detail-actions{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-2);}
.detail-action{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--sp-1);min-height:64px;padding:var(--sp-2);border:1px solid var(--border);border-radius:var(--radius);background:var(--panel-2);color:var(--text);font:inherit;font-size:var(--ctl-font-sm);text-align:center;text-decoration:none;cursor:pointer;}
.detail-action[hidden]{display:none;}
.detail-action:hover{background:var(--bg-hover);}
.detail-action svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;}
#detail-metadata{line-height:20px;color:var(--muted);overflow-wrap:anywhere;margin:var(--sp-2) 0;}
.detail-zoom.sk-zoom{position:relative;right:auto;bottom:auto;justify-content:center;width:max-content;margin:var(--sp-3) auto 0;flex:none;}
@media (min-width:851px){
  .collect-detail.sk-dialog{width:100vw !important;height:100dvh;max-height:100dvh !important;border:0;border-radius:0;display:flex;flex-direction:column;}
  .collect-detail .detail-body{flex:1;min-height:0;}
  .collect-detail .detail-from,.collect-detail .detail-info{border-inline-end:1px solid var(--border);padding-inline-end:var(--sp-4);overflow:auto;}
  .collect-detail .detail-info{border-inline-end:0;padding-inline-end:0;border-inline-start:1px solid var(--border);padding-inline-start:var(--sp-4);}
}
.detail-top .detail-title{grid-column:1;}
@media (max-width:850px){
  .collect-detail.sk-dialog{overflow:auto;}
  .detail-body,.detail-body:has(> .detail-from:not([hidden])){grid-template-columns:minmax(0,1fr);}
  .detail-body .detail-media{order:-1;}
  .detail-info :is(.detail-label,.detail-actions,#detail-metadata){grid-column:1/-1;}
}
.collect-detail.is-fullscreen.sk-dialog{width:100vw !important;height:100dvh;max-height:100dvh !important;border:0;border-radius:0;display:flex;flex-direction:column;}
.collect-detail.is-fullscreen .detail-top{display:none;}
.collect-detail.is-fullscreen .detail-body{display:flex;flex:1;min-height:0;}
.collect-detail.is-fullscreen .detail-media{width:100%;height:100%;}
.collect-detail.is-fullscreen .detail-stage{cursor:grab;}
.collect-detail.is-fullscreen .detail-media{position:relative;}
/* full screen: the zoom floats in the bottom right corner over the picture, shown while the pointer moves */
.collect-detail.is-fullscreen .detail-zoom.sk-zoom{position:absolute;right:var(--sp-4);bottom:var(--sp-4);margin:0;z-index:2;opacity:0;transition:opacity var(--duration-ui) var(--ease-out-strong);}
.collect-detail.is-fullscreen:is(.is-awake) .detail-zoom.sk-zoom,.collect-detail.is-fullscreen .detail-zoom.sk-zoom:is(:hover,:focus-within){opacity:1;}
@media (hover:none){.collect-detail.is-fullscreen .detail-zoom.sk-zoom{opacity:1;}}
.collect-detail.is-fullscreen :is(.detail-info,.detail-from){display:none;}
.detail-error{margin:var(--sp-2) 0 0;}
[hidden]{display:none !important;}
@media (max-width:850px){.heading-path{flex-basis:100%;}.head-acts{margin-left:0;width:100%;justify-content:flex-end;}.collect-heading{gap:var(--sp-2);}.head-acts .btn,.head-select select{padding-left:var(--sp-2);padding-right:var(--sp-2);}.head-select select{padding-right:calc(var(--sp-2) + 18px);}.head-select > span{right:var(--sp-2);}}
@media (max-width:620px){.collect-scroll{padding:12px 12px 90px;}.head-acts{gap:0;}.head-acts .btn,.head-select{font-size:var(--ctl-font-sm);}.head-acts .btn{padding:0 var(--sp-1);}.head-select select{padding-left:var(--sp-1);padding-right:20px;}.head-select > span{right:var(--sp-1);}.detail-body{grid-template-columns:1fr;gap:var(--sp-2);}.detail-info{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-1) var(--sp-2);}.detail-info label{display:none;}.detail-info #detail-metadata{grid-column:1/-1;margin:0;}.collect-detail.sk-dialog{overflow:auto;}.collect-heading h1{font-size:14px;}.collect-cards{--card-mobile:.75;--card-gap:var(--sp-3);}.sk-g-bar{max-width:calc(100vw - 16px);}.crumbs button{max-width:105px;}}
@media (prefers-reduced-motion:reduce){.collect-card img{transition:none;}}

.side-sections{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;padding-inline:var(--sp-1);margin-inline:calc(var(--sp-1) * -1);}
/* Tags sit right under the boards, with a heading like theirs (open unless closed once) */
#tags-section summary{cursor:pointer;list-style:none;}
#tags-section summary::-webkit-details-marker{display:none;}
/* the side panel's tags are the same small pills as on the cards; the count sits inside, a picked tag is filled with the accent */
#tag-filters{display:flex;flex-wrap:wrap;gap:var(--sp-1);padding:0;}   /* pills from the icon column (8) */
#tag-filters .sk-tag .side-count{font-size:inherit;}
#tag-filters .sk-tag[aria-pressed="true"]{background:var(--accent);color:var(--on-accent);}
#tag-filters .sk-tag[aria-pressed="true"] .side-count{color:inherit;opacity:.75;}
#tag-filters .sk-tag:focus-visible{outline:2px solid var(--accent);outline-offset:2px;}
#tag-filters:empty::before{content:attr(data-empty);display:block;color:var(--muted);font-size:var(--ctl-font-sm);}
.card-tags{display:flex;gap:var(--sp-1);height:20px;overflow:hidden;margin-top:var(--sp-1);}
.board-section{position:absolute;left:0;width:100%;}
.board-section-heading{height:32px;display:flex;align-items:center;gap:var(--sp-2);}
.board-section-heading h2{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--ctl-font);font-weight:var(--title-weight);margin:0;}
.board-section-heading .btn{margin-left:auto;width:auto;height:var(--ctl-h-sm);padding:0 var(--sp-2);font-size:var(--ctl-font-sm);}
.board-section-empty{font-size:var(--ctl-font-sm);color:var(--muted);margin:0;}
.tag-editor{min-width:0;position:relative;}
.tag-values{display:flex;flex-wrap:wrap;gap:var(--sp-1);margin-bottom:var(--sp-1);}
.tag-values svg{width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:1.5;flex:none;}
.tag-editor input{width:100%;}
/* a tag in the detail: its name and its × are separate buttons, so a click on the name never removes it */
.tag-pill{padding:0;gap:0;}
.tag-pill > span,.tag-pill > .tag-name{padding-inline-start:var(--sp-2);}
.tag-pill > .tag-name{display:inline-flex;align-items:center;min-width:0;height:100%;padding-inline-end:2px;border:0;background:transparent;color:inherit;font:inherit;cursor:pointer;border-radius:999px 0 0 999px;}
.tag-pill > .tag-name:hover span{text-decoration:underline;text-underline-offset:2px;}
.tag-pill > .tag-x{display:grid;place-items:center;flex:none;width:20px;height:20px;margin-inline-start:2px;padding:0;border:0;border-radius:999px;background:transparent;color:inherit;opacity:.6;cursor:pointer;}
.tag-pill > .tag-x:hover{opacity:1;background:var(--bg-hover);}
.tag-pill > :is(.tag-name,.tag-x):focus-visible{outline:2px solid var(--accent);outline-offset:-2px;}
.tag-suggestions{position:absolute;top:100%;left:0;right:0;z-index:3;list-style:none;margin:var(--sp-1) 0 0;padding:var(--sp-1);background:var(--panel);border:1px solid var(--border-strong);border-radius:var(--radius);box-shadow:0 4px 12px rgb(var(--shadow-rgb) / .15);max-height:200px;overflow:auto;}
.tag-suggestions li{padding:var(--sp-1);border-radius:var(--radius);cursor:pointer;}
.tag-suggestions li:hover,.tag-suggestions li[aria-selected="true"]{background:var(--bg-hover);}
#bulk-tags .tag-suggestions{position:static;}
#tag-dialog .sk-dialog-x{z-index:4;}
@media(max-width:620px){#detail-tags{grid-column:1/-1;}.sk-board-zoom{max-width:calc(100% - 12px);}.sk-view-select{max-width:85px;}}

/* Board tree: every board shows its folder; one with boards inside shows its arrow there on hover (as TRT's folders) */
.side-row.has-sub .tree-toggle{opacity:0;}
.side-row.has-sub:is(:hover,:focus-within) .tree-toggle{opacity:1;}
.side-row.has-sub:is(:hover,:focus-within) .tree-symbol{visibility:hidden;}
@media (hover:none){.side-row.has-sub .tree-toggle{opacity:1;}.side-row.has-sub .tree-symbol{visibility:hidden;}}
.side-row[draggable="true"]{cursor:default;}
.side-row:is(.drop-before,.drop-after)::after{content:"";position:absolute;inset-inline:calc(var(--depth,0) * 16px + var(--sp-1)) var(--sp-1);height:2px;border-radius:1px;background:var(--accent);z-index:2;pointer-events:none;}   /* the place line draws over the rows, not under them */
.side-row.drop-before::after{top:-1px;}
.side-row.drop-after::after{bottom:-1px;}
.side-row.drop-inside .side-pick,.side-heading.drop-inside,.column-title.drop-inside{background:var(--bg-selected);border-radius:var(--radius);}
.side-row.is-shown .side-pick{background:var(--bg-hover);}
.active-tags{display:flex;gap:var(--sp-1);flex-wrap:wrap;}
.active-tags .sk-tag button{display:inline-flex;border:0;padding:0;margin-left:2px;background:transparent;color:inherit;cursor:pointer;}
.active-tags svg{width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:1.5;}
/* Boards layout: a section's heading opens it (the board on screen has none); the arrow folds it */
.board-section-heading{gap:var(--sp-1);}
.board-section-heading .section-fold{width:24px;height:24px;flex:none;}
.section-name{display:inline-flex;align-items:center;gap:var(--sp-2);min-width:0;height:var(--ctl-h-sm);padding:0 var(--sp-2) 0 0;border:0;border-radius:var(--radius);background:transparent;color:var(--text);font:inherit;}
button.section-name{cursor:pointer;}
button.section-name:hover h2{text-decoration:underline;text-underline-offset:3px;}
.section-name svg,.board-section-heading svg{width:16px;height:16px;flex:none;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;color:var(--muted);}
.board-section-heading .board-section-empty{margin-left:var(--sp-1);}
.board-section.is-folded .collect-card{display:none;}
.board-section.is-target .board-section-heading h2{color:var(--accent);}
.board-section.is-target .section-name svg{color:var(--accent);}
.card-source{display:block;color:var(--text-secondary,var(--muted));font-size:var(--ctl-font-sm);line-height:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
/* Detail: where the reference came from (left column) */
.detail-from{display:flex;flex-direction:column;gap:0;min-width:0;}
.detail-section{display:flex;flex-direction:column;gap:var(--sp-1);padding:var(--sp-3) 0;border-bottom:1px solid var(--border);}
.detail-section:first-child{padding-top:0;}
.detail-section:last-child{border-bottom:0;}
.detail-section .detail-label{margin:0;}
.detail-from-name{max-width:100%;border:0;padding:0;background:transparent;color:var(--text);font:inherit;font-weight:var(--title-weight);text-align:left;cursor:pointer;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.detail-from-name:hover{color:var(--accent);}
.detail-from-line{margin:0;color:var(--muted);font-size:var(--ctl-font-sm);line-height:18px;overflow-wrap:anywhere;}
.detail-from a{color:var(--accent);overflow-wrap:anywhere;font-size:var(--ctl-font-sm);line-height:18px;}
.detail-copy{margin:0;line-height:20px;white-space:pre-wrap;overflow-wrap:anywhere;}
.detail-domain{margin:0;color:var(--muted);font-size:var(--ctl-font-sm);font-weight:var(--title-weight);text-transform:uppercase;letter-spacing:.04em;overflow-wrap:anywhere;}
.detail-headline{margin:0;font-weight:var(--title-weight);line-height:20px;overflow-wrap:anywhere;}
.detail-cta{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:var(--sp-2) var(--sp-3);}
.detail-cta-pill{justify-self:start;padding:var(--sp-1) var(--sp-3);border:1px solid var(--border-strong);border-radius:999px;font-size:var(--ctl-font-sm);}
/* The canvas credit would sit on top of scrolled cards here */
.collect-main .sk-board-credit{display:none;}

/* View bar: the four views as pressed buttons (the one in use in the accent, as an on icon elsewhere) */
.sk-view-modes{display:flex;align-items:center;gap:1px;padding-left:var(--sp-1);margin-left:var(--sp-1);border-left:1px solid var(--border-strong);}
.sk-view-modes button[aria-pressed="true"]{color:var(--accent);background:transparent;}
.sk-view-modes button[aria-pressed="true"]:hover{background:var(--bg-hover);}
/* Icons, aligned: every picture in the same square cell, whole */
.collect-card.is-aligned .card-open{background:var(--panel-2);}
.collect-card.is-aligned .card-open:not(.board-preview) img{object-fit:contain;}
/* List */
.collect-cards[data-layout="list"]{display:flex;flex-direction:column;}
.collect-row{position:relative;display:grid;grid-template-columns:minmax(180px,2fr) minmax(90px,1fr) minmax(110px,1fr) minmax(90px,1fr) 104px minmax(80px,1fr) 28px;align-items:center;gap:var(--sp-3);min-height:44px;border-bottom:1px solid var(--border);border-radius:0;content-visibility:visible;}
.collect-cards[data-layout="list"] .collect-card{position:relative;}
.collect-row:hover{background:var(--bg-hover);}
.collect-row .row-open{display:flex;align-items:center;gap:var(--sp-3);min-width:0;height:44px;border:0;padding:0;background:transparent;color:var(--text);font:inherit;text-align:left;cursor:pointer;border-radius:var(--radius);}
.row-thumb{width:32px;height:32px;flex:none;border-radius:var(--radius);overflow:hidden;background:var(--panel-2);display:inline-flex;align-items:center;justify-content:center;color:var(--muted);}
.row-thumb img{width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity var(--duration-fast) var(--ease-out-strong);}
.row-thumb img.loaded{opacity:1;}
.row-thumb svg,.column-pick svg{width:16px;height:16px;flex:none;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;}
.row-name,.column-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:500;}
.row-cell{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--muted);font-size:var(--ctl-font-sm);}
.row-tags{display:flex;gap:var(--sp-1);}
.list-head{min-height:28px;border-bottom:1px solid var(--border-strong);}
.list-head:hover{background:transparent;}
.list-head .row-name-head{padding-left:44px;color:var(--muted);font-size:var(--ctl-font-sm);}
.collect-row .icon-btn{width:28px;height:28px;opacity:0;}
.collect-row:is(:hover,:focus-within) .icon-btn{opacity:1;}
@media (hover:none){.collect-row .icon-btn{opacity:1;}}
@media (max-width:850px){.collect-row{grid-template-columns:minmax(0,1fr) minmax(70px,auto) 28px;}.collect-row > .row-cell:not(:nth-of-type(2)){display:none;}.list-head{display:none;}}
/* Columns (Finder): the panel lists the top boards; each board picked opens a panel of its own beside it */
.column-panels{display:flex;flex:none;min-width:0;max-width:55vw;overflow-x:auto;overscroll-behavior-x:contain;}
.column-panels[hidden]{display:none;}
.column-panel{flex:none;width:208px;min-width:208px;max-width:208px;display:flex;flex-direction:column;padding:var(--sp-2);overflow-y:auto;border-inline-start:0;}
.column-title{display:flex;align-items:center;gap:var(--sp-2);height:28px;margin:var(--sp-1) 0 var(--sp-2);padding:0 var(--sp-2);color:var(--muted);font-size:var(--ctl-font-sm);font-weight:var(--title-weight);}
.column-title span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.column-title svg{width:16px;height:16px;flex:none;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;}
.column-row .side-pick{padding-inline-start:var(--sp-2);}
.column-more{display:inline-flex;color:var(--muted);margin-inline-start:2px;}
.column-more svg{width:14px;height:14px;}
.column-row .side-pick{position:relative;}
.column-title .icon-btn{width:24px;height:24px;margin-inline-start:auto;}
.column-thumb{position:relative;display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;flex:none;border-radius:3px;overflow:hidden;background:var(--panel-2);color:var(--muted);}
.column-thumb svg{width:12px !important;height:12px !important;}
.column-thumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;}
.column-thumb img.loaded{opacity:1;}
.column-ref .side-name{font-weight:400;}
.column-empty{margin:0;padding:0 var(--sp-2);color:var(--muted);font-size:var(--ctl-font-sm);}
/* Move to: the board menu (ui.js pickBoard) */
.collect-menu.board-picker{width:260px;max-height:min(380px,calc(100vh - 16px));display:flex;flex-direction:column;gap:2px;}
.board-picker .picker-list{overflow:auto;min-height:0;}
.board-picker .picker-list button{padding-inline-start:calc(var(--sp-2) + var(--depth,0) * 16px);}
.board-picker .picker-list button span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.board-picker .picker-list button[aria-checked="true"]{color:var(--accent);}
.board-picker .picker-list button[aria-checked="true"]::after{content:"✓";margin-inline-start:auto;}
.board-picker .picker-list button[style*="--folder"] svg{color:var(--folder);fill:color-mix(in srgb,var(--folder) 30%,transparent);}
.board-picker input{width:100%;height:var(--ctl-h);}
.board-picker .picker-new{border-top:1px solid var(--border);padding-top:var(--sp-1);}
.board-picker .picker-new input{border:0;background:transparent;box-shadow:none;}
@media (max-width:850px){.column-panels{display:none;}}
.side-top{display:flex;align-items:center;gap:var(--sp-1);}
.side-top .side-search{flex:1;min-width:0;}
/* the panel hidden takes its folder columns with it, and is a strip as wide as the app rail (data-sk-collapsible="mini"): the arrow,
   All and Inbox as icons, each top board as its first letter on its colour (the panel's grey for none) */
.tree-initial{display:none;}
@media (min-width:851px){
  body.sk-closed-left .column-panels{display:none;}
  body.sk-closed-left .collect-side{padding:var(--sp-2) 4px;}
  body.sk-closed-left .collect-side :is(.side-search,.side-heading,#tags-section,.tree-toggle,[data-board-menu],.side-row.is-nested,.tree-symbol){display:none;}
  body.sk-closed-left .collect-side .side-top{justify-content:center;margin-bottom:var(--sp-1);}
  body.sk-closed-left .collect-side .side-row{padding-left:0;}
  body.sk-closed-left .collect-side .side-pick{justify-content:center;padding:0;}
  body.sk-closed-left .collect-side :is(.side-name,.side-count){position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;}
  body.sk-closed-left .collect-side #side-lists{border-bottom:1px solid var(--border);padding-bottom:var(--sp-1);margin-bottom:var(--sp-1);}
  /* the letter sits on a small folder: the folder icon's own shape, filled (soft corners, the tab's slope rounded) */
  body.sk-closed-left .collect-side .tree-initial{display:inline-flex;align-items:center;justify-content:center;width:24px;height:22px;padding-top:3px;box-sizing:border-box;
    background:var(--folder,var(--panel-2));color:var(--text);font-size:var(--ctl-font-sm);font-weight:var(--title-weight);text-transform:uppercase;line-height:1;
    --folder-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 22'%3E%3Cpath d='M0 3a3 3 0 0 1 3-3h5.3a2 2 0 0 1 1.6.8l1.2 1.4a2 2 0 0 0 1.6.8H21a3 3 0 0 1 3 3V19a3 3 0 0 1-3 3H3a3 3 0 0 1-3-3z'/%3E%3C/svg%3E");
    -webkit-mask:var(--folder-mask) center/100% 100% no-repeat;mask:var(--folder-mask) center/100% 100% no-repeat;}
  [dir="rtl"] body.sk-closed-left .collect-side .tree-initial{--folder-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 22'%3E%3Cpath transform='matrix(-1 0 0 1 24 0)' d='M0 3a3 3 0 0 1 3-3h5.3a2 2 0 0 1 1.6.8l1.2 1.4a2 2 0 0 0 1.6.8H21a3 3 0 0 1 3 3V19a3 3 0 0 1-3 3H3a3 3 0 0 1-3-3z'/%3E%3C/svg%3E");}
  body.sk-closed-left .collect-side .side-row[style*="--folder"] .tree-initial{color:var(--on-accent);}
}
/* Boards (Trello): lanes side by side, shaped as folders (a tab on the top-left corner); the page moves sideways
   only and each lane scrolls down inside itself. A board inside a board is a folder inside the lane, beside its pictures. */
.collect-scroll.is-lanes{overflow-y:hidden;}
.collect-cards[data-layout="lanes"]{display:flex;align-items:flex-start;gap:var(--card-gap);overflow-x:auto;overflow-y:hidden;padding-top:14px;scrollbar-width:none;}
.collect-cards[data-layout="lanes"]::-webkit-scrollbar{display:none;}
/* folder tab: a straight part plus the slope piece, the slope rounded at both ends like the folder icon (no sharp clip-path corner) */
:root{--tab-slope:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' preserveAspectRatio='none'%3E%3Cpath d='M0 0h1.5c2 0 3 .8 3.9 2.6l3.2 6.8c.8 1.7 1.8 2.6 3.4 2.6H0z'/%3E%3C/svg%3E");--tab-slope-rtl:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' preserveAspectRatio='none'%3E%3Cpath transform='matrix(-1 0 0 1 12 0)' d='M0 0h1.5c2 0 3 .8 3.9 2.6l3.2 6.8c.8 1.7 1.8 2.6 3.4 2.6H0z'/%3E%3C/svg%3E");}
:is(.lane,.lane-folder)::before,:is(.lane,.lane-folder)::after,.board-preview::after{-webkit-mask:var(--tab-slope) right top/var(--slope-w) 100% no-repeat,linear-gradient(#000 0 0) left top/calc(100% - var(--slope-w) + .5px) 100% no-repeat;mask:var(--tab-slope) right top/var(--slope-w) 100% no-repeat,linear-gradient(#000 0 0) left top/calc(100% - var(--slope-w) + .5px) 100% no-repeat;}
[dir="rtl"] :is(.lane,.lane-folder)::before,[dir="rtl"] :is(.lane,.lane-folder)::after,[dir="rtl"] .board-preview::after{-webkit-mask:var(--tab-slope-rtl) left top/var(--slope-w) 100% no-repeat,linear-gradient(#000 0 0) right top/calc(100% - var(--slope-w) + .5px) 100% no-repeat;mask:var(--tab-slope-rtl) left top/var(--slope-w) 100% no-repeat,linear-gradient(#000 0 0) right top/calc(100% - var(--slope-w) + .5px) 100% no-repeat;}
.lane,.lane-folder{--tab-w:min(55%,132px);--slope-w:12px;--fill:var(--panel);--line:var(--border);position:relative;display:flex;flex-direction:column;background:var(--fill);border:1px solid var(--line);border-radius:0 var(--radius-lg) var(--radius-lg) var(--radius-lg);}
:is(.lane,.lane-folder)::before,:is(.lane,.lane-folder)::after{content:"";position:absolute;inset-inline-start:-1px;top:-13px;width:var(--tab-w);height:13px;background:var(--line);border-radius:var(--radius-lg) 0 0 0;pointer-events:none;}
:is(.lane,.lane-folder)::after{inset-inline-start:0;top:-12px;height:14px;width:calc(var(--tab-w) - 1.5px);background:var(--fill);border-radius:calc(var(--radius-lg) - 1px) 0 0 0;}
[dir="rtl"] :is(.lane,.lane-folder){border-radius:var(--radius-lg) 0 var(--radius-lg) var(--radius-lg);}
[dir="rtl"] :is(.lane,.lane-folder)::before,[dir="rtl"] :is(.lane,.lane-folder)::after{border-radius:0 var(--radius-lg) 0 0;}
.lane{flex:none;max-height:100%;}
.lane-heading{display:flex;align-items:center;gap:var(--sp-1);height:36px;padding:0 var(--sp-2);flex:none;}
.lane-heading .count{margin-inline-start:auto;}
.lane-heading .icon-btn{width:24px;height:24px;margin-inline-end:-4px;}
.lane-nav{display:flex;gap:2px;}
.lane-nav[hidden]{display:none;}
.lane-cards,.lane-folder-cards{display:flex;align-items:flex-start;gap:var(--sp-3);padding:0 var(--sp-2) var(--sp-2);}
.lane-folder-cards{padding:0 var(--sp-1) var(--sp-1);gap:var(--sp-2);min-width:160px;}
.lane-cards{flex:1;min-height:0;overflow-y:auto;padding-top:var(--sp-1);}
.lane-folder-cards{padding-top:var(--sp-1);padding-inline:6px;}
.lane-grid{position:relative;flex:none;width:296px;}
.lane-folder{flex:none;margin-top:14px;}
.lane-grid > .collect-card{position:absolute;}
:is(.lane,.lane-folder).is-target{--line:var(--accent);}
:is(.lane,.lane-folder).sk-g-over{--fill:var(--bg-selected);}
.lane .collect-card,.collect-row,.column-row{content-visibility:visible;}
.lane-heading h2,.board-section-heading h2{font-size:var(--ctl-font);font-weight:var(--title-weight);margin:0;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.lane-heading .section-name{min-width:0;}
/* At the smallest zoom a lane's references are a list: a small square picture and the name */
.lane-grid.is-list{display:flex;flex-direction:column;gap:2px;}
.lane-grid.is-list > .collect-card{position:relative;display:grid;grid-template-columns:36px minmax(0,1fr);align-items:center;gap:var(--sp-2);}
.lane-grid.is-list .card-open{width:36px;height:36px;aspect-ratio:1;border-radius:var(--radius);}
.lane-grid.is-list .card-open img{object-fit:cover;}
.lane-grid.is-list .card-meta{min-height:0;padding:0;}
.lane-grid.is-list :is(.card-source,.card-description,.card-date,.card-tags,.video-badge){display:none;}
.lane-grid.is-list .sk-g-check{top:50%;left:8px;transform:translateY(-50%) scale(.8);}
}
.action-select[size]{height:auto;padding:var(--sp-1);}
.action-filter{width:100%;margin-bottom:var(--sp-2);}
/* List: the check has its own gutter left of the picture; a selected row is a band, not an outline */
.collect-row{padding-inline-start:32px;}
.collect-row > .sk-g-check{top:50%;left:6px;transform:translateY(-50%);}
.collect-row.sk-g-item.is-selected{outline:0;background:var(--bg-selected);border-radius:0;}
.list-head{padding-inline-start:32px;}
/* Board colours (a board's Color… choice): the palette's tokens, and where a colour shows. A coloured board's
   folder icon is drawn and lightly filled in it; its lane or folder tab is filled in it. */

.side-row[style*="--folder"] .tree-symbol svg,.column-title[style*="--folder"] > svg,.collect-row[style*="--folder"] .row-thumb svg,
:is(.lane,.lane-folder,.board-section)[style*="--folder"] > :is(.lane-heading,.board-section-heading) .section-name svg,
.collect-card[style*="--folder"] .board-preview > svg{color:var(--folder);fill:color-mix(in srgb,var(--folder) 30%,transparent);}
:is(.lane,.lane-folder)[style*="--folder"]{--line:var(--folder);}
:is(.lane,.lane-folder)[style*="--folder"]::after{display:none;}
/* a coloured folder's outline takes the tab's colour, so the tab and the box read as one shape */
.collect-card[style*="--folder"] .board-preview::before{border-color:var(--folder);}
.collect-card .card-open.board-preview{position:relative;isolation:isolate;overflow:visible;background:transparent;border-radius:0;padding:14px 5px 5px;}
.board-preview::before{content:"";position:absolute;inset:10px 0 0;z-index:-1;background:var(--panel-2);border:1px solid var(--border);border-radius:0 var(--radius-lg) var(--radius-lg) var(--radius-lg);}
.board-preview::after{content:"";position:absolute;inset-inline-start:0;top:0;width:min(45%,96px);height:11px;background:var(--folder,var(--border-strong));border-radius:var(--radius) 0 0 0;--slope-w:9px;}
[dir="rtl"] .board-preview::before{border-radius:var(--radius-lg) 0 var(--radius-lg) var(--radius-lg);}
[dir="rtl"] .board-preview::after{border-radius:0 var(--radius) 0 0;}
.board-preview img{border-radius:calc(var(--radius) - 2px);}
.swatches{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sp-1);padding:var(--sp-1);}
.collect-menu .swatch{width:auto;height:28px;padding:0;border-radius:var(--radius);background:var(--folder);border:1px solid var(--border);}
.collect-menu .swatch:hover{background:var(--folder);box-shadow:0 0 0 2px var(--bg-hover);}
.collect-menu .swatch[aria-checked="true"]{box-shadow:0 0 0 2px var(--panel),0 0 0 4px var(--accent);}
.collect-menu .swatch:focus-visible{outline:2px solid var(--accent);outline-offset:2px;}
/* Finder panels and the panel's first column select as the page does (a box, ⌘/Shift clicks): a picked row is tinted, no check */
:is(#column-panels,#board-tree) .sk-g-check{display:none;}
:is(#column-panels,#board-tree) .sk-g-item.is-selected{outline:0;border-radius:var(--radius);}
:is(#column-panels,#board-tree) .sk-g-item.is-selected .side-pick{background:var(--bg-selected);color:var(--accent);}
/* Tag colours (right-click a tag in the panel): the board palette, a dot and a light wash on the pill */
.sk-tag[style*="--folder"]{background:color-mix(in srgb,var(--folder) 22%,var(--bg-selected));}
/* light theme: one step lighter, the wash sits on the panel white */
:root:not([data-appearance="dark"],[data-appearance="green"],[data-appearance="blue"]) .sk-tag[style*="--folder"]{background:color-mix(in srgb,var(--folder) 18%,var(--panel));}
.sk-tag[style*="--folder"]::before{content:"";flex:none;width:8px;height:8px;border-radius:50%;background:var(--folder);}
#tag-filters .sk-tag[style*="--folder"][aria-pressed="true"]{background:var(--accent);}
.samples-remove{margin-inline-start:var(--sp-1);color:var(--muted);}
.collect-empty #empty-samples{display:block;margin:var(--sp-2) auto 0;}
.collect-empty #empty-samples[hidden]{display:none;}
.heading-path .count{white-space:nowrap;}