.tf-colour-control{display:block;margin-top:5px}.tf-colour-control input[type=color][hidden]{display:none!important}.tf-colour-open{display:flex!important;align-items:center;gap:10px;width:100%;min-height:42px;background:var(--site-surface,#fff)!important;color:var(--site-fg,#21322f)!important;border:1px solid var(--site-line,#d8ded5)!important;border-radius:6px;padding:8px 10px!important;font-weight:500}.tf-colour-chip{width:24px;height:24px;border:1px solid var(--site-line,#d8ded5);border-radius:4px;flex:none}.tf-colour-value{font-family:'IBM Plex Mono',monospace;font-size:13px;flex:1;text-align:left}.tf-colour-dialog{width:min(360px,calc(100vw - 28px));max-height:calc(100dvh - 28px);overflow:auto;margin:auto;padding:20px;border:1px solid var(--site-line,#d8ded5);border-radius:10px;background:var(--site-surface,#fff);color:var(--site-fg,#21322f);box-shadow:0 16px 50px #0004}.tf-colour-dialog::backdrop{background:#07120c88}.tf-colour-dialog header{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:16px}.tf-colour-dialog h2{font-size:18px;margin:0}.tf-colour-dialog button{background:var(--site-soft,#edf0e5);color:var(--site-fg,#21322f);border:1px solid var(--site-line,#d8ded5);border-radius:5px;padding:8px 12px}.tf-colour-square{height:160px;border-radius:5px;background-image:linear-gradient(to top,#000,transparent),linear-gradient(to right,#fff,transparent);position:relative;touch-action:none;cursor:crosshair}.tf-colour-point{position:absolute;transform:translate(-50%,-50%);height:13px;width:13px;border:2px solid white;box-shadow:0 0 0 1px #333;border-radius:50%;pointer-events:none}.tf-colour-dialog label{display:block;margin:12px 0 0;font-size:12px;color:var(--site-muted,#53665a);font-weight:600}.tf-colour-dialog input[type=range]{width:100%;margin-top:8px;accent-color:var(--site-brand,#214f45);height:24px;cursor:pointer}#tfColourHue{background:linear-gradient(to right,red,#ff0,#0f0,#0ff,#00f,#f0f,red);border-radius:12px}.tf-colour-sliders{display:grid;grid-template-columns:1fr 1fr;gap:14px}.tf-colour-hex-row{display:flex;align-items:end;gap:12px}.tf-colour-preview{height:42px;width:48px;border:1px solid var(--site-line,#d8ded5);border-radius:5px;flex:none}.tf-colour-hex-row label{flex:1}.tf-colour-dialog #tfColourHex{font-family:'IBM Plex Mono',monospace;font-size:16px;width:100%;padding:10px;background:var(--site-soft,#edf0e5);color:var(--site-fg,#21322f);border:1px solid var(--site-line,#d8ded5);border-radius:5px;margin-top:5px;text-transform:uppercase}.tf-colour-dialog #tfColourError{font-size:12px;color:var(--site-danger,#a53226);min-height:16px;margin:8px 0}.tf-colour-presets{display:grid;grid-template-columns:repeat(6,1fr);gap:9px}.tf-colour-dialog .tf-colour-swatch{height:30px;padding:0;border:1px solid var(--site-line,#d8ded5)}.tf-colour-dialog footer{display:flex;justify-content:flex-end;gap:8px;margin-top:18px}.tf-colour-dialog .tf-colour-apply{background:var(--site-brand,#214f45);color:var(--site-on-brand,#fff)}.tf-colour-dialog button:focus-visible,.tf-colour-open:focus-visible{outline:2px solid var(--site-focus,#789b5f);outline-offset:3px}
.tf-colour-dialog #tfColourHue{appearance:none;-webkit-appearance:none;height:14px;padding:0;border:0;background:linear-gradient(to right,red,#ff0,#0f0,#0ff,#00f,#f0f,red)!important}.tf-colour-dialog #tfColourHue::-webkit-slider-runnable-track{height:14px;background:transparent;border:0}.tf-colour-dialog #tfColourHue::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:18px;height:18px;background:#fff;border:2px solid #34463b;border-radius:50%;margin-top:-2px}.tf-colour-dialog #tfColourHue::-moz-range-track{background:transparent;border:0}.tf-colour-dialog #tfColourHue::-moz-range-thumb{width:16px;height:16px;background:#fff;border:2px solid #34463b;border-radius:50%}
