:root{ /*@gp-tokens*/
  --gp-c1:#2563eb;
  --gp-c2:#dc2626;
  --gp-c3:#15803d;
  --gp-c4:#9333ea;
  --gp-c5:#ea580c;
  --gp-lbl:0.58em;
  --gp-gap:0.55ch;
  --gp-underline:0.12em;
  --gp-bar-gap:0.06em;
  --gp-label-gap:0.14em;
  --gp-word-lh:1.12;
  --gp-tok-gap:0.16em;
  --gp-line-gap:0.42em;
  --gp-gap-attached:0.3em;
  --gp-indent:var(--indent-step, 40px);
}

.gp-block.gp-block{ /*@gp-block*/
  display:block;
  margin:0 0 0 var(--gp-indent);
  padding-top:var(--para-gap);
  white-space:normal;
}
.gp-block.gp-nb{ padding-top:var(--gp-gap-attached); } /*@gp-spacing*/
.gp-block.gp-na + *{ padding-top:0; } /*@gp-spacing-after*/
.gp-block.gp-flush{ margin-left:0; } /*@gp-flush*/
.rte-syntax-btn{ text-decoration:underline; text-underline-offset:3px; } /*@gp-syntax-btn*/

.gp-grid{ display:grid; width:fit-content; justify-items:center; column-gap:var(--gp-gap); row-gap:0; align-items:start; } /*@gp-grid*/
.gp-grid + .gp-grid{ margin-top:0.25em; } /*@gp-grid-line*/
.gp-word{ grid-row:1; line-height:var(--gp-word-lh); } /*@gp-word*/
.gp-word, .gp-w{ font-family:var(--font-content); } /*@gp-word-font*/
.gp-grid .gp-seg{ justify-self:stretch; display:flex; flex-direction:column; min-width:0; } /*@gp-seg*/
.gp-grid .gp-seg.gp-spacer{ visibility:hidden; } /*@gp-spacer*/
.gp-bar{ border-top:var(--gp-underline) solid; margin-top:var(--gp-bar-gap); } /*@gp-bar*/

.gp-flow{ display:block; line-height:var(--gp-word-lh); } /*@gp-flow*/
.gp-flow + .gp-flow{ margin-top:var(--gp-line-gap); }
.gp-flow > .gp-w, .gp-flow > .gp-seg, .gp-flow > .gp-grid{ vertical-align:top; white-space:nowrap; margin:0 var(--gp-tok-gap) var(--gp-line-gap); }
.gp-flow > .gp-w.gp-plain{ display:inline-block; line-height:var(--gp-word-lh); } /*@gp-flow-plain*/
.gp-flow > .gp-hug{ margin-left:0; } /*@gp-hug*/
.gp-flow > .gp-hugr{ margin-right:0; } /*@gp-hugr*/
.gp-grid .gp-word.gp-hug{ margin-left:calc(-1 * var(--gp-gap)); } /*@gp-hug-grid*/
.gp-flow > .gp-seg{ display:inline-block; text-align:center; }
.gp-flow > .gp-seg > .gp-w{ display:block; line-height:var(--gp-word-lh); border-bottom-style:solid; border-bottom-width:var(--gp-underline); padding-bottom:var(--gp-bar-gap); width:fit-content; margin:0 auto; }
.gp-flow > .gp-seg > .gp-l{ display:block; line-height:1.1; margin-top:var(--gp-label-gap); }
.gp-flow > .gp-grid{ display:inline-grid; width:auto; } /*@gp-flow-mini*/
.gp-flow .gp-grid + .gp-grid{ margin-top:0; }
.gp-l{ /*@gp-label*/
  margin-top:var(--gp-label-gap);
  font-family:var(--font-ui);
  font-weight:600;
  font-size:var(--gp-lbl);
  line-height:1.1;
  letter-spacing:0.2px;
  white-space:nowrap;
  text-align:center;
}

.gp-d1 .gp-bar, .gp-d1 .gp-w{ border-color:var(--gp-c1); } .gp-d1 .gp-l{ color:var(--gp-c1); } /*@gp-depth*/
.gp-d2 .gp-bar, .gp-d2 .gp-w{ border-color:var(--gp-c2); } .gp-d2 .gp-l{ color:var(--gp-c2); }
.gp-d3 .gp-bar, .gp-d3 .gp-w{ border-color:var(--gp-c3); } .gp-d3 .gp-l{ color:var(--gp-c3); }
.gp-d4 .gp-bar, .gp-d4 .gp-w{ border-color:var(--gp-c4); } .gp-d4 .gp-l{ color:var(--gp-c4); }
.gp-d5 .gp-bar, .gp-d5 .gp-w{ border-color:var(--gp-c5); } .gp-d5 .gp-l{ color:var(--gp-c5); }

.gp-grid .gp-strikeline{ grid-row:1; align-self:center; justify-self:stretch; height:0; border-top:0.075em solid currentColor; pointer-events:none; } /*@gp-strike*/

.sb-modal{ position:fixed; inset:0; z-index:1000; } /*@sb-modal*/
.sb-backdrop{ position:absolute; inset:0; background:rgba(0,0,0,0.35); }
.sb-card{ /*@sb-card*/
  position:relative; width:min(620px,92vw); max-height:88vh; overflow:auto; margin:6vh auto;
  background:#fff; border-radius:10px; padding:1.1rem 1.25rem; box-shadow:0 12px 40px rgba(0,0,0,0.25);
  font-family:var(--font-ui);
}
.sb-title{ font-weight:700; font-size:1.05rem; margin-bottom:0.7rem; } /*@sb-title*/
.sb-fld{ display:block; margin-bottom:0.6rem; }
.sb-flab{ display:block; font-size:0.8rem; font-weight:600; color:#555; margin-bottom:0.2rem; }
.sb-sentence{ width:100%; font-family:var(--font-content); font-size:1rem; padding:0.5rem 0.6rem; border:1px solid var(--input-border,#cfcabf); border-radius:7px; resize:vertical; } /*@sb-sentence*/
.sb-tokens{ display:flex; flex-wrap:wrap; gap:0.3rem; margin:0.3rem 0 0.8rem; min-height:1.6rem; } /*@sb-tokens*/
.sb-chip{ font-family:var(--font-content); font-size:0.76rem; padding:0.14rem 0.4rem; border:1px solid #cfcabf; border-radius:6px; background:#f6f4f0; cursor:pointer; }
.sb-chip.is-sel{ background:var(--gp-c1); color:#fff; border-color:var(--gp-c1); }
.sb-break{ flex-basis:100%; height:0; }
.sb-hint{ color:#999; font-size:0.85rem; }
.sb-addrow{ display:flex; gap:0.4rem; align-items:center; margin-bottom:0.6rem; } /*@sb-addrow*/
.sb-label{ flex:1; font-family:var(--font-ui); font-size:0.9rem; padding:0.4rem 0.5rem; border:1px solid var(--input-border,#cfcabf); border-radius:7px; }
.sb-parts{ display:flex; flex-wrap:wrap; gap:0.4rem; margin-bottom:0.8rem; min-height:1.4rem; } /*@sb-parts*/
.sb-part{ display:inline-flex; align-items:center; gap:0.35rem; font-size:0.85rem; padding:0.2rem 0.2rem 0.2rem 0.5rem; border:1px solid #e0dcd3; border-radius:6px; background:#faf9f7; }
.sb-part-l{ font-weight:700; }
.gp-d1 .sb-part-l{ color:var(--gp-c1); } .gp-d2 .sb-part-l{ color:var(--gp-c2); } .gp-d3 .sb-part-l{ color:var(--gp-c3); } .gp-d4 .sb-part-l{ color:var(--gp-c4); } .gp-d5 .sb-part-l{ color:var(--gp-c5); }
.sb-part-w{ color:#666; }
.sb-part.is-struck .sb-part-w{ text-decoration:line-through; } /*@sb-part-strike*/
.sb-part-strike{ border:none; background:none; cursor:pointer; font-size:0.9rem; color:#aaa; line-height:1; padding:0 0.15rem; }
.sb-part-strike.is-on{ color:#222; }
.sb-part-rm{ border:none; background:none; cursor:pointer; font-size:1rem; color:#a00; line-height:1; padding:0 0.2rem; }
.sb-spacing{ display:flex; align-items:center; flex-wrap:wrap; gap:0.7rem; font-size:0.85rem; margin:0 0 0.7rem; } /*@sb-spacing*/
.sb-spacing-lab{ font-weight:600; color:#555; }
.sb-prevlab,.sb-flab{ letter-spacing:0.2px; }
.sb-prevlab{ font-size:0.8rem; font-weight:600; color:#555; margin-bottom:0.2rem; } /*@sb-prevlab*/
.sb-preview{ border:1px dashed #ddd; border-radius:7px; padding:0.3rem 0.6rem; min-height:2.6rem; }
.sb-actions{ display:flex; justify-content:flex-end; gap:0.5rem; margin-top:1rem; } /*@sb-actions*/
.sb-flash{ animation:sb-flash 0.4s; } /*@sb-flash*/
@keyframes sb-flash{ 30%{ box-shadow:0 0 0 2px var(--gp-c2); } }

.lx-syntax .gp-seg.lx-syntax-tap{ cursor:pointer; } /*@lx-syntax*/
.lx-syntax:not(.lx-syntax-done) .gp-word{ cursor:pointer; } /*@lx-syntax-word-tap*/
.lx-syntax .gp-seg.lx-syntax-tap .gp-l{ display:block; min-width:2.5ch; min-height:1em; }
.lx-syntax .gp-seg.lx-syntax-tap:not(.lx-syntax-filled) .gp-bar{ border-top-style:dashed; }
.lx-syntax .gp-flow > .gp-seg.lx-syntax-tap:not(.lx-syntax-filled) > .gp-w{ border-bottom-style:dashed; }
.lx-syntax .gp-seg.lx-syntax-active .gp-l{ outline:2px solid var(--gp-c1); border-radius:3px; }
.lx-syntax .gp-seg.lx-syntax-correct .gp-l{ color:var(--success-strong, #15803d); } /*@lx-syntax-grade*/
.lx-syntax .gp-seg.lx-syntax-incorrect .gp-l{ color:var(--danger, #dc2626); }
.lx-syntax .gp-seg.lx-syntax-correct{ cursor:default; }
.lx-syntax-opts{ display:flex; flex-wrap:wrap; gap:0.45rem; margin-top:1.1rem; align-items:center; } /*@lx-syntax-opts*/
.lx-syntax-opt{ font-family:var(--font-ui); font-size:0.85rem; font-weight:600; padding:0.35rem 0.7rem; border:1px solid var(--gp-c1); color:var(--gp-c1); background:#fff; border-radius:20px; cursor:pointer; }
.lx-syntax-opt:hover{ background:var(--gp-c1); color:#fff; }
.lx-syntax-hint{ color:#888; font-size:0.85rem; font-family:var(--font-ui); }