p{margin:0;padding:0}.layout{display:flex;flex-direction:column;gap:1rem}canvas{width:100%;border:0;cursor:crosshair;user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;-webkit-touch-callout:none}aside h1{font-size:1.4rem;margin-top:0;margin-bottom:0;color:#0f172a}aside h2{font-size:1.25rem;margin-top:1.5rem;color:#1e293b}p{margin-top:1rem;margin-bottom:0;font-size:1rem;line-height:1.6;color:#334155}label{font-weight:600;display:block;margin-top:1rem;color:#334155}input[type=file]{display:block;margin-top:.5rem;width:100%;font-size:.875rem;padding:.5rem;border:1px solid #cbd5e1;border-radius:.375rem;background-color:#f1f5f9}button{padding:.25rem .75rem;font-size:.875rem;border:1px solid #94a3b8;border-radius:.375rem;background:#edf0f5;color:#1e293b;cursor:pointer}button:hover{background-color:#dce1e7}#color-box{width:6rem;height:6rem;border-radius:.375rem;border:1px solid #000000;margin-top:1rem}#magnifier{position:absolute;border:1px solid #94a3b8;display:none;pointer-events:none;box-shadow:0 6px 12px #0000001a;width:120px;height:120px;overflow:hidden;z-index:10}.disclaimer{margin-top:1rem;font-size:.875rem;font-size:.8rem;color:#4d5d72;line-height:1.5;background:#f1f5f9;border-left:4px solid #94a3b8;padding:.75rem 1rem;border-radius:.375rem}button.copy{min-width:100px}.picked-colors{margin-top:.8rem;display:flex;flex-direction:column;gap:.5rem}.picked-color{display:flex;justify-content:space-between;border:1px solid #dfdfdf;border:1px solid #cbd5e1;padding:8px;align-items:center;border-radius:.375rem}#color-palette{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.5rem}.footer-links{list-style-type:none;margin:0;padding:0;font-size:.9rem;margin-top:1.8rem;display:flex;gap:.5rem}.footer-links li{margin:0;padding:0;display:inline-block}#loading{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:60px;height:60px}@media (min-width: 768px){aside h1{margin-top:1.5rem;font-size:2rem}.layout{flex-direction:row;gap:2rem}.image{flex-grow:1;flex-shrink:1;flex-basis:auto}.sidebar{min-width:400px;flex-grow:0;flex-shrink:0;flex-basis:0}}