/* pnew-gm.css — generated by tools/build_css.sh, do not edit (the guest message composer only) */
/* Guest message, less friction (owner 10.10., templates/partials/guest_msg.php, assets/js/guest_msg.js): the composer as a
   dialog (the kit's dialog.pn-sheet: bottom sheet on phones, centred on desktop), the listing / her on top; the
   "Did you mean …?" line, the 'account' answer's "Log in", the word hint and the layer that marks contact data in the
   field. Its own small bundle, printed only by a page with the composer (pnew_head_css_add): the guest bundles stay as
   they are. Tokens only. */
.pn-gmdlg{display:grid;gap:14px;align-content:start}
.pn-gmdlg:not([open]){display:none}
.pn-gmdlg__head{display:flex;align-items:center;gap:12px;min-width:0}
.pn-gmdlg__thumb{flex:none;width:48px;height:48px;border-radius:var(--r-field);object-fit:cover;background:var(--sunken)}
.pn-gmdlg__head .pc-avatar{flex:none}
.pn-gmdlg__ht{flex:1;min-width:0}
.pn-gmdlg__h{margin:0;font:700 var(--fs-section)/var(--lh-head) var(--font-display);letter-spacing:var(--tr-head);color:var(--ink);overflow-wrap:anywhere}
.pn-gmdlg__ctx{margin:2px 0 0;font:400 14px/1.35 var(--font-sans);color:var(--ink-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pn-gmdlg__x{flex:none;width:44px;height:44px;align-self:flex-start}
.pn-gmdlg__body{min-width:0}
/* the panel inside the dialog: the sheet is its paper, its own head is the dialog's */
.pn-gm.is-in-dialog{padding:0;border:0;background:none;box-shadow:none}
.pn-gm.is-in-dialog > .pn-gm__head{display:none}
.pn-gmhold{display:block}
/* the two-word rule while he types: a quiet line, never an error */
.pn-gm__count.is-hint{text-align:left;color:var(--ink-2);font-weight:600}
/* "Did you mean …?": the whole line is the key (44 px on phones) */
.pn-gm__typo{display:block;width:100%;min-height:40px;margin:0;padding:10px 2px;border:0;background:none;color:var(--ink);font:400 14px/1.35 var(--font-sans);text-align:left;cursor:pointer;overflow-wrap:anywhere}
.pn-gm__typo[hidden]{display:none}
.pn-gm__typo b{font-weight:700;text-decoration:underline;text-decoration-color:var(--accent);text-decoration-thickness:2px;text-underline-offset:3px}
.pn-gm__typo:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px;border-radius:var(--r-field)}
/* a note, not a scolding: the typo question and the marked contact data */
.pn-gm .pn-fielderr.is-note{color:var(--ink);font-weight:600}
.pn-gm .pn-fielderr.is-note .pc-ico{color:var(--warning)}
.pn-gm__login{margin:2px 0 0}
.pn-gm__login[hidden]{display:none}
/* the layer over the field (same box as the textarea, set by gm_help.js): its text invisible, the parts ringed */
.pn-gmmark{position:absolute;z-index:1;margin:0;overflow:hidden;pointer-events:none;color:transparent;background:none;border-color:transparent;white-space:pre-wrap;overflow-wrap:break-word;word-break:normal}
.pn-gmmark[hidden]{display:none}
.pn-gmmark mark{color:transparent;background:none;border-radius:4px;box-shadow:0 0 0 2px var(--warning);text-decoration:underline wavy var(--warning);text-decoration-thickness:1px;text-underline-offset:4px;-webkit-box-decoration-break:clone;box-decoration-break:clone}
@media (max-width:700px){
  .pn-gm__typo{min-height:44px}
  .pn-gmdlg .pn-gm__text{min-height:112px}
}
@media (min-width:701px){
  dialog.pn-sheet.pn-gmdlg{width:min(560px,calc(100% - 48px))}
}
@media (prefers-reduced-motion:reduce){dialog.pn-sheet.pn-gmdlg[open]{animation:none}}