.pg{align-items:center;gap:12px var(--sp-4);grid-template-columns:minmax(0,auto) minmax(0,1fr);padding-block:14px;display:grid;container:pg/inline-size}.pg-range{color:var(--muted);font-size:var(--fs-small);line-height:var(--lh-small);white-space:nowrap;margin:0}.pg-range strong{color:var(--ink);font-size:15px;font-weight:600}.pg-ruler{justify-self:end;align-items:center;gap:6px;display:flex}.pg-step{border:1px solid var(--line-strong);border-radius:var(--r-control);background:var(--paper);width:40px;height:40px;color:var(--ink);transition:background-color var(--d-fast) var(--ease), color var(--d-fast) var(--ease), border-color var(--d-fast) var(--ease);place-items:center;display:grid}.pg-step svg{width:18px;height:18px;transition:translate var(--d-base) var(--ease-spring)}a.pg-step:hover{border-color:var(--ink);background:var(--ink);color:var(--paper)}a.pg-step[rel=next]:hover svg{translate:calc(var(--flip) * 2px) 0}a.pg-step[rel=prev]:hover svg{translate:calc(var(--flip) * -2px) 0}.pg-step[data-off]{opacity:.35}.pg-pages{align-items:center;margin:0;padding:0;list-style:none;display:flex}.pg-pages li{align-items:center;display:flex}.pg-pages li:before,.pg-total:before{content:"";background:var(--line-strong);width:2px;height:14px;transform:skewX(var(--slash-skew));border-radius:.5px;flex:none;margin-inline:3px}.pg-pages li[data-now]:before{background:var(--red);width:3px;height:20px}.pg-gap{color:var(--muted)}.pg-gap:before{opacity:0}.pg-num,.pg-total{border-radius:var(--r-control);min-width:40px;height:40px;color:var(--muted);transition:color var(--d-fast) var(--ease), background-color var(--d-fast) var(--ease);place-items:center;padding-inline:4px;font-size:15px;font-weight:500;text-decoration:none;display:inline-grid}.pg-num:hover{background:var(--tint);color:var(--ink)}.pg-num[aria-current=page]{color:var(--ink);font-size:18px;font-weight:700}.pg-num[aria-current=page]:hover{background:0 0}.pg-total{display:none}.pg-track{grid-column:1/-1;gap:6px;height:6px;display:flex;position:relative}.pg[data-place=bottom] .pg-track{order:-1}.pg-seg{background:var(--line);clip-path:polygon(2px 0,100% 0,calc(100% - 2px) 100%,0 100%);transition:background-color var(--d-base) var(--ease);flex:1}.pg-seg[data-past]{background:var(--line-strong)}.pg-seg[data-peek]{background:var(--ink-2)}.pg-seg[data-gap]{background:radial-gradient(circle, var(--line-strong) 1.5px, transparent 2px) center / 10px 6px repeat-x;clip-path:none}.pg-mark{--slot:calc((100% - (var(--slots) - 1) * 6px) / var(--slots));width:var(--slot);background:var(--red);clip-path:polygon(6px 0,100% 0,calc(100% - 6px) 100%,0 100%);transition:inset-inline-start .64s var(--ease-settle), width .64s var(--ease-settle);position:absolute;inset-block:-2px;inset-inline-start:calc(var(--at) * (var(--slot) + 6px))}.pg[data-busy] .pg-mark{animation:pg-busy .9s var(--ease) infinite alternate}@keyframes pg-busy{to{opacity:.45}}@container pg (max-width:560px){.pg-ruler{justify-content:space-between;justify-self:stretch}.pg-pages li:not([data-now]){display:none}.pg-pages{margin-inline-start:auto}.pg-total{align-items:center;margin-inline-end:auto;display:inline-flex}}@container pg (max-width:420px){.pg{grid-template-columns:minmax(0,1fr)}.pg-range{text-align:center}}.dn{border:1px solid var(--line-strong);border-radius:var(--r-control);background:var(--paper);isolation:isolate;grid-auto-columns:1fr;grid-auto-flow:column;padding:3px;display:inline-grid;position:relative}.dn-thumb{z-index:-1;background:var(--ink);width:calc(50% - 3px);transition:translate .36s var(--ease-spring);border-radius:6px;position:absolute;inset-block:3px;inset-inline-start:3px}.dn[data-value=comfortable] .dn-thumb{translate:calc(var(--flip) * 100%) 0}.dn-opt{height:34px;color:var(--ink-2);font:inherit;white-space:nowrap;cursor:pointer;transition:color var(--d-base) var(--ease);background:0 0;border:0;border-radius:6px;justify-content:center;align-items:center;gap:7px;padding-inline:10px 12px;font-size:14px;font-weight:500;display:inline-flex}.dn-opt[aria-pressed=true]{color:var(--paper)}.dn-opt:focus-visible{outline-offset:1px}.dn-icon{fill:none;stroke:currentColor;stroke-width:1.6px;stroke-linecap:round;width:16px;height:16px}.dn-thin{stroke-width:1.2px;opacity:.6}@media (max-width:639px){.dn-opt{height:36px;padding-inline:10px}.dn-label{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}}@media (prefers-reduced-motion:reduce){.pg-mark,.dn-thumb{transition:none}.pg[data-busy] .pg-mark{animation:none}}
