.converter-panel__section{display:flex;flex-direction:column;gap:var(--space-4)}.converter-panel__header{display:flex;align-items:center;justify-content:space-between}.converter-panel__label{font-family:var(--font-heading);font-size:var(--text-lg);font-weight:var(--font-semibold);color:var(--text-primary)}.converter-panel__reset{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:var(--radius-sm);font-size:var(--text-xs);font-weight:var(--font-semibold);color:var(--text-muted);background:transparent;border:1px solid var(--border);cursor:pointer;transition:all var(--transition-fast)}.converter-panel__reset:hover{color:var(--color-accent);border-color:var(--color-accent)}.slider-group{display:flex;flex-direction:column;gap:var(--space-4)}.color-slider{display:flex;align-items:center;gap:var(--space-3);width:100%}.color-slider__label{font-family:var(--font-heading);font-size:var(--text-base);font-weight:var(--font-semibold);width:20px;flex-shrink:0;text-align:center;text-transform:uppercase}.color-slider__track-wrapper{flex:1;position:relative;height:28px;display:flex;align-items:center}.color-slider__track{width:100%;height:8px;border-radius:var(--radius-full);background:var(--track-bg);position:relative;overflow:hidden}.color-slider__fill{height:100%;border-radius:var(--radius-full);position:absolute;top:0;left:0;transition:width .05s ease-out}.color-slider__range{position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;cursor:pointer;z-index:2;-webkit-appearance:none;appearance:none}.color-slider__number{width:52px;padding:4px 6px;border:1px solid var(--border);border-radius:var(--radius-sm);font-family:var(--font-body);font-size:var(--text-sm);font-weight:var(--font-semibold);text-align:center;color:var(--text-primary);background:var(--bg-white);transition:border-color var(--transition-fast);-moz-appearance:textfield;appearance:textfield}.color-slider__number::-webkit-inner-spin-button,.color-slider__number::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.color-slider__number:focus{outline:none;border-color:var(--color-accent);box-shadow:0 0 0 3px var(--color-accent-light)}.color-slider__unit{font-size:var(--text-xs);color:var(--text-muted);flex-shrink:0}.color-slider__thumb{position:absolute;top:50%;width:16px;height:16px;border-radius:var(--radius-full);background:#fff;border:2px solid var(--color-accent);transform:translate(-50%,-50%);pointer-events:none;box-shadow:var(--shadow-sm)}.hue-track{background:linear-gradient(to right,red,#ff0 17%,#0f0 33%,#0ff,#00f 67%,#f0f 83%,red)!important}.color-preview{margin-top:var(--space-3);margin-bottom:var(--space-3)}.color-preview__swatch{width:100%;height:48px;border-radius:var(--radius-md);background:var(--track-bg);border:1px solid var(--border);display:flex;align-items:flex-end;justify-content:flex-end;overflow:hidden}.color-preview__info{margin-top:var(--space-2);font-family:var(--font-mono);font-size:var(--text-sm);font-weight:var(--font-semibold);color:var(--text-secondary);text-align:center;display:flex;gap:var(--space-4);justify-content:center}.result-card{display:flex;gap:var(--space-4);padding:var(--space-4);background:var(--bg-white);border-radius:var(--radius-md);border:1px solid var(--border);align-items:center;width:100%}.result-card__info{display:flex;flex-direction:column;align-items:flex-start;gap:4px;flex:1;min-width:0}.result-card__name{font-family:var(--font-heading);font-size:var(--text-lg);font-weight:var(--font-semibold);color:var(--text-primary)}.result-card__copy-btn{flex-shrink:0;align-self:center;display:flex;flex-direction:column;align-items:center;gap:4px;padding:var(--space-3) var(--space-4);background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius-sm);cursor:pointer;font-family:var(--font-body);font-size:var(--text-xs);font-weight:var(--font-semibold);color:var(--text-secondary);transition:border-color var(--transition-fast),color var(--transition-fast)}.result-card__copy-btn:hover{border-color:var(--color-accent);color:var(--color-accent)}.result-card__copy-btn:active{background:var(--border-light)}.result-card__swatch{width:64px;height:64px;background:var(--track-bg);border:1px solid var(--border);border-radius:var(--radius-md);flex-shrink:0;cursor:pointer;transition:transform var(--transition-fast);position:relative}.result-card__swatch:hover{transform:scale(1.05)}.result-card__swatch:active{transform:scale(.95)}.result-detail{display:flex;gap:var(--space-4);margin-block:var(--space-2);font-size:var(--text-sm);color:var(--text-secondary)}.result-detail__item strong{color:var(--text-primary)}.hex-input-section{margin-top:var(--space-4);padding-top:var(--space-4);border-top:1px solid var(--border)}.hex-input__label{display:block;font-size:var(--text-sm);font-weight:var(--font-semibold);color:var(--text-secondary);margin-bottom:var(--space-2)}.hex-input__row{display:flex;align-items:center;gap:0}.hex-input__hash{padding:8px 10px;background:var(--bg-surface);border:1px solid var(--border);border-right:none;border-radius:var(--radius-md) 0 0 var(--radius-md);font-family:var(--font-body);font-size:var(--text-base);font-weight:var(--font-bold);color:var(--text-muted)}.hex-input__field{flex:1;padding:8px 12px;border:1px solid var(--border);border-right:none;font-family:var(--font-mono);font-size:var(--text-base);font-weight:var(--font-semibold);color:var(--text-primary);background:var(--bg-white);text-transform:uppercase;letter-spacing:2px;height:42px}.hex-input__field:focus{outline:none;border-color:var(--color-accent);z-index:10;position:relative;box-shadow:0 0 0 3px var(--color-accent-light)}.hex-input__field::placeholder{color:var(--text-muted);opacity:.5}.hex-input__apply{padding:8px 16px;white-space:nowrap;height:42px;background:var(--color-accent);color:#fff;border:1px solid var(--color-accent);border-radius:0 var(--radius-md) var(--radius-md) 0;font-size:var(--text-sm);font-weight:var(--font-semibold);cursor:pointer;transition:all var(--transition-fast)}.hex-input__apply:hover{background:var(--color-secondary-dark);border-color:var(--color-secondary-dark)}.hex-input-row{display:flex;align-items:center;border:1px solid var(--border);border-radius:var(--radius-md);overflow:hidden;transition:border-color var(--transition-fast)}.hex-input-row:focus-within{border-color:var(--color-accent);box-shadow:0 0 0 3px var(--color-accent-light)}.hex-prefix{padding:14px 0 14px 18px;font-family:var(--font-heading);font-size:var(--text-2xl);font-weight:var(--font-semibold);color:var(--text-muted);user-select:none}.hex-input{flex:1;padding:14px 18px 14px 8px;border:none;outline:none;font-family:var(--font-heading);font-size:var(--text-2xl);font-weight:var(--font-semibold);color:var(--text-primary);background:transparent;text-transform:uppercase;letter-spacing:.08em}.hex-presets{display:flex;flex-wrap:wrap;gap:var(--space-2)}.hex-preset{padding:6px 14px;border-radius:var(--radius-full);font-size:var(--text-xs);font-weight:var(--font-semibold);cursor:pointer;transition:all var(--transition-fast);border:1px solid var(--border)}.hex-preset:hover{background:var(--color-accent);color:var(--text-white);border-color:var(--color-accent)}.copy-btn-enhanced{display:inline-flex;align-items:center;gap:6px;transition:all var(--transition-fast)}.copy-btn-enhanced.copied{border-color:var(--color-success)!important;color:var(--color-success)!important;background:var(--color-success-light)!important}.reverse-link{display:inline-flex;align-items:center;gap:var(--space-2);margin-top:var(--space-4);padding:var(--space-3) var(--space-4);border:1px solid var(--border);border-radius:var(--radius-md);font-size:var(--text-sm);font-weight:var(--font-semibold);color:var(--color-accent);text-decoration:none;transition:all var(--transition-fast)}.reverse-link:hover{background:var(--color-accent-light);border-color:var(--color-accent)}.article-section{margin-top:var(--space-12);padding-top:var(--space-8);border-top:1px solid var(--border)}.article-section h2{font-family:var(--font-heading);font-size:var(--text-3xl);font-weight:var(--font-semibold);color:var(--text-primary);margin-bottom:var(--space-4)}.article-section#faq h2{text-align:left}.article-section p{font-size:var(--text-base);color:var(--text-secondary);line-height:var(--leading-relaxed);margin-bottom:var(--space-3)}.article-section p code{background:var(--bg-surface);padding:2px 6px;border-radius:var(--radius-sm);font-size:var(--text-sm);border:1px solid var(--border)}.article-steps{display:flex;flex-direction:column;gap:var(--space-3);margin-block:var(--space-4)}.article-list{list-style:disc;padding-left:var(--space-6);display:flex;flex-direction:column;gap:var(--space-3);margin-block:var(--space-4)}.article-list li{font-size:var(--text-base);color:var(--text-secondary);line-height:var(--leading-relaxed)}.use-cases{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-4);margin-block:var(--space-5)}.use-case{padding:var(--space-5);border-radius:var(--radius-md);background:var(--bg-surface)}.use-case__title{font-size:var(--text-lg);font-weight:var(--font-semibold);color:var(--text-primary);margin-bottom:var(--space-2)}.use-case__text{font-size:var(--text-sm);color:var(--text-secondary);line-height:var(--leading-relaxed)}.info-table{margin-block:var(--space-4);overflow-x:auto}.info-table table{width:100%;border-collapse:collapse;font-size:var(--text-sm);border:1px solid var(--border);border-radius:var(--radius-md);overflow:hidden}.info-table th{padding:12px 16px;text-align:left;background:var(--bg-dark);color:var(--text-white);font-weight:var(--font-semibold);font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.3px;border-right:1px solid rgba(255,255,255,.1)}.info-table th:last-child{border-right:none}.info-table td{padding:10px 16px;border-bottom:1px solid var(--border);color:var(--text-secondary)}.info-table tr:last-child td{border-bottom:none}.sidebar-card__text{font-size:var(--text-sm);color:var(--text-secondary);line-height:var(--leading-relaxed)}.sidebar-card__text code{background:var(--bg-surface);padding:2px 6px;border-radius:var(--radius-sm);font-size:var(--text-xs);border:1px solid var(--border)}.article-section h3{font-family:var(--font-heading);font-size:var(--text-xl);font-weight:var(--font-semibold);color:var(--text-primary);margin-top:var(--space-6);margin-bottom:var(--space-3)}.article-section a{color:var(--color-accent);font-weight:var(--font-medium)}.article-list li code{background:var(--bg-surface);padding:2px 6px;border-radius:var(--radius-sm);font-size:var(--text-sm);border:1px solid var(--border)}.info-table tr:hover td{background:var(--bg-surface)}.callout{padding:var(--space-5);border-radius:var(--radius-md);background:var(--color-accent-light);border:1px solid var(--border);margin-block:var(--space-4)}.callout p{color:var(--text-primary);font-size:var(--text-base);line-height:var(--leading-relaxed);margin:0}.callout p code{background:var(--bg-white);padding:2px 6px;border-radius:var(--radius-sm);border:1px solid var(--border)}.step{display:flex;align-items:flex-start;gap:var(--space-3)}.step__number{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:var(--radius-full);background:var(--color-accent);color:#fff;font-size:var(--text-sm);font-weight:var(--font-bold);flex-shrink:0}.step__text{font-size:var(--text-base);color:var(--text-secondary);line-height:var(--leading-relaxed)}.slider-wheel-row{display:grid;grid-template-columns:1fr auto;gap:var(--space-4);align-items:start;min-width:0}.slider-wheel-row .slider-group{min-width:0}@media(max-width:640px){.slider-wheel-row{grid-template-columns:1fr}}.variant-strip-section{min-width:0;overflow:hidden}@media(max-width:768px){.use-cases{grid-template-columns:1fr}.hex-input__row{flex-wrap:wrap}.hex-input__apply{border-radius:var(--radius-md);margin-top:var(--space-2);border-left:1px solid var(--color-accent);width:100%}.hex-input__field{border-right:1px solid var(--border);border-radius:0}.color-slider__number{width:44px;padding:3px 4px;font-size:var(--text-xs)}}.risk-alto{font-weight:var(--font-bold);color:var(--color-error)}.risk-medio{font-weight:var(--font-bold);color:var(--color-warning)}.risk-bajo{font-weight:var(--font-bold);color:var(--color-success)}.info-table-source{font-size:var(--text-xs);color:var(--text-muted);margin-top:var(--space-2);font-weight:var(--font-medium)}.section-bridge{padding:var(--space-5) 0;margin-block:var(--space-2)}.section-bridge__text{font-size:var(--text-base);color:var(--text-secondary);line-height:var(--leading-relaxed);margin:0;padding:var(--space-4) var(--space-5);border-radius:var(--radius-md);background:var(--bg-surface)}.section-bridge--learn{margin-top:var(--space-8);padding-top:var(--space-6);border-top:1px solid var(--border)}@media(min-width:769px){.calculator-body>.slider-wheel-row{grid-column:1;grid-row:1}.calculator-body>.color-preview{grid-column:2;grid-row:1;height:100%;margin:0}.calculator-body>.result-card{grid-column:2;grid-row:2}.calculator-body>.variant-strip-section{grid-column:1 / -1}.calculator-body>.color-preview .color-preview__swatch{height:100px}.converter-panel:not(:has(.calculator-body)){display:grid;grid-template-columns:1fr 220px;gap:var(--space-4);align-items:start}.converter-panel:not(:has(.calculator-body))>.hex-visual-row,.converter-panel:not(:has(.calculator-body))>.hex-visual-layout,.converter-panel:not(:has(.calculator-body))>.converter-panel__section{grid-column:1;grid-row:1}.converter-panel:not(:has(.calculator-body))>.color-preview{grid-column:2;grid-row:1;height:100%;margin:0}.converter-panel:not(:has(.calculator-body))>.result-card,.converter-panel:not(:has(.calculator-body))>.match-results,.converter-panel:not(:has(.calculator-body))>.result-rich{grid-column:2;grid-row:1}.converter-panel:not(:has(.calculator-body))>.variant-strip-section,.converter-panel:not(:has(.calculator-body))>.variant-section,.converter-panel:not(:has(.calculator-body))>div[style*="display:none"]{grid-column:1 / -1}.converter-panel:not(:has(.calculator-body))>.color-preview .color-preview__swatch{height:100px}}.tool-hero[data-astro-cid-mqzpnqfb]{background-color:var(--bg-white);border-bottom:1px solid var(--border)}.tool-hero__inner[data-astro-cid-mqzpnqfb]{max-width:var(--max-width);margin-inline:auto;padding:var(--space-8) var(--content-padding);display:flex;flex-direction:column;gap:var(--space-2)}.tool-hero__title[data-astro-cid-mqzpnqfb]{font-family:var(--font-heading);font-size:var(--text-4xl);font-weight:var(--font-bold);letter-spacing:var(--tracking-tight);color:var(--text-primary);line-height:var(--leading-snug)}.tool-hero__desc[data-astro-cid-mqzpnqfb]{font-size:var(--text-lg);color:var(--text-secondary)}.tool-hero__updated[data-astro-cid-mqzpnqfb]{font-size:var(--text-xs);font-weight:var(--font-medium);color:var(--text-muted);letter-spacing:.5px}.tool-layout__main[data-astro-cid-mqzpnqfb]{display:flex;flex-direction:column;gap:var(--space-6);min-width:0}.tool-layout__sidebar[data-astro-cid-mqzpnqfb]{display:flex;flex-direction:column}.tool-layout__sidebar-inner[data-astro-cid-mqzpnqfb]{position:sticky;top:var(--space-8);display:flex;flex-direction:column;gap:var(--space-6);max-height:calc(100vh - var(--space-16, 128px));overflow-y:auto}.tool-content-zone[data-astro-cid-mqzpnqfb]{max-width:var(--max-width);margin-inline:auto;padding-inline:var(--content-padding);border-top:1px solid var(--border)}.tool-content-zone[data-astro-cid-mqzpnqfb]:empty{display:none}@media(max-width:1024px){.tool-layout__sidebar-inner[data-astro-cid-mqzpnqfb]{position:static;max-height:none}}@media(max-width:768px){.tool-hero__title[data-astro-cid-mqzpnqfb]{font-size:var(--text-3xl)}}.share-tool[data-astro-cid-663ciivo]{display:flex;align-items:center;gap:var(--space-4);padding:var(--space-5) var(--space-6);background:var(--bg-light);border-radius:var(--radius-md);border:1px solid var(--border);margin-top:var(--space-2)}.share-tool__label[data-astro-cid-663ciivo]{font-size:var(--text-sm);font-weight:var(--font-semibold);color:var(--text-secondary);white-space:nowrap}.share-tool__buttons[data-astro-cid-663ciivo]{display:flex;gap:var(--space-2);flex-wrap:wrap;align-items:center}.share-btn[data-astro-cid-663ciivo]{display:inline-flex;align-items:center;gap:var(--space-2);padding:8px 14px;border-radius:var(--radius-md);font-size:var(--text-xs);font-weight:var(--font-semibold);cursor:pointer;transition:all var(--transition-fast);text-decoration:none;border:1px solid var(--border);background:var(--bg-white);color:var(--text-secondary)}.share-btn[data-astro-cid-663ciivo]:hover{transform:translateY(-1px);border:1px solid var(--border)}.share-btn--copy[data-astro-cid-663ciivo]:hover{border-color:var(--color-primary);color:var(--color-primary)}.share-btn--twitter[data-astro-cid-663ciivo]:hover{border-color:var(--color-twitter);color:var(--color-twitter)}.share-btn--facebook[data-astro-cid-663ciivo]:hover{border-color:var(--color-facebook);color:var(--color-facebook)}.share-btn--linkedin[data-astro-cid-663ciivo]:hover{border-color:var(--color-linkedin);color:var(--color-linkedin)}.share-btn--whatsapp[data-astro-cid-663ciivo]:hover{border-color:var(--color-whatsapp);color:var(--color-whatsapp)}@media(max-width:768px){.share-tool[data-astro-cid-663ciivo]{max-width:100%;flex-direction:column;align-items:flex-start;gap:var(--space-3)}}