:root{--card-border-radius: 0.5rem;--card-border-width: 1px;--card-border-style: none;--card-title-color: var(--text-heading);--card-text-color: var(--text-default);--card-bg-opacity: 0.2;--card-border-opacity: 1;--card-icon-opacity: 1;--card-number-opacity: 1;--card-title-opacity: 1;--card-info-bg-hsl: var(--blue-400-hsl);--card-info-icon-color-hsl: var(--blue-300-hsl);--card-info-border-color-hsl: var(--blue-300-hsl);--card-goal-bg-hsl: var(--magenta-400-hsl);--card-goal-icon-color-hsl: var(--magenta-200-hsl);--card-goal-border-color-hsl: var(--magenta-200-hsl);--card-success-bg-hsl: var(--emerald-400-hsl);--card-success-icon-color-hsl: var(--emerald-300-hsl);--card-success-border-color-hsl: var(--emerald-300-hsl);--card-recommendation-bg-hsl: var(--teal-500-hsl);--card-recommendation-icon-color-hsl: var(--teal-400-hsl);--card-recommendation-border-color-hsl: var(--teal-400-hsl);--card-danger-bg-hsl: var(--cardinal-400-hsl);--card-danger-icon-color-hsl: var(--cardinal-300-hsl);--card-danger-border-color-hsl: var(--cardinal-300-hsl);--card-note-bg-hsl: var(--orange-400-hsl);--card-note-icon-color-hsl: var(--orange-300-hsl);--card-note-border-color-hsl: var(--orange-300-hsl);--card-cta-bg-hsl: var(--viet-500-hsl);--card-cta-icon-color-hsl: var(--viet-400-hsl);--card-cta-border-color-hsl: var(--viet-400-hsl);--card-support-bg-hsl: var(--cyan-500-hsl);--card-support-icon-color-hsl: var(--cyan-400-hsl);--card-support-border-color-hsl: var(--cyan-400-hsl);--card-learn-more-bg-hsl: var(--turquoise-500-hsl);--card-learn-more-icon-color-hsl: var(--turquoise-400-hsl);--card-learn-more-border-color-hsl: var(--turquoise-400-hsl);--card-weird-bg-hsl: var(--slate-700-hsl);--card-weird-icon-color-hsl: var(--slate-500-hsl);--card-weird-border-color-hsl: var(--slate-500-hsl);--card-minor-bg-hsl: var(--gray-500-hsl);--card-minor-icon-color-hsl: var(--gray-400-hsl);--card-minor-border-color-hsl: var(--gray-400-hsl)}[data-dark-mode],.dark{--card-info-bg-hsl: var(--blue-500-hsl);--card-info-icon-color-hsl: var(--blue-300-hsl);--card-info-border-color-hsl: var(--blue-700-hsl);--card-goal-bg-hsl: var(--magenta-500-hsl);--card-goal-icon-color-hsl: var(--magenta-200-hsl);--card-goal-border-color: hsl(var(--magenta-700-hsl),1);--card-recommendation-bg-hsl: var(--teal-500-hsl);--card-recommendation-icon-color-hsl: var(--teal-300-hsl);--card-recommendation-border-color-hsl: var(--teal-700-hsl);--card-success-bg-hsl: var(--emerald-500-hsl);--card-success-icon-color-hsl: var(--emerald-200-hsl);--card-success-border-color-hsl: var(--emerald-700-hsl);--card-danger-bg-hsl: var(--cardinal-500-hsl);--card-danger-icon-color-hsl: var(--cardinal-200-hsl);--card-danger-border-color-hsl: var(--cardinal-700-hsl);--card-note-bg-hsl: var(--orange-500-hsl);--card-note-icon-color-hsl: var(--orange-300-hsl);--card-note-border-color-hsl: var(--orange-700-hsl);--card-cta-bg-hsl: var(--viet-700-hsl);--card-cta-icon-color-hsl: var(--viet-500-hsl);--card-cta-border-color-hsl: var(--viet-800-hsl);--card-support-bg-hsl: var(--cyan-600-hsl);--card-support-icon-color-hsl: var(--cyan-400-hsl);--card-support-border-color-hsl: var(--cyan-800-hsl);--card-learn-more-bg-hsl: var(--turquoise-500-hsl);--card-learn-more-icon-color-hsl: var(--turquoise-200-hsl);--card-learn-more-border-color-hsl: var(--turquoise-700-hsl);--card-weird-bg-hsl: var(--slate-600-hsl);--card-weird-icon-color-hsl: var(--slate-500-hsl);--card-weird-border-color-hsl: var(--slate-800-hsl);--card-minor-bg-hsl: var(--gray-600-hsl);--card-minor-icon-color-hsl: var(--gray-500-hsl);--card-minor-border-color-hsl: var(--gray-800-hsl)}.card{background:var(--card-bg);border-color:var(--card-border-color);border-radius:4px;transition:all 0.2s;-webkit-transition:all 0.2s}.card .material-icons{font-size:3rem}.card .material-icons.icon-faint{font-size:1.5rem;color:var(--secondary)}.card .card-title{margin-top:0 !important;transition:color 0.2s ease-in-out}.card .card-body{padding:1.5rem}.card .card-body .card-title{color:var(--card-title-color)}.card .card-body .card-text{color:var(--card-text-color);font-weight:500}.card:hover{border-color:var(--card-border-hover-color)}.card:hover .material-icons{color:var(--sidebar-primary)}.card:hover .card-title{color:var(--sidebar-primary)}.card:hover .card-text{color:var(--card-title-color)}.card:hover .icon-faint{color:var(--sidebar-primary)}
