.jui-preview-sidebar,.jui-preview-sidebar-preview{--ps-bg:#f5f4f3;--ps-ink:#242424;--ps-line:rgb(36 36 36/.2);--ps-accent:#0ea5e9;color:var(--ps-ink);font-family:inherit}.jui-preview-sidebar-preview[data-theme=dark],.jui-preview-sidebar[data-theme=dark]{--ps-bg:#202020;--ps-ink:#eee;--ps-line:#505050;--ps-accent:#38bdf8}.jui-preview-sidebar{position:relative;width:min(100%,var(--ps-width));height:var(--ps-height);isolation:isolate;overflow:hidden}.jui-preview-sidebar *{box-sizing:border-box}.jui-preview-sidebar-panel{position:absolute;inset:16px 8px;border-radius:24px;background:var(--ps-bg);overflow:hidden}.jui-preview-sidebar-toggle{position:absolute;z-index:3;left:8px;top:35.5px;display:grid;place-items:center;width:42px;height:42px;padding:0;border:0;border-radius:12px;background:var(--ps-bg);color:var(--ps-ink);cursor:pointer}.jui-preview-sidebar-scroll{position:relative;height:100%;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:none}.jui-preview-sidebar-scroll::-webkit-scrollbar{display:none}.jui-preview-sidebar-nav{display:flex;flex-direction:column;gap:8px;padding:calc(var(--ps-height) * .32) 0 calc(var(--ps-height) * .15) 12px}.jui-preview-sidebar-sort{display:flex;align-items:center;gap:12px;margin:0 0 40px;padding:0;border:0;background:none;color:inherit;font:inherit;font-size:15px;cursor:pointer}.jui-preview-sidebar-group-label{display:flex;align-items:center;gap:12px;height:1px;font-size:15px;opacity:1;white-space:nowrap}.jui-preview-sidebar-group-label>span{height:1px;width:32px;background:currentColor;flex:none}.jui-preview-sidebar-tick{display:block;flex:none;height:1px;width:32px;background:var(--ps-line)}.jui-preview-sidebar-item{position:relative;display:flex;align-items:center;gap:12px;width:100%;height:1px;min-height:1px;flex:none;margin:0;padding:0;border:0;background:none;text-decoration:none;color:inherit;font:inherit;font-size:15px;letter-spacing:-.02em;text-align:left;cursor:pointer}.jui-preview-sidebar-line{display:block;flex:none;height:1px;background:var(--ps-line)}.jui-preview-sidebar-item-label{display:block;opacity:.4;white-space:nowrap;transition:color .15s,opacity .15s}.jui-preview-sidebar-item:focus-visible .jui-preview-sidebar-item-label,.jui-preview-sidebar-item:hover .jui-preview-sidebar-item-label,.jui-preview-sidebar-item[aria-current=page] .jui-preview-sidebar-item-label{opacity:1;color:var(--ps-accent)}.jui-preview-sidebar-item:focus-visible .jui-preview-sidebar-line,.jui-preview-sidebar-item:hover .jui-preview-sidebar-line,.jui-preview-sidebar-item[aria-current=page] .jui-preview-sidebar-line{background:var(--ps-accent)}.jui-preview-sidebar-number{margin-right:7px;font-variant-numeric:tabular-nums}.jui-preview-sidebar-item sup{font-size:9px;margin-left:4px;color:var(--ps-accent)}.jui-preview-sidebar a:focus-visible,.jui-preview-sidebar button:focus-visible{outline:2px solid var(--ps-accent);outline-offset:-2px;border-radius:4px}.jui-preview-sidebar-fade{position:absolute;z-index:2;left:0;right:0;height:136px;pointer-events:none;backdrop-filter:blur(6px)}.jui-preview-sidebar-fade-top{top:0;background:linear-gradient(var(--ps-bg) 25%,transparent);mask-image:linear-gradient(#000,transparent)}.jui-preview-sidebar-fade-bottom{bottom:0;background:linear-gradient(0deg,var(--ps-bg) 25%,transparent);mask-image:linear-gradient(0deg,#000,transparent)}.jui-preview-sidebar-preview{position:fixed;top:0;left:0;z-index:1200;pointer-events:none;width:208px;height:117px;overflow:hidden;border-radius:12px;border:1px solid var(--ps-line);background:var(--ps-bg);box-shadow:0 12px 30px #0002}.jui-preview-sidebar-preview>video{display:block;width:100%;height:100%;object-fit:cover}@media(prefers-reduced-motion:reduce){.jui-preview-sidebar-item-label{transition:none}}.jui-preview-sidebar-item:after{content:"";position:absolute;left:0;right:0;top:50%;height:27px;transform:translateY(-50%)}.jui-preview-sidebar-item:focus-visible{outline:none}.jui-preview-sidebar-item:focus-visible:after{outline:2px solid var(--ps-accent);outline-offset:-2px;border-radius:3px}.demo-preview-sidebar{display:flex;flex-direction:column;align-items:center;width:100%;max-width:360px;gap:16px}.demo-preview-sidebar-caption{min-height:16px;font-size:11px;color:var(--muted)}.demo-preview-sidebar-card{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;background:#eceddf;color:#4c5644}.demo-preview-sidebar-card[data-tone="1"]{background:#dfe7eb;color:#415974}.demo-preview-sidebar-card[data-tone="2"]{background:#eee1dc;color:#845c4b}.demo-preview-sidebar-card[data-tone="3"]{background:#e5dfec;color:#69517c}.demo-preview-sidebar-card>span{font-size:35px;line-height:1;letter-spacing:-.06em;animation:demo-preview-sidebar-float 2.4s ease-in-out infinite alternate}.demo-preview-sidebar-card>small{font-family:inherit;font-size:10px;letter-spacing:.05em}@keyframes demo-preview-sidebar-float{0%{transform:translateY(3px) rotate(-4deg)}to{transform:translateY(-3px) rotate(4deg)}}@media(prefers-reduced-motion:reduce){.demo-preview-sidebar-card>span{animation:none}}