.eyedropper-wrapper{max-width:1200px;margin:0 auto;padding:1rem 0}.eyedropper-wrapper .pick-option-card{background:var(--bi-surface-2);border:2px solid var(--bi-border);border-radius:12px;padding:2rem;text-align:center;transition:all .3s ease;height:100%}.eyedropper-wrapper .pick-option-card:hover{border-color:var(--brand);box-shadow:0 4px 12px rgba(var(--brand-rgb),.15)}.eyedropper-wrapper .pick-option-icon{width:80px;height:80px;margin:0 auto 1.5rem;background:linear-gradient(135deg,var(--brand) 0%,var(--brand-strong) 100%);border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-size:2rem}.eyedropper-wrapper .pick-option-card h5{margin-bottom:.75rem;color:var(--bi-text)}.eyedropper-wrapper .pick-option-card p{margin-bottom:1.5rem}.eyedropper-wrapper .image-pick-container{position:relative;max-width:100%;overflow:auto;border:2px solid var(--bi-border);border-radius:8px;cursor:crosshair;background:var(--bi-surface-2)}.eyedropper-wrapper .image-pick-container canvas{display:block;max-width:100%;height:auto}.eyedropper-wrapper .pick-cursor{position:absolute;width:150px;height:150px;border:3px solid #333;border-radius:50%;box-shadow:0 0 10px #00000080;pointer-events:none;display:none;overflow:hidden;background:var(--bi-surface);z-index:10;transform:translate(-75px,-75px)}.eyedropper-wrapper .pick-cursor.active{display:block}.eyedropper-wrapper .pick-cursor:before{content:"";position:absolute;width:2px;height:100%;background:#0000004d;left:50%;transform:translate(-50%)}.eyedropper-wrapper .pick-cursor:after{content:"";position:absolute;width:100%;height:2px;background:#0000004d;top:50%;transform:translateY(-50%)}.eyedropper-wrapper .pick-cursor canvas{width:100%;height:100%}.eyedropper-wrapper .result-color-preview{width:100%;height:200px;border-radius:12px;box-shadow:0 4px 12px #0000001a;transition:all .3s ease}.eyedropper-wrapper .pick-history-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(60px,1fr));gap:.75rem}.eyedropper-wrapper .history-color-item{width:60px;height:60px}.eyedropper-wrapper .history-color-item{position:relative;aspect-ratio:1;border-radius:8px;cursor:pointer;transition:all .2s ease;overflow:hidden}.eyedropper-wrapper .history-color-item:hover{transform:scale(1.05);box-shadow:0 4px 12px #00000026}.eyedropper-wrapper .history-color-item .color-preview{width:100%;height:100%}.eyedropper-wrapper .history-color-item .color-info{position:absolute;bottom:0;left:0;right:0;background:#000000b3;color:#fff;padding:4px;font-size:.7rem;text-align:center;opacity:0;transition:opacity .2s ease}.eyedropper-wrapper .history-color-item:hover .color-info{opacity:1}.eyedropper-wrapper .empty-hint{text-align:center;padding:2rem;color:var(--bi-text-muted);font-style:italic}@media (max-width: 768px){.eyedropper-wrapper .pick-option-card{padding:1.5rem}.eyedropper-wrapper .pick-option-icon{width:60px;height:60px;font-size:1.5rem}.eyedropper-wrapper .result-color-preview{height:150px;margin-bottom:1rem}}.eyedropper-wrapper .fullscreen-overlay{position:fixed;inset:0;background:#000000f2;z-index:9999;display:flex;flex-direction:column;align-items:center;justify-content:center}.eyedropper-wrapper .fullscreen-header{position:absolute;top:0;left:0;right:0;padding:1rem 2rem;display:flex;justify-content:space-between;align-items:center;background:#00000080;z-index:10}.eyedropper-wrapper .fullscreen-title{color:#fff;font-size:1.2rem;font-weight:600}.eyedropper-wrapper .fullscreen-image-container{width:100%;height:100%;display:flex;align-items:center;justify-content:center;overflow:auto;cursor:crosshair;position:relative}.eyedropper-wrapper .fullscreen-image-container canvas{max-width:100%;max-height:100%;object-fit:contain;box-shadow:0 0 0 1px #ffffff4d}.eyedropper-wrapper .fullscreen-cursor{width:150px;height:150px;border:3px solid #333;border-radius:50%;box-shadow:0 0 10px #00000080;pointer-events:none;display:none;overflow:hidden;background:var(--bi-surface);z-index:10;transform:translate(-75px,-75px)}.eyedropper-wrapper .fullscreen-cursor.active{display:block}.eyedropper-wrapper .fullscreen-cursor:before{content:"";position:absolute;width:2px;height:100%;background:#0000004d;left:50%;transform:translate(-50%)}.eyedropper-wrapper .fullscreen-cursor:after{content:"";position:absolute;width:100%;height:2px;background:#0000004d;top:50%;transform:translateY(-50%)}.eyedropper-wrapper .fullscreen-cursor canvas{width:100%;height:100%}.eyedropper-wrapper .fullscreen-color-info{position:fixed;bottom:2rem;left:50%;transform:translate(-50%);background:#000c;color:#fff;padding:1rem 2rem;border-radius:12px;display:flex;align-items:center;gap:1rem;z-index:10}.eyedropper-wrapper .color-preview-small{width:40px;height:40px;border-radius:8px;border:2px solid white}.eyedropper-wrapper .color-value-text{font-family:Courier New,monospace;font-size:1.1rem;font-weight:600}html[data-theme=dark] .eyedropper-wrapper .pick-cursor,html[data-theme=dark] .eyedropper-wrapper .fullscreen-cursor{border-color:#94a3b8}html[data-theme=dark] .color-preview-small{border-color:#ffffffd9}