.sync-modal[hidden]{display:none}.sync-modal{position:fixed;inset:0;z-index:1200;display:grid;place-items:center;padding:20px}.sync-modal__backdrop{position:absolute;inset:0;border:0;background:rgba(0,0,0,.72);backdrop-filter:blur(8px)}.sync-modal__panel{position:relative;width:min(560px,100%);max-height:min(760px,92vh);overflow:auto;border:1px solid rgba(255,255,255,.12);border-radius:24px;background:#0d1014;padding:24px;box-shadow:0 24px 80px rgba(0,0,0,.45)}.sync-modal__head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:20px}.sync-modal__head p{margin:0 0 5px;color:#8f98a5;font-size:12px;text-transform:uppercase;letter-spacing:.1em}.sync-modal__head h2{margin:0;font-size:26px}.sync-modal__close{border:0;background:transparent;color:#fff;font-size:30px;line-height:1;cursor:pointer}.sync-status{margin:0 0 18px;padding:12px 14px;border-radius:14px;background:rgba(255,255,255,.06);color:#c8ced6;font-size:14px}.sync-status[data-state=ok]{color:#d8f7df}.sync-status[data-state=error]{color:#ffd0d0}.sync-box{padding:18px 0;border-top:1px solid rgba(255,255,255,.09)}.sync-box:first-of-type{border-top:0}.sync-box h3{margin:0 0 8px;font-size:18px}.sync-box p{margin:0 0 14px;color:#9aa3ad;line-height:1.45}.sync-primary{width:100%;border:0;border-radius:14px;padding:13px 18px;background:#fff;color:#090b0e;font-weight:700;cursor:pointer}.sync-primary:disabled{opacity:.55;cursor:wait}.sync-code{display:block;margin:16px auto 10px;text-align:center;font-size:42px;font-weight:800;letter-spacing:.18em;font-variant-numeric:tabular-nums}.sync-qr{display:block;width:220px;height:220px;margin:12px auto;border-radius:14px;background:#fff}.sync-code-note{text-align:center!important;font-size:13px}.sync-join{display:flex;gap:10px}.sync-join input{min-width:0;flex:1;border:1px solid rgba(255,255,255,.14);border-radius:14px;background:#15191e;color:#fff;padding:13px 15px;font:inherit;font-size:20px;letter-spacing:.18em;text-align:center}.sync-join button{border:1px solid rgba(132,197,153,.62);border-radius:14px;padding:0 18px;background:#4f8d64;color:#fff;font-weight:700;cursor:pointer;touch-action:manipulation;transition:background-color .16s ease,border-color .16s ease,opacity .16s ease}.sync-join button:hover,.sync-join button:focus-visible{border-color:#96cda8;background:#5b9e72}.sync-join button:disabled,.sync-join button[aria-disabled=true]{border-color:rgba(255,255,255,.12);background:#343a40;color:#8f98a5;cursor:wait;opacity:.72}.library-drawer nav [data-sync-open]{margin-left:auto}@media(max-width:640px){.sync-modal{padding:10px;place-items:end center}.sync-modal__panel{border-radius:22px 22px 0 0;padding:20px;max-height:88vh}.sync-modal__head h2{font-size:22px}.sync-code{font-size:36px}.sync-join{flex-direction:column}.sync-join button{padding:13px 18px}}
.library-drawer__panel>nav .library-sync-button{margin-left:auto;border-color:rgba(102,171,126,.48);background:rgba(58,112,77,.28);color:#cfe8d7;box-shadow:inset 0 0 0 1px rgba(132,197,153,.05)}.library-drawer__panel>nav .library-sync-button:hover,.library-drawer__panel>nav .library-sync-button:focus-visible{border-color:rgba(132,197,153,.72);background:rgba(66,130,88,.42);color:#effaf2}.library-drawer__panel>nav .library-sync-button.is-active{background:#5f9f74;color:#07100a;border-color:#72ae86}@media(max-width:640px){.library-drawer__panel>nav{flex-wrap:wrap}.library-drawer__panel>nav .library-sync-button{margin-left:0}}