:root{--dx-top-offset:calc(var(--space-4) + 36px + var(--space-7) * 2);--dx-card-peek:calc(var(--space-2) + var(--ts-xs) + var(--space-2) + var(--space-2))}.design-root{display:flex;height:100vh;overflow:hidden}.design-panel{flex:0 0 var(--side-w);width:var(--side-w);height:100%;overflow-y:auto;border-right:1px solid var(--border);padding:var(--dx-top-offset) var(--space-3) var(--space-4);display:flex;flex-direction:column;gap:var(--space-4);scrollbar-width:none}.design-panel::-webkit-scrollbar{display:none}.design-preview{position:relative;aspect-ratio:4/3;border:1px solid var(--border);border-radius:var(--r);background:var(--surface-cell);overflow:hidden;transition:height .65s cubic-bezier(.16,1,.3,1)}.design-preview-media{position:absolute;inset:0;transition:opacity .65s cubic-bezier(.16,1,.3,1)}.design-preview-img,.design-preview-placeholder{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}.design-spacer{flex:1}.design-card-stack{position:relative}.design-card-stack-front{position:relative;z-index:2}.design-card-stack-back{position:absolute;inset:0;z-index:1;transform:translateY(calc(-1 * var(--dx-card-peek)));transition:transform .6s cubic-bezier(.16,1,.3,1) .15s}.design-card-stack:focus-within .design-card-stack-back,.design-card-stack:hover .design-card-stack-back{transform:translateY(calc(-100% - var(--space-2)));transition:transform .6s cubic-bezier(.16,1,.3,1)}.design-mobile-intro,.design-mobile-meta{display:none}.design-mobile-meta .panel-next-card+.panel-next-card{margin-top:var(--space-3)}.design-list-col{flex:1 1 0;overflow-y:auto;padding:3px;scrollbar-width:thin;scrollbar-color:var(--text-4) transparent}.design-list-col::-webkit-scrollbar{width:2px}.design-list-col::-webkit-scrollbar-thumb{background:var(--text-4)}.design-list{padding:var(--dx-top-offset) var(--space-3) var(--space-6) var(--side-w)}.design-row{position:relative;isolation:isolate;display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3) 0;border-bottom:1px solid var(--border);text-decoration:none;cursor:pointer}.design-row:first-child{border-top:1px solid var(--border)}.design-row-fill{position:absolute;inset:0;height:0;overflow:hidden;display:flex;align-items:center;background:var(--solid);transition:height .75s cubic-bezier(.16,1,.3,1);pointer-events:none;z-index:2}.design-row.active .design-row-fill,.design-row:hover .design-row-fill{height:100%}.design-row-fill .panel-meta-item,.design-row-fill .panel-title{color:var(--on-solid)}.design-row-fill .panel-meta-dot{background:var(--on-solid);opacity:.5}.design-row-thumb{position:relative;display:none;width:40px;height:40px;border-radius:calc(var(--r) * .52);overflow:hidden;flex-shrink:0;background:var(--border)}.design-row-thumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.design-row-text{flex:1 1 0;min-width:0;display:flex;align-items:baseline;justify-content:space-between;gap:var(--space-4)}.design-row .panel-meta-row{margin-top:0;flex-shrink:0}@media (prefers-reduced-motion:no-preference){.design-row{opacity:0;animation:fadeUp .5s cubic-bezier(.16,1,.3,1) forwards}.design-row:first-child{animation-delay:40ms}.design-row:nth-child(2){animation-delay:80ms}.design-row:nth-child(3){animation-delay:.12s}.design-row:nth-child(4){animation-delay:.16s}.design-row:nth-child(5){animation-delay:.2s}.design-row:nth-child(6){animation-delay:.24s}.design-row:nth-child(7){animation-delay:.28s}.design-row:nth-child(8){animation-delay:.32s}.design-row:nth-child(9){animation-delay:.36s}}@media (max-width:900px){.design-root{flex-direction:column;height:auto;overflow:visible}.design-panel{display:none}.design-mobile-intro{display:flex;flex-direction:column;gap:var(--space-3);margin-top:calc(var(--space-4) + 36px + var(--space-3));padding:var(--space-4) var(--space-3);border-bottom:1px solid var(--border)}.design-mobile-intro .panel-statement{font-size:var(--ts-base)}.design-list-col{overflow:visible}.design-list{padding:var(--space-5) var(--space-3) var(--space-6)}.design-row-thumb{display:block}.design-row-text{flex-direction:column;align-items:flex-start;justify-content:flex-start;gap:2px}.design-row-fill{display:none}.design-row{transition:background .18s ease}.design-row.active,.design-row:hover{background:var(--solid)}.design-row .panel-meta-item,.design-row .panel-title{transition:color .18s ease}.design-row .panel-meta-dot{transition:background .18s ease}.design-row.active .panel-meta-item,.design-row.active .panel-title,.design-row:hover .panel-meta-item,.design-row:hover .panel-title{color:var(--on-solid)}.design-row.active .panel-meta-dot,.design-row:hover .panel-meta-dot{background:var(--on-solid);opacity:.5}.design-mobile-meta{display:flex;flex-direction:column;gap:var(--space-3);padding:var(--space-5) var(--space-3) var(--space-7);border-top:1px solid var(--border)}}