
.tow-library-root {
  position: fixed;
  left: 18px;
  bottom: 18px;
  z-index: 9998;
  font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
.tow-toggle {
  border: 1px solid rgba(138, 106, 210, .45);
  border-radius: 999px;
  padding: 10px 14px;
  background: rgba(30, 22, 48, .94);
  color: #fff;
  box-shadow: 0 14px 40px rgba(0,0,0,.28);
  cursor: pointer;
}
.tow-panel {
  display: none;
  width: min(620px, calc(100vw - 36px));
  max-height: min(760px, calc(100vh - 92px));
  margin-bottom: 10px;
  border: 1px solid rgba(138, 106, 210, .35);
  border-radius: 22px;
  background: rgba(20, 15, 32, .98);
  color: #f7f1ff;
  box-shadow: 0 22px 80px rgba(0,0,0,.38);
  overflow: hidden;
}
.tow-library-root.is-open .tow-panel { display: flex; flex-direction: column; }
.tow-header, .tow-controls, .tow-meta { padding: 14px 16px; }
.tow-header { display: flex; justify-content: space-between; gap: 16px; border-bottom: 1px solid rgba(255,255,255,.08); }
.tow-header h3 { margin: 0 0 4px; font-size: 16px; }
.tow-header p, .tow-card p, .tow-meta { margin: 0; color: rgba(247,241,255,.72); font-size: 12px; line-height: 1.45; }
.tow-close { border: 0; background: transparent; color: #fff; font-size: 24px; cursor: pointer; line-height: 1; }
.tow-controls { display: grid; grid-template-columns: 1fr 180px auto; gap: 8px; border-bottom: 1px solid rgba(255,255,255,.08); }
.tow-controls input, .tow-controls select, .tow-controls button {
  min-height: 38px;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.08);
  color: #fff;
  padding: 0 10px;
}
.tow-controls button { cursor: pointer; background: rgba(138,106,210,.28); }
.tow-meta { display: flex; justify-content: space-between; gap: 12px; border-bottom: 1px solid rgba(255,255,255,.08); }
.tow-list { overflow: auto; padding: 12px; display: grid; gap: 10px; }
.tow-card {
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 16px;
  padding: 12px;
  background: rgba(255,255,255,.055);
}
.tow-card-top { display: flex; justify-content: space-between; gap: 12px; align-items: flex-start; }
.tow-card h4 { margin: 0 0 8px; font-size: 14px; line-height: 1.3; }
.tow-cat { flex: 0 0 auto; border-radius: 999px; padding: 4px 8px; font-size: 11px; color: #f7f1ff; background: rgba(138,106,210,.28); }
.tow-tags { display: flex; flex-wrap: wrap; gap: 6px; margin: 10px 0; }
.tow-tags span { font-size: 11px; padding: 3px 7px; border-radius: 999px; background: rgba(255,255,255,.08); color: rgba(247,241,255,.78); }
.tow-actions { display: flex; gap: 8px; }
.tow-actions a, .tow-actions button {
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 10px;
  background: rgba(255,255,255,.08);
  color: #fff;
  text-decoration: none;
  padding: 7px 10px;
  font-size: 12px;
  cursor: pointer;
}
.tow-more { color: rgba(247,241,255,.72); font-size: 12px; text-align: center; }
@media (max-width: 720px) {
  .tow-controls { grid-template-columns: 1fr; }
  .tow-meta, .tow-card-top { flex-direction: column; }
  .tow-library-root { left: 12px; bottom: 12px; }
}
