.pg-head { max-width: 46rem; }
/* Outils MaruoTech : styles communs (KI Prompt Generator, Nano Banana Prompt Generator, …) */
/* Mobile : aucun enfant de grille ne doit pouvoir élargir la page (listes déroulantes, grande police du téléphone) */
.pg-app > *, .pg-panel, .pg-field, .pg-row > *, .pg-checks label > span { min-width: 0; }
.pg-field select { max-width: 100%; text-overflow: ellipsis; }
.pg-prompt { overflow-wrap: anywhere; }
@media (max-width: 440px) { .pg-row { grid-template-columns: 1fr; } }
.pg-app { display: grid; grid-template-columns: 1fr; gap: 1.5rem; margin-top: 2rem; align-items: start; }
@media (min-width: 900px) { .pg-app { grid-template-columns: minmax(0, 23rem) minmax(0, 1fr); } }
.pg-panel { border: 1px solid var(--ink); padding: 1.25rem; background: var(--paper); min-width: 0; }
.pg-panel h2 { margin: 0 0 1rem; font-size: 1.05rem; }
.pg-field { display: flex; flex-direction: column; gap: 0.35rem; margin-bottom: 1rem; }
.pg-field > label, .pg-legend { font-family: var(--font-mono); font-size: 0.72rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; }
.pg-hint { font-family: system-ui, sans-serif; font-size: 0.8rem; color: var(--mute); }
.pg-field input[type=text], .pg-field select, .pg-field textarea { font: 16px/1.4 system-ui, sans-serif; padding: 0.6rem 0.7rem; border: 1px solid var(--rule); border-radius: 0; background: var(--paper); color: var(--ink); width: 100%; }
.pg-field textarea { min-height: 4.5rem; resize: vertical; }
.pg-field input[type=text]:focus, .pg-field select:focus, .pg-field textarea:focus { outline: 2px solid var(--ink); outline-offset: 0; border-color: var(--ink); }
.pg-row { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; }
.pg-seg { display: flex; border: 1px solid var(--ink); }
.pg-seg label { position: relative; overflow: hidden; flex: 1; text-align: center; padding: 0.5rem; cursor: pointer; font-family: var(--font-mono); font-size: 0.8rem; font-weight: 700; text-transform: none; letter-spacing: 0; }
.pg-seg input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; pointer-events: none; }
.pg-seg label:has(input:checked) { background: var(--ink); color: var(--paper); }
.pg-seg label:has(input:focus-visible) { outline: 2px solid var(--ink); outline-offset: 2px; }
.pg-checks { display: flex; flex-direction: column; gap: 0.45rem; font: 0.92rem/1.4 system-ui, sans-serif; }
.pg-checks label { display: grid; grid-template-columns: 1.1rem 1fr; column-gap: 0.6rem; align-items: start; cursor: pointer; text-transform: none; letter-spacing: 0; font: 0.92rem/1.4 system-ui, sans-serif; }
.pg-checks input { width: 1.1rem; height: 1.1rem; margin: 0.12rem 0 0; padding: 0; accent-color: var(--ink); }
.pg-checks input:disabled + span, .pg-checks label:has(input:disabled) { color: var(--mute); }
.pg-out-head { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; flex-wrap: wrap; margin-bottom: 0.75rem; }
.pg-out-head h2 { margin: 0; }
.pg-count { font-family: var(--font-mono); font-size: 0.75rem; color: var(--mute); }
.pg-prompt { background: var(--shade); border: 1px solid var(--rule); padding: 1rem; font: 0.86rem/1.6 var(--font-mono); white-space: pre-wrap; word-break: break-word; max-height: 32rem; overflow: auto; margin: 0; }
.pg-actions { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 10rem), 1fr)); gap: 0.6rem; margin-top: 1rem; }
.pg-actions button, .pg-actions a { margin: 0; text-align: center; cursor: pointer; font-family: var(--font-mono); font-size: 0.78rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; padding: 0.8rem 0.6rem; border: 1px solid var(--ink); text-decoration: none; }
.pg-primary { background: var(--ink); color: var(--paper); }
.pg-primary:hover { background: var(--paper); color: var(--ink); }
.pg-ghost { background: var(--paper); color: var(--ink); }
.pg-ghost:hover { background: var(--ink); color: var(--paper); }
.pg-status { min-height: 1.4em; margin-top: 0.6rem; font: 0.85rem/1.4 system-ui, sans-serif; }
.pg-privacy { margin-top: 1rem; padding-top: 0.75rem; border-top: 1px dashed var(--rule); font: 0.82rem/1.5 system-ui, sans-serif; color: var(--mute); }
.pg-prompt.pg-empty { font-family: system-ui, sans-serif; color: var(--mute); }
.pg-off { opacity: 0.45; }
.pg-error { color: #B00020; font: 0.85rem/1.4 system-ui, sans-serif; }
.pg-body { max-width: var(--measure); margin-top: 3rem; }
.pg-offer { border: 1px solid var(--ink); padding: 1.25rem; margin: 2rem 0; background: var(--shade); }
.pg-offer p { margin: 0.3rem 0 0; }
.pg-offer .button { margin-top: 0.9rem; }
.pg-faq details { border-top: 1px solid var(--rule); padding: 0.8rem 0; }
.pg-faq details:last-child { border-bottom: 1px solid var(--rule); }
.pg-faq summary { cursor: pointer; font-weight: 700; font-family: var(--font-display); }
.pg-faq details p { margin: 0.5rem 0 0; }

/* Un élément masqué (attribut hidden) doit le rester même si une règle lui donne display:flex ou grid */
.pg-app [hidden] { display: none !important; }
/* Inscription KI Espresso sous les outils (_includes/tool-newsletter.njk) */
.pg-nl { border: 1px solid var(--rule); background: var(--shade); padding: 1.25rem; margin-top: 1.5rem; transition: border-color 0.3s, box-shadow 0.3s; }
.pg-nl-on { border-color: var(--ink); box-shadow: 4px 4px 0 var(--ink); }
.pg-nl p { margin: 0 0 0.5rem; }
.pg-nl-label { font-family: var(--font-mono); font-size: 0.72rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; }
.pg-nl-text { font: 0.9rem/1.5 system-ui, sans-serif; color: var(--mute); }
.pg-nl-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 0.6rem; margin-top: 0.75rem; }
@media (max-width: 440px) { .pg-nl-row { grid-template-columns: 1fr; } }
.pg-nl-row input { font: 16px/1.4 system-ui, sans-serif; padding: 0.6rem 0.7rem; border: 1px solid var(--rule); border-radius: 0; background: var(--paper); color: var(--ink); min-width: 0; }
.pg-nl-row input:focus { outline: 2px solid var(--ink); outline-offset: 0; border-color: var(--ink); }
.pg-nl-row button { margin: 0; cursor: pointer; font-family: var(--font-mono); font-size: 0.78rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; padding: 0.7rem 1rem; border: 1px solid var(--ink); }
.pg-nl-consent { display: grid; grid-template-columns: 1.1rem 1fr; column-gap: 0.6rem; margin-top: 0.75rem; font: 0.8rem/1.45 system-ui, sans-serif; color: var(--mute); cursor: pointer; }
.pg-nl-consent input { width: 1rem; height: 1rem; margin: 0.15rem 0 0; accent-color: var(--ink); }
.pg-nl-sr, .pg-nl-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
