@layer theme,base;@layer components{.inf-compare-photo-hero{border:1px solid var(--border-strong);background:var(--card);border-radius:.875rem;overflow:hidden}.inf-compare-photo-hero>p{border-top:1px solid var(--inf-line);color:var(--inf-quiet);flex-wrap:wrap;align-items:baseline;gap:.2rem .75rem;padding:.7rem .9rem;font-size:.875rem;display:flex}.inf-compare-photo-hero strong{color:var(--foreground)}.inf-compare-photo-paths{gap:1rem;display:grid;container-type:inline-size}.inf-compare-photo-lane{border:1px solid var(--inf-line);background:var(--background);border-radius:.875rem;padding:1rem}.inf-compare-photo-lane[data-lane=render]{border-color:color-mix(in srgb, var(--inf-copper) 55%, var(--card))}.inf-compare-photo-lane>ol{margin-top:.75rem;display:grid}.inf-compare-photo-station{grid-template-columns:4.5rem minmax(0,1fr);align-items:center;column-gap:.875rem;padding-block:.5rem;display:grid}.inf-compare-photo-station>p{gap:.2rem;display:grid}.inf-compare-photo-station strong{font-size:.9375rem;line-height:1.25}.inf-compare-photo-icon{border:1px solid var(--inf-line);background:var(--card);border-radius:.625rem;padding:.3rem;position:relative}.inf-compare-photo-station[data-end] .inf-compare-photo-icon{border-color:var(--foreground)}.inf-compare-photo-station:not(:last-child) .inf-compare-photo-icon:after{content:"";z-index:1;border-right:1.5px solid var(--inf-copper);border-bottom:1.5px solid var(--inf-copper);width:.5rem;height:.5rem;position:absolute;bottom:-.85rem;left:50%;transform:translate(-50%)rotate(45deg)}.inf-compare-photo-next{border-top:1px dashed var(--border-strong);color:var(--inf-quiet);margin-top:.75rem;padding-top:.7rem;font-size:.875rem;line-height:1.45}.inf-compare-photo-cut{fill:none;stroke:var(--inf-copper);stroke-width:1px;stroke-dasharray:2.5 2;vector-effect:non-scaling-stroke}@container (min-width:44rem){.inf-compare-photo-lane>ol{grid-template-columns:repeat(6,minmax(0,1fr));column-gap:1rem}.inf-compare-photo-station{grid-template-columns:minmax(0,1fr);align-content:start;row-gap:.6rem;padding-block:0}.inf-compare-photo-station:not(:last-child) .inf-compare-photo-icon:after{inset:50% -.8rem auto auto;transform:translateY(-50%)rotate(-45deg)}}.inf-compare-photo-shown{border:1px solid var(--border-strong);background:var(--surface-picture);border-radius:.875rem;position:relative;overflow:hidden}.inf-compare-photo-shown>[data-pin]{box-shadow:0 0 0 3px var(--card);border-radius:999px;display:grid;position:absolute;transform:translate(-50%,-50%)}.inf-compare-photo-shown>[data-pin="1"]{top:41%;left:51%}.inf-compare-photo-shown>[data-pin="2"]{top:54%;left:56%}.inf-compare-photo-shown>[data-pin="3"]{top:64%;left:66%}.inf-compare-photo-shown>[data-pin="4"]{top:60%;left:79%}.inf-compare-photo-shown>[data-pin="5"]{top:18%;left:82%}.inf-compare-photo-views{grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem;margin-top:.875rem;display:grid}.inf-compare-photo-views>li{align-content:start;gap:.45rem;display:grid}.inf-compare-photo-views>li>div{border:1px solid var(--inf-line);background:var(--surface-picture);border-radius:.5rem;overflow:hidden}@media (min-width:48rem){.inf-compare-photo-views{grid-template-columns:repeat(4,minmax(0,1fr))}}}@layer utilities;