Batch 7 of docs/THEME-ETALON-2026.md. Lite's last 386 untokenised decisions reach a token, its whole palette gains a second half through light-dark(), and the frontend gains the colour-mode switch on the plumbing the panel already had. Both themes now report zero on every count they control, in both modes.

Core changes:

1. Every decision left in lite reaches one address (templates/lite/assets/css/*.css):

2. Size, animation, shadow, background, border and outline take a component token

   • A figure sizing a control, an icon or a page region has one name, as admin has
   • An animation carries its own dur and ease; a shadow is one whole value at one name

3. Four laws replaced four zoos rather than renaming them

   • The tinted pill: six tone classes and eight state marks read one --sl-chip-bg
   • The focus ring: outline and box-shadow draw one --sl-ring-width in one --sl-ring-bg,

and a status ring mixes its own colour at --sl-ring-mix

• The tile: --sl-ico-bg and --sl-ico-border read currentColor, and only the ratio is

hoisted where the tone is itself scoped

• The arrow: every CSS triangle in the theme reads one --sl-arrow-width

• The colour tail folded onto the roles it had been spelling by hand

  • --sl-color-brand and -banner onto --sl-primary-subtle, -strong onto --sl-primary-strong
  • --sl-color-text-ink onto --sl-text, -link and --sl-login-link-hover-color onto -strong
  • The eight --sl-changelog-* and the two service tones of the social icons onto roles
• Lite carries both modes (templates/lite/assets/css/base.css):

• color-scheme on :root, light-dark() through the palette, two data-theme selectors under the marker; no rule outside the API block names the mode

• A tint step is a ground and nothing else: every mark that read one takes the base tone of its family, which turns over by itself

• What a token cannot repaint stays fixed: the footer band carries the wordmark and the flag as images with white baked in, the page head carries a photograph, and the text standing on them reads --sl-band-text

• Contrast fell 53 to 0 in light and dark together, each value derived from the luminance the ratio allows against the worst ground it really meets

• The colour mode switch reaches the site (core/system.php, index.php, templates/lite):

• getAdminModeSwitch() becomes getThemeModeSwitch($action) for the panel and the site alike, and one setThemeMode() writes the cookie for both handlers

• index.php answers op=mode on the token scope the panel uses; lite's four document templates carry data-theme and the site header carries the toggle

• A visitor who picked a mode is not cacheable: the page-cache key is the route alone, so a stored copy would hand the next visitor someone else's mode

• Two measuring tools were wrong and are fixed (tools/ui-audit.php, tools/ui-shots.mjs):

• getValueKind() could not read a shadow whose colour or length arrives through a token, so one name held two kinds across the themes for no visible reason; isShadowValue() reads it now, with tests/Fixtures/ui/shadow.css under it

• The contrast walk read a mostly transparent fill as a solid surface and reported a failure against a colour nobody can see; it passes through to the ancestor that paints, at the threshold its own gradient rule already used

Benefits:

• A new theme is one copied directory and one repainted API block, in two modes
• Every visual decision in both shipped themes has exactly one address
• The whole site meets AA in light and dark, measured on pairs that really meet on screen
• dup falls 266 to 246 and scoped 103 to 92 as the folds land

Technical notes:

• tools/ui-audit-baseline.json re-stored at the new lows; the ratchet holds them
• tools/ui-contrast.json regenerated with credentials: 442 pairs, admin's 124 unchanged
• 84 baseline images re-captured in one pass and verified stable on a second run

• The mode cookie is written only through setCookies(); the toggle posts with a CSRF token that rides the dynamic-region contract on cacheable pages

• Backward compatible: no schema, route or template contract changes

Batch 5 of the theme etalon gives lite the motion, layer and gradient axes admin already carried. Not one transition, one layer or one gradient in the theme had an address of its own, so a theme author could not restyle any of them without forking rules. All three now read the same names admin does, the untokenised metric falls from 1396 to 1209 and the grammar violations from 99 to 44.

Core changes:

1. Motion (templates/lite/assets/css/base.css, theme.css):

2. 81 duration parts over 13 spellings snap onto --sl-time-fast, --sl-time-base and --sl-time-slow; 32 were already on a step, 31 move by 20ms or less and 18 move further

   • the two longest, the poll bar filling at 0.8s and the profile ring drawing

itself at 0.9s, take --sl-time-slow with the rest: an exception granted by
argument is how a zoo grows back, so the ladder has none in this theme

• admin still spells its own ring --sl-knob-dur: 1s, and that divergence is

batch 8's to settle in the direction lite has taken

• of the five curve spellings ease stays, linear is allowlisted, cubic-bezier(0.2, 0.8, 0.2, 1) folds onto --sl-ease-in-out and cubic-bezier(0.2, 0.7, 0.3, 1) onto --sl-ease-out

• the overshoot cubic-bezier(0.3, 1.6, 0.5, 1) becomes --sl-vote-ease, because a curve leaving the 0-1 range is a different kind of motion and no ladder holds it

• the speed dial's five hand-written delays become calc(var(--sl-dial-dur) * n) on a 0.05s step, which is the spelling admin already used

• Layers (templates/lite/assets/css/base.css, theme.css):

• twelve values over 26 sites become seven roles: --sl-z-base, -raised, -overlay, -dropdown, -popover, -modal and -toast

  • 0, 1, 30, 3000 and the image popup at 1000 were already a role's own value
  • 2 and 5 both mean "painted over the box it sits in" and merge into -overlay;

the only place the two sets meet is the user card, where the tool chip sits
at top: -38px and the online badge at top: 20px

• 4, the session panel, goes up to -dropdown to stay above that badge; it

clears the tool chip by 12px, which is measured and not argued

• four orders change and each is recorded in the plan: the header login form and the top-menu submenu fall to -dropdown and keep their old order by tie and document position, the tooltip's anchored panel and the image popup rise past the submenu, and the two fixed edge tabs fall to -popover where the footer's document position still resolves the tie their way

• --sl-z-sticky stays undeclared, because nothing in lite reads it and a step nothing reads is a dead token

• Gradients (templates/lite/assets/css/base.css, theme.css):

• --sl-line-gradient becomes --sl-grad-line and --sl-bg-hover-gloss becomes --sl-grad-gloss, which drops the last name stacking a state on an axis

• the five --sl-progress-fill-* triples fold into the categorical --sl-progress-1..5 and the five --sl-grad-progress-*, and the track into --sl-progress-bg, -border, -radius and -height; the fill height is now calc(var(--sl-progress-height) - 1px - 1px) and the flat fallback under each gradient, which no browser in the baseline ever painted, is gone

• the three gradients one component owns take that component's address: --sl-changelog-date-bg, --sl-feedback-bg and --sl-idea-bg

• the button bevel is composed: --sl-btn-bg holds the face, --sl-btn-text the label and one --sl-btn-shadow both edges and the lift under them, which retires the two scoped internals .sl-but had been setting on itself

• --sl-grad-info-start/-end were a colour under a gradient prefix and one of them also painted the search button flat, so they take colour names --sl-info-subtle and --sl-info-muted; --sl-grad-success-start proved to be --sl-success-subtle spelled twice and collapses onto it, its partner becoming --sl-success-muted

• The contract and the baseline (tools/ui-contract.php, tools/ui-audit-baseline.json):

• the components changelog-date, feedback and idea are declared

• the baseline is re-stored: count 1209, bare 107, names 44, scoped 107, tokens 213, with admin unchanged at zero

• The plan (docs/THEME-ETALON-2026.md):

• the batch 5 section is deleted rather than marked done, and the status moves to batch 6

• every figure it touched is re-derived from the tool: the metric tables, the baseline table, the transition and layer ladder rows, the cross-theme selector count and the grammar violation split

• the merge reasoning for the layers and the three colour names minted here are written down, because the batches after this one inherit them and no counter would recover them

Benefits:

• a theme author can now restyle every transition, every stacking layer and every gradient in lite by editing the API block, which is what the etalon promises

• the layer roles replace fourteen numbers picked to win one argument each, so a new overlay has a role to take instead of a number to outbid

• one duration ladder across both themes means a motion change is one edit, not a search for eight spellings of the same fifth of a second

Technical notes:

• durations move on purpose: 0.5s and 0.6s fall to 0.35s at seven fade and zoom sites, and the poll bar and profile ring fall to it from 0.8s and 0.9s

• no screenshot sees a duration, so motion is verified by reading computed transition-duration, -delay and -timing-function off the rendered page: 843 transitioning elements over five lite pages, all on the ladder

• layers are verified the same way, by resolving every computed z-index on those pages against the named roles

• all 42 tokens this batch added or renamed resolve on the live page to the values they held before it

• lite screenshots are identical to the stored baseline; the admin diffs the rig reports are the stand's own data, and admin renders from files this batch does not touch

• the button label highlight is now spelled with color-mix() at --sl-btn-mix: 85%, which is the same paint as the rgba() it replaces

Batch 3 of docs/THEME-ETALON-2026.md. Twenty-eight font sizes, sixty-two spacings and fifteen radii were not a system, so a theme author could not change one of them without reading every rule that spelled it. They now reach one address each, and the first batch that moves pixels on purpose leaves a record of every value that moved and why.

Core changes:

1. The type, opacity and icon ladders (templates/admin/assets/css/base.css):

2. Eight font sizes, three line heights, four weights and one tracking role replace forty-one spellings; every em value is resolved against the size it really inherited

   • h1..h5 leave em for the ladder: 25.2/21/18.9/16.8/15.4px become 24/20/18/16/14
   • h5 takes --sl-font-body rather than the nearer 16, which keeps the heading ladder

strictly descending against h4

• --sl-monitor-size-sm/-md/-lg/-kpi dissolve into the ladder they duplicated

• The icon scale is admin's and lite's from here: 16/18/24/32, plus icon-xl at 48

  • --sl-size-tile-icon and --sl-img-placeholder-icon-size had no step and now have one
  • --sl-size-icon-md was read by skin.css and declared nowhere; it is declared here
• --sl-hover-opacity becomes --sl-fade-subtle, beside --sl-fade-muted and -disabled
• Spacing and radius (base.css, theme.css, editors/toastui/skin.css):

• --sl-space-xs/-sm/-md/-lg and --sl-radius-control/-panel/-soft/-card are renamed and snapped in one step onto --sl-space-1..8 and --sl-radius-1..3, -pill, -circle

  • on spacing and radius a tie goes up: 3 to 4, 6 to 8, 9 to 10, 11 to 12, 14 to 16
  • on the type ladder the tie is broken by the siblings, so 11px goes down to 10 at all

twelve caption sites and 13px goes up to 14 at nine and down to 12 at five

• --sl-thumb-radius held 30px on a 48px box, which the browser already clamped to a

circle, so it is --sl-radius-circle with no pixel moved

• Negative margins keep their step through calc(var(--sl-space-n) * -1)
• Three places where the layout bends and the ladder does not (theme.css, skin.css):

• The module grid counted its own gutters as a literal 21px that no longer matched the snapped gap and dropped four columns to three; it now reads the gap it uses

• The card of a module and the caption of a file tile held a right padding sized to clear the speed dial standing over them, and a snap to 24px ran the title under the button

  • both now say calc(var(--sl-size-chip) + var(--sl-space-3) * 2), the spelling the

sidebar block link already used

• a padding that makes room for an absolutely positioned control is not a rhythm step,

and no count can tell the two apart

1. Breakpoints (theme.css, skin.css):

2. Eight widths become the four of the ladder: 1100 to 1200, 700 and 720 to 768, and 600 down to 560, because sending it up would have widened the rule by 168px instead of 40

3. The editor skin and its copy in lite (editors/toastui/skin.css, lite/assets/css/base.css):

4. EditorWindowTest compares the two files byte for byte, so admin's migrated skin is copied to lite in the same commit

5. lite declares exactly the nineteen ladder names the copy reads and no more, because a step nothing reads is a dead token and dead is ratcheted at zero

6. The contract and the gate (tools/ui-contract.php, tools/ui-audit-baseline.json):
7. icon-xl joins the size axis; -1px and -9999px join the allowlist with their reasons

8. Six duplicate groups the snap created under unrelated selectors are entered with the reason each is not merged, rather than merged into a list that scatters a component

9. The baseline is re-stored: no ratcheted count grew, thirteen fell

Benefits:

• 531 untokenised decisions leave admin: 833 to 302, with font-size, padding, margin, gap, border-radius, line-height, font-weight, opacity and letter-spacing at zero

• Bare numbers fall from 91 to 3, and the three left are the layers of skin.css batch 4 owns
• Grammar violations fall from 33 to 20, and every remaining one belongs to batch 4
• lite loses 159 decisions it did not pay for, because the skin arrives migrated

Technical notes:

• 309 values moved, each one measured: the report of every changed declaration resolved to pixels is what found the two paddings a screenshot at xl could not show

• The frontend moved by 0.001% to 0.024% between the two captures, which is noise; all twenty admin states are re-captured and reviewed

• The committed screenshot baseline had gone stale against the stand's own data before this batch began, so the pristine tree was captured first and the batch compared its own two runs; the same is written into the plan for the next batch

• tools/ui-contrast.json is left untouched on purpose. Re-generated it reports 266 pairs against the committed 203, and 23 more below AA, all of them on pages the earlier walk never saw. No snap in this batch crossed the 18.66px or 14px-bold threshold, so the growth is coverage and not a regression; batches 4 and 7 own it

• admin-monitor-knob-hover at lg does not settle between runs and stays outside the gate

Batch 1 of docs/THEME-ETALON-2026.md, token hygiene. Later batches create hundreds of new references, so a polluted API would have to be re-touched at every one of them, and once themes ship against it the names can no longer be corrected. This moves both API blocks onto the grammar, folds what only duplicated a value, and fixes the screenshot rig, which had been signing in over a scheme its own session cookie forbids.

Core changes:

1. The API blocks (templates/admin/assets/css/base.css, templates/lite/assets/css/base.css):

2. Every colour, size, shadow and component name that had a home under the grammar took it; 118 names left the two blocks and 84 took their place

   • --sl-color-* dropped the prefix onto roles: --sl-bg, --sl-surface,

--sl-border, --sl-text, --sl-primary, --sl-success and their steps

• --sl-color-on-dark is --sl-on-solid, --sl-h1..h4 are --sl-font-h1..h4,

--sl-container / -sidebar / -gutter / -grid-gap are --sl-layout-*

• 27 --sl-login- became 12 component tokens: --sl-login-, --sl-drop-*,

--sl-size-avatar, --sl-avatar-border

• --sl-shadow-soft split by kind, which is what it always was in two themes:

a colour in admin becomes --sl-shadow-color, a shadow in lite --sl-shadow-xs

• Dead tokens deleted: --sl-space-xl in admin, --sl-content and --sl-h3 in lite
• Every name left unregistered carries the comment that says which batch owns

its value, because a rename is not free until that batch moves the value

1. The consumers (theme.css, editors/toastui/skin.css, admin/modules/monitor.php, admin/modules/admins.php, templates/lite/{fragments,partials}, plugins/system/slaed.js, plugins/editors/toastui/assets/editor-upload.js, tests/Unit/EditorWindowTest.php):

2. Each rename crossed every place in this commit, because a miss fails silently: a stray custom property is not an error and JavaScript falls through

   • Values written from outside CSS carry --sl-d-*: comment depth, profile level

and ring, group colour, session shares, arrow offset, scroll pair, dial count

• The monitor series is categorical and lives in the API block now:

--sl-chart-up / -down / -cpu / -ram, read by the SVG monitor.php assembles

• Twin tokens folded into what they aliased, and the four that only carried a

transform or a filter argument became the literal the allowlist already calls
structure

• The two editor skins are byte-identical again, and admin's stopped reading

two names only lite ever declared: five backgrounds and one shadow now paint

1. The window canon (theme.css of both themes, docs/WINDOW.md):

2. Its theme values left the :root block that sat inside theme.css and moved into the API block as --sl-modal-width, -height, -gap and -pad-x

   • The internals the axis classes set moved onto the .sl-modal root, where a

scoped property is allowed to live

1. The screenshot rig (tools/ui-shots.json, tools/ui-shots.mjs, tools/ui-baseline):

2. The manifest names https, and both contexts ignore the certificate a stand signs itself

   • setCookies() marks the session cookie secure whenever homeurl is https, so

every run over http was handed a cookie the browser drops - the page came
back carrying the login block and no error to read

• Every site baseline had been captured that way, logged out under names that

say otherwise, and profile and private had no baseline at all

• The 84 baselines are re-captured from the pre-batch tree, so they measure the

theme and not who was signed in

1. The audit (tools/ui-audit.php, tests/Unit/UiAuditTest.php, tests/Fixtures/ui/names.css):

2. The state law no longer fires on a registered name: focus is a declared shadow role, so --sl-shadow-focus names a ring and not a state

   • The fixture carries the case and the test asserts it, because a wrong

classifier writes a plausible number into the baseline and everything
downstream trusts it

Benefits:

• Grammar violations fall from 160 to 71 in admin and from 198 to 102 in lite, and every one that remains is a name waiting on the batch that owns its value

• Dead tokens, alias chains, tokens that cannot satisfy their property and names holding two kinds across the themes are all at zero

• Names that cannot survive inversion are gone from both themes, which is what dark mode needs before it can be a second value in one declaration

• A theme author reads 105 and 154 tokens instead of 121 and 169, and the API block says which batch still owes the rest

Technical notes:

• Rendering is unchanged: node tools/ui-shots.mjs --check reports no difference over 84 states, four breakpoints, both sessions and the hover and focus states the manifest drives

• The exception is the editor skin in admin, which no manifest page opens: it gains the five backgrounds and the one shadow the file always meant to paint

• Six groups of identical rule bodies were merged into selector lists to keep the duplicate count from rising where folding a twin token created them; no caller combines those classes today, and the class inventory stays batch 8 work

• tools/ui-audit-baseline.json re-stored: the ratchet holds count 1003 and 1637, names 71 and 102, dup 181 and 276, scoped 88 and 109

• No engine change: no filter added, no grammar extended, getFile() and checkFile() untouched

Three independent reviews found fifty-eight defects in the etalon plan, most of them mine. The gravest was silent: the dark-mode toggle was specified as a script writing a cookie, but setCookies() sets httponly, so it could not have worked at all. Every checkable claim was re-derived from the tree, and every number in the plan now names the command that produces it.

Core changes:

1. Facts corrected against the tree (docs/THEME-ETALON-2026.md):

2. --sl-shadow-soft was attributed to the wrong themes

   • admin holds a colour, lite a whole shadow, not the reverse
   • the "ten dead shadows" built on that mistake do not exist; both themes are correct
3. --sl-color-primary-hover is not dead in lite: four uses in toastui/skin.css
4. the monitor series are upload, download, CPU and RAM; there is no disk
5. <html> lives in lite's partials/site-header.html, which opens every public page
6. RSS carries six locale files and its index renders a real HTML page
7. Contradictions inside the plan resolved:
8. component tokens were forbidden literals while being the answer to a unique value
9. breakpoints cannot be themed at all, which contradicted "edit one block"
10. the metric claimed every batch lowers it, false for four batches of ten
11. the ratchet baseline was written once, so a regression passed against an old figure
12. batch 0 required the tool it builds
13. Dark mode made buildable rather than described:
14. the cookie goes through getCookies/setCookies with the $conf['user_c'] prefix
15. the toggle is a POST with CSRF, because httponly blocks any script
16. light-dark() returns a colour, so shadows compose from colour tokens instead
17. admin plumbing lands in batch 4, lite roots and the site toggle in batch 7
18. Gates made honest about what they can prove:
19. contrast pairs are crawled from computed styles, not multiplied token by token
20. the duplicate gate allowlists what a machine cannot judge
21. theme creation is two gates, static and HTTP, sharing one lifecycle
22. the markup scan tokenises PHP, since a grep misses concatenation and heredocs

Benefits:

• Every figure is reproducible: eight audit flags, one per measurement
• A snap that looks wrong now bends the layout, never the ladder
• The machine-readable contract moves to tools/, so a clone inherits it

Technical notes:

• Browser baseline rises to Chrome 123 / Safari 17.5 / Firefox 120
• Plan compressed from 1085 to 867 lines with no decision dropped
• No CSS or PHP changed in this commit