/* Field Notes: editorial surfaces only. Existing page/tool styles stay scoped separately. */
.fn { --fn-measure: 65ch; padding-block: clamp(1.5rem, 4vw, 4rem) 5rem; }
.fn :where(h1,h2,h3,h4,h5,h6) { color: var(--sb-ivory); text-wrap: balance; }
.fn :where(a,button,input,textarea,summary,[tabindex]):focus-visible { outline: 3px solid var(--sb-gold); outline-offset: 4px; }
.fn [hidden] { display: none !important; }
.fn-eyebrow { margin: 0 0 1.5rem; color: var(--sb-mint); font-size: .75rem; font-weight: 700; letter-spacing: .15em; text-transform: uppercase; }
.fn-eyebrow span { display: inline-block; margin-left: .8rem; padding-left: .8rem; border-left: 1px solid var(--sb-line); color: var(--sb-gold); }
.fn-breadcrumb { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: 2.5rem; font-size: .8rem; color: var(--sb-muted); }
.fn-breadcrumb [aria-current] { max-width: 40ch; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.fn-opening { max-width: 58rem; margin: 0 auto 2.5rem; }
.fn-opening h1,.fn-index-heading h1 { margin: .7rem 0 1rem; font-family: Georgia, 'Times New Roman', serif; font-weight: 500; font-size: clamp(2.15rem, 4.8vw, 4.4rem); line-height: 1.12; letter-spacing: -.035em; }
.fn-intro { max-width: 60ch; color: var(--sb-muted); font-size: clamp(1.05rem, 1.7vw, 1.3rem); line-height: 1.65; }
.fn-category { display: inline-block; color: var(--sb-gold); font-size: .75rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.fn-meta { display: flex; align-items: baseline; flex-wrap: wrap; gap: .45rem 1rem; margin-top: 1.4rem; color: var(--sb-muted); font-size: .8rem; }
.fn-meta > * + *::before { content: '·'; margin-right: 1rem; color: var(--sb-gold); }
.fn-updated { margin-top: .8rem; color: var(--sb-muted); font-size: .8rem; }
.fn-art { margin: 0; }
.fn-article > .fn-art { margin-bottom: clamp(2rem, 5vw, 4rem); }
.fn-art img { display: block; width: 100%; height: auto; border-radius: .3rem; }
.fn-art figcaption { margin-top: .75rem; color: var(--sb-muted); font-size: .75rem; line-height: 1.5; text-align: right; }
.fn-reading-layout { margin: 0 auto; max-width: 58rem; }
.fn-reading-layout--contents { display: grid; grid-template-columns: 13rem minmax(0,1fr); gap: clamp(1.5rem,3vw,3rem); max-width: 70rem; }
.fn-contents { align-self: start; position: sticky; top: 1.5rem; max-height: calc(100vh - 3rem); overflow: auto; font-size: .85rem; }
.fn-contents summary { color: var(--sb-gold); font-size: .7rem; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; cursor: pointer; padding-block: .5rem; }
.fn-contents ol { list-style: none; padding: 0; margin: .8rem 0 0; border-left: 1px solid var(--sb-line); }
.fn-contents li { margin: 0; }
.fn-contents a { display: block; padding: .5rem .8rem; text-decoration: none; color: var(--sb-muted); line-height: 1.5; }
.fn-contents a:hover { color: var(--sb-ivory); background: var(--sb-panel); }
.fn-contents__level-3 { padding-left: .7rem; font-size: .8rem; }
.fn-prose { min-width: 0; width: 100%; max-width: var(--fn-measure); margin-inline: auto; font-size: clamp(1.05rem,1.5vw,1.18rem); line-height: 1.85; overflow-wrap: anywhere; }
.fn-prose > :first-child { margin-top: 0; }
.fn-prose p { margin: 0 0 1.5em; }
.fn-prose :where(h1,h2,h3,h4,h5,h6) { scroll-margin-top: 2rem; margin: 2.2em 0 .8em; line-height: 1.3; }
.fn-prose h1 { font-size: 2.25em; }
.fn-prose h2 { font-family: Georgia,serif; font-size: 1.75em; font-weight: 500; letter-spacing: -.02em; }
.fn-prose h3 { font-size: 1.25em; }
.fn-prose h4 { font-size: 1.1em; }.fn-prose h5 { font-size: 1em; }.fn-prose h6 { font-size: .9em; }
.fn-prose :where(ul,ol) { padding-left: 1.5em; margin: 1.3em 0 1.7em; }
.fn-prose li { margin: .65em 0; padding-left: .25em; }.fn-prose li::marker { color: var(--sb-gold); }
.fn-prose li :where(ul,ol) { margin-block: .5em; }.fn-prose li p { margin-block: .4em; }
.fn-prose .fn-steps > li { padding-left: .5em; margin-block: 1.2em; }
.fn-prose :where(blockquote,.wp-block-pullquote) { margin: 2em 0; padding: 1.2em 1.5em; border: 0; border-left: 3px solid var(--sb-gold); background: var(--sb-night-soft); }
.fn-prose blockquote p:last-of-type { margin-bottom: .5em; }
.fn-prose :where(cite,figcaption) { display: block; color: var(--sb-muted); font-size: .8em; line-height: 1.6; }
.fn-prose .wp-block-pullquote { font-family: Georgia,serif; font-size: 1.25em; text-align: left; }
.fn-prose .wp-block-pullquote blockquote { padding: 0; border: 0; background: none; margin: 0; }
.fn-prose :where(figure,.wp-block-embed,.wp-block-gallery) { margin: 2em 0; }
.fn-prose :where(img,video,iframe,audio) { max-width: 100%; }
.fn-prose :where(img,video) { height: auto; }.fn-prose iframe { width: 100%; }
.fn-prose .wp-block-embed.is-type-video .wp-block-embed__wrapper { aspect-ratio: 16 / 9; }.fn-prose .is-type-video iframe { height: 100%; }
.fn-prose :where(.alignwide,.alignfull) { width: 100%; max-width: none; }
.fn-prose .wp-block-gallery img { object-fit: contain; }.fn-prose .wp-block-gallery figure { margin: 0; }
.fn-prose .wp-block-table { max-width: 100%; overflow-x: auto; overscroll-behavior-inline: contain; }
.fn-prose table { border-collapse: collapse; width: 100%; font-size: .85em; line-height: 1.65; }
.fn-prose :where(th,td) { padding: .8em 1em; border: 1px solid var(--sb-line); min-width: 8rem; text-align: left; vertical-align: top; }
.fn-prose th { background: var(--sb-panel); color: var(--sb-ivory); }
.fn-prose .wp-block-table.is-style-stripes tbody tr:nth-child(odd) { background: var(--sb-night-soft); }
.fn-prose :where(code,kbd) { padding: .15em .3em; font-size: .85em; background: var(--sb-panel); border-radius: .2em; }
.fn-prose pre { overflow-x: auto; max-width: 100%; padding: 1.2em; border: 1px solid var(--sb-line); background: var(--sb-night-soft); white-space: pre; font-size: .85em; }
.fn-prose pre code { padding: 0; background: transparent; }
.fn-prose hr { width: 100%; border: 0; border-top: 1px solid var(--sb-line); margin: 3em 0; }
.fn-note,.fn-prose .wp-block-details { padding: 1.2rem 1.5rem; border: 1px solid var(--sb-line); border-left: 3px solid var(--sb-mint); background: var(--sb-panel); border-radius: .3rem; margin: 2rem 0; }
.fn-prose .fn-note :where(h2,h3) { margin-top: 0; }.fn-note p:last-child { margin-bottom: 0; }
.fn-tips__grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1rem; align-items: stretch; }.fn-tips .fn-tip { min-width: 0; padding: 1.1rem; background: var(--sb-night-soft); border: 1px solid var(--sb-line); }.fn-prose .fn-tip :where(h3,h4) { margin: 0 0 .6rem; color: var(--sb-gold); font-size: 1.05em; }.fn-tip p { font-size: .9em; }.fn-tip :where(h3,h4)::before { content: ''; display: inline-block; width: .55em; height: .55em; border: 1px solid var(--sb-mint); transform: rotate(45deg); margin-right: .65em; }.fn-tips > :where(h2,h3) { margin: 0 0 1rem; }
/* Native flow layouts add sibling spacing; the grid gap owns card spacing. */
.fn-tips .fn-tips__grid > .fn-tip { margin-block: 0; }
@media (max-width: 640px) { .fn-tips__grid { grid-template-columns: 1fr; } }
.fn-prose summary { color: var(--sb-ivory); font-weight: 650; cursor: pointer; }.fn-prose details[open] summary { margin-bottom: 1em; }
.fn-prose .wp-block-buttons { display: flex; flex-wrap: wrap; gap: .75rem; margin: 2rem 0; }
.fn-prose .wp-block-button__link,.fn button { display: inline-block; padding: .75em 1.15em; color: var(--sb-night); background: var(--sb-mint); border: 1px solid transparent; border-radius: .3rem; font: inherit; font-weight: 650; line-height: 1.4; text-decoration: none; cursor: pointer; }
.fn-prose .is-style-outline .wp-block-button__link { color: var(--sb-mint); background: transparent; border-color: currentColor; }
.fn button:hover,.fn-prose .wp-block-button__link:hover { background: #c6f4dc; color: var(--sb-night); }
.fn-prose .wp-block-footnotes { font-size: .8em; border-top: 1px solid var(--sb-line); padding-top: 1.5em; }
.fn-tags { font-size: .8em; }.fn-tags a { display: inline-block; padding: .15em .5em; margin: .2em; border: 1px solid var(--sb-line); }
.fn-author { border-top: 1px solid var(--sb-line); margin-top: 3rem; padding-top: 2rem; font-size: .85em; }.fn-author h2 { margin: 0 0 .75rem; font-size: 1.4em; }.fn-author .fn-eyebrow { margin-bottom: .75rem; }
.fn-share { display: flex; flex-wrap: wrap; gap: .75rem; align-items: center; margin-top: 2rem; font-size: .8em; }.fn-share label { width: 100%; color: var(--sb-muted); }
.fn :where(input,textarea) { min-width: 0; max-width: 100%; padding: .7em .85em; border: 1px solid var(--sb-line); border-radius: .3rem; background: var(--sb-night-soft); color: var(--sb-ivory); font: inherit; }
.fn-share input { flex: 1 1 18rem; }.fn-share [role=status] { width: 100%; color: var(--sb-gold); }
.fn-next { padding-block: 2.5rem; margin-top: 3rem; border-top: 1px solid var(--sb-line); }.fn-next h2 { font-family: Georgia,serif; font-weight: 500; font-size: 1.6rem; }
.fn-next__links { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1rem; }.fn-next a { display: flex; justify-content: space-between; gap: 1rem; padding: 1.5rem; border: 1px solid var(--sb-line); background: var(--sb-night-soft); text-decoration: none; }.fn-next a:hover { background: var(--sb-panel); }
.fn-index-heading { max-width: 56rem; margin-block: 1rem 3rem; }.fn-index-heading h1 { max-width: 20ch; }
.fn-index-tools { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: 1.5rem; padding-block: 1.5rem; margin-bottom: 2rem; border-block: 1px solid var(--sb-line); }
.fn-categories { display: flex; flex-wrap: wrap; gap: .5rem; }.fn-categories a { padding: .5rem .8rem; border: 1px solid var(--sb-line); border-radius: 2rem; font-size: .8rem; text-decoration: none; }.fn-categories [aria-current] { color: var(--sb-night); background: var(--sb-mint); }
.fn-search { font-size: .8rem; }.fn-search label { display: block; margin-bottom: .4rem; color: var(--sb-muted); }.fn-search > div { display: flex; gap: .5rem; }.fn-search input { width: 14rem; }
.fn-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 2rem; }
.fn-card { min-width: 0; border-bottom: 1px solid var(--sb-line); padding-bottom: 1.8rem; }.fn-card__copy { padding-top: 1.2rem; }.fn-card h2 { font-family: Georgia,serif; font-size: 1.65rem; font-weight: 500; line-height: 1.3; margin: .6rem 0 .8rem; }.fn-card h2 a { color: var(--sb-ivory); text-decoration: none; }.fn-card h2 a:hover { color: var(--sb-mint); }.fn-card p { color: var(--sb-muted); font-size: .95rem; }
.fn-card--featured { grid-column: 1/-1; display: grid; grid-template-columns: 1.3fr 1fr; gap: 2.5rem; align-items: center; padding-bottom: 2.5rem; margin-bottom: 1rem; }.fn-card--featured .fn-card__copy { padding: 0; }.fn-card--featured h2 { font-size: clamp(1.9rem,3vw,2.8rem); }.fn-card--featured:not(:has(.fn-card__art)) { display: block; max-width: 56rem; }.fn-card .fn-art figcaption { display: none; }
.fn-empty { padding: 3rem 2rem; border: 1px solid var(--sb-line); background: var(--sb-panel); max-width: 50rem; }.fn-empty h2 { font: 500 1.8rem/1.3 Georgia,serif; }.fn-empty p { color: var(--sb-muted); }
.fn-feed { margin-top: 2.5rem; font-size: .85rem; }.fn .pagination { margin-top: 2.5rem; }.fn .nav-links { display: flex; flex-wrap: wrap; gap: .75rem; }.fn .page-numbers { padding: .5rem .85rem; border: 1px solid var(--sb-line); }.fn .page-numbers.current { background: var(--sb-panel); }
.fn-comments { max-width: 65ch; margin-inline: auto; padding-top: 2rem; border-top: 1px solid var(--sb-line); }.fn-comments h2 { font: 500 1.8rem/1.3 Georgia,serif; }.fn-comments > p { font-size: .9rem; color: var(--sb-muted); }
.fn-comment-list,.fn-comment-list .children { list-style: none; padding-left: 0; }.fn-comment-list .children { margin-left: clamp(.5rem,3vw,1.5rem); border-left: 1px solid var(--sb-line); padding-left: 1rem; }.fn-comment { padding-block: 1.5rem; border-bottom: 1px solid var(--sb-line); }.fn-comment header { display: flex; flex-wrap: wrap; gap: .5rem .8rem; align-items: center; font-size: .85rem; }.fn-comment header time { color: var(--sb-muted); }.fn-badge { color: var(--sb-night); background: var(--sb-gold); border-radius: 2px; padding: .1rem .4rem; font-size: .65rem; text-transform: uppercase; }.fn-report { font-size: .75rem; }
.fn-comments :where(label,small) { display: block; }.fn-comments :where(input:not([type=submit]),textarea) { width: 100%; }.fn-comments small { color: var(--sb-muted); }.fn-comments input[type=submit] { cursor: pointer; color: var(--sb-night); background: var(--sb-mint); }.fn-comment :where(img,iframe,video) { max-width: 100%; }
/* wpDiscuz selectors are confined to this article's native comments surface. */
.fn-comments #wpdcom { color: var(--sb-ivory); max-width: 100%; padding: 0; }.fn-comments #wpdcom :where(.wpd-comment-text,.wpd-comment-header,.wpd-thread-head,.wpd-form-head) { color: var(--sb-ivory); }.fn-comments #wpdcom :where(.wpd-comment-wrap,.wpd-form-wrap,.wpd-comment .wpd-comment-wrap) { background: var(--sb-night-soft); border-color: var(--sb-line); }.fn-comments #wpdcom :where(input,textarea,.ql-container) { color: var(--sb-ivory); background: var(--sb-panel); border-color: var(--sb-line); }.fn-comments #wpdcom .wpd-comment-author { color: var(--sb-mint); }.fn-comments #wpdcom .wpd-comment-date { color: var(--sb-muted); }
.fn-screenshot-link { text-underline-offset: .2em; }
.fn-screenshot-dialog { box-sizing: border-box; width: min(46rem, calc(100vw - 2rem)); max-width: calc(100vw - 2rem); max-height: calc(100vh - 2rem); max-height: calc(100dvh - 2rem); padding: clamp(1rem, 3vw, 1.5rem); border: 1px solid var(--sb-line); border-radius: .5rem; color: var(--sb-ivory); background: var(--sb-night-soft); overflow: auto; overscroll-behavior: contain; }
.fn-screenshot-dialog::backdrop { background: rgba(1, 8, 7, .85); }
.fn-screenshot-dialog__heading { display: flex; align-items: start; justify-content: space-between; gap: 1rem; margin-bottom: 1rem; }
.fn-screenshot-dialog h2 { margin: 0; font: 500 clamp(1.2rem, 4vw, 1.7rem)/1.3 Georgia, serif; }
.fn-screenshot-dialog button { flex: none; min-height: 44px; padding: .5rem .8rem; border: 1px solid var(--sb-mint); border-radius: .3rem; color: var(--sb-night); background: var(--sb-mint); font: inherit; cursor: pointer; }
.fn-screenshot-dialog :where(button,a):focus-visible { outline: 3px solid var(--sb-gold); outline-offset: 3px; }
.fn-screenshot-dialog img { display: block; width: auto; max-width: 100%; height: auto; max-height: calc(100vh - 13rem); max-height: calc(100dvh - 13rem); object-fit: contain; margin: 0 auto 1rem; }
.fn-screenshot-dialog img[hidden] { display: none; }
.fn-screenshot-dialog__status { margin: 0 0 1rem; font-size: .9rem; }
.fn-screenshot-dialog__status:empty { display: none; }
.fn-screenshot-dialog__original { color: var(--sb-mint); font-size: .9rem; }
@media print { .fn-screenshot-dialog { display: none !important; } }
@media (min-width: 1100px) { .fn-prose > .alignwide { width: calc(100% + 4rem); margin-inline: -2rem; }.fn-prose > .alignfull { width: calc(100% + 6rem); margin-inline: -3rem; } }
@media (max-width: 1000px) { .fn-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }.fn-reading-layout--contents { display: block; }.fn-contents { position: static; max-height: none; max-width: 65ch; margin: 0 auto 2rem; padding: 1rem; border: 1px solid var(--sb-line); }.fn-contents ol { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); }.fn-card--featured { gap: 1.5rem; } }
@media (max-width: 640px) { .fn-grid,.fn-card--featured,.fn-next__links { grid-template-columns: 1fr; }.fn-card--featured { gap: 1.5rem; }.fn-contents ol { display: block; }.fn-opening .fn-eyebrow span { display: block; margin: .4rem 0 0; padding: 0; border: 0; }.fn-meta { gap: .5rem .8rem; }.fn-meta > * + *::before { margin-right: .8rem; }.fn-search { width: 100%; }.fn-search input { flex: 1; width: 100%; }.fn-prose :where(blockquote,.wp-block-pullquote,.fn-note) { padding: 1rem; }.fn-breadcrumb [aria-current] { max-width: 25ch; } }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; }.fn * { animation: none !important; transition: none !important; } }
@media print { :root { color-scheme: light; } body { color: #111; background: white; }.sb-site-header,.sb-site-footer,.sb-skip-link,.fn-contents,.fn-share,.fn-next,.fn-comments,.fn-index-tools,.fn-feed { display: none !important; }.fn,.fn-prose { font-size: 11pt; color: #111; }.sb-shell,.fn-reading-layout,.fn-prose { width: 100%; max-width: none; display: block; }.fn :where(h1,h2,h3,h4,h5,h6,a,p,cite,figcaption,.fn-meta) { color: #111; }.fn-prose :where(.fn-note,blockquote,pre,th) { background: #f6f6f6; color: #111; }.fn-opening h1 { font-size: 26pt; }.fn-art { break-inside: avoid; max-width: 75%; margin-inline: auto; }.fn-prose :where(h2,h3) { break-after: avoid; }.fn-prose a[href^=http]::after { content: ' (' attr(href) ')'; font-size: .75em; overflow-wrap: anywhere; } }
