@import"https://fonts.googleapis.com/css2?family=Silkscreen:wght@400;700&display=swap";@keyframes clr-sweep{0%{left:0}to{left:calc(100% - 1px)}}.clr-root{--clr-text-action: 13px;--clr-text-meta: 12px;--clr-tracking-action: .1em}.clr-root .mu-meta{font-size:var(--clr-text-meta)}.clr-root{--clr-pad-top: clamp(24px, 4vw, 48px)}.clr-root{--clr-reveal: .3s}.clr-root{--clr-field-w: min(max(240px, calc(100vw - 760px) ), max(300px, calc(100vh - 340px) ))}.clr-root{min-height:100vh;box-sizing:border-box;background:var(--paper);color:var(--ink);font-family:var(--font-sans);font-size:var(--text-body);line-height:var(--leading-body);padding:var(--clr-pad-top) clamp(24px,4vw,56px) 72px}.clr-root a{color:var(--ink);text-decoration-color:transparent}.clr-root a:hover{text-decoration-color:var(--hairline-hover)}.clr-ico{font-size:16px;flex:none;display:block}.clr-header{display:grid;grid-template-columns:240px var(--clr-field-w) 380px minmax(0,1fr);gap:32px;align-items:baseline}.clr-wordmark{grid-column:1 / 3;display:flex;align-items:baseline;flex-wrap:wrap;gap:5px;font-family:"Silkscreen",var(--font-mono);font-size:26px;line-height:1.2;letter-spacing:0;font-weight:400;margin:0}.clr-wordmark svg{font-size:1.4em;flex:none;display:block;position:relative;top:.08333em}.clr-wordmark>span{display:block;line-height:1}.clr-tagline{grid-column:3;justify-self:end;text-align:right;white-space:nowrap;margin:0;padding:0;font-family:var(--font-sans);font-size:var(--text-small);line-height:1;letter-spacing:normal;text-transform:none;font-weight:400;color:var(--ink-2)}.clr-tagline-marks{display:inline-flex;gap:1px;margin-left:8px;position:relative;top:.08333em;font-size:12px;color:var(--ink-3)}.clr-tagline-marks svg{display:block}.clr-grid{display:grid;grid-template-columns:240px var(--clr-field-w) 380px minmax(0,1fr);gap:32px;align-items:start;padding-top:calc(var(--clr-pad-top) + 6px)}.clr-panel{outline:1px solid var(--hairline);padding:24px}.clr-panel-head{display:flex;align-items:baseline;justify-content:space-between;gap:16px;padding-bottom:12px}.clr-panel-head .clr-panel-title{color:var(--ink)}.clr-panel-head .clr-panel-count{white-space:nowrap}.clr-action{display:flex;align-items:center;gap:12px;width:calc(100% + 32px);margin-left:-16px;padding:0 16px;min-height:48px;border:0;background:none;cursor:pointer;white-space:nowrap;text-align:left;font-family:var(--font-mono);font-size:var(--clr-text-action);letter-spacing:var(--clr-tracking-action);text-transform:uppercase;font-weight:500;color:var(--ink-2);transition:color var(--duration-fast) var(--ease),transform var(--duration-fast) var(--ease)}.clr-action:hover{color:var(--ink);transform:translate(3px)}.clr-action:focus-visible{outline:1px solid var(--ink);outline-offset:-1px}.clr-action:disabled{color:var(--ink-3);cursor:default;transform:none}.clr-action:disabled .clr-action-label{text-decoration:line-through}.clr-action-quiet{color:var(--text-faint)}.clr-action-group{display:flex;flex-direction:column;margin-top:12px;padding-bottom:8px}.clr-slot{display:grid;grid-template-rows:1fr}.clr-slot-clip{overflow:hidden;min-height:0;padding:0 16px;margin:0 -16px}@keyframes clr-slot-in{0%{grid-template-rows:0fr}to{grid-template-rows:1fr}}@keyframes clr-slot-out{0%{grid-template-rows:1fr}to{grid-template-rows:0fr}}.clr-slot[data-reveal=in]{animation:clr-slot-in var(--clr-reveal) var(--ease)}.clr-slot[data-reveal=out]{animation:clr-slot-out var(--clr-reveal) var(--ease) forwards}.clr-fold{display:grid;grid-template-rows:1fr;transition:grid-template-rows var(--clr-reveal) var(--ease)}.clr-fold[data-open=false]{grid-template-rows:0fr}.clr-fold-toggle .clr-ico{transition:transform var(--duration-fast) var(--ease)}.clr-fold-toggle[aria-expanded=false] .clr-ico{transform:rotate(-90deg)}.clr-fold-box{border:1px solid var(--hairline);padding:12px 16px}.clr-fold-box>.clr-action-group:first-child{margin-top:0}.clr-fold-box>.clr-action-group:last-child{padding-bottom:0}.clr-choice-mark{flex:none;margin-left:auto;width:16px;font-size:var(--clr-text-action);line-height:1;text-align:center;opacity:0;transition:opacity var(--duration-fast) var(--ease)}.clr-choice[aria-pressed=true]{color:var(--ink)}.clr-choice[aria-pressed=true] .clr-choice-mark{opacity:1}.clr-choice:disabled[aria-pressed=true]{color:var(--ink-3)}.clr-subhead{margin-top:12px;padding-bottom:0}.clr-subhead .clr-panel-title{color:var(--text-faint)}.clr-decay>.clr-action:first-child{margin-top:12px}.clr-sources,.clr-source-list{display:flex;flex-direction:column}.clr-source{display:flex;flex-direction:column;gap:8px;margin-top:24px}.clr-source-empty{margin-top:24px}.clr-source-thumb{width:100%;height:92px;background:var(--ink-5);background-size:cover;background-position:center}.clr-source-strip{display:flex;height:6px}.clr-source-meta{display:flex;align-items:center;justify-content:space-between}.clr-source-remove{appearance:none;background:none;border:0;margin-right:-8px;padding:6px 8px;cursor:pointer;display:flex;align-items:center;color:var(--ink-3);transition:color var(--duration-fast) var(--ease),transform var(--duration-fast) var(--ease)}.clr-source-remove:hover{color:var(--ink);transform:translate(3px)}.clr-source-remove:focus-visible{outline:1px solid var(--ink);outline-offset:-1px}.clr-empty{margin:12px 0 0;font-size:var(--text-small);color:var(--ink-3);line-height:1.5}.clr-field-col{display:flex;flex-direction:column;padding:0 0 24px;width:var(--clr-field-w)}.clr-field-box{position:relative;width:100%;aspect-ratio:1 / 1;margin:0 0 24px;background:var(--ink-5);outline:1px solid var(--hairline)}.clr-ghost{position:absolute;inset:0;width:100%;height:100%;opacity:0;pointer-events:none}.clr-field-box[data-phase=reset] .clr-ghost,.clr-field-box[data-phase=slide] .clr-ghost{opacity:1}.clr-canvas{position:relative;display:block;width:100%;height:100%;cursor:crosshair;transition:clip-path 1.15s cubic-bezier(.85,0,.15,1)}.clr-canvas[data-empty=true]{cursor:default}.clr-overlay{position:absolute;inset:0;pointer-events:none;transition:clip-path 1.15s cubic-bezier(.85,0,.15,1)}.clr-field-box[data-phase=idle] .clr-canvas,.clr-field-box[data-phase=reset] .clr-canvas,.clr-field-box[data-phase=idle] .clr-overlay,.clr-field-box[data-phase=reset] .clr-overlay{clip-path:inset(0 100% 0 0)}.clr-field-box[data-phase=reset] .clr-canvas,.clr-field-box[data-phase=reset] .clr-overlay{transition:none}.clr-field-box[data-phase=slide] .clr-canvas,.clr-field-box[data-phase=slide] .clr-overlay,.clr-field-box[data-phase=done] .clr-canvas,.clr-field-box[data-phase=done] .clr-overlay{clip-path:inset(0 0 0 0)}.clr-sweep{position:absolute;top:0;bottom:0;width:1px;background:#fff;mix-blend-mode:difference;pointer-events:none;animation:clr-sweep 1.15s cubic-bezier(.85,0,.15,1) forwards}.clr-field-note{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:16px;pointer-events:none;text-align:center}.clr-seed{position:absolute;transform:translate(-50%,-50%);font-family:var(--font-mono);line-height:1}.clr-point{position:absolute;transform:translate(-50%,-50%);pointer-events:auto}.clr-point-dot{display:block;width:100%;height:100%;border:2px solid var(--paper);outline:1px solid var(--ink);cursor:grab;padding:0;appearance:none}.clr-point-dot:active{cursor:grabbing}.clr-point-dot:focus-visible{outline:2px solid var(--ink);outline-offset:1px}.clr-point-role{position:absolute;top:calc(100% + 4px);left:0;font-family:var(--font-mono);font-size:var(--clr-text-meta);line-height:1.2;letter-spacing:.12em;text-transform:uppercase;padding:2px 4px;background:var(--paper);color:var(--ink);white-space:nowrap;pointer-events:none}.clr-point[data-flip-y=true] .clr-point-role{top:auto;bottom:calc(100% + 4px)}.clr-point[data-flip-x=true] .clr-point-role{left:auto;right:0}.clr-slider-row{display:flex;align-items:center;gap:16px;min-height:48px}.clr-root .clr-slider-label{width:10ch;flex:none;font-size:var(--clr-text-action);letter-spacing:var(--clr-tracking-action)}.clr-root .clr-slider-value{width:6ch;flex:none;font-size:var(--clr-text-action);letter-spacing:var(--clr-tracking-action);font-variant-numeric:tabular-nums}.clr-slider-row[data-idle=true] .clr-slider-label,.clr-slider-row[data-idle=true] .clr-slider-value{color:color-mix(in oklch,var(--ink) 20%,transparent)}.clr-slider-row[data-idle=false] .clr-slider-label,.clr-slider-row[data-idle=false] .clr-slider-value{color:var(--text-faint)}.clr-root input[type=range]{appearance:none;-webkit-appearance:none;background:none;margin:0;flex:1;cursor:ew-resize}.clr-root input[type=range]:disabled{cursor:default;opacity:.4}.clr-root input[type=range]::-webkit-slider-runnable-track{height:16px;border-radius:0;border:0;background:linear-gradient(to bottom,transparent 0 7px,var(--hairline-hover) 7px 8px,transparent 8px 100%)}.clr-root input[type=range]::-moz-range-track{height:16px;border-radius:0;border:0;background:linear-gradient(to bottom,transparent 0 7px,var(--hairline-hover) 7px 8px,transparent 8px 100%)}.clr-root input[type=range]::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:3px;height:16px;background:var(--ink);border:0;border-radius:0;margin-top:0}.clr-root input[type=range]::-moz-range-thumb{width:3px;height:16px;background:var(--ink);border:0;border-radius:0}.clr-root input[type=range]:focus-visible{outline:1px solid var(--ink);outline-offset:4px}.clr-palette{border:1px solid var(--hairline);padding:24px}.clr-bars{display:flex;flex-direction:column;gap:8px;margin-top:24px}.clr-ratio-bar{display:flex;height:24px;outline:1px solid var(--hairline)}.clr-gradient{height:10px;outline:1px solid var(--hairline)}.clr-rows{display:flex;flex-direction:column;margin-top:24px}.clr-row{display:flex;align-items:center;width:calc(100% + 32px);margin-left:-16px}.clr-row-main{flex:1;min-width:0;display:flex;align-items:center;gap:16px;padding:12px 16px;border:0;background:none;cursor:pointer;text-align:left;font-family:var(--font-sans);color:var(--ink-2);transition:color var(--duration-fast) var(--ease),transform var(--duration-fast) var(--ease)}.clr-row-main:hover{color:var(--ink);transform:translate(3px)}.clr-row-main:focus-visible{outline:1px solid var(--ink);outline-offset:-1px}.clr-swatch{flex:none;width:36px;height:36px;display:flex;align-items:center;justify-content:center;outline:1px solid var(--hairline);font-family:var(--font-mono);font-size:var(--clr-text-meta)}.clr-row-text{display:flex;flex:1;min-width:0;flex-direction:column;gap:3px;line-height:1.2}.clr-row-hex{font-family:var(--font-mono);font-size:var(--text-small);font-variant-numeric:tabular-nums;white-space:nowrap}.clr-root .clr-row-role{font-size:var(--clr-text-action);letter-spacing:var(--clr-tracking-action);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.clr-root .clr-row-contrast{display:flex;align-items:baseline;gap:5px;width:7ch;flex:none;white-space:nowrap;font-size:var(--clr-text-action);letter-spacing:var(--clr-tracking-action);font-variant-numeric:tabular-nums}.clr-row-contrast[data-tier=pass]{color:var(--ink)}.clr-row-contrast[data-tier=large]{color:var(--ink-2)}.clr-row-contrast[data-tier=fail],.clr-row-contrast[data-tier=reference]{color:var(--ink-3)}.clr-tier{font-size:1.08em;line-height:1}.clr-row-order{display:flex;flex:none;padding-right:8px;opacity:0;transition:opacity var(--duration-fast) var(--ease)}.clr-row:hover .clr-row-order,.clr-row:focus-within .clr-row-order{opacity:1}.clr-order-btn{appearance:none;background:none;border:0;padding:4px 2px;cursor:pointer;font-family:var(--font-mono);font-size:var(--text-small);line-height:1;color:var(--ink-3);transition:color var(--duration-fast) var(--ease)}.clr-order-btn .clr-ico{font-size:24px}.clr-order-btn:hover{color:var(--ink)}.clr-order-btn:focus-visible{outline:1px solid var(--ink);outline-offset:-1px}.clr-order-btn:disabled{opacity:.25;cursor:default}.clr-note{margin:12px 0 0;font-size:var(--text-small);line-height:1.5;color:var(--ink-3)}.clr-col{display:flex;flex-direction:column}.clr-theme{display:flex;align-items:center;gap:0;margin:20px 0 0 -10px}.clr-theme button{appearance:none;background:none;border:0;padding:10px;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:16px;color:var(--ink-3);transition:color var(--duration-fast) var(--ease),transform var(--duration-fast) var(--ease)}.clr-theme button:hover{transform:translate(3px)}.clr-theme button:focus-visible{outline:1px solid var(--ink);outline-offset:-1px}.clr-theme button[aria-pressed=true]{color:var(--ink)}.clr-toast{position:fixed;left:clamp(24px,4vw,56px);bottom:32px;background:var(--paper);color:var(--ink);outline:1px solid var(--ink);padding:10px 16px;z-index:2}.clr-drop{position:fixed;inset:16px;pointer-events:none;outline:1px solid var(--ink);display:flex;align-items:flex-end;justify-content:flex-start;padding:24px;z-index:1}.clr-drop span{color:var(--ink);background:var(--paper);padding:4px 8px}@media(max-width:1040px){.clr-grid,.clr-header{grid-template-columns:minmax(0,1fr)}.clr-wordmark{grid-column:1}.clr-tagline{grid-column:1;justify-self:start;text-align:left;white-space:normal}.clr-field-col{width:100%;max-width:520px}.clr-palette,.clr-panel{max-width:520px}}@media(prefers-reduced-motion:reduce){.clr-action,.clr-source-remove,.clr-row-main,.clr-row-order,.clr-order-btn,.clr-theme button,.clr-canvas,.clr-overlay,.clr-choice-mark{transition:none}.clr-sweep{display:none}.clr-slot{animation:none}.clr-fold,.clr-fold-toggle .clr-ico{transition:none}.clr-action:hover,.clr-source-remove:hover,.clr-row-main:hover,.clr-theme button:hover{transform:none}}
