Pq234/robot-learning-tutorial

1@import "https://fonts.googleapis.com/css2?family=Source+Sans+Pro:ital,wght@0,200..900;1,200..900&display=swap";2 3html {4  font-size: 16px;5  line-height: 1.6;6}7 8.content-grid main {9  color: var(--text-color);10}11 12.content-grid main p {13  margin: 0 0 var(--spacing-3);14}15 16.content-grid main h2 {17  font-weight: 600;18  font-size: clamp(22px, 2.6vw, 32px);19  line-height: 1.2;20  margin: var(--spacing-10) 0 var(--spacing-5);21  padding-bottom: var(--spacing-2);22  border-bottom: 1px solid var(--border-color);23}24 25.content-grid main h3 {26  font-weight: 700;27  font-size: clamp(18px, 2.1vw, 22px);28  line-height: 1.25;29  margin: var(--spacing-8) 0 var(--spacing-4);30}31 32.content-grid main h4 {33  font-weight: 600;34  text-transform: uppercase;35  font-size: 14px;36  line-height: 1.2;37  margin: var(--spacing-8) 0 var(--spacing-4);38}39 40.content-grid main a {41  color: var(--primary-color);42  text-decoration: none;43  background: var(--sufrace-bg);44  border-bottom: 1px solid color-mix(in srgb, var(--primary-color, #007AFF) 40%, transparent);45  ;46}47 48/* External links with arrow indicator */49.content-grid main a[href^="http"]:not([href*="localhost"]):not([href*="127.0.0.1"]):not([href*="0.0.0.0"])::after {50  content: "↗";51  display: inline-block;52  margin-left: 6px;53  font-size: 0.9em;54  opacity: 0.8;55  transition: opacity 0.2s ease, transform 0.2s ease;56  transform: translateY(-1px);57  font-weight: 600;58}59 60/* External links with arrow indicator */61.content-grid main a[href^="http"]:not([href*="localhost"]):not([href*="127.0.0.1"]):not([href*="0.0.0.0"]) {62  white-space: nowrap;63}64 65.content-grid main a:hover {66  color: var(--primary-color-hover);67  border-bottom: 1px solid color-mix(in srgb, var(--primary-color, #007AFF) 40%, transparent);68  ;69}70 71/* Do not underline heading links inside the article (not the TOC) */72.content-grid main h2 a,73.content-grid main h3 a,74.content-grid main h4 a,75.content-grid main h5 a,76.content-grid main h6 a {77  color: inherit;78  border-bottom: none;79  text-decoration: none;80}81 82.content-grid main h2 a:hover,83.content-grid main h3 a:hover,84.content-grid main h4 a:hover,85.content-grid main h5 a:hover,86.content-grid main h6 a:hover {87  color: inherit;88  border-bottom: none;89  text-decoration: none;90}91 92.content-grid main ul,93.content-grid main ol {94  padding-left: 24px;95  margin: 0 0 var(--spacing-3);96}97 98.content-grid main li {99  margin-bottom: var(--spacing-2);100}101 102.content-grid main li:last-child {103  margin-bottom: 0;104}105 106.content-grid main blockquote {107  border-left: 2px solid var(--border-color);108  padding-left: var(--spacing-4);109  font-style: italic;110  color: var(--muted-color);111  margin: var(--spacing-4) 0;112}113 114.content-grid main hr {115  border: none;116  border-bottom: 1px solid var(--border-color);117  margin: var(--spacing-5) 0;118}119 120.muted {121  color: var(--muted-color);122}123 124[data-footnote-ref] {125  margin-left: 4px;126}127 128.content-grid main mark {129  background-color: color-mix(in srgb, var(--primary-color, #007AFF) 30%, transparent);130  border: 1px solid color-mix(in srgb, var(--primary-color) 38%, transparent);131  color: inherit;132  padding: 4px 6px;133  border-radius: 4px;134  font-weight: 500;135  box-decoration-break: clone;136  -webkit-box-decoration-break: clone;137}138 139.feature-grid {140  display: grid;141  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));142  gap: 12px;143  margin: 46px 0;144}145 146.feature-card {147  display: flex;148  flex-direction: column;149  padding: 16px;150  border: 1px solid color-mix(in srgb, var(--primary-color) 40%, transparent);151  ;152  background: color-mix(in srgb, var(--primary-color, #007AFF) 05%, transparent) !important;153  border-radius: 8px;154  text-decoration: none;155  color: inherit;156  transition: all 0.2s ease;157}158 159.feature-card:hover {160  transform: translateY(-2px);161  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);162}163 164.feature-card strong {165  font-size: 14px;166  font-weight: 600;167  color: var(--text-color);168  color: var(--primary-color) !important;169  margin-bottom: 0px !important;170}171 172.feature-card span {173  font-size: 12px;174  color: var(--muted-color);175  color: var(--primary-color) !important;176  margin-bottom: 0px !important;177  opacity: 1;178}179 180.katex .tag {181  background: none;182  border: none;183  opacity: 0.4;184}