@parcility/kennel/dist/style.css

A comprehensive, easy-to-use native depiction renderer.

.nd-root{box-sizing:border-box;max-width:100%}.nd-root p{margin:0}.nd-root *{box-sizing:border-box}.nd-root .nd-separator{margin:0 1rem .25rem;display:block;height:1px;border:none;background-color:#79797980}.nd-root .nd-spacer{display:block;content:" "}.nd-root .nd-stack{display:flex;flex-direction:column}.nd-root .nd-stack.nd-stack-landscape{gap:1rem;justify-content:space-between;flex-direction:row;align-items:center}.nd-root .nd-stack.nd-stack-landscape>*{flex:1}.nd-root .nd-auto-stack{display:grid}.nd-root .nd-layer{position:relative}.nd-root .nd-layer>*{position:absolute;top:0;left:0}.nd-root .nd-header{font-size:1.375rem}.nd-root .nd-subheader{font-size:.875rem}.nd-root .nd-header,.nd-root .nd-subheader{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.nd-root .nd-subheader.nd-subheader-bold,.nd-root .nd-header.nd-header-bold{font-weight:700}.nd-root .nd-header.nd-header-margins,.nd-root .nd-subheader.nd-subheader-margins{margin-top:.5rem;margin-left:1rem;margin-right:1rem}.nd-root .nd-header.nd-header-bottom-margin,.nd-root .nd-subheader.nd-subheader-bottom-margin{margin-bottom:.5rem}.nd-root .nd-rating{display:inline-block}.nd-root .nd-rating span{background:linear-gradient(to right,#ff8a00 var(--kennel-rating-progress),rgba(121,121,121,.15) var(--kennel-rating-progress));background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}.nd-root .nd-review{padding:1rem;background-color:#7979790d;margin-bottom:1rem;border-radius:.5rem}.nd-root .nd-review .nd-review-title{font-weight:600;font-size:1.1rem;margin:0}.nd-root .nd-review .nd-review-author{margin:0;opacity:.8}.nd-root .nd-review .nd-review-subtitle{margin-top:.25rem;display:flex;justify-content:space-between;align-items:center}.nd-root .nd-review .nd-review-content{margin:0}.nd-root .nd-button{box-sizing:border-box;margin:.5rem 0;display:block;text-decoration:none}.nd-root .nd-button>p{margin:0}.nd-root .nd-button.nd-button-link{color:var(--kennel-tint-color);margin:0}.nd-root .nd-button.nd-button-not-link{box-sizing:border-box;text-align:center;display:block;border:none;-webkit-appearance:none;-moz-appearance:none;padding:.5rem 1rem;margin:.5rem;font:inherit;border-radius:.5rem;appearance:none;width:100%}.nd-root .nd-table-text{display:flex;align-items:center;height:44px;margin:0 1rem;font-size:1rem}.nd-root .nd-table-text .nd-table-text-title{flex:1;color:#afafaf;margin:0}.nd-root .nd-table-text .nd-table-text-text{flex:1;margin:0;text-align:right}.nd-root .nd-table-button{display:flex;align-items:center;height:44px;margin:0 1rem;font-size:1rem;justify-content:space-between;color:var(--kennel-tint-color);text-decoration:none}.nd-root .nd-table-button .nd-table-button-text{flex:1 1 auto}.nd-root .nd-table-button .nd-table-button-chevron{width:.45em;height:.45em}.nd-root .nd-table-button .nd-table-button-chevron:before{content:"";border-style:solid;border-width:.1em .1em 0 0;display:inline-block;height:.45em;left:.15em;position:relative;top:.15em;transform:rotate(45deg);vertical-align:top;width:.45em}.nd-root .nd-tabs{position:relative;max-width:100%;display:grid;grid-template-columns:repeat(var(--kennel-tab-page-count),1fr);grid-template-areas:var(--kennel-tab-areas)}.nd-root .nd-tabs>input{display:none}.nd-root .nd-tabs>.nd-tab-control{cursor:pointer;grid-area:tab;text-align:center;padding:.5rem 1rem}.nd-root .nd-tabs>input:checked+label{color:var(--kennel-tint-color);border-bottom:solid 1px}.nd-root .nd-tabs>input:checked+label+.nd-tab-page{display:block}.nd-root .nd-tabs .nd-tab-page{grid-area:content;display:none;max-width:100%;padding-top:1rem;grid-column:1/-1}.nd-root .nd-video,.nd-root .nd-image{max-width:100%}.nd-root .nd-video{background-color:#000}.nd-root .nd-screenshots{display:flex;overflow-x:scroll;flex-wrap:nowrap;scroll-snap-type:x mandatory;padding-bottom:1rem;padding-left:1rem}.nd-root .nd-screenshots:after{content:" ";flex-shrink:0;display:block;height:1px;width:1rem}.nd-root .nd-screenshots>*{margin-right:1rem;scroll-snap-align:center;flex-shrink:0;border-radius:var(--screenshot-item-radius);width:var(--screenshot-item-width);height:var(--screenshot-item-height)}.nd-root .nd-screenshots>*:last-child{margin-right:0;scroll-snap-align:start}