:root{color-scheme:dark;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#f5f5f7;background:#09090c}
*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 50% 0,#25162f 0,transparent 55%),#09090c}
main{max-width:1240px;margin:auto;padding:12px 24px 16px}.selection-header{margin-bottom:14px}.topbar{display:flex;align-items:center;justify-content:space-between;gap:14px;min-height:44px;margin-bottom:8px}.brand{font-size:1.5rem;font-weight:900;font-style:italic;letter-spacing:-1.5px;white-space:nowrap}.brand b{color:#b82deb}.back-link{display:inline-flex;align-items:center;min-height:44px;color:#df99ff;text-decoration:none;font-size:.875rem}.back-link:focus-visible{outline:2px solid #df99ff;outline-offset:3px}h1{font-size:clamp(1.45rem,3vw,2.1rem);line-height:1.15;letter-spacing:-.6px;margin:0}.selected-brand{color:#c984e4;font-size:.875rem;margin:6px 0 0}
.models{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;align-items:start}.model-grid{grid-template-columns:repeat(var(--columns,3),minmax(0,1fr));max-width:calc(var(--columns,3)*370px);margin-inline:auto}
.model{position:relative;isolation:isolate;min-width:0;display:block;overflow:hidden;border:1px solid #353039;border-radius:14px;color:inherit;text-decoration:none;background:#101014;transition:border-color .2s,transform .25s,box-shadow .3s}
.visual{position:relative;min-width:0;height:var(--media-height,clamp(72px,calc((100svh - 260px)/2),240px));overflow:hidden;background:#101014}.wheel-art{display:block;width:100%;height:100%;object-fit:contain;transition:transform .6s,filter .4s}.model-photo{display:block;width:100%;height:100%}
.visual:after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(115deg,transparent 30%,#e9b2ff13 47%,transparent 64%);transform:translateX(-115%);transition:transform .8s}
.info{min-width:0;min-height:48px;padding:10px 14px;display:flex;align-items:center;justify-content:space-between;gap:8px;border-top:1px solid #ffffff0d}.info>div{min-width:0}.info h2{font-size:1rem;line-height:1.2;margin:0;overflow-wrap:anywhere}.info p{font-size:.8125rem;line-height:1.3;color:#b8b1bf;margin:4px 0 0}.action{flex:0 0 auto;display:grid;place-items:center;width:28px;height:28px;font-size:1.2rem;color:#df99ff;border:1px solid #ffffff21;border-radius:50%}.model-grid .info{min-height:54px}.model-grid .info h2{font-size:.9375rem;line-height:1.25}
.model:focus-visible{outline:3px solid #e3a6ff;outline-offset:3px;border-color:#c83aff}
@media(hover:hover){.model:hover{border-color:#b747dc;transform:translateY(-2px);box-shadow:0 8px 22px #b70cff16}.model:hover .wheel-art{transform:scale(1.025);filter:brightness(1.07)}.model:hover .visual:after{transform:translateX(115%)}}
@media(max-width:700px){main{padding:8px 12px 12px}.selection-header{margin-bottom:10px}.topbar{margin-bottom:4px}.brand{font-size:1.25rem}.models{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.model-grid{max-width:100%}.model-grid[data-count="1"]{grid-template-columns:minmax(0,1fr);max-width:340px}.info{padding:8px 9px;min-height:46px}.info h2{font-size:.875rem}.info p{font-size:.75rem;margin-top:3px}.action{display:none}.visual{height:var(--media-height,clamp(60px,calc((100svh - 300px)/3),180px))}.model-grid .visual{height:var(--media-height,clamp(80px,calc((100svh - 270px)/2),240px))}.selected-brand{margin-top:4px}}
@media(max-height:500px) and (min-width:560px){main{padding-top:4px;padding-bottom:8px}.topbar{margin-bottom:0}.selection-header{margin-bottom:8px}h1{font-size:1.375rem}.models{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.model-grid{grid-template-columns:repeat(var(--columns,3),minmax(0,1fr))}.info{padding:5px 10px;min-height:36px}.info p{display:none}.model-grid .info{min-height:42px}.selected-brand{margin:2px 0 0}}
@media(max-height:550px) and (max-width:559px){.info p{display:none}.info{min-height:36px;padding-block:6px}.model-grid .info{min-height:48px}.topbar{margin-bottom:0}.selection-header{margin-bottom:8px}h1{font-size:1.375rem}}
@media(prefers-reduced-motion:reduce){.model,.wheel-art,.visual:after{transition:none}.model:hover,.model:hover .wheel-art{transform:none}.visual:after{display:none}}
