.color-tool{overflow-wrap:anywhere}.color-tool .tool-title-row p:last-child,.color-tool .privacy-label{font-size:var(--type-primary)}.color-tool-icon:after{content:"RGB"}.color-tool-icon span{font-family:var(--font-display);font-size:25px}.color-workspace,.color-results,.color-help{margin:var(--space-6)}.color-input-grid{gap:var(--space-6);grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.color-input-panel{min-width:0}.color-input-panel>label{margin-bottom:var(--space-2);color:var(--blue-dark);font-weight:700;display:block}.color-input-row{gap:var(--space-2);grid-template-columns:52px minmax(0,1fr);display:grid}.color-input-row input{width:100%;min-width:0;min-height:var(--control-height);border:1px solid var(--line-strong);background:var(--surface);color:var(--ink);border-radius:3px}.color-input-row input[type=color]{cursor:pointer;padding:var(--space-1);height:48px}.color-input-row input[type=text]{padding:var(--space-2) var(--space-3);font:15px var(--font-code)}.color-input-row input[aria-invalid=true]{background:var(--error-surface);border-color:#a52820}.color-tool input:focus-visible,.color-tool button:focus-visible,.color-tool a:focus-visible{outline:3px solid var(--focus-color);outline-offset:3px}.color-input-error{color:#a52820;font-size:var(--type-primary);margin:var(--space-2) 0}.color-format-list{margin:var(--space-3) 0 0}.color-format-list>div{gap:var(--space-2);padding:var(--space-2) 0;border-bottom:1px solid var(--line);grid-template-columns:40px minmax(0,1fr) auto;align-items:center;display:grid}.color-format-list dt{color:var(--muted);font:14px var(--font-code)}.color-format-list dd{min-width:0;font:14px/1.6 var(--font-code);overflow-wrap:anywhere;margin:0}.color-tool .secondary-button{min-width:44px;min-height:44px;padding:var(--space-2) var(--space-3);font-size:var(--type-control);white-space:normal;overflow-wrap:anywhere}.color-swap-row{justify-content:space-between;align-items:center;gap:var(--space-3);margin-top:var(--space-4);flex-wrap:wrap;display:flex}.color-swap-row p{font-size:var(--type-primary);color:var(--muted);flex:290px;margin:0}.color-swap-row button{flex:0 auto}.color-results{gap:var(--space-6);border-top:1px solid var(--line-strong);padding-top:var(--space-6);grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);display:grid}.color-results h2,.color-help h2{color:var(--blue-dark);font:700 19px/1.4 var(--font-display);margin:0 0 var(--space-3)}.color-preview{min-height:238px;padding:var(--space-6);border:1px solid var(--line-strong);border-radius:3px}.color-preview h3{color:inherit;margin:0 0 var(--space-4);font-size:28px;line-height:1.4}.color-preview p{color:inherit;margin:0;font-size:16px;line-height:1.75}.color-preview-empty{border:1px dashed var(--line-strong);background:var(--surface-muted);min-height:238px;padding:var(--space-6);color:var(--muted);align-content:center;margin:0;display:grid}.color-ratio{font:700 clamp(32px, 4vw, 46px)/1.2 var(--font-code);color:var(--ink);margin:0 0 var(--space-4);display:block}.color-verdict-grid{gap:var(--space-2);grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.color-verdict-grid>div{gap:var(--space-1);border:1px solid var(--line);padding:var(--space-3);background:var(--surface-muted);display:grid}.color-verdict-grid>div>span:first-child{font-size:16px;font-weight:600}.color-verdict-grid>div>span:nth-child(2){font:14px var(--font-code);color:var(--muted)}.color-verdict-grid strong{font-size:16px;display:block}.color-verdict-grid [data-state=pass]{color:var(--green-dark)}.color-verdict-grid [data-state=fail]{color:#a52820}.color-verdict-grid [data-state=pending]{color:var(--muted)}.color-tool .standalone-status{margin:var(--space-6);font-size:16px}.color-help{padding-top:var(--space-6);border-top:1px solid var(--line-strong)}.color-help ul{margin:0;padding-inline-start:var(--space-6)}.color-help li{margin-bottom:var(--space-2);padding-inline-start:var(--space-1);font-size:16px;line-height:1.7}.color-source-links{gap:var(--space-2) var(--space-6);margin-top:var(--space-2);flex-wrap:wrap;display:flex}.color-source-links a{min-height:44px;color:var(--blue-dark);text-underline-offset:3px;align-items:center;text-decoration:underline;display:inline-flex}[data-i18n-page=color] .mobile-topbar>strong{text-overflow:ellipsis;white-space:nowrap;min-width:0;overflow:hidden}[data-i18n-page=color] #recommended-tools span[data-i18n]{font:inherit;color:inherit}@media (width<=800px){.color-results{grid-template-columns:minmax(0,1fr)}}@media (width<=650px){.color-workspace,.color-results,.color-help,.color-tool .standalone-status{margin:var(--space-4)}.color-input-grid{grid-template-columns:minmax(0,1fr)}.color-swap-row button{flex:100%}.color-preview{padding:var(--space-4)}.color-tool .tool-title-row{gap:var(--space-3);padding-inline:var(--space-4)}.color-tool .tool-title-row h1{font-size:23px}}@media (prefers-contrast:more){.color-input-row input,.color-preview,.color-preview-empty,.color-verdict-grid>div{border-width:2px}}@media (forced-colors:active){.color-verdict-grid strong,.color-input-error{color:canvastext}.color-input-row input[aria-invalid=true]{border-color:linktext}}