#show-palettes{flex:none;min-height:32px;padding:6px 10px;font-size:11px;border:1px solid var(--ns-line);border-radius:5px;background:var(--ns-ink);color:var(--ns-bg);white-space:nowrap;cursor:pointer}
.palette-compare[hidden]{display:none!important}.palette-compare{display:flex;flex-direction:column;min-height:0;flex:1;overflow:hidden}
.motion-dialog.is-comparing{height:calc(100dvh - 24px);max-height:calc(100dvh - 24px)}
.is-comparing :is(.detail-motion-options,.motion-dialog-body,.motion-dialog-foot,#detail-design,#detail-palette){display:none!important}
.is-comparing .motion-dialog-head{display:flex}.is-comparing #detail-title{min-width:0}
.palette-compare-tools{display:flex;align-items:center;gap:14px;flex:none;padding:9px 14px;border-bottom:1px solid var(--ns-line);background:var(--ns-card)}
#compare-jump{flex:1;min-width:0;max-width:470px;height:34px;font-size:12px;border:1px solid var(--ns-line);border-radius:5px;background:var(--ns-card);color:var(--ns-ink);padding:6px 9px}
#compare-range{font-size:11px;color:var(--ns-sub);white-space:nowrap;margin-left:auto}
#compare-help{font-size:11px;color:var(--ns-sub)}#compare-help summary{cursor:pointer;white-space:nowrap}#compare-help p{position:absolute;z-index:4;right:14px;max-width:min(350px,85vw);margin:9px 0 0;padding:12px 14px;border:1px solid var(--ns-line);border-radius:5px;background:var(--ns-card);color:var(--ns-ink);line-height:1.8;box-shadow:0 8px 24px #14271b22}
.palette-compare-scroll{flex:1;min-height:0;overflow:auto;padding:18px;overscroll-behavior:contain;overflow-anchor:none}
.palette-compare-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px 16px;align-items:start}
.palette-card{min-width:0;scroll-margin-top:10px}.palette-choose{display:block;width:100%;padding:0;overflow:hidden;border:1px solid var(--ns-line);border-radius:5px;background:var(--ns-card);color:var(--ns-ink);text-align:left;cursor:pointer}
.palette-choose:hover,.palette-card.is-target .palette-choose{border-color:var(--ns-ink);box-shadow:0 0 0 1px var(--ns-ink)}
.palette-choose[aria-pressed=true]{border-color:var(--ns-ink);box-shadow:0 0 0 2px var(--ns-ink)}
.palette-choose:focus-visible{outline:2px solid var(--ns-ink);outline-offset:3px}
.palette-art{aspect-ratio:1.65;width:100%;overflow:hidden;background:var(--ns-bg);position:relative}
.palette-art:empty::after{content:'';position:absolute;inset:35%;border:1px solid var(--ns-line);border-radius:2px}
.palette-meta{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:10px 11px 8px}
.palette-meta b{font-size:11px;line-height:1.5;font-weight:650;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.palette-applied{font-size:9px;color:var(--ns-sub);flex:none}.palette-choose[aria-pressed=true] .palette-applied{color:var(--ns-ink);font-weight:750}
.palette-swatches{display:flex;height:6px;margin:0 11px 11px;overflow:hidden;border-radius:2px}.palette-swatches i{flex:1}
:root[data-theme=dark] #compare-jump{color-scheme:dark}
@media(max-width:850px){.palette-compare-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:650px){.motion-dialog:not(.is-comparing) .motion-dialog-head{grid-template-columns:minmax(0,1fr) minmax(0,1fr) 82px}.motion-dialog:not(.is-comparing) .motion-dialog-head #detail-title{grid-column:1/3}.motion-dialog:not(.is-comparing) .motion-dialog-head #detail-close{grid-column:3;justify-self:end}.motion-dialog:not(.is-comparing) .motion-dialog-head #detail-design{grid-column:1;grid-row:2;width:100%;max-width:none}.motion-dialog:not(.is-comparing) .motion-dialog-head #detail-palette{grid-column:2;grid-row:2;width:100%;max-width:none}.motion-dialog:not(.is-comparing) .motion-dialog-head #show-palettes{grid-column:3;grid-row:2;width:100%;font-size:10px;padding:6px 4px}.motion-dialog.is-comparing{height:calc(100dvh - 16px);max-height:calc(100dvh - 16px)}.is-comparing .motion-dialog-head{gap:7px}.is-comparing #show-palettes{font-size:10px;padding:6px 8px}.palette-compare-tools{gap:8px;padding:8px 10px;flex-wrap:wrap}#compare-jump{font-size:12px;max-width:none;flex-basis:calc(100% - 45px);order:1}#compare-help{order:2}#compare-range{order:3;flex-basis:100%;margin:0;font-size:10px}.palette-compare-scroll{padding:12px}.palette-compare-grid{grid-template-columns:1fr;gap:15px}.palette-meta b{font-size:12px}}
@media print{.palette-compare,#show-palettes{display:none!important}}
