body[data-editor-shell="click"] { --paper: #fbf6ea; --ink: #173f73; --accent: #aa87c8; }
.click-editor-shell, .click-editor-shell * { letter-spacing: 0; }
.click-editor-shell button { min-height: 44px; }
.click-tool-panel { min-width: 0; color: #173f73; }
.click-tool-panel .control-section { margin: 12px 0; padding: 0; }
.click-tool-panel .step, .click-tool-panel .relief-note { display: none; }
.click-tool-panel legend { font-size: 14px; font-weight: 700; }
.click-tool-panel .size-control { display: grid; grid-template-columns: 1fr 62px; gap: 8px; margin: 16px 0; }
.click-tool-panel .size-control label { grid-column: 1; }
.click-tool-panel .size-control output { grid-column: 2; grid-row: 1; }
.click-tool-panel .size-control input { grid-column: 1 / -1; min-height: 32px; }
.click-tool-panel input:not([type="range"]):not([type="color"]):not([type="checkbox"]), .click-tool-panel select { max-width: 100%; min-width: 0; font-size: 16px; }
.click-source-tabs { display: flex; gap: 2px; border-bottom: 1px solid #173f7326; margin-bottom: 16px; }
.click-source-tabs button { flex: 1; min-width: 0; font-size: 12px; padding: 8px 3px; border: 0; border-bottom: 3px solid transparent; }
.click-source-tabs button[aria-selected="true"] { border-bottom-color: #173f73; background: #eee4f5; font-weight: 700; }
.click-sources > details { margin: 0; padding: 0; border: 0; background: none; }
.click-sources > details > summary { display: none; }
.click-tool-panel .preset-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.click-tool-panel .preset-card { min-width: 0; border-radius: 8px; }
.click-tool-panel .preset-card small { font-size: 11px; }
.click-tool-panel .content-types { display: grid; grid-template-columns: 1fr 1fr; }
.click-tool-panel .motif-options { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.click-tool-panel .surface-tabs { position: static; margin: 0 0 14px; }
.click-tool-panel .surface-tabs button { min-width: 0; font-size: 12px; }
.click-tool-panel .custom-colors { display: grid; grid-template-columns: 1fr 44px; margin: 0; }
.click-tool-panel .custom-colors label { grid-column: 1; display: flex; justify-content: space-between; font-size: 13px; }
.click-tool-panel .custom-colors input { width: 44px; height: 44px; }
.click-tool-panel #swap { grid-column: 2; grid-row: 1 / 3; }
.click-settings-group { border-bottom: 1px solid #173f7326; padding: 8px 0 14px; }
.click-settings-group > summary { font-weight: 700; cursor: pointer; min-height: 44px; padding: 10px 0; }
.click-settings-group .fit-report, .click-settings-group .print-plan, .click-settings-group .minimum-size { margin: 12px 0 0; padding: 12px 0; border: 0; border-radius: 0; background: none; }
.click-settings-group .fit-report button { max-width: 100%; white-space: normal; }
.click-tool-panel .art-separation { grid-template-columns: 1fr; }
.click-tool-panel .control-note, .click-tool-panel .print-plan p { font-size: 12px; overflow-wrap: anywhere; }
.click-editor-shell .preview-panel { position: relative; inset: auto; display: flex; flex-direction: column; width: 100%; height: 100%; min-height: 0; border: 0; border-radius: 0; box-shadow: none; background: #fbf6ea; overflow: hidden; }
.click-editor-shell .preview-top { padding: 12px 18px 0; }
.click-editor-shell .preview-label { font-size: 18px; }
.click-editor-shell .model-stage { flex: 1; min-height: 100px; height: auto; }
.click-editor-shell #model { position: absolute; inset: 0; width: 100%; height: 100%; min-height: 0; }
.click-editor-shell .mode-switch { margin: 8px auto 0; }
.click-editor-shell .press-nudge, .click-editor-shell .drag-hint, .click-editor-shell .sample-note { display: none; }
.click-editor-shell .view-tools { flex-shrink: 0; flex-wrap: wrap; justify-content: center; border-radius: 8px; margin: 4px auto; }
.click-editor-shell .view-tools button { padding: 6px 10px; border-radius: 6px; }
.click-editor-shell .view-tools > span { display: none; }
.click-editor-shell .click-box p { margin: 4px 0; font-size: 11px; }
.click-editor-shell .preview-bottom { padding: 6px 0; margin: 0 18px; }
.click-editor-shell .preview-bottom .mini-label { display: none; }
.click-editor-shell .preview-bottom strong { font-size: 12px; }
.click-editor-status { padding: 5px 18px 10px; color: #355a85; font-size: 11px; max-height: 82px; overflow: auto; }
.click-editor-status p { margin: 0; overflow-wrap: anywhere; }
.click-editor-status a { text-decoration: underline; }
.click-editor-shell #export-model { margin: 0; min-width: 0; font-size: 12px; padding: 8px 12px; background: #173f73; color: #fffdf8; }
.click-editor-shell #export-model img { display: none; }
.click-editor-shell #save { padding: 8px 12px; min-width: 0; font-size: 12px; }
@media (min-width: 1101px) {
  .click-editor-shell { grid-template-columns: 72px 280px minmax(0, 1fr); }
  .click-editor-shell.zl-panel-collapsed { grid-template-columns: 72px 0 minmax(0, 1fr); }
}
@media (max-width: 760px) {
  .click-editor-shell .model-stage { min-height: 40px; }
  .click-editor-shell { grid-template-rows: 100px minmax(140px, 1fr) minmax(100px, 36dvh) calc(66px + env(safe-area-inset-bottom)); }
  .click-editor-shell.zl-panel-collapsed { grid-template-rows: 100px minmax(140px, 1fr) 0 calc(66px + env(safe-area-inset-bottom)); }
  .click-editor-shell .zl-header { display: grid; grid-template-columns: 40px minmax(0, 1fr) 40px; grid-template-rows: 40px 40px; padding: 6px 12px; gap: 4px; }
  .click-editor-shell .zl-back { grid-area: 1 / 1; }
  .click-editor-shell .zl-brand { grid-area: 1 / 2; }
  .click-editor-shell .zl-title { max-width: none; font-size: 21px !important; }
  .click-editor-shell .zl-account { grid-area: 1 / 3; }
  .click-editor-shell .zl-header-actions { grid-area: 2 / 1; margin: 0; }
  .click-editor-shell .zl-commands { grid-area: 2 / 2 / 3 / 4; justify-content: end; margin: 0; }
  .click-editor-shell .zl-header-actions #save { font-size: 0 !important; width: 40px; height: 40px; padding: 4px !important; }
  .click-editor-shell .zl-commands #export-model { max-width: none; width: auto; font-size: 12px !important; white-space: nowrap; }
  .click-editor-shell .preview-top { padding: 6px 12px 0; }
  .click-editor-shell .preview-label, .click-editor-shell .preview-bottom, .click-editor-shell .click-box { display: none; }
  .click-editor-shell .counter { margin-left: auto; font-size: 10px; }
  .click-editor-shell .mode-switch { margin-top: 2px; }
  .click-editor-shell .view-tools { max-width: 100%; gap: 0; padding: 0 3px; border: 0; background: transparent; }
  .click-editor-shell .view-tools button { font-size: 10px; padding: 3px 6px; }
  .click-editor-shell .view-tools img { width: 16px; height: 16px; }
  .click-editor-status { padding: 2px 10px 6px; font-size: 10px; max-height: 48px; }
  .click-editor-shell #export-model { max-width: 152px; padding: 6px 8px; font-size: 11px; }
  .click-editor-shell #save { padding: 6px; font-size: 11px; }
}
@media (max-width: 760px) and (max-height: 600px) {
  .click-editor-shell { grid-template-rows: 100px minmax(100px, 1fr) 140px calc(66px + env(safe-area-inset-bottom)); }
  .click-editor-shell .preview-top { display: none; }
  .click-editor-shell .mode-switch { margin: 0 auto; }
  .click-editor-status { max-height: 26px; }
}
@media (max-width: 760px) and (max-height: 450px) {
  .click-editor-shell { grid-template-rows: 60px minmax(100px, 1fr) 90px calc(60px + env(safe-area-inset-bottom)); }
  .click-editor-shell.zl-panel-collapsed { grid-template-rows: 60px minmax(100px, 1fr) 0 calc(60px + env(safe-area-inset-bottom)); }
  .click-editor-shell .zl-header { display: flex; }
  .click-editor-shell .zl-header-actions { margin-left: auto; }
  .click-editor-shell .zl-commands { margin-left: 0; }
  .click-editor-status { max-height: 26px; }
  .click-editor-shell .mode-switch { position: absolute; left: 4px; top: 4px; z-index: 2; }
  .click-editor-shell .view-tools { position: absolute; right: 4px; bottom: 26px; z-index: 2; background: #fffcf5df; }
}
/* Approved shared editor surface; Click Click retains its pale lilac theme. */
html body .click-editor-shell.ze-standard-surface{--click-tint:#eee4f5}
html body .click-editor-shell .ze-add-content{background:var(--click-tint)!important}
html body .click-editor-shell .click-tool-panel .preset-options{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:0 0 18px}
html body .click-editor-shell .preset-card{display:flex;flex-direction:column;align-items:center;justify-content:center;height:104px;min-height:104px;padding:9px 5px;gap:4px;border:1px solid transparent;border-radius:12px;background:#eee8f4}
html body .click-editor-shell .preset-card svg{width:54px;height:54px;margin:0}
html body .click-editor-shell .preset-card strong{font:400 11px/18px inherit;white-space:nowrap;font-size:11px;font-weight:400;line-height:18px}
html body .click-editor-shell .preset-card[aria-pressed=true]{border-color:#173f73;background:#eee4f5}
html body .click-editor-shell .click-tool-panel fieldset{border:0;min-width:0}
html body .click-editor-shell .click-sources .custom-upload-details{margin-top:16px;border-top:1px solid #e7e1d5}
html body .click-editor-shell .click-sources .custom-upload-details>summary{display:list-item;padding:12px 0;font-size:14px}
html body .click-editor-shell .click-swap{display:block;width:100%;min-height:44px;margin:16px 0;padding:8px;border:1px solid #d7d1dc;border-radius:10px;background:#eee4f5;color:#173f73;font-size:13px}
html body .click-editor-shell .custom-color input{grid-area:auto}
html body .click-editor-shell .ze-palette .custom-colors{display:grid;grid-template-columns:minmax(0,1fr)}
html body .click-editor-shell .ze-palette .custom-color label{display:block;grid-column:1/-1}
html body .click-editor-shell .handdrawn-icon-preview{display:block;background-color:#8d6ca9;mask:var(--icon-url) center/contain no-repeat;-webkit-mask:var(--icon-url) center/contain no-repeat}
html body .click-editor-shell .handdrawn-icon-option{background:#eee8f4!important}
html body .click-editor-shell #icon-options{padding:3px;margin-top:6px}
html body .click-editor-shell .click-motifs>.control-note:empty{display:none}
html body .click-editor-shell .click-motifs #icon-settings{border-top:1px solid #e7e1d5;margin-top:16px;padding-top:12px}
html body .click-editor-shell :is(.icon-upload,#icon-settings>.control-note,.icon-edit-toolbar>span,.outline-field,.click-box,.preview-bottom){display:none}
html body .click-editor-shell #text-settings[hidden]{display:none!important}
html body .click-editor-shell #label{width:100%;min-height:76px;margin:8px 0 16px;border:1px solid #d7d6cf;border-radius:7px;background:#fff;font-size:16px;padding:10px}
html body .click-editor-shell .text-layer{width:100%}
html body .click-editor-shell .text-shape-details{margin:16px 0 0;padding:0;border:0;background:transparent}
html body .click-editor-shell .text-shape-details>summary{font-size:14px;padding:12px 0}
html body .click-editor-shell .suggestions{display:none}
html body .click-editor-shell .preview-top{padding:12px 22px 4px}
html body .click-editor-shell .model-stage{margin:0;min-height:200px}
html body .click-editor-shell .click-preview-actions{position:absolute;left:16px;bottom:12px;display:flex;gap:4px;padding:3px;background:#fffaf0ed;border:1px solid #d7d6cf;border-radius:9px;z-index:7}
html body .click-editor-shell .click-preview-actions button{font-family:inherit;font-size:12px;min-height:44px;padding:6px 9px;border:0;border-radius:6px;background:transparent;color:#173f73}
html body .click-editor-shell .click-preview-actions img{display:none}
html body .click-editor-shell .click-preview-actions button[aria-pressed=true]{background:#eee4f5}
html body .click-editor-shell .click-text-hit{position:absolute;z-index:10;min-height:44px;border:1px dashed #8d6ca9;background:transparent;border-radius:5px;cursor:text}
html body .click-editor-shell .click-text-hit:hover{background:#eee4f533}
html body .click-editor-shell .click-text-hit[hidden],html body .click-editor-shell #clickInlineText[hidden]{display:none!important}
html body .click-editor-shell #clickInlineText{font-family:inherit;font-size:24px;padding:8px;min-height:44px;box-sizing:border-box}
html body .click-editor-shell #pending-art-note{position:absolute;left:22px;bottom:72px;z-index:8;background:#fffaf0}
html body .click-editor-shell .counter{font:400 12px/1.5 inherit;font-size:12px}
html body .click-editor-shell .click-editor-status{padding:8px 0;max-height:none}
html body .click-editor-shell #icon-options button:disabled{opacity:.5}
html body .click-editor-shell .palette-option[aria-pressed=true]{background:#eee4f5}
html body .click-editor-shell #clickInlineText:focus{outline:2px solid #8d6ca9;outline-offset:2px}
/* Numbered setting summaries replace the old decorative section legends. */
html body .click-editor-shell .ze-settings-group .control-section>legend{display:none}

.click-source-modes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin-bottom:14px}.click-source-modes button{min-width:0;min-height:44px;padding:8px 3px;text-align:center;white-space:nowrap;border:1px solid #cfc2dd;border-radius:12px;background:#fffcf7;color:#65457e;font:600 13px/1.3 "PingFang SC",sans-serif}.click-source-modes button[aria-pressed=true]{background:#eee4f5;border-color:#826299}.click-source-modes button:before{content:'○';margin-right:4px}.click-source-modes button[aria-pressed=true]:before{content:'●'}.click-editor-shell #preset-options{grid-template-columns:repeat(2,minmax(0,1fr))}.click-editor-shell #clickTextShape>summary,.click-editor-shell .custom-upload-details>summary{display:none}.click-editor-shell .custom-upload-details{border:0;margin:0;padding:0}.click-editor-shell #click-panel-settings .ze-settings-group>summary{font-family:'PingFang SC','Microsoft YaHei',sans-serif!important;font-size:17px!important;font-weight:700!important;color:#60467a!important;display:flex;gap:12px;align-items:baseline}.click-editor-shell .click-setting-number{font:400 16px 'PingFang SC',sans-serif;color:#aa79bd}.click-editor-shell #click-panel-settings .ze-settings-group>summary::marker{content:''}.click-editor-shell #click-panel-settings .ze-settings-group>summary:before{display:none}.click-editor-shell .zl-tool:disabled{opacity:.38;cursor:not-allowed}.click-layer-row{display:flex;gap:6px;margin:8px 0}.click-layer-row>button:first-child{flex:1;text-align:left;padding:10px;border:1px solid #d4c3df;border-radius:10px;background:#fffaf5}.click-layer-row>button[aria-pressed=true]{background:#eee4f5;border-color:#826299}.click-layer-row>button:last-child{padding:8px;background:transparent;border:0;font-size:12px;color:#76568f}.click-layer-editor{position:absolute;inset:0;z-index:5;pointer-events:none}.click-layer-editor svg{width:100%;height:100%;overflow:visible}.click-layer-hit{fill:transparent;stroke:none;pointer-events:all;cursor:move}.click-layer-hit.selected{stroke:#86659e;stroke-width:1.5;stroke-dasharray:5 3}.click-layer-handle{fill:#fffaf3;stroke:#86659e;stroke-width:2;pointer-events:all;cursor:nwse-resize}.click-layer-handle[data-op=rotate]{cursor:grab}.click-layer-stem{fill:none;stroke:#86659e;stroke-width:1.5}.click-hanger-handle{fill:#b68ccc33;stroke:#86659e;stroke-width:1.5;stroke-dasharray:3 3;pointer-events:all;cursor:grab}.click-editor-shell .ze-inline-text{z-index:8}.click-editor-shell #source-settings{display:none!important}

/* Same direct canvas controls as Frame: generous hit areas with small visible dots. */
.click-layer-control{pointer-events:all;touch-action:none;cursor:move}
.click-layer-control[data-op=scale]{cursor:nwse-resize}
.click-layer-control[data-op=rotate]{cursor:grab}
.click-layer-touch{fill:transparent;stroke:none;pointer-events:all}
.click-layer-control .click-layer-handle{pointer-events:none}
.click-layer-glyph{fill:#86659e;font:16px sans-serif;pointer-events:none}
.click-layer-hit,.click-hanger-handle{touch-action:none}
html body .click-editor-shell #press{display:none!important}

#base-style,#switch-type{display:block;width:100%;margin:10px 0;padding:10px 12px;border:1px solid #c9bdd5;border-radius:10px;background:#fffaf3;color:inherit;font:inherit;}