html.sf-theme-favorites{color-scheme:light dark;--sf-primary-5: rgb(30, 60, 180);--sf-primary-4: rgb(45, 75, 200);--sf-primary-3: rgb(55, 90, 220);--sf-primary-2: rgb(63, 95, 230);--sf-primary-1: rgb(70, 105, 245);--sf-primary: rgb(75, 111, 255);--sf-primary1: rgb(110, 140, 255);--sf-primary2: rgb(140, 165, 255);--sf-primary3: rgb(170, 190, 255);--sf-primary4: rgb(200, 215, 255);--sf-primary5: rgb(230, 238, 255);--sf-secondary-5: #2e7d32;--sf-secondary-4: #388e3c;--sf-secondary-3: #43a047;--sf-secondary-2: #45a049;--sf-secondary-1: #4aad4d;--sf-secondary: #4caf50;--sf-secondary1: #66bb6a;--sf-secondary2: #81c784;--sf-secondary3: #a5d6a7;--sf-secondary4: #c8e6c9;--sf-secondary5: #e8f5e9;--sf-error-5: #b71c1c;--sf-error-4: #c62828;--sf-error-3: #d32f2f;--sf-error-2: #e53935;--sf-error-1: #ef5350;--sf-error: #f44336;--sf-error1: #e57373;--sf-error2: #ef9a9a;--sf-error3: #ffcdd2;--sf-error4: #ffebee;--sf-error5: #fff5f5;--sf-bg: #fafafa;--sf-surface: #ffffff;--sf-surface-hover: #f5f5f5;--sf-surface-active: #f0f0f0;--sf-subtle-bg: #f0f0f0;--sf-text1: #111111;--sf-text1a: #666666;--sf-text2: #ffffff;--sf-text2a: rgba(255,255,255,.7);--sf-border-color: #e7e7e7;--sf-input-border: 1px solid #e7e7e7;--sf-shadow: 2px 2px 8px 2px rgba(0, 0, 0, .1);--sf-shadow-active: 1px 1px 5px 1px rgba(0, 0, 0, .2);--sf-radius: .25em;--sf-hover-color: rgba(0, 0, 0, .04);--sf-scrim: rgba(0, 0, 0, .7);--color-bg: var(--sf-bg);--color-text: var(--sf-text1);--color-surface: var(--sf-surface);--color-surface-hover: var(--sf-surface-hover);--color-surface-active: var(--sf-surface-active);--color-border: var(--sf-border-color);--color-subtle-bg: var(--sf-subtle-bg);--shadow-elev-1: var(--sf-shadow);--shadow-elev-1-active: var(--sf-shadow-active);--color-primary: var(--sf-primary);--color-primary-hover: var(--sf-primary-2);--color-on-primary: var(--sf-text2);--color-accent: var(--sf-secondary);--color-accent-hover: var(--sf-secondary-2);--color-on-accent: var(--sf-text2);--color-muted-text: var(--sf-text1a);--color-scrim: var(--sf-scrim);--color-error: var(--sf-error);--color-error-hover: var(--sf-error-3);--color-on-error: var(--sf-text2)}html.sf-theme-favorites.dark{--sf-primary-5: rgb(50, 85, 200);--sf-primary-4: rgb(65, 100, 220);--sf-primary-3: rgb(80, 115, 240);--sf-primary-2: rgb(102, 141, 255);--sf-primary-1: rgb(95, 135, 255);--sf-primary: rgb(88, 129, 255);--sf-primary1: rgb(120, 155, 255);--sf-primary2: rgb(150, 180, 255);--sf-primary3: rgb(180, 200, 255);--sf-primary4: rgb(210, 225, 255);--sf-primary5: rgb(235, 242, 255);--sf-secondary: #69c77a;--sf-secondary-2: #5ab86b;--sf-secondary-3: #4caf50;--sf-error: #ef5350;--sf-error-3: #e53935;--sf-bg: #121212;--sf-surface: #1e1e1e;--sf-surface-hover: #232323;--sf-surface-active: #262626;--sf-subtle-bg: #262626;--sf-text1: #e6e6e6;--sf-text1a: #aaaaaa;--sf-text2: #ffffff;--sf-text2a: rgba(255,255,255,.7);--sf-border-color: #2f2f2f;--sf-input-border: 1px solid #2f2f2f;--sf-shadow: 2px 2px 8px 2px rgba(0, 0, 0, .5);--sf-shadow-active: 1px 1px 5px 1px rgba(0, 0, 0, .6);--sf-hover-color: rgba(255, 255, 255, .04);--sf-scrim: rgba(0, 0, 0, .6);--color-on-accent: #111111}*{font-family:sans-serif}button.btn--primary{background-color:var(--color-primary);color:var(--color-on-primary);border-color:transparent}button.btn--primary:hover{background-color:var(--color-primary-hover)}button.btn--accent{background-color:var(--color-accent);color:var(--color-on-accent);border-color:transparent}button.btn--accent:hover{background-color:var(--color-accent-hover)}button.btn--subtle{background-color:var(--color-subtle-bg);color:var(--color-text);border-color:var(--color-border)}button.btn--subtle:hover{background-color:var(--color-surface-hover)}.card-grid .card-item.add-card{background-color:var(--color-subtle-bg)}.card-grid .card-item.add-card .add-icon{font-size:2em;font-weight:700;color:var(--color-accent)}.card-grid .card-item.add-card:hover{background-color:var(--color-surface-hover)}html,body{background-color:var(--color-bg);color:var(--color-text)}button{display:flex;border:1px solid var(--color-border);box-shadow:var(--shadow-elev-1);border-radius:.25em;flex-direction:column;align-items:center;justify-content:space-around;cursor:pointer;-webkit-user-select:none;user-select:none;position:relative;margin:1em;padding:.5em;background-color:var(--color-surface)}button:hover{background-color:var(--color-surface-hover)}button:active{background-color:var(--color-surface-active);top:1px;left:1px;box-shadow:var(--shadow-elev-1-active)}.card-grid{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:center;overflow-y:auto;gap:1em;padding:1em}.card-item{display:flex;border:1px solid var(--color-border);box-shadow:var(--shadow-elev-1);border-radius:.25em;width:10em;height:10em;flex-direction:column;align-items:center;justify-content:space-around;cursor:pointer;-webkit-user-select:none;user-select:none;position:relative;overflow:hidden;background-color:var(--color-surface);transition:all .2s ease}.card-item:hover{background-color:var(--color-surface-hover)}.card-item:active{background-color:var(--color-surface-active);top:1px;left:1px;box-shadow:var(--shadow-elev-1-active)}.card-item .title{font-size:1.1em;font-weight:700;text-align:center;padding:0 .5em}.card-item .subtitle{font-family:monospace;background-color:var(--color-subtle-bg);padding:2px 8px;border-radius:3px;font-size:.9em;margin-top:.5em}