:root{--dkdt-space-xs:8px;--dkdt-space-sm:16px;--dkdt-space-md:24px;--dkdt-space-lg:32px;--dkdt-space-xl:48px;--dkdt-primary:#0073aa;--dkdt-primary-hover:#005a87;--dkdt-success:#46b450;--dkdt-warning:#ffb900;--dkdt-danger:#dc3232;--dkdt-text-primary:#23282d;--dkdt-text-secondary:#555d66;--dkdt-text-tertiary:#8f98a1;--dkdt-bg-white:#fff;--dkdt-bg-light:#f3f4f5;--dkdt-border:#c3c4c7;--dkdt-font-base:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;--dkdt-font-mono:"SF Mono",Monaco,"Cascadia Code","Roboto Mono",Consolas,"Courier New",monospace;--dkdt-text-sm:13px;--dkdt-text-base:14px;--dkdt-text-lg:16px;--dkdt-text-xl:18px;--dkdt-text-2xl:24px;--dkdt-shadow-sm:0 1px 3px rgba(0,0,0,.12);--dkdt-shadow-md:0 4px 6px rgba(0,0,0,.1);--dkdt-shadow-lg:0 10px 20px rgba(0,0,0,.15);--dkdt-radius-sm:4px;--dkdt-radius-md:6px;--dkdt-radius-lg:8px}.dkdt{color:var(--dkdt-text-primary);font-family:var(--dkdt-font-base);max-width:1400px}.dkdt-header{align-items:center;background:var(--dkdt-bg-white);border:1px solid var(--dkdt-border);border-radius:var(--dkdt-radius-sm);display:flex;justify-content:space-between;margin-bottom:var(--dkdt-space-md);padding:var(--dkdt-space-sm) var(--dkdt-space-md)}.dkdt-header-left{align-items:baseline;display:flex;gap:var(--dkdt-space-sm)}.dkdt-title{font-size:var(--dkdt-text-2xl);font-weight:600;line-height:1.2;margin:0;padding:0}.dkdt-subtitle{color:var(--dkdt-text-secondary);font-size:var(--dkdt-text-base)}.dkdt-version{background:var(--dkdt-bg-light);border-radius:var(--dkdt-radius-sm);color:var(--dkdt-text-tertiary);font-size:var(--dkdt-text-sm);padding:2px 8px}.dkdt-layout{display:flex;gap:var(--dkdt-space-md)}.dkdt-sidebar{background:var(--dkdt-bg-white);border:1px solid var(--dkdt-border);border-radius:var(--dkdt-radius-sm);min-width:200px;padding:var(--dkdt-space-sm);width:200px}.dkdt-sidebar-group{margin-bottom:var(--dkdt-space-sm)}.dkdt-sidebar-category{align-items:center;color:var(--dkdt-text-tertiary);display:flex;font-size:11px;font-weight:600;gap:6px;letter-spacing:.5px;margin:0 0 4px;padding:4px 8px;text-transform:uppercase}.dkdt-sidebar-icon{font-size:14px}.dkdt-sidebar-items{list-style:none;margin:0;padding:0}.dkdt-sidebar-item{background:none;border:none;border-left:3px solid transparent;border-radius:var(--dkdt-radius-sm);color:var(--dkdt-text-primary);cursor:pointer;display:block;font-size:var(--dkdt-text-base);padding:6px 12px 6px 28px;text-align:left;transition:background-color .15s,color .15s;width:100%}.dkdt-sidebar-item.active,.dkdt-sidebar-item:hover{background:#e8f0fe;color:var(--dkdt-primary)}.dkdt-sidebar-item.active{border-left-color:var(--dkdt-primary);font-weight:600}.dkdt-sidebar-divider{background:var(--dkdt-border);height:1px;margin:var(--dkdt-space-sm) 0}.dkdt-sidebar-pro{padding:4px 8px}.dkdt-pro-btn{background:var(--dkdt-warning);border:none;border-radius:var(--dkdt-radius-sm);color:#23282d;cursor:pointer;display:block;font-size:var(--dkdt-text-sm);font-weight:600;margin:0 auto;padding:8px 20px;text-align:center;transition:opacity .15s;width:auto}.dkdt-pro-btn:hover{opacity:.9}.dkdt-pro-btn:disabled{cursor:default;opacity:.6}.dkdt-pro-active{background:var(--dkdt-success);border-radius:var(--dkdt-radius-sm);color:#fff;display:inline-block;font-size:11px;font-weight:600;padding:4px 10px;text-align:center}.dkdt-sidebar-dev{padding:4px 8px}.dkdt-dev-toggle{align-items:center;cursor:pointer;display:flex;font-size:var(--dkdt-text-sm);gap:8px;-webkit-user-select:none;-moz-user-select:none;user-select:none}.dkdt-dev-toggle input{cursor:pointer;margin:0}.dkdt-dev-toggle-label{color:var(--dkdt-text-secondary);font-style:italic}.dkdt-content{flex:1;min-width:0}.dkdt-placeholder{background:var(--dkdt-bg-white);border:1px solid var(--dkdt-border);border-radius:var(--dkdt-radius-sm);padding:var(--dkdt-space-xl);text-align:center}.dkdt-placeholder h2{font-size:var(--dkdt-text-xl);margin:0 0 var(--dkdt-space-xs) 0}.dkdt-placeholder p{color:var(--dkdt-text-secondary);margin:0}.dkdt-tool-card{background:var(--dkdt-bg-white);border:1px solid var(--dkdt-border);border-radius:var(--dkdt-radius-md);overflow:hidden}.dkdt-tool-header{align-items:center;background:var(--dkdt-bg-light);border-bottom:1px solid var(--dkdt-border);display:flex;justify-content:space-between;padding:var(--dkdt-space-sm) var(--dkdt-space-md)}.dkdt-tool-title{font-size:var(--dkdt-text-lg);font-weight:600;margin:0}.dkdt-tool-help-wrap{position:relative}.dkdt-help-btn{align-items:center;background:var(--dkdt-bg-white);border:1px solid var(--dkdt-border);border-radius:50%;color:var(--dkdt-text-secondary);cursor:pointer;display:flex;font-size:12px;font-weight:700;height:24px;justify-content:center;transition:border-color .15s,color .15s;width:24px}.dkdt-help-btn:hover{border-color:var(--dkdt-primary);color:var(--dkdt-primary)}.dkdt-help-tooltip{background:var(--dkdt-bg-white);border:1px solid var(--dkdt-border);border-radius:var(--dkdt-radius-md);box-shadow:var(--dkdt-shadow-md);color:var(--dkdt-text-secondary);font-size:var(--dkdt-text-sm);line-height:1.5;padding:var(--dkdt-space-sm);position:absolute;right:0;top:32px;width:280px;z-index:10}.dkdt-preview-area{padding:var(--dkdt-space-md)}.dkdt-controls-area,.dkdt-output-area{border-top:1px solid var(--dkdt-border);padding:var(--dkdt-space-md)}.dkdt-output-area{background:var(--dkdt-bg-light)}.dkdt-section-label{color:var(--dkdt-text-tertiary);font-size:var(--dkdt-text-sm);font-weight:600;letter-spacing:.5px;margin:0 0 var(--dkdt-space-sm) 0;text-transform:uppercase}.dkdt-code-block{margin-bottom:var(--dkdt-space-sm)}.dkdt-code-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:var(--dkdt-space-xs)}.dkdt-code-header .dkdt-section-label{margin:0}.dkdt-code-pre{background:#1e1e1e;border-radius:var(--dkdt-radius-md);color:#d4d4d4;font-family:var(--dkdt-font-mono);font-size:var(--dkdt-text-sm);line-height:1.6;margin:0;overflow-x:auto;padding:var(--dkdt-space-sm);-moz-tab-size:2;-o-tab-size:2;tab-size:2}.dkdt-code-pre code{font-family:inherit;white-space:pre}.dkdt-copy-btn{background:var(--dkdt-bg-white);border:1px solid var(--dkdt-border);border-radius:var(--dkdt-radius-sm);color:var(--dkdt-text-secondary);cursor:pointer;font-size:var(--dkdt-text-sm);font-weight:500;padding:4px 12px;transition:border-color .15s,color .15s,background .15s}.dkdt-copy-btn:hover{border-color:var(--dkdt-primary);color:var(--dkdt-primary)}.dkdt-copy-btn.copied{background:var(--dkdt-success);border-color:var(--dkdt-success);color:#fff}.dkdt-control-group{margin-bottom:var(--dkdt-space-md)}.dkdt-control-group:last-child{margin-bottom:0}.dkdt-control-label{color:var(--dkdt-text-primary);display:block;font-size:var(--dkdt-text-sm);font-weight:600;margin-bottom:var(--dkdt-space-xs)}.dkdt-radio-group{border:1px solid var(--dkdt-border);border-radius:var(--dkdt-radius-sm);display:flex;gap:0;overflow:hidden;width:-moz-fit-content;width:fit-content}.dkdt-radio{background:var(--dkdt-bg-white);border-right:1px solid var(--dkdt-border);cursor:pointer;font-size:var(--dkdt-text-sm);padding:6px 16px;transition:background .15s,color .15s;-webkit-user-select:none;-moz-user-select:none;user-select:none}.dkdt-radio:last-child{border-right:none}.dkdt-radio input{display:none}.dkdt-radio:hover{background:var(--dkdt-bg-light)}.dkdt-radio.active{background:var(--dkdt-primary);color:#fff}.dkdt-range{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:var(--dkdt-border);border-radius:3px;cursor:pointer;height:6px;outline:none;width:100%}.dkdt-range::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;background:var(--dkdt-primary);border:2px solid #fff;border-radius:50%;box-shadow:var(--dkdt-shadow-sm);cursor:pointer;height:16px;width:16px}.dkdt-range::-moz-range-thumb{background:var(--dkdt-primary);border:2px solid #fff;border-radius:50%;box-shadow:var(--dkdt-shadow-sm);cursor:pointer;height:16px;width:16px}.dkdt-range-row{margin-bottom:var(--dkdt-space-xs)}.dkdt-range-label{color:var(--dkdt-text-secondary);display:block;font-size:var(--dkdt-text-sm);margin-bottom:4px}.dkdt-gradient-preview{border:1px solid var(--dkdt-border);border-radius:var(--dkdt-radius-md);height:200px;transition:background .1s;width:100%}.dkdt-gradient-controls .dkdt-controls-area{border-top:none;padding:0}.dkdt-direction-presets{display:flex;flex-wrap:wrap;gap:4px;margin-bottom:var(--dkdt-space-xs)}.dkdt-direction-btn{align-items:center;background:var(--dkdt-bg-white);border:1px solid var(--dkdt-border);border-radius:var(--dkdt-radius-sm);cursor:pointer;display:flex;font-size:16px;height:36px;justify-content:center;transition:border-color .15s,background .15s;width:36px}.dkdt-direction-btn:hover{background:#e8f0fe;border-color:var(--dkdt-primary)}.dkdt-direction-btn.active{background:var(--dkdt-primary);border-color:var(--dkdt-primary);color:#fff}.dkdt-color-stops{flex-direction:column;margin-bottom:var(--dkdt-space-sm)}.dkdt-color-stop,.dkdt-color-stops{display:flex;gap:var(--dkdt-space-xs)}.dkdt-color-stop{align-items:center;background:var(--dkdt-bg-light);border:1px solid var(--dkdt-border);border-radius:var(--dkdt-radius-sm);padding:var(--dkdt-space-xs) var(--dkdt-space-sm)}.dkdt-color-picker{background:none;cursor:pointer;height:36px;padding:2px;width:36px}.dkdt-color-picker,.dkdt-hex-input{border:1px solid var(--dkdt-border);border-radius:var(--dkdt-radius-sm);flex-shrink:0}.dkdt-hex-input{font-family:var(--dkdt-font-mono);font-size:var(--dkdt-text-sm);padding:6px 8px;text-transform:uppercase;width:80px}.dkdt-hex-input:focus{border-color:var(--dkdt-primary);box-shadow:0 0 0 1px var(--dkdt-primary);outline:none}.dkdt-position-control{align-items:center;display:flex;flex:1;gap:var(--dkdt-space-xs);min-width:0}.dkdt-range-sm{flex:1;min-width:60px}.dkdt-position-value{color:var(--dkdt-text-secondary);flex-shrink:0;font-family:var(--dkdt-font-mono);font-size:var(--dkdt-text-sm);min-width:36px;text-align:right}.dkdt-remove-btn{align-items:center;background:var(--dkdt-bg-white);border:1px solid var(--dkdt-border);border-radius:var(--dkdt-radius-sm);color:var(--dkdt-text-tertiary);cursor:pointer;display:flex;flex-shrink:0;font-size:18px;height:28px;justify-content:center;line-height:1;transition:border-color .15s,color .15s,background .15s;width:28px}.dkdt-remove-btn:hover{background:#fef1f1;border-color:var(--dkdt-danger);color:var(--dkdt-danger)}.dkdt-add-btn{background:none;border:1px dashed var(--dkdt-border);border-radius:var(--dkdt-radius-sm);color:var(--dkdt-primary);cursor:pointer;font-size:var(--dkdt-text-sm);font-weight:500;padding:8px 16px;transition:border-color .15s,background .15s}.dkdt-add-btn:hover{background:#e8f0fe;border-color:var(--dkdt-primary)}.dkdt-presets{display:flex;flex-wrap:wrap;gap:var(--dkdt-space-xs)}.dkdt-preset-btn{border:2px solid var(--dkdt-border);border-radius:var(--dkdt-radius-sm);cursor:pointer;height:40px;overflow:hidden;position:relative;transition:border-color .15s,transform .1s;width:64px}.dkdt-preset-btn:hover{border-color:var(--dkdt-primary);transform:scale(1.05)}.dkdt-preset-label{background:rgba(0,0,0,.5);bottom:0;color:#fff;font-size:9px;font-weight:600;left:0;letter-spacing:.3px;padding:1px 2px;position:absolute;right:0;text-align:center;text-transform:uppercase}.dkdt-tip{color:var(--dkdt-text-secondary);font-size:var(--dkdt-text-sm);font-style:italic;margin:var(--dkdt-space-xs) 0 0 0}.dkdt-radial-position{margin-top:var(--dkdt-space-xs)}.dkdt-color-row{display:flex;flex-wrap:wrap;gap:var(--dkdt-space-md)}.dkdt-color-field{display:flex;flex-direction:column;gap:4px}.dkdt-color-input-pair{align-items:center;display:flex;gap:var(--dkdt-space-xs)}.dkdt-text-input{border:1px solid var(--dkdt-border);border-radius:var(--dkdt-radius-sm);font-family:var(--dkdt-font-base);font-size:var(--dkdt-text-base);padding:8px 12px;transition:border-color .15s;width:100%}.dkdt-text-input:focus{border-color:var(--dkdt-primary);box-shadow:0 0 0 1px var(--dkdt-primary);outline:none}.dkdt-select{background:var(--dkdt-bg-white);border:1px solid var(--dkdt-border);border-radius:var(--dkdt-radius-sm);cursor:pointer;font-family:var(--dkdt-font-base);font-size:var(--dkdt-text-base);padding:8px 12px}.dkdt-select:focus{border-color:var(--dkdt-primary);box-shadow:0 0 0 1px var(--dkdt-primary);outline:none}.dkdt-checkbox{align-items:center;cursor:pointer;display:flex;font-size:var(--dkdt-text-sm);gap:6px;-webkit-user-select:none;-moz-user-select:none;user-select:none;white-space:nowrap}.dkdt-checkbox input{cursor:pointer;margin:0}.dkdt-icon-btn{align-items:center;background:var(--dkdt-bg-white);border:1px solid var(--dkdt-border);border-radius:var(--dkdt-radius-sm);color:var(--dkdt-text-tertiary);cursor:pointer;display:flex;font-size:10px;height:28px;justify-content:center;transition:border-color .15s,color .15s;width:28px}.dkdt-icon-btn:hover:not(:disabled){border-color:var(--dkdt-primary);color:var(--dkdt-primary)}.dkdt-icon-btn:disabled{cursor:default;opacity:.3}.dkdt-field-value{color:var(--dkdt-text-secondary);flex-shrink:0;font-family:var(--dkdt-font-mono);font-size:var(--dkdt-text-sm);min-width:48px;text-align:right}.dkdt-shadow-preview{align-items:center;border:1px solid var(--dkdt-border);border-radius:var(--dkdt-radius-md);display:flex;height:200px;justify-content:center;width:100%}.dkdt-shadow-box{border-radius:var(--dkdt-radius-md);height:120px;transition:box-shadow .15s;width:120px}.dkdt-shadow-layer{background:var(--dkdt-bg-light);border:1px solid var(--dkdt-border);border-radius:var(--dkdt-radius-sm);margin-bottom:var(--dkdt-space-sm);padding:var(--dkdt-space-sm)}.dkdt-shadow-layer-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:var(--dkdt-space-sm)}.dkdt-shadow-layer-title{font-size:var(--dkdt-text-sm);font-weight:600}.dkdt-shadow-layer-actions{display:flex;gap:4px}.dkdt-shadow-fields{display:grid;gap:var(--dkdt-space-xs) var(--dkdt-space-md);grid-template-columns:1fr 1fr;margin-bottom:var(--dkdt-space-sm)}.dkdt-shadow-field{display:flex;flex-direction:column;gap:4px}.dkdt-shadow-field .dkdt-range{flex:1}.dkdt-shadow-bottom-row{align-items:center;display:flex;flex-wrap:wrap;gap:var(--dkdt-space-md)}.dkdt-shadow-field-opacity{flex:1;min-width:120px}.dkdt-qr-preview{padding:var(--dkdt-space-md) 0}.dkdt-qr-display,.dkdt-qr-preview{display:flex;justify-content:center}.dkdt-qr-display{background:#fff;border:1px solid var(--dkdt-border);border-radius:var(--dkdt-radius-md);padding:var(--dkdt-space-md)}.dkdt-qr-download-row{display:flex;flex-wrap:wrap;gap:var(--dkdt-space-sm)}.dkdt-download-btn{background:var(--dkdt-primary);border:none;border-radius:var(--dkdt-radius-sm);color:#fff;cursor:pointer;font-size:var(--dkdt-text-sm);font-weight:600;padding:10px 20px;transition:background .15s}.dkdt-download-btn:hover{background:var(--dkdt-primary-hover)}.dkdt-download-btn-outline{background:var(--dkdt-bg-white);border:1px solid var(--dkdt-primary);color:var(--dkdt-primary)}.dkdt-download-btn-outline:hover{background:#e8f0fe}.dkdt-contrast-preview{align-items:center;display:flex;gap:var(--dkdt-space-md)}.dkdt-contrast-sample{border:1px solid var(--dkdt-border);border-radius:var(--dkdt-radius-md);display:flex;flex:1;flex-direction:column;gap:var(--dkdt-space-xs);justify-content:center;min-height:120px;padding:var(--dkdt-space-md)}.dkdt-contrast-sample-large{font-size:18px;font-weight:600}.dkdt-contrast-sample-normal{font-size:14px}.dkdt-contrast-sample-small{font-size:11px}.dkdt-contrast-ratio-display{align-items:center;display:flex;flex-direction:column;min-width:80px}.dkdt-contrast-ratio-value{color:var(--dkdt-text-primary);font-family:var(--dkdt-font-mono);font-size:32px;font-weight:700}.dkdt-contrast-ratio-label{color:var(--dkdt-text-secondary);font-size:var(--dkdt-text-sm)}.dkdt-contrast-color-row{align-items:flex-end;display:flex;flex-wrap:wrap;gap:var(--dkdt-space-md)}.dkdt-contrast-swap-btn{align-items:center;background:var(--dkdt-bg-white);border:1px solid var(--dkdt-border);border-radius:var(--dkdt-radius-sm);cursor:pointer;display:flex;font-size:20px;height:36px;justify-content:center;margin-bottom:2px;transition:border-color .15s,color .15s;width:36px}.dkdt-contrast-swap-btn:hover{border-color:var(--dkdt-primary);color:var(--dkdt-primary)}.dkdt-contrast-results{display:flex;flex-direction:column;gap:var(--dkdt-space-sm)}.dkdt-contrast-result-row{align-items:center;background:var(--dkdt-bg-light);border:1px solid var(--dkdt-border);border-radius:var(--dkdt-radius-sm);display:flex;flex-wrap:wrap;gap:var(--dkdt-space-sm);padding:var(--dkdt-space-xs) var(--dkdt-space-sm)}.dkdt-contrast-result-label{font-size:var(--dkdt-text-sm);font-weight:600;min-width:200px}.dkdt-contrast-badges{display:flex;gap:4px}.dkdt-contrast-badge{border-radius:var(--dkdt-radius-sm);display:inline-block;font-size:11px;font-weight:700;padding:2px 8px}.dkdt-contrast-pass{background:var(--dkdt-success);color:#fff}.dkdt-contrast-fail{background:var(--dkdt-danger);color:#fff}.dkdt-contrast-req{color:var(--dkdt-text-tertiary);font-size:11px;margin-left:auto}.dkdt-convert-preview{display:flex;justify-content:center}.dkdt-convert-swatch-large{border:1px solid var(--dkdt-border);border-radius:var(--dkdt-radius-md);height:100px;transition:background .15s;width:100%}.dkdt-convert-input-row{align-items:center;display:flex;gap:var(--dkdt-space-sm)}.dkdt-convert-input-row .dkdt-text-input{flex:1}.dkdt-convert-formats{display:flex;flex-direction:column;gap:4px}.dkdt-convert-row{align-items:center;background:var(--dkdt-bg-light);border:1px solid var(--dkdt-border);border-radius:var(--dkdt-radius-sm);display:flex;gap:var(--dkdt-space-sm);padding:6px var(--dkdt-space-sm)}.dkdt-convert-label{color:var(--dkdt-text-secondary);font-size:var(--dkdt-text-sm);font-weight:600;min-width:52px}.dkdt-convert-value{color:var(--dkdt-text-primary);flex:1;font-family:var(--dkdt-font-mono);font-size:var(--dkdt-text-sm)}.dkdt-placeholder-preview{display:flex;justify-content:center}.dkdt-placeholder-canvas{border:1px solid var(--dkdt-border);border-radius:var(--dkdt-radius-sm)}.dkdt-placeholder-presets{display:flex;flex-wrap:wrap;gap:6px}.dkdt-placeholder-preset-btn{align-items:center;background:var(--dkdt-bg-white);border:1px solid var(--dkdt-border);border-radius:var(--dkdt-radius-sm);cursor:pointer;display:flex;flex-direction:column;padding:6px 10px;transition:border-color .15s}.dkdt-placeholder-preset-btn:hover{border-color:var(--dkdt-primary)}.dkdt-placeholder-preset-name{color:var(--dkdt-text-primary);font-size:11px;font-weight:600}.dkdt-placeholder-preset-size{color:var(--dkdt-text-tertiary);font-family:var(--dkdt-font-mono);font-size:10px}.dkdt-placeholder-dims{align-items:flex-end;display:flex;gap:var(--dkdt-space-sm)}.dkdt-placeholder-dim{display:flex;flex-direction:column;gap:4px}.dkdt-placeholder-dim .dkdt-text-input{width:100px}.dkdt-placeholder-x{color:var(--dkdt-text-tertiary);font-size:var(--dkdt-text-lg);padding-bottom:6px}.dkdt-lorem-preview{max-height:300px;overflow-y:auto}.dkdt-lorem-text{color:var(--dkdt-text-primary);font-size:var(--dkdt-text-base);line-height:1.7;white-space:pre-wrap}.dkdt-lorem-stats{border-top:1px solid var(--dkdt-border);color:var(--dkdt-text-tertiary);display:flex;font-family:var(--dkdt-font-mono);font-size:var(--dkdt-text-sm);gap:var(--dkdt-space-md);margin-top:var(--dkdt-space-sm);padding-top:var(--dkdt-space-xs)}.dkdt-lorem-options{display:flex;flex-direction:column;gap:6px}.dkdt-textarea{border:1px solid var(--dkdt-border);border-radius:var(--dkdt-radius-sm);font-family:var(--dkdt-font-mono);font-size:var(--dkdt-text-sm);line-height:1.6;padding:var(--dkdt-space-sm);resize:vertical;transition:border-color .15s;width:100%}.dkdt-textarea:focus{border-color:var(--dkdt-primary);box-shadow:0 0 0 1px var(--dkdt-primary);outline:none}.dkdt-encoder-direction-row{align-items:center;display:flex;gap:var(--dkdt-space-sm)}.dkdt-encoder-stats{color:var(--dkdt-text-tertiary);font-family:var(--dkdt-font-mono);font-size:var(--dkdt-text-sm)}.dkdt-border-preview{align-items:center;border:1px solid var(--dkdt-border);border-radius:var(--dkdt-radius-md);display:flex;height:200px;justify-content:center;width:100%}.dkdt-border-box{height:120px;transition:border .15s;width:160px}.dkdt-border-link-row{align-items:center;display:flex;justify-content:space-between}.dkdt-border-side{background:var(--dkdt-bg-light);border:1px solid var(--dkdt-border);border-radius:var(--dkdt-radius-sm);margin-bottom:var(--dkdt-space-sm);padding:var(--dkdt-space-sm)}.dkdt-border-side-label{display:block;font-size:var(--dkdt-text-sm);font-weight:600;margin-bottom:var(--dkdt-space-xs);text-transform:capitalize}.dkdt-border-side-fields{align-items:flex-end;display:flex;flex-wrap:wrap;gap:var(--dkdt-space-md)}.dkdt-border-field{display:flex;flex-direction:column;gap:4px;min-width:100px}.dkdt-range-with-value{align-items:center;display:flex;gap:var(--dkdt-space-xs)}.dkdt-range-with-value .dkdt-range{flex:1;min-width:80px}.dkdt-radius-preview{align-items:center;border:1px solid var(--dkdt-border);border-radius:var(--dkdt-radius-md);display:flex;height:200px;justify-content:center;width:100%}.dkdt-radius-box{height:120px;transition:border-radius .15s;width:160px}.dkdt-radius-options{align-items:center;display:flex;gap:var(--dkdt-space-sm)}.dkdt-radius-presets{display:flex;flex-wrap:wrap;gap:var(--dkdt-space-xs)}.dkdt-radius-preset-btn{align-items:center;background:var(--dkdt-bg-white);border:1px solid var(--dkdt-border);border-radius:var(--dkdt-radius-sm);cursor:pointer;display:flex;flex-direction:column;gap:4px;height:56px;justify-content:center;padding:4px;transition:border-color .15s;width:64px}.dkdt-radius-preset-btn:hover{border-color:var(--dkdt-primary)}.dkdt-radius-preset-shape{background:var(--dkdt-primary);height:22px;width:28px}.dkdt-radius-preset-name{color:var(--dkdt-text-secondary);font-size:9px;font-weight:600;letter-spacing:.3px;text-transform:uppercase}.dkdt-cp{display:inline-block;position:relative}.dkdt-cp-trigger-row{align-items:center;display:flex;gap:6px}.dkdt-cp-swatch{border:2px solid var(--dkdt-border);border-radius:var(--dkdt-radius-sm);cursor:pointer;flex-shrink:0;height:32px;padding:0;transition:border-color .15s;width:32px}.dkdt-cp-swatch:hover{border-color:var(--dkdt-primary)}.dkdt-cp-popover{background:var(--dkdt-bg-white);border:1px solid var(--dkdt-border);border-radius:var(--dkdt-radius-md);box-shadow:var(--dkdt-shadow-lg);left:0;margin-top:6px;padding:10px;position:absolute;top:100%;width:220px;z-index:100}.dkdt-cp-sat-panel{border-radius:var(--dkdt-radius-sm);cursor:crosshair;height:140px;margin-bottom:10px;overflow:hidden;position:relative;width:100%}.dkdt-cp-sat-white{background:linear-gradient(90deg,#fff,transparent);inset:0;position:absolute}.dkdt-cp-sat-black{background:linear-gradient(180deg,transparent,#000);inset:0;position:absolute}.dkdt-cp-sat-cursor{border:2px solid #fff;border-radius:50%;box-shadow:0 0 2px rgba(0,0,0,.6);height:14px;pointer-events:none;position:absolute;transform:translate(-50%,-50%);width:14px}.dkdt-cp-hue-bar{background:linear-gradient(90deg,red,#ff0,#0f0,#0ff,#00f,#f0f,red);border-radius:7px;cursor:pointer;height:14px;margin-bottom:10px;position:relative;width:100%}.dkdt-cp-hue-cursor{border:2px solid #fff;border-radius:3px;box-shadow:0 0 2px rgba(0,0,0,.6);height:16px;pointer-events:none;position:absolute;top:-1px;transform:translateX(-50%);width:8px}.dkdt-cp-footer{align-items:center;display:flex;gap:8px}.dkdt-cp-preview-swatch{border:1px solid var(--dkdt-border);border-radius:var(--dkdt-radius-sm);flex-shrink:0;height:28px;width:28px}.dkdt-cp-hex{flex:1;width:auto}.dkdt-pro-gate{position:relative}.dkdt-pro-gate-content{filter:grayscale(30%);opacity:.5;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}.dkdt-pro-gate-overlay{align-items:center;backdrop-filter:blur(1px);background:hsla(0,0%,100%,.7);border-radius:var(--dkdt-radius-sm);display:flex;flex-direction:column;gap:8px;inset:0;justify-content:center;position:absolute;z-index:5}.dkdt-pro-badge{background:var(--dkdt-warning);border-radius:var(--dkdt-radius-sm);box-shadow:0 1px 3px rgba(0,0,0,.15);color:#23282d;display:inline-block;font-size:11px;font-weight:700;letter-spacing:.5px;padding:3px 10px;text-transform:uppercase}.dkdt-pro-feature-label{background:hsla(0,0%,100%,.85);border-radius:var(--dkdt-radius-sm);color:#1e1e1e;font-size:var(--dkdt-text-sm);font-weight:600;padding:4px 12px;text-align:center}.dkdt-sidebar-pro-tag{letter-spacing:.3px;margin-left:6px}.dkdt-pro-badge-inline,.dkdt-sidebar-pro-tag{background:var(--dkdt-warning);border-radius:3px;color:#23282d;display:inline-block;font-size:9px;font-weight:700;padding:1px 5px;text-transform:uppercase;vertical-align:middle}.dkdt-pro-badge-inline{margin-left:4px}.dkdt-radio-disabled{cursor:not-allowed;opacity:.5;pointer-events:none}.dkdt-logo-upload{margin-bottom:var(--dkdt-space-xs)}.dkdt-logo-preview-row{align-items:center;display:flex;gap:var(--dkdt-space-sm)}.dkdt-logo-thumb{background:var(--dkdt-bg-light);border:1px solid var(--dkdt-border);border-radius:var(--dkdt-radius-sm);height:48px;-o-object-fit:contain;object-fit:contain;width:48px}.dkdt-logo-info{align-items:center;display:flex}.dkdt-logo-size-control{margin-top:var(--dkdt-space-xs)}.dkdt-formatter-actions{display:flex;gap:var(--dkdt-space-sm)}.dkdt-string-stats{display:flex;flex-wrap:wrap;gap:var(--dkdt-space-md)}.dkdt-string-stat{align-items:center;background:var(--dkdt-bg-light);border:1px solid var(--dkdt-border);border-radius:var(--dkdt-radius-sm);display:flex;flex-direction:column;min-width:80px;padding:var(--dkdt-space-sm) var(--dkdt-space-md)}.dkdt-string-stat-value{color:var(--dkdt-primary);font-family:var(--dkdt-font-mono);font-size:24px;font-weight:700}.dkdt-string-stat-label{color:var(--dkdt-text-tertiary);font-size:11px;letter-spacing:.5px;text-transform:uppercase}.dkdt-string-transforms{display:flex;flex-wrap:wrap;gap:6px}.dkdt-string-transform-btn{background:var(--dkdt-bg-white);border:1px solid var(--dkdt-border);border-radius:var(--dkdt-radius-sm);cursor:pointer;font-size:var(--dkdt-text-sm);padding:6px 12px;transition:border-color .15s,background .15s}.dkdt-string-transform-btn:hover{background:#e8f0fe;border-color:var(--dkdt-primary)}.dkdt-string-find-row{align-items:center;display:flex;flex-wrap:wrap;gap:var(--dkdt-space-xs)}.dkdt-string-find-row .dkdt-text-input{flex:1;min-width:120px}.dkdt-textarea-mono{font-family:var(--dkdt-font-mono);font-size:var(--dkdt-text-sm);-moz-tab-size:2;-o-tab-size:2;tab-size:2}.dkdt-md-rendered{font-size:var(--dkdt-text-base);line-height:1.7}.dkdt-md-rendered h1,.dkdt-md-rendered h2,.dkdt-md-rendered h3,.dkdt-md-rendered h4,.dkdt-md-rendered h5,.dkdt-md-rendered h6{margin:.5em 0 .3em}.dkdt-md-rendered pre{background:#1e1e1e;border-radius:var(--dkdt-radius-sm);color:#d4d4d4;overflow-x:auto;padding:var(--dkdt-space-sm)}.dkdt-md-rendered code{background:var(--dkdt-bg-light);border-radius:3px;font-family:var(--dkdt-font-mono);font-size:.9em;padding:2px 4px}.dkdt-md-rendered pre code{background:none;padding:0}.dkdt-md-rendered blockquote{border-left:3px solid var(--dkdt-primary);color:var(--dkdt-text-secondary);margin:var(--dkdt-space-sm) 0;padding-left:var(--dkdt-space-sm)}.dkdt-md-rendered table{border-collapse:collapse;margin:var(--dkdt-space-sm) 0;width:100%}.dkdt-md-rendered td,.dkdt-md-rendered th{border:1px solid var(--dkdt-border);padding:6px 12px;text-align:left}.dkdt-md-rendered th{background:var(--dkdt-bg-light);font-weight:600}.dkdt-md-rendered hr{border:none;border-top:1px solid var(--dkdt-border);margin:var(--dkdt-space-md) 0}.dkdt-svg-empty,.dkdt-svg-error{color:var(--dkdt-text-tertiary);font-size:var(--dkdt-text-sm);padding:var(--dkdt-space-xl);text-align:center}.dkdt-svg-error{color:var(--dkdt-danger)}.dkdt-file-input{font-size:var(--dkdt-text-sm)}.dkdt-testdata-fields{display:flex;flex-wrap:wrap;gap:6px 16px}.dkdt-clip-preview{align-items:center;border:1px solid var(--dkdt-border);border-radius:var(--dkdt-radius-md);display:flex;height:250px;justify-content:center;width:100%}.dkdt-clip-shape{height:200px;transition:clip-path .2s;width:200px}.dkdt-clip-presets{display:flex;flex-wrap:wrap;gap:6px}.dkdt-clip-preset-btn{align-items:center;background:var(--dkdt-bg-white);border:1px solid var(--dkdt-border);border-radius:var(--dkdt-radius-sm);cursor:pointer;display:flex;flex-direction:column;gap:3px;height:56px;justify-content:center;padding:4px;transition:border-color .15s;width:64px}.dkdt-clip-preset-btn.active,.dkdt-clip-preset-btn:hover{border-color:var(--dkdt-primary)}.dkdt-clip-preset-btn.active{background:#e8f0fe}.dkdt-clip-preset-thumb{background:var(--dkdt-primary);height:24px;width:28px}.dkdt-clip-preset-name{color:var(--dkdt-text-secondary);font-size:8px;font-weight:600;letter-spacing:.3px;text-transform:uppercase}.dkdt-diff-inputs{display:flex;gap:var(--dkdt-space-sm)}.dkdt-diff-input-col{flex:1;min-width:0}.dkdt-diff-stats{display:flex;font-family:var(--dkdt-font-mono);font-size:var(--dkdt-text-sm);font-weight:600;gap:var(--dkdt-space-md);margin-bottom:var(--dkdt-space-sm)}.dkdt-diff-stat-add{color:var(--dkdt-success)}.dkdt-diff-stat-remove{color:var(--dkdt-danger)}.dkdt-diff-stat-equal{color:var(--dkdt-text-tertiary)}.dkdt-diff-output{border:1px solid var(--dkdt-border);border-radius:var(--dkdt-radius-sm);font-family:var(--dkdt-font-mono);font-size:var(--dkdt-text-sm);max-height:400px;overflow:hidden;overflow-y:auto}.dkdt-diff-line{display:flex;padding:1px 0}.dkdt-diff-gutter{color:var(--dkdt-text-tertiary);flex-shrink:0;text-align:center;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:24px}.dkdt-diff-text{flex:1;padding:0 var(--dkdt-space-xs);white-space:pre-wrap;word-break:break-all}.dkdt-diff-add{background:#e6ffec}.dkdt-diff-add .dkdt-diff-gutter{color:var(--dkdt-success)}.dkdt-diff-remove{background:#fff0f0}.dkdt-diff-remove .dkdt-diff-gutter{color:var(--dkdt-danger)}.dkdt-meta-char-count{color:var(--dkdt-text-tertiary);float:right;font-size:12px;font-weight:400}.dkdt-meta-previews,.dkdt-meta-row{display:flex;gap:var(--dkdt-space-md)}.dkdt-meta-previews{flex-direction:column}.dkdt-meta-preview-block{margin-bottom:var(--dkdt-space-xs)}.dkdt-meta-google{background:var(--dkdt-bg-white);border:1px solid var(--dkdt-border);border-radius:var(--dkdt-radius-md);padding:var(--dkdt-space-sm)}.dkdt-meta-google-url{color:#202124;font-size:12px;margin-bottom:2px}.dkdt-meta-google-title{color:#1a0dab;font-size:18px;line-height:1.3;margin-bottom:4px}.dkdt-meta-google-desc{color:#4d5156;font-size:13px;line-height:1.4}.dkdt-meta-social{border:1px solid var(--dkdt-border);border-radius:var(--dkdt-radius-md);max-width:500px;overflow:hidden}.dkdt-meta-social-image{align-items:center;display:flex;height:160px;justify-content:center;width:100%}.dkdt-meta-social-image-placeholder{color:#888;font-size:var(--dkdt-text-sm)}.dkdt-meta-social-body{padding:10px 14px}.dkdt-meta-social-domain{color:var(--dkdt-text-tertiary);font-size:11px;margin-bottom:2px;text-transform:uppercase}.dkdt-meta-social-title{color:var(--dkdt-text-primary);font-size:15px;font-weight:600;line-height:1.3;margin-bottom:2px}.dkdt-meta-social-desc{color:var(--dkdt-text-secondary);font-size:13px;line-height:1.4}.dkdt-palette-preview{align-items:center;display:flex;flex-direction:column;gap:var(--dkdt-space-md)}.dkdt-palette-wheel-wrap{display:flex;justify-content:center}.dkdt-palette-wheel-container{height:280px;position:relative;width:280px}.dkdt-palette-wheel{border-radius:50%;cursor:crosshair;display:block}.dkdt-palette-marker{border:3px solid #fff;border-radius:50%;box-shadow:0 0 4px rgba(0,0,0,.4);height:20px;pointer-events:none;position:absolute;transform:translate(-50%,-50%);width:20px;z-index:2}.dkdt-palette-marker-base{border-width:3px;box-shadow:0 0 6px rgba(0,0,0,.5),inset 0 0 0 1px rgba(0,0,0,.1);height:24px;width:24px;z-index:3}.dkdt-palette-center{align-items:center;border:3px solid #fff;border-radius:50%;box-shadow:0 2px 8px rgba(0,0,0,.2);display:flex;height:80px;justify-content:center;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);width:80px;z-index:1}.dkdt-palette-center-hex{color:#fff;font-family:var(--dkdt-font-mono);font-size:11px;font-weight:700;letter-spacing:.3px;text-shadow:0 1px 3px rgba(0,0,0,.6)}.dkdt-palette-strip{display:flex;gap:var(--dkdt-space-xs);max-width:560px;width:100%}.dkdt-palette-swatch-col{align-items:center;display:flex;flex:1;flex-direction:column;gap:4px;min-width:0}.dkdt-palette-swatch{border:1px solid var(--dkdt-border);border-radius:var(--dkdt-radius-md);height:64px;transition:background .15s;width:100%}.dkdt-palette-swatch-hex{color:var(--dkdt-text-secondary);font-family:var(--dkdt-font-mono);font-size:11px;letter-spacing:.3px}.dkdt-palette-harmonies{display:flex;flex-wrap:wrap;gap:6px}.dkdt-palette-harmony-btn{background:var(--dkdt-bg-white);border:1px solid var(--dkdt-border);border-radius:var(--dkdt-radius-sm);cursor:pointer;font-size:var(--dkdt-text-sm);padding:6px 14px;transition:border-color .15s,background .15s,color .15s}.dkdt-palette-harmony-btn:hover{background:#e8f0fe;border-color:var(--dkdt-primary)}.dkdt-palette-harmony-btn.active{background:var(--dkdt-primary);border-color:var(--dkdt-primary);color:#fff}.dkdt-palette-slider-group{display:flex;flex-direction:column;gap:var(--dkdt-space-xs)}.dkdt-palette-slider-row{align-items:center;display:flex;gap:var(--dkdt-space-sm)}.dkdt-palette-slider-label{color:var(--dkdt-text-secondary);font-size:var(--dkdt-text-sm);min-width:72px}.dkdt-palette-slider-row .dkdt-range{flex:1}.dkdt-palette-all-hex{background:var(--dkdt-bg-light);border:1px solid var(--dkdt-border);border-radius:var(--dkdt-radius-sm);color:var(--dkdt-text-primary);display:block;font-family:var(--dkdt-font-mono);font-size:var(--dkdt-text-sm);padding:var(--dkdt-space-xs) var(--dkdt-space-sm);word-break:break-all}.dkdt-flex-options{display:flex;flex-wrap:wrap;gap:4px}.dkdt-flex-option-btn{background:var(--dkdt-bg-white);border:1px solid var(--dkdt-border);border-radius:var(--dkdt-radius-sm);cursor:pointer;font-family:var(--dkdt-font-mono);font-size:12px;padding:5px 10px;transition:border-color .15s,background .15s,color .15s}.dkdt-flex-option-btn:hover{background:#e8f0fe;border-color:var(--dkdt-primary)}.dkdt-flex-option-btn.active{background:var(--dkdt-primary);border-color:var(--dkdt-primary);color:#fff}.dkdt-flex-item-controls{background:#f0f6ff;border:1px solid #b3d4fc;border-radius:var(--dkdt-radius-sm);margin-top:var(--dkdt-space-sm);padding:var(--dkdt-space-sm)}.dkdt-flex-item-controls>.dkdt-control-label{align-items:center;display:flex;justify-content:space-between}.dkdt-flex-deselect{background:var(--dkdt-bg-white);border:1px solid var(--dkdt-border);border-radius:var(--dkdt-radius-sm);color:var(--dkdt-text-secondary);cursor:pointer;font-size:12px;padding:2px 10px}.dkdt-flex-deselect:hover{border-color:var(--dkdt-primary);color:var(--dkdt-primary)}.dkdt-flex-item-fields{display:flex;flex-direction:column;gap:var(--dkdt-space-xs)}.dkdt-flex-item-field{align-items:center;display:flex;gap:var(--dkdt-space-sm)}.dkdt-flex-item-field .dkdt-range,.dkdt-flex-item-field .dkdt-select{flex:1}.dkdt-grid-dims{display:flex;gap:var(--dkdt-space-md)}.dkdt-grid-dims>.dkdt-control-group{flex:1;min-width:0}.dkdt-grid-templates{display:flex;flex-wrap:wrap;gap:4px}.dkdt-ar-preview-wrap{display:flex;justify-content:center;padding:var(--dkdt-space-md) 0}.dkdt-ar-preview-box{align-items:center;background:linear-gradient(135deg,#e8f0fe,#f0f6ff);border:2px dashed var(--dkdt-primary);border-radius:var(--dkdt-radius-md);display:flex;flex-direction:column;gap:4px;justify-content:center;max-width:100%;transition:width .2s,height .2s}.dkdt-ar-preview-dims{color:var(--dkdt-primary);font-family:var(--dkdt-font-mono);font-size:18px;font-weight:700}.dkdt-ar-preview-ratio{color:var(--dkdt-text-secondary);font-family:var(--dkdt-font-mono);font-size:13px}.dkdt-ar-dims{align-items:center;display:flex;gap:var(--dkdt-space-sm)}.dkdt-ar-dims>.dkdt-text-input{flex:1;min-width:0}.dkdt-ar-lock,.dkdt-ar-swap{align-items:center;display:flex;flex-shrink:0;height:36px;justify-content:center;width:36px}.dkdt-ar-swap{background:var(--dkdt-bg-white);border:1px solid var(--dkdt-border);border-radius:var(--dkdt-radius-sm);cursor:pointer;font-size:18px;transition:border-color .15s,background .15s}.dkdt-ar-swap:hover{background:#e8f0fe;border-color:var(--dkdt-primary)}.dkdt-ar-lock{color:var(--dkdt-primary);font-size:16px}.dkdt-ar-result{background:var(--dkdt-bg-light);border:1px solid var(--dkdt-border);border-radius:var(--dkdt-radius-sm);display:flex;flex-direction:column;gap:6px;margin-top:var(--dkdt-space-sm);padding:var(--dkdt-space-sm)}.dkdt-ar-result-value{align-items:center;display:flex;gap:var(--dkdt-space-sm)}.dkdt-ar-ratio-display{color:var(--dkdt-primary);font-family:var(--dkdt-font-mono);font-size:28px;font-weight:700}.dkdt-ar-css-value{align-items:center;color:var(--dkdt-text-secondary);display:flex;font-size:var(--dkdt-text-sm);gap:var(--dkdt-space-xs)}.dkdt-ar-css-value code{background:var(--dkdt-bg-white);border:1px solid var(--dkdt-border);border-radius:3px;font-family:var(--dkdt-font-mono);padding:2px 6px}.dkdt-ar-presets,.dkdt-ar-table{margin-top:var(--dkdt-space-xs)}.dkdt-ar-table{border-collapse:collapse;font-size:var(--dkdt-text-sm);width:100%}.dkdt-ar-table th{background:var(--dkdt-bg-light);border-bottom:2px solid var(--dkdt-border);color:var(--dkdt-text-secondary);font-size:11px;font-weight:600;letter-spacing:.3px;padding:6px 10px;text-align:left;text-transform:uppercase}.dkdt-ar-table td{border-bottom:1px solid var(--dkdt-border);font-family:var(--dkdt-font-mono);padding:6px 10px}.dkdt-ar-table td:first-child{font-family:inherit;font-weight:500}.dkdt-ar-table-row{cursor:pointer;transition:background .1s}.dkdt-ar-table-row:hover{background:#e8f0fe}@media (max-width:782px){.dkdt-layout{flex-direction:column}.dkdt-sidebar{min-width:unset;width:100%}.dkdt-sidebar-items{display:flex;flex-wrap:wrap;gap:4px}.dkdt-sidebar-item{border-bottom:2px solid transparent;border-left:none;padding:6px 12px}.dkdt-sidebar-item.active{border-bottom-color:var(--dkdt-primary);border-left-color:transparent}.dkdt-header-left{flex-direction:column;gap:4px}}.dkdt-pro-upgrade-card{align-items:center;display:flex;flex-direction:column;justify-content:center;min-height:200px;padding:48px 32px;text-align:center}.dkdt-pro-upgrade-badge{background:linear-gradient(135deg,#667eea,#764ba2);border-radius:12px;color:#fff;display:inline-block;font-size:12px;font-weight:700;letter-spacing:1px;margin-bottom:16px;padding:4px 14px;text-transform:uppercase}.dkdt-pro-upgrade-title{color:#1e1e1e;font-size:20px;font-weight:600;margin:0 0 12px}.dkdt-pro-upgrade-desc{color:#646970;font-size:14px;line-height:1.6;margin:0 0 20px;max-width:480px}.dkdt-pro-inline-note{align-items:center;background:#f6f7f7;border:1px solid #dcdcde;border-left:3px solid #667eea;border-radius:4px;color:#646970;display:flex;flex-wrap:wrap;font-size:13px;gap:6px;margin-top:16px;padding:10px 14px}.dkdt-pro-inline-link{color:#667eea;font-weight:600;text-decoration:none}.dkdt-pro-inline-link:hover{color:#764ba2;text-decoration:underline}