.daw-app {
    display: flex;
    flex-direction: column;
    height: 100vh;
}

.transport-bar {
    height: 50px;
    padding: 0 20px;
    background: var(--bg-elevated);
    display: flex;
    align-items: center;
    gap: 10px;
}

.transport-bar .bpm { 
    margin-left: auto; 
    color: var(--text-main); 
}
.tb-record.is-on {
    background: #c62828;
    border-color: #ff3355;
    color: #fff;
    box-shadow: 0 0 8px rgba(255, 50, 80, 0.55);
}
.daw-app.is-recording .track-arm-btn.active {
    box-shadow: 0 0 0 2px rgba(255, 50, 80, 0.65);
}

.arrange-view {
    display: flex;
    flex-grow: 1;
    min-height: 0; /* critical so children can scroll */
    overflow: hidden;
    background: var(--bg-base);
    position: relative;
}

@media (max-width: 850px) {
    .plugin-body {
        grid-template-columns: 1fr;
    }
    canvas#editor { aspect-ratio: 4 / 3; }
}