:root{color-scheme:dark;--bg: #0a0b0d;--bg-veil: rgba(10, 11, 13, .72);--surface-1: #101216;--surface-2: #171a20;--surface-3: #1f232b;--surface-hover: #232830;--line: rgba(255, 255, 255, .07);--line-strong: rgba(255, 255, 255, .13);--text: #f0f2f5;--text-dim: #98a1b0;--text-faint: #6a7382;--accent: #c9a469;--accent-soft: rgba(201, 164, 105, .14);--accent-line: rgba(201, 164, 105, .35);--on-accent: #14161a;--live: #63c98d;--live-soft: rgba(99, 201, 141, .13);--danger: #e0655f;--danger-soft: rgba(224, 101, 95, .13);--radius-sm: 8px;--radius: 12px;--radius-lg: 18px;--radius-full: 999px;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 24px;--space-6: 32px;--space-7: 48px;--space-8: 64px;--shadow-1: 0 1px 2px rgba(0, 0, 0, .4), 0 0 0 1px var(--line);--shadow-2: 0 18px 40px -12px rgba(0, 0, 0, .75), 0 0 0 1px var(--line-strong);--font: "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--step--1: .78rem;--step-0: .875rem;--step-1: 1rem;--step-2: 1.25rem;--step-3: 1.6rem;--step-4: 2.1rem;--ease: cubic-bezier(.32, .72, 0, 1);--fast: .12s var(--ease);--medium: .22s var(--ease);--sidebar-width: 244px;--bar-height: 76px}@media (prefers-reduced-motion: reduce){:root{--fast: 1ms linear;--medium: 1ms linear}}*,*:before,*:after{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;background:var(--bg);color:var(--text);font-family:var(--font);font-size:var(--step-0);line-height:1.5;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;font-variant-numeric:tabular-nums}h1,h2,h3,h4{margin:0;font-weight:600;letter-spacing:-.015em;line-height:1.25}h1{font-size:var(--step-4);letter-spacing:-.025em}h2{font-size:var(--step-3);letter-spacing:-.02em}h3{font-size:var(--step-2)}h4{font-size:var(--step-1)}p{margin:0}ul,ol{margin:0;padding:0;list-style:none}button,input,select,textarea{font:inherit;color:inherit;font-variant-numeric:inherit}button{cursor:pointer}a{color:var(--accent);text-decoration:none}code{font-family:ui-monospace,SF Mono,Cascadia Mono,Menlo,monospace;font-size:.86em;background:var(--surface-2);border:1px solid var(--line);border-radius:var(--radius-sm);padding:1px 5px}kbd{font-family:inherit;font-size:.8em;background:var(--surface-3);border:1px solid var(--line-strong);border-bottom-width:2px;border-radius:5px;padding:1px 5px}:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:var(--radius-sm)}::selection{background:var(--accent-soft)}*{scrollbar-width:thin;scrollbar-color:var(--surface-3) transparent}*::-webkit-scrollbar{width:10px;height:10px}*::-webkit-scrollbar-track{background:transparent}*::-webkit-scrollbar-thumb{background:var(--surface-3);border:3px solid transparent;background-clip:padding-box;border-radius:var(--radius-full)}*::-webkit-scrollbar-thumb:hover{background:#2c313a;background-clip:padding-box}.eyebrow{font-size:var(--step--1);font-weight:600;letter-spacing:.09em;text-transform:uppercase;color:var(--text-faint)}.muted{color:var(--text-dim)}.faint{color:var(--text-faint)}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);height:36px;padding:0 var(--space-4);border:1px solid transparent;border-radius:var(--radius-sm);background:var(--surface-3);color:var(--text);font-size:var(--step-0);font-weight:500;white-space:nowrap;transition:background var(--fast),border-color var(--fast),color var(--fast),opacity var(--fast)}.btn:hover:not(:disabled){background:var(--surface-hover)}.btn:disabled{opacity:.45;cursor:not-allowed}.btn-primary{background:var(--accent);color:var(--on-accent);font-weight:600}.btn-primary:hover:not(:disabled){background:#d5b078}.btn-ghost{background:transparent;border-color:var(--line-strong);color:var(--text-dim)}.btn-ghost:hover:not(:disabled){background:var(--surface-2);color:var(--text)}.btn-quiet{background:transparent;color:var(--text-dim);padding:0 var(--space-2)}.btn-quiet:hover:not(:disabled){background:var(--surface-2);color:var(--text)}.btn-danger{background:transparent;border-color:#e0655f66;color:var(--danger)}.btn-danger:hover:not(:disabled){background:var(--danger-soft)}.btn-sm{height:30px;padding:0 var(--space-3);font-size:var(--step--1)}.btn-icon{width:36px;padding:0}.btn-icon.btn-sm{width:30px}.panel{background:var(--surface-1);border:1px solid var(--line);border-radius:var(--radius-lg);padding:var(--space-5)}.panel-tight{padding:var(--space-4)}.card{position:relative;display:flex;flex-direction:column;gap:var(--space-3);background:var(--surface-1);border:1px solid var(--line);border-radius:var(--radius);padding:var(--space-4);transition:border-color var(--fast),background var(--fast)}.card:hover{border-color:var(--line-strong)}.card.is-live{border-color:#63c98d59;background:linear-gradient(180deg,var(--live-soft),transparent 40%),var(--surface-1)}.card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--space-3)}.card-title{font-size:var(--step-1);font-weight:600;letter-spacing:-.01em}.card-sub{font-size:var(--step--1);color:var(--text-dim)}.grid{display:grid;gap:var(--space-4)}.grid-cards{grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}.stack{display:flex;flex-direction:column;gap:var(--space-3)}.row{display:flex;align-items:center;gap:var(--space-3)}.row-wrap{flex-wrap:wrap}.spacer{flex:1}.field{display:flex;flex-direction:column;gap:var(--space-2);min-width:0}.field>.label{font-size:var(--step--1);font-weight:500;color:var(--text-dim)}.input,.select{max-width:100%;height:36px;width:100%;padding:0 var(--space-3);background:var(--surface-2);border:1px solid var(--line);border-radius:var(--radius-sm);color:var(--text);transition:border-color var(--fast),background var(--fast)}.input::placeholder{color:var(--text-faint)}.input:hover,.select:hover{border-color:var(--line-strong)}.input:focus,.select:focus{outline:none;border-color:var(--accent-line);background:var(--surface-3)}.select{-webkit-appearance:none;-moz-appearance:none;appearance:none;padding-right:var(--space-6);background-image:linear-gradient(45deg,transparent 50%,var(--text-dim) 50%),linear-gradient(135deg,var(--text-dim) 50%,transparent 50%);background-position:calc(100% - 17px) 15px,calc(100% - 12px) 15px;background-size:5px 5px,5px 5px;background-repeat:no-repeat}.search{position:relative;display:flex;align-items:center}.search svg{position:absolute;left:var(--space-3);color:var(--text-faint);pointer-events:none}.search{min-width:0}.search .input{width:230px;padding-left:38px;min-width:0;max-width:100%}@media (max-width: 560px){.page-head .search{flex:1 1 100%}.page-head .search .input{width:100%}}.check{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-1) 0;font-size:var(--step-0);cursor:pointer}.check input{accent-color:var(--accent);width:16px;height:16px}.range{-webkit-appearance:none;-moz-appearance:none;appearance:none;height:4px;border-radius:var(--radius-full);background:var(--surface-3);accent-color:var(--accent)}.range::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:13px;height:13px;border-radius:50%;background:var(--text);border:none;cursor:pointer}.range::-moz-range-thumb{width:13px;height:13px;border-radius:50%;background:var(--text);border:none;cursor:pointer}.chip{display:inline-flex;align-items:center;gap:var(--space-1);height:22px;padding:0 var(--space-2);border-radius:var(--radius-full);background:var(--surface-3);color:var(--text-dim);font-size:var(--step--1);font-weight:500;white-space:nowrap}.chip-live{background:var(--live-soft);color:var(--live)}.chip-accent{background:var(--accent-soft);color:var(--accent)}.chip-danger{background:var(--danger-soft);color:var(--danger)}.dot{width:7px;height:7px;border-radius:50%;background:var(--text-faint);flex:none}.dot-live{background:var(--live);box-shadow:0 0 0 3px var(--live-soft)}.dot-off{background:var(--text-faint)}.dot-error{background:var(--danger);box-shadow:0 0 0 3px var(--danger-soft)}.equalizer{display:inline-flex;align-items:flex-end;gap:2px;height:12px}.equalizer span{width:2px;background:var(--live);border-radius:1px;animation:eq .9s var(--ease) infinite alternate}.equalizer span:nth-child(1){height:40%;animation-delay:-.2s}.equalizer span:nth-child(2){height:100%}.equalizer span:nth-child(3){height:65%;animation-delay:-.45s}@keyframes eq{0%{transform:scaleY(.35)}to{transform:scaleY(1)}}@media (prefers-reduced-motion: reduce){.equalizer span{animation:none}}.art{position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden;background:var(--surface-2);border-radius:var(--radius);flex:none}.art img{width:100%;height:100%;object-fit:cover;display:block}.art-fallback{background:radial-gradient(120% 100% at 30% 0%,rgba(201,164,105,.16),transparent 60%),var(--surface-2);color:var(--text-faint)}.empty{display:flex;flex-direction:column;align-items:center;gap:var(--space-3);padding:var(--space-8) var(--space-5);text-align:center;border:1px dashed var(--line-strong);border-radius:var(--radius-lg);color:var(--text-dim)}.empty-icon{display:grid;place-items:center;width:46px;height:46px;border-radius:var(--radius);background:var(--surface-2);color:var(--text-faint)}.empty h4{color:var(--text)}.empty p{max-width:46ch;font-size:var(--step-0)}.toasts{position:fixed;right:var(--space-5);bottom:calc(var(--player-height, var(--bar-height)) + var(--space-5));z-index:60;display:flex;flex-direction:column;gap:var(--space-2);max-width:min(420px,calc(100vw - var(--space-6)))}.toast{display:flex;align-items:flex-start;gap:var(--space-3);padding:var(--space-3) var(--space-4);background:var(--surface-2);border-radius:var(--radius);box-shadow:var(--shadow-2);font-size:var(--step-0);animation:toast-in .22s var(--ease)}.toast-error{border-left:3px solid var(--danger)}.toast-info{border-left:3px solid var(--accent)}.toast p{flex:1;min-width:0;overflow-wrap:anywhere}@keyframes toast-in{0%{opacity:0;transform:translateY(8px)}}@media (prefers-reduced-motion: reduce){.toast{animation:none}}.menu-rename{display:flex;gap:var(--space-2);padding:var(--space-2)}.menu-rename .input{min-width:0;flex:1}.shell{display:grid;grid-template-columns:var(--sidebar-width) 1fr;min-height:100%}.sidebar{position:sticky;top:0;height:100vh;display:flex;flex-direction:column;gap:var(--space-5);padding:var(--space-5) var(--space-3);background:var(--surface-1);border-right:1px solid var(--line)}.brand{display:flex;align-items:center;gap:var(--space-3);padding:0 var(--space-3)}.brand-mark{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:linear-gradient(150deg,var(--accent),#8d6f3f);color:var(--on-accent);flex:none}.brand-name{font-size:var(--step-1);font-weight:600;letter-spacing:-.02em}.brand-sub{font-size:var(--step--1);color:var(--text-faint);letter-spacing:.04em}.nav{display:flex;flex-direction:column;gap:2px}.nav-item{display:flex;align-items:center;gap:var(--space-3);width:100%;padding:var(--space-2) var(--space-3);border:none;border-radius:var(--radius-sm);background:transparent;color:var(--text-dim);font-size:var(--step-0);font-weight:500;text-align:left;transition:background var(--fast),color var(--fast)}.nav-item:hover{background:var(--surface-2);color:var(--text)}.nav-item.is-active{background:var(--surface-3);color:var(--text)}.nav-item.is-active:before{content:"";position:absolute;left:0;width:3px;height:18px;border-radius:0 2px 2px 0;background:var(--accent)}.nav-item{position:relative}.nav-item svg{flex:none;opacity:.85}.nav-count{margin-left:auto;font-size:var(--step--1);color:var(--text-faint)}.sidebar-foot{margin-top:auto;display:flex;flex-direction:column;gap:var(--space-2);padding:0 var(--space-3)}.status-line{display:flex;align-items:center;gap:var(--space-2);font-size:var(--step--1);color:var(--text-dim)}.status-button{width:100%;background:none;border:none;padding:2px 0;text-align:left;cursor:pointer;border-radius:var(--radius-sm)}.status-button:hover{color:var(--text)}.main{min-width:0;display:flex;flex-direction:column}.page{flex:1;width:100%;max-width:1240px;margin:0 auto;padding:var(--space-6) var(--space-6) calc(var(--player-height, var(--bar-height)) + var(--space-7))}.page-head{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--space-4);margin-bottom:var(--space-6);flex-wrap:wrap}.page-head>:first-child{min-width:0}.page-head .row{flex-wrap:wrap;min-width:0}.page-head h1{margin-bottom:var(--space-2)}.page-head p{color:var(--text-dim);max-width:68ch}.section{margin-top:var(--space-7)}.section:first-of-type{margin-top:0}.section-head{display:flex;align-items:center;gap:var(--space-3);margin-bottom:var(--space-4)}.section-head h3{font-size:var(--step-2)}.transport{position:fixed;left:var(--sidebar-width);right:0;bottom:0;z-index:40;display:flex;flex-direction:column;background:var(--bg-veil);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);border-top:1px solid var(--line)}.transport.is-hidden{display:none}.transport-bar{display:flex;align-items:center;gap:var(--space-4);height:var(--bar-height);padding:0 var(--space-5)}.stage{display:flex;align-items:center;justify-content:center;background:#000}.stage.is-audio-only{display:none}.stage-video{width:128px;height:72px;object-fit:contain;display:block}.transport-art{width:48px;height:48px;flex:none}.transport-meta{min-width:0;width:22%}.transport-title{font-weight:600;letter-spacing:-.01em}.transport-sub{font-size:var(--step--1);color:var(--text-dim)}.transport-controls{display:flex;align-items:center;gap:2px}.transport-play{width:40px;height:40px;border-radius:50%;margin:0 var(--space-1)}.transport-seek{display:flex;align-items:center;gap:var(--space-3);flex:1;min-width:120px}.transport-progress{flex:1}.transport-progress:disabled{opacity:.4}.transport-time{font-size:var(--step--1);min-width:42px;text-align:center}.transport-volume{display:flex;align-items:center;gap:var(--space-1);color:var(--text-dim)}.transport-volume .range{width:92px}.btn.is-on{color:var(--accent)}.transport:fullscreen{position:static;height:100%;background:#000;border-top:none}.transport:fullscreen .stage{position:absolute;top:0;right:0;bottom:0;left:0;display:flex}.transport:fullscreen .stage-video{width:100%;height:100%}.transport:fullscreen .transport-bar{position:absolute;left:0;right:0;bottom:0;height:auto;padding:var(--space-6) var(--space-5) var(--space-4);background:linear-gradient(transparent,#040507d1 45%);transition:opacity var(--medium),transform var(--medium)}.transport.is-idle .transport-bar{opacity:0;transform:translateY(12px);pointer-events:none}.transport.is-idle{cursor:none}.transport:fullscreen .stage.is-audio-only{display:flex;align-items:center;justify-content:center}@media (max-width: 860px){.shell{grid-template-columns:1fr}.sidebar{position:fixed;bottom:0;left:0;right:0;top:auto;height:auto;flex-direction:row;align-items:center;gap:0;padding:var(--space-2);border-right:none;border-top:1px solid var(--line);z-index:50}.brand,.sidebar-foot{display:none}.nav{flex-direction:row;width:100%}.nav-item{flex-direction:column;gap:3px;justify-content:center;padding:var(--space-2) 0;font-size:.68rem}.nav-item.is-active:before{top:0;left:50%;transform:translate(-50%);width:18px;height:3px;border-radius:0 0 2px 2px}.nav-count{display:none}.page{padding:var(--space-5) var(--space-4) calc(var(--player-height, var(--bar-height)) + 72px)}.page-head{flex-direction:column;align-items:stretch}.transport{left:0;bottom:60px}.transport-bar{flex-wrap:wrap;height:auto;padding:var(--space-2) var(--space-3) var(--space-3);gap:var(--space-2)}.transport-meta{width:auto;flex:1}.transport-extra,.transport-jump{display:none}.transport-seek{order:3;width:100%;flex-basis:100%}.stage-video{width:96px;height:54px}.toasts{right:var(--space-4);left:var(--space-4);bottom:calc(var(--bar-height) + 72px)}}@supports (padding: env(safe-area-inset-bottom)){.sidebar{padding-left:max(var(--space-3),env(safe-area-inset-left))}.page{padding-left:max(var(--space-6),env(safe-area-inset-left));padding-right:max(var(--space-6),env(safe-area-inset-right));padding-top:max(var(--space-6),env(safe-area-inset-top))}@media (max-width: 860px){.sidebar{padding-bottom:max(var(--space-2),env(safe-area-inset-bottom))}.transport{bottom:calc(60px + env(safe-area-inset-bottom))}.page{padding-top:max(var(--space-5),env(safe-area-inset-top));padding-bottom:calc(var(--player-height, var(--bar-height)) + 72px + env(safe-area-inset-bottom))}.toasts{bottom:calc(var(--player-height, var(--bar-height)) + 72px + env(safe-area-inset-bottom))}}.transport:fullscreen .transport-bar{padding-bottom:max(var(--space-4),env(safe-area-inset-bottom))}}.room{display:flex;flex-direction:column;gap:var(--space-4);padding:var(--space-4);min-height:168px}.room-head{display:flex;align-items:center;gap:var(--space-3)}.room-name{font-size:var(--step-1);font-weight:600;letter-spacing:-.01em;min-width:0}.room-body{display:flex;align-items:center;gap:var(--space-3);flex:1}.room-art{width:56px;height:56px}.room-now{min-width:0;flex:1}.room-now-title{font-weight:500}.room-now-sub{font-size:var(--step--1);color:var(--text-dim)}.room-now-sub.is-error{color:var(--danger)}.volume{display:flex;align-items:center;gap:var(--space-3)}.volume .range{flex:1;min-width:0}.volume-value{min-width:38px;text-align:right;font-size:var(--step--1);color:var(--text-dim);font-variant-numeric:tabular-nums}.room-foot{display:flex;align-items:center;gap:var(--space-2)}.room-foot .select{flex:1}.playlist-items{display:flex;flex-direction:column;gap:1px;max-height:196px;overflow-y:auto;margin:0 calc(-1 * var(--space-2))}.playlist-item{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-1) var(--space-2);border-radius:var(--radius-sm);font-size:var(--step-0)}.playlist-item:hover{background:var(--surface-2)}.playlist-item.is-current{color:var(--live)}.playlist-item-title{flex:1;min-width:0;padding:0;border:none;background:none;color:inherit;text-align:left;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.picker{background:var(--surface-2);border:1px solid var(--line);border-radius:var(--radius);padding:var(--space-3)}.breadcrumb{display:flex;flex-wrap:wrap;align-items:center;gap:2px}.crumb{height:26px;padding:0 var(--space-2);font-size:var(--step--1)}.picker-list{display:flex;flex-direction:column;gap:1px;max-height:240px;overflow-y:auto;margin:var(--space-3) 0}.picker-entry{display:flex;align-items:center;gap:var(--space-2);width:100%;height:32px;padding:0 var(--space-2);border:none;border-radius:var(--radius-sm);background:transparent;color:var(--text);text-align:left}.picker-entry:hover{background:var(--surface-3)}.picker-foot{display:flex;align-items:center;gap:var(--space-3);padding-top:var(--space-3);border-top:1px solid var(--line)}.folder-row{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-2) 0;border-top:1px solid var(--line);font-size:var(--step-0)}.path{font-family:ui-monospace,SF Mono,Menlo,monospace;font-size:var(--step--1);color:var(--text-faint);min-width:0}.canvas{position:relative;height:min(66vh,640px);overflow:hidden;border:1px solid var(--line);border-radius:var(--radius-lg);background-color:#0c0e12;background-image:radial-gradient(circle at center,rgba(255,255,255,.055) 1px,transparent 1px);background-size:24px 24px;cursor:grab;touch-action:none}.canvas.is-panning{cursor:grabbing}.canvas-world{position:absolute;top:0;left:0;transform-origin:0 0}.edges{position:absolute;top:0;left:0;overflow:visible;pointer-events:none}.edge{fill:none;stroke-linecap:round}.edge-route{stroke:var(--live);stroke-width:2}.edge-route.is-selected{stroke:#8fe0b3;stroke-width:3}.edge-route.is-doomed{stroke:var(--danger);stroke-dasharray:6 5}.edge-pending{stroke:var(--accent);stroke-width:2;stroke-dasharray:7 5}.edge-member{stroke:var(--line-strong);stroke-width:1.5;stroke-dasharray:3 5}.edge-member.is-live{stroke:#63c98d80}.edge-hit{fill:none;stroke:transparent;stroke-width:18;pointer-events:stroke;cursor:pointer}.edge-delete{pointer-events:all;cursor:pointer}.edge-delete circle{fill:var(--danger)}.edge-delete text{fill:#fff;font-size:14px;pointer-events:none}.node{position:absolute;display:flex;flex-direction:column;justify-content:center;gap:2px;padding:var(--space-2) var(--space-3);background:var(--surface-2);border:1px solid var(--line-strong);border-radius:var(--radius);box-shadow:var(--shadow-1);cursor:move;-webkit-user-select:none;user-select:none;transition:opacity var(--fast),box-shadow var(--fast),border-color var(--fast)}.node-source{border-left:3px solid var(--accent)}.node-output{border-left:3px solid #8d7bd8}.node-group{border-left:3px solid #d8a44a;border-style:dashed}.node.is-live{border-color:#63c98d73}.node.is-dimmed{opacity:.28}.node.is-drop{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent-soft),var(--shadow-1)}.node-title{display:flex;align-items:center;gap:var(--space-2);font-size:var(--step-0);font-weight:500;overflow:hidden}.node-title strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:500}.node-meta{display:flex;align-items:center;gap:var(--space-2);font-size:var(--step--1);color:var(--text-faint);white-space:nowrap;overflow:hidden}.node-add{border-style:dashed;border-left-color:#8d7bd8;color:var(--text-dim);cursor:pointer}.node-add:hover{color:var(--text);border-color:var(--accent)}.port{position:absolute;top:50%;width:15px;height:15px;margin-top:-7.5px;border-radius:50%;background:var(--surface-1);border:2px solid var(--accent);cursor:crosshair;transition:transform var(--fast)}.port:hover{transform:scale(1.2)}.port-in{left:-8px;border-color:#8d7bd8}.port-out{right:-8px}.node-group .port-in{border-color:#d8a44a}.port-static{right:-6px;width:11px;height:11px;margin-top:-5.5px;border-color:var(--line-strong);cursor:default}.port-static:hover{transform:none}.library-bar{display:flex;align-items:center;gap:var(--space-4);margin-bottom:var(--space-5);flex-wrap:wrap}.tabs{display:inline-flex;gap:2px;padding:3px;background:var(--surface-2);border-radius:var(--radius)}.tab{display:inline-flex;align-items:center;gap:var(--space-2);height:30px;padding:0 var(--space-4);border:none;border-radius:var(--radius-sm);background:transparent;color:var(--text-dim);font-size:var(--step-0);font-weight:500;transition:background var(--fast),color var(--fast)}.tab:hover{color:var(--text)}.tab.is-active{background:var(--surface-3);color:var(--text)}.poster-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(154px,1fr));gap:var(--space-4) var(--space-4)}.poster-row{display:grid;grid-auto-flow:column;grid-auto-columns:154px;gap:var(--space-4);overflow-x:auto;padding-bottom:var(--space-2);scroll-snap-type:x proximity}.poster-row>.poster{scroll-snap-align:start}.poster{position:relative;display:flex;flex-direction:column;gap:var(--space-2);min-width:0}.poster-art{position:relative;display:block;width:100%;aspect-ratio:2 / 3;padding:0;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;background:var(--surface-2);color:var(--text-faint);cursor:pointer;transition:transform var(--medium),box-shadow var(--medium),border-color var(--fast)}.poster-art.is-square{aspect-ratio:1 / 1}.poster-art img{width:100%;height:100%;object-fit:cover;display:block}.poster:hover .poster-art{transform:translateY(-3px);box-shadow:var(--shadow-2);border-color:var(--line-strong)}.poster.is-playing .poster-art{border-color:#63c98d80}.poster-live{position:absolute;left:var(--space-2);top:var(--space-2);display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:#0a0b0dc7;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.poster-play{position:absolute;right:var(--space-2);bottom:52px;width:38px;height:38px;display:grid;place-items:center;border:none;border-radius:50%;background:var(--accent);color:var(--on-accent);box-shadow:var(--shadow-2);opacity:0;transform:translateY(4px);transition:opacity var(--medium),transform var(--medium)}.poster:hover .poster-play,.poster-play:focus-visible{opacity:1;transform:translateY(0)}.poster-label{display:flex;flex-direction:column;gap:1px;padding:0;border:none;background:none;text-align:left;color:inherit;min-width:0;cursor:pointer}.poster-title{font-size:var(--step-0);font-weight:500}.poster-sub{font-size:var(--step--1);color:var(--text-faint)}.track-list{display:flex;flex-direction:column;gap:1px}.track{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-2) var(--space-3);border-radius:var(--radius-sm);transition:background var(--fast)}.track:hover{background:var(--surface-2)}.track.is-playing{color:var(--live)}.track-no{width:52px;flex:none;font-size:var(--step--1);color:var(--text-faint)}.track.is-playing .track-no{color:var(--live)}.track-title{flex:1;min-width:0;padding:0;border:none;background:none;color:inherit;font-size:var(--step-0);text-align:left;cursor:pointer}.track-meta{width:30%;min-width:0;font-size:var(--step--1);color:var(--text-faint);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.track-time{width:56px;text-align:right;font-size:var(--step--1)}.menu{position:absolute;right:0;top:32px;z-index:5;min-width:180px;padding:var(--space-1);background:var(--surface-2);border-radius:var(--radius);box-shadow:var(--shadow-2);max-height:220px;overflow-y:auto}.menu button{width:100%;justify-content:flex-start}.sheet-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:70;display:grid;place-items:center;padding:var(--space-5);background:#050608b3;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);animation:fade-in .16s var(--ease)}.sheet{position:relative;width:min(820px,100%);max-height:min(86vh,820px);overflow-y:auto;padding:var(--space-6);background:var(--surface-1);border-radius:var(--radius-lg);box-shadow:var(--shadow-2);animation:sheet-in .22s var(--ease)}.sheet-close{position:absolute;top:var(--space-3);right:var(--space-3);font-size:1.2rem;line-height:1}.sheet-head{display:flex;gap:var(--space-5)}.sheet-art{width:168px;aspect-ratio:2 / 3;flex:none;border-radius:var(--radius)}.sheet-art.is-square{aspect-ratio:1 / 1}.sheet-meta{min-width:0;flex:1}.sheet-body{margin-top:var(--space-6);border-top:1px solid var(--line);padding-top:var(--space-4)}@keyframes fade-in{0%{opacity:0}}@keyframes sheet-in{0%{opacity:0;transform:translateY(12px) scale(.985)}}@media (prefers-reduced-motion: reduce){.sheet-backdrop,.sheet{animation:none}}@media (max-width: 720px){.sheet{padding:var(--space-4)}.sheet-head{flex-direction:column;gap:var(--space-4)}.sheet-art{width:128px}.track-meta{display:none}}.sheet.is-dialog{width:min(440px,100%);padding:var(--space-5)}.sheet.is-dialog .btn{justify-content:flex-start;height:42px}.menu-veil{position:absolute;top:0;right:0;bottom:0;left:0;z-index:4}.ctx-menu{position:absolute;z-index:5;min-width:216px;max-width:min(280px,calc(100% - var(--space-4)));max-height:70%;overflow-y:auto;padding:var(--space-1);background:var(--surface-2);border:1px solid var(--line-strong);border-radius:var(--radius);box-shadow:var(--shadow-2);animation:menu-in .14s var(--ease)}.ctx-menu-title{padding:var(--space-2) var(--space-3) var(--space-1);font-size:var(--step--1);font-weight:600;color:var(--text-dim)}.menu-label{padding:var(--space-2) var(--space-3) var(--space-1);font-size:var(--step--1);font-weight:600;letter-spacing:.07em;text-transform:uppercase;color:var(--text-faint)}.menu-item{display:flex;align-items:center;gap:var(--space-2);width:100%;min-height:40px;padding:0 var(--space-3);border:none;border-radius:var(--radius-sm);background:transparent;color:var(--text);font-size:var(--step-0);text-align:left}.menu-item:hover{background:var(--surface-3)}.menu-item.is-current{color:var(--live)}.menu-item.is-danger{color:var(--danger)}.menu-empty{padding:var(--space-2) var(--space-3);font-size:var(--step--1);color:var(--text-faint)}.menu-sep{height:1px;margin:var(--space-1) var(--space-2);background:var(--line)}@keyframes menu-in{0%{opacity:0;transform:scale(.97)}}@media (prefers-reduced-motion: reduce){.ctx-menu{animation:none}}@media (max-width: 860px){.canvas{height:min(72vh,620px)}.ctx-menu{min-width:240px}.menu-item{min-height:44px}}.node,.edge-hit{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}.download{display:flex;flex-direction:column;gap:var(--space-2);padding:var(--space-2) var(--space-3);background:var(--surface-2);border-radius:var(--radius-sm)}.download-head{display:flex;align-items:center;gap:var(--space-2);font-size:var(--step-0);min-width:0}.progress{height:4px;border-radius:var(--radius-full);background:var(--surface-3);overflow:hidden}.progress-bar{height:100%;background:var(--accent);border-radius:var(--radius-full);transition:width var(--medium)}.section-title{margin:0 0 var(--space-3);font-size:var(--step--1);font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--text-faint)}.patch-bar{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3)}.patch-sources{display:flex;gap:var(--space-3);margin-bottom:var(--space-6);padding-bottom:var(--space-2);overflow-x:auto;scroll-snap-type:x proximity;scrollbar-width:none}.patch-sources::-webkit-scrollbar{display:none}.psource{flex:0 0 auto;min-width:172px;max-width:240px;scroll-snap-align:start;display:flex;flex-direction:column;align-items:flex-start;gap:3px;padding:var(--space-3) var(--space-4);border:1px solid var(--line);border-radius:var(--radius);background:var(--surface-1);color:var(--text);text-align:left;transition:background var(--fast),border-color var(--fast)}.psource:hover{background:var(--surface-2)}.psource.is-active{border-color:var(--accent-line);background:var(--accent-soft)}.psource-top{display:flex;align-items:center;gap:var(--space-2);max-width:100%;font-weight:600;font-size:var(--step-0)}.psource-meta{max-width:100%;font-size:var(--step--1);color:var(--text-dim)}.psource.is-active .psource-meta{color:var(--text)}.patch-list{display:flex;flex-direction:column;gap:var(--space-2)}.patch-row{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);width:100%;min-height:62px;padding:var(--space-3) var(--space-4);border:1px solid var(--line);border-radius:var(--radius);background:var(--surface-1);color:var(--text);text-align:left;transition:background var(--fast),border-color var(--fast)}.patch-row:hover:not(:disabled){background:var(--surface-2)}.patch-row:active:not(:disabled){background:var(--surface-3)}.patch-row.is-live{border-color:#63c98d4d}.patch-row.is-blocked{opacity:.45}.patch-row-add{border-style:dashed;color:var(--text-dim)}.patch-main{display:flex;flex-direction:column;gap:3px;min-width:0}.patch-name{display:flex;align-items:center;gap:var(--space-2);font-size:var(--step-1);font-weight:600}.patch-meta{font-size:var(--step--1);color:var(--text-dim)}.chip-quiet{background:transparent;border:1px solid var(--line-strong);color:var(--text-dim)}.chip-sm{height:18px;padding:0 6px;font-size:.7rem}@media (max-width: 560px){.psource{min-width:152px}.patch-name{font-size:var(--step-0)}}.gate{display:flex;align-items:center;justify-content:center;min-height:100vh;min-height:100dvh;padding:var(--space-5);background:var(--bg)}.gate-card{display:flex;flex-direction:column;gap:var(--space-4);width:100%;max-width:380px;padding:var(--space-6);border:1px solid var(--line);border-radius:var(--radius-lg);background:var(--surface-1);box-shadow:var(--shadow-2);text-align:center}.gate-logo{color:var(--accent)}.gate-card h1{font-size:var(--step-3)}.gate-card p{font-size:var(--step-0);line-height:1.5}.gate-card code{font-size:.8em;color:var(--text)}.gate-hint{color:var(--text-faint);font-size:var(--step--1)}.shelf-more{margin-top:var(--space-3)}.media-list{display:flex;flex-direction:column}.media-row{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-2) var(--space-2) var(--space-2) 0;border-bottom:1px solid var(--line);transition:background var(--fast)}.media-row:last-child{border-bottom:none}.media-row:hover{background:var(--surface-2)}.media-row.is-playing .media-row-title{color:var(--live)}.media-row-open{display:flex;align-items:center;gap:var(--space-3);flex:1;min-width:0;padding:var(--space-1) 0 var(--space-1) var(--space-2);border:none;background:none;color:inherit;text-align:left;cursor:pointer}.media-row-art{width:56px;height:32px;border-radius:var(--radius-sm)}.media-row-art.is-square{width:40px;height:40px}.media-row-text{display:flex;flex-direction:column;gap:1px;min-width:0}.media-row-title{font-size:var(--step-0);font-weight:500}.media-row-sub{font-size:var(--step--1);color:var(--text-dim)}.media-row-play{flex:none}@media (max-width: 560px){.media-row-art{width:48px;height:28px}.media-row-art.is-square{width:34px;height:34px}}.share-link{margin:var(--space-2) 0 var(--space-4);padding:var(--space-2) var(--space-3);border-radius:var(--radius-sm);background:var(--surface-2);font-family:var(--font);font-size:var(--step--1);color:var(--text-dim)}.share-actions{display:flex;flex-wrap:wrap;gap:var(--space-2)}.share-targets{display:flex;flex-wrap:wrap;gap:var(--space-2);margin-top:var(--space-2)}.share-settings-link{margin-top:var(--space-4);align-self:flex-start;color:var(--text-faint)}.share-choices{display:grid;grid-template-columns:repeat(auto-fit,minmax(248px,1fr));gap:var(--space-3);margin-bottom:var(--space-5)}.share-choice{display:flex;flex-direction:column;gap:var(--space-2);padding:var(--space-4);border:1px solid var(--line);border-radius:var(--radius);background:var(--surface-1);color:var(--text);text-align:left;transition:border-color var(--fast),background var(--fast)}.share-choice:hover{background:var(--surface-2)}.share-choice.is-active{border-color:var(--accent-line);background:var(--accent-soft)}.share-choice-head{display:flex;align-items:center;gap:var(--space-2);font-size:var(--step-0)}.share-choice-hint{font-size:var(--step--1);color:var(--text-dim);line-height:1.5}.share-detail{display:flex;flex-direction:column;gap:var(--space-3);margin-bottom:var(--space-4);max-width:560px}.watch-lists{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-2);margin-bottom:var(--space-4);padding:3px;border-radius:var(--radius);background:var(--surface-2)}.watch-lists .input{width:150px}.watch-add{margin-bottom:var(--space-4)}.confirm-body{display:flex;flex-direction:column;gap:var(--space-3);margin:var(--space-3) 0 var(--space-4);color:var(--text-dim);font-size:var(--step-0);line-height:1.55}.confirm-list{margin:0;padding-left:var(--space-5);font-family:var(--mono, inherit);font-size:var(--step--1);color:var(--text-faint)}.confirm-actions{margin-top:var(--space-2)}.play-targets{margin:var(--space-3) 0 var(--space-2);max-height:46vh;overflow-y:auto}.select-sm,.input-sm{height:30px;padding:0 var(--space-2);font-size:var(--step--1)}.first-steps{display:flex;flex-direction:column;gap:var(--space-5);padding:var(--space-5) var(--space-4);max-width:640px;margin:0 auto}.first-steps-head h2{font-size:var(--step-2);letter-spacing:-.02em;margin-bottom:var(--space-2)}.first-steps-head p{color:var(--text-dim);line-height:1.55}.first-steps-list{display:flex;flex-direction:column;gap:var(--space-3);list-style:none;counter-reset:step;padding:0;margin:0}.first-steps-list li{counter-increment:step;display:flex;align-items:center;gap:var(--space-4);padding:var(--space-4);border:1px solid var(--line);border-radius:var(--radius);background:var(--surface-2)}.first-steps-list li:before{content:counter(step);flex:none;width:26px;height:26px;display:grid;place-items:center;border-radius:var(--radius-full);background:var(--surface-3);color:var(--text-dim);font-size:var(--step--1);font-weight:600;font-variant-numeric:tabular-nums}.first-steps-list li>div{flex:1;min-width:0}.first-steps-list h3{font-size:var(--step-0);font-weight:600;margin-bottom:2px}.first-steps-list p{font-size:var(--step--1);color:var(--text-dim);line-height:1.5}.first-steps-list code{font-family:ui-monospace,SF Mono,Menlo,monospace;font-size:.95em;padding:1px 5px;border-radius:var(--radius-sm);background:var(--surface-3)}.first-steps-list .btn,.first-steps-list .chip{flex:none}@media (max-width: 560px){.first-steps-list li{flex-wrap:wrap}.first-steps-list li>div{flex-basis:calc(100% - 26px - var(--space-4))}.first-steps-list .btn{margin-left:calc(26px + var(--space-4))}}.now-list{display:flex;flex-direction:column;gap:var(--space-2)}.now-row{display:flex;align-items:center;gap:var(--space-4);padding:var(--space-3) var(--space-4);border:1px solid var(--line);border-radius:var(--radius);background:var(--surface-2)}.now-art{width:52px;height:52px;flex:none}.now-text{flex:1;min-width:0}.now-where{display:flex;align-items:center;gap:var(--space-2);font-weight:600;font-size:var(--step-1);letter-spacing:-.01em}.now-what{font-size:var(--step-0)}.now-via{font-size:var(--step--1);color:var(--text-dim)}.now-via.is-error{color:var(--danger)}.now-volume{flex:0 1 180px;min-width:120px}.now-hint,.now-idle{display:flex;align-items:center;gap:var(--space-3);flex-wrap:wrap;margin-top:var(--space-5);font-size:var(--step--1);color:var(--text-dim)}@media (max-width: 640px){.now-row{flex-wrap:wrap;gap:var(--space-3)}.now-volume{flex:1 1 100%;order:3}}.live-head{align-items:flex-start;gap:var(--space-3);margin-bottom:var(--space-5)}.live-head p{max-width:62ch}.room-queue{border-top:1px solid var(--line);padding-top:var(--space-2)}.room-queue-head{display:flex;align-items:center;gap:var(--space-2);width:100%;background:none;border:none;padding:0;cursor:pointer;font-size:var(--step--1);color:var(--text-dim)}.room-queue-head:hover{color:var(--text)}.room-queue-head .is-flipped{transform:rotate(180deg)}.room-queue-list{list-style:none;margin:var(--space-2) 0 0;padding:0;max-height:168px;overflow-y:auto}.room-queue-item{display:flex;align-items:center;gap:var(--space-2);font-size:var(--step--1)}.room-queue-item.is-current .room-queue-title{color:var(--live);font-weight:500}.room-queue-title{flex:1;min-width:0;text-align:left;background:none;border:none;padding:2px 0;color:inherit;font:inherit;cursor:pointer}.room-queue-title:hover{color:var(--text)}.play-target{display:flex;align-items:stretch;gap:var(--space-2)}.play-target .patch-row{flex:1;min-width:0}.play-append{align-self:center}.play-save{display:flex;align-items:center;gap:var(--space-2)}