.od-showcase{display:grid;padding:10px 12px 12px;min-inline-size:0;cursor:pointer;-webkit-tap-highlight-color:transparent}.od-showcase-stage{display:grid;gap:8px;min-inline-size:0;transition:opacity .5s ease}.od-showcase.is-out .od-showcase-stage,.od-showcase .is-out{opacity:0}.od-showcase-top{display:flex;align-items:center;gap:8px;margin:0;min-inline-size:0;max-inline-size:100%;overflow:hidden;min-block-size:22px;font-size:12px;color:var(--muted)}.od-showcase-tag{flex:none;padding:2px 8px;border-radius:999px;background:var(--accent-soft);color:var(--accent);font-size:11px;font-weight:700;letter-spacing:.04em;white-space:nowrap}.od-showcase-name{flex:1;min-inline-size:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.od-showcase .board{position:relative;aspect-ratio:1.7;min-block-size:0;border-radius:12px}.od-showcase .board svg{position:absolute;inset:0;inline-size:100%;block-size:100%;pointer-events:none;touch-action:auto}.od-showcase .hit,.od-showcase .hot{display:none}.od-showcase .lp-ring{pointer-events:none}.od-showcase .drill-feedback{margin:0;padding:8px 12px;min-block-size:0;block-size:calc(2 * 1.45 * 13px + 16px);font-size:13px;line-height:1.45;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere}.od-showcase .drill-feedback strong{margin-inline-end:5px}@media(min-width:768px){.od-showcase{padding:14px 16px 16px}.od-showcase .board{aspect-ratio:1.9}}@media(min-width:1200px){.od-showcase .board{aspect-ratio:1.75}}@media(prefers-reduced-motion:reduce){.od-showcase-stage{transition:none}}