#rating-mode.rating-flip-card{position:absolute;z-index:26;left:auto;right:2%;top:38%;width:clamp(110px,18dvh,180px);height:auto;aspect-ratio:3/4;padding:0;border:0;border-radius:14px;background:transparent;color:#fff;perspective:950px;cursor:grab;touch-action:none;user-select:none;filter:drop-shadow(0 8px 14px #000b)}
#rating-mode .card-rotator{display:block;position:relative;width:100%;height:100%;transform-style:preserve-3d;transform:rotateY(0deg)}
#rating-mode.ready .card-rotator{transition:transform .72s cubic-bezier(.22,.7,.2,1)}
#rating-mode.is-fair .card-rotator{transform:rotateY(180deg)}
#rating-mode .mode-face{position:absolute;inset:0;display:block;overflow:hidden;border:1px solid #e6b26c;border-radius:14px;backface-visibility:hidden;-webkit-backface-visibility:hidden;background:#190d20}
#rating-mode .mode-fair{transform:rotateY(180deg);background:#071e22}
#rating-mode .mode-face img{display:block;width:100%;height:100%;object-fit:cover;pointer-events:none}
#rating-mode .mode-caption{position:absolute;left:5px;right:5px;bottom:8px;display:grid;gap:3px;text-align:center;text-shadow:0 2px 4px #000;font:700 11px/1.2 system-ui,sans-serif;background:linear-gradient(transparent,#130a17d9 30%);padding:17px 1px 2px}
#rating-mode .mode-caption strong{font-size:clamp(12px,1.6dvh,17px);line-height:1.12;color:#ffe2ad}#rating-mode .mode-fair strong{color:#b5fff0}#rating-mode .mode-caption small{font-size:9px;font-weight:500;opacity:.85;line-height:1.25}
#rating-mode.dragging{cursor:grabbing;filter:drop-shadow(0 12px 18px #000d)}#rating-mode:focus-visible{outline:3px solid #ffe3a0;outline-offset:5px}
@media(prefers-reduced-motion:reduce){#rating-mode.ready .card-rotator{transition:none}}