:root{--neutral-900: #091540;--neutral-800: #202535;--neutral-700: #2f364b;--neutral-600: #535868;--neutral-300: #c6c6c6;--neutral-200: #d6e2f5;--neutral-100: #eeeeee;--neutral-0: #fbfdfe;--red-400: #f25c54;--red-500: #de4840;--red-700: #c7231a;--gradient-light: linear-gradient(180deg, #ebf2fc 0%, #eefbf9 100%);--gradient-dark: linear-gradient(180deg, #04091b 0%, #091540 100%);--text-preset-1: bold 34px/100% "Noto Sans", sans-serif;--text-preset-1-letter-spacing: -1px;--text-preset-2: bold 20px/120% "Noto Sans", sans-serif;--text-preset-2-letter-spacing: -.2px;--text-preset-3: 400 20px/140% "Noto Sans", sans-serif;--text-preset-3-letter-spacing: -.3px;--text-preset-4: 500 20px/140% "Noto Sans", sans-serif;--text-preset-4-letter-spacing: -.3px;--text-preset-5: 400 16px/140% "Noto Sans", sans-serif;--text-preset-5-letter-spacing: -.5px;--text-preset-6: 500 16px/140% "Noto Sans", sans-serif;--text-preset-6-letter-spacing: -.5px}#root{min-height:auto;display:flex;justify-content:center;align-items:center;flex-direction:column;padding:20px 16px}*{box-sizing:border-box;margin:0}html,body{margin:0}body{min-height:120vh;background:var(--gradient-light)}.main{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:32px;min-height:120vh;margin:auto;flex:1}.top-nav{margin-bottom:8px;width:100%;display:flex;height:66px;padding:12px;justify-content:space-between;align-items:center;flex-direction:row;background-color:#fff;border-radius:12px;border:1px solid var(--neutral-200);box-shadow:0 6px 10px #0000001a}.theme-toggle{background-color:var(--neutral-100);border:none;padding:5px;border-radius:16px;height:50px;width:50px;cursor:pointer;display:flex;justify-content:center;align-items:center}body.dark .theme-toggle{background-color:var(--neutral-700)}.theme-toggle:focus{border:3px solid white;outline:3px solid var(--red-400)}body.dark .theme-toggle:focus{border:2px solid var(--neutral-800);outline:2px solid var(--red-400)}.secondary-nav{margin-top:26px;width:100%;display:flex;justify-content:space-between;align-items:center;flex-direction:column;gap:20px}.section-title{font:var(--text-preset-1);letter-spacing:var(--text-preset-1-letter-spacing);color:var(--neutral-900)}body.dark .section-title{color:#fff}.container{display:grid;width:100%;grid-template-columns:repeat(auto-fit,minmax(324px,1fr));gap:12px}.filter-list{list-style:none;justify-content:center;align-items:center;display:flex;gap:16px}ul{padding:0}.filter-list li{padding:0;border:none}.filter-list button{background-color:#fff;border:var(--neutral-300);padding:6px 20px;border-radius:22px;cursor:pointer;color:var(--neutral-900);font:var(--text-preset-4);letter-spacing:var(--text-preset-4-letter-spacing)}.filter-list button.active{background-color:var(--red-500);color:#fff}body.dark .filter-list button{background-color:var(--neutral-700);color:#fff}body.dark .filter-list button.active{background-color:var(--red-500);color:#000}.card{width:100%;height:200px;padding:20px;background-color:#fff;border-radius:12px;border:1px solid var(--neutral-200);box-shadow:0 6px 10px #0000001a;display:flex;flex-direction:column;justify-content:space-between;align-items:center;gap:16px}.top-card{display:flex;gap:16px}.top-card img{width:60px;height:60px}.card-title{font:var(--text-preset-2);letter-spacing:var(--text-preset-2-letter-spacing);color:var(--neutral-900);margin-bottom:8px}body.dark .card-title{color:#fff}.text p{font:var(--text-preset-5);letter-spacing:var(--text-preset-5-letter-spacing);color:var(--neutral-600)}body.dark .text p{color:var(--neutral-300)}.bottom-card{width:100%;display:flex;justify-content:space-between;align-items:center}.btn{padding:8px 16px;font:var(--text-preset-6);letter-spacing:var(--text-preset-6-letter-spacing);color:var(--neutral-900);background-color:#fff;border-radius:22px;cursor:pointer;border:1px solid var(--neutral-300)}button:hover{cursor:pointer;background-color:var(--red-400)}body.dark button:hover{background-color:var(--red-400)}.btn:focus{border:2px solid var(--neutral-300);outline:2px solid var(--red-400)}body.dark .btn:focus{background-color:var(--neutral-600);border:2px solid var(--neutral-800);outline:2px solid var(--red-400)}body.dark .btn{background-color:var(--neutral-800);color:#fff;border:1px solid var(--neutral-600)}.toggle-group{display:inline-block}.toggle-group input[type=checkbox]{position:absolute;opacity:0;width:1px;height:1px}.toggle-group input[type=checkbox]:focus+.toggle-label{outline:2px solid var(--red-400);outline-offset:2px}.toggle-label{width:36px;height:20px;background:var(--neutral-600);border-radius:999px;display:inline-block;position:relative;cursor:pointer;transition:background .3s ease}.toggle-label:after{content:"";position:absolute;width:16px;height:16px;top:2px;left:2px;background:#fff;border-radius:50%;transition:transform .3s ease;box-shadow:0 2px 4px #0003}input[type=checkbox]:checked+.toggle-label{background:#c81e1e}input[type=checkbox]:checked+.toggle-label:after{transform:translate(15.5px)}body.dark{background:var(--gradient-dark)}body.dark .top-nav{background-color:var(--neutral-800);border:1px solid var(--neutral-700);box-shadow:0 6px 10px #0000001a}body.dark .card{background-color:var(--neutral-800);border:1px solid var(--neutral-600);box-shadow:0 6px 10px #0000001a}body.dark .top-nav{color:#fff}body .logo-dark,body.dark .logo-light{display:none}body .logo-light,body.dark .logo-dark{display:block}body.dark .moon-icon{display:none}body.dark .sun-icon{display:block}body .sun-icon{display:none}@media(min-width:568px){.secondary-nav{flex-direction:row}}@media(min-width:768px){#root{padding:24px 32px}.container{grid-template-columns:repeat(2,1fr)}.top-nav{height:74px}}@media(min-width:1200px){#root{padding:40px}.main{width:1170px}.container{grid-template-columns:repeat(3,1fr)}}.attribution{font-size:.9rem;text-align:center;padding:1rem;color:#deb887;font-family:Arial,Helvetica,sans-serif}.attribution a{margin:0 .25rem;text-decoration:none;font-weight:500;color:#e6521c;transition:color .2s ease,opacity .2s ease}.attribution a:hover{opacity:.8;text-decoration:underline}.separator{margin:0 .5rem;opacity:.6}.year{margin-left:.5rem;font-weight:600;display:inline-block;animation:flicker 1s step-end infinite;color:#db592a}@keyframes flicker{0%{opacity:1}50%{opacity:.5}to{opacity:1}}@media(prefers-color-scheme:dark){.attribution{background-color:#111827;color:#e5e7eb}.attribution a{color:#60a5fa}.separator{opacity:.5}}