@freereportjs/core 0.1.0 → 0.9.0

package/dist/index.d.ts

@@ -616,6 +616,12 @@ interface AgentStatus {
     port: number;
     /** True when this origin's stored token is valid. */
     paired: boolean;
+    /** Newer agent version the agent has found (it installs itself when idle), or null. Always null for agents before 1.1.0. */
+    updateAvailable: string | null;
+    /** Newest version from the agent's last update check, or null when it has not checked (or is older than 1.1.0). */
+    latestVersion: string | null;
+    /** True when this agent is older than the minimum supported version: ask the user to update. */
+    outdated: boolean;
 }
 /** One installed printer (`GET /v1/printers`). */
 interface AgentPrinter {
@@ -695,6 +701,7 @@ declare const agent: {
     /**
      * Find a running agent on 127.0.0.1 (ports 18731–18735, 600 ms each, tried in parallel).
      * Resolves to its status, or null when it is not installed / not running.
+     * `status.updateAvailable` / `latestVersion` / `outdated` report the agent's self-update state.
      */
     detect(): Promise<AgentStatus | null>;
     /**
@@ -788,6 +795,21 @@ interface ViewerOptions extends ReportOptions {
     /** Show the parameter panel open at start (default: when the report has parameters without defaults). */
     paramsOpen?: boolean;
     fileName?: string;
+    /** After every successful run (start, 조회/Run, setData, setParams, setDefinition): page and row counts. */
+    onReady?: (e: ViewerReadyEvent) => void;
+    /** When the user submits the parameter panel, before the data is fetched. Return false to stay (e.g. failed validation), or return changed params. */
+    onParamsSubmit?: (params: Record<string, unknown>) => boolean | void | Record<string, unknown> | Promise<boolean | void | Record<string, unknown>>;
+    /** The page in view changed (1-based). */
+    onPageChange?: (page: number, total: number) => void;
+    /** Loading data, laying out, printing or saving failed. The viewer still shows its own message. */
+    onError?: (error: Error, during: 'data' | 'layout' | 'output') => void;
+}
+interface ViewerReadyEvent {
+    pages: number;
+    rows: number;
+    /** Layout time in milliseconds. */
+    ms: number;
+    params: Record<string, unknown>;
 }
 interface Viewer {
     readonly report: Report;
@@ -1123,7 +1145,7 @@ declare function verifyLicense(key: string, host: string, opts?: {
 declare function setLicenseKey(key: string): void;
 
 /** FreeReport version (kept in sync with releases.json by scripts/release.mjs). */
-declare const version = "0.1.0";
+declare const version = "0.9.0";
 
 type Lang = 'ko' | 'en';
 
@@ -1185,4 +1207,4 @@ declare function renderXlsx(def: ReportDefinition, data?: ReportData, opts?: Ser
     mode?: 'form' | 'data';
 }): Promise<Uint8Array>;
 
-export { AgentError, type AgentLogEntry, type AgentPrintOptions, type AgentPrintResult, type AgentPrinter, type AgentStatus, type Align, type Band, type BandKind, type BarcodeElement, type BorderInput, type BorderSide, type BoxItem, type ChartElement, type ChartSeries, type CrosstabElement, type Designer, type DesignerOptions, type ElementType, type Emboss, type Expr, FUNCTIONS, type FieldElement, type FontBytes, type FontEntry, type GroupDefinition, type ImageElement, type ImageItem, type ItemSource, type LayoutOptions, type LayoutResult, type LicenseInfo, type LineElement, type LineItem, type OutputEvent, type OutputKind, PAPER, type PageItem, type PageSetup, type PaperSize, type ParamDefinition, type PathCommand, type PathItem, type PdfFontSource, type PdfOptions, type PdfPermissions, type PdfSecurity, type PrintOptions, type RectElement, type Report, type ReportData, type ReportDefinition, type ReportElement, type ReportOptions, type ReportPage, type ResolvedBorder, type ResolvedFont, type ServerRenderOptions, type Style, type TableColumn, type TableElement, type TextElement, type TextItem, type TextLine, type TextMeasurer, type VAlign, type Viewer, type ViewerOptions, type Watermark, type XCell, type XCellStyle, type XSheet, agent, applyEmboss, blankReport, canonicalText, canvasMeasurer, checkExpression, compile, contentWidth, createDesigner, createReport, createViewer, dataToCsv, dataToXlsx, defaultMeasurer, embossImage, encodeCode128, encodeDataMatrix, encodeEan13, encodePdf417, encodeQr, ensureFonts, estimateMeasurer, evaluate, fingerprintPages, formatDate, formatNumber, formatValue, getFont, interpolate, koreanAmount, koreanNumber, layoutReport, loadFontBytes, loadFonts, pageGeometry, pageToSvg, pagesToHwpx, pagesToXlsx, paramValues, printPages, registerFont, renderPage, renderPdf, renderXlsx, resetMeasurer, rowsOf, saveFile, setLicenseKey, sha256Hex, ttfMeasurer, verifyLicense, version, wrapText, writePdf, writeXlsx };
+export { AgentError, type AgentLogEntry, type AgentPrintOptions, type AgentPrintResult, type AgentPrinter, type AgentStatus, type Align, type Band, type BandKind, type BarcodeElement, type BorderInput, type BorderSide, type BoxItem, type ChartElement, type ChartSeries, type CrosstabElement, type Designer, type DesignerOptions, type ElementType, type Emboss, type Expr, FUNCTIONS, type FieldElement, type FontBytes, type FontEntry, type GroupDefinition, type ImageElement, type ImageItem, type ItemSource, type LayoutOptions, type LayoutResult, type LicenseInfo, type LineElement, type LineItem, type OutputEvent, type OutputKind, PAPER, type PageItem, type PageSetup, type PaperSize, type ParamDefinition, type PathCommand, type PathItem, type PdfFontSource, type PdfOptions, type PdfPermissions, type PdfSecurity, type PrintOptions, type RectElement, type Report, type ReportData, type ReportDefinition, type ReportElement, type ReportOptions, type ReportPage, type ResolvedBorder, type ResolvedFont, type ServerRenderOptions, type Style, type TableColumn, type TableElement, type TextElement, type TextItem, type TextLine, type TextMeasurer, type VAlign, type Viewer, type ViewerOptions, type ViewerReadyEvent, type Watermark, type XCell, type XCellStyle, type XSheet, agent, applyEmboss, blankReport, canonicalText, canvasMeasurer, checkExpression, compile, contentWidth, createDesigner, createReport, createViewer, dataToCsv, dataToXlsx, defaultMeasurer, embossImage, encodeCode128, encodeDataMatrix, encodeEan13, encodePdf417, encodeQr, ensureFonts, estimateMeasurer, evaluate, fingerprintPages, formatDate, formatNumber, formatValue, getFont, interpolate, koreanAmount, koreanNumber, layoutReport, loadFontBytes, loadFonts, pageGeometry, pageToSvg, pagesToHwpx, pagesToXlsx, paramValues, printPages, registerFont, renderPage, renderPdf, renderXlsx, resetMeasurer, rowsOf, saveFile, setLicenseKey, sha256Hex, ttfMeasurer, verifyLicense, version, wrapText, writePdf, writeXlsx };

package/dist/index.js

@@ -187,8 +187,8 @@ function pdfFonts(pages) {
 }
 
 // src/version.ts
-var version = "0.1.0";
-var releaseDate = "2026-10-15";
+var version = "0.9.0";
+var releaseDate = "2026-10-16";
 
 // src/license.ts
 var PUBLIC_KEY = { kty: "EC", crv: "P-256", x: "MiJXJR8TZJ_-0VKk0wIQ-5mzRsyQ6ruGsbcRRdw9jrw", y: "MTdklYSzCM2pganffz7PPMfxSclQkBLqU_9se_VDznM" };
@@ -5365,6 +5365,14 @@ html, body { margin: 0; padding: 0; background: #fff; }
 }
 
 // src/agent.ts
+function normalizeStatus(s) {
+  return {
+    ...s,
+    updateAvailable: typeof s.updateAvailable === "string" ? s.updateAvailable : null,
+    latestVersion: typeof s.latestVersion === "string" ? s.latestVersion : null,
+    outdated: s.outdated === true
+  };
+}
 var AgentError = class extends Error {
   constructor(message, code, status) {
     super(message);
@@ -5412,7 +5420,7 @@ async function fetchJson(url, init = {}) {
 async function probe(port) {
   const s = await fetchJson(`http://127.0.0.1:${port}/v1/status`, { timeout: DETECT_TIMEOUT });
   if (s?.name !== AGENT_NAME) throw new Error("not the agent");
-  return s;
+  return normalizeStatus(s);
 }
 async function requireBase() {
   if (base) return base;
@@ -5442,12 +5450,13 @@ var agent = {
   /**
    * Find a running agent on 127.0.0.1 (ports 18731–18735, 600 ms each, tried in parallel).
    * Resolves to its status, or null when it is not installed / not running.
+   * `status.updateAvailable` / `latestVersion` / `outdated` report the agent's self-update state.
    */
   async detect() {
     if (typeof fetch === "undefined") return null;
     if (base) {
       try {
-        return await fetchJson(`${base}/v1/status`, { timeout: DETECT_TIMEOUT });
+        return normalizeStatus(await fetchJson(`${base}/v1/status`, { timeout: DETECT_TIMEOUT }));
       } catch {
         base = null;
       }
@@ -5850,6 +5859,27 @@ function createViewer(el, options) {
     const pageH = result.height * MM_PX * scale + PAGE_GAP;
     current = Math.min(result.pages.length - 1, Math.max(0, Math.round(body.scrollTop / pageH)));
     if (pageInput && document.activeElement !== pageInput) pageInput.value = String(current + 1);
+    notifyPage();
+  };
+  let reported = -1;
+  const notifyPage = () => {
+    if (!result?.pages.length || current === reported) return;
+    reported = current;
+    try {
+      options.onPageChange?.(current + 1, result.pages.length);
+    } catch (e) {
+      console.error(e);
+    }
+  };
+  const fail = (e, during) => {
+    const err = e instanceof Error ? e : new Error(String(e));
+    console.error(err);
+    try {
+      options.onError?.(err, during);
+    } catch (x) {
+      console.error(x);
+    }
+    return err;
   };
   const goTo = (n2) => {
     if (!result) return;
@@ -5858,6 +5888,7 @@ function createViewer(el, options) {
     if (holder) body.scrollTop = holder.offsetTop - pagesEl.offsetTop;
     current = i;
     if (pageInput) pageInput.value = String(i + 1);
+    notifyPage();
   };
   const setZoom = (z) => {
     const ratio = result ? body.scrollTop / Math.max(1, body.scrollHeight) : 0;
@@ -5869,20 +5900,28 @@ function createViewer(el, options) {
   const run = async () => {
     const seq2 = ++runSeq;
     busy(t.loading);
+    let during = "data";
     try {
       if (options.fetchData) {
         const fetched = await options.fetchData(params);
         if (seq2 !== runSeq) return;
         report.setData(fetched);
       }
+      during = "layout";
       report.setParams(params);
       await ensureFonts(report.definition);
       if (destroyed) return;
       result = report.layout();
+      reported = -1;
       build();
+      try {
+        options.onReady?.({ pages: result.pages.length, rows: result.rowCount, ms: result.ms, params: { ...params } });
+      } catch (e) {
+        console.error(e);
+      }
     } catch (e) {
-      console.error(e);
-      pagesEl.innerHTML = `<p class="fr-empty">${t.error}: ${escapeHtml(String(e.message ?? e))}</p>`;
+      const err = fail(e, during);
+      pagesEl.innerHTML = `<p class="fr-empty">${t.error}: ${escapeHtml(err.message)}</p>`;
     } finally {
       busy(null);
     }
@@ -5892,8 +5931,7 @@ function createViewer(el, options) {
     try {
       await report.download(kind, options.fileName);
     } catch (e) {
-      console.error(e);
-      alertText(`${t.error}: ${e.message}`);
+      alertText(`${t.error}: ${fail(e, "output").message}`);
     } finally {
       busy(null);
     }
@@ -5935,7 +5973,7 @@ function createViewer(el, options) {
         setZoom(Math.round((scale - 0.1) * 10) / 10);
         break;
       case "print":
-        void report.print().catch((err) => alertText(`${t.error}: ${err.message}`));
+        void report.print().catch((err) => alertText(`${t.error}: ${fail(err, "output").message}`));
         break;
       case "pdf":
         void exportAs("pdf");
@@ -6010,7 +6048,7 @@ function createViewer(el, options) {
     e.preventDefault();
     setZoom(Math.round(scale * (e.deltaY < 0 ? 1.1 : 1 / 1.1) * 100) / 100);
   }, { passive: false });
-  form?.addEventListener("submit", (e) => {
+  form?.addEventListener("submit", async (e) => {
     e.preventDefault();
     const next = { ...params };
     form.querySelectorAll("input, select").forEach((inp) => {
@@ -6018,7 +6056,15 @@ function createViewer(el, options) {
       const v = inp.value;
       next[inp.name] = type === "number" ? v === "" ? null : Number(v) : type === "boolean" ? v === "true" : v;
     });
-    params = next;
+    let answer;
+    try {
+      answer = await options.onParamsSubmit?.({ ...next });
+    } catch (x) {
+      fail(x, "data");
+      return;
+    }
+    if (answer === false) return;
+    params = answer && typeof answer === "object" ? { ...next, ...answer } : next;
     void run();
   });
   const ro = typeof ResizeObserver !== "undefined" ? new ResizeObserver(() => {

package/dist/styles.css

@@ -1,168 +1,168 @@
-/* FreeReport viewer and designer. Override the --fr-* variables to theme. */
-.fr-viewer, .fr-designer {
-  --fr-bg: #e9ecf1;
-  --fr-panel: #ffffff;
-  --fr-ink: #0e1726;
-  --fr-ink-2: #4a5568;
-  --fr-rule: #d5dbe3;
-  --fr-accent: #2340f5;
-  --fr-accent-ink: #ffffff;
-  --fr-hover: #f1f3f7;
-  --fr-radius: 6px;
-  --fr-font: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, "Apple SD Gothic Neo", "Malgun Gothic", "Segoe UI", sans-serif;
-  display: flex; flex-direction: column; min-height: 0; height: 100%;
-  font: 13px/1.4 var(--fr-font); color: var(--fr-ink); background: var(--fr-bg);
-  border: 1px solid var(--fr-rule); border-radius: var(--fr-radius); overflow: hidden; box-sizing: border-box;
-}
-.fr-viewer *, .fr-designer * { box-sizing: border-box; }
-
-.fr-toolbar { display: flex; align-items: center; flex-wrap: wrap; gap: 2px; padding: 6px 8px; background: var(--fr-panel); border-bottom: 1px solid var(--fr-rule); }
-.fr-btn { display: inline-flex; align-items: center; gap: 5px; height: 30px; padding: 0 9px; border: 1px solid transparent; border-radius: var(--fr-radius); background: none; color: var(--fr-ink); font: inherit; font-weight: 500; cursor: pointer; white-space: nowrap; }
-.fr-btn:hover { background: var(--fr-hover); }
-.fr-btn:focus-visible, .fr-viewer select:focus-visible, .fr-viewer input:focus-visible { outline: 2px solid var(--fr-accent); outline-offset: 1px; }
-.fr-btn:disabled { opacity: .45; cursor: default; }
-.fr-btn.fr-icon { width: 30px; padding: 0; justify-content: center; }
-.fr-btn.fr-primary { background: var(--fr-accent); color: var(--fr-accent-ink); }
-.fr-btn.fr-primary:hover { filter: brightness(1.08); }
-.fr-btn[aria-expanded="true"], .fr-btn[aria-pressed="true"] { background: var(--fr-hover); border-color: var(--fr-rule); }
-.fr-btn svg { flex: none; }
-.fr-sep { width: 1px; height: 20px; margin: 0 6px; background: var(--fr-rule); }
-.fr-spacer { flex: 1; }
-.fr-pageno { display: inline-flex; align-items: center; gap: 4px; margin: 0 4px; color: var(--fr-ink-2); font-variant-numeric: tabular-nums; }
-.fr-pageno input { width: 44px; height: 28px; text-align: center; border: 1px solid var(--fr-rule); border-radius: var(--fr-radius); font: inherit; color: var(--fr-ink); }
-.fr-zoom { height: 30px; padding: 0 6px; border: 1px solid var(--fr-rule); border-radius: var(--fr-radius); background: var(--fr-panel); font: inherit; color: var(--fr-ink); }
-.fr-menu { position: relative; }
-.fr-menu-list { position: absolute; right: 0; top: calc(100% + 4px); z-index: 20; min-width: 180px; padding: 4px; background: var(--fr-panel); border: 1px solid var(--fr-rule); border-radius: var(--fr-radius); box-shadow: 0 8px 24px rgba(14, 23, 38, .14); display: flex; flex-direction: column; }
-.fr-menu-list[hidden] { display: none; }
-.fr-menu-list button { text-align: left; padding: 8px 10px; border: 0; background: none; border-radius: 4px; font: inherit; color: var(--fr-ink); cursor: pointer; }
-.fr-menu-list button:hover, .fr-menu-list button:focus-visible { background: var(--fr-hover); outline: none; }
-
-.fr-params { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 10px 14px; padding: 10px 12px; background: var(--fr-panel); border-bottom: 1px solid var(--fr-rule); }
-.fr-params[hidden] { display: none; }
-.fr-param { display: flex; flex-direction: column; gap: 3px; }
-.fr-param label { font-size: 12px; color: var(--fr-ink-2); font-weight: 600; }
-.fr-param label b { color: #c8102e; }
-.fr-param input, .fr-param select { height: 30px; min-width: 140px; padding: 0 8px; border: 1px solid var(--fr-rule); border-radius: var(--fr-radius); font: inherit; background: #fff; color: var(--fr-ink); }
-
-.fr-body { position: relative; flex: 1; min-height: 0; overflow: auto; outline: none; }
-.fr-pages { display: flex; flex-direction: column; align-items: center; gap: 16px; padding: 16px 24px 32px; min-width: min-content; }
-.fr-page { width: var(--fr-page-w, 794px); height: var(--fr-page-h, 1123px); flex: none; background: #fff; box-shadow: 0 1px 3px rgba(14, 23, 38, .18), 0 6px 18px -8px rgba(14, 23, 38, .25); }
-.fr-page-svg { display: block; width: 100%; height: 100%; }
-.fr-page { position: relative; }
-.fr-hit { position: absolute; background: rgba(242, 169, 0, .38); outline: 2px solid #f2a900; border-radius: 2px; pointer-events: none; }
-.fr-search { display: inline-flex; align-items: center; gap: 4px; height: 30px; padding: 0 8px; border: 1px solid var(--fr-rule); border-radius: var(--fr-radius); color: var(--fr-ink-2); background: var(--fr-panel); }
-.fr-search input { width: 120px; border: 0; outline: none; font: inherit; color: var(--fr-ink); background: none; }
-.fr-search:focus-within { border-color: var(--fr-accent); }
-.fr-search-count { font-size: 12px; white-space: nowrap; font-variant-numeric: tabular-nums; }
-.fr-empty { margin: 48px auto; color: var(--fr-ink-2); }
-.fr-overlay { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; gap: 10px; background: rgba(233, 236, 241, .72); font-weight: 600; color: var(--fr-ink-2); z-index: 5; }
-.fr-overlay[hidden] { display: none; }
-.fr-spinner { width: 18px; height: 18px; border: 2px solid var(--fr-rule); border-top-color: var(--fr-accent); border-radius: 50%; animation: fr-spin .8s linear infinite; }
-@keyframes fr-spin { to { transform: rotate(360deg); } }
-@media (prefers-reduced-motion: reduce) { .fr-spinner { animation-duration: 2.4s; } }
-.fr-status { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 4px 10px; background: var(--fr-panel); border-top: 1px solid var(--fr-rule); color: var(--fr-ink-2); font-size: 12px; font-variant-numeric: tabular-nums; min-height: 26px; }
-.fr-badge { color: var(--fr-ink-2); text-decoration: none; border: 1px solid var(--fr-rule); border-radius: 999px; padding: 0 8px; }
-.fr-badge[hidden] { display: none; }
-
-@media (max-width: 640px) {
-  .fr-btn span { display: none; }
-  .fr-btn { padding: 0 7px; }
-  .fr-pages { padding: 10px 8px 24px; }
-}
-@media print {
-  .fr-viewer .fr-toolbar, .fr-viewer .fr-status, .fr-viewer .fr-params { display: none; }
-}
-
-/* ── Designer ─────────────────────────────────── */
-.fr-designer { outline: none; }
-.fr-designer .fr-toolbar { gap: 1px; }
-.fr-designer .fr-group { display: inline-flex; align-items: center; gap: 1px; flex-wrap: wrap; }
-.fr-designer.is-preview .fr-design-only, .fr-designer.is-json .fr-design-only { display: none; }
-.fr-tabs { display: inline-flex; padding: 2px; background: var(--fr-bg); border-radius: 7px; }
-.fr-tab { height: 26px; padding: 0 12px; border: 0; border-radius: 5px; background: none; font: inherit; font-weight: 600; color: var(--fr-ink-2); cursor: pointer; }
-.fr-tab[aria-selected="true"] { background: var(--fr-panel); color: var(--fr-ink); box-shadow: 0 1px 2px rgba(14, 23, 38, .12); }
-.fr-zoom-label { min-width: 42px; text-align: center; font-variant-numeric: tabular-nums; color: var(--fr-ink-2); }
-.fr-dz { flex: 1; min-height: 0; display: grid; grid-template-columns: 200px minmax(0, 1fr) 270px; }
-.fr-designer.is-preview .fr-dz, .fr-designer.is-json .fr-dz { grid-template-columns: minmax(0, 1fr); }
-.fr-designer.is-preview .fr-dz-left, .fr-designer.is-preview .fr-dz-right, .fr-designer.is-json .fr-dz-left, .fr-designer.is-json .fr-dz-right { display: none; }
-.fr-dz-left, .fr-dz-right { background: var(--fr-panel); overflow: auto; min-height: 0; }
-.fr-dz-left { border-right: 1px solid var(--fr-rule); padding: 8px; }
-.fr-dz-right { border-left: 1px solid var(--fr-rule); }
-.fr-dz-left h3 { margin: 10px 4px 6px; font-size: 11px; letter-spacing: .04em; text-transform: uppercase; color: var(--fr-ink-2); }
-.fr-dz-left h3:first-child { margin-top: 2px; }
-.fr-dz-tools { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; }
-.fr-dz-tool { display: flex; align-items: center; gap: 6px; padding: 6px; border: 1px solid var(--fr-rule); border-radius: var(--fr-radius); background: var(--fr-panel); font: inherit; font-size: 12px; color: var(--fr-ink); cursor: grab; text-align: left; }
-.fr-dz-tool:hover, .fr-dz-field:hover { border-color: var(--fr-accent); color: var(--fr-accent); }
-.fr-dz-fields { display: flex; flex-wrap: wrap; gap: 4px; }
-.fr-dz-field { padding: 3px 8px; border: 1px solid var(--fr-rule); border-radius: 999px; background: #f7f9fc; font: 12px/1.4 ui-monospace, Consolas, monospace; color: var(--fr-ink); cursor: grab; max-width: 100%; overflow: hidden; text-overflow: ellipsis; }
-.fr-dz-empty { margin: 0 4px; color: var(--fr-ink-2); font-size: 12px; }
-.fr-dz-bandopt { display: flex; align-items: center; gap: 6px; padding: 2px 4px; font-size: 12.5px; cursor: pointer; }
-.fr-dz-groupopt { display: flex; align-items: center; justify-content: space-between; gap: 4px; padding: 2px 4px; font-size: 12px; }
-.fr-dz-groupopt code { font-size: 11.5px; }
-.fr-dz-addgroup { display: flex; gap: 4px; margin-top: 6px; }
-.fr-dz-addgroup select { flex: 1; min-width: 0; height: 30px; border: 1px solid var(--fr-rule); border-radius: var(--fr-radius); font: inherit; font-size: 12px; }
-.fr-dz-addgroup .fr-btn span { font-size: 12px; }
-.fr-dz-center { position: relative; min-width: 0; min-height: 0; display: flex; flex-direction: column; }
-.fr-dz-canvas { flex: 1; overflow: auto; padding: 24px 32px 64px; outline: none; }
-.fr-dz-canvas[hidden], .fr-dz-preview[hidden], .fr-dz-json[hidden] { display: none; }
-.fr-dz-page { margin: 0 auto; background: #fff; box-shadow: 0 1px 3px rgba(14, 23, 38, .16), 0 8px 24px -12px rgba(14, 23, 38, .3); user-select: none; }
-.fr-dz-band { position: relative; }
-.fr-dz-band-head { display: flex; justify-content: space-between; align-items: center; height: 20px; padding: 0 8px; background: #eef1f6; border-top: 1px solid var(--fr-rule); border-bottom: 1px solid var(--fr-rule); font-size: 11px; font-weight: 600; color: var(--fr-ink-2); cursor: pointer; }
-.fr-dz-band-head small { font-weight: 500; font-variant-numeric: tabular-nums; }
-.fr-dz-band.is-selected .fr-dz-band-head { background: #dfe6ff; color: var(--fr-accent); }
-.fr-dz-band-area { position: relative; background-image: radial-gradient(circle, #d3d9e3 .8px, transparent .9px); overflow: visible; }
-.fr-dz-band-resize { height: 5px; margin-top: -2px; position: relative; z-index: 3; cursor: ns-resize; }
-.fr-dz-band-resize:hover { background: var(--fr-accent); opacity: .5; }
-.fr-dz-hint { position: absolute; left: 8px; top: 50%; transform: translateY(-50%); color: #a6b0c0; font-size: 11px; pointer-events: none; white-space: nowrap; }
-.fr-dz-el { position: absolute; cursor: move; outline: 1px dashed rgba(35, 64, 245, .18); }
-.fr-dz-el:hover { outline-color: rgba(35, 64, 245, .55); }
-.fr-dz-el.is-selected { outline: 1.5px solid var(--fr-accent); z-index: 2; }
-.fr-dz-el.is-line { outline-offset: 2px; }
-.fr-dz-el > * { pointer-events: none; }
-.fr-dz-el > .fr-dz-h, .fr-dz-el > .fr-dz-inline { pointer-events: auto; }
-.fr-dz-text { position: absolute; inset: 0; display: flex; flex-direction: column; overflow: hidden; white-space: pre-wrap; word-break: break-all; }
-.fr-dz-text small { margin-left: 4px; font-size: 9px; color: #7a8599; font-weight: 400; }
-.fr-dz-expr { color: #1a2fc0; }
-.fr-dz-rect { position: absolute; inset: 0; }
-.fr-dz-svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
-.fr-dz-el img { width: 100%; height: 100%; display: block; }
-.fr-dz-ph { position: absolute; inset: 0; display: grid; place-items: center; background: repeating-linear-gradient(45deg, #f4f6fa, #f4f6fa 4px, #eceff5 4px, #eceff5 8px); color: #8a94a6; }
-.fr-dz-h { position: absolute; width: 8px; height: 8px; background: #fff; border: 1.5px solid var(--fr-accent); border-radius: 2px; z-index: 3; }
-.fr-dz-h-nw { left: -4px; top: -4px; cursor: nwse-resize; }
-.fr-dz-h-n { left: calc(50% - 4px); top: -4px; cursor: ns-resize; }
-.fr-dz-h-ne { right: -4px; top: -4px; cursor: nesw-resize; }
-.fr-dz-h-e { right: -4px; top: calc(50% - 4px); cursor: ew-resize; }
-.fr-dz-h-se { right: -4px; bottom: -4px; cursor: nwse-resize; }
-.fr-dz-h-s { left: calc(50% - 4px); bottom: -4px; cursor: ns-resize; }
-.fr-dz-h-sw { left: -4px; bottom: -4px; cursor: nesw-resize; }
-.fr-dz-h-w { left: -4px; top: calc(50% - 4px); cursor: ew-resize; }
-.fr-dz-marquee { position: absolute; border: 1px solid var(--fr-accent); background: rgba(35, 64, 245, .08); pointer-events: none; z-index: 4; }
-.fr-dz-inline { position: absolute; inset: 0; min-height: 24px; z-index: 5; font: 13px/1.4 var(--fr-font); padding: 2px 4px; border: 2px solid var(--fr-accent); resize: none; }
-.fr-dz-preview { flex: 1; min-height: 0; }
-.fr-dz-preview .fr-viewer { border: 0; border-radius: 0; }
-.fr-dz-json { flex: 1; min-height: 0; display: flex; flex-direction: column; }
-.fr-dz-json textarea { flex: 1; border: 0; padding: 14px 16px; font: 12.5px/1.55 ui-monospace, "Cascadia Code", Consolas, monospace; resize: none; outline: none; background: #fbfcfe; color: var(--fr-ink); }
-.fr-dz-json-bar { display: flex; justify-content: flex-end; align-items: center; gap: 12px; padding: 8px 12px; border-top: 1px solid var(--fr-rule); background: var(--fr-panel); }
-.fr-dz-json-err { color: #c8102e; font-size: 12px; }
-.fr-dz-props { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; padding: 4px 12px 24px; }
-.fr-dz-sec { grid-column: 1 / -1; margin: 12px 0 0; padding-top: 10px; border-top: 1px solid var(--fr-rule); font-size: 11px; letter-spacing: .04em; text-transform: uppercase; color: var(--fr-ink-2); }
-.fr-dz-sec:first-child { border-top: 0; margin-top: 4px; padding-top: 4px; }
-.fr-dz-prop { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
-.fr-dz-prop.is-wide { grid-column: 1 / -1; }
-.fr-dz-prop.is-check { flex-direction: row; align-items: center; gap: 6px; grid-column: 1 / -1; font-size: 12.5px; cursor: pointer; }
-.fr-dz-plabel { font-size: 11.5px; color: var(--fr-ink-2); font-weight: 600; }
-.fr-dz-prop input[type=text], .fr-dz-prop input[type=number], .fr-dz-prop select, .fr-dz-prop textarea { width: 100%; height: 28px; padding: 0 7px; border: 1px solid var(--fr-rule); border-radius: var(--fr-radius); font: inherit; font-size: 12.5px; color: var(--fr-ink); background: #fff; }
-.fr-dz-prop textarea { height: auto; padding: 5px 7px; font-family: ui-monospace, Consolas, monospace; resize: vertical; }
-.fr-dz-prop input.is-expr { font-family: ui-monospace, Consolas, monospace; }
-.fr-dz-prop :focus-visible { outline: 2px solid var(--fr-accent); outline-offset: 0; }
-.fr-dz-err { color: #c8102e; font-size: 11px; }
-.fr-dz-err:empty { display: none; }
-.fr-dz-color { display: flex; gap: 4px; }
-.fr-dz-color input[type=color] { width: 30px; height: 28px; padding: 1px; border: 1px solid var(--fr-rule); border-radius: var(--fr-radius); background: #fff; flex: none; }
-.fr-dz-toggles { display: flex; gap: 3px; flex-wrap: wrap; }
-.fr-dz-toggle { width: 30px; height: 28px; padding: 0; justify-content: center; border: 1px solid var(--fr-rule); font-weight: 700; }
-.fr-dz-toggle[aria-pressed="true"] { background: #dfe6ff; border-color: var(--fr-accent); color: var(--fr-accent); }
-@media (max-width: 960px) {
-  .fr-dz { grid-template-columns: 150px minmax(0, 1fr); }
-  .fr-dz-right { display: none; }
-}
+/* FreeReport viewer and designer. Override the --fr-* variables to theme. */
+.fr-viewer, .fr-designer {
+  --fr-bg: #e9ecf1;
+  --fr-panel: #ffffff;
+  --fr-ink: #0e1726;
+  --fr-ink-2: #4a5568;
+  --fr-rule: #d5dbe3;
+  --fr-accent: #2340f5;
+  --fr-accent-ink: #ffffff;
+  --fr-hover: #f1f3f7;
+  --fr-radius: 6px;
+  --fr-font: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, "Apple SD Gothic Neo", "Malgun Gothic", "Segoe UI", sans-serif;
+  display: flex; flex-direction: column; min-height: 0; height: 100%;
+  font: 13px/1.4 var(--fr-font); color: var(--fr-ink); background: var(--fr-bg);
+  border: 1px solid var(--fr-rule); border-radius: var(--fr-radius); overflow: hidden; box-sizing: border-box;
+}
+.fr-viewer *, .fr-designer * { box-sizing: border-box; }
+
+.fr-toolbar { display: flex; align-items: center; flex-wrap: wrap; gap: 2px; padding: 6px 8px; background: var(--fr-panel); border-bottom: 1px solid var(--fr-rule); }
+.fr-btn { display: inline-flex; align-items: center; gap: 5px; height: 30px; padding: 0 9px; border: 1px solid transparent; border-radius: var(--fr-radius); background: none; color: var(--fr-ink); font: inherit; font-weight: 500; cursor: pointer; white-space: nowrap; }
+.fr-btn:hover { background: var(--fr-hover); }
+.fr-btn:focus-visible, .fr-viewer select:focus-visible, .fr-viewer input:focus-visible { outline: 2px solid var(--fr-accent); outline-offset: 1px; }
+.fr-btn:disabled { opacity: .45; cursor: default; }
+.fr-btn.fr-icon { width: 30px; padding: 0; justify-content: center; }
+.fr-btn.fr-primary { background: var(--fr-accent); color: var(--fr-accent-ink); }
+.fr-btn.fr-primary:hover { filter: brightness(1.08); }
+.fr-btn[aria-expanded="true"], .fr-btn[aria-pressed="true"] { background: var(--fr-hover); border-color: var(--fr-rule); }
+.fr-btn svg { flex: none; }
+.fr-sep { width: 1px; height: 20px; margin: 0 6px; background: var(--fr-rule); }
+.fr-spacer { flex: 1; }
+.fr-pageno { display: inline-flex; align-items: center; gap: 4px; margin: 0 4px; color: var(--fr-ink-2); font-variant-numeric: tabular-nums; }
+.fr-pageno input { width: 44px; height: 28px; text-align: center; border: 1px solid var(--fr-rule); border-radius: var(--fr-radius); font: inherit; color: var(--fr-ink); }
+.fr-zoom { height: 30px; padding: 0 6px; border: 1px solid var(--fr-rule); border-radius: var(--fr-radius); background: var(--fr-panel); font: inherit; color: var(--fr-ink); }
+.fr-menu { position: relative; }
+.fr-menu-list { position: absolute; right: 0; top: calc(100% + 4px); z-index: 20; min-width: 180px; padding: 4px; background: var(--fr-panel); border: 1px solid var(--fr-rule); border-radius: var(--fr-radius); box-shadow: 0 8px 24px rgba(14, 23, 38, .14); display: flex; flex-direction: column; }
+.fr-menu-list[hidden] { display: none; }
+.fr-menu-list button { text-align: left; padding: 8px 10px; border: 0; background: none; border-radius: 4px; font: inherit; color: var(--fr-ink); cursor: pointer; }
+.fr-menu-list button:hover, .fr-menu-list button:focus-visible { background: var(--fr-hover); outline: none; }
+
+.fr-params { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 10px 14px; padding: 10px 12px; background: var(--fr-panel); border-bottom: 1px solid var(--fr-rule); }
+.fr-params[hidden] { display: none; }
+.fr-param { display: flex; flex-direction: column; gap: 3px; }
+.fr-param label { font-size: 12px; color: var(--fr-ink-2); font-weight: 600; }
+.fr-param label b { color: #c8102e; }
+.fr-param input, .fr-param select { height: 30px; min-width: 140px; padding: 0 8px; border: 1px solid var(--fr-rule); border-radius: var(--fr-radius); font: inherit; background: #fff; color: var(--fr-ink); }
+
+.fr-body { position: relative; flex: 1; min-height: 0; overflow: auto; outline: none; }
+.fr-pages { display: flex; flex-direction: column; align-items: center; gap: 16px; padding: 16px 24px 32px; min-width: min-content; }
+.fr-page { width: var(--fr-page-w, 794px); height: var(--fr-page-h, 1123px); flex: none; background: #fff; box-shadow: 0 1px 3px rgba(14, 23, 38, .18), 0 6px 18px -8px rgba(14, 23, 38, .25); }
+.fr-page-svg { display: block; width: 100%; height: 100%; }
+.fr-page { position: relative; }
+.fr-hit { position: absolute; background: rgba(242, 169, 0, .38); outline: 2px solid #f2a900; border-radius: 2px; pointer-events: none; }
+.fr-search { display: inline-flex; align-items: center; gap: 4px; height: 30px; padding: 0 8px; border: 1px solid var(--fr-rule); border-radius: var(--fr-radius); color: var(--fr-ink-2); background: var(--fr-panel); }
+.fr-search input { width: 120px; border: 0; outline: none; font: inherit; color: var(--fr-ink); background: none; }
+.fr-search:focus-within { border-color: var(--fr-accent); }
+.fr-search-count { font-size: 12px; white-space: nowrap; font-variant-numeric: tabular-nums; }
+.fr-empty { margin: 48px auto; color: var(--fr-ink-2); }
+.fr-overlay { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; gap: 10px; background: rgba(233, 236, 241, .72); font-weight: 600; color: var(--fr-ink-2); z-index: 5; }
+.fr-overlay[hidden] { display: none; }
+.fr-spinner { width: 18px; height: 18px; border: 2px solid var(--fr-rule); border-top-color: var(--fr-accent); border-radius: 50%; animation: fr-spin .8s linear infinite; }
+@keyframes fr-spin { to { transform: rotate(360deg); } }
+@media (prefers-reduced-motion: reduce) { .fr-spinner { animation-duration: 2.4s; } }
+.fr-status { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 4px 10px; background: var(--fr-panel); border-top: 1px solid var(--fr-rule); color: var(--fr-ink-2); font-size: 12px; font-variant-numeric: tabular-nums; min-height: 26px; }
+.fr-badge { color: var(--fr-ink-2); text-decoration: none; border: 1px solid var(--fr-rule); border-radius: 999px; padding: 0 8px; }
+.fr-badge[hidden] { display: none; }
+
+@media (max-width: 640px) {
+  .fr-btn span { display: none; }
+  .fr-btn { padding: 0 7px; }
+  .fr-pages { padding: 10px 8px 24px; }
+}
+@media print {
+  .fr-viewer .fr-toolbar, .fr-viewer .fr-status, .fr-viewer .fr-params { display: none; }
+}
+
+/* ── Designer ─────────────────────────────────── */
+.fr-designer { outline: none; }
+.fr-designer .fr-toolbar { gap: 1px; }
+.fr-designer .fr-group { display: inline-flex; align-items: center; gap: 1px; flex-wrap: wrap; }
+.fr-designer.is-preview .fr-design-only, .fr-designer.is-json .fr-design-only { display: none; }
+.fr-tabs { display: inline-flex; padding: 2px; background: var(--fr-bg); border-radius: 7px; }
+.fr-tab { height: 26px; padding: 0 12px; border: 0; border-radius: 5px; background: none; font: inherit; font-weight: 600; color: var(--fr-ink-2); cursor: pointer; }
+.fr-tab[aria-selected="true"] { background: var(--fr-panel); color: var(--fr-ink); box-shadow: 0 1px 2px rgba(14, 23, 38, .12); }
+.fr-zoom-label { min-width: 42px; text-align: center; font-variant-numeric: tabular-nums; color: var(--fr-ink-2); }
+.fr-dz { flex: 1; min-height: 0; display: grid; grid-template-columns: 200px minmax(0, 1fr) 270px; }
+.fr-designer.is-preview .fr-dz, .fr-designer.is-json .fr-dz { grid-template-columns: minmax(0, 1fr); }
+.fr-designer.is-preview .fr-dz-left, .fr-designer.is-preview .fr-dz-right, .fr-designer.is-json .fr-dz-left, .fr-designer.is-json .fr-dz-right { display: none; }
+.fr-dz-left, .fr-dz-right { background: var(--fr-panel); overflow: auto; min-height: 0; }
+.fr-dz-left { border-right: 1px solid var(--fr-rule); padding: 8px; }
+.fr-dz-right { border-left: 1px solid var(--fr-rule); }
+.fr-dz-left h3 { margin: 10px 4px 6px; font-size: 11px; letter-spacing: .04em; text-transform: uppercase; color: var(--fr-ink-2); }
+.fr-dz-left h3:first-child { margin-top: 2px; }
+.fr-dz-tools { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; }
+.fr-dz-tool { display: flex; align-items: center; gap: 6px; padding: 6px; word-break: keep-all; overflow-wrap: anywhere; border: 1px solid var(--fr-rule); border-radius: var(--fr-radius); background: var(--fr-panel); font: inherit; font-size: 12px; color: var(--fr-ink); cursor: grab; text-align: left; }
+.fr-dz-tool:hover, .fr-dz-field:hover { border-color: var(--fr-accent); color: var(--fr-accent); }
+.fr-dz-fields { display: flex; flex-wrap: wrap; gap: 4px; }
+.fr-dz-field { padding: 3px 8px; border: 1px solid var(--fr-rule); border-radius: 999px; background: #f7f9fc; font: 12px/1.4 ui-monospace, Consolas, monospace; color: var(--fr-ink); cursor: grab; max-width: 100%; overflow: hidden; text-overflow: ellipsis; }
+.fr-dz-empty { margin: 0 4px; color: var(--fr-ink-2); font-size: 12px; }
+.fr-dz-bandopt { display: flex; align-items: center; gap: 6px; padding: 2px 4px; font-size: 12.5px; cursor: pointer; }
+.fr-dz-groupopt { display: flex; align-items: center; justify-content: space-between; gap: 4px; padding: 2px 4px; font-size: 12px; }
+.fr-dz-groupopt code { font-size: 11.5px; }
+.fr-dz-addgroup { display: flex; gap: 4px; margin-top: 6px; }
+.fr-dz-addgroup select { flex: 1; min-width: 0; height: 30px; border: 1px solid var(--fr-rule); border-radius: var(--fr-radius); font: inherit; font-size: 12px; }
+.fr-dz-addgroup .fr-btn span { font-size: 12px; }
+.fr-dz-center { position: relative; min-width: 0; min-height: 0; display: flex; flex-direction: column; }
+.fr-dz-canvas { flex: 1; overflow: auto; padding: 24px 32px 64px; outline: none; }
+.fr-dz-canvas[hidden], .fr-dz-preview[hidden], .fr-dz-json[hidden] { display: none; }
+.fr-dz-page { margin: 0 auto; background: #fff; box-shadow: 0 1px 3px rgba(14, 23, 38, .16), 0 8px 24px -12px rgba(14, 23, 38, .3); user-select: none; }
+.fr-dz-band { position: relative; }
+.fr-dz-band-head { display: flex; justify-content: space-between; align-items: center; height: 20px; padding: 0 8px; background: #eef1f6; border-top: 1px solid var(--fr-rule); border-bottom: 1px solid var(--fr-rule); font-size: 11px; font-weight: 600; color: var(--fr-ink-2); cursor: pointer; }
+.fr-dz-band-head small { font-weight: 500; font-variant-numeric: tabular-nums; }
+.fr-dz-band.is-selected .fr-dz-band-head { background: #dfe6ff; color: var(--fr-accent); }
+.fr-dz-band-area { position: relative; background-image: radial-gradient(circle, #d3d9e3 .8px, transparent .9px); overflow: visible; }
+.fr-dz-band-resize { height: 5px; margin-top: -2px; position: relative; z-index: 3; cursor: ns-resize; }
+.fr-dz-band-resize:hover { background: var(--fr-accent); opacity: .5; }
+.fr-dz-hint { position: absolute; left: 8px; top: 50%; transform: translateY(-50%); color: #a6b0c0; font-size: 11px; pointer-events: none; white-space: nowrap; }
+.fr-dz-el { position: absolute; cursor: move; outline: 1px dashed rgba(35, 64, 245, .18); }
+.fr-dz-el:hover { outline-color: rgba(35, 64, 245, .55); }
+.fr-dz-el.is-selected { outline: 1.5px solid var(--fr-accent); z-index: 2; }
+.fr-dz-el.is-line { outline-offset: 2px; }
+.fr-dz-el > * { pointer-events: none; }
+.fr-dz-el > .fr-dz-h, .fr-dz-el > .fr-dz-inline { pointer-events: auto; }
+.fr-dz-text { position: absolute; inset: 0; display: flex; flex-direction: column; overflow: hidden; white-space: pre-wrap; word-break: break-all; }
+.fr-dz-text small { margin-left: 4px; font-size: 9px; color: #7a8599; font-weight: 400; }
+.fr-dz-expr { color: #1a2fc0; }
+.fr-dz-rect { position: absolute; inset: 0; }
+.fr-dz-svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
+.fr-dz-el img { width: 100%; height: 100%; display: block; }
+.fr-dz-ph { position: absolute; inset: 0; display: grid; place-items: center; background: repeating-linear-gradient(45deg, #f4f6fa, #f4f6fa 4px, #eceff5 4px, #eceff5 8px); color: #8a94a6; }
+.fr-dz-h { position: absolute; width: 8px; height: 8px; background: #fff; border: 1.5px solid var(--fr-accent); border-radius: 2px; z-index: 3; }
+.fr-dz-h-nw { left: -4px; top: -4px; cursor: nwse-resize; }
+.fr-dz-h-n { left: calc(50% - 4px); top: -4px; cursor: ns-resize; }
+.fr-dz-h-ne { right: -4px; top: -4px; cursor: nesw-resize; }
+.fr-dz-h-e { right: -4px; top: calc(50% - 4px); cursor: ew-resize; }
+.fr-dz-h-se { right: -4px; bottom: -4px; cursor: nwse-resize; }
+.fr-dz-h-s { left: calc(50% - 4px); bottom: -4px; cursor: ns-resize; }
+.fr-dz-h-sw { left: -4px; bottom: -4px; cursor: nesw-resize; }
+.fr-dz-h-w { left: -4px; top: calc(50% - 4px); cursor: ew-resize; }
+.fr-dz-marquee { position: absolute; border: 1px solid var(--fr-accent); background: rgba(35, 64, 245, .08); pointer-events: none; z-index: 4; }
+.fr-dz-inline { position: absolute; inset: 0; min-height: 24px; z-index: 5; font: 13px/1.4 var(--fr-font); padding: 2px 4px; border: 2px solid var(--fr-accent); resize: none; }
+.fr-dz-preview { flex: 1; min-height: 0; }
+.fr-dz-preview .fr-viewer { border: 0; border-radius: 0; }
+.fr-dz-json { flex: 1; min-height: 0; display: flex; flex-direction: column; }
+.fr-dz-json textarea { flex: 1; border: 0; padding: 14px 16px; font: 12.5px/1.55 ui-monospace, "Cascadia Code", Consolas, monospace; resize: none; outline: none; background: #fbfcfe; color: var(--fr-ink); }
+.fr-dz-json-bar { display: flex; justify-content: flex-end; align-items: center; gap: 12px; padding: 8px 12px; border-top: 1px solid var(--fr-rule); background: var(--fr-panel); }
+.fr-dz-json-err { color: #c8102e; font-size: 12px; }
+.fr-dz-props { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; padding: 4px 12px 24px; }
+.fr-dz-sec { grid-column: 1 / -1; margin: 12px 0 0; padding-top: 10px; border-top: 1px solid var(--fr-rule); font-size: 11px; letter-spacing: .04em; text-transform: uppercase; color: var(--fr-ink-2); }
+.fr-dz-sec:first-child { border-top: 0; margin-top: 4px; padding-top: 4px; }
+.fr-dz-prop { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
+.fr-dz-prop.is-wide { grid-column: 1 / -1; }
+.fr-dz-prop.is-check { flex-direction: row; align-items: center; gap: 6px; grid-column: 1 / -1; font-size: 12.5px; cursor: pointer; }
+.fr-dz-plabel { font-size: 11.5px; color: var(--fr-ink-2); font-weight: 600; }
+.fr-dz-prop input[type=text], .fr-dz-prop input[type=number], .fr-dz-prop select, .fr-dz-prop textarea { width: 100%; height: 28px; padding: 0 7px; border: 1px solid var(--fr-rule); border-radius: var(--fr-radius); font: inherit; font-size: 12.5px; color: var(--fr-ink); background: #fff; }
+.fr-dz-prop textarea { height: auto; padding: 5px 7px; font-family: ui-monospace, Consolas, monospace; resize: vertical; }
+.fr-dz-prop input.is-expr { font-family: ui-monospace, Consolas, monospace; }
+.fr-dz-prop :focus-visible { outline: 2px solid var(--fr-accent); outline-offset: 0; }
+.fr-dz-err { color: #c8102e; font-size: 11px; }
+.fr-dz-err:empty { display: none; }
+.fr-dz-color { display: flex; gap: 4px; }
+.fr-dz-color input[type=color] { width: 30px; height: 28px; padding: 1px; border: 1px solid var(--fr-rule); border-radius: var(--fr-radius); background: #fff; flex: none; }
+.fr-dz-toggles { display: flex; gap: 3px; flex-wrap: wrap; }
+.fr-dz-toggle { width: 30px; height: 28px; padding: 0; justify-content: center; border: 1px solid var(--fr-rule); font-weight: 700; }
+.fr-dz-toggle[aria-pressed="true"] { background: #dfe6ff; border-color: var(--fr-accent); color: var(--fr-accent); }
+@media (max-width: 960px) {
+  .fr-dz { grid-template-columns: 150px minmax(0, 1fr); }
+  .fr-dz-right { display: none; }
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@freereportjs/core",
-  "version": "0.1.0",
+  "version": "0.9.0",
   "description": "FreeReport — a web reporting engine (free for personal use): banded report designer, paged viewer, printing, PDF with embedded Korean fonts, Excel export.",
   "license": "SEE LICENSE IN LICENSE",
   "type": "module",