.bg-color-picker-popup{position:fixed;background:#1a1a1a;border:3px solid gold;border-radius:8px;padding:20px;box-shadow:0 0 30px rgba(255,215,0,.7);z-index:10000;display:none;width:90%;max-width:500px}.bg-color-picker-popup.show{display:block}.bg-color-picker-area{width:100%;height:200px;background:linear-gradient(to right,#fff,transparent),linear-gradient(to bottom,transparent,#000);border:2px solid gold;border-radius:4px;position:relative;cursor:crosshair;margin-bottom:15px;touch-action:none}.bg-color-picker-cursor{position:absolute;width:12px;height:12px;border:2px solid #fff;border-radius:50%;transform:translate(-50%,-50%);pointer-events:none;box-shadow:0 0 0 1px #000}.bg-hue-slider{width:100%;height:30px;background:linear-gradient(to right,red,#ff0,#0f0,#0ff,#00f,#f0f,red);border:2px solid gold;border-radius:4px;position:relative;cursor:pointer;margin-bottom:15px;touch-action:none}.bg-hue-slider-thumb{position:absolute;top:50%;transform:translateY(-50%);width:20px;height:34px;background:#fff;border:2px solid #000;border-radius:2px;pointer-events:none;box-shadow:0 0 0 1px rgba(255,255,255,.5)}.bg-color-info{display:flex;gap:10px;margin-bottom:15px}.bg-color-display,.bg-hex-input{flex:1;border:2px solid gold;border-radius:4px;min-width:0}.bg-color-display{height:40px}.bg-hex-input{padding:8px;background:#2a2a2a;color:#fff;font-size:14px;font-family:monospace}.bg-hex-input:focus{outline:0;border-color:gold;box-shadow:0 0 10px rgba(255,215,0,.5)}.bg-preset-colors{display:grid;grid-template-columns:repeat(8,1fr);gap:5px;margin-bottom:15px}.bg-preset-color{width:100%;height:30px;border:2px solid gold;border-radius:4px;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease}.bg-preset-color:hover{transform:scale(1.1);box-shadow:0 0 8px rgba(255,215,0,.6)}.bg-picker-buttons{display:flex;gap:10px;justify-content:flex-end}.bg-picker-btn{padding:8px 20px;border:2px solid gold;border-radius:4px;background:#1a1a1a;color:gold;cursor:pointer;font-size:.9rem;transition:background .2s ease}.bg-picker-btn:hover{background:rgba(255,215,0,.2)}.bg-picker-btn:active{transform:scale(.95)}@media (max-width:768px){.bg-color-picker-popup{width:90%;max-width:500px;padding:15px}.bg-color-picker-area{height:150px}.bg-preset-colors{grid-template-columns:repeat(6,1fr)}}