/* Chart maker. Shared --ink/--muted/--line/--paper/--white/--blue tokens follow dark mode. */
.ch-page{max-width:1240px}
.ch-heading h1{font-size:clamp(28px,4vw,42px);line-height:1.25;margin:8px 0 12px}
.ch-family{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 16px}.ch-family a{font-size:14px;border:1px solid var(--line);background:var(--white);border-radius:999px;padding:7px 13px;color:var(--ink);text-decoration:none}.ch-family a[aria-current=page]{background:var(--blue);border-color:var(--blue);color:#fff;font-weight:600}
.ch-workbench{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:18px;border:1px solid var(--line);border-radius:18px;background:var(--white);box-shadow:0 14px 42px rgba(23,42,71,.06);padding:16px 18px;min-width:0;color:var(--ink)}
.ch-form,.ch-out{display:grid;gap:12px;align-content:start;min-width:0}
.ch-types{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));border:1px solid var(--line);border-radius:12px;overflow:hidden}
.ch-types label{display:flex;align-items:center;justify-content:center;min-height:42px;padding:4px;font-size:14px;cursor:pointer;text-align:center}.ch-types label+label{border-left:1px solid var(--line)}
.ch-types input{position:absolute;opacity:0;pointer-events:none}.ch-types label.on{background:var(--blue);color:#fff;font-weight:700}.ch-types label:focus-within{outline:2px solid #547dea;outline-offset:-2px}
.ch-field{display:grid;gap:6px;font-size:13px;color:var(--muted);min-width:0}.ch-field small{font-weight:400}
.ch-field textarea{min-height:200px;border:1px solid var(--line);border-radius:10px;padding:10px 12px;font:13.5px/1.6 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;color:var(--ink);background:var(--white);resize:vertical;width:100%;box-sizing:border-box;tab-size:12}
.ch-detected{margin:-4px 0 0;font-size:12.5px;color:var(--muted);overflow-wrap:anywhere}.ch-detected:empty{display:none}
.ch-row{display:flex;gap:8px;flex-wrap:wrap}
.ch-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px}.ch-grid .ch-wide{grid-column:1/-1}
.ch-grid label,.ch-inline{display:grid;gap:6px;font-size:13px;color:var(--muted);min-width:0}
.ch-grid input,.ch-grid select,.ch-inline select{min-height:42px;border:1px solid var(--line);border-radius:10px;padding:6px 10px;font:inherit;font-size:15px;color:var(--ink);background:var(--white);width:100%;box-sizing:border-box;min-width:0}
.ch-options{display:flex;flex-wrap:wrap;gap:8px 18px;border:1px solid var(--line);border-radius:12px;padding:10px 12px}.ch-options>div{display:flex;flex-wrap:wrap;gap:8px 16px;align-items:center}.ch-options>div[hidden]{display:none}
.ch-inline{grid-template-columns:auto minmax(120px,1fr);align-items:center}.ch-inline input[type=range]{accent-color:var(--blue)}
.ch-check{display:flex;align-items:center;gap:7px;font-size:14px;color:var(--ink)}.ch-check input{width:18px;height:18px;accent-color:var(--blue)}
.ch-palettes{display:flex;flex-wrap:wrap;gap:6px}
.ch-palettes button{display:inline-flex;align-items:center;gap:6px;min-height:36px;border:1px solid var(--line);border-radius:999px;padding:4px 12px 4px 6px;background:var(--white);color:var(--ink);font:inherit;font-size:13px;cursor:pointer}
.ch-palettes button i{width:26px;height:16px;border-radius:999px;display:inline-block}.ch-palettes button[aria-pressed=true]{border-color:var(--blue);box-shadow:inset 0 0 0 1px var(--blue);font-weight:700}
.ch-frame{min-width:0;overflow:hidden;border:1px solid var(--line);border-radius:14px;background:var(--white);aspect-ratio:16/9;width:100%;min-height:260px;max-height:640px}
.ch-chart{width:100%;height:100%}
.ch-notes{margin:0;font-size:13.5px;color:var(--muted);line-height:1.6}.ch-notes:empty{display:none}.ch-notes.ch-warn{color:#8a5a00;background:#fff8e6;border:1px solid #f0c36a;border-radius:10px;padding:8px 10px}
.ch-actions{display:flex;flex-wrap:wrap;gap:8px}
.ch-workbench button:not([data-ch-palette]){min-height:42px;border:1px solid var(--line);border-radius:10px;padding:6px 14px;font:inherit;font-size:14px;background:var(--white);color:var(--ink);cursor:pointer}
.ch-workbench button.primary{background:var(--blue);border-color:var(--blue);color:#fff;font-weight:600}.ch-workbench .ch-ghost{min-height:34px!important;font-size:13px!important}
.ch-toast{margin:0;font-size:13px;color:#15803d;min-height:1.2em}
.ch-sample-format{background:var(--paper);border:1px solid var(--line);border-radius:10px;padding:10px 12px;font:13px/1.6 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;tab-size:14;overflow:auto}
html[data-xunl-theme="dark"] .ch-notes.ch-warn{background:#3a2a12;border-color:#a07a1f;color:#f6d28a}html[data-xunl-theme="dark"] .ch-toast{color:#a7f3c5}
@media(max-width:900px){.ch-workbench{grid-template-columns:minmax(0,1fr)}.ch-out{order:-1}}
@media(max-width:560px){.ch-workbench{padding:12px}.ch-types{grid-template-columns:repeat(3,minmax(0,1fr))}.ch-types label:nth-child(4){border-left:0}.ch-types label:nth-child(n+4){border-top:1px solid var(--line)}.ch-frame{min-height:220px}}