:root{--ice-primary:var(--main-primary);--ice-text:#1f2937;--ice-text-muted:#6b7280;--ice-bg:#fff;--ice-bg-hover:#f9fafb;--ice-border:#e5e7eb;--ice-border-hover:#d1d5db;--ice-shadow:0 1px 3px #0000001a;--ice-shadow-lg:0 4px 12px #00000026;--ice-radius:.5rem;--ice-radius-lg:.75rem}._ice-container{gap:var(--main-space-5);flex-direction:column;width:100%;max-width:800px;margin:0 auto;display:flex}._ice-main{gap:var(--main-space-5);flex-direction:column;display:flex}@media (max-width:768px){._ice-container{padding-left:1rem;padding-right:1rem}}._ice-upload-section{width:100%}._ice-upload-zone{border-style:dashed;border-width:2px;border-color:var(--ice-border);border-radius:var(--ice-radius-lg);background:var(--ice-bg);cursor:pointer;justify-content:center;align-items:center;min-height:200px;transition:border-color .15s,background-color .15s;display:flex}._ice-upload-zone:hover,._ice-upload-zone._ice-dragover{border-color:var(--ice-primary);background:#6366f10d}._ice-upload-content{align-items:center;gap:var(--main-space-3);color:var(--ice-text-muted);padding:var(--main-space-6);flex-direction:column;display:flex}._ice-upload-content svg{color:var(--ice-border-hover)}._ice-upload-text{font-size:var(--main-text-base);color:var(--ice-text);margin:0;font-weight:500}._ice-upload-hint{font-size:var(--main-text-sm);margin:0}._ice-preview-section{gap:var(--main-space-3);flex-direction:column;display:flex}._ice-preview-header{justify-content:space-between;align-items:center;width:100%;max-width:500px;margin:0 auto;display:flex}._ice-preview-hint{font-size:var(--main-text-sm);color:var(--ice-text-muted)}._ice-expand-btn{background:var(--ice-bg);width:32px;height:32px;color:var(--ice-text-muted);border-style:solid;border-width:1px;border-color:var(--ice-border);border-radius:var(--ice-radius);cursor:pointer;justify-content:center;align-items:center;transition:color .15s,border-color .15s;display:flex}._ice-expand-btn:hover{color:var(--ice-primary);border-color:var(--ice-primary)}._ice-preview-wrapper{border-radius:var(--ice-radius-lg);border-style:solid;border-width:1px;border-color:var(--ice-border);box-shadow:var(--ice-shadow);background:var(--ice-bg);cursor:none;margin:0 auto;position:relative;overflow:hidden}._ice-preview-wrapper img{object-fit:contain;-webkit-user-select:none;user-select:none;-webkit-user-drag:none;width:100%;height:auto;max-height:450px;display:block}._ice-preview-section._ice-expanded{z-index:1000;padding:var(--main-space-4);gap:var(--main-space-4);background:#000000e6;justify-content:center;position:fixed;top:0;bottom:0;left:0;right:0}._ice-preview-section._ice-expanded ._ice-preview-header{max-width:100%}._ice-preview-section._ice-expanded ._ice-preview-hint{color:#ffffffb3}._ice-preview-section._ice-expanded ._ice-expand-btn{color:#fffc;background:#ffffff1a;border-color:#fff3}._ice-preview-section._ice-expanded ._ice-expand-btn:hover{color:#fff;background:#fff3;border-color:#fff6}._ice-preview-section._ice-expanded ._ice-preview-wrapper{background:0 0;border-color:#fff3;max-width:100%;max-height:calc(100vh - 150px)}._ice-preview-section._ice-expanded ._ice-preview-wrapper img{object-fit:contain;max-height:calc(100vh - 200px)}._ice-preview-section._ice-expanded ._ice-picked-section{background:#ffffff1a;border-color:#fff3;max-width:100%}._ice-preview-section._ice-expanded ._ice-picked-title{color:#ffffffe6}._ice-preview-section._ice-expanded ._ice-picked-title svg,._ice-preview-section._ice-expanded ._ice-clear-picked{color:#fff9}._ice-preview-section._ice-expanded ._ice-clear-picked:hover{color:var(--main-error)}._ice-color-indicator{pointer-events:none;opacity:0;z-index:10;width:60px;height:60px;transition:opacity .1s;position:absolute}._ice-preview-wrapper:hover ._ice-color-indicator{opacity:1}._ice-indicator-ring{border:2px solid #fffc;border-radius:50%;position:absolute;top:0;bottom:0;left:0;right:0;box-shadow:0 0 0 1px #0000004d,inset 0 0 0 1px #0003}._ice-indicator-center{border:2px solid #fff;border-radius:50%;width:24px;height:24px;margin:-12px 0 0 -12px;position:absolute;top:50%;left:50%;box-shadow:0 2px 8px #0006,inset 0 0 0 1px #0000001a}._ice-indicator-crosshair{background:#ffffffe6;position:absolute;box-shadow:0 0 2px #00000080}._ice-crosshair-h{height:1px;margin-top:-.5px;top:50%;left:0;right:0}._ice-crosshair-v{width:1px;margin-left:-.5px;top:0;bottom:0;left:50%}._ice-color-tooltip{color:#fff;font-size:11px;font-family:var(--main-font-mono);white-space:nowrap;pointer-events:none;opacity:0;z-index:15;background:#000000d9;border-radius:4px;padding:4px 8px;transition:opacity .1s;position:absolute}._ice-preview-wrapper:hover ._ice-color-tooltip{opacity:1}._ice-remove-btn{top:var(--main-space-2);right:var(--main-space-2);color:#fff;cursor:pointer;z-index:20;background:#0009;border:none;border-radius:50%;justify-content:center;align-items:center;width:32px;height:32px;transition:background-color .15s;display:flex;position:absolute}._ice-remove-btn:hover{background:#000c}._ice-picked-section{background:var(--ice-bg);border-radius:var(--ice-radius);border-style:solid;border-width:1px;border-color:var(--ice-border);width:100%;max-width:500px;box-shadow:var(--ice-shadow);padding:var(--main-space-3);margin:0 auto}._ice-picked-header{margin-bottom:var(--main-space-3);justify-content:space-between;align-items:center;display:flex}._ice-picked-title{align-items:center;gap:var(--main-space-2);font-size:var(--main-text-sm);color:var(--ice-text);font-weight:500;display:flex}._ice-picked-title svg{color:var(--ice-text-muted)}._ice-clear-picked{padding:var(--main-space-1);color:var(--ice-text-muted);border-radius:var(--main-radius);cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;transition:color .15s;display:flex}._ice-clear-picked:hover{color:var(--main-error)}._ice-picked-grid{gap:var(--main-space-2);flex-wrap:wrap;display:flex}._ice-picked-color{border-radius:var(--ice-radius);cursor:pointer;width:36px;height:36px;box-shadow:var(--ice-shadow);transition:box-shadow .15s;position:relative}._ice-picked-color:hover{box-shadow:var(--ice-shadow-lg)}._ice-picked-color:after{content:attr(data-hex);background:var(--ice-text);color:#fff;font-size:10px;font-family:var(--main-font-mono);white-space:nowrap;opacity:0;pointer-events:none;border-radius:4px;padding:2px 6px;transition:opacity .15s;position:absolute;bottom:calc(100% + 4px);left:50%;transform:translate(-50%)}._ice-picked-color:hover:after{opacity:1}._ice-picked-empty{text-align:center;width:100%;font-size:var(--main-text-sm);color:var(--ice-text-muted);padding:var(--main-space-2) 0}._ice-preview-section._ice-expanded ._ice-picked-empty{color:#ffffff80}@media (max-width:768px){._ice-preview-wrapper img{max-height:300px}._ice-preview-section._ice-expanded ._ice-preview-wrapper img{max-height:calc(100vh - 250px)}}._ice-palette-section{gap:var(--main-space-4);flex-direction:column;display:flex}._ice-controls{align-items:flex-end;gap:var(--main-space-4);padding:var(--main-space-4);background:var(--ice-bg);border-radius:var(--ice-radius-lg);border-style:solid;border-width:1px;border-color:var(--ice-border);box-shadow:var(--ice-shadow);flex-wrap:wrap;display:flex}._ice-control-group{gap:var(--main-space-2);flex-direction:column;display:flex}._ice-label{font-size:var(--main-text-sm);color:var(--ice-text);font-weight:500}._ice-range{background:var(--ice-border);-webkit-appearance:none;appearance:none;cursor:pointer;border-radius:3px;width:120px;height:6px}._ice-range::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;background:var(--ice-primary);cursor:pointer;border-radius:50%;width:18px;height:18px;box-shadow:0 1px 3px #0003}._ice-range::-moz-range-thumb{background:var(--ice-primary);cursor:pointer;border:none;border-radius:50%;width:18px;height:18px;box-shadow:0 1px 3px #0003}._ice-select{padding:var(--main-space-2) var(--main-space-3);padding-right:var(--main-space-8);border-style:solid;border-width:1.5px;border-color:var(--ice-border);border-radius:var(--ice-radius);font-size:var(--main-text-sm);color:var(--ice-text);background:var(--ice-bg);cursor:pointer;-webkit-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%236b7280' d='M2.5 4.5l3.5 3.5 3.5-3.5'/%3E%3C/svg%3E");background-position:right .75rem center;background-repeat:no-repeat}._ice-select:focus{border-color:var(--ice-primary);outline:none;box-shadow:0 0 0 3px #6366f11a}._ice-btn{justify-content:center;align-items:center;gap:var(--main-space-2);padding:var(--main-space-2) var(--main-space-4);border-radius:var(--ice-radius);font-size:var(--main-text-sm);cursor:pointer;white-space:nowrap;border:none;font-weight:500;transition:opacity .15s,background-color .15s;display:inline-flex}._ice-btn-primary{background:var(--ice-primary);color:#fff}._ice-btn-primary:hover{opacity:.9}._ice-btn-secondary{background:var(--ice-bg);color:var(--ice-text);border-style:solid;border-width:1.5px;border-color:var(--ice-border)}._ice-btn-secondary:hover{background:var(--ice-bg-hover);border-color:var(--ice-border-hover)}._ice-actions{justify-content:center;gap:var(--main-space-3);display:flex}._ice-export-wrapper{position:relative}._ice-export-dropdown{top:calc(100% + var(--main-space-2));background:var(--ice-bg);border-style:solid;border-width:1px;border-color:var(--ice-border);border-radius:var(--ice-radius);min-width:160px;box-shadow:var(--ice-shadow-lg);z-index:100;display:none;position:absolute;right:0}._ice-export-dropdown._ice-show{display:block}._ice-export-option{align-items:center;gap:var(--main-space-2);width:100%;padding:var(--main-space-2) var(--main-space-3);text-align:left;font-size:var(--main-text-sm);color:var(--ice-text);cursor:pointer;background:0 0;border:none;transition:background-color .15s;display:flex}._ice-export-option:hover{background:var(--ice-bg-hover)}._ice-export-option:first-child{border-radius:var(--ice-radius) var(--ice-radius) 0 0}._ice-export-option:last-child{border-radius:0 0 var(--ice-radius) var(--ice-radius)}@media (max-width:768px){._ice-controls{flex-direction:column;align-items:stretch}._ice-control-group,._ice-range,._ice-select,._ice-btn-secondary{width:100%}}._ice-palette{gap:var(--main-space-3);grid-template-columns:repeat(auto-fill,minmax(140px,1fr));min-height:200px;display:grid}._ice-color-card{background:var(--ice-bg);border-radius:var(--ice-radius-lg);border-style:solid;border-width:1px;border-color:var(--ice-border);box-shadow:var(--ice-shadow);transition:box-shadow .15s;overflow:hidden}._ice-color-card:hover{box-shadow:var(--ice-shadow-lg)}._ice-color-preview{cursor:pointer;height:80px;position:relative}._ice-color-preview:after{content:"";background:#fff0;transition:background .15s;position:absolute;top:0;bottom:0;left:0;right:0}._ice-color-preview:hover:after{background:#ffffff1a}._ice-prominence-bar{background:var(--ice-border);height:4px}._ice-prominence-fill{background:var(--ice-primary);height:100%;transition:width .3s}._ice-color-info{padding:var(--main-space-3)}._ice-color-name{font-size:var(--main-text-xs);color:var(--ice-text);margin:0 0 var(--main-space-2) 0;white-space:nowrap;text-overflow:ellipsis;font-weight:500;overflow:hidden}._ice-color-values{gap:var(--main-space-1);flex-direction:column;display:flex}._ice-color-value{justify-content:space-between;align-items:center;gap:var(--main-space-2);display:flex}._ice-value-text{font-size:11px;font-family:var(--main-font-mono);color:var(--ice-text-muted);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}._ice-copy-btn{width:22px;height:22px;color:var(--ice-text-muted);cursor:pointer;background:0 0;border:none;border-radius:4px;flex-shrink:0;justify-content:center;align-items:center;padding:0;transition:color .15s,background-color .15s;display:flex}._ice-copy-btn:hover{color:var(--ice-primary);background:var(--ice-bg-hover)}._ice-palette-empty{justify-content:center;align-items:center;gap:var(--main-space-2);color:var(--ice-text-muted);padding:var(--main-space-6);flex-direction:column;grid-column:1/-1;display:flex}._ice-palette-empty svg{color:var(--ice-border)}._ice-palette-empty p{font-size:var(--main-text-sm);margin:0}@media (max-width:640px){._ice-palette{grid-template-columns:repeat(2,1fr)}}@media (max-width:400px){._ice-palette{grid-template-columns:1fr}}._ice-history-section{background:var(--ice-bg);border-radius:var(--ice-radius-lg);border-style:solid;border-width:1px;border-color:var(--ice-border);padding:var(--main-space-4)}._ice-history-header{margin-bottom:var(--main-space-3);justify-content:space-between;align-items:center;display:flex}._ice-history-title{align-items:center;gap:var(--main-space-2);font-size:var(--main-text-sm);color:var(--ice-text);font-weight:500;display:flex}._ice-history-title svg{color:var(--ice-text-muted)}._ice-clear-btn{padding:var(--main-space-1);color:var(--ice-text-muted);border-radius:var(--main-radius);cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;transition:color .15s;display:flex}._ice-clear-btn:hover{color:var(--main-error)}._ice-history-grid{gap:var(--main-space-2);flex-wrap:wrap;min-height:40px;display:flex}._ice-history-item{border-radius:var(--ice-radius);cursor:pointer;height:32px;box-shadow:var(--ice-shadow);transition:box-shadow .15s;display:flex;overflow:hidden}._ice-history-item:hover{box-shadow:var(--ice-shadow-lg)}._ice-history-color{width:24px;height:100%}._ice-empty-hint{text-align:center;width:100%;font-size:var(--main-text-sm);color:var(--ice-text-muted);padding:var(--main-space-2)}