.admin-only { display: none; }
body[data-admin-mode="on"] .admin-only { display: revert; }

.admin-mode-bar { position: fixed; right: 1rem; bottom: 1rem; z-index: 40; display: flex; flex-direction: column; gap: .5rem; align-items: flex-end; }
.admin-mode-toggle { padding: .5rem .9rem; color: #17221f; font: bold .78rem/1 Arial, sans-serif; letter-spacing: .04em; background: #ef9275; border: 1px solid #17221f; cursor: pointer; }
.admin-mode-toggle[aria-pressed="false"] { color: #f6f0e4; background: #17221f; border-color: #718178; }
.admin-mode-toggle:focus-visible { outline: 3px solid #ef9275; outline-offset: 2px; }
.admin-mode-link { padding: .4rem .8rem; color: #17221f; font: .78rem/1.2 Arial, sans-serif; text-decoration: none; background: #f6f0e4; border: 1px solid #17221f; }
.admin-mode-link:hover, .admin-mode-link:focus-visible { text-decoration: underline; }

@media (prefers-reduced-motion: reduce) {
    .admin-mode-bar * { transition: none !important; }
}

body[data-admin-mode="on"] .film-card { display: flex; flex-direction: column; }
body[data-admin-mode="on"] .film-card .film-card-link { height: auto; flex: 1; }
body[data-admin-mode="on"] .film-card-admin { display: flex; flex-wrap: wrap; gap: .4rem; align-items: center; padding: .6rem 1rem .8rem; border-top: 1px solid #718178; }
.film-card-rating { display: flex; flex-wrap: wrap; gap: .2rem; }
.film-card-rating-button { min-width: 1.6rem; padding: .2rem 0; color: #f6f0e4; font: .72rem/1 Arial, sans-serif; background: transparent; border: 1px solid #718178; cursor: pointer; }
.film-card-rating-button[aria-pressed="true"] { color: #17221f; background: #ef9275; border-color: #ef9275; }
.film-card-rating-button:focus-visible, .film-card-delete:focus-visible { outline: 2px solid #ef9275; outline-offset: 1px; }
.film-card-delete { margin-left: auto; padding: .2rem .6rem; color: #f6f0e4; font: .72rem/1 Arial, sans-serif; background: transparent; border: 1px solid #718178; cursor: pointer; }
.film-card-admin-message { flex-basis: 100%; margin: .3rem 0 0; color: #ef9275; font: .72rem/1.3 Arial, sans-serif; }
.film-card-admin[aria-busy="true"] { opacity: .6; }
.film-card.is-removing { opacity: 0; transition: opacity .2s ease; }

@media (prefers-reduced-motion: reduce) {
    .film-card.is-removing { transition: none; }
}