:root{--tmo-font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--tmo-title-color: #f8fafc;--tmo-text-muted-color: #94a3b8;--tmo-input-bg: rgba(15, 23, 42, .45);--tmo-input-color: #e2e8f0;--tmo-input-placeholder-color: #94a3b8;--tmo-label-color: #e2e8f0;--tmo-empty-state-color: #94a3b8;--tmo-button-text-color: #86efac;--tmo-button-bg-hover: rgba(22, 101, 52, .28);--tmo-control-radius: 6px;--tmo-control-height: 44px;--tmo-modal-bg: #040b16;--tmo-modal-gradient: radial-gradient(1200px 600px at 25% 5%, rgba(12, 74, 110, .35), transparent 55%), radial-gradient(1200px 600px at 80% 30%, rgba(15, 23, 42, .6), transparent 60%);--tmo-text-main: #f8fafc;--tmo-text-muted: #94a3b8;--tmo-text-secondary: #e2e8f0;--tmo-border-soft: rgba(2, 10, 22, .9);--tmo-border-card: rgba(148, 163, 184, .15);--tmo-accent: #86efac;--tmo-focus: #3b82f6;--tmo-overlay: rgba(3, 7, 18, .84);--tmo-control-bg: rgba(15, 23, 42, .45);--tmo-dropdown-bg: #0b1325;--tmo-card-bg: rgba(2, 6, 23, .18);--tmo-queue-card-bg: #040b16;--tmo-cover-bg: #1e293b;--tmo-play-bg: rgba(15, 23, 42, .55);--tmo-time-bg: rgba(0, 0, 0, .8);--tmo-close-border: rgba(148, 163, 184, .35);--tmo-close-bg: rgba(15, 23, 42, .8);--tmo-open-btn-bg: #0f172a;--tmo-open-btn-color: #ffffff;--tmo-open-btn-radius: 8px;--tmo-open-btn-padding: 10px 16px;--tmo-open-btn-border: 0;--tmo-open-btn-font-size: 16px;--tmo-open-btn-font-weight: 500;--tmo-queue-list-max-height: 424px;--tmo-track-list-gap: 4px;--tmo-track-item-padding: 10px 12px;--tmo-track-item-gap: 8px;--tmo-track-title-size: 1rem;--tmo-track-title-weight: 400;--tmo-track-title-line-height: 1.05;--tmo-track-title-margin-bottom: 6px;--tmo-track-sub-size: .85rem;--tmo-track-sub-line-height: 1.15;--tmo-track-sub-margin-bottom: 6px;--tmo-track-label-radius: 4px;--tmo-track-label-padding: 2px 5px;--tmo-track-label-size: 11px;--tmo-track-label-line-height: 1.4;--tmo-track-label-gap: 6px;--tmo-track-label-bg: #232e3c;--tmo-cover-size: 70px;--tmo-cover-radius: 3px;--tmo-play-size: 28px;--tmo-play-font-size: 12px;--tmo-time-radius: 3px;--tmo-time-font-size: 10px;--tmo-time-padding: 2px 3px;--tmo-order-btn-radius: 4px;--tmo-order-btn-padding: 6px 12px;--tmo-order-btn-margin-right: 8px;--tmo-order-btn-font-weight: 500;--tmo-order-btn-bg: rgba(22, 101, 52, .14);--tmo-order-btn-hover-bg: rgba(22, 101, 52, .28);--tmo-order-btn-border: rgba(134, 239, 172, .6);--tmo-order-btn-hover-border: rgba(134, 239, 172, .9);--tmo-order-btn-color: var(--tmo-accent);--tmo-modal-title-size: 24px;--tmo-modal-title-weight: 700}.tmo-root{font-family:var(--tmo-font-family)}.tmo-theme-dark .tmo-order-button{--tmo-order-btn-bg: rgba(97, 159, 245, .14);--tmo-order-btn-hover-bg: rgba(97, 159, 245, .24);--tmo-order-btn-border: rgba(97, 159, 245, .7);--tmo-order-btn-hover-border: #619ff5;--tmo-button-text-color: var(--tmo-order-btn-border);--tmo-order-btn-color: var(--tmo-order-btn-border)}.tmo-theme-dark .tmo-order-button:hover{background:var(--tmo-order-btn-hover-bg);border-color:var(--tmo-order-btn-hover-border)}.tmo-theme-light{--tmo-modal-bg: #f8fafc;--tmo-text-main: #0f172a;--tmo-text-muted: #475569;--tmo-text-secondary: #0f172a;--tmo-border-soft: rgba(148, 163, 184, .55);--tmo-border-card: rgba(15, 23, 42, .12);--tmo-accent: #15803d;--tmo-focus: #2563eb;--tmo-overlay: rgba(15, 23, 42, .42);--tmo-control-bg: #ffffff;--tmo-dropdown-bg: #ffffff;--tmo-card-bg: rgba(255, 255, 255, .92);--tmo-queue-card-bg: #f8fafc;--tmo-cover-bg: #cbd5e1;--tmo-play-bg: rgba(248, 250, 252, .78);--tmo-time-bg: rgba(15, 23, 42, .8);--tmo-close-border: rgba(15, 23, 42, .22);--tmo-close-bg: rgba(255, 255, 255, .9);--tmo-track-label-bg: rgba(15, 23, 42, .06);--tmo-title-color: #0f172a;--tmo-text-muted-color: #475569;--tmo-input-bg: #ffffff;--tmo-input-color: #0f172a;--tmo-input-placeholder-color: #64748b;--tmo-label-color: #0f172a;--tmo-empty-state-color: #475569;--tmo-button-text-color: #ffffff;--tmo-button-bg-hover: #020617}.tmo-theme-light .tmo-modal{background:#f4f3f3}.tmo-theme-light .tmo-play-button{background:#0f172ae6;color:#fff}.tmo-theme-light .tmo-order-button{--tmo-order-btn-bg: #0f172a;--tmo-order-btn-hover-bg: #020617;--tmo-order-btn-border: #0f172a;--tmo-order-btn-hover-border: #020617;--tmo-order-btn-color: #ffffff}.tmo-theme-light .tmo-order-button:hover{background:var(--tmo-order-btn-hover-bg);border-color:var(--tmo-order-btn-hover-border)}.tmo-theme-light .tmo-track-cover-duration{color:#fff}.tmo-theme-light .tmo-track-label-ai{border-color:#22c55e;color:#16a34a}.tmo-theme-light .tmo-track-label-instrumental{border-color:#3b82f6;color:#2563eb}.tmo-open-button{border:var(--tmo-open-btn-border);border-radius:var(--tmo-open-btn-radius);padding:var(--tmo-open-btn-padding);cursor:pointer;background:var(--tmo-open-btn-bg);color:var(--tmo-open-btn-color);font-size:var(--tmo-open-btn-font-size);font-weight:var(--tmo-open-btn-font-weight)}.tmo-orders-queue-list{list-style:none;margin:0;padding:0;display:grid;gap:var(--tmo-track-list-gap);max-height:var(--tmo-queue-list-max-height);overflow-y:auto;overflow-x:hidden}.tmo-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:2147483000;background:var(--tmo-overlay);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);display:flex;align-items:stretch;justify-content:stretch;padding:0}@media (min-width: 980px){.tmo-overlay{align-items:center;justify-content:center;padding:16px}}.tmo-modal{width:100vw;height:100dvh;max-height:100dvh;overflow:hidden;border-radius:0;border:none;background:var(--tmo-modal-gradient),var(--tmo-modal-bg);padding:14px;display:flex;flex-direction:column;color:var(--tmo-text-secondary)}@media (min-width: 980px){.tmo-modal{width:min(960px,100%);height:90vh;max-height:90vh;border-radius:12px;border:1px solid var(--tmo-border-soft);padding:18px}}.tmo-modal-header{display:flex;align-items:center;justify-content:space-between}.tmo-modal-header h3{margin:0;font-size:var(--tmo-modal-title-size);font-weight:var(--tmo-modal-title-weight);line-height:1.2;color:var(--tmo-title-color, var(--tmo-text-main))}.tmo-grid{margin-top:12px;display:grid;gap:10px;grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}@media (min-width: 980px){.tmo-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}.tmo-catalog-body{margin-top:10px;min-height:0;flex:1;overflow:auto}.tmo-field{position:relative;min-width:0}.tmo-filter-label{display:block;margin-bottom:6px;font-size:12px;line-height:1.2;color:var(--tmo-label-color, var(--tmo-text-secondary))}.tmo-control{box-sizing:border-box;display:block;width:100%;height:var(--tmo-control-height);border:1px solid rgba(148,163,184,.28);border-radius:var(--tmo-control-radius);padding:8px 12px;background:var(--tmo-input-bg, var(--tmo-control-bg));color:var(--tmo-input-color, var(--tmo-text-secondary))}.tmo-control:focus{outline:none;border-color:var(--tmo-focus);box-shadow:0 0 0 2px #3b82f659}.tmo-control::placeholder{color:var(--tmo-input-placeholder-color, var(--tmo-text-muted-color, var(--tmo-text-muted)));opacity:1}.tmo-select-trigger{display:flex;align-items:center;justify-content:space-between;cursor:pointer}.tmo-select-trigger-open{border-color:var(--tmo-focus)}.tmo-select-trigger-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tmo-select-chevron{color:var(--tmo-text-muted-color, var(--tmo-text-muted));transform:rotate(180deg);transition:transform .15s ease}.tmo-select-chevron-open{transform:rotate(0)}.tmo-select-dropdown{position:absolute;top:calc(100% + 6px);left:0;right:0;z-index:20;border:1px solid rgba(148,163,184,.25);border-radius:var(--tmo-control-radius);background:var(--tmo-dropdown-bg);box-shadow:0 16px 36px #00000059;max-height:260px;overflow:auto;padding:4px}.tmo-select-search{margin-bottom:4px}.tmo-select-option{width:100%;border:none;background:transparent;color:var(--tmo-text-secondary);border-radius:var(--tmo-control-radius);padding:10px 12px;display:flex;align-items:center;justify-content:space-between;cursor:pointer}.tmo-select-option:hover{background:#94a3b81f}.tmo-select-option-active{background:#94a3b829}.tmo-select-option-main{display:inline-flex;align-items:center;gap:8px}.tmo-select-option-flag{width:18px;text-align:center}.tmo-select-option-code{color:#64748b;font-size:12px}.tmo-track-list{list-style:none;margin:0;padding:0;display:grid;gap:var(--tmo-track-list-gap)}.tmo-track-item{border:none;border-radius:0;padding:var(--tmo-track-item-padding);display:flex;align-items:flex-start;gap:var(--tmo-track-item-gap);background:var(--tmo-card-bg)}.tmo-track-item:focus-visible{outline:2px solid rgba(59,130,246,.55);outline-offset:1px}.tmo-track-item.tmo-queue-track-item{background:var(--tmo-queue-card-bg)}.tmo-track-item-leaving{opacity:0;transform:translateY(-6px) scale(.995);transition:opacity .28s ease,transform .28s ease;pointer-events:none}.tmo-track-meta{min-width:0;flex:1;display:flex;flex-direction:column;justify-content:center;align-self:center}.tmo-track-title{font-weight:var(--tmo-track-title-weight);color:var(--tmo-text-main);font-size:var(--tmo-track-title-size);line-height:var(--tmo-track-title-line-height);margin-bottom:var(--tmo-track-title-margin-bottom)}.tmo-track-sub{color:var(--tmo-text-muted-color, var(--tmo-text-muted));font-size:var(--tmo-track-sub-size);line-height:var(--tmo-track-sub-line-height);margin-bottom:var(--tmo-track-sub-margin-bottom)}.tmo-track-labels{display:flex;gap:var(--tmo-track-label-gap);flex-wrap:wrap}.tmo-track-label{display:inline-flex;align-items:center;border-radius:var(--tmo-track-label-radius);border:1px solid rgba(148,163,184,.35);padding:var(--tmo-track-label-padding);font-size:var(--tmo-track-label-size);line-height:var(--tmo-track-label-line-height);color:var(--tmo-text-secondary);background:var(--tmo-track-label-bg)}.tmo-track-label-ai{border-color:#2ecc71;color:#2ecc71;text-transform:uppercase;background:transparent}.tmo-track-label-instrumental{border-color:#3b82f6;color:#3b82f6;background:transparent}.tmo-track-label-genre{border-color:transparent;background:#94a3b829}.tmo-track-duration{display:none}.tmo-track-cover-wrap{width:var(--tmo-cover-size);height:var(--tmo-cover-size);flex-shrink:0;position:relative}.tmo-track-cover,.tmo-track-cover-placeholder{width:var(--tmo-cover-size);height:var(--tmo-cover-size);border-radius:var(--tmo-cover-radius);display:block;object-fit:cover;background:var(--tmo-cover-bg)}.tmo-play-button{position:absolute;top:0;right:0;bottom:0;left:0;margin:auto;width:var(--tmo-play-size);height:var(--tmo-play-size);border:none;border-radius:999px;padding:0;background:var(--tmo-play-bg);color:#dcfce7;cursor:pointer;font-size:var(--tmo-play-font-size);line-height:1;display:flex;align-items:center;justify-content:center;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.tmo-track-cover-duration{position:absolute;right:1px;bottom:1px;border-radius:var(--tmo-time-radius);background:var(--tmo-time-bg);color:var(--tmo-text-secondary);font-size:var(--tmo-time-font-size);font-weight:500;line-height:1;padding:var(--tmo-time-padding);font-variant-numeric:tabular-nums}.tmo-order-button,.tmo-close-button{border:1px solid var(--tmo-order-btn-border);border-radius:10px;padding:var(--tmo-order-btn-padding);background:var(--tmo-order-btn-bg);color:var(--tmo-button-text-color, var(--tmo-order-btn-color));cursor:pointer}.tmo-order-button{align-self:center;margin-right:var(--tmo-order-btn-margin-right);border-radius:var(--tmo-order-btn-radius);font-weight:var(--tmo-order-btn-font-weight)}.tmo-order-button:hover{background:var(--tmo-button-bg-hover, var(--tmo-order-btn-hover-bg));border-color:var(--tmo-order-btn-hover-border)}.tmo-close-button{width:36px;height:36px;border-radius:999px;border-color:var(--tmo-close-border);background:var(--tmo-close-bg);color:var(--tmo-text-secondary);padding:0;display:inline-flex;align-items:center;justify-content:center}.tmo-close-icon{display:block;font-size:20px;line-height:1}.tmo-catalog-placeholder{min-height:100%;display:flex;align-items:center;justify-content:center}.tmo-empty-state{width:100%;min-height:100%;justify-content:center;flex-direction:column;gap:10px;text-align:center}.tmo-empty-state-icon{width:56px;height:56px;border-radius:999px;border:1px solid rgba(97,159,245,.45);background:#619ff51a;color:#619ff5;font-size:28px;display:inline-flex;align-items:center;justify-content:center}.tmo-empty-state-title{color:var(--tmo-empty-state-color, var(--tmo-text-main));font-size:22px;font-weight:600}.tmo-empty-state-subtitle{color:var(--tmo-empty-state-color, var(--tmo-text-muted-color, var(--tmo-text-muted)));font-size:15px}.tmo-order-success-screen{min-height:420px;flex:1;display:grid;place-items:center;align-content:center;gap:10px;text-align:center}.tmo-order-success-icon{width:64px;height:64px;border-radius:999px;border:1px solid rgba(97,159,245,.65);background:#619ff524;color:#619ff5;font-size:30px;display:inline-flex;align-items:center;justify-content:center}.tmo-order-success-title{color:var(--tmo-text-main);font-size:var(--tmo-modal-title-size);font-weight:var(--tmo-modal-title-weight)}.tmo-order-success-subtitle{color:var(--tmo-text-muted);font-size:16px;max-width:500px}.tmo-track-item-skeleton{pointer-events:none}.tmo-skeleton{position:relative;overflow:hidden;border-radius:4px;background:#94a3b829}.tmo-skeleton:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;transform:translate(-100%);background:linear-gradient(90deg,transparent,rgba(226,232,240,.2),transparent);animation:tmo-skeleton-shimmer 1.2s infinite}.tmo-skeleton-cover{width:var(--tmo-cover-size);height:var(--tmo-cover-size);border-radius:var(--tmo-cover-radius)}.tmo-skeleton-title{width:min(340px,70%);height:16px;margin-bottom:6px}.tmo-skeleton-sub{width:min(260px,55%);height:14px;margin-bottom:6px}.tmo-skeleton-label{width:44px;height:20px;border-radius:4px}.tmo-skeleton-order{align-self:center;margin-left:auto;width:96px;height:34px;border-radius:4px}.tmo-catalog-more{padding:6px 0 2px}.tmo-skeleton-more{width:140px;height:14px;margin:0 auto}@keyframes tmo-skeleton-shimmer{to{transform:translate(100%)}}.tmo-status{margin-top:8px;padding:8px;border-radius:8px}.tmo-status-error{color:#7f1d1d;background:#fee2e2}.tmo-status-success{color:#14532d;background:#dcfce7}
