.color-field{gap:var(--space-2);grid-template-columns:2.5rem minmax(0,1fr);align-items:center;display:grid}.color-field__swatch{background-color:var(--sheet);background-image:conic-gradient(var(--line-strong) 25%, transparent 0 50%, var(--line-strong) 0 75%, transparent 0);border:1px solid var(--line-strong);border-radius:var(--radius);cursor:pointer;background-size:10px 10px;block-size:2.5rem;inline-size:2.5rem;display:block;position:relative;overflow:hidden}.color-field__swatch:after{content:"";background:var(--swatch,transparent);position:absolute;inset:0;box-shadow:inset 0 0 0 1px #00000014}.color-field__swatch:focus-within{outline:2px solid var(--focus);outline-offset:2px}.color-field__swatch input{opacity:0;cursor:pointer;block-size:100%;inline-size:100%;position:absolute;inset:0}.color-field__text{min-inline-size:0}.swatch-chip{background-color:var(--sheet);background-image:conic-gradient(var(--line-strong) 25%, transparent 0 50%, var(--line-strong) 0 75%, transparent 0);background-size:10px 10px;position:relative;overflow:hidden}.swatch-chip:after{content:"";background:var(--swatch,transparent);position:absolute;inset:0}.copy-btn .icon:last-of-type{display:none}.copy-btn.is-copied{color:var(--accent)}.copy-btn.is-copied .icon:first-of-type{display:none}.copy-btn.is-copied .icon:last-of-type{display:inline-block}.code-out{padding:var(--space-3) var(--space-4);border:1px solid var(--sheet-rule);border-radius:var(--radius);background:var(--paper);color:var(--ink);font-family:var(--font-mono);white-space:pre;tab-size:2;text-align:start;direction:ltr;max-block-size:24rem;margin:0;font-size:.8125rem;line-height:1.6;overflow:auto}.code-out:empty:before{content:attr(data-empty);color:var(--ink-3);font-family:var(--font-sans);white-space:normal}.meter{gap:var(--space-1);display:grid}.meter__track{border-radius:var(--radius-sm);background:var(--sheet-rule);block-size:4px;overflow:hidden}.meter__bar{background:var(--accent);transform-origin:0;block-size:100%;transition:transform var(--duration) var(--ease-out)}.meter.is-over .meter__bar{background:var(--danger)}.meter__text{color:var(--ink-3);font-size:var(--text-sm)}.meter.is-over .meter__text{color:var(--danger);font-weight:600}[dir=rtl] .meter__bar{transform-origin:100%}.notice[hidden],.result[hidden],.preview[hidden],.figures[hidden],.sheet[hidden],.sheet__bar[hidden],.field[hidden],.options[hidden],.segmented[hidden],.code-out[hidden],.meter[hidden],.color-field[hidden]{display:none}.sheet__body>.figures{padding:0}.qs__main,.qs__side{align-self:start}.qs [data-qs-results-title]:focus{outline:none}.qs__notice-icon{flex:none;block-size:1.125rem;inline-size:1.125rem;margin-block-start:3px}.qs__notice:not(.notice--error) .qs__notice-icon{color:var(--accent)}.qs__notice p{margin:0}.qs-stage{--qs-on-media:#fffffff0;--qs-scrim:#13121c57;--qs-viewport:#13121c;border-radius:var(--radius);transition:box-shadow var(--duration) var(--ease-out)}.qs-stage.is-dragover{box-shadow:0 0 0 3px var(--accent-soft)}.qs-stage__frame{min-block-size:15rem;padding:var(--space-3);border:1px solid var(--sheet-rule);border-radius:var(--radius);background:var(--paper);place-items:center;display:grid;position:relative;overflow:hidden}.qs-stage[data-mode=camera] .qs-stage__frame{aspect-ratio:1;min-block-size:0;max-block-size:min(62vh,30rem);margin-inline:auto}@media (min-width:40rem){.qs-stage[data-mode=camera] .qs-stage__frame{aspect-ratio:4/3}}.qs-stage[data-mode=camera] .qs-stage__frame{background:var(--qs-viewport);border-color:#0000;padding:0}.qs-stage__video{object-fit:cover;block-size:100%;inline-size:100%;position:absolute;inset:0}.qs-stage__video.is-mirrored{transform:scaleX(-1)}.qs-stage__reticle{pointer-events:none;place-items:center;display:grid;position:absolute;inset:0}.qs-stage__reticle[hidden]{display:none}.qs-stage__sweep{--corner:1.75rem;--stroke:3px;aspect-ratio:1;border-radius:var(--radius-lg);background:linear-gradient(var(--qs-on-media) 0 0) 0 0/var(--corner) var(--stroke), linear-gradient(var(--qs-on-media) 0 0) 0 0/var(--stroke) var(--corner), linear-gradient(var(--qs-on-media) 0 0) 100% 0/var(--corner) var(--stroke), linear-gradient(var(--qs-on-media) 0 0) 100% 0/var(--stroke) var(--corner), linear-gradient(var(--qs-on-media) 0 0) 0 100%/var(--corner) var(--stroke), linear-gradient(var(--qs-on-media) 0 0) 0 100%/var(--stroke) var(--corner), linear-gradient(var(--qs-on-media) 0 0) 100% 100%/var(--corner) var(--stroke), linear-gradient(var(--qs-on-media) 0 0) 100% 100%/var(--stroke) var(--corner);inline-size:min(64%,17rem);box-shadow:0 0 0 100vmax var(--qs-scrim);background-repeat:no-repeat;position:relative;overflow:hidden}.qs-stage__sweep:after{content:"";background:linear-gradient(var(--accent), var(--accent)) top/100% 2px no-repeat;filter:drop-shadow(0 0 6px color-mix(in srgb, var(--accent) 70%, transparent));pointer-events:none;animation:qs-sweep 2.4s var(--ease-in-out) infinite alternate;position:absolute;inset-block:8%;inset-inline:8%}.qs-stage__picture{max-inline-size:100%;line-height:0;display:inline-block;position:relative}.qs-stage__picture[hidden]{display:none}.qs-stage__picture.is-reading:after{content:"";background:linear-gradient(var(--accent), var(--accent)) top/100% 2px no-repeat;filter:drop-shadow(0 0 6px color-mix(in srgb, var(--accent) 70%, transparent));pointer-events:none;animation:qs-sweep 1.6s var(--ease-in-out) infinite alternate;position:absolute;inset:0}.qs-stage__image{border-radius:var(--radius-sm);max-block-size:60vh;max-inline-size:100%;box-shadow:var(--shadow-sheet);display:block}.qs-stage__image.is-broken{visibility:hidden;min-block-size:12rem;min-inline-size:12rem}.qs-stage__marks{pointer-events:none;block-size:100%;inline-size:100%;position:absolute;inset:0;overflow:visible}.qs-stage__mark{fill:color-mix(in srgb, var(--accent) 16%, transparent);stroke:var(--accent);stroke-width:3px;stroke-linejoin:round;vector-effect:non-scaling-stroke;stroke-dasharray:1;animation:qs-trace var(--duration-slow) var(--ease-out) both}.qs-stage__badges{pointer-events:none;position:absolute;inset:0}.qs-stage__badge{box-shadow:0 0 0 2px var(--sheet);position:absolute;transform:translate(-35%,-35%)}@keyframes qs-sweep{0%{opacity:.35;transform:translateY(0)}to{opacity:.95;transform:translateY(100%)}}@keyframes qs-trace{0%{stroke-dashoffset:1px;fill-opacity:0}to{stroke-dashoffset:0;fill-opacity:1}}@media (prefers-reduced-motion:reduce){.qs-stage__sweep:after,.qs-stage__picture.is-reading:after{opacity:.5;animation:none}}.qs-engine{gap:var(--space-2);display:grid}.qs-engine[hidden]{display:none}.qs-engine__head{justify-content:space-between;gap:var(--space-3);color:var(--ink-2);font-size:var(--text-sm);display:flex}.qs-engine__value{color:var(--accent);font-family:var(--font-display);font-weight:600}.qs-empty{place-items:center;gap:var(--space-3);padding:var(--space-8) var(--space-5);border:1.5px dashed var(--line-strong);border-radius:var(--radius);color:var(--ink-3);font-size:var(--text-sm);text-align:center;text-wrap:balance;display:grid}.qs-empty[hidden]{display:none}.qs-empty__icon{block-size:2.5rem;inline-size:2.5rem;color:var(--line-strong);stroke-width:1.25px}.qs-empty p{max-inline-size:17rem;margin:0}.qs-results{gap:var(--space-5);margin:0;padding:0;list-style:none;display:grid}.qs-results[hidden]{display:none}.qs-result{gap:var(--space-3);min-inline-size:0;animation:qs-arrive var(--duration-slow) var(--ease-out) both;display:grid}.qs-result+.qs-result{border-block-start:1px solid var(--sheet-rule);padding-block-start:var(--space-5)}.qs-result__head{gap:var(--space-2);flex-wrap:wrap;align-items:center;display:flex}.qs-result__type{gap:var(--space-2);color:var(--ink);align-items:center;font-size:.875rem;font-weight:650;display:inline-flex}.qs-result__type .icon{block-size:1.125rem;inline-size:1.125rem;color:var(--accent)}.qs-result__format{color:var(--ink-3);font-size:var(--text-xs);letter-spacing:.02em;margin-inline-start:auto;font-weight:550}.qs-result__body{gap:var(--space-3);min-inline-size:0;display:grid}.qs-result__title{overflow-wrap:anywhere;color:var(--ink);font-family:var(--font-display);font-size:var(--text-lg);margin:0;font-weight:500;line-height:1.3}.qs-result__subtitle{color:var(--ink-2);font-size:var(--text-sm);margin:0;margin-block-start:calc(-1 * var(--space-2))}.qs-result__figure{overflow-wrap:anywhere;color:var(--accent);font-family:"Literata Variable", var(--font-display);font-size:var(--text-xl);letter-spacing:.01em;margin:0;font-weight:500;line-height:1.2}.qs-result__hint{color:var(--ink-3);font-size:var(--text-sm);margin:0}.qs-result__actions{gap:var(--space-2);flex-wrap:wrap;display:flex}.qs-result__actions>.btn{flex:auto}@keyframes qs-arrive{0%{opacity:0;transform:translateY(6px)}}.qs-badge{block-size:1.5rem;min-inline-size:1.5rem;padding-inline:var(--space-1);background:var(--accent);color:var(--accent-ink);font-family:"Literata Variable", var(--font-display);font-size:var(--text-xs);border-radius:999px;place-items:center;font-weight:650;line-height:1;display:inline-grid}.qs-link__url{overflow-wrap:anywhere;color:var(--ink-3);font-family:var(--font-mono);font-size:var(--text-sm);text-align:start;margin:0;line-height:1.55}.qs-link__strong{color:var(--ink);font-weight:650}.qs-link__userinfo{color:var(--danger);text-decoration:line-through}.qs-check{font-size:var(--text-sm)}.qs-check>.icon{flex:none;block-size:1.125rem;inline-size:1.125rem;margin-block-start:1px}.qs-check:not(.notice--error)>.icon{color:var(--accent)}.qs-check__list{gap:var(--space-2);margin:0;padding:0;list-style:none;display:grid}.qs-rows{margin:0;display:grid}.qs-rows__row{gap:var(--space-3);padding-block:var(--space-2);border-block-end:1px dotted var(--line-strong);grid-template-columns:minmax(5.5rem,auto) minmax(0,1fr);display:grid}.qs-rows__row:first-child{padding-block-start:0}.qs-rows__row:last-child{border-block-end:0}.qs-rows dt{color:var(--ink-2);font-size:var(--text-sm)}.qs-rows dd{overflow-wrap:anywhere;color:var(--ink);white-space:pre-line;margin:0}.qs-rows__mono{font-family:var(--font-mono);font-size:.875rem}.qs-rows:empty{display:none}.qs-text{max-block-size:16rem;padding:var(--space-3);border:1px solid var(--sheet-rule);border-radius:var(--radius);background:var(--paper);overflow-wrap:anywhere;white-space:pre-wrap;margin:0;overflow:auto}.qs-raw__summary{gap:var(--space-1);min-block-size:1.5rem;color:var(--ink-2);font-size:var(--text-sm);cursor:pointer;align-items:center;font-weight:600;list-style:none;display:inline-flex}.qs-raw__summary::-webkit-details-marker{display:none}.qs-raw__summary:hover{color:var(--ink)}.qs-raw__summary .icon{block-size:1rem;inline-size:1rem;transition:transform var(--duration) var(--ease-out);transform:rotate(-90deg)}.qs-raw[open] .qs-raw__summary .icon{transform:none}.qs-raw__code{white-space:pre-wrap;overflow-wrap:anywhere;max-block-size:10rem;margin-block-start:var(--space-2)}[dir=rtl] .qs-raw__summary .icon{transform:rotate(90deg)}[dir=rtl] .qs-raw[open] .qs-raw__summary .icon{transform:none}