#routeComposer[hidden]{display:none!important}
#routeComposer{position:fixed;left:0;right:0;bottom:0;height:320px;z-index:65;background:#0c1521f9;border-top:1px solid #57677a;box-shadow:0 -12px 30px #0005;font-size:11px;color:#c1cedb;display:flex;flex-direction:column}
.composer-toolbar{display:flex;align-items:center;gap:7px;padding:9px 12px;border-bottom:1px solid #2a3b4e;flex-wrap:wrap}
.composer-toolbar b{font-size:13px;color:#ecd5a3;margin-right:7px}.composer-toolbar button,.composer-toolbar select,.composer-toolbar input{font-size:11px;padding:4px 7px;height:28px}.composer-toolbar label{display:flex;align-items:center;gap:4px}.composer-toolbar input[type=number]{width:65px}#composerTime{color:#70d8ef;font-variant-numeric:tabular-nums}#composerPlay{min-width:66px}.composer-toolbar button[aria-pressed=true]{border-color:#62d0cb;color:#b9fff1;background:#193b3e}#composerClose{margin-left:auto}
.composer-scroll{overflow:auto;flex:1;position:relative;scrollbar-width:thin;scrollbar-color:#455e73 #0c1521;min-height:60px}
.composer-sheet{position:relative;min-height:100%;--composer-label:145px;--composer-scale:12px}
.composer-ruler,.composer-track{position:relative;height:37px;border-bottom:1px solid #263648;display:flex}
.composer-ruler{height:29px;background:#111f2c;position:sticky;top:0;z-index:4;cursor:ew-resize}.composer-label{position:sticky;left:0;flex:0 0 var(--composer-label);width:var(--composer-label);display:flex;align-items:center;gap:6px;padding:4px 8px;background:#142232;border-right:1px solid #34495e;z-index:3;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.composer-label button{font-size:10px;padding:2px 5px;background:transparent;border:0;color:#a6bac9}.composer-label span{overflow:hidden;text-overflow:ellipsis}.composer-track.active .composer-label{box-shadow:inset 3px 0 #e6c17d;background:#26303a}.composer-track.muted{opacity:.5}.composer-lane{position:relative;flex:1;background-image:repeating-linear-gradient(to right,#52698030 0,#52698030 1px,transparent 1px,transparent calc(var(--composer-scale)*5))}.composer-tick{position:absolute;top:5px;color:#839aac;pointer-events:none;white-space:nowrap}
.composer-key{position:absolute;top:11px;width:12px;height:12px;padding:0;border:1px solid #66c6ee;background:#2f6684;transform:translateX(-50%) rotate(45deg);border-radius:1px;cursor:ew-resize;touch-action:none}.composer-key.active{background:#e2c07d;border-color:#fff2c8;box-shadow:0 0 6px #e2c07d80}.composer-key:hover{background:#9adcf4}.composer-playhead{position:absolute;top:0;bottom:0;width:1px;background:#fd725e;z-index:5;pointer-events:none}.composer-playhead:before{content:'';position:absolute;top:0;left:-4px;border-top:8px solid #fd725e;border-left:4px solid transparent;border-right:4px solid transparent}
.composer-footer{display:flex;align-items:center;gap:9px;min-height:29px;padding:4px 12px;color:#90a3b3;background:#101d2a;border-top:1px solid #304154;flex-wrap:wrap}.composer-footer input{width:61px;padding:2px 4px;font-size:10px}.composer-footer select,.composer-footer button{font-size:10px;padding:2px 5px}.composer-footer label{display:flex;align-items:center;gap:4px}#composerHint{margin-left:auto;font-size:10px}#composerHint[data-warning=true]{color:#e4bc7e}
body.route-composer-open .board-wrap{bottom:320px!important}body.route-composer-open .camera-controls{bottom:332px!important}body.route-composer-open #personalHud{display:none!important}
@media(max-width:820px){#routeComposer{height:290px}.composer-toolbar{gap:4px;padding:6px}.composer-toolbar b{font-size:11px}.composer-toolbar select{max-width:110px}.composer-toolbar input[type=number]{width:50px}.composer-sheet{--composer-label:115px}.composer-footer{gap:5px}#composerHint{width:100%;margin-left:0}body.route-composer-open .board-wrap{bottom:290px!important}body.route-composer-open .camera-controls{bottom:300px!important}}
@media(max-width:820px){.composer-toolbar{max-height:110px;overflow:auto;flex-shrink:0}.composer-footer{max-height:70px;overflow:auto;flex-shrink:0}}

.composer-event-tools{display:flex;align-items:center;gap:6px;flex-wrap:wrap;flex-basis:100%;padding-top:5px;border-top:1px solid #293b4d}.composer-event-tools select{max-width:155px}.composer-actions{height:28px!important}.composer-actions .composer-label{font-size:9px;color:#8197a8;background:#101c29}.composer-event{position:absolute;top:5px;height:18px;overflow:hidden;padding:0 3px;font-size:9px;border:1px solid #b29460;background:#55452e;color:#ffe6b9;border-radius:3px;cursor:ew-resize;touch-action:none;white-space:nowrap}.composer-event.skill{background:#294961;border-color:#6dbfe7;color:#b9e9ff}.composer-event.death{background:#533441;border-color:#c2758e;color:#ffd2df}.composer-event.active{outline:1px solid #fff0cc;box-shadow:0 0 6px #dec18188}.composer-event-editor{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:5px 12px;border-top:1px solid #455269;background:#1b2635;font-size:10px}.composer-event-editor[hidden]{display:none!important}.composer-event-editor label{display:flex;align-items:center;gap:5px}.composer-event-editor input{width:65px;font-size:10px;padding:2px 4px}.composer-event-editor button{font-size:10px;padding:3px 6px}.composer-event-editor small{color:#95a7b8}.composer-event-tools #composerActionKillDelay{width:42px}@media(max-width:820px){.composer-event-editor{max-height:50px;overflow:auto;flex-shrink:0;font-size:9px;gap:5px}}

.composer-event-advanced summary{cursor:pointer;font-size:11px;padding:5px 8px;color:#a5bac9}.composer-event-advanced[open]{flex-basis:100%}.composer-event-advanced:not([open])>.composer-event-tools{display:none}.composer-event-advanced .composer-event-tools{border:0;padding:5px 0}.composer-toolbar #composerRecord{border-color:#8f794f;color:#eed6a4}
.composer-body{display:flex;flex:1;min-height:60px;overflow:hidden}.composer-body>.composer-scroll{min-width:0}#composerSteps{width:250px;flex:0 0 250px;overflow:auto;background:#101e2c;border-right:1px solid #36495d;scrollbar-width:thin}.composer-steps-title{display:flex;align-items:center;justify-content:space-between;padding:9px 10px;position:sticky;top:0;background:#142536;z-index:1}.composer-steps-title small{color:#8199ad}#composerSteps ol{margin:0;padding:4px 7px;list-style:none}#composerSteps li{position:relative;padding:5px 25px 5px 0;border-bottom:1px solid #2a3a49}#composerSteps li.selected{background:#203a4c;border-radius:5px}.composer-step-select{display:flex;align-items:center;gap:8px;width:100%;text-align:left;background:transparent;border:0;padding:4px;font-size:11px}.composer-step-select b{display:block;font-weight:500;color:#d1e3ed}.composer-step-select small{display:block;margin-top:4px;font-size:10px;color:#809caf}.composer-step-number{border:1px solid #456277;border-radius:50%;min-width:21px;height:21px;text-align:center;line-height:19px;color:#9de1eb}.composer-step-duration{display:flex;align-items:center;gap:5px;margin-left:33px;font-size:10px;color:#8fa8ba}.composer-step-duration input{width:55px;padding:2px 4px;font-size:10px}.composer-step-preview{position:absolute;right:1px;top:9px;background:transparent;border:0;padding:3px;color:#9fcedc}.composer-steps-empty{padding:12px;color:#89a3b6;line-height:2;margin:0}@media(max-width:820px){#composerSteps{width:190px;flex-basis:190px}}
