.remove-color-workspace{
  --rc-bg:#0d1422;
  --rc-panel:#111b2d;
  --rc-panel-2:#0b1321;
  --rc-border:#28374d;
  --rc-muted:#96a8bf;
  --rc-text:#edf5ff;
  --rc-accent:#27d889;
  --rc-accent-dark:#0f9f62;
  --rc-danger:#ff4d72;
  border:1px solid var(--rc-border);
  background:var(--rc-bg);
  overflow:hidden;
}

.remove-color-grid{
  display:grid;
  grid-template-columns:minmax(285px,360px) minmax(0,1fr);
  min-height:610px;
}

.remove-color-panel{
  min-width:0;
  background:var(--rc-panel);
}

.remove-color-controls{
  border-right:1px solid var(--rc-border);
}

.remove-color-panel-header{
  min-height:52px;
  padding:11px 14px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  border-bottom:1px solid var(--rc-border);
  background:#0e1829;
  color:var(--rc-text);
}

.remove-color-panel-header>span{
  display:flex;
  align-items:center;
  gap:9px;
  font-size:.9rem;
  font-weight:750;
}

.remove-color-panel-header button,
.remove-color-fit,
.remove-color-toolbar button{
  border:1px solid var(--rc-border);
  border-radius:5px;
  background:#152238;
  color:var(--rc-text);
  min-height:32px;
  padding:6px 10px;
  cursor:pointer;
  font:inherit;
  font-size:.78rem;
  font-weight:700;
}

.remove-color-panel-header button:hover:not(:disabled),
.remove-color-fit:hover:not(:disabled),
.remove-color-toolbar button:hover:not(:disabled){
  border-color:#4f6786;
  background:#1a2b45;
}

.remove-color-workspace button:disabled,
.remove-color-workspace select:disabled,
.remove-color-workspace input:disabled{
  cursor:not-allowed;
  opacity:.48;
}

.remove-color-drop{
  margin:14px;
  min-height:112px;
  display:flex;
  align-items:center;
  justify-content:center;
  border:1px dashed #48617e;
  border-radius:7px;
  background:#0c1626;
  color:var(--rc-text);
  cursor:pointer;
  transition:border-color .15s ease,background .15s ease;
}

.remove-color-drop:hover,
.remove-color-drop.is-dragging{
  border-color:var(--rc-accent);
  background:#10251f;
}

.remove-color-drop input{display:none}

.remove-color-drop-empty{
  padding:18px;
  display:grid;
  justify-items:center;
  gap:6px;
  text-align:center;
}

.remove-color-drop-empty i{
  font-size:1.4rem;
  color:var(--rc-accent);
}

.remove-color-drop-empty strong{font-size:.9rem}
.remove-color-drop-empty small,
.remove-color-file small{color:var(--rc-muted);font-size:.74rem}

.remove-color-file{
  width:100%;
  padding:12px;
  display:flex;
  align-items:center;
  gap:11px;
}

.remove-color-file img{
  width:64px;
  height:64px;
  object-fit:cover;
  border:1px solid var(--rc-border);
  border-radius:5px;
  background-image:linear-gradient(45deg,#d7dfeb 25%,transparent 25%),linear-gradient(-45deg,#d7dfeb 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#d7dfeb 75%),linear-gradient(-45deg,transparent 75%,#d7dfeb 75%);
  background-size:16px 16px;
  background-position:0 0,0 8px,8px -8px,-8px 0;
}

.remove-color-file>span{
  display:grid;
  gap:4px;
  min-width:0;
}

.remove-color-file strong{
  max-width:225px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:.84rem;
}

.remove-color-instruction{
  margin:0 14px 14px;
  padding:10px 11px;
  display:flex;
  gap:9px;
  align-items:flex-start;
  border-left:3px solid var(--rc-accent);
  background:#10251f;
  color:var(--rc-text);
  font-size:.76rem;
  line-height:1.45;
}

.remove-color-instruction i{color:var(--rc-accent);margin-top:2px}

.remove-color-fieldset{
  margin:0 14px 14px;
  padding:0;
  border:0;
}

.remove-color-fieldset legend,
.remove-color-setting>span{
  display:block;
  margin-bottom:7px;
  color:#dce8f7;
  font-size:.75rem;
  font-weight:750;
}

.remove-color-segment{
  display:grid;
  grid-auto-flow:column;
  grid-auto-columns:1fr;
  border:1px solid var(--rc-border);
  border-radius:5px;
  overflow:hidden;
}

.remove-color-segment button{
  min-height:34px;
  border:0;
  border-right:1px solid var(--rc-border);
  border-radius:0;
  background:#111d30;
  color:var(--rc-muted);
  cursor:pointer;
  font:inherit;
  font-size:.75rem;
  font-weight:750;
}

.remove-color-segment button:last-child{border-right:0}

.remove-color-segment button.is-active{
  background:#173b30;
  color:#bfffe2;
  box-shadow:inset 0 -2px 0 var(--rc-accent);
}

.remove-color-settings{
  padding:0 14px;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:13px 10px;
}

.remove-color-setting{min-width:0}
.remove-color-range-setting{grid-column:1/-1}

.remove-color-setting select{
  width:100%;
  min-height:36px;
  padding:7px 9px;
  border:1px solid var(--rc-border);
  border-radius:5px;
  background:#0b1525;
  color:var(--rc-text);
  font:inherit;
  font-size:.78rem;
}

.remove-color-setting small{
  display:block;
  margin-top:5px;
  color:var(--rc-muted);
  font-size:.69rem;
  line-height:1.4;
}

.remove-color-range-setting>span{
  display:flex;
  align-items:center;
  justify-content:space-between;
}

.remove-color-range-setting output{
  min-width:44px;
  color:#bfffe2;
  text-align:right;
  font-variant-numeric:tabular-nums;
}

.remove-color-range-setting input[type="range"]{
  width:100%;
  accent-color:var(--rc-accent);
}

.remove-color-sample-card{
  margin:14px;
  padding:10px;
  display:flex;
  align-items:center;
  gap:10px;
  border:1px solid var(--rc-border);
  border-radius:6px;
  background:#0b1525;
  color:var(--rc-text);
}

.remove-color-swatch{
  flex:0 0 35px;
  width:35px;
  height:35px;
  border:1px solid #5b6e87;
  border-radius:4px;
  background-image:linear-gradient(45deg,#d7dfeb 25%,transparent 25%),linear-gradient(-45deg,#d7dfeb 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#d7dfeb 75%),linear-gradient(-45deg,transparent 75%,#d7dfeb 75%);
  background-size:10px 10px;
  background-position:0 0,0 5px,5px -5px,-5px 0;
}

.remove-color-sample-card>span:last-child{display:grid;gap:3px;min-width:0}
.remove-color-sample-card strong{font-size:.76rem}
.remove-color-sample-card small{color:var(--rc-muted);font-size:.68rem;line-height:1.35}

.remove-color-complex{
  margin:0 14px 15px;
  padding:10px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  border:1px solid #3c4962;
  border-radius:6px;
  color:var(--rc-text);
}

.remove-color-complex>span{display:grid;gap:2px}
.remove-color-complex strong{font-size:.72rem}
.remove-color-complex small{color:var(--rc-muted);font-size:.65rem}
.remove-color-complex a{flex:none;color:#bfffe2;font-size:.7rem;font-weight:750;text-decoration:none}

.remove-color-editor-panel{
  display:flex;
  flex-direction:column;
  background:var(--rc-panel-2);
}

.remove-color-editor-header{flex-wrap:wrap}

.remove-color-toolbar{
  display:flex;
  align-items:center;
  gap:5px;
}

.remove-color-toolbar button{min-width:34px;padding:5px 8px}

.remove-color-viewbar{
  min-height:47px;
  padding:7px 12px;
  display:flex;
  align-items:center;
  gap:12px;
  border-bottom:1px solid var(--rc-border);
  background:#101a2b;
}

.remove-color-viewbar .remove-color-segment{width:220px;flex:none}

.remove-color-zoom{
  margin-left:auto;
  display:flex;
  align-items:center;
  gap:7px;
  color:var(--rc-muted);
  font-size:.7rem;
}

.remove-color-zoom input{width:105px;accent-color:var(--rc-accent)}
.remove-color-zoom output{width:38px;color:var(--rc-text);font-variant-numeric:tabular-nums}

.remove-color-stage{
  position:relative;
  min-height:430px;
  flex:1;
  overflow:auto;
  display:flex;
  align-items:center;
  justify-content:center;
  background-color:#101722;
  background-image:linear-gradient(45deg,#172131 25%,transparent 25%),linear-gradient(-45deg,#172131 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#172131 75%),linear-gradient(-45deg,transparent 75%,#172131 75%);
  background-size:24px 24px;
  background-position:0 0,0 12px,12px -12px,-12px 0;
}

.remove-color-empty{
  max-width:360px;
  padding:30px;
  display:grid;
  justify-items:center;
  gap:9px;
  text-align:center;
  color:var(--rc-muted);
}

.remove-color-empty i{font-size:2rem;color:#62758e}
.remove-color-empty strong{color:var(--rc-text);font-size:.95rem}
.remove-color-empty span{font-size:.76rem;line-height:1.45}

.remove-color-canvas-wrap{
  margin:auto;
  padding:16px;
  min-width:min-content;
  min-height:min-content;
}

.remove-color-canvas-wrap canvas{
  display:block;
  max-width:none;
  box-shadow:0 10px 32px rgba(0,0,0,.42);
  cursor:crosshair;
  image-rendering:auto;
  touch-action:manipulation;
}

.remove-color-canvas-wrap canvas:focus-visible{
  outline:3px solid rgba(39,216,137,.65);
  outline-offset:4px;
}

.remove-color-metrics{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  border-top:1px solid var(--rc-border);
  background:#0d1727;
}

.remove-color-metrics>div{
  min-width:0;
  padding:10px;
  display:grid;
  gap:2px;
  text-align:center;
  border-right:1px solid var(--rc-border);
}

.remove-color-metrics>div:last-child{border-right:0}
.remove-color-metrics b{color:var(--rc-text);font-size:.79rem;overflow:hidden;text-overflow:ellipsis}
.remove-color-metrics span{color:var(--rc-muted);font-size:.63rem;text-transform:uppercase;letter-spacing:.05em}

.remove-color-result{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  border-top:1px solid #2f8f67;
  background:#0d1d19;
  overflow:hidden;
}

.remove-color-result[hidden]{display:none}

.remove-color-result-copy{
  padding:11px 12px;
  display:flex;
  align-items:center;
  gap:9px;
  color:var(--rc-text);
}

.remove-color-result-copy>span:last-child{display:grid;gap:2px}
.remove-color-result-copy strong{font-size:.8rem}
.remove-color-result-copy small{font-size:.67rem;color:#9ccab8}

.remove-color-result-check{
  width:28px;
  height:28px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:var(--rc-accent);
  color:#052115;
}

.remove-color-result-actions{
  padding:8px 10px;
  display:flex;
  justify-content:flex-end;
}

.remove-color-result-actions a{
  padding:9px 13px;
  display:inline-flex;
  align-items:center;
  gap:7px;
  border-radius:5px;
  background:var(--rc-accent);
  color:#052115;
  font-size:.76rem;
  font-weight:800;
  text-decoration:none;
}

.remove-color-next{
  margin:0 14px 14px;
  padding:11px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  border:1px solid var(--rc-border);
  border-radius:6px;
  color:var(--rc-text);
}

.remove-color-next>div:first-child{display:grid;gap:2px}
.remove-color-next strong{font-size:.75rem}
.remove-color-next span{font-size:.66rem;color:var(--rc-muted)}
.remove-color-next>div:last-child{display:flex;flex-wrap:wrap;gap:6px;justify-content:flex-end}
.remove-color-next a{padding:5px 7px;border:1px solid var(--rc-border);border-radius:4px;color:#cfe0f5;font-size:.67rem;text-decoration:none}
.remove-color-next a.is-loading{opacity:.48;pointer-events:none}
.remove-color-next a.is-ready{border-color:#2f8f67;color:#bfffe2}

.remove-color-footer{
  border-top:1px solid var(--rc-border);
  background:#0b1422;
}

.remove-color-generate{
  min-height:40px;
  padding:9px 16px;
  display:inline-flex;
  align-items:center;
  gap:8px;
  border:1px solid var(--rc-accent);
  border-radius:5px;
  background:var(--rc-accent);
  color:#052115;
  font:inherit;
  font-size:.8rem;
  font-weight:850;
  cursor:pointer;
}

.remove-color-generate.is-loading i{animation:rc-spin .8s linear infinite}
@keyframes rc-spin{to{transform:rotate(360deg)}}

@media (max-width:920px){
  .remove-color-grid{grid-template-columns:1fr}
  .remove-color-controls{border-right:0;border-bottom:1px solid var(--rc-border)}
  .remove-color-stage{min-height:390px}
}

@media (max-width:620px){
  .remove-color-workspace{margin-left:-12px;margin-right:-12px;border-left:0;border-right:0}
  .remove-color-panel-header{padding:10px}
  .remove-color-drop,.remove-color-fieldset,.remove-color-sample-card,.remove-color-complex{margin-left:10px;margin-right:10px}
  .remove-color-instruction{margin-left:10px;margin-right:10px}
  .remove-color-settings{padding:0 10px;grid-template-columns:1fr}
  .remove-color-range-setting{grid-column:auto}
  .remove-color-viewbar{align-items:stretch;flex-wrap:wrap}
  .remove-color-viewbar .remove-color-segment{width:100%}
  .remove-color-zoom{margin-left:0;flex:1}
  .remove-color-zoom input{width:auto;flex:1}
  .remove-color-stage{min-height:330px}
  .remove-color-metrics{grid-template-columns:1fr 1fr}
  .remove-color-metrics>div:nth-child(2){border-right:0}
  .remove-color-metrics>div:nth-child(-n+2){border-bottom:1px solid var(--rc-border)}
  .remove-color-next{align-items:flex-start;flex-direction:column}
  .remove-color-next>div:last-child{justify-content:flex-start}
  .remove-color-result{align-items:stretch;flex-direction:column;gap:0}
  .remove-color-result-actions{padding-top:0}
  .remove-color-result-actions a{width:100%;justify-content:center}
  .remove-color-footer{align-items:stretch;gap:8px}
  .remove-color-footer .tool-station-actions,.remove-color-generate{width:100%}
  .remove-color-generate{justify-content:center}
}

body:not(.theme-dark) .remove-color-workspace{
  --rc-bg:#f6f8fb;
  --rc-panel:#ffffff;
  --rc-panel-2:#f5f7fa;
  --rc-border:#d6deea;
  --rc-muted:#5f6f84;
  --rc-text:#172337;
  background:var(--rc-bg);
}

body:not(.theme-dark) .remove-color-panel-header,
body:not(.theme-dark) .remove-color-viewbar,
body:not(.theme-dark) .remove-color-footer{
  background:#f2f5f9;
}

body:not(.theme-dark) .remove-color-drop,
body:not(.theme-dark) .remove-color-setting select,
body:not(.theme-dark) .remove-color-sample-card{
  background:#f8fafc;
}

body:not(.theme-dark) .remove-color-fieldset legend,
body:not(.theme-dark) .remove-color-setting>span{
  color:#26364b;
}

body:not(.theme-dark) .remove-color-segment button,
body:not(.theme-dark) .remove-color-panel-header button,
body:not(.theme-dark) .remove-color-fit,
body:not(.theme-dark) .remove-color-toolbar button{
  background:#f5f7fa;
  color:#526276;
}

body:not(.theme-dark) .remove-color-segment button.is-active{
  background:#dff8ed;
  color:#08623c;
}

body:not(.theme-dark) .remove-color-instruction{
  background:#eaf9f2;
}

body:not(.theme-dark) .remove-color-stage{
  background-color:#e9edf2;
  background-image:linear-gradient(45deg,#dce2e9 25%,transparent 25%),linear-gradient(-45deg,#dce2e9 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#dce2e9 75%),linear-gradient(-45deg,transparent 75%,#dce2e9 75%);
}

body:not(.theme-dark) .remove-color-metrics{background:#f6f8fb}

body:not(.theme-dark) .remove-color-result{
  border-top-color:#4baa7c;
  background:#e9f8f1;
}

body:not(.theme-dark) .remove-color-result-copy{color:#153d2d}
body:not(.theme-dark) .remove-color-result-copy small{color:#436d5c}

body:not(.theme-dark) .remove-color-complex a{
  padding:5px 8px;
  border:1px solid #279566;
  border-radius:4px;
  background:#e6f7ef;
  color:#075d39;
  font-weight:800;
  white-space:nowrap;
}

body:not(.theme-dark) .remove-color-complex a:hover{
  border-color:#087443;
  background:#d3f1e2;
  color:#044a2d;
}

body:not(.theme-dark) .remove-color-next a{
  border-color:#7da9df;
  background:#edf5ff;
  color:#0b55a7;
  font-weight:800;
}

body:not(.theme-dark) .remove-color-next a:hover{
  border-color:#286fc2;
  background:#dceaff;
  color:#073f7e;
}

body:not(.theme-dark) .remove-color-next a.is-ready{
  border-color:#39a674;
  background:#e5f7ee;
  color:#075d39;
}

body:not(.theme-dark) .remove-color-next a.is-ready:hover{
  border-color:#087443;
  background:#d0f0df;
  color:#044a2d;
}

body:not(.theme-dark) .remove-color-complex a:focus-visible,
body:not(.theme-dark) .remove-color-next a:focus-visible{
  outline:3px solid rgba(23,112,208,.28);
  outline-offset:2px;
}