/* StudioHub operational UX — improve daily decisions without changing brand identity. */
.review-focus-bar,.task-view-toggle{display:flex;align-items:center;gap:5px;border:1px solid var(--ds-line);border-radius:var(--ds-radius-sm);background:var(--ds-raised);padding:4px;width:max-content;max-width:100%}
.review-focus-bar{margin:1px 0 13px}
.review-focus-bar button,.task-view-toggle button{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:37px;padding:7px 12px;border:0;border-radius:var(--ds-radius-sm);background:transparent;color:var(--ds-secondary);font-size:12px;font-weight:700;cursor:pointer}
.review-focus-bar button.active,.task-view-toggle button.active{background:var(--ds-surface);color:var(--ds-ink);box-shadow:0 1px 4px rgba(0,0,0,.08)}
.review-focus-bar button svg{width:15px;height:15px;flex:none;stroke-width:2}
.review-focus-bar button strong{font-variant-numeric:tabular-nums;color:var(--ds-accent)}
.review-focus-bar button:focus-visible,.task-view-toggle button:focus-visible,.review-queue-nav button:focus-visible{outline:2px solid var(--ds-accent);outline-offset:2px}
.review-shade .review-sheet{width:min(1050px,calc(100vw - 42px))}
.review-queue-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 0 12px;font-size:12px;font-weight:750;color:var(--ds-secondary)}
.review-queue-nav{display:flex;gap:6px}
.review-queue-nav button{min-width:42px;min-height:42px;font-size:24px}
.review-workspace{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(310px,.85fr);gap:26px;align-items:start}
.review-stage{position:sticky;top:78px;min-width:0;align-self:start}
.review-inline-media{position:relative;display:grid;place-items:center;min-height:245px;max-height:min(64dvh,680px);overflow:hidden;background:var(--ds-soft);border:1px solid var(--ds-line);border-radius:var(--ds-radius-lg)}
.review-inline-media .media-review-preview{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:18px}
.review-inline-media .media-review-preview .media-thumb{width:200px;height:150px;flex-basis:auto;border-radius:12px;max-width:100%}
.review-inline-media .media-review-preview .btn{font-size:12px}
.review-inline-image,.review-inline-video{width:100%;height:auto;max-height:min(64dvh,680px);min-height:240px;object-fit:contain;background:rgba(0,0,0,.06);display:block}
.review-inline-video{max-width:100%;min-height:0;aspect-ratio:16 / 9}
.review-inline-media:not(.is-loaded) .review-inline-image,.review-inline-media:not(.is-loaded) .review-inline-video{display:none}
.review-inline-media.is-loaded .media-review-preview .media-thumb{display:none}
.review-inline-media.is-loaded{display:flex;flex-direction:column}
.review-inline-media.is-loaded .media-review-preview{padding:10px 16px}
.review-inline-media.is-loaded .media-review-preview .btn{min-height:40px}
.review-controls{min-width:0}
.review-controls .review-verdicts{margin-top:0}
/* Radio is a real full-sized hit target; do not allow its visual span to intercept clicks in Firefox. */
.review-verdict-option input[type="radio"]{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;z-index:2;cursor:pointer}
.review-verdict-option input[type="radio"]:disabled{cursor:not-allowed}
.review-controls .modalactions{display:flex;flex-wrap:wrap;gap:8px}
.review-controls .modalactions button{min-height:44px}
.task-priority-header{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:8px 0 16px}
.task-priority-header>div:first-child{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--ds-ink)}
.task-urgent-count{font-size:11px;color:var(--ds-ink);border-radius:8px;background:var(--ds-warning-bg);padding:5px 8px}
.task-focus-list{display:grid;gap:9px}
.task-focus-item{display:flex;justify-content:space-between;align-items:center;gap:16px;min-width:0;padding:13px 16px}
.task-focus-info{display:flex;flex-direction:column;gap:5px;min-width:0}
.task-focus-info strong{font-size:13px;overflow-wrap:anywhere}
.task-focus-info small{color:var(--ds-muted);font-size:11px}
.task-focus-actions{display:flex;align-items:center;gap:12px;flex:none}
.task-focus-actions time{font-size:11px;white-space:nowrap;color:var(--ds-secondary)}
.task-focus-actions .task-overdue{font-size:11px}
@media(max-width:800px){
 .review-shade .review-sheet{width:100%;max-width:100%}
 .review-workspace{grid-template-columns:minmax(0,1fr);gap:18px}
 .review-stage{position:static}
 .review-inline-media{min-height:170px;max-height:30dvh}
 .review-inline-image,.review-inline-video{min-height:0;max-height:30dvh}
 .review-inline-media .media-review-preview{padding:10px}
 .review-inline-media .media-review-preview .media-thumb{width:110px;height:82px}
 .review-queue-head{padding-bottom:8px}
 .review-focus-bar{width:100%;margin:0 0 11px}
 .review-focus-bar button{flex:1;min-width:0;min-height:43px;padding:7px 9px;white-space:nowrap}
 .task-priority-header{align-items:flex-start;flex-direction:column}
 .task-focus-item{padding:12px;gap:9px}
 .task-focus-actions{gap:7px}
 .task-focus-actions button{min-height:43px}
}
@media(max-width:375px){
 .task-focus-item{flex-wrap:wrap}
 .task-focus-actions{width:100%;justify-content:space-between}
 .review-controls .modalactions{flex-direction:column}
 .review-controls .modalactions button{width:100%}
}
@media(prefers-reduced-motion:reduce){.review-inline-image,.review-inline-video{transition:none}}

/* Files: quick type chips complement, never replace, the review-state filter. */
.studio-file-kinds{display:flex;align-items:center;flex-wrap:nowrap;gap:7px;margin:13px 0 17px;max-width:100%}
.studio-file-kind{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:44px;min-width:0;white-space:nowrap;padding:10px 14px;border:1px solid var(--ds-line-strong);border-radius:var(--ds-radius-sm);background:var(--ds-raised);color:var(--ds-secondary);font-weight:700;font-size:12px;transition:background var(--ds-fast),border-color var(--ds-fast)}
.studio-file-kind svg{height:16px;width:16px;flex:none}
.studio-file-kind:hover{border-color:var(--ds-accent);color:var(--ds-ink)}
.studio-file-kind.active,.studio-file-kind[aria-pressed="true"]{background:var(--ds-accent-soft);border-color:var(--ds-accent);color:var(--ds-ink)}
/* Four equally sized touch targets at iPhone widths; never create a second row. */
@media(max-width:640px){
 .studio-file-kinds{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px}
 .studio-file-kind{width:100%;min-width:0;min-height:44px;padding:8px 3px;gap:4px;font-size:11px}
 .studio-file-kind svg{width:14px;height:14px}
}
@media(max-width:355px){
 .studio-file-kind{font-size:10.5px;padding:8px 1px;gap:3px}
 .studio-file-kind svg{width:13px;height:13px}
}
/* Inactive boards must not render below the active view (mobile + desktop). */
.task-focus-list.is-inactive,.kanban.is-inactive{display:none!important}
@media(prefers-reduced-motion:reduce){.studio-file-kind{transition:none}}

/* WCAG 2.2: review feedback label, helper and editable placeholder must remain
   legible against the field surface in both system/light/dark themes. */
.review-sheet #reviewForm .field label,
.review-sheet #reviewForm .field label small{color:var(--ds-ink)}
.review-sheet #reviewForm .field textarea{color:var(--ds-ink);background:var(--ds-field)}
.review-sheet #reviewForm .field textarea::placeholder{color:var(--ds-secondary);opacity:1}