html body#rlp [hidden]{display:none!important}
html body#rlp{background:radial-gradient(900px 500px at 10% -10%,#efe7ff,transparent),radial-gradient(800px 500px at 100% 0,#ffe6f3,transparent),#f7f6fb!important;color:#1d1b2e!important;padding-bottom:calc(110px + env(safe-area-inset-bottom))!important;font-family:Inter,system-ui,-apple-system,sans-serif!important}
html body#rlp .wrap{max-width:820px!important;margin:0 auto!important;padding:28px 16px!important}
html body#rlp .logo{font-family:inherit!important;font-size:2.1rem!important;font-weight:800!important;letter-spacing:-.02em!important;background:linear-gradient(90deg,#7c3aed,#db2777)!important;-webkit-background-clip:text!important;background-clip:text!important;color:transparent!important;display:inline-block}
html body#rlp .sub{color:#6b6880!important;margin:6px 0 20px!important}
html body#rlp .panel{background:#fff!important;border:1px solid #ece8f5!important;border-radius:22px!important;box-shadow:0 20px 50px -30px rgba(76,29,149,.35)!important;padding:22px!important;margin-bottom:16px!important;position:relative}
html body#rlp .panel:before{content:"";position:absolute;inset:0 0 auto;height:4px;border-radius:22px 22px 0 0;background:linear-gradient(90deg,#7c3aed,#db2777,#3b82f6)}
html body#rlp .panel h3{font-size:1.05rem!important;font-weight:700!important;color:#1d1b2e!important;margin:0 0 14px!important}
html body#rlp label{color:#5f5b72!important;font-size:.82rem!important;font-weight:600;margin:0!important}
html body#rlp .grid3{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px;margin:12px 0}.grid3 label{display:block;margin-bottom:5px!important}
html body#rlp input[type=number],html body#rlp #fname,html body#rlp .insp input[type=text],html body#rlp textarea,html body#rlp select{width:100%!important;box-sizing:border-box;background:#faf9fd!important;border:1px solid #e3def0!important;color:#1d1b2e!important;border-radius:12px!important;padding:10px 12px!important;font:inherit;font-size:.95rem!important}
html body#rlp .wrap button,html body#rlp .wrap .btn{font-family:inherit!important;border-radius:12px!important;font-weight:600!important;padding:11px 16px!important;background:linear-gradient(90deg,#7c3aed,#db2777)!important;color:#fff!important;border:0!important;box-shadow:0 10px 22px -12px rgba(219,39,119,.6)!important;cursor:pointer;margin:0!important;display:inline-flex;align-items:center;gap:6px}
html body#rlp .wrap .btn.up,html body#rlp .wrap button.ghost{background:#f2effa!important;color:#5b21b6!important;box-shadow:none!important}html body#rlp .wrap button.sm{padding:7px 12px!important;font-size:.85rem!important}
html body#rlp .wrap button:disabled{opacity:.45;box-shadow:none!important}
html body#rlp .row{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:10px 0}
.recbar{display:flex;flex-wrap:wrap;gap:10px;align-items:center}html body#rlp #rec{padding:14px 24px!important;font-size:1.05rem!important;border-radius:999px!important}
.tm{margin-left:auto;font:700 1.5rem ui-monospace,monospace;background:#f2effa;color:#1d1b2e;padding:6px 14px;border-radius:12px}
.meter{height:10px;background:#ece8f5;border-radius:99px;overflow:hidden;margin:14px 0 4px}.meter i{display:block;height:100%;width:0;background:linear-gradient(90deg,#22c55e,#eab308,#ef4444);transition:width .07s}
html body#rlp .status{color:#5b21b6!important;margin:10px 0;font-size:.9rem}
#wave{width:100%;height:120px;background:#faf8ff;border:1px solid #ece8f5;border-radius:12px;cursor:pointer;display:block}
.len{padding:10px 12px;border-radius:12px;background:#f3eeff;color:#5b21b6;font-weight:700}.len.bad{background:#fee2e2;color:#b91c1c;font-weight:600;font-size:.85rem}
#a{width:100%;margin-top:6px}.hint{color:#8a86a0;font-size:.85rem;margin:4px 0}
.ri{display:flex;align-items:center;gap:8px;padding:10px 12px;border:1px solid #ece8f5;border-radius:14px;margin-bottom:8px;background:#faf9fd}.ri>div{flex:1;min-width:0}.ri b{display:block;font-size:.92rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ri small{color:#8a86a0}
@media(max-width:640px){html body#rlp .wrap{padding:18px 12px!important}html body#rlp .logo{font-size:1.6rem!important}html body#rlp .panel{padding:18px 14px!important}.grid3{grid-template-columns:1fr 1fr!important}.tm{margin-left:0}.recbar button{flex:1 1 auto}html body#rlp #rec{flex-basis:100%}}

html body#rlp .wrap{max-width:1100px!important}
.lay{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:16px;align-items:start}@media(max-width:860px){.lay{grid-template-columns:1fr}}
.stage{background:#14121c;border-radius:16px;display:flex;align-items:center;justify-content:center;padding:10px;max-height:62vh}.stage canvas{max-width:100%;max-height:calc(62vh - 20px);border-radius:8px;background:#000;display:block}
.transport{display:flex;align-items:center;gap:10px;margin-top:10px}.transport input{flex:1;accent-color:#7c3aed}.transport span{font:600 .9rem ui-monospace,monospace;color:#5f5b72;white-space:nowrap}
.adds{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:8px}html body#rlp .adds .btn,html body#rlp .adds button{justify-content:center;width:100%}
.strip{display:flex;gap:8px;overflow-x:auto;padding:4px 2px 10px;min-height:96px}.sc{flex:0 0 120px;border:2px solid #ece8f5;border-radius:12px;background:#faf9fd;cursor:pointer;overflow:hidden;position:relative;user-select:none}.sc.on{border-color:#7c3aed;box-shadow:0 0 0 3px #ede9fe}
.sc .th{height:64px;background:#1d1b2e center/cover no-repeat;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;font-size:.8rem;text-align:center;padding:4px;overflow:hidden}.sc .mt{padding:5px 7px;font-size:.72rem;color:#5f5b72;display:flex;justify-content:space-between;gap:4px}.sc .mt b{color:#1d1b2e;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sc .tr{position:absolute;top:4px;left:4px;background:rgba(0,0,0,.6);color:#fff;font-size:.65rem;padding:1px 5px;border-radius:6px}
.lane{position:relative;height:34px;background:#f5f3fb;border-radius:10px;margin:6px 0;overflow:hidden}.lane .lb{position:absolute;left:8px;top:8px;font-size:.72rem;color:#8a86a0;pointer-events:none;z-index:0}.lane .ac{position:absolute;top:4px;bottom:4px;border-radius:7px;background:linear-gradient(90deg,#a78bfa,#f472b6);color:#fff;font-size:.7rem;padding:5px 7px;white-space:nowrap;overflow:hidden;cursor:pointer;z-index:1}.lane .ac.v{background:linear-gradient(90deg,#38bdf8,#22c55e)}.lane .ac.on{outline:2px solid #1d1b2e}
.ph{position:absolute;top:0;bottom:0;width:2px;background:#1d1b2e;z-index:2;pointer-events:none}
.insp .f{margin:10px 0}.insp label{display:block;margin-bottom:5px!important}.insp .two{display:grid;grid-template-columns:1fr 1fr;gap:10px}html body#rlp .insp input[type=range]{width:100%;accent-color:#7c3aed}html body#rlp textarea{min-height:70px;resize:vertical}
.chk{display:flex!important;align-items:center;gap:8px;font-size:.9rem!important;color:#1d1b2e!important}
.empty{color:#8a86a0;font-size:.9rem;padding:20px;text-align:center;border:2px dashed #e3def0;border-radius:12px;width:100%}
html body#rlp progress{width:100%;height:10px;accent-color:#db2777}
.lay>div{min-width:0}@media(max-width:860px){.lay{grid-template-columns:minmax(0,1fr)}.stage{max-height:52vh}.stage canvas{max-height:calc(52vh - 20px)}}

.sc .ch{position:absolute;top:4px;right:4px;background:#7c3aed;color:#fff;font-size:.62rem;padding:1px 5px;border-radius:6px;max-width:70px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}#chaps{gap:6px}