/* Turistat — barevné motivy ───────────────────────────────────────────────────────────────────── Každý motiv nastavuje stejnou sadu proměnných, komponenty se nemění. Přepíná se atributem data-theme na . Datová paleta (barvy zemí) žije v app.js, protože se musí měnit spolu s motivem. atlas — světlý statistický. Chladné šedi, tlumená data. Výchozí. nokturno — tmavý pro dlouhou práci s mapou. Data mají vyšší sytost, aby unesla tmavý podklad. almanach — tištěná ročenka. Papírový podklad, patkové nadpisy, tenké linky, vínový akcent. Hustší sazba čísel. kontrast — přístupnost. Okabe-Ito paleta rozlišitelná při všech typech barvosleposti, silnější linky, větší písmo. ───────────────────────────────────────────────────────────────── */ :root, [data-theme="atlas"] { --ink: #12232b; --ink-soft: #3c525c; --muted: #6b7f87; --ground: #e9edee; --surface: #ffffff; --surface-2: #f4f7f7; --surface-3: #eef3f4; --hairline: #d2d9dc; --rule: 1px; --radius: 2px; --signal: #8f6410; --tint: #f6f4ef; --track: #eef2f3; --topbar-bg: #12232b; --topbar-fg: #dfe6e8; --topbar-dim: #8ba3ac; --font-sans: "IBM Plex Sans", system-ui, -apple-system, sans-serif; --font-mono: "IBM Plex Mono", ui-monospace, monospace; --font-display: var(--font-sans); --display-weight: 600; --display-tracking: -.012em; --base-size: 15px; --map-style: "positron"; } [data-theme="nokturno"] { --ink: #e4ebee; --ink-soft: #a9bcc4; --muted: #7c919a; --ground: #0d171c; --surface: #16242b; --surface-2: #1d2f37; --surface-3: #243a44; --hairline: #2c434e; --rule: 1px; --radius: 2px; --signal: #d9a441; --tint: #202f2e; --track: #223640; --topbar-bg: #0a1216; --topbar-fg: #dbe6ea; --topbar-dim: #7c919a; --font-sans: "IBM Plex Sans", system-ui, sans-serif; --font-mono: "IBM Plex Mono", ui-monospace, monospace; --font-display: var(--font-sans); --display-weight: 600; --display-tracking: -.012em; --base-size: 15px; --map-style: "dark"; } [data-theme="almanach"] { --ink: #1b241c; --ink-soft: #3e4c3f; --muted: #6d7a6c; --ground: #e4ddcf; --surface: #f2ece0; --surface-2: #eae2d3; --surface-3: #e1d8c6; --hairline: #c3b9a4; --rule: 1px; --radius: 0; --signal: #7b2d26; --tint: #e9e0cd; --track: #ddd3bf; --topbar-bg: #1b241c; --topbar-fg: #ece5d6; --topbar-dim: #a2a893; --font-sans: "IBM Plex Sans", system-ui, sans-serif; --font-mono: "IBM Plex Mono", ui-monospace, monospace; --font-display: "Newsreader", Georgia, "Times New Roman", serif; --display-weight: 500; --display-tracking: 0; --base-size: 15px; --map-style: "voyager"; } [data-theme="kontrast"] { --ink: #000000; --ink-soft: #1c1c1c; --muted: #4a4a4a; --ground: #e6e6e6; --surface: #ffffff; --surface-2: #f0f0f0; --surface-3: #e2e2e2; --hairline: #7a7a7a; --rule: 2px; --radius: 0; --signal: #8a4b00; --tint: #f5eee4; --track: #dcdcdc; --topbar-bg: #000000; --topbar-fg: #ffffff; --topbar-dim: #c9c9c9; --font-sans: "IBM Plex Sans", system-ui, sans-serif; --font-mono: "IBM Plex Mono", ui-monospace, monospace; --font-display: var(--font-sans); --display-weight: 600; --display-tracking: -.008em; --base-size: 16.5px; --map-style: "positron"; } /* Riviera — prazdninova linka. Vychazi z tistenych cestovnich plakatu sedesatych let: ploche bloky barvy, morska tyrkys, slunecni okr a plakatova cerven. Nadpisy sazi Fraunces, ktery ma teplo a mekke zakonceni; telo textu Karla, ktera je hravejsi nez neutralni grotesk. Vetsi radiusy, teply papir misto sedi. Urceno pro verejny web, zatimco Atlas zustava pracovnim nastrojem. */ [data-theme="riviera"] { --ink: #123a47; --ink-soft: #33606c; --muted: #7a8e91; --ground: #efe3cb; --surface: #fffcf4; --surface-2: #f8efdd; --surface-3: #f1e4c9; --hairline: #ddc9a4; --rule: 1px; --radius: 10px; --signal: #c6473a; --tint: #fbeede; --track: #eadfc6; --topbar-bg: #123a47; --topbar-fg: #fdf6e8; --topbar-dim: #93b3ba; --brand-1: #1c7a87; --brand-2: #e8a33d; --brand-3: #c6473a; --brand-4: #2e9b7f; --brand-pole: #123a47; --brand-paper:#fffcf4; --font-sans: "Karla", system-ui, sans-serif; --font-mono: "IBM Plex Mono", ui-monospace, monospace; --font-display: "Fraunces", Georgia, serif; --display-weight: 600; --display-tracking: -.014em; --base-size: 15.5px; --map-style: "voyager"; } /* Prazdninova linka je mekci: vetsi rohy, teplejsi plochy, vzdusnejsi rejstrik. Nikde nepribyva dekorace, meni se jen rytmus. */ [data-theme="riviera"] .rows li { padding: .78rem .95rem .7rem; } [data-theme="riviera"] .strip { height: 6px; border-radius: 3px; } [data-theme="riviera"] .index-head { background: var(--surface-2); } [data-theme="riviera"] .confidence { border-radius: var(--radius); border-left-width: 4px; } [data-theme="riviera"] .block h3 { border-bottom-style: solid; } [data-theme="riviera"] .seasons { border-radius: var(--radius); overflow: hidden; } [data-theme="riviera"] .months .col { border-radius: 3px 3px 0 0; } [data-theme="riviera"] .bar .track, [data-theme="riviera"] .bar .fill { border-radius: 6px; } [data-theme="riviera"] .detail h2 { font-size: 1.72rem; line-height: 1.1; } [data-theme="riviera"] .pin svg { filter: drop-shadow(0 2px 4px rgba(18,58,71,.28)); } /* Kontrastní motiv zesiluje i nedatové prvky */ [data-theme="kontrast"] .rows li { border-bottom-width: 2px; } [data-theme="kontrast"] .strip { height: 6px; } [data-theme="kontrast"] :focus-visible { outline-width: 3px; } /* Almanach sází nadpisy patkově a linky vlásečnicově */ [data-theme="almanach"] .block h3 { letter-spacing: .01em; } [data-theme="almanach"] .detail h2 { font-style: normal; }