body{font-family:Gordita,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif;font-size:87.5%;max-width:512px;margin:0 auto;touch-action:manipulation}a{margin-right:1rem}main{text-align:center;padding:1em;margin:0 auto}h1{color:#335d92;font-size:1.15rem;font-weight:700;text-align:left;line-height:1}p{margin:1rem}.increment{font-family:inherit;font-size:inherit;padding:1em 2em;color:#335d92;background-color:#446b9e1a;border-radius:2em;border:2px solid rgba(68,107,158,0);outline:none;width:200px;font-variant-numeric:tabular-nums;cursor:pointer}.increment:focus{border:2px solid #335d92}.increment:active{background-color:#446b9e33}.main-header-controls{display:flex;justify-content:space-between;align-items:center;width:100%;max-width:1600px;margin:0 auto 10px;padding:0 10px;box-sizing:border-box}.global-actions{display:flex;gap:10px}.global-action-button{padding:10px 20px;font-size:1.1em;border-radius:6px;border:none;background-color:#6c757d;color:#fff;cursor:pointer;font-weight:700;box-shadow:0 2px 4px #0000001a}.global-action-button:disabled{background-color:#adb5bd;cursor:not-allowed}fieldset{min-inline-size:0;background-color:#f9f9f9;display:flex;flex-direction:column;gap:10px;padding:8px;margin:8px;width:calc(100% - 32px)}.version-number{font-size:.75em;font-weight:400;font-stretch:condensed}.recorder-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;color:#666}.recorder-title{margin:0}.recorder-header-buttons{display:flex;gap:10px}.recorder-header-button{padding:10px 15px;font-size:1em;border-radius:6px;border:none;background-color:#6c757d;color:#fff;cursor:pointer;font-weight:700;box-shadow:0 2px 4px #0000001a;transition:transform .1s,box-shadow .1s}.recorder-header-button:disabled{background-color:#adb5bd;cursor:not-allowed;transform:none}.recorder-clear-button{padding:10px 20px;font-size:1.1em;border-radius:6px;border:none;background-color:#f44336;color:#fff;cursor:pointer;font-weight:700;box-shadow:0 2px 4px #0000001a;transition:transform .1s,box-shadow .1s}.recorder-clear-button:active{transform:scale(.98)}.recorder-empty-state{text-align:center;padding:40px;background:#fff;border-radius:8px;border:1px solid #ddd;color:#666}.recorder-shots-list{display:flex;flex-direction:column;gap:10px;margin-top:15px;overflow-y:auto;flex-grow:1}.shot-select-button{border-radius:6px;border:3px solid #ccc;border-color:#bbb}.shot-number{font-weight:700}.shot-select-button:hover{border-color:#888}.shot-select-button.selected{border-color:#4caf50}.shot-select-button.playing{background-color:#ffc107;border-color:#ff9800;color:#212529;animation:pulse 1s infinite}.recorder-shot-actions-panel{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;padding:10px;background-color:#ececec;border-radius:6px;margin-top:5px;justify-content:center}.recorder-button{padding:8px 12px;border-radius:4px;border:none;color:#fff;cursor:pointer;font-weight:700;font-size:.9em;text-align:center}.recorder-button:disabled{opacity:.5;cursor:not-allowed}.recorder-button-create{background-color:#2196f3}.recorder-button-load{background-color:#4caf50}.recorder-button-save,.recorder-button-duplicate{background-color:#2196f3}.recorder-button-variation{background-color:#00ced1}.recorder-button-delete{background-color:#f44336}.recorder-button-up,.recorder-button-down{background-color:#ff9800}.recorder-shots-grid,.recorder-shot-card,.recorder-shot-values,.recorder-shot-value,.recorder-shot-value-label,.recorder-shot-actions{display:none}@keyframes pulse{0%{box-shadow:0 0 #ffc107b3}70%{box-shadow:0 0 0 10px #ffc10700}to{box-shadow:0 0 #ffc10700}}.shot-view{display:flex;justify-content:space-around;padding:5px;background-color:#f0f0f0;border-radius:5px;gap:1em;overflow:hidden;color:#000;align-items:center;font-weight:400;font-size:.9em}.shot-name{width:6em;text-align:left;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.param{display:flex;flex-direction:row;align-items:center;background-color:#fff;padding:2px 6px;font-family:Courier New,Courier,monospace}.label{margin-right:2px}.value{border-radius:2px;text-align:left;width:2.5em}.value.compact{width:1.5em}.slider-container{display:grid;grid-template-columns:1fr auto;gap:15px;align-items:center;margin-bottom:15px}.slider-actions{display:flex;align-items:center;gap:8px}.slider-label{font-weight:700}.slider-input{width:100%;height:30px;cursor:pointer;-webkit-appearance:none;background:#ddd;border-radius:15px;outline:none}.slider-input::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:24px;height:24px;background:#4caf50;border-radius:50%;cursor:pointer;transition:background .1s}.slider-input::-moz-range-thumb{width:24px;height:24px;background:#4caf50;border-radius:50%;cursor:pointer;transition:background .1s;border:none}.slider-input::-webkit-slider-thumb:hover{background:#45a049}.slider-input::-moz-range-thumb:hover{background:#45a049}.slider-input:focus{outline:none}.slider-input:focus::-webkit-slider-thumb{box-shadow:0 0 0 3px #4caf5033}.slider-input:focus::-moz-range-thumb{box-shadow:0 0 0 3px #4caf5033}.slider-value{width:60px;text-align:right;font-family:Consolas,monospace;font-size:.9em;padding:4px;border:1px solid #ccc;border-radius:4px;background:#fff}.slider-value:focus{outline:none;border-color:#4caf50;box-shadow:0 0 0 2px #4caf5033}.slider-button{width:36px;height:36px;padding:0;border:1px solid #ccc;border-radius:4px;background:#f5f5f5;font-size:1.2em;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;user-select:none;-webkit-user-select:none;touch-action:manipulation}.slider-button:hover{background:#e5e5e5}.slider-button:active{background:#ddd;transform:translateY(1px)}.slider-reset{padding:8px 12px;border-radius:4px;border:1px solid #ccc;background:#f5f5f5;cursor:pointer;font-size:.9em;transition:background-color .1s;min-width:60px;touch-action:manipulation}.slider-reset:hover{background:#e5e5e5}.slider-reset:active{background:#ddd}@media (max-width: 500px){.slider-container{grid-template-columns:1fr;gap:10px}.slider-actions{justify-content:center}.slider-label{text-align:center}}.controller-container{display:flex;flex-direction:column;gap:10px;width:100%}.status-header{display:flex;justify-content:space-between;align-items:center;cursor:pointer}.controller-status-title{margin-right:8px;text-align:right;width:100%}.controller-header{display:flex;justify-content:space-between;align-items:center;cursor:pointer;margin-bottom:20px}.controller-title{margin-top:0;margin-bottom:0}.controller-error{color:red;font-weight:700;margin-bottom:20px}.controller-error-message{color:red;margin-bottom:20px}.controller-device-info{margin-bottom:20px}.controller-status-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;font-family:Consolas,monospace;font-size:.8em}.controller-status-item{background:#fff;padding:10px;border-radius:6px;border:1px solid #ddd}.controller-button-row{display:flex;justify-content:space-between;align-items:center}.controller-button{padding:10px;font-size:1.1em;border-radius:6px;border:none;color:#fff;cursor:pointer;white-space:nowrap;box-shadow:0 4px 6px #0000001a;transition:transform .1s,box-shadow .1s}.controller-button:active{transform:scale(.98)}.controller-button-connect{background-color:#4caf50}.controller-button-connect:disabled{background-color:#a5d6a7;cursor:not-allowed;transform:none}.controller-button-disconnect{background-color:#ff9800}.controller-button-play{background-color:#28a745}.controller-button-stop-playback{background-color:#ffc107;color:#212529}.controller-button-stop{background-color:#dc3545}.controller-button-cancel{background-color:#9e9e9e}.controller-button-fire{background-color:#d32f2f}.controller-button.controller-button-fire:disabled{background-color:#9e9e9e;cursor:not-allowed;transform:none}.controller-parameters-section{margin-bottom:0}.controller-parameters-title{margin-bottom:20px}.controller-parameter-selector{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:20px;justify-content:center}.parameter-selector-button{padding:10px 15px;font-size:1em;border-radius:6px;border:1px solid #ccc;background-color:#f0f0f0;color:#333;cursor:pointer;transition:background-color .2s,border-color .2s,color .2s;flex-grow:1;text-align:center}.parameter-selector-button:hover{background-color:#e0e0e0;border-color:#bbb}.parameter-selector-button.selected{background-color:#335d92;color:#fff;border-color:#335d92;font-weight:700}.controller-parameters-grid{display:grid;grid-template-columns:1fr;gap:0}.controller-parameter-label{font-weight:700}.controller-parameter-slider{width:100%;height:30px;cursor:pointer}.controller-parameter-value{display:flex;gap:10px;align-items:center}.controller-parameter-number{min-width:40px;text-align:right}.controller-parameter-reset{padding:5px 10px;border-radius:4px;border:1px solid #ccc;background:#f5f5f5;cursor:pointer}@media (max-width: 768px){.controller-status-grid{grid-template-columns:1fr}.controller-button-row{flex-direction:row;gap:10px}.controller-left-buttons,.controller-right-buttons{flex-direction:column;flex-basis:calc(50% - 10px)}.controller-button{width:100%}.controller-parameter-selector{flex-direction:row;justify-content:space-around}.parameter-selector-button{flex-basis:calc(50% - 10px);font-size:.9em}}.status-arrow{font-size:1.2em;transition:transform .3s ease}.status-arrow.open{transform:scaleY(-1)}.controller-status-details{margin-bottom:20px}.program-manager-title{margin:0;color:#333}.program-creation-area{display:flex;gap:10px}.program-name-input{flex-grow:1;padding:10px;font-size:1em;border:1px solid #ccc;border-radius:6px}.program-create-button{font-size:2em;line-height:0;border-radius:6px;border:none;background-color:#28a745;color:#fff;cursor:pointer;font-weight:700}.program-create-button:disabled{background-color:#a3d9b1;cursor:not-allowed}.program-list{display:flex;flex-direction:column;gap:10px}.program-item{display:flex;align-items:center;justify-content:space-between;background-color:#fff;border:1px solid #ddd;border-radius:6px;transition:background-color .2s,border-color .2s}.program-item.active{background-color:#e7f3ff;border-color:#007bff}.program-item-main{flex-grow:1;padding:12px 15px;cursor:pointer}.program-name{font-weight:500;color:#333}.program-item.active .program-name{font-weight:700;color:#0056b3}.program-delete-button{padding:0;margin-right:15px;width:30px;height:30px;border-radius:50%;border:none;background-color:#f1f1f1;color:#dc3545;font-size:1.5em;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;line-height:1;transition:background-color .2s,color .2s}.program-delete-button:hover{background-color:#dc3545;color:#fff}