.card{padding:20px 18px 30px 18px}.btn-row{display:flex;flex-wrap:wrap;gap:14px;margin-left:auto;margin-right:auto;margin-bottom:16px;max-width:540px}.btn-row button{flex:1 1 120px;font-size:1em;padding:11px 24px;border-radius:8px;border:0;background:linear-gradient(90deg,#4e8cff 70%,#1396e2 100%);color:white;font-weight:500;cursor:pointer;box-shadow:0 2px 8px #0002;transition:background .2s;outline:0}.btn-row button:active{background:linear-gradient(90deg,#3a6fd8 70%,#0b77b1 100%)}.btn-row input[type="file"]{display:none}#color-show{clear:both;display:block;width:48px;height:48px;border:2.5px solid #eee;border-radius:12px;box-shadow:0 2px 8px #0001;transition:background .2s;position:relative;user-select:all;margin-left:2px}#color-result{margin-top:18px;margin-bottom:4px;font-size:1em;background:#f9fafd;border-radius:10px;padding:14px 18px 12px 18px;box-shadow:0 2px 8px #0001;border:1.5px solid #eaeaea;display:none;overflow:hidden}#color-codes div{font-size:14px;float:left;height:30px;line-height:30px;display:block}#color-codes strong{display:inline-block;width:60px;margin-right:10px;text-align:right;font-weight:500;color:#5b86b7}#img-container{position:relative;width:100%;margin-top:18px;display:flex;justify-content:center;align-items:flex-start;min-height:120px}#preview-img{max-width:100%;width:100%;height:auto;border:1.5px solid #c2d7ee;background:#fafdff;display:none;box-shadow:0 2px 8px #0002;touch-action:none;transition:box-shadow .18s}#preview-img:active,#preview-img:focus{box-shadow:0 0 0 2px #4e8cff55,0 2px 8px #0002}#magnifier{position:absolute;pointer-events:none;border:2.5px solid #488be4;border-radius:50%;overflow:hidden;display:none;box-shadow:0 3px 16px #488be455;z-index:100;background:#fff;transition:box-shadow .2s}@media(max-width:600px){.card{padding:16px 6px 20px 6px}.btn-row button{min-width:100px;padding:10px 0}#color-result{font-size:.93em;padding:10px 6px 9px 12px}}.copy_btn{margin-left:6px;width:15px;height:15px}