.dpage{max-width:1100px;margin:0 auto;padding:3rem 1.25rem 0}.dpage__hero{display:flex;align-items:baseline;flex-wrap:wrap;gap:.3rem 2rem;margin:0 0 1.1rem}.dpage__back{flex:none;font-size:.8rem;color:var(--muted);text-decoration:none}.dpage__back:hover{color:var(--accent)}.dpage__title{margin:0;font-size:clamp(1.6rem,4vw,2.1rem)}.dpage__rec{display:flex;flex-wrap:wrap;align-items:baseline;gap:.3rem .5rem;margin:0;font-size:.85rem;color:var(--muted)}.dpage__rec a{color:var(--text);font-weight:600}.dpage__rec a:hover{color:var(--accent)}.dpage__best{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-top:1.5rem;padding:.65rem 1rem;border:1px solid var(--border);border-radius:8px;font-size:.9rem;color:var(--accent);text-decoration:none}.dpage__best:hover{border-color:var(--accent)}.dpage__best-arrow{transition:transform .15s}.dpage__best:hover .dpage__best-arrow{transform:translate(.2rem)}.dpage__title .preview-mark{margin-left:.6rem;vertical-align:middle}.dcmp__filters{grid-area:filters;margin-bottom:.6rem}.dcmp__stage,.dcmp__drawer{display:contents}.dcmp .pk__filters{justify-content:flex-start}.dcmp .pk__filters[hidden]{display:flex;visibility:hidden}.dcmp__body{display:grid;grid-template-columns:minmax(0,1fr) 13rem;grid-template-areas:"filters filters" "main side" "after side";grid-template-rows:auto auto 1fr;gap:0 .9rem}.dcmp__main{grid-area:main;min-width:0}.dcmp--wide .dcmp__body{grid-template-columns:minmax(0,1fr) 24rem}.dcmp__after{grid-area:after;min-width:0;padding-bottom:6rem}.dcmp .pk__view{overflow-y:hidden;overscroll-behavior:auto;scrollbar-gutter:auto}.dpage .dcmp .pk__view{overflow:visible}.dpage .pk__tablescroll{overflow-x:auto}.dcmp__side{grid-area:side;align-self:start;position:sticky;top:calc(var(--nav-h) + .75rem);display:flex;flex-direction:column;gap:.5rem;max-height:calc(100vh - var(--nav-h) - 1.5rem - 10rem);min-height:0}.dcmp__side .pk__list{flex:1 1 auto;min-height:0}.dcmp a.pk__item{box-sizing:border-box;text-decoration:none}.dcmp a.pk__item[aria-current=page]{scroll-initial-target:nearest;scroll-snap-align:center}@media(max-width:520px){.dpage{--dpage-hero-h: 2.15rem;--dcmp-peek: 2.8rem;--dcmp-pad: .9rem;padding:0}.dpage__hero{flex-wrap:nowrap;align-items:center;gap:1rem;box-sizing:border-box;height:var(--dpage-hero-h);margin:0;padding:.7rem .9rem 0}.dpage__title{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.dpage__rec{flex:0 1 auto;flex-wrap:nowrap;min-width:0;white-space:nowrap;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none}.dpage__rec::-webkit-scrollbar{display:none}.dpage__back{margin-left:auto}.dpage .dcmp{padding:calc(3rem - var(--dpage-hero-h)) var(--dcmp-pad) 1rem 1.25rem}.dcmp{--dcmp-gutter: var(--dcmp-pad, .9rem);--dcmp-bleed: 0rem;--dcmp-col: 13rem;--dcmp-drawer-end: var(--dcmp-gutter);--dcmp-drawer-w: min(var(--dcmp-col), calc(100vw - 2 * var(--dcmp-drawer-end) - 4rem))}.dcmp--wide{--dcmp-col: 24rem}.dcmp__body{display:block}.dcmp__stage{display:grid;grid-template-columns:minmax(0,1fr)}.dcmp__main,.dcmp__drawer{grid-area:1 / 1}.dcmp__main{min-height:0;margin-left:calc(-1 * var(--dcmp-bleed));margin-right:calc(var(--dcmp-peek) - var(--dcmp-gutter))}.dcmp__drawer{display:flex;flex-direction:column;gap:.5rem;justify-self:end;align-self:start;position:sticky;top:calc(var(--nav-h) + .5rem);z-index:5;box-sizing:border-box;width:var(--dcmp-peek);min-width:var(--dcmp-peek);max-height:calc(100vh - var(--nav-h) - .5rem);max-height:calc(100svh - var(--nav-h) - .5rem);margin-right:calc(-1 * var(--dcmp-gutter));padding:0 var(--dcmp-drawer-end) .3rem 0;overflow:hidden;background:var(--bg);transition:width .2s ease}.dpage .dcmp__drawer{max-height:calc(100vh - var(--nav-h) - 3rem - 1rem);max-height:calc(100svh - var(--nav-h) - 3rem - 1rem)}.dpage .dcmp__body{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto 1fr;grid-template-areas:none;gap:0}.dpage .dcmp__stage{display:contents}.dpage .dcmp__main{grid-area:1 / 1}.dpage .dcmp__drawer{grid-area:1 / 1 / 3 / 2}.dpage .dcmp__after{grid-area:2 / 1;align-self:start;margin-right:calc(var(--dcmp-peek) - var(--dcmp-gutter))}.dcmp__drawer.is-open{width:calc(var(--dcmp-drawer-w) + var(--dcmp-drawer-end));box-shadow:-.4rem 0 1rem var(--shadow)}.dcmp__drawer.is-dragging{transition:none}.dcmp__filters,.dcmp__side{flex:none;box-sizing:border-box;width:var(--dcmp-drawer-w);min-width:0;margin:0}.dcmp__drawer:not(:has(.pk__filters)) .dcmp__filters{display:none}.dcmp .pk__filters,.dcmp .pk__filters[hidden]{display:grid;grid-template-columns:minmax(0,1fr)}.dcmp__side{flex:1 1 auto;position:static;max-height:none;min-height:0}.dcmp__drawer .pk__list{overscroll-behavior:contain}.dpage .dcmp__after{padding-bottom:0}.dpage .dcmp__after>:not(.dpage__best),.dpage .dcmp__after:not(:has(.dpage__best)){display:none}.dpage .dcmp__after .dpage__best{margin-top:1.25rem;margin-bottom:1rem}}@media(max-width:520px)and (prefers-reduced-motion:reduce){.dcmp__drawer{transition:none}}