/* Expression assets and independent timeline snapshots. */
.expression-edit-panel { margin-top: 4px; }
.expression-edit-controls { display: grid; grid-template-columns: minmax(100px, 1fr) minmax(140px, 1fr); gap: 14px; align-items: end; }
.expression-edit-controls .field { margin-bottom: 0; min-width: 0; }
.expression-edit-controls .btn { width: 100%; min-height: 39px; }
.expression-edit-footer { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; margin-top: 14px; }
.expression-edit-note { color: var(--muted); font-size: 12px; line-height: 1.75; margin: 10px 0 0; }
.expression-duration-status { display: block; color: var(--muted); font-size: 11px; min-height: 18px; line-height: 1.7; }
.expression-edit-panel .input:disabled { opacity: .65; cursor: not-allowed; }
.expression-edit-panel .tag { font-size: 10px; white-space: normal; }
.expression-editor-dialog .notes { margin: 0 0 20px; line-height: 1.75; }
.expression-editor-fields { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(110px, 1fr); gap: 0 16px; }
.expression-editor-kind { grid-column: 1 / -1; }
.expression-editor-kind > span { display: block; color: var(--muted); font-size: 11px; line-height: 1.7; margin-top: 7px; }
.expression-editor-section { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; margin: 4px 0 12px; }
.expression-editor-section strong { font-size: 13px; color: var(--ink); }
.expression-editor-section span { font-size: 11px; color: var(--muted); }
.expression-editor-motors { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.expression-motor-field { padding: 10px 12px; min-width: 0; border: 1px solid var(--line); background: var(--surface-alt); border-radius: 8px; }
.expression-motor-field > span { display: flex; gap: 7px; color: var(--ink); font-size: 12px; align-items: center; margin-bottom: 8px; }
.expression-motor-field small { color: var(--muted); font-size: 10px; }
.expression-motor-field > div { display: flex; gap: 8px; align-items: center; color: var(--muted); }
.expression-motor-field .input { min-width: 0; width: 100%; }
.expression-edit-error { color: var(--red); font-size: 12px; line-height: 1.7; margin: 12px 0 0; }
.expression-edit-error:empty { display: none; }
@media (max-width: 520px) {
  .expression-edit-controls { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 10px; }
  .expression-edit-controls .btn { padding-left: 8px; padding-right: 8px; }
  .expression-editor-fields { grid-template-columns: minmax(0, 1fr); }
  .expression-editor-motors { gap: 8px; }
  .expression-motor-field { padding: 9px 8px; }
  .expression-motor-field > span { flex-wrap: wrap; gap: 3px 6px; }
  .expression-editor-dialog .modal-footer { flex-wrap: wrap; }
}

/* Asset operations sit outside the draggable preview button. */
.expression-asset-card{min-width:0;padding:0;background:var(--surface-alt);border:1px solid var(--line);border-radius:12px;overflow:hidden;transition:border-color .18s,box-shadow .18s}
.expression-asset-card.is-selected{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent-line)}
.expression-page .expression-asset-card>.expression-tile{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;min-height:140px;padding:16px 12px;border:0;border-radius:0;background:transparent;box-shadow:none;gap:4px}
.expression-page .expression-asset-card>.expression-tile.selected,.expression-page .expression-asset-card>.expression-tile:hover{background:var(--accent-soft);box-shadow:none}
.expression-asset-card>.expression-tile strong{max-width:100%;overflow-wrap:anywhere;line-height:1.5}
.expression-asset-card>.expression-tile small{line-height:1.6}
.expression-asset-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;border-top:1px solid var(--line);padding:10px;background:var(--surface)}
.expression-asset-actions .btn.small{min-width:0;min-height:34px;padding:5px 6px;font-size:12px;justify-content:center}
.expression-asset-actions .expression-asset-edit{color:var(--accent);border-color:var(--accent-line);background:var(--accent-soft)}
.expression-asset-actions .expression-asset-delete{color:var(--red)}
.expression-asset-actions .expression-asset-delete:hover:not(:disabled){border-color:var(--red)}
.expression-asset-name{font-size:17px!important;font-weight:600;min-height:46px}
.expression-reference-list{display:grid;gap:8px;list-style:none;padding:0;margin:16px 0;max-height:280px;overflow:auto}
.expression-reference-list li{min-width:0;padding:12px 14px;border:1px solid var(--line);border-left:3px solid var(--accent);border-radius:8px;background:var(--surface-alt)}
.expression-reference-list strong,.expression-reference-list span{display:block;overflow-wrap:anywhere}
.expression-reference-list strong{font-size:13px;line-height:1.6;color:var(--ink)}
.expression-reference-list span{font-size:12px;line-height:1.7;color:var(--muted);margin-top:3px}
.expression-library-empty{grid-column:1/-1;padding:28px 16px;text-align:center;border:1px dashed var(--line);border-radius:10px;color:var(--muted);line-height:1.8}
.expression-library-empty strong{font-size:15px;color:var(--ink)}
.expression-library-empty p{font-size:12px;margin:8px 0 0}
@media(max-width:1100px){.expression-page .expression-preview:has(.expression-asset-card){grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){.expression-page .expression-preview:has(.expression-asset-card){gap:10px;padding:14px}.expression-page .expression-asset-card>.expression-tile{min-height:126px;padding:14px 8px}.expression-asset-actions{padding:7px;gap:5px}.expression-asset-actions .btn.small{min-height:38px;padding:4px;font-size:12px}.expression-reference-list{max-height:230px}#modal:has(.expression-reference-list) .modal-footer{flex-wrap:wrap}.expression-asset-name{font-size:16px!important}}
