:root{font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;line-height:1.5;color-scheme:light dark;color:#0f172a;background-color:#f1f5f9}body{margin:0;display:flex;min-height:100vh;align-items:center;justify-content:center;background:linear-gradient(160deg,#f8fafc,#e2e8f0)}#app{width:min(560px,90vw);background:#fff;border-radius:16px;padding:32px;box-shadow:0 24px 48px #0f172a26}h1{margin-top:0;font-size:1.8rem;color:#1e293b}section+section{margin-top:24px}fieldset{border:1px solid #cbd5f5;border-radius:12px;padding:16px 20px 20px}legend{padding:0 12px;font-weight:600;color:#334155}label{display:block;font-weight:500;margin-bottom:8px}select,input[type=color],input[type=text],button{width:100%;padding:10px 12px;font-size:1rem;border-radius:10px;border:1px solid #cbd5f5;box-sizing:border-box}button{cursor:pointer;font-weight:600;background:#2563eb;border-color:#2563eb;color:#fff;transition:background .2s ease,transform .1s ease;margin-top:12px}button:disabled{background:#94a3b8;border-color:#94a3b8;cursor:not-allowed}button:hover:not(:disabled){background:#1d4ed8}button:active:not(:disabled){transform:translateY(1px)}.switcher{display:flex;align-items:center;gap:12px}.switcher input{width:auto;accent-color:#2563eb}#status{margin-top:16px;padding:12px;border-radius:10px;background:#f1f5f9;font-size:.95rem;min-height:24px;color:#1e293b}#preview{margin-top:18px;height:56px;border-radius:14px;border:1px solid #cbd5f5;display:flex;align-items:center;justify-content:center;font-weight:600;color:#0f172a}