.flautea-metronome-fab {
        position:fixed;
        right:22px;
        bottom:22px;
        z-index:9998;
        width:58px;
        height:58px;
        padding:0;
        border:0;
        border-radius:50%;
        overflow:hidden;
        background:#fff;
        box-shadow:0 12px 30px rgba(22,58,67,.28);
        cursor:pointer;
        display:flex;
        align-items:center;
        justify-content:center;
        transition:transform .16s ease, box-shadow .16s ease;
    }

    .flautea-metronome-fab img {
        display:block;
        width:100%;
        height:100%;
        object-fit:cover;
        border-radius:50%;
    }

    .flautea-metronome-fab:hover {
        transform:translateY(-2px);
        box-shadow:0 15px 34px rgba(22,58,67,.34);
    }

    .flautea-metronome-fab.is-playing {
        box-shadow:0 0 0 5px #159447, 0 0 0 9px rgba(21,148,71,.20), 0 14px 34px rgba(22,58,67,.36);
        transform:translateY(-2px);
    }

    .flautea-metronome-overlay {
        position:fixed;
        inset:0;
        z-index:9999;
        pointer-events:none;
        display:none;
    }

    .flautea-metronome-overlay.is-open {
        display:block;
    }

    .flautea-metronome-panel {
        position:fixed;
        right:24px;
        bottom:92px;
        width:min(430px,calc(100vw - 32px));
        max-height:calc(100vh - 40px);
        background:#FAF9F6;
        border-radius:20px;
        box-shadow:0 24px 70px rgba(0,0,0,.24);
        overflow:auto;
        border:1px solid rgba(22,58,67,.08);
        pointer-events:auto;
        touch-action:none;
    }

    .flautea-metronome-header {
        display:flex;
        align-items:center;
        justify-content:space-between;
        gap:15px;
        padding:18px 20px;
        background:#163A43;
        color:#fff;
        cursor:move;
        user-select:none;
        touch-action:none;
    }

    .flautea-metronome-header strong {
        font-size:1.08rem;
    }

    .flautea-metronome-close {
        border:0;
        background:transparent;
        color:#fff;
        font-size:26px;
        line-height:1;
        cursor:pointer;
        padding:0 2px;
    }

    .flautea-metronome-body {
        padding:22px;
    }

    .flautea-metronome-bpm {
        text-align:center;
        margin-bottom:18px;
    }

    .flautea-metronome-bpm-value {
        display:flex;
        justify-content:center;
        align-items:baseline;
        gap:7px;
        color:#163A43;
    }

    .flautea-metronome-bpm-value strong {
        font-size:3rem;
        line-height:1;
    }

    .flautea-metronome-bpm-value span {
        color:#6E716F;
        font-weight:700;
    }

    .flautea-metronome-range {
        width:100%;
        margin:18px 0 8px;
        accent-color:#163A43;
    }

    .flautea-metronome-row {
        display:grid;
        grid-template-columns:1fr 1fr;
        gap:12px;
        margin-top:14px;
    }

    .flautea-metronome-field label {
        display:block;
        color:#163A43;
        font-size:.76rem;
        font-weight:800;
        margin-bottom:6px;
    }

    .flautea-metronome-field input,
    .flautea-metronome-field select {
        width:100%;
        min-height:42px;
        border:1px solid rgba(22,58,67,.15);
        border-radius:10px;
        background:#fff;
        color:#202526;
        padding:8px 10px;
        box-sizing:border-box;
    }

    .flautea-metronome-controls {
        display:grid;
        grid-template-columns:1fr 1fr;
        gap:10px;
        margin-top:18px;
    }

    .flautea-metronome-volume {
        margin-top:18px;
        padding:14px;
        background:#fff;
        border:1px solid rgba(22,58,67,.08);
        border-radius:12px;
    }

    .flautea-metronome-volume-head {
        display:flex;
        align-items:center;
        justify-content:space-between;
        gap:12px;
        margin-bottom:8px;
        color:#163A43;
        font-size:.78rem;
        font-weight:800;
    }

    .flautea-metronome-volume-range {
        width:100%;
        accent-color:#163A43;
    }

    .flautea-metronome-btn {
        min-height:46px;
        border-radius:11px;
        border:1px solid rgba(22,58,67,.12);
        cursor:pointer;
        font-weight:800;
    }

    .flautea-metronome-start {
        background:#163A43;
        color:#fff;
        border-color:#163A43;
    }

    .flautea-metronome-tap {
        background:#fff;
        color:#163A43;
    }

    .flautea-metronome-beats {
        display:flex;
        justify-content:center;
        gap:8px;
        margin-top:18px;
    }

    .flautea-metronome-beat {
        width:12px;
        height:12px;
        border-radius:50%;
        background:#D9DEDB;
        transition:transform .08s ease, background .08s ease;
    }

    .flautea-metronome-beat.is-active {
        background:#C6A667;
        transform:scale(1.32);
    }

    .flautea-metronome-hint {
        margin-top:14px;
        text-align:center;
        color:#6E716F;
        font-size:.72rem;
    }

    @media(max-width:600px) {
        .flautea-metronome-fab {
            right:16px;
            bottom:16px;
            width:54px;
            height:54px;
        }

        .flautea-metronome-row {
            grid-template-columns:1fr;
        }

        .flautea-metronome-panel {
            right:12px;
            bottom:82px;
            width:calc(100vw - 24px);
            max-height:calc(100vh - 100px);
        }
    }

    /* FLAUTEA_METRONOME_LOGO_80K_FIX */
    .flautea-metronome-logo{
        display:flex;
        align-items:center;
        justify-content:center;
        margin:2px 0 16px;
        pointer-events:none;
    }

    .flautea-metronome-logo img{
        display:block;
        width:105px;
        max-width:52%;
        height:auto;
        object-fit:contain;
    }

    @media(max-width:600px){
        .flautea-metronome-logo img{
            width:92px;
        }
    }