The Symbol of the Resistance

Bastet’s final message echoes in your mind: “Some symbols speak through their shapes.” Tinker buzzes excitedly ahead, as if she herself can’t wait to arrive. Eventually, you reach a clearing with an old pedestal—one that looks far more important than it probably should.

Continue the tale

“This is it!” Tinker chirps triumphantly, projecting a hologram above the stone. “The Symbol of the Resistance! A circle for protection, a square for stability, and the lines… well, they connect it all. Draw it—and it’ll surely glow with magic.”

You examine the engravings, which are definitely staring at you… despite having no eyes. With much less confidence than you pretend to have,
you begin to recreate the shapes. Tinker offers helpful commentary like:
“More to the right!” and “That was almost straight!”

Eventually, the elements come together into a harmonious whole:
the square in the center, waves of circles around it, and lines that connect everything. Just as you brush the dust from your hands, the pedestal begins to glow. A soft, pulsing light fills the clearing, and the trees around you stand like silent witnesses to a great revelation.

“Bastet would be proud of you,” Tinker announces—sounding exactly like she did all the work herself. “You brought the symbol to life.” You gaze at the sign, feeling a strange mix of pride and disbelief. It really does look impressive.
And if this is truly the symbol that will unite the resistance—then maybe you just did something truly great.

Or at the very least…
something that looks really cool.

Decipher the Symbol of Freedom

Find the correct solution words and enter them into the console.
Only then can Tinker complete the code and reveal the hidden symbol of the Resistance.

SVGs Styling SVGs

Solve the task here in the console [–> Open in a new tab]

HTML
    <svg>
        <!--  Rectangle: Stability and Center -->
        <rect class="square" x="100" y="100" width="100" height="100"></rect>

        <!-- Target Circles -->
        <circle class="circle" cx="150" cy="150" r="50"></circle>
        <circle class="circle" cx="150" cy="150" r="80"></circle>
        <circle class="circle" cx="150" cy="150" r="110"></circle>

        <!-- Lines: Direction and Connection -->
        <line class="line" x1="150" y1="20" x2="150" y2="280"></line>
        <line class="line" x1="20" y1="150" x2="280" y2="150"></line>
    </svg>
CSS
body {
    font-family: 'Segoe UI', sans-serif;
    color: #333;
}

.container {
    border: 1px solid #333;
    padding: 3rem;
    margin: auto;
    background-color: #FFF6D7;
    max-width: 500px;
}

h1,
h2 {
    color: #ac3c13;
}

svg {
    width: 300px;
    height: 300px;
}

.square {
    fill: darkolivegreen;
}

.circle {
    fill: none;
    stroke: orange;
    stroke-width: 7px;
    filter: drop-shadow(1px 1px 1px black);
}

.line {
    stroke: black;
    stroke-width: 2px;
    stroke-dasharray: 4, 4;
}
Treat for Bastet?
Treat for Bastet?
Scroll to Top