body{font-family:Arial,sans-serif;background-color:#f2f2f2;margin:0;padding:0;display:flex;justify-content:center;align-items:center;height:100vh}.color-picker-container{display:flex;flex-direction:row;justify-content:space-between;padding:20px;background-color:#fff;border-radius:15px;box-shadow:0 0 15px #0000001a;width:80vw;max-width:1200px;max-height:90vh;overflow-y:auto}.color-picker-main{flex:1;display:flex;flex-direction:column;align-items:center}h1{margin:20px 0;font-size:2.5rem;color:#264d73;text-align:center}.color-display{width:300px;height:300px;display:flex;justify-content:center;align-items:center;border:5px solid hsl(0,0%,80%);border-radius:25px;margin-bottom:25px;transition:.25s ease}.color-display p{color:#333;font-size:2rem;text-align:center;font-weight:700}label{font-size:1.5rem;font-weight:700;margin-bottom:10px}input[type=color]{width:75px;height:50px;padding:5px;border-radius:10px;border:3px solid hsl(0,0%,80%);cursor:pointer}button{background-color:#4080bf;color:#fff;font-size:1rem;padding:10px 20px;border:none;border-radius:10px;cursor:pointer;margin-top:20px;transition:background-color .3s ease;margin-bottom:20px}button:hover{background-color:#369}h2{margin-top:40px;font-size:2rem;color:#264d73}ul{list-style-type:none;padding:0;display:flex;flex-wrap:wrap;justify-content:center;margin-top:20px}ul li{width:100px;height:100px;margin:10px;display:flex;justify-content:center;align-items:center;border-radius:15px;position:relative;text-align:center;color:#fff}ul li p{font-size:.8rem;margin:0}ul li button{position:absolute;top:5px;right:5px;background-color:#ffffff80;border:none;color:#fff;font-size:.8rem;padding:3px 7px;border-radius:5px;cursor:pointer;transition:background-color .3s ease}ul li button:hover{background-color:#fffc}.color-schemes{margin-top:20px;width:100%}.color-title{text-align:center;font-size:1.5rem;margin:20px 0;color:#264d73}.color-swatch{padding:10px;margin:5px;border-radius:10px;color:#fff;text-align:center;cursor:pointer;transition:transform .3s ease}.color-swatch:hover{transform:scale(1.1)}.color-row{display:flex;justify-content:center;margin-bottom:20px}.export-section{text-align:center;margin-top:20px}.export-instructions{margin-bottom:10px;font-size:1rem;color:#666}.export-buttons{display:flex;justify-content:center;margin-top:20px;padding-bottom:20px}.export-buttons button{margin:0 10px;padding:10px 15px;background-color:#007bff;color:#fff;border:none;border-radius:5px;cursor:pointer;transition:background-color .3s ease}.export-buttons button:hover{background-color:#0056b3}.color-history-container h2{margin-bottom:20px;font-size:1.5rem}.color-history-container{width:25%;margin-top:20px}.color-history-list{display:flex;flex-wrap:wrap;gap:5px}.color-history-box{width:30px;height:30px;border-radius:3px;display:flex;align-items:center;justify-content:center;color:#fff;font-size:8px;text-align:center;box-shadow:0 0 3px #0003;margin-bottom:5px}.color-history-list{display:flex;flex-wrap:wrap;gap:10px}.color-history-box{width:60px;height:60px;border-radius:4px;border:1px solid #ddd;display:flex;align-items:center;justify-content:center;color:#fff;font-size:12px;text-align:center;margin:5px}.favorite-color-item{display:flex;justify-content:space-between;align-items:center;padding:10px;margin:5px;color:#fff;border-radius:4px;border:1px solid #ddd}.favorites-list{display:flex;flex-direction:column}.color-conversion-section{margin-top:20px;padding:10px;border:1px solid #ddd;border-radius:5px}.color-conversion-section h2{margin-bottom:10px;text-align:center}.color-conversion-section button{margin:5px}.color-conversion-section p{margin-top:10px;text-align:center;font-weight:700}
