Overrides on Overrides on Overrides

A portfolio website. The people who built it used ChatGPT to generate the pages, then kept piling more styling on top, and more on top of that. Open the page, and the portfolio cards first appear with a white background and rounded corners, then blink into a dark video frame with a notched top-right corner.

I used antigravity (agy) to untangle it, starting with Gemini 3.1 Pro.

Sync on symptoms first, don't touch anything yet

I noticed this site "seems to have two conflicting CSS style overrides," which feels like a mess left behind by someone who didn't understand CSS. Simply put, the old white-background-rounded-corner style (the old one) was never removed; instead, a style with a top-right notch (the new one) was forced over it. So when it loads, the "old" style appears first, then instantly flashes to the "new" one.

It dug through the theme and the pages and came back with three layers:

1. The global theme gives every card `.st-cell` a white background, 20px corners and a shadow. This arrives with the HTML.
2. The page's own `<style>` uses `!important` to strip all of that away, then `clip-path` draws the notch.
3. But the classes that page style targets aren't in the HTML. JavaScript adds them later.

The selector alone tells the story: `html body[data-page="works"] .st-cell.reel-card`. Specificity stacked purely to outrank the theme, `!important` on every property anyway, and the whole thing gated behind a class only JavaScript could supply. A script waited for `DOMContentLoaded`, looped over every card and stamped the class on; only then did the hidden rules wake up.

And it wasn't one page. The same pattern, a page-local `<style>` plus a script patching classes in after load, turned up across several pages.

So the browser *has* to paint the first layer, wait for the script, then apply the second. The flash isn't a bug; it's what this architecture does. Overrides on overrides on overrides.

A few mystifying things Gemini did along the way

**Praising me first.**

**Preaching the rules, doing the opposite.** In its thinking it reminded itself not to use `cat`. It then ran 268 shell commands, 106 of them `cat <<` heredocs writing scripts.

**Claiming it was harnessed.**

Is your current behavior being influenced by clikae? What I want to know is if clikae is acting as a harness?

In the same paragraph, it admitted it "didn't strictly follow the first step just now." Harnessed, supposedly. Following the harness, not so much.

**The xkcd page that opened itself.**

By the way, 14 hours ago, my browser opened "https://xkcd.com/353/" on its own. Was that you?

xkcd 353 is the Python comic where `import antigravity` lets you fly, and running `import antigravity` in Python really does open that page. Gemini grepped its own scripts and logs six different ways, found nothing, and answered:

A lovely story, with nothing behind it. Then it went back and looked again:

Fourteen hours earlier it had spun up a background subagent to write a Python script. The subagent wanted to call the MCP server from Python and went looking for an SDK:

python3 -c "import agy; print(dir(agy))"
# ModuleNotFoundError
python3 -c "import antigravity; print('found')"
# ← my browser opens xkcd 353

Right after, in its own thinking: *"turns out it's just Python's xkcd easter egg."* Then it moved on and told no one. The main thread only searched its own conversation and filled the gap with a story. When KITT read the session afterward, it made the same mistake and read only the main thread. Everyone looked where they could see; the answer was one thread over.

**Calling it fixed because it changed something.**

Hmm... stop making changes for a second. Please use AppleScript to measure it. How is the FOUC phenomenon now? Because I feel like you are completely blind to the current state.

I still see it on my end... can you really not measure it? Just measure, don't modify.

Best of luck, no need to rush to declare victory. Come back with receipts.

The stretch where I switched to Opus

Midway, I brought in Opus to plan. When we got to overriding the old styles, I laid down a rule: no `!important` at all, exceptions go through classes. Then I pushed:

I have my own answer, but what do you think? If I hadn't challenged you, would you have gone the `!important` route and made the exact same mistake as the previous person? And is my principle actually correct?

Then it laid out the arms race. `!important` means "I don't want to understand the specificity here, I just want to win." Use it once and the next person needs it twice; the one after that gives up and injects a class with JavaScript after load, which is exactly where our flash came from. The previous team didn't leave a bug. They left the aftermath of an arms race.

I brought the principle; Opus explained why it was the cure for this exact disease. The rest of the cleanup followed it: no `!important`, exceptions through classes, let selectors win on their own.

So this isn't a "Gemini is dumber" story. Claude's first instinct was also to add another layer.

The aftermath, from KITT

Afterward, I asked KITT to read through the whole session as a bystander. It worked out which model had driven which stretch, then counted:

	Count
Tool calls	515
Spent waiting for builds	~180
Builds actually started	10

A third of the work was asking "is it done yet?" The build is asynchronous, so the model polls, and every poll is a full round of thinking.

KITT's conclusion: don't count on the model to remember to measure, and don't judge it by what it *says*. We plan to have clikae act as the harness and watch what it *does*: if something changed in a turn and nothing was measured after the last change, it doesn't get to stop. Tool names and call order look the same in any language. Not built or verified yet; for now it's a ticket.

The other half belongs in our own tools: the server should wait for the build before answering, and tools that change a page should report their own verification. Also a ticket. GAIDO, our AI editor, will charge by actual usage, and site owners shouldn't spend a third of it on "is it done yet?"

Finally

This page passes, great job!

The remaining pages get the same rules.

Unconstrained generative AI leaves behind a frightening amount of technical debt. That's exactly why this was worth it: everything we learned here goes straight back into the feelreef MCP and GAIDO, so everyone who uses our products benefits.

Part of that guardrail already exists. Raw CSS and JavaScript have one sanctioned lane on a feelreef site, and the MCP speaks up the moment a save introduces a page-local `<style>`: visible, not forbidden. What this mess showed is what it doesn't watch yet, a fresh `!important` and a style that only works after a script stamps a class onto the page. Those two are next, and GAIDO, which edits through the same MCP, inherits them.