/* Baleal · diseño de la tarjeta (sql/07) y diseñador del panel › Tarjeta.
   La tarjeta usa --t-* (tema del negocio) y --t-ang (ángulo del degradado). Animaciones < 300 ms, ease-out. */

/* --- degradado y logo --- */
.card,.sx-themed{background:linear-gradient(var(--t-ang,155deg),var(--t-bg1),var(--t-bg2))}
.av{background:linear-gradient(var(--t-ang,145deg),var(--t-bg1),var(--t-bg2))}
.av.logo{background:#fff;overflow:hidden;padding:0}
.av.logo img{width:100%;height:100%;object-fit:cover;border-radius:50%;display:block}
.av.lg{width:64px;height:64px;font-size:20px}
.av.sx-blogo{width:60px;height:60px;margin-bottom:14px;box-shadow:0 0 0 2px rgba(255,255,255,.35)}
.dots i.pz{border-style:solid;border-color:var(--t-ink)}
.dots .drow:first-child i.pz:first-child{border:0}

/* --- mensaje de la tarjeta --- */
.card .cmsg{margin:-4px 0 0;font-weight:600;font-size:17px;line-height:1.35;color:var(--t-ink);text-wrap:pretty}
.stamp img{width:64%;height:64%;border-radius:50%;object-fit:cover;display:block}

/* --- patrones (sutiles, se desvanecen hacia abajo) --- */
.pat{position:absolute;inset:0;pointer-events:none;--pc:color-mix(in srgb,var(--t-ink) 15%,transparent);-webkit-mask:linear-gradient(165deg,#000 10%,transparent 85%);mask:linear-gradient(165deg,#000 10%,transparent 85%)}
.card>.pat{position:absolute;z-index:0}
.pat-puntos{background:radial-gradient(var(--pc) 1.3px,transparent 1.7px) 0 0/14px 14px}
.pat-lineas{background:repeating-linear-gradient(0deg,var(--pc) 0 1px,transparent 1px 11px)}
.pat-cuadricula{background:linear-gradient(var(--pc) 1px,transparent 1px) 0 0/18px 18px,linear-gradient(90deg,var(--pc) 1px,transparent 1px) 0 0/18px 18px}
.pat-diagonal{background:repeating-linear-gradient(45deg,var(--pc) 0 1px,transparent 1px 10px)}
.pat-ondas{background:radial-gradient(circle at 50% 100%,transparent 8px,var(--pc) 8.5px 9.5px,transparent 10px) 0 0/20px 10px}
.pat-ninguno{display:none}

/* --- estilos de sello (clásico = el de siempre) --- */
.est-minimal .stamp{border:1px solid var(--t-line);font-weight:600;font-size:13px}
.est-minimal .stamp.on{background:var(--t-on);background-image:none;box-shadow:none;border:0}
.est-translucido .stamp{border:0;background:color-mix(in srgb,var(--t-ink) 9%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--t-ink) 16%,transparent)}
.est-translucido .stamp.on{background:color-mix(in srgb,var(--t-ink) 22%,transparent);background-image:linear-gradient(160deg,color-mix(in srgb,var(--t-ink) 20%,transparent),transparent);color:var(--t-ink);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--t-ink) 42%,transparent),0 6px 14px -8px rgba(0,0,0,.45);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.est-brillante .stamp{border:1.5px solid color-mix(in srgb,var(--c-gold) 70%,var(--t-ink))}
.est-brillante .stamp.on{border:0;background:linear-gradient(145deg,var(--c-gold-hi) 0%,var(--c-gold) 45%,var(--c-gold-lo) 100%);color:var(--c-gold-ink);box-shadow:inset 0 1px 0 rgba(255,255,255,.7),inset 0 -2px 4px rgba(90,60,10,.35),0 4px 10px -4px rgba(0,0,0,.55)}

/* --- estilo Wallet (vista previa) --- */
.wal{width:100%;max-width:340px;border-radius:22px;overflow:hidden;background:var(--t-bg2);color:var(--t-ink);box-shadow:0 26px 50px -30px rgba(12,11,10,.6);display:flex;flex-direction:column}
.wal-top{display:flex;align-items:center;gap:10px;padding:14px 16px;background:var(--t-bg1)}
.wal-top .av{box-shadow:none}
.wal-top b{flex:1;min-width:0;font-size:15px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wal-pts{text-align:right;font-weight:700;font-size:17px;font-variant-numeric:tabular-nums;line-height:1.1}
.wal-pts small,.wal-f small{display:block;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--t-soft);font-weight:700}
.wal-strip{position:relative;padding:16px;background:linear-gradient(var(--t-ang,155deg),var(--t-bg1),var(--t-bg2))}
/* El pase de Wallet es una franja ancha: siempre 2 filas */
.wal-strip .stamps{position:relative;container:none}
.wal-strip .sg{row-gap:8px;column-gap:4px}
.wal-strip .stamp{font-size:12px}
.wal-f{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:14px 16px 4px}
.wal-f b{font-size:15px;display:block;overflow-wrap:anywhere}
.wal-msg{margin:6px 16px 0;font-size:14px;color:var(--t-soft)}
.wal-qr{margin:14px auto 16px;background:#fff;padding:10px;border-radius:12px;width:132px;height:132px}
.wal-qr svg{width:100%;height:100%;display:block}

/* --- diseñador (panel › Tarjeta) --- */
.tabs{grid-template-columns:repeat(5,1fr)}
.dz{display:flex;flex-direction:column;gap:16px}
.dz-f{display:flex;flex-direction:column;gap:12px}
.dz-pv{display:flex;flex-direction:column;gap:12px;background:var(--soft2);border:1px solid var(--line);border-radius:24px;padding:14px;scroll-margin-top:12px}
.dz-pvh{display:flex;align-items:center;justify-content:space-between;gap:10px}
.dz .live{display:inline-flex;align-items:center;gap:6px;color:var(--ok);font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase}
.dz .live::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor;box-shadow:0 0 0 3px rgba(21,128,61,.15)}
.dz-stage{display:flex;justify-content:center}
.dz-stage .phone{width:100%;max-width:360px;background:#fff;border:1px solid var(--line);border-radius:30px;padding:18px 14px;display:flex;flex-direction:column;gap:12px;box-shadow:0 24px 50px -34px rgba(12,11,10,.45)}
.dz-stage .phone .card{transform:none;transition:none}
.dz-sim{display:flex;align-items:center;justify-content:center;gap:14px}
.dz-sim output{min-width:128px;text-align:center;font-weight:700;font-size:15px;font-variant-numeric:tabular-nums}
.dz .pvnote{margin:0;font-size:13px;color:var(--muted);text-align:center;text-wrap:pretty}

.ib{appearance:none;width:44px;height:44px;border-radius:12px;border:1.5px solid var(--line);background:var(--bg);color:var(--ink);display:grid;place-items:center;cursor:pointer;flex:none;padding:0;transition:transform .16s cubic-bezier(.23,1,.32,1),border-color .15s}
.ib svg{width:18px;height:18px}
.ib:active{transform:scale(.97)}
.ib.lg{width:48px;height:48px;border-radius:50%}
.ib:focus-visible{outline:3px solid var(--c-focus);outline-offset:2px}

.seg{display:flex;flex-wrap:wrap;gap:4px;background:var(--soft);border-radius:14px;padding:4px}
.seg-o,.seg-b{position:relative;flex:1 1 auto;min-height:44px;display:flex;align-items:center;justify-content:center;gap:6px;padding:0 12px;border-radius:11px;font-size:14px;font-weight:600;color:var(--muted);cursor:pointer;transition:background .2s,color .2s,box-shadow .2s}
.seg-b{appearance:none;border:0;background:none;font-weight:700;font-size:13px;font-family:inherit}
.seg-o:has(input:checked),.seg-b[aria-pressed=true]{background:#fff;color:var(--ink);box-shadow:0 1px 2px rgba(11,11,13,.12),0 6px 12px -8px rgba(11,11,13,.35)}
.seg-o:has(input:focus-visible),.seg-b:focus-visible{outline:3px solid var(--c-focus);outline-offset:2px}
.seg.sm{flex-wrap:nowrap}
.seg.wrap .seg-o{flex:1 1 40%}

.fs{border:0;padding:0;margin:0;min-width:0}
.fs legend{padding:0;margin-bottom:8px}
.dz .lbl{font-size:13px;font-weight:600;color:var(--ink)}
.dz label>div:first-child{font-size:13px;font-weight:600;margin-bottom:6px;color:var(--ink)}
.dz label>div span{font-weight:500;color:var(--muted)}
.dz select{width:100%;padding:13px 12px;border-radius:14px;border:1.5px solid var(--line);background:var(--soft2);font-size:16px;color:var(--ink);font-family:inherit}
.dz .two{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.dz .two>*{min-width:0}

details.dz-s{border:1px solid var(--line);border-radius:20px;background:var(--bg)}
.dz-s summary{list-style:none;display:flex;align-items:center;gap:12px;padding:12px 16px;min-height:64px;cursor:pointer;border-radius:20px}
.dz-s summary::-webkit-details-marker{display:none}
.dz-s summary:focus-visible{outline:3px solid var(--c-focus);outline-offset:-3px}
.dz-i{width:28px;height:28px;border-radius:50%;background:var(--soft);border:1px solid var(--line);display:grid;place-items:center;font-size:12px;font-weight:700;flex:none;font-variant-numeric:tabular-nums;transition:background .2s,color .2s}
.dz-s[open] .dz-i{background:var(--ink);color:#fff;border-color:var(--ink)}
.dz-h{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
.dz-h b{font-size:15px}
.dz-h small{font-size:13px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dz-c{width:20px;height:20px;color:var(--muted);transition:transform .2s cubic-bezier(.23,1,.32,1);flex:none}
.dz-c svg{width:100%;height:100%;display:block}
.dz-s[open] .dz-c{transform:rotate(180deg)}
.dz-b{padding:4px 16px 18px;display:flex;flex-direction:column;gap:18px}
.dz-s[open] .dz-b{animation:dzin .22s cubic-bezier(.23,1,.32,1) both}
@keyframes dzin{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}

.dz .swatches{display:flex;flex-wrap:wrap;gap:12px}
.dz .sw2:has(input:checked){box-shadow:inset 0 0 0 1px rgba(11,11,13,.2),0 0 0 3px #fff,0 0 0 5px var(--ink)}
.dz .sw2:has(input:focus-visible){outline:3px solid var(--c-focus);outline-offset:4px}
.dz .sw2:active{transform:scale(.97)}
.dz-grad{display:flex;flex-direction:column;gap:18px}
.dz-grad[hidden]{display:none}

.tiles{display:grid;gap:8px}
.tiles.t6{grid-template-columns:repeat(3,1fr)}
.tiles.t4{grid-template-columns:repeat(2,1fr)}
.tiles.icons{grid-template-columns:repeat(auto-fill,minmax(48px,1fr))}
.tile{position:relative;display:flex;flex-direction:column;align-items:center;gap:6px;padding:8px;border-radius:14px;border:1.5px solid var(--line);background:var(--bg);cursor:pointer;min-height:44px;transition:border-color .15s,box-shadow .15s,transform .16s cubic-bezier(.23,1,.32,1)}
.tile:active{transform:scale(.97)}
.tile:has(input:checked){border-color:var(--ink);box-shadow:0 0 0 1px var(--ink)}
.tile:has(input:focus-visible){outline:3px solid var(--c-focus);outline-offset:2px}
.tile .tl{font-size:12.5px;font-weight:600;color:var(--body)}
.ptile{display:block;position:relative;width:100%;height:44px;border-radius:10px;overflow:hidden;background:linear-gradient(var(--t-ang,155deg),var(--t-bg1),var(--t-bg2))}
.ptile .pat{-webkit-mask:none;mask:none}
.stx{display:flex;gap:8px;justify-content:center;width:100%;padding:10px;border-radius:10px;background:linear-gradient(var(--t-ang,155deg),var(--t-bg1),var(--t-bg2))}
.stx .stamp{width:36px;font-size:12px}
.tile.it{padding:0;height:48px;justify-content:center}
.tile.it .ico{width:22px;height:22px;color:var(--ink);display:grid;place-items:center}
.tile.it .ico svg,.tile.it .ico img{width:22px;height:22px}
.tile.it .ico img{border-radius:50%;object-fit:cover}

.plist,.mg{display:flex;flex-direction:column;gap:8px}
.prow{display:grid;grid-template-columns:116px minmax(0,1fr) 44px;gap:8px;align-items:center}
.prow.fin{grid-template-columns:116px minmax(0,1fr) auto}
.pfin{font-size:14px;font-weight:700;padding:0 6px}
.mrow{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px}
.lnk{appearance:none;border:0;background:none;padding:0 2px;min-height:44px;display:inline-flex;align-items:center;gap:6px;font-weight:700;font-size:14px;color:var(--ink);cursor:pointer;align-self:flex-start;font-family:inherit}
.lnk svg,.dz-add svg,.dz-up svg{width:16px;height:16px}
.lnk:focus-visible{outline:3px solid var(--c-focus);outline-offset:2px;border-radius:8px}
.dz .btn.sm{min-height:44px}
.dz-add{align-self:flex-start}
.dz-help,.dz-note,.dz-r{margin:0;font-size:13px;color:var(--muted);text-wrap:pretty}
.dz-r{font-size:15px;color:var(--body)}
.dz-help code{font-family:inherit;font-weight:700;color:var(--ink);background:var(--soft);padding:1px 5px;border-radius:6px}
.dz-ok{margin:0;display:flex;gap:8px;align-items:flex-start;font-size:14px;color:var(--ok)}
.dz-ok svg{width:18px;height:18px;flex:none;margin-top:1px}
.dz .warn{font-size:13px}
.dz .warn .btn{display:inline-flex;margin:4px 0}

.dz-logo{display:flex;gap:16px;align-items:center}
.dz-logo .av{box-shadow:0 0 0 1px var(--line)}
.dz-lc{display:flex;flex-direction:column;gap:6px;min-width:0}
.dz-lc small{font-size:12.5px;color:var(--muted)}
.dz-lb{display:flex;gap:8px;flex-wrap:wrap}
.dz-up{position:relative;cursor:pointer;flex-direction:row;margin:0}
.dz-up:has(input:focus-visible){outline:3px solid var(--c-focus);outline-offset:2px}

.dz-bar{position:sticky;bottom:0;z-index:4;display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding:12px 0 calc(12px + env(safe-area-inset-bottom));background:linear-gradient(to top,var(--bg) 78%,rgba(255,255,255,0))}
.dz-bar .btn{width:auto;flex:1;padding:14px 18px;font-size:15px;border-radius:14px}
.dz-st{flex-basis:100%;font-size:13px;color:var(--muted);display:flex;align-items:center;gap:6px}
.dz-st.on{color:var(--c-warn-t)}
.dz-st.on::before{content:"";width:7px;height:7px;border-radius:50%;background:#D97706}
.dz-bar .err{flex-basis:100%}
.dz-bar .err:empty{display:none}

@media (hover:hover) and (pointer:fine){
  .ib:hover,.tile:hover{border-color:var(--ink)}
  .seg-o:hover,.seg-b:hover{color:var(--ink)}
  .dz-s summary:hover .dz-c{color:var(--ink)}
}
@media (max-width:1179px){.dz-stage .steps,.dz-stage .streak{display:none}}
@media (max-width:380px){
  .dz .two{grid-template-columns:1fr}
  .prow,.prow.fin{grid-template-columns:100px minmax(0,1fr) 44px}
  .prow.fin .tag{display:none}
}
@media (min-width:900px){
  .dz-bar{background:linear-gradient(to top,var(--desk,var(--c-gray)) 78%,rgba(242,242,244,0))}
  .dz-st{flex-basis:auto;flex:1}
  .dz-bar .btn{flex:none}
  .dz-bar .err{order:-1}
  .tiles.t6{grid-template-columns:repeat(6,1fr)}
  .tiles.t4{grid-template-columns:repeat(4,1fr)}
  .cfgone{max-width:720px}
}
/* Editor y vista previa lado a lado solo cuando hay espacio de verdad (con la barra lateral) */
@media (min-width:1180px){
  .dz{display:grid;grid-template-columns:minmax(0,1fr) minmax(330px,390px);gap:28px;align-items:start}
  .dz-pv{order:2;position:sticky;top:24px}
  .dz-f{order:1}
  .dz-ver{display:none}
}
@media (prefers-reduced-motion:reduce){
  .dz-s[open] .dz-b{animation:none}
  .dz-c,.tile,.ib{transition:none}
}

/* --- la tarjeta es un BOLETO (dirección "Boleto premium", 7 nov 2026) ---
   Cuerpo con los sellos + talón con el avance. Muescas y línea perforada con mask; la sombra va en .tkw
   (filter) porque mask recorta box-shadow. .tkw.filo = filo dorado fino para fondos negros. */
.tkw{--stw:clamp(86px,25%,150px);--r:11px;container:tk/inline-size;filter:drop-shadow(0 1px 1px rgba(11,11,13,.2)) drop-shadow(0 22px 28px rgba(11,11,13,.26))}
.tkw.filo{filter:drop-shadow(0 0 .8px rgba(216,180,106,.95)) drop-shadow(0 26px 36px rgba(0,0,0,.6))}
.card.tk{display:grid;grid-template-columns:minmax(0,1fr) var(--stw);gap:0;padding:0;border-radius:20px;box-shadow:none;
  background:radial-gradient(120% 70% at 12% 0,color-mix(in srgb,var(--t-ink) 9%,transparent),transparent 62%),linear-gradient(var(--t-ang,155deg),var(--t-bg1),var(--t-bg2));
  -webkit-mask:radial-gradient(circle var(--r) at calc(100% - var(--stw)) 0,#0000 96%,#000) top/100% 51% no-repeat,radial-gradient(circle var(--r) at calc(100% - var(--stw)) 100%,#0000 96%,#000) bottom/100% 51% no-repeat;
  mask:radial-gradient(circle var(--r) at calc(100% - var(--stw)) 0,#0000 96%,#000) top/100% 51% no-repeat,radial-gradient(circle var(--r) at calc(100% - var(--stw)) 100%,#0000 96%,#000) bottom/100% 51% no-repeat}
.tk-bd{display:flex;flex-direction:column;gap:14px;min-width:0;padding:18px 16px 16px 18px}
.tk-st{position:relative;display:flex;flex-direction:column;justify-content:space-between;gap:12px;min-width:0;padding:18px 14px 16px 16px}
.tk-st::before{content:"";position:absolute;left:-1px;top:calc(var(--r) + 6px);bottom:calc(var(--r) + 6px);border-left:2px dashed color-mix(in srgb,var(--t-ink) 28%,transparent)}
.card.tk .meta{display:flex;align-items:center;justify-content:flex-start;gap:10px}
.tk-logo{width:40px;height:40px;border-radius:50%;overflow:hidden;flex:none;background:#fff;box-shadow:0 0 0 1px color-mix(in srgb,var(--t-ink) 18%,transparent)}
.tk-logo img{width:100%;height:100%;object-fit:cover;display:block}
.card.tk .who{font-family:var(--font);font-size:16px;line-height:1.2;font-weight:650;letter-spacing:0;text-transform:none;color:var(--t-ink);text-wrap:balance}
.card.tk .who.largo{font-size:14px}
.card.tk .name{font-size:14px;font-weight:500;margin-top:1px;color:var(--t-soft)}
.card.tk .count{font-family:var(--disp);font-style:normal;font-stretch:62%;font-weight:800;font-size:60px;line-height:.85;letter-spacing:-.01em;text-align:left;white-space:nowrap}
.card.tk .count small{font-family:var(--disp);font-size:.4em;font-weight:800;color:var(--t-soft);margin-left:2px}
.tk-fal{margin:0;font-size:13px;line-height:1.3;color:var(--t-soft);text-wrap:balance}
.tk-fal b{display:block;font-size:16px;font-weight:700;color:var(--t-ink)}
.tk-nx{display:flex;flex-direction:column;gap:1px;min-width:0}
.tk-nx small{font-size:10.5px;font-weight:650;letter-spacing:.08em;text-transform:uppercase;color:var(--t-soft)}
.tk-nx b{font-size:15px;font-weight:600;color:var(--t-ink);overflow-wrap:anywhere}
@container tk (max-width:420px){
  .tk-bd{padding:14px 10px 14px 14px;gap:12px}
  .tk-st{padding:14px 10px 12px 12px}
  .card.tk .count{font-size:46px}
  .card.tk .who{font-size:15px}
  .tk-logo{width:34px;height:34px}
}
/* boleto angosto (celular y vista previa del diseñador): el talón va abajo y la perforación es horizontal */
@container tk (max-width:479px){
  .card.tk{--sth:64px;grid-template-columns:minmax(0,1fr);grid-template-rows:auto var(--sth);
    -webkit-mask:radial-gradient(circle var(--r) at 0 calc(100% - var(--sth)),#0000 96%,#000) left/51% 100% no-repeat,radial-gradient(circle var(--r) at 100% calc(100% - var(--sth)),#0000 96%,#000) right/51% 100% no-repeat;
    mask:radial-gradient(circle var(--r) at 0 calc(100% - var(--sth)),#0000 96%,#000) left/51% 100% no-repeat,radial-gradient(circle var(--r) at 100% calc(100% - var(--sth)),#0000 96%,#000) right/51% 100% no-repeat}
  .tk-st{flex-direction:row;align-items:center;justify-content:space-between;padding:10px 16px}
  .tk-st::before{left:calc(var(--r) + 6px);right:calc(var(--r) + 6px);top:-1px;bottom:auto;border-left:0;border-top:2px dashed color-mix(in srgb,var(--t-ink) 28%,transparent)}
  .card.tk .count{font-size:40px}
  .tk-fal{text-align:right}
}
/* sello en relieve (estilo Clásico): toma el color del negocio */
.tk.est-clasico .stamp{border:1.5px solid color-mix(in srgb,var(--t-ink) 22%,transparent);font-size:13px;font-weight:600}
.tk.est-clasico .stamp.gift{border-color:color-mix(in srgb,var(--t-ink) 60%,transparent)}
.tk.est-clasico .stamp.on{border:0;background:radial-gradient(circle at 34% 28%,color-mix(in srgb,var(--t-on) 55%,#fff),var(--t-on) 58%,color-mix(in srgb,var(--t-on) 70%,#000));box-shadow:inset 0 1px 0 rgba(255,255,255,.4),0 2px 6px rgba(0,0,0,.35)}
/* mensaje y avance, fuera del boleto */
.tk-msg{display:flex;flex-direction:column;gap:6px;margin-top:14px;background:#fff;border-radius:14px;padding:14px 16px;color:var(--body)}
.tk-msg .cmsg{margin:0;font-family:var(--font);font-style:normal;font-size:17px;font-weight:600;line-height:1.35;color:var(--ink);text-wrap:pretty}
.tk-msg .hint{margin:0;font-size:15px;line-height:1.45;text-wrap:pretty}
.tk-msg .hint b{color:var(--ink)}
@media (prefers-reduced-motion:reduce){.card.tk{transition:none}}

/* sello de premio con texto ("50% DTO"): sello de color como de goma. Vacío: punteado del color del
   premio; ganado: relleno, un poco girado, como recién estampado. Gana a los estilos de sello. */
.tk .sg>.stamp.pz{border:1.5px dashed var(--pz);background:color-mix(in srgb,var(--pz) 14%,transparent);color:var(--t-ink);box-shadow:none;background-image:none}
.tk .sg>.stamp.pz.on{border:0;background:var(--pz);color:var(--pz-ink);transform:rotate(-8deg);box-shadow:inset 0 0 0 2px color-mix(in srgb,var(--pz-ink) 22%,transparent),0 3px 8px -3px rgba(0,0,0,.45)}
.pzt{display:block;font-family:var(--disp);font-stretch:62%;font-weight:800;font-size:clamp(8px,2.6cqi,11px);line-height:.95;text-transform:uppercase;text-align:center;letter-spacing:.01em;padding:0 3px;overflow-wrap:normal;word-break:keep-all;hyphens:none}
