/* Design-Tokens – aus dem "Holzapfel Design System" (claude.ai/design), Stand 23.07.2026.
   Diese Datei bitte nicht von Hand ändern – sie spiegelt das Design-System. */
@import url('https://fonts.googleapis.com/css2?family=EB+Garamond:ital,wght@0,400..700;1,400..600&family=IBM+Plex+Sans:ital,wght@0,400;0,500;0,600;1,400&family=IBM+Plex+Mono:wght@400;500&display=swap');

:root{
/* base — beige grounds (from textile background) */
--beige-50:#FBF7EE;--beige-100:#F5EEDF;--beige-200:#EBE1CC;--beige-300:#DDCFB4;--beige-400:#C9B693;
/* base — ink (warm brown-black) */
--ink-900:#332821;--ink-700:#54463A;--ink-500:#7C6C5C;--ink-300:#A99A88;
/* base — accents (from zigzag yarns) */
--terracotta-500:#BC5E31;--terracotta-600:#A94F26;--terracotta-700:#8E4220;
--burgundy-600:#7A3338;--burgundy-700:#632A2F;
--amber-500:#D99A3D;--amber-600:#C4832B;
--olive-500:#8A8951;--olive-600:#727142;
--teal-500:#3E7E8C;--teal-600:#33707E;--teal-700:#2A5C68;
--plum-500:#7C5A6E;--plum-600:#684A5C;
/* semantic */
--surface-page:var(--beige-100);--surface-card:#FDFAF2;--surface-inset:var(--beige-200);--surface-inverse:var(--ink-900);
--text-body:var(--ink-900);--text-muted:var(--ink-500);--text-faint:var(--ink-300);--text-on-accent:var(--beige-50);--text-inverse:var(--beige-100);
--accent:var(--terracotta-600);--accent-hover:var(--terracotta-700);--accent-soft:#F0DECF;
--link:var(--teal-700);--link-hover:var(--teal-600);
--success:var(--olive-600);--success-soft:#E7E4CF;
--warning:var(--amber-600);--warning-soft:#F3E4C6;--warning-ink:#96621B;
--danger:var(--burgundy-700);--danger-soft:#EBD5D0;
--info:var(--teal-600);--info-soft:#DAE5E1;
--plum-soft:#EADFE5;
--border-subtle:#E3D7C1;--border-strong:#C5B294;--border-input:#B6A180;
--focus-ring:var(--teal-600);
/* typography */
--font-display:'EB Garamond',Georgia,serif;
--font-body:'IBM Plex Sans','Helvetica Neue',Arial,sans-serif;
--font-mono:'IBM Plex Mono',ui-monospace,monospace;
--text-xs:12px;--text-sm:13.5px;--text-base:15px;--text-md:17px;--text-lg:21px;--text-xl:27px;--text-2xl:36px;
--leading-tight:1.15;--leading-snug:1.3;--leading-normal:1.55;
--tracking-caps:0.08em;--tracking-wide:0.02em;
--weight-regular:400;--weight-medium:500;--weight-semibold:600;
/* spacing & radius */
--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;--space-8:32px;--space-10:40px;
--radius-sm:3px;--radius-md:5px;--radius-lg:8px;--radius-pill:999px;
/* effects */
--shadow-card:0 1px 2px rgba(51,40,33,.06),0 2px 8px rgba(51,40,33,.07);
--shadow-raised:0 2px 4px rgba(51,40,33,.08),0 8px 24px rgba(51,40,33,.12);
--ease-standard:cubic-bezier(.4,0,.2,1);--duration-fast:120ms;--duration-base:180ms;
--zigzag-terracotta:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='8'%3E%3Cpath d='M0 6.5 6 1.5 12 6.5 18 1.5 24 6.5' fill='none' stroke='%23A94F26' stroke-width='2'/%3E%3C/svg%3E");
/* frei-ab Monatsfarben (erdige, aufs System abgestimmte Reihe) */
--m1:#2A5C68;--m2:#684A5C;--m3:#727142;--m4:#C4832B;--m5:#33707E;--m6:#7A3338;
--m7:#A94F26;--m8:#7C5A6E;--m9:#3E7E8C;--m10:#8E4220;--m11:#54463A;--m12:#7C6C5C;
}