@layer components{@scope(.rgb-color-match-root){:scope{--rgb-surface:#fff;--rgb-stage-surface:#fff;--rgb-panel:#f4f6fa;--rgb-text:#19243a;--rgb-muted:#657087;--rgb-reading-muted:#4b586e;--rgb-body-size:1rem;--rgb-label-size:.875rem;--rgb-note-size:.8125rem;--rgb-line:#dfe5ef;--rgb-accent:#2862d9;--rgb-red:#eb3c52;--rgb-green:#15976b;--rgb-blue:#3275ed;--rgb-extreme:#9a36b4;--rgb-full-score:#ad4500;--rgb-dark:#101d35;--rgb-on-dark:#fff;--rgb-switch-off:#64748b;--rgb-countdown-surface:var(--rgb-surface);--rgb-countdown-ink:var(--rgb-text);--rgb-title-scale:1.5;--rgb-space:clamp(18px, 3vw, 36px);--rgb-social-gap:24px;--rgb-stage-height:760px;--rgb-play-inset:30px;--rgb-toolbar-inset:var(--rgb-play-inset);--rgb-toolbar-button-size:44px;--rgb-toolbar-height:calc(var(--rgb-toolbar-inset) + var(--rgb-toolbar-button-size));--rgb-tricolor:linear-gradient(90deg, var(--rgb-red) 0 33.333%, var(--rgb-green) 33.333% 66.666%, var(--rgb-blue) 66.666%);color:var(--rgb-text);--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}.rgb-color-match-heading{text-align:center;margin-block:28px 24px}.rgb-color-match-heading>p:first-child{color:var(--rgb-muted);letter-spacing:.18em;justify-content:center;align-items:center;gap:10px;font-size:.7rem;font-weight:800;display:flex}.rgb-color-match-heading h1{letter-spacing:-.04em;margin-block:8px 18px;font-size:clamp(2rem,4.4vw,3rem);font-weight:300;line-height:1.3}.rgb-color-match-heading>p:last-child{color:var(--rgb-muted);margin:0;font-size:.9rem}.rgb-color-match-title-mark{vertical-align:baseline;font-size:calc(1em * var(--rgb-title-scale));letter-spacing:-.055em;isolation:isolate;gap:.025em;margin-inline-end:.12em;font-weight:900;line-height:1;display:inline-flex}.rgb-color-match-title-mark>span{--rgb-title-knob:22%;color:var(--rgb-red);padding-inline:.035em;position:relative}.rgb-color-match-title-mark>span:nth-child(2){--rgb-title-knob:50%;color:var(--rgb-green)}.rgb-color-match-title-mark>span:nth-child(3){--rgb-title-knob:78%;color:var(--rgb-blue)}.rgb-color-match-title-mark>span:after{content:"";opacity:.3;z-index:-1;background:currentColor;height:.045em;position:absolute;inset:auto .04em -.065em}.rgb-color-match-title-mark>span:before{content:"";left:var(--rgb-title-knob);border-radius:var(--radius-full);outline:2px solid var(--rgb-surface);background:currentColor;width:.1em;height:.1em;position:absolute;bottom:-.09em}.rgb-color-match-dot-trio{gap:4px;display:inline-flex}.rgb-color-match-dot-trio i{background:var(--rgb-red);border-radius:var(--radius-full);width:8px;height:8px}.rgb-color-match-dot-trio i:nth-child(2){background:var(--rgb-green)}.rgb-color-match-dot-trio i:nth-child(3){background:var(--rgb-blue)}.rgb-color-match-shell{background:var(--rgb-stage-surface);border:1px solid var(--rgb-line);border-radius:var(--radius-s);isolation:isolate;width:100%;padding-top:var(--rgb-toolbar-height);position:relative;overflow:hidden}.rgb-color-match-shell:is(.is-ready,.is-result){background:var(--rgb-surface)}button,select,summary{cursor:pointer}button{border:1px solid var(--rgb-line);border-radius:var(--radius-s);background:var(--rgb-surface);min-height:48px;color:var(--rgb-text);font:inherit;touch-action:manipulation;justify-content:center;align-items:center;gap:10px;padding:12px 20px;font-weight:700;line-height:1.4;transition:background-color .16s,border-color .16s,transform .16s;display:inline-flex}button svg{flex:none;font-size:1.4em}button:disabled{opacity:.4;cursor:default}.rgb-color-match-primary{background:var(--rgb-text);border-color:var(--rgb-text);color:var(--rgb-surface)}.rgb-color-match-primary svg{margin-left:auto}button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid var(--rgb-blue);outline-offset:4px}.rgb-color-match-eyebrow{letter-spacing:.08em;color:var(--rgb-muted);margin:0;font-size:.72rem;font-weight:800}.rgb-color-match-note{color:var(--rgb-muted);font-size:.72rem;line-height:1.8}.rgb-color-match-actions{flex-wrap:wrap;justify-content:center;gap:12px;display:flex}.rgb-color-match-overlay{background:var(--rgb-dark);padding:var(--rgb-space);z-index:3;color:var(--rgb-on-dark);place-items:safe center center;display:grid;position:absolute;inset:0;overflow-y:auto}.rgb-color-match-overlay>div{text-align:center;gap:16px;width:min(100%,360px);display:grid}.rgb-color-match-overlay h2{margin:0;font-size:2rem}.rgb-color-match-overlay p{color:#b6c4dc}.rgb-color-match-overlay .rgb-color-match-primary{background:var(--rgb-blue);border-color:var(--rgb-blue)}.rgb-color-match-overlay button{min-height:54px}.game-social-actions{margin-block:var(--rgb-social-gap)}.rgb-color-match-save-status{display:flow-root}@media (hover:hover){button:enabled:hover{background:var(--rgb-panel);border-color:var(--rgb-text);transform:translateY(-1px)}.rgb-color-match-primary:enabled:hover{background:var(--rgb-accent);border-color:var(--rgb-accent)}select:hover{border-color:var(--rgb-accent)}summary:hover{color:var(--rgb-accent)}}@media (max-width:820px){:scope{--rgb-play-inset:20px}}@media (max-width:520px){:scope{--rgb-play-inset:10px}.rgb-color-match-heading{margin:20px 16px}.rgb-color-match-heading h1{font-size:2rem}.rgb-color-match-heading>p:last-child{font-size:.78rem}.rgb-color-match-shell{border-radius:0}button{padding-inline:14px}}@media (prefers-reduced-motion:reduce){button{transition:none}}}}
@layer components{@scope(.rgb-color-match-root){.rgb-color-match-setup{grid-template-columns:minmax(0,1fr) minmax(0,1fr);min-height:520px;display:grid}.rgb-color-match-artwork{padding:var(--rgb-space);color:var(--rgb-on-dark);background:var(--rgb-dark);flex-direction:column;justify-content:space-between;display:flex;position:relative;overflow:hidden}.rgb-color-match-artwork-top{z-index:1;letter-spacing:.15em;color:#b6c4dc;justify-content:space-between;align-items:center;gap:12px;font-size:.64rem;font-weight:700;display:flex;position:relative}.rgb-color-match-artwork-wordmark{z-index:1;letter-spacing:-.08em;align-self:flex-start;font-size:clamp(3rem,6vw,5rem);font-weight:900;line-height:.9;position:relative}.rgb-color-match-orbits{isolation:isolate;position:absolute;inset:80px 24px 96px}.rgb-color-match-orbits>i{aspect-ratio:1;border-radius:var(--radius-full);mix-blend-mode:screen;background:#ff3452;width:58%;position:absolute;top:0;left:21%}.rgb-color-match-orbits>i:nth-child(2){background:#12df83;top:33%;left:0}.rgb-color-match-orbits>i:nth-child(3){background:#2168ff;top:33%;left:42%}.rgb-color-match-orbits>i:nth-child(4){opacity:.8;background:#2168ff;width:20%;top:4%;left:1%}.rgb-color-match-orbits>i:nth-child(5){opacity:.85;background:#ff3452;width:24%;top:67%;left:72%}.rgb-color-match-orbits>i:nth-child(6){opacity:.8;background:#12df83;width:15%;top:80%;left:18%}.rgb-color-match-setup-panel{flex-direction:column;justify-content:center;padding:clamp(24px,4vw,48px);display:flex}.rgb-color-match-setup-panel h2{letter-spacing:-.04em;margin:10px 0;font-size:clamp(1.4rem,2.7vw,2rem);font-weight:900}.rgb-color-match-colorful-copy{background:linear-gradient(105deg, color-mix(in srgb, var(--rgb-red) 80%, var(--rgb-text)) 10%, color-mix(in srgb, var(--rgb-green) 80%, var(--rgb-text)) 50%, color-mix(in srgb, var(--rgb-blue) 80%, var(--rgb-text)) 90%);color:#0000;-webkit-background-clip:text;background-clip:text;display:inline-block}@media (forced-colors:active){.rgb-color-match-colorful-copy{color:canvastext;background:0 0}}.rgb-color-match-game-facts{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:24px 0;display:grid}.rgb-color-match-game-facts>div{background:var(--rgb-panel);border-radius:var(--radius-s);text-align:center;padding:12px 8px}.rgb-color-match-game-facts strong{font-variant-numeric:tabular-nums;font-size:1.75rem;line-height:1.4;display:block}.rgb-color-match-game-facts small{margin-left:3px;font-size:.66rem;font-weight:500}.rgb-color-match-game-facts span{color:var(--rgb-muted);font-size:.7rem}.rgb-color-match-setup-panel fieldset{border:0;min-width:0;margin:0;padding:0}.rgb-color-match-setup-panel legend{font-size:var(--rgb-label-size);margin-bottom:10px;font-weight:700}.rgb-color-match-setup-panel .rgb-color-match-theme-control>span{font-size:var(--rgb-label-size)}.rgb-color-match-difficulties{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;display:grid}.rgb-color-match-difficulties button{flex-direction:column;gap:7px;padding:10px 4px;font-size:.84rem}.rgb-color-match-difficulties button[aria-pressed=true]{background:var(--rgb-text);border-color:var(--rgb-text);color:var(--rgb-surface)}.rgb-color-match-difficulty-dots{gap:3px;display:flex}.rgb-color-match-difficulty-dots i{border-radius:var(--radius-full);opacity:.2;background:currentColor;width:5px;height:5px}.rgb-color-match-difficulty-dots i[data-filled=true]{opacity:1}.rgb-color-match-palette-note{min-height:1.8em;color:var(--rgb-muted);margin-block:10px 20px;font-size:.72rem}.rgb-color-match-start{width:100%;min-height:56px}.rgb-color-match-setup-panel>.rgb-color-match-note{margin:12px 0 0}.rgb-color-match-setup-panel .rgb-color-match-settings{gap:16px;margin-block:16px 0}.rgb-color-match-setup-panel .rgb-color-match-setting-options{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;display:grid}.rgb-color-match-setup-panel .game-sound-setting{--switch-width:44px;--switch-height:26px;--switch-thumb-size:18px;--switch-control-height:44px;--switch-on:var(--rgb-text);--switch-on-thumb:var(--rgb-surface);--switch-off:var(--rgb-switch-off);--switch-off-border:var(--rgb-switch-off);--switch-thumb:var(--rgb-on-dark);--switch-focus:var(--rgb-accent);--switch-hover:var(--rgb-text);background:var(--rgb-panel);border-radius:var(--radius-s);min-width:0;color:var(--rgb-text);font-size:var(--rgb-label-size);gap:8px;margin:0;padding:0 8px}.rgb-color-match-setup-panel .game-sound-setting>span{white-space:nowrap}.rgb-color-match-setup-panel .game-sound-setting>span svg{display:none}@media (hover:hover){.rgb-color-match-difficulties button[aria-pressed=true]:hover{background:var(--rgb-text);border-color:var(--rgb-text)}}@media (max-width:820px){.rgb-color-match-setup{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr)}}@media (max-width:520px){.rgb-color-match-setup{grid-template-columns:minmax(0,1fr);min-height:0}.rgb-color-match-artwork{height:170px;padding:22px}.rgb-color-match-artwork-top{z-index:1;font-size:.55rem;position:relative}.rgb-color-match-orbits{inset:12px 8px 12px 45%}.rgb-color-match-orbits>i:nth-child(-n+3){width:52%}.rgb-color-match-setup-panel{padding:24px}.rgb-color-match-game-facts{margin-block:18px}.rgb-color-match-palette-note{margin-bottom:16px}}}}
@layer components{@scope(.rgb-color-match-root){.rgb-color-match-orbits{--rgb-orbit-cycle:16s;--rgb-orbit-tilt:10deg;--rgb-orbit-travel:1}@media (max-width:520px){.rgb-color-match-orbits{--rgb-orbit-travel:.7}}@media (prefers-reduced-motion:no-preference){.rgb-color-match-orbits{animation:rgb-color-match-orbit-sway calc(var(--rgb-orbit-cycle) * 1.5) ease-in-out infinite}.rgb-color-match-orbits>i{animation:rgb-color-match-orbit-red var(--rgb-orbit-cycle) ease-in-out infinite}.rgb-color-match-orbits>i:nth-child(2){animation-name:rgb-color-match-orbit-green;animation-duration:calc(var(--rgb-orbit-cycle) * 1.125);animation-delay:-4s}.rgb-color-match-orbits>i:nth-child(3){animation-name:rgb-color-match-orbit-blue;animation-duration:calc(var(--rgb-orbit-cycle) * 1.25);animation-delay:-7s}.rgb-color-match-orbits>i:nth-child(4){animation-name:rgb-color-match-orbit-satellite-blue;animation-duration:calc(var(--rgb-orbit-cycle) * 1.4);animation-delay:-5s}.rgb-color-match-orbits>i:nth-child(5){animation-name:rgb-color-match-orbit-satellite-red;animation-duration:calc(var(--rgb-orbit-cycle) * 1.6);animation-delay:-10s}.rgb-color-match-orbits>i:nth-child(6){animation-name:rgb-color-match-orbit-satellite-green;animation-duration:calc(var(--rgb-orbit-cycle) * 1.2);animation-delay:-3s}.rgb-color-match-artwork[data-moving=false] :where(.rgb-color-match-orbits,.rgb-color-match-orbits>i){animation-play-state:paused}}@keyframes rgb-color-match-orbit-satellite-blue{0%,to{transform:translate(-100%,-100%)scale(.85)}45%{transform:translate(300%,75%)scale(1.1)}75%{transform:translate(-90%,280%)scale(.95)}}@keyframes rgb-color-match-orbit-satellite-red{0%,to{transform:translate(100%,80%)scale(1)}40%{transform:translate(-70%,-240%)scale(.8)}70%{transform:translate(-300%,60%)scale(1.05)}}@keyframes rgb-color-match-orbit-satellite-green{0%,to{transform:translate(-180%,90%)scale(1)}35%{transform:translate(350%,-160%)scale(1.15)}70%{transform:translate(40%,-480%)scale(.8)}}@keyframes rgb-color-match-orbit-sway{0%,to{transform:rotate(calc(-1 * var(--rgb-orbit-tilt)))}50%{transform:rotate(var(--rgb-orbit-tilt))}}@keyframes rgb-color-match-orbit-red{0%,to{transform:translate(0, calc(-42% * var(--rgb-orbit-travel))) scale(.98)}35%{transform:translate(calc(-70% * var(--rgb-orbit-travel)), calc(55% * var(--rgb-orbit-travel))) scale(1.04)}70%{transform:translate(calc(65% * var(--rgb-orbit-travel)), calc(110% * var(--rgb-orbit-travel))) scale(1)}}@keyframes rgb-color-match-orbit-green{0%,to{transform:translate(calc(-38% * var(--rgb-orbit-travel)), calc(34% * var(--rgb-orbit-travel))) scale(1)}40%{transform:translate(calc(95% * var(--rgb-orbit-travel)), calc(-65% * var(--rgb-orbit-travel))) scale(.98)}75%{transform:translate(calc(20% * var(--rgb-orbit-travel)), calc(110% * var(--rgb-orbit-travel))) scale(1.04)}}@keyframes rgb-color-match-orbit-blue{0%,to{transform:translate(calc(45% * var(--rgb-orbit-travel)), calc(6% * var(--rgb-orbit-travel))) scale(1.02)}30%{transform:translate(calc(-85% * var(--rgb-orbit-travel)), calc(90% * var(--rgb-orbit-travel))) scale(.98)}65%{transform:translate(calc(-30% * var(--rgb-orbit-travel)), calc(-90% * var(--rgb-orbit-travel))) scale(1.04)}}}}
@layer components{@scope(.rgb-color-match-root){.rgb-color-match-board{padding:var(--rgb-play-inset)}.rgb-color-match-hud{justify-content:space-between;align-items:center;gap:16px;min-height:44px;padding-inline:56px;display:flex}.rgb-color-match-round{align-items:center;gap:12px;display:flex}.rgb-color-match-round>span{letter-spacing:.1em;color:var(--rgb-muted);font-size:.64rem;font-weight:800}.rgb-color-match-round strong{font-variant-numeric:tabular-nums;font-size:1.6rem}.rgb-color-match-round small{color:var(--rgb-muted);font-size:.85rem;font-weight:500}.rgb-color-match-clock{align-items:center;gap:8px;min-width:94px;display:flex}.rgb-color-match-clock strong{font-variant-numeric:tabular-nums;letter-spacing:-.04em;font-size:1.7rem}.rgb-color-match-clock small{letter-spacing:normal;margin-left:2px;font-size:.8rem}.rgb-color-match-clock>span{color:var(--rgb-muted);font-size:.62rem}.rgb-color-match-clock[data-urgent=true] strong{color:var(--rgb-red)}progress{appearance:none;border-radius:var(--radius-full);background:var(--rgb-panel);width:100%;height:4px;accent-color:var(--rgb-blue);border:0;margin:14px 0 22px;display:block;overflow:hidden}progress::-webkit-progress-bar{background:var(--rgb-panel)}progress::-webkit-progress-value{background:var(--rgb-blue);border-radius:var(--radius-full)}progress::-moz-progress-bar{background:var(--rgb-blue);border-radius:var(--radius-full)}.rgb-color-match-color-pair{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;margin-bottom:20px;display:grid}.rgb-color-match-preview{min-width:0}.rgb-color-match-preview-label{justify-content:space-between;align-items:center;gap:8px;margin-bottom:10px;font-size:.8rem;font-weight:700;display:flex}.rgb-color-match-preview-label small{color:var(--rgb-muted);font-size:.58rem;font-weight:500}.rgb-color-match-play-swatch,.rgb-color-match-target{border:1px solid var(--rgb-line);border-radius:var(--radius-s);height:clamp(150px,25vh,240px)}.rgb-color-match-slider-heading{justify-content:space-between;align-items:center;gap:12px;margin:0 0 12px;display:flex}.rgb-color-match-slider-heading strong{font-size:.9rem}.rgb-color-match-slider-heading>span{color:var(--rgb-muted);font-size:.68rem}.rgb-color-match-sliders{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;display:grid}.rgb-color-match-channel{--rgb-channel-color:var(--rgb-red);background:var(--rgb-panel);border-radius:var(--radius-s);grid-template-columns:26px minmax(0,1fr) auto 44px;align-items:center;gap:4px 8px;padding:10px 14px 2px;display:grid}.rgb-color-match-channel-g{--rgb-channel-color:var(--rgb-green)}.rgb-color-match-channel-b{--rgb-channel-color:var(--rgb-blue)}.rgb-color-match-channel-letter{background:var(--rgb-channel-color);width:24px;height:24px;color:var(--rgb-surface);border-radius:var(--radius-s);place-items:center;font-size:.75rem;font-weight:800;display:grid}.rgb-color-match-channel-name{letter-spacing:.06em;color:var(--rgb-muted);font-size:.65rem;font-weight:700}.rgb-color-match-channel output{text-align:right;font-variant-numeric:tabular-nums;font-size:1.25rem;font-weight:800;line-height:1.3}.rgb-color-match-stepper{gap:4px;display:flex}.rgb-color-match-stepper button{width:44px;height:44px;min-height:44px;padding:0;font-size:1.15rem;font-weight:700}.rgb-color-match-range{grid-column:1/-1;position:relative}.rgb-color-match-center-tick{background:var(--rgb-surface);pointer-events:none;z-index:1;width:2px;height:18px;position:absolute;top:13px;left:50%}.rgb-color-match-channel input{appearance:none;z-index:2;cursor:pointer;touch-action:none;-webkit-tap-highlight-color:transparent;background:0 0;width:100%;min-width:0;height:44px;margin:0;display:block;position:relative}.rgb-color-match-channel input::-webkit-slider-runnable-track{background:var(--rgb-track);border-radius:var(--radius-full);height:8px}.rgb-color-match-channel input[data-pointer-focus=true]:focus-visible{outline:none}.rgb-color-match-channel input::-webkit-slider-thumb{appearance:none;width:var(--rgb-thumb-size);height:var(--rgb-thumb-size);margin-top:calc((8px - var(--rgb-thumb-size)) / 2);border:3px solid var(--rgb-surface);border-radius:var(--radius-full);background:var(--rgb-channel-color);box-shadow:0 0 0 1px var(--rgb-channel-color)}.rgb-color-match-channel input::-moz-range-track{background:var(--rgb-track);border-radius:var(--radius-full);height:8px}.rgb-color-match-channel input::-moz-range-thumb{width:calc(var(--rgb-thumb-size) - 6px);height:calc(var(--rgb-thumb-size) - 6px);border:3px solid var(--rgb-surface);border-radius:var(--radius-full);background:var(--rgb-channel-color);box-shadow:0 0 0 1px var(--rgb-channel-color)}.rgb-color-match-board-actions{grid-template-columns:1fr 1.2fr;gap:12px;width:min(100%,540px);margin:22px auto 0;display:grid}.rgb-color-match-board-actions>button{min-height:56px;font-size:.9rem}.rgb-color-match-hint>span{text-align:left;display:grid}.rgb-color-match-hint small{color:var(--rgb-muted);font-size:.58rem;font-weight:500}@media (hover:hover){.rgb-color-match-channel input:hover::-webkit-slider-thumb{box-shadow:0 0 0 3px color-mix(in srgb, var(--rgb-channel-color), transparent 70%)}.rgb-color-match-channel input:hover::-moz-range-thumb{box-shadow:0 0 0 3px color-mix(in srgb, var(--rgb-channel-color), transparent 70%)}}@media (max-width:820px){.rgb-color-match-sliders{grid-template-columns:minmax(0,1fr);gap:8px}.rgb-color-match-channel{gap:0 8px;padding-block:6px 0}.rgb-color-match-round>span{display:none}}@media (max-width:520px){.rgb-color-match-hud{gap:8px}.rgb-color-match-round strong{font-size:1.25rem}.rgb-color-match-round small{font-size:.7rem}.rgb-color-match-clock{justify-content:flex-end;min-width:62px}.rgb-color-match-clock strong{font-size:1.35rem}.rgb-color-match-clock>span{display:none}progress{margin:12px 0 16px}.rgb-color-match-color-pair{gap:12px}.rgb-color-match-preview-label{flex-direction:column;align-items:flex-start;gap:3px;min-height:34px;font-size:.72rem}.rgb-color-match-preview-label small{font-size:.55rem}.rgb-color-match-play-swatch,.rgb-color-match-target{border-radius:var(--radius-s);height:clamp(90px,22dvh,180px)}.rgb-color-match-slider-heading{margin:0 0 10px;display:block}.rgb-color-match-slider-heading>span{margin-top:4px;font-size:.6rem;display:block}.rgb-color-match-channel output{font-size:1.1rem}.rgb-color-match-board-actions{gap:10px;margin-top:16px}.rgb-color-match-board-actions>button{min-height:52px;font-size:.78rem}}@media (max-width:340px){.rgb-color-match-hint{gap:6px;padding-inline:10px}.rgb-color-match-hint>span{white-space:nowrap}}}}
@layer components{@scope(.rgb-color-match-root){.rgb-color-match-target{--rgb-checker-light:#fff;--rgb-checker-dark:#ccc;--rgb-checker-ink:#404040;--rgb-checker-message-surface:#ffffffd9;--rgb-checker-size:8px;background-color:var(--rgb-checker-light);background-image:repeating-conic-gradient(var(--rgb-checker-light) 0% 25%, var(--rgb-checker-dark) 0% 50%);background-size:calc(var(--rgb-checker-size) * 2) calc(var(--rgb-checker-size) * 2);position:relative;overflow:hidden}.rgb-color-match-pixels{grid-template-columns:repeat(var(--rgb-columns), var(--rgb-pixel-size));grid-template-rows:repeat(var(--rgb-rows), var(--rgb-pixel-size));place-content:start;display:grid;position:absolute;inset:0}.rgb-color-match-pixels i{transform:var(--rgb-pixel-transform);transition:transform .1s linear,opacity .1s linear;display:block}.rgb-color-match-target-message{text-align:center;color:var(--rgb-checker-ink);place-items:center;padding:12px;font-size:.8rem;display:grid;position:absolute;inset:0}.rgb-color-match-target-message>span{background:var(--rgb-checker-message-surface);border-radius:var(--radius-s);padding:8px 12px}.rgb-color-match-shell.is-countdown{min-height:520px}.rgb-color-match-countdown{background:var(--rgb-countdown-surface);min-height:520px;color:var(--rgb-countdown-ink);flex-direction:column;justify-content:center;align-items:center;gap:24px;display:flex}.rgb-color-match-countdown strong{font-size:clamp(6rem,18vw,10rem);font-weight:900;line-height:1}.rgb-color-match-countdown p{letter-spacing:.2em;font-size:.7rem}.rgb-color-match-settings{gap:8px;width:100%;margin-block:16px 8px;display:grid}.rgb-color-match-settings .game-sound-setting{justify-content:space-between;width:100%;font-size:.8rem}.rgb-color-match-common-settings{border:0;min-width:0;margin:0;padding:0}.rgb-color-match-common-settings legend{font-size:var(--rgb-label-size);margin-bottom:8px;font-weight:700}.rgb-color-match-overlay .rgb-color-match-settings,.rgb-color-match-overlay .game-sound-setting>span{color:var(--rgb-on-dark)}.rgb-color-match-overlay .game-sound-setting>span svg{color:currentColor}@media (prefers-reduced-motion:reduce){.rgb-color-match-pixels i{transition:none;transform:none}}}}
@layer components{@scope(.rgb-color-match-root){:scope{--flag-safe-area-bg:var(--rgb-surface)}.rgb-color-match-shell.is-pseudo-fullscreen{width:100vw;max-width:none;height:var(--flag-viewport-height,100dvh);overscroll-behavior:contain;min-height:0;padding-top:var(--rgb-toolbar-height);border:0;border-radius:0;margin-inline:calc(50% - 50vw);overflow:auto}.rgb-color-match-toolbar{inset:var(--rgb-toolbar-inset) var(--rgb-toolbar-inset) auto;z-index:4;pointer-events:none;display:flex;position:absolute}.rgb-color-match-toolbar button{width:var(--rgb-toolbar-button-size);height:var(--rgb-toolbar-button-size);min-height:var(--rgb-toolbar-button-size);pointer-events:auto;padding:0}.rgb-color-match-fullscreen-toggle{margin-left:auto}.rgb-color-match-shell.is-ready,.rgb-color-match-shell.is-countdown,.rgb-color-match-shell.is-answer{padding-top:0}.is-pseudo-fullscreen .rgb-color-match-board{width:min(100%,1180px);margin-inline:auto}.is-pseudo-fullscreen.is-answer{overflow:hidden}.is-pseudo-fullscreen .rgb-color-match-channel input{touch-action:none}.is-pseudo-fullscreen.is-answer .rgb-color-match-content{height:100%;min-height:0}.is-pseudo-fullscreen.is-answer .rgb-color-match-board{grid-template-rows:auto auto minmax(0,1fr) auto auto auto;height:100%;min-height:0;display:grid}.is-pseudo-fullscreen.is-answer .rgb-color-match-color-pair{min-height:0}.is-pseudo-fullscreen.is-answer .rgb-color-match-preview{flex-direction:column;min-height:0;display:flex}.is-pseudo-fullscreen.is-answer :where(.rgb-color-match-play-swatch,.rgb-color-match-target){flex:1;height:auto;min-height:0}.is-pseudo-fullscreen .rgb-color-match-overlay{min-height:100%}.is-pseudo-fullscreen .rgb-color-match-countdown{min-height:var(--flag-viewport-height,100dvh)}@media (min-width:821px){.rgb-color-match-shell.is-answer{padding-top:var(--rgb-toolbar-height)}.rgb-color-match-board{padding-top:10px}.rgb-color-match-hud{padding-inline:0}.rgb-color-match-shell:not(.is-pseudo-fullscreen):is(.is-ready,.is-countdown,.is-answer){height:var(--rgb-stage-height)}.rgb-color-match-shell:not(.is-pseudo-fullscreen):is(.is-ready,.is-countdown,.is-answer) .rgb-color-match-content,.rgb-color-match-shell:not(.is-pseudo-fullscreen) :where(.rgb-color-match-setup,.rgb-color-match-countdown){height:100%;min-height:0}.rgb-color-match-shell:not(.is-pseudo-fullscreen).is-answer .rgb-color-match-board{grid-template-rows:auto auto minmax(0,1fr) auto auto auto;height:100%;min-height:0;display:grid}.rgb-color-match-shell:not(.is-pseudo-fullscreen).is-answer .rgb-color-match-color-pair{min-height:0}.rgb-color-match-shell:not(.is-pseudo-fullscreen).is-answer .rgb-color-match-preview{flex-direction:column;min-height:0;display:flex}.rgb-color-match-shell:not(.is-pseudo-fullscreen).is-answer :where(.rgb-color-match-play-swatch,.rgb-color-match-target){flex:1;height:auto;min-height:0}}@media (max-width:520px){.is-pseudo-fullscreen progress{margin:6px 0 10px}.is-pseudo-fullscreen .rgb-color-match-slider-heading{display:none}.is-pseudo-fullscreen .rgb-color-match-board-actions{margin-top:12px}@media (max-height:600px){.is-pseudo-fullscreen .rgb-color-match-preview-label small{display:none}.is-pseudo-fullscreen .rgb-color-match-preview-label{min-height:20px;margin-bottom:6px}}}@media (orientation:landscape) and (max-height:520px){.is-pseudo-fullscreen .rgb-color-match-hud :where(strong){font-size:1.2rem}.is-pseudo-fullscreen progress{margin:6px 0 8px}.is-pseudo-fullscreen .rgb-color-match-sliders{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.is-pseudo-fullscreen .rgb-color-match-slider-heading{display:none}.is-pseudo-fullscreen .rgb-color-match-preview-label{min-height:0;margin-bottom:6px}.is-pseudo-fullscreen .rgb-color-match-preview-label small{display:none}.is-pseudo-fullscreen .rgb-color-match-board-actions{margin-top:8px}.is-pseudo-fullscreen .rgb-color-match-board-actions>button{min-height:44px;padding-block:6px}}@media (max-height:600px){.is-pseudo-fullscreen .rgb-color-match-overlay{padding:16px}.is-pseudo-fullscreen .rgb-color-match-overlay>div{gap:8px}.is-pseudo-fullscreen .rgb-color-match-overlay h2{font-size:1.4rem;line-height:1.3}.is-pseudo-fullscreen .rgb-color-match-overlay p{margin:0;font-size:.8rem;line-height:1.5}.is-pseudo-fullscreen .rgb-color-match-overlay .rgb-color-match-settings{gap:4px;margin-block:8px}.is-pseudo-fullscreen .rgb-color-match-overlay .game-sound-setting{margin:0}.is-pseudo-fullscreen .rgb-color-match-overlay button{min-height:44px;padding-block:8px}}@media (orientation:landscape) and (max-height:520px) and (max-width:700px){.is-pseudo-fullscreen .rgb-color-match-channel{-moz-column-gap:4px;grid-template-columns:24px auto 30px;column-gap:4px;padding-inline:8px}.is-pseudo-fullscreen .rgb-color-match-channel-name{display:none}.is-pseudo-fullscreen .rgb-color-match-channel output{font-size:1rem}}}}
@layer components{@scope(.rgb-color-match-root){:scope{--rgb-result-column-gap:20px}.rgb-color-match-result{padding:24px var(--rgb-space) var(--rgb-space)}.rgb-color-match-result-heading{justify-content:space-between;align-items:center;gap:16px;margin-bottom:24px;display:flex}.rgb-color-match-result-heading h2{letter-spacing:-.04em;margin:6px 0 0;font-size:clamp(1.6rem,3vw,2.2rem)}.rgb-color-match-result-difficulty{background:var(--rgb-panel);border:0;border-radius:0;padding:8px 14px;font-size:.8rem;font-weight:700}.rgb-color-match-result-overview{grid-template-columns:1fr 1.2fr;gap:20px;display:grid}.rgb-color-match-total{background:var(--rgb-dark);color:var(--rgb-on-dark);border-radius:0;flex-direction:column;justify-content:center;align-items:center;padding:28px;display:flex}.rgb-color-match-total>svg{color:#b6c4dc;font-size:28px}.rgb-color-match-total h3{margin:10px 0 12px;font-size:.8rem;font-weight:500}.rgb-color-match-total>p{flex-wrap:wrap;justify-content:center;align-items:baseline;gap:12px;margin:0;display:flex}.rgb-color-match-total strong{font-variant-numeric:tabular-nums;letter-spacing:-.05em;font-size:clamp(3rem,6vw,4.8rem);line-height:1.1}.rgb-color-match-total>p>span{color:#b6c4dc;font-size:.85rem}.rgb-color-match-total meter{appearance:none;background:#30405b;border:0;border-radius:0;width:100%;height:6px;margin-top:24px;display:block;overflow:hidden}.rgb-color-match-total meter::-webkit-meter-bar{background:#30405b;border:0;border-radius:0;height:6px}.rgb-color-match-total meter::-webkit-meter-optimum-value{background:var(--rgb-tricolor)}.rgb-color-match-total meter::-moz-meter-bar{background:var(--rgb-tricolor)}.rgb-color-match-result-notice{text-align:center;color:#8df2c6;min-height:24px;margin-top:12px;font-size:.8rem;font-weight:700}.rgb-color-match-result-stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:0;display:grid}.rgb-color-match-result-stats>div{--rgb-stat-accent:var(--rgb-red);background:var(--rgb-panel);border:0;border-radius:0;flex-direction:column;justify-content:center;padding:20px;display:flex}.rgb-color-match-result-stats>[data-stat="1"]{--rgb-stat-accent:var(--rgb-blue)}.rgb-color-match-result-stats>[data-stat="2"]{--rgb-stat-accent:var(--rgb-green)}.rgb-color-match-result-stats>[data-stat="3"]{--rgb-stat-accent:var(--rgb-muted)}.rgb-color-match-result-stats dt{color:var(--rgb-muted);align-items:center;gap:7px;font-size:.75rem;display:flex}.rgb-color-match-result-stats dt:before{content:"";background:var(--rgb-stat-accent);border-radius:0;width:6px;height:6px}.rgb-color-match-result-stats dd{font-variant-numeric:tabular-nums;flex-wrap:wrap;align-items:baseline;gap:6px;margin:12px 0 0;font-size:clamp(1.5rem,3vw,2rem);font-weight:800;display:flex}.rgb-color-match-result-stats small{color:var(--rgb-muted);font-size:.7rem;font-weight:500}.rgb-color-match-result-palette{border:0;border-radius:0;margin-top:24px;padding:20px 0}.rgb-color-match-result-palette>p{margin:0 0 14px;font-size:.8rem;font-weight:700}.rgb-color-match-result-palette>div{grid-template-columns:80px minmax(0,1fr);align-items:center;gap:12px;margin-top:8px;display:grid}.rgb-color-match-result-palette>div>span{color:var(--rgb-muted);font-size:.7rem}.rgb-color-match-result-palette>div>div{gap:4px;display:grid}.rgb-color-match-result-palette i{border:0;border-radius:0;height:28px;display:block}.rgb-color-match-result-actions{justify-items:center;gap:12px;margin:28px 0 36px;display:grid}.rgb-color-match-result-actions .rgb-color-match-actions{gap:var(--rgb-result-column-gap);width:min(100%,520px)}.rgb-color-match-result-actions .rgb-color-match-actions button{flex:1}.rgb-color-match-review-heading{flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:10px;margin-bottom:20px;display:flex}.rgb-color-match-review-heading h3{margin:0;font-size:1.1rem}.rgb-color-match-review-heading p{color:var(--rgb-muted);margin:0;font-size:.75rem;line-height:1.7}.rgb-color-match-results-grid{gap:var(--rgb-result-column-gap);grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.rgb-color-match-results-grid>article{background:var(--rgb-panel);border:0;border-radius:0;min-width:0;padding:16px}.rgb-color-match-results-grid article>header{grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:6px 10px;margin-bottom:12px;display:grid}.rgb-color-match-results-grid h4{margin:0;font-size:.85rem}.rgb-color-match-results-grid .rgb-color-match-question-heading{display:contents}.rgb-color-match-results-grid .rgb-color-match-perfect-badge{grid-area:2/2}.rgb-color-match-question-label{grid-column:1/-1;align-items:center;gap:8px;min-height:24px;display:flex}.rgb-color-match-new-color{color:color-mix(in srgb, var(--rgb-blue) 75%, var(--rgb-text));background:color-mix(in srgb, var(--rgb-blue) 12%, var(--rgb-surface));border-radius:var(--radius-s);white-space:nowrap;padding:2px 6px;font-size:.75rem;font-weight:800;line-height:1.5;display:inline-block}.rgb-color-match-results-grid article>header p{font-variant-numeric:tabular-nums;grid-area:2/1;align-items:baseline;gap:6px;margin:0;display:flex}.rgb-color-match-results-grid article>header p[data-full-score=true] strong{color:var(--rgb-full-score)}.rgb-color-match-results-grid article>header strong{letter-spacing:-.04em;font-size:clamp(2rem,3vw,2.5rem);font-weight:900;line-height:1}.rgb-color-match-results-grid article>header small{color:var(--rgb-muted);font-size:.75rem}.rgb-color-match-comparison{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;display:grid}.rgb-color-match-comparison>div{min-width:0}.rgb-color-match-comparison>div>span:first-child{font-size:var(--rgb-label-size);color:var(--rgb-reading-muted)}.rgb-color-match-swatch{border:1px solid var(--rgb-line);border-radius:0;height:100px;margin-block:8px}.rgb-color-match-comparison code{font-size:var(--rgb-label-size);overflow-wrap:anywhere;-webkit-user-select:text;user-select:text;line-height:1.7;display:block}.rgb-color-match-results-grid .rgb-color-match-swatch{height:64px;margin-block:6px 2px}.rgb-color-match-code{max-width:100%;color:var(--rgb-text);vertical-align:middle;align-items:center;gap:4px;display:inline-flex}.rgb-color-match-code code{overflow-wrap:anywhere;-webkit-user-select:text;user-select:text;min-width:0}.rgb-color-match-code button{width:32px;min-height:32px;color:var(--rgb-muted);background:0 0;border:0;flex:0 0 32px;padding:6px}.rgb-color-match-code button svg{font-size:16px}.rgb-color-match-code-status{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.rgb-color-match-code-error{font-size:.7rem}@media (hover:hover){.rgb-color-match-code button:hover{color:var(--rgb-accent);background:var(--rgb-surface)}}.rgb-color-match-channel-difference{grid-column:1/-1;padding:0}.rgb-color-match-channel-difference p{color:var(--rgb-reading-muted);font-size:var(--rgb-note-size);margin:0 0 6px}.rgb-color-match-channel-difference dl{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:0;display:grid}.rgb-color-match-channel-difference dl>div{--rgb-difference-accent:var(--rgb-red);background:var(--rgb-surface);min-width:0;padding:8px}.rgb-color-match-channel-difference [data-channel="1"]{--rgb-difference-accent:var(--rgb-green)}.rgb-color-match-channel-difference [data-channel="2"]{--rgb-difference-accent:var(--rgb-blue)}.rgb-color-match-channel-difference dt{color:var(--rgb-text);font-size:var(--rgb-label-size);justify-content:space-between;align-items:center;gap:4px;font-weight:800;display:flex}.rgb-color-match-difference-channel{white-space:nowrap}.rgb-color-match-difference-channel b{color:color-mix(in srgb, var(--rgb-difference-accent) 75%, var(--rgb-text))}.rgb-color-match-difference-delta{color:var(--rgb-reading-muted);font-size:var(--rgb-note-size);white-space:nowrap;font-weight:500}.rgb-color-match-channel-difference dd{font-variant-numeric:tabular-nums;font-size:var(--rgb-body-size);justify-content:space-between;align-items:baseline;gap:4px;margin:6px 0 0;display:flex}.rgb-color-match-difference-arrow{color:var(--rgb-reading-muted);font-size:var(--rgb-note-size)}.rgb-color-match-breakdown{grid-column:1/-1;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:0;display:grid}.rgb-color-match-breakdown dt{color:var(--rgb-reading-muted);font-size:var(--rgb-note-size);line-height:1.5}.rgb-color-match-breakdown dd{font-variant-numeric:tabular-nums;margin:3px 0 0;font-size:1rem;font-weight:800}.rgb-color-match-breakdown small{color:var(--rgb-muted);white-space:nowrap;font-size:.6rem;font-weight:500}.rgb-color-match-breakdown [data-full-score=true] :where(dt,dd,small){color:var(--rgb-full-score)}.rgb-color-match-breakdown [data-full-score=true] dd{font-weight:900}.rgb-color-match-question-heading{align-items:center;gap:10px;min-width:0;min-height:28px;display:flex}.rgb-color-match-question-heading :where(h3,h4,time){margin:0}.rgb-color-match-perfect-badge{color:var(--rgb-perfect-text,#165b3b);background:var(--rgb-perfect-surface,#dcefe4);border:1px solid color-mix(in srgb, currentColor 25%, transparent);border-radius:var(--radius-s);font-weight:800;font-size:var(--rgb-label-size);white-space:nowrap;flex:none;align-items:center;gap:5px;margin-left:auto;padding:3px 9px;line-height:1.4;display:inline-flex}.rgb-color-match-perfect-badge svg{width:18px;height:18px}.rgb-color-match-perfect-badge[data-perfect=true]{color:#693600;letter-spacing:.04em;background:linear-gradient(120deg,#fff1b8,#ffd16a);border-color:#d99a24}.game-rule-details li+li{margin-top:10px}@media (max-width:820px){.rgb-color-match-result-overview{grid-template-columns:minmax(0,1fr)}.rgb-color-match-result-stats{grid-template-columns:repeat(4,minmax(0,1fr))}.rgb-color-match-result-stats>div{padding:16px 12px}}@media (max-width:520px){:scope{--rgb-result-column-gap:16px}.rgb-color-match-result{padding:16px}.rgb-color-match-result-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.rgb-color-match-result-stats dd{font-size:1.6rem}.rgb-color-match-total{padding:24px 20px 16px}.rgb-color-match-total strong{font-size:3.6rem}.rgb-color-match-result-palette{padding:16px 0}.rgb-color-match-result-palette>div{grid-template-columns:64px minmax(0,1fr);gap:8px}.rgb-color-match-result-palette>div>div{gap:2px}.rgb-color-match-result-palette i{height:22px}.rgb-color-match-results-grid{grid-template-columns:minmax(0,1fr)}.rgb-color-match-results-grid>article{padding:16px}.rgb-color-match-results-grid .rgb-color-match-perfect-badge{gap:4px;padding:3px 7px;font-size:.75rem}.rgb-color-match-result-actions .rgb-color-match-actions{flex-direction:column}.rgb-color-match-channel-difference dd{font-size:var(--rgb-label-size)}.rgb-color-match-channel-difference dl{gap:6px}.rgb-color-match-channel-difference dl>div{padding:6px}}@media (max-width:340px){.rgb-color-match-channel-difference dt{flex-direction:column;align-items:flex-start}.rgb-color-match-channel-difference dd{gap:2px}}}}
@layer components{@scope(.rgb-color-match-root){.rgb-color-match-records,.rgb-color-match-history{padding:var(--rgb-space);background:var(--rgb-surface);border:1px solid var(--rgb-line);border-radius:var(--radius-s);margin:48px auto}:is(.game-social-actions,.rgb-color-match-save-status)+.rgb-color-match-records{margin-top:var(--rgb-social-gap)}.rgb-color-match-collection-heading{align-items:center;gap:12px;margin-bottom:24px;display:flex}.rgb-color-match-collection-heading h2{letter-spacing:-.03em;margin:4px 0 0;font-size:clamp(1.15rem,2vw,1.4rem);line-height:1.4}.rgb-color-match-collection-heading .rgb-color-match-eyebrow{letter-spacing:.14em;font-size:.6rem}.rgb-color-match-section-icon{height:36px;color:var(--rgb-blue);flex:0 0 36px;place-items:center;font-size:26px;display:grid}.rgb-color-match-bests{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;display:grid}@media (min-width:821px){.rgb-color-match-bests{grid-template-columns:repeat(4,minmax(0,1fr))}}.rgb-color-match-best-card{--rgb-record-accent:var(--rgb-red);background:var(--rgb-panel);text-align:left;border:0;border-radius:0;grid-template-rows:auto 1fr 20px;grid-template-columns:minmax(0,1fr);align-content:start;align-items:start;gap:8px;min-height:180px;padding:22px 24px;font-weight:500;display:grid;position:relative;overflow:hidden}.rgb-color-match-best-card.is-normal{--rgb-record-accent:var(--rgb-green)}.rgb-color-match-best-card.is-hard{--rgb-record-accent:var(--rgb-blue)}.rgb-color-match-best-card.is-extreme{--rgb-record-accent:var(--rgb-extreme)}.rgb-color-match-best-card:before{content:"";background:var(--rgb-record-accent);width:3px;position:absolute;inset:0 auto 0 0}.rgb-color-match-best-card:disabled{opacity:1}.rgb-color-match-best-card[aria-expanded=true]{background:color-mix(in srgb, var(--rgb-record-accent) 9%, var(--rgb-panel))}.rgb-color-match-best-label{justify-content:space-between;align-items:center;gap:8px;font-size:1rem;font-weight:700;display:flex}.rgb-color-match-level-bars{align-items:end;gap:3px;height:20px;display:flex}.rgb-color-match-level-bars i{background:var(--rgb-line);width:4px;height:8px}.rgb-color-match-level-bars i:nth-child(2){height:12px}.rgb-color-match-level-bars i:nth-child(3){height:16px}.rgb-color-match-level-bars i:nth-child(4){height:20px}.rgb-color-match-level-bars i[data-filled=true]{background:var(--rgb-record-accent)}.rgb-color-match-best-score{flex-wrap:wrap;align-self:center;align-items:baseline;gap:4px 6px;margin-block:8px;display:flex}.rgb-color-match-best-score>strong{letter-spacing:-.04em;font-variant-numeric:tabular-nums;margin:0;font-size:clamp(1.8rem,3.5vw,2.6rem);line-height:1.2;display:block}.rgb-color-match-score-limit{color:var(--rgb-reading-muted);font-size:var(--rgb-note-size);white-space:nowrap;margin-top:0;display:block}.rgb-color-match-best-link{color:var(--rgb-record-accent);font-size:var(--rgb-note-size);margin-top:0;font-weight:700;display:block}.rgb-color-match-best-detail{background:var(--rgb-panel);margin-top:20px;padding:24px 0 0;scroll-margin-block:24px}.rgb-color-match-best-detail>header{justify-content:space-between;gap:12px;margin-bottom:20px;padding-inline:18px;display:flex}.rgb-color-match-best-detail>header h3{margin:0;font-size:1rem}.rgb-color-match-best-detail>header p{color:var(--rgb-muted);flex-wrap:wrap;gap:12px;margin:10px 0 0;font-size:.75rem;display:flex}.rgb-color-match-best-detail>header strong{color:var(--rgb-text)}.rgb-color-match-best-detail>header button{background:0 0;border:0;flex:0 0 44px;width:44px;height:44px;min-height:44px;padding:0}.rgb-color-match-run-list{margin-top:24px}:where(.rgb-color-match-run-list,.rgb-color-match-saved-run,.rgb-color-match-history-detail details)>summary{align-items:center;gap:10px;min-height:56px;padding:14px 18px;font-size:.85rem;font-weight:700;list-style:none;transition:background-color .16s;display:flex}:where(.rgb-color-match-run-list,.rgb-color-match-saved-run,.rgb-color-match-history-detail details)>summary::-webkit-details-marker{display:none}:where(.rgb-color-match-run-list,.rgb-color-match-saved-run,.rgb-color-match-history-detail details)>summary:after{content:"";border-right:2px solid var(--rgb-muted);border-bottom:2px solid var(--rgb-muted);flex:0 0 7px;width:7px;height:7px;margin-left:auto;transform:rotate(45deg)translateY(-2px)}:where(.rgb-color-match-run-list,.rgb-color-match-saved-run,.rgb-color-match-history-detail details)[open]>summary:after{transform:rotate(225deg)}.rgb-color-match-run-list>summary{background:var(--rgb-panel)}.rgb-color-match-run-list>summary>svg{color:var(--rgb-muted);font-size:1.3rem}.rgb-color-match-count-badge{background:var(--rgb-surface);color:var(--rgb-muted);padding:2px 8px;font-size:.68rem}.rgb-color-match-collection-note{font-size:var(--rgb-body-size);color:var(--rgb-reading-muted);margin:0 0 16px;font-weight:400;line-height:1.7}.rgb-color-match-run-list>.rgb-color-match-collection-note{margin:18px 0}.rgb-color-match-empty-note{color:var(--rgb-muted);margin:18px;font-size:.8rem;line-height:1.8}.rgb-color-match-saved-run{background:var(--rgb-panel);margin-top:8px}.rgb-color-match-saved-run>summary{flex-wrap:wrap;font-weight:500}.rgb-color-match-saved-run>summary strong{font-variant-numeric:tabular-nums;margin-left:auto;font-size:1.15rem}.rgb-color-match-saved-run>summary small{color:var(--rgb-muted);margin-left:4px;font-size:.65rem;font-weight:500}.rgb-color-match-saved-run>summary:after{margin-left:8px}.rgb-color-match-run-difficulty{color:var(--rgb-muted);font-size:.72rem}.rgb-color-match-run-palette{height:8px;margin:0 18px 18px;display:flex;overflow:hidden}.rgb-color-match-run-palette i{flex:1}.rgb-color-match-run-answers{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;padding:0 18px 18px;display:grid}.rgb-color-match-run-answers article{background:var(--rgb-surface);min-width:0;padding:16px}.rgb-color-match-run-answers h3{margin:0;font-size:.75rem}.rgb-color-match-run-answers .rgb-color-match-question-heading{margin-bottom:12px}.rgb-color-match-collection-count{font-size:var(--rgb-label-size);color:var(--rgb-reading-muted);margin:0 0 0 auto;font-weight:500}.rgb-color-match-history-tools{flex-wrap:wrap;align-items:end;gap:12px;margin-bottom:20px;display:flex}.rgb-color-match-history-tools>div{gap:8px;display:grid}.rgb-color-match-history-tools>div:first-child{flex:1;min-width:180px}.rgb-color-match-history-tools label{font-size:var(--rgb-label-size);color:var(--rgb-reading-muted);font-weight:600}.rgb-color-match-history-tools input{background:var(--rgb-panel);border-radius:var(--radius-s);width:100%;min-height:44px;font:inherit;color:var(--rgb-text);font-size:var(--rgb-body-size);border:0;padding:10px 12px;font-weight:400}.rgb-color-match-history-tools select{background:var(--rgb-panel);font-size:var(--rgb-body-size);border:0;font-weight:400}.rgb-color-match-history-tools[data-pointer-focus=true] :where(input,select):focus{outline:none}.rgb-color-match-history-browser{align-items:start;gap:20px;display:grid}.rgb-color-match-palette-browser{background:var(--rgb-panel);min-width:0;padding:20px;scroll-margin-block:24px}.rgb-color-match-color-carousel{scroll-snap-type:x mandatory;scrollbar-width:none;display:flex;overflow-x:auto}.rgb-color-match-color-grid{scroll-snap-align:start;flex:0 0 100%;grid-template-rows:repeat(2,auto);grid-template-columns:repeat(32,minmax(0,1fr));align-content:start;gap:1px;min-width:0;display:grid}.rgb-color-match-color-grid button{aspect-ratio:1;background:0 0;border:0;border-radius:0;min-width:0;min-height:0;padding:0;display:block;position:relative}.rgb-color-match-gallery-swatch{width:100%;height:100%;display:block}.rgb-color-match-color-grid button[aria-pressed=true]:not(:focus-visible){outline:1px solid var(--rgb-text);outline-offset:-1px}.rgb-color-match-color-grid button[aria-pressed=true]>.rgb-color-match-gallery-swatch{box-shadow:inset 0 0 0 2px var(--rgb-surface)}.rgb-color-match-palette-footer{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;margin-top:16px;display:flex}.rgb-color-match-palette-footer>span{font-size:var(--rgb-note-size);color:var(--rgb-reading-muted);font-weight:500}.rgb-color-match-pager{justify-content:center;align-items:center;gap:12px;display:flex}.rgb-color-match-pager button{background:var(--rgb-surface);border:0;width:44px;height:44px;min-height:44px;padding:0}.rgb-color-match-pager span{font-size:var(--rgb-label-size);font-variant-numeric:tabular-nums;color:var(--rgb-reading-muted);font-weight:500}.rgb-color-match-run-list>.rgb-color-match-pager{margin-top:16px}.rgb-color-match-detail-slot{min-width:0;scroll-margin-block:24px}.rgb-color-match-empty-gallery{background:var(--rgb-panel);text-align:center;justify-items:center;gap:20px;padding:36px 20px;display:grid}.rgb-color-match-empty-gallery>span{gap:6px;display:flex}.rgb-color-match-empty-gallery i{background:var(--rgb-red);width:36px;height:44px;transform:rotate(-10deg)}.rgb-color-match-empty-gallery i:nth-child(2){background:var(--rgb-green);transform:translateY(-4px)}.rgb-color-match-empty-gallery i:nth-child(3){background:var(--rgb-blue);transform:rotate(10deg)}.rgb-color-match-empty-gallery p{max-width:30em;font-size:var(--rgb-body-size);color:var(--rgb-reading-muted);margin:0;font-weight:400;line-height:1.8}.rgb-color-match-history-detail{background:var(--rgb-panel);font-size:var(--rgb-body-size);padding:20px;font-weight:400}.rgb-color-match-back-to-colors{min-height:44px;font-size:var(--rgb-label-size);background:0 0;border:0;margin:0 0 16px;padding:8px 0}.rgb-color-match-detail-heading{align-items:center;gap:12px;display:flex}.rgb-color-match-detail-chip{flex:0 0 44px;width:44px;height:44px}.rgb-color-match-detail-heading h3{font-size:var(--rgb-body-size);overflow-wrap:anywhere;margin:0;font-family:monospace}.rgb-color-match-detail-heading p{font-size:var(--rgb-note-size);color:var(--rgb-reading-muted);margin:4px 0 0}.rgb-color-match-format-control{font-size:var(--rgb-label-size);color:var(--rgb-reading-muted);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;margin:16px 0;font-weight:600;display:flex}.rgb-color-match-format-control>div{gap:4px;display:flex}@media (min-width:821px){.rgb-color-match-format-control{justify-content:flex-end;gap:16px}}.rgb-color-match-format-control button{min-height:44px;font-size:var(--rgb-label-size);color:var(--rgb-reading-muted);background:0 0;border:0;padding:8px 12px;font-weight:600}.rgb-color-match-format-control button[aria-pressed=true]{color:var(--rgb-surface);background:var(--rgb-text)}@media (hover:hover){.rgb-color-match-format-control button:enabled:hover{color:var(--rgb-text);background:var(--rgb-surface)}}.rgb-color-match-history-detail h4{font-size:var(--rgb-body-size);margin:0}.rgb-color-match-history-detail>.rgb-color-match-question-heading{margin:24px 0 16px}.rgb-color-match-history-detail>.rgb-color-match-comparison{margin-bottom:24px}.rgb-color-match-history-detail .rgb-color-match-swatch{height:100px}.rgb-color-match-history .rgb-color-match-comparison>div>span:first-child{font-size:var(--rgb-label-size);color:var(--rgb-reading-muted);font-weight:600}.rgb-color-match-history .rgb-color-match-code code{font-size:var(--rgb-body-size);color:var(--rgb-text);font-weight:400}.rgb-color-match-history .rgb-color-match-breakdown dt{font-size:var(--rgb-note-size);color:var(--rgb-reading-muted);font-weight:600}.rgb-color-match-history .rgb-color-match-breakdown dd{font-size:1.125rem}.rgb-color-match-history .rgb-color-match-breakdown small{font-size:var(--rgb-note-size);color:var(--rgb-reading-muted)}.rgb-color-match-history-detail details>summary{font-size:var(--rgb-body-size)}.rgb-color-match-history-detail>p{color:var(--rgb-reading-muted);font-size:var(--rgb-note-size);line-height:1.8}.rgb-color-match-history-detail>details{background:var(--rgb-surface);margin-top:20px}.rgb-color-match-history-detail details>p{color:var(--rgb-reading-muted);font-size:var(--rgb-body-size);padding-inline:16px;line-height:1.8}.rgb-color-match-attempt{margin:16px;padding-block:12px}.rgb-color-match-attempt time{font-size:var(--rgb-note-size);color:var(--rgb-reading-muted);margin:0;display:block}.rgb-color-match-attempt .rgb-color-match-question-heading{flex-wrap:wrap;margin-bottom:12px}select{font:inherit;min-height:44px;color:var(--rgb-text);border:1px solid var(--rgb-line);border-radius:var(--radius-s);background:var(--rgb-surface);padding:8px 12px}.game-rule-details{--game-rule-heading:var(--rgb-text);--game-rule-accent:var(--rgb-blue);--game-rule-line:var(--rgb-line);--game-rule-background:var(--rgb-surface);--game-rule-divider:var(--rgb-line);--game-rule-ink:var(--rgb-text);border:1px solid var(--rgb-line);border-radius:var(--radius-s)}.game-rule-details>summary{min-height:64px;font-size:var(--rgb-body-size);padding-inline:24px 48px}.game-rule-details-content{font-size:var(--rgb-body-size);padding:24px;font-weight:400;line-height:1.9}.game-rule-details-content ol{margin:0;padding-left:1.5em}.game-rule-details-content li::marker{color:var(--rgb-blue);font-weight:800}@media (hover:hover){.rgb-color-match-best-card:enabled:hover{background:color-mix(in srgb, var(--rgb-record-accent) 12%, var(--rgb-panel))}.rgb-color-match-color-grid button:enabled:hover{background:0 0;transform:translateY(-2px)}:where(.rgb-color-match-run-list,.rgb-color-match-saved-run,.rgb-color-match-history-detail details)>summary:hover{background:color-mix(in srgb, var(--rgb-blue) 8%, var(--rgb-panel))}}@media (max-width:820px){.rgb-color-match-color-grid{grid-template-rows:repeat(4,auto);grid-template-columns:repeat(16,minmax(0,1fr))}.rgb-color-match-best-card{padding:18px}}@media (max-width:520px){.rgb-color-match-records,.rgb-color-match-history{margin-block:36px;padding-inline:16px}.rgb-color-match-collection-heading{flex-wrap:wrap;gap:8px;margin-bottom:20px}.rgb-color-match-section-icon{flex-basis:28px;height:28px;font-size:24px}.rgb-color-match-collection-count{width:100%;margin-left:36px}.rgb-color-match-bests{gap:12px}.rgb-color-match-best-card{min-height:172px;padding:18px 14px}.rgb-color-match-best-label{font-size:var(--rgb-label-size)}.rgb-color-match-best-score>strong{font-size:clamp(1.65rem,7vw,2rem)}.rgb-color-match-score-limit,.rgb-color-match-best-link{font-size:var(--rgb-note-size);line-height:1.6}.rgb-color-match-best-detail{padding:16px 0 0}.rgb-color-match-best-detail>header{padding-inline:12px}.rgb-color-match-history-tools{gap:10px}.rgb-color-match-history-tools>div:first-child{flex-basis:100%}.rgb-color-match-history-tools>div:last-child{justify-content:space-between;align-items:center;width:100%;display:flex}.rgb-color-match-palette-browser{padding:12px}.rgb-color-match-history-detail{padding:16px}.rgb-color-match-saved-run>summary{gap:8px;padding:12px;font-size:.72rem}.rgb-color-match-saved-run>summary strong{font-size:.95rem}.rgb-color-match-run-answers{grid-template-columns:minmax(0,1fr);padding:0 10px 10px}.rgb-color-match-run-palette{margin-inline:12px}}}}
@layer components{@scope(.rgb-color-match-root){.rgb-color-match-rules{--rgb-rule-gap:clamp(28px, 4vw, 40px);color:var(--rgb-text);font-size:var(--rgb-body-size);gap:0;font-weight:400;line-height:1.9;display:grid}.rgb-color-match-rules :where(h3,h4,p,dl){margin:0}.rgb-color-match-rules :where(h3,h4){color:var(--rgb-text)}.rgb-color-match-rules h3{letter-spacing:.01em;margin-bottom:20px;font-size:clamp(1.25rem,2.3vw,1.5rem);font-weight:800;line-height:1.5}.rgb-color-match-rules h4{margin-bottom:12px;font-size:1.125rem;font-weight:700;line-height:1.6}.rgb-color-match-rules>section{padding-block:var(--rgb-rule-gap);border-top:1px solid var(--rgb-line)}.rgb-color-match-rules>section:last-child{padding-bottom:0}.rgb-color-match-rules-intro{padding-bottom:var(--rgb-rule-gap)}.rgb-color-match-rules-intro>h3{letter-spacing:-.025em;margin-block:10px 20px;font-size:clamp(1.5rem,3.2vw,2rem)}.rgb-color-match-rules-facts{flex-wrap:wrap;gap:24px 48px;padding-top:28px;display:flex}.rgb-color-match-rules-facts dt{font-size:var(--rgb-label-size);color:var(--rgb-reading-muted);font-weight:600}.rgb-color-match-rules-facts dd{color:var(--rgb-text);font-variant-numeric:tabular-nums;margin:0;font-size:clamp(1.5rem,4vw,2rem);font-weight:800;line-height:1.5}.rgb-color-match-rules small{font-size:var(--rgb-note-size);margin-left:6px;font-weight:600}.rgb-color-match-rules .rgb-color-match-rules-steps{grid-template-columns:minmax(0,1fr);gap:24px;padding:0;list-style:none;display:grid}.rgb-color-match-rules .rgb-color-match-rules-steps li{--rgb-rule-accent:var(--rgb-red);grid-template-columns:48px minmax(0,1fr);align-items:start;gap:6px 20px;min-width:0;margin:0;display:grid}.rgb-color-match-rules-steps li:nth-child(2){--rgb-rule-accent:var(--rgb-green)}.rgb-color-match-rules-steps li:nth-child(3){--rgb-rule-accent:var(--rgb-blue)}.rgb-color-match-rules-steps li>span{color:var(--rgb-rule-accent);grid-row:span 2;margin-top:3px;font-size:2rem;font-weight:800;line-height:1;display:block}.rgb-color-match-rules-steps h4{margin-bottom:0}.rgb-color-match-rules-steps p{grid-column:2}.rgb-color-match-rules-score-columns>div{background:var(--rgb-panel);padding:24px}.rgb-color-match-rules-scoring>header{flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:8px;display:flex}.rgb-color-match-rules-scoring>header h3{margin:0}.rgb-color-match-rules-scoring>header p{font-size:var(--rgb-label-size);color:var(--rgb-reading-muted)}.rgb-color-match-rules-score-bar{gap:4px;height:6px;margin-block:24px;display:flex}.rgb-color-match-rules-score-bar>span:first-child{background:var(--rgb-blue)}.rgb-color-match-rules-score-bar>span:last-child{background:var(--rgb-green)}.rgb-color-match-rules-score-columns{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;display:grid}.rgb-color-match-rules-score-columns h4{align-items:baseline;gap:16px;display:flex}.rgb-color-match-rules-score-columns strong{font-size:2rem;line-height:1.4}.rgb-color-match-rules .rgb-color-match-rules-tip{color:var(--rgb-reading-muted);font-size:var(--rgb-label-size);margin-top:20px}.rgb-color-match-rules-difficulties{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;display:grid}.rgb-color-match-rules-records p+p{margin-top:20px}@media (max-width:820px){.rgb-color-match-rules .rgb-color-match-rules-steps li{-moz-column-gap:16px;grid-template-columns:36px minmax(0,1fr);column-gap:16px}.rgb-color-match-rules-score-columns{grid-template-columns:minmax(0,1fr)}}@media (max-width:520px){.rgb-color-match-rules-facts{gap:16px 24px}.rgb-color-match-rules-score-columns>div{padding:20px 16px}.rgb-color-match-rules-difficulties{grid-template-columns:minmax(0,1fr);gap:16px}}}}
@layer components{@scope(.rgb-color-match-root){.rgb-color-match-theme-control{justify-content:space-between;align-items:center;gap:12px;font-size:.8rem;font-weight:700;display:flex}.rgb-color-match-theme-control>div{gap:4px;display:flex}.rgb-color-match-theme-control button{min-height:44px;color:inherit;background:0 0;gap:6px;padding:8px 12px;font-size:.75rem}.rgb-color-match-theme-control button[aria-pressed=true]{background:var(--rgb-text);border-color:var(--rgb-text);color:var(--rgb-surface)}.rgb-color-match-overlay .rgb-color-match-theme-control{color:var(--rgb-on-dark)}.rgb-color-match-overlay .rgb-color-match-theme-control button[aria-pressed=true]{background:var(--rgb-on-dark);color:var(--rgb-dark);border-color:var(--rgb-on-dark)}@media (hover:hover){.rgb-color-match-theme-control button:enabled:hover{border-color:var(--rgb-blue);background:var(--rgb-panel);color:var(--rgb-text)}.rgb-color-match-theme-control button[aria-pressed=true]:enabled:hover{background:var(--rgb-text);color:var(--rgb-surface)}.rgb-color-match-overlay .rgb-color-match-theme-control button[aria-pressed=true]:enabled:hover{background:var(--rgb-on-dark);color:var(--rgb-dark)}}}@scope(.rgb-color-match-root[data-rgb-theme=dark]){:scope{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--rgb-surface:#222428;--rgb-stage-surface:#000;--rgb-panel:#2d3035;--rgb-text:#f2f2f2;--rgb-muted:#b2b7c0;--rgb-reading-muted:#c0c6cf;--rgb-line:#484c54;--rgb-accent:#aac5ff;--rgb-red:#ff6b80;--rgb-green:#4bd9a2;--rgb-blue:#80aaff;--rgb-extreme:#dc9af3;--rgb-dark:#191b1f;--rgb-countdown-surface:var(--rgb-dark);--rgb-countdown-ink:var(--rgb-on-dark);--rgb-perfect-text:#b5f5d1;--rgb-perfect-surface:#163d2d;--rgb-full-score:#ffc06a;--foreground:var(--rgb-text);--muted:var(--rgb-muted);--line:var(--rgb-line);--blue:var(--rgb-blue);--blue-deep:var(--rgb-accent)}.rgb-color-match-settings .game-sound-setting{color:var(--rgb-text)}.rgb-color-match-settings .game-sound-setting>span svg{color:var(--rgb-blue)}.rgb-color-match-channel-letter,.rgb-color-match-overlay .rgb-color-match-primary{color:#000}.rgb-color-match-gallery-selected{color:var(--rgb-on-dark)}.game-rule-details{--game-rule-heading:var(--rgb-text);--game-rule-ink:var(--rgb-text);--game-rule-background:var(--rgb-panel)}.game-rule-details-section h3{color:var(--rgb-text)}.game-save-status,.game-save-notice{color:var(--rgb-text);background:#241e12}.game-share-button:is(.is-x,.is-threads){border:1px solid var(--rgb-line)}.game-favorite-button{background:var(--rgb-panel);color:var(--rgb-accent);border-color:var(--rgb-blue);box-shadow:none}.game-favorite-button.is-favorite{color:#ffc76a;border-color:#ffc76a}.setting-switch-track{background:var(--switch-off,#555)}.setting-switch-control>input:checked+.setting-switch-track{background:var(--switch-on,#3969b8)}}}
@layer games{@media screen{@scope(body:has(.rgb-color-match-root[data-rgb-theme=dark])){:scope{--foreground:#f2f2f2;--muted:#aaa;--line:#3c3c3c;--blue:#80aaff;--blue-deep:#aac5ff;--blue-dark:#aac5ff;--background:#151619;--card:#222428;--rgb-site-active:#273449;--rgb-site-button:#2d3035;--rgb-site-ofuse:#224552;--rgb-site-stripe:#423c65;--site-background-decoration-display:none;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;background-color:var(--background);color:var(--foreground);background-image:none}.site-header,.header-actions-mobile,.header-menu-button,.language-switcher,.related-games .game-card-link,.support-panel{background:var(--card);border-color:var(--line);color:var(--foreground)}.header-actions ul,.language-switcher a,.related-games .game-label,.related-games .game-card h3{color:var(--foreground)}.language-switcher a[aria-current=page],.related-games .game-objective{background:var(--rgb-site-active);color:var(--blue-deep)}.language-switcher{--language-idle-background:#303030}.related-games .game-card p,.support-panel p{color:var(--muted)}.related-games .section-heading h2,.support-panel h2,.support-callout-method h3,.support-callout-more{color:var(--foreground);-webkit-text-fill-color:currentColor;background:0 0}.related-games .page-action{background:var(--rgb-site-button);border-color:var(--line);color:var(--blue)}.footer-support{--support-surface:var(--card)}.support-callout{--support-accent:var(--rgb-site-ofuse);--support-cyan:var(--blue-deep);background:0 0}.support-panel .ofuse-link{background:var(--rgb-site-ofuse);border-color:var(--rgb-site-ofuse);color:#fff;box-shadow:none}.support-panel .stripe-link{background:var(--rgb-site-stripe);border-color:var(--rgb-site-stripe);color:#fff;box-shadow:none}.site-footer-area{background:var(--card)}.site-footer,.footer-nav a{color:var(--muted)}.footer-nav li:after,.footer-nav a:before{background:var(--line)}@media (hover:hover){.header-actions a:hover,.language-switcher a:hover{background:var(--rgb-site-active);color:var(--blue-deep)}.related-games .page-action:hover,.related-games .game-card-link:hover{border-color:var(--blue);background:var(--rgb-site-button)}.support-panel :where(.ofuse-link,.stripe-link):hover{border-color:var(--blue)}}}}}
@layer components{@scope(.rgb-color-match-root){.rgb-color-match-overlay{--rgb-pause-panel:#ffffff0f;--rgb-pause-line:#fff3;--rgb-pause-muted:#c1cbdb;padding:calc(var(--rgb-toolbar-height) + 16px) 24px 32px}.rgb-color-match-overlay>div{border:1px solid var(--rgb-pause-line);border-radius:var(--radius-s);background:var(--rgb-pause-panel);gap:28px;width:min(100%,600px);padding:clamp(24px,4vw,40px)}.rgb-color-match-pause-heading{justify-items:center;gap:12px;display:grid}.rgb-color-match-pause-symbol{width:48px;height:48px;color:var(--rgb-on-dark);background:var(--rgb-pause-panel);border-radius:var(--radius-s);place-items:center;font-size:32px;display:grid}.rgb-color-match-pause-heading h2{font-size:clamp(1.5rem,4vw,2rem);line-height:1.4}.rgb-color-match-pause-heading p{color:var(--rgb-pause-muted);font-size:var(--rgb-body-size);text-wrap:balance;margin:0;line-height:1.7}.rgb-color-match-overlay .rgb-color-match-settings{text-align:left;gap:24px;margin:0}.rgb-color-match-overlay .rgb-color-match-theme-control{font-size:var(--rgb-label-size);gap:10px;display:grid}.rgb-color-match-overlay .rgb-color-match-theme-control>div{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;display:grid}.rgb-color-match-overlay .rgb-color-match-theme-control button{min-height:48px;font-size:var(--rgb-body-size);border-color:var(--rgb-pause-line)}.rgb-color-match-overlay .rgb-color-match-setting-options{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;display:grid}.rgb-color-match-overlay .game-sound-setting{--switch-width:44px;--switch-height:26px;--switch-thumb-size:18px;--switch-control-height:48px;--switch-on:#fff;--switch-on-thumb:var(--rgb-dark);--switch-off:var(--rgb-switch-off);--switch-off-border:var(--rgb-switch-off);--switch-thumb:var(--rgb-on-dark);background:var(--rgb-pause-panel);border-radius:var(--radius-s);min-width:0;font-size:var(--rgb-label-size);gap:8px;margin:0;padding:8px 12px}.rgb-color-match-overlay .game-sound-setting>span{white-space:nowrap;gap:6px}.rgb-color-match-pause-actions{gap:16px;padding-top:24px;display:grid}.rgb-color-match-pause-actions>button{min-height:52px}.rgb-color-match-pause-actions>button:not(.rgb-color-match-primary){background:var(--rgb-pause-panel);border-color:var(--rgb-pause-line);color:var(--rgb-on-dark)}@media (hover:hover){.rgb-color-match-pause-actions>button:not(.rgb-color-match-primary):hover{border-color:var(--rgb-on-dark);background:#ffffff1f}}@media (max-width:520px){.rgb-color-match-overlay{padding-inline:16px}.rgb-color-match-overlay>div{padding:24px 16px}.rgb-color-match-overlay .game-sound-setting{padding-inline:10px}.rgb-color-match-overlay .game-sound-setting>span svg{display:none}}@media (max-height:700px){.rgb-color-match-overlay{padding-block:calc(var(--rgb-toolbar-height) + 8px) 16px}.rgb-color-match-overlay>div{gap:16px;padding-block:20px}.rgb-color-match-pause-symbol{display:none}.rgb-color-match-overlay .rgb-color-match-settings{gap:16px}.rgb-color-match-pause-actions{padding-top:16px}}}@scope(.rgb-color-match-root[data-rgb-theme=light]){.rgb-color-match-overlay{--rgb-pause-panel:var(--rgb-panel);--rgb-pause-line:var(--rgb-line);--rgb-pause-muted:var(--rgb-reading-muted);background:var(--rgb-surface);color:var(--rgb-text)}.rgb-color-match-overlay>div{background:var(--rgb-surface)}.rgb-color-match-pause-symbol,.rgb-color-match-overlay .rgb-color-match-settings,.rgb-color-match-overlay .rgb-color-match-theme-control,.rgb-color-match-overlay .game-sound-setting>span,.rgb-color-match-pause-actions>button:not(.rgb-color-match-primary){color:var(--rgb-text)}.rgb-color-match-overlay .rgb-color-match-theme-control button[aria-pressed=true]{background:var(--rgb-text);border-color:var(--rgb-text);color:var(--rgb-surface)}.rgb-color-match-overlay .game-sound-setting{--switch-on:var(--rgb-text);--switch-on-thumb:var(--rgb-surface);--switch-off:var(--rgb-switch-off);--switch-off-border:var(--rgb-switch-off);--switch-thumb:var(--rgb-on-dark)}@media (hover:hover){.rgb-color-match-overlay .rgb-color-match-theme-control button[aria-pressed=true]:enabled:hover{background:var(--rgb-text);color:var(--rgb-surface)}.rgb-color-match-pause-actions>button:not(.rgb-color-match-primary):hover{background:var(--rgb-panel);border-color:var(--rgb-text)}}}}