| 1 | /*! Fiesta 1.1.0 | MPL-2.0 | https://fiesta.rastrillo.org */ |
| 2 | |
| 3 | :root { |
| 4 | color-scheme: light dark; |
| 5 | |
| 6 | --rst-font: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; |
| 7 | |
| 8 | --rst-radius: 6px; |
| 9 | --rst-radius-sm: 4px; |
| 10 | --rst-radius-pill: 999px; |
| 11 | |
| 12 | --rst-bg: light-dark(#fbfbfc, #0c0d0f); |
| 13 | --rst-surface: light-dark(#ffffff, #141518); |
| 14 | --rst-surface-2: light-dark(#f3f3f5, #18191d); |
| 15 | --rst-line: light-dark(#e6e6ea, #26282e); |
| 16 | --rst-line-strong: light-dark(#868691, #71737c); |
| 17 | --rst-header-rule: var(--rst-line); |
| 18 | |
| 19 | --rst-text: light-dark(#18181b, #ededf0); |
| 20 | --rst-text-muted: light-dark(#52525c, #a1a1aa); |
| 21 | --rst-text-faint: light-dark(#6b6b75, #8c8c96); |
| 22 | |
| 23 | --rst-accent: light-dark(#1f56d6, #7aa2ff); |
| 24 | --rst-accent-strong: light-dark(color-mix(in srgb, var(--rst-accent, #1f56d6) 80%, #000000), color-mix(in srgb, var(--rst-accent, #7aa2ff) 68.5%, #ffffff)); |
| 25 | --rst-accent-soft: light-dark(#ecf1ff, #16234a); |
| 26 | --rst-on-accent: light-dark(#ffffff, #0c0d0f); |
| 27 | |
| 28 | --rst-tone-neutral-fg: light-dark(#374151, #c3c9d1); |
| 29 | --rst-tone-neutral-bg: light-dark(#eef0f2, #262c34); |
| 30 | --rst-tone-positive-fg: light-dark(#166534, #6ee7a8); |
| 31 | --rst-tone-positive-bg: light-dark(#dcfce7, #10281c); |
| 32 | --rst-tone-warning-fg: light-dark(#854d0e, #f0c46a); |
| 33 | --rst-tone-warning-bg: light-dark(#fef3c7, #2c2110); |
| 34 | --rst-tone-negative-fg: light-dark(#b91c1c, #f79aa0); |
| 35 | --rst-tone-negative-bg: light-dark(#fee2e2, #331819); |
| 36 | |
| 37 | --rst-shadow-pop: 0 2px 4px light-dark(rgba(16, 24, 40, 0.06), rgba(0, 0, 0, 0.35)), 0 8px 16px -4px light-dark(rgba(16, 24, 40, 0.1), rgba(0, 0, 0, 0.5)); |
| 38 | --rst-shadow-knob: 0 1px 2px light-dark(rgba(16, 24, 40, 0.22), rgba(0, 0, 0, 0.5)), 0 0 0 0.5px light-dark(rgba(16, 24, 40, 0.08), rgba(0, 0, 0, 0.3)); |
| 39 | --rst-shadow-knob-hover: 0 1.5px 3px light-dark(rgba(16, 24, 40, 0.26), rgba(0, 0, 0, 0.58)), 0 0 0 0.5px light-dark(rgba(16, 24, 40, 0.08), rgba(0, 0, 0, 0.3)); |
| 40 | --rst-shadow-lift: 0 1px 2px light-dark(rgba(16, 24, 40, 0.08), rgba(0, 0, 0, 0.3)); |
| 41 | --rst-overlay: light-dark(rgba(0, 0, 0, 0.45), rgba(0, 0, 0, 0.6)); |
| 42 | |
| 43 | --rst-accent-fill: light-dark(#2257df, #2f61e8); |
| 44 | --rst-accent-fill-hover: light-dark(#1d4dc8, #2956d0); |
| 45 | --rst-accent-fill-edge: light-dark(#153ca0, #1f43a6); |
| 46 | --rst-accent-fill-edge-hover: light-dark(#12358f, #1a3b95); |
| 47 | --rst-on-accent-fill: #ffffff; |
| 48 | --rst-danger-fill: light-dark(#c62f2f, #c43232); |
| 49 | --rst-danger-fill-hover: light-dark(#b12929, #af2c2c); |
| 50 | --rst-danger-fill-edge: light-dark(#8d1f1f, #8c2121); |
| 51 | --rst-danger-fill-edge-hover: light-dark(#7e1a1a, #7d1d1d); |
| 52 | --rst-on-danger-fill: #ffffff; |
| 53 | --rst-on-danger-fill-hover: #ffffff; |
| 54 | --rst-danger-hover-filter: none; |
| 55 | |
| 56 | --rst-control-face: light-dark(#ffffff, #141518); |
| 57 | --rst-control-face-hover: light-dark(#f7f8fa, #1b1d22); |
| 58 | --rst-control-face-press: light-dark(#e6e9ee, #202329); |
| 59 | --rst-control-border: light-dark(#d0d4dc, #343843); |
| 60 | --rst-control-border-hover: light-dark(#8a8a95, #71737c); |
| 61 | --rst-control-text-hover: light-dark(#18181b, #ededf0); |
| 62 | --rst-ghost-edge: transparent; |
| 63 | --rst-ghost-face-hover: light-dark(#f3f3f5, #18191d); |
| 64 | --rst-ghost-edge-hover: transparent; |
| 65 | --rst-summary-face: light-dark(#ffffff, #141518); |
| 66 | --rst-summary-face-hover: light-dark(#f7f8fa, #1b1d22); |
| 67 | --rst-summary-edge: light-dark(#d0d4dc, #343843); |
| 68 | --rst-summary-edge-hover: light-dark(#8a8a95, #71737c); |
| 69 | --rst-summary-radius: var(--rst-radius-sm); |
| 70 | |
| 71 | --rst-depth-hl: light-dark(rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0.06)); |
| 72 | --rst-depth-contact: light-dark(rgba(16, 24, 40, 0.1), rgba(0, 0, 0, 0.5)); |
| 73 | --rst-depth-ambient: light-dark(rgba(16, 24, 40, 0.06), rgba(0, 0, 0, 0.35)); |
| 74 | --rst-depth-face: 0.04; |
| 75 | --rst-press-drop: 1px; |
| 76 | |
| 77 | --rst-knob: #ffffff; |
| 78 | --rst-knob-shade: light-dark(#f1f3f6, #d9dee8); |
| 79 | --rst-track-off: light-dark(#8a8a95, #71737c); |
| 80 | --rst-switch-w: 40px; |
| 81 | --rst-switch-h: 23px; |
| 82 | --rst-switch-knob: 19px; |
| 83 | --rst-switch-touch-w: 51px; |
| 84 | --rst-switch-touch-h: 31px; |
| 85 | --rst-switch-touch-knob: 27px; |
| 86 | |
| 87 | --rst-tint-hover: light-dark(color-mix(in srgb, var(--rst-accent, #1f56d6) 4.5%, var(--rst-surface)), color-mix(in srgb, var(--rst-accent, #7aa2ff) 10%, var(--rst-bg))); |
| 88 | --rst-tint-press: light-dark(color-mix(in srgb, var(--rst-accent, #1f56d6) 8.5%, var(--rst-surface)), color-mix(in srgb, var(--rst-accent, #7aa2ff) 19%, #000000)); |
| 89 | --rst-tint-tap: var(--rst-tint-press); |
| 90 | --rst-tint-card-hover: var(--rst-tint-hover); |
| 91 | --rst-tint-tile-hover: var(--rst-tint-hover); |
| 92 | --rst-tint-tile-press: var(--rst-tint-press); |
| 93 | --rst-tint-group-hover: var(--rst-tint-hover); |
| 94 | --rst-row-tint-hover: var(--rst-tint-hover); |
| 95 | --rst-row-tint-press: var(--rst-tint-press); |
| 96 | --rst-focus-edge: var(--rst-accent, light-dark(#1f56d6, #7aa2ff)); |
| 97 | --rst-focus-halo: color-mix(in srgb, var(--rst-accent, light-dark(#1f56d6, #7aa2ff)) 22%, transparent); |
| 98 | |
| 99 | --rst-sheen-fill: light-dark(rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.04)); |
| 100 | --rst-sheen-plain: light-dark(color-mix(in srgb, var(--rst-accent-fill) 9%, transparent), rgba(255, 255, 255, 0.04)); |
| 101 | --rst-light-rim: light-dark(color-mix(in srgb, var(--rst-accent, #1f56d6) 23%, var(--rst-line)), color-mix(in srgb, var(--rst-accent, #7aa2ff) 31%, #505050)); |
| 102 | --rst-light-wash: light-dark(rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.015)); |
| 103 | |
| 104 | --rst-press-wash: 0.08; |
| 105 | --rst-press-spot: 0.16; |
| 106 | --rst-press-wash-plain: 0.04; |
| 107 | --rst-press-spot-plain: 0.07; |
| 108 | |
| 109 | --rst-title-size: 1.25rem; |
| 110 | --rst-title-weight: 600; |
| 111 | --rst-title-track: -0.012em; |
| 112 | --rst-heading-size: 0.8125rem; |
| 113 | --rst-label-case: none; |
| 114 | --rst-label-track: 0; |
| 115 | --rst-rail-bg: var(--rst-bg); |
| 116 | --rst-nav-current-bg: light-dark(#ffffff, #141518); |
| 117 | --rst-nav-current-fg: light-dark(#18181b, #ededf0); |
| 118 | } |
| 119 | |
| 120 | @supports (color: oklch(from red l c h)) { |
| 121 | :root { |
| 122 | --rst-accent-soft: light-dark(oklch(from var(--rst-accent, #1f56d6) 0.958 min(calc(c * 0.0878), 0.018) h), oklch(from var(--rst-accent, #7aa2ff) 0.268 min(calc(c * 0.5039), 0.072) h)); |
| 123 | --rst-accent-fill: light-dark(oklch(from var(--rst-accent, #1f56d6) calc(0.513 - 0.05 * max(0, cos((h - 170) * 1deg) - 0.087)) min(calc(c * 1.0244), 0.21) h), oklch(from var(--rst-accent, #7aa2ff) calc(0.543 - 0.1 * max(0, cos((h - 170) * 1deg) - 0.087)) min(calc(c * 1.5045), 0.215) h)); |
| 124 | --rst-accent-fill-hover: light-dark(oklch(from var(--rst-accent, #1f56d6) calc(0.472 - 0.045 * max(0, cos((h - 170) * 1deg) - 0.087)) min(calc(c * 0.9463), 0.194) h), oklch(from var(--rst-accent, #7aa2ff) calc(0.5 - 0.05 * max(0, cos((h - 170) * 1deg) - 0.087)) min(calc(c * 1.3786), 0.197) h)); |
| 125 | --rst-accent-fill-edge: light-dark(oklch(from var(--rst-accent, #1f56d6) 0.401 min(calc(c * 0.8049), 0.165) h), oklch(from var(--rst-accent, #7aa2ff) 0.422 min(calc(c * 1.1617), 0.166) h)); |
| 126 | --rst-accent-fill-edge-hover: light-dark(oklch(from var(--rst-accent, #1f56d6) 0.37 min(calc(c * 0.7366), 0.151) h), oklch(from var(--rst-accent, #7aa2ff) 0.389 min(calc(c * 1.0847), 0.155) h)); |
| 127 | } |
| 128 | } |
| 129 | |
| 130 | :root[data-theme="light"] { color-scheme: light; } |
| 131 | :root[data-theme="dark"] { color-scheme: dark; } |
| 132 | |
| 133 | :root[data-theme="dark"] { --rst-press-wash: 0.18; --rst-press-spot: 0.30; --rst-press-wash-plain: 0.18; --rst-press-spot-plain: 0.30; } |
| 134 | @media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) { --rst-press-wash: 0.18; --rst-press-spot: 0.30; --rst-press-wash-plain: 0.18; --rst-press-spot-plain: 0.30; } } |
| 135 | |