.graffiti-showcase{--graffiti-showcase-muted:var(--muted-foreground);--graffiti-showcase-surface:var(--card);--graffiti-showcase-border:var(--border);width:100%}.graffiti-showcase:focus-visible{outline:3px solid var(--ring);outline-offset:4px}.graffiti-showcase__viewport{overflow:hidden;border:1px solid var(--graffiti-showcase-border);border-radius:1.25rem;background:var(--graffiti-showcase-surface);touch-action:pan-y}.graffiti-showcase__stage{position:relative;isolation:isolate;width:100%;min-height:16rem;aspect-ratio:2/1;perspective:1200px}.graffiti-showcase__card{--graffiti-showcase-x:0%;--graffiti-showcase-rotate:0deg;--graffiti-showcase-scale:1;position:absolute;top:50%;left:50%;width:46%;aspect-ratio:1;overflow:hidden;border:1px solid var(--graffiti-showcase-border);border-radius:1rem;background:var(--graffiti-showcase-surface);box-shadow:var(--shadow-xl);transform:translate(-50%,-50%) translateX(var(--graffiti-showcase-x)) rotateY(var(--graffiti-showcase-rotate)) scale(var(--graffiti-showcase-scale));transform-style:preserve-3d;transition:transform .55s cubic-bezier(.22,1,.36,1),opacity .45s ease,filter .45s ease}.graffiti-showcase__image{display:block;width:100%;height:100%;object-fit:contain;pointer-events:none;user-select:none}.graffiti-showcase__card--active{z-index:5;opacity:1}.graffiti-showcase__card--next,.graffiti-showcase__card--previous{z-index:4;opacity:.75;filter:saturate(.78) brightness(.8);--graffiti-showcase-scale:0.82}.graffiti-showcase__card--previous{--graffiti-showcase-x:-57%;--graffiti-showcase-rotate:14deg}.graffiti-showcase__card--next{--graffiti-showcase-x:57%;--graffiti-showcase-rotate:-14deg}.graffiti-showcase__card--hidden{z-index:0;visibility:hidden;opacity:0;pointer-events:none;--graffiti-showcase-scale:0.55}.graffiti-showcase__caption{padding:1rem .25rem .25rem;text-align:center}.graffiti-showcase__caption p{margin:0;color:var(--foreground);font-size:clamp(1.05rem,2.2vw,1.4rem);line-height:1.2;font-weight:700;letter-spacing:-.02em}.graffiti-showcase__controls{display:flex;flex-wrap:wrap;align-items:center;gap:.55rem;padding:.85rem .25rem .1rem}.graffiti-showcase__button,.graffiti-showcase__dot{appearance:none;border:0;cursor:pointer;font:inherit}.graffiti-showcase__button{display:inline-grid;flex:0 0 auto;place-items:center;width:2.5rem;height:2.5rem;border:1px solid var(--graffiti-showcase-border);border-radius:.75rem;color:var(--foreground);background:var(--graffiti-showcase-surface);font-size:1.05rem;transition:border-color .18s ease,background-color .18s ease,transform .18s ease}.graffiti-showcase__button:hover:not(:disabled){border-color:var(--primary);background:var(--accent);transform:translateY(-1px)}.graffiti-showcase__button:disabled{cursor:not-allowed;opacity:.38}.graffiti-showcase__button--toggle{margin-left:.15rem}.graffiti-showcase__dots{display:flex;flex:1 1 auto;flex-wrap:wrap;align-items:center;justify-content:center;gap:.4rem;min-width:0}.graffiti-showcase__dot{display:inline-flex;align-items:center;justify-content:center;width:1.35rem;height:1.8rem;padding:0;background:transparent}.graffiti-showcase__dot span{display:block;width:.45rem;height:.45rem;border-radius:999px;background:var(--graffiti-showcase-muted);opacity:.5;transition:width .22s ease,background-color .22s ease,box-shadow .22s ease}.graffiti-showcase__dot[aria-current=true] span{width:1.5rem;background:var(--primary);box-shadow:0 0 .8rem color-mix(in oklch,var(--primary) 55%,transparent);opacity:1}.graffiti-showcase__button:focus-visible,.graffiti-showcase__dot:focus-visible{outline:2px solid var(--ring);outline-offset:3px}@media (max-width:640px){.graffiti-showcase__stage{min-height:17rem;aspect-ratio:1.15/1}.graffiti-showcase__card{width:74%}.graffiti-showcase__controls{display:grid;grid-template-areas:"previous dots next" "toggle toggle toggle";grid-template-columns:auto minmax(0,1fr) auto;gap:.45rem}.graffiti-showcase__button:first-child{grid-area:previous}.graffiti-showcase__dots{grid-area:dots}.graffiti-showcase__button:nth-last-of-type(2){grid-area:next}.graffiti-showcase__button--toggle{grid-area:toggle;justify-self:center;margin-left:0}}@media (prefers-reduced-motion:reduce){.graffiti-showcase__button,.graffiti-showcase__card,.graffiti-showcase__dot span{animation:none;transition:none}}