.color-layout{grid-template-columns:minmax(310px,370px) minmax(0,1fr)}.current-color-file{display:grid;grid-template-columns:54px minmax(0,1fr) auto;align-items:center;gap:10px;margin:-2px 0 14px;padding:8px;border:1px solid var(--line);border-radius:5px;background:#f5f1e7}.current-color-file canvas{width:54px;height:54px;object-fit:contain;border:1px solid var(--line);background:white}.current-color-file strong,.current-color-file small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.current-color-file small{margin-top:4px;color:var(--muted);font:400 .68rem/1.2 system-ui,sans-serif}.remove-color-file{align-self:start;border:0;background:transparent;color:var(--muted);font-size:1.25rem;line-height:1;padding:2px 5px}.remove-color-file:hover{color:var(--red)}.palette-method{display:grid;grid-template-columns:1fr 1fr;gap:5px;margin:12px 0}.palette-method-button{padding:8px;border:1px solid var(--line);background:var(--panel);color:var(--ink);font:600 .74rem/1.2 system-ui,sans-serif}.palette-method-button.active{border-color:var(--green);background:#e4e9e1;color:var(--green)}.picker-help{margin:0 0 12px;padding:8px 10px;border-left:2px solid var(--green);background:#e8ebe4;color:#425044;font:400 .7rem/1.4 system-ui,sans-serif}.palette-heading{display:flex;align-items:end;justify-content:space-between;gap:8px;padding:14px 0 8px;border-top:1px solid #ddd6c9}.palette-heading span{color:var(--muted);font:400 .68rem/1.2 system-ui,sans-serif}.color-palette{display:grid;gap:6px;max-height:285px;overflow:auto}.color-row{display:grid;grid-template-columns:auto 38px minmax(0,1fr) auto;align-items:center;gap:8px;padding:6px;border:1px solid var(--line);border-radius:4px;background:#f5f1e7}.color-row>input[type=checkbox]{accent-color:var(--green)}.color-row>input[type=color]{width:38px;height:32px;padding:2px;border:1px solid var(--line);background:white}.color-row strong,.color-row small{display:block}.color-row small,.empty-copy{color:var(--muted);font:400 .68rem/1.35 system-ui,sans-serif}.empty-copy{margin:6px 0}.repick-color{border:0;background:transparent;color:var(--green);padding:5px;font:600 .68rem/1 system-ui,sans-serif;text-decoration:underline;text-underline-offset:2px}.color-viewport canvas{display:block;margin:auto;background:white;max-width:none;max-height:none;image-rendering:auto}.color-viewport.picking{cursor:crosshair}.eyedropper-hint{position:sticky;left:12px;bottom:12px;display:inline-block;padding:6px 8px;border-radius:4px;background:rgba(32,31,26,.86);color:white;pointer-events:none;font:600 .68rem/1 system-ui,sans-serif}@media(max-width:820px){.color-layout{grid-template-columns:1fr}}