/* ═══════════════════════════════════════════════════════════
   OPENBUREAU Theme für Gitea 1.26
   Angeglichen an openbureau.ch (Hugo-Theme + OPENBUREAU CMS)

   Design-DNA:
   · Warmes Off-White (hsl 35 14% 96%) statt kühlem Grau
   · Terrakotta-Akzent #b54a2c
   · Dunkles Masthead/Footer #191919 mit OPENBUREAU-Wortmarke
   · Newsreader (Serif) für Titel · Inter (Sans) für UI
   · Space Grotesk (Display) für Navigation/Labels · IBM Plex Mono für Code
═══════════════════════════════════════════════════════════ */

/* ─── Webfonts (wie Website & CMS) ─────────────────────────
   Fallbacks sind Systemfonts, falls offline. */
@import url('https://fonts.bunny.net/css?family=newsreader:400,400i,500,600,700|inter:400,500,600|space-grotesk:400,500,700|ibm-plex-mono:400,500');

:root {
  /* ─ Schriftfamilien ─ */
  --ob-serif:   'Newsreader', Charter, 'Source Serif Pro', Georgia, serif;
  --ob-sans:    'Inter', system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --ob-display: 'Space Grotesk', 'Inter', system-ui, sans-serif;
  --ob-mono:    'IBM Plex Mono', "SF Mono", ui-monospace, "Cascadia Code", Consolas, monospace;

  /* ─ Farben (HSL-System der Website) ─ */
  --ob-bg:        hsl(35 14% 96%);
  --ob-panel:     #fffdf9;            /* Surface — warmes Weiss   */
  --ob-panel-2:   hsl(35 14% 93%);    /* Surface 2 / Tabellenkopf */
  --ob-line:      hsl(35 14% 86%);    /* Rahmen                   */
  --ob-line-2:    hsl(35 14% 80%);    /* Rahmen Inputs            */
  --ob-text:      hsl(25 18% 12%);
  --ob-text-2:    hsl(25 10% 22%);
  --ob-muted:     hsl(25 8% 42%);
  --ob-muted-2:   hsl(25 8% 55%);

  --ob-accent:        #b54a2c;        /* Terrakotta */
  --ob-accent-soft:   #d97a5a;
  --ob-accent-dark:   #a23f23;
  --ob-accent-alpha:  rgba(181,74,44,0.12);

  --ob-dark:        #191919;          /* Masthead / Footer */
  --ob-dark-text:   #f0f0f0;
  --ob-dark-muted:  #a9a9a9;

  --ob-ok:    #5d7d4b;
  --ob-amber: #b8902f;
  --ob-red:   #a23320;

  --ob-radius:    11px;
  --ob-radius-sm: 8px;
  --ob-radius-lg: 14px;
  --ob-pill:      22px;
  --ob-shadow-1:  0 1px 2px rgba(40,20,10,0.05);
  --ob-shadow-2:  0 4px 14px -10px rgba(40,20,10,0.40);
  --ob-shadow-3:  0 12px 36px -22px rgba(40,20,10,0.55);

  /* ─── Gitea-CSS-Variablen überschreiben ─── */
  --color-primary:           #b54a2c;
  --color-primary-dark-1:    #a23f23;
  --color-primary-dark-2:    #8f371e;
  --color-primary-dark-3:    #7a2f19;
  --color-primary-dark-4:    #682818;
  --color-primary-light-1:   #c25c3f;
  --color-primary-light-2:   #d97a5a;
  --color-primary-light-3:   #e29478;
  --color-primary-light-4:   #ecb39e;
  --color-primary-light-5:   #f6dccf;
  --color-primary-light-6:   #fbeee6;
  --color-primary-light-7:   #fdf5f0;
  --color-primary-alpha-30:  rgba(181,74,44,0.30);
  --color-primary-alpha-40:  rgba(181,74,44,0.40);
  --color-primary-alpha-50:  rgba(181,74,44,0.50);
  --color-primary-alpha-60:  rgba(181,74,44,0.60);
  --color-primary-alpha-70:  rgba(181,74,44,0.70);
  --color-primary-alpha-80:  rgba(181,74,44,0.80);
  --color-primary-alpha-90:  rgba(181,74,44,0.90);
  --color-primary-contrast:  #ffffff;

  --color-body:              hsl(35 14% 96%);
  --color-box-body:          #fffdf9;
  --color-box-header:        #fffdf9;
  --color-nav-bg:            #191919;
  --color-nav-hover-bg:      rgba(255,255,255,0.08);
  --color-footer:            #191919;
  --color-text:              hsl(25 18% 12%);
  --color-text-dark:         hsl(25 18% 8%);
  --color-text-light:        hsl(25 12% 20%);
  --color-text-light-1:      hsl(25 10% 32%);
  --color-text-light-2:      hsl(25 8% 42%);
  --color-text-light-3:      hsl(25 8% 55%);
  --color-secondary:              hsl(35 14% 86%);
  --color-secondary-dark-1:       hsl(35 14% 80%);
  --color-secondary-dark-2:       hsl(35 14% 74%);
  --color-secondary-light-1:      hsl(35 14% 93%);
  --color-secondary-light-2:      hsl(35 14% 95%);
  --color-input-text:        hsl(25 18% 12%);
  --color-input-background:  #fffdf9;
  --color-input-border:      hsl(35 14% 80%);
  --color-input-border-hover:#d97a5a;
  --color-border:            hsl(35 14% 86%);
  --color-light-border:      hsl(35 14% 88%);
  --color-hover:             hsl(35 14% 93%);
  --color-active:            hsl(35 14% 91%);
  --color-menu:              #fffdf9;
  --color-card:              #fffdf9;
  --color-markup-code-block: hsl(35 14% 93%);
  --color-markup-code-inline:hsl(35 14% 91%);
  --color-green:             #5d7d4b;
  --color-green-light:       #6f9159;
  --color-red:               #a23320;
  --color-orange:            #b8902f;
  --color-yellow:            #b8902f;
  --color-gold:              #b8902f;

  --border-radius:    11px;
  --border-radius-medium: 11px;
  --border-radius-full: 9999px;
}

/* ─── Basis-Typografie ──────────────────────────────────── */
body, .ui, input, select, textarea, button, a {
  font-family: var(--ob-sans) !important;
  -webkit-font-smoothing: antialiased;
}

code, pre, .code-view, .file-view code,
kbd, samp, .markup code, tt {
  font-family: var(--ob-mono) !important;
  font-size: 12.5px !important;
}

/* App-haft: Titel in Inter (Sans), nicht im Artikel-Serif. Kompakt. */
h1, h2, h3, h4,
.ui.header,
.markup h1, .markup h2, .markup h3, .markup h4 {
  font-family: var(--ob-sans) !important;
  font-weight: 700 !important;
  letter-spacing: -0.015em !important;
  color: var(--ob-text) !important;
  line-height: 1.2 !important;
  margin-top: 0.5em !important;
  margin-bottom: 0.35em !important;
}

h1, .markup h1, .repo-title { font-size: 1.55rem !important; font-weight: 700 !important; letter-spacing: -0.022em !important; }
h2, .markup h2 { font-size: 1.2rem !important; }
h3, .ui.header  { font-size: 1.02rem !important; }
h4 { font-size: 0.9rem !important; }

/* Chrome-Links ohne Unterstreichung (App-Look) */
#navbar .item, .ui.menu .item, .entry-name a,
#footer a, footer a, .repo-header a, .breadcrumb a {
  text-decoration: none !important;
}

/* Serif bleibt nur für echten Fliesstext-Markup (Issues, Wiki) optional —
   hier bewusst nichts erzwingen, damit die App nüchtern bleibt. */

body {
  background: var(--ob-bg) !important;
  color: var(--ob-text) !important;
  font-size: 14px !important;
}

/* ─── Kompaktere Abstände (weniger „aufgeblasen") ───────── */
.ui.segment            { padding: 13px 15px !important; }
.ui.attached.segment   { padding: 11px 15px !important; }
.ui.attached.header,
.ui.top.attached.header,
.file-header           { padding: 9px 14px !important; min-height: 0 !important; }
.ui.header             { margin-top: 0.4rem !important; margin-bottom: 0.5rem !important; }
.ui.menu .item         { padding-top: 8px !important; padding-bottom: 8px !important; }
.ui.table td,
.ui.table th           { padding-top: 8px !important; padding-bottom: 8px !important; }
.ui.list > .item,
.ui.divided.list > .item { padding-top: 7px !important; padding-bottom: 7px !important; }
.repository .header-wrapper,
.dashboard .feeds .news,
.flex-list .flex-item  { padding-top: 10px !important; padding-bottom: 10px !important; }
.markup > *:first-child { margin-top: 0 !important; }
.repository, .page-content { --page-spacing: 12px; }

/* ─── Masthead / Navbar — dunkel wie openbureau.ch ──────── */
#navbar,
.page-content .ui.secondary.menu#navbar,
nav#navbar {
  background: var(--ob-dark) !important;
  border-bottom: none !important;
  box-shadow: 0 1px 0 rgba(0,0,0,0.4) !important;
  padding: 0 20px !important;
}

/* Flache Navigation wie openbureau.ch (.site-nav) — kein Pillen-Hintergrund */
#navbar .item {
  color: #d4d4d4 !important;
  font-family: var(--ob-display) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  letter-spacing: 0.03em !important;
  background: transparent !important;
  transition: color 0.15s, opacity 0.15s !important;
}

#navbar .item:hover {
  color: #ffffff !important;
  background: transparent !important;
}

#navbar .item.active,
#navbar .active.item {
  color: #ffffff !important;
  font-weight: 600 !important;
  background: transparent !important;
}

/* Icon-/Avatar-Items im Masthead: dezenter Hover-Kreis */
#navbar .item.tw-p-0:hover,
#navbar .item > .ui.label { background: transparent !important; }

/* ─── Wortmarke: OPENBUREAU-Logo (eingebettet) ──────────── */
#navbar-logo {
  display: flex !important;
  align-items: center !important;
  gap: 0 !important;
  padding-right: 10px !important;
}

#navbar-logo img,
#navbar-logo svg {
  display: none !important;
}

#navbar-logo::after {
  content: "" !important;
  display: block !important;
  width: 150px !important;
  height: 22px !important;
  background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+CjxzdmcKICAgd2lkdGg9IjEwMCUiCiAgIGhlaWdodD0iMTAwJSIKICAgdmlld0JveD0iMCAwIDE3NzIgMjg0IgogICB2ZXJzaW9uPSIxLjEiCiAgIHhtbDpzcGFjZT0icHJlc2VydmUiCiAgIHN0eWxlPSJmaWxsLXJ1bGU6ZXZlbm9kZDtjbGlwLXJ1bGU6ZXZlbm9kZDtzdHJva2UtbGluZWpvaW46cm91bmQ7c3Ryb2tlLW1pdGVybGltaXQ6MjsiCiAgIGlkPSJzdmcxIgogICBzb2RpcG9kaTpkb2NuYW1lPSJsb2dvLnN2ZyIKICAgeG1sbnM6aW5rc2NhcGU9Imh0dHA6Ly93d3cuaW5rc2NhcGUub3JnL25hbWVzcGFjZXMvaW5rc2NhcGUiCiAgIHhtbG5zOnNvZGlwb2RpPSJodHRwOi8vc29kaXBvZGkuc291cmNlZm9yZ2UubmV0L0RURC9zb2RpcG9kaS0wLmR0ZCIKICAgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIgogICB4bWxuczpzdmc9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48ZGVmcwogICAgIGlkPSJkZWZzMSIgLz48c29kaXBvZGk6bmFtZWR2aWV3CiAgICAgaWQ9Im5hbWVkdmlldzEiCiAgICAgcGFnZWNvbG9yPSIjZmZmZmZmIgogICAgIGJvcmRlcmNvbG9yPSIjMDAwMDAwIgogICAgIGJvcmRlcm9wYWNpdHk9IjAuMjUiCiAgICAgaW5rc2NhcGU6c2hvd3BhZ2VzaGFkb3c9IjIiCiAgICAgaW5rc2NhcGU6cGFnZW9wYWNpdHk9IjAuMCIKICAgICBpbmtzY2FwZTpwYWdlY2hlY2tlcmJvYXJkPSIwIgogICAgIGlua3NjYXBlOmRlc2tjb2xvcj0iI2QxZDFkMSIgLz48ZwogICAgIHRyYW5zZm9ybT0ibWF0cml4KDM1OC4zMzMzMzMsMCwwLDM1OC4zMzMzMzMsMTc3MC44NTQxMTUsMjY0LjEyMjAxMykiCiAgICAgaWQ9ImcxIiAvPjxnCiAgICAgaWQ9InRleHQxIgogICAgIHN0eWxlPSJmb250LXNpemU6MzU4LjMzM3B4O2ZvbnQtZmFtaWx5OlBQUmlnaHRTZXJpZk1vbm8tRGFyaywgJ1BQIFJpZ2h0IFNlcmlmIE1vbm8nO2ZpbGw6I2YwZjBmMCIKICAgICBhcmlhLWxhYmVsPSJPUEVOQlVSRUFVIj48cGF0aAogICAgICAgZD0ibSA4OC4yODI1OTgsMjY4LjQ5NjE5IGMgNTMuNTM5OTkyLDAgODAuMzA5OTgyLC0zMC43OTQyNCA4MC4zMDk5ODIsLTkzLjI1NzU2IHYgLTY3LjE4NzQ0IGMgMCwtNjIuNDYzMzI1IC0yNi43Njk5OSwtOTMuMjU3NTY4IC04MC4zMDk5ODIsLTkzLjI1NzU2OCAtNTMuNTM5OTkxLDAgLTgwLjMwOTk4NjEsMzAuNzk0MjQzIC04MC4zMDk5ODYxLDkzLjI1NzU2OCB2IDY3LjE4NzQ0IGMgMCw2Mi40NjMzMiAyNi43Njk5OTUxLDkzLjI1NzU2IDgwLjMwOTk4NjEsOTMuMjU3NTYgeiBtIDAsLTE4LjU0NjUzIGMgLTE5LjA3MTQzNSwwIC0yNy40Njk4NjUsLTEzLjk5NzM4IC0yNy40Njk4NjUsLTQ3LjI0MTE3IFYgODIuMzMwOTk2IGMgMCwtMzQuNjQzNTIzIDguMzk4NDMsLTQ4Ljk5MDg0MSAyNy40Njk4NjUsLTQ4Ljk5MDg0MSAxOS4yNDY0MDIsMCAyNy40Njk4NjIsMTQuMzQ3MzE4IDI3LjQ2OTg2Miw0OC45OTA4NDEgViAyMDIuNzA4NDkgYyAwLDMzLjI0Mzc5IC04LjIyMzQ2LDQ3LjI0MTE3IC0yNy40Njk4NjIsNDcuMjQxMTcgeiIKICAgICAgIGlkPSJwYXRoMSIgLz48cGF0aAogICAgICAgZD0ibSAyNzMuOTkwODksMjY0LjEyMjAxIHYgLTE1LjkyMjAyIGMgLTIzLjI3MDY1LC0xLjA0OTgxIC0yNS41NDUyMiwtMi43OTk0OCAtMjUuNTQ1MjIsLTE4LjE5NjYgdiAtNTQuNzY0NzYgaCAyNy4xMTk5MyBjIDQ5LjY5MDcxLDAgNzQuNTM2MDcsLTIzLjI3MDY1IDc0LjUzNjA3LC02OS45ODY5MiBWIDg5LjY3OTYyMiBjIDAsLTQ3LjA2NjIwMSAtMjQuODQ1MzYsLTcwLjUxMTgxNyAtNzQuNTM2MDcsLTcwLjUxMTgxNyBoIC05NC4zMDczNyB2IDE1LjkyMjAyMyBjIDEyLjA3Mjc0LDEuMDQ5ODA0IDEzLjY0NzQ1LDMuMTQ5NDExIDEzLjY0NzQ1LDE1LjU3MjA4OSBWIDIzMi42Mjc5IGMgMCwxMi40MjI2NyAtMS41NzQ3MSwxNC41MjIyOCAtMTMuNjQ3NDUsMTUuNTcyMDkgdiAxNS45MjIwMiB6IE0gMjQ4LjQ0NTY3LDM4Ljc2NDE0MSBoIDE5LjA3MTQzIGMgMjEuMzQ2MDEsMCAzMC42MTkyOCwxMi4wNzI3NDMgMzAuNjE5MjgsNDAuOTQyMzQ2IHYgMzUuODY4MjkzIGMgMCwyOC41MTk2NyAtOS4yNzMyNyw0MC40MTc0NCAtMzAuNjE5MjgsNDAuNDE3NDQgaCAtMTkuMDcxNDMgeiBtIDI3My41NDE4OSwyMjUuMzU3ODY5IDEuMDQ5ODEsLTkyLjczMjY2IGggLTE3LjE0NjggYyAtMTAuODQ3OTcsNTkuNjYzODQgLTI0Ljg0NTM1LDc1LjU4NTg2IC01OS42NjM4NCw3NS41ODU4NiBIIDQyNS4yMzA2NSBWIDE0NS40OTQxOSBoIDExLjU0Nzg0IGMgMTYuMDk2OTksMCAyMi4yMjA4NSw5Ljk3MzEzIDI2LjQyMDA2LDQyLjE2NzExIGggMTQuNTIyMjkgViA4OC42Mjk4MTggaCAtMTQuNTIyMjkgYyAtNC4xOTkyMSwzMi4zNjg5NTIgLTEwLjMyMzA3LDQyLjE2NzEyMiAtMjYuNDIwMDYsNDIuMTY3MTIyIEggNDI1LjIzMDY1IFYgMzYuMzE0NTk5IGggMTkuNzcxMzEgYyAzNC40Njg1NSwwIDQ3Ljk0MTAzLDE0LjY5NzI1MiA1OC40MzkwNyw2OC43NjIxNDEgaCAxNy4zMjE3NiBMIDUxOS4zNjMwNSwxOS4xNjc4MDUgSCAzNTcuMTY4MzggdiAxNS43NDcwNTYgYyAxMi43NzI2MSwwLjg3NDgzNiAxNC41MjIyOCwzLjE0OTQxMSAxNC41MjIyOCwxNi4yNzE5NTggViAyMzIuMTAzIGMgMCwxMy4xMjI1NCAtMS43NDk2NywxNS4zOTcxMiAtMTQuNTIyMjgsMTYuMjcxOTUgdiAxNS43NDcwNiB6IG0gNzkuNjc4MTQsMCB2IC0xNS43NDcwNiBjIC0yMy4wOTU2OCwtMTUuOTIyMDIgLTM0LjY0MzUyLC00OC4yOTA5NyAtMzQuNjQzNTIsLTkwLjI4MzEyIHYgLTM0LjgxODQ5IGMgMCwtMTMuNDcyNDggLTEuMDQ5ODEsLTMxLjg0NDA0NSAtMi40NDk1NCwtNDguMTE2MDAzIGwgMy42NzQzMSwtMC41MjQ5MDIgYyAzLjY3NDMxLDE0Ljg3MjIyIDYuODIzNzIsMjUuMzcwMjU1IDEzLjI5NzUxLDQwLjk0MjM0NSBsIDYxLjU4ODQ5LDE0OC41NDcyMyBoIDQ4LjQ2NTk0IFYgOTEuMDc5MzYgYyAwLC0yNC40OTU0MiAyLjI3NDU3LC00Mi4zNDIwODMgMTEuMzcyODcsLTU2LjE2NDQ5OSBWIDE5LjE2NzgwNSBIIDYzOC41ODM4IHYgMTUuNzQ3MDU2IGMgMTkuNzcxMywxMi40MjI2NzcgMzAuNjE5MjgsNDEuNDY3MjQ3IDMwLjYxOTI4LDc2Ljk4NTYwOSB2IDM0LjExODYyIGMgMCwxNC41MjIyOCAxLjA0OTgsMjkuOTE5NDEgMi42MjQ1LDQ5LjM0MDc3IGwgLTMuNjc0MzEsMC41MjQ5MSBjIC00LjE5OTIxLC0xNS41NzIwOSAtNy4zNDg2MiwtMjYuNTk1MDMgLTEyLjk0NzU4LC00MC4wNjc1MSBMIDU5OC4xNjYzNiwxOS4xNjc4MDUgaCAtNjQuOTEyODcgdiAxNS45MjIwMjMgYyA5Ljk3MzE0LDEuMDQ5ODA0IDExLjM3Mjg4LDMuMTQ5NDExIDExLjM3Mjg4LDE0LjM0NzMxOCBWIDE5Mi4yMTA0NSBjIDAsMjQuNDk1NDIgLTIuMjc0NTgsNDIuMzQyMDkgLTExLjM3Mjg4LDU2LjE2NDUgdiAxNS43NDcwNiB6IG0gMjA5Ljg1Mzc3LDAgYyA0My45MTY3OSwwIDY1LjI2MjgsLTE4LjU0NjUzIDY1LjI2MjgsLTU4LjA4OTE0IHYgLTE2LjA5Njk5IGMgMCwtMzIuMDE5MDIgLTEyLjc3MjYxLC00OC4yOTA5NyAtNDguNDY1OTQsLTUyLjQ5MDE5IHYgLTMuNDk5MzQgYyAzMC45NjkyMSwtMy42NzQzMiA0Mi44NjY5OSwtMTguNTQ2NTQgNDIuODY2OTksLTQ3LjQxNjEzOSBWIDcyLjUzMjgyOCBjIDAsLTM2LjU2ODE2NCAtMjAuMTIxMjQsLTUzLjM2NTAyMyAtNjIuMjg4MzYsLTUzLjM2NTAyMyBoIC05OC42ODE1NSB2IDE1LjkyMjAyMyBjIDEwLjMyMzA3LDEuMDQ5ODA0IDExLjcyMjgxLDIuOTc0NDQ0IDExLjcyMjgxLDE0LjUyMjI4NSBWIDIzMy42Nzc3IGMgMCwxMS41NDc4NCAtMS4zOTk3NCwxMy40NzI0OCAtMTEuNzIyODEsMTQuNTIyMjkgdiAxNS45MjIwMiB6IE0gNzc0LjQyNjQxLDM4LjU4OTE3NCBoIDE3Ljg0NjY2IGMgMTkuMjQ2NCwwIDI3LjI5NDksOS42MjMyMDEgMjcuMjk0OSwzMi4xOTM5ODEgdiAyNS4wMjAzMjIgYyAwLDIyLjA0NTg4MyAtOC4yMjM0NywzMS40OTQxMTMgLTI3LjI5NDksMzEuNDk0MTEzIGggLTE3Ljg0NjY2IHogbSAwLDEwNi4wMzAxNzYgaCAxOS4wNzE0MyBjIDE5Ljk0NjI3LDAgMjguNTE5NjcsMTAuNDk4MDQgMjguNTE5NjcsMzUuMTY4NDMgdiAyOC44Njk2IGMgMCwyNS4wMjAzMiAtOC41NzM0LDM1Ljg2ODI5IC0yOC41MTk2NywzNS44NjgyOSBoIC0xOS4wNzE0MyB6IG0gMTk3LjA4MTE2LDEyNC4wNTE4MSBjIDQ4LjQ2NTkzLDAgNzMuNDg2MjMsLTIzLjA5NTY4IDczLjQ4NjIzLC02OC40MTIyMSBWIDkzLjcwMzg3IGMgMCwtMjUuODk1MTU5IDIuNjI0NSwtNDQuMDkxNzU3IDEyLjI0NzcsLTU4LjQzOTA3NSB2IC0xNi4wOTY5OSBoIC02OC4wNjIyNCB2IDE2LjA5Njk5IGMgMjAuODIxMTQsMTIuNDIyNjc4IDMxLjE0NDE0LDQyLjY5MjAxOSAzMS4xNDQxNCw4NC4zMzQyMzUgdiA3OC4yMTAzOCBjIDAsMjcuODE5OCAtMTEuNTQ3OCw0MS45OTIxNSAtMzQuNDY4NTIsNDEuOTkyMTUgLTIyLjkyMDcxLDAgLTM0LjY0MzUyLC0xNC4xNzIzNSAtMzQuNjQzNTIsLTQxLjk5MjE1IFYgNDkuOTYyMDQ4IGMgMCwtMTEuNzIyODA5IDEuNzQ5NjcsLTEzLjgyMjQxNiAxNS4wNDcxOSwtMTQuNjk3MjUzIHYgLTE2LjA5Njk5IGggLTgwLjY1OTkyIHYgMTYuMDk2OTkgYyAxMC42NzMsMC44NzQ4MzcgMTIuMjQ3NzEsMi45NzQ0NDQgMTIuMjQ3NzEsMTQuNjk3MjUzIFYgMjAwLjI1ODk1IGMgMCw0NS4zMTY1MyAyNS4wMjAzMiw2OC40MTIyMSA3My42NjEyMyw2OC40MTIyMSB6IG0gMTY5Ljc4NTIzLC00LjU0OTE1IHYgLTE2LjA5Njk5IGMgLTEwLjY3MywtMS4wNDk4MSAtMTIuMDcyNywtMy4xNDk0MSAtMTIuMDcyNywtMTQuNjk3MjUgdiAtODQuNTA5MiBoIDExLjg5NzggYyAxNS43NDcsMCAyMC42NDYxLDkuMDk4MjkgMjMuNjIwNiwzNy40NDMgbCAyLjk3NDQsMjguMzQ0NyBjIDIuOTc0NSwyOC4zNDQ3IDUuNDI0LDQwLjU5MjQxIDExLjM3MjksNDkuNTE1NzQgSCAxMjM3IGwgMC41MjQ5LC0xNi4wOTY5OSBjIC04LjM5ODUsLTMuODQ5MjggLTEyLjI0NzgsLTEyLjA3Mjc0IC0xNi43OTY5LC0zOS41NDI2MSBsIC00LjM3NDIsLTI2Ljk0NDk2IGMgLTQuMzc0MiwtMjcuMTE5OTMgLTEzLjQ3MjUsLTM2Ljc0MzEzIC00NS40OTE1LC0zOS41NDI2MSB2IC0zLjMyNDM4IGMgNDAuNzY3NCwtNC4wMjQyNCA1NS45ODk2LC0yMi4yMjA4NCA1NS45ODk2LC01My4wMTUwODUgdiAtOS40NDgyMzQgYyAwLC0zNi45MTgwOTggLTI0LjE0NTUsLTU3LjAzOTMzNiAtNzAuNTExOSwtNTcuMDM5MzM2IGggLTkyLjczMjYgdiAxNi4wOTY5OSBjIDEwLjY3MywxLjA0OTgwNCAxMi4yNDc3LDMuMTQ5NDEyIDEyLjI0NzcsMTQuNjk3MjUzIFYgMjMzLjMyNzc3IGMgMCwxMS41NDc4NCAtMS41NzQ3LDEzLjY0NzQ0IC0xMi4yNDc3LDE0LjY5NzI1IHYgMTYuMDk2OTkgeiBNIDExMjkuMjIwMSwzOS4yODkwNDMgaCAxNy4zMjE4IGMgMTguODk2NCwwIDI3LjI5NDksOC43NDgzNjQgMjcuMjk0OSwzMi4wMTkwMTQgViA5Ny41NTMxNSBjIDAsMjMuNDQ1NjIgLTguMzk4NSwzMi4xOTM5OCAtMjcuMjk0OSwzMi4xOTM5OCBoIC0xNy4zMjE4IHogbSAyNzUuODE2NCwyMjQuODMyOTY3IDEuMDQ5OCwtOTIuNzMyNjYgaCAtMTcuMTQ2NyBjIC0xMC44NDgsNTkuNjYzODQgLTI0Ljg0NTQsNzUuNTg1ODYgLTU5LjY2MzksNzUuNTg1ODYgaCAtMjAuOTk2MSBWIDE0NS40OTQxOSBoIDExLjU0NzkgYyAxNi4wOTcsMCAyMi4yMjA4LDkuOTczMTMgMjYuNDIsNDIuMTY3MTEgaCAxNC41MjIzIFYgODguNjI5ODE4IGggLTE0LjUyMjMgYyAtNC4xOTkyLDMyLjM2ODk1MiAtMTAuMzIzLDQyLjE2NzEyMiAtMjYuNDIsNDIuMTY3MTIyIGggLTExLjU0NzkgViAzNi4zMTQ1OTkgaCAxOS43NzEzIGMgMzQuNDY4NiwwIDQ3Ljk0MTEsMTQuNjk3MjUyIDU4LjQzOTEsNjguNzYyMTQxIGggMTcuMzIxOCBsIC0xLjM5OTgsLTg1LjkwODkzNSBoIC0xNjIuMTk0NiB2IDE1Ljc0NzA1NiBjIDEyLjc3MjYsMC44NzQ4MzYgMTQuNTIyMiwzLjE0OTQxMSAxNC41MjIyLDE2LjI3MTk1OCBWIDIzMi4xMDMgYyAwLDEzLjEyMjU0IC0xLjc0OTYsMTUuMzk3MTIgLTE0LjUyMjIsMTYuMjcxOTUgdiAxNS43NDcwNiB6IG0gNjguMTMwMywwIHYgLTExLjg5Nzc4IGMgLTE5Ljc3MTMsLTIuNzk5NDcgLTI0LjY3MDQsLTE3LjQ5NjczIC0yMC4yOTYyLC0zNy45Njc5IGwgMi45NzQ0LC0xMi45NDc1OCBoIDU5LjMxNCBsIDYuNjQ4NywzMC43OTQyNSBjIDIuOTc0NSwxNC42OTcyNSAwLDE5LjA3MTQzIC0xNC4xNzIzLDIwLjEyMTIzIHYgMTEuODk3NzggaCA4MC40ODQ5IHYgLTE2LjA5Njk5IGMgLTcuMzQ4NiwtMS41NzQ3MSAtOS4wOTgzLC00LjAyNDI1IC0xMS44OTc4LC0xNS4wNDcxOSBMIDE1MjguOTgxNCwxOS4xNjc4MDUgaCAtNTYuMTY0NSBMIDE0MjguMjAwMiwyMjMuMDA0NyBjIC0zLjY3NDMsMTUuNzQ3MDUgLTYuOTk4NywyMi43NDU3NCAtMTQuMTcyMywyNS4wMjAzMiB2IDE2LjA5Njk5IHogbSAwLjM0OTksLTE1MC42NDY4NCBjIDQuMTk5MywtMjAuMjk2MjAyIDcuNTIzNiwtMzguMTQyODY2IDEwLjMyMzEsLTU1LjQ2NDYyNyBoIDMuODQ5MyBjIDIuNjI0NSwxNy40OTY3MjkgNS41OTg5LDM0LjY0MzUyMyA5LjQ0ODIsNTQuNDE0ODI3IGwgMTQuNTIyMyw3Mi40MzY0NiBoIC01Mi4zMTUyIHogbSAyMDQuNDI5OCwxNTUuMTk1OTkgYyA0OC40NjYsMCA3My40ODYzLC0yMy4wOTU2OCA3My40ODYzLC02OC40MTIyMSBWIDkzLjcwMzg3IGMgMCwtMjUuODk1MTU5IDIuNjI0NSwtNDQuMDkxNzU3IDEyLjI0NzcsLTU4LjQzOTA3NSB2IC0xNi4wOTY5OSBoIC02OC4wNjIzIHYgMTYuMDk2OTkgYyAyMC44MjExLDEyLjQyMjY3OCAzMS4xNDQyLDQyLjY5MjAxOSAzMS4xNDQyLDg0LjMzNDIzNSB2IDc4LjIxMDM4IGMgMCwyNy44MTk4IC0xMS41NDc4LDQxLjk5MjE1IC0zNC40Njg2LDQxLjk5MjE1IC0yMi45MjA3LDAgLTM0LjY0MzUsLTE0LjE3MjM1IC0zNC42NDM1LC00MS45OTIxNSBWIDQ5Ljk2MjA0OCBjIDAsLTExLjcyMjgwOSAxLjc0OTcsLTEzLjgyMjQxNiAxNS4wNDcyLC0xNC42OTcyNTMgdiAtMTYuMDk2OTkgaCAtODAuNjU5OSB2IDE2LjA5Njk5IGMgMTAuNjczLDAuODc0ODM3IDEyLjI0NzcsMi45NzQ0NDQgMTIuMjQ3NywxNC42OTcyNTMgViAyMDAuMjU4OTUgYyAwLDQ1LjMxNjUzIDI1LjAyMDMsNjguNDEyMjEgNzMuNjYxMiw2OC40MTIyMSB6IgogICAgICAgaWQ9InBhdGgyIiAvPjwvZz48L3N2Zz4K") !important;
  background-repeat: no-repeat !important;
  background-position: left center !important;
  background-size: contain !important;
  transition: opacity 0.15s !important;
}

#navbar-logo:hover::after {
  opacity: 0.85 !important;
}

/* ─── Box-/README-Header (dunklen Balken entfernen) ─────── */
.ui.top.attached.header,
.ui.attached.header,
h4.file-header,
.file-header,
.repo-button-row,
.ui.attached.segment {
  background: var(--ob-panel) !important;
  color: var(--ob-text) !important;
  border: 1px solid var(--ob-line) !important;
}

.ui.top.attached.header,
h4.file-header,
.file-header {
  border-radius: var(--ob-radius) var(--ob-radius) 0 0 !important;
  box-shadow: none !important;
}

.file-header .muted,
.file-header a {
  color: var(--ob-muted) !important;
}

/* ─── Cards, Segmente, Boxen ────────────────────────────── */
.ui.segment,
.ui.box,
.repository .ui.segment {
  background: var(--ob-panel) !important;
  border: 1px solid var(--ob-line-2) !important;   /* klare Haarlinie statt Schatten */
  border-radius: var(--ob-radius) !important;
  box-shadow: none !important;
}

.ui.segments {
  border: 1px solid var(--ob-line-2) !important;
  border-radius: var(--ob-radius) !important;
  box-shadow: none !important;
  overflow: hidden !important;
}

.ui.segments > .segment {
  border: none !important;
  border-top: 1px solid var(--ob-line) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  background: var(--ob-panel) !important;
}

.ui.segments > .segment:first-child {
  border-top: none !important;
}

.ui.card,
.ui.cards > .card {
  background: var(--ob-panel) !important;
  border: 1px solid var(--ob-line-2) !important;
  border-radius: var(--ob-radius) !important;
  box-shadow: none !important;
  transition: box-shadow 0.2s, border-color 0.2s !important;
}

.ui.card:hover,
.ui.cards > .card:hover {
  box-shadow: var(--ob-shadow-2) !important;
  border-color: var(--ob-accent-soft) !important;
}

/* ─── Buttons — Pill-Form wie im CMS ────────────────────── */
.ui.button,
.ui.buttons .button,
.btn {
  font-family: var(--ob-sans) !important;
  font-size: 12.5px !important;
  font-weight: 500 !important;
  letter-spacing: 0.01em !important;
  border-radius: var(--ob-pill) !important;
  transition: all 0.13s !important;
  cursor: pointer !important;
}

/* Standard-Button = Panel + Linie, Hover = Terrakotta-Rand */
.ui.button:not(.primary):not(.basic):not(.red):not(.green):not(.negative):not(.positive):not(.labeled) {
  background: var(--ob-panel) !important;
  border: 1px solid var(--ob-line-2) !important;
  color: var(--ob-text) !important;
  box-shadow: none !important;
}
.ui.button:not(.primary):not(.basic):not(.red):not(.green):not(.negative):not(.positive):not(.labeled):hover {
  border-color: var(--ob-accent-soft) !important;
  color: var(--ob-text) !important;
}

/* Primary = Terrakotta-Füllung (wie CMS .primary) */
.ui.primary.button,
.ui.primary.buttons .button {
  background: var(--ob-accent) !important;
  color: #ffffff !important;
  border: 1px solid var(--ob-accent) !important;
  box-shadow: none !important;
}
.ui.primary.button:hover,
.ui.primary.buttons .button:hover {
  background: var(--ob-accent-dark) !important;
  border-color: var(--ob-accent-dark) !important;
}

/* Basic / Ghost = transparent, umrandet */
.ui.basic.button,
.ui.basic.buttons .button {
  background: transparent !important;
  border: 1px solid var(--ob-line-2) !important;
  color: var(--ob-text-2) !important;
  box-shadow: none !important;
}
.ui.basic.button:hover,
.ui.basic.buttons .button:hover {
  border-color: var(--ob-accent) !important;
  color: var(--ob-accent) !important;
  background: transparent !important;
}

/* Danger */
.ui.red.button, .ui.negative.button, .ui.danger.button {
  background: var(--ob-red) !important;
  color: #fff !important;
  border: 1px solid var(--ob-red) !important;
}
.ui.red.button:hover, .ui.negative.button:hover { background: #8a2b1a !important; }

/* Erfolg / Grün */
.ui.green.button, .ui.positive.button {
  background: var(--ob-ok) !important;
  color: #fff !important;
  border: 1px solid var(--ob-ok) !important;
}
.ui.green.button:hover, .ui.positive.button:hover { background: #4f6b40 !important; }

/* Icon-Buttons */
.btn-octicon {
  color: var(--ob-muted) !important;
  border-radius: var(--ob-radius-sm) !important;
  transition: all 0.13s !important;
}
.btn-octicon:hover {
  color: var(--ob-text) !important;
  background: var(--ob-panel-2) !important;
}

/* ─── Inputs ────────────────────────────────────────────── */
input[type="text"],
input[type="email"],
input[type="password"],
input[type="search"],
input[type="url"],
input[type="number"],
textarea,
select,
.ui.input > input,
.ui.selection.dropdown {
  font-family: var(--ob-sans) !important;
  font-size: 13px !important;
  border-radius: var(--ob-radius) !important;
  border: 1px solid var(--ob-line-2) !important;
  background: var(--ob-panel) !important;
  color: var(--ob-text) !important;
  transition: border-color 0.15s, box-shadow 0.15s !important;
  box-shadow: none !important;
}

/* Such-, Filter- und einzeilige Action-Felder als volle Pille (wie CMS-Suche) */
input[type="search"],
.ui.search > input,
.search input,
.ui.action.input > input:not(textarea),
.repository .filter.menu + .ui.input input {
  border-radius: var(--ob-pill) !important;
}

/* Mehrzeiliges bleibt nur leicht gerundet */
textarea { border-radius: var(--ob-radius) !important; }

input:focus, textarea:focus, select:focus,
.ui.input.focus > input, .ui.input > input:focus,
.ui.selection.dropdown:focus,
.ui.selection.active.dropdown {
  border-color: var(--ob-accent-soft) !important;
  box-shadow: 0 0 0 3px var(--ob-accent-alpha) !important;
  outline: none !important;
}

/* ─── Links ─────────────────────────────────────────────── */
a {
  color: var(--ob-text) !important;
  transition: color 0.12s !important;
}
a:hover {
  color: var(--ob-accent) !important;
}

a.muted, .muted {
  color: var(--ob-muted) !important;
}
a.muted:hover {
  color: var(--ob-text) !important;
}

/* Masthead-Links bleiben hell */
#navbar a, #navbar .item {
  color: var(--ob-dark-muted) !important;
}
#navbar a:hover, #navbar .item:hover {
  color: #ffffff !important;
}

/* Inhalts-Links (Markdown, Kommentare, Wiki) = Terrakotta */
.markup a, .comment-content a, .wiki-content a, .render-content a,
.markup a:visited {
  color: var(--ob-accent) !important;
}
.markup a:hover, .comment-content a:hover {
  color: var(--ob-accent-dark) !important;
}

/* Datei-/Repo-Listen */
.entry-name, .entry-name a {
  color: var(--ob-text) !important;
  font-weight: 500 !important;
}
.entry-name a:hover {
  color: var(--ob-accent) !important;
}

.repo-list .repo-list-link, .flex-item-title a {
  color: var(--ob-text) !important;
}

.grey.commit-summary, .commit-summary {
  color: var(--ob-text-2) !important;
}

.ui.label.commit-id-short,
.commit-id-short {
  background: var(--ob-panel-2) !important;
  color: var(--ob-muted) !important;
  border-color: var(--ob-line) !important;
  font-family: var(--ob-mono) !important;
  border-radius: var(--ob-radius-sm) !important;
}

/* ─── Tabellen ──────────────────────────────────────────── */
.ui.table {
  font-family: var(--ob-sans) !important;
  border: 1px solid var(--ob-line-2) !important;
  border-radius: var(--ob-radius) !important;
  overflow: hidden !important;
  box-shadow: none !important;
  background: var(--ob-panel) !important;
}

.ui.table thead th {
  background: var(--ob-panel-2) !important;
  color: var(--ob-muted) !important;
  font-family: var(--ob-display) !important;
  font-size: 10.5px !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  font-weight: 600 !important;
  text-align: left !important;
  border-bottom: 1px solid var(--ob-line) !important;
}

.ui.table tbody tr:hover td,
.ui.table tr:hover {
  background: hsl(35 14% 94%) !important;
}

.ui.table td {
  border-bottom: 1px solid var(--ob-line) !important;
  color: var(--ob-text) !important;
}

/* ─── Labels / Badges ───────────────────────────────────── */
.ui.label {
  font-family: var(--ob-display) !important;
  font-size: 10.5px !important;
  letter-spacing: 0.04em !important;
  font-weight: 500 !important;
  border-radius: var(--ob-pill) !important;
  padding: 3px 10px !important;
}

.ui.green.label,
.ui.positive.label  { background: color-mix(in oklab, var(--ob-ok) 16%, transparent) !important; color: var(--ob-ok) !important; border-color: color-mix(in oklab, var(--ob-ok) 35%, transparent) !important; }
.ui.red.label,
.ui.negative.label  { background: color-mix(in oklab, var(--ob-red) 12%, transparent) !important; color: var(--ob-red) !important; border-color: color-mix(in oklab, var(--ob-red) 35%, transparent) !important; }
.ui.orange.label,
.ui.yellow.label { background: color-mix(in oklab, var(--ob-amber) 16%, transparent) !important; color: var(--ob-amber) !important; border-color: color-mix(in oklab, var(--ob-amber) 35%, transparent) !important; }
.ui.label:not(.green):not(.red):not(.orange):not(.yellow):not(.positive):not(.negative) {
  background: color-mix(in oklab, var(--ob-accent) 14%, transparent) !important;
  color: var(--ob-text) !important;
  border-color: transparent !important;
}

/* ─── Tabs (tabular) — Akzent-Unterstrich ───────────────── */
.ui.tabular.menu {
  border-bottom: 1px solid var(--ob-line) !important;
}

.ui.tabular.menu .item {
  font-family: var(--ob-display) !important;
  font-size: 12.5px !important;
  font-weight: 500 !important;
  color: var(--ob-muted) !important;
  border: none !important;
  border-bottom: 2px solid transparent !important;
  border-radius: 0 !important;
  transition: all 0.15s !important;
}

.ui.tabular.menu .active.item {
  color: var(--ob-text) !important;
  border-bottom: 2px solid var(--ob-accent) !important;
  background: transparent !important;
  font-weight: 600 !important;
}

.ui.tabular.menu .item:hover {
  color: var(--ob-text) !important;
  background: var(--ob-panel-2) !important;
}

/* ─── Repo-Tabs (Code/Issues/Pulls …) als Pills ─────────── */
.ui.secondary.pointing.menu {
  border-bottom: none !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
  padding: 4px 0 14px 0 !important;
}

.ui.secondary.pointing.menu .item {
  border: 1px solid var(--ob-line-2) !important;
  border-radius: var(--ob-pill) !important;
  background: var(--ob-panel) !important;
  color: var(--ob-muted) !important;
  font-family: var(--ob-display) !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  padding: 5px 14px !important;
  margin: 0 !important;
  transition: all 0.15s !important;
  box-shadow: none !important;
}

.ui.secondary.pointing.menu .item:hover {
  border-color: var(--ob-accent-soft) !important;
  color: var(--ob-text) !important;
  background: var(--ob-panel) !important;
}

.ui.secondary.pointing.menu .active.item,
.ui.secondary.pointing.menu .item.active {
  border-color: var(--ob-dark) !important;
  background: var(--ob-dark) !important;
  color: #ffffff !important;
  font-weight: 600 !important;
}

.ui.secondary.pointing.menu .active.item .label,
.ui.secondary.pointing.menu .active.item .ui.label {
  background: rgba(255,255,255,0.18) !important;
  color: #ffffff !important;
}

/* ─── Meldungen ─────────────────────────────────────────── */
.ui.positive.message, .ui.success.message {
  background: color-mix(in oklab, var(--ob-ok) 12%, var(--ob-bg)) !important;
  border: 1px solid color-mix(in oklab, var(--ob-ok) 35%, transparent) !important;
  color: var(--ob-ok) !important; border-radius: var(--ob-radius-sm) !important;
}
.ui.negative.message, .ui.error.message {
  background: color-mix(in oklab, var(--ob-red) 9%, var(--ob-bg)) !important;
  border: 1px solid color-mix(in oklab, var(--ob-red) 32%, transparent) !important;
  color: var(--ob-red) !important; border-radius: var(--ob-radius-sm) !important;
}
.ui.info.message, .ui.warning.message {
  background: color-mix(in oklab, var(--ob-amber) 12%, var(--ob-bg)) !important;
  border: 1px solid color-mix(in oklab, var(--ob-amber) 32%, transparent) !important;
  color: #7a5f1f !important; border-radius: var(--ob-radius-sm) !important;
}

/* ─── Seitenleiste ──────────────────────────────────────── */
.repository .sidebar,
.ui.segment.sidebar {
  background: var(--ob-panel-2) !important;
  border-color: var(--ob-line) !important;
}

/* Aktives Listenelement in VERTIKALEN Menüs/Sidebars: Terrakotta-Schiene (wie CMS).
   Bewusst NICHT für horizontale Menüs (Tabs), sonst klebt links ein Balken. */
.repository .sidebar .active.item,
.ui.vertical.menu .active.item,
.repository .selected.list .selected.item {
  box-shadow: inset 3px 0 0 var(--ob-accent) !important;
}

/* ─── Code & Diff ───────────────────────────────────────── */
.code-view, .diff-file-box, .file-view {
  border: 1px solid var(--ob-line) !important;
  border-radius: var(--ob-radius) !important;
  background: var(--ob-panel) !important;
}

.diff-file-header, .code-view-menu {
  background: var(--ob-panel-2) !important;
  border-bottom: 1px solid var(--ob-line) !important;
  font-family: var(--ob-mono) !important;
  font-size: 12px !important;
}

.code-line-num, .lines-num { color: var(--ob-muted-2) !important; }

.add-comment, .markup pre,
.code-view .lines-code, .file-view .lines-code {
  background: var(--ob-panel) !important;
}

/* ─── Footer — dunkel wie openbureau.ch ─────────────────── */
#footer, footer, .page-footer, .ui.footer {
  background: var(--ob-dark) !important;
  border-top: none !important;
  font-family: var(--ob-display) !important;
  font-size: 11.5px !important;
  letter-spacing: 0.02em !important;
}

#footer, #footer a, footer a,
.page-footer, .page-footer a,
.page-footer .item { color: var(--ob-dark-muted) !important; }
#footer a:hover, footer a:hover,
.page-footer a:hover { color: var(--ob-accent-soft) !important; }

/* ─── Repo-Header (Breadcrumb) ──────────────────────────── */
.repo-header,
.repository .header-wrapper {
  background: var(--ob-panel) !important;
  border: 1px solid var(--ob-line-2) !important;
  border-radius: var(--ob-radius) !important;
  padding: 12px 18px !important;
  margin-bottom: 12px !important;
  box-shadow: none !important;
}

.repo-header .flex-item-title a,
.repo-title a {
  color: var(--ob-muted) !important;
  font-weight: 400 !important;
}
.repo-header .flex-item-title a:last-child,
.repo-title a:last-child {
  color: var(--ob-text) !important;
  font-weight: 600 !important;
}
.repo-header .flex-item-title a:hover {
  color: var(--ob-accent) !important;
}

/* ─── Dropdown-Menüs ────────────────────────────────────── */
.ui.dropdown .menu {
  border: 1px solid var(--ob-line) !important;
  border-radius: var(--ob-radius) !important;
  box-shadow: var(--ob-shadow-3) !important;
  background: var(--ob-panel) !important;
}

.ui.dropdown .menu .item {
  font-family: var(--ob-sans) !important;
  font-size: 13px !important;
  color: var(--ob-text) !important;
  transition: background 0.1s !important;
}

.ui.dropdown .menu .item:hover {
  background: var(--ob-panel-2) !important;
  color: var(--ob-text) !important;
}

.ui.dropdown .menu .active.item {
  color: var(--ob-accent) !important;
  font-weight: 600 !important;
}

/* ─── Tippy-Popups (Clone, Tooltips) ────────────────────── */
.tippy-box {
  background: var(--ob-panel) !important;
  border: 1px solid var(--ob-line) !important;
  border-radius: var(--ob-radius) !important;
  box-shadow: var(--ob-shadow-3) !important;
  color: var(--ob-text) !important;
}

.tippy-box .tippy-content {
  background: var(--ob-panel) !important;
  color: var(--ob-text) !important;
  padding: 12px !important;
}

.tippy-box .tippy-arrow { color: var(--ob-panel) !important; }

.clone-panel-popup { background: var(--ob-panel) !important; color: var(--ob-text) !important; }

.clone-panel-tab {
  background: var(--ob-panel-2) !important;
  border-bottom: 1px solid var(--ob-line) !important;
}

.clone-panel-tab .item {
  color: var(--ob-muted) !important;
  font-family: var(--ob-display) !important;
  font-size: 12px !important;
}

.clone-panel-tab .item.selected,
.clone-panel-tab .item.active {
  color: var(--ob-text) !important;
  border-bottom: 2px solid var(--ob-accent) !important;
  font-weight: 600 !important;
}

.clone-panel-field input {
  background: var(--ob-panel) !important;
  border: 1px solid var(--ob-line-2) !important;
  color: var(--ob-text) !important;
  font-family: var(--ob-mono) !important;
  font-size: 12px !important;
}

/* ─── Avatare: runde Kreise statt eckigem Block ─────────── */
.ui.avatar,
.ui.avatar.image,
.ui.avatar img,
img.avatar,
a.avatar img,
.comment .avatar img,
.timeline-avatar img,
.flex-item-leading .ui.avatar {
  border-radius: 50% !important;
  overflow: hidden !important;
  background: transparent !important;
}