:root{color-scheme:light dark;--bg: #0b0d12;--card: #111522;--text: #e7eaf0;--muted: #9aa3b2;--border: #20263a;--accent: #6ea8fe}@media(prefers-color-scheme:light){:root{--bg: #f6f7fb;--card: #ffffff;--text: #151a2d;--muted: #5b6476;--border: #e3e6f0;--accent: #2b59ff}}*{box-sizing:border-box}html,body{height:100%}body{margin:0;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,"Apple Color Emoji","Segoe UI Emoji";background:radial-gradient(1200px 600px at 50% 0%,rgba(110,168,254,.18),transparent),var(--bg);color:var(--text)}.page{max-width:960px;padding:48px 20px;margin:0 auto}.header{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin-bottom:18px}.title{font-size:22px;font-weight:700;letter-spacing:.2px}.subtitle{font-size:14px;color:var(--muted)}.card{border:1px solid var(--border);background:color-mix(in oklab,var(--card) 92%,transparent);border-radius:16px;padding:22px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.stack{display:flex;flex-direction:column;gap:14px}.output{min-height:54px;display:flex;align-items:center;padding:14px 16px;border-radius:12px;border:1px solid var(--border);background:color-mix(in oklab,var(--bg) 75%,transparent);font-size:20px;font-weight:600;letter-spacing:.2px}.sectionTitle{margin:0 0 10px;font-size:14px;font-weight:700;letter-spacing:.2px;text-transform:none;color:var(--muted)}.label{display:block;margin:16px 0 8px;color:var(--muted);font-size:13px}.textarea{width:100%;resize:vertical;border-radius:12px;padding:12px;border:1px solid var(--border);background:transparent;color:var(--text);line-height:1.4}.optionsGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 12px;margin-top:12px}.codeDetails{margin-top:12px;border:1px solid var(--border);border-radius:12px;overflow:hidden;background:color-mix(in oklab,var(--bg) 70%,transparent)}.codeSummary{cursor:pointer;padding:10px 12px;-webkit-user-select:none;user-select:none;color:var(--muted);font-size:13px;font-weight:600}.codePre{margin:0;padding:12px;overflow:auto;border-top:1px solid var(--border);font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:12.5px;line-height:1.45;color:var(--text)}.field{display:flex;flex-direction:column;gap:6px}.fieldLabel{color:var(--muted);font-size:12px}.input{width:100%;border-radius:12px;padding:10px 12px;border:1px solid var(--border);background:transparent;color:var(--text)}.checkboxField{justify-content:flex-end}.checkbox{width:18px;height:18px}.actions{display:flex;gap:10px;margin-top:12px}.button{border:1px solid var(--border);background:color-mix(in oklab,var(--accent) 30%,transparent);color:var(--text);border-radius:12px;padding:10px 14px;font-weight:600;cursor:pointer}.button:hover{filter:brightness(1.05)}.buttonSecondary{background:transparent}