/* R9: words flip pale -> ink in one frame (no transition anywhere), works are empty tiles until their point. */
.ux-r9 .ux-r9-w{color:#8a8c80;transition:none}
.ux-r9 .ux-r9-w.on{color:inherit}
html[data-theme=dark] .ux-r9 .ux-r9-w{color:#7d8074}
html[data-theme=dark] .ux-r9 .ux-r9-w.on{color:inherit}
.ux-r9-st{position:relative;display:inline-block;vertical-align:-.3em;width:max(1.55em,24px);height:max(1.35em,21px);margin:0 .08em;border-radius:3px;background:#d9d6cb;rotate:-4deg;pointer-events:none;-webkit-tap-highlight-color:transparent;transition:none}
html[data-theme=dark] .ux-r9-st{background:#3a3c36}
.ux-r9-st+.ux-r9-st{rotate:5deg}.ux-r9-st+.ux-r9-st+.ux-r9-st{rotate:-7deg}
.ux-r9-st::before{content:"";position:absolute;inset:-10px -8px}/* >= 40 px touch target */
.ux-r9-st img{display:block;width:100%;height:100%;object-fit:cover;border-radius:3px;border:1.5px solid var(--paper,#f4f1e8);box-shadow:0 1px 3px rgba(32,34,31,.28);visibility:hidden}
.ux-r9-st.on{pointer-events:auto;cursor:pointer}
.ux-r9-st.on img{visibility:visible}
.ux-r9-st:focus-visible{outline:2px solid var(--accent,#f86c39);outline-offset:3px}
@media(hover:hover){.ux-r9-st.on:hover img{transform:scale(1.12)}}
.ux-r9-g{white-space:nowrap}