.logo-loop{margin:8px 0 30px;min-width:0;border-block:1px solid var(--line);padding:16px 0 18px}
.logo-loop-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px;color:var(--muted);font-size:12px;letter-spacing:.04em}
.logo-loop-pause{border:0;background:transparent;color:var(--text);font:inherit;padding:7px 9px;border-radius:8px;cursor:pointer}
.logo-loop-viewport{overflow:hidden;mask-image:linear-gradient(to right,transparent,#000 5%,#000 95%,transparent)}
.logo-loop-track{display:flex;width:max-content;animation:catalog-logo-loop 38s linear infinite;animation-play-state:paused}
.logo-loop[data-running=true] .logo-loop-track{animation-play-state:running}
.logo-loop-group{list-style:none;padding:0 24px;margin:0;display:flex;gap:48px;align-items:center;justify-content:space-around;min-width:var(--loop-width,0px)}
.logo-loop-group li{display:flex;align-items:center;gap:12px;white-space:nowrap;color:var(--muted);font-size:15px;font-weight:700}
.logo-loop-group img{width:35px;height:35px;object-fit:contain;border-radius:10px;filter:saturate(.8)}
.logo-loop[data-static=true] .logo-loop-viewport{overflow:auto;mask-image:none}
.logo-loop[data-static=true] .logo-loop-track{animation:none;width:auto}
.logo-loop[data-static=true] .logo-loop-group{padding-inline:4px;gap:26px;min-width:0}
.logo-loop[data-static=true] .logo-loop-clone{display:none}
@keyframes catalog-logo-loop{to{transform:translateX(-50%)}}
.lot .lot-visual{position:relative;overflow:hidden;isolation:isolate;min-height:160px;padding:16px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px}
.lot-visual>.brand-icon{width:72px;height:72px;flex:0 0 72px}
.pixel-surface{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;background:radial-gradient(ellipse at 50% 10%,rgb(var(--accent-rgb)/.22),transparent 78%),#0b0c10;visibility:hidden;pointer-events:none}
.pixel-surface strong{display:grid;place-items:center;width:60px;height:60px;border:1px solid rgb(var(--accent-rgb)/.5);border-radius:18px;font-size:32px;color:var(--accent);background:var(--accent-soft)}
.pixel-surface>span{color:#f8f8fb;font-weight:800;letter-spacing:-.04em}
.lot-visual .pixel-surface small{color:#c1c5d0;max-width:85%;text-align:center;font-size:11px;background:none;border:0;padding:0}
.lot-visual.is-swapped .pixel-surface{visibility:visible}
.pixel-grid{position:absolute;inset:0;display:grid;grid-template-columns:repeat(6,1fr);grid-template-rows:repeat(6,1fr);pointer-events:none;z-index:2}
.pixel-grid i{opacity:0;background:var(--accent)}
.pixel-preview{position:absolute;z-index:3;top:8px;right:8px;width:36px;height:36px;border:1px solid #737887;background:#101115dd;color:#f8f8fb;border-radius:11px;font-size:19px;cursor:pointer}
.pixel-preview[aria-pressed=true]{border-color:var(--accent);color:var(--accent)}
.slide-commit{margin:12px 0;border:1px solid rgb(var(--accent-rgb)/.5);border-radius:18px;padding:18px;background:linear-gradient(135deg,rgb(var(--accent-rgb)/.09),transparent 70%),var(--field)}
.slide-commit>strong{font-size:17px}.slide-summary{font-size:14px;color:var(--text);overflow-wrap:anywhere;white-space:pre-line}
.slide-commit>label{font-size:12px;color:var(--muted)}
.slide-track{position:relative;margin-top:8px;height:58px;border:1px solid var(--line-bright);border-radius:16px;background:linear-gradient(90deg,var(--accent-soft) var(--commit-progress,0%),var(--surface-2) var(--commit-progress,0%))}
.slide-caption{position:absolute;inset:0;display:grid;place-items:center;font-size:13px;color:var(--text);pointer-events:none;padding-inline:50px;text-align:center}
.slide-track input[type=range]{appearance:none;-webkit-appearance:none;position:absolute;inset:0;margin:0;width:100%;height:100%;padding:6px;border:0;background:transparent;cursor:grab;touch-action:pan-y}
.slide-track input[type=range]:active{cursor:grabbing}
.slide-track input[type=range]::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:44px;height:44px;border-radius:11px;background:var(--accent);border:2px solid #ffffff40;box-shadow:0 3px 12px #0005}
.slide-track input[type=range]::-moz-range-thumb{width:40px;height:40px;border-radius:11px;background:var(--accent);border:2px solid #ffffff40}
.slide-actions{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px;margin-top:13px}
.slide-actions .text-button{font-size:12px;min-height:32px;margin:0;padding:6px 0;white-space:normal}
.logo-loop-pause:focus-visible,.logo-loop-viewport:focus-visible,.pixel-preview:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
@media(max-width:420px){.slide-commit{padding:13px}.logo-loop-group{gap:30px}.slide-caption{font-size:11px}}
@media(prefers-reduced-motion:reduce){.logo-loop-track{animation:none!important}}