/* Media downloader bot page — site-shell tokens, Telegram-blue accent. */
.td-hero { text-align: center; display: flex; flex-direction: column; align-items: center; gap: 4px; }
.td-hero p { margin-inline: auto; }
.td-hero__icon { width: 76px; height: 76px; border-radius: 22px; display: grid; place-items: center; background: linear-gradient(135deg, #0284c7, #0ea5e9); box-shadow: 0 0 32px rgba(14,165,233,.35); margin-bottom: 8px; }
.td-live { color: #047857; background: rgba(16,185,129,.12); border-color: rgba(16,185,129,.4); }
html:not(.light-mode) .td-live { color: #34d399; }
.td-dot { width: 8px; height: 8px; border-radius: 50%; background: #10b981; box-shadow: 0 0 0 3px rgba(16,185,129,.25); }
.td-permission { margin-top: 16px; max-width: 680px; display: grid; gap: 4px; text-align: center; border-color: rgba(245,158,11,.5); background: rgba(245,158,11,.1); }
.td-permission span { font-size: .9rem; color: var(--glass-text-muted); }
.td-hero__ctas { justify-content: center; margin-top: 16px; }
.td-btn-tg { background: linear-gradient(135deg, #0369a1, #0284c7); color: #fff; box-shadow: 0 8px 24px rgba(2,132,199,.3); }
.td-btn-tg:hover { background: linear-gradient(135deg, #075985, #0369a1); }

.td-section { margin-top: 22px; }
.td-section h2 { font-size: 1.3rem; margin: 10px 0 12px; }
.td-chip { color: #0369a1; border-color: rgba(14,165,233,.35); background: rgba(14,165,233,.1); }
html:not(.light-mode) .td-chip { color: #7dd3fc; }
.td-text { color: var(--glass-text-muted); margin: 0 0 10px; }
.td-text strong, .td-box strong { color: var(--glass-text-main); }
.td-box { padding: 16px; border-radius: 14px; border: 1px solid var(--glass-border); background: var(--glass-bg-subtle); }
.td-box h3 { margin: 0 0 8px; font-size: 1rem; display: flex; gap: 8px; align-items: center; }
.td-box p { margin: 0; color: var(--glass-text-muted); font-size: .93rem; }
.td-box ul { margin: 0; padding-inline-start: 18px; display: grid; gap: 6px; color: var(--glass-text-muted); font-size: .92rem; }
.td-cta { margin-top: 26px; text-align: center; border-color: rgba(14,165,233,.35); }
.td-cta h2 { margin: 0 0 6px; font-size: 1.3rem; }
.td-cta p { color: var(--glass-text-muted); margin: 0 auto 16px; max-width: 60ch; }
.td-cta .btn, .td-hero .btn { max-width: 100%; flex-wrap: wrap; white-space: normal; text-align: center; }
.td-cta .btn span[dir="ltr"] { overflow-wrap: anywhere; }

.td-browser{border-color:rgba(14,165,233,.35);padding:28px}.td-download-form{margin-top:24px}.td-download-form label{display:block;font-weight:700;margin-bottom:9px}.td-input-row{display:flex;gap:12px;align-items:stretch}.td-input-row input{flex:1;min-width:0;padding:15px 17px;border:1px solid var(--glass-border);border-radius:14px;background:var(--glass-bg-subtle);color:var(--glass-text-main);font:inherit}.td-input-row input:focus-visible{outline:3px solid #38bdf860;outline-offset:2px}.td-small{font-size:.85rem;color:var(--glass-text-muted);line-height:1.7;margin-top:12px}.td-web-status{padding:16px;border-radius:14px;margin-top:18px;background:#0ea5e914;border:1px solid #0ea5e940}.td-web-status[data-state="working"]::before{content:"";display:inline-block;width:14px;height:14px;border:2px solid #0ea5e940;border-top-color:#0284c7;border-radius:50%;margin-inline-end:10px;animation:td-spin 1s linear infinite}.td-web-status[data-state="error"]{border-color:#f9731660;background:#f9731610}.td-web-results{display:grid;gap:10px;margin-top:16px}.td-file{display:flex;gap:16px;align-items:center;justify-content:space-between;border:1px solid var(--glass-border);background:var(--glass-bg-subtle);border-radius:14px;padding:15px}.td-file span{overflow-wrap:anywhere;min-width:0}.td-file small{display:block;color:var(--glass-text-muted);margin-top:5px}.td-file a{flex-shrink:0}.td-input-row button:disabled{opacity:.65;cursor:wait}@keyframes td-spin{to{transform:rotate(360deg)}}@media(max-width:600px){.td-browser{padding:20px}.td-input-row{flex-direction:column}.td-file{align-items:flex-start;flex-direction:column}}@media(prefers-reduced-motion:reduce){.td-web-status[data-state="working"]::before{animation:none}}
