--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/in/x.css	Fri Mar 13 13:13:07 2026 +0500
@@ -0,0 +1,149 @@
+/* 1. The Reset: Neutralizing browser quirks across engines */
+* { 
+    box-sizing: border-box; 
+    margin: 0; 
+    padding: 0;
+}
+
+/* 2. Typography: Manrope with system fallbacks for lightweight browsers */
+@font-face {
+    font-family: 'Manrope';
+    src: url('https://qwaderton.org/Manrope-VariableFont_wght.woff2') format('woff2-variations');
+    font-weight: 100 800;
+}
+
+html {
+    font-size: 100%;
+    -webkit-text-size-adjust: 100%;
+}
+
+body {
+    font-family: 'Manrope', system-ui, -apple-system, sans-serif;
+    line-height: 1.6;
+    color: #333;
+    background: #fff;
+    max-width: 45rem; /* The "Golden Width" for readability */
+    margin: 2rem auto;
+    padding: 0 1rem;
+    text-rendering: optimizeLegibility;
+}
+
+/* 3. Semantic Layout: No classes needed */
+header, nav, main, section, footer {
+    display: block; /* Fix for older browsers */
+    margin-bottom: 2rem;
+}
+
+footer {
+    border-top: 1px solid #eee;
+    padding-top: 0.5rem;
+}
+
+footer p {
+    float: left;
+    width: 50%;
+}
+
+footer p:nth-child(2) {
+    text-align: right;
+}
+
+nav ul {
+    list-style: none;
+    padding-bottom: 0.5rem;
+}
+
+nav ul:first-child:not(:last-child) {
+    float: left;
+}
+
+nav ul:last-child {
+    border-bottom: 1px solid #eee;
+}
+
+nav ul:nth-child(2) {
+    text-align: right;
+}
+
+nav li {
+    display: inline;
+    margin-right: 1rem;
+}
+
+/* 4. Elements */
+h1, h2, h3, h4 {
+    line-height: 1.2;
+    margin-top: 2rem;
+    margin-bottom: 1rem;
+    font-weight: 700;
+}
+
+a { color: #0070f3; text-decoration: none; }
+a:hover { text-decoration: underline; }
+
+p, blockquote, ul, ol, dl, table, pre {
+    margin-bottom: 1.5rem;
+}
+
+blockquote {
+    border-left: 4px solid #eee;
+    padding-left: 1rem;
+    font-style: italic;
+}
+
+img, video {
+    max-width: 100%;
+    height: auto;
+}
+
+/* 5. Tables & Forms: Standardized for basic engines */
+table {
+    width: 100%;
+    border-collapse: collapse;
+}
+
+th, td {
+    padding: 0.5rem;
+    text-align: left;
+    border-bottom: 1px solid #eee;
+}
+
+input, textarea, button, select {
+    font-family: inherit;
+    font-size: 1rem;
+    padding: 0.5rem;
+    margin-bottom: 1rem;
+    display: block;
+}
+
+input[type="checkbox"],input[type="radio"] {
+    display: inline
+}
+
+button, select {
+    width: auto;
+    cursor: pointer;
+    background: #333;
+    color: #fff;
+    border: none;
+    border-radius: 4px;
+}
+
+@media (max-width: 46rem) {
+    li {
+        margin-left: 1rem;
+    }
+}
+
+/* Dark mode support for modern browsers (ignored by NetSurf/Chawan) */
+@media (prefers-color-scheme: dark) {
+    body { background: #1a1a1a; color: #eee; }
+    h1, h2, h3 { color: #fff; }
+    a { color: #3291ff; }
+    blockquote { border-color: #444; }
+    th, td { border-color: #333; }
+    button { background: #eee; color: #111; }
+    input, textarea, button { background-color: #222; color: #ddd; }
+    nav ul:last-child, footer { border-color: #333; }
+}
+