Uran Agent Kit: aby AI přestala hádat vaše CSS

Znáte ten okamžik. Potřebujete na desktopu pět sloupců produktů místo čtyř, otevřete Cursor nebo Claude, popíšete úpravu pěti větami, a agent vyplodí třicet řádků CSS. Redeklaruje display: grid, který tam dávno je. Hádá hodnotu mezery. Vymyslí třídu, co v šabloně nikdy nebyla. Sáhne po LESS proměnné, která v runtime neexistuje. A rozhodí responzivní grid, na který nikdo nesahal. Agent přitom jen netušil, co šablona dělá za něj. Bez toho je každá úprava střelba naslepo, a podle toho výsledek vypadá.

Problém ale není v agentovi. Agent jen nevidí, co šablona Uran už nastavuje. Hodně se v ní řeší přes administraci, ale doladění vzhledu, grid, flex, drobnosti, to končí ve vlastním CSS. A tam agentura sáhne po AI. Ta nedostane žádný kontext, takže si ho domyslí. Špatně.

Co je Uran Agent Kit a jak funguje

Uran Agent Kit je plugin do Rocketoo. Vezme reálné zkompilované CSS konkrétního e-shopu a vygeneruje z něj kontext pro AI agenta. Ten kontext vystaví na dvou veřejných URL přímo z daného e-shopu:

https://www.vasedomena.cz/agentkit/selectors.json
https://www.vasedomena.cz/agentkit/agents.md

První URL, selectors.json, je strojový index. Najdete v něm každý selektor šablony i s vlastnostmi, které už má nastavené — včetně variant v media queries. K tomu seznam CSS proměnných z :root i s jejich konkrétními hodnotami a breakpointy šablony.

Druhá URL, agents.md, je čitelný kontext pro agenta. Shrnuje pravidla pro úpravu vzhledu, tabulku dostupných :root proměnných, anatomii komponent (co už který selektor řeší) a přehled toho, co patří do nastavení v administraci, ne do CSS.

Podstatné je, odkud kit ta data čte. Bere je z reálného CSS daného e-shopu, takže barvy z :root i ostatní hodnoty sedí přesně na tu jednu instanci. Při každém rebuildu šablony kit kontext přegeneruje, takže nikdy nezestárne.

A ještě jedna věc, kterou agent typicky netuší: vlastní CSS v Uranu žije v izolovaném souboru, který nenačítá LESS proměnné z theme.css. Použitelné jsou v něm jedině :root proměnné. Kit to agentovi řekne rovnou, a agent přestane sahat po @proměnných, které tam stejně nefungují.

Kit agentovi vnutí pět pravidel. Přepisovat jen to, co se mění, a neopakovat vlastnosti, které selektor už má. Sahat jen po :root proměnných, ne po LESS @proměnných. Nejdřív ověřit, jestli úpravu neřeší nastavení v administraci. Držet breakpointy šablony místo vymýšlení vlastních. Používat existující selektory, ne nové třídy.

Konkrétní příklad

Kontejner produktů .rocketoo-products-container už má v šabloně display: grid, nastavený grid-gap i responzivní počet sloupců — jeden na mobilu, postupně dva, tři a čtyři podle breakpointů. Agentura chce na desktopu pět. Bez kitu agent obvykle napíše celý blok znovu, s vlastním display: grid a vlastním gapem. S kitem ví, že stačí jediné:

@media (min-width: 1280px) {
  .rocketoo-products-container {
    grid-template-columns: repeat(5, 1fr);
  }
}

Jeden override, jedna vlastnost, žádný konflikt se zbytkem gridu. V tom je celý rozdíl.

Pro koho to je a jak ho nasadit

Primárně kit cílí na agentury, které upravují vzhled e-shopů na šabloně Uran a sahají u toho po AI. Posloužit umí i technicky zdatným provozovatelům, kteří si CSS ladí sami.

Nasazení nepotřebuje zdrojové kódy ani konkrétní vývojové prostředí. Kit funguje externě, nezávisle na tom, jaký AI nástroj agentura používá. Agentura vezme ty dvě URL, přilepí je do promptu — ať už agent běží v Cursoru, jiném AI IDE, nebo přímo v ChatGPT či Claude — a od té chvíle pracuje s reálným kontextem konkrétního e-shopu místo dohadů.

Autopilot na design to není. Je to kontext pro agenta, ne náhrada za rozumné zadání. Když agentovi popíšete nesmysl, kit z toho smysl neudělá. Postará se o jiné: o to, aby výsledek seděl na šablonu a aby override zůstal minimální, místo aby bobtnal s každou další úpravou.

Co kit neumí

Autopilot na design to není. Je to kontext pro agenta, ne náhrada za rozumné zadání. Když agentovi popíšete nesmysl, kit z toho smysl neudělá. Postará se o jiné: o to, aby výsledek seděl na šablonu a aby override zůstal minimální, místo aby bobtnal s každou další úpravou.

Uran Agent Kit nedělá z AI lepšího designéra. Dělá z ní agenta, který ví, do čeho sahá. Pokud vás zajímá nasazení na vašich e-shopech, ozvěte se na chceme@rocketoo.cz.