.pv{grid-template-columns:minmax(0,1fr);gap:32px;margin-top:18px;display:grid}@media (min-width:980px){.pv{grid-template-columns:minmax(0,1fr) 400px;align-items:start}.pv-side{position:sticky;top:16px}}@media (max-width:979px){.pv-main{display:contents}.pv-main>*{order:2}.pv-main>.pv-gallery{order:0}.pv-side{order:1}}.pv-preview{border-radius:var(--radius-panel);border:1px solid var(--line);margin:0;position:relative;overflow:hidden}.pv-preview img{aspect-ratio:1;object-fit:contain;width:100%;height:auto;display:block}.pv-preview figcaption{background:var(--white);border-radius:var(--radius-control);padding:4px 10px;position:absolute;bottom:10px;left:12px}.pv-h2{margin-bottom:12px;font-size:20px}.pv-h3{font-size:16px}.pv-title{justify-content:space-between;align-items:flex-start;gap:12px;display:flex}.pv-title h1{font-size:26px;line-height:1.2}.pv-by{color:var(--slate);margin:0}.pv-included ul{color:var(--slate);gap:4px;margin:0;padding-left:20px;font-size:14px;display:grid}.pv-more{gap:16px;margin-top:56px;display:grid}.pv-gallery{gap:12px;display:grid}.pv-thumbs{flex-wrap:wrap;gap:10px;display:flex}.pv-thumbs button{border-radius:var(--radius-control);background:var(--mist);cursor:pointer;border:2px solid #0000;width:84px;height:84px;padding:0;overflow:hidden}.pv-thumbs button[aria-pressed=true]{border-color:var(--ink)}.pv-thumbs img{object-fit:cover;width:100%;height:100%;display:block}@media (min-width:980px){.pv{--pv:clamp(420px, calc(100svh - 240px), 680px);grid-template-columns:minmax(0, calc(96px + var(--pv))) max(400px, min(600px, calc(100% - 128px - var(--pv))));justify-content:space-between}.pv-gallery{grid-template-columns:84px minmax(0,1fr);grid-template-areas:"thumbs preview";align-items:start}.pv-gallery:not(:has(.pv-thumbs)){grid-template-columns:minmax(0,1fr);grid-template-areas:"preview"}.pv-preview{width:100%;max-width:var(--pv);grid-area:preview}.pv-thumbs{flex-flow:column;grid-area:thumbs}.pv-gallery:has(.pv-thumbs>:nth-child(7)){grid-template-columns:178px minmax(0,1fr)}.pv:has(.pv-thumbs>:nth-child(7)){grid-template-columns:minmax(0, calc(190px + var(--pv))) max(400px, min(600px, calc(100% - 222px - var(--pv))))}.pv-thumbs:has(>:nth-child(7)){grid-template-columns:repeat(2,84px);align-content:start;display:grid}}
