.demo-kit{border:1px solid var(--b-border-strong);border-radius:16px;transition:background-color .35s,color .35s,border-color .35s;overflow:hidden}.demo-kit-top{justify-content:space-between;align-items:center;gap:12px;padding:11px 18px;display:flex}.demo-kit-top .pv-logo{font-size:17px}.demo-cols{grid-template-columns:minmax(0,1fr);margin-left:-1px;display:grid}@media (min-width:640px){.demo-cols{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (min-width:1024px){.demo-cols{grid-template-columns:repeat(4,minmax(0,1fr))}}.demo-block{border:0 solid var(--b-border);border-width:1px 0 0 1px;grid-template-rows:auto 1fr auto;gap:10px;min-width:0;padding:14px 18px 16px;display:grid;position:relative}.demo-block-head{justify-content:space-between;align-items:baseline;gap:12px;display:flex}.demo-tag{font:11px/1.2 var(--b-font-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--b-subtle)}.demo-state{color:var(--b-subtle);white-space:nowrap;text-overflow:ellipsis;font-size:12px;overflow:hidden}.demo-state--done{color:var(--b-accent-text);font-weight:500}.demo-visual{align-content:start;gap:9px;min-height:88px;display:grid}.demo-visual p{margin:0}.demo-concept{font-size:26px}.demo-swatches{border-radius:var(--b-radius-sm);border:var(--b-bw) solid var(--b-outline);grid-template-columns:repeat(11,minmax(0,1fr));height:30px;display:grid;overflow:hidden}.demo-roles{font:11.5px var(--b-font-mono);color:var(--b-muted);flex-wrap:wrap;gap:6px 14px;display:flex}.demo-roles span{align-items:center;gap:6px;display:inline-flex}.demo-roles i{border:1px solid var(--b-border-strong);border-radius:3px;width:12px;height:12px}.demo-type{grid-template-columns:auto minmax(0,1fr);align-items:center;gap:14px;display:grid}.demo-type .aa{font-size:44px;line-height:1}.demo-type .sample{-webkit-line-clamp:2;-webkit-box-orient:vertical;margin-bottom:4px;font-size:18px;line-height:1.2;display:-webkit-box;overflow:hidden}.demo-type .pv-small{display:block}.demo-rule{border-top:1px dashed var(--b-border-strong);min-height:64px;font:11.5px/1.55 var(--b-font-mono);color:var(--b-subtle);margin:0;padding-top:10px}.demo-rule span{background:var(--b-surface-2);color:var(--b-muted);border-radius:4px;margin-right:8px;padding:1px 5px}.demo-rule--done{color:var(--b-text)}.demo-rule--done span{background:var(--b-accent-soft);color:var(--b-accent-soft-text)}.demo-shot{height:300px;display:block;position:relative;overflow:hidden}@media (min-width:640px){.demo-shot{height:420px}}@media (min-width:1024px){.demo-shot{height:clamp(250px,100svh - 482px,640px)}}.demo-mini{border:1px solid var(--b-border-strong);border-radius:12px;overflow:hidden}.demo-mini-row{justify-content:space-between;align-items:center;gap:12px;padding:10px 12px;display:flex}.demo-mini-row .pv-logo{min-width:0;font-size:16px}.demo-mini-swatches{gap:4px;display:flex}.demo-mini-swatches i{border-radius:min(var(--b-radius-sm), 6px);border:1px solid var(--b-border);width:18px;height:18px}.demo-flash{animation:1.3s ease-out demo-flash}@keyframes demo-flash{0%,35%{background:var(--b-accent-soft);box-shadow:inset 3px 0 0 var(--b-accent)}to{background:0 0;box-shadow:inset 3px 0 #0000}}@media (prefers-reduced-motion:reduce){.demo-flash{animation:none}.demo-kit{transition:none}}