.rgb-pantone-converter{max-width:1200px;margin:0 auto;padding:2rem;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif;color:#333;background-color:#f8f9fa;border-radius:12px;box-shadow:0 10px 30px rgba(0,0,0,.05)}.converter-header{text-align:center;margin-bottom:2rem}.converter-header h1{font-size:2.5rem;font-weight:700;margin-bottom:.5rem;background:linear-gradient(90deg,#ff6b6b,#4ecdc4,#45b7d8);-webkit-background-clip:text;background-clip:text;color:rgba(0,0,0,0)}.converter-header p{font-size:1.1rem;color:#666;max-width:600px;margin:0 auto}.converter-container{display:flex;flex-direction:row;gap:2rem;margin-bottom:2rem}@media(max-width:768px){.converter-container{flex-direction:column}}.input-panel{flex:1;background-color:#fff;padding:1.5rem;border-radius:10px;box-shadow:0 4px 12px rgba(0,0,0,.05)}.color-display{height:200px;border-radius:8px;margin-bottom:1.5rem;display:flex;align-items:flex-end;justify-content:center;transition:background-color .3s ease;position:relative;overflow:hidden;box-shadow:inset 0 0 0 1px rgba(0,0,0,.1)}.color-info{background-color:rgba(0,0,0,.7);color:#fff;width:100%;padding:.75rem;font-size:.9rem;display:flex;justify-content:space-between}.input-tabs{display:flex;margin-bottom:1rem;border-bottom:1px solid #e0e0e0}.input-tabs button{background:none;border:none;padding:.75rem 1.5rem;font-size:1rem;cursor:pointer;font-weight:500;color:#666;transition:all .2s ease}.input-tabs button:hover{color:#333}.input-tabs button.active{color:#4a90e2;border-bottom:3px solid #4a90e2}.input-fields{margin-bottom:1.5rem}.rgb-inputs{display:flex;flex-direction:column;gap:1rem}.input-group{display:flex;align-items:center;gap:.75rem}.input-group label{font-weight:600;width:20px;text-align:center}.input-group input[type=number]{width:60px;padding:.5rem;border:1px solid #ddd;border-radius:4px;font-size:1rem;text-align:center}.input-group .color-slider{flex:1}.input-group .slider{width:100%;height:8px;border-radius:4px;appearance:none;outline:none;opacity:.7;transition:opacity .2s}.input-group .slider:hover{opacity:1}.input-group .slider::-webkit-slider-thumb{appearance:none;width:18px;height:18px;border-radius:50%;cursor:pointer}.input-group .slider::-moz-range-thumb{width:18px;height:18px;border-radius:50%;cursor:pointer}.input-group .slider.red-slider{background:linear-gradient(90deg,#000,#f00)}.input-group .slider.red-slider::-webkit-slider-thumb{background:red}.input-group .slider.red-slider::-moz-range-thumb{background:red}.input-group .slider.green-slider{background:linear-gradient(90deg,#000,#0f0)}.input-group .slider.green-slider::-webkit-slider-thumb{background:lime}.input-group .slider.green-slider::-moz-range-thumb{background:lime}.input-group .slider.blue-slider{background:linear-gradient(90deg,#000,#00f)}.input-group .slider.blue-slider::-webkit-slider-thumb{background:blue}.input-group .slider.blue-slider::-moz-range-thumb{background:blue}.hex-input input{width:100%;padding:.75rem;font-size:1rem;border:1px solid #ddd;border-radius:4px;text-transform:uppercase;letter-spacing:1px;font-family:monospace}.hex-input input:focus{border-color:#4a90e2;outline:none;box-shadow:0 0 0 3px rgba(74,144,226,.1)}.convert-button{width:100%;padding:.875rem;background-color:#4a90e2;color:#fff;border:none;border-radius:6px;font-size:1rem;font-weight:600;cursor:pointer;transition:background-color .2s}.convert-button:hover{background-color:#3a7bc8}.convert-button:active{transform:translateY(1px)}.recent-colors{margin-top:1.5rem}.recent-colors h3{font-size:1rem;margin-bottom:.75rem;color:#555}.recent-colors .color-history{display:flex;gap:.5rem}.recent-colors .color-history .history-color{width:40px;height:40px;border-radius:6px;cursor:pointer;transition:transform .2s,box-shadow .2s;box-shadow:inset 0 0 0 1px rgba(0,0,0,.1)}.recent-colors .color-history .history-color:hover{transform:scale(1.05);box-shadow:0 3px 8px rgba(0,0,0,.1),inset 0 0 0 1px rgba(0,0,0,.1)}.results-panel{flex:1;background-color:#fff;padding:1.5rem;border-radius:10px;box-shadow:0 4px 12px rgba(0,0,0,.05)}.results-panel h2{font-size:1.5rem;margin-bottom:1.25rem;color:#333;border-bottom:1px solid #eee;padding-bottom:.75rem}.matches-container{display:flex;flex-direction:column;gap:1rem;margin-bottom:1.5rem;max-height:400px;overflow-y:auto;padding-right:.5rem}.matches-container::-webkit-scrollbar{width:6px}.matches-container::-webkit-scrollbar-track{background:#f1f1f1;border-radius:10px}.matches-container::-webkit-scrollbar-thumb{background:#c1c1c1;border-radius:10px}.matches-container::-webkit-scrollbar-thumb:hover{background:#a8a8a8}.pantone-match{display:flex;gap:1rem;padding:1rem;border-radius:8px;background-color:#f9f9f9;transition:transform .2s}.pantone-match:hover{transform:translateY(-2px);box-shadow:0 4px 8px rgba(0,0,0,.05)}.pantone-match .pantone-color{width:80px;height:80px;border-radius:6px;box-shadow:inset 0 0 0 1px rgba(0,0,0,.1)}.pantone-match .pantone-info{flex:1}.pantone-match .pantone-info h3{font-size:1.1rem;margin-bottom:.5rem;font-weight:600}.pantone-match .pantone-info p{margin:.25rem 0;font-size:.9rem;color:#555;font-family:monospace}.pantone-match .pantone-info .copy-button{margin-top:.75rem;padding:.5rem .75rem;background-color:#f0f0f0;border:none;border-radius:4px;font-size:.85rem;cursor:pointer;transition:background-color .2s}.pantone-match .pantone-info .copy-button:hover{background-color:#e0e0e0}.browse-all-section{margin-top:1rem}.browse-all-section .toggle-all-button{padding:.75rem 1rem;background-color:#f0f0f0;border:none;border-radius:6px;font-size:.95rem;cursor:pointer;transition:background-color .2s;width:100%}.browse-all-section .toggle-all-button:hover{background-color:#e0e0e0}.browse-all-section .all-colors-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(40px,1fr));gap:.75rem;margin-top:1.25rem;padding:1rem;background-color:#f8f8f8;border-radius:8px}.browse-all-section .all-colors-grid .color-swatch{aspect-ratio:1/1;border-radius:4px;cursor:pointer;transition:transform .2s;box-shadow:inset 0 0 0 1px rgba(0,0,0,.1)}.browse-all-section .all-colors-grid .color-swatch:hover{transform:scale(1.1);z-index:1;box-shadow:0 3px 8px rgba(0,0,0,.15),inset 0 0 0 1px rgba(0,0,0,.1)}.converter-footer{text-align:center;margin-top:2rem;padding-top:1rem;border-top:1px solid #eee}.converter-footer p{font-size:.9rem;color:#777}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.pantone-match{animation:fadeIn .3s ease-in}@media(max-width:1024px){.rgb-pantone-converter{padding:1.5rem}.converter-header h1{font-size:2rem}}@media(max-width:768px){.input-panel,.results-panel{width:100%}.pantone-match{flex-direction:column}.pantone-match .pantone-color{width:100%;height:60px}}@media(max-width:480px){.converter-header h1{font-size:1.75rem}.color-info{flex-direction:column;gap:.25rem}.input-tabs button{padding:.5rem 1rem}}