/* CompX Orbit — Step 4/5: visual library and preview workflows */
#panel-sfx{min-height:0;overflow:hidden!important;background:var(--orbit-shell)!important}
.orbit-library-header{min-height:55px;padding:9px 12px;display:flex;align-items:center;gap:10px;flex:0 0 auto;background:var(--orbit-panel);border-bottom:1px solid var(--orbit-line)}
.orbit-library-header>div:first-child{min-width:0;flex:1}.orbit-library-header span{display:block;margin-bottom:3px;color:var(--orbit-violet);font:700 7px var(--mono);letter-spacing:.12em}.orbit-library-header strong{display:block;overflow:hidden;color:var(--orbit-text);font-size:12px;font-weight:720;text-overflow:ellipsis;white-space:nowrap}.orbit-library-status{padding:6px 8px;display:inline-flex;align-items:center;gap:5px;color:var(--orbit-muted);background:#0b0e14;border:1px solid var(--orbit-line);border-radius:6px;font:700 7px var(--mono);white-space:nowrap}.orbit-library-status i{width:5px;height:5px;border-radius:50%;background:var(--orbit-success)}
#panel-sfx .asset-type-row{min-height:54px;margin:0;padding:6px 8px;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:4px;flex:0 0 auto;background:#090c12;border:0;border-bottom:1px solid var(--orbit-line);border-radius:0}
#panel-sfx .shelf{min-width:0;min-height:41px;padding:5px 3px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;color:var(--orbit-faint);background:transparent;border:1px solid transparent;border-radius:7px;font-size:8px;font-weight:700}
#panel-sfx .shelf b{color:currentColor;font:800 9px var(--mono)}#panel-sfx .shelf span{max-width:100%;margin:0;overflow:hidden;color:currentColor;font:700 7px var(--sans);text-overflow:ellipsis;white-space:nowrap}#panel-sfx .shelf:hover{color:var(--orbit-muted);background:var(--orbit-panel);border-color:var(--orbit-line)}
#panel-sfx .shelf.active{color:var(--orbit-blue)!important;background:var(--orbit-blue-soft)!important;border-color:#356b9e!important;box-shadow:inset 0 -2px var(--orbit-blue)!important}
#panel-sfx .shelf[data-type="expressions"].active,#panel-sfx .shelf[data-type="textanim"].active,#panel-sfx .shelf[data-type="shake"].active,#panel-sfx .shelf[data-type="ffx"].active{color:var(--orbit-violet)!important;background:var(--orbit-violet-soft)!important;border-color:#654b91!important;box-shadow:inset 0 -2px var(--orbit-violet)!important}
#sfxMogrtView{min-height:0;padding:9px;gap:7px;background:var(--orbit-shell)}#sfxMogrtView>.search-row{margin:0}#sfxMogrtView>.search-row input{min-height:37px;padding:0 11px!important;border-radius:8px!important;font-size:10px!important}
#sfxMogrtView>.actions-row,#sfxMogrtView>.library-data-row,#sfxMogrtView>.tabs-row{margin:0;padding:0;gap:5px}#sfxMogrtView>.actions-row .btn,#sfxMogrtView>.library-data-row .btn{min-height:30px;padding:5px 8px;border-radius:6px;font-size:8px}#sfxMogrtView>.library-data-row{padding:6px;background:var(--orbit-panel);border:1px solid var(--orbit-line);border-radius:8px}#sfxMogrtView .library-data-status{min-height:28px;border-color:var(--orbit-line);background:#0b0e14;color:var(--orbit-faint);border-radius:5px;font-size:7px}
#sfxMogrtView>.tabs-row{min-height:35px;padding:3px;background:#090c12;border:1px solid var(--orbit-line);border-radius:7px}#sfxMogrtView .tab{min-height:27px;flex:1;border-radius:5px;font-size:8px}
#sfxMogrtView .main-layout{min-height:0;flex:1;overflow:hidden;background:var(--orbit-panel);border:1px solid var(--orbit-line);border-radius:10px}#sfxMogrtView .sidebar{width:155px;min-width:130px;background:#0b0e14;border-right:1px solid var(--orbit-line)}#sfxMogrtView .sidebar-header,#sfxMogrtView .toolbar{border-bottom-color:var(--orbit-line);background:#0d1118}#sfxMogrtView .content-view{min-width:0;background:var(--orbit-shell)!important}#sfxMogrtView .toolbar{min-height:38px;padding:5px 7px}
#sfxMogrtView .select-control,#sfxMogrtView .btn-collapse{min-height:27px;border-color:var(--orbit-line)!important;background:var(--orbit-panel)!important;color:var(--orbit-muted)!important;border-radius:5px!important;font-size:8px}
#sfxMogrtView .library.grid{grid-template-columns:repeat(auto-fill,minmax(var(--card-min-w,165px),1fr));gap:8px;padding:8px;align-content:start}#sfxMogrtView .sfx-card{min-width:0;overflow:hidden;background:var(--orbit-panel)!important;border:1px solid var(--orbit-line)!important;border-radius:9px!important;box-shadow:none!important;transform:none!important}#sfxMogrtView .sfx-card:hover,#sfxMogrtView .sfx-card.selected{background:var(--orbit-raised)!important;border-color:#3b72a5!important;box-shadow:0 0 0 1px rgba(77,163,255,.1)!important}
#sfxMogrtView .sfx-card .waveform-area{height:90px;min-height:90px;background:#090c12!important;border-bottom:1px solid var(--orbit-line)}#sfxMogrtView .sfx-card .meta-area{padding:8px 8px 5px}#sfxMogrtView .sfx-card .meta-title{color:var(--orbit-text);font-size:10px;font-weight:720}#sfxMogrtView .sfx-card .meta-sub{margin-top:3px;color:var(--orbit-faint);font:7px var(--mono)}#sfxMogrtView .sfx-card .actions-area{gap:5px;padding:0 7px 7px}#sfxMogrtView .sfx-card .actions-area button{min-height:28px;color:var(--orbit-muted);background:#0d1118;border:1px solid var(--orbit-line);border-radius:5px;font-size:8px}#sfxMogrtView .sfx-card .actions-area button[data-action="insert"]{color:var(--orbit-blue);background:var(--orbit-blue-soft);border-color:#356b9e}
#sfxMogrtView .empty-state{min-height:220px;display:grid;place-items:center;align-content:center;gap:8px;color:var(--orbit-muted);background:#0b0e14;border:1px dashed var(--orbit-line-strong);border-radius:9px;font-size:10px;line-height:1.55;text-align:center}#sfxMogrtView .empty-state .big{color:var(--orbit-blue);filter:saturate(.6)}#sfxMogrtView .transport{margin:0;padding:8px;background:var(--orbit-panel);border:1px solid var(--orbit-line);border-radius:9px}
#textAnimView,#ffxPresetView{min-height:0;flex:1 1 0;overflow-y:auto;background:var(--orbit-shell)}
#textAnimView .tanim-section,#ffxPresetView>.tool-section{margin:9px!important;padding:10px!important;background:var(--orbit-panel)!important;border:1px solid var(--orbit-line)!important;border-radius:10px!important;box-shadow:none!important}
#textAnimView .tanim-card-grid{grid-template-columns:repeat(auto-fill,minmax(180px,1fr))!important;gap:9px!important}
#textAnimView .tanim-card{min-height:145px!important;overflow:hidden!important;background:var(--orbit-panel)!important;border:1px solid var(--orbit-line)!important;border-radius:9px!important;box-shadow:none!important;transform:none!important}
#textAnimView .tanim-card:hover{background:var(--orbit-raised)!important;border-color:#654b91!important;transform:none!important}
#textAnimView .tanim-card-preview{height:72px!important;min-height:72px!important;background-color:#090c12!important;border-bottom:1px solid var(--orbit-line)!important}
#textAnimView .tanim-card-badge{color:var(--orbit-violet)!important;background:rgba(43,28,73,.88)!important;border-color:#654b91!important}

#textAnimView .tanim-card-title{color:var(--orbit-text)!important}
#textAnimView .tanim-card-sub{color:var(--orbit-faint)!important}
#textAnimView .tanim-card-btn{min-height:29px!important;color:var(--orbit-violet)!important;background:var(--orbit-violet-soft)!important;border:1px solid #654b91!important;border-radius:6px!important;box-shadow:none!important}
#textAnimView .tanim-card-btn:hover{color:#0a0612!important;background:var(--orbit-violet)!important}




@media(max-width:720px){#panel-sfx .asset-type-row{grid-template-columns:repeat(3,minmax(0,1fr))}#sfxMogrtView .sidebar{width:120px;min-width:105px}
#sfxMogrtView .library.grid,#textAnimView .tanim-card-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(max-width:440px){.orbit-library-header{min-height:50px;padding:8px 10px}.orbit-library-status{display:none}#panel-sfx .asset-type-row{min-height:50px;padding:5px;grid-template-columns:repeat(6,minmax(0,1fr));gap:2px}#panel-sfx .shelf{min-height:39px;padding:3px 1px}#panel-sfx .shelf span{display:none}#sfxMogrtView{padding:7px}#sfxMogrtView>.library-data-row{max-height:66px;overflow-y:auto}#sfxMogrtView .main-layout{min-height:250px}#sfxMogrtView .sidebar{display:none}
#sfxMogrtView .library.grid,#textAnimView .tanim-card-grid{grid-template-columns:1fr!important}}