/*
 * Fold-/GM-Screen-Editor. Nutzt dieselbe Design-Sprache wie der kompakte
 * Editor (waldemaster-monster-card-editor/public/css/public.css: Teal/Gold/
 * Pergament, Georgia-Serife, flache 1px-Konturen) und dieselbe Karten-Optik
 * (Petrol-Rahmen, Gold-Linien, Pergament, WALDEMASTER-Schriftzug), damit
 * beide Seiten wie aus einer Hand wirken.
 *
 * Alle Regeln sind unter #wmce-monster-fold gescoped, damit dieser Editor
 * und der kompakte Editor sich nicht die globalen .wmx-* Klassen ueber-
 * schreiben, falls beide Shortcodes je auf derselben Seite landen.
 *
 * Die Karte selbst ist hier NICHT in mm gebaut (anders als der kompakte
 * Editor), sondern als responsives Querformat (aspect-ratio 190/132.5) mit
 * px-Positionen. Der Druck (fold.js -> buildFoldPrintHTML) rechnet dagegen
 * in echten mm auf eine A4-Seite zum Falten.
 */
#wmce-monster-fold.wmx{
  --wmx-teal:#0c857b; --wmx-teal-light:#49a49c; --wmx-teal-tint:#e7f3f2;
  --wmx-gold:#c9a35c; --wmx-gold-tint:#f7f0e2;
  --wmx-parchment-dark:#e5e1d6; --wmx-panel:#faf7f0;
  --wmx-ink:#262421; --wmx-on-teal:#ffffff;
  --wmx-muted:#6b6558; --wmx-muted2:#8a8474;
  --wmx-surface:#ffffff; --wmx-divider:var(--wmx-parchment-dark);
  --wmx-radius:8px;

  --card-petrol:#0d5f5a;
  --card-gold:#d6a340;

  font-family: Georgia, 'Times New Roman', serif;
  color:var(--wmx-ink);
}
#wmce-monster-fold *{ box-sizing:border-box; }

/* ===== Vertikales Layout: Einstellungen oben, Vorschau, dann Formular ===== */
#wmce-monster-fold .wmx-shell{
  display:flex; flex-direction:column; align-items:stretch;
  gap:22px; width:100%; max-width:1180px; margin:0 auto;
}

#wmce-monster-fold .wmx-side-head{ padding:6px 4px 12px; }
#wmce-monster-fold .wmx-side-head-top{ display:flex; align-items:center; justify-content:space-between; gap:10px; }
#wmce-monster-fold .wmx-title{ margin:0; font-weight:700; font-size:20px; letter-spacing:.2px; }
#wmce-monster-fold .wmx-sub{ color:var(--wmx-muted2); margin-top:4px; font-size:12.5px; }

/* Sprachumschalter */
#wmce-monster-fold .wmg-lang-toggle{ display:inline-flex; border:1px solid rgba(15,23,32,.2); border-radius:4px; overflow:hidden; }
#wmce-monster-fold .wmg-lang-btn{
  appearance:none; -webkit-appearance:none; border:0;
  background:#fff !important; color:#5a6472 !important;
  font:inherit; font-size:11px; font-weight:700; letter-spacing:.06em;
  padding:4px 10px; min-height:24px; cursor:pointer;
  transition: background .15s ease, color .15s ease;
}
#wmce-monster-fold .wmg-lang-btn + .wmg-lang-btn{ border-left:1px solid rgba(15,23,32,.2); }
#wmce-monster-fold .wmg-lang-btn:hover{ color:#0c857b !important; }
#wmce-monster-fold .wmg-lang-btn.active{ background:#0c857b !important; color:#fff !important; }

/* ===== Einstellungen als horizontales Bedienpanel ===== */
#wmce-monster-fold .wmx-panel{
  display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)); gap:16px;
  align-items:start; width:100%;
  background:var(--wmx-surface); border:1px solid var(--wmx-divider);
  border-radius:var(--wmx-radius); padding:18px;
}
#wmce-monster-fold .wmx-panel-h{
  grid-column:1 / -1; margin:0;
  font-weight:700; font-size:12px; letter-spacing:.35px; text-transform:uppercase; color:var(--wmx-ink);
}
#wmce-monster-fold .wmx-row2{ display:contents; }
@media (max-width:980px){
  #wmce-monster-fold .wmx-panel{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
}
@media (max-width:640px){
  #wmce-monster-fold .wmx-panel{ grid-template-columns:1fr; }
}

#wmce-monster-fold .wmx-field{ min-width:0; display:flex; flex-direction:column; gap:6px; }
#wmce-monster-fold .wmx-label{ display:block; font-size:11px; color:var(--wmx-ink); font-weight:700; text-transform:uppercase; letter-spacing:.03em; }

#wmce-monster-fold .wmx-input,
#wmce-monster-fold .wmx-textarea{
  width:100%; background:#fff; border:1px solid var(--wmx-divider); border-radius:4px;
  padding:8px 10px; outline:none; font-size:14px; color:var(--wmx-ink); font-family:inherit;
}
#wmce-monster-fold .wmx-input:focus,
#wmce-monster-fold .wmx-textarea:focus{
  border-color:var(--wmx-teal); box-shadow:0 0 0 2px var(--wmx-teal-tint);
}
#wmce-monster-fold .wmx-input::placeholder,
#wmce-monster-fold .wmx-textarea::placeholder{ color:var(--wmx-muted2); }
#wmce-monster-fold .wmx-textarea{ min-height:132px; resize:vertical; line-height:1.45; }

#wmce-monster-fold .wmx-file{
  display:flex; align-items:center; justify-content:center; gap:8px; padding:9px 12px;
  border:1px solid var(--wmx-teal); border-radius:4px; background:#fff; cursor:pointer;
  width:100%; min-height:40px;
}
#wmce-monster-fold .wmx-file:hover{ background:var(--wmx-teal); }
#wmce-monster-fold .wmx-file:hover span{ color:var(--wmx-on-teal); }
#wmce-monster-fold .wmx-file input{ display:none; }
#wmce-monster-fold .wmx-file span{ font-weight:700; color:var(--wmx-teal); overflow-wrap:break-word; text-align:center; }

#wmce-monster-fold .wmx-seg{ display:flex; flex-direction:column; border:1px solid var(--wmx-teal); border-radius:4px; overflow:hidden; }
#wmce-monster-fold .wmx-segbtn{
  border:0; border-top:1px solid var(--wmx-teal);
  background:#fff; padding:9px 10px; font-weight:700; cursor:pointer; color:var(--wmx-teal); font-family:inherit;
  white-space:normal; overflow-wrap:break-word; text-align:center; line-height:1.3;
}
#wmce-monster-fold .wmx-segbtn:first-child{ border-top:0; }
#wmce-monster-fold .wmx-segbtn:not(.active):hover{ background:var(--wmx-teal-tint); }
#wmce-monster-fold .wmx-segbtn.active{ background:var(--wmx-teal); color:var(--wmx-on-teal); }

#wmce-monster-fold .wmx-actions{ display:flex; flex-direction:column; gap:10px; margin-top:12px; }
#wmce-monster-fold .wmx-side-actions{ margin-top:0; }
#wmce-monster-fold .wmx-inline-actions{ flex-direction:row; flex-wrap:wrap; }
#wmce-monster-fold .wmx-inline-actions .wmx-btn{ flex:1 1 180px; }
#wmce-monster-fold .wmx-btn{
  border:1px solid var(--wmx-teal); border-radius:4px; padding:10px 14px; font-weight:700; cursor:pointer;
  background:var(--wmx-teal); color:var(--wmx-on-teal); font-family:inherit; min-height:40px;
  white-space:normal; overflow-wrap:break-word; text-align:center; line-height:1.3;
  transition: background .15s ease, color .15s ease, border-color .15s ease;
}
#wmce-monster-fold .wmx-btn:hover{ background:var(--wmx-teal-light); border-color:var(--wmx-teal-light); }
#wmce-monster-fold .wmx-btn-ghost{ background:#fff; color:var(--wmx-teal); }
#wmce-monster-fold .wmx-btn-ghost:hover{ background:var(--wmx-teal); color:var(--wmx-on-teal); }

#wmce-monster-fold .wmx-hint{ margin-top:6px; font-size:12px; color:var(--wmx-muted2); line-height:1.4; }

#wmce-monster-fold .wmx-tip{
  padding:12px; border:1px solid var(--wmx-divider); border-radius:var(--wmx-radius); background:var(--wmx-panel);
}
#wmce-monster-fold .wmx-tip-h{ font-size:11px; font-weight:700; letter-spacing:.35px; text-transform:uppercase; color:var(--wmx-muted2); margin-bottom:6px; }
#wmce-monster-fold .wmx-tip-p{ color:var(--wmx-muted); font-size:13px; line-height:1.45; }

/* ===== Main + vertikales Grid ===== */
#wmce-monster-fold .wmx-main{ width:100%; }
#wmce-monster-fold .wmx-grid{ display:flex; flex-direction:column; gap:22px; align-items:stretch; width:100%; }

#wmce-monster-fold .wmx-cardstack{ width:100%; display:flex; flex-direction:column; gap:14px; }
#wmce-monster-fold .wmx-cardwrap{ width:100%; }
#wmce-monster-fold .wmx-card{
  width:100%; max-width:900px; margin:0 auto;
  aspect-ratio:190 / 132.5; height:auto;
  border-radius:16px; position:relative; overflow:hidden;
  background:var(--card-petrol);
  box-shadow: 0 18px 26px rgba(0,0,0,.25);
}

#wmce-monster-fold .wmx-sizebox{
  width:100%; max-width:900px; margin:0 auto;
  background:var(--wmx-panel); border:1px solid var(--wmx-divider);
  border-radius:var(--wmx-radius); padding:12px 16px;
}
#wmce-monster-fold .wmx-size-h{ font-weight:700; letter-spacing:.35px; text-transform:uppercase; font-size:11px; color:var(--wmx-muted2); }
#wmce-monster-fold .wmx-size-v{ margin-top:6px; font-weight:700; font-size:14px; color:var(--wmx-ink); }
#wmce-monster-fold .wmx-size-sub{ margin-top:5px; font-size:12px; color:var(--wmx-muted2); line-height:1.35; }

#wmce-monster-fold .wmx-mflip{
  position:absolute; top:10px; right:10px; z-index:50;
  border:1px solid var(--wmx-teal); border-radius:999px; padding:8px 14px;
  font-weight:700; cursor:pointer; font-family:inherit;
  background:var(--wmx-teal); color:var(--wmx-on-teal); display:none;
}
#wmce-monster-fold .wmx-mflip:hover{ background:var(--wmx-teal-light); border-color:var(--wmx-teal-light); }
@media (max-width:980px){ #wmce-monster-fold .wmx-mflip{ display:block; } }

#wmce-monster-fold .wmx-card-inner{ width:100%; height:100%; position:absolute; inset:0; transform-style:preserve-3d; transition:transform .6s cubic-bezier(.2,.8,.2,1); }
#wmce-monster-fold .wmx-card-inner.is-flipped{ transform:rotateY(180deg); }
#wmce-monster-fold .wmx-face{ position:absolute; inset:0; backface-visibility:hidden; border-radius:16px; overflow:hidden; }
#wmce-monster-fold .wmx-back{ transform:rotateY(180deg); }

/* ===== Karte (Waldemaster-Optik: Petrol/Gold/Pergament) ===== */
#wmce-monster-fold .wmx-printCard{
  position:relative; width:100%; height:100%; border-radius:10px; overflow:hidden;
  border:12px solid var(--card-petrol);
  background:
    radial-gradient(520px 360px at 30% 20%, rgba(255,255,255,.55), rgba(255,255,255,0) 60%),
    linear-gradient(180deg, #f4e8d2 0%, #efe1c6 100%);
}
#wmce-monster-fold .wmx-printTop{ position:absolute; left:0; right:0; top:0; padding:12px 14px; background:var(--card-petrol); }
#wmce-monster-fold .wmx-printBrand{
  color:#fff; font-weight:900; letter-spacing:.10em; font-size:14px; line-height:1; text-align:center; white-space:nowrap;
  font-family:"Cinzel","Trajan Pro",Georgia,"Times New Roman",serif; text-transform:uppercase;
}

#wmce-monster-fold .wmx-printArt{
  position:absolute; left:14px; right:14px; top:48px; bottom:36px; border-radius:12px;
  background:radial-gradient(240px 240px at 50% 40%, rgba(0,0,0,.06), rgba(0,0,0,0) 55%), rgba(255,255,255,.35);
  display:flex; align-items:center; justify-content:center; overflow:hidden;
}
#wmce-monster-fold .wmx-printImg{ max-width:100%; max-height:100%; display:none; object-fit:contain; filter:drop-shadow(0 14px 14px rgba(0,0,0,.18)); }
#wmce-monster-fold .wmx-printNoArt{ font-weight:900; color:rgba(0,0,0,.45); letter-spacing:.06em; font-family:ui-sans-serif,system-ui,Segoe UI,Roboto,Arial; }

#wmce-monster-fold .wmx-printName{
  position:absolute; left:0; right:0; bottom:0; padding:10px 14px;
  background:rgba(13,95,90,.95); color:#fff; font-weight:950; font-size:22px; text-align:center;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
  font-family:"Cinzel","Trajan Pro",Georgia,"Times New Roman",serif;
}

#wmce-monster-fold .wmx-backViewport{ position:absolute; left:0; right:0; top:0; bottom:24px; overflow:hidden; }
#wmce-monster-fold .wmx-backScale{ position:absolute; left:0; top:0; transform-origin:top left; width:100%; padding:12px 14px 0; will-change:transform,width,top; }

#wmce-monster-fold .wmx-backTitle{
  font-weight:950; font-size:24px; line-height:1.05; color:#111; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
  font-family:"Cinzel","Trajan Pro",Georgia,"Times New Roman",serif;
}
#wmce-monster-fold .wmx-backSub{ margin-top:4px; font-size:13px; font-weight:800; color:rgba(0,0,0,.70); }

#wmce-monster-fold .wmx-hr{ height:3px; background:rgba(214,163,64,.75); margin:8px 0; border-radius:999px; }
#wmce-monster-fold .wmx-line3{ display:grid; grid-template-columns:1fr 1fr 1fr; gap:10px; font-size:13px; color:#111; }
#wmce-monster-fold .wmx-line3 b{ font-weight:950; }

#wmce-monster-fold .wmx-abi{ display:grid; grid-template-columns:repeat(6,1fr); gap:8px; }
#wmce-monster-fold .wmx-abiBox{ background:transparent; border:0; padding:0; text-align:center; display:flex; flex-direction:column; align-items:center; justify-content:center; overflow:hidden; min-height:34px; }
#wmce-monster-fold .wmx-abiK{ font-size:10px; font-weight:950; letter-spacing:.08em; text-transform:uppercase; line-height:1; white-space:nowrap; color:var(--card-petrol); }
#wmce-monster-fold .wmx-abiV{ margin-top:4px; font-size:11px; font-weight:400; line-height:1.05; white-space:nowrap; color:#111; }

#wmce-monster-fold .wmx-small{ font-size:12px; line-height:1.25; color:#111; display:grid; gap:5px; }
#wmce-monster-fold .wmx-small b{ font-weight:950; }

#wmce-monster-fold .wmx-blockH{ font-size:11px; font-weight:950; letter-spacing:.10em; text-transform:uppercase; color:var(--card-petrol); margin-bottom:4px; }
#wmce-monster-fold .wmx-blockT{ font-size:12px; line-height:1.23; color:#111; white-space:pre-wrap; }

#wmce-monster-fold .wmx-footRed{
  position:absolute; left:0; right:0; bottom:0; height:24px;
  background:transparent; color:var(--card-petrol); font-weight:950; font-size:10px;
  padding:3px 14px; display:flex; justify-content:space-between; align-items:center;
  font-family:"Cinzel","Trajan Pro",Georgia,"Times New Roman",serif;
}

/* ===== Formular ===== */
#wmce-monster-fold .wmx-cardpanel{
  width:100%; background:var(--wmx-surface); border:1px solid var(--wmx-divider);
  border-radius:var(--wmx-radius); padding:18px;
}
#wmce-monster-fold .wmx-form-head{
  display:flex; align-items:flex-end; justify-content:space-between; gap:16px;
  border-bottom:2px solid var(--wmx-teal); padding:0 0 14px; margin-bottom:16px;
}
#wmce-monster-fold .wmx-form-title{ margin:0 0 4px; font-weight:700; font-size:18px; letter-spacing:.2px; }
#wmce-monster-fold .wmx-form-sub{ color:var(--wmx-muted2); font-size:13px; line-height:1.35; }
#wmce-monster-fold .wmx-form-note{ text-align:right; white-space:nowrap; }

#wmce-monster-fold .wmx-section{
  border:1px solid var(--wmx-divider); border-left:4px solid var(--wmx-gold);
  border-radius:var(--wmx-radius); background:#fff; padding:16px; margin-top:16px;
}
#wmce-monster-fold .wmx-section:first-of-type{ margin-top:0; }
#wmce-monster-fold .wmx-section-h{
  margin:0 0 14px; font-weight:700; font-size:11px; letter-spacing:.35px; text-transform:uppercase; color:var(--wmx-muted2);
}

#wmce-monster-fold .wmx-formgrid{ display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:14px; }
#wmce-monster-fold .wmx-span2{ grid-column:span 2; }
@media (max-width:1200px){
  #wmce-monster-fold .wmx-formgrid{ grid-template-columns:1fr; }
  #wmce-monster-fold .wmx-span2{ grid-column:auto; }
}

#wmce-monster-fold .wmx-abigrid{ display:grid; grid-template-columns:repeat(6, minmax(0, 1fr)); gap:12px; }
@media (max-width:1200px){
  #wmce-monster-fold .wmx-abigrid{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
}

#wmce-monster-fold .wmx-textgrid{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
#wmce-monster-fold .wmx-wide{ grid-column:1 / -1; }
@media (max-width:1200px){
  #wmce-monster-fold .wmx-textgrid{ grid-template-columns:1fr; }
}

#wmce-monster-fold .wmx-csvgrid{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
@media (max-width:1200px){
  #wmce-monster-fold .wmx-csvgrid{ grid-template-columns:1fr; }
}
#wmce-monster-fold .wmx-mono{ font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size:12px; }
#wmce-monster-fold .wmx-csvbox{ min-height:160px; }

@media print{ #wmce-monster-fold{ display:none !important; } }

/* Sprachspezifische Bloecke (Standard ohne JS = Englisch) */
#wmce-monster-fold [data-wmg-show="de"]{ display:none; }
body.wmg-lang-de #wmce-monster-fold [data-wmg-show="de"]{ display:block; }
body.wmg-lang-de #wmce-monster-fold [data-wmg-show="en"]{ display:none; }

/*
 * ===== Harte Anti-Magenta-Schicht =====
 * Das Waldemaster-Seiten-Theme faerbt Buttons (auch :hover/:focus/:active)
 * magenta und nutzt teils selbst !important. Ueber die Editor-ID
 * #wmce-monster-fold + !important gewinnen diese Regeln, damit ueberall
 * Teal statt Theme-Magenta greift (gleiches Muster wie im kompakten Editor).
 */
#wmce-monster-fold .wmx-btn,
#wmce-monster-fold .wmx-btn:visited{
  background:var(--wmx-teal) !important; color:var(--wmx-on-teal) !important;
  border:1px solid var(--wmx-teal) !important;
  box-shadow:none !important; text-shadow:none !important; text-decoration:none !important; outline:none !important;
}
#wmce-monster-fold .wmx-btn:hover,
#wmce-monster-fold .wmx-btn:focus,
#wmce-monster-fold .wmx-btn:focus-visible,
#wmce-monster-fold .wmx-btn:active{
  background:var(--wmx-teal-light) !important; color:var(--wmx-on-teal) !important; border-color:var(--wmx-teal-light) !important;
}
#wmce-monster-fold .wmx-btn-ghost,
#wmce-monster-fold .wmx-btn-ghost:visited{
  background:#fff !important; color:var(--wmx-teal) !important; border:1px solid var(--wmx-teal) !important;
}
#wmce-monster-fold .wmx-btn-ghost:hover,
#wmce-monster-fold .wmx-btn-ghost:focus,
#wmce-monster-fold .wmx-btn-ghost:focus-visible,
#wmce-monster-fold .wmx-btn-ghost:active{
  background:var(--wmx-teal) !important; color:var(--wmx-on-teal) !important; border-color:var(--wmx-teal) !important;
}
#wmce-monster-fold .wmx-segbtn{
  background:#fff !important; color:var(--wmx-teal) !important; border-top-color:var(--wmx-teal) !important;
  box-shadow:none !important; text-shadow:none !important; outline:none !important;
}
#wmce-monster-fold .wmx-segbtn.active{ background:var(--wmx-teal) !important; color:var(--wmx-on-teal) !important; }
#wmce-monster-fold .wmx-file{ background:#fff !important; border:1px solid var(--wmx-teal) !important; box-shadow:none !important; }
#wmce-monster-fold .wmx-file:hover{ background:var(--wmx-teal) !important; }
#wmce-monster-fold .wmx-file span{ color:var(--wmx-teal) !important; }
#wmce-monster-fold .wmx-file:hover span{ color:var(--wmx-on-teal) !important; }

/* ------------------------------------------------------------------
 * Import-Icon (Pfeil in Ablage) fuer alle Import-Buttons: als Mask ueber
 * currentColor statt Inline-SVG im Markup, weil der Sprachwechsel
 * (i18n-Baustein) textContent ersetzt und ein SVG im Element loeschen
 * wuerde; ::before bleibt davon unberuehrt und folgt der Textfarbe
 * automatisch (auch beim Hover).
 * ------------------------------------------------------------------ */
#wmceImportFromText::before,
#wmceImportFile + span::before{
  content:""; display:inline-block; width:14px; height:14px;
  margin-right:7px; vertical-align:-2px; background:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 13V3'/%3E%3Cpath d='m8 7 4-4 4 4'/%3E%3Cpath d='M4 15v4a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-4'/%3E%3C/svg%3E") center / contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 13V3'/%3E%3Cpath d='m8 7 4-4 4 4'/%3E%3Cpath d='M4 15v4a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-4'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* ------------------------------------------------------------------
 * Aktions-Icons (gleiches Muster wie das Import-Icon: Mask ueber
 * currentColor per ::before; uebersteht den EN/DE-Sprachwechsel und
 * folgt der Textfarbe inkl. Hover). Basisregel + je Icon die Mask.
 * ------------------------------------------------------------------ */
#wmceCopyPreview::before,
#wmceExportTXT::before,
#wmceExportPrint::before,
#wmceReset::before,
#wmceImageInput + span::before{
  content:""; display:inline-block; width:14px; height:14px;
  margin-right:7px; vertical-align:-2px; background:currentColor;
  -webkit-mask-position:center; -webkit-mask-size:contain; -webkit-mask-repeat:no-repeat;
  mask-position:center; mask-size:contain; mask-repeat:no-repeat;
}
#wmceCopyPreview::before{ -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='9' y='9' width='11' height='11' rx='2'/%3E%3Cpath d='M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1'/%3E%3C/svg%3E"); mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='9' y='9' width='11' height='11' rx='2'/%3E%3Cpath d='M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1'/%3E%3C/svg%3E"); }
#wmceExportTXT::before{ -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3v10'/%3E%3Cpath d='m8 9 4 4 4-4'/%3E%3Cpath d='M4 15v4a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-4'/%3E%3C/svg%3E"); mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3v10'/%3E%3Cpath d='m8 9 4 4 4-4'/%3E%3Cpath d='M4 15v4a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-4'/%3E%3C/svg%3E"); }
#wmceExportPrint::before{ -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9V3h12v6'/%3E%3Cpath d='M6 18H4a2 2 0 0 1-2-2v-5a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2v5a2 2 0 0 1-2 2h-2'/%3E%3Crect x='6' y='14' width='12' height='7'/%3E%3C/svg%3E"); mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9V3h12v6'/%3E%3Cpath d='M6 18H4a2 2 0 0 1-2-2v-5a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2v5a2 2 0 0 1-2 2h-2'/%3E%3Crect x='6' y='14' width='12' height='7'/%3E%3C/svg%3E"); }
#wmceReset::before{ -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 4v6h6'/%3E%3Cpath d='M3.5 15a9 9 0 1 0 2.1-9.4L3 10'/%3E%3C/svg%3E"); mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 4v6h6'/%3E%3Cpath d='M3.5 15a9 9 0 1 0 2.1-9.4L3 10'/%3E%3C/svg%3E"); }
#wmceImageInput + span::before{ -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='18' height='18' rx='2'/%3E%3Ccircle cx='8.5' cy='8.5' r='1.5'/%3E%3Cpath d='m21 15-5-5L5 21'/%3E%3C/svg%3E"); mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='18' height='18' rx='2'/%3E%3Ccircle cx='8.5' cy='8.5' r='1.5'/%3E%3Cpath d='m21 15-5-5L5 21'/%3E%3C/svg%3E"); }
