/* Site360 design kit — taken from Crawltroll (crawltroll/public/ct.css + app.css).
   Every Site360 screen and product uses these tokens so they look like one product. */
:root {
  /* Warm, editorial palette in the style of the Claude Console */
  --bg:#FAF9F5; --surface:#FFFFFF; --surface-2:#F4F3EE; --surface-3:#EAE8E0;
  --border:#E8E6DC; --border-strong:#DAD7CC;
  --text:#141413; --muted:#6F6D66; --subtle:#9C9A92;
  --primary:#141413; --primary-hover:#2B2A27; --primary-soft:#EEECE5; --on-primary:#FAF9F5;
  --accent:#C96442; --accent-soft:#F5E4DC; --link:#2A5DB0;
  --success:#2E7D32; --warning:#B7791F; --danger:#C0392B; --info:#2A5DB0; --live:#D9572B; --moss:#5E8C6A; --rage:#C96442;
  --sh-sm:none; --sh-md:0 1px 2px rgba(20,20,19,.04); --sh-lg:0 12px 32px -8px rgba(20,20,19,.16);
  --ease:cubic-bezier(.2,.8,.2,1);
  --serif:"Source Serif 4", Georgia, serif;
}
:root[data-theme="dark"] {
  --bg:#262624; --surface:#30302E; --surface-2:#2B2B29; --surface-3:#3A3936;
  --border:#3D3C38; --border-strong:#4A4944;
  --text:#F5F4EE; --muted:#A6A39A; --subtle:#7C7A73;
  --primary:#F5F4EE; --primary-hover:#FFFFFF; --primary-soft:#3A3936; --on-primary:#1F1E1D;
  --accent:#D97757; --accent-soft:#4A3329; --link:#8AB4F8;
  --success:#7BC47F; --warning:#E2B04A; --danger:#F07167; --info:#8AB4F8; --live:#E8794F; --moss:#8DB59A; --rage:#D97757;
  --sh-sm:none; --sh-md:none; --sh-lg:0 12px 32px -8px rgba(0,0,0,.5);
}
* { box-sizing:border-box; }
html,body { margin:0; height:100%; background:var(--bg); color:var(--text); font:13px/20px Inter,system-ui,sans-serif; font-feature-settings:"cv11","ss01"; -webkit-font-smoothing:antialiased; }
button { font:inherit; color:inherit; }
svg.lucide { width:16px; height:16px; stroke-width:1.75; flex:none; }
.mono { font-family:"JetBrains Mono",ui-monospace,monospace; font-size:12px; }
:root { --sans: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif; --radius: 12px; }
/* Product marks: same rounded terracotta tile, different glyph */
.mark { width:22px; height:22px; border-radius:6px; background:var(--accent) center/100% no-repeat; flex:none; display:inline-block; }
.mark.crawltroll { background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Ccircle cx='24' cy='31' r='8' fill='%23fff'/%3E%3Ccircle cx='41' cy='31' r='9.5' fill='%23fff'/%3E%3Ccircle cx='26' cy='32' r='3.2' fill='%23141413'/%3E%3Ccircle cx='43' cy='32' r='4' fill='%23141413'/%3E%3Cpath d='M20 44 q12 9 24 0' stroke='%23fff' stroke-width='3.2' fill='none' stroke-linecap='round'/%3E%3C/svg%3E"); }
.mark.site360 { background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Ccircle cx='32' cy='32' r='15' fill='none' stroke='%23fff' stroke-width='5'/%3E%3Cpath d='M32 10 a22 22 0 0 1 22 22' fill='none' stroke='%23fff' stroke-width='5' stroke-linecap='round'/%3E%3Ccircle cx='32' cy='32' r='5' fill='%23fff'/%3E%3C/svg%3E"); }
.mark.liza { background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath d='M16 20 h32 a6 6 0 0 1 6 6 v14 a6 6 0 0 1 -6 6 h-18 l-9 8 v-8 h-5 a6 6 0 0 1 -6 -6 v-14 a6 6 0 0 1 6 -6z' fill='%23fff'/%3E%3Ccircle cx='25' cy='33' r='3' fill='%23E2876B'/%3E%3Ccircle cx='32' cy='33' r='3' fill='%23E2876B'/%3E%3Ccircle cx='39' cy='33' r='3' fill='%23E2876B'/%3E%3C/svg%3E"); }
.mark.funnelguy { background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath d='M14 18 h36 l-13 16 v12 l-10 6 v-18z' fill='%23fff'/%3E%3Ccircle cx='22' cy='12' r='3' fill='%23fff'/%3E%3Ccircle cx='32' cy='9' r='3' fill='%23fff'/%3E%3Ccircle cx='42' cy='12' r='3' fill='%23fff'/%3E%3C/svg%3E"); }
/* Product colors: one terracotta family, a different shade per product */
:root { --c-site360: #C96442; --c-crawltroll: #A64B2A; --c-liza: #E2876B; --c-funnelguy: #C9762F; }
.mark.site360 { background-color: var(--c-site360); }
.mark.crawltroll { background-color: var(--c-crawltroll); }
.mark.liza { background-color: var(--c-liza); }
.mark.funnelguy { background-color: var(--c-funnelguy); }
