Add the design system extracted from the app

design/ holds the tokens for all six themes, the type scale, spacing,
radii and sizes, the brand and usage guidelines, a guide and static
preview for each component, the logo and icons as SVG, and wireframes of
the tablet and foldable column layout.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01RhmDdrN5hgWrgRcFLAMsV6

design/components/SettingToggle/README.md

@@ -0,0 +1,8 @@
+# SettingToggle
+
+A setting with a one-line explanation and a Material Switch.
+
+- **Consumer provides:** a title, a note and the checked state.
+- Title in `body-large` / `on-surface`; the note under it in `body-small` / `on-surface-variant`; the Switch at the end. `space-12` above each toggle.
+- The note says what the setting does *and* when it applies ("Applies to the dark themes; saves power on OLED screens"). Put a toggle beside the choice it modifies — OLED sits right under the theme chips.
+- Switch on: `primary` track, `on-primary` thumb. Off: `surface-container-highest` track with an `outline` border and thumb.

design/components/SettingToggle/preview.html

@@ -0,0 +1,7 @@
+<!-- @dsCard group="Selection" height=170 -->
+<!doctype html><html><head><meta charset="utf-8"><style>body{margin:0;background:var(--surface)} .pad{padding:16px} .stack{display:flex;flex-direction:column;gap:16px} .cap{font:12px/16px var(--font-libron);color:var(--on-surface-variant);direction:ltr;text-align:left;margin-bottom:4px}</style></head><body>
+<div class="gj pad" dir="rtl" lang="fa">
+<div class="gj-toggle"><div class="gj-toggle-text"><div class="gj-toggle-title">پس‌زمینهٔ سیاه (OLED)</div><div class="gj-toggle-note">روی پوسته‌های تاریک اعمال می‌شود و در نمایشگر OLED باتری کمتری می‌برد</div></div><button class="gj-switch" role="switch" aria-checked="true" aria-label="پس‌زمینهٔ سیاه"></button></div>
+<div class="gj-toggle"><div class="gj-toggle-text"><div class="gj-toggle-title">حالت برون‌خط</div><div class="gj-toggle-note">فقط از شعرهای ذخیره‌شده بخوان</div></div><button class="gj-switch" role="switch" aria-checked="false" aria-label="حالت برون‌خط"></button></div>
+</div>
+</body></html>