Files
THEME/theme-openbureau.css
T

798 lines
36 KiB
CSS

/* ═══════════════════════════════════════════════════════════
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;
}