.canvas-header {
  padding: 10px;
  border: 1px solid transparent;
  border-radius: 5px;
  cursor: pointer;
}

.canvas-header:hover,
.canvas-header.selected {
  border-color: #a9a2f7;
  background: rgba(255, 255, 255, .72);
}

.canvas-header.selected { box-shadow: 0 0 0 2px rgba(101, 88, 232, .1); }

.canvas-header [contenteditable="true"] {
  outline: 2px solid var(--purple);
  outline-offset: 3px;
  background: rgba(255, 255, 255, .9);
  border-radius: 2px;
  cursor: text;
}

.header-setting { margin-top: 18px; }
.edit-hint { color: #9297a5; font-size: 10px; line-height: 1.6; margin: 0; }

.helper-text {
  color: #858b9a;
  font-size: 11px;
  line-height: 1.45;
  margin: -7px 0 10px;
}

.image-frame {
  align-items: center;
  background: #f5f4fb;
  border: 1px dashed #c9c6e7;
  border-radius: 5px;
  color: #7b76ad;
  display: flex;
  font-size: 11px;
  justify-content: center;
  min-height: 150px;
  overflow: hidden;
  position: relative;
}

.image-frame img { display: block; height: 100%; max-height: 300px; object-fit: cover; width: 100%; }
.image-frame .drawing-canvas { cursor: crosshair; height: 100%; inset: 0; position: absolute; touch-action: none; width: 100%; z-index: 1; }
.drawing-toolbar { align-items: center; background: #fff; border: 1px solid #ddddeb; border-radius: 7px; box-shadow: 0 7px 18px rgba(27, 32, 55, .14); display: flex; gap: 6px; padding: 6px; position: absolute; right: -211px; top: 12px; z-index: 3; }
.drawing-toolbar.collapsed { right: -39px; }
.drawing-toolbar-panel { align-items: center; display: flex; gap: 7px; max-width: 210px; opacity: 1; overflow: hidden; transition: max-width .2s ease, max-height .2s ease, opacity .15s ease; }
.drawing-toolbar.collapsed .drawing-toolbar-panel { max-width: 0; opacity: 0; pointer-events: none; }
.drawing-toolbar-actions { align-items: center; display: flex; flex: none; gap: 4px; }
.drawing-undo,.drawing-redo { align-items: center; background: #f5f4ff; border: 0; border-radius: 4px; color: var(--purple); cursor: pointer; display: flex; font-size: 15px; height: 26px; justify-content: center; padding: 0; width: 26px; }.drawing-undo:disabled,.drawing-redo:disabled { color: #bfc1cc; cursor: not-allowed; }
.drawing-tool { align-items: center; display: flex; gap: 6px; }
.drawing-toolbar.vertical { align-items: center; flex-direction: column; right: -96px; }
.drawing-toolbar.vertical .drawing-toolbar-actions { flex-direction: column; }
.drawing-toolbar.vertical .drawing-toolbar-panel { align-items: center; flex-direction: column; max-height: 190px; max-width: 40px; }
.drawing-toolbar.vertical.collapsed .drawing-toolbar-panel { max-height: 0; }
.drawing-toolbar.vertical .drawing-tool { flex-direction: column; }
.drawing-toolbar.vertical input[type="range"] { direction: rtl; height: 72px; width: 24px; writing-mode: vertical-lr; }
.drawing-toolbar label { color: #727789; font-family: 'DM Mono'; font-size: 8px; }.drawing-toolbar input[type="color"] { background: none; border: 0; height: 21px; padding: 0; width: 24px; }.drawing-toolbar input[type="range"] { accent-color: var(--purple); width: 62px; }
.toolbar-alignment { align-items: center; background: #f5f4ff; border: 0; border-radius: 4px; color: var(--purple); cursor: pointer; display: flex; font-size: 14px; height: 24px; justify-content: center; padding: 0; width: 24px; }.toolbar-alignment:hover { background: #e9e7ff; }
.drawing-toolbar-toggle { align-items: center; background: var(--purple); border: 0; border-radius: 4px; color: #fff; cursor: pointer; display: flex; flex: none; font-size: 14px; height: 26px; justify-content: center; padding: 0; width: 26px; }.drawing-toolbar-toggle:hover { filter: brightness(.94); }
.toolbar-grip { color: #a5a9b6; cursor: move; font-size: 15px; letter-spacing: -4px; line-height: 1; padding: 0 3px 0 0; user-select: none; }
.drawing-toolbar:not(.collapsed):before { color: #a5a9b6; content: '⠿'; cursor: move; font-size: 15px; letter-spacing: -4px; line-height: 1; padding-right: 3px; }
.icon-btn:disabled { color: #d2d4dc; cursor: not-allowed; }
.element-item[draggable="true"] { cursor: grab; }.element-item.dragging { opacity: .45; }
.element-item em { font-family: 'DM Mono'; font-size: 15px; letter-spacing: -4px; transform: rotate(90deg); }
.element-item > span:not(.element-icon) { flex:1 1 0; min-width:0; }
.element-item > span:not(.element-icon) :is(b,small) { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.element-item em.add-element { box-sizing:border-box; flex:0 0 22px; min-width:22px; min-height:22px; margin-left:0; padding:0; line-height:1; }
.element-item em.add-element { position:relative; color:transparent!important; }
.element-item em.add-element::before,.element-item em.add-element::after { content:''; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); background:var(--purple); border-radius:1px; }
.element-item em.add-element::before { width:10px; height:2px; }
.element-item em.add-element::after { width:2px; height:10px; }
.element-item em.add-element { align-items: center; border: 1px solid #dedfe8; border-radius: 4px; color: var(--purple); cursor: pointer; display: flex; font-family: 'Plus Jakarta Sans'; font-size: 16px; height: 22px; justify-content: center; letter-spacing: 0; opacity: 1; transform: none; width: 22px; }.element-item em.add-element:hover { background: #eeecff; }
.form-canvas.drop-ready { box-shadow: 0 0 0 3px rgba(101, 88, 232, .25), var(--shadow); }
.grid-snap-toggle { align-items: center; background: #fff; border: 1px solid var(--line); border-radius: 6px; color: #747a8c; cursor: pointer; display: flex; font: 600 10px 'Plus Jakarta Sans'; gap: 5px; height: 28px; margin-left: auto; margin-right: 9px; padding: 0 10px; }.grid-snap-toggle span { font: 15px 'DM Mono'; }.grid-snap-toggle[aria-pressed="true"] { background: #eeecff; border-color: #b7b1f2; color: var(--purple); }
.grid-snap-toggle + .canvas-controls { margin-left: 0; }
body:not(.preview-mode) .form-canvas.snap-grid:after { background-image: linear-gradient(to right,rgba(101,88,232,.12) 1px,transparent 1px),linear-gradient(to bottom,rgba(101,88,232,.12) 1px,transparent 1px); background-size: 16px 16px; content: ''; inset: 0; pointer-events: none; position: absolute; z-index: 0; }
.form-canvas.snap-grid .canvas-header,.form-canvas.snap-grid .canvas-element { z-index: 1; }
.drag-preview { background: #fffefb; border: 1px solid #a9a2f7; border-radius: 5px; box-shadow: 0 12px 28px rgba(34, 38, 65, .18); color: #303548; font: 11px 'Plus Jakarta Sans'; padding: 12px; pointer-events: none; position: fixed; width: 250px; z-index: 20; }.drag-preview b { display: block; font-size: 12px; margin-bottom: 10px; }.drag-preview .preview-line { background: #ececf2; border-radius: 3px; height: 27px; }.drag-preview .preview-lines { display: grid; gap: 7px; }.drag-preview .preview-choice { align-items: center; display: flex; gap: 7px; margin: 7px 0; }.drag-preview .preview-choice:before { border: 1px solid #a9adba; border-radius: 50%; content: ''; height: 10px; width: 10px; }.drag-preview .preview-image { align-items: center; background: #f2f1fb; color: #7772a9; display: flex; height: 90px; justify-content: center; }
.canvas-element { cursor: grab; }.canvas-element:active { cursor: grabbing; }.canvas-element input,.canvas-element textarea,.canvas-element select,.canvas-element button,.canvas-element [contenteditable="true"] { cursor: auto; }
.canvas-header { cursor: grab; }.canvas-header:active { cursor: grabbing; }.canvas-header [contenteditable="true"] { cursor: text; }
.canvas-element .drag-handle { display: none !important; }
.template-library { align-items: center; background: rgba(28, 31, 47, .45); display: flex; inset: 0; justify-content: center; padding: 24px; position: fixed; z-index: 12; }.template-library.hidden { display: none; }.template-library-card { background: #fff; border-radius: 12px; box-shadow: 0 28px 80px rgba(19, 23, 42, .25); max-width: 600px; padding: 25px; width: 100%; }.template-list { display: grid; gap: 9px; max-height: 420px; overflow-y: auto; }.template-card { align-items: center; background: #fbfbfd; border: 1px solid #e8e8ef; border-radius: 7px; display: flex; padding: 13px; }.template-card button:not(.template-remove) { background: transparent; border: 0; color: #31374a; cursor: pointer; font: 600 12px 'Plus Jakarta Sans'; text-align: left; width: 100%; }.template-card small { color: #9095a3; display: block; font-size: 10px; font-weight: 400; margin-top: 4px; }.template-remove { background: transparent; border: 0; color: #b4b7c0; cursor: pointer; font-size: 16px; }.template-empty { color: #9297a5; font-size: 12px; padding: 35px 0; text-align: center; }
.workspace-link { background: none; border: 0; color: #a0a4b1; cursor: pointer; font: inherit; padding: 0; }.workspace-link:hover { color: var(--purple); }.template-library-card { max-width: 760px; }.template-list { grid-template-columns: repeat(3, 1fr); gap: 12px; }.template-card { align-items: flex-start; min-height: 125px; padding: 14px; position: relative; }.template-card:before { background: linear-gradient(135deg,#eeeaff,#f9f8ff); border-radius: 4px; content: ''; height: 48px; left: 14px; position: absolute; right: 14px; top: 14px; }.template-card button:not(.template-remove) { padding-top: 60px; position: relative; z-index: 1; }.template-remove { position: absolute; right: 7px; top: 5px; z-index: 2; }
body.preview-mode .left-panel,body.preview-mode .right-panel,body.preview-mode .workspace-toolbar,body.preview-mode .quick-delete,body.preview-mode .resize-handle { display: none !important; }body.preview-mode .app-shell { grid-template-columns: 1fr; }body.preview-mode .topbar { grid-column: 1; }body.preview-mode .canvas-area { background: #f5f5f8; padding-top: 55px; }body.preview-mode .canvas-element,body.preview-mode .canvas-element:hover,body.preview-mode .canvas-element.selected,body.preview-mode .canvas-header,body.preview-mode .canvas-header:hover,body.preview-mode .canvas-header.selected { background: transparent !important; border-color: transparent !important; box-shadow: none !important; cursor: default; }body.preview-mode .form-canvas { box-shadow: 0 18px 50px rgba(33,38,66,.11); }
body.preview-mode .top-actions > :not(#previewBtn):not(#publishBtn):not(#highlightFieldsBtn):not(.account-menu),body.preview-mode .breadcrumb { display: none; }body.preview-mode .top-actions { margin-left: auto; }body:not(.preview-mode) #publishBtn { display: none; }
body.preview-mode:not(.form-draft) #publishBtn { display: none; }
.preview-workspace-back { align-items: center; background: transparent; border: 0; border-radius: 6px; color: #626879; cursor: pointer; display: none; font: 600 11px 'Plus Jakarta Sans'; gap: 6px; margin-right: 18px; padding: 8px 9px; }.preview-workspace-back:hover { background: #f3f2fb; color: var(--purple); }body.preview-mode .preview-workspace-back { display: flex; }body.preview-mode .preview-workspace-back + .brand { width: auto; }
.workspace-view { background: #f7f7fa; min-height: 100vh; }.workspace-view.hidden { display: none; }.workspace-top { align-items: center; background: #fff; border-bottom: 1px solid #e9eaf0; display: flex; height: 64px; padding: 0 28px; }.workspace-top .brand { width: auto; }.workspace-top > span { color: #777d8d; font-size: 12px; margin-left: 25px; padding-left: 25px; position: relative; }.workspace-top > span:before { background: #e4e5ea; content: ''; height: 19px; left: 0; position: absolute; top: -3px; width: 1px; }.workspace-gallery { margin: 0 auto; max-width: 1120px; padding: 60px 32px; }.workspace-title h1 { font-size: 32px; letter-spacing: -1px; margin: 10px 0 8px; }.workspace-title p { color: #7c8291; font-size: 13px; margin: 0; }.workspace-tiles { display: grid; gap: 20px; grid-template-columns: repeat(auto-fill,minmax(240px,1fr)); margin-top: 34px; }.workspace-tile { background: #fff; border: 1px solid #e6e7ed; border-radius: 9px; box-shadow: 0 7px 20px rgba(34,38,65,.05); cursor: pointer; overflow: hidden; padding: 0; text-align: left; transition: transform .18s,box-shadow .18s; }.workspace-tile:hover { box-shadow: 0 12px 28px rgba(34,38,65,.12); transform: translateY(-3px); }.tile-preview { background: #ececf2; height: 150px; overflow: hidden; position: relative; }.thumbnail-paper { background: #fffefb; height: 780px; pointer-events: none; position: absolute; transform: scale(.32); transform-origin: top left; width: 640px; }.tile-info { padding: 14px; }.tile-info b { color: #343a4d; font-size: 12px; }.tile-info small { color: #9297a5; display: block; font-size: 10px; margin-top: 5px; }.workspace-empty { color: #9297a5; font-size: 13px; grid-column: 1/-1; padding: 60px 0; text-align: center; }
.workspace-top select { border: 0; border-left: 1px solid #e4e5ea; color: #555b6c; font: 600 12px 'Plus Jakarta Sans'; margin-left: 25px; outline: 0; padding: 5px 28px 5px 16px; }.rename-workspace,.new-workspace { background: transparent; border: 0; color: #7d8291; cursor: pointer; font: 12px 'Plus Jakarta Sans'; }.rename-workspace { font-size: 15px; margin-left: 2px; }.new-workspace { border-left: 1px solid #e4e5ea; display: none; padding-left: 18px; }.workspace-view.choosing .new-workspace { display: block; margin-left: auto; }
.all-workspaces { background: transparent; border: 0; color: #7d8291; cursor: pointer; font: 12px 'Plus Jakarta Sans'; margin-left: 22px; }.workspace-view.choosing .all-workspaces,.workspace-view.choosing #workspaceSelector,.workspace-view.choosing .rename-workspace { display: none; }
.workspace-settings-btn { background: #fff; border: 1px solid #dedfe7; border-radius: 6px; color: #676d7d; cursor: pointer; font: 600 11px 'Plus Jakarta Sans'; padding: 9px 11px; position: absolute; right: 135px; top: 5px; }.workspace-view.choosing .workspace-settings-btn { display: none; }.workspace-customizer { background: #fff; border: 1px solid #e5e6ed; border-radius: 8px; box-shadow: 0 10px 24px rgba(34,38,65,.08); display: grid; gap: 7px; margin: 21px 0 -8px; max-width: 470px; padding: 14px; }.workspace-customizer.hidden { display: none; }.workspace-customizer label { color: #848a99; font: 9px 'DM Mono'; letter-spacing: .7px; }.workspace-customizer textarea { border: 1px solid #e0e1e8; border-radius: 5px; font: 11px 'Plus Jakarta Sans'; height: 56px; outline: none; padding: 8px; resize: none; }.workspace-customizer input { height: 28px; width: 48px; }.workspace-title h1 { color: var(--workspace-color,var(--purple)); }.workspace-choice { border-top: 3px solid var(--tile-color,var(--purple)); }
.workspace-settings-btn { display: none; }.workspace-choice { border-left: 5px solid var(--tile-color,var(--purple)); }.workspace-menu-description { color: #848a99; display: grid; font: 9px 'DM Mono'; gap: 5px; letter-spacing: .5px; padding: 7px 8px 4px; }.workspace-menu-description textarea { border: 1px solid #e1e2e9; border-radius: 4px; font: 10px 'Plus Jakarta Sans'; height: 42px; outline: none; padding: 5px; resize: none; width: 100%; }
.workspace-choice { border-left-color: var(--tile-color,var(--purple)) !important; box-shadow: inset 5px 0 0 var(--tile-color,var(--purple)),0 7px 20px rgba(34,38,65,.05); }.workspace-choice:hover { box-shadow: inset 5px 0 0 var(--tile-color,var(--purple)),0 12px 28px rgba(34,38,65,.12); }
.workspace-customizer label:nth-of-type(2),.workspace-customizer #workspaceColor { display: none; }.workspace-menu-color { align-items: center; color: #848a99; display: flex; font: 9px 'DM Mono'; justify-content: space-between; letter-spacing: .5px; padding: 7px 8px 4px; }.workspace-menu-color input { border: 0; height: 22px; padding: 0; width: 28px; }
.workspace-title { position: relative; }.create-new { position: absolute; right: 0; top: 5px; z-index: 12; }.create-new-trigger { align-items: center; background: var(--workspace-color,var(--purple)); border: 0; border-radius: 6px; color: #fff; cursor: pointer; display: flex; font: 600 11px 'Plus Jakarta Sans'; padding: 10px 13px; transition: filter .18s ease,transform .18s ease; }.create-new-trigger:hover { filter: brightness(.92); transform: translateY(-1px); }.create-new-menu { background: #fff; border: 1px solid #e1e3e9; border-radius: 9px; box-shadow: 0 14px 34px rgba(34,38,65,.16); display: grid; gap: 3px; opacity: 0; padding: 6px; pointer-events: none; position: absolute; right: 0; top: calc(100% + 8px); transform: translateY(-8px) scale(.97); transform-origin: top right; transition: opacity .18s ease,transform .22s cubic-bezier(.2,.8,.2,1),visibility .18s; visibility: hidden; width: 220px; }.create-new.open .create-new-menu { opacity: 1; pointer-events: auto; transform: translateY(0) scale(1); visibility: visible; }.create-new-menu button { background: transparent; border: 0; border-radius: 6px; color: #353b4c; cursor: pointer; display: grid; font-family: 'Plus Jakarta Sans'; gap: 2px 9px; grid-template-columns: 30px 1fr; padding: 10px; text-align: left; }.create-new-menu button:hover,.create-new-menu button:focus-visible { background: color-mix(in srgb,var(--workspace-color,var(--purple)) 9%,white); outline: none; }.create-new-menu button > span { align-items: center; color: var(--workspace-color,var(--purple)); display: flex; font-size: 18px; grid-row: 1/3; justify-content: center; }.create-new-menu b { font-size: 11px; }.create-new-menu small { color: #8a909d; font-size: 9px; }
.workspace-chooser { margin: 0 auto; max-width: 850px; padding: 92px 32px; }.workspace-chooser.hidden { display: none; }.workspace-chooser h1 { font-size: 34px; letter-spacing: -1px; margin: 10px 0 8px; }.workspace-chooser > p { color: #7c8291; font-size: 13px; margin: 0; }.workspace-choice-grid { display: grid; gap: 15px; grid-template-columns: repeat(auto-fill,minmax(210px,1fr)); margin-top: 34px; }.workspace-choice { background: #fff; border: 1px solid #e5e6ec; border-radius: 8px; color: #3e4558; cursor: pointer; font: 600 13px 'Plus Jakarta Sans'; min-height: 118px; padding: 18px; text-align: left; transition: .18s; }.workspace-choice:hover { border-color: #aaa4ed; box-shadow: 0 10px 24px rgba(34,38,65,.09); transform: translateY(-2px); }.workspace-choice small { color: #9398a5; display: block; font-size: 10px; font-weight: 400; margin-top: 8px; }.workspace-choice.new { align-items: center; border-style: dashed; color: var(--purple); display: flex; justify-content: center; text-align: center; }
.workspace-choice { padding: 0; position: relative; }.workspace-choice-open { background: transparent; border: 0; color: #3e4558; cursor: pointer; font: 600 13px 'Plus Jakarta Sans'; min-height: 118px; padding: 18px; text-align: left; width: 100%; }.workspace-choice-menu { background: transparent; border: 0; color: #747a8a; cursor: pointer; font-size: 17px; position: absolute; right: 8px; top: 7px; }.workspace-choice-panel { background: #fff; border: 1px solid #e5e6ed; border-radius: 6px; box-shadow: 0 8px 20px rgba(33,38,66,.15); display: none; padding: 4px; position: absolute; right: 8px; top: 34px; width: 105px; z-index: 3; }.workspace-choice.menu-open .workspace-choice-panel { display: block; }.workspace-choice-panel button { background: none; border: 0; border-radius: 4px; color: #565c6d; cursor: pointer; font: 11px 'Plus Jakarta Sans'; padding: 8px; text-align: left; width: 100%; }.workspace-choice-panel button:hover { background: #f4f3ff; }.workspace-choice-panel button[data-workspace-action="delete"] { color: #cf5e5b; }.workspace-choice[draggable="true"] { cursor: grab; }.workspace-choice.choice-dragging { opacity: .42; }.workspace-choice.choice-drop-target { outline: 2px solid var(--purple); outline-offset: 3px; }
.palette-info { background: #f7f6ff; border-radius: 7px; color: #5f6678; font-size: 11px; line-height: 1.65; padding: 13px; }.palette-info b { color: #33394b; display: block; font-size: 13px; margin-bottom: 5px; }.palette-info p { margin: 0; }.palette-info small { color: #9196a5; display: block; margin-top: 13px; }
.workspace-tile { text-align: left; }.workspace-tile > img { display: block; height: 178px; object-fit: cover; width: 100%; }.workspace-tile .tile-preview,.workspace-tile .tile-info { display: none; }
.workspace-tile { position: relative; }.workspace-open { background: transparent; border: 0; cursor: pointer; display: block; padding: 0; width: 100%; }.workspace-open img { display: block; height: 178px; object-fit: cover; width: 100%; }.tile-menu { align-items: center; background: rgba(255,255,255,.92); border: 0; border-radius: 5px; color: #616778; cursor: pointer; display: flex; font-size: 18px; height: 27px; justify-content: center; line-height: 1; position: absolute; right: 8px; top: 8px; width: 28px; }.tile-menu:hover { background: #fff; }.tile-menu-panel { background: #fff; border: 1px solid #e6e6ed; border-radius: 6px; box-shadow: 0 8px 20px rgba(33,38,66,.15); display: none; padding: 4px; position: absolute; right: 8px; top: 39px; width: 135px; z-index: 3; }.workspace-tile.menu-open .tile-menu-panel { display: block; }.tile-menu-panel button { background: none; border: 0; border-radius: 4px; color: #505668; cursor: pointer; font: 11px 'Plus Jakarta Sans'; padding: 8px; text-align: left; width: 100%; }.tile-menu-panel button:hover { background: #f4f3ff; }.tile-menu-panel button[data-action="delete"] { color: #cf5e5b; }
.workspace-tile[draggable="true"] { cursor: grab; }.workspace-tile.tile-dragging { opacity: .42; }.workspace-tile.tile-drop-target { outline: 2px solid var(--purple); outline-offset: 3px; }
.toast.toast-top { bottom: auto; top: 24px; transform: translate(-50%,-20px); }.toast.toast-top.show { transform: translate(-50%,0); }
.toast { z-index: 50; }.workspace-tile .tile-name { color: #3d4355; display: block; font: 600 12px 'Plus Jakarta Sans'; padding: 11px 12px 12px; }
.drawing-controls { background: #f7f6ff; border-radius: 7px; margin-top: 16px; padding: 11px; }
.drawing-controls .check-row { margin: 0 0 12px; }.drawing-controls .check-row:last-child { margin-bottom: 0; }
.brush-row { align-items: center; display: flex; gap: 10px; }.brush-row label { color: #73798a; font-size: 10px; min-width: 38px; }.brush-row input[type="color"] { background: transparent; border: 0; height: 24px; padding: 0; width: 29px; }.brush-row input[type="range"] { accent-color: var(--purple); width: 100%; }
.toolbar-layout-label { margin-top: 13px; }
.image-frame.has-image { background: transparent; border-style: solid; }
.canvas-element[data-type="image"] .image-frame { height: 100%; min-height: 0; }
.upload-button { cursor: pointer; display: block; margin-bottom: 15px; }
.upload-button input { display: none; }

.resize-handle {
  background: linear-gradient(135deg, transparent 0 35%, var(--purple) 36% 48%, transparent 49% 58%, var(--purple) 59% 71%, transparent 72%);
  bottom: -7px;
  cursor: nwse-resize;
  display: none;
  height: 16px;
  position: absolute;
  right: -7px;
  width: 16px;
  z-index: 2;
}

.canvas-element:hover .resize-handle,
.canvas-element.selected .resize-handle { display: block; }
:is(.canvas-element,.editable-region)[data-font-size],:is(.canvas-element,.editable-region)[data-font-size] :is(label,input,textarea,select,button,p,h1,h2,h3,span,small,output,strong,b,em,a,td,th) { font-size:var(--element-font-size)!important; }
:is(.canvas-element,.editable-region)[data-font-weight],:is(.canvas-element,.editable-region)[data-font-weight] :is(label,input,textarea,select,button,p,h1,h2,h3,span,small,output,strong,b,em,a,td,th) { font-weight:var(--element-font-weight)!important; }
:is(.canvas-element,.editable-region)[data-font-style],:is(.canvas-element,.editable-region)[data-font-style] :is(label,input,textarea,select,button,p,h1,h2,h3,span,small,output,strong,b,em,a,td,th) { font-style:var(--element-font-style)!important; }
:is(.canvas-element,.editable-region)[data-font-color],:is(.canvas-element,.editable-region)[data-font-color] :is(label,input,textarea,select,button,p,h1,h2,h3,span,small,output,strong,b,em,a,td,th) { color:var(--element-color)!important; }
.canvas-element[data-resized="true"] { min-width:0; min-height:0; }
:is(.canvas-element,.editable-region)[data-font-decoration] :is(label,input,textarea,select,button,p,h1,h2,h3,span,small,output,strong,b,em,a,td,th) { text-decoration-line:var(--element-text-decoration-line)!important; }
.text-style-toggles { display:flex; gap:18px; margin-top:14px; font-size:12px; }
.group-selection-controls button:disabled { opacity:.4; cursor:not-allowed; filter:grayscale(1); }
body.auth-locked > :not(.login-screen):not(script) { display:none!important; }
body.auth-locked .login-screen { display:flex!important; }
#authStatus { font-size:12px; line-height:1.5; }
.cloud-controls { display:flex; align-items:center; flex-wrap:wrap; gap:8px; padding:10px 24px; background:var(--panel,#fff); border-bottom:1px solid var(--line); font-size:11px; }
.cloud-controls > span { flex:1; min-width:180px; }
.cloud-controls button { padding:6px 10px; border:1px solid var(--line); border-radius:5px; background:var(--panel,#fff); color:var(--ink); cursor:pointer; font:inherit; }
.cloud-controls [hidden] { display:none!important; }
.cloud-editor-status { margin-left:auto; max-width:260px; font-size:10px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.text-style-toggles label { display:flex; align-items:center; gap:5px; cursor:pointer; }
#formCanvas .canvas-element :is(button:not(.quick-delete):not(.has-reading),[role="button"],input[type="button"],input[type="submit"]) { background:var(--button-background,var(--purple))!important; border-color:var(--button-background,var(--purple))!important; color:var(--element-color,#fff)!important; }
/* Keep resized content inside its box, with resize controls still reachable. */
:is(.canvas-element,.editable-region)[data-resized="true"] { overflow:hidden; }
:is(.canvas-element,.editable-region)[data-resized="true"] :is(label,p,h1,h2,h3,button,input,select,output) { min-width:0; max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; box-sizing:border-box; }
:is(.canvas-element,.editable-region)[data-resized="true"] > .resize-handle[data-scale-axis="both"] { right:0; bottom:0; }
:is(.canvas-element,.editable-region)[data-resized="true"] > .resize-handle[data-scale-axis="x"] { right:0; }
:is(.canvas-element,.editable-region)[data-resized="true"] > .resize-handle[data-scale-axis="y"] { bottom:0; }
.canvas-element[data-resized="true"] > .quick-delete { right:0; top:0; }
.canvas-element[data-resized="true"] > .drag-handle { left:0; }
.editable-region:hover > .resize-handle,.pdf-page-background:hover > .resize-handle { display:block; }
.resize-handle[data-scale-axis="x"] { top:50%; bottom:auto; right:-6px; width:10px; height:16px; margin-top:-8px; background:var(--purple); border:2px solid white; border-radius:3px; cursor:ew-resize; }
.resize-handle[data-scale-axis="y"] { left:50%; right:auto; bottom:-6px; width:16px; height:10px; margin-left:-8px; background:var(--purple); border:2px solid white; border-radius:3px; cursor:ns-resize; }

.image-browser { align-items: center; background: rgba(28, 31, 47, .45); display: flex; inset: 0; justify-content: center; padding: 24px; position: fixed; z-index: 10; }
.image-browser.hidden { display: none; }
.image-browser-card { background: #fff; border-radius: 12px; box-shadow: 0 28px 80px rgba(19, 23, 42, .25); max-width: 710px; padding: 25px; width: 100%; }
.image-browser-head { align-items: flex-start; display: flex; justify-content: space-between; }
.image-browser-head h2 { font-size: 21px; letter-spacing: -.5px; margin: 6px 0 18px; }
.image-browser-head button { background: #f3f3f7; border: 0; border-radius: 50%; color: #6e7382; cursor: pointer; font-size: 20px; height: 28px; line-height: 1; width: 28px; }
.image-search { align-items: center; border: 1px solid #dedfe7; border-radius: 6px; display: flex; gap: 8px; padding: 0 10px; }
.image-search span { color: #858b9a; font-size: 19px; }
.image-search input { border: 0; font: 12px 'Plus Jakarta Sans'; height: 38px; outline: 0; width: 100%; }
.image-filters { display: flex; gap: 7px; margin: 14px 0; }
.image-filters button { background: #f5f5f8; border: 0; border-radius: 20px; color: #6d7282; cursor: pointer; font: 11px 'Plus Jakarta Sans'; padding: 7px 11px; }
.image-filters button.active { background: #eceafd; color: var(--purple); font-weight: 700; }
.image-grid { display: grid; gap: 9px; grid-template-columns: repeat(3, 1fr); max-height: 354px; overflow-y: auto; }
.library-image { border: 0; border-radius: 6px; cursor: pointer; height: 112px; overflow: hidden; padding: 0; position: relative; }
.library-image img { height: 100%; object-fit: cover; transition: transform .2s; width: 100%; }
.library-image:hover img { transform: scale(1.06); }.library-image span { background: linear-gradient(transparent,rgba(0,0,0,.65)); bottom: 0; color: white; font-size: 10px; left: 0; padding: 22px 8px 7px; position: absolute; text-align: left; width: 100%; }
.library-note { color: #9297a5; font-size: 10px; margin: 15px 0 0; }
body.preview-mode .drawing-toolbar:before { cursor: default; visibility: hidden; }
.workspace-choice { background-color: #fff; background-image: linear-gradient(var(--tile-color,var(--purple)),var(--tile-color,var(--purple))); background-position: left top; background-repeat: no-repeat; background-size: 5px 100%; border-left: 1px solid #e5e6ec !important; box-shadow: 0 7px 20px rgba(34,38,65,.05); transition: background-size .18s ease,border-color .18s ease,box-shadow .18s ease,transform .18s ease; }
.workspace-choice:hover { background-size: 11px 100%; box-shadow: 0 12px 28px rgba(34,38,65,.12); }
.workspace-folder-section { margin-top: 31px; }.folder-heading { align-items: center; display: flex; margin-bottom: 11px; }.folder-heading button { background: transparent; border: 0; color: var(--workspace-color,var(--purple)); cursor: pointer; font: 600 10px 'Plus Jakarta Sans'; margin-left: auto; }.workspace-folders { display: grid; gap: 11px; grid-template-columns: repeat(auto-fill,minmax(205px,1fr)); }.workspace-folder { align-items: center; background: #fff; border: 1px solid #e5e6ec; border-radius: 8px; display: flex; gap: 11px; min-height: 76px; padding: 13px; }.folder-icon { align-items: center; background: color-mix(in srgb,var(--workspace-color,var(--purple)) 13%,white); border-radius: 6px; color: var(--workspace-color,var(--purple)); display: flex; flex: none; font: 700 9px 'DM Mono'; height: 38px; justify-content: center; width: 42px; }.workspace-folder b,.workspace-folder small,.workspace-folder em { display: block; }.workspace-folder b { color: #3e4455; font-size: 11px; }.workspace-folder small { color: #9398a5; font-size: 9px; margin-top: 3px; }.workspace-folder em { color: #a1a5b1; font-size: 8px; font-style: normal; margin-top: 5px; max-width: 145px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.workspace-tiles { margin-top: 24px; }.button-action-note { margin-top: 8px; }
.workspace-spotlight { margin-top: 31px; }.workspace-spotlight.hidden { display: none; }.spotlight-heading { align-items: baseline; display: flex; gap: 9px; margin-bottom: 11px; }.spotlight-heading small { color: #a0a5b1; font: 8px 'DM Mono'; letter-spacing: .7px; }.spotlight-list { display: grid; gap: 12px; grid-template-columns: repeat(auto-fill,minmax(245px,1fr)); }.spotlight-card { background: #fff; border: 1px solid color-mix(in srgb,var(--workspace-color,var(--purple)) 30%,#d2d4dd); border-radius: 9px; box-shadow: 0 4px 14px rgba(31,36,55,.08); min-height: 82px; overflow: hidden; position: relative; }.spotlight-card:before { background: var(--workspace-color,var(--purple)); content: ''; inset: 0 auto 0 0; position: absolute; width: 4px; }.spotlight-open { align-items: center; background: transparent; border: 0; cursor: pointer; display: flex; gap: 12px; padding: 10px 38px 10px 13px; text-align: left; width: 100%; }.spotlight-open img { border: 1px solid #e0e2e8; border-radius: 4px; height: 60px; object-fit: cover; width: 88px; }.spotlight-open b,.spotlight-open small { display: block; }.spotlight-open b { color: #3d4355; font: 700 11px 'Plus Jakarta Sans'; }.spotlight-open small { color: #969ba8; font: 9px 'Plus Jakarta Sans'; margin-top: 5px; }.spotlight-remove { background: transparent; border: 0; border-radius: 4px; color: #8d929f; cursor: pointer; font-size: 17px; line-height: 1; padding: 4px 7px; position: absolute; right: 7px; top: 7px; }.spotlight-remove:hover { background: #f0eff5; color: #bf5656; }
.workspace-gallery > .workspace-tiles { display: none; }
.workspace-folder { position: relative; }.folder-delete { align-items: center; background: transparent; border: 0; border-radius: 50%; color: #a3a7b2; cursor: pointer; display: flex; font-size: 16px; height: 25px; justify-content: center; margin-left: auto; opacity: 0; width: 25px; }.workspace-folder:hover .folder-delete,.folder-delete:focus-visible { opacity: 1; }.folder-delete:hover { background: #fff0ef; color: #c95757; }
.workspace-folder { flex-wrap: wrap; }.folder-open { align-items: center; background: transparent; border: 0; color: inherit; cursor: pointer; display: flex; flex: 1; gap: 11px; min-width: 0; padding: 0; text-align: left; }.folder-open > span:last-child { min-width: 0; }.folder-open[aria-expanded="true"] .folder-icon { box-shadow: 0 0 0 2px color-mix(in srgb,var(--workspace-color,var(--purple)) 30%,transparent); }.folder-contents { border-top: 1px solid #ececf1; flex-basis: 100%; margin-top: 2px; padding-top: 8px; }.folder-contents.hidden { display: none; }.folder-contents a,.folder-placeholder { align-items: center; border-radius: 5px; color: #4b5263; display: grid; font-size: 9px; gap: 2px 8px; grid-template-columns: 34px 1fr auto; padding: 8px; text-decoration: none; }.folder-contents a:hover { background: #f3f2fb; color: var(--workspace-color,var(--purple)); }.folder-contents a > span,.folder-placeholder > span { color: var(--workspace-color,var(--purple)); font: 700 8px 'DM Mono'; grid-row: 1/3; }.folder-contents a small,.folder-placeholder small { color: #989da9; font-size: 8px; }.folder-contents p { color: #989da9; font-size: 9px; margin: 5px 8px; }
.folder-file { align-items: center; border-radius: 5px; display: flex; gap: 5px; padding: 5px 6px; }.folder-file:hover { background: #f3f2fb; }.folder-file-info { align-items: center; display: grid; flex: 1; font-size: 9px; gap: 2px 8px; grid-template-columns: 34px 1fr; min-width: 0; }.folder-file-info > span { color: var(--workspace-color,var(--purple)); font: 700 8px 'DM Mono'; grid-row: 1/3; }.folder-file-info b { color: #4b5263; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.folder-file-info small { color: #989da9; font-size: 8px; }.folder-view,.folder-download { background: #fff; border: 1px solid #dedfe6; border-radius: 5px; color: #555c6d; cursor: pointer; font: 700 8px 'DM Sans'; padding: 6px 8px; text-decoration: none; }.folder-view:hover,.folder-download:hover { border-color: var(--workspace-color,var(--purple)); color: var(--workspace-color,var(--purple)); }.folder-item-delete { align-items: center; background: transparent; border: 0; border-radius: 50%; color: #a3a7b2; cursor: pointer; display: flex; flex: 0 0 25px; font-size: 16px; height: 25px; justify-content: center; opacity: 0; }.folder-file:hover .folder-item-delete,.folder-item-delete:focus-visible { opacity: 1; }.folder-item-delete:hover { background: #fff0ef; color: #c95757; }
.pdf-viewer { align-items: center; background: rgba(18,22,33,.62); display: flex; inset: 0; justify-content: center; padding: 22px; position: fixed; z-index: 120; }.pdf-viewer.hidden { display: none; }.pdf-viewer-card { background: #f5f5f7; border-radius: 12px; box-shadow: 0 28px 90px rgba(0,0,0,.3); display: flex; flex-direction: column; height: min(900px,94vh); overflow: hidden; width: min(1040px,94vw); }.pdf-viewer-card header { align-items: center; background: #fff; border-bottom: 1px solid #dedfe5; display: flex; justify-content: space-between; padding: 14px 17px; }.pdf-viewer-card header h2 { font-size: 14px; margin: 3px 0 0; }.pdf-viewer-card header > div:last-child { align-items: center; display: flex; gap: 8px; }.pdf-viewer-card header a { background: var(--workspace-color,var(--purple)); border-radius: 6px; color: #fff; font-size: 10px; font-weight: 700; padding: 8px 12px; text-decoration: none; }.pdf-viewer-card header button { background: #eef0f4; border: 0; border-radius: 50%; color: #5e6472; cursor: pointer; font-size: 19px; height: 30px; width: 30px; }.pdf-viewer-card iframe { background: #dfe1e6; border: 0; flex: 1; width: 100%; }
.workspace-tile { border-color: #cfd2dc; box-shadow: 0 2px 4px rgba(31,36,55,.08),0 10px 24px rgba(31,36,55,.08); }.workspace-tile:hover { border-color: color-mix(in srgb,var(--workspace-color,var(--purple)) 52%,#cfd2dc); box-shadow: 0 4px 8px rgba(31,36,55,.10),0 16px 34px rgba(31,36,55,.15); }.workspace-tile .tile-name { background: #fff; border-top: 1px solid #dfe1e8; font-weight: 700; }.workspace-choice { border-color: #cfd2dc; box-shadow: 0 2px 4px rgba(31,36,55,.08),0 10px 24px rgba(31,36,55,.08); }.workspace-folder { border-color: #d2d4dd; box-shadow: 0 2px 5px rgba(31,36,55,.07); }
html[data-theme="dark"] .workspace-tile,html[data-theme="dark"] .workspace-choice,html[data-theme="dark"] .workspace-folder { border-color: #4a5062; box-shadow: 0 3px 10px rgba(0,0,0,.28); }html[data-theme="dark"] .workspace-tile .tile-name { background: #232735; border-top-color: #404657; }
html[data-theme="dark"] .spotlight-card { background: #232735; border-color: color-mix(in srgb,var(--workspace-color,var(--purple)) 45%,#4a5062); }html[data-theme="dark"] .spotlight-open b { color: #eef0f6; }html[data-theme="dark"] .spotlight-open img { border-color: #454b5d; }html[data-theme="dark"] .spotlight-remove:hover { background: #343949; }
.database-create { background: color-mix(in srgb,var(--workspace-color,var(--purple)) 9%,white); border: 1px dashed color-mix(in srgb,var(--workspace-color,var(--purple)) 45%,#ddd); border-radius: 5px; color: var(--workspace-color,var(--purple)); cursor: pointer; font: 700 9px 'Plus Jakarta Sans'; margin: 3px 5px 7px; padding: 8px; width: calc(100% - 10px); }.database-view { background: #fff; border: 1px solid #dedfe6; border-radius: 5px; color: #555c6d; cursor: pointer; font: 700 8px 'DM Sans'; padding: 6px 8px; }.data-viewer { align-items: center; background: rgba(18,22,33,.62); display: flex; inset: 0; justify-content: center; padding: 22px; position: fixed; z-index: 120; }.data-viewer.hidden { display: none; }.data-viewer-card { background: #fff; border-radius: 12px; box-shadow: 0 28px 90px rgba(0,0,0,.3); display: flex; flex-direction: column; max-height: 90vh; overflow: hidden; width: min(1100px,94vw); }.data-viewer-card header { align-items: center; border-bottom: 1px solid #dedfe5; display: flex; justify-content: space-between; padding: 16px 18px; }.data-viewer-card h2 { font-size: 16px; margin: 4px 0 0; }.data-viewer-card header #closeDataViewer { background: #eef0f4; border: 0; border-radius: 50%; cursor: pointer; font-size: 19px; height: 30px; width: 30px; }.data-table-wrap { overflow: auto; padding: 18px; }.data-table { border-collapse: collapse; font-size: 11px; min-width: 100%; }.data-table th,.data-table td { border: 1px solid #dfe1e7; padding: 9px 11px; text-align: left; white-space: nowrap; }.data-table th { background: #f2f3f7; color: #555b6c; font-size: 9px; letter-spacing: .4px; text-transform: uppercase; }.data-table tbody tr:nth-child(even) { background: #fafafd; }.data-empty { color: #9095a3; font-size: 12px; padding: 32px; text-align: center; }
.database-save-toggle { margin-bottom: 0; }.database-field-options { display: grid; grid-template-rows: 0fr; opacity: 0; overflow: hidden; transition: grid-template-rows .24s ease,opacity .18s ease,margin .24s ease; }.database-field-options > div { min-height: 0; overflow: hidden; }.database-field-options.expanded { grid-template-rows: 1fr; margin-top: 15px; opacity: 1; }.database-field-options .setting-label:not(:first-child) { margin-top: 14px; }
.database-rename,.folder-file-rename { background: #fff; border: 1px solid #dedfe6; border-radius: 5px; color: #555c6d; cursor: pointer; font: 700 8px 'DM Sans'; padding: 6px 8px; }.database-rename:hover,.folder-file-rename:hover { border-color: var(--workspace-color,var(--purple)); color: var(--workspace-color,var(--purple)); }
.form-folder-open,.form-spotlight { background: #fff; border: 1px solid #dedfe6; border-radius: 5px; color: #555c6d; cursor: pointer; font: 700 8px 'DM Sans'; padding: 6px 9px; }.form-folder-open:hover,.form-spotlight:hover { border-color: var(--workspace-color,var(--purple)); color: var(--workspace-color,var(--purple)); }.form-spotlight.active { background: color-mix(in srgb,var(--workspace-color,var(--purple)) 10%,white); border-color: color-mix(in srgb,var(--workspace-color,var(--purple)) 42%,#dedfe6); color: var(--workspace-color,var(--purple)); }.form-file .folder-file-info > span { font-size: 7px; }
.folder-rename { align-items: center; background: transparent; border: 0; border-radius: 50%; color: #9297a5; cursor: pointer; display: flex; flex: 0 0 25px; height: 25px; justify-content: center; opacity: 0; }.workspace-folder:hover .folder-rename,.folder-rename:focus-visible { opacity: 1; }.folder-rename:hover { background: #f1f0fb; color: var(--workspace-color,var(--purple)); }
.reference-dialog { align-items: center; background: rgba(19,23,34,.55); display: flex; inset: 0; justify-content: center; padding: 22px; position: fixed; z-index: 170; }.reference-dialog.hidden { display: none; }.reference-dialog-card { background: #fff; border: 1px solid #dedfe6; border-radius: 12px; box-shadow: 0 24px 70px rgba(22,27,43,.28); padding: 25px; width: min(430px,94vw); }.reference-dialog-card h2 { font-size: 18px; margin: 8px 0 9px; }.reference-dialog-card p { color: #6f7585; font-size: 12px; line-height: 1.55; margin: 0 0 22px; }.reference-dialog-card > div { display: flex; gap: 8px; justify-content: flex-end; }.reference-dialog-card button { background: #fff; border: 1px solid #d9dbe3; border-radius: 6px; color: #5e6474; cursor: pointer; font: 700 10px 'Plus Jakarta Sans'; padding: 8px 14px; }.reference-dialog-card .reference-yes { background: var(--workspace-color,var(--purple)); border-color: var(--workspace-color,var(--purple)); color: #fff; }html[data-theme="dark"] .reference-dialog-card { background: #252a38; border-color: #414759; }html[data-theme="dark"] .reference-dialog-card h2 { color: #f1f2f6; }html[data-theme="dark"] .reference-dialog-card button { background: #303646; border-color: #4a5062; color: #e7e9ef; }
.preview-mode .canvas-element.required-invalid { outline: 2px solid #d75a55; outline-offset: 7px; }.preview-mode .canvas-element.required-invalid > label { color: #b83f3b; }.preview-mode .canvas-element.required-invalid input,.preview-mode .canvas-element.required-invalid textarea,.preview-mode .canvas-element.required-invalid select { border-color: #d75a55; box-shadow: 0 0 0 2px rgba(215,90,85,.12); }
.submission-animation { align-items: center; background: rgba(20,25,36,.44); display: flex; inset: 0; justify-content: center; pointer-events: all; position: fixed; z-index: 140; }.submission-animation.hidden { display: none; }.submission-animation-card { align-items: center; background: #fff; border: 1px solid #e0e2e8; border-radius: 14px; box-shadow: 0 24px 70px rgba(25,30,48,.24); display: flex; flex-direction: column; min-width: 235px; opacity: 0; padding: 30px 34px 27px; transform: translateY(12px) scale(.94); }.submission-animation.playing .submission-animation-card { animation: submission-card-in .32s ease forwards; }.submission-check { align-items: center; background: #27815b; border-radius: 50%; color: #fff; display: flex; font-size: 27px; height: 58px; justify-content: center; margin-bottom: 15px; position: relative; width: 58px; }.submission-check:after { border: 2px solid rgba(39,129,91,.25); border-radius: 50%; content: ''; inset: -7px; position: absolute; }.submission-animation.playing .submission-check:after { animation: submission-ring .7s ease-out .12s both; }.submission-animation-card strong { color: #303647; font-size: 16px; }.submission-animation-card small { color: #8a909e; font-size: 10px; margin-top: 6px; }@keyframes submission-card-in { to { opacity: 1; transform: translateY(0) scale(1); } }@keyframes submission-ring { from { opacity: 1; transform: scale(.72); } to { opacity: 0; transform: scale(1.45); } }@media(prefers-reduced-motion:reduce){.submission-animation.playing .submission-animation-card,.submission-animation.playing .submission-check:after { animation-duration: .01ms; }}html[data-theme="dark"] .submission-animation-card { background: #252a38; border-color: #414759; }html[data-theme="dark"] .submission-animation-card strong { color: #f0f2f7; }
.folder-viewer { align-items: center; background: rgba(18,22,33,.6); display: flex; inset: 0; justify-content: center; padding: 24px; position: fixed; z-index: 110; }.folder-viewer.hidden { display: none; }.folder-viewer-card { background: #f8f8fa; border: 1px solid #dfe1e7; border-radius: 13px; box-shadow: 0 28px 90px rgba(0,0,0,.28); display: flex; flex-direction: column; height: min(760px,88vh); overflow: hidden; width: min(900px,92vw); }.folder-viewer-card > header { align-items: center; background: #fff; border-bottom: 1px solid #dfe1e7; display: flex; justify-content: space-between; padding: 18px 20px; }.folder-viewer-card h2 { font-size: 20px; margin: 4px 0 2px; }.folder-viewer-card header small { color: #9095a3; font-size: 10px; }.folder-viewer-card header > button { background: #eceef2; border: 0; border-radius: 50%; color: #626878; cursor: pointer; font-size: 20px; height: 32px; width: 32px; }.folder-viewer-list { display: flex; flex-direction: column; gap: 7px; overflow: auto; padding: 18px; }.folder-viewer-list .folder-file { background: #fff; border: 1px solid #dfe1e7; border-radius: 7px; min-height: 56px; padding: 9px 10px; }.folder-viewer-list .folder-item-delete { opacity: 1; }.folder-viewer-empty { color: #8f95a3; margin: auto; padding: 80px 20px; text-align: center; }html[data-theme="dark"] .folder-viewer-card,html[data-theme="dark"] .folder-viewer-card > header,html[data-theme="dark"] .folder-viewer-list .folder-file { background: #232735; border-color: #414759; }html[data-theme="dark"] .folder-viewer-card h2 { color: #f0f2f7; }
.form-canvas { background-image: none; }
.submit { white-space: nowrap; }
.account-menu { margin-left: 5px; position: relative; }.account-trigger { align-items: center; cursor: pointer; display: flex; justify-content: center; margin-left: 0; overflow: hidden; padding: 0; }.avatar-image { height: 100%; object-fit: cover; width: 100%; }.account-panel { background: #fff; border: 1px solid #e4e5eb; border-radius: 8px; box-shadow: 0 12px 32px rgba(28,33,55,.18); display: none; padding: 6px; position: absolute; right: 0; top: 39px; width: 190px; z-index: 60; }.account-menu.open .account-panel { display: block; }.account-summary { align-items: center; display: flex; gap: 9px; padding: 8px 8px 10px; }.account-summary > span { align-items: center; background: #f4bd7d; border-radius: 50%; color: #814e25; display: flex; font-size: 9px; font-weight: 700; height: 27px; justify-content: center; width: 27px; }.account-summary b,.account-summary small { display: block; }.account-summary b { color: #383e50; font-size: 11px; }.account-summary small { color: #979ba8; font-size: 9px; margin-top: 2px; }.account-panel > button { background: transparent; border: 0; border-radius: 5px; color: #515769; cursor: pointer; font: 11px 'Plus Jakarta Sans'; padding: 9px; text-align: left; width: 100%; }.account-panel > button:hover { background: #f4f3fa; }.account-divider { background: #e9eaf0; height: 1px; margin: 4px 2px; }.account-panel > .account-logout { color: #c95757; }.workspace-top .account-menu { margin-left: auto; }.workspace-view.choosing .workspace-top .account-menu { margin-left: auto; }
.avatar,.account-summary > span { background: #ccebd9; color: #17663a; }
.account-settings-panel { background: #f7f7fa; border-radius: 5px; display: none; margin: 2px 0 5px; padding: 7px; }.account-settings-panel.open { display: block; }.account-settings-panel small { color: #8a8f9e; display: block; font-size: 8px; letter-spacing: .6px; margin: 0 0 6px 2px; }.theme-options { display: grid; gap: 4px; grid-template-columns: 1fr 1fr; }.theme-options button { background: #fff; border: 1px solid #dddfe7; border-radius: 4px; color: #5c6273; cursor: pointer; font: 10px 'Plus Jakarta Sans'; padding: 7px 4px; }.theme-options button.active { background: #e9e7ff; border-color: #aaa3ef; color: var(--purple); }
.login-screen { align-items: center; background: #f5f5f8; display: flex; inset: 0; justify-content: center; padding: 24px; position: fixed; z-index: 100; }.login-screen.hidden { display: none; }.login-card { background: #fff; border: 1px solid #e3e4ea; border-radius: 12px; box-shadow: 0 24px 70px rgba(28,33,55,.15); padding: 32px; width: min(390px,100%); }.login-brand { margin-bottom: 32px; width: auto; }.login-card h1 { font-size: 27px; margin: 9px 0 7px; }.login-card > p { color: #7d8291; font-size: 11px; margin: 0 0 24px; }.login-card label { color: #858b9a; display: block; font: 9px 'DM Mono'; letter-spacing: .7px; margin: 14px 0 7px; }.login-card input { border: 1px solid #dfe1e8; border-radius: 6px; font: 12px 'Plus Jakarta Sans'; outline: none; padding: 11px; width: 100%; }.login-card input:focus { border-color: var(--purple); box-shadow: 0 0 0 3px rgba(101,88,232,.1); }.login-card button[type="submit"] { background: var(--purple); border: 0; border-radius: 6px; color: #fff; cursor: pointer; font: 600 12px 'Plus Jakarta Sans'; margin-top: 19px; padding: 11px; width: 100%; }.login-card .login-error { color: #c95757; margin: 10px 0 -5px; }
.profile-dialog { align-items: center; background: rgba(25,29,42,.48); display: flex; inset: 0; justify-content: center; padding: 24px; position: fixed; z-index: 90; }.profile-dialog.hidden { display: none; }.profile-card { background: #fff; border: 1px solid #e3e4ea; border-radius: 12px; box-shadow: 0 24px 70px rgba(24,29,48,.22); padding: 30px; position: relative; text-align: center; width: min(410px,100%); }.profile-close { background: #f1f2f6; border: 0; border-radius: 50%; color: #6c7282; cursor: pointer; font-size: 19px; height: 29px; line-height: 1; position: absolute; right: 13px; top: 13px; width: 29px; }.profile-avatar { align-items: center; background: #ccebd9; border-radius: 50%; color: #17663a; display: flex; font-size: 18px; font-weight: 800; height: 64px; justify-content: center; margin: 0 auto 17px; width: 64px; }.profile-card h2 { font-size: 22px; margin: 7px 0 3px; }.profile-handle { color: #8a8f9e; font-size: 11px; margin: 0 0 23px; }.profile-details { border-top: 1px solid #e8e9ee; display: grid; gap: 0; text-align: left; }.profile-details > div { display: flex; justify-content: space-between; gap: 18px; padding: 13px 2px; border-bottom: 1px solid #eeeef2; }.profile-details small { color: #969aa7; font: 8px 'DM Mono'; letter-spacing: .6px; }.profile-details span { color: #414758; font-size: 11px; text-align: right; }
html[data-theme="dark"] { color-scheme: dark; }html[data-theme="dark"] body,html[data-theme="dark"] .workspace-view,html[data-theme="dark"] .canvas-area,html[data-theme="dark"] .login-screen { background-color: #171a24; color: #eef0f6; }html[data-theme="dark"] .topbar,html[data-theme="dark"] .left-panel,html[data-theme="dark"] .right-panel,html[data-theme="dark"] .workspace-toolbar,html[data-theme="dark"] .workspace-top,html[data-theme="dark"] .account-panel,html[data-theme="dark"] .workspace-tile,html[data-theme="dark"] .workspace-choice,html[data-theme="dark"] .image-browser-card,html[data-theme="dark"] .template-library-card,html[data-theme="dark"] .login-card { background-color: #232735; border-color: #383d4e; color: #eef0f6; }html[data-theme="dark"] .form-canvas { background-color: var(--canvas,#fffefb); color: #20253a; }html[data-theme="dark"] input,html[data-theme="dark"] textarea,html[data-theme="dark"] select,html[data-theme="dark"] .setting-input,html[data-theme="dark"] .account-settings-panel { background-color: #191d28; border-color: #3d4253; color: #eef0f6; }html[data-theme="dark"] .account-panel button,html[data-theme="dark"] .workspace-choice-open,html[data-theme="dark"] .account-summary b { color: #e7e9f0; }html[data-theme="dark"] .account-panel > button:hover,html[data-theme="dark"] .theme-options button { background: #303545; border-color: #444a5c; color: #e7e9f0; }html[data-theme="dark"] .drawing-toolbar { background: #252a38; border-color: #414759; }html[data-theme="dark"] .login-card > p,html[data-theme="dark"] .account-summary small { color: #a9aebb; }
.brand-mark { background: #277a50; border-radius: 8px; box-shadow: inset 0 -2px 0 rgba(0,0,0,.1); gap: 0; transform: none; }
.brand-mark:before,.brand-mark:after { content: none; }
.brand-mark i { background: linear-gradient(to right,#f29a5b 0 3px,transparent 3px 5px,#fff 5px); border-radius: 1px; display: block; height: 3px; left: 6px; margin: 0; position: absolute; transform: none; width: 16px; }
.brand-mark i:nth-child(1) { height: 3px; top: 7px; width: 16px; }
.brand-mark i:nth-child(2) { height: 3px; top: 13px; width: 13px; }
.brand-mark i:nth-child(3) { background: linear-gradient(to right,#f29a5b 0 3px,transparent 3px 5px,#fff 5px); border: 0; border-radius: 1px; bottom: auto; display: block; height: 3px; left: 6px; right: auto; top: 19px; transform: none; width: 16px; }
.form-theme-list { display: grid; gap: 8px; }.form-theme-card { background: #fff; border: 1px solid #e2e3e9; border-radius: 6px; color: #4f5566; cursor: pointer; font: 600 11px 'Plus Jakarta Sans'; padding: 10px 10px 10px 38px; position: relative; text-align: left; width: 100%; }.form-theme-card > span { background: linear-gradient(135deg,var(--theme-bg) 0 65%,var(--theme-accent) 65%); border: 1px solid rgba(40,45,60,.12); border-radius: 5px; height: 24px; left: 8px; position: absolute; top: 10px; width: 24px; }.form-theme-card small { color: #9297a5; display: block; font-size: 9px; font-weight: 400; margin-top: 3px; }.form-theme-card:hover,.form-theme-card.active { background: #faf9ff; border-color: #aaa3ef; }html[data-theme="dark"] .form-theme-card { background: #292e3d; border-color: #414759; color: #eef0f6; }html[data-theme="dark"] .form-theme-card:hover,html[data-theme="dark"] .form-theme-card.active { background: #303646; }
html[data-theme="dark"] .profile-card { background: #232735; border-color: #3d4253; }html[data-theme="dark"] .profile-details,html[data-theme="dark"] .profile-details > div { border-color: #3d4253; }html[data-theme="dark"] .profile-details span,html[data-theme="dark"] .profile-card h2 { color: #eef0f6; }html[data-theme="dark"] .profile-close { background: #343949; color: #d8dbe4; }
html[data-theme="dark"] .workspace-folder { background: #232735; border-color: #383d4e; }html[data-theme="dark"] .workspace-folder b { color: #eef0f6; }html[data-theme="dark"] .folder-icon { background: #303646; }
.spotlight-heading small { display: none; }
.date-time-toggle { margin-bottom: 0; }
.time-format-setting { margin: 10px 0 18px; }.time-format-setting.hidden { display: none; }
.report-element-tool { display: none; }body.report-mode .report-element-tool { display: flex; }body.report-mode .element-item[data-type="short-text"],body.report-mode .element-item[data-type="number"],body.report-mode .element-item[data-type="long-text"],body.report-mode .element-item[data-type="choice"],body.report-mode .element-item[data-type="checkbox"],body.report-mode .element-item[data-type="select"],body.report-mode .element-item[data-type="date"],body.report-mode .element-item[data-type="submit"] { display: none; }.report-element { background: #fff; border-color: #e0e2e8; min-height: 120px; padding: 16px; }.report-element .report-title { color: #343a4c; font-size: 15px; margin: 0 0 14px; }.report-output { min-height: 68px; overflow: auto; }.report-empty { align-items: center; background: #f7f8fa; border: 1px dashed #d9dce4; border-radius: 6px; color: #959aa7; display: flex; font-size: 10px; justify-content: center; min-height: 70px; padding: 15px; }.report-output > strong { color: var(--workspace-color,var(--purple)); display: block; font-size: 34px; letter-spacing: -1.5px; }.report-output > small { color: #858b99; display: block; font-size: 9px; margin-top: 4px; text-transform: capitalize; }.report-output table { border-collapse: collapse; font-size: 9px; min-width: 100%; }.report-output th,.report-output td { border-bottom: 1px solid #e7e8ed; max-width: 150px; overflow: hidden; padding: 7px 8px; text-align: left; text-overflow: ellipsis; white-space: nowrap; }.report-output th { background: #f5f6f8; color: #747a89; font-size: 8px; text-transform: uppercase; }.report-summary-grid { display: grid; gap: 9px; grid-template-columns: repeat(3,1fr); }.report-summary-grid span { background: #f7f8fa; border-radius: 6px; padding: 12px; }.report-summary-grid b,.report-summary-grid small { display: block; }.report-summary-grid b { color: #343a4c; font-size: 20px; }.report-summary-grid small { color: #8b909e; font-size: 8px; margin-top: 4px; }.report-chart { display: grid; gap: 7px; }.chart-row { align-items: center; display: grid; gap: 8px; grid-template-columns: 90px 1fr 38px; }.chart-row span { color: #656b7b; font-size: 8px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.chart-row i { background: linear-gradient(90deg,var(--workspace-color,var(--purple)) calc(var(--value)*100%),#eceef3 0); border-radius: 4px; height: 12px; }.report-chart.line .chart-row i { background: linear-gradient(90deg,transparent 0 calc(var(--value)*100% - 2px),var(--workspace-color,var(--purple)) calc(var(--value)*100% - 2px) calc(var(--value)*100%),#eceef3 calc(var(--value)*100%)); border-bottom: 1px solid #dfe1e7; border-radius: 0; }.chart-row b { color: #484e60; font-size: 8px; text-align: right; }.report-custom-range,.report-filter-options { display: grid; gap: 7px; grid-template-columns: 1fr 1fr; margin-top: 8px; }.report-custom-range.hidden,.report-filter-options.hidden { display: none; }.report-filter-options { grid-template-columns: 1fr; }.report-mode .form-canvas { background-image: none; }html[data-theme="dark"] .report-element { background: #252a38; border-color: #424859; }html[data-theme="dark"] .report-element .report-title,html[data-theme="dark"] .report-summary-grid b,html[data-theme="dark"] .chart-row b { color: #eef0f6; }html[data-theme="dark"] .report-empty,html[data-theme="dark"] .report-summary-grid span,html[data-theme="dark"] .report-output th { background: #303645; border-color: #4a5061; }
.pdf-page-background{background:#fff;box-shadow:0 2px 10px rgba(22,27,39,.13);object-fit:fill;pointer-events:none;position:absolute;z-index:0}.pdf-import-field{background:rgba(255,255,255,.72);border:1px solid color-mix(in srgb,var(--form-accent,var(--purple)) 58%,transparent);min-height:0!important;padding:0;z-index:2}.pdf-import-field>label{background:var(--form-accent,var(--purple));border-radius:3px 3px 0 0;color:#fff;display:none;font:700 7px 'Plus Jakarta Sans';left:0;max-width:100%;overflow:hidden;padding:2px 4px;position:absolute;text-overflow:ellipsis;top:-14px;white-space:nowrap}.pdf-import-field input.setting-input,.pdf-import-field textarea,.pdf-import-field select.setting-input{background:rgba(255,255,255,.72);border:0;border-radius:0;height:100%;min-height:100%;padding:2px 4px;width:100%}.pdf-import-field .choice-list{height:100%}.pdf-import-field .choice-list label{height:100%;margin:0}.pdf-import-field .choice-list span{font-size:0}.pdf-import-field.selected>label,.pdf-import-field:hover>label{display:block}body.preview-mode .pdf-import-field{background:transparent;border-color:transparent}body.preview-mode .pdf-import-field>label{display:none}.pdf-tag-setting{margin-top:14px}.pdf-import-progress{align-items:center;background:rgba(18,22,33,.6);display:flex;inset:0;justify-content:center;position:fixed;z-index:300}.pdf-import-progress.hidden{display:none}.pdf-import-progress>div{align-items:center;background:#fff;border-radius:12px;box-shadow:0 24px 80px rgba(0,0,0,.28);display:grid;gap:5px;grid-template-columns:42px 1fr;min-width:330px;padding:20px}.pdf-import-progress strong,.pdf-import-progress small{grid-column:2}.pdf-import-progress small{color:#838897;font-size:10px}.pdf-import-spinner{animation:pdf-spin .8s linear infinite;border:3px solid #e4e6eb;border-top-color:var(--workspace-color,var(--purple));border-radius:50%;grid-row:1/3;height:25px;width:25px}@keyframes pdf-spin{to{transform:rotate(360deg)}}
.pdf-import-field > label{display:block}
.omit-submit-pdf{display:none}.submit-element[data-submit-placement="footer"] .submit{cursor:grab;touch-action:none}.submit-element[data-submit-placement="footer"] .submit:active{cursor:grabbing}
.page-size-panel{border-bottom:1px solid var(--line);margin-bottom:20px;padding-bottom:18px}.page-size-panel .edit-hint{line-height:1.45;margin:8px 0}.page-size-readout{background:#f6f7f9;border-radius:5px;color:#777e8f;font:500 9px 'DM Mono';padding:7px 9px}html[data-theme="dark"] .page-size-readout{background:#303545;color:#b8bdca}
.canvas-area{min-height:0!important}.canvas-area:has(.submit-element[data-submit-placement="footer"]){padding-bottom:145px}.canvas-area:has(.submit-element[data-submit-placement="footer"]) .form-canvas{flex-shrink:0}
.checkbox-style-label{margin-top:2px}.canvas-element[data-type="checkbox"] .choice-list input{border-radius:3px}.canvas-element[data-type="checkbox"] .choice-list input:checked:after{align-items:center;background:transparent;color:var(--purple);content:'✓';display:flex;font:bold 13px/1 sans-serif;height:13px;justify-content:center;width:13px}.canvas-element[data-type="checkbox"][data-checkbox-style="x-box"] .choice-list input:checked:after{content:'×';font-size:16px}.canvas-element[data-type="checkbox"][data-checkbox-style="dot-circle"] .choice-list input,.canvas-element[data-type="checkbox"][data-checkbox-style="check-circle"] .choice-list input{border-radius:50%}.canvas-element[data-type="checkbox"][data-checkbox-style="dot-circle"] .choice-list input:checked:after{background:var(--purple);border-radius:50%;content:'';height:7px;width:7px}.canvas-element[data-type="checkbox"][data-checkbox-style="check-circle"] .choice-list input:checked:after{content:'✓';font-size:11px}
.pdf-import-status{align-items:center;display:flex;grid-row:1/4;height:42px;justify-content:center;width:42px}.pdf-import-status b{align-items:center;background:#2f8b62;border-radius:50%;color:#fff;display:none;font-size:21px;height:38px;justify-content:center;width:38px}.pdf-import-card[data-state="success"] .pdf-import-spinner,.pdf-import-card[data-state="error"] .pdf-import-spinner{display:none}.pdf-import-card[data-state="success"] .pdf-import-status b,.pdf-import-card[data-state="error"] .pdf-import-status b{display:flex}.pdf-import-card[data-state="error"] .pdf-import-status b{background:#c85e56}.pdf-import-card button{background:var(--workspace-color,var(--purple));border:0;border-radius:6px;color:#fff;cursor:pointer;font:700 10px 'Plus Jakarta Sans';grid-column:2;margin-top:8px;padding:9px 14px;justify-self:start}.pdf-import-card button[hidden]{display:none}

.canvas-controls { flex-shrink: 0; }
.canvas-controls button:disabled { opacity: .4; cursor: default; }

/* Preserve PDF widget dimensions instead of builder control minimums. */
.pdf-import-field { min-width: 0; border: 0; border-radius: 0; outline: 1px solid color-mix(in srgb,var(--purple) 45%,transparent); }
.pdf-import-field input.setting-input,.pdf-import-field textarea,.pdf-import-field select.setting-input { display: block; box-sizing: border-box; min-width: 0; min-height: 0; margin: 0; padding: 0 1px; font-size: var(--pdf-font-size,10px); line-height: 1; }
.pdf-import-field .choice-list { width: 100%; gap: 0; }
.pdf-import-field .choice-list label { width: 100%; min-width: 0; min-height: 0; padding: 0; gap: 0; }
.pdf-import-field .choice-list span { display: none; }
.pdf-import-field .choice-list input { flex: none; width: 100%; height: 100%; min-width: 0; min-height: 0; margin: 0; border-width: 1px; place-content: stretch; place-items: center; }
.pdf-import-field .choice-list input[type="checkbox"] { border-radius: 0; }
.pdf-import-field .choice-list input:checked:after { width: 60%; height: 60%; }
body.preview-mode .pdf-import-field { outline: none; }

.image-mode-hint { color: #858b9a; font-size: 11px; line-height: 1.5; margin: 8px 0 18px; }
.image-placeholder { padding: 18px; text-align: center; line-height: 1.6; }
.image-frame.blank-drawing-space { background: var(--draw-background,#fff); }
.image-frame.blank-drawing-space > img,.image-frame.blank-drawing-space > .image-placeholder { display: none; }
.image-frame:has(.drawing-canvas) > .image-placeholder { visibility: hidden; }

.draw-background-settings { margin-bottom: 18px; }
.draw-background-color-row { display: flex; align-items: center; justify-content: space-between; margin-top: 10px; color: #727789; font-size: 11px; }
.draw-background-color-row.hidden { display: none; }
.draw-background-color-row input { width: 40px; height: 28px; padding: 2px; border: 1px solid var(--line); border-radius: 4px; background: transparent; cursor: pointer; }
.canvas-element:has(.blank-drawing-space) { background: transparent; }
/* Group selection works in document coordinates at every zoom level. */
.group-selection-controls { display:flex; align-items:center; gap:6px; margin-left:12px; }
.group-selection-controls button { border:1px solid var(--line); border-radius:5px; background:var(--panel); color:#747a8c; padding:5px 7px; font-size:10px; font-family:inherit; cursor:pointer; }
.group-selection-controls button[aria-pressed="true"] { background:#eeecff; color:var(--purple); border-color:#b7b1f2; }
.group-selection-controls span { font-size:10px; color:#747a8c; }
body:not(.preview-mode) .pdf-page-background { pointer-events:auto; cursor:move; }
body:not(.preview-mode) .group-selected { outline:2px solid var(--purple); outline-offset:1px; cursor:move; }
body:not(.preview-mode) .group-selected .resize-handle { display:none; }
.selection-marquee { position:fixed; pointer-events:none; border:1px solid #6558e8; background:rgba(101,88,232,.12); z-index:1000; }
.box-select-mode,.box-select-mode * { cursor:crosshair!important; }
body.preview-mode .group-selection-controls { display:none; }

/* The tray holds any element outside the exported document. */
.form-canvas { margin-bottom:calc(var(--tray-height,240px) + 45px); }
.form-canvas::before { box-sizing:border-box; content:'Elements Tray · Drag elements here'; position:absolute; top:calc(100% + var(--tray-gap,18px)); left:0; width:100%; height:var(--tray-height,240px); padding:12px 14px; border:1px dashed #b8bdce; border-radius:8px; background:rgba(245,246,250,.85); color:#747a8c; font:10px sans-serif; pointer-events:none; }
.form-canvas > [data-submit-placement="footer"] { top:calc(100% + var(--tray-top,48px) + var(--tray-gap,18px) - 18px)!important; z-index:2; }
.form-canvas > .submit-element[data-submit-placement="footer"] { left:var(--tray-left,64px)!important; transform:none!important; }
.canvas-area { min-height:0!important; padding-bottom:80px; }
html[data-theme="dark"] .form-canvas::before { background:#252a38; border-color:#414759; color:#aeb4c2; }

.actions-tray-info { position:absolute; top:calc(100% + var(--tray-height,240px) + var(--tray-gap,18px) - 1px); transform:translateY(-100%); left:14px; right:14px; margin:0; color:#747a8c; font-size:11px; line-height:1.5; pointer-events:none; }

.folder-file { cursor:pointer; transition:background-color .15s ease,border-color .15s ease,box-shadow .15s ease; }
.folder-file .folder-file-info { align-self:stretch; background:transparent; border:0; border-radius:4px; padding:4px 2px; text-align:left; font-family:inherit; cursor:pointer; }
.folder-file .folder-file-info:focus-visible { outline:2px solid var(--workspace-color,var(--purple)); outline-offset:2px; }
.folder-viewer-list .folder-file:hover,.folder-file:hover { background:color-mix(in srgb,var(--workspace-color,var(--purple)) 5%,white); border-color:color-mix(in srgb,var(--workspace-color,var(--purple)) 25%,#dfe1e7); box-shadow:0 2px 6px rgba(33,38,66,.05); }
html[data-theme="dark"] .folder-viewer-list .folder-file:hover,html[data-theme="dark"] .folder-file:hover { background:color-mix(in srgb,var(--workspace-color,var(--purple)) 12%,#232735); }
.file-options { margin-left:auto; position:relative; flex:none; }
.file-options summary { list-style:none; cursor:pointer; border-radius:5px; color:#747a8c; padding:4px 6px; font-size:10px; line-height:1; font-weight:600; }
.file-options summary::-webkit-details-marker,.file-export-menu summary::-webkit-details-marker { display:none; }
.file-options summary:hover { background:rgba(101,88,232,.08); }
.file-options-menu { position:absolute; right:0; top:100%; min-width:120px; background:var(--panel); border:1px solid var(--line); border-radius:7px; padding:5px; box-shadow:0 6px 20px #20253a18; z-index:10; }
.file-options-menu button { width:100%; text-align:left; border:0; }
.file-viewer-actions { display:flex; align-items:center; gap:8px; }
.file-export-menu { position:relative; font-size:12px; }
.file-export-menu summary { list-style:none; cursor:pointer; padding:8px 12px; border:1px solid var(--line); border-radius:6px; background:var(--panel); color:var(--ink); }
.file-export-options { position:absolute; right:0; top:calc(100% + 4px); width:195px; padding:5px; border:1px solid var(--line); border-radius:7px; background:var(--panel); box-shadow:0 8px 24px #20253a20; z-index:20; }
.file-export-options button { display:block; width:100%; border:0; border-radius:4px; padding:9px 10px; background:transparent; color:var(--ink); text-align:left; cursor:pointer; font:inherit; }
.file-export-options button:hover { background:rgba(101,88,232,.08); }
.file-export-options small { display:block; padding:6px 10px; color:#858b9a; line-height:1.4; }
.file-viewer-actions #closeDataViewer { border:0; border-radius:50%; width:30px; height:30px; cursor:pointer; font-size:20px; }

.file-options-menu .folder-item-delete { display:block; width:100%; height:auto; padding:6px 8px; border-radius:4px; opacity:1; color:#c95757; font:700 8px "DM Sans"; text-align:left; }

.folder-viewer-list .folder-file { flex-shrink:0; }

.file-export-menu summary { padding:7px 10px; font:600 11px 'Plus Jakarta Sans',sans-serif; }
.file-export-menu .file-export-options { width:184px; padding:5px; border-radius:8px; }
.file-export-menu .file-export-options button { display:flex; align-items:center; justify-content:space-between; gap:12px; width:100%; height:32px; padding:0 9px; border:0; border-radius:5px; background:transparent; color:var(--ink); font:500 11px 'Plus Jakarta Sans',sans-serif; line-height:1.3; }
.file-export-menu .file-export-options button:hover { background:color-mix(in srgb,var(--purple) 7%,transparent); }
.file-export-menu .file-export-options button:focus-visible { outline:2px solid var(--purple); outline-offset:-2px; }
.file-export-options .export-extension { font:10px 'DM Mono',monospace; color:#858b9a; }
.file-export-menu .file-export-options small { border-top:1px solid var(--line); margin-top:4px; padding:8px 9px 5px; font:10px/1.45 'Plus Jakarta Sans',sans-serif; }


.workspace-folder { cursor:pointer; }
.workspace-folder,.workspace-tile,.spotlight-card,.workspace-tile .tile-name { transition:background-color .15s ease,border-color .15s ease,box-shadow .15s ease; }
:is(.workspace-folder,.workspace-tile,.spotlight-card,.folder-file):hover { background:color-mix(in srgb,var(--workspace-hover-color,var(--purple)) 6%,white); border-color:color-mix(in srgb,var(--workspace-hover-color,var(--purple)) 28%,#dfe1e7); box-shadow:0 3px 9px rgba(33,38,66,.07); }
.workspace-tile:hover .tile-name,.folder-viewer-list .folder-file:hover { background:color-mix(in srgb,var(--workspace-hover-color,var(--purple)) 6%,white); border-color:color-mix(in srgb,var(--workspace-hover-color,var(--purple)) 28%,#dfe1e7); }
html[data-theme="dark"] :is(.workspace-folder,.workspace-tile,.spotlight-card,.folder-file):hover,html[data-theme="dark"] .workspace-tile:hover .tile-name,html[data-theme="dark"] .folder-viewer-list .folder-file:hover { background:color-mix(in srgb,var(--workspace-hover-color,var(--purple)) 12%,#232735); border-color:color-mix(in srgb,var(--workspace-hover-color,var(--purple)) 30%,#414759); }
.workspace-view:not(.choosing) .workspace-settings-btn { display:block; }

.workspace-options-dropdown { position:absolute; right:0; top:5px; z-index:13; }
.workspace-options-dropdown .workspace-settings-btn { position:static; }
.workspace-options-dropdown .workspace-customizer { position:absolute; top:calc(100% + 8px); right:0; width:290px; max-width:calc(100vw - 48px); margin:0; padding:16px; border-radius:9px; background:var(--panel); box-shadow:0 12px 32px rgba(34,38,65,.16); max-height:60vh; overflow:auto; }
.workspace-options-dropdown .workspace-customizer textarea { width:100%; background:var(--panel); color:var(--ink); }
.workspace-options-dropdown .workspace-settings-btn[aria-expanded="true"] { border-color:var(--workspace-color,var(--purple)); background:color-mix(in srgb,var(--workspace-color,var(--purple)) 6%,var(--panel)); }


.workspace-title .create-new { right:44px; }
.workspace-options-dropdown .workspace-settings-btn { width:34px; height:34px; padding:0; font:20px/1 sans-serif; background:var(--panel); }
.workspace-options-dropdown .workspace-customizer label[for="workspaceColor"],.workspace-options-dropdown .workspace-customizer #workspaceColor { display:block; }
.workspace-options-dropdown .workspace-settings-btn:focus-visible { outline:2px solid var(--workspace-color,var(--purple)); outline-offset:2px; }

.file-options-menu .folder-form-delete { color:#c95757; padding:6px 8px; background:transparent; border-radius:4px; font:700 8px "DM Sans"; cursor:pointer; }
.file-options-menu .folder-form-delete:hover { background:#fff0ef; }
.folder-options .folder-delete,.folder-options .folder-rename,.file-options-menu .folder-move,.file-options-menu .file-move { position:static; display:block; opacity:1; margin:0; width:100%; height:auto; padding:7px 8px; border:0; border-radius:4px; background:transparent; font:10px 'Plus Jakarta Sans',sans-serif; text-align:left; cursor:pointer; }
.folder-options .folder-delete { color:#c95757; }
.nested-folder { flex-shrink:0; }
.folder-up { align-self:flex-start; border:0; background:transparent; color:var(--purple); cursor:pointer; padding:7px 0; font:11px 'Plus Jakarta Sans',sans-serif; }
.move-dialog { width:360px; max-width:calc(100vw - 32px); padding:22px; border:1px solid var(--line); border-radius:12px; background:var(--panel); color:var(--ink); box-shadow:0 20px 60px #20253a30; }
.move-dialog::backdrop { background:#181c3066; }
.move-dialog h2 { font-size:16px; margin:0 0 10px; }
.move-dialog p,.move-dialog label,.move-dialog small { display:block; font-size:11px; line-height:1.5; }
.move-dialog select { margin:7px 0 10px; width:100%; padding:8px; border:1px solid var(--line); border-radius:5px; background:var(--panel); color:var(--ink); }
.move-dialog small { color:#858b9a; }
.move-dialog footer { display:flex; gap:8px; justify-content:flex-end; margin-top:18px; }
.move-dialog button { padding:8px 12px; border:1px solid var(--line); border-radius:6px; cursor:pointer; }
.move-dialog .confirm-move { background:var(--purple); color:white; }
.move-dialog button:disabled { opacity:.5; cursor:default; }
.folder-sort { display:flex; align-items:center; gap:7px; margin-left:auto; font-size:10px; color:#858b9a; }
.folder-sort select { border:1px solid var(--line); border-radius:5px; background:var(--panel); color:var(--ink); padding:6px 8px; font:10px 'Plus Jakarta Sans',sans-serif; }
.folder-viewer-actions { display:flex; align-items:center; gap:14px; }
.folder-viewer-actions #closeFolderViewer { background:#eceef2; border:0; border-radius:50%; color:#626878; cursor:pointer; font-size:20px; height:32px; width:32px; }
.reorder-dragging { opacity:.45; }
.workspace-folder.reorder-before,.folder-file.reorder-before { box-shadow:0 -3px 0 var(--workspace-color,var(--purple)); }
.workspace-folder.reorder-after,.folder-file.reorder-after { box-shadow:0 3px 0 var(--workspace-color,var(--purple)); }
.workspace-folders > .reorder-before { box-shadow:-3px 0 0 var(--workspace-color,var(--purple)); }
.workspace-folders > .reorder-after { box-shadow:3px 0 0 var(--workspace-color,var(--purple)); }

.file-options-menu[popover],.file-export-menu .file-export-options[popover] { position:fixed; inset:auto; margin:0; box-sizing:border-box; max-width:calc(100vw - 16px); max-height:calc(100vh - 16px); overflow:auto; }
.file-options-menu[popover]::backdrop,.file-export-options[popover]::backdrop { background:transparent; pointer-events:none; }

.file-options .file-options-menu button { display:block; width:100%; height:auto; margin:0; padding:6px 8px; border:0; border-radius:4px; background:transparent; color:#555c6d; font:700 8px 'DM Sans',sans-serif; text-align:left; cursor:pointer; }
.file-options .file-options-menu button:hover { background:rgba(101,88,232,.08); }
.file-options .file-options-menu :is(.folder-item-delete,.folder-form-delete,.folder-delete) { color:#c95757; }
.file-options .file-options-menu :is(.folder-item-delete,.folder-form-delete,.folder-delete):hover { background:#fff0ef; }

.workspace-chooser-actions { display:flex; align-items:center; justify-content:space-between; gap:16px; }
.workspace-chooser-actions .new-workspace { display:block; margin:0; padding:10px 13px; border:0; border-radius:6px; background:#277a50; color:#fff; cursor:pointer; font:600 11px 'Plus Jakarta Sans',sans-serif; }
.workspace-chooser-actions .new-workspace:hover { filter:brightness(.94); }
.workspace-chooser-actions .new-workspace:focus-visible { outline:2px solid #277a50; outline-offset:3px; }
.form-page-controls { display:flex; align-items:center; gap:12px; padding:8px 25px; background:var(--panel); border-bottom:1px solid var(--line); flex:none; }
.form-page-controls label { display:flex; gap:6px; align-items:center; font-size:11px; color:#747a8c; }
.form-page-controls select,.form-page-controls button { padding:6px 8px; border:1px solid var(--line); border-radius:5px; background:var(--panel); color:var(--ink); font:11px 'Plus Jakarta Sans',sans-serif; }
.form-page-controls button { cursor:pointer; }
.form-page-controls small { color:#858b9a; font-size:10px; }
body.preview-mode .form-page-controls .add-form-page,body.preview-mode .form-page-controls .page-scale-label,body.preview-mode .form-page-controls small { display:none; }
.export-form-page { margin:0!important; }

/* Empty trays remain available for placing elements only while building. */
body.preview-mode .form-canvas:not(:has(> [data-submit-placement="footer"]))::before,
body.preview-mode .form-canvas:not(:has(> [data-submit-placement="footer"])) > .actions-tray-info { display:none; }
body.preview-mode .form-canvas:not(:has(> [data-submit-placement="footer"])) { margin-bottom:0; }

.tray-page-navigation { position:absolute; top:calc(100% + 14px); left:0; right:0; display:flex; align-items:center; justify-content:space-between; gap:12px; font-size:11px; color:#747a8c; }
.tray-page-navigation button { background:var(--panel); border:1px solid var(--line); border-radius:5px; padding:7px 10px; font:600 11px 'Plus Jakarta Sans',sans-serif; color:var(--ink); cursor:pointer; }
.tray-page-navigation button:disabled { opacity:.45; cursor:default; }



.form-canvas:has(> .tray-page-navigation) { --tray-gap:66px; margin-bottom:calc(var(--tray-height,240px) + 93px); }
body.preview-mode .form-canvas:has(> .tray-page-navigation):not(:has(> [data-submit-placement="footer"])) { margin-bottom:66px; }
.page-arrow-controls { display:flex; align-items:center; gap:3px; margin-left:-6px; }
.form-page-controls .page-arrow-controls button { width:24px; height:26px; padding:0; font:19px/1 sans-serif; }
.page-arrow-controls button:disabled { opacity:.35; cursor:default; }

body:not(.preview-mode) #highlightFieldsBtn { display:none; }
body.preview-mode .top-actions > #highlightFieldsBtn { display:inline-flex; align-items:center; gap:6px; font-size:10px; }
#highlightFieldsBtn::before { content:''; width:9px; height:9px; border:1px solid #aeb7c7; border-radius:2px; }
#highlightFieldsBtn[aria-pressed="true"] { border-color:var(--purple); color:var(--purple); background:color-mix(in srgb,var(--purple) 7%,var(--panel)); }
#highlightFieldsBtn[aria-pressed="true"]::before { background:var(--purple); border-color:var(--purple); }
body.preview-mode.highlight-form-fields #formCanvas .canvas-element :is(input:not([type="hidden"]):not([type="button"]):not([type="submit"]):not([type="color"]):not([type="range"]),textarea,select):not(:disabled):not([readonly]) { background-color:rgba(101,88,232,.09)!important; outline:1px solid rgba(101,88,232,.25); outline-offset:1px; box-shadow:0 0 0 2px rgba(101,88,232,.04); }
body.preview-mode.highlight-form-fields #formCanvas .image-frame:has(.drawing-canvas)::after { content:''; position:absolute; inset:0; background:rgba(101,88,232,.07); outline:1px solid rgba(101,88,232,.25); pointer-events:none; z-index:2; }

body.preview-mode .form-page-controls { position:relative; z-index:4; overflow:visible; }
.page-filling-actions { margin-left:auto; display:flex; align-items:center; gap:8px; }
.page-filling-actions[hidden] { display:none; }
.page-filling-actions #highlightFieldsBtn { display:inline-flex; align-items:center; gap:6px; font-size:10px; white-space:nowrap; }
.page-filling-actions #previewBtn { white-space:nowrap; font-size:10px; }
@media(max-width:600px) { body.preview-mode .form-page-controls { flex-wrap:wrap; } }
.tavoryn-dialog { width:380px; max-width:calc(100vw - 32px); padding:24px; border:1px solid var(--line); border-radius:12px; background:var(--panel); color:var(--ink); box-shadow:0 22px 70px rgba(25,35,45,.22); font-family:'Plus Jakarta Sans',sans-serif; }
.tavoryn-dialog::backdrop { background:rgba(24,32,43,.38); backdrop-filter:blur(2px); }
.dialog-brand { color:#277a50; font:700 9px 'DM Mono',monospace; letter-spacing:1.8px; margin-bottom:12px; }
.tavoryn-dialog h2 { font-size:16px; line-height:1.5; font-weight:600; margin:0 0 18px; overflow-wrap:anywhere; }
.dialog-input-label { display:block; color:#858b9a; font-size:10px; margin-bottom:7px; }
.tavoryn-dialog input { box-sizing:border-box; width:100%; padding:10px 11px; border:1px solid var(--line); border-radius:6px; background:var(--panel); color:var(--ink); font:12px 'Plus Jakarta Sans',sans-serif; }
.tavoryn-dialog input:focus { outline:2px solid color-mix(in srgb,#277a50 35%,transparent); outline-offset:1px; }
.tavoryn-dialog [hidden] { display:none; }
.tavoryn-dialog footer { display:flex; justify-content:flex-end; gap:8px; margin-top:22px; }
.tavoryn-dialog button { border:1px solid var(--line); border-radius:6px; padding:8px 14px; cursor:pointer; background:var(--panel); color:var(--ink); font:600 11px 'Plus Jakarta Sans',sans-serif; }
.tavoryn-dialog .dialog-accept { background:#277a50; border-color:#277a50; color:white; }
.tavoryn-dialog .dialog-accept.destructive { background:#bb514d; border-color:#bb514d; }
.tavoryn-dialog button:hover { filter:brightness(.96); }
.tavoryn-dialog button:focus-visible { outline:2px solid #277a50; outline-offset:2px; }
.toast { background:var(--panel); color:var(--ink); border:1px solid var(--line); border-left:3px solid #277a50; border-radius:8px; box-shadow:0 8px 28px rgba(25,35,45,.14); font:11px/1.5 'Plus Jakarta Sans',sans-serif; max-width:calc(100vw - 40px); }
html[data-theme="dark"] .tavoryn-dialog,html[data-theme="dark"] .toast { background:#232735; color:#eef0f6; border-color:#414759; }
html[data-theme="dark"] .tavoryn-dialog input,html[data-theme="dark"] .tavoryn-dialog .dialog-cancel { background:#191d28; color:#eef0f6; border-color:#414759; }
html[data-theme="dark"] .dialog-brand { color:#7fc9a0; }

.tavoryn-wordmark { font-family:'Plus Jakarta Sans',sans-serif; font-weight:800; font-style:normal; letter-spacing:1.7px; }
.folder-create-menu { margin-left:auto; }
.folder-create-menu > summary { background:var(--workspace-color,var(--purple)); color:#fff; border-color:transparent; white-space:nowrap; }
.workspace-folders > .folder-file { background:var(--panel); border:1px solid var(--line); border-radius:8px; padding:10px; min-height:76px; }
.workspace-folders > .folder-file .folder-file-info { font-size:10px; }

/* Consistent file and folder type markers beside names. */
.file-type-icon { display:inline-flex; align-items:center; justify-content:center; flex:none; width:34px; height:34px; border-radius:6px; background:color-mix(in srgb,var(--workspace-color,var(--purple)) 12%,transparent); color:var(--workspace-color,var(--purple)); }
.folder-file-info > .file-type-icon { font:700 9px 'DM Mono',monospace; grid-column:1; grid-row:1 / 3; }
.file-type-icon svg { width:21px; height:21px; }
.file-type-icon.folder-icon { width:42px; height:38px; }
.signature-space { height:110px; width:100%; border-bottom:1px solid #adb3c0; display:flex; align-items:center; justify-content:center; }
.signature-image { width:100%; height:100%; object-fit:contain; }
.signature-placeholder { color:#989dab; font-size:12px; }
.signature-image[hidden],.signature-placeholder[hidden] { display:none; }
.signature-actions { display:none; gap:6px; margin-top:8px; flex-wrap:wrap; }
.preview-mode .signature-actions { display:flex; }
.signature-actions button,.signature-dialog button { background:var(--panel,#fff); border:1px solid #dce0e7; border-radius:6px; color:#4c5566; padding:6px 9px; font:500 11px 'DM Sans',sans-serif; cursor:pointer; }
.signature-dialog { width:min(540px,90vw); padding:24px; border:1px solid #dde2e9; border-radius:14px; color:#30394a; background:#fff; box-shadow:0 20px 70px #101a3440; }
.signature-dialog::backdrop { background:#18213966; }
.signature-dialog h2 { margin:0 0 8px; font:700 20px 'Plus Jakarta Sans',sans-serif; }
.signature-dialog p,.signature-save-choice { font:12px/1.6 'DM Sans',sans-serif; }
.signature-dialog canvas { display:block; width:100%; height:160px; background:#fff; border:1px solid #d9dfe8; border-radius:8px; touch-action:none; }
.signature-dialog-tools,.signature-dialog footer { display:flex; gap:8px; justify-content:space-between; margin:12px 0; }
.signature-dialog footer { justify-content:flex-end; margin-bottom:0; }
.signature-dialog [data-sign="accept"] { background:#277a50; color:white; border-color:#277a50; }
.signature-error { color:#ac3a3a; min-height:18px; }
html[data-theme="dark"] .signature-dialog { background:#232735; color:#eef0f6; border-color:#42495a; }
body.highlight-fillable-fields .canvas-element[data-type="signature"] .signature-space { background:#8e83ec14; }
.preview-mode .signature-space { cursor:pointer; }
.preview-mode .signature-space:focus-visible { outline:2px solid var(--purple); outline-offset:3px; }
.preview-mode.highlight-form-fields .signature-space { background:rgba(101,88,232,.09); box-shadow:inset 0 0 0 1px rgba(101,88,232,.2); border-radius:4px; }
.signature-dialog-tools { flex-wrap:wrap; }
.page-filling-actions #publishBtn { background:var(--purple); border-color:var(--purple); color:white; white-space:nowrap; font-weight:600; }
/* Keep account access anchored to the application edge in every main view. */
.topbar,.workspace-top { padding-right:70px; }
.topbar { z-index:180; }
.workspace-top { position:sticky; top:0; z-index:180; }
.topbar .account-menu,.workspace-top .account-menu { position:fixed; top:16px; right:20px; margin:0; z-index:181; }
.account-panel { max-height:calc(100dvh - 72px); overflow-y:auto; }
.topbar .breadcrumb { min-width:0; overflow:hidden; white-space:nowrap; }
.topbar .top-actions { flex-shrink:0; }
body:not(.preview-mode) .top-actions > .file-viewer-actions { display:none; }
@media(max-width:680px) { .topbar,.workspace-top { padding-right:60px; } .topbar .account-menu,.workspace-top .account-menu { right:14px; } }
/* Shared brand position across the workspace and editor headers. */
.topbar,.workspace-top { padding-left:244px; }
.topbar > .brand,.workspace-top > .brand { position:fixed; top:0; left:20px; height:64px; width:auto; margin:0; display:flex; align-items:center; z-index:181; }
@media(max-width:680px) { .topbar,.workspace-top { padding-left:190px; } }
/* Workspace navigation follows the same content edge as Your forms. */
.workspace-view:not(.choosing) .workspace-top { height:112px; padding-top:64px; padding-left:max(32px,calc((100vw - 1120px)/2 + 32px)); gap:10px; }
.workspace-top #allWorkspacesBtn,.workspace-top #workspaceSelector { height:32px; margin:0; padding:0 12px; border:1px solid var(--line); border-radius:6px; background:var(--panel); color:var(--ink); font:600 11px 'Plus Jakarta Sans',sans-serif; }
.workspace-top #allWorkspacesBtn { display:inline-flex; align-items:center; gap:8px; white-space:nowrap; }
.workspace-top #workspaceSelector { max-width:min(300px,45vw); }
.workspace-top #allWorkspacesBtn:hover { background:color-mix(in srgb,var(--purple) 10%,var(--panel)); }
.workspace-customizer #renameWorkspace { position:static; display:block; width:100%; margin:0 0 6px; padding:9px 10px; border:1px solid var(--line); border-radius:6px; text-align:left; font:600 11px 'Plus Jakarta Sans',sans-serif; background:var(--panel); color:var(--ink); }
html[data-theme="dark"] .workspace-top :is(#allWorkspacesBtn,#workspaceSelector) { background:#2c3546; border-color:#454e62; color:#eef0f6; }
.workspace-view:not(.choosing) .workspace-top { height:64px; padding-top:0; padding-left:max(220px,calc((100vw - 1120px)/2 + 32px)); }
@media(max-width:680px) {
 .workspace-view:not(.choosing) .workspace-top { padding-left:200px; gap:6px; }
 .workspace-top #allWorkspacesBtn,.workspace-top #workspaceSelector { padding-left:7px; padding-right:7px; font-size:10px; }
 .workspace-top #workspaceSelector { min-width:0; flex:1; }
}
/* One consistent return control in workspace, build, and preview headers. */
.topbar,.workspace-view:not(.choosing) .workspace-top { padding-left:220px; }
.topbar #previewWorkspaceBack,.workspace-top #allWorkspacesBtn { display:inline-flex; align-items:center; justify-content:center; flex:0 0 138px; width:138px; height:32px; margin:0 10px 0 0; padding:0 10px; border:1px solid var(--line); border-radius:6px; background:var(--panel); color:var(--ink); font:600 11px 'Plus Jakarta Sans',sans-serif; gap:6px; cursor:pointer; white-space:nowrap; }
.topbar #previewWorkspaceBack:hover,.workspace-top #allWorkspacesBtn:hover { background:color-mix(in srgb,var(--purple) 10%,var(--panel)); }
.topbar #workspaceLink,.topbar #workspaceLink + b { display:none; }
html[data-theme="dark"] .topbar #previewWorkspaceBack,html[data-theme="dark"] .workspace-top #allWorkspacesBtn { background:#2c3546; color:#eef0f6; border-color:#454e62; }
@media(max-width:680px) { .topbar,.workspace-view:not(.choosing) .workspace-top { padding-left:200px; } }
.workspace-view.choosing .workspace-top #allWorkspacesBtn { display:none; }
.workspace-customizer #workspaceDescription,.workspace-customizer label[for="workspaceDescription"] { display:none; }
.workspace-customizer #editWorkspaceDescription { display:block; width:100%; margin:0 0 6px; padding:9px 10px; border:1px solid var(--line); border-radius:6px; text-align:left; font:600 11px 'Plus Jakarta Sans',sans-serif; background:var(--panel); color:var(--ink); cursor:pointer; }
.workspace-customizer #deleteWorkspace { background:transparent; border:1px solid #c45b58; border-radius:6px; color:#b34340; padding:9px 10px; text-align:left; font:600 11px 'Plus Jakarta Sans',sans-serif; cursor:pointer; margin-top:8px; }
html[data-theme="dark"] .workspace-customizer #deleteWorkspace { color:#ffaaa5; border-color:#a65a5a; }
.workspace-chooser-actions { justify-content:flex-end; }
.workspace-title h1 { margin-top:0; padding-right:180px; }
.workspace-title .create-new,.workspace-title .workspace-options-dropdown { top:0; }
.workspace-chooser-actions { justify-content:space-between; align-items:flex-start; margin-bottom:8px; }
.workspace-chooser-actions h1 { margin:0; }
.workspace-chooser-actions .new-workspace { flex-shrink:0; }
@media(max-width:600px) { .workspace-chooser-actions { flex-wrap:wrap; } }
.app-watermark { position:fixed; bottom:7px; left:50%; transform:translateX(-50%); z-index:400; pointer-events:none; user-select:none; white-space:nowrap; font:500 10px/1.4 'Plus Jakarta Sans',sans-serif; letter-spacing:.35px; color:#737b8b; background:rgba(247,247,250,.85); border-radius:4px; padding:2px 7px; }
html[data-theme="dark"] .app-watermark { color:#a6afbf; background:rgba(23,26,36,.85); }
@media print { .app-watermark { display:none; } }
.new-workspace-menu { position:relative; flex-shrink:0; }
.new-workspace-menu summary { list-style:none; }
.new-workspace-menu summary::-webkit-details-marker { display:none; }
.workspace-type-options { position:absolute; top:calc(100% + 6px); right:0; width:250px; padding:6px; background:var(--panel); border:1px solid var(--line); border-radius:8px; box-shadow:var(--shadow); z-index:20; }
.workspace-type-options button { display:block; width:100%; padding:10px; border:0; border-radius:5px; background:transparent; color:var(--ink); text-align:left; font:12px 'Plus Jakarta Sans',sans-serif; cursor:pointer; }
.workspace-type-options button:hover { background:color-mix(in srgb,var(--purple) 12%,var(--panel)); }
.workspace-type-options small { display:block; color:var(--muted); font-size:10px; margin-top:4px; }
.workspace-type-label { display:block; color:var(--muted); font:600 9px 'Plus Jakarta Sans',sans-serif; margin-top:7px; text-transform:uppercase; letter-spacing:.6px; }
.compliance-workspace .workspace-gallery :is(.create-new,.workspace-folder-section,.workspace-spotlight,.workspace-tiles) { display:none; }
.compliance-workspace .workspace-options-dropdown { right:0; }
.compliance-workspace .workspace-gallery .create-new { display:block; }
.compliance-workspace #createNewMenu > :not(#newComplianceRegister) { display:none; }
.workspace-view:not(.compliance-workspace) #newComplianceRegister { display:none; }
.compliance-register-list { display:none; }
.compliance-workspace .compliance-register-list { display:grid; grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); gap:14px; margin-top:28px; }
.compliance-register-card { text-align:left; padding:18px; border:1px solid var(--line); border-radius:8px; background:var(--panel); color:var(--ink); cursor:pointer; font:13px 'Plus Jakarta Sans',sans-serif; }
.compliance-register-card:hover { background:color-mix(in srgb,var(--workspace-hover-color,var(--purple)) 10%,var(--panel)); }
.compliance-register-card :is(span,small) { display:block; margin-top:9px; color:var(--muted); font-size:11px; }
.compliance-register-editor { width:min(1240px,95vw); max-height:88vh; padding:24px; background:var(--panel); color:var(--ink); border:1px solid var(--line); border-radius:12px; }
.compliance-register-editor::backdrop { background:#17203280; }
.compliance-register-editor header,.compliance-register-editor footer { display:flex; align-items:center; justify-content:space-between; gap:16px; }
.compliance-register-editor h2 { margin:0 0 6px; font-size:20px; }
.compliance-register-editor small { color:var(--muted); display:block; font-size:10px; }
.register-metadata { display:grid; grid-template-columns:1fr 1fr; gap:16px; margin:24px 0; }
.register-metadata label { display:grid; gap:7px; font-size:11px; color:var(--muted); }
.compliance-register-editor :is(input,textarea,select,button) { font:11px/1.5 'Plus Jakarta Sans',sans-serif; padding:8px; border:1px solid var(--line); border-radius:5px; color:var(--ink); background:var(--panel); }
.compliance-register-editor :is(input,textarea,select) { width:100%; }
.compliance-register-editor textarea { min-height:68px; resize:vertical; }
.compliance-register-editor button { cursor:pointer; }
.register-table-wrap { overflow:auto; margin-bottom:18px; }
.compliance-register-editor table { width:100%; min-width:920px; border-collapse:collapse; }
.compliance-register-editor :is(th,td) { text-align:left; vertical-align:top; border-bottom:1px solid var(--line); padding:10px 6px; font-size:11px; }
.compliance-register-editor th:nth-child(2) { width:32%; }
.compliance-register-editor th:nth-child(4) { width:22%; }
.compliance-register-editor td button { margin-bottom:5px; }
.compliance-register-editor [data-register="delete"] { color:#c75b58; }
.compliance-workspace .workspace-title .create-new { right:44px; }
.compliance-workspace #createNewMenu > #newFolderBtn { display:grid; }
.compliance-workspace .workspace-gallery .workspace-folder-section { display:block; }
.folder-drop-target { outline:2px solid var(--workspace-color,var(--purple)); outline-offset:3px; background:color-mix(in srgb,var(--workspace-color,var(--purple)) 15%,var(--panel))!important; }
.folder-drop-out { display:none; position:absolute; bottom:12px; left:50%; transform:translateX(-50%); padding:12px 22px; border:2px dashed var(--line); border-radius:8px; background:var(--panel); color:var(--ink); font-size:12px; pointer-events:auto; }
.moving-folder-item .folder-drop-out { display:block; }
.file-options-menu .form-spotlight,.file-options-menu .form-spotlight.active { background:transparent; border:0; border-radius:4px; color:var(--ink); box-shadow:none; font:500 8px 'DM Sans',sans-serif; text-align:left; }
.file-options-menu .form-spotlight:hover { background:color-mix(in srgb,var(--purple) 10%,var(--panel)); }
/* Builder tools share appearance tokens instead of fixed light backgrounds. */
.workspace-toolbar { flex-wrap:wrap; height:auto; min-height:55px; gap:8px; padding-top:8px; padding-bottom:8px; }
.builder-view-controls,.layer-actions { display:flex; flex-wrap:wrap; gap:6px; }
.builder-view-controls { margin-left:auto; }
.builder-view-controls button,.layer-actions button,.group-selection-controls button { background:var(--panel); color:var(--ink); border:1px solid var(--line); border-radius:5px; padding:6px 8px; font:10px 'Plus Jakarta Sans',sans-serif; cursor:pointer; }
.builder-view-controls button[aria-pressed=true],.group-selection-controls button[aria-pressed=true] { background:color-mix(in srgb,var(--purple) 15%,var(--panel)); border-color:var(--purple); }
.layer-actions { margin-top:8px; }
#fieldSettings :disabled { opacity:.42; cursor:not-allowed; }
body:not(.preview-mode).hide-element-outlines #formCanvas :is(.canvas-element,.canvas-header,.editable-region,.group-selected) { border-color:transparent!important; outline:none!important; box-shadow:none!important; }
body:not(.preview-mode).hide-element-outlines #formCanvas :is(.drag-handle,.quick-delete,.resize-handle),body:not(.preview-mode).hide-element-outlines #formCanvas .canvas-element::before,body:not(.preview-mode).hide-element-outlines #formCanvas .canvas-header::before { display:none!important; }
body.highlight-form-fields #formCanvas .canvas-element :is(input:not([type=hidden]):not([type=color]):not([type=range]),textarea,select):not(:disabled):not([readonly]),body.highlight-form-fields #formCanvas .signature-space { background-color:rgba(101,88,232,.09)!important; outline:1px solid rgba(101,88,232,.3); }
.app-manager { width:min(620px,92vw); max-height:88vh; overflow:auto; border:1px solid var(--line); border-radius:12px; padding:24px; color:var(--ink); background:var(--panel); }
.app-manager::backdrop { background:#18203388; }
.app-manager header,.app-manager footer { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:16px; }
.app-manager h2 { margin:0; font-size:19px; }
.app-manager p { font-size:12px; line-height:1.6; color:var(--muted); }
.app-manager :is(input,select,button),.canvas-element :is(.timer-face button,.weather-controls button) { padding:8px; border:1px solid var(--line); border-radius:5px; color:var(--ink); background:var(--panel); font:11px 'Plus Jakarta Sans',sans-serif; }
.app-manager button { cursor:pointer; }
.app-manager select { width:100%; margin-bottom:10px; }
.manager-fields { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin:16px 0; }
.manager-fields label { display:grid; gap:6px; font-size:11px; }
.manager-fields input { min-width:0; }
.timer-face { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.timer-face output { font:24px 'DM Mono',monospace; }
.timer-face input { width:100%; }
.weather-controls { display:flex; flex-wrap:wrap; gap:6px; margin-bottom:8px; }
.weather-controls input { min-width:0; flex:1; }
.weather-value { width:100%; }
.canvas-element[data-type="weather"] { min-width:0; min-height:0; padding:0; }
.canvas-element[data-type="weather"] > label,
.canvas-element[data-type="weather"] .weather-credit,
.canvas-element[data-type="weather"] .weather-value[hidden] { display:none!important; }
.canvas-element[data-type="weather"] .weather-controls { margin:0; display:block; }
.canvas-element[data-type="weather"] .weather-controls button { width:100%; min-width:0; cursor:pointer; font-size:inherit; }
.canvas-element[data-type="weather"] .weather-controls button.has-reading { border-color:transparent; background:transparent; }
.canvas-element[data-type="weather"] .weather-status { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); }
.weather-edit-dialog form[hidden] { display:none; }
.weather-edit-dialog form label { display:grid; gap:6px; margin-bottom:12px; }
.weather-edit-dialog footer { flex-wrap:wrap; }
.weather-status,.weather-credit { display:block; margin-top:5px; font-size:10px; color:#646c7c; }
body:not(.preview-mode) .canvas-element :is(.timer-face,.weather-controls) button { pointer-events:none; }
.timer-face [hidden] { display:none!important; }
.canvas-element :is(.weather-place,.weather-value,.timer-face input) { box-sizing:border-box; border:1px solid #c3c9d4; border-radius:5px; padding:8px 10px; background:#fff; color:#20253a; font:12px 'Plus Jakarta Sans',sans-serif; }
.certification-manager { padding-bottom:48px; }
.certification-manager .manager-error { min-height:20px; }
.certification-saved-notice { position:absolute; bottom:10px; left:50%; transform:translate(-50%,6px); opacity:0; pointer-events:none; max-width:calc(100% - 32px); padding:7px 12px; border:1px solid #a7d6ba; border-radius:7px; background:#eaf7ef; color:#21613d; font:11px/1.4 'Plus Jakarta Sans',sans-serif; transition:opacity .18s ease,transform .18s ease; }
.certification-saved-notice.show { opacity:1; transform:translate(-50%,0); }
html[data-theme="dark"] .certification-saved-notice { background:#203d30; color:#b8e8cc; border-color:#427b59; }
@media(prefers-reduced-motion:reduce) { .certification-saved-notice { transition:none; } }
.certification-selection-actions { display:flex; justify-content:flex-start; margin:12px 0; }
.certification-manager #certPicker { margin-bottom:0; }
.certification-manager form > footer { justify-content:flex-end; }
.certification-manager [data-cert="delete"],.signature-dialog [data-sign="remove"] { margin-right:auto; }
.certification-manager [data-cert="delete"]:disabled,.signature-dialog [data-sign="remove"]:disabled { opacity:.4; cursor:not-allowed; }
.signature-dialog #savedSignaturePicker { display:block; width:100%; margin-bottom:18px; }
.signature-dialog label[for="signatureName"] { display:block; clear:both; margin-top:0; margin-bottom:8px; }
.signature-dialog #signatureName { display:block; width:100%; margin-bottom:12px; }
/* Login recovery is available before the editor's dialog system loads. */
#resetPassword { display:block; margin:18px auto 8px; min-height:44px; padding:10px 16px; border:0; border-radius:6px; background:transparent; color:#277a50; font:600 13px 'Plus Jakarta Sans',sans-serif; cursor:pointer; }
#resetPassword:hover { background:rgba(39,122,80,.08); }
.reset-dialog { width:min(420px,calc(100% - 32px)); max-height:calc(100dvh - 32px); overflow:auto; box-sizing:border-box; padding:28px; border:1px solid #e3e4ea; border-radius:14px; color:#20253a; background:#fff; box-shadow:0 24px 70px rgba(28,33,55,.2); }
.reset-dialog::backdrop { background:rgba(20,28,36,.5); }
.reset-dialog h2 { margin:0 0 12px; font-size:22px; }
.reset-dialog p { line-height:1.5; font-size:14px; }
.reset-dialog label { display:block; margin:20px 0 8px; font-size:13px; font-weight:600; }
.reset-dialog input { box-sizing:border-box; width:100%; padding:12px; border:1px solid #c6ccd0; border-radius:6px; font:16px 'Plus Jakarta Sans',sans-serif; }
.reset-actions { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:12px; margin-top:22px; }
.reset-actions button { min-height:44px; padding:10px 16px; border:1px solid #c6ccd0; border-radius:7px; background:transparent; color:inherit; font:600 13px 'Plus Jakarta Sans',sans-serif; cursor:pointer; }
.reset-actions button[type=submit] { background:#277a50; border-color:#277a50; color:white; }
.reset-actions button:disabled { opacity:.6; cursor:wait; }
.reset-dialog :focus-visible,#resetPassword:focus-visible { outline:3px solid #f29a5b; outline-offset:3px; }
html[data-theme=dark] .reset-dialog { background:#232735; border-color:#383d4e; color:#eef0f6; }
html[data-theme=dark] #resetPassword { color:#8dd4ac; }
#resetPassword[hidden] { display:none; }