main{padding-top:80px;--page:1080px}.cards{display:flex;flex-wrap:wrap;justify-content:center;gap:18px}.cards>.tool{flex-grow:0;flex-shrink:1;flex-basis:calc((100% - 2 * 18px) / 3);min-width:260px}@media (max-width:920px){.cards>.tool{flex-basis:calc((100% - 18px) / 2)}}.tool{position:relative;isolation:isolate;overflow:hidden;display:block;padding:22px;background:var(--card);border:0;border-radius:calc(var(--radius) + 4px);color:inherit;text-decoration:none;transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s cubic-bezier(.2,.8,.2,1);animation:card-in .6s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--i, 0) * 55ms)}.tool:before{left:50%;top:50%;z-index:-2;width:260%;aspect-ratio:1;background:conic-gradient(from 0deg,var(--hairline,var(--border)) 0 calc(100% - var(--len, 30%)),color-mix(in srgb,var(--accent) 40%,transparent) calc(100% - var(--len, 30%) + 1%),var(--accent) calc(100% - 12%),color-mix(in srgb,var(--accent) 55%,#ffffff) calc(100% - 1%),var(--hairline,var(--border)) 100%);transform:translate(-50%,-50%) rotate(var(--start,0deg));animation:snake var(--dur,8s) linear infinite var(--dir,normal)}.tool:after,.tool:before{content:"";position:absolute}.tool:after{inset:3px;z-index:-1;border-radius:calc(var(--radius) + 1px);background:var(--card)}@keyframes snake{0%{transform:translate(-50%,-50%) rotate(var(--start,0deg))}to{transform:translate(-50%,-50%) rotate(calc(var(--start, 0deg) + 1turn))}}@keyframes card-in{0%{opacity:0;transform:translateY(14px) scale(.985)}}.tool{box-shadow:0 0 0 1px color-mix(in srgb,var(--accent) 12%,transparent),0 6px 22px -12px color-mix(in srgb,var(--accent) 45%,transparent)}.tool:hover{transform:translateY(-3px);box-shadow:0 14px 34px -14px color-mix(in srgb,var(--accent) 45%,transparent)}.tool:hover:before{animation-duration:calc(var(--dur, 8s) / 3)}.tool:active{transform:translateY(-1px) scale(.985);transition-duration:.12s}@media (prefers-reduced-motion:reduce){.tool,.tool:before{animation:none}.tool:hover{transform:none}}.tool h2{margin:0 0 6px;font-size:17px;letter-spacing:-.01em}.tool p{margin:0;color:var(--muted);font-size:14px}@media (max-width:620px){main{padding-top:28px}.cards{gap:10px}.cards>.tool{flex-basis:calc((100% - 10px) / 2);min-width:0}.tool{padding:14px}.tool h2{font-size:15px}.tool p{font-size:13px}}.board{border:1px solid var(--border);border-radius:var(--radius);padding:20px;margin-top:28px}.boardhead{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;margin-bottom:16px}.boardhead h2{margin:0;font-size:17px}.swatches{display:grid;grid-template-columns:repeat(auto-fill,minmax(104px,1fr));grid-gap:8px;gap:8px}.swatch{display:flex;align-items:center;gap:8px;padding:8px 10px;background:var(--card);border:1px solid var(--hairline);border-radius:var(--radius);color:var(--muted);font-size:13px;min-height:0;text-align:left}.swatch:hover{background:var(--card);filter:none}.swatch.on,.swatch:hover{border-color:var(--accent);color:var(--text)}.swatch.on{box-shadow:inset 0 0 0 1px var(--accent)}.chip{width:18px;height:18px;border-radius:50%;border:1px solid var(--hairline);flex:none}.swatchname{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.boardnote{margin:14px 0 0;font-size:13px;color:var(--muted)}.homehead{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:4px}.homehead h1{margin:0}.front{max-width:1040px;padding-top:28px}.front .pick h1{font-size:1.6rem;font-weight:700;letter-spacing:-.02em;margin:0 0 16px}.monthrev{display:flex;align-items:center;justify-content:space-between;gap:16px;max-width:420px;margin:0 0 18px;padding:12px 16px;border:1px solid var(--hairline);border-radius:var(--radius);background:var(--card);color:inherit;text-decoration:none}.monthrev:hover{border-color:var(--accent)}.monthrev-label{display:block;font-size:12px;font-weight:600;color:var(--muted)}.monthrev-total{display:block;font-size:24px;letter-spacing:-.02em;white-space:nowrap}.monthrev-chart{width:160px;max-width:45%;height:44px;flex:none}.monthrev-bar{fill:var(--accent);transform-box:fill-box;transform-origin:bottom;animation:monthrev-rise .6s cubic-bezier(.2,.8,.2,1) both}@keyframes monthrev-rise{0%{transform:scaleY(0)}}.monthrev-change{display:inline-block;margin-top:2px;font-size:12px;font-weight:700}.monthrev-change.up{color:#16a34a}.monthrev-change.down{color:var(--danger)}@media (prefers-reduced-motion:reduce){.monthrev-bar{animation:none}}.welcome{margin:0 0 2px;font-size:15px;font-weight:600;color:var(--muted)}.tool.locked h2,.tool.locked p{opacity:.6}.tool-lock{display:inline-block;margin-top:10px;padding:3px 10px;border-radius:999px;background:color-mix(in srgb,var(--accent) 14%,transparent);color:var(--accent);font-size:12px;font-weight:600}