/* Trash and Storage cleanup windows */
.tr2-card { width: min(720px, 100%); max-height: min(86vh, 760px); display: flex; flex-direction: column; }
.tr2-body { flex: 1 1 auto; min-height: 0; overflow: auto; padding: 0.9rem 1.25rem; -webkit-overflow-scrolling: touch; }
.tr2-foot { flex-wrap: wrap; align-items: center; }
.tr2-foot .tr2-total { margin-right: auto; display: grid; gap: 0.1rem; min-width: 0; }
.tr2-total b { font-size: 0.98rem; color: var(--ink, #f5f0df); }
.tr2-total small { color: var(--muted, #b2a47c); font-size: 0.76rem; line-height: 1.3; }
.tr2-go:not(:disabled) { background: var(--accent, #d4aa32); border-color: var(--accent, #d4aa32); color: #1a1405; }
.tr2-go:disabled { opacity: 0.45; cursor: default; }
.tr2-danger { color: #ff9b8a; border-color: color-mix(in srgb, #ff9b8a 45%, var(--line, #2a2517)); }
.tr2-sum { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; padding: 0 0.1rem 0.7rem; color: var(--muted, #b2a47c); }
.tr2-sum b { color: var(--ink, #f5f0df); font-size: 1rem; }
.tr2-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.5rem; }
.tr2-row, .tr2-pick { display: flex; align-items: center; gap: 0.75rem; padding: 0.6rem 0.7rem; border: 1px solid var(--line, #2a2517); border-radius: 12px; background: #080808; min-width: 0; }
.tr2-pick { cursor: pointer; }
.tr2-pick.is-off { opacity: 0.55; cursor: default; }
.tr2-pick:hover:not(.is-off) { border-color: color-mix(in srgb, var(--accent, #d4aa32) 45%, var(--line, #2a2517)); }
.tr2-pick input { flex: none; width: 18px; height: 18px; accent-color: var(--accent, #d4aa32); }
.tr2-ico { flex: none; width: 38px; height: 38px; border-radius: 10px; display: grid; place-items: center; background: #161005; border: 1px solid #3a2f13; color: #e6c45c; }
.tr2-ico svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.tr2-k-folder { color: #f2cb62; }
.tr2-main { flex: 1 1 auto; min-width: 0; display: grid; gap: 0.1rem; }
.tr2-main b { font-weight: 600; font-size: 0.92rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tr2-main small { color: var(--muted, #b2a47c); font-size: 0.76rem; line-height: 1.3; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tr2-when { opacity: 0.85; }
.tr2-size { flex: none; font-variant-numeric: tabular-nums; font-size: 0.85rem; color: var(--ink, #f5f0df); }
.tr2-acts { flex: none; display: flex; gap: 0.35rem; }
.tr2-btn { width: auto; min-height: 36px; padding: 0 0.8rem; border-radius: 10px; font-size: 0.84rem; }
.tr2-sec { border: 1px solid var(--line, #2a2517); border-radius: 14px; background: color-mix(in srgb, var(--surface, #101010) 70%, transparent); margin-bottom: 0.7rem; }
.tr2-sec > summary { display: flex; align-items: center; justify-content: space-between; gap: 0.8rem; padding: 0.75rem 0.9rem; cursor: pointer; list-style: none; }
.tr2-sec > summary::-webkit-details-marker { display: none; }
.tr2-sec > summary span { display: grid; gap: 0.12rem; min-width: 0; }
.tr2-sec > summary b { font-size: 0.98rem; }
.tr2-sec > summary small { color: var(--muted, #b2a47c); font-size: 0.78rem; line-height: 1.3; }
.tr2-sec > summary em { flex: none; font-style: normal; font-variant-numeric: tabular-nums; color: var(--accent, #d4aa32); font-weight: 700; }
.tr2-sec-body { display: grid; gap: 0.4rem; padding: 0 0.7rem 0.75rem; }
.tr2-group { display: grid; gap: 0.3rem; padding: 0.4rem; border: 1px dashed color-mix(in srgb, var(--line, #2a2517) 80%, transparent); border-radius: 12px; }
.tr2-empty, .tr2-done { display: grid; justify-items: center; gap: 0.45rem; padding: 2.2rem 1rem; text-align: center; color: var(--muted, #b2a47c); }
.tr2-empty b, .tr2-done b { color: var(--ink, #f5f0df); font-size: 1.1rem; }
.tr2-empty-ico, .tr2-done-ico { width: 58px; height: 58px; border-radius: 18px; display: grid; place-items: center; background: #161005; border: 1px solid #3a2f13; color: #e6c45c; }
.tr2-empty-ico svg, .tr2-done-ico svg { width: 28px; height: 28px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.tr2-skel { height: 58px; border-radius: 12px; margin-bottom: 0.5rem; background: linear-gradient(90deg, #0d0b07, #17130b, #0d0b07); background-size: 200% 100%; animation: tr2Sk 1.3s linear infinite; }
@keyframes tr2Sk { to { background-position: -200% 0; } }
.icon-storage-clean { mask-image: url('assets/svg/storage-clean.svg'); -webkit-mask-image: url('assets/svg/storage-clean.svg'); }
.ps-clean-card .ps-two { margin-top: 0.7rem; }
.ps-clean-btn { width: auto; min-height: 40px; padding: 0 1rem; border-radius: 11px; font-size: 0.9rem; font-weight: 650; cursor: pointer; }
@media (max-width: 640px) {
  .tr2-modal { align-items: flex-end; padding: 0; }
  .tr2-card { max-height: 92vh; border-bottom-left-radius: 0; border-bottom-right-radius: 0; width: 100%; }
  .tr2-row { flex-wrap: wrap; }
  .tr2-acts { width: 100%; justify-content: flex-end; }
  .tr2-foot .tr2-total { flex: 1 1 100%; }
}

/* Transcribe from a link */
.li-steps { list-style: none; display: flex; gap: 0.4rem; margin: 0 0 1rem; padding: 0; }
.li-steps li { flex: 1 1 0; display: flex; align-items: center; gap: 0.5rem; font-size: 0.8rem; color: var(--muted, #b2a47c); padding: 0.45rem 0.55rem; border-radius: 10px; border: 1px solid var(--line, #2a2517); background: #080808; min-width: 0; }
.li-steps li span { flex: none; width: 22px; height: 22px; border-radius: 50%; display: grid; place-items: center; font-size: 0.74rem; font-weight: 700; background: #1a1409; border: 1px solid #3a2f13; }
.li-steps li.is-on { color: var(--ink, #f5f0df); border-color: color-mix(in srgb, var(--accent, #d4aa32) 60%, var(--line, #2a2517)); }
.li-steps li.is-on span { background: var(--accent, #d4aa32); color: #1a1405; border-color: var(--accent, #d4aa32); }
.li-steps li.is-done span { background: color-mix(in srgb, var(--accent, #d4aa32) 30%, #1a1409); color: var(--ink, #f5f0df); }
.li-urlrow { display: flex; gap: 0.5rem; }
.li-url { flex: 1 1 auto; min-width: 0; }
.li-paste { flex: none; width: auto; min-height: 44px; padding: 0 1rem; }
.li-result { margin-top: 0.9rem; min-height: 96px; }
.li-vid { display: flex; gap: 0.8rem; align-items: center; padding: 0.7rem; border: 1px solid var(--line, #2a2517); border-radius: 14px; background: #080808; }
.li-vid-sm { margin-bottom: 1rem; padding: 0.5rem 0.6rem; }
.li-thumb { flex: none; width: 128px; aspect-ratio: 16 / 9; border-radius: 9px; overflow: hidden; background: #15110a; }
.li-vid-sm .li-thumb { width: 88px; }
.li-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.li-meta { min-width: 0; display: grid; gap: 0.2rem; }
.li-meta b { font-size: 0.95rem; line-height: 1.3; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; overflow: hidden; }
.li-meta small { color: var(--muted, #b2a47c); font-size: 0.8rem; }
.li-status { display: flex; align-items: center; gap: 0.6rem; padding: 0.8rem 0.9rem; border-radius: 12px; border: 1px dashed var(--line, #2a2517); color: var(--muted, #b2a47c); font-size: 0.9rem; }
.li-status.is-err { border-style: solid; border-color: color-mix(in srgb, #ff9b8a 50%, var(--line, #2a2517)); color: #ffb4a6; background: color-mix(in srgb, #ff6a52 8%, #080808); }
.li-spin { width: 16px; height: 16px; border-radius: 50%; border: 2px solid #3a3220; border-top-color: var(--accent, #d4aa32); animation: liSpin 0.8s linear infinite; }
@keyframes liSpin { to { transform: rotate(360deg); } }
.li-note { margin: 0.9rem 0 0; color: var(--muted, #b2a47c); font-size: 0.78rem; line-height: 1.4; }
.li-sum { display: grid; gap: 0.2rem; padding: 0.7rem 0.8rem; border: 1px solid var(--line, #2a2517); border-radius: 12px; background: #080808; margin-top: 0.4rem; }
.li-sum span { color: var(--muted, #b2a47c); font-size: 0.82rem; }
.li-prog { display: grid; gap: 0.5rem; padding: 0.4rem 0 0.2rem; }
.li-bar { height: 8px; border-radius: 6px; background: #19160d; overflow: hidden; }
.li-bar i { display: block; height: 100%; border-radius: 6px; background: linear-gradient(90deg, var(--accent, #d4aa32), #f1dd9a); transition: width 0.5s ease; }
.li-prog-row { display: flex; justify-content: space-between; gap: 1rem; font-size: 0.88rem; color: var(--muted, #b2a47c); }
.li-prog-row b { color: var(--ink, #f5f0df); font-variant-numeric: tabular-nums; }
.li-modal .tr2-card { width: min(640px, 100%); }
@media (max-width: 640px) {
  .li-steps li { font-size: 0.72rem; padding: 0.4rem; }
  .li-steps li:not(.is-on) { flex: 0 0 auto; }
  .li-steps li:not(.is-on) { font-size: 0; gap: 0; }
  .li-thumb { width: 96px; }
}

.li-modal .tp-select { width: 100%; min-height: 44px; padding: 0 0.8rem; border-radius: 10px; border: 1px solid var(--line, #2a2517); background: #0b0a07; color: var(--ink, #f5f0df); font: inherit; font-size: 0.95rem; }
.li-modal .tp-select:focus { outline: none; border-color: var(--accent, #d4aa32); box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent, #d4aa32) 22%, transparent); }

/* ── wizard polish: breathing room between sections, option cards ── */
.li-modal .tr2-body.tp-tr { display: grid; align-content: start; gap: 1.15rem; }
.li-modal .tr2-body.tp-tr > * { margin: 0; min-width: 0; }
.li-modal .li-steps, .li-modal .li-vid-sm { margin-bottom: 0; }
.li-modal .li-note { margin: 0; }
.li-modal .tp-sec { display: grid; gap: 0.55rem; }
.li-modal .tp-qgrid { gap: 0.6rem; }
.li-modal .tp-q-sub { white-space: normal; line-height: 1.3; }
.li-modal .li-hint { margin: 0.1rem 0 0; font-size: 0.74rem; color: var(--muted, #b2a47c); }
.li-modal .li-opt { transition: border-color 0.14s, background 0.14s; }
.li-modal .li-opt:has(input:checked), .li-modal .tp-tog:has(input[type="checkbox"]:checked) { border-color: var(--accent-2, #d4aa32); background: color-mix(in srgb, var(--accent, #b88916) 12%, var(--bg, #030303) 88%); }
.li-modal .li-opt input[type="radio"] { border-radius: 50%; }
.li-modal .li-rec { font-style: normal; font-size: 0.62rem; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; padding: 0.08rem 0.45rem; margin-left: 0.35rem; border-radius: 999px; vertical-align: 1px; color: var(--accent-ink, #120e03); background: var(--accent-2, #d4aa32); }
.li-modal .tp-field .tp-dim { text-transform: none; letter-spacing: 0; font-weight: 500; font-size: 0.74rem; }
@media (max-width: 640px) {
  .li-modal .tr2-body.tp-tr { gap: 1.2rem; }
  .li-modal .tp-qgrid { grid-template-columns: 1fr 1fr; }
  .li-modal .tp-select { font-size: 16px; }
}
.li-modal .li-opt input[type="radio"] { appearance: none; -webkit-appearance: none; flex: none; width: 20px; height: 20px; margin: 1px 0 0; border-radius: 50%; border: 2px solid color-mix(in srgb, var(--muted, #b2a47c) 70%, transparent); background: transparent; display: grid; place-items: center; cursor: pointer; }
.li-modal .li-opt input[type="radio"]::after { content: ''; width: 8px; height: 8px; border-radius: 50%; background: var(--accent-ink, #120e03); transform: scale(0); transition: transform 0.12s; }
.li-modal .li-opt input[type="radio"]:checked { border-color: var(--accent-2, #d4aa32); background: var(--accent-2, #d4aa32); }
.li-modal .li-opt input[type="radio"]:checked::after { transform: scale(1); }
.li-modal dl.li-sum { margin: 0; padding: 0.2rem 0.9rem; gap: 0; }
.li-modal .li-sum > div { display: flex; justify-content: space-between; gap: 1rem; padding: 0.6rem 0; }
.li-modal .li-sum > div + div { border-top: 1px solid var(--line, #2a2517); }
.li-modal .li-sum dt { color: var(--muted, #b2a47c); font-size: 0.85rem; }
.li-modal .li-sum dd { margin: 0; font-size: 0.9rem; font-weight: 650; text-align: right; }
/* done / empty screens: never wider than the sheet, long file names wrap */
.li-modal .tr2-body { overflow-x: hidden; }
.li-modal .li-run { display: grid; gap: 1.1rem; min-width: 0; }
.li-modal .tr2-done, .li-modal .tr2-empty { grid-template-columns: minmax(0, 1fr); width: 100%; min-width: 0; padding: 1.4rem 0.5rem; gap: 0.6rem; overflow-wrap: anywhere; }
.li-modal .tr2-done b { line-height: 1.3; }
.li-modal .tr2-done > span { font-size: 0.88rem; line-height: 1.45; }
.li-modal .li-done-file { margin: 0.1rem 0 0; max-width: 100%; padding: 0.4rem 0.7rem; border-radius: 10px; border: 1px solid var(--line, #2a2517); background: #080808; color: var(--ink, #f5f0df); font-size: 0.82rem; line-height: 1.35; word-break: break-all; text-align: center; }

/* ── Storage cleanup inside Profile → Cleanup ── */
.ps-cleanup { min-width: 0; }
.tr2-embed { display: block; }
.tr2-embed-sub { margin: 0 0 0.8rem; color: var(--muted, #b2a47c); font-size: 0.86rem; line-height: 1.4; }
.tr2-embed .tr2-body { flex: none; overflow: visible; padding: 0; }
.tr2-foot-embed { position: sticky; bottom: 0; z-index: 3; display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 0.6rem; margin: 0.8rem -1.25rem -0.6rem; padding: 0.75rem 1.25rem calc(0.8rem + env(safe-area-inset-bottom, 0px)); border-top: 1px solid color-mix(in srgb, var(--line, #2a2517) 85%, transparent); background: color-mix(in srgb, var(--bg, #030303) 90%, var(--surface, #101010) 10%); }
.tr2-foot-embed button { width: auto; min-height: 44px; padding: 0 1.2rem; border-radius: 12px; font-size: 0.95rem; font-weight: 650; cursor: pointer; }
@media (max-width: 640px) {
  .tr2-foot-embed { margin-left: -1rem; margin-right: -1rem; margin-bottom: -0.4rem; padding-left: 1rem; padding-right: 1rem; }
  .tr2-foot-embed .tr2-total { flex: 1 1 100%; }
  .tr2-foot-embed button { flex: 1 1 0; }
}

/* Trash: icon buttons, empty state, footer */
.tr2-ib { appearance: none; box-sizing: border-box; display: inline-flex; align-items: center; justify-content: center; flex: none; width: 36px; height: 36px; padding: 0; margin: 0; border-radius: 10px; border: 1px solid #2c2313; background: #15120b; color: #d8cda5; cursor: pointer; transition: border-color 120ms, color 120ms, background 120ms, transform 60ms; }
.tr2-ib:hover { border-color: #3f6a4c; color: #8fd9a8; background: #101a14; }
.tr2-ib:active { transform: translateY(1px); }
.tr2-ib:focus-visible { outline: 2px solid #d4aa32; outline-offset: 2px; }
.tr2-ib svg { display: block; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; pointer-events: none; }
.tr2-ib.is-danger { color: #e98a7e; border-color: #4d241d; }
.tr2-ib.is-danger:hover { color: #ff9d92; border-color: #8a3b30; background: #221210; }
.tr2-row:hover { border-color: color-mix(in srgb, var(--accent, #d4aa32) 30%, var(--line, #2a2517)); }
.tr2-left.is-soon { color: #f0a08f; }
.tr2-sum { padding: 0 0.1rem 0.8rem; }
.tr2-sum span { font-size: 0.84rem; }
.tr2-empty-ico.is-trash { width: 84px; height: 84px; border-radius: 26px; margin-bottom: 0.4rem; color: #e6c45c; border-color: #4a3912;
  background: radial-gradient(circle at 50% 35%, rgba(230, 196, 92, 0.18), transparent 70%), #130f06; box-shadow: 0 0 0 6px rgba(230, 196, 92, 0.04), 0 10px 30px rgba(0, 0, 0, 0.45); }
.tr2-empty-ico.is-trash svg { width: 42px; height: 42px; stroke-width: 1.9; }
.tr2-fbtn { display: inline-flex; align-items: center; gap: 0.45rem; }
.tr2-fbtn svg { fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; flex: none; }
.tr2-spacer { flex: 1 1 auto; }
@media (max-width: 640px) {
  .tr2-row { flex-wrap: nowrap; }
  .tr2-acts { width: auto; }
  .tr2-spacer { display: none; }
}