/* Nowlark's additions to the shared docs layout (SkailSites/shared/docs.css), for docs_site.py: the glossary, the appendix
   tables, the overview's cards, the support home's centred title, and the narrow-screen menu list. Tokens only, no gradient. */
.rf-mob-list{padding:var(--sp-2) 0}
/* A closed <details> still lays its content out in Chrome (content-visibility, not display:none), so the closed menu's links sat
   under the article's code and figures: Impeccable's text-occlusion rule found them at 390. Closed means no box at all. */
.rf-mob:not([open])>.rf-mob-list{display:none}
/* The same holds for the article's own "On this page" under 1200px: closed, its links lay out under the code and the guides'
   step icons (Impeccable text-occlusion, 12 at 390, 2026-10-24). */
.rf-toc-in:not([open])>:not(summary){display:none}
/* Open, the phone menu filled itself a shade off the article card it sits in (1.08:1, check_text_fills_box at 390), a card
   nested in a card. It takes the site's nested-card fill, one step up from the card, as every card in a card does. */
.rf-mob[open] .rf-mob-list{background:var(--card-nested,var(--rf-card))}
/* The card hugs its text rather than capping it: shared docs.css gives the card every pixel the tree and rail leave, 705px at
   1280 and 870px at 1199 with the rail gone, so a paragraph that fills it runs 85 to 108 characters a line (Impeccable's
   line-length, 434 findings on the legal pages and guides, 2026-10-24). 640px holds about 76; the frame centres in what is left. */
/* The rail hugs its links (/api/links' three took 87px of 220), and a page with no section headings has no rail, so no column
   for one (24 pages left a 200px column empty, check_text_fills_box's "grid column nobody uses", 2026-10-24). */
@media(min-width:1200px){
  .rf-wrap{grid-template-columns:var(--rf-side-w) minmax(0,640px) fit-content(var(--rf-rail-w));justify-content:center}
  .rf-wrap:has(>.rf-rail:empty){grid-template-columns:var(--rf-side-w) minmax(0,640px)}
  /* With no rail the tree takes the room a rail would have had, so "Home Assistant alerts on your iPhone and Apple Watch"
     sits on one line rather than wrapping beside 260px of empty page (/guides at 1472, check_text_fills_box). Under a quarter of
     the screen: Impeccable reads a column of 25vw or more beside the long article as a hero column overflowing the fold. */
  .rf-wrap:not(:has(>.rf-rail:not(:empty))){--rf-side-w:min(460px,calc(25vw - 2px))}
}
/* On a wide screen the frame grows and the tree and rail take the room, so "Add your Nowlark form to WordPress.com" and "Post
   to Slack, Microsoft Teams, Discord or webhook" sit on one line rather than wrapping beside an empty margin (check_text_fills_box
   from 1728px, 2026-10-24). The article keeps its 640px. */
@media(min-width:1600px){.rf-wrap{--rf-side-w:min(460px,calc(25vw - 2px));--rf-rail-w:360px;max-width:1600px}}
@media(min-width:801px) and (max-width:1199px){.rf-wrap{grid-template-columns:var(--rf-side-w) minmax(0,640px);justify-content:center}}
/* Prose fills the article card, as shared docs.css sets it (about 76 characters a line in the 640px card), and the lede keeps the shared
   68ch. The 440px cap that stood here (the board, 2026-10-17) set the lede at 42 characters a line and every paragraph half
   the column wide; the owner, 2026-10-23: "this right here is the wrapping issues for API references and quickstart". */
/* A step that ended on one word ("opens.") at 1280 (the board, 2026-10-17): no paragraph, step, definition or column name
   ends on a lone word. */
.rf-art :is(p,li,dd,th){text-wrap-style:pretty}
/* A tree label or card title wraps greedily, its last two words tied (docs_site._tie): pretty rebalanced some two-line labels
   and not others, "Approve a GitHub deploy / from your iPhone" beside "...to a site you / build yourself" (the board, 2026-10-24). */
.rf-side a,.rf-cards>a>b{text-wrap-style:auto}
/* A table cell ends on no lone word either ("else.", "app", "it." on /api/authentication, check_text_fills_box). */
.rf-art td>.cell{max-width:52ch;text-wrap:pretty}
/* An inline code token longer than the phone's line ("/scim/v2/Groups" at 320) ran its chip past the card's edge: it breaks
   where nothing else can (check_text_fills_box, 2026-10-24). box-decoration-break:clone here left 300 paragraphs on a lone word. */
.rf-art :not(pre)>code{overflow-wrap:break-word}
/* An endpoint broken after its "/" (docs_site._endpoint) keeps its chip on both lines: without clone the second line had no
   padding or rounded start and read as a cut-off pill (the board, /api/teams, 2026-10-24). Endpoint cells only, for the reason above. */
.rf-art td:first-child code{-webkit-box-decoration-break:clone;box-decoration-break:clone}
.rf-gl dt{font-weight:var(--fw-semibold);margin-top:var(--sp-5);scroll-margin-top:calc(var(--nav-h,var(--size-18)) + var(--sp-4))}
.rf-gl dd{margin:var(--sp-1) 0 0;color:var(--ink2);line-height:var(--lh-airy)}
/* The overview's cards run one to a row, so a card's line has the article's width: two to a row left each about 240px and
   every line under its title wrapped to three, short of the card's edge, beside an empty page (check_text_fills_box,
   73 findings on /api with the rest, 2026-10-23). */
.rf-art .rf-cards{grid-template-columns:1fr}
/* ...and run as one grouped list, the way System Settings groups its rows (the board, 2026-10-23): an inset panel a step lighter
   than the card, rows ruled by hairlines, a chevron at each row's end. */
.rf-art .rf-cards{gap:0;border:1px solid var(--rf-card-line,var(--line));border-radius:var(--rf-r,10px);overflow:hidden;
  background:var(--card-nested,var(--rf-card))}
.rf-art .rf-cards a{position:relative;padding:var(--sp-4) calc(var(--sp-5) + 24px) var(--sp-4) var(--sp-5);border:0;border-radius:0}
.rf-art .rf-cards a+a{border-top:1px solid var(--rf-card-line,var(--line))}
.rf-art .rf-cards a:hover{background:var(--card-nested2,rgba(255,255,255,.04))}
.rf-art .rf-cards a::after{content:"";position:absolute;right:var(--sp-5);top:50%;width:16px;height:16px;margin-top:-8px;background:var(--ink3,var(--ink2));
  -webkit-mask:var(--rf-chev) center/16px no-repeat;mask:var(--rf-chev) center/16px no-repeat;transform:rotate(-90deg)}
/* A lede written wholly in bold reads as a label; it takes the lede's own weight, as on /api. */
.rf-art>.rf-lede>strong:only-child{font-weight:inherit}
/* A table's first column starts on the prose's edge, and a short row name (rf-stack, docs_site._label_cells) stays on one line. */
.rf-art table.rf-stack:not(.rf-fx) :is(th,td):first-child{padding-left:0}
.rf-art table.rf-stack:not(.rf-fx) td:first-child strong{white-space:nowrap}
/* On a phone a table of three columns or more is a stack of rows, each cell under its column's name, so nothing is cut off past the screen's edge
   (/api/authentication at 390, the board, 2026-10-23). From 1100px down, where shared docs.css would scroll it sideways. */
@media(max-width:1100px){
  .rf-art table.rf-stack:not(.rf-fx){display:block;overflow:visible}
  .rf-art table.rf-stack:not(.rf-fx) thead{display:none}
  .rf-art table.rf-stack:not(.rf-fx) :is(tbody,tr){display:block}
  .rf-art table.rf-stack:not(.rf-fx) tr{padding:var(--sp-3) 0;border-bottom:1px solid var(--line)}
  .rf-art table.rf-stack:not(.rf-fx) td{display:block;min-width:0;padding:var(--sp-1) 0;border:0}
  .rf-art table.rf-stack:not(.rf-fx) td[data-label]:not(:first-child)::before{content:attr(data-label);display:block;font-size:13px;color:var(--ink3,var(--ink2))}
  .rf-art table.rf-stack:not(.rf-fx) td:first-child{font-weight:600}
  .rf-art table.rf-stack:not(.rf-fx) td:has(>.cell:empty){display:none}
  .rf-art table.rf-stack:not(.rf-fx) td,.rf-art table.rf-stack:not(.rf-fx) td :is(a,code){white-space:normal;overflow-wrap:anywhere}
  .rf-art table.rf-stack td>.cell{max-width:none}
}
/* The phone menu's rows sit in from its border, and a page sits in under its group, so the two levels read apart. */
@media(max-width:1199px){
  .rf-mob-list :is(h4,.rf-g){padding-left:36px}
  .rf-mob-list :is(h4,.rf-g)::before{left:16px}
  .rf-mob-list a:not(.rf-g){padding-left:48px}
  .rf-mob-list a[aria-current=page]{font-weight:600}
}
.rf-art table.rf-fx{display:table;table-layout:fixed}
.rf-fx td,.rf-fx th{overflow-wrap:anywhere;white-space:normal}
.rf-fx :is(td,th):first-child{overflow-wrap:normal}
.rf-fx td:last-child{min-width:0}
.rf-fx-ep col:nth-child(1){width:var(--size-24)}
.rf-fx-st col:nth-child(1){width:30%}
/* The appendix tables name the section a line comes from under the line, not in a column of its own: as a third column at
   640px each label wrapped a word a line (check_text_fills_box, /api/errors, /api/endpoints, /api/limits, 2026-10-24). */
.rf-fx .rf-st-sec{display:block;margin-top:var(--sp-1);font-size:13px}
.rf-fx-lim col:nth-child(1){width:30%}
.rf-art :is(h2,h3) .rf-m{font-size:.55em;vertical-align:.25em;margin-right:var(--sp-15)}
.rf-art h2.rf-first{margin-top:var(--sp-2)}
.rf-art.rf-centered>h1,.rf-art.rf-centered>.rf-lede{text-align:center;margin-left:auto;margin-right:auto}
.rf-art.rf-centered>h1{font-size:clamp(38px,5vw,60px);margin-top:var(--sp-2)}
.rf-art.rf-centered>.rf-lede{max-width:56ch}
.rf-art figure.hv{max-width:100%}
/* On a phone a table of two columns fits the card, as _label_cells means it to: shared docs.css gives every cell 9em and
   scrolls the table, so words ran on past the card's edge under the clip (check_text_fills_box at 320 and 390, 2026-10-24). */
@media(max-width:600px){
  /* Laid out by their words, not split in half: two fixed halves broke "unexpected" and "fingerprint" mid-word at 320. Only
     a code token too long for the column breaks, anywhere. */
  .rf-art table:not(.rf-stack):not(.rf-fx):not(:has(tr>:nth-child(3))){display:table;width:100%;overflow:visible}
  .rf-art table:not(.rf-stack):not(.rf-fx):not(:has(tr>:nth-child(3))) :is(th,td){min-width:0;overflow-wrap:break-word}
  .rf-art table:not(.rf-stack):not(.rf-fx):not(:has(tr>:nth-child(3))) :is(th,td) code{overflow-wrap:anywhere}
  /* The appendix tables are a stack of rows too: in two columns at 320 the 30% name column broke "Destinations" and
     "verification" mid-word (check_text_fills_box, /api/limits, 2026-10-24). The name, then its line, then its section. */
  .rf-art table.rf-fx{display:block}
  .rf-art table.rf-fx :is(thead,colgroup){display:none}
  .rf-art table.rf-fx :is(tbody,tr){display:block}
  .rf-art table.rf-fx tr{padding:var(--sp-3) 0;border-bottom:1px solid var(--line)}
  .rf-art table.rf-fx td{display:block;padding:var(--sp-1) 0;border:0;overflow-wrap:break-word}
  .rf-art table.rf-fx td:first-child{font-weight:600}
  .rf-pn{grid-template-columns:1fr}
  .rf-pn .nx{grid-column:1}
}
/* An endpoint heading (`GET|POST /publicapi/verify`) is wider than a 320px column, and docs.css now breaks long words, which left
   the last letters on a line of their own. Smaller code in headings keeps the whole path on one line. */
@media (max-width:480px){.rf-art :is(h2,h3,h4) code{font-size:.74em}}
/* A figure's steps sit in the article card: at --sunk they were 1.17:1 against it in the dark theme, a card in a card at
   nearly its shade (check_text_fills_box, /support/teams and /support/forms at 390). They take the nested-card fill. */
.rf-art .hv :is(.hv-stairs,.hv-layers)>div:not(.s4):not(.l6){background:var(--card-nested)}
.rf-gl dd.rf-gl-in{margin-top:var(--sp-05);font-size:13px}