:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--page:#fff;--ink:#1d1d1f;--muted:#6e6e73;--faint:#86868b;--accent:#0071e3;--dock-height:172px;--rail-width:128px;--rail-height:min(640px, calc(100% - var(--dock-height) - 56px));--glass:#ffffffb8;--glass-edge:#0000000f;--glass-shadow:0 12px 32px #00000014, 0 1px 3px #0000000d;--ease:cubic-bezier(.2, .8, .2, 1);-webkit-font-smoothing:antialiased;font-family:-apple-system,BlinkMacSystemFont,SF Pro Text,PingFang SC,Helvetica Neue,Helvetica,Arial,sans-serif}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--page);color:var(--ink);overflow:hidden}button,input{font:inherit}.visually-hidden{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.app{background:var(--page);width:100vw;height:100dvh;position:relative;overflow:clip}.stage{inset:0 0 var(--dock-height) 0;position:absolute}.duo-canvas{touch-action:none;cursor:grab;-webkit-tap-highlight-color:transparent;outline:none;width:100%;height:100%;display:block}.duo-canvas:active{cursor:grabbing}.rail{z-index:2;top:calc((100% - var(--dock-height)) / 2);width:var(--rail-width);height:var(--rail-height);flex-direction:column;align-items:center;gap:12px;display:flex;position:absolute;transform:translateY(-50%)}.rail-left{left:clamp(20px,3vw,48px)}.rail-right{right:clamp(20px,3vw,48px)}.rail-title{color:var(--faint);letter-spacing:.12em;font-size:11px;font-weight:600}.rail-list{scrollbar-width:none;flex-direction:column;flex:1;justify-content:safe center;align-items:center;gap:16px;width:100%;min-height:0;padding:8px 0 18px;display:flex;overflow-y:auto;-webkit-mask-image:linear-gradient(#0000 0,#000 10px calc(100% - 22px),#0000 100%);mask-image:linear-gradient(#0000 0,#000 10px calc(100% - 22px),#0000 100%)}.rail-list::-webkit-scrollbar{display:none}.rail-card{color:var(--muted);cursor:pointer;-webkit-tap-highlight-color:transparent;background:0 0;border:0;flex-direction:column;flex:none;align-items:center;gap:7px;padding:0;display:flex;position:relative}.rail-thumb{aspect-ratio:16/9;width:112px;transition:transform .35s var(--ease), box-shadow .35s var(--ease);background:#ece9e4 50%/contain no-repeat;border-radius:12px;display:block;position:relative;box-shadow:0 0 0 .5px #00000014,0 4px 12px #00000014}.rail-card:hover .rail-thumb{transform:translateY(-2px);box-shadow:0 0 0 .5px #00000014,0 10px 22px #0000001f}.rail-card.is-active .rail-thumb{box-shadow:0 0 0 2px var(--page), 0 0 0 4px var(--accent), 0 10px 24px #0071e333}.rail-card:focus-visible{outline:none}.rail-card:focus-visible .rail-thumb{box-shadow:0 0 0 2px var(--page), 0 0 0 4px var(--accent)}.rail-card:has(input:focus-visible) .rail-thumb{box-shadow:0 0 0 2px var(--page), 0 0 0 4px var(--accent)}.rail-thumb.is-import{box-shadow:none;color:var(--muted);background:#f5f5f7;border:1px dashed #0000002e;place-items:center;display:grid}.rail-badge{color:#fff;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#00000052;border-radius:50%;place-items:center;width:18px;height:18px;display:grid;position:absolute;bottom:5px;right:5px;box-shadow:inset 0 0 0 .5px #ffffff59}.rail-label{max-width:var(--rail-width);text-overflow:ellipsis;white-space:nowrap;font-size:11px;line-height:1.25;transition:color .25s;overflow:hidden}.rail-card.is-active .rail-label{color:var(--ink);font-weight:600}.toast{z-index:4;background:var(--glass);box-shadow:var(--glass-shadow), inset 0 0 0 .5px var(--glass-edge);color:var(--ink);opacity:0;pointer-events:none;transition:opacity .3s ease, transform .3s var(--ease);-webkit-backdrop-filter:blur(24px)saturate(180%);backdrop-filter:blur(24px)saturate(180%);border-radius:18px;padding:9px 16px;font-size:12px;position:absolute;top:20px;left:50%;transform:translate(-50%,-6px)}.toast.is-visible{opacity:1;transform:translate(-50%)}.dock{height:var(--dock-height);flex-direction:column;justify-content:center;align-items:center;gap:26px;padding-bottom:18px;display:flex;position:absolute;bottom:0;left:0;right:0}.control-bar{background:var(--glass);height:46px;box-shadow:var(--glass-shadow), inset 0 0 0 .5px var(--glass-edge);-webkit-backdrop-filter:blur(24px)saturate(180%);backdrop-filter:blur(24px)saturate(180%);border-radius:23px;align-items:center;gap:8px;padding:5px;display:flex}.segmented{background:#7676801f;border-radius:18px;gap:2px;padding:3px;display:flex}.segmented button{height:30px;color:var(--muted);cursor:pointer;background:0 0;border:0;border-radius:15px;align-items:center;gap:6px;padding:0 13px 0 10px;font-size:12px;font-weight:500;transition:background .25s,color .25s,box-shadow .25s;display:flex}.segmented button:hover{color:var(--ink)}.segmented button[aria-pressed=true]{color:var(--ink);background:#fff;box-shadow:0 1px 3px #0000001f,0 0 0 .5px #0000000a}.media-group{align-items:center;gap:6px;padding-right:4px;display:flex}.control-divider{background:#00000014;width:1px;height:22px;margin:0 4px}.icon-button{width:34px;height:34px;color:var(--ink);cursor:pointer;transition:background .2s ease, transform .2s var(--ease);background:0 0;border:0;border-radius:50%;place-items:center;padding:0;display:grid}.icon-button:hover{background:#0000000d}.icon-button:active{transform:scale(.92)}.icon-button.is-primary{background:var(--ink);color:#fff}.icon-button.is-primary:hover{background:#3a3a3c}.segmented button:focus-visible,.icon-button:focus-visible,.scrubber:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.control-time{min-width:32px;color:var(--muted);font-variant-numeric:tabular-nums;text-align:center;font-size:11px}.scrubber{cursor:pointer;appearance:none;background:0 0;width:150px;height:20px;margin:0}.scrubber::-webkit-slider-runnable-track{background:linear-gradient(to right, var(--ink) var(--progress), #0000001f var(--progress));border-radius:2px;height:4px}.scrubber::-webkit-slider-thumb{appearance:none;background:#fff;border-radius:50%;width:14px;height:14px;margin-top:-5px;box-shadow:0 1px 4px #00000040,0 0 0 .5px #00000014}.scrubber::-moz-range-track{background:#0000001f;border-radius:2px;height:4px}.scrubber::-moz-range-progress{background:var(--ink);border-radius:2px;height:4px}.scrubber::-moz-range-thumb{background:#fff;border:0;border-radius:50%;width:14px;height:14px;box-shadow:0 1px 4px #00000040}.detent{width:min(340px,100vw - 48px);transition:opacity .4s;position:relative}.detent.is-disabled{opacity:.4}.detent-input{opacity:0;pointer-events:none;width:1px;height:1px;position:absolute}.detent-track{cursor:pointer;touch-action:none;-webkit-user-select:none;user-select:none;background:#d2d2d7;border-radius:28px;height:17px;position:relative;box-shadow:inset 0 0 0 .5px #0000001a}.detent-thumb{color:#fff;cursor:grab;will-change:transform, width;background:#06c;border-radius:22px;place-items:center;width:60px;height:40px;display:grid;position:absolute;top:-11.5px;left:0;transform:translate(calc(min(340px,100vw - 48px)/3 - 20px));box-shadow:0 2px 7px #00000059,inset 0 0 0 .5px #0000001a}.detent-track:active .detent-thumb{cursor:grabbing}.detent:has(.detent-input:focus-visible) .detent-thumb{outline:2px solid var(--accent);outline-offset:4px}.loader{z-index:5;background:var(--page);place-items:center;transition:opacity .5s .1s,visibility 0s linear .6s;display:grid;position:absolute;inset:0}.loader.is-done{opacity:0;visibility:hidden;pointer-events:none}.loader-progress{background:#86868b66;border-radius:4px;width:140px;height:8px;position:relative;overflow:hidden}.loader-progress span{background:#000;border-radius:4px;transition:transform .5s ease-out;position:absolute;inset:0}@media (width<=760px){:root{--dock-height:300px;--rail-width:auto}.rail{flex-direction:row;height:auto;top:auto;left:12px;right:12px;transform:none}.rail-left{bottom:calc(var(--dock-height) - 118px)}.rail-right{bottom:calc(var(--dock-height) - 216px)}.rail-title{display:none}.rail-list{flex-direction:row;justify-content:flex-start;gap:12px;padding:6px 4px;overflow:auto hidden;-webkit-mask-image:linear-gradient(90deg,#0000 0,#000 10px calc(100% - 18px),#0000 100%);mask-image:linear-gradient(90deg,#0000 0,#000 10px calc(100% - 18px),#0000 100%)}.rail-thumb{border-radius:9px;width:88px}.rail-label{max-width:92px;font-size:10px}.dock{justify-content:flex-end;gap:18px}.segmented button span{display:none}.scrubber{width:70px}}@media (prefers-reduced-motion:reduce){.rail-thumb,.toast,.segmented button,.icon-button,.loader,.loader-progress span{transition:none}}
