.fadeOut{animation-name:fadeOut}.fadeInDown{animation-name:fadeInDown}.fadeInUp{animation-name:fadeInUp}.fade-enter-active{transition:opacity .3s ease-in}.fade-leave-active{transition:opacity .15s ease-out}.fade-enter,.fade-leave-to{opacity:0}@-moz-keyframes fadeOut{0%{opacity:1}to{opacity:0}}@-webkit-keyframes fadeOut{0%{opacity:1}to{opacity:0}}@-o-keyframes fadeOut{0%{opacity:1}to{opacity:0}}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}@-moz-keyframes fadeInDown{0%{opacity:.5;transform:translate3d(0,-100%,0)}to{opacity:1;transform:none}}@-webkit-keyframes fadeInDown{0%{opacity:.5;transform:translate3d(0,-100%,0)}to{opacity:1;transform:none}}@-o-keyframes fadeInDown{0%{opacity:.5;transform:translate3d(0,-100%,0)}to{opacity:1;transform:none}}@keyframes fadeInDown{0%{opacity:.5;transform:translate3d(0,-100%,0)}to{opacity:1;transform:none}}@-moz-keyframes fadeInUp{0%{opacity:.5;transform:translate3d(0,100%,0)}to{opacity:1;transform:none}}@-webkit-keyframes fadeInUp{0%{opacity:.5;transform:translate3d(0,100%,0)}to{opacity:1;transform:none}}@-o-keyframes fadeInUp{0%{opacity:.5;transform:translate3d(0,100%,0)}to{opacity:1;transform:none}}@keyframes fadeInUp{0%{opacity:.5;transform:translate3d(0,100%,0)}to{opacity:1;transform:none}}.c-toast-container{position:fixed;display:flex;inset:0;padding:2em;overflow:hidden;z-index:9999;pointer-events:none}.c-toast-container--top{flex-direction:column}.c-toast-container--bottom{flex-direction:column-reverse}@media screen and (max-width:768px){.c-toast-container{padding:0;position:fixed!important}}.c-toast--top,.c-toast--bottom{align-self:center}.c-toast--top-right,.c-toast--bottom-right{align-self:flex-end}.c-toast--top-left,.c-toast--bottom-left{align-self:flex-start}.v--default-css .c-toast--success{background-color:#28a745}.v--default-css .c-toast--info{background-color:#17a2b8}.v--default-css .c-toast--warning{background-color:#ffc107}.v--default-css .c-toast--error{background-color:#dc3545}.v--default-css .c-toast--default{background-color:#343a40}.v--default-css .c-toast{display:grid;align-items:center;animation-duration:.15s;margin:.5em 0;border-radius:.5em;pointer-events:auto;color:#fff;min-height:3em;cursor:pointer;font-family:Avenir,Helvetica,Arial,sans-serif;padding:.5em 2em;word-break:break-word}:root{--bg: #fafafa;--panel: #ffffff;--text: #111;--muted: rgba(0, 0, 0, .65);--border: #e5e5e5;--border-strong: #cfcfcf;--radius: 10px}*{box-sizing:border-box}html,body{margin:0;padding:0;background:var(--bg);color:var(--text);font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,"Apple Color Emoji","Segoe UI Emoji";height:100vh}#app{display:flex;flex-direction:column;height:100vh}button,input,select{font:inherit}button{padding:8px 10px;border:1px solid var(--border-strong);background:var(--panel);border-radius:10px;cursor:pointer}button:disabled{opacity:.5;cursor:not-allowed}.nav{display:flex;gap:8px;padding:12px;border-bottom:1px solid var(--border);background:var(--panel);position:sticky;top:0;z-index:10}.nav button.active{border-color:#111}.nav .title{font-size:1.2em;margin-left:auto;margin-right:5px;color:#39c}.nav .title .subtitle{color:#666;font-size:.6em}.page{padding:16px}.panel{display:flex;gap:12px;align-items:center;margin:12px 0;flex-wrap:wrap;padding:12px;border:1px solid var(--border);border-radius:var(--radius);background:var(--panel)}.hint{opacity:.75;font-size:12px;display:flex;flex-flow:column}.head{display:flex;justify-content:space-between;align-items:center;gap:12px}.headActions{display:flex;gap:8px;flex-wrap:wrap}.grid{display:grid;gap:10px}.cell{-webkit-user-select:none;user-select:none;border:1px solid var(--border);border-radius:12px;padding:10px;min-height:70px;max-height:70px;display:flex;flex-direction:column;justify-content:center;background:var(--panel)}.cell.is-playing{outline:2px solid #111}.cell.is-looping{outline:3px solid #d4a100}.cellTitle{font-size:13px;font-weight:600;word-break:break-word}.cellTitle.empty{color:#9cf;opacity:.8}.cellSub{font-size:11px;opacity:.6;margin-top:auto}.list{display:grid;gap:8px;max-height:250px;overflow:auto}.row{display:flex;justify-content:space-between;gap:12px;padding:10px;border:1px solid var(--border);border-radius:var(--radius);background:var(--panel)}.row .name{flex:1;display:flex;gap:8px;align-items:center;min-width:0}.row .name input{width:100%;min-width:0;padding:8px 10px;border:1px solid var(--border);border-radius:10px;background:#fff}.actions{display:flex;gap:8px}.note{opacity:.7;font-size:12px;margin-top:12px}.footer{display:flex;flex-direction:column;text-align:center;margin-top:auto;margin-bottom:5px}.footer .banner{display:flex;justify-content:center;align-items:center;gap:10px}.bottom{margin-top:auto}.footer .bottom img{width:50px}
