/* The completion bell is deliberately separate from the optional YouTube player. */
.focus-music {
    margin-top: var(--sp-2, 12px);
    border-top: 1px solid var(--color-border, rgba(128,128,128,.26));
    padding-top: var(--sp-2, 12px);
    color: var(--color-text, #222);
    text-align: left;
}
.focus-music__header, .focus-music__heading, .focus-music__actions,
.focus-music__form-row, .focus-music__footer, .focus-music__panel-header {
    display: flex;
    align-items: center;
    gap: 10px;
}
.focus-music__header, .focus-music__panel-header { justify-content: space-between; }
.focus-music__heading { min-width: 0; font-size: 14px; font-weight: 650; }
.focus-music__heading i { color: var(--color-accent, #555); font-size: 18px; }
.focus-music__source {
    font-size: 11px;
    font-weight: 550;
    color: var(--color-muted, #666);
    border: 1px solid var(--color-border, rgba(128,128,128,.25));
    border-radius: 999px;
    padding: 2px 8px;
    white-space: nowrap;
}
.focus-music button, .focus-music__panel button {
    font: inherit;
    cursor: pointer;
}
.focus-music__toggle, .focus-music__close, .focus-music__footer button,
.focus-music__save, .focus-music__play {
    color: inherit;
    background: var(--color-surface-2, rgba(120,120,120,.1));
    border: 1px solid var(--color-border, rgba(128,128,128,.3));
    border-radius: var(--radius-sm, 9px);
    padding: 7px 12px;
    transition: background .18s ease, border-color .18s ease;
}
.focus-music__toggle:hover, .focus-music__close:hover,
.focus-music__footer button:hover, .focus-music__save:hover,
.focus-music__play:hover { background: rgba(128,128,128,.2); }
.focus-music__panel {
    width: 100%;
    margin-top: 12px;
    padding: 14px;
    border-radius: var(--radius-lg, 14px);
    border: 1px solid var(--color-border, rgba(128,128,128,.3));
    background: var(--color-surface, rgba(255,255,255,.8));
    box-shadow: var(--shadow-sm, 0 10px 25px rgba(0,0,0,.08));
}
.focus-music__panel[hidden], .focus-music__video[hidden],
.focus-music__error[hidden], .focus-music__backdrop[hidden] { display: none !important; }
.focus-music__panel-header { align-items: flex-start; margin-bottom: 10px; }
.focus-music__panel-header strong { font-size: 16px; }
.focus-music__selection { margin: 4px 0 0; font-size: 12px; color: var(--color-muted, #666); }
.focus-music__close { line-height: 1; font-size: 22px !important; padding: 4px 10px; }
.focus-music__video {
    width: 100%;
    height: max(200px, min(55vw, 360px));
    margin: 8px 0 12px;
    border-radius: 12px;
    overflow: hidden;
    background: #101010;
}
.focus-music__video iframe, .focus-music__video #focus-music-player {
    display: block;
    width: 100% !important;
    height: 100% !important;
    border: 0;
}
.focus-music__actions { justify-content: space-between; flex-wrap: wrap; }
.focus-music__play, .focus-music__save {
    background: var(--color-text, #222);
    border-color: var(--color-text, #222);
    color: var(--color-bg, #fff);
    font-weight: 650 !important;
}
.focus-music__play:hover, .focus-music__save:hover { opacity: .86; }
.focus-music__play[disabled] { opacity: .45; cursor: not-allowed; }
.focus-music__external {
    font-size: 12px; color: var(--color-accent, #555);
    text-decoration: underline; text-underline-offset: 3px;
}
.focus-music__status { min-height: 18px; margin: 9px 0 11px; font-size: 12px; color: var(--color-muted, #666); }
.focus-music__form { margin: 0; }
.focus-music__form label { display: block; margin-bottom: 5px; font-size: 12px; font-weight: 600; }
.focus-music__form-row { align-items: stretch; }
.focus-music__form-row input {
    flex: 1; min-width: 0; padding: 8px 10px; border-radius: var(--radius-sm, 9px);
    background: var(--color-surface-2, rgba(120,120,120,.1));
    color: inherit; border: 1px solid var(--color-border, rgba(128,128,128,.3));
}
.focus-music__form-row input:focus-visible, .focus-music button:focus-visible,
.focus-music__panel button:focus-visible, .focus-music__external:focus-visible {
    outline: 2px solid var(--color-accent, #666); outline-offset: 2px;
}
.focus-music__error { margin: 6px 0 0; font-size: 12px; color: var(--color-error, #a12335); }
.focus-music__footer { justify-content: space-between; flex-wrap: wrap; margin-top: 12px; }
.focus-music__footer button { font-size: 12px; }
.focus-music__privacy {
    color: var(--color-muted, #666); font-size: 11px; line-height: 1.5;
    margin: 12px 0 0;
}

/* Room sidebar remains compact: its player lives in a viewport-wide dialog. */
.focus-music--room { pointer-events: auto; margin: 0; padding: 8px 12px; border-radius: 14px;
    background: rgba(10,16,28,.76); border: 1px solid rgba(255,255,255,.14); }
.focus-music--room .focus-music__heading { color: #eaf3ff; }
.focus-music--room .focus-music__source { color: #9fb6cf; }
.focus-music--room .focus-music__toggle { color: #eaf3ff; }
.focus-music__backdrop {
    position: fixed; inset: 0; z-index: 6000;
    background: rgba(3,8,17,.75); backdrop-filter: blur(10px);
}
.focus-music__panel--room {
    position: fixed; left: 50%; top: 50%; transform: translate(-50%, -50%);
    z-index: 6001; width: min(550px, calc(100vw - 24px)); max-height: calc(100dvh - 24px);
    overflow-y: auto; margin: 0; padding: 18px; color: #eaf3ff;
    --color-text: #eaf3ff; --color-bg: #0b1424; --color-accent: #00c2ff;
    --color-muted: #9fb6cf; --color-error: #ff8a8a;
    --color-surface: #101a2d; --color-surface-2: #1b2b42;
    --color-border: rgba(255,255,255,.22);
    background: #101a2d; box-shadow: 0 18px 70px rgba(0,0,0,.7);
}
.focus-music__panel--room .focus-music__play,
.focus-music__panel--room .focus-music__save { background: #eaf3ff; color: #0b1424; }
.focus-music__panel--room .focus-music__external { color: #9fe9ff; }
.focus-music__panel--room .focus-music__video { height: max(200px, min(50vh, 300px)); }
@media (max-width: 520px) {
    .focus-music__panel { padding: 12px; }
    .focus-music__video { height: max(200px, 50vw); }
    .focus-music__form-row { gap: 6px; }
    .focus-music__form-row input { font-size: 13px; }
    .focus-music__footer { gap: 6px; }
}