.transition-toolbar{position:sticky;top:0;z-index:6;padding:16px 20px;display:flex;justify-content:space-between;gap:20px;align-items:center;margin:0 0 24px;background:#201b2b!important}.transition-toolbar>div:first-child{display:grid;gap:6px}.transition-toolbar span{font-size:12px;color:#bdb0cf}.transition-studio{display:grid;grid-template-columns:minmax(240px,310px) minmax(0,1fr);gap:24px;align-items:start}.transition-library{position:sticky;top:105px;overflow:hidden}.transition-library header{display:block!important}.transition-library header span{display:block;font-size:11px;color:#afa2bf;margin-top:8px}.transition-search{padding:16px;border-bottom:1px solid #40364b}.transition-search input[type=search]{width:100%}.transition-search label{display:flex;align-items:center;gap:8px;margin-top:12px}.transition-search input[type=checkbox],.transition-choice input,.transition-enabled input,.transition-playback input[type=checkbox]{width:auto;margin:0;accent-color:#c0a0f2}#transition-list{max-height:calc(100dvh - 340px);min-height:250px;overflow:auto;padding:8px;scrollbar-width:thin}.transition-choice{display:flex;align-items:center;gap:8px;padding:6px;border:1px solid transparent;border-radius:8px;margin:3px 0}.transition-choice.is-previewed{border-color:#9876ba;background:#33243f}.transition-choice>button{flex:1;min-width:0;text-align:left;border:0;color:#e5dcef;background:transparent;padding:10px;cursor:pointer}.transition-choice strong{display:block;font-size:13px;text-transform:capitalize}.transition-choice small{display:block;font-size:10px;margin-top:7px;color:#b8a9c9}.transition-choice>label{display:grid;justify-items:center;gap:5px;font-size:10px!important;padding:6px;cursor:pointer}.transition-workbench{min-width:0;display:grid;gap:22px}.transition-preview{padding-bottom:20px}.transition-preview header{display:flex;align-items:center;justify-content:space-between;gap:16px}.transition-preview header h2{text-transform:capitalize}.transition-preview header .eyebrow{font-size:10px;margin:0 0 8px;color:#bba0da}.transition-preview [aria-pressed=true]{background:#473252!important;border-color:#b18aee!important}.transition-stage{padding:24px;background:radial-gradient(ellipse at top,#3e2a53,#16131d 75%);min-height:320px;display:flex;justify-content:center;gap:14px}.transition-demo-card{width:min(100%,390px);border:1px solid #705487;border-radius:12px;overflow:hidden;background:#221b2d;box-shadow:0 14px 35px #0005}.transition-demo-card canvas{display:block;width:100%;aspect-ratio:1}.transition-demo-card>div{padding:18px;display:grid;gap:9px}.transition-demo-card strong{font-size:14px}.transition-demo-card span{font-size:11px;color:#bda9d0}.transition-stage.is-mix{align-items:start}.is-mix .transition-demo-card{flex:1;min-width:0}.is-mix .transition-demo-card>div{padding:12px}.is-mix .transition-demo-card strong{font-size:11px}.transition-playback{padding:20px 20px 0;display:flex;align-items:center;gap:14px;flex-wrap:wrap}.transition-playback label{display:flex;gap:8px;align-items:center}.transition-playback input[type=range]{width:150px}.transition-preview>p{margin:14px 22px;font-size:12px;line-height:1.6}.transition-sources{padding:0 22px;display:grid;grid-template-columns:1fr 1fr;gap:16px}.transition-sources label{min-width:0}.transition-sources select{width:100%;margin-top:8px}.transition-timing header{display:block!important}.transition-timing header span{display:block;color:#ad9fbe;font-size:12px;margin-top:8px}.transition-enabled{display:flex;gap:10px;align-items:center}.transition-timing-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:24px 0}.transition-timing-grid input{display:block;width:100%;margin-top:8px}.transition-credits{padding:18px 22px;font-size:12px;color:#b6a7c8}.transition-credits summary{cursor:pointer}.vault-transition-canvas{position:absolute;left:0;top:0;width:100%;aspect-ratio:1;z-index:4;pointer-events:none;border-radius:7px}
@media(max-width:1100px){.transition-studio{grid-template-columns:230px minmax(0,1fr)}.transition-preview header{align-items:start;flex-direction:column}.transition-timing-grid{grid-template-columns:1fr}.transition-stage{padding:14px;gap:8px}}
@media(max-width:760px){.transition-studio{grid-template-columns:1fr}.transition-library{position:static}.transition-workbench{grid-row:1}.transition-toolbar{position:static;flex-wrap:wrap}.transition-sources{grid-template-columns:1fr}#transition-list{max-height:380px}.transition-stage.is-mix{min-height:180px}.is-mix .transition-demo-card>div{padding:8px}.is-mix .transition-demo-card strong{display:none}.transition-playback{gap:10px}.transition-stage{min-height:260px}.transition-toolbar .actions{flex-wrap:wrap}}