.color-input__control{flex:1;align-self:stretch;align-items:center;gap:.563rem;min-width:0;display:flex}.color-input__swatch-wrapper{border-radius:.437rem;flex-shrink:0;width:20px;height:20px;position:relative;overflow:hidden;box-shadow:inset 0 0 0 1px #ffffff1a}.color-input__transparency-grid{position:absolute;inset:0}.color-input__swatch{width:100%;height:100%}.color-input__swatch--empty{background:linear-gradient(to top right,#0000 calc(50% - 1px),#fff6,#0000 calc(50% + 1px))}.color-input__value-text{font-variant-numeric:tabular-nums;letter-spacing:-.5px;font-family:Inter,sans-serif;font-weight:400}.color-input__value-text--placeholder{opacity:.5}.color-input__trigger{cursor:pointer;align-items:center;display:flex}.color-input__content{padding:.422rem}.color-input__body{flex-direction:column;gap:.563rem;width:240px;max-width:100%;display:flex}.color-input__area{border-radius:.578rem;width:100%;height:140px;position:relative;overflow:hidden}.color-input__area-background{border-radius:inherit;width:100%;height:100%}.color-input__area-thumb{border:2px solid #fff;border-radius:50%;width:14px;height:14px;box-shadow:0 0 0 1px #00000059}.color-input__area-thumb:focus{outline:none}.color-input__sliders{flex-direction:column;gap:.563rem;display:flex}.color-input__channel-slider{border-radius:999px;height:14px;position:relative;overflow:hidden}.color-input__channel-slider:focus{outline:none}.color-input__channel-slider-grid{border-radius:inherit;position:absolute;inset:0}.color-input__channel-slider-track{border-radius:inherit;width:100%;height:100%}.color-input__channel-slider-thumb{border:2px solid #fff;border-radius:50%;width:14px;height:14px;transform:translate(-50%,-50%);box-shadow:0 0 0 1px #00000059}.color-input__channel-slider-thumb:focus{outline:none}.color-input__channels{flex-direction:column;gap:.563rem;display:flex}.color-input__notation{width:100%}.color-input__notation .segmented-control__item{text-align:center;flex:1;justify-content:center;font-size:.75rem}.color-input__actions{gap:.563rem;width:100%;margin-top:.422rem}.color-input__actions .button{flex:1;justify-content:center;align-items:center;gap:.422rem}.color-input__channel-row{align-items:flex-end;gap:.422rem;display:flex}.color-input__channel{flex-direction:column;flex:1;align-items:center;gap:2px;min-width:0;display:flex}.color-input__channel--hex{align-items:stretch}.color-input__channel--hex .color-input__channel-label{text-align:center}.color-input__channel-label{opacity:.6;letter-spacing:-.5px;font-family:Inter,sans-serif;font-size:.563rem;font-weight:400}.color-input__channel-input{text-align:center;font-variant-numeric:tabular-nums;color:#ffffffbf;box-sizing:border-box;background:#070514;border:none;border-radius:.578rem;width:100%;min-width:0;padding:.422rem;position:relative;box-shadow:inset 0 1px 1px #ffffff1a}.color-input__channel-input:focus{outline:none}.color-input__channel-input{letter-spacing:-.5px;font-family:Inter,sans-serif;font-size:.75rem;font-weight:400}.color-input__channel-input:focus,.color-input__channel-input[data-focus]{background:#bfbfbf33;outline:none;box-shadow:inset 0 1px 1px #ffffff1a}
.json-tree{margin:0;text-wrap:nowrap;flex-direction:column;gap:.35rem;margin-block-start:.35rem;margin-inline-start:2px;padding-inline-start:.35rem;list-style:none;display:flex;position:relative}.json-tree__item{padding-inline-start:.7rem;list-style:none;position:relative}.json-tree__item:before{content:"";background:0 0;border-bottom:2px solid #393743;border-left:2px solid #393743;border-bottom-left-radius:.5rem;width:.7rem;height:20px;position:absolute;top:5px;left:-.35rem;transform:translateY(-50%)}.json-tree__item:not(:last-child):after{content:"";background:#393743;width:2px;height:100%;position:absolute;top:0;left:-.35rem}.rule{letter-spacing:-.5px;width:calc(100% + .35rem);box-shadow:none;background:0 0;border-radius:1rem;margin-left:-.35rem;padding:.175rem .35rem;font-family:Inter,sans-serif;font-weight:400}.rule:not(.rule--static):hover{background:#2c2b37;box-shadow:inset 0 1px 1px #bfbfbf1a}.rule:not(.rule--static):active,.rule:not(.rule--static):focus,.rule:not(.rule--static)[aria-selected=true],.rule:not(.rule--static)[data-state=open]{background:#2c2a36;outline:none;box-shadow:inset 0 1px 1px #bfbfbf1a}.rule:not(.rule--static){cursor:pointer}
.breadcrumb{letter-spacing:-.5px;align-items:center;gap:.563rem;font-family:Inter,sans-serif;font-weight:400;display:flex}.breadcrumb__splitter{color:#bfbfbf;display:flex}