.studio-heading {display:flex; justify-content:space-between; align-items:end; gap:2rem;}
.studio-heading > div {max-width:46rem;}
.studio-heading .accent-text {color:var(--accent);}
.studio-heading > .btn {flex-shrink:0; margin-bottom:1.5rem;}
.studio-toolbar {display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:1rem;}
.studio-overview {border-block:1px solid var(--line); padding:1.15rem 0; margin-bottom:1.25rem;}
.studio-count {margin:0; color:var(--lime); font-size:.9rem;}
.studio-message {font-size:.88rem; color:var(--lime); overflow-wrap:anywhere;}
.studio-message:empty {display:none;}
[data-studio-warning] {padding:1rem; border:1px solid var(--accent); border-radius:8px; color:var(--text);}
.studio-layout {display:grid; grid-template-columns:235px minmax(0,1fr); gap:2.5rem; align-items:start; margin:2rem 0 3.5rem;}
.studio-sidebar h2 {font-size:1rem; margin-top:0;}
.collection-list {padding:0; list-style:none; display:grid; gap:.5rem; margin:0 0 1.8rem;}
.collection-list button {width:100%; display:flex; justify-content:space-between; gap:1rem; text-align:left; background:transparent; border:1px solid var(--line); padding:.8rem 1rem; border-radius:8px;}
.collection-list button span:first-child {overflow-wrap:anywhere; min-width:0;}
.collection-list button[aria-current="true"] {background:var(--accent-soft); border-color:var(--accent); color:var(--accent);}
.collection-list .collection-number {font-variant-numeric:tabular-nums; color:var(--muted);}
.studio-field {display:grid; gap:.6rem; margin-bottom:1rem;}
.studio-field label,.studio-backup-controls label,.studio-dialog label {font-size:.85rem; font-weight:600;}
.studio-field input,.studio-field textarea,.studio-dialog input,.studio-dialog select {width:100%; min-width:0; font:inherit; padding:.7rem .85rem; border:1px solid var(--line); background:var(--bg); color:var(--text); border-radius:7px;}
.studio-field textarea {resize:vertical; min-height:90px;}
.studio-field .btn {justify-self:start;}
.collection-detail {min-width:0;}
.collection-detail h2 {font-size:1.7rem; margin:0; overflow-wrap:anywhere;}
.collection-description {white-space:pre-wrap; overflow-wrap:anywhere; color:var(--muted);}
.collection-edit {margin:1.2rem 0; border-block:1px solid var(--line); padding:1rem 0;}
.collection-edit summary {color:var(--accent); cursor:pointer; font-size:.9rem;}
.collection-edit form {margin-top:1rem;}
.studio-resource-list {list-style:none; padding:0; display:grid; gap:1rem;}
.studio-resource {padding:1.35rem; border:1px solid var(--line); border-radius:12px; background:var(--surface); min-width:0;}
.studio-resource h3 {margin:0; font-size:1.15rem; overflow-wrap:anywhere;}
.studio-resource .resource-context {font-size:.8rem; color:var(--accent); margin:.35rem 0;}
.studio-resource .resource-summary {font-size:.88rem; color:var(--muted);}
.studio-resource .studio-toolbar {align-items:start;}
.studio-resource-actions {display:flex; flex-wrap:wrap; gap:.5rem; margin:1rem 0 .3rem;}
.studio-resource-actions .btn {padding:.55rem .8rem; font-size:.78rem; min-height:40px;}
.studio-resource-actions [aria-pressed="true"],.studio-resource-actions [data-saved="true"] {color:var(--lime); border-color:#586340;}
.studio-note {margin-top:1rem; font-size:.85rem;}
.studio-note summary {cursor:pointer; color:var(--accent);}
.studio-note form {margin:1rem 0 0;}
.studio-danger {background:none; border:0; padding:.5rem 0; color:var(--danger); text-decoration:underline; text-underline-offset:3px; font-size:.8rem; cursor:pointer;}
.studio-empty {padding:3rem 2rem; text-align:center;}
.studio-empty .empty-mark {display:block; color:var(--accent); font-size:2.6rem; margin-bottom:1rem;}
.studio-empty h2,.studio-empty h3 {margin:.5rem 0;}
.studio-empty p {max-width:32rem; margin:1rem auto; color:var(--muted);}
.studio-backup {padding:2rem; display:grid; grid-template-columns:1fr 1fr; gap:3rem;}
.studio-backup h2 {font-size:1.65rem;}
.studio-backup-controls {display:grid; justify-items:start; align-content:start; gap:.8rem; min-width:0;}
.studio-backup-controls input {width:100%; min-width:0; font-size:.8rem;}
.studio-backup-controls p {margin:0;}
.studio-dialog {width:min(480px,calc(100% - 32px)); max-height:calc(100dvh - 48px); overflow:auto; padding:1.5rem; color:var(--text); background:var(--surface); border:1px solid var(--accent); border-radius:14px;}
.studio-dialog::backdrop {background:rgb(0 0 0 / .72);}
.studio-dialog h2 {font-size:1.3rem; margin:0;}
.studio-dialog .studio-toolbar .btn {font-size:.75rem; padding:.5rem;}
.studio-dialog select {margin:.5rem 0 1rem;}
.studio-dialog-resource {color:var(--accent); overflow-wrap:anywhere;}
.compare-tray {position:sticky; bottom:1rem; z-index:20; padding:1rem 1.25rem; background:#25212f; border:1px solid var(--accent); border-radius:12px; box-shadow:0 12px 35px #0008; display:flex; align-items:center; flex-wrap:wrap; gap:.8rem 1.2rem; margin:1.5rem 0;}
.compare-tray > p {margin:0; font-size:.8rem; color:var(--accent);}
.compare-tray > a {margin-left:auto; flex-shrink:0; font-size:.8rem; padding:.65rem 1rem;}
.compare-tray ul {list-style:none; display:flex; flex-wrap:wrap; gap:.5rem; padding:0; margin:0; flex:1; min-width:0;}
.compare-chip {padding:.45rem .7rem; background:var(--bg); border:1px solid var(--line); border-radius:6px; font-size:.78rem; max-width:230px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.comparison-scroll {overflow-x:auto; border:1px solid var(--line); border-radius:12px; margin:1.2rem 0;}
.comparison-table {width:100%; border-collapse:collapse; table-layout:fixed; min-width:650px; font-size:.88rem; margin:0;}
.comparison-table caption {text-align:left; padding:1rem; color:var(--muted); background:var(--bg);}
.comparison-table th,.comparison-table td {vertical-align:top; padding:1.2rem; border-right:1px solid var(--line); border-bottom:1px solid var(--line); overflow-wrap:anywhere;}
.comparison-table thead th {background:var(--surface-raised); font-size:1.1rem;}
.comparison-table th:first-child {width:170px;}
.comparison-table tbody th {text-align:left; font-size:.8rem; font-weight:500; color:var(--muted); background:var(--bg);}
.comparison-table tbody td {background:var(--surface);}
.comparison-table td:last-child,.comparison-table th:last-child {border-right:0;}
.comparison-table tr:last-child > * {border-bottom:0;}
.comparison-table th .btn {display:block; margin:.8rem 0 0; font-size:.75rem; padding:.5rem .7rem;}
.comparison-table .comparison-name {display:block; text-align:left;}
.comparison-footnote {max-width:60rem; margin-top:1.5rem;}
.studio-catalogue-link {display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:.5rem; font-size:.85rem; padding-bottom:1rem;}
.studio-catalogue-link p {margin:0; color:var(--muted);}
@media(max-width:850px) {
  .studio-layout {grid-template-columns:190px minmax(0,1fr); gap:1.5rem;}
  .studio-heading {align-items:start; flex-direction:column; gap:0;}
  .studio-heading > .btn {margin-top:0;}
  .studio-backup {gap:1.5rem; padding:1.5rem;}
}
@media(max-width:600px) {
  .studio-layout,.studio-backup {grid-template-columns:1fr;}
  .studio-sidebar {border-bottom:1px solid var(--line); padding-bottom:1rem;}
  .collection-list {grid-template-columns:repeat(2,minmax(0,1fr));}
  .collection-list button {height:100%; padding:.7rem;}
  .studio-empty {padding:2rem 1rem;}
  .compare-tray {position:sticky; bottom:.5rem; padding:.65rem .8rem; gap:.5rem;}
  .compare-tray > p {order:0;}
  .compare-tray > a {order:1; margin-left:auto; padding:.5rem .7rem;}
  .compare-tray ul {order:2; flex-basis:100%; flex-wrap:nowrap; overflow-x:auto;}
  .compare-tray li {flex-shrink:0;}
  .compare-chip {max-width:180px;}
  .comparison-table th:first-child {width:130px;}
  .comparison-table th,.comparison-table td {padding:.9rem;}
}
