.page.svelte-wip8uq{display:flex;flex-direction:column;align-items:center;width:100%;gap:14px}header.svelte-wip8uq{text-align:center;padding:18px 12px 4px}header.svelte-wip8uq h1:where(.svelte-wip8uq){margin:0;font-size:1.6rem}header.svelte-wip8uq p:where(.svelte-wip8uq){margin:4px 0 0;color:#555;font-size:.95rem}.preview-wrap.svelte-wip8uq{width:100%;display:flex;justify-content:center}.preview.svelte-wip8uq{width:min(760px,100%);padding:2rem 2.4rem;border-radius:10px;border:1px solid #e6e6e6;text-align:center}.preview.svelte-wip8uq h2:where(.svelte-wip8uq){margin-top:0}.controls.svelte-wip8uq{width:min(760px,100%);display:flex;gap:16px;align-items:flex-start}.col.svelte-wip8uq{flex:1;min-width:0}.col.svelte-wip8uq h2:where(.svelte-wip8uq){margin:0 0 8px;font-size:1rem;text-align:center}.picker.svelte-wip8uq{margin:1em}.picker.svelte-wip8uq input[type=color]:where(.svelte-wip8uq){width:100%;height:3.6rem;border:1px solid #e6e6e6;border-radius:10px;background:none;cursor:pointer;display:block;padding:0;appearance:none}.picker.svelte-wip8uq input[type=color]:where(.svelte-wip8uq)::-webkit-color-swatch-wrapper{padding:0}.picker.svelte-wip8uq input[type=color]:where(.svelte-wip8uq)::-webkit-color-swatch{border:none;border-radius:8px}.picker.svelte-wip8uq input[type=color]:where(.svelte-wip8uq)::-moz-color-swatch{border:none;border-radius:8px}.results.svelte-wip8uq{width:100%;display:flex;flex-direction:column;gap:12px;margin-top:10px}.results.svelte-wip8uq div:where(.svelte-wip8uq){display:flex;align-items:center;gap:6px}.results.svelte-wip8uq label:where(.svelte-wip8uq){width:48px;font-weight:600}.results.svelte-wip8uq input:where(.svelte-wip8uq){flex:1;padding:8px;border:1px solid #ccc;border-radius:6px;background:#fff;color:#000}.results.svelte-wip8uq button:where(.svelte-wip8uq){border:none;background:transparent;cursor:pointer;font-size:1.1rem}.swap.svelte-wip8uq{align-self:center;font-size:1.3rem;padding:8px 12px;border:none;background:transparent;border-radius:6px;cursor:pointer;transition:background .2s}.swap.svelte-wip8uq:hover{background:#d0d0d0}.swap.svelte-wip8uq:active{background:silver}.swap-icon.svelte-wip8uq{font-size:1.5em}.swap-text.svelte-wip8uq{font-size:.6em}.copied.svelte-wip8uq{margin:0;font-size:.9rem;color:#2f6b2f}.color-names-section.svelte-wip8uq{width:min(760px,100%);padding:0 0 24px}.color-names-section.svelte-wip8uq h2:where(.svelte-wip8uq){margin-bottom:12px;font-size:1.1rem;text-align:center}.color-list.svelte-wip8uq{display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:8px}.color-item.svelte-wip8uq{display:flex;align-items:center;justify-content:center;height:32px;border-radius:6px;font-size:.75rem;cursor:pointer;text-shadow:0 0 2px rgba(0,0,0,.25);border:1px solid #ccc;overflow:hidden}.color-item.svelte-wip8uq:hover{outline:2px solid #888}@media(max-width:720px){.controls.svelte-wip8uq{flex-direction:column}.preview.svelte-wip8uq{padding:14px}}