/* ============ SHARED INPUT FIELD TIER (field.css) ============
   ONE treatment for every input on the site, single-line and multi-line alike:
   no box, no border, no radius, no fill; a yellow brush-stroke underline that IS the
   field's bottom boundary (anchored below the content box, never a layer across it);
   the paragraph measure token as max width; one line tall at rest so the placeholder
   is always visible with no scrolling, at every width. Textareas hug their content up
   to a line cap (4 lines from 1280, 2 below it) and scroll INSIDE the content area
   past it; their height is owned by field.js (Field.grow), never by CSS.
   Selectors are doubled (.fld.fld) so this tier outranks page rules regardless of
   load order. Linked from every page's helmet after buttons.css; no page may restate
   a field's treatment, width, or underline. */
.fld.fld{position:relative;display:block;box-sizing:border-box;width:100%;max-width:var(--para-measure,min(400px,100%));padding:0 0 10px;margin:0}
.fld-in.fld-in,.fld-ta.fld-ta{box-sizing:border-box;display:block;width:100%;margin:0;border:0;border-radius:0;background:transparent;padding:10px 2px 0;font:var(--type-body,400 18px/28px 'NaN SuperX','NaN SuperX Fallback',Helvetica,Arial,sans-serif);color:#242424;outline:none;-webkit-appearance:none;appearance:none}
/* Single-line fields size to exactly one line (intrinsic), so the ramped type token can
   never clip the placeholder. */
.fld-ta.fld-ta{resize:none;overflow-x:hidden;overflow-y:hidden;transition:height .18s var(--ease,cubic-bezier(.45,.05,.55,.95))}
.fld-in::placeholder,.fld-ta::placeholder{color:rgba(36,36,36,.62);opacity:1}
.fld-in:-webkit-autofill{-webkit-text-fill-color:#242424}
/* The brush stroke IS the underline: pinned to the wrapper's bottom edge, 10px clear of
   the content box, so typed or scrolling text can never run over or under it. Yellow at
   rest (no gray hairline anywhere), full strength on focus. */
.fld-stroke.fld-stroke{position:absolute;left:-3px;right:-3px;top:100%;margin-top:-5px;height:10px;color:var(--brush-color,#F1BE48);pointer-events:none;opacity:.72;transition:opacity .25s var(--ease,ease)}
.fld.fld:focus-within .fld-stroke.fld-stroke{opacity:1}
.fld-stroke svg{display:block;width:100%;height:100%}
.fld-stroke path{fill:currentColor}
/* Character counter: below the underline, right-aligned to the field's measure. */
.fld-count.fld-count{box-sizing:border-box;width:100%;max-width:var(--para-measure,min(400px,100%));margin-top:12px;text-align:right;font:500 14px/20px 'NaN SuperX','NaN SuperX Fallback',Helvetica,Arial,sans-serif;color:#242424;opacity:.7}
@media (prefers-reduced-motion:reduce){.fld-ta.fld-ta,.fld-stroke.fld-stroke{transition:none}}
