/* Scoped Help styles. Existing toolbox and editor fonts are preserved. */
.ph-dialog {width:min(1180px,96vw);max-width:96vw;height:min(800px,92dvh);max-height:92dvh;padding:1rem;border:1px solid #b9c8e1;border-radius:.7rem;background:#fff;color:#18243a;font-family:Arial,sans-serif;overflow:hidden;}
.ph-dialog::backdrop {background:#001d6070;}
.ph-dialog[open] {display:flex;flex-direction:column;gap:.7rem;}
.ph-header {display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;}
.ph-header h1 {font-size:1.5rem;margin:0 auto 0 0;}
.ph-dialog button {border:1px solid #bccce4;border-radius:.35rem;padding:.45rem .7rem;color:#002b82;background:#f3f6fc;}
.ph-dialog button:hover {background:#e4ecfa;}
.ph-dialog button:disabled {opacity:.55;cursor:not-allowed;}
.ph-dialog button:focus-visible,.ph-dialog input:focus-visible,.ph-dialog select:focus-visible {outline:3px solid #ecb900;outline-offset:2px;}
.ph-filters {display:flex;align-items:end;gap:.6rem;flex-wrap:wrap;}
.ph-filters input {flex:1;min-width:180px;padding:.5rem;border:1px solid #8eabd5;border-radius:.3rem;}
.ph-filters label,.ph-variants label {display:flex;flex-direction:column;gap:.2rem;font-size:.85rem;}
.ph-dialog select {padding:.4rem;max-width:100%;border:1px solid #8eabd5;border-radius:.3rem;background:#fff;}
.ph-body {display:grid;grid-template-columns:minmax(220px,32%) minmax(0,1fr);gap:1rem;min-height:0;flex:1;}
.ph-results,.ph-detail {overflow:auto;overscroll-behavior:contain;}
.ph-results {border-right:1px solid #d1dcef;padding-right:.7rem;}
.ph-results button {display:block;width:100%;text-align:left;margin-bottom:.5rem;font-weight:600;}
.ph-results small,.ph-results span {display:block;font-size:.78rem;font-weight:400;margin-top:.25rem;}
.ph-results span {color:#3d4c66;}
.ph-detail {padding:0 .6rem .8rem 0;}
.ph-detail h2 {font-size:1.3rem;}
.ph-detail h3 {font-size:1rem;margin-top:1.3rem;font-weight:700;}
.ph-detail p,.ph-detail li {font-size:.9rem;line-height:1.5;}
.ph-path,.ph-note {color:#596880;}
.ph-variants {display:flex;gap:.6rem;flex-wrap:wrap;}
.ph-preview {height:240px;position:relative;margin:.8rem 0;border:1px solid #cbd8ee;border-radius:.4rem;overflow:hidden;}
.ph-detail pre {background:#f4f7fc;border:1px solid #d7e0ee;padding:.8rem;white-space:pre;overflow:auto;font:.82rem/1.5 'Roboto Mono',Consolas,monospace;}
.ph-related {display:flex;gap:.4rem;flex-wrap:wrap;}
.ph-detail>button {margin-right:.4rem;}
.ph-status {margin:0;min-height:1.2rem;font-size:.85rem;color:#9d291d;}
.help-landing {max-width:900px;margin:2rem auto;padding:1rem;}
.help-landing button {background:#002b82;color:#fff;border:0;border-radius:.4rem;padding:.65rem 1rem;}
.site-page-title {margin-left:auto;color:#002b82;font:600 1rem Arial,sans-serif;}
.site-back-workspace {font: .75rem Arial,sans-serif;margin-left:.7rem;}
@media(max-width:650px) {.ph-dialog {height:95dvh;max-height:95dvh;padding:.6rem;}.ph-body {grid-template-columns:1fr;grid-template-rows:35% minmax(0,1fr);}.ph-results {border-right:0;border-bottom:1px solid #d1dcef;}.ph-preview {height:210px;}.ph-filters label {max-width:65%;}.site-page-title {display:none;}}

/* Pseudly 0.4c final: shared Help-style typography and dialog controls. */
body {
  font-family: Arial, sans-serif !important;
}
button, input, select, textarea {
  font-family: Arial, sans-serif;
}
/* Block field choices are UI; inline block editing remains monospace. */
.blocklyDropDownDiv, .blocklyDropDownDiv *,
.blocklyMenu, .blocklyMenuItem {
  font-family: Arial, sans-serif !important;
}
/* General prose and inline code use the UI face; actual pseudocode is below. */
code, pre {
  font-family: Arial, sans-serif !important;
}
.pseudly-page dialog {
  box-sizing: border-box;
  max-width: 96vw;
  padding: 1rem;
  border: 1px solid #b9c8e1;
  border-radius: .7rem;
  background: #fff;
  color: #18243a;
  box-shadow: 0 12px 50px #0004;
  font-family: Arial, sans-serif !important;
  font-size: .9rem;
}
.pseudly-page dialog::backdrop {
  background: #001d6070;
}
.pseudly-page dialog :is(h1, h2, h3, h4, p, label, span, div, li, legend, button, input, select, textarea) {
  font-family: Arial, sans-serif !important;
}
.pseudly-page dialog h2 { font-size: 1.3rem; }
.pseudly-page dialog :is(h3, h4) { font-size: 1rem; font-weight: 700; }
.pseudly-page dialog :is(p, label, li) { line-height: 1.5; }
.pseudly-page dialog button {
  border: 1px solid #bccce4;
  border-radius: .35rem;
  padding: .45rem .7rem;
  color: #002b82;
  background: #f3f6fc;
  font-weight: 400;
  cursor: pointer;
}
.pseudly-page dialog button:hover { background: #e4ecfa; }
.pseudly-page dialog button:disabled { opacity: .55; cursor: not-allowed; }
.pseudly-page dialog :is(input:not([type="checkbox"]):not([type="radio"]), select, textarea) {
  border: 1px solid #8eabd5;
  border-radius: .3rem;
  padding: .5rem;
  background: #fff;
  color: #18243a;
  max-width: 100%;
  box-sizing: border-box;
}
.pseudly-page dialog :is(button, input, select, textarea):focus-visible {
  outline: 3px solid #ecb900;
  outline-offset: 2px;
}
/* Preserve the extension chooser's selected-state indication and card layout. */
.pseudly-page dialog .pseudly-extension-choice {
  border-width: 2px;
  border-radius: .65rem;
  padding: .8rem;
}
.pseudly-page dialog .pseudly-extension-choice[aria-pressed="true"] {
  border-color: #002b82;
  background: #e6eefc;
  box-shadow: 0 0 0 2px #002b8230;
}
/* Blockly alerts, confirmations and filename prompts are native dialog elements. */
.pseudly-page .blocklyDialog {
  width: min(440px, 92vw);
  min-width: 0;
  max-width: 92vw;
  max-height: 90dvh;
  overflow: auto;
}
.blocklyDialogPrompt { white-space: pre-wrap; }
.blocklyDialogForm { row-gap: .8rem; }
.blocklyDialogInput { box-sizing: border-box; width: 100%; }
.blocklyDialogButtonRow { justify-content: flex-end; }
/* These are the only monospace surfaces: block text/editing and pseudocode. */
.blocklySvg text, .blocklyText, .blocklyHtmlInput,
#output, #pseudocodeLineNumbers,
.ph-detail pre, .ph-detail pre code, .zelos-code {
  font-family: "Roboto Mono", Consolas, monospace !important;
}
@media (max-width: 650px) {
  .pseudly-page dialog.ph-dialog { padding: .6rem; }
}

/* EBNF and pseudocode examples on the grammar page retain monospace. */
.grammar-code,
.grammar-code code {
  font-family: "Roboto Mono", Consolas, monospace !important;
}
