Major changes and the start of my post on a rust week.

 Changes to be committed:
        modified:   .gitignore
        modified:   config.toml
        modified:   content/posts/rust.md
        modified:   templates/404.html
        modified:   templates/index.html

        new file:   templates/shortcodes/image.html
        new file:   static/css/critical.css

        deleted:    rsync_to_testing

8 files changed, 80 insertions, 28 deletions

diff --git a/.gitignore b/.gitignore
index 4f18294..10677a1 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1,2 +1,4 @@
 public/
 .obsidian/
+
+*.sh
diff --git a/config.toml b/config.toml
index 6bdf5e7..03ec1a2 100644
--- a/config.toml
+++ b/config.toml
@@ -50,9 +50,9 @@ taxonomies = [
 
 # Highlight code blocks
 highlight_code = true
-#highlight_theme = "boron" # 100% best practice contrast for comments
-highlight_theme = "ayu-dark" # 94%
-#highlight_theme = "1337" # 94%
+#highlight_theme = "boron"
+highlight_theme = "ayu-dark"
+#highlight_theme = "1337"
 
 # Use emojis like :smile: and :shrug:
 render_emoji = true
@@ -65,7 +65,7 @@ external_links_target_blank = false
 external_links_no_follow = false
 
 # Whether to set rel="noreferrer" for all external links
-external_links_no_referrer = false
+external_links_no_referrer = true
 
 # Whether smart punctuation is enabled (changing quotes, dashes, dots in their typographic form)
 # For example, `...` into `…`, `"quote"` into `“curly”` etc
diff --git a/content/posts/rust.md b/content/posts/rust.md
index d4e7f8f..9ed9ca3 100644
--- a/content/posts/rust.md
+++ b/content/posts/rust.md
@@ -16,21 +16,21 @@ I've always wanted to give Rust a "go" (pun intended as I previously wanted to t
 
 ## Day 1
 
-I've had this [interactive book](https://doc.rust-lang.org/stable/book/ch00-00-introduction.html) in my open tabs for ages at this point. Time to actually read it.
+I've had this [interactive book](https://doc.rust-lang.org/stable/book/index.html) in my open tabs for ages at this point. Time to actually read it.
 
 As far as the introduction goes, it seems the Rust book is serious/rigorous, especially when it comes to signaling the different ways a program fails:
 
-![Image](https://alphara.art/images/20250730210132.png)
+{{ image(src="images/20250730210132.png", alt="A table from the Rust book showing error types", lazy=false, fetch="high") }}
 
 Immediately after seeing this table, my educated guess was that the book will be delving deep into the borrow checker and the many intermediary checks that are done by the clever rust compiler pipeline. I'm not an expert in compilers and how written code gets magically transformed into machine code, but recently I saw [this video](https://youtu.be/XJC5WB2Bwrc) and saw that compared to pretty much any other compiled language, rust adds a bunch of extra steps that are supposed to be modern quality of life improvements. I am excited to see how this book begins.
 
 This book organizes chapters in two categories:
 
->You’ll find two kinds of chapters in this book: concept chapters and project chapters. In concept chapters, you’ll learn about an aspect of Rust. In project chapters, we’ll build small programs together, applying what you’ve learned so far.
+>You’ll find two kinds of chapters in this book: concept chapters and project chapters. In concept chapters, you’ll learn about an aspect of Rust. In project chapters, we’ll build small programs together, applying what you’ve learned so far.[^1]
 
 Aperently the image I just pasted here is related to this paragraph:
 
->An important part of the process of learning Rust is learning how to read the error messages the compiler displays: these will guide you toward working code. As such, we’ll provide many examples that don’t compile along with the error message the compiler will show you in each situation. Know that if you enter and run a random example, it may not compile! Make sure you read the surrounding text to see whether the example you’re trying to run is meant to error. Ferris will also help you distinguish code that isn’t meant to work: (image) In most situations, we’ll lead you to the correct version of any code that doesn’t compile.
+>An important part of the process of learning Rust is learning how to read the error messages the compiler displays: these will guide you toward working code. As such, we’ll provide many examples that don’t compile along with the error message the compiler will show you in each situation. Know that if you enter and run a random example, it may not compile! Make sure you read the surrounding text to see whether the example you’re trying to run is meant to error. Ferris will also help you distinguish code that isn’t meant to work: (image) In most situations, we’ll lead you to the correct version of any code that doesn’t compile.[^1]
 
 Cool. Let's dive in further.
 
@@ -66,7 +66,7 @@ I find it interesting how the `mut` keyword is needed both when creating a new m
 
 Apparently the full correct explanation is this:
 
->The `&` indicates that this argument is a _reference_, which gives you a way to let multiple parts of your code access one piece of data without needing to copy that data into memory multiple times. References are a complex feature, and one of Rust’s major advantages is how safe and easy it is to use references. You don’t need to know a lot of those details to finish this program. For now, all you need to know is that, like variables, references are immutable by default. Hence, you need to write `&mut guess` rather than `&guess` to make it mutable. (Chapter 4 will explain references more thoroughly.)
+>The `&` indicates that this argument is a _reference_, which gives you a way to let multiple parts of your code access one piece of data without needing to copy that data into memory multiple times. References are a complex feature, and one of Rust’s major advantages is how safe and easy it is to use references. You don’t need to know a lot of those details to finish this program. For now, all you need to know is that, like variables, references are immutable by default. Hence, you need to write `&mut guess` rather than `&guess` to make it mutable. (Chapter 4 will explain references more thoroughly.)[^1]
 
 The key highlight here is that references are "immutable by default". That's one interesting quirk.
 
@@ -149,7 +149,7 @@ The first sub-chapter talks about:
 1. mutability - variables, declared by `let` are by default immutable and changing the value of an immutable variable is forbidden unless the `mut` keyword is used in the declaration. After a variable is marked as mutable, it can change its value as many times as possible in other parts of the code.
 2. constants - values declared by the `const` keyword. These don't change at any point during a program's execution and are usually "all uppercase with underscores between words". They also need to be a constant expression, "not the result of a value that could only be computed at runtime".
 3. Shadowing - this is very interesting: it basically means that you can reuse the variable name after assigning it to a different expression and even a new data type. they also have this behavior of overshadowing which means that the last declaration in the scope is the one that's going to be used by code in that scope, the book explains this pretty simply:
-   
+
 ```rust
 fn main() {
     let x = 5;
@@ -221,4 +221,6 @@ I - don't know how to feel about this. On one hand I played around with the logi
 Anyway, playing around with rust in this manner is cool, I'm pretty sure people have already figured out ways rust code can be manipulated terribly but my educated guess is that the compiler will try its best to stop anyone in situations like that.
 ## Day 3
 
-The second sub-chapter delves into Data Types.
\ No newline at end of file
+The second sub-chapter delves into Data Types.
+
+[^1]: From the [book](https://doc.rust-lang.org/stable/book/index.html)
diff --git a/rsync_to_testing b/rsync_to_testing
deleted file mode 100755
index 31c7d05..0000000
--- a/rsync_to_testing
+++ /dev/null
@@ -1,15 +0,0 @@
-#!/bin/bash
-
-set -e
-
-zola build
-
-rm -rf ~/dev/websites/alphara
-
-rsync -vhPrtz --delete-after ~/dev/blog/public/* ~/dev/websites/alphara
-
-rm -rf ~/dev/blog/public
-
-if [ "$1" = "fast-forward" ]; then
-    ~/dev/websites/rsync_everything
-fi
diff --git a/static/css/critical.css b/static/css/critical.css
new file mode 100644
index 0000000..fb27a74
--- /dev/null
+++ b/static/css/critical.css
@@ -0,0 +1 @@
+ html {line-height: 1.15;-webkit-text-size-adjust: 100%;background: #0a001f;letter-spacing: .06em;}body {margin: 0;color: #ace6f0;font-family: "Trebuchet MS", Verdana, "Verdana Ref", "Segoe UI", Candara, "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Tahoma, sans-serif;line-height: 1.6;}h1 {font-size: 2em;margin: .67em 0;}a {background-color: rgba(0, 0, 0, 0);color: #ace6f0;text-decoration: none;border: none;}hr {box-sizing: content-box;height: 0;overflow: visible;opacity: .2;border-width: 0 0 5px 0;border-style: dashed;background: rgba(0, 0, 0, 0);width: 50%;margin: 1.8em auto;}img {border-style: none;}small {font-size: 80%;}strong {font-weight: bolder;}sup {font-size: 75%;line-height: 0;position: relative;vertical-align: baseline;top: -.5em;}button {font-family: inherit;font-size: 100%;line-height: 1.15;margin: 0;overflow: visible;text-transform: none;-webkit-appearance: button;appearance: button;color: #ace6f0;}button::-moz-focus-inner {border-style: none;padding: 0;}button:-moz-focusring {outline: 1px dotted ButtonText;}::-webkit-file-upload-button {-webkit-appearance: button;font: inherit;}::-webkit-scrollbar {width: 8px;height: 8px;background: #0f1419;}::-webkit-scrollbar-thumb {background: #5c6773;}::-webkit-scrollbar-thumb:hover {background: #ace6f0;}pre, code {font-family: Consolas, "Andale Mono WT", "Andale Mono", Menlo, Monaco, "Lucida Console", "Lucida Sans Typewriter", "DejaVu Sans Mono", "Bitstream Vera Sans Mono", "Liberation Mono", "Nimbus Mono L", "Courier New", Courier, "YaHei Consolas Hybrid", monospace, "Segoe UI Emoji", "PingFang SC", "Microsoft YaHei";font-size: 1em;}pre {max-height: 40em;padding: .7em 1.1em;overflow: auto;font-size: .9em;line-height: 1.5;letter-spacing: normal;white-space: pre-wrap;word-wrap: break-word;border-radius: 4px;-webkit-overflow-scrolling: touch;}pre code {padding: 0;margin: 0;background: #0f1419;color: #ace6f0;}code {color: #0a001f;background: #828ff9;border-radius: 3px;padding: 0 3px;margin: 0 4px;word-break: break-all;letter-spacing: normal;}.section-inner {margin: 0 auto;max-width: 1200px;width: 93%;}.thin {max-width: 720px;margin: auto;}.feather {display: inline-block;vertical-align: -.125em;width: 1em;height: 1em;}.desktop-only-ib {display: none;}#site-header {position: fixed;z-index: 1;bottom: 0;width: 100%;box-sizing: border-box;box-shadow: -1px -2px 3px rgba(0, 0, 0, .45);background-color: #0a001f;}.hdr-wrapper {display: flex;justify-content: space-between;align-items: center;padding: .5em 0;font-size: 1.2rem;}.hdr-wrapper .site-branding {display: inline-block;margin-right: .8em;font-size: 1.2em;}.hdr-wrapper .site-nav {display: inline-block;font-size: 1.1em;}.hdr-wrapper .site-nav a {margin-left: .8em;}.hdr-icons {font-size: 1.2em;}.hdr-social {display: inline-block;margin-left: .6em;}.hdr-social > a {margin-left: .4em;}.hdr-btn {border: none;background: none;padding: 0;margin-left: .4em;}#menu-btn {display: none;margin-left: .6em;}#mobile-menu {position: fixed;bottom: 4.8em;right: 1.5em;display: none;padding: .6em 1.8em;z-index: 1;box-sizing: border-box;box-shadow: -1px -2px 3px 0px rgba(0, 0, 0, .45);background-color: #0a001f;}#mobile-menu ul {list-style: none;margin: 0;padding: 0;line-height: 2;font-size: 1.2em;}#site-footer {text-align: center;font-size: .9em;margin-bottom: 96px;margin-top: 64px;}#site-footer p {margin: 0;}#spotlight {display: flex;height: 100vh;flex-direction: column;align-items: center;justify-content: center;max-width: 93%;margin: auto;font-size: 1.5rem;}#home-center {display: flex;flex-grow: 1;flex-direction: column;justify-content: center;}#home-title {margin: 0;text-align: center;}#home-subtitle {margin-top: 0;margin-bottom: 1.5em;text-align: center;line-height: normal;font-size: .7em;font-style: italic;opacity: .9;}#home-social {font-size: 1.4em;text-align: center;opacity: .8;}#home-social a {margin: 0 .2em;}#home-nav {opacity: .8;}#home-nav a {display: block;text-align: center;margin-top: .5em;}#home-footer {text-align: center;font-size: .6em;line-height: normal;opacity: .7;}#home-footer p {margin-top: 0;}.post-header {margin-top: 1.2em;line-height: normal;}.post-header .post-meta {font-size: .9em;letter-spacing: normal;opacity: .7;}.post-header h1 {margin-top: .1em;}.content {text-align: justify;text-justify: inter-ideograph;}.content a {word-break: break-all;border: none;box-shadow: inset 0 -1px 0 #e94c80;}.content img {display: block;max-width: 100%;height: auto;margin: auto;border-radius: 4px;}.content ul {padding: 0;margin-left: 1.8em;}blockquote {border-left: .25em solid;margin: 1em;padding: 0 1em;font-style: italic;}hr.post-end {width: 50%;margin-top: 1.6em;margin-bottom: .8em;margin-left: 0;border-style: solid;border-bottom-width: 4px;}.post-info {font-size: .8rem;line-height: normal;opacity: .7;}.post-info p {margin: .8em 0;}.post-info svg {margin-right: .8em;}.post-info .tag {margin-right: .5em;}.post-info .tag::before {content: "#";}.post-nav {display: flex;justify-content: space-between;margin-top: 1.5em;margin-bottom: 2.5em;font-size: 1.2em;}.post-nav a {flex-basis: 50%;flex-grow: 1;}.post-nav .next-post {text-align: left;padding-right: 5px;}.post-nav .prev-post {text-align: right;padding-left: 5px;}.posts-group {display: flex;margin-bottom: 1.9em;line-height: normal;}.posts-group .post-year {padding-top: 6px;margin-right: 1.8em;font-size: 1.6em;color: #828ff9;}.posts-group .posts-list {flex-grow: 1;margin: 0;padding: 0;list-style: none;}.posts-group .post-item {border-bottom: 1px #828ff9 dashed;}.posts-group .post-item a {display: flex;justify-content: space-between;align-items: baseline;padding: 12px 0;}.posts-group .post-day {flex-shrink: 0;margin-left: 1em;color: #828ff9;}#toc {position: fixed;left: 50%;top: 0;display: none;}.toc-title {margin-left: 1em;margin-bottom: .5em;font-size: .8em;font-weight: bold;}#TableOfContents {font-size: .8em;opacity: .7;}#TableOfContents ul {padding-left: 1em;margin: 0;}#TableOfContents > ul {list-style-type: none;}@media (min-width: 800px) {.site-main {margin-top: 3em;}hr.post-end {width: 40%;}}@media (min-width: 960px) {.site-main {margin-top: 6em;}}@media (min-width: 1300px) {.site-main {margin-top: 8em;}.desktop-only-ib {display: inline-block;}hr.post-end {width: 30%;}#toc {top: 13em;margin-left: 370px;max-width: 220px;}}@media (min-width: 1800px) {.site-main {margin-top: 10em;}.section-inner {max-width: 1600px;}.thin {max-width: 960px;}hr.post-end {width: 30%;}#toc {top: 15em;margin-left: 490px;max-width: 300px;}}@media (max-width: 760px) {.hide-in-mobile, .site-nav.hide-in-mobile {display: none;}#menu-btn {display: inline-block;}.posts-group {display: block;}.posts-group .post-year {margin: -6px 0 4px;}}@media (max-width: 520px) {hr.post-end {width: 60%;}#mobile-menu {right: 1.2em;}}
diff --git a/templates/404.html b/templates/404.html
index c565d09..58d8f52 100644
--- a/templates/404.html
+++ b/templates/404.html
@@ -35,7 +35,7 @@
 
   <div class="banner-404">
     <h1>404</h1>
-    <p>Oops, police door not found...</p>
+    <p>Oops, URL not found...</p>
     <p class="btn-404">
       <a href="{{ config.base_url }}">
         <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"
diff --git a/templates/index.html b/templates/index.html
index a14a2d0..c968941 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -61,7 +61,23 @@
     <link rel="shortcut icon" href="{{ get_url(path="favicon.ico") }}"/>
 
     <!-- Stylesheets -->
-    <link rel="stylesheet" href="{{ get_url(path="style.css") }}"/>
+    <!--<link rel="stylesheet" href="{{ get_url(path="style.css") }}"/> old way of doing this, inefficient -->
+
+
+    {# 1. Load our single combined critical CSS file. #}
+    {% set critical_css = load_data(path="static/css/critical.css", required=false) %}
+
+    {# 2. If it was found, inline it. #}
+    {% if critical_css %}
+      <style>{{ critical_css | safe }}</style>
+    {% endif %}
+
+    {# 3. Load the full stylesheet asynchronously (this part is the same). #}
+    <link rel="stylesheet" href="{{ get_url(path='style.css') }}" media="print" onload="this.media='all'">
+
+    {# 4. Provide a fallback for browsers without JavaScript. #}
+    <noscript><link rel="stylesheet" href="{{ get_url(path='style.css') }}"></noscript>
+    <!-- Stylesheets End -->
 
     {% if page.extra.math %}
     <!-- Math rendering with KaTeX -->
diff --git a/templates/shortcodes/image.html b/templates/shortcodes/image.html
new file mode 100644
index 0000000..8b1a006
--- /dev/null
+++ b/templates/shortcodes/image.html
@@ -0,0 +1,46 @@
+{# /templates/shortcodes/image.html (Version 7 - The Final Quality Fix) #}
+
+{# --- Manually check for required 'src' and 'alt' parameters --- #}
+{% if not src %}
+    {{ throw(message="The 'src' parameter is required for the image shortcode.") }}
+{% endif %}
+{% if not alt %}
+    {{ throw(message="The 'alt' parameter is required for the image shortcode.") }}
+{% endif %}
+
+{# --- Get optional parameters, with sensible defaults --- #}
+{% set lazy = lazy | default(value=true) %}
+{% set fetch = fetch | default(value="auto") %}
+{% set quality = quality | default(value=60) %} {# <-- New: Set a default quality #}
+
+{# --- Let Zola process the image into ALL necessary formats and sizes --- #}
+{% set image_meta = get_image_metadata(path=src) %}
+
+{# Create small versions (PNG and WebP) with higher compression #}
+{% set image_small_png = resize_image(path=src, width=383, op="fit_width", quality=quality) %}
+{% set image_small_webp = resize_image(path=src, width=383, op="fit_width", format="webp", quality=quality) %}
+
+{# Create large versions (PNG and WebP) with higher compression #}
+{% set image_large_png = resize_image(path=src, width=682, op="fit_width", quality=quality) %}
+{% set image_large_webp = resize_image(path=src, width=682, op="fit_width", format="webp", quality=quality) %}
+
+<picture>
+    {# --- MODERN FORMATS FIRST (WebP) --- #}
+    <source media="(max-width: 600px)" srcset="{{ image_small_webp.url }}" type="image/webp">
+    <source media="(min-width: 601px)" srcset="{{ image_large_webp.url }}" type="image/webp">
+
+    {# --- FALLBACK FORMATS (PNG) --- #}
+    <source media="(max-width: 600px)" srcset="{{ image_small_png.url }}">
+    <source media="(min-width: 601px)" srcset="{{ image_large_png.url }}">
+
+    {# --- FINAL FALLBACK <img> --- #}
+    <img
+        src="{{ image_large_png.url }}"
+        width="{{ image_meta.width }}"
+        height="{{ image_meta.height }}"
+        alt="{{ alt }}"
+        {% if lazy %}loading="lazy"{% else %}loading="eager"{% endif %}
+        fetchpriority="{{ fetch }}"
+        style="width: 100%; height: auto; border-radius: 4px; margin: 1.5rem 0;"
+    >
+</picture>