/* 18 App-Designs nach Kachelmustern turksprachiger Völker. Erzeugt von backend/designsCss.ts.
Muster nur aus Geometrie und Pflanzen, keine Tiere oder Gesichter. */
:root {
--pat-uygur: url("data:image/svg+xml;utf8,");
--pat-saha: url("data:image/svg+xml;utf8,");
--pat-karacay: url("data:image/svg+xml;utf8,");
--pat-baskurt: url("data:image/svg+xml;utf8,");
--pat-tuva: url("data:image/svg+xml;utf8,");
--pat-hakas: url("data:image/svg+xml;utf8,");
--pat-kirimtatari: url("data:image/svg+xml;utf8,");
--pat-nogay: url("data:image/svg+xml;utf8,");
--pat-karaim: url("data:image/svg+xml;utf8,");
--pat-tuerkiye: url("data:image/svg+xml;utf8,");
--pat-azerbaycan: url("data:image/svg+xml;utf8,");
--pat-kazakistan: url("data:image/svg+xml;utf8,");
--pat-oezbekistan: url("data:image/svg+xml;utf8,");
--pat-tuerkmenistan: url("data:image/svg+xml;utf8,");
--pat-kirgizistan: url("data:image/svg+xml;utf8,");
--pat-tataristan: url("data:image/svg+xml;utf8,");
--pat-gagavuzya: url("data:image/svg+xml;utf8,");
--pat-cuvasistan: url("data:image/svg+xml;utf8,");
}
html:root[data-design="uygur"] {
color-scheme: dark;
--c-bg: #0f2470; --c-surface: #17318a; --c-surface-raised: #17318a; --c-border: #2b47a3; --c-border-input: #b9c4ee;
--c-text: #eef2ff; --c-text-muted: #b9c4ee; --c-accent: #5fd0c8; --c-on-accent: #08242a; --c-accent-soft: #1d3a96;
--c-ink: #eef2ff; --c-on-ink: #0f2470;
--c-metric-hasanat: #f38bb0; --c-metric-verses: #7fb2f0; --c-metric-time: #f0a860; --c-metric-pages: #5fd0a8;
--c-metric-hasanat-soft: color-mix(in srgb, #f38bb0 18%, var(--c-surface)); --c-metric-verses-soft: color-mix(in srgb, #7fb2f0 18%, var(--c-surface));
--c-metric-time-soft: color-mix(in srgb, #f0a860 18%, var(--c-surface)); --c-metric-pages-soft: color-mix(in srgb, #5fd0a8 18%, var(--c-surface));
--c-danger: #ff8a94;
--bg-pattern: var(--pat-uygur); --bg-pattern-op: 0.26; --d-reader-bg: #0b1a52;
}
html:root[data-design="saha"] {
color-scheme: light;
--c-bg: #e3eaf0; --c-surface: #f7fafc; --c-surface-raised: #f7fafc; --c-border: #cdd8e2; --c-border-input: #4a5c70;
--c-text: #17263a; --c-text-muted: #4a5c70; --c-accent: #365a82; --c-on-accent: #ffffff; --c-accent-soft: #d6e2ee;
--c-ink: #17263a; --c-on-ink: #ffffff;
--c-metric-hasanat: #c2255c; --c-metric-verses: #1f63b8; --c-metric-time: #9c4800; --c-metric-pages: #137a5a;
--c-metric-hasanat-soft: #fde8ef; --c-metric-verses-soft: #e6f0fc; --c-metric-time-soft: #fdeedd; --c-metric-pages-soft: #e2f6ef;
--c-danger: #b3182b;
--bg-pattern: var(--pat-saha); --bg-pattern-op: 0.38; --d-reader-bg: #172636;
}
html:root[data-design="karacay"] {
color-scheme: dark;
--c-bg: #5a1218; --c-surface: #6c1a21; --c-surface-raised: #6c1a21; --c-border: #88303a; --c-border-input: #e8c8b8;
--c-text: #fdf2e6; --c-text-muted: #e8c8b8; --c-accent: #e8b54c; --c-on-accent: #2a1606; --c-accent-soft: #76232b;
--c-ink: #fdf2e6; --c-on-ink: #5a1218;
--c-metric-hasanat: #f38bb0; --c-metric-verses: #7fb2f0; --c-metric-time: #f0a860; --c-metric-pages: #5fd0a8;
--c-metric-hasanat-soft: color-mix(in srgb, #f38bb0 18%, var(--c-surface)); --c-metric-verses-soft: color-mix(in srgb, #7fb2f0 18%, var(--c-surface));
--c-metric-time-soft: color-mix(in srgb, #f0a860 18%, var(--c-surface)); --c-metric-pages-soft: color-mix(in srgb, #5fd0a8 18%, var(--c-surface));
--c-danger: #ff8a94;
--bg-pattern: var(--pat-karacay); --bg-pattern-op: 0.22; --d-reader-bg: #3a0b10;
}
html:root[data-design="baskurt"] {
color-scheme: light;
--c-bg: #f7e7a6; --c-surface: #fffae2; --c-surface-raised: #fffae2; --c-border: #e6cf78; --c-border-input: #5c4822;
--c-text: #2a1a08; --c-text-muted: #5c4822; --c-accent: #2b6637; --c-on-accent: #ffffff; --c-accent-soft: #e6eecb;
--c-ink: #2a1a08; --c-on-ink: #ffffff;
--c-metric-hasanat: #c2255c; --c-metric-verses: #1f63b8; --c-metric-time: #9c4800; --c-metric-pages: #137a5a;
--c-metric-hasanat-soft: #fde8ef; --c-metric-verses-soft: #e6f0fc; --c-metric-time-soft: #fdeedd; --c-metric-pages-soft: #e2f6ef;
--c-danger: #b3182b;
--bg-pattern: var(--pat-baskurt); --bg-pattern-op: 0.2; --d-reader-bg: #1d3020;
}
html:root[data-design="tuva"] {
color-scheme: dark;
--c-bg: #3a2416; --c-surface: #4a2f1d; --c-surface-raised: #4a2f1d; --c-border: #66452d; --c-border-input: #d9c2ab;
--c-text: #f7ede3; --c-text-muted: #d9c2ab; --c-accent: #62c4bc; --c-on-accent: #0b2a28; --c-accent-soft: #573a26;
--c-ink: #f7ede3; --c-on-ink: #3a2416;
--c-metric-hasanat: #f38bb0; --c-metric-verses: #7fb2f0; --c-metric-time: #f0a860; --c-metric-pages: #5fd0a8;
--c-metric-hasanat-soft: color-mix(in srgb, #f38bb0 18%, var(--c-surface)); --c-metric-verses-soft: color-mix(in srgb, #7fb2f0 18%, var(--c-surface));
--c-metric-time-soft: color-mix(in srgb, #f0a860 18%, var(--c-surface)); --c-metric-pages-soft: color-mix(in srgb, #5fd0a8 18%, var(--c-surface));
--c-danger: #ff8a94;
--bg-pattern: var(--pat-tuva); --bg-pattern-op: 0.24; --d-reader-bg: #25160c;
}
html:root[data-design="hakas"] {
color-scheme: light;
--c-bg: #d9e8f4; --c-surface: #f5f9fd; --c-surface-raised: #f5f9fd; --c-border: #c2d6e8; --c-border-input: #445a72;
--c-text: #13243a; --c-text-muted: #445a72; --c-accent: #ae3127; --c-on-accent: #ffffff; --c-accent-soft: #f5dcd8;
--c-ink: #13243a; --c-on-ink: #ffffff;
--c-metric-hasanat: #c2255c; --c-metric-verses: #1f63b8; --c-metric-time: #9c4800; --c-metric-pages: #137a5a;
--c-metric-hasanat-soft: #fde8ef; --c-metric-verses-soft: #e6f0fc; --c-metric-time-soft: #fdeedd; --c-metric-pages-soft: #e2f6ef;
--c-danger: #b3182b;
--bg-pattern: var(--pat-hakas); --bg-pattern-op: 0.24; --d-reader-bg: #132840;
}
html:root[data-design="kirimtatari"] {
color-scheme: light;
--c-bg: #f6f6f2; --c-surface: #ffffff; --c-surface-raised: #ffffff; --c-border: #e0e2ea; --c-border-input: #4d546c;
--c-text: #141b3a; --c-text-muted: #4d546c; --c-accent: #a01e2b; --c-on-accent: #ffffff; --c-accent-soft: #f4dfe1;
--c-ink: #141b3a; --c-on-ink: #ffffff;
--c-metric-hasanat: #c2255c; --c-metric-verses: #1f63b8; --c-metric-time: #9c4800; --c-metric-pages: #137a5a;
--c-metric-hasanat-soft: #fde8ef; --c-metric-verses-soft: #e6f0fc; --c-metric-time-soft: #fdeedd; --c-metric-pages-soft: #e2f6ef;
--c-danger: #b3182b;
--bg-pattern: var(--pat-kirimtatari); --bg-pattern-op: 0.18; --d-reader-bg: #111a3a;
}
html:root[data-design="nogay"] {
color-scheme: light;
--c-bg: #ead6a6; --c-surface: #f9f0d9; --c-surface-raised: #f9f0d9; --c-border: #d6bc84; --c-border-input: #57421f;
--c-text: #2a1c08; --c-text-muted: #57421f; --c-accent: #1c6566; --c-on-accent: #ffffff; --c-accent-soft: #dde4c8;
--c-ink: #2a1c08; --c-on-ink: #ffffff;
--c-metric-hasanat: #c2255c; --c-metric-verses: #1f63b8; --c-metric-time: #9c4800; --c-metric-pages: #137a5a;
--c-metric-hasanat-soft: #fde8ef; --c-metric-verses-soft: #e6f0fc; --c-metric-time-soft: #fdeedd; --c-metric-pages-soft: #e2f6ef;
--c-danger: #b3182b;
--bg-pattern: var(--pat-nogay); --bg-pattern-op: 0.22; --d-reader-bg: #2a2012;
}
html:root[data-design="karaim"] {
color-scheme: dark;
--c-bg: #0d3b2a; --c-surface: #124a35; --c-surface-raised: #124a35; --c-border: #22604a; --c-border-input: #acd4c0;
--c-text: #eaf6ef; --c-text-muted: #acd4c0; --c-accent: #e4d06a; --c-on-accent: #1d1a06; --c-accent-soft: #175640;
--c-ink: #f3efd2; --c-on-ink: #0d3b2a;
--c-metric-hasanat: #f38bb0; --c-metric-verses: #7fb2f0; --c-metric-time: #f0a860; --c-metric-pages: #5fd0a8;
--c-metric-hasanat-soft: color-mix(in srgb, #f38bb0 18%, var(--c-surface)); --c-metric-verses-soft: color-mix(in srgb, #7fb2f0 18%, var(--c-surface));
--c-metric-time-soft: color-mix(in srgb, #f0a860 18%, var(--c-surface)); --c-metric-pages-soft: color-mix(in srgb, #5fd0a8 18%, var(--c-surface));
--c-danger: #ff8a94;
--bg-pattern: var(--pat-karaim); --bg-pattern-op: 0.3; --d-reader-bg: #082a1e;
}
html:root[data-design="tuerkiye"] {
color-scheme: light;
--c-bg: #f6f4ee; --c-surface: #ffffff; --c-surface-raised: #ffffff; --c-border: #dfe3ea; --c-border-input: #4d586e;
--c-text: #14213d; --c-text-muted: #4d586e; --c-accent: #1f3f8f; --c-on-accent: #ffffff; --c-accent-soft: #e3e9f6;
--c-ink: #14213d; --c-on-ink: #ffffff;
--c-metric-hasanat: #c2255c; --c-metric-verses: #1f63b8; --c-metric-time: #9c4800; --c-metric-pages: #137a5a;
--c-metric-hasanat-soft: #fde8ef; --c-metric-verses-soft: #e6f0fc; --c-metric-time-soft: #fdeedd; --c-metric-pages-soft: #e2f6ef;
--c-danger: #b3182b;
--bg-pattern: var(--pat-tuerkiye); --bg-pattern-op: 0.2; --d-reader-bg: #0f1b3a;
}
html:root[data-design="azerbaycan"] {
color-scheme: dark;
--c-bg: #101d50; --c-surface: #182867; --c-surface-raised: #182867; --c-border: #2b3d82; --c-border-input: #b6bfe2;
--c-text: #eff2fb; --c-text-muted: #b6bfe2; --c-accent: #e2c16c; --c-on-accent: #1a1406; --c-accent-soft: #223379;
--c-ink: #f3ebd3; --c-on-ink: #101d50;
--c-metric-hasanat: #f38bb0; --c-metric-verses: #7fb2f0; --c-metric-time: #f0a860; --c-metric-pages: #5fd0a8;
--c-metric-hasanat-soft: color-mix(in srgb, #f38bb0 18%, var(--c-surface)); --c-metric-verses-soft: color-mix(in srgb, #7fb2f0 18%, var(--c-surface));
--c-metric-time-soft: color-mix(in srgb, #f0a860 18%, var(--c-surface)); --c-metric-pages-soft: color-mix(in srgb, #5fd0a8 18%, var(--c-surface));
--c-danger: #ff8a94;
--bg-pattern: var(--pat-azerbaycan); --bg-pattern-op: 0.26; --d-reader-bg: #0a1438;
}
html:root[data-design="kazakistan"] {
color-scheme: light;
--c-bg: #f2ead6; --c-surface: #fbf7ec; --c-surface-raised: #fbf7ec; --c-border: #e0d4b6; --c-border-input: #685340;
--c-text: #2a1e14; --c-text-muted: #685340; --c-accent: #1d6b66; --c-on-accent: #ffffff; --c-accent-soft: #dcebe5;
--c-ink: #2a1e14; --c-on-ink: #ffffff;
--c-metric-hasanat: #c2255c; --c-metric-verses: #1f63b8; --c-metric-time: #9c4800; --c-metric-pages: #137a5a;
--c-metric-hasanat-soft: #fde8ef; --c-metric-verses-soft: #e6f0fc; --c-metric-time-soft: #fdeedd; --c-metric-pages-soft: #e2f6ef;
--c-danger: #b3182b;
--bg-pattern: var(--pat-kazakistan); --bg-pattern-op: 0.22; --d-reader-bg: #13302e;
}
html:root[data-design="oezbekistan"] {
color-scheme: dark;
--c-bg: #0e2e36; --c-surface: #143c46; --c-surface-raised: #143c46; --c-border: #25545e; --c-border-input: #abcdcf;
--c-text: #eaf6f6; --c-text-muted: #abcdcf; --c-accent: #e4c670; --c-on-accent: #1a1406; --c-accent-soft: #1b4852;
--c-ink: #f1ead2; --c-on-ink: #0e2e36;
--c-metric-hasanat: #f38bb0; --c-metric-verses: #7fb2f0; --c-metric-time: #f0a860; --c-metric-pages: #5fd0a8;
--c-metric-hasanat-soft: color-mix(in srgb, #f38bb0 18%, var(--c-surface)); --c-metric-verses-soft: color-mix(in srgb, #7fb2f0 18%, var(--c-surface));
--c-metric-time-soft: color-mix(in srgb, #f0a860 18%, var(--c-surface)); --c-metric-pages-soft: color-mix(in srgb, #5fd0a8 18%, var(--c-surface));
--c-danger: #ff8a94;
--bg-pattern: var(--pat-oezbekistan); --bg-pattern-op: 0.26; --d-reader-bg: #0a2229;
}
html:root[data-design="tuerkmenistan"] {
color-scheme: dark;
--c-bg: #3a1014; --c-surface: #4c171c; --c-surface-raised: #4c171c; --c-border: #6a2a30; --c-border-input: #ddbab2;
--c-text: #f8ece6; --c-text-muted: #ddbab2; --c-accent: #f0dbb8; --c-on-accent: #3a1014; --c-accent-soft: #5a1e24;
--c-ink: #f8ece6; --c-on-ink: #3a1014;
--c-metric-hasanat: #f38bb0; --c-metric-verses: #7fb2f0; --c-metric-time: #f0a860; --c-metric-pages: #5fd0a8;
--c-metric-hasanat-soft: color-mix(in srgb, #f38bb0 18%, var(--c-surface)); --c-metric-verses-soft: color-mix(in srgb, #7fb2f0 18%, var(--c-surface));
--c-metric-time-soft: color-mix(in srgb, #f0a860 18%, var(--c-surface)); --c-metric-pages-soft: color-mix(in srgb, #5fd0a8 18%, var(--c-surface));
--c-danger: #ff8a94;
--bg-pattern: var(--pat-tuerkmenistan); --bg-pattern-op: 0.2; --d-reader-bg: #280a0d;
}
html:root[data-design="kirgizistan"] {
color-scheme: light;
--c-bg: #f4ead0; --c-surface: #fdf8ea; --c-surface-raised: #fdf8ea; --c-border: #e4d6b0; --c-border-input: #69523f;
--c-text: #2b1a12; --c-text-muted: #69523f; --c-accent: #a3262a; --c-on-accent: #ffffff; --c-accent-soft: #f3dcd2;
--c-ink: #2b1a12; --c-on-ink: #ffffff;
--c-metric-hasanat: #c2255c; --c-metric-verses: #1f63b8; --c-metric-time: #9c4800; --c-metric-pages: #137a5a;
--c-metric-hasanat-soft: #fde8ef; --c-metric-verses-soft: #e6f0fc; --c-metric-time-soft: #fdeedd; --c-metric-pages-soft: #e2f6ef;
--c-danger: #b3182b;
--bg-pattern: var(--pat-kirgizistan); --bg-pattern-op: 0.2; --d-reader-bg: #2c1012;
}
html:root[data-design="tataristan"] {
color-scheme: light;
--c-bg: #f5f7f8; --c-surface: #ffffff; --c-surface-raised: #ffffff; --c-border: #dde5ea; --c-border-input: #4c586f;
--c-text: #121d3a; --c-text-muted: #4c586f; --c-accent: #1b2f80; --c-on-accent: #ffffff; --c-accent-soft: #e1e7f6;
--c-ink: #121d3a; --c-on-ink: #ffffff;
--c-metric-hasanat: #c2255c; --c-metric-verses: #1f63b8; --c-metric-time: #9c4800; --c-metric-pages: #137a5a;
--c-metric-hasanat-soft: #fde8ef; --c-metric-verses-soft: #e6f0fc; --c-metric-time-soft: #fdeedd; --c-metric-pages-soft: #e2f6ef;
--c-danger: #b3182b;
--bg-pattern: var(--pat-tataristan); --bg-pattern-op: 0.2; --d-reader-bg: #0e1838;
}
html:root[data-design="gagavuzya"] {
color-scheme: light;
--c-bg: #f3ead8; --c-surface: #fcf8ee; --c-surface-raised: #fcf8ee; --c-border: #e3d6bb; --c-border-input: #645548;
--c-text: #231a14; --c-text-muted: #645548; --c-accent: #2a54a8; --c-on-accent: #ffffff; --c-accent-soft: #e2e8f5;
--c-ink: #231a14; --c-on-ink: #ffffff;
--c-metric-hasanat: #c2255c; --c-metric-verses: #1f63b8; --c-metric-time: #9c4800; --c-metric-pages: #137a5a;
--c-metric-hasanat-soft: #fde8ef; --c-metric-verses-soft: #e6f0fc; --c-metric-time-soft: #fdeedd; --c-metric-pages-soft: #e2f6ef;
--c-danger: #b3182b;
--bg-pattern: var(--pat-gagavuzya); --bg-pattern-op: 0.2; --d-reader-bg: #16223f;
}
html:root[data-design="cuvasistan"] {
color-scheme: light;
--c-bg: #fbf8f4; --c-surface: #ffffff; --c-surface-raised: #ffffff; --c-border: #eadedd; --c-border-input: #694849;
--c-text: #2a0e10; --c-text-muted: #694849; --c-accent: #a3181f; --c-on-accent: #ffffff; --c-accent-soft: #f6e1e1;
--c-ink: #2a0e10; --c-on-ink: #ffffff;
--c-metric-hasanat: #c2255c; --c-metric-verses: #1f63b8; --c-metric-time: #9c4800; --c-metric-pages: #137a5a;
--c-metric-hasanat-soft: #fde8ef; --c-metric-verses-soft: #e6f0fc; --c-metric-time-soft: #fdeedd; --c-metric-pages-soft: #e2f6ef;
--c-danger: #b3182b;
--bg-pattern: var(--pat-cuvasistan); --bg-pattern-op: 0.2; --d-reader-bg: #2a0a0d;
}
/* Reader: „Nacht" bekommt den dunklen Ton des Designs, Hell/Sepia behalten ihren Grund. Das Muster erscheint immer. */
html:root[data-design]:not([data-reader="hell"]):not([data-reader="sepia"]) { --c-reader-bg: var(--d-reader-bg); --c-reader-pattern: var(--bg-pattern); --reader-pattern-op: .3; }
html:root[data-design][data-reader="hell"], html:root[data-design][data-reader="sepia"] { --c-reader-pattern: var(--bg-pattern); --reader-pattern-op: .14; }