.fan-plate {
    position: relative;
    display: block;
    overflow: hidden;
    isolation: isolate;
    background: #101817;
    --fan-focus-x: .65;
    --fan-focus-y: .5;
}
.scene-cover > .fan-plate { position: absolute; inset: 0; z-index: -2; }
.fan-plate.fan-home { width: 100%; aspect-ratio: 1.52; border: 1px solid #49625c; }
.fan-plate > .fan-photo { display: block; width: 100%; height: 100%; object-fit: cover; object-position: calc(var(--fan-focus-x) * 100%) calc(var(--fan-focus-y) * 100%); }
.fan-disc, .fan-hit {
    position: absolute;
    left: 0; top: 0;
    width: 512px; height: 512px;
    transform-origin: 0 0;
}
.fan-disc { pointer-events: none; mask: var(--fan-mask) center / 100% 100% no-repeat; -webkit-mask: var(--fan-mask) center / 100% 100% no-repeat; }
.fan-disc img { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.fan-disc::after {
    content: ""; position: absolute; inset: 0;
    background: linear-gradient(135deg, #80c6d919, transparent 49%, #f9a35a13), linear-gradient(0deg, #0b101225, transparent 52%);
}
.fan-hit {
    border: 0; padding: 0; margin: 0;
    border-radius: 50%; background: transparent; appearance: none;
    cursor: pointer; touch-action: manipulation;
}
.fan-hit:focus-visible { outline: 4px solid var(--ice, #a2f6da); outline-offset: 0; }
.scene-cover:has(> .fan-plate) .scene-heading { pointer-events: none; }
.scene-cover:has(> .fan-plate) .scene-heading :is(a,button) { pointer-events: auto; }
[data-fan-switch] {
    display: inline-flex; align-items: center; gap: 9px; min-height: 44px;
    max-width: 100%; padding: 8px 12px; margin: 8px 0 0;
    background: #102326e8; border: 1px solid #77958d; color: #e3ede5; cursor: pointer;
    font: 600 12px/1.35 ui-monospace, Consolas, monospace;
}
[data-fan-switch][hidden] { display: none; }
[data-fan-switch]::before { content: ""; width: 7px; height: 7px; border: 1px solid #a4c0b7; border-radius: 50%; }
[data-fan-switch][aria-pressed="true"]::before { background: #90dec8; }
[data-fan-switch]:focus-visible { outline: 2px solid #aeffeb; outline-offset: 3px; }
@media (max-width:830px) {
    .fan-plate { --fan-focus-x: .64; }
    .fan-home { --fan-focus-x: .67; }
}
